{"Data:\n"+df.head()}> ); + const [df, setDF] = React.useState({}); + React.useEffect(() => { + /* sample dataframe */ + setDF(new dfd.DataFrame([{Sheet:1,JS:2},{Sheet:3,JS:4}])); + }, []); + + if(!df.head) return ; + return !df.head ? ( RELOAD THIS PAGE) : ( <> + +
{"Data:\n"+df.head()}+ > ); } ``` diff --git a/docz/docs/03-demos/01-math/21-pandas.md b/docz/docs/03-demos/01-math/21-pandas.md index 8b15814..2d8151c 100644 --- a/docz/docs/03-demos/01-math/21-pandas.md +++ b/docz/docs/03-demos/01-math/21-pandas.md @@ -40,11 +40,11 @@ This demo was tested in the following deployments: | Architecture | JS Engine | Pandas | Python | Date | |:-------------|:----------------|:-------|:-------|:-----------| -| `darwin-x64` | Duktape `2.7.0` | 2.2.1 | 3.12.2 | 2024-03-15 | +| `darwin-x64` | Duktape `2.7.0` | 2.2.3 | 3.13.1 | 2024-12-31 | | `darwin-arm` | Duktape `2.7.0` | 2.2.2 | 3.12.3 | 2024-06-30 | | `win11-x64` | Duktape `2.7.0` | 2.2.3 | 3.11.8 | 2024-12-21 | | `win11-arm` | Duktape `2.7.0` | 2.2.2 | 3.11.5 | 2024-06-20 | -| `linux-x64` | Duktape `2.7.0` | 1.5.3 | 3.11.3 | 2024-03-21 | +| `linux-x64` | Duktape `2.7.0` | 1.5.3 | 3.11.7 | 2025-01-01 | | `linux-arm` | Duktape `2.7.0` | 1.5.3 | 3.11.2 | 2024-06-20 | ::: @@ -519,11 +519,11 @@ This demo was tested in the following deployments: | Architecture | JS Engine | Polars | Python | Date | |:-------------|:----------------|:--------|:-------|:-----------| -| `darwin-x64` | Duktape `2.7.0` | 0.20.15 | 3.12.2 | 2024-03-15 | +| `darwin-x64` | Duktape `2.7.0` | 1.18.0 | 3.13.1 | 2024-12-31 | | `darwin-arm` | Duktape `2.7.0` | 0.20.31 | 3.12.3 | 2024-06-30 | | `win11-x64` | Duktape `2.7.0` | 1.17.1 | 3.11.8 | 2024-12-21 | | `win11-arm` | Duktape `2.7.0` | 0.20.31 | 3.11.5 | 2024-06-20 | -| `linux-x64` | Duktape `2.7.0` | 0.20.16 | 3.11.3 | 2024-03-21 | +| `linux-x64` | Duktape `2.7.0` | 1.18.0 | 3.11.7 | 2025-01-01 | | `linux-arm` | Duktape `2.7.0` | 0.20.31 | 3.11.2 | 2024-06-20 | ::: diff --git a/docz/docs/03-demos/02-frontend/02-react.md b/docz/docs/03-demos/02-frontend/02-react.md index ff5ae0f..27d8fe1 100644 --- a/docz/docs/03-demos/02-frontend/02-react.md +++ b/docz/docs/03-demos/02-frontend/02-react.md @@ -753,7 +753,7 @@ This demo was tested in the following environments: | ReactJS | CRA | Date | |:---------|:--------|:-----------| -| `18.2.0` | `5.0.1` | 2024-03-13 | +| `18.2.0` | `5.0.1` | 2024-12-31 | ::: diff --git a/docz/docs/03-demos/02-frontend/03-angular.md b/docz/docs/03-demos/02-frontend/03-angular.md index ce1728b..e010b7e 100644 --- a/docz/docs/03-demos/02-frontend/03-angular.md +++ b/docz/docs/03-demos/02-frontend/03-angular.md @@ -425,8 +425,10 @@ This demo was tested in the following environments: | Angular | Date | |:----------|:-----------| -| `17.3.0` | 2024-03-13 | -| `16.2.12` | 2024-03-13 | +| `19.0.5` | 2025-01-03 | +| `18.2.13` | 2025-01-03 | +| `17.3.12` | 2025-01-03 | +| `16.2.12` | 2025-01-03 | ::: @@ -439,16 +441,16 @@ npx @angular/cli analytics disable -g 1) Create a new project: ```bash -npx @angular/cli@17.3.0 new --minimal --defaults --no-interactive sheetjs-angular +npx @angular/cli@19 new --minimal --defaults --no-interactive sheetjs-angular ``` :::note pass The `@angular/cli` version controls the project version of Angular. For example, -the following command uses Angular 16.2.12: +the following command uses Angular 16: ```bash -npx @angular/cli@16.2.12 new --minimal --defaults --no-interactive sheetjs-angular +npx @angular/cli@16 new --minimal --defaults --no-interactive sheetjs-angular ``` ::: @@ -619,8 +621,10 @@ This demo was tested in the following environments: | Angular | Date | |:----------|:-----------| -| `17.3.0` | 2024-03-13 | -| `16.2.12` | 2024-03-13 | +| `19.0.5` | 2025-01-03 | +| `18.2.13` | 2025-01-03 | +| `17.3.12` | 2025-01-03 | +| `16.2.12` | 2025-01-03 | ::: @@ -633,16 +637,16 @@ npx @angular/cli analytics disable -g 1) Create a new project: ```bash -npx @angular/cli@17.3.0 new --minimal --defaults --no-interactive sheetjs-angular +npx @angular/cli@19 new --minimal --defaults --no-interactive sheetjs-angular ``` :::note pass The `@angular/cli` version controls the project version of Angular. For example, -the following command uses Angular 16.2.12: +the following command uses Angular 16: ```bash -npx @angular/cli@16.2.12 new --minimal --defaults --no-interactive sheetjs-angular +npx @angular/cli@16 new --minimal --defaults --no-interactive sheetjs-angular ``` ::: diff --git a/docz/docs/03-demos/02-frontend/04-vue.md b/docz/docs/03-demos/02-frontend/04-vue.md index 4719a18..1d69e66 100644 --- a/docz/docs/03-demos/02-frontend/04-vue.md +++ b/docz/docs/03-demos/02-frontend/04-vue.md @@ -412,7 +412,7 @@ This demo was tested in the following environments: | VueJS | NuxtJS | Date | |:---------|:---------|:-----------| -| `3.4.21` | `3.11.1` | 2024-03-21 | +| `3.5.13` | `3.15.0` | 2025-01-02 | ::: @@ -520,7 +520,7 @@ This demo was tested in the following environments: | VueJS | ViteJS | Date | |:---------|:--------|:-----------| -| `3.4.21` | `5.2.2` | 2024-03-21 | +| `3.5.13` | `6.0.7` | 2025-01-02 | ::: @@ -573,7 +573,7 @@ This demo was tested in the following environments: | VueJS | NuxtJS | Date | |:---------|:---------|:-----------| -| `3.4.21` | `3.11.1` | 2024-03-21 | +| `3.5.13` | `3.15.0` | 2025-01-02 | ::: diff --git a/docz/docs/03-demos/02-frontend/10-openui5.md b/docz/docs/03-demos/02-frontend/10-openui5.md index c1a8355..a66f968 100644 --- a/docz/docs/03-demos/02-frontend/10-openui5.md +++ b/docz/docs/03-demos/02-frontend/10-openui5.md @@ -1,6 +1,6 @@ --- -title: Sheets in OpenUI5 Sites -sidebar_label: OpenUI5 +title: Sheets in UI5 Sites +sidebar_label: OpenUI5 / SAPUI5 description: Build enterprise-grade applications with OpenUI5. Seamlessly integrate spreadsheets into your app using SheetJS. Bring Excel-powered workflows and data to the modern web. pagination_prev: demos/index pagination_next: demos/grid/index @@ -12,7 +12,8 @@ import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import CodeBlock from '@theme/CodeBlock'; -[OpenUI5](https://openui5.org/) is a JavaScript framework for building enterprise-ready web applications. +[OpenUI5](https://openui5.org/) is a JavaScript framework for building +enterprise-ready web applications. It is compatible with the SAPUI5 framework. [SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing data from spreadsheets. @@ -21,19 +22,84 @@ This demo uses OpenUI5 and SheetJS to process and generate a spreadsheets. We'll explore how to load SheetJS in an OpenUI5 app and handle data binding with the Model-View-Controller pattern. +:::info pass + +[Docs Issue #20](https://git.sheetjs.com/sheetjs/docs.sheetjs.com/issues/20) +includes a complete example starting from the OpenUI5 "Worklist App Tutorial". + +::: + ## Installation -[The "Frameworks" section](/docs/getting-started/installation/frameworks) covers -installation with Yarn and other package managers. +SheetJS libraries conform to the UI5 ECMAScript limitations[^1]. SheetJS +libraries can be loaded in a UI5 site at different points in the app lifecycle. -The library should be loaded via script tag in your HTML: +**HTML** -
[✔] Environment -{` `}- OS: Mac OS 14.4.1 X64 +{` `}- OS: Mac OS 15.2.0 x86_64 (X64) {` `}✔ Xcode Command Line Tools: installed -{` `}✔ rustc: 1.77.2 (25ef9e3d8 2024-04-09) -{` `}✔ cargo: 1.77.2 (e52e36006 2024-03-26) -{` `}✔ rustup: 1.27.0 (bbb9276d2 2024-03-08) +{` `}✔ rustc: 1.83.0 (90b35a623 2024-11-26) +{` `}✔ cargo: 1.83.0 (5ffbef321 2024-10-29) +{` `}✔ rustup: 1.27.1 (54dd3d00f 2024-04-24) {` `}✔ Rust toolchain: stable-x86_64-apple-darwin (default) -{` `}- node: 20.12.1 -{` `}- npm: 10.5.0 -{` `}- bun: 1.1.4 +{` `}- node: 20.18.0 +{` `}- npm: 10.8.2 +{` `}- bun: 1.1.42 +{` `}- deno: deno 2.1.4:::caution pass diff --git a/docz/docs/03-demos/19-desktop/05-neutralino.md b/docz/docs/03-demos/19-desktop/05-neutralino.md index 99b0d7b..881ee56 100644 --- a/docz/docs/03-demos/19-desktop/05-neutralino.md +++ b/docz/docs/03-demos/19-desktop/05-neutralino.md @@ -192,11 +192,11 @@ This demo was tested in the following environments: | OS and Version | Architecture | Server | Client | Date | |:---------------|:-------------|:---------|:---------|:-----------| -| macOS 14.4 | `darwin-x64` | `5.0.0` | `5.0.1` | 2024-03-15 | +| macOS 15.2 | `darwin-x64` | `5.5.0` | `5.5.0` | 2024-12-31 | | macOS 14.5 | `darwin-arm` | `5.1.0` | `5.1.0` | 2024-05-25 | | Windows 11 | `win11-x64` | `5.5.0` | `5.5.0` | 2024-12-20 | | Windows 11 | `win11-arm` | `5.1.0` | `5.1.1` | 2024-05-28 | -| Linux (HoloOS) | `linux-x64` | `5.0.0` | `5.0.1` | 2024-03-21 | +| Linux (HoloOS) | `linux-x64` | `5.5.0` | `5.5.0` | 2025-01-02 | | Linux (Debian) | `linux-arm` | `5.1.0` | `5.1.1` | 2024-05-28 | NeutralinoJS on Windows on ARM generates X64 binaries that run using the X64 @@ -211,7 +211,7 @@ the window. Writing files will parse the table into a spreadsheet.
parse.jsx
Custom Function | Google Sheets |
---|---|
+ +```js +function AOA(url) { + return [ + ["Sheet", "JS"], + [ 72, 62] + ]; +} +``` + + | + +![Google Sheets result for AOA function](pathname:///gsheet/aoa-udf.png) + + |