@liveblocks/react 0.16.0 → 0.16.1

package/lib/esm/index.js

@@ -1,14 +1,8 @@
-import { LiveMap, LiveList, LiveObject } from '@liveblocks/client';
 import * as React from 'react';
 import { useReducer } from 'react';
-
-function useRerender() {
-  const [, update] = useReducer((x) => x + 1, 0);
-  return update;
-}
+import { LiveMap, LiveList, LiveObject } from '@liveblocks/client';
 
 const ClientContext = React.createContext(null);
-const RoomContext = React.createContext(null);
 function LiveblocksProvider(props) {
   return /* @__PURE__ */ React.createElement(ClientContext.Provider, {
     value: props.client
@@ -21,6 +15,13 @@ function useClient() {
   }
   return client;
 }
+
+function useRerender() {
+  const [, update] = useReducer((x) => x + 1, 0);
+  return update;
+}
+
+const RoomContext = React.createContext(null);
 function RoomProvider({
   id,
   children,
@@ -36,16 +37,21 @@ function RoomProvider({
     }
   }
   const client = useClient();
+  const [room, setRoom] = React.useState(client.enter(id, {
+    defaultPresence: defaultPresence ? defaultPresence() : void 0,
+    defaultStorageRoot,
+    DO_NOT_USE_withoutConnecting: typeof window === "undefined"
+  }));
   React.useEffect(() => {
+    setRoom(client.enter(id, {
+      defaultPresence: defaultPresence ? defaultPresence() : void 0,
+      defaultStorageRoot,
+      DO_NOT_USE_withoutConnecting: typeof window === "undefined"
+    }));
     return () => {
       client.leave(id);
     };
   }, [client, id]);
-  const room = client.getRoom(id) || client.enter(id, {
-    defaultPresence: defaultPresence ? defaultPresence() : void 0,
-    defaultStorageRoot,
-    DO_NOT_USE_withoutConnecting: typeof window === "undefined"
-  });
   return /* @__PURE__ */ React.createElement(RoomContext.Provider, {
     value: room
   }, children);
@@ -207,4 +213,4 @@ function useCrdt(key, initialCrdt) {
   return (_a = root == null ? void 0 : root.get(key)) != null ? _a : null;
 }
 
-export { LiveblocksProvider, RoomProvider, useBatch, useBroadcastEvent, useErrorListener, useEventListener, useHistory, useList, useMap, useMyPresence, useObject, useOthers, useRedo, useRoom, useSelf, useStorage, useUndo, useUpdateMyPresence };
+export { LiveblocksProvider, RoomProvider, useBatch, useBroadcastEvent, useClient, useErrorListener, useEventListener, useHistory, useList, useMap, useMyPresence, useObject, useOthers, useRedo, useRoom, useSelf, useStorage, useUndo, useUpdateMyPresence };

package/lib/esm/index.mjs

@@ -1,14 +1,8 @@
-import { LiveMap, LiveList, LiveObject } from '@liveblocks/client';
 import * as React from 'react';
 import { useReducer } from 'react';
-
-function useRerender() {
-  const [, update] = useReducer((x) => x + 1, 0);
-  return update;
-}
+import { LiveMap, LiveList, LiveObject } from '@liveblocks/client';
 
 const ClientContext = React.createContext(null);
-const RoomContext = React.createContext(null);
 function LiveblocksProvider(props) {
   return /* @__PURE__ */ React.createElement(ClientContext.Provider, {
     value: props.client
@@ -21,6 +15,13 @@ function useClient() {
   }
   return client;
 }
+
+function useRerender() {
+  const [, update] = useReducer((x) => x + 1, 0);
+  return update;
+}
+
+const RoomContext = React.createContext(null);
 function RoomProvider({
   id,
   children,
@@ -36,16 +37,21 @@ function RoomProvider({
     }
   }
   const client = useClient();
+  const [room, setRoom] = React.useState(client.enter(id, {
+    defaultPresence: defaultPresence ? defaultPresence() : void 0,
+    defaultStorageRoot,
+    DO_NOT_USE_withoutConnecting: typeof window === "undefined"
+  }));
   React.useEffect(() => {
+    setRoom(client.enter(id, {
+      defaultPresence: defaultPresence ? defaultPresence() : void 0,
+      defaultStorageRoot,
+      DO_NOT_USE_withoutConnecting: typeof window === "undefined"
+    }));
     return () => {
       client.leave(id);
     };
   }, [client, id]);
-  const room = client.getRoom(id) || client.enter(id, {
-    defaultPresence: defaultPresence ? defaultPresence() : void 0,
-    defaultStorageRoot,
-    DO_NOT_USE_withoutConnecting: typeof window === "undefined"
-  });
   return /* @__PURE__ */ React.createElement(RoomContext.Provider, {
     value: room
   }, children);
@@ -207,4 +213,4 @@ function useCrdt(key, initialCrdt) {
   return (_a = root == null ? void 0 : root.get(key)) != null ? _a : null;
 }
 
-export { LiveblocksProvider, RoomProvider, useBatch, useBroadcastEvent, useErrorListener, useEventListener, useHistory, useList, useMap, useMyPresence, useObject, useOthers, useRedo, useRoom, useSelf, useStorage, useUndo, useUpdateMyPresence };
+export { LiveblocksProvider, RoomProvider, useBatch, useBroadcastEvent, useClient, useErrorListener, useEventListener, useHistory, useList, useMap, useMyPresence, useObject, useOthers, useRedo, useRoom, useSelf, useStorage, useUndo, useUpdateMyPresence };

package/lib/index.d.ts

@@ -1,6 +1,6 @@
-import { Room, Presence, Others, BroadcastOptions, Json, User, LiveObject, Lson, LiveMap, LiveList, LsonObject, History, Client } from '@liveblocks/client';
-export { Json, JsonObject } from '@liveblocks/client';
 import * as React from 'react';
+import { Client, Room, Presence, Others, BroadcastOptions, Json, User, LiveObject, Lson, LiveMap, LiveList, LsonObject, History } from '@liveblocks/client';
+export { Json, JsonObject } from '@liveblocks/client';
 
 declare type LiveblocksProviderProps = {
     children: React.ReactNode;
@@ -10,6 +10,12 @@ declare type LiveblocksProviderProps = {
  * Makes the Liveblocks client available in the component hierarchy below.
  */
 declare function LiveblocksProvider(props: LiveblocksProviderProps): JSX.Element;
+/**
+ * Returns the Client of the nearest LiveblocksProvider above in the React
+ * component tree.
+ */
+declare function useClient(): Client;
+
 declare type RoomProviderProps<TStorageRoot> = {
     /**
      * The id of the room you want to connect to
@@ -30,7 +36,8 @@ declare type RoomProviderProps<TStorageRoot> = {
  */
 declare function RoomProvider<TStorageRoot>({ id, children, defaultPresence, defaultStorageRoot, }: RoomProviderProps<TStorageRoot>): JSX.Element;
 /**
- * Returns the room of the nearest RoomProvider above in the react component tree
+ * Returns the Room of the nearest RoomProvider above in the React component
+ * tree.
  */
 declare function useRoom(): Room;
 /**
@@ -201,4 +208,4 @@ declare function useBatch(): (callback: () => void) => void;
  */
 declare function useHistory(): History;
 
-export { LiveblocksProvider, RoomProvider, useBatch, useBroadcastEvent, useErrorListener, useEventListener, useHistory, useList, useMap, useMyPresence, useObject, useOthers, useRedo, useRoom, useSelf, useStorage, useUndo, useUpdateMyPresence };
+export { LiveblocksProvider, RoomProvider, useBatch, useBroadcastEvent, useClient, useErrorListener, useEventListener, useHistory, useList, useMap, useMyPresence, useObject, useOthers, useRedo, useRoom, useSelf, useStorage, useUndo, useUpdateMyPresence };

package/lib/index.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var client = require('@liveblocks/client');
 var React = require('react');
+var client = require('@liveblocks/client');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -25,6 +25,22 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
+var ClientContext = React__namespace.createContext(null);
+function LiveblocksProvider(props) {
+  return React__namespace.createElement(ClientContext.Provider, {
+    value: props.client
+  }, props.children);
+}
+function useClient() {
+  var client = React__namespace.useContext(ClientContext);
+
+  if (client == null) {
+    throw new Error("LiveblocksProvider is missing from the react tree");
+  }
+
+  return client;
+}
+
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
   try {
     var info = gen[key](arg);
@@ -70,24 +86,7 @@ function useRerender() {
   return update;
 }
 
-var ClientContext = React__namespace.createContext(null);
 var RoomContext = React__namespace.createContext(null);
-function LiveblocksProvider(props) {
-  return React__namespace.createElement(ClientContext.Provider, {
-    value: props.client
-  }, props.children);
-}
-
-function useClient() {
-  var client = React__namespace.useContext(ClientContext);
-
-  if (client == null) {
-    throw new Error("LiveblocksProvider is missing from the react tree");
-  }
-
-  return client;
-}
-
 function RoomProvider(_ref) {
   var id = _ref.id,
       children = _ref.children,
@@ -105,16 +104,25 @@ function RoomProvider(_ref) {
   }
 
   var client = useClient();
+
+  var _React$useState = React__namespace.useState(client.enter(id, {
+    defaultPresence: defaultPresence ? defaultPresence() : undefined,
+    defaultStorageRoot: defaultStorageRoot,
+    DO_NOT_USE_withoutConnecting: typeof window === "undefined"
+  })),
+      room = _React$useState[0],
+      setRoom = _React$useState[1];
+
   React__namespace.useEffect(function () {
+    setRoom(client.enter(id, {
+      defaultPresence: defaultPresence ? defaultPresence() : undefined,
+      defaultStorageRoot: defaultStorageRoot,
+      DO_NOT_USE_withoutConnecting: typeof window === "undefined"
+    }));
     return function () {
       client.leave(id);
     };
   }, [client, id]);
-  var room = client.getRoom(id) || client.enter(id, {
-    defaultPresence: defaultPresence ? defaultPresence() : undefined,
-    defaultStorageRoot: defaultStorageRoot,
-    DO_NOT_USE_withoutConnecting: typeof window === "undefined"
-  });
   return React__namespace.createElement(RoomContext.Provider, {
     value: room
   }, children);
@@ -222,9 +230,9 @@ function useSelf() {
 function useStorage() {
   var room = useRoom();
 
-  var _React$useState = React__namespace.useState(null),
-      root = _React$useState[0],
-      setState = _React$useState[1];
+  var _React$useState2 = React__namespace.useState(null),
+      root = _React$useState2[0],
+      setState = _React$useState2[1];
 
   React__namespace.useEffect(function () {
     var didCancel = false;
@@ -336,6 +344,7 @@ exports.LiveblocksProvider = LiveblocksProvider;
 exports.RoomProvider = RoomProvider;
 exports.useBatch = useBatch;
 exports.useBroadcastEvent = useBroadcastEvent;
+exports.useClient = useClient;
 exports.useErrorListener = useErrorListener;
 exports.useEventListener = useEventListener;
 exports.useHistory = useHistory;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liveblocks/react",
-  "version": "0.16.0",
+  "version": "0.16.1",
   "description": "A set of React hooks and providers to use Liveblocks declaratively.",
   "main": "./lib/index.js",
   "types": "./lib/index.d.ts",
@@ -33,7 +33,7 @@
   },
   "license": "Apache-2.0",
   "peerDependencies": {
-    "@liveblocks/client": "0.16.0",
+    "@liveblocks/client": "0.16.1",
     "react": "^16.14.0 || ^17 || ^18"
   },
   "devDependencies": {
@@ -45,7 +45,7 @@
     "@rollup/plugin-node-resolve": "^11.2.1",
     "@rollup/plugin-typescript": "^8.3.1",
     "@testing-library/jest-dom": "^5.11.9",
-    "@testing-library/react": "^11.2.5",
+    "@testing-library/react": "^13.1.1",
     "@types/jest": "^26.0.20",
     "@types/react": "^16.14.0",
     "@types/react-dom": "^17.0.14",