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