react-sync-board 1.1.6 → 1.2.0
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.
- package/dist/react-sync-board.js +1762 -1663
- package/dist/react-sync-board.js.map +1 -1
- package/dist/react-sync-board.umd.cjs +24 -24
- package/dist/react-sync-board.umd.cjs.map +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(U,d){typeof exports=="object"&&typeof module<"u"?d(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],d):(U=typeof globalThis<"u"?globalThis:U||self,d(U["React-sync-board"]={},U.React))})(this,function(U,d){"use strict";var ns=Object.defineProperty;var os=(U,d,me)=>d in U?ns(U,d,{enumerable:!0,configurable:!0,writable:!0,value:me}):U[d]=me;var ar=(U,d,me)=>(os(U,typeof d!="symbol"?d+"":d,me),me);function me(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var Ce={},cr={get exports(){return Ce},set exports(e){Ce=e}},we={};/**
|
|
2
2
|
* @license React
|
|
3
3
|
* react-jsx-runtime.production.min.js
|
|
4
4
|
*
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var
|
|
9
|
+
*/var mt;function ur(){if(mt)return we;mt=1;var e=d,t=Symbol.for("react.element"),r=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,o=e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,s={key:!0,ref:!0,__self:!0,__source:!0};function c(u,l,m){var f,a={},h=null,S=null;m!==void 0&&(h=""+m),l.key!==void 0&&(h=""+l.key),l.ref!==void 0&&(S=l.ref);for(f in l)n.call(l,f)&&!s.hasOwnProperty(f)&&(a[f]=l[f]);if(u&&u.defaultProps)for(f in l=u.defaultProps,l)a[f]===void 0&&(a[f]=l[f]);return{$$typeof:t,type:u,key:h,ref:S,props:a,_owner:o.current}}return we.Fragment=r,we.jsx=c,we.jsxs=c,we}var xe={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,17 +14,17 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var
|
|
18
|
-
`+
|
|
17
|
+
*/var gt;function lr(){return gt||(gt=1,process.env.NODE_ENV!=="production"&&function(){var e=d,t=Symbol.for("react.element"),r=Symbol.for("react.portal"),n=Symbol.for("react.fragment"),o=Symbol.for("react.strict_mode"),s=Symbol.for("react.profiler"),c=Symbol.for("react.provider"),u=Symbol.for("react.context"),l=Symbol.for("react.forward_ref"),m=Symbol.for("react.suspense"),f=Symbol.for("react.suspense_list"),a=Symbol.for("react.memo"),h=Symbol.for("react.lazy"),S=Symbol.for("react.offscreen"),v=Symbol.iterator,b="@@iterator";function I(i){if(i===null||typeof i!="object")return null;var _=v&&i[v]||i[b];return typeof _=="function"?_:null}var E=e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function w(i){{for(var _=arguments.length,O=new Array(_>1?_-1:0),R=1;R<_;R++)O[R-1]=arguments[R];x("error",i,O)}}function x(i,_,O){{var R=E.ReactDebugCurrentFrame,X=R.getStackAddendum();X!==""&&(_+="%s",O=O.concat([X]));var F=O.map(function(Y){return String(Y)});F.unshift("Warning: "+_),Function.prototype.apply.call(console[i],console,F)}}var p=!1,C=!1,g=!1,y=!1,k=!1,M;M=Symbol.for("react.module.reference");function j(i){return!!(typeof i=="string"||typeof i=="function"||i===n||i===s||k||i===o||i===m||i===f||y||i===S||p||C||g||typeof i=="object"&&i!==null&&(i.$$typeof===h||i.$$typeof===a||i.$$typeof===c||i.$$typeof===u||i.$$typeof===l||i.$$typeof===M||i.getModuleId!==void 0))}function D(i,_,O){var R=i.displayName;if(R)return R;var X=_.displayName||_.name||"";return X!==""?O+"("+X+")":O}function A(i){return i.displayName||"Context"}function B(i){if(i==null)return null;if(typeof i.tag=="number"&&w("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof i=="function")return i.displayName||i.name||null;if(typeof i=="string")return i;switch(i){case n:return"Fragment";case r:return"Portal";case s:return"Profiler";case o:return"StrictMode";case m:return"Suspense";case f:return"SuspenseList"}if(typeof i=="object")switch(i.$$typeof){case u:var _=i;return A(_)+".Consumer";case c:var O=i;return A(O._context)+".Provider";case l:return D(i,i.render,"ForwardRef");case a:var R=i.displayName||null;return R!==null?R:B(i.type)||"Memo";case h:{var X=i,F=X._payload,Y=X._init;try{return B(Y(F))}catch{return null}}}return null}var V=Object.assign,T=0,$,L,W,N,K,Q,re;function ne(){}ne.__reactDisabledLog=!0;function oe(){{if(T===0){$=console.log,L=console.info,W=console.warn,N=console.error,K=console.group,Q=console.groupCollapsed,re=console.groupEnd;var i={configurable:!0,enumerable:!0,value:ne,writable:!0};Object.defineProperties(console,{info:i,log:i,warn:i,error:i,group:i,groupCollapsed:i,groupEnd:i})}T++}}function H(){{if(T--,T===0){var i={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:V({},i,{value:$}),info:V({},i,{value:L}),warn:V({},i,{value:W}),error:V({},i,{value:N}),group:V({},i,{value:K}),groupCollapsed:V({},i,{value:Q}),groupEnd:V({},i,{value:re})})}T<0&&w("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var te=E.ReactCurrentDispatcher,pe;function _e(i,_,O){{if(pe===void 0)try{throw Error()}catch(X){var R=X.stack.trim().match(/\n( *(at )?)/);pe=R&&R[1]||""}return`
|
|
18
|
+
`+pe+i}}var ct=!1,Ue;{var Ro=typeof WeakMap=="function"?WeakMap:Map;Ue=new Ro}function Kt(i,_){if(!i||ct)return"";{var O=Ue.get(i);if(O!==void 0)return O}var R;ct=!0;var X=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var F;F=te.current,te.current=null,oe();try{if(_){var Y=function(){throw Error()};if(Object.defineProperty(Y.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(Y,[])}catch(fe){R=fe}Reflect.construct(i,[],Y)}else{try{Y.call()}catch(fe){R=fe}i.call(Y.prototype)}}else{try{throw Error()}catch(fe){R=fe}i()}}catch(fe){if(fe&&R&&typeof fe.stack=="string"){for(var z=fe.stack.split(`
|
|
19
19
|
`),ee=R.stack.split(`
|
|
20
|
-
`),
|
|
21
|
-
`+
|
|
20
|
+
`),G=z.length-1,J=ee.length-1;G>=1&&J>=0&&z[G]!==ee[J];)J--;for(;G>=1&&J>=0;G--,J--)if(z[G]!==ee[J]){if(G!==1||J!==1)do if(G--,J--,J<0||z[G]!==ee[J]){var se=`
|
|
21
|
+
`+z[G].replace(" at new "," at ");return i.displayName&&se.includes("<anonymous>")&&(se=se.replace("<anonymous>",i.displayName)),typeof i=="function"&&Ue.set(i,se),se}while(G>=1&&J>=0);break}}}finally{ct=!1,te.current=F,H(),Error.prepareStackTrace=X}var Ee=i?i.displayName||i.name:"",ir=Ee?_e(Ee):"";return typeof i=="function"&&Ue.set(i,ir),ir}function $o(i,_,O){return Kt(i,!1)}function Ao(i){var _=i.prototype;return!!(_&&_.isReactComponent)}function We(i,_,O){if(i==null)return"";if(typeof i=="function")return Kt(i,Ao(i));if(typeof i=="string")return _e(i);switch(i){case m:return _e("Suspense");case f:return _e("SuspenseList")}if(typeof i=="object")switch(i.$$typeof){case l:return $o(i.render);case a:return We(i.type,_,O);case h:{var R=i,X=R._payload,F=R._init;try{return We(F(X),_,O)}catch{}}}return""}var Ve=Object.prototype.hasOwnProperty,Ht={},qt=E.ReactDebugCurrentFrame;function Fe(i){if(i){var _=i._owner,O=We(i.type,i._source,_?_.type:null);qt.setExtraStackFrame(O)}else qt.setExtraStackFrame(null)}function Lo(i,_,O,R,X){{var F=Function.call.bind(Ve);for(var Y in i)if(F(i,Y)){var z=void 0;try{if(typeof i[Y]!="function"){var ee=Error((R||"React class")+": "+O+" type `"+Y+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof i[Y]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw ee.name="Invariant Violation",ee}z=i[Y](_,Y,R,O,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(G){z=G}z&&!(z instanceof Error)&&(Fe(X),w("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",R||"React class",O,Y,typeof z),Fe(null)),z instanceof Error&&!(z.message in Ht)&&(Ht[z.message]=!0,Fe(X),w("Failed %s type: %s",O,z.message),Fe(null))}}}var zo=Array.isArray;function ut(i){return zo(i)}function Yo(i){{var _=typeof Symbol=="function"&&Symbol.toStringTag,O=_&&i[Symbol.toStringTag]||i.constructor.name||"Object";return O}}function Bo(i){try{return Gt(i),!1}catch{return!0}}function Gt(i){return""+i}function Jt(i){if(Bo(i))return w("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",Yo(i)),Gt(i)}var De=E.ReactCurrentOwner,No={key:!0,ref:!0,__self:!0,__source:!0},Zt,Qt,lt;lt={};function Xo(i){if(Ve.call(i,"ref")){var _=Object.getOwnPropertyDescriptor(i,"ref").get;if(_&&_.isReactWarning)return!1}return i.ref!==void 0}function Uo(i){if(Ve.call(i,"key")){var _=Object.getOwnPropertyDescriptor(i,"key").get;if(_&&_.isReactWarning)return!1}return i.key!==void 0}function Wo(i,_){if(typeof i.ref=="string"&&De.current&&_&&De.current.stateNode!==_){var O=B(De.current.type);lt[O]||(w('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',B(De.current.type),i.ref),lt[O]=!0)}}function Vo(i,_){{var O=function(){Zt||(Zt=!0,w("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",_))};O.isReactWarning=!0,Object.defineProperty(i,"key",{get:O,configurable:!0})}}function Fo(i,_){{var O=function(){Qt||(Qt=!0,w("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",_))};O.isReactWarning=!0,Object.defineProperty(i,"ref",{get:O,configurable:!0})}}var Ko=function(i,_,O,R,X,F,Y){var z={$$typeof:t,type:i,key:_,ref:O,props:Y,_owner:F};return z._store={},Object.defineProperty(z._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(z,"_self",{configurable:!1,enumerable:!1,writable:!1,value:R}),Object.defineProperty(z,"_source",{configurable:!1,enumerable:!1,writable:!1,value:X}),Object.freeze&&(Object.freeze(z.props),Object.freeze(z)),z};function Ho(i,_,O,R,X){{var F,Y={},z=null,ee=null;O!==void 0&&(Jt(O),z=""+O),Uo(_)&&(Jt(_.key),z=""+_.key),Xo(_)&&(ee=_.ref,Wo(_,X));for(F in _)Ve.call(_,F)&&!No.hasOwnProperty(F)&&(Y[F]=_[F]);if(i&&i.defaultProps){var G=i.defaultProps;for(F in G)Y[F]===void 0&&(Y[F]=G[F])}if(z||ee){var J=typeof i=="function"?i.displayName||i.name||"Unknown":i;z&&Vo(Y,J),ee&&Fo(Y,J)}return Ko(i,z,ee,X,R,De.current,Y)}}var ft=E.ReactCurrentOwner,er=E.ReactDebugCurrentFrame;function be(i){if(i){var _=i._owner,O=We(i.type,i._source,_?_.type:null);er.setExtraStackFrame(O)}else er.setExtraStackFrame(null)}var dt;dt=!1;function pt(i){return typeof i=="object"&&i!==null&&i.$$typeof===t}function tr(){{if(ft.current){var i=B(ft.current.type);if(i)return`
|
|
22
22
|
|
|
23
|
-
Check the render method of \``+i+"`."}return""}}function
|
|
23
|
+
Check the render method of \``+i+"`."}return""}}function qo(i){{if(i!==void 0){var _=i.fileName.replace(/^.*[\\\/]/,""),O=i.lineNumber;return`
|
|
24
24
|
|
|
25
|
-
Check your code at `+
|
|
25
|
+
Check your code at `+_+":"+O+"."}return""}}var rr={};function Go(i){{var _=tr();if(!_){var O=typeof i=="string"?i:i.displayName||i.name;O&&(_=`
|
|
26
26
|
|
|
27
|
-
Check the top-level render call using <`+O+">.")}return
|
|
27
|
+
Check the top-level render call using <`+O+">.")}return _}}function nr(i,_){{if(!i._store||i._store.validated||i.key!=null)return;i._store.validated=!0;var O=Go(_);if(rr[O])return;rr[O]=!0;var R="";i&&i._owner&&i._owner!==ft.current&&(R=" It was passed a child from "+B(i._owner.type)+"."),be(i),w('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',O,R),be(null)}}function or(i,_){{if(typeof i!="object")return;if(ut(i))for(var O=0;O<i.length;O++){var R=i[O];pt(R)&&nr(R,_)}else if(pt(i))i._store&&(i._store.validated=!0);else if(i){var X=I(i);if(typeof X=="function"&&X!==i.entries)for(var F=X.call(i),Y;!(Y=F.next()).done;)pt(Y.value)&&nr(Y.value,_)}}}function Jo(i){{var _=i.type;if(_==null||typeof _=="string")return;var O;if(typeof _=="function")O=_.propTypes;else if(typeof _=="object"&&(_.$$typeof===l||_.$$typeof===a))O=_.propTypes;else return;if(O){var R=B(_);Lo(O,i.props,"prop",R,i)}else if(_.PropTypes!==void 0&&!dt){dt=!0;var X=B(_);w("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",X||"Unknown")}typeof _.getDefaultProps=="function"&&!_.getDefaultProps.isReactClassApproved&&w("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function Zo(i){{for(var _=Object.keys(i.props),O=0;O<_.length;O++){var R=_[O];if(R!=="children"&&R!=="key"){be(i),w("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",R),be(null);break}}i.ref!==null&&(be(i),w("Invalid attribute `ref` supplied to `React.Fragment`."),be(null))}}function sr(i,_,O,R,X,F){{var Y=j(i);if(!Y){var z="";(i===void 0||typeof i=="object"&&i!==null&&Object.keys(i).length===0)&&(z+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var ee=qo(X);ee?z+=ee:z+=tr();var G;i===null?G="null":ut(i)?G="array":i!==void 0&&i.$$typeof===t?(G="<"+(B(i.type)||"Unknown")+" />",z=" Did you accidentally export a JSX literal instead of a component?"):G=typeof i,w("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",G,z)}var J=Ho(i,_,O,X,F);if(J==null)return J;if(Y){var se=_.children;if(se!==void 0)if(R)if(ut(se)){for(var Ee=0;Ee<se.length;Ee++)or(se[Ee],i);Object.freeze&&Object.freeze(se)}else w("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 or(se,i)}return i===n?Zo(J):Jo(J),J}}function Qo(i,_,O){return sr(i,_,O,!0)}function es(i,_,O){return sr(i,_,O,!1)}var ts=es,rs=Qo;xe.Fragment=n,xe.jsx=ts,xe.jsxs=rs}()),xe}(function(e){process.env.NODE_ENV==="production"?e.exports=ur():e.exports=lr()})(cr);const fr=Ce.Fragment,P=Ce.jsx,ce=Ce.jsxs;let dr=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((t,r)=>(r&=63,r<36?t+=r.toString(36):r<62?t+=(r-26).toString(36).toUpperCase():r>62?t+="-":t+="_",t),"");class pr{constructor(t,r,n=null){this._socket=t,this.userId=n,this.room=r,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:o,name:s,params:c})=>{try{const u=await this.registeredRPC[s](c);t.emit(`${this.room}._result.${o}`,{ok:u||null})}catch(u){t.emit(`${this.room}._result.${o}`,{err:`${u.message}`})}})}async _callServerRPC(t,r){const n=dr();return new Promise((o,s)=>{this._socket.once(`${this.room}._result.${n}`,c=>{c.hasOwnProperty("ok")?o(c.ok):s(c.err)}),this._socket.emit(`${this.room}._call`,{callId:n,name:t,params:r})})}leave(){this._left=!0,this.toUnregister.forEach(t=>{t()}),this._socket.emit(`${this.room}.leave`)}publish(t,r,n=!1){this._socket.emit(`${this.room}.publish`,{name:t,params:r,self:n})}subscribe(t,r){this._socket.on(`${this.room}.${t}`,r);const n=()=>{this._socket.off(`${this.room}.${t}`,r)};return this.toUnregister.push(n),n}async register(t,r,{invoke:n="single"}={}){this.registeredRPC[t]=r,await this._callServerRPC("register",{name:t,invoke:n});const o=()=>{if(this.registeredRPC[t]===r)return delete this.registeredRPC[t],this._callServerRPC("unregister",{name:t})};return this.toUnregister.push(o),o}async call(t,r){return await this._callServerRPC("call",{name:t,params:r})}}const mr=({socket:e,room:t,onJoined:r=()=>{},onMaster:n=()=>{},userId:o=null})=>{const s=new pr(e,t,o);return new Promise(c=>{let u=!0;e.on(`${t}.isMaster`,()=>{s._left||n(t)}),e.on(`${t}.roomJoined`,l=>{s._left||(s.userId=l,u=!1,r(s),c(s))}),e.on("connect",()=>{s._left||u||e.emit("joinSuperSocket",{room:t,userId:s.userId})}),e.emit("joinSuperSocket",{room:t,userId:o})})},Ke=d.createContext(),gr=()=>P("div",{style:{position:"absolute",top:"0",bottom:"0",width:"100%",display:"flex",justifyContent:"center",alignItems:"center"},children:P("h2",{children:"🌀 Loading..."})}),ht=({socket:e,room:t,channel:r="default",LoadingComponent:n=gr,children:o})=>{const[s,c]=d.useState(!1),[u,l]=d.useState(!1),[m,f]=d.useState(null),a=d.useRef(null),h=d.useRef(!1),S=d.useContext(Ke),v=d.useRef(!1);return d.useEffect(()=>(h.current=!0,()=>{h.current=!1}),[]),d.useEffect(()=>{if(!e)return null;const b=()=>{console.log(`Disconnected from ${r}…`),h.current&&(c(!1),l(!1))};return e.on("disconnect",b),()=>{e.off("disconnect",b)}},[r,e]),d.useEffect(()=>e?(e.connected||e.connect(),console.log(`Try to connect to wire ${t} on channel ${r}`),v.current||(v.current=!0,mr({socket:e,room:t,onMaster:()=>{console.log(`Is now master on channel ${r}…`),h.current&&l(!0)},onJoined:b=>{console.log(`Connected on channel ${r}…`),a.current=b,h.current&&(f(b),c(!0))}})),()=>{var b;(b=a.current)==null||b.leave()}):null,[r,t,e]),!s||!m?P(n,{}):P(Ke.Provider,{value:{...S,[r]:{wire:m,joined:s,isMaster:u,room:t}},children:o})},Ie=(e="default")=>(d.useContext(Ke)||{})[e],vt=e=>{let t;const r=new Set,n=(l,m)=>{const f=typeof l=="function"?l(t):l;if(!Object.is(f,t)){const a=t;t=m??typeof f!="object"?f:Object.assign({},t,f),r.forEach(h=>h(t,a))}},o=()=>t,u={setState:n,getState:o,subscribe:l=>(r.add(l),()=>r.delete(l)),destroy:()=>{({BASE_URL:"/",MODE:"production",DEV:!1,PROD:!0}&&"production")!=="production"&&console.warn("[DEPRECATED] The destroy method will be unsupported in the future version. You should use unsubscribe function returned by subscribe. Everything will be garbage collected if store is garbage collected."),r.clear()}};return t=e(n,o,u),u},je=e=>e?vt(e):vt;var He={},hr={get exports(){return He},set exports(e){He=e}},qe={},Re={},vr={get exports(){return Re},set exports(e){Re=e}},Ge={};/**
|
|
28
28
|
* @license React
|
|
29
29
|
* use-sync-external-store-shim.production.min.js
|
|
30
30
|
*
|
|
@@ -32,7 +32,7 @@ Check the top-level render call using <`+O+">.")}return y}}function nr(i,y){{if(
|
|
|
32
32
|
*
|
|
33
33
|
* This source code is licensed under the MIT license found in the
|
|
34
34
|
* LICENSE file in the root directory of this source tree.
|
|
35
|
-
*/var
|
|
35
|
+
*/var yt;function yr(){if(yt)return Ge;yt=1;var e=d;function t(a,h){return a===h&&(a!==0||1/a===1/h)||a!==a&&h!==h}var r=typeof Object.is=="function"?Object.is:t,n=e.useState,o=e.useEffect,s=e.useLayoutEffect,c=e.useDebugValue;function u(a,h){var S=h(),v=n({inst:{value:S,getSnapshot:h}}),b=v[0].inst,I=v[1];return s(function(){b.value=S,b.getSnapshot=h,l(b)&&I({inst:b})},[a,S,h]),o(function(){return l(b)&&I({inst:b}),a(function(){l(b)&&I({inst:b})})},[a]),c(S),S}function l(a){var h=a.getSnapshot;a=a.value;try{var S=h();return!r(a,S)}catch{return!0}}function m(a,h){return h()}var f=typeof window>"u"||typeof window.document>"u"||typeof window.document.createElement>"u"?m:u;return Ge.useSyncExternalStore=e.useSyncExternalStore!==void 0?e.useSyncExternalStore:f,Ge}var Je={};/**
|
|
36
36
|
* @license React
|
|
37
37
|
* use-sync-external-store-shim.development.js
|
|
38
38
|
*
|
|
@@ -40,7 +40,7 @@ Check the top-level render call using <`+O+">.")}return y}}function nr(i,y){{if(
|
|
|
40
40
|
*
|
|
41
41
|
* This source code is licensed under the MIT license found in the
|
|
42
42
|
* LICENSE file in the root directory of this source tree.
|
|
43
|
-
*/var
|
|
43
|
+
*/var St;function Sr(){return St||(St=1,process.env.NODE_ENV!=="production"&&function(){typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error);var e=d,t=e.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function r(x){{for(var p=arguments.length,C=new Array(p>1?p-1:0),g=1;g<p;g++)C[g-1]=arguments[g];n("error",x,C)}}function n(x,p,C){{var g=t.ReactDebugCurrentFrame,y=g.getStackAddendum();y!==""&&(p+="%s",C=C.concat([y]));var k=C.map(function(M){return String(M)});k.unshift("Warning: "+p),Function.prototype.apply.call(console[x],console,k)}}function o(x,p){return x===p&&(x!==0||1/x===1/p)||x!==x&&p!==p}var s=typeof Object.is=="function"?Object.is:o,c=e.useState,u=e.useEffect,l=e.useLayoutEffect,m=e.useDebugValue,f=!1,a=!1;function h(x,p,C){f||e.startTransition!==void 0&&(f=!0,r("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 g=p();if(!a){var y=p();s(g,y)||(r("The result of getSnapshot should be cached to avoid an infinite loop"),a=!0)}var k=c({inst:{value:g,getSnapshot:p}}),M=k[0].inst,j=k[1];return l(function(){M.value=g,M.getSnapshot=p,S(M)&&j({inst:M})},[x,g,p]),u(function(){S(M)&&j({inst:M});var D=function(){S(M)&&j({inst:M})};return x(D)},[x]),m(g),g}function S(x){var p=x.getSnapshot,C=x.value;try{var g=p();return!s(C,g)}catch{return!0}}function v(x,p,C){return p()}var b=typeof window<"u"&&typeof window.document<"u"&&typeof window.document.createElement<"u",I=!b,E=I?v:h,w=e.useSyncExternalStore!==void 0?e.useSyncExternalStore:E;Je.useSyncExternalStore=w,typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error)}()),Je}var _t;function bt(){return _t||(_t=1,function(e){process.env.NODE_ENV==="production"?e.exports=yr():e.exports=Sr()}(vr)),Re}/**
|
|
44
44
|
* @license React
|
|
45
45
|
* use-sync-external-store-shim/with-selector.production.min.js
|
|
46
46
|
*
|
|
@@ -48,7 +48,7 @@ Check the top-level render call using <`+O+">.")}return y}}function nr(i,y){{if(
|
|
|
48
48
|
*
|
|
49
49
|
* This source code is licensed under the MIT license found in the
|
|
50
50
|
* LICENSE file in the root directory of this source tree.
|
|
51
|
-
*/var
|
|
51
|
+
*/var Et;function _r(){if(Et)return qe;Et=1;var e=d,t=bt();function r(m,f){return m===f&&(m!==0||1/m===1/f)||m!==m&&f!==f}var n=typeof Object.is=="function"?Object.is:r,o=t.useSyncExternalStore,s=e.useRef,c=e.useEffect,u=e.useMemo,l=e.useDebugValue;return qe.useSyncExternalStoreWithSelector=function(m,f,a,h,S){var v=s(null);if(v.current===null){var b={hasValue:!1,value:null};v.current=b}else b=v.current;v=u(function(){function E(g){if(!w){if(w=!0,x=g,g=h(g),S!==void 0&&b.hasValue){var y=b.value;if(S(y,g))return p=y}return p=g}if(y=p,n(x,g))return y;var k=h(g);return S!==void 0&&S(y,k)?y:(x=g,p=k)}var w=!1,x,p,C=a===void 0?null:a;return[function(){return E(f())},C===null?void 0:function(){return E(C())}]},[f,a,h,S]);var I=o(m,v[0],v[1]);return c(function(){b.hasValue=!0,b.value=I},[I]),l(I),I},qe}var Ze={};/**
|
|
52
52
|
* @license React
|
|
53
53
|
* use-sync-external-store-shim/with-selector.development.js
|
|
54
54
|
*
|
|
@@ -56,13 +56,13 @@ Check the top-level render call using <`+O+">.")}return y}}function nr(i,y){{if(
|
|
|
56
56
|
*
|
|
57
57
|
* This source code is licensed under the MIT license found in the
|
|
58
58
|
* LICENSE file in the root directory of this source tree.
|
|
59
|
-
*/var Et;function br(){return Et||(Et=1,process.env.NODE_ENV!=="production"&&function(){typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error);var e=f,t=bt();function r(d,c){return d===c&&(d!==0||1/d===1/c)||d!==d&&c!==c}var n=typeof Object.is=="function"?Object.is:r,o=t.useSyncExternalStore,s=e.useRef,a=e.useEffect,u=e.useMemo,l=e.useDebugValue;function m(d,c,_,b,C){var h=s(null),S;h.current===null?(S={hasValue:!1,value:null},h.current=S):S=h.current;var E=u(function(){var I=!1,w,g,P=function(Y){if(!I){I=!0,w=Y;var N=b(Y);if(C!==void 0&&S.hasValue){var H=S.value;if(C(H,N))return g=H,H}return g=N,N}var T=w,D=g;if(n(T,Y))return D;var A=b(Y);return C!==void 0&&C(D,A)?D:(w=Y,g=A,A)},M=_===void 0?null:_,j=function(){return P(c())},$=M===null?void 0:function(){return P(M())};return[j,$]},[c,_,b,C]),x=E[0],v=E[1],p=o(d,x,v);return a(function(){S.hasValue=!0,S.value=p},[p]),l(p),p}Je.useSyncExternalStoreWithSelector=m,typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error)}()),Je}(function(e){process.env.NODE_ENV==="production"?e.exports=Sr():e.exports=br()})(gr);const _r=pe(Ke),{useSyncExternalStoreWithSelector:Er}=_r;function $e(e,t=e.getState,r){const n=Er(e.subscribe,e.getState,e.getServerState||e.getState,t,r);return f.useDebugValue(n),n}const ye=(e,t)=>e.classList&&e.classList.contains(t),Oe=(e,t)=>ye(e,t)?e:e.parentNode?Oe(e.parentNode,t):!1,wt=(e,t)=>e.x>t.left&&e.x<t.left+t.width&&e.y>t.top&&e.y<t.top+t.height,wr=(e,t)=>Array.from(e.querySelectorAll(".corner")).every(n=>{const{top:o,left:s}=n.getBoundingClientRect();return wt({x:s,y:o},t)}),Cr=(e,t)=>{const r=t.getBoundingClientRect();return wr(e,r)},Ze=(e,t)=>{const n=e.getElementsByClassName(`item ${t}`)[0];return n||console.error(`Missing item ${t}`),n},Te=e=>{var r,n;const t=(r=e==null?void 0:e.dataset)==null?void 0:r.id;return t||console.error("getIdFromElem call fails",e,JSON.stringify(e==null?void 0:e.dataset),(n=e==null?void 0:e.dataset)==null?void 0:n.id),t},Ct=(e,t=document)=>{const r=e.reduce((n,o)=>{const s=Ze(t,o);if(!s)return null;const{left:a,right:u,top:l,bottom:m}=s.getBoundingClientRect();let d;return n?d=n:d={left:a,top:l,right:u,bottom:m},d.left=Math.min(a,d.left),d.top=Math.min(l,d.top),d.right=Math.max(u,d.right),d.bottom=Math.max(m,d.bottom),d},null);return r&&(r.width=r.right-r.left,r.height=r.bottom-r.top,r)},xr=({x:e,y:t,width:r,height:n},{type:o="grid",size:s=1,offset:a={x:0,y:0}})=>{const[u,l]=[e+r/2-a.x,t+n/2-a.y];let m,d,c,_,b,C,h,S,E,x;const v=s/1.1547;switch(o){case"grid":m=Math.round(u/s)*s,d=Math.round(l/s)*s;break;case"hexH":c=2*v,_=3*s,b=Math.round(u/c)*c,h=Math.round(l/_)*_,C=b>u?b-v:b+v,S=h>l?h-1.5*s:h+1.5*s,E=Math.hypot(b-u,h-l),x=Math.hypot(C-u,S-l),E<x?(m=b,d=h):(m=C,d=S);break;case"hexV":c=3*s,_=2*v,b=Math.round(u/c)*c,h=Math.round(l/_)*_,C=b>u?b-1.5*s:b+1.5*s,S=h>l?h-v:h+v,E=Math.hypot(b-u,h-l),x=Math.hypot(C-u,S-l),E<x?(m=b,d=h):(m=C,d=S);break;default:m=e+r/2,d=t+n/2}return{x:m+a.x-r/2,y:d+a.y-n/2}},xt=["#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"],It=()=>xt[Math.floor(Math.random()*xt.length)],Ir=!1,Qe=({wire:e,storeName:t,noSync:r=[],defaultValue:n},o)=>(s,a,u)=>{s({ready:!1});const l=[];(async()=>{try{const b=await e.call(`${t}_getValue`);Ir&&console.log("init from peer with value",b),s(C=>({...C,...b}))}catch{n!==void 0&&s(n)}l.push(await e.register(`${t}_getValue`,()=>Object.fromEntries(Object.entries(a()).filter(([b,C])=>typeof C!="function"&&!r.includes(b))),{invoke:"first"})),l.push(e.subscribe(`${t}_call`,([b,C])=>{c[b](...C)})),s({ready:!0})})();const d=o(s,a,u),c={...d},_=Object.fromEntries(Object.entries(d).map(([b,C])=>typeof C=="function"&&!b.startsWith("get")&&!r.includes(b)?[b,(...S)=>{const E=C(...S);return e.publish(`${t}_call`,[b,S]),E}]:[b,C]));return _.unsub=()=>{l.forEach(b=>b())},_};function Ae(e,t){if(Object.is(e,t))return!0;if(typeof e!="object"||e===null||typeof t!="object"||t===null)return!1;if(e instanceof Map&&t instanceof Map){if(e.size!==t.size)return!1;for(const[n,o]of e)if(!Object.is(o,t.get(n)))return!1;return!0}if(e instanceof Set&&t instanceof Set){if(e.size!==t.size)return!1;for(const n of e)if(!t.has(n))return!1;return!0}const r=Object.keys(e);if(r.length!==Object.keys(t).length)return!1;for(let n=0;n<r.length;n++)if(!Object.prototype.hasOwnProperty.call(t,r[n])||!Object.is(e[r[n]],t[r[n]]))return!1;return!0}const Ot=f.createContext(),Or=(e,t)=>({items:{},getItems:()=>t().items,setItems:r=>e({items:r}),updateItems:r=>e(n=>({items:{...n.items,...r}})),moveItems:(r,n)=>e(({items:o})=>{const s={...o};return r.forEach(a=>{const u=o[a];u&&(s[a]={...u,x:(u.x||0)+n.x,y:(u.y||0)+n.y,moving:!0})}),{items:s}})}),Tr=(e,t)=>({itemIds:[],setItemIds:r=>e({itemIds:r}),getItemIds:()=>t().itemIds,insert:(r,n)=>e(o=>{const s=[...o.itemIds];return s.splice(r,0,n),{itemIds:s}}),remove:r=>e(n=>{const o=[...n.itemIds];return o.splice(r,1),{itemIds:o}}),updateItemIds:(r,n)=>e(o=>{const s=[...o.itemIds];return s[r]=n,{items:s}}),updateManyItemIds:r=>e(n=>({items:n.itemIds.map((o,s)=>r[s]!==void 0?r[s]:o)}))}),kr=(e,t)=>({removeItemsById:r=>e(n=>({itemIds:n.itemIds.filter(o=>!r.includes(o)),items:Object.fromEntries(Object.entries(n.items).filter(([o])=>!r.includes(o)))})),getItemList:()=>{const r=t().items;return t().itemIds.map(n=>r[n])},setItemList:r=>e({items:Object.fromEntries(r.map(n=>[n.id,n])),itemIds:r.map(({id:n})=>n)}),insertItems:(r,n)=>e(o=>{let s;const a=r.map(({id:u})=>u);if(n){const u=o.itemIds.findIndex(l=>l===n);s=[...o.itemIds],s.splice(u,0,...a)}else s=[...o.itemIds,...a];return{items:{...o.items,...Object.fromEntries(r.map(u=>[u.id,u]))},itemIds:s}})}),Pr=(e,t)=>({boardConfig:{},getBoardConfig:()=>t().boardConfig,setBoardConfig:r=>e({boardConfig:r}),updateBoardConfig:r=>e(n=>({boardConfig:{...n.boardConfig,...r}}))}),Mr=(e,t)=>({session:{},getSessionInfo:()=>t().session,setSessionInfo:r=>e({session:r}),updateSessionInfo:r=>e(n=>({session:{...n.session,...r}}))}),Tt=({storeName:e,children:t,defaultValue:r})=>{const{wire:n}=Ie("room"),[o,s]=f.useState(!1),[a]=f.useState(()=>Re(Qe({wire:n,storeName:e,defaultValue:r},(...u)=>({...Or(...u),...Tr(...u),...kr(...u),...Pr(...u),...Mr(...u)}))));return f.useEffect(()=>{const u=a.subscribe(l=>{l.ready&&(u(),s(!0))})},[a]),o?k(Ot.Provider,{value:a,children:t}):null},ie=(e,t)=>{const r=f.useContext(Ot);return $e(r,e,t||Ae)},jr=()=>{const[e,t]=ie(n=>[n.itemIds,n.items]);return f.useMemo(()=>e.map(n=>t[n]),[e,t])},Rr=()=>{const[e,t,r]=ie(a=>[a.items,a.itemIds,a.getItemList]),[n,o]=f.useState(r()),[,s]=f.useTransition();return f.useEffect(()=>{const a=r();s(()=>{o(a)})},[e,t,r]),n},kt=5e4,Pt=f.createContext(),Dr=(e,t)=>({config:{itemTemplates:{},actions:{},uid:null,itemExtent:{},boardWrapperRect:{},boardSize:kt},updateConfiguration:r=>e(n=>({config:{...n.config,...r}})),getConfiguration:()=>t().config}),$r=(e,t)=>({boardState:{movingItems:!1,selecting:!1,zooming:!1,panning:!1,translateX:0,translateY:0,scale:1},updateBoardState:r=>e(n=>({boardState:{...n.boardState,...r}})),getBoardState:()=>t().boardState}),Ar=(e,t)=>({interactions:{},getInteractions:()=>t().interactions,register:(r,n)=>e(o=>{const s=[...o.interactions[r]||[]];return s.push(n),{interactions:{...o.interaction,[r]:s}}}),unregister:(r,n)=>e(o=>{const s=(o.interactions[r]||[]).filter(a=>a!==n);return{interactions:{...o.interaction,[r]:s}}}),callInteractions:(r,n)=>{t().interactions[r]&&t().interactions[r].forEach(o=>{o(n)})}}),Lr=(e,t)=>({selection:[],setSelection:r=>e(n=>JSON.stringify(n.selection)!==JSON.stringify(r)?{selection:r}:{}),getSelection:()=>t().selection,select:r=>e(n=>({selection:[...n.selection,...r]})),unselect:r=>e(n=>({selection:n.selection.filter(o=>!r.includes(o))})),clear:()=>e(r=>r.selection.length>0?{selection:[]}:{}),reverse:()=>e(r=>{const n=[...r.selection];return n.reverse(),{selection:n}}),selectionBox:null,setSelectionBox:r=>e(n=>{const o=n.selectionBox;return!o||!r||o.top!==r.top||o.left!==r.left||o.width!==r.width||o.height!==r.height?{selectionBox:r}:{}})}),Mt=({children:e})=>{const[t]=f.useState(()=>Re((...r)=>({...Dr(...r),...$r(...r),...Ar(...r),...Lr(...r)})));return k(Pt.Provider,{value:t,children:e})},Q=(e,t)=>{const r=f.useContext(Pt);return $e(r,e,t||Ae)},zr=()=>{const[e]=Q(t=>[t.selection]);return e};function et(e){const t=f.useRef(e);return t.current=e,f.useMemo(()=>Object.freeze({get current(){return t.current}}),[])}function Br(e){const t=et(e);f.useEffect(()=>()=>{t.current()},[])}function tt(e,t,r,n=0){const o=f.useRef(),s=f.useRef(),a=f.useRef(),u=()=>{o.current&&(clearTimeout(o.current),o.current=void 0),s.current&&(clearTimeout(s.current),s.current=void 0)};return Br(u),f.useMemo(()=>{const l=()=>{if(!a.current)return;const d=a.current;a.current=void 0,e.apply(d.this,d.args),u()},m=function(...d){o.current&&clearTimeout(o.current),a.current={args:d,this:this},o.current=setTimeout(l,r),n>0&&!s.current&&(s.current=setTimeout(l,n))};return Object.defineProperties(m,{length:{value:e.length},name:{value:`${e.name||"anonymous"}__debounced__${r}`}}),m},[r,n,...t])}const Le=100,Se=1e3,Yr=.8,jt=({x:e,y:t,scale:r,itemExtent:{right:n,left:o,top:s,bottom:a},boardWrapperRect:u,boardSize:l})=>{const m={left:-n*r+Le*r,right:u.width-o*r-Le*r,top:-a*r+Le*r,bottom:u.height-s*r-Le*r,maxRight:u.width-l*r,maxLeft:u.height-l*r},d=Math.min(Math.max(e,m.left,m.maxRight),m.right,0),c=Math.min(Math.max(t,m.top,m.maxLeft),m.bottom,0);return[d,c]},ze=()=>{const[e,t,r,n,o]=Q(h=>[h.getBoardState,h.updateBoardState,h.config.itemExtent,h.getConfiguration,h.updateConfiguration]),s=f.useRef([.1,8]),[a]=ie(h=>[h.getItemList]),u=f.useCallback(()=>{const{translateX:h,translateY:S,scale:E}=e();return{translateX:h,translateY:S,scale:E}},[e]),l=f.useCallback(h=>{const{itemExtent:S,boardWrapperRect:E,boardSize:x}=n(),v=e(),{translateX:p,translateY:I,scale:w}={...v,...h(v)};let g=w;w!==v.scale&&(g>s.current[1]&&([,g]=s.current),g<s.current[0]&&([g]=s.current));let[P,M]=[p,I];(p!==v.translateX||I!==v.translateY)&&([P,M]=jt({x:p,y:I,scale:g,itemExtent:S,boardWrapperRect:E,boardSize:x})),t({translateX:P,translateY:M,scale:g})},[e,n,t]),m=f.useCallback((h,S)=>{const{itemExtent:E,boardWrapperRect:x,boardSize:v}=n();let p=S;p||(p={x:x.width/2,y:x.height/2});const I=e();let w=I.scale*h;w>s.current[1]&&([,w]=s.current),w<s.current[0]&&([w]=s.current);const g=p.x-x.left,P=p.y-x.top,M=g-(g-I.translateX)*w/I.scale,j=P-(P-I.translateY)*w/I.scale,[$,Y]=jt({x:M,y:j,scale:w,itemExtent:E,boardWrapperRect:x,boardSize:v});t({scale:w,translateX:$,translateY:Y})},[e,n,t]),d=f.useCallback(({left:h,top:S,width:E,height:x})=>{const{boardWrapperRect:v}=n(),p=v.width/E,I=v.height/x,g=Math.min(p,I)*Yr,P=v.width/2-(h+E/2)*g,M=v.height/2-(S+x/2)*g;t({translateX:P,translateY:M,scale:g})},[n,t]),c=f.useCallback(async()=>{const{itemExtent:{width:h,height:S},boardWrapperRect:E}=n(),x=E.width/h,v=E.height/S,p=Math.min(x,v);s.current=[Math.max(p*.5,.05),Math.max(p*10,10)]},[n]),_=f.useCallback(()=>{const{boardWrapperRect:h,boardSize:S}=n(),{translateX:E,translateY:x,scale:v}=e();return{x:(h.width/2-E)/v-S/2,y:(h.height/2-x)/v-S/2}},[e,n]),b=f.useCallback(()=>{const h=a(),{boardWrapperRect:S,boardWrapper:E,boardSize:x}=n(),{scale:v,translateX:p,translateY:I}=e(),{left:w,top:g,width:P,height:M}=Ct(h.map(({id:$})=>$),E)||{left:x/2*v+S.left+p,top:x/2*v+S.top+I,width:0,height:0},j={left:(w-S.left-p)/v,top:(g-S.top-I)/v,width:P/v,height:M/v};if(j.right=j.left+j.width,j.bottom=j.top+j.height,j.width<Se){const $=(Se-j.width)/2;j.left-=$,j.right+=$,j.width=Se}if(j.height<Se){const $=(Se-j.height)/2;j.top-=$,j.bottom+=$,j.height=Se}o({itemExtent:j})},[e,n,a,o]),C=tt(()=>b(),[b],200);return f.useEffect(()=>{r.left&&c()},[c,r]),{setDim:l,getDim:u,zoomTo:m,zoomToCenter:m,zoomToExtent:d,getCenter:_,updateItemExtent:C}},Rt=e=>{const[t,r,n]=Q(({register:a,unregister:u,callInteractions:l})=>[a,u,l]),o=f.useCallback(a=>(t(e,a),()=>{r(e,a)}),[e,t,r]),s=f.useCallback(a=>{n(e,a)},[n,e]);return{register:o,call:s}},Be=()=>{const{call:e}=Rt("place"),{getCenter:t,updateItemExtent:r}=ze(),[n,o,s,a]=Q(T=>[T.clear,T.reverse,T.unselect,T.getConfiguration]),{getItems:u,getItemIds:l,setItemIds:m,updateItems:d,moveItems:c,removeItemsById:_,getItemList:b,insertItems:C,setItemList:h}=ie(({getItems:T,getItemIds:D,setItemIds:A,updateItems:W,moveItems:z,removeItemsById:K,getItemList:G,insertItems:re,setItemList:ne})=>({getItems:T,getItemIds:D,setItemIds:A,updateItems:W,moveItems:z,removeItemsById:K,getItemList:G,insertItems:re,setItemList:ne})),S=f.useCallback((T,D)=>{let A=D;typeof D=="object"&&(A=()=>D);const W=l().filter(G=>T.includes(G)),z=u(),K=Object.fromEntries(W.map(G=>[G,A({...z[G]})]));d(K),r()},[l,u,r,d]),E=f.useCallback(T=>{h(T),n(),r()},[n,h,r]),x=f.useCallback((T,D)=>{S([T],D)},[S]),v=f.useCallback((T,D)=>{c(T,D),r()},[c,r]),p=f.useCallback(T=>{const D=l(),A=D.filter(z=>!T.includes(z)),W=D.filter(z=>T.includes(z));m([...A,...W])},[l,m]),I=f.useCallback((T,{type:D,size:A}={})=>{const{boardWrapper:W}=a(),z={},K=u();T.forEach(G=>{const re=K[G],ne=Ze(W,G);if(!ne)return;const oe={type:D||"grid",size:A||1,offset:{x:0,y:0},...re.grid},F=xr({x:re.x,y:re.y,width:ne.clientWidth,height:ne.clientHeight},oe);z[G]={...re,...F}}),d(z)},[a,u,d]),w=f.useCallback((T,D)=>{p(T),S(T,A=>{const W={...A};return delete W.moving,W}),I(T,D),e(T),r()},[S,e,p,I,r]),g=f.useCallback(T=>{m(T)},[m]),P=f.useCallback(T=>{const D=l(),A=D.filter(z=>T.includes(z)),W=D.map(z=>T.includes(z)?A.pop():z);m(W),o()},[l,o,m]),M=f.useCallback((T,D)=>{const A=u(),W=T.map(F=>A[F]),z=D.map(F=>A[F]),K=D.reduce((F,te)=>(F[te]=W.shift(),F),{}),G=z.reduce((F,te)=>{const me=K[te.id],be={...te,x:me.x,y:me.y};return F[te.id]=be,F},{});d(G);const re=T.reduce((F,te)=>(F[te]=D.shift(),F),{}),oe=l().map(F=>T.includes(F)?re[F]:F);m(oe)},[u,d,l,m]),j=f.useCallback((T,D)=>{const A=t(),W=T.map((z,K)=>!z.x||!z.y?{...z,x:A.x+2*K,y:A.y+2*K}:z);C(W,D),r()},[t,C,r]),$=f.useCallback((T,D)=>{j([T],D)},[j]),Y=f.useCallback(T=>{s(T),_(T)},[s,_]),N=f.useCallback(T=>{const D=u();return T.map(A=>D[A])},[u]),H=f.useCallback(({target:T,clientX:D,clientY:A},{returnLocked:W=!1,passLocked:z=!1}={})=>{if(["INPUT","TEXTAREA"].includes(T.tagName))return null;const K=Oe(T,"item");if(K){if(ye(K,"selected"))return K;if(!z&&ye(K,"locked")&&!ye(T,"passthrough"))return W?K:null;if(ye(T,"passthrough")){const G=l(),{boardWrapper:re}=a(),ne=G.reduce((oe,F)=>{const te=Ze(re,F),me=te.getBoundingClientRect();return wt({x:D,y:A},me)&&oe.unshift(te),oe},[]);for(let oe=0;oe<ne.length;oe+=1){const F=ne[oe];if(F!==K&&(z||!ye(F,"locked")))return F}return null}}return K},[a,l]);return{putItemsOnTop:p,batchUpdateItems:S,updateItemOrder:g,moveItems:v,placeItems:w,updateItem:x,swapItems:M,reverseItemsOrder:P,setItemList:E,pushItem:$,pushItems:j,removeItems:Y,getItemList:b,findElementUnderPointer:H,getItems:N}};var Nr=function e(t,r){if(t===r)return!0;if(t&&r&&typeof t=="object"&&typeof r=="object"){if(t.constructor!==r.constructor)return!1;var n,o,s;if(Array.isArray(t)){if(n=t.length,n!=r.length)return!1;for(o=n;o--!==0;)if(!e(t[o],r[o]))return!1;return!0}if(t instanceof Map&&r instanceof Map){if(t.size!==r.size)return!1;for(o of t.entries())if(!r.has(o[0]))return!1;for(o of t.entries())if(!e(o[1],r.get(o[0])))return!1;return!0}if(t instanceof Set&&r instanceof Set){if(t.size!==r.size)return!1;for(o of t.entries())if(!r.has(o[0]))return!1;return!0}if(ArrayBuffer.isView(t)&&ArrayBuffer.isView(r)){if(n=t.length,n!=r.length)return!1;for(o=n;o--!==0;)if(t[o]!==r[o])return!1;return!0}if(t.constructor===RegExp)return t.source===r.source&&t.flags===r.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===r.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===r.toString();if(s=Object.keys(t),n=s.length,n!==Object.keys(r).length)return!1;for(o=n;o--!==0;)if(!Object.prototype.hasOwnProperty.call(r,s[o]))return!1;for(o=n;o--!==0;){var a=s[o];if(!e(t[a],r[a]))return!1}return!0}return t!==t&&r!==r};function Ur(e,t,r,n=0){f.useEffect(tt(e,t,r,n),t)}const Xr=(e,t)=>{if(e.type in t){const r=t[e.type].defaultActions;return typeof r=="function"?r(e):r}return[]},Dt=(e,t)=>{const{actions:r=Xr(e,t)}=e;return r.map(n=>typeof n=="string"?{name:n}:n)},Wr=()=>{const[e,t]=ie(c=>[c.items,c.getItems]),[r,n,o]=Q(c=>[c.config.itemTemplates,c.selection,c.getSelection]),[s,a]=f.useState([]),u=f.useRef(!1),[,l]=f.useTransition();f.useEffect(()=>(u.current=!0,()=>{u.current=!1}),[]);const m=f.useCallback(c=>{const _=t();if(c)return[c,c.map(C=>_[C])];const b=o();return[b,b.map(C=>_[C])]},[t,o]),d=f.useCallback(()=>{const[c,_]=m();if(c.length>0){if(!u.current)return;const b=_.reduce((C,h)=>{const S=Dt(h,r);return C.filter(E=>S.some(x=>Nr(E,x)))},Dt(_[0],r));l(()=>{a(b)})}else l(()=>{a([])})},[m,r]);return Ur(()=>d(),[e,n,d],100),{availableActions:s}},Vr=()=>{const[e]=Q(t=>[t.selectionBox]);return e};let ge=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((t,r)=>(r&=63,r<36?t+=r.toString(36):r<62?t+=(r-26).toString(36).toUpperCase():r>62?t+="-":t+="_",t),"");const $t=f.createContext(),rt=e=>{localStorage.setItem("user",JSON.stringify(e))},Fr=()=>{if(localStorage.user){const t={name:"Player",color:It(),uid:ge(),...JSON.parse(localStorage.user)};return rt(t),t}const e={name:"Player",color:It(),uid:ge()};return rt(e),e},Kr=e=>(t,r)=>({isSpaceMaster:!1,users:{},getUser:()=>r().users[e],getUsers:()=>r().users,getUserList:()=>Object.values(r().users),getLocalUsers:()=>{if(!r().users[e])return[];const{space:n}=r().users[e];return r().getUserList().filter(({space:o})=>o===n)},addUser:n=>t(o=>({users:{...o.users,[n.id]:n}})),updateUser:(n,o)=>t(s=>{if(!s.users[n])return{};const a={...s.users[n],...o,id:n,uid:s.users[n].uid};return a.id===e&&rt(a),setTimeout(()=>r().electSpaceMaster(),100),{users:{...s.users,[n]:a}}}),removeUser:n=>t(o=>{const s={...o.users};return delete s[n],setTimeout(()=>r().electSpaceMaster(),100),{users:s}}),updateCurrentUser:n=>r().updateUser(e,n),joinSpace:n=>r().updateUser(e,{space:n,spaceJoinedTimestamp:Date.now()}),electSpaceMaster:()=>{const n=r().getLocalUsers(),o={uid:null,timestamp:Date.now()};Object.values(n).forEach(({spaceJoinedTimestamp:s,id:a})=>{s<o.timestamp&&(o.id=a,o.timestamp=s)}),t({isSpaceMaster:o.id===e})}}),Hr=e=>({cursors:{},moveCursor:(t,r)=>e(n=>({cursors:{...n.cursors,[t]:r}})),removeCursor:t=>e(r=>{const n={...r.cursors};return delete n[t],{cursors:n}})}),At=({storeName:e,children:t})=>{const{wire:r,isMaster:n}=Ie("room"),[o,s]=f.useState(null),[a,u]=f.useState(!1),l=f.useRef(!1);return f.useEffect(()=>{let m=!0;const d=[];if(!o&&!l.current)return l.current=!0,(()=>{const _=Re(Qe({wire:r,storeName:e,noSync:["updateCurrentUser","joinSpace","isSpaceMaster","electSpaceMaster"]},(...C)=>({...Kr(r.userId)(...C),...Hr(...C)}))),b=_.subscribe(C=>{C.ready&&(b(),m&&s(_))})})(),()=>{m=!1,l.current=!1,d.forEach(_=>_())}},[o,e,r,r.userId]),f.useEffect(()=>{if(o)return o.getState().addUser({...Fr(),id:r.userId}),u(!0),()=>{o.getState().removeUser(r.userId)}},[n,o,r]),f.useEffect(()=>{if(o){const m=r.subscribe("userLeave",d=>{o.getState().removeUser(d)});return()=>{m()}}},[n,o,r]),f.useEffect(()=>{n&&o&&o.getState().updateCurrentUser({isMaster:n})},[n,o,r]),a?k($t.Provider,{value:o,children:t}):null},he=(e,t)=>{const r=f.useContext($t);return $e(r,e,t||Ae)},qr=()=>{const[e,t,r,n,o]=he(u=>[u.isSpaceMaster,u.getUser(),u.users,u.updateCurrentUser,u.joinSpace]),s=f.useMemo(()=>Object.values(r),[r]),a=f.useMemo(()=>{const{space:u}=t;return s.filter(({space:l})=>l===u)},[t,s]);return{isSpaceMaster:e,currentUser:t,updateCurrentUser:n,users:s,localUsers:a,joinSpace:o}},Gr=()=>{const[e,t,r]=ie(o=>[o.boardConfig,o.getBoardConfig,o.setBoardConfig]),n=f.useCallback(o=>{let s=o;typeof o=="object"&&(s=()=>o);const a=t(),u=s(a);r(u)},[t,r]);return[e,n]},Jr=()=>{const[e]=Q(t=>[t.boardState]);return e},Zr=()=>{const[e,t,r,n]=ie(o=>[o.getSessionInfo,o.setSessionInfo,o.updateSessionInfo,o.session]);return{getSessionInfo:e,setSessionInfo:t,sessionInfo:n,updateSessionInfo:r}},Lt=f.createContext(),Qr=({user:{name:e,uid:t,color:r},content:n})=>({type:"message",user:{name:e,uid:t,color:r},content:n,uid:ge(),timestamp:new Date().toISOString()}),en=(e,t)=>({messages:[],setMessages:r=>e({messages:r.map(n=>({...n,timestamp:Date.parse(n.timestamp)}))}),addMessage:r=>e(n=>({messages:[...n.messages,{...r,timestamp:Date.parse(r.timestamp)}]})),sendMessage:(r,n)=>{const o=Qr({user:r,content:n});o&&t().addMessage(o)}}),zt=({storeName:e,children:t,defaultValue:r=[]})=>{const{wire:n}=Ie("room"),[o]=f.useState(()=>Re(Qe({wire:n,storeName:e,defaultValue:r,noSync:["sendMessage"]},(...s)=>({...en(...s)}))));return k(Lt.Provider,{value:o,children:t})},tn=(e,t)=>{const r=f.useContext(Lt);return $e(r,e,t||Ae)},rn=()=>{},nn=(e=rn)=>{const t=he(a=>a.getUser()),[r,n,o]=tn(a=>[a.messages,a.setMessages,a.sendMessage]);f.useEffect(()=>{r.length&&e()},[r,e]);const s=f.useCallback(a=>{o(t,a)},[t,o]);return{messages:r,setMessages:n,sendMessage:s}},Bt=({children:e,session:t})=>{const r=he(n=>n.joinSpace);return f.useEffect(()=>(r(t),()=>{r(null)}),[r,t]),e},on=({socket:e,room:t,session:r,items:n=[],messages:o=[],LoadingComponent:s,...a})=>{const[u]=f.useState(t||ge()),[l]=f.useState(r||ge()),[m]=f.useState(()=>({itemIds:n.map(({id:c})=>c),items:Object.fromEntries(n.map(c=>[c.id,c]))}));return Ie("room")?k(zt,{storeName:`${l}_messages`,defaultValue:o,children:k(Mt,{children:k(Tt,{storeName:`${l}_item`,defaultValue:m,children:k(Bt,{...a,session:l})})})}):k(gt,{room:u,channel:"room",socket:e,LoadingComponent:s,children:k(At,{storeName:`${u}_users`,children:k(zt,{storeName:`${l}_messages`,defaultValue:o,children:k(Mt,{children:k(Tt,{storeName:`${l}_item`,defaultValue:m,children:k(Bt,{...a,session:l})})})})})})},sn=({socket:e,room:t,children:r,LoadingComponent:n})=>{const[o]=f.useState(t||ge());return k(gt,{room:o,channel:"room",socket:e,LoadingComponent:n,children:k(At,{storeName:`${o}_users`,children:r})})},nt=()=>{const e=navigator.userAgent.toLowerCase();return/mac os ?x 10/.test(e)},an=(()=>{const e=document.createElement("iframe");e.src="#",document.body.appendChild(e);const t=e.contentWindow.document;t.open(),t.write("<!DOCTYPE html><html><head></head><body><span>a</span></body></html>"),t.close();const r=t.body.firstElementChild.offsetHeight;return document.body.removeChild(e),r})(),cn=800,Yt=(e,t)=>{const r=Object.keys(e).map(n=>Number(n)).find(n=>n!==t);return e[r]},Nt=([e,t],[r,n])=>{const o=Math.abs(e-r),s=Math.abs(t-n);return Math.hypot(o,s)},ve=()=>{},un=e=>t=>{const{event:r}=t;return r.isPropagationStopped()?null:e(t)},ln=e=>async(...t)=>{try{await e(...t)}catch(r){console.error(r)}};class fn{constructor(){ar(this,"lastPromise",Promise.resolve(!0))}add(t,...r){return new Promise((n,o)=>{this.lastPromise=this.lastPromise.then(()=>un(ln(t))(...r)).then(n).catch(o)})}}const ae=new fn,Ye=({children:e,onDrag:t=ve,onDragStart:r=ve,onDragEnd:n=ve,onPan:o=ve,onTap:s=ve,onLongTap:a=ve,onDoubleTap:u=ve,onZoom:l,mainAction:m="drag"})=>{const d=f.useRef(null),c=f.useRef({moving:!1,pointers:{},mainPointer:void 0}),_=E=>{const{deltaX:x,deltaY:v,clientX:p,clientY:I,deltaMode:w,ctrlKey:g,altKey:P,metaKey:M,target:j}=E;if(!(P||g&&!nt()))if(nt()&&!g)ae.add(o,{deltaX:-2*x,deltaY:-2*v,button:1,ctrlKey:g,metaKey:M,target:j,event:E});else{if(l===void 0||!v)return;let $=v;switch(w){case 1:$*=an;break;case 2:$*=cn;break}nt()&&($*=2),ae.add(l,{scale:$,clientX:p,clientY:I,event:E})}},b=E=>{const{target:x,button:v,clientX:p,clientY:I,pointerId:w,altKey:g,ctrlKey:P,metaKey:M,isPrimary:j}=E;if(c.current.pointers[w]={clientX:p,clientY:I},j&&(c.current.mainPointer=void 0),c.current.mainPointer!==void 0){if(c.current.mainPointer!==w)try{const{clientX:$,clientY:Y}=Yt(c.current.pointers,w),N=($+p)/2,H=(Y+I)/2,T=Nt([$,Y],[p,I]);Object.assign(c.current,{pressed:!0,moving:!1,gestureStart:!1,startX:p,startY:I,prevX:N,prevY:H,startDistance:T,prevDistance:T})}catch($){console.log("Error while getting other pointer. Ignoring",$),c.current.mainPointer}return}c.current.mainPointer=w,Object.assign(c.current,{pressed:!0,moving:!1,gestureStart:!1,startX:p,startY:I,prevX:p,prevY:I,currentButton:v,pointerDownEvent:E,target:x,timeStart:Date.now(),longTapTimeout:setTimeout(async()=>{c.current.noTap=!0,ae.add(a,{clientX:p,clientY:I,altKey:g,ctrlKey:P,metaKey:M,target:x,event:E})},750)});try{x.setPointerCapture(w)}catch($){console.log("Fail to capture pointer",$)}},C=E=>{if(c.current.pressed){const{pointerId:x,clientX:v,clientY:p,altKey:I,shiftKey:w,ctrlKey:g,metaKey:P,buttons:M,pointerType:j}=E;c.current.pointers[x]={clientX:v,clientY:p},c.current.moving=!0;const $=Object.keys(c.current.pointers).length===2;let Y,N,H;if($){const{clientX:W,clientY:z}=Yt(c.current.pointers,x);Y=(W+v)/2,N=(z+p)/2,H=Nt([W,z],[v,p])}else Y=v,N=p;let T=w||I||g||P||M!==1;m!=="drag"&&(T=!T);const D=!T,A=T;if(D){c.current.gestureStart||(d.current.style.cursor="move",c.current.gestureStart=!0,clearTimeout(c.current.longTapTimeout),ae.add(r,{deltaX:0,deltaY:0,startX:c.current.startX,startY:c.current.startY,clientX:c.current.startX,clientY:c.current.startY,distanceX:0,distanceY:0,button:c.current.currentButton,altKey:I,shiftKey:w,ctrlKey:g,metaKey:P,target:c.current.target,event:c.current.pointerDownEvent}));const W=Y-c.current.prevX,z=N-c.current.prevY,K=Y-c.current.startX,G=N-c.current.startY;ae.add(t,{deltaX:W,deltaY:z,startX:c.current.startX,startY:c.current.startY,clientX:Y,clientY:N,distanceX:K,distanceY:G,button:c.current.currentButton,altKey:I,shiftKey:w,ctrlKey:g,metaKey:P,target:c.current.target,event:E})}if(A){c.current.gestureStart||(d.current.style.cursor="move",c.current.gestureStart=!0,clearTimeout(c.current.longTapTimeout));const W=Y-c.current.prevX,z=N-c.current.prevY,{target:K}=c.current;if(ae.add(o,{deltaX:W,deltaY:z,button:c.current.currentButton,altKey:I,shiftKey:w,ctrlKey:g,metaKey:P,target:K,event:E}),H!==c.current.prevDistance&&l){const G=c.current.prevDistance-H;Math.abs(G)>0&&(ae.add(l,{scale:G*3,clientX:Y,clientY:N,event:E}),c.current.prevDistance=H)}}c.current.prevX=Y,c.current.prevY=N}},h=E=>{const{clientX:x,clientY:v,altKey:p,shiftKey:I,ctrlKey:w,metaKey:g,target:P,pointerId:M}=E;if(c.current.pointers[M]&&(delete c.current.pointers[M],c.current.mainPointer===M)){for(;Object.keys(c.current.pointers).length>0;){c.current.mainPointer=Number(Object.keys(c.current.pointers)[0]);try{c.current.target.setPointerCapture(c.current.mainPointer);return}catch(j){console.log("Fails to set pointer capture",j),c.current.mainPointer=void 0,delete c.current.pointers[Object.keys(c.current.pointers)[0]]}}if(c.current.mainPointer=void 0,c.current.pressed=!1,clearTimeout(c.current.longTapTimeout),c.current.moving)c.current.moving=!1,ae.add(n,{deltaX:x-c.current.prevX,deltaY:v-c.current.prevY,startX:c.current.startX,startY:c.current.startY,clientX:x,clientY:v,distanceX:x-c.current.startX,distanceY:v-c.current.startY,button:c.current.currentButton,altKey:p,shiftKey:I,ctrlKey:w,metaKey:g,event:E}),d.current.style.cursor="auto";else{const j=Date.now();c.current.noTap?c.current.noTap=!1:c.current.timeStart-j<300&&ae.add(s,{clientX:x,clientY:v,altKey:p,shiftKey:I,ctrlKey:w,metaKey:g,target:P,event:E})}}};return k("div",{onWheel:_,onPointerDown:b,onPointerMove:C,onPointerUp:h,onPointerOut:h,onPointerLeave:h,onPointerCancel:h,onDoubleClick:E=>{const{clientX:x,clientY:v,altKey:p,shiftKey:I,ctrlKey:w,metaKey:g,target:P}=E;ae.add(u,{clientX:x,clientY:v,altKey:p,shiftKey:I,ctrlKey:w,metaKey:g,target:P,event:E})},style:{touchAction:"none"},ref:d,children:e})},ot=({onResize:e,...t})=>{const[r]=Q(o=>[o.getBoardState]);return k(Ye,{onDrag:({deltaX:o,deltaY:s,event:a})=>{a.stopPropagation();const{scale:u}=r();e({width:o/u,height:s/u})},children:k("div",{...t})})};let dn={data:""},mn=e=>typeof window=="object"?((e?e.querySelector("#_goober"):window._goober)||Object.assign((e||document.head).appendChild(document.createElement("style")),{innerHTML:" ",id:"_goober"})).firstChild:e||dn,pn=/(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g,gn=/\/\*[^]*?\*\/| +/g,Ut=/\n+/g,de=(e,t)=>{let r="",n="",o="";for(let s in e){let a=e[s];s[0]=="@"?s[1]=="i"?r=s+" "+a+";":n+=s[1]=="f"?de(a,s):s+"{"+de(a,s[1]=="k"?"":t)+"}":typeof a=="object"?n+=de(a,t?t.replace(/([^,])+/g,u=>s.replace(/(^:.*)|([^,])+/g,l=>/&/.test(l)?l.replace(/&/g,u):u?u+" "+l:l)):s):a!=null&&(s=/^--/.test(s)?s:s.replace(/[A-Z]/g,"-$&").toLowerCase(),o+=de.p?de.p(s,a):s+":"+a+";")}return r+(t&&o?t+"{"+o+"}":o)+n},ue={},Xt=e=>{if(typeof e=="object"){let t="";for(let r in e)t+=r+Xt(e[r]);return t}return e},hn=(e,t,r,n,o)=>{let s=Xt(e),a=ue[s]||(ue[s]=(l=>{let m=0,d=11;for(;m<l.length;)d=101*d+l.charCodeAt(m++)>>>0;return"go"+d})(s));if(!ue[a]){let l=s!==e?e:(m=>{let d,c,_=[{}];for(;d=pn.exec(m.replace(gn,""));)d[4]?_.shift():d[3]?(c=d[3].replace(Ut," ").trim(),_.unshift(_[0][c]=_[0][c]||{})):_[0][d[1]]=d[2].replace(Ut," ").trim();return _[0]})(e);ue[a]=de(o?{["@keyframes "+a]:l}:l,r?"":"."+a)}let u=r&&ue.g?ue.g:null;return r&&(ue.g=ue[a]),((l,m,d,c)=>{c?m.data=m.data.replace(c,l):m.data.indexOf(l)===-1&&(m.data=d?l+m.data:m.data+l)})(ue[a],t,n,u),a},vn=(e,t,r)=>e.reduce((n,o,s)=>{let a=t[s];if(a&&a.call){let u=a(r),l=u&&u.props&&u.props.className||/^go/.test(u)&&u;a=l?"."+l:u&&typeof u=="object"?u.props?"":de(u,""):u===!1?"":u}return n+o+(a??"")},"");function q(e){let t=this||{},r=e.call?e(t.p):e;return hn(r.unshift?r.raw?vn(r,[].slice.call(arguments,1),t.p):r.reduce((n,o)=>Object.assign(n,o&&o.call?o(t.p):o),{}):r,mn(t.target),t.g,t.o,t.k)}q.bind({g:1}),q.bind({k:1});function yn(e,t,r,n){de.p=t}var Sn=function e(t,r){if(t===r)return!0;if(t&&r&&typeof t=="object"&&typeof r=="object"){if(t.constructor!==r.constructor)return!1;var n,o,s;if(Array.isArray(t)){if(n=t.length,n!=r.length)return!1;for(o=n;o--!==0;)if(!e(t[o],r[o]))return!1;return!0}if(t.constructor===RegExp)return t.source===r.source&&t.flags===r.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===r.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===r.toString();if(s=Object.keys(t),n=s.length,n!==Object.keys(r).length)return!1;for(o=n;o--!==0;)if(!Object.prototype.hasOwnProperty.call(r,s[o]))return!1;for(o=n;o--!==0;){var a=s[o];if(!e(t[a],r[a]))return!1}return!0}return t!==t&&r!==r};const bn=q`
|
|
59
|
+
*/var Ct;function br(){return Ct||(Ct=1,process.env.NODE_ENV!=="production"&&function(){typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(new Error);var e=d,t=bt();function r(f,a){return f===a&&(f!==0||1/f===1/a)||f!==f&&a!==a}var n=typeof Object.is=="function"?Object.is:r,o=t.useSyncExternalStore,s=e.useRef,c=e.useEffect,u=e.useMemo,l=e.useDebugValue;function m(f,a,h,S,v){var b=s(null),I;b.current===null?(I={hasValue:!1,value:null},b.current=I):I=b.current;var E=u(function(){var C=!1,g,y,k=function(A){if(!C){C=!0,g=A;var B=S(A);if(v!==void 0&&I.hasValue){var V=I.value;if(v(V,B))return y=V,V}return y=B,B}var T=g,$=y;if(n(T,A))return $;var L=S(A);return v!==void 0&&v($,L)?$:(g=A,y=L,L)},M=h===void 0?null:h,j=function(){return k(a())},D=M===null?void 0:function(){return k(M())};return[j,D]},[a,h,S,v]),w=E[0],x=E[1],p=o(f,w,x);return c(function(){I.hasValue=!0,I.value=p},[p]),l(p),p}Ze.useSyncExternalStoreWithSelector=m,typeof __REACT_DEVTOOLS_GLOBAL_HOOK__<"u"&&typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop=="function"&&__REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(new Error)}()),Ze}(function(e){process.env.NODE_ENV==="production"?e.exports=_r():e.exports=br()})(hr);const Er=me(He),{useSyncExternalStoreWithSelector:Cr}=Er;function $e(e,t=e.getState,r){const n=Cr(e.subscribe,e.getState,e.getServerState||e.getState,t,r);return d.useDebugValue(n),n}const ve=(e,t)=>e.classList&&e.classList.contains(t),Oe=(e,t)=>ve(e,t)?e:e.parentNode?Oe(e.parentNode,t):!1,Ae=([e,t],[r,n])=>{const o=Math.abs(e-r),s=Math.abs(t-n);return Math.hypot(o,s)},wt=(e,t,r)=>{const n=r*Math.PI/180,o=e*Math.cos(n)-t*Math.sin(n),s=e*Math.sin(n)+t*Math.cos(n);return[o,s]},Qe=([e,t],{scale:r,rotate:n,translateX:o,translateY:s})=>{const c=(e-o)/r,u=(t-s)/r;return wt(c,u,-n)},Le=([e,t],{scale:r,rotate:n,translateX:o,translateY:s})=>{const[c,u]=wt(e,t,n);return[c*r+o,u*r+s]},xt=(e,t,r,n)=>{const o=e.x,s=e.y,c=t.x,u=t.y,l=r.x,m=r.y,f=c-o,a=u-s,h=o-l,S=s-m,v=f*f+a*a,b=2*(h*f+S*a),I=h*h+S*S-n*n,E=b*b-4*v*I;if(E<0)return[];const w=(-b+Math.sqrt(E))/(2*v),x=(-b-Math.sqrt(E))/(2*v),p=[];return w>=0&&w<=1&&p.push({x:o+w*f,y:s+w*a}),x>=0&&x<=1&&p.push({x:o+x*f,y:s+x*a}),p},et=(e,t)=>e.x>t.left&&e.x<t.left+t.width&&e.y>t.top&&e.y<t.top+t.height,wr=(e,t)=>Array.from(e.querySelectorAll(".corner")).every(n=>{const{top:o,left:s}=n.getBoundingClientRect();return et({x:s,y:o},t)}),xr=(e,t)=>{const r=t.getBoundingClientRect();return wr(e,r)},ze=(e,t)=>{const n=e.getElementsByClassName(`item ${t}`)[0];return n||console.error(`Missing item ${t}`),n},Te=e=>{var r,n;const t=(r=e==null?void 0:e.dataset)==null?void 0:r.id;return t||console.error("getIdFromElem call fails",e,JSON.stringify(e==null?void 0:e.dataset),(n=e==null?void 0:e.dataset)==null?void 0:n.id),t},Ir=(e,t=document)=>{const r=e.reduce((n,o)=>{const s=ze(t,o);if(!s)return n||null;const{left:c,right:u,top:l,bottom:m}=s.getBoundingClientRect();let f;return n?f=n:f={left:c,top:l,right:u,bottom:m},f.left=Math.min(c,f.left),f.top=Math.min(l,f.top),f.right=Math.max(u,f.right),f.bottom=Math.max(m,f.bottom),f},null);return r&&(r.width=r.right-r.left,r.height=r.bottom-r.top,r)},Or=({x:e,y:t,width:r,height:n},{type:o="grid",size:s=1,offset:c={x:0,y:0}})=>{const[u,l]=[e+r/2-c.x,t+n/2-c.y];let m,f,a,h,S,v,b,I,E,w;const x=s/1.1547;switch(o){case"grid":m=Math.round(u/s)*s,f=Math.round(l/s)*s;break;case"hexH":a=2*x,h=3*s,S=Math.round(u/a)*a,b=Math.round(l/h)*h,v=S>u?S-x:S+x,I=b>l?b-1.5*s:b+1.5*s,E=Math.hypot(S-u,b-l),w=Math.hypot(v-u,I-l),E<w?(m=S,f=b):(m=v,f=I);break;case"hexV":a=3*s,h=2*x,S=Math.round(u/a)*a,b=Math.round(l/h)*h,v=S>u?S-1.5*s:S+1.5*s,I=b>l?b-x:b+x,E=Math.hypot(S-u,b-l),w=Math.hypot(v-u,I-l),E<w?(m=S,f=b):(m=v,f=I);break;default:m=e+r/2,f=t+n/2}return{x:m+c.x-r/2,y:f+c.y-n/2}},It=["#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"],Ot=()=>It[Math.floor(Math.random()*It.length)],Tr=!1,tt=({wire:e,storeName:t,noSync:r=[],defaultValue:n},o)=>(s,c,u)=>{s({ready:!1});const l=[];(async()=>{try{const S=await e.call(`${t}_getValue`);Tr&&console.log("init from peer with value",S),s(v=>({...v,...S}))}catch{n!==void 0&&s(n)}l.push(await e.register(`${t}_getValue`,()=>Object.fromEntries(Object.entries(c()).filter(([S,v])=>typeof v!="function"&&!r.includes(S))),{invoke:"first"})),l.push(e.subscribe(`${t}_call`,([S,v])=>{a[S](...v)})),s({ready:!0})})();const f=o(s,c,u),a={...f},h=Object.fromEntries(Object.entries(f).map(([S,v])=>typeof v=="function"&&!S.startsWith("get")&&!r.includes(S)?[S,(...I)=>{const E=v(...I);return e.publish(`${t}_call`,[S,I]),E}]:[S,v]));return h.unsub=()=>{l.forEach(S=>S())},h};function Ye(e,t){if(Object.is(e,t))return!0;if(typeof e!="object"||e===null||typeof t!="object"||t===null)return!1;if(e instanceof Map&&t instanceof Map){if(e.size!==t.size)return!1;for(const[n,o]of e)if(!Object.is(o,t.get(n)))return!1;return!0}if(e instanceof Set&&t instanceof Set){if(e.size!==t.size)return!1;for(const n of e)if(!t.has(n))return!1;return!0}const r=Object.keys(e);if(r.length!==Object.keys(t).length)return!1;for(let n=0;n<r.length;n++)if(!Object.prototype.hasOwnProperty.call(t,r[n])||!Object.is(e[r[n]],t[r[n]]))return!1;return!0}const Tt=d.createContext(),kr=(e,t)=>({items:{},getItems:()=>t().items,setItems:r=>e({items:r}),updateItems:r=>e(n=>({items:{...n.items,...r}})),moveItems:(r,n)=>e(({items:o})=>{const s={...o};return r.forEach(c=>{const u=o[c];u&&(s[c]={...u,x:(u.x||0)+n.x,y:(u.y||0)+n.y,moving:!0})}),{items:s}})}),Pr=(e,t)=>({itemIds:[],setItemIds:r=>e({itemIds:r}),getItemIds:()=>t().itemIds,insert:(r,n)=>e(o=>{const s=[...o.itemIds];return s.splice(r,0,n),{itemIds:s}}),remove:r=>e(n=>{const o=[...n.itemIds];return o.splice(r,1),{itemIds:o}}),updateItemIds:(r,n)=>e(o=>{const s=[...o.itemIds];return s[r]=n,{items:s}}),updateManyItemIds:r=>e(n=>({items:n.itemIds.map((o,s)=>r[s]!==void 0?r[s]:o)}))}),Mr=(e,t)=>({removeItemsById:r=>e(n=>({itemIds:n.itemIds.filter(o=>!r.includes(o)),items:Object.fromEntries(Object.entries(n.items).filter(([o])=>!r.includes(o)))})),getItemList:()=>{const r=t().items;return t().itemIds.map(n=>r[n])},setItemList:r=>e({items:Object.fromEntries(r.map(n=>[n.id,n])),itemIds:r.map(({id:n})=>n)}),insertItems:(r,n)=>e(o=>{let s;const c=r.map(({id:u})=>u);if(n){const u=o.itemIds.findIndex(l=>l===n);s=[...o.itemIds],s.splice(u,0,...c)}else s=[...o.itemIds,...c];return{items:{...o.items,...Object.fromEntries(r.map(u=>[u.id,u]))},itemIds:s}})}),Dr=(e,t)=>({boardConfig:{},getBoardConfig:()=>t().boardConfig,setBoardConfig:r=>e({boardConfig:r}),updateBoardConfig:r=>e(n=>({boardConfig:{...n.boardConfig,...r}}))}),jr=(e,t)=>({session:{},getSessionInfo:()=>t().session,setSessionInfo:r=>e({session:r}),updateSessionInfo:r=>e(n=>({session:{...n.session,...r}}))}),kt=({storeName:e,children:t,defaultValue:r})=>{const{wire:n}=Ie("room"),[o,s]=d.useState(!1),[c]=d.useState(()=>je(tt({wire:n,storeName:e,defaultValue:r},(...u)=>({...kr(...u),...Pr(...u),...Mr(...u),...Dr(...u),...jr(...u)}))));return d.useEffect(()=>{const u=c.subscribe(l=>{l.ready&&(u(),s(!0))})},[c]),o?P(Tt.Provider,{value:c,children:t}):null},ie=(e,t)=>{const r=d.useContext(Tt);return $e(r,e,t||Ye)},Rr=()=>{const[e,t]=ie(n=>[n.itemIds,n.items]);return d.useMemo(()=>e.map(n=>t[n]),[e,t])},$r=()=>{const[e,t,r]=ie(c=>[c.items,c.itemIds,c.getItemList]),[n,o]=d.useState(r()),[,s]=d.useTransition();return d.useEffect(()=>{const c=r();s(()=>{o(c)})},[e,t,r]),n},Pt=5e4,Mt=d.createContext(),Ar=(e,t)=>({config:{itemTemplates:{},actions:{},uid:null,itemExtent:{x:0,y:0,radius:0},boardWrapperRect:{},boardSize:Pt},updateConfiguration:r=>e(n=>({config:{...n.config,...r}})),getConfiguration:()=>t().config}),Lr=(e,t)=>({boardState:{movingItems:!1,selecting:!1,zooming:!1,panning:!1,translateX:0,translateY:0,scale:1,rotate:0},updateBoardState:r=>e(n=>({boardState:{...n.boardState,...r}})),getBoardState:()=>t().boardState}),zr=(e,t)=>({interactions:{},getInteractions:()=>t().interactions,register:(r,n)=>e(o=>{const s=[...o.interactions[r]||[]];return s.push(n),{interactions:{...o.interaction,[r]:s}}}),unregister:(r,n)=>e(o=>{const s=(o.interactions[r]||[]).filter(c=>c!==n);return{interactions:{...o.interaction,[r]:s}}}),callInteractions:(r,n)=>{t().interactions[r]&&t().interactions[r].forEach(o=>{o(n)})}}),Yr=(e,t)=>({selection:[],setSelection:r=>e(n=>JSON.stringify(n.selection)!==JSON.stringify(r)?{selection:r}:{}),getSelection:()=>t().selection,select:r=>e(n=>({selection:[...n.selection,...r]})),unselect:r=>e(n=>({selection:n.selection.filter(o=>!r.includes(o))})),clear:()=>e(r=>r.selection.length>0?{selection:[]}:{}),reverse:()=>e(r=>{const n=[...r.selection];return n.reverse(),{selection:n}}),selectionBox:null,setSelectionBox:r=>e(n=>{const o=n.selectionBox;return!o||!r||o.top!==r.top||o.left!==r.left||o.width!==r.width||o.height!==r.height?{selectionBox:r}:{}})}),Dt=({children:e})=>{const[t]=d.useState(()=>je((...r)=>({...Ar(...r),...Lr(...r),...zr(...r),...Yr(...r)})));return P(Mt.Provider,{value:t,children:e})},Z=(e,t)=>{const r=d.useContext(Mt);return $e(r,e,t||Ye)},Br=()=>{const[e]=Z(t=>[t.selection]);return e};function rt(e){const t=d.useRef(e);return t.current=e,d.useMemo(()=>Object.freeze({get current(){return t.current}}),[])}function Nr(e){const t=rt(e);d.useEffect(()=>()=>{t.current()},[])}function nt(e,t,r,n=0){const o=d.useRef(),s=d.useRef(),c=d.useRef(),u=()=>{o.current&&(clearTimeout(o.current),o.current=void 0),s.current&&(clearTimeout(s.current),s.current=void 0)};return Nr(u),d.useMemo(()=>{const l=()=>{if(!c.current)return;const f=c.current;c.current=void 0,e.apply(f.this,f.args),u()},m=function(...f){o.current&&clearTimeout(o.current),c.current={args:f,this:this},o.current=setTimeout(l,r),n>0&&!s.current&&(s.current=setTimeout(l,n))};return Object.defineProperties(m,{length:{value:e.length},name:{value:`${e.name||"anonymous"}__debounced__${r}`}}),m},[r,n,...t])}const Xr=100,Ur=1e3,Wr=.8,Vr=({x:e,y:t,scale:r,rotate:n,itemExtent:o,boardWrapperRect:s,boardSize:c})=>{let[u,l]=[e,t];const m=Qe([s.width/2,s.height/2],{translateX:u,translateY:l,scale:r,rotate:n}),f={x:o.x+c/2,y:o.y+c/2},a={x:c/2,y:c/2},h=Ae(m,[f.x,f.y]),S=Math.min(s.width,s.height),v=o.radius+S/2/r-Xr/r;if(h>v){const E=xt({x:m[0],y:m[1]},f,f,v-1/r)[0],[w,x]=Le([-E.x,-E.y],{translateX:s.width/2,translateY:s.height/2,scale:r,rotate:n});u=w,l=x}const b=Ae(m,[a.x,a.y]),I=c/2-Ae([0,0],[s.width,s.height])/r;if(b>I){const E=xt({x:m[0],y:m[1]},a,a,I-1/r)[0];if(E){const[w,x]=Le([-E.x,-E.y],{translateX:s.width/2,translateY:s.height/2,scale:r,rotate:n});u=w,l=x}}return[u,l]},ye=()=>{const[e,t,r,n,o]=Z(p=>[p.getBoardState,p.updateBoardState,p.config.itemExtent,p.getConfiguration,p.updateConfiguration]),s=d.useRef([.15,5]),[c]=ie(p=>[p.getItemList]),u=d.useCallback(()=>{const{translateX:p,translateY:C,scale:g,rotate:y}=e();return{translateX:p,translateY:C,scale:g,rotate:y}},[e]),l=d.useCallback((p,C)=>Qe([p,C],e()),[e]),m=d.useCallback((p,C)=>Le([p,C],e()),[e]),f=d.useCallback((p,C)=>{const{scale:g,rotate:y}=e();return Qe([p,C],{translateX:0,translateY:0,rotate:y,scale:g})},[e]),a=d.useCallback(p=>p>s.current[1]?s.current[1]:p<s.current[0]?s.current[0]:p,[]),h=d.useCallback(p=>{const{itemExtent:C,boardWrapperRect:g,boardSize:y}=n(),k=e(),{translateX:M,translateY:j,scale:D,rotate:A}={...k,...p(k)},B=a(D);let[V,T]=[M,j];(M!==k.translateX||j!==k.translateY)&&([V,T]=Vr({x:M,y:j,scale:B,rotate:A,itemExtent:C,boardWrapperRect:g,boardSize:y})),t({translateX:V,translateY:T,scale:B,rotate:A})},[a,e,n,t]),S=d.useCallback(p=>{let C=g=>({...g,...p});typeof p=="function"&&(C=p),h(g=>({...g,...C({translateX:g.translateX,translateY:g.translateY})}))},[h]),v=d.useCallback(({to:p,factor:C})=>{const{boardWrapperRect:g}=n();let y=p;y||(y={x:g.left+g.width/2,y:g.top+g.height/2});const k=e(),M=a(k.scale*C),j=y.x-g.left,D=y.y-g.top,A=j-(j-k.translateX)*M/k.scale,B=D-(D-k.translateY)*M/k.scale;h(V=>({...V,translateX:A,translateY:B,scale:M}))},[a,e,n,h]),b=d.useCallback(({x:p,y:C,radius:g})=>{const{rotate:y}=e(),{boardWrapperRect:k,boardSize:M}=n(),j=k.width/(g*2),D=k.height/(g*2),A=a(Math.min(j,D)*Wr),[B,V]=Le([-M/2-p,-M/2-C],{translateX:k.width/2,translateY:k.height/2,scale:A,rotate:y});h(T=>({...T,translateX:B,translateY:V,scale:A}))},[a,e,n,h]),I=d.useCallback(()=>{const{boardWrapperRect:p,boardSize:C}=n(),[g,y]=l(p.width/2,p.height/2);return{x:g-C/2,y:y-C/2}},[l,n]),E=d.useCallback(()=>{const p=c(),{boardWrapper:C,boardSize:g}=n(),y=p.reduce((M,j)=>{const D=ze(C,j.id);return M.left=Math.min(j.x,M.left),M.top=Math.min(j.y,M.top),M.right=Math.max(j.x+D.offsetWidth,M.right),M.bottom=Math.max(j.y+D.offsetHeight,M.bottom),M},{left:g/2,top:g/2,right:-g/2,bottom:-g/2}),k={x:(y.right+y.left)/2,y:(y.bottom+y.top)/2};k.radius=Math.max(Ae([k.x,k.y],[y.left,y.top]),Ur),o({itemExtent:k})},[n,c,o]),w=d.useCallback(p=>{let C=()=>p;typeof p=="function"&&(C=p),h(g=>({...g,rotate:C(g.rotate)})),E(),b(r)},[r,h,E,b]),x=nt(()=>E(),[E],200);return{setDim:h,rotateBoard:w,moveBoard:S,getDim:u,zoomTo:v,zoomToCenter:v,zoomToExtent:b,getCenter:I,updateItemExtent:x,vectorFromWrapperToBoard:f,fromWrapperToBoard:l,fromBoardToWrapper:m}},jt=e=>{const[t,r,n]=Z(({register:c,unregister:u,callInteractions:l})=>[c,u,l]),o=d.useCallback(c=>(t(e,c),()=>{r(e,c)}),[e,t,r]),s=d.useCallback(c=>{n(e,c)},[n,e]);return{register:o,call:s}},Be=()=>{const{call:e}=jt("place"),{getCenter:t,updateItemExtent:r}=ye(),[n,o,s,c]=Z(T=>[T.clear,T.reverse,T.unselect,T.getConfiguration]),{getItems:u,getItemIds:l,setItemIds:m,updateItems:f,moveItems:a,removeItemsById:h,getItemList:S,insertItems:v,setItemList:b}=ie(({getItems:T,getItemIds:$,setItemIds:L,updateItems:W,moveItems:N,removeItemsById:K,getItemList:Q,insertItems:re,setItemList:ne})=>({getItems:T,getItemIds:$,setItemIds:L,updateItems:W,moveItems:N,removeItemsById:K,getItemList:Q,insertItems:re,setItemList:ne})),I=d.useCallback((T,$)=>{let L=$;typeof $=="object"&&(L=()=>$);const W=l().filter(Q=>T.includes(Q)),N=u(),K=Object.fromEntries(W.map(Q=>[Q,L({...N[Q]})]));f(K),r()},[l,u,r,f]),E=d.useCallback(T=>{b(T),n(),r()},[n,b,r]),w=d.useCallback((T,$)=>{I([T],$)},[I]),x=d.useCallback((T,$)=>{a(T,$),r()},[a,r]),p=d.useCallback(T=>{const $=l(),L=$.filter(N=>!T.includes(N)),W=$.filter(N=>T.includes(N));m([...L,...W])},[l,m]),C=d.useCallback((T,{type:$,size:L}={})=>{const{boardWrapper:W}=c(),N={},K=u();T.forEach(Q=>{const re=K[Q],ne=ze(W,Q);if(!ne)return;const oe={type:$||"grid",size:L||1,offset:{x:0,y:0},...re.grid},H=Or({x:re.x,y:re.y,width:ne.clientWidth,height:ne.clientHeight},oe);N[Q]={...re,...H}}),f(N)},[c,u,f]),g=d.useCallback((T,$)=>{p(T),I(T,L=>{const W={...L};return delete W.moving,W}),C(T,$),e(T),r()},[I,e,p,C,r]),y=d.useCallback(T=>{m(T)},[m]),k=d.useCallback(T=>{const $=l(),L=$.filter(N=>T.includes(N)),W=$.map(N=>T.includes(N)?L.pop():N);m(W),o()},[l,o,m]),M=d.useCallback((T,$)=>{const L=u(),W=T.map(H=>L[H]),N=$.map(H=>L[H]),K=$.reduce((H,te)=>(H[te]=W.shift(),H),{}),Q=N.reduce((H,te)=>{const pe=K[te.id],_e={...te,x:pe.x,y:pe.y};return H[te.id]=_e,H},{});f(Q);const re=T.reduce((H,te)=>(H[te]=$.shift(),H),{}),oe=l().map(H=>T.includes(H)?re[H]:H);m(oe)},[u,f,l,m]),j=d.useCallback((T,$)=>{const L=t(),W=T.map((N,K)=>!N.x||!N.y?{...N,x:L.x+2*K,y:L.y+2*K}:N);v(W,$),r()},[t,v,r]),D=d.useCallback((T,$)=>{j([T],$)},[j]),A=d.useCallback(T=>{s(T),h(T)},[s,h]),B=d.useCallback(T=>{const $=u();return T.map(L=>$[L])},[u]),V=d.useCallback(({target:T,clientX:$,clientY:L},{returnLocked:W=!1,passLocked:N=!1}={})=>{if(["INPUT","TEXTAREA"].includes(T.tagName))return null;const K=Oe(T,"item");if(K){if(ve(K,"selected"))return K;if(!N&&ve(K,"locked")&&!ve(T,"passthrough"))return W?K:null;if(ve(T,"passthrough")){const Q=l(),{boardWrapper:re}=c(),ne=Q.reduce((oe,H)=>{const te=ze(re,H),pe=te.getBoundingClientRect();return et({x:$,y:L},pe)&&oe.unshift(te),oe},[]);for(let oe=0;oe<ne.length;oe+=1){const H=ne[oe];if(H!==K&&(N||!ve(H,"locked")))return H}return null}}return K},[c,l]);return{putItemsOnTop:p,batchUpdateItems:I,updateItemOrder:y,moveItems:x,placeItems:g,updateItem:w,swapItems:M,reverseItemsOrder:k,setItemList:E,pushItem:D,pushItems:j,removeItems:A,getItemList:S,findElementUnderPointer:V,getItems:B}};var Fr=function e(t,r){if(t===r)return!0;if(t&&r&&typeof t=="object"&&typeof r=="object"){if(t.constructor!==r.constructor)return!1;var n,o,s;if(Array.isArray(t)){if(n=t.length,n!=r.length)return!1;for(o=n;o--!==0;)if(!e(t[o],r[o]))return!1;return!0}if(t instanceof Map&&r instanceof Map){if(t.size!==r.size)return!1;for(o of t.entries())if(!r.has(o[0]))return!1;for(o of t.entries())if(!e(o[1],r.get(o[0])))return!1;return!0}if(t instanceof Set&&r instanceof Set){if(t.size!==r.size)return!1;for(o of t.entries())if(!r.has(o[0]))return!1;return!0}if(ArrayBuffer.isView(t)&&ArrayBuffer.isView(r)){if(n=t.length,n!=r.length)return!1;for(o=n;o--!==0;)if(t[o]!==r[o])return!1;return!0}if(t.constructor===RegExp)return t.source===r.source&&t.flags===r.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===r.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===r.toString();if(s=Object.keys(t),n=s.length,n!==Object.keys(r).length)return!1;for(o=n;o--!==0;)if(!Object.prototype.hasOwnProperty.call(r,s[o]))return!1;for(o=n;o--!==0;){var c=s[o];if(!e(t[c],r[c]))return!1}return!0}return t!==t&&r!==r};function Kr(e,t,r,n=0){d.useEffect(nt(e,t,r,n),t)}const Hr=(e,t)=>{if(e.type in t){const r=t[e.type].defaultActions;return typeof r=="function"?r(e):r}return[]},Rt=(e,t)=>{const{actions:r=Hr(e,t)}=e;return r.map(n=>typeof n=="string"?{name:n}:n)},qr=()=>{const[e,t]=ie(a=>[a.items,a.getItems]),[r,n,o]=Z(a=>[a.config.itemTemplates,a.selection,a.getSelection]),[s,c]=d.useState([]),u=d.useRef(!1),[,l]=d.useTransition();d.useEffect(()=>(u.current=!0,()=>{u.current=!1}),[]);const m=d.useCallback(a=>{const h=t();if(a)return[a,a.map(v=>h[v])];const S=o();return[S,S.map(v=>h[v])]},[t,o]),f=d.useCallback(()=>{const[a,h]=m();if(a.length>0){if(!u.current)return;const S=h.reduce((v,b)=>{const I=Rt(b,r);return v.filter(E=>I.some(w=>Fr(E,w)))},Rt(h[0],r));l(()=>{c(S)})}else l(()=>{c([])})},[m,r]);return Kr(()=>f(),[e,n,f],100),{availableActions:s}},Gr=()=>{const[e]=Z(t=>[t.selectionBox]);return e};let ge=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce((t,r)=>(r&=63,r<36?t+=r.toString(36):r<62?t+=(r-26).toString(36).toUpperCase():r>62?t+="-":t+="_",t),"");const $t=d.createContext(),ot=e=>{localStorage.setItem("user",JSON.stringify(e))},Jr=()=>{if(localStorage.user){const t={name:"Player",color:Ot(),uid:ge(),...JSON.parse(localStorage.user)};return ot(t),t}const e={name:"Player",color:Ot(),uid:ge()};return ot(e),e},Zr=e=>(t,r)=>({isSpaceMaster:!1,users:{},getUser:()=>r().users[e],getUsers:()=>r().users,getUserList:()=>Object.values(r().users),getLocalUsers:()=>{if(!r().users[e])return[];const{space:n}=r().users[e];return r().getUserList().filter(({space:o})=>o===n)},addUser:n=>t(o=>({users:{...o.users,[n.id]:n}})),updateUser:(n,o)=>t(s=>{if(!s.users[n])return{};const c={...s.users[n],...o,id:n,uid:s.users[n].uid};return c.id===e&&ot(c),setTimeout(()=>r().electSpaceMaster(),100),{users:{...s.users,[n]:c}}}),removeUser:n=>t(o=>{const s={...o.users};return delete s[n],setTimeout(()=>r().electSpaceMaster(),100),{users:s}}),updateCurrentUser:n=>r().updateUser(e,n),joinSpace:n=>r().updateUser(e,{space:n,spaceJoinedTimestamp:Date.now()}),electSpaceMaster:()=>{const n=r().getLocalUsers(),o={uid:null,timestamp:Date.now()};Object.values(n).forEach(({spaceJoinedTimestamp:s,id:c})=>{s<o.timestamp&&(o.id=c,o.timestamp=s)}),t({isSpaceMaster:o.id===e})}}),Qr=e=>({cursors:{},moveCursor:(t,r)=>e(n=>({cursors:{...n.cursors,[t]:r}})),removeCursor:t=>e(r=>{const n={...r.cursors};return delete n[t],{cursors:n}})}),At=({storeName:e,children:t})=>{const{wire:r,isMaster:n}=Ie("room"),[o,s]=d.useState(null),[c,u]=d.useState(!1),l=d.useRef(!1);return d.useEffect(()=>{let m=!0;const f=[];if(!o&&!l.current)return l.current=!0,(()=>{const h=je(tt({wire:r,storeName:e,noSync:["updateCurrentUser","joinSpace","isSpaceMaster","electSpaceMaster"]},(...v)=>({...Zr(r.userId)(...v),...Qr(...v)}))),S=h.subscribe(v=>{v.ready&&(S(),m&&s(h))})})(),()=>{m=!1,l.current=!1,f.forEach(h=>h())}},[o,e,r,r.userId]),d.useEffect(()=>{if(o)return o.getState().addUser({...Jr(),id:r.userId}),u(!0),()=>{o.getState().removeUser(r.userId)}},[n,o,r]),d.useEffect(()=>{if(o){const m=r.subscribe("userLeave",f=>{o.getState().removeUser(f)});return()=>{m()}}},[n,o,r]),d.useEffect(()=>{n&&o&&o.getState().updateCurrentUser({isMaster:n})},[n,o,r]),c?P($t.Provider,{value:o,children:t}):null},Se=(e,t)=>{const r=d.useContext($t);return $e(r,e,t||Ye)},en=()=>{const[e,t,r,n,o]=Se(u=>[u.isSpaceMaster,u.getUser(),u.users,u.updateCurrentUser,u.joinSpace]),s=d.useMemo(()=>Object.values(r),[r]),c=d.useMemo(()=>{const{space:u}=t;return s.filter(({space:l})=>l===u)},[t,s]);return{isSpaceMaster:e,currentUser:t,updateCurrentUser:n,users:s,localUsers:c,joinSpace:o}},tn=()=>{const[e,t,r]=ie(o=>[o.boardConfig,o.getBoardConfig,o.setBoardConfig]),n=d.useCallback(o=>{let s=o;typeof o=="object"&&(s=()=>o);const c=t(),u=s(c);r(u)},[t,r]);return[e,n]},rn=()=>{const[e]=Z(t=>[t.boardState]);return e},nn=()=>{const[e,t,r,n]=ie(o=>[o.getSessionInfo,o.setSessionInfo,o.updateSessionInfo,o.session]);return{getSessionInfo:e,setSessionInfo:t,sessionInfo:n,updateSessionInfo:r}},Lt=d.createContext(),on=({user:{name:e,uid:t,color:r},content:n})=>({type:"message",user:{name:e,uid:t,color:r},content:n,uid:ge(),timestamp:new Date().toISOString()}),sn=(e,t)=>({messages:[],setMessages:r=>e({messages:r.map(n=>({...n,timestamp:Date.parse(n.timestamp)}))}),addMessage:r=>e(n=>({messages:[...n.messages,{...r,timestamp:Date.parse(r.timestamp)}]})),sendMessage:(r,n)=>{const o=on({user:r,content:n});o&&t().addMessage(o)}}),zt=({storeName:e,children:t,defaultValue:r=[]})=>{const{wire:n}=Ie("room"),[o]=d.useState(()=>je(tt({wire:n,storeName:e,defaultValue:r,noSync:["sendMessage"]},(...s)=>({...sn(...s)}))));return P(Lt.Provider,{value:o,children:t})},an=(e,t)=>{const r=d.useContext(Lt);return $e(r,e,t||Ye)},cn=()=>{},un=(e=cn)=>{const t=Se(c=>c.getUser()),[r,n,o]=an(c=>[c.messages,c.setMessages,c.sendMessage]);d.useEffect(()=>{r.length&&e()},[r,e]);const s=d.useCallback(c=>{o(t,c)},[t,o]);return{messages:r,setMessages:n,sendMessage:s}},Yt=({children:e,session:t})=>{const r=Se(n=>n.joinSpace);return d.useEffect(()=>(r(t),()=>{r(null)}),[r,t]),e},ln=({socket:e,room:t,session:r,items:n=[],messages:o=[],LoadingComponent:s,...c})=>{const[u]=d.useState(t||ge()),[l]=d.useState(r||ge()),[m]=d.useState(()=>({itemIds:n.map(({id:a})=>a),items:Object.fromEntries(n.map(a=>[a.id,a]))}));return Ie("room")?P(zt,{storeName:`${l}_messages`,defaultValue:o,children:P(Dt,{children:P(kt,{storeName:`${l}_item`,defaultValue:m,children:P(Yt,{...c,session:l})})})}):P(ht,{room:u,channel:"room",socket:e,LoadingComponent:s,children:P(At,{storeName:`${u}_users`,children:P(zt,{storeName:`${l}_messages`,defaultValue:o,children:P(Dt,{children:P(kt,{storeName:`${l}_item`,defaultValue:m,children:P(Yt,{...c,session:l})})})})})})},fn=({socket:e,room:t,children:r,LoadingComponent:n})=>{const[o]=d.useState(t||ge());return P(ht,{room:o,channel:"room",socket:e,LoadingComponent:n,children:P(At,{storeName:`${o}_users`,children:r})})},st=()=>{const e=navigator.userAgent.toLowerCase();return/mac os ?x 10/.test(e)},dn=(()=>{const e=document.createElement("iframe");e.src="#",document.body.appendChild(e);const t=e.contentWindow.document;t.open(),t.write("<!DOCTYPE html><html><head></head><body><span>a</span></body></html>"),t.close();const r=t.body.firstElementChild.offsetHeight;return document.body.removeChild(e),r})(),pn=800,Bt=(e,t)=>{const r=Object.keys(e).map(n=>Number(n)).find(n=>n!==t);return e[r]},Nt=([e,t],[r,n])=>{const o=Math.abs(e-r),s=Math.abs(t-n);return Math.hypot(o,s)},he=()=>{},mn=e=>t=>{const{event:r}=t;return r.isPropagationStopped()?null:e(t)},gn=e=>async(...t)=>{try{await e(...t)}catch(r){console.error(r)}};class hn{constructor(){ar(this,"lastPromise",Promise.resolve(!0))}add(t,...r){return new Promise((n,o)=>{this.lastPromise=this.lastPromise.then(()=>mn(gn(t))(...r)).then(n).catch(o)})}}const ae=new hn,Ne=({children:e,onDrag:t=he,onDragStart:r=he,onDragEnd:n=he,onPan:o=he,onTap:s=he,onLongTap:c=he,onDoubleTap:u=he,onZoom:l,mainAction:m="drag"})=>{const f=d.useRef(null),a=d.useRef({moving:!1,pointers:{},mainPointer:void 0}),h=E=>{const{deltaX:w,deltaY:x,clientX:p,clientY:C,deltaMode:g,ctrlKey:y,altKey:k,metaKey:M,target:j}=E;if(!(k||y&&!st()))if(st()&&!y)ae.add(o,{deltaX:-2*w,deltaY:-2*x,button:1,ctrlKey:y,metaKey:M,target:j,event:E});else{if(l===void 0||!x)return;let D=x;switch(g){case 1:D*=dn;break;case 2:D*=pn;break}st()&&(D*=2),ae.add(l,{scale:D,clientX:p,clientY:C,event:E})}},S=E=>{const{target:w,button:x,clientX:p,clientY:C,pointerId:g,altKey:y,ctrlKey:k,metaKey:M,isPrimary:j}=E;if(a.current.pointers[g]={clientX:p,clientY:C},j&&(a.current.mainPointer=void 0),a.current.mainPointer!==void 0){if(a.current.mainPointer!==g)try{const{clientX:D,clientY:A}=Bt(a.current.pointers,g),B=(D+p)/2,V=(A+C)/2,T=Nt([D,A],[p,C]);Object.assign(a.current,{pressed:!0,moving:!1,gestureStart:!1,startX:p,startY:C,prevX:B,prevY:V,startDistance:T,prevDistance:T})}catch(D){console.log("Error while getting other pointer. Ignoring",D),a.current.mainPointer}return}a.current.mainPointer=g,Object.assign(a.current,{pressed:!0,moving:!1,gestureStart:!1,startX:p,startY:C,prevX:p,prevY:C,currentButton:x,pointerDownEvent:E,startDistance:0,prevDistance:0,target:w,timeStart:Date.now(),longTapTimeout:setTimeout(async()=>{a.current.noTap=!0,ae.add(c,{clientX:p,clientY:C,altKey:y,ctrlKey:k,metaKey:M,target:w,event:E})},750)});try{w.setPointerCapture(g)}catch(D){console.log("Fail to capture pointer",D)}},v=E=>{if(a.current.pressed){const{pointerId:w,clientX:x,clientY:p,altKey:C,shiftKey:g,ctrlKey:y,metaKey:k,buttons:M}=E;a.current.pointers[w]={clientX:x,clientY:p},a.current.moving=!0;const j=Object.keys(a.current.pointers).length===2;let D,A,B=0;if(j){const{clientX:L,clientY:W}=Bt(a.current.pointers,w);D=(L+x)/2,A=(W+p)/2,B=Nt([L,W],[x,p])}else D=x,A=p;let V=g||C||y||k||M!==1;m!=="drag"&&(V=!V);const T=!V,$=V;if(T){a.current.gestureStart||(f.current.style.cursor="move",a.current.gestureStart=!0,clearTimeout(a.current.longTapTimeout),ae.add(r,{deltaX:0,deltaY:0,startX:a.current.startX,startY:a.current.startY,clientX:a.current.startX,clientY:a.current.startY,distanceX:0,distanceY:0,button:a.current.currentButton,altKey:C,shiftKey:g,ctrlKey:y,metaKey:k,target:a.current.target,event:a.current.pointerDownEvent}));const L=D-a.current.prevX,W=A-a.current.prevY,N=D-a.current.startX,K=A-a.current.startY;ae.add(t,{deltaX:L,deltaY:W,startX:a.current.startX,startY:a.current.startY,clientX:D,clientY:A,distanceX:N,distanceY:K,button:a.current.currentButton,altKey:C,shiftKey:g,ctrlKey:y,metaKey:k,target:a.current.target,event:E})}if($){a.current.gestureStart||(f.current.style.cursor="move",a.current.gestureStart=!0,clearTimeout(a.current.longTapTimeout));const L=D-a.current.prevX,W=A-a.current.prevY,{target:N}=a.current;if(ae.add(o,{deltaX:L,deltaY:W,button:a.current.currentButton,altKey:C,shiftKey:g,ctrlKey:y,metaKey:k,target:N,event:E}),B!==a.current.prevDistance&&l){const K=a.current.prevDistance-B;Math.abs(K)>0&&(ae.add(l,{scale:K*3,clientX:D,clientY:A,event:E}),a.current.prevDistance=B)}}a.current.prevX=D,a.current.prevY=A}},b=E=>{const{clientX:w,clientY:x,altKey:p,shiftKey:C,ctrlKey:g,metaKey:y,target:k,pointerId:M}=E;if(a.current.pointers[M]){if(delete a.current.pointers[M],a.current.mainPointer!==M){const{clientX:j,clientY:D}=a.current.pointers[a.current.mainPointer];Object.assign(a.current,{prevX:j,prevY:D,prevDistance:0,startDistance:0});return}for(;Object.keys(a.current.pointers).length>0;){a.current.mainPointer=Number(Object.keys(a.current.pointers)[0]);try{a.current.target.setPointerCapture(a.current.mainPointer);const{clientX:j,clientY:D}=a.current.pointers[a.current.mainPointer];Object.assign(a.current,{prevX:j,prevY:D,prevDistance:0,startDistance:0});return}catch(j){console.log("Fails to set pointer capture",j),a.current.mainPointer=void 0,delete a.current.pointers[Object.keys(a.current.pointers)[0]]}}if(a.current.mainPointer=void 0,a.current.pressed=!1,clearTimeout(a.current.longTapTimeout),a.current.moving)a.current.moving=!1,ae.add(n,{deltaX:w-a.current.prevX,deltaY:x-a.current.prevY,startX:a.current.startX,startY:a.current.startY,clientX:w,clientY:x,distanceX:w-a.current.startX,distanceY:x-a.current.startY,button:a.current.currentButton,altKey:p,shiftKey:C,ctrlKey:g,metaKey:y,event:E}),f.current.style.cursor="auto";else{const j=Date.now();a.current.noTap?a.current.noTap=!1:a.current.timeStart-j<300&&ae.add(s,{clientX:w,clientY:x,altKey:p,shiftKey:C,ctrlKey:g,metaKey:y,target:k,event:E})}}};return P("div",{onWheel:h,onPointerDown:S,onPointerMove:v,onPointerUp:b,onPointerOut:b,onPointerLeave:b,onPointerCancel:b,onDoubleClick:E=>{const{clientX:w,clientY:x,altKey:p,shiftKey:C,ctrlKey:g,metaKey:y,target:k}=E;ae.add(u,{clientX:w,clientY:x,altKey:p,shiftKey:C,ctrlKey:g,metaKey:y,target:k,event:E})},style:{touchAction:"none"},ref:f,children:e})},it=({onResize:e,...t})=>{const[r]=Z(o=>[o.getBoardState]);return P(Ne,{onDrag:({deltaX:o,deltaY:s,event:c})=>{c.stopPropagation();const{scale:u}=r();e({width:o/u,height:s/u})},children:P("div",{...t})})};let vn={data:""},yn=e=>typeof window=="object"?((e?e.querySelector("#_goober"):window._goober)||Object.assign((e||document.head).appendChild(document.createElement("style")),{innerHTML:" ",id:"_goober"})).firstChild:e||vn,Sn=/(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g,_n=/\/\*[^]*?\*\/| +/g,Xt=/\n+/g,de=(e,t)=>{let r="",n="",o="";for(let s in e){let c=e[s];s[0]=="@"?s[1]=="i"?r=s+" "+c+";":n+=s[1]=="f"?de(c,s):s+"{"+de(c,s[1]=="k"?"":t)+"}":typeof c=="object"?n+=de(c,t?t.replace(/([^,])+/g,u=>s.replace(/(^:.*)|([^,])+/g,l=>/&/.test(l)?l.replace(/&/g,u):u?u+" "+l:l)):s):c!=null&&(s=/^--/.test(s)?s:s.replace(/[A-Z]/g,"-$&").toLowerCase(),o+=de.p?de.p(s,c):s+":"+c+";")}return r+(t&&o?t+"{"+o+"}":o)+n},ue={},Ut=e=>{if(typeof e=="object"){let t="";for(let r in e)t+=r+Ut(e[r]);return t}return e},bn=(e,t,r,n,o)=>{let s=Ut(e),c=ue[s]||(ue[s]=(l=>{let m=0,f=11;for(;m<l.length;)f=101*f+l.charCodeAt(m++)>>>0;return"go"+f})(s));if(!ue[c]){let l=s!==e?e:(m=>{let f,a,h=[{}];for(;f=Sn.exec(m.replace(_n,""));)f[4]?h.shift():f[3]?(a=f[3].replace(Xt," ").trim(),h.unshift(h[0][a]=h[0][a]||{})):h[0][f[1]]=f[2].replace(Xt," ").trim();return h[0]})(e);ue[c]=de(o?{["@keyframes "+c]:l}:l,r?"":"."+c)}let u=r&&ue.g?ue.g:null;return r&&(ue.g=ue[c]),((l,m,f,a)=>{a?m.data=m.data.replace(a,l):m.data.indexOf(l)===-1&&(m.data=f?l+m.data:m.data+l)})(ue[c],t,n,u),c},En=(e,t,r)=>e.reduce((n,o,s)=>{let c=t[s];if(c&&c.call){let u=c(r),l=u&&u.props&&u.props.className||/^go/.test(u)&&u;c=l?"."+l:u&&typeof u=="object"?u.props?"":de(u,""):u===!1?"":u}return n+o+(c??"")},"");function q(e){let t=this||{},r=e.call?e(t.p):e;return bn(r.unshift?r.raw?En(r,[].slice.call(arguments,1),t.p):r.reduce((n,o)=>Object.assign(n,o&&o.call?o(t.p):o),{}):r,yn(t.target),t.g,t.o,t.k)}q.bind({g:1}),q.bind({k:1});function Cn(e,t,r,n){de.p=t}var wn=function e(t,r){if(t===r)return!0;if(t&&r&&typeof t=="object"&&typeof r=="object"){if(t.constructor!==r.constructor)return!1;var n,o,s;if(Array.isArray(t)){if(n=t.length,n!=r.length)return!1;for(o=n;o--!==0;)if(!e(t[o],r[o]))return!1;return!0}if(t.constructor===RegExp)return t.source===r.source&&t.flags===r.flags;if(t.valueOf!==Object.prototype.valueOf)return t.valueOf()===r.valueOf();if(t.toString!==Object.prototype.toString)return t.toString()===r.toString();if(s=Object.keys(t),n=s.length,n!==Object.keys(r).length)return!1;for(o=n;o--!==0;)if(!Object.prototype.hasOwnProperty.call(r,s[o]))return!1;for(o=n;o--!==0;){var c=s[o];if(!e(t[c],r[c]))return!1}return!0}return t!==t&&r!==r};const xn=q`
|
|
60
60
|
display: inline-block;
|
|
61
61
|
transition: transform 150ms;
|
|
62
62
|
user-select: none;
|
|
63
63
|
padding: 2px;
|
|
64
64
|
box-sizing: border-box;
|
|
65
|
-
`,
|
|
65
|
+
`,In=q`
|
|
66
66
|
border: 2px dashed #db5034;
|
|
67
67
|
padding: 0px;
|
|
68
68
|
cursor: pointer;
|
|
@@ -70,22 +70,22 @@ Check the top-level render call using <`+O+">.")}return y}}function nr(i,y){{if(
|
|
|
70
70
|
position: absolute;
|
|
71
71
|
width: 0px;
|
|
72
72
|
height: 0px;
|
|
73
|
-
`,
|
|
73
|
+
`,On=q`
|
|
74
74
|
top: 0;
|
|
75
75
|
left: 0;
|
|
76
|
-
`,
|
|
76
|
+
`,Tn=q`
|
|
77
77
|
top: 0;
|
|
78
78
|
right: 0;
|
|
79
|
-
`,
|
|
79
|
+
`,kn=q`
|
|
80
80
|
bottom: 0;
|
|
81
81
|
left: 0;
|
|
82
|
-
`,
|
|
82
|
+
`,Pn=q`
|
|
83
83
|
bottom: 0;
|
|
84
84
|
right: 0;
|
|
85
|
-
`,
|
|
85
|
+
`,Mn=q`
|
|
86
86
|
top: 50%;
|
|
87
87
|
left: 50%;
|
|
88
|
-
`,
|
|
88
|
+
`,at=q`
|
|
89
89
|
position: absolute;
|
|
90
90
|
|
|
91
91
|
width: 10px;
|
|
@@ -93,17 +93,17 @@ Check the top-level render call using <`+O+">.")}return y}}function nr(i,y){{if(
|
|
|
93
93
|
border: 2px solid #db5034;
|
|
94
94
|
background-color: #db5034;
|
|
95
95
|
cursor: move;
|
|
96
|
-
`,
|
|
96
|
+
`,Dn=q`
|
|
97
97
|
cursor: ew-resize;
|
|
98
98
|
right: -6px;
|
|
99
99
|
top: calc(50% - 5px);
|
|
100
|
-
`,
|
|
100
|
+
`,jn=q`
|
|
101
101
|
cursor: ns-resize;
|
|
102
102
|
bottom: -6px;
|
|
103
103
|
left: calc(50% - 5px);
|
|
104
|
-
`,
|
|
104
|
+
`,Rn=q`
|
|
105
105
|
cursor: nwse-resize;
|
|
106
106
|
bottom: -6px;
|
|
107
107
|
right: -6px;
|
|
108
|
-
`,Pn=({onReload:e})=>ce("div",{className:`syncboard-error-item ${q({width:"100px",display:"flex",flexDirection:"column",justifyContent:"center",textAlign:"center",color:"red"})}`,children:["Sorry, this item seems broken.",k("button",{onClick:e,children:"Reload it"})]});class Mn extends f.Component{constructor(t){super(t),this.state={hasError:!1,itemId:t.itemId},this.onReload=this.onReload.bind(this)}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(t){console.error(`Error for item ${this.state.itemId}`,t,this.props.state)}onReload(){this.setState({hasError:!1})}render(){const{ErrorComponent:t}=this.props;return this.state.hasError?k(t,{onReload:this.onReload}):this.props.children}}const jn=e=>{e.target.className=""},Rn=({width:e,height:t,actualWidth:r,actualHeight:n,prevState:o,keepRatio:s})=>{let{width:a,height:u}=o;if([a,u]=[parseFloat(a),parseFloat(u)],(!a||Number.isNaN(Number(a)))&&(a=r),(!u||Number.isNaN(Number(u)))&&(u=n),s){const l=a/u;return{...o,width:(a+e).toFixed(1),height:(u+t/l).toFixed(1)}}return{...o,width:(a+e).toFixed(1),height:(u+t).toFixed(1)}},Dn={w:!0,h:!0,b:!0},$n=({setState:e,state:{type:t,rotation:r=0,id:n,locked:o,extraClasses:s,...a}={},animate:u="hvr-pop",isSelected:l,itemMap:m,showResizeHandle:d=!0})=>{var w;const c=f.useRef(null),{component:_=()=>null,resizeDirections:b=Dn,resize:C=Rn}=m[t],h=f.useCallback(g=>e(n,g),[e,n]);f.useEffect(()=>{c.current.className=u},[u]);const S=["item",n,bn];o&&S.push("locked"),l&&(S.push("selected"),S.push(_n));const E=S.join(" "),x=({width:g=0,height:P=0,keepRatio:M})=>{h(j=>{const{offsetWidth:$,offsetHeight:Y}=c.current;return C({prevState:j,width:g,height:P,actualHeight:Y,actualWidth:$,keepRatio:M})})},v=({width:g})=>{x({width:g})},p=({height:g})=>{x({height:g})},I=({width:g})=>{x({height:g,width:g,keepRatio:!0})};return k("div",{style:{transform:`rotate(${r}deg`},"data-id":n,className:E,children:ce("div",{style:{display:"flex"},ref:c,onAnimationEnd:jn,onKeyDown:g=>g.stopPropagation(),onKeyUp:g=>g.stopPropagation(),children:[k(Mn,{itemId:n,state:a,ErrorComponent:((w=m==null?void 0:m.error)==null?void 0:w.component)||Pn,children:k(_,{...a,id:n,setState:h})}),k("div",{className:`corner ${ke} ${En}`}),k("div",{className:`corner ${ke} ${wn}`}),k("div",{className:`corner ${ke} ${xn}`}),k("div",{className:`corner ${ke} ${Cn}`}),k("div",{className:`center ${ke} ${In}`}),d&&ce(pt,{children:[b.b&&k(ot,{className:`${st} ${kn}`,onResize:I}),b.h&&k(ot,{className:`${st} ${Tn}`,onResize:p}),b.w&&k(ot,{className:`${st} ${On}`,onResize:v})]})]})})},An=f.memo($n,({state:e,setState:t,isSelected:r,showResizeHandle:n},{state:o,setState:s,isSelected:a,showResizeHandle:u})=>r===a&&n===u&&t===s&&Sn(e,o)),Ln=e=>e,zn=({state:e={},getCurrentUser:t,className:r,...n})=>{if(!n.itemMap[e.type])return null;const{stateHook:o=Ln}=n.itemMap[e.type],{x:s=0,y:a=0,layer:u=0,moving:l,...m}=o(e,{getCurrentUser:t}),d=(u+4)*10+100+(l?5:0);return k("div",{className:r,style:{transform:`translate(${s}px, ${a}px)`,zIndex:d},children:k(An,{...n,showResizeHandle:n.isSelected&&n.showResizeHandle,state:m})})},Bn=f.memo(zn),Yn=()=>{const{updateItem:e}=Be(),[t,r]=ie(m=>[m.itemIds,m.items]),[n,o,s,a]=Q(m=>[m.config.boardSize,m.config.showResizeHandle,m.config.itemTemplates,m.selection]),[u]=he(m=>[m.getUser]),l=q({position:"absolute",top:`${n/2}px`,left:`${n/2}px`,display:"inline-block"});return t.map(m=>k(Bn,{state:r[m],setState:e,isSelected:a.includes(m),itemMap:s,boardSize:n,getCurrentUser:u,showResizeHandle:o,className:l},m))};function Nn(e=!1){const t=f.useRef(e),r=f.useCallback(()=>t.current,[]);return f.useEffect(()=>(t.current=!0,()=>{t.current=!1}),[]),r}function Un(e,...t){e&&e.addEventListener&&e.addEventListener(...t)}function Xn(e,...t){e&&e.removeEventListener&&e.removeEventListener(...t)}const Wn=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);function le(e,...t){const r=Nn(),n=et(t[1]),o=f.useMemo(()=>function(...s){r()&&(typeof n.current=="function"?n.current.apply(this,s):typeof n.current.handleEvent=="function"&&n.current.handleEvent.apply(this,s))},[]);f.useEffect(()=>{const s=e&&Wn(e,"current")?e.current:e;if(!s)return;const a=t.slice(2);return Un(s,t[0],o,...a),()=>Xn(s,t[0],o,...a)},[e,t[0]])}const Vn=q({zIndex:210,position:"absolute",backgroundColor:"hsla(0, 40%, 50%, 10%)",border:"2px solid hsl(0, 55%, 40%)"}),Fn=(e,t,r=!1)=>{const n=t.getElementsByClassName("selector");if(!n.length)return[];const o=n[0];return Array.from(t.getElementsByClassName("item")).filter(s=>{const a=Te(s),u=e[a];return!u||!r&&u.locked?!1:Cr(s,o)}).map(s=>Te(s))},Kn=({children:e,moveFirst:t})=>{const[r,n,o,s,a,u,l]=Q(g=>[g.getSelection,g.clear,g.setSelection,g.select,g.getConfiguration,g.getBoardState,g.updateBoardState]),{findElementUnderPointer:m}=Be(),[d]=ie(g=>[g.getItems]),[c,_]=f.useState({}),[,b]=f.useTransition(),[C,h]=f.useState(!1),S=f.useRef(null),E=f.useRef({moving:!1});return le(document,"keydown",g=>{g.key==="l"&&h(!0)}),le(document,"keyup",g=>{g.key==="l"&&h(!1)}),f.useEffect(()=>(n(),()=>{n()}),[n]),f.useEffect(()=>{if(E.current.moving){const g=d(),{boardWrapper:P}=a(),M=Fn(g,P,C);b(()=>{o(M)})}},[a,d,c,o,C]),k(Ye,{onDragStart:async g=>{await m(g)||(E.current.moving=!0,b(()=>{l({selecting:!0})}),S.current.style.cursor="crosshair")},onDrag:({distanceY:g,distanceX:P,startX:M,startY:j})=>{if(E.current.moving){const{top:$,left:Y}=S.current.getBoundingClientRect(),{scale:N}=u(),H=(M-Y)/N,T=(j-$)/N,D=P/N,A=g/N;D>0?(E.current.left=H,E.current.width=D):(E.current.left=H+D,E.current.width=-D),A>0?(E.current.top=T,E.current.height=A):(E.current.top=T+A,E.current.height=-A),_({...E.current,moving:!0})}},onDragEnd:()=>{E.current.moving&&(b(()=>{l({selecting:!1})}),E.current.moving=!1,_({moving:!1}),S.current.style.cursor="auto")},onTap:g=>{const{target:P,ctrlKey:M,metaKey:j}=g,$=m(g);if(!$&&Oe(P,"board"))n();else{const Y=Te($);if(!Y){n();return}const N=r();$&&!N.includes(Y)&&(M||j?s([Y]):o([Y]))}},onLongTap:({target:g})=>{const P=Oe(g,"item");if(P){const M=Te(P);o([M])}},mainAction:t?"pan":"drag",children:ce("div",{ref:S,children:[c.moving&&k("div",{style:{transform:`translate(${c.left}px, ${c.top}px)`,height:`${c.height}px`,width:`${c.width}px`},className:`selector ${Vn}`}),e]})})},Hn=({children:e})=>{const{moveItems:t,placeItems:r,findElementUnderPointer:n}=Be(),[o,s,a,u,l]=Q(S=>[S.select,S.setSelection,S.getSelection,S.getBoardState,S.updateBoardState]),[m]=ie(S=>[S.getBoardConfig]),d=f.useRef({}),c=f.useRef({items:[]}),_=S=>{const{ctrlKey:E,metaKey:x,event:v}=S,p=n(S);if(p){v.stopPropagation();const I=a();c.current.items=I;const w=Te(p);I.includes(w)||(E||x?(c.current.items=[...I,w],o([w])):(c.current.items=[w],s([w]))),Object.assign(d.current,{moving:!0,remainX:0,remainY:0})}},b=({deltaX:S,deltaY:E,event:x})=>{if(d.current.moving){x.stopPropagation();const{scale:v,movingItems:p}=u(),I=d.current.remainX+S/v,w=d.current.remainY+E/v;t(c.current.items,{x:I,y:w},!0),p||l({movingItems:!0})}},C=()=>{if(d.current.moving){const{gridSize:S=1}=m(),E=S||1;d.current={moving:!1},r(c.current.items,{type:"grid",size:E}),l({movingItems:!1})}};return le(document,"keydown",S=>{if(["INPUT","TEXTAREA"].includes(S.target.tagName))return;const E=a();if(E.length){const{gridSize:x=1}=m();let v=0,p=0;switch(S.key){case"ArrowLeft":v=-10;break;case"ArrowRight":v=10;break;case"ArrowUp":p=-10;break;case"ArrowDown":p=10;break}(v||p)&&(S.shiftKey&&(v*=5,p*=5),(S.ctrlKey||S.altKey||S.metaKey)&&(v/=10,p/=10),t(E,{x:v,y:p},!0),r(E,{type:"grid",size:x||1}),S.preventDefault())}}),k(Ye,{onDragStart:_,onDrag:b,onDragEnd:C,children:e})},qn=e=>{const t=f.useRef({hover:!1,x:0,y:0});return le(e.current,"mousemove",n=>{const{clientX:o,clientY:s}=n;t.current.x=o,t.current.y=s}),le(e.current,"mouseenter",()=>{t.current.hover=!0}),le(e.current,"mouseleave",()=>{t.current.hover=!1}),f.useCallback(()=>t.current,[])},Gn=[...Array(5).keys()].map(e=>`Digit${e+1}`),Jn=()=>{const[e,t]=f.useState({}),[r,n]=Q(o=>[o.getBoardState,o.updateBoardState]);return le(document,"keydown",o=>{if(!["INPUT","TEXTAREA"].includes(o.target.tagName)&&Gn.includes(o.code)){const s=o.code,{translateX:a,translateY:u,scale:l}=r();o.altKey||o.metaKey||o.ctrlKey||o.shiftKey?t(m=>({...m,[s]:{translateX:a,translateY:u,scale:l}})):e[s]&&n(e[s]),o.preventDefault()}}),null},Zn=({children:e,moveFirst:t=!1})=>{const r=f.useRef(null),[n,o,s,a,u]=Q(p=>[{translateX:p.boardState.translateX,translateY:p.boardState.translateY,scale:p.boardState.scale},p.config.itemExtent,p.getConfiguration,p.updateBoardState,p.getSelection]),{setDim:l,zoomToCenter:m,zoomToExtent:d}=ze(),[c,_]=f.useState(!1),b=f.useRef({}),C=qn(r);Jn();const h=f.useCallback(()=>{const{itemExtent:p}=s();d(p)},[s,d]);f.useEffect(()=>{!c&&o.left&&(h(),_(!0))},[h,c,o]);const S=({clientX:p,clientY:I,scale:w})=>{m(1-w/500,{x:p,y:I}),clearTimeout(b.current.zoom),b.current.zoom=setTimeout(()=>{a({zooming:!1})},200),a({zooming:!0})},E=({deltaX:p,deltaY:I})=>{l(w=>({...w,translateX:w.translateX+p,translateY:w.translateY+I})),clearTimeout(b.current.pan),b.current.pan=setTimeout(()=>{a({panning:!1})},200),a({panning:!0})},x=p=>{if(["INPUT","TEXTAREA"].includes(p.target.tagName))return;let I=0,w=0,g=1;switch(p.key){case"ArrowLeft":I=-10;break;case"ArrowRight":I=10;break;case"ArrowUp":w=-10;break;case"ArrowDown":w=10;break;case"PageUp":g=1.2;break;case"PageDown":g=.8;break}if(I||w||g!==1){const P=u();if(g===1&&P.length)return;p.shiftKey&&(I*=5,w*=5),(p.ctrlKey||p.altKey||p.metaKey)&&(I/=5,w/=5),l(M=>({...M,translateY:M.translateY+w,translateX:M.translateX+I})),m(g),p.preventDefault()}p.key===" "&&!p.repeat&&C().hover&&m(3,C())},v=p=>{["INPUT","TEXTAREA"].includes(p.target.tagName)||p.key===" "&&C().hover&&m(1/3,C())};return le(document,"keydown",x),le(document,"keyup",v),k(Ye,{onPan:E,onZoom:S,mainAction:t?"pan":"drag",children:k("div",{style:{display:"inline-block",transformOrigin:"top left",transform:`translate(${n.translateX}px, ${n.translateY}px) scale(${n.scale})`},className:`board-pane${n.scale<.5?" board-pane__far":""}`,ref:r,children:e})})},Qn=q({position:"absolute",top:0,left:0,zIndex:210,backgroundColor:"hsla(0, 40%, 50%, 0%)",border:"2px dashed hsl(20, 55%, 40%)",pointerEvents:"none"}),eo=()=>{const[e,t,r,n,o,{translateX:s,translateY:a,scale:u}]=Q(c=>[c.selection,c.getSelection,c.selectionBox,c.setSelectionBox,c.getConfiguration,{translateX:c.boardState.translateX,translateY:c.boardState.translateY,scale:c.boardState.scale}]),[l]=ie(c=>[c.items]),m=f.useCallback(()=>{const c=t(),{boardWrapperRect:_,boardWrapper:b}=o();if(c.length===0){n(null);return}const C=Ct(c,b);if(!C){n(null);return}const{left:h,top:S,width:E,height:x}=C,v={left:h-_.left,top:S-_.top,height:x,width:E};n(v)},[o,t,n]),d=tt(m,[m],300);return f.useEffect(()=>{m(),d()},[e,l,s,a,u,m,d]),!r||e.length<2?null:k("div",{style:{transform:`translate(${r.left}px, ${r.top}px)`,height:`${r.height}px`,width:`${r.width}px`},className:`selection ${Qn}`})},to=()=>{const[e]=Q(t=>[t.boardState.movingItems]);return e?null:k(eo,{})},ro=typeof window<"u"&&typeof navigator<"u"&&typeof document<"u";let Ne;function no(){if(!ro)return;if(Ne)return Ne;const e=new Map,t=new ResizeObserver(r=>{r.forEach(n=>{var o;return(o=e.get(n.target))==null?void 0:o.forEach(s=>setTimeout(()=>s(n),0))})});return Ne={observer:t,subscribe:(r,n)=>{let o=e.get(r);o||(o=new Set,e.set(r,o),t.observe(r)),o.add(n)},unsubscribe:(r,n)=>{const o=e.get(r);o&&(o.delete(n),o.size||(e.delete(r),t.unobserve(r)))}},Ne}function oo(e,t,r=!0){const n=r&&no(),o=et(t),s=e&&"current"in e?e.current:e;f.useEffect(()=>{const a=e&&"current"in e?e.current:e;if(!n||!a)return;let u=!0;const l=(...m)=>{u&&o.current(...m)};return n.subscribe(a,l),()=>{u=!1,n.unsubscribe(a,l)}},[s,n])}function Wt(e,t,r){return Math.min(Math.max(e,r),t)}class so extends Error{constructor(t){super(`Failed to parse color: "${t}"`)}}var Pe=so;function io(e){if(typeof e!="string")throw new Pe(e);if(e.trim().toLowerCase()==="transparent")return[0,0,0,0];let t=e.trim();t=go.test(e)?uo(e):e;const r=lo.exec(t);if(r){const a=Array.from(r).slice(1);return[...a.slice(0,3).map(u=>parseInt(Me(u,2),16)),parseInt(Me(a[3]||"f",2),16)/255]}const n=fo.exec(t);if(n){const a=Array.from(n).slice(1);return[...a.slice(0,3).map(u=>parseInt(u,16)),parseInt(a[3]||"ff",16)/255]}const o=mo.exec(t);if(o){const a=Array.from(o).slice(1);return[...a.slice(0,3).map(u=>parseInt(u,10)),parseFloat(a[3]||"1")]}const s=po.exec(t);if(s){const[a,u,l,m]=Array.from(s).slice(1).map(parseFloat);if(Wt(0,100,u)!==u)throw new Pe(e);if(Wt(0,100,l)!==l)throw new Pe(e);return[...ho(a,u,l),Number.isNaN(m)?1:m]}throw new Pe(e)}function ao(e){let t=5381,r=e.length;for(;r;)t=t*33^e.charCodeAt(--r);return(t>>>0)%2341}const Vt=e=>parseInt(e.replace(/_/g,""),36),co="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce((e,t)=>{const r=Vt(t.substring(0,3)),n=Vt(t.substring(3)).toString(16);let o="";for(let s=0;s<6-n.length;s++)o+="0";return e[r]=`${o}${n}`,e},{});function uo(e){const t=e.toLowerCase().trim(),r=co[ao(t)];if(!r)throw new Pe(e);return`#${r}`}const Me=(e,t)=>Array.from(Array(t)).map(()=>e).join(""),lo=new RegExp(`^#${Me("([a-f0-9])",3)}([a-f0-9])?$`,"i"),fo=new RegExp(`^#${Me("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i"),mo=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${Me(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i"),po=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i,go=/^[a-z]+$/i,Ft=e=>Math.round(e*255),ho=(e,t,r)=>{let n=r/100;if(t===0)return[n,n,n].map(Ft);const o=(e%360+360)%360/60,s=(1-Math.abs(2*n-1))*(t/100),a=s*(1-Math.abs(o%2-1));let u=0,l=0,m=0;o>=0&&o<1?(u=s,l=a):o>=1&&o<2?(u=a,l=s):o>=2&&o<3?(l=s,m=a):o>=3&&o<4?(l=a,m=s):o>=4&&o<5?(u=a,m=s):o>=5&&o<6&&(u=s,m=a);const d=n-s/2,c=u+d,_=l+d,b=m+d;return[c,_,b].map(Ft)};function vo(e){if(e==="transparent")return 0;function t(s){const a=s/255;return a<=.03928?a/12.92:Math.pow((a+.055)/1.055,2.4)}const[r,n,o]=io(e);return .2126*t(r)+.7152*t(n)+.0722*t(o)}function yo(e){return vo(e)>.179}const So=q({display:"flex",flexDirection:"row",alignItems:"center",zIndex:210,pointerEvents:"none"}),bo=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"}),_o=({color:e="#666",size:t=40,text:r})=>{const n=yo(e)?"#222":"#EEE";return ce("div",{className:So,children:[ce("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:[k("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:n}}),k("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}})]}),k("div",{style:{color:n,backgroundColor:e},className:bo,children:r})]})},Eo=f.memo(_o),wo=q({top:0,left:0,zIndex:210,position:"fixed",pointerEvents:"none"}),Co=({pos:e,...t})=>k("div",{className:wo,style:{transform:`translate(${e.x-5}px, ${e.y-3}px)`},children:k(Eo,{...t})}),xo=()=>{const[e,t,r,n]=he(s=>[s.getUser(),s.getLocalUsers(),s.cursors,s.users]),o=t.reduce((s,a)=>(a.id!==e.id&&r[a.id]&&(s[a.id]=r[a.id]),s),{});return k(pt,{children:Object.entries(o).map(([s,a])=>k(Co,{pos:a,text:n[s].name,color:n[s].color},s))})},Io=({children:e})=>{const t=he(l=>l.getUser()),[r,n]=he(l=>[l.moveCursor,l.removeCursor]),[o,s]=Q(l=>[l.getConfiguration,l.getBoardState]);return ce("div",{onPointerMove:({clientX:l,clientY:m})=>{const{scale:d,translateX:c,translateY:_}=s(),{boardWrapperRect:{left:b,top:C}}=o(),h={x:(l-b-c)/d,y:(m-C-_)/d};r(t.id,h)},onPointerLeave:()=>{n(t.id)},children:[e,k(xo,{})]})},Oo=({children:e})=>e,To={overflow:"hidden",position:"absolute",inset:0},ko=({moveFirst:e=!0,style:t,wrapperStyle:r,itemTemplates:n={},boardSize:o=kt,children:s,showResizeHandle:a=!1,Wrapper:u=Oo})=>{const l=f.useRef(null),[m,d]=Q(C=>[C.config.uid,C.updateConfiguration]),{updateItemExtent:c}=ze(),_={userSelect:"none",width:`${o}px`,height:`${o}px`,backgroundColor:"#333",...t};f.useEffect(()=>{const C=h=>{Oe(h.target,"board")&&h.preventDefault()};return document.body.addEventListener("wheel",C,{passive:!1}),()=>{document.body.removeEventListener("wheel",C)}},[]),f.useEffect(()=>{d({boardWrapper:l.current})},[d]),f.useEffect(()=>{m||d({uid:ge()})},[m,d]),f.useEffect(()=>{d({itemTemplates:n,boardSize:o,showResizeHandle:a})},[n,o,a,d]),f.useEffect(()=>{d({boardWrapperRect:l.current.getBoundingClientRect()}),c(),setTimeout(c,2e3)},[d,c]),oo(l,()=>{l.current&&d({boardWrapperRect:l.current.getBoundingClientRect()})});const b=q({...To,...r});return ce("div",{ref:l,id:m,className:`sync-board ${b}`,children:[k(Zn,{moveFirst:e,children:k(Kn,{moveFirst:e,children:k(Hn,{moveFirst:e,children:k(Io,{children:k(u,{children:ce("div",{onContextMenu:C=>{C.preventDefault()},style:_,className:"board",children:[k(Yn,{}),s]})})})})})}),k(to,{})]})};yn(f.createElement),X.Board=ko,X.BoardWrapper=on,X.RoomWrapper=sn,X.useAvailableActions=Wr,X.useBoardConfig=Gr,X.useBoardPosition=ze,X.useBoardState=Jr,X.useDebouncedItems=Rr,X.useItemActions=Be,X.useItemInteraction=Rt,X.useItems=jr,X.useMessage=nn,X.useSelectedItems=zr,X.useSelectionBox=Vr,X.useSessionInfo=Zr,X.useUsers=qr,X.useWire=Ie,Object.defineProperty(X,Symbol.toStringTag,{value:"Module"})});
|
|
108
|
+
`,$n=({onReload:e})=>ce("div",{className:`syncboard-error-item ${q({width:"100px",display:"flex",flexDirection:"column",justifyContent:"center",textAlign:"center",color:"red"})}`,children:["Sorry, this item seems broken.",P("button",{onClick:e,children:"Reload it"})]});class An extends d.Component{constructor(t){super(t),this.state={hasError:!1,itemId:t.itemId},this.onReload=this.onReload.bind(this)}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(t){console.error(`Error for item ${this.state.itemId}`,t,this.props.state)}onReload(){this.setState({hasError:!1})}render(){const{ErrorComponent:t}=this.props;return this.state.hasError?P(t,{onReload:this.onReload}):this.props.children}}const Ln=e=>{e.target.className=""},zn=({width:e,height:t,actualWidth:r,actualHeight:n,prevState:o,keepRatio:s})=>{let{width:c,height:u}=o;if([c,u]=[parseFloat(c),parseFloat(u)],(!c||Number.isNaN(Number(c)))&&(c=r),(!u||Number.isNaN(Number(u)))&&(u=n),s){const l=c/u;return{...o,width:(c+e).toFixed(1),height:(u+t/l).toFixed(1)}}return{...o,width:(c+e).toFixed(1),height:(u+t).toFixed(1)}},Yn={w:!0,h:!0,b:!0},Bn=({setState:e,state:{type:t,rotation:r=0,id:n,locked:o,extraClasses:s,...c}={},animate:u="hvr-pop",isSelected:l,itemMap:m,showResizeHandle:f=!0})=>{var g;const a=d.useRef(null),{component:h=()=>null,resizeDirections:S=Yn,resize:v=zn}=m[t],b=d.useCallback(y=>e(n,y),[e,n]);d.useEffect(()=>{a.current.className=u},[u]);const I=["item",n,xn];o&&I.push("locked"),l&&(I.push("selected"),I.push(In));const E=I.join(" "),w=({width:y=0,height:k=0,keepRatio:M})=>{b(j=>{const{offsetWidth:D,offsetHeight:A}=a.current;return v({prevState:j,width:y,height:k,actualHeight:A,actualWidth:D,keepRatio:M})})},x=({width:y})=>{w({width:y})},p=({height:y})=>{w({height:y})},C=({width:y})=>{w({height:y,width:y,keepRatio:!0})};return P("div",{style:{transform:`rotate(${r}deg`},"data-id":n,className:E,children:ce("div",{style:{display:"flex"},ref:a,onAnimationEnd:Ln,onKeyDown:y=>y.stopPropagation(),onKeyUp:y=>y.stopPropagation(),children:[P(An,{itemId:n,state:c,ErrorComponent:((g=m==null?void 0:m.error)==null?void 0:g.component)||$n,children:P(h,{...c,id:n,setState:b})}),P("div",{className:`corner ${ke} ${On}`}),P("div",{className:`corner ${ke} ${Tn}`}),P("div",{className:`corner ${ke} ${Pn}`}),P("div",{className:`corner ${ke} ${kn}`}),P("div",{className:`center ${ke} ${Mn}`}),f&&ce(fr,{children:[S.b&&P(it,{className:`${at} ${Rn}`,onResize:C}),S.h&&P(it,{className:`${at} ${jn}`,onResize:p}),S.w&&P(it,{className:`${at} ${Dn}`,onResize:x})]})]})})},Nn=d.memo(Bn,({state:e,setState:t,isSelected:r,showResizeHandle:n},{state:o,setState:s,isSelected:c,showResizeHandle:u})=>r===c&&n===u&&t===s&&wn(e,o)),Xn=e=>e,Un=({state:e={},getCurrentUser:t,className:r,...n})=>{if(!n.itemMap[e.type])return null;const{stateHook:o=Xn}=n.itemMap[e.type],{x:s=0,y:c=0,layer:u=0,moving:l,...m}=o(e,{getCurrentUser:t}),f=(u+4)*10+100+(l?5:0);return P("div",{className:r,style:{transform:`translate(${s}px, ${c}px)`,zIndex:f},children:P(Nn,{...n,showResizeHandle:n.isSelected&&n.showResizeHandle,state:m})})},Wn=d.memo(Un),Vn=()=>{const{updateItem:e}=Be(),[t,r]=ie(m=>[m.itemIds,m.items]),[n,o,s,c]=Z(m=>[m.config.boardSize,m.config.showResizeHandle,m.config.itemTemplates,m.selection]),[u]=Se(m=>[m.getUser]),l=q({position:"absolute",top:`${n/2}px`,left:`${n/2}px`,display:"inline-block"});return t.map(m=>P(Wn,{state:r[m],setState:e,isSelected:c.includes(m),itemMap:s,boardSize:n,getCurrentUser:u,showResizeHandle:o,className:l},m))};function Fn(e=!1){const t=d.useRef(e),r=d.useCallback(()=>t.current,[]);return d.useEffect(()=>(t.current=!0,()=>{t.current=!1}),[]),r}function Kn(e,...t){e&&e.addEventListener&&e.addEventListener(...t)}function Hn(e,...t){e&&e.removeEventListener&&e.removeEventListener(...t)}const qn=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);function le(e,...t){const r=Fn(),n=rt(t[1]),o=d.useMemo(()=>function(...s){r()&&(typeof n.current=="function"?n.current.apply(this,s):typeof n.current.handleEvent=="function"&&n.current.handleEvent.apply(this,s))},[]);d.useEffect(()=>{const s=e&&qn(e,"current")?e.current:e;if(!s)return;const c=t.slice(2);return Kn(s,t[0],o,...c),()=>Hn(s,t[0],o,...c)},[e,t[0]])}const Gn=q({zIndex:210,position:"absolute",backgroundColor:"hsla(0, 40%, 50%, 10%)",border:"2px solid hsl(0, 55%, 40%)"}),Jn=(e,t,r=!1)=>{const n=t.getElementsByClassName("selector");if(!n.length)return[];const o=n[0];return Array.from(t.getElementsByClassName("item")).filter(s=>{const c=Te(s),u=e[c];return!u||!r&&u.locked?!1:xr(s,o)}).map(s=>Te(s))},Zn=({children:e,moveFirst:t})=>{const[r,n,o,s,c,u]=Z(g=>[g.getSelection,g.clear,g.setSelection,g.select,g.getConfiguration,g.getBoardState,g.updateBoardState]),{findElementUnderPointer:l}=Be(),[m]=ie(g=>[g.getItems]),[f,a]=d.useState({}),[,h]=d.useTransition(),[S,v]=d.useState(!1),b=d.useRef(null),I=d.useRef({moving:!1});return le(document,"keydown",g=>{g.key==="l"&&v(!0)}),le(document,"keyup",g=>{g.key==="l"&&v(!1)}),d.useEffect(()=>(n(),()=>{n()}),[n]),d.useEffect(()=>{if(I.current.moving){const g=m(),{boardWrapper:y}=c(),k=Jn(g,y,S);h(()=>{o(k)})}},[c,m,f,o,S]),P(Ne,{onDragStart:async g=>{await l(g)||(I.current.moving=!0,h(()=>{u({selecting:!0})}),b.current.style.cursor="crosshair")},onDrag:({distanceY:g,distanceX:y,startX:k,startY:M})=>{if(I.current.moving){const{top:j,left:D}=b.current.getBoundingClientRect(),A=k-D,B=M-j;y>0?(I.current.left=A,I.current.width=y):(I.current.left=A+y,I.current.width=-y),g>0?(I.current.top=B,I.current.height=g):(I.current.top=B+g,I.current.height=-g),a({...I.current,moving:!0})}},onDragEnd:()=>{I.current.moving&&(h(()=>{u({selecting:!1})}),I.current.moving=!1,a({moving:!1}),b.current.style.cursor="auto")},onTap:g=>{const{target:y,ctrlKey:k,metaKey:M}=g,j=l(g);if(!j&&Oe(y,"board"))n();else{const D=Te(j);if(!D){n();return}const A=r();j&&!A.includes(D)&&(k||M?s([D]):o([D]))}},onLongTap:({target:g})=>{const y=Oe(g,"item");if(y){const k=Te(y);o([k])}},mainAction:t?"pan":"drag",children:ce("div",{ref:b,children:[f.moving&&P("div",{style:{transform:`translate(${f.left}px, ${f.top}px)`,height:`${f.height}px`,width:`${f.width}px`},className:`selector ${Gn}`}),e]})})},Qn=({children:e})=>{const{moveItems:t,placeItems:r,findElementUnderPointer:n}=Be(),{vectorFromWrapperToBoard:o}=ye(),[s,c,u,l,m]=Z(E=>[E.select,E.setSelection,E.getSelection,E.getBoardState,E.updateBoardState]),[f]=ie(E=>[E.getBoardConfig]),a=d.useRef({}),h=d.useRef({items:[]}),S=E=>{const{ctrlKey:w,metaKey:x,event:p}=E,C=n(E);if(C){p.stopPropagation();const g=u();h.current.items=g;const y=Te(C);g.includes(y)||(w||x?(h.current.items=[...g,y],s([y])):(h.current.items=[y],c([y]))),Object.assign(a.current,{moving:!0})}},v=({deltaX:E,deltaY:w,event:x})=>{if(a.current.moving){x.stopPropagation();const{movingItems:p}=l(),[C,g]=o(E,w);t(h.current.items,{x:C,y:g},!0),p||m({movingItems:!0})}},b=()=>{if(a.current.moving){const{gridSize:E=1}=f(),w=E||1;a.current={moving:!1},r(h.current.items,{type:"grid",size:w}),m({movingItems:!1})}};return le(document,"keydown",E=>{if(["INPUT","TEXTAREA"].includes(E.target.tagName))return;const w=u();if(w.length){const{gridSize:x=1}=f();let p=0,C=0;switch(E.key){case"ArrowLeft":p=-10;break;case"ArrowRight":p=10;break;case"ArrowUp":C=-10;break;case"ArrowDown":C=10;break}if(p||C){E.shiftKey&&(p*=5,C*=5),(E.ctrlKey||E.altKey||E.metaKey)&&(p/=10,C/=10);const[g,y]=o(p,C);t(w,{x:g,y},!0),r(w,{type:"grid",size:x||1}),E.preventDefault()}}}),P(Ne,{onDragStart:S,onDrag:v,onDragEnd:b,children:e})},eo=e=>{const t=d.useRef({hover:!1,x:0,y:0});return le(e.current,"mousemove",n=>{const{clientX:o,clientY:s}=n;t.current.x=o,t.current.y=s}),le(e.current,"mouseenter",()=>{t.current.hover=!0}),le(e.current,"mouseleave",()=>{t.current.hover=!1}),d.useCallback(()=>t.current,[])},to=[...Array(5).keys()].map(e=>`Digit${e+1}`),ro=()=>{const[e,t]=d.useState({}),[r,n]=Z(o=>[o.getBoardState,o.updateBoardState]);return le(document,"keydown",o=>{if(!["INPUT","TEXTAREA"].includes(o.target.tagName)&&to.includes(o.code)){const s=o.code,{translateX:c,translateY:u,scale:l}=r();o.altKey||o.metaKey||o.ctrlKey||o.shiftKey?t(m=>({...m,[s]:{translateX:c,translateY:u,scale:l}})):e[s]&&n(e[s]),o.preventDefault()}}),null},no=({children:e,moveFirst:t=!1})=>{const r=d.useRef(null),[n,o,s,c,u]=Z(p=>[{translateX:p.boardState.translateX,translateY:p.boardState.translateY,scale:p.boardState.scale,rotate:p.boardState.rotate},p.config.itemExtent,p.getConfiguration,p.updateBoardState,p.getSelection]),{zoomToCenter:l,zoomToExtent:m,moveBoard:f}=ye(),[a,h]=d.useState(!1),S=d.useRef({}),v=eo(r);ro();const b=d.useCallback(()=>{const{itemExtent:p}=s();m(p)},[s,m]);d.useEffect(()=>{!a&&o.radius&&(b(),h(!0))},[b,a,o]);const I=({clientX:p,clientY:C,scale:g})=>{l({to:{x:p,y:C},factor:1-g/500}),clearTimeout(S.current.zoom),S.current.zoom=setTimeout(()=>{c({zooming:!1})},200),c({zooming:!0})},E=({deltaX:p,deltaY:C})=>{f(({translateX:g,translateY:y})=>({translateX:g+p,translateY:y+C})),clearTimeout(S.current.pan),S.current.pan=setTimeout(()=>{c({panning:!1})},200),c({panning:!0})},w=p=>{if(["INPUT","TEXTAREA"].includes(p.target.tagName))return;let C=0,g=0,y=1;switch(p.key){case"ArrowLeft":C=-10;break;case"ArrowRight":C=10;break;case"ArrowUp":g=-10;break;case"ArrowDown":g=10;break;case"PageUp":y=1.2;break;case"PageDown":y=.8;break}if(C||g||y!==1){const k=u();if(y===1&&k.length)return;p.shiftKey&&(C*=5,g*=5),(p.ctrlKey||p.altKey||p.metaKey)&&(C/=5,g/=5),f(({translateX:M,translateY:j})=>({translateX:M+C,translateY:j+g})),l({factor:y}),p.preventDefault()}p.key===" "&&!p.repeat&&v().hover&&l({factor:3,to:v()})},x=p=>{["INPUT","TEXTAREA"].includes(p.target.tagName)||p.key===" "&&v().hover&&l({factor:1/3,to:v()})};return le(document,"keydown",w),le(document,"keyup",x),P(Ne,{onPan:E,onZoom:I,mainAction:t?"pan":"drag",children:P("div",{style:{display:"inline-block",transformOrigin:"top left",transform:`translate(${n.translateX}px, ${n.translateY}px) rotate(${n.rotate}deg) scale(${n.scale})`},className:`board-pane${n.scale<.5?" board-pane__far":""}`,ref:r,children:e})})},oo=q({position:"absolute",top:0,left:0,zIndex:210,backgroundColor:"hsla(0, 40%, 50%, 0%)",border:"2px dashed hsl(20, 55%, 40%)",pointerEvents:"none"}),so=()=>{const[e,t,r,n,o,{translateX:s,translateY:c,scale:u}]=Z(a=>[a.selection,a.getSelection,a.selectionBox,a.setSelectionBox,a.getConfiguration,{translateX:a.boardState.translateX,translateY:a.boardState.translateY,scale:a.boardState.scale}]),[l]=ie(a=>[a.items]),m=d.useCallback(()=>{const a=t(),{boardWrapperRect:h,boardWrapper:S}=o();if(a.length===0){n(null);return}const v=Ir(a,S);if(!v){n(null);return}const{left:b,top:I,width:E,height:w}=v,x={left:b-h.left,top:I-h.top,height:w,width:E};n(x)},[o,t,n]),f=nt(m,[m],300);return d.useEffect(()=>{m(),f()},[e,l,s,c,u,m,f]),!r||e.length<2?null:P("div",{style:{transform:`translate(${r.left}px, ${r.top}px)`,height:`${r.height}px`,width:`${r.width}px`},className:`selection ${oo}`})},io=()=>{const[e]=Z(t=>[t.boardState.movingItems]);return e?null:P(so,{})},ao=typeof window<"u"&&typeof navigator<"u"&&typeof document<"u";let Xe;function co(){if(!ao)return;if(Xe)return Xe;const e=new Map,t=new ResizeObserver(r=>{r.forEach(n=>{var o;return(o=e.get(n.target))==null?void 0:o.forEach(s=>setTimeout(()=>s(n),0))})});return Xe={observer:t,subscribe:(r,n)=>{let o=e.get(r);o||(o=new Set,e.set(r,o),t.observe(r)),o.add(n)},unsubscribe:(r,n)=>{const o=e.get(r);o&&(o.delete(n),o.size||(e.delete(r),t.unobserve(r)))}},Xe}function uo(e,t,r=!0){const n=r&&co(),o=rt(t),s=e&&"current"in e?e.current:e;d.useEffect(()=>{const c=e&&"current"in e?e.current:e;if(!n||!c)return;let u=!0;const l=(...m)=>{u&&o.current(...m)};return n.subscribe(c,l),()=>{u=!1,n.unsubscribe(c,l)}},[s,n])}function Wt(e,t,r){return Math.min(Math.max(e,r),t)}class lo extends Error{constructor(t){super(`Failed to parse color: "${t}"`)}}var Pe=lo;function fo(e){if(typeof e!="string")throw new Pe(e);if(e.trim().toLowerCase()==="transparent")return[0,0,0,0];let t=e.trim();t=_o.test(e)?go(e):e;const r=ho.exec(t);if(r){const c=Array.from(r).slice(1);return[...c.slice(0,3).map(u=>parseInt(Me(u,2),16)),parseInt(Me(c[3]||"f",2),16)/255]}const n=vo.exec(t);if(n){const c=Array.from(n).slice(1);return[...c.slice(0,3).map(u=>parseInt(u,16)),parseInt(c[3]||"ff",16)/255]}const o=yo.exec(t);if(o){const c=Array.from(o).slice(1);return[...c.slice(0,3).map(u=>parseInt(u,10)),parseFloat(c[3]||"1")]}const s=So.exec(t);if(s){const[c,u,l,m]=Array.from(s).slice(1).map(parseFloat);if(Wt(0,100,u)!==u)throw new Pe(e);if(Wt(0,100,l)!==l)throw new Pe(e);return[...bo(c,u,l),Number.isNaN(m)?1:m]}throw new Pe(e)}function po(e){let t=5381,r=e.length;for(;r;)t=t*33^e.charCodeAt(--r);return(t>>>0)%2341}const Vt=e=>parseInt(e.replace(/_/g,""),36),mo="1q29ehhb 1n09sgk7 1kl1ekf_ _yl4zsno 16z9eiv3 1p29lhp8 _bd9zg04 17u0____ _iw9zhe5 _to73___ _r45e31e _7l6g016 _jh8ouiv _zn3qba8 1jy4zshs 11u87k0u 1ro9yvyo 1aj3xael 1gz9zjz0 _3w8l4xo 1bf1ekf_ _ke3v___ _4rrkb__ 13j776yz _646mbhl _nrjr4__ _le6mbhl 1n37ehkb _m75f91n _qj3bzfz 1939yygw 11i5z6x8 _1k5f8xs 1509441m 15t5lwgf _ae2th1n _tg1ugcv 1lp1ugcv 16e14up_ _h55rw7n _ny9yavn _7a11xb_ 1ih442g9 _pv442g9 1mv16xof 14e6y7tu 1oo9zkds 17d1cisi _4v9y70f _y98m8kc 1019pq0v 12o9zda8 _348j4f4 1et50i2o _8epa8__ _ts6senj 1o350i2o 1mi9eiuo 1259yrp0 1ln80gnw _632xcoy 1cn9zldc _f29edu4 1n490c8q _9f9ziet 1b94vk74 _m49zkct 1kz6s73a 1eu9dtog _q58s1rz 1dy9sjiq __u89jo3 _aj5nkwg _ld89jo3 13h9z6wx _qa9z2ii _l119xgq _bs5arju 1hj4nwk9 1qt4nwk9 1ge6wau6 14j9zlcw 11p1edc_ _ms1zcxe _439shk6 _jt9y70f _754zsow 1la40eju _oq5p___ _x279qkz 1fa5r3rv _yd2d9ip _424tcku _8y1di2_ _zi2uabw _yy7rn9h 12yz980_ __39ljp6 1b59zg0x _n39zfzp 1fy9zest _b33k___ _hp9wq92 1il50hz4 _io472ub _lj9z3eo 19z9ykg0 _8t8iu3a 12b9bl4a 1ak5yw0o _896v4ku _tb8k8lv _s59zi6t _c09ze0p 1lg80oqn 1id9z8wb _238nba5 1kq6wgdi _154zssg _tn3zk49 _da9y6tc 1sg7cv4f _r12jvtt 1gq5fmkz 1cs9rvci _lp9jn1c _xw1tdnb 13f9zje6 16f6973h _vo7ir40 _bt5arjf _rc45e4t _hr4e100 10v4e100 _hc9zke2 _w91egv_ _sj2r1kk 13c87yx8 _vqpds__ _ni8ggk8 _tj9yqfb 1ia2j4r4 _7x9b10u 1fc9ld4j 1eq9zldr _5j9lhpx _ez9zl6o _md61fzm".split(" ").reduce((e,t)=>{const r=Vt(t.substring(0,3)),n=Vt(t.substring(3)).toString(16);let o="";for(let s=0;s<6-n.length;s++)o+="0";return e[r]=`${o}${n}`,e},{});function go(e){const t=e.toLowerCase().trim(),r=mo[po(t)];if(!r)throw new Pe(e);return`#${r}`}const Me=(e,t)=>Array.from(Array(t)).map(()=>e).join(""),ho=new RegExp(`^#${Me("([a-f0-9])",3)}([a-f0-9])?$`,"i"),vo=new RegExp(`^#${Me("([a-f0-9]{2})",3)}([a-f0-9]{2})?$`,"i"),yo=new RegExp(`^rgba?\\(\\s*(\\d+)\\s*${Me(",\\s*(\\d+)\\s*",2)}(?:,\\s*([\\d.]+))?\\s*\\)$`,"i"),So=/^hsla?\(\s*([\d.]+)\s*,\s*([\d.]+)%\s*,\s*([\d.]+)%(?:\s*,\s*([\d.]+))?\s*\)$/i,_o=/^[a-z]+$/i,Ft=e=>Math.round(e*255),bo=(e,t,r)=>{let n=r/100;if(t===0)return[n,n,n].map(Ft);const o=(e%360+360)%360/60,s=(1-Math.abs(2*n-1))*(t/100),c=s*(1-Math.abs(o%2-1));let u=0,l=0,m=0;o>=0&&o<1?(u=s,l=c):o>=1&&o<2?(u=c,l=s):o>=2&&o<3?(l=s,m=c):o>=3&&o<4?(l=c,m=s):o>=4&&o<5?(u=c,m=s):o>=5&&o<6&&(u=s,m=c);const f=n-s/2,a=u+f,h=l+f,S=m+f;return[a,h,S].map(Ft)};function Eo(e){if(e==="transparent")return 0;function t(s){const c=s/255;return c<=.03928?c/12.92:Math.pow((c+.055)/1.055,2.4)}const[r,n,o]=fo(e);return .2126*t(r)+.7152*t(n)+.0722*t(o)}function Co(e){return Eo(e)>.179}const wo=q({display:"flex",flexDirection:"row",alignItems:"center",zIndex:210,pointerEvents:"none"}),xo=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"}),Io=({color:e="#666",size:t=40,text:r})=>{const n=Co(e)?"#222":"#EEE";return ce("div",{className:wo,children:[ce("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:[P("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:n}}),P("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}})]}),P("div",{style:{color:n,backgroundColor:e},className:xo,children:r})]})},Oo=d.memo(Io),To=q({top:0,left:0,zIndex:210,position:"fixed",pointerEvents:"none"}),ko=({pos:e,...t})=>P("div",{className:To,style:{transform:`translate(${e.x-6}px, ${e.y-15}px)`},children:P(Oo,{...t})}),Po=({children:e})=>{const[t]=Z(v=>[v.getConfiguration]),{fromWrapperToBoard:r,fromBoardToWrapper:n}=ye(),[o,s,c,u]=Se(v=>[v.getUser(),v.getLocalUsers(),v.cursors,v.users]),[l,m]=Se(v=>[v.moveCursor,v.removeCursor]),{boardWrapperRect:f}=t(),a=({clientX:v,clientY:b})=>{const[I,E]=r(v-f.left,b-f.top);l(o.id,{x:I,y:E})},h=()=>{m(o.id)},S=s.reduce((v,b)=>(b.id!==o.id&&c[b.id]&&(v[b.id]=c[b.id]),v),{});return ce("div",{onPointerMove:a,onPointerLeave:h,children:[e,Object.entries(S).map(([v,b])=>{const[I,E]=n(b.x,b.y),w={x:I+f.left,y:E+f.top};return et(w,f)?P(ko,{pos:w,text:u[v].name,color:u[v].color},v):null})]})},Mo=({children:e})=>e,Do={overflow:"hidden",position:"absolute",inset:0},jo=({moveFirst:e=!0,style:t,wrapperStyle:r,itemTemplates:n={},boardSize:o=Pt,children:s,showResizeHandle:c=!1,Wrapper:u=Mo})=>{const l=d.useRef(null),[m,f]=Z(v=>[v.config.uid,v.updateConfiguration]),{updateItemExtent:a}=ye(),h={userSelect:"none",width:`${o}px`,height:`${o}px`,backgroundColor:"#333",...t};d.useEffect(()=>{const v=b=>{Oe(b.target,"board")&&b.preventDefault()};return document.body.addEventListener("wheel",v,{passive:!1}),()=>{document.body.removeEventListener("wheel",v)}},[]),d.useEffect(()=>{f({boardWrapper:l.current})},[f]),d.useEffect(()=>{m||f({uid:ge()})},[m,f]),d.useEffect(()=>{f({itemTemplates:n,boardSize:o,showResizeHandle:c})},[n,o,c,f]),d.useEffect(()=>{f({boardWrapperRect:l.current.getBoundingClientRect()}),a(),setTimeout(a,2e3)},[f,a]),uo(l,()=>{l.current&&f({boardWrapperRect:l.current.getBoundingClientRect()})});const S=q({...Do,...r});return ce("div",{ref:l,id:m,className:`sync-board ${S}`,children:[P(Po,{children:P(Zn,{moveFirst:e,children:P(no,{moveFirst:e,children:P(Qn,{moveFirst:e,children:P(u,{children:ce("div",{onContextMenu:v=>{v.preventDefault()},style:h,className:"board",children:[P(Vn,{}),s]})})})})})}),P(io,{})]})};Cn(d.createElement),U.Board=jo,U.BoardWrapper=ln,U.RoomWrapper=fn,U.useAvailableActions=qr,U.useBoardConfig=tn,U.useBoardPosition=ye,U.useBoardState=rn,U.useDebouncedItems=$r,U.useItemActions=Be,U.useItemInteraction=jt,U.useItems=Rr,U.useMessage=un,U.useSelectedItems=Br,U.useSelectionBox=Gr,U.useSessionInfo=nn,U.useUsers=en,U.useWire=Ie,Object.defineProperty(U,Symbol.toStringTag,{value:"Module"})});
|
|
109
109
|
//# sourceMappingURL=react-sync-board.umd.cjs.map
|