@projectstorm/react-workspaces-core - npm Package Compare versions

Comparing version 4.2.1 to 4.2.2

dist/@types/core/WorkspaceModelFactory.d.ts

@@ -20,3 +20,3 @@ import { WorkspaceModel } from '../core-models/WorkspaceModel';
     protected abstract _generateModel(): T;
-    abstract generateContent(event: E): JSX.Element;
+    abstract generateContent(event: E): React.JSX.Element;
 }

dist/@types/entities/node/WorkspaceNodeFactory.d.ts

@@ -12,3 +12,3 @@ import { WorkspaceNodeModel } from './WorkspaceNodeModel';
 export interface WorkspaceNodePanelRenderer<T extends WorkspaceModel = WorkspaceModel> extends SubComponentRenderer<T> {
-    renderTitleBar(model: RenderTitleBarEvent<T>): JSX.Element;
+    renderTitleBar(model: RenderTitleBarEvent<T>): React.JSX.Element;
 }
@@ -15,0 +15,0 @@ export declare class WorkspaceNodeFactory<T extends WorkspaceNodeModel = WorkspaceNodeModel, R extends WorkspaceNodePanelRenderer = WorkspaceNodePanelRenderer> extends SubComponentModelFactory<T, R> {

dist/@types/widgets/hooks/dnd/useDraggable.d.ts

@@ -13,2 +13,2 @@ import * as React from 'react';
 export declare const useDraggable: <T>(props: UseDraggableProps<T>) => void;
-export declare const DraggableWidget: <T>(props: React.PropsWithChildren<UseDraggableProps<T>>) => JSX.Element;
+export declare const DraggableWidget: <T>(props: React.PropsWithChildren<UseDraggableProps<T>>) => React.JSX.Element;

dist/@types/widgets/hooks/useModelElement.d.ts

@@ -8,2 +8,2 @@ import { WorkspaceModel } from '../../core-models/WorkspaceModel';
 }
-export declare const useModelElement: (props: UseModelElementProps) => React.MutableRefObject<HTMLDivElement>;
+export declare const useModelElement: (props: UseModelElementProps) => React.RefObject<HTMLDivElement>;

dist/@types/widgets/layers/debug/DebugLayer.d.ts

@@ -16,3 +16,3 @@ import { Layer, LayerManager } from '../LayerManager';
     updateOptions(options: Partial<DebugLayerOptions>): void;
-    renderLayer(event: any): JSX.Element;
+    renderLayer(event: any): React.JSX.Element;
 }
@@ -19,0 +19,0 @@ export interface DebugLayerWidgetProps {

dist/@types/widgets/layers/LayerManager.d.ts

@@ -21,3 +21,3 @@ import { BaseListener, BaseObserver } from '../../core/BaseObserver';
     constructor(options: LayerOptions);
-    abstract renderLayer(event: RenderLayerEvent): JSX.Element;
+    abstract renderLayer(event: RenderLayerEvent): React.JSX.Element;
     setLayerManager(manager: LayerManager): void;
@@ -24,0 +24,0 @@ isInserted(): boolean;

dist/@types/widgets/layers/ordering/OrderingLayer.d.ts

@@ -0,1 +1,2 @@
+import * as React from 'react';
 import { Layer, LayerListener, RenderLayerEvent } from '../LayerManager';
@@ -17,3 +18,3 @@ import { DimensionContainer } from '../../../core/dimensions/DimensionContainer';
     dropped(model: WorkspaceModel, index: number): void;
-    renderLayer(event: RenderLayerEvent): JSX.Element;
+    renderLayer(event: RenderLayerEvent): React.JSX.Element;
 }

dist/@types/widgets/layers/ordering/OrderingWidget.d.ts

@@ -19,3 +19,3 @@ import * as React from 'react';
 export interface OrderingWidgetProps {
-    children: JSX.Element[];
+    children: React.JSX.Element[];
     vertical: boolean;
@@ -22,0 +22,0 @@ engine: WorkspaceEngine;

dist/@types/widgets/layouts/DirectionalChildWidget.d.ts

@@ -7,4 +7,4 @@ import * as React from 'react';
     expand: boolean;
-    generateElement: (model: WorkspaceModel) => JSX.Element;
+    generateElement: (model: WorkspaceModel) => React.JSX.Element;
 }
 export declare const DirectionChildWidget: React.FC<DirectionChildWidgetProps>;

dist/core/WorkspaceModelFactory.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"WorkspaceModelFactory.js","sourceRoot":"","sources":["../../src/core/WorkspaceModelFactory.ts"],"names":[],"mappings":"AAEA,OAAO,EAAgB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAW5D,MAAM,OAAgB,qBAGpB,SAAQ,YAA8C;IAItD,YAAY,IAAY;QACtB,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,SAAS,CAAC,MAAuB;QAC/B,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;IAED,aAAa;QACX,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACpC,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,WAAC,OAAA,MAAA,EAAE,CAAC,cAAc,mDAAG,EAAE,KAAK,EAAE,CAAC,CAAA,EAAA,CAAC,CAAC;QAC9D,OAAO,KAAK,CAAC;IACf,CAAC;CAKF","sourcesContent":["import { WorkspaceModel } from '../core-models/WorkspaceModel';\nimport { WorkspaceEngine } from './WorkspaceEngine';\nimport { BaseListener, BaseObserver } from './BaseObserver';\n\nexport interface WorkspaceModelFactoryEvent<T extends WorkspaceModel> {\n  engine: WorkspaceEngine;\n  model: T;\n}\n\nexport interface WorkspaceModelFactoryListener<T> extends BaseListener {\n  modelGenerated: (event: { model: T }) => any;\n}\n\nexport abstract class WorkspaceModelFactory<\n  T extends WorkspaceModel = WorkspaceModel,\n  E extends WorkspaceModelFactoryEvent<T> = WorkspaceModelFactoryEvent<T>\n> extends BaseObserver<WorkspaceModelFactoryListener<T>> {\n  type: string;\n  engine: WorkspaceEngine;\n\n  constructor(type: string) {\n    super();\n    this.type = type;\n  }\n\n  setEngine(engine: WorkspaceEngine) {\n    this.engine = engine;\n  }\n\n  generateModel(): T {\n    const model = this._generateModel();\n    this.iterateListeners((cb) => cb.modelGenerated?.({ model }));\n    return model;\n  }\n\n  protected abstract _generateModel(): T;\n\n  abstract generateContent(event: E): JSX.Element;\n}\n"]}
+{"version":3,"file":"WorkspaceModelFactory.js","sourceRoot":"","sources":["../../src/core/WorkspaceModelFactory.ts"],"names":[],"mappings":"AAEA,OAAO,EAAgB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAW5D,MAAM,OAAgB,qBAGpB,SAAQ,YAA8C;IAItD,YAAY,IAAY;QACtB,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,SAAS,CAAC,MAAuB;QAC/B,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,CAAC;IAED,aAAa;QACX,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QACpC,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,WAAC,OAAA,MAAA,EAAE,CAAC,cAAc,mDAAG,EAAE,KAAK,EAAE,CAAC,CAAA,EAAA,CAAC,CAAC;QAC9D,OAAO,KAAK,CAAC;IACf,CAAC;CAKF","sourcesContent":["import { WorkspaceModel } from '../core-models/WorkspaceModel';\nimport { WorkspaceEngine } from './WorkspaceEngine';\nimport { BaseListener, BaseObserver } from './BaseObserver';\n\nexport interface WorkspaceModelFactoryEvent<T extends WorkspaceModel> {\n  engine: WorkspaceEngine;\n  model: T;\n}\n\nexport interface WorkspaceModelFactoryListener<T> extends BaseListener {\n  modelGenerated: (event: { model: T }) => any;\n}\n\nexport abstract class WorkspaceModelFactory<\n  T extends WorkspaceModel = WorkspaceModel,\n  E extends WorkspaceModelFactoryEvent<T> = WorkspaceModelFactoryEvent<T>\n> extends BaseObserver<WorkspaceModelFactoryListener<T>> {\n  type: string;\n  engine: WorkspaceEngine;\n\n  constructor(type: string) {\n    super();\n    this.type = type;\n  }\n\n  setEngine(engine: WorkspaceEngine) {\n    this.engine = engine;\n  }\n\n  generateModel(): T {\n    const model = this._generateModel();\n    this.iterateListeners((cb) => cb.modelGenerated?.({ model }));\n    return model;\n  }\n\n  protected abstract _generateModel(): T;\n\n  abstract generateContent(event: E): React.JSX.Element;\n}\n"]}

dist/entities/node/WorkspaceNodeFactory.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"WorkspaceNodeFactory.jsx","sourceRoot":"","sources":["../../../src/entities/node/WorkspaceNodeFactory.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,wBAAwB,EAAwB,MAAM,6BAA6B,CAAC;AAC7F,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAWtD,MAAM,OAAO,oBAGX,SAAQ,wBAA8B;IACtC,YAAY,OAAe,kBAAkB,CAAC,IAAI;QAChD,KAAK,CAAC,IAAI,CAAC,CAAC;IACd,CAAC;IAED,eAAe,CAAC,KAAoC;QAClD,IAAI,KAAK,CAAC,KAAK,YAAY,eAAe,EAAE,CAAC;YAC3C,OAAO,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,EAAG,CAAC;QACvF,CAAC;QACD,OAAO,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,EAAG,CAAC;IAC1F,CAAC;IAES,cAAc;QACtB,OAAO,IAAI,kBAAkB,EAAO,CAAC;IACvC,CAAC;CACF","sourcesContent":["import { WorkspaceNodeModel } from './WorkspaceNodeModel';\nimport * as React from 'react';\nimport { WorkspaceModelFactoryEvent } from '../../core/WorkspaceModelFactory';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport { SubComponentModelFactory, SubComponentRenderer } from '../SubComponentModelFactory';\nimport { WorkspaceNodeWidget } from './WorkspaceNodeWidget';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { ExpandNodeModel } from './ExpandNodeModel';\nimport { ExpandNodeWidget } from './ExpandNodeWidget';\n\nexport interface RenderTitleBarEvent<T extends WorkspaceModel> {\n  model: T;\n  engine: WorkspaceEngine;\n}\n\nexport interface WorkspaceNodePanelRenderer<T extends WorkspaceModel = WorkspaceModel> extends SubComponentRenderer<T> {\n  renderTitleBar(model: RenderTitleBarEvent<T>): JSX.Element;\n}\n\nexport class WorkspaceNodeFactory<\n  T extends WorkspaceNodeModel = WorkspaceNodeModel,\n  R extends WorkspaceNodePanelRenderer = WorkspaceNodePanelRenderer\n> extends SubComponentModelFactory<T, R> {\n  constructor(type: string = WorkspaceNodeModel.NAME) {\n    super(type);\n  }\n\n  generateContent(event: WorkspaceModelFactoryEvent<T>): React.JSX.Element {\n    if (event.model instanceof ExpandNodeModel) {\n      return <ExpandNodeWidget model={event.model} engine={event.engine} factory={this} />;\n    }\n    return <WorkspaceNodeWidget model={event.model} engine={event.engine} factory={this} />;\n  }\n\n  protected _generateModel(): T {\n    return new WorkspaceNodeModel() as T;\n  }\n}\n"]}
+{"version":3,"file":"WorkspaceNodeFactory.jsx","sourceRoot":"","sources":["../../../src/entities/node/WorkspaceNodeFactory.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,wBAAwB,EAAwB,MAAM,6BAA6B,CAAC;AAC7F,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAWtD,MAAM,OAAO,oBAGX,SAAQ,wBAA8B;IACtC,YAAY,OAAe,kBAAkB,CAAC,IAAI;QAChD,KAAK,CAAC,IAAI,CAAC,CAAC;IACd,CAAC;IAED,eAAe,CAAC,KAAoC;QAClD,IAAI,KAAK,CAAC,KAAK,YAAY,eAAe,EAAE,CAAC;YAC3C,OAAO,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,EAAG,CAAC;QACvF,CAAC;QACD,OAAO,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,EAAG,CAAC;IAC1F,CAAC;IAES,cAAc;QACtB,OAAO,IAAI,kBAAkB,EAAO,CAAC;IACvC,CAAC;CACF","sourcesContent":["import { WorkspaceNodeModel } from './WorkspaceNodeModel';\nimport * as React from 'react';\nimport { WorkspaceModelFactoryEvent } from '../../core/WorkspaceModelFactory';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport { SubComponentModelFactory, SubComponentRenderer } from '../SubComponentModelFactory';\nimport { WorkspaceNodeWidget } from './WorkspaceNodeWidget';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { ExpandNodeModel } from './ExpandNodeModel';\nimport { ExpandNodeWidget } from './ExpandNodeWidget';\n\nexport interface RenderTitleBarEvent<T extends WorkspaceModel> {\n  model: T;\n  engine: WorkspaceEngine;\n}\n\nexport interface WorkspaceNodePanelRenderer<T extends WorkspaceModel = WorkspaceModel> extends SubComponentRenderer<T> {\n  renderTitleBar(model: RenderTitleBarEvent<T>): React.JSX.Element;\n}\n\nexport class WorkspaceNodeFactory<\n  T extends WorkspaceNodeModel = WorkspaceNodeModel,\n  R extends WorkspaceNodePanelRenderer = WorkspaceNodePanelRenderer\n> extends SubComponentModelFactory<T, R> {\n  constructor(type: string = WorkspaceNodeModel.NAME) {\n    super(type);\n  }\n\n  generateContent(event: WorkspaceModelFactoryEvent<T>): React.JSX.Element {\n    if (event.model instanceof ExpandNodeModel) {\n      return <ExpandNodeWidget model={event.model} engine={event.engine} factory={this} />;\n    }\n    return <WorkspaceNodeWidget model={event.model} engine={event.engine} factory={this} />;\n  }\n\n  protected _generateModel(): T {\n    return new WorkspaceNodeModel() as T;\n  }\n}\n"]}

dist/index.umd.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["@projectstorm/react-workspaces-core"]=t():e["@projectstorm/react-workspaces-core"]=t()}(self,(()=>(()=>{"use strict";var e={n:t=>{var i=t&&t.__esModule?()=>t.default:()=>t;return e.d(i,{a:i}),i},d:(t,i)=>{for(var n in i)e.o(i,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:i[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Alignment:()=>p,Corner:()=>y,DebugLayer:()=>he,DebugLayerWidget:()=>ge,DebugPanel:()=>ue,DimensionContainer:()=>l,DimensionTrackingWidget:()=>V,DirectionChildWidget:()=>Ee,DirectionalLayoutWidget:()=>be,DividerWidget:()=>G,DraggableWidget:()=>Y,DropZoneDragContext:()=>_,DropzoneLogicWidget:()=>K,ExpandNodeModel:()=>De,ExpandNodeWidget:()=>Ae,Layer:()=>J,LayerManager:()=>Q,LayerManagerWidget:()=>me,LayerWidget:()=>pe,OrderingWidget:()=>oe,OrderingWidgetZone:()=>se,Position:()=>a,Size:()=>o,SmartOrderingWidget:()=>ae,SubComponentModelFactory:()=>ze,UseMouseDragEventsRootWidget:()=>D,WORKSPACE_MODEL_ID_MIME:()=>W,WORKSPACE_MODEL_MIME:()=>F,WorkspaceCollectionModel:()=>v,WorkspaceEngine:()=>Te,WorkspaceEngineError:()=>_e,WorkspaceModel:()=>u,WorkspaceModelFactory:()=>Oe,WorkspaceModelSize:()=>h,WorkspaceNodeFactory:()=>We,WorkspaceNodeModel:()=>ce,WorkspaceNodePanelWidget:()=>Ie,WorkspaceNodeWidget:()=>ke,WorkspaceWidget:()=>Me,getAlignmentInverted:()=>m,log:()=>w,overConstrainRecomputeBehavior:()=>Ne,regenerateIDs:()=>f,useDimensionLayoutInvalidator:()=>L,useDragOver:()=>I,useDragOverModel:()=>A,useDraggableModel:()=>N,useDroppable:()=>k,useDroppableModel:()=>H,useForceUpdate:()=>M,useModelElement:()=>R,useMouseDragDistance:()=>n,useMouseDragEvents:()=>T,useResizeObserver:()=>b,useScrollObserver:()=>O,useWindowResize:()=>E});const i=require("react"),n=e=>{(0,i.useEffect)((()=>{const t=t=>{var i;if(0!==t.button)return;null===(i=e.startMove)||void 0===i||i.call(e);const n=i=>{e.moved({event:i,distanceX:i.clientX-t.clientX,distanceY:i.clientY-t.clientY})},r=()=>{var t;null===(t=e.endMove)||void 0===t||t.call(e),window.removeEventListener("mouseup",r),window.removeEventListener("mousemove",n)};window.addEventListener("mouseup",r),window.addEventListener("mousemove",n)};return e.forwardRef.current.addEventListener("mousedown",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("mousedown",t)}}),[])},r=require("uuid");class s{constructor(){this.listeners={}}registerListener(e,t){const i=(0,r.v4)();return this.listeners[i]={l:e,meta:t},()=>{delete this.listeners[i]}}iterateListeners(e){for(let t in this.listeners)e(this.listeners[t].l)}}class o extends s{constructor(){super(),this._width=0,this._height=0}get width(){return this._width}get height(){return this._height}set width(e){this.update({width:e})}valid(){return this.getVolume()>0}set height(e){this.update({height:e})}get value(){return{width:this._width,height:this._height}}isPortrait(){return this.height>this.width}getVolume(){return this.width*this.height}trackSize(e){return this.update(e.value),e.registerListener({updated:()=>{this.update(e.value)}})}update(e){let t=!1,i={width:this._width,height:this._height};null!=e.width&&e.width!==this.width&&(this._width=e.width,t=!0),null!=e.height&&e.height!==this.height&&(this._height=e.height,t=!0),t&&this.iterateListeners((e=>{var t;return null===(t=e.updated)||void 0===t?void 0:t.call(e,{prev:i})}))}}class a extends s{constructor(){super(),this._top=0,this._left=0,this._bottom=0,this._right=0}get top(){return this._top}get left(){return this._left}get bottom(){return this._bottom}get right(){return this._right}getRelativeToPosition(e){return{top:this._top-e.top,left:this._left-e.left,right:this._right-e.right,bottom:this._bottom-e.bottom}}getRelativeToMousePosition(e){return{clientX:this._left-e.clientX,clientY:this._top-e.clientY}}update(e){let t=!1;null!=e[p.TOP]&&e[p.TOP]!==this._top&&(this._top=e[p.TOP],t=!0),null!=e[p.LEFT]&&e[p.LEFT]!==this._left&&(this._left=e[p.LEFT],t=!0),null!=e[p.BOTTOM]&&e[p.BOTTOM]!==this._bottom&&(this._bottom=e[p.BOTTOM],t=!0),null!=e[p.RIGHT]&&e[p.RIGHT]!==this._right&&(this._right=e[p.RIGHT],t=!0),t&&this.iterateListeners((e=>{var t;return null===(t=e.updated)||void 0===t?void 0:t.call(e)}))}}var d=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};class l extends s{constructor(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};super(),this.fireUpdated=()=>{this.iterateListeners((e=>{var t;return null===(t=e.updated)||void 0===t?void 0:t.call(e)}))},this.id=(0,r.v4)(),this.size=e.size||new o,this.position=e.position||new a,this.size.registerListener({updated:()=>{this.fireUpdated()}}),this.position.registerListener({updated:()=>{this.fireUpdated()}})}waitForSize(){return d(this,void 0,void 0,(function*(){return 0==this.size.getVolume()&&(yield new Promise((e=>{const t=this.registerListener({updated:()=>{this.size.getVolume()>0&&(t(),e())}})}))),this.size}))}get dimensions(){return{top:this.position.top,left:this.position.left,bottom:this.position.bottom,right:this.position.right,width:this.size.width,height:this.size.height}}isPortrait(){return this.size.isPortrait()}getVolume(){return this.size.getVolume()}invalidate(e){this.iterateListeners((t=>{var i;return null===(i=t.invalidate)||void 0===i?void 0:i.call(t,e)}))}update(e){this.size.update(e),this.position.update(e)}getRelativeToPosition(e){return this.position.getRelativeToPosition(e)}getRelativeToMousePosition(e){return this.position.getRelativeToMousePosition(e)}isAligned(e,t){const i=this.getRelativeToPosition(e.position)[t];return t===p.LEFT?i<=e.dimensions.width/2:t===p.RIGHT?i>e.dimensions.width/2:t===p.TOP?i<=e.dimensions.height/2:t===p.BOTTOM?i>e.dimensions.height/2:void 0}}var c=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};class h extends o{constructor(e,t){super(),this.min=e,this.max=t,this.min.registerListener({updated:()=>{this.update(this.value)}}),this.max.registerListener({updated:()=>{this.update(this.value)}})}update(e){null!=e.width&&(e.width<this.min.width?e.width=this.min.width:this.max.width>0&&e.width>this.max.width&&(e.width=this.max.width)),null!=e.height&&(e.height<this.min.height?e.height=this.min.height:this.max.height>0&&e.width>this.max.height&&(e.height=this.max.height)),super.update(e)}}class u extends s{constructor(e){super(),this.type=e,this.id=(0,r.v4)(),this.parent=null,this._expandHorizontal=!0,this._expandVertical=!0,this.minimumSize=new o,this.maximumSize=new o,this.size=new h(this.minimumSize,this.maximumSize),this.r_visible=!1,this.r_dimensions=new l,this.r_dimensions.registerListener({updated:()=>{0===this.size.width&&0===this.size.height&&this.setSize({width:this.r_dimensions.dimensions.width,height:this.r_dimensions.dimensions.height})}}),this.size.registerListener({updated:()=>{this.invalidateDimensions()}})}get expandHorizontal(){return this._expandHorizontal}set expandHorizontal(e){this._expandHorizontal=e}get expandVertical(){return this._expandVertical}set expandVertical(e){this._expandVertical=e}waitForInitialRenderedSize(){return c(this,void 0,void 0,(function*(){return new Promise((e=>{let t,i;t=this.r_dimensions.registerListener({updated:()=>{this.r_dimensions.size.width>0&&(e(this.r_dimensions.dimensions),null==t||t(),null==i||i())}}),i=this.registerListener({visibilityChanged:()=>{this.r_visible&&this.r_dimensions.invalidate(!0)}})}))}))}setWidth(e){this.setSize({width:e})}setHeight(e){this.setSize({height:e})}setSize(e){this.size.update(e)}getAllRenderDimensions(){return[this.r_dimensions]}invalidateDimensions(){this.iterateListeners((e=>{var t;return null===(t=e.dimensionsInvalidated)||void 0===t?void 0:t.call(e)}))}invalidateLayout(){this.iterateListeners((e=>{var t;return null===(t=e.layoutInvalidated)||void 0===t?void 0:t.call(e)}))}setVisible(e){this.r_visible!==e&&(this.r_visible=e,this.iterateListeners((e=>{var t;return null===(t=e.visibilityChanged)||void 0===t?void 0:t.call(e)})))}fireNodeRemoved(){this.iterateListeners((e=>{e.removed&&e.removed()}))}getSibling(e){return this.parent instanceof v?this.parent.getChildSibling(this,e):null}delete(){this.fireNodeRemoved()}hasParentID(e){return this.id===e||!!this.parent&&this.parent.hasParentID(e)}setParent(e){this.parent=e}getRootModel(){return this.parent?this.parent.getRootModel():this}setExpand(){let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];return this._expandHorizontal=e,this._expandVertical=t,this}flatten(){return[this]}toArray(){return{id:this.id,type:this.type,expandHorizontal:this._expandHorizontal,expandVertical:this._expandVertical,width:this.size.width,height:this.size.height}}fromArray(e,t){this.id=e.id,this._expandHorizontal=e.expandHorizontal,this._expandVertical=e.expandVertical,this.size.update({width:e.width,height:e.height})}}const g=require("lodash");class v extends u{constructor(e){super(e),this.children=[]}fromArray(e,t){super.fromArray(e,t);for(let i of e.children){let e;try{e=t.getFactory(i.type)}catch(e){continue}let n=e.generateModel();n.fromArray(i,t),this.addModel(n)}}toArray(){return Object.assign(Object.assign({},super.toArray()),{children:this.children.map((e=>e.toArray()))})}isFirstModel(e){return this.children[0].id===e.id}isLastModel(e){return this.children[this.children.length-1].id===e.id}flatten(){const e=g.flatMap(this.children.map((e=>e.flatten())));return super.flatten().concat(e)}getFlattened(){let e=[];for(let t of this.children)t instanceof v?e=e.concat(t.getFlattened()):e.push(t);return e}replaceModel(e,t){let i=this.children.indexOf(e);return e.delete(),this.addModel(t,i),this}getModelBefore(e){const t=this.children.indexOf(e);return t<=0?null:this.children[t-1]}getModelAfter(e){const t=this.children.indexOf(e);return t>=this.children.length-1?null:this.children[t+1]}normalize(){this.parent&&this.parent instanceof v&&0===this.children.length&&this.parent.removeModel(this)}removeModel(e){let t=this.children.indexOf(e);return-1===t?(console.log("could not find model"),this):(this.children.splice(t,1),this.invalidateLayout(),this)}addModel(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(-1!==this.children.indexOf(e)){const i=this.children.indexOf(e);this.children.splice(i,1),i>t?this.children.splice(t,0,e):this.children.splice(t-1,0,e)}else{e.parent&&e.delete(),e.setParent(this);const i=e.registerListener({removed:()=>{i(),this.removeModel(e),this.iterateListeners((t=>{var i;null===(i=t.childRemoved)||void 0===i||i.call(t,e)}))},layoutInvalidated:()=>{this.invalidateLayout()},dimensionsInvalidated:()=>{this.invalidateDimensions()}});null===t?this.children.push(e):this.children.splice(t,0,e)}return this.invalidateLayout(),this}addModelBefore(e,t){let i=this.children.indexOf(e);this.addModel(t,i)}addModelAfter(e,t){let i=this.children.indexOf(e);this.addModel(t,i+1)}getChildSibling(e,t){return null}}const f=e=>{e instanceof v&&e.children.forEach((e=>f(e))),e.id=(0,r.v4)()};var p;!function(e){e.TOP="top",e.LEFT="left",e.BOTTOM="bottom",e.RIGHT="right"}(p||(p={}));const m=e=>({[p.TOP]:p.BOTTOM,[p.BOTTOM]:p.TOP,[p.LEFT]:p.RIGHT,[p.RIGHT]:p.LEFT}[e]);var y;!function(e){e.TOP_LEFT="nw",e.TOP_RIGHT="ne",e.BOTTOM_RIGHT="se",e.BOTTOM_LEFT="sw"}(y||(y={}));const w=function(){for(var e=arguments.length,t=new Array(e),i=0;i<e;i++)t[i]=arguments[i];console.debug("[SRW] ",...t)},E=e=>{(0,i.useEffect)((()=>{const t=()=>{e.resized()};return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}}),[])},x=e=>{const t=(0,i.useCallback)((()=>{var t;if(!e.forwardRef.current)return;let i=e.forwardRef.current.getBoundingClientRect();const n={width:i.width,height:i.height,[p.TOP]:i.top,[p.LEFT]:i.left,[p.BOTTOM]:i.bottom,[p.RIGHT]:i.right};e.dimension.update((null===(t=e.transformer)||void 0===t?void 0:t.call(e,n))||n)}),[e.dimension]),n=(0,i.useCallback)(g.debounce((()=>{t()}),500,{leading:!0}),[e.dimension]),r=(0,i.useCallback)((()=>{e.ignoreDebounce?t():n(),t()}),[e.dimension,e.ignoreDebounce]);(0,i.useEffect)((()=>e.dimension.registerListener({invalidate:e=>{e?t():r()}})),[e.dimension]),E({resized:()=>{r()}}),(0,i.useEffect)((()=>{const t=new IntersectionObserver((()=>{r()}),{root:document.body});return t.observe(e.forwardRef.current),()=>{e.forwardRef.current&&t.unobserve(e.forwardRef.current),t.disconnect()}}),[e.dimension]),(0,i.useEffect)((()=>{r();const t=new ResizeObserver((()=>{r()}));return t.observe(e.forwardRef.current),()=>{e.forwardRef.current&&t.unobserve(e.forwardRef.current),t.disconnect()}}),[e.dimension])},L=e=>{(0,i.useEffect)((()=>{let t=null;const i=e.engine.registerListener({layoutInvalidated:()=>{t=e.engine.registerListener({layoutRepainted:()=>{null==t||t(),t=null,e.dimension.invalidate()}})}});return()=>{i(),null==t||t()}}),[e.dimension])},b=e=>{x(Object.assign(Object.assign({},e),{transformer:t=>Object.assign(Object.assign({},t),{[p.TOP]:t[p.TOP]-e.engine.workspaceContainer.position.top,[p.LEFT]:t[p.LEFT]-e.engine.workspaceContainer.position.left,[p.BOTTOM]:t[p.BOTTOM]-e.engine.workspaceContainer.position.bottom,[p.RIGHT]:t[p.RIGHT]-e.engine.workspaceContainer.position.right})})),L({engine:e.engine,dimension:e.dimension}),(0,i.useEffect)((()=>e.engine.workspaceContainer.registerListener({updated:()=>{e.dimension.invalidate()}})),[])},R=e=>{const t=i.useRef();return b({forwardRef:t,dimension:e.model.r_dimensions,engine:e.engine}),(0,i.useEffect)((()=>(e.model.setVisible(!0),()=>{e.model.setVisible(!1)})),[e.model]),t};function M(e){const[t,n]=(0,i.useState)(0);return()=>{if(e)return g.debounce((()=>{n((e=>e+1))}));n((e=>e+1))}}const O=e=>{(0,i.useEffect)((()=>{const t=()=>{e.dimension.invalidate()};return e.forwardRef.current.addEventListener("scroll",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("scroll",t)}}),[])},_=i.createContext(null),T=e=>{const t=(0,i.useContext)(_);(0,i.useEffect)((()=>{const i=i=>{var n;t.increment(),null===(n=e.mouseEnter)||void 0===n||n.call(e)},n=()=>{var i;t.decrement(),null===(i=e.mouseExit)||void 0===i||i.call(e)};return e.forwardRef.current.addEventListener("dragenter",i),e.forwardRef.current.addEventListener("dragleave",n),e.forwardRef.current.addEventListener("drop",n),()=>{var t,r,s;null===(t=e.forwardRef.current)||void 0===t||t.removeEventListener("dragenter",i),null===(r=e.forwardRef.current)||void 0===r||r.removeEventListener("dragleave",n),null===(s=e.forwardRef.current)||void 0===s||s.removeEventListener("drop",n)}}),[])},C=e=>(T({forwardRef:e.forwardRef}),e.children),D=e=>{const t=(0,i.useRef)(0);return i.createElement(_.Provider,{value:{increment:()=>{var i;t.current=t.current+1,t.current>0&&(null===(i=e.mouseEnter)||void 0===i||i.call(e))},decrement:()=>{var i;t.current=t.current-1,0===t.current&&(null===(i=e.mouseExit)||void 0===i||i.call(e))}}},i.createElement(C,e,e.children))};var z=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};const k=e=>{(0,i.useEffect)((()=>{const t=t=>z(void 0,void 0,void 0,(function*(){let i={};for(let e of t.dataTransfer.types){let n=t.dataTransfer.getData(e);try{i[e]=JSON.parse(n)}catch(e){console.warn("Failed to deserialize draggable object",e)}}w("dropped data:",i),e.dropped(i,{position:t,isCopy:"copy"===t.dataTransfer.effectAllowed})}));return e.forwardRef.current.addEventListener("drop",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("drop",t)}}),[e.forwardRef])},I=e=>{(0,i.useEffect)((()=>{const t=t=>{var i;let n=!1;for(let i=0;i<t.dataTransfer.types.length;++i)e.acceptedTypes.some((e=>t.dataTransfer.types[i].startsWith(e)))&&(n=!0);n&&(e.accept&&t.preventDefault(),null===(i=e.dragOver)||void 0===i||i.call(e,t.dataTransfer.types))};return e.forwardRef.current.addEventListener("dragover",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("dragover",t)}}),[e.forwardRef])};var P=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};const S=e=>{(0,i.useEffect)((()=>{const t=t=>{t.stopPropagation();const i=e.encode();if(i){t.dataTransfer.dropEffect="none",t.altKey?(w("dragging as a copy operation"),t.dataTransfer.effectAllowed="copy"):t.dataTransfer.effectAllowed="move";for(let e in i)w(`setting up mime: ${e}`),t.dataTransfer.setData(e,JSON.stringify(i[e]))}},i=t=>P(void 0,void 0,void 0,(function*(){"none"!==t.dataTransfer.dropEffect?e.dragend({copy:"copy"===t.dataTransfer.dropEffect,success:!0}):e.dragend({copy:!1,success:!1})}));return e.forwardRef.current.addEventListener("dragstart",t),e.forwardRef.current.addEventListener("dragend",i),()=>{var n,r;null===(n=e.forwardRef.current)||void 0===n||n.removeEventListener("dragstart",t),null===(r=e.forwardRef.current)||void 0===r||r.removeEventListener("dragend",i)}}),[e.forwardRef])},A=e=>{I({acceptedTypes:[F],accept:e.accept,dragOver:t=>{var i;const n=t.find((e=>e.startsWith(W)));if(!n)return;const r=n.substring(W.length);null===(i=e.dragOver)||void 0===i||i.call(e,{modelID:r})},forwardRef:e.forwardRef})},F="srw/model",W="srw/modelid/",N=e=>{S({encode:()=>({[F]:e.model.toArray(),[W+e.model.id]:e.model.id}),dragend:t=>{let{copy:i,success:n}=t;n&&!i&&(e.engine.draggingID||(e.model.delete(),e.engine.normalize())),e.engine.setDraggingNode(null)},forwardRef:e.forwardRef})},H=e=>{A({dragOver:e.onDragover,forwardRef:e.forwardRef,accept:!0}),k({dropped:(t,i)=>{let n=e.engine.getFactory(t[F].type).generateModel();if(n.fromArray(t[F],e.engine),i.isCopy)w("was a copy operation, regenerating ids"),f(n);else{const t=e.engine.rootModel.flatten().find((e=>e.id===n.id));n=t||n}w("workspace model dropped",n),e.onDrop(n)},forwardRef:e.forwardRef})},j=require("@emotion/styled");var $=e.n(j);const V=e=>{const t=M();return(0,i.useEffect)((()=>(g.defer((()=>{t()})),e.dimension.registerListener({updated:()=>{t()}}))),[e.dimension]),i.createElement(B.Container,{ref:e.forwardRef,className:e.className,d:e.dimension.dimensions,animate:e.animateDuration||0},e.children)};var B;!function(e){e.Container=$().div`
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports["@projectstorm/react-workspaces-core"]=t():e["@projectstorm/react-workspaces-core"]=t()}(self,(()=>(()=>{"use strict";var e={n:t=>{var i=t&&t.__esModule?()=>t.default:()=>t;return e.d(i,{a:i}),i},d:(t,i)=>{for(var n in i)e.o(i,n)&&!e.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:i[n]})},o:(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}},t={};e.r(t),e.d(t,{Alignment:()=>p,Corner:()=>y,DebugLayer:()=>he,DebugLayerWidget:()=>ge,DebugPanel:()=>ue,DimensionContainer:()=>l,DimensionTrackingWidget:()=>V,DirectionChildWidget:()=>Ee,DirectionalLayoutWidget:()=>be,DividerWidget:()=>G,DraggableWidget:()=>Y,DropZoneDragContext:()=>_,DropzoneLogicWidget:()=>K,ExpandNodeModel:()=>De,ExpandNodeWidget:()=>Ae,Layer:()=>J,LayerManager:()=>Q,LayerManagerWidget:()=>me,LayerWidget:()=>pe,OrderingWidget:()=>oe,OrderingWidgetZone:()=>se,Position:()=>a,Size:()=>o,SmartOrderingWidget:()=>ae,SubComponentModelFactory:()=>ze,UseMouseDragEventsRootWidget:()=>D,WORKSPACE_MODEL_ID_MIME:()=>W,WORKSPACE_MODEL_MIME:()=>F,WorkspaceCollectionModel:()=>v,WorkspaceEngine:()=>Te,WorkspaceEngineError:()=>_e,WorkspaceModel:()=>u,WorkspaceModelFactory:()=>Oe,WorkspaceModelSize:()=>h,WorkspaceNodeFactory:()=>We,WorkspaceNodeModel:()=>ce,WorkspaceNodePanelWidget:()=>Ie,WorkspaceNodeWidget:()=>ke,WorkspaceWidget:()=>Me,getAlignmentInverted:()=>m,log:()=>w,overConstrainRecomputeBehavior:()=>Ne,regenerateIDs:()=>f,useDimensionLayoutInvalidator:()=>L,useDragOver:()=>I,useDragOverModel:()=>A,useDraggableModel:()=>N,useDroppable:()=>k,useDroppableModel:()=>H,useForceUpdate:()=>M,useModelElement:()=>R,useMouseDragDistance:()=>n,useMouseDragEvents:()=>T,useResizeObserver:()=>b,useScrollObserver:()=>O,useWindowResize:()=>E});const i=require("react"),n=e=>{(0,i.useEffect)((()=>{const t=t=>{var i;if(0!==t.button)return;null===(i=e.startMove)||void 0===i||i.call(e);const n=i=>{e.moved({event:i,distanceX:i.clientX-t.clientX,distanceY:i.clientY-t.clientY})},r=()=>{var t;null===(t=e.endMove)||void 0===t||t.call(e),window.removeEventListener("mouseup",r),window.removeEventListener("mousemove",n)};window.addEventListener("mouseup",r),window.addEventListener("mousemove",n)};return e.forwardRef.current.addEventListener("mousedown",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("mousedown",t)}}),[])},r=require("uuid");class s{constructor(){this.listeners={}}registerListener(e,t){const i=(0,r.v4)();return this.listeners[i]={l:e,meta:t},()=>{delete this.listeners[i]}}iterateListeners(e){for(let t in this.listeners)e(this.listeners[t].l)}}class o extends s{constructor(){super(),this._width=0,this._height=0}get width(){return this._width}get height(){return this._height}set width(e){this.update({width:e})}valid(){return this.getVolume()>0}set height(e){this.update({height:e})}get value(){return{width:this._width,height:this._height}}isPortrait(){return this.height>this.width}getVolume(){return this.width*this.height}trackSize(e){return this.update(e.value),e.registerListener({updated:()=>{this.update(e.value)}})}update(e){let t=!1,i={width:this._width,height:this._height};null!=e.width&&e.width!==this.width&&(this._width=e.width,t=!0),null!=e.height&&e.height!==this.height&&(this._height=e.height,t=!0),t&&this.iterateListeners((e=>{var t;return null===(t=e.updated)||void 0===t?void 0:t.call(e,{prev:i})}))}}class a extends s{constructor(){super(),this._top=0,this._left=0,this._bottom=0,this._right=0}get top(){return this._top}get left(){return this._left}get bottom(){return this._bottom}get right(){return this._right}getRelativeToPosition(e){return{top:this._top-e.top,left:this._left-e.left,right:this._right-e.right,bottom:this._bottom-e.bottom}}getRelativeToMousePosition(e){return{clientX:this._left-e.clientX,clientY:this._top-e.clientY}}update(e){let t=!1;null!=e[p.TOP]&&e[p.TOP]!==this._top&&(this._top=e[p.TOP],t=!0),null!=e[p.LEFT]&&e[p.LEFT]!==this._left&&(this._left=e[p.LEFT],t=!0),null!=e[p.BOTTOM]&&e[p.BOTTOM]!==this._bottom&&(this._bottom=e[p.BOTTOM],t=!0),null!=e[p.RIGHT]&&e[p.RIGHT]!==this._right&&(this._right=e[p.RIGHT],t=!0),t&&this.iterateListeners((e=>{var t;return null===(t=e.updated)||void 0===t?void 0:t.call(e)}))}}var d=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};class l extends s{constructor(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};super(),this.fireUpdated=()=>{this.iterateListeners((e=>{var t;return null===(t=e.updated)||void 0===t?void 0:t.call(e)}))},this.id=(0,r.v4)(),this.size=e.size||new o,this.position=e.position||new a,this.size.registerListener({updated:()=>{this.fireUpdated()}}),this.position.registerListener({updated:()=>{this.fireUpdated()}})}waitForSize(){return d(this,void 0,void 0,(function*(){return 0==this.size.getVolume()&&(yield new Promise((e=>{const t=this.registerListener({updated:()=>{this.size.getVolume()>0&&(t(),e())}})}))),this.size}))}get dimensions(){return{top:this.position.top,left:this.position.left,bottom:this.position.bottom,right:this.position.right,width:this.size.width,height:this.size.height}}isPortrait(){return this.size.isPortrait()}getVolume(){return this.size.getVolume()}invalidate(e){this.iterateListeners((t=>{var i;return null===(i=t.invalidate)||void 0===i?void 0:i.call(t,e)}))}update(e){this.size.update(e),this.position.update(e)}getRelativeToPosition(e){return this.position.getRelativeToPosition(e)}getRelativeToMousePosition(e){return this.position.getRelativeToMousePosition(e)}isAligned(e,t){const i=this.getRelativeToPosition(e.position)[t];return t===p.LEFT?i<=e.dimensions.width/2:t===p.RIGHT?i>e.dimensions.width/2:t===p.TOP?i<=e.dimensions.height/2:t===p.BOTTOM?i>e.dimensions.height/2:void 0}}var c=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};class h extends o{constructor(e,t){super(),this.min=e,this.max=t,this.min.registerListener({updated:()=>{this.update(this.value)}}),this.max.registerListener({updated:()=>{this.update(this.value)}})}update(e){null!=e.width&&(e.width<this.min.width?e.width=this.min.width:this.max.width>0&&e.width>this.max.width&&(e.width=this.max.width)),null!=e.height&&(e.height<this.min.height?e.height=this.min.height:this.max.height>0&&e.width>this.max.height&&(e.height=this.max.height)),super.update(e)}}class u extends s{constructor(e){super(),this.type=e,this.id=(0,r.v4)(),this.parent=null,this._expandHorizontal=!0,this._expandVertical=!0,this.minimumSize=new o,this.maximumSize=new o,this.size=new h(this.minimumSize,this.maximumSize),this.r_visible=!1,this.r_dimensions=new l,this.r_dimensions.registerListener({updated:()=>{0===this.size.width&&0===this.size.height&&this.setSize({width:this.r_dimensions.dimensions.width,height:this.r_dimensions.dimensions.height})}}),this.size.registerListener({updated:()=>{this.invalidateDimensions()}})}get expandHorizontal(){return this._expandHorizontal}set expandHorizontal(e){this._expandHorizontal=e}get expandVertical(){return this._expandVertical}set expandVertical(e){this._expandVertical=e}waitForInitialRenderedSize(){return c(this,void 0,void 0,(function*(){return new Promise((e=>{let t,i;t=this.r_dimensions.registerListener({updated:()=>{this.r_dimensions.size.width>0&&(e(this.r_dimensions.dimensions),null==t||t(),null==i||i())}}),i=this.registerListener({visibilityChanged:()=>{this.r_visible&&this.r_dimensions.invalidate(!0)}})}))}))}setWidth(e){this.setSize({width:e})}setHeight(e){this.setSize({height:e})}setSize(e){this.size.update(e)}getAllRenderDimensions(){return[this.r_dimensions]}invalidateDimensions(){this.iterateListeners((e=>{var t;return null===(t=e.dimensionsInvalidated)||void 0===t?void 0:t.call(e)}))}invalidateLayout(){this.iterateListeners((e=>{var t;return null===(t=e.layoutInvalidated)||void 0===t?void 0:t.call(e)}))}setVisible(e){this.r_visible!==e&&(this.r_visible=e,this.iterateListeners((e=>{var t;return null===(t=e.visibilityChanged)||void 0===t?void 0:t.call(e)})))}fireNodeRemoved(){this.iterateListeners((e=>{e.removed&&e.removed()}))}getSibling(e){return this.parent instanceof v?this.parent.getChildSibling(this,e):null}delete(){this.fireNodeRemoved()}hasParentID(e){return this.id===e||!!this.parent&&this.parent.hasParentID(e)}setParent(e){this.parent=e}getRootModel(){return this.parent?this.parent.getRootModel():this}setExpand(){let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0],t=!(arguments.length>1&&void 0!==arguments[1])||arguments[1];return this._expandHorizontal=e,this._expandVertical=t,this}flatten(){return[this]}toArray(){return{id:this.id,type:this.type,expandHorizontal:this._expandHorizontal,expandVertical:this._expandVertical,width:this.size.width,height:this.size.height}}fromArray(e,t){this.id=e.id,this._expandHorizontal=e.expandHorizontal,this._expandVertical=e.expandVertical,this.size.update({width:e.width,height:e.height})}}const g=require("lodash");class v extends u{constructor(e){super(e),this.children=[]}fromArray(e,t){super.fromArray(e,t);for(let i of e.children){let e;try{e=t.getFactory(i.type)}catch(e){continue}let n=e.generateModel();n.fromArray(i,t),this.addModel(n)}}toArray(){return Object.assign(Object.assign({},super.toArray()),{children:this.children.map((e=>e.toArray()))})}isFirstModel(e){return this.children[0].id===e.id}isLastModel(e){return this.children[this.children.length-1].id===e.id}flatten(){const e=g.flatMap(this.children.map((e=>e.flatten())));return super.flatten().concat(e)}getFlattened(){let e=[];for(let t of this.children)t instanceof v?e=e.concat(t.getFlattened()):e.push(t);return e}replaceModel(e,t){let i=this.children.indexOf(e);return e.delete(),this.addModel(t,i),this}getModelBefore(e){const t=this.children.indexOf(e);return t<=0?null:this.children[t-1]}getModelAfter(e){const t=this.children.indexOf(e);return t>=this.children.length-1?null:this.children[t+1]}normalize(){this.parent&&this.parent instanceof v&&0===this.children.length&&this.parent.removeModel(this)}removeModel(e){let t=this.children.indexOf(e);return-1===t?(console.log("could not find model"),this):(this.children.splice(t,1),this.invalidateLayout(),this)}addModel(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;if(-1!==this.children.indexOf(e)){const i=this.children.indexOf(e);this.children.splice(i,1),i>t?this.children.splice(t,0,e):this.children.splice(t-1,0,e)}else{e.parent&&e.delete(),e.setParent(this);const i=e.registerListener({removed:()=>{i(),this.removeModel(e),this.iterateListeners((t=>{var i;null===(i=t.childRemoved)||void 0===i||i.call(t,e)}))},layoutInvalidated:()=>{this.invalidateLayout()},dimensionsInvalidated:()=>{this.invalidateDimensions()}});null===t?this.children.push(e):this.children.splice(t,0,e)}return this.invalidateLayout(),this}addModelBefore(e,t){let i=this.children.indexOf(e);this.addModel(t,i)}addModelAfter(e,t){let i=this.children.indexOf(e);this.addModel(t,i+1)}getChildSibling(e,t){return null}}const f=e=>{e instanceof v&&e.children.forEach((e=>f(e))),e.id=(0,r.v4)()};var p;!function(e){e.TOP="top",e.LEFT="left",e.BOTTOM="bottom",e.RIGHT="right"}(p||(p={}));const m=e=>({[p.TOP]:p.BOTTOM,[p.BOTTOM]:p.TOP,[p.LEFT]:p.RIGHT,[p.RIGHT]:p.LEFT}[e]);var y;!function(e){e.TOP_LEFT="nw",e.TOP_RIGHT="ne",e.BOTTOM_RIGHT="se",e.BOTTOM_LEFT="sw"}(y||(y={}));const w=function(){for(var e=arguments.length,t=new Array(e),i=0;i<e;i++)t[i]=arguments[i];console.debug("[SRW] ",...t)},E=e=>{(0,i.useEffect)((()=>{const t=()=>{e.resized()};return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}}),[])},x=e=>{const t=(0,i.useCallback)((()=>{var t;if(!e.forwardRef.current)return;let i=e.forwardRef.current.getBoundingClientRect();const n={width:i.width,height:i.height,[p.TOP]:i.top,[p.LEFT]:i.left,[p.BOTTOM]:i.bottom,[p.RIGHT]:i.right};e.dimension.update((null===(t=e.transformer)||void 0===t?void 0:t.call(e,n))||n)}),[e.dimension]),n=(0,i.useCallback)(g.debounce((()=>{t()}),500,{leading:!0}),[e.dimension]),r=(0,i.useCallback)((()=>{e.ignoreDebounce?t():n(),t()}),[e.dimension,e.ignoreDebounce]);(0,i.useEffect)((()=>e.dimension.registerListener({invalidate:e=>{e?t():r()}})),[e.dimension]),E({resized:()=>{r()}}),(0,i.useEffect)((()=>{const t=new IntersectionObserver((()=>{r()}),{root:document.body});return t.observe(e.forwardRef.current),()=>{e.forwardRef.current&&t.unobserve(e.forwardRef.current),t.disconnect()}}),[e.dimension]),(0,i.useEffect)((()=>{r();const t=new ResizeObserver((()=>{r()}));return t.observe(e.forwardRef.current),()=>{e.forwardRef.current&&t.unobserve(e.forwardRef.current),t.disconnect()}}),[e.dimension])},L=e=>{(0,i.useEffect)((()=>{let t=null;const i=e.engine.registerListener({layoutInvalidated:()=>{t=e.engine.registerListener({layoutRepainted:()=>{null==t||t(),t=null,e.dimension.invalidate()}})}});return()=>{i(),null==t||t()}}),[e.dimension])},b=e=>{x(Object.assign(Object.assign({},e),{transformer:t=>Object.assign(Object.assign({},t),{[p.TOP]:t[p.TOP]-e.engine.workspaceContainer.position.top,[p.LEFT]:t[p.LEFT]-e.engine.workspaceContainer.position.left,[p.BOTTOM]:t[p.BOTTOM]-e.engine.workspaceContainer.position.bottom,[p.RIGHT]:t[p.RIGHT]-e.engine.workspaceContainer.position.right})})),L({engine:e.engine,dimension:e.dimension}),(0,i.useEffect)((()=>e.engine.workspaceContainer.registerListener({updated:()=>{e.dimension.invalidate()}})),[])},R=e=>{const t=i.useRef(null);return b({forwardRef:t,dimension:e.model.r_dimensions,engine:e.engine}),(0,i.useEffect)((()=>(e.model.setVisible(!0),()=>{e.model.setVisible(!1)})),[e.model]),t};function M(e){const[t,n]=(0,i.useState)(0);return()=>{if(e)return g.debounce((()=>{n((e=>e+1))}));n((e=>e+1))}}const O=e=>{(0,i.useEffect)((()=>{const t=()=>{e.dimension.invalidate()};return e.forwardRef.current.addEventListener("scroll",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("scroll",t)}}),[])},_=i.createContext(null),T=e=>{const t=(0,i.useContext)(_);(0,i.useEffect)((()=>{const i=i=>{var n;t.increment(),null===(n=e.mouseEnter)||void 0===n||n.call(e)},n=()=>{var i;t.decrement(),null===(i=e.mouseExit)||void 0===i||i.call(e)};return e.forwardRef.current.addEventListener("dragenter",i),e.forwardRef.current.addEventListener("dragleave",n),e.forwardRef.current.addEventListener("drop",n),()=>{var t,r,s;null===(t=e.forwardRef.current)||void 0===t||t.removeEventListener("dragenter",i),null===(r=e.forwardRef.current)||void 0===r||r.removeEventListener("dragleave",n),null===(s=e.forwardRef.current)||void 0===s||s.removeEventListener("drop",n)}}),[])},C=e=>(T({forwardRef:e.forwardRef}),e.children),D=e=>{const t=(0,i.useRef)(0);return i.createElement(_.Provider,{value:{increment:()=>{var i;t.current=t.current+1,t.current>0&&(null===(i=e.mouseEnter)||void 0===i||i.call(e))},decrement:()=>{var i;t.current=t.current-1,0===t.current&&(null===(i=e.mouseExit)||void 0===i||i.call(e))}}},i.createElement(C,e,e.children))};var z=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};const k=e=>{(0,i.useEffect)((()=>{const t=t=>z(void 0,void 0,void 0,(function*(){let i={};for(let e of t.dataTransfer.types){let n=t.dataTransfer.getData(e);try{i[e]=JSON.parse(n)}catch(e){console.warn("Failed to deserialize draggable object",e)}}w("dropped data:",i),e.dropped(i,{position:t,isCopy:"copy"===t.dataTransfer.effectAllowed})}));return e.forwardRef.current.addEventListener("drop",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("drop",t)}}),[e.forwardRef])},I=e=>{(0,i.useEffect)((()=>{const t=t=>{var i;let n=!1;for(let i=0;i<t.dataTransfer.types.length;++i)e.acceptedTypes.some((e=>t.dataTransfer.types[i].startsWith(e)))&&(n=!0);n&&(e.accept&&t.preventDefault(),null===(i=e.dragOver)||void 0===i||i.call(e,t.dataTransfer.types))};return e.forwardRef.current.addEventListener("dragover",t),()=>{var i;null===(i=e.forwardRef.current)||void 0===i||i.removeEventListener("dragover",t)}}),[e.forwardRef])};var P=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};const S=e=>{(0,i.useEffect)((()=>{const t=t=>{t.stopPropagation();const i=e.encode();if(i){t.dataTransfer.dropEffect="none",t.altKey?(w("dragging as a copy operation"),t.dataTransfer.effectAllowed="copy"):t.dataTransfer.effectAllowed="move";for(let e in i)w(`setting up mime: ${e}`),t.dataTransfer.setData(e,JSON.stringify(i[e]))}},i=t=>P(void 0,void 0,void 0,(function*(){"none"!==t.dataTransfer.dropEffect?e.dragend({copy:"copy"===t.dataTransfer.dropEffect,success:!0}):e.dragend({copy:!1,success:!1})}));return e.forwardRef.current.addEventListener("dragstart",t),e.forwardRef.current.addEventListener("dragend",i),()=>{var n,r;null===(n=e.forwardRef.current)||void 0===n||n.removeEventListener("dragstart",t),null===(r=e.forwardRef.current)||void 0===r||r.removeEventListener("dragend",i)}}),[e.forwardRef])},A=e=>{I({acceptedTypes:[F],accept:e.accept,dragOver:t=>{var i;const n=t.find((e=>e.startsWith(W)));if(!n)return;const r=n.substring(W.length);null===(i=e.dragOver)||void 0===i||i.call(e,{modelID:r})},forwardRef:e.forwardRef})},F="srw/model",W="srw/modelid/",N=e=>{S({encode:()=>({[F]:e.model.toArray(),[W+e.model.id]:e.model.id}),dragend:t=>{let{copy:i,success:n}=t;n&&!i&&(e.engine.draggingID||(e.model.delete(),e.engine.normalize())),e.engine.setDraggingNode(null)},forwardRef:e.forwardRef})},H=e=>{A({dragOver:e.onDragover,forwardRef:e.forwardRef,accept:!0}),k({dropped:(t,i)=>{let n=e.engine.getFactory(t[F].type).generateModel();if(n.fromArray(t[F],e.engine),i.isCopy)w("was a copy operation, regenerating ids"),f(n);else{const t=e.engine.rootModel.flatten().find((e=>e.id===n.id));n=t||n}w("workspace model dropped",n),e.onDrop(n)},forwardRef:e.forwardRef})},j=require("@emotion/styled");var $=e.n(j);const V=e=>{const t=M();return(0,i.useEffect)((()=>(g.defer((()=>{t()})),e.dimension.registerListener({updated:()=>{t()}}))),[e.dimension]),i.createElement(B.Container,{ref:e.forwardRef,className:e.className,d:e.dimension.dimensions,animate:e.animateDuration||0},e.children)};var B;!function(e){e.Container=$().div`
     position: absolute;
@@ -8,3 +8,3 @@ width: ${e=>e.d.width}px;
     ${e=>e.animate>0?`transition: top ${e.animate}ms, left ${e.animate}ms`:""};
-  `}(B||(B={}));const G=e=>{var t;const n=(0,i.useRef)(),r=M();return(0,i.useEffect)((()=>e.dimensionContainer.registerListener({activeChanged:()=>{r()},hoverChanged:()=>{r()}})),[]),b({forwardRef:n,dimension:e.dimensionContainer,engine:e.engine}),i.createElement(U.Container,{hoverColor:e.hoverColor,activeColor:e.activeColor,hover:e.dimensionContainer.hover,active:e.dimensionContainer.active,thickness:null!==(t=e.thickness)&&void 0!==t?t:4,ref:n})};var U,Z;function X(){return X=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var n in i)({}).hasOwnProperty.call(i,n)&&(e[n]=i[n])}return e},X.apply(null,arguments)}!function(e){e.Container=$().div`
+  `}(B||(B={}));const G=e=>{var t;const n=(0,i.useRef)(null),r=M();return(0,i.useEffect)((()=>e.dimensionContainer.registerListener({activeChanged:()=>{r()},hoverChanged:()=>{r()}})),[]),b({forwardRef:n,dimension:e.dimensionContainer,engine:e.engine}),i.createElement(U.Container,{hoverColor:e.hoverColor,activeColor:e.activeColor,hover:e.dimensionContainer.hover,active:e.dimensionContainer.active,thickness:null!==(t=e.thickness)&&void 0!==t?t:4,ref:n})};var U,Z;function X(){return X=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var n in i)({}).hasOwnProperty.call(i,n)&&(e[n]=i[n])}return e},X.apply(null,arguments)}!function(e){e.Container=$().div`
     min-width: 4px;
@@ -18,3 +18,3 @@ min-height: 4px;
     cursor: ${e=>e.draggable?"move":"pointer"};
-  `}(Z||(Z={}));const Y=e=>{const t=(0,i.useRef)(),n=M();return N({forwardRef:e.forwardRef||t,model:e.model,engine:e.engine}),(0,i.useEffect)((()=>e.engine.registerListener({lockUpdated:()=>{n()}})),[]),i.createElement(Z.Draggable,X({ref:e.forwardRef||t,draggable:!e.engine.locked,onDragStart:t=>{e.engine.locked||e.engine.iterateListeners((t=>{t.draggingElement&&t.draggingElement(e.model,!0)}))},onDragEnd:t=>{e.engine.locked||e.engine.iterateListeners((t=>{t.draggingElement&&t.draggingElement(e.model,!1)}))}},e),e.children)};var q;!function(e){e.Container=$().div``}(q||(q={}));const K=e=>{const[t,n]=(0,i.useState)(!1),r=(0,i.useRef)();return H({onDrop:t=>{e.onDrop(t)},engine:e.engine,forwardRef:r}),T({forwardRef:r,mouseEnter:()=>{n(!0)},mouseExit:()=>{n(!1)}}),(0,i.useEffect)((()=>{e.onDragEnter(t)}),[t]),i.createElement(q.Container,{ref:r,className:e.className},e.children)};class J extends s{constructor(e){super(),this.options=e,this.id=(0,r.v4)(),this.layerManager=null}setLayerManager(e){this.layerManager=e}isInserted(){return!!this.layerManager}remove(){this.iterateListeners((e=>{var t;return null===(t=e.removed)||void 0===t?void 0:t.call(e)}))}moveToTop(){this.iterateListeners((e=>{var t;return null===(t=e.moveToTop)||void 0===t?void 0:t.call(e)}))}repaint(){this.iterateListeners((e=>{var t;return null===(t=e.repaint)||void 0===t?void 0:t.call(e)}))}}class Q extends s{constructor(){super(),this._layers=new Set,this.initialZIndex=1}setInitialZIndex(e){if(e<1)throw new Error("Index must be > 0");this.initialZIndex=e,this.fireUpdated()}get layers(){return Array.from(this._layers.values())}fireUpdated(){this.iterateListeners((e=>{var t;return null===(t=e.layersChanged)||void 0===t?void 0:t.call(e)}))}addLayer(e){e.setLayerManager(this),this._layers.add(e);const t=e.registerListener({removed:()=>{this._layers.delete(e),e.setLayerManager(null),t(),this.fireUpdated()},moveToTop:()=>{this._layers.delete(e),this._layers.add(e),this.fireUpdated()}});this.iterateListeners((e=>{var t;return null===(t=e.layerAdded)||void 0===t?void 0:t.call(e)})),this.fireUpdated()}}const ee=e=>{const t=(0,i.useRef)();return T({forwardRef:t,mouseEnter:()=>{e.layer.zoneEntered(e.index)},mouseExit:()=>{e.layer.zoneEntered(null)}}),H({engine:e.engine,forwardRef:t,onDrop:t=>{e.layer.dropped(t,e.index)}}),i.createElement(V,{dimension:e.dimension},i.createElement(ie.Container,{ref:t}))},te=e=>i.createElement(i.Fragment,null,e.layer.trackers.map(((t,n)=>i.createElement(ee,{engine:e.engine,index:n,key:t.id,dimension:t,layer:e.layer}))));var ie;!function(e){e.Container=$().div`
+  `}(Z||(Z={}));const Y=e=>{const t=(0,i.useRef)(null),n=M();return N({forwardRef:e.forwardRef||t,model:e.model,engine:e.engine}),(0,i.useEffect)((()=>e.engine.registerListener({lockUpdated:()=>{n()}})),[]),i.createElement(Z.Draggable,X({ref:e.forwardRef||t,draggable:!e.engine.locked,onDragStart:t=>{e.engine.locked||e.engine.iterateListeners((t=>{t.draggingElement&&t.draggingElement(e.model,!0)}))},onDragEnd:t=>{e.engine.locked||e.engine.iterateListeners((t=>{t.draggingElement&&t.draggingElement(e.model,!1)}))}},e),e.children)};var q;!function(e){e.Container=$().div``}(q||(q={}));const K=e=>{const[t,n]=(0,i.useState)(!1),r=(0,i.useRef)(null);return H({onDrop:t=>{e.onDrop(t)},engine:e.engine,forwardRef:r}),T({forwardRef:r,mouseEnter:()=>{n(!0)},mouseExit:()=>{n(!1)}}),(0,i.useEffect)((()=>{e.onDragEnter(t)}),[t]),i.createElement(q.Container,{ref:r,className:e.className},e.children)};class J extends s{constructor(e){super(),this.options=e,this.id=(0,r.v4)(),this.layerManager=null}setLayerManager(e){this.layerManager=e}isInserted(){return!!this.layerManager}remove(){this.iterateListeners((e=>{var t;return null===(t=e.removed)||void 0===t?void 0:t.call(e)}))}moveToTop(){this.iterateListeners((e=>{var t;return null===(t=e.moveToTop)||void 0===t?void 0:t.call(e)}))}repaint(){this.iterateListeners((e=>{var t;return null===(t=e.repaint)||void 0===t?void 0:t.call(e)}))}}class Q extends s{constructor(){super(),this._layers=new Set,this.initialZIndex=1}setInitialZIndex(e){if(e<1)throw new Error("Index must be > 0");this.initialZIndex=e,this.fireUpdated()}get layers(){return Array.from(this._layers.values())}fireUpdated(){this.iterateListeners((e=>{var t;return null===(t=e.layersChanged)||void 0===t?void 0:t.call(e)}))}addLayer(e){e.setLayerManager(this),this._layers.add(e);const t=e.registerListener({removed:()=>{this._layers.delete(e),e.setLayerManager(null),t(),this.fireUpdated()},moveToTop:()=>{this._layers.delete(e),this._layers.add(e),this.fireUpdated()}});this.iterateListeners((e=>{var t;return null===(t=e.layerAdded)||void 0===t?void 0:t.call(e)})),this.fireUpdated()}}const ee=e=>{const t=(0,i.useRef)(null);return T({forwardRef:t,mouseEnter:()=>{e.layer.zoneEntered(e.index)},mouseExit:()=>{e.layer.zoneEntered(null)}}),H({engine:e.engine,forwardRef:t,onDrop:t=>{e.layer.dropped(t,e.index)}}),i.createElement(V,{dimension:e.dimension},i.createElement(ie.Container,{ref:t}))},te=e=>i.createElement(i.Fragment,null,e.layer.trackers.map(((t,n)=>i.createElement(ee,{engine:e.engine,index:n,key:t.id,dimension:t,layer:e.layer}))));var ie;!function(e){e.Container=$().div`
     position: absolute;
@@ -27,3 +27,3 @@ top: -5px;
     pointer-events: all;
-  `}(ie||(ie={}));class ne extends J{constructor(e){super({mouseEvents:!1}),this.options2=e}get trackers(){return this.options2.trackers}zoneEntered(e){this.iterateListeners((t=>{var i;return null===(i=t.enteredZone)||void 0===i?void 0:i.call(t,e)}))}dropped(e,t){this.iterateListeners((i=>{var n;return null===(n=i.dropped)||void 0===n?void 0:n.call(i,e,t)}))}renderLayer(e){return i.createElement(te,{engine:e.engine,layer:this})}}function re(){return re=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var n in i)({}).hasOwnProperty.call(i,n)&&(e[n]=i[n])}return e},re.apply(null,arguments)}const se=e=>{const[t,n]=(0,i.useState)(!1),r=(0,i.useRef)();return b({forwardRef:r,dimension:e.container,ignoreDebounce:!0,engine:e.engine}),(0,i.useEffect)((()=>e.layer.registerListener({enteredZone:i=>{e.container.invalidate(),t||i!==e.index?n(!1):n(!0)}})),[]),(0,i.useEffect)((()=>{const t=()=>{e.layer.trackers.forEach((e=>{e.invalidate()}))};return r.current.addEventListener("transitionend",t),()=>{var e;null===(e=r.current)||void 0===e||e.removeEventListener("transitionend",t)}}),[]),e.vertical?i.createElement(de.ExpandVertical,{ref:r,expand:t}):i.createElement(de.ExpandHorizontal,{ref:r,expand:t})},oe=e=>{const[t]=(0,i.useState)((()=>e.children.map((e=>new l)).concat(new l))),[n]=(0,i.useState)((()=>new ne({trackers:t})));return(0,i.useEffect)((()=>{const t=n.registerListener({dropped:(t,i)=>{e.dropped({index:i,model:t})}});return e.engine.layerManager.addLayer(n),()=>{t(),n.remove()}}),[]),i.createElement(i.Fragment,null,i.createElement(se,{engine:e.engine,container:t[0],layer:n,vertical:e.vertical,index:0}),e.children.map(((r,s)=>{var o;return i.createElement(i.Fragment,{key:(null===(o=t[s+1])||void 0===o?void 0:o.id)||`${s}`},r,t[s+1]?i.createElement(se,{engine:e.engine,container:t[s+1],layer:n,vertical:e.vertical,index:s+1}):null)})))},ae=e=>{const[t,n]=(0,i.useState)(!1);return(0,i.useEffect)((()=>e.engine.registerListener({modelDragStart:()=>{n(!0)},modelDragEnd:()=>{n(!1)}})),[]),i.createElement(de.Container,{className:e.className,ref:e.forwardRef},t?i.createElement(oe,re({},e,{dropped:t=>{var i;null===(i=e.dropped)||void 0===i||i.call(e,t)}})):e.children)};var de;!function(e){e.Container=$().div``,e.ExpandHorizontal=$().div`
+  `}(ie||(ie={}));class ne extends J{constructor(e){super({mouseEvents:!1}),this.options2=e}get trackers(){return this.options2.trackers}zoneEntered(e){this.iterateListeners((t=>{var i;return null===(i=t.enteredZone)||void 0===i?void 0:i.call(t,e)}))}dropped(e,t){this.iterateListeners((i=>{var n;return null===(n=i.dropped)||void 0===n?void 0:n.call(i,e,t)}))}renderLayer(e){return i.createElement(te,{engine:e.engine,layer:this})}}function re(){return re=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var n in i)({}).hasOwnProperty.call(i,n)&&(e[n]=i[n])}return e},re.apply(null,arguments)}const se=e=>{const[t,n]=(0,i.useState)(!1),r=(0,i.useRef)(null);return b({forwardRef:r,dimension:e.container,ignoreDebounce:!0,engine:e.engine}),(0,i.useEffect)((()=>e.layer.registerListener({enteredZone:i=>{e.container.invalidate(),t||i!==e.index?n(!1):n(!0)}})),[]),(0,i.useEffect)((()=>{const t=()=>{e.layer.trackers.forEach((e=>{e.invalidate()}))};return r.current.addEventListener("transitionend",t),()=>{var e;null===(e=r.current)||void 0===e||e.removeEventListener("transitionend",t)}}),[]),e.vertical?i.createElement(de.ExpandVertical,{ref:r,expand:t}):i.createElement(de.ExpandHorizontal,{ref:r,expand:t})},oe=e=>{const[t]=(0,i.useState)((()=>e.children.map((e=>new l)).concat(new l))),[n]=(0,i.useState)((()=>new ne({trackers:t})));return(0,i.useEffect)((()=>{const t=n.registerListener({dropped:(t,i)=>{e.dropped({index:i,model:t})}});return e.engine.layerManager.addLayer(n),()=>{t(),n.remove()}}),[]),i.createElement(i.Fragment,null,i.createElement(se,{engine:e.engine,container:t[0],layer:n,vertical:e.vertical,index:0}),e.children.map(((r,s)=>{var o;return i.createElement(i.Fragment,{key:(null===(o=t[s+1])||void 0===o?void 0:o.id)||`${s}`},r,t[s+1]?i.createElement(se,{engine:e.engine,container:t[s+1],layer:n,vertical:e.vertical,index:s+1}):null)})))},ae=e=>{const[t,n]=(0,i.useState)(!1);return(0,i.useEffect)((()=>e.engine.registerListener({modelDragStart:()=>{n(!0)},modelDragEnd:()=>{n(!1)}})),[]),i.createElement(de.Container,{className:e.className,ref:e.forwardRef},t?i.createElement(oe,re({},e,{dropped:t=>{var i;null===(i=e.dropped)||void 0===i||i.call(e,t)}})):e.children)};var de;!function(e){e.Container=$().div``,e.ExpandHorizontal=$().div`
     width: ${e=>e.expand?40:0}px;
@@ -79,3 +79,3 @@ height: 100%;
     height: 100%;
-  `}(Re||(Re={}));const Me=e=>{const t=(0,i.useRef)(),n=(0,i.useRef)(null),r=M();return(0,i.useEffect)((()=>{e.engine.fireRepainted()})),(0,i.useEffect)((()=>{e.engine.setRootModel(e.model)}),[e.model]),x({forwardRef:t,dimension:e.engine.workspaceContainer}),(0,i.useEffect)((()=>{e.engine.registerListener({layoutInvalidated:()=>{r()},repaint:()=>{r()}})}),[]),A({forwardRef:t,accept:!1,dragOver:t=>{let{modelID:i}=t;n.current&&(clearTimeout(n.current),n.current=null),n.current=setTimeout((()=>{e.engine.setDraggingNode(null)}),200),e.engine.draggingID||e.engine.setDraggingNode(i)}}),i.createElement(D,{forwardRef:t},i.createElement(Re.Container,{ref:t},e.engine.getFactory(e.model.getRootModel()).generateContent({engine:e.engine,model:e.model.getRootModel()}),i.createElement(Re.LayerManager,{engine:e.engine,layerManager:e.engine.layerManager,model:e.model.getRootModel()})))};class Oe extends s{constructor(e){super(),this.type=e}setEngine(e){this.engine=e}generateModel(){const e=this._generateModel();return this.iterateListeners((t=>{var i;return null===(i=t.modelGenerated)||void 0===i?void 0:i.call(t,{model:e})})),e}}class _e extends Error{constructor(e){super(e),Object.setPrototypeOf(this,_e.prototype)}}class Te extends s{constructor(){super(),this.invalidateLayoutDebounced=g.debounce((()=>{this.invalidateLayout()}),200),this.invalidateDimensionsDebounced=g.debounce((()=>{this.invalidateDimensions()}),200),this.locked=!1,this.factories={},this.listeners={},this.draggingID=null,this.layerManager=new Q,this.workspaceContainer=new l,this.rootModel=null}setRootModel(e){var t;null===(t=this.rootModelListener)||void 0===t||t.call(this),this.rootModelListener=e.registerListener({layoutInvalidated:()=>{this.invalidateLayoutDebounced()},dimensionsInvalidated:()=>{this.invalidateDimensionsDebounced()}}),this.rootModel=e,this.iterateListeners((e=>{var t;return null===(t=e.modelUpdated)||void 0===t?void 0:t.call(e)})),this.iterateListeners((e=>{var t;return null===(t=e.layoutInvalidated)||void 0===t?void 0:t.call(e)}))}fireRepainted(){this.iterateListeners((e=>{var t;return null===(t=e.layoutRepainted)||void 0===t?void 0:t.call(e)}))}invalidateLayout(){this.iterateListeners((e=>{var t;return null===(t=e.layoutInvalidated)||void 0===t?void 0:t.call(e)}))}invalidateDimensions(){this.rootModel.flatten().flatMap((e=>e.getAllRenderDimensions())).forEach((e=>{e.invalidate()})),this.iterateListeners((e=>{var t;return null===(t=e.dimensionsInvalidated)||void 0===t?void 0:t.call(e)}))}setLocked(){let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];this.locked!==e&&(this.locked=e,this.iterateListeners((e=>{var t;return null===(t=e.lockUpdated)||void 0===t?void 0:t.call(e)})))}static namespaceMime(e){return`srw/${e}`}fireRepaintListeners(){this.repainting=!0,this.iterateListeners((e=>{var t;null===(t=e.repaint)||void 0===t||t.call(e)}))}normalize(){this.rootModel.flatten().filter((e=>e instanceof v)).forEach((e=>e.normalize()))}registerFactory(e){this.factories[e.type]=e,e.setEngine(this)}getFactory(e){if("string"!=typeof e&&(e=e.type),!this.factories[e])throw new _e("Cannot find Workspace factory for model with type: ["+e+"]");return this.factories[e]}setDraggingNode(e){this.draggingID!==e?(this.draggingID=e,this.iterateListeners((e=>{var t;return null===(t=e.modelDragStart)||void 0===t?void 0:t.call(e)}))):null===e&&this.iterateListeners((e=>{var t;return null===(t=e.modelDragEnd)||void 0===t?void 0:t.call(e)}))}}var Ce=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};class De extends ce{constructor(){super(),this.busy=!1,this.computed_initial=!1}addModel(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;return super.addModel(e,t),this.recomputeSizes(),this}toArray(){return Object.assign(Object.assign({},super.toArray()),{computed_initial:this.computed_initial})}fromArray(e,t){var i;this.computed_initial=null!==(i=e.computed_initial)&&void 0!==i&&i,this.computed_initial&&(this.busy=!0),super.fromArray(e,t),this.busy=!1}recomputeSizes(){return Ce(this,void 0,void 0,(function*(){if(this.busy)return;this.busy=!0;let e=yield this.r_dimensions.waitForSize().then((e=>this.vertical?e.height:e.width));const t=this.getExpandNodes();if(t.length<=1)return this.busy=!1,this.computed_initial=!0,void this.iterateListeners((e=>{var t;return null===(t=e.recomputed)||void 0===t?void 0:t.call(e)}));e=this.vertical?this.r_dimensions.size.height:this.r_dimensions.size.width;let i=yield Promise.all(this.children.filter((e=>!t.includes(e))).map((e=>e.r_dimensions.waitForSize().then((e=>this.vertical?e.height:e.width)))));const n=g.sum(this.r_divisions.map((e=>this.vertical?e.size.height:e.size.width)).concat(i));if(e>n){let i=Math.round((e-n)/t.length);for(let e=0;e<t.length-1;e++)this.vertical?t[e].setHeight(i):t[e].setWidth(i)}this.busy=!1,this.computed_initial=!0,this.iterateListeners((e=>{var t;return null===(t=e.recomputed)||void 0===t?void 0:t.call(e)}))}))}getResizeDivisions(){let e=[];for(let t=1;t<this.r_divisions.length-1;t++)e.push({before:this.children[t-1],after:this.children[t],dimensions:this.r_divisions[t],vertical:!this.vertical});return e}getExpandNodes(){return this.children.filter((e=>this.vertical?e.expandVertical:e.expandHorizontal))}shouldChildExpand(e){const t=this.getExpandNodes();return 0===t.length&&this.children.indexOf(e)===this.children.length-1||(t.length>1?t.indexOf(e)===t.length-1:super.shouldChildExpand(e))}}class ze extends Oe{constructor(e){super(e),this.renderers=new Set}addRenderer(e){this.renderers.add(e)}getRendererForModel(e){for(let t of this.renderers.values())if(t.matchModel(e))return t}}const ke=e=>{const t=R({engine:e.engine,model:e.model});return(0,i.useEffect)((()=>{const i=()=>{e.model.vertical?e.model.setOverConstrained(t.current.scrollHeight>e.model.r_dimensions.size.height):e.model.setOverConstrained(t.current.scrollWidth>e.model.r_dimensions.size.width)};let n=e.model.r_dimensions.registerListener({updated:()=>{i()}}),r=e.model.registerListener({dimensionsInvalidated:()=>{i()}});return()=>{n(),r()}}),[e.model]),i.createElement(Pe.DirectionalLayout,{forwardRef:t,dimensionContainerForDivider:t=>e.model.r_divisions[t],shouldModelExpand:t=>e.model.shouldChildExpand(t),className:e.className,data:e.model.children,generateDivider:e.generateDivider,generateElement:t=>i.createElement(Ie,{model:t,renderer:e.factory.getRendererForModel(t),engine:e.engine}),vertical:e.model.vertical,engine:e.engine})},Ie=e=>{const t=e.engine.getFactory(e.model),n=R({model:e.model,engine:e.engine});return i.createElement(Pe.Container,{ref:n},e.renderer?i.createElement(Y,{model:e.model,engine:e.engine},e.renderer.renderTitleBar({engine:e.engine,model:e.model})):null,i.createElement(Pe.Content,null,t.generateContent({model:e.model,engine:e.engine})))};var Pe;function Se(){return Se=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var n in i)({}).hasOwnProperty.call(i,n)&&(e[n]=i[n])}return e},Se.apply(null,arguments)}!function(e){e.DirectionalLayout=$()(be)`
+  `}(Re||(Re={}));const Me=e=>{const t=(0,i.useRef)(null),n=(0,i.useRef)(null),r=M();return(0,i.useEffect)((()=>{e.engine.fireRepainted()})),(0,i.useEffect)((()=>{e.engine.setRootModel(e.model)}),[e.model]),x({forwardRef:t,dimension:e.engine.workspaceContainer}),(0,i.useEffect)((()=>{e.engine.registerListener({layoutInvalidated:()=>{r()},repaint:()=>{r()}})}),[]),A({forwardRef:t,accept:!1,dragOver:t=>{let{modelID:i}=t;n.current&&(clearTimeout(n.current),n.current=null),n.current=setTimeout((()=>{e.engine.setDraggingNode(null)}),200),e.engine.draggingID||e.engine.setDraggingNode(i)}}),i.createElement(D,{forwardRef:t},i.createElement(Re.Container,{ref:t},e.engine.getFactory(e.model.getRootModel()).generateContent({engine:e.engine,model:e.model.getRootModel()}),i.createElement(Re.LayerManager,{engine:e.engine,layerManager:e.engine.layerManager,model:e.model.getRootModel()})))};class Oe extends s{constructor(e){super(),this.type=e}setEngine(e){this.engine=e}generateModel(){const e=this._generateModel();return this.iterateListeners((t=>{var i;return null===(i=t.modelGenerated)||void 0===i?void 0:i.call(t,{model:e})})),e}}class _e extends Error{constructor(e){super(e),Object.setPrototypeOf(this,_e.prototype)}}class Te extends s{constructor(){super(),this.invalidateLayoutDebounced=g.debounce((()=>{this.invalidateLayout()}),200),this.invalidateDimensionsDebounced=g.debounce((()=>{this.invalidateDimensions()}),200),this.locked=!1,this.factories={},this.listeners={},this.draggingID=null,this.layerManager=new Q,this.workspaceContainer=new l,this.rootModel=null}setRootModel(e){var t;null===(t=this.rootModelListener)||void 0===t||t.call(this),this.rootModelListener=e.registerListener({layoutInvalidated:()=>{this.invalidateLayoutDebounced()},dimensionsInvalidated:()=>{this.invalidateDimensionsDebounced()}}),this.rootModel=e,this.iterateListeners((e=>{var t;return null===(t=e.modelUpdated)||void 0===t?void 0:t.call(e)})),this.iterateListeners((e=>{var t;return null===(t=e.layoutInvalidated)||void 0===t?void 0:t.call(e)}))}fireRepainted(){this.iterateListeners((e=>{var t;return null===(t=e.layoutRepainted)||void 0===t?void 0:t.call(e)}))}invalidateLayout(){this.iterateListeners((e=>{var t;return null===(t=e.layoutInvalidated)||void 0===t?void 0:t.call(e)}))}invalidateDimensions(){this.rootModel.flatten().flatMap((e=>e.getAllRenderDimensions())).forEach((e=>{e.invalidate()})),this.iterateListeners((e=>{var t;return null===(t=e.dimensionsInvalidated)||void 0===t?void 0:t.call(e)}))}setLocked(){let e=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];this.locked!==e&&(this.locked=e,this.iterateListeners((e=>{var t;return null===(t=e.lockUpdated)||void 0===t?void 0:t.call(e)})))}static namespaceMime(e){return`srw/${e}`}fireRepaintListeners(){this.repainting=!0,this.iterateListeners((e=>{var t;null===(t=e.repaint)||void 0===t||t.call(e)}))}normalize(){this.rootModel.flatten().filter((e=>e instanceof v)).forEach((e=>e.normalize()))}registerFactory(e){this.factories[e.type]=e,e.setEngine(this)}getFactory(e){if("string"!=typeof e&&(e=e.type),!this.factories[e])throw new _e("Cannot find Workspace factory for model with type: ["+e+"]");return this.factories[e]}setDraggingNode(e){this.draggingID!==e?(this.draggingID=e,this.iterateListeners((e=>{var t;return null===(t=e.modelDragStart)||void 0===t?void 0:t.call(e)}))):null===e&&this.iterateListeners((e=>{var t;return null===(t=e.modelDragEnd)||void 0===t?void 0:t.call(e)}))}}var Ce=function(e,t,i,n){return new(i||(i=Promise))((function(r,s){function o(e){try{d(n.next(e))}catch(e){s(e)}}function a(e){try{d(n.throw(e))}catch(e){s(e)}}function d(e){var t;e.done?r(e.value):(t=e.value,t instanceof i?t:new i((function(e){e(t)}))).then(o,a)}d((n=n.apply(e,t||[])).next())}))};class De extends ce{constructor(){super(),this.busy=!1,this.computed_initial=!1}addModel(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;return super.addModel(e,t),this.recomputeSizes(),this}toArray(){return Object.assign(Object.assign({},super.toArray()),{computed_initial:this.computed_initial})}fromArray(e,t){var i;this.computed_initial=null!==(i=e.computed_initial)&&void 0!==i&&i,this.computed_initial&&(this.busy=!0),super.fromArray(e,t),this.busy=!1}recomputeSizes(){return Ce(this,void 0,void 0,(function*(){if(this.busy)return;this.busy=!0;let e=yield this.r_dimensions.waitForSize().then((e=>this.vertical?e.height:e.width));const t=this.getExpandNodes();if(t.length<=1)return this.busy=!1,this.computed_initial=!0,void this.iterateListeners((e=>{var t;return null===(t=e.recomputed)||void 0===t?void 0:t.call(e)}));e=this.vertical?this.r_dimensions.size.height:this.r_dimensions.size.width;let i=yield Promise.all(this.children.filter((e=>!t.includes(e))).map((e=>e.r_dimensions.waitForSize().then((e=>this.vertical?e.height:e.width)))));const n=g.sum(this.r_divisions.map((e=>this.vertical?e.size.height:e.size.width)).concat(i));if(e>n){let i=Math.round((e-n)/t.length);for(let e=0;e<t.length-1;e++)this.vertical?t[e].setHeight(i):t[e].setWidth(i)}this.busy=!1,this.computed_initial=!0,this.iterateListeners((e=>{var t;return null===(t=e.recomputed)||void 0===t?void 0:t.call(e)}))}))}getResizeDivisions(){let e=[];for(let t=1;t<this.r_divisions.length-1;t++)e.push({before:this.children[t-1],after:this.children[t],dimensions:this.r_divisions[t],vertical:!this.vertical});return e}getExpandNodes(){return this.children.filter((e=>this.vertical?e.expandVertical:e.expandHorizontal))}shouldChildExpand(e){const t=this.getExpandNodes();return 0===t.length&&this.children.indexOf(e)===this.children.length-1||(t.length>1?t.indexOf(e)===t.length-1:super.shouldChildExpand(e))}}class ze extends Oe{constructor(e){super(e),this.renderers=new Set}addRenderer(e){this.renderers.add(e)}getRendererForModel(e){for(let t of this.renderers.values())if(t.matchModel(e))return t}}const ke=e=>{const t=R({engine:e.engine,model:e.model});return(0,i.useEffect)((()=>{const i=()=>{e.model.vertical?e.model.setOverConstrained(t.current.scrollHeight>e.model.r_dimensions.size.height):e.model.setOverConstrained(t.current.scrollWidth>e.model.r_dimensions.size.width)};let n=e.model.r_dimensions.registerListener({updated:()=>{i()}}),r=e.model.registerListener({dimensionsInvalidated:()=>{i()}});return()=>{n(),r()}}),[e.model]),i.createElement(Pe.DirectionalLayout,{forwardRef:t,dimensionContainerForDivider:t=>e.model.r_divisions[t],shouldModelExpand:t=>e.model.shouldChildExpand(t),className:e.className,data:e.model.children,generateDivider:e.generateDivider,generateElement:t=>i.createElement(Ie,{model:t,renderer:e.factory.getRendererForModel(t),engine:e.engine}),vertical:e.model.vertical,engine:e.engine})},Ie=e=>{const t=e.engine.getFactory(e.model),n=R({model:e.model,engine:e.engine});return i.createElement(Pe.Container,{ref:n},e.renderer?i.createElement(Y,{model:e.model,engine:e.engine},e.renderer.renderTitleBar({engine:e.engine,model:e.model})):null,i.createElement(Pe.Content,null,t.generateContent({model:e.model,engine:e.engine})))};var Pe;function Se(){return Se=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var n in i)({}).hasOwnProperty.call(i,n)&&(e[n]=i[n])}return e},Se.apply(null,arguments)}!function(e){e.DirectionalLayout=$()(be)`
     height: 100%;
@@ -82,0 +82,0 @@ width: 100%;

dist/widgets/hooks/dnd/useDraggable.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"useDraggable.js","sourceRoot":"","sources":["../../../../src/widgets/hooks/dnd/useDraggable.ts"],"names":[],"mappings":";;;;;;;;;AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAQ1C,MAAM,CAAC,MAAM,YAAY,GAAG,CAAI,KAA2B,EAAE,EAAE;IAC7D,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,CAAC,KAAgB,EAAE,EAAE;YACrC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;YAC9B,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAO;YACT,CAAC;YAED,YAAY;YACZ,KAAK,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;YACvC,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;gBACjB,GAAG,CAAC,8BAA8B,CAAC,CAAC;gBACpC,KAAK,CAAC,YAAY,CAAC,aAAa,GAAG,MAAM,CAAC;YAC5C,CAAC;iBAAM,CAAC;gBACN,KAAK,CAAC,YAAY,CAAC,aAAa,GAAG,MAAM,CAAC;YAC5C,CAAC;YAED,wBAAwB;YACxB,KAAK,IAAI,GAAG,IAAI,MAAM,EAAE,CAAC;gBACvB,GAAG,CAAC,oBAAoB,GAAG,EAAE,CAAC,CAAC;gBAC/B,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;YAC/D,CAAC;QACH,CAAC,CAAC;QACF,MAAM,OAAO,GAAG,CAAO,KAAgB,EAAE,EAAE;YACzC,IAAI,KAAK,CAAC,YAAY,CAAC,UAAU,KAAK,MAAM,EAAE,CAAC;gBAC7C,KAAK,CAAC,OAAO,CAAC;oBACZ,IAAI,EAAE,KAAK;oBACX,OAAO,EAAE,KAAK;iBACf,CAAC,CAAC;gBACH,OAAO;YACT,CAAC;YACD,KAAK,CAAC,OAAO,CAAC;gBACZ,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,KAAK,MAAM;gBAC9C,OAAO,EAAE,IAAI;aACd,CAAC,CAAC;QACL,CAAC,CAAA,CAAC;QAEF,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;QAClE,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAE9D,OAAO,GAAG,EAAE;;YACV,MAAA,KAAK,CAAC,UAAU,CAAC,OAAO,0CAAE,mBAAmB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;YACtE,MAAA,KAAK,CAAC,UAAU,CAAC,OAAO,0CAAE,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QACpE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC;AACzB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAI,KAAoD,EAAE,EAAE;IACzF,YAAY,CAAC,KAAK,CAAC,CAAC;IACpB,OAAO,KAAK,CAAC,QAAuB,CAAC;AACvC,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useEffect } from 'react';\nimport { log } from '../../../core/tools';\n\nexport interface UseDraggableProps<T extends { [key: string]: any }> {\n  forwardRef: React.RefObject<HTMLDivElement>;\n  encode: () => T;\n  dragend: (options: { copy: boolean; success: boolean }) => any;\n}\n\nexport const useDraggable = <T>(props: UseDraggableProps<T>) => {\n  useEffect(() => {\n    const dragStart = (event: DragEvent) => {\n      event.stopPropagation();\n      const object = props.encode();\n      if (!object) {\n        return;\n      }\n\n      // show copy\n      event.dataTransfer.dropEffect = 'none';\n      if (event.altKey) {\n        log(`dragging as a copy operation`);\n        event.dataTransfer.effectAllowed = 'copy';\n      } else {\n        event.dataTransfer.effectAllowed = 'move';\n      }\n\n      // encode all mime types\n      for (let key in object) {\n        log(`setting up mime: ${key}`);\n        event.dataTransfer.setData(key, JSON.stringify(object[key]));\n      }\n    };\n    const dragEnd = async (event: DragEvent) => {\n      if (event.dataTransfer.dropEffect === 'none') {\n        props.dragend({\n          copy: false,\n          success: false\n        });\n        return;\n      }\n      props.dragend({\n        copy: event.dataTransfer.dropEffect === 'copy',\n        success: true\n      });\n    };\n\n    props.forwardRef.current.addEventListener('dragstart', dragStart);\n    props.forwardRef.current.addEventListener('dragend', dragEnd);\n\n    return () => {\n      props.forwardRef.current?.removeEventListener('dragstart', dragStart);\n      props.forwardRef.current?.removeEventListener('dragend', dragEnd);\n    };\n  }, [props.forwardRef]);\n};\n\nexport const DraggableWidget = <T>(props: React.PropsWithChildren<UseDraggableProps<T>>) => {\n  useDraggable(props);\n  return props.children as JSX.Element;\n};\n"]}
+{"version":3,"file":"useDraggable.js","sourceRoot":"","sources":["../../../../src/widgets/hooks/dnd/useDraggable.ts"],"names":[],"mappings":";;;;;;;;;AACA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAQ1C,MAAM,CAAC,MAAM,YAAY,GAAG,CAAI,KAA2B,EAAE,EAAE;IAC7D,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,CAAC,KAAgB,EAAE,EAAE;YACrC,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;YAC9B,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAO;YACT,CAAC;YAED,YAAY;YACZ,KAAK,CAAC,YAAY,CAAC,UAAU,GAAG,MAAM,CAAC;YACvC,IAAI,KAAK,CAAC,MAAM,EAAE,CAAC;gBACjB,GAAG,CAAC,8BAA8B,CAAC,CAAC;gBACpC,KAAK,CAAC,YAAY,CAAC,aAAa,GAAG,MAAM,CAAC;YAC5C,CAAC;iBAAM,CAAC;gBACN,KAAK,CAAC,YAAY,CAAC,aAAa,GAAG,MAAM,CAAC;YAC5C,CAAC;YAED,wBAAwB;YACxB,KAAK,IAAI,GAAG,IAAI,MAAM,EAAE,CAAC;gBACvB,GAAG,CAAC,oBAAoB,GAAG,EAAE,CAAC,CAAC;gBAC/B,KAAK,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;YAC/D,CAAC;QACH,CAAC,CAAC;QACF,MAAM,OAAO,GAAG,CAAO,KAAgB,EAAE,EAAE;YACzC,IAAI,KAAK,CAAC,YAAY,CAAC,UAAU,KAAK,MAAM,EAAE,CAAC;gBAC7C,KAAK,CAAC,OAAO,CAAC;oBACZ,IAAI,EAAE,KAAK;oBACX,OAAO,EAAE,KAAK;iBACf,CAAC,CAAC;gBACH,OAAO;YACT,CAAC;YACD,KAAK,CAAC,OAAO,CAAC;gBACZ,IAAI,EAAE,KAAK,CAAC,YAAY,CAAC,UAAU,KAAK,MAAM;gBAC9C,OAAO,EAAE,IAAI;aACd,CAAC,CAAC;QACL,CAAC,CAAA,CAAC;QAEF,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;QAClE,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QAE9D,OAAO,GAAG,EAAE;;YACV,MAAA,KAAK,CAAC,UAAU,CAAC,OAAO,0CAAE,mBAAmB,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;YACtE,MAAA,KAAK,CAAC,UAAU,CAAC,OAAO,0CAAE,mBAAmB,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;QACpE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC;AACzB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,CAAI,KAAoD,EAAE,EAAE;IACzF,YAAY,CAAC,KAAK,CAAC,CAAC;IACpB,OAAO,KAAK,CAAC,QAA6B,CAAC;AAC7C,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useEffect } from 'react';\nimport { log } from '../../../core/tools';\n\nexport interface UseDraggableProps<T extends { [key: string]: any }> {\n  forwardRef: React.RefObject<HTMLDivElement>;\n  encode: () => T;\n  dragend: (options: { copy: boolean; success: boolean }) => any;\n}\n\nexport const useDraggable = <T>(props: UseDraggableProps<T>) => {\n  useEffect(() => {\n    const dragStart = (event: DragEvent) => {\n      event.stopPropagation();\n      const object = props.encode();\n      if (!object) {\n        return;\n      }\n\n      // show copy\n      event.dataTransfer.dropEffect = 'none';\n      if (event.altKey) {\n        log(`dragging as a copy operation`);\n        event.dataTransfer.effectAllowed = 'copy';\n      } else {\n        event.dataTransfer.effectAllowed = 'move';\n      }\n\n      // encode all mime types\n      for (let key in object) {\n        log(`setting up mime: ${key}`);\n        event.dataTransfer.setData(key, JSON.stringify(object[key]));\n      }\n    };\n    const dragEnd = async (event: DragEvent) => {\n      if (event.dataTransfer.dropEffect === 'none') {\n        props.dragend({\n          copy: false,\n          success: false\n        });\n        return;\n      }\n      props.dragend({\n        copy: event.dataTransfer.dropEffect === 'copy',\n        success: true\n      });\n    };\n\n    props.forwardRef.current.addEventListener('dragstart', dragStart);\n    props.forwardRef.current.addEventListener('dragend', dragEnd);\n\n    return () => {\n      props.forwardRef.current?.removeEventListener('dragstart', dragStart);\n      props.forwardRef.current?.removeEventListener('dragend', dragEnd);\n    };\n  }, [props.forwardRef]);\n};\n\nexport const DraggableWidget = <T>(props: React.PropsWithChildren<UseDraggableProps<T>>) => {\n  useDraggable(props);\n  return props.children as React.JSX.Element;\n};\n"]}

dist/widgets/hooks/useModelElement.jsx

@@ -5,3 +5,3 @@ import * as React from 'react';
 export const useModelElement = (props) => {
-    const ref = React.useRef();
+    const ref = React.useRef(null);
     useResizeObserver({
@@ -8,0 +8,0 @@ forwardRef: ref,

dist/widgets/hooks/useModelElement.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"useModelElement.jsx","sourceRoot":"","sources":["../../../src/widgets/hooks/useModelElement.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAQxD,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,EAAkB,CAAC;IAC3C,iBAAiB,CAAC;QAChB,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,YAAY;QACnC,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE;YACV,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QAChC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAClB,OAAO,GAAG,CAAC;AACb,CAAC,CAAC","sourcesContent":["import { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { useResizeObserver } from './useResizeObserver';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\n\nexport interface UseModelElementProps {\n  model: WorkspaceModel;\n  engine: WorkspaceEngine;\n}\n\nexport const useModelElement = (props: UseModelElementProps) => {\n  const ref = React.useRef<HTMLDivElement>();\n  useResizeObserver({\n    forwardRef: ref,\n    dimension: props.model.r_dimensions,\n    engine: props.engine\n  });\n  useEffect(() => {\n    props.model.setVisible(true);\n    return () => {\n      props.model.setVisible(false);\n    };\n  }, [props.model]);\n  return ref;\n};\n"]}
+{"version":3,"file":"useModelElement.jsx","sourceRoot":"","sources":["../../../src/widgets/hooks/useModelElement.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAQxD,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,iBAAiB,CAAC;QAChB,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,YAAY;QACnC,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE;YACV,KAAK,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QAChC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAClB,OAAO,GAAG,CAAC;AACb,CAAC,CAAC","sourcesContent":["import { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport * as React from 'react';\nimport { useEffect } from 'react';\nimport { useResizeObserver } from './useResizeObserver';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\n\nexport interface UseModelElementProps {\n  model: WorkspaceModel;\n  engine: WorkspaceEngine;\n}\n\nexport const useModelElement = (props: UseModelElementProps) => {\n  const ref = React.useRef<HTMLDivElement>(null);\n  useResizeObserver({\n    forwardRef: ref,\n    dimension: props.model.r_dimensions,\n    engine: props.engine\n  });\n  useEffect(() => {\n    props.model.setVisible(true);\n    return () => {\n      props.model.setVisible(false);\n    };\n  }, [props.model]);\n  return ref;\n};\n"]}

dist/widgets/layers/debug/DebugLayer.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"DebugLayer.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/debug/DebugLayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Layer, LayerManager } from '../LayerManager';\nimport * as React from 'react';\nimport * as _ from 'lodash';\nimport styled from '@emotion/styled';\nimport { WorkspaceEngine } from '../../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../../core-models/WorkspaceModel';\nimport { WorkspaceCollectionModel } from '../../../core-models/WorkspaceCollectionModel';\nimport { DimensionTrackingWidget } from '../../primitives/DimensionTrackingWidget';\nimport { WorkspaceNodeModel } from '../../../entities/node/WorkspaceNodeModel';\nimport { useEffect } from 'react';\nimport { useForceUpdate } from '../../hooks/useForceUpdate';\n\nexport interface DebugLayerOptions {\n  dividers?: boolean;\n  panels?: boolean;\n  resizeDividers?: boolean;\n}\n\nexport class DebugLayer extends Layer {\n  private l1: () => void;\n\n  constructor(public debugOptions: DebugLayerOptions = { panels: true }) {\n    super({\n      mouseEvents: false\n    });\n\n    const l2 = this.registerListener({\n      removed: () => {\n        this.l1();\n        l2();\n      }\n    });\n  }\n\n  setLayerManager(manager: LayerManager) {\n    super.setLayerManager(manager);\n    this.l1 = this.layerManager.registerListener({\n      layerAdded: () => {\n        // we defer this since other plugins might move stuff to the top\n        _.defer(() => {\n          this.moveToTop();\n        });\n      }\n    });\n  }\n\n  updateOptions(options: Partial<DebugLayerOptions>) {\n    this.debugOptions = {\n      ...this.debugOptions,\n      ...options\n    };\n    this.repaint();\n  }\n\n  renderLayer(event): JSX.Element {\n    return <DebugLayerWidget options={this.debugOptions} engine={event.engine} model={event.model} />;\n  }\n}\n\nexport interface DebugLayerWidgetProps {\n  engine: WorkspaceEngine;\n  model: WorkspaceModel;\n  options: DebugLayerOptions;\n}\n\nexport const DebugPanel: React.FC<{ model: WorkspaceModel }> = (props) => {\n  const forceUpdate = useForceUpdate();\n  useEffect(() => {\n    return props.model.registerListener({\n      visibilityChanged: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n  if (!props.model.r_visible) {\n    return null;\n  }\n  return (\n    <S.Outline2 dimension={props.model.r_dimensions}>\n      <S.DebugID>{props.model.id.substring(0, 7)}</S.DebugID>\n    </S.Outline2>\n  );\n};\n\nexport const DebugLayerWidget: React.FC<DebugLayerWidgetProps> = (props) => {\n  const forceUpdate = useForceUpdate(true);\n  useEffect(() => {\n    props.model.registerListener({\n      layoutInvalidated: () => {\n        forceUpdate();\n      },\n      dimensionsInvalidated: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  return (\n    <>\n      {props.options?.panels\n        ? props.model\n            .flatten()\n            .filter((p) => !(p instanceof WorkspaceCollectionModel))\n            .map((m) => {\n              return <DebugPanel model={m} key={m.id} />;\n            })\n        : []}\n\n      {props.options?.dividers\n        ? props.model\n            .flatten()\n            .filter((p) => p instanceof WorkspaceNodeModel)\n            .flatMap((m: WorkspaceNodeModel) => m.r_divisions)\n            .map((m) => {\n              return <S.Outline dimension={m} key={m.id} />;\n            })\n        : []}\n\n      {props.options?.resizeDividers\n        ? props.model\n            .flatten()\n            .filter((p) => p instanceof WorkspaceNodeModel)\n            .flatMap((m: WorkspaceNodeModel) => m.getResizeDivisions())\n            .map((m) => {\n              return <S.Outline dimension={m.dimensions} key={m.dimensions.id} />;\n            })\n        : []}\n    </>\n  );\n};\n\nnamespace S {\n  export const Outline = styled(DimensionTrackingWidget)`\n    box-sizing: border-box;\n    border: dashed red 1px;\n  `;\n\n  export const Outline2 = styled(DimensionTrackingWidget)`\n    box-sizing: border-box;\n    border: solid cyan 1px;\n  `;\n\n  export const DebugID = styled.div`\n    background: cyan;\n    color: black;\n    font-size: 10px;\n    padding: 2px;\n    display: inline-block;\n    top: 0;\n    right: 0;\n    position: absolute;\n  `;\n}\n"]}
+{"version":3,"file":"DebugLayer.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/debug/DebugLayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Layer, LayerManager } from '../LayerManager';\nimport * as React from 'react';\nimport * as _ from 'lodash';\nimport styled from '@emotion/styled';\nimport { WorkspaceEngine } from '../../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../../core-models/WorkspaceModel';\nimport { WorkspaceCollectionModel } from '../../../core-models/WorkspaceCollectionModel';\nimport { DimensionTrackingWidget } from '../../primitives/DimensionTrackingWidget';\nimport { WorkspaceNodeModel } from '../../../entities/node/WorkspaceNodeModel';\nimport { useEffect } from 'react';\nimport { useForceUpdate } from '../../hooks/useForceUpdate';\n\nexport interface DebugLayerOptions {\n  dividers?: boolean;\n  panels?: boolean;\n  resizeDividers?: boolean;\n}\n\nexport class DebugLayer extends Layer {\n  private l1: () => void;\n\n  constructor(public debugOptions: DebugLayerOptions = { panels: true }) {\n    super({\n      mouseEvents: false\n    });\n\n    const l2 = this.registerListener({\n      removed: () => {\n        this.l1();\n        l2();\n      }\n    });\n  }\n\n  setLayerManager(manager: LayerManager) {\n    super.setLayerManager(manager);\n    this.l1 = this.layerManager.registerListener({\n      layerAdded: () => {\n        // we defer this since other plugins might move stuff to the top\n        _.defer(() => {\n          this.moveToTop();\n        });\n      }\n    });\n  }\n\n  updateOptions(options: Partial<DebugLayerOptions>) {\n    this.debugOptions = {\n      ...this.debugOptions,\n      ...options\n    };\n    this.repaint();\n  }\n\n  renderLayer(event): React.JSX.Element {\n    return <DebugLayerWidget options={this.debugOptions} engine={event.engine} model={event.model} />;\n  }\n}\n\nexport interface DebugLayerWidgetProps {\n  engine: WorkspaceEngine;\n  model: WorkspaceModel;\n  options: DebugLayerOptions;\n}\n\nexport const DebugPanel: React.FC<{ model: WorkspaceModel }> = (props) => {\n  const forceUpdate = useForceUpdate();\n  useEffect(() => {\n    return props.model.registerListener({\n      visibilityChanged: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n  if (!props.model.r_visible) {\n    return null;\n  }\n  return (\n    <S.Outline2 dimension={props.model.r_dimensions}>\n      <S.DebugID>{props.model.id.substring(0, 7)}</S.DebugID>\n    </S.Outline2>\n  );\n};\n\nexport const DebugLayerWidget: React.FC<DebugLayerWidgetProps> = (props) => {\n  const forceUpdate = useForceUpdate(true);\n  useEffect(() => {\n    props.model.registerListener({\n      layoutInvalidated: () => {\n        forceUpdate();\n      },\n      dimensionsInvalidated: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  return (\n    <>\n      {props.options?.panels\n        ? props.model\n            .flatten()\n            .filter((p) => !(p instanceof WorkspaceCollectionModel))\n            .map((m) => {\n              return <DebugPanel model={m} key={m.id} />;\n            })\n        : []}\n\n      {props.options?.dividers\n        ? props.model\n            .flatten()\n            .filter((p) => p instanceof WorkspaceNodeModel)\n            .flatMap((m: WorkspaceNodeModel) => m.r_divisions)\n            .map((m) => {\n              return <S.Outline dimension={m} key={m.id} />;\n            })\n        : []}\n\n      {props.options?.resizeDividers\n        ? props.model\n            .flatten()\n            .filter((p) => p instanceof WorkspaceNodeModel)\n            .flatMap((m: WorkspaceNodeModel) => m.getResizeDivisions())\n            .map((m) => {\n              return <S.Outline dimension={m.dimensions} key={m.dimensions.id} />;\n            })\n        : []}\n    </>\n  );\n};\n\nnamespace S {\n  export const Outline = styled(DimensionTrackingWidget)`\n    box-sizing: border-box;\n    border: dashed red 1px;\n  `;\n\n  export const Outline2 = styled(DimensionTrackingWidget)`\n    box-sizing: border-box;\n    border: solid cyan 1px;\n  `;\n\n  export const DebugID = styled.div`\n    background: cyan;\n    color: black;\n    font-size: 10px;\n    padding: 2px;\n    display: inline-block;\n    top: 0;\n    right: 0;\n    position: absolute;\n  `;\n}\n"]}

dist/widgets/layers/LayerManager.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"LayerManager.js","sourceRoot":"","sources":["../../../src/widgets/layers/LayerManager.ts"],"names":[],"mappings":"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","sourcesContent":["import { BaseListener, BaseObserver } from '../../core/BaseObserver';\nimport { v4 } from 'uuid';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\n\nexport interface LayerListener extends BaseListener {\n  removed: () => any;\n  moveToTop: () => any;\n  repaint: () => any;\n}\n\nexport interface RenderLayerEvent {\n  engine: WorkspaceEngine;\n  model: WorkspaceModel;\n}\n\nexport interface LayerOptions {\n  mouseEvents: boolean;\n}\n\nexport abstract class Layer<T extends LayerListener = LayerListener> extends BaseObserver<T> {\n  id: string;\n  layerManager: LayerManager;\n\n  constructor(public options: LayerOptions) {\n    super();\n    this.id = v4();\n    this.layerManager = null;\n  }\n\n  abstract renderLayer(event: RenderLayerEvent): JSX.Element;\n\n  setLayerManager(manager: LayerManager) {\n    this.layerManager = manager;\n  }\n\n  isInserted() {\n    return !!this.layerManager;\n  }\n\n  remove() {\n    this.iterateListeners((cb) => cb.removed?.());\n  }\n\n  moveToTop() {\n    this.iterateListeners((cb) => cb.moveToTop?.());\n  }\n\n  repaint() {\n    this.iterateListeners((cb) => cb.repaint?.());\n  }\n}\n\nexport interface LayerManagerListener extends BaseListener {\n  layersChanged: () => any;\n  layerAdded: () => any;\n}\n\nexport class LayerManager extends BaseObserver<LayerManagerListener> {\n  private _layers: Set<Layer>;\n\n  initialZIndex: number;\n\n  constructor() {\n    super();\n    this._layers = new Set();\n    this.initialZIndex = 1;\n  }\n\n  setInitialZIndex(index: number) {\n    if (index < 1) {\n      throw new Error('Index must be > 0');\n    }\n    this.initialZIndex = index;\n    this.fireUpdated();\n  }\n\n  get layers() {\n    return Array.from(this._layers.values());\n  }\n\n  fireUpdated() {\n    this.iterateListeners((cb) => cb.layersChanged?.());\n  }\n\n  addLayer(layer: Layer) {\n    layer.setLayerManager(this);\n    this._layers.add(layer);\n    const l = layer.registerListener({\n      removed: () => {\n        this._layers.delete(layer);\n        layer.setLayerManager(null);\n        l();\n        this.fireUpdated();\n      },\n      moveToTop: () => {\n        // remove from current position\n        this._layers.delete(layer);\n\n        // add to the top\n        this._layers.add(layer);\n        this.fireUpdated();\n      }\n    });\n    this.iterateListeners((cb) => cb.layerAdded?.());\n    this.fireUpdated();\n  }\n}\n"]}
+{"version":3,"file":"LayerManager.js","sourceRoot":"","sources":["../../../src/widgets/layers/LayerManager.ts"],"names":[],"mappings":"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","sourcesContent":["import { BaseListener, BaseObserver } from '../../core/BaseObserver';\nimport { v4 } from 'uuid';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\n\nexport interface LayerListener extends BaseListener {\n  removed: () => any;\n  moveToTop: () => any;\n  repaint: () => any;\n}\n\nexport interface RenderLayerEvent {\n  engine: WorkspaceEngine;\n  model: WorkspaceModel;\n}\n\nexport interface LayerOptions {\n  mouseEvents: boolean;\n}\n\nexport abstract class Layer<T extends LayerListener = LayerListener> extends BaseObserver<T> {\n  id: string;\n  layerManager: LayerManager;\n\n  constructor(public options: LayerOptions) {\n    super();\n    this.id = v4();\n    this.layerManager = null;\n  }\n\n  abstract renderLayer(event: RenderLayerEvent): React.JSX.Element;\n\n  setLayerManager(manager: LayerManager) {\n    this.layerManager = manager;\n  }\n\n  isInserted() {\n    return !!this.layerManager;\n  }\n\n  remove() {\n    this.iterateListeners((cb) => cb.removed?.());\n  }\n\n  moveToTop() {\n    this.iterateListeners((cb) => cb.moveToTop?.());\n  }\n\n  repaint() {\n    this.iterateListeners((cb) => cb.repaint?.());\n  }\n}\n\nexport interface LayerManagerListener extends BaseListener {\n  layersChanged: () => any;\n  layerAdded: () => any;\n}\n\nexport class LayerManager extends BaseObserver<LayerManagerListener> {\n  private _layers: Set<Layer>;\n\n  initialZIndex: number;\n\n  constructor() {\n    super();\n    this._layers = new Set();\n    this.initialZIndex = 1;\n  }\n\n  setInitialZIndex(index: number) {\n    if (index < 1) {\n      throw new Error('Index must be > 0');\n    }\n    this.initialZIndex = index;\n    this.fireUpdated();\n  }\n\n  get layers() {\n    return Array.from(this._layers.values());\n  }\n\n  fireUpdated() {\n    this.iterateListeners((cb) => cb.layersChanged?.());\n  }\n\n  addLayer(layer: Layer) {\n    layer.setLayerManager(this);\n    this._layers.add(layer);\n    const l = layer.registerListener({\n      removed: () => {\n        this._layers.delete(layer);\n        layer.setLayerManager(null);\n        l();\n        this.fireUpdated();\n      },\n      moveToTop: () => {\n        // remove from current position\n        this._layers.delete(layer);\n\n        // add to the top\n        this._layers.add(layer);\n        this.fireUpdated();\n      }\n    });\n    this.iterateListeners((cb) => cb.layerAdded?.());\n    this.fireUpdated();\n  }\n}\n"]}

dist/widgets/layers/ordering/OrderingLayer.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"OrderingLayer.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/ordering/OrderingLayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAmC,MAAM,iBAAiB,CAAC;AAGzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAW5D,MAAM,OAAO,aAAc,SAAQ,KAA4B;IAC7D,YAAsB,QAA8B;QAClD,KAAK,CAAC;YACJ,WAAW,EAAE,KAAK;SACnB,CAAC,CAAC;QAHiB,aAAQ,GAAR,QAAQ,CAAsB;IAIpD,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,WAAW,CAAC,MAAqB;QAC/B,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,WAAC,OAAA,MAAA,EAAE,CAAC,WAAW,mDAAG,MAAM,CAAC,CAAA,EAAA,CAAC,CAAC;IAC1D,CAAC;IAED,OAAO,CAAC,KAAqB,EAAE,KAAa;QAC1C,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,WAAC,OAAA,MAAA,EAAE,CAAC,OAAO,mDAAG,KAAK,EAAE,KAAK,CAAC,CAAA,EAAA,CAAC,CAAC;IAC5D,CAAC;IAED,WAAW,CAAC,KAAuB;QACjC,OAAO,CAAC,mBAAmB,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,EAAG,CAAC;IACpE,CAAC;CACF","sourcesContent":["import * as React from 'react';\nimport { Layer, LayerListener, RenderLayerEvent } from '../LayerManager';\nimport { DimensionContainer } from '../../../core/dimensions/DimensionContainer';\nimport { WorkspaceModel } from '../../../core-models/WorkspaceModel';\nimport { OrderingLayerWidget } from './OrderingLayerWidget';\n\nexport interface OrderingLayerListener extends LayerListener {\n  enteredZone: (zone: number | null) => any;\n  dropped: (model: WorkspaceModel, index: number) => any;\n}\n\nexport interface OrderingLayerOptions {\n  trackers: DimensionContainer[];\n}\n\nexport class OrderingLayer extends Layer<OrderingLayerListener> {\n  constructor(protected options2: OrderingLayerOptions) {\n    super({\n      mouseEvents: false\n    });\n  }\n\n  get trackers() {\n    return this.options2.trackers;\n  }\n\n  zoneEntered(number: number | null) {\n    this.iterateListeners((cb) => cb.enteredZone?.(number));\n  }\n\n  dropped(model: WorkspaceModel, index: number) {\n    this.iterateListeners((cb) => cb.dropped?.(model, index));\n  }\n\n  renderLayer(event: RenderLayerEvent): JSX.Element {\n    return <OrderingLayerWidget engine={event.engine} layer={this} />;\n  }\n}\n"]}
+{"version":3,"file":"OrderingLayer.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/ordering/OrderingLayer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,EAAmC,MAAM,iBAAiB,CAAC;AAGzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAW5D,MAAM,OAAO,aAAc,SAAQ,KAA4B;IAC7D,YAAsB,QAA8B;QAClD,KAAK,CAAC;YACJ,WAAW,EAAE,KAAK;SACnB,CAAC,CAAC;QAHiB,aAAQ,GAAR,QAAQ,CAAsB;IAIpD,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC;IAChC,CAAC;IAED,WAAW,CAAC,MAAqB;QAC/B,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,WAAC,OAAA,MAAA,EAAE,CAAC,WAAW,mDAAG,MAAM,CAAC,CAAA,EAAA,CAAC,CAAC;IAC1D,CAAC;IAED,OAAO,CAAC,KAAqB,EAAE,KAAa;QAC1C,IAAI,CAAC,gBAAgB,CAAC,CAAC,EAAE,EAAE,EAAE,WAAC,OAAA,MAAA,EAAE,CAAC,OAAO,mDAAG,KAAK,EAAE,KAAK,CAAC,CAAA,EAAA,CAAC,CAAC;IAC5D,CAAC;IAED,WAAW,CAAC,KAAuB;QACjC,OAAO,CAAC,mBAAmB,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,EAAG,CAAC;IACpE,CAAC;CACF","sourcesContent":["import * as React from 'react';\nimport { Layer, LayerListener, RenderLayerEvent } from '../LayerManager';\nimport { DimensionContainer } from '../../../core/dimensions/DimensionContainer';\nimport { WorkspaceModel } from '../../../core-models/WorkspaceModel';\nimport { OrderingLayerWidget } from './OrderingLayerWidget';\n\nexport interface OrderingLayerListener extends LayerListener {\n  enteredZone: (zone: number | null) => any;\n  dropped: (model: WorkspaceModel, index: number) => any;\n}\n\nexport interface OrderingLayerOptions {\n  trackers: DimensionContainer[];\n}\n\nexport class OrderingLayer extends Layer<OrderingLayerListener> {\n  constructor(protected options2: OrderingLayerOptions) {\n    super({\n      mouseEvents: false\n    });\n  }\n\n  get trackers() {\n    return this.options2.trackers;\n  }\n\n  zoneEntered(number: number | null) {\n    this.iterateListeners((cb) => cb.enteredZone?.(number));\n  }\n\n  dropped(model: WorkspaceModel, index: number) {\n    this.iterateListeners((cb) => cb.dropped?.(model, index));\n  }\n\n  renderLayer(event: RenderLayerEvent): React.JSX.Element {\n    return <OrderingLayerWidget engine={event.engine} layer={this} />;\n  }\n}\n"]}

dist/widgets/layers/ordering/OrderingLayerWidget.jsx

@@ -8,3 +8,3 @@ import * as React from 'react';
 export const OrderingLayerWidgetDivider = (props) => {
-    const ref = useRef();
+    const ref = useRef(null);
     useMouseDragEvents({
@@ -11,0 +11,0 @@ forwardRef: ref,

dist/widgets/layers/ordering/OrderingLayerWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"OrderingLayerWidget.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/ordering/OrderingLayerWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,uBAAuB,EAAE,MAAM,0CAA0C,CAAC;AAGnF,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,oCAAoC,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAU5E,MAAM,CAAC,MAAM,0BAA0B,GAA8C,CAAC,KAAK,EAAE,EAAE;IAC7F,MAAM,GAAG,GAAG,MAAM,EAAkB,CAAC;IACrC,kBAAkB,CAAC;QACjB,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,GAAG,EAAE;YACf,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACvC,CAAC;QACD,SAAS,EAAE,GAAG,EAAE;YACd,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC;KACF,CAAC,CAAC;IACH,iBAAiB,CAAC;QAChB,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,UAAU,EAAE,GAAG;QACf,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;KACF,CAAC,CAAC;IACH,OAAO,CACL,CAAC,uBAAuB,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAClD;MAAA,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,SAAS,CACtC;IAAA,EAAE,uBAAuB,CAAC,CAC3B,CAAC;AACJ,CAAC,CAAC;AAOF,MAAM,CAAC,MAAM,mBAAmB,GAAuC,CAAC,KAAK,EAAE,EAAE;IAC/E,OAAO,CACL,EACE;MAAA,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;YACrC,OAAO,CACL,CAAC,0BAA0B,CACzB,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CACrB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CACV,SAAS,CAAC,CAAC,CAAC,CAAC,CACb,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,EACnB,CACH,CAAC;QACJ,CAAC,CAAC,CACJ;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC,CAAC;AACF,IAAU,CAAC,CAUV;AAVD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;GAQlC,CAAC;AACJ,CAAC,EAVS,CAAC,KAAD,CAAC,QAUV","sourcesContent":["import * as React from 'react';\nimport styled from '@emotion/styled';\nimport { OrderingLayer } from './OrderingLayer';\nimport { DimensionTrackingWidget } from '../../primitives/DimensionTrackingWidget';\nimport { DimensionContainer } from '../../../core/dimensions/DimensionContainer';\nimport { useDragOverModel } from '../../hooks/dnd-model/useDragOverModel';\nimport { useRef } from 'react';\nimport { useMouseDragEvents } from '../../hooks/dnd/useMouseDragEvents';\nimport { useDroppableModel } from '../../hooks/dnd-model/useDraggableModel';\nimport { WorkspaceEngine } from '../../../core/WorkspaceEngine';\n\nexport interface OrderingLayerWidgetDividerProps {\n  layer: OrderingLayer;\n  dimension: DimensionContainer;\n  index: number;\n  engine: WorkspaceEngine;\n}\n\nexport const OrderingLayerWidgetDivider: React.FC<OrderingLayerWidgetDividerProps> = (props) => {\n  const ref = useRef<HTMLDivElement>();\n  useMouseDragEvents({\n    forwardRef: ref,\n    mouseEnter: () => {\n      props.layer.zoneEntered(props.index);\n    },\n    mouseExit: () => {\n      props.layer.zoneEntered(null);\n    }\n  });\n  useDroppableModel({\n    engine: props.engine,\n    forwardRef: ref,\n    onDrop: (model) => {\n      props.layer.dropped(model, props.index);\n    }\n  });\n  return (\n    <DimensionTrackingWidget dimension={props.dimension}>\n      <S.Container ref={ref}></S.Container>\n    </DimensionTrackingWidget>\n  );\n};\n\nexport interface OrderingLayerWidgetProps {\n  layer: OrderingLayer;\n  engine: WorkspaceEngine;\n}\n\nexport const OrderingLayerWidget: React.FC<OrderingLayerWidgetProps> = (props) => {\n  return (\n    <>\n      {props.layer.trackers.map((c, index) => {\n        return (\n          <OrderingLayerWidgetDivider\n            engine={props.engine}\n            index={index}\n            key={c.id}\n            dimension={c}\n            layer={props.layer}\n          />\n        );\n      })}\n    </>\n  );\n};\nnamespace S {\n  export const Container = styled.div`\n    position: absolute;\n    top: -5px;\n    bottom: -5px;\n    left: -5px;\n    right: -5px;\n    //background: mediumpurple;\n    pointer-events: all;\n  `;\n}\n"]}
+{"version":3,"file":"OrderingLayerWidget.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/ordering/OrderingLayerWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,OAAO,EAAE,uBAAuB,EAAE,MAAM,0CAA0C,CAAC;AAGnF,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,oCAAoC,CAAC;AACxE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yCAAyC,CAAC;AAU5E,MAAM,CAAC,MAAM,0BAA0B,GAA8C,CAAC,KAAK,EAAE,EAAE;IAC7F,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,kBAAkB,CAAC;QACjB,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,GAAG,EAAE;YACf,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACvC,CAAC;QACD,SAAS,EAAE,GAAG,EAAE;YACd,KAAK,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC;KACF,CAAC,CAAC;IACH,iBAAiB,CAAC;QAChB,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,UAAU,EAAE,GAAG;QACf,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;KACF,CAAC,CAAC;IACH,OAAO,CACL,CAAC,uBAAuB,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAClD;MAAA,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,SAAS,CACtC;IAAA,EAAE,uBAAuB,CAAC,CAC3B,CAAC;AACJ,CAAC,CAAC;AAOF,MAAM,CAAC,MAAM,mBAAmB,GAAuC,CAAC,KAAK,EAAE,EAAE;IAC/E,OAAO,CACL,EACE;MAAA,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;YACrC,OAAO,CACL,CAAC,0BAA0B,CACzB,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CACrB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CACV,SAAS,CAAC,CAAC,CAAC,CAAC,CACb,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,EACnB,CACH,CAAC;QACJ,CAAC,CAAC,CACJ;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC,CAAC;AACF,IAAU,CAAC,CAUV;AAVD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;GAQlC,CAAC;AACJ,CAAC,EAVS,CAAC,KAAD,CAAC,QAUV","sourcesContent":["import * as React from 'react';\nimport styled from '@emotion/styled';\nimport { OrderingLayer } from './OrderingLayer';\nimport { DimensionTrackingWidget } from '../../primitives/DimensionTrackingWidget';\nimport { DimensionContainer } from '../../../core/dimensions/DimensionContainer';\nimport { useDragOverModel } from '../../hooks/dnd-model/useDragOverModel';\nimport { useRef } from 'react';\nimport { useMouseDragEvents } from '../../hooks/dnd/useMouseDragEvents';\nimport { useDroppableModel } from '../../hooks/dnd-model/useDraggableModel';\nimport { WorkspaceEngine } from '../../../core/WorkspaceEngine';\n\nexport interface OrderingLayerWidgetDividerProps {\n  layer: OrderingLayer;\n  dimension: DimensionContainer;\n  index: number;\n  engine: WorkspaceEngine;\n}\n\nexport const OrderingLayerWidgetDivider: React.FC<OrderingLayerWidgetDividerProps> = (props) => {\n  const ref = useRef<HTMLDivElement>(null);\n  useMouseDragEvents({\n    forwardRef: ref,\n    mouseEnter: () => {\n      props.layer.zoneEntered(props.index);\n    },\n    mouseExit: () => {\n      props.layer.zoneEntered(null);\n    }\n  });\n  useDroppableModel({\n    engine: props.engine,\n    forwardRef: ref,\n    onDrop: (model) => {\n      props.layer.dropped(model, props.index);\n    }\n  });\n  return (\n    <DimensionTrackingWidget dimension={props.dimension}>\n      <S.Container ref={ref}></S.Container>\n    </DimensionTrackingWidget>\n  );\n};\n\nexport interface OrderingLayerWidgetProps {\n  layer: OrderingLayer;\n  engine: WorkspaceEngine;\n}\n\nexport const OrderingLayerWidget: React.FC<OrderingLayerWidgetProps> = (props) => {\n  return (\n    <>\n      {props.layer.trackers.map((c, index) => {\n        return (\n          <OrderingLayerWidgetDivider\n            engine={props.engine}\n            index={index}\n            key={c.id}\n            dimension={c}\n            layer={props.layer}\n          />\n        );\n      })}\n    </>\n  );\n};\nnamespace S {\n  export const Container = styled.div`\n    position: absolute;\n    top: -5px;\n    bottom: -5px;\n    left: -5px;\n    right: -5px;\n    //background: mediumpurple;\n    pointer-events: all;\n  `;\n}\n"]}

dist/widgets/layers/ordering/OrderingWidget.jsx

@@ -9,3 +9,3 @@ import * as React from 'react';
     const [expand, setExpand] = useState(false);
-    const ref = useRef();
+    const ref = useRef(null);
     useResizeObserver({
@@ -12,0 +12,0 @@ forwardRef: ref,

dist/widgets/layers/ordering/OrderingWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"OrderingWidget.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/ordering/OrderingWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport styled from '@emotion/styled';\nimport { OrderingLayer } from './OrderingLayer';\nimport { useEffect, useRef, useState } from 'react';\nimport { WorkspaceEngine } from '../../../core/WorkspaceEngine';\nimport { DimensionContainer } from '../../../core/dimensions/DimensionContainer';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { WorkspaceModel } from '../../../core-models/WorkspaceModel';\n\nexport interface OrderingWidgetZoneProps {\n  index: number;\n  layer: OrderingLayer;\n  vertical: boolean;\n  container: DimensionContainer;\n  engine: WorkspaceEngine;\n}\n\nexport const OrderingWidgetZone: React.FC<OrderingWidgetZoneProps> = (props) => {\n  const [expand, setExpand] = useState(false);\n  const ref = useRef<HTMLDivElement>();\n  useResizeObserver({\n    forwardRef: ref,\n    dimension: props.container,\n    ignoreDebounce: true,\n    engine: props.engine\n  });\n  useEffect(() => {\n    return props.layer.registerListener({\n      enteredZone: (zone) => {\n        props.container.invalidate();\n        if (!expand && zone === props.index) {\n          setExpand(true);\n        } else {\n          setExpand(false);\n        }\n      }\n    });\n  }, []);\n\n  useEffect(() => {\n    const animationEnd = () => {\n      props.layer.trackers.forEach((t) => {\n        t.invalidate();\n      });\n    };\n    ref.current.addEventListener('transitionend', animationEnd);\n    return () => {\n      ref.current?.removeEventListener('transitionend', animationEnd);\n    };\n  }, []);\n  if (props.vertical) {\n    return <S.ExpandVertical ref={ref} expand={expand} />;\n  }\n  return <S.ExpandHorizontal ref={ref} expand={expand} />;\n};\n\nexport interface OrderedDropEvent {\n  model: WorkspaceModel;\n  index: number;\n}\n\nexport interface OrderingWidgetProps {\n  children: JSX.Element[];\n  vertical: boolean;\n  engine: WorkspaceEngine;\n  dropped: (event: OrderedDropEvent) => any;\n}\n\nexport const OrderingWidget: React.FC<OrderingWidgetProps> = (props) => {\n  const [containers] = useState(() => {\n    return props.children.map((c) => new DimensionContainer()).concat(new DimensionContainer());\n  });\n  const [layer] = useState(() => {\n    return new OrderingLayer({\n      trackers: containers\n    });\n  });\n  useEffect(() => {\n    const l1 = layer.registerListener({\n      dropped: (model, index) => {\n        props.dropped({\n          index,\n          model\n        });\n      }\n    });\n    props.engine.layerManager.addLayer(layer);\n    return () => {\n      l1();\n      layer.remove();\n    };\n  }, []);\n  return (\n    <>\n      <OrderingWidgetZone\n        engine={props.engine}\n        container={containers[0]}\n        layer={layer}\n        vertical={props.vertical}\n        index={0}\n      />\n      {props.children.map((c, index: number) => {\n        return (\n          <React.Fragment key={containers[index + 1]?.id || `${index}`}>\n            {c}\n            {containers[index + 1] ? (\n              <OrderingWidgetZone\n                engine={props.engine}\n                container={containers[index + 1]}\n                layer={layer}\n                vertical={props.vertical}\n                index={index + 1}\n              />\n            ) : null}\n          </React.Fragment>\n        );\n      })}\n    </>\n  );\n};\n\nexport interface SmartOrderingWidgetProps extends OrderingWidgetProps {\n  className?: any;\n  forwardRef?: React.RefObject<HTMLDivElement>;\n}\n\nexport const SmartOrderingWidget: React.FC<SmartOrderingWidgetProps> = (props) => {\n  const [dragging, setDragging] = useState(false);\n  useEffect(() => {\n    return props.engine.registerListener({\n      modelDragStart: () => {\n        setDragging(true);\n      },\n      modelDragEnd: () => {\n        setDragging(false);\n      }\n    });\n  }, []);\n  return (\n    <S.Container className={props.className} ref={props.forwardRef}>\n      {dragging ? (\n        <OrderingWidget\n          {...props}\n          dropped={(event) => {\n            // eagerly set to false so the smart zone unmounts\n            props.dropped?.(event);\n          }}\n        />\n      ) : (\n        props.children\n      )}\n    </S.Container>\n  );\n};\n\nnamespace S {\n  export const Container = styled.div``;\n\n  export const ExpandHorizontal = styled.div<{ expand: boolean }>`\n    width: ${(p) => (p.expand ? 40 : 0)}px;\n    height: 100%;\n    transition: width 0.3s;\n    flex-shrink: 0;\n  `;\n\n  export const ExpandVertical = styled.div<{ expand: boolean }>`\n    height: ${(p) => (p.expand ? 40 : 0)}px;\n    width: 100%;\n    transition: height 0.3s;\n    flex-shrink: 0;\n  `;\n}\n"]}
+{"version":3,"file":"OrderingWidget.jsx","sourceRoot":"","sources":["../../../../src/widgets/layers/ordering/OrderingWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAC;AACjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAWlE,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,KAAK,EAAE,EAAE;IAC7E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,iBAAiB,CAAC;QAChB,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,KAAK,CAAC,SAAS;QAC1B,cAAc,EAAE,IAAI;QACpB,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,KAAK,CAAC,KAAK,CAAC,gBAAgB,CAAC;YAClC,WAAW,EAAE,CAAC,IAAI,EAAE,EAAE;gBACpB,KAAK,CAAC,SAAS,CAAC,UAAU,EAAE,CAAC;gBAC7B,IAAI,CAAC,MAAM,IAAI,IAAI,KAAK,KAAK,CAAC,KAAK,EAAE,CAAC;oBACpC,SAAS,CAAC,IAAI,CAAC,CAAC;gBAClB,CAAC;qBAAM,CAAC;oBACN,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC;YACH,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,GAAG,EAAE;YACxB,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE;gBACjC,CAAC,CAAC,UAAU,EAAE,CAAC;YACjB,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QACF,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;QAC5D,OAAO,GAAG,EAAE;;YACV,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;QAClE,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QACnB,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAG,CAAC;IACxD,CAAC;IACD,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,EAAG,CAAC;AAC1D,CAAC,CAAC;AAcF,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,KAAK,EAAE,EAAE;IACrE,MAAM,CAAC,UAAU,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE;QACjC,OAAO,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,kBAAkB,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI,kBAAkB,EAAE,CAAC,CAAC;IAC9F,CAAC,CAAC,CAAC;IACH,MAAM,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC5B,OAAO,IAAI,aAAa,CAAC;YACvB,QAAQ,EAAE,UAAU;SACrB,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,KAAK,CAAC,gBAAgB,CAAC;YAChC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;gBACxB,KAAK,CAAC,OAAO,CAAC;oBACZ,KAAK;oBACL,KAAK;iBACN,CAAC,CAAC;YACL,CAAC;SACF,CAAC,CAAC;QACH,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC1C,OAAO,GAAG,EAAE;YACV,EAAE,EAAE,CAAC;YACL,KAAK,CAAC,MAAM,EAAE,CAAC;QACjB,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL,EACE;MAAA,CAAC,kBAAkB,CACjB,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CACrB,SAAS,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CACzB,KAAK,CAAC,CAAC,CAAC,CAAC,EAEX;MAAA,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAa,EAAE,EAAE;;YACvC,OAAO,CACL,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAA,MAAA,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,0CAAE,EAAE,KAAI,GAAG,KAAK,EAAE,CAAC,CAC3D;YAAA,CAAC,CAAC,CACF;YAAA,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CACvB,CAAC,kBAAkB,CACjB,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CACrB,SAAS,CAAC,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CACjC,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CACzB,KAAK,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,EACjB,CACH,CAAC,CAAC,CAAC,IAAI,CACV;UAAA,EAAE,KAAK,CAAC,QAAQ,CAAC,CAClB,CAAC;QACJ,CAAC,CAAC,CACJ;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC,CAAC;AAOF,MAAM,CAAC,MAAM,mBAAmB,GAAuC,CAAC,KAAK,EAAE,EAAE;IAC/E,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC;YACnC,cAAc,EAAE,GAAG,EAAE;gBACnB,WAAW,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC;YACD,YAAY,EAAE,GAAG,EAAE;gBACjB,WAAW,CAAC,KAAK,CAAC,CAAC;YACrB,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAC7D;MAAA,CAAC,QAAQ,CAAC,CAAC,CAAC,CACV,CAAC,cAAc,CACb,IAAI,KAAK,CAAC,CACV,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;;gBACjB,kDAAkD;gBAClD,MAAA,KAAK,CAAC,OAAO,sDAAG,KAAK,CAAC,CAAC;YACzB,CAAC,CAAC,EACF,CACH,CAAC,CAAC,CAAC,CACF,KAAK,CAAC,QAAQ,CACf,CACH;IAAA,EAAE,CAAC,CAAC,SAAS,CAAC,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,IAAU,CAAC,CAgBV;AAhBD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;IAEzB,kBAAgB,GAAG,MAAM,CAAC,GAAG,CAAqB;aACpD,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;;;;GAIpC,CAAC;IAEW,gBAAc,GAAG,MAAM,CAAC,GAAG,CAAqB;cACjD,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;;;;GAIrC,CAAC;AACJ,CAAC,EAhBS,CAAC,KAAD,CAAC,QAgBV","sourcesContent":["import * as React from 'react';\nimport styled from '@emotion/styled';\nimport { OrderingLayer } from './OrderingLayer';\nimport { useEffect, useRef, useState } from 'react';\nimport { WorkspaceEngine } from '../../../core/WorkspaceEngine';\nimport { DimensionContainer } from '../../../core/dimensions/DimensionContainer';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { WorkspaceModel } from '../../../core-models/WorkspaceModel';\n\nexport interface OrderingWidgetZoneProps {\n  index: number;\n  layer: OrderingLayer;\n  vertical: boolean;\n  container: DimensionContainer;\n  engine: WorkspaceEngine;\n}\n\nexport const OrderingWidgetZone: React.FC<OrderingWidgetZoneProps> = (props) => {\n  const [expand, setExpand] = useState(false);\n  const ref = useRef<HTMLDivElement>(null);\n  useResizeObserver({\n    forwardRef: ref,\n    dimension: props.container,\n    ignoreDebounce: true,\n    engine: props.engine\n  });\n  useEffect(() => {\n    return props.layer.registerListener({\n      enteredZone: (zone) => {\n        props.container.invalidate();\n        if (!expand && zone === props.index) {\n          setExpand(true);\n        } else {\n          setExpand(false);\n        }\n      }\n    });\n  }, []);\n\n  useEffect(() => {\n    const animationEnd = () => {\n      props.layer.trackers.forEach((t) => {\n        t.invalidate();\n      });\n    };\n    ref.current.addEventListener('transitionend', animationEnd);\n    return () => {\n      ref.current?.removeEventListener('transitionend', animationEnd);\n    };\n  }, []);\n  if (props.vertical) {\n    return <S.ExpandVertical ref={ref} expand={expand} />;\n  }\n  return <S.ExpandHorizontal ref={ref} expand={expand} />;\n};\n\nexport interface OrderedDropEvent {\n  model: WorkspaceModel;\n  index: number;\n}\n\nexport interface OrderingWidgetProps {\n  children: React.JSX.Element[];\n  vertical: boolean;\n  engine: WorkspaceEngine;\n  dropped: (event: OrderedDropEvent) => any;\n}\n\nexport const OrderingWidget: React.FC<OrderingWidgetProps> = (props) => {\n  const [containers] = useState(() => {\n    return props.children.map((c) => new DimensionContainer()).concat(new DimensionContainer());\n  });\n  const [layer] = useState(() => {\n    return new OrderingLayer({\n      trackers: containers\n    });\n  });\n  useEffect(() => {\n    const l1 = layer.registerListener({\n      dropped: (model, index) => {\n        props.dropped({\n          index,\n          model\n        });\n      }\n    });\n    props.engine.layerManager.addLayer(layer);\n    return () => {\n      l1();\n      layer.remove();\n    };\n  }, []);\n  return (\n    <>\n      <OrderingWidgetZone\n        engine={props.engine}\n        container={containers[0]}\n        layer={layer}\n        vertical={props.vertical}\n        index={0}\n      />\n      {props.children.map((c, index: number) => {\n        return (\n          <React.Fragment key={containers[index + 1]?.id || `${index}`}>\n            {c}\n            {containers[index + 1] ? (\n              <OrderingWidgetZone\n                engine={props.engine}\n                container={containers[index + 1]}\n                layer={layer}\n                vertical={props.vertical}\n                index={index + 1}\n              />\n            ) : null}\n          </React.Fragment>\n        );\n      })}\n    </>\n  );\n};\n\nexport interface SmartOrderingWidgetProps extends OrderingWidgetProps {\n  className?: any;\n  forwardRef?: React.RefObject<HTMLDivElement>;\n}\n\nexport const SmartOrderingWidget: React.FC<SmartOrderingWidgetProps> = (props) => {\n  const [dragging, setDragging] = useState(false);\n  useEffect(() => {\n    return props.engine.registerListener({\n      modelDragStart: () => {\n        setDragging(true);\n      },\n      modelDragEnd: () => {\n        setDragging(false);\n      }\n    });\n  }, []);\n  return (\n    <S.Container className={props.className} ref={props.forwardRef}>\n      {dragging ? (\n        <OrderingWidget\n          {...props}\n          dropped={(event) => {\n            // eagerly set to false so the smart zone unmounts\n            props.dropped?.(event);\n          }}\n        />\n      ) : (\n        props.children\n      )}\n    </S.Container>\n  );\n};\n\nnamespace S {\n  export const Container = styled.div``;\n\n  export const ExpandHorizontal = styled.div<{ expand: boolean }>`\n    width: ${(p) => (p.expand ? 40 : 0)}px;\n    height: 100%;\n    transition: width 0.3s;\n    flex-shrink: 0;\n  `;\n\n  export const ExpandVertical = styled.div<{ expand: boolean }>`\n    height: ${(p) => (p.expand ? 40 : 0)}px;\n    width: 100%;\n    transition: height 0.3s;\n    flex-shrink: 0;\n  `;\n}\n"]}

dist/widgets/layouts/DirectionalChildWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"DirectionalChildWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/layouts/DirectionalChildWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEpE,IAAU,CAAC,CAOV;AAPD,WAAU,CAAC;IACI,gBAAc,GAAG,MAAM,CAAC,GAAG,CAAoD;MACxF,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,KAAK,cAAc,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;MACtE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,MAAM,eAAe,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;mBAC9D,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBAC3B,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;GACvC,CAAC;AACJ,CAAC,EAPS,CAAC,KAAD,CAAC,QAOV;AASD,MAAM,CAAC,MAAM,oBAAoB,GAAwC,CAAC,KAAK,EAAE,EAAE;IACjF,IAAI,KAAK,GAAG,IAAI,CAAC;IACjB,IAAI,MAAM,GAAG,IAAI,CAAC;IAClB,IAAI,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;IAE1B,IAAI,CAAC,MAAM,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QAC9B,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;IACnC,CAAC;SAAM,IAAI,CAAC,MAAM,EAAE,CAAC;QACnB,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;IACjC,CAAC;IAED,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC;YAC3C,OAAO,EAAE,GAAG,EAAE;gBACZ,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,EAAE,EAAE,CAAC;QACP,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,CAAC,CAAC,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC7D;MAAA,CAAC,KAAK,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,CACrC;IAAA,EAAE,CAAC,CAAC,cAAc,CAAC,CACpB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useEffect } from 'react';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport styled from '@emotion/styled';\nimport { useForceUpdate } from '../../widgets/hooks/useForceUpdate';\n\nnamespace S {\n  export const ChildContainer = styled.div<{ width: number; height: number; expand: boolean }>`\n    ${(p) => (p.width ? `min-width: ${p.width}px; width: ${p.width}px` : '')};\n    ${(p) => (p.height ? `min-height: ${p.height}px; height: ${p.height}px` : '')};\n    flex-shrink: ${(p) => (p.expand ? 1 : 0)};\n    flex-grow: ${(p) => (p.expand ? 1 : 0)};\n  `;\n}\n\nexport interface DirectionChildWidgetProps {\n  vertical: boolean;\n  model: WorkspaceModel;\n  expand: boolean;\n  generateElement: (model: WorkspaceModel) => JSX.Element;\n}\n\nexport const DirectionChildWidget: React.FC<DirectionChildWidgetProps> = (props) => {\n  let width = null;\n  let height = null;\n  let expand = props.expand;\n\n  if (!expand && props.vertical) {\n    height = props.model.size.height;\n  } else if (!expand) {\n    width = props.model.size.width;\n  }\n\n  const forceUpdate = useForceUpdate();\n  useEffect(() => {\n    const l1 = props.model.size.registerListener({\n      updated: () => {\n        forceUpdate();\n      }\n    });\n\n    return () => {\n      l1();\n    };\n  }, []);\n\n  return (\n    <S.ChildContainer expand={expand} width={width} height={height}>\n      {props.generateElement(props.model)}\n    </S.ChildContainer>\n  );\n};\n"]}
+{"version":3,"file":"DirectionalChildWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/layouts/DirectionalChildWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAEpE,IAAU,CAAC,CAOV;AAPD,WAAU,CAAC;IACI,gBAAc,GAAG,MAAM,CAAC,GAAG,CAAoD;MACxF,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,KAAK,cAAc,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;MACtE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,MAAM,eAAe,CAAC,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;mBAC9D,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;iBAC3B,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;GACvC,CAAC;AACJ,CAAC,EAPS,CAAC,KAAD,CAAC,QAOV;AASD,MAAM,CAAC,MAAM,oBAAoB,GAAwC,CAAC,KAAK,EAAE,EAAE;IACjF,IAAI,KAAK,GAAG,IAAI,CAAC;IACjB,IAAI,MAAM,GAAG,IAAI,CAAC;IAClB,IAAI,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC;IAE1B,IAAI,CAAC,MAAM,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QAC9B,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC;IACnC,CAAC;SAAM,IAAI,CAAC,MAAM,EAAE,CAAC;QACnB,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;IACjC,CAAC;IAED,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC;YAC3C,OAAO,EAAE,GAAG,EAAE;gBACZ,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,EAAE,EAAE,CAAC;QACP,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,CAAC,CAAC,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAC7D;MAAA,CAAC,KAAK,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,CAAC,CACrC;IAAA,EAAE,CAAC,CAAC,cAAc,CAAC,CACpB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useEffect } from 'react';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport styled from '@emotion/styled';\nimport { useForceUpdate } from '../../widgets/hooks/useForceUpdate';\n\nnamespace S {\n  export const ChildContainer = styled.div<{ width: number; height: number; expand: boolean }>`\n    ${(p) => (p.width ? `min-width: ${p.width}px; width: ${p.width}px` : '')};\n    ${(p) => (p.height ? `min-height: ${p.height}px; height: ${p.height}px` : '')};\n    flex-shrink: ${(p) => (p.expand ? 1 : 0)};\n    flex-grow: ${(p) => (p.expand ? 1 : 0)};\n  `;\n}\n\nexport interface DirectionChildWidgetProps {\n  vertical: boolean;\n  model: WorkspaceModel;\n  expand: boolean;\n  generateElement: (model: WorkspaceModel) => React.JSX.Element;\n}\n\nexport const DirectionChildWidget: React.FC<DirectionChildWidgetProps> = (props) => {\n  let width = null;\n  let height = null;\n  let expand = props.expand;\n\n  if (!expand && props.vertical) {\n    height = props.model.size.height;\n  } else if (!expand) {\n    width = props.model.size.width;\n  }\n\n  const forceUpdate = useForceUpdate();\n  useEffect(() => {\n    const l1 = props.model.size.registerListener({\n      updated: () => {\n        forceUpdate();\n      }\n    });\n\n    return () => {\n      l1();\n    };\n  }, []);\n\n  return (\n    <S.ChildContainer expand={expand} width={width} height={height}>\n      {props.generateElement(props.model)}\n    </S.ChildContainer>\n  );\n};\n"]}

dist/widgets/primitives/DividerWidget.jsx

@@ -8,3 +8,3 @@ import * as React from 'react';
     var _a;
-    const ref = useRef();
+    const ref = useRef(null);
     const forceUpdate = useForceUpdate();
@@ -11,0 +11,0 @@ useEffect(() => {

dist/widgets/primitives/DividerWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"DividerWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/primitives/DividerWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAG/D,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAUzD,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,KAAK,EAAE,EAAE;;IACnE,MAAM,GAAG,GAAG,MAAM,EAAkB,CAAC;IACrC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC;YAC/C,aAAa,EAAE,GAAG,EAAE;gBAClB,WAAW,EAAE,CAAC;YAChB,CAAC;YACD,YAAY,EAAE,GAAG,EAAE;gBACjB,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,iBAAiB,CAAC;QAChB,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,KAAK,CAAC,kBAAkB;QACnC,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CACV,UAAU,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAC7B,WAAW,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAC/B,KAAK,CAAC,CAAC,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,CACtC,MAAM,CAAC,CAAC,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,CACxC,SAAS,CAAC,CAAC,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC,CAAC,CAChC,GAAG,CAAC,CAAC,GAAG,CAAC,CACV,EAAE,CAAC,CAAC,SAAS,CAAC,CAChB,CAAC;AACJ,CAAC,CAAC;AACF,IAAU,CAAC,CAeV;AAfD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAMjC;;;;;MAKE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;MACrD,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;GAC1D,CAAC;AACJ,CAAC,EAfS,CAAC,KAAD,CAAC,QAeV","sourcesContent":["import * as React from 'react';\nimport { useEffect, useRef } from 'react';\nimport styled from '@emotion/styled';\nimport { useResizeObserver } from '../hooks/useResizeObserver';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { ResizeDimensionContainer } from '../../entities/node/ResizeDimensionContainer';\nimport { useForceUpdate } from '../hooks/useForceUpdate';\n\nexport interface DividerWidgetProps {\n  dimensionContainer: ResizeDimensionContainer;\n  engine: WorkspaceEngine;\n  thickness?: number;\n  hoverColor: string;\n  activeColor: string;\n}\n\nexport const DividerWidget: React.FC<DividerWidgetProps> = (props) => {\n  const ref = useRef<HTMLDivElement>();\n  const forceUpdate = useForceUpdate();\n\n  useEffect(() => {\n    return props.dimensionContainer.registerListener({\n      activeChanged: () => {\n        forceUpdate();\n      },\n      hoverChanged: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  useResizeObserver({\n    forwardRef: ref,\n    dimension: props.dimensionContainer,\n    engine: props.engine\n  });\n  return (\n    <S.Container\n      hoverColor={props.hoverColor}\n      activeColor={props.activeColor}\n      hover={props.dimensionContainer.hover}\n      active={props.dimensionContainer.active}\n      thickness={props.thickness ?? 4}\n      ref={ref}\n    ></S.Container>\n  );\n};\nnamespace S {\n  export const Container = styled.div<{\n    thickness: number;\n    hover: boolean;\n    active: boolean;\n    hoverColor: string;\n    activeColor: string;\n  }>`\n    min-width: 4px;\n    min-height: 4px;\n    transition: background 0.2s;\n    transition-delay: 50ms;\n    ${(p) => (p.hover ? `background: ${p.hoverColor}` : '')};\n    ${(p) => (p.active ? `background: ${p.activeColor}` : '')};\n  `;\n}\n"]}
+{"version":3,"file":"DividerWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/primitives/DividerWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAG/D,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAUzD,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,KAAK,EAAE,EAAE;;IACnE,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,KAAK,CAAC,kBAAkB,CAAC,gBAAgB,CAAC;YAC/C,aAAa,EAAE,GAAG,EAAE;gBAClB,WAAW,EAAE,CAAC;YAChB,CAAC;YACD,YAAY,EAAE,GAAG,EAAE;gBACjB,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,iBAAiB,CAAC;QAChB,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,KAAK,CAAC,kBAAkB;QACnC,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CACV,UAAU,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAC7B,WAAW,CAAC,CAAC,KAAK,CAAC,WAAW,CAAC,CAC/B,KAAK,CAAC,CAAC,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,CACtC,MAAM,CAAC,CAAC,KAAK,CAAC,kBAAkB,CAAC,MAAM,CAAC,CACxC,SAAS,CAAC,CAAC,MAAA,KAAK,CAAC,SAAS,mCAAI,CAAC,CAAC,CAChC,GAAG,CAAC,CAAC,GAAG,CAAC,CACV,EAAE,CAAC,CAAC,SAAS,CAAC,CAChB,CAAC;AACJ,CAAC,CAAC;AACF,IAAU,CAAC,CAeV;AAfD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAMjC;;;;;MAKE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;MACrD,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;GAC1D,CAAC;AACJ,CAAC,EAfS,CAAC,KAAD,CAAC,QAeV","sourcesContent":["import * as React from 'react';\nimport { useEffect, useRef } from 'react';\nimport styled from '@emotion/styled';\nimport { useResizeObserver } from '../hooks/useResizeObserver';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { ResizeDimensionContainer } from '../../entities/node/ResizeDimensionContainer';\nimport { useForceUpdate } from '../hooks/useForceUpdate';\n\nexport interface DividerWidgetProps {\n  dimensionContainer: ResizeDimensionContainer;\n  engine: WorkspaceEngine;\n  thickness?: number;\n  hoverColor: string;\n  activeColor: string;\n}\n\nexport const DividerWidget: React.FC<DividerWidgetProps> = (props) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const forceUpdate = useForceUpdate();\n\n  useEffect(() => {\n    return props.dimensionContainer.registerListener({\n      activeChanged: () => {\n        forceUpdate();\n      },\n      hoverChanged: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  useResizeObserver({\n    forwardRef: ref,\n    dimension: props.dimensionContainer,\n    engine: props.engine\n  });\n  return (\n    <S.Container\n      hoverColor={props.hoverColor}\n      activeColor={props.activeColor}\n      hover={props.dimensionContainer.hover}\n      active={props.dimensionContainer.active}\n      thickness={props.thickness ?? 4}\n      ref={ref}\n    ></S.Container>\n  );\n};\nnamespace S {\n  export const Container = styled.div<{\n    thickness: number;\n    hover: boolean;\n    active: boolean;\n    hoverColor: string;\n    activeColor: string;\n  }>`\n    min-width: 4px;\n    min-height: 4px;\n    transition: background 0.2s;\n    transition-delay: 50ms;\n    ${(p) => (p.hover ? `background: ${p.hoverColor}` : '')};\n    ${(p) => (p.active ? `background: ${p.activeColor}` : '')};\n  `;\n}\n"]}

dist/widgets/primitives/DraggableWidget.jsx

@@ -13,3 +13,3 @@ import * as React from 'react';
 export const DraggableWidget = (props) => {
-    const ref = useRef();
+    const ref = useRef(null);
     const forceUpdate = useForceUpdate();
@@ -16,0 +16,0 @@ useDraggableModel({

dist/widgets/primitives/DraggableWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"DraggableWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/primitives/DraggableWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAUzD,IAAU,CAAC,CAIV;AAJD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAwB;cAC/C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;GACpD,CAAC;AACJ,CAAC,EAJS,CAAC,KAAD,CAAC,QAIV;AAED,MAAM,CAAC,MAAM,eAAe,GAA4D,CAAC,KAAK,EAAE,EAAE;IAChG,MAAM,GAAG,GAAG,MAAM,EAAkB,CAAC;IACrC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,iBAAiB,CAAC;QAChB,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,GAAG;QACnC,KAAK,EAAE,KAAK,CAAC,KAAK;QAClB,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC;YACnC,WAAW,EAAE,GAAG,EAAE;gBAChB,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CACV,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,IAAI,GAAG,CAAC,CAC7B,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAChC,WAAW,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;YACrB,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;gBACxB,OAAO;YACT,CAAC;YACD,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,IAAI,EAAE,EAAE;gBACrC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YAClE,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CACF,SAAS,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;YACnB,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;gBACxB,OAAO;YACT,CAAC;YACD,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,IAAI,EAAE,EAAE;gBACrC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;YACnE,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;IAAA,EAAE,CAAC,CAAC,SAAS,CAAC,CACf,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport styled from '@emotion/styled';\nimport { useEffect, useRef } from 'react';\nimport { useDraggableModel } from '../hooks/dnd-model/useDraggableModel';\nimport { useForceUpdate } from '../hooks/useForceUpdate';\n\nexport interface DraggableWidgetProps {\n  engine: WorkspaceEngine;\n  model: WorkspaceModel;\n  className?: string;\n  onClick?: () => any;\n  forwardRef?: React.RefObject<HTMLDivElement>;\n}\n\nnamespace S {\n  export const Draggable = styled.div<{ draggable: boolean }>`\n    cursor: ${(p) => (p.draggable ? 'move' : 'pointer')};\n  `;\n}\n\nexport const DraggableWidget: React.FC<React.PropsWithChildren<DraggableWidgetProps>> = (props) => {\n  const ref = useRef<HTMLDivElement>();\n  const forceUpdate = useForceUpdate();\n  useDraggableModel({\n    forwardRef: props.forwardRef || ref,\n    model: props.model,\n    engine: props.engine\n  });\n  useEffect(() => {\n    return props.engine.registerListener({\n      lockUpdated: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  return (\n    <S.Draggable\n      ref={props.forwardRef || ref}\n      draggable={!props.engine.locked}\n      onDragStart={(event) => {\n        if (props.engine.locked) {\n          return;\n        }\n        props.engine.iterateListeners((list) => {\n          list.draggingElement && list.draggingElement(props.model, true);\n        });\n      }}\n      onDragEnd={(event) => {\n        if (props.engine.locked) {\n          return;\n        }\n        props.engine.iterateListeners((list) => {\n          list.draggingElement && list.draggingElement(props.model, false);\n        });\n      }}\n      {...props}\n    >\n      {props.children}\n    </S.Draggable>\n  );\n};\n"]}
+{"version":3,"file":"DraggableWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/primitives/DraggableWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAUzD,IAAU,CAAC,CAIV;AAJD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAwB;cAC/C,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;GACpD,CAAC;AACJ,CAAC,EAJS,CAAC,KAAD,CAAC,QAIV;AAED,MAAM,CAAC,MAAM,eAAe,GAA4D,CAAC,KAAK,EAAE,EAAE;IAChG,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IACrC,iBAAiB,CAAC;QAChB,UAAU,EAAE,KAAK,CAAC,UAAU,IAAI,GAAG;QACnC,KAAK,EAAE,KAAK,CAAC,KAAK;QAClB,MAAM,EAAE,KAAK,CAAC,MAAM;KACrB,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC;YACnC,WAAW,EAAE,GAAG,EAAE;gBAChB,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CACV,GAAG,CAAC,CAAC,KAAK,CAAC,UAAU,IAAI,GAAG,CAAC,CAC7B,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAChC,WAAW,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;YACrB,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;gBACxB,OAAO;YACT,CAAC;YACD,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,IAAI,EAAE,EAAE;gBACrC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;YAClE,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CACF,SAAS,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE;YACnB,IAAI,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC;gBACxB,OAAO;YACT,CAAC;YACD,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,IAAI,EAAE,EAAE;gBACrC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;YACnE,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CACF,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;IAAA,EAAE,CAAC,CAAC,SAAS,CAAC,CACf,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport styled from '@emotion/styled';\nimport { useEffect, useRef } from 'react';\nimport { useDraggableModel } from '../hooks/dnd-model/useDraggableModel';\nimport { useForceUpdate } from '../hooks/useForceUpdate';\n\nexport interface DraggableWidgetProps {\n  engine: WorkspaceEngine;\n  model: WorkspaceModel;\n  className?: string;\n  onClick?: () => any;\n  forwardRef?: React.RefObject<HTMLDivElement>;\n}\n\nnamespace S {\n  export const Draggable = styled.div<{ draggable: boolean }>`\n    cursor: ${(p) => (p.draggable ? 'move' : 'pointer')};\n  `;\n}\n\nexport const DraggableWidget: React.FC<React.PropsWithChildren<DraggableWidgetProps>> = (props) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const forceUpdate = useForceUpdate();\n  useDraggableModel({\n    forwardRef: props.forwardRef || ref,\n    model: props.model,\n    engine: props.engine\n  });\n  useEffect(() => {\n    return props.engine.registerListener({\n      lockUpdated: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  return (\n    <S.Draggable\n      ref={props.forwardRef || ref}\n      draggable={!props.engine.locked}\n      onDragStart={(event) => {\n        if (props.engine.locked) {\n          return;\n        }\n        props.engine.iterateListeners((list) => {\n          list.draggingElement && list.draggingElement(props.model, true);\n        });\n      }}\n      onDragEnd={(event) => {\n        if (props.engine.locked) {\n          return;\n        }\n        props.engine.iterateListeners((list) => {\n          list.draggingElement && list.draggingElement(props.model, false);\n        });\n      }}\n      {...props}\n    >\n      {props.children}\n    </S.Draggable>\n  );\n};\n"]}

dist/widgets/primitives/DropzoneLogicWidget.jsx

@@ -12,3 +12,3 @@ import * as React from 'react';
     const [enter, setEnter] = useState(false);
-    const ref = useRef();
+    const ref = useRef(null);
     useDroppableModel({
@@ -15,0 +15,0 @@ onDrop: (model) => {

dist/widgets/primitives/DropzoneLogicWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"DropzoneLogicWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/primitives/DropzoneLogicWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAGrC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AASrE,IAAU,CAAC,CAEV;AAFD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AACxC,CAAC,EAFS,CAAC,KAAD,CAAC,QAEV;AAED,MAAM,CAAC,MAAM,mBAAmB,GAAgE,CAAC,KAAK,EAAE,EAAE;IACxG,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,GAAG,GAAG,MAAM,EAAkB,CAAC;IACrC,iBAAiB,CAAC;QAChB,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;QACD,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,UAAU,EAAE,GAAG;KAChB,CAAC,CAAC;IACH,kBAAkB,CAAC;QACjB,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,GAAG,EAAE;YACf,QAAQ,CAAC,IAAI,CAAC,CAAC;QACjB,CAAC;QACD,SAAS,EAAE,GAAG,EAAE;YACd,QAAQ,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC;KACF,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAChD;MAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;IAAA,EAAE,CAAC,CAAC,SAAS,CAAC,CACf,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport styled from '@emotion/styled';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport { useEffect, useRef, useState } from 'react';\nimport { useDroppableModel } from '../hooks/dnd-model/useDraggableModel';\nimport { useMouseDragEvents } from '../hooks/dnd/useMouseDragEvents';\n\nexport interface DropzoneLogicWidgetProps {\n  onDrop: (model?: WorkspaceModel) => any;\n  onDragEnter: (entered: boolean) => any;\n  engine: WorkspaceEngine;\n  className?;\n}\n\nnamespace S {\n  export const Container = styled.div``;\n}\n\nexport const DropzoneLogicWidget: React.FC<React.PropsWithChildren<DropzoneLogicWidgetProps>> = (props) => {\n  const [enter, setEnter] = useState(false);\n  const ref = useRef<HTMLDivElement>();\n  useDroppableModel({\n    onDrop: (model) => {\n      props.onDrop(model);\n    },\n    engine: props.engine,\n    forwardRef: ref\n  });\n  useMouseDragEvents({\n    forwardRef: ref,\n    mouseEnter: () => {\n      setEnter(true);\n    },\n    mouseExit: () => {\n      setEnter(false);\n    }\n  });\n  useEffect(() => {\n    props.onDragEnter(enter);\n  }, [enter]);\n\n  return (\n    <S.Container ref={ref} className={props.className}>\n      {props.children}\n    </S.Container>\n  );\n};\n"]}
+{"version":3,"file":"DropzoneLogicWidget.jsx","sourceRoot":"","sources":["../../../src/widgets/primitives/DropzoneLogicWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAGrC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAC;AACzE,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AASrE,IAAU,CAAC,CAEV;AAFD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AACxC,CAAC,EAFS,CAAC,KAAD,CAAC,QAEV;AAED,MAAM,CAAC,MAAM,mBAAmB,GAAgE,CAAC,KAAK,EAAE,EAAE;IACxG,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,iBAAiB,CAAC;QAChB,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;QACD,MAAM,EAAE,KAAK,CAAC,MAAM;QACpB,UAAU,EAAE,GAAG;KAChB,CAAC,CAAC;IACH,kBAAkB,CAAC;QACjB,UAAU,EAAE,GAAG;QACf,UAAU,EAAE,GAAG,EAAE;YACf,QAAQ,CAAC,IAAI,CAAC,CAAC;QACjB,CAAC;QACD,SAAS,EAAE,GAAG,EAAE;YACd,QAAQ,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC;KACF,CAAC,CAAC;IACH,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,OAAO,CACL,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAChD;MAAA,CAAC,KAAK,CAAC,QAAQ,CACjB;IAAA,EAAE,CAAC,CAAC,SAAS,CAAC,CACf,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport styled from '@emotion/styled';\nimport { WorkspaceEngine } from '../../core/WorkspaceEngine';\nimport { WorkspaceModel } from '../../core-models/WorkspaceModel';\nimport { useEffect, useRef, useState } from 'react';\nimport { useDroppableModel } from '../hooks/dnd-model/useDraggableModel';\nimport { useMouseDragEvents } from '../hooks/dnd/useMouseDragEvents';\n\nexport interface DropzoneLogicWidgetProps {\n  onDrop: (model?: WorkspaceModel) => any;\n  onDragEnter: (entered: boolean) => any;\n  engine: WorkspaceEngine;\n  className?;\n}\n\nnamespace S {\n  export const Container = styled.div``;\n}\n\nexport const DropzoneLogicWidget: React.FC<React.PropsWithChildren<DropzoneLogicWidgetProps>> = (props) => {\n  const [enter, setEnter] = useState(false);\n  const ref = useRef<HTMLDivElement>(null);\n  useDroppableModel({\n    onDrop: (model) => {\n      props.onDrop(model);\n    },\n    engine: props.engine,\n    forwardRef: ref\n  });\n  useMouseDragEvents({\n    forwardRef: ref,\n    mouseEnter: () => {\n      setEnter(true);\n    },\n    mouseExit: () => {\n      setEnter(false);\n    }\n  });\n  useEffect(() => {\n    props.onDragEnter(enter);\n  }, [enter]);\n\n  return (\n    <S.Container ref={ref} className={props.className}>\n      {props.children}\n    </S.Container>\n  );\n};\n"]}

dist/widgets/WorkspaceWidget.jsx

@@ -22,3 +22,3 @@ import * as React from 'react';
 export const WorkspaceWidget = (props) => {
-    const ref_container = useRef();
+    const ref_container = useRef(null);
     const timerListener = useRef(null);
@@ -25,0 +25,0 @@ const forceUpdate = useForceUpdate();

dist/widgets/WorkspaceWidget.jsx.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"WorkspaceWidget.jsx","sourceRoot":"","sources":["../../src/widgets/WorkspaceWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oCAAoC,CAAC;AACtE,OAAO,EAAE,4BAA4B,EAAE,MAAM,gCAAgC,CAAC;AAE9E,OAAO,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAOtE,IAAU,CAAC,CAWV;AAXD,WAAU,CAAC;IACI,WAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;GAIlC,CAAC;IAEW,cAAY,GAAG,MAAM,CAAC,kBAAkB,CAAC,CAAA;;;GAGrD,CAAC;AACJ,CAAC,EAXS,CAAC,KAAD,CAAC,QAWV;AAED,MAAM,CAAC,MAAM,eAAe,GAAmC,CAAC,KAAK,EAAE,EAAE;IACvE,MAAM,aAAa,GAAG,MAAM,EAAkB,CAAC;IAC/C,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAEnC,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC;IAErC,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,MAAM,CAAC,aAAa,EAAE,CAAC;IAC/B,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IACzC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,qBAAqB,CAAC;QACpB,UAAU,EAAE,aAAa;QACzB,SAAS,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB;KAC3C,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC;YAC5B,iBAAiB,EAAE,GAAG,EAAE;gBACtB,WAAW,EAAE,CAAC;YAChB,CAAC;YACD,OAAO,EAAE,GAAG,EAAE;gBACZ,WAAW,EAAE,CAAC;YAChB,CAAC;SACF,CAAC,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,gBAAgB,CAAC;QACf,UAAU,EAAE,aAAa;QACzB,6CAA6C;QAC7C,MAAM,EAAE,KAAK;QACb,QAAQ,EAAE,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;YACxB,IAAI,aAAa,CAAC,OAAO,EAAE,CAAC;gBAC1B,YAAY,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;gBACpC,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;YAC/B,CAAC;YAED,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;gBACtC,KAAK,CAAC,MAAM,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;YACrC,CAAC,EAAE,GAAG,CAAC,CAAC;YAER,IAAI,KAAK,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC;gBAC5B,OAAO;YACT,CAAC;YACD,KAAK,CAAC,MAAM,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;QACxC,CAAC;KACF,CAAC,CAAC;IAEH,OAAO,CACL,CAAC,4BAA4B,CAAC,UAAU,CAAC,CAAC,aAAa,CAAC,CACtD;MAAA,CAAC,CAAC,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,aAAa,CAAC,CAC9B;QAAA,CAAC,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,eAAe,CAAC;YACnE,MAAM,EAAE,KAAK,CAAC,MAAM;YACpB,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE;SAClC,CAAC,CACF;QAAA,CAAC,CAAC,CAAC,YAAY,CACb,MAAM,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CACrB,YAAY,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,CACxC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,EAEtC;MAAA,EAAE,CAAC,CAAC,SAAS,CACf;IAAA,EAAE,4BAA4B,CAAC,CAChC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useEffect, useRef } from 'react';\nimport { WorkspaceEngine } from '../core/WorkspaceEngine';\nimport styled from '@emotion/styled';\nimport { useForceUpdate } from './hooks/useForceUpdate';\nimport { LayerManagerWidget } from './layers/LayerManagerWidget';\nimport { useDragOverModel } from './hooks/dnd-model/useDragOverModel';\nimport { UseMouseDragEventsRootWidget } from './hooks/dnd/useMouseDragEvents';\nimport { WorkspaceNodeModel } from '../entities/node/WorkspaceNodeModel';\nimport { useBaseResizeObserver } from './hooks/useBaseResizeObserver';\n\nexport interface WorkspaceWidgetProps {\n  model: WorkspaceNodeModel;\n  engine: WorkspaceEngine;\n}\n\nnamespace S {\n  export const Container = styled.div`\n    display: flex;\n    height: 100%;\n    position: relative;\n  `;\n\n  export const LayerManager = styled(LayerManagerWidget)`\n    width: 100%;\n    height: 100%;\n  `;\n}\n\nexport const WorkspaceWidget: React.FC<WorkspaceWidgetProps> = (props) => {\n  const ref_container = useRef<HTMLDivElement>();\n  const timerListener = useRef(null);\n\n  const forceUpdate = useForceUpdate();\n\n  useEffect(() => {\n    props.engine.fireRepainted();\n  });\n\n  useEffect(() => {\n    props.engine.setRootModel(props.model);\n  }, [props.model]);\n\n  useBaseResizeObserver({\n    forwardRef: ref_container,\n    dimension: props.engine.workspaceContainer\n  });\n\n  useEffect(() => {\n    props.engine.registerListener({\n      layoutInvalidated: () => {\n        forceUpdate();\n      },\n      repaint: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  useDragOverModel({\n    forwardRef: ref_container,\n    // don't accept the drag, but use it for data\n    accept: false,\n    dragOver: ({ modelID }) => {\n      if (timerListener.current) {\n        clearTimeout(timerListener.current);\n        timerListener.current = null;\n      }\n\n      timerListener.current = setTimeout(() => {\n        props.engine.setDraggingNode(null);\n      }, 200);\n\n      if (props.engine.draggingID) {\n        return;\n      }\n      props.engine.setDraggingNode(modelID);\n    }\n  });\n\n  return (\n    <UseMouseDragEventsRootWidget forwardRef={ref_container}>\n      <S.Container ref={ref_container}>\n        {props.engine.getFactory(props.model.getRootModel()).generateContent({\n          engine: props.engine,\n          model: props.model.getRootModel()\n        })}\n        <S.LayerManager\n          engine={props.engine}\n          layerManager={props.engine.layerManager}\n          model={props.model.getRootModel()}\n        />\n      </S.Container>\n    </UseMouseDragEventsRootWidget>\n  );\n};\n"]}
+{"version":3,"file":"WorkspaceWidget.jsx","sourceRoot":"","sources":["../../src/widgets/WorkspaceWidget.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { useEffect, useRef } from 'react';\nimport { WorkspaceEngine } from '../core/WorkspaceEngine';\nimport styled from '@emotion/styled';\nimport { useForceUpdate } from './hooks/useForceUpdate';\nimport { LayerManagerWidget } from './layers/LayerManagerWidget';\nimport { useDragOverModel } from './hooks/dnd-model/useDragOverModel';\nimport { UseMouseDragEventsRootWidget } from './hooks/dnd/useMouseDragEvents';\nimport { WorkspaceNodeModel } from '../entities/node/WorkspaceNodeModel';\nimport { useBaseResizeObserver } from './hooks/useBaseResizeObserver';\n\nexport interface WorkspaceWidgetProps {\n  model: WorkspaceNodeModel;\n  engine: WorkspaceEngine;\n}\n\nnamespace S {\n  export const Container = styled.div`\n    display: flex;\n    height: 100%;\n    position: relative;\n  `;\n\n  export const LayerManager = styled(LayerManagerWidget)`\n    width: 100%;\n    height: 100%;\n  `;\n}\n\nexport const WorkspaceWidget: React.FC<WorkspaceWidgetProps> = (props) => {\n  const ref_container = useRef<HTMLDivElement>(null);\n  const timerListener = useRef(null);\n\n  const forceUpdate = useForceUpdate();\n\n  useEffect(() => {\n    props.engine.fireRepainted();\n  });\n\n  useEffect(() => {\n    props.engine.setRootModel(props.model);\n  }, [props.model]);\n\n  useBaseResizeObserver({\n    forwardRef: ref_container,\n    dimension: props.engine.workspaceContainer\n  });\n\n  useEffect(() => {\n    props.engine.registerListener({\n      layoutInvalidated: () => {\n        forceUpdate();\n      },\n      repaint: () => {\n        forceUpdate();\n      }\n    });\n  }, []);\n\n  useDragOverModel({\n    forwardRef: ref_container,\n    // don't accept the drag, but use it for data\n    accept: false,\n    dragOver: ({ modelID }) => {\n      if (timerListener.current) {\n        clearTimeout(timerListener.current);\n        timerListener.current = null;\n      }\n\n      timerListener.current = setTimeout(() => {\n        props.engine.setDraggingNode(null);\n      }, 200);\n\n      if (props.engine.draggingID) {\n        return;\n      }\n      props.engine.setDraggingNode(modelID);\n    }\n  });\n\n  return (\n    <UseMouseDragEventsRootWidget forwardRef={ref_container}>\n      <S.Container ref={ref_container}>\n        {props.engine.getFactory(props.model.getRootModel()).generateContent({\n          engine: props.engine,\n          model: props.model.getRootModel()\n        })}\n        <S.LayerManager\n          engine={props.engine}\n          layerManager={props.engine.layerManager}\n          model={props.model.getRootModel()}\n        />\n      </S.Container>\n    </UseMouseDragEventsRootWidget>\n  );\n};\n"]}

package.json

 {
   "name": "@projectstorm/react-workspaces-core",
-  "version": "4.2.1",
+  "version": "4.2.2",
   "main": "./dist/index.umd.js",
@@ -11,14 +11,14 @@ "module": "./dist/index.jsx",
   "dependencies": {
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "@emotion/styled": "^11.13.5",
-    "@emotion/react": "^11.13.5",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
+    "@emotion/styled": "^11.14.1",
+    "@emotion/react": "^11.14.0",
     "lodash": "^4.17.21",
-    "color": "^4.2.3",
-    "uuid": "^11.0.3"
+    "color": "^5.0.0",
+    "uuid": "^11.1.0"
   },
   "devDependencies": {
-    "@types/react": "^18.3.12",
-    "@types/react-dom": "^18.3.1",
-    "@types/lodash": "^4.17.13",
+    "@types/react": "^19.1.9",
+    "@types/react-dom": "^19.1.7",
+    "@types/lodash": "^4.17.20",
     "@types/uuid": "^10.0.0"
@@ -25,0 +25,0 @@ },

No alert changes

Improved metrics

Total package byte prevSize

537676

0.71%

Lines of code

3471

0.03%

Dependency changes

• + Added

  color@5.0.3
  (transitive)

• + Added

  color-convert@3.1.3
  (transitive)

• + Added

  color-name@2.1.0
  (transitive)

• + Added

  color-string@2.1.4
  (transitive)

• + Added

  react@19.2.7
  (transitive)

• + Added

  react-dom@19.2.7
  (transitive)

• + Added

  scheduler@0.27.0
  (transitive)

• - Removed

  color@4.2.3
  (transitive)

• - Removed

  color-convert@2.0.1
  (transitive)

• - Removed

  color-name@1.1.4
  (transitive)

• - Removed

  color-string@1.9.1
  (transitive)

• - Removed

  is-arrayish@0.3.4
  (transitive)

• - Removed

  loose-envify@1.4.0
  (transitive)

• - Removed

  react@18.3.1
  (transitive)

• - Removed

  react-dom@18.3.1
  (transitive)

• - Removed

  scheduler@0.23.2
  (transitive)

• - Removed

  simple-swizzle@0.2.4
  (transitive)

• Updated

  @emotion/react@^11.14.0

• Updated

  @emotion/styled@^11.14.1

• Updated

  color@^5.0.0

• Updated

  react@^19.1.1

• Updated

  react-dom@^19.1.1

• Updated

  uuid@^11.1.0