riccardoperra · riccardoperra · Oct 30, 2025 · Oct 30, 2025
diff --git a/examples/react-host-custom/package.json b/examples/react-host-custom/package.json
@@ -22,8 +22,8 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.19",
     "globals": "^16.0.0",
-    "typescript": "~5.7.2",
+    "typescript": "~5.9.3",
     "typescript-eslint": "^8.26.1",
-    "vite": "^6.3.1"
+    "vite": "^7.1.12"
   }
 }
diff --git a/examples/react-remote-counter/.gitignore b/examples/react-remote-counter/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/examples/react-remote-counter/README.md b/examples/react-remote-counter/README.md
@@ -0,0 +1,28 @@
+## Usage
+
+```bash
+$ npm install # or pnpm install or yarn install
+```
+
+### Learn more on the [Solid Website](https://solidjs.com) and come chat with us on our [Discord](https://discord.com/invite/solidjs)
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm run dev`
+
+Runs the app in the development mode.<br>
+Open [http://localhost:5173](http://localhost:5173) to view it in the browser.
+
+### `npm run build`
+
+Builds the app for production to the `dist` folder.<br>
+It correctly bundles Solid in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.<br>
+Your app is ready to be deployed!
+
+## Deployment
+
+Learn more about deploying your application with the [documentations](https://vite.dev/guide/static-deploy.html)
diff --git a/examples/react-remote-counter/index.html b/examples/react-remote-counter/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + Solid + TS</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>
diff --git a/examples/react-remote-counter/package.json b/examples/react-remote-counter/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "react-remote-counter",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc -b && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "typescript": "~5.9.3",
+    "vite": "^7.1.12",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "@vitejs/plugin-react-swc": "^3.8.0"
+  }
+}
diff --git a/examples/react-remote-counter/src/index.tsx b/examples/react-remote-counter/src/index.tsx
@@ -0,0 +1,27 @@
+/*
+ * Copyright 2025 Riccardo Perra
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { useState } from "react";
+
+export default function Counter() {
+  const [count, setCount] = useState(0);
+
+  return (
+    <button onClick={() => setCount((count) => count + 1)}>
+     This is a remote React counter: {count}
+    </button>
+  )
+}
diff --git a/examples/react-remote-counter/tsconfig.app.json b/examples/react-remote-counter/tsconfig.app.json
@@ -0,0 +1,27 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}
diff --git a/examples/react-remote-counter/tsconfig.json b/examples/react-remote-counter/tsconfig.json
@@ -0,0 +1,7 @@
+{
+  "files": [],
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ]
+}
diff --git a/examples/react-remote-counter/tsconfig.node.json b/examples/react-remote-counter/tsconfig.node.json
@@ -0,0 +1,24 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2022",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/examples/react-remote-counter/vite.config.ts b/examples/react-remote-counter/vite.config.ts
@@ -0,0 +1,18 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react-swc'
+
+export default defineConfig({
+  build: {
+    lib: {
+      entry: './src/index.tsx',
+      formats: ['es']
+    },
+    rollupOptions: {
+      external: [
+        'react',
+        'react/jsx-runtime'
+      ],
+    }
+  },
+  plugins: [react()],
+})
diff --git a/examples/react-tanstack-start-ssr/src/components/ImportMaps.tsx b/examples/react-tanstack-start-ssr/src/components/ImportMaps.tsx
@@ -0,0 +1,5 @@
+import {importMapRaw} from 'virtual:importmap';
+
+export function ImportMapsScript() {
+  return <script type="importmap">{importMapRaw}</script>;
+}
diff --git a/examples/react-tanstack-start-ssr/src/react-esm.ts b/examples/react-tanstack-start-ssr/src/react-esm.ts
@@ -0,0 +1,39 @@
+import React from "react";
+
+// export * from "react"
+export const {
+  Children,
+  Component,
+  Fragment,
+  Profiler,
+  PureComponent,
+  StrictMode,
+  Suspense,
+  cloneElement,
+  createContext,
+  createElement,
+  createRef,
+  forwardRef,
+  isValidElement,
+  lazy,
+  memo,
+  startTransition,
+  useCallback,
+  useContext,
+  useDebugValue,
+  useDeferredValue,
+  useEffect,
+  useId,
+  useImperativeHandle,
+  useInsertionEffect,
+  useLayoutEffect,
+  useMemo,
+  useReducer,
+  useRef,
+  useState,
+  useSyncExternalStore,
+  useTransition,
+  version,
+} = React;
+// export default from "react"
+export default React;
diff --git a/examples/react-tanstack-start-ssr/src/react-jsx-runtime.ts b/examples/react-tanstack-start-ssr/src/react-jsx-runtime.ts
@@ -0,0 +1,25 @@
+/*
+ * Copyright 2025 Riccardo Perra
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import JSXRuntime, {jsxs, jsx, Fragment} from 'react/jsx-runtime';
+
+export {
+  jsx,
+  jsxs,
+  Fragment
+}
+
+export default JSXRuntime
diff --git a/examples/react-tanstack-start-ssr/src/routes/full-ssr.tsx b/examples/react-tanstack-start-ssr/src/routes/full-ssr.tsx
@@ -0,0 +1,27 @@
+import { createFileRoute } from '@tanstack/react-router'
+import { lazy } from "react";
+import { getPunkSongs } from '@/data/demo.punk-songs'
+
+export const Route = createFileRoute('/full-ssr')({
+  component: RouteComponent,
+  loader: async () => await getPunkSongs(),
+})
+
+const host =  `${'window' in globalThis ? window.location.origin : '/public'}`
+const remoteCounterUrl = `${host}/react-remote-counter.js`;
+
+const RemoteCounter = lazy(() => import(/* @vite-ignore */ remoteCounterUrl));
+
+function RouteComponent() {
+  return (
+    <div
+      className="flex items-center justify-center min-h-screen bg-gradient-to-br from-zinc-800 to-black p-4 text-white"
+      style={{
+        backgroundImage:
+          'radial-gradient(50% 50% at 20% 60%, #1a1a1a 0%, #0a0a0a 50%, #000000 100%)',
+      }}
+    >
+      <RemoteCounter/>
+    </div>
+  )
+}
diff --git a/examples/react-tanstack-start-ssr/src/routes/spa-only.tsx b/examples/react-tanstack-start-ssr/src/routes/spa-only.tsx
@@ -0,0 +1,24 @@
+import { lazy } from "react";
+import { createFileRoute } from "@tanstack/react-router";
+
+export const Route = createFileRoute("/spa-only")({
+  ssr: false,
+  component: RouteComponent,
+});
+
+const remoteCounterUrl = `${window.location.origin}/react-remote-counter.js`;
+const RemoteCounter = lazy(() => import(/* @vite-ignore */ remoteCounterUrl));
+
+function RouteComponent() {
+  return (
+    <div
+      className="flex items-center justify-center min-h-screen bg-gradient-to-br from-zinc-800 to-black p-4 text-white"
+      style={{
+        backgroundImage:
+          "radial-gradient(50% 50% at 20% 60%, #1a1a1a 0%, #0a0a0a 50%, #000000 100%)",
+      }}
+    >
+      <RemoteCounter />
+    </div>
+  );
+}
diff --git a/examples/react-tanstack-start-ssr/src/types.d.ts b/examples/react-tanstack-start-ssr/src/types.d.ts
@@ -0,0 +1,8 @@
+declare module "virtual:importmap" {
+  export const importMap: {
+    imports: Record<string, string>;
+  };
+  export const importMapRaw: string;
+
+  export default importMap;
+}
diff --git a/examples/solidjs-host/package.json b/examples/solidjs-host/package.json
@@ -10,13 +10,13 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "solid-js": "^1.9.5",
-    "statebuilder": "^0.8.0",
-    "vite-plugin-static-copy": "^2.3.1"
+    "solid-js": "^1.9.10",
+    "statebuilder": "^0.8.1",
+    "vite-plugin-static-copy": "^2.3.2"
   },
   "devDependencies": {
-    "typescript": "~5.7.2",
-    "vite": "^6.3.1",
-    "vite-plugin-solid": "^2.11.6"
+    "typescript": "~5.9.3",
+    "vite": "^7.1.12",
+    "vite-plugin-solid": "^2.11.10"
   }
 }
diff --git a/examples/solidjs-remote-counter/package.json b/examples/solidjs-remote-counter/package.json
@@ -9,11 +9,11 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "solid-js": "^1.9.5"
+    "solid-js": "^1.9.10"
   },
   "devDependencies": {
-    "typescript": "~5.7.2",
-    "vite": "^6.3.1",
-    "vite-plugin-solid": "^2.11.6"
+    "typescript": "~5.9.3",
+    "vite": "^7.1.12",
+    "vite-plugin-solid": "^2.11.10"
   }
 }