More tweaks to the copy

[inspector] Add global search and json viewer

.github/workflows/build-examples.yaml

@@ -19,7 +19,6 @@ jobs:
           "pets",
           "reactions",
           "todo",
-          "onboarding",
         ]
 
     steps:

.github/workflows/playwright.yml

@@ -13,7 +13,7 @@ jobs:
     continue-on-error: true
     strategy:
       matrix:
-        project: ["tests/e2e", "examples/chat", "examples/file-share-svelte", "examples/form", "examples/music-player", "examples/pets", "examples/onboarding", "starters/react-passkey-auth"]
+        project: ["tests/e2e", "examples/chat", "examples/file-share-svelte", "examples/form", "examples/music-player", "examples/pets", "starters/react-passkey-auth"]
 
     steps:
       - uses: actions/checkout@v4

.gitignore

@@ -7,11 +7,15 @@ docsTmp
 coverage
 .direnv
 
+# Typescript
+**/*.tsbuildinfo
+
 # Next.js
 **/.next
 
 # Vite output
 **/dist
+__screenshots__
 
 # Playwright
 test-results

CONTRIBUTING.md

@@ -48,7 +48,19 @@ You'll need Node.js 20.x or 22.x installed (we're working on support for 23.x),
    pnpm install
    ```
 
-3. **Run tests** to verify everything is working:
+3. **Install homepage dependencies**:
+
+   ```bash
+   cd homepage && pnpm install
+   ```
+
+4. **Build the packages**:
+
+   ```bash
+   pnpm build
+   ```
+
+5. **Run tests** to verify everything is working:
    ```bash
    pnpm test
    ```

examples/chat-rn-clerk/CHANGELOG.md

@@ -1,5 +1,34 @@
 # chat-rn-clerk
 
+## 1.0.71
+
+### Patch Changes
+
+- Updated dependencies [ada802b]
+  - jazz-tools@0.10.6
+  - jazz-react-native@0.10.6
+  - jazz-react-native-auth-clerk@0.10.6
+  - jazz-react-native-media-images@0.10.6
+
+## 1.0.70
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react-native@0.10.5
+  - jazz-react-native-auth-clerk@0.10.5
+  - jazz-react-native-media-images@0.10.5
+
+## 1.0.69
+
+### Patch Changes
+
+- jazz-react-native@0.10.4
+- jazz-react-native-auth-clerk@0.10.4
+- jazz-tools@0.10.4
+- jazz-react-native-media-images@0.10.4
+
 ## 1.0.68
 
 ### Patch Changes

examples/chat-rn-clerk/package.json

@@ -1,7 +1,7 @@
 {
   "name": "chat-rn-clerk",
   "main": "index.js",
-  "version": "1.0.68",
+  "version": "1.0.71",
   "scripts": {
     "build": "expo export -p ios",
     "start": "expo start",
@@ -9,23 +9,22 @@
     "format-and-lint:fix": "biome check . --write",
     "android": "expo run:android",
     "ios": "expo run:ios",
-    "web": "expo start --web",
-    "test": "jest --watchAll"
+    "web": "expo start --web"
   },
   "jest": {
     "preset": "jest-expo"
   },
   "dependencies": {
     "@azure/core-asynciterator-polyfill": "^1.0.2",
+    "@bacons/text-decoder": "0.0.0",
     "@bam.tech/react-native-image-resizer": "^3.0.11",
+    "@craftzdog/react-native-buffer": "6.0.5",
     "@clerk/clerk-expo": "^2.2.21",
     "@expo/vector-icons": "^14.0.2",
     "@op-engineering/op-sqlite": "^11.2.12",
     "@react-native-community/netinfo": "^11.4.1",
     "@react-navigation/native": "^7.0.13",
     "@react-navigation/native-stack": "^7.1.14",
-    "base-64": "^1.0.0",
-    "buffer": "^6.0.3",
     "clsx": "^2.0.0",
     "expo": "^52.0.0",
     "expo-build-properties": "~0.13.1",
@@ -51,18 +50,14 @@
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-native": "~0.76.3",
-    "react-native-fetch-api": "^3.0.0",
     "react-native-gesture-handler": "~2.20.2",
     "react-native-get-random-values": "^1.11.0",
-    "react-native-polyfill-globals": "^3.1.0",
-    "react-native-quick-base64": "^2.1.2",
     "react-native-reanimated": "~3.16.3",
     "react-native-safe-area-context": "4.12.0",
     "react-native-screens": "4.1.0",
     "react-native-url-polyfill": "^2.0.0",
     "react-native-web": "~0.19.13",
-    "text-encoding": "^0.7.0",
-    "web-streams-polyfill": "^3.2.1"
+    "readable-stream": "4.7.0"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",

examples/chat-rn-clerk/polyfills.js

@@ -1,8 +1,17 @@
-import "react-native-polyfill-globals/auto";
-import "@azure/core-asynciterator-polyfill";
-import { Buffer } from "buffer";
-import { polyfillGlobal } from "react-native/Libraries/Utilities/PolyfillFunctions";
-import { ReadableStream } from "web-streams-polyfill/ponyfill/es6";
+/* eslint-disable import/order */
 
+// @ts-expect-error - @types/react-native doesn't cover this file
+import { polyfillGlobal } from "react-native/Libraries/Utilities/PolyfillFunctions";
+
+import { Buffer } from "@craftzdog/react-native-buffer";
 polyfillGlobal("Buffer", () => Buffer);
+
+// @ts-expect-error - @types/readable-stream doesn't have ReadableStream type
+import { ReadableStream } from "readable-stream";
 polyfillGlobal("ReadableStream", () => ReadableStream);
+
+import "@azure/core-asynciterator-polyfill";
+
+import "@bacons/text-decoder/install";
+
+import "react-native-get-random-values";

examples/chat-rn/CHANGELOG.md

@@ -1,5 +1,28 @@
 # chat-rn
 
+## 1.0.68
+
+### Patch Changes
+
+- Updated dependencies [ada802b]
+  - jazz-tools@0.10.6
+  - jazz-react-native@0.10.6
+
+## 1.0.67
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react-native@0.10.5
+
+## 1.0.66
+
+### Patch Changes
+
+- jazz-react-native@0.10.4
+- jazz-tools@0.10.4
+
 ## 1.0.65
 
 ### Patch Changes

examples/chat-rn/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chat-rn",
-  "version": "1.0.65",
+  "version": "1.0.68",
   "main": "index.js",
   "scripts": {
     "build": "expo export -p ios",
@@ -13,17 +13,17 @@
   },
   "dependencies": {
     "@azure/core-asynciterator-polyfill": "^1.0.2",
+    "@bacons/text-decoder": "0.0.0",
+    "@craftzdog/react-native-buffer": "6.0.5",
     "@op-engineering/op-sqlite": "^11.2.12",
     "@react-native-community/netinfo": "^11.4.1",
     "@react-navigation/native": "^7.0.13",
     "@react-navigation/native-stack": "^7.1.14",
-    "base-64": "^1.0.0",
     "clsx": "^2.0.0",
     "expo": "^52.0.0",
     "expo-build-properties": "~0.13.1",
     "expo-clipboard": "~7.0.0",
     "expo-constants": "~17.0.3",
-    "expo-crypto": "~14.0.1",
     "expo-dev-client": "~5.0.5",
     "expo-linking": "~7.0.3",
     "expo-secure-store": "~14.0.0",
@@ -34,14 +34,13 @@
     "nativewind": "^4.1.21",
     "react": "^18.3.1",
     "react-native": "~0.76.3",
-    "react-native-fetch-api": "^3.0.0",
     "react-native-get-random-values": "^1.11.0",
-    "react-native-polyfill-globals": "^3.1.0",
+    "react-native-nitro-modules": "0.21.0",
+    "react-native-quick-crypto": "1.0.0-beta.12",
     "react-native-safe-area-context": "4.12.0",
     "react-native-screens": "4.1.0",
     "react-native-url-polyfill": "^2.0.0",
-    "text-encoding": "^0.7.0",
-    "web-streams-polyfill": "^3.2.1"
+    "readable-stream": "4.7.0"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",

examples/chat-rn/polyfills.js

@@ -1,6 +1,17 @@
-import "react-native-polyfill-globals/auto";
-import "@azure/core-asynciterator-polyfill";
-import { polyfillGlobal } from "react-native/Libraries/Utilities/PolyfillFunctions";
-import { ReadableStream } from "web-streams-polyfill/ponyfill/es6";
+/* eslint-disable import/order */
 
+// @ts-expect-error - @types/react-native doesn't cover this file
+import { polyfillGlobal } from "react-native/Libraries/Utilities/PolyfillFunctions";
+
+import { Buffer } from "@craftzdog/react-native-buffer";
+polyfillGlobal("Buffer", () => Buffer);
+
+// @ts-expect-error - @types/readable-stream doesn't have ReadableStream type
+import { ReadableStream } from "readable-stream";
 polyfillGlobal("ReadableStream", () => ReadableStream);
+
+import "@azure/core-asynciterator-polyfill";
+
+import "@bacons/text-decoder/install";
+
+import "react-native-get-random-values";

examples/chat-rn/src/App.tsx

@@ -9,7 +9,7 @@ import * as Linking from "expo-linking";
 import React, { StrictMode, useEffect, useState } from "react";
 import HandleInviteScreen from "./invite";
 
-import { JazzProvider } from "jazz-react-native";
+import { JazzProvider, RNQuickCrypto } from "jazz-react-native";
 import { apiKey } from "./apiKey";
 import ChatScreen from "./chat";
 
@@ -50,6 +50,7 @@ function App() {
         sync={{
           peer: `wss://cloud.jazz.tools/?key=${apiKey}`,
         }}
+        CryptoProvider={RNQuickCrypto}
       >
         <NavigationContainer linking={linking} ref={navigationRef}>
           <Stack.Navigator initialRouteName={initialRoute}>

examples/chat-rn/test/e2e/run.sh

@@ -6,8 +6,10 @@
 set -e
 
 # build and install the app
+echo "Building and installing Android app."
+echo "If it fails, its output will be in artifact: android-install.log..."
 cd ./android/
-./gradlew installRelease
+./gradlew installRelease >> ~/output/android-install.log 2>&1
 cd ..
 
 # run the e2e tests

examples/chat-vue/CHANGELOG.md

@@ -1,5 +1,31 @@
 # chat-vue
 
+## 0.0.55
+
+### Patch Changes
+
+- Updated dependencies [ada802b]
+  - jazz-tools@0.10.6
+  - jazz-browser@0.10.6
+  - jazz-vue@0.10.6
+
+## 0.0.54
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser@0.10.5
+  - jazz-vue@0.10.5
+
+## 0.0.53
+
+### Patch Changes
+
+- jazz-browser@0.10.4
+- jazz-tools@0.10.4
+- jazz-vue@0.10.4
+
 ## 0.0.52
 
 ### Patch Changes

examples/chat-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chat-vue",
-  "version": "0.0.52",
+  "version": "0.0.55",
   "private": true,
   "type": "module",
   "scripts": {

examples/chat/CHANGELOG.md

@@ -1,5 +1,33 @@
 # jazz-example-chat
 
+## 0.0.151
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - hash-slash@0.2.2
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+  - jazz-browser-media-images@0.10.6
+
+## 0.0.150
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser-media-images@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.149
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+- jazz-browser-media-images@0.10.4
+
 ## 0.0.148
 
 ### Patch Changes

examples/chat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-chat",
   "private": true,
-  "version": "0.0.148",
+  "version": "0.0.151",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -9,8 +9,8 @@
     "format-and-lint": "biome check .",
     "format-and-lint:fix": "biome check . --write",
     "preview": "vite preview",
-    "test": "playwright test",
-    "test:ui": "playwright test --ui"
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui"
   },
   "dependencies": {
     "clsx": "^2.0.0",

examples/clerk/CHANGELOG.md

@@ -1,5 +1,32 @@
 # minimal-auth-clerk
 
+## 0.0.50
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react-auth-clerk@0.10.6
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.49
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+  - jazz-react-auth-clerk@0.10.5
+
+## 0.0.48
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-react-auth-clerk@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.47
 
 ### Patch Changes

examples/clerk/package.json

@@ -1,7 +1,7 @@
 {
   "name": "clerk",
   "private": true,
-  "version": "0.0.47",
+  "version": "0.0.50",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -13,7 +13,7 @@
   "dependencies": {
     "@clerk/clerk-react": "^5.4.1",
     "jazz-react": "workspace:*",
-    "jazz-react-auth-clerk": "workspace:0.10.3",
+    "jazz-react-auth-clerk": "workspace:0.10.6",
     "jazz-tools": "workspace:*",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"

examples/file-share-svelte/CHANGELOG.md

@@ -1,5 +1,28 @@
 # file-share-svelte
 
+## 0.0.35
+
+### Patch Changes
+
+- Updated dependencies [ada802b]
+  - jazz-tools@0.10.6
+  - jazz-svelte@0.10.6
+
+## 0.0.34
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-svelte@0.10.5
+
+## 0.0.33
+
+### Patch Changes
+
+- jazz-svelte@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.32
 
 ### Patch Changes

examples/file-share-svelte/package.json

@@ -1,6 +1,6 @@
 {
   "name": "file-share-svelte",
-  "version": "0.0.32",
+  "version": "0.0.35",
   "private": true,
   "type": "module",
   "scripts": {
@@ -13,8 +13,8 @@
     "lint": "prettier --check . && eslint .",
     "format-and-lint": "pnpm run format && pnpm run lint",
     "format-and-lint:fix": "pnpm run format --write && pnpm run lint --fix",
-    "test": "playwright test",
-    "test:ui": "playwright test --ui"
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui"
   },
   "devDependencies": {
     "@sveltejs/adapter-vercel": "^5.5.0",

examples/form/CHANGELOG.md

@@ -1,5 +1,33 @@
 # form
 
+## 0.0.46
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - hash-slash@0.2.2
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+  - jazz-browser-media-images@0.10.6
+
+## 0.0.45
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser-media-images@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.44
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+- jazz-browser-media-images@0.10.4
+
 ## 0.0.43
 
 ### Patch Changes

examples/form/package.json

@@ -1,7 +1,7 @@
 {
   "name": "form",
   "private": true,
-  "version": "0.0.43",
+  "version": "0.0.46",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/form/tsconfig.tsbuildinfo

@@ -1 +0,0 @@
-{"root":["./src/app.tsx","./src/createorder.tsx","./src/draftindicator.tsx","./src/editorder.tsx","./src/errors.tsx","./src/linktohome.tsx","./src/orderform.tsx","./src/orderthumbnail.tsx","./src/orders.tsx","./src/main.tsx","./src/schema.ts","./src/vite-env.d.ts"],"version":"5.6.3"}

examples/image-upload/CHANGELOG.md

@@ -1,5 +1,32 @@
 # image-upload
 
+## 0.0.48
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+  - jazz-browser-media-images@0.10.6
+
+## 0.0.47
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser-media-images@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.46
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+- jazz-browser-media-images@0.10.4
+
 ## 0.0.45
 
 ### Patch Changes

examples/image-upload/package.json

@@ -1,7 +1,7 @@
 {
   "name": "image-upload",
   "private": true,
-  "version": "0.0.45",
+  "version": "0.0.48",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/inspector/CHANGELOG.md

@@ -1,5 +1,23 @@
 # jazz-example-inspector
 
+## 0.0.107
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [5c76e37]
+  - hash-slash@0.2.2
+  - cojson@0.10.6
+  - cojson-transport-ws@0.10.6
+
+## 0.0.106
+
+### Patch Changes
+
+- Updated dependencies [1af6072]
+  - cojson@0.10.4
+  - cojson-transport-ws@0.10.4
+
 ## 0.0.105
 
 ### Patch Changes

examples/inspector/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-inspector-app",
   "private": true,
-  "version": "0.0.105",
+  "version": "0.0.107",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -16,9 +16,9 @@
     "@radix-ui/react-toast": "^1.1.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
-    "cojson": "workspace:0.10.2",
-    "cojson-transport-ws": "workspace:0.10.2",
-    "hash-slash": "workspace:0.2.1",
+    "cojson": "workspace:0.10.6",
+    "cojson-transport-ws": "workspace:0.10.6",
+    "hash-slash": "workspace:0.2.2",
     "lucide-react": "^0.274.0",
     "qrcode": "^1.5.3",
     "react": "^18.3.1",

examples/inspector/src/viewer/new-app.tsx

@@ -102,6 +102,7 @@ export default function CoJsonViewerApp() {
     if (coValueId) {
       setPage(coValueId);
     }
+    setCoValueId("");
   };
 
   if (
@@ -118,8 +119,22 @@ export default function CoJsonViewerApp() {
 
   return (
     <div className="w-full h-screen bg-gray-100 p-4 overflow-hidden flex flex-col">
-      <div className="flex justify-between items-center mb-4">
+      <div className="flex items-center mb-4 gap-4">
         <Breadcrumbs path={path} onBreadcrumbClick={goToIndex} />
+        <div className="flex-1">
+          <form onSubmit={handleCoValueIdSubmit}>
+            {path.length !== 0 && (
+              <input
+                className="border p-2 rounded-lg min-w-[21rem] font-mono"
+                placeholder="co_z1234567890abcdef123456789"
+                value={coValueId}
+                onChange={(e) =>
+                  setCoValueId(e.target.value as CoID<RawCoValue>)
+                }
+              />
+            )}
+          </form>
+        </div>
         <AccountSwitcher
           accounts={accounts}
           currentAccount={currentAccount}
@@ -172,7 +187,6 @@ export default function CoJsonViewerApp() {
                 type="button"
                 className="border inline-block px-2 py-1.5 text-black rounded"
                 onClick={() => {
-                  setCoValueId(currentAccount.id);
                   setPage(currentAccount.id);
                 }}
               >

examples/inspector/src/viewer/value-renderer.tsx

@@ -18,6 +18,8 @@ export function ValueRenderer({
   compact?: boolean;
   onCoIDClick?: (childNode: CoID<RawCoValue>) => void;
 }) {
+  const [isExpanded, setIsExpanded] = useState(false);
+
   if (typeof json === "undefined" || json === undefined) {
     return <span className="text-gray-400">undefined</span>;
   }
@@ -85,15 +87,31 @@ export function ValueRenderer({
     return (
       <span
         title={JSON.stringify(json, null, 2)}
-        className="inline-block max-w-64 truncate"
+        className="inline-block max-w-64"
       >
         {compact ? (
           <span>
             Object{" "}
             <span className="text-gray-500">({Object.keys(json).length})</span>
+            <pre className="mt-1 text-sm whitespace-pre-wrap">
+              {isExpanded
+                ? JSON.stringify(json, null, 2)
+                : JSON.stringify(json, null, 2)
+                    .split("\n")
+                    .slice(0, 3)
+                    .join("\n") + (Object.keys(json).length > 2 ? "\n..." : "")}
+            </pre>
+            <button
+              onClick={() => setIsExpanded(!isExpanded)}
+              className="text-xs text-gray-500 hover:text-gray-700"
+            >
+              {isExpanded ? "Show less" : "Show more"}
+            </button>
           </span>
         ) : (
-          JSON.stringify(json, null, 2)
+          <pre className="whitespace-pre-wrap">
+            {JSON.stringify(json, null, 2)}
+          </pre>
         )}
       </span>
     );

examples/music-player/CHANGELOG.md

@@ -1,5 +1,32 @@
 # jazz-example-musicplayer
 
+## 0.0.72
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+  - jazz-inspector@0.10.6
+
+## 0.0.71
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-inspector@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.70
+
+### Patch Changes
+
+- jazz-inspector@0.10.4
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.69
 
 ### Patch Changes

examples/music-player/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-music-player",
   "private": true,
-  "version": "0.0.69",
+  "version": "0.0.72",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -9,8 +9,8 @@
     "format-and-lint": "biome check .",
     "format-and-lint:fix": "biome check . --write",
     "preview": "vite preview",
-    "test": "playwright test",
-    "test:ui": "playwright test --ui"
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui"
   },
   "dependencies": {
     "@radix-ui/react-dialog": "^1.1.4",
@@ -22,8 +22,8 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "jazz-inspector": "workspace:*",
-    "jazz-react": "workspace:0.10.3",
-    "jazz-tools": "workspace:0.10.3",
+    "jazz-react": "workspace:0.10.6",
+    "jazz-tools": "workspace:0.10.6",
     "lucide-react": "^0.274.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",

examples/onboarding/.gitignore

@@ -1,26 +0,0 @@
-# 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?
-
-playwright-report

examples/onboarding/CHANGELOG.md

@@ -1,412 +0,0 @@
-# jazz-example-onboarding
-
-## 0.0.49
-
-### Patch Changes
-
-- Updated dependencies [d8582fc]
-  - jazz-tools@0.10.3
-  - jazz-browser-media-images@0.10.3
-  - jazz-react@0.10.3
-
-## 0.0.48
-
-### Patch Changes
-
-- jazz-react@0.10.2
-- jazz-tools@0.10.2
-- jazz-browser-media-images@0.10.2
-
-## 0.0.47
-
-### Patch Changes
-
-- Updated dependencies [5a63cba]
-  - jazz-tools@0.10.1
-  - jazz-browser-media-images@0.10.1
-  - jazz-react@0.10.1
-
-## 0.0.46
-
-### Patch Changes
-
-- Updated dependencies [498954f]
-- Updated dependencies [d42c2aa]
-- Updated dependencies [dd03464]
-- Updated dependencies [b426342]
-  - jazz-react@0.10.0
-  - jazz-tools@0.10.0
-  - jazz-browser-media-images@0.10.0
-
-## 0.0.45
-
-### Patch Changes
-
-- jazz-react@0.9.23
-- jazz-tools@0.9.23
-- jazz-browser-media-images@0.9.23
-
-## 0.0.44
-
-### Patch Changes
-
-- jazz-browser-media-images@0.9.22
-- jazz-react@0.9.22
-
-## 0.0.43
-
-### Patch Changes
-
-- Updated dependencies [1be017d]
-  - jazz-tools@0.9.21
-  - jazz-browser-media-images@0.9.21
-  - jazz-react@0.9.21
-
-## 0.0.42
-
-### Patch Changes
-
-- Updated dependencies [b01cc1f]
-  - jazz-tools@0.9.20
-  - jazz-browser-media-images@0.9.20
-  - jazz-react@0.9.20
-
-## 0.0.41
-
-### Patch Changes
-
-- jazz-react@0.9.19
-- jazz-tools@0.9.19
-- jazz-browser-media-images@0.9.19
-
-## 0.0.40
-
-### Patch Changes
-
-- jazz-react@0.9.18
-- jazz-tools@0.9.18
-- jazz-browser-media-images@0.9.18
-
-## 0.0.39
-
-### Patch Changes
-
-- Updated dependencies [c2ca1fe]
-- Updated dependencies [1227047]
-  - jazz-tools@0.9.17
-  - jazz-browser-media-images@0.9.17
-  - jazz-react@0.9.17
-
-## 0.0.38
-
-### Patch Changes
-
-- Updated dependencies [24b3b6a]
-  - jazz-tools@0.9.16
-  - jazz-browser-media-images@0.9.16
-  - jazz-react@0.9.16
-
-## 0.0.37
-
-### Patch Changes
-
-- Updated dependencies [7491711]
-  - jazz-tools@0.9.15
-  - jazz-browser-media-images@0.9.15
-  - jazz-react@0.9.15
-
-## 0.0.36
-
-### Patch Changes
-
-- Updated dependencies [3df93cc]
-  - jazz-tools@0.9.14
-  - jazz-browser-media-images@0.9.14
-  - jazz-react@0.9.14
-
-## 0.0.35
-
-### Patch Changes
-
-- jazz-react@0.9.13
-- jazz-tools@0.9.13
-- jazz-browser-media-images@0.9.13
-
-## 0.0.34
-
-### Patch Changes
-
-- jazz-react@0.9.12
-- jazz-tools@0.9.12
-- jazz-browser-media-images@0.9.12
-
-## 0.0.33
-
-### Patch Changes
-
-- jazz-react@0.9.11
-- jazz-tools@0.9.11
-- jazz-browser-media-images@0.9.11
-
-## 0.0.32
-
-### Patch Changes
-
-- Updated dependencies [5e83864]
-  - jazz-react@0.9.10
-  - jazz-tools@0.9.10
-  - jazz-browser-media-images@0.9.10
-
-## 0.0.31
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.30
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.29
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.28
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
-## 0.0.27
-
-### Patch Changes
-
-- Updated dependencies [956a4d1]
-- Updated dependencies [8eda792]
-  - jazz-react@0.9.0
-  - jazz-tools@0.9.0
-  - jazz-browser-media-images@0.9.0
-
-## 0.0.26
-
-### Patch Changes
-
-- Updated dependencies [dc62b95]
-- Updated dependencies [1de26f8]
-  - jazz-tools@0.8.51
-  - jazz-browser-media-images@0.8.51
-  - jazz-react@0.8.51
-
-## 0.0.25
-
-### Patch Changes
-
-- jazz-react@0.8.50
-- jazz-tools@0.8.50
-- jazz-browser-media-images@0.8.50
-
-## 0.0.24
-
-### Patch Changes
-
-- jazz-react@0.8.49
-- jazz-tools@0.8.49
-- jazz-browser-media-images@0.8.49
-
-## 0.0.23
-
-### Patch Changes
-
-- Updated dependencies [635e824]
-- Updated dependencies [0a85982]
-  - jazz-tools@0.8.48
-  - jazz-browser-media-images@0.8.48
-  - jazz-react@0.8.48
-
-## 0.0.22
-
-### Patch Changes
-
-- Updated dependencies [fa41f8e]
-- Updated dependencies [88d7d9a]
-- Updated dependencies [60e35ea]
-  - jazz-tools@0.8.45
-  - jazz-react@0.8.45
-  - jazz-browser-media-images@0.8.45
-
-## 0.0.21
-
-### Patch Changes
-
-- jazz-react@0.8.44
-- jazz-tools@0.8.44
-- jazz-browser-media-images@0.8.44
-
-## 0.0.20
-
-### Patch Changes
-
-- jazz-react@0.8.41
-- jazz-tools@0.8.41
-- jazz-browser-media-images@0.8.41
-
-## 0.0.19
-
-### Patch Changes
-
-- jazz-browser-media-images@0.8.40
-- jazz-react@0.8.40
-
-## 0.0.18
-
-### Patch Changes
-
-- Updated dependencies [249eecb]
-  - jazz-tools@0.8.39
-  - jazz-browser-media-images@0.8.39
-  - jazz-react@0.8.39
-
-## 0.0.17
-
-### Patch Changes
-
-- jazz-react@0.8.38
-- jazz-tools@0.8.38
-- jazz-browser-media-images@0.8.38
-
-## 0.0.16
-
-### Patch Changes
-
-- jazz-react@0.8.37
-- jazz-tools@0.8.37
-- jazz-browser-media-images@0.8.37
-
-## 0.0.15
-
-### Patch Changes
-
-- Updated dependencies [441fe27]
-  - jazz-tools@0.8.36
-  - jazz-react@0.8.36
-  - jazz-browser-media-images@0.8.36
-
-## 0.0.14
-
-### Patch Changes
-
-- Updated dependencies [9212ab8]
-- Updated dependencies [8b87117]
-  - jazz-react@0.8.35
-  - jazz-tools@0.8.35
-  - jazz-browser-media-images@0.8.35
-
-## 0.0.13
-
-### Patch Changes
-
-- jazz-react@0.8.34
-- jazz-tools@0.8.34
-- jazz-browser-media-images@0.8.34
-
-## 0.0.12
-
-### Patch Changes
-
-- jazz-browser-media-images@0.8.33
-- jazz-react@0.8.33
-
-## 0.0.11
-
-### Patch Changes
-
-- Updated dependencies [df42b2b]
-  - jazz-tools@0.8.32
-  - jazz-react@0.8.32
-  - jazz-browser-media-images@0.8.32
-
-## 0.0.10
-
-### Patch Changes
-
-- jazz-react@0.8.31
-- jazz-tools@0.8.31
-- jazz-browser-media-images@0.8.31
-
-## 0.0.9
-
-### Patch Changes
-
-- jazz-react@0.8.30
-- jazz-tools@0.8.30
-- jazz-browser-media-images@0.8.30
-
-## 0.0.8
-
-### Patch Changes
-
-- jazz-react@0.8.29
-- jazz-tools@0.8.29
-- jazz-browser-media-images@0.8.29
-
-## 0.0.7
-
-### Patch Changes
-
-- jazz-react@0.8.28
-- jazz-tools@0.8.28
-- jazz-browser-media-images@0.8.28
-
-## 0.0.6
-
-### Patch Changes
-
-- jazz-react@0.8.27
-- jazz-tools@0.8.27
-- jazz-browser-media-images@0.8.27
-
-## 0.0.5
-
-### Patch Changes
-
-- Updated dependencies [59d37df]
-  - jazz-react@0.8.26
-
-## 0.0.4
-
-### Patch Changes
-
-- jazz-browser-media-images@0.8.24
-- jazz-react@0.8.24
-
-## 0.0.3
-
-### Patch Changes
-
-- Updated dependencies [d348c2d]
-- Updated dependencies [6902b5b]
-- Updated dependencies [1a0cd3d]
-  - jazz-tools@0.8.23
-  - jazz-react@0.8.23
-  - jazz-browser-media-images@0.8.23
-
-## 0.0.2
-
-### Patch Changes
-
-- Updated dependencies [59cc64d]
-  - jazz-react@0.8.22
-  - jazz-browser-media-images@0.8.22

examples/onboarding/Dockerfile

@@ -1,4 +0,0 @@
-FROM caddy:2.7.3-alpine
-LABEL org.opencontainers.image.source="https://github.com/garden-co/jazz"
-
-COPY ./dist /usr/share/caddy/

examples/onboarding/README.md

@@ -1,60 +0,0 @@
-# Onboarding example with Jazz and React
-
-## Getting started
-
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
-
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
-```bash
-npx create-jazz-app@latest --example onboarding --project-name onboarding
-```
-
-Go to the new project directory.
-```bash
-cd onboarding
-```
-
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
-```bash
-pnpm i && npx turbo build
-```
-
-Go to the example directory.
-```bash
-cd jazz/examples/onboarding/
-```
-
-Start the dev server.
-```bash
-pnpm dev
-```
-
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-## Questions / problems / feedback
-
-If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.
-
-## Configuration: sync server
-
-By default, the example app uses [Jazz Cloud](https://jazz.tools/cloud) (`wss://cloud.jazz.tools`) - so cross-device use, invites and collaboration should just work.
-
-You can also run a local sync server by running `npx cojson-simple-sync` and adding the query param `?sync=ws://localhost:4200` to the URL of the example app (for example: `http://localhost:5173/?peer=ws://localhost:4200`), or by setting the `sync` parameter of the `<JazzProvider>` provider component in [./src/main.tsx](./src/main.tsx).

examples/onboarding/index.html

@@ -1,12 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Jazz onboarding example</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>

examples/onboarding/package.json

@@ -1,36 +0,0 @@
-{
-  "name": "jazz-example-onboarding",
-  "private": true,
-  "version": "0.0.49",
-  "type": "module",
-  "scripts": {
-    "dev": "vite",
-    "build": "tsc && vite build",
-    "format-and-lint": "biome check .",
-    "format-and-lint:fix": "biome check . --write",
-    "preview": "vite preview",
-    "test": "playwright test",
-    "test:ui": "playwright test --ui",
-    "sync": "jazz-run sync"
-  },
-  "dependencies": {
-    "jazz-browser-media-images": "workspace:*",
-    "jazz-react": "workspace:*",
-    "jazz-tools": "workspace:*",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
-  },
-  "devDependencies": {
-    "@playwright/test": "^1.50.1",
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@vitejs/plugin-react": "^4.3.3",
-    "autoprefixer": "^10.4.20",
-    "is-ci": "^3.0.1",
-    "jazz-run": "workspace:*",
-    "postcss": "^8.4.27",
-    "tailwindcss": "^3.4.17",
-    "typescript": "~5.6.2",
-    "vite": "^6.0.11"
-  }
-}

examples/onboarding/playwright.config.ts

@@ -1,46 +0,0 @@
-import { defineConfig, devices } from "@playwright/test";
-import isCI from "is-ci";
-
-/**
- * See https://playwright.dev/docs/test-configuration.
- */
-export default defineConfig({
-  testDir: "./tests",
-  /* Run tests in files in parallel */
-  fullyParallel: true,
-  /* Fail the build on CI if you accidentally left test.only in the source code. */
-  forbidOnly: isCI,
-  /* Retry on CI only */
-  retries: isCI ? 2 : 0,
-  /* Opt out of parallel tests on CI. */
-  workers: isCI ? 1 : undefined,
-  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: "html",
-
-  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
-  use: {
-    /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: "http://localhost:5173/",
-
-    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: "on-first-retry",
-    permissions: ["clipboard-read", "clipboard-write"],
-  },
-
-  /* Configure projects for major browsers */
-  projects: [
-    {
-      name: "chromium",
-      use: { ...devices["Desktop Chrome"] },
-    },
-  ],
-
-  /* Run your local dev server before starting the tests */
-  webServer: [
-    {
-      command: "pnpm preview --port 5173",
-      url: "http://localhost:5173/",
-      reuseExistingServer: !isCI,
-    },
-  ],
-});

examples/onboarding/postcss.config.js

@@ -1,6 +0,0 @@
-export default {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};

examples/onboarding/src/App.tsx

@@ -1,100 +0,0 @@
-import { Button } from "@/components/Button.tsx";
-import { EmployeeList } from "@/pages/EmployeeList.tsx";
-import { EmployeeOnboading } from "@/pages/EmployeeOnboarding.tsx";
-import { NewEmployee } from "@/pages/NewEmployee.tsx";
-import { CoEmployee, EmployeeCoList } from "@/schema.ts";
-import { useAcceptInvite, useAccount, useCoState } from "jazz-react";
-import { ID } from "jazz-tools";
-import { useEffect } from "react";
-import {
-  RouterProvider,
-  createHashRouter,
-  useNavigate,
-  useParams,
-} from "react-router-dom";
-
-function ImportEmployee({
-  employeeListCoId,
-}: { employeeListCoId: ID<EmployeeCoList> }) {
-  const { employeeCoId } = useParams();
-  const navigate = useNavigate();
-
-  const employees = useCoState(EmployeeCoList, employeeListCoId, [{}]);
-  const employee = useCoState(CoEmployee, employeeCoId as ID<CoEmployee>, {});
-
-  useEffect(() => {
-    if (!employee || !employees) return;
-
-    const exists = employees.find((employee) => employeeCoId === employee.id);
-
-    if (!exists) {
-      employees.push(employee);
-    }
-    navigate("/");
-  }, [employee, employees, navigate]);
-
-  return <div>Importing Employee ${employeeCoId} ...</div>;
-}
-
-function AcceptInvite() {
-  const navigate = useNavigate();
-
-  useAcceptInvite({
-    invitedObjectSchema: CoEmployee,
-    onAccept: (employeeCoId) => {
-      navigate(`/import/${employeeCoId}`);
-    },
-  });
-
-  return <p>Accepting invite...</p>;
-}
-
-function App() {
-  const { me, logOut } = useAccount();
-  const employeeCoListId = me.profile?._refs.employees.id;
-
-  const router = createHashRouter([
-    {
-      path: "/",
-      element: <EmployeeList employeeListCoId={employeeCoListId} />,
-    },
-    {
-      path: "employee/new",
-      element: <NewEmployee employeeListCoId={employeeCoListId} />,
-    },
-    {
-      path: "/employee/:employeeCoId",
-      element: <EmployeeOnboading />,
-    },
-    {
-      path: "/import/:employeeCoId",
-      element: <ImportEmployee employeeListCoId={employeeCoListId} />,
-    },
-    {
-      path: "/invite/*",
-      element: <AcceptInvite />,
-    },
-  ]);
-
-  return (
-    <>
-      <header className="flex flex-wrap space-x-8   max-w-screen-lg m-2">
-        <h1 className="text-3xl font-extrabold">
-          Jazz Onboarding Flow example
-        </h1>
-        <Button
-          onClick={() => {
-            window.location.href = "/";
-            logOut();
-          }}
-          text="Log Out"
-        />
-      </header>
-      <main className="ml-2">
-        {employeeCoListId && <RouterProvider router={router} />}
-      </main>
-    </>
-  );
-}
-
-export default App;

examples/onboarding/src/apiKey.ts

@@ -1 +0,0 @@
-export const apiKey = "onboarding-example-jazz@garden.co";

examples/onboarding/src/components/Button.tsx

@@ -1,31 +0,0 @@
-const disabledClasses =
-  "text-white bg-gray-400 dark:bg-gray-500 cursor-not-allowed";
-const regularClasses =
-  "text-white bg-gradient-to-r from-green-400 via-green-500 to-green-600 hover:bg-gradient-to-br focus:ring-4 focus:outline-none focus:ring-green-300 dark:focus:ring-green-800";
-
-export function Button({
-  text,
-  onClick,
-  disabled,
-  type = "button",
-  ...props
-}: {
-  text: string;
-  type?: "button" | "submit";
-  onClick?: () => void;
-  disabled?: boolean;
-}) {
-  return (
-    <button
-      {...props}
-      onClick={onClick}
-      type={type}
-      disabled={disabled}
-      className={`${
-        disabled ? disabledClasses : regularClasses
-      } text-base font-medium rounded-lg text-sm px-5 py-2.5 text-center me-2 mb-2`}
-    >
-      {text}
-    </button>
-  );
-}

examples/onboarding/src/components/ButtonLink.tsx

@@ -1,19 +0,0 @@
-import React from "react";
-import { Link } from "react-router-dom";
-
-export function ButtonLink({
-  to,
-  children,
-}: {
-  to: string;
-  children: React.ReactNode;
-}) {
-  return (
-    <Link
-      className="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800"
-      to={to}
-    >
-      {children}
-    </Link>
-  );
-}

examples/onboarding/src/components/NavLink.tsx

@@ -1,19 +0,0 @@
-import React from "react";
-import { Link } from "react-router-dom";
-
-export function NavLink({
-  to,
-  children,
-}: {
-  to: string;
-  children: React.ReactNode;
-}) {
-  return (
-    <Link
-      className="font-medium text-blue-600 dark:text-blue-500 hover:underline"
-      to={to}
-    >
-      {children}
-    </Link>
-  );
-}

examples/onboarding/src/components/NavigateBack.tsx

@@ -1,24 +0,0 @@
-import { useNavigate } from "react-router-dom";
-import { Button } from "./Button.tsx";
-
-export function NavigateBack() {
-  const navigate = useNavigate();
-  const canGoBack = window.history.state.idx !== 0;
-
-  if (!canGoBack) return null;
-
-  return (
-    <div>
-      <Button onClick={() => navigate(-1)} text="< Back" />
-    </div>
-  );
-}
-
-export function NavigateButton({ text, to }: { text: string; to: string }) {
-  const navigate = useNavigate();
-  return (
-    <div>
-      <Button onClick={() => navigate(to)} text={text} />
-    </div>
-  );
-}

examples/onboarding/src/components/Stack.tsx

@@ -1,19 +0,0 @@
-import React from "react";
-
-export function Stack({
-  children,
-  horizontal,
-}: {
-  children: React.ReactNode;
-  horizontal?: boolean;
-}) {
-  return (
-    <div
-      className={`container flex ${
-        horizontal ? "flex-row" : "flex-col"
-      } col ${horizontal ? "space-x-4 flex-wrap" : "space-y-4"} p-4`}
-    >
-      {children}
-    </div>
-  );
-}

examples/onboarding/src/components/TextInput.tsx

@@ -1,36 +0,0 @@
-import { ChangeEvent } from "react";
-
-export function TextInput({
-  id,
-  value,
-  label,
-  onChange,
-  disabled,
-}: {
-  id: string;
-  label: string;
-  value: string;
-  onChange: (e: ChangeEvent<HTMLInputElement>) => void;
-  disabled?: boolean;
-}) {
-  return (
-    <div>
-      <label
-        htmlFor={id}
-        className="block mb-2 font-medium text-gray-900 dark:text-white"
-      >
-        {label}
-      </label>
-      <input
-        value={value}
-        onChange={onChange}
-        type="text"
-        id={id}
-        disabled={disabled}
-        className="disabled:cursor-not-allowed bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
-        placeholder="John"
-        required
-      />
-    </div>
-  );
-}

examples/onboarding/src/index.css

@@ -1,3 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;

examples/onboarding/src/main.tsx

@@ -1,31 +0,0 @@
-import App from "@/App.tsx";
-import "@/index.css";
-import { HRAccount } from "@/schema.ts";
-import { JazzProvider } from "jazz-react";
-import React from "react";
-import ReactDOM from "react-dom/client";
-import { apiKey } from "./apiKey";
-
-const peer =
-  (new URL(window.location.href).searchParams.get(
-    "peer",
-  ) as `ws://${string}`) ?? `wss://cloud.jazz.tools/?key=${apiKey}`;
-
-declare module "jazz-react" {
-  interface Register {
-    Account: HRAccount;
-  }
-}
-
-ReactDOM.createRoot(document.getElementById("root")!).render(
-  <React.StrictMode>
-    <JazzProvider
-      AccountSchema={HRAccount}
-      sync={{
-        peer,
-      }}
-    >
-      <App />
-    </JazzProvider>
-  </React.StrictMode>,
-);

examples/onboarding/src/pages/EmployeeList.tsx

@@ -1,50 +0,0 @@
-import { NavLink } from "@/components/NavLink.tsx";
-import { NavigateButton } from "@/components/NavigateBack.tsx";
-import { Stack } from "@/components/Stack.tsx";
-import { CoEmployee, EmployeeCoList } from "@/schema.ts";
-import { useCoState } from "jazz-react";
-import { ID } from "jazz-tools";
-
-export function EmployeeList({
-  employeeListCoId,
-}: {
-  employeeListCoId: ID<EmployeeCoList>;
-}) {
-  const employees = useCoState(EmployeeCoList, employeeListCoId, [{}]);
-
-  if (!employees) {
-    return <div>Loading...</div>;
-  }
-
-  return (
-    <Stack>
-      <NavigateButton to="/employee/new" text={"Add New Employee"} />
-      <ul className="max-w-md">
-        {employees.map((employee: CoEmployee) =>
-          employee.deleted ? null : (
-            <li key={employee.id} className="flex flex-row space-x-8 w-full">
-              <span>{employee._owner.myRole()}</span>
-              <span className="w-1/3">
-                <NavLink to={`/employee/${employee.id}`}>
-                  {employee.name}
-                </NavLink>
-              </span>
-              {employee.finalStep?.done && <span>✅</span>}
-              {employee._owner.myRole() === "admin" &&
-                !employee.finalStep?.done && (
-                  <span
-                    onClick={() => {
-                      employee.deleted = true;
-                    }}
-                    className="cursor-pointer"
-                  >
-                    🗑
-                  </span>
-                )}
-            </li>
-          ),
-        )}
-      </ul>
-    </Stack>
-  );
-}

examples/onboarding/src/pages/EmployeeOnboarding.tsx

@@ -1,240 +0,0 @@
-import { Button } from "@/components/Button.tsx";
-import { NavigateBack } from "@/components/NavigateBack.tsx";
-import { Stack } from "@/components/Stack.tsx";
-import { TextInput } from "@/components/TextInput.tsx";
-import { createImage } from "jazz-browser-media-images";
-import { useCoState } from "jazz-react";
-import { ProgressiveImg, createInviteLink } from "jazz-react";
-import { CoMap, ID } from "jazz-tools";
-import { ChangeEvent, ReactNode, useCallback } from "react";
-import { useParams } from "react-router";
-import {
-  CoDocUploadStep,
-  CoEmployee,
-  CoFinalStep,
-  CoInitialStep,
-} from "../schema.ts";
-
-const Card = ({
-  children,
-  title,
-  isDone,
-  isActive,
-}: {
-  children: ReactNode;
-  title: string;
-  isDone: boolean;
-  isActive?: boolean;
-}) => (
-  <div
-    className={`w-full p-4 bg-white border border-gray-200 rounded-lg shadow max-w-md ${
-      isActive ? "border-gray-900 hover:bg-green-50 shadow-xl" : ""
-    }`}
-  >
-    <Stack horizontal={true}>
-      <h5 className="mb-2 text-2xl text-gray-900">{title}</h5>
-      <h6 className="mb-2 text-2xl">
-        {isDone ? "✅" : isActive ? "❓" : "⌛"}
-      </h6>
-    </Stack>
-    {children}
-  </div>
-);
-
-const InfoCard = ({
-  initialStep,
-  canWrite,
-}: {
-  initialStep: CoInitialStep;
-  canWrite: boolean;
-}) => {
-  const isDisabled = !initialStep.isCurrentStep() || !canWrite;
-
-  return (
-    <Card
-      title="Personal Info"
-      isDone={initialStep?.done}
-      isActive={initialStep.isCurrentStep()}
-    >
-      <Stack>
-        <TextInput
-          disabled={isDisabled}
-          id="ssn"
-          label="Social Security Number"
-          value={initialStep.ssn || ""}
-          onChange={({ target: { value } }) => (initialStep.ssn = value)}
-        />
-        <TextInput
-          disabled={isDisabled}
-          id="address"
-          label="Address"
-          value={initialStep.address || ""}
-          onChange={({ target: { value } }) => (initialStep.address = value)}
-        />
-        {!initialStep.done && (
-          <Button
-            text={"Upload step >"}
-            disabled={!initialStep.ssn || !initialStep.address || isDisabled}
-            onClick={() => (initialStep.done = true)}
-          />
-        )}
-      </Stack>
-    </Card>
-  );
-};
-
-const UploadCard = ({
-  uploadStep,
-  canWrite,
-}: {
-  uploadStep: CoDocUploadStep;
-  canWrite: boolean;
-}) => {
-  const isDisabled = !uploadStep.isCurrentStep() || !canWrite;
-
-  const onImageSelected = useCallback(
-    async (event: ChangeEvent<HTMLInputElement>) => {
-      if (!event.target.files) return;
-
-      const image = await createImage(event.target.files[0], {
-        owner: uploadStep._owner,
-      });
-
-      uploadStep.photo = image;
-    },
-    [uploadStep],
-  );
-
-  return (
-    <Card
-      title="Uploads"
-      isDone={uploadStep?.done}
-      isActive={uploadStep.isCurrentStep()}
-    >
-      <Stack>
-        {uploadStep.photo && (
-          <ProgressiveImg image={uploadStep.photo}>
-            {({ src }) => (
-              <img
-                className="max-h-full max-w-full rounded-l-sm rounded-r-md shadow-lg p-2"
-                src={src}
-              />
-            )}
-          </ProgressiveImg>
-        )}
-
-        {!uploadStep.done && (
-          <>
-            <input
-              type="file"
-              disabled={isDisabled}
-              onChange={onImageSelected}
-              data-testid="file-upload"
-            />
-            <Button
-              text={"Confirmation step >"}
-              disabled={isDisabled || !uploadStep.photo}
-              onClick={() => (uploadStep.done = true)}
-            />
-          </>
-        )}
-      </Stack>
-    </Card>
-  );
-};
-
-const ConfirmationCard = ({
-  finalStep,
-  editable,
-}: {
-  finalStep: CoFinalStep;
-  editable: boolean;
-}) => {
-  const isDisabled = !finalStep.isCurrentStep() || !editable;
-  return (
-    <Card
-      title="Confirmation by admin"
-      isDone={finalStep?.done}
-      isActive={finalStep.isCurrentStep()}
-    >
-      <Stack>
-        {!finalStep.done && (
-          <Button
-            text="Confirmation by admin"
-            disabled={isDisabled}
-            onClick={() => (finalStep.done = true)}
-          />
-        )}
-      </Stack>
-    </Card>
-  );
-};
-
-export function EmployeeOnboading() {
-  const { employeeCoId } = useParams();
-
-  const employee = useCoState(CoEmployee, employeeCoId as ID<CoEmployee>, {});
-
-  const handleInviteLinkCreation = useCallback(
-    (role: "reader" | "writer") => {
-      if (!employee) return;
-
-      const link = createInviteLink(employee, role);
-      navigator.clipboard.writeText(link);
-      alert("Invite link copied to clipboard!");
-    },
-    [employee],
-  );
-
-  const isMeWriter = (step: CoMap): boolean => {
-    return ["writer", "admin"].includes(step._owner.myRole() || "");
-  };
-
-  return (
-    <>
-      <Stack>
-        <Stack horizontal={true}>
-          <NavigateBack />
-          {employee?._owner.myRole() === "admin" && (
-            <Button
-              text={"Invite a co-worker"}
-              onClick={() => handleInviteLinkCreation("writer")}
-            />
-          )}
-        </Stack>
-        <h2 className="mb-2 text-2xl text-gray-900 font-semibold">
-          {employee ? employee.name : "Loading..."}
-        </h2>
-      </Stack>
-
-      {employee && (
-        <Stack>
-          {employee.initialStep ? (
-            <InfoCard
-              initialStep={employee.initialStep}
-              canWrite={isMeWriter(employee.initialStep)}
-            />
-          ) : (
-            <div>Loading...</div>
-          )}
-          {employee.docUploadStep ? (
-            <UploadCard
-              uploadStep={employee.docUploadStep}
-              canWrite={isMeWriter(employee.docUploadStep)}
-            />
-          ) : (
-            <div>Loading...</div>
-          )}
-          {employee.finalStep ? (
-            <ConfirmationCard
-              finalStep={employee.finalStep}
-              editable={isMeWriter(employee.finalStep)}
-            />
-          ) : (
-            <div>Loading...</div>
-          )}
-        </Stack>
-      )}
-    </>
-  );
-}

examples/onboarding/src/pages/NewEmployee.tsx

@@ -1,89 +0,0 @@
-import { Button } from "@/components/Button.tsx";
-import { NavigateBack } from "@/components/NavigateBack.tsx";
-import { Stack } from "@/components/Stack.tsx";
-import { TextInput } from "@/components/TextInput.tsx";
-import { useAccount, useCoState } from "jazz-react";
-import { Group, ID } from "jazz-tools";
-import { useCallback, useState } from "react";
-import { useNavigate } from "react-router-dom";
-import {
-  CoDocUploadStep,
-  CoEmployee,
-  CoFinalStep,
-  CoInitialStep,
-  EmployeeCoList,
-} from "../schema.ts";
-
-export function NewEmployee({
-  employeeListCoId,
-}: {
-  employeeListCoId: ID<EmployeeCoList>;
-}) {
-  const navigate = useNavigate();
-  const { me } = useAccount();
-
-  const employees = useCoState(EmployeeCoList, employeeListCoId, [{}]);
-
-  const [employeeName, setEmployeeName] = useState<string>("");
-
-  const createEmployee = useCallback(() => {
-    if (!employees) return;
-
-    const writerGroup = Group.create({ owner: me });
-    const readerGroup = Group.create({ owner: me });
-    readerGroup.addMember("everyone", "reader");
-
-    const initialStep = CoInitialStep.create(
-      { done: false, type: "initial" },
-      { owner: writerGroup },
-    );
-
-    const docUploadStep = CoDocUploadStep.create(
-      { done: false, prevStep: initialStep, type: "upload" },
-      { owner: writerGroup },
-    );
-
-    const finalStep = CoFinalStep.create(
-      { done: false, prevStep: docUploadStep, type: "final" },
-      { owner: readerGroup },
-    );
-
-    const employee = CoEmployee.create(
-      {
-        name: employeeName,
-        initialStep,
-        docUploadStep,
-        finalStep,
-      },
-      { owner: writerGroup },
-    );
-
-    employees.push(employee);
-    setEmployeeName("");
-  }, [employeeName, employees]);
-
-  return (
-    <div className="w-96">
-      <Stack>
-        <NavigateBack />
-        <form className="grid gap-3">
-          <TextInput
-            label="Employee name"
-            id="employee-name"
-            value={employeeName}
-            onChange={({ target: { value } }) => setEmployeeName(value)}
-          />
-          <Button
-            type="submit"
-            disabled={!employeeName}
-            onClick={() => {
-              createEmployee();
-              navigate("/");
-            }}
-            text="Create Employee"
-          />
-        </form>
-      </Stack>
-    </div>
-  );
-}

examples/onboarding/src/schema.ts

@@ -1,76 +0,0 @@
-import {
-  Account,
-  CoList,
-  CoMap,
-  ImageDefinition,
-  Profile,
-  co,
-} from "jazz-tools";
-
-type Steps = "initial" | "upload" | "final";
-
-interface Step {
-  type: Steps;
-  prevStep: ReturnType<typeof co.ref> | undefined;
-  done: boolean;
-
-  isCurrentStep(): boolean;
-}
-
-export class CoInitialStep extends CoMap implements Step {
-  type = co.literal("initial");
-  ssn? = co.string;
-  address? = co.string;
-  done = co.boolean;
-  prevStep = co.null;
-  isCurrentStep() {
-    return !this.done;
-  }
-}
-
-export class CoDocUploadStep extends CoMap implements Step {
-  type = co.literal("upload");
-  prevStep = co.ref(CoInitialStep);
-  photo = co.ref(ImageDefinition, { optional: true });
-  done = co.boolean;
-
-  isCurrentStep() {
-    return !!(this.prevStep?.done && !this.done);
-  }
-}
-
-export class CoFinalStep extends CoMap implements Step {
-  type = co.literal("final");
-  prevStep = co.ref(CoDocUploadStep);
-  done = co.boolean;
-
-  isCurrentStep() {
-    return !!(this.prevStep?.done && !this.done);
-  }
-}
-
-export class CoEmployee extends CoMap {
-  name = co.string;
-  deleted? = co.boolean;
-  initialStep = co.ref(CoInitialStep);
-  docUploadStep = co.ref(CoDocUploadStep);
-  finalStep = co.ref(CoFinalStep);
-}
-
-export class EmployeeCoList extends CoList.Of(co.ref(CoEmployee)) {}
-
-export class HRProfile extends Profile {
-  employees = co.ref(EmployeeCoList);
-}
-
-export class HRAccount extends Account {
-  profile = co.ref(HRProfile)!;
-
-  migrate() {
-    if (!this.profile._refs.employees) {
-      this.profile.employees = EmployeeCoList.create([], {
-        owner: this.profile._owner,
-      });
-    }
-  }
-}

examples/onboarding/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

examples/onboarding/tailwind.config.ts

@@ -1,11 +0,0 @@
-import type { Config } from "tailwindcss";
-
-const config: Config = {
-  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-};
-
-export default config;

examples/onboarding/tests/onboardingFlow.spec.ts

@@ -1,96 +0,0 @@
-import {
-  Browser,
-  BrowserContext,
-  Page,
-  chromium,
-  expect,
-  test,
-} from "@playwright/test";
-import { EmployeeOnboardingPage } from "./pages/EmployeeOnboardingPage";
-import { HomePage } from "./pages/HomePage";
-import { LoginPage } from "./pages/LoginPage";
-
-async function scrollToBottom(page: Page) {
-  await page.evaluate(() => {
-    window.scrollTo(0, document.body.scrollHeight);
-  });
-}
-
-test.describe("Admin onboarding flow", () => {
-  let browser: Browser;
-  let adminContext: BrowserContext;
-  let writerContext: BrowserContext;
-
-  test.beforeAll(async () => {
-    browser = await chromium.launch();
-    adminContext = await browser.newContext();
-    writerContext = await browser.newContext();
-  });
-
-  test.afterAll(async () => {
-    await adminContext.close();
-    await writerContext.close();
-    await browser.close();
-  });
-
-  test("Create and delete flow", async () => {
-    const adminPage = await adminContext.newPage();
-    await adminPage.goto("/");
-    const adminHomePage = new HomePage(adminPage);
-    await adminHomePage.createEmployee("Paul");
-    await adminHomePage.createEmployee("Sean");
-    await adminHomePage.expectEmployee(["Sean", "admin"]);
-    await adminHomePage.expectEmployee(["Paul", "admin"]);
-    await adminHomePage.deleteEmployee("Sean");
-    await adminHomePage.expectEmployeeDeleted("Sean");
-
-    await adminPage.close();
-  });
-
-  test("Onboard flow", async () => {
-    const adminPage = await adminContext.newPage();
-    const writerPage = await writerContext.newPage();
-
-    await adminPage.goto("/");
-    await writerPage.goto("/");
-
-    const adminHomePage = new HomePage(adminPage);
-    await adminHomePage.createEmployee("Paul");
-    await adminHomePage.expectEmployee(["Paul", "admin"]);
-    await adminHomePage.navigateToEmployeeOnboardingPage("Paul");
-    const adminOnboardingPage = new EmployeeOnboardingPage(adminPage);
-
-    // create invitation
-    const invitation = await adminOnboardingPage.getShareLink();
-
-    // Wait for the invitation to be synced
-    await writerPage.waitForTimeout(3000);
-
-    //fill out by invitee (writer)
-    await writerPage.goto(invitation);
-
-    const writerHomePage = new HomePage(writerPage);
-    await writerHomePage.expectEmployee(["Paul", "write"]);
-    await writerHomePage.navigateToEmployeeOnboardingPage("Paul");
-    const writerOnboardingPage = new EmployeeOnboardingPage(writerPage);
-    await writerOnboardingPage.expectEmployeeName("Paul");
-    await writerOnboardingPage.fillPersonalDetailsCardAndSave(
-      "123-45-6789",
-      "123 Elm Street",
-    );
-    await writerOnboardingPage.fillUploadCardAndSave(
-      "./public/jazz-logo-low-res.jpg",
-    );
-
-    // invitee cannot confirm the onboarding completion
-    expect(
-      writerOnboardingPage.finalConfirmationButton.isDisabled(),
-    ).toBeTruthy();
-
-    // final confirmation step by admin
-    await scrollToBottom(adminPage);
-    await adminOnboardingPage.finalConfirmationButton.click();
-    await adminOnboardingPage.backButton.click();
-    await adminHomePage.expectOnboardingCompleteForEmployee("Paul");
-  });
-});

examples/onboarding/tests/pages/EmployeeOnboardingPage.ts

@@ -1,92 +0,0 @@
-import { Locator, Page, expect } from "@playwright/test";
-
-export class EmployeeOnboardingPage {
-  readonly page: Page;
-  readonly shareButton: Locator;
-  readonly backButton: Locator;
-  readonly logoutButton: Locator;
-  readonly finalConfirmationButton: Locator;
-  readonly fileInput: Locator;
-
-  constructor(page: Page) {
-    this.page = page;
-    this.shareButton = page.getByRole("button", {
-      name: /invite a co-worker/i,
-    });
-    this.backButton = page.getByRole("button", {
-      name: /back/i,
-    });
-    this.logoutButton = page.getByRole("button", {
-      name: /log out/i,
-    });
-    this.finalConfirmationButton = this.page.getByRole("button", {
-      name: /confirmation by admin/i,
-    });
-
-    this.fileInput = page.getByTestId("file-upload");
-  }
-
-  async uploadFile(value: string) {
-    // Start waiting for file chooser before clicking. Note no await.
-    const fileChooserPromise = this.page.waitForEvent("filechooser");
-
-    await this.fileInput.click();
-
-    const fileChooser = await fileChooserPromise;
-    await fileChooser.setFiles(value);
-  }
-
-  async expectEmployeeName(name: string) {
-    await expect(
-      this.page.getByRole("heading", {
-        name: name,
-      }),
-    ).toBeVisible();
-  }
-
-  async fillPersonalDetailsCardAndSave(ssn: string, address: string) {
-    const nextStepButton = this.page.getByRole("button", {
-      name: /upload step >/i,
-    });
-    await expect(nextStepButton).toBeDisabled();
-
-    const ssnInput = this.page.getByLabel(/Social Security Number/i);
-    await ssnInput.fill(ssn);
-
-    const addressInput = this.page.getByLabel(/Address/i);
-    await addressInput.fill(address);
-
-    // save and hide the button
-    await expect(nextStepButton).toBeEnabled();
-    await nextStepButton.click();
-    await expect(nextStepButton).not.toBeVisible();
-  }
-
-  async fillUploadCardAndSave(file: string) {
-    const nextStepButton = this.page.getByRole("button", {
-      name: /confirmation step >/i,
-    });
-    await expect(nextStepButton).toBeDisabled();
-
-    await this.uploadFile(file);
-    await expect(nextStepButton).toBeEnabled();
-    await nextStepButton.click();
-    await expect(nextStepButton).not.toBeVisible();
-  }
-
-  async getShareLink() {
-    await this.shareButton.click();
-
-    const inviteUrl = await this.page.evaluate(() =>
-      navigator.clipboard.readText(),
-    );
-
-    expect(inviteUrl).toBeTruthy();
-
-    return inviteUrl;
-  }
-
-  async logout() {
-    await this.logoutButton.click();
-  }
-}

examples/onboarding/tests/pages/HomePage.ts

@@ -1,66 +0,0 @@
-import { Locator, Page, expect } from "@playwright/test";
-import { NewEmployeePage } from "./NewEmployeePage";
-
-export class HomePage {
-  readonly page: Page;
-  readonly newEmployeeLink: Locator;
-  readonly logoutButton: Locator;
-
-  constructor(page: Page) {
-    this.page = page;
-    this.newEmployeeLink = page.getByRole("button", {
-      name: "Add New Employee",
-    });
-    this.logoutButton = page.getByRole("button", {
-      name: "Log Out",
-    });
-  }
-
-  async expectEmployee([name, role]: [string, string]) {
-    const liElement = this.page.locator(
-      `li:has-text("${name}"):has-text("${role}")`,
-    );
-    await expect(liElement).toBeVisible();
-  }
-
-  async deleteEmployee(name: string) {
-    const liElement = this.page.locator(`li:has-text("${name}")`);
-    const deleteIcon = liElement.locator('span:has-text("🗑")');
-    await deleteIcon.click();
-  }
-
-  async expectOnboardingCompleteForEmployee(name: string) {
-    const liElement = this.page.locator(`li:has-text("${name}")`);
-    const completionIcon = liElement.locator('span:has-text("✅")');
-    await expect(completionIcon).toBeVisible();
-  }
-
-  async expectEmployeeDeleted(name: string) {
-    const liElement = this.page.locator(`li:has-text("${name}")`);
-    await expect(liElement).not.toBeVisible();
-  }
-
-  async navigateToEmployeeOnboardingPage(name: string) {
-    await this.page
-      .getByRole("link", {
-        name,
-      })
-      .click();
-  }
-
-  async navigateToNewEmployee() {
-    await this.newEmployeeLink.click();
-  }
-
-  async createEmployee(name: string) {
-    await this.navigateToNewEmployee();
-    const newEmployeePage = new NewEmployeePage(this.page);
-
-    await newEmployeePage.fillEmployeeName(name);
-    await newEmployeePage.submit();
-  }
-
-  async logout() {
-    await this.logoutButton.click();
-  }
-}

examples/onboarding/tests/pages/LoginPage.ts

@@ -1,40 +0,0 @@
-import { Locator, Page, expect } from "@playwright/test";
-
-export class LoginPage {
-  readonly page: Page;
-  readonly usernameInput: Locator;
-  readonly signupButton: Locator;
-
-  constructor(page: Page) {
-    this.page = page;
-    this.usernameInput = page.getByRole("textbox");
-    this.signupButton = page.getByRole("button", {
-      name: "Sign up",
-    });
-  }
-
-  async goto(url: string) {
-    await this.page.goto(url);
-  }
-
-  async fillUsername(value: string) {
-    await this.usernameInput.clear();
-    await this.usernameInput.fill(value);
-  }
-
-  async loginAs(value: string) {
-    await this.page
-      .getByRole("button", {
-        name: value,
-      })
-      .click();
-  }
-
-  async signup() {
-    await this.signupButton.click();
-  }
-
-  async expectLoaded() {
-    await expect(this.signupButton).toBeVisible();
-  }
-}

examples/onboarding/tests/pages/NewEmployeePage.ts

@@ -1,24 +0,0 @@
-import { Locator, Page } from "@playwright/test";
-
-export class NewEmployeePage {
-  readonly page: Page;
-  readonly employeeNameInput: Locator;
-  readonly submitButton: Locator;
-
-  constructor(page: Page) {
-    this.page = page;
-    this.employeeNameInput = page.getByLabel(/employee name/i);
-    this.submitButton = page.getByRole("button", {
-      name: /create employee/i,
-    });
-  }
-
-  async fillEmployeeName(value: string) {
-    await this.employeeNameInput.clear();
-    await this.employeeNameInput.fill(value);
-  }
-
-  async submit() {
-    await this.submitButton.click();
-  }
-}

examples/onboarding/tsconfig.json

@@ -1,27 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": ["ES2023", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noFallthroughCasesInSwitch": true,
-    "baseUrl": "./",
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "include": ["src"],
-  "references": [{ "path": "./tsconfig.node.json" }]
-}

examples/onboarding/tsconfig.node.json

@@ -1,11 +0,0 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "skipLibCheck": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "allowSyntheticDefaultImports": true,
-    "strict": true
-  },
-  "include": ["vite.config.ts"]
-}

examples/onboarding/vite.config.ts

@@ -1,17 +0,0 @@
-import path from "path";
-import react from "@vitejs/plugin-react-swc";
-import { defineConfig } from "vite";
-import topLevelAwait from "vite-plugin-top-level-await";
-
-// https://vitejs.dev/config/
-export default defineConfig({
-  plugins: [react(), topLevelAwait()],
-  resolve: {
-    alias: {
-      "@": path.resolve(__dirname, "./src"),
-    },
-  },
-  build: {
-    minify: false,
-  },
-});

examples/onboarding/vite.config.ts.timestamp-1738123585435-c5f316a1877fb.mjs

@@ -1,20 +0,0 @@
-// vite.config.ts
-import path from "path";
-import react from "file:///Users/brad/dev/jazz/node_modules/@vitejs/plugin-react-swc/index.mjs";
-import topLevelAwait from "file:///Users/brad/dev/jazz/node_modules/vite-plugin-top-level-await/exports/import.mjs";
-import { defineConfig } from "file:///Users/brad/dev/jazz/node_modules/vite/dist/node/index.js";
-var __vite_injected_original_dirname =
-  "/Users/brad/dev/jazz/examples/onboarding";
-var vite_config_default = defineConfig({
-  plugins: [react(), topLevelAwait()],
-  resolve: {
-    alias: {
-      "@": path.resolve(__vite_injected_original_dirname, "./src"),
-    },
-  },
-  build: {
-    minify: false,
-  },
-});
-export { vite_config_default as default };
-//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvVXNlcnMvYnJhZC9kZXYvamF6ei9leGFtcGxlcy9vbmJvYXJkaW5nXCI7Y29uc3QgX192aXRlX2luamVjdGVkX29yaWdpbmFsX2ZpbGVuYW1lID0gXCIvVXNlcnMvYnJhZC9kZXYvamF6ei9leGFtcGxlcy9vbmJvYXJkaW5nL3ZpdGUuY29uZmlnLnRzXCI7Y29uc3QgX192aXRlX2luamVjdGVkX29yaWdpbmFsX2ltcG9ydF9tZXRhX3VybCA9IFwiZmlsZTovLy9Vc2Vycy9icmFkL2Rldi9qYXp6L2V4YW1wbGVzL29uYm9hcmRpbmcvdml0ZS5jb25maWcudHNcIjtpbXBvcnQgcGF0aCBmcm9tIFwicGF0aFwiO1xuaW1wb3J0IHJlYWN0IGZyb20gXCJAdml0ZWpzL3BsdWdpbi1yZWFjdC1zd2NcIjtcbmltcG9ydCB7IGRlZmluZUNvbmZpZyB9IGZyb20gXCJ2aXRlXCI7XG5pbXBvcnQgdG9wTGV2ZWxBd2FpdCBmcm9tIFwidml0ZS1wbHVnaW4tdG9wLWxldmVsLWF3YWl0XCI7XG5cbi8vIGh0dHBzOi8vdml0ZWpzLmRldi9jb25maWcvXG5leHBvcnQgZGVmYXVsdCBkZWZpbmVDb25maWcoe1xuICBwbHVnaW5zOiBbcmVhY3QoKSwgdG9wTGV2ZWxBd2FpdCgpXSxcbiAgcmVzb2x2ZToge1xuICAgIGFsaWFzOiB7XG4gICAgICBcIkBcIjogcGF0aC5yZXNvbHZlKF9fZGlybmFtZSwgXCIuL3NyY1wiKSxcbiAgICB9LFxuICB9LFxuICBidWlsZDoge1xuICAgIG1pbmlmeTogZmFsc2UsXG4gIH0sXG59KTtcbiJdLAogICJtYXBwaW5ncyI6ICI7QUFBMFMsT0FBTyxVQUFVO0FBQzNULE9BQU8sV0FBVztBQUNsQixTQUFTLG9CQUFvQjtBQUM3QixPQUFPLG1CQUFtQjtBQUgxQixJQUFNLG1DQUFtQztBQU16QyxJQUFPLHNCQUFRLGFBQWE7QUFBQSxFQUMxQixTQUFTLENBQUMsTUFBTSxHQUFHLGNBQWMsQ0FBQztBQUFBLEVBQ2xDLFNBQVM7QUFBQSxJQUNQLE9BQU87QUFBQSxNQUNMLEtBQUssS0FBSyxRQUFRLGtDQUFXLE9BQU87QUFBQSxJQUN0QztBQUFBLEVBQ0Y7QUFBQSxFQUNBLE9BQU87QUFBQSxJQUNMLFFBQVE7QUFBQSxFQUNWO0FBQ0YsQ0FBQzsiLAogICJuYW1lcyI6IFtdCn0K

examples/organization/CHANGELOG.md

@@ -1,5 +1,29 @@
 # organization
 
+## 0.0.44
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.43
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.42
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.41
 
 ### Patch Changes

examples/organization/package.json

@@ -1,7 +1,7 @@
 {
   "name": "organization",
   "private": true,
-  "version": "0.0.41",
+  "version": "0.0.44",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/organization/tsconfig.tsbuildinfo

@@ -1 +0,0 @@
-{"root":["./src/acceptinvitepage.tsx","./src/homepage.tsx","./src/layout.tsx","./src/organizationpage.tsx","./src/main.tsx","./src/schema.ts","./src/vite-env.d.ts","./src/components/createorganization.tsx","./src/components/createproject.tsx","./src/components/errors.tsx","./src/components/heading.tsx","./src/components/invitelink.tsx","./src/components/organizationform.tsx","./src/components/organizationmembers.tsx","./src/components/organizationselector.tsx"],"version":"5.6.3"}

examples/passkey-svelte/CHANGELOG.md

@@ -1,5 +1,23 @@
 # passkey-svelte
 
+## 0.0.39
+
+### Patch Changes
+
+- jazz-svelte@0.10.6
+
+## 0.0.38
+
+### Patch Changes
+
+- jazz-svelte@0.10.5
+
+## 0.0.37
+
+### Patch Changes
+
+- jazz-svelte@0.10.4
+
 ## 0.0.36
 
 ### Patch Changes

examples/passkey-svelte/package.json

@@ -1,6 +1,6 @@
 {
   "name": "passkey-svelte",
-  "version": "0.0.36",
+  "version": "0.0.39",
   "type": "module",
   "private": true,
   "scripts": {

examples/passkey/CHANGELOG.md

@@ -1,5 +1,29 @@
 # minimal-auth-passkey
 
+## 0.0.49
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.48
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.47
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.46
 
 ### Patch Changes

examples/passkey/package.json

@@ -1,7 +1,7 @@
 {
   "name": "passkey",
   "private": true,
-  "version": "0.0.46",
+  "version": "0.0.49",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/passphrase/CHANGELOG.md

@@ -1,5 +1,29 @@
 # passphrase
 
+## 0.0.46
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.45
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.44
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.43
 
 ### Patch Changes

examples/passphrase/package.json

@@ -1,7 +1,7 @@
 {
   "name": "passphrase",
   "private": true,
-  "version": "0.0.43",
+  "version": "0.0.46",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/password-manager/CHANGELOG.md

@@ -1,5 +1,29 @@
 # jazz-password-manager
 
+## 0.0.70
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.69
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.68
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.67
 
 ### Patch Changes

examples/password-manager/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-password-manager",
   "private": true,
-  "version": "0.0.67",
+  "version": "0.0.70",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -12,8 +12,8 @@
     "clean-install": "rm -rf node_modules pnpm-lock.yaml && pnpm install"
   },
   "dependencies": {
-    "jazz-react": "workspace:0.10.3",
-    "jazz-tools": "workspace:0.10.3",
+    "jazz-react": "workspace:0.10.6",
+    "jazz-tools": "workspace:0.10.6",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-hook-form": "^7.41.5",

examples/pets/CHANGELOG.md

@@ -1,5 +1,32 @@
 # jazz-example-pets
 
+## 0.0.168
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+  - jazz-browser-media-images@0.10.6
+
+## 0.0.167
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser-media-images@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.166
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+- jazz-browser-media-images@0.10.4
+
 ## 0.0.165
 
 ### Patch Changes

examples/pets/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-pets",
   "private": true,
-  "version": "0.0.165",
+  "version": "0.0.168",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -10,8 +10,8 @@
     "format-and-lint:fix": "biome check . --write",
     "preview": "vite preview",
     "sync": "jazz-run sync",
-    "test": "playwright test",
-    "test:ui": "playwright test --ui"
+    "test:e2e": "playwright test",
+    "test:e2e:ui": "playwright test --ui"
   },
   "dependencies": {
     "@radix-ui/react-checkbox": "^1.0.4",
@@ -19,9 +19,9 @@
     "@radix-ui/react-toast": "^1.1.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
-    "jazz-browser-media-images": "workspace:0.10.3",
-    "jazz-react": "workspace:0.10.3",
-    "jazz-tools": "workspace:0.10.3",
+    "jazz-browser-media-images": "workspace:0.10.6",
+    "jazz-react": "workspace:0.10.6",
+    "jazz-tools": "workspace:0.10.6",
     "lucide-react": "^0.274.0",
     "qrcode": "^1.5.3",
     "react": "^18.3.1",
@@ -41,7 +41,7 @@
     "@vitejs/plugin-react-swc": "^3.3.2",
     "autoprefixer": "^10.4.20",
     "is-ci": "^3.0.1",
-    "jazz-run": "workspace:0.10.3",
+    "jazz-run": "workspace:0.10.6",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "~5.6.2",

examples/reactions/CHANGELOG.md

@@ -1,5 +1,33 @@
 # reactions
 
+## 0.0.48
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - hash-slash@0.2.2
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+  - jazz-browser-media-images@0.10.6
+
+## 0.0.47
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser-media-images@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.46
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+- jazz-browser-media-images@0.10.4
+
 ## 0.0.45
 
 ### Patch Changes

examples/reactions/package.json

@@ -1,7 +1,7 @@
 {
   "name": "reactions",
   "private": true,
-  "version": "0.0.45",
+  "version": "0.0.48",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/todo-vue/CHANGELOG.md

@@ -1,5 +1,31 @@
 # todo-vue
 
+## 0.0.53
+
+### Patch Changes
+
+- Updated dependencies [ada802b]
+  - jazz-tools@0.10.6
+  - jazz-browser@0.10.6
+  - jazz-vue@0.10.6
+
+## 0.0.52
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-browser@0.10.5
+  - jazz-vue@0.10.5
+
+## 0.0.51
+
+### Patch Changes
+
+- jazz-browser@0.10.4
+- jazz-tools@0.10.4
+- jazz-vue@0.10.4
+
 ## 0.0.50
 
 ### Patch Changes

examples/todo-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "todo-vue",
-  "version": "0.0.50",
+  "version": "0.0.53",
   "private": true,
   "type": "module",
   "scripts": {

examples/todo/CHANGELOG.md

@@ -1,5 +1,29 @@
 # jazz-example-todo
 
+## 0.0.167
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.166
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.165
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.164
 
 ### Patch Changes

examples/todo/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-todo",
   "private": true,
-  "version": "0.0.164",
+  "version": "0.0.167",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -16,8 +16,8 @@
     "@radix-ui/react-toast": "^1.1.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
-    "jazz-react": "workspace:0.10.3",
-    "jazz-tools": "workspace:0.10.3",
+    "jazz-react": "workspace:0.10.6",
+    "jazz-tools": "workspace:0.10.6",
     "lucide-react": "^0.274.0",
     "qrcode": "^1.5.3",
     "react": "^18.3.1",

examples/version-history/CHANGELOG.md

@@ -1,5 +1,29 @@
 # version-history
 
+## 0.0.45
+
+### Patch Changes
+
+- Updated dependencies [1d71ca1]
+- Updated dependencies [ada802b]
+  - jazz-react@0.10.6
+  - jazz-tools@0.10.6
+
+## 0.0.44
+
+### Patch Changes
+
+- Updated dependencies [59ff77e]
+  - jazz-tools@0.10.5
+  - jazz-react@0.10.5
+
+## 0.0.43
+
+### Patch Changes
+
+- jazz-react@0.10.4
+- jazz-tools@0.10.4
+
 ## 0.0.42
 
 ### Patch Changes

examples/version-history/package.json

@@ -1,7 +1,7 @@
 {
   "name": "version-history",
   "private": true,
-  "version": "0.0.42",
+  "version": "0.0.45",
   "type": "module",
   "scripts": {
     "dev": "vite",

flake.lock

@@ -20,11 +20,11 @@
     },
     "nixpkgs": {
       "locked": {
-        "lastModified": 1737885589,
-        "narHash": "sha256-Zf0hSrtzaM1DEz8//+Xs51k/wdSajticVrATqDrfQjg=",
+        "lastModified": 1739580444,
+        "narHash": "sha256-+/bSz4EAVbqz8/HsIGLroF8aNaO8bLRL7WfACN+24g4=",
         "owner": "nixos",
         "repo": "nixpkgs",
-        "rev": "852ff1d9e153d8875a83602e03fdef8a63f0ecf8",
+        "rev": "8bb37161a0488b89830168b81c48aed11569cb93",
         "type": "github"
       },
       "original": {

flake.nix

@@ -16,15 +16,19 @@
       {
         devShells.default = pkgs.mkShell {
           buildInputs = with pkgs; [
+            # General development
+            git
+            turbo
+            
+            # JS development
             nodejs_22
             nodePackages.pnpm
-            git
           ];
 
           shellHook = ''
             echo ""
             echo "Welcome to the Jazz development environment!"
-            echo "Run 'pnpm install' to install the dependencies."
+            echo "Run 'pnpm install' to install dependencies."
             echo ""
           '';
         };

homepage/design-system/src/app/components/atoms/Icon.tsx

@@ -24,21 +24,18 @@ import {
   MonitorSmartphoneIcon,
   MoonIcon,
   MousePointerSquareDashedIcon,
-  PencilLineIcon,
   ScanFace,
   ScrollIcon,
   SunIcon,
   TrashIcon,
   UploadCloudIcon,
   UserIcon,
-  UserPlusIcon,
   UsersIcon,
   WifiOffIcon,
   XIcon,
 } from "lucide-react";
 
 const icons = {
-  addUser: UserPlusIcon,
   arrowDown: ArrowDownIcon,
   arrowRight: ArrowRightIcon,
   auth: UserIcon,
@@ -71,7 +68,6 @@ const icons = {
   tableOfContents: ScrollIcon,
   touchId: FingerprintIcon,
   upload: UploadCloudIcon,
-  write: PencilLineIcon,
   zip: FolderArchiveIcon,
 };
 
@@ -123,7 +119,7 @@ export function Icon({
   className?: string;
 } & React.SVGProps<SVGSVGElement>) {
   if (!icon && (!name || !icons.hasOwnProperty(name))) {
-    throw new Error(`Icon not found`);
+    throw new Error(`Icon not found: ${name}`);
   }
 
   // @ts-ignore

homepage/design-system/src/app/components/molecules/CodeGroup.tsx

@@ -24,12 +24,11 @@ function CopyButton({ code, size }: { code: string; size: "md" | "lg" }) {
       type="button"
       className={clsx(
         "group/button absolute overflow-hidden rounded text-2xs font-medium md:opacity-0 backdrop-blur transition md:focus:opacity-100 group-hover:opacity-100",
-        "right-[9px] top-[9px]",
         copied
           ? "bg-emerald-400/10 ring-1 ring-inset ring-emerald-400/20"
           : "bg-white/5 hover:bg-white/7.5 dark:bg-white/2.5 dark:hover:bg-white/5",
         size == "md"
-          ? "right-[8px] top-[8px] py-[2px] pl-1 pr-2"
+          ? "right-[8.5px] top-[8.5px] py-[2px] pl-1 pr-2"
           : "right-2 top-2 py-1 pl-2 pr-3 ",
       )}
       onClick={() => {

homepage/design-system/src/app/components/organisms/Dropdown.tsx

@@ -30,9 +30,9 @@ export function DropdownMenu({
       className={clsx(
         className,
         // Anchor positioning
-        "[--anchor-gap:theme(spacing.2)] [--anchor-padding:theme(spacing.1)] data-[anchor~=start]:[--anchor-offset:-6px] data-[anchor~=end]:[--anchor-offset:6px] sm:data-[anchor~=start]:[--anchor-offset:-4px] sm:data-[anchor~=end]:[--anchor-offset:4px]",
+        "[--anchor-gap:theme(spacing.2)] [--anchor-padding:theme(spacing.1.5)]",
         // Base styles
-        "isolate w-max rounded-xl p-1",
+        "isolate rounded-lg p-1.5",
         // Invisible border that is only visible in `forced-colors` mode for accessibility purposes
         "outline outline-1 outline-transparent focus:outline-none",
         // Handle scrolling when menu won't fit in viewport
@@ -60,9 +60,9 @@ export function DropdownItem({
   let classes = clsx(
     className,
     // Base styles
-    "group rounded-lg space-x-2 px-3.5 py-2.5 focus:outline-none sm:px-3 sm:py-1.5",
+    "group rounded-md space-x-2  focus:outline-none px-2.5 py-1.5",
     // Text styles
-    "text-left text-stone-600 text-sm/6 dark:text-white forced-colors:text-[CanvasText]",
+    "text-left text-sm/6 dark:text-white forced-colors:text-[CanvasText]",
     // Focus
     "data-[focus]:bg-stone-100 dark:data-[focus]:bg-stone-900 ",
     // Disabled state

homepage/design-system/src/app/components/organisms/Footer.tsx

@@ -36,7 +36,9 @@ export function Footer({
       <div className="container grid gap-8 md:gap-12">
         <div className="grid grid-cols-12 gap-y-3 sm:items-center pb-8 border-b">
           <div className="col-span-full sm:col-span-6 md:col-span-8">
-            {logo}
+            <Link href="https://garden.co" target="_blank">
+              {logo}
+            </Link>
           </div>
           <p className="col-span-full sm:col-span-6 md:col-span-4 text-sm sm:text-base">
             Playful software for serious problems.

homepage/design-system/tailwind.config.js

@@ -6,8 +6,7 @@ const plugin = require("tailwindcss/plugin");
 
 const stonePalette = {
   50: "oklch(0.988281 0.002 75)",
-  75: "oklch(0.980563 0.002 75)",
-  100: "oklch(0.964844 0.002 75)",
+  100: "oklch(0.980563 0.002 75)",
   200: "oklch(0.917969 0.002 75)",
   300: "oklch(0.853516 0.002 75)",
   400: "oklch(0.789063 0.002 75)",
@@ -106,25 +105,25 @@ const config = {
               fontFamily: theme("fontFamily.display"),
               letterSpacing: theme("letterSpacing.tight"),
               fontWeight: theme("fontWeight.semibold"),
-              fontSize: theme("fontSize.4xl"),
+              fontSize: theme("fontSize.3xl"),
             },
             h2: {
               fontFamily: theme("fontFamily.display"),
               letterSpacing: theme("letterSpacing.tight"),
               fontWeight: theme("fontWeight.semibold"),
-              fontSize: theme("fontSize.3xl"),
+              fontSize: theme("fontSize.2xl"),
             },
             h3: {
               fontFamily: theme("fontFamily.display"),
               letterSpacing: theme("letterSpacing.tight"),
               fontWeight: theme("fontWeight.semibold"),
-              fontSize: theme("fontSize.2xl"),
+              fontSize: theme("fontSize.xl"),
             },
             h4: {
               fontFamily: theme("fontFamily.display"),
               letterSpacing: theme("letterSpacing.tight"),
               fontWeight: theme("fontWeight.semibold"),
-              fontSize: theme("fontSize.xl"),
+              fontSize: theme("fontSize.lg"),
             },
             "code::before": {
               content: "none",

homepage/homepage/app/(docs)/api-reference/layout.tsx

@@ -9,7 +9,7 @@ export default function RootLayout({
 }) {
   return (
     <DocsLayout nav={<ApiNav />} navIcon="package" navName="API Ref">
-      <Prose className="overflow-x-hidden lg:flex-1 py-8">{children}</Prose>
+      <Prose className="overflow-x-hidden lg:flex-1 py-10">{children}</Prose>
     </DocsLayout>
   );
 }

homepage/homepage/app/(docs)/docs/[framework]/(others)/layout.tsx

@@ -9,7 +9,7 @@ export default function Layout({
 }) {
   return (
     <DocsLayout nav={<DocNav />}>
-      <Prose className="max-w-3xl mx-auto lg:flex-1 py-8">{children}</Prose>
+      <Prose className="max-w-3xl mx-auto lg:flex-1 py-10">{children}</Prose>
     </DocsLayout>
   );
 }

homepage/homepage/app/(docs)/docs/[framework]/(others)/page.mdx

@@ -1,4 +1,6 @@
-import { CodeGroup, ContentByFramework } from '@/components/forMdx'
+import { CodeGroup, ContentByFramework, JazzLogo } from '@/components/forMdx'
+
+# Learn some <span className="sr-only">Jazz</span> <JazzLogo className="h-[41px] -ml-0.5 -mt-[3px] inline" />
 
 Welcome to the Jazz documentation!
 
@@ -45,14 +47,9 @@ Many of the packages provided are documented in the [API Reference](/api-referen
 
 ## LLM Docs
 
-We support the [llms.txt](https://llmstxt.org/) convention for making documentation available to large language models and the applications that make use of them.
-
-We currently have: 
-
-- [/llms.txt](/llms.txt) - A overview listing of the available packages and their documentation
-- [/llms-full.txt](/llms-full.txt) - Full documentation for our packages
+Get better results with AI by [importing the Jazz docs](/docs/ai-tools) into your context window.
 
 ## Get support
 
 If you have any questions or need assistance, please don't hesitate to reach out to us on [Discord](https://discord.gg/utDMjHYg42).
-We would love to help you get started.
+We would love to help you get started.

homepage/homepage/app/(docs)/docs/[framework]/(others)/page.tsx

@@ -1,30 +0,0 @@
-import { JazzLogo } from "gcmp-design-system/src/app/components/atoms/logos/JazzLogo";
-import { HeroHeader } from "gcmp-design-system/src/app/components/molecules/HeroHeader";
-import { Prose } from "gcmp-design-system/src/app/components/molecules/Prose";
-import MdxSource from "../../../../../components/docs/docs-intro.mdx";
-import { frameworks } from "../../../../../lib/framework";
-
-export default function Page() {
-  return (
-    <>
-      <div className="not-prose">
-        <h1 className="sr-only">Getting started</h1>
-        <HeroHeader
-          title={
-            <>
-              Learn some{" "}
-              <JazzLogo className="h-[1.3em] relative -top-0.5 inline-block -ml-[0.1em] -mr-[0.1em]" />
-            </>
-          }
-          slogan=""
-          pt={false}
-        />
-      </div>
-      <MdxSource />
-    </>
-  );
-}
-
-export function generateStaticParams() {
-  return frameworks.map((framework) => ({ framework }));
-}

homepage/homepage/app/(docs)/docs/[framework]/[...slug]/ai-tools.mdx

@@ -0,0 +1,45 @@
+import { ContentByFramework, CodeGroup } from '@/components/forMdx'
+
+# Using AI to build Jazz apps
+
+AI tools, particularly large language models (LLMs), can accelerate your development with Jazz. Searching docs, responding to questions and even helping you write code are all things that LLMs are starting to get good at.
+
+Jazz is a rapidly evolving framework, and the docs are a work in progress, and sometimes AI might get things a little wrong.
+
+To help the LLMs, we provide a number of [llms.txt](https://llmstxt.org/) files that are optimised for use with AI tools.
+
+## Getting started with AI tools
+
+[llms.txt](https://llmstxt.org/) is a proposal to standardise the way that documentation is provided to AI tools at inference time that helps them understand the context of the code you're writing.
+
+Many AI tools are starting to support this, and we've created a [llms-full.txt](https://jazz.tools/llms-full.txt) file that is optimised for use with AI tools, like Cursor.
+
+## Setting up AI tools
+
+Every AI tool is different, but generally you'll need to either provide the contents of the [llms-full.txt](https://jazz.tools/llms-full.txt) file in your prompt, or upload the file to the tool.
+
+### ChatGPT and v0
+
+<a href="/llms-full.txt" download>Download llms-full.txt</a>
+
+Upload the txt file in your prompt.
+
+![ChatGPT prompt with llms-full.txt attached](/chatgpt-with-llms-full-txt.jpg)
+
+### Cursor
+
+1. Go to Settings > Cursor Settings > Features > Docs
+2. Click "Add new doc"
+3. Enter the following URL:
+
+<CodeGroup>
+```
+https://jazz.tools/llms-full.txt
+```
+</CodeGroup>
+
+## Limitations and considerations
+
+AI is amazing, but it's not perfect. What works well this week could break next week (or be twice as good).
+
+We're keen to keep up with changes in tooling to help support you building the best apps, but if you need help from humans (or you have issues getting set up), please let us know on [Discord](https://discord.gg/utDMjHYg42).