@liveblocks/client 0.17.0-beta1 → 0.17.0

package/README.md

@@ -18,7 +18,8 @@
   </a>
 </p>
 
-A client that lets you interact with [Liveblocks](https://liveblocks.io) servers.
+A client that lets you interact with [Liveblocks](https://liveblocks.io)
+servers.
 
 ## Installation
 
@@ -28,25 +29,33 @@ npm install @liveblocks/client
 
 ## Documentation
 
-- [Read the documentation](https://liveblocks.io/docs) to start using Liveblocks.
-- Explore the [API Reference](https://liveblocks.io/docs/api-reference/liveblocks-client).
+- [Read the documentation](https://liveblocks.io/docs) to start using
+  Liveblocks.
+- Explore the
+  [API Reference](https://liveblocks.io/docs/api-reference/liveblocks-client).
 
 ## Examples
 
-- Browse our gallery of collaborative UI patterns. [View examples gallery](https://liveblocks.io/examples)
-- Explore and clone any of our open-source examples. [View code examples](https://github.com/liveblocks/liveblocks/tree/main/examples)
+- Browse our gallery of collaborative UI patterns.
+  [View examples gallery](https://liveblocks.io/examples)
+- Explore and clone any of our open-source examples.
+  [View code examples](https://github.com/liveblocks/liveblocks/tree/main/examples)
 
 ## Releases
 
-For changelog, visit [https://github.com/liveblocks/liveblocks/releases](https://github.com/liveblocks/liveblocks/releases).
+For changelog, visit
+[https://github.com/liveblocks/liveblocks/releases](https://github.com/liveblocks/liveblocks/releases).
 
 ## Community
 
-- [Discord](https://discord.gg/X4YWJuH9VY) - To get involved with the Liveblocks community, ask questions and share tips.
-- [Twitter](https://twitter.com/liveblocks) - To receive updates, announcements, blog posts, and general Liveblocks tips.
+- [Discord](https://discord.gg/X4YWJuH9VY) - To get involved with the Liveblocks
+  community, ask questions and share tips.
+- [Twitter](https://twitter.com/liveblocks) - To receive updates, announcements,
+  blog posts, and general Liveblocks tips.
 
 ## License
 
-Licensed under the Apache License 2.0, Copyright © 2021-present [Liveblocks](https://liveblocks.io).
+Licensed under the Apache License 2.0, Copyright © 2021-present
+[Liveblocks](https://liveblocks.io).
 
 See [LICENSE](../../LICENSE) for more information.

package/index.js

@@ -413,7 +413,9 @@ function makeStateMachine(state, context, mockedEffects) {
           );
         var ws = WebSocketPolyfill || WebSocket;
         return function (token) {
-          return new ws(liveblocksServer + "/?token=" + token);
+          return new ws(
+            liveblocksServer + "/?token=" + token + "&version=0.17.0"
+          );
         };
       })(
         context.liveblocksServer,

package/index.mjs

@@ -336,7 +336,8 @@ function makeStateMachine(state, context, mockedEffects) {
             "To use Liveblocks client in a non-dom environment, you need to provide a WebSocket polyfill."
           );
         const ws = WebSocketPolyfill || WebSocket;
-        return (token) => new ws(`${liveblocksServer}/?token=${token}`);
+        return (token) =>
+          new ws(`${liveblocksServer}/?token=${token}&version=0.17.0`);
       })(
         context.liveblocksServer,
         null !==

package/internal.d.ts

@@ -123,14 +123,14 @@ declare enum ClientMsgCode {
 /**
  * Messages that can be sent from the client to the server.
  */
-declare type ClientMsg<TPresence extends JsonObject, TEvent extends Json> =
-  | BroadcastEventClientMsg<TEvent>
+declare type ClientMsg<TPresence extends JsonObject, TRoomEvent extends Json> =
+  | BroadcastEventClientMsg<TRoomEvent>
   | UpdatePresenceClientMsg<TPresence>
   | UpdateStorageClientMsg
   | FetchStorageClientMsg;
-declare type BroadcastEventClientMsg<TEvent extends Json> = {
+declare type BroadcastEventClientMsg<TRoomEvent extends Json> = {
   type: ClientMsgCode.BROADCAST_EVENT;
-  event: TEvent;
+  event: TRoomEvent;
 };
 declare type UpdatePresenceClientMsg<TPresence extends JsonObject> = {
   type: ClientMsgCode.UPDATE_PRESENCE;
@@ -220,12 +220,12 @@ declare enum ServerMsgCode {
 declare type ServerMsg<
   TPresence extends JsonObject,
   TUserMeta extends BaseUserMeta,
-  TEvent extends Json
+  TRoomEvent extends Json
 > =
   | UpdatePresenceServerMsg<TPresence>
   | UserJoinServerMsg<TUserMeta>
   | UserLeftServerMsg
-  | BroadcastedEventServerMsg<TEvent>
+  | BroadcastedEventServerMsg<TRoomEvent>
   | RoomStateServerMsg<TUserMeta>
   | InitialDocumentStateServerMsg
   | UpdateStorageServerMsg;
@@ -289,7 +289,7 @@ declare type UserLeftServerMsg = {
  * 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 BroadcastedEventServerMsg<TEvent extends Json> = {
+declare type BroadcastedEventServerMsg<TRoomEvent extends Json> = {
   type: ServerMsgCode.BROADCASTED_EVENT;
   /**
    * The User who broadcasted the Event.
@@ -299,7 +299,7 @@ declare type BroadcastedEventServerMsg<TEvent extends Json> = {
    * The arbitrary payload of the Event. This can be any JSON value. Clients
    * will have to manually verify/decode this event.
    */
-  event: TEvent;
+  event: TRoomEvent;
 };
 /**
  * Sent by the WebSocket server to a single client in response to the client

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liveblocks/client",
-  "version": "0.17.0-beta1",
+  "version": "0.17.0",
   "description": "A client that lets you interact with Liveblocks servers.",
   "main": "./index.js",
   "module": "./index.mjs",

package/shared.d.ts

@@ -303,12 +303,12 @@ declare type OthersEventCallback<
   others: Others<TPresence, TUserMeta>,
   event: OthersEvent<TPresence, TUserMeta>
 ) => void;
-declare type EventCallback<TEvent extends Json> = ({
+declare type EventCallback<TRoomEvent extends Json> = ({
   connectionId,
   event,
 }: {
   connectionId: number;
-  event: TEvent;
+  event: TRoomEvent;
 }) => void;
 declare type ErrorCallback = (error: Error) => void;
 declare type ConnectionCallback = (state: ConnectionState) => void;
@@ -426,12 +426,12 @@ declare type Client = {
    */
   getRoom<
     TPresence extends JsonObject,
-    TStorage extends LsonObject,
-    TUserMeta extends BaseUserMeta,
-    TEvent extends Json
+    TStorage extends LsonObject = LsonObject,
+    TUserMeta extends BaseUserMeta = BaseUserMeta,
+    TRoomEvent extends Json = never
   >(
     roomId: string
-  ): Room<TPresence, TStorage, TUserMeta, TEvent> | null;
+  ): Room<TPresence, TStorage, TUserMeta, TRoomEvent> | null;
   /**
    * Enters a room and returns it.
    * @param roomId The id of the room
@@ -439,13 +439,13 @@ declare type Client = {
    */
   enter<
     TPresence extends JsonObject,
-    TStorage extends LsonObject,
-    TUserMeta extends BaseUserMeta,
-    TEvent extends Json
+    TStorage extends LsonObject = LsonObject,
+    TUserMeta extends BaseUserMeta = BaseUserMeta,
+    TRoomEvent extends Json = never
   >(
     roomId: string,
     options?: RoomInitializers<TPresence, TStorage>
-  ): Room<TPresence, TStorage, TUserMeta, TEvent>;
+  ): Room<TPresence, TStorage, TUserMeta, TRoomEvent>;
   /**
    * Leaves a room.
    * @param roomId The id of the room
@@ -635,7 +635,7 @@ declare type Room<
   TPresence extends JsonObject,
   TStorage extends LsonObject,
   TUserMeta extends BaseUserMeta,
-  TEvent extends Json
+  TRoomEvent extends Json
 > = {
   /**
    * The id of the room.
@@ -678,7 +678,7 @@ declare type Room<
      *   // Do something
      * });
      */
-    (type: "event", listener: EventCallback<TEvent>): () => void;
+    (type: "event", listener: EventCallback<TRoomEvent>): () => void;
     /**
      * Subscribe to errors thrown in the room.
      */
@@ -789,7 +789,7 @@ declare type Room<
    *   }
    * });
    */
-  broadcastEvent: (event: TEvent, options?: BroadcastOptions) => void;
+  broadcastEvent: (event: TRoomEvent, options?: BroadcastOptions) => void;
   /**
    * Get the room's storage asynchronously.
    * The storage's root is a {@link LiveObject}.

package/shared.js

@@ -945,14 +945,14 @@ var LiveList = (function (_AbstractCrdt) {
         var parentKey = nn(child._parentKey),
           reverse = child._serialize(nn(this._id), parentKey, this._doc),
           indexToDelete = this._items.indexOf(child);
-        return (
-          this._items.splice(indexToDelete, 1),
-          child._detach(),
-          {
-            modified: makeUpdate(this, [deleteDelta(indexToDelete)]),
-            reverse: reverse,
-          }
-        );
+        return -1 === indexToDelete
+          ? { modified: !1 }
+          : (this._items.splice(indexToDelete, 1),
+            child._detach(),
+            {
+              modified: makeUpdate(this, [deleteDelta(indexToDelete)]),
+              reverse: reverse,
+            });
       }
       return { modified: !1 };
     }),
@@ -1448,10 +1448,12 @@ var LiveMap = (function (_AbstractCrdt) {
       var _this;
       if (
         (((_this = _AbstractCrdt.call(this) || this)._map = void 0),
+        (_this.unacknowledgedSet = void 0),
         errorIf(
           null === entries,
           "Support for calling `new LiveMap(null)` will be removed in @liveblocks/client 0.18. Please call as `new LiveMap()`, or `new LiveMap([])`."
         ),
+        (_this.unacknowledgedSet = new Map()),
         entries)
       ) {
         for (
@@ -1531,14 +1533,24 @@ var LiveMap = (function (_AbstractCrdt) {
           isLiveNode(_value3) && _value3._attach(doc.generateId(), doc);
         }
       }),
-      (_proto._attachChild = function (op) {
+      (_proto._attachChild = function (op, source) {
         var _updates;
         if (null == this._doc)
           throw new Error("Can't attach child if doc is not present");
         var id = op.id,
-          key = op.parentKey,
+          parentKey = op.parentKey,
+          opId = op.opId,
+          key = parentKey,
           child = creationOpToLiveNode(op);
         if (void 0 !== this._doc.getItem(id)) return { modified: !1 };
+        if (source === exports.OpSource.ACK) {
+          var lastUpdateOpId = this.unacknowledgedSet.get(key);
+          if (lastUpdateOpId === opId)
+            return this.unacknowledgedSet.delete(key), { modified: !1 };
+          if (null != lastUpdateOpId) return { modified: !1 };
+        } else
+          source === exports.OpSource.REMOTE &&
+            this.unacknowledgedSet.delete(key);
         var reverse,
           previousValue = this._map.get(key);
         if (previousValue) {
@@ -1637,7 +1649,9 @@ var LiveMap = (function (_AbstractCrdt) {
               ((_updates3 = {}),
               (_updates3[key] = { type: "update" }),
               _updates3),
-          }),
+          });
+          var ops = item._serialize(this._id, key, this._doc);
+          this.unacknowledgedSet.set(key, nn(ops[0].opId)),
             this._doc.dispatch(
               item._serialize(this._id, key, this._doc),
               oldValue

package/shared.mjs

@@ -693,14 +693,14 @@ class LiveList extends AbstractCrdt {
       const parentKey = nn(child._parentKey),
         reverse = child._serialize(nn(this._id), parentKey, this._doc),
         indexToDelete = this._items.indexOf(child);
-      return (
-        this._items.splice(indexToDelete, 1),
-        child._detach(),
-        {
-          modified: makeUpdate(this, [deleteDelta(indexToDelete)]),
-          reverse: reverse,
-        }
-      );
+      return -1 === indexToDelete
+        ? { modified: !1 }
+        : (this._items.splice(indexToDelete, 1),
+          child._detach(),
+          {
+            modified: makeUpdate(this, [deleteDelta(indexToDelete)]),
+            reverse: reverse,
+          });
     }
     return { modified: !1 };
   }
@@ -1152,6 +1152,7 @@ class LiveMap extends AbstractCrdt {
         null === entries,
         "Support for calling `new LiveMap(null)` will be removed in @liveblocks/client 0.18. Please call as `new LiveMap()`, or `new LiveMap([])`."
       ),
+      (this.unacknowledgedSet = new Map()),
       entries)
     ) {
       const mappedEntries = [];
@@ -1196,12 +1197,19 @@ class LiveMap extends AbstractCrdt {
     for (const [_key, value] of this._map)
       isLiveNode(value) && value._attach(doc.generateId(), doc);
   }
-  _attachChild(op) {
+  _attachChild(op, source) {
     if (null == this._doc)
       throw new Error("Can't attach child if doc is not present");
-    const { id: id, parentKey: key } = op,
+    const { id: id, parentKey: parentKey, opId: opId } = op,
+      key = parentKey,
       child = creationOpToLiveNode(op);
     if (void 0 !== this._doc.getItem(id)) return { modified: !1 };
+    if (source === OpSource.ACK) {
+      const lastUpdateOpId = this.unacknowledgedSet.get(key);
+      if (lastUpdateOpId === opId)
+        return this.unacknowledgedSet.delete(key), { modified: !1 };
+      if (null != lastUpdateOpId) return { modified: !1 };
+    } else source === OpSource.REMOTE && this.unacknowledgedSet.delete(key);
     const previousValue = this._map.get(key);
     let reverse;
     if (previousValue) {
@@ -1272,7 +1280,9 @@ class LiveMap extends AbstractCrdt {
         node: this,
         type: "LiveMap",
         updates: { [key]: { type: "update" } },
-      }),
+      });
+      const ops = item._serialize(this._id, key, this._doc);
+      this.unacknowledgedSet.set(key, nn(ops[0].opId)),
         this._doc.dispatch(
           item._serialize(this._id, key, this._doc),
           oldValue