@html-graph/html-graph 8.14.0 → 8.15.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/html-graph.d.ts +3 -1
- package/dist/html-graph.js +37 -13
- package/dist/html-graph.min.js +38 -16
- package/dist/html-graph.min.umd.cjs +1 -1
- package/dist/html-graph.umd.cjs +37 -13
- package/package.json +1 -1
package/dist/html-graph.d.ts
CHANGED
|
@@ -371,7 +371,9 @@ declare interface DraggableEdgesConfig {
|
|
|
371
371
|
readonly draggingEdgeShape?: EdgeShapeConfig;
|
|
372
372
|
readonly events?: {
|
|
373
373
|
readonly onAfterEdgeReattached?: (edgeId: Identifier) => void;
|
|
374
|
-
readonly onEdgeReattachInterrupted?: (edge: GraphEdge
|
|
374
|
+
readonly onEdgeReattachInterrupted?: (edge: GraphEdge & {
|
|
375
|
+
readonly id: Identifier;
|
|
376
|
+
}) => void;
|
|
375
377
|
readonly onEdgeReattachPrevented?: (request: AddEdgeRequest) => void;
|
|
376
378
|
};
|
|
377
379
|
}
|
package/dist/html-graph.js
CHANGED
|
@@ -3304,6 +3304,7 @@ class DraggablePortsConfigurator {
|
|
|
3304
3304
|
event.clientY
|
|
3305
3305
|
);
|
|
3306
3306
|
if (!isInside) {
|
|
3307
|
+
this.params.onPointerMoveOutside();
|
|
3307
3308
|
this.stopMouseDrag();
|
|
3308
3309
|
return;
|
|
3309
3310
|
}
|
|
@@ -3349,6 +3350,7 @@ class DraggablePortsConfigurator {
|
|
|
3349
3350
|
touch.clientY
|
|
3350
3351
|
);
|
|
3351
3352
|
if (!isInside) {
|
|
3353
|
+
this.params.onPointerMoveOutside();
|
|
3352
3354
|
this.stopTouchDrag();
|
|
3353
3355
|
return;
|
|
3354
3356
|
}
|
|
@@ -4212,6 +4214,9 @@ class UserConnectablePortsConfigurator {
|
|
|
4212
4214
|
onPointerMove: (cursor) => {
|
|
4213
4215
|
this.moveDraggingPort(cursor);
|
|
4214
4216
|
},
|
|
4217
|
+
onPointerMoveOutside: () => {
|
|
4218
|
+
this.handleEdgeCreationInterrupted();
|
|
4219
|
+
},
|
|
4215
4220
|
onPointerUp: (cursor) => {
|
|
4216
4221
|
this.tryCreateConnection(cursor);
|
|
4217
4222
|
}
|
|
@@ -4270,14 +4275,11 @@ class UserConnectablePortsConfigurator {
|
|
|
4270
4275
|
}
|
|
4271
4276
|
tryCreateConnection(cursor) {
|
|
4272
4277
|
const draggingPortId = findPortAtPoint(this.canvas.graph, cursor);
|
|
4273
|
-
const staticPortId = this.staticPortId;
|
|
4274
4278
|
if (draggingPortId === null) {
|
|
4275
|
-
this.
|
|
4276
|
-
staticPortId,
|
|
4277
|
-
isDirect: this.isTargetDragging
|
|
4278
|
-
});
|
|
4279
|
+
this.handleEdgeCreationInterrupted();
|
|
4279
4280
|
return;
|
|
4280
4281
|
}
|
|
4282
|
+
const staticPortId = this.staticPortId;
|
|
4281
4283
|
const sourceId = this.isTargetDragging ? staticPortId : draggingPortId;
|
|
4282
4284
|
const targetId = this.isTargetDragging ? draggingPortId : staticPortId;
|
|
4283
4285
|
const request = { from: sourceId, to: targetId };
|
|
@@ -4301,6 +4303,13 @@ class UserConnectablePortsConfigurator {
|
|
|
4301
4303
|
y: nodeContentCoords.y
|
|
4302
4304
|
});
|
|
4303
4305
|
}
|
|
4306
|
+
handleEdgeCreationInterrupted() {
|
|
4307
|
+
const staticPortId = this.staticPortId;
|
|
4308
|
+
this.params.onEdgeCreationInterrupted({
|
|
4309
|
+
staticPortId,
|
|
4310
|
+
isDirect: this.isTargetDragging
|
|
4311
|
+
});
|
|
4312
|
+
}
|
|
4304
4313
|
}
|
|
4305
4314
|
class UserDraggableEdgesConfigurator {
|
|
4306
4315
|
constructor(canvas, overlayLayer, viewportStore, window2, pointInsideVerifier, params) {
|
|
@@ -4338,6 +4347,18 @@ class UserDraggableEdgesConfigurator {
|
|
|
4338
4347
|
onPointerMove: (cursor) => {
|
|
4339
4348
|
this.moveDraggingPort(cursor);
|
|
4340
4349
|
},
|
|
4350
|
+
onPointerMoveOutside: () => {
|
|
4351
|
+
const edge = this.draggingEdgePayload;
|
|
4352
|
+
queueMicrotask(() => {
|
|
4353
|
+
this.params.onEdgeReattachInterrupted({
|
|
4354
|
+
id: edge.id,
|
|
4355
|
+
from: edge.from,
|
|
4356
|
+
to: edge.to,
|
|
4357
|
+
shape: edge.shape,
|
|
4358
|
+
priority: edge.priority
|
|
4359
|
+
});
|
|
4360
|
+
});
|
|
4361
|
+
},
|
|
4341
4362
|
onPointerUp: (cursor) => {
|
|
4342
4363
|
this.tryCreateConnection(cursor);
|
|
4343
4364
|
}
|
|
@@ -4433,14 +4454,7 @@ class UserDraggableEdgesConfigurator {
|
|
|
4433
4454
|
const draggingPortId = findPortAtPoint(this.canvas.graph, cursor);
|
|
4434
4455
|
this.overlayCanvas.removeEdge(OverlayId.EdgeId);
|
|
4435
4456
|
if (draggingPortId === null) {
|
|
4436
|
-
|
|
4437
|
-
this.params.onEdgeReattachInterrupted({
|
|
4438
|
-
id: edge2.id,
|
|
4439
|
-
from: edge2.from,
|
|
4440
|
-
to: edge2.to,
|
|
4441
|
-
shape: edge2.shape,
|
|
4442
|
-
priority: edge2.priority
|
|
4443
|
-
});
|
|
4457
|
+
this.handleEdgeReattachInterrupted();
|
|
4444
4458
|
return;
|
|
4445
4459
|
}
|
|
4446
4460
|
const [from, to] = this.isTargetDragging ? [this.staticPortId, draggingPortId] : [draggingPortId, this.staticPortId];
|
|
@@ -4468,6 +4482,16 @@ class UserDraggableEdgesConfigurator {
|
|
|
4468
4482
|
});
|
|
4469
4483
|
}
|
|
4470
4484
|
}
|
|
4485
|
+
handleEdgeReattachInterrupted() {
|
|
4486
|
+
const edge = this.draggingEdgePayload;
|
|
4487
|
+
this.params.onEdgeReattachInterrupted({
|
|
4488
|
+
id: edge.id,
|
|
4489
|
+
from: edge.from,
|
|
4490
|
+
to: edge.to,
|
|
4491
|
+
shape: edge.shape,
|
|
4492
|
+
priority: edge.priority
|
|
4493
|
+
});
|
|
4494
|
+
}
|
|
4471
4495
|
}
|
|
4472
4496
|
class ManualLayoutApplicationStrategyConfigurator {
|
|
4473
4497
|
constructor(applier, trigger) {
|
package/dist/html-graph.min.js
CHANGED
|
@@ -2421,7 +2421,7 @@ class G {
|
|
|
2421
2421
|
e.clientX,
|
|
2422
2422
|
e.clientY
|
|
2423
2423
|
)) {
|
|
2424
|
-
this.stopMouseDrag();
|
|
2424
|
+
this.params.onPointerMoveOutside(), this.stopMouseDrag();
|
|
2425
2425
|
return;
|
|
2426
2426
|
}
|
|
2427
2427
|
this.params.onPointerMove({ x: e.clientX, y: e.clientY });
|
|
@@ -2451,7 +2451,7 @@ class G {
|
|
|
2451
2451
|
t.clientX,
|
|
2452
2452
|
t.clientY
|
|
2453
2453
|
)) {
|
|
2454
|
-
this.stopTouchDrag();
|
|
2454
|
+
this.params.onPointerMoveOutside(), this.stopTouchDrag();
|
|
2455
2455
|
return;
|
|
2456
2456
|
}
|
|
2457
2457
|
this.params.onPointerMove({ x: t.clientX, y: t.clientY });
|
|
@@ -3052,6 +3052,9 @@ class ne {
|
|
|
3052
3052
|
onPointerMove: (h) => {
|
|
3053
3053
|
this.moveDraggingPort(h);
|
|
3054
3054
|
},
|
|
3055
|
+
onPointerMoveOutside: () => {
|
|
3056
|
+
this.handleEdgeCreationInterrupted();
|
|
3057
|
+
},
|
|
3055
3058
|
onPointerUp: (h) => {
|
|
3056
3059
|
this.tryCreateConnection(h);
|
|
3057
3060
|
}
|
|
@@ -3098,15 +3101,12 @@ class ne {
|
|
|
3098
3101
|
this.staticPortId = null, this.isTargetDragging = !0, this.overlayCanvas.clear();
|
|
3099
3102
|
}
|
|
3100
3103
|
tryCreateConnection(e) {
|
|
3101
|
-
const t = Ce(this.canvas.graph, e)
|
|
3104
|
+
const t = Ce(this.canvas.graph, e);
|
|
3102
3105
|
if (t === null) {
|
|
3103
|
-
this.
|
|
3104
|
-
staticPortId: o,
|
|
3105
|
-
isDirect: this.isTargetDragging
|
|
3106
|
-
});
|
|
3106
|
+
this.handleEdgeCreationInterrupted();
|
|
3107
3107
|
return;
|
|
3108
3108
|
}
|
|
3109
|
-
const s = this.isTargetDragging ? o : t, n = this.isTargetDragging ? t : o, a = { from: s, to: n }, h = this.params.connectionPreprocessor(a);
|
|
3109
|
+
const o = this.staticPortId, s = this.isTargetDragging ? o : t, n = this.isTargetDragging ? t : o, a = { from: s, to: n }, h = this.params.connectionPreprocessor(a);
|
|
3110
3110
|
h !== null ? (this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeCreated), this.canvas.addEdge(h), this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeCreated)) : this.params.onEdgeCreationPrevented(a);
|
|
3111
3111
|
}
|
|
3112
3112
|
moveDraggingPort(e) {
|
|
@@ -3119,6 +3119,13 @@ class ne {
|
|
|
3119
3119
|
y: o.y
|
|
3120
3120
|
});
|
|
3121
3121
|
}
|
|
3122
|
+
handleEdgeCreationInterrupted() {
|
|
3123
|
+
const e = this.staticPortId;
|
|
3124
|
+
this.params.onEdgeCreationInterrupted({
|
|
3125
|
+
staticPortId: e,
|
|
3126
|
+
isDirect: this.isTargetDragging
|
|
3127
|
+
});
|
|
3128
|
+
}
|
|
3122
3129
|
}
|
|
3123
3130
|
class ae {
|
|
3124
3131
|
constructor(e, t, o, s, n, a) {
|
|
@@ -3147,6 +3154,18 @@ class ae {
|
|
|
3147
3154
|
onPointerMove: (h) => {
|
|
3148
3155
|
this.moveDraggingPort(h);
|
|
3149
3156
|
},
|
|
3157
|
+
onPointerMoveOutside: () => {
|
|
3158
|
+
const h = this.draggingEdgePayload;
|
|
3159
|
+
queueMicrotask(() => {
|
|
3160
|
+
this.params.onEdgeReattachInterrupted({
|
|
3161
|
+
id: h.id,
|
|
3162
|
+
from: h.from,
|
|
3163
|
+
to: h.to,
|
|
3164
|
+
shape: h.shape,
|
|
3165
|
+
priority: h.priority
|
|
3166
|
+
});
|
|
3167
|
+
});
|
|
3168
|
+
},
|
|
3150
3169
|
onPointerUp: (h) => {
|
|
3151
3170
|
this.tryCreateConnection(h);
|
|
3152
3171
|
}
|
|
@@ -3220,14 +3239,7 @@ class ae {
|
|
|
3220
3239
|
tryCreateConnection(e) {
|
|
3221
3240
|
const t = Ce(this.canvas.graph, e);
|
|
3222
3241
|
if (this.overlayCanvas.removeEdge(M.EdgeId), t === null) {
|
|
3223
|
-
|
|
3224
|
-
this.params.onEdgeReattachInterrupted({
|
|
3225
|
-
id: d.id,
|
|
3226
|
-
from: d.from,
|
|
3227
|
-
to: d.to,
|
|
3228
|
-
shape: d.shape,
|
|
3229
|
-
priority: d.priority
|
|
3230
|
-
});
|
|
3242
|
+
this.handleEdgeReattachInterrupted();
|
|
3231
3243
|
return;
|
|
3232
3244
|
}
|
|
3233
3245
|
const [o, s] = this.isTargetDragging ? [this.staticPortId, t] : [t, this.staticPortId], n = this.draggingEdgePayload, a = {
|
|
@@ -3250,6 +3262,16 @@ class ae {
|
|
|
3250
3262
|
});
|
|
3251
3263
|
}
|
|
3252
3264
|
}
|
|
3265
|
+
handleEdgeReattachInterrupted() {
|
|
3266
|
+
const e = this.draggingEdgePayload;
|
|
3267
|
+
this.params.onEdgeReattachInterrupted({
|
|
3268
|
+
id: e.id,
|
|
3269
|
+
from: e.from,
|
|
3270
|
+
to: e.to,
|
|
3271
|
+
shape: e.shape,
|
|
3272
|
+
priority: e.priority
|
|
3273
|
+
});
|
|
3274
|
+
}
|
|
3253
3275
|
}
|
|
3254
3276
|
class he {
|
|
3255
3277
|
constructor(e, t) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(A,T){typeof exports=="object"&&typeof module<"u"?T(exports):typeof define=="function"&&define.amd?define(["exports"],T):(A=typeof globalThis<"u"?globalThis:A||self,T(A.HtmlGraph={}))})(this,function(A){"use strict";var Br=Object.defineProperty;var Wr=(A,T,I)=>T in A?Br(A,T,{enumerable:!0,configurable:!0,writable:!0,value:I}):A[T]=I;var i=(A,T,I)=>Wr(A,typeof T!="symbol"?T+"":T,I);var T=(r=>(r.Line="line",r.NodeCycle="node-cycle",r.PortCycle="port-cycle",r))(T||{});const I=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r.style.overflow="hidden",r},st=()=>{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},it=r=>{r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.visibility="hidden"},nt=r=>{r.style.removeProperty("position"),r.style.removeProperty("top"),r.style.removeProperty("left"),r.style.removeProperty("visibility"),r.style.removeProperty("transform")};class ve{constructor(e,t,o){i(this,"host",I());i(this,"container",st());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);it(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);nt(t.element),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.clear(),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-n*h.x,c=a.y-n*h.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),u=this.createEdgeRenderPort(s,a,h,d);let g=T.Line;o.element===s.element?g=T.PortCycle:o.nodeId===s.nodeId&&(g=T.NodeCycle),t.payload.shape.render({from:c,to:u,category:g})}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.width*s,height:t.height*s,direction:e.payload.direction}}}class at{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),u=Math.max(n.y,a.y);return h<=this.xTo&&d>=this.xFrom&&c<=this.yTo&&u>=this.yFrom}}class ht{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),u=this.graphStore.getPort(c.from).nodeId,g=this.graphStore.getPort(c.to).nodeId;h&&(this.renderingBox.hasNode(u)||(t.add(u),o.delete(u)),this.renderingBox.hasNode(g)||(t.add(g),o.delete(g))),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 at(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 dt{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 k{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 C=()=>{const r=new k;return[r,r]};class me{constructor(e,t,o,s){i(this,"beforeDestroyEmitter");i(this,"destroyed",!1);i(this,"onBeforeDestroy");this.graph=e,this.viewport=t,this.graphController=o,this.viewportController=s,[this.beforeDestroyEmitter,this.onBeforeDestroy]=C()}addNode(e){return this.graphController.addNode(e),this}updateNode(e,t){return this.graphController.updateNode(e,t),this}removeNode(e){return this.graphController.removeNode(e),this}markPort(e){return this.graphController.markPort(e),this}updatePort(e,t){return this.graphController.updatePort(e,t),this}unmarkPort(e){return this.graphController.unmarkPort(e),this}addEdge(e){return this.graphController.addEdge(e),this}updateEdge(e,t){return this.graphController.updateEdge(e,t),this}removeEdge(e){return this.graphController.removeEdge(e),this}clear(){return this.graphController.clear(),this}focus(e){return this.viewportController.focus(e),this}center(e,t){return this.viewportController.center(e,t),this}patchViewportMatrix(e){return this.viewportController.patchViewportMatrix(e),this}patchContentMatrix(e){return this.viewportController.patchContentMatrix(e),this}destroy(){this.destroyed||(this.destroyed=!0,this.beforeDestroyEmitter.emit(),this.graphController.destroy(),this.viewportController.destroy())}}class ct{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 S extends Error{constructor(){super(...arguments);i(this,"name","CanvasError")}}const b=Object.freeze({accessNonexistingNode:r=>`Failed to access node with ID ${JSON.stringify(r)} because it does not exist`,addNodeWithExistingId:r=>`Failed to add node with ID ${JSON.stringify(r)} because a node with this ID already exists`,addNodeWithElementInUse:(r,e)=>`Failed to add node with ID ${JSON.stringify(r)} because its HTML element is already attached to node with ID ${JSON.stringify(e)}`,updateNonexistentNode:r=>`Failed to update node with ID ${JSON.stringify(r)} because it does not exist`,removeNonexistentNode:r=>`Failed to remove node with ID ${JSON.stringify(r)} because it does not exist`,accessNonexistentPort:r=>`Failed to access port with ID ${JSON.stringify(r)} because it does not exist`,addPortWithExistingId:r=>`Failed to add port with ID ${JSON.stringify(r)} because a port with this ID already exists`,addPortToNonexistentNode:(r,e)=>`Failed to add port with ID ${JSON.stringify(r)} to node with ID ${JSON.stringify(e)} because the node does not exist`,updateNonexistentPort:r=>`Failed to update port with ID ${JSON.stringify(r)} because it does not exist`,accessPortsOfNonexistentNode:r=>`Failed to access ports of node with ID ${JSON.stringify(r)} because the node does not exist`,removeNonexistentPort:r=>`Failed to remove port with ID ${JSON.stringify(r)} because it does not exist`,accessNonexistentEdge:r=>`Failed to access edge with ID ${JSON.stringify(r)} because it does not exist`,addEdgeWithExistingId:r=>`Failed to add edge with ID ${JSON.stringify(r)} because an edge with this ID already exists`,addEdgeFromNonexistentPort:(r,e)=>`Failed to add edge with ID ${JSON.stringify(r)} from port with ID ${JSON.stringify(e)} because the port does not exist`,addEdgeToNonexistentPort:(r,e)=>`Failed to add edge with ID ${JSON.stringify(r)} to port with ID ${JSON.stringify(e)} because the port does not exist`,updateNonexistentEdge:r=>`Failed to update edge with ID ${JSON.stringify(r)} because it does not exist`,updateNonexistentEdgeSource:(r,e)=>`Failed to update source of edge with ID ${JSON.stringify(r)} because source port with ID ${JSON.stringify(e)} does not exist`,updateNonexistentEdgeTarget:(r,e)=>`Failed to update target of edge with ID ${JSON.stringify(r)} because target port with ID ${JSON.stringify(e)} does not exist`,removeNonexistentEdge:r=>`Failed to remove edge with ID ${JSON.stringify(r)} because it does not exist`,accessEdgesForNonexistentPort:r=>`Failed to access edges for port with ID ${JSON.stringify(r)} because the port does not exist`});class xe{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,"portOutgoingEdges",new Map);i(this,"portCycleEdges",new Map);i(this,"elementPorts",new ct);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]=C(),[this.afterNodeUpdatedEmitter,this.onAfterNodeUpdated]=C(),[this.afterNodePriorityUpdatedEmitter,this.onAfterNodePriorityUpdated]=C(),[this.beforeNodeRemovedEmitter,this.onBeforeNodeRemoved]=C(),[this.afterPortAddedEmitter,this.onAfterPortAdded]=C(),[this.afterPortUpdatedEmitter,this.onAfterPortUpdated]=C(),[this.beforePortRemovedEmitter,this.onBeforePortRemoved]=C(),[this.afterEdgeAddedEmitter,this.onAfterEdgeAdded]=C(),[this.afterEdgeShapeUpdatedEmitter,this.onAfterEdgeShapeUpdated]=C(),[this.afterEdgeUpdatedEmitter,this.onAfterEdgeUpdated]=C(),[this.afterEdgePriorityUpdatedEmitter,this.onAfterEdgePriorityUpdated]=C(),[this.beforeEdgeRemovedEmitter,this.onBeforeEdgeRemoved]=C(),[this.beforeClearEmitter,this.onBeforeClear]=C()}hasNode(e){return this.nodes.has(e)}getNode(e){const t=this.nodes.get(e);if(t===void 0)throw new S(b.accessNonexistingNode(e));return t}addNode(e){if(this.hasNode(e.id))throw new S(b.addNodeWithExistingId(e.id));const t=this.findNodeIdByElement(e.element);if(t!==void 0)throw new S(b.addNodeWithElementInUse(e.id,t));const o=new Map,s={element:e.element,payload:{x:e.x,y:e.y,centerFn:e.centerFn,priority:e.priority},ports:o};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 S(b.updateNonexistentNode(e));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){if(!this.hasNode(e))throw new S(b.removeNonexistentNode(e));this.beforeNodeRemovedEmitter.emit(e);const t=this.getNode(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 S(b.accessNonexistentPort(e));return t}addPort(e){if(this.hasPort(e.id))throw new S(b.addPortWithExistingId(e.id));if(!this.hasNode(e.nodeId))throw new S(b.addPortToNonexistentNode(e.id,e.nodeId));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.portOutgoingEdges.set(e.id,new Set),this.getNode(e.nodeId).ports.set(e.id,e.element),this.afterPortAddedEmitter.emit(e.id)}updatePort(e,t){if(!this.hasPort(e))throw new S(b.updateNonexistentPort(e));const o=this.getPort(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 S(b.accessPortsOfNonexistentNode(e));return Array.from(t.ports.keys())}removePort(e){if(!this.hasPort(e))throw new S(b.removeNonexistentPort(e));const t=this.getPort(e).nodeId;this.beforePortRemovedEmitter.emit(e),this.getNode(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 S(b.accessNonexistentEdge(e));return t}addEdge(e){if(this.hasEdge(e.id))throw new S(b.addEdgeWithExistingId(e.id));if(!this.hasPort(e.from))throw new S(b.addEdgeFromNonexistentPort(e.id,e.from));if(!this.hasPort(e.to))throw new S(b.addEdgeToNonexistentPort(e.id,e.to));this.addEdgeInternal(e),this.afterEdgeAddedEmitter.emit(e.id)}updateEdge(e,t){if(!this.hasEdge(e))throw new S(b.updateNonexistentEdge(e));if(t.from!==void 0||t.to!==void 0){if(t.from!==void 0&&!this.hasPort(t.from))throw new S(b.updateNonexistentEdgeSource(e,t.from));if(t.to!==void 0&&!this.hasPort(t.to))throw new S(b.updateNonexistentEdgeTarget(e,t.to));const s=this.getEdge(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){if(!this.hasEdge(e))throw new S(b.removeNonexistentEdge(e));this.beforeEdgeRemovedEmitter.emit(e),this.removeEdgeInternal(e)}clear(){this.beforeClearEmitter.emit(),this.portIncomingEdges.clear(),this.portOutgoingEdges.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 S(b.accessEdgesForNonexistentPort(e));return Array.from(t)}getPortOutgoingEdgeIds(e){const t=this.portOutgoingEdges.get(e);if(t===void 0)throw new S(b.accessEdgesForNonexistentPort(e));return Array.from(t)}getPortCycleEdgeIds(e){const t=this.portCycleEdges.get(e);if(t===void 0)throw new S(b.accessEdgesForNonexistentPort(e));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.portOutgoingEdges.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{from:t,to:o}=this.getEdge(e);this.portCycleEdges.get(t).delete(e),this.portCycleEdges.get(o).delete(e),this.portIncomingEdges.get(t).delete(e),this.portIncomingEdges.get(o).delete(e),this.portOutgoingEdges.get(t).delete(e),this.portOutgoingEdges.get(o).delete(e),this.edges.delete(e)}}const Ee=r=>({scale:1/r.scale,x:-r.x/r.scale,y:-r.y/r.scale}),Ae={scale:1,x:0,y:0},Se=(r,e)=>({x:r.scale*e.x+r.x,y:r.scale*e.y+r.y});class lt{constructor(e){i(this,"viewportMatrix",Ae);i(this,"contentMatrix",Ae);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]=C(),[this.beforeUpdateEmitter,this.onBeforeUpdated]=C(),[this.afterResizeEmitter,this.onAfterResize]=C(),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=Ee(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=Ee(this.contentMatrix),this.afterUpdateEmitter.emit()}getDimensions(){const{width:e,height:t}=this.host.getBoundingClientRect();return{width:e,height:t}}createContentCoords(e){return Se(this.viewportMatrix,e)}createViewportCoords(e){return Se(this.contentMatrix,e)}destroy(){this.observer.disconnect()}}class Z{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,"reset",()=>{this.nodesResizeObserver.disconnect(),this.elementToNodeId.clear()});i(this,"revert",()=>{this.reset()});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.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e){new Z(e)}handleNodeResize(e){const t=this.elementToNodeId.get(e);this.canvas.updateNode(t)}}const ut=(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},gt=(r,e,t)=>e>=0&&e<=r.innerWidth&&t>=0&&t<=r.innerHeight;class pt{constructor(e,t){this.element=e,this.win=t}verify(e,t){return ut(this.element,e,t)&>(this.win,e,t)}}const Y=(r,e)=>{e!==null?r.style.cursor=e:r.style.removeProperty("cursor")},X=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}]}},wt=(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"}};function*Ne(r,e){const t=r.elementsFromPoint(e.x,e.y);for(const o of t){if(o.shadowRoot!==null){const s=Ne(o.shadowRoot,e);for(const n of s)yield n}yield o}}const be=(r,e)=>{const t=Ne(document,e);for(const o of t){const s=wt(r,o);if(s.status==="portFound")return s.portId;if(s.status==="nodeEncountered")return null}return null};var L=(r=>(r.StaticNodeId="static",r.DraggingNodeId="dragging",r.EdgeId="edge",r))(L||{});const Pe=(r,e)=>({x:r/2,y:e/2}),m=(r,e,t)=>({x:e.x*r.x-e.y*r.y+((1-e.x)*t.x+e.y*t.y),y:e.y*r.x+e.x*r.y+((1-e.x)*t.y-e.y*t.x)}),Te=(r,e,t)=>{const o={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},n=Math.min(o.x,s.x)-t,a=Math.min(o.y,s.y)-t,h=2*t,d=Math.abs(s.x-o.x)+h,c=Math.abs(s.y-o.y)+h;return{x:n,y:a,width:d,height:c,from:{x:o.x-n,y:o.y-a},to:{x:s.x-n,y:s.y-a}}};class yt{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,arrowLength:s,fromDir:n,toDir:a,curvature:h,hasSourceArrow:d,hasTargetArrow:c}=e,u=(t.x+o.x)/2,g=(t.y+o.y)/2;this.midpoint={x:u,y:g};const l=m({x:t.x+s,y:t.y},n,t),w=m({x:o.x-s,y:o.y},a,o),p={x:l.x+n.x*h,y:l.y+n.y*h},y={x:w.x-a.x*h,y:w.y-a.y*h},f=`M ${l.x} ${l.y} C ${p.x} ${p.y}, ${y.x} ${y.y}, ${w.x} ${w.y}`,x=d?"":`M ${t.x} ${t.y} L ${l.x} ${l.y} `,E=c?"":` M ${w.x} ${w.y} L ${o.x} ${o.y}`;this.path=`${x}${f}${E}`}}class ft{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,curvature:s,fromDir:n,toDir:a,detourDir:h,from:d,to:c,arrowLength:u,detourDistance:g}=e,l=t?m({x:d.x+u,y:d.y},n,d):d,w=o?m({x:c.x-u,y:c.y},a,c):c,p=Math.cos(h)*g,y=Math.sin(h)*g,f=m({x:d.x+u,y:d.y},n,d),x={x:f.x+p,y:f.y+y},E=m({x:c.x-u,y:c.y},a,c),P={x:E.x+p,y:E.y+y},M={x:(x.x+P.x)/2,y:(x.y+P.y)/2},D={x:f.x+s*n.x,y:f.y+s*n.y},W={x:E.x-s*a.x,y:E.y-s*a.y},O={x:f.x+p,y:f.y+y},z={x:E.x+p,y:E.y+y};this.path=[`M ${l.x} ${l.y}`,`L ${f.x} ${f.y}`,`C ${D.x} ${D.y} ${O.x} ${O.y} ${M.x} ${M.y}`,`C ${z.x} ${z.y} ${W.x} ${W.y} ${E.x} ${E.y}`,`L ${w.x} ${w.y}`].join(" "),this.midpoint=M}}const _=Object.freeze({edgeColor:"--edge-color"}),Ce=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(_.edgeColor,r),e},Me=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke",`var(${_.edgeColor})`),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e},H=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","path");return r.setAttribute("fill",`var(${_.edgeColor})`),r},De=(r,e)=>{r.style.transform=`translate(${e.x}px, ${e.y}px)`,r.style.width=`${e.width}px`,r.style.height=`${e.height}px`},R=(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,u=0,g=0;const l=d>0,w=d<o,p=l&&w;if(l&&(c=-s,u=-n,g=a),w){const D=r[d+1];s=D.x-h.x,n=D.y-h.y,a=Math.sqrt(s*s+n*n)}const f=a!==0?Math.min((p?e:0)/a,d<o-1?.5:1):0,x=p?{x:h.x+s*f,y:h.y+n*f}:h,P=g!==0?Math.min((p?e:0)/g,d>1?.5:1):0,M=p?{x:h.x+c*P,y:h.y+u*P}:h;d>0&&t.push(`L ${M.x} ${M.y}`),p&&t.push(`C ${h.x} ${h.y} ${h.x} ${h.y} ${x.x} ${x.y}`)})}return t.join(" ")},vt=(r,e)=>{const t=e.x-r.x>=0,o=r.dirX>=0,s=e.dirX>=0;if(o===s){const c=o===t,u=(r.x+e.x)/2,g=(r.y+e.y)/2,l={x:u,y:g};return c?{points:[{x:r.x,y:r.y},{x:l.x,y:r.y},{x:l.x,y:e.y},{x:e.x,y:e.y}],midpoint:l}:{points:[{x:r.x,y:r.y},{x:r.x,y:l.y},{x:e.x,y:l.y},{x:e.x,y:e.y}],midpoint:l}}const a=o===t,h=(r.y+e.y)/2;if(a){const c={x:e.x,y:r.y};return{points:[{x:r.x,y:r.y},c,{x:e.x,y:e.y}],midpoint:{x:c.x,y:h}}}const d={x:r.x,y:e.y};return{points:[{x:r.x,y:r.y},d,{x:e.x,y:e.y}],midpoint:{x:d.x,y:h}}};class mt{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,fromDir:s,toDir:n,arrowLength:a,arrowOffset:h,roundness:d,hasSourceArrow:c,hasTargetArrow:u}=e,g=c?m({x:t.x+a,y:t.y},s,t):t,l=u?m({x:o.x-a,y:o.y},n,o):o,w=a+h,p=m({x:t.x+w,y:t.y},s,t),y=m({x:o.x-w,y:o.y},n,o),f=vt({x:p.x,y:p.y,dirX:s.x},{x:y.x,y:y.y,dirX:n.x});this.path=R([g,...f.points,l],d),this.midpoint=f.midpoint}}class xt{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,from:s,to:n,arrowLength:a,fromDir:h,toDir:d,arrowOffset:c,detourDir:u,detourDistance:g,roundness:l}=e,w=t?m({x:s.x+a,y:s.y},h,s):s,p=o?m({x:n.x-a,y:n.y},d,n):n,y=a+c,f=Math.cos(u)*g,x=Math.sin(u)*g,E=m({x:s.x+y,y:s.y},h,s),P={x:E.x+f,y:E.y+x},M=m({x:n.x-y,y:n.y},d,n),D={x:M.x+f,y:M.y+x};this.midpoint={x:(P.x+D.x)/2,y:(P.y+D.y)/2},this.path=R([w,E,P,D,M,p],l)}}class Et{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,hasSourceArrow:s,hasTargetArrow:n,arrowLength:a,fromDir:h,toDir:d,arrowOffset:c,roundness:u}=e,g=this.createArrowPoint(s,h,t,a),l=this.createArrowPoint(n,d,o,-a),w=a+c,p={x:t.x+w,y:t.y},y=m(p,h,t),f={x:o.x-w,y:o.y},x=m(f,d,o);this.path=R([g,y,x,l],u);const E=(y.x+x.x)/2,P=(y.y+x.y)/2;this.midpoint={x:E,y:P}}createArrowPoint(e,t,o,s){if(!e)return o;const n={x:o.x+s,y:o.y};return m(n,t,o)}}const At=(r,e)=>{const t=e.y-r.y>=0,o=r.dirY>=0,s=e.dirY>=0;if(o===s){const c=o===t,u=(r.x+e.x)/2,g=(r.y+e.y)/2,l={x:u,y:g};return c?{points:[{x:r.x,y:r.y},{x:r.x,y:l.y},{x:e.x,y:l.y},{x:e.x,y:e.y}],midpoint:l}:{points:[{x:r.x,y:r.y},{x:l.x,y:r.y},{x:l.x,y:e.y},{x:e.x,y:e.y}],midpoint:l}}const a=o===t,h=(r.x+e.x)/2;if(a){const c={x:r.x,y:e.y};return{points:[{x:r.x,y:r.y},c,{x:e.x,y:e.y}],midpoint:{x:h,y:c.y}}}const d={x:e.x,y:r.y};return{points:[{x:r.x,y:r.y},d,{x:e.x,y:e.y}],midpoint:{x:h,y:d.y}}};class St{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,hasSourceArrow:s,hasTargetArrow:n,arrowLength:a,arrowOffset:h,fromDir:d,toDir:c,roundness:u}=e,g=s?m({x:t.x+a,y:t.y},d,t):t,l=n?m({x:o.x-a,y:o.y},c,o):o,w=a+h,p=m({x:t.x+w,y:t.y},d,t),y=m({x:o.x-w,y:o.y},c,o),f=At({x:p.x,y:p.y,dirY:d.y},{x:y.x,y:y.y,dirY:c.y});this.path=R([g,...f.points,l],u),this.midpoint=f.midpoint}}class q{constructor(e){i(this,"path");i(this,"midpoint");const{side:t,arrowLength:o,arrowOffset:s,dir:n,origin:a,hasArrow:h}=e,d=o+s,c=d+2*t,g=[{x:o,y:0},{x:d,y:0},{x:d,y:t},{x:c,y:t},{x:c,y:-t},{x:d,y:-t},{x:d,y:0},{x:o,y:0}].map(w=>m(w,n,{x:0,y:0})).map(w=>({x:w.x+a.x,y:w.y+a.y})),l=`M ${a.x} ${a.y} L ${g[0].x} ${g[0].y} `;this.path=`${h?"":l}${R(g,e.roundness)}`,this.midpoint={x:(g[3].x+g[4].x)/2,y:(g[3].y+g[4].y)/2}}}class Nt{constructor(e){i(this,"path");i(this,"midpoint");const{arrowLength:t,radius:o,smallRadius:s,dir:n,origin:a,hasArrow:h}=e,d=s+o,c=s*o/d,u=Math.sqrt(d*d-s*s),g=u*s/d,l=u+o+t,w=t+g,y=[{x:t,y:0},{x:w,y:c},{x:w,y:-c},{x:l,y:0}].map(E=>m(E,n,{x:0,y:0})).map(E=>({x:E.x+a.x,y:E.y+a.y})),f=[`M ${y[0].x} ${y[0].y}`,`A ${s} ${s} 0 0 1 ${y[1].x} ${y[1].y}`,`A ${o} ${o} 0 1 0 ${y[2].x} ${y[2].y}`,`A ${s} ${s} 0 0 1 ${y[0].x} ${y[0].y}`].join(" "),x=`M ${a.x} ${a.y} L ${y[0].x} ${y[0].y} `;this.path=`${h?"":x}${f}`,this.midpoint=y[3]}}class bt{constructor(e){i(this,"path");i(this,"midpoint");i(this,"diagonalDistance");const{from:t,to:o,sourceOffset:s,targetOffset:n,hasSourceArrow:a,hasTargetArrow:h,arrowLength:d}=e;this.midpoint={x:(t.x+o.x)/2,y:(t.y+o.y)/2};const c=o.x-t.x,u=o.y-t.y;if(this.diagonalDistance=Math.sqrt(c*c+u*u),this.diagonalDistance===0){this.path="";return}const g={x:c,y:u},l=this.createDirectLinePoint({offset:s,hasArrow:a,flip:1,shift:t,arrowLength:d,dir:g}),w=this.createDirectLinePoint({offset:n,hasArrow:h,flip:-1,shift:o,arrowLength:d,dir:g});this.path=`M ${l.x} ${l.y} L ${w.x} ${w.y}`}createDirectLinePoint(e){const t=e.hasArrow?e.arrowLength:0,o=e.offset+t,s=e.flip*o/this.diagonalDistance,{dir:n,shift:a}=e;return{x:n.x*s+a.x,y:n.y*s+a.y}}}const Pt=(r,e,t)=>{const o=Math.max(r.y,e.y),s=Math.min(r.y,e.y);return(t>=0?o:s)+t};class Tt{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,arrowLength:s,from:n,to:a,fromDir:h,toDir:d,arrowOffset:c,roundness:u,detourDistance:g}=e,l=t?m({x:n.x+s,y:n.y},h,n):n,w=o?m({x:a.x-s,y:a.y},d,a):a,p=s+c,y=m({x:n.x+p,y:n.y},h,n),f=m({x:a.x-p,y:a.y},d,a),x=Pt(y,f,g);this.midpoint={x:(y.x+f.x)/2,y:x},this.path=R([l,y,{x:y.x,y:x},{x:f.x,y:x},f,w],u)}}const Ct=(r,e,t)=>{const o=Math.max(r.x,e.x),s=Math.min(r.x,e.x);return(t>=0?o:s)+t};class Mt{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,arrowLength:s,fromDir:n,toDir:a,from:h,to:d,arrowOffset:c,detourDistance:u,roundness:g}=e,l=t?m({x:h.x+s,y:h.y},n,h):h,w=o?m({x:d.x-s,y:d.y},a,d):d,p=s+c,y=m({x:h.x+p,y:h.y},n,h),f=m({x:d.x-p,y:d.y},a,d),x=Ct(y,f,u);this.midpoint={x,y:(y.y+f.y)/2},this.path=R([l,y,{x,y:y.y},{x,y:f.y},f,w],g)}}const v=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}),Le=r=>({x:Math.cos(r),y:Math.sin(r)});class G{constructor(e){i(this,"svg");i(this,"group",document.createElementNS("http://www.w3.org/2000/svg","g"));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]=C(),this.arrowRenderer=this.params.arrowRenderer,this.svg=Ce(e.color),this.svg.appendChild(this.group),this.line=Me(e.width),this.group.appendChild(this.line),e.hasSourceArrow&&(this.sourceArrow=H(),this.group.appendChild(this.sourceArrow)),e.hasTargetArrow&&(this.targetArrow=H(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:o,width:s,height:n,from:a,to:h}=Te(e.from,e.to,this.params.padding);De(this.svg,{x:t,y:o,width:s,height:n});const d=Le(e.from.direction),c=Le(e.to.direction);let u={x:-c.x,y:-c.y},g;e.category===T.PortCycle?(g=this.params.createCyclePath,u=d):e.category===T.NodeCycle?g=this.params.createDetourPath:g=this.params.createLinePath;const l=g(a,h,d,c);this.line.setAttribute("d",l.path);let w=null;this.sourceArrow&&(w=this.arrowRenderer({direction:d,shift:a,arrowLength:this.params.arrowLength}),this.sourceArrow.setAttribute("d",w));let p=null;this.targetArrow&&(p=this.arrowRenderer({direction:u,shift:h,arrowLength:this.params.arrowLength}),this.targetArrow.setAttribute("d",p)),this.afterRenderEmitter.emit({edgePath:l,sourceArrowPath:w,targetArrowPath:p})}}const Dt=r=>e=>{const o=[{x:0,y:0},{x:e.arrowLength,y:r.radius},{x:e.arrowLength,y:-r.radius}].map(h=>m(h,e.direction,{x:0,y:0})).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`},Lt=r=>e=>{const t=r.radius,o=e.arrowLength,s=(o*o+2*o*t)/(2*t),n=s+t,a=o+t-t*(o+t)/n,h=t*s/n,c=[{x:0,y:0},{x:a,y:-h},{x:a,y:h}].map(p=>m(p,e.direction,{x:0,y:0})).map(p=>({x:p.x+e.shift.x,y:p.y+e.shift.y})),u=`M ${c[0].x} ${c[0].y}`,g=`A ${s} ${s} 0 0 0 ${c[1].x} ${c[1].y}`,l=`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`${u} ${g} ${l} ${w}`},Rt=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=[{x:0,y:0},{x:s.x,y:-s.y},s].map(g=>m(g,e.direction,{x:0,y:0})).map(g=>({x:g.x+e.shift.x,y:g.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}`,u=`A ${o} ${o} 0 0 1 ${a[0].x} ${a[0].y}`;return`${h} ${d} ${c} ${u}`},U=r=>{if(typeof r=="function")return r;switch(r.type){case"triangle":return Dt({radius:r.radius??v.polygonArrowRadius});case"arc":return Lt({radius:r.radius??v.circleArrowRadius});default:return Rt({smallRadius:r.smallRadius??v.wedgeArrowSmallRadius,angle:r.angle??v.wedgeArrowAngle,radius:r.radius??v.wedgeArrowRadius})}},$=50;class Re{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,t,o)=>new Nt({origin:e,dir:o,radius:this.portCycleRadius,smallRadius:this.portCycleSmallRadius,arrowLength:this.arrowLength,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new ft({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,detourDir:this.detourDirection,detourDistance:this.detourDistance,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o,s)=>new yt({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.curvature=(e==null?void 0:e.curvature)??v.curvature,this.portCycleRadius=(e==null?void 0:e.cycleRadius)??v.cycleRadius,this.portCycleSmallRadius=(e==null?void 0:e.smallCycleRadius)??v.smallCycleRadius,this.detourDirection=(e==null?void 0:e.detourDirection)??v.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 Ve{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,t,o)=>new q({origin:e,dir:o,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new Tt({from:e,to:t,fromDir:o,toDir:s,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 mt({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??v.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??v.cycleSquareSide;const t=(e==null?void 0:e.roundness)??v.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 Ie{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,t,o)=>new q({origin:e,dir:o,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new xt({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDir:this.detourDirection,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o,s)=>new Et({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??v.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??v.cycleSquareSide;const t=(e==null?void 0:e.roundness)??v.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDirection=(e==null?void 0:e.detourDirection)??v.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 Fe{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,t,o)=>new q({origin:e,dir:o,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new Mt({from:e,to:t,fromDir:o,toDir:s,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 St({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??v.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??v.cycleSquareSide;const t=(e==null?void 0:e.roundness)??v.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 ee{constructor(e){i(this,"svg");i(this,"group",document.createElementNS("http://www.w3.org/2000/svg","g"));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]=C(),this.color=(e==null?void 0:e.color)??v.color,this.width=(e==null?void 0:e.width)??v.width,this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowRenderer=U((e==null?void 0:e.arrowRenderer)??{}),this.sourceOffset=(e==null?void 0:e.sourceOffset)??v.preOffset,this.targetOffset=(e==null?void 0:e.targetOffset)??v.preOffset,this.svg=Ce(this.color),this.svg.appendChild(this.group),this.line=Me(this.width),this.group.appendChild(this.line),e!=null&&e.hasSourceArrow&&(this.sourceArrow=H(),this.group.appendChild(this.sourceArrow)),e!=null&&e.hasTargetArrow&&(this.targetArrow=H(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:o,width:s,height:n,from:a,to:h}=Te(e.from,e.to,$);De(this.svg,{x:t,y:o,width:s,height:n});const d=new bt({from:a,to:h,sourceOffset:this.sourceOffset,targetOffset:this.targetOffset,hasSourceArrow:this.sourceArrow!==null,hasTargetArrow:this.targetArrow!==null,arrowLength:this.arrowLength});this.line.setAttribute("d",d.path);let c=null,u=null;const g=d.diagonalDistance;if(g===0)this.sourceArrow!==null&&(c="",this.sourceArrow.setAttribute("d",c)),this.targetArrow!==null&&(u="",this.targetArrow.setAttribute("d",u));else{const l={x:(h.x-a.x)/g,y:(h.y-a.y)/g};if(this.sourceArrow){const w={x:l.x*this.sourceOffset,y:l.y*this.sourceOffset};c=this.arrowRenderer({direction:l,shift:w,arrowLength:this.arrowLength}),this.sourceArrow.setAttribute("d",c)}if(this.targetArrow){const w={x:l.x*this.targetOffset,y:l.y*this.targetOffset};u=this.arrowRenderer({direction:{x:-l.x,y:-l.y},shift:{x:h.x-w.x,y:h.y-w.y},arrowLength:this.arrowLength}),this.targetArrow.setAttribute("d",u)}}this.afterRenderEmitter.emit({edgePath:d,sourceArrowPath:c,targetArrowPath:u})}}const Vt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.pointerEvents="auto",r.style.cursor="pointer",r},It=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},Ue=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 $e extends Error{constructor(e){super(e),this.name="InteractiveEdgeError"}}class te{constructor(e,t){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"handle",Vt());i(this,"onAfterRender");i(this,"interactiveLine");i(this,"interactiveSourceArrow",null);i(this,"interactiveTargetArrow",null);if(this.baseEdge=e,e instanceof te)throw new $e("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)??v.interactiveWidth;this.interactiveLine=It(o),this.handle.appendChild(this.interactiveLine),this.sourceArrow&&(this.interactiveSourceArrow=Ue(o),this.handle.appendChild(this.interactiveSourceArrow)),this.targetArrow&&(this.interactiveTargetArrow=Ue(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 Ft{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 Be{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 re{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 We{constructor(e,t,o){i(this,"nodeIdGenerator",new re(e=>this.graphStore.hasNode(e)));i(this,"portIdGenerator",new re(e=>this.graphStore.hasPort(e)));i(this,"edgeIdGenerator",new re(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()});this.graphStore=e,this.htmlView=t,this.params=o,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)}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 o of e.ports)this.markPort({id:o.id,element:o.element,nodeId:t,direction:o.direction})}updateNode(e,t){this.graphStore.updateNode(e,t??{})}removeNode(e){this.graphStore.removeNode(e)}markPort(e){const t=this.portIdGenerator.create(e.id);this.graphStore.addPort({id:t,element:e.element,nodeId:e.nodeId,direction:e.direction??this.params.ports.direction})}updatePort(e,t){this.graphStore.updatePort(e,t??{})}unmarkPort(e){this.graphStore.removePort(e)}addEdge(e){const t=this.edgeIdGenerator.create(e.id);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()})}updateEdge(e,t){this.graphStore.updateEdge(e,t??{})}removeEdge(e){this.graphStore.removeEdge(e)}clear(){this.graphStore.clear()}destroy(){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()}}const Ut=r=>{setTimeout(()=>{r()})},$t=r=>{queueMicrotask(()=>{r()})},oe=r=>{r()};class Oe{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 Bt=(r,e)=>Symbol.iterator in r?{minContentScale:e.focus.minContentScale,nodes:r,contentPadding:e.focus.contentPadding,animationDuration:e.focus.animationDuration}:{minContentScale:r.minContentScale??e.focus.minContentScale,nodes:r.nodes??[],contentPadding:r.contentPadding??r.contentOffset??e.focus.contentPadding,animationDuration:r.animationDuration??e.focus.animationDuration},ze=(r,e,t)=>({scale:r.scale,x:r.x+r.scale*e,y:r.y+r.scale*t}),ke=(r,e,t,o)=>({scale:r.scale*e,x:r.scale*(1-e)*t+r.x,y:r.scale*(1-e)*o+r.y});class Ye{constructor(e,t,o,s){this.graphStore=e,this.viewportStore=t,this.params=o,this.win=s}patchViewportMatrix(e){this.viewportStore.patchViewportMatrix(e)}patchContentMatrix(e){this.viewportStore.patchContentMatrix(e)}center(e,t){const{width:o,height:s}=this.viewportStore.getDimensions(),n={x:o/2,y:s/2},a=this.viewportStore.getViewportMatrix(),h=this.viewportStore.createViewportCoords(e),d=h.x-n.x,c=h.y-n.y;let u=ze(a,d,c);const g=t==null?void 0:t.contentScale;if(g!==void 0){const w=1/g;u=ke(u,w/a.scale,n.x,n.y)}const l=(t==null?void 0:t.animationDuration)??0;l>0?this.animateNavigation(a,u,l):this.viewportStore.patchViewportMatrix(u)}focus(e){const t=Bt(e??{},this.params);this.params.focus.schedule(()=>{this.navigate(t)})}destroy(){this.viewportStore.destroy()}navigate(e){let t=1/0,o=-1/0,s=1/0,n=-1/0,a=0;const h=new Set;for(const d of e.nodes)h.add(d);if(this.graphStore.getAllNodeIds().forEach(d=>{const{payload:c}=this.graphStore.getNode(d);c.x!==null&&c.y!==null&&(h.size===0||h.has(d))&&(t=Math.min(c.x,t),o=Math.max(c.x,o),s=Math.min(c.y,s),n=Math.max(c.y,n),a++)}),a>0){t-=e.contentPadding,s-=e.contentPadding,o+=e.contentPadding,n+=e.contentPadding;const d={x:(t+o)/2,y:(s+n)/2},{scale:c}=this.viewportStore.getContentMatrix(),u=(n-s)*c,g=(o-t)*c,{width:l,height:w}=this.viewportStore.getDimensions(),p=Math.max(g/l,u/w),y=p>1?c/p:c,f=Math.max(y,e.minContentScale);this.center(d,{contentScale:f,animationDuration:e.animationDuration})}}animateNavigation(e,t,o){let s;const n={scale:t.scale-e.scale,x:t.x-e.x,y:t.y-e.y},a=h=>{s===void 0&&(s=h);const d=Math.min((h-s)/o,1);d<=1&&this.viewportStore.patchViewportMatrix({scale:e.scale+d*n.scale,x:e.x+d*n.x,y:e.y+d*n.y}),d<1&&this.win.requestAnimationFrame(a)};this.win.requestAnimationFrame(a)}}const Xe=(r,e,t)=>{const o=new xe,s=new Be(o),n=new Oe(e),a=new ve(o,e,r),h={nodes:{centerFn:Pe,priorityFn:()=>0},edges:{shapeFactory:()=>new ee,priorityFn:()=>0},ports:{direction:0}},d=new We(o,a,h),c={focus:{contentPadding:0,minContentScale:0,schedule:oe,animationDuration:0}},u=new Ye(o,e,c,t);return new me(s,n,d,u)};class j{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(!this.pointInsideVerifier.verify(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(!this.pointInsideVerifier.verify(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,"reset",()=>{this.canvas.graph.getAllPortIds().forEach(e=>{const t=this.canvas.graph.getPort(e);this.unhookPortEvents(t.element)})});i(this,"revert",()=>{this.params.onStopDrag(),this.reset(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.window=t,this.pointInsideVerifier=o,this.params=s,this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked),this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked),this.canvas.graph.onBeforeClear.subscribe(this.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e,t,o,s){new j(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 Wt{constructor(e,t,o){this.canvas=e,this.layoutAlgorithm=t,this.params=o}apply(){const e=this.layoutAlgorithm.calculateCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport});this.params.onBeforeApplied(),e.forEach((t,o)=>{this.params.staticNodeResolver(o)||this.canvas.updateNode(o,t)}),this.params.onAfterApplied()}}class Ot{constructor(e,t,o){this.canvas=e,this.layoutAlgorithm=t,this.params=o}apply(e){const t=this.layoutAlgorithm.calculateNextCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport,dt:e});this.params.onBeforeApplied(),t.forEach((o,s)=>{this.params.staticNodeResolver(s)||this.canvas.updateNode(s,o)}),this.params.onAfterApplied()}}class se{constructor(e,t,o,s,n){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,"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},Y(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(!this.pointInsideVerifier.verify(e.clientX,e.clientY)){this.stopMouseDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:e.clientX,y:e.clientY})});i(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.stopMouseDrag()});i(this,"onWindowTouchMove",e=>{if(e.touches.length!==1)return;const t=e.touches[0];if(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.stopTouchDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:t.clientX,y:t.clientY})});i(this,"onWindowTouchFinish",()=>{this.stopTouchDrag()});i(this,"reset",()=>{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,"revert",()=>{this.reset(),this.removeMouseDragListeners(),this.removeTouchDragListeners()});this.canvas=e,this.element=t,this.window=o,this.pointInsideVerifier=s,this.params=n,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.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e,t,o,s,n){new se(e,t,o,s,n)}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})}}stopMouseDrag(){this.grabbedNode!==null&&this.graph.hasNode(this.grabbedNode.nodeId)&&this.params.onNodeDragFinished(this.grabbedNode.nodeId),this.grabbedNode=null,Y(this.element,null),this.removeMouseDragListeners()}removeMouseDragListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}stopTouchDrag(){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 J=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 K{constructor(e,t,o,s,n){i(this,"viewport");i(this,"prevTouches",null);i(this,"wheelFinishTimer",null);i(this,"transformInProgress",!1);i(this,"revert",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});i(this,"onMouseDown",e=>{this.params.mouseDownEventVerifier(e)&&(Y(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=this.pointInsideVerifier.verify(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=J(e);return}this.prevTouches=J(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=J(e);if(!t.touches.every(s=>this.pointInsideVerifier.verify(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=J(e):this.stopTouchDrag()});i(this,"preventWheelScaleListener",e=>{e.preventDefault()});this.canvas=e,this.element=t,this.window=o,this.pointInsideVerifier=s,this.params=n,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.revert)}static configure(e,t,o,s,n){new K(e,t,o,s,n)}moveViewport(e,t){const o=this.viewport.getViewportMatrix(),s=ze(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=ke(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(){Y(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 ie{constructor(e,t,o,s,n,a,h){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.pointInsideVerifier=a,this.params=h,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 d={...s,onResizeTransformStarted:()=>{this.userTransformInProgress=!0,s.onResizeTransformStarted()},onResizeTransformFinished:()=>{this.userTransformInProgress=!1,s.onResizeTransformFinished()},onBeforeTransformChange:()=>{this.userTransformInProgress=!0,s.onBeforeTransformChange()},onTransformChange:()=>{this.userTransformInProgress=!1;const c=this.currentScale;this.currentScale=this.viewport.getViewportMatrix().scale,c!==this.currentScale&&this.scheduleEnsureViewportAreaLoaded(),s.onTransformChange()},onTransformFinished:()=>{this.scheduleLoadAreaAroundViewport(),s.onTransformFinished()}};K.configure(e,this.element,this.window,this.pointInsideVerifier,d),this.trigger.subscribe(this.updateLoadedArea),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated)}static configure(e,t,o,s,n,a,h){new ie(e,t,o,s,n,a,h)}scheduleLoadAreaAroundViewport(){setTimeout(()=>{this.loadAreaAroundViewport()})}scheduleEnsureViewportAreaLoaded(){setTimeout(()=>{const{width:e,height:t}=this.viewport.getDimensions(),{scale:o,x:s,y:n}=this.viewport.getViewportMatrix(),a=e*o,h=t*o,d=s-this.nodeHorizontal,c=n-this.nodeVertical,u=s+a+this.nodeHorizontal,g=n+h+this.nodeVertical;this.loadedArea.xFrom<d&&this.loadedArea.xTo>u&&this.loadedArea.yFrom<c&&this.loadedArea.yTo>g||this.loadAreaAroundViewport()})}loadAreaAroundViewport(){const{width:e,height:t}=this.viewport.getDimensions(),{scale:o,x:s,y:n}=this.viewport.getViewportMatrix(),a=e*o,h=t*o,d=s-a-this.nodeHorizontal,c=n-h-this.nodeVertical,u=3*a+2*this.nodeHorizontal,g=3*h+2*this.nodeVertical;this.trigger.emit({x:d,y:c,width:u,height:g})}}const zt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","svg");return r.style.position="absolute",r.style.inset="0",r},kt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","rect");return r.setAttribute("fill","url(#pattern)"),r},Yt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","pattern");return r.setAttribute("id","pattern"),r};class ne{constructor(e,t,o){i(this,"svg",zt());i(this,"patternRenderingRectangle",kt());i(this,"pattern",Yt());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.halfTileWidth*e.scale,o=e.y-this.halfTileHeight*e.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 ne(e,t,o)}updateVisibility(){const{scale:e}=this.canvas.viewport.getViewportMatrix(),t=e>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();if(this.svg.setAttribute("width",`${e}`),this.svg.setAttribute("height",`${t}`),this.patternRenderingRectangle.setAttribute("width",`${e}`),this.patternRenderingRectangle.setAttribute("height",`${t}`),e>0&&t>0){const o=this.tileWidth/e,s=this.tileHeight/t;this.pattern.setAttribute("width",`${o}`),this.pattern.setAttribute("height",`${s}`)}}}class ae{constructor(e,t,o,s,n,a){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.pointInsideVerifier=n,this.params=a,this.overlayCanvas=Xe(this.overlayLayer,this.viewportStore,this.window),j.configure(this.canvas,this.window,this.pointInsideVerifier,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(h,d)=>{const c=this.params.connectionTypeResolver(h);return c===null?!1:(this.grabPort(h,d,c),!0)},onPointerMove:h=>{this.moveDraggingPort(h)},onPointerUp:h=>{this.tryCreateConnection(h)}})}static configure(e,t,o,s,n,a){new ae(e,t,o,s,n,a)}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}),u=this.canvas.viewport.createContentCoords({x:t.x-d.x,y:t.y-d.y}),g={overlayNodeId:L.StaticNodeId,portCoords:c,portDirection:s.direction},l={overlayNodeId:L.DraggingNodeId,portCoords:u,portDirection:this.params.dragPortDirection};this.isTargetDragging=o==="direct";const[w,p]=this.isTargetDragging?[g,l]:[l,g];this.overlayCanvas.addNode(X(w)),this.overlayCanvas.addNode(X(p)),this.overlayCanvas.addEdge({from:w.overlayNodeId,to:p.overlayNodeId,shape:this.params.edgeShapeFactory(L.EdgeId)})}resetDragState(){this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}tryCreateConnection(e){const t=be(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(L.DraggingNodeId,{x:o.x,y:o.y})}}class he{constructor(e,t,o,s,n,a){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.pointInsideVerifier=n,this.params=a,this.overlayCanvas=Xe(this.overlayLayer,this.viewportStore,this.window),j.configure(this.canvas,this.window,this.pointInsideVerifier,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(h,d)=>this.tryStartEdgeDragging(h,d),onPointerMove:h=>{this.moveDraggingPort(h)},onPointerUp:h=>{this.tryCreateConnection(h)}})}static configure(e,t,o,s,n,a){new he(e,t,o,s,n,a)}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),u=c.element.getBoundingClientRect(),g={x:u.x+u.width/2,y:u.y+u.height/2},l=this.overlayLayer.getBoundingClientRect(),w=this.canvas.viewport.createContentCoords({x:g.x-l.x,y:g.y-l.y}),p=this.canvas.viewport.createContentCoords({x:t.x-l.x,y:t.y-l.y});this.draggingEdgePayload={id:o,from:s.from,to:s.to,shape:s.shape,priority:s.priority},this.canvas.removeEdge(o);const y={overlayNodeId:L.StaticNodeId,portCoords:w,portDirection:c.direction},f={overlayNodeId:L.DraggingNodeId,portCoords:p,portDirection:d.direction},[x,E]=this.isTargetDragging?[y,f]:[f,y];this.overlayCanvas.addNode(X(x)),this.overlayCanvas.addNode(X(E));const P=this.params.draggingEdgeShapeFactory!==null?this.params.draggingEdgeShapeFactory(L.EdgeId):s.shape;return this.overlayCanvas.addEdge({id:L.EdgeId,from:x.overlayNodeId,to:E.overlayNodeId,shape:P}),!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(L.DraggingNodeId,{x:s.x,y:s.y})}tryCreateConnection(e){const t=be(this.canvas.graph,e);if(this.overlayCanvas.removeEdge(L.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 de{constructor(e,t){this.applier=e,this.trigger=t,this.trigger.subscribe(()=>{this.applier.apply()})}static configure(e,t){new de(e,t)}}class ce{constructor(e,t,o){i(this,"applyScheduled",!1);i(this,"apply",()=>{this.applyScheduled=!1,this.applier.apply()});this.graph=e,this.applier=t,this.defererFn=o,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,o){new ce(e,t,o)}scheduleApply(){this.applyScheduled||(this.applyScheduled=!0,this.defererFn(this.apply))}}class Xt{static configure(e,t){const o=t.applyOn,s=new Wt(e,t.algorithm,{staticNodeResolver:t.staticNodeResolver,onBeforeApplied:t.onBeforeApplied,onAfterApplied:t.onAfterApplied});switch(o.type){case"trigger":{de.configure(s,o.trigger);break}case"topologyChangeSchedule":{ce.configure(e.graph,s,o.schedule);break}}}}class Ht{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 le{constructor(e,t,o){i(this,"applier");i(this,"step",e=>{this.applier.apply(e)});this.win=o,this.applier=new Ot(e,t.algorithm,{staticNodeResolver:t.staticNodeResolver,onBeforeApplied:t.onBeforeApplied,onAfterApplied:t.onAfterApplied}),new Ht(this.win,this.step)}static configure(e,t,o){new le(e,t,o)}}class ue{constructor(e,t,o,s){i(this,"onNodeSelected");i(this,"mouseDownEventVerifier");i(this,"mouseUpEventVerifier");i(this,"movementThreshold");i(this,"selectionCandidateNodeId",null);i(this,"movedDistance",0);i(this,"previousMouse",null);i(this,"previousTouch",null);i(this,"onAfterNodeAdded",e=>{const{element:t}=this.canvas.graph.getNode(e);t.addEventListener("mousedown",this.onNodeMouseDown,{passive:!0}),t.addEventListener("touchstart",this.onNodeTouchStart,{passive:!0})});i(this,"onBeforeNodeRemoved",e=>{const{element:t}=this.canvas.graph.getNode(e);t.removeEventListener("mousedown",this.onNodeMouseDown),t.removeEventListener("touchstart",this.onNodeTouchStart)});i(this,"reset",()=>{this.canvas.graph.getAllNodeIds().forEach(e=>{const{element:t}=this.canvas.graph.getNode(e);t.removeEventListener("mousedown",this.onNodeMouseDown),t.removeEventListener("touchstart",this.onNodeTouchStart)})});i(this,"revert",()=>{this.reset(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});i(this,"onNodeMouseDown",e=>{const t=e;if(!this.mouseDownEventVerifier(t))return;const o=this.canvas.graph.findNodeIdByElement(e.currentTarget);this.selectionCandidateNodeId=o,this.previousMouse={x:t.clientX,y:t.clientY},this.movedDistance=0,this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0})});i(this,"onNodeTouchStart",e=>{const t=e;if(t.touches.length!==1)return;const o=this.canvas.graph.findNodeIdByElement(t.currentTarget);this.selectionCandidateNodeId=o,this.previousTouch=t.touches[0],this.movedDistance=0,this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchEnd,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchCancel,{passive:!0})});i(this,"onWindowMouseMove",e=>{const t=e,o=this.previousMouse,s=t.clientX-o.x,n=t.clientY-o.y;if(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.removeWindowMouseListeners();return}this.processMoveThresholdVerification(s,n,()=>{this.removeWindowMouseListeners()}),this.previousMouse={x:t.clientX,y:t.clientY}});i(this,"onWindowTouchMove",e=>{const t=e;if(t.touches.length!==1){this.removeWindowTouchListeners();return}const o=t.touches[0];if(!this.pointInsideVerifier.verify(o.clientX,o.clientY)){this.removeWindowTouchListeners();return}const s=this.previousTouch,n=o.clientX-s.clientX,a=o.clientY-s.clientY;this.processMoveThresholdVerification(n,a,()=>{this.removeWindowTouchListeners()}),this.previousTouch=o});i(this,"onWindowMouseUp",e=>{const t=e;this.mouseUpEventVerifier(t)&&(this.removeWindowMouseListeners(),this.trySelectNode(e))});i(this,"onWindowTouchEnd",e=>{this.removeWindowTouchListeners(),this.trySelectNode(e)});i(this,"onWindowTouchCancel",()=>{this.removeWindowTouchListeners()});this.canvas=e,this.window=t,this.pointInsideVerifier=o,this.mouseDownEventVerifier=s.mouseDownEventVerifier,this.mouseUpEventVerifier=s.mouseUpEventVerifier,this.onNodeSelected=s.onNodeSelected,this.movementThreshold=s.movementThreshold,this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.canvas.graph.onBeforeClear.subscribe(this.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e,t,o,s){new ue(e,t,o,s)}removeWindowMouseListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}removeWindowTouchListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchEnd),this.window.removeEventListener("touchcancel",this.onWindowTouchCancel)}trySelectNode(e){const t=this.selectionCandidateNodeId;this.canvas.graph.hasNode(t)&&(this.onNodeSelected(t),e.ignoreCanvasSelection=!0)}processMoveThresholdVerification(e,t,o){const s=Math.sqrt(e*e+t*t);this.movedDistance+=s,this.movedDistance>this.movementThreshold&&o()}}class ge{constructor(e,t,o,s,n){i(this,"onCanvasSelected");i(this,"movementThreshold");i(this,"mouseDownEventVerifier");i(this,"mouseUpEventVerifier");i(this,"movedDistance",0);i(this,"previousMouseDown",null);i(this,"previousTouch",null);i(this,"onMouseDown",e=>{const t=e;this.mouseDownEventVerifier(t)&&(this.previousMouseDown={x:t.clientX,y:t.clientY},this.movedDistance=0,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;const o=t.touches[0];this.previousTouch=o,this.movedDistance=0,this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchEnd,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchCancel,{passive:!0})});i(this,"onWindowMouseMove",e=>{const t=e;if(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.removeWindowMouseListeners();return}const o=this.previousMouseDown,s=t.clientX-o.x,n=t.clientY-o.y;this.processMoveThresholdVerification(s,n,()=>{this.removeWindowMouseListeners()}),this.previousMouseDown={x:t.clientX,y:t.clientY}});i(this,"onWindowTouchMove",e=>{const t=e;if(t.touches.length!==1){this.removeWindowTouchListeners();return}const o=t.touches[0];if(!this.pointInsideVerifier.verify(o.clientX,o.clientY)){this.removeWindowTouchListeners();return}const s=this.previousTouch,n=o.clientX-s.clientX,a=o.clientY-s.clientY;this.processMoveThresholdVerification(n,a,()=>{this.removeWindowTouchListeners()}),this.previousTouch=o});i(this,"onWindowMouseUp",e=>{const t=e;if(!this.mouseUpEventVerifier(t))return;e.ignoreCanvasSelection!==!0&&this.onCanvasSelected(),this.removeWindowMouseListeners()});i(this,"onWindowTouchEnd",()=>{this.onCanvasSelected(),this.removeWindowTouchListeners()});i(this,"onWindowTouchCancel",()=>{this.removeWindowTouchListeners()});i(this,"restore",()=>{this.element.removeEventListener("mousedown",this.onMouseDown),this.element.removeEventListener("touchstart",this.onTouchStart),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.element=t,this.window=o,this.pointInsideVerifier=s,this.onCanvasSelected=n.onCanvasSelected,this.movementThreshold=n.movementThreshold,this.mouseDownEventVerifier=n.mouseDownEventVerifier,this.mouseUpEventVerifier=n.mouseUpEventVerifier,this.canvas.onBeforeDestroy.subscribe(this.restore),this.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),this.element.addEventListener("touchstart",this.onTouchStart,{passive:!0})}static configure(e,t,o,s,n){new ge(e,t,o,s,n)}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.onWindowTouchEnd),this.window.removeEventListener("touchcancel",this.onWindowTouchCancel)}processMoveThresholdVerification(e,t,o){const s=Math.sqrt(e*e+t*t);this.movedDistance+=s,this.movedDistance>this.movementThreshold&&o()}}const Gt=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r},pe=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.inset="0",r},He=()=>{const r=pe();return r.style.pointerEvents="none",r};class jt{constructor(e){i(this,"background",pe());i(this,"main",pe());i(this,"overlayConnectablePorts",He());i(this,"overlayDraggableEdges",He());i(this,"host",Gt());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 Jt=r=>{var w,p,y,f,x,E;const e=((w=r.events)==null?void 0:w.onNodeDragStarted)??(()=>{}),t=((p=r.events)==null?void 0:p.onNodeDrag)??(()=>{}),o=r.nodeDragVerifier??(()=>!0),s=((y=r.events)==null?void 0:y.onNodeDragFinished)??(()=>{}),n=r.moveOnTop!==!1,a=r.moveEdgesOnTop!==!1&&n,h=(f=r.mouse)==null?void 0:f.dragCursor,d=h!==void 0?h:"grab",c=(x=r.mouse)==null?void 0:x.mouseDownEventVerifier,u=c!==void 0?c:P=>P.button===0,g=(E=r.mouse)==null?void 0:E.mouseUpEventVerifier,l=g!==void 0?g:P=>P.button===0;return{moveOnTop:n,moveEdgesOnTop:a,dragCursor:d,gridSize:r.gridSize??null,mouseDownEventVerifier:u,mouseUpEventVerifier:l,onNodeDragStarted:e,onNodeDrag:t,nodeDragVerifier:o,onNodeDragFinished:s}},Kt=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.canvasWidth*n.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 u=n.canvasHeight*n.prevTransform.scale,g=s-u;return h>g&&h>n.prevTransform.y&&(h=Math.max(n.prevTransform.y,g)),{scale:n.nextTransform.scale,x:a,y:h}}},Qt=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,u=h.y;if(h.scale>s&&h.scale>a.scale){d=Math.max(a.scale,s),c=a.x,u=a.y;const g=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*g,u=a.y+(h.y-a.y)*g}if(h.scale<o&&h.scale<a.scale){d=Math.min(a.scale,o),c=a.x,u=a.y;const g=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*g,u=a.y+(h.y-a.y)*g}return{scale:d,x:c,y:u}}},Zt=r=>e=>r.reduce((t,o)=>o({prevTransform:e.prevTransform,nextTransform:t,canvasWidth:e.canvasWidth,canvasHeight:e.canvasHeight}),e.nextTransform),Ge=r=>{if(typeof r=="function")return r;switch(r.type){case"scale-limit":return Qt({minContentScale:r.minContentScale??0,maxContentScale:r.maxContentScale??1/0});case"shift-limit":return Kt({minX:r.minX??-1/0,maxX:r.maxX??1/0,minY:r.minY??-1/0,maxY:r.maxY??1/0})}},je=r=>{var p,y,f,x,E,P,M,D,W,O,z,ot;const e=(p=r==null?void 0:r.scale)==null?void 0:p.mouseWheelSensitivity,t=e!==void 0?e:1.2,o=r==null?void 0:r.transformPreprocessor;let s;o!==void 0?Array.isArray(o)?s=Zt(o.map(V=>Ge(V))):s=Ge(o):s=V=>V.nextTransform;const n=((y=r==null?void 0:r.shift)==null?void 0:y.cursor)!==void 0?r.shift.cursor:"grab",a=((f=r==null?void 0:r.events)==null?void 0:f.onBeforeTransformChange)??(()=>{}),h=((x=r==null?void 0:r.events)==null?void 0:x.onTransformChange)??(()=>{}),d=(E=r==null?void 0:r.shift)==null?void 0:E.mouseDownEventVerifier,c=d!==void 0?d:V=>V.button===0,u=(P=r==null?void 0:r.shift)==null?void 0:P.mouseUpEventVerifier,g=u!==void 0?u:V=>V.button===0,l=(M=r==null?void 0:r.scale)==null?void 0:M.mouseWheelEventVerifier,w=l!==void 0?l:()=>!0;return{wheelSensitivity:t,onTransformStarted:((D=r==null?void 0:r.events)==null?void 0:D.onTransformStarted)??(()=>{}),onTransformFinished:((W=r==null?void 0:r.events)==null?void 0:W.onTransformFinished)??(()=>{}),onBeforeTransformChange:a,onTransformChange:h,transformPreprocessor:s,shiftCursor:n,mouseDownEventVerifier:c,mouseUpEventVerifier:g,mouseWheelEventVerifier:w,scaleWheelFinishTimeout:((O=r==null?void 0:r.scale)==null?void 0:O.wheelFinishTimeout)??500,onResizeTransformStarted:((z=r==null?void 0:r.events)==null?void 0:z.onResizeTransformStarted)??(()=>{}),onResizeTransformFinished:((ot=r==null?void 0:r.events)==null?void 0:ot.onResizeTransformFinished)??(()=>{})}},_t=(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},qt=r=>r instanceof SVGElement?r:_t((r==null?void 0:r.radius)??1.5,(r==null?void 0:r.color)??"#d8d8d8"),er=r=>{const e=r.tileDimensions,t=(e==null?void 0:e.width)??25,o=(e==null?void 0:e.height)??25,s=qt(r.renderer??{});return{tileWidth:t,tileHeight:o,renderer:s,maxViewportScale:r.maxViewportScale??10}},we=r=>{if(typeof r=="function")return r;switch(r.type){case"straight":return()=>new Ie({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 Ve({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 Fe({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 ee({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 Re({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})}},tr=(r,e,t)=>{var c,u,g;const o=()=>"direct",s=l=>l,n=l=>l.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:((u=r.events)==null?void 0:u.onEdgeCreationInterrupted)??d,onEdgeCreationPrevented:((g=r.events)==null?void 0:g.onEdgeCreationPrevented)??h,dragPortDirection:r.dragPortDirection??t,edgeShapeFactory:r.edgeShape!==void 0?we(r.edgeShape):e}},rr=(r,e)=>{var c,u,g;const t=l=>l,o=l=>l.button===0&&l.ctrlKey,s=l=>l.button===0,n=l=>{const w=e.getPortAdjacentEdgeIds(l);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?we(r.draggingEdgeShape):null,onAfterEdgeReattached:((c=r.events)==null?void 0:c.onAfterEdgeReattached)??a,onEdgeReattachInterrupted:((u=r.events)==null?void 0:u.onEdgeReattachInterrupted)??d,onEdgeReattachPrevented:((g=r.events)==null?void 0:g.onEdgeReattachPrevented)??h}},or=r=>({nodeVerticalRadius:r.nodeContainingRadius.vertical,nodeHorizontalRadius:r.nodeContainingRadius.horizontal}),sr=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 Je extends Error{constructor(){super(...arguments);i(this,"name","CanvasBuilderError")}}class Ke{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.nodeMass*this.dt,y:a.y/this.nodeMass*this.dt};e=Math.max(e,Math.sqrt(h.x*h.x+h.y*h.y));const d=h.x*this.dt,c=h.y*this.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),u=(d.d-this.edgeEquilibriumLength)*this.edgeStiffness,g=d.ex*u,l=d.ey*u,w=e.get(s.nodeId),p=e.get(n.nodeId);w.x+=g,w.y+=l,p.x-=g,p.y-=l})}}class Qe{constructor(e){i(this,"PI2",2*Math.PI);this.rand=e}create(e,t){const o=t.x-e.x,s=t.y-e.y,n=o*o+s*s;if(n===0){const c=this.PI2*this.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 Ze=r=>{if(r.distance===0)return r.maxForce;const e=r.coefficient*(r.sourceCharge*r.targetCharge/(r.distance*r.distance));return Math.min(e,r.maxForce)};class ir{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),u=e.get(d),g=this.distanceVectorGenerator.create(c,u),l=Ze({coefficient:1,sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,distance:g.d,maxForce:this.maxForce}),w=l*g.ex,p=l*g.ey,y=t.get(a),f=t.get(d);y.x-=w,y.y-=p,f.x+=w,f.y+=p}}}}const nr=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 ar{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.x*o.lb.totalCharge,n+=o.lb.chargeCenter.y*o.lb.totalCharge),o.lt!==null&&(a+=o.lt.totalMass,h+=o.lt.totalCharge,s+=o.lt.chargeCenter.x*o.lt.totalCharge,n+=o.lt.chargeCenter.y*o.lt.totalCharge),o.rb!==null&&(a+=o.rb.totalMass,h+=o.rb.totalCharge,s+=o.rb.chargeCenter.x*o.rb.totalCharge,n+=o.rb.chargeCenter.y*o.rb.totalCharge),o.rt!==null&&(a+=o.rt.totalMass,h+=o.rt.totalCharge,s+=o.rt.chargeCenter.x*o.rt.totalCharge,n+=o.rt.chargeCenter.y*o.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(l=>{const{x:w,y:p}=this.coords.get(l);w<t?p<o?d.add(l):h.add(l):p<o?a.add(l):n.add(l),e.nodeIds.delete(l)});const u={parent:e,lb:null,lt:null,rb:null,rt:null},g=[];if(n.size>0){const l={nodeIds:n,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:o+c,radius:c},...u};e.rt=l,g.push(l)}if(a.size>0){const l={nodeIds:a,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:o-c,radius:c},...u};e.rb=l,g.push(l)}if(h.size>0){const l={nodeIds:h,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:o+c,radius:c},...u};e.lt=l,g.push(l)}if(d.size>0){const l={nodeIds:d,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:o-c,radius:c},...u};e.lb=l,g.push(l)}return g}setLeaf(e){e.totalMass=this.nodeMass*e.nodeIds.size,e.totalCharge=this.nodeCharge*e.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 hr{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=nr(e),s=new ar({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.radius*2<d.d*this.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=Ze({coefficient:this.nodeForceCoefficient,sourceCharge:e.sourceCharge,targetCharge:e.targetCharge,distance:t.d,maxForce:this.maxForce});return{x:o*t.ex,y:o*t.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 _e=r=>r.theta!==0?new hr({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce,theta:r.theta,nodeMass:r.nodeMass,areaRadiusThreshold:r.areaRadiusThreshold}):new ir({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce});class qe{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().filter(p=>{const y=t.getNode(p);return y.x===null||y.y===null}),a=Math.sqrt(n.length)*this.sparsity,{width:h,height:d}=o.getDimensions(),c={x:h/2,y:d/2},u=o.createContentCoords(c),g=a/2,l={x:u.x-g,y:u.y-g};return t.getAllNodeIds().forEach(p=>{const y=t.getNode(p);s.set(p,{x:y.x??l.x+a*this.rand(),y:y.y??l.y+a*this.rand()})}),s}}class dr{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 Qe(e.rand),this.nodeForcesApplicationStrategy=_e({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new qe({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 Ke(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 cr{constructor(e,t){i(this,"forest",new Set);i(this,"remainingNodeIds");for(this.graph=e,this.nextLayerNodesResolver=t,this.remainingNodeIds=new Set(this.graph.getAllNodeIds());this.remainingNodeIds.size>0;){const[o]=this.remainingNodeIds;this.traverse(o)}}generate(){return this.forest}traverse(e){const t={nodeId:e,children:new Set},o=[];this.forest.add({root:t,sequence:o});let s=[t];for(this.remainingNodeIds.delete(t.nodeId);s.length>0;){const n=[];s.forEach(a=>{o.push(a);const h=this.nextLayerNodesResolver({graph:this.graph,currentNodeId:a.nodeId});for(const d of h){if(!this.remainingNodeIds.has(d))continue;this.remainingNodeIds.delete(d);const c={nodeId:d,children:new Set};a.children.add(c),n.push(c)}}),s=n}}}class lr{constructor(e){this.params=e}generate(e){let t=0;const o=[],s=e.length-1,n=[];e.forEach((h,d)=>{if(t+=this.params.spaceAroundRadius,h.forEach((c,u)=>{n[u]===void 0?n[u]={start:t+c.start,end:t+c.end}:n[u].end=t+c.end}),o.push(t),d!==s){const c=e[d+1],u=n.map(g=>({start:g.start-t,end:g.end-t}));t+=this.calculateMaxDiff(u,c)}t+=this.params.spaceAroundRadius});const a=t/2;return{childOffsets:o.map(h=>h-a),subtreeSpans:n.map(h=>({start:h.start-a,end:h.end-a}))}}calculateMaxDiff(e,t){let o=0;const s=Math.min(e.length,t.length);for(let n=0;n<s;n++){const a=e[n].end-t[n].start;o=Math.max(o,a)}return o-2*this.params.spaceAroundRadius}}class ur{constructor(e,t){i(this,"offsets",new Map);i(this,"treeSpans",new Map);this.tree=e;const o=t.spaceAroundRadius,s=new lr({spaceAroundRadius:o});[...this.tree.sequence].reverse().forEach(n=>{const a=Array.from(n.children).map(c=>this.treeSpans.get(c.nodeId)),h=s.generate(a);let d=0;n.children.forEach(c=>{this.offsets.set(c.nodeId,h.childOffsets[d]),d++}),this.treeSpans.set(n.nodeId,[{start:-o,end:o},...h.subtreeSpans]),n.children.forEach(c=>{this.treeSpans.delete(c.nodeId)})}),this.offsets.set(this.tree.root.nodeId,0)}generate(){return this.offsets}}class gr{constructor(e){this.params=e}calculateCoordinates(e){const t=new Map,s=new cr(e.graph,this.params.nextLayerNodesResolver).generate();let n=0;return s.forEach(a=>{t.set(a.root.nodeId,{x:n,y:0});const d=new ur(a,{spaceAroundRadius:this.params.layerSpace/2}).generate();let c=[a.root];for(;c.length>0;){const u=[];n+=this.params.layerWidth,c.forEach(g=>{g.children.forEach(l=>{const w=t.get(g.nodeId).y;t.set(l.nodeId,{y:w+d.get(l.nodeId),x:n}),u.push(l)})}),c=u}}),t.forEach((a,h)=>{t.set(h,this.params.transform(a))}),t}}const pr=r=>{const{graph:e,currentNodeId:t}=r,o=e.getNodeOutgoingEdgeIds(t).map(n=>{const a=e.getEdge(n);return e.getPort(a.to).nodeId}),s=e.getNodeIncomingEdgeIds(t).map(n=>{const a=e.getEdge(n);return e.getPort(a.from).nodeId});return new Set([...o,...s])},wr=r=>{const{graph:e,currentNodeId:t}=r,o=e.getNodeOutgoingEdgeIds(t).map(s=>{const n=e.getEdge(s);return e.getPort(n.to).nodeId});return new Set(o)},yr=r=>{const{graph:e,currentNodeId:t}=r,o=e.getNodeIncomingEdgeIds(t).map(s=>{const n=e.getEdge(s);return e.getPort(n.from).nodeId});return new Set(o)};class fr{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 Qe(e.rand),this.nodeForcesApplicationStrategy=_e({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new qe({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 Ke(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 u=t.getNode(c);return u.x===null||u.y===null})?new Map:n}}const et=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]},tt=(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},N=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}),F=Object.freeze({mouseDownEventVerifier:r=>r.button===0,mouseUpEventVerifier:r=>r.button===0,movementThreshold:10}),vr=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const o=et((r==null?void 0:r.seed)??N.seed),s=tt(o[0],o[1],o[2],o[3]);return new fr({rand:s,maxTimeDeltaSec:(r==null?void 0:r.maxTimeDeltaSec)??N.maxTimeDeltaSec,nodeCharge:(r==null?void 0:r.nodeCharge)??N.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??N.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??N.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??N.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??N.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??N.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??N.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??N.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??N.barnesHutAreaRadiusThreshold})}}},ye={staticNodeResolver:()=>!1,onBeforeApplied:()=>{},onAfterApplied:()=>{}},mr=r=>{var t,o;return{algorithm:vr((r==null?void 0:r.algorithm)??{}),staticNodeResolver:(r==null?void 0:r.staticNodeResolver)??ye.staticNodeResolver,onBeforeApplied:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeApplied)??ye.onBeforeApplied,onAfterApplied:((o=r==null?void 0:r.events)==null?void 0:o.onAfterApplied)??ye.onAfterApplied}},xr=r=>r instanceof k?{type:"trigger",trigger:r}:(r==null?void 0:r.type)==="topologyChangeMacrotask"?{type:"topologyChangeSchedule",schedule:Ut}:{type:"topologyChangeSchedule",schedule:$t},B=Object.freeze({staticNodeResolver:()=>!1,onBeforeApplied:()=>{},onAfterApplied:()=>{},hierarchicalLayout:{layerWidth:300,layerSpace:300}}),Q=(r,e)=>({a:r.a*e.a+r.b*e.d,b:r.a*e.b+r.b*e.e,c:r.a*e.c+r.b*e.f+r.c,d:r.d*e.a+r.e*e.d,e:r.d*e.b+r.e*e.e,f:r.d*e.c+r.e*e.f+r.f}),Er=r=>{const{a:e,b:t,c:o,d:s,e:n,f:a}=r,h=e*n-t*s;return{a:n/h,b:-t/h,c:(t*a-o*n)/h,d:-s/h,e:e/h,f:(o*s-e*a)/h}};class Ar{resolve(e){if("shift"in e)return this.createShiftBaseMatrix(e.shift);if("scale"in e){const t=e.origin??{x:0,y:0};return this.createScaleRelativeMatrix(e.scale,t)}if("rotate"in e){const t=e.origin??{x:0,y:0};return this.createRotateRelativeMatrix(e.rotate,t)}if("mirror"in e){const t=e.origin??{x:0,y:0};return this.createMirrorRelativeMatrix(e.mirror,t)}return{a:e.a??1,b:e.b??0,c:e.c??0,d:e.d??0,e:e.e??1,f:e.f??0}}createScaleRelativeMatrix(e,t){const o=this.createScaleBaseMatrix(e),s=this.createShiftBaseMatrix(t);return this.createRelativeTransform(o,s)}createRotateRelativeMatrix(e,t){const o=this.createRotateBaseMatrix(e),s=this.createShiftBaseMatrix(t);return this.createRelativeTransform(o,s)}createMirrorRelativeMatrix(e,t){const o=this.createMirrorYBaseMatrix(),s=Q(this.createShiftBaseMatrix(t),this.createRotateBaseMatrix(e));return this.createRelativeTransform(o,s)}createRelativeTransform(e,t){const o=Q(t,e),s=Er(t);return Q(o,s)}createShiftBaseMatrix(e){return{a:1,b:0,c:e.x,d:0,e:1,f:e.y}}createScaleBaseMatrix(e){return{a:e,b:0,c:0,d:0,e,f:0}}createRotateBaseMatrix(e){const t=Math.sin(e),o=Math.cos(e);return{a:o,b:-t,c:0,d:t,e:o,f:0}}createMirrorYBaseMatrix(){return{a:1,b:0,c:0,d:0,e:-1,f:0}}}const Sr=r=>{if(r===void 0)return s=>s;if(typeof r=="function")return r;const e=Array.isArray(r)?r:[r];let t={a:1,b:0,c:0,d:0,e:1,f:0};const o=new Ar;return e.forEach(s=>{const n=o.resolve(s);t=Q(t,n)}),s=>{const{x:n,y:a}=s;return{x:t.a*n+t.b*a+t.c,y:t.d*n+t.e*a+t.f}}},Nr=r=>{if(typeof r=="function")return r;switch(r){case"outgoing":return wr;case"incoming":return yr;default:return pr}},br=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;case"hierarchical":return new gr({layerWidth:r.layerWidth??B.hierarchicalLayout.layerWidth,layerSpace:r.layerSpace??B.hierarchicalLayout.layerSpace,transform:Sr(r.transform),nextLayerNodesResolver:Nr(r.nextLayerNodesResolver)});default:{const o=et((r==null?void 0:r.seed)??N.seed),s=tt(o[0],o[1],o[2],o[3]);return new dr({dtSec:(r==null?void 0:r.dtSec)??N.dtSec,maxIterations:(r==null?void 0:r.maxIterations)??N.maxIterations,rand:s,nodeCharge:(r==null?void 0:r.nodeCharge)??N.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??N.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??N.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??N.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??N.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??N.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??N.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??N.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??N.barnesHutAreaRadiusThreshold})}}},Pr=r=>{var e,t;return{algorithm:br(r.algorithm),applyOn:xr(r.applyOn),staticNodeResolver:r.staticNodeResolver??B.staticNodeResolver,onBeforeApplied:((e=r.events)==null?void 0:e.onBeforeApplied)??B.onBeforeApplied,onAfterApplied:((t=r.events)==null?void 0:t.onAfterApplied)??B.onAfterApplied}},Tr=(r,e)=>({...r,onNodeDragStarted:t=>{e.add(t),r.onNodeDragStarted(t)},onNodeDragFinished:t=>{e.delete(t),r.onNodeDragFinished(t)}}),Cr=(r,e)=>{r.graph.onBeforeNodeRemoved.subscribe(t=>{e.delete(t)}),r.graph.onBeforeClear.subscribe(()=>{e.clear()}),r.onBeforeDestroy.subscribe(()=>{e.clear()})},Mr=(r,e)=>({...r,staticNodeResolver:t=>r.staticNodeResolver(t)||e.has(t)}),fe=r=>()=>r,rt=fe(0),Dr=()=>{let r=0;return()=>r++},Lr=(r,e)=>{let t=rt,o=rt;const s=Dr();return r==="incremental"&&(t=s),e==="incremental"&&(o=s),typeof r=="number"&&(t=fe(r)),typeof e=="number"&&(o=fe(e)),typeof r=="function"&&(t=r),typeof e=="function"&&(o=e),{nodesPriorityFn:t,edgesPriorityFn:o}},Rr=r=>{var t,o,s,n,a;const e=Lr((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)??Pe,priorityFn:e.nodesPriorityFn},ports:{direction:((n=r.ports)==null?void 0:n.direction)??0},edges:{shapeFactory:we(((a=r.edges)==null?void 0:a.shape)??{}),priorityFn:e.edgesPriorityFn}}},Vr=r=>r.applyOn.type==="topologyChangeSchedule"?r.applyOn.schedule:oe,Ir=r=>{var o,s,n,a;const{canvasDefaults:e}=r,t=r.hasLayout?Vr(r.layoutParams):oe;return{focus:{contentPadding:((o=e.focus)==null?void 0:o.contentPadding)??((s=e.focus)==null?void 0:s.contentOffset)??100,minContentScale:((n=e.focus)==null?void 0:n.minContentScale)??0,schedule:t,animationDuration:((a=e.focus)==null?void 0:a.animationDuration)??0}}},Fr=r=>({onNodeSelected:r.onNodeSelected,mouseDownEventVerifier:r.mouseDownEventVerifier??F.mouseDownEventVerifier,mouseUpEventVerifier:r.mouseUpEventVerifier??F.mouseUpEventVerifier,movementThreshold:r.movementThreshold??F.movementThreshold}),Ur=r=>({onCanvasSelected:r.onCanvasSelected,mouseDownEventVerifier:r.mouseDownEventVerifier??F.mouseDownEventVerifier,mouseUpEventVerifier:r.mouseUpEventVerifier??F.mouseUpEventVerifier,movementThreshold:r.movementThreshold??F.movementThreshold});class $r{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,"userSelectableNodesConfig");i(this,"userSelectableCanvasConfig");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 k);i(this,"window",window);i(this,"animationStaticNodes",new Set);i(this,"pointInsideVerifier");this.element=e,this.pointInsideVerifier=new pt(e,this.window)}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}enableUserSelectableNodes(e){return this.userSelectableNodesConfig=e,this}enableUserSelectableCanvas(e){return this.userSelectableCanvasConfig=e,this}build(){if(this.used)throw new Je("Failed to build Canvas because CanvasBuilder is a single-use object");this.used=!0;const e=new lt(this.element),t=new xe,o=new jt(this.element),s=this.createHtmlView(o.main,t,e),n=Rr(this.canvasDefaults),a=new We(t,s,n),h=Pr(this.layoutConfig),d=Ir({canvasDefaults:this.canvasDefaults,hasLayout:this.hasLayout,layoutParams:h}),c=new Ye(t,e,d,this.window),u=new Oe(e),g=new Be(t),l=new me(g,u,a,c);if(this.hasBackground&&ne.configure(l,er(this.backgroundConfig),o.background),this.hasNodeResizeReactiveEdges&&Z.configure(l),this.userSelectableNodesConfig!==void 0){const p=Fr(this.userSelectableNodesConfig);ue.configure(l,this.window,this.pointInsideVerifier,p)}if(this.userSelectableCanvasConfig!==void 0){const p=Ur(this.userSelectableCanvasConfig);ge.configure(l,o.main,this.window,this.pointInsideVerifier,p)}if(this.hasDraggableNodes){let p=Jt(this.dragConfig);this.hasAnimatedLayout&&(p=Tr(p,this.animationStaticNodes)),se.configure(l,o.main,this.window,this.pointInsideVerifier,p)}if(this.hasUserConnectablePorts){const p=tr(this.connectablePortsConfig,n.edges.shapeFactory,n.ports.direction);ae.configure(l,o.overlayConnectablePorts,e,this.window,this.pointInsideVerifier,p)}if(this.hasUserDraggableEdges){const p=rr(this.draggableEdgesConfig,l.graph);he.configure(l,o.overlayDraggableEdges,e,this.window,this.pointInsideVerifier,p)}if(this.virtualScrollConfig!==void 0?ie.configure(l,o.main,this.window,je(this.transformConfig),this.boxRenderingTrigger,this.pointInsideVerifier,or(this.virtualScrollConfig)):this.hasTransformableViewport&&K.configure(l,o.main,this.window,this.pointInsideVerifier,je(this.transformConfig)),this.hasLayout&&Xt.configure(l,h),this.hasAnimatedLayout){let p=mr(this.animatedLayoutConfig);this.hasDraggableNodes&&(Cr(l,this.animationStaticNodes),p=Mr(p,this.animationStaticNodes)),le.configure(l,p,this.window)}const w=()=>{o.destroy(),l.onBeforeDestroy.unsubscribe(w)};return l.onBeforeDestroy.subscribe(w),l}createHtmlView(e,t,o){let s=new ve(t,o,e);return this.virtualScrollConfig!==void 0&&(s=new ht(s,t,this.boxRenderingTrigger,sr(this.virtualScrollConfig))),s=new dt(s,t),s}}A.BezierEdgeShape=Re,A.CanvasBuilder=$r,A.CanvasBuilderError=Je,A.CanvasError=S,A.ConnectionCategory=T,A.DirectEdgeShape=ee,A.EventSubject=k,A.HorizontalEdgeShape=Ve,A.InteractiveEdgeError=$e,A.InteractiveEdgeShape=te,A.MidpointEdgeShape=Ft,A.StraightEdgeShape=Ie,A.VerticalEdgeShape=Fe,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(A,C){typeof exports=="object"&&typeof module<"u"?C(exports):typeof define=="function"&&define.amd?define(["exports"],C):(A=typeof globalThis<"u"?globalThis:A||self,C(A.HtmlGraph={}))})(this,function(A){"use strict";var Br=Object.defineProperty;var Wr=(A,C,I)=>C in A?Br(A,C,{enumerable:!0,configurable:!0,writable:!0,value:I}):A[C]=I;var i=(A,C,I)=>Wr(A,typeof C!="symbol"?C+"":C,I);var C=(r=>(r.Line="line",r.NodeCycle="node-cycle",r.PortCycle="port-cycle",r))(C||{});const I=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r.style.overflow="hidden",r},st=()=>{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},it=r=>{r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.visibility="hidden"},nt=r=>{r.style.removeProperty("position"),r.style.removeProperty("top"),r.style.removeProperty("left"),r.style.removeProperty("visibility"),r.style.removeProperty("transform")};class ve{constructor(e,t,o){i(this,"host",I());i(this,"container",st());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);it(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);nt(t.element),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.clear(),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-n*h.x,c=a.y-n*h.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),u=this.createEdgeRenderPort(s,a,h,d);let g=C.Line;o.element===s.element?g=C.PortCycle:o.nodeId===s.nodeId&&(g=C.NodeCycle),t.payload.shape.render({from:c,to:u,category:g})}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.width*s,height:t.height*s,direction:e.payload.direction}}}class at{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),u=Math.max(n.y,a.y);return h<=this.xTo&&d>=this.xFrom&&c<=this.yTo&&u>=this.yFrom}}class ht{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),u=this.graphStore.getPort(c.from).nodeId,g=this.graphStore.getPort(c.to).nodeId;h&&(this.renderingBox.hasNode(u)||(t.add(u),o.delete(u)),this.renderingBox.hasNode(g)||(t.add(g),o.delete(g))),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 at(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 dt{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 k{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 T=()=>{const r=new k;return[r,r]};class me{constructor(e,t,o,s){i(this,"beforeDestroyEmitter");i(this,"destroyed",!1);i(this,"onBeforeDestroy");this.graph=e,this.viewport=t,this.graphController=o,this.viewportController=s,[this.beforeDestroyEmitter,this.onBeforeDestroy]=T()}addNode(e){return this.graphController.addNode(e),this}updateNode(e,t){return this.graphController.updateNode(e,t),this}removeNode(e){return this.graphController.removeNode(e),this}markPort(e){return this.graphController.markPort(e),this}updatePort(e,t){return this.graphController.updatePort(e,t),this}unmarkPort(e){return this.graphController.unmarkPort(e),this}addEdge(e){return this.graphController.addEdge(e),this}updateEdge(e,t){return this.graphController.updateEdge(e,t),this}removeEdge(e){return this.graphController.removeEdge(e),this}clear(){return this.graphController.clear(),this}focus(e){return this.viewportController.focus(e),this}center(e,t){return this.viewportController.center(e,t),this}patchViewportMatrix(e){return this.viewportController.patchViewportMatrix(e),this}patchContentMatrix(e){return this.viewportController.patchContentMatrix(e),this}destroy(){this.destroyed||(this.destroyed=!0,this.beforeDestroyEmitter.emit(),this.graphController.destroy(),this.viewportController.destroy())}}class ct{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 S extends Error{constructor(){super(...arguments);i(this,"name","CanvasError")}}const b=Object.freeze({accessNonexistingNode:r=>`Failed to access node with ID ${JSON.stringify(r)} because it does not exist`,addNodeWithExistingId:r=>`Failed to add node with ID ${JSON.stringify(r)} because a node with this ID already exists`,addNodeWithElementInUse:(r,e)=>`Failed to add node with ID ${JSON.stringify(r)} because its HTML element is already attached to node with ID ${JSON.stringify(e)}`,updateNonexistentNode:r=>`Failed to update node with ID ${JSON.stringify(r)} because it does not exist`,removeNonexistentNode:r=>`Failed to remove node with ID ${JSON.stringify(r)} because it does not exist`,accessNonexistentPort:r=>`Failed to access port with ID ${JSON.stringify(r)} because it does not exist`,addPortWithExistingId:r=>`Failed to add port with ID ${JSON.stringify(r)} because a port with this ID already exists`,addPortToNonexistentNode:(r,e)=>`Failed to add port with ID ${JSON.stringify(r)} to node with ID ${JSON.stringify(e)} because the node does not exist`,updateNonexistentPort:r=>`Failed to update port with ID ${JSON.stringify(r)} because it does not exist`,accessPortsOfNonexistentNode:r=>`Failed to access ports of node with ID ${JSON.stringify(r)} because the node does not exist`,removeNonexistentPort:r=>`Failed to remove port with ID ${JSON.stringify(r)} because it does not exist`,accessNonexistentEdge:r=>`Failed to access edge with ID ${JSON.stringify(r)} because it does not exist`,addEdgeWithExistingId:r=>`Failed to add edge with ID ${JSON.stringify(r)} because an edge with this ID already exists`,addEdgeFromNonexistentPort:(r,e)=>`Failed to add edge with ID ${JSON.stringify(r)} from port with ID ${JSON.stringify(e)} because the port does not exist`,addEdgeToNonexistentPort:(r,e)=>`Failed to add edge with ID ${JSON.stringify(r)} to port with ID ${JSON.stringify(e)} because the port does not exist`,updateNonexistentEdge:r=>`Failed to update edge with ID ${JSON.stringify(r)} because it does not exist`,updateNonexistentEdgeSource:(r,e)=>`Failed to update source of edge with ID ${JSON.stringify(r)} because source port with ID ${JSON.stringify(e)} does not exist`,updateNonexistentEdgeTarget:(r,e)=>`Failed to update target of edge with ID ${JSON.stringify(r)} because target port with ID ${JSON.stringify(e)} does not exist`,removeNonexistentEdge:r=>`Failed to remove edge with ID ${JSON.stringify(r)} because it does not exist`,accessEdgesForNonexistentPort:r=>`Failed to access edges for port with ID ${JSON.stringify(r)} because the port does not exist`});class xe{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,"portOutgoingEdges",new Map);i(this,"portCycleEdges",new Map);i(this,"elementPorts",new ct);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]=T(),[this.afterNodeUpdatedEmitter,this.onAfterNodeUpdated]=T(),[this.afterNodePriorityUpdatedEmitter,this.onAfterNodePriorityUpdated]=T(),[this.beforeNodeRemovedEmitter,this.onBeforeNodeRemoved]=T(),[this.afterPortAddedEmitter,this.onAfterPortAdded]=T(),[this.afterPortUpdatedEmitter,this.onAfterPortUpdated]=T(),[this.beforePortRemovedEmitter,this.onBeforePortRemoved]=T(),[this.afterEdgeAddedEmitter,this.onAfterEdgeAdded]=T(),[this.afterEdgeShapeUpdatedEmitter,this.onAfterEdgeShapeUpdated]=T(),[this.afterEdgeUpdatedEmitter,this.onAfterEdgeUpdated]=T(),[this.afterEdgePriorityUpdatedEmitter,this.onAfterEdgePriorityUpdated]=T(),[this.beforeEdgeRemovedEmitter,this.onBeforeEdgeRemoved]=T(),[this.beforeClearEmitter,this.onBeforeClear]=T()}hasNode(e){return this.nodes.has(e)}getNode(e){const t=this.nodes.get(e);if(t===void 0)throw new S(b.accessNonexistingNode(e));return t}addNode(e){if(this.hasNode(e.id))throw new S(b.addNodeWithExistingId(e.id));const t=this.findNodeIdByElement(e.element);if(t!==void 0)throw new S(b.addNodeWithElementInUse(e.id,t));const o=new Map,s={element:e.element,payload:{x:e.x,y:e.y,centerFn:e.centerFn,priority:e.priority},ports:o};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 S(b.updateNonexistentNode(e));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){if(!this.hasNode(e))throw new S(b.removeNonexistentNode(e));this.beforeNodeRemovedEmitter.emit(e);const t=this.getNode(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 S(b.accessNonexistentPort(e));return t}addPort(e){if(this.hasPort(e.id))throw new S(b.addPortWithExistingId(e.id));if(!this.hasNode(e.nodeId))throw new S(b.addPortToNonexistentNode(e.id,e.nodeId));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.portOutgoingEdges.set(e.id,new Set),this.getNode(e.nodeId).ports.set(e.id,e.element),this.afterPortAddedEmitter.emit(e.id)}updatePort(e,t){if(!this.hasPort(e))throw new S(b.updateNonexistentPort(e));const o=this.getPort(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 S(b.accessPortsOfNonexistentNode(e));return Array.from(t.ports.keys())}removePort(e){if(!this.hasPort(e))throw new S(b.removeNonexistentPort(e));const t=this.getPort(e).nodeId;this.beforePortRemovedEmitter.emit(e),this.getNode(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 S(b.accessNonexistentEdge(e));return t}addEdge(e){if(this.hasEdge(e.id))throw new S(b.addEdgeWithExistingId(e.id));if(!this.hasPort(e.from))throw new S(b.addEdgeFromNonexistentPort(e.id,e.from));if(!this.hasPort(e.to))throw new S(b.addEdgeToNonexistentPort(e.id,e.to));this.addEdgeInternal(e),this.afterEdgeAddedEmitter.emit(e.id)}updateEdge(e,t){if(!this.hasEdge(e))throw new S(b.updateNonexistentEdge(e));if(t.from!==void 0||t.to!==void 0){if(t.from!==void 0&&!this.hasPort(t.from))throw new S(b.updateNonexistentEdgeSource(e,t.from));if(t.to!==void 0&&!this.hasPort(t.to))throw new S(b.updateNonexistentEdgeTarget(e,t.to));const s=this.getEdge(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){if(!this.hasEdge(e))throw new S(b.removeNonexistentEdge(e));this.beforeEdgeRemovedEmitter.emit(e),this.removeEdgeInternal(e)}clear(){this.beforeClearEmitter.emit(),this.portIncomingEdges.clear(),this.portOutgoingEdges.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 S(b.accessEdgesForNonexistentPort(e));return Array.from(t)}getPortOutgoingEdgeIds(e){const t=this.portOutgoingEdges.get(e);if(t===void 0)throw new S(b.accessEdgesForNonexistentPort(e));return Array.from(t)}getPortCycleEdgeIds(e){const t=this.portCycleEdges.get(e);if(t===void 0)throw new S(b.accessEdgesForNonexistentPort(e));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.portOutgoingEdges.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{from:t,to:o}=this.getEdge(e);this.portCycleEdges.get(t).delete(e),this.portCycleEdges.get(o).delete(e),this.portIncomingEdges.get(t).delete(e),this.portIncomingEdges.get(o).delete(e),this.portOutgoingEdges.get(t).delete(e),this.portOutgoingEdges.get(o).delete(e),this.edges.delete(e)}}const Ee=r=>({scale:1/r.scale,x:-r.x/r.scale,y:-r.y/r.scale}),Ae={scale:1,x:0,y:0},Se=(r,e)=>({x:r.scale*e.x+r.x,y:r.scale*e.y+r.y});class lt{constructor(e){i(this,"viewportMatrix",Ae);i(this,"contentMatrix",Ae);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]=T(),[this.beforeUpdateEmitter,this.onBeforeUpdated]=T(),[this.afterResizeEmitter,this.onAfterResize]=T(),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=Ee(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=Ee(this.contentMatrix),this.afterUpdateEmitter.emit()}getDimensions(){const{width:e,height:t}=this.host.getBoundingClientRect();return{width:e,height:t}}createContentCoords(e){return Se(this.viewportMatrix,e)}createViewportCoords(e){return Se(this.contentMatrix,e)}destroy(){this.observer.disconnect()}}class Z{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,"reset",()=>{this.nodesResizeObserver.disconnect(),this.elementToNodeId.clear()});i(this,"revert",()=>{this.reset()});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.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e){new Z(e)}handleNodeResize(e){const t=this.elementToNodeId.get(e);this.canvas.updateNode(t)}}const ut=(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},gt=(r,e,t)=>e>=0&&e<=r.innerWidth&&t>=0&&t<=r.innerHeight;class pt{constructor(e,t){this.element=e,this.win=t}verify(e,t){return ut(this.element,e,t)&>(this.win,e,t)}}const Y=(r,e)=>{e!==null?r.style.cursor=e:r.style.removeProperty("cursor")},X=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}]}},wt=(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"}};function*Ne(r,e){const t=r.elementsFromPoint(e.x,e.y);for(const o of t){if(o.shadowRoot!==null){const s=Ne(o.shadowRoot,e);for(const n of s)yield n}yield o}}const be=(r,e)=>{const t=Ne(document,e);for(const o of t){const s=wt(r,o);if(s.status==="portFound")return s.portId;if(s.status==="nodeEncountered")return null}return null};var L=(r=>(r.StaticNodeId="static",r.DraggingNodeId="dragging",r.EdgeId="edge",r))(L||{});const Pe=(r,e)=>({x:r/2,y:e/2}),m=(r,e,t)=>({x:e.x*r.x-e.y*r.y+((1-e.x)*t.x+e.y*t.y),y:e.y*r.x+e.x*r.y+((1-e.x)*t.y-e.y*t.x)}),Ce=(r,e,t)=>{const o={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},n=Math.min(o.x,s.x)-t,a=Math.min(o.y,s.y)-t,h=2*t,d=Math.abs(s.x-o.x)+h,c=Math.abs(s.y-o.y)+h;return{x:n,y:a,width:d,height:c,from:{x:o.x-n,y:o.y-a},to:{x:s.x-n,y:s.y-a}}};class yt{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,arrowLength:s,fromDir:n,toDir:a,curvature:h,hasSourceArrow:d,hasTargetArrow:c}=e,u=(t.x+o.x)/2,g=(t.y+o.y)/2;this.midpoint={x:u,y:g};const l=m({x:t.x+s,y:t.y},n,t),w=m({x:o.x-s,y:o.y},a,o),p={x:l.x+n.x*h,y:l.y+n.y*h},y={x:w.x-a.x*h,y:w.y-a.y*h},f=`M ${l.x} ${l.y} C ${p.x} ${p.y}, ${y.x} ${y.y}, ${w.x} ${w.y}`,x=d?"":`M ${t.x} ${t.y} L ${l.x} ${l.y} `,E=c?"":` M ${w.x} ${w.y} L ${o.x} ${o.y}`;this.path=`${x}${f}${E}`}}class ft{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,curvature:s,fromDir:n,toDir:a,detourDir:h,from:d,to:c,arrowLength:u,detourDistance:g}=e,l=t?m({x:d.x+u,y:d.y},n,d):d,w=o?m({x:c.x-u,y:c.y},a,c):c,p=Math.cos(h)*g,y=Math.sin(h)*g,f=m({x:d.x+u,y:d.y},n,d),x={x:f.x+p,y:f.y+y},E=m({x:c.x-u,y:c.y},a,c),P={x:E.x+p,y:E.y+y},M={x:(x.x+P.x)/2,y:(x.y+P.y)/2},D={x:f.x+s*n.x,y:f.y+s*n.y},W={x:E.x-s*a.x,y:E.y-s*a.y},O={x:f.x+p,y:f.y+y},z={x:E.x+p,y:E.y+y};this.path=[`M ${l.x} ${l.y}`,`L ${f.x} ${f.y}`,`C ${D.x} ${D.y} ${O.x} ${O.y} ${M.x} ${M.y}`,`C ${z.x} ${z.y} ${W.x} ${W.y} ${E.x} ${E.y}`,`L ${w.x} ${w.y}`].join(" "),this.midpoint=M}}const _=Object.freeze({edgeColor:"--edge-color"}),Te=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(_.edgeColor,r),e},Me=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke",`var(${_.edgeColor})`),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e},H=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","path");return r.setAttribute("fill",`var(${_.edgeColor})`),r},De=(r,e)=>{r.style.transform=`translate(${e.x}px, ${e.y}px)`,r.style.width=`${e.width}px`,r.style.height=`${e.height}px`},R=(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,u=0,g=0;const l=d>0,w=d<o,p=l&&w;if(l&&(c=-s,u=-n,g=a),w){const D=r[d+1];s=D.x-h.x,n=D.y-h.y,a=Math.sqrt(s*s+n*n)}const f=a!==0?Math.min((p?e:0)/a,d<o-1?.5:1):0,x=p?{x:h.x+s*f,y:h.y+n*f}:h,P=g!==0?Math.min((p?e:0)/g,d>1?.5:1):0,M=p?{x:h.x+c*P,y:h.y+u*P}:h;d>0&&t.push(`L ${M.x} ${M.y}`),p&&t.push(`C ${h.x} ${h.y} ${h.x} ${h.y} ${x.x} ${x.y}`)})}return t.join(" ")},vt=(r,e)=>{const t=e.x-r.x>=0,o=r.dirX>=0,s=e.dirX>=0;if(o===s){const c=o===t,u=(r.x+e.x)/2,g=(r.y+e.y)/2,l={x:u,y:g};return c?{points:[{x:r.x,y:r.y},{x:l.x,y:r.y},{x:l.x,y:e.y},{x:e.x,y:e.y}],midpoint:l}:{points:[{x:r.x,y:r.y},{x:r.x,y:l.y},{x:e.x,y:l.y},{x:e.x,y:e.y}],midpoint:l}}const a=o===t,h=(r.y+e.y)/2;if(a){const c={x:e.x,y:r.y};return{points:[{x:r.x,y:r.y},c,{x:e.x,y:e.y}],midpoint:{x:c.x,y:h}}}const d={x:r.x,y:e.y};return{points:[{x:r.x,y:r.y},d,{x:e.x,y:e.y}],midpoint:{x:d.x,y:h}}};class mt{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,fromDir:s,toDir:n,arrowLength:a,arrowOffset:h,roundness:d,hasSourceArrow:c,hasTargetArrow:u}=e,g=c?m({x:t.x+a,y:t.y},s,t):t,l=u?m({x:o.x-a,y:o.y},n,o):o,w=a+h,p=m({x:t.x+w,y:t.y},s,t),y=m({x:o.x-w,y:o.y},n,o),f=vt({x:p.x,y:p.y,dirX:s.x},{x:y.x,y:y.y,dirX:n.x});this.path=R([g,...f.points,l],d),this.midpoint=f.midpoint}}class xt{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,from:s,to:n,arrowLength:a,fromDir:h,toDir:d,arrowOffset:c,detourDir:u,detourDistance:g,roundness:l}=e,w=t?m({x:s.x+a,y:s.y},h,s):s,p=o?m({x:n.x-a,y:n.y},d,n):n,y=a+c,f=Math.cos(u)*g,x=Math.sin(u)*g,E=m({x:s.x+y,y:s.y},h,s),P={x:E.x+f,y:E.y+x},M=m({x:n.x-y,y:n.y},d,n),D={x:M.x+f,y:M.y+x};this.midpoint={x:(P.x+D.x)/2,y:(P.y+D.y)/2},this.path=R([w,E,P,D,M,p],l)}}class Et{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,hasSourceArrow:s,hasTargetArrow:n,arrowLength:a,fromDir:h,toDir:d,arrowOffset:c,roundness:u}=e,g=this.createArrowPoint(s,h,t,a),l=this.createArrowPoint(n,d,o,-a),w=a+c,p={x:t.x+w,y:t.y},y=m(p,h,t),f={x:o.x-w,y:o.y},x=m(f,d,o);this.path=R([g,y,x,l],u);const E=(y.x+x.x)/2,P=(y.y+x.y)/2;this.midpoint={x:E,y:P}}createArrowPoint(e,t,o,s){if(!e)return o;const n={x:o.x+s,y:o.y};return m(n,t,o)}}const At=(r,e)=>{const t=e.y-r.y>=0,o=r.dirY>=0,s=e.dirY>=0;if(o===s){const c=o===t,u=(r.x+e.x)/2,g=(r.y+e.y)/2,l={x:u,y:g};return c?{points:[{x:r.x,y:r.y},{x:r.x,y:l.y},{x:e.x,y:l.y},{x:e.x,y:e.y}],midpoint:l}:{points:[{x:r.x,y:r.y},{x:l.x,y:r.y},{x:l.x,y:e.y},{x:e.x,y:e.y}],midpoint:l}}const a=o===t,h=(r.x+e.x)/2;if(a){const c={x:r.x,y:e.y};return{points:[{x:r.x,y:r.y},c,{x:e.x,y:e.y}],midpoint:{x:h,y:c.y}}}const d={x:e.x,y:r.y};return{points:[{x:r.x,y:r.y},d,{x:e.x,y:e.y}],midpoint:{x:h,y:d.y}}};class St{constructor(e){i(this,"path");i(this,"midpoint");const{from:t,to:o,hasSourceArrow:s,hasTargetArrow:n,arrowLength:a,arrowOffset:h,fromDir:d,toDir:c,roundness:u}=e,g=s?m({x:t.x+a,y:t.y},d,t):t,l=n?m({x:o.x-a,y:o.y},c,o):o,w=a+h,p=m({x:t.x+w,y:t.y},d,t),y=m({x:o.x-w,y:o.y},c,o),f=At({x:p.x,y:p.y,dirY:d.y},{x:y.x,y:y.y,dirY:c.y});this.path=R([g,...f.points,l],u),this.midpoint=f.midpoint}}class q{constructor(e){i(this,"path");i(this,"midpoint");const{side:t,arrowLength:o,arrowOffset:s,dir:n,origin:a,hasArrow:h}=e,d=o+s,c=d+2*t,g=[{x:o,y:0},{x:d,y:0},{x:d,y:t},{x:c,y:t},{x:c,y:-t},{x:d,y:-t},{x:d,y:0},{x:o,y:0}].map(w=>m(w,n,{x:0,y:0})).map(w=>({x:w.x+a.x,y:w.y+a.y})),l=`M ${a.x} ${a.y} L ${g[0].x} ${g[0].y} `;this.path=`${h?"":l}${R(g,e.roundness)}`,this.midpoint={x:(g[3].x+g[4].x)/2,y:(g[3].y+g[4].y)/2}}}class Nt{constructor(e){i(this,"path");i(this,"midpoint");const{arrowLength:t,radius:o,smallRadius:s,dir:n,origin:a,hasArrow:h}=e,d=s+o,c=s*o/d,u=Math.sqrt(d*d-s*s),g=u*s/d,l=u+o+t,w=t+g,y=[{x:t,y:0},{x:w,y:c},{x:w,y:-c},{x:l,y:0}].map(E=>m(E,n,{x:0,y:0})).map(E=>({x:E.x+a.x,y:E.y+a.y})),f=[`M ${y[0].x} ${y[0].y}`,`A ${s} ${s} 0 0 1 ${y[1].x} ${y[1].y}`,`A ${o} ${o} 0 1 0 ${y[2].x} ${y[2].y}`,`A ${s} ${s} 0 0 1 ${y[0].x} ${y[0].y}`].join(" "),x=`M ${a.x} ${a.y} L ${y[0].x} ${y[0].y} `;this.path=`${h?"":x}${f}`,this.midpoint=y[3]}}class bt{constructor(e){i(this,"path");i(this,"midpoint");i(this,"diagonalDistance");const{from:t,to:o,sourceOffset:s,targetOffset:n,hasSourceArrow:a,hasTargetArrow:h,arrowLength:d}=e;this.midpoint={x:(t.x+o.x)/2,y:(t.y+o.y)/2};const c=o.x-t.x,u=o.y-t.y;if(this.diagonalDistance=Math.sqrt(c*c+u*u),this.diagonalDistance===0){this.path="";return}const g={x:c,y:u},l=this.createDirectLinePoint({offset:s,hasArrow:a,flip:1,shift:t,arrowLength:d,dir:g}),w=this.createDirectLinePoint({offset:n,hasArrow:h,flip:-1,shift:o,arrowLength:d,dir:g});this.path=`M ${l.x} ${l.y} L ${w.x} ${w.y}`}createDirectLinePoint(e){const t=e.hasArrow?e.arrowLength:0,o=e.offset+t,s=e.flip*o/this.diagonalDistance,{dir:n,shift:a}=e;return{x:n.x*s+a.x,y:n.y*s+a.y}}}const Pt=(r,e,t)=>{const o=Math.max(r.y,e.y),s=Math.min(r.y,e.y);return(t>=0?o:s)+t};class Ct{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,arrowLength:s,from:n,to:a,fromDir:h,toDir:d,arrowOffset:c,roundness:u,detourDistance:g}=e,l=t?m({x:n.x+s,y:n.y},h,n):n,w=o?m({x:a.x-s,y:a.y},d,a):a,p=s+c,y=m({x:n.x+p,y:n.y},h,n),f=m({x:a.x-p,y:a.y},d,a),x=Pt(y,f,g);this.midpoint={x:(y.x+f.x)/2,y:x},this.path=R([l,y,{x:y.x,y:x},{x:f.x,y:x},f,w],u)}}const Tt=(r,e,t)=>{const o=Math.max(r.x,e.x),s=Math.min(r.x,e.x);return(t>=0?o:s)+t};class Mt{constructor(e){i(this,"path");i(this,"midpoint");const{hasSourceArrow:t,hasTargetArrow:o,arrowLength:s,fromDir:n,toDir:a,from:h,to:d,arrowOffset:c,detourDistance:u,roundness:g}=e,l=t?m({x:h.x+s,y:h.y},n,h):h,w=o?m({x:d.x-s,y:d.y},a,d):d,p=s+c,y=m({x:h.x+p,y:h.y},n,h),f=m({x:d.x-p,y:d.y},a,d),x=Tt(y,f,u);this.midpoint={x,y:(y.y+f.y)/2},this.path=R([l,y,{x,y:y.y},{x,y:f.y},f,w],g)}}const v=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}),Le=r=>({x:Math.cos(r),y:Math.sin(r)});class G{constructor(e){i(this,"svg");i(this,"group",document.createElementNS("http://www.w3.org/2000/svg","g"));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]=T(),this.arrowRenderer=this.params.arrowRenderer,this.svg=Te(e.color),this.svg.appendChild(this.group),this.line=Me(e.width),this.group.appendChild(this.line),e.hasSourceArrow&&(this.sourceArrow=H(),this.group.appendChild(this.sourceArrow)),e.hasTargetArrow&&(this.targetArrow=H(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:o,width:s,height:n,from:a,to:h}=Ce(e.from,e.to,this.params.padding);De(this.svg,{x:t,y:o,width:s,height:n});const d=Le(e.from.direction),c=Le(e.to.direction);let u={x:-c.x,y:-c.y},g;e.category===C.PortCycle?(g=this.params.createCyclePath,u=d):e.category===C.NodeCycle?g=this.params.createDetourPath:g=this.params.createLinePath;const l=g(a,h,d,c);this.line.setAttribute("d",l.path);let w=null;this.sourceArrow&&(w=this.arrowRenderer({direction:d,shift:a,arrowLength:this.params.arrowLength}),this.sourceArrow.setAttribute("d",w));let p=null;this.targetArrow&&(p=this.arrowRenderer({direction:u,shift:h,arrowLength:this.params.arrowLength}),this.targetArrow.setAttribute("d",p)),this.afterRenderEmitter.emit({edgePath:l,sourceArrowPath:w,targetArrowPath:p})}}const Dt=r=>e=>{const o=[{x:0,y:0},{x:e.arrowLength,y:r.radius},{x:e.arrowLength,y:-r.radius}].map(h=>m(h,e.direction,{x:0,y:0})).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`},Lt=r=>e=>{const t=r.radius,o=e.arrowLength,s=(o*o+2*o*t)/(2*t),n=s+t,a=o+t-t*(o+t)/n,h=t*s/n,c=[{x:0,y:0},{x:a,y:-h},{x:a,y:h}].map(p=>m(p,e.direction,{x:0,y:0})).map(p=>({x:p.x+e.shift.x,y:p.y+e.shift.y})),u=`M ${c[0].x} ${c[0].y}`,g=`A ${s} ${s} 0 0 0 ${c[1].x} ${c[1].y}`,l=`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`${u} ${g} ${l} ${w}`},Rt=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=[{x:0,y:0},{x:s.x,y:-s.y},s].map(g=>m(g,e.direction,{x:0,y:0})).map(g=>({x:g.x+e.shift.x,y:g.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}`,u=`A ${o} ${o} 0 0 1 ${a[0].x} ${a[0].y}`;return`${h} ${d} ${c} ${u}`},U=r=>{if(typeof r=="function")return r;switch(r.type){case"triangle":return Dt({radius:r.radius??v.polygonArrowRadius});case"arc":return Lt({radius:r.radius??v.circleArrowRadius});default:return Rt({smallRadius:r.smallRadius??v.wedgeArrowSmallRadius,angle:r.angle??v.wedgeArrowAngle,radius:r.radius??v.wedgeArrowRadius})}},$=50;class Re{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,t,o)=>new Nt({origin:e,dir:o,radius:this.portCycleRadius,smallRadius:this.portCycleSmallRadius,arrowLength:this.arrowLength,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new ft({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,detourDir:this.detourDirection,detourDistance:this.detourDistance,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o,s)=>new yt({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.curvature=(e==null?void 0:e.curvature)??v.curvature,this.portCycleRadius=(e==null?void 0:e.cycleRadius)??v.cycleRadius,this.portCycleSmallRadius=(e==null?void 0:e.smallCycleRadius)??v.smallCycleRadius,this.detourDirection=(e==null?void 0:e.detourDirection)??v.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 Ve{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,t,o)=>new q({origin:e,dir:o,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new Ct({from:e,to:t,fromDir:o,toDir:s,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 mt({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??v.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??v.cycleSquareSide;const t=(e==null?void 0:e.roundness)??v.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 Ie{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,t,o)=>new q({origin:e,dir:o,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new xt({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDir:this.detourDirection,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));i(this,"createLinePath",(e,t,o,s)=>new Et({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??v.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??v.cycleSquareSide;const t=(e==null?void 0:e.roundness)??v.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDirection=(e==null?void 0:e.detourDirection)??v.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 Fe{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,t,o)=>new q({origin:e,dir:o,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasArrow:this.hasSourceArrow||this.hasTargetArrow}));i(this,"createDetourPath",(e,t,o,s)=>new Mt({from:e,to:t,fromDir:o,toDir:s,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 St({from:e,to:t,fromDir:o,toDir:s,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??v.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??v.cycleSquareSide;const t=(e==null?void 0:e.roundness)??v.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??v.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??v.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??v.hasTargetArrow,this.pathShape=new G({color:(e==null?void 0:e.color)??v.color,width:(e==null?void 0:e.width)??v.width,arrowRenderer:U((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath,padding:$}),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 ee{constructor(e){i(this,"svg");i(this,"group",document.createElementNS("http://www.w3.org/2000/svg","g"));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]=T(),this.color=(e==null?void 0:e.color)??v.color,this.width=(e==null?void 0:e.width)??v.width,this.arrowLength=(e==null?void 0:e.arrowLength)??v.arrowLength,this.arrowRenderer=U((e==null?void 0:e.arrowRenderer)??{}),this.sourceOffset=(e==null?void 0:e.sourceOffset)??v.preOffset,this.targetOffset=(e==null?void 0:e.targetOffset)??v.preOffset,this.svg=Te(this.color),this.svg.appendChild(this.group),this.line=Me(this.width),this.group.appendChild(this.line),e!=null&&e.hasSourceArrow&&(this.sourceArrow=H(),this.group.appendChild(this.sourceArrow)),e!=null&&e.hasTargetArrow&&(this.targetArrow=H(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:o,width:s,height:n,from:a,to:h}=Ce(e.from,e.to,$);De(this.svg,{x:t,y:o,width:s,height:n});const d=new bt({from:a,to:h,sourceOffset:this.sourceOffset,targetOffset:this.targetOffset,hasSourceArrow:this.sourceArrow!==null,hasTargetArrow:this.targetArrow!==null,arrowLength:this.arrowLength});this.line.setAttribute("d",d.path);let c=null,u=null;const g=d.diagonalDistance;if(g===0)this.sourceArrow!==null&&(c="",this.sourceArrow.setAttribute("d",c)),this.targetArrow!==null&&(u="",this.targetArrow.setAttribute("d",u));else{const l={x:(h.x-a.x)/g,y:(h.y-a.y)/g};if(this.sourceArrow){const w={x:l.x*this.sourceOffset,y:l.y*this.sourceOffset};c=this.arrowRenderer({direction:l,shift:w,arrowLength:this.arrowLength}),this.sourceArrow.setAttribute("d",c)}if(this.targetArrow){const w={x:l.x*this.targetOffset,y:l.y*this.targetOffset};u=this.arrowRenderer({direction:{x:-l.x,y:-l.y},shift:{x:h.x-w.x,y:h.y-w.y},arrowLength:this.arrowLength}),this.targetArrow.setAttribute("d",u)}}this.afterRenderEmitter.emit({edgePath:d,sourceArrowPath:c,targetArrowPath:u})}}const Vt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.pointerEvents="auto",r.style.cursor="pointer",r},It=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},Ue=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 $e extends Error{constructor(e){super(e),this.name="InteractiveEdgeError"}}class te{constructor(e,t){i(this,"svg");i(this,"group");i(this,"line");i(this,"sourceArrow");i(this,"targetArrow");i(this,"handle",Vt());i(this,"onAfterRender");i(this,"interactiveLine");i(this,"interactiveSourceArrow",null);i(this,"interactiveTargetArrow",null);if(this.baseEdge=e,e instanceof te)throw new $e("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)??v.interactiveWidth;this.interactiveLine=It(o),this.handle.appendChild(this.interactiveLine),this.sourceArrow&&(this.interactiveSourceArrow=Ue(o),this.handle.appendChild(this.interactiveSourceArrow)),this.targetArrow&&(this.interactiveTargetArrow=Ue(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 Ft{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 Be{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 re{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 We{constructor(e,t,o){i(this,"nodeIdGenerator",new re(e=>this.graphStore.hasNode(e)));i(this,"portIdGenerator",new re(e=>this.graphStore.hasPort(e)));i(this,"edgeIdGenerator",new re(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()});this.graphStore=e,this.htmlView=t,this.params=o,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)}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 o of e.ports)this.markPort({id:o.id,element:o.element,nodeId:t,direction:o.direction})}updateNode(e,t){this.graphStore.updateNode(e,t??{})}removeNode(e){this.graphStore.removeNode(e)}markPort(e){const t=this.portIdGenerator.create(e.id);this.graphStore.addPort({id:t,element:e.element,nodeId:e.nodeId,direction:e.direction??this.params.ports.direction})}updatePort(e,t){this.graphStore.updatePort(e,t??{})}unmarkPort(e){this.graphStore.removePort(e)}addEdge(e){const t=this.edgeIdGenerator.create(e.id);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()})}updateEdge(e,t){this.graphStore.updateEdge(e,t??{})}removeEdge(e){this.graphStore.removeEdge(e)}clear(){this.graphStore.clear()}destroy(){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()}}const Ut=r=>{setTimeout(()=>{r()})},$t=r=>{queueMicrotask(()=>{r()})},oe=r=>{r()};class Oe{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 Bt=(r,e)=>Symbol.iterator in r?{minContentScale:e.focus.minContentScale,nodes:r,contentPadding:e.focus.contentPadding,animationDuration:e.focus.animationDuration}:{minContentScale:r.minContentScale??e.focus.minContentScale,nodes:r.nodes??[],contentPadding:r.contentPadding??r.contentOffset??e.focus.contentPadding,animationDuration:r.animationDuration??e.focus.animationDuration},ze=(r,e,t)=>({scale:r.scale,x:r.x+r.scale*e,y:r.y+r.scale*t}),ke=(r,e,t,o)=>({scale:r.scale*e,x:r.scale*(1-e)*t+r.x,y:r.scale*(1-e)*o+r.y});class Ye{constructor(e,t,o,s){this.graphStore=e,this.viewportStore=t,this.params=o,this.win=s}patchViewportMatrix(e){this.viewportStore.patchViewportMatrix(e)}patchContentMatrix(e){this.viewportStore.patchContentMatrix(e)}center(e,t){const{width:o,height:s}=this.viewportStore.getDimensions(),n={x:o/2,y:s/2},a=this.viewportStore.getViewportMatrix(),h=this.viewportStore.createViewportCoords(e),d=h.x-n.x,c=h.y-n.y;let u=ze(a,d,c);const g=t==null?void 0:t.contentScale;if(g!==void 0){const w=1/g;u=ke(u,w/a.scale,n.x,n.y)}const l=(t==null?void 0:t.animationDuration)??0;l>0?this.animateNavigation(a,u,l):this.viewportStore.patchViewportMatrix(u)}focus(e){const t=Bt(e??{},this.params);this.params.focus.schedule(()=>{this.navigate(t)})}destroy(){this.viewportStore.destroy()}navigate(e){let t=1/0,o=-1/0,s=1/0,n=-1/0,a=0;const h=new Set;for(const d of e.nodes)h.add(d);if(this.graphStore.getAllNodeIds().forEach(d=>{const{payload:c}=this.graphStore.getNode(d);c.x!==null&&c.y!==null&&(h.size===0||h.has(d))&&(t=Math.min(c.x,t),o=Math.max(c.x,o),s=Math.min(c.y,s),n=Math.max(c.y,n),a++)}),a>0){t-=e.contentPadding,s-=e.contentPadding,o+=e.contentPadding,n+=e.contentPadding;const d={x:(t+o)/2,y:(s+n)/2},{scale:c}=this.viewportStore.getContentMatrix(),u=(n-s)*c,g=(o-t)*c,{width:l,height:w}=this.viewportStore.getDimensions(),p=Math.max(g/l,u/w),y=p>1?c/p:c,f=Math.max(y,e.minContentScale);this.center(d,{contentScale:f,animationDuration:e.animationDuration})}}animateNavigation(e,t,o){let s;const n={scale:t.scale-e.scale,x:t.x-e.x,y:t.y-e.y},a=h=>{s===void 0&&(s=h);const d=Math.min((h-s)/o,1);d<=1&&this.viewportStore.patchViewportMatrix({scale:e.scale+d*n.scale,x:e.x+d*n.x,y:e.y+d*n.y}),d<1&&this.win.requestAnimationFrame(a)};this.win.requestAnimationFrame(a)}}const Xe=(r,e,t)=>{const o=new xe,s=new Be(o),n=new Oe(e),a=new ve(o,e,r),h={nodes:{centerFn:Pe,priorityFn:()=>0},edges:{shapeFactory:()=>new ee,priorityFn:()=>0},ports:{direction:0}},d=new We(o,a,h),c={focus:{contentPadding:0,minContentScale:0,schedule:oe,animationDuration:0}},u=new Ye(o,e,c,t);return new me(s,n,d,u)};class j{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(!this.pointInsideVerifier.verify(e.clientX,e.clientY)){this.params.onPointerMoveOutside(),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(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.params.onPointerMoveOutside(),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,"reset",()=>{this.canvas.graph.getAllPortIds().forEach(e=>{const t=this.canvas.graph.getPort(e);this.unhookPortEvents(t.element)})});i(this,"revert",()=>{this.params.onStopDrag(),this.reset(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.window=t,this.pointInsideVerifier=o,this.params=s,this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked),this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked),this.canvas.graph.onBeforeClear.subscribe(this.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e,t,o,s){new j(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 Wt{constructor(e,t,o){this.canvas=e,this.layoutAlgorithm=t,this.params=o}apply(){const e=this.layoutAlgorithm.calculateCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport});this.params.onBeforeApplied(),e.forEach((t,o)=>{this.params.staticNodeResolver(o)||this.canvas.updateNode(o,t)}),this.params.onAfterApplied()}}class Ot{constructor(e,t,o){this.canvas=e,this.layoutAlgorithm=t,this.params=o}apply(e){const t=this.layoutAlgorithm.calculateNextCoordinates({graph:this.canvas.graph,viewport:this.canvas.viewport,dt:e});this.params.onBeforeApplied(),t.forEach((o,s)=>{this.params.staticNodeResolver(s)||this.canvas.updateNode(s,o)}),this.params.onAfterApplied()}}class se{constructor(e,t,o,s,n){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,"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},Y(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(!this.pointInsideVerifier.verify(e.clientX,e.clientY)){this.stopMouseDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:e.clientX,y:e.clientY})});i(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.stopMouseDrag()});i(this,"onWindowTouchMove",e=>{if(e.touches.length!==1)return;const t=e.touches[0];if(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.stopTouchDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:t.clientX,y:t.clientY})});i(this,"onWindowTouchFinish",()=>{this.stopTouchDrag()});i(this,"reset",()=>{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,"revert",()=>{this.reset(),this.removeMouseDragListeners(),this.removeTouchDragListeners()});this.canvas=e,this.element=t,this.window=o,this.pointInsideVerifier=s,this.params=n,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.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e,t,o,s,n){new se(e,t,o,s,n)}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})}}stopMouseDrag(){this.grabbedNode!==null&&this.graph.hasNode(this.grabbedNode.nodeId)&&this.params.onNodeDragFinished(this.grabbedNode.nodeId),this.grabbedNode=null,Y(this.element,null),this.removeMouseDragListeners()}removeMouseDragListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}stopTouchDrag(){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 J=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 K{constructor(e,t,o,s,n){i(this,"viewport");i(this,"prevTouches",null);i(this,"wheelFinishTimer",null);i(this,"transformInProgress",!1);i(this,"revert",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});i(this,"onMouseDown",e=>{this.params.mouseDownEventVerifier(e)&&(Y(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=this.pointInsideVerifier.verify(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=J(e);return}this.prevTouches=J(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=J(e);if(!t.touches.every(s=>this.pointInsideVerifier.verify(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=J(e):this.stopTouchDrag()});i(this,"preventWheelScaleListener",e=>{e.preventDefault()});this.canvas=e,this.element=t,this.window=o,this.pointInsideVerifier=s,this.params=n,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.revert)}static configure(e,t,o,s,n){new K(e,t,o,s,n)}moveViewport(e,t){const o=this.viewport.getViewportMatrix(),s=ze(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=ke(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(){Y(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 ie{constructor(e,t,o,s,n,a,h){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.pointInsideVerifier=a,this.params=h,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 d={...s,onResizeTransformStarted:()=>{this.userTransformInProgress=!0,s.onResizeTransformStarted()},onResizeTransformFinished:()=>{this.userTransformInProgress=!1,s.onResizeTransformFinished()},onBeforeTransformChange:()=>{this.userTransformInProgress=!0,s.onBeforeTransformChange()},onTransformChange:()=>{this.userTransformInProgress=!1;const c=this.currentScale;this.currentScale=this.viewport.getViewportMatrix().scale,c!==this.currentScale&&this.scheduleEnsureViewportAreaLoaded(),s.onTransformChange()},onTransformFinished:()=>{this.scheduleLoadAreaAroundViewport(),s.onTransformFinished()}};K.configure(e,this.element,this.window,this.pointInsideVerifier,d),this.trigger.subscribe(this.updateLoadedArea),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated)}static configure(e,t,o,s,n,a,h){new ie(e,t,o,s,n,a,h)}scheduleLoadAreaAroundViewport(){setTimeout(()=>{this.loadAreaAroundViewport()})}scheduleEnsureViewportAreaLoaded(){setTimeout(()=>{const{width:e,height:t}=this.viewport.getDimensions(),{scale:o,x:s,y:n}=this.viewport.getViewportMatrix(),a=e*o,h=t*o,d=s-this.nodeHorizontal,c=n-this.nodeVertical,u=s+a+this.nodeHorizontal,g=n+h+this.nodeVertical;this.loadedArea.xFrom<d&&this.loadedArea.xTo>u&&this.loadedArea.yFrom<c&&this.loadedArea.yTo>g||this.loadAreaAroundViewport()})}loadAreaAroundViewport(){const{width:e,height:t}=this.viewport.getDimensions(),{scale:o,x:s,y:n}=this.viewport.getViewportMatrix(),a=e*o,h=t*o,d=s-a-this.nodeHorizontal,c=n-h-this.nodeVertical,u=3*a+2*this.nodeHorizontal,g=3*h+2*this.nodeVertical;this.trigger.emit({x:d,y:c,width:u,height:g})}}const zt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","svg");return r.style.position="absolute",r.style.inset="0",r},kt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","rect");return r.setAttribute("fill","url(#pattern)"),r},Yt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","pattern");return r.setAttribute("id","pattern"),r};class ne{constructor(e,t,o){i(this,"svg",zt());i(this,"patternRenderingRectangle",kt());i(this,"pattern",Yt());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.halfTileWidth*e.scale,o=e.y-this.halfTileHeight*e.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 ne(e,t,o)}updateVisibility(){const{scale:e}=this.canvas.viewport.getViewportMatrix(),t=e>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();if(this.svg.setAttribute("width",`${e}`),this.svg.setAttribute("height",`${t}`),this.patternRenderingRectangle.setAttribute("width",`${e}`),this.patternRenderingRectangle.setAttribute("height",`${t}`),e>0&&t>0){const o=this.tileWidth/e,s=this.tileHeight/t;this.pattern.setAttribute("width",`${o}`),this.pattern.setAttribute("height",`${s}`)}}}class ae{constructor(e,t,o,s,n,a){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.pointInsideVerifier=n,this.params=a,this.overlayCanvas=Xe(this.overlayLayer,this.viewportStore,this.window),j.configure(this.canvas,this.window,this.pointInsideVerifier,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(h,d)=>{const c=this.params.connectionTypeResolver(h);return c===null?!1:(this.grabPort(h,d,c),!0)},onPointerMove:h=>{this.moveDraggingPort(h)},onPointerMoveOutside:()=>{this.handleEdgeCreationInterrupted()},onPointerUp:h=>{this.tryCreateConnection(h)}})}static configure(e,t,o,s,n,a){new ae(e,t,o,s,n,a)}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}),u=this.canvas.viewport.createContentCoords({x:t.x-d.x,y:t.y-d.y}),g={overlayNodeId:L.StaticNodeId,portCoords:c,portDirection:s.direction},l={overlayNodeId:L.DraggingNodeId,portCoords:u,portDirection:this.params.dragPortDirection};this.isTargetDragging=o==="direct";const[w,p]=this.isTargetDragging?[g,l]:[l,g];this.overlayCanvas.addNode(X(w)),this.overlayCanvas.addNode(X(p)),this.overlayCanvas.addEdge({from:w.overlayNodeId,to:p.overlayNodeId,shape:this.params.edgeShapeFactory(L.EdgeId)})}resetDragState(){this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}tryCreateConnection(e){const t=be(this.canvas.graph,e);if(t===null){this.handleEdgeCreationInterrupted();return}const o=this.staticPortId,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(L.DraggingNodeId,{x:o.x,y:o.y})}handleEdgeCreationInterrupted(){const e=this.staticPortId;this.params.onEdgeCreationInterrupted({staticPortId:e,isDirect:this.isTargetDragging})}}class he{constructor(e,t,o,s,n,a){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.pointInsideVerifier=n,this.params=a,this.overlayCanvas=Xe(this.overlayLayer,this.viewportStore,this.window),j.configure(this.canvas,this.window,this.pointInsideVerifier,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(h,d)=>this.tryStartEdgeDragging(h,d),onPointerMove:h=>{this.moveDraggingPort(h)},onPointerMoveOutside:()=>{const h=this.draggingEdgePayload;queueMicrotask(()=>{this.params.onEdgeReattachInterrupted({id:h.id,from:h.from,to:h.to,shape:h.shape,priority:h.priority})})},onPointerUp:h=>{this.tryCreateConnection(h)}})}static configure(e,t,o,s,n,a){new he(e,t,o,s,n,a)}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),u=c.element.getBoundingClientRect(),g={x:u.x+u.width/2,y:u.y+u.height/2},l=this.overlayLayer.getBoundingClientRect(),w=this.canvas.viewport.createContentCoords({x:g.x-l.x,y:g.y-l.y}),p=this.canvas.viewport.createContentCoords({x:t.x-l.x,y:t.y-l.y});this.draggingEdgePayload={id:o,from:s.from,to:s.to,shape:s.shape,priority:s.priority},this.canvas.removeEdge(o);const y={overlayNodeId:L.StaticNodeId,portCoords:w,portDirection:c.direction},f={overlayNodeId:L.DraggingNodeId,portCoords:p,portDirection:d.direction},[x,E]=this.isTargetDragging?[y,f]:[f,y];this.overlayCanvas.addNode(X(x)),this.overlayCanvas.addNode(X(E));const P=this.params.draggingEdgeShapeFactory!==null?this.params.draggingEdgeShapeFactory(L.EdgeId):s.shape;return this.overlayCanvas.addEdge({id:L.EdgeId,from:x.overlayNodeId,to:E.overlayNodeId,shape:P}),!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(L.DraggingNodeId,{x:s.x,y:s.y})}tryCreateConnection(e){const t=be(this.canvas.graph,e);if(this.overlayCanvas.removeEdge(L.EdgeId),t===null){this.handleEdgeReattachInterrupted();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})}}handleEdgeReattachInterrupted(){const e=this.draggingEdgePayload;this.params.onEdgeReattachInterrupted({id:e.id,from:e.from,to:e.to,shape:e.shape,priority:e.priority})}}class de{constructor(e,t){this.applier=e,this.trigger=t,this.trigger.subscribe(()=>{this.applier.apply()})}static configure(e,t){new de(e,t)}}class ce{constructor(e,t,o){i(this,"applyScheduled",!1);i(this,"apply",()=>{this.applyScheduled=!1,this.applier.apply()});this.graph=e,this.applier=t,this.defererFn=o,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,o){new ce(e,t,o)}scheduleApply(){this.applyScheduled||(this.applyScheduled=!0,this.defererFn(this.apply))}}class Xt{static configure(e,t){const o=t.applyOn,s=new Wt(e,t.algorithm,{staticNodeResolver:t.staticNodeResolver,onBeforeApplied:t.onBeforeApplied,onAfterApplied:t.onAfterApplied});switch(o.type){case"trigger":{de.configure(s,o.trigger);break}case"topologyChangeSchedule":{ce.configure(e.graph,s,o.schedule);break}}}}class Ht{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 le{constructor(e,t,o){i(this,"applier");i(this,"step",e=>{this.applier.apply(e)});this.win=o,this.applier=new Ot(e,t.algorithm,{staticNodeResolver:t.staticNodeResolver,onBeforeApplied:t.onBeforeApplied,onAfterApplied:t.onAfterApplied}),new Ht(this.win,this.step)}static configure(e,t,o){new le(e,t,o)}}class ue{constructor(e,t,o,s){i(this,"onNodeSelected");i(this,"mouseDownEventVerifier");i(this,"mouseUpEventVerifier");i(this,"movementThreshold");i(this,"selectionCandidateNodeId",null);i(this,"movedDistance",0);i(this,"previousMouse",null);i(this,"previousTouch",null);i(this,"onAfterNodeAdded",e=>{const{element:t}=this.canvas.graph.getNode(e);t.addEventListener("mousedown",this.onNodeMouseDown,{passive:!0}),t.addEventListener("touchstart",this.onNodeTouchStart,{passive:!0})});i(this,"onBeforeNodeRemoved",e=>{const{element:t}=this.canvas.graph.getNode(e);t.removeEventListener("mousedown",this.onNodeMouseDown),t.removeEventListener("touchstart",this.onNodeTouchStart)});i(this,"reset",()=>{this.canvas.graph.getAllNodeIds().forEach(e=>{const{element:t}=this.canvas.graph.getNode(e);t.removeEventListener("mousedown",this.onNodeMouseDown),t.removeEventListener("touchstart",this.onNodeTouchStart)})});i(this,"revert",()=>{this.reset(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});i(this,"onNodeMouseDown",e=>{const t=e;if(!this.mouseDownEventVerifier(t))return;const o=this.canvas.graph.findNodeIdByElement(e.currentTarget);this.selectionCandidateNodeId=o,this.previousMouse={x:t.clientX,y:t.clientY},this.movedDistance=0,this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0})});i(this,"onNodeTouchStart",e=>{const t=e;if(t.touches.length!==1)return;const o=this.canvas.graph.findNodeIdByElement(t.currentTarget);this.selectionCandidateNodeId=o,this.previousTouch=t.touches[0],this.movedDistance=0,this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchEnd,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchCancel,{passive:!0})});i(this,"onWindowMouseMove",e=>{const t=e,o=this.previousMouse,s=t.clientX-o.x,n=t.clientY-o.y;if(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.removeWindowMouseListeners();return}this.processMoveThresholdVerification(s,n,()=>{this.removeWindowMouseListeners()}),this.previousMouse={x:t.clientX,y:t.clientY}});i(this,"onWindowTouchMove",e=>{const t=e;if(t.touches.length!==1){this.removeWindowTouchListeners();return}const o=t.touches[0];if(!this.pointInsideVerifier.verify(o.clientX,o.clientY)){this.removeWindowTouchListeners();return}const s=this.previousTouch,n=o.clientX-s.clientX,a=o.clientY-s.clientY;this.processMoveThresholdVerification(n,a,()=>{this.removeWindowTouchListeners()}),this.previousTouch=o});i(this,"onWindowMouseUp",e=>{const t=e;this.mouseUpEventVerifier(t)&&(this.removeWindowMouseListeners(),this.trySelectNode(e))});i(this,"onWindowTouchEnd",e=>{this.removeWindowTouchListeners(),this.trySelectNode(e)});i(this,"onWindowTouchCancel",()=>{this.removeWindowTouchListeners()});this.canvas=e,this.window=t,this.pointInsideVerifier=o,this.mouseDownEventVerifier=s.mouseDownEventVerifier,this.mouseUpEventVerifier=s.mouseUpEventVerifier,this.onNodeSelected=s.onNodeSelected,this.movementThreshold=s.movementThreshold,this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.canvas.graph.onBeforeClear.subscribe(this.reset),this.canvas.onBeforeDestroy.subscribe(this.revert)}static configure(e,t,o,s){new ue(e,t,o,s)}removeWindowMouseListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}removeWindowTouchListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchEnd),this.window.removeEventListener("touchcancel",this.onWindowTouchCancel)}trySelectNode(e){const t=this.selectionCandidateNodeId;this.canvas.graph.hasNode(t)&&(this.onNodeSelected(t),e.ignoreCanvasSelection=!0)}processMoveThresholdVerification(e,t,o){const s=Math.sqrt(e*e+t*t);this.movedDistance+=s,this.movedDistance>this.movementThreshold&&o()}}class ge{constructor(e,t,o,s,n){i(this,"onCanvasSelected");i(this,"movementThreshold");i(this,"mouseDownEventVerifier");i(this,"mouseUpEventVerifier");i(this,"movedDistance",0);i(this,"previousMouseDown",null);i(this,"previousTouch",null);i(this,"onMouseDown",e=>{const t=e;this.mouseDownEventVerifier(t)&&(this.previousMouseDown={x:t.clientX,y:t.clientY},this.movedDistance=0,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;const o=t.touches[0];this.previousTouch=o,this.movedDistance=0,this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchEnd,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchCancel,{passive:!0})});i(this,"onWindowMouseMove",e=>{const t=e;if(!this.pointInsideVerifier.verify(t.clientX,t.clientY)){this.removeWindowMouseListeners();return}const o=this.previousMouseDown,s=t.clientX-o.x,n=t.clientY-o.y;this.processMoveThresholdVerification(s,n,()=>{this.removeWindowMouseListeners()}),this.previousMouseDown={x:t.clientX,y:t.clientY}});i(this,"onWindowTouchMove",e=>{const t=e;if(t.touches.length!==1){this.removeWindowTouchListeners();return}const o=t.touches[0];if(!this.pointInsideVerifier.verify(o.clientX,o.clientY)){this.removeWindowTouchListeners();return}const s=this.previousTouch,n=o.clientX-s.clientX,a=o.clientY-s.clientY;this.processMoveThresholdVerification(n,a,()=>{this.removeWindowTouchListeners()}),this.previousTouch=o});i(this,"onWindowMouseUp",e=>{const t=e;if(!this.mouseUpEventVerifier(t))return;e.ignoreCanvasSelection!==!0&&this.onCanvasSelected(),this.removeWindowMouseListeners()});i(this,"onWindowTouchEnd",()=>{this.onCanvasSelected(),this.removeWindowTouchListeners()});i(this,"onWindowTouchCancel",()=>{this.removeWindowTouchListeners()});i(this,"restore",()=>{this.element.removeEventListener("mousedown",this.onMouseDown),this.element.removeEventListener("touchstart",this.onTouchStart),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.element=t,this.window=o,this.pointInsideVerifier=s,this.onCanvasSelected=n.onCanvasSelected,this.movementThreshold=n.movementThreshold,this.mouseDownEventVerifier=n.mouseDownEventVerifier,this.mouseUpEventVerifier=n.mouseUpEventVerifier,this.canvas.onBeforeDestroy.subscribe(this.restore),this.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),this.element.addEventListener("touchstart",this.onTouchStart,{passive:!0})}static configure(e,t,o,s,n){new ge(e,t,o,s,n)}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.onWindowTouchEnd),this.window.removeEventListener("touchcancel",this.onWindowTouchCancel)}processMoveThresholdVerification(e,t,o){const s=Math.sqrt(e*e+t*t);this.movedDistance+=s,this.movedDistance>this.movementThreshold&&o()}}const Gt=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r},pe=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.inset="0",r},He=()=>{const r=pe();return r.style.pointerEvents="none",r};class jt{constructor(e){i(this,"background",pe());i(this,"main",pe());i(this,"overlayConnectablePorts",He());i(this,"overlayDraggableEdges",He());i(this,"host",Gt());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 Jt=r=>{var w,p,y,f,x,E;const e=((w=r.events)==null?void 0:w.onNodeDragStarted)??(()=>{}),t=((p=r.events)==null?void 0:p.onNodeDrag)??(()=>{}),o=r.nodeDragVerifier??(()=>!0),s=((y=r.events)==null?void 0:y.onNodeDragFinished)??(()=>{}),n=r.moveOnTop!==!1,a=r.moveEdgesOnTop!==!1&&n,h=(f=r.mouse)==null?void 0:f.dragCursor,d=h!==void 0?h:"grab",c=(x=r.mouse)==null?void 0:x.mouseDownEventVerifier,u=c!==void 0?c:P=>P.button===0,g=(E=r.mouse)==null?void 0:E.mouseUpEventVerifier,l=g!==void 0?g:P=>P.button===0;return{moveOnTop:n,moveEdgesOnTop:a,dragCursor:d,gridSize:r.gridSize??null,mouseDownEventVerifier:u,mouseUpEventVerifier:l,onNodeDragStarted:e,onNodeDrag:t,nodeDragVerifier:o,onNodeDragFinished:s}},Kt=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.canvasWidth*n.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 u=n.canvasHeight*n.prevTransform.scale,g=s-u;return h>g&&h>n.prevTransform.y&&(h=Math.max(n.prevTransform.y,g)),{scale:n.nextTransform.scale,x:a,y:h}}},Qt=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,u=h.y;if(h.scale>s&&h.scale>a.scale){d=Math.max(a.scale,s),c=a.x,u=a.y;const g=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*g,u=a.y+(h.y-a.y)*g}if(h.scale<o&&h.scale<a.scale){d=Math.min(a.scale,o),c=a.x,u=a.y;const g=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*g,u=a.y+(h.y-a.y)*g}return{scale:d,x:c,y:u}}},Zt=r=>e=>r.reduce((t,o)=>o({prevTransform:e.prevTransform,nextTransform:t,canvasWidth:e.canvasWidth,canvasHeight:e.canvasHeight}),e.nextTransform),Ge=r=>{if(typeof r=="function")return r;switch(r.type){case"scale-limit":return Qt({minContentScale:r.minContentScale??0,maxContentScale:r.maxContentScale??1/0});case"shift-limit":return Kt({minX:r.minX??-1/0,maxX:r.maxX??1/0,minY:r.minY??-1/0,maxY:r.maxY??1/0})}},je=r=>{var p,y,f,x,E,P,M,D,W,O,z,ot;const e=(p=r==null?void 0:r.scale)==null?void 0:p.mouseWheelSensitivity,t=e!==void 0?e:1.2,o=r==null?void 0:r.transformPreprocessor;let s;o!==void 0?Array.isArray(o)?s=Zt(o.map(V=>Ge(V))):s=Ge(o):s=V=>V.nextTransform;const n=((y=r==null?void 0:r.shift)==null?void 0:y.cursor)!==void 0?r.shift.cursor:"grab",a=((f=r==null?void 0:r.events)==null?void 0:f.onBeforeTransformChange)??(()=>{}),h=((x=r==null?void 0:r.events)==null?void 0:x.onTransformChange)??(()=>{}),d=(E=r==null?void 0:r.shift)==null?void 0:E.mouseDownEventVerifier,c=d!==void 0?d:V=>V.button===0,u=(P=r==null?void 0:r.shift)==null?void 0:P.mouseUpEventVerifier,g=u!==void 0?u:V=>V.button===0,l=(M=r==null?void 0:r.scale)==null?void 0:M.mouseWheelEventVerifier,w=l!==void 0?l:()=>!0;return{wheelSensitivity:t,onTransformStarted:((D=r==null?void 0:r.events)==null?void 0:D.onTransformStarted)??(()=>{}),onTransformFinished:((W=r==null?void 0:r.events)==null?void 0:W.onTransformFinished)??(()=>{}),onBeforeTransformChange:a,onTransformChange:h,transformPreprocessor:s,shiftCursor:n,mouseDownEventVerifier:c,mouseUpEventVerifier:g,mouseWheelEventVerifier:w,scaleWheelFinishTimeout:((O=r==null?void 0:r.scale)==null?void 0:O.wheelFinishTimeout)??500,onResizeTransformStarted:((z=r==null?void 0:r.events)==null?void 0:z.onResizeTransformStarted)??(()=>{}),onResizeTransformFinished:((ot=r==null?void 0:r.events)==null?void 0:ot.onResizeTransformFinished)??(()=>{})}},_t=(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},qt=r=>r instanceof SVGElement?r:_t((r==null?void 0:r.radius)??1.5,(r==null?void 0:r.color)??"#d8d8d8"),er=r=>{const e=r.tileDimensions,t=(e==null?void 0:e.width)??25,o=(e==null?void 0:e.height)??25,s=qt(r.renderer??{});return{tileWidth:t,tileHeight:o,renderer:s,maxViewportScale:r.maxViewportScale??10}},we=r=>{if(typeof r=="function")return r;switch(r.type){case"straight":return()=>new Ie({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 Ve({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 Fe({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 ee({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 Re({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})}},tr=(r,e,t)=>{var c,u,g;const o=()=>"direct",s=l=>l,n=l=>l.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:((u=r.events)==null?void 0:u.onEdgeCreationInterrupted)??d,onEdgeCreationPrevented:((g=r.events)==null?void 0:g.onEdgeCreationPrevented)??h,dragPortDirection:r.dragPortDirection??t,edgeShapeFactory:r.edgeShape!==void 0?we(r.edgeShape):e}},rr=(r,e)=>{var c,u,g;const t=l=>l,o=l=>l.button===0&&l.ctrlKey,s=l=>l.button===0,n=l=>{const w=e.getPortAdjacentEdgeIds(l);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?we(r.draggingEdgeShape):null,onAfterEdgeReattached:((c=r.events)==null?void 0:c.onAfterEdgeReattached)??a,onEdgeReattachInterrupted:((u=r.events)==null?void 0:u.onEdgeReattachInterrupted)??d,onEdgeReattachPrevented:((g=r.events)==null?void 0:g.onEdgeReattachPrevented)??h}},or=r=>({nodeVerticalRadius:r.nodeContainingRadius.vertical,nodeHorizontalRadius:r.nodeContainingRadius.horizontal}),sr=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 Je extends Error{constructor(){super(...arguments);i(this,"name","CanvasBuilderError")}}class Ke{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.nodeMass*this.dt,y:a.y/this.nodeMass*this.dt};e=Math.max(e,Math.sqrt(h.x*h.x+h.y*h.y));const d=h.x*this.dt,c=h.y*this.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),u=(d.d-this.edgeEquilibriumLength)*this.edgeStiffness,g=d.ex*u,l=d.ey*u,w=e.get(s.nodeId),p=e.get(n.nodeId);w.x+=g,w.y+=l,p.x-=g,p.y-=l})}}class Qe{constructor(e){i(this,"PI2",2*Math.PI);this.rand=e}create(e,t){const o=t.x-e.x,s=t.y-e.y,n=o*o+s*s;if(n===0){const c=this.PI2*this.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 Ze=r=>{if(r.distance===0)return r.maxForce;const e=r.coefficient*(r.sourceCharge*r.targetCharge/(r.distance*r.distance));return Math.min(e,r.maxForce)};class ir{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),u=e.get(d),g=this.distanceVectorGenerator.create(c,u),l=Ze({coefficient:1,sourceCharge:this.nodeCharge,targetCharge:this.nodeCharge,distance:g.d,maxForce:this.maxForce}),w=l*g.ex,p=l*g.ey,y=t.get(a),f=t.get(d);y.x-=w,y.y-=p,f.x+=w,f.y+=p}}}}const nr=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 ar{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.x*o.lb.totalCharge,n+=o.lb.chargeCenter.y*o.lb.totalCharge),o.lt!==null&&(a+=o.lt.totalMass,h+=o.lt.totalCharge,s+=o.lt.chargeCenter.x*o.lt.totalCharge,n+=o.lt.chargeCenter.y*o.lt.totalCharge),o.rb!==null&&(a+=o.rb.totalMass,h+=o.rb.totalCharge,s+=o.rb.chargeCenter.x*o.rb.totalCharge,n+=o.rb.chargeCenter.y*o.rb.totalCharge),o.rt!==null&&(a+=o.rt.totalMass,h+=o.rt.totalCharge,s+=o.rt.chargeCenter.x*o.rt.totalCharge,n+=o.rt.chargeCenter.y*o.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(l=>{const{x:w,y:p}=this.coords.get(l);w<t?p<o?d.add(l):h.add(l):p<o?a.add(l):n.add(l),e.nodeIds.delete(l)});const u={parent:e,lb:null,lt:null,rb:null,rt:null},g=[];if(n.size>0){const l={nodeIds:n,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:o+c,radius:c},...u};e.rt=l,g.push(l)}if(a.size>0){const l={nodeIds:a,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t+c,centerY:o-c,radius:c},...u};e.rb=l,g.push(l)}if(h.size>0){const l={nodeIds:h,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:o+c,radius:c},...u};e.lt=l,g.push(l)}if(d.size>0){const l={nodeIds:d,totalMass:0,totalCharge:0,chargeCenter:{x:0,y:0},box:{centerX:t-c,centerY:o-c,radius:c},...u};e.lb=l,g.push(l)}return g}setLeaf(e){e.totalMass=this.nodeMass*e.nodeIds.size,e.totalCharge=this.nodeCharge*e.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 hr{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=nr(e),s=new ar({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.radius*2<d.d*this.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=Ze({coefficient:this.nodeForceCoefficient,sourceCharge:e.sourceCharge,targetCharge:e.targetCharge,distance:t.d,maxForce:this.maxForce});return{x:o*t.ex,y:o*t.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 _e=r=>r.theta!==0?new hr({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce,theta:r.theta,nodeMass:r.nodeMass,areaRadiusThreshold:r.areaRadiusThreshold}):new ir({nodeCharge:r.nodeCharge,nodeForceCoefficient:r.nodeForceCoefficient,distanceVectorGenerator:r.distanceVectorGenerator,maxForce:r.maxForce});class qe{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().filter(p=>{const y=t.getNode(p);return y.x===null||y.y===null}),a=Math.sqrt(n.length)*this.sparsity,{width:h,height:d}=o.getDimensions(),c={x:h/2,y:d/2},u=o.createContentCoords(c),g=a/2,l={x:u.x-g,y:u.y-g};return t.getAllNodeIds().forEach(p=>{const y=t.getNode(p);s.set(p,{x:y.x??l.x+a*this.rand(),y:y.y??l.y+a*this.rand()})}),s}}class dr{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 Qe(e.rand),this.nodeForcesApplicationStrategy=_e({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new qe({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 Ke(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 cr{constructor(e,t){i(this,"forest",new Set);i(this,"remainingNodeIds");for(this.graph=e,this.nextLayerNodesResolver=t,this.remainingNodeIds=new Set(this.graph.getAllNodeIds());this.remainingNodeIds.size>0;){const[o]=this.remainingNodeIds;this.traverse(o)}}generate(){return this.forest}traverse(e){const t={nodeId:e,children:new Set},o=[];this.forest.add({root:t,sequence:o});let s=[t];for(this.remainingNodeIds.delete(t.nodeId);s.length>0;){const n=[];s.forEach(a=>{o.push(a);const h=this.nextLayerNodesResolver({graph:this.graph,currentNodeId:a.nodeId});for(const d of h){if(!this.remainingNodeIds.has(d))continue;this.remainingNodeIds.delete(d);const c={nodeId:d,children:new Set};a.children.add(c),n.push(c)}}),s=n}}}class lr{constructor(e){this.params=e}generate(e){let t=0;const o=[],s=e.length-1,n=[];e.forEach((h,d)=>{if(t+=this.params.spaceAroundRadius,h.forEach((c,u)=>{n[u]===void 0?n[u]={start:t+c.start,end:t+c.end}:n[u].end=t+c.end}),o.push(t),d!==s){const c=e[d+1],u=n.map(g=>({start:g.start-t,end:g.end-t}));t+=this.calculateMaxDiff(u,c)}t+=this.params.spaceAroundRadius});const a=t/2;return{childOffsets:o.map(h=>h-a),subtreeSpans:n.map(h=>({start:h.start-a,end:h.end-a}))}}calculateMaxDiff(e,t){let o=0;const s=Math.min(e.length,t.length);for(let n=0;n<s;n++){const a=e[n].end-t[n].start;o=Math.max(o,a)}return o-2*this.params.spaceAroundRadius}}class ur{constructor(e,t){i(this,"offsets",new Map);i(this,"treeSpans",new Map);this.tree=e;const o=t.spaceAroundRadius,s=new lr({spaceAroundRadius:o});[...this.tree.sequence].reverse().forEach(n=>{const a=Array.from(n.children).map(c=>this.treeSpans.get(c.nodeId)),h=s.generate(a);let d=0;n.children.forEach(c=>{this.offsets.set(c.nodeId,h.childOffsets[d]),d++}),this.treeSpans.set(n.nodeId,[{start:-o,end:o},...h.subtreeSpans]),n.children.forEach(c=>{this.treeSpans.delete(c.nodeId)})}),this.offsets.set(this.tree.root.nodeId,0)}generate(){return this.offsets}}class gr{constructor(e){this.params=e}calculateCoordinates(e){const t=new Map,s=new cr(e.graph,this.params.nextLayerNodesResolver).generate();let n=0;return s.forEach(a=>{t.set(a.root.nodeId,{x:n,y:0});const d=new ur(a,{spaceAroundRadius:this.params.layerSpace/2}).generate();let c=[a.root];for(;c.length>0;){const u=[];n+=this.params.layerWidth,c.forEach(g=>{g.children.forEach(l=>{const w=t.get(g.nodeId).y;t.set(l.nodeId,{y:w+d.get(l.nodeId),x:n}),u.push(l)})}),c=u}}),t.forEach((a,h)=>{t.set(h,this.params.transform(a))}),t}}const pr=r=>{const{graph:e,currentNodeId:t}=r,o=e.getNodeOutgoingEdgeIds(t).map(n=>{const a=e.getEdge(n);return e.getPort(a.to).nodeId}),s=e.getNodeIncomingEdgeIds(t).map(n=>{const a=e.getEdge(n);return e.getPort(a.from).nodeId});return new Set([...o,...s])},wr=r=>{const{graph:e,currentNodeId:t}=r,o=e.getNodeOutgoingEdgeIds(t).map(s=>{const n=e.getEdge(s);return e.getPort(n.to).nodeId});return new Set(o)},yr=r=>{const{graph:e,currentNodeId:t}=r,o=e.getNodeIncomingEdgeIds(t).map(s=>{const n=e.getEdge(s);return e.getPort(n.from).nodeId});return new Set(o)};class fr{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 Qe(e.rand),this.nodeForcesApplicationStrategy=_e({distanceVectorGenerator:this.distanceVectorGenerator,nodeCharge:e.nodeCharge,maxForce:e.maxForce,nodeForceCoefficient:e.nodeForceCoefficient,theta:e.barnesHutTheta,areaRadiusThreshold:e.barnesHutAreaRadiusThreshold,nodeMass:e.nodeMass}),this.fillerLayoutAlgorithm=new qe({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 Ke(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 u=t.getNode(c);return u.x===null||u.y===null})?new Map:n}}const et=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]},tt=(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},N=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}),F=Object.freeze({mouseDownEventVerifier:r=>r.button===0,mouseUpEventVerifier:r=>r.button===0,movementThreshold:10}),vr=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const o=et((r==null?void 0:r.seed)??N.seed),s=tt(o[0],o[1],o[2],o[3]);return new fr({rand:s,maxTimeDeltaSec:(r==null?void 0:r.maxTimeDeltaSec)??N.maxTimeDeltaSec,nodeCharge:(r==null?void 0:r.nodeCharge)??N.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??N.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??N.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??N.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??N.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??N.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??N.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??N.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??N.barnesHutAreaRadiusThreshold})}}},ye={staticNodeResolver:()=>!1,onBeforeApplied:()=>{},onAfterApplied:()=>{}},mr=r=>{var t,o;return{algorithm:vr((r==null?void 0:r.algorithm)??{}),staticNodeResolver:(r==null?void 0:r.staticNodeResolver)??ye.staticNodeResolver,onBeforeApplied:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeApplied)??ye.onBeforeApplied,onAfterApplied:((o=r==null?void 0:r.events)==null?void 0:o.onAfterApplied)??ye.onAfterApplied}},xr=r=>r instanceof k?{type:"trigger",trigger:r}:(r==null?void 0:r.type)==="topologyChangeMacrotask"?{type:"topologyChangeSchedule",schedule:Ut}:{type:"topologyChangeSchedule",schedule:$t},B=Object.freeze({staticNodeResolver:()=>!1,onBeforeApplied:()=>{},onAfterApplied:()=>{},hierarchicalLayout:{layerWidth:300,layerSpace:300}}),Q=(r,e)=>({a:r.a*e.a+r.b*e.d,b:r.a*e.b+r.b*e.e,c:r.a*e.c+r.b*e.f+r.c,d:r.d*e.a+r.e*e.d,e:r.d*e.b+r.e*e.e,f:r.d*e.c+r.e*e.f+r.f}),Er=r=>{const{a:e,b:t,c:o,d:s,e:n,f:a}=r,h=e*n-t*s;return{a:n/h,b:-t/h,c:(t*a-o*n)/h,d:-s/h,e:e/h,f:(o*s-e*a)/h}};class Ar{resolve(e){if("shift"in e)return this.createShiftBaseMatrix(e.shift);if("scale"in e){const t=e.origin??{x:0,y:0};return this.createScaleRelativeMatrix(e.scale,t)}if("rotate"in e){const t=e.origin??{x:0,y:0};return this.createRotateRelativeMatrix(e.rotate,t)}if("mirror"in e){const t=e.origin??{x:0,y:0};return this.createMirrorRelativeMatrix(e.mirror,t)}return{a:e.a??1,b:e.b??0,c:e.c??0,d:e.d??0,e:e.e??1,f:e.f??0}}createScaleRelativeMatrix(e,t){const o=this.createScaleBaseMatrix(e),s=this.createShiftBaseMatrix(t);return this.createRelativeTransform(o,s)}createRotateRelativeMatrix(e,t){const o=this.createRotateBaseMatrix(e),s=this.createShiftBaseMatrix(t);return this.createRelativeTransform(o,s)}createMirrorRelativeMatrix(e,t){const o=this.createMirrorYBaseMatrix(),s=Q(this.createShiftBaseMatrix(t),this.createRotateBaseMatrix(e));return this.createRelativeTransform(o,s)}createRelativeTransform(e,t){const o=Q(t,e),s=Er(t);return Q(o,s)}createShiftBaseMatrix(e){return{a:1,b:0,c:e.x,d:0,e:1,f:e.y}}createScaleBaseMatrix(e){return{a:e,b:0,c:0,d:0,e,f:0}}createRotateBaseMatrix(e){const t=Math.sin(e),o=Math.cos(e);return{a:o,b:-t,c:0,d:t,e:o,f:0}}createMirrorYBaseMatrix(){return{a:1,b:0,c:0,d:0,e:-1,f:0}}}const Sr=r=>{if(r===void 0)return s=>s;if(typeof r=="function")return r;const e=Array.isArray(r)?r:[r];let t={a:1,b:0,c:0,d:0,e:1,f:0};const o=new Ar;return e.forEach(s=>{const n=o.resolve(s);t=Q(t,n)}),s=>{const{x:n,y:a}=s;return{x:t.a*n+t.b*a+t.c,y:t.d*n+t.e*a+t.f}}},Nr=r=>{if(typeof r=="function")return r;switch(r){case"outgoing":return wr;case"incoming":return yr;default:return pr}},br=r=>{var e,t;switch(r==null?void 0:r.type){case"custom":return r.instance;case"hierarchical":return new gr({layerWidth:r.layerWidth??B.hierarchicalLayout.layerWidth,layerSpace:r.layerSpace??B.hierarchicalLayout.layerSpace,transform:Sr(r.transform),nextLayerNodesResolver:Nr(r.nextLayerNodesResolver)});default:{const o=et((r==null?void 0:r.seed)??N.seed),s=tt(o[0],o[1],o[2],o[3]);return new dr({dtSec:(r==null?void 0:r.dtSec)??N.dtSec,maxIterations:(r==null?void 0:r.maxIterations)??N.maxIterations,rand:s,nodeCharge:(r==null?void 0:r.nodeCharge)??N.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??N.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??N.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??N.edgeStiffness,convergenceVelocity:(r==null?void 0:r.convergenceVelocity)??N.convergenceVelocity,maxForce:(r==null?void 0:r.maxForce)??N.maxForce,nodeForceCoefficient:(r==null?void 0:r.nodeForceCoefficient)??N.nodeForceCoefficient,barnesHutTheta:((e=r==null?void 0:r.barnesHut)==null?void 0:e.theta)??N.barnesHutTheta,barnesHutAreaRadiusThreshold:((t=r==null?void 0:r.barnesHut)==null?void 0:t.areaRadiusThreshold)??N.barnesHutAreaRadiusThreshold})}}},Pr=r=>{var e,t;return{algorithm:br(r.algorithm),applyOn:xr(r.applyOn),staticNodeResolver:r.staticNodeResolver??B.staticNodeResolver,onBeforeApplied:((e=r.events)==null?void 0:e.onBeforeApplied)??B.onBeforeApplied,onAfterApplied:((t=r.events)==null?void 0:t.onAfterApplied)??B.onAfterApplied}},Cr=(r,e)=>({...r,onNodeDragStarted:t=>{e.add(t),r.onNodeDragStarted(t)},onNodeDragFinished:t=>{e.delete(t),r.onNodeDragFinished(t)}}),Tr=(r,e)=>{r.graph.onBeforeNodeRemoved.subscribe(t=>{e.delete(t)}),r.graph.onBeforeClear.subscribe(()=>{e.clear()}),r.onBeforeDestroy.subscribe(()=>{e.clear()})},Mr=(r,e)=>({...r,staticNodeResolver:t=>r.staticNodeResolver(t)||e.has(t)}),fe=r=>()=>r,rt=fe(0),Dr=()=>{let r=0;return()=>r++},Lr=(r,e)=>{let t=rt,o=rt;const s=Dr();return r==="incremental"&&(t=s),e==="incremental"&&(o=s),typeof r=="number"&&(t=fe(r)),typeof e=="number"&&(o=fe(e)),typeof r=="function"&&(t=r),typeof e=="function"&&(o=e),{nodesPriorityFn:t,edgesPriorityFn:o}},Rr=r=>{var t,o,s,n,a;const e=Lr((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)??Pe,priorityFn:e.nodesPriorityFn},ports:{direction:((n=r.ports)==null?void 0:n.direction)??0},edges:{shapeFactory:we(((a=r.edges)==null?void 0:a.shape)??{}),priorityFn:e.edgesPriorityFn}}},Vr=r=>r.applyOn.type==="topologyChangeSchedule"?r.applyOn.schedule:oe,Ir=r=>{var o,s,n,a;const{canvasDefaults:e}=r,t=r.hasLayout?Vr(r.layoutParams):oe;return{focus:{contentPadding:((o=e.focus)==null?void 0:o.contentPadding)??((s=e.focus)==null?void 0:s.contentOffset)??100,minContentScale:((n=e.focus)==null?void 0:n.minContentScale)??0,schedule:t,animationDuration:((a=e.focus)==null?void 0:a.animationDuration)??0}}},Fr=r=>({onNodeSelected:r.onNodeSelected,mouseDownEventVerifier:r.mouseDownEventVerifier??F.mouseDownEventVerifier,mouseUpEventVerifier:r.mouseUpEventVerifier??F.mouseUpEventVerifier,movementThreshold:r.movementThreshold??F.movementThreshold}),Ur=r=>({onCanvasSelected:r.onCanvasSelected,mouseDownEventVerifier:r.mouseDownEventVerifier??F.mouseDownEventVerifier,mouseUpEventVerifier:r.mouseUpEventVerifier??F.mouseUpEventVerifier,movementThreshold:r.movementThreshold??F.movementThreshold});class $r{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,"userSelectableNodesConfig");i(this,"userSelectableCanvasConfig");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 k);i(this,"window",window);i(this,"animationStaticNodes",new Set);i(this,"pointInsideVerifier");this.element=e,this.pointInsideVerifier=new pt(e,this.window)}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}enableUserSelectableNodes(e){return this.userSelectableNodesConfig=e,this}enableUserSelectableCanvas(e){return this.userSelectableCanvasConfig=e,this}build(){if(this.used)throw new Je("Failed to build Canvas because CanvasBuilder is a single-use object");this.used=!0;const e=new lt(this.element),t=new xe,o=new jt(this.element),s=this.createHtmlView(o.main,t,e),n=Rr(this.canvasDefaults),a=new We(t,s,n),h=Pr(this.layoutConfig),d=Ir({canvasDefaults:this.canvasDefaults,hasLayout:this.hasLayout,layoutParams:h}),c=new Ye(t,e,d,this.window),u=new Oe(e),g=new Be(t),l=new me(g,u,a,c);if(this.hasBackground&&ne.configure(l,er(this.backgroundConfig),o.background),this.hasNodeResizeReactiveEdges&&Z.configure(l),this.userSelectableNodesConfig!==void 0){const p=Fr(this.userSelectableNodesConfig);ue.configure(l,this.window,this.pointInsideVerifier,p)}if(this.userSelectableCanvasConfig!==void 0){const p=Ur(this.userSelectableCanvasConfig);ge.configure(l,o.main,this.window,this.pointInsideVerifier,p)}if(this.hasDraggableNodes){let p=Jt(this.dragConfig);this.hasAnimatedLayout&&(p=Cr(p,this.animationStaticNodes)),se.configure(l,o.main,this.window,this.pointInsideVerifier,p)}if(this.hasUserConnectablePorts){const p=tr(this.connectablePortsConfig,n.edges.shapeFactory,n.ports.direction);ae.configure(l,o.overlayConnectablePorts,e,this.window,this.pointInsideVerifier,p)}if(this.hasUserDraggableEdges){const p=rr(this.draggableEdgesConfig,l.graph);he.configure(l,o.overlayDraggableEdges,e,this.window,this.pointInsideVerifier,p)}if(this.virtualScrollConfig!==void 0?ie.configure(l,o.main,this.window,je(this.transformConfig),this.boxRenderingTrigger,this.pointInsideVerifier,or(this.virtualScrollConfig)):this.hasTransformableViewport&&K.configure(l,o.main,this.window,this.pointInsideVerifier,je(this.transformConfig)),this.hasLayout&&Xt.configure(l,h),this.hasAnimatedLayout){let p=mr(this.animatedLayoutConfig);this.hasDraggableNodes&&(Tr(l,this.animationStaticNodes),p=Mr(p,this.animationStaticNodes)),le.configure(l,p,this.window)}const w=()=>{o.destroy(),l.onBeforeDestroy.unsubscribe(w)};return l.onBeforeDestroy.subscribe(w),l}createHtmlView(e,t,o){let s=new ve(t,o,e);return this.virtualScrollConfig!==void 0&&(s=new ht(s,t,this.boxRenderingTrigger,sr(this.virtualScrollConfig))),s=new dt(s,t),s}}A.BezierEdgeShape=Re,A.CanvasBuilder=$r,A.CanvasBuilderError=Je,A.CanvasError=S,A.ConnectionCategory=C,A.DirectEdgeShape=ee,A.EventSubject=k,A.HorizontalEdgeShape=Ve,A.InteractiveEdgeError=$e,A.InteractiveEdgeShape=te,A.MidpointEdgeShape=Ft,A.StraightEdgeShape=Ie,A.VerticalEdgeShape=Fe,Object.defineProperty(A,Symbol.toStringTag,{value:"Module"})});
|
package/dist/html-graph.umd.cjs
CHANGED
|
@@ -3308,6 +3308,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
3308
3308
|
event.clientY
|
|
3309
3309
|
);
|
|
3310
3310
|
if (!isInside) {
|
|
3311
|
+
this.params.onPointerMoveOutside();
|
|
3311
3312
|
this.stopMouseDrag();
|
|
3312
3313
|
return;
|
|
3313
3314
|
}
|
|
@@ -3353,6 +3354,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
3353
3354
|
touch.clientY
|
|
3354
3355
|
);
|
|
3355
3356
|
if (!isInside) {
|
|
3357
|
+
this.params.onPointerMoveOutside();
|
|
3356
3358
|
this.stopTouchDrag();
|
|
3357
3359
|
return;
|
|
3358
3360
|
}
|
|
@@ -4216,6 +4218,9 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
4216
4218
|
onPointerMove: (cursor) => {
|
|
4217
4219
|
this.moveDraggingPort(cursor);
|
|
4218
4220
|
},
|
|
4221
|
+
onPointerMoveOutside: () => {
|
|
4222
|
+
this.handleEdgeCreationInterrupted();
|
|
4223
|
+
},
|
|
4219
4224
|
onPointerUp: (cursor) => {
|
|
4220
4225
|
this.tryCreateConnection(cursor);
|
|
4221
4226
|
}
|
|
@@ -4274,14 +4279,11 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
4274
4279
|
}
|
|
4275
4280
|
tryCreateConnection(cursor) {
|
|
4276
4281
|
const draggingPortId = findPortAtPoint(this.canvas.graph, cursor);
|
|
4277
|
-
const staticPortId = this.staticPortId;
|
|
4278
4282
|
if (draggingPortId === null) {
|
|
4279
|
-
this.
|
|
4280
|
-
staticPortId,
|
|
4281
|
-
isDirect: this.isTargetDragging
|
|
4282
|
-
});
|
|
4283
|
+
this.handleEdgeCreationInterrupted();
|
|
4283
4284
|
return;
|
|
4284
4285
|
}
|
|
4286
|
+
const staticPortId = this.staticPortId;
|
|
4285
4287
|
const sourceId = this.isTargetDragging ? staticPortId : draggingPortId;
|
|
4286
4288
|
const targetId = this.isTargetDragging ? draggingPortId : staticPortId;
|
|
4287
4289
|
const request = { from: sourceId, to: targetId };
|
|
@@ -4305,6 +4307,13 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
4305
4307
|
y: nodeContentCoords.y
|
|
4306
4308
|
});
|
|
4307
4309
|
}
|
|
4310
|
+
handleEdgeCreationInterrupted() {
|
|
4311
|
+
const staticPortId = this.staticPortId;
|
|
4312
|
+
this.params.onEdgeCreationInterrupted({
|
|
4313
|
+
staticPortId,
|
|
4314
|
+
isDirect: this.isTargetDragging
|
|
4315
|
+
});
|
|
4316
|
+
}
|
|
4308
4317
|
}
|
|
4309
4318
|
class UserDraggableEdgesConfigurator {
|
|
4310
4319
|
constructor(canvas, overlayLayer, viewportStore, window2, pointInsideVerifier, params) {
|
|
@@ -4342,6 +4351,18 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
4342
4351
|
onPointerMove: (cursor) => {
|
|
4343
4352
|
this.moveDraggingPort(cursor);
|
|
4344
4353
|
},
|
|
4354
|
+
onPointerMoveOutside: () => {
|
|
4355
|
+
const edge = this.draggingEdgePayload;
|
|
4356
|
+
queueMicrotask(() => {
|
|
4357
|
+
this.params.onEdgeReattachInterrupted({
|
|
4358
|
+
id: edge.id,
|
|
4359
|
+
from: edge.from,
|
|
4360
|
+
to: edge.to,
|
|
4361
|
+
shape: edge.shape,
|
|
4362
|
+
priority: edge.priority
|
|
4363
|
+
});
|
|
4364
|
+
});
|
|
4365
|
+
},
|
|
4345
4366
|
onPointerUp: (cursor) => {
|
|
4346
4367
|
this.tryCreateConnection(cursor);
|
|
4347
4368
|
}
|
|
@@ -4437,14 +4458,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
4437
4458
|
const draggingPortId = findPortAtPoint(this.canvas.graph, cursor);
|
|
4438
4459
|
this.overlayCanvas.removeEdge(OverlayId.EdgeId);
|
|
4439
4460
|
if (draggingPortId === null) {
|
|
4440
|
-
|
|
4441
|
-
this.params.onEdgeReattachInterrupted({
|
|
4442
|
-
id: edge2.id,
|
|
4443
|
-
from: edge2.from,
|
|
4444
|
-
to: edge2.to,
|
|
4445
|
-
shape: edge2.shape,
|
|
4446
|
-
priority: edge2.priority
|
|
4447
|
-
});
|
|
4461
|
+
this.handleEdgeReattachInterrupted();
|
|
4448
4462
|
return;
|
|
4449
4463
|
}
|
|
4450
4464
|
const [from, to] = this.isTargetDragging ? [this.staticPortId, draggingPortId] : [draggingPortId, this.staticPortId];
|
|
@@ -4472,6 +4486,16 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|
|
4472
4486
|
});
|
|
4473
4487
|
}
|
|
4474
4488
|
}
|
|
4489
|
+
handleEdgeReattachInterrupted() {
|
|
4490
|
+
const edge = this.draggingEdgePayload;
|
|
4491
|
+
this.params.onEdgeReattachInterrupted({
|
|
4492
|
+
id: edge.id,
|
|
4493
|
+
from: edge.from,
|
|
4494
|
+
to: edge.to,
|
|
4495
|
+
shape: edge.shape,
|
|
4496
|
+
priority: edge.priority
|
|
4497
|
+
});
|
|
4498
|
+
}
|
|
4475
4499
|
}
|
|
4476
4500
|
class ManualLayoutApplicationStrategyConfigurator {
|
|
4477
4501
|
constructor(applier, trigger) {
|