@liveblocks/zustand 0.18.5 → 0.19.0-beta0

package/dist/index.d.ts

@@ -1,14 +1,12 @@
 import { JsonObject, LsonObject, BaseUserMeta, Json, Room, User, Client } from '@liveblocks/client';
-import { StateCreator, SetState, GetState, StoreApi } from 'zustand';
+import { StoreMutatorIdentifier, StateCreator } from 'zustand';
 
-declare type ZustandState = Record<string, unknown>;
-declare type LiveblocksContext<TState extends ZustandState, TPresence extends JsonObject, TStorage extends LsonObject, TUserMeta extends BaseUserMeta, TRoomEvent extends Json> = {
+declare type LiveblocksContext<TPresence extends JsonObject, TStorage extends LsonObject, TUserMeta extends BaseUserMeta, TRoomEvent extends Json> = {
     /**
      * Enters a room and starts sync it with zustand state
      * @param roomId The id of the room
-     * @param initialState The initial state of the room storage. If a key does not exist if your room storage root, initialState[key] will be used.
      */
-    readonly enterRoom: (roomId: string, initialState: Partial<TState>) => void;
+    readonly enterRoom: (roomId: string) => void;
     /**
      * Leaves a room and stops sync it with zustand state.
      * @param roomId The id of the room
@@ -31,11 +29,15 @@ declare type LiveblocksContext<TState extends ZustandState, TPresence extends Js
      */
     readonly connection: "closed" | "authenticating" | "unavailable" | "failed" | "open" | "connecting";
 };
-declare type LiveblocksState<TState extends ZustandState, TPresence extends JsonObject = JsonObject, TStorage extends LsonObject = LsonObject, TUserMeta extends BaseUserMeta = BaseUserMeta, TRoomEvent extends Json = Json> = TState & {
-    /**
-     * Liveblocks extra state attached by the middleware
-     */
-    readonly liveblocks: LiveblocksContext<TState, TPresence, TStorage, TUserMeta, TRoomEvent>;
+/**
+ * @deprecated Renamed to WithLiveblocks<...>
+ */
+declare type LiveblocksState<TState, TPresence extends JsonObject = JsonObject, TStorage extends LsonObject = LsonObject, TUserMeta extends BaseUserMeta = BaseUserMeta, TRoomEvent extends Json = Json> = WithLiveblocks<TState, TPresence, TStorage, TUserMeta, TRoomEvent>;
+/**
+ * Adds the `liveblocks` property to your custom Zustand state.
+ */
+declare type WithLiveblocks<TState, TPresence extends JsonObject = JsonObject, TStorage extends LsonObject = LsonObject, TUserMeta extends BaseUserMeta = BaseUserMeta, TRoomEvent extends Json = Json> = TState & {
+    readonly liveblocks: LiveblocksContext<TPresence, TStorage, TUserMeta, TRoomEvent>;
 };
 declare type Mapping<T> = {
     [K in keyof T]?: boolean;
@@ -54,6 +56,11 @@ declare type Options<T> = {
      */
     presenceMapping?: Mapping<T>;
 };
-declare function middleware<T extends ZustandState, TPresence extends JsonObject = JsonObject, TStorage extends LsonObject = LsonObject, TUserMeta extends BaseUserMeta = BaseUserMeta, TRoomEvent extends Json = Json>(config: StateCreator<T, SetState<T>, GetState<LiveblocksState<T, TPresence, TStorage, TUserMeta, TRoomEvent>>, StoreApi<T>>, options: Options<T>): StateCreator<LiveblocksState<T, TPresence, TStorage, TUserMeta, TRoomEvent>, SetState<LiveblocksState<T, TPresence, TStorage, TUserMeta, TRoomEvent>>, GetState<LiveblocksState<T, TPresence, TStorage, TUserMeta, TRoomEvent>>, StoreApi<LiveblocksState<T, TPresence, TStorage, TUserMeta, TRoomEvent>>>;
+declare type OuterLiveblocksMiddleware = <TState, Mps extends [StoreMutatorIdentifier, unknown][] = [], Mcs extends [StoreMutatorIdentifier, unknown][] = []>(config: StateCreator<TState, Mps, Mcs, Omit<TState, "liveblocks">>, options: Options<Omit<TState, "liveblocks">>) => StateCreator<TState, Mps, Mcs, TState>;
+declare const liveblocks: OuterLiveblocksMiddleware;
+/**
+ * @deprecated Renamed to `liveblocks`.
+ */
+declare const middleware: OuterLiveblocksMiddleware;
 
-export { LiveblocksContext, LiveblocksState, Mapping, ZustandState, middleware };
+export { LiveblocksContext, LiveblocksState, Mapping, WithLiveblocks, liveblocks, middleware };

package/dist/index.js

@@ -17,6 +17,18 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 
 // src/index.ts
 
@@ -31,36 +43,34 @@ function mappingToFunctionIsNotAllowed(key) {
     `${ERROR_PREFIX} mapping.${key} is invalid. Mapping to a function is not allowed.`
   );
 }
-function isJson(value) {
-  return value === null || typeof value === "string" || typeof value === "number" || typeof value === "boolean" || Array.isArray(value) && value.every(isJson) || typeof value === "object" && Object.values(value).every(isJson);
-}
-function middleware(config, options) {
+var middlewareImpl = (config, options) => {
   const { client, presenceMapping, storageMapping } = validateOptions(options);
   return (set, get, api) => {
-    const typedSet = set;
-    let room = null;
+    let maybeRoom = null;
     let isPatching = false;
     let storageRoot = null;
     let unsubscribeCallbacks = [];
-    function enterRoom(roomId, initialState) {
+    function enterRoom(roomId) {
       if (storageRoot) {
         return;
       }
-      room = client.enter(roomId, { initialPresence: {} });
-      updateZustandLiveblocksState(set, {
-        isStorageLoading: true,
-        room
+      const initialPresence = selectFields(
+        get(),
+        presenceMapping
+      );
+      const room = client.enter(roomId, {
+        initialPresence
       });
-      const state = get();
-      broadcastInitialPresence(room, state, presenceMapping);
+      maybeRoom = room;
+      updateLiveblocksContext(set, { isStorageLoading: true, room });
       unsubscribeCallbacks.push(
         room.events.others.subscribe(({ others }) => {
-          updateZustandLiveblocksState(set, { others });
+          updateLiveblocksContext(set, { others });
         })
       );
       unsubscribeCallbacks.push(
         room.events.connection.subscribe(() => {
-          updateZustandLiveblocksState(set, {
+          updateLiveblocksContext(set, {
             connection: room.getConnectionState()
           });
         })
@@ -69,7 +79,10 @@ function middleware(config, options) {
         room.events.me.subscribe(() => {
           if (isPatching === false) {
             set(
-              patchPresenceState(room.getPresence(), presenceMapping)
+              selectFields(
+                room.getPresence(),
+                presenceMapping
+              )
             );
           }
         })
@@ -79,15 +92,17 @@ function middleware(config, options) {
         room.batch(() => {
           for (const key in storageMapping) {
             const liveblocksStatePart = root.get(key);
-            if (liveblocksStatePart == null) {
-              updates[key] = initialState[key];
-              _core.patchLiveObjectKey.call(void 0, root, key, void 0, initialState[key]);
+            if (liveblocksStatePart === void 0) {
+              updates[key] = get()[key];
+              _core.patchLiveObjectKey.call(void 0, root, key, void 0, get()[key]);
             } else {
-              updates[key] = _core.lsonToJson.call(void 0, liveblocksStatePart);
+              updates[key] = _core.lsonToJson.call(void 0, 
+                liveblocksStatePart
+              );
             }
           }
         });
-        typedSet(updates);
+        set(updates);
         storageRoot = root;
         unsubscribeCallbacks.push(
           room.subscribe(
@@ -100,7 +115,9 @@ function middleware(config, options) {
             { isDeep: true }
           )
         );
-        updateZustandLiveblocksState(set, { isStorageLoading: false });
+        updateLiveblocksContext(set, {
+          isStorageLoading: false
+        });
       });
     }
     function leaveRoom(roomId) {
@@ -108,11 +125,11 @@ function middleware(config, options) {
         unsubscribe();
       }
       storageRoot = null;
-      room = null;
+      maybeRoom = null;
       isPatching = false;
       unsubscribeCallbacks = [];
       client.leave(roomId);
-      updateZustandLiveblocksState(set, {
+      updateLiveblocksContext(set, {
         others: [],
         connection: "closed",
         isStorageLoading: false,
@@ -121,17 +138,13 @@ function middleware(config, options) {
     }
     const store = config(
       (args) => {
-        const oldState = get();
+        const _a = get(), { liveblocks: _ } = _a, oldState = __objRest(_a, ["liveblocks"]);
         set(args);
-        const newState = get();
-        if (room) {
+        const _b = get(), { liveblocks: __ } = _b, newState = __objRest(_b, ["liveblocks"]);
+        if (maybeRoom) {
+          const room = maybeRoom;
           isPatching = true;
-          updatePresence(
-            room,
-            oldState,
-            newState,
-            presenceMapping
-          );
+          updatePresence(room, oldState, newState, presenceMapping);
           room.batch(() => {
             if (storageRoot) {
               patchLiveblocksStorage(
@@ -159,7 +172,9 @@ function middleware(config, options) {
       }
     });
   };
-}
+};
+var liveblocks = middlewareImpl;
+var middleware = liveblocks;
 function patchState(state, updates, mapping) {
   const partialState = {};
   for (const key in mapping) {
@@ -172,29 +187,26 @@ function patchState(state, updates, mapping) {
   }
   return result;
 }
-function patchPresenceState(presence, mapping) {
+function selectFields(presence, mapping) {
   const partialState = {};
   for (const key in mapping) {
     partialState[key] = presence[key];
   }
   return partialState;
 }
-function updateZustandLiveblocksState(set, partial) {
+function updateLiveblocksContext(set, partial) {
   set((state) => ({ liveblocks: __spreadValues(__spreadValues({}, state.liveblocks), partial) }));
 }
-function broadcastInitialPresence(room, state, mapping) {
-  for (const key in mapping) {
-    room == null ? void 0 : room.updatePresence({ [key]: state[key] });
-  }
-}
 function updatePresence(room, oldState, newState, presenceMapping) {
   for (const key in presenceMapping) {
     if (typeof newState[key] === "function") {
       throw mappingToFunctionIsNotAllowed(key);
     }
     if (oldState[key] !== newState[key]) {
-      const val = newState[key];
-      room.updatePresence({ [key]: val });
+      const val = newState == null ? void 0 : newState[key];
+      const patch = {};
+      patch[key] = val;
+      room.updatePresence(patch);
     }
   }
 }
@@ -206,9 +218,7 @@ function patchLiveblocksStorage(root, oldState, newState, mapping) {
     if (oldState[key] !== newState[key]) {
       const oldVal = oldState[key];
       const newVal = newState[key];
-      if ((oldVal === void 0 || isJson(oldVal)) && (newVal === void 0 || isJson(newVal))) {
-        _core.patchLiveObjectKey.call(void 0, root, key, oldVal, newVal);
-      }
+      _core.patchLiveObjectKey.call(void 0, root, key, oldVal, newVal);
     }
   }
 }
@@ -260,4 +270,5 @@ function validateOptions(options) {
 }
 
 
-exports.middleware = middleware;
+
+exports.liveblocks = liveblocks; exports.middleware = middleware;

package/dist/index.mjs

@@ -1,4 +1,5 @@
 import mod from "./index.js";
 
 export default mod;
+export const liveblocks = mod.liveblocks;
 export const middleware = mod.middleware;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liveblocks/zustand",
-  "version": "0.18.5",
+  "version": "0.19.0-beta0",
   "description": "A middleware to integrate Liveblocks into Zustand stores.",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -23,8 +23,8 @@
     "format": "eslint --fix src/ && prettier --write src/",
     "lint": "eslint src/",
     "test": "jest --silent --verbose",
-    "test:watch": "jest --silent --verbose --watch",
-    "dtslint": "dtslint --localTs node_modules/typescript/lib --expectOnly types"
+    "test:types": "tsd",
+    "test:watch": "jest --silent --verbose --watch"
   },
   "license": "Apache-2.0",
   "repository": {
@@ -33,19 +33,18 @@
     "directory": "packages/liveblocks-zustand"
   },
   "dependencies": {
-    "@liveblocks/client": "0.18.5",
-    "@liveblocks/core": "0.18.5"
+    "@liveblocks/client": "0.19.0-beta0",
+    "@liveblocks/core": "0.19.0-beta0"
   },
   "peerDependencies": {
-    "zustand": "^3"
+    "zustand": "^4.1.3"
   },
   "devDependencies": {
-    "@definitelytyped/dtslint": "^0.0.103",
     "@liveblocks/eslint-config": "*",
     "@liveblocks/jest-config": "*",
     "@testing-library/jest-dom": "^5.16.5",
     "msw": "^0.36.4",
-    "zustand": "^3.6.9"
+    "zustand": "^4.1.3"
   },
   "sideEffects": false
 }