diff --git a/docz/docs/03-demos/04-cloud/01-salesforce.md b/docz/docs/03-demos/04-cloud/01-salesforce.md index 00c290f..4f1ff54 100644 --- a/docz/docs/03-demos/04-cloud/01-salesforce.md +++ b/docz/docs/03-demos/04-cloud/01-salesforce.md @@ -2,7 +2,6 @@ title: Salesforce LWC pagination_prev: demos/desktop/index pagination_next: demos/grid -sidebar_position: 1 --- Salesforce apps can use third-party libraries in "Lightning Web Components". diff --git a/docz/docs/03-demos/04-cloud/02-aws.md b/docz/docs/03-demos/04-cloud/02-aws.md index 33b8c95..793dc64 100644 --- a/docz/docs/03-demos/04-cloud/02-aws.md +++ b/docz/docs/03-demos/04-cloud/02-aws.md @@ -2,7 +2,6 @@ title: Amazon Web Services pagination_prev: demos/desktop/index pagination_next: demos/grid -sidebar_position: 2 --- AWS is a Cloud Services platform which includes traditional virtual machine diff --git a/docz/docs/03-demos/19-cloudata/01-gsheet.md b/docz/docs/03-demos/04-cloud/03-gsheet.md similarity index 95% rename from docz/docs/03-demos/19-cloudata/01-gsheet.md rename to docz/docs/03-demos/04-cloud/03-gsheet.md index ac5c36f..a70f21b 100644 --- a/docz/docs/03-demos/19-cloudata/01-gsheet.md +++ b/docz/docs/03-demos/04-cloud/03-gsheet.md @@ -1,7 +1,7 @@ --- title: Google Sheets -pagination_prev: demos/static/index -pagination_next: demos/cli +pagination_prev: demos/desktop/index +pagination_next: demos/grid --- import Tabs from '@theme/Tabs'; diff --git a/docz/docs/03-demos/04-cloud/04-netsuite.md b/docz/docs/03-demos/04-cloud/04-netsuite.md index e45a821..f1a8724 100644 --- a/docz/docs/03-demos/04-cloud/04-netsuite.md +++ b/docz/docs/03-demos/04-cloud/04-netsuite.md @@ -2,7 +2,6 @@ title: NetSuite pagination_prev: demos/desktop/index pagination_next: demos/grid -sidebar_position: 4 --- This demo discusses the key SheetJS operations. Familiarity with SuiteScript 2 diff --git a/docz/docs/03-demos/44-hosting/01-dropbox.mdx b/docz/docs/03-demos/04-cloud/05-dropbox.mdx similarity index 93% rename from docz/docs/03-demos/44-hosting/01-dropbox.mdx rename to docz/docs/03-demos/04-cloud/05-dropbox.mdx index 65235f8..5317251 100644 --- a/docz/docs/03-demos/44-hosting/01-dropbox.mdx +++ b/docz/docs/03-demos/04-cloud/05-dropbox.mdx @@ -1,7 +1,7 @@ --- title: Dropbox -pagination_prev: demos/ml -pagination_next: solutions/input +pagination_prev: demos/desktop/index +pagination_next: demos/grid --- @@ -45,8 +45,17 @@ When a file is selected, the `success` callback will receive an array of files (even if `multiselect` is disabled). Each file object has a `link` file which corresponds to a temporary URL that can be fetched. -If the live demo shows a message about `Dropbox` being undefined, please reload -this demo page. +:::caution + +If the live demo shows a message + +``` +ReferenceError: Dropbox is not defined +``` + +please refresh the page. This is a known bug in the documentation generator. + +::: ```jsx live function SheetJSChoisissez() { @@ -105,8 +114,17 @@ URI by writing with the `base64` type and prepending the URI metadata. This demo seeds data by fetching a file and writing to HTML table. The generated table is scraped to create a new workbook that is written to XLS. -If the live demo shows a message about `Dropbox` being undefined, please reload -this demo page. +:::caution + +If the live demo shows a message + +``` +ReferenceError: Dropbox is not defined +``` + +please refresh the page. This is a known bug in the documentation generator. + +::: ```jsx live function SheetJSEnregistrez() { diff --git a/docz/docs/03-demos/19-cloudata/08-airtable.md b/docz/docs/03-demos/04-cloud/08-airtable.md similarity index 97% rename from docz/docs/03-demos/19-cloudata/08-airtable.md rename to docz/docs/03-demos/04-cloud/08-airtable.md index 9e758a2..86ac191 100644 --- a/docz/docs/03-demos/19-cloudata/08-airtable.md +++ b/docz/docs/03-demos/04-cloud/08-airtable.md @@ -1,7 +1,7 @@ --- title: Airtable -pagination_prev: demos/static/index -pagination_next: demos/cli +pagination_prev: demos/desktop/index +pagination_next: demos/grid --- At the time of writing (2023 February 15), Airtable recommends Personal Access diff --git a/docz/docs/03-demos/04-cloud/03-azure.md b/docz/docs/03-demos/04-cloud/09-azure.md similarity index 99% rename from docz/docs/03-demos/04-cloud/03-azure.md rename to docz/docs/03-demos/04-cloud/09-azure.md index 960a4ed..1417b88 100644 --- a/docz/docs/03-demos/04-cloud/03-azure.md +++ b/docz/docs/03-demos/04-cloud/09-azure.md @@ -2,7 +2,6 @@ title: Azure Cloud Services pagination_prev: demos/desktop/index pagination_next: demos/grid -sidebar_position: 3 --- Azure is a Cloud Services platform which includes traditional virtual machine diff --git a/docz/docs/03-demos/44-hosting/02-github.md b/docz/docs/03-demos/04-cloud/10-github.md similarity index 99% rename from docz/docs/03-demos/44-hosting/02-github.md rename to docz/docs/03-demos/04-cloud/10-github.md index 88eaa2a..34ae812 100644 --- a/docz/docs/03-demos/44-hosting/02-github.md +++ b/docz/docs/03-demos/04-cloud/10-github.md @@ -1,7 +1,7 @@ --- title: GitHub -pagination_prev: demos/ml -pagination_next: solutions/input +pagination_prev: demos/desktop/index +pagination_next: demos/grid --- Many official data releases by governments and organizations include XLSX or diff --git a/docz/docs/03-demos/04-cloud/index.md b/docz/docs/03-demos/04-cloud/index.md index 1603355..821e499 100644 --- a/docz/docs/03-demos/04-cloud/index.md +++ b/docz/docs/03-demos/04-cloud/index.md @@ -37,3 +37,19 @@ 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) + +### File Hosting + +File hosting services provide simple solutions for storing data, synchronizing +files across devices, and sharing with specific users or customers. Demos: + +- [Dropbox](/docs/demos/cloud/dropbox) +- [Github](/docs/demos/cloud/github) + +## Cloud Data + +Cloud Data Platforms are popular storage media for structured data, typically +offering APIs for programmatic data ingress and egress. Demos: + +- [Google Sheets](/docs/demos/cloud/gsheet) +- [Airtable](/docs/demos/cloud/airtable) diff --git a/docz/docs/03-demos/11-static/01-lume.md b/docz/docs/03-demos/11-static/01-lume.md index a11e255..384599b 100644 --- a/docz/docs/03-demos/11-static/01-lume.md +++ b/docz/docs/03-demos/11-static/01-lume.md @@ -1,7 +1,7 @@ --- title: Lume pagination_prev: demos/extensions/index -pagination_next: demos/cloudata/index +pagination_next: demos/cli sidebar_custom_props: type: native --- diff --git a/docz/docs/03-demos/11-static/02-gatsbyjs.md b/docz/docs/03-demos/11-static/02-gatsbyjs.md index e9eeeae..1119955 100644 --- a/docz/docs/03-demos/11-static/02-gatsbyjs.md +++ b/docz/docs/03-demos/11-static/02-gatsbyjs.md @@ -1,7 +1,7 @@ --- title: GatsbyJS pagination_prev: demos/extensions/index -pagination_next: demos/cloudata/index +pagination_next: demos/cli sidebar_custom_props: type: native --- diff --git a/docz/docs/03-demos/11-static/05-vitejs.md b/docz/docs/03-demos/11-static/05-vitejs.md index 63c95b2..c32ea5a 100644 --- a/docz/docs/03-demos/11-static/05-vitejs.md +++ b/docz/docs/03-demos/11-static/05-vitejs.md @@ -1,7 +1,7 @@ --- title: ViteJS pagination_prev: demos/extensions/index -pagination_next: demos/cloudata/index +pagination_next: demos/cli sidebar_custom_props: type: bundler --- diff --git a/docz/docs/03-demos/11-static/08-nextjs.md b/docz/docs/03-demos/11-static/08-nextjs.md index aeffb2a..41a2716 100644 --- a/docz/docs/03-demos/11-static/08-nextjs.md +++ b/docz/docs/03-demos/11-static/08-nextjs.md @@ -1,7 +1,7 @@ --- title: NextJS pagination_prev: demos/extensions/index -pagination_next: demos/cloudata/index +pagination_next: demos/cli --- :::note diff --git a/docz/docs/03-demos/11-static/09-nuxtjs.md b/docz/docs/03-demos/11-static/09-nuxtjs.md index 220dc14..f1b1360 100644 --- a/docz/docs/03-demos/11-static/09-nuxtjs.md +++ b/docz/docs/03-demos/11-static/09-nuxtjs.md @@ -1,7 +1,7 @@ --- title: NuxtJS pagination_prev: demos/extensions/index -pagination_next: demos/cloudata/index +pagination_next: demos/cli --- `@nuxt/content` is a file-based CMS for Nuxt, enabling static-site generation diff --git a/docz/docs/03-demos/11-static/10-astro.md b/docz/docs/03-demos/11-static/10-astro.md new file mode 100644 index 0000000..92b7f56 --- /dev/null +++ b/docz/docs/03-demos/11-static/10-astro.md @@ -0,0 +1,120 @@ +--- +title: AstroJS +pagination_prev: demos/extensions/index +pagination_next: demos/cli +--- + +:::note + +This demo uses ["Base64 Loader"](/docs/demos/static/vitejs#base64-loader) +from the ViteJS demo. + +::: + +Astro is a site generator. Astro projects use ViteJS under the hood, and Astro +exposes project configuration through the `vite` property in `astro.config.mjs`. +The [ViteJS demo](/docs/demos/static/vitejs) examples work as expected! + +## Integration + +:::note + +The ViteJS demo used the query `?b64` to identify files. To play nice with +Astro, this demo matches the file extensions directly. + +::: + +Since Astro performs per-page heavy lifting at build time, it is recommended to +use the Base64 string loader to get file data and parse with the SheetJS library +in the relevant pages. If the SheetJS operations are performed in frontmatter, +only the results will be added to the generated pages! + +#### Loader + +The loader should be added to `astro.config.mjs` under the `vite` key. + +```js title="astro.config.mjs" +import { readFileSync } from 'fs'; +import { defineConfig } from 'astro/config'; +export default defineConfig({ + vite: { + // this tells astro which extensions to handle + assetsInclude: ['**/*.numbers', '**/*.xlsx'], + + plugins: [ + { // this plugin presents the data as a Base64 string + name: "sheet-base64", + transform(code, id) { + if(!id.match(/\.(numbers|xlsx)$/)) return; + var data = readFileSync(id, "base64"); + return `export default '${data}'`; + } + } + ] + } +}); +``` + +#### Types + +For VSCodium integration, types can be specified in `src/env.d.ts`. + +This data loader returns Base64 strings: + +```ts title="src/env.d.ts" +/// +declare module '*.numbers' { + const data: string; + export default data; +} +declare module '*.xlsx' { + const data: string; + export default data; +} +``` + +#### Astro Frontmatter + +Typically projects store files in `src/pages`. Assuming `pres.numbers` is stored +in the `src/data` directory in the project, the relative import + +```js +import b64 from "../data/pres.numbers" +``` + +will return a Base64 string which can be parsed in the frontmatter. The workbook +object can be post-processed using utility functions. The following example +uses `sheet_to_json` to generate row objects that are rendered as table rows: + +```jsx title="src/pages/index.astro" +--- +/* -- the code in the frontmatter is only run at build time -- */ +import { read, utils } from "xlsx"; + +/* parse workbook */ +import b64 from "../data/pres.numbers"; +const wb = read(b64, {type: "base64"}); + +/* generate row objects */ +interface IPresident { + Name: string; + Index: number; +} +const data = utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]); +--- + + +

Presidents

+ + + {/* Display each row object as a TR within the TBODY element */} + {data.map(row => ( + + ))} +
NameIndex
{row.Name}{row.Index}
+ + +``` + +When built using `npx astro build`, Astro will perform the conversion and emit +a simple HTML table without any reference to the existing spreadsheet file! diff --git a/docz/docs/03-demos/11-static/index.md b/docz/docs/03-demos/11-static/index.md index f6b499b..ef31b5a 100644 --- a/docz/docs/03-demos/11-static/index.md +++ b/docz/docs/03-demos/11-static/index.md @@ -1,7 +1,7 @@ --- title: Content and Static Sites pagination_prev: demos/extensions/index -pagination_next: demos/cloudata/index +pagination_next: demos/cli --- import DocCardList from '@theme/DocCardList'; diff --git a/docz/docs/03-demos/19-cloudata/_category_.json b/docz/docs/03-demos/19-cloudata/_category_.json deleted file mode 100644 index 015a336..0000000 --- a/docz/docs/03-demos/19-cloudata/_category_.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "label": "Cloud Data Platforms", - "position": 19, - "collapsed": false -} \ No newline at end of file diff --git a/docz/docs/03-demos/19-cloudata/index.md b/docz/docs/03-demos/19-cloudata/index.md deleted file mode 100644 index 4b0cca3..0000000 --- a/docz/docs/03-demos/19-cloudata/index.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: Cloud Data Platforms -pagination_prev: demos/static/index -pagination_next: demos/cli ---- - -import DocCardList from '@theme/DocCardList'; -import {useCurrentSidebarCategory} from '@docusaurus/theme-common'; - -Cloud Data Platforms are popular storage media for structured data, typically -offering APIs for programmatic data ingress and egress. Demos: - - diff --git a/docz/docs/03-demos/27-cli.md b/docz/docs/03-demos/27-cli.md index abc6516..e499d93 100644 --- a/docz/docs/03-demos/27-cli.md +++ b/docz/docs/03-demos/27-cli.md @@ -1,6 +1,6 @@ --- title: Command-Line Tools -pagination_prev: demos/cloudata/index +pagination_prev: demos/static/index pagination_next: demos/engines/index --- diff --git a/docz/docs/03-demos/34-network.mdx b/docz/docs/03-demos/34-network.mdx index 2f594f5..3091e4f 100644 --- a/docz/docs/03-demos/34-network.mdx +++ b/docz/docs/03-demos/34-network.mdx @@ -313,6 +313,18 @@ async function workbook_dl_axios(url) { This demo uses `axios` to download and show the data in an HTML table. +:::caution + +If the live demo shows a message + +``` +ReferenceError: axios is not defined +``` + +please refresh the page. This is a known bug in the documentation generator. + +::: + ```jsx live function SheetJSAxiosDL() { const [__html, setHTML] = React.useState(""); @@ -404,6 +416,18 @@ superagent.get(url).responseType('arraybuffer').end(function(err, res) { This demo uses `superagent` to download and show the data in an HTML table. +:::caution + +If the live demo shows a message + +``` +ReferenceError: superagent is not defined +``` + +please refresh the page. This is a known bug in the documentation generator. + +::: + ```jsx live function SheetJSSuperAgentDL() { const [__html, setHTML] = React.useState(""); diff --git a/docz/docs/03-demos/43-ml.mdx b/docz/docs/03-demos/43-ml.mdx index b1ca9bb..6a8b22b 100644 --- a/docz/docs/03-demos/43-ml.mdx +++ b/docz/docs/03-demos/43-ml.mdx @@ -1,6 +1,5 @@ --- title: Typed Arrays and ML -pagination_next: demos/hosting/index --- @@ -48,6 +47,18 @@ fetching [an XLSX export of the example dataset](https://sheetjs.com/data/bht.xl
TF CSV Demo using XLSX files (click to show) +:::caution + +If the live demo shows a message + +``` +ReferenceError: tf is not defined +``` + +please refresh the page. This is a known bug in the documentation generator. + +::: + ```jsx live function SheetJSToTFJSCSV() { const [output, setOutput] = React.useState(""); diff --git a/docz/docs/03-demos/44-hosting/_category_.json b/docz/docs/03-demos/44-hosting/_category_.json deleted file mode 100644 index e0c2fe2..0000000 --- a/docz/docs/03-demos/44-hosting/_category_.json +++ /dev/null @@ -1,5 +0,0 @@ -{ - "label": "File Hosting Services", - "position": 44, - "collapsed": false -} \ No newline at end of file diff --git a/docz/docs/03-demos/44-hosting/index.md b/docz/docs/03-demos/44-hosting/index.md deleted file mode 100644 index 84c627e..0000000 --- a/docz/docs/03-demos/44-hosting/index.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -title: File Hosting Services -pagination_prev: demos/ml -pagination_next: solutions/input ---- - -import DocCardList from '@theme/DocCardList'; -import {useCurrentSidebarCategory} from '@docusaurus/theme-common'; - -File hosting services provide simple solutions for storing data, synchronizing -files across devices, and sharing with specific users or customers. - -
    {useCurrentSidebarCategory().items.map(item => { - const listyle = (item.customProps?.icon) ? { - listStyleImage: `url("${item.customProps.icon}")` - } : {}; - return (
  • - {item.label}{item.customProps?.summary && (" - " + item.customProps.summary)} -
    • ); -})}
diff --git a/docz/docs/03-demos/index.md b/docz/docs/03-demos/index.md index 857ca73..0d3b287 100644 --- a/docz/docs/03-demos/index.md +++ b/docz/docs/03-demos/index.md @@ -80,13 +80,13 @@ run in the web browser, demos will include interactive examples. ### File Hosting Services -- [`Dropbox`](/docs/demos/hosting/dropbox) -- [`GitHub`](/docs/demos/hosting/github) +- [`Dropbox`](/docs/demos/cloud/dropbox) +- [`GitHub`](/docs/demos/cloud/github) ### Cloud Data Services -- [`Google Sheets`](/docs/demos/cloudata/gsheet) -- [`Airtable`](/docs/demos/cloudata/airtable) +- [`Google Sheets`](/docs/demos/cloud/gsheet) +- [`Airtable`](/docs/demos/cloud/airtable) ### Platforms and Integrations diff --git a/docz/docusaurus.config.js b/docz/docusaurus.config.js index dbd328c..aacb4e6 100644 --- a/docz/docusaurus.config.js +++ b/docz/docusaurus.config.js @@ -172,7 +172,7 @@ const config = { { from: '/docs/getting-started/demos/', to: '/docs/demos/' }, { from: '/docs/getting-started/demos/excel', to: '/docs/demos/' }, { from: '/docs/demos/content', to: '/docs/demos/static/' }, - { from: '/docs/demos/git', to: '/docs/demos/hosting/github/' }, + { from: '/docs/demos/git', to: '/docs/demos/cloud/github/' }, { from: '/docs/demo/grid', to: '/docs/demos/grid/' }, /* frontend */ { from: '/docs/demos/angular', to: '/docs/demos/frontend/angular/' }, @@ -186,13 +186,18 @@ const config = { { from: '/docs/demos/aws', to: '/docs/demos/cloud/aws/' }, { from: '/docs/demos/azure', to: '/docs/demos/cloud/azure/' }, { from: '/docs/demos/netsuite', to: '/docs/demos/cloud/netsuite/' }, + { from: '/docs/demos/gsheet', to: '/docs/demos/cloud/gsheet/' }, + { from: '/docs/demos/airtable', to: '/docs/demos/cloud/airtable/' }, /* extensions */ { from: '/docs/demos/extendscript', to: '/docs/demos/extensions/extendscript/' }, { from: '/docs/demos/excelapi', to: '/docs/demos/extensions/excelapi/' }, { from: '/docs/demos/chromium', to: '/docs/demos/extensions/chromium/' }, /* cloudata */ - { from: '/docs/demos/gsheet', to: '/docs/demos/cloudata/gsheet/' }, - { from: '/docs/demos/airtable', to: '/docs/demos/cloudata/airtable/' }, + { from: '/docs/demos/cloudata/gsheet', to: '/docs/demos/cloud/gsheet/' }, + { from: '/docs/demos/cloudata/airtable', to: '/docs/demos/cloud/airtable/' }, + /* hosting */ + { from: '/docs/demos/hosting/dropbox', to: '/docs/demos/cloud/dropbox/' }, + { from: '/docs/demos/hosting/github', to: '/docs/demos/cloud/github/' }, ] }] ]