react-sync-board 1.3.0 → 1.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/react-sync-board.js +713 -1240
  2. package/dist/react-sync-board.js.map +1 -1
  3. package/dist/react-sync-board.umd.cjs +13 -18
  4. package/dist/react-sync-board.umd.cjs.map +1 -1
  5. package/package.json +1 -1
package/dist/react-sync-board.umd.cjs CHANGED
@@ -1,38 +1,33 @@
1
- (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react")):typeof define==`function`&&define.amd?define([`exports`,`react`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`React-sync-board`]={},e.React))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=Object.create,r=Object.defineProperty,i=Object.getOwnPropertyDescriptor,a=Object.getOwnPropertyNames,o=Object.getPrototypeOf,s=Object.prototype.hasOwnProperty,c=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports),l=(e,t,n,o)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var c=a(t),l=0,u=c.length,d;l<u;l++)d=c[l],!s.call(e,d)&&d!==n&&r(e,d,{get:(e=>t[e]).bind(null,d),enumerable:!(o=i(t,d))||o.enumerable});return e},u=(e,t,i)=>(i=e==null?{}:n(o(e)),l(t||!e||!e.__esModule||!s.call(e,`default`)?r(i,`default`,{value:e,enumerable:!0}):i,e));t=u(t,1);var d=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((e,t)=>(t&=63,e+=t<36?t.toString(36):t<62?(t-26).toString(36).toUpperCase():t>62?`-`:`_`,e),``),f=class{constructor(e,t,n=null){this._socket=e,this.userId=n,this.room=t,this.toUnregister=[()=>{this._socket.off(`${this.room}.isMaster`),this._socket.off(`${this.room}.roomJoined`),this._socket.off(`${this.room}._call`)}],this._left=!1,this.registeredRPC={},this._socket.on(`${this.room}._call`,async({callId:t,name:n,params:r})=>{try{let i=await this.registeredRPC[n](r);e.emit(`${this.room}._result.${t}`,{ok:i||null})}catch(n){e.emit(`${this.room}._result.${t}`,{err:`${n.message}`})}})}async _callServerRPC(e,t){let n=d();return new Promise((r,i)=>{this._socket.once(`${this.room}._result.${n}`,e=>{e.hasOwnProperty(`ok`)?r(e.ok):i(e.err)}),this._socket.emit(`${this.room}._call`,{callId:n,name:e,params:t})})}leave(){this._left=!0,this.toUnregister.forEach(e=>{e()}),this._socket.emit(`${this.room}.leave`)}publish(e,t,n=!1){this._socket.emit(`${this.room}.publish`,{name:e,params:t,self:n})}subscribe(e,t){this._socket.on(`${this.room}.${e}`,t);let n=()=>{this._socket.off(`${this.room}.${e}`,t)};return this.toUnregister.push(n),n}async register(e,t,{invoke:n=`single`}={}){this.registeredRPC[e]=t,await this._callServerRPC(`register`,{name:e,invoke:n});let r=()=>{if(this.registeredRPC[e]===t)return delete this.registeredRPC[e],this._callServerRPC(`unregister`,{name:e})};return this.toUnregister.push(r),r}async call(e,t){return await this._callServerRPC(`call`,{name:e,params:t})}},p=({socket:e,room:t,onJoined:n=()=>{},onMaster:r=()=>{},userId:i=null})=>{let a=new f(e,t,i);return new Promise(o=>{let s=!0;e.on(`${t}.isMaster`,()=>{a._left||r(t)}),e.on(`${t}.roomJoined`,e=>{a._left||(a.userId=e,s=!1,n(a),o(a))}),e.on(`connect`,()=>{a._left||s||e.emit(`joinSuperSocket`,{room:t,userId:a.userId})}),e.emit(`joinSuperSocket`,{room:t,userId:i})})},m=c((e=>{var t=Symbol.for(`react.transitional.element`),n=Symbol.for(`react.fragment`);function r(e,n,r){var i=null;if(r!==void 0&&(i=``+r),n.key!==void 0&&(i=``+n.key),`key`in n)for(var a in r={},n)a!==`key`&&(r[a]=n[a]);else r=n;return n=r.ref,{$$typeof:t,type:e,key:i,ref:n===void 0?null:n,props:r}}e.Fragment=n,e.jsx=r,e.jsxs=r})),h=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return null;if(typeof e==`function`)return e.$$typeof===te?null:e.displayName||e.name||null;if(typeof e==`string`)return e;switch(e){case _:return`Fragment`;case y:return`Profiler`;case v:return`StrictMode`;case C:return`Suspense`;case w:return`SuspenseList`;case ee:return`Activity`;case D:return`ViewTransition`}if(typeof e==`object`)switch(typeof e.tag==`number`&&console.error(`Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue.`),e.$$typeof){case g:return`Portal`;case x:return e.displayName||`Context`;case b:return(e._context.displayName||`Context`)+`.Consumer`;case S:var n=e.render;return e=e.displayName,e||=(e=n.displayName||n.name||``,e===``?`ForwardRef`:`ForwardRef(`+e+`)`),e;case T:return n=e.displayName||null,n===null?t(e.type)||`Memo`:n;case E:n=e._payload,e=e._init;try{return t(e(n))}catch{}}return null}function n(e){return``+e}function r(e){try{n(e);var t=!1}catch{t=!0}if(t){t=console;var r=t.error,i=typeof Symbol==`function`&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||`Object`;return r.call(t,`The provided key is an unsupported type %s. This value must be coerced to a string before using it here.`,i),n(e)}}function i(e){if(e===_)return`<>`;if(typeof e==`object`&&e&&e.$$typeof===E)return`<...>`;try{var n=t(e);return n?`<`+n+`>`:`<...>`}catch{return`<...>`}}function a(){var e=O.A;return e===null?null:e.getOwner()}function o(){return Error(`react-stack-top-frame`)}function s(e){if(k.call(e,`key`)){var t=Object.getOwnPropertyDescriptor(e,`key`).get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function c(e,t){function n(){re||(re=!0,console.error("%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://react.dev/link/special-props)",t))}n.isReactWarning=!0,Object.defineProperty(e,"key",{get:n,configurable:!0})}function l(){var e=t(this.type);return j[e]||(j[e]=!0,console.error(`Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.`)),e=this.props.ref,e===void 0?null:e}function u(e,t,n,r,i,a){var o=n.ref;return e={$$typeof:h,type:e,key:t,props:n,_owner:r},(o===void 0?null:o)===null?Object.defineProperty(e,"ref",{enumerable:!1,value:null}):Object.defineProperty(e,"ref",{enumerable:!1,get:l}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:i}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:a}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function d(e,n,i,o,l,d){var p=n.children;if(p!==void 0){if(o){if(ne(p)){for(o=0;o<p.length;o++)f(p[o]);Object.freeze&&Object.freeze(p)}else console.error(`React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.`)}else f(p)}if(k.call(n,`key`)){p=t(e);var m=Object.keys(n).filter(function(e){return e!==`key`});o=0<m.length?`{key: someKey, `+m.join(`: ..., `)+`: ...}`:`{key: someKey}`,P[p+o]||(m=0<m.length?`{`+m.join(`: ..., `)+`: ...}`:`{}`,console.error(`A props object containing a "key" prop is being spread into JSX:
2
- let props = %s;
3
- <%s {...props} />
4
- React keys must be passed directly to JSX without using spread:
5
- let props = %s;
6
- <%s key={someKey} {...props} />`,o,p,m,p),P[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),ee=Symbol.for(`react.activity`),D=Symbol.for(`react.view_transition`),te=Symbol.for(`react.client.reference`),O=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,k=Object.prototype.hasOwnProperty,ne=Array.isArray,A=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var re,j={},M=m.react_stack_bottom_frame.bind(m,o)(),N=A(i(o)),P={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>O.recentlyCreatedOwnerStacks++;if(r){var a=Error.stackTraceLimit;Error.stackTraceLimit=10;var o=Error(`react-stack-top-frame`);Error.stackTraceLimit=a}else o=M;return d(e,t,n,!1,o,r?A(i(e)):N)},e.jsxs=function(e,t,n){var r=1e4>O.recentlyCreatedOwnerStacks++;if(r){var a=Error.stackTraceLimit;Error.stackTraceLimit=10;var o=Error(`react-stack-top-frame`);Error.stackTraceLimit=a}else o=M;return d(e,t,n,!0,o,r?A(i(e)):N)}})()})),g=c(((e,t)=>{t.exports=process.env.NODE_ENV===`production`?m():h()}))(),_=t.default.createContext(),v=()=>(0,g.jsx)(`div`,{style:{position:`absolute`,top:`0`,bottom:`0`,width:`100%`,display:`flex`,justifyContent:`center`,alignItems:`center`},children:(0,g.jsx)(`h2`,{children:`🌀 Loading...`})}),y=({socket:e,room:n,channel:r=`default`,LoadingComponent:i=v,children:a})=>{let[o,s]=t.default.useState(!1),[c,l]=t.default.useState(!1),[u,d]=t.default.useState(null),f=t.default.useRef(null),m=t.default.useRef(!1),h=(0,t.useContext)(_),y=t.default.useRef(!1);return t.default.useEffect(()=>(m.current=!0,()=>{m.current=!1}),[]),t.default.useEffect(()=>{if(!e)return null;let t=()=>{console.log(`Disconnected from ${r}…`),m.current&&(s(!1),l(!1))};return e.on(`disconnect`,t),()=>{e.off(`disconnect`,t)}},[r,e]),t.default.useEffect(()=>e?(e.connected||e.connect(),console.log(`Try to connect to wire ${n} on channel ${r}`),y.current||(y.current=!0,p({socket:e,room:n,onMaster:()=>{console.log(`Is now master on channel ${r}…`),m.current&&l(!0)},onJoined:e=>{console.log(`Connected on channel ${r}…`),f.current=e,m.current&&(d(e),s(!0))}})),()=>{f.current?.leave()}):null,[r,n,e]),!o||!u?(0,g.jsx)(i,{}):(0,g.jsx)(_.Provider,{value:{...h,[r]:{wire:u,joined:o,isMaster:c,room:n}},children:a})},b=(e=`default`)=>((0,t.useContext)(_)||{})[e],x=e=>{let t,n=new Set,r=(e,r)=>{let i=typeof e==`function`?e(t):e;if(!Object.is(i,t)){let e=t;t=r??(typeof i!=`object`||!i)?i:Object.assign({},t,i),n.forEach(n=>n(t,e))}},i=()=>t,a={setState:r,getState:i,getInitialState:()=>o,subscribe:e=>(n.add(e),()=>n.delete(e))},o=t=e(r,i,a);return a},S=(e=>e?x(e):x),C=c((e=>{var t=require("react");function n(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}var r=typeof Object.is==`function`?Object.is:n,i=t.useState,a=t.useEffect,o=t.useLayoutEffect,s=t.useDebugValue;function c(e,t){var n=t(),r=i({inst:{value:n,getSnapshot:t}}),c=r[0].inst,u=r[1];return o(function(){c.value=n,c.getSnapshot=t,l(c)&&u({inst:c})},[e,n,t]),a(function(){return l(c)&&u({inst:c}),e(function(){l(c)&&u({inst:c})})},[e]),s(n),n}function l(e){var t=e.getSnapshot;e=e.value;try{var n=t();return!r(e,n)}catch{return!0}}function u(e,t){return t()}var d=typeof window>`u`||window.document===void 0||window.document.createElement===void 0?u:c;e.useSyncExternalStore=t.useSyncExternalStore===void 0?d:t.useSyncExternalStore})),w=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}function n(e,t){d||a.startTransition===void 0||(d=!0,console.error(`You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release.`));var n=t();if(!f){var i=t();o(n,i)||(console.error(`The result of getSnapshot should be cached to avoid an infinite loop`),f=!0)}i=s({inst:{value:n,getSnapshot:t}});var p=i[0].inst,m=i[1];return l(function(){p.value=n,p.getSnapshot=t,r(p)&&m({inst:p})},[e,n,t]),c(function(){return r(p)&&m({inst:p}),e(function(){r(p)&&m({inst:p})})},[e]),u(n),n}function r(e){var t=e.getSnapshot;e=e.value;try{var n=t();return!o(e,n)}catch{return!0}}function i(e,t){return t()}typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart==`function`&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var a=require("react"),o=typeof Object.is==`function`?Object.is:t,s=a.useState,c=a.useEffect,l=a.useLayoutEffect,u=a.useDebugValue,d=!1,f=!1,p=typeof window>`u`||window.document===void 0||window.document.createElement===void 0?i:n;e.useSyncExternalStore=a.useSyncExternalStore===void 0?p:a.useSyncExternalStore,typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop==`function`&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())})()})),T=c(((e,t)=>{t.exports=process.env.NODE_ENV===`production`?C():w()})),E=c((e=>{var t=require("react"),n=T();function r(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}var i=typeof Object.is==`function`?Object.is:r,a=n.useSyncExternalStore,o=t.useRef,s=t.useEffect,c=t.useMemo,l=t.useDebugValue;e.useSyncExternalStoreWithSelector=function(e,t,n,r,u){var d=o(null);if(d.current===null){var f={hasValue:!1,value:null};d.current=f}else f=d.current;d=c(function(){function e(e){if(!a){if(a=!0,o=e,e=r(e),u!==void 0&&f.hasValue){var t=f.value;if(u(t,e))return s=t}return s=e}if(t=s,i(o,e))return t;var n=r(e);return u!==void 0&&u(t,n)?(o=e,t):(o=e,s=n)}var a=!1,o,s,c=n===void 0?null:n;return[function(){return e(t())},c===null?void 0:function(){return e(c())}]},[t,n,r,u]);var p=a(e,d[0],d[1]);return s(function(){f.hasValue=!0,f.value=p},[p]),l(p),p}})),ee=c((e=>{process.env.NODE_ENV!==`production`&&(function(){function t(e,t){return e===t&&(e!==0||1/e==1/t)||e!==e&&t!==t}typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart==`function`&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());var n=require("react"),r=T(),i=typeof Object.is==`function`?Object.is:t,a=r.useSyncExternalStore,o=n.useRef,s=n.useEffect,c=n.useMemo,l=n.useDebugValue;e.useSyncExternalStoreWithSelector=function(e,t,n,r,u){var d=o(null);if(d.current===null){var f={hasValue:!1,value:null};d.current=f}else f=d.current;d=c(function(){function e(e){if(!a){if(a=!0,o=e,e=r(e),u!==void 0&&f.hasValue){var t=f.value;if(u(t,e))return s=t}return s=e}if(t=s,i(o,e))return t;var n=r(e);return u!==void 0&&u(t,n)?(o=e,t):(o=e,s=n)}var a=!1,o,s,c=n===void 0?null:n;return[function(){return e(t())},c===null?void 0:function(){return e(c())}]},[t,n,r,u]);var p=a(e,d[0],d[1]);return s(function(){f.hasValue=!0,f.value=p},[p]),l(p),p},typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<`u`&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop==`function`&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error())})()})),{useSyncExternalStoreWithSelector:D}=u(c(((e,t)=>{t.exports=process.env.NODE_ENV===`production`?E():ee()}))(),1).default,te=e=>e;function O(e,n=te,r){let i=D(e.subscribe,e.getState,e.getInitialState,n,r);return t.default.useDebugValue(i),i}var k=e=>Symbol.iterator in e,ne=e=>`entries`in e,A=(e,t)=>{let n=e instanceof Map?e:new Map(e.entries()),r=t instanceof Map?t:new Map(t.entries());if(n.size!==r.size)return!1;for(let[e,t]of n)if(!r.has(e)||!Object.is(t,r.get(e)))return!1;return!0},re=(e,t)=>{let n=e[Symbol.iterator](),r=t[Symbol.iterator](),i=n.next(),a=r.next();for(;!i.done&&!a.done;){if(!Object.is(i.value,a.value))return!1;i=n.next(),a=r.next()}return!!i.done&&!!a.done};function j(e,t){return Object.is(e,t)?!0:typeof e!=`object`||!e||typeof t!=`object`||!t||Object.getPrototypeOf(e)!==Object.getPrototypeOf(t)?!1:k(e)&&k(t)?ne(e)&&ne(t)?A(e,t):re(e,t):A({entries:()=>Object.entries(e)},{entries:()=>Object.entries(t)})}var M=(e,t)=>e.classList&&e.classList.contains(t),N=(e,t)=>M(e,t)?e:e.parentNode?N(e.parentNode,t):!1,P=([e,t],[n,r])=>{let i=Math.abs(e-n),a=Math.abs(t-r);return Math.hypot(i,a)},ie=(e,t,n)=>{let r=n*Math.PI/180;return[e*Math.cos(r)-t*Math.sin(r),e*Math.sin(r)+t*Math.cos(r)]},ae=([e,t],{scale:n,rotate:r,translateX:i,translateY:a})=>ie((e-i)/n,(t-a)/n,-r),F=([e,t],{scale:n,rotate:r,translateX:i,translateY:a})=>{let[o,s]=ie(e,t,r);return[o*n+i,s*n+a]},oe=(e,t,n,r)=>{let i=e.x,a=e.y,o=t.x,s=t.y,c=n.x,l=n.y,u=o-i,d=s-a,f=i-c,p=a-l,m=u*u+d*d,h=2*(f*u+p*d),g=f*f+p*p-r*r,_=h*h-4*m*g;if(_<0)return[];let v=(-h+Math.sqrt(_))/(2*m),y=(-h-Math.sqrt(_))/(2*m),b=[];return v>=0&&v<=1&&b.push({x:i+v*u,y:a+v*d}),y>=0&&y<=1&&b.push({x:i+y*u,y:a+y*d}),b},se=(e,t)=>e.x>t.left&&e.x<t.left+t.width&&e.y>t.top&&e.y<t.top+t.height,ce=(e,t)=>Array.from(e.querySelectorAll(`.corner`)).every(e=>{let{top:n,left:r}=e.getBoundingClientRect();return se({x:r,y:n},t)}),le=(e,t)=>ce(e,t.getBoundingClientRect()),I=(e,t)=>{try{return document.getElementById(`${e}__${t}`)}catch{console.error(`Error while getting item with id ${t} inside wrapper`,e);return}},L=e=>{let t=e?.dataset?.id;return t||console.error(`getIdFromElem call fails`,e,JSON.stringify(e?.dataset),e?.dataset?.id),t},ue=(e,t)=>{let n=e.reduce((e,n)=>{let r=I(t,n);if(!r)return e||null;let{left:i,right:a,top:o,bottom:s}=r.getBoundingClientRect(),c;return c=e||{left:i,top:o,right:a,bottom:s},c.left=Math.min(i,c.left),c.top=Math.min(o,c.top),c.right=Math.max(a,c.right),c.bottom=Math.max(s,c.bottom),c},null);return n&&(n.width=n.right-n.left,n.height=n.bottom-n.top,n)},de=(e,t,n=null)=>(n===null&&(n=new Set),!Array.isArray(t)||t.length===0?[]:t.map(t=>n.has(t)?[]:(n.add(t),e[t]?[t,...de(e,e[t].linkedItems,n)]:[])).flat()),fe=(e,t,n)=>{let r=new Set(de(e,n));return t.filter(e=>r.has(e))},pe=({x:e,y:t,width:n,height:r},{type:i=`grid`,size:a=1,offset:o={x:0,y:0}})=>{let[s,c]=[e+n/2-o.x,t+r/2-o.y],l,u,d,f,p,m,h,g,_,v,y=a/1.1547;switch(i){case`grid`:l=Math.round(s/a)*a,u=Math.round(c/a)*a;break;case`hexH`:d=2*y,f=3*a,p=Math.round(s/d)*d,h=Math.round(c/f)*f,m=p>s?p-y:p+y,g=h>c?h-1.5*a:h+1.5*a,_=Math.hypot(p-s,h-c),v=Math.hypot(m-s,g-c),_<v?(l=p,u=h):(l=m,u=g);break;case`hexV`:d=3*a,f=2*y,p=Math.round(s/d)*d,h=Math.round(c/f)*f,m=p>s?p-1.5*a:p+1.5*a,g=h>c?h-y:h+y,_=Math.hypot(p-s,h-c),v=Math.hypot(m-s,g-c),_<v?(l=p,u=h):(l=m,u=g);break;default:l=e+n/2,u=t+r/2}return{x:l+o.x-n/2,y:u+o.y-r/2}},me=`#037758.#99092a.#067070.#c6650f.#008726.#3d7004.#348402.#057f58.#b58612.#c44c01.#0a7704.#0e910e.#027377.#c99e02.#054160.#157a01.#b10de2.#0d6289.#bc5d03.#ba0cd1.#d39f10.#0c4c7a.#460782.#a51f10.#cecb10.#9b0943.#607f0c.#007a4b.#bf0daa.#af0ad8`.split(`.`),he=()=>me[Math.floor(Math.random()*me.length)],ge=({wire:e,storeName:t,noSync:n=[],defaultValue:r},i)=>(a,o,s)=>{a({ready:!1});let c=[];(async()=>{try{let n=await e.call(`${t}_getValue`);a(e=>({...e,...n}))}catch{r!==void 0&&a(r)}c.push(await e.register(`${t}_getValue`,()=>Object.fromEntries(Object.entries(o()).filter(([e,t])=>typeof t!=`function`&&!n.includes(e))),{invoke:`first`})),c.push(e.subscribe(`${t}_call`,([e,t])=>{u[e](...t)})),a({ready:!0})})();let l=i(a,o,s),u={...l},d=Object.fromEntries(Object.entries(l).map(([r,i])=>typeof i==`function`&&!r.startsWith(`get`)&&!n.includes(r)?[r,(...n)=>{let a=i(...n);return e.publish(`${t}_call`,[r,n]),a}]:[r,i]));return d.unsub=()=>{c.forEach(e=>e())},d},_e=t.default.createContext(),ve=(e,t)=>({items:{},getItems:()=>t().items,setItems:t=>e({items:t}),updateItems:(t,n=!1)=>e(e=>n?{items:Object.fromEntries(Object.entries(e.items).map(([e,n])=>t[e]?[e,{...n,...t[e]}]:[e,n]))}:{items:{...e.items,...t}}),moveItems:(t,n)=>e(({items:e})=>{let r={...e};return t.forEach(t=>{let i=e[t];i&&(r[t]={...i,x:(i.x||0)+n.x,y:(i.y||0)+n.y,moving:!0})}),{items:r}})}),ye=(e,t)=>({itemIds:[],setItemIds:t=>e({itemIds:t}),getItemIds:()=>t().itemIds,insert:(t,n)=>e(e=>{let r=[...e.itemIds];return r.splice(t,0,n),{itemIds:r}}),remove:t=>e(e=>{let n=[...e.itemIds];return n.splice(t,1),{itemIds:n}}),updateItemIds:(t,n)=>e(e=>{let r=[...e.itemIds];return r[t]=n,{itemIds:r}}),updateManyItemIds:t=>e(e=>({itemIds:e.itemIds.map((e,n)=>t[n]===void 0?e:t[n])}))}),be=(e,t)=>({removeItemsById:t=>e(e=>({itemIds:e.itemIds.filter(e=>!t.includes(e)),items:Object.fromEntries(Object.entries(e.items).filter(([e])=>!t.includes(e)))})),getItemList:()=>{let e=t().items;return t().itemIds.map(t=>e[t])},setItemList:t=>e({items:Object.fromEntries(t.map(e=>[e.id,e])),itemIds:t.map(({id:e})=>e)}),insertItems:(t,n)=>e(e=>{let r,i=t.map(({id:e})=>e);if(n){let t=e.itemIds.findIndex(e=>e===n);r=[...e.itemIds],r.splice(t,0,...i)}else r=[...e.itemIds,...i];return{items:{...e.items,...Object.fromEntries(t.map(e=>[e.id,e]))},itemIds:r}})}),xe=(e,t)=>({boardConfig:{},getBoardConfig:()=>t().boardConfig,setBoardConfig:t=>e({boardConfig:t}),updateBoardConfig:t=>e(e=>({boardConfig:{...e.boardConfig,...t}}))}),Se=(e,t)=>({session:{},getSessionInfo:()=>t().session,setSessionInfo:t=>e({session:t}),updateSessionInfo:t=>e(e=>({session:{...e.session,...t}}))}),Ce=({storeName:e,children:n,defaultValue:r})=>{let{wire:i}=b(`room`),[a,o]=t.default.useState(!1),[s]=t.default.useState(()=>S(ge({wire:i,storeName:e,defaultValue:r},(...e)=>({...ve(...e),...ye(...e),...be(...e),...xe(...e),...Se(...e)}))));return t.default.useEffect(()=>{let e=s.subscribe(t=>{t.ready&&(e(),o(!0))})},[s]),a?(0,g.jsx)(_e.Provider,{value:s,children:n}):null},R=e=>O((0,t.useContext)(_e),e,j),we=()=>{let[e,n]=R(e=>[e.itemIds,e.items]);return t.default.useMemo(()=>e.map(e=>n[e]),[e,n])},Te=()=>{let[e,n,r]=R(e=>[e.items,e.itemIds,e.getItemList]),[i,a]=t.default.useState(r()),[,o]=t.default.useTransition();return t.default.useEffect(()=>{let e=r();o(()=>{a(e)})},[e,n,r]),i},Ee=5e4,De=t.default.createContext(),Oe=(e,t)=>({config:{itemTemplates:{},actions:{},uid:null,itemExtent:{x:0,y:0,radius:0},boardWrapperRect:{},boardSize:Ee},updateConfiguration:t=>e(e=>({config:{...e.config,...t}})),getConfiguration:()=>t().config}),ke=(e,t)=>({boardState:{movingItems:!1,selecting:!1,zooming:!1,panning:!1,translateX:0,translateY:0,scale:1,rotate:0},updateBoardState:t=>e(e=>({boardState:{...e.boardState,...t}})),getBoardState:()=>t().boardState}),Ae=(e,t)=>({interactions:{},getInteractions:()=>t().interactions,register:(t,n)=>e(e=>{let r=[...e.interactions[t]||[]];return r.push(n),{interactions:{...e.interactions,[t]:r}}}),unregister:(t,n)=>e(e=>{let r=(e.interactions[t]||[]).filter(e=>e!==n);return{interactions:{...e.interactions,[t]:r}}}),callInteractions:(e,n)=>{t().interactions[e]&&t().interactions[e].forEach(e=>{setTimeout(()=>e(n),0)})}}),je=(e,t)=>({selection:[],setSelection:t=>e(e=>JSON.stringify(e.selection)===JSON.stringify(t)?{}:{selection:t}),getSelection:()=>t().selection,select:t=>e(e=>({selection:[...e.selection,...t]})),unselect:t=>e(e=>({selection:e.selection.filter(e=>!t.includes(e))})),clear:()=>e(e=>e.selection.length>0?{selection:[]}:{}),reverse:()=>e(e=>{let t=[...e.selection];return t.reverse(),{selection:t}}),selectionBox:null,setSelectionBox:t=>e(e=>{let n=e.selectionBox;return!n||!t||n.top!==t.top||n.left!==t.left||n.width!==t.width||n.height!==t.height?{selectionBox:t}:{}})}),Me=({children:e})=>{let[n]=t.default.useState(()=>S((...e)=>({...Oe(...e),...ke(...e),...Ae(...e),...je(...e)})));return(0,g.jsx)(De.Provider,{value:n,children:e})},z=e=>O((0,t.useContext)(De),e,j),Ne=()=>{let[e]=z(e=>[e.selection]);return e},Pe=()=>{let[e]=z(e=>[e.getSelection]);return e};function Fe(e){let n=(0,t.useRef)(e);return n.current=e,(0,t.useMemo)(()=>Object.freeze({get current(){return n.current}}),[])}function Ie(e){let n=Fe(e);(0,t.useEffect)(()=>()=>{n.current()},[])}function Le(e,n,r,i=0){let a=(0,t.useRef)(void 0),o=(0,t.useRef)(void 0),s=(0,t.useRef)(e),c=(0,t.useRef)(void 0),l=()=>{a.current&&=(clearTimeout(a.current),void 0),o.current&&=(clearTimeout(o.current),void 0)};return Ie(l),(0,t.useEffect)(()=>{s.current=e},n),(0,t.useMemo)(()=>{let t=()=>{if(l(),!c.current)return;let e=c.current;c.current=void 0,s.current.apply(e.this,e.args)},n=function(...e){a.current&&clearTimeout(a.current),c.current={args:e,this:this},a.current=setTimeout(t,r),i>0&&!o.current&&(o.current=setTimeout(t,i))};return Object.defineProperties(n,{length:{value:e.length},name:{value:`${e.name||`anonymous`}__debounced__${r}`}}),n},[r,i,...n])}var Re=typeof globalThis<`u`&&typeof navigator<`u`&&typeof document<`u`;function ze(e,...t){e?.addEventListener(...t)}function Be(e,...t){e?.removeEventListener(...t)}var Ve=(e,t)=>Object.hasOwn(e,t);function He(e,n,r,i=0){(0,t.useEffect)(Le(e,n,r,i),n)}function Ue(e=!1){let n=(0,t.useRef)(e),r=(0,t.useCallback)(()=>n.current,[]);return(0,t.useEffect)(()=>(n.current=!0,()=>{n.current=!1}),[]),r}var We=new Map;function Ge(e){if(!Re)return;let t=We.get(e);if(t)return t;let n=new Map,r=new ResizeObserver(e=>{for(let t of e){let e=n.get(t.target);if(e!==void 0&&e.size!==0)for(let n of e)setTimeout(()=>{n(t)},0)}}),i={observer:r,subscribe(t,i){let a=n.get(t);a||(a=new Set,n.set(t,a),r.observe(t,{box:e})),a.add(i)},unsubscribe(e,t){let i=n.get(e);i&&(i.delete(t),i.size===0&&(n.delete(e),r.unobserve(e)))}};return We.set(e,i),i}function Ke(e,n,r=!0,i=`content-box`){let a=r&&Ge(i),o=Fe(n),s=e&&`current`in e?e.current:e;(0,t.useEffect)(()=>{let t=e&&`current`in e?e.current:e;if(a===!1||a===void 0||t==null)return;let n=!0,r=(...e)=>{n&&o.current(...e)};return a.subscribe(t,r),()=>{n=!1,a.unsubscribe(t,r)}},[s,a])}function B(e,...n){let r=Ue(),i=Fe(n[1]),a=(0,t.useMemo)(()=>function(...e){r()&&(typeof i.current==`function`?i.current.apply(this,e):typeof i.current.handleEvent==`function`&&i.current.handleEvent.apply(this,e))},[]);(0,t.useEffect)(()=>{let t=qe(e)?e.current:e;if(!t)return;let r=n.slice(2);return ze(t,n[0],a,...r),()=>{Be(t,n[0],a,...r)}},[e,n[0]])}function qe(e){return typeof e==`object`&&!!e&&Ve(e,`current`)}var Je=100,Ye=1e3,Xe=.8,Ze=!1,Qe=({x:e,y:t,scale:n,rotate:r,itemExtent:i,boardWrapperRect:a,boardSize:o})=>{let[s,c]=[e,t],l=ae([a.width/2,a.height/2],{translateX:s,translateY:c,scale:n,rotate:r}),u={x:i.x+o/2,y:i.y+o/2},d={x:o/2,y:o/2},f=P(l,[u.x,u.y]),p=Math.min(a.width,a.height),m=i.radius+p/2/n-Je/n;if(f>m){let e=oe({x:l[0],y:l[1]},u,u,m-1/n)[0],[t,i]=F([-e.x,-e.y],{translateX:a.width/2,translateY:a.height/2,scale:n,rotate:r});s=t,c=i}let h=P(l,[d.x,d.y]),g=o/2-P([0,0],[a.width,a.height])/n;if(h>g){let e=oe({x:l[0],y:l[1]},d,d,g-1/n)[0];if(e){let[t,i]=F([-e.x,-e.y],{translateX:a.width/2,translateY:a.height/2,scale:n,rotate:r});s=t,c=i}}return[s,c]},V=()=>{let[e,n,r,i,a]=z(e=>[e.getBoardState,e.updateBoardState,e.config.itemExtent,e.getConfiguration,e.updateConfiguration]),o=t.default.useRef([.15,5]),[s]=R(e=>[e.getItemList]),c=t.default.useCallback(()=>{let{translateX:t,translateY:n,scale:r,rotate:i}=e();return{translateX:t,translateY:n,scale:r,rotate:i}},[e]),l=t.default.useCallback((t,n)=>ae([t,n],e()),[e]),u=t.default.useCallback((t,n)=>F([t,n],e()),[e]),d=t.default.useCallback((t,n)=>{let{scale:r,rotate:i}=e();return ae([t,n],{translateX:0,translateY:0,rotate:i,scale:r})},[e]),f=t.default.useCallback(e=>e>o.current[1]?o.current[1]:e<o.current[0]?o.current[0]:e,[]),p=t.default.useCallback(t=>{let{itemExtent:r,boardWrapperRect:a,boardSize:o}=i(),s=e(),{translateX:c,translateY:l,scale:u,rotate:d}={...s,...t(s)};Ze&&console.log(`New expected values: `,c,l,u,d);let p=f(u),[m,h]=[c,l];(c!==s.translateX||l!==s.translateY)&&([m,h]=Qe({x:c,y:l,scale:p,rotate:d,itemExtent:r,boardWrapperRect:a,boardSize:o})),Ze&&console.log(`New fixed values: `,m,h,p,d),n({translateX:isNaN(m)?0:m,translateY:isNaN(h)?0:h,scale:isNaN(p)?f(1):p,rotate:isNaN(d)?0:d})},[f,e,i,n]),m=t.default.useCallback(e=>{let t=t=>({...t,...e});typeof e==`function`&&(t=e),p(e=>({...e,...t({translateX:e.translateX,translateY:e.translateY})}))},[p]),h=t.default.useCallback(({to:t,factor:n})=>{let{boardWrapperRect:r}=i(),a=t;a||={x:r.left+r.width/2,y:r.top+r.height/2};let o=e(),s=f(o.scale*n),c=a.x-r.left,l=a.y-r.top,u=c-(c-o.translateX)*s/o.scale,d=l-(l-o.translateY)*s/o.scale;p(e=>({...e,translateX:u,translateY:d,scale:s}))},[f,e,i,p]),g=t.default.useCallback(({x:t,y:n,radius:r})=>{let{rotate:a}=e(),{boardWrapperRect:o,boardSize:s}=i(),[c,l,u]=[t||0,n||0,r||2e3],d=o.width/(u*2),m=o.height/(u*2),h=f(Math.min(d,m)*Xe),[g,_]=F([-s/2-c,-s/2-l],{translateX:o.width/2,translateY:o.height/2,scale:h,rotate:a});p(e=>({...e,translateX:g,translateY:_,scale:h}))},[f,e,i,p]),_=t.default.useCallback(()=>{let{boardWrapperRect:e,boardSize:t}=i(),[n,r]=l(e.width/2,e.height/2);return{x:n-t/2,y:r-t/2}},[l,i]),v=t.default.useCallback(()=>{let e=s(),{boardSize:t,uid:n}=i(),r=e.reduce((e,t)=>{let r=I(n,t.id);return r&&(e.left=Math.min(t.x,e.left),e.top=Math.min(t.y,e.top),e.right=Math.max(t.x+r.offsetWidth,e.right),e.bottom=Math.max(t.y+r.offsetHeight,e.bottom)),e},{left:t/2,top:t/2,right:-t/2,bottom:-t/2}),o={x:(r.right+r.left)/2,y:(r.bottom+r.top)/2};o.radius=Math.max(P([o.x,o.y],[r.left,r.top]),Ye),a({itemExtent:o})},[i,s,a]),y=t.default.useCallback(e=>{let t=()=>e;typeof e==`function`&&(t=e),p(e=>({...e,rotate:t(e.rotate)})),v(),g(r)},[r,p,v,g]),b=Le(()=>v(),[v],200);return t.default.useEffect(()=>{window.debugUpdateExtent=()=>v(),window.debugDisplayExtent=()=>console.log(i().itemExtent),window.debugSetDebug=()=>{Ze=!0}},[i,v]),{setDim:p,rotateBoard:y,moveBoard:m,getDim:c,zoomTo:h,zoomToCenter:h,zoomToExtent:g,getCenter:_,updateItemExtent:b,vectorFromWrapperToBoard:d,fromWrapperToBoard:l,fromBoardToWrapper:u}},$e=e=>{let[n,r,i]=z(({register:e,unregister:t,callInteractions:n})=>[e,t,n]);return{register:t.default.useCallback(t=>(n(e,t),()=>{r(e,t)}),[e,n,r]),call:t.default.useCallback(t=>{i(e,t)},[i,e])}},H=()=>{let{call:e}=$e(`place`),{call:n}=$e(`delete`),{getCenter:r,updateItemExtent:i}=V(),[a,o,s,c]=z(e=>[e.clear,e.reverse,e.unselect,e.getConfiguration]),{getItems:l,getItemIds:u,setItemIds:d,updateItems:f,moveItems:p,removeItemsById:m,getItemList:h,insertItems:g,setItemList:_}=R(({getItems:e,getItemIds:t,setItemIds:n,updateItems:r,moveItems:i,removeItemsById:a,getItemList:o,insertItems:s,setItemList:c})=>({getItems:e,getItemIds:t,setItemIds:n,updateItems:r,moveItems:i,removeItemsById:a,getItemList:o,insertItems:s,setItemList:c})),v=t.default.useCallback((e,t,n=!1)=>{let r=t;typeof t==`object`&&(r=()=>t);let a=u().filter(t=>e.includes(t)),o=l(),s=a.map(e=>{let t=o[e];return n?[e,r(t)]:[e,r({...t})]}).filter(([,e])=>e);if(s.length===0)return;let c=Object.fromEntries(s);f(c,n),i()},[u,l,i,f]),y=t.default.useCallback(e=>{_(e),a(),i()},[a,_,i]),b=t.default.useCallback((e,t,n=!1)=>{v([e],t,n)},[v]),x=t.default.useCallback((e,t)=>{p(fe(l(),u(),e),t)},[u,l,p]),S=t.default.useCallback(e=>{let t=u(),n=t.filter(t=>!e.includes(t)),r=t.filter(t=>e.includes(t));d([...n,...r])},[u,d]),C=t.default.useCallback((e,{type:t,size:n}={})=>{let{uid:r}=c();v(e,e=>{let i=I(r,e.id);if(!i)return;let a={type:t||`grid`,size:n||1,offset:{x:0,y:0},...e.grid};return pe({x:e.x,y:e.y,width:i.clientWidth,height:i.clientHeight},a)},!0)},[c,v]),w=t.default.useCallback((t,n)=>{let r=fe(l(),u(),t);S(r),v(r,{moving:!1},!0),C(r,n),e(t),i()},[v,e,u,l,S,C,i]),T=t.default.useCallback(e=>{d(e)},[d]),E=t.default.useCallback(e=>{let t=u(),n=t.filter(t=>e.includes(t)),r=t.map(t=>e.includes(t)?n.pop():t);d(r),o()},[u,o,d]),ee=t.default.useCallback((e,t)=>{let n=l(),r=Object.fromEntries(t.map((t,r)=>{let i=n[e[r]];return[t,{x:i.x,y:i.y}]}));v(e,e=>r[e.id],!0);let i=Object.fromEntries(e.map((e,n)=>[e,t[n]])),a=u().map(t=>e.includes(t)?i[t]:t);d(a)},[l,v,u,d]),D=t.default.useCallback((e,t)=>{let n=r(),i=e.map((e,t)=>!e.x||!e.y?{...e,x:n.x+2*t,y:n.y+2*t}:e);g(i,t),requestAnimationFrame(()=>{w(e.map(({id:e})=>e))})},[r,g,w]),te=t.default.useCallback((e,t)=>{D([e],t)},[D]),O=t.default.useCallback(e=>{s(e),m(e),n(e)},[s,m,n]),k=t.default.useCallback(e=>{let t=l();return e.map(e=>t[e])},[l]);return{putItemsOnTop:S,batchUpdateItems:v,updateItemOrder:T,moveItems:x,placeItems:w,updateItem:b,swapItems:ee,reverseItemsOrder:E,setItemList:y,pushItem:te,pushItems:D,removeItems:O,getItemList:h,findElementUnderPointer:t.default.useCallback(({target:e,clientX:t,clientY:n},{returnLocked:r=!1,passLocked:i=!1}={})=>{if([`INPUT`,`TEXTAREA`].includes(e.tagName))return null;let a=N(e,`item`);if(a){if(M(a,`selected`))return a;if(!i&&M(a,`locked`)&&!M(e,`passthrough`))return r?a:null;if(M(e,`passthrough`)){let e=u(),{uid:r}=c(),o=e.reduce((e,i)=>{let a=I(r,i),o=a.getBoundingClientRect();return se({x:t,y:n},o)&&e.unshift(a),e},[]);for(let e=0;e<o.length;e+=1){let t=o[e];if(t!==a&&(i||!M(t,`locked`)))return t}return null}}return a},[c,u]),getItems:k}},et=u(c(((e,t)=>{t.exports=function e(t,n){if(t===n)return!0;if(t&&n&&typeof t==`object`&&typeof n==`object`){if(t.constructor!==n.constructor)return!1;var r,i,a;if(Array.isArray(t)){if(r=t.length,r!=n.length)return!1;for(i=r;i--!==0;)if(!e(t[i],n[i]))return!1;return!0}if(t instanceof Map&&n instanceof Map){if(t.size!==n.size)return!1;for(i of t.entries())if(!n.has(i[0]))return!1;for(i of t.entries())if(!e(i[1],n.get(i[0])))return!1;return!0}if(t instanceof Set&&n instanceof Set){if(t.size!==n.size)return!1;for(i of t.entries())if(!n.has(i[0]))return!1;return!0}if(ArrayBuffer.isView(t)&&ArrayBuffer.isView(n)){if(r=t.length,r!=n.length)return!1;for(i=r;i--!==0;)if(t[i]!==n[i])return!1;return!0}if(t.constructor===RegExp)return t.source===n.source&&t.flags===n.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===n.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===n.toString();if(a=Object.keys(t),r=a.length,r!==Object.keys(n).length)return!1;for(i=r;i--!==0;)if(!Object.prototype.hasOwnProperty.call(n,a[i]))return!1;for(i=r;i--!==0;){var o=a[i];if(!e(t[o],n[o]))return!1}return!0}return t!==t&&n!==n}}))(),1),tt=(e,t)=>{if(e.type in t){let n=t[e.type].defaultActions;return typeof n==`function`?n(e):n}return[]},nt=(e,t)=>{let{actions:n=tt(e,t)}=e;return n.map(e=>typeof e==`string`?{name:e}:e)},rt=()=>{let[e,n]=R(e=>[e.items,e.getItems]),[r,i,a]=z(e=>[e.config.itemTemplates,e.selection,e.getSelection]),[o,s]=t.default.useState([]),c=t.default.useRef(!1),[,l]=t.default.useTransition();t.default.useEffect(()=>(c.current=!0,()=>{c.current=!1}),[]);let u=t.default.useCallback(e=>{let t=n();if(e)return[e,e.map(e=>t[e])];let r=a();return[r,r.map(e=>t[e])]},[n,a]),d=(0,t.useCallback)(()=>{let[e,t]=u();if(e.length>0){if(!c.current)return;let e=t.reduce((e,t)=>{let n=nt(t,r);return e.filter(e=>n.some(t=>(0,et.default)(e,t)))},nt(t[0],r));l(()=>{s(e)})}else l(()=>{s([])})},[u,r]);return He(()=>d(),[e,i,d],100),{availableActions:o}},it=()=>{let[e]=z(e=>[e.selectionBox]);return e},at=`useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict`,U=(e=21)=>{let t=``,n=crypto.getRandomValues(new Uint8Array(e|=0));for(;e--;)t+=at[n[e]&63];return t},ot=t.default.createContext(),st=e=>{localStorage.setItem(`user`,JSON.stringify(e))},ct=()=>{if(localStorage.user){let e={name:`Player`,color:he(),uid:U(),...JSON.parse(localStorage.user)};return st(e),e}let e={name:`Player`,color:he(),uid:U()};return st(e),e},lt=e=>(t,n)=>({isSpaceMaster:!1,users:{},getUser:()=>n().users[e],getUsers:()=>n().users,getUserList:()=>Object.values(n().users),getLocalUsers:()=>{if(!n().users[e])return[];let{space:t}=n().users[e];return n().getUserList().filter(({space:e})=>e===t)},addUser:e=>t(t=>({users:{...t.users,[e.id]:e}})),updateUser:(r,i)=>t(t=>{if(!t.users[r])return{};let a={...t.users[r],...i,id:r,uid:t.users[r].uid};return a.id===e&&st(a),setTimeout(()=>n().electSpaceMaster(),100),{users:{...t.users,[r]:a}}}),removeUser:e=>t(t=>{let r={...t.users};return delete r[e],setTimeout(()=>n().electSpaceMaster(),100),{users:r}}),updateCurrentUser:t=>n().updateUser(e,t),joinSpace:t=>n().updateUser(e,{space:t,spaceJoinedTimestamp:Date.now()}),electSpaceMaster:()=>{let r=n().getLocalUsers(),i={uid:null,timestamp:Date.now()};Object.values(r).forEach(({spaceJoinedTimestamp:e,id:t})=>{e<i.timestamp&&(i.id=t,i.timestamp=e)}),t({isSpaceMaster:i.id===e})}}),ut=e=>({cursors:{},moveCursor:(t,n)=>e(e=>({cursors:{...e.cursors,[t]:n}})),removeCursor:t=>e(e=>{let n={...e.cursors};return delete n[t],{cursors:n}})}),dt=({storeName:e,children:n})=>{let{wire:r,isMaster:i}=b(`room`),[a,o]=t.default.useState(null),[s,c]=t.default.useState(!1),l=t.default.useRef(!1);return t.default.useEffect(()=>{let t=!0,n=[];if(!a&&!l.current)return l.current=!0,(()=>{let n=S(ge({wire:r,storeName:e,noSync:[`updateCurrentUser`,`joinSpace`,`isSpaceMaster`,`electSpaceMaster`]},(...e)=>({...lt(r.userId)(...e),...ut(...e)}),r,e)),i=n.subscribe(e=>{e.ready&&(i(),t&&o(n))})})(),()=>{t=!1,l.current=!1,n.forEach(e=>e())}},[a,e,r,r.userId]),t.default.useEffect(()=>{if(a)return a.getState().addUser({...ct(),id:r.userId}),c(!0),()=>{a.getState().removeUser(r.userId)}},[i,a,r]),t.default.useEffect(()=>{if(a){let e=r.subscribe(`userLeave`,e=>{a.getState().removeUser(e)});return()=>{e()}}},[i,a,r]),t.default.useEffect(()=>{i&&a&&a.getState().updateCurrentUser({isMaster:i})},[i,a,r]),s?(0,g.jsx)(ot.Provider,{value:a,children:n}):null},W=e=>O((0,t.useContext)(ot),e,j),ft=()=>{let[e,n,r,i,a]=W(e=>[e.isSpaceMaster,e.getUser(),e.users,e.updateCurrentUser,e.joinSpace]),o=t.default.useMemo(()=>Object.values(r),[r]);return{isSpaceMaster:e,currentUser:n,updateCurrentUser:i,users:o,localUsers:t.default.useMemo(()=>{let{space:e}=n;return o.filter(({space:t})=>t===e)},[n,o]),joinSpace:a}},pt=()=>{let[e,n,r]=R(e=>[e.boardConfig,e.getBoardConfig,e.setBoardConfig]);return[e,t.default.useCallback(e=>{let t=e;typeof e==`object`&&(t=()=>e);let i=n(),a=t(i);r(a)},[n,r])]},mt=()=>{let[e]=z(e=>[e.boardState]);return e},ht=()=>{let[e,t,n,r]=R(e=>[e.getSessionInfo,e.setSessionInfo,e.updateSessionInfo,e.session]);return{getSessionInfo:e,setSessionInfo:t,sessionInfo:r,updateSessionInfo:n}},gt=t.default.createContext(),_t=({user:{name:e,uid:t,color:n},content:r})=>({type:`message`,user:{name:e,uid:t,color:n},content:r,uid:U(),timestamp:new Date().toISOString()}),vt=(e,t)=>({messages:[],setMessages:t=>e({messages:t.map(e=>({...e,timestamp:Date.parse(e.timestamp)}))}),addMessage:t=>e(e=>({messages:[...e.messages,{...t,timestamp:Date.parse(t.timestamp)}]})),sendMessage:(e,n)=>{let r=_t({user:e,content:n});r&&t().addMessage(r)}}),yt=({storeName:e,children:n,defaultValue:r=[]})=>{let{wire:i}=b(`room`),[a]=t.default.useState(()=>S(ge({wire:i,storeName:e,defaultValue:r,noSync:[`sendMessage`]},(...e)=>({...vt(...e)}))));return(0,g.jsx)(gt.Provider,{value:a,children:n})},bt=e=>O((0,t.useContext)(gt),e,j),xt=()=>{},St=(e=xt)=>{let n=W(e=>e.getUser()),[r,i,a]=bt(e=>[e.messages,e.setMessages,e.sendMessage]);return t.default.useEffect(()=>{r.length&&e()},[r,e]),{messages:r,setMessages:i,sendMessage:t.default.useCallback(e=>{a(n,e)},[n,a])}},Ct=({children:e,session:n})=>{let r=W(e=>e.joinSpace);return t.default.useEffect(()=>(r(n),()=>{r(null)}),[r,n]),e},wt=({socket:e,room:n,session:r,items:i=[],messages:a=[],LoadingComponent:o,...s})=>{let[c]=t.default.useState(n||U()),[l]=t.default.useState(r||U()),[u]=t.default.useState(()=>({itemIds:i.map(({id:e})=>e),items:Object.fromEntries(i.map(e=>[e.id,e]))}));return b(`room`)?(0,g.jsx)(yt,{storeName:`${l}_messages`,defaultValue:a,children:(0,g.jsx)(Me,{children:(0,g.jsx)(Ce,{storeName:`${l}_item`,defaultValue:u,children:(0,g.jsx)(Ct,{...s,session:l})})})}):(0,g.jsx)(y,{room:c,channel:`room`,socket:e,LoadingComponent:o,children:(0,g.jsx)(dt,{storeName:`${c}_users`,children:(0,g.jsx)(yt,{storeName:`${l}_messages`,defaultValue:a,children:(0,g.jsx)(Me,{children:(0,g.jsx)(Ce,{storeName:`${l}_item`,defaultValue:u,children:(0,g.jsx)(Ct,{...s,session:l})})})})})})},Tt=({socket:e,room:n,children:r,LoadingComponent:i})=>{let[a]=t.default.useState(n||U());return(0,g.jsx)(y,{room:a,channel:`room`,socket:e,LoadingComponent:i,children:(0,g.jsx)(dt,{storeName:`${a}_users`,children:r})})},Et={data:``},Dt=e=>{if(typeof window==`object`){let t=(e?e.querySelector(`#_goober`):window._goober)||Object.assign(document.createElement(`style`),{innerHTML:` `,id:`_goober`});return t.nonce=window.__nonce__,t.parentNode||(e||document.head).appendChild(t),t.firstChild}return e||Et},Ot=/(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g,kt=/\/\*[^]*?\*\/| +/g,At=/\n+/g,G=(e,t)=>{let n=``,r=``,i=``;for(let a in e){let o=e[a];a[0]==`@`?a[1]==`i`?n=a+` `+o+`;`:r+=a[1]==`f`?G(o,a):a+`{`+G(o,a[1]==`k`?``:t)+`}`:typeof o==`object`?r+=G(o,t?t.replace(/([^,])+/g,e=>a.replace(/([^,]*:\S+\([^)]*\))|([^,])+/g,t=>/&/.test(t)?t.replace(/&/g,e):e?e+` `+t:t)):a):o!=null&&(a=a[1]==`-`?a:a.replace(/[A-Z]/g,`-$&`).toLowerCase(),i+=G.p?G.p(a,o):a+`:`+o+`;`)}return n+(t&&i?t+`{`+i+`}`:i)+r},K={},jt=e=>{if(typeof e==`object`){let t=``;for(let n in e)t+=n+jt(e[n]);return t}return e},Mt=(e,t,n,r,i)=>{let a=jt(e),o=K[a]||(K[a]=(e=>{let t=0,n=11;for(;t<e.length;)n=101*n+e.charCodeAt(t++)>>>0;return`go`+n})(a));if(!K[o]){let t=a===e?(e=>{let t,n,r=[{}];for(;t=Ot.exec(e.replace(kt,``));)t[4]?r.shift():t[3]?(n=t[3].replace(At,` `).trim(),r.unshift(r[0][n]=r[0][n]||{})):r[0][t[1]]=t[2].replace(At,` `).trim();return r[0]})(e):e;K[o]=G(i?{[`@keyframes `+o]:t}:t,n?``:`.`+o)}let s=n&&K.g;return n&&(K.g=K[o]),((e,t,n,r)=>{r?t.data=t.data.replace(r,e):t.data.indexOf(e)===-1&&(t.data=n?e+t.data:t.data+e)})(K[o],t,r,s),o},Nt=(e,t,n)=>e.reduce((e,r,i)=>{let a=t[i];if(a&&a.call){let e=a(n),t=e&&e.props&&e.props.className||/^go/.test(e)&&e;a=t?`.`+t:e&&typeof e==`object`?e.props?``:G(e,``):!1===e?``:e}return e+r+(a??``)},``);function q(e){let t=this||{},n=e.call?e(t.p):e;return Mt(n.unshift?n.raw?Nt(n,[].slice.call(arguments,1),t.p):n.reduce((e,n)=>Object.assign(e,n&&n.call?n(t.p):n),{}):n,Dt(t.target),t.g,t.o,t.k)}q.bind({g:1}),q.bind({k:1});function Pt(e,t,n,r){G.p=t}var Ft=u(c(((e,t)=>{t.exports=function e(t,n){if(t===n)return!0;if(t&&n&&typeof t==`object`&&typeof n==`object`){if(t.constructor!==n.constructor)return!1;var r,i,a;if(Array.isArray(t)){if(r=t.length,r!=n.length)return!1;for(i=r;i--!==0;)if(!e(t[i],n[i]))return!1;return!0}if(t.constructor===RegExp)return t.source===n.source&&t.flags===n.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===n.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===n.toString();if(a=Object.keys(t),r=a.length,r!==Object.keys(n).length)return!1;for(i=r;i--!==0;)if(!Object.prototype.hasOwnProperty.call(n,a[i]))return!1;for(i=r;i--!==0;){var o=a[i];if(!e(t[o],n[o]))return!1}return!0}return t!==t&&n!==n}}))(),1),It=()=>{let e=navigator.userAgent.toLowerCase();return/mac os ?x 10/.test(e)},Lt=(()=>{let e=document.createElement(`iframe`);e.src=`#`,document.body.appendChild(e);let t=e.contentWindow.document;t.open(),t.write(`<!DOCTYPE html><html><head></head><body><span>a</span></body></html>`),t.close();let n=t.body.firstElementChild.offsetHeight;return document.body.removeChild(e),n})(),Rt=800,zt=(e,t)=>e[Object.keys(e).map(e=>Number(e)).find(e=>e!==t)],Bt=([e,t],[n,r])=>{let i=Math.abs(e-n),a=Math.abs(t-r);return Math.hypot(i,a)},J=()=>{},Vt=e=>t=>{let{event:n}=t;return n.isPropagationStopped()?null:e(t)},Ht=e=>async(...t)=>{try{await e(...t)}catch(e){console.error(e)}},Y=new class{lastPromise=Promise.resolve(!0);add(e,...t){return new Promise((n,r)=>{this.lastPromise=this.lastPromise.then(()=>Vt(Ht(e))(...t)).then(n).catch(r)})}},X=({children:e,onDrag:n=J,onDragStart:r=J,onDragEnd:i=J,onPan:a=J,onTap:o=J,onLongTap:s=J,onDoubleTap:c=J,onZoom:l,mainAction:u=`drag`})=>{let d=t.default.useRef(null),f=t.default.useRef({moving:!1,pointers:{},mainPointer:void 0}),p=e=>{let{deltaX:t,deltaY:n,clientX:r,clientY:i,deltaMode:o,ctrlKey:s,altKey:c,metaKey:u,target:d}=e;if(!(c||s&&!It())){if(It()&&!s)Y.add(a,{deltaX:-2*t,deltaY:-2*n,button:1,ctrlKey:s,metaKey:u,target:d,event:e});else{if(l===void 0||!n)return;let t=n;switch(o){case 1:t*=Lt;break;case 2:t*=Rt}It()&&(t*=2),Y.add(l,{scale:t,clientX:r,clientY:i,event:e})}}},m=e=>{let{target:t,button:n,clientX:r,clientY:i,pointerId:a,altKey:o,ctrlKey:c,metaKey:l,isPrimary:u}=e;if(f.current.pointers[a]={clientX:r,clientY:i},u&&(f.current.mainPointer=void 0),f.current.mainPointer!==void 0){if(f.current.mainPointer!==a)try{let{clientX:e,clientY:t}=zt(f.current.pointers,a),n=(e+r)/2,o=(t+i)/2,s=Bt([e,t],[r,i]);Object.assign(f.current,{pressed:!0,moving:!1,gestureStart:!1,startX:r,startY:i,prevX:n,prevY:o,startDistance:s,prevDistance:s})}catch(e){console.log(`Error while getting other pointer. Ignoring`,e),f.current.mainPointer}return}f.current.mainPointer=a,Object.assign(f.current,{pressed:!0,moving:!1,gestureStart:!1,startX:r,startY:i,prevX:r,prevY:i,currentButton:n,pointerDownEvent:e,startDistance:0,prevDistance:0,target:t,timeStart:Date.now(),longTapTimeout:setTimeout(async()=>{f.current.noTap=!0,Y.add(s,{clientX:r,clientY:i,altKey:o,ctrlKey:c,metaKey:l,target:t,event:e})},750)});try{t.setPointerCapture(a)}catch(e){console.log(`Fail to capture pointer`,e)}},h=e=>{if(f.current.pressed){let{pointerId:t,clientX:i,clientY:o,altKey:s,shiftKey:c,ctrlKey:p,metaKey:m,buttons:h}=e;f.current.pointers[t]={clientX:i,clientY:o},f.current.moving=!0;let g=Object.keys(f.current.pointers).length===2,_,v,y=0;if(g){let{clientX:e,clientY:n}=zt(f.current.pointers,t);_=(e+i)/2,v=(n+o)/2,y=Bt([e,n],[i,o])}else _=i,v=o;let b=c||s||p||m||h!==1;u!==`drag`&&(b=!b);let x=!b,S=b;if(x){f.current.gestureStart||(d.current.style.cursor=`move`,f.current.gestureStart=!0,clearTimeout(f.current.longTapTimeout),Y.add(r,{deltaX:0,deltaY:0,startX:f.current.startX,startY:f.current.startY,clientX:f.current.startX,clientY:f.current.startY,distanceX:0,distanceY:0,button:f.current.currentButton,altKey:s,shiftKey:c,ctrlKey:p,metaKey:m,target:f.current.target,event:f.current.pointerDownEvent}));let t=_-f.current.prevX,i=v-f.current.prevY,a=_-f.current.startX,o=v-f.current.startY;Y.add(n,{deltaX:t,deltaY:i,startX:f.current.startX,startY:f.current.startY,clientX:_,clientY:v,distanceX:a,distanceY:o,button:f.current.currentButton,altKey:s,shiftKey:c,ctrlKey:p,metaKey:m,target:f.current.target,event:e})}if(S){f.current.gestureStart||(d.current.style.cursor=`move`,f.current.gestureStart=!0,clearTimeout(f.current.longTapTimeout));let t=_-f.current.prevX,n=v-f.current.prevY,{target:r}=f.current;if(Y.add(a,{deltaX:t,deltaY:n,button:f.current.currentButton,altKey:s,shiftKey:c,ctrlKey:p,metaKey:m,target:r,event:e}),y!==f.current.prevDistance&&l){let t=f.current.prevDistance-y;Math.abs(t)>0&&(Y.add(l,{scale:t*3,clientX:_,clientY:v,event:e}),f.current.prevDistance=y)}}f.current.prevX=_,f.current.prevY=v}},_=e=>{let{clientX:t,clientY:n,altKey:r,shiftKey:a,ctrlKey:s,metaKey:c,target:l,pointerId:u}=e;if(f.current.pointers[u]){if(delete f.current.pointers[u],f.current.mainPointer!==u){let{clientX:e,clientY:t}=f.current.pointers[f.current.mainPointer];Object.assign(f.current,{prevX:e,prevY:t,prevDistance:0,startDistance:0});return}for(;Object.keys(f.current.pointers).length>0;){f.current.mainPointer=Number(Object.keys(f.current.pointers)[0]);try{f.current.target.setPointerCapture(f.current.mainPointer);let{clientX:e,clientY:t}=f.current.pointers[f.current.mainPointer];Object.assign(f.current,{prevX:e,prevY:t,prevDistance:0,startDistance:0});return}catch(e){console.log(`Fails to set pointer capture`,e),f.current.mainPointer=void 0,delete f.current.pointers[Object.keys(f.current.pointers)[0]]}}if(f.current.mainPointer=void 0,f.current.pressed=!1,clearTimeout(f.current.longTapTimeout),f.current.moving)f.current.moving=!1,Y.add(i,{deltaX:t-f.current.prevX,deltaY:n-f.current.prevY,startX:f.current.startX,startY:f.current.startY,clientX:t,clientY:n,distanceX:t-f.current.startX,distanceY:n-f.current.startY,button:f.current.currentButton,altKey:r,shiftKey:a,ctrlKey:s,metaKey:c,event:e}),d.current.style.cursor=`auto`;else{let i=Date.now();f.current.noTap?f.current.noTap=!1:f.current.timeStart-i<300&&Y.add(o,{clientX:t,clientY:n,altKey:r,shiftKey:a,ctrlKey:s,metaKey:c,target:l,event:e})}}};return(0,g.jsx)(`div`,{onWheel:p,onPointerDown:m,onPointerMove:h,onPointerUp:_,onPointerOut:_,onPointerLeave:_,onPointerCancel:_,onDoubleClick:e=>{let{clientX:t,clientY:n,altKey:r,shiftKey:i,ctrlKey:a,metaKey:o,target:s}=e;Y.add(c,{clientX:t,clientY:n,altKey:r,shiftKey:i,ctrlKey:a,metaKey:o,target:s,event:e})},style:{touchAction:`none`},ref:d,children:e})},Ut=({onResize:e,...t})=>{let[n]=z(e=>[e.getBoardState]);return(0,g.jsx)(X,{onDrag:({deltaX:t,deltaY:r,event:i})=>{i.stopPropagation();let{scale:a}=n();e({width:t/a,height:r/a})},children:(0,g.jsx)(`div`,{...t})})},Wt=q`
1
+ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("react/jsx-runtime"),require("zustand"),require("zustand/traditional"),require("zustand/shallow"),require("@react-hookz/web")):typeof define==`function`&&define.amd?define([`exports`,`react`,`react/jsx-runtime`,`zustand`,`zustand/traditional`,`zustand/shallow`,`@react-hookz/web`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e[`React-sync-board`]={},e.React,e.react_jsx_runtime,e.zustand,e.zustand_traditional,e.zustand_shallow,e._react_hookz_web))})(this,function(e,t,n,r,i,a,o){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var s=Object.create,c=Object.defineProperty,l=Object.getOwnPropertyDescriptor,u=Object.getOwnPropertyNames,d=Object.getPrototypeOf,f=Object.prototype.hasOwnProperty,p=(e,t)=>()=>(t||(e((t={exports:{}}).exports,t),e=null),t.exports),m=(e,t,n,r)=>{if(t&&typeof t==`object`||typeof t==`function`)for(var i=u(t),a=0,o=i.length,s;a<o;a++)s=i[a],!f.call(e,s)&&s!==n&&c(e,s,{get:(e=>t[e]).bind(null,s),enumerable:!(r=l(t,s))||r.enumerable});return e},h=(e,t,n)=>(n=e==null?{}:s(d(e)),m(t||!e||!e.__esModule||!f.call(e,`default`)?c(n,`default`,{value:e,enumerable:!0}):n,e));t=h(t,1);var g=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((e,t)=>(t&=63,e+=t<36?t.toString(36):t<62?(t-26).toString(36).toUpperCase():t>62?`-`:`_`,e),``),_=class{constructor(e,t,n=null){this._socket=e,this.userId=n,this.room=t,this.toUnregister=[()=>{this._socket.off(`${this.room}.isMaster`),this._socket.off(`${this.room}.roomJoined`),this._socket.off(`${this.room}._call`)}],this._left=!1,this.registeredRPC={},this._socket.on(`${this.room}._call`,async({callId:t,name:n,params:r})=>{try{let i=await this.registeredRPC[n](r);e.emit(`${this.room}._result.${t}`,{ok:i||null})}catch(n){e.emit(`${this.room}._result.${t}`,{err:`${n.message}`})}})}async _callServerRPC(e,t){let n=g();return new Promise((r,i)=>{this._socket.once(`${this.room}._result.${n}`,e=>{e.hasOwnProperty(`ok`)?r(e.ok):i(e.err)}),this._socket.emit(`${this.room}._call`,{callId:n,name:e,params:t})})}leave(){this._left=!0,this.toUnregister.forEach(e=>{e()}),this._socket.emit(`${this.room}.leave`)}publish(e,t,n=!1){this._socket.emit(`${this.room}.publish`,{name:e,params:t,self:n})}subscribe(e,t){this._socket.on(`${this.room}.${e}`,t);let n=()=>{this._socket.off(`${this.room}.${e}`,t)};return this.toUnregister.push(n),n}async register(e,t,{invoke:n=`single`}={}){this.registeredRPC[e]=t,await this._callServerRPC(`register`,{name:e,invoke:n});let r=()=>{if(this.registeredRPC[e]===t)return delete this.registeredRPC[e],this._callServerRPC(`unregister`,{name:e})};return this.toUnregister.push(r),r}async call(e,t){return await this._callServerRPC(`call`,{name:e,params:t})}},v=({socket:e,room:t,onJoined:n=()=>{},onMaster:r=()=>{},userId:i=null})=>{let a=new _(e,t,i);return new Promise(o=>{let s=!0;e.on(`${t}.isMaster`,()=>{a._left||r(t)}),e.on(`${t}.roomJoined`,e=>{a._left||(a.userId=e,s=!1,n(a),o(a))}),e.on(`connect`,()=>{a._left||s||e.emit(`joinSuperSocket`,{room:t,userId:a.userId})}),e.emit(`joinSuperSocket`,{room:t,userId:i})})},y=t.default.createContext(),b=()=>(0,n.jsx)(`div`,{style:{position:`absolute`,top:`0`,bottom:`0`,width:`100%`,display:`flex`,justifyContent:`center`,alignItems:`center`},children:(0,n.jsx)(`h2`,{children:`🌀 Loading...`})}),x=({socket:e,room:r,channel:i=`default`,LoadingComponent:a=b,children:o})=>{let[s,c]=t.default.useState(!1),[l,u]=t.default.useState(!1),[d,f]=t.default.useState(null),p=t.default.useRef(null),m=t.default.useRef(!1),h=(0,t.useContext)(y),g=t.default.useRef(!1);return t.default.useEffect(()=>(m.current=!0,()=>{m.current=!1}),[]),t.default.useEffect(()=>{if(!e)return null;let t=()=>{console.log(`Disconnected from ${i}…`),m.current&&(c(!1),u(!1))};return e.on(`disconnect`,t),()=>{e.off(`disconnect`,t)}},[i,e]),t.default.useEffect(()=>e?(e.connected||e.connect(),console.log(`Try to connect to wire ${r} on channel ${i}`),g.current||(g.current=!0,v({socket:e,room:r,onMaster:()=>{console.log(`Is now master on channel ${i}…`),m.current&&u(!0)},onJoined:e=>{console.log(`Connected on channel ${i}…`),p.current=e,m.current&&(f(e),c(!0))}})),()=>{p.current?.leave()}):null,[i,r,e]),!s||!d?(0,n.jsx)(a,{}):(0,n.jsx)(y.Provider,{value:{...h,[i]:{wire:d,joined:s,isMaster:l,room:r}},children:o})},S=(e=`default`)=>((0,t.useContext)(y)||{})[e],C=(e,t)=>e.classList&&e.classList.contains(t),w=(e,t)=>C(e,t)?e:e.parentNode?w(e.parentNode,t):!1,T=([e,t],[n,r])=>{let i=Math.abs(e-n),a=Math.abs(t-r);return Math.hypot(i,a)},E=(e,t,n)=>{let r=n*Math.PI/180;return[e*Math.cos(r)-t*Math.sin(r),e*Math.sin(r)+t*Math.cos(r)]},D=([e,t],{scale:n,rotate:r,translateX:i,translateY:a})=>E((e-i)/n,(t-a)/n,-r),O=([e,t],{scale:n,rotate:r,translateX:i,translateY:a})=>{let[o,s]=E(e,t,r);return[o*n+i,s*n+a]},k=(e,t,n,r)=>{let i=e.x,a=e.y,o=t.x,s=t.y,c=n.x,l=n.y,u=o-i,d=s-a,f=i-c,p=a-l,m=u*u+d*d,h=2*(f*u+p*d),g=f*f+p*p-r*r,_=h*h-4*m*g;if(_<0)return[];let v=(-h+Math.sqrt(_))/(2*m),y=(-h-Math.sqrt(_))/(2*m),b=[];return v>=0&&v<=1&&b.push({x:i+v*u,y:a+v*d}),y>=0&&y<=1&&b.push({x:i+y*u,y:a+y*d}),b},A=(e,t)=>e.x>t.left&&e.x<t.left+t.width&&e.y>t.top&&e.y<t.top+t.height,j=(e,t)=>Array.from(e.querySelectorAll(`.corner`)).every(e=>{let{top:n,left:r}=e.getBoundingClientRect();return A({x:r,y:n},t)}),ee=(e,t)=>j(e,t.getBoundingClientRect()),M=(e,t)=>{try{return document.getElementById(`${e}__${t}`)}catch{console.error(`Error while getting item with id ${t} inside wrapper`,e);return}},N=e=>{let t=e?.dataset?.id;return t||console.error(`getIdFromElem call fails`,e,JSON.stringify(e?.dataset),e?.dataset?.id),t},te=(e,t)=>{let n=e.reduce((e,n)=>{let r=M(t,n);if(!r)return e||null;let{left:i,right:a,top:o,bottom:s}=r.getBoundingClientRect(),c;return c=e||{left:i,top:o,right:a,bottom:s},c.left=Math.min(i,c.left),c.top=Math.min(o,c.top),c.right=Math.max(a,c.right),c.bottom=Math.max(s,c.bottom),c},null);return n&&(n.width=n.right-n.left,n.height=n.bottom-n.top,n)},ne=(e,t,n=null)=>(n===null&&(n=new Set),!Array.isArray(t)||t.length===0?[]:t.map(t=>n.has(t)?[]:(n.add(t),e[t]?[t,...ne(e,e[t].linkedItems,n)]:[])).flat()),re=(e,t,n)=>{let r=new Set(ne(e,n));return t.filter(e=>r.has(e))},ie=({x:e,y:t,width:n,height:r},{type:i=`grid`,size:a=1,offset:o={x:0,y:0}})=>{let[s,c]=[e+n/2-o.x,t+r/2-o.y],l,u,d,f,p,m,h,g,_,v,y=a/1.1547;switch(i){case`grid`:l=Math.round(s/a)*a,u=Math.round(c/a)*a;break;case`hexH`:d=2*y,f=3*a,p=Math.round(s/d)*d,h=Math.round(c/f)*f,m=p>s?p-y:p+y,g=h>c?h-1.5*a:h+1.5*a,_=Math.hypot(p-s,h-c),v=Math.hypot(m-s,g-c),_<v?(l=p,u=h):(l=m,u=g);break;case`hexV`:d=3*a,f=2*y,p=Math.round(s/d)*d,h=Math.round(c/f)*f,m=p>s?p-1.5*a:p+1.5*a,g=h>c?h-y:h+y,_=Math.hypot(p-s,h-c),v=Math.hypot(m-s,g-c),_<v?(l=p,u=h):(l=m,u=g);break;default:l=e+n/2,u=t+r/2}return{x:l+o.x-n/2,y:u+o.y-r/2}},ae=`#037758.#99092a.#067070.#c6650f.#008726.#3d7004.#348402.#057f58.#b58612.#c44c01.#0a7704.#0e910e.#027377.#c99e02.#054160.#157a01.#b10de2.#0d6289.#bc5d03.#ba0cd1.#d39f10.#0c4c7a.#460782.#a51f10.#cecb10.#9b0943.#607f0c.#007a4b.#bf0daa.#af0ad8`.split(`.`),oe=()=>ae[Math.floor(Math.random()*ae.length)],P=({wire:e,storeName:t,noSync:n=[],defaultValue:r},i)=>(a,o,s)=>{a({ready:!1});let c=[];(async()=>{try{let n=await e.call(`${t}_getValue`);a(e=>({...e,...n}))}catch{r!==void 0&&a(r)}c.push(await e.register(`${t}_getValue`,()=>Object.fromEntries(Object.entries(o()).filter(([e,t])=>typeof t!=`function`&&!n.includes(e))),{invoke:`first`})),c.push(e.subscribe(`${t}_call`,([e,t])=>{u[e](...t)})),a({ready:!0})})();let l=i(a,o,s),u={...l},d=Object.fromEntries(Object.entries(l).map(([r,i])=>typeof i==`function`&&!r.startsWith(`get`)&&!n.includes(r)?[r,(...n)=>{let a=i(...n);return e.publish(`${t}_call`,[r,n]),a}]:[r,i]));return d.unsub=()=>{c.forEach(e=>e())},d},se=t.default.createContext(),ce=(e,t)=>({items:{},getItems:()=>t().items,setItems:t=>e({items:t}),updateItems:(t,n=!1)=>e(e=>n?{items:Object.fromEntries(Object.entries(e.items).map(([e,n])=>t[e]?[e,{...n,...t[e]}]:[e,n]))}:{items:{...e.items,...t}}),moveItems:(t,n)=>e(({items:e})=>{let r={...e};return t.forEach(t=>{let i=e[t];i&&(r[t]={...i,x:(i.x||0)+n.x,y:(i.y||0)+n.y,moving:!0})}),{items:r}})}),le=(e,t)=>({itemIds:[],setItemIds:t=>e({itemIds:t}),getItemIds:()=>t().itemIds,insert:(t,n)=>e(e=>{let r=[...e.itemIds];return r.splice(t,0,n),{itemIds:r}}),remove:t=>e(e=>{let n=[...e.itemIds];return n.splice(t,1),{itemIds:n}}),updateItemIds:(t,n)=>e(e=>{let r=[...e.itemIds];return r[t]=n,{itemIds:r}}),updateManyItemIds:t=>e(e=>({itemIds:e.itemIds.map((e,n)=>t[n]===void 0?e:t[n])}))}),ue=(e,t)=>({removeItemsById:t=>e(e=>({itemIds:e.itemIds.filter(e=>!t.includes(e)),items:Object.fromEntries(Object.entries(e.items).filter(([e])=>!t.includes(e)))})),getItemList:()=>{let e=t().items;return t().itemIds.map(t=>e[t])},setItemList:t=>e({items:Object.fromEntries(t.map(e=>[e.id,e])),itemIds:t.map(({id:e})=>e)}),insertItems:(t,n)=>e(e=>{let r,i=t.map(({id:e})=>e);if(n){let t=e.itemIds.findIndex(e=>e===n);r=[...e.itemIds],r.splice(t,0,...i)}else r=[...e.itemIds,...i];return{items:{...e.items,...Object.fromEntries(t.map(e=>[e.id,e]))},itemIds:r}})}),de=(e,t)=>({boardConfig:{},getBoardConfig:()=>t().boardConfig,setBoardConfig:t=>e({boardConfig:t}),updateBoardConfig:t=>e(e=>({boardConfig:{...e.boardConfig,...t}}))}),fe=(e,t)=>({session:{},getSessionInfo:()=>t().session,setSessionInfo:t=>e({session:t}),updateSessionInfo:t=>e(e=>({session:{...e.session,...t}}))}),pe=({storeName:e,children:i,defaultValue:a})=>{let{wire:o}=S(`room`),[s,c]=t.default.useState(!1),[l]=t.default.useState(()=>(0,r.createStore)(P({wire:o,storeName:e,defaultValue:a},(...e)=>({...ce(...e),...le(...e),...ue(...e),...de(...e),...fe(...e)}))));return t.default.useEffect(()=>{let e=l.subscribe(t=>{t.ready&&(e(),c(!0))})},[l]),s?(0,n.jsx)(se.Provider,{value:l,children:i}):null},F=e=>{let n=(0,t.useContext)(se);return(0,i.useStoreWithEqualityFn)(n,e,a.shallow)},me=()=>{let[e,n]=F(e=>[e.itemIds,e.items]);return t.default.useMemo(()=>e.map(e=>n[e]),[e,n])},he=()=>{let[e,n,r]=F(e=>[e.items,e.itemIds,e.getItemList]),[i,a]=t.default.useState(r()),[,o]=t.default.useTransition();return t.default.useEffect(()=>{let e=r();o(()=>{a(e)})},[e,n,r]),i},ge=5e4,_e=t.default.createContext(),ve=(e,t)=>({config:{itemTemplates:{},actions:{},uid:null,itemExtent:{x:0,y:0,radius:0},boardWrapperRect:{},boardSize:ge},updateConfiguration:t=>e(e=>({config:{...e.config,...t}})),getConfiguration:()=>t().config}),ye=(e,t)=>({boardState:{movingItems:!1,selecting:!1,zooming:!1,panning:!1,translateX:0,translateY:0,scale:1,rotate:0},updateBoardState:t=>e(e=>({boardState:{...e.boardState,...t}})),getBoardState:()=>t().boardState}),be=(e,t)=>({interactions:{},getInteractions:()=>t().interactions,register:(t,n)=>e(e=>{let r=[...e.interactions[t]||[]];return r.push(n),{interactions:{...e.interactions,[t]:r}}}),unregister:(t,n)=>e(e=>{let r=(e.interactions[t]||[]).filter(e=>e!==n);return{interactions:{...e.interactions,[t]:r}}}),callInteractions:(e,n)=>{t().interactions[e]&&t().interactions[e].forEach(e=>{setTimeout(()=>e(n),0)})}}),xe=(e,t)=>({selection:[],setSelection:t=>e(e=>JSON.stringify(e.selection)===JSON.stringify(t)?{}:{selection:t}),getSelection:()=>t().selection,select:t=>e(e=>({selection:[...e.selection,...t]})),unselect:t=>e(e=>({selection:e.selection.filter(e=>!t.includes(e))})),clear:()=>e(e=>e.selection.length>0?{selection:[]}:{}),reverse:()=>e(e=>{let t=[...e.selection];return t.reverse(),{selection:t}}),selectionBox:null,setSelectionBox:t=>e(e=>{let n=e.selectionBox;return!n||!t||n.top!==t.top||n.left!==t.left||n.width!==t.width||n.height!==t.height?{selectionBox:t}:{}})}),Se=({children:e})=>{let[i]=t.default.useState(()=>(0,r.createStore)((...e)=>({...ve(...e),...ye(...e),...be(...e),...xe(...e)})));return(0,n.jsx)(_e.Provider,{value:i,children:e})},I=e=>{let n=(0,t.useContext)(_e);return(0,i.useStoreWithEqualityFn)(n,e,a.shallow)},Ce=()=>{let[e]=I(e=>[e.selection]);return e},we=()=>{let[e]=I(e=>[e.getSelection]);return e},Te=100,Ee=1e3,De=.8,L=!1,Oe=({x:e,y:t,scale:n,rotate:r,itemExtent:i,boardWrapperRect:a,boardSize:o})=>{let[s,c]=[e,t],l=D([a.width/2,a.height/2],{translateX:s,translateY:c,scale:n,rotate:r}),u={x:i.x+o/2,y:i.y+o/2},d={x:o/2,y:o/2},f=T(l,[u.x,u.y]),p=Math.min(a.width,a.height),m=i.radius+p/2/n-Te/n;if(f>m){let e=k({x:l[0],y:l[1]},u,u,m-1/n)[0],[t,i]=O([-e.x,-e.y],{translateX:a.width/2,translateY:a.height/2,scale:n,rotate:r});s=t,c=i}let h=T(l,[d.x,d.y]),g=o/2-T([0,0],[a.width,a.height])/n;if(h>g){let e=k({x:l[0],y:l[1]},d,d,g-1/n)[0];if(e){let[t,i]=O([-e.x,-e.y],{translateX:a.width/2,translateY:a.height/2,scale:n,rotate:r});s=t,c=i}}return[s,c]},R=()=>{let[e,n,r,i,a]=I(e=>[e.getBoardState,e.updateBoardState,e.config.itemExtent,e.getConfiguration,e.updateConfiguration]),s=t.default.useRef([.15,5]),[c]=F(e=>[e.getItemList]),l=t.default.useCallback(()=>{let{translateX:t,translateY:n,scale:r,rotate:i}=e();return{translateX:t,translateY:n,scale:r,rotate:i}},[e]),u=t.default.useCallback((t,n)=>D([t,n],e()),[e]),d=t.default.useCallback((t,n)=>O([t,n],e()),[e]),f=t.default.useCallback((t,n)=>{let{scale:r,rotate:i}=e();return D([t,n],{translateX:0,translateY:0,rotate:i,scale:r})},[e]),p=t.default.useCallback(e=>e>s.current[1]?s.current[1]:e<s.current[0]?s.current[0]:e,[]),m=t.default.useCallback(t=>{let{itemExtent:r,boardWrapperRect:a,boardSize:o}=i(),s=e(),{translateX:c,translateY:l,scale:u,rotate:d}={...s,...t(s)};L&&console.log(`New expected values: `,c,l,u,d);let f=p(u),[m,h]=[c,l];(c!==s.translateX||l!==s.translateY)&&([m,h]=Oe({x:c,y:l,scale:f,rotate:d,itemExtent:r,boardWrapperRect:a,boardSize:o})),L&&console.log(`New fixed values: `,m,h,f,d),n({translateX:isNaN(m)?0:m,translateY:isNaN(h)?0:h,scale:isNaN(f)?p(1):f,rotate:isNaN(d)?0:d})},[p,e,i,n]),h=t.default.useCallback(e=>{let t=t=>({...t,...e});typeof e==`function`&&(t=e),m(e=>({...e,...t({translateX:e.translateX,translateY:e.translateY})}))},[m]),g=t.default.useCallback(({to:t,factor:n})=>{let{boardWrapperRect:r}=i(),a=t;a||={x:r.left+r.width/2,y:r.top+r.height/2};let o=e(),s=p(o.scale*n),c=a.x-r.left,l=a.y-r.top,u=c-(c-o.translateX)*s/o.scale,d=l-(l-o.translateY)*s/o.scale;m(e=>({...e,translateX:u,translateY:d,scale:s}))},[p,e,i,m]),_=t.default.useCallback(({x:t,y:n,radius:r})=>{let{rotate:a}=e(),{boardWrapperRect:o,boardSize:s}=i(),[c,l,u]=[t||0,n||0,r||2e3],d=o.width/(u*2),f=o.height/(u*2),h=p(Math.min(d,f)*De),[g,_]=O([-s/2-c,-s/2-l],{translateX:o.width/2,translateY:o.height/2,scale:h,rotate:a});m(e=>({...e,translateX:g,translateY:_,scale:h}))},[p,e,i,m]),v=t.default.useCallback(()=>{let{boardWrapperRect:e,boardSize:t}=i(),[n,r]=u(e.width/2,e.height/2);return{x:n-t/2,y:r-t/2}},[u,i]),y=t.default.useCallback(()=>{let e=c(),{boardSize:t,uid:n}=i(),r=e.reduce((e,t)=>{let r=M(n,t.id);return r&&(e.left=Math.min(t.x,e.left),e.top=Math.min(t.y,e.top),e.right=Math.max(t.x+r.offsetWidth,e.right),e.bottom=Math.max(t.y+r.offsetHeight,e.bottom)),e},{left:t/2,top:t/2,right:-t/2,bottom:-t/2}),o={x:(r.right+r.left)/2,y:(r.bottom+r.top)/2};o.radius=Math.max(T([o.x,o.y],[r.left,r.top]),Ee),a({itemExtent:o})},[i,c,a]),b=t.default.useCallback(e=>{let t=()=>e;typeof e==`function`&&(t=e),m(e=>({...e,rotate:t(e.rotate)})),y(),_(r)},[r,m,y,_]),x=(0,o.useDebouncedCallback)(()=>y(),[y],200);return t.default.useEffect(()=>{window.debugUpdateExtent=()=>y(),window.debugDisplayExtent=()=>console.log(i().itemExtent),window.debugSetDebug=()=>{L=!0}},[i,y]),{setDim:m,rotateBoard:b,moveBoard:h,getDim:l,zoomTo:g,zoomToCenter:g,zoomToExtent:_,getCenter:v,updateItemExtent:x,vectorFromWrapperToBoard:f,fromWrapperToBoard:u,fromBoardToWrapper:d}},z=e=>{let[n,r,i]=I(({register:e,unregister:t,callInteractions:n})=>[e,t,n]);return{register:t.default.useCallback(t=>(n(e,t),()=>{r(e,t)}),[e,n,r]),call:t.default.useCallback(t=>{i(e,t)},[i,e])}},B=()=>{let{call:e}=z(`place`),{call:n}=z(`delete`),{getCenter:r,updateItemExtent:i}=R(),[a,o,s,c]=I(e=>[e.clear,e.reverse,e.unselect,e.getConfiguration]),{getItems:l,getItemIds:u,setItemIds:d,updateItems:f,moveItems:p,removeItemsById:m,getItemList:h,insertItems:g,setItemList:_}=F(({getItems:e,getItemIds:t,setItemIds:n,updateItems:r,moveItems:i,removeItemsById:a,getItemList:o,insertItems:s,setItemList:c})=>({getItems:e,getItemIds:t,setItemIds:n,updateItems:r,moveItems:i,removeItemsById:a,getItemList:o,insertItems:s,setItemList:c})),v=t.default.useCallback((e,t,n=!1)=>{let r=t;typeof t==`object`&&(r=()=>t);let a=u().filter(t=>e.includes(t)),o=l(),s=a.map(e=>{let t=o[e];return n?[e,r(t)]:[e,r({...t})]}).filter(([,e])=>e);if(s.length===0)return;let c=Object.fromEntries(s);f(c,n),i()},[u,l,i,f]),y=t.default.useCallback(e=>{_(e),a(),i()},[a,_,i]),b=t.default.useCallback((e,t,n=!1)=>{v([e],t,n)},[v]),x=t.default.useCallback((e,t)=>{p(re(l(),u(),e),t)},[u,l,p]),S=t.default.useCallback(e=>{let t=u(),n=t.filter(t=>!e.includes(t)),r=t.filter(t=>e.includes(t));d([...n,...r])},[u,d]),T=t.default.useCallback((e,{type:t,size:n}={})=>{let{uid:r}=c();v(e,e=>{let i=M(r,e.id);if(!i)return;let a={type:t||`grid`,size:n||1,offset:{x:0,y:0},...e.grid};return ie({x:e.x,y:e.y,width:i.clientWidth,height:i.clientHeight},a)},!0)},[c,v]),E=t.default.useCallback((t,n)=>{let r=re(l(),u(),t);S(r),v(r,{moving:!1},!0),T(r,n),e(t),i()},[v,e,u,l,S,T,i]),D=t.default.useCallback(e=>{d(e)},[d]),O=t.default.useCallback(e=>{let t=u(),n=t.filter(t=>e.includes(t)),r=t.map(t=>e.includes(t)?n.pop():t);d(r),o()},[u,o,d]),k=t.default.useCallback((e,t)=>{let n=l(),r=Object.fromEntries(t.map((t,r)=>{let i=n[e[r]];return[t,{x:i.x,y:i.y}]}));v(e,e=>r[e.id],!0);let i=Object.fromEntries(e.map((e,n)=>[e,t[n]])),a=u().map(t=>e.includes(t)?i[t]:t);d(a)},[l,v,u,d]),j=t.default.useCallback((e,t)=>{let n=r(),i=e.map((e,t)=>!e.x||!e.y?{...e,x:n.x+2*t,y:n.y+2*t}:e);g(i,t),requestAnimationFrame(()=>{E(e.map(({id:e})=>e))})},[r,g,E]),ee=t.default.useCallback((e,t)=>{j([e],t)},[j]),N=t.default.useCallback(e=>{s(e),m(e),n(e)},[s,m,n]),te=t.default.useCallback(e=>{let t=l();return e.map(e=>t[e])},[l]);return{putItemsOnTop:S,batchUpdateItems:v,updateItemOrder:D,moveItems:x,placeItems:E,updateItem:b,swapItems:k,reverseItemsOrder:O,setItemList:y,pushItem:ee,pushItems:j,removeItems:N,getItemList:h,findElementUnderPointer:t.default.useCallback(({target:e,clientX:t,clientY:n},{returnLocked:r=!1,passLocked:i=!1}={})=>{if([`INPUT`,`TEXTAREA`].includes(e.tagName))return null;let a=w(e,`item`);if(a){if(C(a,`selected`))return a;if(!i&&C(a,`locked`)&&!C(e,`passthrough`))return r?a:null;if(C(e,`passthrough`)){let e=u(),{uid:r}=c(),o=e.reduce((e,i)=>{let a=M(r,i),o=a.getBoundingClientRect();return A({x:t,y:n},o)&&e.unshift(a),e},[]);for(let e=0;e<o.length;e+=1){let t=o[e];if(t!==a&&(i||!C(t,`locked`)))return t}return null}}return a},[c,u]),getItems:te}},ke=h(p(((e,t)=>{t.exports=function e(t,n){if(t===n)return!0;if(t&&n&&typeof t==`object`&&typeof n==`object`){if(t.constructor!==n.constructor)return!1;var r,i,a;if(Array.isArray(t)){if(r=t.length,r!=n.length)return!1;for(i=r;i--!==0;)if(!e(t[i],n[i]))return!1;return!0}if(t instanceof Map&&n instanceof Map){if(t.size!==n.size)return!1;for(i of t.entries())if(!n.has(i[0]))return!1;for(i of t.entries())if(!e(i[1],n.get(i[0])))return!1;return!0}if(t instanceof Set&&n instanceof Set){if(t.size!==n.size)return!1;for(i of t.entries())if(!n.has(i[0]))return!1;return!0}if(ArrayBuffer.isView(t)&&ArrayBuffer.isView(n)){if(r=t.length,r!=n.length)return!1;for(i=r;i--!==0;)if(t[i]!==n[i])return!1;return!0}if(t.constructor===RegExp)return t.source===n.source&&t.flags===n.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===n.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===n.toString();if(a=Object.keys(t),r=a.length,r!==Object.keys(n).length)return!1;for(i=r;i--!==0;)if(!Object.prototype.hasOwnProperty.call(n,a[i]))return!1;for(i=r;i--!==0;){var o=a[i];if(!e(t[o],n[o]))return!1}return!0}return t!==t&&n!==n}}))(),1),Ae=(e,t)=>{if(e.type in t){let n=t[e.type].defaultActions;return typeof n==`function`?n(e):n}return[]},je=(e,t)=>{let{actions:n=Ae(e,t)}=e;return n.map(e=>typeof e==`string`?{name:e}:e)},Me=()=>{let[e,n]=F(e=>[e.items,e.getItems]),[r,i,a]=I(e=>[e.config.itemTemplates,e.selection,e.getSelection]),[s,c]=t.default.useState([]),l=t.default.useRef(!1),[,u]=t.default.useTransition();t.default.useEffect(()=>(l.current=!0,()=>{l.current=!1}),[]);let d=t.default.useCallback(e=>{let t=n();if(e)return[e,e.map(e=>t[e])];let r=a();return[r,r.map(e=>t[e])]},[n,a]),f=(0,t.useCallback)(()=>{let[e,t]=d();if(e.length>0){if(!l.current)return;let e=t.reduce((e,t)=>{let n=je(t,r);return e.filter(e=>n.some(t=>(0,ke.default)(e,t)))},je(t[0],r));u(()=>{c(e)})}else u(()=>{c([])})},[d,r]);return(0,o.useDebouncedEffect)(()=>f(),[e,i,f],100),{availableActions:s}},Ne=()=>{let[e]=I(e=>[e.selectionBox]);return e},Pe=`useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict`,V=(e=21)=>{let t=``,n=crypto.getRandomValues(new Uint8Array(e|=0));for(;e--;)t+=Pe[n[e]&63];return t},Fe=t.default.createContext(),H=e=>{localStorage.setItem(`user`,JSON.stringify(e))},Ie=()=>{if(localStorage.user){let e={name:`Player`,color:oe(),uid:V(),...JSON.parse(localStorage.user)};return H(e),e}let e={name:`Player`,color:oe(),uid:V()};return H(e),e},Le=e=>(t,n)=>({isSpaceMaster:!1,users:{},getUser:()=>n().users[e],getUsers:()=>n().users,getUserList:()=>Object.values(n().users),getLocalUsers:()=>{if(!n().users[e])return[];let{space:t}=n().users[e];return n().getUserList().filter(({space:e})=>e===t)},addUser:e=>t(t=>({users:{...t.users,[e.id]:e}})),updateUser:(r,i)=>t(t=>{if(!t.users[r])return{};let a={...t.users[r],...i,id:r,uid:t.users[r].uid};return a.id===e&&H(a),setTimeout(()=>n().electSpaceMaster(),100),{users:{...t.users,[r]:a}}}),removeUser:e=>t(t=>{let r={...t.users};return delete r[e],setTimeout(()=>n().electSpaceMaster(),100),{users:r}}),updateCurrentUser:t=>n().updateUser(e,t),joinSpace:t=>n().updateUser(e,{space:t,spaceJoinedTimestamp:Date.now()}),electSpaceMaster:()=>{let r=n().getLocalUsers(),i={uid:null,timestamp:Date.now()};Object.values(r).forEach(({spaceJoinedTimestamp:e,id:t})=>{e<i.timestamp&&(i.id=t,i.timestamp=e)}),t({isSpaceMaster:i.id===e})}}),Re=e=>({cursors:{},moveCursor:(t,n)=>e(e=>({cursors:{...e.cursors,[t]:n}})),removeCursor:t=>e(e=>{let n={...e.cursors};return delete n[t],{cursors:n}})}),ze=({storeName:e,children:i})=>{let{wire:a,isMaster:o}=S(`room`),[s,c]=t.default.useState(null),[l,u]=t.default.useState(!1),d=t.default.useRef(!1);return t.default.useEffect(()=>{let t=!0,n=[];if(!s&&!d.current)return d.current=!0,(()=>{let n=(0,r.createStore)(P({wire:a,storeName:e,noSync:[`updateCurrentUser`,`joinSpace`,`isSpaceMaster`,`electSpaceMaster`]},(...e)=>({...Le(a.userId)(...e),...Re(...e)}),a,e)),i=n.subscribe(e=>{e.ready&&(i(),t&&c(n))})})(),()=>{t=!1,d.current=!1,n.forEach(e=>e())}},[s,e,a,a.userId]),t.default.useEffect(()=>{if(s)return s.getState().addUser({...Ie(),id:a.userId}),u(!0),()=>{s.getState().removeUser(a.userId)}},[o,s,a]),t.default.useEffect(()=>{if(s){let e=a.subscribe(`userLeave`,e=>{s.getState().removeUser(e)});return()=>{e()}}},[o,s,a]),t.default.useEffect(()=>{o&&s&&s.getState().updateCurrentUser({isMaster:o})},[o,s,a]),l?(0,n.jsx)(Fe.Provider,{value:s,children:i}):null},U=e=>{let n=(0,t.useContext)(Fe);return(0,i.useStoreWithEqualityFn)(n,e,a.shallow)},Be=()=>{let[e,n,r,i,a]=U(e=>[e.isSpaceMaster,e.getUser(),e.users,e.updateCurrentUser,e.joinSpace]),o=t.default.useMemo(()=>Object.values(r),[r]);return{isSpaceMaster:e,currentUser:n,updateCurrentUser:i,users:o,localUsers:t.default.useMemo(()=>{let{space:e}=n;return o.filter(({space:t})=>t===e)},[n,o]),joinSpace:a}},Ve=()=>{let[e,n,r]=F(e=>[e.boardConfig,e.getBoardConfig,e.setBoardConfig]);return[e,t.default.useCallback(e=>{let t=e;typeof e==`object`&&(t=()=>e);let i=n(),a=t(i);r(a)},[n,r])]},He=()=>{let[e]=I(e=>[e.boardState]);return e},Ue=()=>{let[e,t,n,r]=F(e=>[e.getSessionInfo,e.setSessionInfo,e.updateSessionInfo,e.session]);return{getSessionInfo:e,setSessionInfo:t,sessionInfo:r,updateSessionInfo:n}},We=t.default.createContext(),Ge=({user:{name:e,uid:t,color:n},content:r})=>({type:`message`,user:{name:e,uid:t,color:n},content:r,uid:V(),timestamp:new Date().toISOString()}),Ke=(e,t)=>({messages:[],setMessages:t=>e({messages:t.map(e=>({...e,timestamp:Date.parse(e.timestamp)}))}),addMessage:t=>e(e=>({messages:[...e.messages,{...t,timestamp:Date.parse(t.timestamp)}]})),sendMessage:(e,n)=>{let r=Ge({user:e,content:n});r&&t().addMessage(r)}}),qe=({storeName:e,children:i,defaultValue:a=[]})=>{let{wire:o}=S(`room`),[s]=t.default.useState(()=>(0,r.createStore)(P({wire:o,storeName:e,defaultValue:a,noSync:[`sendMessage`]},(...e)=>({...Ke(...e)}))));return(0,n.jsx)(We.Provider,{value:s,children:i})},Je=e=>{let n=(0,t.useContext)(We);return(0,i.useStoreWithEqualityFn)(n,e,a.shallow)},Ye=()=>{},Xe=(e=Ye)=>{let n=U(e=>e.getUser()),[r,i,a]=Je(e=>[e.messages,e.setMessages,e.sendMessage]);return t.default.useEffect(()=>{r.length&&e()},[r,e]),{messages:r,setMessages:i,sendMessage:t.default.useCallback(e=>{a(n,e)},[n,a])}},Ze=({children:e,session:n})=>{let r=U(e=>e.joinSpace);return t.default.useEffect(()=>(r(n),()=>{r(null)}),[r,n]),e},Qe=({socket:e,room:r,session:i,items:a=[],messages:o=[],LoadingComponent:s,...c})=>{let[l]=t.default.useState(r||V()),[u]=t.default.useState(i||V()),[d]=t.default.useState(()=>({itemIds:a.map(({id:e})=>e),items:Object.fromEntries(a.map(e=>[e.id,e]))}));return S(`room`)?(0,n.jsx)(qe,{storeName:`${u}_messages`,defaultValue:o,children:(0,n.jsx)(Se,{children:(0,n.jsx)(pe,{storeName:`${u}_item`,defaultValue:d,children:(0,n.jsx)(Ze,{...c,session:u})})})}):(0,n.jsx)(x,{room:l,channel:`room`,socket:e,LoadingComponent:s,children:(0,n.jsx)(ze,{storeName:`${l}_users`,children:(0,n.jsx)(qe,{storeName:`${u}_messages`,defaultValue:o,children:(0,n.jsx)(Se,{children:(0,n.jsx)(pe,{storeName:`${u}_item`,defaultValue:d,children:(0,n.jsx)(Ze,{...c,session:u})})})})})})},$e=({socket:e,room:r,children:i,LoadingComponent:a})=>{let[o]=t.default.useState(r||V());return(0,n.jsx)(x,{room:o,channel:`room`,socket:e,LoadingComponent:a,children:(0,n.jsx)(ze,{storeName:`${o}_users`,children:i})})},et={data:``},tt=e=>{if(typeof window==`object`){let t=(e?e.querySelector(`#_goober`):window._goober)||Object.assign(document.createElement(`style`),{innerHTML:` `,id:`_goober`});return t.nonce=window.__nonce__,t.parentNode||(e||document.head).appendChild(t),t.firstChild}return e||et},nt=/(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g,rt=/\/\*[^]*?\*\/| +/g,it=/\n+/g,W=(e,t)=>{let n=``,r=``,i=``;for(let a in e){let o=e[a];a[0]==`@`?a[1]==`i`?n=a+` `+o+`;`:r+=a[1]==`f`?W(o,a):a+`{`+W(o,a[1]==`k`?``:t)+`}`:typeof o==`object`?r+=W(o,t?t.replace(/([^,])+/g,e=>a.replace(/([^,]*:\S+\([^)]*\))|([^,])+/g,t=>/&/.test(t)?t.replace(/&/g,e):e?e+` `+t:t)):a):o!=null&&(a=a[1]==`-`?a:a.replace(/[A-Z]/g,`-$&`).toLowerCase(),i+=W.p?W.p(a,o):a+`:`+o+`;`)}return n+(t&&i?t+`{`+i+`}`:i)+r},G={},at=e=>{if(typeof e==`object`){let t=``;for(let n in e)t+=n+at(e[n]);return t}return e},ot=(e,t,n,r,i)=>{let a=at(e),o=G[a]||(G[a]=(e=>{let t=0,n=11;for(;t<e.length;)n=101*n+e.charCodeAt(t++)>>>0;return`go`+n})(a));if(!G[o]){let t=a===e?(e=>{let t,n,r=[{}];for(;t=nt.exec(e.replace(rt,``));)t[4]?r.shift():t[3]?(n=t[3].replace(it,` `).trim(),r.unshift(r[0][n]=r[0][n]||{})):r[0][t[1]]=t[2].replace(it,` `).trim();return r[0]})(e):e;G[o]=W(i?{[`@keyframes `+o]:t}:t,n?``:`.`+o)}let s=n&&G.g;return n&&(G.g=G[o]),((e,t,n,r)=>{r?t.data=t.data.replace(r,e):t.data.indexOf(e)===-1&&(t.data=n?e+t.data:t.data+e)})(G[o],t,r,s),o},st=(e,t,n)=>e.reduce((e,r,i)=>{let a=t[i];if(a&&a.call){let e=a(n),t=e&&e.props&&e.props.className||/^go/.test(e)&&e;a=t?`.`+t:e&&typeof e==`object`?e.props?``:W(e,``):!1===e?``:e}return e+r+(a??``)},``);function K(e){let t=this||{},n=e.call?e(t.p):e;return ot(n.unshift?n.raw?st(n,[].slice.call(arguments,1),t.p):n.reduce((e,n)=>Object.assign(e,n&&n.call?n(t.p):n),{}):n,tt(t.target),t.g,t.o,t.k)}K.bind({g:1}),K.bind({k:1});function ct(e,t,n,r){W.p=t}var lt=h(p(((e,t)=>{t.exports=function e(t,n){if(t===n)return!0;if(t&&n&&typeof t==`object`&&typeof n==`object`){if(t.constructor!==n.constructor)return!1;var r,i,a;if(Array.isArray(t)){if(r=t.length,r!=n.length)return!1;for(i=r;i--!==0;)if(!e(t[i],n[i]))return!1;return!0}if(t.constructor===RegExp)return t.source===n.source&&t.flags===n.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===n.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===n.toString();if(a=Object.keys(t),r=a.length,r!==Object.keys(n).length)return!1;for(i=r;i--!==0;)if(!Object.prototype.hasOwnProperty.call(n,a[i]))return!1;for(i=r;i--!==0;){var o=a[i];if(!e(t[o],n[o]))return!1}return!0}return t!==t&&n!==n}}))(),1),q=()=>{let e=navigator.userAgent.toLowerCase();return/mac os ?x 10/.test(e)},ut=(()=>{let e=document.createElement(`iframe`);e.src=`#`,document.body.appendChild(e);let t=e.contentWindow.document;t.open(),t.write(`<!DOCTYPE html><html><head></head><body><span>a</span></body></html>`),t.close();let n=t.body.firstElementChild.offsetHeight;return document.body.removeChild(e),n})(),dt=800,ft=(e,t)=>e[Object.keys(e).map(e=>Number(e)).find(e=>e!==t)],pt=([e,t],[n,r])=>{let i=Math.abs(e-n),a=Math.abs(t-r);return Math.hypot(i,a)},J=()=>{},mt=e=>t=>{let{event:n}=t;return n.isPropagationStopped()?null:e(t)},ht=e=>async(...t)=>{try{await e(...t)}catch(e){console.error(e)}},Y=new class{lastPromise=Promise.resolve(!0);add(e,...t){return new Promise((n,r)=>{this.lastPromise=this.lastPromise.then(()=>mt(ht(e))(...t)).then(n).catch(r)})}},X=({children:e,onDrag:r=J,onDragStart:i=J,onDragEnd:a=J,onPan:o=J,onTap:s=J,onLongTap:c=J,onDoubleTap:l=J,onZoom:u,mainAction:d=`drag`})=>{let f=t.default.useRef(null),p=t.default.useRef({moving:!1,pointers:{},mainPointer:void 0}),m=e=>{let{deltaX:t,deltaY:n,clientX:r,clientY:i,deltaMode:a,ctrlKey:s,altKey:c,metaKey:l,target:d}=e;if(!(c||s&&!q())){if(q()&&!s)Y.add(o,{deltaX:-2*t,deltaY:-2*n,button:1,ctrlKey:s,metaKey:l,target:d,event:e});else{if(u===void 0||!n)return;let t=n;switch(a){case 1:t*=ut;break;case 2:t*=dt}q()&&(t*=2),Y.add(u,{scale:t,clientX:r,clientY:i,event:e})}}},h=e=>{let{target:t,button:n,clientX:r,clientY:i,pointerId:a,altKey:o,ctrlKey:s,metaKey:l,isPrimary:u}=e;if(p.current.pointers[a]={clientX:r,clientY:i},u&&(p.current.mainPointer=void 0),p.current.mainPointer!==void 0){if(p.current.mainPointer!==a)try{let{clientX:e,clientY:t}=ft(p.current.pointers,a),n=(e+r)/2,o=(t+i)/2,s=pt([e,t],[r,i]);Object.assign(p.current,{pressed:!0,moving:!1,gestureStart:!1,startX:r,startY:i,prevX:n,prevY:o,startDistance:s,prevDistance:s})}catch(e){console.log(`Error while getting other pointer. Ignoring`,e),p.current.mainPointer}return}p.current.mainPointer=a,Object.assign(p.current,{pressed:!0,moving:!1,gestureStart:!1,startX:r,startY:i,prevX:r,prevY:i,currentButton:n,pointerDownEvent:e,startDistance:0,prevDistance:0,target:t,timeStart:Date.now(),longTapTimeout:setTimeout(async()=>{p.current.noTap=!0,Y.add(c,{clientX:r,clientY:i,altKey:o,ctrlKey:s,metaKey:l,target:t,event:e})},750)});try{t.setPointerCapture(a)}catch(e){console.log(`Fail to capture pointer`,e)}},g=e=>{if(p.current.pressed){let{pointerId:t,clientX:n,clientY:a,altKey:s,shiftKey:c,ctrlKey:l,metaKey:m,buttons:h}=e;p.current.pointers[t]={clientX:n,clientY:a},p.current.moving=!0;let g=Object.keys(p.current.pointers).length===2,_,v,y=0;if(g){let{clientX:e,clientY:r}=ft(p.current.pointers,t);_=(e+n)/2,v=(r+a)/2,y=pt([e,r],[n,a])}else _=n,v=a;let b=c||s||l||m||h!==1;d!==`drag`&&(b=!b);let x=!b,S=b;if(x){p.current.gestureStart||(f.current.style.cursor=`move`,p.current.gestureStart=!0,clearTimeout(p.current.longTapTimeout),Y.add(i,{deltaX:0,deltaY:0,startX:p.current.startX,startY:p.current.startY,clientX:p.current.startX,clientY:p.current.startY,distanceX:0,distanceY:0,button:p.current.currentButton,altKey:s,shiftKey:c,ctrlKey:l,metaKey:m,target:p.current.target,event:p.current.pointerDownEvent}));let t=_-p.current.prevX,n=v-p.current.prevY,a=_-p.current.startX,o=v-p.current.startY;Y.add(r,{deltaX:t,deltaY:n,startX:p.current.startX,startY:p.current.startY,clientX:_,clientY:v,distanceX:a,distanceY:o,button:p.current.currentButton,altKey:s,shiftKey:c,ctrlKey:l,metaKey:m,target:p.current.target,event:e})}if(S){p.current.gestureStart||(f.current.style.cursor=`move`,p.current.gestureStart=!0,clearTimeout(p.current.longTapTimeout));let t=_-p.current.prevX,n=v-p.current.prevY,{target:r}=p.current;if(Y.add(o,{deltaX:t,deltaY:n,button:p.current.currentButton,altKey:s,shiftKey:c,ctrlKey:l,metaKey:m,target:r,event:e}),y!==p.current.prevDistance&&u){let t=p.current.prevDistance-y;Math.abs(t)>0&&(Y.add(u,{scale:t*3,clientX:_,clientY:v,event:e}),p.current.prevDistance=y)}}p.current.prevX=_,p.current.prevY=v}},_=e=>{let{clientX:t,clientY:n,altKey:r,shiftKey:i,ctrlKey:o,metaKey:c,target:l,pointerId:u}=e;if(p.current.pointers[u]){if(delete p.current.pointers[u],p.current.mainPointer!==u){let{clientX:e,clientY:t}=p.current.pointers[p.current.mainPointer];Object.assign(p.current,{prevX:e,prevY:t,prevDistance:0,startDistance:0});return}for(;Object.keys(p.current.pointers).length>0;){p.current.mainPointer=Number(Object.keys(p.current.pointers)[0]);try{p.current.target.setPointerCapture(p.current.mainPointer);let{clientX:e,clientY:t}=p.current.pointers[p.current.mainPointer];Object.assign(p.current,{prevX:e,prevY:t,prevDistance:0,startDistance:0});return}catch(e){console.log(`Fails to set pointer capture`,e),p.current.mainPointer=void 0,delete p.current.pointers[Object.keys(p.current.pointers)[0]]}}if(p.current.mainPointer=void 0,p.current.pressed=!1,clearTimeout(p.current.longTapTimeout),p.current.moving)p.current.moving=!1,Y.add(a,{deltaX:t-p.current.prevX,deltaY:n-p.current.prevY,startX:p.current.startX,startY:p.current.startY,clientX:t,clientY:n,distanceX:t-p.current.startX,distanceY:n-p.current.startY,button:p.current.currentButton,altKey:r,shiftKey:i,ctrlKey:o,metaKey:c,event:e}),f.current.style.cursor=`auto`;else{let a=Date.now();p.current.noTap?p.current.noTap=!1:p.current.timeStart-a<300&&Y.add(s,{clientX:t,clientY:n,altKey:r,shiftKey:i,ctrlKey:o,metaKey:c,target:l,event:e})}}};return(0,n.jsx)(`div`,{onWheel:m,onPointerDown:h,onPointerMove:g,onPointerUp:_,onPointerOut:_,onPointerLeave:_,onPointerCancel:_,onDoubleClick:e=>{let{clientX:t,clientY:n,altKey:r,shiftKey:i,ctrlKey:a,metaKey:o,target:s}=e;Y.add(l,{clientX:t,clientY:n,altKey:r,shiftKey:i,ctrlKey:a,metaKey:o,target:s,event:e})},style:{touchAction:`none`},ref:f,children:e})},gt=({onResize:e,...t})=>{let[r]=I(e=>[e.getBoardState]);return(0,n.jsx)(X,{onDrag:({deltaX:t,deltaY:n,event:i})=>{i.stopPropagation();let{scale:a}=r();e({width:t/a,height:n/a})},children:(0,n.jsx)(`div`,{...t})})},_t=K`
7
2
  display: inline-block;
8
3
  transition: transform 150ms;
9
4
  user-select: none;
10
5
  padding: 2px;
11
6
  box-sizing: border-box;
12
- `,Gt=q`
7
+ `,vt=K`
13
8
  border: 2px dashed #db5034;
14
9
  padding: 0px;
15
10
  cursor: pointer;
16
- `,Z=q`
11
+ `,Z=K`
17
12
  position: absolute;
18
13
  width: 0px;
19
14
  height: 0px;
20
- `,Kt=q`
15
+ `,yt=K`
21
16
  top: 0;
22
17
  left: 0;
23
- `,qt=q`
18
+ `,bt=K`
24
19
  top: 0;
25
20
  right: 0;
26
- `,Jt=q`
21
+ `,xt=K`
27
22
  bottom: 0;
28
23
  left: 0;
29
- `,Yt=q`
24
+ `,St=K`
30
25
  bottom: 0;
31
26
  right: 0;
32
- `,Xt=q`
27
+ `,Ct=K`
33
28
  top: 50%;
34
29
  left: 50%;
35
- `,Zt=q`
30
+ `,wt=K`
36
31
  position: absolute;
37
32
 
38
33
  width: 10px;
@@ -40,17 +35,17 @@ React keys must be passed directly to JSX without using spread:
40
35
  border: 2px solid #db5034;
41
36
  background-color: #db5034;
42
37
  cursor: move;
43
- `,Qt=q`
38
+ `,Tt=K`
44
39
  cursor: ew-resize;
45
40
  right: -6px;
46
41
  top: calc(50% - 5px);
47
- `,$t=q`
42
+ `,Et=K`
48
43
  cursor: ns-resize;
49
44
  bottom: -6px;
50
45
  left: calc(50% - 5px);
51
- `,en=q`
46
+ `,Dt=K`
52
47
  cursor: nwse-resize;
53
48
  bottom: -6px;
54
49
  right: -6px;
55
- `,tn=({onReload:e})=>(0,g.jsxs)(`div`,{className:`syncboard-error-item ${q({width:`100px`,display:`flex`,flexDirection:`column`,justifyContent:`center`,textAlign:`center`,color:`red`})}`,children:[`Sorry, this item seems broken.`,(0,g.jsx)(`button`,{onClick:e,children:`Reload it`})]}),nn=class extends t.default.Component{constructor(e){super(e),this.state={hasError:!1,itemId:e.itemId},this.onReload=this.onReload.bind(this)}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e){console.error(`Error for item ${this.state.itemId}`,e,this.props.state)}onReload(){this.setState({hasError:!1})}render(){let{ErrorComponent:e}=this.props;return this.state.hasError?(0,g.jsx)(e,{onReload:this.onReload}):this.props.children}},rn=e=>{e.target.className=``},an=({width:e,height:t,actualWidth:n,actualHeight:r,prevState:i,keepRatio:a})=>{let{width:o,height:s}=i;if([o,s]=[parseFloat(o),parseFloat(s)],(!o||Number.isNaN(Number(o)))&&(o=n),(!s||Number.isNaN(Number(s)))&&(s=r),a){let n=o/s;return{...i,width:(o+e).toFixed(1),height:(s+t/n).toFixed(1)}}return{...i,width:(o+e).toFixed(1),height:(s+t).toFixed(1)}},on={w:!0,h:!0,b:!0},sn=(0,t.memo)(({setState:e,state:{type:n,rotation:r=0,id:i,locked:a,extraClasses:o,...s}={},animate:c=`hvr-pop`,isSelected:l,itemMap:u,showResizeHandle:d=!0})=>{let f=t.default.useRef(null),[p]=z(e=>[e.config.uid]),{component:m=()=>null,resizeDirections:h=on,resize:_=an}=u[n],v=t.default.useCallback((t,n=!1)=>e(i,t,n),[e,i]);t.default.useEffect(()=>{f.current.className=c},[c]);let y=[`item`,i,Wt];a&&y.push(`locked`),l&&(y.push(`selected`),y.push(Gt)),Array.isArray(o)&&y.concat(o);let b=y.join(` `),x=({width:e=0,height:t=0,keepRatio:n})=>{v(r=>{let{offsetWidth:i,offsetHeight:a}=f.current;return _({prevState:r,width:e,height:t,actualHeight:a,actualWidth:i,keepRatio:n})})},S=({width:e})=>{x({width:e})},C=({height:e})=>{x({height:e})},w=({width:e})=>{x({height:e,width:e,keepRatio:!0})};return(0,g.jsx)(`div`,{style:{transform:`rotate(${r}deg`},"data-id":i,id:`${p}__${i}`,className:b,children:(0,g.jsxs)(`div`,{style:{display:`flex`},ref:f,onAnimationEnd:rn,onKeyDown:e=>e.stopPropagation(),onKeyUp:e=>e.stopPropagation(),children:[(0,g.jsx)(nn,{itemId:i,state:s,ErrorComponent:u?.error?.component||tn,children:(0,g.jsx)(m,{...s,id:i,setState:v})}),(0,g.jsx)(`div`,{className:`corner ${Z} ${Kt}`}),(0,g.jsx)(`div`,{className:`corner ${Z} ${qt}`}),(0,g.jsx)(`div`,{className:`corner ${Z} ${Yt}`}),(0,g.jsx)(`div`,{className:`corner ${Z} ${Jt}`}),(0,g.jsx)(`div`,{className:`center ${Z} ${Xt}`}),d&&(0,g.jsxs)(g.Fragment,{children:[h.b&&(0,g.jsx)(Ut,{className:`${Zt} ${en}`,onResize:w}),h.h&&(0,g.jsx)(Ut,{className:`${Zt} ${$t}`,onResize:C}),h.w&&(0,g.jsx)(Ut,{className:`${Zt} ${Qt}`,onResize:S})]})]})})},({state:e,setState:t,isSelected:n,showResizeHandle:r},{state:i,setState:a,isSelected:o,showResizeHandle:s})=>n===o&&r===s&&t===a&&(0,Ft.default)(e,i)),cn=e=>e,ln=(0,t.memo)(({state:e={},getCurrentUser:t,className:n,...r})=>{if(!r.itemMap[e.type])return null;let{stateHook:i=cn}=r.itemMap[e.type],{x:a=0,y:o=0,layer:s=0,moving:c,...l}=i(e,{currentUser:t?.()}),u=(s+4)*10+100+(c?5:0);return(0,g.jsx)(`div`,{className:n,style:{transform:`translate(${a}px, ${o}px)`,zIndex:u},children:(0,g.jsx)(sn,{...r,showResizeHandle:r.isSelected&&r.showResizeHandle,state:l})})}),un=()=>{let{updateItem:e}=H(),[t,n]=R(e=>[e.itemIds,e.items]),[r,i,a,o]=z(e=>[e.config.boardSize,e.config.showResizeHandle,e.config.itemTemplates,e.selection]),[s]=W(e=>[e.getUser]),c=q({position:`absolute`,top:`${r/2}px`,left:`${r/2}px`,display:`inline-block`,lineHeight:0});return t.map(t=>(0,g.jsx)(ln,{state:n[t],setState:e,isSelected:o.includes(t),itemMap:a,boardSize:r,getCurrentUser:s,showResizeHandle:i,className:c},t))},dn=q({zIndex:210,position:`absolute`,backgroundColor:`hsla(0, 40%, 50%, 10%)`,border:`2px solid hsl(0, 55%, 40%)`}),fn=(e,t,n=!1)=>{let r=t.getElementsByClassName(`selector`);if(!r.length)return[];let i=r[0];return Array.from(t.getElementsByClassName(`item`)).filter(t=>{let r=e[L(t)];return!r||!n&&r.locked?!1:le(t,i)}).map(e=>L(e))},pn=({children:e,moveFirst:n})=>{let[r,i,a,o,s,c]=z(e=>[e.getSelection,e.clear,e.setSelection,e.select,e.getConfiguration,e.getBoardState,e.updateBoardState]),{findElementUnderPointer:l}=H(),[u]=R(e=>[e.getItems]),[d,f]=t.default.useState({}),[,p]=t.default.useTransition(),[m,h]=t.default.useState(!1),_=t.default.useRef(null),v=t.default.useRef({moving:!1});return B(document,`keydown`,e=>{e.key===`l`&&h(!0)}),B(document,`keyup`,e=>{e.key===`l`&&h(!1)}),t.default.useEffect(()=>(i(),()=>{i()}),[i]),t.default.useEffect(()=>{if(v.current.moving){let e=u(),{boardWrapper:t}=s(),n=fn(e,t,m);p(()=>{a(n)})}},[s,u,d,a,m]),(0,g.jsx)(X,{onDragStart:async e=>{await l(e)||(v.current.moving=!0,p(()=>{c({selecting:!0})}),_.current.style.cursor=`crosshair`)},onDrag:({distanceY:e,distanceX:t,startX:n,startY:r})=>{if(v.current.moving){let{top:i,left:a}=_.current.getBoundingClientRect(),o=n-a,s=r-i;t>0?(v.current.left=o,v.current.width=t):(v.current.left=o+t,v.current.width=-t),e>0?(v.current.top=s,v.current.height=e):(v.current.top=s+e,v.current.height=-e),f({...v.current,moving:!0})}},onDragEnd:()=>{v.current.moving&&(p(()=>{c({selecting:!1})}),v.current.moving=!1,f({moving:!1}),_.current.style.cursor=`auto`)},onTap:e=>{let{target:t,ctrlKey:n,metaKey:s}=e,c=l(e);if(!c&&N(t,`board`))i();else{let e=L(c);if(!e){i();return}let t=r();c&&!t.includes(e)&&(n||s?o([e]):a([e]))}},onLongTap:({target:e})=>{let t=N(e,`item`);if(t){let e=L(t);a([e])}},mainAction:n?`pan`:`drag`,children:(0,g.jsxs)(`div`,{ref:_,children:[d.moving&&(0,g.jsx)(`div`,{style:{transform:`translate(${d.left}px, ${d.top}px)`,height:`${d.height}px`,width:`${d.width}px`},className:`selector ${dn}`}),e]})})},mn=({children:e})=>{let{moveItems:n,placeItems:r,findElementUnderPointer:i}=H(),{vectorFromWrapperToBoard:a}=V(),[o,s,c,l,u]=z(e=>[e.select,e.setSelection,e.getSelection,e.getBoardState,e.updateBoardState]),[d]=R(e=>[e.getBoardConfig]),f=t.default.useRef({}),p=t.default.useRef({items:[]});return B(document,`keydown`,e=>{if([`INPUT`,`TEXTAREA`].includes(e.target.tagName))return;let t=c();if(t.length){let{gridSize:i=1}=d(),o=0,s=0;switch(e.key){case`ArrowLeft`:o=-10;break;case`ArrowRight`:o=10;break;case`ArrowUp`:s=-10;break;case`ArrowDown`:s=10}if(o||s){e.shiftKey&&(o*=5,s*=5),(e.ctrlKey||e.altKey||e.metaKey)&&(o/=10,s/=10);let[c,l]=a(o,s);n(t,{x:c,y:l},!0),r(t,{type:`grid`,size:i||1}),e.preventDefault()}}}),(0,g.jsx)(X,{onDragStart:e=>{let{ctrlKey:t,metaKey:n,event:r}=e,a=i(e);if(a){r.stopPropagation();let e=c();p.current.items=e;let i=L(a);e.includes(i)||(t||n?(p.current.items=[...e,i],o([i])):(p.current.items=[i],s([i]))),Object.assign(f.current,{moving:!0})}},onDrag:({deltaX:e,deltaY:t,event:r})=>{if(f.current.moving){r.stopPropagation();let{movingItems:i}=l(),[o,s]=a(e,t);n(p.current.items,{x:o,y:s},!0),i||u({movingItems:!0})}},onDragEnd:()=>{if(f.current.moving){let{gridSize:e=1}=d(),t=e||1;f.current={moving:!1},r(p.current.items,{type:`grid`,size:t}),u({movingItems:!1})}},children:e})},hn=e=>{let n=t.default.useRef({hover:!1,x:0,y:0});return B(e,`mousemove`,e=>{let{clientX:t,clientY:r}=e;n.current.x=t,n.current.y=r}),B(e,`mouseenter`,()=>{n.current.hover=!0}),B(e,`mouseleave`,()=>{n.current.hover=!1}),t.default.useCallback(()=>n.current,[])},gn=[...[,,,,,].keys()].map(e=>`Digit${e+1}`),_n=()=>{let[e,n]=t.default.useState({}),[r,i]=z(e=>[e.getBoardState,e.updateBoardState]);return B(document,`keydown`,t=>{if(![`INPUT`,`TEXTAREA`].includes(t.target.tagName)&&gn.includes(t.code)){let a=t.code,{translateX:o,translateY:s,scale:c}=r();t.altKey||t.metaKey||t.ctrlKey||t.shiftKey?n(e=>({...e,[a]:{translateX:o,translateY:s,scale:c}})):e[a]&&i(e[a]),t.preventDefault()}}),null},vn=({children:e,moveFirst:n=!1})=>{let r=t.default.useRef(null),[i,a,o,s,c]=z(e=>[{translateX:e.boardState.translateX,translateY:e.boardState.translateY,scale:e.boardState.scale,rotate:e.boardState.rotate},e.config.itemExtent,e.getConfiguration,e.updateBoardState,e.getSelection]),{zoomToCenter:l,zoomToExtent:u,moveBoard:d}=V(),[f,p]=t.default.useState(!1),m=t.default.useRef({}),h=hn(r);_n();let _=t.default.useCallback(()=>{let{itemExtent:e}=o();u(e)},[o,u]);return t.default.useEffect(()=>{!f&&a.radius&&(_(),p(!0))},[_,f,a]),B(document,`keydown`,e=>{if([`INPUT`,`TEXTAREA`].includes(e.target.tagName))return;let t=0,n=0,r=1;switch(e.key){case`ArrowLeft`:t=-10;break;case`ArrowRight`:t=10;break;case`ArrowUp`:n=-10;break;case`ArrowDown`:n=10;break;case`PageUp`:r=1.2;break;case`PageDown`:r=.8}if(t||n||r!==1){let i=c();if(r===1&&i.length)return;e.shiftKey&&(t*=5,n*=5),(e.ctrlKey||e.altKey||e.metaKey)&&(t/=5,n/=5),d(({translateX:e,translateY:r})=>({translateX:e+t,translateY:r+n})),l({factor:r}),e.preventDefault()}e.key===` `&&!e.repeat&&h().hover&&l({factor:3,to:h()})}),B(document,`keyup`,e=>{[`INPUT`,`TEXTAREA`].includes(e.target.tagName)||e.key===` `&&h().hover&&l({factor:1/3,to:h()})}),(0,g.jsx)(X,{onPan:({deltaX:e,deltaY:t})=>{d(({translateX:n,translateY:r})=>({translateX:n+e,translateY:r+t})),clearTimeout(m.current.pan),m.current.pan=setTimeout(()=>{s({panning:!1})},200),s({panning:!0})},onZoom:({clientX:e,clientY:t,scale:n})=>{l({to:{x:e,y:t},factor:1-n/500}),clearTimeout(m.current.zoom),m.current.zoom=setTimeout(()=>{s({zooming:!1})},200),s({zooming:!0})},mainAction:n?`pan`:`drag`,children:(0,g.jsx)(`div`,{style:{display:`inline-block`,transformOrigin:`top left`,transform:`translate(${i.translateX}px, ${i.translateY}px) rotate(${i.rotate}deg) scale(${i.scale})`},className:`board-pane${i.scale<.5?` board-pane__far`:``}`,ref:r,children:e})})},yn=q({position:`absolute`,top:0,left:0,zIndex:210,backgroundColor:`hsla(0, 40%, 50%, 0%)`,border:`2px dashed hsl(20, 55%, 40%)`,pointerEvents:`none`}),bn=()=>{let[e,n,r,i,a,{translateX:o,translateY:s,scale:c}]=z(e=>[e.selection,e.getSelection,e.selectionBox,e.setSelectionBox,e.getConfiguration,{translateX:e.boardState.translateX,translateY:e.boardState.translateY,scale:e.boardState.scale}]),[l]=R(e=>[e.items]),u=t.default.useCallback(()=>{let e=n(),{boardWrapperRect:t,uid:r}=a();if(e.length===0){i(null);return}let o=ue(e,r);if(!o){i(null);return}let{left:s,top:c,width:l,height:u}=o,d={left:s-t.left,top:c-t.top,height:u,width:l};i(d)},[a,n,i]),d=Le(u,[u],300);return t.default.useEffect(()=>{u(),d()},[e,l,o,s,c,u,d]),!r||e.length<2?null:(0,g.jsx)(`div`,{style:{transform:`translate(${r.left}px, ${r.top}px)`,height:`${r.height}px`,width:`${r.width}px`},className:`selection ${yn}`})},xn=()=>{let[e]=z(e=>[e.boardState.movingItems]);return e?null:(0,g.jsx)(bn,{})};function Sn(e,t,n){return Math.min(Math.max(e,n),t)}var Q=class extends Error{constructor(e){super(`Failed to parse color: "${e}"`)}};function Cn(e){if(typeof e!=`string`)throw new Q(e);if(e.trim().toLowerCase()===`transparent`)return[0,0,0,0];let t=e.trim();t=Mn.test(e)?Dn(e):e;let n=On.exec(t);if(n){let e=Array.from(n).slice(1);return[...e.slice(0,3).map(e=>parseInt($(e,2),16)),parseInt($(e[3]||`f`,2),16)/255]}let r=kn.exec(t);if(r){let e=Array.from(r).slice(1);return[...e.slice(0,3).map(e=>parseInt(e,16)),parseInt(e[3]||`ff`,16)/255]}let i=An.exec(t);if(i){let e=Array.from(i).slice(1);return[...e.slice(0,3).map(e=>parseInt(e,10)),parseFloat(e[3]||`1`)]}let a=jn.exec(t);if(a){let[t,n,r,i]=Array.from(a).slice(1).map(parseFloat);if(Sn(0,100,n)!==n||Sn(0,100,r)!==r)throw new Q(e);return[...Pn(t,n,r),Number.isNaN(i)?1:i]}throw new Q(e)}function wn(e){let t=5381,n=e.length;for(;n;)t=t*33^e.charCodeAt(--n);return(t>>>0)%2341}var Tn=e=>parseInt(e.replace(/_/g,``),36),En=`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)=>{let n=Tn(t.substring(0,3)),r=Tn(t.substring(3)).toString(16),i=``;for(let e=0;e<6-r.length;e++)i+=`0`;return e[n]=`${i}${r}`,e},{});function Dn(e){let t=En[wn(e.toLowerCase().trim())];if(!t)throw new Q(e);return`#${t}`}var $=(e,t)=>Array.from(Array(t)).map(()=>e).join(``),On=RegExp(`^#${$(`([a-f0-9])`,3)}([a-f0-9])?$`,`i`),kn=RegExp(`^#${$(`([a-f0-9]{2})`,3)}([a-f0-9]{2})?$`,`i`),An=RegExp(`^rgba?\\(\\s*(\\d+)\\s*${$(`,\\s*(\\d+)\\s*`,2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,`i`),jn=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i,Mn=/^[a-z]+$/i,Nn=e=>Math.round(e*255),Pn=(e,t,n)=>{let r=n/100;if(t===0)return[r,r,r].map(Nn);let i=(e%360+360)%360/60,a=(1-Math.abs(2*r-1))*(t/100),o=a*(1-Math.abs(i%2-1)),s=0,c=0,l=0;i>=0&&i<1?(s=a,c=o):i>=1&&i<2?(s=o,c=a):i>=2&&i<3?(c=a,l=o):i>=3&&i<4?(c=o,l=a):i>=4&&i<5?(s=o,l=a):i>=5&&i<6&&(s=a,l=o);let u=r-a/2;return[s+u,c+u,l+u].map(Nn)};function Fn(e){if(e===`transparent`)return 0;function t(e){let t=e/255;return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}let[n,r,i]=Cn(e);return .2126*t(n)+.7152*t(r)+.0722*t(i)}function In(e){return Fn(e)>.179}var Ln=q({display:`flex`,flexDirection:`row`,alignItems:`center`,zIndex:210,pointerEvents:`none`}),Rn=q({fontWeight:`bold`,padding:`0 0.5em`,borderRadius:`2px`,maxWidth:`5em`,overflow:`hidden`,textOverflow:`ellipsis`,marginLeft:`-0.5em`,marginTop:`1.7em`,whitespace:`nowrap`,pointerEvents:`none`}),zn=t.default.memo(({color:e=`#666`,size:t=40,text:n})=>{let r=In(e)?`#222`:`#EEE`;return(0,g.jsxs)(`div`,{className:Ln,children:[(0,g.jsxs)(`svg`,{version:`1.1`,xmlns:`http://www.w3.org/2000/svg`,viewBox:`1064.7701 445.5539 419.8101 717.0565`,width:t,height:t,children:[(0,g.jsx)(`path`,{d:`m 1197.1015,869.718 -62.2719,-154.49286 133.3276,-9.05842 -257.6915,-253.12748 1.2392,356.98609 88.2465,-79.47087 61.702,152.78366 z`,style:{fill:r}}),(0,g.jsx)(`path`,{d:`m 1193.0939,861.12419 -62.2719,-154.49286 133.3276,-9.05842 -257.6915,-253.12748 1.2392,356.98609 88.2465,-79.47087 61.702,152.78366 z`,style:{fill:`white`,stroke:`#111`,strokeWidth:20}})]}),(0,g.jsx)(`div`,{style:{color:r,backgroundColor:e},className:Rn,children:n})]})}),Bn=q({top:0,left:0,zIndex:210,position:`fixed`,pointerEvents:`none`}),Vn=({pos:e,...t})=>(0,g.jsx)(`div`,{className:Bn,style:{transform:`translate(${e.x-6}px, ${e.y-15}px)`},children:(0,g.jsx)(zn,{...t})}),Hn=({children:e})=>{let[t]=z(e=>[e.getConfiguration,e.boardState.scale]),{fromWrapperToBoard:n,fromBoardToWrapper:r}=V(),[i,a,o,s]=W(e=>[e.getUser(),e.getLocalUsers(),e.cursors,e.users]),[c,l]=W(e=>[e.moveCursor,e.removeCursor]),{boardWrapperRect:u}=t(),d=({clientX:e,clientY:t})=>{let[r,a]=n(e-u.left,t-u.top);c(i.id,{x:r,y:a})},f=()=>{l(i.id)},p=a.reduce((e,t)=>(t.id!==i.id&&o[t.id]&&(e[t.id]=o[t.id]),e),{});return(0,g.jsxs)(`div`,{onPointerMove:d,onPointerLeave:f,children:[e,Object.entries(p).map(([e,t])=>{let[n,i]=r(t.x,t.y),a={x:n+u.left,y:i+u.top};return se(a,u)?(0,g.jsx)(Vn,{pos:a,text:s[e].name,color:s[e].color},e):null})]})},Un=({children:e})=>e,Wn={overflow:`hidden`,position:`absolute`,inset:0};Pt(t.default.createElement),e.Board=({moveFirst:e=!0,style:n,wrapperStyle:r,itemTemplates:i={},boardSize:a=Ee,children:o,showResizeHandle:s=!1,Wrapper:c=Un})=>{let l=t.default.useRef(null),[u,d]=z(e=>[e.config.uid,e.updateConfiguration]),{updateItemExtent:f}=V(),p={userSelect:`none`,width:`${a}px`,height:`${a}px`,backgroundColor:`#333`,...n};t.default.useEffect(()=>{let e=e=>{N(e.target,`board`)&&e.preventDefault()};return document.body.addEventListener(`wheel`,e,{passive:!1}),()=>{document.body.removeEventListener(`wheel`,e)}},[]),t.default.useEffect(()=>{d({boardWrapper:l.current})},[d]),t.default.useEffect(()=>{u||d({uid:U()})},[u,d]),t.default.useEffect(()=>{d({itemTemplates:i,boardSize:a,showResizeHandle:s})},[i,a,s,d]),t.default.useEffect(()=>{d({boardWrapperRect:l.current.getBoundingClientRect()}),f(),setTimeout(f,2e3)},[d,f]),Ke(l,()=>{l.current&&d({boardWrapperRect:l.current.getBoundingClientRect()})});let m=q({...Wn,...r});return(0,g.jsxs)(`div`,{ref:l,id:u,className:`sync-board ${m}`,children:[(0,g.jsx)(Hn,{children:(0,g.jsx)(pn,{moveFirst:e,children:(0,g.jsx)(vn,{moveFirst:e,children:(0,g.jsx)(mn,{moveFirst:e,children:(0,g.jsx)(c,{children:(0,g.jsxs)(`div`,{onContextMenu:e=>{e.preventDefault()},style:p,className:`board`,children:[(0,g.jsx)(un,{}),o]})})})})})}),(0,g.jsx)(xn,{})]})},e.BoardWrapper=wt,e.RoomWrapper=Tt,e.useAvailableActions=rt,e.useBoardConfig=pt,e.useBoardPosition=V,e.useBoardState=mt,e.useDebouncedItems=Te,e.useGetSelectedItems=Pe,e.useItemActions=H,e.useItemInteraction=$e,e.useItems=we,e.useMessage=St,e.useSelectedItems=Ne,e.useSelectionBox=it,e.useSessionInfo=ht,e.useUsers=ft,e.useWire=b});
50
+ `,Ot=({onReload:e})=>(0,n.jsxs)(`div`,{className:`syncboard-error-item ${K({width:`100px`,display:`flex`,flexDirection:`column`,justifyContent:`center`,textAlign:`center`,color:`red`})}`,children:[`Sorry, this item seems broken.`,(0,n.jsx)(`button`,{onClick:e,children:`Reload it`})]}),kt=class extends t.default.Component{constructor(e){super(e),this.state={hasError:!1,itemId:e.itemId},this.onReload=this.onReload.bind(this)}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e){console.error(`Error for item ${this.state.itemId}`,e,this.props.state)}onReload(){this.setState({hasError:!1})}render(){let{ErrorComponent:e}=this.props;return this.state.hasError?(0,n.jsx)(e,{onReload:this.onReload}):this.props.children}},At=e=>{e.target.className=``},jt=({width:e,height:t,actualWidth:n,actualHeight:r,prevState:i,keepRatio:a})=>{let{width:o,height:s}=i;if([o,s]=[parseFloat(o),parseFloat(s)],(!o||Number.isNaN(Number(o)))&&(o=n),(!s||Number.isNaN(Number(s)))&&(s=r),a){let n=o/s;return{...i,width:(o+e).toFixed(1),height:(s+t/n).toFixed(1)}}return{...i,width:(o+e).toFixed(1),height:(s+t).toFixed(1)}},Mt={w:!0,h:!0,b:!0},Nt=(0,t.memo)(({setState:e,state:{type:r,rotation:i=0,id:a,locked:o,extraClasses:s,...c}={},animate:l=`hvr-pop`,isSelected:u,itemMap:d,showResizeHandle:f=!0})=>{let p=t.default.useRef(null),[m]=I(e=>[e.config.uid]),{component:h=()=>null,resizeDirections:g=Mt,resize:_=jt}=d[r],v=t.default.useCallback((t,n=!1)=>e(a,t,n),[e,a]);t.default.useEffect(()=>{p.current.className=l},[l]);let y=[`item`,a,_t];o&&y.push(`locked`),u&&(y.push(`selected`),y.push(vt)),Array.isArray(s)&&y.concat(s);let b=y.join(` `),x=({width:e=0,height:t=0,keepRatio:n})=>{v(r=>{let{offsetWidth:i,offsetHeight:a}=p.current;return _({prevState:r,width:e,height:t,actualHeight:a,actualWidth:i,keepRatio:n})})},S=({width:e})=>{x({width:e})},C=({height:e})=>{x({height:e})},w=({width:e})=>{x({height:e,width:e,keepRatio:!0})};return(0,n.jsx)(`div`,{style:{transform:`rotate(${i}deg`},"data-id":a,id:`${m}__${a}`,className:b,children:(0,n.jsxs)(`div`,{style:{display:`flex`},ref:p,onAnimationEnd:At,onKeyDown:e=>e.stopPropagation(),onKeyUp:e=>e.stopPropagation(),children:[(0,n.jsx)(kt,{itemId:a,state:c,ErrorComponent:d?.error?.component||Ot,children:(0,n.jsx)(h,{...c,id:a,setState:v})}),(0,n.jsx)(`div`,{className:`corner ${Z} ${yt}`}),(0,n.jsx)(`div`,{className:`corner ${Z} ${bt}`}),(0,n.jsx)(`div`,{className:`corner ${Z} ${St}`}),(0,n.jsx)(`div`,{className:`corner ${Z} ${xt}`}),(0,n.jsx)(`div`,{className:`center ${Z} ${Ct}`}),f&&(0,n.jsxs)(n.Fragment,{children:[g.b&&(0,n.jsx)(gt,{className:`${wt} ${Dt}`,onResize:w}),g.h&&(0,n.jsx)(gt,{className:`${wt} ${Et}`,onResize:C}),g.w&&(0,n.jsx)(gt,{className:`${wt} ${Tt}`,onResize:S})]})]})})},({state:e,setState:t,isSelected:n,showResizeHandle:r},{state:i,setState:a,isSelected:o,showResizeHandle:s})=>n===o&&r===s&&t===a&&(0,lt.default)(e,i)),Pt=e=>e,Ft=(0,t.memo)(({state:e={},getCurrentUser:t,className:r,...i})=>{if(!i.itemMap[e.type])return null;let{stateHook:a=Pt}=i.itemMap[e.type],{x:o=0,y:s=0,layer:c=0,moving:l,...u}=a(e,{currentUser:t?.()}),d=(c+4)*10+100+(l?5:0);return(0,n.jsx)(`div`,{className:r,style:{transform:`translate(${o}px, ${s}px)`,zIndex:d},children:(0,n.jsx)(Nt,{...i,showResizeHandle:i.isSelected&&i.showResizeHandle,state:u})})}),It=()=>{let{updateItem:e}=B(),[t,r]=F(e=>[e.itemIds,e.items]),[i,a,o,s]=I(e=>[e.config.boardSize,e.config.showResizeHandle,e.config.itemTemplates,e.selection]),[c]=U(e=>[e.getUser]),l=K({position:`absolute`,top:`${i/2}px`,left:`${i/2}px`,display:`inline-block`,lineHeight:0});return t.map(t=>(0,n.jsx)(Ft,{state:r[t],setState:e,isSelected:s.includes(t),itemMap:o,boardSize:i,getCurrentUser:c,showResizeHandle:a,className:l},t))},Lt=K({zIndex:210,position:`absolute`,backgroundColor:`hsla(0, 40%, 50%, 10%)`,border:`2px solid hsl(0, 55%, 40%)`}),Rt=(e,t,n=!1)=>{let r=t.getElementsByClassName(`selector`);if(!r.length)return[];let i=r[0];return Array.from(t.getElementsByClassName(`item`)).filter(t=>{let r=e[N(t)];return!r||!n&&r.locked?!1:ee(t,i)}).map(e=>N(e))},zt=({children:e,moveFirst:r})=>{let[i,a,s,c,l,u]=I(e=>[e.getSelection,e.clear,e.setSelection,e.select,e.getConfiguration,e.getBoardState,e.updateBoardState]),{findElementUnderPointer:d}=B(),[f]=F(e=>[e.getItems]),[p,m]=t.default.useState({}),[,h]=t.default.useTransition(),[g,_]=t.default.useState(!1),v=t.default.useRef(null),y=t.default.useRef({moving:!1});return(0,o.useEventListener)(document,`keydown`,e=>{e.key===`l`&&_(!0)}),(0,o.useEventListener)(document,`keyup`,e=>{e.key===`l`&&_(!1)}),t.default.useEffect(()=>(a(),()=>{a()}),[a]),t.default.useEffect(()=>{if(y.current.moving){let e=f(),{boardWrapper:t}=l(),n=Rt(e,t,g);h(()=>{s(n)})}},[l,f,p,s,g]),(0,n.jsx)(X,{onDragStart:async e=>{await d(e)||(y.current.moving=!0,h(()=>{u({selecting:!0})}),v.current.style.cursor=`crosshair`)},onDrag:({distanceY:e,distanceX:t,startX:n,startY:r})=>{if(y.current.moving){let{top:i,left:a}=v.current.getBoundingClientRect(),o=n-a,s=r-i;t>0?(y.current.left=o,y.current.width=t):(y.current.left=o+t,y.current.width=-t),e>0?(y.current.top=s,y.current.height=e):(y.current.top=s+e,y.current.height=-e),m({...y.current,moving:!0})}},onDragEnd:()=>{y.current.moving&&(h(()=>{u({selecting:!1})}),y.current.moving=!1,m({moving:!1}),v.current.style.cursor=`auto`)},onTap:e=>{let{target:t,ctrlKey:n,metaKey:r}=e,o=d(e);if(!o&&w(t,`board`))a();else{let e=N(o);if(!e){a();return}let t=i();o&&!t.includes(e)&&(n||r?c([e]):s([e]))}},onLongTap:({target:e})=>{let t=w(e,`item`);if(t){let e=N(t);s([e])}},mainAction:r?`pan`:`drag`,children:(0,n.jsxs)(`div`,{ref:v,children:[p.moving&&(0,n.jsx)(`div`,{style:{transform:`translate(${p.left}px, ${p.top}px)`,height:`${p.height}px`,width:`${p.width}px`},className:`selector ${Lt}`}),e]})})},Bt=({children:e})=>{let{moveItems:r,placeItems:i,findElementUnderPointer:a}=B(),{vectorFromWrapperToBoard:s}=R(),[c,l,u,d,f]=I(e=>[e.select,e.setSelection,e.getSelection,e.getBoardState,e.updateBoardState]),[p]=F(e=>[e.getBoardConfig]),m=t.default.useRef({}),h=t.default.useRef({items:[]});return(0,o.useEventListener)(document,`keydown`,e=>{if([`INPUT`,`TEXTAREA`].includes(e.target.tagName))return;let t=u();if(t.length){let{gridSize:n=1}=p(),a=0,o=0;switch(e.key){case`ArrowLeft`:a=-10;break;case`ArrowRight`:a=10;break;case`ArrowUp`:o=-10;break;case`ArrowDown`:o=10}if(a||o){e.shiftKey&&(a*=5,o*=5),(e.ctrlKey||e.altKey||e.metaKey)&&(a/=10,o/=10);let[c,l]=s(a,o);r(t,{x:c,y:l},!0),i(t,{type:`grid`,size:n||1}),e.preventDefault()}}}),(0,n.jsx)(X,{onDragStart:e=>{let{ctrlKey:t,metaKey:n,event:r}=e,i=a(e);if(i){r.stopPropagation();let e=u();h.current.items=e;let a=N(i);e.includes(a)||(t||n?(h.current.items=[...e,a],c([a])):(h.current.items=[a],l([a]))),Object.assign(m.current,{moving:!0})}},onDrag:({deltaX:e,deltaY:t,event:n})=>{if(m.current.moving){n.stopPropagation();let{movingItems:i}=d(),[a,o]=s(e,t);r(h.current.items,{x:a,y:o},!0),i||f({movingItems:!0})}},onDragEnd:()=>{if(m.current.moving){let{gridSize:e=1}=p(),t=e||1;m.current={moving:!1},i(h.current.items,{type:`grid`,size:t}),f({movingItems:!1})}},children:e})},Vt=e=>{let n=t.default.useRef({hover:!1,x:0,y:0});return(0,o.useEventListener)(e,`mousemove`,e=>{let{clientX:t,clientY:r}=e;n.current.x=t,n.current.y=r}),(0,o.useEventListener)(e,`mouseenter`,()=>{n.current.hover=!0}),(0,o.useEventListener)(e,`mouseleave`,()=>{n.current.hover=!1}),t.default.useCallback(()=>n.current,[])},Ht=[...[,,,,,].keys()].map(e=>`Digit${e+1}`),Ut=()=>{let[e,n]=t.default.useState({}),[r,i]=I(e=>[e.getBoardState,e.updateBoardState]);return(0,o.useEventListener)(document,`keydown`,t=>{if(![`INPUT`,`TEXTAREA`].includes(t.target.tagName)&&Ht.includes(t.code)){let a=t.code,{translateX:o,translateY:s,scale:c}=r();t.altKey||t.metaKey||t.ctrlKey||t.shiftKey?n(e=>({...e,[a]:{translateX:o,translateY:s,scale:c}})):e[a]&&i(e[a]),t.preventDefault()}}),null},Wt=({children:e,moveFirst:r=!1})=>{let i=t.default.useRef(null),[a,s,c,l,u]=I(e=>[{translateX:e.boardState.translateX,translateY:e.boardState.translateY,scale:e.boardState.scale,rotate:e.boardState.rotate},e.config.itemExtent,e.getConfiguration,e.updateBoardState,e.getSelection]),{zoomToCenter:d,zoomToExtent:f,moveBoard:p}=R(),[m,h]=t.default.useState(!1),g=t.default.useRef({}),_=Vt(i);Ut();let v=t.default.useCallback(()=>{let{itemExtent:e}=c();f(e)},[c,f]);return t.default.useEffect(()=>{!m&&s.radius&&(v(),h(!0))},[v,m,s]),(0,o.useEventListener)(document,`keydown`,e=>{if([`INPUT`,`TEXTAREA`].includes(e.target.tagName))return;let t=0,n=0,r=1;switch(e.key){case`ArrowLeft`:t=-10;break;case`ArrowRight`:t=10;break;case`ArrowUp`:n=-10;break;case`ArrowDown`:n=10;break;case`PageUp`:r=1.2;break;case`PageDown`:r=.8}if(t||n||r!==1){let i=u();if(r===1&&i.length)return;e.shiftKey&&(t*=5,n*=5),(e.ctrlKey||e.altKey||e.metaKey)&&(t/=5,n/=5),p(({translateX:e,translateY:r})=>({translateX:e+t,translateY:r+n})),d({factor:r}),e.preventDefault()}e.key===` `&&!e.repeat&&_().hover&&d({factor:3,to:_()})}),(0,o.useEventListener)(document,`keyup`,e=>{[`INPUT`,`TEXTAREA`].includes(e.target.tagName)||e.key===` `&&_().hover&&d({factor:1/3,to:_()})}),(0,n.jsx)(X,{onPan:({deltaX:e,deltaY:t})=>{p(({translateX:n,translateY:r})=>({translateX:n+e,translateY:r+t})),clearTimeout(g.current.pan),g.current.pan=setTimeout(()=>{l({panning:!1})},200),l({panning:!0})},onZoom:({clientX:e,clientY:t,scale:n})=>{d({to:{x:e,y:t},factor:1-n/500}),clearTimeout(g.current.zoom),g.current.zoom=setTimeout(()=>{l({zooming:!1})},200),l({zooming:!0})},mainAction:r?`pan`:`drag`,children:(0,n.jsx)(`div`,{style:{display:`inline-block`,transformOrigin:`top left`,transform:`translate(${a.translateX}px, ${a.translateY}px) rotate(${a.rotate}deg) scale(${a.scale})`},className:`board-pane${a.scale<.5?` board-pane__far`:``}`,ref:i,children:e})})},Gt=K({position:`absolute`,top:0,left:0,zIndex:210,backgroundColor:`hsla(0, 40%, 50%, 0%)`,border:`2px dashed hsl(20, 55%, 40%)`,pointerEvents:`none`}),Kt=()=>{let[e,r,i,a,s,{translateX:c,translateY:l,scale:u}]=I(e=>[e.selection,e.getSelection,e.selectionBox,e.setSelectionBox,e.getConfiguration,{translateX:e.boardState.translateX,translateY:e.boardState.translateY,scale:e.boardState.scale}]),[d]=F(e=>[e.items]),f=t.default.useCallback(()=>{let e=r(),{boardWrapperRect:t,uid:n}=s();if(e.length===0){a(null);return}let i=te(e,n);if(!i){a(null);return}let{left:o,top:c,width:l,height:u}=i,d={left:o-t.left,top:c-t.top,height:u,width:l};a(d)},[s,r,a]),p=(0,o.useDebouncedCallback)(f,[f],300);return t.default.useEffect(()=>{f(),p()},[e,d,c,l,u,f,p]),!i||e.length<2?null:(0,n.jsx)(`div`,{style:{transform:`translate(${i.left}px, ${i.top}px)`,height:`${i.height}px`,width:`${i.width}px`},className:`selection ${Gt}`})},qt=()=>{let[e]=I(e=>[e.boardState.movingItems]);return e?null:(0,n.jsx)(Kt,{})};function Jt(e,t,n){return Math.min(Math.max(e,n),t)}var Q=class extends Error{constructor(e){super(`Failed to parse color: "${e}"`)}};function Yt(e){if(typeof e!=`string`)throw new Q(e);if(e.trim().toLowerCase()===`transparent`)return[0,0,0,0];let t=e.trim();t=an.test(e)?$t(e):e;let n=en.exec(t);if(n){let e=Array.from(n).slice(1);return[...e.slice(0,3).map(e=>parseInt($(e,2),16)),parseInt($(e[3]||`f`,2),16)/255]}let r=tn.exec(t);if(r){let e=Array.from(r).slice(1);return[...e.slice(0,3).map(e=>parseInt(e,16)),parseInt(e[3]||`ff`,16)/255]}let i=nn.exec(t);if(i){let e=Array.from(i).slice(1);return[...e.slice(0,3).map(e=>parseInt(e,10)),parseFloat(e[3]||`1`)]}let a=rn.exec(t);if(a){let[t,n,r,i]=Array.from(a).slice(1).map(parseFloat);if(Jt(0,100,n)!==n||Jt(0,100,r)!==r)throw new Q(e);return[...sn(t,n,r),Number.isNaN(i)?1:i]}throw new Q(e)}function Xt(e){let t=5381,n=e.length;for(;n;)t=t*33^e.charCodeAt(--n);return(t>>>0)%2341}var Zt=e=>parseInt(e.replace(/_/g,``),36),Qt=`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)=>{let n=Zt(t.substring(0,3)),r=Zt(t.substring(3)).toString(16),i=``;for(let e=0;e<6-r.length;e++)i+=`0`;return e[n]=`${i}${r}`,e},{});function $t(e){let t=Qt[Xt(e.toLowerCase().trim())];if(!t)throw new Q(e);return`#${t}`}var $=(e,t)=>Array.from(Array(t)).map(()=>e).join(``),en=RegExp(`^#${$(`([a-f0-9])`,3)}([a-f0-9])?$`,`i`),tn=RegExp(`^#${$(`([a-f0-9]{2})`,3)}([a-f0-9]{2})?$`,`i`),nn=RegExp(`^rgba?\\(\\s*(\\d+)\\s*${$(`,\\s*(\\d+)\\s*`,2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,`i`),rn=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i,an=/^[a-z]+$/i,on=e=>Math.round(e*255),sn=(e,t,n)=>{let r=n/100;if(t===0)return[r,r,r].map(on);let i=(e%360+360)%360/60,a=(1-Math.abs(2*r-1))*(t/100),o=a*(1-Math.abs(i%2-1)),s=0,c=0,l=0;i>=0&&i<1?(s=a,c=o):i>=1&&i<2?(s=o,c=a):i>=2&&i<3?(c=a,l=o):i>=3&&i<4?(c=o,l=a):i>=4&&i<5?(s=o,l=a):i>=5&&i<6&&(s=a,l=o);let u=r-a/2;return[s+u,c+u,l+u].map(on)};function cn(e){if(e===`transparent`)return 0;function t(e){let t=e/255;return t<=.04045?t/12.92:((t+.055)/1.055)**2.4}let[n,r,i]=Yt(e);return .2126*t(n)+.7152*t(r)+.0722*t(i)}function ln(e){return cn(e)>.179}var un=K({display:`flex`,flexDirection:`row`,alignItems:`center`,zIndex:210,pointerEvents:`none`}),dn=K({fontWeight:`bold`,padding:`0 0.5em`,borderRadius:`2px`,maxWidth:`5em`,overflow:`hidden`,textOverflow:`ellipsis`,marginLeft:`-0.5em`,marginTop:`1.7em`,whitespace:`nowrap`,pointerEvents:`none`}),fn=t.default.memo(({color:e=`#666`,size:t=40,text:r})=>{let i=ln(e)?`#222`:`#EEE`;return(0,n.jsxs)(`div`,{className:un,children:[(0,n.jsxs)(`svg`,{version:`1.1`,xmlns:`http://www.w3.org/2000/svg`,viewBox:`1064.7701 445.5539 419.8101 717.0565`,width:t,height:t,children:[(0,n.jsx)(`path`,{d:`m 1197.1015,869.718 -62.2719,-154.49286 133.3276,-9.05842 -257.6915,-253.12748 1.2392,356.98609 88.2465,-79.47087 61.702,152.78366 z`,style:{fill:i}}),(0,n.jsx)(`path`,{d:`m 1193.0939,861.12419 -62.2719,-154.49286 133.3276,-9.05842 -257.6915,-253.12748 1.2392,356.98609 88.2465,-79.47087 61.702,152.78366 z`,style:{fill:`white`,stroke:`#111`,strokeWidth:20}})]}),(0,n.jsx)(`div`,{style:{color:i,backgroundColor:e},className:dn,children:r})]})}),pn=K({top:0,left:0,zIndex:210,position:`fixed`,pointerEvents:`none`}),mn=({pos:e,...t})=>(0,n.jsx)(`div`,{className:pn,style:{transform:`translate(${e.x-6}px, ${e.y-15}px)`},children:(0,n.jsx)(fn,{...t})}),hn=({children:e})=>{let[t]=I(e=>[e.getConfiguration,e.boardState.scale]),{fromWrapperToBoard:r,fromBoardToWrapper:i}=R(),[a,o,s,c]=U(e=>[e.getUser(),e.getLocalUsers(),e.cursors,e.users]),[l,u]=U(e=>[e.moveCursor,e.removeCursor]),{boardWrapperRect:d}=t(),f=({clientX:e,clientY:t})=>{let[n,i]=r(e-d.left,t-d.top);l(a.id,{x:n,y:i})},p=()=>{u(a.id)},m=o.reduce((e,t)=>(t.id!==a.id&&s[t.id]&&(e[t.id]=s[t.id]),e),{});return(0,n.jsxs)(`div`,{onPointerMove:f,onPointerLeave:p,children:[e,Object.entries(m).map(([e,t])=>{let[r,a]=i(t.x,t.y),o={x:r+d.left,y:a+d.top};return A(o,d)?(0,n.jsx)(mn,{pos:o,text:c[e].name,color:c[e].color},e):null})]})},gn=({children:e})=>e,_n={overflow:`hidden`,position:`absolute`,inset:0};ct(t.default.createElement),e.Board=({moveFirst:e=!0,style:r,wrapperStyle:i,itemTemplates:a={},boardSize:s=ge,children:c,showResizeHandle:l=!1,Wrapper:u=gn})=>{let d=t.default.useRef(null),[f,p]=I(e=>[e.config.uid,e.updateConfiguration]),{updateItemExtent:m}=R(),h={userSelect:`none`,width:`${s}px`,height:`${s}px`,backgroundColor:`#333`,...r};t.default.useEffect(()=>{let e=e=>{w(e.target,`board`)&&e.preventDefault()};return document.body.addEventListener(`wheel`,e,{passive:!1}),()=>{document.body.removeEventListener(`wheel`,e)}},[]),t.default.useEffect(()=>{p({boardWrapper:d.current})},[p]),t.default.useEffect(()=>{f||p({uid:V()})},[f,p]),t.default.useEffect(()=>{p({itemTemplates:a,boardSize:s,showResizeHandle:l})},[a,s,l,p]),t.default.useEffect(()=>{p({boardWrapperRect:d.current.getBoundingClientRect()}),m(),setTimeout(m,2e3)},[p,m]),(0,o.useResizeObserver)(d,()=>{d.current&&p({boardWrapperRect:d.current.getBoundingClientRect()})});let g=K({..._n,...i});return(0,n.jsxs)(`div`,{ref:d,id:f,className:`sync-board ${g}`,children:[(0,n.jsx)(hn,{children:(0,n.jsx)(zt,{moveFirst:e,children:(0,n.jsx)(Wt,{moveFirst:e,children:(0,n.jsx)(Bt,{moveFirst:e,children:(0,n.jsx)(u,{children:(0,n.jsxs)(`div`,{onContextMenu:e=>{e.preventDefault()},style:h,className:`board`,children:[(0,n.jsx)(It,{}),c]})})})})})}),(0,n.jsx)(qt,{})]})},e.BoardWrapper=Qe,e.RoomWrapper=$e,e.useAvailableActions=Me,e.useBoardConfig=Ve,e.useBoardPosition=R,e.useBoardState=He,e.useDebouncedItems=he,e.useGetSelectedItems=we,e.useItemActions=B,e.useItemInteraction=z,e.useItems=me,e.useMessage=Xe,e.useSelectedItems=Ce,e.useSelectionBox=Ne,e.useSessionInfo=Ue,e.useUsers=Be,e.useWire=S});
56
51
  //# sourceMappingURL=react-sync-board.umd.cjs.map