Desktop App testing grid
							
								
								
									
										14
									
								
								docz/data/desktop.js
									
									
									
									
									
										Normal file
									
								
							
							
								
								
								
								
								
									
									
								
							
						
						| @ -0,0 +1,14 @@ | ||||
| import { read, utils } from 'xlsx'; | ||||
| import url from './desktop.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 ( <div dangerouslySetInnerHTML={{__html: fw}}/> ); | ||||
| }; | ||||
| export default FrameworkData; | ||||
							
								
								
									
										115
									
								
								docz/data/desktop.xls
									
									
									
									
									
										Normal file
									
								
							
							
								
								
								
								
								
									
									
								
							
						
						| @ -0,0 +1,115 @@ | ||||
| <?xml version="1.0"?> | ||||
| <?mso-application progid="Excel.Sheet"?> | ||||
| <Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet" xmlns:html="http://www.w3.org/TR/REC-html40"> | ||||
|  <ExcelWorkbook xmlns="urn:schemas-microsoft-com:office:excel"> | ||||
|   <WindowHeight>10620</WindowHeight> | ||||
|   <WindowWidth>11020</WindowWidth> | ||||
|   <WindowTopX>2260</WindowTopX> | ||||
|   <WindowTopY>19600</WindowTopY> | ||||
|   <ActiveSheet>1</ActiveSheet> | ||||
|   <ProtectStructure>False</ProtectStructure> | ||||
|   <ProtectWindows>False</ProtectWindows> | ||||
|  </ExcelWorkbook> | ||||
|  <Styles> | ||||
|   <Style ss:ID="Default" ss:Name="Normal"> | ||||
|    <Alignment ss:Vertical="Bottom"/> | ||||
|    <Borders/> | ||||
|    <Font ss:FontName="Calibri" x:Family="Swiss" ss:Size="12" ss:Color="#000000"/> | ||||
|    <Interior/> | ||||
|    <NumberFormat/> | ||||
|    <Protection/> | ||||
|   </Style> | ||||
|   <Style ss:ID="s16"> | ||||
|    <Font ss:FontName="Calibri" x:Family="Swiss" ss:Size="12" ss:Color="#1C1E21"/> | ||||
|   </Style> | ||||
|   <Style ss:ID="s17"> | ||||
|    <Font ss:FontName="Calibri" x:Family="Swiss" ss:Size="12" ss:Color="#000000" ss:Bold="1"/> | ||||
|   </Style> | ||||
|   <Style ss:ID="s19"> | ||||
|    <Alignment ss:Horizontal="Center" ss:Vertical="Bottom"/> | ||||
|    <Font ss:FontName="Calibri" x:Family="Swiss" ss:Size="12" ss:Color="#000000" ss:Bold="1"/> | ||||
|   </Style> | ||||
|   <Style ss:ID="s20"> | ||||
|    <Font ss:FontName="Calibri" x:Family="Swiss" ss:Size="12" ss:Color="#467886" ss:Underline="Single"/> | ||||
|   </Style> | ||||
|  </Styles> | ||||
|  <Worksheet ss:Name="Frameworks"> | ||||
|   <Table ss:ExpandedColumnCount="7" ss:ExpandedRowCount="10" x:FullColumns="1" x:FullRows="1" ss:DefaultColumnWidth="65" ss:DefaultRowHeight="16"> | ||||
|    <Column ss:Index="2" ss:Width="24"/> | ||||
|    <Column ss:Width="31"/> | ||||
|    <Column ss:Width="24"/> | ||||
|    <Column ss:Width="31"/> | ||||
|    <Column ss:Width="24"/> | ||||
|    <Column ss:Width="31"/> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String"></Data></Cell> | ||||
|     <Cell ss:MergeAcross="1" ss:StyleID="s19"><Data ss:Type="String">MacOS</Data></Cell> | ||||
|     <Cell ss:MergeAcross="1" ss:StyleID="s19"><Data ss:Type="String">Windows</Data></Cell> | ||||
|     <Cell ss:MergeAcross="1" ss:StyleID="s19"><Data ss:Type="String">Linux</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">Framework</Data></Cell> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">x64</Data></Cell> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">ARM</Data></Cell> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">x64</Data></Cell> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">ARM</Data></Cell> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">x64</Data></Cell> | ||||
|     <Cell ss:StyleID="s17"><Data ss:Type="String">ARM</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s20" ss:HRef="/docs/demos/desktop/electron#complete-example"><Data ss:Type="String">Electron</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s20" ss:HRef="/docs/demos/desktop/nwjs#complete-example"><Data ss:Type="String">NW.js</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s20" ss:HRef="/docs/demos/desktop/wails#complete-example"><Data ss:Type="String">Wails</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s20" ss:HRef="/docs/demos/desktop/tauri#complete-example"><Data ss:Type="String">Tauri</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s20" ss:HRef="/docs/demos/desktop/neutralino#complete-example"><Data ss:Type="String">NeutralinoJS</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|    </Row> | ||||
|    <Row> | ||||
|     <Cell ss:StyleID="s20" ss:HRef="/docs/demos/desktop/reactnative"><Data ss:Type="String">React Native</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"></Cell> | ||||
|     <Cell ss:StyleID="s16"></Cell> | ||||
|    </Row> | ||||
|   </Table> | ||||
|  </Worksheet> | ||||
| </Workbook> | ||||
| @ -132,8 +132,8 @@ | ||||
|     <Cell><Data ss:Type="String">C</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|    </Row> | ||||
| @ -323,7 +323,7 @@ | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✱</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|     <Cell ss:StyleID="s16"><Data ss:Type="String">✔</Data></Cell> | ||||
|    </Row> | ||||
|  | ||||
| @ -357,9 +357,9 @@ function exportFile() { | ||||
| 
 | ||||
| This demo was tested in the following environments: | ||||
| 
 | ||||
| | VueJS   | ViteJS  | Date       | | ||||
| |:--------|:--------|:-----------| | ||||
| | `3.3.9` | `4.5.1` | 2023-12-04 | | ||||
| | VueJS    | ViteJS   | Date       | | ||||
| |:---------|:---------|:-----------| | ||||
| | `3.4.27` | `5.2.11` | 2024-05-26 | | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
|  | ||||
| @ -38,6 +38,7 @@ This demo was tested in the following environments: | ||||
| |:-----------|:--------------------|:------------------|:-------------|:-----------| | ||||
| | Android 34 | Pixel 3a            | `5.5.1` / `5.1.4` | `darwin-x64` | 2023-12-04 | | ||||
| | iOS 17.0.1 | iPhone 15 Pro Max   | `5.5.1` / `5.1.4` | `darwin-x64` | 2023-12-04 | | ||||
| | Android 34 | Pixel 3a            | `6.0.0` / `6.0.0` | `win10-x64`  | 2024-05-28 | | ||||
| 
 | ||||
| **Real Devices** | ||||
| 
 | ||||
| @ -223,7 +224,7 @@ the `Permissions` comment: | ||||
|     <uses-permission android:name="android.permission.INTERNET" /> | ||||
| ``` | ||||
| 
 | ||||
| 8) Run the app in the simulator | ||||
| 8) Run the app in the simulator: | ||||
| 
 | ||||
| ```bash | ||||
| npm run build | ||||
| @ -231,16 +232,50 @@ npx cap sync | ||||
| npx cap run android | ||||
| ``` | ||||
| 
 | ||||
| 9) Test the app | ||||
| The app should look like the screenshot at the top of the page. | ||||
| 
 | ||||
| Open the app and observe that presidents are listed in the table. | ||||
| 9) Test the export functionality. | ||||
| 
 | ||||
| Touch "Export XLSX" and the emulator will ask for permission: | ||||
| Touch "Export XLSX" and the emulator will ask for permission. Tap "Allow" and a | ||||
| popup will be displayed with a path. | ||||
| 
 | ||||
| Tap "Allow" and a popup will be displayed with a path. | ||||
| Open the "Files" app in the simulator, tap the `≡` icon and tap "Documents". Tap | ||||
| the "Documents" folder to find `SheetJSCap.xlsx`. | ||||
| 
 | ||||
| To see the generated file, switch to the "Files" app in the simulator, tap the | ||||
| `≡` icon and tap "Documents". Tap "Documents" folder to find `SheetJSCap.xlsx`. | ||||
| <details open> | ||||
|   <summary><b>Downloading the generated file</b> (click to hide)</summary> | ||||
| 
 | ||||
| `adb` must be run from the root user: | ||||
| 
 | ||||
| ```bash | ||||
| adb root | ||||
| ``` | ||||
| 
 | ||||
| The file location can be found by searching for `SheetJSCap.xlsx`: | ||||
| 
 | ||||
| ```bash | ||||
| adb exec-out find / -name SheetJSCap.xlsx | ||||
| ``` | ||||
| 
 | ||||
| The first line of the output starting with `/` is the desired path: | ||||
| 
 | ||||
| ```text | ||||
| find: /proc/8533/task/8533/exe: No such file or directory | ||||
| find: /proc/8533/exe: No such file or directory | ||||
| // highlight-next-line | ||||
| /data/media/0/Documents/SheetJSCap.xlsx | ||||
| /storage/emulated/0/Documents/SheetJSCap.xlsx | ||||
| ``` | ||||
| 
 | ||||
| `adb pull` can download the file: | ||||
| 
 | ||||
| ```bash | ||||
| adb pull "/data/media/0/Documents/SheetJSCap.xlsx" SheetJSCap.xlsx | ||||
| ``` | ||||
| 
 | ||||
| `SheetJSCap.xlsx` can be opened with a spreadsheet editor such as Excel. | ||||
| 
 | ||||
| </details> | ||||
| 
 | ||||
| ### iOS | ||||
| 
 | ||||
|  | ||||
| @ -189,11 +189,11 @@ This demo was tested in the following environments: | ||||
| | OS and Version | Architecture | Electron | Date       | | ||||
| |:---------------|:-------------|:---------|:-----------| | ||||
| | macOS 14.4     | `darwin-x64` | `29.1.4` | 2024-03-15 | | ||||
| | macOS 14.1.2   | `darwin-arm` | `27.1.3` | 2023-12-01 | | ||||
| | macOS 14.5     | `darwin-arm` | `30.0.8` | 2024-05-28 | | ||||
| | Windows 10     | `win10-x64`  | `28.2.0` | 2024-03-04 | | ||||
| | Windows 11     | `win11-arm`  | `27.1.3` | 2023-12-01 | | ||||
| | Windows 11     | `win11-arm`  | `30.0.8` | 2024-05-28 | | ||||
| | Linux (HoloOS) | `linux-x64`  | `29.1.4` | 2024-03-21 | | ||||
| | Linux (Debian) | `linux-arm`  | `27.1.3` | 2023-12-01 | | ||||
| | Linux (Debian) | `linux-arm`  | `30.0.8` | 2024-05-28 | | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -274,9 +274,12 @@ The program will run on ARM64 Windows. | ||||
| 
 | ||||
| | Architecture | Command                                                       | | ||||
| |:-------------|:--------------------------------------------------------------| | ||||
| | `darwin-x64` | `open ./out/sheetjs-electron-darwin-x64/sheetjs-electron.app` | | ||||
| | `win10-x64`  | `.\out\sheetjs-electron-win32-x64\sheetjs-electron.exe`       | | ||||
| | `linux-x64`  | `./out/sheetjs-electron-linux-x64/sheetjs-electron`           | | ||||
| | `darwin-x64` |`open ./out/sheetjs-electron-darwin-x64/sheetjs-electron.app`  | | ||||
| | `darwin-arm` |`open ./out/sheetjs-electron-darwin-arm64/sheetjs-electron.app`| | ||||
| | `win10-x64`  |`.\out\sheetjs-electron-win32-x64\sheetjs-electron.exe`        | | ||||
| | `win11-arm`  |`.\out\sheetjs-electron-win32-x64\sheetjs-electron.exe`        | | ||||
| | `linux-x64`  |`./out/sheetjs-electron-linux-x64/sheetjs-electron`            | | ||||
| | `linux-x64`  |`./out/sheetjs-electron-linux-arm64/sheetjs-electron`          | | ||||
| 
 | ||||
| #### Electron API | ||||
| 
 | ||||
| @ -319,7 +322,7 @@ and select `pres.numbers`. | ||||
| ## Electron Breaking Changes | ||||
| 
 | ||||
| The first version of this demo used Electron 1.7.5.  The current demo includes | ||||
| the required changes for Electron 28.2.0. | ||||
| the required changes for Electron 30.0.8. | ||||
| 
 | ||||
| There are no Electron-specific workarounds in the library, but Electron broke | ||||
| backwards compatibility multiple times.  A summary of changes is noted below. | ||||
|  | ||||
| @ -114,9 +114,9 @@ This demo was tested in the following environments: | ||||
| | OS and Version | Architecture | NW.js    | Date       | Notes                | | ||||
| |:---------------|:-------------|:---------|:-----------|:---------------------| | ||||
| | macOS 14.3.1   | `darwin-x64` | `0.85.0` | 2024-03-12 |                      | | ||||
| | macOS 14.1.2   | `darwin-arm` | `0.82.0` | 2023-12-01 |                      | | ||||
| | macOS 14.5     | `darwin-arm` | `0.88.0` | 2024-05-28 |                      | | ||||
| | Windows 10     | `win10-x64`  | `0.83.0` | 2024-03-04 |                      | | ||||
| | Windows 11     | `win11-arm`  | `0.82.0` | 2023-12-01 |                      | | ||||
| | Windows 11     | `win11-arm`  | `0.88.0` | 2024-05-28 |                      | | ||||
| | Linux (HoloOS) | `linux-x64`  | `0.85.0` | 2024-03-12 |                      | | ||||
| | Linux (Debian) | `linux-arm`  | `0.60.0` | 2024-05-23 | Unofficial build[^1] | | ||||
| 
 | ||||
| @ -138,7 +138,7 @@ cd sheetjs-nwjs | ||||
|   "version": "0.0.0", | ||||
|   "main": "index.html", | ||||
|   "dependencies": { | ||||
|     "nw": "0.85.0", | ||||
|     "nw": "0.88.0", | ||||
|     "xlsx": "https://cdn.sheetjs.com/xlsx-${current}/xlsx-${current}.tgz" | ||||
|   } | ||||
| }`} | ||||
| @ -171,13 +171,18 @@ npm i | ||||
| npx nw . | ||||
| ``` | ||||
| 
 | ||||
| The app will show and you should be able to verify reading and writing by using | ||||
| the file input element to select a spreadsheet and clicking the export button. | ||||
| On launch, the app will fetch and parse https://docs.sheetjs.com/pres.numbers . | ||||
| 
 | ||||
| Using the file input element, a file can be selected from the filesystem and the | ||||
| table will refresh with the contents of the selected file. | ||||
| 
 | ||||
| Click "Export Data!" and save the generated file to `SheetJSNWDemo.xlsx`. This | ||||
| file can be opened in Excel or another spreadsheet editor. | ||||
| 
 | ||||
| 5) To build a standalone app, run the builder: | ||||
| 
 | ||||
| ```bash | ||||
| npx -p nw-builder nwbuild --mode=build --version=0.85.0 --glob=false --outDir=../out ./ | ||||
| npx -p nw-builder nwbuild --mode=build --version=0.88.0 --glob=false --outDir=../out ./ | ||||
| ``` | ||||
| 
 | ||||
| This will generate the standalone app in the `..\out\` folder. | ||||
|  | ||||
| @ -298,11 +298,11 @@ This demo was tested in the following environments: | ||||
| | OS and Version | Architecture | Wails    | Date       | | ||||
| |:---------------|:-------------|:---------|:-----------| | ||||
| | macOS 14.4     | `darwin-x64` | `v2.8.0` | 2024-03-15 | | ||||
| | macOS 14.1.2   | `darwin-arm` | `v2.6.0` | 2023-12-01 | | ||||
| | macOS 14.5     | `darwin-arm` | `v2.8.2` | 2024-05-28 | | ||||
| | Windows 10     | `win10-x64`  | `v2.8.0` | 2024-03-24 | | ||||
| | Windows 11     | `win11-arm`  | `v2.6.0` | 2023-12-01 | | ||||
| | Windows 11     | `win11-arm`  | `v2.8.2` | 2024-05-28 | | ||||
| | Linux (HoloOS) | `linux-x64`  | `v2.8.0` | 2024-03-21 | | ||||
| | Linux (Debian) | `linux-arm`  | `v2.6.0` | 2023-12-01 | | ||||
| | Linux (Debian) | `linux-arm`  | `v2.8.2` | 2024-05-28 | | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -334,7 +334,7 @@ On macOS and Linux, the `PATH` environment variable must include `~/go/bin`. If | ||||
| `wails` cannot be found, run the following command in the terminal session: | ||||
| 
 | ||||
| ```bash | ||||
| export PATH="$PATH:~/go/bin" | ||||
| export PATH="$PATH":~/go/bin | ||||
| ``` | ||||
| 
 | ||||
| ::: | ||||
|  | ||||
| @ -345,11 +345,11 @@ This demo was tested in the following environments: | ||||
| | OS and Version | Architecture | Tauri     | Date       | | ||||
| |:---------------|:-------------|:----------|:-----------| | ||||
| | macOS 14.4     | `darwin-x64` | `v1.5.11` | 2024-04-20 | | ||||
| | macOS 14.0     | `darwin-arm` | `v1.5.2`  | 2023-10-18 | | ||||
| | macOS 14.5     | `darwin-arm` | `v1.5.14` | 2024-05-26 | | ||||
| | Windows 10     | `win10-x64`  | `v1.5.11` | 2024-03-24 | | ||||
| | Windows 11     | `win11-arm`  | `v1.5.7`  | 2023-12-01 | | ||||
| | Windows 11     | `win11-arm`  | `v1.5.14` | 2024-05-28 | | ||||
| | Linux (HoloOS) | `linux-x64`  | `v1.5.11` | 2024-03-21 | | ||||
| | Linux (Debian) | `linux-arm`  | `v1.5.7`  | 2023-12-01 | | ||||
| | Linux (Debian) | `linux-arm`  | `v1.5.14` | 2024-05-28 | | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -467,6 +467,15 @@ npm add vite-plugin-kaioken -D --save | ||||
| // highlight-end | ||||
| ``` | ||||
| 
 | ||||
| In the same file, look for `"title"` and change the value to `SheetJS x Tauri`: | ||||
| 
 | ||||
| ```json title="src-tauri/tauri.conf.json (edit highlighted line)" | ||||
|       { | ||||
|       // highlight-next-line | ||||
|         "title": "SheetJS x Tauri", | ||||
|         "width": 800, | ||||
| ``` | ||||
| 
 | ||||
| In the same file, look for `"identifier"` and change the value to `com.sheetjs.tauri`: | ||||
| 
 | ||||
| ```json title="src-tauri/tauri.conf.json (edit highlighted line)" | ||||
| @ -685,6 +694,14 @@ select "Automation" in the body. Look for "Terminal", expand the section, and en | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| :::note pass | ||||
| 
 | ||||
| In some tests, the fonts did not match the screenshots. | ||||
| 
 | ||||
| **The Inter font static TTFs must be manually downloaded and installed.**[^17] | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| [^1]: See ["Security"](https://tauri.app/v1/references/architecture/security#allowing-api) in the Tauri documentation | ||||
| [^2]: See [`FsAllowlistConfig`](https://tauri.app/v1/api/config/#fsallowlistconfig) in the Tauri documentation | ||||
| [^3]: See [`DialogAllowlistConfig`](https://tauri.app/v1/api/config/#dialogallowlistconfig) in the Tauri documentation | ||||
| @ -700,4 +717,5 @@ select "Automation" in the body. Look for "Terminal", expand the section, and en | ||||
| [^13]: See [`fs`](https://tauri.app/v1/api/js/fs#writebinaryfile) in the Tauri documentation | ||||
| [^14]: See ["Array of Arrays Input" in "Utility Functions"](/docs/api/utilities/array#array-of-arrays-input) | ||||
| [^15]: See ["Workbook Helpers" in "Utility Functions"](/docs/api/utilities/wb) | ||||
| [^16]: See ["Prerequisites"](https://tauri.app/v1/guides/getting-started/prerequisites) in the Tauri documentation | ||||
| [^16]: See ["Prerequisites"](https://tauri.app/v1/guides/getting-started/prerequisites) in the Tauri documentation | ||||
| [^17]: Click "Get font" in the [Inter Google Fonts listing](https://fonts.google.com/specimen/Inter) | ||||
| @ -195,9 +195,12 @@ This demo was tested in the following environments: | ||||
| | macOS 14.4     | `darwin-x64` | `5.0.0`  | `5.0.1`  | 2024-03-15 | | ||||
| | macOS 14.5     | `darwin-arm` | `5.1.0`  | `5.1.0`  | 2024-05-25 | | ||||
| | Windows 10     | `win10-x64`  | `5.1.0`  | `5.1.0`  | 2024-03-24 | | ||||
| | Windows 11     | `win11-arm`  | `4.14.1` | `3.12.0` | 2023-12-01 | | ||||
| | 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 (Debian) | `linux-arm`  | `4.14.1` | `3.12.0` | 2023-12-01 | | ||||
| | Linux (Debian) | `linux-arm`  | `5.1.0`  | `5.1.1`  | 2024-05-28 | | ||||
| 
 | ||||
| On `win11-arm`, the Electron runner is a proper ARM64 binary but the binaries | ||||
| generated by Electron Forge are x64. The x64 binaries run in Windows on ARM. | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -303,7 +306,7 @@ table { | ||||
| 
 | ||||
| 6) Print the version number in the `showInfo` method of `resources/js/main.js`: | ||||
| 
 | ||||
| ```js title="resources/js/main.js" | ||||
| ```js title="resources/js/main.js (add highlighted lines)" | ||||
| function showInfo() { | ||||
|     document.getElementById('info').innerHTML = ` | ||||
|         ${NL_APPID} is running on port ${NL_PORT}  inside ${NL_OS} | ||||
| @ -408,9 +411,11 @@ npx @neutralinojs/neu build | ||||
| 
 | ||||
| Platform-specific programs will be created in the `dist` folder: | ||||
| 
 | ||||
| | Platform     | Path to binary                             | | ||||
| |:-------------|:-------------------------------------------| | ||||
| | `darwin-arm` | `./dist/sheetjs-neu/sheetjs-neu-mac_arm64` | | ||||
| | Platform     | Path to binary                               | | ||||
| |:-------------|:---------------------------------------------| | ||||
| | `darwin-arm` | `./dist/sheetjs-neu/sheetjs-neu-mac_arm64`   | | ||||
| | `win11-arm`  | `.\dist\sheetjs-neu\sheetjs-neu-win_x64.exe` | | ||||
| | `linux-arm`  | `.\dist\sheetjs-neu\sheetjs-neu-linux_arm64` | | ||||
| 
 | ||||
| Run the generated app and confirm that Presidential data is displayed. | ||||
| 
 | ||||
|  | ||||
| @ -46,11 +46,11 @@ This demo was tested in the following environments: | ||||
| 
 | ||||
| | OS and Version | Architecture | RN Platform | Date       | | ||||
| |:---------------|:-------------|:------------|:-----------| | ||||
| | Windows 10     | `win10-x64`  | `v0.73.11`  | 2024-03-24 | | ||||
| | Windows 11     | `win11-x64`  | `v0.72.12`  | 2023-10-14 | | ||||
| | Windows 10     | `win10-x64`  | `v0.74.6`   | 2024-05-28 | | ||||
| | Windows 11     | `win11-x64`  | `v0.74.6`   | 2024-05-28 | | ||||
| | Windows 11     | `win11-arm`  | `v0.74.5`   | 2024-05-25 | | ||||
| | MacOS 14.4     | `darwin-x64` | `v0.73.22`  | 2024-03-24 | | ||||
| | MacOS 14.1.2   | `darwin-arm` | `v0.72.11`  | 2023-12-01 | | ||||
| | MacOS 14.5     | `darwin-arm` | `v0.73.30`  | 2024-05-28 | | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -673,7 +673,7 @@ npx -y react-native-macos-init --no-telemetry | ||||
| 
 | ||||
| :::caution pass | ||||
| 
 | ||||
| In the most recent x64 test, the build failed due to `visionos` errors: | ||||
| In some macOS tests, the build failed due to `visionos` errors: | ||||
| 
 | ||||
| ``` | ||||
| [!] Failed to load 'React-RCTFabric' podspec: | ||||
| @ -686,6 +686,14 @@ This error was resolved by upgrading CocoaPods to `1.15.2`: | ||||
| sudo gem install cocoapods | ||||
| ``` | ||||
| 
 | ||||
| After upgrading CocoaPods, reinstall the project pods: | ||||
| 
 | ||||
| ```bash | ||||
| cd macos | ||||
| pod install | ||||
| cd .. | ||||
| ``` | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| 3) Install the SheetJS library: | ||||
| @ -704,14 +712,14 @@ Close the running app from the dock and close the Metro terminal window. | ||||
| 
 | ||||
| :::danger pass | ||||
| 
 | ||||
| When the demo was last tested on x64, the app failed with a warning | ||||
| When the demo was last tested, the app failed with a warning | ||||
| 
 | ||||
| > No bundle URL present. | ||||
| 
 | ||||
| **As this affects the default app, this is a bug in React Native macOS!** | ||||
| 
 | ||||
| The production builds work as expected. If there are errors, the recommended | ||||
| approach is to [make a release build](#production) every time. | ||||
| The production builds work as expected. If there are errors, click "Dismiss" to | ||||
| dismiss the error, close the app, and [make a release build](#production). | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -789,7 +797,6 @@ B) Copy the highlighted lines and paste under `/* Begin PBXFileReference section | ||||
|     4717DC6828CC495400A9BE56 /* RCTDocumentPicker.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; name = RCTDocumentPicker.h; path = "SheetJSMacOS-macOS/RCTDocumentPicker.h"; sourceTree = "<group>"; }; | ||||
|     4717DC6928CC499A00A9BE56 /* RCTDocumentPicker.m */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.objc; name = RCTDocumentPicker.m; path = "SheetJSMacOS-macOS/RCTDocumentPicker.m"; sourceTree = "<group>"; }; | ||||
| // highlight-end | ||||
|     008F07F21AC5B25A0029DE68 /* main.jsbundle */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text; path = main.jsbundle; sourceTree = "<group>"; }; | ||||
| ``` | ||||
| 
 | ||||
| ::: | ||||
| @ -959,9 +966,9 @@ xcodebuild -workspace macos/SheetJSmacOS.xcworkspace -scheme SheetJSmacOS-macOS | ||||
| ``` | ||||
| 
 | ||||
| When the demo was last tested, the path to the generated app was displayed in | ||||
| the terminal. Search for `Release/SheetJSmacOS.app` and look for `touch`: | ||||
| the terminal. Search for `Release/SheetJSmacOS.app` and look for `touch -c`: | ||||
| 
 | ||||
| ``` | ||||
| ```text title="Sample result when searching for 'touch -c'" | ||||
|     /usr/bin/touch -c /Users/sheetjs/Library/Developer/Xcode/DerivedData/SheetJSmacOS-abcdefghijklmnopqrstuvwxyzab/Build/Products/Release/SheetJSmacOS.app | ||||
| ``` | ||||
| 
 | ||||
|  | ||||
| @ -2,13 +2,43 @@ | ||||
| title: Desktop Applications | ||||
| pagination_prev: demos/mobile/index | ||||
| pagination_next: demos/cli/index | ||||
| hide_table_of_contents: true | ||||
| --- | ||||
| 
 | ||||
| import DocCardList from '@theme/DocCardList'; | ||||
| import {useCurrentSidebarCategory} from '@docusaurus/theme-common'; | ||||
| import FrameworkData from '/data/desktop.js' | ||||
| 
 | ||||
| [SheetJS](https://sheetjs.com) is a JavaScript library for reading and writing | ||||
| data from spreadsheets. | ||||
| 
 | ||||
| Web technologies including JavaScript and HTML can power traditional software. | ||||
| 
 | ||||
| This demo covers a number of desktop app frameworks. In each demo, we will build | ||||
| an app that uses SheetJS libraries to read and write spreadsheet files. | ||||
| 
 | ||||
| ## Strategies | ||||
| 
 | ||||
| There are two different integration strategies. The "WebView" strategy embeds a | ||||
| mini web browser and adds supporting native components. The "Engine" strategy | ||||
| uses an embedded JavaScript engine that fits into the desktop app. | ||||
| 
 | ||||
| ### WebView | ||||
| 
 | ||||
| WebViews are special web browser components designed to be embedded within apps. | ||||
| As the browser components are available across all major platforms, desktop apps | ||||
| can use the WebView as the main user interface. This approach allows small teams | ||||
| to build software that works across operating systems and architectures. | ||||
| 
 | ||||
| The app is designed in HTML and CSS. [Web Frameworks](/docs/demos/frontend) can | ||||
| be used but are typically not required. | ||||
| 
 | ||||
| ### Engine | ||||
| 
 | ||||
| JavaScript engines including [V8](/docs/demos/engines/v8) can be directly added | ||||
| to traditional desktop software. This approach is explored in greater detail in | ||||
| the ["JavaScript Engines" demo](/docs/demos/engines/). | ||||
| 
 | ||||
| ## Desktop Apps | ||||
| 
 | ||||
| Desktop app frameworks bundle a JavaScript engine and a windowing framework to | ||||
| @ -38,6 +68,12 @@ Frameworks like React Native generate applications that use native UI elements. | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| ## Command-Line Tools | ||||
| #### Platform Support | ||||
| 
 | ||||
| The following frameworks have been tested on the following platforms: | ||||
| 
 | ||||
| <FrameworkData/> | ||||
| 
 | ||||
| #### Command-Line Tools | ||||
| 
 | ||||
| **[The exposition has been moved to a separate page.](/docs/demos/cli)** | ||||
|  | ||||
| @ -10,6 +10,9 @@ import TabItem from '@theme/TabItem'; | ||||
| import CodeBlock from '@theme/CodeBlock'; | ||||
| import {useCurrentSidebarCategory} from '@docusaurus/theme-common'; | ||||
| 
 | ||||
| export const r = {style: {color:"red"}}; | ||||
| export const B = {style: {fontWeight:"bold"}}; | ||||
| 
 | ||||
| With the availability of JS engines and the success of server-side platforms, | ||||
| it is possible to build standalone command-line tools from JavaScript code. | ||||
| 
 | ||||
| @ -21,9 +24,8 @@ processors. The ultimate goal is to use SheetJS libraries to generate CSV output | ||||
| from arbitrary spreadsheet files. The generated command-line tool will accept an | ||||
| argument, parse the specified workbook, and print CSV rows to the terminal. | ||||
| 
 | ||||
| >**Sample terminal session** | ||||
| ```bash | ||||
| $ xlsx-cli.exe pres.numbers | ||||
| ```bash title="Sample terminal session" | ||||
| > xlsx-cli.exe pres.numbers | ||||
| Name,Index | ||||
| Bill Clinton,42 | ||||
| GeorgeW Bush,43 | ||||
| @ -92,9 +94,9 @@ This demo was tested in the following deployments: | ||||
| | `darwin-x64` | `4.0.0-rc.4` | `14.15.3` | Pre-built | 2024-03-15 | | ||||
| | `darwin-arm` | `4.0.0-rc.6` | `18.20.3` | Compiled  | 2024-05-25 | | ||||
| | `win10-x64`  | `4.0.0-rc.4` | `14.15.3` | Pre-built | 2024-04-18 | | ||||
| | `win11-arm`  | `4.0.0-rc.2` | `20.10.0` | Compiled  | 2023-12-01 | | ||||
| | `win11-arm`  | `4.0.0-rc.6` | `20.10.0` | Compiled  | 2024-05-28 | | ||||
| | `linux-x64`  | `4.0.0-rc.4` | `14.15.3` | Pre-built | 2024-03-21 | | ||||
| | `linux-arm`  | `4.0.0-rc.2` | `20.10.0` | Compiled  | 2023-12-01 | | ||||
| | `linux-arm`  | `4.0.0-rc.6` | `18.20.3` | Compiled  | 2024-05-26 | | ||||
| 
 | ||||
|   </TabItem> | ||||
|   <TabItem value="pkg" label="pkg"> | ||||
| @ -104,9 +106,9 @@ This demo was tested in the following deployments: | ||||
| | `darwin-x64` | `5.8.1` | `18.5.0` | 2024-03-15 | | ||||
| | `darwin-arm` | `5.8.1` | `18.5.0` | 2024-05-25 | | ||||
| | `win10-x64`  | `5.8.1` | `18.5.0` | 2024-04-18 | | ||||
| | `win11-arm`  | `5.8.1` | `18.5.0` | 2023-12-01 | | ||||
| | `win11-arm`  | `5.8.1` | `18.5.0` | 2024-05-28 | | ||||
| | `linux-x64`  | `5.8.1` | `18.5.0` | 2024-03-21 | | ||||
| | `linux-arm`  | `5.8.1` | `18.5.0` | 2023-12-01 | | ||||
| | `linux-arm`  | `5.8.1` | `18.5.0` | 2024-05-26 | | ||||
| 
 | ||||
|   </TabItem> | ||||
|   <TabItem value="boxednode" label="boxednode"> | ||||
| @ -117,7 +119,7 @@ This demo was tested in the following deployments: | ||||
| | `darwin-arm` | `2.4.3` | `22.2.0`  | 2024-05-25 | | ||||
| | `win10-x64`  | `2.4.2` | `16.20.2` | 2024-04-18 | | ||||
| | `linux-x64`  | `2.4.0` | `21.7.1`  | 2024-03-21 | | ||||
| | `linux-arm`  | `2.3.0` | `21.3.0`  | 2023-12-01 | | ||||
| | `linux-arm`  | `2.4.3` | `20.13.1` | 2024-05-26 | | ||||
| 
 | ||||
|   </TabItem> | ||||
| </Tabs> | ||||
| @ -174,10 +176,23 @@ This generates `xlsx-cli` or `xlsx-cli.exe` depending on platform. | ||||
| When the demo was tested on ARM targets, the Nexe pre-built packages were | ||||
| missing.  The package must be built from source: | ||||
| 
 | ||||
| <Tabs groupId="os"> | ||||
|   <TabItem value="unix" label="Linux/MacOS"> | ||||
| 
 | ||||
| ```bash | ||||
| npx nexe xlsx-cli.js --build --python=$(which python3) --make="-j8" | ||||
| ``` | ||||
| 
 | ||||
|   </TabItem> | ||||
|   <TabItem value="win" label="Windows"> | ||||
| 
 | ||||
| ```bash | ||||
| npx nexe xlsx-cli.js --build --make="-j8" | ||||
| ``` | ||||
| 
 | ||||
|   </TabItem> | ||||
| </Tabs> | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| :::caution pass | ||||
| @ -266,14 +281,39 @@ Run `boxednode`: | ||||
|   <TabItem value="unix" label="Linux/MacOS"> | ||||
| 
 | ||||
| ```bash | ||||
| npx boxednode@2.4.0 -s xlsx-cli.js -t xlsx-cli | ||||
| npx boxednode@2.4.3 -s xlsx-cli.js -t xlsx-cli | ||||
| ``` | ||||
| 
 | ||||
| :::caution pass | ||||
| 
 | ||||
| When this demo was last tested in `linux-arm`, the build failed with an error: | ||||
| 
 | ||||
| <pre> | ||||
| ../deps/v8/src/base/small-vector.h:  In instantiation of <span {...B}>‘class v8::base::SmallVector<std::pair<const v8::internal::compiler::turboshaft::PhiOp*, const v8::internal::compiler::turboshaft::OpIndex>, 16>’</span>: | ||||
| <span {...B}>../deps/v8/src/compiler/turboshaft/loop-unrolling-reducer.h:444:11:</span>   required from here | ||||
| <span {...B}>../deps/v8/src/base/macros.h:206:55:</span> <span style={{...r.style,...B.style}}>error:</span> static assertion failed: T should be trivially copyable | ||||
| {"  206 |"}   static_assert(::v8::base::is_trivially_copyable<T>::<span style={{...r.style,...B.style}}>value</span>, \\ | ||||
| {"      |"}                                                       ^~~~~ | ||||
| </pre> | ||||
| 
 | ||||
| This affects NodeJS `22.2.0`, but does not affect `20.13.1`. It affects the | ||||
| [V8 JavaScript Engine](https://docs.sheetjs.com/docs/demos/engines/v8#build-v8) | ||||
| and cannot easily be patched using `boxednode`. | ||||
| 
 | ||||
| The `-n` flag controls the target NodeJS version. For this demo, the following | ||||
| command uses NodeJS `20.13.1`: | ||||
| 
 | ||||
| ```bash | ||||
| npx boxednode@2.4.3 -s xlsx-cli.js -t xlsx-cli -n 20.13.1 | ||||
| ``` | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
|   </TabItem> | ||||
|   <TabItem value="win" label="Windows"> | ||||
| 
 | ||||
| ```bash | ||||
| npx boxednode@2.4.0 -s xlsx-cli.js -t xlsx-cli.exe -n 16.20.2 | ||||
| npx boxednode@2.4.3 -s xlsx-cli.js -t xlsx-cli.exe -n 16.20.2 | ||||
| ``` | ||||
| 
 | ||||
| :::info pass | ||||
| @ -374,7 +414,7 @@ This demo was last tested in the following deployments: | ||||
| | `win10-x64`  | `12.3.219.9`  | `0.88.0` | 2024-03-24 | | ||||
| | `win11-x64`  | `12.6.228.3`  | `0.92.0` | 2024-05-23 | | ||||
| | `linux-x64`  | `12.3.219.9`  | `0.88.0` | 2024-03-18 | | ||||
| | `linux-arm`  | `12.0.267.8`  | `0.82.0` | 2023-12-01 | | ||||
| | `linux-arm`  | `12.6.228.3`  | `0.92.0` | 2024-05-26 | | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
|  | ||||
| @ -1,5 +1,6 @@ | ||||
| --- | ||||
| title: Deno Deploy | ||||
| title: Sheets with Deno Deploy | ||||
| sidebar_label: Deno Deploy | ||||
| pagination_prev: demos/local/index | ||||
| pagination_next: demos/extensions/index | ||||
| --- | ||||
| @ -27,7 +28,7 @@ When the demo was last tested, Deno Deploy required a GitHub account. | ||||
| 
 | ||||
| :::note Tested Deployments | ||||
| 
 | ||||
| This demo was last tested by SheetJS users on 2023 October 18. | ||||
| This demo was last tested by SheetJS users on 2024 May 26. | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -87,7 +88,9 @@ class SheetJSResource extends Drash.Resource { | ||||
| 
 | ||||
| 2) If the account never signed into Deno Deploy, click "Continue with Github". | ||||
| 
 | ||||
| In the next screen, review the prompt and click "Authorize Deno Deploy" | ||||
| In the next screen, review the prompt and click "Authorize Deno Deploy". | ||||
| 
 | ||||
| If a welcome screen is displayed, click "I know what I'm doing". | ||||
| 
 | ||||
| 3) Click "New Playground" to create a new Playground. | ||||
| 
 | ||||
|  | ||||
| @ -1,5 +1,6 @@ | ||||
| --- | ||||
| title: Google Sheets | ||||
| title: Google Sheets Data Interchange | ||||
| sidebar_label: Google Sheets | ||||
| pagination_prev: demos/local/index | ||||
| pagination_next: demos/extensions/index | ||||
| --- | ||||
| @ -101,7 +102,7 @@ The edit URL starts with `https://docs.google.com/spreadsheets/d/` and includes | ||||
| 
 | ||||
| ``` | ||||
| https://docs.google.com/spreadsheets/d/a_long_string_of_characters/edit#gid=0 | ||||
| ---------------------------------------^^^^^^^^^^^^^^^^^^^^^^^^^^^--- ID | ||||
|                                       |^^^^^^^^^^^^^^^^^^^^^^^^^^^|--- ID | ||||
| ``` | ||||
| 
 | ||||
| The `GoogleSpreadsheet` constructor accepts a document ID and auth object: | ||||
|  | ||||
| @ -6,7 +6,7 @@ pagination_next: demos/extensions/index | ||||
| --- | ||||
| 
 | ||||
| <head> | ||||
|   <script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="6msofx0wc1zd7da"></script> | ||||
|   <script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="v85yuk360zx6nyx"></script> | ||||
| </head> | ||||
| 
 | ||||
| [Dropbox](https://www.dropbox.com/) is a file hosting service that offers APIs | ||||
| @ -34,7 +34,7 @@ their Dropbox account. This demo will generate a XLS workbook using SheetJS. | ||||
| The Dropbox API script is loaded in this page with | ||||
| 
 | ||||
| ```html | ||||
| <script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="6msofx0wc1zd7da"></script> | ||||
| <script type="text/javascript" src="https://www.dropbox.com/static/api/2/dropins.js" id="dropboxjs" data-app-key="v85yuk360zx6nyx"></script> | ||||
| ``` | ||||
| 
 | ||||
| The `data-app-key` used in this demo is a "Development" key associated with the | ||||
| @ -212,8 +212,10 @@ The file must be written before the Save button is created. | ||||
| 
 | ||||
| #### Saver Live Demo | ||||
| 
 | ||||
| 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. | ||||
| This demo starts with an array of arrays of data. When the page loads, the data | ||||
| is exported to XLSX and a data URI is generated. When the button is clicked, the | ||||
| data URI is sent to Dropbox and the service will attempt to save the data to | ||||
| `SheetJSDropbox.xls` in your Dropbox account. | ||||
| 
 | ||||
| :::caution pass | ||||
| 
 | ||||
| @ -264,7 +266,7 @@ function SheetJSEnregistrez() { | ||||
| 
 | ||||
| :::note Tested Deployments | ||||
| 
 | ||||
| This demo was last tested on 2023 November 30. | ||||
| This demo was last tested on 2024 May 27. | ||||
| 
 | ||||
| ::: | ||||
| 
 | ||||
| @ -276,14 +278,14 @@ step can be safely skipped. | ||||
| 
 | ||||
| 1) Create a Dropbox app in the Developer panel. | ||||
| 
 | ||||
| Click the `᎒᎒᎒` icon > App Center. In the next page, click "Build an App". In | ||||
| the next page, click "Create Apps". | ||||
| Click the `᎒᎒᎒` icon > App Center. In the next page, click "Build an App" in the | ||||
| left sidebar. In the next page, click "Create apps". | ||||
| 
 | ||||
| In the App creation wizard, select the following options: | ||||
| 
 | ||||
| - "Choose an API": "Scoped access" | ||||
| - "Choose the type of access you need": "Full Dropbox" | ||||
| - "Name": (enter any name) "SheetJS Docs" | ||||
| - "Name": (enter any name) | ||||
| 
 | ||||
| :::caution pass | ||||
| 
 | ||||
| @ -302,7 +304,9 @@ The following permissions should be selected in the "Permissions" tab | ||||
| - `files.content.write` (Edit content of your Dropbox files and folders) | ||||
| - `files.content.read` (View content of your Dropbox files and folders) | ||||
| 
 | ||||
| In the settings tab, under "Chooser / Saver / Embedder domains", the desired | ||||
| After selecting the permissions, click "Submit". | ||||
| 
 | ||||
| In the Settings tab, under "Chooser / Saver / Embedder domains", the desired | ||||
| public domains should be added. `localhost` must also be added for development | ||||
| use (it is not automatically enabled). | ||||
| 
 | ||||
|  | ||||
| @ -1,5 +1,6 @@ | ||||
| --- | ||||
| title: Google Sheets | ||||
| title: Google Sheets Script Automation | ||||
| sidebar_label: Google Sheets | ||||
| pagination_prev: demos/cloud/index | ||||
| pagination_next: demos/bigdata/index | ||||
| sidebar_custom_props: | ||||
|  | ||||
| @ -15,12 +15,12 @@ | ||||
|     "make": "electron-forge make" | ||||
|   }, | ||||
|   "devDependencies": { | ||||
|     "@electron-forge/cli": "7.3.0", | ||||
|     "@electron-forge/maker-deb": "7.3.0", | ||||
|     "@electron-forge/maker-rpm": "7.3.0", | ||||
|     "@electron-forge/maker-squirrel": "7.3.0", | ||||
|     "@electron-forge/maker-zip": "7.3.0", | ||||
|     "electron": "29.1.4" | ||||
|     "@electron-forge/cli": "7.4.0", | ||||
|     "@electron-forge/maker-deb": "7.4.0", | ||||
|     "@electron-forge/maker-rpm": "7.4.0", | ||||
|     "@electron-forge/maker-squirrel": "7.4.0", | ||||
|     "@electron-forge/maker-zip": "7.4.0", | ||||
|     "electron": "30.0.8" | ||||
|   }, | ||||
|   "config": { | ||||
|     "forge": { | ||||
|  | ||||
| Before Width: | Height: | Size: 145 KiB After Width: | Height: | Size: 131 KiB | 
| @ -70,7 +70,7 @@ try { | ||||
| </script> | ||||
| 
 | ||||
| <template> | ||||
|   <div> | ||||
|   <div class="root"> | ||||
|     <h1><a href="https://sheetjs.com" target="_blank"> | ||||
|       <img src="https://sheetjs.com/sketch128.png" class="logo" alt="SheetJS" /> | ||||
|     SheetJS × Tauri {{ ver }}</a></h1> | ||||
| @ -97,12 +97,90 @@ try { | ||||
| .logo:hover { | ||||
|   filter: drop-shadow(0 0 2em #646cffaa); | ||||
| } | ||||
| .logo.vue:hover { | ||||
|   filter: drop-shadow(0 0 2em #42b883aa); | ||||
| } | ||||
| .centre { text-align: center; } | ||||
| table.center { | ||||
|   margin-left: auto; | ||||
|   margin-right: auto; | ||||
| } | ||||
| 
 | ||||
| .root { | ||||
|   font-family: Inter, Avenir, Helvetica, Arial, sans-serif; | ||||
|   font-size: 16px; | ||||
|   line-height: 24px; | ||||
|   font-weight: 400; | ||||
| 
 | ||||
|   color: #0f0f0f; | ||||
|   background-color: #f6f6f6; | ||||
| 
 | ||||
|   font-synthesis: none; | ||||
|   text-rendering: optimizeLegibility; | ||||
|   -webkit-font-smoothing: antialiased; | ||||
|   -moz-osx-font-smoothing: grayscale; | ||||
|   -webkit-text-size-adjust: 100%; | ||||
| } | ||||
| 
 | ||||
| a { | ||||
|   font-weight: 500; | ||||
|   color: #646cff; | ||||
|   text-decoration: inherit; | ||||
| } | ||||
| 
 | ||||
| a:hover { | ||||
|   color: #535bf2; | ||||
| } | ||||
| 
 | ||||
| h1 { | ||||
|   text-align: center; | ||||
| } | ||||
| 
 | ||||
| input, | ||||
| button { | ||||
|   border-radius: 8px; | ||||
|   border: 1px solid transparent; | ||||
|   padding: 0.6em 1.2em; | ||||
|   font-size: 1em; | ||||
|   font-weight: 500; | ||||
|   font-family: inherit; | ||||
|   color: #0f0f0f; | ||||
|   background-color: #ffffff; | ||||
|   transition: border-color 0.25s; | ||||
|   box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); | ||||
| } | ||||
| 
 | ||||
| button { | ||||
|   cursor: pointer; | ||||
| } | ||||
| 
 | ||||
| button:hover { | ||||
|   border-color: #396cd8; | ||||
| } | ||||
| button:active { | ||||
|   border-color: #396cd8; | ||||
|   background-color: #e8e8e8; | ||||
| } | ||||
| 
 | ||||
| input, | ||||
| button { | ||||
|   outline: none; | ||||
| } | ||||
| 
 | ||||
| @media (prefers-color-scheme: dark) { | ||||
|   .root { | ||||
|     color: #f6f6f6; | ||||
|     background-color: #2f2f2f; | ||||
|   } | ||||
| 
 | ||||
|   a:hover { | ||||
|     color: #24c8db; | ||||
|   } | ||||
| 
 | ||||
|   input, | ||||
|   button { | ||||
|     color: #ffffff; | ||||
|     background-color: #0f0f0f98; | ||||
|   } | ||||
|   button:active { | ||||
|     background-color: #0f0f0f69; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| Before Width: | Height: | Size: 47 KiB After Width: | Height: | Size: 207 KiB | 
| Before Width: | Height: | Size: 187 KiB After Width: | Height: | Size: 150 KiB | 
| Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 218 KiB | 
| Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 167 KiB | 
| Before Width: | Height: | Size: 168 KiB After Width: | Height: | Size: 145 KiB | 
| Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 166 KiB |