@liveblocks/react 1.2.2-comments3 → 1.2.2-comments5

package/dist/index.js

@@ -1,9 +1,11 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }// src/index.ts
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
+
+// src/index.ts
 var _core = require('@liveblocks/core');
 
 // src/version.ts
 var PKG_NAME = "@liveblocks/react";
-var PKG_VERSION = "1.2.2-comments3";
+var PKG_VERSION = "1.2.2-comments5";
 var PKG_FORMAT = "cjs";
 
 // src/ClientSideSuspense.tsx
@@ -24,8 +26,452 @@ var _client = require('@liveblocks/client');
 
 
 
+
+
 var _withselectorjs = require('use-sync-external-store/shim/with-selector.js');
 
+// src/comments/CommentsRoom.ts
+
+var _nanoid = require('nanoid');
+var _indexjs = require('use-sync-external-store/shim/index.js');
+
+// src/comments/errors.ts
+var CreateThreadError = class extends Error {
+  constructor(cause, context) {
+    super("Create thread failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "CreateThreadError";
+  }
+};
+var EditThreadMetadataError = class extends Error {
+  constructor(cause, context) {
+    super("Edit thread metadata failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "EditThreadMetadataError";
+  }
+};
+var CreateCommentError = class extends Error {
+  constructor(cause, context) {
+    super("Create comment failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "CreateCommentError";
+  }
+};
+var EditCommentError = class extends Error {
+  constructor(cause, context) {
+    super("Edit comment failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "EditCommentError";
+  }
+};
+var DeleteCommentError = class extends Error {
+  constructor(cause, context) {
+    super("Delete comment failed.");
+    this.cause = cause;
+    this.context = context;
+    this.name = "DeleteCommentError";
+  }
+};
+
+// src/comments/lib/store.ts
+
+function createStore(initialState) {
+  let state = initialState;
+  const eventSource = _core.makeEventSource.call(void 0, );
+  return {
+    get() {
+      return state;
+    },
+    set(newState) {
+      state = newState;
+      eventSource.notify(state);
+    },
+    subscribe(callback) {
+      return eventSource.subscribe(callback);
+    },
+    subscribeOnce(callback) {
+      return eventSource.subscribeOnce(callback);
+    },
+    subscribersCount() {
+      return eventSource.count();
+    },
+    destroy() {
+      return eventSource.clear();
+    }
+  };
+}
+
+// src/comments/CommentsRoom.ts
+var POLLING_INTERVAL_REALTIME = 3e4;
+var POLLING_INTERVAL = 5e3;
+var THREAD_ID_PREFIX = "th";
+var COMMENT_ID_PREFIX = "cm";
+function createOptimisticId(prefix) {
+  return `${prefix}_${_nanoid.nanoid.call(void 0, )}`;
+}
+function createCommentsRoom(room, errorEventSource) {
+  const store = createStore({
+    isLoading: true
+  });
+  let numberOfMutations = 0;
+  function endMutation() {
+    numberOfMutations--;
+    if (numberOfMutations === 0) {
+      revalidateThreads();
+    }
+  }
+  function startMutation() {
+    pollingHub.threads.stop();
+    numberOfMutations++;
+  }
+  const pollingHub = {
+    // TODO: If there's an error, it will currently infinitely retry at the current polling rate → add retry logic
+    threads: _core.makePoller.call(void 0, revalidateThreads)
+  };
+  let unsubscribeRealtimeEvents;
+  let unsubscribeRealtimeConnection;
+  let realtimeClientConnected = false;
+  function getPollingInterval() {
+    return realtimeClientConnected ? POLLING_INTERVAL_REALTIME : POLLING_INTERVAL;
+  }
+  function ensureThreadsAreLoadedForMutations() {
+    const state = store.get();
+    if (state.isLoading || state.error) {
+      throw new Error(
+        "Cannot update threads or comments before they are loaded"
+      );
+    }
+    return state.threads;
+  }
+  async function revalidateThreads() {
+    pollingHub.threads.pause();
+    if (numberOfMutations === 0) {
+      setThreads(await room.getThreads());
+    }
+    pollingHub.threads.resume();
+  }
+  function subscribe() {
+    if (!unsubscribeRealtimeEvents) {
+      unsubscribeRealtimeEvents = room.events.comments.subscribe(() => {
+        pollingHub.threads.restart(getPollingInterval());
+        revalidateThreads();
+      });
+    }
+    if (!unsubscribeRealtimeConnection) {
+      unsubscribeRealtimeConnection = room.events.status.subscribe((status) => {
+        const nextRealtimeClientConnected = status === "connected";
+        if (nextRealtimeClientConnected !== realtimeClientConnected) {
+          realtimeClientConnected = nextRealtimeClientConnected;
+          pollingHub.threads.restart(getPollingInterval());
+        }
+      });
+    }
+    pollingHub.threads.start(getPollingInterval());
+    revalidateThreads();
+    return () => {
+      pollingHub.threads.stop();
+      _optionalChain([unsubscribeRealtimeEvents, 'optionalCall', _ => _()]);
+      unsubscribeRealtimeEvents = void 0;
+      _optionalChain([unsubscribeRealtimeConnection, 'optionalCall', _2 => _2()]);
+      unsubscribeRealtimeConnection = void 0;
+    };
+  }
+  function setThreads(newThreads) {
+    store.set({
+      threads: newThreads,
+      isLoading: false
+    });
+  }
+  function getCurrentUserId() {
+    const self = room.getSelf();
+    if (self === null || self.id === void 0) {
+      return "anonymous";
+    } else {
+      return self.id;
+    }
+  }
+  function createThread(options) {
+    const body = options.body;
+    const metadata = "metadata" in options ? options.metadata : {};
+    const threads = ensureThreadsAreLoadedForMutations();
+    const threadId = createOptimisticId(THREAD_ID_PREFIX);
+    const commentId = createOptimisticId(COMMENT_ID_PREFIX);
+    const now = (/* @__PURE__ */ new Date()).toISOString();
+    const newThread = {
+      id: threadId,
+      type: "thread",
+      createdAt: now,
+      roomId: room.id,
+      metadata,
+      comments: [
+        {
+          id: commentId,
+          createdAt: now,
+          type: "comment",
+          userId: getCurrentUserId(),
+          body
+        }
+      ]
+    };
+    setThreads([...threads, newThread]);
+    startMutation();
+    room.createThread({ threadId, commentId, body, metadata }).catch(
+      (er) => errorEventSource.notify(
+        new CreateThreadError(er, {
+          roomId: room.id,
+          threadId,
+          commentId,
+          body,
+          metadata
+        })
+      )
+    ).finally(endMutation);
+    return newThread;
+  }
+  function editThreadMetadata(options) {
+    const threadId = options.threadId;
+    const metadata = "metadata" in options ? options.metadata : {};
+    const threads = ensureThreadsAreLoadedForMutations();
+    setThreads(
+      threads.map(
+        (thread) => thread.id === threadId ? {
+          ...thread,
+          metadata: {
+            ...thread.metadata,
+            ...metadata
+          }
+        } : thread
+      )
+    );
+    startMutation();
+    room.editThreadMetadata({ metadata, threadId }).catch(
+      (er) => errorEventSource.notify(
+        new EditThreadMetadataError(er, {
+          roomId: room.id,
+          threadId,
+          metadata
+        })
+      )
+    ).finally(endMutation);
+  }
+  function createComment({
+    threadId,
+    body
+  }) {
+    const threads = ensureThreadsAreLoadedForMutations();
+    const commentId = createOptimisticId(COMMENT_ID_PREFIX);
+    const now = (/* @__PURE__ */ new Date()).toISOString();
+    const comment = {
+      id: commentId,
+      threadId,
+      roomId: room.id,
+      type: "comment",
+      createdAt: now,
+      userId: getCurrentUserId(),
+      body
+    };
+    setThreads(
+      threads.map(
+        (thread) => thread.id === threadId ? {
+          ...thread,
+          comments: [...thread.comments, comment]
+        } : thread
+      )
+    );
+    startMutation();
+    room.createComment({ threadId, commentId, body }).catch(
+      (er) => errorEventSource.notify(
+        new CreateCommentError(er, {
+          roomId: room.id,
+          threadId,
+          commentId,
+          body
+        })
+      )
+    ).finally(endMutation);
+    return comment;
+  }
+  function editComment({ threadId, commentId, body }) {
+    const threads = ensureThreadsAreLoadedForMutations();
+    const now = (/* @__PURE__ */ new Date()).toISOString();
+    setThreads(
+      threads.map(
+        (thread) => thread.id === threadId ? {
+          ...thread,
+          comments: thread.comments.map(
+            (comment) => comment.id === commentId ? {
+              ...comment,
+              editedAt: now,
+              body
+            } : comment
+          )
+        } : thread
+      )
+    );
+    startMutation();
+    room.editComment({ threadId, commentId, body }).catch(
+      (er) => errorEventSource.notify(
+        new EditCommentError(er, {
+          roomId: room.id,
+          threadId,
+          commentId,
+          body
+        })
+      )
+    ).finally(endMutation);
+  }
+  function deleteComment({ threadId, commentId }) {
+    const threads = ensureThreadsAreLoadedForMutations();
+    const now = (/* @__PURE__ */ new Date()).toISOString();
+    const newThreads = [];
+    for (const thread of threads) {
+      if (thread.id === threadId) {
+        const newThread = {
+          ...thread,
+          comments: thread.comments.map(
+            (comment) => comment.id === commentId ? {
+              ...comment,
+              deletedAt: now,
+              body: void 0
+            } : comment
+          )
+        };
+        if (newThread.comments.some((comment) => comment.deletedAt === void 0)) {
+          newThreads.push(newThread);
+        }
+      } else {
+        newThreads.push(thread);
+      }
+    }
+    setThreads(newThreads);
+    startMutation();
+    room.deleteComment({ threadId, commentId }).catch(
+      (er) => errorEventSource.notify(
+        new DeleteCommentError(er, {
+          roomId: room.id,
+          threadId,
+          commentId
+        })
+      )
+    ).finally(endMutation);
+  }
+  function useThreads() {
+    return _indexjs.useSyncExternalStore.call(void 0, 
+      store.subscribe,
+      store.get,
+      store.get
+    );
+  }
+  function useThreadsSuspense() {
+    const result = useThreads();
+    if (result.isLoading) {
+      throw new Promise(store.subscribeOnce);
+    }
+    if (result.error) {
+      throw result.error;
+    }
+    return result.threads;
+  }
+  return {
+    useThreads,
+    useThreadsSuspense,
+    createThread,
+    editThreadMetadata,
+    createComment,
+    editComment,
+    deleteComment,
+    subscribe
+  };
+}
+
+// src/comments/lib/use-async-cache.ts
+
+
+
+// src/comments/lib/use-initial.ts
+
+function useInitial(value) {
+  return _react.useRef.call(void 0, value instanceof Function ? value() : value).current;
+}
+
+// src/comments/lib/use-async-cache.ts
+var INITIAL_ASYNC_STATE = {
+  isLoading: false,
+  data: void 0,
+  error: void 0
+};
+var noop = () => {
+};
+function useAsyncCache(cache, key, options) {
+  const frozenOptions = useInitial(options);
+  const cacheItem = _react.useMemo.call(void 0, () => {
+    if (key === null || !cache) {
+      return null;
+    }
+    const cacheItem2 = cache.create(key, _optionalChain([frozenOptions, 'optionalAccess', _3 => _3.overrideFunction]));
+    void cacheItem2.get();
+    return cacheItem2;
+  }, [cache, frozenOptions, key]);
+  const subscribe = _react.useCallback.call(void 0, 
+    (callback) => _nullishCoalesce(_optionalChain([cacheItem, 'optionalAccess', _4 => _4.subscribe, 'call', _5 => _5(callback)]), () => ( noop)),
+    [cacheItem]
+  );
+  const getState = _react.useCallback.call(void 0, 
+    () => _nullishCoalesce(_optionalChain([cacheItem, 'optionalAccess', _6 => _6.getState, 'call', _7 => _7()]), () => ( INITIAL_ASYNC_STATE)),
+    [cacheItem]
+  );
+  const revalidate = _react.useCallback.call(void 0, () => _optionalChain([cacheItem, 'optionalAccess', _8 => _8.revalidate, 'call', _9 => _9()]), [cacheItem]);
+  const state = _indexjs.useSyncExternalStore.call(void 0, subscribe, getState, getState);
+  const previousData = _react.useRef.call(void 0, );
+  let data = state.data;
+  _react.useEffect.call(void 0, () => {
+    previousData.current = { key, data: state.data };
+  }, [key, state]);
+  if (_optionalChain([frozenOptions, 'optionalAccess', _10 => _10.suspense]) && state.isLoading && cacheItem) {
+    throw new Promise((resolve) => {
+      cacheItem.subscribeOnce(() => resolve());
+    });
+  }
+  if (state.isLoading && _optionalChain([frozenOptions, 'optionalAccess', _11 => _11.keepPreviousDataWhileLoading]) && typeof state.data === "undefined" && _optionalChain([previousData, 'access', _12 => _12.current, 'optionalAccess', _13 => _13.key]) !== key && typeof _optionalChain([previousData, 'access', _14 => _14.current, 'optionalAccess', _15 => _15.data]) !== "undefined") {
+    data = previousData.current.data;
+  }
+  return {
+    isLoading: state.isLoading,
+    data,
+    error: state.error,
+    getState,
+    revalidate
+  };
+}
+
+// src/comments/lib/use-debounce.ts
+
+var DEFAULT_DELAY = 500;
+function useDebounce(value, delay = DEFAULT_DELAY) {
+  const timeout = _react.useRef.call(void 0, );
+  const [debouncedValue, setDebouncedValue] = _react.useState.call(void 0, value);
+  _react.useEffect.call(void 0, () => {
+    if (delay === false) {
+      return;
+    }
+    if (timeout.current === void 0) {
+      setDebouncedValue(value);
+    }
+    timeout.current = window.setTimeout(() => {
+      setDebouncedValue(value);
+      timeout.current = void 0;
+    }, delay);
+    return () => {
+      window.clearTimeout(timeout.current);
+    };
+  }, [value, delay]);
+  return debouncedValue;
+}
+
 // src/hooks.ts
 
 function useRerender() {
@@ -38,12 +484,12 @@ function useRerender() {
   );
   return update;
 }
-function useInitial(value) {
+function useInitial2(value) {
   return _react.useRef.call(void 0, value).current;
 }
 
 // src/factory.tsx
-var noop = () => {
+var noop2 = () => {
 };
 var identity = (x) => x;
 var missing_unstable_batchedUpdates = (reactVersion, roomId) => `We noticed you\u2019re using React ${reactVersion}. Please pass unstable_batchedUpdates at the RoomProvider level until you\u2019re ready to upgrade to React 18:
@@ -58,7 +504,7 @@ var missing_unstable_batchedUpdates = (reactVersion, roomId) => `We noticed you\
 
 Why? Please see https://liveblocks.io/docs/guides/troubleshooting#stale-props-zombie-child for more information`;
 var superfluous_unstable_batchedUpdates = "You don\u2019t need to pass unstable_batchedUpdates to RoomProvider anymore, since you\u2019re on React 18+ already.";
-function useSyncExternalStore(s, gs, gss) {
+function useSyncExternalStore3(s, gs, gss) {
   return _withselectorjs.useSyncExternalStoreWithSelector.call(void 0, s, gs, gss, identity);
 }
 var EMPTY_OTHERS = (
@@ -95,7 +541,20 @@ function makeMutationContext(room) {
     setMyPresence: room.updatePresence
   };
 }
-function createRoomContext(client) {
+var hasWarnedIfNoResolveUser = false;
+function warnIfNoResolveUser(usersCache) {
+  if (!hasWarnedIfNoResolveUser && !usersCache && process.env.NODE_ENV !== "production") {
+    console.warn(
+      "Set the resolveUser option in createRoomContext to specify user info."
+    );
+    hasWarnedIfNoResolveUser = true;
+  }
+}
+var ContextBundle = React2.createContext(null);
+function useRoomContextBundle() {
+  return React2.useContext(ContextBundle);
+}
+function createRoomContext(client, options) {
   const RoomContext = React2.createContext(null);
   function RoomProvider(props) {
     const {
@@ -125,7 +584,7 @@ function createRoomContext(client) {
         superfluous_unstable_batchedUpdates
       );
     }
-    const frozen = useInitial({
+    const frozen = useInitial2({
       initialPresence,
       initialStorage,
       unstable_batchedUpdates,
@@ -140,19 +599,24 @@ function createRoomContext(client) {
       })
     );
     React2.useEffect(() => {
-      setRoom(
-        client.enter(roomId, {
+      const room2 = client.enter(
+        roomId,
+        {
           initialPresence: frozen.initialPresence,
           initialStorage: frozen.initialStorage,
           shouldInitiallyConnect: frozen.shouldInitiallyConnect,
           unstable_batchedUpdates: frozen.unstable_batchedUpdates
-        })
+        }
       );
+      setRoom(room2);
+      const unsubscribe = getCommentsRoom(room2).subscribe();
       return () => {
+        unsubscribe();
+        commentsRooms.delete(room2.id);
         client.leave(roomId);
       };
     }, [roomId, frozen]);
-    return /* @__PURE__ */ React2.createElement(RoomContext.Provider, { value: room }, props.children);
+    return /* @__PURE__ */ React2.createElement(RoomContext.Provider, { value: room }, /* @__PURE__ */ React2.createElement(ContextBundle.Provider, { value: bundle }, props.children));
   }
   function connectionIdSelector(others) {
     return others.map((user) => user.connectionId);
@@ -160,7 +624,7 @@ function createRoomContext(client) {
   function useRoom() {
     const room = React2.useContext(RoomContext);
     if (room === null) {
-      throw new Error("RoomProvider is missing from the react tree");
+      throw new Error("RoomProvider is missing from the React tree.");
     }
     return room;
   }
@@ -168,13 +632,13 @@ function createRoomContext(client) {
     const room = useRoom();
     const subscribe = room.events.status.subscribe;
     const getSnapshot = room.getStatus;
-    return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+    return useSyncExternalStore3(subscribe, getSnapshot, getSnapshot);
   }
   function useMyPresence() {
     const room = useRoom();
     const subscribe = room.events.myPresence.subscribe;
     const getSnapshot = room.getPresence;
-    const presence = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+    const presence = useSyncExternalStore3(subscribe, getSnapshot, getSnapshot);
     const setPresence = room.updatePresence;
     return [presence, setPresence];
   }
@@ -248,8 +712,8 @@ function createRoomContext(client) {
   function useBroadcastEvent() {
     const room = useRoom();
     return React2.useCallback(
-      (event, options = { shouldQueueEventIfNotReady: false }) => {
-        room.broadcastEvent(event, options);
+      (event, options2 = { shouldQueueEventIfNotReady: false }) => {
+        room.broadcastEvent(event, options2);
       },
       [room]
     );
@@ -314,7 +778,7 @@ function createRoomContext(client) {
     const subscribe = room.events.storageDidLoad.subscribeOnce;
     const getSnapshot = room.getStorageSnapshot;
     const getServerSnapshot = React2.useCallback(() => null, []);
-    return useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+    return useSyncExternalStore3(subscribe, getSnapshot, getServerSnapshot);
   }
   function useStorageRoot() {
     return [useMutableStorageRoot()];
@@ -332,13 +796,13 @@ function createRoomContext(client) {
     const room = useRoom();
     const subscribe = room.events.history.subscribe;
     const canUndo = room.history.canUndo;
-    return useSyncExternalStore(subscribe, canUndo, canUndo);
+    return useSyncExternalStore3(subscribe, canUndo, canUndo);
   }
   function useCanRedo() {
     const room = useRoom();
     const subscribe = room.events.history.subscribe;
     const canRedo = room.history.canRedo;
-    return useSyncExternalStore(subscribe, canRedo, canRedo);
+    return useSyncExternalStore3(subscribe, canRedo, canRedo);
   }
   function useBatch() {
     return useRoom().batch;
@@ -395,7 +859,7 @@ function createRoomContext(client) {
       [selector]
     );
     const subscribe = React2.useCallback(
-      (onStoreChange) => rootOrNull !== null ? room.subscribe(rootOrNull, onStoreChange, { isDeep: true }) : noop,
+      (onStoreChange) => rootOrNull !== null ? room.subscribe(rootOrNull, onStoreChange, { isDeep: true }) : noop2,
       [room, rootOrNull]
     );
     const getSnapshot = React2.useCallback(() => {
@@ -501,7 +965,119 @@ function createRoomContext(client) {
     useSuspendUntilStorageLoaded();
     return useLegacyKey(key);
   }
-  return {
+  const errorEventSource = _core.makeEventSource.call(void 0, );
+  const commentsRooms = /* @__PURE__ */ new Map();
+  function getCommentsRoom(room) {
+    let commentsRoom = commentsRooms.get(room.id);
+    if (commentsRoom === void 0) {
+      commentsRoom = createCommentsRoom(room, errorEventSource);
+      commentsRooms.set(room.id, commentsRoom);
+    }
+    return commentsRoom;
+  }
+  function useThreads() {
+    const room = useRoom();
+    return getCommentsRoom(room).useThreads();
+  }
+  function useThreadsSuspense() {
+    const room = useRoom();
+    return getCommentsRoom(room).useThreadsSuspense();
+  }
+  function useCreateThread() {
+    const room = useRoom();
+    return React2.useCallback(
+      (options2) => getCommentsRoom(room).createThread(options2),
+      [room]
+    );
+  }
+  function useEditThreadMetadata() {
+    const room = useRoom();
+    return React2.useCallback(
+      (options2) => getCommentsRoom(room).editThreadMetadata(options2),
+      [room]
+    );
+  }
+  function useCreateComment() {
+    const room = useRoom();
+    return React2.useCallback(
+      (options2) => getCommentsRoom(room).createComment(options2),
+      [room]
+    );
+  }
+  function useEditComment() {
+    const room = useRoom();
+    return React2.useCallback(
+      (options2) => getCommentsRoom(room).editComment(options2),
+      [room]
+    );
+  }
+  function useDeleteComment() {
+    const room = useRoom();
+    return React2.useCallback(
+      (options2) => getCommentsRoom(room).deleteComment(options2),
+      [room]
+    );
+  }
+  const { resolveUser, resolveMentionSuggestions } = _nullishCoalesce(options, () => ( {}));
+  const usersCache = resolveUser ? _core.createAsyncCache.call(void 0, (stringifiedOptions) => {
+    return resolveUser(
+      JSON.parse(stringifiedOptions)
+    );
+  }) : void 0;
+  function useUser(userId) {
+    const resolverKey = React2.useMemo(
+      () => JSON.stringify({ userId }),
+      [userId]
+    );
+    const state = useAsyncCache(usersCache, resolverKey);
+    React2.useEffect(() => warnIfNoResolveUser(usersCache), []);
+    if (state.isLoading) {
+      return {
+        isLoading: true
+      };
+    } else {
+      return {
+        user: state.data,
+        error: state.error,
+        isLoading: false
+      };
+    }
+  }
+  function useUserSuspense(userId) {
+    const resolverKey = React2.useMemo(
+      () => JSON.stringify({ userId }),
+      [userId]
+    );
+    const state = useAsyncCache(usersCache, resolverKey, {
+      suspense: true
+    });
+    React2.useEffect(() => warnIfNoResolveUser(usersCache), []);
+    return {
+      user: state.data,
+      error: state.error,
+      isLoading: false
+    };
+  }
+  const mentionSuggestionsCache = _core.createAsyncCache.call(void 0, 
+    resolveMentionSuggestions ? (stringifiedOptions) => {
+      return resolveMentionSuggestions(
+        JSON.parse(stringifiedOptions)
+      );
+    } : () => Promise.resolve([])
+  );
+  function useMentionSuggestions(search) {
+    const room = useRoom();
+    const debouncedSearch = useDebounce(search, 500);
+    const resolverKey = React2.useMemo(
+      () => debouncedSearch !== void 0 ? JSON.stringify({ text: debouncedSearch, roomId: room.id }) : null,
+      [debouncedSearch, room.id]
+    );
+    const { data } = useAsyncCache(mentionSuggestionsCache, resolverKey, {
+      keepPreviousDataWhileLoading: true
+    });
+    return data;
+  }
+  const bundle = {
     RoomContext,
     RoomProvider,
     useRoom,
@@ -530,6 +1106,14 @@ function createRoomContext(client) {
     useOthersConnectionIds,
     useOther,
     useMutation,
+    useThreads,
+    useUser,
+    useCreateThread,
+    useEditThreadMetadata,
+    useCreateComment,
+    useEditComment,
+    useDeleteComment,
+    useMentionSuggestions,
     suspense: {
       RoomContext,
       RoomProvider,
@@ -558,9 +1142,17 @@ function createRoomContext(client) {
       useOthersMapped: useOthersMappedSuspense,
       useOthersConnectionIds: useOthersConnectionIdsSuspense,
       useOther: useOtherSuspense,
-      useMutation
+      useMutation,
+      useThreads: useThreadsSuspense,
+      useUser: useUserSuspense,
+      useCreateThread,
+      useEditThreadMetadata,
+      useCreateComment,
+      useEditComment,
+      useDeleteComment
     }
   };
+  return bundle;
 }
 
 // src/index.ts
@@ -570,5 +1162,6 @@ _core.detectDupes.call(void 0, PKG_NAME, PKG_VERSION, PKG_FORMAT);
 
 
 
-exports.ClientSideSuspense = ClientSideSuspense; exports.createRoomContext = createRoomContext; exports.shallow = _client.shallow;
+
+exports.ClientSideSuspense = ClientSideSuspense; exports.createRoomContext = createRoomContext; exports.shallow = _client.shallow; exports.useRoomContextBundle = useRoomContextBundle;
 //# sourceMappingURL=index.js.map