Merge pull request #2423 from garden-co/changeset-release/main

Version Packages

.changeset/config.json

@@ -2,8 +2,8 @@
   "$schema": "https://unpkg.com/@changesets/config@2.3.1/schema.json",
   "changelog": "@changesets/cli/changelog",
   "commit": false,
-  "fixed": [],
-  "linked": [
+  "linked": [],
+  "fixed": [
     [
       "cojson",
       "cojson-storage",
@@ -27,6 +27,8 @@
       "jazz-react-native-core",
       "jazz-react-native",
       "jazz-react-native-media-images",
+      "jazz-richtext-prosemirror",
+      "jazz-richtext-tiptap",
       "jazz-run",
       "jazz-svelte",
       "jazz-tools",

.github/workflows/e2e-rn-test.yml

@@ -38,7 +38,6 @@ jobs:
       - name: chat-rn-expo App Pre Build
         working-directory: ./examples/chat-rn-expo
         run: |
-          pnpm build
           pnpm expo prebuild --clean
 
       - name: Install Maestro

.github/workflows/playwright-homepage.yml

@@ -0,0 +1,46 @@
+name: Playwright Tests
+
+on:
+  push:
+    branches: ["main"]
+  pull_request:
+    types: [opened, synchronize, reopened]
+
+jobs:
+  test:
+    timeout-minutes: 60
+    runs-on: blacksmith-4vcpu-ubuntu-2204
+    strategy:
+      matrix:
+        project: ["homepage/homepage"]
+
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          submodules: true
+
+      - name: Setup Source Code
+        uses: ./.github/actions/source-code/
+
+      - name: Install project dependencies
+        run: pnpm install
+        working-directory: ./${{ matrix.project }}
+
+      - name: Pnpm Build
+        run: pnpm turbo build
+        working-directory: ./${{ matrix.project }}
+
+      - name: Install Playwright Browsers
+        run: pnpm exec playwright install
+        working-directory: ./${{ matrix.project }}
+
+      - name: Run Playwright tests
+        run: pnpm exec playwright test
+        working-directory: ./${{ matrix.project }}
+
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: ${{ hashFiles(format('{0}/package.json', matrix.project)) }}-playwright-report
+          path: ./${{ matrix.project }}/playwright-report/
+          retention-days: 30

.gitignore

@@ -20,6 +20,9 @@ __screenshots__
 # Playwright
 test-results
 
+# Java
+.java-version
+
 .husky
 
 .vscode/*

biome.json

@@ -64,7 +64,7 @@
       }
     },
     {
-      "include": ["packages/**/src/tests/**"],
+      "include": ["**/tests/**"],
       "linter": {
         "rules": {
           "correctness": {

examples/betterauth/CHANGELOG.md

@@ -1,5 +1,43 @@
 # betterauth
 
+## 0.1.23
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-betterauth-server-plugin@0.14.20
+  - jazz-inspector@0.14.20
+  - jazz-react@0.14.20
+  - jazz-react-auth-betterauth@0.14.20
+  - jazz-betterauth-client-plugin@0.14.20
+
+## 0.1.22
+
+### Patch Changes
+
+- jazz-betterauth-client-plugin@0.14.19
+- jazz-betterauth-server-plugin@0.14.19
+- jazz-react-auth-betterauth@0.14.19
+- jazz-inspector@0.14.19
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.1.21
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-betterauth-server-plugin@0.14.18
+  - jazz-inspector@0.14.18
+  - jazz-react@0.14.18
+  - jazz-react-auth-betterauth@0.14.18
+  - jazz-betterauth-client-plugin@0.14.18
+
 ## 0.1.20
 
 ### Patch Changes

examples/betterauth/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "betterauth",
-	"version": "0.1.20",
+	"version": "0.1.23",
 	"private": true,
 	"type": "module",
 	"scripts": {

examples/chat-rn-expo-clerk/CHANGELOG.md

@@ -1,5 +1,35 @@
 # chat-rn-expo-clerk
 
+## 1.0.143
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-expo@0.14.20
+  - jazz-react-native-media-images@0.14.20
+
+## 1.0.142
+
+### Patch Changes
+
+- Updated dependencies [061ec99]
+  - jazz-expo@0.14.19
+  - jazz-react-native-media-images@0.14.19
+  - jazz-tools@0.14.19
+
+## 1.0.141
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-expo@0.14.18
+  - jazz-react-native-media-images@0.14.18
+
 ## 1.0.140
 
 ### Patch Changes

examples/chat-rn-expo-clerk/package.json

@@ -1,7 +1,7 @@
 {
   "name": "chat-rn-expo-clerk",
   "main": "index.js",
-  "version": "1.0.140",
+  "version": "1.0.143",
   "scripts": {
     "build": "expo export -p ios",
     "start": "expo start",

examples/chat-rn-expo/CHANGELOG.md

@@ -1,5 +1,32 @@
 # chat-rn-expo
 
+## 1.0.11
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-expo@0.14.20
+
+## 1.0.10
+
+### Patch Changes
+
+- Updated dependencies [061ec99]
+  - jazz-expo@0.14.19
+  - jazz-tools@0.14.19
+
+## 1.0.9
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-expo@0.14.18
+
 ## 1.0.8
 
 ### Patch Changes

examples/chat-rn-expo/app.json

@@ -14,7 +14,7 @@
     },
     "ios": {
       "supportsTablet": true,
-      "bundleIdentifier": "com.anonymous.chatrnexpo"
+      "bundleIdentifier": "tools.jazz.chatrnexpo"
     },
     "android": {
       "adaptiveIcon": {
@@ -22,7 +22,7 @@
         "backgroundColor": "#ffffff"
       },
       "edgeToEdgeEnabled": true,
-      "package": "com.anonymous.chatrnexpo"
+      "package": "tools.jazz.chatrnexpo"
     },
     "web": {
       "favicon": "./assets/favicon.png"

examples/chat-rn-expo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chat-rn-expo",
-  "version": "1.0.8",
+  "version": "1.0.11",
   "main": "index.ts",
   "scripts": {
     "build": "expo prebuild",

examples/chat-rn-expo/test/e2e/erase_text.yml

@@ -2,7 +2,7 @@
 # fully erased.  The tap into the input field hits the middle, and clears all
 # text to the left.  If there's more to the right, it slides left, and thus we
 # repeat this step.  https://maestro.mobile.dev/api-reference/commands/erasetext
-appId: com.jazz.chatrn
+appId: tools.jazz.chatrnexpo
 ---
 - copyTextFrom:
    id: ${id}

examples/chat-rn-expo/test/e2e/flow.yml

@@ -1,4 +1,4 @@
-appId: com.jazz.chatrn
+appId: tools.jazz.chatrnexpo
 ---
 - launchApp
 

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

@@ -3,14 +3,18 @@
 # This script is necessary, because unlike ios, the android emulator action
 # accepts a script, runs it as your tests, then terminates.
 
-# set -e
+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 >> ~/output/android-install.log 2>&1
-# cd ..
+OUTPUT_FILE=~/output/android-install.log
+mkdir -p ~/output
+touch $OUTPUT_FILE
+
+# 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 >> $OUTPUT_FILE 2>&1
+cd ..
 
 # run the e2e tests
 export PATH="$PATH":"$HOME/.maestro/bin"

examples/chat-rn/CHANGELOG.md

@@ -1,5 +1,39 @@
 # chat-rn
 
+## 1.0.138
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react-native@0.14.20
+  - cojson@0.14.20
+  - cojson-transport-ws@0.14.20
+
+## 1.0.137
+
+### Patch Changes
+
+- Updated dependencies [061ec99]
+  - jazz-react-native@0.14.19
+  - cojson@0.14.19
+  - cojson-transport-ws@0.14.19
+  - jazz-tools@0.14.19
+
+## 1.0.136
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [0d5ee3e]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - cojson@0.14.18
+  - jazz-react-native@0.14.18
+  - cojson-transport-ws@0.14.18
+
 ## 1.0.135
 
 ### Patch Changes

examples/chat-rn/README.md

@@ -26,7 +26,7 @@ This will set up and launch the app on iOS. For Android, you can skip `pnpm pods
 This was created using the following command:
 
 ```bash
-pnpx @react-native-community/cli init chat-rn --version 0.76.7 --install-pods true --skip-git-init true --package-name com.chatrn --directory chat-rn
+pnpx @react-native-community/cli init chat-rn --version 0.76.9 --install-pods true --skip-git-init true --package-name com.chatrn --directory chat-rn
 ```
 
 Then change package name in `package.json`, and begin build instructions above.

examples/chat-rn/app.json

@@ -2,9 +2,9 @@
   "name": "ChatRN",
   "displayName": "ChatRN",
   "android": {
-    "package": "com.anonymous.ChatRN"
+    "package": "tools.jazz.chatrn"
   },
   "ios": {
-    "bundleIdentifier": "com.anonymous.ChatRN"
+    "bundleIdentifier": "tools.jazz.chatrn"
   }
 }

examples/chat-rn/metro.config.js

@@ -26,7 +26,7 @@ module.exports = makeMetroConfig({
     resolveRequest: MetroSymlinksResolver(),
     extraNodeModules,
     nodeModulesPaths,
+    sourceExts: ["mjs", "js", "json", "ts", "tsx"],
   },
-  sourceExts: ["mjs", "js", "json", "ts", "tsx"],
   watchFolders,
 });

examples/chat-rn/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chat-rn",
-  "version": "1.0.135",
+  "version": "1.0.138",
   "main": "index.js",
   "scripts": {
     "android": "react-native run-android",
@@ -40,10 +40,10 @@
     "@react-native-community/cli": "15.0.1",
     "@react-native-community/cli-platform-android": "15.0.1",
     "@react-native-community/cli-platform-ios": "15.0.1",
-    "@react-native/babel-preset": "0.76.7",
-    "@react-native/eslint-config": "0.76.7",
-    "@react-native/metro-config": "0.76.7",
-    "@react-native/typescript-config": "0.76.7",
+    "@react-native/babel-preset": "0.76.9",
+    "@react-native/eslint-config": "0.76.9",
+    "@react-native/metro-config": "0.76.9",
+    "@react-native/typescript-config": "0.76.9",
     "@rnx-kit/metro-config": "^2.0.1",
     "@rnx-kit/metro-resolver-symlinks": "^0.2.1",
     "@types/react": "^18.3.12",

examples/chat-rn/src/chat.tsx

@@ -3,7 +3,6 @@ import { useAccount, useCoState } from "jazz-react-native";
 import { CoPlainText, Group, ID, Loaded, Profile } from "jazz-tools";
 import { useEffect, useState } from "react";
 import {
-  Alert,
   Button,
   FlatList,
   KeyboardAvoidingView,
@@ -19,6 +18,7 @@ import { Chat, Message } from "./schema";
 export function ChatScreen({ navigation }: { navigation: any }) {
   const { me, logOut } = useAccount();
   const [chatId, setChatId] = useState<string>();
+  const [chatIdInput, setChatIdInput] = useState<string>();
   const loadedChat = useCoState(Chat, chatId, { resolve: { $each: true } });
   const [message, setMessage] = useState("");
   const profile = useCoState(Profile, me._refs.profile?.id, {});
@@ -36,10 +36,8 @@ export function ChatScreen({ navigation }: { navigation: any }) {
           <Button
             onPress={() => {
               if (loadedChat?.id) {
-                Clipboard.setString(
-                  `https://chat.jazz.tools/#/chat/${loadedChat.id}`,
-                );
-                Alert.alert("Copied to clipboard", `Chat ID: ${loadedChat.id}`);
+                Clipboard.setString(loadedChat.id);
+                console.log("Copied to clipboard", `Chat ID: ${loadedChat.id}`);
               }
             }}
             title="Share"
@@ -56,27 +54,11 @@ export function ChatScreen({ navigation }: { navigation: any }) {
   };
 
   const joinChat = () => {
-    Alert.prompt(
-      "Join Chat",
-      "Enter the Chat ID (example: co_zBGEHYvRfGuT2YSBraY3njGjnde)",
-      [
-        {
-          text: "Cancel",
-          style: "cancel",
-        },
-        {
-          text: "Join",
-          onPress: (chatId) => {
-            if (chatId) {
-              setChatId(chatId);
-            } else {
-              Alert.alert("Error", "Chat ID cannot be empty.");
-            }
-          },
-        },
-      ],
-      "plain-text",
-    );
+    if (chatIdInput) {
+      setChatId(chatIdInput as ID<Chat>);
+    } else {
+      console.warn("Error: Chat ID cannot be empty.");
+    }
   };
 
   const sendMessage = () => {
@@ -153,6 +135,16 @@ export function ChatScreen({ navigation }: { navigation: any }) {
           <TouchableOpacity onPress={createChat} style={styles.newChatButton}>
             <Text style={styles.buttonText}>Start new chat</Text>
           </TouchableOpacity>
+          <Text style={styles.usernameLabel}>Join existing chat</Text>
+          <TextInput
+            style={styles.chatIdInput}
+            placeholder="Chat ID"
+            value={chatIdInput ?? ""}
+            onChangeText={setChatIdInput}
+            textAlignVertical="center"
+            onSubmitEditing={joinChat}
+            testID="chat-id-input"
+          />
           <TouchableOpacity onPress={joinChat} style={styles.joinChatButton}>
             <Text style={styles.buttonText}>Join chat</Text>
           </TouchableOpacity>
@@ -205,27 +197,91 @@ export function ChatScreen({ navigation }: { navigation: any }) {
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    flexDirection: "column",
-    height: "100%",
+  },
+  welcomeContainer: {
+    flex: 1,
+    alignItems: "center",
+    justifyContent: "center",
+    padding: 16,
+  },
+  usernameLabel: {
+    fontSize: 16,
+    fontWeight: "bold",
+    marginBottom: 16,
+  },
+  usernameInput: {
+    width: 160,
+    height: 48,
+    borderWidth: 1,
+    borderColor: "#ddd",
+    borderRadius: 8,
+    paddingHorizontal: 8,
+    marginBottom: 24,
+  },
+  chatIdInput: {
+    width: 320,
+    height: 48,
+    borderWidth: 1,
+    borderColor: "#ddd",
+    borderRadius: 8,
+    paddingHorizontal: 8,
+    marginBottom: 24,
+    marginTop: 8,
+  },
+  newChatButton: {
+    backgroundColor: "#3B82F6",
+    padding: 16,
+    borderRadius: 8,
+    marginBottom: 24,
+  },
+  joinChatButton: {
+    backgroundColor: "#10B981",
+    padding: 16,
+    borderRadius: 8,
+  },
+  buttonText: {
+    color: "white",
+    fontSize: 16,
+    fontWeight: "bold",
+    textAlign: "center",
+  },
+  messageList: {
+    flex: 1,
+  },
+  inputContainer: {
+    padding: 12,
+  },
+  inputWrapper: {
+    flexDirection: "row",
+    alignItems: "center",
+    borderWidth: 1,
+    borderColor: "#ddd",
+    borderRadius: 8,
+    paddingHorizontal: 12,
+  },
+  messageInput: {
+    flex: 1,
+    height: 32,
+    paddingHorizontal: 8,
+  },
+  sendButton: {
+    paddingHorizontal: 16,
   },
   messageContainer: {
-    borderRadius: 8,
-    paddingVertical: 4,
-    paddingHorizontal: 6,
-    maxWidth: "80%",
+    flexDirection: "column",
+    alignItems: "flex-start",
+    marginBottom: 8,
   },
   myMessage: {
-    backgroundColor: "#e5e7eb", // gray-200
     alignSelf: "flex-end",
-    textAlign: "right",
   },
   otherMessage: {
-    backgroundColor: "#d1d5db", // gray-300
     alignSelf: "flex-start",
   },
   senderName: {
     fontSize: 12,
-    color: "#6b7280", // gray-500
+    color: "#666",
+    marginBottom: 4,
   },
   textRight: {
     textAlign: "right",
@@ -234,92 +290,27 @@ const styles = StyleSheet.create({
     textAlign: "left",
   },
   messageContent: {
-    position: "relative",
-    flexDirection: "row",
-    alignItems: "flex-end",
-    justifyContent: "space-between",
+    backgroundColor: "#f0f0f0",
+    borderRadius: 8,
+    padding: 8,
   },
   messageText: {
-    color: "#000000",
     fontSize: 16,
-    maxWidth: "85%",
   },
   timestamp: {
     fontSize: 10,
-    color: "#6b7280", // gray-500
-    textAlign: "right",
-    marginLeft: 8,
+    color: "#666",
+    marginTop: 4,
   },
   timestampOther: {
+    textAlign: "left",
     marginTop: 8,
   },
   timestampMy: {
+    textAlign: "right",
     marginTop: 4,
   },
-  welcomeContainer: {
-    flex: 1,
-    flexDirection: "column",
-    height: "100%",
-    alignItems: "center",
-    justifyContent: "center",
-  },
-  usernameLabel: {
-    fontSize: 16,
-    fontWeight: "bold",
-    marginBottom: 24,
-  },
-  usernameInput: {
-    borderRadius: 4,
-    height: 48,
-    padding: 8,
-    marginBottom: 48,
-    width: 160,
-    borderWidth: 1,
-    borderColor: "#e5e7eb", // gray-200
-  },
-  newChatButton: {
-    backgroundColor: "#3b82f6", // blue-500
-    padding: 16,
-    borderRadius: 6,
-  },
-  joinChatButton: {
-    backgroundColor: "#10b981", // green-500
-    padding: 16,
-    borderRadius: 6,
-    marginTop: 16,
-  },
-  buttonText: {
-    color: "white",
-    fontWeight: "600",
-  },
-  messageList: {
-    flex: 1,
-  },
-  inputContainer: {
-    paddingVertical: 16,
-    paddingHorizontal: 10,
-    backgroundColor: "white",
-    borderTopWidth: 1,
-    borderTopColor: "#d1d5db", // gray-300
-  },
-  inputWrapper: {
-    flex: 1,
-    flexDirection: "row",
-    alignItems: "center",
-    margin: 5,
-  },
-  messageInput: {
-    borderRadius: 20,
-    height: 32,
-    paddingVertical: 0,
-    paddingHorizontal: 8,
-    borderWidth: 1,
-    borderColor: "#e5e7eb", // gray-200
-    flex: 1,
-  },
-  sendButton: {
-    marginLeft: 10,
-    backgroundColor: "#d1d5db", // gray-300
+  avatar: {
     borderRadius: 16,
     height: 32,
     width: 32,

examples/chat-vue/CHANGELOG.md

@@ -1,5 +1,34 @@
 # chat-vue
 
+## 0.0.118
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-browser@0.14.20
+  - jazz-vue@0.14.20
+
+## 0.0.117
+
+### Patch Changes
+
+- jazz-browser@0.14.19
+- jazz-tools@0.14.19
+- jazz-vue@0.14.19
+
+## 0.0.116
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-browser@0.14.18
+  - jazz-vue@0.14.18
+
 ## 0.0.115
 
 ### Patch Changes

examples/chat-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chat-vue",
-  "version": "0.0.115",
+  "version": "0.0.118",
   "private": true,
   "type": "module",
   "scripts": {
@@ -32,7 +32,7 @@
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11",
+    "vite": "6.3.5",
     "vite-plugin-vue-devtools": "^7.4.6",
     "vue-tsc": "^2.1.6"
   }

examples/chat/CHANGELOG.md

@@ -1,5 +1,34 @@
 # jazz-example-chat
 
+## 0.0.218
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-inspector@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.217
+
+### Patch Changes
+
+- jazz-inspector@0.14.19
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.216
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-inspector@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.215
 
 ### Patch Changes

examples/chat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-chat",
   "private": true,
-  "version": "0.0.215",
+  "version": "0.0.218",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -27,12 +27,12 @@
     "@playwright/test": "^1.50.1",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react-swc": "^3.3.2",
+    "@vitejs/plugin-react-swc": "^3.10.1",
     "autoprefixer": "^10.4.20",
     "is-ci": "^3.0.1",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/clerk/CHANGELOG.md

@@ -1,5 +1,34 @@
 # minimal-auth-clerk
 
+## 0.0.117
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+  - jazz-react-auth-clerk@0.14.20
+
+## 0.0.116
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-react-auth-clerk@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.115
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+  - jazz-react-auth-clerk@0.14.18
+
 ## 0.0.114
 
 ### Patch Changes

examples/clerk/package.json

@@ -1,7 +1,7 @@
 {
   "name": "clerk",
   "private": true,
-  "version": "0.0.114",
+  "version": "0.0.117",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -25,9 +25,9 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/file-share-svelte/CHANGELOG.md

@@ -1,5 +1,34 @@
 # file-share-svelte
 
+## 0.0.102
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-inspector-element@0.14.20
+  - jazz-svelte@0.14.20
+
+## 0.0.101
+
+### Patch Changes
+
+- jazz-inspector-element@0.14.19
+- jazz-svelte@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.100
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-inspector-element@0.14.18
+  - jazz-svelte@0.14.18
+
 ## 0.0.99
 
 ### Patch Changes

examples/file-share-svelte/package.json

@@ -1,6 +1,6 @@
 {
   "name": "file-share-svelte",
-  "version": "0.0.99",
+  "version": "0.0.102",
   "private": true,
   "type": "module",
   "scripts": {
@@ -35,7 +35,7 @@
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
     "typescript-eslint": "^8.0.0",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   },
   "dependencies": {
     "@tailwindcss/typography": "^0.5.15",

examples/filestream/CHANGELOG.md

@@ -1,5 +1,34 @@
 # jazz-tailwind-demo-auth-starter
 
+## 0.0.57
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-inspector@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.56
+
+### Patch Changes
+
+- jazz-inspector@0.14.19
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.55
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-inspector@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.54
 
 ### Patch Changes

examples/filestream/package.json

@@ -1,7 +1,7 @@
 {
   "name": "filestream",
   "private": true,
-  "version": "0.0.54",
+  "version": "0.0.57",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -21,13 +21,13 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "autoprefixer": "^10.4.20",
     "globals": "^15.11.0",
     "is-ci": "^3.0.1",
     "postcss": "^8.5.3",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/form/CHANGELOG.md

@@ -1,5 +1,31 @@
 # form
 
+## 0.1.58
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.1.57
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.1.56
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.1.55
 
 ### Patch Changes

examples/form/package.json

@@ -1,7 +1,7 @@
 {
   "name": "form",
   "private": true,
-  "version": "0.1.55",
+  "version": "0.1.58",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -23,13 +23,13 @@
     "@tailwindcss/forms": "^0.5.9",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "autoprefixer": "^10.4.20",
     "globals": "^15.11.0",
     "is-ci": "^3.0.1",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/image-upload/CHANGELOG.md

@@ -1,5 +1,31 @@
 # image-upload
 
+## 0.0.114
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.113
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.112
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.111
 
 ### Patch Changes

examples/image-upload/package.json

@@ -1,7 +1,7 @@
 {
   "name": "image-upload",
   "private": true,
-  "version": "0.0.111",
+  "version": "0.0.114",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -20,10 +20,10 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11",
+    "vite": "6.3.5",
     "autoprefixer": "^10.4.20",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17"

examples/inspector/CHANGELOG.md

@@ -1,5 +1,30 @@
 # jazz-example-inspector
 
+## 0.0.167
+
+### Patch Changes
+
+- jazz-inspector@0.14.20
+- cojson@0.14.20
+- cojson-transport-ws@0.14.20
+
+## 0.0.166
+
+### Patch Changes
+
+- cojson@0.14.19
+- cojson-transport-ws@0.14.19
+- jazz-inspector@0.14.19
+
+## 0.0.165
+
+### Patch Changes
+
+- Updated dependencies [0d5ee3e]
+  - cojson@0.14.18
+  - jazz-inspector@0.14.18
+  - cojson-transport-ws@0.14.18
+
 ## 0.0.164
 
 ### Patch Changes

examples/inspector/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-inspector-app",
   "private": true,
-  "version": "0.0.164",
+  "version": "0.0.167",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -26,11 +26,11 @@
   "devDependencies": {
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react-swc": "^3.3.2",
+    "@vitejs/plugin-react-swc": "^3.10.1",
     "autoprefixer": "^10.4.20",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/jazz-nextjs/CHANGELOG.md

@@ -1,5 +1,31 @@
 # jazz-nextjs
 
+## 0.1.7
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.1.6
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.1.5
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.1.4
 
 ### Patch Changes

examples/jazz-nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jazz-nextjs",
-  "version": "0.1.4",
+  "version": "0.1.7",
   "private": true,
   "scripts": {
     "dev": "next dev --turbopack",

examples/jazz-paper-scissors/package.json

@@ -41,6 +41,6 @@
     "npm-run-all": "^4.1.5",
     "tsx": "^4.19.3",
     "typescript": "~5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/multi-cursors/CHANGELOG.md

@@ -1,5 +1,31 @@
 # multi-cursors
 
+## 0.0.110
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.109
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.108
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.107
 
 ### Patch Changes

examples/multi-cursors/package.json

@@ -1,7 +1,7 @@
 {
   "name": "multi-cursors",
   "private": true,
-  "version": "0.0.107",
+  "version": "0.0.110",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -23,14 +23,14 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "autoprefixer": "^10.4.20",
     "globals": "^15.11.0",
     "is-ci": "^3.0.1",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11",
+    "vite": "6.3.5",
     "vitest": "3.1.1"
   }
 }

examples/multiauth/CHANGELOG.md

@@ -1,5 +1,34 @@
 # multiauth
 
+## 0.0.58
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+  - jazz-react-auth-clerk@0.14.20
+
+## 0.0.57
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-react-auth-clerk@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.56
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+  - jazz-react-auth-clerk@0.14.18
+
 ## 0.0.55
 
 ### Patch Changes

examples/multiauth/package.json

@@ -1,7 +1,7 @@
 {
   "name": "multiauth",
   "private": true,
-  "version": "0.0.55",
+  "version": "0.0.58",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -22,9 +22,9 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/music-player/CHANGELOG.md

@@ -1,5 +1,34 @@
 # jazz-example-musicplayer
 
+## 0.0.139
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-inspector@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.138
+
+### Patch Changes
+
+- jazz-inspector@0.14.19
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.137
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-inspector@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.136
 
 ### Patch Changes

examples/music-player/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-music-player",
   "private": true,
-  "version": "0.0.136",
+  "version": "0.0.139",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -37,11 +37,11 @@
     "@playwright/test": "^1.50.1",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react-swc": "^3.3.2",
+    "@vitejs/plugin-react-swc": "^3.10.1",
     "autoprefixer": "^10.4.20",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/music-player/src/1_schema.ts

@@ -41,8 +41,8 @@ export const MusicTrack = co.map({
   /**
    * You can use getters for recusrive relations
    */
-  get sourceTrack(): z.ZodOptional<typeof MusicTrack> {
-    return z.optional(MusicTrack);
+  get sourceTrack() {
+    return MusicTrack.optional();
   },
 });
 export type MusicTrack = co.loaded<typeof MusicTrack>;

examples/music-player/src/2_main.tsx

@@ -14,6 +14,7 @@ import { apiKey } from "@/apiKey.ts";
 import { SidebarProvider } from "@/components/ui/sidebar";
 import { JazzProvider } from "jazz-react";
 import { onAnonymousAccountDiscarded } from "./4_actions";
+import { KeyboardListener } from "./components/PlayerControls";
 import { useUploadExampleData } from "./lib/useUploadExampleData";
 
 /**
@@ -50,7 +51,7 @@ function Main() {
   return (
     <>
       <RouterProvider router={router} />
-      {/* <PlayerControls mediaPlayer={mediaPlayer} /> */}
+      <KeyboardListener mediaPlayer={mediaPlayer} />
       <Toaster />
     </>
   );

examples/music-player/src/3_HomePage.tsx

@@ -67,7 +67,7 @@ export function HomePage({ mediaPlayer }: { mediaPlayer: MediaPlayer }) {
     <SidebarInset className="flex flex-col h-screen text-gray-800 bg-blue-50">
       <div className="flex flex-1 overflow-hidden">
         <SidePanel mediaPlayer={mediaPlayer} />
-        <main className="flex-1 p-6 overflow-y-auto">
+        <main className="flex-1 p-6 overflow-y-auto overflow-x-hidden">
           <SidebarTrigger />
           <div className="flex items-center justify-between mb-6">
             {isRootPlaylist ? (
@@ -90,7 +90,7 @@ export function HomePage({ mediaPlayer }: { mediaPlayer: MediaPlayer }) {
               )}
             </div>
           </div>
-          <ul className="flex flex-col">
+          <ul className="flex flex-col max-w-full">
             {playlist?.tracks?.map(
               (track) =>
                 track && (

examples/music-player/src/components/MusicTrackRow.tsx

@@ -62,9 +62,7 @@ export function MusicTrackRow({
 
   return (
     <li
-      className={
-        "flex gap-1  hover:bg-slate-200 group py-2 px-2 cursor-pointer"
-      }
+      className={"flex gap-1 hover:bg-slate-200 group py-2 px-2 cursor-pointer"}
       onClick={handleTrackClick}
     >
       <button

examples/music-player/src/components/MusicTrackTitleInput.tsx

@@ -31,7 +31,7 @@ export function MusicTrackTitleInput({
 
   return (
     <div
-      className="relative flex-grow"
+      className="relative flex-grow max-w-64"
       onClick={(evt) => evt.stopPropagation()}
     >
       <input

examples/music-player/src/components/PlayerControls.tsx

@@ -15,13 +15,6 @@ export function PlayerControls({ mediaPlayer }: { mediaPlayer: MediaPlayer }) {
     resolve: { root: { activePlaylist: true } },
   }).me?.root.activePlaylist;
 
-  useMediaEndListener(mediaPlayer.playNextTrack);
-  useKeyboardListener("Space", () => {
-    if (document.activeElement !== document.body) return;
-
-    playState.toggle();
-  });
-
   const activeTrack = useCoState(MusicTrack, mediaPlayer.activeTrackId, {
     resolve: { waveform: true },
   });
@@ -73,3 +66,18 @@ export function PlayerControls({ mediaPlayer }: { mediaPlayer: MediaPlayer }) {
     </footer>
   );
 }
+
+export function KeyboardListener({
+  mediaPlayer,
+}: { mediaPlayer: MediaPlayer }) {
+  const playState = usePlayState();
+
+  useMediaEndListener(mediaPlayer.playNextTrack);
+  useKeyboardListener("Space", () => {
+    if (document.activeElement !== document.body) return;
+
+    playState.toggle();
+  });
+
+  return null;
+}

examples/organization/CHANGELOG.md

@@ -1,5 +1,31 @@
 # organization
 
+## 0.0.110
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.109
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.108
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.107
 
 ### Patch Changes

examples/organization/package.json

@@ -1,7 +1,7 @@
 {
   "name": "organization",
   "private": true,
-  "version": "0.0.107",
+  "version": "0.0.110",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -27,12 +27,12 @@
     "@tailwindcss/forms": "^0.5.9",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "autoprefixer": "^10.4.20",
     "globals": "^15.11.0",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/passkey-svelte/CHANGELOG.md

@@ -1,5 +1,31 @@
 # passkey-svelte
 
+## 0.0.104
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-svelte@0.14.20
+
+## 0.0.103
+
+### Patch Changes
+
+- jazz-svelte@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.102
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-svelte@0.14.18
+
 ## 0.0.101
 
 ### Patch Changes

examples/passkey-svelte/package.json

@@ -1,6 +1,6 @@
 {
   "name": "passkey-svelte",
-  "version": "0.0.101",
+  "version": "0.0.104",
   "type": "module",
   "private": true,
   "scripts": {
@@ -29,7 +29,7 @@
     "svelte-check": "^4.0.0",
     "typescript": "5.6.2",
     "typescript-eslint": "^8.0.0",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   },
   "dependencies": {
     "jazz-svelte": "workspace:*",

examples/passkey/CHANGELOG.md

@@ -1,5 +1,31 @@
 # minimal-auth-passkey
 
+## 0.0.115
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.114
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.113
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.112
 
 ### Patch Changes

examples/passkey/package.json

@@ -1,7 +1,7 @@
 {
   "name": "passkey",
   "private": true,
-  "version": "0.0.112",
+  "version": "0.0.115",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -20,9 +20,9 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/passphrase/CHANGELOG.md

@@ -1,5 +1,31 @@
 # passphrase
 
+## 0.0.112
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.111
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.110
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.109
 
 ### Patch Changes

examples/passphrase/package.json

@@ -1,7 +1,7 @@
 {
   "name": "passphrase",
   "private": true,
-  "version": "0.0.109",
+  "version": "0.0.112",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -20,9 +20,9 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/password-manager/CHANGELOG.md

@@ -1,5 +1,31 @@
 # jazz-password-manager
 
+## 0.0.136
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.135
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.134
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.133
 
 ### Patch Changes

examples/password-manager/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-password-manager",
   "private": true,
-  "version": "0.0.133",
+  "version": "0.0.136",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -22,12 +22,12 @@
   "devDependencies": {
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
-    "@vitejs/plugin-react-swc": "^3.3.2",
+    "@vitejs/plugin-react": "^4.5.1",
+    "@vitejs/plugin-react-swc": "^3.10.1",
     "autoprefixer": "^10.4.20",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/pets/CHANGELOG.md

@@ -1,5 +1,31 @@
 # jazz-example-pets
 
+## 0.0.234
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.233
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.232
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.231
 
 ### Patch Changes

examples/pets/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-pets",
   "private": true,
-  "version": "0.0.231",
+  "version": "0.0.234",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -37,14 +37,14 @@
     "@types/qrcode": "^1.5.1",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react-swc": "^3.3.2",
+    "@vitejs/plugin-react-swc": "^3.10.1",
     "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",
+    "vite": "6.3.5",
     "vite-plugin-top-level-await": "^1.4.4"
   }
 }

examples/reactions/CHANGELOG.md

@@ -1,5 +1,31 @@
 # reactions
 
+## 0.0.114
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.113
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.112
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.111
 
 ### Patch Changes

examples/reactions/package.json

@@ -1,7 +1,7 @@
 {
   "name": "reactions",
   "private": true,
-  "version": "0.0.111",
+  "version": "0.0.114",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -21,9 +21,9 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/richtext-tiptap/CHANGELOG.md

@@ -1,5 +1,34 @@
 # richtext-tiptap
 
+## 0.1.27
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+  - jazz-richtext-tiptap@0.14.20
+
+## 0.1.26
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-richtext-tiptap@0.14.19
+- jazz-tools@0.14.19
+
+## 0.1.25
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+  - jazz-richtext-tiptap@0.14.18
+
 ## 0.1.24
 
 ### Patch Changes

examples/richtext-tiptap/package.json

@@ -1,7 +1,7 @@
 {
   "name": "richtext-tiptap",
   "private": true,
-  "version": "0.1.24",
+  "version": "0.1.27",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -33,13 +33,13 @@
     "@playwright/test": "^1.50.1",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "autoprefixer": "^10.4.20",
     "globals": "^15.11.0",
     "is-ci": "^3.0.1",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/richtext/CHANGELOG.md

@@ -1,5 +1,34 @@
 # richtext
 
+## 0.0.104
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+  - jazz-richtext-prosemirror@0.14.20
+
+## 0.0.103
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-richtext-prosemirror@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.102
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+  - jazz-richtext-prosemirror@0.14.18
+
 ## 0.0.101
 
 ### Patch Changes

examples/richtext/package.json

@@ -1,7 +1,7 @@
 {
   "name": "richtext",
   "private": true,
-  "version": "0.0.101",
+  "version": "0.0.104",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -30,13 +30,13 @@
     "@playwright/test": "^1.50.1",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "autoprefixer": "^10.4.20",
     "globals": "^15.11.0",
     "is-ci": "^3.0.1",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/todo-vue/CHANGELOG.md

@@ -1,5 +1,34 @@
 # todo-vue
 
+## 0.0.116
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-browser@0.14.20
+  - jazz-vue@0.14.20
+
+## 0.0.115
+
+### Patch Changes
+
+- jazz-browser@0.14.19
+- jazz-tools@0.14.19
+- jazz-vue@0.14.19
+
+## 0.0.114
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-browser@0.14.18
+  - jazz-vue@0.14.18
+
 ## 0.0.113
 
 ### Patch Changes

examples/todo-vue/package.json

@@ -1,6 +1,6 @@
 {
   "name": "todo-vue",
-  "version": "0.0.113",
+  "version": "0.0.116",
   "private": true,
   "type": "module",
   "scripts": {
@@ -32,7 +32,7 @@
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11",
+    "vite": "6.3.5",
     "vite-plugin-vue-devtools": "^7.4.6",
     "vue-tsc": "^2.1.6"
   }

examples/todo/CHANGELOG.md

@@ -1,5 +1,31 @@
 # jazz-example-todo
 
+## 0.0.233
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.232
+
+### Patch Changes
+
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.231
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.230
 
 ### Patch Changes

examples/todo/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-todo",
   "private": true,
-  "version": "0.0.230",
+  "version": "0.0.233",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -33,11 +33,11 @@
     "@types/qrcode": "^1.5.1",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react-swc": "^3.3.2",
+    "@vitejs/plugin-react-swc": "^3.10.1",
     "autoprefixer": "^10.4.20",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.17",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/todo/src/1_schema.ts

@@ -1,4 +1,4 @@
-import { co, z } from "jazz-tools";
+import { CoPlainText, co, z } from "jazz-tools";
 
 /** Walkthrough: Defining the data model with CoJSON
  *
@@ -11,9 +11,30 @@ import { co, z } from "jazz-tools";
  **/
 
 /** An individual task which collaborators can tick or rename */
-export const Task = co.map({
+export const Task = co
+  .map({
+    done: z.boolean(),
+    text: co.plainText(),
+    version: z.literal(1),
+  })
+  .withMigration((task) => {
+    if (!task.version) {
+      // Cast to the v1 version
+      const task_v1 = task.castAs(Task_V1);
+
+      // Check if the task text field is a string or an id
+      // if it's a string migrate to plaintext
+      // We need to do this check because some tasks with plainText have been created before we added the version field
+      if (!task_v1.text.startsWith("co_z")) {
+        task.text = CoPlainText.create(task_v1.text, task._owner);
+      }
+      task.version = 1;
+    }
+  });
+
+const Task_V1 = co.map({
   done: z.boolean(),
-  text: co.plainText(),
+  text: z.string(),
 });
 
 /** Our top level object: a project with a title, referencing a list of tasks */

examples/todo/src/4_ProjectTodoTable.tsx

@@ -51,6 +51,7 @@ export function ProjectTodoTable() {
         {
           done: false,
           text: CoPlainText.create(text, project._owner),
+          version: 1,
         },
         project._owner,
       );

examples/todo/src/generate.ts

@@ -19,6 +19,7 @@ export function generateRandomProject(
         faker.lorem.sentence({ min: 3, max: 8 }),
         tasks._owner,
       ),
+      version: 1,
     });
     tasks.push(task);
   }

examples/version-history/CHANGELOG.md

@@ -1,5 +1,34 @@
 # version-history
 
+## 0.0.112
+
+### Patch Changes
+
+- Updated dependencies [6f72419]
+- Updated dependencies [04b20c2]
+  - jazz-tools@0.14.20
+  - jazz-inspector@0.14.20
+  - jazz-react@0.14.20
+
+## 0.0.111
+
+### Patch Changes
+
+- jazz-inspector@0.14.19
+- jazz-react@0.14.19
+- jazz-tools@0.14.19
+
+## 0.0.110
+
+### Patch Changes
+
+- Updated dependencies [4b950bc]
+- Updated dependencies [d6d9c0a]
+- Updated dependencies [c559054]
+  - jazz-tools@0.14.18
+  - jazz-inspector@0.14.18
+  - jazz-react@0.14.18
+
 ## 0.0.109
 
 ### Patch Changes

examples/version-history/package.json

@@ -1,7 +1,7 @@
 {
   "name": "version-history",
   "private": true,
-  "version": "0.0.109",
+  "version": "0.0.112",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -23,9 +23,9 @@
     "@biomejs/biome": "1.9.4",
     "@types/react": "19.0.0",
     "@types/react-dom": "19.0.0",
-    "@vitejs/plugin-react": "^4.3.3",
+    "@vitejs/plugin-react": "^4.5.1",
     "globals": "^15.11.0",
     "typescript": "5.6.2",
-    "vite": "6.0.11"
+    "vite": "6.3.5"
   }
 }

examples/version-history/src/App.tsx

@@ -27,6 +27,7 @@ function App() {
         ),
         estimate: 5,
         status: "backlog",
+        createdAt: new Date(),
       },
       group,
     );

examples/version-history/src/IssueVersionHistory.tsx

@@ -74,6 +74,8 @@ export function IssueVersionHistory({ id }: { id: string }) {
     ].sort((a, b) => (a.madeAt < b.madeAt ? -1 : a.madeAt > b.madeAt ? 1 : 0));
   }, [issue?._edits]);
 
+  if (!issue) return;
+
   return (
     <>
       <div className="flex flex-col text-sm gap-2">
@@ -98,6 +100,12 @@ export function IssueVersionHistory({ id }: { id: string }) {
       <hr />
 
       <DescriptionVersionHistory id={id} />
+
+      <hr />
+
+      <div>
+        <p>This issue was created at {issue.createdAt.toLocaleString()}</p>
+      </div>
     </>
   );
 }

examples/version-history/src/Project.tsx

@@ -22,6 +22,7 @@ export function ProjectComponent({ projectID }: { projectID: string }) {
           description: CoPlainText.create("", project._owner),
           estimate: 0,
           status: "backlog",
+          createdAt: new Date(),
         },
         project._owner,
       ),

examples/version-history/src/schema.ts

@@ -10,6 +10,7 @@ export const Issue = co.map({
   description: co.plainText(),
   estimate: z.number(),
   status: z.literal(["backlog", "in progress", "done"]),
+  createdAt: z.date(),
 });
 
 export const Project = co.map({

homepage/gcmp/.gitignore

@@ -34,5 +34,4 @@ yarn-error.log*
 *.tsbuildinfo
 next-env.d.ts
 
-typedoc
 codeSamples

homepage/gcmp/app/team/members.ts

@@ -72,7 +72,7 @@ export const team: Array<TeamMember> = [
   {
     name: "Emil Sayahi",
     titles: ["Full-Stack Dev", "Support Dev"],
-    location: "Oxford, Ohio, US",
+    location: "San Francisco, California, US",
     github: "emmyoh",
     linkedin: "emil-sayahi",
     bluesky: "sayahi.bsky.social",

homepage/gcmp/package.json

@@ -44,7 +44,6 @@
     "autoprefixer": "^10",
     "postcss": "^8",
     "tailwindcss": "^3",
-    "typedoc": "^0.25.13",
     "typescript": "^5.3.3"
   }
 }

homepage/homepage/.gitignore

@@ -34,7 +34,6 @@ yarn-error.log*
 *.tsbuildinfo
 next-env.d.ts
 
-typedoc
 codeSamples
 # Turborepo
 .turbo

homepage/homepage/app/(docs)/api-reference/[package]/page.tsx

@@ -1,29 +0,0 @@
-import { PackageDocs } from "@/components/docs/packageDocs";
-import { packages } from "@/content/packages";
-import { notFound } from "next/navigation";
-
-interface Props {
-  params: Promise<{ package: string }>;
-}
-
-export default async function Page({ params }: Props) {
-  const packageName = (await params).package;
-  if (!packages.map((p) => p.name).includes(packageName)) {
-    return notFound();
-  }
-
-  return <PackageDocs package={packageName} />;
-}
-
-export async function generateMetadata({ params }: Props) {
-  const packageName = (await params).package;
-  return {
-    title: `${packageName} - jazz`,
-    description: `API reference for ${packageName}.`,
-  };
-}
-
-export async function generateStaticParams() {
-  // TODO: ideally we check which files exist in ../../typedoc
-  return packages.map((pkg) => ({ package: pkg.name }));
-}

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

@@ -1,37 +0,0 @@
-import { SideNavLayout } from "@/components/SideNavLayout";
-import { ApiNav } from "@/components/docs/ApiNav";
-import { JazzMobileNav } from "@/components/nav";
-import { Prose } from "@garden-co/design-system/src/components/molecules/Prose";
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <SideNavLayout
-      sideNav={<ApiNav />}
-      floatingNavSections={[
-        {
-          name: "API Ref",
-          content: <ApiNav />,
-          icon: "package",
-        },
-      ]}
-    >
-      <Prose className="overflow-x-hidden lg:flex-1 pb-10 pt-[calc(61px+2.5rem)] md:pt-10">
-        {children}
-      </Prose>
-
-      <JazzMobileNav
-        sections={[
-          {
-            name: "API Ref",
-            content: <ApiNav />,
-            icon: "package",
-          },
-        ]}
-      />
-    </SideNavLayout>
-  );
-}

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

@@ -1,107 +0,0 @@
-import { packages } from "@/content/packages";
-import { Icon } from "@garden-co/design-system/src/components/atoms/Icon";
-import { clsx } from "clsx";
-import type { Metadata } from "next";
-import Link from "next/link";
-
-export const metadata: Metadata = {
-  title: "API reference",
-  openGraph: {
-    title: "API reference",
-  },
-};
-
-const CardHeading = ({
-  children,
-  className,
-}: {
-  children: React.ReactNode;
-  className?: string;
-}) => {
-  return (
-    <h2
-      className={clsx(
-        className,
-        "font-medium text-stone-950 dark:text-white text-lg transition-colors",
-      )}
-    >
-      {children}
-    </h2>
-  );
-};
-
-const CardBody = ({
-  children,
-  className,
-}: {
-  children: React.ReactNode;
-  className?: string;
-}) => {
-  return <p className={clsx(className, "text-sm")}>{children}</p>;
-};
-
-const Card = ({
-  children,
-  className,
-}: {
-  children: React.ReactNode;
-  className?: string;
-}) => {
-  return (
-    <div
-      className={clsx(
-        className,
-        "not-prose p-4 h-full rounded-xl flex flex-col gap-1.5 group lg:p-5",
-      )}
-    >
-      {children}
-    </div>
-  );
-};
-
-export default function Page() {
-  return (
-    <>
-      <h1>API Reference</h1>
-
-      <div className="grid sm:grid-cols-2 lg:grid-cols-3 gap-4">
-        {packages.map(({ name, description }) => (
-          <Link
-            className="not-prose block"
-            href={`/api-reference/${name}`}
-            key={name}
-          >
-            <Card className="border shadow-sm">
-              <Icon name="package" className="text-stone-500" />
-              <CardHeading className="group-hover:text-primary dark:group-hover:text-blue-600">
-                {name}
-              </CardHeading>
-              <CardBody>{description}</CardBody>
-            </Card>
-          </Link>
-        ))}
-
-        <Card className="bg-stone-50 dark:bg-stone-925">
-          <Icon name="help" size="md" className="text-stone-500 " />
-          <CardHeading>
-            Can&apos;t find what you&apos;re looking for?
-          </CardHeading>
-          <CardBody>
-            Get help from our{" "}
-            <Link href="https://discord.gg/utDMjHYg42" className="underline">
-              Discord
-            </Link>
-            , or open an issue on{" "}
-            <Link
-              href="https://github.com/garden-co/jazz"
-              className="underline"
-            >
-              GitHub
-            </Link>
-            .
-          </CardBody>
-        </Card>
-      </div>
-    </>
-  );
-}

homepage/homepage/app/(others)/(home)/page.tsx

@@ -17,6 +17,7 @@ export default function Home() {
       <HeroSection />
 
       <div className="container flex flex-col gap-12 mt-12 lg:gap-20 lg:mt-20">
+        <SupportedEnvironmentsSection />
         <HowJazzWorksSection />
 
         <Testimonial name="Spreadsheet app (stealth)" role="CTO">
@@ -51,8 +52,6 @@ export default function Home() {
 
         <FeaturesSection />
 
-        <SupportedEnvironmentsSection />
-
         <ComingSoonSection />
 
         <EarlyAdopterSection />

homepage/homepage/app/layout.tsx

@@ -3,7 +3,7 @@ import { ThemeProvider } from "@/components/ThemeProvider";
 import { JazzFooter } from "@/components/footer";
 import { marketingCopy } from "@/content/marketingCopy";
 import { fontClasses } from "@garden-co/design-system/src/fonts";
-import { Analytics } from "@vercel/analytics/react";
+import { Analytics } from "@vercel/analytics/next";
 import { SpeedInsights } from "@vercel/speed-insights/next";
 import type { Metadata } from "next";
 

homepage/homepage/components/docs/ApiNav.tsx

@@ -1,78 +0,0 @@
-import { SideNav, SideNavBody, SideNavHeader } from "@/components/SideNav";
-import { SideNavItem } from "@/components/SideNavItem";
-import { packages } from "@/content/packages";
-import { Icon } from "@garden-co/design-system/src/components/atoms/Icon";
-import Link from "next/link";
-import { requestProject } from "./requestProject";
-
-export function ApiNav({ className }: { className?: string }) {
-  return (
-    <SideNav className={className}>
-      <SideNavBody>
-        <SideNavHeader className="mb-5" href="/api-reference">
-          API Reference
-        </SideNavHeader>
-        <ul className="space-y-5">
-          {packages.map(({ name }) => (
-            <li key={name}>
-              <PackageNavItem package={name} />
-            </li>
-          ))}
-        </ul>
-      </SideNavBody>
-    </SideNav>
-  );
-}
-
-export async function PackageNavItem({
-  package: packageName,
-}: {
-  package: string;
-}) {
-  let project = await requestProject(packageName as any);
-
-  return (
-    <>
-      <SideNavItem
-        className="mb-1 flex gap-2 items-center"
-        href={`/api-reference/${packageName}`}
-      >
-        <Icon name="package" size="xs" />
-        {packageName}
-      </SideNavItem>
-      {project.categories?.map((category) => {
-        return (
-          <details
-            key={category.title}
-            open={category.title !== "Other"}
-            className="group ml-1.5 border-l"
-          >
-            <summary className="pl-[13px] py-1 cursor-pointer flex gap-2 items-center justify-between hover:text-stone-800 dark:hover:text-stone-200 [&::-webkit-details-marker]:hidden">
-              {category.title}
-
-              <Icon
-                name="chevronRight"
-                size="sm"
-                className="text-stone-300 group-open:rotate-90 transition-transform dark:text-stone-800"
-              />
-            </summary>
-            <div className="pl-6">
-              {category.children.map(
-                (child, i, children) =>
-                  (i == 0 || child.name !== children[i - 1]!.name) && (
-                    <Link
-                      key={child.id}
-                      className="block py-0.5 text-ellipsis overflow-hidden font-mono hover:text-stone-800 dark:hover:text-stone-200"
-                      href={`/api-reference/${packageName}#${child.name}`}
-                    >
-                      {child.name}
-                    </Link>
-                  ),
-              )}
-            </div>
-          </details>
-        );
-      })}
-    </>
-  );
-}

homepage/homepage/components/docs/packageDocs.tsx

@@ -1,425 +0,0 @@
-import { Icon } from "@garden-co/design-system/src/components/atoms/Icon";
-import { Fragment } from "react";
-import {
-  CommentDisplayPart,
-  DeclarationReflection,
-  ReflectionKind,
-  SignatureReflection,
-  SomeType,
-  TypeContext,
-  TypeParameterReflection,
-} from "typedoc";
-import { requestProject } from "./requestProject";
-import {
-  ClassOrInterface,
-  DocComment,
-  FnDecl,
-  Highlight,
-  PropCategory,
-  PropDecl,
-} from "./tags";
-
-export async function PackageDocs({
-  package: packageName,
-}: {
-  package: string;
-}) {
-  let project = await requestProject(packageName as any);
-
-  // console.dir(project, {depth: 10});
-
-  return (
-    <>
-      <h2 className="flex items-center gap-2">
-        <code>{packageName}</code> <Icon name="package" size="md" />
-      </h2>
-      {project.categories?.map((category) => {
-        return (
-          <section key={category.title}>
-            <h2>{category.title}</h2>
-            {category.children.map(
-              (child) =>
-                // Ability to link external documents has been added. Turning it off for now
-                // https://typedoc.org/documents/External_Documents.html
-                child.variant !== "document" && (
-                  <RenderPackageChild
-                    child={child}
-                    key={child.id}
-                    inPackage={packageName}
-                  />
-                ),
-            )}
-          </section>
-        );
-      })}
-    </>
-  );
-}
-
-function RenderPackageChild({
-  child,
-  inPackage,
-}: {
-  child: DeclarationReflection;
-  inPackage: string;
-}) {
-  if (
-    child.kind === ReflectionKind.Class ||
-    child.kind === ReflectionKind.Interface
-  ) {
-    return (
-      <RenderClassOrInterface classOrInterface={child} inPackage={inPackage} />
-    );
-  } else if (child.kind === ReflectionKind.TypeAlias) {
-    return <RenderTypeAlias inPackage={inPackage} child={child} />;
-  } else if (child.kind === ReflectionKind.Function) {
-    return child.getAllSignatures().map((signature, i) => {
-      const paramTypes = printParamsWithTypes(signature);
-      return (
-        <div
-          key={i}
-          id={child.name}
-          className="not-prose mt-4 p-3 rounded bg-stone-50 dark:bg-stone-925"
-        >
-          {
-            <Highlight hide={[0, 2]}>
-              {`function \n${printSimpleSignature(child, signature) + ":"}\n {}`}
-            </Highlight>
-          }{" "}
-          <span className="opacity-75 text-xs pl-1">
-            <Highlight>{printType(signature.type)}</Highlight>
-          </span>
-          <div className="ml-4 mt-0 text-xs opacity-75 flex">
-            {paramTypes.length > 0 && (
-              <div>
-                <Highlight
-                  hide={[0, 1 + paramTypes.length]}
-                >{`function fn(...args: [\n${paramTypes.join(
-                  ",\n",
-                )}\n]) {}`}</Highlight>
-              </div>
-            )}
-          </div>
-        </div>
-      );
-    });
-  } else {
-    return (
-      <h3 id={child.name}>
-        {child.name} {child.type?.type}
-      </h3>
-    );
-  }
-}
-
-function RenderTypeAlias({
-  inPackage,
-  child,
-}: {
-  inPackage: string;
-  child: DeclarationReflection;
-}) {
-  const typeParameters = child.typeParameters?.map(
-    (tParam) =>
-      tParam.name + (tParam.type ? ` extends ${printType(tParam.type)}` : ""),
-  );
-  return (
-    <div className="mt-4">
-      <h3 className="not-prose" id={child.name}>
-        <Highlight>{`type ${child.name}`}</Highlight>
-      </h3>
-      <p className="not-prose text-sm ml-4">
-        <Highlight>{`type ${child.name}${typeParameters?.length && `<${typeParameters?.join(", ")}>`} = ${printType(
-          child.type,
-        )}`}</Highlight>
-      </p>
-      <div className="ml-4 mt-2 flex-[3]">
-        <DocComment>
-          {child.comment
-            ? renderSummary(child.comment.summary)
-            : "⚠️ undocumented"}
-        </DocComment>
-      </div>
-    </div>
-  );
-}
-
-function RenderClassOrInterface({
-  inPackage,
-  classOrInterface: classOrInterface,
-}: {
-  inPackage: string;
-  classOrInterface: DeclarationReflection;
-}) {
-  const commentSummary = classOrInterface.comment?.summary;
-  const typeParamsWithConstraints = printTypeParamsWithConstraints(
-    classOrInterface.typeParameters,
-  );
-  return (
-    <ClassOrInterface
-      inPackage={inPackage}
-      name={classOrInterface.name}
-      doc={renderSummary(commentSummary)}
-      isInterface={classOrInterface.kind === ReflectionKind.Interface}
-      typeParameters={
-        classOrInterface.typeParameters?.length
-          ? "<" +
-            classOrInterface.typeParameters
-              .map((tParam) => tParam.name)
-              .join(", ") +
-            ">"
-          : ""
-      }
-    >
-      {typeParamsWithConstraints.length > 0 && (
-        <div className="text-sm -mt-4">
-          <Highlight
-            hide={[0, 1 + typeParamsWithConstraints.length]}
-          >{`class Thing<\n${typeParamsWithConstraints.join(
-            ",\n",
-          )}\n]> {}`}</Highlight>
-        </div>
-      )}
-      {classOrInterface.categories?.map((category) => (
-        <div className="flex flex-col mt-6 first:mt-0" key={category.title}>
-          <PropCategory
-            name={category.title}
-            description={renderSummary(
-              category.description?.filter(
-                (p) => p.kind !== "code" || !p.text.startsWith("```"),
-              ),
-            )}
-            example={renderSummary(
-              category.description?.filter(
-                (p) => p.kind === "code" && p.text.startsWith("```"),
-              ),
-            )}
-          />
-          {category.children.map(
-            (prop) =>
-              prop.variant !== "document" && (
-                <RenderProp
-                  prop={prop}
-                  klass={classOrInterface}
-                  key={prop.id}
-                />
-              ),
-          )}
-        </div>
-      ))}
-    </ClassOrInterface>
-  );
-}
-
-function renderSummary(commentSummary: CommentDisplayPart[] | undefined) {
-  return commentSummary?.map((part, idx) =>
-    part.kind === "text" ? (
-      <span key={idx}>
-        {part.text.split("\n").map((line, i, lines) => (
-          <Fragment key={i}>
-            {line}
-            {i !== lines.length - 1 && <br />}
-          </Fragment>
-        ))}
-      </span>
-    ) : part.kind === "inline-tag" ? (
-      <code key={idx}>
-        {part.tag} {part.text}
-      </code>
-    ) : part.text.startsWith("```") ? (
-      <pre key={idx} className="text-xs sm:text-sm">
-        <Highlight>{part.text.split("\n").slice(1, -1).join("\n")}</Highlight>
-      </pre>
-    ) : (
-      <Highlight className="whitespace-nowrap" key={idx}>
-        {part.text.slice(1, -1)}
-      </Highlight>
-    ),
-  );
-}
-
-function RenderProp({
-  prop,
-  klass,
-}: {
-  prop: DeclarationReflection;
-  klass: DeclarationReflection;
-}) {
-  const propOrGetSig = prop.getSignature ? prop.getSignature : prop;
-  return prop.kind & ReflectionKind.FunctionOrMethod ? (
-    prop
-      .getAllSignatures()
-      .map((signature) => (
-        <FnDecl
-          key={signature.id}
-          signature={printSimplePropSignature(prop, klass, signature)}
-          typeParams={printTypeParamsWithConstraints(signature.typeParameters)}
-          paramTypes={printParamsWithTypes(signature)}
-          returnType={printType(signature.type)}
-          doc={renderSummary(signature.comment?.summary)}
-          example={renderSummary(
-            signature.comment?.getTag("@example")?.content,
-          )}
-        />
-      ))
-  ) : (
-    <PropDecl
-      name={
-        (prop.flags.isStatic ? klass.name : "") +
-        (prop.name.startsWith("[") ? "" : ".") +
-        prop.name
-      }
-      type={printType(propOrGetSig.type)}
-      doc={propOrGetSig.comment && renderSummary(propOrGetSig.comment.summary)}
-      example={renderSummary(propOrGetSig.comment?.getTag("@example")?.content)}
-    />
-  );
-}
-
-function printSimplePropSignature(
-  prop: DeclarationReflection,
-  klass: DeclarationReflection,
-  signature: SignatureReflection,
-): string {
-  return (
-    `${prop.flags.isStatic ? klass.name : ""}.` +
-    printSimpleSignature(prop, signature)
-  );
-}
-
-function printSimpleSignature(
-  item: DeclarationReflection,
-  signature: SignatureReflection,
-) {
-  return `${item.name}${
-    signature.typeParameters?.length
-      ? "<" +
-        signature.typeParameters.map((tParam) => tParam.name).join(", ") +
-        ">"
-      : ""
-  }(${printParams(signature)?.join(", ")})`;
-}
-
-function printParams(signature: SignatureReflection) {
-  return (
-    signature.parameters?.flatMap((param) =>
-      param.name === "this"
-        ? []
-        : [
-            param.name === "__namedParameters" &&
-            param.type?.type === "reflection"
-              ? "{ " +
-                param.type.declaration.children
-                  ?.map(
-                    (child) => child.name + (child.flags.isOptional ? "?" : ""),
-                  )
-                  .join(", ") +
-                " }"
-              : param.name + (param.defaultValue ? "?" : ""),
-          ],
-    ) || []
-  );
-}
-
-function printParamsWithTypes(signature: SignatureReflection) {
-  return (
-    signature.parameters?.map(
-      (param) =>
-        (param.name === "__namedParameters"
-          ? ""
-          : param.name + (param.defaultValue ? "?" : "") + ": ") +
-        printType(param.type),
-    ) || []
-  );
-}
-
-function printTypeParamsWithConstraints(
-  typeParams: TypeParameterReflection[] | undefined,
-): string[] {
-  return (
-    typeParams?.flatMap((tParam) =>
-      tParam.type ? [`${tParam.name} extends ${printType(tParam.type)}`] : [],
-    ) || []
-  );
-}
-
-function printType(type: SomeType | undefined): string {
-  if (!type) return "NO TYPE";
-  if (type.type === "reflection") {
-    if (type.declaration.kind === ReflectionKind.TypeLiteral) {
-      if (type.declaration.signatures?.length) {
-        return (
-          type.declaration.signatures
-            ?.map(
-              (sig) =>
-                `(${printParamsWithTypes(sig).join(
-                  ", ",
-                )}) => ${printType(sig.type)}`,
-            )
-            .join(" | ") || ""
-        );
-      } else {
-        return (
-          "{ " +
-          type.declaration.children
-            ?.map((child) => `${child.name}: ${printType(child.type)}`)
-            .join(", ") +
-          " }"
-        );
-      }
-    }
-    return "TODO reflection type " + type.declaration.kind;
-  } else if (type.type === "reference") {
-    return (
-      type.name +
-      (type.typeArguments?.length
-        ? "<" + type.typeArguments.map(printType).join(", ") + ">"
-        : "")
-    );
-  } else if (type.type === "intersection") {
-    return (
-      type.types
-        ?.map((part) =>
-          part.needsParenthesis(TypeContext["intersectionElement"])
-            ? `(${printType(part)})`
-            : printType(part),
-        )
-        .join(" & ") || "NO TYPES"
-    );
-  } else if (type.type === "union") {
-    return (
-      type.types
-        .sort((a, b) => (a.type === "intrinsic" ? 1 : -1))
-        ?.map((part) =>
-          part.needsParenthesis(TypeContext["unionElement"])
-            ? `(${printType(part)})`
-            : printType(part),
-        )
-        .join(" | ") || "NO TYPES"
-    );
-  } else if (type.type === "tuple") {
-    return `[${type.elements.map(printType).join(", ")}]`;
-  } else if (type.type === "array") {
-    if (type.needsParenthesis()) {
-      return `(${printType(type.elementType)})[]`;
-    } else {
-      return printType(type.elementType) + "[]";
-    }
-  } else if (type.type === "mapped") {
-    return `{[${type.parameter} in ${printType(
-      type.parameterType,
-    )}]: ${printType(type.templateType)}}`;
-  } else if (type.type === "indexedAccess") {
-    return `${printType(type.objectType)}[${printType(type.indexType)}]`;
-  } else if (type.type === "intrinsic") {
-    return type.name;
-  } else if (type.type === "predicate") {
-    return `${type.name} is ${printType(type.targetType)}`;
-  } else if (type.type === "query") {
-    return printType(type.queryType);
-  } else if (type.type === "literal") {
-    return JSON.stringify(type.value);
-  } else {
-    return "TODO type " + type.type;
-  }
-}

homepage/homepage/components/docs/requestProject.ts

@@ -1,31 +0,0 @@
-import {
-  Deserializer,
-  FileRegistry,
-  JSONOutput,
-  ProjectReflection,
-} from "typedoc";
-
-import JazzBrowserMediaImagesDocs from "../../typedoc/jazz-browser-media-images.json";
-import JazzBrowserDocs from "../../typedoc/jazz-browser.json";
-import JazzNodejsDocs from "../../typedoc/jazz-nodejs.json";
-import JazzReactDocs from "../../typedoc/jazz-react.json";
-import JazzToolsDocs from "../../typedoc/jazz-tools.json";
-
-const docs = {
-  "jazz-tools": JazzToolsDocs as unknown as JSONOutput.ProjectReflection,
-  "jazz-react": JazzReactDocs as unknown as JSONOutput.ProjectReflection,
-  "jazz-browser": JazzBrowserDocs as unknown as JSONOutput.ProjectReflection,
-  "jazz-browser-media-images":
-    JazzBrowserMediaImagesDocs as unknown as JSONOutput.ProjectReflection,
-  "jazz-nodejs": JazzNodejsDocs as unknown as JSONOutput.ProjectReflection,
-};
-
-export async function requestProject(
-  packageName: keyof typeof docs,
-): Promise<ProjectReflection> {
-  const deserializer = new Deserializer({} as any);
-  return deserializer.reviveProject(packageName, docs[packageName], {
-    projectRoot: "/",
-    registry: new FileRegistry(),
-  });
-}

homepage/homepage/components/home/FeaturesSection.tsx

@@ -145,7 +145,7 @@ export function FeaturesSection() {
 
               <Prose size="sm">
                 or{" "}
-                <Link href="/docs/sync-and-storage#running-your-own">
+                <Link href="/docs/react/sync-and-storage#running-your-own-sync-server">
                   self-host
                 </Link>
                 .

homepage/homepage/components/home/SupportedEnvironmentsSection.tsx

@@ -1,95 +1,118 @@
-import { KotlinLogo } from "@/components/icons/KotlinLogo";
+import { BunLogo } from "@/components/icons/BunLogo";
+import { CloudflareWorkerLogo } from "@/components/icons/CloudflareWorkerLogo";
+import { ExpoLogo } from "@/components/icons/ExpoLogo";
+import { JavascriptLogo } from "@/components/icons/JavascriptLogo";
 import { NodejsLogo } from "@/components/icons/NodejsLogo";
 import { ReactLogo } from "@/components/icons/ReactLogo";
 import { ReactNativeLogo } from "@/components/icons/ReactNativeLogo";
-import { RustLogo } from "@/components/icons/RustLogo";
 import { SvelteLogo } from "@/components/icons/SvelteLogo";
-import { SwiftLogo } from "@/components/icons/SwiftLogo";
-import { VueLogo } from "@/components/icons/VueLogo";
-import { Icon } from "@garden-co/design-system/src/components/atoms/Icon";
+import { GappedGrid } from "@garden-co/design-system/src/components/molecules/GappedGrid";
 import React from "react";
 
 export function SupportedEnvironmentsSection() {
-  const supported = [
+  const frameworks = [
     {
-      name: "Browser (vanilla JS)",
-      icon: (
-        <Icon
-          name="browser"
-          size="3xl"
-          className="text-highlight"
-          height="1em"
-          width="1em"
-        />
-      ),
+      name: "JavaScript",
+      icon: JavascriptLogo,
     },
     {
       name: "React",
-      icon: <ReactLogo />,
+      icon: ReactLogo,
     },
     {
       name: "React Native",
-      icon: <ReactNativeLogo />,
+      icon: ReactNativeLogo,
     },
     {
-      name: "Vue",
-      icon: <VueLogo />,
+      name: "Expo",
+      icon: ExpoLogo,
     },
     {
       name: "Svelte",
-      icon: <SvelteLogo />,
-    },
-    {
-      name: "Node.js",
-      icon: <NodejsLogo />,
+      icon: SvelteLogo,
     },
   ];
 
-  const comingSoon = [
+  const serverWorkers = [
     {
-      name: "Swift",
-      icon: <SwiftLogo />,
+      name: "Node.js",
+      icon: NodejsLogo,
     },
     {
-      name: "Rust",
-      icon: <RustLogo className="text-black dark:text-white" />,
+      name: "Cloudflare Workers",
+      icon: CloudflareWorkerLogo,
     },
     {
-      name: "Kotlin",
-      icon: <KotlinLogo />,
+      name: "Bun",
+      icon: BunLogo,
+    },
+  ];
+
+  const first = [
+    {
+      name: "JavaScript",
+      icon: JavascriptLogo,
+    },
+    {
+      name: "React",
+      icon: ReactLogo,
+    },
+    {
+      name: "Svelte",
+      icon: SvelteLogo,
+    },
+    {
+      name: "Expo",
+      icon: ExpoLogo,
+    },
+    {
+      name: "React Native",
+      icon: ReactNativeLogo,
+    },
+  ];
+
+  const second = [
+    {
+      name: "Node.js",
+      icon: NodejsLogo,
+    },
+    {
+      name: "Cloudflare Workers",
+      icon: CloudflareWorkerLogo,
+    },
+    {
+      name: "Bun",
+      icon: BunLogo,
     },
   ];
 
   return (
-    <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3 lg:gap-8">
-      <h2 className="font-semibold tracking-tight font-display text-2xl text-stone-900 lg:text-balance sm:text-4xl dark:text-white">
-        Jazz works with your favorite stack
-      </h2>
-      <div className="flex flex-col gap-6 lg:col-span-2 lg:gap-8">
-        <div className="flex flex-col gap-5 lg:flex-row lg:gap-8">
-          {supported.map((tech) => (
-            <div key={tech.name} className="flex items-center gap-2">
-              <span className="text-xl">{tech.icon}</span>
-              <div className="text-center font-medium text-highlight lg:text-lg">
-                {tech.name}
-              </div>
-            </div>
-          ))}
-        </div>
-        <div className="flex flex-col gap-3">
-          <p className="text-sm">Coming soon</p>
-          <div className="flex gap-x-5 gap-y-3 flex-wrap">
-            {comingSoon.map((tech) => (
-              <div key={tech.name} className="flex items-center gap-2">
-                <span className="text-xl">{tech.icon}</span>
-                <div className="text-center text-sm text-highlight">
-                  {tech.name}
+    <>
+      <h2 className="sr-only">Supported environments</h2>
+      <GappedGrid>
+        {[
+          {
+            label: "Build apps with",
+            items: frameworks,
+          },
+          {
+            label: "Optionally add server workers",
+            items: serverWorkers,
+          },
+        ].map(({ label, items }) => (
+          <div className="col-span-2 lg:col-span-3" key={label}>
+            <h3 className="mb-4 text-highlight font-medium">{label}</h3>
+            <div className="flex gap-x-6 gap-y-3 grayscale flex-col lg:flex-row">
+              {items.map(({ name, icon: Icon }) => (
+                <div key={name} className="flex items-center gap-2">
+                  <Icon className="size-6" />
+                  {name}
                 </div>
-              </div>
-            ))}
+              ))}
+            </div>
           </div>
-        </div>
-      </div>
-    </div>
+        ))}
+      </GappedGrid>
+    </>
   );
 }

homepage/homepage/components/icons/BunLogo.tsx

@@ -0,0 +1,75 @@
+export function BunLogo(props: React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      width="1em"
+      height="1em"
+      {...props}
+      viewBox="0 0 435 435"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        d="M384.167 143.033C383.348 142.139 382.477 141.246 381.606 140.405C380.735 139.563 379.916 138.617 379.045 137.776C378.174 136.935 377.354 135.989 376.483 135.147C375.613 134.306 374.793 133.36 373.922 132.519C373.051 131.678 372.232 130.731 371.361 129.89C370.49 129.049 369.67 128.103 368.799 127.262C367.929 126.421 367.109 125.474 366.238 124.633C391.647 150.26 406.204 185.123 406.758 221.68C406.758 308.791 320.596 379.657 214.66 379.657C155.34 379.657 102.269 357.419 66.9745 322.565L69.5358 325.193L72.0971 327.822L74.6584 330.45L77.2197 333.079L79.781 335.707L82.3424 338.336L84.9037 340.965C120.147 377.291 174.396 400.686 235.15 400.686C341.086 400.686 427.249 329.819 427.249 242.971C427.249 205.856 411.676 170.686 384.167 143.033Z"
+        fill="black"
+      />
+      <path
+        d="M393.951 221.68C393.951 301.641 313.68 366.462 214.66 366.462C115.639 366.462 35.3678 301.641 35.3678 221.68C35.3678 172.105 66.1035 128.313 113.334 102.343C160.565 76.3726 189.969 49.7714 214.66 49.7714C239.351 49.7714 260.456 71.4834 315.985 102.343C363.216 128.313 393.951 172.105 393.951 221.68Z"
+        fill="#FBF0DF"
+      />
+      <path
+        d="M393.951 221.68C393.926 211.408 392.548 201.187 389.853 191.294C375.868 366.356 167.788 374.768 85.9794 322.407C122.755 351.659 168.136 367.196 214.66 366.462C313.526 366.462 393.951 301.536 393.951 221.68Z"
+        fill="#F6DECE"
+      />
+      <path
+        d="M145.658 92.7223C168.556 78.6332 198.984 52.1897 228.901 52.1372C224.298 50.6105 219.496 49.8127 214.66 49.7714C202.263 49.7714 189.047 56.3429 172.398 66.2263C166.609 69.696 160.616 73.5337 154.264 77.5292C142.328 85.0994 128.651 93.6686 113.283 102.238C64.5155 129.312 35.3678 173.945 35.3678 221.68C35.3678 223.783 35.3678 225.886 35.3678 227.936C66.4109 115.381 122.811 106.811 145.658 92.7223Z"
+        fill="#FFFEFC"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M199.906 63.072C199.978 75.4853 197.439 87.7682 192.461 99.0821C187.484 110.396 180.186 120.474 171.066 128.629C169.632 129.943 170.759 132.466 172.603 131.73C189.866 124.843 213.174 104.235 203.339 62.6514C202.929 60.2857 199.906 60.9166 199.906 63.072ZM211.535 63.072C217.803 73.5675 221.785 85.3299 223.208 97.5527C224.632 109.776 223.463 122.17 219.782 133.886C219.167 135.726 221.37 137.303 222.6 135.778C233.818 121.058 243.602 91.8286 214.301 60.2857C212.815 58.9189 210.51 61.0217 211.535 62.8617V63.072ZM225.673 62.1783C235.489 69.3099 243.7 78.5187 249.753 89.1837C255.807 99.8487 259.561 111.722 260.763 124.002C260.711 124.445 260.827 124.891 261.087 125.248C261.347 125.605 261.731 125.846 262.159 125.92C262.588 125.994 263.027 125.897 263.387 125.647C263.747 125.398 264 125.016 264.093 124.581C268.806 106.233 266.142 74.9531 227.364 58.7086C225.315 57.8674 223.983 60.7063 225.673 61.968V62.1783ZM131.11 116.853C142.785 113.273 153.596 107.209 162.837 99.0574C172.078 90.9054 179.542 80.8474 184.743 69.5383C185.666 67.6457 188.585 68.3817 188.124 70.4846C179.262 112.542 149.602 121.321 131.161 120.165C129.214 120.217 129.266 117.431 131.11 116.853Z"
+        fill="#CCBEA7"
+      />
+      <path
+        d="M214.66 379.657C108.724 379.657 22.5613 308.791 22.5613 221.68C22.5613 169.109 54.2191 120.059 107.238 90.672C122.606 82.2606 135.771 73.7966 147.502 66.384C153.957 62.2834 160.052 58.4457 165.944 54.8709C183.924 43.936 199.292 36.6286 214.66 36.6286C230.028 36.6286 243.449 42.9371 260.251 53.136C265.374 56.1326 270.496 59.392 275.977 62.9669C288.733 71.0629 303.127 80.2103 322.081 90.672C375.1 120.059 406.758 169.056 406.758 221.68C406.758 308.791 320.596 379.657 214.66 379.657ZM214.66 49.7714C202.263 49.7714 189.047 56.3429 172.398 66.2263C166.609 69.696 160.616 73.5337 154.264 77.5292C142.328 85.0995 128.651 93.6686 113.283 102.238C64.5156 129.312 35.3678 173.945 35.3678 221.68C35.3678 301.536 115.793 366.515 214.66 366.515C313.526 366.515 393.951 301.536 393.951 221.68C393.951 173.945 364.804 129.312 315.985 102.343C296.622 91.8286 281.51 81.9452 269.267 74.1646C263.683 70.6423 258.561 67.3829 253.899 64.4914C238.377 55.0286 227.056 49.7714 214.66 49.7714Z"
+        fill="black"
+      />
+      <path
+        d="M250.774 260.057C248.473 269.73 243.234 278.401 235.816 284.818C230.246 290.359 223.036 293.837 215.325 294.702C207.383 293.974 199.92 290.487 194.169 284.818C186.826 278.371 181.662 269.703 179.416 260.057C179.341 259.485 179.396 258.902 179.575 258.354C179.753 257.806 180.052 257.308 180.448 256.897C180.843 256.486 181.325 256.173 181.857 255.983C182.388 255.793 182.955 255.73 183.514 255.799H246.727C247.282 255.738 247.843 255.808 248.368 256.002C248.893 256.196 249.368 256.51 249.758 256.92C250.147 257.33 250.441 257.825 250.617 258.369C250.793 258.912 250.847 259.489 250.774 260.057V260.057Z"
+        fill="#B71422"
+      />
+      <path
+        d="M194.169 285.239C199.908 290.911 207.344 294.431 215.274 295.227C223.186 294.419 230.603 290.901 236.328 285.239C238.16 283.487 239.871 281.607 241.451 279.614C238.295 275.94 234.44 272.967 230.124 270.879C225.807 268.79 221.12 267.63 216.35 267.47C211.246 267.594 206.249 268.989 201.787 271.535C197.325 274.081 193.533 277.701 190.737 282.085C191.915 283.189 192.94 284.24 194.169 285.239Z"
+        fill="#FF6164"
+      />
+      <path
+        d="M194.989 281.086C197.528 277.717 200.779 274.982 204.497 273.088C208.215 271.195 212.302 270.19 216.453 270.151C224.124 270.383 231.433 273.552 236.943 279.035C238.121 277.721 239.248 276.354 240.324 274.987C233.807 268.618 225.195 264.996 216.196 264.841C211.388 264.884 206.648 266.018 202.317 268.163C197.986 270.308 194.171 273.411 191.147 277.248C192.358 278.598 193.641 279.88 194.989 281.086V281.086Z"
+        fill="black"
+      />
+      <path
+        d="M215.121 297.856C206.585 297.089 198.552 293.383 192.325 287.342C184.395 280.459 178.814 271.158 176.394 260.793C176.22 259.871 176.25 258.92 176.48 258.01C176.71 257.101 177.136 256.255 177.726 255.536C178.428 254.666 179.314 253.972 180.317 253.508C181.321 253.043 182.414 252.82 183.514 252.855H246.727C247.826 252.831 248.916 253.06 249.917 253.524C250.919 253.987 251.806 254.675 252.516 255.536C253.1 256.258 253.518 257.105 253.74 258.015C253.961 258.925 253.981 259.875 253.796 260.793C251.376 271.158 245.795 280.459 237.865 287.342C231.652 293.373 223.639 297.077 215.121 297.856ZM183.514 258.953C182.694 258.953 182.49 259.321 182.438 259.426C184.604 268.414 189.502 276.461 196.423 282.4C201.484 287.517 208.064 290.755 215.121 291.6C222.159 290.764 228.732 287.567 233.818 282.505C240.718 276.556 245.597 268.511 247.752 259.532C247.64 259.363 247.485 259.23 247.304 259.147C247.124 259.063 246.924 259.033 246.727 259.058L183.514 258.953Z"
+        fill="black"
+      />
+      <path
+        d="M292.626 263.317C309.177 263.317 322.593 255.22 322.593 245.232C322.593 235.244 309.177 227.147 292.626 227.147C276.076 227.147 262.659 235.244 262.659 245.232C262.659 255.22 276.076 263.317 292.626 263.317Z"
+        fill="#FEBBD0"
+      />
+      <path
+        d="M137.564 263.317C154.115 263.317 167.532 255.22 167.532 245.232C167.532 235.244 154.115 227.147 137.564 227.147C121.014 227.147 107.597 235.244 107.597 245.232C107.597 255.22 121.014 263.317 137.564 263.317Z"
+        fill="#FEBBD0"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M151.651 237.977C157.236 237.988 162.698 236.298 167.347 233.121C171.995 229.944 175.621 225.424 177.765 220.132C179.909 214.84 180.476 209.014 179.392 203.391C178.309 197.769 175.625 192.603 171.679 188.546C167.734 184.49 162.705 181.726 157.228 180.604C151.751 179.482 146.074 180.053 140.913 182.243C135.753 184.434 131.341 188.147 128.238 192.912C125.134 197.676 123.477 203.279 123.477 209.01C123.477 216.684 126.444 224.044 131.726 229.474C137.008 234.905 144.174 237.963 151.651 237.977V237.977ZM278.539 237.977C284.13 238.019 289.607 236.355 294.276 233.198C298.944 230.04 302.594 225.531 304.762 220.242C306.929 214.953 307.518 209.122 306.452 203.489C305.386 197.856 302.714 192.675 298.775 188.603C294.836 184.531 289.807 181.751 284.326 180.616C278.845 179.482 273.16 180.043 267.99 182.229C262.821 184.415 258.4 188.128 255.29 192.896C252.179 197.664 250.518 203.272 250.518 209.01C250.504 216.661 253.446 224.005 258.698 229.434C263.95 234.864 271.084 237.935 278.539 237.977V237.977Z"
+        fill="black"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M142.943 210.85C145.042 210.861 147.098 210.231 148.848 209.042C150.599 207.852 151.966 206.157 152.776 204.169C153.587 202.182 153.804 199.992 153.401 197.877C152.997 195.763 151.991 193.819 150.51 192.292C149.029 190.765 147.14 189.723 145.082 189.299C143.023 188.875 140.889 189.087 138.948 189.909C137.008 190.731 135.349 192.126 134.181 193.917C133.014 195.707 132.39 197.813 132.39 199.968C132.39 202.845 133.5 205.605 135.478 207.644C137.456 209.684 140.14 210.836 142.943 210.85ZM269.83 210.85C271.93 210.861 273.985 210.231 275.735 209.042C277.486 207.852 278.853 206.157 279.664 204.169C280.474 202.182 280.691 199.992 280.288 197.877C279.885 195.763 278.879 193.819 277.398 192.292C275.917 190.765 274.028 189.723 271.969 189.299C269.911 188.875 267.776 189.087 265.836 189.909C263.895 190.731 262.236 192.126 261.068 193.917C259.901 195.707 259.278 197.813 259.278 199.968C259.278 202.827 260.374 205.571 262.329 207.608C264.285 209.644 266.942 210.809 269.728 210.85H269.83Z"
+        fill="white"
+      />
+    </svg>
+  );
+}

homepage/homepage/components/icons/CloudflareWorkerLogo.tsx

@@ -0,0 +1,133 @@
+import React from "react";
+import type { SVGProps } from "react";
+
+export function CloudflareWorkerLogo(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 416 375"
+      width="1em"
+      height="1em"
+      {...props}
+    >
+      <defs>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-a"
+          x1="50%"
+          x2="25.7%"
+          y1="100%"
+          y2="8.7%"
+        >
+          <stop offset="0%" stopColor="#eb6f07" />
+          <stop offset="100%" stopColor="#fab743" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-b"
+          x1="81%"
+          x2="40.5%"
+          y1="83.7%"
+          y2="29.5%"
+        >
+          <stop offset="0%" stopColor="#d96504" />
+          <stop offset="100%" stopColor="#d96504" stopOpacity="0" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-c"
+          x1="42%"
+          x2="84%"
+          y1="8.7%"
+          y2="79.9%"
+        >
+          <stop offset="0%" stopColor="#eb6f07" />
+          <stop offset="100%" stopColor="#eb720a" stopOpacity="0" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-d"
+          x1="50%"
+          x2="25.7%"
+          y1="100%"
+          y2="8.7%"
+        >
+          <stop offset="0%" stopColor="#ee6f05" />
+          <stop offset="100%" stopColor="#fab743" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-e"
+          x1="-33.2%"
+          x2="91.7%"
+          y1="100%"
+          y2="0%"
+        >
+          <stop offset="0%" stopColor="#d96504" stopOpacity=".8" />
+          <stop offset="49.8%" stopColor="#d96504" stopOpacity=".2" />
+          <stop offset="100%" stopColor="#d96504" stopOpacity="0" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-f"
+          x1="50%"
+          x2="25.7%"
+          y1="100%"
+          y2="8.7%"
+        >
+          <stop offset="0%" stopColor="#ffa95f" />
+          <stop offset="100%" stopColor="#ffebc8" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-g"
+          x1="8.1%"
+          x2="96.5%"
+          y1="1.1%"
+          y2="48.8%"
+        >
+          <stop offset="0%" stopColor="#fff" stopOpacity=".5" />
+          <stop offset="100%" stopColor="#fff" stopOpacity=".1" />
+        </linearGradient>
+        <linearGradient
+          id="CloudflareWorkersLogo--gradient-h"
+          x1="-13.7%"
+          y1="104.2%"
+          y2="46.2%"
+        >
+          <stop offset="0%" stopColor="#fff" stopOpacity=".5" />
+          <stop offset="100%" stopColor="#fff" stopOpacity=".1" />
+        </linearGradient>
+      </defs>
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-a)"
+        d="M107 5.4l49 88.4-45 81a26 26 0 0 0 0 25.3l45 81.2-49 88.4A52 52 0 0 1 85 349L7 213.5a52.2 52.2 0 0 1 0-52L85 26a52 52 0 0 1 22-20.6z"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-b)"
+        d="M111 174.9a26 26 0 0 0 0 25.2l45 81.2-49 88.4A52 52 0 0 1 85 349L7 213.5C.8 202.8 35.5 190 111 175z"
+        opacity=".7"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-c)"
+        d="M112 14.3l44 79.5-7.3 12.7-38.8-65.7C98.7 22.5 81.6 32 60.2 69l3.2-5.5L85 26a52 52 0 0 1 21.8-20.6l5.1 8.9z"
+        opacity=".5"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-d)"
+        d="M331 26l78 135.5c9.3 16 9.3 36 0 52L331 349a52 52 0 0 1-45 26h-78l97-174.9a26 26 0 0 0 0-25.2L208 0h78a52 52 0 0 1 45 26z"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-e)"
+        d="M282 374.4l-77 .7 93.2-175.8a27 27 0 0 0 0-25.4L205 0h17.6l97.8 173.1a27 27 0 0 1-.1 26.8 15624 15624 0 0 0-62.7 110c-19 33.4-10.8 54.9 24.4 64.5z"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-f)"
+        d="M130 375c-8 0-16-1.9-23-5.3l96.2-173.5c3-5.4 3-12 0-17.4L107 5.4A52 52 0 0 1 130 0h78l97 174.9a26 26 0 0 1 0 25.2L208 375h-78z"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-g)"
+        d="M298.2 178.8L199 0h9l97 174.9a26 26 0 0 1 0 25.2L208 375h-9l99.2-178.8c3-5.4 3-12 0-17.4z"
+        opacity=".6"
+      />
+      <path
+        fill="url(#CloudflareWorkersLogo--gradient-h)"
+        d="M203.2 178.8L107 5.4c3-1.6 6.6-2.8 10-3.8 21.2 38.1 52.5 95.9 94 173.3a26 26 0 0 1 0 25.2L115.5 373c-3.4-1-5.2-1.7-8.4-3.2l96-173.5c3-5.4 3-12 0-17.4z"
+        opacity=".6"
+      />
+    </svg>
+  );
+}