@liveblocks/core 0.19.3-beta4 → 0.19.3

package/dist/index.d.ts

@@ -633,6 +633,48 @@ declare type OthersEvent<TPresence extends JsonObject, TUserMeta extends BaseUse
     type: "reset";
 };
 
+declare type JsonTreeNode = {
+    readonly type: "Json";
+    readonly id: string;
+    readonly key: string;
+    readonly payload: Json;
+};
+declare type LiveTreeNode<TName extends `Live${string}` = `Live${string}`> = {
+    readonly type: TName;
+    readonly id: string;
+    readonly key: string;
+    readonly payload: LsonTreeNode[];
+};
+declare type LsonTreeNode = LiveTreeNode | JsonTreeNode;
+declare type UserTreeNode = {
+    readonly type: "User";
+    readonly id: string;
+    readonly key: string;
+    readonly payload: {
+        readonly connectionId: number;
+        readonly id?: string;
+        readonly info?: Json;
+        readonly presence: JsonObject;
+        readonly isReadOnly: boolean;
+    };
+};
+declare type TreeNode = LsonTreeNode | UserTreeNode;
+
+type DevToolsTreeNode_JsonTreeNode = JsonTreeNode;
+type DevToolsTreeNode_LiveTreeNode<TName extends `Live${string}` = `Live${string}`> = LiveTreeNode<TName>;
+type DevToolsTreeNode_LsonTreeNode = LsonTreeNode;
+type DevToolsTreeNode_UserTreeNode = UserTreeNode;
+type DevToolsTreeNode_TreeNode = TreeNode;
+declare namespace DevToolsTreeNode {
+  export {
+    DevToolsTreeNode_JsonTreeNode as JsonTreeNode,
+    DevToolsTreeNode_LiveTreeNode as LiveTreeNode,
+    DevToolsTreeNode_LsonTreeNode as LsonTreeNode,
+    DevToolsTreeNode_UserTreeNode as UserTreeNode,
+    DevToolsTreeNode_TreeNode as TreeNode,
+  };
+}
+
 declare type CustomEvent<TRoomEvent extends Json> = {
     connectionId: number;
     event: TRoomEvent;
@@ -863,7 +905,16 @@ declare type Room<TPresence extends JsonObject, TStorage extends LsonObject, TUs
          * @example
          * room.subscribe("storage-status", (status) => {
          *   switch(status) {
-         *      case
+         *      case "not-loaded":
+         *        break;
+         *      case "loading":
+         *        break;
+         *      case "synchronizing":
+         *        break;
+         *      case "synchronized":
+         *        break;
+         *      default:
+         *        break;
          *   }
          * });
          */
@@ -983,6 +1034,11 @@ declare type Room<TPresence extends JsonObject, TStorage extends LsonObject, TUs
     batch<T>(fn: () => T): T;
     /**
      * Get the storage status.
+     *
+     * - `not-loaded`: Initial state when entering the room.
+     * - `loading`: Once the storage has been requested via room.getStorage().
+     * - `synchronizing`: When some local updates have not been acknowledged by Liveblocks servers.
+     * - `synchronized`: Storage is in sync with Liveblocks servers.
      */
     getStorageStatus(): StorageStatus;
     /**
@@ -1392,6 +1448,115 @@ declare enum WebsocketCloseCodes {
     CLOSE_WITHOUT_RETRY = 4999
 }
 
+/**
+ * Definition of all messages the Panel can send to the Client.
+ */
+declare type PanelToClientMessage = 
+/**
+ * Initial message from the panel to the client, used for two purposes.
+ * 1. First, it’s eavesdropped by the background script, which uses this
+ *    message to register a "port", which sets up a channel for two-way
+ *    communication between panel and client for the remainder of the time.
+ * 2. It signifies to the client that the devpanel is listening.
+ */
+{
+    msg: "connect";
+}
+/**
+ * Expresses to the client that the devtool is interested in
+ * receiving the "sync stream" for the room. The sync stream
+ * that follows is an initial "full sync", followed by many
+ * "partial" syncs, happening for every update.
+ */
+ | {
+    msg: "room::subscribe";
+    roomId: string;
+}
+/**
+ * Expresses to the client that the devtool no longer is
+ * interested in the "sync stream" for a room, for example,
+ * because the devtools panel is closed, or if it switched to
+ * a different room.
+ */
+ | {
+    msg: "room::unsubscribe";
+    roomId: string;
+};
+/**
+ * Definition of all messages the Client can send to the Panel.
+ */
+declare type ClientToPanelMessage = 
+/**
+ * Initial message sent by the client to test if a dev panel is listening.
+ * This is necessary in cases where the dev panel is already opened and
+ * listened, before the client is loaded. If the panel receives this message,
+ * it will replay its initial "connect" message, which triggers the loading
+ * of the two-way connection.
+ */
+{
+    msg: "wake-up-devtools";
+}
+/**
+ * Sent when a new room is available for the dev panel to track and watch.
+ * Sent by the client as soon as the room is attempted to be entered. This
+ * happens _before_ the actual connection to the room server is established,
+ * meaning the room is visible to the devtools even while it is connecting.
+ */
+ | {
+    msg: "room::available";
+    roomId: string;
+    clientVersion: string;
+}
+/**
+ * Sent when a room is left and the client loses track of the room instance.
+ */
+ | {
+    msg: "room::unavailable";
+    roomId: string;
+}
+/**
+ * Sent initially, to synchronize the entire current state of the room.
+ */
+ | {
+    msg: "room::sync::full";
+    roomId: string;
+    status: ConnectionState;
+    storage: readonly LsonTreeNode[] | null;
+    me: UserTreeNode | null;
+    others: readonly UserTreeNode[];
+}
+/**
+ * Sent whenever something about the internals of a room changes.
+ */
+ | {
+    msg: "room::sync::partial";
+    roomId: string;
+    status?: ConnectionState;
+    storage?: readonly LsonTreeNode[];
+    me?: UserTreeNode;
+    others?: readonly UserTreeNode[];
+};
+declare type FullPanelToClientMessage = PanelToClientMessage & {
+    source: "liveblocks-devtools-panel";
+    tabId: number;
+};
+declare type FullClientToPanelMessage = ClientToPanelMessage & {
+    source: "liveblocks-devtools-client";
+};
+
+type protocol_PanelToClientMessage = PanelToClientMessage;
+type protocol_ClientToPanelMessage = ClientToPanelMessage;
+type protocol_FullPanelToClientMessage = FullPanelToClientMessage;
+type protocol_FullClientToPanelMessage = FullClientToPanelMessage;
+declare namespace protocol {
+  export {
+    protocol_PanelToClientMessage as PanelToClientMessage,
+    protocol_ClientToPanelMessage as ClientToPanelMessage,
+    protocol_FullPanelToClientMessage as FullPanelToClientMessage,
+    protocol_FullClientToPanelMessage as FullClientToPanelMessage,
+  };
+}
+
 /**
  * PRIVATE / INTERNAL APIS
  * -----------------------
@@ -1417,4 +1582,4 @@ declare type EnsureJson<T> = [
     [K in keyof T]: EnsureJson<T[K]>;
 };
 
-export { AppOnlyAuthToken, AuthToken, BaseUserMeta, BroadcastEventClientMsg, BroadcastOptions, BroadcastedEventServerMsg, Client, ClientMsg, ClientMsgCode, CrdtType, CreateChildOp, CreateListOp, CreateMapOp, CreateObjectOp, CreateOp, CreateRegisterOp, CreateRootObjectOp, DeleteCrdtOp, DeleteObjectKeyOp, EnsureJson, FetchStorageClientMsg, History, IdTuple, Immutable, InitialDocumentStateServerMsg, Json, JsonObject, LiveList, LiveMap, LiveNode, LiveObject, LiveStructure, Lson, LsonObject, NodeMap, Op, OpCode, Others, ParentToChildNodeMap, Resolve, Room, RoomAuthToken, RoomInitializers, RoomStateServerMsg, SerializedChild, SerializedCrdt, SerializedList, SerializedMap, SerializedObject, SerializedRegister, SerializedRootObject, ServerMsg, ServerMsgCode, SetParentKeyOp, StorageUpdate, ToImmutable, ToJson, UpdateObjectOp, UpdatePresenceClientMsg, UpdatePresenceServerMsg, UpdateStorageClientMsg, UpdateStorageServerMsg, User, UserJoinServerMsg, UserLeftServerMsg, WebsocketCloseCodes, asArrayWithLegacyMethods, assertNever, b64decode, comparePosition, createClient, deprecate, deprecateIf, errorIf, freeze, isAppOnlyAuthToken, isAuthToken, isChildCrdt, isJsonArray, isJsonObject, isJsonScalar, isPlainObject, isRoomAuthToken, isRootCrdt, legacy_patchImmutableObject, lsonToJson, makePosition, nn, patchLiveObjectKey, shallow, throwUsageError, tryParseJson };
+export { AppOnlyAuthToken, AuthToken, BaseUserMeta, BroadcastEventClientMsg, BroadcastOptions, BroadcastedEventServerMsg, Client, ClientMsg, ClientMsgCode, ConnectionState, CrdtType, CreateChildOp, CreateListOp, CreateMapOp, CreateObjectOp, CreateOp, CreateRegisterOp, CreateRootObjectOp, DeleteCrdtOp, DeleteObjectKeyOp, DevToolsTreeNode as DevTools, protocol as DevToolsMsg, EnsureJson, FetchStorageClientMsg, History, IdTuple, Immutable, InitialDocumentStateServerMsg, Json, JsonObject, LiveList, LiveMap, LiveNode, LiveObject, LiveStructure, Lson, LsonObject, NodeMap, Op, OpCode, Others, ParentToChildNodeMap, Resolve, Room, RoomAuthToken, RoomInitializers, RoomStateServerMsg, SerializedChild, SerializedCrdt, SerializedList, SerializedMap, SerializedObject, SerializedRegister, SerializedRootObject, ServerMsg, ServerMsgCode, SetParentKeyOp, StorageUpdate, ToImmutable, ToJson, UpdateObjectOp, UpdatePresenceClientMsg, UpdatePresenceServerMsg, UpdateStorageClientMsg, UpdateStorageServerMsg, User, UserJoinServerMsg, UserLeftServerMsg, WebsocketCloseCodes, asArrayWithLegacyMethods, assertNever, b64decode, comparePosition, createClient, deprecate, deprecateIf, errorIf, freeze, isAppOnlyAuthToken, isAuthToken, isChildCrdt, isJsonArray, isJsonObject, isJsonScalar, isPlainObject, isRoomAuthToken, isRootCrdt, legacy_patchImmutableObject, lsonToJson, makePosition, nn, patchLiveObjectKey, shallow, throwUsageError, tryParseJson };

package/dist/index.js

@@ -50,6 +50,213 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 
+// src/lib/EventSource.ts
+function makeEventSource() {
+  const _onetimeObservers = /* @__PURE__ */ new Set();
+  const _observers = /* @__PURE__ */ new Set();
+  function subscribe(callback) {
+    _observers.add(callback);
+    return () => _observers.delete(callback);
+  }
+  function subscribeOnce(callback) {
+    _onetimeObservers.add(callback);
+    return () => _onetimeObservers.delete(callback);
+  }
+  function notify(event) {
+    _onetimeObservers.forEach((callback) => callback(event));
+    _onetimeObservers.clear();
+    _observers.forEach((callback) => callback(event));
+  }
+  function clear() {
+    _onetimeObservers.clear();
+    _observers.clear();
+  }
+  return {
+    notify,
+    subscribe,
+    subscribeOnce,
+    clear,
+    observable: {
+      subscribe,
+      subscribeOnce
+    }
+  };
+}
+
+// src/devtools/bridge.ts
+var _bridgeActive = false;
+function activateBridge(allowed) {
+  _bridgeActive = allowed;
+}
+function sendToPanel(message, options) {
+  if (process.env.NODE_ENV === "production" || typeof window === "undefined") {
+    return;
+  }
+  const fullMsg = __spreadProps(__spreadValues({}, message), {
+    source: "liveblocks-devtools-client"
+  });
+  if (!((options == null ? void 0 : options.force) || _bridgeActive)) {
+    return;
+  }
+  window.postMessage(fullMsg, "*");
+}
+var eventSource = makeEventSource();
+if (process.env.NODE_ENV !== "production" && typeof window !== "undefined") {
+  window.addEventListener("message", (event) => {
+    var _a;
+    if (event.source === window && ((_a = event.data) == null ? void 0 : _a.source) === "liveblocks-devtools-panel") {
+      eventSource.notify(event.data);
+    } else {
+    }
+  });
+}
+var onMessageFromPanel = eventSource.observable;
+
+// src/devtools/index.ts
+var VERSION = true ? "0.19.3" : "dev";
+var _devtoolsSetupHasRun = false;
+function setupDevTools(getAllRooms) {
+  if (process.env.NODE_ENV === "production" || typeof window === "undefined") {
+    return;
+  }
+  if (_devtoolsSetupHasRun) {
+    return;
+  }
+  _devtoolsSetupHasRun = true;
+  onMessageFromPanel.subscribe((msg) => {
+    switch (msg.msg) {
+      case "connect": {
+        activateBridge(true);
+        for (const roomId of getAllRooms()) {
+          sendToPanel({
+            msg: "room::available",
+            roomId,
+            clientVersion: VERSION
+          });
+        }
+        break;
+      }
+    }
+  });
+  sendToPanel({ msg: "wake-up-devtools" }, { force: true });
+}
+var unsubsByRoomId = /* @__PURE__ */ new Map();
+function stopSyncStream(roomId) {
+  var _a;
+  const unsubs = (_a = unsubsByRoomId.get(roomId)) != null ? _a : [];
+  unsubsByRoomId.delete(roomId);
+  for (const unsub of unsubs) {
+    unsub();
+  }
+}
+function startSyncStream(room) {
+  stopSyncStream(room.id);
+  fullSync(room);
+  unsubsByRoomId.set(room.id, [
+    room.events.connection.subscribe(() => partialSyncConnection(room)),
+    room.events.storageDidLoad.subscribeOnce(() => partialSyncStorage(room)),
+    room.events.storage.subscribe(() => partialSyncStorage(room)),
+    room.events.me.subscribe(() => partialSyncMe(room)),
+    room.events.others.subscribe(() => partialSyncOthers(room))
+  ]);
+}
+function partialSyncConnection(room) {
+  sendToPanel({
+    msg: "room::sync::partial",
+    roomId: room.id,
+    status: room.getConnectionState()
+  });
+}
+function partialSyncStorage(room) {
+  const root = room.getStorageSnapshot();
+  if (root) {
+    sendToPanel({
+      msg: "room::sync::partial",
+      roomId: room.id,
+      storage: root.toTreeNode("root").payload
+    });
+  }
+}
+function partialSyncMe(room) {
+  const me = room.getSelf_forDevTools();
+  if (me) {
+    sendToPanel({
+      msg: "room::sync::partial",
+      roomId: room.id,
+      me
+    });
+  }
+}
+function partialSyncOthers(room) {
+  const others = room.getOthers_forDevTools();
+  if (others) {
+    sendToPanel({
+      msg: "room::sync::partial",
+      roomId: room.id,
+      others
+    });
+  }
+}
+function fullSync(room) {
+  var _a;
+  const root = room.getStorageSnapshot();
+  const me = room.getSelf_forDevTools();
+  const others = room.getOthers_forDevTools();
+  sendToPanel({
+    msg: "room::sync::full",
+    roomId: room.id,
+    status: room.getConnectionState(),
+    storage: (_a = root == null ? void 0 : root.toTreeNode("root").payload) != null ? _a : null,
+    me,
+    others
+  });
+}
+var roomChannelListeners = /* @__PURE__ */ new Map();
+function stopRoomChannelListener(roomId) {
+  const listener = roomChannelListeners.get(roomId);
+  roomChannelListeners.delete(roomId);
+  if (listener) {
+    listener();
+  }
+}
+function linkDevTools(roomId, room) {
+  if (process.env.NODE_ENV === "production" || typeof window === "undefined") {
+    return;
+  }
+  sendToPanel({ msg: "room::available", roomId, clientVersion: VERSION });
+  stopRoomChannelListener(roomId);
+  roomChannelListeners.set(
+    roomId,
+    onMessageFromPanel.subscribe((msg) => {
+      switch (msg.msg) {
+        case "room::subscribe": {
+          if (msg.roomId === roomId) {
+            startSyncStream(room);
+          }
+          break;
+        }
+        case "room::unsubscribe": {
+          if (msg.roomId === roomId) {
+            stopSyncStream(roomId);
+          }
+          break;
+        }
+      }
+    })
+  );
+}
+function unlinkDevTools(roomId) {
+  if (process.env.NODE_ENV === "production" || typeof window === "undefined") {
+    return;
+  }
+  stopSyncStream(roomId);
+  stopRoomChannelListener(roomId);
+  sendToPanel({
+    msg: "room::unavailable",
+    roomId
+  });
+}
+
 // src/lib/fancy-console.ts
 var badge = "background:radial-gradient(106.94% 108.33% at -10% -5%,#ff1aa3 0,#ff881a 100%);border-radius:3px;color:#fff;padding:2px 5px;font-family:sans-serif;font-weight:600";
 var bold = "font-weight:600";
@@ -257,13 +464,21 @@ var AbstractCrdt = class {
     this.__pool = void 0;
   }
   invalidate() {
-    if (this._cachedImmutable !== void 0) {
+    if (this._cachedImmutable !== void 0 || this._cachedTreeNode !== void 0) {
       this._cachedImmutable = void 0;
+      this._cachedTreeNode = void 0;
       if (this.parent.type === "HasParent") {
         this.parent.node.invalidate();
       }
     }
   }
+  toTreeNode(key) {
+    if (this._cachedTreeNode === void 0 || this._cachedTreeNodeKey !== key) {
+      this._cachedTreeNodeKey = key;
+      this._cachedTreeNode = this._toTreeNode(key);
+    }
+    return this._cachedTreeNode;
+  }
   toImmutable() {
     if (this._cachedImmutable === void 0) {
       this._cachedImmutable = this._toImmutable();
@@ -337,6 +552,16 @@ function isChildCrdt(crdt) {
   return crdt.parentId !== void 0 && crdt.parentKey !== void 0;
 }
 
+// src/lib/nanoid.ts
+function nanoid(length = 7) {
+  const alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789,./;[]~!@#$%&*()_+=-";
+  const len = alphabet.length;
+  return Array.from(
+    { length },
+    () => alphabet.charAt(Math.floor(Math.random() * len))
+  ).join("");
+}
+
 // src/lib/position.ts
 var min = 32;
 var max = 126;
@@ -492,6 +717,15 @@ var LiveRegister = class extends AbstractCrdt {
   _apply(op, isLocal) {
     return super._apply(op, isLocal);
   }
+  _toTreeNode(key) {
+    var _a;
+    return {
+      type: "Json",
+      id: (_a = this._id) != null ? _a : nanoid(),
+      key,
+      payload: this._data
+    };
+  }
   _toImmutable() {
     return this._data;
   }
@@ -1315,6 +1549,17 @@ var LiveList = class extends AbstractCrdt {
     );
     this._items[index]._setParentLink(this, shiftedPosition);
   }
+  _toTreeNode(key) {
+    var _a;
+    return {
+      type: "LiveList",
+      id: (_a = this._id) != null ? _a : nanoid(),
+      key,
+      payload: this._items.map(
+        (item, index) => item.toTreeNode(index.toString())
+      )
+    };
+  }
   toImmutable() {
     return super.toImmutable();
   }
@@ -1656,6 +1901,17 @@ var LiveMap = class extends AbstractCrdt {
       callback(entry[1], entry[0], this);
     }
   }
+  _toTreeNode(key) {
+    var _a;
+    return {
+      type: "LiveMap",
+      id: (_a = this._id) != null ? _a : nanoid(),
+      key,
+      payload: Array.from(this._map.entries()).map(
+        ([key2, val]) => val.toTreeNode(key2)
+      )
+    };
+  }
   toImmutable() {
     return super.toImmutable();
   }
@@ -2087,6 +2343,21 @@ var LiveObject = class extends AbstractCrdt {
   toImmutable() {
     return super.toImmutable();
   }
+  toTreeNode(key) {
+    return super.toTreeNode(key);
+  }
+  _toTreeNode(key) {
+    var _a;
+    const nodeId = (_a = this._id) != null ? _a : nanoid();
+    return {
+      type: "LiveObject",
+      id: nodeId,
+      key,
+      payload: Array.from(this._map.entries()).map(
+        ([key2, value]) => isLiveNode(value) ? value.toTreeNode(key2) : { type: "Json", id: `${nodeId}:${key2}`, key: key2, payload: value }
+      )
+    };
+  }
   _toImmutable() {
     const result = {};
     for (const [key, val] of this._map) {
@@ -2340,39 +2611,6 @@ function findNonSerializableValue(value, path = "") {
   return false;
 }
 
-// src/lib/EventSource.ts
-function makeEventSource() {
-  const _onetimeObservers = /* @__PURE__ */ new Set();
-  const _observers = /* @__PURE__ */ new Set();
-  function subscribe(callback) {
-    _observers.add(callback);
-    return () => _observers.delete(callback);
-  }
-  function subscribeOnce(callback) {
-    _onetimeObservers.add(callback);
-    return () => _onetimeObservers.delete(callback);
-  }
-  function notify(event) {
-    _onetimeObservers.forEach((callback) => callback(event));
-    _onetimeObservers.clear();
-    _observers.forEach((callback) => callback(event));
-  }
-  function clear() {
-    _onetimeObservers.clear();
-    _observers.clear();
-  }
-  return {
-    notify,
-    subscribe,
-    subscribeOnce,
-    clear,
-    observable: {
-      subscribe,
-      subscribeOnce
-    }
-  };
-}
-
 // src/lib/Json.ts
 function isJsonScalar(data) {
   return data === null || typeof data === "string" || typeof data === "number" || typeof data === "boolean";
@@ -2659,7 +2897,7 @@ var WebsocketCloseCodes = /* @__PURE__ */ ((WebsocketCloseCodes2) => {
 
 // src/room.ts
 function isRoomEventName(value) {
-  return value === "my-presence" || value === "others" || value === "event" || value === "error" || value === "connection" || value === "history" || value === "pending-storage-modifications";
+  return value === "my-presence" || value === "others" || value === "event" || value === "error" || value === "connection" || value === "history" || value === "storage-status";
 }
 var BACKOFF_RETRY_DELAYS = [250, 500, 1e3, 2e3, 4e3, 8e3, 1e4];
 var BACKOFF_RETRY_DELAYS_SLOW = [2e3, 3e4, 6e4, 3e5];
@@ -2675,6 +2913,14 @@ function log(..._params) {
 function isConnectionSelfAware(connection) {
   return connection.state === "open" || connection.state === "connecting";
 }
+function userToTreeNode(key, user) {
+  return {
+    type: "User",
+    id: `${user.connectionId}`,
+    key,
+    payload: user
+  };
+}
 function makeStateMachine(state, config, mockedEffects) {
   var _a;
   const doNotBatchUpdates = (cb) => cb();
@@ -2782,6 +3028,10 @@ function makeStateMachine(state, config, mockedEffects) {
       isReadOnly: conn.isReadOnly
     } : null
   );
+  const selfAsTreeNode = new DerivedRef(
+    self,
+    (me) => me !== null ? userToTreeNode("Me", me) : null
+  );
   function createOrUpdateRootFromMessage(message, batchedUpdatesWrapper) {
     if (message.items.length === 0) {
       throw new Error("Internal error: cannot load storage without items");
@@ -2918,7 +3168,7 @@ function makeStateMachine(state, config, mockedEffects) {
         if (isLocal) {
           source = 0 /* UNDOREDO_RECONNECT */;
         } else {
-          const deleted = state.offlineOperations.delete(nn(op.opId));
+          const deleted = state.unacknowledgedOps.delete(nn(op.opId));
           source = deleted ? 2 /* ACK */ : 1 /* REMOTE */;
         }
         const applyOpResult = applyOp(op, source);
@@ -3297,9 +3547,9 @@ function makeStateMachine(state, config, mockedEffects) {
             break;
           }
           case 200 /* INITIAL_STORAGE_STATE */: {
-            const offlineOps = new Map(state.offlineOperations);
+            const unacknowledgedOps = new Map(state.unacknowledgedOps);
             createOrUpdateRootFromMessage(message, doNotBatchUpdates);
-            applyAndSendOfflineOps(offlineOps, doNotBatchUpdates);
+            applyAndSendOps(unacknowledgedOps, doNotBatchUpdates);
             if (_getInitialStateResolver !== null) {
               _getInitialStateResolver();
             }
@@ -3434,7 +3684,7 @@ function makeStateMachine(state, config, mockedEffects) {
     clearInterval(state.intervalHandles.heartbeat);
     connect();
   }
-  function applyAndSendOfflineOps(offlineOps, batchedUpdatesWrapper) {
+  function applyAndSendOps(offlineOps, batchedUpdatesWrapper) {
     if (offlineOps.size === 0) {
       return;
     }
@@ -3452,7 +3702,7 @@ function makeStateMachine(state, config, mockedEffects) {
     const storageOps = state.buffer.storageOperations;
     if (storageOps.length > 0) {
       storageOps.forEach((op) => {
-        state.offlineOperations.set(nn(op.opId), op);
+        state.unacknowledgedOps.set(nn(op.opId), op);
       });
       notifyStorageStatus();
     }
@@ -3527,7 +3777,7 @@ function makeStateMachine(state, config, mockedEffects) {
       clearInterval(state.intervalHandles.heartbeat);
       state.others.clearOthers();
       notify({ others: [{ type: "reset" }] }, doNotBatchUpdates);
-      Object.values(eventHub).forEach((eventSource) => eventSource.clear());
+      Object.values(eventHub).forEach((eventSource2) => eventSource2.clear());
     });
   }
   function getPresence() {
@@ -3691,13 +3941,13 @@ function makeStateMachine(state, config, mockedEffects) {
     onClose(event);
   }
   function getStorageStatus() {
-    if (state.root !== void 0) {
-      return state.offlineOperations.size === 0 ? "synchronized" : "synchronizing";
+    if (_getInitialStatePromise === null) {
+      return "not-loaded";
     }
-    if (_getInitialStatePromise !== null) {
+    if (state.root === void 0) {
       return "loading";
     }
-    return "not-loaded";
+    return state.unacknowledgedOps.size === 0 ? "synchronized" : "synchronizing";
   }
   let _lastStorageStatus = getStorageStatus();
   function notifyStorageStatus() {
@@ -3749,11 +3999,17 @@ function makeStateMachine(state, config, mockedEffects) {
     isSelfAware: () => isConnectionSelfAware(state.connection.current),
     getSelf: () => self.current,
     getPresence,
-    getOthers
+    getOthers,
+    getSelf_forDevTools: () => selfAsTreeNode.current,
+    getOthers_forDevTools: () => state.others_forDevTools.current
   };
 }
 function defaultState(initialPresence, initialStorage) {
   const others = new OthersRef();
+  const others_forDevTools = new DerivedRef(
+    others,
+    (others2) => others2.map((other, index) => userToTreeNode(`Other ${index}`, other))
+  );
   const connection = new ValueRef({ state: "closed" });
   return {
     token: null,
@@ -3780,6 +4036,7 @@ function defaultState(initialPresence, initialStorage) {
     connection,
     me: new MeRef(initialPresence),
     others,
+    others_forDevTools,
     initialStorage,
     idFactory: null,
     clock: 0,
@@ -3790,7 +4047,7 @@ function defaultState(initialPresence, initialStorage) {
     redoStack: [],
     pausedHistory: null,
     activeBatch: null,
-    offlineOperations: /* @__PURE__ */ new Map()
+    unacknowledgedOps: /* @__PURE__ */ new Map()
   };
 }
 function createRoom(options, config) {
@@ -3830,7 +4087,9 @@ function createRoom(options, config) {
     __INTERNAL_DO_NOT_USE: {
       simulateCloseWebsocket: machine.simulateSocketClose,
       simulateSendCloseEvent: machine.simulateSendCloseEvent
-    }
+    },
+    getSelf_forDevTools: machine.getSelf_forDevTools,
+    getOthers_forDevTools: machine.getOthers_forDevTools
   };
   return {
     connect: machine.connect,
@@ -3855,7 +4114,7 @@ function prepareCreateWebSocket(liveblocksServer, WebSocketPolyfill) {
   const ws = WebSocketPolyfill || WebSocket;
   return (token) => {
     return new ws(
-      `${liveblocksServer}/?token=${token}&version=${true ? "0.19.3-beta4" : "dev"}`
+      `${liveblocksServer}/?token=${token}&version=${true ? "0.19.3" : "dev"}`
     );
   };
 }
@@ -3978,6 +4237,8 @@ function createClient(options) {
       roomId,
       internalRoom
     );
+    setupDevTools(() => Array.from(rooms.keys()));
+    linkDevTools(roomId, internalRoom.room);
     if (shouldConnect) {
       if (typeof atob === "undefined") {
         if (((_b = clientOptions.polyfills) == null ? void 0 : _b.atob) === void 0) {
@@ -3992,6 +4253,7 @@ function createClient(options) {
     return internalRoom.room;
   }
   function leave(roomId) {
+    unlinkDevTools(roomId);
     const room = rooms.get(roomId);
     if (room) {
       room.disconnect();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liveblocks/core",
-  "version": "0.19.3-beta4",
+  "version": "0.19.3",
   "description": "Shared code and foundational internals for Liveblocks",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",