jazz-tools 0.19.7 → 0.19.10

package/dist/react-native/index.js

@@ -1,11 +1,690 @@
-// src/react-native/index.ts
-export * from "jazz-tools/react-native-core";
+// src/react-native-core/storage/kv-store-context.ts
+var KvStoreContext = class _KvStoreContext {
+  constructor() {
+    this.storageInstance = null;
+  }
+  static getInstance() {
+    if (!_KvStoreContext.instance) {
+      _KvStoreContext.instance = new _KvStoreContext();
+    }
+    return _KvStoreContext.instance;
+  }
+  isInitialized() {
+    return this.storageInstance !== null;
+  }
+  initialize(store) {
+    if (!this.storageInstance) {
+      this.storageInstance = store;
+    }
+  }
+  getStorage() {
+    if (!this.storageInstance) {
+      throw new Error("Storage instance is not initialized.");
+    }
+    return this.storageInstance;
+  }
+};
+
+// src/react-native-core/auth/DemoAuthUI.tsx
+import { useState } from "react";
+import {
+  StyleSheet,
+  Text,
+  TextInput,
+  TouchableOpacity,
+  View,
+  useColorScheme
+} from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DemoAuthBasicUI = ({
+  appName,
+  auth,
+  children
+}) => {
+  const colorScheme = useColorScheme();
+  const darkMode = colorScheme === "dark";
+  const [username, setUsername] = useState("");
+  const [errorMessage, setErrorMessage] = useState(null);
+  const handleSignUp = () => {
+    setErrorMessage(null);
+    auth.signUp(username).catch((error) => {
+      setErrorMessage(error.message);
+    });
+  };
+  const handleLogIn = (username2) => {
+    setErrorMessage(null);
+    auth.logIn(username2).catch((error) => {
+      setErrorMessage(error.message);
+    });
+  };
+  if (auth.state === "signedIn") {
+    return children;
+  }
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      style: [
+        styles.container,
+        darkMode ? styles.darkBackground : styles.lightBackground
+      ],
+      children: /* @__PURE__ */ jsxs(View, { style: styles.formContainer, children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: [
+              styles.headerText,
+              darkMode ? styles.darkText : styles.lightText
+            ],
+            children: appName
+          }
+        ),
+        errorMessage && /* @__PURE__ */ jsx(Text, { style: styles.errorText, children: errorMessage }),
+        /* @__PURE__ */ jsx(
+          TextInput,
+          {
+            placeholder: "Display name",
+            value: username,
+            onChangeText: setUsername,
+            placeholderTextColor: darkMode ? "#fff" : "#000",
+            style: [
+              styles.textInput,
+              darkMode ? styles.darkInput : styles.lightInput
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          TouchableOpacity,
+          {
+            onPress: handleSignUp,
+            style: [
+              styles.button,
+              darkMode ? styles.darkButton : styles.lightButton
+            ],
+            children: /* @__PURE__ */ jsx(
+              Text,
+              {
+                style: darkMode ? styles.darkButtonText : styles.lightButtonText,
+                children: "Sign Up as new account"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(View, { style: styles.existingUsersContainer, children: auth.existingUsers.map((user) => /* @__PURE__ */ jsx(
+          TouchableOpacity,
+          {
+            onPress: () => handleLogIn(user),
+            style: [
+              styles.existingUserButton,
+              darkMode ? styles.darkUserButton : styles.lightUserButton
+            ],
+            children: /* @__PURE__ */ jsxs(Text, { style: darkMode ? styles.darkText : styles.lightText, children: [
+              'Log In as "',
+              user,
+              '"'
+            ] })
+          },
+          user
+        )) })
+      ] })
+    }
+  );
+};
+var styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: "center",
+    alignItems: "center",
+    padding: 20
+  },
+  formContainer: {
+    width: "80%",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  headerText: {
+    fontSize: 24,
+    marginBottom: 20
+  },
+  errorText: {
+    color: "red",
+    marginVertical: 5,
+    textAlign: "center"
+  },
+  textInput: {
+    borderWidth: 1,
+    padding: 10,
+    marginVertical: 10,
+    width: "100%",
+    borderRadius: 6
+  },
+  darkInput: {
+    borderColor: "#444",
+    backgroundColor: "#000",
+    color: "#fff"
+  },
+  lightInput: {
+    borderColor: "#ddd",
+    backgroundColor: "#fff",
+    color: "#000"
+  },
+  button: {
+    paddingVertical: 15,
+    paddingHorizontal: 10,
+    borderRadius: 6,
+    width: "100%",
+    marginVertical: 10
+  },
+  darkButton: {
+    backgroundColor: "#444"
+  },
+  lightButton: {
+    backgroundColor: "#ddd"
+  },
+  darkButtonText: {
+    color: "#fff",
+    textAlign: "center"
+  },
+  lightButtonText: {
+    color: "#000",
+    textAlign: "center"
+  },
+  existingUsersContainer: {
+    width: "100%",
+    marginTop: 20
+  },
+  existingUserButton: {
+    paddingVertical: 15,
+    paddingHorizontal: 10,
+    borderRadius: 6,
+    marginVertical: 5
+  },
+  darkUserButton: {
+    backgroundColor: "#222"
+  },
+  lightUserButton: {
+    backgroundColor: "#eee"
+  },
+  loadingText: {
+    fontSize: 18,
+    color: "#888"
+  },
+  darkText: {
+    color: "#fff"
+  },
+  lightText: {
+    color: "#000"
+  },
+  darkBackground: {
+    backgroundColor: "#000"
+  },
+  lightBackground: {
+    backgroundColor: "#fff"
+  }
+});
+
+// src/react-native-core/auth/auth.ts
+function clearUserCredentials() {
+  const kvStore = KvStoreContext.getInstance().getStorage();
+  return Promise.all([
+    kvStore.delete("demo-auth-logged-in-secret"),
+    kvStore.delete("jazz-clerk-auth"),
+    kvStore.delete("jazz-logged-in-secret")
+  ]);
+}
+
+// src/react-native-core/hooks.tsx
+import { useEffect } from "react";
+import { parseInviteLink } from "jazz-tools";
+import { useJazzContext } from "jazz-tools/react-core";
+import { Linking } from "react-native";
+import {
+  useCoState,
+  experimental_useInboxSender,
+  useDemoAuth,
+  usePassphraseAuth,
+  useJazzContext as useJazzContext2,
+  useAuthSecretStorage,
+  useIsAuthenticated,
+  useAccount,
+  useAgent,
+  useLogOut,
+  useSyncConnectionStatus,
+  useCoValueSubscription,
+  useAccountSubscription,
+  useSubscriptionSelector,
+  useSuspenseCoState,
+  useSuspenseAccount
+} from "jazz-tools/react-core";
+function useAcceptInviteNative({
+  invitedObjectSchema,
+  onAccept,
+  forValueHint
+}) {
+  const context = useJazzContext();
+  if (!("me" in context)) {
+    throw new Error(
+      "useAcceptInviteNative can't be used in a JazzProvider with auth === 'guest'."
+    );
+  }
+  useEffect(() => {
+    const handleDeepLink = ({ url }) => {
+      const result = parseInviteLink(url);
+      if (result && result.valueHint === forValueHint) {
+        context.me.acceptInvite(
+          result.valueID,
+          result.inviteSecret,
+          invitedObjectSchema
+        ).then(() => {
+          onAccept(result.valueID);
+        }).catch((e) => {
+          console.error("Failed to accept invite", e);
+        });
+      }
+    };
+    const linkingListener = Linking.addEventListener("url", handleDeepLink);
+    void Linking.getInitialURL().then((url) => {
+      if (url) handleDeepLink({ url });
+    });
+    return () => {
+      linkingListener.remove();
+    };
+  }, [context, onAccept, invitedObjectSchema, forValueHint]);
+}
+
+// src/react-native-core/provider.tsx
+import { JazzContext, JazzContextManagerContext } from "jazz-tools/react-core";
+import React2, { useEffect as useEffect2, useRef } from "react";
+
+// src/react-native-core/ReactNativeContextManager.ts
+import {
+  JazzContextManager
+} from "jazz-tools";
+
+// src/react-native-core/platform.ts
+import NetInfo from "@react-native-community/netinfo";
+import { getSqliteStorageAsync } from "cojson";
+import { PureJSCrypto } from "cojson/dist/crypto/PureJSCrypto";
+import {
+  createInviteLink as baseCreateInviteLink,
+  createAnonymousJazzContext,
+  createJazzContext
+} from "jazz-tools";
+import { WebSocketPeerWithReconnection } from "cojson-transport-ws";
+var ReactNativeWebSocketPeerWithReconnection = class extends WebSocketPeerWithReconnection {
+  onNetworkChange(callback) {
+    return NetInfo.addEventListener(
+      (state) => callback(state.isConnected ?? false)
+    );
+  }
+};
+async function setupPeers(options) {
+  const CryptoProvider2 = options.CryptoProvider || PureJSCrypto;
+  const crypto = await CryptoProvider2.create();
+  let node = void 0;
+  const peers = [];
+  const storage2 = options.storage && options.storage !== "disabled" ? await getSqliteStorageAsync(options.storage) : void 0;
+  if (options.sync.when === "never") {
+    return {
+      toggleNetwork: () => {
+      },
+      addConnectionListener: () => () => {
+      },
+      connected: () => false,
+      peers,
+      setNode: () => {
+      },
+      crypto,
+      storage: storage2
+    };
+  }
+  const wsPeer = new ReactNativeWebSocketPeerWithReconnection({
+    peer: options.sync.peer,
+    reconnectionTimeout: options.reconnectionTimeout,
+    addPeer: (peer) => {
+      if (node) {
+        node.syncManager.addPeer(peer);
+      } else {
+        peers.push(peer);
+      }
+    },
+    removePeer: (peer) => {
+      peers.splice(peers.indexOf(peer), 1);
+    }
+  });
+  function toggleNetwork(enabled) {
+    if (enabled) {
+      wsPeer.enable();
+    } else {
+      wsPeer.disable();
+    }
+  }
+  function setNode(value) {
+    node = value;
+  }
+  if (options.sync.when === "always" || !options.sync.when) {
+    toggleNetwork(true);
+  }
+  return {
+    toggleNetwork,
+    addConnectionListener(listener) {
+      wsPeer.subscribe(listener);
+      return () => {
+        wsPeer.unsubscribe(listener);
+      };
+    },
+    connected: () => wsPeer.connected,
+    peers,
+    setNode,
+    crypto,
+    storage: storage2
+  };
+}
+async function createJazzReactNativeGuestContext(options) {
+  const {
+    toggleNetwork,
+    peers,
+    setNode,
+    crypto,
+    storage: storage2,
+    addConnectionListener,
+    connected
+  } = await setupPeers(options);
+  const context = createAnonymousJazzContext({
+    crypto,
+    peers,
+    storage: storage2
+  });
+  setNode(context.agent.node);
+  options.authSecretStorage.emitUpdate(null);
+  return {
+    guest: context.agent,
+    node: context.agent.node,
+    done: () => {
+      toggleNetwork(false);
+      context.done();
+    },
+    logOut: () => {
+      return context.logOut();
+    },
+    addConnectionListener,
+    connected
+  };
+}
+async function createJazzReactNativeContext(options) {
+  const {
+    toggleNetwork,
+    peers,
+    setNode,
+    crypto,
+    storage: storage2,
+    addConnectionListener,
+    connected
+  } = await setupPeers(options);
+  let unsubscribeAuthUpdate = () => {
+  };
+  if (options.sync.when === "signedUp") {
+    let handleAuthUpdate2 = function(isAuthenticated) {
+      if (isAuthenticated) {
+        toggleNetwork(true);
+      } else {
+        toggleNetwork(false);
+      }
+    };
+    var handleAuthUpdate = handleAuthUpdate2;
+    const authSecretStorage = options.authSecretStorage;
+    const credentials = options.credentials ?? await authSecretStorage.get();
+    authSecretStorage.emitUpdate(credentials);
+    unsubscribeAuthUpdate = authSecretStorage.onUpdate(handleAuthUpdate2);
+    handleAuthUpdate2(authSecretStorage.isAuthenticated);
+  }
+  const context = await createJazzContext({
+    credentials: options.credentials,
+    newAccountProps: options.newAccountProps,
+    peers,
+    crypto,
+    defaultProfileName: options.defaultProfileName,
+    AccountSchema: options.AccountSchema,
+    sessionProvider: provideLockSession,
+    authSecretStorage: options.authSecretStorage,
+    storage: storage2
+  });
+  setNode(context.node);
+  return {
+    me: context.account,
+    node: context.node,
+    authSecretStorage: context.authSecretStorage,
+    done: () => {
+      toggleNetwork(false);
+      unsubscribeAuthUpdate();
+      context.done();
+    },
+    logOut: () => {
+      unsubscribeAuthUpdate();
+      return context.logOut();
+    },
+    addConnectionListener,
+    connected
+  };
+}
+async function provideLockSession(accountID, crypto) {
+  const sessionDone = () => {
+  };
+  const kvStore = KvStoreContext.getInstance().getStorage();
+  const sessionID = await kvStore.get(accountID) || crypto.newRandomSessionID(accountID);
+  await kvStore.set(accountID, sessionID);
+  return Promise.resolve({
+    sessionID,
+    sessionDone
+  });
+}
+function createInviteLink(value, role, { baseURL, valueHint } = {}) {
+  return baseCreateInviteLink(value, role, baseURL ?? "", valueHint);
+}
+function setupKvStore(kvStore) {
+  if (!kvStore) {
+    return void 0;
+  }
+  KvStoreContext.getInstance().initialize(kvStore);
+  return kvStore;
+}
+
+// src/react-native-core/ReactNativeContextManager.ts
+var ReactNativeContextManager = class extends JazzContextManager {
+  async getNewContext(props, authProps) {
+    if (props.guestMode) {
+      return createJazzReactNativeGuestContext({
+        sync: props.sync,
+        storage: props.storage,
+        authSecretStorage: this.authSecretStorage,
+        CryptoProvider: props.CryptoProvider
+      });
+    } else {
+      return createJazzReactNativeContext({
+        sync: props.sync,
+        storage: props.storage,
+        AccountSchema: props.AccountSchema,
+        credentials: authProps?.credentials,
+        newAccountProps: authProps?.newAccountProps,
+        defaultProfileName: props.defaultProfileName,
+        authSecretStorage: this.authSecretStorage,
+        CryptoProvider: props.CryptoProvider
+      });
+    }
+  }
+  getKvStore() {
+    return KvStoreContext.getInstance().getStorage();
+  }
+  propsChanged(props) {
+    if (!this.props) {
+      return true;
+    }
+    return this.props.sync.when !== props.sync.when || this.props.sync.peer !== props.sync.peer || this.props.guestMode !== props.guestMode;
+  }
+};
+
+// src/react-native-core/provider.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+function JazzProviderCore({
+  children,
+  guestMode,
+  sync,
+  storage: storage2,
+  AccountSchema,
+  defaultProfileName,
+  onLogOut,
+  logOutReplacement,
+  onAnonymousAccountDiscarded,
+  kvStore,
+  CryptoProvider: CryptoProvider2,
+  authSecretStorageKey
+}) {
+  setupKvStore(kvStore);
+  const [contextManager] = React2.useState(
+    () => new ReactNativeContextManager({ authSecretStorageKey })
+  );
+  const onLogOutRefCallback = useRefCallback(onLogOut);
+  const logOutReplacementRefCallback = useRefCallback(logOutReplacement);
+  const onAnonymousAccountDiscardedRefCallback = useRefCallback(
+    onAnonymousAccountDiscarded
+  );
+  const logoutReplacementActiveRef = useRef(false);
+  logoutReplacementActiveRef.current = Boolean(logOutReplacement);
+  const value = React2.useSyncExternalStore(
+    React2.useCallback(
+      (callback) => {
+        const props = {
+          AccountSchema,
+          guestMode,
+          sync,
+          storage: storage2,
+          defaultProfileName,
+          onLogOut: onLogOutRefCallback,
+          logOutReplacement: logoutReplacementActiveRef.current ? logOutReplacementRefCallback : void 0,
+          onAnonymousAccountDiscarded: onAnonymousAccountDiscardedRefCallback,
+          CryptoProvider: CryptoProvider2
+        };
+        if (contextManager.propsChanged(props)) {
+          contextManager.createContext(props).catch((error) => {
+            console.log(error.stack);
+            console.error("Error creating Jazz React Native context:", error);
+          });
+        }
+        return contextManager.subscribe(callback);
+      },
+      [sync, guestMode].concat(storage2)
+    ),
+    () => contextManager.getCurrentValue(),
+    () => contextManager.getCurrentValue()
+  );
+  useEffect2(() => {
+    if (process.env.NODE_ENV === "development") return;
+    return () => {
+      contextManager.done();
+    };
+  }, []);
+  return /* @__PURE__ */ jsx2(JazzContext.Provider, { value, children: /* @__PURE__ */ jsx2(JazzContextManagerContext.Provider, { value: contextManager, children: value && children }) });
+}
+function useRefCallback(callback) {
+  const callbackRef = React2.useRef(callback);
+  callbackRef.current = callback;
+  return useRef(
+    (...args) => callbackRef.current?.(...args)
+  ).current;
+}
+
+// src/react-native-core/media/image.tsx
+import { ImageDefinition } from "jazz-tools";
+import { highestResAvailable } from "jazz-tools/media";
+import { forwardRef, useEffect as useEffect3, useMemo, useState as useState2 } from "react";
+import { Image as RNImage } from "react-native";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Image = forwardRef(function Image2({ imageId, width, height, placeholder, ...props }, ref) {
+  const image = useCoState(ImageDefinition, imageId, {
+    select: (image2) => image2.$isLoaded ? image2 : null
+  });
+  const [src, setSrc] = useState2(
+    image?.placeholderDataURL ?? "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw=="
+  );
+  const dimensions = useMemo(() => {
+    const originalWidth = image?.originalSize?.[0];
+    const originalHeight = image?.originalSize?.[1];
+    if (width === "original" && height === "original") {
+      return { width: originalWidth, height: originalHeight };
+    }
+    if (width === "original" && typeof height === "number") {
+      if (originalWidth && originalHeight) {
+        return {
+          width: Math.round(height * originalWidth / originalHeight),
+          height
+        };
+      }
+      return { width: void 0, height };
+    }
+    if (height === "original" && typeof width === "number") {
+      if (originalWidth && originalHeight) {
+        return {
+          width,
+          height: Math.round(width * originalHeight / originalWidth)
+        };
+      }
+      return { width, height: void 0 };
+    }
+    return {
+      width: width === "original" ? originalWidth : width,
+      height: height === "original" ? originalHeight : height
+    };
+  }, [image?.originalSize, width, height]);
+  useEffect3(() => {
+    if (!image) return;
+    let lastBestImage = image?.placeholderDataURL ?? placeholder;
+    const unsub = image.$jazz.subscribe({}, (update) => {
+      if (lastBestImage === void 0 && update.placeholderDataURL) {
+        setSrc(update.placeholderDataURL);
+        lastBestImage = update.placeholderDataURL;
+      }
+      const bestImage = highestResAvailable(
+        update,
+        dimensions.width || dimensions.height || 9999,
+        dimensions.height || dimensions.width || 9999
+      );
+      if (!bestImage) return;
+      if (lastBestImage === bestImage.image) return;
+      const url = bestImage.image.asBase64({ dataURL: true });
+      if (url) {
+        setSrc(url);
+        lastBestImage = bestImage.image;
+      }
+    });
+    return unsub;
+  }, [image]);
+  if (!src) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx3(
+    RNImage,
+    {
+      ref,
+      source: { uri: src },
+      width: dimensions.width,
+      height: dimensions.height,
+      ...props
+    }
+  );
+});
+
+// src/react-native-core/index.ts
+import {
+  createCoValueSubscriptionContext,
+  createAccountSubscriptionContext
+} from "jazz-tools/react-core";
+import { SQLiteDatabaseDriverAsync } from "cojson";
+import { parseInviteLink as parseInviteLink2 } from "jazz-tools";
 
 // src/react-native/provider.tsx
 import {
-  JazzProviderCore
+  JazzProviderCore as JazzProviderCore2
 } from "jazz-tools/react-native-core";
-import { useMemo } from "react";
+import { useMemo as useMemo2 } from "react";
 
 // src/react-native/storage/mmkv-store-adapter.ts
 import { MMKV } from "react-native-mmkv";
@@ -85,19 +764,48 @@ var OPSQLiteAdapter = class {
 };
 
 // src/react-native/provider.tsx
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 function JazzReactNativeProvider(props) {
-  const storage2 = useMemo(() => {
+  const storage2 = useMemo2(() => {
     return props.storage ?? new OPSQLiteAdapter();
   }, [props.storage]);
-  const kvStore = useMemo(() => {
+  const kvStore = useMemo2(() => {
     return props.kvStore ?? new MMKVStore();
   }, [props.kvStore]);
-  return /* @__PURE__ */ jsx(JazzProviderCore, { ...props, storage: storage2, kvStore });
+  return /* @__PURE__ */ jsx4(JazzProviderCore2, { ...props, storage: storage2, kvStore });
 }
 export {
+  DemoAuthBasicUI,
+  Image,
+  JazzProviderCore,
   JazzReactNativeProvider,
+  KvStoreContext,
   MMKVStore,
-  OPSQLiteAdapter
+  OPSQLiteAdapter,
+  ReactNativeContextManager,
+  SQLiteDatabaseDriverAsync,
+  clearUserCredentials,
+  createAccountSubscriptionContext,
+  createCoValueSubscriptionContext,
+  createInviteLink,
+  experimental_useInboxSender,
+  parseInviteLink2 as parseInviteLink,
+  setupKvStore,
+  useAcceptInviteNative,
+  useAccount,
+  useAccountSubscription,
+  useAgent,
+  useAuthSecretStorage,
+  useCoState,
+  useCoValueSubscription,
+  useDemoAuth,
+  useIsAuthenticated,
+  useJazzContext2 as useJazzContext,
+  useLogOut,
+  usePassphraseAuth,
+  useSubscriptionSelector,
+  useSuspenseAccount,
+  useSuspenseCoState,
+  useSyncConnectionStatus
 };
 //# sourceMappingURL=index.js.map