forked from sheetjs/docs.sheetjs.com
upgrade docusaurus to 3.2.1
This commit is contained in:
parent
2e44e0c2c8
commit
0fda6d46ab
@ -119,8 +119,8 @@ function SheetJSTestDropbox() {
|
||||
|
||||
## Other Notes
|
||||
|
||||
`src/theme/Admonition` was swizzled from 2.4.1 to enable `pass` for hiding
|
||||
`src/theme/Admonition` was swizzled from 3.2.1 to enable `pass` for hiding
|
||||
header text. See Docusaurus issue 8568 for more details.
|
||||
|
||||
`src/theme/prism-include-languages.js` was swizzled from 2.4.1 to support the
|
||||
`src/theme/prism-include-languages.js` was swizzled from 3.2.1 to support the
|
||||
Liquid language. See Docusaurus issue 6872 for more details.
|
@ -50,7 +50,7 @@ Once installed, the library can be imported under the name `xlsx`:
|
||||
import { read, writeFileXLSX } from "xlsx";
|
||||
```
|
||||
|
||||
The ["Bundlers" demo](/docs/demos/bundler) includes examples for specific tools.
|
||||
The ["Bundlers" demo](/docs/demos/frontend/bundler) includes complete examples.
|
||||
|
||||
:::tip pass
|
||||
|
||||
@ -203,7 +203,7 @@ var XLSX = require("xlsx");
|
||||
var read = XLSX.read, utils = XLSX.utils;
|
||||
```
|
||||
|
||||
The ["Bundlers" demo](/docs/demos/bundler) includes examples for specific tools.
|
||||
The ["Bundlers" demo](/docs/demos/frontend/bundler) includes complete examples.
|
||||
|
||||
### Dynamic Imports
|
||||
|
||||
|
@ -19,8 +19,8 @@ The ["Common Spreadsheet Format"](/docs/csf/general) is a simple object
|
||||
representation of the core concepts of a workbook. [Utilities](/docs/api/utilities/)
|
||||
provide low-level tools for working with the object.
|
||||
|
||||
For friendly JS processing, there are utility functions for converting parts of
|
||||
a worksheet to/from an Array of Arrays. The [Tutorial](/docs/getting-started/example)
|
||||
SheetJS provides convenient methods for processing common JavaScript data
|
||||
structures. The [Export Tutorial](/docs/getting-started/examples/export)
|
||||
combines powerful JS Array methods with a network request library to download
|
||||
data, select the information we want and create a workbook file.
|
||||
|
||||
|
@ -66,7 +66,9 @@ The idiomatic JavaScript representation of the dataset is an array of objects.
|
||||
Variable names are typically taken from the first row. Those names are used as
|
||||
keys in each observation.
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>JS Data</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>JS Data</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
@ -518,47 +520,83 @@ for(var n = 1, mean = 0; n <= x.length; ++n) mean += (x[n-1] - mean)/n;
|
||||
|
||||
Let $M[x;m] = \frac{1}{m}\sum_{i=1}^{m}x_m$ be the mean of the first $m$ elements. Then:
|
||||
|
||||
<table style={bs}><tbody style={bs}><tr style={bs}><td style={bs}>
|
||||
<table style={bs}>
|
||||
<tbody style={bs}>
|
||||
<tr style={bs}>
|
||||
<td style={bs}>
|
||||
|
||||
$M[x;m+1]$
|
||||
|
||||
</td><td style={bs}>
|
||||
</td>
|
||||
<td style={bs}>
|
||||
|
||||
$= \frac{1}{m+1}\sum_{i=1}^{m+1} x_i$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}> </td><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}> </td>
|
||||
<td style={bs}>
|
||||
|
||||
$= \frac{1}{m+1}\sum_{i=1}^{m} x_i + \frac{x_{m+1}}{m+1}$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}> </td><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}> </td>
|
||||
<td style={bs}>
|
||||
|
||||
$= \frac{m}{m+1}(\frac{1}{m}\sum_{i=1}^{m} x_i) + \frac{x_{m+1}}{m+1}$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}> </td><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}> </td>
|
||||
<td style={bs}>
|
||||
|
||||
$= \frac{m}{m+1}M[x;m] + \frac{x_{m+1}}{m+1}$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}> </td><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}> </td>
|
||||
<td style={bs}>
|
||||
|
||||
$= (1 - \frac{1}{m+1})M[x;m] + \frac{x_{m+1}}{m+1}$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}> </td><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}> </td>
|
||||
<td style={bs}>
|
||||
|
||||
$= M[x;m] + \frac{x_{m+1}}{m+1} - \frac{1}{m+1}M[x;m]$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}> </td><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}> </td>
|
||||
<td style={bs}>
|
||||
|
||||
$= M[x;m] + \frac{1}{m+1}(x_{m+1}-M[x;m])$
|
||||
|
||||
</td></tr><tr style={bs}><td style={bs}>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={bs}>
|
||||
<td style={bs}>
|
||||
|
||||
$new\_mean$
|
||||
|
||||
</td><td style={bs}>
|
||||
</td>
|
||||
<td style={bs}>
|
||||
|
||||
$= old\_mean + (x_{m+1}-old\_mean) / (m+1)$
|
||||
|
||||
</td></tr></tbody></table>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
Switching to zero-based indexing, the relation matches the following expression:
|
||||
|
||||
|
@ -42,7 +42,9 @@ The DanfoJS `DataFrame`[^1] represents two-dimensional tabular data. It is the
|
||||
starting point for most DanfoJS data processing tasks. A `DataFrame` typically
|
||||
corresponds to one SheetJS worksheet[^2].
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>DanfoJS DataFrame</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>DanfoJS DataFrame</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
@ -294,11 +296,11 @@ function DanfoToXLS() {
|
||||
[^1]: See ["Dataframe"](https://danfo.jsdata.org/api-reference/dataframe) in the DanfoJS documentation
|
||||
[^2]: See ["Sheet Objects"](/docs/csf/sheet)
|
||||
[^3]: See ["danfo.readExcel"](https://danfo.jsdata.org/api-reference/input-output/danfo.read_excel) in the DanfoJS documentation.
|
||||
[^4]: See ["Reading Files"](/docs/api/parse-options/#parsing-options) for the full list of parsing options.
|
||||
[^4]: See ["Reading Files"](/docs/api/parse-options#parsing-options) for the full list of parsing options.
|
||||
[^5]: See ["File API" in "Local File Access"](/docs/demos/local/file#file-api) for more details.
|
||||
[^6]: See ["danfo.toExcel"](https://danfo.jsdata.org/api-reference/input-output/danfo.to_excel) in the DanfoJS documentation.
|
||||
[^7]: See [`writeFile` in "Writing Files"](/docs/api/write-options)
|
||||
[^8]: See ["Writing Files"](/docs/api/write-options/#writing-options) for the full list of writing options.
|
||||
[^8]: See ["Writing Files"](/docs/api/write-options#writing-options) for the full list of writing options.
|
||||
[^9]: See ["Creating a DataFrame"](https://danfo.jsdata.org/api-reference/dataframe/creating-a-dataframe) in the DanfoJS documentation.
|
||||
[^10]: See [`sheet_to_json` in "Utilities"](/docs/api/utilities/array#array-output)
|
||||
[^11]: See ["danfo.toJSON"](https://danfo.jsdata.org/api-reference/input-output/danfo.to_json) in the DanfoJS documentation.
|
||||
|
@ -22,8 +22,8 @@ results back to spreadsheets.
|
||||
- ["CSV Data Interchange"](#csv-data-interchange) uses SheetJS to process sheets
|
||||
and generate CSV data that TF.js can import.
|
||||
|
||||
- ["JSON Data Interchange"](#json-data-interchange) uses SheetJS to process
|
||||
sheets and generate rows of objects that can be post-processed.
|
||||
- ["JS Array Interchange"](#js-array-interchange) uses SheetJS to process sheets
|
||||
and generate rows of objects that can be post-processed.
|
||||
|
||||
:::info pass
|
||||
|
||||
|
@ -219,7 +219,9 @@ const petal_length = Float64Array.from(aoa.map(row => row[C]).slice(1));
|
||||
Some datasets are stored in tables where each row represents a variable and each
|
||||
column represents an observation:
|
||||
|
||||
<table><thead><tr><th>JavaScript</th><th>Spreadsheet</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>JavaScript</th><th>Spreadsheet</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
```js
|
||||
var aoa = [
|
||||
@ -332,7 +334,9 @@ function SheetJSeriesToRows() { return (<button onClick={() => {
|
||||
A single typed array can be converted to a pure JS array with `Array.from`. For
|
||||
columns, each value should be individually wrapped in an array:
|
||||
|
||||
<table><thead><tr><th>JavaScript</th><th>Spreadsheet</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>JavaScript</th><th>Spreadsheet</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
```js
|
||||
var data = [
|
||||
|
@ -58,7 +58,9 @@ The example [presidents sheet](https://sheetjs.com/pres.xlsx) has one header row
|
||||
with "Name" and "Index" columns. The natural JS representation is an object for
|
||||
each row, using the values in the first rows as keys:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>State</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>State</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -61,7 +61,9 @@ The example [presidents sheet](https://sheetjs.com/pres.xlsx) has one header row
|
||||
with "Name" and "Index" columns. The natural JS representation is an object for
|
||||
each row, using the values in the first rows as keys:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>State</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>State</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -91,7 +91,9 @@ The example [presidents sheet](https://sheetjs.com/pres.xlsx) has one header row
|
||||
with "Name" and "Index" columns. The natural JS representation is an object for
|
||||
each row, using the values in the first rows as keys:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>State</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>State</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -60,7 +60,9 @@ The example [presidents sheet](https://sheetjs.com/pres.xlsx) has one header row
|
||||
with "Name" and "Index" columns. The natural JS representation is an object for
|
||||
each row, using the values in the first rows as keys:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>State</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>State</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -171,7 +171,9 @@ The example [presidents sheet](https://sheetjs.com/pres.xlsx) has one header row
|
||||
with "Name" and "Index" columns. The natural JS representation is an object for
|
||||
each row, using the values in the first rows as keys:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>State</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>State</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -65,7 +65,7 @@ The following demos are in separate pages:
|
||||
<a href={item.href}>{item.label}</a>{item.customProps?.summary && (" - " + item.customProps.summary)}
|
||||
</li>);
|
||||
})}
|
||||
<li><a href="/docs/demos/frontend/bundler#dojo">Dojo Toolkit</a></li>
|
||||
<li><a href="/docs/demos/frontend/bundler#snowpack">Snowpack</a></li>
|
||||
<li><a href="/docs/demos/frontend/bundler#wmr">WMR</a></li>
|
||||
<li><a href="/docs/demos/frontend/bundler/#dojo">Dojo Toolkit</a></li>
|
||||
<li><a href="/docs/demos/frontend/bundler/#snowpack">Snowpack</a></li>
|
||||
<li><a href="/docs/demos/frontend/bundler/#wmr">WMR</a></li>
|
||||
</ul>
|
||||
|
@ -69,7 +69,7 @@ AstroJS has introduced a number of breaking changes in minor releases.
|
||||
|
||||
:::info pass
|
||||
|
||||
This demo uses ["Base64 Loader"](/docs/demos/static/vitejs#base64-loader)
|
||||
This demo uses ["Base64 Loader"](/docs/demos/static/vitejs#base64-plugin)
|
||||
from the ViteJS demo.
|
||||
|
||||
The ViteJS demo used the query `?b64` to identify files. To play nice with
|
||||
|
@ -69,7 +69,9 @@ imported from any component or script in the app.
|
||||
|
||||
For simplicity, this demo uses an "Array of Arrays"[^2] as the internal state.
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>Array of Arrays</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>Array of Arrays</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -47,9 +47,9 @@ projects that can use community modules. However, its "lean core" approach
|
||||
forces developers to learn iOS/Android programming or use community modules to
|
||||
provide basic app features.
|
||||
|
||||
The original Web View framework was PhoneGap/Cordova. The modern frameworks
|
||||
are built atop Cordova. Cordova is waning in popularity but it has a deep
|
||||
library of community modules to solve many problems.
|
||||
The original Web View framework was PhoneGap/Cordova. The modern frameworks are
|
||||
built atop Cordova. Cordova is waning in popularity but it has a deep library of
|
||||
community modules to solve many problems.
|
||||
|
||||
Before creating a new app, it is important to identify what features the app
|
||||
should support and investigate community modules. If there are popular modules
|
||||
|
@ -84,7 +84,9 @@ imported from any component or script in the app.
|
||||
|
||||
For simplicity, this demo uses an "Array of Arrays"[^2] as the internal state.
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>Array of Arrays</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>Array of Arrays</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
|
@ -9,6 +9,11 @@ sidebar_custom_props:
|
||||
import Tabs from '@theme/Tabs';
|
||||
import TabItem from '@theme/TabItem';
|
||||
|
||||
Structured Query Language ("SQL") is a popular declarative language for issuing
|
||||
commands to database servers.
|
||||
|
||||
## Raw SQL Operations
|
||||
|
||||
### Generating Tables
|
||||
|
||||
This example will fetch https://sheetjs.com/data/cd.xls, scan the columns of the
|
||||
@ -148,7 +153,7 @@ types and other database minutiae.
|
||||
|
||||
### Other SQL Databases
|
||||
|
||||
The `generate_sql` function from ["Building Schemas from Worksheets"](#building-schemas-from-worksheets)
|
||||
The `generate_sql` function from ["Generating Tables"](#generating-tables)
|
||||
can be adapted to generate SQL statements for a variety of databases, including:
|
||||
|
||||
**PostgreSQL**
|
||||
|
@ -21,8 +21,8 @@ libraries in production applications.
|
||||
:::
|
||||
|
||||
The IndexedDB API provides an in-browser sandboxed local data store for JSON
|
||||
objects. Like the [Local Storage API](/docs/demos/data/storageapi), IndexedDB is
|
||||
a popular choice for offline storage.
|
||||
objects. Like the [Local Storage API](/docs/demos/local/storageapi), IndexedDB
|
||||
is a popular choice for offline storage.
|
||||
|
||||
## Wrapper Libraries
|
||||
|
||||
|
@ -26,7 +26,7 @@ of code that are run in NodeJS or other server-side JS platforms. While SheetJS
|
||||
libraries can run in server-side environments, the cloud platforms can corrupt
|
||||
form data. This can be disabled with cloud-specific configuration:
|
||||
|
||||
- [AWS Lambda Functions](/docs/demos/cloud/aws#aws-lambda-functions)
|
||||
- [AWS Lambda Functions](/docs/demos/cloud/aws#lambda-functions)
|
||||
- [Azure Functions](/docs/demos/cloud/azure#azure-functions)
|
||||
- [GitHub Actions](/docs/demos/cloud/github)
|
||||
- [Deno Deploy](/docs/demos/cloud/deno)
|
||||
@ -38,7 +38,7 @@ files typically contain binary characters. Cloud storage APIs can corrupt
|
||||
binary data, so special care must be taken.
|
||||
|
||||
- [Amazon Simple Storage Service (S3)](/docs/demos/cloud/aws#s3-storage)
|
||||
- [Azure Blob Storage](/docs/demos/cloud/azure#azure-blob-storage)
|
||||
- [Azure Blob Storage](/docs/demos/cloud/azure#blob-storage)
|
||||
|
||||
### File Hosting
|
||||
|
||||
|
@ -64,9 +64,9 @@ npx office-addin-usage-data list
|
||||
The [SheetJS NodeJS module](/docs/getting-started/installation/nodejs) can be
|
||||
imported from scripts in an Excel Custom Functions project.
|
||||
|
||||
The [`sheet_to_json`](/docs/api/utilities#json) helper function can generate
|
||||
arrays of arrays of values based on the worksheet data. Excel custom functions
|
||||
transparently treat these as Dynamic Arrays.
|
||||
The [`sheet_to_json`](/docs/api/utilities/array#array-output) helper function
|
||||
can generate arrays of arrays of values based on the worksheet data. Excel
|
||||
custom functions transparently treat these as Dynamic Arrays.
|
||||
|
||||
This example fetches a file, parses the data, and extracts the first worksheet:
|
||||
|
||||
|
@ -19,8 +19,9 @@ to a remote server.
|
||||
The following diagrams show the normal and Web Worker flows when exporting a
|
||||
dataset. The regions with a red background mark when the browser is frozen.
|
||||
|
||||
<table><thead><tr><th>Normal Export</th><th>Web Worker Export</th></tr>
|
||||
</thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Normal Export</th><th>Web Worker Export</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
@ -497,7 +498,7 @@ self.addEventListener('message', (e) => {
|
||||
### Streaming Write
|
||||
|
||||
A more general discussion, including row-oriented processing demos, is included
|
||||
in the ["Large Datasets"](/docs/demos/stream#browser) demo.
|
||||
in the ["Large Datasets"](/docs/demos/bigdata/stream#browser) demo.
|
||||
|
||||
`XLSX.stream.to_csv` incrementally generates CSV rows.
|
||||
|
||||
|
@ -21,10 +21,11 @@ Since many of the techniques only work in a few engines, they are not embedded
|
||||
in the library. They are recommended only when traditional approaches falter.
|
||||
|
||||
<ul>{useCurrentSidebarCategory().items.map((item, index) => {
|
||||
const listyle = (item.customProps?.icon) ? {
|
||||
const listyle = (item.customProps?.icon) ? ({
|
||||
listStyleImage: `url("${item.customProps.icon}")`
|
||||
} : {};
|
||||
}) : ({});
|
||||
return (<li style={listyle} {...(item.customProps?.class ? {className: item.customProps.class}: {})}>
|
||||
<a href={item.href}>{item.label}</a>{item.customProps?.summary && (" - " + item.customProps.summary)}
|
||||
<a href={item.href}>{item.label}</a>
|
||||
<span>{item.customProps?.summary && (" - " + item.customProps.summary)}</span>
|
||||
</li>);
|
||||
})}</ul>
|
||||
|
@ -19,8 +19,8 @@ more performant engine like [`v8`](/docs/demos/engines/v8#rust)
|
||||
[SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing
|
||||
data from spreadsheets.
|
||||
|
||||
The ["Complete Example"](#integration-example) section creates a command-line
|
||||
tool for reading data from spreadsheets and generating CSV rows.
|
||||
The ["Complete Example"](#complete-example) section creates a command-line tool
|
||||
for reading data from spreadsheets and generating CSV rows.
|
||||
|
||||
## Integration Details
|
||||
|
||||
|
@ -171,6 +171,6 @@ NodeJS and Deno, Adobe UXP and other platforms.
|
||||
This demo has been moved [to a dedicated page](/docs/demos/engines/v8).
|
||||
The demo includes examples in C++ and Rust.
|
||||
|
||||
The ["Python + Pandas" demo](/docs/demos/engines/pandas) uses V8 with Python.
|
||||
The ["Python + Pandas" demo](/docs/demos/math/pandas) uses V8 with Python.
|
||||
|
||||
[^1]: See ["Initialize Hermes"](/docs/demos/engines/hermes#initialize-hermes) in the Hermes demo.
|
@ -23,8 +23,8 @@ in the [issue tracker](https://git.sheetjs.com/sheetjs/docs.sheetjs.com/issues)
|
||||
- [`Web Workers`](/docs/demos/bigdata/worker)
|
||||
- [`Typed Arrays`](/docs/demos/math)
|
||||
- [`Local File Access`](/docs/demos/local/file)
|
||||
- [`LocalStorage and SessionStorage`](/docs/demos/data/storageapi)
|
||||
- [`Web SQL Database`](/docs/demos/data/websql)
|
||||
- [`LocalStorage and SessionStorage`](/docs/demos/local/storageapi)
|
||||
- [`Web SQL Database`](/docs/demos/local/websql)
|
||||
- [`IndexedDB`](/docs/demos/local/indexeddb)
|
||||
|
||||
### Web Frameworks
|
||||
@ -44,8 +44,8 @@ in the [issue tracker](https://git.sheetjs.com/sheetjs/docs.sheetjs.com/issues)
|
||||
- [`react-data-grid`](/docs/demos/grid/rdg)
|
||||
- [`glide-data-grid`](/docs/demos/grid/gdg)
|
||||
- [`vue3-table-lite`](/docs/demos/grid/vtl)
|
||||
- [`angular-ui-grid`](/docs/demos/grid#angular-ui-grid)
|
||||
- [`material ui`](/docs/demos/grid#material-ui-table)
|
||||
- [`angular-ui-grid`](/docs/demos/grid/#angular-ui-grid)
|
||||
- [`material ui`](/docs/demos/grid/mui)
|
||||
|
||||
### iOS and Android Mobile Apps
|
||||
|
||||
@ -107,8 +107,8 @@ in the [issue tracker](https://git.sheetjs.com/sheetjs/docs.sheetjs.com/issues)
|
||||
### Platforms and Integrations
|
||||
|
||||
- [`Command-Line Tools`](/docs/demos/cli)
|
||||
- [`NodeJS Server-Side Processing`](/docs/demos/net/server#nodejs)
|
||||
- [`Deno Server-Side Processing`](/docs/demos/net/server#deno)
|
||||
- [`NodeJS Server-Side Processing`](/docs/demos/net/server/#nodejs)
|
||||
- [`Deno Server-Side Processing`](/docs/demos/net/server/#deno)
|
||||
- [`Headless Automation`](/docs/demos/net/headless)
|
||||
- [`Databases and Structured Data Stores`](/docs/demos/data)
|
||||
- [`NoSQL and Unstructured Data Stores`](/docs/demos/data)
|
||||
@ -116,18 +116,17 @@ in the [issue tracker](https://git.sheetjs.com/sheetjs/docs.sheetjs.com/issues)
|
||||
|
||||
### Bundlers and Tooling
|
||||
|
||||
- [`browserify`](/docs/demos/frontend/bundler#browserify)
|
||||
- [`bun`](/docs/demos/frontend/bundler#bun)
|
||||
- [`browserify`](/docs/demos/frontend/bundler/browserify)
|
||||
- [`bun`]((/docs/getting-started/installation/bun#bundling)
|
||||
- [`esbuild`](/docs/demos/frontend/bundler/esbuild)
|
||||
- [`parcel`](/docs/demos/frontend/bundler#parcel)
|
||||
- [`parcel`](/docs/demos/frontend/bundler/parcel)
|
||||
- [`requirejs`](/docs/demos/frontend/bundler/requirejs)
|
||||
- [`rollup`](/docs/demos/frontend/bundler#rollup)
|
||||
- [`snowpack`](/docs/demos/frontend/bundler#snowpack)
|
||||
- [`swc`](/docs/demos/frontend/bundler#swc)
|
||||
- [`rollup`](/docs/demos/frontend/bundler/rollup)
|
||||
- [`swc`](/docs/demos/frontend/bundler/swcpack)
|
||||
- [`systemjs`](/docs/demos/frontend/bundler/systemjs)
|
||||
- [`vite`](/docs/demos/frontend/bundler#vite)
|
||||
- [`vite`](/docs/demos/frontend/bundler/vitejs)
|
||||
- [`webpack`](/docs/demos/frontend/bundler/webpack)
|
||||
- [`wmr`](/docs/demos/frontend/bundler#wmr)
|
||||
- [`wmr`](/docs/demos/frontend/bundler/#wmr)
|
||||
|
||||
### Other Programming Languages
|
||||
|
||||
|
@ -99,13 +99,13 @@ var XLSX = require("xlsx");
|
||||
var workbook = XLSX.readFile(path);
|
||||
```
|
||||
|
||||
Electron APIs have changed over time. The [`electron` demo](/docs/demos/desktop#electron)
|
||||
Electron APIs have changed over time. The [`electron` demo](/docs/demos/desktop/electron)
|
||||
shows a complete example and details the required version-specific settings.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="reactnative" label="React Native">
|
||||
|
||||
[The React Native Demo](/docs/demos/mobile#rn-file-plugins) covers tested plugins.
|
||||
[The React Native Demo](/docs/demos/mobile/reactnative#rn-file-plugins) covers tested plugins.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="extendscript" label="Photoshop">
|
||||
@ -130,7 +130,8 @@ var thisFile = File.openDialog("Select a spreadsheet");
|
||||
var workbook = XLSX.readFile(thisFile.absoluteURI);
|
||||
```
|
||||
|
||||
The [`extendscript` demo](/docs/demos/extendscript) includes a more complex example.
|
||||
The [`extendscript` demo](/docs/demos/extensions/extendscript) includes complete
|
||||
examples for Photoshop and InDesign.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="deno" label="Deno">
|
||||
@ -330,7 +331,7 @@ const server = http.createServer((req, res) => {
|
||||
}).listen(process.env.PORT || 7262);
|
||||
```
|
||||
|
||||
The [`server` demo](/docs/demos/server) has more advanced examples.
|
||||
The [`server` demo](/docs/demos/net/server) includes more advanced examples.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="deno" label="Deno">
|
||||
@ -434,7 +435,8 @@ req.onload = function(e) {
|
||||
req.send();
|
||||
```
|
||||
|
||||
The [`xhr` demo](/docs/demos/network) includes a longer discussion and more examples.
|
||||
The [HTTP Downloads demo](/docs/demos/net/network) includes examples using
|
||||
browser APIs and wrapper libraries.
|
||||
|
||||
https://oss.sheetjs.com/sheetjs/ajax.html shows fallback approaches for IE6+.
|
||||
|
||||
@ -727,7 +729,7 @@ var worksheet = XLSX.utils.aoa_to_sheet([
|
||||
]);
|
||||
```
|
||||
|
||||
["Array of Arrays Input"](/docs/api/utilities#array-of-arrays-input) describes
|
||||
["Array of Arrays Input"](/docs/api/utilities/array#array-of-arrays-input) describes
|
||||
the function and the optional `opts` argument in more detail.
|
||||
|
||||
|
||||
@ -742,7 +744,7 @@ generating a worksheet object. By default, it will generate a header row and
|
||||
one row per object in the array. The optional `opts` argument has settings to
|
||||
control the column order and header output.
|
||||
|
||||
["Array of Objects Input"](/docs/api/utilities#array-of-objects-input) describes
|
||||
["Array of Objects Input"](/docs/api/utilities/array#array-of-objects-input) describes
|
||||
the function and the optional `opts` argument in more detail.
|
||||
|
||||
#### Examples
|
||||
@ -798,7 +800,7 @@ is missing or no options are specified, the default name `Sheet1` is used.
|
||||
|
||||
#### Examples
|
||||
|
||||
The [Headless Demo](/docs/demos/headless) includes examples of
|
||||
The [Headless Demo](/docs/demos/net/headless) includes examples of
|
||||
server-side spreadsheet generation from HTML TABLE elements using headless
|
||||
Chromium ("Puppeteer") and other browsers ("Playwright")
|
||||
|
||||
@ -856,8 +858,8 @@ var workbook = XLSX.read(htmlstr, {type:"string"});
|
||||
<details>
|
||||
<summary><b>Chrome/Chromium Extension</b> (click to show)</summary>
|
||||
|
||||
The [`chrome` demo](/docs/demos/chromium/) shows a complete example and details
|
||||
the required permissions and other settings.
|
||||
The ["Chrome and Chromium" demo](/docs/demos/extensions/chromium/) includes a
|
||||
complete example and enumerates the required permissions and other settings.
|
||||
|
||||
In an extension, it is recommended to generate the workbook in a content script
|
||||
and pass the object back to the extension:
|
||||
|
@ -155,7 +155,7 @@ XLSX.utils.sheet_add_aoa(worksheet, [
|
||||
], { origin: "B3" });
|
||||
```
|
||||
|
||||
["Array of Arrays Input"](/docs/api/utilities#array-of-arrays-input) describes the
|
||||
["Array of Arrays Input"](/docs/api/utilities/array#array-of-arrays-input) describes the
|
||||
function and the optional `opts` argument in more detail.
|
||||
|
||||
#### Examples
|
||||
|
@ -237,13 +237,13 @@ var XLSX = require("xlsx");
|
||||
XLSX.writeFile(workbook, "out.xlsb");
|
||||
```
|
||||
|
||||
Electron APIs have changed over time. The [`electron` demo](/docs/demos/desktop#electron)
|
||||
Electron APIs have changed over time. The [`electron` demo](/docs/demos/desktop/electron)
|
||||
shows a complete example and details the required version-specific settings.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="reactnative" label="React Native">
|
||||
|
||||
[The React Native Demo](/docs/demos/mobile#rn-file-plugins) covers tested plugins.
|
||||
[The React Native Demo](/docs/demos/mobile/reactnative#rn-file-plugins) covers tested plugins.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="extendscript" label="Photoshop">
|
||||
@ -260,12 +260,13 @@ var thisFile = File.saveDialog("Select an output file", "*.xlsx;*.xls");
|
||||
XLSX.writeFile(workbook, thisFile.absoluteURI);
|
||||
```
|
||||
|
||||
The [`extendscript` demo](/docs/demos/extendscript) includes a more complex example.
|
||||
The [`extendscript` demo](/docs/demos/extensions/extendscript) includes complete
|
||||
examples for Photoshop and InDesign.
|
||||
|
||||
</TabItem>
|
||||
<TabItem value="headless" label="Headless">
|
||||
|
||||
The [`headless` demo](/docs/demos/headless) includes complete
|
||||
The [`headless` demo](/docs/demos/net/headless) includes complete
|
||||
examples of converting HTML TABLE elements to XLSB workbooks using Puppeteer
|
||||
and other headless automation tools.
|
||||
|
||||
@ -502,8 +503,8 @@ is to adjust the server process or Lambda function to accept Base64 strings.
|
||||
|
||||
:::
|
||||
|
||||
A complete example using XHR is [included in the XHR demo](/docs/demos/network),
|
||||
along with examples for fetch and wrapper libraries.
|
||||
The [HTTP Uploads demo](/docs/demos/net/upload) includes examples using browser
|
||||
APIs and wrapper libraries.
|
||||
|
||||
Under normal circumstances, a `Blob` can be generated from the `array` output:
|
||||
|
||||
@ -592,7 +593,8 @@ var aoa = XLSX.utils.sheet_to_json(worksheet, {...opts, header: 1});
|
||||
The `sheet_to_json` utility function walks a workbook in row-major order,
|
||||
generating an array of objects. The second `opts` argument controls a number of
|
||||
export decisions including the type of values (JS values or formatted text). The
|
||||
["JSON"](/docs/api/utilities#json) section describes the argument in more detail.
|
||||
["Array Output"](/docs/api/utilities/array#array-output) section describes
|
||||
supported options.
|
||||
|
||||
By default, `sheet_to_json` scans the first row and uses the values as headers.
|
||||
With the `header: 1` option, the function exports an array of arrays of values.
|
||||
@ -845,4 +847,4 @@ Readable Stream.
|
||||
- `XLSX.stream.to_html` is the streaming version of `XLSX.utils.sheet_to_html`.
|
||||
- `XLSX.stream.to_json` is the streaming version of `XLSX.utils.sheet_to_json`.
|
||||
|
||||
Examples are included in ["Large Datasets"](/docs/demos/stream#streaming-write)
|
||||
Examples are included in ["Large Datasets"](/docs/demos/bigdata/stream#streaming-write)
|
||||
|
@ -44,10 +44,9 @@ expected to be an array of row metadata objects.
|
||||
This example creates a workbook that includes custom row heights, hidden rows,
|
||||
and row outline levels.
|
||||
|
||||
<table><thead><tr>
|
||||
<th>Excel for Windows</th>
|
||||
<th>Excel for Mac</th>
|
||||
</tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Excel for Windows</th><th>Excel for Mac</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![Excel for Windows](pathname:///rowprops/win.png)
|
||||
|
||||
|
@ -27,11 +27,13 @@ The ["Functions"](#functions) section describes the related functions.
|
||||
|
||||
The spiritual equivalent of the grid in JavaScript is an array of arrays:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>Array of Arrays</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>Array of Arrays</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
</td><td>
|
||||
</td><td>
|
||||
|
||||
```js
|
||||
[
|
||||
@ -44,7 +46,8 @@ The spiritual equivalent of the grid in JavaScript is an array of arrays:
|
||||
]
|
||||
```
|
||||
|
||||
</td></tr></tbody></table>
|
||||
</td></tr></tbody>
|
||||
</table>
|
||||
|
||||
Each array within the structure corresponds to one row. Individual data points
|
||||
can be read by indexing by row index and by column index:
|
||||
@ -67,11 +70,13 @@ var value_at_A2 = aoa[1][0]; // Bill Clinton
|
||||
|
||||
Arrays of objects are commonly used to represent rows from a database:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>Array of Objects</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>Array of Objects</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
![`pres.xlsx` data](pathname:///pres.png)
|
||||
|
||||
</td><td>
|
||||
</td><td>
|
||||
|
||||
```js
|
||||
[
|
||||
@ -83,7 +88,8 @@ Arrays of objects are commonly used to represent rows from a database:
|
||||
]
|
||||
```
|
||||
|
||||
</td></tr></tbody></table>
|
||||
</td></tr></tbody>
|
||||
</table>
|
||||
|
||||
Each object within the structure corresponds to one data row. The first row of
|
||||
the spreadsheet is interpreted as the header row.
|
||||
@ -141,7 +147,7 @@ The function takes an options argument:
|
||||
|`sheetStubs` | false | Create cell objects of type `z` for `null` values |
|
||||
|`nullError` | false | If true, emit `#NULL!` error cells for `null` values |
|
||||
|`UTC` | false | If true, dates are interpreted using UTC methods ** |
|
||||
|`dense` | false | Emit [dense sheet object](docs/csf/sheet#dense-mode) |
|
||||
|`dense` | false | Emit [dense sheets](/docs/csf/sheet#dense-mode) |
|
||||
|
||||
[UTC option is explained in "Dates"](/docs/csf/features/dates#utc-option)
|
||||
|
||||
@ -202,7 +208,9 @@ accepts an options argument:
|
||||
|
||||
The [example worksheet](#example-sheet) can be built up in the following order:
|
||||
|
||||
<table><thead><tr><th>Spreadsheet</th><th>Operations</th></tr></thead><tbody><tr><td>
|
||||
<table>
|
||||
<thead><tr><th>Spreadsheet</th><th>Operations</th></tr></thead>
|
||||
<tbody><tr><td>
|
||||
|
||||
<table>
|
||||
<tr {...r}><td>S</td><td>h</td><td>e</td><td>e</td><td>t</td><td>J</td><td>S</td></tr>
|
||||
@ -288,7 +296,7 @@ default column order is determined by the first appearance of the field using
|
||||
|`skipHeader` | false | If true, do not include header row in output |
|
||||
|`nullError` | false | If true, emit `#NULL!` error cells for `null` values |
|
||||
|`UTC` | false | If true, dates are interpreted using UTC methods ** |
|
||||
|`dense` | false | Emit [dense sheet object](docs/csf/sheet#dense-mode) |
|
||||
|`dense` | false | Emit [dense sheets](/docs/csf/sheet#dense-mode) |
|
||||
|
||||
[UTC option is explained in "Dates"](/docs/csf/features/dates#utc-option)
|
||||
|
||||
|
@ -65,7 +65,7 @@ The generated table will include special data attributes on each `TD` element:
|
||||
|
||||
| Attribute | Description |
|
||||
|:----------|:-------------------------------------------------------------|
|
||||
| `data-t` | Override [Cell Type](/docs/csf/cell#data-types) |
|
||||
| `data-t` | Override [Cell Type](/docs/csf/cell#cell-types) |
|
||||
| `data-v` | Override Cell Value |
|
||||
| `data-z` | Override [Number Format](/docs/csf/features/nf) |
|
||||
|
||||
|
@ -332,7 +332,7 @@ The `fs` module is automatically loaded in scripts using `require`:
|
||||
var XLSX = require("xlsx"); // automatically loads `fs`
|
||||
```
|
||||
|
||||
Using the [ESM import](/docs/getting-started/installation/nodejs/#esm-import),
|
||||
Using the [ESM import](/docs/getting-started/installation/nodejs#esm-import),
|
||||
the `fs` module must be imported and passed to the library:
|
||||
|
||||
```js
|
||||
|
@ -1,15 +1,19 @@
|
||||
import {themes as prismThemes} from 'prism-react-renderer';
|
||||
const math = require('remark-math');
|
||||
const katex = require('rehype-katex');
|
||||
|
||||
// @ts-check
|
||||
// Note: type annotations allow type checking and IDEs autocompletion
|
||||
|
||||
/** @typedef { import('prism-react-renderer').PrismTheme['styles'] } PrismThemeStyle */
|
||||
/** @typedef { import('prism-react-renderer').PrismTheme['styles'][number]['style'] } PrismThemeEntry */
|
||||
|
||||
/**
|
||||
/**
|
||||
Updates styles array from prisma theme based off token type
|
||||
@type {(theme: PrismThemeStyle, replace: Record<string, PrismThemeEntry>) => PrismThemeStyle}
|
||||
@type {(theme: PrismThemeStyle, replace: Record<string, PrismThemeEntry>) => PrismThemeStyle}
|
||||
*/
|
||||
const updateThemeStyles = (styles, replace) => {
|
||||
const copy = structuredClone(styles)
|
||||
const copy = structuredClone(styles);
|
||||
|
||||
const types = Object.keys(replace)
|
||||
copy.forEach(style => {
|
||||
@ -23,11 +27,8 @@ const updateThemeStyles = (styles, replace) => {
|
||||
return copy
|
||||
}
|
||||
|
||||
const lightCodeTheme = require('prism-react-renderer/themes/github');
|
||||
const darkCodeTheme = require('prism-react-renderer/themes/dracula');
|
||||
|
||||
const math = require('remark-math');
|
||||
const katex = require('rehype-katex');
|
||||
const lightCodeTheme = prismThemes.github;
|
||||
const darkCodeTheme = prismThemes.dracula;
|
||||
|
||||
/** @type {import('@docusaurus/types').Config} */
|
||||
const config = {
|
||||
|
@ -13,25 +13,30 @@
|
||||
"write-translations": "docusaurus write-translations",
|
||||
"write-heading-ids": "docusaurus write-heading-ids"
|
||||
},
|
||||
"overrides": {
|
||||
"@cmfcmf/docusaurus-search-local": {
|
||||
"@docusaurus/core": "3.2.1"
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@cmfcmf/docusaurus-search-local": "0.11.0",
|
||||
"@docusaurus/core": "2.4.1",
|
||||
"@docusaurus/plugin-client-redirects": "2.4.1",
|
||||
"@docusaurus/preset-classic": "2.4.1",
|
||||
"@docusaurus/theme-common": "2.4.1",
|
||||
"@docusaurus/theme-live-codeblock": "2.4.1",
|
||||
"@docusaurus/theme-mermaid": "2.4.1",
|
||||
"@mdx-js/react": "1.6.22",
|
||||
"clsx": "1.2.1",
|
||||
"prism-react-renderer": "1.3.5",
|
||||
"react": "17.0.2",
|
||||
"react-dom": "17.0.2",
|
||||
"rehype-katex": "4.0.0",
|
||||
"remark-math": "3.0.1",
|
||||
"@cmfcmf/docusaurus-search-local": "1.1.0",
|
||||
"@docusaurus/core": "3.2.1",
|
||||
"@docusaurus/plugin-client-redirects": "3.2.1",
|
||||
"@docusaurus/preset-classic": "3.2.1",
|
||||
"@docusaurus/theme-common": "3.2.1",
|
||||
"@docusaurus/theme-live-codeblock": "3.2.1",
|
||||
"@docusaurus/theme-mermaid": "3.2.1",
|
||||
"@mdx-js/react": "3.0.1",
|
||||
"clsx": "2.1.0",
|
||||
"prism-react-renderer": "2.3.1",
|
||||
"react": "18.2.0",
|
||||
"react-dom": "18.2.0",
|
||||
"rehype-katex": "7.0.0",
|
||||
"remark-math": "6.0.0",
|
||||
"xlsx": "https://cdn.sheetjs.com/xlsx-0.20.2/xlsx-0.20.2.tgz"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@docusaurus/module-type-aliases": "2.4.1"
|
||||
"@docusaurus/module-type-aliases": "3.2.1"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
|
39
docz/src/theme/Admonition/Layout/index.js
Normal file
39
docz/src/theme/Admonition/Layout/index.js
Normal file
@ -0,0 +1,39 @@
|
||||
import React from 'react';
|
||||
import clsx from 'clsx';
|
||||
import {ThemeClassNames} from '@docusaurus/theme-common';
|
||||
import styles from './styles.module.css';
|
||||
function AdmonitionContainer({type, className, children}) {
|
||||
return (
|
||||
<div
|
||||
className={clsx(
|
||||
ThemeClassNames.common.admonition,
|
||||
ThemeClassNames.common.admonitionType(type),
|
||||
styles.admonition,
|
||||
className,
|
||||
)}>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
function AdmonitionHeading({icon, title}) {
|
||||
return (
|
||||
<div className={styles.admonitionHeading}>
|
||||
<span className={styles.admonitionIcon}>{icon}</span>
|
||||
{title}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
function AdmonitionContent({children}) {
|
||||
return children ? (
|
||||
<div className={styles.admonitionContent}>{children}</div>
|
||||
) : null;
|
||||
}
|
||||
export default function AdmonitionLayout(props) {
|
||||
const {type, icon, title, children, className} = props;
|
||||
return (
|
||||
<AdmonitionContainer type={type} className={className}>
|
||||
{title != "pass" && <AdmonitionHeading title={title} icon={icon} />}
|
||||
<AdmonitionContent>{children}</AdmonitionContent>
|
||||
</AdmonitionContainer>
|
||||
);
|
||||
}
|
@ -6,6 +6,10 @@
|
||||
font: var(--ifm-heading-font-weight) var(--ifm-h5-font-size) /
|
||||
var(--ifm-heading-line-height) var(--ifm-heading-font-family);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* Heading alone without content (does not handle fragment content) */
|
||||
.admonitionHeading:not(:last-child) {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
|
@ -1,180 +1,18 @@
|
||||
import React from 'react';
|
||||
import clsx from 'clsx';
|
||||
import {ThemeClassNames} from '@docusaurus/theme-common';
|
||||
import Translate from '@docusaurus/Translate';
|
||||
import styles from './styles.module.css';
|
||||
function NoteIcon() {
|
||||
return (
|
||||
<svg viewBox="0 0 14 16">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M6.3 5.69a.942.942 0 0 1-.28-.7c0-.28.09-.52.28-.7.19-.18.42-.28.7-.28.28 0 .52.09.7.28.18.19.28.42.28.7 0 .28-.09.52-.28.7a1 1 0 0 1-.7.3c-.28 0-.52-.11-.7-.3zM8 7.99c-.02-.25-.11-.48-.31-.69-.2-.19-.42-.3-.69-.31H6c-.27.02-.48.13-.69.31-.2.2-.3.44-.31.69h1v3c.02.27.11.5.31.69.2.2.42.31.69.31h1c.27 0 .48-.11.69-.31.2-.19.3-.42.31-.69H8V7.98v.01zM7 2.3c-3.14 0-5.7 2.54-5.7 5.68 0 3.14 2.56 5.7 5.7 5.7s5.7-2.55 5.7-5.7c0-3.15-2.56-5.69-5.7-5.69v.01zM7 .98c3.86 0 7 3.14 7 7s-3.14 7-7 7-7-3.12-7-7 3.14-7 7-7z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
function TipIcon() {
|
||||
return (
|
||||
<svg viewBox="0 0 12 16">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M6.5 0C3.48 0 1 2.19 1 5c0 .92.55 2.25 1 3 1.34 2.25 1.78 2.78 2 4v1h5v-1c.22-1.22.66-1.75 2-4 .45-.75 1-2.08 1-3 0-2.81-2.48-5-5.5-5zm3.64 7.48c-.25.44-.47.8-.67 1.11-.86 1.41-1.25 2.06-1.45 3.23-.02.05-.02.11-.02.17H5c0-.06 0-.13-.02-.17-.2-1.17-.59-1.83-1.45-3.23-.2-.31-.42-.67-.67-1.11C2.44 6.78 2 5.65 2 5c0-2.2 2.02-4 4.5-4 1.22 0 2.36.42 3.22 1.19C10.55 2.94 11 3.94 11 5c0 .66-.44 1.78-.86 2.48zM4 14h5c-.23 1.14-1.3 2-2.5 2s-2.27-.86-2.5-2z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
function DangerIcon() {
|
||||
return (
|
||||
<svg viewBox="0 0 12 16">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M5.05.31c.81 2.17.41 3.38-.52 4.31C3.55 5.67 1.98 6.45.9 7.98c-1.45 2.05-1.7 6.53 3.53 7.7-2.2-1.16-2.67-4.52-.3-6.61-.61 2.03.53 3.33 1.94 2.86 1.39-.47 2.3.53 2.27 1.67-.02.78-.31 1.44-1.13 1.81 3.42-.59 4.78-3.42 4.78-5.56 0-2.84-2.53-3.22-1.25-5.61-1.52.13-2.03 1.13-1.89 2.75.09 1.08-1.02 1.8-1.86 1.33-.67-.41-.66-1.19-.06-1.78C8.18 5.31 8.68 2.45 5.05.32L5.03.3l.02.01z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
function InfoIcon() {
|
||||
return (
|
||||
<svg viewBox="0 0 14 16">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M7 2.3c3.14 0 5.7 2.56 5.7 5.7s-2.56 5.7-5.7 5.7A5.71 5.71 0 0 1 1.3 8c0-3.14 2.56-5.7 5.7-5.7zM7 1C3.14 1 0 4.14 0 8s3.14 7 7 7 7-3.14 7-7-3.14-7-7-7zm1 3H6v5h2V4zm0 6H6v2h2v-2z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
function CautionIcon() {
|
||||
return (
|
||||
<svg viewBox="0 0 16 16">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
d="M8.893 1.5c-.183-.31-.52-.5-.887-.5s-.703.19-.886.5L.138 13.499a.98.98 0 0 0 0 1.001c.193.31.53.501.886.501h13.964c.367 0 .704-.19.877-.5a1.03 1.03 0 0 0 .01-1.002L8.893 1.5zm.133 11.497H6.987v-2.003h2.039v2.003zm0-3.004H6.987V5.987h2.039v4.006z"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/consistent-indexed-object-style
|
||||
const AdmonitionConfigs = {
|
||||
note: {
|
||||
infimaClassName: 'secondary',
|
||||
iconComponent: NoteIcon,
|
||||
label: (
|
||||
<Translate
|
||||
id="theme.admonition.note"
|
||||
description="The default label used for the Note admonition (:::note)">
|
||||
note
|
||||
</Translate>
|
||||
),
|
||||
},
|
||||
tip: {
|
||||
infimaClassName: 'success',
|
||||
iconComponent: TipIcon,
|
||||
label: (
|
||||
<Translate
|
||||
id="theme.admonition.tip"
|
||||
description="The default label used for the Tip admonition (:::tip)">
|
||||
tip
|
||||
</Translate>
|
||||
),
|
||||
},
|
||||
danger: {
|
||||
infimaClassName: 'danger',
|
||||
iconComponent: DangerIcon,
|
||||
label: (
|
||||
<Translate
|
||||
id="theme.admonition.danger"
|
||||
description="The default label used for the Danger admonition (:::danger)">
|
||||
danger
|
||||
</Translate>
|
||||
),
|
||||
},
|
||||
info: {
|
||||
infimaClassName: 'info',
|
||||
iconComponent: InfoIcon,
|
||||
label: (
|
||||
<Translate
|
||||
id="theme.admonition.info"
|
||||
description="The default label used for the Info admonition (:::info)">
|
||||
info
|
||||
</Translate>
|
||||
),
|
||||
},
|
||||
caution: {
|
||||
infimaClassName: 'warning',
|
||||
iconComponent: CautionIcon,
|
||||
label: (
|
||||
<Translate
|
||||
id="theme.admonition.caution"
|
||||
description="The default label used for the Caution admonition (:::caution)">
|
||||
caution
|
||||
</Translate>
|
||||
),
|
||||
},
|
||||
};
|
||||
// Legacy aliases, undocumented but kept for retro-compatibility
|
||||
const aliases = {
|
||||
secondary: 'note',
|
||||
important: 'info',
|
||||
success: 'tip',
|
||||
warning: 'danger',
|
||||
};
|
||||
function getAdmonitionConfig(unsafeType) {
|
||||
const type = aliases[unsafeType] ?? unsafeType;
|
||||
const config = AdmonitionConfigs[type];
|
||||
if (config) {
|
||||
return config;
|
||||
import {processAdmonitionProps} from '@docusaurus/theme-common';
|
||||
import AdmonitionTypes from '@theme/Admonition/Types';
|
||||
function getAdmonitionTypeComponent(type) {
|
||||
const component = AdmonitionTypes[type];
|
||||
if (component) {
|
||||
return component;
|
||||
}
|
||||
console.warn(
|
||||
`No admonition config found for admonition type "${type}". Using Info as fallback.`,
|
||||
`No admonition component found for admonition type "${type}". Using Info as fallback.`,
|
||||
);
|
||||
return AdmonitionConfigs.info;
|
||||
return AdmonitionTypes.info;
|
||||
}
|
||||
// Workaround because it's difficult in MDX v1 to provide a MDX title as props
|
||||
// See https://github.com/facebook/docusaurus/pull/7152#issuecomment-1145779682
|
||||
function extractMDXAdmonitionTitle(children) {
|
||||
const items = React.Children.toArray(children);
|
||||
const mdxAdmonitionTitle = items.find(
|
||||
(item) =>
|
||||
React.isValidElement(item) &&
|
||||
item.props?.mdxType === 'mdxAdmonitionTitle',
|
||||
);
|
||||
const rest = <>{items.filter((item) => item !== mdxAdmonitionTitle)}</>;
|
||||
return {
|
||||
mdxAdmonitionTitle,
|
||||
rest,
|
||||
};
|
||||
export default function Admonition(unprocessedProps) {
|
||||
const props = processAdmonitionProps(unprocessedProps);
|
||||
const AdmonitionTypeComponent = getAdmonitionTypeComponent(props.type);
|
||||
return <AdmonitionTypeComponent {...props} />;
|
||||
}
|
||||
function processAdmonitionProps(props) {
|
||||
const {mdxAdmonitionTitle, rest} = extractMDXAdmonitionTitle(props.children);
|
||||
return {
|
||||
...props,
|
||||
title: props.title ?? mdxAdmonitionTitle,
|
||||
children: rest,
|
||||
};
|
||||
}
|
||||
export default function Admonition(props) {
|
||||
const {children, type, title, icon: iconProp} = processAdmonitionProps(props);
|
||||
const typeConfig = getAdmonitionConfig(type);
|
||||
const titleLabel = title ?? typeConfig.label;
|
||||
const {iconComponent: IconComponent} = typeConfig;
|
||||
const icon = iconProp ?? <IconComponent />;
|
||||
return (
|
||||
<div
|
||||
className={clsx(
|
||||
ThemeClassNames.common.admonition,
|
||||
ThemeClassNames.common.admonitionType(props.type),
|
||||
'alert',
|
||||
`alert--${typeConfig.infimaClassName}`,
|
||||
styles.admonition,
|
||||
)}>
|
||||
{titleLabel == "pass" ? void 0 : (
|
||||
<div className={styles.admonitionHeading}>
|
||||
<span className={styles.admonitionIcon}>{icon}</span>
|
||||
{titleLabel}
|
||||
</div>
|
||||
)}
|
||||
<div className={styles.admonitionContent}>{children}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
/* See docusaurus issue 8568 -- this was swizzled against 2.4.1 */
|
@ -4,22 +4,26 @@
|
||||
* This source code is licensed under the MIT license found in the
|
||||
* LICENSE file in the root directory of this source tree.
|
||||
*/
|
||||
import siteConfig from '@generated/docusaurus.config';
|
||||
export default function prismIncludeLanguages(PrismObject) {
|
||||
const {
|
||||
themeConfig: {prism},
|
||||
} = siteConfig;
|
||||
const {additionalLanguages} = prism;
|
||||
// Prism components work on the Prism instance on the window, while prism-
|
||||
// react-renderer uses its own Prism instance. We temporarily mount the
|
||||
// instance onto window, import components to enhance it, then remove it to
|
||||
// avoid polluting global namespace.
|
||||
// You can mutate PrismObject: registering plugins, deleting languages... As
|
||||
// long as you don't re-assign it
|
||||
globalThis.Prism = PrismObject;
|
||||
additionalLanguages.forEach((lang) => {
|
||||
// eslint-disable-next-line global-require, import/no-dynamic-require
|
||||
require(`prismjs/components/prism-${lang}`);
|
||||
});
|
||||
//delete globalThis.Prism; // <-- If this line is not commented, `liquid` will fail.
|
||||
import siteConfig from '@generated/docusaurus.config';
|
||||
export default function prismIncludeLanguages(PrismObject) {
|
||||
const {
|
||||
themeConfig: {prism},
|
||||
} = siteConfig;
|
||||
const {additionalLanguages} = prism;
|
||||
// Prism components work on the Prism instance on the window, while prism-
|
||||
// react-renderer uses its own Prism instance. We temporarily mount the
|
||||
// instance onto window, import components to enhance it, then remove it to
|
||||
// avoid polluting global namespace.
|
||||
// You can mutate PrismObject: registering plugins, deleting languages... As
|
||||
// long as you don't re-assign it
|
||||
globalThis.Prism = PrismObject;
|
||||
additionalLanguages.forEach((lang) => {
|
||||
if (lang === 'php') {
|
||||
// eslint-disable-next-line global-require
|
||||
require('prismjs/components/prism-markup-templating.js');
|
||||
}
|
||||
// eslint-disable-next-line global-require, import/no-dynamic-require
|
||||
require(`prismjs/components/prism-${lang}`);
|
||||
});
|
||||
//delete globalThis.Prism; // <-- If this line is not commented, `liquid` will fail.
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user