npm - @html-graph/html-graph - Versions diffs - 8.1.0 → 8.3.0 - Mend

@html-graph/html-graph 8.1.0 → 8.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/html-graph.umd.cjs CHANGED Viewed

	@@ -1 +1 @@
1	- (function(v,x){typeof exports=="object"&&typeof module<"u"?x(exports):typeof define=="function"&&define.amd?define(["exports"],x):(v=typeof globalThis<"u"?globalThis:v\|\|self,x(v.HtmlGraph={}))})(this,function(v){"use strict";var or=Object.defineProperty;var sr=(v,x,R)=>x in v?or(v,x,{enumerable:!0,configurable:!0,writable:!0,value:R}):v[x]=R;var i=(v,x,R)=>sr(v,typeof x!="symbol"?x+"":x,R);var x=(r=>(r.Line="line",r.NodeCycle="node-cycle",r.PortCycle="port-cycle",r))(x\|\|{});const R=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r.style.overflow="hidden",r},Ke=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.width="0",r.style.height="0",r},Qe=r=>{r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.visibility="hidden"};class de{constructor(e,t,o){i(this,"host",R());i(this,"container",Ke());i(this,"edgeIdToElementMap",new Map);i(this,"attachedNodeIds",new Set);i(this,"applyTransform",()=>{const e=this.viewportStore.getContentMatrix();this.container.style.transform=`matrix(${e.scale}, 0, 0, ${e.scale}, ${e.x}, ${e.y})`});this.graphStore=e,this.viewportStore=t,this.element=o,this.element.appendChild(this.host),this.host.appendChild(this.container),this.viewportStore.onAfterUpdated.subscribe(this.applyTransform)}attachNode(e){const t=this.graphStore.getNode(e);Qe(t.element),this.attachedNodeIds.add(e),this.container.appendChild(t.element),this.updateNodePosition(e),this.updateNodePriority(e),t.element.style.visibility="visible"}detachNode(e){const t=this.graphStore.getNode(e);this.container.removeChild(t.element),this.attachedNodeIds.delete(e)}attachEdge(e){const t=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,t),this.container.appendChild(t),this.renderEdge(e),this.updateEdgePriority(e)}detachEdge(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t),this.edgeIdToElementMap.delete(e)}clear(){this.edgeIdToElementMap.forEach((e,t)=>{this.detachEdge(t)}),this.attachedNodeIds.forEach(e=>{this.detachNode(e)})}destroy(){this.viewportStore.onAfterUpdated.unsubscribe(this.applyTransform),this.element.removeChild(this.host),this.host.removeChild(this.container)}updateNodePosition(e){const t=this.graphStore.getNode(e),{width:o,height:s}=t.element.getBoundingClientRect(),n=this.viewportStore.getViewportMatrix().scale,{payload:a}=t,h=a.centerFn(o,s),d=a.x-nh.x,c=a.y-nh.y;t.element.style.transform=`translate(${d}px, ${c}px)`}updateNodePriority(e){const t=this.graphStore.getNode(e);t.element.style.zIndex=`${t.payload.priority}`}updateEdgeShape(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t);const s=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,s),this.container.appendChild(s)}renderEdge(e){const t=this.graphStore.getEdge(e),o=this.graphStore.getPort(t.from),s=this.graphStore.getPort(t.to),n=o.element.getBoundingClientRect(),a=s.element.getBoundingClientRect(),h=this.host.getBoundingClientRect(),d=this.viewportStore.getViewportMatrix().scale,c=this.createEdgeRenderPort(o,n,h,d),g=this.createEdgeRenderPort(s,a,h,d);let l=x.Line;o.element===s.element?l=x.PortCycle:o.nodeId===s.nodeId&&(l=x.NodeCycle),t.payload.shape.render({from:c,to:g,category:l})}updateEdgePriority(e){const t=this.graphStore.getEdge(e);t.payload.shape.svg.style.zIndex=`${t.payload.priority}`}createEdgeRenderPort(e,t,o,s){const n=this.viewportStore.createContentCoords({x:t.left-o.left,y:t.top-o.top});return{x:n.x,y:n.y,width:t.widths,height:t.heights,direction:e.payload.direction}}}class Ze{constructor(e){i(this,"xFrom",1/0);i(this,"yFrom",1/0);i(this,"xTo",1/0);i(this,"yTo",1/0);this.graphStore=e}setRenderingBox(e){this.xFrom=e.x,this.xTo=e.x+e.width,this.yFrom=e.y,this.yTo=e.y+e.height}hasNode(e){const t=this.graphStore.getNode(e).payload,{x:o,y:s}=t;return o>=this.xFrom&&o<=this.xTo&&s>=this.yFrom&&s<=this.yTo}hasEdge(e){const t=this.graphStore.getEdge(e),o=this.graphStore.getPort(t.from).nodeId,s=this.graphStore.getPort(t.to).nodeId,n=this.graphStore.getNode(o).payload,a=this.graphStore.getNode(s).payload,h=Math.min(n.x,a.x),d=Math.max(n.x,a.x),c=Math.min(n.y,a.y),g=Math.max(n.y,a.y);return h<=this.xTo&&d>=this.xFrom&&c<=this.yTo&&g>=this.yFrom}}class Je{constructor(e,t,o,s){i(this,"attachedNodes",new Set);i(this,"attachedEdges",new Set);i(this,"renderingBox");i(this,"updateViewport",e=>{this.renderingBox.setRenderingBox(e);const t=new Set,o=new Set,s=new Set,n=new Set;this.graphStore.getAllNodeIds().forEach(a=>{const h=this.renderingBox.hasNode(a),d=this.attachedNodes.has(a);h&&!d?t.add(a):!h&&d&&o.add(a)}),this.graphStore.getAllEdgeIds().forEach(a=>{const h=this.renderingBox.hasEdge(a),d=this.attachedEdges.has(a),c=this.graphStore.getEdge(a),g=this.graphStore.getPort(c.from).nodeId,l=this.graphStore.getPort(c.to).nodeId;h&&(this.renderingBox.hasNode(g)\|\|(t.add(g),o.delete(g)),this.renderingBox.hasNode(l)\|\|(t.add(l),o.delete(l))),h&&!d?s.add(a):!h&&d&&n.add(a)}),n.forEach(a=>{this.handleDetachEdge(a)}),o.forEach(a=>{this.handleDetachNode(a)}),t.forEach(a=>{this.attachedNodes.has(a)\|\|this.handleAttachNode(a)}),s.forEach(a=>{this.handleAttachEdge(a)})});this.htmlView=e,this.graphStore=t,this.trigger=o,this.params=s,this.renderingBox=new Ze(this.graphStore),this.trigger.subscribe(this.updateViewport)}attachNode(e){this.renderingBox.hasNode(e)&&this.handleAttachNode(e)}detachNode(e){this.attachedNodes.has(e)&&this.handleDetachNode(e)}attachEdge(e){this.renderingBox.hasEdge(e)&&this.attachEdgeEntities(e)}detachEdge(e){this.attachedEdges.has(e)&&this.handleDetachEdge(e)}updateNodePosition(e){this.attachedNodes.has(e)?this.htmlView.updateNodePosition(e):this.renderingBox.hasNode(e)&&(this.handleAttachNode(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(t=>{this.attachEdgeEntities(t)}))}updateNodePriority(e){this.attachedNodes.has(e)&&this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgeShape(e)}renderEdge(e){this.attachedEdges.has(e)&&this.htmlView.renderEdge(e)}updateEdgePriority(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgePriority(e)}clear(){this.htmlView.clear(),this.attachedNodes.clear(),this.attachedEdges.clear()}destroy(){this.clear(),this.htmlView.destroy(),this.trigger.unsubscribe(this.updateViewport)}attachEdgeEntities(e){const t=this.graphStore.getEdge(e),o=this.graphStore.getPort(t.from).nodeId,s=this.graphStore.getPort(t.to).nodeId;this.attachedNodes.has(o)\|\|this.handleAttachNode(o),this.attachedNodes.has(s)\|\|this.handleAttachNode(s),this.handleAttachEdge(e)}handleAttachNode(e){this.params.onBeforeNodeAttached(e),this.attachedNodes.add(e),this.htmlView.attachNode(e)}handleDetachNode(e){this.htmlView.detachNode(e),this.attachedNodes.delete(e),this.params.onAfterNodeDetached(e)}handleAttachEdge(e){this.attachedEdges.add(e),this.htmlView.attachEdge(e)}handleDetachEdge(e){this.htmlView.detachEdge(e),this.attachedEdges.delete(e)}}class _e{constructor(e,t){i(this,"deferredNodes",new Set);i(this,"deferredEdges",new Set);this.htmlView=e,this.graphStore=t}attachNode(e){this.isNodeValid(e)?this.htmlView.attachNode(e):this.deferredNodes.add(e)}detachNode(e){this.deferredNodes.has(e)?this.deferredNodes.delete(e):this.htmlView.detachNode(e)}attachEdge(e){this.isEdgeValid(e)?this.htmlView.attachEdge(e):this.deferredEdges.add(e)}detachEdge(e){this.deferredEdges.has(e)?this.deferredEdges.delete(e):this.htmlView.detachEdge(e)}updateNodePosition(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePosition(e)}updateNodePriority(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgeShape(e)}renderEdge(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.renderEdge(e)}updateEdgePriority(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgePriority(e)}clear(){this.deferredNodes.clear(),this.deferredEdges.clear(),this.htmlView.clear()}destroy(){this.htmlView.destroy()}isNodeValid(e){const t=this.graphStore.getNode(e);return!(t.payload.x===null\|\|t.payload.y===null)}tryAttachNode(e){this.isNodeValid(e)&&(this.deferredNodes.delete(e),this.htmlView.attachNode(e))}isEdgeValid(e){const t=this.graphStore.getEdge(e),o=this.graphStore.getPort(t.from),s=this.graphStore.getPort(t.to);return!(this.deferredNodes.has(o.nodeId)\|\|this.deferredNodes.has(s.nodeId))}tryAttachEdge(e){this.isEdgeValid(e)&&(this.deferredEdges.delete(e),this.htmlView.attachEdge(e))}}class U{constructor(){i(this,"callbacks",new Set)}subscribe(e){this.callbacks.add(e)}unsubscribe(e){this.callbacks.delete(e)}emit(e){this.callbacks.forEach(t=>{t(e)})}}const S=()=>{const r=new U;return[r,r]};class j{constructor(e){i(this,"counter",0);this.checkExists=e}create(e){if(e!==void 0)return e;for(;this.checkExists(this.counter);)this.counter++;return this.counter}reset(){this.counter=0}}class A extends Error{constructor(){super(...arguments);i(this,"name","CanvasError")}}class ce{constructor(e,t,o,s,n,a){i(this,"nodeIdGenerator",new j(e=>this.graphStore.hasNode(e)));i(this,"portIdGenerator",new j(e=>this.graphStore.hasPort(e)));i(this,"edgeIdGenerator",new j(e=>this.graphStore.hasEdge(e)));i(this,"onAfterNodeAdded",e=>{this.htmlView.attachNode(e)});i(this,"onAfterNodeUpdated",e=>{this.htmlView.updateNodePosition(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(t=>{this.htmlView.renderEdge(t)})});i(this,"onAfterNodePriorityUpdated",e=>{this.htmlView.updateNodePriority(e)});i(this,"onBeforeNodeRemoved",e=>{this.graphStore.getNodePortIds(e).forEach(t=>{this.unmarkPort(t)}),this.htmlView.detachNode(e)});i(this,"onAfterPortUpdated",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(t=>{this.htmlView.renderEdge(t)})});i(this,"onBeforePortUnmarked",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(t=>{this.removeEdge(t)})});i(this,"onAfterEdgeAdded",e=>{this.htmlView.attachEdge(e)});i(this,"onAfterEdgeShapeUpdated",e=>{this.htmlView.updateEdgeShape(e)});i(this,"onAfterEdgeUpdated",e=>{this.htmlView.renderEdge(e)});i(this,"onAfterEdgePriorityUpdated",e=>{this.htmlView.updateEdgePriority(e)});i(this,"onBeforeEdgeRemoved",e=>{this.htmlView.detachEdge(e)});i(this,"onBeforeClear",()=>{this.nodeIdGenerator.reset(),this.portIdGenerator.reset(),this.edgeIdGenerator.reset(),this.htmlView.clear()});i(this,"onBeforeDestroyEmitter");i(this,"destroyed",!1);i(this,"onBeforeDestroy");this.graph=e,this.viewport=t,this.graphStore=o,this.viewportStore=s,this.htmlView=n,this.params=a,this.graphStore.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.subscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.subscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.subscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.subscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.subscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.subscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.subscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.subscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.subscribe(this.onBeforeClear),[this.onBeforeDestroyEmitter,this.onBeforeDestroy]=S()}addNode(e){const t=this.nodeIdGenerator.create(e.id);if(this.graphStore.hasNode(t))throw new A("failed to add node with existing id");if(this.graphStore.findNodeIdByElement(e.element)!==void 0)throw new A("failed to add node with html element already in use by another node");if(this.graphStore.addNode({id:t,element:e.element,x:e.x??null,y:e.y??null,centerFn:e.centerFn??this.params.nodes.centerFn,priority:e.priority??this.params.nodes.priorityFn()}),e.ports!==void 0)for(const o of e.ports)this.markPort({id:o.id,element:o.element,nodeId:t,direction:o.direction});return this}updateNode(e,t){if(!this.graphStore.hasNode(e))throw new A("failed to update nonexistent node");return this.graphStore.updateNode(e,t??{}),this}removeNode(e){if(!this.graphStore.hasNode(e))throw new A("failed to remove nonexistent node");return this.graphStore.removeNode(e),this}markPort(e){const t=this.portIdGenerator.create(e.id);if(this.graphStore.hasPort(t))throw new A("failed to add port with existing id");if(!this.graphStore.hasNode(e.nodeId))throw new A("failed to mark port for nonexistent node");return this.graphStore.addPort({id:t,element:e.element,nodeId:e.nodeId,direction:e.direction??this.params.ports.direction}),this}updatePort(e,t){if(!this.graphStore.hasPort(e))throw new A("failed to update nonexistent port");return this.graphStore.updatePort(e,t??{}),this}unmarkPort(e){if(!this.graphStore.hasPort(e))throw new A("failed to unmark nonexistent port");return this.graphStore.removePort(e),this}addEdge(e){const t=this.edgeIdGenerator.create(e.id);if(this.graphStore.hasEdge(t))throw new A("failed to add edge with existing id");if(!this.graphStore.hasPort(e.from))throw new A("failed to add edge from nonexistent port");if(!this.graphStore.hasPort(e.to))throw new A("failed to add edge to nonexistent port");return this.graphStore.addEdge({id:t,from:e.from,to:e.to,shape:e.shape??this.params.edges.shapeFactory(t),priority:e.priority??this.params.edges.priorityFn()}),this}updateEdge(e,t){if(!this.graphStore.hasEdge(e))throw new A("failed to update nonexistent edge");return this.graphStore.updateEdge(e,t??{}),this}removeEdge(e){if(!this.graphStore.hasEdge(e))throw new A("failed to remove nonexistent edge");return this.graphStore.removeEdge(e),this}clear(){return this.graphStore.clear(),this}patchViewportMatrix(e){return this.viewportStore.patchViewportMatrix(e),this}patchContentMatrix(e){return this.viewportStore.patchContentMatrix(e),this}destroy(){this.destroyed\|\|(this.clear(),this.onBeforeDestroyEmitter.emit(),this.graphStore.onAfterNodeAdded.unsubscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.unsubscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.unsubscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.unsubscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.unsubscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.unsubscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.unsubscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.unsubscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.unsubscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.unsubscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.unsubscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.unsubscribe(this.onBeforeClear),this.htmlView.destroy(),this.viewportStore.destroy(),this.destroyed=!0)}}class et{constructor(){i(this,"singleToMultiMap",new Map);i(this,"multiToSingleMap",new Map)}addRecord(e,t){const o=this.singleToMultiMap.get(e);o===void 0?this.singleToMultiMap.set(e,new Set([t])):o.add(t),this.multiToSingleMap.set(t,e)}getMultiBySingle(e){const t=this.singleToMultiMap.get(e)??new Set;return Array.from(t.values())}removeByMulti(e){const t=this.multiToSingleMap.get(e),o=this.singleToMultiMap.get(t);o.delete(e),o.size===0&&this.singleToMultiMap.delete(t),this.multiToSingleMap.delete(e)}getByMulti(e){return this.multiToSingleMap.get(e)}removeBySingle(e){this.singleToMultiMap.get(e).forEach(o=>{this.multiToSingleMap.delete(o)}),this.singleToMultiMap.delete(e)}clear(){this.singleToMultiMap.clear(),this.multiToSingleMap.clear()}forEachSingle(e){this.singleToMultiMap.forEach((t,o)=>{e(o)})}hasSingle(e){return this.singleToMultiMap.get(e)!==void 0}hasMulti(e){return this.multiToSingleMap.get(e)!==void 0}}class le{constructor(){i(this,"nodes",new Map);i(this,"ports",new Map);i(this,"edges",new Map);i(this,"nodesElementsMap",new Map);i(this,"portIncomingEdges",new Map);i(this,"portOutcomingEdges",new Map);i(this,"portCycleEdges",new Map);i(this,"elementPorts",new et);i(this,"afterNodeAddedEmitter");i(this,"onAfterNodeAdded");i(this,"afterNodeUpdatedEmitter");i(this,"onAfterNodeUpdated");i(this,"afterNodePriorityUpdatedEmitter");i(this,"onAfterNodePriorityUpdated");i(this,"beforeNodeRemovedEmitter");i(this,"onBeforeNodeRemoved");i(this,"afterPortAddedEmitter");i(this,"onAfterPortAdded");i(this,"afterPortUpdatedEmitter");i(this,"onAfterPortUpdated");i(this,"beforePortRemovedEmitter");i(this,"onBeforePortRemoved");i(this,"afterEdgeAddedEmitter");i(this,"onAfterEdgeAdded");i(this,"afterEdgeShapeUpdatedEmitter");i(this,"onAfterEdgeShapeUpdated");i(this,"afterEdgeUpdatedEmitter");i(this,"onAfterEdgeUpdated");i(this,"afterEdgePriorityUpdatedEmitter");i(this,"onAfterEdgePriorityUpdated");i(this,"beforeEdgeRemovedEmitter");i(this,"onBeforeEdgeRemoved");i(this,"beforeClearEmitter");i(this,"onBeforeClear");[this.afterNodeAddedEmitter,this.onAfterNodeAdded]=S(),[this.afterNodeUpdatedEmitter,this.onAfterNodeUpdated]=S(),[this.afterNodePriorityUpdatedEmitter,this.onAfterNodePriorityUpdated]=S(),[this.beforeNodeRemovedEmitter,this.onBeforeNodeRemoved]=S(),[this.afterPortAddedEmitter,this.onAfterPortAdded]=S(),[this.afterPortUpdatedEmitter,this.onAfterPortUpdated]=S(),[this.beforePortRemovedEmitter,this.onBeforePortRemoved]=S(),[this.afterEdgeAddedEmitter,this.onAfterEdgeAdded]=S(),[this.afterEdgeShapeUpdatedEmitter,this.onAfterEdgeShapeUpdated]=S(),[this.afterEdgeUpdatedEmitter,this.onAfterEdgeUpdated]=S(),[this.afterEdgePriorityUpdatedEmitter,this.onAfterEdgePriorityUpdated]=S(),[this.beforeEdgeRemovedEmitter,this.onBeforeEdgeRemoved]=S(),[this.beforeClearEmitter,this.onBeforeClear]=S()}hasNode(e){return this.nodes.has(e)}getNode(e){const t=this.nodes.get(e);if(t===void 0)throw new A("failed to access nonexistent node");return t}addNode(e){const t=new Map,o={element:e.element,payload:{x:e.x,y:e.y,centerFn:e.centerFn,priority:e.priority},ports:t};this.nodes.set(e.id,o),this.nodesElementsMap.set(e.element,e.id),this.afterNodeAddedEmitter.emit(e.id)}getAllNodeIds(){return Array.from(this.nodes.keys())}findNodeIdByElement(e){return this.nodesElementsMap.get(e)}updateNode(e,t){const{payload:o}=this.nodes.get(e);o.x=t.x??o.x,o.y=t.y??o.y,o.centerFn=t.centerFn??o.centerFn,t.priority!==void 0&&(o.priority=t.priority,this.afterNodePriorityUpdatedEmitter.emit(e)),this.afterNodeUpdatedEmitter.emit(e)}removeNode(e){this.beforeNodeRemovedEmitter.emit(e);const t=this.nodes.get(e);this.nodesElementsMap.delete(t.element),this.nodes.delete(e)}hasPort(e){return this.ports.has(e)}getPort(e){const t=this.ports.get(e);if(t===void 0)throw new A("failed to access nonexistent port");return t}addPort(e){this.ports.set(e.id,{element:e.element,payload:{direction:e.direction},nodeId:e.nodeId}),this.elementPorts.addRecord(e.element,e.id),this.portCycleEdges.set(e.id,new Set),this.portIncomingEdges.set(e.id,new Set),this.portOutcomingEdges.set(e.id,new Set),this.nodes.get(e.nodeId).ports.set(e.id,e.element),this.afterPortAddedEmitter.emit(e.id)}updatePort(e,t){const o=this.ports.get(e).payload;o.direction=t.direction??o.direction,this.afterPortUpdatedEmitter.emit(e)}getAllPortIds(){return Array.from(this.ports.keys())}findPortIdsByElement(e){return this.elementPorts.getMultiBySingle(e)}getNodePortIds(e){const t=this.nodes.get(e);if(t===void 0)throw new A("failed to access port ids of nonexistent node");return Array.from(t.ports.keys())}removePort(e){const t=this.ports.get(e).nodeId;this.beforePortRemovedEmitter.emit(e),this.nodes.get(t).ports.delete(e),this.ports.delete(e),this.elementPorts.removeByMulti(e)}hasEdge(e){return this.edges.has(e)}getEdge(e){const t=this.edges.get(e);if(t===void 0)throw new A("failed to access nonexistent edge");return t}addEdge(e){this.addEdgeInternal(e),this.afterEdgeAddedEmitter.emit(e.id)}updateEdge(e,t){if(t.from!==void 0\|\|t.to!==void 0){const s=this.edges.get(e),n=s.payload;this.removeEdgeInternal(e),this.addEdgeInternal({id:e,from:t.from??s.from,to:t.to??s.to,shape:n.shape,priority:n.priority})}const o=this.edges.get(e);t.shape!==void 0&&(o.payload.shape=t.shape,this.afterEdgeShapeUpdatedEmitter.emit(e)),t.priority!==void 0&&(o.payload.priority=t.priority,this.afterEdgePriorityUpdatedEmitter.emit(e)),this.afterEdgeUpdatedEmitter.emit(e)}getAllEdgeIds(){return Array.from(this.edges.keys())}removeEdge(e){this.beforeEdgeRemovedEmitter.emit(e),this.removeEdgeInternal(e)}clear(){this.beforeClearEmitter.emit(),this.portIncomingEdges.clear(),this.portOutcomingEdges.clear(),this.portCycleEdges.clear(),this.elementPorts.clear(),this.nodesElementsMap.clear(),this.edges.clear(),this.ports.clear(),this.nodes.clear()}getPortIncomingEdgeIds(e){const t=this.portIncomingEdges.get(e);if(t===void 0)throw new A("failed to access edges for nonexistent port");return Array.from(t)}getPortOutgoingEdgeIds(e){const t=this.portOutcomingEdges.get(e);if(t===void 0)throw new A("failed to access edges for nonexistent port");return Array.from(t)}getPortCycleEdgeIds(e){const t=this.portCycleEdges.get(e);if(t===void 0)throw new A("failed to access edges for nonexistent port");return Array.from(t)}getPortAdjacentEdgeIds(e){return[...this.getPortIncomingEdgeIds(e),...this.getPortOutgoingEdgeIds(e),...this.getPortCycleEdgeIds(e)]}getNodeIncomingEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),o=[];return t.forEach(s=>{this.getPortIncomingEdgeIds(s).filter(n=>{const a=this.getEdge(n);return this.getPort(a.from).nodeId!==e}).forEach(n=>{o.push(n)})}),o}getNodeOutgoingEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),o=[];return t.forEach(s=>{this.getPortOutgoingEdgeIds(s).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId!==e}).forEach(n=>{o.push(n)})}),o}getNodeCycleEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),o=[];return t.forEach(s=>{this.getPortCycleEdgeIds(s).forEach(n=>{o.push(n)}),this.getPortIncomingEdgeIds(s).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId===e}).forEach(n=>{o.push(n)})}),o}getNodeAdjacentEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),o=[];return t.forEach(s=>{this.getPortIncomingEdgeIds(s).forEach(n=>{o.push(n)}),this.getPortOutgoingEdgeIds(s).forEach(n=>{o.push(n)}),this.getPortCycleEdgeIds(s).forEach(n=>{o.push(n)})}),o}addEdgeInternal(e){this.edges.set(e.id,{from:e.from,to:e.to,payload:{shape:e.shape,priority:e.priority}}),e.from!==e.to?(this.portOutcomingEdges.get(e.from).add(e.id),this.portIncomingEdges.get(e.to).add(e.id)):this.portCycleEdges.get(e.from).add(e.id)}removeEdgeInternal(e){const t=this.edges.get(e),o=t.from,s=t.to;this.portCycleEdges.get(o).delete(e),this.portCycleEdges.get(s).delete(e),this.portIncomingEdges.get(o).delete(e),this.portIncomingEdges.get(s).delete(e),this.portOutcomingEdges.get(o).delete(e),this.portOutcomingEdges.get(s).delete(e),this.edges.delete(e)}}const ge=r=>({scale:1/r.scale,x:-r.x/r.scale,y:-r.y/r.scale}),ue={scale:1,x:0,y:0},pe=(r,e)=>({x:r.scalee.x+r.x,y:r.scalee.y+r.y});class tt{constructor(e){i(this,"viewportMatrix",ue);i(this,"contentMatrix",ue);i(this,"beforeUpdateEmitter");i(this,"onBeforeUpdated");i(this,"afterUpdateEmitter");i(this,"onAfterUpdated");i(this,"afterResizeEmitter");i(this,"onAfterResize");i(this,"observer",new ResizeObserver(()=>{this.afterResizeEmitter.emit()}));this.host=e,[this.afterUpdateEmitter,this.onAfterUpdated]=S(),[this.beforeUpdateEmitter,this.onBeforeUpdated]=S(),[this.afterResizeEmitter,this.onAfterResize]=S(),this.observer.observe(this.host)}getViewportMatrix(){return this.viewportMatrix}getContentMatrix(){return this.contentMatrix}patchViewportMatrix(e){this.viewportMatrix={scale:e.scale??this.viewportMatrix.scale,x:e.x??this.viewportMatrix.x,y:e.y??this.viewportMatrix.y},this.beforeUpdateEmitter.emit(),this.contentMatrix=ge(this.viewportMatrix),this.afterUpdateEmitter.emit()}patchContentMatrix(e){this.contentMatrix={scale:e.scale??this.contentMatrix.scale,x:e.x??this.contentMatrix.x,y:e.y??this.contentMatrix.y},this.beforeUpdateEmitter.emit(),this.viewportMatrix=ge(this.contentMatrix),this.afterUpdateEmitter.emit()}getDimensions(){const{width:e,height:t}=this.host.getBoundingClientRect();return{width:e,height:t}}createContentCoords(e){return pe(this.viewportMatrix,e)}createViewportCoords(e){return pe(this.contentMatrix,e)}destroy(){this.observer.disconnect()}}class q{constructor(e){i(this,"elementToNodeId",new Map);i(this,"nodesResizeObserver");i(this,"onAfterNodeAdded",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.set(t.element,e),this.nodesResizeObserver.observe(t.element)});i(this,"onBeforeNodeRemoved",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.delete(t.element),this.nodesResizeObserver.unobserve(t.element)});i(this,"onBeforeClear",()=>{this.nodesResizeObserver.disconnect(),this.elementToNodeId.clear()});this.canvas=e,this.nodesResizeObserver=new ResizeObserver(t=>{t.forEach(o=>{const s=o.target;this.handleNodeResize(s)})}),this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear)}static configure(e){new q(e)}handleNodeResize(e){const t=this.elementToNodeId.get(e);this.canvas.updateNode(t)}}const rt=(r,e,t)=>{const{x:o,y:s,width:n,height:a}=r.getBoundingClientRect();return e>=o&&e<=o+n&&t>=s&&t<=s+a},ot=(r,e,t)=>e>=0&&e<=r.innerWidth&&t>=0&&t<=r.innerHeight,V=(r,e,t,o)=>rt(e,t,o)&&ot(r,t,o),B=(r,e)=>{e!==null?r.style.cursor=e:r.style.removeProperty("cursor")},O=r=>{const e=document.createElement("div");return{id:r.overlayNodeId,element:e,x:r.portCoords.x,y:r.portCoords.y,ports:[{id:r.overlayNodeId,element:e,direction:r.portDirection}]}},st=(r,e)=>{let t=e;for(;t!==null;){const o=r.findPortIdsByElement(t)[0]??null;if(o!==null)return{status:"portFound",portId:o};if(r.findNodeIdByElement(t)!==void 0)return{status:"nodeEncountered"};t=t.parentElement}return{status:"notFound"}};functionwe(r,e){const t=r.elementsFromPoint(e.x,e.y);for(const o of t){if(o.shadowRoot!==null){const s=we(o.shadowRoot,e);for(const n of s)yield n}yield o}}const fe=(r,e)=>{const t=we(document,e);for(const o of t){const s=st(r,o);if(s.status==="portFound")return s.portId;if(s.status==="nodeEncountered")return null}return null};var T=(r=>(r.StaticNodeId="static",r.DraggingNodeId="dragging",r.EdgeId="edge",r))(T\|\|{});const ye=(r,e)=>({x:r/2,y:e/2}),p={x:0,y:0},m=(r,e,t)=>({x:e.xr.x-e.yr.y+((1-e.x)t.x+e.yt.y),y:e.yr.x+e.xr.y+((1-e.x)t.y-e.yt.x)}),me=(r,e)=>{const t={x:r.x+r.width/2,y:r.y+r.height/2},o={x:e.x+e.width/2,y:e.y+e.height/2},s=Math.min(t.x,o.x),n=Math.min(t.y,o.y),a=Math.abs(o.x-t.x),h=Math.abs(o.y-t.y),d=t.x<=o.x?1:-1,c=t.y<=o.y?1:-1;return{x:s,y:n,width:a,height:h,flipX:d,flipY:c}},W=(r,e,t,o)=>({x:er.x+(1-e)/2o.x,y:tr.y+(1-t)/2o.y});class it{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const o=m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p),s=m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to),n={x:o.x+this.params.sourceDirection.xthis.params.curvature,y:o.y+this.params.sourceDirection.ythis.params.curvature},a={x:s.x-this.params.targetDirection.xthis.params.curvature,y:s.y-this.params.targetDirection.ythis.params.curvature},h=`M ${o.x} ${o.y} C ${n.x} ${n.y}, ${a.x} ${a.y}, ${s.x} ${s.y}`,d=this.params.hasSourceArrow?"":`M ${p.x} ${p.y} L ${o.x} ${o.y} `,c=this.params.hasTargetArrow?"":` M ${s.x} ${s.y} L ${this.params.to.x} ${this.params.to.y}`;this.path=`${d}${h}${c}`}}class nt{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,o=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,s=this.params.arrowLength,n=Math.cos(this.params.detourDirection)this.params.detourDistance,a=Math.sin(this.params.detourDirection)this.params.detourDistance,h=nthis.params.flipX,d=athis.params.flipY,c=m({x:s,y:p.y},this.params.sourceDirection,p),g={x:c.x+h,y:c.y+d},l=m({x:this.params.to.x-s,y:this.params.to.y},this.params.targetDirection,this.params.to),u={x:l.x+h,y:l.y+d},w={x:(g.x+u.x)/2,y:(g.y+u.y)/2},f={x:c.x+this.params.curvaturethis.params.sourceDirection.x,y:c.y+this.params.curvaturethis.params.sourceDirection.y},b={x:l.x-this.params.curvaturethis.params.targetDirection.x,y:l.y-this.params.curvaturethis.params.targetDirection.y},P={x:c.x+h,y:c.y+d},C={x:l.x+h,y:l.y+d};this.path=[`M ${t.x} ${t.y}`,`L ${c.x} ${c.y}`,`C ${f.x} ${f.y} ${P.x} ${P.y} ${w.x} ${w.y}`,`C ${C.x} ${C.y} ${b.x} ${b.y} ${l.x} ${l.y}`,`L ${o.x} ${o.y}`].join(" "),this.midpoint=W(w,e.flipX,e.flipY,e.to)}}const K=Object.freeze({edgeColor:"--edge-color"}),ve=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","svg");return e.style.pointerEvents="none",e.style.position="absolute",e.style.top="0",e.style.left="0",e.style.overflow="visible",e.style.setProperty(K.edgeColor,r),e},Ee=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke",`var(${K.edgeColor})`),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e},z=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","path");return r.setAttribute("fill",`var(${K.edgeColor})`),r},Ae=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.transformOrigin="50% 50%",r},xe=(r,e)=>{r.style.transform=`translate(${e.x}px, ${e.y}px)`,r.style.width=`${Math.max(e.width,1)}px`,r.style.height=`${Math.max(e.height,1)}px`},M=(r,e)=>{const t=[];if(r.length>0&&t.push(`M ${r[0].x} ${r[0].y}`),r.length===2&&t.push(`L ${r[1].x} ${r[1].y}`),r.length>2){const o=r.length-1;let s=0,n=0,a=0;r.forEach((h,d)=>{let c=0,g=0,l=0;const u=d>0,w=d<o,f=u&&w;if(u&&(c=-s,g=-n,l=a),w){const $=r[d+1];s=$.x-h.x,n=$.y-h.y,a=Math.sqrt(ss+nn)}const P=a!==0?Math.min((f?e:0)/a,d<o-1?.5:1):0,C=f?{x:h.x+sP,y:h.y+nP}:h,N=l!==0?Math.min((f?e:0)/l,d>1?.5:1):0,I=f?{x:h.x+cN,y:h.y+gN}:h;d>0&&t.push(`L ${I.x} ${I.y}`),f&&t.push(`C ${h.x} ${h.y} ${h.x} ${h.y} ${C.x} ${C.y}`)})}return t.join(" ")};class at{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const o=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=m({x:a,y:p.y},this.params.sourceDirection,p),d=m({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.x+d.x)/2,n),g=this.params.to.y/2,l={x:this.params.flipX>0?c:-n,y:h.y},u={x:l.x,y:g},w={x:this.params.flipX>0?this.params.to.x-c:this.params.to.x+n,y:d.y},f={x:w.x,y:g};this.path=M([o,h,l,u,f,w,d,s],this.params.roundness)}}class ht{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,o=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,s=this.params.arrowLength+this.params.arrowOffset,n=m({x:s,y:p.y},this.params.sourceDirection,p),a=Math.cos(this.params.detourDirection)this.params.detourDistance,h=Math.sin(this.params.detourDirection)this.params.detourDistance,d=athis.params.flipX,c=hthis.params.flipY,g={x:n.x+d,y:n.y+c},l=m({x:this.params.to.x-s,y:this.params.to.y},this.params.targetDirection,this.params.to),u={x:l.x+d,y:l.y+c},w={x:(g.x+u.x)/2,y:(g.y+u.y)/2};this.midpoint=W(w,e.flipX,e.flipY,e.to),this.path=M([t,n,g,u,l,o],this.params.roundness)}}class dt{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const o=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=m({x:n,y:p.y},this.params.sourceDirection,p),h=m({x:this.params.to.x-n,y:this.params.to.y},this.params.targetDirection,this.params.to);this.path=M([o,a,h,s],this.params.roundness)}}class ct{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const o=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=m({x:a,y:p.y},this.params.sourceDirection,p),d=m({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.y+d.y)/2,n),g=this.params.to.x/2,l={x:h.x,y:this.params.flipY>0?c:-n},u={x:g,y:l.y},w={x:d.x,y:this.params.flipY>0?this.params.to.y-c:this.params.to.y+n},f={x:g,y:w.y};this.path=M([o,h,l,u,f,w,d,s],this.params.roundness)}}class Q{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.arrowOffset,o=this.params.side,s=this.params.arrowLength+t,n=s+2o,h=[{x:this.params.arrowLength,y:p.y},{x:s,y:p.y},{x:s,y:this.params.side},{x:n,y:this.params.side},{x:n,y:-this.params.side},{x:s,y:-this.params.side},{x:s,y:p.y},{x:this.params.arrowLength,y:p.y}].map(c=>m(c,this.params.sourceDirection,p)),d=`M ${p.x} ${p.y} L ${h[0].x} ${h[0].y} `;this.path=`${this.params.hasSourceArrow\|\|this.params.hasTargetArrow?"":d}${M(h,this.params.roundness)}`,this.midpoint={x:(h[3].x+h[4].x)/2,y:(h[3].y+h[4].y)/2}}}class lt{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.smallRadius,o=this.params.radius,s=t+o,n=to/s,a=Math.sqrt(ss-tt),h=at/s,d=a+o+this.params.arrowLength,c=this.params.arrowLength+h,l=[{x:this.params.arrowLength,y:p.y},{x:c,y:n},{x:c,y:-n},{x:d,y:0}].map(f=>m(f,this.params.sourceDirection,p)),u=[`M ${l[0].x} ${l[0].y}`,`A ${t} ${t} 0 0 1 ${l[1].x} ${l[1].y}`,`A ${o} ${o} 0 1 0 ${l[2].x} ${l[2].y}`,`A ${t} ${t} 0 0 1 ${l[0].x} ${l[0].y}`].join(" "),w=`M 0 0 L ${l[0].x} ${l[0].y} `;this.path=`${this.params.hasSourceArrow\|\|this.params.hasTargetArrow?"":w}${u}`,this.midpoint=l[3]}}class gt{constructor(e){i(this,"path");i(this,"midpoint");i(this,"diagonalDistance");this.params=e;const t=this.params.to;if(this.midpoint={x:t.x/2,y:t.y/2},this.diagonalDistance=Math.sqrt(this.params.to.xthis.params.to.x+this.params.to.ythis.params.to.y),Math.sqrt(this.params.to.xthis.params.to.x+this.params.to.ythis.params.to.y)===0){this.path="";return}const s=this.createDirectLinePoint({offset:this.params.sourceOffset,hasArrow:this.params.hasSourceArrow,flip:1,shift:p}),n=this.createDirectLinePoint({offset:this.params.targetOffset,hasArrow:this.params.hasTargetArrow,flip:-1,shift:this.params.to});this.path=`M ${s.x} ${s.y} L ${n.x} ${n.y}`}createDirectLinePoint(e){const t=e.hasArrow?this.params.arrowLength:0,o=e.offset+t,s=e.flipo/this.diagonalDistance;return{x:this.params.to.xs+e.shift.x,y:this.params.to.ys+e.shift.y}}}class ut{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,o=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,s=this.params.arrowLength+this.params.arrowOffset,n=m({x:s,y:p.y},this.params.sourceDirection,p),a=m({x:this.params.to.x-s,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.y/2,c=d+Math.abs(this.params.detourDistance),g=d+cthis.params.flipYh,l={x:(n.x+a.x)/2,y:g};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=M([t,n,{x:n.x,y:g},{x:a.x,y:g},a,o],this.params.roundness)}}class pt{constructor(e){i(this,"path");i(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,o=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,s=this.params.arrowLength+this.params.arrowOffset,n=m({x:s,y:p.y},this.params.sourceDirection,p),a=m({x:this.params.to.x-s,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.x/2,c=d+Math.abs(this.params.detourDistance),g=d+cthis.params.flipXh,l={x:g,y:(n.y+a.y)/2};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=M([t,n,{x:g,y:n.y},{x:g,y:a.y},a,o],this.params.roundness)}}const y=Object.freeze({color:"#777777",width:1,arrowLength:20,polygonArrowRadius:4,circleArrowRadius:8,wedgeArrowSmallRadius:20,wedgeArrowRadius:100,wedgeArrowAngle:Math.PI/12,arrowOffset:15,hasSourceArrow:!1,hasTargetArrow:!1,cycleRadius:30,cycleSquareSide:30,roundness:10,detourDistance:100,detourDirection:-Math.PI/2,detourDirectionVertical:0,smallCycleRadius:15,curvature:90,interactiveWidth:10,preOffset:0}),Se=(r,e,t)=>({x:eMath.cos(r),y:tMath.sin(r)});class k{constructor(e){i(this,"svg");i(this,"group",Ae());i(this,"line");i(this,"sourceArrow",null);i(this,"targetArrow",null);i(this,"onAfterRender");i(this,"afterRenderEmitter");i(this,"arrowRenderer");this.params=e,[this.afterRenderEmitter,this.onAfterRender]=S(),this.arrowRenderer=this.params.arrowRenderer,this.svg=ve(e.color),this.svg.appendChild(this.group),this.line=Ee(e.width),this.group.appendChild(this.line),e.hasSourceArrow&&(this.sourceArrow=z(),this.group.appendChild(this.sourceArrow)),e.hasTargetArrow&&(this.targetArrow=z(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:o,width:s,height:n,flipX:a,flipY:h}=me(e.from,e.to);xe(this.svg,{x:t,y:o,width:s,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d=Se(e.from.direction,a,h),c=Se(e.to.direction,a,h),g={x:s,y:n};let l={x:-c.x,y:-c.y},u;e.category===x.PortCycle?(u=this.params.createCyclePath,l=d):e.category===x.NodeCycle?u=this.params.createDetourPath:u=this.params.createLinePath;const w=u(d,c,g,a,h);this.line.setAttribute("d",w.path);let f=null;this.sourceArrow&&(f=this.arrowRenderer({direction:d,shift:p,arrowLength:this.params.arrowLength}),this.sourceArrow.setAttribute("d",f));let b=null;this.targetArrow&&(b=this.arrowRenderer({direction:l,shift:g,arrowLength:this.params.arrowLength}),this.targetArrow.setAttribute("d",b)),this.afterRenderEmitter.emit({edgePath:w,sourceArrowPath:f,targetArrowPath:b})}}const wt=r=>e=>{const o=[p,{x:e.arrowLength,y:r.radius},{x:e.arrowLength,y:-r.radius}].map(h=>m(h,e.direction,p)).map(h=>({x:h.x+e.shift.x,y:h.y+e.shift.y})),s=`M ${o[0].x} ${o[0].y}`,n=`L ${o[1].x} ${o[1].y}`,a=`L ${o[2].x} ${o[2].y}`;return`${s} ${n} ${a} Z`},ft=r=>e=>{const t=r.radius,o=e.arrowLength,s=(oo+2ot)/(2t),n=s+t,a=o+t-t(o+t)/n,h=ts/n,c=[p,{x:a,y:-h},{x:a,y:h}].map(f=>m(f,e.direction,p)).map(f=>({x:f.x+e.shift.x,y:f.y+e.shift.y})),g=`M ${c[0].x} ${c[0].y}`,l=`A ${s} ${s} 0 0 0 ${c[1].x} ${c[1].y}`,u=`A ${t} ${t} 0 0 0 ${c[2].x} ${c[2].y}`,w=`A ${s} ${s} 0 0 0 ${c[0].x} ${c[0].y}`;return`${g} ${l} ${u} ${w}`},yt=r=>e=>{const t=r.smallRadius,o=r.radius,s=m({x:e.arrowLength,y:0},{x:Math.cos(r.angle),y:Math.sin(r.angle)},{x:e.arrowLength+r.smallRadius,y:0}),a=[p,{x:s.x,y:-s.y},s].map(l=>m(l,e.direction,p)).map(l=>({x:l.x+e.shift.x,y:l.y+e.shift.y})),h=`M ${a[0].x} ${a[0].y}`,d=`A ${o} ${o} 0 0 1 ${a[1].x} ${a[1].y}`,c=`A ${t} ${t} 0 0 1 ${a[2].x} ${a[2].y}`,g=`A ${o} ${o} 0 0 1 ${a[0].x} ${a[0].y}`;return`${h} ${d} ${c} ${g}`},F=r=>{if(typeof r=="function")return r;switch(r.type){case"triangle":return wt({radius:r.radius??y.polygonArrowRadius});case"arc":return ft({radius:r.radius??y.circleArrowRadius});default:return yt({smallRadius:r.smallRadius??y.wedgeArrowSmallRadius,angle:r.angle??y.wedgeArrowAngle,radius:r.radius??y.wedgeArrowRadius})}};class be{constructor(e){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"onAfterRender");i(this,"arrowLength");i(this,"curvature");i(this,"portCycleRadius");i(this,"portCycleSmallRadius");i(this,"detourDirection");i(this,"detourDistance");i(this,"hasSourceArrow");i(this,"hasTargetArrow");i(this,"pathShape");i(this,"createCyclePath",e=>new lt({sourceDirection:e,radius:this.portCycleRadius,smallRadius:this.portCycleSmallRadius,arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s,n)=>new nt({to:o,sourceDirection:e,targetDirection:t,flipX:s,flipY:n,arrowLength:this.arrowLength,detourDirection:this.detourDirection,detourDistance:this.detourDistance,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o)=>new it({to:o,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??y.arrowLength,this.curvature=(e==null?void 0:e.curvature)??y.curvature,this.portCycleRadius=(e==null?void 0:e.cycleRadius)??y.cycleRadius,this.portCycleSmallRadius=(e==null?void 0:e.smallCycleRadius)??y.smallCycleRadius,this.detourDirection=(e==null?void 0:e.detourDirection)??y.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??y.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??y.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??y.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??y.color,width:(e==null?void 0:e.width)??y.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Pe{constructor(e){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"onAfterRender");i(this,"arrowLength");i(this,"arrowOffset");i(this,"roundness");i(this,"cycleSquareSide");i(this,"detourDistance");i(this,"hasSourceArrow");i(this,"hasTargetArrow");i(this,"pathShape");i(this,"createCyclePath",e=>new Q({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s,n)=>new ut({to:o,sourceDirection:e,targetDirection:t,flipX:s,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o,s)=>new at({to:o,sourceDirection:e,targetDirection:t,flipX:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??y.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??y.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??y.cycleSquareSide;const t=(e==null?void 0:e.roundness)??y.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??y.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??y.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??y.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??y.color,width:(e==null?void 0:e.width)??y.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Ce{constructor(e){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"onAfterRender");i(this,"arrowLength");i(this,"arrowOffset");i(this,"roundness");i(this,"cycleSquareSide");i(this,"detourDirection");i(this,"detourDistance");i(this,"hasSourceArrow");i(this,"hasTargetArrow");i(this,"pathShape");i(this,"createCyclePath",e=>new Q({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s,n)=>new ht({to:o,sourceDirection:e,targetDirection:t,flipX:s,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDirection:this.detourDirection,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o)=>new dt({to:o,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??y.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??y.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??y.cycleSquareSide;const t=(e==null?void 0:e.roundness)??y.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDirection=(e==null?void 0:e.detourDirection)??y.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??y.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??y.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??y.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??y.color,width:(e==null?void 0:e.width)??y.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Te{constructor(e){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"onAfterRender");i(this,"arrowLength");i(this,"arrowOffset");i(this,"roundness");i(this,"cycleSquareSide");i(this,"detourDistance");i(this,"hasSourceArrow");i(this,"hasTargetArrow");i(this,"pathShape");i(this,"createCyclePath",e=>new Q({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s,n)=>new pt({to:o,sourceDirection:e,targetDirection:t,flipX:s,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o,s,n)=>new ct({to:o,sourceDirection:e,targetDirection:t,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??y.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??y.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??y.cycleSquareSide;const t=(e==null?void 0:e.roundness)??y.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??y.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??y.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??y.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??y.color,width:(e==null?void 0:e.width)??y.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Z{constructor(e){i(this,"svg");i(this,"group",Ae());i(this,"line");i(this,"sourceArrow",null);i(this,"targetArrow",null);i(this,"color");i(this,"width");i(this,"arrowLength");i(this,"sourceOffset");i(this,"targetOffset");i(this,"onAfterRender");i(this,"afterRenderEmitter");i(this,"arrowRenderer");[this.afterRenderEmitter,this.onAfterRender]=S(),this.color=(e==null?void 0:e.color)??y.color,this.width=(e==null?void 0:e.width)??y.width,this.arrowLength=(e==null?void 0:e.arrowLength)??y.arrowLength,this.arrowRenderer=F((e==null?void 0:e.arrowRenderer)??{}),this.sourceOffset=(e==null?void 0:e.sourceOffset)??y.preOffset,this.targetOffset=(e==null?void 0:e.targetOffset)??y.preOffset,this.svg=ve(this.color),this.svg.appendChild(this.group),this.line=Ee(this.width),this.group.appendChild(this.line),e!=null&&e.hasSourceArrow&&(this.sourceArrow=z(),this.group.appendChild(this.sourceArrow)),e!=null&&e.hasTargetArrow&&(this.targetArrow=z(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:o,width:s,height:n,flipX:a,flipY:h}=me(e.from,e.to);xe(this.svg,{x:t,y:o,width:s,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d={x:s,y:n},c=new gt({to:d,sourceOffset:this.sourceOffset,targetOffset:this.targetOffset,hasSourceArrow:this.sourceArrow!==null,hasTargetArrow:this.targetArrow!==null,arrowLength:this.arrowLength});this.line.setAttribute("d",c.path);let g=null,l=null;const u=c.diagonalDistance;if(u===0)this.sourceArrow!==null&&(g="",this.sourceArrow.setAttribute("d",g)),this.targetArrow!==null&&(l="",this.targetArrow.setAttribute("d",l));else{const w={x:d.x/u,y:d.y/u};if(this.sourceArrow){const f={x:w.xthis.sourceOffset,y:w.ythis.sourceOffset};g=this.arrowRenderer({direction:w,shift:f,arrowLength:this.arrowLength}),this.sourceArrow.setAttribute("d",g)}if(this.targetArrow){const f={x:w.xthis.targetOffset,y:w.ythis.targetOffset};l=this.arrowRenderer({direction:{x:-w.x,y:-w.y},shift:{x:d.x-f.x,y:d.y-f.y},arrowLength:this.arrowLength}),this.targetArrow.setAttribute("d",l)}}this.afterRenderEmitter.emit({edgePath:c,sourceArrowPath:g,targetArrowPath:l})}}const mt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.pointerEvents="auto",r.style.cursor="pointer",r},vt=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke","transparent"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e.setAttribute("stroke-linecap","round"),e},Ne=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke-linejoin","round"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","transparent"),e.setAttribute("stroke","transparent"),e};class De extends Error{constructor(e){super(e),this.name="InteractiveEdgeError"}}class J{constructor(e,t){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"handle",mt());i(this,"onAfterRender");i(this,"interactiveLine");i(this,"interactiveSourceArrow",null);i(this,"interactiveTargetArrow",null);if(this.baseEdge=e,e instanceof J)throw new De("interactive edge can be configured only once");this.svg=this.baseEdge.svg,this.group=this.baseEdge.group,this.line=this.baseEdge.line,this.sourceArrow=this.baseEdge.sourceArrow,this.targetArrow=this.baseEdge.targetArrow,this.onAfterRender=this.baseEdge.onAfterRender;const o=(t==null?void 0:t.distance)??y.interactiveWidth;this.interactiveLine=vt(o),this.handle.appendChild(this.interactiveLine),this.sourceArrow&&(this.interactiveSourceArrow=Ne(o),this.handle.appendChild(this.interactiveSourceArrow)),this.targetArrow&&(this.interactiveTargetArrow=Ne(o),this.handle.appendChild(this.interactiveTargetArrow)),this.group.appendChild(this.handle),this.baseEdge.onAfterRender.subscribe(s=>{this.interactiveLine.setAttribute("d",s.edgePath.path),this.interactiveSourceArrow&&this.interactiveSourceArrow.setAttribute("d",s.sourceArrowPath),this.interactiveTargetArrow&&this.interactiveTargetArrow.setAttribute("d",s.targetArrowPath)})}render(e){this.baseEdge.render(e)}}class Et{constructor(e,t){i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"onAfterRender");i(this,"svg");this.baseShape=e,this.midpointElement=t,this.svg=this.baseShape.svg,this.group=this.baseShape.group,this.line=this.baseShape.line,this.sourceArrow=this.baseShape.sourceArrow,this.targetArrow=this.baseShape.targetArrow,this.onAfterRender=this.baseShape.onAfterRender,this.svg.append(this.midpointElement),this.baseShape.onAfterRender.subscribe(o=>{const s=o.edgePath.midpoint,n=`translate(${s.x}px, ${s.y}px)`;this.midpointElement.style.setProperty("transform",n)})}render(e){this.baseShape.render(e)}}class Me{constructor(e){i(this,"onAfterNodeAdded");i(this,"onAfterNodeUpdated");i(this,"onAfterNodePriorityUpdated");i(this,"onBeforeNodeRemoved");i(this,"onAfterPortMarked");i(this,"onAfterPortUpdated");i(this,"onBeforePortUnmarked");i(this,"onAfterEdgeAdded");i(this,"onAfterEdgeShapeUpdated");i(this,"onAfterEdgeUpdated");i(this,"onAfterEdgePriorityUpdated");i(this,"onBeforeEdgeRemoved");i(this,"onBeforeClear");this.graphStore=e,this.onAfterNodeAdded=this.graphStore.onAfterNodeAdded,this.onAfterNodeUpdated=this.graphStore.onAfterNodeUpdated,this.onAfterNodePriorityUpdated=this.graphStore.onAfterNodePriorityUpdated,this.onBeforeNodeRemoved=this.graphStore.onBeforeNodeRemoved,this.onAfterPortMarked=this.graphStore.onAfterPortAdded,this.onAfterPortUpdated=this.graphStore.onAfterPortUpdated,this.onBeforePortUnmarked=this.graphStore.onBeforePortRemoved,this.onAfterEdgeAdded=this.graphStore.onAfterEdgeAdded,this.onAfterEdgeShapeUpdated=this.graphStore.onAfterEdgeShapeUpdated,this.onAfterEdgeUpdated=this.graphStore.onAfterEdgeUpdated,this.onAfterEdgePriorityUpdated=this.graphStore.onAfterEdgePriorityUpdated,this.onBeforeEdgeRemoved=this.graphStore.onBeforeEdgeRemoved,this.onBeforeClear=this.graphStore.onBeforeClear}hasNode(e){return this.graphStore.hasNode(e)}getNode(e){const t=this.graphStore.getNode(e),{payload:o}=t;return{element:t.element,x:o.x,y:o.y,centerFn:o.centerFn,priority:o.priority}}findNodeIdByElement(e){return this.graphStore.findNodeIdByElement(e)}getAllNodeIds(){return this.graphStore.getAllNodeIds()}hasPort(e){return this.graphStore.hasPort(e)}getPort(e){const t=this.graphStore.getPort(e);return{element:t.element,direction:t.payload.direction,nodeId:t.nodeId}}getAllPortIds(){return this.graphStore.getAllPortIds()}getNodePortIds(e){return this.graphStore.getNodePortIds(e)}findPortIdsByElement(e){return this.graphStore.findPortIdsByElement(e)}getAllEdgeIds(){return this.graphStore.getAllEdgeIds()}hasEdge(e){return this.graphStore.hasEdge(e)}getEdge(e){const t=this.graphStore.getEdge(e),{payload:o}=t;return{from:t.from,to:t.to,priority:o.priority,shape:o.shape}}getPortIncomingEdgeIds(e){return this.graphStore.getPortIncomingEdgeIds(e)}getPortOutgoingEdgeIds(e){return this.graphStore.getPortOutgoingEdgeIds(e)}getPortCycleEdgeIds(e){return this.graphStore.getPortCycleEdgeIds(e)}getPortAdjacentEdgeIds(e){return this.graphStore.getPortAdjacentEdgeIds(e)}getNodeIncomingEdgeIds(e){return this.graphStore.getNodeIncomingEdgeIds(e)}getNodeOutgoingEdgeIds(e){return this.graphStore.getNodeOutgoingEdgeIds(e)}getNodeCycleEdgeIds(e){return this.graphStore.getNodeCycleEdgeIds(e)}getNodeAdjacentEdgeIds(e){return this.graphStore.getNodeAdjacentEdgeIds(e)}}class Le{constructor(e){i(this,"onBeforeUpdated");i(this,"onAfterUpdated");i(this,"onAfterResize");this.viewportStore=e,this.onBeforeUpdated=this.viewportStore.onBeforeUpdated,this.onAfterUpdated=this.viewportStore.onAfterUpdated,this.onAfterResize=this.viewportStore.onAfterResize}getViewportMatrix(){return{...this.viewportStore.getViewportMatrix()}}getContentMatrix(){return{...this.viewportStore.getContentMatrix()}}getDimensions(){return this.viewportStore.getDimensions()}createContentCoords(e){return this.viewportStore.createContentCoords(e)}createViewportCoords(e){return this.viewportStore.createViewportCoords(e)}}const Re=(r,e)=>{const t=new le,o=new Me(t),s=new Le(e),n=new de(t,e,r),a={nodes:{centerFn:ye,priorityFn:()=>0},edges:{shapeFactory:()=>new Z,priorityFn:()=>0},ports:{direction:0}};return new ce(o,s,t,e,n,a)};class H{constructor(e,t,o,s){i(this,"onAfterPortMarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.findPortIdsByElement(t.element).length===1&&this.hookPortEvents(t.element)});i(this,"onBeforePortUnmarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.findPortIdsByElement(t.element).length===1&&this.unhookPortEvents(t.element)});i(this,"onPortMouseDown",e=>{const t=e;if(!this.params.mouseDownEventVerifier(t))return;const o=e.currentTarget,s=this.canvas.graph.findPortIdsByElement(o)[0];this.params.onPortPointerDown(s,{x:t.clientX,y:t.clientY})&&(e.stopPropagation(),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}))});i(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.stopMouseDrag();return}this.params.onPointerMove({x:e.clientX,y:e.clientY})});i(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&(this.params.onPointerUp({x:e.clientX,y:e.clientY}),this.stopMouseDrag())});i(this,"onPortTouchStart",e=>{const t=e;if(t.touches.length!==1)return;const o=t.touches[0],s=e.currentTarget,n=this.canvas.graph.findPortIdsByElement(s)[0];this.params.onPortPointerDown(n,{x:o.clientX,y:o.clientY})&&(e.stopPropagation(),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}))});i(this,"onWindowTouchMove",e=>{const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.stopTouchDrag();return}this.params.onPointerMove({x:t.clientX,y:t.clientY})});i(this,"onWindowTouchFinish",e=>{const t=e.changedTouches[0];this.params.onPointerUp({x:t.clientX,y:t.clientY}),this.stopTouchDrag()});i(this,"onBeforeClear",()=>{this.canvas.graph.getAllPortIds().forEach(e=>{const t=this.canvas.graph.getPort(e);this.unhookPortEvents(t.element)})});i(this,"onBeforeDestroy",()=>{this.params.onStopDrag(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.element=t,this.window=o,this.params=s,this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked),this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,o,s){new H(e,t,o,s)}hookPortEvents(e){e.addEventListener("mousedown",this.onPortMouseDown,{passive:!0}),e.addEventListener("touchstart",this.onPortTouchStart,{passive:!0})}unhookPortEvents(e){e.removeEventListener("mousedown",this.onPortMouseDown),e.removeEventListener("touchstart",this.onPortTouchStart)}stopMouseDrag(){this.params.onStopDrag(),this.removeWindowMouseListeners()}stopTouchDrag(){this.params.onStopDrag(),this.removeWindowTouchListeners()}removeWindowMouseListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}removeWindowTouchListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}}class _{constructor(e,t,o,s){i(this,"grabbedNode",null);i(this,"maxNodePriority",0);i(this,"graph");i(this,"onAfterNodeAdded",e=>{this.updateMaxNodePriority(e);const{element:t}=this.graph.getNode(e);t.addEventListener("mousedown",this.onMouseDown,{passive:!0}),t.addEventListener("touchstart",this.onTouchStart,{passive:!0})});i(this,"onAfterNodeUpdated",e=>{this.updateMaxNodePriority(e)});i(this,"onBeforeNodeRemoved",e=>{const{element:t}=this.graph.getNode(e);t.removeEventListener("mousedown",this.onMouseDown),t.removeEventListener("touchstart",this.onTouchStart)});i(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});i(this,"onBeforeClear",()=>{this.canvas.graph.getAllNodeIds().forEach(e=>{const{element:t}=this.canvas.graph.getNode(e);t.removeEventListener("mousedown",this.onMouseDown),t.removeEventListener("touchstart",this.onTouchStart)}),this.maxNodePriority=0});i(this,"onMouseDown",e=>{const t=e;if(!this.params.mouseDownEventVerifier(t))return;const o=e.currentTarget,s=this.graph.findNodeIdByElement(o),n=this.graph.getNode(s);if(!this.params.nodeDragVerifier(s))return;this.params.onNodeDragStarted(s),e.stopPropagation();const h=this.calculateContentPoint({x:t.clientX,y:t.clientY});this.grabbedNode={nodeId:s,dx:h.x-n.x,dy:h.y-n.y},B(this.element,this.params.dragCursor),this.moveNodeOnTop(s),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0})});i(this,"onTouchStart",e=>{const t=e;if(t.touches.length!==1)return;e.stopPropagation();const o=t.touches[0],s=e.currentTarget,n=this.canvas.graph.findNodeIdByElement(s),a=this.graph.getNode(n);if(!this.params.nodeDragVerifier({nodeId:n,element:a.element,x:a.x,y:a.y}))return;const d=this.calculateContentPoint({x:o.clientX,y:o.clientY});this.grabbedNode={nodeId:n,dx:d.x-a.x,dy:d.y-a.y},this.moveNodeOnTop(n),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0})});i(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.cancelMouseDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:e.clientX,y:e.clientY})});i(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.cancelMouseDrag()});i(this,"onWindowTouchMove",e=>{if(e.touches.length!==1)return;const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.cancelTouchDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:t.clientX,y:t.clientY})});i(this,"onWindowTouchFinish",()=>{this.cancelTouchDrag()});this.canvas=e,this.element=t,this.window=o,this.params=s,this.graph=e.graph,this.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graph.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,o,s){new _(e,t,o,s)}moveNode(e,t){if(!this.graph.hasNode(e.nodeId))return;const o=this.calculateContentPoint(t),s={x:o.x-e.dx,y:o.y-e.dy},n=this.adjustNodeCoords(s);this.canvas.updateNode(e.nodeId,{x:n.x,y:n.y}),this.params.onNodeDrag(e.nodeId)}moveNodeOnTop(e){if(this.params.moveOnTop){if(this.maxNodePriority++,this.params.moveEdgesOnTop){const t=this.maxNodePriority;this.maxNodePriority++,this.graph.getNodeAdjacentEdgeIds(e).forEach(s=>{this.canvas.updateEdge(s,{priority:t})})}this.canvas.updateNode(e,{priority:this.maxNodePriority})}}cancelMouseDrag(){this.grabbedNode!==null&&this.graph.hasNode(this.grabbedNode.nodeId)&&this.params.onNodeDragFinished(this.grabbedNode.nodeId),this.grabbedNode=null,B(this.element,null),this.removeMouseDragListeners()}removeMouseDragListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}cancelTouchDrag(){if(this.grabbedNode!==null&&this.graph.hasNode(this.grabbedNode.nodeId)){const e=this.graph.getNode(this.grabbedNode.nodeId);this.params.onNodeDragFinished({nodeId:this.grabbedNode.nodeId,element:e.element,x:e.x,y:e.y})}this.grabbedNode=null,this.removeTouchDragListeners()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}updateMaxNodePriority(e){const t=this.graph.getNode(e).priority;this.maxNodePriority=Math.max(this.maxNodePriority,t)}calculateContentPoint(e){const t=this.element.getBoundingClientRect();return this.canvas.viewport.createContentCoords({x:e.x-t.x,y:e.y-t.y})}adjustNodeCoords(e){const t=this.params.gridSize;if(t!==null){const o=t/2;return{x:Math.floor((e.x+o)/t)t,y:Math.floor((e.y+o)/t)t}}return e}}const At=(r,e,t)=>({scale:r.scale,x:r.x+r.scalee,y:r.y+r.scalet}),xt=(r,e,t,o)=>({scale:r.scalee,x:r.scale(1-e)t+r.x,y:r.scale(1-e)o+r.y}),X=r=>{const e=[],t=r.touches.length;for(let h=0;h<t;h++)e.push([r.touches[h].clientX,r.touches[h].clientY]);const o=e.reduce((h,d)=>[h[0]+d[0],h[1]+d[1]],[0,0]),s=[o[0]/t,o[1]/t],a=e.map(h=>[h[0]-s[0],h[1]-s[1]]).reduce((h,d)=>h+Math.sqrt(d[0]d[0]+d[1]d[1]),0);return{x:s[0],y:s[1],scale:a/t,touchesCnt:t,touches:e}};class Y{constructor(e,t,o,s){i(this,"viewport");i(this,"prevTouches",null);i(this,"wheelFinishTimer",null);i(this,"transformInProgress",!1);i(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});i(this,"onMouseDown",e=>{this.element===null\|\|!this.params.mouseDownEventVerifier(e)\|\|(B(this.element,this.params.shiftCursor),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}),this.startRegisteredTransform())});i(this,"onWindowMouseMove",e=>{const t=V(this.window,this.element,e.clientX,e.clientY);if(this.element===null\|\|!t){this.stopMouseDrag();return}const o=-e.movementX,s=-e.movementY;this.moveViewport(o,s)});i(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.stopMouseDrag()});i(this,"onWheelScroll",e=>{if(!this.params.mouseWheelEventVerifier(e))return;const{left:t,top:o}=this.element.getBoundingClientRect(),s=e.clientX-t,n=e.clientY-o,h=1/(e.deltaY<0?this.params.wheelSensitivity:1/this.params.wheelSensitivity);this.wheelFinishTimer===null&&this.params.onTransformStarted(),this.scaleViewport(h,s,n),this.wheelFinishTimer!==null&&clearTimeout(this.wheelFinishTimer),this.wheelFinishTimer=setTimeout(()=>{this.transformInProgress\|\|this.params.onTransformFinished(),this.wheelFinishTimer=null},this.params.scaleWheelFinishTimeout)});i(this,"onTouchStart",e=>{if(this.prevTouches!==null){this.prevTouches=X(e);return}this.prevTouches=X(e),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}),this.startRegisteredTransform()});i(this,"onWindowTouchMove",e=>{const t=X(e);if(!t.touches.every(s=>V(this.window,this.element,s[0],s[1]))){this.stopTouchDrag();return}if((t.touchesCnt===1\|\|t.touchesCnt===2)&&this.moveViewport(-(t.x-this.prevTouches.x),-(t.y-this.prevTouches.y)),t.touchesCnt===2){const{left:s,top:n}=this.element.getBoundingClientRect(),a=this.prevTouches.x-s,h=this.prevTouches.y-n,c=1/(t.scale/this.prevTouches.scale);this.scaleViewport(c,a,h)}this.prevTouches=t});i(this,"onWindowTouchFinish",e=>{e.touches.length>0?this.prevTouches=X(e):this.stopTouchDrag()});i(this,"preventWheelScaleListener",e=>{e.preventDefault()});this.canvas=e,this.element=t,this.window=o,this.params=s,this.element.addEventListener("wheel",this.preventWheelScaleListener,{passive:!1}),this.viewport=e.viewport,this.handleResize(),this.viewport.onAfterResize.subscribe(()=>{this.handleResize()}),this.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),this.element.addEventListener("wheel",this.onWheelScroll,{passive:!0}),this.element.addEventListener("touchstart",this.onTouchStart,{passive:!0}),e.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,o,s){new Y(e,t,o,s)}moveViewport(e,t){const o=this.viewport.getViewportMatrix(),s=At(o,e,t),{width:n,height:a}=this.viewport.getDimensions(),h=this.params.transformPreprocessor({prevTransform:o,nextTransform:s,canvasWidth:n,canvasHeight:a});this.performTransform(h)}scaleViewport(e,t,o){const s=this.canvas.viewport.getViewportMatrix(),n=xt(s,e,t,o),{width:a,height:h}=this.viewport.getDimensions(),d=this.params.transformPreprocessor({prevTransform:s,nextTransform:n,canvasWidth:a,canvasHeight:h});this.performTransform(d)}stopMouseDrag(){B(this.element,null),this.removeMouseDragListeners(),this.finishRegisteredTransform()}removeMouseDragListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}stopTouchDrag(){this.prevTouches=null,this.removeTouchDragListeners(),this.finishRegisteredTransform()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}performTransform(e){this.params.onBeforeTransformChange(),this.canvas.patchViewportMatrix(e),this.params.onTransformChange()}startRegisteredTransform(){this.transformInProgress=!0,this.params.onTransformStarted()}finishRegisteredTransform(){this.transformInProgress=!1,this.params.onTransformFinished()}handleResize(){const e=this.viewport.getViewportMatrix(),{width:t,height:o}=this.viewport.getDimensions(),s=this.params.transformPreprocessor({prevTransform:e,nextTransform:e,canvasWidth:t,canvasHeight:o});this.params.onResizeTransformStarted(),this.canvas.patchViewportMatrix(s),this.params.onResizeTransformFinished()}}class ee{constructor(e,t,o,s,n,a){i(this,"nodeHorizontal");i(this,"nodeVertical");i(this,"viewport");i(this,"currentScale");i(this,"loadedArea",{xFrom:1/0,xTo:1/0,yFrom:1/0,yTo:1/0});i(this,"updateLoadedArea",e=>{this.loadedArea={xFrom:e.x,xTo:e.x+e.width,yFrom:e.y,yTo:e.y+e.height}});i(this,"onAfterViewportUpdated",()=>{this.userTransformInProgress\|\|this.loadAreaAroundViewport()});i(this,"userTransformInProgress",!1);this.canvas=e,this.element=t,this.window=o,this.trigger=n,this.params=a,this.nodeHorizontal=this.params.nodeVerticalRadius,this.nodeVertical=this.params.nodeHorizontalRadius,this.viewport=e.viewport,this.currentScale=this.viewport.getViewportMatrix().scale,this.scheduleLoadAreaAroundViewport(),this.viewport.onAfterResize.subscribe(()=>{this.scheduleLoadAreaAroundViewport()});const h={...s,onResizeTransformStarted:()=>{this.userTransformInProgress=!0,s.onResizeTransformStarted()},onResizeTransformFinished:()=>{this.userTransformInProgress=!1,s.onResizeTransformFinished()},onBeforeTransformChange:()=>{this.userTransformInProgress=!0,s.onBeforeTransformChange()},onTransformChange:()=>{this.userTransformInProgress=!1;const d=this.currentScale;this.currentScale=this.viewport.getViewportMatrix().scale,d!==this.currentScale&&this.scheduleEnsureViewportAreaLoaded(),s.onTransformChange()},onTransformFinished:()=>{this.scheduleLoadAreaAroundViewport(),s.onTransformFinished()}};Y.configure(e,this.element,this.window,h),this.trigger.subscribe(this.updateLoadedArea),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated)}static configure(e,t,o,s,n,a){new ee(e,t,o,s,n,a)}scheduleLoadAreaAroundViewport(){setTimeout(()=>{this.loadAreaAroundViewport()})}scheduleEnsureViewportAreaLoaded(){setTimeout(()=>{const{width:e,height:t}=this.viewport.getDimensions(),{scale:o,x:s,y:n}=this.viewport.getViewportMatrix(),a=eo,h=to,d=s-this.nodeHorizontal,c=n-this.nodeVertical,g=s+a+this.nodeHorizontal,l=n+h+this.nodeVertical;this.loadedArea.xFrom<d&&this.loadedArea.xTo>g&&this.loadedArea.yFrom<c&&this.loadedArea.yTo>l\|\|this.loadAreaAroundViewport()})}loadAreaAroundViewport(){const{width:e,height:t}=this.viewport.getDimensions(),{scale:o,x:s,y:n}=this.viewport.getViewportMatrix(),a=eo,h=to,d=s-a-this.nodeHorizontal,c=n-h-this.nodeVertical,g=3a+2this.nodeHorizontal,l=3h+2this.nodeVertical;this.trigger.emit({x:d,y:c,width:g,height:l})}}const St=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","svg");return r.style.position="absolute",r.style.inset="0",r},bt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","rect");return r.setAttribute("fill","url(#pattern)"),r},Pt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","pattern");return r.setAttribute("id","pattern"),r};class te{constructor(e,t,o){i(this,"svg",St());i(this,"patternRenderingRectangle",bt());i(this,"pattern",Pt());i(this,"patternContent");i(this,"tileWidth");i(this,"tileHeight");i(this,"halfTileWidth");i(this,"halfTileHeight");i(this,"maxViewportScale");i(this,"visible",!1);i(this,"onAfterTransformUpdated",()=>{const e=this.canvas.viewport.getContentMatrix(),t=e.x-this.halfTileWidthe.scale,o=e.y-this.halfTileHeighte.scale,s=`matrix(${e.scale}, 0, 0, ${e.scale}, ${t}, ${o})`;this.pattern.setAttribute("patternTransform",s),this.updateVisibility()});this.canvas=e,this.backgroundHost=o,this.tileWidth=t.tileWidth,this.tileHeight=t.tileHeight,this.halfTileWidth=this.tileWidth/2,this.halfTileHeight=this.tileHeight/2,this.patternContent=t.renderer,this.maxViewportScale=t.maxViewportScale;const s=`translate(${this.halfTileWidth}, ${this.halfTileHeight})`;this.patternContent.setAttribute("transform",s),this.pattern.appendChild(this.patternContent);const n=document.createElementNS("http://www.w3.org/2000/svg","defs");n.appendChild(this.pattern),this.svg.appendChild(n),this.svg.appendChild(this.patternRenderingRectangle),this.updateDimensions(),this.canvas.viewport.onAfterResize.subscribe(()=>{this.updateDimensions()}),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterTransformUpdated),this.onAfterTransformUpdated()}static configure(e,t,o){new te(e,t,o)}updateVisibility(){const t=this.canvas.viewport.getViewportMatrix().scale>this.maxViewportScale;t&&this.visible?(this.visible=!1,this.backgroundHost.removeChild(this.svg)):!t&&!this.visible&&(this.visible=!0,this.backgroundHost.appendChild(this.svg))}updateDimensions(){const{width:e,height:t}=this.canvas.viewport.getDimensions();this.svg.setAttribute("width",`${e}`),this.svg.setAttribute("height",`${t}`),this.patternRenderingRectangle.setAttribute("width",`${e}`),this.patternRenderingRectangle.setAttribute("height",`${t}`);const o=this.tileWidth/e,s=this.tileHeight/t;this.pattern.setAttribute("width",`${o}`),this.pattern.setAttribute("height",`${s}`)}}class re{constructor(e,t,o,s,n){i(this,"overlayCanvas");i(this,"staticPortId",null);i(this,"isTargetDragging",!0);i(this,"onEdgeCreated",e=>{this.params.onAfterEdgeCreated(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=o,this.window=s,this.params=n,this.overlayCanvas=Re(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>{const d=this.params.connectionTypeResolver(a);return d===null?!1:(this.grabPort(a,h,d),!0)},onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,o,s,n){new re(e,t,o,s,n)}grabPort(e,t,o){const s=this.canvas.graph.getPort(e);this.staticPortId=e;const n=s.element.getBoundingClientRect(),a=n.x+n.width/2,h=n.y+n.height/2,d=this.overlayLayer.getBoundingClientRect(),c=this.canvas.viewport.createContentCoords({x:a-d.x,y:h-d.y}),g=this.canvas.viewport.createContentCoords({x:t.x-d.x,y:t.y-d.y}),l={overlayNodeId:T.StaticNodeId,portCoords:c,portDirection:s.direction},u={overlayNodeId:T.DraggingNodeId,portCoords:g,portDirection:this.params.dragPortDirection};this.isTargetDragging=o==="direct";const[w,f]=this.isTargetDragging?[l,u]:[u,l];this.overlayCanvas.addNode(O(w)),this.overlayCanvas.addNode(O(f)),this.overlayCanvas.addEdge({from:w.overlayNodeId,to:f.overlayNodeId,shape:this.params.edgeShapeFactory(T.EdgeId)})}resetDragState(){this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}tryCreateConnection(e){const t=fe(this.canvas.graph,e),o=this.staticPortId;if(t===null){this.params.onEdgeCreationInterrupted({staticPortId:o,isDirect:this.isTargetDragging});return}const s=this.isTargetDragging?o:t,n=this.isTargetDragging?t:o,a={from:s,to:n},h=this.params.connectionPreprocessor(a);h!==null?(this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeCreated),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeCreated)):this.params.onEdgeCreationPrevented(a)}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),o=this.canvas.viewport.createContentCoords({x:e.x-t.x,y:e.y-t.y});this.overlayCanvas.updateNode(T.DraggingNodeId,{x:o.x,y:o.y})}}class oe{constructor(e,t,o,s,n){i(this,"overlayCanvas");i(this,"staticPortId",null);i(this,"isTargetDragging",!0);i(this,"draggingEdgePayload",null);i(this,"onEdgeReattached",e=>{this.params.onAfterEdgeReattached(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=o,this.window=s,this.params=n,this.overlayCanvas=Re(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>this.tryStartEdgeDragging(a,h),onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,o,s,n){new oe(e,t,o,s,n)}tryStartEdgeDragging(e,t){const o=this.params.draggingEdgeResolver(e);if(o===null\|\|!this.canvas.graph.hasEdge(o))return!1;const s=this.canvas.graph.getEdge(o),n=e===s.from,a=e===s.to,h=n?s.to:s.from;this.staticPortId=h,this.isTargetDragging=a;const d=this.canvas.graph.getPort(e),c=this.canvas.graph.getPort(h),g=c.element.getBoundingClientRect(),l={x:g.x+g.width/2,y:g.y+g.height/2},u=this.overlayLayer.getBoundingClientRect(),w=this.canvas.viewport.createContentCoords({x:l.x-u.x,y:l.y-u.y}),f=this.canvas.viewport.createContentCoords({x:t.x-u.x,y:t.y-u.y});this.draggingEdgePayload={id:o,from:s.from,to:s.to,shape:s.shape,priority:s.priority},this.canvas.removeEdge(o);const b={overlayNodeId:T.StaticNodeId,portCoords:w,portDirection:c.direction},P={overlayNodeId:T.DraggingNodeId,portCoords:f,portDirection:d.direction},[C,D]=this.isTargetDragging?[b,P]:[P,b];this.overlayCanvas.addNode(O(C)),this.overlayCanvas.addNode(O(D));const N=this.params.draggingEdgeShapeFactory!==null?this.params.draggingEdgeShapeFactory(T.EdgeId):s.shape;return this.overlayCanvas.addEdge({id:T.EdgeId,from:C.overlayNodeId,to:D.overlayNodeId,shape:N}),!0}resetDragState(){this.draggingEdgePayload=null,this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),o={x:e.x-t.x,y:e.y-t.y},s=this.canvas.viewport.createContentCoords(o);this.overlayCanvas.updateNode(T.DraggingNodeId,{x:s.x,y:s.y})}tryCreateConnection(e){const t=fe(this.canvas.graph,e);if(this.overlayCanvas.removeEdge(T.EdgeId),t===null){const d=this.draggingEdgePayload;this.params.onEdgeReattachInterrupted({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority});return}const[o,s]=this.isTargetDragging?[this.staticPortId,t]:[t,this.staticPortId],n=this.draggingEdgePayload,a={id:n.id,from:o,to:s,shape:n.shape,priority:n.priority},h=this.params.connectionPreprocessor(a);if(h!==null)this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeReattached),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeReattached);else{const d=this.draggingEdgePayload;this.params.onEdgeReattachPrevented({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority})}}}class se{constructor(e,t,o){this.canvas=e,this.layoutAlgorithm=t,this.trigger=o,this.trigger.subscribe(()=>{this.applyLayout()})}static configure(e,t,o){new se(e,t,o)}applyLayout(){this.layoutAlgorithm.calculateCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport}).forEach((t,o)=>{this.canvas.updateNode(o,t)})}}class G{constructor(e,t,o){i(this,"applyScheduled",!1);i(this,"apply",()=>{this.applyScheduled=!1,this.layoutAlgorithm.calculateCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport}).forEach((t,o)=>{this.canvas.updateNode(o,t)})});this.canvas=e,this.layoutAlgorithm=t,this.defererFn=o,this.canvas.graph.onAfterNodeAdded.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onBeforeNodeRemoved.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onAfterEdgeAdded.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onBeforeEdgeRemoved.subscribe(()=>{this.scheduleApply()})}static configure(e,t,o){new G(e,t,o)}scheduleApply(){this.applyScheduled\|\|(this.applyScheduled=!0,this.defererFn(this.apply))}}class Ct{static configure(e,t){const o=t.applyOn;switch(o.type){case"manual":{se.configure(e,t.algorithm,o.trigger);break}case"topologyChangeMacrotask":{G.configure(e,t.algorithm,s=>{setTimeout(()=>{s()})});break}case"topologyChangeMicrotask":{G.configure(e,t.algorithm,s=>{queueMicrotask(()=>{s()})});break}}}}class Tt{constructor(e,t){i(this,"previousTimeStamp");i(this,"step",e=>{if(this.previousTimeStamp===void 0)this.previousTimeStamp=e;else{const t=(e-this.previousTimeStamp)/1e3;this.previousTimeStamp=e,this.callback(t)}this.win.requestAnimationFrame(this.step)});this.win=e,this.callback=t,this.win.requestAnimationFrame(this.step)}}class ie{constructor(e,t,o,s){i(this,"step",e=>{this.algorithm.calculateNextCoordinates({graph:this.canvas.graph,dt:e,viewport:this.canvas.viewport}).forEach((o,s)=>{this.staticNodes.has(s)\|\|this.canvas.updateNode(s,{x:o.x,y:o.y})})});this.canvas=e,this.algorithm=t,this.staticNodes=o,this.win=s,new Tt(this.win,this.step)}static configure(e,t,o,s){new ie(e,t,o,s)}}const Nt=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r},ne=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.inset="0",r},Ve=()=>{const r=ne();return r.style.pointerEvents="none",r};class Dt{constructor(e){i(this,"background",ne());i(this,"main",ne());i(this,"overlayConnectablePorts",Ve());i(this,"overlayDraggableEdges",Ve());i(this,"host",Nt());this.element=e,this.element.appendChild(this.host),this.host.appendChild(this.background),this.host.appendChild(this.main),this.host.appendChild(this.overlayConnectablePorts),this.host.appendChild(this.overlayDraggableEdges)}destroy(){this.host.removeChild(this.background),this.host.removeChild(this.main),this.host.removeChild(this.overlayConnectablePorts),this.host.removeChild(this.overlayDraggableEdges),this.element.removeChild(this.host)}}const ae=r=>()=>r,Fe=ae(0),Mt=()=>{let r=0;return()=>r++},Lt=(r,e)=>{let t=Fe,o=Fe;const s=Mt();return r==="incremental"&&(t=s),e==="incremental"&&(o=s),typeof r=="number"&&(t=ae(r)),typeof e=="number"&&(o=ae(e)),typeof r=="function"&&(t=r),typeof e=="function"&&(o=e),{nodesPriorityFn:t,edgesPriorityFn:o}},he=r=>{if(typeof r=="function")return r;switch(r.type){case"straight":return()=>new Ce({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance,detourDirection:r.detourDirection});case"horizontal":return()=>new Pe({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"vertical":return()=>new Te({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"direct":return()=>new Z({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,sourceOffset:r.sourceOffset,targetOffset:r.targetOffset});default:return()=>new be({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleRadius:r.cycleRadius,smallCycleRadius:r.smallCycleRadius,curvature:r.curvature,detourDistance:r.detourDistance,detourDirection:r.detourDirection})}},Rt=r=>{var t,o,s,n,a;const e=Lt((t=r.nodes)==null?void 0:t.priority,(o=r.edges)==null?void 0:o.priority);return{nodes:{centerFn:((s=r.nodes)==null?void 0:s.centerFn)??ye,priorityFn:e.nodesPriorityFn},ports:{direction:((n=r.ports)==null?void 0:n.direction)??0},edges:{shapeFactory:he(((a=r.edges)==null?void 0:a.shape)??{}),priorityFn:e.edgesPriorityFn}}},Vt=r=>{var w,f,b,P,C,D;const e=((w=r.events)==null?void 0:w.onNodeDragStarted)??(()=>{}),t=((f=r.events)==null?void 0:f.onNodeDrag)??(()=>{}),o=r.nodeDragVerifier??(()=>!0),s=((b=r.events)==null?void 0:b.onNodeDragFinished)??(()=>{}),n=r.moveOnTop!==!1,a=r.moveEdgesOnTop!==!1&&n,h=(P=r.mouse)==null?void 0:P.dragCursor,d=h!==void 0?h:"grab",c=(C=r.mouse)==null?void 0:C.mouseDownEventVerifier,g=c!==void 0?c:N=>N.button===0,l=(D=r.mouse)==null?void 0:D.mouseUpEventVerifier,u=l!==void 0?l:N=>N.button===0;return{moveOnTop:n,moveEdgesOnTop:a,dragCursor:d,gridSize:r.gridSize??null,mouseDownEventVerifier:g,mouseUpEventVerifier:u,onNodeDragStarted:e,onNodeDrag:t,nodeDragVerifier:o,onNodeDragFinished:s}},Ft=r=>{const e=r.minX!==null?r.minX:-1/0,t=r.maxX!==null?r.maxX:1/0,o=r.minY!==null?r.minY:-1/0,s=r.maxY!==null?r.maxY:1/0;return n=>{let a=n.nextTransform.x,h=n.nextTransform.y;a<e&&a<n.prevTransform.x&&(a=Math.min(n.prevTransform.x,e));const d=n.canvasWidthn.prevTransform.scale,c=t-d;a>c&&a>n.prevTransform.x&&(a=Math.max(n.prevTransform.x,c)),h<o&&h<n.prevTransform.y&&(h=Math.min(n.prevTransform.y,o));const g=n.canvasHeightn.prevTransform.scale,l=s-g;return h>l&&h>n.prevTransform.y&&(h=Math.max(n.prevTransform.y,l)),{scale:n.nextTransform.scale,x:a,y:h}}},It=r=>{const e=r.maxContentScale,t=r.minContentScale,o=e!==null?1/e:0,s=t!==null?1/t:1/0;return n=>{const a=n.prevTransform,h=n.nextTransform;let d=h.scale,c=h.x,g=h.y;if(h.scale>s&&h.scale>a.scale){d=Math.max(a.scale,s),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)l,g=a.y+(h.y-a.y)l}if(h.scale<o&&h.scale<a.scale){d=Math.min(a.scale,o),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)l,g=a.y+(h.y-a.y)l}return{scale:d,x:c,y:g}}},$t=r=>e=>r.reduce((t,o)=>o({prevTransform:e.prevTransform,nextTransform:t,canvasWidth:e.canvasWidth,canvasHeight:e.canvasHeight}),e.nextTransform),Ie=r=>{if(typeof r=="function")return r;switch(r.type){case"scale-limit":return It({minContentScale:r.minContentScale??0,maxContentScale:r.maxContentScale??1/0});case"shift-limit":return Ft({minX:r.minX??-1/0,maxX:r.maxX??1/0,minY:r.minY??-1/0,maxY:r.maxY??1/0})}},$e=r=>{var f,b,P,C,D,N,I,$,Ye,Ge,je,qe;const e=(f=r==null?void 0:r.scale)==null?void 0:f.mouseWheelSensitivity,t=e!==void 0?e:1.2,o=r==null?void 0:r.transformPreprocessor;let s;o!==void 0?Array.isArray(o)?s=$t(o.map(L=>Ie(L))):s=Ie(o):s=L=>L.nextTransform;const n=((b=r==null?void 0:r.shift)==null?void 0:b.cursor)!==void 0?r.shift.cursor:"grab",a=((P=r==null?void 0:r.events)==null?void 0:P.onBeforeTransformChange)??(()=>{}),h=((C=r==null?void 0:r.events)==null?void 0:C.onTransformChange)??(()=>{}),d=(D=r==null?void 0:r.shift)==null?void 0:D.mouseDownEventVerifier,c=d!==void 0?d:L=>L.button===0,g=(N=r==null?void 0:r.shift)==null?void 0:N.mouseUpEventVerifier,l=g!==void 0?g:L=>L.button===0,u=(I=r==null?void 0:r.scale)==null?void 0:I.mouseWheelEventVerifier,w=u!==void 0?u:()=>!0;return{wheelSensitivity:t,onTransformStarted:(($=r==null?void 0:r.events)==null?void 0:$.onTransformStarted)??(()=>{}),onTransformFinished:((Ye=r==null?void 0:r.events)==null?void 0:Ye.onTransformFinished)??(()=>{}),onBeforeTransformChange:a,onTransformChange:h,transformPreprocessor:s,shiftCursor:n,mouseDownEventVerifier:c,mouseUpEventVerifier:l,mouseWheelEventVerifier:w,scaleWheelFinishTimeout:((Ge=r==null?void 0:r.scale)==null?void 0:Ge.wheelFinishTimeout)??500,onResizeTransformStarted:((je=r==null?void 0:r.events)==null?void 0:je.onResizeTransformStarted)??(()=>{}),onResizeTransformFinished:((qe=r==null?void 0:r.events)==null?void 0:qe.onResizeTransformFinished)??(()=>{})}},Ut=(r,e)=>{const t=document.createElementNS("http://www.w3.org/2000/svg","circle");return t.setAttribute("cx","0"),t.setAttribute("cy","0"),t.setAttribute("r",`${r}`),t.setAttribute("fill",`${e}`),t},Bt=r=>r instanceof SVGElement?r:Ut((r==null?void 0:r.radius)??1.5,(r==null?void 0:r.color)??"#d8d8d8"),Ot=r=>{const e=r.tileDimensions,t=(e==null?void 0:e.width)??25,o=(e==null?void 0:e.height)??25,s=Bt(r.renderer??{});return{tileWidth:t,tileHeight:o,renderer:s,maxViewportScale:r.maxViewportScale??10}},Wt=(r,e,t)=>{var c,g,l;const o=()=>"direct",s=u=>u,n=u=>u.button===0,a=()=>{},h=()=>{},d=()=>{};return{connectionTypeResolver:r.connectionTypeResolver??o,connectionPreprocessor:r.connectionPreprocessor??s,mouseDownEventVerifier:r.mouseDownEventVerifier??n,mouseUpEventVerifier:r.mouseUpEventVerifier??n,onAfterEdgeCreated:((c=r.events)==null?void 0:c.onAfterEdgeCreated)??a,onEdgeCreationInterrupted:((g=r.events)==null?void 0:g.onEdgeCreationInterrupted)??d,onEdgeCreationPrevented:((l=r.events)==null?void 0:l.onEdgeCreationPrevented)??h,dragPortDirection:r.dragPortDirection??t,edgeShapeFactory:r.edgeShape!==void 0?he(r.edgeShape):e}},zt=(r,e)=>{var c,g,l;const t=u=>u,o=u=>u.button===0&&u.ctrlKey,s=u=>u.button===0,n=u=>{const w=e.getPortAdjacentEdgeIds(u);return w.length>0?w[w.length-1]:null},a=()=>{},h=()=>{},d=()=>{};return{connectionPreprocessor:r.connectionPreprocessor??t,mouseDownEventVerifier:r.mouseDownEventVerifier??o,mouseUpEventVerifier:r.mouseUpEventVerifier??s,draggingEdgeResolver:r.draggingEdgeResolver??n,draggingEdgeShapeFactory:r.draggingEdgeShape!==void 0?he(r.draggingEdgeShape):null,onAfterEdgeReattached:((c=r.events)==null?void 0:c.onAfterEdgeReattached)??a,onEdgeReattachInterrupted:((g=r.events)==null?void 0:g.onEdgeReattachInterrupted)??d,onEdgeReattachPrevented:((l=r.events)==null?void 0:l.onEdgeReattachPrevented)??h}},kt=r=>({nodeVerticalRadius:r.nodeContainingRadius.vertical,nodeHorizontalRadius:r.nodeContainingRadius.horizontal}),Ht=r=>{var e,t;return{onAfterNodeDetached:((e=r==null?void 0:r.events)==null?void 0:e.onAfterNodeDetached)??(()=>{}),onBeforeNodeAttached:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeNodeAttached)??(()=>{})}};class Ue extends Error{constructor(){super(...arguments);i(this,"name","CanvasBuilderError")}}class Be{constructor(e,t,o){i(this,"dt");i(this,"nodeMass");i(this,"edgeEquilibriumLength");i(this,"edgeStiffness");i(this,"nodeForcesApplicationStrategy");i(this,"distanceVectorGenerator");this.graph=e,this.currentCoords=t,this.dt=o.dtSec,this.nodeMass=o.nodeMass,this.edgeEquilibriumLength=o.edgeEquilibriumLength,this.edgeStiffness=o.edgeStiffness,this.distanceVectorGenerator=o.distanceVectorGenerator,this.nodeForcesApplicationStrategy=o.nodeForcesApplicationStrategy}apply(){let e=0;const t=new Map;return this.graph.getAllNodeIds().forEach(s=>{t.set(s,{x:0,y:0})}),this.nodeForcesApplicationStrategy.apply(this.currentCoords,t),this.applyEdgeForces(t),this.currentCoords.forEach((s,n)=>{const a=t.get(n),h={x:a.x/this.nodeMassthis.dt,y:a.y/this.nodeMassthis.dt};e=Math.max(e,Math.sqrt(h.xh.x+h.yh.y));const d=h.xthis.dt,c=h.ythis.dt;s.x+=d,s.y+=c}),e}applyEdgeForces(e){this.graph.getAllEdgeIds().forEach(t=>{const o=this.graph.getEdge(t),s=this.graph.getPort(o.from),n=this.graph.getPort(o.to),a=this.currentCoords.get(s.nodeId),h=this.currentCoords.get(n.nodeId),d=this.distanceVectorGenerator.create(a,h),g=(d.d-this.edgeEquilibriumLength)this.edgeStiffness,l=d.exg,u=d.eyg,w=e.get(s.nodeId),f=e.get(n.nodeId);w.x+=l,w.y+=u,f.x-=l,f.y-=u})}}class Oe{constructor(e){i(this,"PI2",2Math.PI);this.rand=e}create(e,t){const o=t.x-e.x,s=t.y-e.y,n=oo+ss;if(n===0){const c=this.PI2this.rand();return{ex:Math.cos(c),ey:Math.sin(c),d:0}}const a=Math.sqrt(n),h=o/a,d=s/a;return{ex:h,ey:d,d:a}}}const We=r=>{if(r.distance===0)return r.maxForce;const e=r.coefficient(r.sourceCharger.targetCharge/(r.distancer.distance));return Math.min(e,r.maxForce)};class Xt{constructor(e){i(this,"nodeCharge");i(this,"distanceVectorGenerator");i(this,"maxForce");this.nodeCharge=e.nodeCharge,this.distanceVectorGenerator=e.distanceVectorGenerator,this.maxForce=e.maxForce}apply(e,t){const o=Array.from(t.keys()),s=o.length;for(let n=0;n<s;n++){const a=o[n];for(let h=n+1;h<s;h++){const d=o[h],c=e.get(a),g=e.get(d),l=this.distanceVectorGenerator.create(c,g),u=We({coefficient:1,sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,distance:l.d,maxForce:this.maxForce}),w=ul.ex,f=ul.ey,b=t.get(a),P=t.get(d);b.x-=w,b.y-=f,P.x+=w,P.y+=f}}}}const Yt=r=>{if(r.size===0)return{centerX:0,centerY:0,radius:0};let e=1/0,t=-1/0,o=1/0,s=-1/0;r.forEach(d=>{e=Math.min(e,d.x),t=Math.max(t,d.x),o=Math.min(o,d.y),s=Math.max(s,d.y)});const n=t-e,a=s-o,h=Math.max(n,a);return{centerX:(e+t)/2,centerY:(o+s)/2,radius:h/2}};class Gt{constructor(e){i(this,"root");i(this,"leaves",new Map);i(this,"coords");i(this,"areaRadiusThreshold");i(this,"nodeMass");i(this,"nodeCharge");i(this,"sortedParentNodes",[]);this.coords=e.coords,this.areaRadiusThreshold=e.areaRadiusThreshold,this.nodeMass=e.nodeMass,this.nodeCharge=e.nodeCharge,this.root={nodeIds:new Set(e.coords.keys()),box:e.box,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},parent:null,lb:null,lt:null,rb:null,rt:null};let t=[this.root];for(;t.length>0;){const o=[];for(;t.length>0;){const s=t.pop();this.processNode(s).forEach(a=>{o.push(a)})}t=o}this.sortedParentNodes.reverse().forEach(o=>{let s=0,n=0,a=0,h=0;o.lb!==null&&(a+=o.lb.totalMass,h+=o.lb.totalCharge,s+=o.lb.chargeCenter.xo.lb.totalCharge,n+=o.lb.chargeCenter.yo.lb.totalCharge),o.lt!==null&&(a+=o.lt.totalMass,h+=o.lt.totalCharge,s+=o.lt.chargeCenter.xo.lt.totalCharge,n+=o.lt.chargeCenter.yo.lt.totalCharge),o.rb!==null&&(a+=o.rb.totalMass,h+=o.rb.totalCharge,s+=o.rb.chargeCenter.xo.rb.totalCharge,n+=o.rb.chargeCenter.yo.rb.totalCharge),o.rt!==null&&(a+=o.rt.totalMass,h+=o.rt.totalCharge,s+=o.rt.chargeCenter.xo.rt.totalCharge,n+=o.rt.chargeCenter.yo.rt.totalCharge),o.totalMass=a,o.totalCharge=h,o.chargeCenter.x=s/h,o.chargeCenter.y=n/h})}getRoot(){return this.root}getLeaf(e){return this.leaves.get(e)}processNode(e){if(e.nodeIds.size<2)return this.setLeaf(e),[];const{centerX:t,centerY:o,radius:s}=e.box;if(s<this.areaRadiusThreshold)return this.setLeaf(e),[];this.sortedParentNodes.push(e);const n=new Set,a=new Set,h=new Set,d=new Set,c=s/2;e.nodeIds.forEach(u=>{const{x:w,y:f}=this.coords.get(u);w<t?f<o?d.add(u):h.add(u):f<o?a.add(u):n.add(u),e.nodeIds.delete(u)});const g={parent:e,lb:null,lt:null,rb:null,rt:null},l=[];if(n.size>0){const u={nodeIds:n,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:o+c,radius:c},...g};e.rt=u,l.push(u)}if(a.size>0){const u={nodeIds:a,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:o-c,radius:c},...g};e.rb=u,l.push(u)}if(h.size>0){const u={nodeIds:h,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:o+c,radius:c},...g};e.lt=u,l.push(u)}if(d.size>0){const u={nodeIds:d,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:o-c,radius:c},...g};e.lb=u,l.push(u)}return l}setLeaf(e){e.totalMass=this.nodeMasse.nodeIds.size,e.totalCharge=this.nodeChargee.nodeIds.size,e.chargeCenter=this.calculateLeafChargeCenter(e.nodeIds),e.nodeIds.forEach(t=>{this.leaves.set(t,e)})}calculateLeafChargeCenter(e){if(e.size===0)return{x:0,y:0};let t=0,o=0;return e.forEach(s=>{const n=this.coords.get(s);t+=n.x,o+=n.y}),{x:t/e.size,y:o/e.size}}}class jt{constructor(e){i(this,"areaRadiusThreshold");i(this,"nodeMass");i(this,"nodeCharge");i(this,"theta");i(this,"distanceVectorGenerator");i(this,"nodeForceCoefficient");i(this,"maxForce");this.areaRadiusThreshold=e.areaRadiusThreshold,this.nodeMass=e.nodeMass,this.nodeCharge=e.nodeCharge,this.theta=e.theta,this.distanceVectorGenerator=e.distanceVectorGenerator,this.nodeForceCoefficient=e.nodeForceCoefficient,this.maxForce=e.maxForce}apply(e,t){const o=Yt(e),s=new Gt({box:o,coords:e,areaRadiusThreshold:this.areaRadiusThreshold,nodeMass:this.nodeMass,nodeCharge:this.nodeCharge});e.forEach((n,a)=>{const h=this.calculateForceForNode(s.getLeaf(a),a,e),d=t.get(a);this.applyForce(d,h)})}calculateForceForNode(e,t,o){const s=o.get(t),n={x:0,y:0};e.nodeIds.forEach(h=>{if(h!==t){const d=o.get(h),c=this.calculateNodeRepulsiveForce({sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,sourceCoords:d,targetCoords:s});this.applyForce(n,c)}});let a=e;for(;a!==null;){const h=a.parent;if(h!==null){const d=this.distanceVectorGenerator.create(h.chargeCenter,s);h.box.radius2<d.dthis.theta?(this.tryApplyFarForce({totalForce:n,targetCoords:s,target:h.lb,current:a}),this.tryApplyFarForce({totalForce:n,targetCoords:s,target:h.rb,current:a}),this.tryApplyFarForce({totalForce:n,targetCoords:s,target:h.rt,current:a}),this.tryApplyFarForce({totalForce:n,targetCoords:s,target:h.lt,current:a})):(this.tryApplyNearForce({totalForce:n,targetCoords:s,target:h.lb,current:a,nodesCoords:o}),this.tryApplyNearForce({totalForce:n,targetCoords:s,target:h.rb,current:a,nodesCoords:o}),this.tryApplyNearForce({totalForce:n,targetCoords:s,target:h.rt,current:a,nodesCoords:o}),this.tryApplyNearForce({totalForce:n,targetCoords:s,target:h.lt,current:a,nodesCoords:o}))}a=a.parent}return n}calculateExactForce(e,t,o){const s={x:0,y:0},n=[e];for(;n.length>0;){const a=n.pop();a.nodeIds.forEach(h=>{const d=o.get(h),c=this.calculateNodeRepulsiveForce({sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,sourceCoords:d,targetCoords:t});this.applyForce(s,c)}),a.lb!==null&&n.push(a.lb),a.rb!==null&&n.push(a.rb),a.lt!==null&&n.push(a.lt),a.rt!==null&&n.push(a.rt)}return s}calculateApproximateForce(e,t){return this.calculateNodeRepulsiveForce({sourceCharge:this.nodeCharge,targetCharge:e.totalCharge,sourceCoords:e.chargeCenter,targetCoords:t})}calculateNodeRepulsiveForce(e){const t=this.distanceVectorGenerator.create(e.sourceCoords,e.targetCoords),o=We({coefficient:this.nodeForceCoefficient,sourceCharge:e.sourceCharge,targetCharge:e.targetCharge,distance:t.d,maxForce:this.maxForce});return{x:ot.ex,y:ot.ey}}applyForce(e,t){e.x+=t.x,e.y+=t.y}tryApplyFarForce(e){if(e.target!==null&&e.target!==e.current){const t=this.calculateApproximateForce(e.target,e.targetCoords);this.applyForce(e.totalForce,t)}}tryApplyNearForce(e){if(e.target!==null&&e.target!==e.current){const t=this.calculateExactForce(e.target,e.targetCoords,e.nodesCoords);this.applyForce(e.totalForce,t)}}}const ze=r=>r.theta!==0?new jt({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce,theta:r.theta,nodeMass:r.nodeMass,areaRadiusThreshold:r.areaRadiusThreshold}):new Xt({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce});class ke{constructor(e){i(this,"rand");i(this,"sparsity");this.rand=e.rand,this.sparsity=e.sparsity}calculateCoordinates(e){const{graph:t,viewport:o}=e,s=new Map,n=t.getAllNodeIds(),a=Math.sqrt(n.length)this.sparsity,{width:h,height:d}=o.getDimensions(),c={x:h/2,y:d/2},g=o.createContentCoords(c),l=a/2,u={x:g.x-l,y:g.y-l};return n.forEach(w=>{const f=t.getNode(w);s.set(w,{x:f.x??u.x+athis.rand(),y:f.y??u.y+a*this.rand()})}),s}}class qt{constructor(e){i(this,"distanceVectorGenerator");i(this,"nodeForcesApplicationStrategy");i(this,"fillerLayoutAlgorithm");i(this,"maxIterations");i(this,"dtSec");i(this,"nodeMass");i(this,"edgeEquilibriumLength");i(this,"edgeStiffness");i(this,"convergenceVelocity");this.maxIterations=e.maxIterations,this.dtSec=e.dtSec,this.nodeMass=e.nodeMass,this.edgeEquilibriumLength=e.edgeEquilibriumLength,this.edgeStiffness=e.edgeStiffness,this.convergenceVelocity=e.convergenceVelocity,this.distanceVectorGenerator=new Oe(e.rand),this.nodeForcesApplicationStrategy=ze({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new ke({rand:e.rand,sparsity:e.edgeEquilibriumLength})}calculateCoordinates(e){const{graph:t,viewport:o}=e,s=this.fillerLayoutAlgorithm.calculateCoordinates({graph:t,viewport:o});for(let n=0;n<this.maxIterations&&!(new Be(t,s,{distanceVectorGenerator:this.distanceVectorGenerator,nodeForcesApplicationStrategy:this.nodeForcesApplicationStrategy,dtSec:this.dtSec,nodeMass:this.nodeMass,edgeEquilibriumLength:this.edgeEquilibriumLength,edgeStiffness:this.edgeStiffness}).apply()<this.convergenceVelocity);n++);return s}}class Kt{constructor(e){i(this,"distanceVectorGenerator");i(this,"nodeForcesApplicationStrategy");i(this,"convergenceVelocity");i(this,"maxTimeDeltaSec");i(this,"nodeMass");i(this,"edgeEquilibriumLength");i(this,"edgeStiffness");i(this,"fillerLayoutAlgorithm");this.convergenceVelocity=e.convergenceVelocity,this.maxTimeDeltaSec=e.maxTimeDeltaSec,this.nodeMass=e.nodeMass,this.edgeEquilibriumLength=e.edgeEquilibriumLength,this.edgeStiffness=e.edgeStiffness,this.distanceVectorGenerator=new Oe(e.rand),this.nodeForcesApplicationStrategy=ze({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new ke({rand:e.rand,sparsity:e.edgeEquilibriumLength})}calculateNextCoordinates(e){const{graph:t,viewport:o,dt:s}=e,n=this.fillerLayoutAlgorithm.calculateCoordinates({graph:t,viewport:o});return new Be(t,n,{distanceVectorGenerator:this.distanceVectorGenerator,nodeForcesApplicationStrategy:this.nodeForcesApplicationStrategy,dtSec:Math.min(s,this.maxTimeDeltaSec),nodeMass:this.nodeMass,edgeEquilibriumLength:this.edgeEquilibriumLength,edgeStiffness:this.edgeStiffness}).apply()<this.convergenceVelocity&&!t.getAllNodeIds().some(c=>{const g=t.getNode(c);return g.x===null\|\|g.y===null})?new Map:n}}const He=r=>{let e=1779033703,t=3144134277,o=1013904242,s=2773480762;for(let n=0,a;n<r.length;n++)a=r.charCodeAt(n),e=t^Math.imul(e^a,597399067),t=o^Math.imul(t^a,2869860233),o=s^Math.imul(o^a,951274213),s=e^Math.imul(s^a,2716044179);return e=Math.imul(o^e>>>18,597399067),t=Math.imul(s^t>>>22,2869860233),o=Math.imul(e^o>>>17,951274213),s=Math.imul(t^s>>>19,2716044179),e^=t^o^s,t^=e,o^=e,s^=e,[e>>>0,t>>>0,o>>>0,s>>>0]},Xe=(r,e,t,o)=>function(){r\|=0,e\|=0,t\|=0,o\|=0;const s=(r+e\|0)+o\|0;return o=o+1\|0,r=e^e>>>9,e=t+(t<<3)\|0,t=t<<21\|t>>>11,t=t+s\|0,(s>>>0)/4294967296},E=Object.freeze({seed:"HTMLGraph is awesome",maxTimeDeltaSec:.01,nodeCharge:1e5,nodeMass:1,edgeEquilibriumLength:300,edgeStiffness:1e3,dtSec:.01,maxIterations:1e3,convergenceVelocity:10,maxForce:1e7,nodeForceCoefficient:1,barnesHutAreaRadiusThreshold:.01,barnesHutTheta:1}),Qt=r=>{var e,t,o;switch((e=r==null?void 0:r.algorithm)==null?void 0:e.type){case"custom":return r.algorithm.instance;default:{const s=r==null?void 0:r.algorithm,n=He((s==null?void 0:s.seed)??E.seed),a=Xe(n[0],n[1],n[2],n[3]);return new Kt({rand:a,maxTimeDeltaSec:(s==null?void 0:s.maxTimeDeltaSec)??E.maxTimeDeltaSec,nodeCharge:(s==null?void 0:s.nodeCharge)??E.nodeCharge,nodeMass:(s==null?void 0:s.nodeMass)??E.nodeMass,edgeEquilibriumLength:(s==null?void 0:s.edgeEquilibriumLength)??E.edgeEquilibriumLength,edgeStiffness:(s==null?void 0:s.edgeStiffness)??E.edgeStiffness,convergenceVelocity:(s==null?void 0:s.convergenceVelocity)??E.convergenceVelocity,maxForce:(s==null?void 0:s.maxForce)??E.maxForce,nodeForceCoefficient:(s==null?void 0:s.nodeForceCoefficient)??E.nodeForceCoefficient,barnesHutTheta:((t=s==null?void 0:s.barnesHut)==null?void 0:t.theta)??E.barnesHutTheta,barnesHutAreaRadiusThreshold:((o=s==null?void 0:s.barnesHut)==null?void 0:o.areaRadiusThreshold)??E.barnesHutAreaRadiusThreshold})}}},Zt=r=>r instanceof U?{type:"manual",trigger:r}:(r==null?void 0:r.type)==="topologyChangeMacrotask"?{type:"topologyChangeMacrotask"}:{type:"topologyChangeMicrotask"},Jt=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const o=He((r==null?void 0:r.seed)??E.seed),s=Xe(o[0],o[1],o[2],o[3]);return new qt({dtSec:(r==null?void 0:r.dtSec)??E.dtSec,maxIterations:(r==null?void 0:r.maxIterations)??E.maxIterations,rand:s,nodeCharge:(r==null?void 0:r.nodeCharge)??E.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??E.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??E.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??E.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??E.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??E.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??E.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??E.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??E.barnesHutAreaRadiusThreshold})}}},_t=r=>({algorithm:Jt(r==null?void 0:r.algorithm),applyOn:Zt(r==null?void 0:r.applyOn)}),er=(r,e)=>({...r,onNodeDragStarted:t=>{e.add(t),r.onNodeDragStarted(t)},onNodeDragFinished:t=>{e.delete(t),r.onNodeDragFinished(t)}}),tr=(r,e)=>{r.onBeforeNodeRemoved.subscribe(t=>{e.delete(t)}),r.onBeforeClear.subscribe(()=>{e.clear()})};class rr{constructor(e){i(this,"used",!1);i(this,"canvasDefaults",{});i(this,"dragConfig",{});i(this,"transformConfig",{});i(this,"backgroundConfig",{});i(this,"connectablePortsConfig",{});i(this,"draggableEdgesConfig",{});i(this,"virtualScrollConfig");i(this,"layoutConfig",{});i(this,"animatedLayoutConfig",{});i(this,"hasDraggableNodes",!1);i(this,"hasTransformableViewport",!1);i(this,"hasNodeResizeReactiveEdges",!1);i(this,"hasBackground",!1);i(this,"hasUserConnectablePorts",!1);i(this,"hasUserDraggableEdges",!1);i(this,"hasAnimatedLayout",!1);i(this,"hasLayout",!1);i(this,"boxRenderingTrigger",new U);i(this,"graphStore");i(this,"viewportStore");i(this,"graph");i(this,"viewport");i(this,"window",window);i(this,"animationStaticNodes",new Set);this.element=e,this.viewportStore=new tt(this.element),this.viewport=new Le(this.viewportStore),this.graphStore=new le,this.graph=new Me(this.graphStore)}setDefaults(e){return this.canvasDefaults=e,this}enableUserDraggableNodes(e){return this.hasDraggableNodes=!0,this.dragConfig=e??{},this}enableUserTransformableViewport(e){return this.hasTransformableViewport=!0,this.transformConfig=e??{},this}enableNodeResizeReactiveEdges(){return this.hasNodeResizeReactiveEdges=!0,this}enableVirtualScroll(e){return this.virtualScrollConfig=e,this}enableBackground(e){return this.hasBackground=!0,this.backgroundConfig=e??{},this}enableUserConnectablePorts(e){return this.hasUserConnectablePorts=!0,this.connectablePortsConfig=e??{},this}enableUserDraggableEdges(e){return this.hasUserDraggableEdges=!0,this.draggableEdgesConfig=e??{},this}enableLayout(e){return this.layoutConfig=e??{},this.hasLayout=!0,this.hasAnimatedLayout=!1,this}enableAnimatedLayout(e){return this.animatedLayoutConfig=e??{},this.hasAnimatedLayout=!0,this.hasLayout=!1,this}build(){if(this.used)throw new Ue("CanvasBuilder is a single use object");this.used=!0;const e=new Dt(this.element),t=this.createHtmlView(e.main),o=Rt(this.canvasDefaults),s=new ce(this.graph,this.viewport,this.graphStore,this.viewportStore,t,o);if(this.hasBackground&&te.configure(s,Ot(this.backgroundConfig),e.background),this.hasNodeResizeReactiveEdges&&q.configure(s),this.hasDraggableNodes){let a=Vt(this.dragConfig);this.hasAnimatedLayout&&(a=er(a,this.animationStaticNodes)),_.configure(s,e.main,this.window,a)}if(this.hasUserConnectablePorts){const a=Wt(this.connectablePortsConfig,o.edges.shapeFactory,o.ports.direction);re.configure(s,e.overlayConnectablePorts,this.viewportStore,this.window,a)}if(this.hasUserDraggableEdges){const a=zt(this.draggableEdgesConfig,s.graph);oe.configure(s,e.overlayDraggableEdges,this.viewportStore,this.window,a)}this.virtualScrollConfig!==void 0?ee.configure(s,e.main,this.window,$e(this.transformConfig),this.boxRenderingTrigger,kt(this.virtualScrollConfig)):this.hasTransformableViewport&&Y.configure(s,e.main,this.window,$e(this.transformConfig)),this.hasLayout&&Ct.configure(s,_t(this.layoutConfig)),this.hasAnimatedLayout&&(tr(s.graph,this.animationStaticNodes),ie.configure(s,Qt(this.animatedLayoutConfig),this.animationStaticNodes,this.window));const n=()=>{e.destroy(),s.onBeforeDestroy.unsubscribe(n)};return s.onBeforeDestroy.subscribe(n),s}createHtmlView(e){let t=new de(this.graphStore,this.viewportStore,e);return this.virtualScrollConfig!==void 0&&(t=new Je(t,this.graphStore,this.boxRenderingTrigger,Ht(this.virtualScrollConfig))),new _e(t,this.graphStore)}}v.BezierEdgeShape=be,v.CanvasBuilder=rr,v.CanvasBuilderError=Ue,v.CanvasError=A,v.ConnectionCategory=x,v.DirectEdgeShape=Z,v.EventSubject=U,v.HorizontalEdgeShape=Pe,v.InteractiveEdgeError=De,v.InteractiveEdgeShape=J,v.MidpointEdgeShape=Et,v.StraightEdgeShape=Ce,v.VerticalEdgeShape=Te,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});
1	+ (function(v,x){typeof exports=="object"&&typeof module<"u"?x(exports):typeof define=="function"&&define.amd?define(["exports"],x):(v=typeof globalThis<"u"?globalThis:v\|\|self,x(v.HtmlGraph={}))})(this,function(v){"use strict";var dr=Object.defineProperty;var cr=(v,x,R)=>x in v?dr(v,x,{enumerable:!0,configurable:!0,writable:!0,value:R}):v[x]=R;var o=(v,x,R)=>cr(v,typeof x!="symbol"?x+"":x,R);var x=(r=>(r.Line="line",r.NodeCycle="node-cycle",r.PortCycle="port-cycle",r))(x\|\|{});const R=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r.style.overflow="hidden",r},qe=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.width="0",r.style.height="0",r},Je=r=>{r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.visibility="hidden"};class le{constructor(e,t,s){o(this,"host",R());o(this,"container",qe());o(this,"edgeIdToElementMap",new Map);o(this,"attachedNodeIds",new Set);o(this,"applyTransform",()=>{const e=this.viewportStore.getContentMatrix();this.container.style.transform=`matrix(${e.scale}, 0, 0, ${e.scale}, ${e.x}, ${e.y})`});this.graphStore=e,this.viewportStore=t,this.element=s,this.element.appendChild(this.host),this.host.appendChild(this.container),this.viewportStore.onAfterUpdated.subscribe(this.applyTransform)}attachNode(e){const t=this.graphStore.getNode(e);Je(t.element),this.attachedNodeIds.add(e),this.container.appendChild(t.element),this.updateNodePosition(e),this.updateNodePriority(e),t.element.style.visibility="visible"}detachNode(e){const t=this.graphStore.getNode(e);this.container.removeChild(t.element),this.attachedNodeIds.delete(e)}attachEdge(e){const t=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,t),this.container.appendChild(t),this.renderEdge(e),this.updateEdgePriority(e)}detachEdge(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t),this.edgeIdToElementMap.delete(e)}clear(){this.edgeIdToElementMap.forEach((e,t)=>{this.detachEdge(t)}),this.attachedNodeIds.forEach(e=>{this.detachNode(e)})}destroy(){this.viewportStore.onAfterUpdated.unsubscribe(this.applyTransform),this.element.removeChild(this.host),this.host.removeChild(this.container)}updateNodePosition(e){const t=this.graphStore.getNode(e),{width:s,height:i}=t.element.getBoundingClientRect(),n=this.viewportStore.getViewportMatrix().scale,{payload:a}=t,h=a.centerFn(s,i),d=a.x-nh.x,c=a.y-nh.y;t.element.style.transform=`translate(${d}px, ${c}px)`}updateNodePriority(e){const t=this.graphStore.getNode(e);t.element.style.zIndex=`${t.payload.priority}`}updateEdgeShape(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t);const i=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,i),this.container.appendChild(i)}renderEdge(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from),i=this.graphStore.getPort(t.to),n=s.element.getBoundingClientRect(),a=i.element.getBoundingClientRect(),h=this.host.getBoundingClientRect(),d=this.viewportStore.getViewportMatrix().scale,c=this.createEdgeRenderPort(s,n,h,d),g=this.createEdgeRenderPort(i,a,h,d);let l=x.Line;s.element===i.element?l=x.PortCycle:s.nodeId===i.nodeId&&(l=x.NodeCycle),t.payload.shape.render({from:c,to:g,category:l})}updateEdgePriority(e){const t=this.graphStore.getEdge(e);t.payload.shape.svg.style.zIndex=`${t.payload.priority}`}createEdgeRenderPort(e,t,s,i){const n=this.viewportStore.createContentCoords({x:t.left-s.left,y:t.top-s.top});return{x:n.x,y:n.y,width:t.widthi,height:t.heighti,direction:e.payload.direction}}}class _e{constructor(e){o(this,"xFrom",1/0);o(this,"yFrom",1/0);o(this,"xTo",1/0);o(this,"yTo",1/0);this.graphStore=e}setRenderingBox(e){this.xFrom=e.x,this.xTo=e.x+e.width,this.yFrom=e.y,this.yTo=e.y+e.height}hasNode(e){const t=this.graphStore.getNode(e).payload,{x:s,y:i}=t;return s>=this.xFrom&&s<=this.xTo&&i>=this.yFrom&&i<=this.yTo}hasEdge(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from).nodeId,i=this.graphStore.getPort(t.to).nodeId,n=this.graphStore.getNode(s).payload,a=this.graphStore.getNode(i).payload,h=Math.min(n.x,a.x),d=Math.max(n.x,a.x),c=Math.min(n.y,a.y),g=Math.max(n.y,a.y);return h<=this.xTo&&d>=this.xFrom&&c<=this.yTo&&g>=this.yFrom}}class et{constructor(e,t,s,i){o(this,"attachedNodes",new Set);o(this,"attachedEdges",new Set);o(this,"renderingBox");o(this,"updateViewport",e=>{this.renderingBox.setRenderingBox(e);const t=new Set,s=new Set,i=new Set,n=new Set;this.graphStore.getAllNodeIds().forEach(a=>{const h=this.renderingBox.hasNode(a),d=this.attachedNodes.has(a);h&&!d?t.add(a):!h&&d&&s.add(a)}),this.graphStore.getAllEdgeIds().forEach(a=>{const h=this.renderingBox.hasEdge(a),d=this.attachedEdges.has(a),c=this.graphStore.getEdge(a),g=this.graphStore.getPort(c.from).nodeId,l=this.graphStore.getPort(c.to).nodeId;h&&(this.renderingBox.hasNode(g)\|\|(t.add(g),s.delete(g)),this.renderingBox.hasNode(l)\|\|(t.add(l),s.delete(l))),h&&!d?i.add(a):!h&&d&&n.add(a)}),n.forEach(a=>{this.handleDetachEdge(a)}),s.forEach(a=>{this.handleDetachNode(a)}),t.forEach(a=>{this.attachedNodes.has(a)\|\|this.handleAttachNode(a)}),i.forEach(a=>{this.handleAttachEdge(a)})});this.htmlView=e,this.graphStore=t,this.trigger=s,this.params=i,this.renderingBox=new _e(this.graphStore),this.trigger.subscribe(this.updateViewport)}attachNode(e){this.renderingBox.hasNode(e)&&this.handleAttachNode(e)}detachNode(e){this.attachedNodes.has(e)&&this.handleDetachNode(e)}attachEdge(e){this.renderingBox.hasEdge(e)&&this.attachEdgeEntities(e)}detachEdge(e){this.attachedEdges.has(e)&&this.handleDetachEdge(e)}updateNodePosition(e){this.attachedNodes.has(e)?this.htmlView.updateNodePosition(e):this.renderingBox.hasNode(e)&&(this.handleAttachNode(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(t=>{this.attachEdgeEntities(t)}))}updateNodePriority(e){this.attachedNodes.has(e)&&this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgeShape(e)}renderEdge(e){this.attachedEdges.has(e)&&this.htmlView.renderEdge(e)}updateEdgePriority(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgePriority(e)}clear(){this.htmlView.clear(),this.attachedNodes.clear(),this.attachedEdges.clear()}destroy(){this.clear(),this.htmlView.destroy(),this.trigger.unsubscribe(this.updateViewport)}attachEdgeEntities(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from).nodeId,i=this.graphStore.getPort(t.to).nodeId;this.attachedNodes.has(s)\|\|this.handleAttachNode(s),this.attachedNodes.has(i)\|\|this.handleAttachNode(i),this.handleAttachEdge(e)}handleAttachNode(e){this.params.onBeforeNodeAttached(e),this.attachedNodes.add(e),this.htmlView.attachNode(e)}handleDetachNode(e){this.htmlView.detachNode(e),this.attachedNodes.delete(e),this.params.onAfterNodeDetached(e)}handleAttachEdge(e){this.attachedEdges.add(e),this.htmlView.attachEdge(e)}handleDetachEdge(e){this.htmlView.detachEdge(e),this.attachedEdges.delete(e)}}class tt{constructor(e,t){o(this,"deferredNodes",new Set);o(this,"deferredEdges",new Set);this.htmlView=e,this.graphStore=t}attachNode(e){this.isNodeValid(e)?this.htmlView.attachNode(e):this.deferredNodes.add(e)}detachNode(e){this.deferredNodes.has(e)?this.deferredNodes.delete(e):this.htmlView.detachNode(e)}attachEdge(e){this.isEdgeValid(e)?this.htmlView.attachEdge(e):this.deferredEdges.add(e)}detachEdge(e){this.deferredEdges.has(e)?this.deferredEdges.delete(e):this.htmlView.detachEdge(e)}updateNodePosition(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePosition(e)}updateNodePriority(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgeShape(e)}renderEdge(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.renderEdge(e)}updateEdgePriority(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgePriority(e)}clear(){this.deferredNodes.clear(),this.deferredEdges.clear(),this.htmlView.clear()}destroy(){this.htmlView.destroy()}isNodeValid(e){const t=this.graphStore.getNode(e);return!(t.payload.x===null\|\|t.payload.y===null)}tryAttachNode(e){this.isNodeValid(e)&&(this.deferredNodes.delete(e),this.htmlView.attachNode(e))}isEdgeValid(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from),i=this.graphStore.getPort(t.to);return!(this.deferredNodes.has(s.nodeId)\|\|this.deferredNodes.has(i.nodeId))}tryAttachEdge(e){this.isEdgeValid(e)&&(this.deferredEdges.delete(e),this.htmlView.attachEdge(e))}}class ${constructor(){o(this,"callbacks",new Set)}subscribe(e){this.callbacks.add(e)}unsubscribe(e){this.callbacks.delete(e)}emit(e){this.callbacks.forEach(t=>{t(e)})}}const S=()=>{const r=new $;return[r,r]};class j{constructor(e){o(this,"counter",0);this.checkExists=e}create(e){if(e!==void 0)return e;for(;this.checkExists(this.counter);)this.counter++;return this.counter}reset(){this.counter=0}}class ge{constructor(e,t,s,i,n,a){o(this,"nodeIdGenerator",new j(e=>this.graphStore.hasNode(e)));o(this,"portIdGenerator",new j(e=>this.graphStore.hasPort(e)));o(this,"edgeIdGenerator",new j(e=>this.graphStore.hasEdge(e)));o(this,"onAfterNodeAdded",e=>{this.htmlView.attachNode(e)});o(this,"onAfterNodeUpdated",e=>{this.htmlView.updateNodePosition(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(t=>{this.htmlView.renderEdge(t)})});o(this,"onAfterNodePriorityUpdated",e=>{this.htmlView.updateNodePriority(e)});o(this,"onBeforeNodeRemoved",e=>{this.graphStore.getNodePortIds(e).forEach(t=>{this.unmarkPort(t)}),this.htmlView.detachNode(e)});o(this,"onAfterPortUpdated",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(t=>{this.htmlView.renderEdge(t)})});o(this,"onBeforePortUnmarked",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(t=>{this.removeEdge(t)})});o(this,"onAfterEdgeAdded",e=>{this.htmlView.attachEdge(e)});o(this,"onAfterEdgeShapeUpdated",e=>{this.htmlView.updateEdgeShape(e)});o(this,"onAfterEdgeUpdated",e=>{this.htmlView.renderEdge(e)});o(this,"onAfterEdgePriorityUpdated",e=>{this.htmlView.updateEdgePriority(e)});o(this,"onBeforeEdgeRemoved",e=>{this.htmlView.detachEdge(e)});o(this,"onBeforeClear",()=>{this.nodeIdGenerator.reset(),this.portIdGenerator.reset(),this.edgeIdGenerator.reset(),this.htmlView.clear()});o(this,"onBeforeDestroyEmitter");o(this,"destroyed",!1);o(this,"onBeforeDestroy");this.graph=e,this.viewport=t,this.graphStore=s,this.viewportStore=i,this.htmlView=n,this.params=a,this.graphStore.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.subscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.subscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.subscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.subscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.subscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.subscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.subscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.subscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.subscribe(this.onBeforeClear),[this.onBeforeDestroyEmitter,this.onBeforeDestroy]=S()}addNode(e){const t=this.nodeIdGenerator.create(e.id);if(this.graphStore.addNode({id:t,element:e.element,x:e.x??null,y:e.y??null,centerFn:e.centerFn??this.params.nodes.centerFn,priority:e.priority??this.params.nodes.priorityFn()}),e.ports!==void 0)for(const s of e.ports)this.markPort({id:s.id,element:s.element,nodeId:t,direction:s.direction});return this}updateNode(e,t){return this.graphStore.updateNode(e,t??{}),this}removeNode(e){return this.graphStore.removeNode(e),this}markPort(e){const t=this.portIdGenerator.create(e.id);return this.graphStore.addPort({id:t,element:e.element,nodeId:e.nodeId,direction:e.direction??this.params.ports.direction}),this}updatePort(e,t){return this.graphStore.updatePort(e,t??{}),this}unmarkPort(e){return this.graphStore.removePort(e),this}addEdge(e){const t=this.edgeIdGenerator.create(e.id);return this.graphStore.addEdge({id:t,from:e.from,to:e.to,shape:e.shape??this.params.edges.shapeFactory(t),priority:e.priority??this.params.edges.priorityFn()}),this}updateEdge(e,t){return this.graphStore.updateEdge(e,t??{}),this}removeEdge(e){return this.graphStore.removeEdge(e),this}clear(){return this.graphStore.clear(),this}patchViewportMatrix(e){return this.viewportStore.patchViewportMatrix(e),this}patchContentMatrix(e){return this.viewportStore.patchContentMatrix(e),this}destroy(){this.destroyed\|\|(this.clear(),this.onBeforeDestroyEmitter.emit(),this.graphStore.onAfterNodeAdded.unsubscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.unsubscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.unsubscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.unsubscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.unsubscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.unsubscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.unsubscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.unsubscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.unsubscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.unsubscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.unsubscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.unsubscribe(this.onBeforeClear),this.htmlView.destroy(),this.viewportStore.destroy(),this.destroyed=!0)}}class rt{constructor(){o(this,"singleToMultiMap",new Map);o(this,"multiToSingleMap",new Map)}addRecord(e,t){const s=this.singleToMultiMap.get(e);s===void 0?this.singleToMultiMap.set(e,new Set([t])):s.add(t),this.multiToSingleMap.set(t,e)}getMultiBySingle(e){const t=this.singleToMultiMap.get(e)??new Set;return Array.from(t.values())}removeByMulti(e){const t=this.multiToSingleMap.get(e),s=this.singleToMultiMap.get(t);s.delete(e),s.size===0&&this.singleToMultiMap.delete(t),this.multiToSingleMap.delete(e)}getByMulti(e){return this.multiToSingleMap.get(e)}removeBySingle(e){this.singleToMultiMap.get(e).forEach(s=>{this.multiToSingleMap.delete(s)}),this.singleToMultiMap.delete(e)}clear(){this.singleToMultiMap.clear(),this.multiToSingleMap.clear()}forEachSingle(e){this.singleToMultiMap.forEach((t,s)=>{e(s)})}hasSingle(e){return this.singleToMultiMap.get(e)!==void 0}hasMulti(e){return this.multiToSingleMap.get(e)!==void 0}}class E extends Error{constructor(){super(...arguments);o(this,"name","CanvasError")}}class ue{constructor(){o(this,"nodes",new Map);o(this,"ports",new Map);o(this,"edges",new Map);o(this,"nodesElementsMap",new Map);o(this,"portIncomingEdges",new Map);o(this,"portOutcomingEdges",new Map);o(this,"portCycleEdges",new Map);o(this,"elementPorts",new rt);o(this,"afterNodeAddedEmitter");o(this,"onAfterNodeAdded");o(this,"afterNodeUpdatedEmitter");o(this,"onAfterNodeUpdated");o(this,"afterNodePriorityUpdatedEmitter");o(this,"onAfterNodePriorityUpdated");o(this,"beforeNodeRemovedEmitter");o(this,"onBeforeNodeRemoved");o(this,"afterPortAddedEmitter");o(this,"onAfterPortAdded");o(this,"afterPortUpdatedEmitter");o(this,"onAfterPortUpdated");o(this,"beforePortRemovedEmitter");o(this,"onBeforePortRemoved");o(this,"afterEdgeAddedEmitter");o(this,"onAfterEdgeAdded");o(this,"afterEdgeShapeUpdatedEmitter");o(this,"onAfterEdgeShapeUpdated");o(this,"afterEdgeUpdatedEmitter");o(this,"onAfterEdgeUpdated");o(this,"afterEdgePriorityUpdatedEmitter");o(this,"onAfterEdgePriorityUpdated");o(this,"beforeEdgeRemovedEmitter");o(this,"onBeforeEdgeRemoved");o(this,"beforeClearEmitter");o(this,"onBeforeClear");[this.afterNodeAddedEmitter,this.onAfterNodeAdded]=S(),[this.afterNodeUpdatedEmitter,this.onAfterNodeUpdated]=S(),[this.afterNodePriorityUpdatedEmitter,this.onAfterNodePriorityUpdated]=S(),[this.beforeNodeRemovedEmitter,this.onBeforeNodeRemoved]=S(),[this.afterPortAddedEmitter,this.onAfterPortAdded]=S(),[this.afterPortUpdatedEmitter,this.onAfterPortUpdated]=S(),[this.beforePortRemovedEmitter,this.onBeforePortRemoved]=S(),[this.afterEdgeAddedEmitter,this.onAfterEdgeAdded]=S(),[this.afterEdgeShapeUpdatedEmitter,this.onAfterEdgeShapeUpdated]=S(),[this.afterEdgeUpdatedEmitter,this.onAfterEdgeUpdated]=S(),[this.afterEdgePriorityUpdatedEmitter,this.onAfterEdgePriorityUpdated]=S(),[this.beforeEdgeRemovedEmitter,this.onBeforeEdgeRemoved]=S(),[this.beforeClearEmitter,this.onBeforeClear]=S()}hasNode(e){return this.nodes.has(e)}getNode(e){const t=this.nodes.get(e);if(t===void 0)throw new E("failed to access nonexistent node");return t}addNode(e){if(this.hasNode(e.id))throw new E("failed to add node with existing id");if(this.findNodeIdByElement(e.element)!==void 0)throw new E("failed to add node with html element already in use by another node");const t=new Map,s={element:e.element,payload:{x:e.x,y:e.y,centerFn:e.centerFn,priority:e.priority},ports:t};this.nodes.set(e.id,s),this.nodesElementsMap.set(e.element,e.id),this.afterNodeAddedEmitter.emit(e.id)}getAllNodeIds(){return Array.from(this.nodes.keys())}findNodeIdByElement(e){return this.nodesElementsMap.get(e)}updateNode(e,t){if(!this.hasNode(e))throw new E("failed to update nonexistent node");const{payload:s}=this.nodes.get(e);s.x=t.x??s.x,s.y=t.y??s.y,s.centerFn=t.centerFn??s.centerFn,t.priority!==void 0&&(s.priority=t.priority,this.afterNodePriorityUpdatedEmitter.emit(e)),this.afterNodeUpdatedEmitter.emit(e)}removeNode(e){if(!this.hasNode(e))throw new E("failed to remove nonexistent node");this.beforeNodeRemovedEmitter.emit(e);const t=this.nodes.get(e);this.nodesElementsMap.delete(t.element),this.nodes.delete(e)}hasPort(e){return this.ports.has(e)}getPort(e){const t=this.ports.get(e);if(t===void 0)throw new E("failed to access nonexistent port");return t}addPort(e){if(this.hasPort(e.id))throw new E("failed to add port with existing id");if(!this.hasNode(e.nodeId))throw new E("failed to add port to nonexistent node");this.ports.set(e.id,{element:e.element,payload:{direction:e.direction},nodeId:e.nodeId}),this.elementPorts.addRecord(e.element,e.id),this.portCycleEdges.set(e.id,new Set),this.portIncomingEdges.set(e.id,new Set),this.portOutcomingEdges.set(e.id,new Set),this.nodes.get(e.nodeId).ports.set(e.id,e.element),this.afterPortAddedEmitter.emit(e.id)}updatePort(e,t){if(!this.hasPort(e))throw new E("failed to update nonexistent port");const s=this.ports.get(e).payload;s.direction=t.direction??s.direction,this.afterPortUpdatedEmitter.emit(e)}getAllPortIds(){return Array.from(this.ports.keys())}findPortIdsByElement(e){return this.elementPorts.getMultiBySingle(e)}getNodePortIds(e){const t=this.nodes.get(e);if(t===void 0)throw new E("failed to access port ids of nonexistent node");return Array.from(t.ports.keys())}removePort(e){if(!this.hasPort(e))throw new E("failed to remove nonexistent port");const t=this.ports.get(e).nodeId;this.beforePortRemovedEmitter.emit(e),this.nodes.get(t).ports.delete(e),this.ports.delete(e),this.elementPorts.removeByMulti(e)}hasEdge(e){return this.edges.has(e)}getEdge(e){const t=this.edges.get(e);if(t===void 0)throw new E("failed to access nonexistent edge");return t}addEdge(e){if(this.hasEdge(e.id))throw new E("failed to add edge with existing id");if(!this.hasPort(e.from))throw new E("failed to add edge from nonexistent port");if(!this.hasPort(e.to))throw new E("failed to add edge to nonexistent port");this.addEdgeInternal(e),this.afterEdgeAddedEmitter.emit(e.id)}updateEdge(e,t){if(!this.hasEdge(e))throw new E("failed to update nonexistent edge");if(t.from!==void 0\|\|t.to!==void 0){const i=this.edges.get(e),n=i.payload;this.removeEdgeInternal(e),this.addEdgeInternal({id:e,from:t.from??i.from,to:t.to??i.to,shape:n.shape,priority:n.priority})}const s=this.edges.get(e);t.shape!==void 0&&(s.payload.shape=t.shape,this.afterEdgeShapeUpdatedEmitter.emit(e)),t.priority!==void 0&&(s.payload.priority=t.priority,this.afterEdgePriorityUpdatedEmitter.emit(e)),this.afterEdgeUpdatedEmitter.emit(e)}getAllEdgeIds(){return Array.from(this.edges.keys())}removeEdge(e){if(!this.hasEdge(e))throw new E("failed to remove nonexistent edge");this.beforeEdgeRemovedEmitter.emit(e),this.removeEdgeInternal(e)}clear(){this.beforeClearEmitter.emit(),this.portIncomingEdges.clear(),this.portOutcomingEdges.clear(),this.portCycleEdges.clear(),this.elementPorts.clear(),this.nodesElementsMap.clear(),this.edges.clear(),this.ports.clear(),this.nodes.clear()}getPortIncomingEdgeIds(e){const t=this.portIncomingEdges.get(e);if(t===void 0)throw new E("failed to access edges for nonexistent port");return Array.from(t)}getPortOutgoingEdgeIds(e){const t=this.portOutcomingEdges.get(e);if(t===void 0)throw new E("failed to access edges for nonexistent port");return Array.from(t)}getPortCycleEdgeIds(e){const t=this.portCycleEdges.get(e);if(t===void 0)throw new E("failed to access edges for nonexistent port");return Array.from(t)}getPortAdjacentEdgeIds(e){return[...this.getPortIncomingEdgeIds(e),...this.getPortOutgoingEdgeIds(e),...this.getPortCycleEdgeIds(e)]}getNodeIncomingEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortIncomingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.from).nodeId!==e}).forEach(n=>{s.push(n)})}),s}getNodeOutgoingEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortOutgoingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId!==e}).forEach(n=>{s.push(n)})}),s}getNodeCycleEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortCycleEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortIncomingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId===e}).forEach(n=>{s.push(n)})}),s}getNodeAdjacentEdgeIds(e){const t=Array.from(this.getNode(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortIncomingEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortOutgoingEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortCycleEdgeIds(i).forEach(n=>{s.push(n)})}),s}addEdgeInternal(e){this.edges.set(e.id,{from:e.from,to:e.to,payload:{shape:e.shape,priority:e.priority}}),e.from!==e.to?(this.portOutcomingEdges.get(e.from).add(e.id),this.portIncomingEdges.get(e.to).add(e.id)):this.portCycleEdges.get(e.from).add(e.id)}removeEdgeInternal(e){const t=this.edges.get(e),s=t.from,i=t.to;this.portCycleEdges.get(s).delete(e),this.portCycleEdges.get(i).delete(e),this.portIncomingEdges.get(s).delete(e),this.portIncomingEdges.get(i).delete(e),this.portOutcomingEdges.get(s).delete(e),this.portOutcomingEdges.get(i).delete(e),this.edges.delete(e)}}const pe=r=>({scale:1/r.scale,x:-r.x/r.scale,y:-r.y/r.scale}),we={scale:1,x:0,y:0},ye=(r,e)=>({x:r.scalee.x+r.x,y:r.scalee.y+r.y});class st{constructor(e){o(this,"viewportMatrix",we);o(this,"contentMatrix",we);o(this,"beforeUpdateEmitter");o(this,"onBeforeUpdated");o(this,"afterUpdateEmitter");o(this,"onAfterUpdated");o(this,"afterResizeEmitter");o(this,"onAfterResize");o(this,"observer",new ResizeObserver(()=>{this.afterResizeEmitter.emit()}));this.host=e,[this.afterUpdateEmitter,this.onAfterUpdated]=S(),[this.beforeUpdateEmitter,this.onBeforeUpdated]=S(),[this.afterResizeEmitter,this.onAfterResize]=S(),this.observer.observe(this.host)}getViewportMatrix(){return this.viewportMatrix}getContentMatrix(){return this.contentMatrix}patchViewportMatrix(e){this.viewportMatrix={scale:e.scale??this.viewportMatrix.scale,x:e.x??this.viewportMatrix.x,y:e.y??this.viewportMatrix.y},this.beforeUpdateEmitter.emit(),this.contentMatrix=pe(this.viewportMatrix),this.afterUpdateEmitter.emit()}patchContentMatrix(e){this.contentMatrix={scale:e.scale??this.contentMatrix.scale,x:e.x??this.contentMatrix.x,y:e.y??this.contentMatrix.y},this.beforeUpdateEmitter.emit(),this.viewportMatrix=pe(this.contentMatrix),this.afterUpdateEmitter.emit()}getDimensions(){const{width:e,height:t}=this.host.getBoundingClientRect();return{width:e,height:t}}createContentCoords(e){return ye(this.viewportMatrix,e)}createViewportCoords(e){return ye(this.contentMatrix,e)}destroy(){this.observer.disconnect()}}class K{constructor(e){o(this,"elementToNodeId",new Map);o(this,"nodesResizeObserver");o(this,"onAfterNodeAdded",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.set(t.element,e),this.nodesResizeObserver.observe(t.element)});o(this,"onBeforeNodeRemoved",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.delete(t.element),this.nodesResizeObserver.unobserve(t.element)});o(this,"onBeforeClear",()=>{this.nodesResizeObserver.disconnect(),this.elementToNodeId.clear()});this.canvas=e,this.nodesResizeObserver=new ResizeObserver(t=>{t.forEach(s=>{const i=s.target;this.handleNodeResize(i)})}),this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear)}static configure(e){new K(e)}handleNodeResize(e){const t=this.elementToNodeId.get(e);this.canvas.updateNode(t)}}const ot=(r,e,t)=>{const{x:s,y:i,width:n,height:a}=r.getBoundingClientRect();return e>=s&&e<=s+n&&t>=i&&t<=i+a},it=(r,e,t)=>e>=0&&e<=r.innerWidth&&t>=0&&t<=r.innerHeight,V=(r,e,t,s)=>ot(e,t,s)&&it(r,t,s),U=(r,e)=>{e!==null?r.style.cursor=e:r.style.removeProperty("cursor")},O=r=>{const e=document.createElement("div");return{id:r.overlayNodeId,element:e,x:r.portCoords.x,y:r.portCoords.y,ports:[{id:r.overlayNodeId,element:e,direction:r.portDirection}]}},nt=(r,e)=>{let t=e;for(;t!==null;){const s=r.findPortIdsByElement(t)[0]??null;if(s!==null)return{status:"portFound",portId:s};if(r.findNodeIdByElement(t)!==void 0)return{status:"nodeEncountered"};t=t.parentElement}return{status:"notFound"}};functionfe(r,e){const t=r.elementsFromPoint(e.x,e.y);for(const s of t){if(s.shadowRoot!==null){const i=fe(s.shadowRoot,e);for(const n of i)yield n}yield s}}const me=(r,e)=>{const t=fe(document,e);for(const s of t){const i=nt(r,s);if(i.status==="portFound")return i.portId;if(i.status==="nodeEncountered")return null}return null};var T=(r=>(r.StaticNodeId="static",r.DraggingNodeId="dragging",r.EdgeId="edge",r))(T\|\|{});const ve=(r,e)=>({x:r/2,y:e/2}),p={x:0,y:0},m=(r,e,t)=>({x:e.xr.x-e.yr.y+((1-e.x)t.x+e.yt.y),y:e.yr.x+e.xr.y+((1-e.x)t.y-e.yt.x)}),Ae=(r,e)=>{const t={x:r.x+r.width/2,y:r.y+r.height/2},s={x:e.x+e.width/2,y:e.y+e.height/2},i=Math.min(t.x,s.x),n=Math.min(t.y,s.y),a=Math.abs(s.x-t.x),h=Math.abs(s.y-t.y),d=t.x<=s.x?1:-1,c=t.y<=s.y?1:-1;return{x:i,y:n,width:a,height:h,flipX:d,flipY:c}},W=(r,e,t,s)=>({x:er.x+(1-e)/2s.x,y:tr.y+(1-t)/2s.y});class at{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p),i=m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to),n={x:s.x+this.params.sourceDirection.xthis.params.curvature,y:s.y+this.params.sourceDirection.ythis.params.curvature},a={x:i.x-this.params.targetDirection.xthis.params.curvature,y:i.y-this.params.targetDirection.ythis.params.curvature},h=`M ${s.x} ${s.y} C ${n.x} ${n.y}, ${a.x} ${a.y}, ${i.x} ${i.y}`,d=this.params.hasSourceArrow?"":`M ${p.x} ${p.y} L ${s.x} ${s.y} `,c=this.params.hasTargetArrow?"":` M ${i.x} ${i.y} L ${this.params.to.x} ${this.params.to.y}`;this.path=`${d}${h}${c}`}}class ht{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength,n=Math.cos(this.params.detourDirection)this.params.detourDistance,a=Math.sin(this.params.detourDirection)this.params.detourDistance,h=nthis.params.flipX,d=athis.params.flipY,c=m({x:i,y:p.y},this.params.sourceDirection,p),g={x:c.x+h,y:c.y+d},l=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),u={x:l.x+h,y:l.y+d},w={x:(g.x+u.x)/2,y:(g.y+u.y)/2},y={x:c.x+this.params.curvaturethis.params.sourceDirection.x,y:c.y+this.params.curvaturethis.params.sourceDirection.y},b={x:l.x-this.params.curvaturethis.params.targetDirection.x,y:l.y-this.params.curvaturethis.params.targetDirection.y},P={x:c.x+h,y:c.y+d},N={x:l.x+h,y:l.y+d};this.path=[`M ${t.x} ${t.y}`,`L ${c.x} ${c.y}`,`C ${y.x} ${y.y} ${P.x} ${P.y} ${w.x} ${w.y}`,`C ${N.x} ${N.y} ${b.x} ${b.y} ${l.x} ${l.y}`,`L ${s.x} ${s.y}`].join(" "),this.midpoint=W(w,e.flipX,e.flipY,e.to)}}const Q=Object.freeze({edgeColor:"--edge-color"}),Ee=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","svg");return e.style.pointerEvents="none",e.style.position="absolute",e.style.top="0",e.style.left="0",e.style.overflow="visible",e.style.setProperty(Q.edgeColor,r),e},xe=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke",`var(${Q.edgeColor})`),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e},z=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","path");return r.setAttribute("fill",`var(${Q.edgeColor})`),r},Se=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.transformOrigin="50% 50%",r},be=(r,e)=>{r.style.transform=`translate(${e.x}px, ${e.y}px)`,r.style.width=`${Math.max(e.width,1)}px`,r.style.height=`${Math.max(e.height,1)}px`},M=(r,e)=>{const t=[];if(r.length>0&&t.push(`M ${r[0].x} ${r[0].y}`),r.length===2&&t.push(`L ${r[1].x} ${r[1].y}`),r.length>2){const s=r.length-1;let i=0,n=0,a=0;r.forEach((h,d)=>{let c=0,g=0,l=0;const u=d>0,w=d<s,y=u&&w;if(u&&(c=-i,g=-n,l=a),w){const B=r[d+1];i=B.x-h.x,n=B.y-h.y,a=Math.sqrt(ii+nn)}const P=a!==0?Math.min((y?e:0)/a,d<s-1?.5:1):0,N=y?{x:h.x+iP,y:h.y+nP}:h,C=l!==0?Math.min((y?e:0)/l,d>1?.5:1):0,I=y?{x:h.x+cC,y:h.y+gC}:h;d>0&&t.push(`L ${I.x} ${I.y}`),y&&t.push(`C ${h.x} ${h.y} ${h.x} ${h.y} ${N.x} ${N.y}`)})}return t.join(" ")};class dt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,i=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=m({x:a,y:p.y},this.params.sourceDirection,p),d=m({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.x+d.x)/2,n),g=this.params.to.y/2,l={x:this.params.flipX>0?c:-n,y:h.y},u={x:l.x,y:g},w={x:this.params.flipX>0?this.params.to.x-c:this.params.to.x+n,y:d.y},y={x:w.x,y:g};this.path=M([s,h,l,u,y,w,d,i],this.params.roundness)}}class ct{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=m({x:i,y:p.y},this.params.sourceDirection,p),a=Math.cos(this.params.detourDirection)this.params.detourDistance,h=Math.sin(this.params.detourDirection)this.params.detourDistance,d=athis.params.flipX,c=hthis.params.flipY,g={x:n.x+d,y:n.y+c},l=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),u={x:l.x+d,y:l.y+c},w={x:(g.x+u.x)/2,y:(g.y+u.y)/2};this.midpoint=W(w,e.flipX,e.flipY,e.to),this.path=M([t,n,g,u,l,s],this.params.roundness)}}class lt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,i=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=m({x:n,y:p.y},this.params.sourceDirection,p),h=m({x:this.params.to.x-n,y:this.params.to.y},this.params.targetDirection,this.params.to);this.path=M([s,a,h,i],this.params.roundness)}}class gt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,i=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=m({x:a,y:p.y},this.params.sourceDirection,p),d=m({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.y+d.y)/2,n),g=this.params.to.x/2,l={x:h.x,y:this.params.flipY>0?c:-n},u={x:g,y:l.y},w={x:d.x,y:this.params.flipY>0?this.params.to.y-c:this.params.to.y+n},y={x:g,y:w.y};this.path=M([s,h,l,u,y,w,d,i],this.params.roundness)}}class Z{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.arrowOffset,s=this.params.side,i=this.params.arrowLength+t,n=i+2s,h=[{x:this.params.arrowLength,y:p.y},{x:i,y:p.y},{x:i,y:this.params.side},{x:n,y:this.params.side},{x:n,y:-this.params.side},{x:i,y:-this.params.side},{x:i,y:p.y},{x:this.params.arrowLength,y:p.y}].map(c=>m(c,this.params.sourceDirection,p)),d=`M ${p.x} ${p.y} L ${h[0].x} ${h[0].y} `;this.path=`${this.params.hasSourceArrow\|\|this.params.hasTargetArrow?"":d}${M(h,this.params.roundness)}`,this.midpoint={x:(h[3].x+h[4].x)/2,y:(h[3].y+h[4].y)/2}}}class ut{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.smallRadius,s=this.params.radius,i=t+s,n=ts/i,a=Math.sqrt(ii-tt),h=at/i,d=a+s+this.params.arrowLength,c=this.params.arrowLength+h,l=[{x:this.params.arrowLength,y:p.y},{x:c,y:n},{x:c,y:-n},{x:d,y:0}].map(y=>m(y,this.params.sourceDirection,p)),u=[`M ${l[0].x} ${l[0].y}`,`A ${t} ${t} 0 0 1 ${l[1].x} ${l[1].y}`,`A ${s} ${s} 0 1 0 ${l[2].x} ${l[2].y}`,`A ${t} ${t} 0 0 1 ${l[0].x} ${l[0].y}`].join(" "),w=`M 0 0 L ${l[0].x} ${l[0].y} `;this.path=`${this.params.hasSourceArrow\|\|this.params.hasTargetArrow?"":w}${u}`,this.midpoint=l[3]}}class pt{constructor(e){o(this,"path");o(this,"midpoint");o(this,"diagonalDistance");this.params=e;const t=this.params.to;if(this.midpoint={x:t.x/2,y:t.y/2},this.diagonalDistance=Math.sqrt(this.params.to.xthis.params.to.x+this.params.to.ythis.params.to.y),Math.sqrt(this.params.to.xthis.params.to.x+this.params.to.ythis.params.to.y)===0){this.path="";return}const i=this.createDirectLinePoint({offset:this.params.sourceOffset,hasArrow:this.params.hasSourceArrow,flip:1,shift:p}),n=this.createDirectLinePoint({offset:this.params.targetOffset,hasArrow:this.params.hasTargetArrow,flip:-1,shift:this.params.to});this.path=`M ${i.x} ${i.y} L ${n.x} ${n.y}`}createDirectLinePoint(e){const t=e.hasArrow?this.params.arrowLength:0,s=e.offset+t,i=e.flips/this.diagonalDistance;return{x:this.params.to.xi+e.shift.x,y:this.params.to.yi+e.shift.y}}}class wt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=m({x:i,y:p.y},this.params.sourceDirection,p),a=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.y/2,c=d+Math.abs(this.params.detourDistance),g=d+cthis.params.flipYh,l={x:(n.x+a.x)/2,y:g};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=M([t,n,{x:n.x,y:g},{x:a.x,y:g},a,s],this.params.roundness)}}class yt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:p.y},this.params.sourceDirection,p):p,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=m({x:i,y:p.y},this.params.sourceDirection,p),a=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.x/2,c=d+Math.abs(this.params.detourDistance),g=d+cthis.params.flipXh,l={x:g,y:(n.y+a.y)/2};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=M([t,n,{x:g,y:n.y},{x:g,y:a.y},a,s],this.params.roundness)}}const f=Object.freeze({color:"#777777",width:1,arrowLength:20,polygonArrowRadius:4,circleArrowRadius:8,wedgeArrowSmallRadius:20,wedgeArrowRadius:100,wedgeArrowAngle:Math.PI/12,arrowOffset:15,hasSourceArrow:!1,hasTargetArrow:!1,cycleRadius:30,cycleSquareSide:30,roundness:10,detourDistance:100,detourDirection:-Math.PI/2,detourDirectionVertical:0,smallCycleRadius:15,curvature:90,interactiveWidth:10,preOffset:0}),Pe=(r,e,t)=>({x:eMath.cos(r),y:tMath.sin(r)});class k{constructor(e){o(this,"svg");o(this,"group",Se());o(this,"line");o(this,"sourceArrow",null);o(this,"targetArrow",null);o(this,"onAfterRender");o(this,"afterRenderEmitter");o(this,"arrowRenderer");this.params=e,[this.afterRenderEmitter,this.onAfterRender]=S(),this.arrowRenderer=this.params.arrowRenderer,this.svg=Ee(e.color),this.svg.appendChild(this.group),this.line=xe(e.width),this.group.appendChild(this.line),e.hasSourceArrow&&(this.sourceArrow=z(),this.group.appendChild(this.sourceArrow)),e.hasTargetArrow&&(this.targetArrow=z(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:s,width:i,height:n,flipX:a,flipY:h}=Ae(e.from,e.to);be(this.svg,{x:t,y:s,width:i,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d=Pe(e.from.direction,a,h),c=Pe(e.to.direction,a,h),g={x:i,y:n};let l={x:-c.x,y:-c.y},u;e.category===x.PortCycle?(u=this.params.createCyclePath,l=d):e.category===x.NodeCycle?u=this.params.createDetourPath:u=this.params.createLinePath;const w=u(d,c,g,a,h);this.line.setAttribute("d",w.path);let y=null;this.sourceArrow&&(y=this.arrowRenderer({direction:d,shift:p,arrowLength:this.params.arrowLength}),this.sourceArrow.setAttribute("d",y));let b=null;this.targetArrow&&(b=this.arrowRenderer({direction:l,shift:g,arrowLength:this.params.arrowLength}),this.targetArrow.setAttribute("d",b)),this.afterRenderEmitter.emit({edgePath:w,sourceArrowPath:y,targetArrowPath:b})}}const ft=r=>e=>{const s=[p,{x:e.arrowLength,y:r.radius},{x:e.arrowLength,y:-r.radius}].map(h=>m(h,e.direction,p)).map(h=>({x:h.x+e.shift.x,y:h.y+e.shift.y})),i=`M ${s[0].x} ${s[0].y}`,n=`L ${s[1].x} ${s[1].y}`,a=`L ${s[2].x} ${s[2].y}`;return`${i} ${n} ${a} Z`},mt=r=>e=>{const t=r.radius,s=e.arrowLength,i=(ss+2st)/(2t),n=i+t,a=s+t-t(s+t)/n,h=ti/n,c=[p,{x:a,y:-h},{x:a,y:h}].map(y=>m(y,e.direction,p)).map(y=>({x:y.x+e.shift.x,y:y.y+e.shift.y})),g=`M ${c[0].x} ${c[0].y}`,l=`A ${i} ${i} 0 0 0 ${c[1].x} ${c[1].y}`,u=`A ${t} ${t} 0 0 0 ${c[2].x} ${c[2].y}`,w=`A ${i} ${i} 0 0 0 ${c[0].x} ${c[0].y}`;return`${g} ${l} ${u} ${w}`},vt=r=>e=>{const t=r.smallRadius,s=r.radius,i=m({x:e.arrowLength,y:0},{x:Math.cos(r.angle),y:Math.sin(r.angle)},{x:e.arrowLength+r.smallRadius,y:0}),a=[p,{x:i.x,y:-i.y},i].map(l=>m(l,e.direction,p)).map(l=>({x:l.x+e.shift.x,y:l.y+e.shift.y})),h=`M ${a[0].x} ${a[0].y}`,d=`A ${s} ${s} 0 0 1 ${a[1].x} ${a[1].y}`,c=`A ${t} ${t} 0 0 1 ${a[2].x} ${a[2].y}`,g=`A ${s} ${s} 0 0 1 ${a[0].x} ${a[0].y}`;return`${h} ${d} ${c} ${g}`},F=r=>{if(typeof r=="function")return r;switch(r.type){case"triangle":return ft({radius:r.radius??f.polygonArrowRadius});case"arc":return mt({radius:r.radius??f.circleArrowRadius});default:return vt({smallRadius:r.smallRadius??f.wedgeArrowSmallRadius,angle:r.angle??f.wedgeArrowAngle,radius:r.radius??f.wedgeArrowRadius})}};class Ne{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"curvature");o(this,"portCycleRadius");o(this,"portCycleSmallRadius");o(this,"detourDirection");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new ut({sourceDirection:e,radius:this.portCycleRadius,smallRadius:this.portCycleSmallRadius,arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new ht({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,detourDirection:this.detourDirection,detourDistance:this.detourDistance,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s)=>new at({to:s,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.curvature=(e==null?void 0:e.curvature)??f.curvature,this.portCycleRadius=(e==null?void 0:e.cycleRadius)??f.cycleRadius,this.portCycleSmallRadius=(e==null?void 0:e.smallCycleRadius)??f.smallCycleRadius,this.detourDirection=(e==null?void 0:e.detourDirection)??f.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Te{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new wt({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s,i)=>new dt({to:s,sourceDirection:e,targetDirection:t,flipX:i,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Ce{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDirection");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new ct({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDirection:this.detourDirection,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s)=>new lt({to:s,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDirection=(e==null?void 0:e.detourDirection)??f.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class De{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new yt({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s,i,n)=>new gt({to:s,sourceDirection:e,targetDirection:t,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new k({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:F((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class q{constructor(e){o(this,"svg");o(this,"group",Se());o(this,"line");o(this,"sourceArrow",null);o(this,"targetArrow",null);o(this,"color");o(this,"width");o(this,"arrowLength");o(this,"sourceOffset");o(this,"targetOffset");o(this,"onAfterRender");o(this,"afterRenderEmitter");o(this,"arrowRenderer");[this.afterRenderEmitter,this.onAfterRender]=S(),this.color=(e==null?void 0:e.color)??f.color,this.width=(e==null?void 0:e.width)??f.width,this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowRenderer=F((e==null?void 0:e.arrowRenderer)??{}),this.sourceOffset=(e==null?void 0:e.sourceOffset)??f.preOffset,this.targetOffset=(e==null?void 0:e.targetOffset)??f.preOffset,this.svg=Ee(this.color),this.svg.appendChild(this.group),this.line=xe(this.width),this.group.appendChild(this.line),e!=null&&e.hasSourceArrow&&(this.sourceArrow=z(),this.group.appendChild(this.sourceArrow)),e!=null&&e.hasTargetArrow&&(this.targetArrow=z(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:s,width:i,height:n,flipX:a,flipY:h}=Ae(e.from,e.to);be(this.svg,{x:t,y:s,width:i,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d={x:i,y:n},c=new pt({to:d,sourceOffset:this.sourceOffset,targetOffset:this.targetOffset,hasSourceArrow:this.sourceArrow!==null,hasTargetArrow:this.targetArrow!==null,arrowLength:this.arrowLength});this.line.setAttribute("d",c.path);let g=null,l=null;const u=c.diagonalDistance;if(u===0)this.sourceArrow!==null&&(g="",this.sourceArrow.setAttribute("d",g)),this.targetArrow!==null&&(l="",this.targetArrow.setAttribute("d",l));else{const w={x:d.x/u,y:d.y/u};if(this.sourceArrow){const y={x:w.xthis.sourceOffset,y:w.ythis.sourceOffset};g=this.arrowRenderer({direction:w,shift:y,arrowLength:this.arrowLength}),this.sourceArrow.setAttribute("d",g)}if(this.targetArrow){const y={x:w.xthis.targetOffset,y:w.ythis.targetOffset};l=this.arrowRenderer({direction:{x:-w.x,y:-w.y},shift:{x:d.x-y.x,y:d.y-y.y},arrowLength:this.arrowLength}),this.targetArrow.setAttribute("d",l)}}this.afterRenderEmitter.emit({edgePath:c,sourceArrowPath:g,targetArrowPath:l})}}const At=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.pointerEvents="auto",r.style.cursor="pointer",r},Et=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke","transparent"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e.setAttribute("stroke-linecap","round"),e},Me=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke-linejoin","round"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","transparent"),e.setAttribute("stroke","transparent"),e};class Le extends Error{constructor(e){super(e),this.name="InteractiveEdgeError"}}class J{constructor(e,t){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"handle",At());o(this,"onAfterRender");o(this,"interactiveLine");o(this,"interactiveSourceArrow",null);o(this,"interactiveTargetArrow",null);if(this.baseEdge=e,e instanceof J)throw new Le("interactive edge can be configured only once");this.svg=this.baseEdge.svg,this.group=this.baseEdge.group,this.line=this.baseEdge.line,this.sourceArrow=this.baseEdge.sourceArrow,this.targetArrow=this.baseEdge.targetArrow,this.onAfterRender=this.baseEdge.onAfterRender;const s=(t==null?void 0:t.distance)??f.interactiveWidth;this.interactiveLine=Et(s),this.handle.appendChild(this.interactiveLine),this.sourceArrow&&(this.interactiveSourceArrow=Me(s),this.handle.appendChild(this.interactiveSourceArrow)),this.targetArrow&&(this.interactiveTargetArrow=Me(s),this.handle.appendChild(this.interactiveTargetArrow)),this.group.appendChild(this.handle),this.baseEdge.onAfterRender.subscribe(i=>{this.interactiveLine.setAttribute("d",i.edgePath.path),this.interactiveSourceArrow&&this.interactiveSourceArrow.setAttribute("d",i.sourceArrowPath),this.interactiveTargetArrow&&this.interactiveTargetArrow.setAttribute("d",i.targetArrowPath)})}render(e){this.baseEdge.render(e)}}class xt{constructor(e,t){o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"svg");this.baseShape=e,this.midpointElement=t,this.svg=this.baseShape.svg,this.group=this.baseShape.group,this.line=this.baseShape.line,this.sourceArrow=this.baseShape.sourceArrow,this.targetArrow=this.baseShape.targetArrow,this.onAfterRender=this.baseShape.onAfterRender,this.svg.append(this.midpointElement),this.baseShape.onAfterRender.subscribe(s=>{const i=s.edgePath.midpoint,n=`translate(${i.x}px, ${i.y}px)`;this.midpointElement.style.setProperty("transform",n)})}render(e){this.baseShape.render(e)}}class Re{constructor(e){o(this,"onAfterNodeAdded");o(this,"onAfterNodeUpdated");o(this,"onAfterNodePriorityUpdated");o(this,"onBeforeNodeRemoved");o(this,"onAfterPortMarked");o(this,"onAfterPortUpdated");o(this,"onBeforePortUnmarked");o(this,"onAfterEdgeAdded");o(this,"onAfterEdgeShapeUpdated");o(this,"onAfterEdgeUpdated");o(this,"onAfterEdgePriorityUpdated");o(this,"onBeforeEdgeRemoved");o(this,"onBeforeClear");this.graphStore=e,this.onAfterNodeAdded=this.graphStore.onAfterNodeAdded,this.onAfterNodeUpdated=this.graphStore.onAfterNodeUpdated,this.onAfterNodePriorityUpdated=this.graphStore.onAfterNodePriorityUpdated,this.onBeforeNodeRemoved=this.graphStore.onBeforeNodeRemoved,this.onAfterPortMarked=this.graphStore.onAfterPortAdded,this.onAfterPortUpdated=this.graphStore.onAfterPortUpdated,this.onBeforePortUnmarked=this.graphStore.onBeforePortRemoved,this.onAfterEdgeAdded=this.graphStore.onAfterEdgeAdded,this.onAfterEdgeShapeUpdated=this.graphStore.onAfterEdgeShapeUpdated,this.onAfterEdgeUpdated=this.graphStore.onAfterEdgeUpdated,this.onAfterEdgePriorityUpdated=this.graphStore.onAfterEdgePriorityUpdated,this.onBeforeEdgeRemoved=this.graphStore.onBeforeEdgeRemoved,this.onBeforeClear=this.graphStore.onBeforeClear}hasNode(e){return this.graphStore.hasNode(e)}getNode(e){const t=this.graphStore.getNode(e),{payload:s}=t;return{element:t.element,x:s.x,y:s.y,centerFn:s.centerFn,priority:s.priority}}findNodeIdByElement(e){return this.graphStore.findNodeIdByElement(e)}getAllNodeIds(){return this.graphStore.getAllNodeIds()}hasPort(e){return this.graphStore.hasPort(e)}getPort(e){const t=this.graphStore.getPort(e);return{element:t.element,direction:t.payload.direction,nodeId:t.nodeId}}getAllPortIds(){return this.graphStore.getAllPortIds()}getNodePortIds(e){return this.graphStore.getNodePortIds(e)}findPortIdsByElement(e){return this.graphStore.findPortIdsByElement(e)}getAllEdgeIds(){return this.graphStore.getAllEdgeIds()}hasEdge(e){return this.graphStore.hasEdge(e)}getEdge(e){const t=this.graphStore.getEdge(e),{payload:s}=t;return{from:t.from,to:t.to,priority:s.priority,shape:s.shape}}getPortIncomingEdgeIds(e){return this.graphStore.getPortIncomingEdgeIds(e)}getPortOutgoingEdgeIds(e){return this.graphStore.getPortOutgoingEdgeIds(e)}getPortCycleEdgeIds(e){return this.graphStore.getPortCycleEdgeIds(e)}getPortAdjacentEdgeIds(e){return this.graphStore.getPortAdjacentEdgeIds(e)}getNodeIncomingEdgeIds(e){return this.graphStore.getNodeIncomingEdgeIds(e)}getNodeOutgoingEdgeIds(e){return this.graphStore.getNodeOutgoingEdgeIds(e)}getNodeCycleEdgeIds(e){return this.graphStore.getNodeCycleEdgeIds(e)}getNodeAdjacentEdgeIds(e){return this.graphStore.getNodeAdjacentEdgeIds(e)}}class Ve{constructor(e){o(this,"onBeforeUpdated");o(this,"onAfterUpdated");o(this,"onAfterResize");this.viewportStore=e,this.onBeforeUpdated=this.viewportStore.onBeforeUpdated,this.onAfterUpdated=this.viewportStore.onAfterUpdated,this.onAfterResize=this.viewportStore.onAfterResize}getViewportMatrix(){return{...this.viewportStore.getViewportMatrix()}}getContentMatrix(){return{...this.viewportStore.getContentMatrix()}}getDimensions(){return this.viewportStore.getDimensions()}createContentCoords(e){return this.viewportStore.createContentCoords(e)}createViewportCoords(e){return this.viewportStore.createViewportCoords(e)}}const Fe=(r,e)=>{const t=new ue,s=new Re(t),i=new Ve(e),n=new le(t,e,r),a={nodes:{centerFn:ve,priorityFn:()=>0},edges:{shapeFactory:()=>new q,priorityFn:()=>0},ports:{direction:0}};return new ge(s,i,t,e,n,a)};class H{constructor(e,t,s,i){o(this,"onAfterPortMarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.findPortIdsByElement(t.element).length===1&&this.hookPortEvents(t.element)});o(this,"onBeforePortUnmarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.findPortIdsByElement(t.element).length===1&&this.unhookPortEvents(t.element)});o(this,"onPortMouseDown",e=>{const t=e;if(!this.params.mouseDownEventVerifier(t))return;const s=e.currentTarget,i=this.canvas.graph.findPortIdsByElement(s)[0];this.params.onPortPointerDown(i,{x:t.clientX,y:t.clientY})&&(e.stopPropagation(),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}))});o(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.stopMouseDrag();return}this.params.onPointerMove({x:e.clientX,y:e.clientY})});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&(this.params.onPointerUp({x:e.clientX,y:e.clientY}),this.stopMouseDrag())});o(this,"onPortTouchStart",e=>{const t=e;if(t.touches.length!==1)return;const s=t.touches[0],i=e.currentTarget,n=this.canvas.graph.findPortIdsByElement(i)[0];this.params.onPortPointerDown(n,{x:s.clientX,y:s.clientY})&&(e.stopPropagation(),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}))});o(this,"onWindowTouchMove",e=>{const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.stopTouchDrag();return}this.params.onPointerMove({x:t.clientX,y:t.clientY})});o(this,"onWindowTouchFinish",e=>{const t=e.changedTouches[0];this.params.onPointerUp({x:t.clientX,y:t.clientY}),this.stopTouchDrag()});o(this,"onBeforeClear",()=>{this.canvas.graph.getAllPortIds().forEach(e=>{const t=this.canvas.graph.getPort(e);this.unhookPortEvents(t.element)})});o(this,"onBeforeDestroy",()=>{this.params.onStopDrag(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked),this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new H(e,t,s,i)}hookPortEvents(e){e.addEventListener("mousedown",this.onPortMouseDown,{passive:!0}),e.addEventListener("touchstart",this.onPortTouchStart,{passive:!0})}unhookPortEvents(e){e.removeEventListener("mousedown",this.onPortMouseDown),e.removeEventListener("touchstart",this.onPortTouchStart)}stopMouseDrag(){this.params.onStopDrag(),this.removeWindowMouseListeners()}stopTouchDrag(){this.params.onStopDrag(),this.removeWindowTouchListeners()}removeWindowMouseListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}removeWindowTouchListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}}class St{constructor(e,t,s){this.canvas=e,this.layoutAlgorithm=t,this.params=s}apply(){const e=this.layoutAlgorithm.calculateCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport});this.params.onBeforeApplied(),e.forEach((t,s)=>{this.params.staticNodeResolver(s)\|\|this.canvas.updateNode(s,t)}),this.params.onAfterApplied()}}class bt{constructor(e,t,s){this.canvas=e,this.layoutAlgorithm=t,this.params=s}apply(e){const t=this.layoutAlgorithm.calculateNextCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport,dt:e});this.params.onBeforeApplied(),t.forEach((s,i)=>{this.params.staticNodeResolver(i)\|\|this.canvas.updateNode(i,s)}),this.params.onAfterApplied()}}class _{constructor(e,t,s,i){o(this,"grabbedNode",null);o(this,"maxNodePriority",0);o(this,"graph");o(this,"onAfterNodeAdded",e=>{this.updateMaxNodePriority(e);const{element:t}=this.graph.getNode(e);t.addEventListener("mousedown",this.onMouseDown,{passive:!0}),t.addEventListener("touchstart",this.onTouchStart,{passive:!0})});o(this,"onAfterNodeUpdated",e=>{this.updateMaxNodePriority(e)});o(this,"onBeforeNodeRemoved",e=>{const{element:t}=this.graph.getNode(e);t.removeEventListener("mousedown",this.onMouseDown),t.removeEventListener("touchstart",this.onTouchStart)});o(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});o(this,"onBeforeClear",()=>{this.canvas.graph.getAllNodeIds().forEach(e=>{const{element:t}=this.canvas.graph.getNode(e);t.removeEventListener("mousedown",this.onMouseDown),t.removeEventListener("touchstart",this.onTouchStart)}),this.maxNodePriority=0});o(this,"onMouseDown",e=>{const t=e;if(!this.params.mouseDownEventVerifier(t))return;const s=e.currentTarget,i=this.graph.findNodeIdByElement(s),n=this.graph.getNode(i);if(!this.params.nodeDragVerifier(i))return;this.params.onNodeDragStarted(i),e.stopPropagation();const h=this.calculateContentPoint({x:t.clientX,y:t.clientY});this.grabbedNode={nodeId:i,dx:h.x-n.x,dy:h.y-n.y},U(this.element,this.params.dragCursor),this.moveNodeOnTop(i),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0})});o(this,"onTouchStart",e=>{const t=e;if(t.touches.length!==1)return;e.stopPropagation();const s=t.touches[0],i=e.currentTarget,n=this.canvas.graph.findNodeIdByElement(i),a=this.graph.getNode(n);if(!this.params.nodeDragVerifier({nodeId:n,element:a.element,x:a.x,y:a.y}))return;const d=this.calculateContentPoint({x:s.clientX,y:s.clientY});this.grabbedNode={nodeId:n,dx:d.x-a.x,dy:d.y-a.y},this.moveNodeOnTop(n),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0})});o(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.cancelMouseDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:e.clientX,y:e.clientY})});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.cancelMouseDrag()});o(this,"onWindowTouchMove",e=>{if(e.touches.length!==1)return;const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.cancelTouchDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:t.clientX,y:t.clientY})});o(this,"onWindowTouchFinish",()=>{this.cancelTouchDrag()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.graph=e.graph,this.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graph.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new _(e,t,s,i)}moveNode(e,t){if(!this.graph.hasNode(e.nodeId))return;const s=this.calculateContentPoint(t),i={x:s.x-e.dx,y:s.y-e.dy},n=this.adjustNodeCoords(i);this.canvas.updateNode(e.nodeId,{x:n.x,y:n.y}),this.params.onNodeDrag(e.nodeId)}moveNodeOnTop(e){if(this.params.moveOnTop){if(this.maxNodePriority++,this.params.moveEdgesOnTop){const t=this.maxNodePriority;this.maxNodePriority++,this.graph.getNodeAdjacentEdgeIds(e).forEach(i=>{this.canvas.updateEdge(i,{priority:t})})}this.canvas.updateNode(e,{priority:this.maxNodePriority})}}cancelMouseDrag(){this.grabbedNode!==null&&this.graph.hasNode(this.grabbedNode.nodeId)&&this.params.onNodeDragFinished(this.grabbedNode.nodeId),this.grabbedNode=null,U(this.element,null),this.removeMouseDragListeners()}removeMouseDragListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}cancelTouchDrag(){if(this.grabbedNode!==null&&this.graph.hasNode(this.grabbedNode.nodeId)){const e=this.graph.getNode(this.grabbedNode.nodeId);this.params.onNodeDragFinished({nodeId:this.grabbedNode.nodeId,element:e.element,x:e.x,y:e.y})}this.grabbedNode=null,this.removeTouchDragListeners()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}updateMaxNodePriority(e){const t=this.graph.getNode(e).priority;this.maxNodePriority=Math.max(this.maxNodePriority,t)}calculateContentPoint(e){const t=this.element.getBoundingClientRect();return this.canvas.viewport.createContentCoords({x:e.x-t.x,y:e.y-t.y})}adjustNodeCoords(e){const t=this.params.gridSize;if(t!==null){const s=t/2;return{x:Math.floor((e.x+s)/t)t,y:Math.floor((e.y+s)/t)t}}return e}}const Pt=(r,e,t)=>({scale:r.scale,x:r.x+r.scalee,y:r.y+r.scalet}),Nt=(r,e,t,s)=>({scale:r.scalee,x:r.scale(1-e)t+r.x,y:r.scale(1-e)s+r.y}),X=r=>{const e=[],t=r.touches.length;for(let h=0;h<t;h++)e.push([r.touches[h].clientX,r.touches[h].clientY]);const s=e.reduce((h,d)=>[h[0]+d[0],h[1]+d[1]],[0,0]),i=[s[0]/t,s[1]/t],a=e.map(h=>[h[0]-i[0],h[1]-i[1]]).reduce((h,d)=>h+Math.sqrt(d[0]d[0]+d[1]d[1]),0);return{x:i[0],y:i[1],scale:a/t,touchesCnt:t,touches:e}};class Y{constructor(e,t,s,i){o(this,"viewport");o(this,"prevTouches",null);o(this,"wheelFinishTimer",null);o(this,"transformInProgress",!1);o(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});o(this,"onMouseDown",e=>{this.element===null\|\|!this.params.mouseDownEventVerifier(e)\|\|(U(this.element,this.params.shiftCursor),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}),this.startRegisteredTransform())});o(this,"onWindowMouseMove",e=>{const t=V(this.window,this.element,e.clientX,e.clientY);if(this.element===null\|\|!t){this.stopMouseDrag();return}const s=-e.movementX,i=-e.movementY;this.moveViewport(s,i)});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.stopMouseDrag()});o(this,"onWheelScroll",e=>{if(!this.params.mouseWheelEventVerifier(e))return;const{left:t,top:s}=this.element.getBoundingClientRect(),i=e.clientX-t,n=e.clientY-s,h=1/(e.deltaY<0?this.params.wheelSensitivity:1/this.params.wheelSensitivity);this.wheelFinishTimer===null&&this.params.onTransformStarted(),this.scaleViewport(h,i,n),this.wheelFinishTimer!==null&&clearTimeout(this.wheelFinishTimer),this.wheelFinishTimer=setTimeout(()=>{this.transformInProgress\|\|this.params.onTransformFinished(),this.wheelFinishTimer=null},this.params.scaleWheelFinishTimeout)});o(this,"onTouchStart",e=>{if(this.prevTouches!==null){this.prevTouches=X(e);return}this.prevTouches=X(e),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}),this.startRegisteredTransform()});o(this,"onWindowTouchMove",e=>{const t=X(e);if(!t.touches.every(i=>V(this.window,this.element,i[0],i[1]))){this.stopTouchDrag();return}if((t.touchesCnt===1\|\|t.touchesCnt===2)&&this.moveViewport(-(t.x-this.prevTouches.x),-(t.y-this.prevTouches.y)),t.touchesCnt===2){const{left:i,top:n}=this.element.getBoundingClientRect(),a=this.prevTouches.x-i,h=this.prevTouches.y-n,c=1/(t.scale/this.prevTouches.scale);this.scaleViewport(c,a,h)}this.prevTouches=t});o(this,"onWindowTouchFinish",e=>{e.touches.length>0?this.prevTouches=X(e):this.stopTouchDrag()});o(this,"preventWheelScaleListener",e=>{e.preventDefault()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.element.addEventListener("wheel",this.preventWheelScaleListener,{passive:!1}),this.viewport=e.viewport,this.handleResize(),this.viewport.onAfterResize.subscribe(()=>{this.handleResize()}),this.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),this.element.addEventListener("wheel",this.onWheelScroll,{passive:!0}),this.element.addEventListener("touchstart",this.onTouchStart,{passive:!0}),e.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new Y(e,t,s,i)}moveViewport(e,t){const s=this.viewport.getViewportMatrix(),i=Pt(s,e,t),{width:n,height:a}=this.viewport.getDimensions(),h=this.params.transformPreprocessor({prevTransform:s,nextTransform:i,canvasWidth:n,canvasHeight:a});this.performTransform(h)}scaleViewport(e,t,s){const i=this.canvas.viewport.getViewportMatrix(),n=Nt(i,e,t,s),{width:a,height:h}=this.viewport.getDimensions(),d=this.params.transformPreprocessor({prevTransform:i,nextTransform:n,canvasWidth:a,canvasHeight:h});this.performTransform(d)}stopMouseDrag(){U(this.element,null),this.removeMouseDragListeners(),this.finishRegisteredTransform()}removeMouseDragListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}stopTouchDrag(){this.prevTouches=null,this.removeTouchDragListeners(),this.finishRegisteredTransform()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}performTransform(e){this.params.onBeforeTransformChange(),this.canvas.patchViewportMatrix(e),this.params.onTransformChange()}startRegisteredTransform(){this.transformInProgress=!0,this.params.onTransformStarted()}finishRegisteredTransform(){this.transformInProgress=!1,this.params.onTransformFinished()}handleResize(){const e=this.viewport.getViewportMatrix(),{width:t,height:s}=this.viewport.getDimensions(),i=this.params.transformPreprocessor({prevTransform:e,nextTransform:e,canvasWidth:t,canvasHeight:s});this.params.onResizeTransformStarted(),this.canvas.patchViewportMatrix(i),this.params.onResizeTransformFinished()}}class ee{constructor(e,t,s,i,n,a){o(this,"nodeHorizontal");o(this,"nodeVertical");o(this,"viewport");o(this,"currentScale");o(this,"loadedArea",{xFrom:1/0,xTo:1/0,yFrom:1/0,yTo:1/0});o(this,"updateLoadedArea",e=>{this.loadedArea={xFrom:e.x,xTo:e.x+e.width,yFrom:e.y,yTo:e.y+e.height}});o(this,"onAfterViewportUpdated",()=>{this.userTransformInProgress\|\|this.loadAreaAroundViewport()});o(this,"userTransformInProgress",!1);this.canvas=e,this.element=t,this.window=s,this.trigger=n,this.params=a,this.nodeHorizontal=this.params.nodeVerticalRadius,this.nodeVertical=this.params.nodeHorizontalRadius,this.viewport=e.viewport,this.currentScale=this.viewport.getViewportMatrix().scale,this.scheduleLoadAreaAroundViewport(),this.viewport.onAfterResize.subscribe(()=>{this.scheduleLoadAreaAroundViewport()});const h={...i,onResizeTransformStarted:()=>{this.userTransformInProgress=!0,i.onResizeTransformStarted()},onResizeTransformFinished:()=>{this.userTransformInProgress=!1,i.onResizeTransformFinished()},onBeforeTransformChange:()=>{this.userTransformInProgress=!0,i.onBeforeTransformChange()},onTransformChange:()=>{this.userTransformInProgress=!1;const d=this.currentScale;this.currentScale=this.viewport.getViewportMatrix().scale,d!==this.currentScale&&this.scheduleEnsureViewportAreaLoaded(),i.onTransformChange()},onTransformFinished:()=>{this.scheduleLoadAreaAroundViewport(),i.onTransformFinished()}};Y.configure(e,this.element,this.window,h),this.trigger.subscribe(this.updateLoadedArea),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated)}static configure(e,t,s,i,n,a){new ee(e,t,s,i,n,a)}scheduleLoadAreaAroundViewport(){setTimeout(()=>{this.loadAreaAroundViewport()})}scheduleEnsureViewportAreaLoaded(){setTimeout(()=>{const{width:e,height:t}=this.viewport.getDimensions(),{scale:s,x:i,y:n}=this.viewport.getViewportMatrix(),a=es,h=ts,d=i-this.nodeHorizontal,c=n-this.nodeVertical,g=i+a+this.nodeHorizontal,l=n+h+this.nodeVertical;this.loadedArea.xFrom<d&&this.loadedArea.xTo>g&&this.loadedArea.yFrom<c&&this.loadedArea.yTo>l\|\|this.loadAreaAroundViewport()})}loadAreaAroundViewport(){const{width:e,height:t}=this.viewport.getDimensions(),{scale:s,x:i,y:n}=this.viewport.getViewportMatrix(),a=es,h=ts,d=i-a-this.nodeHorizontal,c=n-h-this.nodeVertical,g=3a+2this.nodeHorizontal,l=3h+2this.nodeVertical;this.trigger.emit({x:d,y:c,width:g,height:l})}}const Tt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","svg");return r.style.position="absolute",r.style.inset="0",r},Ct=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","rect");return r.setAttribute("fill","url(#pattern)"),r},Dt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","pattern");return r.setAttribute("id","pattern"),r};class te{constructor(e,t,s){o(this,"svg",Tt());o(this,"patternRenderingRectangle",Ct());o(this,"pattern",Dt());o(this,"patternContent");o(this,"tileWidth");o(this,"tileHeight");o(this,"halfTileWidth");o(this,"halfTileHeight");o(this,"maxViewportScale");o(this,"visible",!1);o(this,"onAfterTransformUpdated",()=>{const e=this.canvas.viewport.getContentMatrix(),t=e.x-this.halfTileWidthe.scale,s=e.y-this.halfTileHeighte.scale,i=`matrix(${e.scale}, 0, 0, ${e.scale}, ${t}, ${s})`;this.pattern.setAttribute("patternTransform",i),this.updateVisibility()});this.canvas=e,this.backgroundHost=s,this.tileWidth=t.tileWidth,this.tileHeight=t.tileHeight,this.halfTileWidth=this.tileWidth/2,this.halfTileHeight=this.tileHeight/2,this.patternContent=t.renderer,this.maxViewportScale=t.maxViewportScale;const i=`translate(${this.halfTileWidth}, ${this.halfTileHeight})`;this.patternContent.setAttribute("transform",i),this.pattern.appendChild(this.patternContent);const n=document.createElementNS("http://www.w3.org/2000/svg","defs");n.appendChild(this.pattern),this.svg.appendChild(n),this.svg.appendChild(this.patternRenderingRectangle),this.updateDimensions(),this.canvas.viewport.onAfterResize.subscribe(()=>{this.updateDimensions()}),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterTransformUpdated),this.onAfterTransformUpdated()}static configure(e,t,s){new te(e,t,s)}updateVisibility(){const t=this.canvas.viewport.getViewportMatrix().scale>this.maxViewportScale;t&&this.visible?(this.visible=!1,this.backgroundHost.removeChild(this.svg)):!t&&!this.visible&&(this.visible=!0,this.backgroundHost.appendChild(this.svg))}updateDimensions(){const{width:e,height:t}=this.canvas.viewport.getDimensions();this.svg.setAttribute("width",`${e}`),this.svg.setAttribute("height",`${t}`),this.patternRenderingRectangle.setAttribute("width",`${e}`),this.patternRenderingRectangle.setAttribute("height",`${t}`);const s=this.tileWidth/e,i=this.tileHeight/t;this.pattern.setAttribute("width",`${s}`),this.pattern.setAttribute("height",`${i}`)}}class re{constructor(e,t,s,i,n){o(this,"overlayCanvas");o(this,"staticPortId",null);o(this,"isTargetDragging",!0);o(this,"onEdgeCreated",e=>{this.params.onAfterEdgeCreated(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=s,this.window=i,this.params=n,this.overlayCanvas=Fe(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>{const d=this.params.connectionTypeResolver(a);return d===null?!1:(this.grabPort(a,h,d),!0)},onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,s,i,n){new re(e,t,s,i,n)}grabPort(e,t,s){const i=this.canvas.graph.getPort(e);this.staticPortId=e;const n=i.element.getBoundingClientRect(),a=n.x+n.width/2,h=n.y+n.height/2,d=this.overlayLayer.getBoundingClientRect(),c=this.canvas.viewport.createContentCoords({x:a-d.x,y:h-d.y}),g=this.canvas.viewport.createContentCoords({x:t.x-d.x,y:t.y-d.y}),l={overlayNodeId:T.StaticNodeId,portCoords:c,portDirection:i.direction},u={overlayNodeId:T.DraggingNodeId,portCoords:g,portDirection:this.params.dragPortDirection};this.isTargetDragging=s==="direct";const[w,y]=this.isTargetDragging?[l,u]:[u,l];this.overlayCanvas.addNode(O(w)),this.overlayCanvas.addNode(O(y)),this.overlayCanvas.addEdge({from:w.overlayNodeId,to:y.overlayNodeId,shape:this.params.edgeShapeFactory(T.EdgeId)})}resetDragState(){this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}tryCreateConnection(e){const t=me(this.canvas.graph,e),s=this.staticPortId;if(t===null){this.params.onEdgeCreationInterrupted({staticPortId:s,isDirect:this.isTargetDragging});return}const i=this.isTargetDragging?s:t,n=this.isTargetDragging?t:s,a={from:i,to:n},h=this.params.connectionPreprocessor(a);h!==null?(this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeCreated),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeCreated)):this.params.onEdgeCreationPrevented(a)}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),s=this.canvas.viewport.createContentCoords({x:e.x-t.x,y:e.y-t.y});this.overlayCanvas.updateNode(T.DraggingNodeId,{x:s.x,y:s.y})}}class se{constructor(e,t,s,i,n){o(this,"overlayCanvas");o(this,"staticPortId",null);o(this,"isTargetDragging",!0);o(this,"draggingEdgePayload",null);o(this,"onEdgeReattached",e=>{this.params.onAfterEdgeReattached(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=s,this.window=i,this.params=n,this.overlayCanvas=Fe(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>this.tryStartEdgeDragging(a,h),onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,s,i,n){new se(e,t,s,i,n)}tryStartEdgeDragging(e,t){const s=this.params.draggingEdgeResolver(e);if(s===null\|\|!this.canvas.graph.hasEdge(s))return!1;const i=this.canvas.graph.getEdge(s),n=e===i.from,a=e===i.to,h=n?i.to:i.from;this.staticPortId=h,this.isTargetDragging=a;const d=this.canvas.graph.getPort(e),c=this.canvas.graph.getPort(h),g=c.element.getBoundingClientRect(),l={x:g.x+g.width/2,y:g.y+g.height/2},u=this.overlayLayer.getBoundingClientRect(),w=this.canvas.viewport.createContentCoords({x:l.x-u.x,y:l.y-u.y}),y=this.canvas.viewport.createContentCoords({x:t.x-u.x,y:t.y-u.y});this.draggingEdgePayload={id:s,from:i.from,to:i.to,shape:i.shape,priority:i.priority},this.canvas.removeEdge(s);const b={overlayNodeId:T.StaticNodeId,portCoords:w,portDirection:c.direction},P={overlayNodeId:T.DraggingNodeId,portCoords:y,portDirection:d.direction},[N,D]=this.isTargetDragging?[b,P]:[P,b];this.overlayCanvas.addNode(O(N)),this.overlayCanvas.addNode(O(D));const C=this.params.draggingEdgeShapeFactory!==null?this.params.draggingEdgeShapeFactory(T.EdgeId):i.shape;return this.overlayCanvas.addEdge({id:T.EdgeId,from:N.overlayNodeId,to:D.overlayNodeId,shape:C}),!0}resetDragState(){this.draggingEdgePayload=null,this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.createContentCoords(s);this.overlayCanvas.updateNode(T.DraggingNodeId,{x:i.x,y:i.y})}tryCreateConnection(e){const t=me(this.canvas.graph,e);if(this.overlayCanvas.removeEdge(T.EdgeId),t===null){const d=this.draggingEdgePayload;this.params.onEdgeReattachInterrupted({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority});return}const[s,i]=this.isTargetDragging?[this.staticPortId,t]:[t,this.staticPortId],n=this.draggingEdgePayload,a={id:n.id,from:s,to:i,shape:n.shape,priority:n.priority},h=this.params.connectionPreprocessor(a);if(h!==null)this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeReattached),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeReattached);else{const d=this.draggingEdgePayload;this.params.onEdgeReattachPrevented({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority})}}}class oe{constructor(e,t){this.applier=e,this.trigger=t,this.trigger.subscribe(()=>{this.applier.apply()})}static configure(e,t){new oe(e,t)}}class G{constructor(e,t,s){o(this,"applyScheduled",!1);o(this,"apply",()=>{this.applyScheduled=!1,this.applier.apply()});this.graph=e,this.applier=t,this.defererFn=s,this.graph.onAfterNodeAdded.subscribe(()=>{this.scheduleApply()}),this.graph.onBeforeNodeRemoved.subscribe(()=>{this.scheduleApply()}),this.graph.onAfterEdgeAdded.subscribe(()=>{this.scheduleApply()}),this.graph.onBeforeEdgeRemoved.subscribe(()=>{this.scheduleApply()})}static configure(e,t,s){new G(e,t,s)}scheduleApply(){this.applyScheduled\|\|(this.applyScheduled=!0,this.defererFn(this.apply))}}class Mt{static configure(e,t){const s=t.applyOn,i=new St(e,t.algorithm,{staticNodeResolver:t.staticNodeResolver,onBeforeApplied:t.onBeforeApplied,onAfterApplied:t.onAfterApplied});switch(s.type){case"manual":{oe.configure(i,s.trigger);break}case"topologyChangeMacrotask":{G.configure(e.graph,i,n=>{setTimeout(()=>{n()})});break}case"topologyChangeMicrotask":{G.configure(e.graph,i,n=>{queueMicrotask(()=>{n()})});break}}}}class Lt{constructor(e,t){o(this,"previousTimeStamp");o(this,"step",e=>{if(this.previousTimeStamp===void 0)this.previousTimeStamp=e;else{const t=(e-this.previousTimeStamp)/1e3;this.previousTimeStamp=e,this.callback(t)}this.win.requestAnimationFrame(this.step)});this.win=e,this.callback=t,this.win.requestAnimationFrame(this.step)}}class ie{constructor(e,t,s){o(this,"applier");o(this,"step",e=>{this.applier.apply(e)});this.win=s,this.applier=new bt(e,t.algorithm,{staticNodeResolver:t.staticNodeResolver,onBeforeApplied:t.onBeforeApplied,onAfterApplied:t.onAfterApplied}),new Lt(this.win,this.step)}static configure(e,t,s){new ie(e,t,s)}}const Rt=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r},ne=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.inset="0",r},Ie=()=>{const r=ne();return r.style.pointerEvents="none",r};class Vt{constructor(e){o(this,"background",ne());o(this,"main",ne());o(this,"overlayConnectablePorts",Ie());o(this,"overlayDraggableEdges",Ie());o(this,"host",Rt());this.element=e,this.element.appendChild(this.host),this.host.appendChild(this.background),this.host.appendChild(this.main),this.host.appendChild(this.overlayConnectablePorts),this.host.appendChild(this.overlayDraggableEdges)}destroy(){this.host.removeChild(this.background),this.host.removeChild(this.main),this.host.removeChild(this.overlayConnectablePorts),this.host.removeChild(this.overlayDraggableEdges),this.element.removeChild(this.host)}}const ae=r=>()=>r,Be=ae(0),Ft=()=>{let r=0;return()=>r++},It=(r,e)=>{let t=Be,s=Be;const i=Ft();return r==="incremental"&&(t=i),e==="incremental"&&(s=i),typeof r=="number"&&(t=ae(r)),typeof e=="number"&&(s=ae(e)),typeof r=="function"&&(t=r),typeof e=="function"&&(s=e),{nodesPriorityFn:t,edgesPriorityFn:s}},he=r=>{if(typeof r=="function")return r;switch(r.type){case"straight":return()=>new Ce({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance,detourDirection:r.detourDirection});case"horizontal":return()=>new Te({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"vertical":return()=>new De({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"direct":return()=>new q({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,sourceOffset:r.sourceOffset,targetOffset:r.targetOffset});default:return()=>new Ne({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleRadius:r.cycleRadius,smallCycleRadius:r.smallCycleRadius,curvature:r.curvature,detourDistance:r.detourDistance,detourDirection:r.detourDirection})}},Bt=r=>{var t,s,i,n,a;const e=It((t=r.nodes)==null?void 0:t.priority,(s=r.edges)==null?void 0:s.priority);return{nodes:{centerFn:((i=r.nodes)==null?void 0:i.centerFn)??ve,priorityFn:e.nodesPriorityFn},ports:{direction:((n=r.ports)==null?void 0:n.direction)??0},edges:{shapeFactory:he(((a=r.edges)==null?void 0:a.shape)??{}),priorityFn:e.edgesPriorityFn}}},$t=r=>{var w,y,b,P,N,D;const e=((w=r.events)==null?void 0:w.onNodeDragStarted)??(()=>{}),t=((y=r.events)==null?void 0:y.onNodeDrag)??(()=>{}),s=r.nodeDragVerifier??(()=>!0),i=((b=r.events)==null?void 0:b.onNodeDragFinished)??(()=>{}),n=r.moveOnTop!==!1,a=r.moveEdgesOnTop!==!1&&n,h=(P=r.mouse)==null?void 0:P.dragCursor,d=h!==void 0?h:"grab",c=(N=r.mouse)==null?void 0:N.mouseDownEventVerifier,g=c!==void 0?c:C=>C.button===0,l=(D=r.mouse)==null?void 0:D.mouseUpEventVerifier,u=l!==void 0?l:C=>C.button===0;return{moveOnTop:n,moveEdgesOnTop:a,dragCursor:d,gridSize:r.gridSize??null,mouseDownEventVerifier:g,mouseUpEventVerifier:u,onNodeDragStarted:e,onNodeDrag:t,nodeDragVerifier:s,onNodeDragFinished:i}},Ut=r=>{const e=r.minX!==null?r.minX:-1/0,t=r.maxX!==null?r.maxX:1/0,s=r.minY!==null?r.minY:-1/0,i=r.maxY!==null?r.maxY:1/0;return n=>{let a=n.nextTransform.x,h=n.nextTransform.y;a<e&&a<n.prevTransform.x&&(a=Math.min(n.prevTransform.x,e));const d=n.canvasWidthn.prevTransform.scale,c=t-d;a>c&&a>n.prevTransform.x&&(a=Math.max(n.prevTransform.x,c)),h<s&&h<n.prevTransform.y&&(h=Math.min(n.prevTransform.y,s));const g=n.canvasHeightn.prevTransform.scale,l=i-g;return h>l&&h>n.prevTransform.y&&(h=Math.max(n.prevTransform.y,l)),{scale:n.nextTransform.scale,x:a,y:h}}},Ot=r=>{const e=r.maxContentScale,t=r.minContentScale,s=e!==null?1/e:0,i=t!==null?1/t:1/0;return n=>{const a=n.prevTransform,h=n.nextTransform;let d=h.scale,c=h.x,g=h.y;if(h.scale>i&&h.scale>a.scale){d=Math.max(a.scale,i),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)l,g=a.y+(h.y-a.y)l}if(h.scale<s&&h.scale<a.scale){d=Math.min(a.scale,s),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)l,g=a.y+(h.y-a.y)l}return{scale:d,x:c,y:g}}},Wt=r=>e=>r.reduce((t,s)=>s({prevTransform:e.prevTransform,nextTransform:t,canvasWidth:e.canvasWidth,canvasHeight:e.canvasHeight}),e.nextTransform),$e=r=>{if(typeof r=="function")return r;switch(r.type){case"scale-limit":return Ot({minContentScale:r.minContentScale??0,maxContentScale:r.maxContentScale??1/0});case"shift-limit":return Ut({minX:r.minX??-1/0,maxX:r.maxX??1/0,minY:r.minY??-1/0,maxY:r.maxY??1/0})}},Ue=r=>{var y,b,P,N,D,C,I,B,je,Ke,Qe,Ze;const e=(y=r==null?void 0:r.scale)==null?void 0:y.mouseWheelSensitivity,t=e!==void 0?e:1.2,s=r==null?void 0:r.transformPreprocessor;let i;s!==void 0?Array.isArray(s)?i=Wt(s.map(L=>$e(L))):i=$e(s):i=L=>L.nextTransform;const n=((b=r==null?void 0:r.shift)==null?void 0:b.cursor)!==void 0?r.shift.cursor:"grab",a=((P=r==null?void 0:r.events)==null?void 0:P.onBeforeTransformChange)??(()=>{}),h=((N=r==null?void 0:r.events)==null?void 0:N.onTransformChange)??(()=>{}),d=(D=r==null?void 0:r.shift)==null?void 0:D.mouseDownEventVerifier,c=d!==void 0?d:L=>L.button===0,g=(C=r==null?void 0:r.shift)==null?void 0:C.mouseUpEventVerifier,l=g!==void 0?g:L=>L.button===0,u=(I=r==null?void 0:r.scale)==null?void 0:I.mouseWheelEventVerifier,w=u!==void 0?u:()=>!0;return{wheelSensitivity:t,onTransformStarted:((B=r==null?void 0:r.events)==null?void 0:B.onTransformStarted)??(()=>{}),onTransformFinished:((je=r==null?void 0:r.events)==null?void 0:je.onTransformFinished)??(()=>{}),onBeforeTransformChange:a,onTransformChange:h,transformPreprocessor:i,shiftCursor:n,mouseDownEventVerifier:c,mouseUpEventVerifier:l,mouseWheelEventVerifier:w,scaleWheelFinishTimeout:((Ke=r==null?void 0:r.scale)==null?void 0:Ke.wheelFinishTimeout)??500,onResizeTransformStarted:((Qe=r==null?void 0:r.events)==null?void 0:Qe.onResizeTransformStarted)??(()=>{}),onResizeTransformFinished:((Ze=r==null?void 0:r.events)==null?void 0:Ze.onResizeTransformFinished)??(()=>{})}},zt=(r,e)=>{const t=document.createElementNS("http://www.w3.org/2000/svg","circle");return t.setAttribute("cx","0"),t.setAttribute("cy","0"),t.setAttribute("r",`${r}`),t.setAttribute("fill",`${e}`),t},kt=r=>r instanceof SVGElement?r:zt((r==null?void 0:r.radius)??1.5,(r==null?void 0:r.color)??"#d8d8d8"),Ht=r=>{const e=r.tileDimensions,t=(e==null?void 0:e.width)??25,s=(e==null?void 0:e.height)??25,i=kt(r.renderer??{});return{tileWidth:t,tileHeight:s,renderer:i,maxViewportScale:r.maxViewportScale??10}},Xt=(r,e,t)=>{var c,g,l;const s=()=>"direct",i=u=>u,n=u=>u.button===0,a=()=>{},h=()=>{},d=()=>{};return{connectionTypeResolver:r.connectionTypeResolver??s,connectionPreprocessor:r.connectionPreprocessor??i,mouseDownEventVerifier:r.mouseDownEventVerifier??n,mouseUpEventVerifier:r.mouseUpEventVerifier??n,onAfterEdgeCreated:((c=r.events)==null?void 0:c.onAfterEdgeCreated)??a,onEdgeCreationInterrupted:((g=r.events)==null?void 0:g.onEdgeCreationInterrupted)??d,onEdgeCreationPrevented:((l=r.events)==null?void 0:l.onEdgeCreationPrevented)??h,dragPortDirection:r.dragPortDirection??t,edgeShapeFactory:r.edgeShape!==void 0?he(r.edgeShape):e}},Yt=(r,e)=>{var c,g,l;const t=u=>u,s=u=>u.button===0&&u.ctrlKey,i=u=>u.button===0,n=u=>{const w=e.getPortAdjacentEdgeIds(u);return w.length>0?w[w.length-1]:null},a=()=>{},h=()=>{},d=()=>{};return{connectionPreprocessor:r.connectionPreprocessor??t,mouseDownEventVerifier:r.mouseDownEventVerifier??s,mouseUpEventVerifier:r.mouseUpEventVerifier??i,draggingEdgeResolver:r.draggingEdgeResolver??n,draggingEdgeShapeFactory:r.draggingEdgeShape!==void 0?he(r.draggingEdgeShape):null,onAfterEdgeReattached:((c=r.events)==null?void 0:c.onAfterEdgeReattached)??a,onEdgeReattachInterrupted:((g=r.events)==null?void 0:g.onEdgeReattachInterrupted)??d,onEdgeReattachPrevented:((l=r.events)==null?void 0:l.onEdgeReattachPrevented)??h}},Gt=r=>({nodeVerticalRadius:r.nodeContainingRadius.vertical,nodeHorizontalRadius:r.nodeContainingRadius.horizontal}),jt=r=>{var e,t;return{onAfterNodeDetached:((e=r==null?void 0:r.events)==null?void 0:e.onAfterNodeDetached)??(()=>{}),onBeforeNodeAttached:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeNodeAttached)??(()=>{})}};class Oe extends Error{constructor(){super(...arguments);o(this,"name","CanvasBuilderError")}}const A=Object.freeze({seed:"HTMLGraph is awesome",maxTimeDeltaSec:.01,nodeCharge:1e5,nodeMass:1,edgeEquilibriumLength:300,edgeStiffness:1e3,dtSec:.01,maxIterations:1e3,convergenceVelocity:10,maxForce:1e7,nodeForceCoefficient:1,barnesHutAreaRadiusThreshold:.01,barnesHutTheta:1});class We{constructor(e,t,s){o(this,"dt");o(this,"nodeMass");o(this,"edgeEquilibriumLength");o(this,"edgeStiffness");o(this,"nodeForcesApplicationStrategy");o(this,"distanceVectorGenerator");this.graph=e,this.currentCoords=t,this.dt=s.dtSec,this.nodeMass=s.nodeMass,this.edgeEquilibriumLength=s.edgeEquilibriumLength,this.edgeStiffness=s.edgeStiffness,this.distanceVectorGenerator=s.distanceVectorGenerator,this.nodeForcesApplicationStrategy=s.nodeForcesApplicationStrategy}apply(){let e=0;const t=new Map;return this.graph.getAllNodeIds().forEach(i=>{t.set(i,{x:0,y:0})}),this.nodeForcesApplicationStrategy.apply(this.currentCoords,t),this.applyEdgeForces(t),this.currentCoords.forEach((i,n)=>{const a=t.get(n),h={x:a.x/this.nodeMassthis.dt,y:a.y/this.nodeMassthis.dt};e=Math.max(e,Math.sqrt(h.xh.x+h.yh.y));const d=h.xthis.dt,c=h.ythis.dt;i.x+=d,i.y+=c}),e}applyEdgeForces(e){this.graph.getAllEdgeIds().forEach(t=>{const s=this.graph.getEdge(t),i=this.graph.getPort(s.from),n=this.graph.getPort(s.to),a=this.currentCoords.get(i.nodeId),h=this.currentCoords.get(n.nodeId),d=this.distanceVectorGenerator.create(a,h),g=(d.d-this.edgeEquilibriumLength)this.edgeStiffness,l=d.exg,u=d.eyg,w=e.get(i.nodeId),y=e.get(n.nodeId);w.x+=l,w.y+=u,y.x-=l,y.y-=u})}}class ze{constructor(e){o(this,"PI2",2Math.PI);this.rand=e}create(e,t){const s=t.x-e.x,i=t.y-e.y,n=ss+ii;if(n===0){const c=this.PI2this.rand();return{ex:Math.cos(c),ey:Math.sin(c),d:0}}const a=Math.sqrt(n),h=s/a,d=i/a;return{ex:h,ey:d,d:a}}}const ke=r=>{if(r.distance===0)return r.maxForce;const e=r.coefficient(r.sourceCharger.targetCharge/(r.distancer.distance));return Math.min(e,r.maxForce)};class Kt{constructor(e){o(this,"nodeCharge");o(this,"distanceVectorGenerator");o(this,"maxForce");this.nodeCharge=e.nodeCharge,this.distanceVectorGenerator=e.distanceVectorGenerator,this.maxForce=e.maxForce}apply(e,t){const s=Array.from(t.keys()),i=s.length;for(let n=0;n<i;n++){const a=s[n];for(let h=n+1;h<i;h++){const d=s[h],c=e.get(a),g=e.get(d),l=this.distanceVectorGenerator.create(c,g),u=ke({coefficient:1,sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,distance:l.d,maxForce:this.maxForce}),w=ul.ex,y=ul.ey,b=t.get(a),P=t.get(d);b.x-=w,b.y-=y,P.x+=w,P.y+=y}}}}const Qt=r=>{if(r.size===0)return{centerX:0,centerY:0,radius:0};let e=1/0,t=-1/0,s=1/0,i=-1/0;r.forEach(d=>{e=Math.min(e,d.x),t=Math.max(t,d.x),s=Math.min(s,d.y),i=Math.max(i,d.y)});const n=t-e,a=i-s,h=Math.max(n,a);return{centerX:(e+t)/2,centerY:(s+i)/2,radius:h/2}};class Zt{constructor(e){o(this,"root");o(this,"leaves",new Map);o(this,"coords");o(this,"areaRadiusThreshold");o(this,"nodeMass");o(this,"nodeCharge");o(this,"sortedParentNodes",[]);this.coords=e.coords,this.areaRadiusThreshold=e.areaRadiusThreshold,this.nodeMass=e.nodeMass,this.nodeCharge=e.nodeCharge,this.root={nodeIds:new Set(e.coords.keys()),box:e.box,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},parent:null,lb:null,lt:null,rb:null,rt:null};let t=[this.root];for(;t.length>0;){const s=[];for(;t.length>0;){const i=t.pop();this.processNode(i).forEach(a=>{s.push(a)})}t=s}this.sortedParentNodes.reverse().forEach(s=>{let i=0,n=0,a=0,h=0;s.lb!==null&&(a+=s.lb.totalMass,h+=s.lb.totalCharge,i+=s.lb.chargeCenter.xs.lb.totalCharge,n+=s.lb.chargeCenter.ys.lb.totalCharge),s.lt!==null&&(a+=s.lt.totalMass,h+=s.lt.totalCharge,i+=s.lt.chargeCenter.xs.lt.totalCharge,n+=s.lt.chargeCenter.ys.lt.totalCharge),s.rb!==null&&(a+=s.rb.totalMass,h+=s.rb.totalCharge,i+=s.rb.chargeCenter.xs.rb.totalCharge,n+=s.rb.chargeCenter.ys.rb.totalCharge),s.rt!==null&&(a+=s.rt.totalMass,h+=s.rt.totalCharge,i+=s.rt.chargeCenter.xs.rt.totalCharge,n+=s.rt.chargeCenter.ys.rt.totalCharge),s.totalMass=a,s.totalCharge=h,s.chargeCenter.x=i/h,s.chargeCenter.y=n/h})}getRoot(){return this.root}getLeaf(e){return this.leaves.get(e)}processNode(e){if(e.nodeIds.size<2)return this.setLeaf(e),[];const{centerX:t,centerY:s,radius:i}=e.box;if(i<this.areaRadiusThreshold)return this.setLeaf(e),[];this.sortedParentNodes.push(e);const n=new Set,a=new Set,h=new Set,d=new Set,c=i/2;e.nodeIds.forEach(u=>{const{x:w,y}=this.coords.get(u);w<t?y<s?d.add(u):h.add(u):y<s?a.add(u):n.add(u),e.nodeIds.delete(u)});const g={parent:e,lb:null,lt:null,rb:null,rt:null},l=[];if(n.size>0){const u={nodeIds:n,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:s+c,radius:c},...g};e.rt=u,l.push(u)}if(a.size>0){const u={nodeIds:a,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:s-c,radius:c},...g};e.rb=u,l.push(u)}if(h.size>0){const u={nodeIds:h,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:s+c,radius:c},...g};e.lt=u,l.push(u)}if(d.size>0){const u={nodeIds:d,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:s-c,radius:c},...g};e.lb=u,l.push(u)}return l}setLeaf(e){e.totalMass=this.nodeMasse.nodeIds.size,e.totalCharge=this.nodeChargee.nodeIds.size,e.chargeCenter=this.calculateLeafChargeCenter(e.nodeIds),e.nodeIds.forEach(t=>{this.leaves.set(t,e)})}calculateLeafChargeCenter(e){if(e.size===0)return{x:0,y:0};let t=0,s=0;return e.forEach(i=>{const n=this.coords.get(i);t+=n.x,s+=n.y}),{x:t/e.size,y:s/e.size}}}class qt{constructor(e){o(this,"areaRadiusThreshold");o(this,"nodeMass");o(this,"nodeCharge");o(this,"theta");o(this,"distanceVectorGenerator");o(this,"nodeForceCoefficient");o(this,"maxForce");this.areaRadiusThreshold=e.areaRadiusThreshold,this.nodeMass=e.nodeMass,this.nodeCharge=e.nodeCharge,this.theta=e.theta,this.distanceVectorGenerator=e.distanceVectorGenerator,this.nodeForceCoefficient=e.nodeForceCoefficient,this.maxForce=e.maxForce}apply(e,t){const s=Qt(e),i=new Zt({box:s,coords:e,areaRadiusThreshold:this.areaRadiusThreshold,nodeMass:this.nodeMass,nodeCharge:this.nodeCharge});e.forEach((n,a)=>{const h=this.calculateForceForNode(i.getLeaf(a),a,e),d=t.get(a);this.applyForce(d,h)})}calculateForceForNode(e,t,s){const i=s.get(t),n={x:0,y:0};e.nodeIds.forEach(h=>{if(h!==t){const d=s.get(h),c=this.calculateNodeRepulsiveForce({sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,sourceCoords:d,targetCoords:i});this.applyForce(n,c)}});let a=e;for(;a!==null;){const h=a.parent;if(h!==null){const d=this.distanceVectorGenerator.create(h.chargeCenter,i);h.box.radius2<d.dthis.theta?(this.tryApplyFarForce({totalForce:n,targetCoords:i,target:h.lb,current:a}),this.tryApplyFarForce({totalForce:n,targetCoords:i,target:h.rb,current:a}),this.tryApplyFarForce({totalForce:n,targetCoords:i,target:h.rt,current:a}),this.tryApplyFarForce({totalForce:n,targetCoords:i,target:h.lt,current:a})):(this.tryApplyNearForce({totalForce:n,targetCoords:i,target:h.lb,current:a,nodesCoords:s}),this.tryApplyNearForce({totalForce:n,targetCoords:i,target:h.rb,current:a,nodesCoords:s}),this.tryApplyNearForce({totalForce:n,targetCoords:i,target:h.rt,current:a,nodesCoords:s}),this.tryApplyNearForce({totalForce:n,targetCoords:i,target:h.lt,current:a,nodesCoords:s}))}a=a.parent}return n}calculateExactForce(e,t,s){const i={x:0,y:0},n=[e];for(;n.length>0;){const a=n.pop();a.nodeIds.forEach(h=>{const d=s.get(h),c=this.calculateNodeRepulsiveForce({sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,sourceCoords:d,targetCoords:t});this.applyForce(i,c)}),a.lb!==null&&n.push(a.lb),a.rb!==null&&n.push(a.rb),a.lt!==null&&n.push(a.lt),a.rt!==null&&n.push(a.rt)}return i}calculateApproximateForce(e,t){return this.calculateNodeRepulsiveForce({sourceCharge:this.nodeCharge,targetCharge:e.totalCharge,sourceCoords:e.chargeCenter,targetCoords:t})}calculateNodeRepulsiveForce(e){const t=this.distanceVectorGenerator.create(e.sourceCoords,e.targetCoords),s=ke({coefficient:this.nodeForceCoefficient,sourceCharge:e.sourceCharge,targetCharge:e.targetCharge,distance:t.d,maxForce:this.maxForce});return{x:st.ex,y:st.ey}}applyForce(e,t){e.x+=t.x,e.y+=t.y}tryApplyFarForce(e){if(e.target!==null&&e.target!==e.current){const t=this.calculateApproximateForce(e.target,e.targetCoords);this.applyForce(e.totalForce,t)}}tryApplyNearForce(e){if(e.target!==null&&e.target!==e.current){const t=this.calculateExactForce(e.target,e.targetCoords,e.nodesCoords);this.applyForce(e.totalForce,t)}}}const He=r=>r.theta!==0?new qt({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce,theta:r.theta,nodeMass:r.nodeMass,areaRadiusThreshold:r.areaRadiusThreshold}):new Kt({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce});class Xe{constructor(e){o(this,"rand");o(this,"sparsity");this.rand=e.rand,this.sparsity=e.sparsity}calculateCoordinates(e){const{graph:t,viewport:s}=e,i=new Map,n=t.getAllNodeIds(),a=Math.sqrt(n.length)this.sparsity,{width:h,height:d}=s.getDimensions(),c={x:h/2,y:d/2},g=s.createContentCoords(c),l=a/2,u={x:g.x-l,y:g.y-l};return n.forEach(w=>{const y=t.getNode(w);i.set(w,{x:y.x??u.x+athis.rand(),y:y.y??u.y+a*this.rand()})}),i}}class Jt{constructor(e){o(this,"distanceVectorGenerator");o(this,"nodeForcesApplicationStrategy");o(this,"fillerLayoutAlgorithm");o(this,"maxIterations");o(this,"dtSec");o(this,"nodeMass");o(this,"edgeEquilibriumLength");o(this,"edgeStiffness");o(this,"convergenceVelocity");this.maxIterations=e.maxIterations,this.dtSec=e.dtSec,this.nodeMass=e.nodeMass,this.edgeEquilibriumLength=e.edgeEquilibriumLength,this.edgeStiffness=e.edgeStiffness,this.convergenceVelocity=e.convergenceVelocity,this.distanceVectorGenerator=new ze(e.rand),this.nodeForcesApplicationStrategy=He({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new Xe({rand:e.rand,sparsity:e.edgeEquilibriumLength})}calculateCoordinates(e){const{graph:t,viewport:s}=e,i=this.fillerLayoutAlgorithm.calculateCoordinates({graph:t,viewport:s});for(let n=0;n<this.maxIterations&&!(new We(t,i,{distanceVectorGenerator:this.distanceVectorGenerator,nodeForcesApplicationStrategy:this.nodeForcesApplicationStrategy,dtSec:this.dtSec,nodeMass:this.nodeMass,edgeEquilibriumLength:this.edgeEquilibriumLength,edgeStiffness:this.edgeStiffness}).apply()<this.convergenceVelocity);n++);return i}}class _t{constructor(e){o(this,"distanceVectorGenerator");o(this,"nodeForcesApplicationStrategy");o(this,"convergenceVelocity");o(this,"maxTimeDeltaSec");o(this,"nodeMass");o(this,"edgeEquilibriumLength");o(this,"edgeStiffness");o(this,"fillerLayoutAlgorithm");this.convergenceVelocity=e.convergenceVelocity,this.maxTimeDeltaSec=e.maxTimeDeltaSec,this.nodeMass=e.nodeMass,this.edgeEquilibriumLength=e.edgeEquilibriumLength,this.edgeStiffness=e.edgeStiffness,this.distanceVectorGenerator=new ze(e.rand),this.nodeForcesApplicationStrategy=He({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new Xe({rand:e.rand,sparsity:e.edgeEquilibriumLength})}calculateNextCoordinates(e){const{graph:t,viewport:s,dt:i}=e,n=this.fillerLayoutAlgorithm.calculateCoordinates({graph:t,viewport:s});return new We(t,n,{distanceVectorGenerator:this.distanceVectorGenerator,nodeForcesApplicationStrategy:this.nodeForcesApplicationStrategy,dtSec:Math.min(i,this.maxTimeDeltaSec),nodeMass:this.nodeMass,edgeEquilibriumLength:this.edgeEquilibriumLength,edgeStiffness:this.edgeStiffness}).apply()<this.convergenceVelocity&&!t.getAllNodeIds().some(c=>{const g=t.getNode(c);return g.x===null\|\|g.y===null})?new Map:n}}const Ye=r=>{let e=1779033703,t=3144134277,s=1013904242,i=2773480762;for(let n=0,a;n<r.length;n++)a=r.charCodeAt(n),e=t^Math.imul(e^a,597399067),t=s^Math.imul(t^a,2869860233),s=i^Math.imul(s^a,951274213),i=e^Math.imul(i^a,2716044179);return e=Math.imul(s^e>>>18,597399067),t=Math.imul(i^t>>>22,2869860233),s=Math.imul(e^s>>>17,951274213),i=Math.imul(t^i>>>19,2716044179),e^=t^s^i,t^=e,s^=e,i^=e,[e>>>0,t>>>0,s>>>0,i>>>0]},Ge=(r,e,t,s)=>function(){r\|=0,e\|=0,t\|=0,s\|=0;const i=(r+e\|0)+s\|0;return s=s+1\|0,r=e^e>>>9,e=t+(t<<3)\|0,t=t<<21\|t>>>11,t=t+i\|0,(i>>>0)/4294967296},er=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const s=Ye((r==null?void 0:r.seed)??A.seed),i=Ge(s[0],s[1],s[2],s[3]);return new _t({rand:i,maxTimeDeltaSec:(r==null?void 0:r.maxTimeDeltaSec)??A.maxTimeDeltaSec,nodeCharge:(r==null?void 0:r.nodeCharge)??A.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??A.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??A.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??A.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??A.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??A.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??A.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??A.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??A.barnesHutAreaRadiusThreshold})}}},de={staticNodeResolver:()=>!1,onBeforeApplied:()=>{},onAfterApplied:()=>{}},tr=r=>{var t,s;return{algorithm:er((r==null?void 0:r.algorithm)??{}),staticNodeResolver:(r==null?void 0:r.staticNodeResolver)??de.staticNodeResolver,onBeforeApplied:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeApplied)??de.onBeforeApplied,onAfterApplied:((s=r==null?void 0:r.events)==null?void 0:s.onAfterApplied)??de.onAfterApplied}},rr=r=>r instanceof $?{type:"manual",trigger:r}:(r==null?void 0:r.type)==="topologyChangeMacrotask"?{type:"topologyChangeMacrotask"}:{type:"topologyChangeMicrotask"},sr=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const s=Ye((r==null?void 0:r.seed)??A.seed),i=Ge(s[0],s[1],s[2],s[3]);return new Jt({dtSec:(r==null?void 0:r.dtSec)??A.dtSec,maxIterations:(r==null?void 0:r.maxIterations)??A.maxIterations,rand:i,nodeCharge:(r==null?void 0:r.nodeCharge)??A.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??A.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??A.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??A.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??A.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??A.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??A.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??A.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??A.barnesHutAreaRadiusThreshold})}}},ce={staticNodeResolver:()=>!1,onBeforeApplied:()=>{},onAfterApplied:()=>{}},or=r=>{var e,t;return{algorithm:sr(r==null?void 0:r.algorithm),applyOn:rr(r==null?void 0:r.applyOn),staticNodeResolver:(r==null?void 0:r.staticNodeResolver)??ce.staticNodeResolver,onBeforeApplied:((e=r==null?void 0:r.events)==null?void 0:e.onBeforeApplied)??ce.onBeforeApplied,onAfterApplied:((t=r==null?void 0:r.events)==null?void 0:t.onAfterApplied)??ce.onAfterApplied}},ir=(r,e)=>({...r,onNodeDragStarted:t=>{e.add(t),r.onNodeDragStarted(t)},onNodeDragFinished:t=>{e.delete(t),r.onNodeDragFinished(t)}}),nr=(r,e)=>{r.onBeforeNodeRemoved.subscribe(t=>{e.delete(t)}),r.onBeforeClear.subscribe(()=>{e.clear()})},ar=(r,e)=>({...r,staticNodeResolver:t=>r.staticNodeResolver(t)\|\|e.has(t)});class hr{constructor(e){o(this,"used",!1);o(this,"canvasDefaults",{});o(this,"dragConfig",{});o(this,"transformConfig",{});o(this,"backgroundConfig",{});o(this,"connectablePortsConfig",{});o(this,"draggableEdgesConfig",{});o(this,"virtualScrollConfig");o(this,"layoutConfig",{});o(this,"animatedLayoutConfig",{});o(this,"hasDraggableNodes",!1);o(this,"hasTransformableViewport",!1);o(this,"hasNodeResizeReactiveEdges",!1);o(this,"hasBackground",!1);o(this,"hasUserConnectablePorts",!1);o(this,"hasUserDraggableEdges",!1);o(this,"hasAnimatedLayout",!1);o(this,"hasLayout",!1);o(this,"boxRenderingTrigger",new $);o(this,"graphStore");o(this,"viewportStore");o(this,"graph");o(this,"viewport");o(this,"window",window);o(this,"animationStaticNodes",new Set);this.element=e,this.viewportStore=new st(this.element),this.viewport=new Ve(this.viewportStore),this.graphStore=new ue,this.graph=new Re(this.graphStore)}setDefaults(e){return this.canvasDefaults=e,this}enableUserDraggableNodes(e){return this.hasDraggableNodes=!0,this.dragConfig=e??{},this}enableUserTransformableViewport(e){return this.hasTransformableViewport=!0,this.transformConfig=e??{},this}enableNodeResizeReactiveEdges(){return this.hasNodeResizeReactiveEdges=!0,this}enableVirtualScroll(e){return this.virtualScrollConfig=e,this}enableBackground(e){return this.hasBackground=!0,this.backgroundConfig=e??{},this}enableUserConnectablePorts(e){return this.hasUserConnectablePorts=!0,this.connectablePortsConfig=e??{},this}enableUserDraggableEdges(e){return this.hasUserDraggableEdges=!0,this.draggableEdgesConfig=e??{},this}enableLayout(e){return this.layoutConfig=e??{},this.hasLayout=!0,this.hasAnimatedLayout=!1,this}enableAnimatedLayout(e){return this.animatedLayoutConfig=e??{},this.hasAnimatedLayout=!0,this.hasLayout=!1,this}build(){if(this.used)throw new Oe("CanvasBuilder is a single use object");this.used=!0;const e=new Vt(this.element),t=this.createHtmlView(e.main),s=Bt(this.canvasDefaults),i=new ge(this.graph,this.viewport,this.graphStore,this.viewportStore,t,s);if(this.hasBackground&&te.configure(i,Ht(this.backgroundConfig),e.background),this.hasNodeResizeReactiveEdges&&K.configure(i),this.hasDraggableNodes){let a=$t(this.dragConfig);this.hasAnimatedLayout&&(a=ir(a,this.animationStaticNodes)),_.configure(i,e.main,this.window,a)}if(this.hasUserConnectablePorts){const a=Xt(this.connectablePortsConfig,s.edges.shapeFactory,s.ports.direction);re.configure(i,e.overlayConnectablePorts,this.viewportStore,this.window,a)}if(this.hasUserDraggableEdges){const a=Yt(this.draggableEdgesConfig,i.graph);se.configure(i,e.overlayDraggableEdges,this.viewportStore,this.window,a)}if(this.virtualScrollConfig!==void 0?ee.configure(i,e.main,this.window,Ue(this.transformConfig),this.boxRenderingTrigger,Gt(this.virtualScrollConfig)):this.hasTransformableViewport&&Y.configure(i,e.main,this.window,Ue(this.transformConfig)),this.hasLayout&&Mt.configure(i,or(this.layoutConfig)),this.hasAnimatedLayout){let a=tr(this.animatedLayoutConfig);this.hasDraggableNodes&&(nr(i.graph,this.animationStaticNodes),a=ar(a,this.animationStaticNodes)),ie.configure(i,a,this.window)}const n=()=>{e.destroy(),i.onBeforeDestroy.unsubscribe(n)};return i.onBeforeDestroy.subscribe(n),i}createHtmlView(e){let t=new le(this.graphStore,this.viewportStore,e);return this.virtualScrollConfig!==void 0&&(t=new et(t,this.graphStore,this.boxRenderingTrigger,jt(this.virtualScrollConfig))),new tt(t,this.graphStore)}}v.BezierEdgeShape=Ne,v.CanvasBuilder=hr,v.CanvasBuilderError=Oe,v.CanvasError=E,v.ConnectionCategory=x,v.DirectEdgeShape=q,v.EventSubject=$,v.HorizontalEdgeShape=Te,v.InteractiveEdgeError=Le,v.InteractiveEdgeShape=J,v.MidpointEdgeShape=xt,v.StraightEdgeShape=Ce,v.VerticalEdgeShape=De,Object.defineProperty(v,Symbol.toStringTag,{value:"Module"})});

package/package.json CHANGED Viewed

@@ -2,7 +2,7 @@
   "name": "@html-graph/html-graph",
   "author": "Dmitry Marov <d.marov94@gmail.com>",
   "private": false,
-  "version": "8.1.0",
+  "version": "8.3.0",
   "type": "module",
   "main": "dist/html-graph.js",
   "types": "dist/html-graph.d.ts",