ng

docz/docs/03-demos/01-frontend/03-angular.md

@@ -28,6 +28,17 @@ should be directed to the Angular project.
 
 :::
 
+:::caution
+
+Angular CLI enables telemetry by default. When using a recent version, disable
+analytics globally through the CLI tool before creating a new project:
+
+```bash
+npx @angular/cli analytics disable -g
+```
+
+:::
+
 
 ## Installation
 
@@ -137,6 +148,40 @@ export class AppComponent {
 }
 ```
 
+<details><summary><b>How to run the example</b> (click to show)</summary>
+
+:::note
+
+This demo was last run on 2023 February 21 using Angular CLI `15.1.6`
+
+:::
+
+0) Disable telemetry with `npx @angular/cli analytics disable -g`
+
+1) Run `ng new --minimal --defaults --no-interactive sheetjs-angular`.
+
+2) Install the SheetJS dependency and start the dev server:
+
+```bash
+cd sheetjs-angular
+npm install
+npm i --save https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz
+npx @angular/cli analytics disable
+npm start
+```
+
+3) Open a web browser and access the displayed URL (`http://localhost:4200`)
+
+4) Replace `src/app/app.component.ts` with the code snippet.
+
+The page will refresh and show a table with an Export button.  Click the button
+and the page will attempt to download `SheetJSAngularAoA.xlsx`.
+
+5) Build the site with `npm run build`, then test with `npx http-server dist`.
+Access `http://localhost:8080` with a web browser to test the bundled site.
+
+</details>
+
 ### HTML
 
 The main disadvantage of the Array of Objects approach is the specific nature
@@ -191,6 +236,40 @@ export class AppComponent {
 }
 ```
 
+<details><summary><b>How to run the example</b> (click to show)</summary>
+
+:::note
+
+This demo was last run on 2023 February 21 using Angular CLI `15.1.6`
+
+:::
+
+0) Disable telemetry with `npx @angular/cli analytics disable -g`
+
+1) Run `ng new --minimal --defaults --no-interactive sheetjs-angular`.
+
+2) Install the SheetJS dependency and start the dev server:
+
+```bash
+cd sheetjs-angular
+npm install
+npm i --save https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz
+npx @angular/cli analytics disable
+npm start
+```
+
+3) Open a web browser and access the displayed URL (`http://localhost:4200`)
+
+4) Replace `src/app/app.component.ts` with the code snippet.
+
+The page will refresh and show a table with an Export button.  Click the button
+and the page will attempt to download `SheetJSAngularHTML.xlsx`.
+
+5) Build the site with `npm run build`, then test with `npx http-server dist`.
+Access `http://localhost:8080` with a web browser to test the bundled site.
+
+</details>
+
 ### Rows and Columns
 
 Some data grids and UI components split worksheet state in two parts: an array
@@ -345,7 +424,7 @@ cd SheetJSAngular
 <Tabs>
   <TabItem value="2" label="2">
 
-- [`package.json.ng2`](pathname:///angular/versions/package.json-ng2) save to `package.json`
+- [`package.json-ng2`](pathname:///angular/versions/package.json-ng2) save to `package.json`
 - [`polyfills.ts-ng2`](pathname:///angular/versions/polyfills.ts-ng2) save to `src/polyfills.ts`
 
 ```bash
@@ -356,7 +435,7 @@ curl -o src/polyfills.ts -L https://docs.sheetjs.com/angular/versions/polyfills.
   </TabItem>
   <TabItem value="4" label="4">
 
-- [`package.json.ng4`](pathname:///angular/versions/package.json-ng4) save to `package.json`
+- [`package.json-ng4`](pathname:///angular/versions/package.json-ng4) save to `package.json`
 - [`polyfills.ts-ng4`](pathname:///angular/versions/polyfills.ts-ng4) save to `src/polyfills.ts`
 
 ```bash
@@ -367,7 +446,7 @@ curl -o src/polyfills.ts -L https://docs.sheetjs.com/angular/versions/polyfills.
   </TabItem>
   <TabItem value="5" label="5">
 
-- [`package.json.ng5`](pathname:///angular/versions/package.json-ng5) save to `package.json`
+- [`package.json-ng5`](pathname:///angular/versions/package.json-ng5) save to `package.json`
 - [`polyfills.ts-ng5`](pathname:///angular/versions/polyfills.ts-ng5) save to `src/polyfills.ts`
 
 ```bash
@@ -378,7 +457,7 @@ curl -o src/polyfills.ts -L https://docs.sheetjs.com/angular/versions/polyfills.
   </TabItem>
   <TabItem value="6" label="6">
 
-- [`package.json.ng6`](pathname:///angular/versions/package.json-ng6) save to `package.json`
+- [`package.json-ng6`](pathname:///angular/versions/package.json-ng6) save to `package.json`
 - [`polyfills.ts-ng6`](pathname:///angular/versions/polyfills.ts-ng6) save to `src/polyfills.ts`
 - [`angular.json-ng6`](pathname:///angular/versions/angular.json-ng6) save to `angular.json`
 
@@ -391,7 +470,7 @@ curl -o angular.json -L https://docs.sheetjs.com/angular/versions/angular.json-n
   </TabItem>
   <TabItem value="7" label="7">
 
-- [`package.json.ng7`](pathname:///angular/versions/package.json-ng7) save to `package.json`
+- [`package.json-ng7`](pathname:///angular/versions/package.json-ng7) save to `package.json`
 - [`polyfills.ts-ng7`](pathname:///angular/versions/polyfills.ts-ng7) save to `src/polyfills.ts`
 - [`angular.json-ng7`](pathname:///angular/versions/angular.json-ng7) save to `angular.json`
 
@@ -404,7 +483,7 @@ curl -o angular.json -L https://docs.sheetjs.com/angular/versions/angular.json-n
   </TabItem>
   <TabItem value="8" label="8">
 
-- [`package.json.ng8`](pathname:///angular/versions/package.json-ng8) save to `package.json`
+- [`package.json-ng8`](pathname:///angular/versions/package.json-ng8) save to `package.json`
 - [`polyfills.ts-ng8`](pathname:///angular/versions/polyfills.ts-ng8) save to `src/polyfills.ts`
 - [`angular.json-ng8`](pathname:///angular/versions/angular.json-ng8) save to `angular.json`
 - [`tsconfig.app.json-ng8`](pathname:///angular/versions/tsconfig.app.json-ng8) save to `tsconfig.app.json`
@@ -419,7 +498,7 @@ curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.
   </TabItem>
   <TabItem value="9" label="9">
 
-- [`package.json.ng9`](pathname:///angular/versions/package.json-ng9) save to `package.json`
+- [`package.json-ng9`](pathname:///angular/versions/package.json-ng9) save to `package.json`
 - [`polyfills.ts-ng9`](pathname:///angular/versions/polyfills.ts-ng9) save to `src/polyfills.ts`
 - [`angular.json-ng9`](pathname:///angular/versions/angular.json-ng9) save to `angular.json`
 - [`tsconfig.app.json-ng9`](pathname:///angular/versions/tsconfig.app.json-ng9) save to `tsconfig.app.json`
@@ -434,7 +513,7 @@ curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.
   </TabItem>
   <TabItem value="10" label="10">
 
-- [`package.json.ng10`](pathname:///angular/versions/package.json-ng10) save to `package.json`
+- [`package.json-ng10`](pathname:///angular/versions/package.json-ng10) save to `package.json`
 - [`polyfills.ts-ng10`](pathname:///angular/versions/polyfills.ts-ng10) save to `src/polyfills.ts`
 - [`angular.json-ng10`](pathname:///angular/versions/angular.json-ng10) save to `angular.json`
 - [`tsconfig.app.json-ng10`](pathname:///angular/versions/tsconfig.app.json-ng10) save to `tsconfig.app.json`
@@ -449,7 +528,7 @@ curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.
   </TabItem>
   <TabItem value="11" label="11">
 
-- [`package.json.ng11`](pathname:///angular/versions/package.json-ng11) save to `package.json`
+- [`package.json-ng11`](pathname:///angular/versions/package.json-ng11) save to `package.json`
 - [`polyfills.ts-ng11`](pathname:///angular/versions/polyfills.ts-ng11) save to `src/polyfills.ts`
 - [`angular.json-ng11`](pathname:///angular/versions/angular.json-ng11) save to `angular.json`
 - [`tsconfig.app.json-ng11`](pathname:///angular/versions/tsconfig.app.json-ng11) save to `tsconfig.app.json`
@@ -464,7 +543,7 @@ curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.
   </TabItem>
   <TabItem value="12" label="12">
 
-- [`package.json.ng12`](pathname:///angular/versions/package.json-ng12) save to `package.json`
+- [`package.json-ng12`](pathname:///angular/versions/package.json-ng12) save to `package.json`
 - [`polyfills.ts-ng12`](pathname:///angular/versions/polyfills.ts-ng12) save to `src/polyfills.ts`
 - [`angular.json-ng12`](pathname:///angular/versions/angular.json-ng12) save to `angular.json`
 - [`tsconfig.app.json-ng12`](pathname:///angular/versions/tsconfig.app.json-ng12) save to `tsconfig.app.json`
@@ -479,7 +558,7 @@ curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.
   </TabItem>
   <TabItem value="13" label="13">
 
-- [`package.json.ng13`](pathname:///angular/versions/package.json-ng13) save to `package.json`
+- [`package.json-ng13`](pathname:///angular/versions/package.json-ng13) save to `package.json`
 - [`polyfills.ts-ng13`](pathname:///angular/versions/polyfills.ts-ng13) save to `src/polyfills.ts`
 - [`angular.json-ng13`](pathname:///angular/versions/angular.json-ng13) save to `angular.json`
 - [`tsconfig.app.json-ng13`](pathname:///angular/versions/tsconfig.app.json-ng13) save to `tsconfig.app.json`
@@ -489,6 +568,21 @@ curl -o package.json -L https://docs.sheetjs.com/angular/versions/package.json-n
 curl -o src/polyfills.ts -L https://docs.sheetjs.com/angular/versions/polyfills.ts-ng13
 curl -o angular.json -L https://docs.sheetjs.com/angular/versions/angular.json-ng13
 curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.app.json-ng13
+```
+
+  </TabItem>
+  <TabItem value="14" label="14">
+
+- [`package.json-ng14`](pathname:///angular/versions/package.json-ng14) save to `package.json`
+- [`polyfills.ts-ng14`](pathname:///angular/versions/polyfills.ts-ng14) save to `src/polyfills.ts`
+- [`angular.json-ng14`](pathname:///angular/versions/angular.json-ng14) save to `angular.json`
+- [`tsconfig.app.json-ng14`](pathname:///angular/versions/tsconfig.app.json-ng14) save to `tsconfig.app.json`
+
+```bash
+curl -o package.json -L https://docs.sheetjs.com/angular/versions/package.json-ng14
+curl -o src/polyfills.ts -L https://docs.sheetjs.com/angular/versions/polyfills.ts-ng14
+curl -o angular.json -L https://docs.sheetjs.com/angular/versions/angular.json-ng14
+curl -o tsconfig.app.json -L https://docs.sheetjs.com/angular/versions/tsconfig.app.json-ng14
 ```
 
   </TabItem>
@@ -504,7 +598,7 @@ npm i -S https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz
 3) start a local server with
 
 ```bash
-npm run serve
+npm start
 ```
 
 The traditional site URL is http://localhost:4200/ .  Open the page with a web

docz/docs/03-demos/03-desktop/06-reactnative.md

@@ -27,7 +27,7 @@ from the main app script.  File operations must be written in native code.
 The "Complete Example" creates an app that looks like the screenshots below:
 
 <table><thead><tr>
-  <th><a href="#windows-demo">Windows</a></th>
+  <th><a href="#windows-demo">Win10</a></th>
   <th><a href="#macos-demo">macOS</a></th>
 </tr></thead><tbody><tr><td>
 

docz/static/angular/versions/angular.json-ng14

@@ -0,0 +1,112 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "sheetjs": {
+      "root": "",
+      "sourceRoot": "src",
+      "projectType": "application",
+      "prefix": "app",
+      "schematics": {
+        "@schematics/angular:component": {
+          "inlineTemplate": true,
+          "inlineStyle": true,
+          "skipTests": true
+        },
+        "@schematics/angular:class": {
+          "skipTests": true
+        },
+        "@schematics/angular:directive": {
+          "skipTests": true
+        },
+        "@schematics/angular:guard": {
+          "skipTests": true
+        },
+        "@schematics/angular:interceptor": {
+          "skipTests": true
+        },
+        "@schematics/angular:pipe": {
+          "skipTests": true
+        },
+        "@schematics/angular:resolver": {
+          "skipTests": true
+        },
+        "@schematics/angular:service": {
+          "skipTests": true
+        }
+      },
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/sheetjs",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.app.json",
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.css"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kb",
+                  "maximumError": "2mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "2kb",
+                  "maximumError": "4kb"
+                }
+              ],
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "buildOptimizer": false,
+              "optimization": false,
+              "vendorChunk": true,
+              "extractLicenses": false,
+              "sourceMap": true,
+              "namedChunks": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "browserTarget": "sheetjs:build:production"
+            },
+            "development": {
+              "browserTarget": "sheetjs:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "sheetjs:build"
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "sheetjs"
+}

docz/static/angular/versions/package.json-ng14

@@ -0,0 +1,39 @@
+{
+  "name": "angular14",
+  "version": "0.0.0",
+  "license": "MIT",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "14.2.10",
+    "@angular/common": "14.2.10",
+    "@angular/compiler": "14.2.10",
+
+    "@angular/core": "14.2.10",
+    "@angular/forms": "14.2.10",
+
+    "@angular/platform-browser": "14.2.10",
+    "@angular/platform-browser-dynamic": "14.2.10",
+
+    "@angular/router": "14.2.10",
+
+
+    "rxjs": "7.5.0",
+    "tslib": "2.3.0",
+    "zone.js": "0.11.4"
+  },
+  "devDependencies": {
+    "@angular-devkit/build-angular": "14.2.10",
+    "@angular/cli": "14.2.10",
+    "@angular/compiler-cli": "14.2.10",
+
+    "@types/node": "12.11.1",
+
+
+    "typescript": "~4.7.2"
+  }
+}

docz/static/angular/versions/polyfills.ts-ng14

@@ -0,0 +1 @@
+import 'zone.js';

docz/static/angular/versions/tsconfig.app.json-ng14

@@ -0,0 +1,14 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app",
+    "types": []
+  },
+  "files": [
+    "src/main.ts",
+    "src/polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.d.ts"
+  ]
+}