@liveblocks/client 0.14.0-beta.1 → 0.14.2

package/lib/cjs/types.d.ts

@@ -28,6 +28,14 @@ export declare type LiveListUpdates<TItem = any> = {
     type: "LiveList";
     node: LiveList<TItem>;
 };
+export declare type BroadcastOptions = {
+    /**
+     * Whether or not event is queued if the connection is currently closed.
+     *
+     * ❗ We are not sure if we want to support this option in the future so it might be deprecated to be replaced by something else
+     */
+    shouldQueueEventIfNotReady: boolean;
+};
 export declare type StorageUpdate = LiveMapUpdates | LiveObjectUpdates | LiveListUpdates;
 export declare type StorageCallback = (updates: StorageUpdate[]) => void;
 export declare type Client = {
@@ -65,6 +73,10 @@ export interface Others<TPresence extends Presence = Presence> {
      * Number of other users in the room.
      */
     readonly count: number;
+    /**
+     * Returns a new Iterator object that contains the users.
+     */
+    [Symbol.iterator](): IterableIterator<User<TPresence>>;
     /**
      * Returns the array of connected users in room.
      */
@@ -109,6 +121,8 @@ export declare type AuthEndpoint = string | AuthEndpointCallback;
  */
 export declare type ClientOptions = {
     throttle?: number;
+    fetchPolyfill?: any;
+    WebSocketPolyfill?: any;
 } & ({
     publicApiKey: string;
     authEndpoint?: never;
@@ -119,6 +133,17 @@ export declare type ClientOptions = {
 export declare type AuthorizeResponse = {
     token: string;
 };
+export declare type Authentication = {
+    type: "public";
+    publicApiKey: string;
+    url: string;
+} | {
+    type: "private";
+    url: string;
+} | {
+    type: "custom";
+    callback: (room: string) => Promise<AuthorizeResponse>;
+};
 declare type ConnectionState = "closed" | "authenticating" | "unavailable" | "failed" | "open" | "connecting";
 export declare type Connection = {
     state: "closed" | "authenticating" | "unavailable" | "failed";
@@ -423,7 +448,7 @@ export declare type Room = {
      *   }
      * });
      */
-    broadcastEvent: (event: any) => void;
+    broadcastEvent: (event: any, options?: BroadcastOptions) => void;
     /**
      * Get the room's storage asynchronously.
      * The storage's root is a {@link LiveObject}.

package/lib/esm/AbstractCrdt.d.ts

@@ -8,6 +8,7 @@ export declare type ApplyResult = {
 export interface Doc {
     generateId: () => string;
     generateOpId: () => string;
+    getItem: (id: string) => AbstractCrdt | undefined;
     addItem: (id: string, item: AbstractCrdt) => void;
     deleteItem: (id: string) => void;
     dispatch: (ops: Op[], reverseOps: Op[], modified: AbstractCrdt[]) => void;
@@ -45,7 +46,7 @@ export declare abstract class AbstractCrdt {
     /**
      * INTERNAL
      */
-    abstract _attachChild(id: string, key: string, crdt: AbstractCrdt, isLocal: boolean): ApplyResult;
+    abstract _attachChild(id: string, key: string, crdt: AbstractCrdt, opId: string, isLocal: boolean): ApplyResult;
     /**
      * INTERNAL
      */

package/lib/esm/LiveList.d.ts

@@ -25,7 +25,7 @@ export declare class LiveList<T> extends AbstractCrdt {
     /**
      * INTERNAL
      */
-    _attachChild(id: string, key: string, child: AbstractCrdt, isLocal: boolean): ApplyResult;
+    _attachChild(id: string, key: string, child: AbstractCrdt, opId: string, isLocal: boolean): ApplyResult;
     /**
      * INTERNAL
      */
@@ -68,6 +68,7 @@ export declare class LiveList<T> extends AbstractCrdt {
      * @param index The index of the element to delete
      */
     delete(index: number): void;
+    clear(): void;
     /**
      * Returns an Array of all the elements in the LiveList.
      */

package/lib/esm/LiveList.js

@@ -93,11 +93,14 @@ export class LiveList extends AbstractCrdt {
     /**
      * INTERNAL
      */
-    _attachChild(id, key, child, isLocal) {
+    _attachChild(id, key, child, opId, isLocal) {
         var _a;
         if (this._doc == null) {
             throw new Error("Can't attach child if doc is not present");
         }
+        if (this._doc.getItem(id) !== undefined) {
+            return { modified: false };
+        }
         child._attach(id, this._doc);
         child._setParentLink(this, key);
         const index = __classPrivateFieldGet(this, _LiveList_items, "f").findIndex((entry) => entry[1] === key);
@@ -280,6 +283,28 @@ export class LiveList extends AbstractCrdt {
             }
         }
     }
+    clear() {
+        if (this._doc) {
+            let ops = [];
+            let reverseOps = [];
+            for (const item of __classPrivateFieldGet(this, _LiveList_items, "f")) {
+                item[0]._detach();
+                const childId = item[0]._id;
+                if (childId) {
+                    ops.push({ id: childId, type: OpType.DeleteCrdt });
+                    reverseOps.push(...item[0]._serialize(this._id, item[1]));
+                }
+            }
+            __classPrivateFieldSet(this, _LiveList_items, [], "f");
+            this._doc.dispatch(ops, reverseOps, [this]);
+        }
+        else {
+            for (const item of __classPrivateFieldGet(this, _LiveList_items, "f")) {
+                item[0]._detach();
+            }
+            __classPrivateFieldSet(this, _LiveList_items, [], "f");
+        }
+    }
     /**
      * Returns an Array of all the elements in the LiveList.
      */

package/lib/esm/LiveMap.d.ts

@@ -23,7 +23,7 @@ export declare class LiveMap<TKey extends string, TValue> extends AbstractCrdt {
     /**
      * INTERNAL
      */
-    _attachChild(id: string, key: TKey, child: AbstractCrdt, isLocal: boolean): ApplyResult;
+    _attachChild(id: string, key: TKey, child: AbstractCrdt, opId: string, isLocal: boolean): ApplyResult;
     /**
      * INTERNAL
      */

package/lib/esm/LiveMap.js

@@ -97,10 +97,13 @@ export class LiveMap extends AbstractCrdt {
     /**
      * INTERNAL
      */
-    _attachChild(id, key, child, isLocal) {
+    _attachChild(id, key, child, opId, isLocal) {
         if (this._doc == null) {
             throw new Error("Can't attach child if doc is not present");
         }
+        if (this._doc.getItem(id) !== undefined) {
+            return { modified: false };
+        }
         const previousValue = __classPrivateFieldGet(this, _LiveMap_map, "f").get(key);
         let reverse;
         if (previousValue) {

package/lib/esm/LiveObject.d.ts

@@ -27,7 +27,7 @@ export declare class LiveObject<T extends Record<string, any> = Record<string, a
     /**
      * INTERNAL
      */
-    _attachChild(id: string, key: keyof T, child: AbstractCrdt, isLocal: boolean): ApplyResult;
+    _attachChild(id: string, key: keyof T, child: AbstractCrdt, opId: string, isLocal: boolean): ApplyResult;
     /**
      * INTERNAL
      */

package/lib/esm/LiveObject.js

@@ -103,10 +103,32 @@ export class LiveObject extends AbstractCrdt {
     /**
      * INTERNAL
      */
-    _attachChild(id, key, child, isLocal) {
+    _attachChild(id, key, child, opId, isLocal) {
         if (this._doc == null) {
             throw new Error("Can't attach child if doc is not present");
         }
+        if (this._doc.getItem(id) !== undefined) {
+            if (__classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").get(key) === opId) {
+                // Acknowlegment from local operation
+                __classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").delete(key);
+            }
+            return { modified: false };
+        }
+        if (isLocal) {
+            __classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").set(key, opId);
+        }
+        else if (__classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").get(key) === undefined) {
+            // Remote operation with no local change => apply operation
+        }
+        else if (__classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").get(key) === opId) {
+            // Acknowlegment from local operation
+            __classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").delete(key);
+            return { modified: false };
+        }
+        else {
+            // Conflict, ignore remote operation
+            return { modified: false };
+        }
         const previousValue = __classPrivateFieldGet(this, _LiveObject_map, "f").get(key);
         let reverse;
         if (isCrdt(previousValue)) {
@@ -281,7 +303,6 @@ export class LiveObject extends AbstractCrdt {
             data: {},
         };
         for (const key in overrides) {
-            __classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").set(key, opId);
             const oldValue = __classPrivateFieldGet(this, _LiveObject_map, "f").get(key);
             if (oldValue instanceof AbstractCrdt) {
                 reverseOps.push(...oldValue._serialize(this._id, key));
@@ -297,10 +318,16 @@ export class LiveObject extends AbstractCrdt {
             if (newValue instanceof AbstractCrdt) {
                 newValue._setParentLink(this, key);
                 newValue._attach(this._doc.generateId(), this._doc);
-                ops.push(...newValue._serialize(this._id, key, this._doc));
+                const newAttachChildOps = newValue._serialize(this._id, key, this._doc);
+                const createCrdtOp = newAttachChildOps.find((op) => op.parentId === this._id);
+                if (createCrdtOp) {
+                    __classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").set(key, createCrdtOp.opId);
+                }
+                ops.push(...newAttachChildOps);
             }
             else {
                 updatedProps[key] = newValue;
+                __classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").set(key, opId);
             }
             __classPrivateFieldGet(this, _LiveObject_map, "f").set(key, newValue);
         }
@@ -374,6 +401,11 @@ _LiveObject_map = new WeakMap(), _LiveObject_propToLastUpdate = new WeakMap(), _
     if (__classPrivateFieldGet(this, _LiveObject_map, "f").has(key) === false) {
         return { modified: false };
     }
+    // If a local operation exists on the same key
+    // prevent flickering by not applying delete op.
+    if (__classPrivateFieldGet(this, _LiveObject_propToLastUpdate, "f").get(key) !== undefined) {
+        return { modified: false };
+    }
     const oldValue = __classPrivateFieldGet(this, _LiveObject_map, "f").get(key);
     let reverse = [];
     if (isCrdt(oldValue)) {

package/lib/esm/LiveRegister.d.ts

@@ -19,7 +19,7 @@ export declare class LiveRegister<TValue = any> extends AbstractCrdt {
      * INTERNAL
      */
     _toSerializedCrdt(): SerializedCrdt;
-    _attachChild(id: string, key: string, crdt: AbstractCrdt, isLocal: boolean): ApplyResult;
+    _attachChild(id: string, key: string, crdt: AbstractCrdt, opId: string, isLocal: boolean): ApplyResult;
     _detachChild(crdt: AbstractCrdt): void;
     _apply(op: Op, isLocal: boolean): ApplyResult;
 }

package/lib/esm/LiveRegister.js

@@ -65,7 +65,7 @@ export class LiveRegister extends AbstractCrdt {
             data: this.data,
         };
     }
-    _attachChild(id, key, crdt, isLocal) {
+    _attachChild(id, key, crdt, opId, isLocal) {
         throw new Error("Method not implemented.");
     }
     _detachChild(crdt) {

package/lib/esm/client.js

@@ -26,11 +26,7 @@ import { createRoom } from "./room";
  */
 export function createClient(options) {
     const clientOptions = options;
-    if (typeof clientOptions.throttle === "number") {
-        if (clientOptions.throttle < 80 || clientOptions.throttle > 1000) {
-            throw new Error("Liveblocks client throttle should be between 80 and 1000 ms");
-        }
-    }
+    const throttleDelay = getThrottleDelayFromOptions(options);
     const rooms = new Map();
     function getRoom(roomId) {
         const internalRoom = rooms.get(roomId);
@@ -41,9 +37,21 @@ export function createClient(options) {
         if (internalRoom) {
             return internalRoom.room;
         }
-        internalRoom = createRoom(roomId, Object.assign(Object.assign({}, clientOptions), options));
+        internalRoom = createRoom({
+            defaultPresence: options.defaultPresence,
+            defaultStorageRoot: options.defaultStorageRoot,
+        }, {
+            room: roomId,
+            throttleDelay,
+            WebSocketPolyfill: clientOptions.WebSocketPolyfill,
+            fetchPolyfill: clientOptions.fetchPolyfill,
+            liveblocksServer: clientOptions.liveblocksServer || "wss://liveblocks.net/v5",
+            authentication: prepareAuthentication(clientOptions),
+        });
         rooms.set(roomId, internalRoom);
-        internalRoom.connect();
+        if (!options.DO_NOT_USE_withoutConnecting) {
+            internalRoom.connect();
+        }
         return internalRoom.room;
     }
     function leave(roomId) {
@@ -74,3 +82,38 @@ export function createClient(options) {
         leave,
     };
 }
+function getThrottleDelayFromOptions(options) {
+    if (options.throttle === undefined) {
+        return 100;
+    }
+    if (typeof options.throttle !== "number" ||
+        options.throttle < 80 ||
+        options.throttle > 1000) {
+        throw new Error("throttle should be a number between 80 and 1000.");
+    }
+    return options.throttle;
+}
+function prepareAuthentication(clientOptions) {
+    // TODO: throw descriptive errors for invalid options
+    if (typeof clientOptions.publicApiKey === "string") {
+        return {
+            type: "public",
+            publicApiKey: clientOptions.publicApiKey,
+            url: clientOptions.publicAuthorizeEndpoint ||
+                "https://liveblocks.io/api/public/authorize",
+        };
+    }
+    else if (typeof clientOptions.authEndpoint === "string") {
+        return {
+            type: "private",
+            url: clientOptions.authEndpoint,
+        };
+    }
+    else if (typeof clientOptions.authEndpoint === "function") {
+        return {
+            type: "custom",
+            callback: clientOptions.authEndpoint,
+        };
+    }
+    throw new Error("Invalid Liveblocks client options. For more information: https://liveblocks.io/docs/api-reference/liveblocks-client#createClient");
+}

package/lib/esm/index.d.ts

@@ -1,5 +1,5 @@
 export { LiveObject } from "./LiveObject";
 export { LiveMap } from "./LiveMap";
 export { LiveList } from "./LiveList";
-export type { Others, Presence, Room, Client, User } from "./types";
+export type { Others, Presence, Room, Client, User, BroadcastOptions, } from "./types";
 export { createClient } from "./client";

package/lib/esm/room.d.ts

@@ -1,4 +1,4 @@
-import { Others, Presence, ClientOptions, Room, MyPresenceCallback, OthersEventCallback, AuthEndpoint, EventCallback, User, Connection, ErrorCallback, AuthenticationToken, ConnectionCallback, StorageCallback, StorageUpdate } from "./types";
+import { Others, Presence, Room, MyPresenceCallback, OthersEventCallback, EventCallback, User, Connection, ErrorCallback, AuthenticationToken, ConnectionCallback, StorageCallback, StorageUpdate, BroadcastOptions, AuthorizeResponse, Authentication } from "./types";
 import { ClientMessage, Op } from "./live";
 import { LiveMap } from "./LiveMap";
 import { LiveObject } from "./LiveObject";
@@ -66,7 +66,7 @@ export declare type State = {
     offlineOperations: Map<string, Op>;
 };
 export declare type Effects = {
-    authenticate(): void;
+    authenticate(auth: (room: string) => Promise<AuthorizeResponse>, createWebSocket: (token: string) => WebSocket): void;
     send(messages: ClientMessage[]): void;
     delayFlush(delay: number): number;
     startHeartbeatInterval(): number;
@@ -75,13 +75,13 @@ export declare type Effects = {
 };
 declare type Context = {
     room: string;
-    authEndpoint: AuthEndpoint;
-    liveblocksServer: string;
     throttleDelay: number;
-    publicApiKey?: string;
+    fetchPolyfill?: typeof fetch;
+    WebSocketPolyfill?: typeof WebSocket;
+    authentication: Authentication;
+    liveblocksServer: string;
 };
 export declare function makeStateMachine(state: State, context: Context, mockedEffects?: Effects): {
-    onOpen: () => void;
     onClose: (event: {
         code: number;
         wasClean: boolean;
@@ -126,7 +126,7 @@ export declare function makeStateMachine(state: State, context: Context, mockedE
     updatePresence: <T_4 extends Presence>(overrides: Partial<T_4>, options?: {
         addToHistory: boolean;
     } | undefined) => void;
-    broadcastEvent: (event: any) => void;
+    broadcastEvent: (event: any, options?: BroadcastOptions) => void;
     batch: (callback: () => void) => void;
     undo: () => void;
     redo: () => void;
@@ -152,8 +152,8 @@ export declare type InternalRoom = {
     onNavigatorOnline: () => void;
     onVisibilityChange: (visibilityState: VisibilityState) => void;
 };
-export declare function createRoom(name: string, options: ClientOptions & {
+export declare function createRoom(options: {
     defaultPresence?: Presence;
     defaultStorageRoot?: Record<string, any>;
-}): InternalRoom;
+}, context: Context): InternalRoom;
 export {};