@liveblocks/core 1.4.8-test1 → 1.5.0-test2

package/dist/index.mjs

@@ -6,7 +6,7 @@ var __export = (target, all) => {
 
 // src/version.ts
 var PKG_NAME = "@liveblocks/core";
-var PKG_VERSION = "1.4.8-test1";
+var PKG_VERSION = "1.5.0-test2";
 var PKG_FORMAT = "esm";
 
 // src/dupe-detection.ts
@@ -585,8 +585,8 @@ function tryParseJson(rawMessage) {
     return void 0;
   }
 }
-function deepClone(items) {
-  return JSON.parse(JSON.stringify(items));
+function deepClone(value) {
+  return JSON.parse(JSON.stringify(value));
 }
 function b64decode(b64value) {
   try {
@@ -673,6 +673,9 @@ function shouldRetryWithoutReauth(code) {
 }
 
 // src/connection.ts
+function isIdle(status) {
+  return status === "initial" || status === "disconnected";
+}
 function newToLegacyStatus(status) {
   switch (status) {
     case "connecting":
@@ -701,6 +704,7 @@ function toNewConnectionStatus(machine) {
     case "@auth.backoff":
     case "@connecting.busy":
     case "@connecting.backoff":
+    case "@idle.zombie":
       return machine.context.successCount > 0 ? "reconnecting" : "connecting";
     case "@idle.failed":
       return "disconnected";
@@ -842,7 +846,7 @@ function createConnectionStateMachine(delegates, options) {
     socket: null,
     backoffDelay: RESET_DELAY
   };
-  const machine = new FSM(initialContext).addState("@idle.initial").addState("@idle.failed").addState("@auth.busy").addState("@auth.backoff").addState("@connecting.busy").addState("@connecting.backoff").addState("@ok.connected").addState("@ok.awaiting-pong");
+  const machine = new FSM(initialContext).addState("@idle.initial").addState("@idle.failed").addState("@idle.zombie").addState("@auth.busy").addState("@auth.backoff").addState("@connecting.busy").addState("@connecting.backoff").addState("@ok.connected").addState("@ok.awaiting-pong");
   machine.addTransitions("*", {
     RECONNECT: {
       target: "@auth.backoff",
@@ -1052,11 +1056,20 @@ function createConnectionStateMachine(delegates, options) {
       ctx.socket?.send("ping");
     }
   };
-  machine.addTimedTransition("@ok.connected", HEARTBEAT_INTERVAL, sendHeartbeat).addTransitions("@ok.connected", {
-    NAVIGATOR_OFFLINE: sendHeartbeat,
+  const maybeHeartbeat = () => {
+    const doc = typeof document !== "undefined" ? document : void 0;
+    const canZombie = doc?.visibilityState === "hidden" && delegates.canZombie();
+    return canZombie ? "@idle.zombie" : sendHeartbeat;
+  };
+  machine.addTimedTransition("@ok.connected", HEARTBEAT_INTERVAL, maybeHeartbeat).addTransitions("@ok.connected", {
+    NAVIGATOR_OFFLINE: maybeHeartbeat,
     // Don't take the browser's word for it when it says it's offline. Do a ping/pong to make sure.
     WINDOW_GOT_FOCUS: sendHeartbeat
   });
+  machine.addTransitions("@idle.zombie", {
+    WINDOW_GOT_FOCUS: "@connecting.backoff"
+    // When in zombie state, the client will try to wake up automatically when the window regains focus
+  });
   machine.onEnter("@ok.*", (ctx) => {
     ctx.patch({ successCount: ctx.successCount + 1 });
     const timerID = setTimeout(
@@ -1287,6 +1300,12 @@ function createAuthManager(authOptions) {
   const tokens = [];
   const expiryTimes = [];
   const requestPromises = /* @__PURE__ */ new Map();
+  function reset() {
+    seenTokens.clear();
+    tokens.length = 0;
+    expiryTimes.length = 0;
+    requestPromises.clear();
+  }
   function hasCorrespondingScopes(requestedScope, scopes) {
     if (requestedScope === "comments:read") {
       return scopes.includes("comments:read" /* CommentsRead */) || scopes.includes("comments:write" /* CommentsWrite */) || scopes.includes("room:read" /* Read */) || scopes.includes("room:write" /* Write */);
@@ -1322,7 +1341,7 @@ function createAuthManager(authOptions) {
     if (authentication.type === "private") {
       if (fetcher === void 0) {
         throw new StopRetrying(
-          "To use Liveblocks client in a non-dom environment with a url as auth endpoint, you need to provide a fetch polyfill."
+          "To use Liveblocks client in a non-DOM environment with a url as auth endpoint, you need to provide a fetch polyfill."
         );
       }
       const response = await fetchAuthEndpoint(fetcher, authentication.url, {
@@ -1386,6 +1405,7 @@ function createAuthManager(authOptions) {
     }
   }
   return {
+    reset,
     getAuthValue
   };
 }
@@ -1467,6 +1487,9 @@ async function fetchAuthEndpoint(fetch2, endpoint, body) {
   return { token };
 }
 
+// src/constants.ts
+var DEFAULT_BASE_URL = "https://api.liveblocks.io";
+
 // src/devtools/bridge.ts
 var _bridgeActive = false;
 function activateBridge(allowed) {
@@ -1718,7 +1741,7 @@ function getAuthBearerHeaderFromAuthValue(authValue) {
     return authValue.token.raw;
   }
 }
-function createCommentsApi(roomId, getAuthValue, { serverEndpoint }) {
+function createCommentsApi(roomId, getAuthValue, config) {
   async function fetchJson(endpoint, options) {
     const response = await fetchApi(roomId, endpoint, options);
     if (!response.ok) {
@@ -1745,9 +1768,10 @@ function createCommentsApi(roomId, getAuthValue, { serverEndpoint }) {
   }
   async function fetchApi(roomId2, endpoint, options) {
     const authValue = await getAuthValue();
-    const url = `${serverEndpoint}/c/rooms/${encodeURIComponent(
-      roomId2
-    )}${endpoint}`;
+    const url = new URL(
+      `/v2/c/rooms/${encodeURIComponent(roomId2)}${endpoint}`,
+      config.baseUrl
+    ).toString();
     return await fetch(url, {
       ...options,
       headers: {
@@ -2309,6 +2333,9 @@ var LiveRegister = class _LiveRegister extends AbstractCrdt {
   _toImmutable() {
     return this._data;
   }
+  clone() {
+    return deepClone(this.data);
+  }
 };
 
 // src/crdts/LiveList.ts
@@ -3252,6 +3279,9 @@ var LiveList = class _LiveList extends AbstractCrdt {
     const result = this._items.map((node) => node.toImmutable());
     return process.env.NODE_ENV === "production" ? result : Object.freeze(result);
   }
+  clone() {
+    return new _LiveList(this._items.map((item) => item.clone()));
+  }
 };
 var LiveListIterator = class {
   constructor(items) {
@@ -3335,10 +3365,10 @@ var LiveMap = class _LiveMap extends AbstractCrdt {
     this.unacknowledgedSet = /* @__PURE__ */ new Map();
     if (entries2) {
       const mappedEntries = [];
-      for (const entry of entries2) {
-        const value = lsonToLiveNode(entry[1]);
-        value._setParentLink(this, entry[0]);
-        mappedEntries.push([entry[0], value]);
+      for (const [key, value] of entries2) {
+        const node = lsonToLiveNode(value);
+        node._setParentLink(this, key);
+        mappedEntries.push([key, node]);
       }
       this._map = new Map(mappedEntries);
     } else {
@@ -3669,6 +3699,11 @@ var LiveMap = class _LiveMap extends AbstractCrdt {
     }
     return freeze(result);
   }
+  clone() {
+    return new _LiveMap(
+      Array.from(this._map).map(([key, node]) => [key, node.clone()])
+    );
+  }
 };
 
 // src/crdts/LiveObject.ts
@@ -4179,6 +4214,16 @@ var LiveObject = class _LiveObject extends AbstractCrdt {
     }
     return process.env.NODE_ENV === "production" ? result : Object.freeze(result);
   }
+  clone() {
+    return new _LiveObject(
+      Object.fromEntries(
+        Array.from(this._map).map(([key, value]) => [
+          key,
+          isLiveStructure(value) ? value.clone() : deepClone(value)
+        ])
+      )
+    );
+  }
 };
 
 // src/crdts/liveblocks-helpers.ts
@@ -4264,6 +4309,9 @@ function isLiveObject(value) {
 function isLiveRegister(value) {
   return value instanceof LiveRegister;
 }
+function cloneLson(value) {
+  return value === void 0 ? void 0 : isLiveStructure(value) ? value.clone() : deepClone(value);
+}
 function liveNodeToLson(obj) {
   if (obj instanceof LiveRegister) {
     return obj.data;
@@ -4698,10 +4746,40 @@ function userToTreeNode(key, user) {
     payload: user
   };
 }
+function installBackgroundTabSpy() {
+  const doc = typeof document !== "undefined" ? document : void 0;
+  const inBackgroundSince = { current: null };
+  function onVisibilityChange() {
+    if (doc?.visibilityState === "hidden") {
+      inBackgroundSince.current = inBackgroundSince.current ?? Date.now();
+    } else {
+      inBackgroundSince.current = null;
+    }
+  }
+  doc?.addEventListener("visibilitychange", onVisibilityChange);
+  const unsub = () => {
+    doc?.removeEventListener("visibilitychange", onVisibilityChange);
+  };
+  return [inBackgroundSince, unsub];
+}
 function createRoom(options, config) {
   const initialPresence = typeof options.initialPresence === "function" ? options.initialPresence(config.roomId) : options.initialPresence;
   const initialStorage = typeof options.initialStorage === "function" ? options.initialStorage(config.roomId) : options.initialStorage;
-  const delegates = config.delegates;
+  const [inBackgroundSince, uninstallBgTabSpy] = installBackgroundTabSpy();
+  const delegates = {
+    ...config.delegates,
+    // A connection is allowed to go into "zombie state" only if all of the
+    // following conditions apply:
+    //
+    // - The `backgroundKeepAliveTimeout` client option is configured
+    // - The browser window has been in the background for at least
+    //   `backgroundKeepAliveTimeout` milliseconds
+    // - There are no pending changes
+    //
+    canZombie() {
+      return config.backgroundKeepAliveTimeout !== void 0 && inBackgroundSince.current !== null && Date.now() > inBackgroundSince.current + config.backgroundKeepAliveTimeout && getStorageStatus() !== "synchronizing";
+    }
+  };
   const managedSocket = new ManagedSocket(
     delegates,
     config.enableDebugLogging
@@ -4901,15 +4979,13 @@ function createRoom(options, config) {
     comments: makeEventSource()
   };
   async function httpSend(authTokenOrPublicApiKey, roomId, nonce, messages) {
-    const baseUrl = new URL(config.liveblocksServer);
-    baseUrl.protocol = "https";
     const url = new URL(
       `/v2/c/rooms/${encodeURIComponent(roomId)}/send-message`,
-      baseUrl
-    );
+      config.baseUrl
+    ).toString();
     const fetcher = config.polyfills?.fetch || /* istanbul ignore next */
     fetch;
-    return fetcher(url.toString(), {
+    return fetcher(url, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
@@ -4990,7 +5066,7 @@ function createRoom(options, config) {
     const stackSizeBefore = context.undoStack.length;
     for (const key in context.initialStorage) {
       if (context.root.get(key) === void 0) {
-        context.root.set(key, context.initialStorage[key]);
+        context.root.set(key, cloneLson(context.initialStorage[key]));
       }
     }
     context.undoStack.length = stackSizeBefore;
@@ -5021,25 +5097,23 @@ function createRoom(options, config) {
       _addToRealUndoStack(historyOps, batchedUpdatesWrapper);
     }
   }
-  function notify({
-    storageUpdates = /* @__PURE__ */ new Map(),
-    presence = false,
-    others: otherEvents = []
-  }, batchedUpdatesWrapper) {
+  function notify(updates, batchedUpdatesWrapper) {
+    const storageUpdates = updates.storageUpdates;
+    const othersUpdates = updates.others;
     batchedUpdatesWrapper(() => {
-      if (otherEvents.length > 0) {
+      if (othersUpdates !== void 0 && othersUpdates.length > 0) {
         const others = context.others.current;
-        for (const event of otherEvents) {
-          eventHub.others.notify({ others, event });
+        for (const event of othersUpdates) {
+          eventHub.others.notify({ ...event, others });
         }
       }
-      if (presence) {
+      if (updates.presence ?? false) {
         notifySelfChanged(doNotBatchUpdates);
         eventHub.myPresence.notify(context.myPresence.current);
       }
-      if (storageUpdates.size > 0) {
-        const updates = Array.from(storageUpdates.values());
-        eventHub.storage.notify(updates);
+      if (storageUpdates !== void 0 && storageUpdates.size > 0) {
+        const updates2 = Array.from(storageUpdates.values());
+        eventHub.storage.notify(updates2);
       }
       notifyStorageStatus();
     });
@@ -5705,7 +5779,7 @@ ${Array.from(traces).join("\n\n")}`
     comments: eventHub.comments.observable
   };
   const commentsApi = createCommentsApi(config.roomId, delegates.authenticate, {
-    serverEndpoint: "https://api.liveblocks.io/v2"
+    baseUrl: config.baseUrl
   });
   return Object.defineProperty(
     {
@@ -5738,7 +5812,10 @@ ${Array.from(traces).join("\n\n")}`
       connect: () => managedSocket.connect(),
       reconnect: () => managedSocket.reconnect(),
       disconnect: () => managedSocket.disconnect(),
-      destroy: () => managedSocket.destroy(),
+      destroy: () => {
+        uninstallBgTabSpy();
+        managedSocket.destroy();
+      },
       // Presence
       updatePresence,
       updateYDoc,
@@ -5809,9 +5886,10 @@ function makeClassicSubscribeFn(events) {
           return events.myPresence.subscribe(callback);
         case "others": {
           const cb = callback;
-          return events.others.subscribe(
-            ({ others, event }) => cb(others, event)
-          );
+          return events.others.subscribe((event) => {
+            const { others, ...internalEvent } = event;
+            return cb(others, internalEvent);
+          });
         }
         case "error":
           return events.error.subscribe(callback);
@@ -5870,15 +5948,17 @@ function makeAuthDelegateForRoom(roomId, authManager) {
     return authManager.getAuthValue("room:read", roomId);
   };
 }
-function makeCreateSocketDelegateForRoom(roomId, liveblocksServer, WebSocketPolyfill) {
+function makeCreateSocketDelegateForRoom(roomId, baseUrl, WebSocketPolyfill) {
   return (authValue) => {
     const ws = WebSocketPolyfill ?? (typeof WebSocket === "undefined" ? void 0 : WebSocket);
     if (ws === void 0) {
       throw new StopRetrying(
-        "To use Liveblocks client in a non-dom environment, you need to provide a WebSocket polyfill."
+        "To use Liveblocks client in a non-DOM environment, you need to provide a WebSocket polyfill."
       );
     }
-    const url = new URL(liveblocksServer);
+    const url = new URL(baseUrl);
+    url.protocol = url.protocol === "http:" ? "ws" : "wss";
+    url.pathname = "/v7";
     url.searchParams.set("roomId", roomId);
     if (authValue.type === "secret") {
       url.searchParams.set("tok", authValue.token.raw);
@@ -5896,13 +5976,20 @@ function makeCreateSocketDelegateForRoom(roomId, liveblocksServer, WebSocketPoly
 var MIN_THROTTLE = 16;
 var MAX_THROTTLE = 1e3;
 var DEFAULT_THROTTLE = 100;
+var MIN_BACKGROUND_KEEP_ALIVE_TIMEOUT = 6e4;
 var MIN_LOST_CONNECTION_TIMEOUT = 200;
 var RECOMMENDED_MIN_LOST_CONNECTION_TIMEOUT = 1e3;
 var MAX_LOST_CONNECTION_TIMEOUT = 3e4;
 var DEFAULT_LOST_CONNECTION_TIMEOUT = 5e3;
-function getServerFromClientOptions(clientOptions) {
-  const rawOptions = clientOptions;
-  return typeof rawOptions.liveblocksServer === "string" ? rawOptions.liveblocksServer : "wss://api.liveblocks.io/v7";
+function getBaseUrlFromClientOptions(clientOptions) {
+  if ("liveblocksServer" in clientOptions) {
+    throw new Error("Client option no longer supported");
+  }
+  if (typeof clientOptions.baseUrl === "string" && clientOptions.baseUrl.startsWith("http")) {
+    return clientOptions.baseUrl;
+  } else {
+    return DEFAULT_BASE_URL;
+  }
 }
 function createClient(options) {
   const clientOptions = options;
@@ -5910,21 +5997,45 @@ function createClient(options) {
   const lostConnectionTimeout = getLostConnectionTimeout(
     clientOptions.lostConnectionTimeout ?? DEFAULT_LOST_CONNECTION_TIMEOUT
   );
+  const backgroundKeepAliveTimeout = getBackgroundKeepAliveTimeout(
+    clientOptions.backgroundKeepAliveTimeout
+  );
   const authManager = createAuthManager(options);
-  const rooms = /* @__PURE__ */ new Map();
-  function getRoom(roomId) {
-    const room = rooms.get(roomId);
-    return room ? room : null;
+  const roomsById = /* @__PURE__ */ new Map();
+  function teardownRoom(room) {
+    unlinkDevTools(room.id);
+    roomsById.delete(room.id);
+    room.destroy();
+  }
+  function leaseRoom(info) {
+    const leave = () => {
+      const self = leave;
+      if (!info.unsubs.delete(self)) {
+        warn(
+          "This leave function was already called. Calling it more than once has no effect."
+        );
+      } else {
+        if (info.unsubs.size === 0) {
+          teardownRoom(info.room);
+        }
+      }
+    };
+    info.unsubs.add(leave);
+    return {
+      room: info.room,
+      leave
+    };
   }
-  function enter(roomId, options2) {
-    const existingRoom = rooms.get(roomId);
-    if (existingRoom !== void 0) {
-      return existingRoom;
+  function enterRoom(roomId, options2) {
+    const existing = roomsById.get(roomId);
+    if (existing !== void 0) {
+      return leaseRoom(existing);
     }
     deprecateIf(
       options2.initialPresence === null || options2.initialPresence === void 0,
       "Please provide an initial presence value for the current user when entering the room."
     );
+    const baseUrl = getBaseUrlFromClientOptions(clientOptions);
     const newRoom = createRoom(
       {
         initialPresence: options2.initialPresence ?? {},
@@ -5934,25 +6045,30 @@ function createClient(options) {
         roomId,
         throttleDelay,
         lostConnectionTimeout,
+        backgroundKeepAliveTimeout,
         polyfills: clientOptions.polyfills,
         delegates: clientOptions.mockedDelegates ?? {
           createSocket: makeCreateSocketDelegateForRoom(
             roomId,
-            getServerFromClientOptions(clientOptions),
+            baseUrl,
             clientOptions.polyfills?.WebSocket
           ),
           authenticate: makeAuthDelegateForRoom(roomId, authManager)
         },
         enableDebugLogging: clientOptions.enableDebugLogging,
         unstable_batchedUpdates: options2?.unstable_batchedUpdates,
-        liveblocksServer: getServerFromClientOptions(clientOptions),
+        baseUrl,
         unstable_fallbackToHTTP: !!clientOptions.unstable_fallbackToHTTP
       }
     );
-    rooms.set(roomId, newRoom);
-    setupDevTools(() => Array.from(rooms.keys()));
+    const newRoomInfo = {
+      room: newRoom,
+      unsubs: /* @__PURE__ */ new Set()
+    };
+    roomsById.set(roomId, newRoomInfo);
+    setupDevTools(() => Array.from(roomsById.keys()));
     linkDevTools(roomId, newRoom);
-    const shouldConnect = options2.shouldInitiallyConnect ?? true;
+    const shouldConnect = options2.autoConnect ?? options2.shouldInitiallyConnect ?? true;
     if (shouldConnect) {
       if (typeof atob === "undefined") {
         if (clientOptions.polyfills?.atob === void 0) {
@@ -5964,30 +6080,63 @@ function createClient(options) {
       }
       newRoom.connect();
     }
-    return newRoom;
+    return leaseRoom(newRoomInfo);
+  }
+  function enter(roomId, options2) {
+    const { room, leave: _ } = enterRoom(roomId, options2);
+    return room;
+  }
+  function getRoom(roomId) {
+    const room = roomsById.get(roomId)?.room;
+    return room ? room : null;
   }
-  function leave(roomId) {
-    unlinkDevTools(roomId);
-    const room = rooms.get(roomId);
-    if (room !== void 0) {
-      room.destroy();
-      rooms.delete(roomId);
+  function forceLeave(roomId) {
+    const unsubs = roomsById.get(roomId)?.unsubs ?? /* @__PURE__ */ new Set();
+    for (const unsub of unsubs) {
+      unsub();
+    }
+  }
+  function logout() {
+    authManager.reset();
+    for (const { room } of roomsById.values()) {
+      if (!isIdle(room.getStatus())) {
+        room.reconnect();
+      }
     }
   }
   return {
-    getRoom,
+    logout,
+    // Old, deprecated APIs
     enter,
-    leave
+    getRoom,
+    leave: forceLeave,
+    // New, preferred API
+    enterRoom
   };
 }
 function checkBounds(option, value, min, max, recommendedMin) {
-  if (typeof value !== "number" || value < min || value > max) {
+  if (typeof value !== "number" || value < min || max === void 0 || value > max) {
     throw new Error(
-      `${option} should be a number between ${recommendedMin ?? min} and ${max}.`
+      max !== void 0 ? `${option} should be between ${recommendedMin ?? min} and ${max}.` : `${option} should be at least ${recommendedMin ?? min}.`
     );
   }
   return value;
 }
+function getBackgroundKeepAliveTimeout(value) {
+  if (value === void 0)
+    return void 0;
+  if (typeof document === "undefined") {
+    warn(
+      "Setting backgroundKeepAliveTimeout won't have an effect in a non-DOM environment."
+    );
+    return void 0;
+  }
+  return checkBounds(
+    "backgroundKeepAliveTimeout",
+    value,
+    MIN_BACKGROUND_KEEP_ALIVE_TIMEOUT
+  );
+}
 function getThrottle(value) {
   return checkBounds("throttle", value, MIN_THROTTLE, MAX_THROTTLE);
 }
@@ -6607,6 +6756,7 @@ export {
   assert,
   assertNever,
   b64decode,
+  cloneLson,
   fancy_console_exports as console,
   createAsyncCache,
   createClient,