react-sync-board 1.2.1 → 1.2.3

package/dist/react-sync-board.js

@@ -1,11 +1,11 @@
-var $r = Object.defineProperty;
-var Ar = (e, t, r) => t in e ? $r(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
-var kt = (e, t, r) => (Ar(e, typeof t != "symbol" ? t + "" : t, r), r);
-import g, { useContext as _e, useDebugValue as Lr, useRef as Re, useMemo as lt, useEffect as Pe, useCallback as er, memo as tr } from "react";
-function zr(e) {
+var Lr = Object.defineProperty;
+var zr = (e, t, r) => t in e ? Lr(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
+var kt = (e, t, r) => (zr(e, typeof t != "symbol" ? t + "" : t, r), r);
+import g, { useContext as _e, useDebugValue as Yr, useRef as Re, useMemo as lt, useEffect as Pe, useCallback as tr, memo as rr } from "react";
+function Br(e) {
   return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
 }
-var Ie = {}, Yr = {
+var Ie = {}, Nr = {
   get exports() {
     return Ie;
   },
@@ -23,7 +23,7 @@ var Ie = {}, Yr = {
  * LICENSE file in the root directory of this source tree.
  */
 var Pt;
-function Br() {
+function Xr() {
   if (Pt)
     return Ee;
   Pt = 1;
@@ -51,7 +51,7 @@ var Ce = {};
  * LICENSE file in the root directory of this source tree.
  */
 var Mt;
-function Nr() {
+function Ur() {
   return Mt || (Mt = 1, process.env.NODE_ENV !== "production" && function() {
     var e = g, t = Symbol.for("react.element"), r = Symbol.for("react.portal"), n = Symbol.for("react.fragment"), o = Symbol.for("react.strict_mode"), s = Symbol.for("react.profiler"), c = Symbol.for("react.provider"), u = Symbol.for("react.context"), l = Symbol.for("react.forward_ref"), d = Symbol.for("react.suspense"), f = Symbol.for("react.suspense_list"), a = Symbol.for("react.memo"), h = Symbol.for("react.lazy"), _ = Symbol.for("react.offscreen"), v = Symbol.iterator, E = "@@iterator";
     function I(i) {
@@ -72,10 +72,10 @@ function Nr() {
       {
         var j = y.ReactDebugCurrentFrame, X = j.getStackAddendum();
         X !== "" && (b += "%s", R = R.concat([X]));
-        var V = R.map(function(Y) {
+        var W = R.map(function(Y) {
           return String(Y);
         });
-        V.unshift("Warning: " + b), Function.prototype.apply.call(console[i], console, V);
+        W.unshift("Warning: " + b), Function.prototype.apply.call(console[i], console, W);
       }
     }
     var p = !1, C = !1, m = !1, S = !1, O = !1, k;
@@ -132,9 +132,9 @@ function Nr() {
             var j = i.displayName || null;
             return j !== null ? j : N(i.type) || "Memo";
           case h: {
-            var X = i, V = X._payload, Y = X._init;
+            var X = i, W = X._payload, Y = X._init;
             try {
-              return N(Y(V));
+              return N(Y(W));
             } catch {
               return null;
             }
@@ -142,14 +142,14 @@ function Nr() {
         }
       return null;
     }
-    var W = Object.assign, J = 0, P, $, B, U, A, F, K;
+    var U = Object.assign, J = 0, P, $, B, V, A, K, F;
     function ee() {
     }
     ee.__reactDisabledLog = !0;
     function oe() {
       {
         if (J === 0) {
-          P = console.log, $ = console.info, B = console.warn, U = console.error, A = console.group, F = console.groupCollapsed, K = console.groupEnd;
+          P = console.log, $ = console.info, B = console.warn, V = console.error, A = console.group, K = console.groupCollapsed, F = console.groupEnd;
           var i = {
             configurable: !0,
             enumerable: !0,
@@ -178,26 +178,26 @@ function Nr() {
             writable: !0
           };
           Object.defineProperties(console, {
-            log: W({}, i, {
+            log: U({}, i, {
               value: P
             }),
-            info: W({}, i, {
+            info: U({}, i, {
               value: $
             }),
-            warn: W({}, i, {
+            warn: U({}, i, {
               value: B
             }),
-            error: W({}, i, {
-              value: U
+            error: U({}, i, {
+              value: V
             }),
-            group: W({}, i, {
+            group: U({}, i, {
               value: A
             }),
-            groupCollapsed: W({}, i, {
-              value: F
-            }),
-            groupEnd: W({}, i, {
+            groupCollapsed: U({}, i, {
               value: K
+            }),
+            groupEnd: U({}, i, {
+              value: F
             })
           });
         }
@@ -220,8 +220,8 @@ function Nr() {
     }
     var Ke = !1, De;
     {
-      var dr = typeof WeakMap == "function" ? WeakMap : Map;
-      De = new dr();
+      var mr = typeof WeakMap == "function" ? WeakMap : Map;
+      De = new mr();
     }
     function ht(i, b) {
       if (!i || Ke)
@@ -235,8 +235,8 @@ function Nr() {
       Ke = !0;
       var X = Error.prepareStackTrace;
       Error.prepareStackTrace = void 0;
-      var V;
-      V = se.current, se.current = null, oe();
+      var W;
+      W = se.current, se.current = null, oe();
       try {
         if (b) {
           var Y = function() {
@@ -289,15 +289,15 @@ function Nr() {
             }
         }
       } finally {
-        Ke = !1, se.current = V, le(), Error.prepareStackTrace = X;
+        Ke = !1, se.current = W, le(), Error.prepareStackTrace = X;
       }
       var ve = i ? i.displayName || i.name : "", Tt = ve ? ge(ve) : "";
       return typeof i == "function" && De.set(i, Tt), Tt;
     }
-    function pr(i, b, R) {
+    function gr(i, b, R) {
       return ht(i, !1);
     }
-    function mr(i) {
+    function hr(i) {
       var b = i.prototype;
       return !!(b && b.isReactComponent);
     }
@@ -305,7 +305,7 @@ function Nr() {
       if (i == null)
         return "";
       if (typeof i == "function")
-        return ht(i, mr(i));
+        return ht(i, hr(i));
       if (typeof i == "string")
         return ge(i);
       switch (i) {
@@ -317,13 +317,13 @@ function Nr() {
       if (typeof i == "object")
         switch (i.$$typeof) {
           case l:
-            return pr(i.render);
+            return gr(i.render);
           case a:
             return je(i.type, b, R);
           case h: {
-            var j = i, X = j._payload, V = j._init;
+            var j = i, X = j._payload, W = j._init;
             try {
-              return je(V(X), b, R);
+              return je(W(X), b, R);
             } catch {
             }
           }
@@ -338,11 +338,11 @@ function Nr() {
       } else
         yt.setExtraStackFrame(null);
     }
-    function gr(i, b, R, j, X) {
+    function vr(i, b, R, j, X) {
       {
-        var V = Function.call.bind($e);
+        var W = Function.call.bind($e);
         for (var Y in i)
-          if (V(i, Y)) {
+          if (W(i, Y)) {
             var z = void 0;
             try {
               if (typeof i[Y] != "function") {
@@ -357,17 +357,17 @@ function Nr() {
           }
       }
     }
-    var hr = Array.isArray;
+    var yr = Array.isArray;
     function He(i) {
-      return hr(i);
+      return yr(i);
     }
-    function vr(i) {
+    function Sr(i) {
       {
         var b = typeof Symbol == "function" && Symbol.toStringTag, R = b && i[Symbol.toStringTag] || i.constructor.name || "Object";
         return R;
       }
     }
-    function yr(i) {
+    function _r(i) {
       try {
         return St(i), !1;
       } catch {
@@ -378,17 +378,17 @@ function Nr() {
       return "" + i;
     }
     function _t(i) {
-      if (yr(i))
-        return w("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", vr(i)), St(i);
+      if (_r(i))
+        return w("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Sr(i)), St(i);
     }
-    var be = y.ReactCurrentOwner, Sr = {
+    var be = y.ReactCurrentOwner, br = {
       key: !0,
       ref: !0,
       __self: !0,
       __source: !0
     }, bt, Et, qe;
     qe = {};
-    function _r(i) {
+    function Er(i) {
       if ($e.call(i, "ref")) {
         var b = Object.getOwnPropertyDescriptor(i, "ref").get;
         if (b && b.isReactWarning)
@@ -396,7 +396,7 @@ function Nr() {
       }
       return i.ref !== void 0;
     }
-    function br(i) {
+    function Cr(i) {
       if ($e.call(i, "key")) {
         var b = Object.getOwnPropertyDescriptor(i, "key").get;
         if (b && b.isReactWarning)
@@ -404,13 +404,13 @@ function Nr() {
       }
       return i.key !== void 0;
     }
-    function Er(i, b) {
+    function wr(i, b) {
       if (typeof i.ref == "string" && be.current && b && be.current.stateNode !== b) {
         var R = N(be.current.type);
         qe[R] || (w('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', N(be.current.type), i.ref), qe[R] = !0);
       }
     }
-    function Cr(i, b) {
+    function xr(i, b) {
       {
         var R = function() {
           bt || (bt = !0, w("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", b));
@@ -421,7 +421,7 @@ function Nr() {
         });
       }
     }
-    function wr(i, b) {
+    function Rr(i, b) {
       {
         var R = function() {
           Et || (Et = !0, w("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", b));
@@ -432,7 +432,7 @@ function Nr() {
         });
       }
     }
-    var xr = function(i, b, R, j, X, V, Y) {
+    var Ir = function(i, b, R, j, X, W, Y) {
       var z = {
         // This tag allows us to uniquely identify this as a React Element
         $$typeof: t,
@@ -442,7 +442,7 @@ function Nr() {
         ref: R,
         props: Y,
         // Record the component responsible for creating this element.
-        _owner: V
+        _owner: W
       };
       return z._store = {}, Object.defineProperty(z._store, "validated", {
         configurable: !1,
@@ -461,22 +461,22 @@ function Nr() {
         value: X
       }), Object.freeze && (Object.freeze(z.props), Object.freeze(z)), z;
     };
-    function Rr(i, b, R, j, X) {
+    function Or(i, b, R, j, X) {
       {
-        var V, Y = {}, z = null, Q = null;
-        R !== void 0 && (_t(R), z = "" + R), br(b) && (_t(b.key), z = "" + b.key), _r(b) && (Q = b.ref, Er(b, X));
-        for (V in b)
-          $e.call(b, V) && !Sr.hasOwnProperty(V) && (Y[V] = b[V]);
+        var W, Y = {}, z = null, Q = null;
+        R !== void 0 && (_t(R), z = "" + R), Cr(b) && (_t(b.key), z = "" + b.key), Er(b) && (Q = b.ref, wr(b, X));
+        for (W in b)
+          $e.call(b, W) && !br.hasOwnProperty(W) && (Y[W] = b[W]);
         if (i && i.defaultProps) {
           var q = i.defaultProps;
-          for (V in q)
-            Y[V] === void 0 && (Y[V] = q[V]);
+          for (W in q)
+            Y[W] === void 0 && (Y[W] = q[W]);
         }
         if (z || Q) {
           var G = typeof i == "function" ? i.displayName || i.name || "Unknown" : i;
-          z && Cr(Y, G), Q && wr(Y, G);
+          z && xr(Y, G), Q && Rr(Y, G);
         }
-        return xr(i, z, Q, X, j, be.current, Y);
+        return Ir(i, z, Q, X, j, be.current, Y);
       }
     }
     var Ge = y.ReactCurrentOwner, Ct = y.ReactDebugCurrentFrame;
@@ -504,7 +504,7 @@ Check the render method of \`` + i + "`.";
         return "";
       }
     }
-    function Ir(i) {
+    function Tr(i) {
       {
         if (i !== void 0) {
           var b = i.fileName.replace(/^.*[\\\/]/, ""), R = i.lineNumber;
@@ -516,7 +516,7 @@ Check your code at ` + b + ":" + R + ".";
       }
     }
     var xt = {};
-    function Or(i) {
+    function kr(i) {
       {
         var b = wt();
         if (!b) {
@@ -533,7 +533,7 @@ Check the top-level render call using <` + R + ">.");
         if (!i._store || i._store.validated || i.key != null)
           return;
         i._store.validated = !0;
-        var R = Or(b);
+        var R = kr(b);
         if (xt[R])
           return;
         xt[R] = !0;
@@ -555,12 +555,12 @@ Check the top-level render call using <` + R + ">.");
         else if (i) {
           var X = I(i);
           if (typeof X == "function" && X !== i.entries)
-            for (var V = X.call(i), Y; !(Y = V.next()).done; )
+            for (var W = X.call(i), Y; !(Y = W.next()).done; )
               Ze(Y.value) && Rt(Y.value, b);
         }
       }
     }
-    function Tr(i) {
+    function Pr(i) {
       {
         var b = i.type;
         if (b == null || typeof b == "string")
@@ -576,7 +576,7 @@ Check the top-level render call using <` + R + ">.");
           return;
         if (R) {
           var j = N(b);
-          gr(R, i.props, "prop", j, i);
+          vr(R, i.props, "prop", j, i);
         } else if (b.PropTypes !== void 0 && !Je) {
           Je = !0;
           var X = N(b);
@@ -585,7 +585,7 @@ Check the top-level render call using <` + R + ">.");
         typeof b.getDefaultProps == "function" && !b.getDefaultProps.isReactClassApproved && w("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
       }
     }
-    function kr(i) {
+    function Mr(i) {
       {
         for (var b = Object.keys(i.props), R = 0; R < b.length; R++) {
           var j = b[R];
@@ -597,18 +597,18 @@ Check the top-level render call using <` + R + ">.");
         i.ref !== null && (he(i), w("Invalid attribute `ref` supplied to `React.Fragment`."), he(null));
       }
     }
-    function Ot(i, b, R, j, X, V) {
+    function Ot(i, b, R, j, X, W) {
       {
         var Y = D(i);
         if (!Y) {
           var z = "";
           (i === void 0 || typeof i == "object" && i !== null && Object.keys(i).length === 0) && (z += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
-          var Q = Ir(X);
+          var Q = Tr(X);
           Q ? z += Q : z += wt();
           var q;
           i === null ? q = "null" : He(i) ? q = "array" : i !== void 0 && i.$$typeof === t ? (q = "<" + (N(i.type) || "Unknown") + " />", z = " Did you accidentally export a JSX literal instead of a component?") : q = typeof i, w("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", q, z);
         }
-        var G = Rr(i, b, R, X, V);
+        var G = Or(i, b, R, X, W);
         if (G == null)
           return G;
         if (Y) {
@@ -624,25 +624,25 @@ Check the top-level render call using <` + R + ">.");
             else
               It(te, i);
         }
-        return i === n ? kr(G) : Tr(G), G;
+        return i === n ? Mr(G) : Pr(G), G;
       }
     }
-    function Pr(i, b, R) {
+    function Dr(i, b, R) {
       return Ot(i, b, R, !0);
     }
-    function Mr(i, b, R) {
+    function jr(i, b, R) {
       return Ot(i, b, R, !1);
     }
-    var Dr = Mr, jr = Pr;
-    Ce.Fragment = n, Ce.jsx = Dr, Ce.jsxs = jr;
+    var $r = jr, Ar = Dr;
+    Ce.Fragment = n, Ce.jsx = $r, Ce.jsxs = Ar;
   }()), Ce;
 }
 (function(e) {
-  process.env.NODE_ENV === "production" ? e.exports = Br() : e.exports = Nr();
-})(Yr);
-const Xr = Ie.Fragment, T = Ie.jsx, ue = Ie.jsxs;
-let Ur = (e = 21) => crypto.getRandomValues(new Uint8Array(e)).reduce((t, r) => (r &= 63, r < 36 ? t += r.toString(36) : r < 62 ? t += (r - 26).toString(36).toUpperCase() : r > 62 ? t += "-" : t += "_", t), "");
-class Wr {
+  process.env.NODE_ENV === "production" ? e.exports = Xr() : e.exports = Ur();
+})(Nr);
+const Wr = Ie.Fragment, T = Ie.jsx, ue = Ie.jsxs;
+let Vr = (e = 21) => crypto.getRandomValues(new Uint8Array(e)).reduce((t, r) => (r &= 63, r < 36 ? t += r.toString(36) : r < 62 ? t += (r - 26).toString(36).toUpperCase() : r > 62 ? t += "-" : t += "_", t), "");
+class Fr {
   constructor(t, r, n = null) {
     this._socket = t, this.userId = n, this.room = r, this.toUnregister = [
       () => {
@@ -669,7 +669,7 @@ class Wr {
    * @returns the result of the call.
    */
   async _callServerRPC(t, r) {
-    const n = Ur();
+    const n = Vr();
     return new Promise((o, s) => {
       this._socket.once(`${this.room}._result.${n}`, (c) => {
         c.hasOwnProperty("ok") ? o(c.ok) : s(c.err);
@@ -738,7 +738,7 @@ class Wr {
     return await this._callServerRPC("call", { name: t, params: r });
   }
 }
-const Vr = ({
+const Kr = ({
   socket: e,
   room: t,
   onJoined: r = () => {
@@ -747,7 +747,7 @@ const Vr = ({
   },
   userId: o = null
 }) => {
-  const s = new Wr(e, t, o);
+  const s = new Fr(e, t, o);
   return new Promise((c) => {
     let u = !0;
     e.on(`${t}.isMaster`, () => {
@@ -761,7 +761,7 @@ const Vr = ({
       });
     }), e.emit("joinSuperSocket", { room: t, userId: o });
   });
-}, it = g.createContext(), Fr = () => /* @__PURE__ */ T(
+}, it = g.createContext(), Hr = () => /* @__PURE__ */ T(
   "div",
   {
     style: {
@@ -775,11 +775,11 @@ const Vr = ({
     },
     children: /* @__PURE__ */ T("h2", { children: "🌀 Loading..." })
   }
-), rr = ({
+), nr = ({
   socket: e,
   room: t,
   channel: r = "default",
-  LoadingComponent: n = Fr,
+  LoadingComponent: n = Hr,
   children: o
 }) => {
   const [s, c] = g.useState(!1), [u, l] = g.useState(!1), [d, f] = g.useState(null), a = g.useRef(null), h = g.useRef(!1), _ = _e(it), v = g.useRef(!1);
@@ -794,7 +794,7 @@ const Vr = ({
     return e.on("disconnect", E), () => {
       e.off("disconnect", E);
     };
-  }, [r, e]), g.useEffect(() => e ? (e.connected || e.connect(), console.log(`Try to connect to wire ${t} on channel ${r}`), v.current || (v.current = !0, Vr({
+  }, [r, e]), g.useEffect(() => e ? (e.connected || e.connect(), console.log(`Try to connect to wire ${t} on channel ${r}`), v.current || (v.current = !0, Kr({
     socket: e,
     room: t,
     onMaster: () => {
@@ -828,14 +828,14 @@ const Vr = ({
   } };
   return t = e(n, o, u), u;
 }, Ue = (e) => e ? Dt(e) : Dt;
-var at = {}, Kr = {
+var at = {}, qr = {
   get exports() {
     return at;
   },
   set exports(e) {
     at = e;
   }
-}, Qe = {}, Ye = {}, Hr = {
+}, Qe = {}, Ye = {}, Gr = {
   get exports() {
     return Ye;
   },
@@ -853,7 +853,7 @@ var at = {}, Kr = {
  * LICENSE file in the root directory of this source tree.
  */
 var jt;
-function qr() {
+function Jr() {
   if (jt)
     return et;
   jt = 1;
@@ -899,7 +899,7 @@ var tt = {};
  * LICENSE file in the root directory of this source tree.
  */
 var $t;
-function Gr() {
+function Zr() {
   return $t || ($t = 1, process.env.NODE_ENV !== "production" && function() {
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
     var e = g, t = e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
@@ -970,10 +970,10 @@ function Gr() {
   }()), tt;
 }
 var At;
-function nr() {
+function or() {
   return At || (At = 1, function(e) {
-    process.env.NODE_ENV === "production" ? e.exports = qr() : e.exports = Gr();
-  }(Hr)), Ye;
+    process.env.NODE_ENV === "production" ? e.exports = Jr() : e.exports = Zr();
+  }(Gr)), Ye;
 }
 /**
  * @license React
@@ -985,11 +985,11 @@ function nr() {
  * LICENSE file in the root directory of this source tree.
  */
 var Lt;
-function Jr() {
+function Qr() {
   if (Lt)
     return Qe;
   Lt = 1;
-  var e = g, t = nr();
+  var e = g, t = or();
   function r(d, f) {
     return d === f && (d !== 0 || 1 / d === 1 / f) || d !== d && f !== f;
   }
@@ -1040,10 +1040,10 @@ var rt = {};
  * LICENSE file in the root directory of this source tree.
  */
 var zt;
-function Zr() {
+function en() {
   return zt || (zt = 1, process.env.NODE_ENV !== "production" && function() {
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error());
-    var e = g, t = nr();
+    var e = g, t = or();
     function r(f, a) {
       return f === a && (f !== 0 || 1 / f === 1 / a) || f !== f && a !== a;
     }
@@ -1060,9 +1060,9 @@ function Zr() {
             C = !0, m = L;
             var N = _(L);
             if (v !== void 0 && I.hasValue) {
-              var W = I.value;
-              if (v(W, N))
-                return S = W, W;
+              var U = I.value;
+              if (v(U, N))
+                return S = U, U;
             }
             return S = N, N;
           }
@@ -1086,30 +1086,30 @@ function Zr() {
   }()), rt;
 }
 (function(e) {
-  process.env.NODE_ENV === "production" ? e.exports = Jr() : e.exports = Zr();
-})(Kr);
-const Qr = /* @__PURE__ */ zr(at), { useSyncExternalStoreWithSelector: en } = Qr;
+  process.env.NODE_ENV === "production" ? e.exports = Qr() : e.exports = en();
+})(qr);
+const tn = /* @__PURE__ */ Br(at), { useSyncExternalStoreWithSelector: rn } = tn;
 function We(e, t = e.getState, r) {
-  const n = en(
+  const n = rn(
     e.subscribe,
     e.getState,
     e.getServerState || e.getState,
     t,
     r
   );
-  return Lr(n), n;
+  return Yr(n), n;
 }
 const ye = (e, t) => e.classList && e.classList.contains(t), Oe = (e, t) => ye(e, t) ? e : e.parentNode ? Oe(e.parentNode, t) : !1, ze = ([e, t], [r, n]) => {
   const o = Math.abs(e - r), s = Math.abs(t - n);
   return Math.hypot(o, s);
-}, or = (e, t, r) => {
+}, sr = (e, t, r) => {
   const n = r * Math.PI / 180, o = e * Math.cos(n) - t * Math.sin(n), s = e * Math.sin(n) + t * Math.cos(n);
   return [o, s];
 }, ct = ([e, t], { scale: r, rotate: n, translateX: o, translateY: s }) => {
   const c = (e - o) / r, u = (t - s) / r;
-  return or(c, u, -n);
+  return sr(c, u, -n);
 }, Be = ([e, t], { scale: r, rotate: n, translateX: o, translateY: s }) => {
-  const [c, u] = or(e, t, n);
+  const [c, u] = sr(e, t, n);
   return [c * r + o, u * r + s];
 }, Yt = (e, t, r, n) => {
   const o = e.x, s = e.y, c = t.x, u = t.y, l = r.x, d = r.y, f = c - o, a = u - s, h = o - l, _ = s - d, v = f * f + a * a, E = 2 * (h * f + _ * a), I = h * h + _ * _ - n * n, y = E * E - 4 * v * I;
@@ -1117,12 +1117,12 @@ const ye = (e, t) => e.classList && e.classList.contains(t), Oe = (e, t) => ye(e
     return [];
   const w = (-E + Math.sqrt(y)) / (2 * v), x = (-E - Math.sqrt(y)) / (2 * v), p = [];
   return w >= 0 && w <= 1 && p.push({ x: o + w * f, y: s + w * a }), x >= 0 && x <= 1 && p.push({ x: o + x * f, y: s + x * a }), p;
-}, ft = (e, t) => e.x > t.left && e.x < t.left + t.width && e.y > t.top && e.y < t.top + t.height, tn = (e, t) => Array.from(e.querySelectorAll(".corner")).every((n) => {
+}, ft = (e, t) => e.x > t.left && e.x < t.left + t.width && e.y > t.top && e.y < t.top + t.height, nn = (e, t) => Array.from(e.querySelectorAll(".corner")).every((n) => {
   const { top: o, left: s } = n.getBoundingClientRect();
   return ft({ x: s, y: o }, t);
-}), rn = (e, t) => {
+}), on = (e, t) => {
   const r = t.getBoundingClientRect();
-  return tn(e, r);
+  return nn(e, r);
 }, Ne = (e, t) => {
   const n = e.getElementsByClassName(`item ${t}`)[0];
   return n || console.error(`Missing item ${t}`), n;
@@ -1135,7 +1135,7 @@ const ye = (e, t) => e.classList && e.classList.contains(t), Oe = (e, t) => ye(e
     JSON.stringify(e == null ? void 0 : e.dataset),
     (n = e == null ? void 0 : e.dataset) == null ? void 0 : n.id
   ), t;
-}, nn = (e, t = document) => {
+}, sn = (e, t = document) => {
   const r = e.reduce((n, o) => {
     const s = Ne(t, o);
     if (!s)
@@ -1150,7 +1150,17 @@ const ye = (e, t) => e.classList && e.classList.contains(t), Oe = (e, t) => ye(e
     }, f.left = Math.min(c, f.left), f.top = Math.min(l, f.top), f.right = Math.max(u, f.right), f.bottom = Math.max(d, f.bottom), f;
   }, null);
   return r && (r.width = r.right - r.left, r.height = r.bottom - r.top, r);
-}, on = ({ x: e, y: t, width: r, height: n }, { type: o = "grid", size: s = 1, offset: c = { x: 0, y: 0 } }) => {
+}, ir = (e, t, r = null) => (r === null && (r = /* @__PURE__ */ new Set()), !t || t.length === 0 ? [] : t.map((n) => r.has(n) ? [] : (r.add(n), [
+  n,
+  ...ir(
+    e,
+    e[n].linkedItems,
+    r
+  )
+])).flat()), Bt = (e, t, r) => {
+  const n = new Set(ir(e, r));
+  return t.filter((o) => n.has(o));
+}, an = ({ x: e, y: t, width: r, height: n }, { type: o = "grid", size: s = 1, offset: c = { x: 0, y: 0 } }) => {
   const [u, l] = [
     e + r / 2 - c.x,
     t + n / 2 - c.y
@@ -1174,7 +1184,7 @@ const ye = (e, t) => e.classList && e.classList.contains(t), Oe = (e, t) => ye(e
     x: d + c.x - r / 2,
     y: f + c.y - n / 2
   };
-}, Bt = [
+}, Nt = [
   "#037758",
   "#99092a",
   "#067070",
@@ -1205,13 +1215,13 @@ const ye = (e, t) => e.classList && e.classList.contains(t), Oe = (e, t) => ye(e
   "#007a4b",
   "#bf0daa",
   "#af0ad8"
-], Nt = () => Bt[Math.floor(Math.random() * Bt.length)], sn = !1, dt = ({ wire: e, storeName: t, noSync: r = [], defaultValue: n }, o) => (s, c, u) => {
+], Xt = () => Nt[Math.floor(Math.random() * Nt.length)], cn = !1, dt = ({ wire: e, storeName: t, noSync: r = [], defaultValue: n }, o) => (s, c, u) => {
   s({ ready: !1 });
   const l = [];
   (async () => {
     try {
       const _ = await e.call(`${t}_getValue`);
-      sn && console.log("init from peer with value", _), s((v) => ({ ...v, ..._ }));
+      cn && console.log("init from peer with value", _), s((v) => ({ ...v, ..._ }));
     } catch {
       n !== void 0 && s(n);
     }
@@ -1271,7 +1281,7 @@ function Ve(e, t) {
       return !1;
   return !0;
 }
-const sr = g.createContext(), an = (e, t) => ({
+const ar = g.createContext(), un = (e, t) => ({
   items: {},
   getItems: () => t().items,
   setItems: (r) => e({ items: r }),
@@ -1288,7 +1298,7 @@ const sr = g.createContext(), an = (e, t) => ({
       });
     }), { items: s };
   })
-}), cn = (e, t) => ({
+}), ln = (e, t) => ({
   itemIds: [],
   setItemIds: (r) => e({ itemIds: r }),
   getItemIds: () => t().itemIds,
@@ -1307,7 +1317,7 @@ const sr = g.createContext(), an = (e, t) => ({
   updateManyItemIds: (r) => e((n) => ({
     items: n.itemIds.map((o, s) => r[s] !== void 0 ? r[s] : o)
   }))
-}), un = (e, t) => ({
+}), fn = (e, t) => ({
   removeItemsById: (r) => e((n) => ({
     itemIds: n.itemIds.filter((o) => !r.includes(o)),
     items: Object.fromEntries(
@@ -1340,25 +1350,25 @@ const sr = g.createContext(), an = (e, t) => ({
       itemIds: s
     };
   })
-}), ln = (e, t) => ({
+}), dn = (e, t) => ({
   boardConfig: {},
   getBoardConfig: () => t().boardConfig,
   setBoardConfig: (r) => e({ boardConfig: r }),
   updateBoardConfig: (r) => e((n) => ({ boardConfig: { ...n.boardConfig, ...r } }))
-}), fn = (e, t) => ({
+}), pn = (e, t) => ({
   session: {},
   getSessionInfo: () => t().session,
   setSessionInfo: (r) => e({ session: r }),
   updateSessionInfo: (r) => e((n) => ({ session: { ...n.session, ...r } }))
-}), Xt = ({ storeName: e, children: t, defaultValue: r }) => {
+}), Ut = ({ storeName: e, children: t, defaultValue: r }) => {
   const { wire: n } = Xe("room"), [o, s] = g.useState(!1), [c] = g.useState(
     () => Ue(
       dt({ wire: n, storeName: e, defaultValue: r }, (...u) => ({
-        ...an(...u),
-        ...cn(...u),
         ...un(...u),
         ...ln(...u),
-        ...fn(...u)
+        ...fn(...u),
+        ...dn(...u),
+        ...pn(...u)
       }))
     )
   );
@@ -1366,11 +1376,11 @@ const sr = g.createContext(), an = (e, t) => ({
     const u = c.subscribe((l) => {
       l.ready && (u(), s(!0));
     });
-  }, [c]), o ? /* @__PURE__ */ T(sr.Provider, { value: c, children: t }) : null;
+  }, [c]), o ? /* @__PURE__ */ T(ar.Provider, { value: c, children: t }) : null;
 }, re = (e, t) => {
-  const r = _e(sr);
+  const r = _e(ar);
   return We(r, e, t || Ve);
-}, ts = () => {
+}, ns = () => {
   const [e, t] = re((n) => [
     n.itemIds,
     n.items
@@ -1379,7 +1389,7 @@ const sr = g.createContext(), an = (e, t) => ({
     () => e.map((n) => t[n]),
     [e, t]
   );
-}, rs = () => {
+}, os = () => {
   const [e, t, r] = re((c) => [
     c.items,
     c.itemIds,
@@ -1391,19 +1401,19 @@ const sr = g.createContext(), an = (e, t) => ({
       o(c);
     });
   }, [e, t, r]), n;
-}, ir = 5e4, ar = g.createContext(), dn = (e, t) => ({
+}, cr = 5e4, ur = g.createContext(), mn = (e, t) => ({
   config: {
     itemTemplates: {},
     actions: {},
     uid: null,
     itemExtent: { x: 0, y: 0, radius: 0 },
     boardWrapperRect: {},
-    boardSize: ir
+    boardSize: cr
   },
   // TODO optimize when same values as before
   updateConfiguration: (r) => e((n) => ({ config: { ...n.config, ...r } })),
   getConfiguration: () => t().config
-}), pn = (e, t) => ({
+}), gn = (e, t) => ({
   boardState: {
     movingItems: !1,
     selecting: !1,
@@ -1417,7 +1427,7 @@ const sr = g.createContext(), an = (e, t) => ({
   // TODO optimize when same values as before
   updateBoardState: (r) => e((n) => ({ boardState: { ...n.boardState, ...r } })),
   getBoardState: () => t().boardState
-}), mn = (e, t) => ({
+}), hn = (e, t) => ({
   interactions: {},
   getInteractions: () => t().interactions,
   register: (r, n) => e((o) => {
@@ -1439,7 +1449,7 @@ const sr = g.createContext(), an = (e, t) => ({
       o(n);
     });
   }
-}), gn = (e, t) => ({
+}), vn = (e, t) => ({
   selection: [],
   setSelection: (r) => e((n) => JSON.stringify(n.selection) !== JSON.stringify(r) ? { selection: r } : {}),
   getSelection: () => t().selection,
@@ -1459,20 +1469,20 @@ const sr = g.createContext(), an = (e, t) => ({
     const o = n.selectionBox;
     return !o || !r || o.top !== r.top || o.left !== r.left || o.width !== r.width || o.height !== r.height ? { selectionBox: r } : {};
   })
-}), Ut = ({ children: e }) => {
+}), Wt = ({ children: e }) => {
   const [t] = g.useState(
     () => Ue((...r) => ({
-      ...dn(...r),
-      ...pn(...r),
       ...mn(...r),
-      ...gn(...r)
+      ...gn(...r),
+      ...hn(...r),
+      ...vn(...r)
     }))
   );
-  return /* @__PURE__ */ T(ar.Provider, { value: t, children: e });
+  return /* @__PURE__ */ T(ur.Provider, { value: t, children: e });
 }, Z = (e, t) => {
-  const r = _e(ar);
+  const r = _e(ur);
   return We(r, e, t || Ve);
-}, ns = () => {
+}, ss = () => {
   const [e] = Z((t) => [t.selection]);
   return e;
 };
@@ -1484,7 +1494,7 @@ function pt(e) {
     }
   }), []);
 }
-function hn(e) {
+function yn(e) {
   const t = pt(e);
   Pe(
     () => () => {
@@ -1498,7 +1508,7 @@ function mt(e, t, r, n = 0) {
   const o = Re(), s = Re(), c = Re(), u = () => {
     o.current && (clearTimeout(o.current), o.current = void 0), s.current && (clearTimeout(s.current), s.current = void 0);
   };
-  return hn(u), lt(
+  return yn(u), lt(
     () => {
       const l = () => {
         if (!c.current)
@@ -1517,7 +1527,7 @@ function mt(e, t, r, n = 0) {
     [r, n, ...t]
   );
 }
-const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
+const Sn = 100, _n = 1e3, bn = 0.8, En = ({
   x: e,
   y: t,
   scale: r,
@@ -1536,7 +1546,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
   }, a = {
     x: c / 2,
     y: c / 2
-  }, h = ze(d, [f.x, f.y]), _ = Math.min(s.width, s.height), v = o.radius + _ / 2 / r - vn / r;
+  }, h = ze(d, [f.x, f.y]), _ = Math.min(s.width, s.height), v = o.radius + _ / 2 / r - Sn / r;
   if (h > v) {
     const y = Yt(
       { x: d[0], y: d[1] },
@@ -1614,8 +1624,8 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
         ...O,
         ...p(O)
       }, N = a(M);
-      let [W, J] = [k, D];
-      (k !== O.translateX || D !== O.translateY) && ([W, J] = _n({
+      let [U, J] = [k, D];
+      (k !== O.translateX || D !== O.translateY) && ([U, J] = En({
         x: k,
         y: D,
         scale: N,
@@ -1624,7 +1634,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
         boardWrapperRect: m,
         boardSize: S
       })), t({
-        translateX: W,
+        translateX: U,
         translateY: J,
         scale: N,
         rotate: L
@@ -1652,8 +1662,8 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
         y: m.top + m.height / 2
       });
       const O = e(), k = a(O.scale * C), D = S.x - m.left, M = S.y - m.top, L = D - (D - O.translateX) * k / O.scale, N = M - (M - O.translateY) * k / O.scale;
-      h((W) => ({
-        ...W,
+      h((U) => ({
+        ...U,
         translateX: L,
         translateY: N,
         scale: k
@@ -1662,7 +1672,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     [a, e, n, h]
   ), E = g.useCallback(
     ({ x: p, y: C, radius: m }) => {
-      const { rotate: S } = e(), { boardWrapperRect: O, boardSize: k } = n(), D = O.width / (m * 2), M = O.height / (m * 2), L = a(Math.min(D, M) * Sn), [N, W] = Be(
+      const { rotate: S } = e(), { boardWrapperRect: O, boardSize: k } = n(), D = O.width / (m * 2), M = O.height / (m * 2), L = a(Math.min(D, M) * bn), [N, U] = Be(
         [-k / 2 - p, -k / 2 - C],
         {
           translateX: O.width / 2,
@@ -1671,7 +1681,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
           rotate: S
         }
       );
-      h((J) => ({ ...J, translateX: N, translateY: W, scale: L }));
+      h((J) => ({ ...J, translateX: N, translateY: U, scale: L }));
     },
     [a, e, n, h]
   ), I = g.useCallback(() => {
@@ -1707,7 +1717,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     };
     O.radius = Math.max(
       ze([O.x, O.y], [S.left, S.top]),
-      yn
+      _n
     ), o({ itemExtent: O });
   }, [n, c, o]), w = g.useCallback(
     (p) => {
@@ -1734,7 +1744,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     fromWrapperToBoard: l,
     fromBoardToWrapper: d
   };
-}, Wt = (e) => {
+}, Vt = (e) => {
   const [t, r, n] = Z(
     ({ register: c, unregister: u, callInteractions: l }) => [
       c,
@@ -1754,7 +1764,7 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
   );
   return { register: o, call: s };
 }, gt = () => {
-  const { call: e } = Wt("place"), { call: t } = Wt("delete"), { getCenter: r, updateItemExtent: n } = Me(), [o, s, c, u] = Z((P) => [
+  const { call: e } = Vt("place"), { call: t } = Vt("delete"), { getCenter: r, updateItemExtent: n } = Me(), [o, s, c, u] = Z((P) => [
     P.clear,
     P.reverse,
     P.unselect,
@@ -1774,20 +1784,20 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
       getItems: P,
       getItemIds: $,
       setItemIds: B,
-      updateItems: U,
+      updateItems: V,
       moveItems: A,
-      removeItemsById: F,
-      getItemList: K,
+      removeItemsById: K,
+      getItemList: F,
       insertItems: ee,
       setItemList: oe
     }) => ({
       getItems: P,
       getItemIds: $,
       setItemIds: B,
-      updateItems: U,
+      updateItems: V,
       moveItems: A,
-      removeItemsById: F,
-      getItemList: K,
+      removeItemsById: K,
+      getItemList: F,
       insertItems: ee,
       setItemList: oe
     })
@@ -1795,10 +1805,10 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     (P, $) => {
       let B = $;
       typeof $ == "object" && (B = () => $);
-      const U = d().filter((K) => P.includes(K)), A = l(), F = Object.fromEntries(
-        U.map((K) => [K, B({ ...A[K] })])
+      const V = d().filter((F) => P.includes(F)), A = l(), K = Object.fromEntries(
+        V.map((F) => [F, B({ ...A[F] })])
       );
-      a(F), n();
+      a(K), n();
     },
     [d, l, n, a]
   ), w = g.useCallback(
@@ -1813,38 +1823,40 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     [y]
   ), p = g.useCallback(
     (P, $) => {
-      const B = l(), U = P.map((A) => [A, ...B[A].linkedItems || []]).flat();
-      h(U, $), n();
+      h(
+        Bt(l(), d(), P),
+        $
+      ), n();
     },
-    [l, h, n]
+    [d, l, h, n]
   ), C = g.useCallback(
     (P) => {
-      const $ = d(), B = $.filter((A) => !P.includes(A)), U = $.filter(
+      const $ = d(), B = $.filter((A) => !P.includes(A)), V = $.filter(
         (A) => P.includes(A)
       );
-      f([...B, ...U]);
+      f([...B, ...V]);
     },
     [d, f]
   ), m = g.useCallback(
     (P, { type: $, size: B } = {}) => {
-      const { boardWrapper: U } = u();
+      const { boardWrapper: V } = u();
       y(P, (A) => {
-        const F = Ne(U, A.id);
-        if (!F)
+        const K = Ne(V, A.id);
+        if (!K)
           return;
-        const K = {
+        const F = {
           type: $ || "grid",
           size: B || 1,
           offset: { x: 0, y: 0 },
           ...A.grid
-        }, ee = on(
+        }, ee = an(
           {
             x: A.x,
             y: A.y,
-            width: F.clientWidth,
-            height: F.clientHeight
+            width: K.clientWidth,
+            height: K.clientHeight
           },
-          K
+          F
         );
         return { ...A, ...ee };
       });
@@ -1852,15 +1864,20 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     [u, y]
   ), S = g.useCallback(
     (P, $) => {
-      const B = l(), U = P.map((A) => [A, ...B[A].linkedItems || []]).flat();
-      C(U), y(U, (A) => {
-        const F = { ...A };
-        return delete F.moving, F;
-      }), m(U, $), e(P), n();
+      const B = Bt(
+        l(),
+        d(),
+        P
+      );
+      C(B), y(B, (V) => {
+        const A = { ...V };
+        return delete A.moving, A;
+      }), m(B, $), e(P), n();
     },
     [
       y,
       e,
+      d,
       l,
       C,
       m,
@@ -1875,17 +1892,17 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     (P) => {
       const $ = d(), B = $.filter(
         (A) => P.includes(A)
-      ), U = $.map((A) => P.includes(A) ? B.pop() : A);
-      f(U), s();
+      ), V = $.map((A) => P.includes(A) ? B.pop() : A);
+      f(V), s();
     },
     [d, s, f]
   ), D = g.useCallback(
     (P, $) => {
-      const B = l(), U = Object.fromEntries(
-        $.map((K, ee) => {
+      const B = l(), V = Object.fromEntries(
+        $.map((F, ee) => {
           const oe = B[P[ee]];
           return [
-            K,
+            F,
             {
               x: oe.x,
               y: oe.y
@@ -1893,17 +1910,17 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
           ];
         })
       );
-      y(P, (K) => ({ ...K, ...U[K.id] }));
+      y(P, (F) => ({ ...F, ...V[F.id] }));
       const A = Object.fromEntries(
-        P.map((K, ee) => [K, $[ee]])
-      ), F = d().map((K) => P.includes(K) ? A[K] : K);
-      f(F);
+        P.map((F, ee) => [F, $[ee]])
+      ), K = d().map((F) => P.includes(F) ? A[F] : F);
+      f(K);
     },
     [l, y, d, f]
   ), M = g.useCallback(
     (P, $) => {
-      const B = r(), U = P.map((A, F) => !A.x || !A.y ? { ...A, x: B.x + 2 * F, y: B.y + 2 * F } : A);
-      E(U, $), n();
+      const B = r(), V = P.map((A, K) => !A.x || !A.y ? { ...A, x: B.x + 2 * K, y: B.y + 2 * K } : A);
+      E(V, $), n();
     },
     [r, E, n]
   ), L = g.useCallback(
@@ -1916,36 +1933,36 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
       c(P), _(P), t(P);
     },
     [c, _, t]
-  ), W = g.useCallback(
+  ), U = g.useCallback(
     (P) => {
       const $ = l();
       return P.map((B) => $[B]);
     },
     [l]
   ), J = g.useCallback(
-    ({ target: P, clientX: $, clientY: B }, { returnLocked: U = !1, passLocked: A = !1 } = {}) => {
+    ({ target: P, clientX: $, clientY: B }, { returnLocked: V = !1, passLocked: A = !1 } = {}) => {
       if (["INPUT", "TEXTAREA"].includes(P.tagName))
         return null;
-      const F = Oe(P, "item");
-      if (F) {
-        if (ye(F, "selected"))
-          return F;
-        if (!A && ye(F, "locked") && !ye(P, "passthrough"))
-          return U ? F : null;
+      const K = Oe(P, "item");
+      if (K) {
+        if (ye(K, "selected"))
+          return K;
+        if (!A && ye(K, "locked") && !ye(P, "passthrough"))
+          return V ? K : null;
         if (ye(P, "passthrough")) {
-          const K = d(), { boardWrapper: ee } = u(), oe = K.reduce((le, se) => {
+          const F = d(), { boardWrapper: ee } = u(), oe = F.reduce((le, se) => {
             const me = Ne(ee, se), ge = me.getBoundingClientRect();
             return ft({ x: $, y: B }, ge) && le.unshift(me), le;
           }, []);
           for (let le = 0; le < oe.length; le += 1) {
             const se = oe[le];
-            if (se !== F && (A || !ye(se, "locked")))
+            if (se !== K && (A || !ye(se, "locked")))
               return se;
           }
           return null;
         }
       }
-      return F;
+      return K;
     },
     [u, d]
   );
@@ -1964,10 +1981,10 @@ const vn = 100, yn = 1e3, Sn = 0.8, _n = ({
     removeItems: N,
     getItemList: v,
     findElementUnderPointer: J,
-    getItems: W
+    getItems: U
   };
 };
-var bn = function e(t, r) {
+var Cn = function e(t, r) {
   if (t === r)
     return !0;
   if (t && r && typeof t == "object" && typeof r == "object") {
@@ -2029,19 +2046,19 @@ var bn = function e(t, r) {
   }
   return t !== t && r !== r;
 };
-function En(e, t, r, n = 0) {
+function wn(e, t, r, n = 0) {
   Pe(mt(e, t, r, n), t);
 }
-const Cn = (e, t) => {
+const xn = (e, t) => {
   if (e.type in t) {
     const r = t[e.type].defaultActions;
     return typeof r == "function" ? r(e) : r;
   }
   return [];
-}, Vt = (e, t) => {
-  const { actions: r = Cn(e, t) } = e;
+}, Ft = (e, t) => {
+  const { actions: r = xn(e, t) } = e;
   return r.map((n) => typeof n == "string" ? { name: n } : n);
-}, os = () => {
+}, is = () => {
   const [e, t] = re((a) => [
     a.items,
     a.getItems
@@ -2062,17 +2079,17 @@ const Cn = (e, t) => {
       return [_, _.map((v) => h[v])];
     },
     [t, o]
-  ), f = er(() => {
+  ), f = tr(() => {
     const [a, h] = d();
     if (a.length > 0) {
       if (!u.current)
         return;
       const _ = h.reduce((v, E) => {
-        const I = Vt(E, r);
+        const I = Ft(E, r);
         return v.filter(
-          (y) => I.some((w) => bn(y, w))
+          (y) => I.some((w) => Cn(y, w))
         );
-      }, Vt(h[0], r));
+      }, Ft(h[0], r));
       l(() => {
         c(_);
       });
@@ -2081,25 +2098,25 @@ const Cn = (e, t) => {
         c([]);
       });
   }, [d, r]);
-  return En(
+  return wn(
     () => f(),
     [e, n, f],
     100
   ), {
     availableActions: s
   };
-}, ss = () => {
+}, as = () => {
   const [e] = Z((t) => [t.selectionBox]);
   return e;
 };
 let pe = (e = 21) => crypto.getRandomValues(new Uint8Array(e)).reduce((t, r) => (r &= 63, r < 36 ? t += r.toString(36) : r < 62 ? t += (r - 26).toString(36).toUpperCase() : r > 62 ? t += "-" : t += "_", t), "");
-const cr = g.createContext(), ut = (e) => {
+const lr = g.createContext(), ut = (e) => {
   localStorage.setItem("user", JSON.stringify(e));
-}, wn = () => {
+}, Rn = () => {
   if (localStorage.user) {
     const t = {
       name: "Player",
-      color: Nt(),
+      color: Xt(),
       uid: pe(),
       ...JSON.parse(localStorage.user)
     };
@@ -2107,11 +2124,11 @@ const cr = g.createContext(), ut = (e) => {
   }
   const e = {
     name: "Player",
-    color: Nt(),
+    color: Xt(),
     uid: pe()
   };
   return ut(e), e;
-}, xn = (e) => (t, r) => ({
+}, In = (e) => (t, r) => ({
   isSpaceMaster: !1,
   users: {},
   getUser: () => r().users[e],
@@ -2156,14 +2173,14 @@ const cr = g.createContext(), ut = (e) => {
       s < o.timestamp && (o.id = c, o.timestamp = s);
     }), t({ isSpaceMaster: o.id === e });
   }
-}), Rn = (e) => ({
+}), On = (e) => ({
   cursors: {},
   moveCursor: (t, r) => e((n) => ({ cursors: { ...n.cursors, [t]: r } })),
   removeCursor: (t) => e((r) => {
     const n = { ...r.cursors };
     return delete n[t], { cursors: n };
   })
-}), ur = ({ storeName: e, children: t }) => {
+}), fr = ({ storeName: e, children: t }) => {
   const { wire: r, isMaster: n } = Xe("room"), [o, s] = g.useState(null), [c, u] = g.useState(!1), l = g.useRef(!1);
   return g.useEffect(() => {
     let d = !0;
@@ -2183,8 +2200,8 @@ const cr = g.createContext(), ut = (e) => {
               ]
             },
             (...v) => ({
-              ...xn(r.userId)(...v),
-              ...Rn(...v)
+              ...In(r.userId)(...v),
+              ...On(...v)
             })
           )
         ), _ = h.subscribe((v) => {
@@ -2196,7 +2213,7 @@ const cr = g.createContext(), ut = (e) => {
   }, [o, e, r, r.userId]), g.useEffect(() => {
     if (o)
       return o.getState().addUser({
-        ...wn(),
+        ...Rn(),
         id: r.userId
       }), u(!0), () => {
         o.getState().removeUser(r.userId);
@@ -2212,11 +2229,11 @@ const cr = g.createContext(), ut = (e) => {
     }
   }, [n, o, r]), g.useEffect(() => {
     n && o && o.getState().updateCurrentUser({ isMaster: n });
-  }, [n, o, r]), c ? /* @__PURE__ */ T(cr.Provider, { value: o, children: t }) : null;
+  }, [n, o, r]), c ? /* @__PURE__ */ T(lr.Provider, { value: o, children: t }) : null;
 }, Se = (e, t) => {
-  const r = _e(cr);
+  const r = _e(lr);
   return We(r, e, t || Ve);
-}, is = () => {
+}, cs = () => {
   const [e, t, r, n, o] = Se((u) => [
     u.isSpaceMaster,
     u.getUser(),
@@ -2235,7 +2252,7 @@ const cr = g.createContext(), ut = (e) => {
     localUsers: c,
     joinSpace: o
   };
-}, as = () => {
+}, us = () => {
   const [e, t, r] = re(
     (o) => [o.boardConfig, o.getBoardConfig, o.setBoardConfig]
   ), n = g.useCallback(
@@ -2248,10 +2265,10 @@ const cr = g.createContext(), ut = (e) => {
     [t, r]
   );
   return [e, n];
-}, cs = () => {
+}, ls = () => {
   const [e] = Z((t) => [t.boardState]);
   return e;
-}, us = () => {
+}, fs = () => {
   const [e, t, r, n] = re((o) => [
     o.getSessionInfo,
     o.setSessionInfo,
@@ -2259,13 +2276,13 @@ const cr = g.createContext(), ut = (e) => {
     o.session
   ]);
   return { getSessionInfo: e, setSessionInfo: t, sessionInfo: n, updateSessionInfo: r };
-}, lr = g.createContext(), In = ({ user: { name: e, uid: t, color: r }, content: n }) => ({
+}, dr = g.createContext(), Tn = ({ user: { name: e, uid: t, color: r }, content: n }) => ({
   type: "message",
   user: { name: e, uid: t, color: r },
   content: n,
   uid: pe(),
   timestamp: new Date().toISOString()
-}), On = (e, t) => ({
+}), kn = (e, t) => ({
   messages: [],
   setMessages: (r) => e({
     messages: r.map((n) => ({
@@ -2280,13 +2297,13 @@ const cr = g.createContext(), ut = (e) => {
     ]
   })),
   sendMessage: (r, n) => {
-    const o = In({
+    const o = Tn({
       user: r,
       content: n
     });
     o && t().addMessage(o);
   }
-}), Ft = ({
+}), Kt = ({
   storeName: e,
   children: t,
   defaultValue: r = []
@@ -2296,18 +2313,18 @@ const cr = g.createContext(), ut = (e) => {
       dt(
         { wire: n, storeName: e, defaultValue: r, noSync: ["sendMessage"] },
         (...s) => ({
-          ...On(...s)
+          ...kn(...s)
         })
       )
     )
   );
-  return /* @__PURE__ */ T(lr.Provider, { value: o, children: t });
-}, Tn = (e, t) => {
-  const r = _e(lr);
+  return /* @__PURE__ */ T(dr.Provider, { value: o, children: t });
+}, Pn = (e, t) => {
+  const r = _e(dr);
   return We(r, e, t || Ve);
-}, kn = () => {
-}, ls = (e = kn) => {
-  const t = Se((c) => c.getUser()), [r, n, o] = Tn((c) => [
+}, Mn = () => {
+}, ds = (e = Mn) => {
+  const t = Se((c) => c.getUser()), [r, n, o] = Pn((c) => [
     c.messages,
     c.setMessages,
     c.sendMessage
@@ -2322,12 +2339,12 @@ const cr = g.createContext(), ut = (e) => {
     [t, o]
   );
   return { messages: r, setMessages: n, sendMessage: s };
-}, Kt = ({ children: e, session: t }) => {
+}, Ht = ({ children: e, session: t }) => {
   const r = Se((n) => n.joinSpace);
   return g.useEffect(() => (r(t), () => {
     r(null);
   }), [r, t]), e;
-}, fs = ({
+}, ps = ({
   socket: e,
   room: t,
   session: r,
@@ -2341,59 +2358,59 @@ const cr = g.createContext(), ut = (e) => {
     items: Object.fromEntries(n.map((a) => [a.id, a]))
   }));
   return Xe("room") ? /* @__PURE__ */ T(
-    Ft,
+    Kt,
     {
       storeName: `${l}_messages`,
       defaultValue: o,
-      children: /* @__PURE__ */ T(Ut, { children: /* @__PURE__ */ T(
-        Xt,
+      children: /* @__PURE__ */ T(Wt, { children: /* @__PURE__ */ T(
+        Ut,
         {
           storeName: `${l}_item`,
           defaultValue: d,
-          children: /* @__PURE__ */ T(Kt, { ...c, session: l })
+          children: /* @__PURE__ */ T(Ht, { ...c, session: l })
         }
       ) })
     }
   ) : /* @__PURE__ */ T(
-    rr,
+    nr,
     {
       room: u,
       channel: "room",
       socket: e,
       LoadingComponent: s,
-      children: /* @__PURE__ */ T(ur, { storeName: `${u}_users`, children: /* @__PURE__ */ T(
-        Ft,
+      children: /* @__PURE__ */ T(fr, { storeName: `${u}_users`, children: /* @__PURE__ */ T(
+        Kt,
         {
           storeName: `${l}_messages`,
           defaultValue: o,
-          children: /* @__PURE__ */ T(Ut, { children: /* @__PURE__ */ T(
-            Xt,
+          children: /* @__PURE__ */ T(Wt, { children: /* @__PURE__ */ T(
+            Ut,
             {
               storeName: `${l}_item`,
               defaultValue: d,
-              children: /* @__PURE__ */ T(Kt, { ...c, session: l })
+              children: /* @__PURE__ */ T(Ht, { ...c, session: l })
             }
           ) })
         }
       ) })
     }
   );
-}, ds = ({ socket: e, room: t, children: r, LoadingComponent: n }) => {
+}, ms = ({ socket: e, room: t, children: r, LoadingComponent: n }) => {
   const [o] = g.useState(t || pe());
   return /* @__PURE__ */ T(
-    rr,
+    nr,
     {
       room: o,
       channel: "room",
       socket: e,
       LoadingComponent: n,
-      children: /* @__PURE__ */ T(ur, { storeName: `${o}_users`, children: r })
+      children: /* @__PURE__ */ T(fr, { storeName: `${o}_users`, children: r })
     }
   );
 }, nt = () => {
   const e = navigator.userAgent.toLowerCase();
   return /mac os ?x 10/.test(e);
-}, Pn = () => {
+}, Dn = () => {
   const e = document.createElement("iframe");
   e.src = "#", document.body.appendChild(e);
   const t = e.contentWindow.document;
@@ -2402,34 +2419,34 @@ const cr = g.createContext(), ut = (e) => {
   ), t.close();
   const r = t.body.firstElementChild.offsetHeight;
   return document.body.removeChild(e), r;
-}, Mn = Pn(), Dn = 800, Ht = (e, t) => {
+}, jn = Dn(), $n = 800, qt = (e, t) => {
   const r = Object.keys(e).map((n) => Number(n)).find((n) => n !== t);
   return e[r];
-}, qt = ([e, t], [r, n]) => {
+}, Gt = ([e, t], [r, n]) => {
   const o = Math.abs(e - r), s = Math.abs(t - n);
   return Math.hypot(o, s);
 }, de = () => {
-}, jn = (e) => (t) => {
+}, An = (e) => (t) => {
   const { event: r } = t;
   return r.isPropagationStopped() ? null : e(t);
-}, $n = (e) => async (...t) => {
+}, Ln = (e) => async (...t) => {
   try {
     await e(...t);
   } catch (r) {
     console.error(r);
   }
 };
-class An {
+class zn {
   constructor() {
     kt(this, "lastPromise", Promise.resolve(!0));
   }
   add(t, ...r) {
     return new Promise((n, o) => {
-      this.lastPromise = this.lastPromise.then(() => jn($n(t))(...r)).then(n).catch(o);
+      this.lastPromise = this.lastPromise.then(() => An(Ln(t))(...r)).then(n).catch(o);
     });
   }
 }
-const ne = new An(), Fe = ({
+const ne = new zn(), Fe = ({
   children: e,
   onDrag: t = de,
   onDragStart: r = de,
@@ -2474,10 +2491,10 @@ const ne = new An(), Fe = ({
         let M = x;
         switch (m) {
           case 1:
-            M *= Mn;
+            M *= jn;
             break;
           case 2:
-            M *= Dn;
+            M *= $n;
             break;
         }
         nt() && (M *= 2), ne.add(l, { scale: M, clientX: p, clientY: C, event: y });
@@ -2497,10 +2514,10 @@ const ne = new An(), Fe = ({
     if (a.current.pointers[m] = { clientX: p, clientY: C }, D && (a.current.mainPointer = void 0), a.current.mainPointer !== void 0) {
       if (a.current.mainPointer !== m)
         try {
-          const { clientX: M, clientY: L } = Ht(
+          const { clientX: M, clientY: L } = qt(
             a.current.pointers,
             m
-          ), N = (M + p) / 2, W = (L + C) / 2, J = qt(
+          ), N = (M + p) / 2, U = (L + C) / 2, J = Gt(
             [M, L],
             [p, C]
           );
@@ -2511,7 +2528,7 @@ const ne = new An(), Fe = ({
             startX: p,
             startY: C,
             prevX: N,
-            prevY: W,
+            prevY: U,
             startDistance: J,
             prevDistance: J
           });
@@ -2570,19 +2587,19 @@ const ne = new An(), Fe = ({
       const D = Object.keys(a.current.pointers).length === 2;
       let M, L, N = 0;
       if (D) {
-        const { clientX: $, clientY: B } = Ht(
+        const { clientX: $, clientY: B } = qt(
           a.current.pointers,
           w
         );
-        M = ($ + x) / 2, L = (B + p) / 2, N = qt(
+        M = ($ + x) / 2, L = (B + p) / 2, N = Gt(
           [$, B],
           [x, p]
         );
       } else
         M = x, L = p;
-      let W = m || C || S || O || k !== 1;
-      d !== "drag" && (W = !W);
-      const J = !W, P = W;
+      let U = m || C || S || O || k !== 1;
+      d !== "drag" && (U = !U);
+      const J = !U, P = U;
       if (J) {
         a.current.gestureStart || (f.current.style.cursor = "move", a.current.gestureStart = !0, clearTimeout(a.current.longTapTimeout), ne.add(r, {
           deltaX: 0,
@@ -2601,7 +2618,7 @@ const ne = new An(), Fe = ({
           target: a.current.target,
           event: a.current.pointerDownEvent
         }));
-        const $ = M - a.current.prevX, B = L - a.current.prevY, U = M - a.current.startX, A = L - a.current.startY;
+        const $ = M - a.current.prevX, B = L - a.current.prevY, V = M - a.current.startX, A = L - a.current.startY;
         ne.add(t, {
           deltaX: $,
           deltaY: B,
@@ -2609,7 +2626,7 @@ const ne = new An(), Fe = ({
           startY: a.current.startY,
           clientX: M,
           clientY: L,
-          distanceX: U,
+          distanceX: V,
           distanceY: A,
           button: a.current.currentButton,
           altKey: C,
@@ -2622,7 +2639,7 @@ const ne = new An(), Fe = ({
       }
       if (P) {
         a.current.gestureStart || (f.current.style.cursor = "move", a.current.gestureStart = !0, clearTimeout(a.current.longTapTimeout));
-        const $ = M - a.current.prevX, B = L - a.current.prevY, { target: U } = a.current;
+        const $ = M - a.current.prevX, B = L - a.current.prevY, { target: V } = a.current;
         if (ne.add(o, {
           deltaX: $,
           deltaY: B,
@@ -2631,7 +2648,7 @@ const ne = new An(), Fe = ({
           shiftKey: m,
           ctrlKey: S,
           metaKey: O,
-          target: U,
+          target: V,
           event: y
         }), N !== a.current.prevDistance && l) {
           const A = a.current.prevDistance - N;
@@ -2756,23 +2773,23 @@ const ne = new An(), Fe = ({
     });
   }, children: /* @__PURE__ */ T("div", { ...t }) });
 };
-let Ln = { data: "" }, zn = (e) => typeof window == "object" ? ((e ? e.querySelector("#_goober") : window._goober) || Object.assign((e || document.head).appendChild(document.createElement("style")), { innerHTML: " ", id: "_goober" })).firstChild : e || Ln, Yn = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g, Bn = /\/\*[^]*?\*\/|  +/g, Gt = /\n+/g, fe = (e, t) => {
+let Yn = { data: "" }, Bn = (e) => typeof window == "object" ? ((e ? e.querySelector("#_goober") : window._goober) || Object.assign((e || document.head).appendChild(document.createElement("style")), { innerHTML: " ", id: "_goober" })).firstChild : e || Yn, Nn = /(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g, Xn = /\/\*[^]*?\*\/|  +/g, Jt = /\n+/g, fe = (e, t) => {
   let r = "", n = "", o = "";
   for (let s in e) {
     let c = e[s];
     s[0] == "@" ? s[1] == "i" ? r = s + " " + c + ";" : n += s[1] == "f" ? fe(c, s) : s + "{" + fe(c, s[1] == "k" ? "" : t) + "}" : typeof c == "object" ? n += fe(c, t ? t.replace(/([^,])+/g, (u) => s.replace(/(^:.*)|([^,])+/g, (l) => /&/.test(l) ? l.replace(/&/g, u) : u ? u + " " + l : l)) : s) : c != null && (s = /^--/.test(s) ? s : s.replace(/[A-Z]/g, "-$&").toLowerCase(), o += fe.p ? fe.p(s, c) : s + ":" + c + ";");
   }
   return r + (t && o ? t + "{" + o + "}" : o) + n;
-}, ae = {}, fr = (e) => {
+}, ae = {}, pr = (e) => {
   if (typeof e == "object") {
     let t = "";
     for (let r in e)
-      t += r + fr(e[r]);
+      t += r + pr(e[r]);
     return t;
   }
   return e;
-}, Nn = (e, t, r, n, o) => {
-  let s = fr(e), c = ae[s] || (ae[s] = ((l) => {
+}, Un = (e, t, r, n, o) => {
+  let s = pr(e), c = ae[s] || (ae[s] = ((l) => {
     let d = 0, f = 11;
     for (; d < l.length; )
       f = 101 * f + l.charCodeAt(d++) >>> 0;
@@ -2781,8 +2798,8 @@ let Ln = { data: "" }, zn = (e) => typeof window == "object" ? ((e ? e.querySele
   if (!ae[c]) {
     let l = s !== e ? e : ((d) => {
       let f, a, h = [{}];
-      for (; f = Yn.exec(d.replace(Bn, "")); )
-        f[4] ? h.shift() : f[3] ? (a = f[3].replace(Gt, " ").trim(), h.unshift(h[0][a] = h[0][a] || {})) : h[0][f[1]] = f[2].replace(Gt, " ").trim();
+      for (; f = Nn.exec(d.replace(Xn, "")); )
+        f[4] ? h.shift() : f[3] ? (a = f[3].replace(Jt, " ").trim(), h.unshift(h[0][a] = h[0][a] || {})) : h[0][f[1]] = f[2].replace(Jt, " ").trim();
       return h[0];
     })(e);
     ae[c] = fe(o ? { ["@keyframes " + c]: l } : l, r ? "" : "." + c);
@@ -2791,7 +2808,7 @@ let Ln = { data: "" }, zn = (e) => typeof window == "object" ? ((e ? e.querySele
   return r && (ae.g = ae[c]), ((l, d, f, a) => {
     a ? d.data = d.data.replace(a, l) : d.data.indexOf(l) === -1 && (d.data = f ? l + d.data : d.data + l);
   })(ae[c], t, n, u), c;
-}, Xn = (e, t, r) => e.reduce((n, o, s) => {
+}, Wn = (e, t, r) => e.reduce((n, o, s) => {
   let c = t[s];
   if (c && c.call) {
     let u = c(r), l = u && u.props && u.props.className || /^go/.test(u) && u;
@@ -2801,14 +2818,14 @@ let Ln = { data: "" }, zn = (e) => typeof window == "object" ? ((e ? e.querySele
 }, "");
 function H(e) {
   let t = this || {}, r = e.call ? e(t.p) : e;
-  return Nn(r.unshift ? r.raw ? Xn(r, [].slice.call(arguments, 1), t.p) : r.reduce((n, o) => Object.assign(n, o && o.call ? o(t.p) : o), {}) : r, zn(t.target), t.g, t.o, t.k);
+  return Un(r.unshift ? r.raw ? Wn(r, [].slice.call(arguments, 1), t.p) : r.reduce((n, o) => Object.assign(n, o && o.call ? o(t.p) : o), {}) : r, Bn(t.target), t.g, t.o, t.k);
 }
 H.bind({ g: 1 });
 H.bind({ k: 1 });
-function Un(e, t, r, n) {
+function Vn(e, t, r, n) {
   fe.p = t;
 }
-var Wn = function e(t, r) {
+var Fn = function e(t, r) {
   if (t === r)
     return !0;
   if (t && r && typeof t == "object" && typeof r == "object") {
@@ -2843,13 +2860,13 @@ var Wn = function e(t, r) {
   }
   return t !== t && r !== r;
 };
-const Vn = H`
+const Kn = H`
   display: inline-block;
   transition: transform 150ms;
   user-select: none;
   padding: 2px;
   box-sizing: border-box;
-`, Fn = H`
+`, Hn = H`
   border: 2px dashed #db5034;
   padding: 0px;
   cursor: pointer;
@@ -2857,19 +2874,19 @@ const Vn = H`
   position: absolute;
   width: 0px;
   height: 0px;
-`, Kn = H`
+`, qn = H`
   top: 0;
   left: 0;
-`, Hn = H`
+`, Gn = H`
   top: 0;
   right: 0;
-`, qn = H`
+`, Jn = H`
   bottom: 0;
   left: 0;
-`, Gn = H`
+`, Zn = H`
   bottom: 0;
   right: 0;
-`, Jn = H`
+`, Qn = H`
   top: 50%;
   left: 50%;
 `, st = H`
@@ -2880,19 +2897,19 @@ const Vn = H`
   border: 2px solid #db5034;
   background-color: #db5034;
   cursor: move;
-`, Zn = H`
+`, eo = H`
   cursor: ew-resize;
   right: -6px;
   top: calc(50% - 5px);
-`, Qn = H`
+`, to = H`
   cursor: ns-resize;
   bottom: -6px;
   left: calc(50% - 5px);
-`, eo = H`
+`, ro = H`
   cursor: nwse-resize;
   bottom: -6px;
   right: -6px;
-`, to = ({ onReload: e }) => /* @__PURE__ */ ue(
+`, no = ({ onReload: e }) => /* @__PURE__ */ ue(
   "div",
   {
     className: `syncboard-error-item ${H({
@@ -2909,7 +2926,7 @@ const Vn = H`
     ]
   }
 );
-class ro extends g.Component {
+class oo extends g.Component {
   constructor(t) {
     super(t), this.state = { hasError: !1, itemId: t.itemId }, this.onReload = this.onReload.bind(this);
   }
@@ -2931,9 +2948,9 @@ class ro extends g.Component {
     return this.state.hasError ? /* @__PURE__ */ T(t, { onReload: this.onReload }) : this.props.children;
   }
 }
-const no = (e) => {
+const so = (e) => {
   e.target.className = "";
-}, oo = ({
+}, io = ({
   width: e,
   height: t,
   actualWidth: r,
@@ -2958,11 +2975,11 @@ const no = (e) => {
     width: (c + e).toFixed(1),
     height: (u + t).toFixed(1)
   };
-}, so = {
+}, ao = {
   w: !0,
   h: !0,
   b: !0
-}, io = ({
+}, co = ({
   setState: e,
   state: { type: t, rotation: r = 0, id: n, locked: o, extraClasses: s, ...c } = {},
   animate: u = "hvr-pop",
@@ -2973,8 +2990,8 @@ const no = (e) => {
   var m;
   const a = g.useRef(null), {
     component: h = () => null,
-    resizeDirections: _ = so,
-    resize: v = oo
+    resizeDirections: _ = ao,
+    resize: v = io
   } = d[t], E = g.useCallback(
     (S) => e(n, S),
     [e, n]
@@ -2982,8 +2999,8 @@ const no = (e) => {
   g.useEffect(() => {
     a.current.className = u;
   }, [u]);
-  const I = ["item", n, Vn];
-  o && I.push("locked"), l && (I.push("selected"), I.push(Fn));
+  const I = ["item", n, Kn];
+  o && I.push("locked"), l && (I.push("selected"), I.push(Hn));
   const y = I.join(" "), w = ({ width: S = 0, height: O = 0, keepRatio: k }) => {
     E((D) => {
       const { offsetWidth: M, offsetHeight: L } = a.current;
@@ -3014,43 +3031,43 @@ const no = (e) => {
         {
           style: { display: "flex" },
           ref: a,
-          onAnimationEnd: no,
+          onAnimationEnd: so,
           onKeyDown: (S) => S.stopPropagation(),
           onKeyUp: (S) => S.stopPropagation(),
           children: [
             /* @__PURE__ */ T(
-              ro,
+              oo,
               {
                 itemId: n,
                 state: c,
-                ErrorComponent: ((m = d == null ? void 0 : d.error) == null ? void 0 : m.component) || to,
+                ErrorComponent: ((m = d == null ? void 0 : d.error) == null ? void 0 : m.component) || no,
                 children: /* @__PURE__ */ T(h, { ...c, id: n, setState: E })
               }
             ),
-            /* @__PURE__ */ T("div", { className: `corner ${we} ${Kn}` }),
-            /* @__PURE__ */ T("div", { className: `corner ${we} ${Hn}` }),
-            /* @__PURE__ */ T("div", { className: `corner ${we} ${Gn}` }),
             /* @__PURE__ */ T("div", { className: `corner ${we} ${qn}` }),
-            /* @__PURE__ */ T("div", { className: `center ${we} ${Jn}` }),
-            f && /* @__PURE__ */ ue(Xr, { children: [
+            /* @__PURE__ */ T("div", { className: `corner ${we} ${Gn}` }),
+            /* @__PURE__ */ T("div", { className: `corner ${we} ${Zn}` }),
+            /* @__PURE__ */ T("div", { className: `corner ${we} ${Jn}` }),
+            /* @__PURE__ */ T("div", { className: `center ${we} ${Qn}` }),
+            f && /* @__PURE__ */ ue(Wr, { children: [
               _.b && /* @__PURE__ */ T(
                 ot,
                 {
-                  className: `${st} ${eo}`,
+                  className: `${st} ${ro}`,
                   onResize: C
                 }
               ),
               _.h && /* @__PURE__ */ T(
                 ot,
                 {
-                  className: `${st} ${Qn}`,
+                  className: `${st} ${to}`,
                   onResize: p
                 }
               ),
               _.w && /* @__PURE__ */ T(
                 ot,
                 {
-                  className: `${st} ${Zn}`,
+                  className: `${st} ${eo}`,
                   onResize: x
                 }
               )
@@ -3060,8 +3077,8 @@ const no = (e) => {
       )
     }
   );
-}, ao = tr(
-  io,
+}, uo = rr(
+  co,
   ({
     state: e,
     setState: t,
@@ -3072,11 +3089,11 @@ const no = (e) => {
     setState: s,
     isSelected: c,
     showResizeHandle: u
-  }) => r === c && n === u && t === s && Wn(e, o)
-), co = (e) => e, uo = ({ state: e = {}, getCurrentUser: t, className: r, ...n }) => {
+  }) => r === c && n === u && t === s && Fn(e, o)
+), lo = (e) => e, fo = ({ state: e = {}, getCurrentUser: t, className: r, ...n }) => {
   if (!n.itemMap[e.type])
     return null;
-  const { stateHook: o = co } = n.itemMap[e.type], {
+  const { stateHook: o = lo } = n.itemMap[e.type], {
     x: s = 0,
     y: c = 0,
     layer: u = 0,
@@ -3092,7 +3109,7 @@ const no = (e) => {
         zIndex: f
       },
       children: /* @__PURE__ */ T(
-        ao,
+        uo,
         {
           ...n,
           showResizeHandle: n.isSelected && n.showResizeHandle,
@@ -3101,7 +3118,7 @@ const no = (e) => {
       )
     }
   );
-}, lo = tr(uo), fo = () => {
+}, po = rr(fo), mo = () => {
   const { updateItem: e } = gt(), [t, r] = re((d) => [
     d.itemIds,
     d.items
@@ -3116,10 +3133,11 @@ const no = (e) => {
     position: "absolute",
     top: `${n / 2}px`,
     left: `${n / 2}px`,
-    display: "inline-block"
+    display: "inline-block",
+    lineHeight: 0
   });
   return t.map((d) => /* @__PURE__ */ T(
-    lo,
+    po,
     {
       state: r[d],
       setState: e,
@@ -3133,21 +3151,21 @@ const no = (e) => {
     d
   ));
 };
-function po(e = !1) {
-  const t = Re(e), r = er(() => t.current, []);
+function go(e = !1) {
+  const t = Re(e), r = tr(() => t.current, []);
   return Pe(() => (t.current = !0, () => {
     t.current = !1;
   }), []), r;
 }
-function mo(e, ...t) {
+function ho(e, ...t) {
   e && e.addEventListener && e.addEventListener(...t);
 }
-function go(e, ...t) {
+function vo(e, ...t) {
   e && e.removeEventListener && e.removeEventListener(...t);
 }
-const ho = (e, t) => Object.prototype.hasOwnProperty.call(e, t);
+const yo = (e, t) => Object.prototype.hasOwnProperty.call(e, t);
 function ce(e, ...t) {
-  const r = po(), n = pt(t[1]), o = lt(
+  const r = go(), n = pt(t[1]), o = lt(
     () => (
       // as some event listeners designed to be used through `this`
       // it is better to make listener a conventional function as it
@@ -3161,28 +3179,28 @@ function ce(e, ...t) {
     []
   );
   Pe(() => {
-    const s = e && ho(e, "current") ? e.current : e;
+    const s = e && yo(e, "current") ? e.current : e;
     if (!s)
       return;
     const c = t.slice(2);
-    return mo(s, t[0], o, ...c), () => go(s, t[0], o, ...c);
+    return ho(s, t[0], o, ...c), () => vo(s, t[0], o, ...c);
   }, [e, t[0]]);
 }
-const vo = H({
+const So = H({
   zIndex: 210,
   position: "absolute",
   backgroundColor: "hsla(0, 40%, 50%, 10%)",
   border: "2px solid hsl(0, 55%, 40%)"
-}), yo = (e, t, r = !1) => {
+}), _o = (e, t, r = !1) => {
   const n = t.getElementsByClassName("selector");
   if (!n.length)
     return [];
   const o = n[0];
   return Array.from(t.getElementsByClassName("item")).filter((s) => {
     const c = Te(s), u = e[c];
-    return !u || !r && u.locked ? !1 : rn(s, o);
+    return !u || !r && u.locked ? !1 : on(s, o);
   }).map((s) => Te(s));
-}, So = ({ children: e, moveFirst: t }) => {
+}, bo = ({ children: e, moveFirst: t }) => {
   const [
     r,
     n,
@@ -3209,7 +3227,7 @@ const vo = H({
     n();
   }), [n]), g.useEffect(() => {
     if (I.current.moving) {
-      const m = d(), { boardWrapper: S } = c(), O = yo(m, S, _);
+      const m = d(), { boardWrapper: S } = c(), O = _o(m, S, _);
       h(() => {
         o(O);
       });
@@ -3264,14 +3282,14 @@ const vo = H({
               height: `${f.height}px`,
               width: `${f.width}px`
             },
-            className: `selector ${vo}`
+            className: `selector ${So}`
           }
         ),
         e
       ] })
     }
   );
-}, _o = ({ children: e }) => {
+}, Eo = ({ children: e }) => {
   const { moveItems: t, placeItems: r, findElementUnderPointer: n } = gt(), { vectorFromWrapperToBoard: o } = Me(), [s, c, u, l, d] = Z((y) => [
     y.select,
     y.setSelection,
@@ -3351,7 +3369,7 @@ const vo = H({
       }
     }
   }), /* @__PURE__ */ T(Fe, { onDragStart: _, onDrag: v, onDragEnd: E, children: e });
-}, bo = (e) => {
+}, Co = (e) => {
   const t = g.useRef({ hover: !1, x: 0, y: 0 });
   return ce(e.current, "mousemove", (n) => {
     const { clientX: o, clientY: s } = n;
@@ -3361,13 +3379,13 @@ const vo = H({
   }), ce(e.current, "mouseleave", () => {
     t.current.hover = !1;
   }), g.useCallback(() => t.current, []);
-}, Eo = [...Array(5).keys()].map((e) => `Digit${e + 1}`), Co = () => {
+}, wo = [...Array(5).keys()].map((e) => `Digit${e + 1}`), xo = () => {
   const [e, t] = g.useState({}), [r, n] = Z((o) => [
     o.getBoardState,
     o.updateBoardState
   ]);
   return ce(document, "keydown", (o) => {
-    if (!["INPUT", "TEXTAREA"].includes(o.target.tagName) && Eo.includes(o.code)) {
+    if (!["INPUT", "TEXTAREA"].includes(o.target.tagName) && wo.includes(o.code)) {
       const s = o.code, { translateX: c, translateY: u, scale: l } = r();
       o.altKey || o.metaKey || o.ctrlKey || o.shiftKey ? t((d) => ({
         ...d,
@@ -3375,7 +3393,7 @@ const vo = H({
       })) : e[s] && n(e[s]), o.preventDefault();
     }
   }), null;
-}, wo = ({ children: e, moveFirst: t = !1 }) => {
+}, Ro = ({ children: e, moveFirst: t = !1 }) => {
   const r = g.useRef(null), [
     n,
     o,
@@ -3393,8 +3411,8 @@ const vo = H({
     p.getConfiguration,
     p.updateBoardState,
     p.getSelection
-  ]), { zoomToCenter: l, zoomToExtent: d, moveBoard: f } = Me(), [a, h] = g.useState(!1), _ = g.useRef({}), v = bo(r);
-  Co();
+  ]), { zoomToCenter: l, zoomToExtent: d, moveBoard: f } = Me(), [a, h] = g.useState(!1), _ = g.useRef({}), v = Co(r);
+  xo();
   const E = g.useCallback(() => {
     const { itemExtent: p } = s();
     d(p);
@@ -3471,7 +3489,7 @@ const vo = H({
       )
     }
   );
-}, xo = H({
+}, Io = H({
   position: "absolute",
   top: 0,
   left: 0,
@@ -3479,7 +3497,7 @@ const vo = H({
   backgroundColor: "hsla(0, 40%, 50%, 0%)",
   border: "2px dashed hsl(20, 55%, 40%)",
   pointerEvents: "none"
-}), Ro = () => {
+}), Oo = () => {
   const [
     e,
     t,
@@ -3504,7 +3522,7 @@ const vo = H({
       n(null);
       return;
     }
-    const v = nn(a, _);
+    const v = sn(a, _);
     if (!v) {
       n(null);
       return;
@@ -3535,16 +3553,16 @@ const vo = H({
         height: `${r.height}px`,
         width: `${r.width}px`
       },
-      className: `selection ${xo}`
+      className: `selection ${Io}`
     }
   );
-}, Io = () => {
+}, To = () => {
   const [e] = Z((t) => [t.boardState.movingItems]);
-  return e ? null : /* @__PURE__ */ T(Ro, {});
-}, Oo = typeof window < "u" && typeof navigator < "u" && typeof document < "u";
+  return e ? null : /* @__PURE__ */ T(Oo, {});
+}, ko = typeof window < "u" && typeof navigator < "u" && typeof document < "u";
 let Le;
-function To() {
-  if (!Oo)
+function Po() {
+  if (!ko)
     return;
   if (Le)
     return Le;
@@ -3566,8 +3584,8 @@ function To() {
     }
   }, Le;
 }
-function ko(e, t, r = !0) {
-  const n = r && To(), o = pt(t), s = e && "current" in e ? e.current : e;
+function Mo(e, t, r = !0) {
+  const n = r && Po(), o = pt(t), s = e && "current" in e ? e.current : e;
   Pe(() => {
     const c = e && "current" in e ? e.current : e;
     if (!n || !c)
@@ -3581,97 +3599,97 @@ function ko(e, t, r = !0) {
     };
   }, [s, n]);
 }
-function Jt(e, t, r) {
+function Zt(e, t, r) {
   return Math.min(Math.max(e, r), t);
 }
-class Po extends Error {
+class Do extends Error {
   constructor(t) {
     super(`Failed to parse color: "${t}"`);
   }
 }
-var xe = Po;
-function Mo(e) {
+var xe = Do;
+function jo(e) {
   if (typeof e != "string")
     throw new xe(e);
   if (e.trim().toLowerCase() === "transparent")
     return [0, 0, 0, 0];
   let t = e.trim();
-  t = Bo.test(e) ? $o(e) : e;
-  const r = Ao.exec(t);
+  t = Xo.test(e) ? Lo(e) : e;
+  const r = zo.exec(t);
   if (r) {
     const c = Array.from(r).slice(1);
     return [...c.slice(0, 3).map((u) => parseInt(ke(u, 2), 16)), parseInt(ke(c[3] || "f", 2), 16) / 255];
   }
-  const n = Lo.exec(t);
+  const n = Yo.exec(t);
   if (n) {
     const c = Array.from(n).slice(1);
     return [...c.slice(0, 3).map((u) => parseInt(u, 16)), parseInt(c[3] || "ff", 16) / 255];
   }
-  const o = zo.exec(t);
+  const o = Bo.exec(t);
   if (o) {
     const c = Array.from(o).slice(1);
     return [...c.slice(0, 3).map((u) => parseInt(u, 10)), parseFloat(c[3] || "1")];
   }
-  const s = Yo.exec(t);
+  const s = No.exec(t);
   if (s) {
     const [c, u, l, d] = Array.from(s).slice(1).map(parseFloat);
-    if (Jt(0, 100, u) !== u)
+    if (Zt(0, 100, u) !== u)
       throw new xe(e);
-    if (Jt(0, 100, l) !== l)
+    if (Zt(0, 100, l) !== l)
       throw new xe(e);
-    return [...No(c, u, l), Number.isNaN(d) ? 1 : d];
+    return [...Uo(c, u, l), Number.isNaN(d) ? 1 : d];
   }
   throw new xe(e);
 }
-function Do(e) {
+function $o(e) {
   let t = 5381, r = e.length;
   for (; r; )
     t = t * 33 ^ e.charCodeAt(--r);
   return (t >>> 0) % 2341;
 }
-const Zt = (e) => parseInt(e.replace(/_/g, ""), 36), jo = "1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce((e, t) => {
-  const r = Zt(t.substring(0, 3)), n = Zt(t.substring(3)).toString(16);
+const Qt = (e) => parseInt(e.replace(/_/g, ""), 36), Ao = "1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce((e, t) => {
+  const r = Qt(t.substring(0, 3)), n = Qt(t.substring(3)).toString(16);
   let o = "";
   for (let s = 0; s < 6 - n.length; s++)
     o += "0";
   return e[r] = `${o}${n}`, e;
 }, {});
-function $o(e) {
-  const t = e.toLowerCase().trim(), r = jo[Do(t)];
+function Lo(e) {
+  const t = e.toLowerCase().trim(), r = Ao[$o(t)];
   if (!r)
     throw new xe(e);
   return `#${r}`;
 }
-const ke = (e, t) => Array.from(Array(t)).map(() => e).join(""), Ao = new RegExp(`^#${ke("([a-f0-9])", 3)}([a-f0-9])?$`, "i"), Lo = new RegExp(`^#${ke("([a-f0-9]{2})", 3)}([a-f0-9]{2})?$`, "i"), zo = new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${ke(",\\s*(\\d+)\\s*", 2)}(?:,\\s*([\\d.]+))?\\s*\\)$`, "i"), Yo = /^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i, Bo = /^[a-z]+$/i, Qt = (e) => Math.round(e * 255), No = (e, t, r) => {
+const ke = (e, t) => Array.from(Array(t)).map(() => e).join(""), zo = new RegExp(`^#${ke("([a-f0-9])", 3)}([a-f0-9])?$`, "i"), Yo = new RegExp(`^#${ke("([a-f0-9]{2})", 3)}([a-f0-9]{2})?$`, "i"), Bo = new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${ke(",\\s*(\\d+)\\s*", 2)}(?:,\\s*([\\d.]+))?\\s*\\)$`, "i"), No = /^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i, Xo = /^[a-z]+$/i, er = (e) => Math.round(e * 255), Uo = (e, t, r) => {
   let n = r / 100;
   if (t === 0)
-    return [n, n, n].map(Qt);
+    return [n, n, n].map(er);
   const o = (e % 360 + 360) % 360 / 60, s = (1 - Math.abs(2 * n - 1)) * (t / 100), c = s * (1 - Math.abs(o % 2 - 1));
   let u = 0, l = 0, d = 0;
   o >= 0 && o < 1 ? (u = s, l = c) : o >= 1 && o < 2 ? (u = c, l = s) : o >= 2 && o < 3 ? (l = s, d = c) : o >= 3 && o < 4 ? (l = c, d = s) : o >= 4 && o < 5 ? (u = c, d = s) : o >= 5 && o < 6 && (u = s, d = c);
   const f = n - s / 2, a = u + f, h = l + f, _ = d + f;
-  return [a, h, _].map(Qt);
+  return [a, h, _].map(er);
 };
-function Xo(e) {
+function Wo(e) {
   if (e === "transparent")
     return 0;
   function t(s) {
     const c = s / 255;
     return c <= 0.03928 ? c / 12.92 : Math.pow((c + 0.055) / 1.055, 2.4);
   }
-  const [r, n, o] = Mo(e);
+  const [r, n, o] = jo(e);
   return 0.2126 * t(r) + 0.7152 * t(n) + 0.0722 * t(o);
 }
-function Uo(e) {
-  return Xo(e) > 0.179;
+function Vo(e) {
+  return Wo(e) > 0.179;
 }
-const Wo = H({
+const Fo = H({
   display: "flex",
   flexDirection: "row",
   alignItems: "center",
   zIndex: 210,
   pointerEvents: "none"
-}), Vo = H({
+}), Ko = H({
   fontWeight: "bold",
   padding: "0 0.5em",
   borderRadius: "2px",
@@ -3682,9 +3700,9 @@ const Wo = H({
   marginTop: "1.7em",
   whitespace: "nowrap",
   pointerEvents: "none"
-}), Fo = ({ color: e = "#666", size: t = 40, text: r }) => {
-  const n = Uo(e) ? "#222" : "#EEE";
-  return /* @__PURE__ */ ue("div", { className: Wo, children: [
+}), Ho = ({ color: e = "#666", size: t = 40, text: r }) => {
+  const n = Vo(e) ? "#222" : "#EEE";
+  return /* @__PURE__ */ ue("div", { className: Fo, children: [
     /* @__PURE__ */ ue(
       "svg",
       {
@@ -3724,28 +3742,32 @@ const Wo = H({
           color: n,
           backgroundColor: e
         },
-        className: Vo,
+        className: Ko,
         children: r
       }
     )
   ] });
-}, Ko = g.memo(Fo), Ho = H({
+}, qo = g.memo(Ho), Go = H({
   top: 0,
   left: 0,
   zIndex: 210,
   position: "fixed",
   pointerEvents: "none"
-}), qo = ({ pos: e, ...t }) => /* @__PURE__ */ T(
+}), Jo = ({ pos: e, ...t }) => /* @__PURE__ */ T(
   "div",
   {
-    className: Ho,
+    className: Go,
     style: {
       transform: `translate(${e.x - 6}px, ${e.y - 15}px)`
     },
-    children: /* @__PURE__ */ T(Ko, { ...t })
+    children: /* @__PURE__ */ T(qo, { ...t })
   }
-), Go = ({ children: e }) => {
-  const [t] = Z((v) => [v.getConfiguration]), { fromWrapperToBoard: r, fromBoardToWrapper: n } = Me(), [o, s, c, u] = Se(
+), Zo = ({ children: e }) => {
+  const [t] = Z((v) => [
+    v.getConfiguration,
+    v.boardState.scale
+    // We want to update this component when the scale changes
+  ]), { fromWrapperToBoard: r, fromBoardToWrapper: n } = Me(), [o, s, c, u] = Se(
     (v) => [
       v.getUser(),
       v.getLocalUsers(),
@@ -3772,7 +3794,7 @@ const Wo = H({
         y: y + f.top
       };
       return ft(w, f) ? /* @__PURE__ */ T(
-        qo,
+        Jo,
         {
           pos: w,
           text: u[v].name,
@@ -3782,19 +3804,19 @@ const Wo = H({
       ) : null;
     })
   ] });
-}, Jo = ({ children: e }) => e, Zo = {
+}, Qo = ({ children: e }) => e, es = {
   overflow: "hidden",
   position: "absolute",
   inset: 0
-}, ps = ({
+}, gs = ({
   moveFirst: e = !0,
   style: t,
   wrapperStyle: r,
   itemTemplates: n = {},
-  boardSize: o = ir,
+  boardSize: o = cr,
   children: s,
   showResizeHandle: c = !1,
-  Wrapper: u = Jo
+  Wrapper: u = Qo
 }) => {
   const l = g.useRef(null), [d, f] = Z((v) => [
     v.config.uid,
@@ -3831,12 +3853,12 @@ const Wo = H({
     f({
       boardWrapperRect: l.current.getBoundingClientRect()
     }), a(), setTimeout(a, 2e3);
-  }, [f, a]), ko(l, () => {
+  }, [f, a]), Mo(l, () => {
     l.current && f({
       boardWrapperRect: l.current.getBoundingClientRect()
     });
   });
-  const _ = H({ ...Zo, ...r });
+  const _ = H({ ...es, ...r });
   return /* @__PURE__ */ ue(
     "div",
     {
@@ -3844,7 +3866,7 @@ const Wo = H({
       id: d,
       className: `sync-board ${_}`,
       children: [
-        /* @__PURE__ */ T(Go, { children: /* @__PURE__ */ T(So, { moveFirst: e, children: /* @__PURE__ */ T(wo, { moveFirst: e, children: /* @__PURE__ */ T(_o, { moveFirst: e, children: /* @__PURE__ */ T(u, { children: /* @__PURE__ */ ue(
+        /* @__PURE__ */ T(Zo, { children: /* @__PURE__ */ T(bo, { moveFirst: e, children: /* @__PURE__ */ T(Ro, { moveFirst: e, children: /* @__PURE__ */ T(Eo, { moveFirst: e, children: /* @__PURE__ */ T(u, { children: /* @__PURE__ */ ue(
           "div",
           {
             onContextMenu: (v) => {
@@ -3853,34 +3875,34 @@ const Wo = H({
             style: h,
             className: "board",
             children: [
-              /* @__PURE__ */ T(fo, {}),
+              /* @__PURE__ */ T(mo, {}),
               s
             ]
           }
         ) }) }) }) }) }),
-        /* @__PURE__ */ T(Io, {})
+        /* @__PURE__ */ T(To, {})
       ]
     }
   );
 };
-Un(g.createElement);
+Vn(g.createElement);
 export {
-  ps as Board,
-  fs as BoardWrapper,
-  ds as RoomWrapper,
-  os as useAvailableActions,
-  as as useBoardConfig,
+  gs as Board,
+  ps as BoardWrapper,
+  ms as RoomWrapper,
+  is as useAvailableActions,
+  us as useBoardConfig,
   Me as useBoardPosition,
-  cs as useBoardState,
-  rs as useDebouncedItems,
+  ls as useBoardState,
+  os as useDebouncedItems,
   gt as useItemActions,
-  Wt as useItemInteraction,
-  ts as useItems,
-  ls as useMessage,
-  ns as useSelectedItems,
-  ss as useSelectionBox,
-  us as useSessionInfo,
-  is as useUsers,
+  Vt as useItemInteraction,
+  ns as useItems,
+  ds as useMessage,
+  ss as useSelectedItems,
+  as as useSelectionBox,
+  fs as useSessionInfo,
+  cs as useUsers,
   Xe as useWire
 };
 //# sourceMappingURL=react-sync-board.js.map