feat: 8.7 updates (#13)

.github/workflows/extract-templates.yml

@@ -10,7 +10,7 @@ jobs:
 
     strategy:
       matrix:
-        starter: ['angular', 'javascript', 'react', 'svelte', 'typescript', 'vue']
+        starter: ['angular', 'javascript', 'react', 'solid', 'svelte', 'typescript', 'vue']
 
     steps:
       - uses: actions/checkout@v3

apps/nativescript-starter-angular/package.json

@@ -4,30 +4,30 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@angular/animations": "~17.0.0",
-    "@angular/common": "~17.0.0",
-    "@angular/compiler": "~17.0.0",
-    "@angular/core": "~17.0.0",
-    "@angular/forms": "~17.0.0",
-    "@angular/platform-browser": "~17.0.0",
-    "@angular/platform-browser-dynamic": "~17.0.0",
-    "@angular/router": "~17.0.0",
-    "@nativescript/angular": "~17.0.0",
-    "@nativescript/core": "~8.5.0",
+    "@angular/animations": "~17.3.0",
+    "@angular/common": "~17.3.0",
+    "@angular/compiler": "~17.3.0",
+    "@angular/core": "~17.3.0",
+    "@angular/forms": "~17.3.0",
+    "@angular/platform-browser": "~17.3.0",
+    "@angular/platform-browser-dynamic": "~17.3.0",
+    "@angular/router": "~17.3.0",
+    "@nativescript/angular": "^17.0.0",
+    "@nativescript/core": "~8.7.0",
     "@nativescript/theme": "~3.0.2",
     "rxjs": "~7.8.0",
     "zone.js": "~0.14.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~17.0.0",
-    "@angular/compiler-cli": "~17.0.0",
-    "@nativescript/preview-cli": "1.0.5",
+    "@angular-devkit/build-angular": "~17.3.0",
+    "@angular/compiler-cli": "~17.3.0",
+    "@nativescript/preview-cli": "1.0.12",
     "@nativescript/stackblitz": "0.0.8",
-    "@nativescript/tailwind": "^2.0.1",
-    "@nativescript/types-minimal": "~8.5.0",
+    "@nativescript/tailwind": "^2.1.0",
+    "@nativescript/types-minimal": "~8.7.0",
     "@nativescript/webpack": "~5.0.0",
-    "@ngtools/webpack": "~17.0.0",
-    "tailwindcss": "~3.2.0",
-    "typescript": "~5.2.2"
+    "@ngtools/webpack": "~17.3.0",
+    "tailwindcss": "~3.4.0",
+    "typescript": "~5.4.0"
   }
 }

apps/nativescript-starter-javascript/package.json

@@ -4,14 +4,14 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@nativescript/core": "~8.5.0",
+    "@nativescript/core": "~8.7.0",
     "@nativescript/theme": "~3.0.2"
   },
   "devDependencies": {
-    "@nativescript/preview-cli": "1.0.5",
+    "@nativescript/preview-cli": "1.0.12",
     "@nativescript/stackblitz": "0.0.8",
-    "@nativescript/tailwind": "^2.0.1",
+    "@nativescript/tailwind": "^2.1.0",
     "@nativescript/webpack": "~5.0.0",
-    "tailwindcss": "^3.1.8"
+    "tailwindcss": "~3.4.0"
   }
 }

apps/nativescript-starter-react/package.json

@@ -4,20 +4,20 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@nativescript/core": "~8.5.0",
+    "@nativescript/core": "~8.7.0",
     "react": "^18.2.0",
     "react-nativescript": "^5.0.0",
     "react-nativescript-navigation": "^5.0.0"
   },
   "devDependencies": {
-    "@nativescript/preview-cli": "1.0.5",
+    "@nativescript/preview-cli": "1.0.12",
     "@nativescript/stackblitz": "0.0.8",
-    "@nativescript/tailwind": "^2.0.1",
-    "@nativescript/types-minimal": "~8.5.0",
+    "@nativescript/tailwind": "^2.1.0",
+    "@nativescript/types-minimal": "~8.7.0",
     "@nativescript/webpack": "~5.0.8",
     "@types/react": "npm:types-react-without-jsx-intrinsics@^18.0.17",
-    "tailwindcss": "^3.1.8",
-    "typescript": "~4.8.4"
+    "tailwindcss": "~3.4.0",
+    "typescript": "~5.4.0"
   },
   "scripts": {
     "type-check": "tsc --noEmit"

apps/nativescript-starter-solid/.gitignore

@@ -0,0 +1,28 @@
+# NativeScript
+hooks/
+node_modules/
+platforms/
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# General
+.DS_Store
+.AppleDouble
+.LSOverride
+.idea
+.cloud
+.project
+tmp/
+typings/
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json

apps/nativescript-starter-solid/.npmrc

@@ -0,0 +1 @@
+legacy-peer-deps=true

apps/nativescript-starter-solid/.stackblitzrc

@@ -0,0 +1,5 @@
+{
+  "installDependencies": true,
+  "compileTrigger": "save",
+  "startCommand": "setup-nativescript-stackblitz && ns preview"
+}

apps/nativescript-starter-solid/nativescript.config.ts

@@ -0,0 +1,11 @@
+import { NativeScriptConfig } from '@nativescript/core';
+
+export default {
+  id: 'org.nativescript.app',
+  appPath: 'src',
+  appResourcesPath: 'App_Resources',
+  android: {
+    v8Flags: '--expose_gc',
+    markingMode: 'none',
+  },
+} as NativeScriptConfig;

apps/nativescript-starter-solid/package.json

@@ -0,0 +1,29 @@
+{
+    "name": "stackblitz-nativescript-solid",
+    "main": "src/app.js",
+    "version": "1.0.0",
+    "private": true,
+    "scripts": {},
+    "dependencies": {
+      "@nativescript-community/solid-js": "^0.0.6",
+      "@nativescript/core": "~8.7.0",
+      "dominative": "^0.1.3",
+      "solid-js": "^1.8.16",
+      "undom-ng": "^1.1.2"
+    },
+    "devDependencies": {
+      "@babel/core": "^7.24.4",
+      "@babel/preset-env": "^7.24.4",
+      "@babel/preset-typescript": "^7.24.1",
+      "@nativescript/preview-cli": "^1.0.13",
+      "@nativescript/stackblitz": "0.0.8",
+      "@nativescript/tailwind": "~2.1.0",
+      "@nativescript/webpack": "~5.0.0",
+      "babel": "^6.23.0",
+      "babel-loader": "^9.1.3",
+      "babel-preset-solid": "^1.8.8",
+      "solid-refresh": "^0.7.5",
+      "tailwindcss": "~3.4.3"
+    }
+  }
+

apps/nativescript-starter-solid/src/app.css

@@ -0,0 +1,8 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+.h-center {
+  /* {N} specific css */
+  horizontal-align: center;
+}

apps/nativescript-starter-solid/src/app.js

@@ -0,0 +1,11 @@
+import { Application } from '@nativescript/core';
+import { render } from '@nativescript-community/solid-js';
+
+import { App } from './app.jsx';
+
+document.body.actionBarHidden = false;
+render(App, document.body);
+
+const create = () => document;
+
+Application.run({ create });

apps/nativescript-starter-solid/src/app.jsx

@@ -0,0 +1,34 @@
+import { createSignal } from 'solid-js';
+import { Component } from './component.jsx';
+
+document.body.actionBarHidden = false;
+
+const App = () => {
+  const [count, setCount] = createSignal(0);
+  const increment = () => {
+    setCount((c) => c + 1);
+  };
+  return (
+    <>
+      <actionbar title="Hello, SolidJS!"></actionbar>
+      <stacklayout>
+        <label class="text-center text-2xl my-4">
+          You have tapped {count()} time{count() === 1 ? '' : 's'}
+        </label>
+        {
+          // use 'on:___' instead of 'on___' for event handlers
+          // See https://github.com/SudoMaker/dominative-solid#event-handling for detail
+        }
+        <button
+          class="rounded-full bg-blue-500 text-white text-xl p-2 w-[300]"
+          on:tap={increment}
+        >
+          Tap me!
+        </button>
+        <Component count={count} />
+      </stacklayout>
+    </>
+  );
+};
+
+export { App };

apps/nativescript-starter-solid/src/component.jsx

@@ -0,0 +1,13 @@
+export const Component = (props) => {
+    const { count } = props;
+    return (
+      <label
+        text={`${count()} tap${count() === 1 ? '' : 's'}`}
+        on:tap={() => {
+          alert(`You have tapped ${count()} time${count() === 1 ? '' : 's'}`);
+        }}
+        class="text-center text-2xl my-6 text-green-500"
+      />
+    );
+  };
+

apps/nativescript-starter-solid/tailwind.config.js

@@ -0,0 +1,14 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+    content: ['./src/**/*.{css,xml,html,vue,svelte,ts,tsx,jsx}'],
+    // use the .ns-dark class to control dark mode (applied by NativeScript) - since 'media' (default) is not supported.
+    darkMode: ['class', '.ns-dark'],
+    theme: {
+      extend: {},
+    },
+    plugins: [],
+    corePlugins: {
+      preflight: false, // disables browser-specific resets
+    },
+  };
+

apps/nativescript-starter-solid/webpack.config.js

@@ -0,0 +1,7 @@
+const webpack = require('@nativescript/webpack');
+
+module.exports = (env) => {
+  webpack.init(env);
+
+  return webpack.resolveConfig();
+};

apps/nativescript-starter-svelte/package.json

@@ -4,20 +4,20 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@nativescript/core": "~8.5.0",
+    "@nativescript/core": "~8.7.0",
     "svelte-native": "~1.0.0"
   },
   "devDependencies": {
-    "@nativescript/preview-cli": "1.0.5",
+    "@nativescript/preview-cli": "1.0.12",
     "@nativescript/stackblitz": "0.0.8",
-    "@nativescript/tailwind": "^2.0.1",
-    "@nativescript/types-minimal": "~8.5.0",
+    "@nativescript/tailwind": "^2.1.0",
+    "@nativescript/types-minimal": "~8.7.0",
     "@nativescript/webpack": "~5.0.0",
-    "svelte": "~3.44.0",
-    "svelte-loader": "^3.1.2",
+    "svelte": "~4.2.0",
+    "svelte-loader": "^3.2.0",
     "svelte-native-preprocessor": "^1.0.0",
-    "svelte-preprocess": "^4.7.0",
-    "tailwindcss": "^3.1.8",
-    "typescript": "~4.8.0"
+    "svelte-preprocess": "^5.1.3",
+    "tailwindcss": "~3.4.0",
+    "typescript": "~5.4.0"
   }
 }

apps/nativescript-starter-typescript/package.json

@@ -4,16 +4,16 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@nativescript/core": "~8.5.0",
+    "@nativescript/core": "~8.7.0",
     "@nativescript/theme": "~3.0.2"
   },
   "devDependencies": {
-    "@nativescript/preview-cli": "1.0.5",
+    "@nativescript/preview-cli": "1.0.12",
     "@nativescript/stackblitz": "0.0.8",
-    "@nativescript/tailwind": "^2.0.1",
-    "@nativescript/types-minimal": "~8.5.0",
+    "@nativescript/tailwind": "^2.1.0",
+    "@nativescript/types-minimal": "~8.7.0",
     "@nativescript/webpack": "~5.0.0",
-    "tailwindcss": "^3.1.8",
-    "typescript": "~4.8.0"
+    "tailwindcss": "~3.4.0",
+    "typescript": "~5.4.0"
   }
 }

apps/nativescript-starter-vue/package.json

@@ -4,19 +4,19 @@
   "version": "1.0.0",
   "private": true,
   "dependencies": {
-    "@nativescript/core": "~8.5.0",
+    "@nativescript/core": "~8.7.0",
     "nativescript-vue": "~2.9.0"
   },
   "devDependencies": {
-    "@nativescript/preview-cli": "1.0.5",
+    "@nativescript/preview-cli": "1.0.12",
     "@nativescript/stackblitz": "0.0.8",
-    "@nativescript/tailwind": "^2.0.1",
-    "@nativescript/types-minimal": "~8.5.0",
+    "@nativescript/tailwind": "^2.1.0",
+    "@nativescript/types-minimal": "~8.7.0",
     "@nativescript/webpack": "~5.0.0",
-    "@types/node": "~17.0.21",
+    "@types/node": "^20.0.0",
     "nativescript-vue-template-compiler": "~2.9.0",
-    "tailwindcss": "^3.1.8",
-    "typescript": "~4.8.0",
+    "tailwindcss": "~3.4.0",
+    "typescript": "~5.4.0",
     "vue": "~2.6.12"
   }
 }

package.json

@@ -27,10 +27,10 @@
     "prettier": "^2.6.2",
     "ts-jest": "28.0.8",
     "ts-node": "10.9.1",
-    "typescript": "4.8.4"
+    "typescript": "~5.4.0"
   },
   "dependencies": {
-    "@nativescript/core": "~8.5.0",
+    "@nativescript/core": "~8.7.0",
     "tslib": "^2.4.1"
   },
   "nativescript-nx": {