@liveblocks/client 0.16.0 → 0.16.3

package/{lib/esm → esm}/index.js

@@ -915,6 +915,20 @@ class LiveMap extends AbstractCrdt {
   }
 }
 
+function parseJson(rawMessage) {
+  try {
+    return JSON.parse(rawMessage);
+  } catch (e) {
+    return void 0;
+  }
+}
+function isJsonArray(data) {
+  return Array.isArray(data);
+}
+function isJsonObject(data) {
+  return data !== null && typeof data === "object" && !isJsonArray(data);
+}
+
 var __defProp$2 = Object.defineProperty;
 var __defProps$2 = Object.defineProperties;
 var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
@@ -942,6 +956,9 @@ function remove(array, item) {
     }
   }
 }
+function compact(items) {
+  return items.filter((item) => item != null);
+}
 function creationOpToLiveStructure(op) {
   switch (op.type) {
     case OpType.CreateRegister:
@@ -1151,15 +1168,12 @@ function findNonSerializableValue(value, path = "") {
   return false;
 }
 function isTokenValid(token) {
-  if (token === null) {
-    return false;
-  }
   const tokenParts = token.split(".");
   if (tokenParts.length !== 3) {
     return false;
   }
-  const data = JSON.parse(atob(tokenParts[1]));
-  if (typeof data.exp !== "number") {
+  const data = parseJson(atob(tokenParts[1]));
+  if (data === void 0 || !isJsonObject(data) || typeof data.exp !== "number") {
     return false;
   }
   const now = Date.now();
@@ -1621,19 +1635,20 @@ function makeOthers(userMap) {
 function makeStateMachine(state, context, mockedEffects) {
   const effects = mockedEffects || {
     authenticate(auth, createWebSocket) {
-      if (isTokenValid(state.token)) {
-        const parsedToken = parseToken(state.token);
-        const socket = createWebSocket(state.token);
+      const token = state.token;
+      if (token && isTokenValid(token)) {
+        const parsedToken = parseToken(token);
+        const socket = createWebSocket(token);
         authenticationSuccess(parsedToken, socket);
       } else {
-        return auth(context.room).then(({ token }) => {
+        return auth(context.roomId).then(({ token: token2 }) => {
           if (state.connection.state !== "authenticating") {
             return;
           }
-          const parsedToken = parseToken(token);
-          const socket = createWebSocket(token);
+          const parsedToken = parseToken(token2);
+          const socket = createWebSocket(token2);
           authenticationSuccess(parsedToken, socket);
-          state.token = token;
+          state.token = token2;
         }).catch((er) => authenticationFailure(er));
       }
     },
@@ -1733,7 +1748,7 @@ function makeStateMachine(state, context, mockedEffects) {
       generateId,
       generateOpId,
       dispatch: storageDispatch,
-      roomId: context.room
+      roomId: context.roomId
     });
   }
   function addItem(id, item) {
@@ -1808,6 +1823,7 @@ function makeStateMachine(state, context, mockedEffects) {
     return `${getConnectionId()}:${state.opClock++}`;
   }
   function apply(item, isLocal) {
+    var _a;
     const result = {
       reverse: [],
       updates: {
@@ -1815,6 +1831,7 @@ function makeStateMachine(state, context, mockedEffects) {
         presence: false
       }
     };
+    const createdNodeIds = /* @__PURE__ */ new Set();
     for (const op of item) {
       if (op.type === "presence") {
         const reverse = {
@@ -1829,7 +1846,7 @@ function makeStateMachine(state, context, mockedEffects) {
           state.buffer.presence = op.data;
         } else {
           for (const key in op.data) {
-            state.buffer.presence[key] = op.data;
+            state.buffer.presence[key] = op.data[key];
           }
         }
         result.reverse.unshift(reverse);
@@ -1840,8 +1857,14 @@ function makeStateMachine(state, context, mockedEffects) {
         }
         const applyOpResult = applyOp(op, isLocal);
         if (applyOpResult.modified) {
-          result.updates.storageUpdates.set(applyOpResult.modified.node._id, mergeStorageUpdates(result.updates.storageUpdates.get(applyOpResult.modified.node._id), applyOpResult.modified));
-          result.reverse.unshift(...applyOpResult.reverse);
+          const parentId = (_a = applyOpResult.modified.node._parent) == null ? void 0 : _a._id;
+          if (!createdNodeIds.has(parentId)) {
+            result.updates.storageUpdates.set(applyOpResult.modified.node._id, mergeStorageUpdates(result.updates.storageUpdates.get(applyOpResult.modified.node._id), applyOpResult.modified));
+            result.reverse.unshift(...applyOpResult.reverse);
+          }
+          if (op.type === OpType.CreateList || op.type === OpType.CreateMap || op.type === OpType.CreateObject) {
+            createdNodeIds.add(applyOpResult.modified.node._id);
+          }
         }
       }
     }
@@ -2061,59 +2084,72 @@ See v0.13 release notes for more information.
     }
     return { type: "enter", user: state.users[message.actor] };
   }
+  function parseServerMessage(data) {
+    if (!isJsonObject(data)) {
+      return null;
+    }
+    return data;
+  }
+  function parseServerMessages(text) {
+    const data = parseJson(text);
+    if (data === void 0) {
+      return null;
+    } else if (isJsonArray(data)) {
+      return compact(data.map((item) => parseServerMessage(item)));
+    } else {
+      return compact([parseServerMessage(data)]);
+    }
+  }
   function onMessage(event) {
     if (event.data === "pong") {
       clearTimeout(state.timeoutHandles.pongTimeout);
       return;
     }
-    const message = JSON.parse(event.data);
-    let subMessages = [];
-    if (Array.isArray(message)) {
-      subMessages = message;
-    } else {
-      subMessages.push(message);
+    const messages = parseServerMessages(event.data);
+    if (messages === null || messages.length === 0) {
+      return;
     }
     const updates = {
       storageUpdates: /* @__PURE__ */ new Map(),
       others: []
     };
-    for (const subMessage of subMessages) {
-      switch (subMessage.type) {
+    for (const message of messages) {
+      switch (message.type) {
         case ServerMessageType.UserJoined: {
           updates.others.push(onUserJoinedMessage(message));
           break;
         }
         case ServerMessageType.UpdatePresence: {
-          const othersPresenceUpdate = onUpdatePresenceMessage(subMessage);
+          const othersPresenceUpdate = onUpdatePresenceMessage(message);
           if (othersPresenceUpdate) {
             updates.others.push(othersPresenceUpdate);
           }
           break;
         }
         case ServerMessageType.Event: {
-          onEvent(subMessage);
+          onEvent(message);
           break;
         }
         case ServerMessageType.UserLeft: {
-          const event2 = onUserLeftMessage(subMessage);
+          const event2 = onUserLeftMessage(message);
           if (event2) {
             updates.others.push(event2);
           }
           break;
         }
         case ServerMessageType.RoomState: {
-          updates.others.push(onRoomStateMessage(subMessage));
+          updates.others.push(onRoomStateMessage(message));
           break;
         }
         case ServerMessageType.InitialStorageState: {
           const offlineOps = new Map(state.offlineOperations);
-          createOrUpdateRootFromMessage(subMessage);
+          createOrUpdateRootFromMessage(message);
           applyAndSendOfflineOps(offlineOps);
           _getInitialStateResolver == null ? void 0 : _getInitialStateResolver();
           break;
         }
         case ServerMessageType.UpdateStorage: {
-          const applyResult = apply(subMessage.ops, false);
+          const applyResult = apply(message.ops, false);
           applyResult.updates.storageUpdates.forEach((value, key) => {
             updates.storageUpdates.set(key, mergeStorageUpdates(updates.storageUpdates.get(key), value));
           });
@@ -2531,7 +2567,7 @@ function createRoom(options, context) {
   const state = defaultState(options.defaultPresence, options.defaultStorageRoot);
   const machine = makeStateMachine(state, context);
   const room = {
-    id: context.room,
+    id: context.roomId,
     getConnectionState: machine.selectors.getConnectionState,
     getSelf: machine.selectors.getSelf,
     subscribe: machine.subscribe,
@@ -2572,11 +2608,15 @@ function parseToken(token) {
   if (tokenParts.length !== 3) {
     throw new Error(`Authentication error. Liveblocks could not parse the response of your authentication endpoint`);
   }
-  const data = JSON.parse(atob(tokenParts[1]));
-  if (typeof data.actor !== "number") {
-    throw new Error(`Authentication error. Liveblocks could not parse the response of your authentication endpoint`);
+  const data = parseJson(atob(tokenParts[1]));
+  if (data !== void 0 && isJsonObject(data) && typeof data.actor === "number" && (data.id === void 0 || typeof data.id === "string")) {
+    return {
+      actor: data.actor,
+      id: data.id,
+      info: data.info
+    };
   }
-  return data;
+  throw new Error(`Authentication error. Liveblocks could not parse the response of your authentication endpoint`);
 }
 function prepareCreateWebSocket(liveblocksServer, WebSocketPolyfill) {
   if (typeof window === "undefined" && WebSocketPolyfill == null) {
@@ -2654,7 +2694,7 @@ function createClient(options) {
       defaultPresence: options2.defaultPresence,
       defaultStorageRoot: options2.defaultStorageRoot
     }, {
-      room: roomId,
+      roomId,
       throttleDelay,
       WebSocketPolyfill: clientOptions.WebSocketPolyfill,
       fetchPolyfill: clientOptions.fetchPolyfill,
@@ -2746,7 +2786,10 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 function lsonObjectToJson(obj) {
   const result = {};
   for (const key in obj) {
-    result[key] = lsonToJson(obj[key]);
+    const val = obj[key];
+    if (val !== void 0) {
+      result[key] = lsonToJson(val);
+    }
   }
   return result;
 }
@@ -2936,7 +2979,10 @@ function patchImmutableNode(state, path, update) {
         const newState = Object.assign({}, state);
         for (const key in update.updates) {
           if (((_a = update.updates[key]) == null ? void 0 : _a.type) === "update") {
-            newState[key] = lsonToJson(update.node.get(key));
+            const val = update.node.get(key);
+            if (val !== void 0) {
+              newState[key] = lsonToJson(val);
+            }
           } else if (((_b = update.updates[key]) == null ? void 0 : _b.type) === "delete") {
             delete newState[key];
           }

package/{lib/esm → esm}/index.mjs

@@ -915,6 +915,20 @@ class LiveMap extends AbstractCrdt {
   }
 }
 
+function parseJson(rawMessage) {
+  try {
+    return JSON.parse(rawMessage);
+  } catch (e) {
+    return void 0;
+  }
+}
+function isJsonArray(data) {
+  return Array.isArray(data);
+}
+function isJsonObject(data) {
+  return data !== null && typeof data === "object" && !isJsonArray(data);
+}
+
 var __defProp$2 = Object.defineProperty;
 var __defProps$2 = Object.defineProperties;
 var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
@@ -942,6 +956,9 @@ function remove(array, item) {
     }
   }
 }
+function compact(items) {
+  return items.filter((item) => item != null);
+}
 function creationOpToLiveStructure(op) {
   switch (op.type) {
     case OpType.CreateRegister:
@@ -1151,15 +1168,12 @@ function findNonSerializableValue(value, path = "") {
   return false;
 }
 function isTokenValid(token) {
-  if (token === null) {
-    return false;
-  }
   const tokenParts = token.split(".");
   if (tokenParts.length !== 3) {
     return false;
   }
-  const data = JSON.parse(atob(tokenParts[1]));
-  if (typeof data.exp !== "number") {
+  const data = parseJson(atob(tokenParts[1]));
+  if (data === void 0 || !isJsonObject(data) || typeof data.exp !== "number") {
     return false;
   }
   const now = Date.now();
@@ -1621,19 +1635,20 @@ function makeOthers(userMap) {
 function makeStateMachine(state, context, mockedEffects) {
   const effects = mockedEffects || {
     authenticate(auth, createWebSocket) {
-      if (isTokenValid(state.token)) {
-        const parsedToken = parseToken(state.token);
-        const socket = createWebSocket(state.token);
+      const token = state.token;
+      if (token && isTokenValid(token)) {
+        const parsedToken = parseToken(token);
+        const socket = createWebSocket(token);
         authenticationSuccess(parsedToken, socket);
       } else {
-        return auth(context.room).then(({ token }) => {
+        return auth(context.roomId).then(({ token: token2 }) => {
           if (state.connection.state !== "authenticating") {
             return;
           }
-          const parsedToken = parseToken(token);
-          const socket = createWebSocket(token);
+          const parsedToken = parseToken(token2);
+          const socket = createWebSocket(token2);
           authenticationSuccess(parsedToken, socket);
-          state.token = token;
+          state.token = token2;
         }).catch((er) => authenticationFailure(er));
       }
     },
@@ -1733,7 +1748,7 @@ function makeStateMachine(state, context, mockedEffects) {
       generateId,
       generateOpId,
       dispatch: storageDispatch,
-      roomId: context.room
+      roomId: context.roomId
     });
   }
   function addItem(id, item) {
@@ -1808,6 +1823,7 @@ function makeStateMachine(state, context, mockedEffects) {
     return `${getConnectionId()}:${state.opClock++}`;
   }
   function apply(item, isLocal) {
+    var _a;
     const result = {
       reverse: [],
       updates: {
@@ -1815,6 +1831,7 @@ function makeStateMachine(state, context, mockedEffects) {
         presence: false
       }
     };
+    const createdNodeIds = /* @__PURE__ */ new Set();
     for (const op of item) {
       if (op.type === "presence") {
         const reverse = {
@@ -1829,7 +1846,7 @@ function makeStateMachine(state, context, mockedEffects) {
           state.buffer.presence = op.data;
         } else {
           for (const key in op.data) {
-            state.buffer.presence[key] = op.data;
+            state.buffer.presence[key] = op.data[key];
           }
         }
         result.reverse.unshift(reverse);
@@ -1840,8 +1857,14 @@ function makeStateMachine(state, context, mockedEffects) {
         }
         const applyOpResult = applyOp(op, isLocal);
         if (applyOpResult.modified) {
-          result.updates.storageUpdates.set(applyOpResult.modified.node._id, mergeStorageUpdates(result.updates.storageUpdates.get(applyOpResult.modified.node._id), applyOpResult.modified));
-          result.reverse.unshift(...applyOpResult.reverse);
+          const parentId = (_a = applyOpResult.modified.node._parent) == null ? void 0 : _a._id;
+          if (!createdNodeIds.has(parentId)) {
+            result.updates.storageUpdates.set(applyOpResult.modified.node._id, mergeStorageUpdates(result.updates.storageUpdates.get(applyOpResult.modified.node._id), applyOpResult.modified));
+            result.reverse.unshift(...applyOpResult.reverse);
+          }
+          if (op.type === OpType.CreateList || op.type === OpType.CreateMap || op.type === OpType.CreateObject) {
+            createdNodeIds.add(applyOpResult.modified.node._id);
+          }
         }
       }
     }
@@ -2061,59 +2084,72 @@ See v0.13 release notes for more information.
     }
     return { type: "enter", user: state.users[message.actor] };
   }
+  function parseServerMessage(data) {
+    if (!isJsonObject(data)) {
+      return null;
+    }
+    return data;
+  }
+  function parseServerMessages(text) {
+    const data = parseJson(text);
+    if (data === void 0) {
+      return null;
+    } else if (isJsonArray(data)) {
+      return compact(data.map((item) => parseServerMessage(item)));
+    } else {
+      return compact([parseServerMessage(data)]);
+    }
+  }
   function onMessage(event) {
     if (event.data === "pong") {
       clearTimeout(state.timeoutHandles.pongTimeout);
       return;
     }
-    const message = JSON.parse(event.data);
-    let subMessages = [];
-    if (Array.isArray(message)) {
-      subMessages = message;
-    } else {
-      subMessages.push(message);
+    const messages = parseServerMessages(event.data);
+    if (messages === null || messages.length === 0) {
+      return;
     }
     const updates = {
       storageUpdates: /* @__PURE__ */ new Map(),
       others: []
     };
-    for (const subMessage of subMessages) {
-      switch (subMessage.type) {
+    for (const message of messages) {
+      switch (message.type) {
         case ServerMessageType.UserJoined: {
           updates.others.push(onUserJoinedMessage(message));
           break;
         }
         case ServerMessageType.UpdatePresence: {
-          const othersPresenceUpdate = onUpdatePresenceMessage(subMessage);
+          const othersPresenceUpdate = onUpdatePresenceMessage(message);
           if (othersPresenceUpdate) {
             updates.others.push(othersPresenceUpdate);
           }
           break;
         }
         case ServerMessageType.Event: {
-          onEvent(subMessage);
+          onEvent(message);
           break;
         }
         case ServerMessageType.UserLeft: {
-          const event2 = onUserLeftMessage(subMessage);
+          const event2 = onUserLeftMessage(message);
           if (event2) {
             updates.others.push(event2);
           }
           break;
         }
         case ServerMessageType.RoomState: {
-          updates.others.push(onRoomStateMessage(subMessage));
+          updates.others.push(onRoomStateMessage(message));
           break;
         }
         case ServerMessageType.InitialStorageState: {
           const offlineOps = new Map(state.offlineOperations);
-          createOrUpdateRootFromMessage(subMessage);
+          createOrUpdateRootFromMessage(message);
           applyAndSendOfflineOps(offlineOps);
           _getInitialStateResolver == null ? void 0 : _getInitialStateResolver();
           break;
         }
         case ServerMessageType.UpdateStorage: {
-          const applyResult = apply(subMessage.ops, false);
+          const applyResult = apply(message.ops, false);
           applyResult.updates.storageUpdates.forEach((value, key) => {
             updates.storageUpdates.set(key, mergeStorageUpdates(updates.storageUpdates.get(key), value));
           });
@@ -2531,7 +2567,7 @@ function createRoom(options, context) {
   const state = defaultState(options.defaultPresence, options.defaultStorageRoot);
   const machine = makeStateMachine(state, context);
   const room = {
-    id: context.room,
+    id: context.roomId,
     getConnectionState: machine.selectors.getConnectionState,
     getSelf: machine.selectors.getSelf,
     subscribe: machine.subscribe,
@@ -2572,11 +2608,15 @@ function parseToken(token) {
   if (tokenParts.length !== 3) {
     throw new Error(`Authentication error. Liveblocks could not parse the response of your authentication endpoint`);
   }
-  const data = JSON.parse(atob(tokenParts[1]));
-  if (typeof data.actor !== "number") {
-    throw new Error(`Authentication error. Liveblocks could not parse the response of your authentication endpoint`);
+  const data = parseJson(atob(tokenParts[1]));
+  if (data !== void 0 && isJsonObject(data) && typeof data.actor === "number" && (data.id === void 0 || typeof data.id === "string")) {
+    return {
+      actor: data.actor,
+      id: data.id,
+      info: data.info
+    };
   }
-  return data;
+  throw new Error(`Authentication error. Liveblocks could not parse the response of your authentication endpoint`);
 }
 function prepareCreateWebSocket(liveblocksServer, WebSocketPolyfill) {
   if (typeof window === "undefined" && WebSocketPolyfill == null) {
@@ -2654,7 +2694,7 @@ function createClient(options) {
       defaultPresence: options2.defaultPresence,
       defaultStorageRoot: options2.defaultStorageRoot
     }, {
-      room: roomId,
+      roomId,
       throttleDelay,
       WebSocketPolyfill: clientOptions.WebSocketPolyfill,
       fetchPolyfill: clientOptions.fetchPolyfill,
@@ -2746,7 +2786,10 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 function lsonObjectToJson(obj) {
   const result = {};
   for (const key in obj) {
-    result[key] = lsonToJson(obj[key]);
+    const val = obj[key];
+    if (val !== void 0) {
+      result[key] = lsonToJson(val);
+    }
   }
   return result;
 }
@@ -2936,7 +2979,10 @@ function patchImmutableNode(state, path, update) {
         const newState = Object.assign({}, state);
         for (const key in update.updates) {
           if (((_a = update.updates[key]) == null ? void 0 : _a.type) === "update") {
-            newState[key] = lsonToJson(update.node.get(key));
+            const val = update.node.get(key);
+            if (val !== void 0) {
+              newState[key] = lsonToJson(val);
+            }
           } else if (((_b = update.updates[key]) == null ? void 0 : _b.type) === "delete") {
             delete newState[key];
           }

package/{lib/index.d.ts → index.d.ts}

@@ -12,7 +12,7 @@ declare type Json = JsonScalar | JsonArray | JsonObject;
 declare type JsonScalar = string | number | boolean | null;
 declare type JsonArray = Json[];
 declare type JsonObject = {
-    [key: string]: Json;
+    [key: string]: Json | undefined;
 };
 
 /**
@@ -83,7 +83,7 @@ declare type Lson = Json | LiveObject<LsonObject> | LiveList<Lson> | LiveMap<str
  * value or a Live storage data structure (LiveMap, LiveList, etc.)
  */
 declare type LsonObject = {
-    [key: string]: Lson;
+    [key: string]: Lson | undefined;
 };
 
 /**
@@ -201,6 +201,10 @@ declare type UpdateDelta = {
 } | {
     type: "delete";
 };
+/**
+ * A LiveMap notification that is sent in-client to any subscribers whenever
+ * one or more of the values inside the LiveMap instance have changed.
+ */
 declare type LiveMapUpdates<TKey extends string, TValue extends Lson> = {
     type: "LiveMap";
     node: LiveMap<TKey, TValue>;
@@ -213,6 +217,10 @@ declare type LiveObjectUpdateDelta<O extends {
 }> = {
     [K in keyof O]?: UpdateDelta | undefined;
 };
+/**
+ * A LiveObject notification that is sent in-client to any subscribers whenever
+ * one or more of the entries inside the LiveObject instance have changed.
+ */
 declare type LiveObjectUpdates<TData extends LsonObject> = {
     type: "LiveObject";
     node: LiveObject<TData>;
@@ -235,6 +243,10 @@ declare type LiveListUpdateDelta = {
     item: any;
     type: "set";
 };
+/**
+ * A LiveList notification that is sent in-client to any subscribers whenever
+ * one or more of the items inside the LiveList instance have changed.
+ */
 declare type LiveListUpdates<TItem extends Lson> = {
     type: "LiveList";
     node: LiveList<TItem>;
@@ -248,6 +260,11 @@ declare type BroadcastOptions = {
      */
     shouldQueueEventIfNotReady: boolean;
 };
+/**
+ * The payload of notifications sent (in-client) when LiveStructures change.
+ * Messages of this kind are not originating from the network, but are 100%
+ * in-client.
+ */
 declare type StorageUpdate = LiveMapUpdates<string, Lson> | LiveObjectUpdates<LsonObject> | LiveListUpdates<Lson>;
 declare type Client = {
     /**

package/{lib/index.js → index.js}

@@ -1535,6 +1535,20 @@ var LiveMap = function (_AbstractCrdt) {
   return LiveMap;
 }(AbstractCrdt);
 
+function parseJson(rawMessage) {
+  try {
+    return JSON.parse(rawMessage);
+  } catch (e) {
+    return undefined;
+  }
+}
+function isJsonArray(data) {
+  return Array.isArray(data);
+}
+function isJsonObject(data) {
+  return data !== null && typeof data === "object" && !isJsonArray(data);
+}
+
 function remove(array, item) {
   for (var i = 0; i < array.length; i++) {
     if (array[i] === item) {
@@ -1543,6 +1557,11 @@ function remove(array, item) {
     }
   }
 }
+function compact(items) {
+  return items.filter(function (item) {
+    return item != null;
+  });
+}
 function creationOpToLiveStructure(op) {
   switch (op.type) {
     case OpType.CreateRegister:
@@ -1804,19 +1823,15 @@ function findNonSerializableValue(value, path) {
   return false;
 }
 function isTokenValid(token) {
-  if (token === null) {
-    return false;
-  }
-
   var tokenParts = token.split(".");
 
   if (tokenParts.length !== 3) {
     return false;
   }
 
-  var data = JSON.parse(atob(tokenParts[1]));
+  var data = parseJson(atob(tokenParts[1]));
 
-  if (typeof data.exp !== "number") {
+  if (data === undefined || !isJsonObject(data) || typeof data.exp !== "number") {
     return false;
   }
 
@@ -2461,12 +2476,14 @@ function makeOthers(userMap) {
 function makeStateMachine(state, context, mockedEffects) {
   var effects = mockedEffects || {
     authenticate: function authenticate(auth, createWebSocket) {
-      if (isTokenValid(state.token)) {
-        var parsedToken = parseToken(state.token);
-        var socket = createWebSocket(state.token);
+      var token = state.token;
+
+      if (token && isTokenValid(token)) {
+        var parsedToken = parseToken(token);
+        var socket = createWebSocket(token);
         authenticationSuccess(parsedToken, socket);
       } else {
-        return auth(context.room).then(function (_ref2) {
+        return auth(context.roomId).then(function (_ref2) {
           var token = _ref2.token;
 
           if (state.connection.state !== "authenticating") {
@@ -2604,7 +2621,7 @@ function makeStateMachine(state, context, mockedEffects) {
       generateId: generateId,
       generateOpId: generateOpId,
       dispatch: storageDispatch,
-      roomId: context.room
+      roomId: context.roomId
     });
   }
 
@@ -2719,6 +2736,7 @@ function makeStateMachine(state, context, mockedEffects) {
         presence: false
       }
     };
+    var createdNodeIds = new Set();
 
     for (var _iterator7 = _createForOfIteratorHelperLoose(item), _step7; !(_step7 = _iterator7()).done;) {
       var op = _step7.value;
@@ -2739,7 +2757,7 @@ function makeStateMachine(state, context, mockedEffects) {
           state.buffer.presence = op.data;
         } else {
           for (var _key3 in op.data) {
-            state.buffer.presence[_key3] = op.data;
+            state.buffer.presence[_key3] = op.data[_key3];
           }
         }
 
@@ -2753,11 +2771,21 @@ function makeStateMachine(state, context, mockedEffects) {
         var applyOpResult = applyOp(op, isLocal);
 
         if (applyOpResult.modified) {
-          var _result$reverse;
+          var _applyOpResult$modifi;
+
+          var parentId = (_applyOpResult$modifi = applyOpResult.modified.node._parent) == null ? void 0 : _applyOpResult$modifi._id;
+
+          if (!createdNodeIds.has(parentId)) {
+            var _result$reverse;
 
-          result.updates.storageUpdates.set(applyOpResult.modified.node._id, mergeStorageUpdates(result.updates.storageUpdates.get(applyOpResult.modified.node._id), applyOpResult.modified));
+            result.updates.storageUpdates.set(applyOpResult.modified.node._id, mergeStorageUpdates(result.updates.storageUpdates.get(applyOpResult.modified.node._id), applyOpResult.modified));
 
-          (_result$reverse = result.reverse).unshift.apply(_result$reverse, applyOpResult.reverse);
+            (_result$reverse = result.reverse).unshift.apply(_result$reverse, applyOpResult.reverse);
+          }
+
+          if (op.type === OpType.CreateList || op.type === OpType.CreateMap || op.type === OpType.CreateObject) {
+            createdNodeIds.add(applyOpResult.modified.node._id);
+          }
         }
       }
     }
@@ -3066,19 +3094,38 @@ function makeStateMachine(state, context, mockedEffects) {
     };
   }
 
+  function parseServerMessage(data) {
+    if (!isJsonObject(data)) {
+      return null;
+    }
+
+    return data;
+  }
+
+  function parseServerMessages(text) {
+    var data = parseJson(text);
+
+    if (data === undefined) {
+      return null;
+    } else if (isJsonArray(data)) {
+      return compact(data.map(function (item) {
+        return parseServerMessage(item);
+      }));
+    } else {
+      return compact([parseServerMessage(data)]);
+    }
+  }
+
   function onMessage(event) {
     if (event.data === "pong") {
       clearTimeout(state.timeoutHandles.pongTimeout);
       return;
     }
 
-    var message = JSON.parse(event.data);
-    var subMessages = [];
+    var messages = parseServerMessages(event.data);
 
-    if (Array.isArray(message)) {
-      subMessages = message;
-    } else {
-      subMessages.push(message);
+    if (messages === null || messages.length === 0) {
+      return;
     }
 
     var updates = {
@@ -3086,10 +3133,10 @@ function makeStateMachine(state, context, mockedEffects) {
       others: []
     };
 
-    for (var _iterator9 = _createForOfIteratorHelperLoose(subMessages), _step9; !(_step9 = _iterator9()).done;) {
-      var subMessage = _step9.value;
+    for (var _iterator9 = _createForOfIteratorHelperLoose(messages), _step9; !(_step9 = _iterator9()).done;) {
+      var message = _step9.value;
 
-      switch (subMessage.type) {
+      switch (message.type) {
         case ServerMessageType.UserJoined:
           {
             updates.others.push(onUserJoinedMessage(message));
@@ -3098,7 +3145,7 @@ function makeStateMachine(state, context, mockedEffects) {
 
         case ServerMessageType.UpdatePresence:
           {
-            var othersPresenceUpdate = onUpdatePresenceMessage(subMessage);
+            var othersPresenceUpdate = onUpdatePresenceMessage(message);
 
             if (othersPresenceUpdate) {
               updates.others.push(othersPresenceUpdate);
@@ -3109,13 +3156,13 @@ function makeStateMachine(state, context, mockedEffects) {
 
         case ServerMessageType.Event:
           {
-            onEvent(subMessage);
+            onEvent(message);
             break;
           }
 
         case ServerMessageType.UserLeft:
           {
-            var _event = onUserLeftMessage(subMessage);
+            var _event = onUserLeftMessage(message);
 
             if (_event) {
               updates.others.push(_event);
@@ -3126,14 +3173,14 @@ function makeStateMachine(state, context, mockedEffects) {
 
         case ServerMessageType.RoomState:
           {
-            updates.others.push(onRoomStateMessage(subMessage));
+            updates.others.push(onRoomStateMessage(message));
             break;
           }
 
         case ServerMessageType.InitialStorageState:
           {
             var offlineOps = new Map(state.offlineOperations);
-            createOrUpdateRootFromMessage(subMessage);
+            createOrUpdateRootFromMessage(message);
             applyAndSendOfflineOps(offlineOps);
             _getInitialStateResolver == null ? void 0 : _getInitialStateResolver();
             break;
@@ -3141,7 +3188,7 @@ function makeStateMachine(state, context, mockedEffects) {
 
         case ServerMessageType.UpdateStorage:
           {
-            var applyResult = apply(subMessage.ops, false);
+            var applyResult = apply(message.ops, false);
             applyResult.updates.storageUpdates.forEach(function (value, key) {
               updates.storageUpdates.set(key, mergeStorageUpdates(updates.storageUpdates.get(key), value));
             });
@@ -3701,7 +3748,7 @@ function createRoom(options, context) {
   var state = defaultState(options.defaultPresence, options.defaultStorageRoot);
   var machine = makeStateMachine(state, context);
   var room = {
-    id: context.room,
+    id: context.roomId,
     getConnectionState: machine.selectors.getConnectionState,
     getSelf: machine.selectors.getSelf,
     subscribe: machine.subscribe,
@@ -3753,13 +3800,17 @@ function parseToken(token) {
     throw new Error("Authentication error. Liveblocks could not parse the response of your authentication endpoint");
   }
 
-  var data = JSON.parse(atob(tokenParts[1]));
+  var data = parseJson(atob(tokenParts[1]));
 
-  if (typeof data.actor !== "number") {
-    throw new Error("Authentication error. Liveblocks could not parse the response of your authentication endpoint");
+  if (data !== undefined && isJsonObject(data) && typeof data.actor === "number" && (data.id === undefined || typeof data.id === "string")) {
+    return {
+      actor: data.actor,
+      id: data.id,
+      info: data.info
+    };
   }
 
-  return data;
+  throw new Error("Authentication error. Liveblocks could not parse the response of your authentication endpoint");
 }
 
 function prepareCreateWebSocket(liveblocksServer, WebSocketPolyfill) {
@@ -3865,7 +3916,7 @@ function createClient(options) {
       defaultPresence: options.defaultPresence,
       defaultStorageRoot: options.defaultStorageRoot
     }, {
-      room: roomId,
+      roomId: roomId,
       throttleDelay: throttleDelay,
       WebSocketPolyfill: clientOptions.WebSocketPolyfill,
       fetchPolyfill: clientOptions.fetchPolyfill,
@@ -3955,7 +4006,11 @@ function lsonObjectToJson(obj) {
   var result = {};
 
   for (var _key in obj) {
-    result[_key] = lsonToJson(obj[_key]);
+    var val = obj[_key];
+
+    if (val !== undefined) {
+      result[_key] = lsonToJson(val);
+    }
   }
 
   return result;
@@ -4199,7 +4254,11 @@ function patchImmutableNode(state, path, update) {
             var _update$updates$_key, _update$updates$_key2;
 
             if (((_update$updates$_key = update.updates[_key6]) == null ? void 0 : _update$updates$_key.type) === "update") {
-              newState[_key6] = lsonToJson(update.node.get(_key6));
+              var val = update.node.get(_key6);
+
+              if (val !== undefined) {
+                newState[_key6] = lsonToJson(val);
+              }
             } else if (((_update$updates$_key2 = update.updates[_key6]) == null ? void 0 : _update$updates$_key2.type) === "delete") {
               delete newState[_key6];
             }

package/{lib/internal.d.ts → internal.d.ts}

@@ -12,11 +12,14 @@ declare type Json = JsonScalar | JsonArray | JsonObject;
 declare type JsonScalar = string | number | boolean | null;
 declare type JsonArray = Json[];
 declare type JsonObject = {
-    [key: string]: Json;
+    [key: string]: Json | undefined;
 };
 
 declare type Presence = Record<string, unknown>;
 
+/**
+ * Messages that can be sent from the server to the client.
+ */
 declare type ServerMessage = UpdatePresenceMessage | UserJoinMessage | UserLeftMessage | EventMessage | RoomStateMessage | InitialDocumentStateMessage | UpdateStorageMessage;
 declare enum ServerMessageType {
     UpdatePresence = 100,
@@ -27,45 +30,116 @@ declare enum ServerMessageType {
     InitialStorageState = 200,
     UpdateStorage = 201
 }
+/**
+ * Sent by the WebSocket server to a single client in response to the client
+ * joining the Room, to provide the initial state of the Room. The payload
+ * includes a list of all other Users that already are in the Room.
+ */
 declare type RoomStateMessage = {
     type: ServerMessageType.RoomState;
     users: {
         [actor: number]: {
             id?: string;
-            info?: any;
+            info?: Json;
         };
     };
 };
+/**
+ * Sent by the WebSocket server and broadcasted to all clients to announce that
+ * a User updated their presence. For example, when a user moves their cursor.
+ *
+ * In most cases, the data payload will only include the fields from the
+ * Presence that have been changed since the last announcement. However, after
+ * a new user joins a room, a "full presence" will be announced so the newly
+ * connected user will get each other's user full presence at least once. In
+ * those cases, the `targetActor` field indicates the newly connected client,
+ * so all other existing clients can ignore this broadcasted message.
+ */
 declare type UpdatePresenceMessage = {
     type: ServerMessageType.UpdatePresence;
+    /**
+     * The User whose Presence has changed.
+     */
     actor: number;
+    /**
+     * The partial or full Presence of a User. If the `targetActor` field is set,
+     * this will be the full Presence, otherwise it only contain the fields that
+     * have changed since the last broadcast.
+     */
     data: Presence;
+    /**
+     * If this message was sent in response to a newly joined user, this field
+     * indicates which client this message is for. Other existing clients may
+     * ignore this message if this message isn't targeted for them.
+     */
     targetActor?: number;
 };
+/**
+ * Sent by the WebSocket server and broadcasted to all clients to announce that
+ * a new User has joined the Room.
+ */
 declare type UserJoinMessage = {
     type: ServerMessageType.UserJoined;
     actor: number;
+    /**
+     * The id of the User that has been set in the authentication endpoint.
+     * Useful to get additional information about the connected user.
+     */
     id?: string;
-    info?: string;
+    /**
+     * Additional user information that has been set in the authentication
+     * endpoint.
+     */
+    info?: Json;
 };
+/**
+ * Sent by the WebSocket server and broadcasted to all clients to announce that
+ * a new User has left the Room.
+ */
 declare type UserLeftMessage = {
     type: ServerMessageType.UserLeft;
     actor: number;
 };
+/**
+ * Sent by the WebSocket server and broadcasted to all clients to announce that
+ * a User broadcasted an Event to everyone in the Room.
+ */
 declare type EventMessage = {
     type: ServerMessageType.Event;
+    /**
+     * The User who broadcasted the Event.
+     */
     actor: number;
+    /**
+     * The arbitrary payload of the Event. This can be any JSON value. Clients
+     * will have to manually verify/decode this event.
+     */
     event: Json;
 };
 declare type SerializedCrdtWithId = [id: string, crdt: SerializedCrdt];
+/**
+ * Sent by the WebSocket server to a single client in response to the client
+ * joining the Room, to provide the initial Storage state of the Room. The
+ * payload includes the entire Storage document.
+ */
 declare type InitialDocumentStateMessage = {
     type: ServerMessageType.InitialStorageState;
     items: SerializedCrdtWithId[];
 };
+/**
+ * Sent by the WebSocket server and broadcasted to all clients to announce that
+ * a change occurred in the Storage document.
+ *
+ * The payload of this message contains a list of Ops (aka incremental
+ * mutations to make to the initially loaded document).
+ */
 declare type UpdateStorageMessage = {
     type: ServerMessageType.UpdateStorage;
     ops: Op[];
 };
+/**
+ * Messages that can be sent from the client to the server.
+ */
 declare type ClientMessage = ClientEventMessage | UpdatePresenceClientMessage | UpdateStorageClientMessage | FetchStorageClientMessage;
 declare enum ClientMessageType {
     UpdatePresence = 100,
@@ -129,6 +203,10 @@ declare enum OpType {
     CreateMap = 7,
     CreateRegister = 8
 }
+/**
+ * These operations are the payload for {@link UpdateStorageMessage} messages
+ * only.
+ */
 declare type Op = CreateObjectOp | UpdateObjectOp | DeleteCrdtOp | CreateListOp | SetParentKeyOp | DeleteObjectKeyOp | CreateMapOp | CreateRegisterOp;
 declare type CreateOp = CreateObjectOp | CreateRegisterOp | CreateMapOp | CreateListOp;
 declare type UpdateObjectOp = {
@@ -169,7 +247,7 @@ declare type CreateRegisterOp = {
     type: OpType.CreateRegister;
     parentId: string;
     parentKey: string;
-    data: any;
+    data: Json;
 };
 declare type DeleteCrdtOp = {
     opId?: string;

package/package.json

@@ -1,25 +1,25 @@
 {
   "name": "@liveblocks/client",
-  "version": "0.16.0",
+  "version": "0.16.3",
   "description": "A client that lets you interact with Liveblocks servers.",
-  "main": "./lib/index.js",
-  "types": "./lib/index.d.ts",
+  "main": "./index.js",
+  "types": "./index.d.ts",
   "files": [
-    "lib/**"
+    "**"
   ],
   "exports": {
     "./package.json": "./package.json",
     ".": {
-      "types": "./lib/index.d.ts",
-      "module": "./lib/esm/index.js",
-      "import": "./lib/esm/index.mjs",
-      "default": "./lib/index.js"
+      "types": "./index.d.ts",
+      "module": "./esm/index.js",
+      "import": "./esm/index.mjs",
+      "default": "./index.js"
     },
     "./internal": {
-      "types": "./lib/internal.d.ts",
-      "module": "./lib/esm/internal.js",
-      "import": "./lib/esm/internal.mjs",
-      "default": "./lib/internal.js"
+      "types": "./internal.d.ts",
+      "module": "./esm/internal.js",
+      "import": "./esm/internal.mjs",
+      "default": "./internal.js"
     }
   },
   "keywords": [
@@ -32,7 +32,7 @@
     "url": "https://github.com/liveblocks/liveblocks/issues"
   },
   "scripts": {
-    "build": "rollup -c",
+    "build": "rollup -c && cp ./package.json ./README.md ./lib",
     "test": "jest --watch",
     "test-ci": "jest"
   },