@noya-app/noya-multiplayer-react 0.1.40 → 0.1.42

package/dist/index.mjs

@@ -78,16 +78,14 @@ var UserPointer_ = function UserPointer({
   const [, setForceUpdate] = useState(0);
   const updatedAt = metadata?.updatedAt ?? 0;
   useEffect(() => {
-    if (!shouldShow(hideAfter, updatedAt))
-      return;
+    if (!shouldShow(hideAfter, updatedAt)) return;
     const timeoutId = setTimeout(() => {
       setForceUpdate((prev) => prev + 1);
     }, hideAfter);
     return () => clearTimeout(timeoutId);
   }, [hideAfter, updatedAt]);
   const show = shouldShow(hideAfter, updatedAt);
-  if (!data || !data.pointer)
-    return null;
+  if (!data || !data.pointer) return null;
   return /* @__PURE__ */ React.createElement(UserPointerContainer, { key: user.id, point: data.pointer, show }, /* @__PURE__ */ React.createElement(UserPointerIcon, { color: avatarStyle.backgroundColor }), /* @__PURE__ */ React.createElement(UserNameTag, { background: avatarStyle.backgroundColor }, user.name));
 };
 var UserPointer2 = memo(UserPointer_);
@@ -143,8 +141,7 @@ var UserNameTag = memo(function UserNameTag2({
 var UserPointersOverlay = memo(function UserPointers({ connectedUsers, ephemeralUserData }) {
   const currentUserId = useObservable(ephemeralUserData.currentUserId$);
   return /* @__PURE__ */ React.createElement(React.Fragment, null, connectedUsers.map((user) => {
-    if (user.id === currentUserId)
-      return null;
+    if (user.id === currentUserId) return null;
     return /* @__PURE__ */ React.createElement(
       UserPointer2,
       {
@@ -586,8 +583,7 @@ var StateInspector = memo2(function StateInspector2({
     }
   }, [historySnapshot]);
   useEffect2(() => {
-    if (!historyContainerRef.current)
-      return;
+    if (!historyContainerRef.current) return;
     const historyEntry = historyContainerRef.current.querySelector(
       `#${HISTORY_ELEMENT_PREFIX}${historySnapshot.historyIndex}`
     );
@@ -619,8 +615,7 @@ var StateInspector = memo2(function StateInspector2({
     zIndex: 9999,
     lineHeight: "13px"
   };
-  if (!didMount)
-    return null;
+  if (!didMount) return null;
   if (!showInspector) {
     return /* @__PURE__ */ React4.createElement(
       "div",
@@ -689,14 +684,14 @@ var StateInspector = memo2(function StateInspector2({
             src: user.image,
             alt: user.name,
             style: {
-              width: "12px",
-              height: "12px",
+              width: "13px",
+              height: "13px",
               borderRadius: "50%",
               marginRight: "4px",
               display: "inline-block",
               position: "relative",
-              top: "-1px",
-              background: solidBorderColor
+              background: solidBorderColor,
+              verticalAlign: "middle"
             }
           }
         ),
@@ -873,7 +868,8 @@ var StateInspector = memo2(function StateInspector2({
             style: {
               fontSize: "11px",
               display: "flex",
-              flexWrap: "wrap"
+              flexWrap: "wrap",
+              margin: 0
             }
           },
           entry.metadata.name
@@ -885,7 +881,8 @@ var StateInspector = memo2(function StateInspector2({
             style: {
               fontSize: "11px",
               display: "flex",
-              flexWrap: "wrap"
+              flexWrap: "wrap",
+              margin: 0
             }
           },
           patch.op === "add" && /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement("span", { style: { fontStyle: "italic" } }, pathToString(patch.path)), " = ", /* @__PURE__ */ React4.createElement(ObjectInspector, { data: patch.value, theme })),
@@ -1098,8 +1095,7 @@ function pathToString(extendedPath) {
   ).join("");
 }
 function ellipsis(str, maxLength, position = "end") {
-  if (str.length <= maxLength)
-    return str;
+  if (str.length <= maxLength) return str;
   switch (position) {
     case "start":
       return `\u2026${str.slice(str.length - maxLength)}`;
@@ -1172,8 +1168,7 @@ function useStateInspector({
 }) {
   const [root, setRoot] = React5.useState(null);
   useLayoutEffect2(() => {
-    if (disabled)
-      return;
+    if (disabled) return;
     const { host, container } = createShadowRootElement();
     const root2 = createRoot(container);
     document.body.appendChild(host);
@@ -1183,8 +1178,7 @@ function useStateInspector({
     };
   }, [disabled]);
   useLayoutEffect2(() => {
-    if (!root)
-      return;
+    if (!root) return;
     root.render(
       /* @__PURE__ */ React5.createElement(
         StateInspector,
@@ -1291,8 +1285,7 @@ function throttle(fn, ms) {
   return (...args) => {
     const now = Date.now();
     if (now - lastCall < ms) {
-      if (timeoutId)
-        clearTimeout(timeoutId);
+      if (timeoutId) clearTimeout(timeoutId);
       timeoutId = setTimeout(
         () => {
           lastCall = now;
@@ -1431,8 +1424,7 @@ function useMultiplayerState(initialState, options) {
     });
   }, [multiplayerStateManager]);
   useEffect3(() => {
-    if (!unrecoverableError)
-      return;
+    if (!unrecoverableError) return;
     const el = document.createElement("div");
     el.id = "noya-multiplayer-react-error-overlay";
     document.body.appendChild(el);
@@ -1487,13 +1479,11 @@ function enforceSchema(initialState, schema) {
 function parseAppDataParameter(options) {
   const window2 = options?.window ?? globalThis;
   const location = window2.location;
-  if (!location)
-    return null;
+  if (!location) return null;
   const urlHash = (location.hash || "").replace(/^#/, "");
   const params = new URLSearchParams(urlHash);
   const data = params.get("data");
-  if (!data)
-    return null;
+  if (!data) return null;
   try {
     return JSON.parse(data);
   } catch (e) {
@@ -1511,8 +1501,7 @@ function getAppData(initialState, schema, options) {
 }
 function useBroadcastConnectedUsers(connectedUsers) {
   useEffect4(() => {
-    if (!isEmbeddedApp())
-      return;
+    if (!isEmbeddedApp()) return;
     const message = {
       type: "multiplayer.setUsers",
       payload: { users: connectedUsers }
@@ -1522,8 +1511,7 @@ function useBroadcastConnectedUsers(connectedUsers) {
 }
 function useBroadcastMenuItems(menuItems, handleSelectMenuItem) {
   useEffect4(() => {
-    if (!isEmbeddedApp())
-      return;
+    if (!isEmbeddedApp()) return;
     const message = {
       type: "application.setMenuItems",
       payload: { menuItems }