jazz-vue 0.9.23 → 0.10.1

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/composables.ts","../src/auth/useIsAuthenticated.ts","../src/auth/useDemoAuth.ts","../src/auth/usePassphraseAuth.ts","../src/auth/usePasskeyAuth.ts","../src/auth/DemoAuthBasicUI.vue","../src/ProgressiveImg.vue"],"sourcesContent":["import { consumeInviteLinkFromWindowLocation } from \"jazz-browser\";\nimport {\n  Account,\n  AnonymousJazzAgent,\n  AuthSecretStorage,\n  CoValue,\n  CoValueClass,\n  DeeplyLoaded,\n  DepthsIn,\n  ID,\n  JazzAuthContext,\n  JazzContextType,\n  JazzGuestContext,\n  subscribeToCoValue,\n} from \"jazz-tools\";\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n  ComputedRef,\n  MaybeRef,\n  Ref,\n  ShallowRef,\n  computed,\n  inject,\n  onMounted,\n  onUnmounted,\n  ref,\n  shallowRef,\n  toRaw,\n  unref,\n  watch,\n} from \"vue\";\nimport {\n  JazzAuthContextSymbol,\n  JazzContextSymbol,\n  RegisteredAccount,\n} from \"./provider.js\";\n\nexport const logoutHandler = ref<() => void>();\n\nexport function useJazzContext() {\n  const context =\n    inject<Ref<JazzContextType<RegisteredAccount>>>(JazzContextSymbol);\n  if (!context?.value) {\n    throw new Error(\"useJazzContext must be used within a JazzProvider\");\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 createUseAccountComposables<Acc extends Account>() {\n  function useAccount(): {\n    me: ComputedRef<Acc>;\n    logOut: () => void;\n  };\n  function useAccount<D extends DepthsIn<Acc>>(\n    depth: D,\n  ): {\n    me: ComputedRef<DeeplyLoaded<Acc, D> | undefined | null>;\n    logOut: () => void;\n  };\n  function useAccount<D extends DepthsIn<Acc>>(\n    depth?: D,\n  ): {\n    me: ComputedRef<Acc | DeeplyLoaded<Acc, D> | undefined | null>;\n    logOut: () => void;\n  } {\n    const context = useJazzContext();\n\n    if (!context.value) {\n      throw new Error(\"useAccount must be used within a JazzProvider\");\n    }\n\n    if (!(\"me\" in context.value)) {\n      throw new Error(\n        \"useAccount can't be used in a JazzProvider with auth === 'guest' - consider using useAccountOrGuest()\",\n      );\n    }\n\n    const contextMe = context.value.me as Acc;\n\n    const me = useCoState<Acc, D>(\n      contextMe.constructor as CoValueClass<Acc>,\n      contextMe.id,\n      depth,\n    );\n\n    return {\n      me: computed(() => {\n        const value =\n          depth === undefined\n            ? me.value || toRaw((context.value as JazzAuthContext<Acc>).me)\n            : me.value;\n\n        return value ? toRaw(value) : value;\n      }),\n      logOut: context.value.logOut,\n    };\n  }\n\n  function useAccountOrGuest(): {\n    me: ComputedRef<Acc | AnonymousJazzAgent>;\n  };\n  function useAccountOrGuest<D extends DepthsIn<Acc>>(\n    depth: D,\n  ): {\n    me: ComputedRef<\n      DeeplyLoaded<Acc, D> | undefined | null | AnonymousJazzAgent\n    >;\n  };\n  function useAccountOrGuest<D extends DepthsIn<Acc>>(\n    depth?: D,\n  ): {\n    me: ComputedRef<\n      Acc | DeeplyLoaded<Acc, D> | undefined | null | AnonymousJazzAgent\n    >;\n  } {\n    const context = useJazzContext();\n\n    if (!context.value) {\n      throw new Error(\"useAccountOrGuest must be used within a JazzProvider\");\n    }\n\n    const contextMe = computed(() =>\n      \"me\" in context.value ? (context.value.me as Acc) : undefined,\n    );\n\n    const me = useCoState<Acc, D>(\n      contextMe.value?.constructor as CoValueClass<Acc>,\n      contextMe.value?.id,\n      depth,\n    );\n\n    if (\"me\" in context.value) {\n      return {\n        me: computed(() =>\n          depth === undefined\n            ? me.value || toRaw((context.value as JazzAuthContext<Acc>).me)\n            : me.value,\n        ),\n      };\n    } else {\n      return {\n        me: computed(() => toRaw((context.value as JazzGuestContext).guest)),\n      };\n    }\n  }\n\n  return {\n    useAccount,\n    useAccountOrGuest,\n  };\n}\n\nconst { useAccount, useAccountOrGuest } =\n  createUseAccountComposables<RegisteredAccount>();\n\nexport { useAccount, useAccountOrGuest };\n\nexport function useCoState<V extends CoValue, D>(\n  Schema: CoValueClass<V>,\n  id: MaybeRef<ID<V> | undefined>,\n  depth: D & DepthsIn<V> = [] as D & DepthsIn<V>,\n): Ref<DeeplyLoaded<V, D> | undefined | null> {\n  const state: ShallowRef<DeeplyLoaded<V, D> | 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    [() => unref(id), () => context, () => Schema, () => depth],\n    () => {\n      if (unsubscribe) unsubscribe();\n\n      const idValue = unref(id);\n      if (!idValue) return;\n\n      unsubscribe = subscribeToCoValue(\n        Schema,\n        idValue,\n        \"me\" in context.value\n          ? toRaw(context.value.me)\n          : toRaw(context.value.guest),\n        depth,\n        (value) => {\n          state.value = value;\n        },\n        () => {\n          state.value = null;\n        },\n        true,\n      );\n    },\n    { deep: true, immediate: true },\n  );\n\n  onUnmounted(() => {\n    if (unsubscribe) unsubscribe();\n  });\n\n  const computedState = computed(() => state.value);\n\n  return computedState;\n}\n\nexport function useAcceptInvite<V extends CoValue>({\n  invitedObjectSchema,\n  onAccept,\n  forValueHint,\n}: {\n  invitedObjectSchema: CoValueClass<V>;\n  onAccept: (projectID: ID<V>) => 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 runInviteAcceptance = () => {\n    const result = consumeInviteLinkFromWindowLocation({\n      as: toRaw((context.value as JazzAuthContext<RegisteredAccount>).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    runInviteAcceptance();\n  });\n\n  watch(\n    () => onAccept,\n    (newOnAccept, oldOnAccept) => {\n      if (newOnAccept !== oldOnAccept) {\n        runInviteAcceptance();\n      }\n    },\n  );\n}\n","import { onMounted, 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 = () => {\n    isAuthenticated.value = authSecretStorage.isAuthenticated;\n  };\n\n  onMounted(() => {\n    const cleanup = authSecretStorage.onUpdate(handleUpdate);\n    onUnmounted(cleanup);\n  });\n\n  return isAuthenticated;\n}\n","import { DemoAuth } from \"jazz-tools\";\nimport { computed, ref, watch } from \"vue\";\nimport { useAuthSecretStorage, useJazzContext } from \"../composables.js\";\nimport { useIsAuthenticated } from \"./useIsAuthenticated.js\";\n\nexport function useDemoAuth() {\n  const context = useJazzContext();\n  const authSecretStorage = useAuthSecretStorage();\n\n  if (\"guest\" in context.value) {\n    throw new Error(\"Demo auth is not supported in guest mode\");\n  }\n\n  const authMethod = computed(\n    () => new DemoAuth(context.value.authenticate, authSecretStorage),\n  );\n\n  const existingUsers = ref<string[]>([]);\n  const isAuthenticated = useIsAuthenticated();\n\n  watch(authMethod, () => {\n    authMethod.value.getExistingUsers().then((users) => {\n      existingUsers.value = users;\n    });\n  });\n\n  return computed(() => ({\n    state: isAuthenticated.value ? \"signedIn\" : \"anonymous\",\n    logIn(username: string) {\n      authMethod.value.logIn(username);\n    },\n    signUp(username: string) {\n      authMethod.value.signUp(username);\n    },\n    existingUsers: existingUsers.value,\n  }));\n}\n","import { PassphraseAuth } from \"jazz-tools\";\nimport { computed, 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({\n  wordlist,\n}: {\n  wordlist: 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(\"Passphrase auth is not supported in guest mode\");\n  }\n\n  const authMethod = computed(() => {\n    return new PassphraseAuth(\n      context.value.node.crypto,\n      context.value.authenticate,\n      authSecretStorage,\n      wordlist,\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    passphrase: passphrase.value,\n  }));\n}\n","import { BrowserPasskeyAuth } from \"jazz-browser\";\nimport { computed } 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 new BrowserPasskeyAuth(\n      context.value.node.crypto,\n      context.value.authenticate,\n      authSecretStorage,\n      appName,\n      appHostname,\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","<script setup lang=\"ts\">\nimport { ref } from \"vue\";\nimport { useDemoAuth } from \"./useDemoAuth.js\";\n\ninterface Props {\n  appName: string;\n}\n\ndefineProps<Props>();\ndefineSlots<{\n  default?: () => any;\n}>();\n\nconst auth = useDemoAuth();\nconst username = ref(\"\");\n\nconst darkMode =\n  typeof window !== \"undefined\"\n    ? window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n    : false;\n\nconst handleSubmit = (e: Event) => {\n  e.preventDefault();\n  auth.value.signUp(username.value);\n};\n</script>\n\n<template>\n  <slot v-if=\"auth.state === 'signedIn'\" />\n  <div\n    v-else\n    :style=\"{\n      minHeight: '100%',\n      display: 'flex',\n      flexDirection: 'column',\n      justifyContent: 'center',\n      width: '18rem',\n      maxWidth: 'calc(100vw - 2rem)',\n      gap: '2rem',\n      margin: '0 auto'\n    }\"\n  >\n    <h1\n      :style=\"{\n        color: darkMode ? '#fff' : '#000',\n        textAlign: 'center',\n        fontSize: '1.5rem',\n        fontWeight: 'bold'\n      }\"\n    >\n      {{ appName }}\n    </h1>\n\n    <form\n      :style=\"{\n        display: 'flex',\n        flexDirection: 'column',\n        gap: '0.5rem'\n      }\"\n      @submit=\"handleSubmit\"\n    >\n      <input\n        v-model=\"username\"\n        placeholder=\"Display name\"\n        autocomplete=\"webauthn\"\n        :style=\"{\n          border: darkMode ? '1px solid #444' : '1px solid #ddd',\n          padding: '11px 8px',\n          borderRadius: '6px',\n          background: darkMode ? '#000' : '#fff',\n          color: darkMode ? '#fff' : '#000'\n        }\"\n      >\n      <input\n        type=\"submit\"\n        value=\"Sign up\"\n        :style=\"{\n          padding: '13px 5px',\n          border: 'none',\n          borderRadius: '6px',\n          cursor: 'pointer',\n          background: darkMode ? '#444' : '#ddd',\n          color: darkMode ? '#fff' : '#000'\n        }\"\n      >\n    </form>\n\n    <div\n      v-if=\"auth.existingUsers.length > 0\"\n      :style=\"{\n        display: 'flex',\n        flexDirection: 'column',\n        gap: '0.5rem'\n      }\"\n    >\n      <p\n        :style=\"{\n          color: darkMode ? '#e2e2e2' : '#000',\n          textAlign: 'center',\n          paddingTop: '0.5rem',\n          borderTop: '1px solid',\n          borderColor: darkMode ? '#111' : '#e2e2e2'\n        }\"\n      >\n        Log in as\n      </p>\n      <button\n        v-for=\"user in auth.existingUsers\"\n        :key=\"user\"\n        @click=\"auth.logIn(user)\"\n        type=\"button\"\n        :aria-label=\"`Log in as ${user}`\"\n        :style=\"{\n          background: darkMode ? '#0d0d0d' : '#eee',\n          color: darkMode ? '#fff' : '#000',\n          padding: '0.5rem',\n          border: 'none',\n          borderRadius: '6px'\n        }\"\n      >\n        {{ user }}\n      </button>\n    </div>\n  </div>\n</template>","<script setup lang=\"ts\">\nimport type { ImageDefinition } from \"jazz-tools\";\nimport { type Ref, onUnmounted, ref, toRef, watch } from \"vue\";\n\ninterface ImageState {\n  src?: string;\n  res?: `${number}x${number}` | \"placeholder\";\n  originalSize?: readonly [number, number];\n}\n\nfunction useProgressiveImg(\n  image: Ref<ImageDefinition | null | undefined>,\n  maxWidth?: number,\n) {\n  const current = ref<ImageState>({});\n\n  let cleanup: (() => void) | undefined;\n  const unsubscribe = watch(\n    () => [image.value?.id, maxWidth],\n    () => {\n      let lastHighestRes: string | undefined;\n\n      if (!image.value) return;\n\n      const unsub = image.value.subscribe({}, (update) => {\n        const highestRes = update?.highestResAvailable({ maxWidth });\n\n        if (highestRes) {\n          if (highestRes.res !== lastHighestRes) {\n            lastHighestRes = highestRes.res;\n            const blob = highestRes.stream.toBlob();\n\n            if (blob) {\n              const blobURI = URL.createObjectURL(blob);\n              current.value = {\n                src: blobURI,\n                res: highestRes.res,\n                originalSize: image.value?.originalSize,\n              };\n\n              if (cleanup) cleanup();\n              cleanup = () => {\n                setTimeout(() => URL.revokeObjectURL(blobURI), 200);\n              };\n            }\n          }\n        } else {\n          current.value = {\n            src: update?.placeholderDataURL,\n            res: \"placeholder\",\n            originalSize: image.value?.originalSize,\n          };\n        }\n      });\n\n      return unsub;\n    },\n  );\n\n  onUnmounted(() => {\n    unsubscribe();\n    if (cleanup) cleanup();\n  });\n\n  return current;\n}\n\nconst props = defineProps<{\n  image: ImageDefinition | null | undefined;\n  maxWidth?: number;\n}>();\n\nconst current = useProgressiveImg(toRef(props, \"image\"), props.maxWidth);\n</script>\n\n<template>\n  <slot\n    :src=\"current.src\"\n    :res=\"current.res\"\n    :original-size=\"current.originalSize\"\n  />\n</template>"],"names":["useAccount","useAccountOrGuest","current"],"mappings":"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"}

package/dist/provider-CkA-a4Og.js

@@ -0,0 +1,86 @@
+import { JazzBrowserContextManager } from "jazz-browser";
+import { ref, defineComponent, provide, watch, onMounted, onUnmounted } from "vue";
+ref();
+const JazzContextSymbol = Symbol("JazzContext");
+const JazzAuthContextSymbol = Symbol("JazzAuthContext");
+const JazzProvider = defineComponent({
+  name: "JazzProvider",
+  props: {
+    guestMode: {
+      type: Boolean,
+      default: false
+    },
+    sync: {
+      type: Object,
+      required: true
+    },
+    AccountSchema: {
+      type: Function,
+      required: false
+    },
+    storage: {
+      type: String,
+      default: void 0
+    },
+    defaultProfileName: {
+      type: String,
+      required: false
+    },
+    onAnonymousAccountDiscarded: {
+      type: Function,
+      required: false
+    },
+    onLogOut: {
+      type: Function,
+      required: false
+    }
+  },
+  setup(props, { slots }) {
+    const contextManager = new JazzBrowserContextManager();
+    const ctx = ref();
+    provide(JazzContextSymbol, ctx);
+    provide(JazzAuthContextSymbol, contextManager.getAuthSecretStorage());
+    watch(
+      () => ({
+        peer: props.sync.peer,
+        syncWhen: props.sync.when,
+        storage: props.storage,
+        guestMode: props.guestMode
+      }),
+      async () => {
+        contextManager.createContext({
+          sync: props.sync,
+          storage: props.storage,
+          guestMode: props.guestMode,
+          AccountSchema: props.AccountSchema,
+          defaultProfileName: props.defaultProfileName,
+          onAnonymousAccountDiscarded: props.onAnonymousAccountDiscarded,
+          onLogOut: props.onLogOut
+        }).catch((error) => {
+          console.error("Error creating Jazz browser context:", error);
+        });
+      },
+      { immediate: true }
+    );
+    onMounted(() => {
+      const cleanup = contextManager.subscribe(() => {
+        ctx.value = contextManager.getCurrentValue();
+      });
+      onUnmounted(cleanup);
+    });
+    onUnmounted(() => {
+      var _a, _b;
+      if (ctx.value) (_b = (_a = ctx.value).done) == null ? void 0 : _b.call(_a);
+    });
+    return () => {
+      var _a;
+      return ctx.value ? (_a = slots.default) == null ? void 0 : _a.call(slots) : null;
+    };
+  }
+});
+export {
+  JazzContextSymbol as J,
+  JazzAuthContextSymbol as a,
+  JazzProvider as b
+};
+//# sourceMappingURL=provider-CkA-a4Og.js.map

package/dist/provider-CkA-a4Og.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider-CkA-a4Og.js","sources":["../src/provider.ts"],"sourcesContent":["import { JazzBrowserContextManager } from \"jazz-browser\";\nimport { Account, AccountClass, JazzContextType, SyncConfig } from \"jazz-tools\";\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport {\n  PropType,\n  computed,\n  defineComponent,\n  onMounted,\n  onUnmounted,\n  provide,\n  ref,\n  watch,\n} from \"vue\";\n\nexport const logoutHandler = ref<() => void>();\n\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface Register {}\n\nexport type RegisteredAccount = Register extends { Account: infer Acc }\n  ? Acc\n  : Account;\n\nexport const JazzContextSymbol = Symbol(\"JazzContext\");\nexport const JazzAuthContextSymbol = Symbol(\"JazzAuthContext\");\nexport const JazzProvider = defineComponent({\n  name: \"JazzProvider\",\n  props: {\n    guestMode: {\n      type: Boolean,\n      default: false,\n    },\n    sync: {\n      type: Object as PropType<SyncConfig>,\n      required: true,\n    },\n    AccountSchema: {\n      type: Function as unknown as PropType<AccountClass<RegisteredAccount>>,\n      required: false,\n    },\n    storage: {\n      type: String as PropType<\"indexedDB\" | \"singleTabOPFS\">,\n      default: undefined,\n    },\n    defaultProfileName: {\n      type: String,\n      required: false,\n    },\n    onAnonymousAccountDiscarded: {\n      type: Function as PropType<\n        (anonymousAccount: RegisteredAccount) => Promise<void>\n      >,\n      required: false,\n    },\n    onLogOut: {\n      type: Function as PropType<() => void>,\n      required: false,\n    },\n  },\n  setup(props, { slots }) {\n    const contextManager = new JazzBrowserContextManager<RegisteredAccount>();\n    const ctx = ref<JazzContextType<RegisteredAccount>>();\n\n    provide(JazzContextSymbol, ctx);\n    provide(JazzAuthContextSymbol, contextManager.getAuthSecretStorage());\n\n    watch(\n      () => ({\n        peer: props.sync.peer,\n        syncWhen: props.sync.when,\n        storage: props.storage,\n        guestMode: props.guestMode,\n      }),\n      async () => {\n        contextManager\n          .createContext({\n            sync: props.sync,\n            storage: props.storage,\n            guestMode: props.guestMode,\n            AccountSchema: props.AccountSchema,\n            defaultProfileName: props.defaultProfileName,\n            onAnonymousAccountDiscarded: props.onAnonymousAccountDiscarded,\n            onLogOut: props.onLogOut,\n          })\n          .catch((error) => {\n            console.error(\"Error creating Jazz browser context:\", error);\n          });\n      },\n      { immediate: true },\n    );\n\n    onMounted(() => {\n      const cleanup = contextManager.subscribe(() => {\n        ctx.value = contextManager.getCurrentValue();\n      });\n      onUnmounted(cleanup);\n    });\n\n    onUnmounted(() => {\n      if (ctx.value) ctx.value.done?.();\n    });\n\n    return () => (ctx.value ? slots.default?.() : null);\n  },\n});\n"],"names":[],"mappings":";;AAc6B,IAAgB;AAShC,MAAA,oBAAoB,OAAO,aAAa;AACxC,MAAA,wBAAwB,OAAO,iBAAiB;AACtD,MAAM,eAAe,gBAAgB;AAAA,EAC1C,MAAM;AAAA,EACN,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,eAAe;AAAA,MACb,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,6BAA6B;AAAA,MAC3B,MAAM;AAAA,MAGN,UAAU;AAAA,IACZ;AAAA,IACA,UAAU;AAAA,MACR,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA,EAEd;AAAA,EACA,MAAM,OAAO,EAAE,SAAS;AAChB,UAAA,iBAAiB,IAAI,0BAA6C;AACxE,UAAM,MAAM,IAAwC;AAEpD,YAAQ,mBAAmB,GAAG;AACtB,YAAA,uBAAuB,eAAe,sBAAsB;AAEpE;AAAA,MACE,OAAO;AAAA,QACL,MAAM,MAAM,KAAK;AAAA,QACjB,UAAU,MAAM,KAAK;AAAA,QACrB,SAAS,MAAM;AAAA,QACf,WAAW,MAAM;AAAA,MAAA;AAAA,MAEnB,YAAY;AACV,uBACG,cAAc;AAAA,UACb,MAAM,MAAM;AAAA,UACZ,SAAS,MAAM;AAAA,UACf,WAAW,MAAM;AAAA,UACjB,eAAe,MAAM;AAAA,UACrB,oBAAoB,MAAM;AAAA,UAC1B,6BAA6B,MAAM;AAAA,UACnC,UAAU,MAAM;AAAA,QAAA,CACjB,EACA,MAAM,CAAC,UAAU;AACR,kBAAA,MAAM,wCAAwC,KAAK;AAAA,QAAA,CAC5D;AAAA,MACL;AAAA,MACA,EAAE,WAAW,KAAK;AAAA,IACpB;AAEA,cAAU,MAAM;AACR,YAAA,UAAU,eAAe,UAAU,MAAM;AACzC,YAAA,QAAQ,eAAe,gBAAgB;AAAA,MAAA,CAC5C;AACD,kBAAY,OAAO;AAAA,IAAA,CACpB;AAED,gBAAY,MAAM;;AAChB,UAAI,IAAI,MAAW,iBAAA,OAAM,SAAN;AAAA,IAAa,CACjC;AAED,WAAO,MAAO;;AAAA,iBAAI,SAAQ,WAAM,YAAN,iCAAoB;AAAA;AAAA,EAAA;AAElD,CAAC;"}

package/dist/provider.d.ts

@@ -1,4 +1,4 @@
-import { Account, AccountClass, AuthMethod } from 'jazz-tools';
+import { Account, AccountClass, SyncConfig } from 'jazz-tools';
 import { PropType } from 'vue';
 export declare const logoutHandler: import('vue').Ref<(() => void) | undefined, (() => void) | undefined>;
 export interface Register {
@@ -7,42 +7,68 @@ export type RegisteredAccount = Register extends {
     Account: infer Acc;
 } ? Acc : Account;
 export declare const JazzContextSymbol: unique symbol;
+export declare const JazzAuthContextSymbol: unique symbol;
 export declare const JazzProvider: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
-    auth: {
-        type: PropType<AuthMethod | "guest">;
+    guestMode: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sync: {
+        type: PropType<SyncConfig>;
         required: true;
     };
     AccountSchema: {
         type: PropType<AccountClass<RegisteredAccount>>;
         required: false;
     };
-    peer: {
-        type: PropType<`wss://${string}` | `ws://${string}`>;
-        required: true;
-    };
     storage: {
         type: PropType<"indexedDB" | "singleTabOPFS">;
         default: undefined;
     };
+    defaultProfileName: {
+        type: StringConstructor;
+        required: false;
+    };
+    onAnonymousAccountDiscarded: {
+        type: PropType<(anonymousAccount: RegisteredAccount) => Promise<void>>;
+        required: false;
+    };
+    onLogOut: {
+        type: PropType<() => void>;
+        required: false;
+    };
 }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }>[] | null | undefined, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    auth: {
-        type: PropType<AuthMethod | "guest">;
+    guestMode: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    sync: {
+        type: PropType<SyncConfig>;
         required: true;
     };
     AccountSchema: {
         type: PropType<AccountClass<RegisteredAccount>>;
         required: false;
     };
-    peer: {
-        type: PropType<`wss://${string}` | `ws://${string}`>;
-        required: true;
-    };
     storage: {
         type: PropType<"indexedDB" | "singleTabOPFS">;
         default: undefined;
     };
+    defaultProfileName: {
+        type: StringConstructor;
+        required: false;
+    };
+    onAnonymousAccountDiscarded: {
+        type: PropType<(anonymousAccount: RegisteredAccount) => Promise<void>>;
+        required: false;
+    };
+    onLogOut: {
+        type: PropType<() => void>;
+        required: false;
+    };
 }>> & Readonly<{}>, {
     storage: "indexedDB" | "singleTabOPFS";
+    guestMode: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/testing.d.ts

@@ -5,7 +5,11 @@ export declare const JazzTestProvider: import('vue').DefineComponent<import('vue
         type: PropType<Account | {
             guest: AnonymousJazzAgent;
         }>;
-        required: true;
+        required: false;
+    };
+    isAuthenticated: {
+        type: BooleanConstructor;
+        required: false;
     };
 }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
@@ -14,7 +18,13 @@ export declare const JazzTestProvider: import('vue').DefineComponent<import('vue
         type: PropType<Account | {
             guest: AnonymousJazzAgent;
         }>;
-        required: true;
+        required: false;
+    };
+    isAuthenticated: {
+        type: BooleanConstructor;
+        required: false;
     };
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+}>> & Readonly<{}>, {
+    isAuthenticated: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 export { createJazzTestAccount, createJazzTestGuest, linkAccounts, setActiveAccount, setupJazzTestSync, } from 'jazz-tools/testing';

package/dist/testing.js

@@ -1,28 +1,40 @@
-import { getJazzContextShape as c } from "jazz-tools/testing";
-import { createJazzTestAccount as s, createJazzTestGuest as x, linkAccounts as T, setActiveAccount as v, setupJazzTestSync as A } from "jazz-tools/testing";
-import { defineComponent as n, ref as a, provide as z } from "vue";
-import { J as p } from "./provider-BZnz6FpX.js";
-const J = n({
+import { TestJazzContextManager } from "jazz-tools/testing";
+import { createJazzTestAccount, createJazzTestGuest, linkAccounts, setActiveAccount, setupJazzTestSync } from "jazz-tools/testing";
+import { defineComponent, provide, ref } from "vue";
+import { J as JazzContextSymbol, a as JazzAuthContextSymbol } from "./provider-CkA-a4Og.js";
+const JazzTestProvider = defineComponent({
   name: "JazzTestProvider",
   props: {
     account: {
       type: Object,
-      required: !0
+      required: false
+    },
+    isAuthenticated: {
+      type: Boolean,
+      required: false
     }
   },
-  setup(r, { slots: e }) {
-    const o = a(c(r.account));
-    return z(p, o), () => {
-      var t;
-      return (t = e.default) == null ? void 0 : t.call(e);
+  setup(props, { slots }) {
+    const contextManager = TestJazzContextManager.fromAccountOrGuest(
+      props.account,
+      {
+        isAuthenticated: props.isAuthenticated
+      }
+    );
+    provide(JazzContextSymbol, ref(contextManager.getCurrentValue()));
+    provide(JazzAuthContextSymbol, contextManager.getAuthSecretStorage());
+    return () => {
+      var _a;
+      return (_a = slots.default) == null ? void 0 : _a.call(slots);
     };
   }
 });
 export {
-  J as JazzTestProvider,
-  s as createJazzTestAccount,
-  x as createJazzTestGuest,
-  T as linkAccounts,
-  v as setActiveAccount,
-  A as setupJazzTestSync
+  JazzTestProvider,
+  createJazzTestAccount,
+  createJazzTestGuest,
+  linkAccounts,
+  setActiveAccount,
+  setupJazzTestSync
 };
+//# sourceMappingURL=testing.js.map

package/dist/testing.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"testing.js","sources":["../src/testing.ts"],"sourcesContent":["import { Account, AnonymousJazzAgent } from \"jazz-tools\";\nimport { TestJazzContextManager } from \"jazz-tools/testing\";\nimport { provide } from \"vue\";\nimport { PropType, defineComponent, ref } from \"vue\";\nimport { JazzAuthContextSymbol, JazzContextSymbol } from \"./provider.js\";\n\nexport const JazzTestProvider = defineComponent({\n  name: \"JazzTestProvider\",\n  props: {\n    account: {\n      type: Object as PropType<Account | { guest: AnonymousJazzAgent }>,\n      required: false,\n    },\n    isAuthenticated: {\n      type: Boolean,\n      required: false,\n    },\n  },\n  setup(props, { slots }) {\n    const contextManager = TestJazzContextManager.fromAccountOrGuest(\n      props.account,\n      {\n        isAuthenticated: props.isAuthenticated,\n      },\n    );\n\n    provide(JazzContextSymbol, ref(contextManager.getCurrentValue()));\n    provide(JazzAuthContextSymbol, contextManager.getAuthSecretStorage());\n\n    return () => slots.default?.();\n  },\n});\n\nexport {\n  createJazzTestAccount,\n  createJazzTestGuest,\n  linkAccounts,\n  setActiveAccount,\n  setupJazzTestSync,\n} from \"jazz-tools/testing\";\n"],"names":[],"mappings":";;;;AAMO,MAAM,mBAAmB,gBAAgB;AAAA,EAC9C,MAAM;AAAA,EACN,OAAO;AAAA,IACL,SAAS;AAAA,MACP,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA,EAEd;AAAA,EACA,MAAM,OAAO,EAAE,SAAS;AACtB,UAAM,iBAAiB,uBAAuB;AAAA,MAC5C,MAAM;AAAA,MACN;AAAA,QACE,iBAAiB,MAAM;AAAA,MAAA;AAAA,IAE3B;AAEA,YAAQ,mBAAmB,IAAI,eAAe,gBAAiB,CAAA,CAAC;AACxD,YAAA,uBAAuB,eAAe,sBAAsB;AAE7D,WAAA,MAAA;;AAAM,yBAAM,YAAN;AAAA;AAAA,EAAgB;AAEjC,CAAC;"}

package/dist/tests/fixtures.d.ts

@@ -0,0 +1 @@
+export declare const testWordlist: string[];

package/dist/tests/testUtils.d.ts

@@ -1,8 +1,9 @@
 import { Account, AnonymousJazzAgent } from 'jazz-tools';
 import { createApp } from 'vue';
-export declare const withJazzTestSetup: <C extends (...args: any[]) => any>(composable: C, { account }: {
-    account: Account | {
+export declare const withJazzTestSetup: <C extends (...args: any[]) => any>(composable: C, { account, isAuthenticated, }?: {
+    account?: Account | {
         guest: AnonymousJazzAgent;
     };
+    isAuthenticated?: boolean;
 }) => [ReturnType<C>, ReturnType<typeof createApp>];
 export declare function waitFor(callback: () => boolean | void): Promise<void>;

package/dist/tests/usePassphraseAuth.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jazz-vue",
-  "version": "0.9.23",
+  "version": "0.10.1",
   "type": "module",
   "main": "dist/index.js",
   "types": "src/index.ts",
@@ -16,15 +16,16 @@
     }
   },
   "dependencies": {
-    "cojson": "0.9.23",
-    "jazz-browser": "0.9.23",
-    "jazz-tools": "0.9.23"
+    "cojson": "0.10.1",
+    "jazz-browser": "0.10.1",
+    "jazz-tools": "0.10.1"
   },
   "devDependencies": {
+    "@scure/bip39": "^1.3.0",
     "@vitejs/plugin-vue": "^5.1.4",
     "rollup-plugin-node-externals": "^8.0.0",
     "typescript": "~5.6.2",
-    "vite": "^5.4.10",
+    "vite": "^6.0.11",
     "vite-plugin-dts": "^4.2.4",
     "vue": "^3.5.11",
     "vue-tsc": "^2.1.6"
@@ -33,7 +34,7 @@
     "vue": "^3.5.11"
   },
   "scripts": {
-    "dev": "vite",
+    "dev": "vite build --watch",
     "format-and-lint": "biome check .",
     "format-and-lint:fix": "biome check . --write",
     "build": "rm -rf ./dist && vite build"

package/src/auth/DemoAuthBasicUI.vue

@@ -1,123 +1,125 @@
-<template>
-    <div
-      :style="containerStyle"
-    >
-      <div v-if="state.state === 'loading'">Loading...</div>
-      <template v-else-if="state.state === 'ready'">
-        <h1 :style="{ color: darkMode ? '#fff' : '#000', textAlign: 'center' }">
-          {{ appName }}
-        </h1>
-        <div v-for="error in state.errors" :key="error" style="color: red">
-          {{ error }}
-        </div>
-        <form
-          @submit.prevent="signUp"
-          style="display: flex; flex-direction: column; gap: 0.5rem;"
-        >
-          <input
-            v-model="username"
-            placeholder="Display name"
-            autoComplete="webauthn"
-            :style="inputStyle"
-          />
-          <input
-            type="submit"
-            value="Sign up"
-            :style="buttonStyle"
-          />
-        </form>
-        <div
-          v-if="state.existingUsers.length > 0"
-          style="display: flex; flex-direction: column; gap: 0.5rem;"
-        >
-          <p
-            :style="{
-              color: darkMode ? '#e2e2e2' : '#000',
-              textAlign: 'center',
-              paddingTop: '0.5rem',
-              borderTop: '1px solid',
-              borderColor: darkMode ? '#111' : '#e2e2e2',
-            }"
-          >
-            Log in as
-          </p>
-          <button
-            v-for="user in state.existingUsers"
-            :key="user"
-            @click="logInAs(user)"
-            type="button"
-            :aria-label="`Log in as ${user}`"
-            :style="loginButtonStyle"
-          >
-            {{ user }}
-          </button>
-        </div>
-      </template>
-    </div>
-  </template>
-  
-  <script setup lang="ts">
-import { computed, ref } from "vue";
-import { DemoAuthState } from "./useDemoAuth.js";
+<script setup lang="ts">
+import { ref } from "vue";
+import { useDemoAuth } from "./useDemoAuth.js";
 
-const props = defineProps<{
+interface Props {
   appName: string;
-  state: DemoAuthState;
+}
+
+defineProps<Props>();
+defineSlots<{
+  default?: () => any;
 }>();
 
+const auth = useDemoAuth();
 const username = ref("");
-const darkMode = computed(
-  () =>
-    window.matchMedia &&
-    window.matchMedia("(prefers-color-scheme: dark)").matches,
-);
 
-const containerStyle = computed(() => ({
-  minHeight: "100vh",
-  display: "flex",
-  flexDirection: "column" as const,
-  justifyContent: "center",
-  alignItems: "center",
-  width: "100%",
-  padding: "1rem",
-  maxWidth: "100vw",
-  gap: "2rem",
-  margin: "0",
-  ...(darkMode.value ? { background: "#000" } : {}),
-}));
+const darkMode =
+  typeof window !== "undefined"
+    ? window.matchMedia("(prefers-color-scheme: dark)").matches
+    : false;
 
-const inputStyle = computed(() => ({
-  border: darkMode.value ? "2px solid #444" : "2px solid #ddd",
-  padding: "11px 8px",
-  borderRadius: "6px",
-  background: darkMode.value ? "#000" : "#fff",
-  color: darkMode.value ? "#fff" : "#000",
-}));
-
-const buttonStyle = computed(() => ({
-  padding: "13px 5px",
-  border: "none",
-  borderRadius: "6px",
-  cursor: "pointer",
-  background: darkMode.value ? "#444" : "#ddd",
-  color: darkMode.value ? "#fff" : "#000",
-}));
+const handleSubmit = (e: Event) => {
+  e.preventDefault();
+  auth.value.signUp(username.value);
+};
+</script>
 
-const loginButtonStyle = computed(() => ({
-  background: darkMode.value ? "#0d0d0d" : "#eee",
-  color: darkMode.value ? "#fff" : "#000",
-  padding: "0.5rem",
-  border: "none",
-  borderRadius: "6px",
-}));
+<template>
+  <slot v-if="auth.state === 'signedIn'" />
+  <div
+    v-else
+    :style="{
+      minHeight: '100%',
+      display: 'flex',
+      flexDirection: 'column',
+      justifyContent: 'center',
+      width: '18rem',
+      maxWidth: 'calc(100vw - 2rem)',
+      gap: '2rem',
+      margin: '0 auto'
+    }"
+  >
+    <h1
+      :style="{
+        color: darkMode ? '#fff' : '#000',
+        textAlign: 'center',
+        fontSize: '1.5rem',
+        fontWeight: 'bold'
+      }"
+    >
+      {{ appName }}
+    </h1>
 
-const signUp = () => {
-  (props.state as DemoAuthState & { state: "ready" }).signUp(username.value);
-  username.value = "";
-};
+    <form
+      :style="{
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '0.5rem'
+      }"
+      @submit="handleSubmit"
+    >
+      <input
+        v-model="username"
+        placeholder="Display name"
+        autocomplete="webauthn"
+        :style="{
+          border: darkMode ? '1px solid #444' : '1px solid #ddd',
+          padding: '11px 8px',
+          borderRadius: '6px',
+          background: darkMode ? '#000' : '#fff',
+          color: darkMode ? '#fff' : '#000'
+        }"
+      >
+      <input
+        type="submit"
+        value="Sign up"
+        :style="{
+          padding: '13px 5px',
+          border: 'none',
+          borderRadius: '6px',
+          cursor: 'pointer',
+          background: darkMode ? '#444' : '#ddd',
+          color: darkMode ? '#fff' : '#000'
+        }"
+      >
+    </form>
 
-const logInAs = (user: string) => {
-  (props.state as DemoAuthState & { state: "ready" }).logInAs(user);
-};
-</script>
-  
+    <div
+      v-if="auth.existingUsers.length > 0"
+      :style="{
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '0.5rem'
+      }"
+    >
+      <p
+        :style="{
+          color: darkMode ? '#e2e2e2' : '#000',
+          textAlign: 'center',
+          paddingTop: '0.5rem',
+          borderTop: '1px solid',
+          borderColor: darkMode ? '#111' : '#e2e2e2'
+        }"
+      >
+        Log in as
+      </p>
+      <button
+        v-for="user in auth.existingUsers"
+        :key="user"
+        @click="auth.logIn(user)"
+        type="button"
+        :aria-label="`Log in as ${user}`"
+        :style="{
+          background: darkMode ? '#0d0d0d' : '#eee',
+          color: darkMode ? '#fff' : '#000',
+          padding: '0.5rem',
+          border: 'none',
+          borderRadius: '6px'
+        }"
+      >
+        {{ user }}
+      </button>
+    </div>
+  </div>
+</template>