diff --git a/docz/data/cli.xls b/docz/data/cli.xls
index f3f3b94..9081dcd 100644
--- a/docz/data/cli.xls
+++ b/docz/data/cli.xls
@@ -98,7 +98,7 @@
| ✔ |
|
|
- |
+ ✔ |
|
diff --git a/docz/data/mobile.js b/docz/data/mobile.js
new file mode 100644
index 0000000..7c129b0
--- /dev/null
+++ b/docz/data/mobile.js
@@ -0,0 +1,14 @@
+import { read, utils } from 'xlsx';
+import url from './mobile.xls';
+import React, { useEffect, useState } from 'react';
+
+const FrameworkData = () => {
+ const [fw, setFW] = useState("");
+
+ useEffect(() => { (async() => {
+ const wb = read(await (await fetch(url)).arrayBuffer(), { dense: true });
+ setFW(utils.sheet_to_html(wb.Sheets["Frameworks"]));
+ })(); }, []);
+ return ( );
+};
+export default FrameworkData;
diff --git a/docz/data/mobile.xls b/docz/data/mobile.xls
new file mode 100644
index 0000000..e9eab4f
--- /dev/null
+++ b/docz/data/mobile.xls
@@ -0,0 +1,154 @@
+
+
+
+
+ 10620
+ 11020
+ 2260
+ 19600
+ 1
+ False
+ False
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ |
+ Real Device |
+ MacOS Sim |
+ Windows Sim |
+ Linux Sim |
+
+
+ | Platform |
+ iOS |
+ Android |
+ iOS |
+ Android |
+ iOS |
+ Android |
+ iOS |
+ Android |
+
+
+ | React Native |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✘ |
+ ✔ |
+ ✘ |
+ ✔ |
+
+
+ | NativeScript |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✘ |
+ ✔ |
+ ✘ |
+ |
+
+
+ | CapacitorJS |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✘ |
+ ✔ |
+ ✘ |
+ |
+
+
+ | Ionic |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✘ |
+ |
+ ✘ |
+ |
+
+
+ | Dart + Flutter |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✘ |
+ |
+ ✘ |
+ |
+
+
+ | Quasar |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✔ |
+ ✘ |
+ |
+ ✘ |
+ |
+
+
+
+
+
+
+
+
+
+
+ 2
+ 2
+ 2
+
+
+ 3
+
+
+ 2
+ 12
+ 5
+
+
+ False
+ False
+
+
+
diff --git a/docz/docs/03-demos/17-mobile/02-nativescript.md b/docz/docs/03-demos/17-mobile/02-nativescript.md
index a4e40ee..a801711 100644
--- a/docz/docs/03-demos/17-mobile/02-nativescript.md
+++ b/docz/docs/03-demos/17-mobile/02-nativescript.md
@@ -56,15 +56,15 @@ This demo was tested in the following environments:
| OS | Device | NS | Date |
|:-----------|:--------------------|:---------|:-----------|
-| Android 30 | NVIDIA Shield | `8.6.5` | 2024-04-07 |
-| iOS 15.1 | iPad Pro | `8.6.1` | 2023-12-04 |
+| Android 30 | NVIDIA Shield | `8.7.2` | 2024-06-09 |
+| iOS 15.1 | iPad Pro | `8.7.2` | 2024-06-09 |
**Simulators**
| OS | Device | NS | Dev Platform | Date |
|:-----------|:--------------------|:---------|:-------------|:-----------|
-| Android 34 | Pixel 3a | `8.6.1` | `darwin-x64` | 2023-12-04 |
-| iOS 17.0.1 | iPhone SE (3rd gen) | `8.6.1` | `darwin-x64` | 2023-12-04 |
+| Android 34 | Pixel 3a | `8.7.2` | `darwin-arm` | 2024-06-09 |
+| iOS 17.5 | iPhone SE (3rd gen) | `8.7.2` | `darwin-arm` | 2024-06-09 |
| Android 34 | Pixel 3a | `8.6.5` | `win10-x64` | 2024-04-07 |
:::
@@ -311,7 +311,7 @@ In the last macOS test, the following output was displayed:
✔ Javac is installed and is configured properly.
✔ The Java Development Kit (JDK) is installed and is configured properly.
✔ Getting NativeScript components versions information...
-✔ Component nativescript has 8.6.1 version and is up to date.
+✔ Component nativescript has 8.7.2 version and is up to date.
@@ -338,10 +338,9 @@ In the last macOS test, the following output was displayed:
✔ CocoaPods are configured properly.
✔ Your current CocoaPods version is newer than 1.0.0.
✔ Python installed and configured correctly.
-✔ The Python 'six' package is found.
-✔ Xcode version 15.0.1 satisfies minimum required version 10.
+✔ Xcode version 15.4.0 satisfies minimum required version 10.
✔ Getting NativeScript components versions information...
-✔ Component nativescript has 8.6.1 version and is up to date.
+✔ Component nativescript has 8.7.2 version and is up to date.
@@ -798,7 +797,11 @@ file named `SheetJSNS.xls`.
35) Close any Android / iOS emulators.
-36) Enable developer code signing certificates[^9]
+36) Enable developer code signing certificates:
+
+Open `platforms/ios/SheetJSNS.xcodeproj/project.xcworkspace` in Xcode. Select
+the "Project Navigator" and select the "App" project. In the main view, select
+"Signing & Capabilities". Under "Signing", select a team in the dropdown menu.
37) Run on device:
@@ -806,12 +809,23 @@ file named `SheetJSNS.xls`.
npx -p nativescript ns run ios
```
+
+ iOS Device Testing (click to hide)
+
+When the app launches, if the SheetJS library is loaded and if the device is
+connected to the Internet, a list of Presidents should be displayed.
+
+Tap "Export File". The app will show an alert. Tap "OK".
+
+Switch to the "Files" app and open the "Downloads" folder. There should be a new
+file named `SheetJSNS.xls`.
+
+
+
[^1]: See [`read` in "Reading Files"](/docs/api/parse-options)
[^2]: See ["Workbook Object"](/docs/csf/book)
[^3]: See [`sheet_to_json` in "Utilities"](/docs/api/utilities/array#array-output)
[^4]: See [`write` in "Writing Files"](/docs/api/write-options)
[^5]: See [`json_to_sheet` in "Utilities"](/docs/api/utilities/array#array-of-objects-input)
[^6]: See ["Workbook Helpers" in "Utilities"](/docs/api/utilities/wb) for details on `book_new` and `book_append_sheet`.
-[^7]: See [`read` in "Reading Files"](/docs/api/parse-options)
-[^8]: See ["Local setup"](https://docs.nativescript.org/setup/#local-setup) in the NativeScript documentation. For Windows and Linux, follow the "Android" instructions. For macOS, follow both the iOS and Android instructions.
-[^9]: The [Flutter documentation](https://docs.flutter.dev/get-started/install/macos?tab=ios15#enable-developer-code-signing-certificates) covers the instructions in more detail. The correct workspace is `platforms/ios/SheetJSNS.xcodeproj/project.xcworkspace`
\ No newline at end of file
+[^7]: See [`read` in "Reading Files"](/docs/api/parse-options)
\ No newline at end of file
diff --git a/docz/docs/03-demos/17-mobile/03-quasar.md b/docz/docs/03-demos/17-mobile/03-quasar.md
index bdc6695..e136aae 100644
--- a/docz/docs/03-demos/17-mobile/03-quasar.md
+++ b/docz/docs/03-demos/17-mobile/03-quasar.md
@@ -41,12 +41,19 @@ The ["Demo"](#demo) creates an app that looks like the screenshots below:
This demo was tested in the following environments:
+**Real Devices**
+
+| OS | Device | Quasar | Date |
+|:-----------|:--------------------|:---------|:-----------|
+| Android 30 | NVIDIA Shield | `2.16.4` | 2024-06-09 |
+| iOS 15.1 | iPad Pro | `2.16.4` | 2024-06-09 |
+
**Simulators**
| OS | Device | Quasar | Dev Platform | Date |
|:-----------|:--------------------|:---------|:-------------|:-----------|
-| Android 34 | Pixel 3a | `2.14.1` | `darwin-x64` | 2023-12-04 |
-| iOS 17.0.1 | iPhone SE (3rd gen) | `2.14.1` | `darwin-x64` | 2023-12-04 |
+| Android 34 | Pixel 3a | `2.16.4` | `darwin-arm` | 2024-06-09 |
+| iOS 17.5 | iPhone SE (3rd gen) | `2.16.4` | `darwin-arm` | 2024-06-09 |
:::
@@ -167,6 +174,13 @@ npm i -g @quasar/cli cordova
(you may need to run `sudo npm i -g` if there are permission issues)
+
+ Installation Notes (click to show)
+
+Quasar requires Java 17
+
+
+
1) Create a new app:
```bash
@@ -177,19 +191,19 @@ npm init quasar
When prompted:
-- "What would you like to build?": `App with Quasar CLI`
+- "What would you like to build?": `App with Quasar CLI, let's go!`
- "Project folder": `SheetJSQuasar`
- "Pick Quasar version": `Quasar v2 (Vue 3 | latest and greatest)`
- "Pick script type": `Typescript`
- "Pick Quasar App CLI variant": `Quasar App CLI with Vite`
-- "Package name": (just press enter, it will use the default `sheetjsquasar`
+- "Package name": (press Enter, it will use the default `sheetjsquasar`)
- "Project product name": `SheetJSQuasar`
- "Project description": `SheetJS + Quasar`
-- "Author": (just press enter, it will use your git config settings)
+- "Author": (press Enter, it will use your git config settings)
- "Pick a Vue component style": `Composition API`
- "Pick your CSS preprocessor": `None`
-- "Check the features needed for your project": Deselect everything
-- "Install project dependencies": `No`
+- "Check the features needed for your project": Deselect everything (scroll down to each selected item and press Space)
+- "Install project dependencies": `Yes, use npm`
2) Install dependencies:
@@ -236,7 +250,7 @@ Return to the project directory:
cd ..
```
-11) Enable file sharing and make the documents folder visible in the iOS app.
+4) Enable file sharing and make the documents folder visible in the iOS app.
The following lines must be added to `src-cordova/platforms/ios/SheetJSQuasar/SheetJSQuasar-Info.plist`:
```xml title="src-cordova/platforms/ios/SheetJSQuasar/SheetJSQuasar-Info.plist (add to file)"
@@ -260,6 +274,8 @@ The following lines must be added to `src-cordova/platforms/ios/SheetJSQuasar/Sh
quasar dev -m ios
```
+If prompted to select an external IP, press Enter.
+
:::caution pass
If the app is blank or not refreshing, delete the app and close the simulator,
@@ -269,7 +285,7 @@ then restart the development process.
6) Add the Dialog plugin to `quasar.config.js`:
-```js title="quasar.config.js"
+```js title="quasar.config.js (add highlighted line)"
framework: {
config: {},
// ...
@@ -282,7 +298,7 @@ then restart the development process.
7) In the template section of `src/pages/IndexPage.vue`, replace the example
with a Table, Save button and Load file picker component:
-```html title="src/pages/IndexPage.vue"
+```html title="src/pages/IndexPage.vue (change highlighted lines)"
@@ -298,7 +314,7 @@ then restart the development process.
This uses two functions that should be added to the component script:
-```ts title="src/pages/IndexPage.vue"
+```ts title="src/pages/IndexPage.vue (add highlighted lines)"
const meta = ref({
totalCount: 1200
});
@@ -326,7 +342,7 @@ then restart the development process.
8) Wire up the `updateFile` function:
-```ts title="src/pages/IndexPage.vue"
+```ts title="src/pages/IndexPage.vue (add highlighted lines)"
import { defineComponent, ref } from 'vue';
// highlight-start
import { read, write, utils } from 'xlsx';
@@ -375,7 +391,7 @@ Once selected, the screen should refresh with new contents.
9) Wire up the `saveFile` function:
-```ts title="src/pages/IndexPage.vue"
+```ts title="src/pages/IndexPage.vue (add highlighted lines)"
function saveFile() {
// highlight-start
/* generate workbook from state */
@@ -473,6 +489,8 @@ cd ..
quasar dev -m android
```
+If prompted to select an external IP, press Enter.
+
To test that reading works:
- Click and drag `pres.numbers` from a Finder window into the simulator.
@@ -489,6 +507,80 @@ adb exec-out run-as org.sheetjs.quasar cat files/files/SheetJSQuasar.xlsx > /tmp
npx xlsx-cli /tmp/SheetJSQuasar.xlsx
```
+**iOS Device**
+
+12) Close all open emulators and simulators.
+
+13) Disconnect any iOS or Android devices connected to the computer.
+
+14) Connect the iOS device to the computer.
+
+15) Open the Xcode project:
+
+```bash
+open src-cordova/platforms/ios/SheetJSQuasar.xcodeproj
+```
+
+Select "SheetJSQuasar" in the Navigator. In the main pane, select "Signing &
+Capabilities" and ensure a Team is selected. Save and close the project.
+
+16) Start the dev process:
+
+```bash
+quasar dev -m ios
+```
+
+If prompted to select an external IP, press Enter.
+
+17) Test the application:
+
+- Press the Home button (or swipe up with one finger) and switch to Safari.
+- Download https://docs.sheetjs.com/pres.numbers
+- Press the Home button (or swipe up with one finger) and select the `SheetJSQuasar` app
+- Tap the "Load" button, then select "Choose File" and select the downloaded `pres.numbers`
+
+The table will update with new data.
+
+- Tap "Save File"
+- Press the Home button (or swipe up with one finger) and switch to Files.
+- Tap `<` until the main "Browse" window is displayed, then select "On My iPhone"
+- Look for the "SheetJSQuasar" folder and tap `SheetJSQuasar.xlsx`.
+
+If Numbers is installed on the device, it will display the contents of the new file.
+
+**Android Device**
+
+18) Close all open emulators and simulators.
+
+19) Disconnect any iOS or Android devices connected to the computer.
+
+20) Connect the Android device to the computer.
+
+21) Start the dev process:
+
+```bash
+quasar dev -m android
+```
+
+If prompted to select an external IP, press Enter.
+
+22) Test the application:
+
+- Press the Home button (or swipe up with one finger) and switch to Browser.
+- Download https://docs.sheetjs.com/pres.numbers
+- Press the Home button (or swipe up with one finger) and select the `SheetJSQuasar` app
+- Tap the "Load" button, then select "Choose File" and select the downloaded `pres.numbers`
+
+The table will update with new data.
+
+:::warning pass
+
+The "Save File" process will write files. However, Android 30+ requires special
+methods ("Storage Access Framework") that are not implemented in Quasar.
+
+:::
+
+
[^1]: See ["File Picker"](https://quasar.dev/vue-components/file-picker) in the Quasar documentation.
[^2]: See [`read` in "Reading Files"](/docs/api/parse-options)
[^3]: See ["SheetJS Data Model"](/docs/csf/) for more details on workbooks, worksheets, and other concepts.
diff --git a/docz/docs/03-demos/17-mobile/04-ionic.md b/docz/docs/03-demos/17-mobile/04-ionic.md
index 9b24977..3cefd86 100644
--- a/docz/docs/03-demos/17-mobile/04-ionic.md
+++ b/docz/docs/03-demos/17-mobile/04-ionic.md
@@ -53,29 +53,21 @@ This demo was tested in the following environments:
| OS | Device | Config | Date |
|:-----------|:--------------------|:-------|:-----------|
-| Android 30 | NVIDIA Shield | B | 2024-05-30 |
-| iOS 15.1 | iPad Pro | B | 2024-05-30 |
+| Android 30 | NVIDIA Shield | A | 2024-05-30 |
+| iOS 15.1 | iPad Pro | A | 2024-05-30 |
**Simulators**
| OS | Device | Config | Dev Platform | Date |
|:-----------|:--------------------|:-------|:-------------|:-----------|
-| Android 34 | Pixel 3a | A | `darwin-x64` | 2023-12-04 |
-| iOS 17.0.1 | iPhone SE (3rd gen) | A | `darwin-x64` | 2023-12-04 |
-| Android 34 | Pixel 3a | B | `darwin-arm` | 2024-05-30 |
-| iOS 17.5 | iPhone SE (3rd gen) | B | `darwin-arm` | 2024-05-30 |
+| Android 34 | Pixel 3a | A | `darwin-arm` | 2024-05-30 |
+| iOS 17.5 | iPhone SE (3rd gen) | A | `darwin-arm` | 2024-05-30 |
Configurations (click to show)
Configuration A:
-- Ionic: `@ionic/angular 7.5.7`, `@ionic/angular-toolkit 9.0.0`
-- Cordova: `cordova-lib@12.0.1`, `android 12.0.1, ios 7.0.1`
-- File Integration: `@awesome-cordova-plugins/file` version `6.4.0`
-
-Configuration B:
-
- Ionic: `@ionic/angular 8.2.0`, `@ionic/angular-toolkit 11.0.1`
- Cordova: `cordova-lib@12.0.1`, `android 13.0.0, ios 7.1.0`
- File Integration: `@awesome-cordova-plugins/file` version `6.7.0`
diff --git a/docz/docs/03-demos/17-mobile/index.md b/docz/docs/03-demos/17-mobile/index.md
index 98c79c1..c087ee9 100644
--- a/docz/docs/03-demos/17-mobile/index.md
+++ b/docz/docs/03-demos/17-mobile/index.md
@@ -1,17 +1,27 @@
---
-title: iOS and Android Apps
+title: Tables on Tablets and Mobile Devices
+sidebar_label: iOS and Android Apps
pagination_prev: demos/static/index
pagination_next: demos/desktop/index
+hide_table_of_contents: true
---
+import EngineData from '/data/mobile.js'
import DocCardList from '@theme/DocCardList';
import {useCurrentSidebarCategory} from '@docusaurus/theme-common';
+[SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing
+data from spreadsheets.
+
Many mobile app frameworks mix JavaScript / CSS / HTML5 concepts with native
extensions and libraries to create a hybrid development experience. Developers
well-versed in web technologies can now build actual mobile applications that
run on iOS and Android!
+The demos in this section showcase a number of mobile frameworks. In each case,
+we will build a sample app that loads SheetJS library scripts and processes
+on-device and remote spreadsheet files.
+
:::danger pass
**The ecosystem has broken backwards-compatibility many times!**
@@ -24,10 +34,6 @@ MacOS is required for the iOS demos. The Android demos were tested on MacOS.
:::
-The ["JavaScript Engines"](/docs/demos/engines) section includes samples for JS
-engines used in the mobile app frameworks. SheetJS libraries have been tested
-in the relevant engines and should "just work" with some caveats.
-
Demos for common tools are included in separate pages. Each demo section will
mention test dates and platform versions.
@@ -40,6 +46,14 @@ mention test dates and platform versions.
);
})}
+:::info pass
+
+The ["JavaScript Engines"](/docs/demos/engines) section includes samples for JS
+engines used in the mobile app frameworks. SheetJS libraries have been tested
+in the relevant engines.
+
+:::
+
:::note Recommendation
React Native is extremely popular and is the recommended choice for greenfield
@@ -57,3 +71,16 @@ for features that must be included, or for teams that are comfortable with
native app development, React Native is the obvious choice.
:::
+
+### Platforms
+
+The following frameworks have been tested:
+
+
+
+:::info pass
+
+When this table was last updated, it was not possible to build an iOS app from
+Linux or Windows. Android tooling runs on MacOS, Linux and Windows.
+
+:::
diff --git a/docz/docs/03-demos/20-cli/12-bunsea.md b/docz/docs/03-demos/20-cli/12-bunsea.md
index 262934e..85f6fa9 100644
--- a/docz/docs/03-demos/20-cli/12-bunsea.md
+++ b/docz/docs/03-demos/20-cli/12-bunsea.md
@@ -81,6 +81,7 @@ This demo was last tested in the following deployments:
|:-------------|:---------|:-----------|
| `darwin-x64` | `1.1.10` | 2024-05-28 |
| `darwin-arm` | `1.1.10` | 2024-05-29 |
+| `linux-x64` | `1.1.12` | 2024-06-09 |
:::
diff --git a/docz/docs/03-demos/42-engines/index.md b/docz/docs/03-demos/42-engines/index.md
index c83b3e1..384bb29 100644
--- a/docz/docs/03-demos/42-engines/index.md
+++ b/docz/docs/03-demos/42-engines/index.md
@@ -4,10 +4,6 @@ pagination_prev: demos/bigdata/index
pagination_next: solutions/input
---
-import current from '/version.js';
-import Tabs from '@theme/Tabs';
-import TabItem from '@theme/TabItem';
-import CodeBlock from '@theme/CodeBlock';
import EngineData from '/data/engines.js'
[SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing
diff --git a/docz/static/nativescript/and.png b/docz/static/nativescript/and.png
index df699ab..cf9574c 100644
Binary files a/docz/static/nativescript/and.png and b/docz/static/nativescript/and.png differ
diff --git a/docz/static/nativescript/ios.png b/docz/static/nativescript/ios.png
index fb78b2d..d3201cb 100644
Binary files a/docz/static/nativescript/ios.png and b/docz/static/nativescript/ios.png differ
diff --git a/docz/static/nativescript/step7.png b/docz/static/nativescript/step7.png
index 38ab71a..c5c5ffe 100644
Binary files a/docz/static/nativescript/step7.png and b/docz/static/nativescript/step7.png differ
diff --git a/docz/static/quasar/and.png b/docz/static/quasar/and.png
index 38e606c..bdae04f 100644
Binary files a/docz/static/quasar/and.png and b/docz/static/quasar/and.png differ
diff --git a/docz/static/quasar/ios.png b/docz/static/quasar/ios.png
index 790b218..c877b0f 100644
Binary files a/docz/static/quasar/ios.png and b/docz/static/quasar/ios.png differ