community-jazz-vue 0.17.13 → 0.18.0

package/.turbo/turbo-build.log

@@ -1,9 +1,9 @@
 
-> community-jazz-vue@0.17.13 build /home/runner/_work/jazz/jazz/packages/community-jazz-vue
+> community-jazz-vue@0.18.0 build /home/runner/_work/jazz/jazz/packages/community-jazz-vue
 > pnpm typecheck && rm -rf ./dist && vite build
 
 
-> community-jazz-vue@0.17.13 typecheck /home/runner/_work/jazz/jazz/packages/community-jazz-vue
+> community-jazz-vue@0.18.0 typecheck /home/runner/_work/jazz/jazz/packages/community-jazz-vue
 > vue-tsc --noEmit
 
 vite v6.3.5 building for production...
@@ -15,7 +15,7 @@ rendering chunks...
 computing gzip size...
 dist/testing.js             1.28 kB │ gzip: 0.54 kB │ map:  1.84 kB
 dist/provider-CCZVJj45.js   4.15 kB │ gzip: 1.25 kB │ map:  7.94 kB
-dist/index.js              19.83 kB │ gzip: 4.94 kB │ map: 35.03 kB
-[vite:dts] Declaration files built in 2392ms.
+dist/index.js              19.88 kB │ gzip: 4.96 kB │ map: 35.13 kB
+[vite:dts] Declaration files built in 2292ms.
 
-✓ built in 2.53s
+✓ built in 2.42s

package/CHANGELOG.md

@@ -1,5 +1,45 @@
 # jazz-react
 
+## 0.18.0
+
+### Minor Changes
+
+- f263856: Add `$jazz` field to CoValues:
+  - This field contains Jazz methods that cluttered CoValues' API, as well as Jazz internal properties. This field is not enumerable, to allow CoValues to behave similarly to JSON objects.
+  - Added a `$jazz.set` method to update a CoValue's fields. When updating collaborative fields, you can pass in JSON objects instead of CoValues and Jazz will create
+    the CoValues automatically (similarly to CoValue `create` methods).
+  - All CoMap methods have been moved into `$jazz`, to allow defining any arbitrary key in the CoMap (except for `$jazz`) without conflicts.
+    - For CoMaps created with `co.map`, fields are now `readonly` to prevent setting properties directly. Use the `$jazz.set` method instead.
+    - CoMaps created with class schemas don't get type errors on direct property assignments, but they get a runtime errors prompting indicating to use `$jazz.set`.
+    - the `delete` operator can no longer be used to delete CoRecord properties. Use `$jazz.delete` instead.
+  - CoList's array-mutation methods have been moved into `$jazz`, in order to prevent using methods
+    - CoLists are now readonly arrays. Trying to use any mutation method yields a type error.
+    - `$jazz.set` can be used in place of direct element assignments.
+    - Added two new utility methods: `$jazz.remove` and `$jazz.retain`. They allow editing a CoList in-place with a simpler API than `$jazz.splice`.
+    - `sort`, `reverse`, `fill` and `copyWithin` have been deprecated, given that they could behave inconsistently with CoLists. `$jazz` replacements may be introduced
+      in future releases.
+  - `.$jazz.owner` now always returns a Group (instead of a Group or an Account). We'll be migrating away of having Accounts as CoValue owners in future releases.
+  - Removed `castAs`, since it's an inherently unsafe operation that bypassed typechecking and enabled using CoValues in unsupported ways.
+  - Removed the `id` and `_type` fields from `toJSON()`'s output in Account, CoMap, CoFeed & FileStream, to make CoValues behave more similarly to JSON objects.
+  - Removed the `root` and `profile` fields from Group.
+
+### Patch Changes
+
+- Updated dependencies [b709494]
+- Updated dependencies [f263856]
+  - cojson@0.18.0
+  - jazz-tools@0.18.0
+
+## 0.17.14
+
+### Patch Changes
+
+- Updated dependencies [1094b7c]
+- Updated dependencies [6378ad5]
+- Updated dependencies [cc2f774]
+  - cojson@0.17.14
+  - jazz-tools@0.17.14
+
 ## 0.17.13
 
 ### Patch Changes

package/dist/index.js

@@ -54,7 +54,11 @@ function useAccount(AccountSchema = Account, options) {
     };
   }
   const contextMe = context.value.me;
-  const me = useCoState(AccountSchema, contextMe.id, options);
+  const me = useCoState(
+    AccountSchema,
+    toRaw(contextMe).$jazz.id,
+    options
+  );
   return {
     me: computed(() => {
       const value = (options == null ? void 0 : options.resolve) === void 0 ? me.value || contextMe : me.value;
@@ -600,12 +604,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         dimensions.value.height || dimensions.value.width || 9999
       );
       if (!bestImage) return image.value.placeholderDataURL;
-      if ((lastBestImage == null ? void 0 : lastBestImage[0]) === bestImage.image.id) return lastBestImage == null ? void 0 : lastBestImage[1];
+      if ((lastBestImage == null ? void 0 : lastBestImage[0]) === bestImage.image.$jazz.id)
+        return lastBestImage == null ? void 0 : lastBestImage[1];
       const blob = bestImage.image.toBlob();
       if (blob) {
         const url = URL.createObjectURL(blob);
         revokeObjectURL(lastBestImage == null ? void 0 : lastBestImage[1]);
-        lastBestImage = [bestImage.image.id, url];
+        lastBestImage = [bestImage.image.$jazz.id, url];
         return url;
       }
       return image.value.placeholderDataURL;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/composables.ts","../src/auth/useIsAuthenticated.ts","../src/auth/usePassphraseAuth.ts","../src/auth/usePasskeyAuth.ts","../src/auth/useClerkAuth.ts","../src/auth/JazzVueProviderWithClerk.ts","../src/auth/PasskeyAuthBasicUI.vue","../src/Image.vue"],"sourcesContent":["import {\n  Account,\n  AccountClass,\n  AnonymousJazzAgent,\n  AnyAccountSchema,\n  type AuthSecretStorage,\n  type CoValue,\n  CoValueClassOrSchema,\n  InboxSender,\n  InstanceOfSchema,\n  type JazzAuthContext,\n  JazzContextManager,\n  type JazzContextType,\n  type Loaded,\n  type RefsToResolve,\n  ResolveQuery,\n  ResolveQueryStrict,\n  coValueClassFromCoValueClassOrSchema,\n  subscribeToCoValue,\n} from \"jazz-tools\";\nimport { consumeInviteLinkFromWindowLocation } from \"jazz-tools/browser\";\nimport {\n  type ComputedRef,\n  type Ref,\n  type ShallowRef,\n  computed,\n  inject,\n  markRaw,\n  nextTick,\n  onMounted,\n  onUnmounted,\n  ref,\n  shallowRef,\n  toRaw,\n  watch,\n} from \"vue\";\n\nimport {\n  JazzAuthContextSymbol,\n  JazzContextManagerSymbol,\n  JazzContextSymbol,\n} from \"./provider.js\";\n\nexport const logoutHandler = ref<() => void>();\n\nfunction getCurrentAccountFromContextManager<Acc extends Account>(\n  contextManager: JazzContextManager<Acc, any>,\n) {\n  const context = contextManager.getCurrentValue();\n\n  if (!context) {\n    throw new Error(\"No context found\");\n  }\n\n  return \"me\" in context ? context.me : context.guest;\n}\n\nexport function useJazzContext<Acc extends Account>(): Ref<\n  JazzContextType<Acc>,\n  JazzContextType<Acc>\n> {\n  const context = inject<Ref<JazzContextType<Acc>>>(JazzContextSymbol);\n  if (!context) {\n    throw new Error(\"useJazzContext must be used within a JazzProvider\");\n  }\n  return context;\n}\n\nexport function useJazzContextManager<Acc extends Account>() {\n  const context = inject<Ref<JazzContextManager<Acc, {}>>>(\n    JazzContextManagerSymbol,\n  );\n\n  if (!context?.value) {\n    throw new Error(\n      \"You need to set up a JazzProvider on top of your app to use this hook.\",\n    );\n  }\n\n  return context;\n}\n\nexport function useAuthSecretStorage() {\n  const context = inject<AuthSecretStorage>(JazzAuthContextSymbol);\n  if (!context) {\n    throw new Error(\"useAuthSecretStorage must be used within a JazzProvider\");\n  }\n  return context;\n}\n\nexport function useAccount<\n  A extends AccountClass<Account> | AnyAccountSchema = typeof Account,\n  R extends ResolveQuery<A> = true,\n>(\n  AccountSchema: A = Account as unknown as A,\n  options?: {\n    resolve?: ResolveQueryStrict<A, R>;\n  },\n): {\n  me: ComputedRef<Loaded<A, R> | undefined | null>;\n  agent: AnonymousJazzAgent | Loaded<A, true>;\n  logOut: () => void;\n} {\n  const context = useJazzContext();\n  const contextManager = useJazzContextManager<InstanceOfSchema<A>>();\n\n  if (!context.value) {\n    throw new Error(\"useAccount must be used within a JazzProvider\");\n  }\n\n  const agent = getCurrentAccountFromContextManager(contextManager.value);\n\n  // Handle guest mode - return null for me and the guest agent\n  if (!(\"me\" in context.value)) {\n    return {\n      me: computed(() => null) as any,\n      agent: agent,\n      logOut: context.value.logOut,\n    };\n  }\n\n  const contextMe = context.value.me as InstanceOfSchema<A>;\n\n  const me = useCoState(AccountSchema as any, contextMe.id, options as any);\n\n  return {\n    me: computed(() => {\n      const value =\n        options?.resolve === undefined ? me.value || contextMe : me.value;\n      return value ? markRaw(value) : value;\n    }) as any,\n    agent: agent,\n    logOut: context.value.logOut,\n  };\n}\n\nexport function useCoState<\n  S extends CoValueClassOrSchema,\n  const R extends RefsToResolve<S> = true,\n>(\n  Schema: S,\n  id: string | undefined,\n  options?: { resolve?: ResolveQueryStrict<S, R> },\n): Ref<Loaded<S, R> | undefined | null> {\n  const state: ShallowRef<Loaded<S, R> | undefined | null> =\n    shallowRef(undefined);\n  const context = useJazzContext();\n\n  if (!context.value) {\n    throw new Error(\"useCoState must be used within a JazzProvider\");\n  }\n\n  let unsubscribe: (() => void) | undefined;\n\n  watch(\n    [() => id, context],\n    ([currentId, currentContext]) => {\n      if (unsubscribe) {\n        unsubscribe();\n        unsubscribe = undefined;\n      }\n\n      if (!currentId || !currentContext) {\n        state.value = undefined;\n        return;\n      }\n\n      const loadAsAgent =\n        \"me\" in currentContext ? currentContext.me : currentContext.guest;\n      if (!loadAsAgent) {\n        state.value = undefined;\n        return;\n      }\n\n      const safeLoadAsAgent = toRaw(loadAsAgent);\n\n      try {\n        unsubscribe = subscribeToCoValue(\n          coValueClassFromCoValueClassOrSchema(Schema),\n          currentId as any,\n          {\n            resolve: options?.resolve as any,\n            loadAs: safeLoadAsAgent,\n            onUnavailable: () => {\n              state.value = null;\n            },\n            onUnauthorized: () => {\n              state.value = null;\n            },\n            syncResolution: true,\n          },\n          (value: any) => {\n            // Use markRaw to prevent Vue from making Jazz objects reactive\n            // but still allow property access and mutations\n            state.value = value ? markRaw(value) : value;\n          },\n        );\n      } catch (error) {\n        console.error(\"Error in useCoState subscription:\", error);\n        state.value = null;\n      }\n    },\n    { immediate: true },\n  );\n\n  onUnmounted(() => {\n    if (unsubscribe) {\n      unsubscribe();\n      unsubscribe = undefined;\n    }\n  });\n\n  return state;\n}\n\nexport function useAcceptInvite<S extends CoValueClassOrSchema>({\n  invitedObjectSchema,\n  onAccept,\n  forValueHint,\n}: {\n  invitedObjectSchema: S;\n  onAccept: (projectID: string) => void;\n  forValueHint?: string;\n}): void {\n  const context = useJazzContext();\n\n  if (!context.value) {\n    throw new Error(\"useAcceptInvite must be used within a JazzProvider\");\n  }\n\n  if (!(\"me\" in context.value)) {\n    throw new Error(\n      \"useAcceptInvite can't be used in a JazzProvider with auth === 'guest'.\",\n    );\n  }\n\n  const handleInvite = () => {\n    const result = consumeInviteLinkFromWindowLocation({\n      as: toRaw((context.value as JazzAuthContext<Account>).me),\n      invitedObjectSchema,\n      forValueHint,\n    });\n\n    result\n      .then((res) => res && onAccept(res.valueID))\n      .catch((e) => {\n        console.error(\"Failed to accept invite\", e);\n      });\n  };\n\n  onMounted(() => {\n    handleInvite();\n    window.addEventListener(\"hashchange\", handleInvite);\n  });\n\n  onUnmounted(() => {\n    window.removeEventListener(\"hashchange\", handleInvite);\n  });\n\n  watch(\n    () => onAccept,\n    (newOnAccept, oldOnAccept) => {\n      if (newOnAccept !== oldOnAccept) {\n        handleInvite();\n      }\n    },\n  );\n}\n\nexport function experimental_useInboxSender<\n  I extends CoValue,\n  O extends CoValue | undefined,\n>(inboxOwnerID: string | undefined) {\n  const context = useJazzContext();\n\n  if (!context.value) {\n    throw new Error(\n      \"experimental_useInboxSender must be used within a JazzProvider\",\n    );\n  }\n\n  if (!(\"me\" in context.value)) {\n    throw new Error(\n      \"experimental_useInboxSender can't be used in a JazzProvider with auth === 'guest'.\",\n    );\n  }\n\n  const me = computed(() => (context.value as JazzAuthContext<Account>).me);\n  const inboxRef = ref<Promise<InboxSender<I, O>> | undefined>(undefined);\n\n  const sendMessage = async (message: I) => {\n    if (!inboxOwnerID) throw new Error(\"Inbox owner ID is required\");\n\n    if (!inboxRef.value) {\n      const inbox = InboxSender.load<I, O>(inboxOwnerID, toRaw(me.value));\n      inboxRef.value = inbox;\n    }\n\n    let inbox = await inboxRef.value;\n\n    if (inbox.owner.id !== inboxOwnerID) {\n      const req = InboxSender.load<I, O>(inboxOwnerID, toRaw(me.value));\n      inboxRef.value = req;\n      inbox = await req;\n    }\n\n    return inbox.sendMessage(message);\n  };\n\n  watch(\n    () => inboxOwnerID,\n    () => {\n      inboxRef.value = undefined;\n    },\n  );\n\n  return sendMessage;\n}\n\n// useAccountOrGuest has been removed in v0.15.4 to match React library.\n// It has been merged into useAccount which now handles both authenticated and guest scenarios.\n// This change maintains 1:1 API compatibility with the React Jazz library.\n// If you were using useAccountOrGuest, please migrate to useAccount.\n","import { onUnmounted, ref } from \"vue\";\nimport { useAuthSecretStorage } from \"../composables.js\";\n\nexport function useIsAuthenticated() {\n  const authSecretStorage = useAuthSecretStorage();\n  const isAuthenticated = ref(authSecretStorage.isAuthenticated);\n\n  const handleUpdate = (newIsAuthenticated: boolean) => {\n    isAuthenticated.value = newIsAuthenticated;\n  };\n\n  // Set up the listener immediately, not waiting for onMounted\n  // This ensures we catch auth state changes that happen before mounting\n  const cleanup = authSecretStorage.onUpdate(handleUpdate);\n\n  onUnmounted(() => {\n    cleanup();\n  });\n\n  return isAuthenticated;\n}\n","import { PassphraseAuth } from \"jazz-tools\";\nimport { computed, markRaw, ref, watchEffect } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\nimport { useIsAuthenticated } from \"./useIsAuthenticated.js\";\n\n/**\n * `usePassphraseAuth` composable provides a `JazzAuth` object for passphrase authentication.\n *\n * @example\n * ```ts\n * const auth = usePassphraseAuth({ wordlist });\n * ```\n *\n * @category Auth Providers\n */\nexport function usePassphraseAuth({ wordlist }: { wordlist: string[] }) {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n  const isAuthenticated = useIsAuthenticated();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Passphrase auth is not supported in guest mode\");\n  }\n\n  const authMethod = computed(() => {\n    return markRaw(\n      new PassphraseAuth(\n        context.value.node.crypto,\n        context.value.authenticate,\n        context.value.register,\n        authSecretStorage,\n        wordlist,\n      ),\n    );\n  });\n\n  const passphrase = ref(authMethod.value.passphrase);\n\n  watchEffect((onCleanup) => {\n    authMethod.value.loadCurrentAccountPassphrase();\n\n    const unsubscribe = authMethod.value.subscribe(() => {\n      passphrase.value = authMethod.value.passphrase;\n    });\n\n    onCleanup(unsubscribe);\n  });\n\n  return computed(() => ({\n    state: isAuthenticated.value ? \"signedIn\" : \"anonymous\",\n    logIn: authMethod.value.logIn,\n    signUp: authMethod.value.signUp,\n    registerNewAccount: authMethod.value.registerNewAccount,\n    generateRandomPassphrase: authMethod.value.generateRandomPassphrase,\n    passphrase: passphrase.value,\n  }));\n}\n","import { BrowserPasskeyAuth } from \"jazz-tools/browser\";\nimport { computed, markRaw } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\nimport { useIsAuthenticated } from \"./useIsAuthenticated.js\";\n\n/**\n * `usePasskeyAuth` composable provides a `JazzAuth` object for passkey authentication.\n *\n * @example\n * ```ts\n * const auth = usePasskeyAuth({ appName, appHostname });\n * ```\n *\n * @category Auth Providers\n */\nexport function usePasskeyAuth({\n  appName,\n  appHostname,\n}: {\n  appName: string;\n  appHostname?: string;\n}) {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n  const isAuthenticated = useIsAuthenticated();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Passkey auth is not supported in guest mode\");\n  }\n\n  const authMethod = computed(() => {\n    return markRaw(\n      new BrowserPasskeyAuth(\n        context.value.node.crypto,\n        context.value.authenticate,\n        authSecretStorage,\n        appName,\n        appHostname,\n      ),\n    );\n  });\n\n  return computed(() => ({\n    state: isAuthenticated.value ? \"signedIn\" : \"anonymous\",\n    logIn: authMethod.value.logIn,\n    signUp: authMethod.value.signUp,\n  }));\n}\n","import { JazzClerkAuth, type MinimalClerkClient } from \"jazz-tools\";\nimport { computed, markRaw, onMounted, onUnmounted } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\n\nexport function useClerkAuth(clerk: MinimalClerkClient) {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Clerk auth is not supported in guest mode\");\n  }\n\n  // Create auth method similar to React's useMemo pattern\n  const authMethod = computed(() => {\n    return markRaw(\n      new JazzClerkAuth(\n        context.value.authenticate,\n        context.value.logOut,\n        authSecretStorage,\n      ),\n    );\n  });\n\n  onMounted(() => {\n    const cleanup = authMethod.value.registerListener(clerk) as\n      | (() => void)\n      | void;\n\n    onUnmounted(() => {\n      // Clerk's addListener returns a cleanup function, but the type says void\n      // Handle both cases for type safety\n      if (typeof cleanup === \"function\") {\n        cleanup();\n      }\n    });\n  });\n\n  return authMethod.value;\n}\n","import type {\n  Account,\n  AccountClass,\n  AnyAccountSchema,\n  CoValueFromRaw,\n  SyncConfig,\n} from \"jazz-tools\";\nimport {\n  InMemoryKVStore,\n  JazzClerkAuth,\n  KvStoreContext,\n  type MinimalClerkClient,\n} from \"jazz-tools\";\nimport { LocalStorageKVStore } from \"jazz-tools/browser\";\nimport { type PropType, defineComponent, h, onMounted, ref } from \"vue\";\nimport { JazzVueProvider } from \"../provider.js\";\nimport { useClerkAuth } from \"./useClerkAuth.js\";\n\nfunction setupKvStore() {\n  KvStoreContext.getInstance().initialize(\n    typeof window === \"undefined\"\n      ? new InMemoryKVStore()\n      : new LocalStorageKVStore(),\n  );\n}\n\nconst RegisterClerkAuth = defineComponent({\n  name: \"RegisterClerkAuth\",\n  props: {\n    clerk: {\n      type: Object as PropType<MinimalClerkClient>,\n      required: true,\n    },\n  },\n  setup(props, { slots }) {\n    useClerkAuth(props.clerk);\n    return () => slots.default?.();\n  },\n});\n\nexport const JazzVueProviderWithClerk = defineComponent({\n  name: \"JazzVueProviderWithClerk\",\n  props: {\n    clerk: {\n      type: Object as PropType<MinimalClerkClient>,\n      required: true,\n    },\n    AccountSchema: {\n      type: Function as unknown as PropType<\n        (AccountClass<Account> & CoValueFromRaw<Account>) | AnyAccountSchema\n      >,\n      required: false,\n    },\n    guestMode: {\n      type: Boolean,\n      default: false,\n    },\n    sync: {\n      type: Object as PropType<SyncConfig>,\n      required: true,\n    },\n    storage: {\n      type: String as PropType<\"indexedDB\">,\n      default: undefined,\n    },\n    defaultProfileName: {\n      type: String,\n      required: false,\n    },\n    onLogOut: {\n      type: Function as PropType<() => void>,\n      required: false,\n    },\n    onAnonymousAccountDiscarded: {\n      type: Function as PropType<(anonymousAccount: any) => Promise<void>>,\n      required: false,\n    },\n    enableSSR: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props, { slots }) {\n    const isLoaded = ref(false);\n\n    onMounted(async () => {\n      try {\n        setupKvStore();\n        await JazzClerkAuth.initializeAuth(props.clerk);\n        isLoaded.value = true;\n      } catch (error) {\n        console.error(\"Jazz + Clerk initialization error:\", error);\n        // Still render even if auth init fails\n        isLoaded.value = true;\n      }\n    });\n\n    return () => {\n      if (!isLoaded.value) {\n        return null;\n      }\n\n      // Destructure props to exclude 'clerk' which JazzVueProvider doesn't accept\n      const { clerk, ...jazzProviderProps } = props;\n\n      return h(\n        JazzVueProvider,\n        {\n          ...jazzProviderProps,\n          logOutReplacement: clerk.signOut,\n        },\n        {\n          default: () =>\n            h(\n              RegisterClerkAuth,\n              { clerk },\n              { default: () => slots.default?.() },\n            ),\n        },\n      );\n    };\n  },\n});\n","<template>\n  <div v-if=\"auth.state === 'signedIn'\">\n    <slot />\n  </div>\n  <div v-else :style=\"containerStyle\">\n    <div :style=\"cardStyle\">\n      <h1 :style=\"headingStyle\">{{ appName }}</h1>\n      \n      <div v-if=\"error\" :style=\"errorStyle\">\n        {{ error }}\n      </div>\n\n      <form @submit.prevent=\"handleSignUp\" :style=\"formStyle\">\n        <input\n          v-model=\"username\"\n          type=\"text\"\n          placeholder=\"Display name\"\n          autocomplete=\"name\"\n          :style=\"inputStyle\"\n        />\n        <button type=\"submit\" :style=\"primaryButtonStyle\">\n          Sign up\n        </button>\n      </form>\n\n      <button @click=\"handleLogIn\" :style=\"secondaryButtonStyle\">\n        Log in with existing account\n      </button>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { usePasskeyAuth } from \"./usePasskeyAuth.js\";\n\ninterface Props {\n  appName: string;\n  appHostname?: string;\n}\n\nconst props = defineProps<Props>();\n\nconst username = ref(\"\");\nconst error = ref<string | null>(null);\n\nconst auth = usePasskeyAuth({\n  appName: props.appName,\n  appHostname: props.appHostname,\n});\n\nfunction handleError(err: Error) {\n  if (err.cause instanceof Error) {\n    error.value = err.cause.message;\n  } else {\n    error.value = err.message;\n  }\n}\n\nconst handleSignUp = async () => {\n  if (!username.value.trim()) {\n    error.value = \"Name is required\";\n    return;\n  }\n\n  error.value = null;\n  try {\n    await auth.value.signUp(username.value.trim());\n  } catch (err) {\n    handleError(err as Error);\n  }\n};\n\nconst handleLogIn = async () => {\n  error.value = null;\n  try {\n    await auth.value.logIn();\n  } catch (err) {\n    handleError(err as Error);\n  }\n};\n\n// Styles (matching React version)\nconst containerStyle = {\n  width: \"100vw\",\n  height: \"100vh\",\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"center\",\n  backgroundColor: \"#f3f4f6\",\n  padding: \"1rem\",\n};\n\nconst cardStyle = {\n  backgroundColor: \"white\",\n  padding: \"2rem\",\n  borderRadius: \"0.5rem\",\n  boxShadow: \"0 10px 15px -3px rgba(0, 0, 0, 0.1)\",\n  width: \"100%\",\n  maxWidth: \"18rem\",\n  display: \"flex\",\n  flexDirection: \"column\" as const,\n  gap: \"2rem\",\n};\n\nconst headingStyle = {\n  fontSize: \"1.5rem\",\n  fontWeight: \"bold\",\n  textAlign: \"center\" as const,\n  margin: \"0\",\n};\n\nconst errorStyle = {\n  color: \"red\",\n  fontSize: \"0.875rem\",\n  textAlign: \"center\" as const,\n};\n\nconst formStyle = {\n  display: \"flex\",\n  flexDirection: \"column\" as const,\n  gap: \"0.5rem\",\n};\n\nconst inputStyle = {\n  padding: \"0.75rem\",\n  border: \"1px solid #d1d5db\",\n  borderRadius: \"0.375rem\",\n  fontSize: \"1rem\",\n};\n\nconst primaryButtonStyle = {\n  backgroundColor: \"#3b82f6\",\n  color: \"white\",\n  padding: \"0.75rem 1rem\",\n  border: \"none\",\n  borderRadius: \"0.375rem\",\n  cursor: \"pointer\",\n  fontSize: \"1rem\",\n  fontWeight: \"500\",\n};\n\nconst secondaryButtonStyle = {\n  backgroundColor: \"#e5e7eb\",\n  color: \"#374151\",\n  padding: \"0.75rem 1rem\",\n  border: \"none\",\n  borderRadius: \"0.375rem\",\n  cursor: \"pointer\",\n  fontSize: \"1rem\",\n  fontWeight: \"500\",\n};\n</script>\n","<script setup lang=\"ts\">\nimport { ImageDefinition } from \"jazz-tools\";\nimport { highestResAvailable } from \"jazz-tools/media\";\nimport { onUnmounted, ref, watch, computed } from \"vue\";\nimport { useCoState } from \"./composables.js\";\n\nexport interface ImageProps {\n  /** The ID of the ImageDefinition to display */\n  imageId: string;\n  /**\n   * The desired width of the image. Can be a number in pixels or \"original\" to use the image's original width.\n   * When set to a number, the component will select the best available resolution and maintain aspect ratio.\n   */\n  width?: number | \"original\";\n  /**\n   * The desired height of the image. Can be a number in pixels or \"original\" to use the image's original height.\n   * When set to a number, the component will select the best available resolution and maintain aspect ratio.\n   */\n  height?: number | \"original\";\n  /** Alt text for the image */\n  alt?: string;\n  /** CSS classes to apply to the image */\n  classNames?: string;\n  /** CSS styles to apply to the image */\n  style?: string | Record<string, string>;\n  /** Loading strategy for the image */\n  loading?: \"lazy\" | \"eager\";\n}\n\nconst props = withDefaults(defineProps<ImageProps>(), {\n  loading: \"eager\",\n});\n\nconst image = useCoState(ImageDefinition, props.imageId, {});\nlet lastBestImage: [string, string] | null = null;\n\n/**\n * For lazy loading, we use the browser's strategy for images with loading=\"lazy\".\n * We use an empty image, and when the browser triggers the load event, we load the best available image.\n */\nconst waitingLazyLoading = ref(props.loading === \"lazy\");\nconst lazyPlaceholder = computed(() =>\n  waitingLazyLoading.value ? URL.createObjectURL(emptyPixelBlob) : undefined,\n);\n\nconst dimensions = computed(() => {\n  const originalWidth = image.value?.originalSize?.[0];\n  const originalHeight = image.value?.originalSize?.[1];\n\n  // Both width and height are \"original\"\n  if (props.width === \"original\" && props.height === \"original\") {\n    return { width: originalWidth, height: originalHeight };\n  }\n\n  // Width is \"original\", height is a number\n  if (props.width === \"original\" && typeof props.height === \"number\") {\n    if (originalWidth && originalHeight) {\n      return {\n        width: Math.round((props.height * originalWidth) / originalHeight),\n        height: props.height,\n      };\n    }\n    return { width: undefined, height: props.height };\n  }\n\n  // Height is \"original\", width is a number\n  if (props.height === \"original\" && typeof props.width === \"number\") {\n    if (originalWidth && originalHeight) {\n      return {\n        width: props.width,\n        height: Math.round((props.width * originalHeight) / originalWidth),\n      };\n    }\n    return { width: props.width, height: undefined };\n  }\n\n  // In all other cases, use the property value:\n  return {\n    width: props.width === \"original\" ? originalWidth : props.width,\n    height: props.height === \"original\" ? originalHeight : props.height,\n  };\n});\n\nconst src = computed(() => {\n  if (waitingLazyLoading.value) {\n    return lazyPlaceholder.value;\n  }\n\n  if (!image.value) return undefined;\n\n  const bestImage = highestResAvailable(\n    image.value,\n    dimensions.value.width || dimensions.value.height || 9999,\n    dimensions.value.height || dimensions.value.width || 9999,\n  );\n\n  if (!bestImage) return image.value.placeholderDataURL;\n  if (lastBestImage?.[0] === bestImage.image.id) return lastBestImage?.[1];\n\n  const blob = bestImage.image.toBlob();\n\n  if (blob) {\n    const url = URL.createObjectURL(blob);\n    revokeObjectURL(lastBestImage?.[1]);\n    lastBestImage = [bestImage.image.id, url];\n    return url;\n  }\n\n  return image.value.placeholderDataURL;\n});\n\nconst onThresholdReached = () => {\n  waitingLazyLoading.value = false;\n};\n\n// Cleanup object URL on component destroy\nonUnmounted(() => {\n  revokeObjectURL(lastBestImage?.[1]);\n});\n\nfunction revokeObjectURL(url: string | undefined) {\n  if (url && url.startsWith(\"blob:\")) {\n    URL.revokeObjectURL(url);\n  }\n}\n\nconst emptyPixelBlob = new Blob(\n  [\n    Uint8Array.from(\n      atob(\n        \"iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==\",\n      ),\n      (c) => c.charCodeAt(0),\n    ),\n  ],\n  { type: \"image/png\" },\n);\n</script>\n\n<template>\n  <img\n    :src=\"src\"\n    :width=\"dimensions.width\"\n    :height=\"dimensions.height\"\n    :alt=\"alt\"\n    :class=\"classNames\"\n    :style=\"style\"\n    :loading=\"loading\"\n    @load=\"waitingLazyLoading ? onThresholdReached() : undefined\"\n  />\n</template>\n"],"names":["inbox"],"mappings":";;;;;;;;AA2CO,MAAM,gBAAgB,IAAgB;AAE7C,SAAS,oCACP,gBACA;AACM,QAAA,UAAU,eAAe,gBAAgB;AAE/C,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,kBAAkB;AAAA,EAAA;AAGpC,SAAO,QAAQ,UAAU,QAAQ,KAAK,QAAQ;AAChD;AAEO,SAAS,iBAGd;AACM,QAAA,UAAU,OAAkC,iBAAiB;AACnE,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,mDAAmD;AAAA,EAAA;AAE9D,SAAA;AACT;AAEO,SAAS,wBAA6C;AAC3D,QAAM,UAAU;AAAA,IACd;AAAA,EACF;AAEI,MAAA,EAAC,mCAAS,QAAO;AACnB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAGK,SAAA;AACT;AAEO,SAAS,uBAAuB;AAC/B,QAAA,UAAU,OAA0B,qBAAqB;AAC/D,MAAI,CAAC,SAAS;AACN,UAAA,IAAI,MAAM,yDAAyD;AAAA,EAAA;AAEpE,SAAA;AACT;AAEgB,SAAA,WAId,gBAAmB,SACnB,SAOA;AACA,QAAM,UAAU,eAAe;AAC/B,QAAM,iBAAiB,sBAA2C;AAE9D,MAAA,CAAC,QAAQ,OAAO;AACZ,UAAA,IAAI,MAAM,+CAA+C;AAAA,EAAA;AAG3D,QAAA,QAAQ,oCAAoC,eAAe,KAAK;AAGlE,MAAA,EAAE,QAAQ,QAAQ,QAAQ;AACrB,WAAA;AAAA,MACL,IAAI,SAAS,MAAM,IAAI;AAAA,MACvB;AAAA,MACA,QAAQ,QAAQ,MAAM;AAAA,IACxB;AAAA,EAAA;AAGI,QAAA,YAAY,QAAQ,MAAM;AAEhC,QAAM,KAAK,WAAW,eAAsB,UAAU,IAAI,OAAc;AAEjE,SAAA;AAAA,IACL,IAAI,SAAS,MAAM;AACjB,YAAM,SACJ,mCAAS,aAAY,SAAY,GAAG,SAAS,YAAY,GAAG;AACvD,aAAA,QAAQ,QAAQ,KAAK,IAAI;AAAA,IAAA,CACjC;AAAA,IACD;AAAA,IACA,QAAQ,QAAQ,MAAM;AAAA,EACxB;AACF;AAEgB,SAAA,WAId,QACA,IACA,SACsC;AAChC,QAAA,QACJ,WAAW,MAAS;AACtB,QAAM,UAAU,eAAe;AAE3B,MAAA,CAAC,QAAQ,OAAO;AACZ,UAAA,IAAI,MAAM,+CAA+C;AAAA,EAAA;AAG7D,MAAA;AAEJ;AAAA,IACE,CAAC,MAAM,IAAI,OAAO;AAAA,IAClB,CAAC,CAAC,WAAW,cAAc,MAAM;AAC/B,UAAI,aAAa;AACH,oBAAA;AACE,sBAAA;AAAA,MAAA;AAGZ,UAAA,CAAC,aAAa,CAAC,gBAAgB;AACjC,cAAM,QAAQ;AACd;AAAA,MAAA;AAGF,YAAM,cACJ,QAAQ,iBAAiB,eAAe,KAAK,eAAe;AAC9D,UAAI,CAAC,aAAa;AAChB,cAAM,QAAQ;AACd;AAAA,MAAA;AAGI,YAAA,kBAAkB,MAAM,WAAW;AAErC,UAAA;AACY,sBAAA;AAAA,UACZ,qCAAqC,MAAM;AAAA,UAC3C;AAAA,UACA;AAAA,YACE,SAAS,mCAAS;AAAA,YAClB,QAAQ;AAAA,YACR,eAAe,MAAM;AACnB,oBAAM,QAAQ;AAAA,YAChB;AAAA,YACA,gBAAgB,MAAM;AACpB,oBAAM,QAAQ;AAAA,YAChB;AAAA,YACA,gBAAgB;AAAA,UAClB;AAAA,UACA,CAAC,UAAe;AAGd,kBAAM,QAAQ,QAAQ,QAAQ,KAAK,IAAI;AAAA,UAAA;AAAA,QAE3C;AAAA,eACO,OAAO;AACN,gBAAA,MAAM,qCAAqC,KAAK;AACxD,cAAM,QAAQ;AAAA,MAAA;AAAA,IAElB;AAAA,IACA,EAAE,WAAW,KAAK;AAAA,EACpB;AAEA,cAAY,MAAM;AAChB,QAAI,aAAa;AACH,kBAAA;AACE,oBAAA;AAAA,IAAA;AAAA,EAChB,CACD;AAEM,SAAA;AACT;AAEO,SAAS,gBAAgD;AAAA,EAC9D;AAAA,EACA;AAAA,EACA;AACF,GAIS;AACP,QAAM,UAAU,eAAe;AAE3B,MAAA,CAAC,QAAQ,OAAO;AACZ,UAAA,IAAI,MAAM,oDAAoD;AAAA,EAAA;AAGlE,MAAA,EAAE,QAAQ,QAAQ,QAAQ;AAC5B,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAGF,QAAM,eAAe,MAAM;AACzB,UAAM,SAAS,oCAAoC;AAAA,MACjD,IAAI,MAAO,QAAQ,MAAmC,EAAE;AAAA,MACxD;AAAA,MACA;AAAA,IAAA,CACD;AAGE,WAAA,KAAK,CAAC,QAAQ,OAAO,SAAS,IAAI,OAAO,CAAC,EAC1C,MAAM,CAAC,MAAM;AACJ,cAAA,MAAM,2BAA2B,CAAC;AAAA,IAAA,CAC3C;AAAA,EACL;AAEA,YAAU,MAAM;AACD,iBAAA;AACN,WAAA,iBAAiB,cAAc,YAAY;AAAA,EAAA,CACnD;AAED,cAAY,MAAM;AACT,WAAA,oBAAoB,cAAc,YAAY;AAAA,EAAA,CACtD;AAED;AAAA,IACE,MAAM;AAAA,IACN,CAAC,aAAa,gBAAgB;AAC5B,UAAI,gBAAgB,aAAa;AAClB,qBAAA;AAAA,MAAA;AAAA,IACf;AAAA,EAEJ;AACF;AAEO,SAAS,4BAGd,cAAkC;AAClC,QAAM,UAAU,eAAe;AAE3B,MAAA,CAAC,QAAQ,OAAO;AAClB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAGE,MAAA,EAAE,QAAQ,QAAQ,QAAQ;AAC5B,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAGF,QAAM,KAAK,SAAS,MAAO,QAAQ,MAAmC,EAAE;AAClE,QAAA,WAAW,IAA4C,MAAS;AAEhE,QAAA,cAAc,OAAO,YAAe;AACxC,QAAI,CAAC,aAAoB,OAAA,IAAI,MAAM,4BAA4B;AAE3D,QAAA,CAAC,SAAS,OAAO;AACnB,YAAMA,SAAQ,YAAY,KAAW,cAAc,MAAM,GAAG,KAAK,CAAC;AAClE,eAAS,QAAQA;AAAAA,IAAA;AAGf,QAAA,QAAQ,MAAM,SAAS;AAEvB,QAAA,MAAM,MAAM,OAAO,cAAc;AACnC,YAAM,MAAM,YAAY,KAAW,cAAc,MAAM,GAAG,KAAK,CAAC;AAChE,eAAS,QAAQ;AACjB,cAAQ,MAAM;AAAA,IAAA;AAGT,WAAA,MAAM,YAAY,OAAO;AAAA,EAClC;AAEA;AAAA,IACE,MAAM;AAAA,IACN,MAAM;AACJ,eAAS,QAAQ;AAAA,IAAA;AAAA,EAErB;AAEO,SAAA;AACT;AC1TO,SAAS,qBAAqB;AACnC,QAAM,oBAAoB,qBAAqB;AACzC,QAAA,kBAAkB,IAAI,kBAAkB,eAAe;AAEvD,QAAA,eAAe,CAAC,uBAAgC;AACpD,oBAAgB,QAAQ;AAAA,EAC1B;AAIM,QAAA,UAAU,kBAAkB,SAAS,YAAY;AAEvD,cAAY,MAAM;AACR,YAAA;AAAA,EAAA,CACT;AAEM,SAAA;AACT;ACLgB,SAAA,kBAAkB,EAAE,YAAoC;AACtE,QAAM,UAAU,eAAe;AAC/B,QAAM,oBAAoB,qBAAqB;AAC/C,QAAM,kBAAkB,mBAAmB;AAEvC,MAAA,WAAW,QAAQ,OAAO;AACtB,UAAA,IAAI,MAAM,gDAAgD;AAAA,EAAA;AAG5D,QAAA,aAAa,SAAS,MAAM;AACzB,WAAA;AAAA,MACL,IAAI;AAAA,QACF,QAAQ,MAAM,KAAK;AAAA,QACnB,QAAQ,MAAM;AAAA,QACd,QAAQ,MAAM;AAAA,QACd;AAAA,QACA;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA,CACD;AAED,QAAM,aAAa,IAAI,WAAW,MAAM,UAAU;AAElD,cAAY,CAAC,cAAc;AACzB,eAAW,MAAM,6BAA6B;AAE9C,UAAM,cAAc,WAAW,MAAM,UAAU,MAAM;AACxC,iBAAA,QAAQ,WAAW,MAAM;AAAA,IAAA,CACrC;AAED,cAAU,WAAW;AAAA,EAAA,CACtB;AAED,SAAO,SAAS,OAAO;AAAA,IACrB,OAAO,gBAAgB,QAAQ,aAAa;AAAA,IAC5C,OAAO,WAAW,MAAM;AAAA,IACxB,QAAQ,WAAW,MAAM;AAAA,IACzB,oBAAoB,WAAW,MAAM;AAAA,IACrC,0BAA0B,WAAW,MAAM;AAAA,IAC3C,YAAY,WAAW;AAAA,EAAA,EACvB;AACJ;ACzCO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AACF,GAGG;AACD,QAAM,UAAU,eAAe;AAC/B,QAAM,oBAAoB,qBAAqB;AAC/C,QAAM,kBAAkB,mBAAmB;AAEvC,MAAA,WAAW,QAAQ,OAAO;AACtB,UAAA,IAAI,MAAM,6CAA6C;AAAA,EAAA;AAGzD,QAAA,aAAa,SAAS,MAAM;AACzB,WAAA;AAAA,MACL,IAAI;AAAA,QACF,QAAQ,MAAM,KAAK;AAAA,QACnB,QAAQ,MAAM;AAAA,QACd;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA,CACD;AAED,SAAO,SAAS,OAAO;AAAA,IACrB,OAAO,gBAAgB,QAAQ,aAAa;AAAA,IAC5C,OAAO,WAAW,MAAM;AAAA,IACxB,QAAQ,WAAW,MAAM;AAAA,EAAA,EACzB;AACJ;AC3CO,SAAS,aAAa,OAA2B;AACtD,QAAM,UAAU,eAAe;AAC/B,QAAM,oBAAoB,qBAAqB;AAE3C,MAAA,WAAW,QAAQ,OAAO;AACtB,UAAA,IAAI,MAAM,2CAA2C;AAAA,EAAA;AAIvD,QAAA,aAAa,SAAS,MAAM;AACzB,WAAA;AAAA,MACL,IAAI;AAAA,QACF,QAAQ,MAAM;AAAA,QACd,QAAQ,MAAM;AAAA,QACd;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA,CACD;AAED,YAAU,MAAM;AACd,UAAM,UAAU,WAAW,MAAM,iBAAiB,KAAK;AAIvD,gBAAY,MAAM;AAGZ,UAAA,OAAO,YAAY,YAAY;AACzB,gBAAA;AAAA,MAAA;AAAA,IACV,CACD;AAAA,EAAA,CACF;AAED,SAAO,WAAW;AACpB;ACpBA,SAAS,eAAe;AACtB,iBAAe,cAAc;AAAA,IAC3B,OAAO,WAAW,cACd,IAAI,gBAAgB,IACpB,IAAI,oBAAoB;AAAA,EAC9B;AACF;AAEA,MAAM,oBAAoB,gBAAgB;AAAA,EACxC,MAAM;AAAA,EACN,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA,EAEd;AAAA,EACA,MAAM,OAAO,EAAE,SAAS;AACtB,iBAAa,MAAM,KAAK;AACjB,WAAA,MAAA;;AAAM,yBAAM,YAAN;AAAA;AAAA,EAAgB;AAEjC,CAAC;AAEM,MAAM,2BAA2B,gBAAgB;AAAA,EACtD,MAAM;AAAA,EACN,OAAO;AAAA,IACL,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,eAAe;AAAA,MACb,MAAM;AAAA,MAGN,UAAU;AAAA,IACZ;AAAA,IACA,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA,oBAAoB;AAAA,MAClB,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,UAAU;AAAA,MACR,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,6BAA6B;AAAA,MAC3B,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EAEb;AAAA,EACA,MAAM,OAAO,EAAE,SAAS;AAChB,UAAA,WAAW,IAAI,KAAK;AAE1B,cAAU,YAAY;AAChB,UAAA;AACW,qBAAA;AACP,cAAA,cAAc,eAAe,MAAM,KAAK;AAC9C,iBAAS,QAAQ;AAAA,eACV,OAAO;AACN,gBAAA,MAAM,sCAAsC,KAAK;AAEzD,iBAAS,QAAQ;AAAA,MAAA;AAAA,IACnB,CACD;AAED,WAAO,MAAM;AACP,UAAA,CAAC,SAAS,OAAO;AACZ,eAAA;AAAA,MAAA;AAIT,YAAM,EAAE,OAAO,GAAG,kBAAA,IAAsB;AAEjC,aAAA;AAAA,QACL;AAAA,QACA;AAAA,UACE,GAAG;AAAA,UACH,mBAAmB,MAAM;AAAA,QAC3B;AAAA,QACA;AAAA,UACE,SAAS,MACP;AAAA,YACE;AAAA,YACA,EAAE,MAAM;AAAA,YACR,EAAE,SAAS;;AAAM,iCAAM,YAAN;AAAA,cAAkB;AAAA,UAAA;AAAA,QACrC;AAAA,MAEN;AAAA,IACF;AAAA,EAAA;AAEJ,CAAC;;;;;;;;;ACjFD,UAAM,QAAQ;AAER,UAAA,WAAW,IAAI,EAAE;AACjB,UAAA,QAAQ,IAAmB,IAAI;AAErC,UAAM,OAAO,eAAe;AAAA,MAC1B,SAAS,MAAM;AAAA,MACf,aAAa,MAAM;AAAA,IAAA,CACpB;AAED,aAAS,YAAY,KAAY;AAC3B,UAAA,IAAI,iBAAiB,OAAO;AACxB,cAAA,QAAQ,IAAI,MAAM;AAAA,MAAA,OACnB;AACL,cAAM,QAAQ,IAAI;AAAA,MAAA;AAAA,IACpB;AAGF,UAAM,eAAe,YAAY;AAC/B,UAAI,CAAC,SAAS,MAAM,QAAQ;AAC1B,cAAM,QAAQ;AACd;AAAA,MAAA;AAGF,YAAM,QAAQ;AACV,UAAA;AACF,cAAM,KAAK,MAAM,OAAO,SAAS,MAAM,MAAM;AAAA,eACtC,KAAK;AACZ,oBAAY,GAAY;AAAA,MAAA;AAAA,IAE5B;AAEA,UAAM,cAAc,YAAY;AAC9B,YAAM,QAAQ;AACV,UAAA;AACI,cAAA,KAAK,MAAM,MAAM;AAAA,eAChB,KAAK;AACZ,oBAAY,GAAY;AAAA,MAAA;AAAA,IAE5B;AAGA,UAAM,iBAAiB;AAAA,MACrB,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,MACjB,SAAS;AAAA,IACX;AAEA,UAAM,YAAY;AAAA,MAChB,iBAAiB;AAAA,MACjB,SAAS;AAAA,MACT,cAAc;AAAA,MACd,WAAW;AAAA,MACX,OAAO;AAAA,MACP,UAAU;AAAA,MACV,SAAS;AAAA,MACT,eAAe;AAAA,MACf,KAAK;AAAA,IACP;AAEA,UAAM,eAAe;AAAA,MACnB,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,WAAW;AAAA,MACX,QAAQ;AAAA,IACV;AAEA,UAAM,aAAa;AAAA,MACjB,OAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAW;AAAA,IACb;AAEA,UAAM,YAAY;AAAA,MAChB,SAAS;AAAA,MACT,eAAe;AAAA,MACf,KAAK;AAAA,IACP;AAEA,UAAM,aAAa;AAAA,MACjB,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,cAAc;AAAA,MACd,UAAU;AAAA,IACZ;AAEA,UAAM,qBAAqB;AAAA,MACzB,iBAAiB;AAAA,MACjB,OAAO;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,YAAY;AAAA,IACd;AAEA,UAAM,uBAAuB;AAAA,MAC3B,iBAAiB;AAAA,MACjB,OAAO;AAAA,MACP,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,cAAc;AAAA,MACd,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,YAAY;AAAA,IACd;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC1HA,UAAM,QAAQ;AAId,UAAM,QAAQ,WAAW,iBAAiB,MAAM,SAAS,CAAA,CAAE;AAC3D,QAAI,gBAAyC;AAM7C,UAAM,qBAAqB,IAAI,MAAM,YAAY,MAAM;AACvD,UAAM,kBAAkB;AAAA,MAAS,MAC/B,mBAAmB,QAAQ,IAAI,gBAAgB,cAAc,IAAI;AAAA,IACnE;AAEM,UAAA,aAAa,SAAS,MAAM;;AAChC,YAAM,iBAAgB,iBAAM,UAAN,mBAAa,iBAAb,mBAA4B;AAClD,YAAM,kBAAiB,iBAAM,UAAN,mBAAa,iBAAb,mBAA4B;AAGnD,UAAI,MAAM,UAAU,cAAc,MAAM,WAAW,YAAY;AAC7D,eAAO,EAAE,OAAO,eAAe,QAAQ,eAAe;AAAA,MAAA;AAIxD,UAAI,MAAM,UAAU,cAAc,OAAO,MAAM,WAAW,UAAU;AAClE,YAAI,iBAAiB,gBAAgB;AAC5B,iBAAA;AAAA,YACL,OAAO,KAAK,MAAO,MAAM,SAAS,gBAAiB,cAAc;AAAA,YACjE,QAAQ,MAAM;AAAA,UAChB;AAAA,QAAA;AAEF,eAAO,EAAE,OAAO,QAAW,QAAQ,MAAM,OAAO;AAAA,MAAA;AAIlD,UAAI,MAAM,WAAW,cAAc,OAAO,MAAM,UAAU,UAAU;AAClE,YAAI,iBAAiB,gBAAgB;AAC5B,iBAAA;AAAA,YACL,OAAO,MAAM;AAAA,YACb,QAAQ,KAAK,MAAO,MAAM,QAAQ,iBAAkB,aAAa;AAAA,UACnE;AAAA,QAAA;AAEF,eAAO,EAAE,OAAO,MAAM,OAAO,QAAQ,OAAU;AAAA,MAAA;AAI1C,aAAA;AAAA,QACL,OAAO,MAAM,UAAU,aAAa,gBAAgB,MAAM;AAAA,QAC1D,QAAQ,MAAM,WAAW,aAAa,iBAAiB,MAAM;AAAA,MAC/D;AAAA,IAAA,CACD;AAEK,UAAA,MAAM,SAAS,MAAM;AACzB,UAAI,mBAAmB,OAAO;AAC5B,eAAO,gBAAgB;AAAA,MAAA;AAGrB,UAAA,CAAC,MAAM,MAAc,QAAA;AAEzB,YAAM,YAAY;AAAA,QAChB,MAAM;AAAA,QACN,WAAW,MAAM,SAAS,WAAW,MAAM,UAAU;AAAA,QACrD,WAAW,MAAM,UAAU,WAAW,MAAM,SAAS;AAAA,MACvD;AAEA,UAAI,CAAC,UAAkB,QAAA,MAAM,MAAM;AAC/B,WAAA,+CAAgB,QAAO,UAAU,MAAM,GAAI,QAAO,+CAAgB;AAEhE,YAAA,OAAO,UAAU,MAAM,OAAO;AAEpC,UAAI,MAAM;AACF,cAAA,MAAM,IAAI,gBAAgB,IAAI;AACpB,wBAAA,+CAAgB,EAAE;AAClC,wBAAgB,CAAC,UAAU,MAAM,IAAI,GAAG;AACjC,eAAA;AAAA,MAAA;AAGT,aAAO,MAAM,MAAM;AAAA,IAAA,CACpB;AAED,UAAM,qBAAqB,MAAM;AAC/B,yBAAmB,QAAQ;AAAA,IAC7B;AAGA,gBAAY,MAAM;AACA,sBAAA,+CAAgB,EAAE;AAAA,IAAA,CACnC;AAED,aAAS,gBAAgB,KAAyB;AAChD,UAAI,OAAO,IAAI,WAAW,OAAO,GAAG;AAClC,YAAI,gBAAgB,GAAG;AAAA,MAAA;AAAA,IACzB;AAGF,UAAM,iBAAiB,IAAI;AAAA,MACzB;AAAA,QACE,WAAW;AAAA,UACT;AAAA,YACE;AAAA,UACF;AAAA,UACA,CAAC,MAAM,EAAE,WAAW,CAAC;AAAA,QAAA;AAAA,MAEzB;AAAA,MACA,EAAE,MAAM,YAAY;AAAA,IACtB;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":["../src/composables.ts","../src/auth/useIsAuthenticated.ts","../src/auth/usePassphraseAuth.ts","../src/auth/usePasskeyAuth.ts","../src/auth/useClerkAuth.ts","../src/auth/JazzVueProviderWithClerk.ts","../src/auth/PasskeyAuthBasicUI.vue","../src/Image.vue"],"sourcesContent":["import {\n  Account,\n  AccountClass,\n  AnonymousJazzAgent,\n  AnyAccountSchema,\n  type AuthSecretStorage,\n  type CoValue,\n  CoValueClassOrSchema,\n  InboxSender,\n  InstanceOfSchema,\n  type JazzAuthContext,\n  JazzContextManager,\n  type JazzContextType,\n  type Loaded,\n  type RefsToResolve,\n  ResolveQuery,\n  ResolveQueryStrict,\n  coValueClassFromCoValueClassOrSchema,\n  subscribeToCoValue,\n} from \"jazz-tools\";\nimport { consumeInviteLinkFromWindowLocation } from \"jazz-tools/browser\";\nimport {\n  type ComputedRef,\n  type Ref,\n  type ShallowRef,\n  computed,\n  inject,\n  markRaw,\n  nextTick,\n  onMounted,\n  onUnmounted,\n  ref,\n  shallowRef,\n  toRaw,\n  watch,\n} from \"vue\";\n\nimport {\n  JazzAuthContextSymbol,\n  JazzContextManagerSymbol,\n  JazzContextSymbol,\n} from \"./provider.js\";\n\nexport const logoutHandler = ref<() => void>();\n\nfunction getCurrentAccountFromContextManager<Acc extends Account>(\n  contextManager: JazzContextManager<Acc, any>,\n) {\n  const context = contextManager.getCurrentValue();\n\n  if (!context) {\n    throw new Error(\"No context found\");\n  }\n\n  return \"me\" in context ? context.me : context.guest;\n}\n\nexport function useJazzContext<Acc extends Account>(): Ref<\n  JazzContextType<Acc>,\n  JazzContextType<Acc>\n> {\n  const context = inject<Ref<JazzContextType<Acc>>>(JazzContextSymbol);\n  if (!context) {\n    throw new Error(\"useJazzContext must be used within a JazzProvider\");\n  }\n  return context;\n}\n\nexport function useJazzContextManager<Acc extends Account>() {\n  const context = inject<Ref<JazzContextManager<Acc, {}>>>(\n    JazzContextManagerSymbol,\n  );\n\n  if (!context?.value) {\n    throw new Error(\n      \"You need to set up a JazzProvider on top of your app to use this hook.\",\n    );\n  }\n\n  return context;\n}\n\nexport function useAuthSecretStorage() {\n  const context = inject<AuthSecretStorage>(JazzAuthContextSymbol);\n  if (!context) {\n    throw new Error(\"useAuthSecretStorage must be used within a JazzProvider\");\n  }\n  return context;\n}\n\nexport function useAccount<\n  A extends AccountClass<Account> | AnyAccountSchema = typeof Account,\n  R extends ResolveQuery<A> = true,\n>(\n  AccountSchema: A = Account as unknown as A,\n  options?: {\n    resolve?: ResolveQueryStrict<A, R>;\n  },\n): {\n  me: ComputedRef<Loaded<A, R> | undefined | null>;\n  agent: AnonymousJazzAgent | Loaded<A, true>;\n  logOut: () => void;\n} {\n  const context = useJazzContext();\n  const contextManager = useJazzContextManager<InstanceOfSchema<A>>();\n\n  if (!context.value) {\n    throw new Error(\"useAccount must be used within a JazzProvider\");\n  }\n\n  const agent = getCurrentAccountFromContextManager(contextManager.value);\n\n  // Handle guest mode - return null for me and the guest agent\n  if (!(\"me\" in context.value)) {\n    return {\n      me: computed(() => null) as any,\n      agent: agent,\n      logOut: context.value.logOut,\n    };\n  }\n\n  const contextMe = context.value.me as InstanceOfSchema<A>;\n\n  const me = useCoState(\n    AccountSchema as any,\n    toRaw(contextMe).$jazz.id,\n    options as any,\n  );\n\n  return {\n    me: computed(() => {\n      const value =\n        options?.resolve === undefined ? me.value || contextMe : me.value;\n      return value ? markRaw(value) : value;\n    }) as any,\n    agent: agent,\n    logOut: context.value.logOut,\n  };\n}\n\nexport function useCoState<\n  S extends CoValueClassOrSchema,\n  const R extends RefsToResolve<S> = true,\n>(\n  Schema: S,\n  id: string | undefined,\n  options?: { resolve?: ResolveQueryStrict<S, R> },\n): Ref<Loaded<S, R> | undefined | null> {\n  const state: ShallowRef<Loaded<S, R> | undefined | null> =\n    shallowRef(undefined);\n  const context = useJazzContext();\n\n  if (!context.value) {\n    throw new Error(\"useCoState must be used within a JazzProvider\");\n  }\n\n  let unsubscribe: (() => void) | undefined;\n\n  watch(\n    [() => id, context],\n    ([currentId, currentContext]) => {\n      if (unsubscribe) {\n        unsubscribe();\n        unsubscribe = undefined;\n      }\n\n      if (!currentId || !currentContext) {\n        state.value = undefined;\n        return;\n      }\n\n      const loadAsAgent =\n        \"me\" in currentContext ? currentContext.me : currentContext.guest;\n      if (!loadAsAgent) {\n        state.value = undefined;\n        return;\n      }\n\n      const safeLoadAsAgent = toRaw(loadAsAgent);\n\n      try {\n        unsubscribe = subscribeToCoValue(\n          coValueClassFromCoValueClassOrSchema(Schema),\n          currentId as any,\n          {\n            resolve: options?.resolve as any,\n            loadAs: safeLoadAsAgent,\n            onUnavailable: () => {\n              state.value = null;\n            },\n            onUnauthorized: () => {\n              state.value = null;\n            },\n            syncResolution: true,\n          },\n          (value: any) => {\n            // Use markRaw to prevent Vue from making Jazz objects reactive\n            // but still allow property access and mutations\n            state.value = value ? markRaw(value) : value;\n          },\n        );\n      } catch (error) {\n        console.error(\"Error in useCoState subscription:\", error);\n        state.value = null;\n      }\n    },\n    { immediate: true },\n  );\n\n  onUnmounted(() => {\n    if (unsubscribe) {\n      unsubscribe();\n      unsubscribe = undefined;\n    }\n  });\n\n  return state;\n}\n\nexport function useAcceptInvite<S extends CoValueClassOrSchema>({\n  invitedObjectSchema,\n  onAccept,\n  forValueHint,\n}: {\n  invitedObjectSchema: S;\n  onAccept: (projectID: string) => void;\n  forValueHint?: string;\n}): void {\n  const context = useJazzContext();\n\n  if (!context.value) {\n    throw new Error(\"useAcceptInvite must be used within a JazzProvider\");\n  }\n\n  if (!(\"me\" in context.value)) {\n    throw new Error(\n      \"useAcceptInvite can't be used in a JazzProvider with auth === 'guest'.\",\n    );\n  }\n\n  const handleInvite = () => {\n    const result = consumeInviteLinkFromWindowLocation({\n      as: toRaw((context.value as JazzAuthContext<Account>).me),\n      invitedObjectSchema,\n      forValueHint,\n    });\n\n    result\n      .then((res) => res && onAccept(res.valueID))\n      .catch((e) => {\n        console.error(\"Failed to accept invite\", e);\n      });\n  };\n\n  onMounted(() => {\n    handleInvite();\n    window.addEventListener(\"hashchange\", handleInvite);\n  });\n\n  onUnmounted(() => {\n    window.removeEventListener(\"hashchange\", handleInvite);\n  });\n\n  watch(\n    () => onAccept,\n    (newOnAccept, oldOnAccept) => {\n      if (newOnAccept !== oldOnAccept) {\n        handleInvite();\n      }\n    },\n  );\n}\n\nexport function experimental_useInboxSender<\n  I extends CoValue,\n  O extends CoValue | undefined,\n>(inboxOwnerID: string | undefined) {\n  const context = useJazzContext();\n\n  if (!context.value) {\n    throw new Error(\n      \"experimental_useInboxSender must be used within a JazzProvider\",\n    );\n  }\n\n  if (!(\"me\" in context.value)) {\n    throw new Error(\n      \"experimental_useInboxSender can't be used in a JazzProvider with auth === 'guest'.\",\n    );\n  }\n\n  const me = computed(() => (context.value as JazzAuthContext<Account>).me);\n  const inboxRef = ref<Promise<InboxSender<I, O>> | undefined>(undefined);\n\n  const sendMessage = async (message: I) => {\n    if (!inboxOwnerID) throw new Error(\"Inbox owner ID is required\");\n\n    if (!inboxRef.value) {\n      const inbox = InboxSender.load<I, O>(inboxOwnerID, toRaw(me.value));\n      inboxRef.value = inbox;\n    }\n\n    let inbox = await inboxRef.value;\n\n    if (inbox.owner.id !== inboxOwnerID) {\n      const req = InboxSender.load<I, O>(inboxOwnerID, toRaw(me.value));\n      inboxRef.value = req;\n      inbox = await req;\n    }\n\n    return inbox.sendMessage(message);\n  };\n\n  watch(\n    () => inboxOwnerID,\n    () => {\n      inboxRef.value = undefined;\n    },\n  );\n\n  return sendMessage;\n}\n\n// useAccountOrGuest has been removed in v0.15.4 to match React library.\n// It has been merged into useAccount which now handles both authenticated and guest scenarios.\n// This change maintains 1:1 API compatibility with the React Jazz library.\n// If you were using useAccountOrGuest, please migrate to useAccount.\n","import { onUnmounted, ref } from \"vue\";\nimport { useAuthSecretStorage } from \"../composables.js\";\n\nexport function useIsAuthenticated() {\n  const authSecretStorage = useAuthSecretStorage();\n  const isAuthenticated = ref(authSecretStorage.isAuthenticated);\n\n  const handleUpdate = (newIsAuthenticated: boolean) => {\n    isAuthenticated.value = newIsAuthenticated;\n  };\n\n  // Set up the listener immediately, not waiting for onMounted\n  // This ensures we catch auth state changes that happen before mounting\n  const cleanup = authSecretStorage.onUpdate(handleUpdate);\n\n  onUnmounted(() => {\n    cleanup();\n  });\n\n  return isAuthenticated;\n}\n","import { PassphraseAuth } from \"jazz-tools\";\nimport { computed, markRaw, ref, watchEffect } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\nimport { useIsAuthenticated } from \"./useIsAuthenticated.js\";\n\n/**\n * `usePassphraseAuth` composable provides a `JazzAuth` object for passphrase authentication.\n *\n * @example\n * ```ts\n * const auth = usePassphraseAuth({ wordlist });\n * ```\n *\n * @category Auth Providers\n */\nexport function usePassphraseAuth({ wordlist }: { wordlist: string[] }) {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n  const isAuthenticated = useIsAuthenticated();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Passphrase auth is not supported in guest mode\");\n  }\n\n  const authMethod = computed(() => {\n    return markRaw(\n      new PassphraseAuth(\n        context.value.node.crypto,\n        context.value.authenticate,\n        context.value.register,\n        authSecretStorage,\n        wordlist,\n      ),\n    );\n  });\n\n  const passphrase = ref(authMethod.value.passphrase);\n\n  watchEffect((onCleanup) => {\n    authMethod.value.loadCurrentAccountPassphrase();\n\n    const unsubscribe = authMethod.value.subscribe(() => {\n      passphrase.value = authMethod.value.passphrase;\n    });\n\n    onCleanup(unsubscribe);\n  });\n\n  return computed(() => ({\n    state: isAuthenticated.value ? \"signedIn\" : \"anonymous\",\n    logIn: authMethod.value.logIn,\n    signUp: authMethod.value.signUp,\n    registerNewAccount: authMethod.value.registerNewAccount,\n    generateRandomPassphrase: authMethod.value.generateRandomPassphrase,\n    passphrase: passphrase.value,\n  }));\n}\n","import { BrowserPasskeyAuth } from \"jazz-tools/browser\";\nimport { computed, markRaw } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\nimport { useIsAuthenticated } from \"./useIsAuthenticated.js\";\n\n/**\n * `usePasskeyAuth` composable provides a `JazzAuth` object for passkey authentication.\n *\n * @example\n * ```ts\n * const auth = usePasskeyAuth({ appName, appHostname });\n * ```\n *\n * @category Auth Providers\n */\nexport function usePasskeyAuth({\n  appName,\n  appHostname,\n}: {\n  appName: string;\n  appHostname?: string;\n}) {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n  const isAuthenticated = useIsAuthenticated();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Passkey auth is not supported in guest mode\");\n  }\n\n  const authMethod = computed(() => {\n    return markRaw(\n      new BrowserPasskeyAuth(\n        context.value.node.crypto,\n        context.value.authenticate,\n        authSecretStorage,\n        appName,\n        appHostname,\n      ),\n    );\n  });\n\n  return computed(() => ({\n    state: isAuthenticated.value ? \"signedIn\" : \"anonymous\",\n    logIn: authMethod.value.logIn,\n    signUp: authMethod.value.signUp,\n  }));\n}\n","import { JazzClerkAuth, type MinimalClerkClient } from \"jazz-tools\";\nimport { computed, markRaw, onMounted, onUnmounted } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\n\nexport function useClerkAuth(clerk: MinimalClerkClient) {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Clerk auth is not supported in guest mode\");\n  }\n\n  // Create auth method similar to React's useMemo pattern\n  const authMethod = computed(() => {\n    return markRaw(\n      new JazzClerkAuth(\n        context.value.authenticate,\n        context.value.logOut,\n        authSecretStorage,\n      ),\n    );\n  });\n\n  onMounted(() => {\n    const cleanup = authMethod.value.registerListener(clerk) as\n      | (() => void)\n      | void;\n\n    onUnmounted(() => {\n      // Clerk's addListener returns a cleanup function, but the type says void\n      // Handle both cases for type safety\n      if (typeof cleanup === \"function\") {\n        cleanup();\n      }\n    });\n  });\n\n  return authMethod.value;\n}\n","import type {\n  Account,\n  AccountClass,\n  AnyAccountSchema,\n  CoValueFromRaw,\n  SyncConfig,\n} from \"jazz-tools\";\nimport {\n  InMemoryKVStore,\n  JazzClerkAuth,\n  KvStoreContext,\n  type MinimalClerkClient,\n} from \"jazz-tools\";\nimport { LocalStorageKVStore } from \"jazz-tools/browser\";\nimport { type PropType, defineComponent, h, onMounted, ref } from \"vue\";\nimport { JazzVueProvider } from \"../provider.js\";\nimport { useClerkAuth } from \"./useClerkAuth.js\";\n\nfunction setupKvStore() {\n  KvStoreContext.getInstance().initialize(\n    typeof window === \"undefined\"\n      ? new InMemoryKVStore()\n      : new LocalStorageKVStore(),\n  );\n}\n\nconst RegisterClerkAuth = defineComponent({\n  name: \"RegisterClerkAuth\",\n  props: {\n    clerk: {\n      type: Object as PropType<MinimalClerkClient>,\n      required: true,\n    },\n  },\n  setup(props, { slots }) {\n    useClerkAuth(props.clerk);\n    return () => slots.default?.();\n  },\n});\n\nexport const JazzVueProviderWithClerk = defineComponent({\n  name: \"JazzVueProviderWithClerk\",\n  props: {\n    clerk: {\n      type: Object as PropType<MinimalClerkClient>,\n      required: true,\n    },\n    AccountSchema: {\n      type: Function as unknown as PropType<\n        (AccountClass<Account> & CoValueFromRaw<Account>) | AnyAccountSchema\n      >,\n      required: false,\n    },\n    guestMode: {\n      type: Boolean,\n      default: false,\n    },\n    sync: {\n      type: Object as PropType<SyncConfig>,\n      required: true,\n    },\n    storage: {\n      type: String as PropType<\"indexedDB\">,\n      default: undefined,\n    },\n    defaultProfileName: {\n      type: String,\n      required: false,\n    },\n    onLogOut: {\n      type: Function as PropType<() => void>,\n      required: false,\n    },\n    onAnonymousAccountDiscarded: {\n      type: Function as PropType<(anonymousAccount: any) => Promise<void>>,\n      required: false,\n    },\n    enableSSR: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props, { slots }) {\n    const isLoaded = ref(false);\n\n    onMounted(async () => {\n      try {\n        setupKvStore();\n        await JazzClerkAuth.initializeAuth(props.clerk);\n        isLoaded.value = true;\n      } catch (error) {\n        console.error(\"Jazz + Clerk initialization error:\", error);\n        // Still render even if auth init fails\n        isLoaded.value = true;\n      }\n    });\n\n    return () => {\n      if (!isLoaded.value) {\n        return null;\n      }\n\n      // Destructure props to exclude 'clerk' which JazzVueProvider doesn't accept\n      const { clerk, ...jazzProviderProps } = props;\n\n      return h(\n        JazzVueProvider,\n        {\n          ...jazzProviderProps,\n          logOutReplacement: clerk.signOut,\n        },\n        {\n          default: () =>\n            h(\n              RegisterClerkAuth,\n              { clerk },\n              { default: () => slots.default?.() },\n            ),\n        },\n      );\n    };\n  },\n});\n","<template>\n  <div v-if=\"auth.state === 'signedIn'\">\n    <slot />\n  </div>\n  <div v-else :style=\"containerStyle\">\n    <div :style=\"cardStyle\">\n      <h1 :style=\"headingStyle\">{{ appName }}</h1>\n      \n      <div v-if=\"error\" :style=\"errorStyle\">\n        {{ error }}\n      </div>\n\n      <form @submit.prevent=\"handleSignUp\" :style=\"formStyle\">\n        <input\n          v-model=\"username\"\n          type=\"text\"\n          placeholder=\"Display name\"\n          autocomplete=\"name\"\n          :style=\"inputStyle\"\n        />\n        <button type=\"submit\" :style=\"primaryButtonStyle\">\n          Sign up\n        </button>\n      </form>\n\n      <button @click=\"handleLogIn\" :style=\"secondaryButtonStyle\">\n        Log in with existing account\n      </button>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { usePasskeyAuth } from \"./usePasskeyAuth.js\";\n\ninterface Props {\n  appName: string;\n  appHostname?: string;\n}\n\nconst props = defineProps<Props>();\n\nconst username = ref(\"\");\nconst error = ref<string | null>(null);\n\nconst auth = usePasskeyAuth({\n  appName: props.appName,\n  appHostname: props.appHostname,\n});\n\nfunction handleError(err: Error) {\n  if (err.cause instanceof Error) {\n    error.value = err.cause.message;\n  } else {\n    error.value = err.message;\n  }\n}\n\nconst handleSignUp = async () => {\n  if (!username.value.trim()) {\n    error.value = \"Name is required\";\n    return;\n  }\n\n  error.value = null;\n  try {\n    await auth.value.signUp(username.value.trim());\n  } catch (err) {\n    handleError(err as Error);\n  }\n};\n\nconst handleLogIn = async () => {\n  error.value = null;\n  try {\n    await auth.value.logIn();\n  } catch (err) {\n    handleError(err as Error);\n  }\n};\n\n// Styles (matching React version)\nconst containerStyle = {\n  width: \"100vw\",\n  height: \"100vh\",\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"center\",\n  backgroundColor: \"#f3f4f6\",\n  padding: \"1rem\",\n};\n\nconst cardStyle = {\n  backgroundColor: \"white\",\n  padding: \"2rem\",\n  borderRadius: \"0.5rem\",\n  boxShadow: \"0 10px 15px -3px rgba(0, 0, 0, 0.1)\",\n  width: \"100%\",\n  maxWidth: \"18rem\",\n  display: \"flex\",\n  flexDirection: \"column\" as const,\n  gap: \"2rem\",\n};\n\nconst headingStyle = {\n  fontSize: \"1.5rem\",\n  fontWeight: \"bold\",\n  textAlign: \"center\" as const,\n  margin: \"0\",\n};\n\nconst errorStyle = {\n  color: \"red\",\n  fontSize: \"0.875rem\",\n  textAlign: \"center\" as const,\n};\n\nconst formStyle = {\n  display: \"flex\",\n  flexDirection: \"column\" as const,\n  gap: \"0.5rem\",\n};\n\nconst inputStyle = {\n  padding: \"0.75rem\",\n  border: \"1px solid #d1d5db\",\n  borderRadius: \"0.375rem\",\n  fontSize: \"1rem\",\n};\n\nconst primaryButtonStyle = {\n  backgroundColor: \"#3b82f6\",\n  color: \"white\",\n  padding: \"0.75rem 1rem\",\n  border: \"none\",\n  borderRadius: \"0.375rem\",\n  cursor: \"pointer\",\n  fontSize: \"1rem\",\n  fontWeight: \"500\",\n};\n\nconst secondaryButtonStyle = {\n  backgroundColor: \"#e5e7eb\",\n  color: \"#374151\",\n  padding: \"0.75rem 1rem\",\n  border: \"none\",\n  borderRadius: \"0.375rem\",\n  cursor: \"pointer\",\n  fontSize: \"1rem\",\n  fontWeight: \"500\",\n};\n</script>\n","<script setup lang=\"ts\">\nimport { ImageDefinition } from \"jazz-tools\";\nimport { highestResAvailable } from \"jazz-tools/media\";\nimport { onUnmounted, ref, watch, computed } from \"vue\";\nimport { useCoState } from \"./composables.js\";\n\nexport interface ImageProps {\n  /** The ID of the ImageDefinition to display */\n  imageId: string;\n  /**\n   * The desired width of the image. Can be a number in pixels or \"original\" to use the image's original width.\n   * When set to a number, the component will select the best available resolution and maintain aspect ratio.\n   */\n  width?: number | \"original\";\n  /**\n   * The desired height of the image. Can be a number in pixels or \"original\" to use the image's original height.\n   * When set to a number, the component will select the best available resolution and maintain aspect ratio.\n   */\n  height?: number | \"original\";\n  /** Alt text for the image */\n  alt?: string;\n  /** CSS classes to apply to the image */\n  classNames?: string;\n  /** CSS styles to apply to the image */\n  style?: string | Record<string, string>;\n  /** Loading strategy for the image */\n  loading?: \"lazy\" | \"eager\";\n}\n\nconst props = withDefaults(defineProps<ImageProps>(), {\n  loading: \"eager\",\n});\n\nconst image = useCoState(ImageDefinition, props.imageId, {});\nlet lastBestImage: [string, string] | null = null;\n\n/**\n * For lazy loading, we use the browser's strategy for images with loading=\"lazy\".\n * We use an empty image, and when the browser triggers the load event, we load the best available image.\n */\nconst waitingLazyLoading = ref(props.loading === \"lazy\");\nconst lazyPlaceholder = computed(() =>\n  waitingLazyLoading.value ? URL.createObjectURL(emptyPixelBlob) : undefined,\n);\n\nconst dimensions = computed(() => {\n  const originalWidth = image.value?.originalSize?.[0];\n  const originalHeight = image.value?.originalSize?.[1];\n\n  // Both width and height are \"original\"\n  if (props.width === \"original\" && props.height === \"original\") {\n    return { width: originalWidth, height: originalHeight };\n  }\n\n  // Width is \"original\", height is a number\n  if (props.width === \"original\" && typeof props.height === \"number\") {\n    if (originalWidth && originalHeight) {\n      return {\n        width: Math.round((props.height * originalWidth) / originalHeight),\n        height: props.height,\n      };\n    }\n    return { width: undefined, height: props.height };\n  }\n\n  // Height is \"original\", width is a number\n  if (props.height === \"original\" && typeof props.width === \"number\") {\n    if (originalWidth && originalHeight) {\n      return {\n        width: props.width,\n        height: Math.round((props.width * originalHeight) / originalWidth),\n      };\n    }\n    return { width: props.width, height: undefined };\n  }\n\n  // In all other cases, use the property value:\n  return {\n    width: props.width === \"original\" ? originalWidth : props.width,\n    height: props.height === \"original\" ? originalHeight : props.height,\n  };\n});\n\nconst src = computed(() => {\n  if (waitingLazyLoading.value) {\n    return lazyPlaceholder.value;\n  }\n\n  if (!image.value) return undefined;\n\n  const bestImage = highestResAvailable(\n    image.value,\n    dimensions.value.width || dimensions.value.height || 9999,\n    dimensions.value.height || dimensions.value.width || 9999,\n  );\n\n  if (!bestImage) return image.value.placeholderDataURL;\n  if (lastBestImage?.[0] === bestImage.image.$jazz.id)\n    return lastBestImage?.[1];\n\n  const blob = bestImage.image.toBlob();\n\n  if (blob) {\n    const url = URL.createObjectURL(blob);\n    revokeObjectURL(lastBestImage?.[1]);\n    lastBestImage = [bestImage.image.$jazz.id, url];\n    return url;\n  }\n\n  return image.value.placeholderDataURL;\n});\n\nconst onThresholdReached = () => {\n  waitingLazyLoading.value = false;\n};\n\n// Cleanup object URL on component destroy\nonUnmounted(() => {\n  revokeObjectURL(lastBestImage?.[1]);\n});\n\nfunction revokeObjectURL(url: string | undefined) {\n  if (url && url.startsWith(\"blob:\")) {\n    URL.revokeObjectURL(url);\n  }\n}\n\nconst emptyPixelBlob = new Blob(\n  [\n    Uint8Array.from(\n      atob(\n        \"iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8/5+hHgAHggJ/PchI7wAAAABJRU5ErkJggg==\",\n      ),\n      (c) => c.charCodeAt(0),\n    ),\n  ],\n  { type: \"image/png\" },\n);\n</script>\n\n<template>\n  <img\n    :src=\"src\"\n    :width=\"dimensions.width\"\n    :height=\"dimensions.height\"\n    :alt=\"alt\"\n    :class=\"classNames\"\n    :style=\"style\"\n    :loading=\"loading\"\n    @load=\"waitingLazyLoading ? onThresholdReached() : undefined\"\n  />\n</template>\n"],"names":["inbox"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "community-jazz-vue",
-  "version": "0.17.13",
+  "version": "0.18.0",
   "type": "module",
   "main": "dist/index.js",
   "types": "src/index.ts",
@@ -24,8 +24,8 @@
     }
   },
   "dependencies": {
-    "cojson": "0.17.13",
-    "jazz-tools": "0.17.13"
+    "cojson": "0.18.0",
+    "jazz-tools": "0.18.0"
   },
   "devDependencies": {
     "@babel/plugin-syntax-jsx": "^7.25.0",

package/src/Image.vue

@@ -95,14 +95,15 @@ const src = computed(() => {
   );
 
   if (!bestImage) return image.value.placeholderDataURL;
-  if (lastBestImage?.[0] === bestImage.image.id) return lastBestImage?.[1];
+  if (lastBestImage?.[0] === bestImage.image.$jazz.id)
+    return lastBestImage?.[1];
 
   const blob = bestImage.image.toBlob();
 
   if (blob) {
     const url = URL.createObjectURL(blob);
     revokeObjectURL(lastBestImage?.[1]);
-    lastBestImage = [bestImage.image.id, url];
+    lastBestImage = [bestImage.image.$jazz.id, url];
     return url;
   }
 

package/src/composables.ts

@@ -121,7 +121,11 @@ export function useAccount<
 
   const contextMe = context.value.me as InstanceOfSchema<A>;
 
-  const me = useCoState(AccountSchema as any, contextMe.id, options as any);
+  const me = useCoState(
+    AccountSchema as any,
+    toRaw(contextMe).$jazz.id,
+    options as any,
+  );
 
   return {
     me: computed(() => {

package/src/tests/proxyBehavior.test.ts

@@ -30,15 +30,10 @@ const AccountSchema = co
   })
   .withMigration((account) => {
     if (!account.root) {
-      account.root = AccountRoot.create({ value: "test" }, { owner: account });
+      account.$jazz.set("root", { value: "test" });
     }
     if (!account.profile) {
-      // Profile must be owned by a Group, not the account itself
-      const group = Group.create();
-      account.profile = AccountProfile.create(
-        { name: "Test User" },
-        { owner: group },
-      );
+      account.$jazz.set("profile", { name: "Test User" });
     }
   });
 
@@ -64,9 +59,12 @@ describe("Proxy Behavior Verification", () => {
       { owner: sharedAccount },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, testMap.id), {
-      account: sharedAccount,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, testMap.$jazz.id),
+      {
+        account: sharedAccount,
+      },
+    );
 
     // The returned value should not be a Vue proxy
     expect(isProxy(result.value)).toBe(false);
@@ -94,7 +92,7 @@ describe("Proxy Behavior Verification", () => {
     );
 
     // Update account root
-    sharedAccountWithSchema.root = rootMap;
+    sharedAccountWithSchema.$jazz.set("root", rootMap);
 
     const [accountResult] = withJazzTestSetup(
       () => useAccount(AccountSchema, { resolve: { root: { testMap: true } } }),
@@ -126,16 +124,19 @@ describe("Proxy Behavior Verification", () => {
       { owner: account },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, testMap.id), {
-      account,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, testMap.$jazz.id),
+      {
+        account,
+      },
+    );
 
     // Initial state
     expect(result.value?.content).toBe("initial content");
     expect(isProxy(result.value)).toBe(false);
 
     // Update the Jazz object
-    testMap.content = "updated content";
+    testMap.$jazz.set("content", "updated content");
     await nextTick();
 
     // Should reactively update
@@ -155,9 +156,12 @@ describe("Proxy Behavior Verification", () => {
       { owner: account },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, testMap.id), {
-      account,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, testMap.$jazz.id),
+      {
+        account,
+      },
+    );
 
     // User should be able to use the object directly without toRaw()
     const jazzObject = result.value;
@@ -189,7 +193,7 @@ describe("Proxy Behavior Verification", () => {
 
     // Should be able to access agent properties without proxy issues
     expect(() => {
-      const agentType = result.agent._type; // Access agent property
+      const agentType = result.agent.$type$; // Access agent property
       expect(agentType).toBeDefined();
     }).not.toThrow();
 
@@ -211,21 +215,24 @@ describe("Proxy Behavior Verification", () => {
       { owner: account },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, testMap.id), {
-      account,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, testMap.$jazz.id),
+      {
+        account,
+      },
+    );
 
     const initialObject = result.value;
-    const initialId = initialObject?.id;
+    const initialId = initialObject?.$jazz.id;
 
     // Update content
-    testMap.content = "updated";
+    testMap.$jazz.set("content", "updated");
     await nextTick();
 
     const updatedObject = result.value;
 
     // Object identity should be maintained (same Jazz object)
-    expect(updatedObject?.id).toBe(initialId);
+    expect(updatedObject?.$jazz.id).toBe(initialId);
     expect(isProxy(updatedObject)).toBe(false);
   });
 
@@ -248,7 +255,7 @@ describe("Proxy Behavior Verification", () => {
     );
 
     const [projectResult] = withJazzTestSetup(
-      () => useCoState(TestMap, newProject.id),
+      () => useCoState(TestMap, newProject.$jazz.id),
       {
         account,
       },
@@ -261,7 +268,7 @@ describe("Proxy Behavior Verification", () => {
     expect(isProxy(projectResult.value)).toBe(false);
 
     // Should be able to access properties without toRaw()
-    expect(accountResult.me.value?.id).toBeDefined();
+    expect(accountResult.me.value?.$jazz.id).toBeDefined();
     expect(projectResult.value?.content).toBe("new project");
   });
 });

package/src/tests/useAccount.test.ts

@@ -21,15 +21,12 @@ const AccountSchema = co
   })
   .withMigration((account) => {
     if (!account.root) {
-      account.root = AccountRoot.create({ value: "123" }, { owner: account });
+      account.$jazz.set("root", { value: "123" });
     }
     if (!account.profile) {
       // Profile must be owned by a Group, not the account itself
       const group = Group.create();
-      account.profile = AccountProfile.create(
-        { name: "Test User" },
-        { owner: group },
-      );
+      account.$jazz.set("profile", { name: "Test User" });
     }
   });
 
@@ -53,7 +50,7 @@ describe("useAccount", () => {
 
     // In guest mode, me should be null and agent should be the guest
     expect(result.me.value).toBe(null);
-    expect(result.agent._type).toBe("Anonymous");
+    expect(result.agent.$type$).toBe("Anonymous");
     expect(typeof result.logOut).toBe("function");
   });
 });

package/src/tests/useCoState.test.ts

@@ -28,9 +28,12 @@ describe("useCoState", () => {
       { owner: account },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, map.id, {}), {
-      account,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, map.$jazz.id, {}),
+      {
+        account,
+      },
+    );
 
     expect(result.value?.content).toBe("123");
   });
@@ -49,13 +52,16 @@ describe("useCoState", () => {
       { owner: account },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, map.id, {}), {
-      account,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, map.$jazz.id, {}),
+      {
+        account,
+      },
+    );
 
     expect(result.value?.content).toBe("123");
 
-    map.content = "456";
+    map.$jazz.set("content", "456");
 
     expect(result.value?.content).toBe("456");
   });
@@ -87,7 +93,7 @@ describe("useCoState", () => {
 
     const [result] = withJazzTestSetup(
       () =>
-        useCoState(TestMap, map.id, {
+        useCoState(TestMap, map.$jazz.id, {
           resolve: {
             nested: true,
           },
@@ -126,9 +132,12 @@ describe("useCoState", () => {
       { owner: account },
     );
 
-    const [result] = withJazzTestSetup(() => useCoState(TestMap, map.id, {}), {
-      account,
-    });
+    const [result] = withJazzTestSetup(
+      () => useCoState(TestMap, map.$jazz.id, {}),
+      {
+        account,
+      },
+    );
 
     expect(result.value?.content).toBe("123");
     expect(result.value?.nested?.content).toBe("456");
@@ -164,7 +173,7 @@ describe("useCoState", () => {
     });
 
     const [result] = withJazzTestSetup(() =>
-      useCoState(TestMap, map.id as ID<CoValue>, {
+      useCoState(TestMap, map.$jazz.id as ID<CoValue>, {
         resolve: true,
       }),
     );

package/src/tests/useInboxSender.test.ts

@@ -22,7 +22,7 @@ describe("useInboxSender", () => {
         experimental_useInboxSender<
           Loaded<typeof TestMap>,
           Loaded<typeof TestMap>
-        >(inboxReceiver.id),
+        >(inboxReceiver.$jazz.id),
       {
         account,
       },
@@ -43,7 +43,10 @@ describe("useInboxSender", () => {
       inbox.subscribe(TestMap, async (message) => {
         resolve(message);
 
-        return TestMap.create({ value: "got it" }, { owner: message._owner });
+        return TestMap.create(
+          { value: "got it" },
+          { owner: message.$jazz.owner },
+        );
       });
     });