Update react starter provider setup

.changeset/famous-knives-cover.md

@@ -1,7 +0,0 @@
----
-"chat-rn-clerk": patch
-"jazz-react-native": patch
-"jazz-example-chat": patch
----
-
-Fix image handling in react-native

.changeset/silver-sheep-perform.md

@@ -1,5 +0,0 @@
----
-"cojson": patch
----
-
-Optimize queue management

.github/workflows/playwright.yml

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

examples/chat-rn-clerk/CHANGELOG.md

@@ -1,74 +1,5 @@
 # chat-rn-clerk
 
-## 1.0.50
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react-native@0.9.9
-  - jazz-react-native-auth-clerk@0.9.9
-  - jazz-react-native-media-images@0.9.9
-
-## 1.0.49
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react-native@0.9.8
-  - jazz-react-native-auth-clerk@0.9.8
-  - jazz-react-native-media-images@0.9.8
-
-## 1.0.48
-
-### Patch Changes
-
-- Updated dependencies [8a390d2]
-  - jazz-react-native@0.9.6
-  - jazz-react-native-auth-clerk@0.9.6
-
-## 1.0.47
-
-### Patch Changes
-
-- Updated dependencies [c871912]
-  - jazz-react-native@0.9.5
-  - jazz-react-native-auth-clerk@0.9.5
-
-## 1.0.46
-
-### Patch Changes
-
-- jazz-react-native@0.9.4
-- jazz-react-native-auth-clerk@0.9.4
-
-## 1.0.45
-
-### Patch Changes
-
-- Updated dependencies [7cd691f]
-  - jazz-react-native@0.9.3
-  - jazz-react-native-auth-clerk@0.9.3
-
-## 1.0.44
-
-### Patch Changes
-
-- Updated dependencies [80fd3e9]
-  - jazz-react-native@0.9.2
-  - jazz-react-native-auth-clerk@0.9.2
-
-## 1.0.43
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-tools@0.9.1
-  - jazz-react-native@0.9.1
-  - jazz-react-native-auth-clerk@0.9.1
-  - jazz-react-native-media-images@0.9.1
-
 ## 1.0.42
 
 ### Patch Changes

examples/chat-rn-clerk/app.json

@@ -37,13 +37,7 @@
       ],
       "expo-secure-store",
       "expo-font",
-      "expo-router",
-      [
-        "expo-image-picker",
-        {
-          "photosPermission": "The app accesses your photos to let you share them with your friends."
-        }
-      ]
+      "expo-router"
     ],
     "extra": {
       "eas": {

examples/chat-rn-clerk/app/chat/[chatId].tsx

@@ -2,11 +2,8 @@ import { Chat, Message } from "@/src/schema";
 import { useNavigation } from "@react-navigation/native";
 import clsx from "clsx";
 import * as Clipboard from "expo-clipboard";
-import * as ImagePicker from "expo-image-picker";
 import { useLocalSearchParams } from "expo-router";
 import { useAccount, useCoState } from "jazz-react-native";
-import { ProgressiveImg } from "jazz-react-native";
-import { createImage } from "jazz-react-native-media-images";
 import { Group, ID } from "jazz-tools";
 import { useEffect, useLayoutEffect, useState } from "react";
 import React, {
@@ -19,8 +16,6 @@ import React, {
   KeyboardAvoidingView,
   TextInput,
   Button,
-  Image,
-  ActivityIndicator,
 } from "react-native";
 
 export default function Conversation() {
@@ -30,7 +25,6 @@ export default function Conversation() {
   const [message, setMessage] = useState("");
   const loadedChat = useCoState(Chat, chat?.id, [{}]);
   const navigation = useNavigation();
-  const [isUploading, setIsUploading] = useState(false);
 
   useEffect(() => {
     if (chat) return;
@@ -87,32 +81,6 @@ export default function Conversation() {
     }
   };
 
-  const handleImageUpload = async () => {
-    try {
-      const result = await ImagePicker.launchImageLibraryAsync({
-        mediaTypes: ImagePicker.MediaTypeOptions.Images,
-        base64: true,
-        quality: 0.7,
-      });
-
-      if (!result.canceled && result.assets[0].base64 && chat) {
-        setIsUploading(true);
-        const base64Uri = `data:image/jpeg;base64,${result.assets[0].base64}`;
-
-        const image = await createImage(base64Uri, {
-          owner: chat._owner,
-          maxSize: 2048,
-        });
-
-        chat.push(Message.create({ text: "", image }, { owner: chat._owner }));
-      }
-    } catch (error) {
-      Alert.alert("Error", "Failed to upload image");
-    } finally {
-      setIsUploading(false);
-    }
-  };
-
   const renderMessageItem = ({ item }: { item: Message }) => {
     const isMe = item._edits.text.by?.isMe;
     return (
@@ -138,27 +106,14 @@ export default function Conversation() {
             isMe ? "flex-row" : "flex-row",
           )}
         >
-          {item.image && (
-            <ProgressiveImg image={item.image} maxWidth={1024}>
-              {({ src, res, originalSize }) => (
-                <Image
-                  source={{ uri: src }}
-                  className="w-48 h-48 rounded-lg mb-2"
-                  resizeMode="cover"
-                />
-              )}
-            </ProgressiveImg>
-          )}
-          {item.text && (
-            <Text
-              className={clsx(
-                !isMe ? "text-black" : "text-gray-200",
-                `text-md max-w-[85%]`,
-              )}
-            >
-              {item.text}
-            </Text>
-          )}
+          <Text
+            className={clsx(
+              !isMe ? "text-black" : "text-gray-200",
+              `text-md max-w-[85%]`,
+            )}
+          >
+            {item.text}
+          </Text>
           <Text
             className={clsx(
               "text-[10px] text-right ml-2",
@@ -192,17 +147,6 @@ export default function Conversation() {
         className="p-3 bg-white border-t border-gray-300"
       >
         <SafeAreaView className="flex-row items-center gap-2">
-          <TouchableOpacity
-            onPress={handleImageUpload}
-            disabled={isUploading}
-            className="h-10 w-10 items-center justify-center"
-          >
-            {isUploading ? (
-              <ActivityIndicator size="small" color="#0000ff" />
-            ) : (
-              <Text className="text-2xl">🖼️</Text>
-            )}
-          </TouchableOpacity>
           <TextInput
             className="flex-1 rounded-full h-10 px-4 bg-gray-100 border border-gray-300 focus:border-blue-500 focus:bg-white"
             value={message}

examples/chat-rn-clerk/package.json

@@ -1,7 +1,7 @@
 {
   "name": "chat-rn-clerk",
   "main": "index.js",
-  "version": "1.0.50",
+  "version": "1.0.42",
   "scripts": {
     "build": "expo export -p ios",
     "start": "expo start",
@@ -20,7 +20,6 @@
     "@bam.tech/react-native-image-resizer": "^3.0.11",
     "@clerk/clerk-expo": "^2.2.21",
     "@expo/vector-icons": "^14.0.2",
-    "@op-engineering/op-sqlite": "^11.2.12",
     "@react-native-community/netinfo": "^11.4.1",
     "@react-navigation/native": "^7.0.13",
     "@react-navigation/native-stack": "^7.1.14",
@@ -35,7 +34,6 @@
     "expo-dev-client": "~5.0.5",
     "expo-file-system": "^18.0.4",
     "expo-font": "~13.0.1",
-    "expo-image-picker": "~16.0.4",
     "expo-linking": "~7.0.3",
     "expo-router": "~4.0.11",
     "expo-secure-store": "~14.0.0",

examples/chat-rn-clerk/src/auth-context.tsx

@@ -50,7 +50,6 @@ export function JazzAndAuth({ children }: PropsWithChildren) {
       {auth && clerk.user ? (
         <JazzProvider
           auth={auth}
-          storage="sqlite"
           peer="wss://cloud.jazz.tools/?key=chat-rn-clerk-example-jazz@garden.co"
         >
           {children}

examples/chat-rn-clerk/src/schema.ts

@@ -1,8 +1,7 @@
-import { CoList, CoMap, ImageDefinition, co } from "jazz-tools";
+import { CoList, CoMap, co } from "jazz-tools";
 
 export class Message extends CoMap {
   text = co.string;
-  image = co.optional.ref(ImageDefinition);
 }
 
 export class Chat extends CoList.Of(co.ref(Message)) {}

examples/chat-rn/CHANGELOG.md

@@ -1,63 +1,5 @@
 # chat-rn
 
-## 1.0.47
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react-native@0.9.9
-
-## 1.0.46
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react-native@0.9.8
-
-## 1.0.45
-
-### Patch Changes
-
-- Updated dependencies [8a390d2]
-  - jazz-react-native@0.9.6
-
-## 1.0.44
-
-### Patch Changes
-
-- Updated dependencies [c871912]
-  - jazz-react-native@0.9.5
-
-## 1.0.43
-
-### Patch Changes
-
-- jazz-react-native@0.9.4
-
-## 1.0.42
-
-### Patch Changes
-
-- Updated dependencies [7cd691f]
-  - jazz-react-native@0.9.3
-
-## 1.0.41
-
-### Patch Changes
-
-- Updated dependencies [80fd3e9]
-  - jazz-react-native@0.9.2
-
-## 1.0.40
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-tools@0.9.1
-  - jazz-react-native@0.9.1
-
 ## 1.0.39
 
 ### Patch Changes

examples/chat-rn/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chat-rn",
-  "version": "1.0.47",
+  "version": "1.0.39",
   "main": "index.js",
   "scripts": {
     "build": "expo export -p ios",
@@ -13,7 +13,6 @@
   },
   "dependencies": {
     "@azure/core-asynciterator-polyfill": "^1.0.2",
-    "@op-engineering/op-sqlite": "^11.2.12",
     "@react-native-community/netinfo": "^11.4.1",
     "@react-navigation/native": "^7.0.13",
     "@react-navigation/native-stack": "^7.1.14",

examples/chat-rn/src/App.tsx

@@ -33,6 +33,7 @@ function App() {
     "ChatScreen" | "HandleInviteScreen"
   >("ChatScreen");
   const navigationRef = useNavigationContainerRef();
+
   useEffect(() => {
     Linking.getInitialURL().then((url) => {
       if (url) {
@@ -51,7 +52,6 @@ function App() {
     <StrictMode>
       <JazzProvider
         auth={auth}
-        storage="sqlite"
         peer="wss://cloud.jazz.tools/?key=chat-rn-example-jazz@garden.co"
       >
         <NavigationContainer linking={linking} ref={navigationRef}>

examples/chat-vue/CHANGELOG.md

@@ -1,33 +1,5 @@
 # chat-vue
 
-## 0.0.34
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser@0.9.9
-  - jazz-vue@0.9.9
-
-## 0.0.33
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-browser@0.9.8
-  - jazz-vue@0.9.8
-
-## 0.0.32
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-- Updated dependencies [5d98189]
-  - jazz-browser@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-vue@0.9.1
-
 ## 0.0.31
 
 ### Patch Changes

examples/chat-vue/README.md

@@ -1,59 +1,29 @@
 # Chat example with Jazz and Vue
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example chat-vue --project-name chat-vue
-```
-or
-```bash
-npx create-jazz-app@latest --example chat-vue --project-name chat-vue
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the todo-vue example directory:
 ```bash
-cd chat-vue
+cd jazz/examples/chat-vue
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/chat-vue/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/chat-vue/package.json

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

examples/chat/CHANGELOG.md

@@ -1,38 +1,5 @@
 # jazz-example-chat
 
-## 0.0.130
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.129
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.128
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.127
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
 ## 0.0.126
 
 ### Patch Changes

examples/chat/README.md

@@ -2,60 +2,30 @@
 
 Live version: [https://chat.jazz.tools](https://chat.jazz.tools)
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example chat --project-name chat
-```
-or
-```bash
-npx create-jazz-app@latest --example chat --project-name chat
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the chat example directory:
 ```bash
-cd chat
+cd jazz/examples/chat
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/chat/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/chat/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-chat",
   "private": true,
-  "version": "0.0.130",
+  "version": "0.0.126",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/chat/src/app.tsx

@@ -16,9 +16,9 @@ export function App() {
 
   const createChat = () => {
     if (!me) return;
-    const group = Group.create();
+    const group = Group.create({ owner: me });
     group.addMember("everyone", "writer");
-    const chat = Chat.create([], group);
+    const chat = Chat.create([], { owner: group });
     router.navigate("/#/chat/" + chat.id);
 
     // for https://jazz.tools marketing site demo only

examples/chat/src/chatScreen.tsx

@@ -1,5 +1,5 @@
 import { createImage } from "jazz-browser-media-images";
-import { useCoState } from "jazz-react";
+import { useAccount, useCoState } from "jazz-react";
 import { ID } from "jazz-tools";
 import { useState } from "react";
 import { Chat, Message } from "./schema.ts";
@@ -18,6 +18,7 @@ import {
 
 export function ChatScreen(props: { chatID: ID<Chat> }) {
   const chat = useCoState(Chat, props.chatID, [{}]);
+  const { me } = useAccount();
   const [showNLastMessages, setShowNLastMessages] = useState(30);
 
   if (!chat)
@@ -26,6 +27,8 @@ export function ChatScreen(props: { chatID: ID<Chat> }) {
     );
 
   const sendImage = (event: React.ChangeEvent<HTMLInputElement>) => {
+    if (!me?.profile) return;
+
     const file = event.currentTarget.files?.[0];
 
     if (!file) return;
@@ -36,7 +39,12 @@ export function ChatScreen(props: { chatID: ID<Chat> }) {
     }
 
     createImage(file, { owner: chat._owner }).then((image) => {
-      chat.push(Message.create({ text: file.name, image: image }, chat._owner));
+      chat.push(
+        Message.create(
+          { text: file.name, image: image },
+          { owner: chat._owner },
+        ),
+      );
     });
   };
 

examples/clerk/CHANGELOG.md

@@ -1,39 +1,5 @@
 # minimal-auth-clerk
 
-## 0.0.29
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-  - jazz-react-auth-clerk@0.9.9
-
-## 0.0.28
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-react-auth-clerk@0.9.8
-
-## 0.0.27
-
-### Patch Changes
-
-- jazz-react@0.9.4
-- jazz-react-auth-clerk@0.9.4
-
-## 0.0.26
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-react-auth-clerk@0.9.1
-
 ## 0.0.25
 
 ### Patch Changes

examples/clerk/README.md

@@ -4,60 +4,30 @@ This is an example of how to use clerk authentication with Jazz.
 
 Live version: https://clerk-demo.jazz.tools
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --start clerk --project-name clerk
-```
-or
-```bash
-npx create-jazz-app@latest --start clerk --project-name clerk
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the clerk example directory:
 ```bash
-cd clerk
+cd jazz/examples/clerk
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/clerk/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/clerk/package.json

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

examples/file-share-svelte/CHANGELOG.md

@@ -1,29 +1,5 @@
 # file-share-svelte
 
-## 0.0.14
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-svelte@0.9.9
-
-## 0.0.13
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-svelte@0.9.8
-
-## 0.0.12
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-tools@0.9.1
-  - jazz-svelte@0.9.1
-
 ## 0.0.11
 
 ### Patch Changes

examples/file-share-svelte/package.json

@@ -1,6 +1,6 @@
 {
   "name": "file-share-svelte",
-  "version": "0.0.14",
+  "version": "0.0.11",
   "private": true,
   "type": "module",
   "scripts": {

examples/form/CHANGELOG.md

@@ -1,38 +1,5 @@
 # form
 
-## 0.0.25
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.24
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.23
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.22
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
 ## 0.0.21
 
 ### Patch Changes

examples/form/README.md

@@ -17,60 +17,30 @@ converting it into a `BubbleTeaOrder`.
 
 [See the full guide here.](https://jazz.tools/docs/react/design-patterns/form)
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --start form --project-name form
-```
-or
-```bash
-npx create-jazz-app@latest --start form --project-name form
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the form example directory:
 ```bash
-cd form
+cd jazz/examples/form
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/form/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/form/package.json

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

examples/form/src/CreateOrder.tsx

@@ -30,9 +30,12 @@ export function CreateOrder() {
     me.root.orders.push(draft as BubbleTeaOrder);
 
     // reset the draft
-    me.root.draft = DraftBubbleTeaOrder.create({
-      addOns: ListOfBubbleTeaAddOns.create([]),
-    });
+    me.root.draft = DraftBubbleTeaOrder.create(
+      {
+        addOns: ListOfBubbleTeaAddOns.create([], me),
+      },
+      me,
+    );
 
     router.navigate("/");
   };

examples/image-upload/CHANGELOG.md

@@ -1,38 +1,5 @@
 # image-upload
 
-## 0.0.27
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.26
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.25
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.24
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
 ## 0.0.23
 
 ### Patch Changes

examples/image-upload/README.md

@@ -4,60 +4,30 @@ This is an example of how to upload and render images with Jazz.
 
 Live version: https://image-upload-demo.jazz.tools
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example image-upload --project-name image-upload
-```
-or
-```bash
-npx create-jazz-app@latest --example image-upload --project-name image-upload
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the image-upload example directory:
 ```bash
-cd image-upload
+cd jazz/examples/image-upload
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/image-upload/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/image-upload/package.json

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

examples/inspector/CHANGELOG.md

@@ -1,13 +1,5 @@
 # jazz-example-inspector
 
-## 0.0.94
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - cojson@0.9.9
-  - cojson-transport-ws@0.9.9
-
 ## 0.0.93
 
 ### Patch Changes

examples/inspector/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-inspector",
   "private": true,
-  "version": "0.0.94",
+  "version": "0.0.93",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -16,8 +16,8 @@
     "@radix-ui/react-toast": "^1.1.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
-    "cojson": "workspace:0.9.9",
-    "cojson-transport-ws": "workspace:0.9.9",
+    "cojson": "workspace:0.9.0",
+    "cojson-transport-ws": "workspace:0.9.0",
     "hash-slash": "workspace:0.2.1",
     "lucide-react": "^0.274.0",
     "qrcode": "^1.5.3",

examples/music-player/CHANGELOG.md

@@ -1,35 +1,5 @@
 # jazz-example-musicplayer
 
-## 0.0.50
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.49
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-
-## 0.0.48
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.47
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-
 ## 0.0.46
 
 ### Patch Changes

examples/music-player/README.md

@@ -2,60 +2,30 @@
 
 Live version: https://music-demo.jazz.tools
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example music-player --project-name music-player
-```
-or
-```bash
-npx create-jazz-app@latest --example music-player --project-name music-player
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the music-player example directory:
 ```bash
-cd music-player
+cd jazz/examples/music-player
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/music-player/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/music-player/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-music-player",
   "private": true,
-  "version": "0.0.50",
+  "version": "0.0.46",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -18,8 +18,8 @@
     "@radix-ui/react-toast": "^1.1.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
-    "jazz-react": "workspace:0.9.9",
-    "jazz-tools": "workspace:0.9.9",
+    "jazz-react": "workspace:0.9.0",
+    "jazz-tools": "workspace:0.9.0",
     "lucide-react": "^0.274.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",

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

@@ -65,7 +65,7 @@ function JazzAndAuth({ children }: { children: React.ReactNode }) {
   return (
     <>
       <JazzProvider
-        storage="indexedDB"
+        storage={["singleTabOPFS", "indexedDB"]}
         auth={auth}
         peer={peer}
         AccountSchema={MusicaAccount}

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

@@ -31,15 +31,19 @@ export function HomePage({ mediaPlayer }: { mediaPlayer: MediaPlayer }) {
   const { toast } = useToast();
 
   async function handleFileLoad(files: FileList) {
+    if (!me) return;
+
     /**
      * Follow this function definition to see how we update
      * values in Jazz and manage files!
      */
-    await uploadMusicTracks(files);
+    await uploadMusicTracks(me, files);
   }
 
   async function handleCreatePlaylist() {
-    const playlist = await createNewPlaylist();
+    if (!me) return;
+
+    const playlist = await createNewPlaylist(me);
 
     navigate(`/playlist/${playlist.id}`);
   }

examples/music-player/src/4_actions.ts

@@ -22,22 +22,14 @@ import {
  * pattern that best fits your app.
  */
 
-export async function uploadMusicTracks(files: Iterable<File>) {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {
-      rootPlaylist: {
-        tracks: [],
-      },
-      playlists: [],
-    },
-  });
-
-  if (!me) return;
-
+export async function uploadMusicTracks(
+  account: MusicaAccount,
+  files: Iterable<File>,
+) {
   for (const file of files) {
     // The ownership object defines the user that owns the created coValues
     // We are creating a group for each CoValue in order to be able to share them via Playlist
-    const group = Group.create();
+    const group = Group.create(account);
 
     const data = await getAudioFileData(file);
 
@@ -58,23 +50,15 @@ export async function uploadMusicTracks(files: Iterable<File>) {
 
     // The newly created musicTrack can be associated to the
     // user track list using a simple push call
-    me.root.rootPlaylist.tracks.push(musicTrack);
+    account.root?.rootPlaylist?.tracks?.push(musicTrack);
   }
 }
 
-export async function createNewPlaylist() {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {
-      playlists: [],
-    },
-  });
-
-  if (!me) throw new Error("Current playlist not resolved");
-
+export async function createNewPlaylist(account: MusicaAccount) {
   // Since playlists are meant to be shared we associate them
   // to a group which will contain the keys required to get
   // access to the "owned" values
-  const playlistGroup = Group.create();
+  const playlistGroup = Group.create(account);
 
   const playlist = Playlist.create(
     {
@@ -86,7 +70,7 @@ export async function createNewPlaylist() {
 
   // Again, we associate the new playlist to the
   // user by pushing it into the playlists CoList
-  me.root.playlists.push(playlist);
+  account.root?.playlists?.push(playlist);
 
   return playlist;
 }
@@ -94,7 +78,10 @@ export async function createNewPlaylist() {
 export async function addTrackToPlaylist(
   playlist: Playlist,
   track: MusicTrack,
+  account: MusicaAccount | undefined,
 ) {
+  if (!account) return;
+
   const alreadyAdded = playlist.tracks?.some(
     (t) => t?.id === track.id || t?._refs.sourceTrack?.id === track.id,
   );
@@ -121,8 +108,12 @@ export async function addTrackToPlaylist(
    *
    * Doing this for backwards compatibility for when the Group inheritance wasn't possible
    */
-  const blob = await FileStream.loadAsBlob(track._refs.file.id);
-  const waveform = await MusicTrackWaveform.load(track._refs.waveform.id, {});
+  const blob = await FileStream.loadAsBlob(track._refs.file.id, account);
+  const waveform = await MusicTrackWaveform.load(
+    track._refs.waveform.id,
+    account,
+    {},
+  );
 
   if (!blob || !waveform) return;
 
@@ -151,25 +142,13 @@ export async function updateMusicTrackTitle(track: MusicTrack, title: string) {
   track.title = title;
 }
 
-export async function updateActivePlaylist(playlist?: Playlist) {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {
-      activePlaylist: {},
-      rootPlaylist: {},
-    },
-  });
-
-  if (!me) return;
-
-  me.root.activePlaylist = playlist ?? me.root.rootPlaylist;
+export async function updateActivePlaylist(
+  playlist: Playlist,
+  me: MusicaAccount,
+) {
+  me.root!.activePlaylist = playlist ?? me.root!.rootPlaylist;
 }
 
-export async function updateActiveTrack(track: MusicTrack) {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {},
-  });
-
-  if (!me) return;
-
-  me.root.activeTrack = track;
+export async function updateActiveTrack(track: MusicTrack, me: MusicaAccount) {
+  me.root!.activeTrack = track;
 }

examples/music-player/src/5_useMediaPlayer.ts

@@ -8,26 +8,26 @@ import { updateActivePlaylist, updateActiveTrack } from "./4_actions";
 import { getNextTrack, getPrevTrack } from "./lib/getters";
 
 export function useMediaPlayer() {
-  const { me } = useAccount({
-    root: {},
-  });
+  const { me } = useAccount();
 
   const playState = usePlayState();
   const playMedia = usePlayMedia();
 
   const [loading, setLoading] = useState<ID<MusicTrack> | null>(null);
 
-  const activeTrackId = me?.root._refs.activeTrack?.id;
+  const activeTrackId = me?.root?._refs.activeTrack?.id;
 
   // Reference used to avoid out-of-order track loads
   const lastLoadedTrackId = useRef<ID<MusicTrack> | null>(null);
 
   async function loadTrack(track: MusicTrack) {
+    if (!me.root) return;
+
     lastLoadedTrackId.current = track.id;
 
     setLoading(track.id);
 
-    const file = await FileStream.loadAsBlob(track._refs.file.id);
+    const file = await FileStream.loadAsBlob(track._refs.file.id, me);
 
     if (!file) {
       setLoading(null);
@@ -40,7 +40,7 @@ export function useMediaPlayer() {
       return;
     }
 
-    updateActiveTrack(track);
+    updateActiveTrack(track, me);
 
     await playMedia(file);
 
@@ -48,16 +48,20 @@ export function useMediaPlayer() {
   }
 
   async function playNextTrack() {
-    const track = await getNextTrack();
+    if (!me?.root) return;
+
+    const track = await getNextTrack(me);
 
     if (track) {
-      updateActiveTrack(track);
+      updateActiveTrack(track, me);
       await loadTrack(track);
     }
   }
 
   async function playPrevTrack() {
-    const track = await getPrevTrack();
+    if (!me?.root) return;
+
+    const track = await getPrevTrack(me);
 
     if (track) {
       await loadTrack(track);
@@ -65,12 +69,14 @@ export function useMediaPlayer() {
   }
 
   async function setActiveTrack(track: MusicTrack, playlist?: Playlist) {
+    if (!me?.root) return;
+
     if (activeTrackId === track.id && lastLoadedTrackId.current !== null) {
       playState.toggle();
       return;
     }
 
-    updateActivePlaylist(playlist);
+    updateActivePlaylist(playlist!, me);
 
     await loadTrack(track);
 

examples/music-player/src/6_InvitePage.tsx

@@ -1,26 +1,26 @@
-import { useAcceptInvite } from "jazz-react";
+import { useAcceptInvite, useAccount } from "jazz-react";
 import { ID } from "jazz-tools";
 import { useCallback } from "react";
 import { useNavigate } from "react-router-dom";
-import { MusicaAccount, Playlist } from "./1_schema";
+import { Playlist } from "./1_schema";
 
 export function InvitePage() {
   const navigate = useNavigate();
 
+  const { me } = useAccount({
+    root: {
+      playlists: [],
+    },
+  });
+
   useAcceptInvite({
     invitedObjectSchema: Playlist,
     onAccept: useCallback(
       async (playlistId: ID<Playlist>) => {
-        const playlist = await Playlist.load(playlistId, {});
-
-        const me = await MusicaAccount.getMe().ensureLoaded({
-          root: {
-            playlists: [],
-          },
-        });
-
         if (!me) return;
 
+        const playlist = await Playlist.load(playlistId, me, {});
+
         if (
           playlist &&
           !me.root.playlists.some((item) => playlist.id === item?.id)
@@ -30,7 +30,7 @@ export function InvitePage() {
 
         navigate("/playlist/" + playlistId);
       },
-      [navigate],
+      [navigate, me],
     ),
   });
 

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

@@ -43,7 +43,7 @@ export function MusicTrackRow({
 
   function handleAddToPlaylist(playlist: Playlist) {
     if (!track) return;
-    addTrackToPlaylist(playlist, track);
+    addTrackToPlaylist(playlist, track, me);
   }
 
   return (

examples/music-player/src/lib/getters.ts

@@ -1,18 +1,10 @@
 import { MusicaAccount } from "../1_schema";
 
-export async function getNextTrack() {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {
-      activePlaylist: {
-        tracks: [],
-      },
-    },
-  });
+export async function getNextTrack(account: MusicaAccount) {
+  if (!account.root?.activePlaylist?.tracks) return;
 
-  if (!me) return;
-
-  const tracks = me.root.activePlaylist.tracks;
-  const activeTrack = me.root._refs.activeTrack;
+  const tracks = account.root.activePlaylist.tracks;
+  const activeTrack = account.root._refs.activeTrack;
 
   const currentIndex = tracks.findIndex((item) => item?.id === activeTrack.id);
 
@@ -21,19 +13,11 @@ export async function getNextTrack() {
   return tracks[nextIndex];
 }
 
-export async function getPrevTrack() {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {
-      activePlaylist: {
-        tracks: [],
-      },
-    },
-  });
+export async function getPrevTrack(account: MusicaAccount) {
+  if (!account.root?.activePlaylist?.tracks) return;
 
-  if (!me) return;
-
-  const tracks = me.root.activePlaylist.tracks;
-  const activeTrack = me.root._refs.activeTrack;
+  const tracks = account.root.activePlaylist.tracks;
+  const activeTrack = account.root._refs.activeTrack;
 
   const currentIndex = tracks.findIndex((item) => item?.id === activeTrack.id);
 

examples/music-player/src/lib/useUploadExampleData.ts

@@ -1,30 +1,30 @@
-import { MusicaAccount } from "@/1_schema";
+import { useAccount } from "jazz-react";
+// eslint-disable-next-line react-compiler/react-compiler
+/* eslint-disable react-hooks/exhaustive-deps */
 import { useEffect } from "react";
+import { MusicaAccount } from "../1_schema";
 import { uploadMusicTracks } from "../4_actions";
 
 export function useUploadExampleData() {
-  useEffect(() => {
-    uploadOnboardingData();
-  }, []);
-}
-
-async function uploadOnboardingData() {
-  const me = await MusicaAccount.getMe().ensureLoaded({
+  const { me } = useAccount({
     root: {},
   });
 
-  if (!me) throw new Error("Me not resolved");
+  const shouldUploadOnboardingData = me?.root?.exampleDataLoaded === false;
 
-  if (me.root.exampleDataLoaded) return;
+  useEffect(() => {
+    if (me?.root && shouldUploadOnboardingData) {
+      me.root.exampleDataLoaded = true;
 
-  me.root.exampleDataLoaded = true;
-
-  try {
-    const trackFile = await (await fetch("/example.mp3")).blob();
-
-    await uploadMusicTracks([new File([trackFile], "Example song")]);
-  } catch (error) {
-    me.root.exampleDataLoaded = false;
-    throw error;
-  }
+      uploadOnboardingData(me).then(() => {
+        me.root.exampleDataLoaded = true;
+      });
+    }
+  }, [shouldUploadOnboardingData]);
+}
+
+async function uploadOnboardingData(me: MusicaAccount) {
+  const trackFile = await (await fetch("/example.mp3")).blob();
+
+  return uploadMusicTracks(me, [new File([trackFile], "Example song")]);
 }

examples/onboarding/CHANGELOG.md

@@ -1,38 +1,5 @@
 # jazz-example-onboarding
 
-## 0.0.31
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.30
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.29
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.28
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
 ## 0.0.27
 
 ### Patch Changes

examples/onboarding/README.md

@@ -1,58 +1,29 @@
 # Onboarding example with Jazz and React
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example onboarding --project-name onboarding
-```
-or
-```bash
-npx create-jazz-app@latest --example onboarding --project-name onboarding
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the onboarding example directory:
 ```bash
-cd onboarding
+cd jazz/examples/onboarding
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/onboarding/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/onboarding/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-onboarding",
   "private": true,
-  "version": "0.0.31",
+  "version": "0.0.27",
   "type": "module",
   "scripts": {
     "dev": "vite",

examples/organization/CHANGELOG.md

@@ -1,35 +1,5 @@
 # organization
 
-## 0.0.23
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.22
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-
-## 0.0.21
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.20
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-
 ## 0.0.19
 
 ### Patch Changes

examples/organization/README.md

@@ -5,60 +5,30 @@ Different apps have different names for this concept, such as "teams" or "worksp
 
 Refer to the [documentation](https://jazz.tools/docs/react/design-patterns/organization)  for more information.
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example organization --project-name organization
-```
-or
-```bash
-npx create-jazz-app@latest --example organization --project-name organization
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the organization example directory:
 ```bash
-cd organization
+cd jazz/examples/organization
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/organization/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/organization/package.json

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

examples/passkey-svelte/CHANGELOG.md

@@ -1,23 +1,5 @@
 # passkey-svelte
 
-## 0.0.18
-
-### Patch Changes
-
-- jazz-svelte@0.9.9
-
-## 0.0.17
-
-### Patch Changes
-
-- jazz-svelte@0.9.8
-
-## 0.0.16
-
-### Patch Changes
-
-- jazz-svelte@0.9.1
-
 ## 0.0.15
 
 ### Patch Changes

examples/passkey-svelte/README.md

@@ -10,59 +10,34 @@ This example showcases how to:
 - Manage authentication state
 - Implement secure login/logout flows
 
-## Getting started
+## Getting Started
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+1. Clone the repository:
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
-```bash
-npm create jazz-app@latest --example passkey-svelte --project-name passkey-svelte
-```
-or
-```bash
-npx create-jazz-app@latest --example passkey-svelte --project-name passkey-svelte
-```
-
-Go to the new project directory.
-```bash
-cd passkey-svelte
-```
-
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
+```sh
 git clone https://github.com/garden-co/jazz.git
 ```
 
-Install and build dependencies.
-```bash
-pnpm i && npx turbo build
+2. Navigate to the example directory:
+
+```sh
+cd examples/passkey-svelte
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/passkey-svelte/
+3. Install dependencies:
+
+```sh
+pnpm install
 ```
 
-Start the dev server.
-```bash
+4. Start the development server:
+
+```sh
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
+5. Open your browser and visit [http://localhost:5173](http://localhost:5173)
+
 
 ## Learn More
 

examples/passkey-svelte/package.json

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

examples/passkey-svelte/src/lib/jazz.ts

@@ -0,0 +1,3 @@
+import { createJazzApp } from 'jazz-svelte';
+
+export const { useAccount, useCoState, Provider } = createJazzApp();

examples/passkey-svelte/src/routes/+layout.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
-  import { JazzProvider, PasskeyAuthBasicUI, usePasskeyAuth } from 'jazz-svelte';
+  import { usePasskeyAuth, PasskeyAuthBasicUI } from 'jazz-svelte';
+  import { Provider } from '$lib/jazz';
 
   let { children } = $props();
 
@@ -14,12 +15,12 @@
   <PasskeyAuthBasicUI state={auth.state} />
 
   {#if auth.current}
-    <JazzProvider
+    <Provider
       auth={auth.current}
       peer="wss://cloud.jazz.tools/?key=minimal-svelte-auth-passkey@garden.co"
     >
       {@render children?.()}
-    </JazzProvider>
+    </Provider>
   {/if}
 </div>
 

examples/passkey-svelte/src/routes/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { useAccount } from 'jazz-svelte';
+  import { useAccount } from '$lib/jazz';
 
   const account = useAccount({
     root: {}

examples/passkey/CHANGELOG.md

@@ -1,35 +1,5 @@
 # minimal-auth-passkey
 
-## 0.0.28
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.27
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-
-## 0.0.26
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.25
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-
 ## 0.0.24
 
 ### Patch Changes

examples/passkey/README.md

@@ -4,59 +4,30 @@ This is an example of how to use passkey authentication with Jazz.
 
 Live version: https://passkey-demo.jazz.tools
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example passkey --project-name passkey
-```
-or
-```bash
-npx create-jazz-app@latest --example passkey --project-name passkey
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the passkey example directory:
 ```bash
-cd passkey
+cd jazz/examples/passkey
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/passkey/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/passkey/package.json

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

examples/password-manager/CHANGELOG.md

@@ -1,35 +1,5 @@
 # jazz-password-manager
 
-## 0.0.49
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.48
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-
-## 0.0.47
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.46
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-
 ## 0.0.45
 
 ### Patch Changes

examples/password-manager/README.md

@@ -4,60 +4,30 @@ Live version: https://passwords-demo.jazz.tools
 
 ![Password Manager Screenshot](demo.png "Screenshot")
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example password-manager --project-name password-manager
-```
-or
-```bash
-npx create-jazz-app@latest --example password-manager --project-name password-manager
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the password-manager example directory:
 ```bash
-cd password-manager
+cd jazz/examples/password-manager
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/password-manager/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Structure
 
 - [`src/components`](./src/components/): UI components

examples/password-manager/package.json

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

examples/pets/CHANGELOG.md

@@ -1,38 +1,5 @@
 # jazz-example-pets
 
-## 0.0.147
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.146
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.145
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.144
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
 ## 0.0.143
 
 ### Patch Changes

examples/pets/README.md

@@ -2,59 +2,30 @@
 
 Live version: https://pets-demo.jazz.tools/
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example pets --project-name pets
-```
-or
-```bash
-npx create-jazz-app@latest --example pets --project-name pets
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the pets example directory:
 ```bash
-cd pets
+cd jazz/examples/pets
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/pets/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
 
 ## Questions / problems / feedback
 

examples/pets/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jazz-example-pets",
   "private": true,
-  "version": "0.0.147",
+  "version": "0.0.143",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -19,9 +19,9 @@
     "@radix-ui/react-toast": "^1.1.4",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
-    "jazz-browser-media-images": "workspace:0.9.9",
-    "jazz-react": "workspace:0.9.9",
-    "jazz-tools": "workspace:0.9.9",
+    "jazz-browser-media-images": "workspace:0.9.0",
+    "jazz-react": "workspace:0.9.0",
+    "jazz-tools": "workspace:0.9.0",
     "lucide-react": "^0.274.0",
     "qrcode": "^1.5.3",
     "react": "^18.3.1",
@@ -41,7 +41,7 @@
     "@vitejs/plugin-react-swc": "^3.3.2",
     "autoprefixer": "^10.4.20",
     "is-ci": "^3.0.1",
-    "jazz-run": "workspace:0.9.9",
+    "jazz-run": "workspace:0.9.0",
     "postcss": "^8.4.27",
     "tailwindcss": "^3.4.15",
     "typescript": "~5.6.2",

examples/reactions/CHANGELOG.md

@@ -1,38 +1,5 @@
 # reactions
 
-## 0.0.27
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser-media-images@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.26
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-  - jazz-browser-media-images@0.9.8
-
-## 0.0.25
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.24
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-browser-media-images@0.9.1
-
 ## 0.0.23
 
 ### Patch Changes

examples/reactions/README.md

@@ -2,60 +2,30 @@
 
 Live version: [https://reactions-demo.jazz.tools](https://reactions-demo.jazz.tools)
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example reactions --project-name reactions
-```
-or
-```bash
-npx create-jazz-app@latest --example reactions --project-name reactions
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the reactions example directory:
 ```bash
-cd reactions
+cd jazz/examples/reactions
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/reactions/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/reactions/package.json

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

examples/todo-vue/CHANGELOG.md

@@ -1,33 +1,5 @@
 # todo-vue
 
-## 0.0.32
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-browser@0.9.9
-  - jazz-vue@0.9.9
-
-## 0.0.31
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-browser@0.9.8
-  - jazz-vue@0.9.8
-
-## 0.0.30
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-- Updated dependencies [5d98189]
-  - jazz-browser@0.9.1
-  - jazz-tools@0.9.1
-  - jazz-vue@0.9.1
-
 ## 0.0.29
 
 ### Patch Changes

examples/todo-vue/README.md

@@ -1,59 +1,29 @@
 # Todo list example with Jazz and Vue
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example todo-vue --project-name todo-vue
-```
-or
-```bash
-npx create-jazz-app@latest --example todo-vue --project-name todo-vue
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the todo-vue example directory:
 ```bash
-cd todo-vue
+cd jazz/examples/todo-vue
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/todo-vue/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/todo-vue/package.json

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

examples/todo/CHANGELOG.md

@@ -1,35 +1,5 @@
 # jazz-example-todo
 
-## 0.0.146
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.145
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-
-## 0.0.144
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.143
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-
 ## 0.0.142
 
 ### Patch Changes

examples/todo/README.md

@@ -2,60 +2,30 @@
 
 Live version: https://todo-demo.jazz.tools/
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example todo --project-name todo
-```
-or
-```bash
-npx create-jazz-app@latest --example todo --project-name todo
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the todo example directory:
 ```bash
-cd todo
+cd jazz/examples/todo
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/todo/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Structure
 
 -   [`src/basicComponents`](./src/basicComponents): simple components to build the UI, unrelated to Jazz (uses [shadcn/ui](https://ui.shadcn.com))

examples/todo/package.json

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

examples/todo/src/2_main.tsx

@@ -70,6 +70,7 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
         </JazzAndAuth>
       </div>
     </ThemeProvider>
+    ,
   </React.StrictMode>,
 );
 

examples/version-history/CHANGELOG.md

@@ -1,35 +1,5 @@
 # version-history
 
-## 0.0.24
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - jazz-tools@0.9.9
-  - jazz-react@0.9.9
-
-## 0.0.23
-
-### Patch Changes
-
-- Updated dependencies [d1d773b]
-  - jazz-tools@0.9.8
-  - jazz-react@0.9.8
-
-## 0.0.22
-
-### Patch Changes
-
-- jazz-react@0.9.4
-
-## 0.0.21
-
-### Patch Changes
-
-- Updated dependencies [1b71969]
-  - jazz-react@0.9.1
-  - jazz-tools@0.9.1
-
 ## 0.0.20
 
 ### Patch Changes

examples/version-history/README.md

@@ -2,60 +2,30 @@
 
 A minimal example showing how to use Jazz's built-in version history to show and restore changes.
 
-## Getting started
+## Installing & running the example locally
 
-You can either
-1. Clone the jazz repository, and run the app within the monorepo.
-2. Or create a new Jazz project using this example as a template.
+(This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation))
 
-
-### Using the example as a template
-
-Create a new Jazz project, and use this example as a template.
+Start by downloading the [jazz repository](https://github.com/garden-co/jazz):
 ```bash
-npm create jazz-app@latest --example version-history --project-name version-history
-```
-or
-```bash
-npx create-jazz-app@latest --example version-history --project-name version-history
+npx degit gardencmp/jazz jazz
 ```
 
-Go to the new project directory.
+Go to the version-history example directory:
 ```bash
-cd version-history
+cd jazz/examples/version-history
 ```
 
-Run the dev server.
-```bash
-npm run dev
-```
-
-### Using the monorepo
-
-This requires `pnpm` to be installed, see [https://pnpm.io/installation](https://pnpm.io/installation).
-
-Clone the jazz repository.
-```bash
-git clone https://github.com/garden-co/jazz.git
-```
-
-Install and build dependencies.
+Install and build dependencies:
 ```bash
 pnpm i && npx turbo build
 ```
 
-Go to the example directory.
-```bash
-cd jazz/examples/version-history/
-```
-
-Start the dev server.
+Start the dev server:
 ```bash
 pnpm dev
 ```
 
-Open [http://localhost:5173](http://localhost:5173) with your browser to see the result.
-
 ## Questions / problems / feedback
 
 If you have feedback, let us know on [Discord](https://discord.gg/utDMjHYg42) or open an issue or PR to fix something that seems wrong.

examples/version-history/package.json

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

homepage/gcmp/app/team/page.tsx

@@ -61,6 +61,14 @@ const team: Array<TeamMember> = [
     location: "Portsmouth, UK ",
     github: "bensleveritt",
   },
+  {
+    name: "Marina Orlova",
+    titles: ["Full-Stack Dev"],
+    location: "Tarragona, Spain ",
+    linkedin: "marina-orlova-52a34394",
+    github: "marinoska",
+    image: "marina.jpeg",
+  },
   {
     name: "Giordano Ricci",
     titles: ["Full-Stack Dev", "DevOps"],

homepage/homepage/app/docs/[framework]/[...slug]/design-patterns/form.mdx

@@ -125,7 +125,7 @@ export function CreateOrder() {
   const [draft, setDraft] = useState<DraftBubbleTeaOrder>();
 
   useEffect(() => {
-    setDraft(DraftBubbleTeaOrder.create({}));
+    setDraft(DraftBubbleTeaOrder.create({}, { owner: me }));
   }, [me?.id]);
 
   const onSave = (e: React.FormEvent<HTMLFormElement>) => {
@@ -179,7 +179,7 @@ export function CreateOrder() { // old
   const [draft, setDraft] = useState<DraftBubbleTeaOrder>(); // old
 
   useEffect(() => { // old
-    setDraft(DraftBubbleTeaOrder.create({})); // old
+    setDraft(DraftBubbleTeaOrder.create({}, { owner: me })); // old
   }, [me?.id]); // old
 
   const onSave = (e: React.FormEvent<HTMLFormElement>) => { // old
@@ -229,10 +229,14 @@ export class JazzAccount extends Account {
   root = co.ref(AccountRoot);
 
   migrate(this: JazzAccount, creationProps?: { name: string }) {
-    if (this.root === undefined) {
-      const draft = DraftBubbleTeaOrder.create({});
+    super.migrate(creationProps);
 
-      this.root = AccountRoot.create({ draft });
+    if (!this._refs.root) {
+      const ownership = { owner: this };
+
+      const draft = DraftBubbleTeaOrder.create({}, ownership);
+
+      this.root = AccountRoot.create({ draft }, ownership);
     }
   }
 }
@@ -299,11 +303,11 @@ export function CreateOrder() {// old
 
     // create a new empty draft
     me.root.draft = DraftBubbleTeaOrder.create(
-      {},
+      {}, { owner: me },
     );
   };// old
 
-  return <CreateOrderForm id={me.root.draft.id} onSave={onSave} />
+  return <CreateOrderForm id={me?.root?.draft.id} onSave={onSave} />
 } // old
 
 function CreateOrderForm({

homepage/homepage/app/docs/[framework]/[...slug]/design-patterns/organization.mdx

@@ -54,9 +54,11 @@ export class JazzAccount extends Account {
   root = co.ref(JazzAccountRoot);
 
   async migrate() {
-    if (this.root === undefined) {
+    if (!this._refs.root) {
       // Using a Group as an owner allows you to give access to other users
-      const organizationGroup = Group.create();
+      const initialOrganizationOwnership = {
+        owner: Group.create({ owner: this }),
+      };
 
       const organizations = ListOfOrganizations.create(
         [
@@ -64,15 +66,17 @@ export class JazzAccount extends Account {
           Organization.create(
             {
               name: "My organization",
-              projects: ListOfProjects.create([], organizationGroup),
+              projects: ListOfProjects.create([], initialOrganizationOwnership),
             },
-            organizationGroup,
+            initialOrganizationOwnership,
           ),
         ],
+        { owner: this },
       );
 
       this.root = JazzAccountRoot.create(
         { organizations },
+        { owner: this },
       );
     }
   }
@@ -97,27 +101,22 @@ When the user accepts the invite, add the `Organization` to the user's `organiza
 
 <CodeGroup>
 ```ts
-const onAccept = async (organizationId: ID<Organization>) => {
-  const me = await MusicaAccount.getMe().ensureLoaded({
-    root: {
-      organizations: [],
-    },
-  });
+const onAccept = (organizationId: ID<Organization>) => {
+  if (me?.root?.organizations) {
+    Organization.load(organizationId, me, []).then((organization) => {
+      if (organization) {
+        // Avoid duplicates
+        const ids = me.root.organizations.map(
+          (organization) => organization?.id,
+        );
 
-  if (!me) throw new Error("Failed to load account data");
+        if (ids.includes(organizationId)) return;
 
-  const organization = await Organization.load(organizationId, []);
-
-  if (!organization) throw new Error("Failed to load organization data");
-
-  const ids = me.root.organizations.map(
-    (organization) => organization?.id,
-  );
-
-  if (ids.includes(organizationId)) return;
-
-  me.root.organizations.push(organization);
-  navigate("/organizations/" + organizationId);
+        me.root.organizations.push(organization);
+        navigate("/organizations/" + organizationId);
+      }
+    });
+  }
 };
 
 useAcceptInvite({

homepage/homepage/app/docs/[framework]/[...slug]/groups/intro.mdx

@@ -36,9 +36,9 @@ You can add group members by ID by using `Account.load` and `Group.addMember`.
 ```tsx
 import { Group, Account } from "jazz-tools";
 
-const group = Group.create();
+const group = Group.create({ owner: me });
 
-const bob = await Account.load(bobsID, []);
+const bob = await Account.load(bobsID, me, []);
 group.addMember(bob, "writer");
 ```
 </CodeGroup>
@@ -49,7 +49,7 @@ Note: if the account ID is of type `string`, because it comes from a URL paramet
 ```tsx
 import { Group, Account, ID } from "jazz-tools";
 
-const bob = await Account.load(bobsID as ID<Account>, []);
+const bob = await Account.load(bobsID as ID<Account>, me, []);
 group.addMember(bob, "writer");
 ```
 </CodeGroup>

homepage/homepage/app/docs/[framework]/[...slug]/groups/sharing.mdx

@@ -13,7 +13,7 @@ access to "everyone".
 
 <CodeGroup>
   ```ts
-  const group = Group.create();
+  const group = Group.create({ owner: me });
   group.addMember("everyone", "writer"); // *highlight*
   ```
 </CodeGroup>

homepage/homepage/app/docs/[framework]/[...slug]/guide/react.mdx

@@ -186,8 +186,10 @@ Now, finally, let's implement creating an issue:
 import { useState } from "react"; // old
 import { Issue } from "./schema"; // old
 import { IssueComponent } from "./components/Issue.tsx"; // old
+import { useAccount } from "jazz-react";
 // old
 function App() {// old
+    const { me } = useAccount();
     const [issue, setIssue] = useState<Issue>(); // old
     // old
     const createIssue = () => {
@@ -198,6 +200,7 @@ function App() {// old
                 estimate: 5,
                 status: "backlog",
             },
+            { owner: me },
         );
         setIssue(newIssue);
     };
@@ -231,7 +234,7 @@ We'll already notice one interesting thing here:
 
 -   We have to create every CoValue with an `owner`!
     -   this will determine access rights on the CoValue, which we'll learn about in "Groups & Permissions"
-    -   here the `owner` is set automatically to a group managed by the current user because we have not declared any
+    -   here we set `owner` to the current user `me`, which we get from the Jazz context / `useAccount`
 
 **Behind the scenes, Jazz not only creates the Issue in memory but also automatically syncs an encrypted version to the cloud and persists it locally. The Issue also has a globally unique ID.**
 
@@ -257,10 +260,11 @@ Let's modify `src/App.tsx`:
 import { useState } from "react"; // old
 import { Issue } from "./schema"; // old
 import { IssueComponent } from "./components/Issue.tsx"; // old
-import { useCoState } from "jazz-react";
+import { useAccount, useCoState } from "jazz-react";
 import { ID } from "jazz-tools"
 // old
 function App() { // old
+    const { me } = useAccount(); // old
     const [issueID, setIssueID] = useState<ID<Issue>>();
     // old
     const issue = useCoState(Issue, issueID);
@@ -273,6 +277,7 @@ function App() { // old
                 estimate: 5, // old
                 status: "backlog", // old
             }, // old
+            { owner: me }, // old
         ); // old
         setIssueID(newIssue.id);
     }; // old
@@ -376,9 +381,10 @@ This works because CoValues
   <CodeGroup size="sm">
             ```ts
             function useCoState<V extends CoValue>(Schema: CoValueClass<V>, id?: ID<V>): V | undefined {
+                const { me } = useAccount();
                 const [value, setValue] = useState<V>();
 
-                useEffect(() => Schema.subscribe(id, [], setValue), [id]);
+                useEffect(() => Schema.subscribe(id, me, [], setValue), [id]);
 
                 return value;
             }
@@ -403,10 +409,11 @@ So let's store the ID in the browser's URL and make sure our useState is in sync
 import { useState } from "react"; // old
 import { Issue } from "./schema"; // old
 import { IssueComponent } from "./components/Issue.tsx"; // old
-import { useCoState } from "jazz-react"; // old
+import { useAccount, useCoState } from "jazz-react"; // old
 import { ID } from "jazz-tools" // old
 // old
 function App() { // old
+    const { me } = useAccount(); // old
     const [issueID, setIssueID] = useState<ID<Issue> | undefined>(
         (window.location.search?.replace("?issue=", "") || undefined) as ID<Issue> | undefined,
     );
@@ -421,6 +428,7 @@ function App() { // old
                 estimate: 5, // old
                 status: "backlog", // old
             }, // old
+            { owner: me }, // old
         ); // old
         setIssueID(newIssue.id); // old
         window.history.pushState({}, "", `?issue=${newIssue.id}`);
@@ -462,7 +470,7 @@ All we have to do is create a new group to own each new issue and add "everyone"
 import { useState } from "react"; // old
 import { Issue } from "./schema"; // old
 import { IssueComponent } from "./components/Issue.tsx"; // old
-import { useCoState } from "jazz-react"; // old
+import { useAccount, useCoState } from "jazz-react"; // old
 import { ID, Group } from "jazz-tools"
 // old
 function App() { // old
@@ -556,9 +564,11 @@ First, we'll change `App.tsx` to create and render `Project`s instead of `Issue`
 import { useState } from "react"; // old
 import { Project, ListOfIssues } from "./schema";
 import { ProjectComponent } from "./components/Project.tsx";
+import { useAccount } from "jazz-react";
 import { ID, Group } from "jazz-tools"
 // old
 function App() { // old
+    const { me } = useAccount(); // old
     const [projectID, setProjectID] = useState<ID<Project> | undefined>(
         (window.location.search?.replace("?project=", "") || undefined) as ID<Project> | undefined
     );
@@ -566,7 +576,7 @@ function App() { // old
     const issue = useCoState(Issue, issueID); // *bin*
     // old
     const createProject = () => {
-        const group = Group.create();
+        const group = Group.create({ owner: me });
         group.addMember("everyone", "writer");
 
         const newProject = Project.create(
@@ -574,7 +584,7 @@ function App() { // old
                 name: "New Project",
                 issues: ListOfIssues.create([], { owner: group })
             },
-            group,
+            { owner: group },
         );
         setProjectID(newProject.id);
         window.history.pushState({}, "", `?project=${newProject.id}`);
@@ -612,7 +622,7 @@ export function ProjectComponent({ projectID }: { projectID: ID<Project> }) {
             description: "",
             estimate: 0,
             status: "backlog",
-        },  project._owner));
+        }, { owner: project._owner }));
     };
 
     return project ? (
@@ -663,7 +673,7 @@ export function ProjectComponent({ projectID }: { projectID: ID<Project> }) {//
             description: "",// old
             estimate: 0,// old
             status: "backlog",// old
-        }, project._owner));// old
+        }, { owner: project._owner }));// old
     };// old
 // old
     return project ? (// old
@@ -721,15 +731,17 @@ Turns out, we're already mostly there! First, let's remove making the Project pu
 import { useState } from "react"; // old
 import { Project, ListOfIssues } from "./schema"; // old
 import { ProjectComponent } from "./components/Project.tsx"; // old
+import { useAccount } from "jazz-react"; // old
 import { ID, Group } from "jazz-tools" // old
 // old
 function App() { // old
+    const { me } = useAccount(); // old
     const [projectID, setProjectID] = useState<ID<Project> | undefined>( // old
         (window.location.search?.replace("?project=", "") || undefined) as ID<Project> | undefined, // old
     ); // old
     // old
     const createProject = () => { // old
-        const group = Group.create(); // old
+        const group = Group.create({ owner: me }); // old
         group.addMember("everyone", "writer"); // *bin*
         // old
         const newProject = Project.create( // old
@@ -737,7 +749,7 @@ function App() { // old
                 name: "New Project", // old
                 issues: ListOfIssues.create([], { owner: group }) // old
             }, // old
-            group, // old
+            { owner: group }, // old
         ); // old
         setProjectID(newProject.id); // old
         window.history.pushState({}, "", `?project=${newProject.id}`); // old
@@ -780,7 +792,7 @@ export function ProjectComponent({ projectID }: { projectID: ID<Project> }) {//
             description: "",// old
             estimate: 0,// old
             status: "backlog",// old
-        }, project._owner));// old
+        }, { owner: project._owner }));// old
     };// old
 // old
     return project ? (// old

homepage/homepage/app/docs/[framework]/[...slug]/project-setup/react-native.mdx

@@ -36,7 +36,9 @@ Tested with:
   ```bash
   npx expo install expo-linking expo-secure-store expo-file-system @react-native-community/netinfo @bam.tech/react-native-image-resizer @azure/core-asynciterator-polyfill
 
-  npm i -S react-native-polyfill-globals react-native-url-polyfill web-streams-polyfill@3.2.1 base-64 text-encoding react-native-fetch-api react-native-get-random-values buffer @op-engineering/op-sqlite
+  npm i -S react-native-polyfill-globals react-native-url-polyfill web-streams-polyfill@3.2.1 base-64 text-encoding react-native-fetch-api react-native-get-random-values buffer
+
+  npm i -D @babel/plugin-transform-class-static-block
 
   npm i -S jazz-tools jazz-react-native jazz-react-native-media-images
 
@@ -186,40 +188,19 @@ Lastly, ensure that the `"main"` field in your `package.json` points to `index.j
   ```
 </CodeGroup>
 
-## Setting up the provider
+## Using Jazz
 
-Wrap your app components with the `JazzProvider:
+### `createJazzRNApp()`
+
+Create a file `jazz.tsx` with the following contents:
 
 <CodeGroup>
-      ```tsx
-      import { JazzProvider, useDemoAuth, DemoAuthBasicUI } from "jazz-react-native";
-      import { MyAppAccount } from "./schema";
+  ```tsx
+  import { createJazzRNApp } from "jazz-react-native";
 
-
-      export function JazzAndAuth({ children }: { children: React.ReactNode }) {
-          const [auth, state] = useDemoAuth();
-
-          return (
-              <>
-                  <JazzProvider
-                      auth={auth}
-                      peer="wss://cloud.jazz.tools/?key=you@example.com"
-                      AccountSchema={MyAppAccount}
-                  >
-                      {children}
-                  </JazzProvider>
-                  <DemoAuthBasicUI appName="My App" state={state} />
-              </>
-          ); 
-      }
-
-      // Register the Account schema so `useAccount` returns our custom `MyAppAccount`
-      declare module "jazz-react-native" {
-          interface Register {
-              Account: MyAppAccount;
-          }
-      }
-      ```
+  export const Jazz = createJazzRNApp();
+  export const { useAccount, useCoState, useAcceptInvite } = Jazz;
+  ```
 </CodeGroup>
 
 You can optionally pass a custom `kvStore` and `AccountSchema` to `createJazzRNApp()`, otherwise, it defaults to `ExpoSecureStoreAdapter` and `Account`.
@@ -240,77 +221,24 @@ In the demos, you'll find details on:
 
 ### Working with Images
 
-Jazz provides a complete solution for handling images in React Native, including uploading, processing, and displaying them. Here's how to work with images:
-
-#### Uploading Images
-
-To upload images, use the `createImage` function from `jazz-react-native-media-images`. This function handles image processing and creates an `ImageDefinition` that can be stored in your Jazz covalues:
+To work with images in Jazz, import the `createImage` function from [`jazz-react-native-media-images`](https://github.com/garden-co/jazz/tree/main/packages/jazz-react-native-media-images).
 
 <CodeGroup>
   ```tsx
   import { createImage } from "jazz-react-native-media-images";
-  import * as ImagePicker from 'expo-image-picker';
 
-  // Example: Image upload from device library
-  const handleImageUpload = async () => {
-    try {
-      const result = await ImagePicker.launchImageLibraryAsync({
-        mediaTypes: ImagePicker.MediaTypeOptions.Images,
-        base64: true,  // Important: We need base64 data
-        quality: 0.7,
-      });
+  const base64ImageDataURI = "data:image/png;base64,...";
 
-      if (!result.canceled && result.assets[0].base64) {
-        const base64Uri = `data:image/jpeg;base64,${result.assets[0].base64}`;
+  const image = await createImage(base64ImageDataURI, {
+    owner: newPetPost._owner,
+    maxSize: 2048, // optional: specify maximum image size
+  });
 
-        const image = await createImage(base64Uri, {
-          owner: someCovalue._owner,  // Set appropriate owner
-          maxSize: 2048,  // Optional: limit maximum image size
-        });
-
-        // Store the image in your covalue
-        someCovalue.image = image;
-      }
-    } catch (error) {
-      console.error('Failed to upload image:', error);
-    }
-  };
+  someCovalue.image = image;
   ```
 </CodeGroup>
 
-#### Displaying Images
-
-To display images, use the `ProgressiveImg` component from `jazz-react-native`. This component handles both images uploaded from React Native and desktop browsers:
-
-<CodeGroup>
-  ```tsx
-  import { ProgressiveImg } from "jazz-react-native";
-  import { Image } from "react-native";
-
-  // Inside your render function:
-  <ProgressiveImg image={someCovalue.image} maxWidth={1024}>
-    {({ src, res, originalSize }) => (
-      <Image
-        source={{ uri: src }}
-        style={{
-          width: 300,  // Adjust size as needed
-          height: 300,
-          borderRadius: 8,
-        }}
-        resizeMode="cover"
-      />
-    )}
-  </ProgressiveImg>
-  ```
-</CodeGroup>
-
-The `ProgressiveImg` component:
-- Automatically handles different image formats
-- Provides progressive loading with placeholder images
-- Supports different resolutions based on the `maxWidth` prop
-- Works seamlessly with React Native's `Image` component
-
-For a complete implementation example, see the [Chat Example](https://github.com/garden-co/jazz/blob/main/examples/chat-rn-clerk/app/chat/[chatId].tsx).
+For a complete implementation, please refer to [this](https://github.com/garden-co/jazz/blob/main/examples/pets/src/3_NewPetPostForm.tsx) demo.
 
 ### Running your app
 

homepage/homepage/app/docs/[framework]/[...slug]/schemas/accounts-and-migrations.mdx

@@ -148,16 +148,18 @@ export class MyAppAccount extends Account {
   root = co.ref(MyAppRoot);
 
   async migrate() {
+    const me = this;
+
     // we specifically need to check for undefined, 
     // because the root might simply be not loaded (`null`) yet
-    if (this.root === undefined) {
-      this.root = MyAppRoot.create({
+    if (me.root === undefined) {
+      me.root = MyAppRoot.create({
         // Using a group to set the owner is always a good idea.
         // This way if in the future we want to share 
         // this coValue we can do so easily.
-        myChats: ListOfChats.create([], Group.create()),
-        myContacts: ListOfAccounts.create([], Group.create())
-      });
+        myChats: ListOfChats.create([], Group.create(me)),
+        myContacts: ListOfAccounts.create([], Group.create(me))
+      }, Group.create(me));
     }
   }
 }
@@ -180,15 +182,17 @@ export class MyAppAccount extends Account {
     root = co.ref(MyAppRoot);// old
 
     async migrate() { // old
-      if (this.root === undefined) {  // old
-        this.root = MyAppRoot.create({  // old
-          myChats: ListOfChats.create([], Group.create()),  // old
-          myContacts: ListOfAccounts.create([], Group.create()) // old
-        }); // old
+      const me = this; // old
+
+      if (me.root === undefined) {  // old
+        me.root = MyAppRoot.create({  // old
+          myChats: ListOfChats.create([], Group.create(me)),  // old
+          myContacts: ListOfAccounts.create([], Group.create(me)) // old
+        }, Group.create(me)); // old
       } // old
 
       // We need to load the root field to check for the myContacts field
-      const result = await this.ensureLoaded({
+      const result = await me.ensureLoaded({
         root: {},
       });
 
@@ -199,7 +203,7 @@ export class MyAppAccount extends Account {
       // we specifically need to check for undefined, 
       // because myBookmarks might simply be not loaded (`null`) yet 
       if (root.myBookmarks === undefined) {
-        root.myBookmarks = ListOfBookmarks.create([], Group.create());
+        root.myBookmarks = ListOfBookmarks.create([], Group.create(me));
       }
     }
   }

homepage/homepage/app/docs/[framework]/[...slug]/schemas/covalues.mdx

@@ -52,9 +52,9 @@ import { TodoProject, ListOfTasks } from "./schema";
 const project: TodoProject = TodoProject.create(
     {
         title: "New Project",
-        tasks: ListOfTasks.create([], Group.create()),
+        tasks: ListOfTasks.create([], { owner: me }),
     },
-    Group.create()
+    { owner: me }
 );
 ```
 </CodeGroup>

homepage/homepage/app/docs/[framework]/[...slug]/upgrade/0-9-0.mdx

@@ -21,7 +21,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
   <div>
     The `JazzProvider` is now imported from `jazz-react` instead of `createJazzReactApp`.
 
-    While `createJazzReactApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`,
+    While `createJazzReactApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`, 
     we found that this approach made the Jazz setup awkward and confusing for some users.
 
     So we decided to remove `createJazzReactApp` step and to provide the types through namespace declarations:
@@ -46,29 +46,29 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
                   <JazzProvider
                       auth={passkeyAuth} // old
                       peer="wss://cloud.jazz.tools/?key=you@example.com" // old
-                      AccountSchema={MyAppAccount} {/* The custom Account schema is passed here */} // *add*
+                      AccountSchema={MyAppAccount} {/* The custom Account schema is passed here */}
                   >
                       {children} // old
                   </JazzProvider>
                   <PasskeyAuthBasicUI state={passKeyState} /> // old
               </> // old
-          );
+          ); 
       }
 
       // Register the Account schema so `useAccount` returns our custom `MyAppAccount`
-      declare module "jazz-react" { // *add*
-          interface Register { // *add*
-              Account: MyAppAccount; // *add*
-          } // *add*
-      } // *add*
+      declare module "jazz-react" {
+          interface Register {
+              Account: MyAppAccount;
+          }
+      }
       ```
   </CodeGroup>
 
   <h3>Top level imports for hooks</h3>
 
   <div>
-    All Jazz hooks are now available as top-level imports from the `jazz-react` package.
-
+    All Jazz hooks are now available as top-level imports from the `jazz-react` package. 
+    
     This change improves IDE intellisense support and simplifies imports:
   </div>
 
@@ -86,7 +86,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
             <>
               Hello {me.profile?.name}
             </>
-        );
+        ); 
     }
     ```
   </CodeGroup>
@@ -105,7 +105,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
       ```tsx
       import { createJazzTestAccount, JazzTestProvider } from "jazz-react/testing";
       import { renderHook } from "@testing-library/react"; // old
-      import { usePlaylist } from "./usePlaylist"; // old
+      import { usePlaylist } from "./usePlaylist"; // old 
       import { Playlist, MusicAccount } from "./schema"; // old
 
       test("should load the playlist", async () => {
@@ -146,7 +146,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
   <div>
     The `JazzProvider` is now imported from `jazz-react-native` instead of `createJazzRNApp`.
 
-    While `createJazzRNApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`,
+    While `createJazzRNApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`, 
     we found that this approach made the Jazz setup awkward and confusing for some users.
 
     So we decided to remove `createJazzRNApp` step and to provide the types through namespace declarations:
@@ -177,7 +177,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
                   </JazzProvider>
                   <DemoAuthBasicUI appName="My App" state={state} /> // old
               </> // old
-          );
+          ); 
       }
 
       // Register the Account schema so `useAccount` returns our custom `MyAppAccount`
@@ -192,8 +192,8 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
   <h3>Top level imports for hooks</h3>
 
   <div>
-    All Jazz hooks are now available as top-level imports from the `jazz-react-native` package.
-
+    All Jazz hooks are now available as top-level imports from the `jazz-react-native` package. 
+    
     This change improves IDE intellisense support and simplifies imports:
   </div>
 
@@ -211,7 +211,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
             <>
               Hello {me.profile?.name}
             </>
-        );
+        ); 
     }
     ```
   </CodeGroup>
@@ -271,7 +271,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
   <div>
     The `JazzProvider` is now imported from `jazz-svelte` instead of `createJazzApp`.
 
-    While `createJazzApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`,
+    While `createJazzApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`, 
     we found that this approach made the Jazz setup awkward and confusing for some users.
 
     So we decided to remove `createJazzApp` step and to provide the types through namespace declarations:
@@ -302,7 +302,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
           let AccountSchema = MyAccount;
         </script>
 
-        <JazzProvider {auth} {peer} {AccountSchema}>
+        <JazzProvider {auth} {peer} {AccountSchema}> 
           <App />
         </JazzProvider>
         ```
@@ -311,8 +311,8 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
   <h3>Top level imports for hooks</h3>
 
   <div>
-    All Jazz hooks are now available as top-level imports from the `jazz-svelte` package.
-
+    All Jazz hooks are now available as top-level imports from the `jazz-svelte` package. 
+    
     This change improves IDE intellisense support and simplifies imports:
   </div>
 
@@ -387,7 +387,7 @@ export const metadata = { title: "Upgrade to Jazz 0.9.0" };
   <div>
     The `JazzProvider` is now imported from `jazz-vue` instead of `createJazzVueApp`.
 
-    While `createJazzReactApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`,
+    While `createJazzReactApp` was originally designed to setup strong typing for custom Account schemas in `useAccount`, 
     we found that this approach made the Jazz setup awkward and confusing for some users.
 
     So we decided to remove `createJazzReactApp` step and to provide the types through namespace declarations:
@@ -409,7 +409,7 @@ export const { useAccount, useCoState } = Jazz; // *bin*
 const { JazzProvider } = Jazz; // *bin*
 
 const RootComponent = defineComponent({ // old
-  name: "RootComponent", // old
+  name: "RootComponent", // old 
   setup() { // old
     const { authMethod, state } = useDemoAuth(); // old
     return () => [  // old
@@ -449,8 +449,8 @@ app.mount("#app"); // old
   <h3>Top level imports for hooks</h3>
 
   <div>
-    All Jazz hooks are now available as top-level imports from the `jazz-vue` package.
-
+    All Jazz hooks are now available as top-level imports from the `jazz-vue` package. 
+    
     This change improves IDE intellisense support and simplifies imports:
   </div>
 

homepage/homepage/app/docs/[framework]/[...slug]/upgrade/0-9-8.mdx

@@ -1,74 +0,0 @@
-import { ContentByFramework, CodeGroup } from '@/components/forMdx'
-
-export const metadata = { title: "Upgrade to Jazz 0.9.0" };
-
-# Jazz 0.9.8 - Without me!
-
-<h2 className="not-prose text-sm text-stone-600 dark:text-stone-400 mb-5 pb-2 border-b">
-  14 January 2025
-</h2>
-
-<div>
-  We have simplified the API to make the "me" value always optional!
-
-  This removes the need of using `useAccount` like the 90% of the time!
-</div>
-
-<CodeGroup>
-    {/* prettier-ignore */}
-    ```ts
-    import { useState } from "react"; 
-    import { Issue } from "./schema"; 
-    import { IssueComponent } from "./components/Issue.tsx"; 
-    function App() {
-        const [issue, setIssue] = useState<Issue>(); 
-        
-        const createIssue = () => {
-            setIssue(Issue.create(
-                {
-                    title: "Buy terrarium",
-                    description: "Make sure it's big enough for 10 snails.",
-                    estimate: 5,
-                    status: "backlog",
-                }, // The owner defaults now to a group managed by the current user!
-            ));
-        };
-        
-        if (issue) {
-            return <IssueComponent issue={issue} />; 
-        } else { 
-            return <button onClick={createIssue}>Create Issue</button>;
-        } 
-    } 
-    ```
-</CodeGroup>
-
-<div>
-  This also applies to the load API:
-</div>
-
-<CodeGroup>
-  {/* prettier-ignore */}
-  ```ts
-  const issue = Issue.load(issueId, {})
-  ```
-</CodeGroup>
-
-<div>
-  And `Group.create`:
-</div>
-
-<CodeGroup>
-    {/* prettier-ignore */}
-    ```tsx
-    const group = Group.create()
-    const sharedIssue = Issue.create(payload, group)
-    group.addMember('everyone', 'reader')
-    ```
-</CodeGroup>
-
-<div>
-Everything is backward compatible, so no upgrade steps are required.
-
-With this Jazz API becomes way more lean and more is coming!
-</div>

homepage/homepage/app/docs/[framework]/[...slug]/upgrade/react-native-local-persistence.mdx

@@ -1,49 +0,0 @@
-import { ContentByFramework, CodeGroup } from '@/components/forMdx'
-
-export const metadata = { title: "Enable local persistence" };
-
-# Enable local persistence
-
-<h2 className="not-prose text-sm text-stone-600 dark:text-stone-400 mb-5 pb-2 border-b">
-  10 January 2025
-</h2>
-
-<ContentByFramework framework="react-native">
-  <div>
-    Version 0.9.2 introduces local persistence for React Native apps using SQLite.
-
-    If you are upgrading from a version before 0.9.2, you need to enable local persistence by following the steps below.
-
-    Local persistence will become the default in 0.10.0.
-  </div>
-
-  <h3>Add the required dependencies</h3>
-
-  <div>
-    As SQLite package we now use `@op-engineering/op-sqlite`.
-
-    To get local persistence working, you need to add `@op-engineering/op-sqlite` as a direct dependency to your project and run `npx pod-install`.
-  </div>
-
-  <h3>Update your JazzProvider to enable local persistence</h3>
-
-  <div>
-    Local persistence is now disabled by default.
-
-    To enable it, you need to pass the `storage` option to the `JazzProvider` component:
-  </div>
-
-  <CodeGroup>
-    ```tsx
-    <JazzProvider 
-      auth={auto}
-      storage="sqlite"
-      peer="wss://cloud.jazz.tools/?key=you@example.com"
-      AccountSchema={MyAppAccount}
-    >
-      <App />
-    </JazzProvider>
-    ```
-  </CodeGroup>
-</ContentByFramework>
-

homepage/homepage/components/docs/docs-intro.mdx

@@ -7,18 +7,9 @@ The Jazz docs are currently heavily work in progress, sorry about that!
 ## Quickstart
 
 Run the following command to create a new Jazz project from one of our example apps:
-
 <CodeGroup>
 ```sh
-npm create jazz-app@latest
-```
-</CodeGroup>
-
-or
-
-<CodeGroup>
-```sh
-npx create-jazz-app@latest
+npx create-jazz-app
 ```
 </CodeGroup>
 

homepage/homepage/components/docs/nav.tsx

@@ -12,23 +12,19 @@ export function DocNav({ className }: { className?: string }) {
   const items = docNavigationItems.map((headerItem) => {
     return {
       ...headerItem,
-      items: headerItem.items
-        .filter(
-          (item) => !("framework" in item) || item.framework === framework,
-        )
-        .map((item) => {
-          if (!item.href?.startsWith("/docs")) return item;
+      items: headerItem.items.map((item) => {
+        if (!item.href?.startsWith("/docs")) return item;
 
-          let done =
-            typeof item.done === "number" ? item.done : item.done[framework];
-          let href = item.href.replace("/docs", `/docs/${framework}`);
+        let done =
+          typeof item.done === "number" ? item.done : item.done[framework];
+        let href = item.href.replace("/docs", `/docs/${framework}`);
 
-          return {
-            ...item,
-            href,
-            done,
-          };
-        }),
+        return {
+          ...item,
+          href,
+          done,
+        };
+      }),
     };
   });
 

homepage/homepage/components/nav.tsx

@@ -1,6 +1,5 @@
 import { ThemeToggle } from "@/components/ThemeToggle";
 import { socials } from "@/lib/socials";
-import { useFramework } from "@/lib/use-framework";
 import { JazzLogo } from "gcmp-design-system/src/app/components/atoms/logos/JazzLogo";
 import { Nav } from "gcmp-design-system/src/app/components/organisms/Nav";
 import { DocNav } from "./docs/nav";

homepage/homepage/genDocs.mjs

@@ -3,11 +3,12 @@ import { Application } from "typedoc";
 for (const { packageName, entryPoint, tsconfig, typedocOptions } of [
   {
     packageName: "jazz-tools",
-    entryPoint: "exports.ts",
+    entryPoint: "index.web.ts",
+    tsconfig: "tsconfig.web.json",
   },
   {
     packageName: "jazz-react",
-    entryPoint: "index.ts",
+    entryPoint: "index.tsx",
     typedocOptions: {
       skipErrorChecking: true, // TODO: remove this. Temporary workaround
     },

homepage/homepage/lib/docNavigationItems.ts

@@ -50,27 +50,9 @@ export const docNavigationItems = [
         href: "/docs/project-setup/server-side",
         done: 80,
       },
-    ],
-  },
-  {
-    name: "Updates",
-    items: [
       {
         // upgrade guides
-        name: "Jazz 0.9.8 - Without me!",
-        href: "/docs/upgrade/0-9-8",
-        done: 100,
-      },
-      {
-        // upgrade guides
-        name: "Jazz 0.9.2 - Local persistence on React Native",
-        href: "/docs/upgrade/react-native-local-persistence",
-        done: 100,
-        framework: "react-native",
-      },
-      {
-        // upgrade guides
-        name: "Jazz 0.9.0 - Upgrade guide",
+        name: "Upgrade to Jazz 0.9.0",
         href: "/docs/upgrade/0-9-0",
         done: 100,
       },

packages/cojson-storage-indexeddb/CHANGELOG.md

@@ -1,13 +1,5 @@
 # cojson-storage-indexeddb
 
-## 0.9.9
-
-### Patch Changes
-
-- Updated dependencies [8eb9247]
-  - cojson@0.9.9
-  - cojson-storage@0.9.9
-
 ## 0.9.0
 
 ### Patch Changes

packages/cojson-storage-indexeddb/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cojson-storage-indexeddb",
-  "version": "0.9.9",
+  "version": "0.9.0",
   "main": "dist/index.js",
   "type": "module",
   "types": "src/index.ts",

packages/cojson-storage-rn-sqlite/.gitignore

@@ -1,171 +0,0 @@
-# Based on https://raw.githubusercontent.com/github/gitignore/main/Node.gitignore
-
-# Logs
-
-logs
-_.log
-npm-debug.log_
-yarn-debug.log*
-yarn-error.log*
-lerna-debug.log*
-.pnpm-debug.log*
-
-# Diagnostic reports (https://nodejs.org/api/report.html)
-
-report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json
-
-# Runtime data
-
-pids
-_.pid
-_.seed
-\*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-
-lib-cov
-
-# Coverage directory used by tools like istanbul
-
-coverage
-\*.lcov
-
-# nyc test coverage
-
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-
-bower_components
-
-# node-waf configuration
-
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-
-build/Release
-
-# Dependency directories
-
-node_modules/
-jspm_packages/
-
-# Snowpack dependency directory (https://snowpack.dev/)
-
-web_modules/
-
-# TypeScript cache
-
-\*.tsbuildinfo
-
-# Optional npm cache directory
-
-.npm
-
-# Optional eslint cache
-
-.eslintcache
-
-# Optional stylelint cache
-
-.stylelintcache
-
-# Microbundle cache
-
-.rpt2_cache/
-.rts2_cache_cjs/
-.rts2_cache_es/
-.rts2_cache_umd/
-
-# Optional REPL history
-
-.node_repl_history
-
-# Output of 'npm pack'
-
-\*.tgz
-
-# Yarn Integrity file
-
-.yarn-integrity
-
-# dotenv environment variable files
-
-.env
-.env.development.local
-.env.test.local
-.env.production.local
-.env.local
-
-# parcel-bundler cache (https://parceljs.org/)
-
-.cache
-.parcel-cache
-
-# Next.js build output
-
-.next
-out
-
-# Nuxt.js build / generate output
-
-.nuxt
-dist
-
-# Gatsby files
-
-.cache/
-
-# Comment in the public line in if your project uses Gatsby and not Next.js
-
-# https://nextjs.org/blog/next-9-1#public-directory-support
-
-# public
-
-# vuepress build output
-
-.vuepress/dist
-
-# vuepress v2.x temp and cache directory
-
-.temp
-.cache
-
-# Docusaurus cache and generated files
-
-.docusaurus
-
-# Serverless directories
-
-.serverless/
-
-# FuseBox cache
-
-.fusebox/
-
-# DynamoDB Local files
-
-.dynamodb/
-
-# TernJS port file
-
-.tern-port
-
-# Stores VSCode versions used for testing VSCode extensions
-
-.vscode-test
-
-# yarn v2
-
-.yarn/cache
-.yarn/unplugged
-.yarn/build-state.yml
-.yarn/install-state.gz
-.pnp.\*
-
-.DS_Store

packages/cojson-storage-rn-sqlite/.npmignore

@@ -1,2 +0,0 @@
-coverage
-node_modules