@html-graph/html-graph 3.20.0 → 4.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/html-graph.d.ts +26 -164
  2. package/dist/html-graph.js +1062 -1158
  3. package/dist/html-graph.umd.cjs +1 -1
  4. package/package.json +1 -1
package/dist/html-graph.js CHANGED
@@ -1,182 +1,178 @@
1
- var Ne = Object.defineProperty;
2
- var Me = (r, e, t) => e in r ? Ne(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
3
- var o = (r, e, t) => Me(r, typeof e != "symbol" ? e + "" : e, t);
4
- const D = (r, e) => ({
5
- x: r.scale * e.x + r.x,
6
- y: r.scale * e.y + r.y
1
+ var Nt = Object.defineProperty;
2
+ var Mt = (r, t, e) => t in r ? Nt(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
3
+ var o = (r, t, e) => Mt(r, typeof t != "symbol" ? t + "" : t, e);
4
+ const T = (r, t) => ({
5
+ x: r.scale * t.x + r.x,
6
+ y: r.scale * t.y + r.y
7
7
  });
8
- var R = /* @__PURE__ */ ((r) => (r.Line = "line", r.NodeCycle = "node-cycle", r.PortCycle = "port-cycle", r))(R || {});
9
- const Le = () => {
8
+ var C = /* @__PURE__ */ ((r) => (r.Line = "line", r.NodeCycle = "node-cycle", r.PortCycle = "port-cycle", r))(C || {});
9
+ const Lt = () => {
10
10
  const r = document.createElement("div");
11
11
  return r.style.width = "100%", r.style.height = "100%", r.style.position = "relative", r.style.overflow = "hidden", r;
12
- }, Re = () => {
12
+ }, Ct = () => {
13
13
  const r = document.createElement("div");
14
14
  return r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.width = "0", r.style.height = "0", r;
15
- }, Ce = (r) => {
15
+ }, Rt = (r) => {
16
16
  r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.visibility = "hidden";
17
17
  };
18
- class pe {
19
- constructor(e, t, s) {
20
- o(this, "host", Le());
21
- o(this, "container", Re());
18
+ class pt {
19
+ constructor(t, e, s) {
20
+ o(this, "host", Lt());
21
+ o(this, "container", Ct());
22
22
  o(this, "edgeIdToElementMap", /* @__PURE__ */ new Map());
23
23
  o(this, "applyTransform", () => {
24
- const e = this.viewportStore.getContentMatrix();
25
- this.container.style.transform = `matrix(${e.scale}, 0, 0, ${e.scale}, ${e.x}, ${e.y})`;
24
+ const t = this.viewportStore.getContentMatrix();
25
+ this.container.style.transform = `matrix(${t.scale}, 0, 0, ${t.scale}, ${t.x}, ${t.y})`;
26
26
  });
27
- this.graphStore = e, this.viewportStore = t, this.element = s, this.element.appendChild(this.host), this.host.appendChild(this.container), this.viewportStore.onAfterUpdated.subscribe(this.applyTransform);
27
+ this.graphStore = t, this.viewportStore = e, this.element = s, this.element.appendChild(this.host), this.host.appendChild(this.container), this.viewportStore.onAfterUpdated.subscribe(this.applyTransform);
28
28
  }
29
- attachNode(e) {
30
- const t = this.graphStore.getNode(e);
31
- Ce(t.element), this.container.appendChild(t.element), this.updateNodePosition(e), this.updateNodePriority(e), t.element.style.visibility = "visible";
29
+ attachNode(t) {
30
+ const e = this.graphStore.getNode(t);
31
+ Rt(e.element), this.container.appendChild(e.element), this.updateNodePosition(t), this.updateNodePriority(t), e.element.style.visibility = "visible";
32
32
  }
33
- detachNode(e) {
34
- const t = this.graphStore.getNode(e);
35
- this.container.removeChild(t.element);
33
+ detachNode(t) {
34
+ const e = this.graphStore.getNode(t);
35
+ this.container.removeChild(e.element);
36
36
  }
37
- attachEdge(e) {
38
- const t = this.graphStore.getEdge(e).shape.svg;
39
- this.edgeIdToElementMap.set(e, t), this.container.appendChild(t), this.renderEdge(e), this.updateEdgePriority(e);
37
+ attachEdge(t) {
38
+ const e = this.graphStore.getEdge(t).shape.svg;
39
+ this.edgeIdToElementMap.set(t, e), this.container.appendChild(e), this.renderEdge(t), this.updateEdgePriority(t);
40
40
  }
41
- detachEdge(e) {
42
- const t = this.edgeIdToElementMap.get(e);
43
- this.container.removeChild(t), this.edgeIdToElementMap.delete(e);
41
+ detachEdge(t) {
42
+ const e = this.edgeIdToElementMap.get(t);
43
+ this.container.removeChild(e), this.edgeIdToElementMap.delete(t);
44
44
  }
45
45
  clear() {
46
- this.edgeIdToElementMap.forEach((e, t) => {
47
- this.detachEdge(t);
48
- }), this.graphStore.getAllNodeIds().forEach((e) => {
49
- this.detachNode(e);
46
+ this.edgeIdToElementMap.forEach((t, e) => {
47
+ this.detachEdge(e);
48
+ }), this.graphStore.getAllNodeIds().forEach((t) => {
49
+ this.detachNode(t);
50
50
  });
51
51
  }
52
52
  destroy() {
53
53
  this.viewportStore.onAfterUpdated.unsubscribe(this.applyTransform), this.clear(), this.element.removeChild(this.host), this.host.removeChild(this.container);
54
54
  }
55
- updateNodePosition(e) {
56
- const t = this.graphStore.getNode(e), { width: s, height: i } = t.element.getBoundingClientRect(), n = this.viewportStore.getViewportMatrix().scale, a = t.centerFn(s, i), h = t.x - n * a.x, d = t.y - n * a.y;
57
- t.element.style.transform = `translate(${h}px, ${d}px)`;
55
+ updateNodePosition(t) {
56
+ const e = this.graphStore.getNode(t), { width: s, height: i } = e.element.getBoundingClientRect(), n = this.viewportStore.getViewportMatrix().scale, a = e.centerFn(s, i), h = e.x - n * a.x, d = e.y - n * a.y;
57
+ e.element.style.transform = `translate(${h}px, ${d}px)`;
58
58
  }
59
- updateNodePriority(e) {
60
- const t = this.graphStore.getNode(e);
61
- t.element.style.zIndex = `${t.priority}`;
59
+ updateNodePriority(t) {
60
+ const e = this.graphStore.getNode(t);
61
+ e.element.style.zIndex = `${e.priority}`;
62
62
  }
63
- updateEdgeShape(e) {
64
- const t = this.edgeIdToElementMap.get(e);
65
- this.container.removeChild(t);
66
- const s = this.graphStore.getEdge(e);
67
- this.edgeIdToElementMap.set(e, s.shape.svg), this.container.appendChild(s.shape.svg);
63
+ updateEdgeShape(t) {
64
+ const e = this.edgeIdToElementMap.get(t);
65
+ this.container.removeChild(e);
66
+ const s = this.graphStore.getEdge(t);
67
+ this.edgeIdToElementMap.set(t, s.shape.svg), this.container.appendChild(s.shape.svg);
68
68
  }
69
- renderEdge(e) {
70
- const t = this.graphStore.getEdge(e), s = this.graphStore.getPort(t.from), i = this.graphStore.getPort(t.to), n = s.element.getBoundingClientRect(), a = i.element.getBoundingClientRect(), h = this.host.getBoundingClientRect(), d = this.viewportStore.getViewportMatrix(), c = this.createEdgeRenderPort(
71
- t.from,
69
+ renderEdge(t) {
70
+ const e = this.graphStore.getEdge(t), s = this.graphStore.getPort(e.from), i = this.graphStore.getPort(e.to), n = s.element.getBoundingClientRect(), a = i.element.getBoundingClientRect(), h = this.host.getBoundingClientRect(), d = this.viewportStore.getViewportMatrix(), c = this.createEdgeRenderPort(
72
71
  s,
73
72
  n,
74
73
  h,
75
74
  d
76
75
  ), l = this.createEdgeRenderPort(
77
- t.to,
78
76
  i,
79
77
  a,
80
78
  h,
81
79
  d
82
80
  );
83
- let g = R.Line;
84
- s.element === i.element ? g = R.PortCycle : s.nodeId === i.nodeId && (g = R.NodeCycle), t.shape.render({ from: c, to: l, category: g });
85
- }
86
- updateEdgePriority(e) {
87
- const t = this.graphStore.getEdge(e);
88
- t.shape.svg.style.zIndex = `${t.priority}`;
89
- }
90
- createEdgeRenderPort(e, t, s, i, n) {
91
- const a = {
92
- x: s.left - i.left,
93
- y: s.top - i.top
94
- }, h = D(n, a);
81
+ let g = C.Line;
82
+ s.element === i.element ? g = C.PortCycle : s.nodeId === i.nodeId && (g = C.NodeCycle), e.shape.render({ from: c, to: l, category: g });
83
+ }
84
+ updateEdgePriority(t) {
85
+ const e = this.graphStore.getEdge(t);
86
+ e.shape.svg.style.zIndex = `${e.priority}`;
87
+ }
88
+ createEdgeRenderPort(t, e, s, i) {
89
+ const n = {
90
+ x: e.left - s.left,
91
+ y: e.top - s.top
92
+ }, a = T(i, n);
95
93
  return {
96
- x: h.x,
97
- y: h.y,
98
- width: s.width * n.scale,
99
- height: s.height * n.scale,
100
- direction: t.direction,
101
- portId: e,
102
- nodeId: t.nodeId
94
+ x: a.x,
95
+ y: a.y,
96
+ width: e.width * i.scale,
97
+ height: e.height * i.scale,
98
+ direction: t.direction
103
99
  };
104
100
  }
105
101
  }
106
- class Ve {
107
- constructor(e) {
102
+ class Vt {
103
+ constructor(t) {
108
104
  o(this, "xFrom", 1 / 0);
109
105
  o(this, "yFrom", 1 / 0);
110
106
  o(this, "xTo", 1 / 0);
111
107
  o(this, "yTo", 1 / 0);
112
- this.graphStore = e;
108
+ this.graphStore = t;
113
109
  }
114
- setRenderingBox(e) {
115
- this.xFrom = e.x, this.xTo = e.x + e.width, this.yFrom = e.y, this.yTo = e.y + e.height;
110
+ setRenderingBox(t) {
111
+ this.xFrom = t.x, this.xTo = t.x + t.width, this.yFrom = t.y, this.yTo = t.y + t.height;
116
112
  }
117
- hasNode(e) {
118
- const t = this.graphStore.getNode(e);
119
- return t.x >= this.xFrom && t.x <= this.xTo && t.y >= this.yFrom && t.y <= this.yTo;
113
+ hasNode(t) {
114
+ const e = this.graphStore.getNode(t);
115
+ return e.x >= this.xFrom && e.x <= this.xTo && e.y >= this.yFrom && e.y <= this.yTo;
120
116
  }
121
- hasEdge(e) {
122
- const t = this.graphStore.getEdge(e), s = this.graphStore.getPort(t.from).nodeId, i = this.graphStore.getPort(t.to).nodeId, n = this.graphStore.getNode(s), a = this.graphStore.getNode(i), h = Math.min(n.x, a.x), d = Math.max(n.x, a.x), c = Math.min(n.y, a.y), l = Math.max(n.y, a.y);
117
+ hasEdge(t) {
118
+ const e = this.graphStore.getEdge(t), s = this.graphStore.getPort(e.from).nodeId, i = this.graphStore.getPort(e.to).nodeId, n = this.graphStore.getNode(s), a = this.graphStore.getNode(i), h = Math.min(n.x, a.x), d = Math.max(n.x, a.x), c = Math.min(n.y, a.y), l = Math.max(n.y, a.y);
123
119
  return h <= this.xTo && d >= this.xFrom && c <= this.yTo && l >= this.yFrom;
124
120
  }
125
121
  }
126
- class Ie {
127
- constructor(e, t, s, i) {
122
+ class It {
123
+ constructor(t, e, s, i) {
128
124
  o(this, "attachedNodes", /* @__PURE__ */ new Set());
129
125
  o(this, "attachedEdges", /* @__PURE__ */ new Set());
130
126
  o(this, "renderingBox");
131
- o(this, "updateViewport", (e) => {
132
- this.renderingBox.setRenderingBox(e);
133
- const t = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set();
127
+ o(this, "updateViewport", (t) => {
128
+ this.renderingBox.setRenderingBox(t);
129
+ const e = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), i = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set();
134
130
  this.graphStore.getAllNodeIds().forEach((a) => {
135
131
  const h = this.renderingBox.hasNode(a), d = this.attachedNodes.has(a);
136
- h && !d ? t.add(a) : !h && d && s.add(a);
132
+ h && !d ? e.add(a) : !h && d && s.add(a);
137
133
  }), this.graphStore.getAllEdgeIds().forEach((a) => {
138
134
  const h = this.renderingBox.hasEdge(a), d = this.attachedEdges.has(a), c = this.graphStore.getEdge(a), l = this.graphStore.getPort(c.from).nodeId, g = this.graphStore.getPort(c.to).nodeId;
139
- h && (this.renderingBox.hasNode(l) || (t.add(l), s.delete(l)), this.renderingBox.hasNode(g) || (t.add(g), s.delete(g))), h && !d ? i.add(a) : !h && d && n.add(a);
135
+ h && (this.renderingBox.hasNode(l) || (e.add(l), s.delete(l)), this.renderingBox.hasNode(g) || (e.add(g), s.delete(g))), h && !d ? i.add(a) : !h && d && n.add(a);
140
136
  }), n.forEach((a) => {
141
137
  this.handleDetachEdge(a);
142
138
  }), s.forEach((a) => {
143
139
  this.handleDetachNode(a);
144
- }), t.forEach((a) => {
140
+ }), e.forEach((a) => {
145
141
  this.attachedNodes.has(a) || this.handleAttachNode(a);
146
142
  }), i.forEach((a) => {
147
143
  this.handleAttachEdge(a);
148
144
  });
149
145
  });
150
- this.htmlView = e, this.graphStore = t, this.trigger = s, this.params = i, this.renderingBox = new Ve(this.graphStore), this.trigger.subscribe(this.updateViewport);
146
+ this.htmlView = t, this.graphStore = e, this.trigger = s, this.params = i, this.renderingBox = new Vt(this.graphStore), this.trigger.subscribe(this.updateViewport);
151
147
  }
152
- attachNode(e) {
153
- this.renderingBox.hasNode(e) && this.handleAttachNode(e);
148
+ attachNode(t) {
149
+ this.renderingBox.hasNode(t) && this.handleAttachNode(t);
154
150
  }
155
- detachNode(e) {
156
- this.attachedNodes.has(e) && this.handleDetachNode(e);
151
+ detachNode(t) {
152
+ this.attachedNodes.has(t) && this.handleDetachNode(t);
157
153
  }
158
- attachEdge(e) {
159
- this.renderingBox.hasEdge(e) && this.attachEdgeEntities(e);
154
+ attachEdge(t) {
155
+ this.renderingBox.hasEdge(t) && this.attachEdgeEntities(t);
160
156
  }
161
- detachEdge(e) {
162
- this.attachedEdges.has(e) && this.handleDetachEdge(e);
157
+ detachEdge(t) {
158
+ this.attachedEdges.has(t) && this.handleDetachEdge(t);
163
159
  }
164
- updateNodePosition(e) {
165
- this.attachedNodes.has(e) ? this.htmlView.updateNodePosition(e) : this.renderingBox.hasNode(e) && (this.handleAttachNode(e), this.graphStore.getNodeAdjacentEdgeIds(e).forEach((t) => {
166
- this.attachEdgeEntities(t);
160
+ updateNodePosition(t) {
161
+ this.attachedNodes.has(t) ? this.htmlView.updateNodePosition(t) : this.renderingBox.hasNode(t) && (this.handleAttachNode(t), this.graphStore.getNodeAdjacentEdgeIds(t).forEach((e) => {
162
+ this.attachEdgeEntities(e);
167
163
  }));
168
164
  }
169
- updateNodePriority(e) {
170
- this.attachedNodes.has(e) && this.htmlView.updateNodePriority(e);
165
+ updateNodePriority(t) {
166
+ this.attachedNodes.has(t) && this.htmlView.updateNodePriority(t);
171
167
  }
172
- updateEdgeShape(e) {
173
- this.attachedEdges.has(e) && this.htmlView.updateEdgeShape(e);
168
+ updateEdgeShape(t) {
169
+ this.attachedEdges.has(t) && this.htmlView.updateEdgeShape(t);
174
170
  }
175
- renderEdge(e) {
176
- this.attachedEdges.has(e) && this.htmlView.renderEdge(e);
171
+ renderEdge(t) {
172
+ this.attachedEdges.has(t) && this.htmlView.renderEdge(t);
177
173
  }
178
- updateEdgePriority(e) {
179
- this.attachedEdges.has(e) && this.htmlView.updateEdgePriority(e);
174
+ updateEdgePriority(t) {
175
+ this.attachedEdges.has(t) && this.htmlView.updateEdgePriority(t);
180
176
  }
181
177
  clear() {
182
178
  this.htmlView.clear(), this.attachedNodes.clear(), this.attachedEdges.clear();
@@ -184,52 +180,47 @@ class Ie {
184
180
  destroy() {
185
181
  this.clear(), this.htmlView.destroy(), this.trigger.unsubscribe(this.updateViewport);
186
182
  }
187
- attachEdgeEntities(e) {
188
- const t = this.graphStore.getEdge(e), s = this.graphStore.getPort(t.from).nodeId, i = this.graphStore.getPort(t.to).nodeId;
189
- this.attachedNodes.has(s) || this.handleAttachNode(s), this.attachedNodes.has(i) || this.handleAttachNode(i), this.handleAttachEdge(e);
183
+ attachEdgeEntities(t) {
184
+ const e = this.graphStore.getEdge(t), s = this.graphStore.getPort(e.from).nodeId, i = this.graphStore.getPort(e.to).nodeId;
185
+ this.attachedNodes.has(s) || this.handleAttachNode(s), this.attachedNodes.has(i) || this.handleAttachNode(i), this.handleAttachEdge(t);
190
186
  }
191
- handleAttachNode(e) {
192
- this.params.onBeforeNodeAttached(e), this.attachedNodes.add(e), this.htmlView.attachNode(e);
187
+ handleAttachNode(t) {
188
+ this.params.onBeforeNodeAttached(t), this.attachedNodes.add(t), this.htmlView.attachNode(t);
193
189
  }
194
- handleDetachNode(e) {
195
- this.htmlView.detachNode(e), this.attachedNodes.delete(e), this.params.onAfterNodeDetached(e);
190
+ handleDetachNode(t) {
191
+ this.htmlView.detachNode(t), this.attachedNodes.delete(t), this.params.onAfterNodeDetached(t);
196
192
  }
197
- handleAttachEdge(e) {
198
- this.attachedEdges.add(e), this.htmlView.attachEdge(e);
193
+ handleAttachEdge(t) {
194
+ this.attachedEdges.add(t), this.htmlView.attachEdge(t);
199
195
  }
200
- handleDetachEdge(e) {
201
- this.htmlView.detachEdge(e), this.attachedEdges.delete(e);
196
+ handleDetachEdge(t) {
197
+ this.htmlView.detachEdge(t), this.attachedEdges.delete(t);
202
198
  }
203
199
  }
204
- class we {
200
+ class wt {
205
201
  constructor() {
206
202
  o(this, "callbacks", /* @__PURE__ */ new Set());
207
203
  }
208
- subscribe(e) {
209
- this.callbacks.add(e);
204
+ subscribe(t) {
205
+ this.callbacks.add(t);
210
206
  }
211
- unsubscribe(e) {
212
- this.callbacks.delete(e);
207
+ unsubscribe(t) {
208
+ this.callbacks.delete(t);
213
209
  }
214
- emit(e) {
215
- this.callbacks.forEach((t) => {
216
- t(e);
210
+ emit(t) {
211
+ this.callbacks.forEach((e) => {
212
+ e(t);
217
213
  });
218
214
  }
219
215
  }
220
216
  const A = () => {
221
- const r = new we();
217
+ const r = new wt();
222
218
  return [r, r];
223
219
  };
224
- class Ue {
225
- constructor(e) {
226
- /**
227
- * @deprecated
228
- * do not use
229
- */
230
- o(this, "onBeforeUpdated");
220
+ class Ut {
221
+ constructor(t) {
231
222
  o(this, "onAfterUpdated");
232
- this.viewportStore = e, this.onBeforeUpdated = this.viewportStore.onBeforeUpdated, this.onAfterUpdated = this.viewportStore.onAfterUpdated;
223
+ this.viewportStore = t, this.onAfterUpdated = this.viewportStore.onAfterUpdated;
233
224
  }
234
225
  getViewportMatrix() {
235
226
  return { ...this.viewportStore.getViewportMatrix() };
@@ -238,8 +229,8 @@ class Ue {
238
229
  return { ...this.viewportStore.getContentMatrix() };
239
230
  }
240
231
  }
241
- class We {
242
- constructor(e) {
232
+ class Wt {
233
+ constructor(t) {
243
234
  o(this, "onAfterNodeAdded");
244
235
  o(this, "onAfterNodeUpdated");
245
236
  o(this, "onAfterNodePriorityUpdated");
@@ -253,107 +244,86 @@ class We {
253
244
  o(this, "onAfterEdgePriorityUpdated");
254
245
  o(this, "onBeforeEdgeRemoved");
255
246
  o(this, "onBeforeClear");
256
- 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;
247
+ this.graphStore = t, 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;
257
248
  }
258
- getNode(e) {
259
- const t = this.graphStore.getNode(e);
260
- return t === void 0 ? null : {
261
- element: t.element,
262
- x: t.x,
263
- y: t.y,
264
- centerFn: t.centerFn,
265
- priority: t.priority
249
+ getNode(t) {
250
+ const e = this.graphStore.getNode(t);
251
+ return e === void 0 ? null : {
252
+ element: e.element,
253
+ x: e.x,
254
+ y: e.y,
255
+ centerFn: e.centerFn,
256
+ priority: e.priority
266
257
  };
267
258
  }
268
- getElementNodeId(e) {
269
- return this.graphStore.getElementNodeId(e) ?? null;
259
+ getElementNodeId(t) {
260
+ return this.graphStore.getElementNodeId(t) ?? null;
270
261
  }
271
262
  getAllNodeIds() {
272
263
  return this.graphStore.getAllNodeIds();
273
264
  }
274
- getPort(e) {
275
- const t = this.graphStore.getPort(e);
276
- return t === void 0 ? null : {
277
- element: t.element,
278
- direction: t.direction,
279
- nodeId: t.nodeId
265
+ getPort(t) {
266
+ const e = this.graphStore.getPort(t);
267
+ return e === void 0 ? null : {
268
+ element: e.element,
269
+ direction: e.direction,
270
+ nodeId: e.nodeId
280
271
  };
281
272
  }
282
273
  getAllPortIds() {
283
274
  return this.graphStore.getAllPortIds();
284
275
  }
285
- getNodePortIds(e) {
286
- return this.graphStore.getNodePortIds(e) ?? null;
287
- }
288
- getElementPortIds(e) {
289
- return [...this.graphStore.getElementPortIds(e)];
276
+ getNodePortIds(t) {
277
+ return this.graphStore.getNodePortIds(t) ?? null;
290
278
  }
291
- /**
292
- * @deprecated
293
- * use getElementPortIds instead
294
- */
295
- getElementPortsIds(e) {
296
- return this.getElementPortIds(e);
279
+ getElementPortIds(t) {
280
+ return [...this.graphStore.getElementPortIds(t)];
297
281
  }
298
282
  getAllEdgeIds() {
299
283
  return this.graphStore.getAllEdgeIds();
300
284
  }
301
- getEdge(e) {
302
- const t = this.graphStore.getEdge(e);
303
- return t === void 0 ? null : {
304
- from: t.from,
305
- to: t.to,
306
- priority: t.priority,
307
- shape: t.shape
285
+ getEdge(t) {
286
+ const e = this.graphStore.getEdge(t);
287
+ return e === void 0 ? null : {
288
+ from: e.from,
289
+ to: e.to,
290
+ priority: e.priority,
291
+ shape: e.shape
308
292
  };
309
293
  }
310
- getPortIncomingEdgeIds(e) {
311
- return this.graphStore.getPort(e) === void 0 ? null : this.graphStore.getPortIncomingEdgeIds(e);
312
- }
313
- getPortOutgoingEdgeIds(e) {
314
- return this.graphStore.getPort(e) === void 0 ? null : this.graphStore.getPortOutgoingEdgeIds(e);
315
- }
316
- /**
317
- * @deprecated
318
- * use getPortOutgoingEdgeIds instead
319
- */
320
- getPortOutcomingEdgeIds(e) {
321
- return this.getPortOutgoingEdgeIds(e);
294
+ getPortIncomingEdgeIds(t) {
295
+ return this.graphStore.getPort(t) === void 0 ? null : this.graphStore.getPortIncomingEdgeIds(t);
322
296
  }
323
- getPortCycleEdgeIds(e) {
324
- return this.graphStore.getPort(e) === void 0 ? null : this.graphStore.getPortCycleEdgeIds(e);
297
+ getPortOutgoingEdgeIds(t) {
298
+ return this.graphStore.getPort(t) === void 0 ? null : this.graphStore.getPortOutgoingEdgeIds(t);
325
299
  }
326
- getPortAdjacentEdgeIds(e) {
327
- return this.graphStore.getPort(e) === void 0 ? null : this.graphStore.getPortAdjacentEdgeIds(e);
300
+ getPortCycleEdgeIds(t) {
301
+ return this.graphStore.getPort(t) === void 0 ? null : this.graphStore.getPortCycleEdgeIds(t);
328
302
  }
329
- getNodeIncomingEdgeIds(e) {
330
- return this.graphStore.getNode(e) === void 0 ? null : this.graphStore.getNodeIncomingEdgeIds(e);
303
+ getPortAdjacentEdgeIds(t) {
304
+ return this.graphStore.getPort(t) === void 0 ? null : this.graphStore.getPortAdjacentEdgeIds(t);
331
305
  }
332
- getNodeOutgoingEdgeIds(e) {
333
- return this.graphStore.getNode(e) === void 0 ? null : this.graphStore.getNodeOutgoingEdgeIds(e);
306
+ getNodeIncomingEdgeIds(t) {
307
+ return this.graphStore.getNode(t) === void 0 ? null : this.graphStore.getNodeIncomingEdgeIds(t);
334
308
  }
335
- /**
336
- * @deprecated
337
- * use getNodeOutgoingEdgeIds instead
338
- */
339
- getNodeOutcomingEdgeIds(e) {
340
- return this.getNodeOutgoingEdgeIds(e);
309
+ getNodeOutgoingEdgeIds(t) {
310
+ return this.graphStore.getNode(t) === void 0 ? null : this.graphStore.getNodeOutgoingEdgeIds(t);
341
311
  }
342
- getNodeCycleEdgeIds(e) {
343
- return this.graphStore.getNode(e) === void 0 ? null : this.graphStore.getNodeCycleEdgeIds(e);
312
+ getNodeCycleEdgeIds(t) {
313
+ return this.graphStore.getNode(t) === void 0 ? null : this.graphStore.getNodeCycleEdgeIds(t);
344
314
  }
345
- getNodeAdjacentEdgeIds(e) {
346
- return this.graphStore.getNode(e) === void 0 ? null : this.graphStore.getNodeAdjacentEdgeIds(e);
315
+ getNodeAdjacentEdgeIds(t) {
316
+ return this.graphStore.getNode(t) === void 0 ? null : this.graphStore.getNodeAdjacentEdgeIds(t);
347
317
  }
348
318
  }
349
319
  class z {
350
- constructor(e) {
320
+ constructor(t) {
351
321
  o(this, "counter", 0);
352
- this.checkExists = e;
322
+ this.checkExists = t;
353
323
  }
354
- create(e) {
355
- if (e !== void 0)
356
- return e;
324
+ create(t) {
325
+ if (t !== void 0)
326
+ return t;
357
327
  for (; this.checkExists(this.counter); )
358
328
  this.counter++;
359
329
  return this.counter;
@@ -365,11 +335,11 @@ class z {
365
335
  class S extends Error {
366
336
  constructor() {
367
337
  super(...arguments);
368
- o(this, "name", "HtmlGraphError");
338
+ o(this, "name", "CanvasError");
369
339
  }
370
340
  }
371
- class fe {
372
- constructor(e, t, s, i, n) {
341
+ class ft {
342
+ constructor(t, e, s, i) {
373
343
  /**
374
344
  * provides api for accessing model of rendered graph
375
345
  */
@@ -379,54 +349,54 @@ class fe {
379
349
  */
380
350
  o(this, "viewport");
381
351
  o(this, "nodeIdGenerator", new z(
382
- (e) => this.graph.getNode(e) !== null
352
+ (t) => this.graph.getNode(t) !== null
383
353
  ));
384
354
  o(this, "portIdGenerator", new z(
385
- (e) => this.graph.getPort(e) !== null
355
+ (t) => this.graph.getPort(t) !== null
386
356
  ));
387
357
  o(this, "edgeIdGenerator", new z(
388
- (e) => this.graph.getEdge(e) !== null
358
+ (t) => this.graph.getEdge(t) !== null
389
359
  ));
390
- o(this, "onAfterNodeAdded", (e) => {
391
- this.htmlView.attachNode(e);
360
+ o(this, "onAfterNodeAdded", (t) => {
361
+ this.htmlView.attachNode(t);
392
362
  });
393
- o(this, "onAfterNodeUpdated", (e) => {
394
- this.htmlView.updateNodePosition(e), this.graphStore.getNodeAdjacentEdgeIds(e).forEach((s) => {
363
+ o(this, "onAfterNodeUpdated", (t) => {
364
+ this.htmlView.updateNodePosition(t), this.graphStore.getNodeAdjacentEdgeIds(t).forEach((s) => {
395
365
  this.htmlView.renderEdge(s);
396
366
  });
397
367
  });
398
- o(this, "onAfterNodePriorityUpdated", (e) => {
399
- this.htmlView.updateNodePriority(e);
368
+ o(this, "onAfterNodePriorityUpdated", (t) => {
369
+ this.htmlView.updateNodePriority(t);
400
370
  });
401
- o(this, "onBeforeNodeRemoved", (e) => {
402
- this.graphStore.getNodePortIds(e).forEach((t) => {
403
- this.unmarkPort(t);
404
- }), this.htmlView.detachNode(e);
371
+ o(this, "onBeforeNodeRemoved", (t) => {
372
+ this.graphStore.getNodePortIds(t).forEach((e) => {
373
+ this.unmarkPort(e);
374
+ }), this.htmlView.detachNode(t);
405
375
  });
406
- o(this, "onAfterPortUpdated", (e) => {
407
- this.graphStore.getPortAdjacentEdgeIds(e).forEach((s) => {
376
+ o(this, "onAfterPortUpdated", (t) => {
377
+ this.graphStore.getPortAdjacentEdgeIds(t).forEach((s) => {
408
378
  this.htmlView.renderEdge(s);
409
379
  });
410
380
  });
411
- o(this, "onBeforePortUnmarked", (e) => {
412
- this.graphStore.getPortAdjacentEdgeIds(e).forEach((t) => {
413
- this.removeEdge(t);
381
+ o(this, "onBeforePortUnmarked", (t) => {
382
+ this.graphStore.getPortAdjacentEdgeIds(t).forEach((e) => {
383
+ this.removeEdge(e);
414
384
  });
415
385
  });
416
- o(this, "onAfterEdgeAdded", (e) => {
417
- this.htmlView.attachEdge(e);
386
+ o(this, "onAfterEdgeAdded", (t) => {
387
+ this.htmlView.attachEdge(t);
418
388
  });
419
- o(this, "onAfterEdgeShapeUpdated", (e) => {
420
- this.htmlView.updateEdgeShape(e);
389
+ o(this, "onAfterEdgeShapeUpdated", (t) => {
390
+ this.htmlView.updateEdgeShape(t);
421
391
  });
422
- o(this, "onAfterEdgeUpdated", (e) => {
423
- this.htmlView.renderEdge(e);
392
+ o(this, "onAfterEdgeUpdated", (t) => {
393
+ this.htmlView.renderEdge(t);
424
394
  });
425
- o(this, "onAfterEdgePriorityUpdated", (e) => {
426
- this.htmlView.updateEdgePriority(e);
395
+ o(this, "onAfterEdgePriorityUpdated", (t) => {
396
+ this.htmlView.updateEdgePriority(t);
427
397
  });
428
- o(this, "onBeforeEdgeRemoved", (e) => {
429
- this.htmlView.detachEdge(e);
398
+ o(this, "onBeforeEdgeRemoved", (t) => {
399
+ this.htmlView.detachEdge(t);
430
400
  });
431
401
  o(this, "onBeforeClear", () => {
432
402
  this.nodeIdGenerator.reset(), this.portIdGenerator.reset(), this.edgeIdGenerator.reset(), this.htmlView.clear();
@@ -437,7 +407,7 @@ class fe {
437
407
  * emits event just before destruction of canvas
438
408
  */
439
409
  o(this, "onBeforeDestroy");
440
- this.element = e, this.graphStore = t, this.viewportStore = s, this.htmlView = i, this.params = n, this.graph = new We(this.graphStore), this.viewport = new Ue(this.viewportStore), this.graphStore.onAfterNodeAdded.subscribe(this.onAfterNodeAdded), this.graphStore.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated), this.graphStore.onAfterNodePriorityUpdated.subscribe(
410
+ this.graphStore = t, this.viewportStore = e, this.htmlView = s, this.params = i, this.graph = new Wt(this.graphStore), this.viewport = new Ut(this.viewportStore), this.graphStore.onAfterNodeAdded.subscribe(this.onAfterNodeAdded), this.graphStore.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated), this.graphStore.onAfterNodePriorityUpdated.subscribe(
441
411
  this.onAfterNodePriorityUpdated
442
412
  ), 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(
443
413
  this.onAfterEdgeShapeUpdated
@@ -448,27 +418,27 @@ class fe {
448
418
  /**
449
419
  * adds new node
450
420
  */
451
- addNode(e) {
452
- const t = this.nodeIdGenerator.create(e.id);
453
- if (this.graph.getNode(t) !== null)
421
+ addNode(t) {
422
+ const e = this.nodeIdGenerator.create(t.id);
423
+ if (this.graph.getNode(e) !== null)
454
424
  throw new S("failed to add node with existing id");
455
- if (this.graphStore.getElementNodeId(e.element) !== void 0)
425
+ if (this.graphStore.getElementNodeId(t.element) !== void 0)
456
426
  throw new S(
457
427
  "failed to add node with html element already in use by another node"
458
428
  );
459
429
  if (this.graphStore.addNode({
460
- id: t,
461
- element: e.element,
462
- x: e.x,
463
- y: e.y,
464
- centerFn: e.centerFn ?? this.params.nodes.centerFn,
465
- priority: e.priority ?? this.params.nodes.priorityFn()
466
- }), e.ports !== void 0)
467
- for (const s of e.ports)
430
+ id: e,
431
+ element: t.element,
432
+ x: t.x,
433
+ y: t.y,
434
+ centerFn: t.centerFn ?? this.params.nodes.centerFn,
435
+ priority: t.priority ?? this.params.nodes.priorityFn()
436
+ }), t.ports !== void 0)
437
+ for (const s of t.ports)
468
438
  this.markPort({
469
439
  id: s.id,
470
440
  element: s.element,
471
- nodeId: t,
441
+ nodeId: e,
472
442
  direction: s.direction
473
443
  });
474
444
  return this;
@@ -476,100 +446,100 @@ class fe {
476
446
  /**
477
447
  * updates node parameters
478
448
  */
479
- updateNode(e, t) {
480
- if (this.graph.getNode(e) === null)
449
+ updateNode(t, e) {
450
+ if (this.graph.getNode(t) === null)
481
451
  throw new S("failed to update non existing node");
482
- return this.graphStore.updateNode(e, t ?? {}), this;
452
+ return this.graphStore.updateNode(t, e ?? {}), this;
483
453
  }
484
454
  /**
485
455
  * removes specified node
486
456
  * all the ports of node get unmarked
487
457
  * all the edges adjacent to node get removed
488
458
  */
489
- removeNode(e) {
490
- if (this.graph.getNode(e) === null)
459
+ removeNode(t) {
460
+ if (this.graph.getNode(t) === null)
491
461
  throw new S("failed to remove non existing node");
492
- return this.graphStore.removeNode(e), this;
462
+ return this.graphStore.removeNode(t), this;
493
463
  }
494
464
  /**
495
465
  * marks specified element as a port for specified node
496
466
  */
497
- markPort(e) {
498
- const t = this.portIdGenerator.create(e.id);
499
- if (this.graph.getPort(t) !== null)
467
+ markPort(t) {
468
+ const e = this.portIdGenerator.create(t.id);
469
+ if (this.graph.getPort(e) !== null)
500
470
  throw new S("failed to add port with existing id");
501
- if (this.graph.getNode(e.nodeId) === null)
471
+ if (this.graph.getNode(t.nodeId) === null)
502
472
  throw new S("failed to mark port for nonexistent node");
503
473
  return this.graphStore.addPort({
504
- id: t,
505
- element: e.element,
506
- nodeId: e.nodeId,
507
- direction: e.direction ?? this.params.ports.direction
474
+ id: e,
475
+ element: t.element,
476
+ nodeId: t.nodeId,
477
+ direction: t.direction ?? this.params.ports.direction
508
478
  }), this;
509
479
  }
510
480
  /**
511
481
  * updates port and edges attached to it
512
482
  */
513
- updatePort(e, t) {
514
- if (this.graph.getPort(e) === null)
483
+ updatePort(t, e) {
484
+ if (this.graph.getPort(t) === null)
515
485
  throw new S("failed to update nonexistent port");
516
- return this.graphStore.updatePort(e, t ?? {}), this;
486
+ return this.graphStore.updatePort(t, e ?? {}), this;
517
487
  }
518
488
  /**
519
489
  * unmarks specified port
520
490
  * all the edges adjacent to the port get removed
521
491
  */
522
- unmarkPort(e) {
523
- if (this.graph.getPort(e) === null)
492
+ unmarkPort(t) {
493
+ if (this.graph.getPort(t) === null)
524
494
  throw new S("failed to unmark non existing port");
525
- return this.graphStore.removePort(e), this;
495
+ return this.graphStore.removePort(t), this;
526
496
  }
527
497
  /**
528
498
  * adds new edge
529
499
  */
530
- addEdge(e) {
531
- const t = this.edgeIdGenerator.create(e.id);
532
- if (this.graph.getEdge(t) !== null)
500
+ addEdge(t) {
501
+ const e = this.edgeIdGenerator.create(t.id);
502
+ if (this.graph.getEdge(e) !== null)
533
503
  throw new S("failed to add edge with existing id");
534
- if (this.graph.getPort(e.from) === null)
504
+ if (this.graph.getPort(t.from) === null)
535
505
  throw new S("failed to add edge from nonexistent port");
536
- if (this.graph.getPort(e.to) === null)
506
+ if (this.graph.getPort(t.to) === null)
537
507
  throw new S("failed to add edge to nonexistent port");
538
508
  return this.graphStore.addEdge({
539
- id: t,
540
- from: e.from,
541
- to: e.to,
542
- shape: e.shape ?? this.params.edges.shapeFactory(t),
543
- priority: e.priority ?? this.params.edges.priorityFn()
509
+ id: e,
510
+ from: t.from,
511
+ to: t.to,
512
+ shape: t.shape ?? this.params.edges.shapeFactory(e),
513
+ priority: t.priority ?? this.params.edges.priorityFn()
544
514
  }), this;
545
515
  }
546
516
  /**
547
517
  * updates specified edge
548
518
  */
549
- updateEdge(e, t) {
550
- if (this.graph.getEdge(e) === null)
519
+ updateEdge(t, e) {
520
+ if (this.graph.getEdge(t) === null)
551
521
  throw new S("failed to update nonexistent edge");
552
- return this.graphStore.updateEdge(e, t ?? {}), this;
522
+ return this.graphStore.updateEdge(t, e ?? {}), this;
553
523
  }
554
524
  /**
555
525
  * removes specified edge
556
526
  */
557
- removeEdge(e) {
558
- if (this.graph.getEdge(e) === null)
527
+ removeEdge(t) {
528
+ if (this.graph.getEdge(t) === null)
559
529
  throw new S("failed to remove nonexistent edge");
560
- return this.graphStore.removeEdge(e), this;
530
+ return this.graphStore.removeEdge(t), this;
561
531
  }
562
532
  /**
563
533
  * applies transformation for viewport matrix
564
534
  */
565
- patchViewportMatrix(e) {
566
- return this.viewportStore.patchViewportMatrix(e), this;
535
+ patchViewportMatrix(t) {
536
+ return this.viewportStore.patchViewportMatrix(t), this;
567
537
  }
568
538
  /**
569
539
  * applies transformation for content matrix
570
540
  */
571
- patchContentMatrix(e) {
572
- return this.viewportStore.patchContentMatrix(e), this;
541
+ patchContentMatrix(t) {
542
+ return this.viewportStore.patchContentMatrix(t), this;
573
543
  }
574
544
  /**
575
545
  * clears canvas from nodes and edges
@@ -592,47 +562,47 @@ class fe {
592
562
  ), this.graphStore.onBeforeEdgeRemoved.unsubscribe(this.onBeforeEdgeRemoved), this.graphStore.onBeforeClear.unsubscribe(this.onBeforeClear), this.htmlView.destroy(), this.destroyed = !0);
593
563
  }
594
564
  }
595
- class Be {
565
+ class $t {
596
566
  constructor() {
597
567
  o(this, "singleToMultiMap", /* @__PURE__ */ new Map());
598
568
  o(this, "multiToSingleMap", /* @__PURE__ */ new Map());
599
569
  }
600
- addRecord(e, t) {
601
- const s = this.singleToMultiMap.get(e);
602
- s === void 0 ? this.singleToMultiMap.set(e, /* @__PURE__ */ new Set([t])) : s.add(t), this.multiToSingleMap.set(t, e);
570
+ addRecord(t, e) {
571
+ const s = this.singleToMultiMap.get(t);
572
+ s === void 0 ? this.singleToMultiMap.set(t, /* @__PURE__ */ new Set([e])) : s.add(e), this.multiToSingleMap.set(e, t);
603
573
  }
604
- getMultiBySingle(e) {
605
- const t = this.singleToMultiMap.get(e) ?? /* @__PURE__ */ new Set();
606
- return Array.from(t.values());
574
+ getMultiBySingle(t) {
575
+ const e = this.singleToMultiMap.get(t) ?? /* @__PURE__ */ new Set();
576
+ return Array.from(e.values());
607
577
  }
608
- removeByMulti(e) {
609
- const t = this.multiToSingleMap.get(e), s = this.singleToMultiMap.get(t);
610
- s.delete(e), s.size === 0 && this.singleToMultiMap.delete(t), this.multiToSingleMap.delete(e);
578
+ removeByMulti(t) {
579
+ const e = this.multiToSingleMap.get(t), s = this.singleToMultiMap.get(e);
580
+ s.delete(t), s.size === 0 && this.singleToMultiMap.delete(e), this.multiToSingleMap.delete(t);
611
581
  }
612
- getByMulti(e) {
613
- return this.multiToSingleMap.get(e);
582
+ getByMulti(t) {
583
+ return this.multiToSingleMap.get(t);
614
584
  }
615
- removeBySingle(e) {
616
- this.singleToMultiMap.get(e).forEach((s) => {
585
+ removeBySingle(t) {
586
+ this.singleToMultiMap.get(t).forEach((s) => {
617
587
  this.multiToSingleMap.delete(s);
618
- }), this.singleToMultiMap.delete(e);
588
+ }), this.singleToMultiMap.delete(t);
619
589
  }
620
590
  clear() {
621
591
  this.singleToMultiMap.clear(), this.multiToSingleMap.clear();
622
592
  }
623
- forEachSingle(e) {
624
- this.singleToMultiMap.forEach((t, s) => {
625
- e(s);
593
+ forEachSingle(t) {
594
+ this.singleToMultiMap.forEach((e, s) => {
595
+ t(s);
626
596
  });
627
597
  }
628
- hasSingle(e) {
629
- return this.singleToMultiMap.get(e) !== void 0;
598
+ hasSingle(t) {
599
+ return this.singleToMultiMap.get(t) !== void 0;
630
600
  }
631
- hasMulti(e) {
632
- return this.multiToSingleMap.get(e) !== void 0;
601
+ hasMulti(t) {
602
+ return this.multiToSingleMap.get(t) !== void 0;
633
603
  }
634
604
  }
635
- class me {
605
+ class mt {
636
606
  constructor() {
637
607
  o(this, "nodes", /* @__PURE__ */ new Map());
638
608
  o(this, "ports", /* @__PURE__ */ new Map());
@@ -641,7 +611,7 @@ class me {
641
611
  o(this, "incomingEdges", /* @__PURE__ */ new Map());
642
612
  o(this, "outcomingEdges", /* @__PURE__ */ new Map());
643
613
  o(this, "cycleEdges", /* @__PURE__ */ new Map());
644
- o(this, "elementPorts", new Be());
614
+ o(this, "elementPorts", new $t());
645
615
  o(this, "afterNodeAddedEmitter");
646
616
  o(this, "onAfterNodeAdded");
647
617
  o(this, "afterNodeUpdatedEmitter");
@@ -670,172 +640,166 @@ class me {
670
640
  o(this, "onBeforeClear");
671
641
  [this.afterNodeAddedEmitter, this.onAfterNodeAdded] = A(), [this.afterNodeUpdatedEmitter, this.onAfterNodeUpdated] = A(), [this.afterNodePriorityUpdatedEmitter, this.onAfterNodePriorityUpdated] = A(), [this.beforeNodeRemovedEmitter, this.onBeforeNodeRemoved] = A(), [this.afterPortAddedEmitter, this.onAfterPortAdded] = A(), [this.afterPortUpdatedEmitter, this.onAfterPortUpdated] = A(), [this.beforePortRemovedEmitter, this.onBeforePortRemoved] = A(), [this.afterEdgeAddedEmitter, this.onAfterEdgeAdded] = A(), [this.afterEdgeShapeUpdatedEmitter, this.onAfterEdgeShapeUpdated] = A(), [this.afterEdgeUpdatedEmitter, this.onAfterEdgeUpdated] = A(), [this.afterEdgePriorityUpdatedEmitter, this.onAfterEdgePriorityUpdated] = A(), [this.beforeEdgeRemovedEmitter, this.onBeforeEdgeRemoved] = A(), [this.beforeClearEmitter, this.onBeforeClear] = A();
672
642
  }
673
- addNode(e) {
674
- const t = /* @__PURE__ */ new Map(), s = {
675
- element: e.element,
676
- x: e.x,
677
- y: e.y,
678
- centerFn: e.centerFn,
679
- priority: e.priority,
680
- ports: t
643
+ addNode(t) {
644
+ const e = /* @__PURE__ */ new Map(), s = {
645
+ element: t.element,
646
+ x: t.x,
647
+ y: t.y,
648
+ centerFn: t.centerFn,
649
+ priority: t.priority,
650
+ ports: e
681
651
  };
682
- this.nodes.set(e.id, s), this.nodesElementsMap.set(e.element, e.id), this.afterNodeAddedEmitter.emit(e.id);
652
+ this.nodes.set(t.id, s), this.nodesElementsMap.set(t.element, t.id), this.afterNodeAddedEmitter.emit(t.id);
683
653
  }
684
654
  getAllNodeIds() {
685
655
  return Array.from(this.nodes.keys());
686
656
  }
687
- getNode(e) {
688
- return this.nodes.get(e);
657
+ getNode(t) {
658
+ return this.nodes.get(t);
689
659
  }
690
- getElementNodeId(e) {
691
- return this.nodesElementsMap.get(e);
660
+ getElementNodeId(t) {
661
+ return this.nodesElementsMap.get(t);
692
662
  }
693
- updateNode(e, t) {
694
- const s = this.nodes.get(e);
695
- s.x = t.x ?? s.x, s.y = t.y ?? s.y, s.centerFn = t.centerFn ?? s.centerFn, t.priority !== void 0 && (s.priority = t.priority, this.afterNodePriorityUpdatedEmitter.emit(e)), this.afterNodeUpdatedEmitter.emit(e);
663
+ updateNode(t, e) {
664
+ const s = this.nodes.get(t);
665
+ s.x = e.x ?? s.x, s.y = e.y ?? s.y, s.centerFn = e.centerFn ?? s.centerFn, e.priority !== void 0 && (s.priority = e.priority, this.afterNodePriorityUpdatedEmitter.emit(t)), this.afterNodeUpdatedEmitter.emit(t);
696
666
  }
697
- removeNode(e) {
698
- this.beforeNodeRemovedEmitter.emit(e);
699
- const t = this.nodes.get(e);
700
- this.nodesElementsMap.delete(t.element), this.nodes.delete(e);
667
+ removeNode(t) {
668
+ this.beforeNodeRemovedEmitter.emit(t);
669
+ const e = this.nodes.get(t);
670
+ this.nodesElementsMap.delete(e.element), this.nodes.delete(t);
701
671
  }
702
- addPort(e) {
703
- this.ports.set(e.id, {
704
- element: e.element,
705
- direction: e.direction,
706
- nodeId: e.nodeId
707
- }), this.elementPorts.addRecord(e.element, e.id), this.cycleEdges.set(e.id, /* @__PURE__ */ new Set()), this.incomingEdges.set(e.id, /* @__PURE__ */ new Set()), this.outcomingEdges.set(e.id, /* @__PURE__ */ new Set()), this.nodes.get(e.nodeId).ports.set(e.id, e.element), this.afterPortAddedEmitter.emit(e.id);
672
+ addPort(t) {
673
+ this.ports.set(t.id, {
674
+ element: t.element,
675
+ direction: t.direction,
676
+ nodeId: t.nodeId
677
+ }), this.elementPorts.addRecord(t.element, t.id), this.cycleEdges.set(t.id, /* @__PURE__ */ new Set()), this.incomingEdges.set(t.id, /* @__PURE__ */ new Set()), this.outcomingEdges.set(t.id, /* @__PURE__ */ new Set()), this.nodes.get(t.nodeId).ports.set(t.id, t.element), this.afterPortAddedEmitter.emit(t.id);
708
678
  }
709
- getPort(e) {
710
- return this.ports.get(e);
679
+ getPort(t) {
680
+ return this.ports.get(t);
711
681
  }
712
- updatePort(e, t) {
713
- const s = this.ports.get(e);
714
- s.direction = t.direction ?? s.direction, this.afterPortUpdatedEmitter.emit(e);
682
+ updatePort(t, e) {
683
+ const s = this.ports.get(t);
684
+ s.direction = e.direction ?? s.direction, this.afterPortUpdatedEmitter.emit(t);
715
685
  }
716
686
  getAllPortIds() {
717
687
  return Array.from(this.ports.keys());
718
688
  }
719
- getElementPortIds(e) {
720
- return this.elementPorts.getMultiBySingle(e);
689
+ getElementPortIds(t) {
690
+ return this.elementPorts.getMultiBySingle(t);
721
691
  }
722
- getNodePortIds(e) {
723
- const t = this.nodes.get(e);
724
- if (t !== void 0)
725
- return Array.from(t.ports.keys());
726
- }
727
- removePort(e) {
728
- const t = this.ports.get(e).nodeId;
729
- this.beforePortRemovedEmitter.emit(e), this.nodes.get(t).ports.delete(e), this.ports.delete(e), this.elementPorts.removeByMulti(e);
730
- }
731
- addEdge(e) {
732
- this.addEdgeInternal(e), this.afterEdgeAddedEmitter.emit(e.id);
733
- }
734
- updateEdge(e, t) {
735
- if (t.from !== void 0 || t.to !== void 0) {
736
- const i = this.edges.get(e);
737
- this.removeEdgeInternal(e), this.addEdgeInternal({
738
- id: e,
739
- from: t.from ?? i.from,
740
- to: t.to ?? i.to,
692
+ getNodePortIds(t) {
693
+ const e = this.nodes.get(t);
694
+ if (e !== void 0)
695
+ return Array.from(e.ports.keys());
696
+ }
697
+ removePort(t) {
698
+ const e = this.ports.get(t).nodeId;
699
+ this.beforePortRemovedEmitter.emit(t), this.nodes.get(e).ports.delete(t), this.ports.delete(t), this.elementPorts.removeByMulti(t);
700
+ }
701
+ addEdge(t) {
702
+ this.addEdgeInternal(t), this.afterEdgeAddedEmitter.emit(t.id);
703
+ }
704
+ updateEdge(t, e) {
705
+ if (e.from !== void 0 || e.to !== void 0) {
706
+ const i = this.edges.get(t);
707
+ this.removeEdgeInternal(t), this.addEdgeInternal({
708
+ id: t,
709
+ from: e.from ?? i.from,
710
+ to: e.to ?? i.to,
741
711
  shape: i.shape,
742
712
  priority: i.priority
743
713
  });
744
714
  }
745
- const s = this.edges.get(e);
746
- t.shape !== void 0 && (s.shape = t.shape, this.afterEdgeShapeUpdatedEmitter.emit(e)), t.priority !== void 0 && (s.priority = t.priority, this.afterEdgePriorityUpdatedEmitter.emit(e)), this.afterEdgeUpdatedEmitter.emit(e);
715
+ const s = this.edges.get(t);
716
+ e.shape !== void 0 && (s.shape = e.shape, this.afterEdgeShapeUpdatedEmitter.emit(t)), e.priority !== void 0 && (s.priority = e.priority, this.afterEdgePriorityUpdatedEmitter.emit(t)), this.afterEdgeUpdatedEmitter.emit(t);
747
717
  }
748
718
  getAllEdgeIds() {
749
719
  return Array.from(this.edges.keys());
750
720
  }
751
- getEdge(e) {
752
- return this.edges.get(e);
721
+ getEdge(t) {
722
+ return this.edges.get(t);
753
723
  }
754
- removeEdge(e) {
755
- this.beforeEdgeRemovedEmitter.emit(e), this.removeEdgeInternal(e);
724
+ removeEdge(t) {
725
+ this.beforeEdgeRemovedEmitter.emit(t), this.removeEdgeInternal(t);
756
726
  }
757
727
  clear() {
758
728
  this.beforeClearEmitter.emit(), this.incomingEdges.clear(), this.outcomingEdges.clear(), this.cycleEdges.clear(), this.elementPorts.clear(), this.nodesElementsMap.clear(), this.edges.clear(), this.ports.clear(), this.nodes.clear();
759
729
  }
760
- getPortIncomingEdgeIds(e) {
761
- return Array.from(this.incomingEdges.get(e));
730
+ getPortIncomingEdgeIds(t) {
731
+ return Array.from(this.incomingEdges.get(t));
762
732
  }
763
- getPortOutgoingEdgeIds(e) {
764
- return Array.from(this.outcomingEdges.get(e));
733
+ getPortOutgoingEdgeIds(t) {
734
+ return Array.from(this.outcomingEdges.get(t));
765
735
  }
766
- getPortCycleEdgeIds(e) {
767
- return Array.from(this.cycleEdges.get(e));
736
+ getPortCycleEdgeIds(t) {
737
+ return Array.from(this.cycleEdges.get(t));
768
738
  }
769
- getPortAdjacentEdgeIds(e) {
739
+ getPortAdjacentEdgeIds(t) {
770
740
  return [
771
- ...this.getPortIncomingEdgeIds(e),
772
- ...this.getPortOutgoingEdgeIds(e),
773
- ...this.getPortCycleEdgeIds(e)
741
+ ...this.getPortIncomingEdgeIds(t),
742
+ ...this.getPortOutgoingEdgeIds(t),
743
+ ...this.getPortCycleEdgeIds(t)
774
744
  ];
775
745
  }
776
- getNodeIncomingEdgeIds(e) {
777
- const t = Array.from(this.nodes.get(e).ports.keys());
746
+ getNodeIncomingEdgeIds(t) {
747
+ const e = Array.from(this.nodes.get(t).ports.keys());
778
748
  let s = [];
779
- return t.forEach((i) => {
749
+ return e.forEach((i) => {
780
750
  s = [...s, ...this.getPortIncomingEdgeIds(i)];
781
751
  }), s;
782
752
  }
783
- getNodeOutgoingEdgeIds(e) {
784
- const t = Array.from(this.nodes.get(e).ports.keys());
753
+ getNodeOutgoingEdgeIds(t) {
754
+ const e = Array.from(this.nodes.get(t).ports.keys());
785
755
  let s = [];
786
- return t.forEach((i) => {
756
+ return e.forEach((i) => {
787
757
  s = [...s, ...this.getPortOutgoingEdgeIds(i)];
788
758
  }), s;
789
759
  }
790
- getNodeCycleEdgeIds(e) {
791
- const t = Array.from(this.nodes.get(e).ports.keys());
760
+ getNodeCycleEdgeIds(t) {
761
+ const e = Array.from(this.nodes.get(t).ports.keys());
792
762
  let s = [];
793
- return t.forEach((i) => {
763
+ return e.forEach((i) => {
794
764
  s = [...s, ...this.getPortCycleEdgeIds(i)];
795
765
  }), s;
796
766
  }
797
- getNodeAdjacentEdgeIds(e) {
767
+ getNodeAdjacentEdgeIds(t) {
798
768
  return [
799
- ...this.getNodeIncomingEdgeIds(e),
800
- ...this.getNodeOutgoingEdgeIds(e),
801
- ...this.getNodeCycleEdgeIds(e)
769
+ ...this.getNodeIncomingEdgeIds(t),
770
+ ...this.getNodeOutgoingEdgeIds(t),
771
+ ...this.getNodeCycleEdgeIds(t)
802
772
  ];
803
773
  }
804
- addEdgeInternal(e) {
805
- this.edges.set(e.id, {
806
- from: e.from,
807
- to: e.to,
808
- shape: e.shape,
809
- priority: e.priority
810
- }), e.from !== e.to ? (this.outcomingEdges.get(e.from).add(e.id), this.incomingEdges.get(e.to).add(e.id)) : this.cycleEdges.get(e.from).add(e.id);
774
+ addEdgeInternal(t) {
775
+ this.edges.set(t.id, {
776
+ from: t.from,
777
+ to: t.to,
778
+ shape: t.shape,
779
+ priority: t.priority
780
+ }), t.from !== t.to ? (this.outcomingEdges.get(t.from).add(t.id), this.incomingEdges.get(t.to).add(t.id)) : this.cycleEdges.get(t.from).add(t.id);
811
781
  }
812
- removeEdgeInternal(e) {
813
- const t = this.edges.get(e), s = t.from, i = t.to;
814
- this.cycleEdges.get(s).delete(e), this.cycleEdges.get(i).delete(e), this.incomingEdges.get(s).delete(e), this.incomingEdges.get(i).delete(e), this.outcomingEdges.get(s).delete(e), this.outcomingEdges.get(i).delete(e), this.edges.delete(e);
782
+ removeEdgeInternal(t) {
783
+ const e = this.edges.get(t), s = e.from, i = e.to;
784
+ this.cycleEdges.get(s).delete(t), this.cycleEdges.get(i).delete(t), this.incomingEdges.get(s).delete(t), this.incomingEdges.get(i).delete(t), this.outcomingEdges.get(s).delete(t), this.outcomingEdges.get(i).delete(t), this.edges.delete(t);
815
785
  }
816
786
  }
817
- const ie = (r) => ({
787
+ const it = (r) => ({
818
788
  scale: 1 / r.scale,
819
789
  x: -r.x / r.scale,
820
790
  y: -r.y / r.scale
821
- }), ne = {
791
+ }), nt = {
822
792
  scale: 1,
823
793
  x: 0,
824
794
  y: 0
825
795
  };
826
- class $e {
796
+ class Bt {
827
797
  constructor() {
828
- o(this, "viewportMatrix", ne);
829
- o(this, "contentMatrix", ne);
798
+ o(this, "viewportMatrix", nt);
799
+ o(this, "contentMatrix", nt);
830
800
  o(this, "afterUpdateEmitter");
831
801
  o(this, "onAfterUpdated");
832
- o(this, "beforeUpdateEmitter");
833
- /**
834
- * @deprecated
835
- * do not use
836
- */
837
- o(this, "onBeforeUpdated");
838
- [this.afterUpdateEmitter, this.onAfterUpdated] = A(), [this.beforeUpdateEmitter, this.onBeforeUpdated] = A();
802
+ [this.afterUpdateEmitter, this.onAfterUpdated] = A();
839
803
  }
840
804
  getViewportMatrix() {
841
805
  return this.viewportMatrix;
@@ -843,103 +807,103 @@ class $e {
843
807
  getContentMatrix() {
844
808
  return this.contentMatrix;
845
809
  }
846
- patchViewportMatrix(e) {
847
- this.beforeUpdateEmitter.emit(), this.viewportMatrix = {
848
- scale: e.scale ?? this.viewportMatrix.scale,
849
- x: e.x ?? this.viewportMatrix.x,
850
- y: e.y ?? this.viewportMatrix.y
851
- }, this.contentMatrix = ie(this.viewportMatrix), this.afterUpdateEmitter.emit();
810
+ patchViewportMatrix(t) {
811
+ this.viewportMatrix = {
812
+ scale: t.scale ?? this.viewportMatrix.scale,
813
+ x: t.x ?? this.viewportMatrix.x,
814
+ y: t.y ?? this.viewportMatrix.y
815
+ }, this.contentMatrix = it(this.viewportMatrix), this.afterUpdateEmitter.emit();
852
816
  }
853
- patchContentMatrix(e) {
854
- this.beforeUpdateEmitter.emit(), this.contentMatrix = {
855
- scale: e.scale ?? this.contentMatrix.scale,
856
- x: e.x ?? this.contentMatrix.x,
857
- y: e.y ?? this.contentMatrix.y
858
- }, this.viewportMatrix = ie(this.contentMatrix), this.afterUpdateEmitter.emit();
817
+ patchContentMatrix(t) {
818
+ this.contentMatrix = {
819
+ scale: t.scale ?? this.contentMatrix.scale,
820
+ x: t.x ?? this.contentMatrix.x,
821
+ y: t.y ?? this.contentMatrix.y
822
+ }, this.viewportMatrix = it(this.contentMatrix), this.afterUpdateEmitter.emit();
859
823
  }
860
824
  }
861
825
  class j {
862
- constructor(e) {
826
+ constructor(t) {
863
827
  o(this, "elementToNodeId", /* @__PURE__ */ new Map());
864
828
  o(this, "nodesResizeObserver");
865
- o(this, "onAfterNodeAdded", (e) => {
866
- const t = this.canvas.graph.getNode(e);
867
- this.elementToNodeId.set(t.element, e), this.nodesResizeObserver.observe(t.element);
829
+ o(this, "onAfterNodeAdded", (t) => {
830
+ const e = this.canvas.graph.getNode(t);
831
+ this.elementToNodeId.set(e.element, t), this.nodesResizeObserver.observe(e.element);
868
832
  });
869
- o(this, "onBeforeNodeRemoved", (e) => {
870
- const t = this.canvas.graph.getNode(e);
871
- this.elementToNodeId.delete(t.element), this.nodesResizeObserver.unobserve(t.element);
833
+ o(this, "onBeforeNodeRemoved", (t) => {
834
+ const e = this.canvas.graph.getNode(t);
835
+ this.elementToNodeId.delete(e.element), this.nodesResizeObserver.unobserve(e.element);
872
836
  });
873
837
  o(this, "onBeforeClear", () => {
874
838
  this.nodesResizeObserver.disconnect(), this.elementToNodeId.clear();
875
839
  });
876
- this.canvas = e, this.nodesResizeObserver = new ResizeObserver((t) => {
877
- t.forEach((s) => {
840
+ this.canvas = t, this.nodesResizeObserver = new ResizeObserver((e) => {
841
+ e.forEach((s) => {
878
842
  const i = s.target;
879
843
  this.handleNodeResize(i);
880
844
  });
881
845
  }), this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded), this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved), this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear);
882
846
  }
883
- static configure(e) {
884
- new j(e);
847
+ static configure(t) {
848
+ new j(t);
885
849
  }
886
- handleNodeResize(e) {
887
- const t = this.elementToNodeId.get(e);
888
- this.canvas.updateNode(t);
850
+ handleNodeResize(t) {
851
+ const e = this.elementToNodeId.get(t);
852
+ this.canvas.updateNode(e);
889
853
  }
890
854
  }
891
- const Fe = (r, e, t) => {
855
+ const Ft = (r, t, e) => {
892
856
  const { x: s, y: i, width: n, height: a } = r.getBoundingClientRect();
893
- return e >= s && e <= s + n && t >= i && t <= i + a;
894
- }, Oe = (r, e, t) => e >= 0 && e <= r.innerWidth && t >= 0 && t <= r.innerHeight, C = (r, e, t, s) => Fe(e, t, s) && Oe(r, t, s), U = (r, e) => {
895
- e !== null ? r.style.cursor = e : r.style.removeProperty("cursor");
857
+ return t >= s && t <= s + n && e >= i && e <= i + a;
858
+ }, Ot = (r, t, e) => t >= 0 && t <= r.innerWidth && e >= 0 && e <= r.innerHeight, R = (r, t, e, s) => Ft(t, e, s) && Ot(r, e, s), U = (r, t) => {
859
+ t !== null ? r.style.cursor = t : r.style.removeProperty("cursor");
896
860
  }, W = (r) => {
897
- const e = document.createElement("div");
861
+ const t = document.createElement("div");
898
862
  return {
899
863
  id: r.overlayId,
900
- element: e,
864
+ element: t,
901
865
  x: r.portCoords.x,
902
866
  y: r.portCoords.y,
903
867
  ports: [
904
868
  {
905
869
  id: r.overlayId,
906
- element: e,
870
+ element: t,
907
871
  direction: r.portDirection
908
872
  }
909
873
  ]
910
874
  };
911
- }, ke = (r, e) => {
912
- let t = e, s = null;
913
- for (; t !== null && (s = r.getElementPortIds(t)[0] ?? null, s === null); )
914
- t = t.parentElement;
875
+ }, kt = (r, t) => {
876
+ let e = t, s = null;
877
+ for (; e !== null && (s = r.getElementPortIds(e)[0] ?? null, s === null); )
878
+ e = e.parentElement;
915
879
  return s;
916
- }, ye = (r, e) => {
917
- const t = document.elementsFromPoint(e.x, e.y);
918
- for (const s of t) {
919
- const i = ke(r, s);
880
+ }, yt = (r, t) => {
881
+ const e = document.elementsFromPoint(t.x, t.y);
882
+ for (const s of e) {
883
+ const i = kt(r, s);
920
884
  if (i !== null)
921
885
  return i;
922
886
  }
923
887
  return null;
924
888
  };
925
889
  var P = /* @__PURE__ */ ((r) => (r.Static = "static", r.Dragging = "dragging", r.Edge = "edge", r))(P || {});
926
- const ve = (r, e) => ({
890
+ const vt = (r, t) => ({
927
891
  x: r / 2,
928
- y: e / 2
929
- }), m = (r, e, t) => ({
930
- x: e.x * r.x - e.y * r.y + ((1 - e.x) * t.x + e.y * t.y),
931
- y: e.y * r.x + e.x * r.y + ((1 - e.x) * t.y - e.y * t.x)
892
+ y: t / 2
893
+ }), m = (r, t, e) => ({
894
+ x: t.x * r.x - t.y * r.y + ((1 - t.x) * e.x + t.y * e.y),
895
+ y: t.y * r.x + t.x * r.y + ((1 - t.x) * e.y - t.y * e.x)
932
896
  }), u = {
933
897
  x: 0,
934
898
  y: 0
935
899
  };
936
- class ze {
937
- constructor(e) {
900
+ class zt {
901
+ constructor(t) {
938
902
  o(this, "path");
939
903
  o(this, "midpoint");
940
- this.params = e;
941
- const t = this.params.to;
942
- this.midpoint = { x: t.x / 2, y: t.y / 2 };
904
+ this.params = t;
905
+ const e = this.params.to;
906
+ this.midpoint = { x: e.x / 2, y: e.y / 2 };
943
907
  const s = m(
944
908
  { x: this.params.arrowLength, y: u.y },
945
909
  this.params.sourceDirection,
@@ -958,16 +922,16 @@ class ze {
958
922
  this.path = `${d}${h}${c}`;
959
923
  }
960
924
  }
961
- const $ = (r, e, t, s) => ({
962
- x: e * r.x + (1 - e) / 2 * s.x,
963
- y: t * r.y + (1 - t) / 2 * s.y
925
+ const B = (r, t, e, s) => ({
926
+ x: t * r.x + (1 - t) / 2 * s.x,
927
+ y: e * r.y + (1 - e) / 2 * s.y
964
928
  });
965
- class Xe {
966
- constructor(e) {
929
+ class Xt {
930
+ constructor(t) {
967
931
  o(this, "path");
968
932
  o(this, "midpoint");
969
- this.params = e;
970
- const t = this.params.hasSourceArrow ? m(
933
+ this.params = t;
934
+ const e = this.params.hasSourceArrow ? m(
971
935
  { x: this.params.arrowLength, y: u.y },
972
936
  this.params.sourceDirection,
973
937
  u
@@ -1009,17 +973,17 @@ class Xe {
1009
973
  y: g.y + d
1010
974
  };
1011
975
  this.path = [
1012
- `M ${t.x} ${t.y}`,
976
+ `M ${e.x} ${e.y}`,
1013
977
  `L ${c.x} ${c.y}`,
1014
978
  `C ${y.x} ${y.y} ${E.x} ${E.y} ${f.x} ${f.y}`,
1015
979
  `C ${x.x} ${x.y} ${v.x} ${v.y} ${g.x} ${g.y}`,
1016
980
  `L ${s.x} ${s.y}`
1017
- ].join(" "), this.midpoint = $(f, e.flipX, e.flipY, e.to);
981
+ ].join(" "), this.midpoint = B(f, t.flipX, t.flipY, t.to);
1018
982
  }
1019
983
  }
1020
- const L = (r, e) => {
1021
- const t = [];
1022
- 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) {
984
+ const M = (r, t) => {
985
+ const e = [];
986
+ if (r.length > 0 && e.push(`M ${r[0].x} ${r[0].y}`), r.length === 2 && e.push(`L ${r[1].x} ${r[1].y}`), r.length > 2) {
1023
987
  const s = r.length - 1;
1024
988
  let i = 0, n = 0, a = 0;
1025
989
  r.forEach((h, d) => {
@@ -1029,21 +993,21 @@ const L = (r, e) => {
1029
993
  const V = r[d + 1];
1030
994
  i = V.x - h.x, n = V.y - h.y, a = Math.sqrt(i * i + n * n);
1031
995
  }
1032
- const E = a !== 0 ? Math.min((y ? e : 0) / a, d < s - 1 ? 0.5 : 1) : 0, x = y ? { x: h.x + i * E, y: h.y + n * E } : h, T = g !== 0 ? Math.min((y ? e : 0) / g, d > 1 ? 0.5 : 1) : 0, N = y ? { x: h.x + c * T, y: h.y + l * T } : h;
1033
- d > 0 && t.push(`L ${N.x} ${N.y}`), y && t.push(
996
+ const E = a !== 0 ? Math.min((y ? t : 0) / a, d < s - 1 ? 0.5 : 1) : 0, x = y ? { x: h.x + i * E, y: h.y + n * E } : h, b = g !== 0 ? Math.min((y ? t : 0) / g, d > 1 ? 0.5 : 1) : 0, D = y ? { x: h.x + c * b, y: h.y + l * b } : h;
997
+ d > 0 && e.push(`L ${D.x} ${D.y}`), y && e.push(
1034
998
  `C ${h.x} ${h.y} ${h.x} ${h.y} ${x.x} ${x.y}`
1035
999
  );
1036
1000
  });
1037
1001
  }
1038
- return t.join(" ");
1002
+ return e.join(" ");
1039
1003
  };
1040
- class Ye {
1041
- constructor(e) {
1004
+ class Yt {
1005
+ constructor(t) {
1042
1006
  o(this, "path");
1043
1007
  o(this, "midpoint");
1044
- this.params = e;
1045
- const t = this.params.to;
1046
- this.midpoint = { x: t.x / 2, y: t.y / 2 };
1008
+ this.params = t;
1009
+ const e = this.params.to;
1010
+ this.midpoint = { x: e.x / 2, y: e.y / 2 };
1047
1011
  const s = this.params.hasSourceArrow ? m(
1048
1012
  { x: this.params.arrowLength, y: u.y },
1049
1013
  this.params.sourceDirection,
@@ -1070,18 +1034,18 @@ class Ye {
1070
1034
  x: this.params.flipX > 0 ? this.params.to.x - c : this.params.to.x + n,
1071
1035
  y: d.y
1072
1036
  }, y = { x: f.x, y: l };
1073
- this.path = L(
1037
+ this.path = M(
1074
1038
  [s, h, g, w, y, f, d, i],
1075
1039
  this.params.roundness
1076
1040
  );
1077
1041
  }
1078
1042
  }
1079
- class He {
1080
- constructor(e) {
1043
+ class Ht {
1044
+ constructor(t) {
1081
1045
  o(this, "path");
1082
1046
  o(this, "midpoint");
1083
- this.params = e;
1084
- const t = this.params.hasSourceArrow ? m(
1047
+ this.params = t;
1048
+ const e = this.params.hasSourceArrow ? m(
1085
1049
  { x: this.params.arrowLength, y: u.y },
1086
1050
  this.params.sourceDirection,
1087
1051
  u
@@ -1101,19 +1065,19 @@ class He {
1101
1065
  this.params.targetDirection,
1102
1066
  this.params.to
1103
1067
  ), w = { x: g.x + d, y: g.y + c }, f = { x: (l.x + w.x) / 2, y: (l.y + w.y) / 2 };
1104
- this.midpoint = $(f, e.flipX, e.flipY, e.to), this.path = L(
1105
- [t, n, l, w, g, s],
1068
+ this.midpoint = B(f, t.flipX, t.flipY, t.to), this.path = M(
1069
+ [e, n, l, w, g, s],
1106
1070
  this.params.roundness
1107
1071
  );
1108
1072
  }
1109
1073
  }
1110
- class je {
1111
- constructor(e) {
1074
+ class jt {
1075
+ constructor(t) {
1112
1076
  o(this, "path");
1113
1077
  o(this, "midpoint");
1114
- this.params = e;
1115
- const t = this.params.to;
1116
- this.midpoint = { x: t.x / 2, y: t.y / 2 };
1078
+ this.params = t;
1079
+ const e = this.params.to;
1080
+ this.midpoint = { x: e.x / 2, y: e.y / 2 };
1117
1081
  const s = this.params.hasSourceArrow ? m(
1118
1082
  { x: this.params.arrowLength, y: u.y },
1119
1083
  this.params.sourceDirection,
@@ -1134,16 +1098,16 @@ class je {
1134
1098
  this.params.targetDirection,
1135
1099
  this.params.to
1136
1100
  );
1137
- this.path = L([s, a, h, i], this.params.roundness);
1101
+ this.path = M([s, a, h, i], this.params.roundness);
1138
1102
  }
1139
1103
  }
1140
- class Ge {
1141
- constructor(e) {
1104
+ class Gt {
1105
+ constructor(t) {
1142
1106
  o(this, "path");
1143
1107
  o(this, "midpoint");
1144
- this.params = e;
1145
- const t = this.params.to;
1146
- this.midpoint = { x: t.x / 2, y: t.y / 2 };
1108
+ this.params = t;
1109
+ const e = this.params.to;
1110
+ this.midpoint = { x: e.x / 2, y: e.y / 2 };
1147
1111
  const s = this.params.hasSourceArrow ? m(
1148
1112
  { x: this.params.arrowLength, y: u.y },
1149
1113
  this.params.sourceDirection,
@@ -1170,18 +1134,18 @@ class Ge {
1170
1134
  x: d.x,
1171
1135
  y: this.params.flipY > 0 ? this.params.to.y - c : this.params.to.y + n
1172
1136
  }, y = { x: l, y: f.y };
1173
- this.path = L(
1137
+ this.path = M(
1174
1138
  [s, h, g, w, y, f, d, i],
1175
1139
  this.params.roundness
1176
1140
  );
1177
1141
  }
1178
1142
  }
1179
1143
  class G {
1180
- constructor(e) {
1144
+ constructor(t) {
1181
1145
  o(this, "path");
1182
1146
  o(this, "midpoint");
1183
- this.params = e;
1184
- const t = this.params.arrowOffset, s = this.params.side, i = this.params.arrowLength + t, n = i + 2 * s, h = [
1147
+ this.params = t;
1148
+ const e = this.params.arrowOffset, s = this.params.side, i = this.params.arrowLength + e, n = i + 2 * s, h = [
1185
1149
  { x: this.params.arrowLength, y: u.y },
1186
1150
  { x: i, y: u.y },
1187
1151
  { x: i, y: this.params.side },
@@ -1193,15 +1157,15 @@ class G {
1193
1157
  ].map(
1194
1158
  (c) => m(c, this.params.sourceDirection, u)
1195
1159
  ), d = `M ${u.x} ${u.y} L ${h[0].x} ${h[0].y} `;
1196
- this.path = `${this.params.hasSourceArrow || this.params.hasTargetArrow ? "" : d}${L(h, this.params.roundness)}`, this.midpoint = { x: (h[3].x + h[4].x) / 2, y: (h[3].y + h[4].y) / 2 };
1160
+ this.path = `${this.params.hasSourceArrow || this.params.hasTargetArrow ? "" : d}${M(h, this.params.roundness)}`, this.midpoint = { x: (h[3].x + h[4].x) / 2, y: (h[3].y + h[4].y) / 2 };
1197
1161
  }
1198
1162
  }
1199
- class Ke {
1200
- constructor(e) {
1163
+ class Kt {
1164
+ constructor(t) {
1201
1165
  o(this, "path");
1202
1166
  o(this, "midpoint");
1203
- this.params = e;
1204
- const t = this.params.smallRadius, s = this.params.radius, i = t + s, n = t * s / i, a = Math.sqrt(i * i - t * t), h = a * t / i, d = a + s + this.params.arrowLength, c = this.params.arrowLength + h, g = [
1167
+ this.params = t;
1168
+ const e = this.params.smallRadius, s = this.params.radius, i = e + s, n = e * s / i, a = Math.sqrt(i * i - e * e), h = a * e / i, d = a + s + this.params.arrowLength, c = this.params.arrowLength + h, g = [
1205
1169
  { x: this.params.arrowLength, y: u.y },
1206
1170
  { x: c, y: n },
1207
1171
  { x: c, y: -n },
@@ -1210,21 +1174,21 @@ class Ke {
1210
1174
  (y) => m(y, this.params.sourceDirection, u)
1211
1175
  ), w = [
1212
1176
  `M ${g[0].x} ${g[0].y}`,
1213
- `A ${t} ${t} 0 0 1 ${g[1].x} ${g[1].y}`,
1177
+ `A ${e} ${e} 0 0 1 ${g[1].x} ${g[1].y}`,
1214
1178
  `A ${s} ${s} 0 1 0 ${g[2].x} ${g[2].y}`,
1215
- `A ${t} ${t} 0 0 1 ${g[0].x} ${g[0].y}`
1179
+ `A ${e} ${e} 0 0 1 ${g[0].x} ${g[0].y}`
1216
1180
  ].join(" "), f = `M 0 0 L ${g[0].x} ${g[0].y} `;
1217
1181
  this.path = `${this.params.hasSourceArrow || this.params.hasTargetArrow ? "" : f}${w}`, this.midpoint = g[3];
1218
1182
  }
1219
1183
  }
1220
- class Ze {
1221
- constructor(e) {
1184
+ class Zt {
1185
+ constructor(t) {
1222
1186
  o(this, "path");
1223
1187
  o(this, "midpoint");
1224
1188
  o(this, "diagonalDistance");
1225
- this.params = e;
1226
- const t = this.params.to;
1227
- if (this.midpoint = { x: t.x / 2, y: t.y / 2 }, this.diagonalDistance = Math.sqrt(
1189
+ this.params = t;
1190
+ const e = this.params.to;
1191
+ if (this.midpoint = { x: e.x / 2, y: e.y / 2 }, this.diagonalDistance = Math.sqrt(
1228
1192
  this.params.to.x * this.params.to.x + this.params.to.y * this.params.to.y
1229
1193
  ), Math.sqrt(
1230
1194
  this.params.to.x * this.params.to.x + this.params.to.y * this.params.to.y
@@ -1245,20 +1209,20 @@ class Ze {
1245
1209
  });
1246
1210
  this.path = `M ${i.x} ${i.y} L ${n.x} ${n.y}`;
1247
1211
  }
1248
- createDirectLinePoint(e) {
1249
- const t = e.hasArrow ? this.params.arrowLength : 0, s = e.offset + t, i = e.flip * s / this.diagonalDistance;
1212
+ createDirectLinePoint(t) {
1213
+ const e = t.hasArrow ? this.params.arrowLength : 0, s = t.offset + e, i = t.flip * s / this.diagonalDistance;
1250
1214
  return {
1251
- x: this.params.to.x * i + e.shift.x,
1252
- y: this.params.to.y * i + e.shift.y
1215
+ x: this.params.to.x * i + t.shift.x,
1216
+ y: this.params.to.y * i + t.shift.y
1253
1217
  };
1254
1218
  }
1255
1219
  }
1256
- class Je {
1257
- constructor(e) {
1220
+ class Jt {
1221
+ constructor(t) {
1258
1222
  o(this, "path");
1259
1223
  o(this, "midpoint");
1260
- this.params = e;
1261
- const t = this.params.hasSourceArrow ? m(
1224
+ this.params = t;
1225
+ const e = this.params.hasSourceArrow ? m(
1262
1226
  { x: this.params.arrowLength, y: u.y },
1263
1227
  this.params.sourceDirection,
1264
1228
  u
@@ -1281,9 +1245,9 @@ class Je {
1281
1245
  x: (n.x + a.x) / 2,
1282
1246
  y: l
1283
1247
  };
1284
- this.midpoint = $(g, e.flipX, e.flipY, e.to), this.path = L(
1248
+ this.midpoint = B(g, t.flipX, t.flipY, t.to), this.path = M(
1285
1249
  [
1286
- t,
1250
+ e,
1287
1251
  n,
1288
1252
  { x: n.x, y: l },
1289
1253
  { x: a.x, y: l },
@@ -1294,12 +1258,12 @@ class Je {
1294
1258
  );
1295
1259
  }
1296
1260
  }
1297
- class Qe {
1298
- constructor(e) {
1261
+ class Qt {
1262
+ constructor(t) {
1299
1263
  o(this, "path");
1300
1264
  o(this, "midpoint");
1301
- this.params = e;
1302
- const t = this.params.hasSourceArrow ? m(
1265
+ this.params = t;
1266
+ const e = this.params.hasSourceArrow ? m(
1303
1267
  { x: this.params.arrowLength, y: u.y },
1304
1268
  this.params.sourceDirection,
1305
1269
  u
@@ -1322,9 +1286,9 @@ class Qe {
1322
1286
  x: l,
1323
1287
  y: (n.y + a.y) / 2
1324
1288
  };
1325
- this.midpoint = $(g, e.flipX, e.flipY, e.to), this.path = L(
1289
+ this.midpoint = B(g, t.flipX, t.flipY, t.to), this.path = M(
1326
1290
  [
1327
- t,
1291
+ e,
1328
1292
  n,
1329
1293
  { x: l, y: n.y },
1330
1294
  { x: l, y: a.y },
@@ -1335,30 +1299,30 @@ class Qe {
1335
1299
  );
1336
1300
  }
1337
1301
  }
1338
- const Ee = (r, e) => {
1339
- r.style.transform = `translate(${e.x}px, ${e.y}px)`, r.style.width = `${Math.max(e.width, 1)}px`, r.style.height = `${Math.max(e.height, 1)}px`;
1302
+ const Et = (r, t) => {
1303
+ r.style.transform = `translate(${t.x}px, ${t.y}px)`, r.style.width = `${Math.max(t.width, 1)}px`, r.style.height = `${Math.max(t.height, 1)}px`;
1340
1304
  }, K = Object.freeze({
1341
1305
  edgeColor: "--edge-color"
1342
- }), Ae = (r) => {
1343
- const e = document.createElementNS("http://www.w3.org/2000/svg", "svg");
1344
- return e.style.pointerEvents = "none", e.style.position = "absolute", e.style.top = "0", e.style.left = "0", e.style.overflow = "visible", e.style.setProperty(K.edgeColor, r), e;
1345
- }, B = () => {
1306
+ }), At = (r) => {
1307
+ const t = document.createElementNS("http://www.w3.org/2000/svg", "svg");
1308
+ return t.style.pointerEvents = "none", t.style.position = "absolute", t.style.top = "0", t.style.left = "0", t.style.overflow = "visible", t.style.setProperty(K.edgeColor, r), t;
1309
+ }, $ = () => {
1346
1310
  const r = document.createElementNS("http://www.w3.org/2000/svg", "path");
1347
1311
  return r.setAttribute("fill", `var(${K.edgeColor})`), r;
1348
- }, xe = () => {
1312
+ }, xt = () => {
1349
1313
  const r = document.createElementNS("http://www.w3.org/2000/svg", "g");
1350
1314
  return r.style.transformOrigin = "50% 50%", r;
1351
- }, Se = (r) => {
1352
- const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
1353
- return e.setAttribute("stroke", `var(${K.edgeColor})`), e.setAttribute("stroke-width", `${r}`), e.setAttribute("fill", "none"), e;
1354
- }, Pe = (r, e) => {
1355
- const t = {
1315
+ }, St = (r) => {
1316
+ const t = document.createElementNS("http://www.w3.org/2000/svg", "path");
1317
+ return t.setAttribute("stroke", `var(${K.edgeColor})`), t.setAttribute("stroke-width", `${r}`), t.setAttribute("fill", "none"), t;
1318
+ }, Pt = (r, t) => {
1319
+ const e = {
1356
1320
  x: r.x + r.width / 2,
1357
1321
  y: r.y + r.height / 2
1358
1322
  }, s = {
1359
- x: e.x + e.width / 2,
1360
- y: e.y + e.height / 2
1361
- }, i = Math.min(t.x, s.x), n = Math.min(t.y, s.y), a = Math.abs(s.x - t.x), h = Math.abs(s.y - t.y), d = t.x <= s.x ? 1 : -1, c = t.y <= s.y ? 1 : -1;
1323
+ x: t.x + t.width / 2,
1324
+ y: t.y + t.height / 2
1325
+ }, i = Math.min(e.x, s.x), n = Math.min(e.y, s.y), a = Math.abs(s.x - e.x), h = Math.abs(s.y - e.y), d = e.x <= s.x ? 1 : -1, c = e.y <= s.y ? 1 : -1;
1362
1326
  return {
1363
1327
  x: i,
1364
1328
  y: n,
@@ -1367,12 +1331,12 @@ const Ee = (r, e) => {
1367
1331
  flipX: d,
1368
1332
  flipY: c
1369
1333
  };
1370
- }, X = (r, e, t, s) => {
1334
+ }, X = (r, t, e, s) => {
1371
1335
  const n = [
1372
1336
  u,
1373
- { x: t, y: s },
1374
- { x: t, y: -s }
1375
- ].map((c) => m(c, r, u)).map((c) => ({ x: c.x + e.x, y: c.y + e.y })), a = `M ${n[0].x} ${n[0].y}`, h = `L ${n[1].x} ${n[1].y}`, d = `L ${n[2].x} ${n[2].y}`;
1337
+ { x: e, y: s },
1338
+ { x: e, y: -s }
1339
+ ].map((c) => m(c, r, u)).map((c) => ({ x: c.x + t.x, y: c.y + t.y })), a = `M ${n[0].x} ${n[0].y}`, h = `L ${n[1].x} ${n[1].y}`, d = `L ${n[2].x} ${n[2].y}`;
1376
1340
  return `${a} ${h} ${d} Z`;
1377
1341
  }, p = Object.freeze({
1378
1342
  color: "#777777",
@@ -1392,30 +1356,30 @@ const Ee = (r, e) => {
1392
1356
  curvature: 90,
1393
1357
  interactiveWidth: 10,
1394
1358
  preOffset: 0
1395
- }), ae = (r, e, t) => ({ x: e * Math.cos(r), y: t * Math.sin(r) });
1359
+ }), at = (r, t, e) => ({ x: t * Math.cos(r), y: e * Math.sin(r) });
1396
1360
  class F {
1397
- constructor(e) {
1361
+ constructor(t) {
1398
1362
  o(this, "svg");
1399
- o(this, "group", xe());
1363
+ o(this, "group", xt());
1400
1364
  o(this, "line");
1401
1365
  o(this, "sourceArrow", null);
1402
1366
  o(this, "targetArrow", null);
1403
1367
  o(this, "onAfterRender");
1404
1368
  o(this, "afterRenderEmitter");
1405
- this.params = e, [this.afterRenderEmitter, this.onAfterRender] = A(), this.svg = Ae(e.color), this.svg.appendChild(this.group), this.line = Se(e.width), this.group.appendChild(this.line), e.hasSourceArrow && (this.sourceArrow = B(), this.group.appendChild(this.sourceArrow)), e.hasTargetArrow && (this.targetArrow = B(), this.group.appendChild(this.targetArrow));
1369
+ this.params = t, [this.afterRenderEmitter, this.onAfterRender] = A(), this.svg = At(t.color), this.svg.appendChild(this.group), this.line = St(t.width), this.group.appendChild(this.line), t.hasSourceArrow && (this.sourceArrow = $(), this.group.appendChild(this.sourceArrow)), t.hasTargetArrow && (this.targetArrow = $(), this.group.appendChild(this.targetArrow));
1406
1370
  }
1407
- render(e) {
1408
- const { x: t, y: s, width: i, height: n, flipX: a, flipY: h } = Pe(
1409
- e.from,
1410
- e.to
1371
+ render(t) {
1372
+ const { x: e, y: s, width: i, height: n, flipX: a, flipY: h } = Pt(
1373
+ t.from,
1374
+ t.to
1411
1375
  );
1412
- Ee(this.svg, { x: t, y: s, width: i, height: n }), this.group.style.transform = `scale(${a}, ${h})`;
1413
- const d = ae(
1414
- e.from.direction,
1376
+ Et(this.svg, { x: e, y: s, width: i, height: n }), this.group.style.transform = `scale(${a}, ${h})`;
1377
+ const d = at(
1378
+ t.from.direction,
1415
1379
  a,
1416
1380
  h
1417
- ), c = ae(
1418
- e.to.direction,
1381
+ ), c = at(
1382
+ t.to.direction,
1419
1383
  a,
1420
1384
  h
1421
1385
  ), l = {
@@ -1423,7 +1387,7 @@ class F {
1423
1387
  y: n
1424
1388
  };
1425
1389
  let g = c, w = -this.params.arrowLength, f;
1426
- e.category === R.PortCycle ? (f = this.params.createCyclePath, g = d, w = this.params.arrowLength) : e.category === R.NodeCycle ? f = this.params.createDetourPath : f = this.params.createLinePath;
1390
+ t.category === C.PortCycle ? (f = this.params.createCyclePath, g = d, w = this.params.arrowLength) : t.category === C.NodeCycle ? f = this.params.createDetourPath : f = this.params.createLinePath;
1427
1391
  const y = f(
1428
1392
  d,
1429
1393
  c,
@@ -1452,8 +1416,8 @@ class F {
1452
1416
  });
1453
1417
  }
1454
1418
  }
1455
- class _e {
1456
- constructor(e) {
1419
+ class _t {
1420
+ constructor(t) {
1457
1421
  o(this, "svg");
1458
1422
  o(this, "group");
1459
1423
  o(this, "line");
@@ -1470,18 +1434,18 @@ class _e {
1470
1434
  o(this, "hasSourceArrow");
1471
1435
  o(this, "hasTargetArrow");
1472
1436
  o(this, "pathShape");
1473
- o(this, "createCyclePath", (e) => new Ke({
1474
- sourceDirection: e,
1437
+ o(this, "createCyclePath", (t) => new Kt({
1438
+ sourceDirection: t,
1475
1439
  radius: this.portCycleRadius,
1476
1440
  smallRadius: this.portCycleSmallRadius,
1477
1441
  arrowLength: this.arrowLength,
1478
1442
  hasSourceArrow: this.hasSourceArrow,
1479
1443
  hasTargetArrow: this.hasTargetArrow
1480
1444
  }));
1481
- o(this, "createDetourPath", (e, t, s, i, n) => new Xe({
1445
+ o(this, "createDetourPath", (t, e, s, i, n) => new Xt({
1482
1446
  to: s,
1483
- sourceDirection: e,
1484
- targetDirection: t,
1447
+ sourceDirection: t,
1448
+ targetDirection: e,
1485
1449
  flipX: i,
1486
1450
  flipY: n,
1487
1451
  arrowLength: this.arrowLength,
@@ -1491,18 +1455,18 @@ class _e {
1491
1455
  hasSourceArrow: this.hasSourceArrow,
1492
1456
  hasTargetArrow: this.hasTargetArrow
1493
1457
  }));
1494
- o(this, "createLinePath", (e, t, s) => new ze({
1458
+ o(this, "createLinePath", (t, e, s) => new zt({
1495
1459
  to: s,
1496
- sourceDirection: e,
1497
- targetDirection: t,
1460
+ sourceDirection: t,
1461
+ targetDirection: e,
1498
1462
  arrowLength: this.arrowLength,
1499
1463
  curvature: this.curvature,
1500
1464
  hasSourceArrow: this.hasSourceArrow,
1501
1465
  hasTargetArrow: this.hasTargetArrow
1502
1466
  }));
1503
- this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? p.arrowLength, this.arrowWidth = (e == null ? void 0 : e.arrowWidth) ?? p.arrowWidth, this.curvature = (e == null ? void 0 : e.curvature) ?? p.curvature, this.portCycleRadius = (e == null ? void 0 : e.cycleRadius) ?? p.cycleRadius, this.portCycleSmallRadius = (e == null ? void 0 : e.smallCycleRadius) ?? p.smallCycleRadius, this.detourDirection = (e == null ? void 0 : e.detourDirection) ?? p.detourDirection, this.detourDistance = (e == null ? void 0 : e.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (e == null ? void 0 : e.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (e == null ? void 0 : e.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1504
- color: (e == null ? void 0 : e.color) ?? p.color,
1505
- width: (e == null ? void 0 : e.width) ?? p.width,
1467
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? p.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? p.arrowWidth, this.curvature = (t == null ? void 0 : t.curvature) ?? p.curvature, this.portCycleRadius = (t == null ? void 0 : t.cycleRadius) ?? p.cycleRadius, this.portCycleSmallRadius = (t == null ? void 0 : t.smallCycleRadius) ?? p.smallCycleRadius, this.detourDirection = (t == null ? void 0 : t.detourDirection) ?? p.detourDirection, this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1468
+ color: (t == null ? void 0 : t.color) ?? p.color,
1469
+ width: (t == null ? void 0 : t.width) ?? p.width,
1506
1470
  arrowLength: this.arrowLength,
1507
1471
  arrowWidth: this.arrowWidth,
1508
1472
  hasSourceArrow: this.hasSourceArrow,
@@ -1512,12 +1476,12 @@ class _e {
1512
1476
  createLinePath: this.createLinePath
1513
1477
  }), 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;
1514
1478
  }
1515
- render(e) {
1516
- this.pathShape.render(e);
1479
+ render(t) {
1480
+ this.pathShape.render(t);
1517
1481
  }
1518
1482
  }
1519
- class qe {
1520
- constructor(e) {
1483
+ class qt {
1484
+ constructor(t) {
1521
1485
  o(this, "svg");
1522
1486
  o(this, "group");
1523
1487
  o(this, "line");
@@ -1533,8 +1497,8 @@ class qe {
1533
1497
  o(this, "hasSourceArrow");
1534
1498
  o(this, "hasTargetArrow");
1535
1499
  o(this, "pathShape");
1536
- o(this, "createCyclePath", (e) => new G({
1537
- sourceDirection: e,
1500
+ o(this, "createCyclePath", (t) => new G({
1501
+ sourceDirection: t,
1538
1502
  arrowLength: this.arrowLength,
1539
1503
  side: this.cycleSquareSide,
1540
1504
  arrowOffset: this.arrowOffset,
@@ -1542,10 +1506,10 @@ class qe {
1542
1506
  hasSourceArrow: this.hasSourceArrow,
1543
1507
  hasTargetArrow: this.hasTargetArrow
1544
1508
  }));
1545
- o(this, "createDetourPath", (e, t, s, i, n) => new Je({
1509
+ o(this, "createDetourPath", (t, e, s, i, n) => new Jt({
1546
1510
  to: s,
1547
- sourceDirection: e,
1548
- targetDirection: t,
1511
+ sourceDirection: t,
1512
+ targetDirection: e,
1549
1513
  flipX: i,
1550
1514
  flipY: n,
1551
1515
  arrowLength: this.arrowLength,
@@ -1555,10 +1519,10 @@ class qe {
1555
1519
  hasSourceArrow: this.hasSourceArrow,
1556
1520
  hasTargetArrow: this.hasTargetArrow
1557
1521
  }));
1558
- o(this, "createLinePath", (e, t, s, i) => new Ye({
1522
+ o(this, "createLinePath", (t, e, s, i) => new Yt({
1559
1523
  to: s,
1560
- sourceDirection: e,
1561
- targetDirection: t,
1524
+ sourceDirection: t,
1525
+ targetDirection: e,
1562
1526
  flipX: i,
1563
1527
  arrowLength: this.arrowLength,
1564
1528
  arrowOffset: this.arrowOffset,
@@ -1566,15 +1530,15 @@ class qe {
1566
1530
  hasSourceArrow: this.hasSourceArrow,
1567
1531
  hasTargetArrow: this.hasTargetArrow
1568
1532
  }));
1569
- this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? p.arrowLength, this.arrowWidth = (e == null ? void 0 : e.arrowWidth) ?? p.arrowWidth, this.arrowOffset = (e == null ? void 0 : e.arrowOffset) ?? p.arrowOffset, this.cycleSquareSide = (e == null ? void 0 : e.cycleSquareSide) ?? p.cycleSquareSide;
1570
- const t = (e == null ? void 0 : e.roundness) ?? p.roundness;
1533
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? p.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? p.arrowWidth, this.arrowOffset = (t == null ? void 0 : t.arrowOffset) ?? p.arrowOffset, this.cycleSquareSide = (t == null ? void 0 : t.cycleSquareSide) ?? p.cycleSquareSide;
1534
+ const e = (t == null ? void 0 : t.roundness) ?? p.roundness;
1571
1535
  this.roundness = Math.min(
1572
- t,
1536
+ e,
1573
1537
  this.arrowOffset,
1574
1538
  this.cycleSquareSide / 2
1575
- ), this.detourDistance = (e == null ? void 0 : e.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (e == null ? void 0 : e.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (e == null ? void 0 : e.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1576
- color: (e == null ? void 0 : e.color) ?? p.color,
1577
- width: (e == null ? void 0 : e.width) ?? p.width,
1539
+ ), this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1540
+ color: (t == null ? void 0 : t.color) ?? p.color,
1541
+ width: (t == null ? void 0 : t.width) ?? p.width,
1578
1542
  arrowLength: this.arrowLength,
1579
1543
  arrowWidth: this.arrowWidth,
1580
1544
  hasSourceArrow: this.hasSourceArrow,
@@ -1584,12 +1548,12 @@ class qe {
1584
1548
  createLinePath: this.createLinePath
1585
1549
  }), 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;
1586
1550
  }
1587
- render(e) {
1588
- this.pathShape.render(e);
1551
+ render(t) {
1552
+ this.pathShape.render(t);
1589
1553
  }
1590
1554
  }
1591
- class et {
1592
- constructor(e) {
1555
+ class te {
1556
+ constructor(t) {
1593
1557
  o(this, "svg");
1594
1558
  o(this, "group");
1595
1559
  o(this, "line");
@@ -1606,8 +1570,8 @@ class et {
1606
1570
  o(this, "hasSourceArrow");
1607
1571
  o(this, "hasTargetArrow");
1608
1572
  o(this, "pathShape");
1609
- o(this, "createCyclePath", (e) => new G({
1610
- sourceDirection: e,
1573
+ o(this, "createCyclePath", (t) => new G({
1574
+ sourceDirection: t,
1611
1575
  arrowLength: this.arrowLength,
1612
1576
  side: this.cycleSquareSide,
1613
1577
  arrowOffset: this.arrowOffset,
@@ -1615,10 +1579,10 @@ class et {
1615
1579
  hasSourceArrow: this.hasSourceArrow,
1616
1580
  hasTargetArrow: this.hasTargetArrow
1617
1581
  }));
1618
- o(this, "createDetourPath", (e, t, s, i, n) => new He({
1582
+ o(this, "createDetourPath", (t, e, s, i, n) => new Ht({
1619
1583
  to: s,
1620
- sourceDirection: e,
1621
- targetDirection: t,
1584
+ sourceDirection: t,
1585
+ targetDirection: e,
1622
1586
  flipX: i,
1623
1587
  flipY: n,
1624
1588
  arrowLength: this.arrowLength,
@@ -1629,25 +1593,25 @@ class et {
1629
1593
  hasSourceArrow: this.hasSourceArrow,
1630
1594
  hasTargetArrow: this.hasTargetArrow
1631
1595
  }));
1632
- o(this, "createLinePath", (e, t, s) => new je({
1596
+ o(this, "createLinePath", (t, e, s) => new jt({
1633
1597
  to: s,
1634
- sourceDirection: e,
1635
- targetDirection: t,
1598
+ sourceDirection: t,
1599
+ targetDirection: e,
1636
1600
  arrowLength: this.arrowLength,
1637
1601
  arrowOffset: this.arrowOffset,
1638
1602
  roundness: this.roundness,
1639
1603
  hasSourceArrow: this.hasSourceArrow,
1640
1604
  hasTargetArrow: this.hasTargetArrow
1641
1605
  }));
1642
- this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? p.arrowLength, this.arrowWidth = (e == null ? void 0 : e.arrowWidth) ?? p.arrowWidth, this.arrowOffset = (e == null ? void 0 : e.arrowOffset) ?? p.arrowOffset, this.cycleSquareSide = (e == null ? void 0 : e.cycleSquareSide) ?? p.cycleSquareSide;
1643
- const t = (e == null ? void 0 : e.roundness) ?? p.roundness;
1606
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? p.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? p.arrowWidth, this.arrowOffset = (t == null ? void 0 : t.arrowOffset) ?? p.arrowOffset, this.cycleSquareSide = (t == null ? void 0 : t.cycleSquareSide) ?? p.cycleSquareSide;
1607
+ const e = (t == null ? void 0 : t.roundness) ?? p.roundness;
1644
1608
  this.roundness = Math.min(
1645
- t,
1609
+ e,
1646
1610
  this.arrowOffset,
1647
1611
  this.cycleSquareSide / 2
1648
- ), this.detourDirection = (e == null ? void 0 : e.detourDirection) ?? p.detourDirection, this.detourDistance = (e == null ? void 0 : e.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (e == null ? void 0 : e.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (e == null ? void 0 : e.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1649
- color: (e == null ? void 0 : e.color) ?? p.color,
1650
- width: (e == null ? void 0 : e.width) ?? p.width,
1612
+ ), this.detourDirection = (t == null ? void 0 : t.detourDirection) ?? p.detourDirection, this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1613
+ color: (t == null ? void 0 : t.color) ?? p.color,
1614
+ width: (t == null ? void 0 : t.width) ?? p.width,
1651
1615
  arrowLength: this.arrowLength,
1652
1616
  arrowWidth: this.arrowWidth,
1653
1617
  hasSourceArrow: this.hasSourceArrow,
@@ -1657,12 +1621,12 @@ class et {
1657
1621
  createLinePath: this.createLinePath
1658
1622
  }), 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;
1659
1623
  }
1660
- render(e) {
1661
- this.pathShape.render(e);
1624
+ render(t) {
1625
+ this.pathShape.render(t);
1662
1626
  }
1663
1627
  }
1664
- class tt {
1665
- constructor(e) {
1628
+ class ee {
1629
+ constructor(t) {
1666
1630
  o(this, "svg");
1667
1631
  o(this, "group");
1668
1632
  o(this, "line");
@@ -1678,8 +1642,8 @@ class tt {
1678
1642
  o(this, "hasSourceArrow");
1679
1643
  o(this, "hasTargetArrow");
1680
1644
  o(this, "pathShape");
1681
- o(this, "createCyclePath", (e) => new G({
1682
- sourceDirection: e,
1645
+ o(this, "createCyclePath", (t) => new G({
1646
+ sourceDirection: t,
1683
1647
  arrowLength: this.arrowLength,
1684
1648
  side: this.cycleSquareSide,
1685
1649
  arrowOffset: this.arrowOffset,
@@ -1687,10 +1651,10 @@ class tt {
1687
1651
  hasSourceArrow: this.hasSourceArrow,
1688
1652
  hasTargetArrow: this.hasTargetArrow
1689
1653
  }));
1690
- o(this, "createDetourPath", (e, t, s, i, n) => new Qe({
1654
+ o(this, "createDetourPath", (t, e, s, i, n) => new Qt({
1691
1655
  to: s,
1692
- sourceDirection: e,
1693
- targetDirection: t,
1656
+ sourceDirection: t,
1657
+ targetDirection: e,
1694
1658
  flipX: i,
1695
1659
  flipY: n,
1696
1660
  arrowLength: this.arrowLength,
@@ -1700,10 +1664,10 @@ class tt {
1700
1664
  hasSourceArrow: this.hasSourceArrow,
1701
1665
  hasTargetArrow: this.hasTargetArrow
1702
1666
  }));
1703
- o(this, "createLinePath", (e, t, s, i, n) => new Ge({
1667
+ o(this, "createLinePath", (t, e, s, i, n) => new Gt({
1704
1668
  to: s,
1705
- sourceDirection: e,
1706
- targetDirection: t,
1669
+ sourceDirection: t,
1670
+ targetDirection: e,
1707
1671
  flipY: n,
1708
1672
  arrowLength: this.arrowLength,
1709
1673
  arrowOffset: this.arrowOffset,
@@ -1711,15 +1675,15 @@ class tt {
1711
1675
  hasSourceArrow: this.hasSourceArrow,
1712
1676
  hasTargetArrow: this.hasTargetArrow
1713
1677
  }));
1714
- this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? p.arrowLength, this.arrowWidth = (e == null ? void 0 : e.arrowWidth) ?? p.arrowWidth, this.arrowOffset = (e == null ? void 0 : e.arrowOffset) ?? p.arrowOffset, this.cycleSquareSide = (e == null ? void 0 : e.cycleSquareSide) ?? p.cycleSquareSide;
1715
- const t = (e == null ? void 0 : e.roundness) ?? p.roundness;
1678
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? p.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? p.arrowWidth, this.arrowOffset = (t == null ? void 0 : t.arrowOffset) ?? p.arrowOffset, this.cycleSquareSide = (t == null ? void 0 : t.cycleSquareSide) ?? p.cycleSquareSide;
1679
+ const e = (t == null ? void 0 : t.roundness) ?? p.roundness;
1716
1680
  this.roundness = Math.min(
1717
- t,
1681
+ e,
1718
1682
  this.arrowOffset,
1719
1683
  this.cycleSquareSide / 2
1720
- ), this.detourDistance = (e == null ? void 0 : e.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (e == null ? void 0 : e.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (e == null ? void 0 : e.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1721
- color: (e == null ? void 0 : e.color) ?? p.color,
1722
- width: (e == null ? void 0 : e.width) ?? p.width,
1684
+ ), this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? p.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? p.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? p.hasTargetArrow, this.pathShape = new F({
1685
+ color: (t == null ? void 0 : t.color) ?? p.color,
1686
+ width: (t == null ? void 0 : t.width) ?? p.width,
1723
1687
  arrowLength: this.arrowLength,
1724
1688
  arrowWidth: this.arrowWidth,
1725
1689
  hasSourceArrow: this.hasSourceArrow,
@@ -1729,18 +1693,18 @@ class tt {
1729
1693
  createLinePath: this.createLinePath
1730
1694
  }), 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;
1731
1695
  }
1732
- render(e) {
1733
- this.pathShape.render(e);
1696
+ render(t) {
1697
+ this.pathShape.render(t);
1734
1698
  }
1735
1699
  }
1736
- const he = (r) => {
1700
+ const ht = (r) => {
1737
1701
  if (r.diagonalDistance === 0)
1738
1702
  return "";
1739
- const e = r.offset / r.diagonalDistance, t = r.flip * r.to.x, s = r.flip * r.to.y, i = {
1740
- x: t * e + r.shift.x,
1741
- y: s * e + r.shift.y
1703
+ const t = r.offset / r.diagonalDistance, e = r.flip * r.to.x, s = r.flip * r.to.y, i = {
1704
+ x: e * t + r.shift.x,
1705
+ y: s * t + r.shift.y
1742
1706
  }, n = {
1743
- x: t / r.diagonalDistance,
1707
+ x: e / r.diagonalDistance,
1744
1708
  y: s / r.diagonalDistance
1745
1709
  };
1746
1710
  return X(
@@ -1750,10 +1714,10 @@ const he = (r) => {
1750
1714
  r.arrowWidth
1751
1715
  );
1752
1716
  };
1753
- class be {
1754
- constructor(e) {
1717
+ class bt {
1718
+ constructor(t) {
1755
1719
  o(this, "svg");
1756
- o(this, "group", xe());
1720
+ o(this, "group", xt());
1757
1721
  o(this, "line");
1758
1722
  o(this, "sourceArrow", null);
1759
1723
  o(this, "targetArrow", null);
@@ -1765,15 +1729,15 @@ class be {
1765
1729
  o(this, "targetOffset");
1766
1730
  o(this, "onAfterRender");
1767
1731
  o(this, "afterRenderEmitter");
1768
- [this.afterRenderEmitter, this.onAfterRender] = A(), this.color = (e == null ? void 0 : e.color) ?? p.color, this.width = (e == null ? void 0 : e.width) ?? p.width, this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? p.arrowLength, this.arrowWidth = (e == null ? void 0 : e.arrowWidth) ?? p.arrowWidth, this.sourceOffset = (e == null ? void 0 : e.sourceOffset) ?? p.preOffset, this.targetOffset = (e == null ? void 0 : e.targetOffset) ?? p.preOffset, this.svg = Ae(this.color), this.svg.appendChild(this.group), this.line = Se(this.width), this.group.appendChild(this.line), e != null && e.hasSourceArrow && (this.sourceArrow = B(), this.group.appendChild(this.sourceArrow)), e != null && e.hasTargetArrow && (this.targetArrow = B(), this.group.appendChild(this.targetArrow));
1732
+ [this.afterRenderEmitter, this.onAfterRender] = A(), this.color = (t == null ? void 0 : t.color) ?? p.color, this.width = (t == null ? void 0 : t.width) ?? p.width, this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? p.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? p.arrowWidth, this.sourceOffset = (t == null ? void 0 : t.sourceOffset) ?? p.preOffset, this.targetOffset = (t == null ? void 0 : t.targetOffset) ?? p.preOffset, this.svg = At(this.color), this.svg.appendChild(this.group), this.line = St(this.width), this.group.appendChild(this.line), t != null && t.hasSourceArrow && (this.sourceArrow = $(), this.group.appendChild(this.sourceArrow)), t != null && t.hasTargetArrow && (this.targetArrow = $(), this.group.appendChild(this.targetArrow));
1769
1733
  }
1770
- render(e) {
1771
- const { x: t, y: s, width: i, height: n, flipX: a, flipY: h } = Pe(
1772
- e.from,
1773
- e.to
1734
+ render(t) {
1735
+ const { x: e, y: s, width: i, height: n, flipX: a, flipY: h } = Pt(
1736
+ t.from,
1737
+ t.to
1774
1738
  );
1775
- Ee(this.svg, { x: t, y: s, width: i, height: n }), this.group.style.transform = `scale(${a}, ${h})`;
1776
- const d = { x: i, y: n }, c = new Ze({
1739
+ Et(this.svg, { x: e, y: s, width: i, height: n }), this.group.style.transform = `scale(${a}, ${h})`;
1740
+ const d = { x: i, y: n }, c = new Zt({
1777
1741
  to: d,
1778
1742
  sourceOffset: this.sourceOffset,
1779
1743
  targetOffset: this.targetOffset,
@@ -1783,7 +1747,7 @@ class be {
1783
1747
  });
1784
1748
  this.line.setAttribute("d", c.path);
1785
1749
  let l = null;
1786
- this.sourceArrow && (l = he({
1750
+ this.sourceArrow && (l = ht({
1787
1751
  diagonalDistance: c.diagonalDistance,
1788
1752
  to: d,
1789
1753
  offset: this.sourceOffset,
@@ -1793,7 +1757,7 @@ class be {
1793
1757
  arrowLength: this.arrowLength
1794
1758
  }), this.sourceArrow.setAttribute("d", l));
1795
1759
  let g = null;
1796
- this.targetArrow && (g = he({
1760
+ this.targetArrow && (g = ht({
1797
1761
  diagonalDistance: c.diagonalDistance,
1798
1762
  to: d,
1799
1763
  offset: this.targetOffset,
@@ -1808,137 +1772,126 @@ class be {
1808
1772
  });
1809
1773
  }
1810
1774
  }
1811
- const rt = () => {
1775
+ const re = () => {
1812
1776
  const r = document.createElementNS("http://www.w3.org/2000/svg", "g");
1813
1777
  return r.style.pointerEvents = "auto", r.style.cursor = "pointer", r;
1814
- }, ot = (r) => {
1815
- const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
1816
- return e.setAttribute("stroke", "transparent"), e.setAttribute("stroke-width", `${r}`), e.setAttribute("fill", "none"), e.setAttribute("stroke-linecap", "round"), e;
1817
- }, de = (r) => {
1818
- const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
1819
- return e.setAttribute("stroke-linejoin", "round"), e.setAttribute("stroke-width", `${r}`), e.setAttribute("fill", "transparent"), e.setAttribute("stroke", "transparent"), e;
1778
+ }, oe = (r) => {
1779
+ const t = document.createElementNS("http://www.w3.org/2000/svg", "path");
1780
+ return t.setAttribute("stroke", "transparent"), t.setAttribute("stroke-width", `${r}`), t.setAttribute("fill", "none"), t.setAttribute("stroke-linecap", "round"), t;
1781
+ }, dt = (r) => {
1782
+ const t = document.createElementNS("http://www.w3.org/2000/svg", "path");
1783
+ return t.setAttribute("stroke-linejoin", "round"), t.setAttribute("stroke-width", `${r}`), t.setAttribute("fill", "transparent"), t.setAttribute("stroke", "transparent"), t;
1820
1784
  };
1821
- class st extends Error {
1822
- constructor(e) {
1823
- super(e), this.name = "InteractiveEdgeError";
1785
+ class se extends Error {
1786
+ constructor(t) {
1787
+ super(t), this.name = "InteractiveEdgeError";
1824
1788
  }
1825
1789
  }
1826
- class Te {
1827
- constructor(e, t) {
1790
+ class Tt {
1791
+ constructor(t, e) {
1828
1792
  o(this, "svg");
1829
1793
  o(this, "group");
1830
1794
  o(this, "line");
1831
1795
  o(this, "sourceArrow");
1832
1796
  o(this, "targetArrow");
1833
- o(this, "handle", rt());
1797
+ o(this, "handle", re());
1834
1798
  o(this, "onAfterRender");
1835
1799
  o(this, "interactiveLine");
1836
1800
  o(this, "interactiveSourceArrow", null);
1837
1801
  o(this, "interactiveTargetArrow", null);
1838
- if (this.baseEdge = e, e instanceof Te)
1839
- throw new st(
1802
+ if (this.baseEdge = t, t instanceof Tt)
1803
+ throw new se(
1840
1804
  "interactive edge can be configured only once"
1841
1805
  );
1842
1806
  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;
1843
- const s = (t == null ? void 0 : t.width) ?? p.interactiveWidth;
1844
- this.interactiveLine = ot(s), this.handle.appendChild(this.interactiveLine), this.sourceArrow && (this.interactiveSourceArrow = de(s), this.handle.appendChild(this.interactiveSourceArrow)), this.targetArrow && (this.interactiveTargetArrow = de(s), this.handle.appendChild(this.interactiveTargetArrow)), this.group.appendChild(this.handle), this.baseEdge.onAfterRender.subscribe((i) => {
1807
+ const s = (e == null ? void 0 : e.distance) ?? p.interactiveWidth;
1808
+ this.interactiveLine = oe(s), this.handle.appendChild(this.interactiveLine), this.sourceArrow && (this.interactiveSourceArrow = dt(s), this.handle.appendChild(this.interactiveSourceArrow)), this.targetArrow && (this.interactiveTargetArrow = dt(s), this.handle.appendChild(this.interactiveTargetArrow)), this.group.appendChild(this.handle), this.baseEdge.onAfterRender.subscribe((i) => {
1845
1809
  this.interactiveLine.setAttribute("d", i.edgePath.path), this.interactiveSourceArrow && this.interactiveSourceArrow.setAttribute("d", i.sourceArrowPath), this.interactiveTargetArrow && this.interactiveTargetArrow.setAttribute("d", i.targetArrowPath);
1846
1810
  });
1847
1811
  }
1848
- render(e) {
1849
- this.baseEdge.render(e);
1812
+ render(t) {
1813
+ this.baseEdge.render(t);
1850
1814
  }
1851
1815
  }
1852
- class Dt {
1853
- constructor(e, t) {
1816
+ class Ne {
1817
+ constructor(t, e) {
1854
1818
  o(this, "group");
1855
1819
  o(this, "line");
1856
1820
  o(this, "sourceArrow");
1857
1821
  o(this, "targetArrow");
1858
1822
  o(this, "onAfterRender");
1859
1823
  o(this, "svg");
1860
- /**
1861
- * @deprecated
1862
- * use midpointElement instead
1863
- */
1864
- o(this, "medianElement");
1865
- this.baseShape = e, this.midpointElement = t, this.medianElement = this.midpointElement, this.svg = this.baseShape.svg, this.group = this.baseShape.group, this.line = this.baseShape.line, this.sourceArrow = this.baseShape.sourceArrow, this.targetArrow = this.baseShape.targetArrow, this.onAfterRender = this.baseShape.onAfterRender, this.svg.append(this.midpointElement), this.baseShape.onAfterRender.subscribe((s) => {
1824
+ this.baseShape = t, this.midpointElement = e, this.svg = this.baseShape.svg, this.group = this.baseShape.group, this.line = this.baseShape.line, this.sourceArrow = this.baseShape.sourceArrow, this.targetArrow = this.baseShape.targetArrow, this.onAfterRender = this.baseShape.onAfterRender, this.svg.append(this.midpointElement), this.baseShape.onAfterRender.subscribe((s) => {
1866
1825
  const i = s.edgePath.midpoint, n = `translate(${i.x}px, ${i.y}px)`;
1867
1826
  this.midpointElement.style.setProperty("transform", n);
1868
1827
  });
1869
1828
  }
1870
- render(e) {
1871
- this.baseShape.render(e);
1829
+ render(t) {
1830
+ this.baseShape.render(t);
1872
1831
  }
1873
1832
  }
1874
- const De = (r, e) => {
1875
- const t = new me(), s = new pe(t, e, r), i = {
1833
+ const Dt = (r, t) => {
1834
+ const e = new mt(), s = new pt(e, t, r), i = {
1876
1835
  nodes: {
1877
- centerFn: ve,
1836
+ centerFn: vt,
1878
1837
  priorityFn: () => 0
1879
1838
  },
1880
1839
  edges: {
1881
- shapeFactory: () => new be(),
1840
+ shapeFactory: () => new bt(),
1882
1841
  priorityFn: () => 0
1883
1842
  },
1884
1843
  ports: {
1885
1844
  direction: 0
1886
1845
  }
1887
1846
  };
1888
- return new fe(
1889
- r,
1890
- t,
1891
- e,
1892
- s,
1893
- i
1894
- );
1847
+ return new ft(e, t, s, i);
1895
1848
  };
1896
1849
  class O {
1897
- constructor(e, t, s, i) {
1898
- o(this, "onAfterPortMarked", (e) => {
1899
- const t = this.canvas.graph.getPort(e);
1900
- this.canvas.graph.getElementPortIds(t.element).length === 1 && this.hookPortEvents(t.element);
1850
+ constructor(t, e, s, i) {
1851
+ o(this, "onAfterPortMarked", (t) => {
1852
+ const e = this.canvas.graph.getPort(t);
1853
+ this.canvas.graph.getElementPortIds(e.element).length === 1 && this.hookPortEvents(e.element);
1901
1854
  });
1902
- o(this, "onBeforePortUnmarked", (e) => {
1903
- const t = this.canvas.graph.getPort(e);
1904
- this.canvas.graph.getElementPortIds(t.element).length === 1 && this.unhookPortEvents(t.element);
1855
+ o(this, "onBeforePortUnmarked", (t) => {
1856
+ const e = this.canvas.graph.getPort(t);
1857
+ this.canvas.graph.getElementPortIds(e.element).length === 1 && this.unhookPortEvents(e.element);
1905
1858
  });
1906
- o(this, "onPortMouseDown", (e) => {
1907
- if (!this.params.mouseDownEventVerifier(e))
1859
+ o(this, "onPortMouseDown", (t) => {
1860
+ if (!this.params.mouseDownEventVerifier(t))
1908
1861
  return;
1909
- const t = e.currentTarget, s = this.canvas.graph.getElementPortIds(t)[0];
1862
+ const e = t.currentTarget, s = this.canvas.graph.getElementPortIds(e)[0];
1910
1863
  this.params.onPortPointerDown(s, {
1911
- x: e.clientX,
1912
- y: e.clientY
1913
- }) && (e.stopPropagation(), this.window.addEventListener("mousemove", this.onWindowMouseMove, {
1864
+ x: t.clientX,
1865
+ y: t.clientY
1866
+ }) && (t.stopPropagation(), this.window.addEventListener("mousemove", this.onWindowMouseMove, {
1914
1867
  passive: !0
1915
1868
  }), this.window.addEventListener("mouseup", this.onWindowMouseUp, {
1916
1869
  passive: !0
1917
1870
  }));
1918
1871
  });
1919
- o(this, "onWindowMouseMove", (e) => {
1920
- if (!C(
1872
+ o(this, "onWindowMouseMove", (t) => {
1873
+ if (!R(
1921
1874
  this.window,
1922
1875
  this.element,
1923
- e.clientX,
1924
- e.clientY
1876
+ t.clientX,
1877
+ t.clientY
1925
1878
  )) {
1926
1879
  this.stopMouseDrag();
1927
1880
  return;
1928
1881
  }
1929
- this.params.onPointerMove({ x: e.clientX, y: e.clientY });
1882
+ this.params.onPointerMove({ x: t.clientX, y: t.clientY });
1930
1883
  });
1931
- o(this, "onWindowMouseUp", (e) => {
1932
- this.params.mouseUpEventVerifier(e) && (this.params.onPointerUp({ x: e.clientX, y: e.clientY }), this.stopMouseDrag());
1884
+ o(this, "onWindowMouseUp", (t) => {
1885
+ this.params.mouseUpEventVerifier(t) && (this.params.onPointerUp({ x: t.clientX, y: t.clientY }), this.stopMouseDrag());
1933
1886
  });
1934
- o(this, "onPortTouchStart", (e) => {
1935
- if (e.touches.length !== 1)
1887
+ o(this, "onPortTouchStart", (t) => {
1888
+ if (t.touches.length !== 1)
1936
1889
  return;
1937
- const t = e.touches[0], s = e.currentTarget, i = this.canvas.graph.getElementPortIds(s)[0];
1890
+ const e = t.touches[0], s = t.currentTarget, i = this.canvas.graph.getElementPortIds(s)[0];
1938
1891
  this.params.onPortPointerDown(i, {
1939
- x: t.clientX,
1940
- y: t.clientY
1941
- }) && (e.stopPropagation(), this.window.addEventListener("touchmove", this.onWindowTouchMove, {
1892
+ x: e.clientX,
1893
+ y: e.clientY
1894
+ }) && (t.stopPropagation(), this.window.addEventListener("touchmove", this.onWindowTouchMove, {
1942
1895
  passive: !0
1943
1896
  }), this.window.addEventListener("touchend", this.onWindowTouchFinish, {
1944
1897
  passive: !0
@@ -1946,46 +1899,46 @@ class O {
1946
1899
  passive: !0
1947
1900
  }));
1948
1901
  });
1949
- o(this, "onWindowTouchMove", (e) => {
1950
- const t = e.touches[0];
1951
- if (!C(
1902
+ o(this, "onWindowTouchMove", (t) => {
1903
+ const e = t.touches[0];
1904
+ if (!R(
1952
1905
  this.window,
1953
1906
  this.element,
1954
- t.clientX,
1955
- t.clientY
1907
+ e.clientX,
1908
+ e.clientY
1956
1909
  )) {
1957
1910
  this.stopTouchDrag();
1958
1911
  return;
1959
1912
  }
1960
- this.params.onPointerMove({ x: t.clientX, y: t.clientY });
1913
+ this.params.onPointerMove({ x: e.clientX, y: e.clientY });
1961
1914
  });
1962
- o(this, "onWindowTouchFinish", (e) => {
1963
- const t = e.changedTouches[0];
1964
- this.params.onPointerUp({ x: t.clientX, y: t.clientY }), this.stopTouchDrag();
1915
+ o(this, "onWindowTouchFinish", (t) => {
1916
+ const e = t.changedTouches[0];
1917
+ this.params.onPointerUp({ x: e.clientX, y: e.clientY }), this.stopTouchDrag();
1965
1918
  });
1966
1919
  o(this, "onBeforeClear", () => {
1967
- this.canvas.graph.getAllPortIds().forEach((e) => {
1968
- const t = this.canvas.graph.getPort(e);
1969
- this.unhookPortEvents(t.element);
1920
+ this.canvas.graph.getAllPortIds().forEach((t) => {
1921
+ const e = this.canvas.graph.getPort(t);
1922
+ this.unhookPortEvents(e.element);
1970
1923
  });
1971
1924
  });
1972
1925
  o(this, "onBeforeDestroy", () => {
1973
1926
  this.params.onStopDrag(), this.removeWindowMouseListeners(), this.removeWindowTouchListeners();
1974
1927
  });
1975
- this.canvas = e, this.element = t, this.window = s, this.params = i, this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked), this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked), this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear), this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy);
1928
+ this.canvas = t, this.element = e, this.window = s, this.params = i, this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked), this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked), this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear), this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy);
1976
1929
  }
1977
- static configure(e, t, s, i) {
1978
- new O(e, t, s, i);
1930
+ static configure(t, e, s, i) {
1931
+ new O(t, e, s, i);
1979
1932
  }
1980
- hookPortEvents(e) {
1981
- e.addEventListener("mousedown", this.onPortMouseDown, {
1933
+ hookPortEvents(t) {
1934
+ t.addEventListener("mousedown", this.onPortMouseDown, {
1982
1935
  passive: !0
1983
- }), e.addEventListener("touchstart", this.onPortTouchStart, {
1936
+ }), t.addEventListener("touchstart", this.onPortTouchStart, {
1984
1937
  passive: !0
1985
1938
  });
1986
1939
  }
1987
- unhookPortEvents(e) {
1988
- e.removeEventListener("mousedown", this.onPortMouseDown), e.removeEventListener("touchstart", this.onPortTouchStart);
1940
+ unhookPortEvents(t) {
1941
+ t.removeEventListener("mousedown", this.onPortMouseDown), t.removeEventListener("touchstart", this.onPortTouchStart);
1989
1942
  }
1990
1943
  stopMouseDrag() {
1991
1944
  this.params.onStopDrag(), this.removeWindowMouseListeners();
@@ -2001,50 +1954,45 @@ class O {
2001
1954
  }
2002
1955
  }
2003
1956
  class Z {
2004
- constructor(e, t, s, i) {
1957
+ constructor(t, e, s, i) {
2005
1958
  o(this, "grabbedNode", null);
2006
1959
  o(this, "maxNodePriority", 0);
2007
1960
  o(this, "graph");
2008
- o(this, "onAfterNodeAdded", (e) => {
2009
- this.updateMaxNodePriority(e);
2010
- const t = this.graph.getNode(e);
2011
- t.element.addEventListener("mousedown", this.onMouseDown, {
1961
+ o(this, "onAfterNodeAdded", (t) => {
1962
+ this.updateMaxNodePriority(t);
1963
+ const e = this.graph.getNode(t);
1964
+ e.element.addEventListener("mousedown", this.onMouseDown, {
2012
1965
  passive: !0
2013
- }), t.element.addEventListener("touchstart", this.onTouchStart, {
1966
+ }), e.element.addEventListener("touchstart", this.onTouchStart, {
2014
1967
  passive: !0
2015
1968
  });
2016
1969
  });
2017
- o(this, "onAfterNodeUpdated", (e) => {
2018
- this.updateMaxNodePriority(e);
1970
+ o(this, "onAfterNodeUpdated", (t) => {
1971
+ this.updateMaxNodePriority(t);
2019
1972
  });
2020
- o(this, "onBeforeNodeRemoved", (e) => {
2021
- const t = this.graph.getNode(e);
2022
- t.element.removeEventListener("mousedown", this.onMouseDown), t.element.removeEventListener("touchstart", this.onTouchStart);
1973
+ o(this, "onBeforeNodeRemoved", (t) => {
1974
+ const e = this.graph.getNode(t);
1975
+ e.element.removeEventListener("mousedown", this.onMouseDown), e.element.removeEventListener("touchstart", this.onTouchStart);
2023
1976
  });
2024
1977
  o(this, "onBeforeDestroy", () => {
2025
1978
  this.removeMouseDragListeners(), this.removeTouchDragListeners();
2026
1979
  });
2027
1980
  o(this, "onBeforeClear", () => {
2028
- this.canvas.graph.getAllNodeIds().forEach((e) => {
2029
- const t = this.canvas.graph.getNode(e);
2030
- t.element.removeEventListener("mousedown", this.onMouseDown), t.element.removeEventListener("touchstart", this.onTouchStart);
1981
+ this.canvas.graph.getAllNodeIds().forEach((t) => {
1982
+ const e = this.canvas.graph.getNode(t);
1983
+ e.element.removeEventListener("mousedown", this.onMouseDown), e.element.removeEventListener("touchstart", this.onTouchStart);
2031
1984
  }), this.maxNodePriority = 0;
2032
1985
  });
2033
- o(this, "onMouseDown", (e) => {
2034
- if (!this.params.mouseDownEventVerifier(e))
1986
+ o(this, "onMouseDown", (t) => {
1987
+ if (!this.params.mouseDownEventVerifier(t))
2035
1988
  return;
2036
- const t = e.currentTarget, s = this.graph.getElementNodeId(t), i = this.graph.getNode(s);
2037
- if (!this.params.onBeforeNodeDrag({
2038
- nodeId: s,
2039
- element: i.element,
2040
- x: i.x,
2041
- y: i.y
2042
- }))
1989
+ const e = t.currentTarget, s = this.graph.getElementNodeId(e), i = this.graph.getNode(s);
1990
+ if (!this.params.nodeDragVerifier(s))
2043
1991
  return;
2044
- e.stopPropagation();
1992
+ t.stopPropagation();
2045
1993
  const a = this.calculateContentPoint({
2046
- x: e.clientX,
2047
- y: e.clientY
1994
+ x: t.clientX,
1995
+ y: t.clientY
2048
1996
  });
2049
1997
  this.grabbedNode = {
2050
1998
  nodeId: s,
@@ -2056,12 +2004,12 @@ class Z {
2056
2004
  passive: !0
2057
2005
  });
2058
2006
  });
2059
- o(this, "onTouchStart", (e) => {
2060
- if (e.touches.length !== 1)
2007
+ o(this, "onTouchStart", (t) => {
2008
+ if (t.touches.length !== 1)
2061
2009
  return;
2062
- e.stopPropagation();
2063
- const t = e.touches[0], s = e.currentTarget, i = this.canvas.graph.getElementNodeId(s), n = this.graph.getNode(i);
2064
- if (!this.params.onBeforeNodeDrag({
2010
+ t.stopPropagation();
2011
+ const e = t.touches[0], s = t.currentTarget, i = this.canvas.graph.getElementNodeId(s), n = this.graph.getNode(i);
2012
+ if (!this.params.nodeDragVerifier({
2065
2013
  nodeId: i,
2066
2014
  element: n.element,
2067
2015
  x: n.x,
@@ -2069,8 +2017,8 @@ class Z {
2069
2017
  }))
2070
2018
  return;
2071
2019
  const h = this.calculateContentPoint({
2072
- x: t.clientX,
2073
- y: t.clientY
2020
+ x: e.clientX,
2021
+ y: e.clientY
2074
2022
  });
2075
2023
  this.grabbedNode = {
2076
2024
  nodeId: i,
@@ -2084,102 +2032,87 @@ class Z {
2084
2032
  passive: !0
2085
2033
  });
2086
2034
  });
2087
- o(this, "onWindowMouseMove", (e) => {
2088
- if (!C(
2035
+ o(this, "onWindowMouseMove", (t) => {
2036
+ if (!R(
2089
2037
  this.window,
2090
2038
  this.element,
2091
- e.clientX,
2092
- e.clientY
2039
+ t.clientX,
2040
+ t.clientY
2093
2041
  )) {
2094
2042
  this.cancelMouseDrag();
2095
2043
  return;
2096
2044
  }
2097
2045
  this.grabbedNode !== null && this.moveNode(this.grabbedNode, {
2098
- x: e.clientX,
2099
- y: e.clientY
2046
+ x: t.clientX,
2047
+ y: t.clientY
2100
2048
  });
2101
2049
  });
2102
- o(this, "onWindowMouseUp", (e) => {
2103
- this.params.mouseUpEventVerifier(e) && this.cancelMouseDrag();
2050
+ o(this, "onWindowMouseUp", (t) => {
2051
+ this.params.mouseUpEventVerifier(t) && this.cancelMouseDrag();
2104
2052
  });
2105
- o(this, "onWindowTouchMove", (e) => {
2106
- if (e.touches.length !== 1)
2053
+ o(this, "onWindowTouchMove", (t) => {
2054
+ if (t.touches.length !== 1)
2107
2055
  return;
2108
- const t = e.touches[0];
2109
- if (!C(
2056
+ const e = t.touches[0];
2057
+ if (!R(
2110
2058
  this.window,
2111
2059
  this.element,
2112
- t.clientX,
2113
- t.clientY
2060
+ e.clientX,
2061
+ e.clientY
2114
2062
  )) {
2115
2063
  this.cancelTouchDrag();
2116
2064
  return;
2117
2065
  }
2118
2066
  this.grabbedNode !== null && this.moveNode(this.grabbedNode, {
2119
- x: t.clientX,
2120
- y: t.clientY
2067
+ x: e.clientX,
2068
+ y: e.clientY
2121
2069
  });
2122
2070
  });
2123
2071
  o(this, "onWindowTouchFinish", () => {
2124
2072
  this.cancelTouchDrag();
2125
2073
  });
2126
- this.canvas = e, this.element = t, this.window = s, this.params = i, this.graph = e.graph, this.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded), this.graph.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated), this.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved), this.graph.onBeforeClear.subscribe(this.onBeforeClear), this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy);
2074
+ this.canvas = t, this.element = e, this.window = s, this.params = i, this.graph = t.graph, this.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded), this.graph.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated), this.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved), this.graph.onBeforeClear.subscribe(this.onBeforeClear), this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy);
2127
2075
  }
2128
- static configure(e, t, s, i) {
2129
- new Z(e, t, s, i);
2076
+ static configure(t, e, s, i) {
2077
+ new Z(t, e, s, i);
2130
2078
  }
2131
- moveNode(e, t) {
2132
- const s = this.graph.getNode(e.nodeId);
2133
- if (s === null)
2079
+ moveNode(t, e) {
2080
+ if (this.graph.getNode(t.nodeId) === null)
2134
2081
  return;
2135
- const i = this.calculateContentPoint(t), n = {
2136
- x: i.x - e.dx,
2137
- y: i.y - e.dy
2082
+ const i = this.calculateContentPoint(e), n = {
2083
+ x: i.x - t.dx,
2084
+ y: i.y - t.dy
2138
2085
  }, a = this.adjustNodeCoords(n);
2139
- this.canvas.updateNode(e.nodeId, {
2140
- x: a.x,
2141
- y: a.y
2142
- }), this.params.onNodeDrag({
2143
- nodeId: e.nodeId,
2144
- element: s.element,
2086
+ this.canvas.updateNode(t.nodeId, {
2145
2087
  x: a.x,
2146
2088
  y: a.y
2147
- });
2089
+ }), this.params.onNodeDrag(t.nodeId);
2148
2090
  }
2149
- moveNodeOnTop(e) {
2091
+ moveNodeOnTop(t) {
2150
2092
  if (this.params.moveOnTop) {
2151
2093
  if (this.maxNodePriority++, this.params.moveEdgesOnTop) {
2152
- const t = this.maxNodePriority;
2153
- this.maxNodePriority++, this.graph.getNodeAdjacentEdgeIds(e).forEach((i) => {
2154
- this.canvas.updateEdge(i, { priority: t });
2094
+ const e = this.maxNodePriority;
2095
+ this.maxNodePriority++, this.graph.getNodeAdjacentEdgeIds(t).forEach((i) => {
2096
+ this.canvas.updateEdge(i, { priority: e });
2155
2097
  });
2156
2098
  }
2157
- this.canvas.updateNode(e, { priority: this.maxNodePriority });
2099
+ this.canvas.updateNode(t, { priority: this.maxNodePriority });
2158
2100
  }
2159
2101
  }
2160
2102
  cancelMouseDrag() {
2161
- if (this.grabbedNode !== null) {
2162
- const e = this.graph.getNode(this.grabbedNode.nodeId);
2163
- e !== null && this.params.onNodeDragFinished({
2164
- nodeId: this.grabbedNode.nodeId,
2165
- element: e.element,
2166
- x: e.x,
2167
- y: e.y
2168
- });
2169
- }
2170
- this.grabbedNode = null, U(this.element, null), this.removeMouseDragListeners();
2103
+ this.grabbedNode !== null && this.graph.getNode(this.grabbedNode.nodeId) !== null && this.params.onNodeDragFinished(this.grabbedNode.nodeId), this.grabbedNode = null, U(this.element, null), this.removeMouseDragListeners();
2171
2104
  }
2172
2105
  removeMouseDragListeners() {
2173
2106
  this.window.removeEventListener("mouseup", this.onWindowMouseUp), this.window.removeEventListener("mousemove", this.onWindowMouseMove);
2174
2107
  }
2175
2108
  cancelTouchDrag() {
2176
2109
  if (this.grabbedNode !== null) {
2177
- const e = this.graph.getNode(this.grabbedNode.nodeId);
2178
- e !== null && this.params.onNodeDragFinished({
2110
+ const t = this.graph.getNode(this.grabbedNode.nodeId);
2111
+ t !== null && this.params.onNodeDragFinished({
2179
2112
  nodeId: this.grabbedNode.nodeId,
2180
- element: e.element,
2181
- x: e.x,
2182
- y: e.y
2113
+ element: t.element,
2114
+ x: t.x,
2115
+ y: t.y
2183
2116
  });
2184
2117
  }
2185
2118
  this.grabbedNode = null, this.removeTouchDragListeners();
@@ -2187,58 +2120,58 @@ class Z {
2187
2120
  removeTouchDragListeners() {
2188
2121
  this.window.removeEventListener("touchmove", this.onWindowTouchMove), this.window.removeEventListener("touchend", this.onWindowTouchFinish), this.window.removeEventListener("touchcancel", this.onWindowTouchFinish);
2189
2122
  }
2190
- updateMaxNodePriority(e) {
2191
- const t = this.graph.getNode(e).priority;
2192
- this.maxNodePriority = Math.max(this.maxNodePriority, t);
2123
+ updateMaxNodePriority(t) {
2124
+ const e = this.graph.getNode(t).priority;
2125
+ this.maxNodePriority = Math.max(this.maxNodePriority, e);
2193
2126
  }
2194
- calculateContentPoint(e) {
2195
- const t = this.element.getBoundingClientRect(), s = {
2196
- x: e.x - t.x,
2197
- y: e.y - t.y
2127
+ calculateContentPoint(t) {
2128
+ const e = this.element.getBoundingClientRect(), s = {
2129
+ x: t.x - e.x,
2130
+ y: t.y - e.y
2198
2131
  }, i = this.canvas.viewport.getViewportMatrix();
2199
- return D(i, s);
2132
+ return T(i, s);
2200
2133
  }
2201
- adjustNodeCoords(e) {
2202
- const t = this.params.gridSize;
2203
- if (t !== null) {
2204
- const s = t / 2;
2134
+ adjustNodeCoords(t) {
2135
+ const e = this.params.gridSize;
2136
+ if (e !== null) {
2137
+ const s = e / 2;
2205
2138
  return {
2206
- x: Math.floor((e.x + s) / t) * t,
2207
- y: Math.floor((e.y + s) / t) * t
2139
+ x: Math.floor((t.x + s) / e) * e,
2140
+ y: Math.floor((t.y + s) / e) * e
2208
2141
  };
2209
2142
  }
2210
- return e;
2143
+ return t;
2211
2144
  }
2212
2145
  }
2213
- const it = (r, e, t) => ({
2146
+ const ie = (r, t, e) => ({
2214
2147
  scale: r.scale,
2215
- x: r.x + r.scale * e,
2216
- y: r.y + r.scale * t
2217
- }), nt = (r, e, t, s) => ({
2218
- scale: r.scale * e,
2219
- x: r.scale * (1 - e) * t + r.x,
2220
- y: r.scale * (1 - e) * s + r.y
2148
+ x: r.x + r.scale * t,
2149
+ y: r.y + r.scale * e
2150
+ }), ne = (r, t, e, s) => ({
2151
+ scale: r.scale * t,
2152
+ x: r.scale * (1 - t) * e + r.x,
2153
+ y: r.scale * (1 - t) * s + r.y
2221
2154
  }), I = (r) => {
2222
- const e = [], t = r.touches.length;
2223
- for (let h = 0; h < t; h++)
2224
- e.push([r.touches[h].clientX, r.touches[h].clientY]);
2225
- const s = e.reduce(
2155
+ const t = [], e = r.touches.length;
2156
+ for (let h = 0; h < e; h++)
2157
+ t.push([r.touches[h].clientX, r.touches[h].clientY]);
2158
+ const s = t.reduce(
2226
2159
  (h, d) => [h[0] + d[0], h[1] + d[1]],
2227
2160
  [0, 0]
2228
- ), i = [s[0] / t, s[1] / t], a = e.map((h) => [h[0] - i[0], h[1] - i[1]]).reduce(
2161
+ ), i = [s[0] / e, s[1] / e], a = t.map((h) => [h[0] - i[0], h[1] - i[1]]).reduce(
2229
2162
  (h, d) => h + Math.sqrt(d[0] * d[0] + d[1] * d[1]),
2230
2163
  0
2231
2164
  );
2232
2165
  return {
2233
2166
  x: i[0],
2234
2167
  y: i[1],
2235
- scale: a / t,
2236
- touchesCnt: t,
2237
- touches: e
2168
+ scale: a / e,
2169
+ touchesCnt: e,
2170
+ touches: t
2238
2171
  };
2239
2172
  };
2240
2173
  class k {
2241
- constructor(e, t, s, i) {
2174
+ constructor(t, e, s, i) {
2242
2175
  o(this, "viewport");
2243
2176
  o(this, "prevTouches", null);
2244
2177
  o(this, "wheelFinishTimer", null);
@@ -2246,44 +2179,44 @@ class k {
2246
2179
  o(this, "onBeforeDestroy", () => {
2247
2180
  this.removeMouseDragListeners(), this.removeTouchDragListeners();
2248
2181
  });
2249
- o(this, "onMouseDown", (e) => {
2250
- this.element === null || !this.params.mouseDownEventVerifier(e) || (U(this.element, this.params.shiftCursor), this.window.addEventListener("mousemove", this.onWindowMouseMove, {
2182
+ o(this, "onMouseDown", (t) => {
2183
+ this.element === null || !this.params.mouseDownEventVerifier(t) || (U(this.element, this.params.shiftCursor), this.window.addEventListener("mousemove", this.onWindowMouseMove, {
2251
2184
  passive: !0
2252
2185
  }), this.window.addEventListener("mouseup", this.onWindowMouseUp, {
2253
2186
  passive: !0
2254
2187
  }), this.startRegisteredTransform());
2255
2188
  });
2256
- o(this, "onWindowMouseMove", (e) => {
2257
- const t = C(
2189
+ o(this, "onWindowMouseMove", (t) => {
2190
+ const e = R(
2258
2191
  this.window,
2259
2192
  this.element,
2260
- e.clientX,
2261
- e.clientY
2193
+ t.clientX,
2194
+ t.clientY
2262
2195
  );
2263
- if (this.element === null || !t) {
2196
+ if (this.element === null || !e) {
2264
2197
  this.stopMouseDrag();
2265
2198
  return;
2266
2199
  }
2267
- const s = -e.movementX, i = -e.movementY;
2200
+ const s = -t.movementX, i = -t.movementY;
2268
2201
  this.moveViewport(s, i);
2269
2202
  });
2270
- o(this, "onWindowMouseUp", (e) => {
2271
- this.element === null || !this.params.mouseUpEventVerifier(e) || this.stopMouseDrag();
2203
+ o(this, "onWindowMouseUp", (t) => {
2204
+ this.element === null || !this.params.mouseUpEventVerifier(t) || this.stopMouseDrag();
2272
2205
  });
2273
- o(this, "onWheelScroll", (e) => {
2274
- if (!this.params.mouseWheelEventVerifier(e))
2206
+ o(this, "onWheelScroll", (t) => {
2207
+ if (!this.params.mouseWheelEventVerifier(t))
2275
2208
  return;
2276
- const { left: t, top: s } = this.element.getBoundingClientRect(), i = e.clientX - t, n = e.clientY - s, h = 1 / (e.deltaY < 0 ? this.params.wheelSensitivity : 1 / this.params.wheelSensitivity);
2209
+ const { left: e, top: s } = this.element.getBoundingClientRect(), i = t.clientX - e, n = t.clientY - s, h = 1 / (t.deltaY < 0 ? this.params.wheelSensitivity : 1 / this.params.wheelSensitivity);
2277
2210
  this.wheelFinishTimer === null && this.params.onTransformStarted(), this.scaleViewport(h, i, n), this.wheelFinishTimer !== null && clearTimeout(this.wheelFinishTimer), this.wheelFinishTimer = setTimeout(() => {
2278
2211
  this.transformInProgress || this.params.onTransformFinished(), this.wheelFinishTimer = null;
2279
2212
  }, this.params.scaleWheelFinishTimeout);
2280
2213
  });
2281
- o(this, "onTouchStart", (e) => {
2214
+ o(this, "onTouchStart", (t) => {
2282
2215
  if (this.prevTouches !== null) {
2283
- this.prevTouches = I(e);
2216
+ this.prevTouches = I(t);
2284
2217
  return;
2285
2218
  }
2286
- this.prevTouches = I(e), this.window.addEventListener("touchmove", this.onWindowTouchMove, {
2219
+ this.prevTouches = I(t), this.window.addEventListener("touchmove", this.onWindowTouchMove, {
2287
2220
  passive: !0
2288
2221
  }), this.window.addEventListener("touchend", this.onWindowTouchFinish, {
2289
2222
  passive: !0
@@ -2291,53 +2224,53 @@ class k {
2291
2224
  passive: !0
2292
2225
  }), this.startRegisteredTransform();
2293
2226
  });
2294
- o(this, "onWindowTouchMove", (e) => {
2295
- const t = I(e);
2296
- if (!t.touches.every(
2297
- (i) => C(this.window, this.element, i[0], i[1])
2227
+ o(this, "onWindowTouchMove", (t) => {
2228
+ const e = I(t);
2229
+ if (!e.touches.every(
2230
+ (i) => R(this.window, this.element, i[0], i[1])
2298
2231
  )) {
2299
2232
  this.stopTouchDrag();
2300
2233
  return;
2301
2234
  }
2302
- if ((t.touchesCnt === 1 || t.touchesCnt === 2) && this.moveViewport(
2303
- -(t.x - this.prevTouches.x),
2304
- -(t.y - this.prevTouches.y)
2305
- ), t.touchesCnt === 2) {
2306
- const { left: i, top: n } = this.element.getBoundingClientRect(), a = this.prevTouches.x - i, h = this.prevTouches.y - n, c = 1 / (t.scale / this.prevTouches.scale);
2235
+ if ((e.touchesCnt === 1 || e.touchesCnt === 2) && this.moveViewport(
2236
+ -(e.x - this.prevTouches.x),
2237
+ -(e.y - this.prevTouches.y)
2238
+ ), e.touchesCnt === 2) {
2239
+ const { left: i, top: n } = this.element.getBoundingClientRect(), a = this.prevTouches.x - i, h = this.prevTouches.y - n, c = 1 / (e.scale / this.prevTouches.scale);
2307
2240
  this.scaleViewport(c, a, h);
2308
2241
  }
2309
- this.prevTouches = t;
2242
+ this.prevTouches = e;
2310
2243
  });
2311
- o(this, "onWindowTouchFinish", (e) => {
2312
- e.touches.length > 0 ? this.prevTouches = I(e) : this.stopTouchDrag();
2244
+ o(this, "onWindowTouchFinish", (t) => {
2245
+ t.touches.length > 0 ? this.prevTouches = I(t) : this.stopTouchDrag();
2313
2246
  });
2314
2247
  o(this, "observer", new ResizeObserver(() => {
2315
- const e = this.viewport.getViewportMatrix(), { width: t, height: s } = this.element.getBoundingClientRect(), i = this.params.transformPreprocessor({
2316
- prevTransform: e,
2317
- nextTransform: e,
2318
- canvasWidth: t,
2248
+ const t = this.viewport.getViewportMatrix(), { width: e, height: s } = this.element.getBoundingClientRect(), i = this.params.transformPreprocessor({
2249
+ prevTransform: t,
2250
+ nextTransform: t,
2251
+ canvasWidth: e,
2319
2252
  canvasHeight: s
2320
2253
  });
2321
2254
  this.params.onResizeTransformStarted(), this.canvas.patchViewportMatrix(i), this.params.onResizeTransformFinished();
2322
2255
  }));
2323
- o(this, "preventWheelScaleListener", (e) => {
2324
- e.preventDefault();
2256
+ o(this, "preventWheelScaleListener", (t) => {
2257
+ t.preventDefault();
2325
2258
  });
2326
- this.canvas = e, this.element = t, this.window = s, this.params = i, this.element.addEventListener("wheel", this.preventWheelScaleListener, {
2259
+ this.canvas = t, this.element = e, this.window = s, this.params = i, this.element.addEventListener("wheel", this.preventWheelScaleListener, {
2327
2260
  passive: !1
2328
- }), this.viewport = e.viewport, this.observer.observe(this.element), this.element.addEventListener("mousedown", this.onMouseDown, {
2261
+ }), this.viewport = t.viewport, this.observer.observe(this.element), this.element.addEventListener("mousedown", this.onMouseDown, {
2329
2262
  passive: !0
2330
2263
  }), this.element.addEventListener("wheel", this.onWheelScroll, {
2331
2264
  passive: !0
2332
2265
  }), this.element.addEventListener("touchstart", this.onTouchStart, {
2333
2266
  passive: !0
2334
- }), e.onBeforeDestroy.subscribe(this.onBeforeDestroy);
2267
+ }), t.onBeforeDestroy.subscribe(this.onBeforeDestroy);
2335
2268
  }
2336
- static configure(e, t, s, i) {
2337
- new k(e, t, s, i);
2269
+ static configure(t, e, s, i) {
2270
+ new k(t, e, s, i);
2338
2271
  }
2339
- moveViewport(e, t) {
2340
- const s = this.viewport.getViewportMatrix(), i = it(s, e, t), { width: n, height: a } = this.element.getBoundingClientRect(), h = this.params.transformPreprocessor({
2272
+ moveViewport(t, e) {
2273
+ const s = this.viewport.getViewportMatrix(), i = ie(s, t, e), { width: n, height: a } = this.element.getBoundingClientRect(), h = this.params.transformPreprocessor({
2341
2274
  prevTransform: s,
2342
2275
  nextTransform: i,
2343
2276
  canvasWidth: n,
@@ -2345,8 +2278,8 @@ class k {
2345
2278
  });
2346
2279
  this.performTransform(h);
2347
2280
  }
2348
- scaleViewport(e, t, s) {
2349
- const i = this.canvas.viewport.getViewportMatrix(), n = nt(i, e, t, s), { width: a, height: h } = this.element.getBoundingClientRect(), d = this.params.transformPreprocessor({
2281
+ scaleViewport(t, e, s) {
2282
+ const i = this.canvas.viewport.getViewportMatrix(), n = ne(i, t, e, s), { width: a, height: h } = this.element.getBoundingClientRect(), d = this.params.transformPreprocessor({
2350
2283
  prevTransform: i,
2351
2284
  nextTransform: n,
2352
2285
  canvasWidth: a,
@@ -2366,8 +2299,8 @@ class k {
2366
2299
  removeTouchDragListeners() {
2367
2300
  this.window.removeEventListener("touchmove", this.onWindowTouchMove), this.window.removeEventListener("touchend", this.onWindowTouchFinish), this.window.removeEventListener("touchcancel", this.onWindowTouchFinish);
2368
2301
  }
2369
- performTransform(e) {
2370
- this.params.onBeforeTransformChange(), this.canvas.patchViewportMatrix(e), this.params.onTransformChange();
2302
+ performTransform(t) {
2303
+ this.params.onBeforeTransformChange(), this.canvas.patchViewportMatrix(t), this.params.onTransformChange();
2371
2304
  }
2372
2305
  startRegisteredTransform() {
2373
2306
  this.transformInProgress = !0, this.params.onTransformStarted();
@@ -2377,7 +2310,7 @@ class k {
2377
2310
  }
2378
2311
  }
2379
2312
  class J {
2380
- constructor(e, t, s, i, n, a) {
2313
+ constructor(t, e, s, i, n, a) {
2381
2314
  o(this, "canvasResizeObserver");
2382
2315
  o(this, "nodeHorizontal");
2383
2316
  o(this, "nodeVertical");
@@ -2391,22 +2324,22 @@ class J {
2391
2324
  yFrom: 1 / 0,
2392
2325
  yTo: 1 / 0
2393
2326
  });
2394
- o(this, "updateLoadedArea", (e) => {
2327
+ o(this, "updateLoadedArea", (t) => {
2395
2328
  this.loadedArea = {
2396
- xFrom: e.x,
2397
- xTo: e.x + e.width,
2398
- yFrom: e.y,
2399
- yTo: e.y + e.height
2329
+ xFrom: t.x,
2330
+ xTo: t.x + t.width,
2331
+ yFrom: t.y,
2332
+ yTo: t.y + t.height
2400
2333
  };
2401
2334
  });
2402
2335
  o(this, "onAfterViewportUpdated", () => {
2403
2336
  this.userTransformInProgress || (this.viewportMatrix = this.viewport.getViewportMatrix(), this.loadAreaAroundViewport());
2404
2337
  });
2405
2338
  o(this, "userTransformInProgress", !1);
2406
- this.canvas = e, this.element = t, this.window = s, this.trigger = n, this.params = a, this.nodeHorizontal = this.params.nodeVerticalRadius, this.nodeVertical = this.params.nodeHorizontalRadius, this.canvasResizeObserver = new ResizeObserver((d) => {
2339
+ this.canvas = t, this.element = e, this.window = s, this.trigger = n, this.params = a, this.nodeHorizontal = this.params.nodeVerticalRadius, this.nodeVertical = this.params.nodeHorizontalRadius, this.canvasResizeObserver = new ResizeObserver((d) => {
2407
2340
  const c = d[0];
2408
2341
  this.viewportWidth = c.contentRect.width, this.viewportHeight = c.contentRect.height, this.scheduleLoadAreaAroundViewport();
2409
- }), this.viewport = e.viewport;
2342
+ }), this.viewport = t.viewport;
2410
2343
  const h = {
2411
2344
  ...i,
2412
2345
  onResizeTransformStarted: () => {
@@ -2428,16 +2361,16 @@ class J {
2428
2361
  }
2429
2362
  };
2430
2363
  k.configure(
2431
- e,
2364
+ t,
2432
2365
  this.element,
2433
2366
  this.window,
2434
2367
  h
2435
2368
  ), this.viewportMatrix = this.viewport.getViewportMatrix(), this.trigger.subscribe(this.updateLoadedArea), this.canvasResizeObserver.observe(this.element), this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated);
2436
2369
  }
2437
- static configure(e, t, s, i, n, a) {
2370
+ static configure(t, e, s, i, n, a) {
2438
2371
  new J(
2439
- e,
2440
2372
  t,
2373
+ e,
2441
2374
  s,
2442
2375
  i,
2443
2376
  n,
@@ -2450,21 +2383,21 @@ class J {
2450
2383
  });
2451
2384
  }
2452
2385
  scheduleEnsureViewportAreaLoaded() {
2453
- const e = this.viewportWidth * this.viewportMatrix.scale, t = this.viewportHeight * this.viewportMatrix.scale, s = this.viewportMatrix.x - this.nodeHorizontal, i = this.viewportMatrix.y - this.nodeVertical, n = this.viewportMatrix.x + e + this.nodeHorizontal, a = this.viewportMatrix.y + t + this.nodeVertical;
2386
+ const t = this.viewportWidth * this.viewportMatrix.scale, e = this.viewportHeight * this.viewportMatrix.scale, s = this.viewportMatrix.x - this.nodeHorizontal, i = this.viewportMatrix.y - this.nodeVertical, n = this.viewportMatrix.x + t + this.nodeHorizontal, a = this.viewportMatrix.y + e + this.nodeVertical;
2454
2387
  this.loadedArea.xFrom < s && this.loadedArea.xTo > n && this.loadedArea.yFrom < i && this.loadedArea.yTo > a || this.scheduleLoadAreaAroundViewport();
2455
2388
  }
2456
2389
  loadAreaAroundViewport() {
2457
- const e = this.viewportWidth * this.viewportMatrix.scale, t = this.viewportHeight * this.viewportMatrix.scale, s = this.viewportMatrix.x - e - this.nodeHorizontal, i = this.viewportMatrix.y - t - this.nodeVertical, n = 3 * e + 2 * this.nodeHorizontal, a = 3 * t + 2 * this.nodeVertical;
2390
+ const t = this.viewportWidth * this.viewportMatrix.scale, e = this.viewportHeight * this.viewportMatrix.scale, s = this.viewportMatrix.x - t - this.nodeHorizontal, i = this.viewportMatrix.y - e - this.nodeVertical, n = 3 * t + 2 * this.nodeHorizontal, a = 3 * e + 2 * this.nodeVertical;
2458
2391
  this.trigger.emit({ x: s, y: i, width: n, height: a });
2459
2392
  }
2460
2393
  }
2461
- const at = () => {
2394
+ const ae = () => {
2462
2395
  const r = document.createElementNS("http://www.w3.org/2000/svg", "svg");
2463
2396
  return r.style.position = "absolute", r.style.inset = "0", r;
2464
- }, ht = () => {
2397
+ }, he = () => {
2465
2398
  const r = document.createElementNS("http://www.w3.org/2000/svg", "rect");
2466
2399
  return r.setAttribute("fill", "url(#pattern)"), r;
2467
- }, dt = () => {
2400
+ }, de = () => {
2468
2401
  const r = document.createElementNS(
2469
2402
  "http://www.w3.org/2000/svg",
2470
2403
  "pattern"
@@ -2472,10 +2405,10 @@ const at = () => {
2472
2405
  return r.setAttribute("id", "pattern"), r;
2473
2406
  };
2474
2407
  class Q {
2475
- constructor(e, t, s) {
2476
- o(this, "svg", at());
2477
- o(this, "patternRenderingRectangle", ht());
2478
- o(this, "pattern", dt());
2408
+ constructor(t, e, s) {
2409
+ o(this, "svg", ae());
2410
+ o(this, "patternRenderingRectangle", he());
2411
+ o(this, "pattern", de());
2479
2412
  o(this, "patternContent");
2480
2413
  o(this, "tileWidth");
2481
2414
  o(this, "tileHeight");
@@ -2483,39 +2416,39 @@ class Q {
2483
2416
  o(this, "halfTileHeight");
2484
2417
  o(this, "maxViewportScale");
2485
2418
  o(this, "visible", !1);
2486
- o(this, "resizeObserver", new ResizeObserver((e) => {
2487
- const t = e[0], { width: s, height: i } = t.contentRect;
2419
+ o(this, "resizeObserver", new ResizeObserver((t) => {
2420
+ const e = t[0], { width: s, height: i } = e.contentRect;
2488
2421
  this.svg.setAttribute("width", `${s}`), this.svg.setAttribute("height", `${i}`), this.patternRenderingRectangle.setAttribute("width", `${s}`), this.patternRenderingRectangle.setAttribute("height", `${i}`);
2489
2422
  const n = this.tileWidth / s, a = this.tileHeight / i;
2490
2423
  this.pattern.setAttribute("width", `${n}`), this.pattern.setAttribute("height", `${a}`);
2491
2424
  }));
2492
2425
  o(this, "onAfterTransformUpdated", () => {
2493
- const e = this.canvas.viewport.getContentMatrix(), t = e.x - this.halfTileWidth * e.scale, s = e.y - this.halfTileHeight * e.scale, i = `matrix(${e.scale}, 0, 0, ${e.scale}, ${t}, ${s})`;
2426
+ const t = this.canvas.viewport.getContentMatrix(), e = t.x - this.halfTileWidth * t.scale, s = t.y - this.halfTileHeight * t.scale, i = `matrix(${t.scale}, 0, 0, ${t.scale}, ${e}, ${s})`;
2494
2427
  this.pattern.setAttribute("patternTransform", i), this.updateVisibility();
2495
2428
  });
2496
- this.canvas = e, this.backgroundHost = s, this.tileWidth = t.tileWidth, this.tileHeight = t.tileHeight, this.halfTileWidth = this.tileWidth / 2, this.halfTileHeight = this.tileHeight / 2, this.patternContent = t.renderer, this.maxViewportScale = t.maxViewportScale;
2429
+ this.canvas = t, this.backgroundHost = s, this.tileWidth = e.tileWidth, this.tileHeight = e.tileHeight, this.halfTileWidth = this.tileWidth / 2, this.halfTileHeight = this.tileHeight / 2, this.patternContent = e.renderer, this.maxViewportScale = e.maxViewportScale;
2497
2430
  const i = `translate(${this.halfTileWidth}, ${this.halfTileHeight})`;
2498
2431
  this.patternContent.setAttribute("transform", i), this.pattern.appendChild(this.patternContent);
2499
2432
  const n = document.createElementNS("http://www.w3.org/2000/svg", "defs");
2500
2433
  n.appendChild(this.pattern), this.svg.appendChild(n), this.svg.appendChild(this.patternRenderingRectangle), this.resizeObserver.observe(this.backgroundHost), this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterTransformUpdated), this.onAfterTransformUpdated();
2501
2434
  }
2502
- static configure(e, t, s) {
2503
- new Q(e, t, s);
2435
+ static configure(t, e, s) {
2436
+ new Q(t, e, s);
2504
2437
  }
2505
2438
  updateVisibility() {
2506
- const t = this.canvas.viewport.getViewportMatrix().scale > this.maxViewportScale;
2507
- t && this.visible ? (this.visible = !1, this.backgroundHost.removeChild(this.svg)) : !t && !this.visible && (this.visible = !0, this.backgroundHost.appendChild(this.svg));
2439
+ const e = this.canvas.viewport.getViewportMatrix().scale > this.maxViewportScale;
2440
+ e && this.visible ? (this.visible = !1, this.backgroundHost.removeChild(this.svg)) : !e && !this.visible && (this.visible = !0, this.backgroundHost.appendChild(this.svg));
2508
2441
  }
2509
2442
  }
2510
2443
  class _ {
2511
- constructor(e, t, s, i, n) {
2444
+ constructor(t, e, s, i, n) {
2512
2445
  o(this, "overlayCanvas");
2513
2446
  o(this, "staticPortId", null);
2514
2447
  o(this, "isTargetDragging", !0);
2515
- o(this, "onEdgeCreated", (e) => {
2516
- this.params.onAfterEdgeCreated(e);
2448
+ o(this, "onEdgeCreated", (t) => {
2449
+ this.params.onAfterEdgeCreated(t);
2517
2450
  });
2518
- this.canvas = e, this.overlayLayer = t, this.viewportStore = s, this.window = i, this.params = n, this.overlayCanvas = De(
2451
+ this.canvas = t, this.overlayLayer = e, this.viewportStore = s, this.window = i, this.params = n, this.overlayCanvas = Dt(
2519
2452
  this.overlayLayer,
2520
2453
  this.viewportStore
2521
2454
  ), O.configure(
@@ -2541,24 +2474,24 @@ class _ {
2541
2474
  }
2542
2475
  );
2543
2476
  }
2544
- static configure(e, t, s, i, n) {
2477
+ static configure(t, e, s, i, n) {
2545
2478
  new _(
2546
- e,
2547
2479
  t,
2480
+ e,
2548
2481
  s,
2549
2482
  i,
2550
2483
  n
2551
2484
  );
2552
2485
  }
2553
- grabPort(e, t, s) {
2554
- const i = this.canvas.graph.getPort(e);
2555
- this.staticPortId = e;
2556
- const n = i.element.getBoundingClientRect(), a = n.x + n.width / 2, h = n.y + n.height / 2, d = this.overlayLayer.getBoundingClientRect(), c = this.canvas.viewport.getViewportMatrix(), l = D(c, {
2486
+ grabPort(t, e, s) {
2487
+ const i = this.canvas.graph.getPort(t);
2488
+ this.staticPortId = t;
2489
+ const n = i.element.getBoundingClientRect(), a = n.x + n.width / 2, h = n.y + n.height / 2, d = this.overlayLayer.getBoundingClientRect(), c = this.canvas.viewport.getViewportMatrix(), l = T(c, {
2557
2490
  x: a - d.x,
2558
2491
  y: h - d.y
2559
- }), g = D(c, {
2560
- x: t.x - d.x,
2561
- y: t.y - d.y
2492
+ }), g = T(c, {
2493
+ x: e.x - d.x,
2494
+ y: e.y - d.y
2562
2495
  }), w = {
2563
2496
  overlayId: P.Static,
2564
2497
  portCoords: l,
@@ -2579,23 +2512,23 @@ class _ {
2579
2512
  resetDragState() {
2580
2513
  this.staticPortId = null, this.isTargetDragging = !0, this.overlayCanvas.clear();
2581
2514
  }
2582
- tryCreateConnection(e) {
2583
- const t = ye(this.canvas.graph, e);
2584
- if (t === null) {
2585
- this.params.onEdgeCreationInterrupted(
2586
- this.staticPortId,
2587
- this.isTargetDragging
2588
- );
2515
+ tryCreateConnection(t) {
2516
+ const e = yt(this.canvas.graph, t);
2517
+ if (e === null) {
2518
+ this.params.onEdgeCreationInterrupted({
2519
+ staticPortId: this.staticPortId,
2520
+ isDirect: this.isTargetDragging
2521
+ });
2589
2522
  return;
2590
2523
  }
2591
- const s = this.isTargetDragging ? this.staticPortId : t, i = this.isTargetDragging ? t : this.staticPortId, n = { from: s, to: i }, a = this.params.connectionPreprocessor(n);
2524
+ const s = this.isTargetDragging ? this.staticPortId : e, i = this.isTargetDragging ? e : this.staticPortId, n = { from: s, to: i }, a = this.params.connectionPreprocessor(n);
2592
2525
  a !== null ? (this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeCreated), this.canvas.addEdge(a), this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeCreated)) : this.params.onEdgeCreationPrevented(n);
2593
2526
  }
2594
- moveDraggingPort(e) {
2595
- const t = this.overlayLayer.getBoundingClientRect(), s = {
2596
- x: e.x - t.x,
2597
- y: e.y - t.y
2598
- }, i = this.canvas.viewport.getViewportMatrix(), n = D(i, s);
2527
+ moveDraggingPort(t) {
2528
+ const e = this.overlayLayer.getBoundingClientRect(), s = {
2529
+ x: t.x - e.x,
2530
+ y: t.y - e.y
2531
+ }, i = this.canvas.viewport.getViewportMatrix(), n = T(i, s);
2599
2532
  this.overlayCanvas.updateNode(P.Dragging, {
2600
2533
  x: n.x,
2601
2534
  y: n.y
@@ -2603,15 +2536,15 @@ class _ {
2603
2536
  }
2604
2537
  }
2605
2538
  class q {
2606
- constructor(e, t, s, i, n) {
2539
+ constructor(t, e, s, i, n) {
2607
2540
  o(this, "overlayCanvas");
2608
2541
  o(this, "staticPortId", null);
2609
2542
  o(this, "isTargetDragging", !0);
2610
2543
  o(this, "draggingEdgePayload", null);
2611
- o(this, "onEdgeReattached", (e) => {
2612
- this.params.onAfterEdgeReattached(e);
2544
+ o(this, "onEdgeReattached", (t) => {
2545
+ this.params.onAfterEdgeReattached(t);
2613
2546
  });
2614
- this.canvas = e, this.overlayLayer = t, this.viewportStore = s, this.window = i, this.params = n, this.overlayCanvas = De(
2547
+ this.canvas = t, this.overlayLayer = e, this.viewportStore = s, this.window = i, this.params = n, this.overlayCanvas = Dt(
2615
2548
  this.overlayLayer,
2616
2549
  this.viewportStore
2617
2550
  ), O.configure(
@@ -2634,33 +2567,33 @@ class q {
2634
2567
  }
2635
2568
  );
2636
2569
  }
2637
- static configure(e, t, s, i, n) {
2570
+ static configure(t, e, s, i, n) {
2638
2571
  new q(
2639
- e,
2640
2572
  t,
2573
+ e,
2641
2574
  s,
2642
2575
  i,
2643
2576
  n
2644
2577
  );
2645
2578
  }
2646
- tryStartEdgeDragging(e, t) {
2647
- const s = this.params.draggingEdgeResolver(e);
2579
+ tryStartEdgeDragging(t, e) {
2580
+ const s = this.params.draggingEdgeResolver(t);
2648
2581
  if (s === null)
2649
2582
  return !1;
2650
2583
  const i = this.canvas.graph.getEdge(s);
2651
2584
  if (i === null)
2652
2585
  return !1;
2653
- const n = e === i.from, a = e === i.to, h = n ? i.to : i.from;
2586
+ const n = t === i.from, a = t === i.to, h = n ? i.to : i.from;
2654
2587
  this.staticPortId = h, this.isTargetDragging = a;
2655
- const d = this.canvas.graph.getPort(e), c = this.canvas.graph.getPort(h), l = c.element.getBoundingClientRect(), g = {
2588
+ const d = this.canvas.graph.getPort(t), c = this.canvas.graph.getPort(h), l = c.element.getBoundingClientRect(), g = {
2656
2589
  x: l.x + l.width / 2,
2657
2590
  y: l.y + l.height / 2
2658
- }, w = this.canvas.viewport.getViewportMatrix(), f = this.overlayLayer.getBoundingClientRect(), y = D(w, {
2591
+ }, w = this.canvas.viewport.getViewportMatrix(), f = this.overlayLayer.getBoundingClientRect(), y = T(w, {
2659
2592
  x: g.x - f.x,
2660
2593
  y: g.y - f.y
2661
- }), v = D(w, {
2662
- x: t.x - f.x,
2663
- y: t.y - f.y
2594
+ }), v = T(w, {
2595
+ x: e.x - f.x,
2596
+ y: e.y - f.y
2664
2597
  });
2665
2598
  this.draggingEdgePayload = {
2666
2599
  id: s,
@@ -2677,32 +2610,32 @@ class q {
2677
2610
  overlayId: P.Dragging,
2678
2611
  portCoords: v,
2679
2612
  portDirection: d.direction
2680
- }, [b, T] = this.isTargetDragging ? [E, x] : [x, E];
2681
- this.overlayCanvas.addNode(W(b)), this.overlayCanvas.addNode(W(T));
2682
- const N = this.params.draggingEdgeShapeFactory !== null ? this.params.draggingEdgeShapeFactory(P.Edge) : i.shape;
2613
+ }, [L, b] = this.isTargetDragging ? [E, x] : [x, E];
2614
+ this.overlayCanvas.addNode(W(L)), this.overlayCanvas.addNode(W(b));
2615
+ const D = this.params.draggingEdgeShapeFactory !== null ? this.params.draggingEdgeShapeFactory(P.Edge) : i.shape;
2683
2616
  return this.overlayCanvas.addEdge({
2684
2617
  id: P.Edge,
2685
- from: b.overlayId,
2686
- to: T.overlayId,
2687
- shape: N
2618
+ from: L.overlayId,
2619
+ to: b.overlayId,
2620
+ shape: D
2688
2621
  }), !0;
2689
2622
  }
2690
2623
  resetDragState() {
2691
2624
  this.draggingEdgePayload = null, this.staticPortId = null, this.isTargetDragging = !0, this.overlayCanvas.clear();
2692
2625
  }
2693
- moveDraggingPort(e) {
2694
- const t = this.overlayLayer.getBoundingClientRect(), s = {
2695
- x: e.x - t.x,
2696
- y: e.y - t.y
2697
- }, i = this.canvas.viewport.getViewportMatrix(), n = D(i, s);
2626
+ moveDraggingPort(t) {
2627
+ const e = this.overlayLayer.getBoundingClientRect(), s = {
2628
+ x: t.x - e.x,
2629
+ y: t.y - e.y
2630
+ }, i = this.canvas.viewport.getViewportMatrix(), n = T(i, s);
2698
2631
  this.overlayCanvas.updateNode(P.Dragging, {
2699
2632
  x: n.x,
2700
2633
  y: n.y
2701
2634
  });
2702
2635
  }
2703
- tryCreateConnection(e) {
2704
- const t = ye(this.canvas.graph, e);
2705
- if (this.overlayCanvas.removeEdge(P.Edge), t === null) {
2636
+ tryCreateConnection(t) {
2637
+ const e = yt(this.canvas.graph, t);
2638
+ if (this.overlayCanvas.removeEdge(P.Edge), e === null) {
2706
2639
  const d = this.draggingEdgePayload;
2707
2640
  this.params.onEdgeReattachInterrupted({
2708
2641
  id: d.id,
@@ -2713,7 +2646,7 @@ class q {
2713
2646
  });
2714
2647
  return;
2715
2648
  }
2716
- const [s, i] = this.isTargetDragging ? [this.staticPortId, t] : [t, this.staticPortId], n = this.draggingEdgePayload, a = {
2649
+ const [s, i] = this.isTargetDragging ? [this.staticPortId, e] : [e, this.staticPortId], n = this.draggingEdgePayload, a = {
2717
2650
  id: n.id,
2718
2651
  from: s,
2719
2652
  to: i,
@@ -2734,45 +2667,45 @@ class q {
2734
2667
  }
2735
2668
  }
2736
2669
  }
2737
- const ct = () => {
2670
+ const ce = () => {
2738
2671
  const r = document.createElement("div");
2739
2672
  return r.style.width = "100%", r.style.height = "100%", r.style.position = "relative", r;
2740
2673
  }, Y = () => {
2741
2674
  const r = document.createElement("div");
2742
2675
  return r.style.position = "absolute", r.style.inset = "0", r;
2743
- }, ce = () => {
2676
+ }, ct = () => {
2744
2677
  const r = Y();
2745
2678
  return r.style.pointerEvents = "none", r;
2746
2679
  };
2747
- class gt {
2748
- constructor(e) {
2680
+ class ge {
2681
+ constructor(t) {
2749
2682
  o(this, "background", Y());
2750
2683
  o(this, "main", Y());
2751
- o(this, "overlayConnectablePorts", ce());
2752
- o(this, "overlayDraggableEdges", ce());
2753
- o(this, "host", ct());
2754
- 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);
2684
+ o(this, "overlayConnectablePorts", ct());
2685
+ o(this, "overlayDraggableEdges", ct());
2686
+ o(this, "host", ce());
2687
+ this.element = t, 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);
2755
2688
  }
2756
2689
  destroy() {
2757
2690
  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);
2758
2691
  }
2759
2692
  }
2760
- const H = (r) => () => r, ge = H(0), lt = () => {
2693
+ const H = (r) => () => r, gt = H(0), le = () => {
2761
2694
  let r = 0;
2762
2695
  return () => r++;
2763
- }, ut = (r, e) => {
2764
- let t = ge, s = ge;
2765
- const i = lt();
2766
- return r === "incremental" && (t = i), e === "incremental" && (s = i), typeof r == "number" && (t = H(r)), typeof e == "number" && (s = H(e)), typeof r == "function" && (t = r), typeof e == "function" && (s = e), {
2767
- nodesPriorityFn: t,
2696
+ }, ue = (r, t) => {
2697
+ let e = gt, s = gt;
2698
+ const i = le();
2699
+ return r === "incremental" && (e = i), t === "incremental" && (s = i), typeof r == "number" && (e = H(r)), typeof t == "number" && (s = H(t)), typeof r == "function" && (e = r), typeof t == "function" && (s = t), {
2700
+ nodesPriorityFn: e,
2768
2701
  edgesPriorityFn: s
2769
2702
  };
2770
- }, ee = (r) => {
2703
+ }, tt = (r) => {
2771
2704
  if (typeof r == "function")
2772
2705
  return r;
2773
2706
  switch (r == null ? void 0 : r.type) {
2774
2707
  case "straight":
2775
- return () => new et({
2708
+ return () => new te({
2776
2709
  color: r.color,
2777
2710
  width: r.width,
2778
2711
  arrowLength: r.arrowLength,
@@ -2786,7 +2719,7 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2786
2719
  detourDirection: r.detourDirection
2787
2720
  });
2788
2721
  case "horizontal":
2789
- return () => new qe({
2722
+ return () => new qt({
2790
2723
  color: r.color,
2791
2724
  width: r.width,
2792
2725
  arrowLength: r.arrowLength,
@@ -2796,11 +2729,10 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2796
2729
  hasTargetArrow: r.hasTargetArrow,
2797
2730
  cycleSquareSide: r.cycleSquareSide,
2798
2731
  roundness: r.roundness,
2799
- detourDistance: r.detourDistance,
2800
- detourDirection: r.detourDirection
2732
+ detourDistance: r.detourDistance
2801
2733
  });
2802
2734
  case "vertical":
2803
- return () => new tt({
2735
+ return () => new ee({
2804
2736
  color: r.color,
2805
2737
  width: r.width,
2806
2738
  arrowLength: r.arrowLength,
@@ -2810,11 +2742,10 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2810
2742
  hasTargetArrow: r.hasTargetArrow,
2811
2743
  cycleSquareSide: r.cycleSquareSide,
2812
2744
  roundness: r.roundness,
2813
- detourDistance: r.detourDistance,
2814
- detourDirection: r.detourDirection
2745
+ detourDistance: r.detourDistance
2815
2746
  });
2816
2747
  case "direct":
2817
- return () => new be({
2748
+ return () => new bt({
2818
2749
  color: r.color,
2819
2750
  width: r.width,
2820
2751
  arrowLength: r.arrowLength,
@@ -2825,7 +2756,7 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2825
2756
  targetOffset: r.targetOffset
2826
2757
  });
2827
2758
  default:
2828
- return () => new _e({
2759
+ return () => new _t({
2829
2760
  color: r.color,
2830
2761
  width: r.width,
2831
2762
  arrowLength: r.arrowLength,
@@ -2839,30 +2770,30 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2839
2770
  detourDirection: r.detourDirection
2840
2771
  });
2841
2772
  }
2842
- }, pt = (r) => {
2843
- var t, s, i, n, a;
2844
- const e = ut(
2845
- (t = r.nodes) == null ? void 0 : t.priority,
2773
+ }, pe = (r) => {
2774
+ var e, s, i, n, a;
2775
+ const t = ue(
2776
+ (e = r.nodes) == null ? void 0 : e.priority,
2846
2777
  (s = r.edges) == null ? void 0 : s.priority
2847
2778
  );
2848
2779
  return {
2849
2780
  nodes: {
2850
- centerFn: ((i = r.nodes) == null ? void 0 : i.centerFn) ?? ve,
2851
- priorityFn: e.nodesPriorityFn
2781
+ centerFn: ((i = r.nodes) == null ? void 0 : i.centerFn) ?? vt,
2782
+ priorityFn: t.nodesPriorityFn
2852
2783
  },
2853
2784
  ports: {
2854
2785
  direction: ((n = r.ports) == null ? void 0 : n.direction) ?? 0
2855
2786
  },
2856
2787
  edges: {
2857
- shapeFactory: ee(((a = r.edges) == null ? void 0 : a.shape) ?? {}),
2858
- priorityFn: e.edgesPriorityFn
2788
+ shapeFactory: tt(((a = r.edges) == null ? void 0 : a.shape) ?? {}),
2789
+ priorityFn: t.edgesPriorityFn
2859
2790
  }
2860
2791
  };
2861
- }, wt = (r) => {
2862
- var w, f, y, v, E, x;
2863
- const e = ((w = r.events) == null ? void 0 : w.onNodeDrag) ?? (() => {
2864
- }), t = ((f = r.events) == null ? void 0 : f.onBeforeNodeDrag) ?? (() => !0), s = ((y = r.events) == null ? void 0 : y.onNodeDragFinished) ?? (() => {
2865
- }), i = r.moveOnTop !== !1, n = r.moveEdgesOnTop !== !1 && i, a = (v = r.mouse) == null ? void 0 : v.dragCursor, h = a !== void 0 ? a : "grab", d = (E = r.mouse) == null ? void 0 : E.mouseDownEventVerifier, c = d !== void 0 ? d : (b) => b.button === 0, l = (x = r.mouse) == null ? void 0 : x.mouseUpEventVerifier, g = l !== void 0 ? l : (b) => b.button === 0;
2792
+ }, we = (r) => {
2793
+ var w, f, y, v, E;
2794
+ const t = ((w = r.events) == null ? void 0 : w.onNodeDrag) ?? (() => {
2795
+ }), e = r.nodeDragVerifier ?? (() => !0), s = ((f = r.events) == null ? void 0 : f.onNodeDragFinished) ?? (() => {
2796
+ }), i = r.moveOnTop !== !1, n = r.moveEdgesOnTop !== !1 && i, a = (y = r.mouse) == null ? void 0 : y.dragCursor, h = a !== void 0 ? a : "grab", d = (v = r.mouse) == null ? void 0 : v.mouseDownEventVerifier, c = d !== void 0 ? d : (x) => x.button === 0, l = (E = r.mouse) == null ? void 0 : E.mouseUpEventVerifier, g = l !== void 0 ? l : (x) => x.button === 0;
2866
2797
  return {
2867
2798
  moveOnTop: i,
2868
2799
  moveEdgesOnTop: n,
@@ -2870,22 +2801,22 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2870
2801
  gridSize: r.gridSize ?? null,
2871
2802
  mouseDownEventVerifier: c,
2872
2803
  mouseUpEventVerifier: g,
2873
- onNodeDrag: e,
2874
- onBeforeNodeDrag: t,
2804
+ onNodeDrag: t,
2805
+ nodeDragVerifier: e,
2875
2806
  onNodeDragFinished: s
2876
2807
  };
2877
- }, ft = (r) => {
2878
- const e = r.minX !== null ? r.minX : -1 / 0, t = r.maxX !== null ? r.maxX : 1 / 0, s = r.minY !== null ? r.minY : -1 / 0, i = r.maxY !== null ? r.maxY : 1 / 0;
2808
+ }, fe = (r) => {
2809
+ const t = r.minX !== null ? r.minX : -1 / 0, e = r.maxX !== null ? r.maxX : 1 / 0, s = r.minY !== null ? r.minY : -1 / 0, i = r.maxY !== null ? r.maxY : 1 / 0;
2879
2810
  return (n) => {
2880
2811
  let a = n.nextTransform.x, h = n.nextTransform.y;
2881
- a < e && a < n.prevTransform.x && (a = Math.min(n.prevTransform.x, e));
2882
- const d = n.canvasWidth * n.prevTransform.scale, c = t - d;
2812
+ a < t && a < n.prevTransform.x && (a = Math.min(n.prevTransform.x, t));
2813
+ const d = n.canvasWidth * n.prevTransform.scale, c = e - d;
2883
2814
  a > c && a > n.prevTransform.x && (a = Math.max(n.prevTransform.x, c)), h < s && h < n.prevTransform.y && (h = Math.min(n.prevTransform.y, s));
2884
2815
  const l = n.canvasHeight * n.prevTransform.scale, g = i - l;
2885
2816
  return h > g && h > n.prevTransform.y && (h = Math.max(n.prevTransform.y, g)), { scale: n.nextTransform.scale, x: a, y: h };
2886
2817
  };
2887
- }, mt = (r) => {
2888
- const e = r.maxContentScale, t = r.minContentScale, s = e !== null ? 1 / e : 0, i = t !== null ? 1 / t : 1 / 0;
2818
+ }, me = (r) => {
2819
+ const t = r.maxContentScale, e = r.minContentScale, s = t !== null ? 1 / t : 0, i = e !== null ? 1 / e : 1 / 0;
2889
2820
  return (n) => {
2890
2821
  const a = n.prevTransform, h = n.nextTransform;
2891
2822
  let d = h.scale, c = h.x, l = h.y;
@@ -2905,48 +2836,48 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2905
2836
  y: l
2906
2837
  };
2907
2838
  };
2908
- }, yt = (r) => (e) => r.reduce(
2909
- (t, s) => s({
2910
- prevTransform: e.prevTransform,
2911
- nextTransform: t,
2912
- canvasWidth: e.canvasWidth,
2913
- canvasHeight: e.canvasHeight
2839
+ }, ye = (r) => (t) => r.reduce(
2840
+ (e, s) => s({
2841
+ prevTransform: t.prevTransform,
2842
+ nextTransform: e,
2843
+ canvasWidth: t.canvasWidth,
2844
+ canvasHeight: t.canvasHeight
2914
2845
  }),
2915
- e.nextTransform
2916
- ), le = (r) => {
2846
+ t.nextTransform
2847
+ ), lt = (r) => {
2917
2848
  if (typeof r == "function")
2918
2849
  return r;
2919
2850
  switch (r.type) {
2920
2851
  case "scale-limit":
2921
- return mt({
2852
+ return me({
2922
2853
  minContentScale: r.minContentScale ?? 0,
2923
2854
  maxContentScale: r.maxContentScale ?? 1 / 0
2924
2855
  });
2925
2856
  case "shift-limit":
2926
- return ft({
2857
+ return fe({
2927
2858
  minX: r.minX ?? -1 / 0,
2928
2859
  maxX: r.maxX ?? 1 / 0,
2929
2860
  minY: r.minY ?? -1 / 0,
2930
2861
  maxY: r.maxY ?? 1 / 0
2931
2862
  });
2932
2863
  }
2933
- }, ue = (r) => {
2934
- var y, v, E, x, b, T, N, V, te, re, oe, se;
2935
- const e = (y = r == null ? void 0 : r.scale) == null ? void 0 : y.mouseWheelSensitivity, t = e !== void 0 ? e : 1.2, s = r == null ? void 0 : r.transformPreprocessor;
2864
+ }, ut = (r) => {
2865
+ var y, v, E, x, L, b, D, V, et, rt, ot, st;
2866
+ const t = (y = r == null ? void 0 : r.scale) == null ? void 0 : y.mouseWheelSensitivity, e = t !== void 0 ? t : 1.2, s = r == null ? void 0 : r.transformPreprocessor;
2936
2867
  let i;
2937
- s !== void 0 ? Array.isArray(s) ? i = yt(
2868
+ s !== void 0 ? Array.isArray(s) ? i = ye(
2938
2869
  s.map(
2939
- (M) => le(M)
2870
+ (N) => lt(N)
2940
2871
  )
2941
- ) : i = le(s) : i = (M) => M.nextTransform;
2872
+ ) : i = lt(s) : i = (N) => N.nextTransform;
2942
2873
  const n = ((v = r == null ? void 0 : r.shift) == null ? void 0 : v.cursor) !== void 0 ? r.shift.cursor : "grab", a = ((E = r == null ? void 0 : r.events) == null ? void 0 : E.onBeforeTransformChange) ?? (() => {
2943
2874
  }), h = ((x = r == null ? void 0 : r.events) == null ? void 0 : x.onTransformChange) ?? (() => {
2944
- }), d = (b = r == null ? void 0 : r.shift) == null ? void 0 : b.mouseDownEventVerifier, c = d !== void 0 ? d : (M) => M.button === 0, l = (T = r == null ? void 0 : r.shift) == null ? void 0 : T.mouseUpEventVerifier, g = l !== void 0 ? l : (M) => M.button === 0, w = (N = r == null ? void 0 : r.scale) == null ? void 0 : N.mouseWheelEventVerifier, f = w !== void 0 ? w : () => !0;
2875
+ }), d = (L = r == null ? void 0 : r.shift) == null ? void 0 : L.mouseDownEventVerifier, c = d !== void 0 ? d : (N) => N.button === 0, l = (b = r == null ? void 0 : r.shift) == null ? void 0 : b.mouseUpEventVerifier, g = l !== void 0 ? l : (N) => N.button === 0, w = (D = r == null ? void 0 : r.scale) == null ? void 0 : D.mouseWheelEventVerifier, f = w !== void 0 ? w : () => !0;
2945
2876
  return {
2946
- wheelSensitivity: t,
2877
+ wheelSensitivity: e,
2947
2878
  onTransformStarted: ((V = r == null ? void 0 : r.events) == null ? void 0 : V.onTransformStarted) ?? (() => {
2948
2879
  }),
2949
- onTransformFinished: ((te = r == null ? void 0 : r.events) == null ? void 0 : te.onTransformFinished) ?? (() => {
2880
+ onTransformFinished: ((et = r == null ? void 0 : r.events) == null ? void 0 : et.onTransformFinished) ?? (() => {
2950
2881
  }),
2951
2882
  onBeforeTransformChange: a,
2952
2883
  onTransformChange: h,
@@ -2955,30 +2886,30 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2955
2886
  mouseDownEventVerifier: c,
2956
2887
  mouseUpEventVerifier: g,
2957
2888
  mouseWheelEventVerifier: f,
2958
- scaleWheelFinishTimeout: ((re = r == null ? void 0 : r.scale) == null ? void 0 : re.wheelFinishTimeout) ?? 500,
2959
- onResizeTransformStarted: ((oe = r == null ? void 0 : r.events) == null ? void 0 : oe.onResizeTransformStarted) ?? (() => {
2889
+ scaleWheelFinishTimeout: ((rt = r == null ? void 0 : r.scale) == null ? void 0 : rt.wheelFinishTimeout) ?? 500,
2890
+ onResizeTransformStarted: ((ot = r == null ? void 0 : r.events) == null ? void 0 : ot.onResizeTransformStarted) ?? (() => {
2960
2891
  }),
2961
- onResizeTransformFinished: ((se = r == null ? void 0 : r.events) == null ? void 0 : se.onResizeTransformFinished) ?? (() => {
2892
+ onResizeTransformFinished: ((st = r == null ? void 0 : r.events) == null ? void 0 : st.onResizeTransformFinished) ?? (() => {
2962
2893
  })
2963
2894
  };
2964
- }, vt = (r, e) => {
2965
- const t = document.createElementNS(
2895
+ }, ve = (r, t) => {
2896
+ const e = document.createElementNS(
2966
2897
  "http://www.w3.org/2000/svg",
2967
2898
  "circle"
2968
2899
  );
2969
- return t.setAttribute("cx", "0"), t.setAttribute("cy", "0"), t.setAttribute("r", `${r}`), t.setAttribute("fill", `${e}`), t;
2970
- }, Et = (r) => r instanceof SVGElement ? r : vt(
2900
+ return e.setAttribute("cx", "0"), e.setAttribute("cy", "0"), e.setAttribute("r", `${r}`), e.setAttribute("fill", `${t}`), e;
2901
+ }, Ee = (r) => r instanceof SVGElement ? r : ve(
2971
2902
  (r == null ? void 0 : r.radius) ?? 1.5,
2972
2903
  (r == null ? void 0 : r.color) ?? "#d8d8d8"
2973
- ), At = (r) => {
2974
- const e = r.tileDimensions, t = (e == null ? void 0 : e.width) ?? 25, s = (e == null ? void 0 : e.height) ?? 25, i = Et(r.renderer ?? {});
2904
+ ), Ae = (r) => {
2905
+ const t = r.tileDimensions, e = (t == null ? void 0 : t.width) ?? 25, s = (t == null ? void 0 : t.height) ?? 25, i = Ee(r.renderer ?? {});
2975
2906
  return {
2976
- tileWidth: t,
2907
+ tileWidth: e,
2977
2908
  tileHeight: s,
2978
2909
  renderer: i,
2979
2910
  maxViewportScale: r.maxViewportScale ?? 10
2980
2911
  };
2981
- }, xt = (r, e, t) => {
2912
+ }, xe = (r, t, e) => {
2982
2913
  var c, l, g;
2983
2914
  const s = () => "direct", i = (w) => w, n = (w) => w.button === 0, a = () => {
2984
2915
  }, h = () => {
@@ -2992,43 +2923,49 @@ const H = (r) => () => r, ge = H(0), lt = () => {
2992
2923
  onAfterEdgeCreated: ((c = r.events) == null ? void 0 : c.onAfterEdgeCreated) ?? a,
2993
2924
  onEdgeCreationInterrupted: ((l = r.events) == null ? void 0 : l.onEdgeCreationInterrupted) ?? d,
2994
2925
  onEdgeCreationPrevented: ((g = r.events) == null ? void 0 : g.onEdgeCreationPrevented) ?? h,
2995
- dragPortDirection: r.dragPortDirection ?? t,
2996
- edgeShapeFactory: r.edgeShape !== void 0 ? ee(r.edgeShape) : e
2926
+ dragPortDirection: r.dragPortDirection ?? e,
2927
+ edgeShapeFactory: r.edgeShape !== void 0 ? tt(r.edgeShape) : t
2997
2928
  };
2998
- }, St = (r, e) => {
2929
+ }, Se = (r, t) => {
2999
2930
  var c, l, g;
3000
- const t = (w) => w, s = (w) => w.button === 0 && w.ctrlKey, i = (w) => w.button === 0, n = (w) => {
3001
- const f = e.getPortAdjacentEdgeIds(w);
2931
+ const e = (w) => w, s = (w) => w.button === 0 && w.ctrlKey, i = (w) => w.button === 0, n = (w) => {
2932
+ const f = t.getPortAdjacentEdgeIds(w);
3002
2933
  return f.length > 0 ? f[f.length - 1] : null;
3003
2934
  }, a = () => {
3004
2935
  }, h = () => {
3005
2936
  }, d = () => {
3006
2937
  };
3007
2938
  return {
3008
- connectionPreprocessor: r.connectionPreprocessor ?? t,
2939
+ connectionPreprocessor: r.connectionPreprocessor ?? e,
3009
2940
  mouseDownEventVerifier: r.mouseDownEventVerifier ?? s,
3010
2941
  mouseUpEventVerifier: r.mouseUpEventVerifier ?? i,
3011
2942
  draggingEdgeResolver: r.draggingEdgeResolver ?? n,
3012
- draggingEdgeShapeFactory: r.draggingEdgeShape !== void 0 ? ee(r.draggingEdgeShape) : null,
2943
+ draggingEdgeShapeFactory: r.draggingEdgeShape !== void 0 ? tt(r.draggingEdgeShape) : null,
3013
2944
  onAfterEdgeReattached: ((c = r.events) == null ? void 0 : c.onAfterEdgeReattached) ?? a,
3014
2945
  onEdgeReattachInterrupted: ((l = r.events) == null ? void 0 : l.onEdgeReattachInterrupted) ?? d,
3015
2946
  onEdgeReattachPrevented: ((g = r.events) == null ? void 0 : g.onEdgeReattachPrevented) ?? h
3016
2947
  };
3017
- }, Pt = (r) => ({
2948
+ }, Pe = (r) => ({
3018
2949
  nodeVerticalRadius: r.nodeContainingRadius.vertical,
3019
2950
  nodeHorizontalRadius: r.nodeContainingRadius.horizontal
3020
- }), bt = (r) => {
3021
- var e, t;
2951
+ }), be = (r) => {
2952
+ var t, e;
3022
2953
  return {
3023
- onAfterNodeDetached: ((e = r == null ? void 0 : r.events) == null ? void 0 : e.onAfterNodeDetached) ?? (() => {
2954
+ onAfterNodeDetached: ((t = r == null ? void 0 : r.events) == null ? void 0 : t.onAfterNodeDetached) ?? (() => {
3024
2955
  }),
3025
- onBeforeNodeAttached: ((t = r == null ? void 0 : r.events) == null ? void 0 : t.onBeforeNodeAttached) ?? (() => {
2956
+ onBeforeNodeAttached: ((e = r == null ? void 0 : r.events) == null ? void 0 : e.onBeforeNodeAttached) ?? (() => {
3026
2957
  })
3027
2958
  };
3028
2959
  };
3029
- class Nt {
3030
- constructor(e) {
3031
- o(this, "element", null);
2960
+ class Te extends Error {
2961
+ constructor() {
2962
+ super(...arguments);
2963
+ o(this, "name", "CanvasBuilderError");
2964
+ }
2965
+ }
2966
+ class Me {
2967
+ constructor(t) {
2968
+ o(this, "used", !1);
3032
2969
  o(this, "canvasDefaults", {});
3033
2970
  o(this, "dragConfig", {});
3034
2971
  o(this, "transformConfig", {});
@@ -3044,39 +2981,25 @@ class Nt {
3044
2981
  o(this, "hasUserDraggableEdges", !1);
3045
2982
  o(this, "boxRenderingTrigger");
3046
2983
  o(this, "window", window);
3047
- e !== void 0 && (this.element = e);
3048
- }
3049
- /**
3050
- * @deprecated
3051
- * use `new CanvasBuilder(element);` instead
3052
- */
3053
- setElement(e) {
3054
- return this.element = e, this;
2984
+ this.element = t, t !== void 0 && (this.element = t);
3055
2985
  }
3056
2986
  /**
3057
2987
  * specifies default values for graph entities
3058
2988
  */
3059
- setDefaults(e) {
3060
- return this.canvasDefaults = e, this;
2989
+ setDefaults(t) {
2990
+ return this.canvasDefaults = t, this;
3061
2991
  }
3062
2992
  /**
3063
2993
  * enables nodes draggable by user
3064
2994
  */
3065
- enableUserDraggableNodes(e) {
3066
- return this.hasDraggableNode = !0, this.dragConfig = e ?? {}, this;
2995
+ enableUserDraggableNodes(t) {
2996
+ return this.hasDraggableNode = !0, this.dragConfig = t ?? {}, this;
3067
2997
  }
3068
2998
  /**
3069
2999
  * enables viewport transformable by user
3070
3000
  */
3071
- enableUserTransformableViewport(e) {
3072
- return this.hasTransformableViewport = !0, this.transformConfig = e ?? {}, this;
3073
- }
3074
- /**
3075
- * @deprecated
3076
- * use enableNodeResizeReactiveEdges instead
3077
- */
3078
- enableResizeReactiveNodes() {
3079
- return this.hasNodeResizeReactiveEdges = !0, this;
3001
+ enableUserTransformableViewport(t) {
3002
+ return this.hasTransformableViewport = !0, this.transformConfig = t ?? {}, this;
3080
3003
  }
3081
3004
  /**
3082
3005
  * enables automatic edges update on node resize
@@ -3084,76 +3007,66 @@ class Nt {
3084
3007
  enableNodeResizeReactiveEdges() {
3085
3008
  return this.hasNodeResizeReactiveEdges = !0, this;
3086
3009
  }
3087
- /**
3088
- * @deprecated
3089
- * do not use
3090
- * sets emitter for rendering graph inside bounded area
3091
- */
3092
- enableBoxAreaRendering(e) {
3093
- return this.boxRenderingTrigger = e, this;
3094
- }
3095
3010
  /**
3096
3011
  * enables built-in virtual scroll behavior, when only nodes and edges close
3097
3012
  * to viewport are rendered
3098
3013
  */
3099
- enableVirtualScroll(e) {
3100
- return this.virtualScrollConfig = e, this;
3014
+ enableVirtualScroll(t) {
3015
+ return this.virtualScrollConfig = t, this;
3101
3016
  }
3102
3017
  /**
3103
3018
  * enables built-in background rendering
3104
3019
  */
3105
- enableBackground(e) {
3106
- return this.hasBackground = !0, this.backgroundConfig = e ?? {}, this;
3020
+ enableBackground(t) {
3021
+ return this.hasBackground = !0, this.backgroundConfig = t ?? {}, this;
3107
3022
  }
3108
3023
  /**
3109
3024
  * enables edge creation by dragging one port to another
3110
3025
  */
3111
- enableUserConnectablePorts(e) {
3112
- return this.connectablePortsConfig = e ?? {}, this.hasUserConnectablePorts = !0, this;
3026
+ enableUserConnectablePorts(t) {
3027
+ return this.connectablePortsConfig = t ?? {}, this.hasUserConnectablePorts = !0, this;
3113
3028
  }
3114
- enableUserDraggableEdges(e) {
3115
- return this.hasUserDraggableEdges = !0, this.draggableEdgesConfig = e ?? {}, this;
3029
+ enableUserDraggableEdges(t) {
3030
+ return this.hasUserDraggableEdges = !0, this.draggableEdgesConfig = t ?? {}, this;
3116
3031
  }
3117
3032
  /**
3118
3033
  * builds final canvas
3119
3034
  */
3120
3035
  build() {
3121
- if (this.element === null)
3122
- throw new S(
3123
- "unable to build canvas when no attach element specified"
3124
- );
3125
- let e = this.boxRenderingTrigger;
3126
- this.virtualScrollConfig !== void 0 && e === void 0 && (e = new we());
3127
- const t = new me(), s = new $e(), i = new gt(this.element);
3128
- let n = new pe(
3129
- t,
3036
+ if (this.used)
3037
+ throw new Te("CanvasBuilder is a single use object");
3038
+ this.used = !0;
3039
+ let t = this.boxRenderingTrigger;
3040
+ this.virtualScrollConfig !== void 0 && t === void 0 && (t = new wt());
3041
+ const e = new mt(), s = new Bt(), i = new ge(this.element);
3042
+ let n = new pt(
3043
+ e,
3130
3044
  s,
3131
3045
  i.main
3132
3046
  );
3133
- e !== void 0 && (n = new Ie(
3047
+ t !== void 0 && (n = new It(
3134
3048
  n,
3135
- t,
3136
3049
  e,
3137
- bt(this.virtualScrollConfig)
3138
- ));
3139
- const a = pt(this.canvasDefaults), h = new fe(
3140
- this.element,
3141
3050
  t,
3051
+ be(this.virtualScrollConfig)
3052
+ ));
3053
+ const a = pe(this.canvasDefaults), h = new ft(
3054
+ e,
3142
3055
  s,
3143
3056
  n,
3144
3057
  a
3145
3058
  );
3146
3059
  if (this.hasBackground && Q.configure(
3147
3060
  h,
3148
- At(this.backgroundConfig),
3061
+ Ae(this.backgroundConfig),
3149
3062
  i.background
3150
3063
  ), this.hasNodeResizeReactiveEdges && j.configure(h), this.hasDraggableNode && Z.configure(
3151
3064
  h,
3152
3065
  i.main,
3153
3066
  this.window,
3154
- wt(this.dragConfig)
3067
+ we(this.dragConfig)
3155
3068
  ), this.hasUserConnectablePorts) {
3156
- const c = xt(
3069
+ const c = xe(
3157
3070
  this.connectablePortsConfig,
3158
3071
  a.edges.shapeFactory,
3159
3072
  a.ports.direction
@@ -3167,7 +3080,7 @@ class Nt {
3167
3080
  );
3168
3081
  }
3169
3082
  if (this.hasUserDraggableEdges) {
3170
- const c = St(
3083
+ const c = Se(
3171
3084
  this.draggableEdgesConfig,
3172
3085
  h.graph
3173
3086
  );
@@ -3183,40 +3096,31 @@ class Nt {
3183
3096
  h,
3184
3097
  i.main,
3185
3098
  this.window,
3186
- ue(this.transformConfig),
3187
- e,
3188
- Pt(this.virtualScrollConfig)
3099
+ ut(this.transformConfig),
3100
+ t,
3101
+ Pe(this.virtualScrollConfig)
3189
3102
  ) : this.hasTransformableViewport && k.configure(
3190
3103
  h,
3191
3104
  i.main,
3192
3105
  this.window,
3193
- ue(this.transformConfig)
3194
- ), this.reset();
3106
+ ut(this.transformConfig)
3107
+ );
3195
3108
  const d = () => {
3196
3109
  i.destroy(), h.onBeforeDestroy.unsubscribe(d);
3197
3110
  };
3198
3111
  return h.onBeforeDestroy.subscribe(d), h;
3199
3112
  }
3200
- /**
3201
- * @deprecated
3202
- * CanvasBuilder should be single use object
3203
- */
3204
- reset() {
3205
- this.element = null, this.canvasDefaults = {}, this.dragConfig = {}, this.transformConfig = {}, this.backgroundConfig = {}, this.virtualScrollConfig = void 0, this.hasDraggableNode = !1, this.hasTransformableViewport = !1, this.hasNodeResizeReactiveEdges = !1, this.hasBackground = !1, this.boxRenderingTrigger = void 0, this.hasUserConnectablePorts = !1;
3206
- }
3207
3113
  }
3208
3114
  export {
3209
- _e as BezierEdgeShape,
3210
- Nt as CanvasBuilder,
3211
- be as DirectEdgeShape,
3212
- we as EventSubject,
3213
- qe as HorizontalEdgeShape,
3214
- S as HtmlGraphError,
3215
- st as InteractiveEdgeError,
3216
- Te as InteractiveEdgeShape,
3217
- F as LineEdgeShape,
3218
- Dt as MedianEdgeShape,
3219
- Dt as MidpointEdgeShape,
3220
- et as StraightEdgeShape,
3221
- tt as VerticalEdgeShape
3115
+ _t as BezierEdgeShape,
3116
+ Me as CanvasBuilder,
3117
+ Te as CanvasBuilderError,
3118
+ S as CanvasError,
3119
+ bt as DirectEdgeShape,
3120
+ qt as HorizontalEdgeShape,
3121
+ se as InteractiveEdgeError,
3122
+ Tt as InteractiveEdgeShape,
3123
+ Ne as MidpointEdgeShape,
3124
+ te as StraightEdgeShape,
3125
+ ee as VerticalEdgeShape
3222
3126
  };