@html-graph/html-graph 0.1.0 → 0.1.2

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 +26 -41
  2. package/dist/main.d.ts +135 -180
  3. package/dist/main.js +1417 -1327
  4. package/dist/main.umd.cjs +1 -1
  5. package/package.json +1 -1
package/dist/main.js CHANGED
@@ -1,832 +1,933 @@
1
- var Q = Object.defineProperty;
2
- var Z = (r, e, t) => e in r ? Q(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
3
- var a = (r, e, t) => Z(r, typeof e != "symbol" ? e + "" : e, t);
4
- const H = (r, e) => ({
5
- x: r / 2,
6
- y: e / 2
7
- }), v = (r, e, t) => ({
8
- x: e.x * r.x - e.y * r.y + ((1 - e.x) * t.x + e.y * t.y),
9
- y: e.y * r.x + e.x * r.y + ((1 - e.x) * t.y - e.y * t.x)
10
- }), x = (r, e, t) => ({ x: e * Math.cos(r), y: t * Math.sin(r) }), l = {
1
+ var O = Object.defineProperty;
2
+ var K = (e, t, o) => t in e ? O(e, t, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[t] = o;
3
+ var s = (e, t, o) => K(e, typeof t != "symbol" ? t + "" : t, o);
4
+ const _ = (e, t) => ({
5
+ x: e / 2,
6
+ y: t / 2
7
+ }), f = (e, t, o) => ({
8
+ x: t.x * e.x - t.y * e.y + ((1 - t.x) * o.x + t.y * o.y),
9
+ y: t.y * e.x + t.x * e.y + ((1 - t.x) * o.y - t.y * o.x)
10
+ }), A = (e, t, o) => ({ x: t * Math.cos(e), y: o * Math.sin(e) }), u = {
11
11
  x: 0,
12
12
  y: 0
13
- }, f = (r, e, t, s) => {
14
- const o = [
15
- l,
16
- { x: t, y: s },
17
- { x: t, y: -s }
18
- ].map((c) => v(c, r, l)).map((c) => ({ x: c.x + e.x, y: c.y + e.y })), h = `M ${o[0].x} ${o[0].y}`, i = `L ${o[1].x} ${o[1].y}`, d = `L ${o[2].x} ${o[2].y}`;
19
- return `${h} ${i} ${d}`;
20
- }, W = (r, e) => {
21
- const t = [];
22
- 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) {
23
- const s = r.length - 1;
24
- let n = 0, o = 0, h = 0;
25
- r.forEach((i, d) => {
26
- let c = 0, u = 0, w = 0;
27
- const m = d > 0, y = d < s, p = m && y;
28
- if (m && (c = -n, u = -o, w = h), y) {
29
- const j = r[d + 1];
30
- n = j.x - i.x, o = j.y - i.y, h = Math.sqrt(n * n + o * o);
13
+ }, E = (e, t, o, r) => {
14
+ const i = [
15
+ u,
16
+ { x: o, y: r },
17
+ { x: o, y: -r }
18
+ ].map((l) => f(l, e, u)).map((l) => ({ x: l.x + t.x, y: l.y + t.y })), c = `M ${i[0].x} ${i[0].y}`, d = `L ${i[1].x} ${i[1].y}`, h = `L ${i[2].x} ${i[2].y}`;
19
+ return `${c} ${d} ${h}`;
20
+ }, C = (e, t) => {
21
+ const o = [];
22
+ if (e.length > 0 && o.push(`M ${e[0].x} ${e[0].y}`), e.length === 2 && o.push(`L ${e[1].x} ${e[1].y}`), e.length > 2) {
23
+ const r = e.length - 1;
24
+ let n = 0, i = 0, c = 0;
25
+ e.forEach((d, h) => {
26
+ let l = 0, a = 0, w = 0;
27
+ const y = h > 0, x = h < r, v = y && x;
28
+ if (y && (l = -n, a = -i, w = c), x) {
29
+ const z = e[h + 1];
30
+ n = z.x - d.x, i = z.y - d.y, c = Math.sqrt(n * n + i * i);
31
31
  }
32
- const P = h !== 0 ? Math.min((p ? e : 0) / h, d < s - 1 ? 0.5 : 1) : 0, S = p ? { x: i.x + n * P, y: i.y + o * P } : i, L = w !== 0 ? Math.min((p ? e : 0) / w, d > 1 ? 0.5 : 1) : 0, F = p ? { x: i.x + c * L, y: i.y + u * L } : i;
33
- d > 0 && t.push(`L ${F.x} ${F.y}`), p && t.push(
34
- `C ${i.x} ${i.y} ${i.x} ${i.y} ${S.x} ${S.y}`
32
+ const M = c !== 0 ? Math.min((v ? t : 0) / c, h < r - 1 ? 0.5 : 1) : 0, X = v ? { x: d.x + n * M, y: d.y + i * M } : d, k = w !== 0 ? Math.min((v ? t : 0) / w, h > 1 ? 0.5 : 1) : 0, B = v ? { x: d.x + l * k, y: d.y + a * k } : d;
33
+ h > 0 && o.push(`L ${B.x} ${B.y}`), v && o.push(
34
+ `C ${d.x} ${d.y} ${d.x} ${d.y} ${X.x} ${X.y}`
35
35
  );
36
36
  });
37
37
  }
38
- return t.join(" ");
39
- }, N = () => {
40
- const r = document.createElementNS("http://www.w3.org/2000/svg", "svg");
41
- return r.style.pointerEvents = "none", r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.overflow = "visible", r;
38
+ return o.join(" ");
42
39
  }, I = () => {
43
- const r = document.createElementNS("http://www.w3.org/2000/svg", "g");
44
- return r.style.transformOrigin = "50% 50%", r;
45
- }, T = (r, e) => {
40
+ const e = document.createElementNS("http://www.w3.org/2000/svg", "svg");
41
+ return e.style.pointerEvents = "none", e.style.position = "absolute", e.style.top = "0", e.style.left = "0", e.style.overflow = "visible", e;
42
+ }, $ = () => {
43
+ const e = document.createElementNS("http://www.w3.org/2000/svg", "g");
44
+ return e.style.transformOrigin = "50% 50%", e;
45
+ }, m = (e, t) => {
46
+ const o = document.createElementNS("http://www.w3.org/2000/svg", "path");
47
+ return o.setAttribute("stroke", e), o.setAttribute("stroke-width", `${t}`), o.setAttribute("fill", "none"), o;
48
+ }, T = (e) => {
46
49
  const t = document.createElementNS("http://www.w3.org/2000/svg", "path");
47
- return t.setAttribute("stroke", r), t.setAttribute("stroke-width", `${e}`), t.setAttribute("fill", "none"), t;
48
- }, E = (r) => {
49
- const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
50
- return e.setAttribute("fill", r), e;
51
- };
52
- class O {
53
- constructor(e, t, s, n, o, h, i) {
54
- a(this, "svg", N());
55
- a(this, "group", I());
56
- a(this, "line");
57
- a(this, "sourceArrow", null);
58
- a(this, "targetArrow", null);
59
- this.curvature = s, this.arrowLength = n, this.arrowWidth = o, this.svg.appendChild(this.group), this.line = T(e, t), this.group.appendChild(this.line), h && (this.sourceArrow = E(e), this.group.appendChild(this.sourceArrow)), i && (this.targetArrow = E(e), this.group.appendChild(this.targetArrow));
60
- }
61
- update(e, t, s, n, o) {
62
- this.group.style.transform = `scale(${t}, ${s})`;
63
- const h = x(n, t, s), i = x(o, t, s), d = this.createLinePath(e, h, i);
64
- if (this.line.setAttribute("d", d), this.sourceArrow) {
65
- const c = f(
50
+ return t.setAttribute("fill", e), t;
51
+ }, b = (e, t) => {
52
+ const o = {
53
+ x: e.x + e.width / 2,
54
+ y: e.y + e.height / 2
55
+ }, r = {
56
+ x: t.x + t.width / 2,
57
+ y: t.y + t.height / 2
58
+ }, n = Math.min(o.x, r.x), i = Math.min(o.y, r.y), c = Math.abs(r.x - o.x), d = Math.abs(r.y - o.y), h = o.x <= r.x ? 1 : -1, l = o.y <= r.y ? 1 : -1;
59
+ return {
60
+ x: n,
61
+ y: i,
62
+ width: c,
63
+ height: d,
64
+ flipX: h,
65
+ flipY: l
66
+ };
67
+ }, J = (e) => {
68
+ const t = f(
69
+ { x: e.arrowLength, y: u.y },
70
+ e.fromVect,
71
+ u
72
+ ), o = f(
73
+ { x: e.to.x - e.arrowLength, y: e.to.y },
74
+ e.toVect,
75
+ e.to
76
+ ), r = {
77
+ x: t.x + e.fromVect.x * e.curvature,
78
+ y: t.y + e.fromVect.y * e.curvature
79
+ }, n = {
80
+ x: o.x - e.toVect.x * e.curvature,
81
+ y: o.y - e.toVect.y * e.curvature
82
+ }, i = `M ${t.x} ${t.y} C ${r.x} ${r.y}, ${n.x} ${n.y}, ${o.x} ${o.y}`, c = e.hasSourceArrow ? "" : `M ${u.x} ${u.y} L ${t.x} ${t.y} `, d = e.hasTargetArrow ? "" : ` M ${o.x} ${o.y} L ${e.to.x} ${e.to.y}`;
83
+ return `${c}${i}${d}`;
84
+ }, Q = (e) => {
85
+ const t = e.hasSourceArrow ? f(
86
+ { x: e.arrowLength, y: u.y },
87
+ e.fromVect,
88
+ u
89
+ ) : u, o = e.hasTargetArrow ? f(
90
+ { x: e.to.x - e.arrowLength, y: e.to.y },
91
+ e.toVect,
92
+ e.to
93
+ ) : e.to, r = e.arrowLength, n = Math.cos(e.detourDirection) * e.detourDistance, i = Math.sin(e.detourDirection) * e.detourDistance, c = n * e.flipX, d = i * e.flipY, h = f(
94
+ { x: r, y: u.y },
95
+ e.fromVect,
96
+ u
97
+ ), l = {
98
+ x: h.x + c,
99
+ y: h.y + d
100
+ }, a = f(
101
+ { x: e.to.x - r, y: e.to.y },
102
+ e.toVect,
103
+ e.to
104
+ ), w = {
105
+ x: a.x + c,
106
+ y: a.y + d
107
+ }, y = { x: (l.x + w.x) / 2, y: (l.y + w.y) / 2 }, x = {
108
+ x: h.x + e.curvature * e.fromVect.x,
109
+ y: h.y + e.curvature * e.fromVect.y
110
+ }, v = {
111
+ x: a.x - e.curvature * e.toVect.x,
112
+ y: a.y - e.curvature * e.toVect.y
113
+ }, p = {
114
+ x: h.x + c,
115
+ y: h.y + d
116
+ }, M = {
117
+ x: a.x + c,
118
+ y: a.y + d
119
+ };
120
+ return [
121
+ `M ${t.x} ${t.y}`,
122
+ `L ${h.x} ${h.y}`,
123
+ `C ${x.x} ${x.y} ${p.x} ${p.y} ${y.x} ${y.y}`,
124
+ `C ${M.x} ${M.y} ${v.x} ${v.y} ${a.x} ${a.y}`,
125
+ `L ${o.x} ${o.y}`
126
+ ].join(" ");
127
+ }, Z = (e) => {
128
+ const t = e.hasSourceArrow ? f(
129
+ { x: e.arrowLength, y: u.y },
130
+ e.fromVect,
131
+ u
132
+ ) : u, o = e.hasTargetArrow ? f(
133
+ { x: e.to.x - e.arrowLength, y: e.to.y },
134
+ e.toVect,
135
+ e.to
136
+ ) : e.to, r = e.arrowLength + e.arrowOffset, n = r - e.roundness, i = f({ x: n, y: u.y }, e.fromVect, u), c = f(
137
+ { x: e.to.x - n, y: e.to.y },
138
+ e.toVect,
139
+ e.to
140
+ ), d = Math.max((i.x + c.x) / 2, r), h = e.to.y / 2, l = { x: e.flipX > 0 ? d : -r, y: i.y }, a = { x: l.x, y: h }, w = {
141
+ x: e.flipX > 0 ? e.to.x - d : e.to.x + r,
142
+ y: c.y
143
+ }, y = { x: w.x, y: h };
144
+ return C(
145
+ [t, i, l, a, y, w, c, o],
146
+ e.roundness
147
+ );
148
+ }, R = (e) => {
149
+ const t = e.hasSourceArrow ? f(
150
+ { x: e.arrowLength, y: u.y },
151
+ e.fromVect,
152
+ u
153
+ ) : u, o = e.hasTargetArrow ? f(
154
+ { x: e.to.x - e.arrowLength, y: e.to.y },
155
+ e.toVect,
156
+ e.to
157
+ ) : e.to, r = e.arrowLength + e.arrowOffset, n = f(
158
+ { x: r, y: u.y },
159
+ e.fromVect,
160
+ u
161
+ ), i = Math.cos(e.detourDirection) * e.detourDistance, c = Math.sin(e.detourDirection) * e.detourDistance, d = i * e.flipX, h = c * e.flipY, l = { x: n.x + d, y: n.y + h }, a = f(
162
+ { x: e.to.x - r, y: e.to.y },
163
+ e.toVect,
164
+ e.to
165
+ ), w = { x: a.x + d, y: a.y + h };
166
+ return C(
167
+ [t, n, l, w, a, o],
168
+ e.roundness
169
+ );
170
+ }, q = (e) => {
171
+ const t = e.hasSourceArrow ? f(
172
+ { x: e.arrowLength, y: u.y },
173
+ e.fromVect,
174
+ u
175
+ ) : u, o = e.hasTargetArrow ? f(
176
+ { x: e.to.x - e.arrowLength, y: e.to.y },
177
+ e.toVect,
178
+ e.to
179
+ ) : e.to, r = e.arrowLength + e.arrowOffset, n = f({ x: r, y: u.y }, e.fromVect, u), i = f(
180
+ { x: e.to.x - r, y: e.to.y },
181
+ e.toVect,
182
+ e.to
183
+ );
184
+ return C([t, n, i, o], e.roundness);
185
+ }, tt = (e) => {
186
+ const t = e.hasSourceArrow ? f(
187
+ { x: e.arrowLength, y: u.y },
188
+ e.fromVect,
189
+ u
190
+ ) : u, o = e.hasTargetArrow ? f(
191
+ { x: e.to.x - e.arrowLength, y: e.to.y },
192
+ e.toVect,
193
+ e.to
194
+ ) : e.to, r = e.arrowLength + e.arrowOffset, n = r - e.roundness, i = f({ x: n, y: u.y }, e.fromVect, u), c = f(
195
+ { x: e.to.x - n, y: e.to.y },
196
+ e.toVect,
197
+ e.to
198
+ ), d = Math.max((i.y + c.y) / 2, r), h = e.to.x / 2, l = { x: i.x, y: e.flipY > 0 ? d : -r }, a = { x: h, y: l.y }, w = {
199
+ x: c.x,
200
+ y: e.flipY > 0 ? e.to.y - d : e.to.y + r
201
+ }, y = { x: h, y: w.y };
202
+ return C(
203
+ [t, i, l, a, y, w, c, o],
204
+ e.roundness
205
+ );
206
+ }, Y = (e) => {
207
+ const t = e.arrowOffset, o = e.side, r = e.arrowLength + t, n = r + 2 * o, c = [
208
+ { x: e.arrowLength, y: u.y },
209
+ { x: r, y: u.y },
210
+ { x: r, y: e.side },
211
+ { x: n, y: e.side },
212
+ { x: n, y: -e.side },
213
+ { x: r, y: -e.side },
214
+ { x: r, y: u.y },
215
+ { x: e.arrowLength, y: u.y }
216
+ ].map(
217
+ (h) => f(h, e.fromVect, u)
218
+ ), d = `M ${u.x} ${u.y} L ${c[0].x} ${c[0].y} `;
219
+ return `${e.hasSourceArrow || e.hasTargetArrow ? "" : d}${C(c, e.roundness)}`;
220
+ }, et = (e) => {
221
+ const t = e.smallRadius, o = e.radius, r = Math.sqrt(t * t + o * o), n = t + o, i = e.arrowLength + r * (1 - o / n), c = t * o / n, h = [
222
+ { x: e.arrowLength, y: u.y },
223
+ { x: i, y: c },
224
+ { x: i, y: -c }
225
+ ].map((w) => f(w, e.fromVect, u)), l = [
226
+ `M ${h[0].x} ${h[0].y}`,
227
+ `A ${t} ${t} 0 0 1 ${h[1].x} ${h[1].y}`,
228
+ `A ${o} ${o} 0 1 0 ${h[2].x} ${h[2].y}`,
229
+ `A ${t} ${t} 0 0 1 ${h[0].x} ${h[0].y}`
230
+ ].join(" "), a = `M 0 0 L ${h[0].x} ${h[0].y} `;
231
+ return `${e.hasSourceArrow || e.hasTargetArrow ? "" : a}${l}`;
232
+ }, g = Object.freeze({
233
+ color: "#5c5c5c",
234
+ width: 1,
235
+ arrowLength: 15,
236
+ arrowWidth: 4,
237
+ arrowOffset: 15,
238
+ hasSourceArrow: !1,
239
+ hasTargetArrow: !1,
240
+ cycleRadius: 30,
241
+ cycleSquareSide: 30,
242
+ roundness: 10,
243
+ detourDistance: 100,
244
+ detourDirection: -Math.PI / 2,
245
+ detourDirectionVertical: 0,
246
+ smallCycleRadius: 15,
247
+ curvature: 90
248
+ });
249
+ class ot {
250
+ constructor(t) {
251
+ s(this, "svg", I());
252
+ s(this, "group", $());
253
+ s(this, "line");
254
+ s(this, "sourceArrow", null);
255
+ s(this, "targetArrow", null);
256
+ s(this, "arrowLength");
257
+ s(this, "arrowWidth");
258
+ s(this, "curvature");
259
+ s(this, "portCycleRadius");
260
+ s(this, "portCycleSmallRadius");
261
+ s(this, "detourDirection");
262
+ s(this, "detourDistance");
263
+ s(this, "hasSourceArrow");
264
+ s(this, "hasTargetArrow");
265
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? g.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? g.arrowWidth, this.curvature = (t == null ? void 0 : t.curvature) ?? g.curvature, this.portCycleRadius = (t == null ? void 0 : t.cycleRadius) ?? g.cycleRadius, this.portCycleSmallRadius = (t == null ? void 0 : t.smallCycleRadius) ?? g.smallCycleRadius, this.detourDirection = (t == null ? void 0 : t.detourDirection) ?? g.detourDirection, this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? g.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? g.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? g.hasTargetArrow;
266
+ const o = (t == null ? void 0 : t.color) ?? g.color, r = (t == null ? void 0 : t.width) ?? g.width;
267
+ this.svg.appendChild(this.group), this.line = m(o, r), this.group.appendChild(this.line), this.hasSourceArrow && (this.sourceArrow = T(o), this.group.appendChild(this.sourceArrow)), this.hasTargetArrow && (this.targetArrow = T(o), this.group.appendChild(this.targetArrow));
268
+ }
269
+ render(t) {
270
+ const { x: o, y: r, width: n, height: i, flipX: c, flipY: d } = b(
271
+ t.source,
272
+ t.target
273
+ );
274
+ this.svg.style.transform = `translate(${o}px, ${r}px)`, this.svg.style.width = `${n}px`, this.svg.style.height = `${i}px`, this.group.style.transform = `scale(${c}, ${d})`;
275
+ const h = A(
276
+ t.source.direction,
277
+ c,
278
+ d
279
+ ), l = A(
280
+ t.target.direction,
281
+ c,
282
+ d
283
+ ), a = {
284
+ x: n,
285
+ y: i
286
+ };
287
+ let w, y = l, x = -this.arrowLength;
288
+ if (t.source.portId === t.target.portId ? (w = et({
289
+ fromVect: h,
290
+ radius: this.portCycleRadius,
291
+ smallRadius: this.portCycleSmallRadius,
292
+ arrowLength: this.arrowLength,
293
+ hasSourceArrow: this.hasSourceArrow,
294
+ hasTargetArrow: this.hasTargetArrow
295
+ }), y = h, x = this.arrowLength) : t.source.nodeId === t.target.nodeId ? w = Q({
296
+ to: a,
297
+ fromVect: h,
298
+ toVect: l,
299
+ flipX: c,
300
+ flipY: d,
301
+ arrowLength: this.arrowLength,
302
+ detourDirection: this.detourDirection,
303
+ detourDistance: this.detourDistance,
304
+ curvature: this.curvature,
305
+ hasSourceArrow: this.hasSourceArrow,
306
+ hasTargetArrow: this.hasTargetArrow
307
+ }) : w = J({
308
+ to: a,
309
+ fromVect: h,
310
+ toVect: l,
311
+ arrowLength: this.arrowLength,
312
+ curvature: this.curvature,
313
+ hasSourceArrow: this.hasSourceArrow,
314
+ hasTargetArrow: this.hasTargetArrow
315
+ }), this.line.setAttribute("d", w), this.sourceArrow) {
316
+ const v = E(
66
317
  h,
67
- l,
318
+ u,
68
319
  this.arrowLength,
69
320
  this.arrowWidth
70
321
  );
71
- this.sourceArrow.setAttribute("d", c);
322
+ this.sourceArrow.setAttribute("d", v);
72
323
  }
73
324
  if (this.targetArrow) {
74
- const c = f(
75
- i,
76
- e,
77
- -this.arrowLength,
325
+ const v = E(
326
+ y,
327
+ a,
328
+ x,
78
329
  this.arrowWidth
79
330
  );
80
- this.targetArrow.setAttribute("d", c);
331
+ this.targetArrow.setAttribute("d", v);
81
332
  }
82
333
  }
83
- createLinePath(e, t, s) {
84
- const n = v(
85
- { x: this.arrowLength, y: l.y },
86
- t,
87
- l
88
- ), o = v(
89
- { x: e.x - this.arrowLength, y: e.y },
90
- s,
91
- e
92
- ), h = {
93
- x: n.x + t.x * this.curvature,
94
- y: n.y + t.y * this.curvature
95
- }, i = {
96
- x: o.x - s.x * this.curvature,
97
- y: o.y - s.y * this.curvature
98
- }, d = `M ${n.x} ${n.y} C ${h.x} ${h.y}, ${i.x} ${i.y}, ${o.x} ${o.y}`, c = this.sourceArrow ? "" : `M ${l.x} ${l.y} L ${n.x} ${n.y} `, u = this.targetArrow ? "" : ` M ${o.x} ${o.y} L ${e.x} ${e.y}`;
99
- return `${c}${d}${u}`;
100
- }
101
334
  }
102
- class q {
103
- constructor(e, t, s, n, o, h, i, d) {
104
- a(this, "svg", N());
105
- a(this, "group", I());
106
- a(this, "line");
107
- a(this, "sourceArrow", null);
108
- a(this, "targetArrow", null);
109
- this.arrowLength = s, this.arrowWidth = n, this.arrowOffset = o, this.roundness = d, this.svg.appendChild(this.group), this.line = T(e, t), this.group.appendChild(this.line), h && (this.sourceArrow = E(e), this.group.appendChild(this.sourceArrow)), i && (this.targetArrow = E(e), this.group.appendChild(this.targetArrow));
110
- }
111
- update(e, t, s, n, o) {
112
- this.group.style.transform = `scale(${t}, ${s})`;
113
- const h = x(n, t, s), i = x(o, t, s), d = this.createLinePath(e, h, i);
114
- if (this.line.setAttribute("d", d), this.sourceArrow) {
115
- const c = f(
335
+ class rt {
336
+ constructor(t) {
337
+ s(this, "svg", I());
338
+ s(this, "group", $());
339
+ s(this, "line");
340
+ s(this, "sourceArrow", null);
341
+ s(this, "targetArrow", null);
342
+ s(this, "arrowLength");
343
+ s(this, "arrowWidth");
344
+ s(this, "arrowOffset");
345
+ s(this, "roundness");
346
+ s(this, "cycleSquareSide");
347
+ s(this, "detourDirection");
348
+ s(this, "detourDistance");
349
+ s(this, "hasSourceArrow");
350
+ s(this, "hasTargetArrow");
351
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? g.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? g.arrowWidth, this.arrowOffset = (t == null ? void 0 : t.arrowOffset) ?? g.arrowOffset, this.cycleSquareSide = (t == null ? void 0 : t.cycleSquareSide) ?? g.cycleSquareSide;
352
+ const o = (t == null ? void 0 : t.roundness) ?? g.roundness;
353
+ this.roundness = Math.min(
354
+ o,
355
+ this.arrowOffset,
356
+ this.cycleSquareSide / 2
357
+ ), this.detourDirection = (t == null ? void 0 : t.detourDirection) ?? g.detourDirection, this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? g.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? g.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? g.hasTargetArrow;
358
+ const r = (t == null ? void 0 : t.color) ?? g.color, n = (t == null ? void 0 : t.width) ?? g.width;
359
+ this.svg.appendChild(this.group), this.line = m(r, n), this.group.appendChild(this.line), this.hasSourceArrow && (this.sourceArrow = T(r), this.group.appendChild(this.sourceArrow)), this.hasTargetArrow && (this.targetArrow = T(r), this.group.appendChild(this.targetArrow));
360
+ }
361
+ render(t) {
362
+ const { x: o, y: r, width: n, height: i, flipX: c, flipY: d } = b(
363
+ t.source,
364
+ t.target
365
+ );
366
+ this.svg.style.transform = `translate(${o}px, ${r}px)`, this.svg.style.width = `${n}px`, this.svg.style.height = `${i}px`, this.group.style.transform = `scale(${c}, ${d})`;
367
+ const h = A(
368
+ t.source.direction,
369
+ c,
370
+ d
371
+ ), l = A(
372
+ t.target.direction,
373
+ c,
374
+ d
375
+ ), a = {
376
+ x: n,
377
+ y: i
378
+ };
379
+ let w, y = l, x = -this.arrowLength;
380
+ if (t.source.portId === t.target.portId ? (w = Y({
381
+ fromVect: h,
382
+ arrowLength: this.arrowLength,
383
+ side: this.cycleSquareSide,
384
+ arrowOffset: this.arrowOffset,
385
+ roundness: this.roundness,
386
+ hasSourceArrow: this.hasSourceArrow,
387
+ hasTargetArrow: this.hasTargetArrow
388
+ }), y = h, x = this.arrowLength) : t.source.nodeId === t.target.nodeId ? w = R({
389
+ to: a,
390
+ fromVect: h,
391
+ toVect: l,
392
+ flipX: c,
393
+ flipY: d,
394
+ arrowLength: this.arrowLength,
395
+ arrowOffset: this.arrowOffset,
396
+ roundness: this.roundness,
397
+ detourDirection: this.detourDirection,
398
+ detourDistance: this.detourDistance,
399
+ hasSourceArrow: this.hasSourceArrow,
400
+ hasTargetArrow: this.hasTargetArrow
401
+ }) : w = Z({
402
+ to: a,
403
+ fromVect: h,
404
+ toVect: l,
405
+ flipX: c,
406
+ arrowLength: this.arrowLength,
407
+ arrowOffset: this.arrowOffset,
408
+ roundness: this.roundness,
409
+ hasSourceArrow: this.hasSourceArrow,
410
+ hasTargetArrow: this.hasTargetArrow
411
+ }), this.line.setAttribute("d", w), this.sourceArrow) {
412
+ const v = E(
116
413
  h,
117
- l,
414
+ u,
118
415
  this.arrowLength,
119
416
  this.arrowWidth
120
417
  );
121
- this.sourceArrow.setAttribute("d", c);
418
+ this.sourceArrow.setAttribute("d", v);
122
419
  }
123
420
  if (this.targetArrow) {
124
- const c = f(
125
- i,
126
- e,
127
- -this.arrowLength,
421
+ const v = E(
422
+ y,
423
+ a,
424
+ x,
128
425
  this.arrowWidth
129
426
  );
130
- this.targetArrow.setAttribute("d", c);
427
+ this.targetArrow.setAttribute("d", v);
131
428
  }
132
429
  }
133
- createLinePath(e, t, s) {
134
- const n = this.sourceArrow ? v({ x: this.arrowLength, y: l.y }, t, l) : l, o = this.targetArrow ? v({ x: e.x - this.arrowLength, y: e.y }, s, e) : e, h = this.arrowLength + this.arrowOffset, i = v({ x: h, y: l.y }, t, l), d = v({ x: e.x - h, y: e.y }, s, e);
135
- return W([n, i, d, o], this.roundness);
136
- }
137
430
  }
138
- class ee {
139
- constructor(e, t, s, n, o, h, i, d) {
140
- a(this, "svg", N());
141
- a(this, "group", I());
142
- a(this, "line");
143
- a(this, "sourceArrow", null);
144
- a(this, "targetArrow", null);
145
- this.arrowLength = s, this.arrowWidth = n, this.arrowOffset = o, this.roundness = d, this.svg.appendChild(this.group), this.line = T(e, t), this.group.appendChild(this.line), h && (this.sourceArrow = E(e), this.group.appendChild(this.sourceArrow)), i && (this.targetArrow = E(e), this.group.appendChild(this.targetArrow));
146
- }
147
- update(e, t, s, n, o) {
148
- this.group.style.transform = `scale(${t}, ${s})`;
149
- const h = x(n, t, s), i = x(o, t, s), d = this.createLinePath(e, h, i, t);
150
- if (this.line.setAttribute("d", d), this.sourceArrow) {
151
- const c = f(
152
- h,
153
- l,
154
- this.arrowLength,
155
- this.arrowWidth
156
- );
157
- this.sourceArrow.setAttribute("d", c);
158
- }
159
- if (this.targetArrow) {
160
- const c = f(
161
- i,
162
- e,
163
- -this.arrowLength,
164
- this.arrowWidth
165
- );
166
- this.targetArrow.setAttribute("d", c);
167
- }
168
- }
169
- createLinePath(e, t, s, n) {
170
- const o = this.sourceArrow ? v({ x: this.arrowLength, y: l.y }, t, l) : l, h = this.targetArrow ? v({ x: e.x - this.arrowLength, y: e.y }, s, e) : e, i = this.arrowLength + this.arrowOffset, d = i - this.roundness, c = v({ x: d, y: l.y }, t, l), u = v({ x: e.x - d, y: e.y }, s, e), w = Math.max((c.x + u.x) / 2, i), m = e.y / 2, y = { x: n > 0 ? w : -i, y: c.y }, p = { x: y.x, y: m }, M = { x: n > 0 ? e.x - w : e.x + i, y: u.y }, P = { x: M.x, y: m };
171
- return W(
172
- [o, c, y, p, P, M, u, h],
173
- this.roundness
431
+ class it {
432
+ constructor(t) {
433
+ s(this, "svg", I());
434
+ s(this, "group", $());
435
+ s(this, "line");
436
+ s(this, "sourceArrow", null);
437
+ s(this, "targetArrow", null);
438
+ s(this, "arrowLength");
439
+ s(this, "arrowWidth");
440
+ s(this, "arrowOffset");
441
+ s(this, "roundness");
442
+ s(this, "cycleSquareSide");
443
+ s(this, "detourDirection");
444
+ s(this, "detourDistance");
445
+ s(this, "hasSourceArrow");
446
+ s(this, "hasTargetArrow");
447
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? g.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? g.arrowWidth, this.arrowOffset = (t == null ? void 0 : t.arrowOffset) ?? g.arrowOffset, this.cycleSquareSide = (t == null ? void 0 : t.cycleSquareSide) ?? g.cycleSquareSide;
448
+ const o = (t == null ? void 0 : t.roundness) ?? g.roundness;
449
+ this.roundness = Math.min(
450
+ o,
451
+ this.arrowOffset,
452
+ this.cycleSquareSide / 2
453
+ ), this.detourDirection = (t == null ? void 0 : t.detourDirection) ?? g.detourDirection, this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? g.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? g.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? g.hasTargetArrow;
454
+ const r = (t == null ? void 0 : t.color) ?? g.color, n = (t == null ? void 0 : t.width) ?? g.width;
455
+ this.svg.appendChild(this.group), this.line = m(r, n), this.group.appendChild(this.line), this.hasSourceArrow && (this.sourceArrow = T(r), this.group.appendChild(this.sourceArrow)), this.hasTargetArrow && (this.targetArrow = T(r), this.group.appendChild(this.targetArrow));
456
+ }
457
+ render(t) {
458
+ const { x: o, y: r, width: n, height: i, flipX: c, flipY: d } = b(
459
+ t.source,
460
+ t.target
174
461
  );
175
- }
176
- }
177
- class te {
178
- constructor(e, t, s, n, o, h, i, d) {
179
- a(this, "svg", N());
180
- a(this, "group", I());
181
- a(this, "line");
182
- a(this, "sourceArrow", null);
183
- a(this, "targetArrow", null);
184
- this.arrowLength = s, this.arrowWidth = n, this.arrowOffset = o, this.roundness = d, this.svg.appendChild(this.group), this.line = T(e, t), this.group.appendChild(this.line), h && (this.sourceArrow = E(e), this.group.appendChild(this.sourceArrow)), i && (this.targetArrow = E(e), this.group.appendChild(this.targetArrow));
185
- }
186
- update(e, t, s, n, o) {
187
- this.group.style.transform = `scale(${t}, ${s})`;
188
- const h = x(n, t, s), i = x(o, t, s), d = this.createLinePath(e, h, i, s);
189
- if (this.line.setAttribute("d", d), this.sourceArrow) {
190
- const c = f(
462
+ this.svg.style.transform = `translate(${o}px, ${r}px)`, this.svg.style.width = `${n}px`, this.svg.style.height = `${i}px`, this.group.style.transform = `scale(${c}, ${d})`;
463
+ const h = A(
464
+ t.source.direction,
465
+ c,
466
+ d
467
+ ), l = A(
468
+ t.target.direction,
469
+ c,
470
+ d
471
+ ), a = {
472
+ x: n,
473
+ y: i
474
+ };
475
+ let w, y = l, x = -this.arrowLength;
476
+ if (t.source.portId === t.target.portId ? (w = Y({
477
+ fromVect: h,
478
+ arrowLength: this.arrowLength,
479
+ side: this.cycleSquareSide,
480
+ arrowOffset: this.arrowOffset,
481
+ roundness: this.roundness,
482
+ hasSourceArrow: this.hasSourceArrow,
483
+ hasTargetArrow: this.hasTargetArrow
484
+ }), y = h, x = this.arrowLength) : t.source.nodeId === t.target.nodeId ? w = R({
485
+ to: a,
486
+ fromVect: h,
487
+ toVect: l,
488
+ flipX: c,
489
+ flipY: d,
490
+ arrowLength: this.arrowLength,
491
+ arrowOffset: this.arrowOffset,
492
+ roundness: this.roundness,
493
+ detourDirection: this.detourDirection,
494
+ detourDistance: this.detourDistance,
495
+ hasSourceArrow: this.hasSourceArrow,
496
+ hasTargetArrow: this.hasTargetArrow
497
+ }) : w = q({
498
+ to: a,
499
+ fromVect: h,
500
+ toVect: l,
501
+ arrowLength: this.arrowLength,
502
+ arrowOffset: this.arrowOffset,
503
+ roundness: this.roundness,
504
+ hasSourceArrow: this.hasSourceArrow,
505
+ hasTargetArrow: this.hasTargetArrow
506
+ }), this.line.setAttribute("d", w), this.sourceArrow) {
507
+ const v = E(
191
508
  h,
192
- l,
509
+ u,
193
510
  this.arrowLength,
194
511
  this.arrowWidth
195
512
  );
196
- this.sourceArrow.setAttribute("d", c);
513
+ this.sourceArrow.setAttribute("d", v);
197
514
  }
198
515
  if (this.targetArrow) {
199
- const c = f(
200
- i,
201
- e,
202
- -this.arrowLength,
203
- this.arrowWidth
204
- );
205
- this.targetArrow.setAttribute("d", c);
206
- }
207
- }
208
- createLinePath(e, t, s, n) {
209
- const o = this.sourceArrow ? v({ x: this.arrowLength, y: l.y }, t, l) : l, h = this.targetArrow ? v({ x: e.x - this.arrowLength, y: e.y }, s, e) : e, i = this.arrowLength + this.arrowOffset, d = i - this.roundness, c = v({ x: d, y: l.y }, t, l), u = v({ x: e.x - d, y: e.y }, s, e), w = Math.max((c.y + u.y) / 2, i), m = e.x / 2, y = { x: c.x, y: n > 0 ? w : -i }, p = { x: m, y: y.y }, M = {
210
- x: u.x,
211
- y: n > 0 ? e.y - w : e.y + i
212
- }, P = { x: m, y: M.y };
213
- return W(
214
- [o, c, y, p, P, M, u, h],
215
- this.roundness
216
- );
217
- }
218
- }
219
- class re {
220
- constructor(e, t, s, n, o, h, i) {
221
- a(this, "svg", N());
222
- a(this, "line");
223
- a(this, "arrow", null);
224
- this.arrowLength = s, this.arrowWidth = n, this.radius = h, this.smallRadius = i, this.line = T(e, t), this.svg.appendChild(this.line), o && (this.arrow = E(e), this.svg.appendChild(this.arrow));
225
- }
226
- update(e, t, s, n) {
227
- const o = x(n, t, s), h = this.createLinePath(o);
228
- if (this.line.setAttribute("d", h), this.arrow) {
229
- const i = f(
230
- o,
231
- l,
232
- this.arrowLength,
516
+ const v = E(
517
+ y,
518
+ a,
519
+ x,
233
520
  this.arrowWidth
234
521
  );
235
- this.arrow.setAttribute("d", i);
522
+ this.targetArrow.setAttribute("d", v);
236
523
  }
237
524
  }
238
- createLinePath(e) {
239
- const t = this.smallRadius, s = this.radius, n = Math.sqrt(t * t + s * s), o = t + s, h = this.arrowLength + n * (1 - s / o), i = t * s / o, c = [
240
- { x: this.arrowLength, y: l.y },
241
- { x: h, y: i },
242
- { x: h, y: -i }
243
- ].map((m) => v(m, e, l)), u = [
244
- `M ${c[0].x} ${c[0].y}`,
245
- `A ${t} ${t} 0 0 1 ${c[1].x} ${c[1].y}`,
246
- `A ${s} ${s} 0 1 0 ${c[2].x} ${c[2].y}`,
247
- `A ${t} ${t} 0 0 1 ${c[0].x} ${c[0].y}`
248
- ].join(" "), w = `M 0 0 L ${c[0].x} ${c[0].y} `;
249
- return `${this.arrow !== null ? "" : w}${u}`;
250
- }
251
525
  }
252
- class X {
253
- constructor(e, t, s, n, o, h, i, d) {
254
- a(this, "svg", N());
255
- a(this, "line");
256
- a(this, "arrow", null);
257
- a(this, "roundness");
258
- a(this, "linePoints");
259
- this.arrowLength = s, this.arrowWidth = n, this.side = h, this.minPortOffset = i, this.roundness = Math.min(d, this.minPortOffset, this.side / 2), this.line = T(e, t), this.svg.appendChild(this.line), o && (this.arrow = E(e), this.svg.appendChild(this.arrow));
260
- const c = this.minPortOffset, u = this.side, w = this.arrowLength + c, m = w + 2 * u;
261
- this.linePoints = [
262
- { x: this.arrowLength, y: l.y },
263
- { x: w, y: l.y },
264
- { x: w, y: this.side },
265
- { x: m, y: this.side },
266
- { x: m, y: -this.side },
267
- { x: w, y: -this.side },
268
- { x: w, y: l.y },
269
- { x: this.arrowLength, y: l.y }
270
- ];
271
- }
272
- update(e, t, s, n) {
273
- const o = x(n, t, s), h = this.createLinePath(o);
274
- if (this.line.setAttribute("d", h), this.arrow) {
275
- const i = f(
276
- o,
277
- l,
278
- this.arrowLength,
279
- this.arrowWidth
280
- );
281
- this.arrow.setAttribute("d", i);
282
- }
283
- }
284
- createLinePath(e) {
285
- const t = this.linePoints.map(
286
- (n) => v(n, e, l)
287
- ), s = `M ${l.x} ${l.y} L ${t[0].x} ${t[0].y} `;
288
- return `${this.arrow ? "" : s}${W(t, this.roundness)}`;
289
- }
290
- }
291
- class se {
292
- constructor(e, t, s, n, o, h, i, d, c) {
293
- a(this, "svg", N());
294
- a(this, "group", I());
295
- a(this, "line");
296
- a(this, "sourceArrow", null);
297
- a(this, "targetArrow", null);
298
- a(this, "detourX");
299
- a(this, "detourY");
300
- this.curvature = s, this.arrowLength = n, this.arrowWidth = o, this.detourX = Math.cos(c) * d, this.detourY = Math.sin(c) * d, this.svg.appendChild(this.group), this.line = T(e, t), this.group.appendChild(this.line), h && (this.sourceArrow = E(e), this.group.appendChild(this.sourceArrow)), i && (this.targetArrow = E(e), this.group.appendChild(this.targetArrow));
301
- }
302
- update(e, t, s, n, o) {
303
- this.group.style.transform = `scale(${t}, ${s})`;
304
- const h = x(n, t, s), i = x(o, t, s), d = this.createLinePath(e, h, i, t, s);
305
- if (this.line.setAttribute("d", d), this.sourceArrow) {
306
- const c = f(
307
- h,
308
- l,
309
- this.arrowLength,
310
- this.arrowWidth
311
- );
312
- this.sourceArrow.setAttribute("d", c);
313
- }
314
- if (this.targetArrow) {
315
- const c = f(
316
- i,
317
- e,
318
- -this.arrowLength,
319
- this.arrowWidth
320
- );
321
- this.targetArrow.setAttribute("d", c);
322
- }
323
- }
324
- createLinePath(e, t, s, n, o) {
325
- const h = this.sourceArrow ? v({ x: this.arrowLength, y: l.y }, t, l) : l, i = this.targetArrow ? v({ x: e.x - this.arrowLength, y: e.y }, s, e) : e, d = this.arrowLength, c = this.detourX * n, u = this.detourY * o, w = v(
326
- { x: d, y: l.y },
327
- t,
328
- l
329
- ), m = {
330
- x: w.x + c,
331
- y: w.y + u
332
- }, y = v(
333
- { x: e.x - d, y: e.y },
334
- s,
335
- e
336
- ), p = {
337
- x: y.x + c,
338
- y: y.y + u
339
- }, M = { x: (m.x + p.x) / 2, y: (m.y + p.y) / 2 }, P = {
340
- x: w.x + this.curvature * t.x,
341
- y: w.y + this.curvature * t.y
342
- }, S = {
343
- x: y.x - this.curvature * s.x,
344
- y: y.y - this.curvature * s.y
345
- }, b = {
346
- x: w.x + c,
347
- y: w.y + u
348
- }, L = {
349
- x: y.x + c,
350
- y: y.y + u
526
+ class nt {
527
+ constructor(t) {
528
+ s(this, "svg", I());
529
+ s(this, "group", $());
530
+ s(this, "line");
531
+ s(this, "sourceArrow", null);
532
+ s(this, "targetArrow", null);
533
+ s(this, "arrowLength");
534
+ s(this, "arrowWidth");
535
+ s(this, "arrowOffset");
536
+ s(this, "roundness");
537
+ s(this, "cycleSquareSide");
538
+ s(this, "detourDirection");
539
+ s(this, "detourDistance");
540
+ s(this, "hasSourceArrow");
541
+ s(this, "hasTargetArrow");
542
+ this.arrowLength = (t == null ? void 0 : t.arrowLength) ?? g.arrowLength, this.arrowWidth = (t == null ? void 0 : t.arrowWidth) ?? g.arrowWidth, this.arrowOffset = (t == null ? void 0 : t.arrowOffset) ?? g.arrowOffset, this.cycleSquareSide = (t == null ? void 0 : t.cycleSquareSide) ?? g.cycleSquareSide;
543
+ const o = (t == null ? void 0 : t.roundness) ?? g.roundness;
544
+ this.roundness = Math.min(
545
+ o,
546
+ this.arrowOffset,
547
+ this.cycleSquareSide / 2
548
+ ), this.detourDirection = (t == null ? void 0 : t.detourDirection) ?? g.detourDirectionVertical, this.detourDistance = (t == null ? void 0 : t.detourDistance) ?? g.detourDistance, this.hasSourceArrow = (t == null ? void 0 : t.hasSourceArrow) ?? g.hasSourceArrow, this.hasTargetArrow = (t == null ? void 0 : t.hasTargetArrow) ?? g.hasTargetArrow;
549
+ const r = (t == null ? void 0 : t.color) ?? g.color, n = (t == null ? void 0 : t.width) ?? g.width;
550
+ this.svg.appendChild(this.group), this.line = m(r, n), this.group.appendChild(this.line), this.hasSourceArrow && (this.sourceArrow = T(r), this.group.appendChild(this.sourceArrow)), this.hasTargetArrow && (this.targetArrow = T(r), this.group.appendChild(this.targetArrow));
551
+ }
552
+ render(t) {
553
+ const { x: o, y: r, width: n, height: i, flipX: c, flipY: d } = b(
554
+ t.source,
555
+ t.target
556
+ );
557
+ this.svg.style.transform = `translate(${o}px, ${r}px)`, this.svg.style.width = `${n}px`, this.svg.style.height = `${i}px`, this.group.style.transform = `scale(${c}, ${d})`;
558
+ const h = A(
559
+ t.source.direction,
560
+ c,
561
+ d
562
+ ), l = A(
563
+ t.target.direction,
564
+ c,
565
+ d
566
+ ), a = {
567
+ x: n,
568
+ y: i
351
569
  };
352
- return [
353
- `M ${h.x} ${h.y}`,
354
- `L ${w.x} ${w.y}`,
355
- `C ${P.x} ${P.y} ${b.x} ${b.y} ${M.x} ${M.y}`,
356
- `C ${L.x} ${L.y} ${S.x} ${S.y} ${y.x} ${y.y}`,
357
- `L ${i.x} ${i.y}`
358
- ].join(" ");
359
- }
360
- }
361
- class G {
362
- constructor(e, t, s, n, o, h, i, d, c, u) {
363
- a(this, "svg", N());
364
- a(this, "group", I());
365
- a(this, "line");
366
- a(this, "sourceArrow", null);
367
- a(this, "targetArrow", null);
368
- a(this, "detourX");
369
- a(this, "detourY");
370
- this.arrowLength = s, this.arrowWidth = n, this.arrowOffset = o, this.roundness = d, this.detourX = Math.cos(u) * c, this.detourY = Math.sin(u) * c, this.svg.appendChild(this.group), this.line = T(e, t), this.group.appendChild(this.line), h && (this.sourceArrow = E(e), this.group.appendChild(this.sourceArrow)), i && (this.targetArrow = E(e), this.group.appendChild(this.targetArrow));
371
- }
372
- update(e, t, s, n, o) {
373
- this.group.style.transform = `scale(${t}, ${s})`;
374
- const h = x(n, t, s), i = x(o, t, s), d = this.createLinePath(e, h, i, t, s);
375
- if (this.line.setAttribute("d", d), this.sourceArrow) {
376
- const c = f(
570
+ let w, y = l, x = -this.arrowLength;
571
+ if (t.source.portId === t.target.portId ? (w = Y({
572
+ fromVect: h,
573
+ arrowLength: this.arrowLength,
574
+ side: this.cycleSquareSide,
575
+ arrowOffset: this.arrowOffset,
576
+ roundness: this.roundness,
577
+ hasSourceArrow: this.hasSourceArrow,
578
+ hasTargetArrow: this.hasTargetArrow
579
+ }), y = h, x = this.arrowLength) : t.source.nodeId === t.target.nodeId ? w = R({
580
+ to: a,
581
+ fromVect: h,
582
+ toVect: l,
583
+ flipX: c,
584
+ flipY: d,
585
+ arrowLength: this.arrowLength,
586
+ arrowOffset: this.arrowOffset,
587
+ roundness: this.roundness,
588
+ detourDirection: this.detourDirection,
589
+ detourDistance: this.detourDistance,
590
+ hasSourceArrow: this.hasSourceArrow,
591
+ hasTargetArrow: this.hasTargetArrow
592
+ }) : w = tt({
593
+ to: a,
594
+ fromVect: h,
595
+ toVect: l,
596
+ flipY: d,
597
+ arrowLength: this.arrowLength,
598
+ arrowOffset: this.arrowOffset,
599
+ roundness: this.roundness,
600
+ hasSourceArrow: this.hasSourceArrow,
601
+ hasTargetArrow: this.hasTargetArrow
602
+ }), this.line.setAttribute("d", w), this.sourceArrow) {
603
+ const v = E(
377
604
  h,
378
- l,
605
+ u,
379
606
  this.arrowLength,
380
607
  this.arrowWidth
381
608
  );
382
- this.sourceArrow.setAttribute("d", c);
609
+ this.sourceArrow.setAttribute("d", v);
383
610
  }
384
611
  if (this.targetArrow) {
385
- const c = f(
386
- i,
387
- e,
388
- -this.arrowLength,
612
+ const v = E(
613
+ y,
614
+ a,
615
+ x,
389
616
  this.arrowWidth
390
617
  );
391
- this.targetArrow.setAttribute("d", c);
618
+ this.targetArrow.setAttribute("d", v);
392
619
  }
393
620
  }
394
- createLinePath(e, t, s, n, o) {
395
- const h = this.sourceArrow ? v({ x: this.arrowLength, y: l.y }, t, l) : l, i = this.targetArrow ? v({ x: e.x - this.arrowLength, y: e.y }, s, e) : e, d = this.arrowLength + this.arrowOffset, c = v(
396
- { x: d, y: l.y },
397
- t,
398
- l
399
- ), u = this.detourX * n, w = this.detourY * o, m = { x: c.x + u, y: c.y + w }, y = v(
400
- { x: e.x - d, y: e.y },
401
- s,
402
- e
403
- ), p = { x: y.x + u, y: y.y + w };
404
- return W(
405
- [h, c, m, p, y, i],
406
- this.roundness
407
- );
408
- }
409
621
  }
410
- var C = /* @__PURE__ */ ((r) => (r.Regular = "regular", r.PortCycle = "port-cycle", r.NodeCycle = "node-cycle", r))(C || {});
411
- const oe = (r) => (e) => e === C.PortCycle ? new re(
412
- r.color,
413
- r.width,
414
- r.arrowLength,
415
- r.arrowWidth,
416
- r.hasSourceArrow || r.hasTargetArrow,
417
- r.cycleRadius,
418
- r.smallCycleRadius
419
- ) : e === C.NodeCycle ? new se(
420
- r.color,
421
- r.width,
422
- r.curvature,
423
- r.arrowLength,
424
- r.arrowWidth,
425
- r.hasSourceArrow,
426
- r.hasTargetArrow,
427
- r.detourDistance,
428
- r.detourDirection
429
- ) : new O(
430
- r.color,
431
- r.width,
432
- r.curvature,
433
- r.arrowLength,
434
- r.arrowWidth,
435
- r.hasSourceArrow,
436
- r.hasTargetArrow
437
- ), ne = (r) => (e) => e === C.PortCycle ? new X(
438
- r.color,
439
- r.width,
440
- r.arrowLength,
441
- r.arrowWidth,
442
- r.hasSourceArrow || r.hasTargetArrow,
443
- r.cycleSquareSide,
444
- r.arrowOffset,
445
- r.roundness
446
- ) : e === C.NodeCycle ? new G(
447
- r.color,
448
- r.width,
449
- r.arrowLength,
450
- r.arrowWidth,
451
- r.arrowOffset,
452
- r.hasSourceArrow,
453
- r.hasTargetArrow,
454
- r.roundness,
455
- r.detourDistance,
456
- r.detourDirection
457
- ) : new q(
458
- r.color,
459
- r.width,
460
- r.arrowLength,
461
- r.arrowWidth,
462
- r.arrowOffset,
463
- r.hasSourceArrow,
464
- r.hasTargetArrow,
465
- r.roundness
466
- ), ie = (r) => (e) => e === C.PortCycle ? new X(
467
- r.color,
468
- r.width,
469
- r.arrowLength,
470
- r.arrowWidth,
471
- r.hasSourceArrow || r.hasTargetArrow,
472
- r.cycleSquareSide,
473
- r.arrowOffset,
474
- r.roundness
475
- ) : e === C.NodeCycle ? new G(
476
- r.color,
477
- r.width,
478
- r.arrowLength,
479
- r.arrowWidth,
480
- r.arrowOffset,
481
- r.hasSourceArrow,
482
- r.hasTargetArrow,
483
- r.roundness,
484
- r.detourDistance,
485
- r.detourDirection
486
- ) : new te(
487
- r.color,
488
- r.width,
489
- r.arrowLength,
490
- r.arrowWidth,
491
- r.arrowOffset,
492
- r.hasSourceArrow,
493
- r.hasTargetArrow,
494
- r.roundness
495
- ), ae = (r) => (e) => e === C.PortCycle ? new X(
496
- r.color,
497
- r.width,
498
- r.arrowLength,
499
- r.arrowWidth,
500
- r.hasSourceArrow || r.hasTargetArrow,
501
- r.cycleSquareSide,
502
- r.arrowOffset,
503
- r.roundness
504
- ) : e === C.NodeCycle ? new G(
505
- r.color,
506
- r.width,
507
- r.arrowLength,
508
- r.arrowWidth,
509
- r.arrowOffset,
510
- r.hasSourceArrow,
511
- r.hasTargetArrow,
512
- r.roundness,
513
- r.detourDistance,
514
- r.detourDirection
515
- ) : new ee(
516
- r.color,
517
- r.width,
518
- r.arrowLength,
519
- r.arrowWidth,
520
- r.arrowOffset,
521
- r.hasSourceArrow,
522
- r.hasTargetArrow,
523
- r.roundness
524
- ), g = {
525
- edgeColor: "#5c5c5c",
526
- edgeWidth: 1,
527
- edgeArrowLength: 15,
528
- edgeArrowWidth: 4,
529
- edgeArrowOffset: 15,
530
- hasSourceArrow: !1,
531
- hasTargetArrow: !1,
532
- cycleSize: 30,
533
- roundness: 10,
534
- detourDistance: 100,
535
- detourDirection: -Math.PI / 2,
536
- smallCycleSize: 15,
537
- curvature: 90
538
- }, B = (r) => {
539
- switch (r == null ? void 0 : r.type) {
540
- case "custom":
541
- return r.factory;
622
+ const st = (e) => {
623
+ if (typeof e == "function")
624
+ return e;
625
+ switch (e == null ? void 0 : e.type) {
542
626
  case "straight":
543
- return ne({
544
- color: r.color ?? g.edgeColor,
545
- width: r.width ?? g.edgeWidth,
546
- arrowLength: r.arrowLength ?? g.edgeArrowLength,
547
- arrowWidth: r.arrowWidth ?? g.edgeArrowWidth,
548
- arrowOffset: r.arrowOffset ?? g.edgeArrowOffset,
549
- hasSourceArrow: r.hasSourceArrow ?? g.hasSourceArrow,
550
- hasTargetArrow: r.hasTargetArrow ?? g.hasTargetArrow,
551
- cycleSquareSide: r.cycleSquareSide ?? g.cycleSize,
552
- roundness: r.roundness ?? g.roundness,
553
- detourDistance: r.detourDistance ?? g.detourDistance,
554
- detourDirection: r.detourDirection ?? g.detourDirection
627
+ return () => new it({
628
+ color: e.color,
629
+ width: e.width,
630
+ arrowLength: e.arrowLength,
631
+ arrowWidth: e.arrowWidth,
632
+ arrowOffset: e.arrowOffset,
633
+ hasSourceArrow: e.hasSourceArrow,
634
+ hasTargetArrow: e.hasTargetArrow,
635
+ cycleSquareSide: e.cycleSquareSide,
636
+ roundness: e.roundness,
637
+ detourDistance: e.detourDistance,
638
+ detourDirection: e.detourDirection
555
639
  });
556
640
  case "horizontal":
557
- return ae({
558
- color: r.color ?? g.edgeColor,
559
- width: r.width ?? g.edgeWidth,
560
- arrowLength: r.arrowLength ?? g.edgeArrowLength,
561
- arrowWidth: r.arrowWidth ?? g.edgeArrowWidth,
562
- arrowOffset: r.arrowOffset ?? g.edgeArrowOffset,
563
- hasSourceArrow: r.hasSourceArrow ?? g.hasSourceArrow,
564
- hasTargetArrow: r.hasTargetArrow ?? g.hasTargetArrow,
565
- cycleSquareSide: r.cycleSquareSide ?? g.cycleSize,
566
- roundness: r.roundness ?? g.roundness,
567
- detourDistance: r.detourDistance ?? g.detourDistance,
568
- detourDirection: r.detourDirection ?? g.detourDirection
641
+ return () => new rt({
642
+ color: e.color,
643
+ width: e.width,
644
+ arrowLength: e.arrowLength,
645
+ arrowWidth: e.arrowWidth,
646
+ arrowOffset: e.arrowOffset,
647
+ hasSourceArrow: e.hasSourceArrow,
648
+ hasTargetArrow: e.hasTargetArrow,
649
+ cycleSquareSide: e.cycleSquareSide,
650
+ roundness: e.roundness,
651
+ detourDistance: e.detourDistance,
652
+ detourDirection: e.detourDirection
569
653
  });
570
654
  case "vertical":
571
- return ie({
572
- color: r.color ?? g.edgeColor,
573
- width: r.width ?? g.edgeWidth,
574
- arrowLength: r.arrowLength ?? g.edgeArrowLength,
575
- arrowWidth: r.arrowWidth ?? g.edgeArrowWidth,
576
- arrowOffset: r.arrowOffset ?? g.edgeArrowOffset,
577
- hasSourceArrow: r.hasSourceArrow ?? g.hasSourceArrow,
578
- hasTargetArrow: r.hasTargetArrow ?? g.hasTargetArrow,
579
- cycleSquareSide: r.cycleSquareSide ?? g.cycleSize,
580
- roundness: r.roundness ?? g.roundness,
581
- detourDistance: r.detourDistance ?? g.detourDistance,
582
- detourDirection: r.detourDirection ?? g.detourDirection
655
+ return () => new nt({
656
+ color: e.color,
657
+ width: e.width,
658
+ arrowLength: e.arrowLength,
659
+ arrowWidth: e.arrowWidth,
660
+ arrowOffset: e.arrowOffset,
661
+ hasSourceArrow: e.hasSourceArrow,
662
+ hasTargetArrow: e.hasTargetArrow,
663
+ cycleSquareSide: e.cycleSquareSide,
664
+ roundness: e.roundness,
665
+ detourDistance: e.detourDistance,
666
+ detourDirection: e.detourDirection
583
667
  });
584
668
  default:
585
- return oe({
586
- color: r.color ?? g.edgeColor,
587
- width: r.width ?? g.edgeWidth,
588
- arrowLength: r.arrowLength ?? g.edgeArrowLength,
589
- arrowWidth: r.arrowWidth ?? g.edgeArrowWidth,
590
- hasSourceArrow: r.hasSourceArrow ?? g.hasSourceArrow,
591
- hasTargetArrow: r.hasTargetArrow ?? g.hasTargetArrow,
592
- cycleRadius: r.cycleRadius ?? g.cycleSize,
593
- smallCycleRadius: r.smallCycleRadius ?? g.smallCycleSize,
594
- curvature: r.curvature ?? g.curvature,
595
- detourDistance: r.detourDistance ?? g.detourDistance,
596
- detourDirection: r.detourDirection ?? g.detourDirection
669
+ return () => new ot({
670
+ color: e.color,
671
+ width: e.width,
672
+ arrowLength: e.arrowLength,
673
+ arrowWidth: e.arrowWidth,
674
+ hasSourceArrow: e.hasSourceArrow,
675
+ hasTargetArrow: e.hasTargetArrow,
676
+ cycleRadius: e.cycleRadius,
677
+ smallCycleRadius: e.smallCycleRadius,
678
+ curvature: e.curvature,
679
+ detourDistance: e.detourDistance,
680
+ detourDirection: e.detourDirection
597
681
  });
598
682
  }
599
- }, Y = (r) => () => r, U = Y(0), R = () => {
600
- let r = 0;
601
- return () => r++;
602
- }, he = (r, e) => {
603
- let t = U, s = U;
604
- r === "incremental" && (t = R()), e === "incremental" && (s = R());
605
- const n = R();
606
- return r === "shared-incremental" && (t = n), e === "shared-incremental" && (s = n), typeof r == "number" && (t = Y(r)), typeof e == "number" && (s = Y(e)), typeof r == "function" && (t = r), typeof e == "function" && (s = e), {
607
- nodesPriorityFn: t,
608
- edgesPriorityFn: s
683
+ }, F = (e) => () => e, G = F(0), V = () => {
684
+ let e = 0;
685
+ return () => e++;
686
+ }, ht = (e, t) => {
687
+ let o = G, r = G;
688
+ e === "incremental" && (o = V()), t === "incremental" && (r = V());
689
+ const n = V();
690
+ return e === "shared-incremental" && (o = n), t === "shared-incremental" && (r = n), typeof e == "number" && (o = F(e)), typeof t == "number" && (r = F(t)), typeof e == "function" && (o = e), typeof t == "function" && (r = t), {
691
+ nodesPriorityFn: o,
692
+ edgesPriorityFn: r
609
693
  };
610
- }, de = (r) => {
611
- var t, s, n, o, h, i;
612
- const e = he(
613
- (t = r == null ? void 0 : r.nodes) == null ? void 0 : t.priority,
614
- (s = r == null ? void 0 : r.edges) == null ? void 0 : s.priority
694
+ }, dt = (e) => {
695
+ var o, r, n, i, c;
696
+ const t = ht(
697
+ (o = e == null ? void 0 : e.nodes) == null ? void 0 : o.priority,
698
+ (r = e == null ? void 0 : e.edges) == null ? void 0 : r.priority
615
699
  );
616
700
  return {
617
701
  nodes: {
618
- centerFn: ((n = r == null ? void 0 : r.nodes) == null ? void 0 : n.centerFn) ?? H,
619
- priorityFn: e.nodesPriorityFn
702
+ centerFn: ((n = e == null ? void 0 : e.nodes) == null ? void 0 : n.centerFn) ?? _,
703
+ priorityFn: t.nodesPriorityFn
620
704
  },
621
705
  ports: {
622
- centerFn: ((o = r == null ? void 0 : r.ports) == null ? void 0 : o.centerFn) ?? H,
623
- direction: ((h = r == null ? void 0 : r.ports) == null ? void 0 : h.direction) ?? 0
706
+ direction: ((i = e == null ? void 0 : e.ports) == null ? void 0 : i.direction) ?? 0
624
707
  },
625
708
  edges: {
626
- shapeFactory: B(((i = r == null ? void 0 : r.edges) == null ? void 0 : i.shape) ?? {}),
627
- priorityFn: e.edgesPriorityFn
709
+ shapeFactory: st(((c = e == null ? void 0 : e.edges) == null ? void 0 : c.shape) ?? {}),
710
+ priorityFn: t.edgesPriorityFn
628
711
  }
629
712
  };
630
713
  };
631
- class ce {
714
+ class ct {
632
715
  constructor() {
633
- a(this, "nodes", /* @__PURE__ */ new Map());
634
- a(this, "ports", /* @__PURE__ */ new Map());
635
- a(this, "nodePorts", /* @__PURE__ */ new Map());
636
- a(this, "portNodeId", /* @__PURE__ */ new Map());
637
- a(this, "edges", /* @__PURE__ */ new Map());
638
- a(this, "incommingEdges", /* @__PURE__ */ new Map());
639
- a(this, "outcommingEdges", /* @__PURE__ */ new Map());
640
- a(this, "cycleEdges", /* @__PURE__ */ new Map());
641
- }
642
- addNode(e) {
643
- this.nodes.set(e.nodeId, {
644
- element: e.element,
645
- x: e.x,
646
- y: e.y,
647
- centerFn: e.centerFn,
648
- priority: e.priority
649
- }), this.nodePorts.set(e.nodeId, /* @__PURE__ */ new Map());
716
+ s(this, "nodes", /* @__PURE__ */ new Map());
717
+ s(this, "ports", /* @__PURE__ */ new Map());
718
+ s(this, "nodePorts", /* @__PURE__ */ new Map());
719
+ s(this, "portNodeId", /* @__PURE__ */ new Map());
720
+ s(this, "edges", /* @__PURE__ */ new Map());
721
+ s(this, "incommingEdges", /* @__PURE__ */ new Map());
722
+ s(this, "outcommingEdges", /* @__PURE__ */ new Map());
723
+ s(this, "cycleEdges", /* @__PURE__ */ new Map());
724
+ }
725
+ addNode(t) {
726
+ this.nodes.set(t.nodeId, {
727
+ element: t.element,
728
+ x: t.x,
729
+ y: t.y,
730
+ centerFn: t.centerFn,
731
+ priority: t.priority
732
+ }), this.nodePorts.set(t.nodeId, /* @__PURE__ */ new Map());
650
733
  }
651
734
  getAllNodeIds() {
652
735
  return Array.from(this.nodes.keys());
653
736
  }
654
- getNode(e) {
655
- return this.nodes.get(e);
737
+ getNode(t) {
738
+ return this.nodes.get(t);
656
739
  }
657
- removeNode(e) {
658
- this.nodes.delete(e), this.nodePorts.delete(e);
740
+ removeNode(t) {
741
+ this.nodes.delete(t), this.nodePorts.delete(t);
659
742
  }
660
- addPort(e) {
661
- this.ports.set(e.portId, {
662
- element: e.element,
663
- centerFn: e.centerFn,
664
- direction: e.direction
665
- }), this.cycleEdges.set(e.portId, /* @__PURE__ */ new Set()), this.incommingEdges.set(e.portId, /* @__PURE__ */ new Set()), this.outcommingEdges.set(e.portId, /* @__PURE__ */ new Set()), this.portNodeId.set(e.portId, e.nodeId), this.nodePorts.get(e.nodeId).set(e.portId, e.element);
743
+ addPort(t) {
744
+ this.ports.set(t.portId, {
745
+ element: t.element,
746
+ direction: t.direction
747
+ }), this.cycleEdges.set(t.portId, /* @__PURE__ */ new Set()), this.incommingEdges.set(t.portId, /* @__PURE__ */ new Set()), this.outcommingEdges.set(t.portId, /* @__PURE__ */ new Set()), this.portNodeId.set(t.portId, t.nodeId), this.nodePorts.get(t.nodeId).set(t.portId, t.element);
666
748
  }
667
- getPort(e) {
668
- return this.ports.get(e);
749
+ getPort(t) {
750
+ return this.ports.get(t);
669
751
  }
670
752
  getAllPortIds() {
671
753
  return Array.from(this.ports.keys());
672
754
  }
673
- getNodePortIds(e) {
674
- const t = this.nodePorts.get(e);
675
- if (t !== void 0)
676
- return Array.from(t.keys());
755
+ getNodePortIds(t) {
756
+ const o = this.nodePorts.get(t);
757
+ if (o !== void 0)
758
+ return Array.from(o.keys());
677
759
  }
678
- getPortNodeId(e) {
679
- return this.portNodeId.get(e);
760
+ getPortNodeId(t) {
761
+ return this.portNodeId.get(t);
680
762
  }
681
- removePort(e) {
682
- const t = this.portNodeId.get(e);
683
- this.portNodeId.delete(e), this.nodePorts.get(t).delete(e), this.ports.delete(e);
763
+ removePort(t) {
764
+ const o = this.portNodeId.get(t);
765
+ this.portNodeId.delete(t), this.nodePorts.get(o).delete(t), this.ports.delete(t);
684
766
  }
685
- addEdge(e) {
686
- this.edges.set(e.edgeId, {
687
- from: e.from,
688
- to: e.to,
689
- shape: e.shape,
690
- priority: e.priority
691
- }), e.from !== e.to ? (this.outcommingEdges.get(e.from).add(e.edgeId), this.incommingEdges.get(e.to).add(e.edgeId)) : this.cycleEdges.get(e.from).add(e.edgeId);
767
+ addEdge(t) {
768
+ this.edges.set(t.edgeId, {
769
+ from: t.from,
770
+ to: t.to,
771
+ shape: t.shape,
772
+ priority: t.priority
773
+ }), t.from !== t.to ? (this.outcommingEdges.get(t.from).add(t.edgeId), this.incommingEdges.get(t.to).add(t.edgeId)) : this.cycleEdges.get(t.from).add(t.edgeId);
774
+ }
775
+ updateEdgeFrom(t, o) {
776
+ const r = this.edges.get(t);
777
+ this.removeEdge(t), this.addEdge({
778
+ edgeId: t,
779
+ from: o,
780
+ to: r.to,
781
+ shape: r.shape,
782
+ priority: r.priority
783
+ });
784
+ }
785
+ updateEdgeTo(t, o) {
786
+ const r = this.edges.get(t);
787
+ this.removeEdge(t), this.addEdge({
788
+ edgeId: t,
789
+ from: r.from,
790
+ to: o,
791
+ shape: r.shape,
792
+ priority: r.priority
793
+ });
692
794
  }
693
795
  getAllEdgeIds() {
694
796
  return Array.from(this.edges.keys());
695
797
  }
696
- getEdge(e) {
697
- return this.edges.get(e);
798
+ getEdge(t) {
799
+ return this.edges.get(t);
698
800
  }
699
- removeEdge(e) {
700
- const t = this.edges.get(e), s = t.from, n = t.to;
701
- this.cycleEdges.get(s).delete(e), this.cycleEdges.get(n).delete(e), this.incommingEdges.get(s).delete(e), this.incommingEdges.get(n).delete(e), this.outcommingEdges.get(s).delete(e), this.outcommingEdges.get(n).delete(e), this.edges.delete(e);
801
+ removeEdge(t) {
802
+ const o = this.edges.get(t), r = o.from, n = o.to;
803
+ this.cycleEdges.get(r).delete(t), this.cycleEdges.get(n).delete(t), this.incommingEdges.get(r).delete(t), this.incommingEdges.get(n).delete(t), this.outcommingEdges.get(r).delete(t), this.outcommingEdges.get(n).delete(t), this.edges.delete(t);
702
804
  }
703
805
  clear() {
704
806
  this.nodes.clear(), this.ports.clear(), this.nodePorts.clear(), this.portNodeId.clear(), this.edges.clear(), this.incommingEdges.clear(), this.outcommingEdges.clear(), this.cycleEdges.clear();
705
807
  }
706
- getPortIncomingEdgeIds(e) {
707
- return Array.from(this.incommingEdges.get(e));
808
+ getPortIncomingEdgeIds(t) {
809
+ return Array.from(this.incommingEdges.get(t));
708
810
  }
709
- getPortOutcomingEdgeIds(e) {
710
- return Array.from(this.outcommingEdges.get(e));
811
+ getPortOutcomingEdgeIds(t) {
812
+ return Array.from(this.outcommingEdges.get(t));
711
813
  }
712
- getPortCycleEdgeIds(e) {
713
- return Array.from(this.cycleEdges.get(e));
814
+ getPortCycleEdgeIds(t) {
815
+ return Array.from(this.cycleEdges.get(t));
714
816
  }
715
- getPortAdjacentEdgeIds(e) {
817
+ getPortAdjacentEdgeIds(t) {
716
818
  return [
717
- ...this.getPortIncomingEdgeIds(e),
718
- ...this.getPortOutcomingEdgeIds(e),
719
- ...this.getPortCycleEdgeIds(e)
819
+ ...this.getPortIncomingEdgeIds(t),
820
+ ...this.getPortOutcomingEdgeIds(t),
821
+ ...this.getPortCycleEdgeIds(t)
720
822
  ];
721
823
  }
722
- getNodeIncomingEdgeIds(e) {
723
- const t = Array.from(this.nodePorts.get(e).keys());
724
- let s = [];
725
- return t.forEach((n) => {
726
- s = [...s, ...this.getPortIncomingEdgeIds(n)];
727
- }), s;
728
- }
729
- getNodeOutcomingEdgeIds(e) {
730
- const t = Array.from(this.nodePorts.get(e).keys());
731
- let s = [];
732
- return t.forEach((n) => {
733
- s = [...s, ...this.getPortOutcomingEdgeIds(n)];
734
- }), s;
735
- }
736
- getNodeCycleEdgeIds(e) {
737
- const t = Array.from(this.nodePorts.get(e).keys());
738
- let s = [];
739
- return t.forEach((n) => {
740
- s = [...s, ...this.getPortCycleEdgeIds(n)];
741
- }), s;
742
- }
743
- getNodeAdjacentEdgeIds(e) {
824
+ getNodeIncomingEdgeIds(t) {
825
+ const o = Array.from(this.nodePorts.get(t).keys());
826
+ let r = [];
827
+ return o.forEach((n) => {
828
+ r = [...r, ...this.getPortIncomingEdgeIds(n)];
829
+ }), r;
830
+ }
831
+ getNodeOutcomingEdgeIds(t) {
832
+ const o = Array.from(this.nodePorts.get(t).keys());
833
+ let r = [];
834
+ return o.forEach((n) => {
835
+ r = [...r, ...this.getPortOutcomingEdgeIds(n)];
836
+ }), r;
837
+ }
838
+ getNodeCycleEdgeIds(t) {
839
+ const o = Array.from(this.nodePorts.get(t).keys());
840
+ let r = [];
841
+ return o.forEach((n) => {
842
+ r = [...r, ...this.getPortCycleEdgeIds(n)];
843
+ }), r;
844
+ }
845
+ getNodeAdjacentEdgeIds(t) {
744
846
  return [
745
- ...this.getNodeIncomingEdgeIds(e),
746
- ...this.getNodeOutcomingEdgeIds(e),
747
- ...this.getNodeCycleEdgeIds(e)
847
+ ...this.getNodeIncomingEdgeIds(t),
848
+ ...this.getNodeOutcomingEdgeIds(t),
849
+ ...this.getNodeCycleEdgeIds(t)
748
850
  ];
749
851
  }
750
852
  }
751
- class le {
752
- constructor(e) {
753
- this.graphStore = e;
754
- }
755
- getNode(e) {
756
- const t = this.graphStore.getNode(e);
757
- return t === void 0 ? null : {
758
- element: t.element,
759
- x: t.x,
760
- y: t.y,
761
- centerFn: t.centerFn,
762
- priority: t.priority
853
+ class lt {
854
+ constructor(t) {
855
+ this.graphStore = t;
856
+ }
857
+ getNode(t) {
858
+ const o = this.graphStore.getNode(t);
859
+ return o === void 0 ? null : {
860
+ element: o.element,
861
+ x: o.x,
862
+ y: o.y,
863
+ centerFn: o.centerFn,
864
+ priority: o.priority
763
865
  };
764
866
  }
765
867
  getAllNodeIds() {
766
868
  return this.graphStore.getAllNodeIds();
767
869
  }
768
- getPort(e) {
769
- const t = this.graphStore.getPort(e);
770
- return t === void 0 ? null : {
771
- element: t.element,
772
- centerFn: t.centerFn,
773
- direction: t.direction
870
+ getPort(t) {
871
+ const o = this.graphStore.getPort(t);
872
+ return o === void 0 ? null : {
873
+ element: o.element,
874
+ direction: o.direction
774
875
  };
775
876
  }
776
877
  getAllPortIds() {
777
878
  return this.graphStore.getAllPortIds();
778
879
  }
779
- getNodePortIds(e) {
780
- return this.graphStore.getNodePortIds(e);
880
+ getNodePortIds(t) {
881
+ return this.graphStore.getNodePortIds(t);
781
882
  }
782
- getPortNodeId(e) {
783
- return this.graphStore.getPortNodeId(e) ?? null;
883
+ getPortNodeId(t) {
884
+ return this.graphStore.getPortNodeId(t) ?? null;
784
885
  }
785
886
  getAllEdgeIds() {
786
887
  return this.graphStore.getAllEdgeIds();
787
888
  }
788
- getEdge(e) {
789
- const t = this.graphStore.getEdge(e);
790
- return t === void 0 ? null : { from: t.from, to: t.to, priority: t.priority };
889
+ getEdge(t) {
890
+ const o = this.graphStore.getEdge(t);
891
+ return o === void 0 ? null : { from: o.from, to: o.to, priority: o.priority };
791
892
  }
792
- getPortIncomingEdgeIds(e) {
793
- return this.graphStore.getPortIncomingEdgeIds(e);
893
+ getPortIncomingEdgeIds(t) {
894
+ return this.graphStore.getPortIncomingEdgeIds(t);
794
895
  }
795
- getPortOutcomingEdgeIds(e) {
796
- return this.graphStore.getPortOutcomingEdgeIds(e);
896
+ getPortOutcomingEdgeIds(t) {
897
+ return this.graphStore.getPortOutcomingEdgeIds(t);
797
898
  }
798
- getPortCycleEdgeIds(e) {
799
- return this.graphStore.getPortCycleEdgeIds(e);
899
+ getPortCycleEdgeIds(t) {
900
+ return this.graphStore.getPortCycleEdgeIds(t);
800
901
  }
801
- getPortAdjacentEdgeIds(e) {
802
- return this.graphStore.getPortAdjacentEdgeIds(e);
902
+ getPortAdjacentEdgeIds(t) {
903
+ return this.graphStore.getPortAdjacentEdgeIds(t);
803
904
  }
804
- getNodeIncomingEdgeIds(e) {
805
- return this.graphStore.getNodeIncomingEdgeIds(e);
905
+ getNodeIncomingEdgeIds(t) {
906
+ return this.graphStore.getNodeIncomingEdgeIds(t);
806
907
  }
807
- getNodeOutcomingEdgeIds(e) {
808
- return this.graphStore.getNodeOutcomingEdgeIds(e);
908
+ getNodeOutcomingEdgeIds(t) {
909
+ return this.graphStore.getNodeOutcomingEdgeIds(t);
809
910
  }
810
- getNodeCycleEdgeIds(e) {
811
- return this.graphStore.getNodeCycleEdgeIds(e);
911
+ getNodeCycleEdgeIds(t) {
912
+ return this.graphStore.getNodeCycleEdgeIds(t);
812
913
  }
813
- getNodeAdjacentEdgeIds(e) {
814
- return this.graphStore.getNodeAdjacentEdgeIds(e);
914
+ getNodeAdjacentEdgeIds(t) {
915
+ return this.graphStore.getNodeAdjacentEdgeIds(t);
815
916
  }
816
917
  }
817
- const K = (r) => ({
818
- scale: 1 / r.scale,
819
- dx: -r.dx / r.scale,
820
- dy: -r.dy / r.scale
821
- }), _ = {
918
+ const j = (e) => ({
919
+ scale: 1 / e.scale,
920
+ dx: -e.dx / e.scale,
921
+ dy: -e.dy / e.scale
922
+ }), H = {
822
923
  scale: 1,
823
924
  dx: 0,
824
925
  dy: 0
825
926
  };
826
- class ge {
927
+ class at {
827
928
  constructor() {
828
- a(this, "viewportMatrix", _);
829
- a(this, "contentMatrix", _);
929
+ s(this, "viewportMatrix", H);
930
+ s(this, "contentMatrix", H);
830
931
  }
831
932
  getViewportMatrix() {
832
933
  return this.viewportMatrix;
@@ -834,24 +935,24 @@ class ge {
834
935
  getContentMatrix() {
835
936
  return this.contentMatrix;
836
937
  }
837
- patchViewportMatrix(e) {
938
+ patchViewportMatrix(t) {
838
939
  this.viewportMatrix = {
839
- scale: e.scale ?? this.viewportMatrix.scale,
840
- dx: e.dx ?? this.viewportMatrix.dx,
841
- dy: e.dy ?? this.viewportMatrix.dy
842
- }, this.contentMatrix = K(this.viewportMatrix);
940
+ scale: t.scale ?? this.viewportMatrix.scale,
941
+ dx: t.dx ?? this.viewportMatrix.dx,
942
+ dy: t.dy ?? this.viewportMatrix.dy
943
+ }, this.contentMatrix = j(this.viewportMatrix);
843
944
  }
844
- patchContentMatrix(e) {
945
+ patchContentMatrix(t) {
845
946
  this.contentMatrix = {
846
- scale: e.scale ?? this.contentMatrix.scale,
847
- dx: e.dx ?? this.contentMatrix.dx,
848
- dy: e.dy ?? this.contentMatrix.dy
849
- }, this.viewportMatrix = K(this.contentMatrix);
947
+ scale: t.scale ?? this.contentMatrix.scale,
948
+ dx: t.dx ?? this.contentMatrix.dx,
949
+ dy: t.dy ?? this.contentMatrix.dy
950
+ }, this.viewportMatrix = j(this.contentMatrix);
850
951
  }
851
952
  }
852
- class ue {
853
- constructor(e) {
854
- this.transformer = e;
953
+ class gt {
954
+ constructor(t) {
955
+ this.transformer = t;
855
956
  }
856
957
  getViewportMatrix() {
857
958
  return { ...this.transformer.getViewportMatrix() };
@@ -860,118 +961,117 @@ class ue {
860
961
  return { ...this.transformer.getContentMatrix() };
861
962
  }
862
963
  }
863
- const we = () => {
864
- const r = document.createElement("div");
865
- return r.style.width = "100%", r.style.height = "100%", r.style.position = "relative", r.style.overflow = "hidden", r;
866
- }, ye = () => {
867
- const r = document.createElement("div");
868
- return r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.width = "0", r.style.height = "0", r;
869
- }, me = () => {
870
- const r = document.createElement("div");
871
- return r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.visibility = "hidden", r;
964
+ const ut = () => {
965
+ const e = document.createElement("div");
966
+ return e.style.width = "100%", e.style.height = "100%", e.style.position = "relative", e.style.overflow = "hidden", e;
967
+ }, wt = () => {
968
+ const e = document.createElement("div");
969
+ return e.style.position = "absolute", e.style.top = "0", e.style.left = "0", e.style.width = "0", e.style.height = "0", e;
970
+ }, yt = () => {
971
+ const e = document.createElement("div");
972
+ return e.style.position = "absolute", e.style.top = "0", e.style.left = "0", e.style.visibility = "hidden", e;
872
973
  };
873
- class ve {
874
- constructor(e, t) {
875
- a(this, "canvasWrapper", null);
876
- a(this, "host", we());
877
- a(this, "container", ye());
878
- a(this, "nodeIdToWrapperElementMap", /* @__PURE__ */ new Map());
879
- a(this, "edgeIdToElementMap", /* @__PURE__ */ new Map());
880
- this.graphStore = e, this.viewportTransformer = t, this.host.appendChild(this.container);
881
- }
882
- attach(e) {
883
- this.detach(), this.canvasWrapper = e, this.canvasWrapper.appendChild(this.host);
974
+ class ft {
975
+ constructor(t, o) {
976
+ s(this, "canvasWrapper", null);
977
+ s(this, "host", ut());
978
+ s(this, "container", wt());
979
+ s(this, "nodeIdToWrapperElementMap", /* @__PURE__ */ new Map());
980
+ s(this, "edgeIdToElementMap", /* @__PURE__ */ new Map());
981
+ this.graphStore = t, this.viewportTransformer = o, this.host.appendChild(this.container);
982
+ }
983
+ attach(t) {
984
+ this.detach(), this.canvasWrapper = t, this.canvasWrapper.appendChild(this.host);
884
985
  }
885
986
  detach() {
886
987
  this.canvasWrapper !== null && (this.canvasWrapper.removeChild(this.host), this.canvasWrapper = null);
887
988
  }
888
989
  applyTransform() {
889
- const e = this.viewportTransformer.getContentMatrix();
890
- this.container.style.transform = `matrix(${e.scale}, 0, 0, ${e.scale}, ${e.dx}, ${e.dy})`;
990
+ const t = this.viewportTransformer.getContentMatrix();
991
+ this.container.style.transform = `matrix(${t.scale}, 0, 0, ${t.scale}, ${t.dx}, ${t.dy})`;
891
992
  }
892
- attachNode(e) {
893
- const t = this.graphStore.getNode(e), s = me();
894
- s.appendChild(t.element), this.container.appendChild(s), this.nodeIdToWrapperElementMap.set(e, s), this.updateNodeCoordinates(e), this.updateNodePriority(e), s.style.visibility = "visible";
993
+ attachNode(t) {
994
+ const o = this.graphStore.getNode(t), r = yt();
995
+ r.appendChild(o.element), this.container.appendChild(r), this.nodeIdToWrapperElementMap.set(t, r), this.updateNodeCoordinates(t), this.updateNodePriority(t), r.style.visibility = "visible";
895
996
  }
896
- detachNode(e) {
897
- const t = this.graphStore.getNode(e), s = this.nodeIdToWrapperElementMap.get(e);
898
- s.removeChild(t.element), this.container.removeChild(s), this.nodeIdToWrapperElementMap.delete(e);
997
+ detachNode(t) {
998
+ const o = this.graphStore.getNode(t), r = this.nodeIdToWrapperElementMap.get(t);
999
+ r.removeChild(o.element), this.container.removeChild(r), this.nodeIdToWrapperElementMap.delete(t);
899
1000
  }
900
- attachEdge(e) {
901
- const t = this.graphStore.getEdge(e);
902
- this.edgeIdToElementMap.set(e, t.shape.svg), this.container.appendChild(t.shape.svg), this.updateEdge(e), this.updateEdgePriority(e);
1001
+ attachEdge(t) {
1002
+ const o = this.graphStore.getEdge(t);
1003
+ this.edgeIdToElementMap.set(t, o.shape.svg), this.container.appendChild(o.shape.svg), this.renderEdge(t), this.updateEdgePriority(t);
903
1004
  }
904
- detachEdge(e) {
905
- const t = this.graphStore.getEdge(e);
906
- this.container.removeChild(t.shape.svg), this.edgeIdToElementMap.delete(e);
1005
+ detachEdge(t) {
1006
+ const o = this.graphStore.getEdge(t);
1007
+ this.container.removeChild(o.shape.svg), this.edgeIdToElementMap.delete(t);
907
1008
  }
908
1009
  clear() {
909
- this.edgeIdToElementMap.forEach((e, t) => {
910
- this.detachEdge(t);
911
- }), this.nodeIdToWrapperElementMap.forEach((e, t) => {
912
- this.detachNode(t);
1010
+ this.edgeIdToElementMap.forEach((t, o) => {
1011
+ this.detachEdge(o);
1012
+ }), this.nodeIdToWrapperElementMap.forEach((t, o) => {
1013
+ this.detachNode(o);
913
1014
  });
914
1015
  }
915
1016
  destroy() {
916
1017
  this.clear(), this.detach(), this.host.removeChild(this.container);
917
1018
  }
918
- updateNodeCoordinates(e) {
919
- const t = this.nodeIdToWrapperElementMap.get(e), s = this.graphStore.getNode(e), { width: n, height: o } = s.element.getBoundingClientRect(), h = this.viewportTransformer.getViewportMatrix().scale, i = s.centerFn(n, o), d = s.x - h * i.x, c = s.y - h * i.y;
920
- t.style.transform = `translate(${d}px, ${c}px)`;
921
- }
922
- updateNodePriority(e) {
923
- const t = this.graphStore.getNode(e), s = this.nodeIdToWrapperElementMap.get(e);
924
- s.style.zIndex = `${t.priority}`;
925
- }
926
- updateEdgeShape(e) {
927
- const t = this.edgeIdToElementMap.get(e);
928
- this.container.removeChild(t);
929
- const s = this.graphStore.getEdge(e);
930
- this.edgeIdToElementMap.set(e, s.shape.svg), this.container.appendChild(s.shape.svg);
931
- }
932
- updateEdge(e) {
933
- const t = this.graphStore.getEdge(e), s = this.graphStore.getPort(t.from), n = this.graphStore.getPort(t.to), o = s.element.getBoundingClientRect(), h = n.element.getBoundingClientRect(), i = this.host.getBoundingClientRect(), d = this.viewportTransformer.getViewportMatrix(), c = {
934
- x: d.scale * (o.left - i.left) + d.dx,
935
- y: d.scale * (o.top - i.top) + d.dy
936
- }, u = {
937
- x: d.scale * (h.left - i.left) + d.dx,
938
- y: d.scale * (h.top - i.top) + d.dy
939
- }, w = s.centerFn(
940
- o.width * d.scale,
941
- o.height * d.scale
942
- ), m = n.centerFn(
943
- h.width * d.scale,
944
- h.height * d.scale
945
- ), y = {
946
- x: c.x + w.x,
947
- y: c.y + w.y
948
- }, p = {
949
- x: u.x + m.x,
950
- y: u.y + m.y
951
- }, M = Math.min(y.x, p.x), P = Math.min(y.y, p.y), S = Math.abs(p.x - y.x), b = Math.abs(p.y - y.y);
952
- t.shape.svg.style.width = `${S}px`, t.shape.svg.style.height = `${b}px`, t.shape.svg.style.transform = `translate(${M}px, ${P}px)`;
953
- const L = y.x <= p.x ? 1 : -1, F = y.y <= p.y ? 1 : -1;
954
- t.shape.update(
955
- { x: S, y: b },
956
- L,
957
- F,
958
- s.direction,
959
- n.direction
960
- );
1019
+ updateNodeCoordinates(t) {
1020
+ const o = this.nodeIdToWrapperElementMap.get(t), r = this.graphStore.getNode(t), { width: n, height: i } = r.element.getBoundingClientRect(), c = this.viewportTransformer.getViewportMatrix().scale, d = r.centerFn(n, i), h = r.x - c * d.x, l = r.y - c * d.y;
1021
+ o.style.transform = `translate(${h}px, ${l}px)`;
1022
+ }
1023
+ updateNodePriority(t) {
1024
+ const o = this.graphStore.getNode(t), r = this.nodeIdToWrapperElementMap.get(t);
1025
+ r.style.zIndex = `${o.priority}`;
1026
+ }
1027
+ updateEdgeShape(t) {
1028
+ const o = this.edgeIdToElementMap.get(t);
1029
+ this.container.removeChild(o);
1030
+ const r = this.graphStore.getEdge(t);
1031
+ this.edgeIdToElementMap.set(t, r.shape.svg), this.container.appendChild(r.shape.svg);
1032
+ }
1033
+ renderEdge(t) {
1034
+ const o = this.graphStore.getEdge(t), r = this.graphStore.getPort(o.from), n = this.graphStore.getPort(o.to), i = r.element.getBoundingClientRect(), c = n.element.getBoundingClientRect(), d = this.host.getBoundingClientRect(), h = this.viewportTransformer.getViewportMatrix(), l = {
1035
+ x: h.scale * (i.left - d.left) + h.dx,
1036
+ y: h.scale * (i.top - d.top) + h.dy
1037
+ }, a = {
1038
+ x: h.scale * (c.left - d.left) + h.dx,
1039
+ y: h.scale * (c.top - d.top) + h.dy
1040
+ }, w = {
1041
+ x: l.x,
1042
+ y: l.y,
1043
+ width: i.width * h.scale,
1044
+ height: i.height * h.scale,
1045
+ direction: r.direction,
1046
+ portId: o.from,
1047
+ nodeId: this.graphStore.getPortNodeId(o.from)
1048
+ }, y = {
1049
+ x: a.x,
1050
+ y: a.y,
1051
+ width: c.width * h.scale,
1052
+ height: c.height * h.scale,
1053
+ direction: n.direction,
1054
+ portId: o.to,
1055
+ nodeId: this.graphStore.getPortNodeId(o.to)
1056
+ };
1057
+ o.shape.render({
1058
+ source: w,
1059
+ target: y
1060
+ });
961
1061
  }
962
- updateEdgePriority(e) {
963
- const t = this.graphStore.getEdge(e);
964
- t.shape.svg.style.zIndex = `${t.priority}`;
1062
+ updateEdgePriority(t) {
1063
+ const o = this.graphStore.getEdge(t);
1064
+ o.shape.svg.style.zIndex = `${o.priority}`;
965
1065
  }
966
1066
  }
967
- class $ {
968
- constructor(e) {
969
- a(this, "counter", 0);
970
- this.checkExists = e;
971
- }
972
- create(e) {
973
- if (e !== void 0)
974
- return e;
1067
+ class N {
1068
+ constructor(t) {
1069
+ s(this, "counter", 0);
1070
+ this.checkExists = t;
1071
+ }
1072
+ create(t) {
1073
+ if (t !== void 0)
1074
+ return t;
975
1075
  for (; this.checkExists(this.counter); )
976
1076
  this.counter++;
977
1077
  return this.counter;
@@ -980,133 +1080,126 @@ class $ {
980
1080
  this.counter = 0;
981
1081
  }
982
1082
  }
983
- class A extends Error {
1083
+ class S extends Error {
984
1084
  constructor() {
985
1085
  super(...arguments);
986
- a(this, "name", "HtmlGraphError");
1086
+ s(this, "name", "HtmlGraphError");
987
1087
  }
988
1088
  }
989
- class pe {
990
- constructor(e, t, s, n, o, h, i, d) {
991
- a(this, "nodeIdGenerator", new $(
992
- (e) => this.graphStore.getNode(e) !== void 0
1089
+ class vt {
1090
+ constructor(t, o, r, n, i, c, d) {
1091
+ s(this, "nodeIdGenerator", new N(
1092
+ (t) => this.graphStore.getNode(t) !== void 0
993
1093
  ));
994
- a(this, "portIdGenerator", new $(
995
- (e) => this.graphStore.getPort(e) !== void 0
1094
+ s(this, "portIdGenerator", new N(
1095
+ (t) => this.graphStore.getPort(t) !== void 0
996
1096
  ));
997
- a(this, "edgeIdGenerator", new $(
998
- (e) => this.graphStore.getEdge(e) !== void 0
1097
+ s(this, "edgeIdGenerator", new N(
1098
+ (t) => this.graphStore.getEdge(t) !== void 0
999
1099
  ));
1000
- this.graphStore = e, this.htmlController = t, this.viewportTransformer = s, this.defaultNodesCenterFn = n, this.defaultPortsCenterFn = o, this.defaultPortsDirection = h, this.defaultNodesPriorityFn = i, this.defaultEdgesPriorityFn = d;
1100
+ this.graphStore = t, this.htmlController = o, this.viewportTransformer = r, this.defaultNodesCenterFn = n, this.defaultPortsDirection = i, this.defaultNodesPriorityFn = c, this.defaultEdgesPriorityFn = d;
1001
1101
  }
1002
- attach(e) {
1003
- this.htmlController.attach(e);
1102
+ attach(t) {
1103
+ this.htmlController.attach(t);
1004
1104
  }
1005
1105
  detach() {
1006
1106
  this.htmlController.detach();
1007
1107
  }
1008
- addNode(e) {
1009
- const t = this.nodeIdGenerator.create(e.nodeId);
1010
- if (this.graphStore.getNode(t) !== void 0)
1011
- throw new A("failed to add node with existing id");
1108
+ addNode(t) {
1109
+ const o = this.nodeIdGenerator.create(t.nodeId);
1110
+ if (this.graphStore.getNode(o) !== void 0)
1111
+ throw new S("failed to add node with existing id");
1012
1112
  this.graphStore.addNode({
1013
- nodeId: t,
1014
- element: e.element,
1015
- x: e.x,
1016
- y: e.y,
1017
- centerFn: e.centerFn ?? this.defaultNodesCenterFn,
1018
- priority: e.priority ?? this.defaultNodesPriorityFn()
1019
- }), this.htmlController.attachNode(t), Array.from(e.ports ?? []).forEach((s) => {
1113
+ nodeId: o,
1114
+ element: t.element,
1115
+ x: t.x,
1116
+ y: t.y,
1117
+ centerFn: t.centerFn ?? this.defaultNodesCenterFn,
1118
+ priority: t.priority ?? this.defaultNodesPriorityFn()
1119
+ }), this.htmlController.attachNode(o), Array.from(t.ports ?? []).forEach((r) => {
1020
1120
  this.markPort({
1021
- portId: s.id,
1022
- element: s.element,
1023
- nodeId: t,
1024
- centerFn: s.centerFn,
1025
- direction: s.direction
1121
+ portId: r.id,
1122
+ element: r.element,
1123
+ nodeId: o,
1124
+ direction: r.direction
1026
1125
  });
1027
1126
  });
1028
1127
  }
1029
- markPort(e) {
1030
- const t = this.portIdGenerator.create(e.portId);
1031
- if (this.graphStore.getPort(t) !== void 0)
1032
- throw new A("failed to add port with existing id");
1033
- if (this.graphStore.getNode(e.nodeId) === void 0)
1034
- throw new A("failed to set port on nonexisting node");
1128
+ markPort(t) {
1129
+ const o = this.portIdGenerator.create(t.portId);
1130
+ if (this.graphStore.getPort(o) !== void 0)
1131
+ throw new S("failed to add port with existing id");
1132
+ if (this.graphStore.getNode(t.nodeId) === void 0)
1133
+ throw new S("failed to set port on nonexisting node");
1035
1134
  this.graphStore.addPort({
1036
- portId: t,
1037
- element: e.element,
1038
- nodeId: e.nodeId,
1039
- centerFn: e.centerFn ?? this.defaultPortsCenterFn,
1040
- direction: e.direction ?? this.defaultPortsDirection
1135
+ portId: o,
1136
+ element: t.element,
1137
+ nodeId: t.nodeId,
1138
+ direction: t.direction ?? this.defaultPortsDirection
1041
1139
  });
1042
1140
  }
1043
- addEdge(e) {
1044
- const t = this.edgeIdGenerator.create(e.edgeId);
1045
- if (this.graphStore.getEdge(t) !== void 0)
1046
- throw new A("failed to add edge with existing id");
1047
- if (this.graphStore.getPort(e.from) === void 0)
1048
- throw new A("failed to add edge from nonexisting port");
1049
- if (this.graphStore.getPort(e.to) === void 0)
1050
- throw new A("failed to add edge to nonexisting port");
1051
- const s = this.resolveEdgeType(e.from, e.to);
1141
+ addEdge(t) {
1142
+ const o = this.edgeIdGenerator.create(t.edgeId);
1143
+ if (this.graphStore.getEdge(o) !== void 0)
1144
+ throw new S("failed to add edge with existing id");
1145
+ if (this.graphStore.getPort(t.from) === void 0)
1146
+ throw new S("failed to add edge from nonexisting port");
1147
+ if (this.graphStore.getPort(t.to) === void 0)
1148
+ throw new S("failed to add edge to nonexisting port");
1052
1149
  this.graphStore.addEdge({
1053
- edgeId: t,
1054
- from: e.from,
1055
- to: e.to,
1056
- shape: e.shapeFactory(s),
1057
- priority: e.priority ?? this.defaultEdgesPriorityFn()
1058
- }), this.htmlController.attachEdge(t);
1059
- }
1060
- updateEdge(e) {
1061
- const t = this.graphStore.getEdge(e.edgeId);
1062
- if (t === void 0)
1063
- throw new A("failed to update nonexisting edge");
1064
- if (e.shape !== void 0) {
1065
- const s = this.resolveEdgeType(t.from, t.to);
1066
- t.shape = e.shape(s), this.htmlController.updateEdgeShape(e.edgeId);
1067
- }
1068
- e.priority !== void 0 && (t.priority = e.priority, this.htmlController.updateEdgePriority(e.edgeId)), this.htmlController.updateEdge(e.edgeId);
1069
- }
1070
- updatePort(e, t) {
1071
- const s = this.graphStore.getPort(e);
1072
- if (s === void 0)
1073
- throw new A("failed to unset nonexisting port");
1074
- s.direction = t.direction ?? s.direction, s.centerFn = t.centerFn ?? s.centerFn, this.graphStore.getPortAdjacentEdgeIds(e).forEach((o) => {
1075
- this.htmlController.updateEdge(o);
1150
+ edgeId: o,
1151
+ from: t.from,
1152
+ to: t.to,
1153
+ shape: t.shape,
1154
+ priority: t.priority ?? this.defaultEdgesPriorityFn()
1155
+ }), this.htmlController.attachEdge(o);
1156
+ }
1157
+ updateEdge(t) {
1158
+ const o = this.graphStore.getEdge(t.edgeId);
1159
+ if (o === void 0)
1160
+ throw new S("failed to update nonexisting edge");
1161
+ t.shape !== void 0 && (o.shape = t.shape, this.htmlController.updateEdgeShape(t.edgeId)), t.priority !== void 0 && (o.priority = t.priority, this.htmlController.updateEdgePriority(t.edgeId)), t.from !== void 0 && this.graphStore.updateEdgeFrom(t.edgeId, t.from), t.to !== void 0 && this.graphStore.updateEdgeTo(t.edgeId, t.to), this.htmlController.renderEdge(t.edgeId);
1162
+ }
1163
+ updatePort(t, o) {
1164
+ const r = this.graphStore.getPort(t);
1165
+ if (r === void 0)
1166
+ throw new S("failed to unset nonexisting port");
1167
+ r.direction = o.direction ?? r.direction, this.graphStore.getPortAdjacentEdgeIds(t).forEach((i) => {
1168
+ this.htmlController.renderEdge(i);
1076
1169
  });
1077
1170
  }
1078
- updateNode(e, t) {
1079
- const s = this.graphStore.getNode(e);
1080
- if (s === void 0)
1081
- throw new A("failed to update nonexisting node");
1082
- s.x = (t == null ? void 0 : t.x) ?? s.x, s.y = (t == null ? void 0 : t.y) ?? s.y, s.centerFn = (t == null ? void 0 : t.centerFn) ?? s.centerFn, s.priority = (t == null ? void 0 : t.priority) ?? s.priority, this.htmlController.updateNodeCoordinates(e), this.htmlController.updateNodePriority(e), this.graphStore.getNodeAdjacentEdgeIds(e).forEach((o) => {
1083
- this.htmlController.updateEdge(o);
1171
+ updateNode(t, o) {
1172
+ const r = this.graphStore.getNode(t);
1173
+ if (r === void 0)
1174
+ throw new S("failed to update nonexisting node");
1175
+ r.x = (o == null ? void 0 : o.x) ?? r.x, r.y = (o == null ? void 0 : o.y) ?? r.y, r.centerFn = (o == null ? void 0 : o.centerFn) ?? r.centerFn, r.priority = (o == null ? void 0 : o.priority) ?? r.priority, this.htmlController.updateNodeCoordinates(t), this.htmlController.updateNodePriority(t), this.graphStore.getNodeAdjacentEdgeIds(t).forEach((i) => {
1176
+ this.htmlController.renderEdge(i);
1084
1177
  });
1085
1178
  }
1086
- removeEdge(e) {
1087
- if (this.graphStore.getEdge(e) === void 0)
1088
- throw new A("failed to remove nonexisting edge");
1089
- this.htmlController.detachEdge(e), this.graphStore.removeEdge(e);
1179
+ removeEdge(t) {
1180
+ if (this.graphStore.getEdge(t) === void 0)
1181
+ throw new S("failed to remove nonexisting edge");
1182
+ this.htmlController.detachEdge(t), this.graphStore.removeEdge(t);
1090
1183
  }
1091
- unmarkPort(e) {
1092
- if (this.graphStore.getPort(e) === void 0)
1093
- throw new A("failed to unset nonexisting port");
1094
- this.graphStore.getPortAdjacentEdgeIds(e).forEach((t) => {
1095
- this.removeEdge(t);
1096
- }), this.graphStore.removePort(e);
1184
+ unmarkPort(t) {
1185
+ if (this.graphStore.getPort(t) === void 0)
1186
+ throw new S("failed to unset nonexisting port");
1187
+ this.graphStore.getPortAdjacentEdgeIds(t).forEach((o) => {
1188
+ this.removeEdge(o);
1189
+ }), this.graphStore.removePort(t);
1097
1190
  }
1098
- removeNode(e) {
1099
- if (this.graphStore.getNode(e) === void 0)
1100
- throw new A("failed to remove nonexisting node");
1101
- this.graphStore.getNodePortIds(e).forEach((t) => {
1102
- this.unmarkPort(t);
1103
- }), this.htmlController.detachNode(e), this.graphStore.removeNode(e);
1191
+ removeNode(t) {
1192
+ if (this.graphStore.getNode(t) === void 0)
1193
+ throw new S("failed to remove nonexisting node");
1194
+ this.graphStore.getNodePortIds(t).forEach((o) => {
1195
+ this.unmarkPort(o);
1196
+ }), this.htmlController.detachNode(t), this.graphStore.removeNode(t);
1104
1197
  }
1105
- patchViewportMatrix(e) {
1106
- this.viewportTransformer.patchViewportMatrix(e), this.htmlController.applyTransform();
1198
+ patchViewportMatrix(t) {
1199
+ this.viewportTransformer.patchViewportMatrix(t), this.htmlController.applyTransform();
1107
1200
  }
1108
- patchContentMatrix(e) {
1109
- this.viewportTransformer.patchContentMatrix(e), this.htmlController.applyTransform();
1201
+ patchContentMatrix(t) {
1202
+ this.viewportTransformer.patchContentMatrix(t), this.htmlController.applyTransform();
1110
1203
  }
1111
1204
  clear() {
1112
1205
  this.htmlController.clear(), this.graphStore.clear(), this.nodeIdGenerator.reset(), this.portIdGenerator.reset(), this.edgeIdGenerator.reset();
@@ -1114,106 +1207,97 @@ class pe {
1114
1207
  destroy() {
1115
1208
  this.clear(), this.htmlController.destroy();
1116
1209
  }
1117
- resolveEdgeType(e, t) {
1118
- if (e === t)
1119
- return C.PortCycle;
1120
- const s = this.graphStore.getPortNodeId(e), n = this.graphStore.getPortNodeId(t);
1121
- return s === n ? C.NodeCycle : C.Regular;
1122
- }
1123
1210
  }
1124
- class xe {
1125
- constructor(e) {
1126
- a(this, "transformation");
1127
- a(this, "model");
1128
- a(this, "canvasController");
1129
- a(this, "edgeShapeFactory");
1130
- this.apiOptions = e;
1131
- const t = de(this.apiOptions), s = new ge(), n = new ce();
1132
- this.model = new le(n), this.transformation = new ue(s);
1133
- const o = new ve(n, s);
1134
- this.canvasController = new pe(
1211
+ class xt {
1212
+ constructor(t) {
1213
+ s(this, "transformation");
1214
+ s(this, "model");
1215
+ s(this, "canvasController");
1216
+ s(this, "edgeShapeFactory");
1217
+ this.apiOptions = t;
1218
+ const o = dt(this.apiOptions), r = new at(), n = new ct();
1219
+ this.model = new lt(n), this.transformation = new gt(r);
1220
+ const i = new ft(n, r);
1221
+ this.canvasController = new vt(
1135
1222
  n,
1136
- o,
1137
- s,
1138
- t.nodes.centerFn,
1139
- t.ports.centerFn,
1140
- t.ports.direction,
1141
- t.nodes.priorityFn,
1142
- t.edges.priorityFn
1143
- ), this.edgeShapeFactory = t.edges.shapeFactory;
1223
+ i,
1224
+ r,
1225
+ o.nodes.centerFn,
1226
+ o.ports.direction,
1227
+ o.nodes.priorityFn,
1228
+ o.edges.priorityFn
1229
+ ), this.edgeShapeFactory = o.edges.shapeFactory;
1144
1230
  }
1145
- attach(e) {
1146
- return this.canvasController.attach(e), this;
1231
+ attach(t) {
1232
+ return this.canvasController.attach(t), this;
1147
1233
  }
1148
1234
  detach() {
1149
1235
  return this.canvasController.detach(), this;
1150
1236
  }
1151
- addNode(e) {
1237
+ addNode(t) {
1152
1238
  return this.canvasController.addNode({
1153
- nodeId: e.id,
1154
- element: e.element,
1155
- x: e.x,
1156
- y: e.y,
1157
- ports: e.ports,
1158
- centerFn: e.centerFn,
1159
- priority: e.priority
1239
+ nodeId: t.id,
1240
+ element: t.element,
1241
+ x: t.x,
1242
+ y: t.y,
1243
+ ports: t.ports,
1244
+ centerFn: t.centerFn,
1245
+ priority: t.priority
1160
1246
  }), this;
1161
1247
  }
1162
- updateNode(e, t) {
1163
- return this.canvasController.updateNode(e, {
1164
- x: t == null ? void 0 : t.x,
1165
- y: t == null ? void 0 : t.y,
1166
- priority: t == null ? void 0 : t.priority,
1167
- centerFn: t == null ? void 0 : t.centerFn
1248
+ updateNode(t, o) {
1249
+ return this.canvasController.updateNode(t, {
1250
+ x: o == null ? void 0 : o.x,
1251
+ y: o == null ? void 0 : o.y,
1252
+ priority: o == null ? void 0 : o.priority,
1253
+ centerFn: o == null ? void 0 : o.centerFn
1168
1254
  }), this;
1169
1255
  }
1170
- removeNode(e) {
1171
- return this.canvasController.removeNode(e), this;
1256
+ removeNode(t) {
1257
+ return this.canvasController.removeNode(t), this;
1172
1258
  }
1173
- addEdge(e) {
1174
- const t = e.shape !== void 0 ? B(e.shape) : this.edgeShapeFactory;
1259
+ addEdge(t) {
1175
1260
  return this.canvasController.addEdge({
1176
- edgeId: e.id,
1177
- from: e.from,
1178
- to: e.to,
1179
- shapeFactory: t,
1180
- priority: e.priority
1261
+ edgeId: t.id,
1262
+ from: t.from,
1263
+ to: t.to,
1264
+ shape: t.shape ?? this.edgeShapeFactory(),
1265
+ priority: t.priority
1181
1266
  }), this;
1182
1267
  }
1183
- updateEdge(e, t) {
1184
- const s = (t == null ? void 0 : t.shape) !== void 0 ? B(t.shape) : void 0;
1268
+ updateEdge(t, o) {
1185
1269
  return this.canvasController.updateEdge({
1186
- edgeId: e,
1187
- shape: s,
1188
- priority: t == null ? void 0 : t.priority
1270
+ edgeId: t,
1271
+ shape: o == null ? void 0 : o.shape,
1272
+ priority: o == null ? void 0 : o.priority,
1273
+ from: o == null ? void 0 : o.from,
1274
+ to: o == null ? void 0 : o.to
1189
1275
  }), this;
1190
1276
  }
1191
- removeEdge(e) {
1192
- return this.canvasController.removeEdge(e), this;
1277
+ removeEdge(t) {
1278
+ return this.canvasController.removeEdge(t), this;
1193
1279
  }
1194
- markPort(e) {
1280
+ markPort(t) {
1195
1281
  return this.canvasController.markPort({
1196
- portId: e.id,
1197
- element: e.element,
1198
- nodeId: e.nodeId,
1199
- centerFn: e.centerFn,
1200
- direction: e.direction
1282
+ portId: t.id,
1283
+ element: t.element,
1284
+ nodeId: t.nodeId,
1285
+ direction: t.direction
1201
1286
  }), this;
1202
1287
  }
1203
- updatePortMark(e, t) {
1204
- return this.canvasController.updatePort(e, {
1205
- direction: t == null ? void 0 : t.direction,
1206
- centerFn: t == null ? void 0 : t.centerFn
1288
+ updatePort(t, o) {
1289
+ return this.canvasController.updatePort(t, {
1290
+ direction: o == null ? void 0 : o.direction
1207
1291
  }), this;
1208
1292
  }
1209
- unmarkPort(e) {
1210
- return this.canvasController.unmarkPort(e), this;
1293
+ unmarkPort(t) {
1294
+ return this.canvasController.unmarkPort(t), this;
1211
1295
  }
1212
- patchViewportMatrix(e) {
1213
- return this.canvasController.patchViewportMatrix(e), this;
1296
+ patchViewportMatrix(t) {
1297
+ return this.canvasController.patchViewportMatrix(t), this;
1214
1298
  }
1215
- patchContentMatrix(e) {
1216
- return this.canvasController.patchContentMatrix(e), this;
1299
+ patchContentMatrix(t) {
1300
+ return this.canvasController.patchContentMatrix(t), this;
1217
1301
  }
1218
1302
  clear() {
1219
1303
  return this.canvasController.clear(), this;
@@ -1222,374 +1306,389 @@ class xe {
1222
1306
  this.clear(), this.canvasController.destroy();
1223
1307
  }
1224
1308
  }
1225
- const D = (r, e, t) => {
1226
- const { x: s, y: n, width: o, height: h } = r.getBoundingClientRect();
1227
- return e >= s && e <= s + o && t >= n && t <= n + h;
1228
- }, k = (r, e, t) => e >= 0 && e <= r.innerWidth && t >= 0 && t <= r.innerHeight, V = (r, e) => {
1229
- e !== null ? r.style.cursor = e : r.style.removeProperty("cursor");
1309
+ const P = (e, t, o) => {
1310
+ const { x: r, y: n, width: i, height: c } = e.getBoundingClientRect();
1311
+ return t >= r && t <= r + i && o >= n && o <= n + c;
1312
+ }, L = (e, t, o) => t >= 0 && t <= e.innerWidth && o >= 0 && o <= e.innerHeight, D = (e, t) => {
1313
+ t !== null ? e.style.cursor = t : e.style.removeProperty("cursor");
1230
1314
  };
1231
- class fe {
1232
- constructor(e, t) {
1233
- a(this, "model");
1234
- a(this, "transformation");
1235
- a(this, "maxNodePriority", 0);
1236
- a(this, "nodes", /* @__PURE__ */ new Map());
1237
- a(this, "grabbedNodeId", null);
1238
- a(this, "onNodeDrag");
1239
- a(this, "onBeforeNodeDrag");
1240
- a(this, "nodeIdGenerator", new $(
1241
- (e) => this.nodes.has(e)
1315
+ class St {
1316
+ constructor(t, o) {
1317
+ s(this, "model");
1318
+ s(this, "transformation");
1319
+ s(this, "maxNodePriority", 0);
1320
+ s(this, "nodes", /* @__PURE__ */ new Map());
1321
+ s(this, "grabbedNodeId", null);
1322
+ s(this, "onNodeDrag");
1323
+ s(this, "onBeforeNodeDrag");
1324
+ s(this, "onNodeDragFinished");
1325
+ s(this, "nodeIdGenerator", new N(
1326
+ (t) => this.nodes.has(t)
1242
1327
  ));
1243
- a(this, "element", null);
1244
- a(this, "onWindowMouseMove", (e) => {
1245
- if (this.element !== null && (!D(this.element, e.clientX, e.clientY) || !k(this.window, e.clientX, e.clientY))) {
1328
+ s(this, "element", null);
1329
+ s(this, "onWindowMouseMove", (t) => {
1330
+ if (this.element !== null && (!P(this.element, t.clientX, t.clientY) || !L(this.window, t.clientX, t.clientY))) {
1246
1331
  this.cancelMouseDrag();
1247
1332
  return;
1248
1333
  }
1249
- this.grabbedNodeId !== null && this.dragNode(this.grabbedNodeId, e.movementX, e.movementY);
1334
+ this.grabbedNodeId !== null && this.dragNode(this.grabbedNodeId, t.movementX, t.movementY);
1250
1335
  });
1251
- a(this, "onWindowMouseUp", (e) => {
1252
- e.button === 0 && this.cancelMouseDrag();
1336
+ s(this, "onWindowMouseUp", (t) => {
1337
+ t.button === 0 && this.cancelMouseDrag();
1253
1338
  });
1254
- a(this, "onWindowTouchMove", (e) => {
1255
- if (e.touches.length !== 1)
1339
+ s(this, "onWindowTouchMove", (t) => {
1340
+ if (t.touches.length !== 1)
1256
1341
  return;
1257
- const t = e.touches[0];
1258
- if (this.element !== null && (!D(this.element, t.clientX, t.clientY) || !k(this.window, t.clientX, t.clientY))) {
1342
+ const o = t.touches[0];
1343
+ if (this.element !== null && (!P(this.element, o.clientX, o.clientY) || !L(this.window, o.clientX, o.clientY))) {
1259
1344
  this.cancelTouchDrag();
1260
1345
  return;
1261
1346
  }
1262
1347
  if (this.grabbedNodeId !== null && this.previousTouchCoords !== null) {
1263
- const s = t.clientX - this.previousTouchCoords.x, n = t.clientY - this.previousTouchCoords.y;
1264
- this.dragNode(this.grabbedNodeId, s, n), this.previousTouchCoords = {
1265
- x: e.touches[0].clientX,
1266
- y: e.touches[0].clientY
1348
+ const r = o.clientX - this.previousTouchCoords.x, n = o.clientY - this.previousTouchCoords.y;
1349
+ this.dragNode(this.grabbedNodeId, r, n), this.previousTouchCoords = {
1350
+ x: t.touches[0].clientX,
1351
+ y: t.touches[0].clientY
1267
1352
  };
1268
1353
  }
1269
1354
  });
1270
- a(this, "onWindowTouchFinish", (e) => {
1271
- e.touches.length > 0 ? this.previousTouchCoords = {
1272
- x: e.touches[0].clientX,
1273
- y: e.touches[0].clientY
1355
+ s(this, "onWindowTouchFinish", (t) => {
1356
+ t.touches.length > 0 ? this.previousTouchCoords = {
1357
+ x: t.touches[0].clientX,
1358
+ y: t.touches[0].clientY
1274
1359
  } : this.cancelTouchDrag();
1275
1360
  });
1276
- a(this, "previousTouchCoords", null);
1277
- a(this, "freezePriority");
1278
- a(this, "window", window);
1279
- a(this, "dragCursor");
1280
- var s, n;
1281
- this.canvas = e, this.transformation = this.canvas.transformation, this.model = this.canvas.model, this.onNodeDrag = ((s = t == null ? void 0 : t.events) == null ? void 0 : s.onNodeDrag) ?? (() => {
1282
- }), this.onBeforeNodeDrag = ((n = t == null ? void 0 : t.events) == null ? void 0 : n.onBeforeNodeDrag) ?? (() => !0), this.freezePriority = (t == null ? void 0 : t.moveOnTop) === !1, this.dragCursor = (t == null ? void 0 : t.dragCursor) !== void 0 ? t.dragCursor : "grab";
1283
- }
1284
- attach(e) {
1285
- return this.detach(), this.element = e, this.canvas.attach(this.element), this;
1361
+ s(this, "previousTouchCoords", null);
1362
+ s(this, "freezePriority");
1363
+ s(this, "window", window);
1364
+ s(this, "dragCursor");
1365
+ var r, n, i;
1366
+ this.canvas = t, this.transformation = this.canvas.transformation, this.model = this.canvas.model, this.onNodeDrag = ((r = o == null ? void 0 : o.events) == null ? void 0 : r.onNodeDrag) ?? (() => {
1367
+ }), this.onBeforeNodeDrag = ((n = o == null ? void 0 : o.events) == null ? void 0 : n.onBeforeNodeDrag) ?? (() => !0), this.onNodeDragFinished = ((i = o == null ? void 0 : o.events) == null ? void 0 : i.onNodeDragFinished) ?? (() => {
1368
+ }), this.freezePriority = (o == null ? void 0 : o.moveOnTop) === !1, this.dragCursor = (o == null ? void 0 : o.dragCursor) !== void 0 ? o.dragCursor : "grab";
1369
+ }
1370
+ attach(t) {
1371
+ return this.detach(), this.element = t, this.canvas.attach(this.element), this;
1286
1372
  }
1287
1373
  detach() {
1288
1374
  return this.canvas.detach(), this.element !== null && (this.element = null), this;
1289
1375
  }
1290
- addNode(e) {
1291
- const t = this.nodeIdGenerator.create(e.id);
1292
- this.canvas.addNode({ ...e, id: t }), this.updateMaxNodePriority(t);
1293
- const s = (o) => {
1294
- if (this.element === null || o.button !== 0)
1376
+ addNode(t) {
1377
+ const o = this.nodeIdGenerator.create(t.id);
1378
+ this.canvas.addNode({ ...t, id: o }), this.updateMaxNodePriority(o);
1379
+ const r = (i) => {
1380
+ if (this.element === null || i.button !== 0)
1295
1381
  return;
1296
- const h = this.model.getNode(t);
1382
+ const c = this.model.getNode(o);
1297
1383
  this.onBeforeNodeDrag({
1298
- nodeId: t,
1299
- element: e.element,
1300
- x: h.x,
1301
- y: h.y
1302
- }) && (o.stopImmediatePropagation(), this.grabbedNodeId = t, V(this.element, this.dragCursor), this.moveNodeOnTop(t), this.window.addEventListener("mouseup", this.onWindowMouseUp), this.window.addEventListener("mousemove", this.onWindowMouseMove));
1303
- }, n = (o) => {
1304
- o.stopImmediatePropagation(), this.previousTouchCoords = {
1305
- x: o.touches[0].clientX,
1306
- y: o.touches[0].clientY
1384
+ nodeId: o,
1385
+ element: t.element,
1386
+ x: c.x,
1387
+ y: c.y
1388
+ }) && (i.stopImmediatePropagation(), this.grabbedNodeId = o, D(this.element, this.dragCursor), this.moveNodeOnTop(o), this.window.addEventListener("mouseup", this.onWindowMouseUp), this.window.addEventListener("mousemove", this.onWindowMouseMove));
1389
+ }, n = (i) => {
1390
+ i.stopImmediatePropagation(), this.previousTouchCoords = {
1391
+ x: i.touches[0].clientX,
1392
+ y: i.touches[0].clientY
1307
1393
  };
1308
- const h = this.model.getNode(t);
1394
+ const c = this.model.getNode(o);
1309
1395
  this.onBeforeNodeDrag({
1310
- nodeId: t,
1311
- element: e.element,
1312
- x: h.x,
1313
- y: h.y
1314
- }) && o.touches.length === 1 && (this.grabbedNodeId = t, this.moveNodeOnTop(t), this.window.addEventListener("touchmove", this.onWindowTouchMove), this.window.addEventListener("touchend", this.onWindowTouchFinish), this.window.addEventListener("touchcancel", this.onWindowTouchFinish));
1396
+ nodeId: o,
1397
+ element: t.element,
1398
+ x: c.x,
1399
+ y: c.y
1400
+ }) && i.touches.length === 1 && (this.grabbedNodeId = o, this.moveNodeOnTop(o), this.window.addEventListener("touchmove", this.onWindowTouchMove), this.window.addEventListener("touchend", this.onWindowTouchFinish), this.window.addEventListener("touchcancel", this.onWindowTouchFinish));
1315
1401
  };
1316
- return this.nodes.set(t, {
1317
- element: e.element,
1318
- onMouseDown: s,
1402
+ return this.nodes.set(o, {
1403
+ element: t.element,
1404
+ onMouseDown: r,
1319
1405
  onTouchStart: n
1320
- }), e.element.addEventListener("mousedown", s), e.element.addEventListener("touchstart", n), this;
1406
+ }), t.element.addEventListener("mousedown", r), t.element.addEventListener("touchstart", n), this;
1321
1407
  }
1322
- updateNode(e, t) {
1323
- return this.canvas.updateNode(e, t), this.updateMaxNodePriority(e), this;
1408
+ updateNode(t, o) {
1409
+ return this.canvas.updateNode(t, o), this.updateMaxNodePriority(t), this;
1324
1410
  }
1325
- removeNode(e) {
1326
- const t = this.nodes.get(e);
1327
- return t !== void 0 && (t.element.removeEventListener("mousedown", t.onMouseDown), t.element.removeEventListener("touchstart", t.onTouchStart)), this.nodes.delete(e), this.canvas.removeNode(e), this;
1411
+ removeNode(t) {
1412
+ const o = this.nodes.get(t);
1413
+ return o !== void 0 && (o.element.removeEventListener("mousedown", o.onMouseDown), o.element.removeEventListener("touchstart", o.onTouchStart)), this.nodes.delete(t), this.canvas.removeNode(t), this;
1328
1414
  }
1329
- markPort(e) {
1330
- return this.canvas.markPort(e), this;
1415
+ markPort(t) {
1416
+ return this.canvas.markPort(t), this;
1331
1417
  }
1332
- updatePortMark(e, t) {
1333
- return this.canvas.updatePortMark(e, t), this;
1418
+ updatePort(t, o) {
1419
+ return this.canvas.updatePort(t, o), this;
1334
1420
  }
1335
- unmarkPort(e) {
1336
- return this.canvas.unmarkPort(e), this;
1421
+ unmarkPort(t) {
1422
+ return this.canvas.unmarkPort(t), this;
1337
1423
  }
1338
- addEdge(e) {
1339
- return this.canvas.addEdge(e), this;
1424
+ addEdge(t) {
1425
+ return this.canvas.addEdge(t), this;
1340
1426
  }
1341
- updateEdge(e, t) {
1342
- return this.canvas.updateEdge(e, t), this;
1427
+ updateEdge(t, o) {
1428
+ return this.canvas.updateEdge(t, o), this;
1343
1429
  }
1344
- removeEdge(e) {
1345
- return this.canvas.removeEdge(e), this;
1430
+ removeEdge(t) {
1431
+ return this.canvas.removeEdge(t), this;
1346
1432
  }
1347
- patchViewportMatrix(e) {
1348
- return this.canvas.patchViewportMatrix(e), this;
1433
+ patchViewportMatrix(t) {
1434
+ return this.canvas.patchViewportMatrix(t), this;
1349
1435
  }
1350
- patchContentMatrix(e) {
1351
- return this.canvas.patchContentMatrix(e), this;
1436
+ patchContentMatrix(t) {
1437
+ return this.canvas.patchContentMatrix(t), this;
1352
1438
  }
1353
1439
  clear() {
1354
- return this.canvas.clear(), this.nodes.forEach((e) => {
1355
- e.element.removeEventListener("mousedown", e.onMouseDown), e.element.removeEventListener("touchstart", e.onTouchStart);
1440
+ return this.canvas.clear(), this.nodes.forEach((t) => {
1441
+ t.element.removeEventListener("mousedown", t.onMouseDown), t.element.removeEventListener("touchstart", t.onTouchStart);
1356
1442
  }), this.nodes.clear(), this.maxNodePriority = 0, this;
1357
1443
  }
1358
1444
  destroy() {
1359
1445
  this.detach(), this.clear(), this.removeMouseDragListeners(), this.removeTouchDragListeners(), this.canvas.destroy();
1360
1446
  }
1361
- dragNode(e, t, s) {
1362
- const n = this.model.getNode(e);
1447
+ dragNode(t, o, r) {
1448
+ const n = this.model.getNode(t);
1363
1449
  if (n === null)
1364
1450
  return;
1365
- const o = this.canvas.transformation.getContentMatrix(), h = o.scale * n.x + o.dx, i = o.scale * n.y + o.dy, d = h + t, c = i + s, u = this.canvas.transformation.getViewportMatrix(), w = u.scale * d + u.dx, m = u.scale * c + u.dy;
1366
- this.canvas.updateNode(e, { x: w, y: m }), this.onNodeDrag({
1367
- nodeId: e,
1451
+ const i = this.canvas.transformation.getContentMatrix(), c = i.scale * n.x + i.dx, d = i.scale * n.y + i.dy, h = c + o, l = d + r, a = this.canvas.transformation.getViewportMatrix(), w = a.scale * h + a.dx, y = a.scale * l + a.dy;
1452
+ this.canvas.updateNode(t, { x: w, y }), this.onNodeDrag({
1453
+ nodeId: t,
1368
1454
  element: n.element,
1369
1455
  x: n.x,
1370
1456
  y: n.y
1371
1457
  });
1372
1458
  }
1373
- updateMaxNodePriority(e) {
1374
- const t = this.model.getNode(e).priority;
1375
- this.maxNodePriority = Math.max(this.maxNodePriority, t);
1459
+ updateMaxNodePriority(t) {
1460
+ const o = this.model.getNode(t).priority;
1461
+ this.maxNodePriority = Math.max(this.maxNodePriority, o);
1376
1462
  }
1377
- moveNodeOnTop(e) {
1463
+ moveNodeOnTop(t) {
1378
1464
  if (this.freezePriority)
1379
1465
  return;
1380
- this.maxNodePriority += 2, this.updateNode(e, { priority: this.maxNodePriority });
1381
- const t = this.maxNodePriority - 1;
1382
- this.model.getNodeAdjacentEdgeIds(e).forEach((n) => {
1383
- this.updateEdge(n, { priority: t });
1466
+ this.maxNodePriority += 2, this.updateNode(t, { priority: this.maxNodePriority });
1467
+ const o = this.maxNodePriority - 1;
1468
+ this.model.getNodeAdjacentEdgeIds(t).forEach((n) => {
1469
+ this.updateEdge(n, { priority: o });
1384
1470
  });
1385
1471
  }
1386
1472
  cancelMouseDrag() {
1387
- this.grabbedNodeId = null, this.element !== null && V(this.element, null), this.removeMouseDragListeners();
1473
+ const t = this.model.getNode(this.grabbedNodeId);
1474
+ t !== null && this.onNodeDragFinished({
1475
+ nodeId: this.grabbedNodeId,
1476
+ element: t.element,
1477
+ x: t.x,
1478
+ y: t.y
1479
+ }), this.grabbedNodeId = null, this.element !== null && D(this.element, null), this.removeMouseDragListeners();
1388
1480
  }
1389
1481
  removeMouseDragListeners() {
1390
1482
  this.window.removeEventListener("mouseup", this.onWindowMouseUp), this.window.removeEventListener("mousemove", this.onWindowMouseMove);
1391
1483
  }
1392
1484
  cancelTouchDrag() {
1393
- this.previousTouchCoords = null, this.grabbedNodeId = null, this.removeTouchDragListeners();
1485
+ this.previousTouchCoords = null;
1486
+ const t = this.model.getNode(this.grabbedNodeId);
1487
+ t !== null && this.onNodeDragFinished({
1488
+ nodeId: this.grabbedNodeId,
1489
+ element: t.element,
1490
+ x: t.x,
1491
+ y: t.y
1492
+ }), this.grabbedNodeId = null, this.removeTouchDragListeners();
1394
1493
  }
1395
1494
  removeTouchDragListeners() {
1396
1495
  this.window.removeEventListener("touchmove", this.onWindowTouchMove), this.window.removeEventListener("touchend", this.onWindowTouchFinish), this.window.removeEventListener("touchcancel", this.onWindowTouchFinish);
1397
1496
  }
1398
1497
  }
1399
- const Ee = (r) => {
1400
- const e = r.maxContentScale, t = r.minContentScale, s = e !== null ? 1 / e : 0, n = t !== null ? 1 / t : 1 / 0;
1401
- return (o) => {
1402
- let h = o.nextTransform.scale, i = o.nextTransform.dx, d = o.nextTransform.dy;
1403
- return o.nextTransform.scale > n && o.nextTransform.scale > o.prevTransform.scale && (h = Math.max(o.prevTransform.scale, n), i = o.prevTransform.dx, d = o.prevTransform.dy), o.nextTransform.scale < s && o.nextTransform.scale < o.prevTransform.scale && (h = Math.min(o.prevTransform.scale, s), i = o.prevTransform.dx, d = o.prevTransform.dy), {
1404
- scale: h,
1405
- dx: i,
1406
- dy: d
1407
- };
1498
+ const At = (e) => {
1499
+ const t = e.minX !== null ? e.minX : -1 / 0, o = e.maxX !== null ? e.maxX : 1 / 0, r = e.minY !== null ? e.minY : -1 / 0, n = e.maxY !== null ? e.maxY : 1 / 0;
1500
+ return (i) => {
1501
+ let c = i.nextTransform.dx, d = i.nextTransform.dy;
1502
+ c < t && c < i.prevTransform.dx && (c = Math.min(i.prevTransform.dx, t));
1503
+ const h = i.canvasWidth * i.prevTransform.scale;
1504
+ c > o - h && c > i.prevTransform.dx && (c = Math.max(i.prevTransform.dx, o - h)), d < r && d < i.prevTransform.dy && (d = Math.min(i.prevTransform.dy, r));
1505
+ const l = i.canvasHeight * i.prevTransform.scale;
1506
+ return d > n - l && d > i.prevTransform.dy && (d = Math.max(i.prevTransform.dy, n - l)), { scale: i.nextTransform.scale, dx: c, dy: d };
1408
1507
  };
1409
- }, Ae = (r) => {
1410
- const e = r.minX !== null ? r.minX : -1 / 0, t = r.maxX !== null ? r.maxX : 1 / 0, s = r.minY !== null ? r.minY : -1 / 0, n = r.maxY !== null ? r.maxY : 1 / 0;
1411
- return (o) => {
1412
- let h = o.nextTransform.dx, i = o.nextTransform.dy;
1413
- h < e && h < o.prevTransform.dx && (h = Math.min(o.prevTransform.dx, e));
1414
- const d = o.canvasWidth * o.prevTransform.scale;
1415
- h > t - d && h > o.prevTransform.dx && (h = Math.max(o.prevTransform.dx, t - d)), i < s && i < o.prevTransform.dy && (i = Math.min(o.prevTransform.dy, s));
1416
- const c = o.canvasHeight * o.prevTransform.scale;
1417
- return i > n - c && i > o.prevTransform.dy && (i = Math.max(o.prevTransform.dy, n - c)), { scale: o.nextTransform.scale, dx: h, dy: i };
1508
+ }, Et = (e) => {
1509
+ const t = e.maxContentScale, o = e.minContentScale, r = t !== null ? 1 / t : 0, n = o !== null ? 1 / o : 1 / 0;
1510
+ return (i) => {
1511
+ let c = i.nextTransform.scale, d = i.nextTransform.dx, h = i.nextTransform.dy;
1512
+ return i.nextTransform.scale > n && i.nextTransform.scale > i.prevTransform.scale && (c = Math.max(i.prevTransform.scale, n), d = i.prevTransform.dx, h = i.prevTransform.dy), i.nextTransform.scale < r && i.nextTransform.scale < i.prevTransform.scale && (c = Math.min(i.prevTransform.scale, r), d = i.prevTransform.dx, h = i.prevTransform.dy), {
1513
+ scale: c,
1514
+ dx: d,
1515
+ dy: h
1516
+ };
1418
1517
  };
1419
- }, J = (r) => {
1420
- if (typeof r == "function")
1421
- return r;
1422
- switch (r.type) {
1518
+ }, Tt = (e) => (t) => e.reduce(
1519
+ (o, r) => r({
1520
+ prevTransform: t.prevTransform,
1521
+ nextTransform: o,
1522
+ canvasWidth: t.canvasWidth,
1523
+ canvasHeight: t.canvasHeight
1524
+ }),
1525
+ t.nextTransform
1526
+ ), U = (e) => {
1527
+ if (typeof e == "function")
1528
+ return e;
1529
+ switch (e.type) {
1423
1530
  case "scale-limit":
1424
- return Ee({
1425
- minContentScale: r.minContentScale ?? 0,
1426
- maxContentScale: r.maxContentScale ?? 1 / 0
1531
+ return Et({
1532
+ minContentScale: e.minContentScale ?? 0,
1533
+ maxContentScale: e.maxContentScale ?? 1 / 0
1427
1534
  });
1428
1535
  case "shift-limit":
1429
- return Ae({
1430
- minX: r.minX ?? -1 / 0,
1431
- maxX: r.maxX ?? 1 / 0,
1432
- minY: r.minY ?? -1 / 0,
1433
- maxY: r.maxY ?? 1 / 0
1536
+ return At({
1537
+ minX: e.minX ?? -1 / 0,
1538
+ maxX: e.maxX ?? 1 / 0,
1539
+ minY: e.minY ?? -1 / 0,
1540
+ maxY: e.maxY ?? 1 / 0
1434
1541
  });
1435
1542
  }
1436
- }, Ce = (r) => (e) => r.reduce(
1437
- (t, s) => s({
1438
- prevTransform: e.prevTransform,
1439
- nextTransform: t,
1440
- canvasWidth: e.canvasWidth,
1441
- canvasHeight: e.canvasHeight
1442
- }),
1443
- e.nextTransform
1444
- ), Me = (r) => {
1445
- var d, c, u, w;
1446
- const e = (d = r == null ? void 0 : r.scale) == null ? void 0 : d.wheelSensitivity, t = e !== void 0 ? e : 1.2, s = r == null ? void 0 : r.transformPreprocessor;
1543
+ }, Mt = (e) => {
1544
+ var h, l, a, w;
1545
+ const t = (h = e == null ? void 0 : e.scale) == null ? void 0 : h.mouseWheelSensitivity, o = t !== void 0 ? t : 1.2, r = e == null ? void 0 : e.transformPreprocessor;
1447
1546
  let n;
1448
- s !== void 0 ? Array.isArray(s) ? n = Ce(
1449
- s.map(
1450
- (m) => J(m)
1547
+ r !== void 0 ? Array.isArray(r) ? n = Tt(
1548
+ r.map(
1549
+ (y) => U(y)
1451
1550
  )
1452
- ) : n = J(s) : n = (m) => m.nextTransform;
1453
- const o = ((c = r == null ? void 0 : r.shift) == null ? void 0 : c.cursor) !== void 0 ? r.shift.cursor : "grab", h = ((u = r == null ? void 0 : r.events) == null ? void 0 : u.onBeforeTransformStarted) ?? (() => {
1454
- }), i = ((w = r == null ? void 0 : r.events) == null ? void 0 : w.onTransformFinished) ?? (() => {
1551
+ ) : n = U(r) : n = (y) => y.nextTransform;
1552
+ const i = ((l = e == null ? void 0 : e.shift) == null ? void 0 : l.cursor) !== void 0 ? e.shift.cursor : "grab", c = ((a = e == null ? void 0 : e.events) == null ? void 0 : a.onBeforeTransformStarted) ?? (() => {
1553
+ }), d = ((w = e == null ? void 0 : e.events) == null ? void 0 : w.onTransformFinished) ?? (() => {
1455
1554
  });
1456
1555
  return {
1457
- wheelSensitivity: t,
1458
- onBeforeTransformStarted: h,
1459
- onTransformFinished: i,
1556
+ wheelSensitivity: o,
1557
+ onBeforeTransformStarted: c,
1558
+ onTransformFinished: d,
1460
1559
  transformPreprocessor: n,
1461
- shiftCursor: o
1560
+ shiftCursor: i
1462
1561
  };
1463
- }, z = (r) => {
1464
- const e = [], t = r.touches.length;
1465
- for (let i = 0; i < t; i++)
1466
- e.push([r.touches[i].clientX, r.touches[i].clientY]);
1467
- const s = e.reduce(
1468
- (i, d) => [i[0] + d[0], i[1] + d[1]],
1562
+ }, W = (e) => {
1563
+ const t = [], o = e.touches.length;
1564
+ for (let d = 0; d < o; d++)
1565
+ t.push([e.touches[d].clientX, e.touches[d].clientY]);
1566
+ const r = t.reduce(
1567
+ (d, h) => [d[0] + h[0], d[1] + h[1]],
1469
1568
  [0, 0]
1470
- ), n = [s[0] / t, s[1] / t], h = e.map((i) => [i[0] - n[0], i[1] - n[1]]).reduce(
1471
- (i, d) => i + Math.sqrt(d[0] * d[0] + d[1] * d[1]),
1569
+ ), n = [r[0] / o, r[1] / o], c = t.map((d) => [d[0] - n[0], d[1] - n[1]]).reduce(
1570
+ (d, h) => d + Math.sqrt(h[0] * h[0] + h[1] * h[1]),
1472
1571
  0
1473
1572
  );
1474
1573
  return {
1475
1574
  x: n[0],
1476
1575
  y: n[1],
1477
- scale: h / t,
1478
- touchesCnt: t,
1479
- touches: e
1576
+ scale: c / o,
1577
+ touchesCnt: o,
1578
+ touches: t
1480
1579
  };
1481
- }, Pe = (r, e, t) => ({
1482
- scale: r.scale,
1483
- dx: r.dx + r.scale * e,
1484
- dy: r.dy + r.scale * t
1485
- }), Se = (r, e, t, s) => ({
1486
- scale: r.scale * e,
1487
- dx: r.scale * (1 - e) * t + r.dx,
1488
- dy: r.scale * (1 - e) * s + r.dy
1580
+ }, Nt = (e, t, o) => ({
1581
+ scale: e.scale,
1582
+ dx: e.dx + e.scale * t,
1583
+ dy: e.dy + e.scale * o
1584
+ }), Ct = (e, t, o, r) => ({
1585
+ scale: e.scale * t,
1586
+ dx: e.scale * (1 - t) * o + e.dx,
1587
+ dy: e.scale * (1 - t) * r + e.dy
1489
1588
  });
1490
- class Ne {
1491
- constructor(e, t) {
1492
- a(this, "model");
1493
- a(this, "transformation");
1494
- a(this, "element", null);
1495
- a(this, "prevTouches", null);
1496
- a(this, "window", window);
1497
- a(this, "onMouseDown", (e) => {
1498
- this.element === null || e.button !== 0 || (V(this.element, this.options.shiftCursor), this.window.addEventListener("mousemove", this.onWindowMouseMove), this.window.addEventListener("mouseup", this.onWindowMouseUp));
1589
+ class Pt {
1590
+ constructor(t, o) {
1591
+ s(this, "model");
1592
+ s(this, "transformation");
1593
+ s(this, "element", null);
1594
+ s(this, "prevTouches", null);
1595
+ s(this, "window", window);
1596
+ s(this, "onMouseDown", (t) => {
1597
+ this.element === null || t.button !== 0 || (D(this.element, this.options.shiftCursor), this.window.addEventListener("mousemove", this.onWindowMouseMove), this.window.addEventListener("mouseup", this.onWindowMouseUp));
1499
1598
  });
1500
- a(this, "onWindowMouseMove", (e) => {
1501
- if (this.element === null || !D(this.element, e.clientX, e.clientY) || !k(this.window, e.clientX, e.clientY)) {
1599
+ s(this, "onWindowMouseMove", (t) => {
1600
+ if (this.element === null || !P(this.element, t.clientX, t.clientY) || !L(this.window, t.clientX, t.clientY)) {
1502
1601
  this.stopMouseDrag();
1503
1602
  return;
1504
1603
  }
1505
- const t = -e.movementX, s = -e.movementY;
1506
- this.moveViewport(this.element, t, s);
1604
+ const o = -t.movementX, r = -t.movementY;
1605
+ this.moveViewport(this.element, o, r);
1507
1606
  });
1508
- a(this, "onWindowMouseUp", (e) => {
1509
- this.element === null || e.button !== 0 || this.stopMouseDrag();
1607
+ s(this, "onWindowMouseUp", (t) => {
1608
+ this.element === null || t.button !== 0 || this.stopMouseDrag();
1510
1609
  });
1511
- a(this, "onWheelScroll", (e) => {
1512
- e.preventDefault();
1513
- const { left: t, top: s } = this.element.getBoundingClientRect(), n = e.clientX - t, o = e.clientY - s, i = 1 / (e.deltaY < 0 ? this.options.wheelSensitivity : 1 / this.options.wheelSensitivity);
1514
- this.scaleViewport(this.element, i, n, o);
1610
+ s(this, "onWheelScroll", (t) => {
1611
+ t.preventDefault();
1612
+ const { left: o, top: r } = this.element.getBoundingClientRect(), n = t.clientX - o, i = t.clientY - r, d = 1 / (t.deltaY < 0 ? this.options.wheelSensitivity : 1 / this.options.wheelSensitivity);
1613
+ this.scaleViewport(this.element, d, n, i);
1515
1614
  });
1516
- a(this, "onTouchStart", (e) => {
1517
- this.prevTouches = z(e), this.window.addEventListener("touchmove", this.onWindowTouchMove), this.window.addEventListener("touchend", this.onWindowTouchFinish), this.window.addEventListener("touchcancel", this.onWindowTouchFinish);
1615
+ s(this, "onTouchStart", (t) => {
1616
+ this.prevTouches = W(t), this.window.addEventListener("touchmove", this.onWindowTouchMove), this.window.addEventListener("touchend", this.onWindowTouchFinish), this.window.addEventListener("touchcancel", this.onWindowTouchFinish);
1518
1617
  });
1519
- a(this, "onWindowTouchMove", (e) => {
1520
- const t = this.element;
1521
- if (t === null)
1618
+ s(this, "onWindowTouchMove", (t) => {
1619
+ const o = this.element;
1620
+ if (o === null)
1522
1621
  return;
1523
- const s = z(e);
1524
- if (!s.touches.every(
1525
- (o) => D(t, o[0], o[1]) && k(this.window, o[0], o[1])
1622
+ const r = W(t);
1623
+ if (!r.touches.every(
1624
+ (i) => P(o, i[0], i[1]) && L(this.window, i[0], i[1])
1526
1625
  )) {
1527
1626
  this.stopTouchDrag();
1528
1627
  return;
1529
1628
  }
1530
- if ((s.touchesCnt === 1 || s.touchesCnt === 2) && this.moveViewport(
1531
- t,
1532
- -(s.x - this.prevTouches.x),
1533
- -(s.y - this.prevTouches.y)
1534
- ), s.touchesCnt === 2) {
1535
- const { left: o, top: h } = t.getBoundingClientRect(), i = this.prevTouches.x - o, d = this.prevTouches.y - h, u = 1 / (s.scale / this.prevTouches.scale);
1536
- this.scaleViewport(t, u, i, d);
1629
+ if ((r.touchesCnt === 1 || r.touchesCnt === 2) && this.moveViewport(
1630
+ o,
1631
+ -(r.x - this.prevTouches.x),
1632
+ -(r.y - this.prevTouches.y)
1633
+ ), r.touchesCnt === 2) {
1634
+ const { left: i, top: c } = o.getBoundingClientRect(), d = this.prevTouches.x - i, h = this.prevTouches.y - c, a = 1 / (r.scale / this.prevTouches.scale);
1635
+ this.scaleViewport(o, a, d, h);
1537
1636
  }
1538
- this.prevTouches = s;
1637
+ this.prevTouches = r;
1539
1638
  });
1540
- a(this, "onWindowTouchFinish", (e) => {
1541
- e.touches.length > 0 ? this.prevTouches = z(e) : this.stopTouchDrag();
1639
+ s(this, "onWindowTouchFinish", (t) => {
1640
+ t.touches.length > 0 ? this.prevTouches = W(t) : this.stopTouchDrag();
1542
1641
  });
1543
- a(this, "observer", new ResizeObserver(() => {
1544
- const e = this.canvas.transformation.getViewportMatrix(), { width: t, height: s } = this.element.getBoundingClientRect(), n = this.options.transformPreprocessor({
1545
- prevTransform: e,
1546
- nextTransform: e,
1547
- canvasWidth: t,
1548
- canvasHeight: s
1642
+ s(this, "observer", new ResizeObserver(() => {
1643
+ const t = this.canvas.transformation.getViewportMatrix(), { width: o, height: r } = this.element.getBoundingClientRect(), n = this.options.transformPreprocessor({
1644
+ prevTransform: t,
1645
+ nextTransform: t,
1646
+ canvasWidth: o,
1647
+ canvasHeight: r
1549
1648
  });
1550
1649
  this.canvas.patchViewportMatrix(n), this.options.onTransformFinished();
1551
1650
  }));
1552
- a(this, "options");
1553
- this.canvas = e, this.options = Me(t), this.transformation = this.canvas.transformation, this.model = this.canvas.model;
1651
+ s(this, "options");
1652
+ this.canvas = t, this.options = Mt(o), this.transformation = this.canvas.transformation, this.model = this.canvas.model;
1554
1653
  }
1555
- attach(e) {
1556
- return this.detach(), this.element = e, this.observer.observe(this.element), this.element.addEventListener("mousedown", this.onMouseDown), this.element.addEventListener("wheel", this.onWheelScroll), this.element.addEventListener("touchstart", this.onTouchStart), this.canvas.attach(this.element), this;
1654
+ attach(t) {
1655
+ return this.detach(), this.element = t, this.observer.observe(this.element), this.element.addEventListener("mousedown", this.onMouseDown), this.element.addEventListener("wheel", this.onWheelScroll), this.element.addEventListener("touchstart", this.onTouchStart), this.canvas.attach(this.element), this;
1557
1656
  }
1558
1657
  detach() {
1559
1658
  return this.canvas.detach(), this.element !== null && (this.observer.unobserve(this.element), this.element.removeEventListener("mousedown", this.onMouseDown), this.element.removeEventListener("wheel", this.onWheelScroll), this.element.removeEventListener("touchstart", this.onTouchStart), this.element = null), this;
1560
1659
  }
1561
- addNode(e) {
1562
- return this.canvas.addNode(e), this;
1660
+ addNode(t) {
1661
+ return this.canvas.addNode(t), this;
1563
1662
  }
1564
- updateNode(e, t) {
1565
- return this.canvas.updateNode(e, t), this;
1663
+ updateNode(t, o) {
1664
+ return this.canvas.updateNode(t, o), this;
1566
1665
  }
1567
- removeNode(e) {
1568
- return this.canvas.removeNode(e), this;
1666
+ removeNode(t) {
1667
+ return this.canvas.removeNode(t), this;
1569
1668
  }
1570
- markPort(e) {
1571
- return this.canvas.markPort(e), this;
1669
+ markPort(t) {
1670
+ return this.canvas.markPort(t), this;
1572
1671
  }
1573
- updatePortMark(e, t) {
1574
- return this.canvas.updatePortMark(e, t), this;
1672
+ updatePort(t, o) {
1673
+ return this.canvas.updatePort(t, o), this;
1575
1674
  }
1576
- unmarkPort(e) {
1577
- return this.canvas.unmarkPort(e), this;
1675
+ unmarkPort(t) {
1676
+ return this.canvas.unmarkPort(t), this;
1578
1677
  }
1579
- addEdge(e) {
1580
- return this.canvas.addEdge(e), this;
1678
+ addEdge(t) {
1679
+ return this.canvas.addEdge(t), this;
1581
1680
  }
1582
- updateEdge(e, t) {
1583
- return this.canvas.updateEdge(e, t), this;
1681
+ updateEdge(t, o) {
1682
+ return this.canvas.updateEdge(t, o), this;
1584
1683
  }
1585
- removeEdge(e) {
1586
- return this.canvas.removeEdge(e), this;
1684
+ removeEdge(t) {
1685
+ return this.canvas.removeEdge(t), this;
1587
1686
  }
1588
- patchViewportMatrix(e) {
1589
- return this.canvas.patchViewportMatrix(e), this;
1687
+ patchViewportMatrix(t) {
1688
+ return this.canvas.patchViewportMatrix(t), this;
1590
1689
  }
1591
- patchContentMatrix(e) {
1592
- return this.canvas.patchContentMatrix(e), this;
1690
+ patchContentMatrix(t) {
1691
+ return this.canvas.patchContentMatrix(t), this;
1593
1692
  }
1594
1693
  clear() {
1595
1694
  return this.canvas.clear(), this;
@@ -1597,28 +1696,28 @@ class Ne {
1597
1696
  destroy() {
1598
1697
  this.detach(), this.removeMouseDragListeners(), this.removeTouchDragListeners(), this.canvas.destroy();
1599
1698
  }
1600
- moveViewport(e, t, s) {
1699
+ moveViewport(t, o, r) {
1601
1700
  this.options.onBeforeTransformStarted();
1602
- const n = this.transformation.getViewportMatrix(), o = Pe(n, t, s), { width: h, height: i } = e.getBoundingClientRect(), d = this.options.transformPreprocessor({
1701
+ const n = this.transformation.getViewportMatrix(), i = Nt(n, o, r), { width: c, height: d } = t.getBoundingClientRect(), h = this.options.transformPreprocessor({
1603
1702
  prevTransform: n,
1604
- nextTransform: o,
1605
- canvasWidth: h,
1606
- canvasHeight: i
1703
+ nextTransform: i,
1704
+ canvasWidth: c,
1705
+ canvasHeight: d
1607
1706
  });
1608
- this.canvas.patchViewportMatrix(d), this.options.onTransformFinished();
1707
+ this.canvas.patchViewportMatrix(h), this.options.onTransformFinished();
1609
1708
  }
1610
- scaleViewport(e, t, s, n) {
1709
+ scaleViewport(t, o, r, n) {
1611
1710
  this.options.onBeforeTransformStarted();
1612
- const o = this.canvas.transformation.getViewportMatrix(), h = Se(o, t, s, n), { width: i, height: d } = e.getBoundingClientRect(), c = this.options.transformPreprocessor({
1613
- prevTransform: o,
1614
- nextTransform: h,
1615
- canvasWidth: i,
1616
- canvasHeight: d
1711
+ const i = this.canvas.transformation.getViewportMatrix(), c = Ct(i, o, r, n), { width: d, height: h } = t.getBoundingClientRect(), l = this.options.transformPreprocessor({
1712
+ prevTransform: i,
1713
+ nextTransform: c,
1714
+ canvasWidth: d,
1715
+ canvasHeight: h
1617
1716
  });
1618
- this.canvas.patchViewportMatrix(c), this.options.onTransformFinished();
1717
+ this.canvas.patchViewportMatrix(l), this.options.onTransformFinished();
1619
1718
  }
1620
1719
  stopMouseDrag() {
1621
- this.element !== null && V(this.element, null), this.removeMouseDragListeners();
1720
+ this.element !== null && D(this.element, null), this.removeMouseDragListeners();
1622
1721
  }
1623
1722
  removeMouseDragListeners() {
1624
1723
  this.window.removeEventListener("mousemove", this.onWindowMouseMove), this.window.removeEventListener("mouseup", this.onWindowMouseUp);
@@ -1630,103 +1729,103 @@ class Ne {
1630
1729
  this.window.removeEventListener("touchmove", this.onWindowTouchMove), this.window.removeEventListener("touchend", this.onWindowTouchFinish), this.window.removeEventListener("touchcancel", this.onWindowTouchFinish);
1631
1730
  }
1632
1731
  }
1633
- class Te {
1732
+ class Lt {
1634
1733
  constructor() {
1635
- a(this, "keyMap", /* @__PURE__ */ new Map());
1636
- a(this, "valueMap", /* @__PURE__ */ new Map());
1734
+ s(this, "keyMap", /* @__PURE__ */ new Map());
1735
+ s(this, "valueMap", /* @__PURE__ */ new Map());
1637
1736
  }
1638
- set(e, t) {
1639
- this.keyMap.set(e, t), this.valueMap.set(t, e);
1737
+ set(t, o) {
1738
+ this.keyMap.set(t, o), this.valueMap.set(o, t);
1640
1739
  }
1641
- hasKey(e) {
1642
- return this.keyMap.has(e);
1740
+ hasKey(t) {
1741
+ return this.keyMap.has(t);
1643
1742
  }
1644
- hasValue(e) {
1645
- return this.valueMap.has(e);
1743
+ hasValue(t) {
1744
+ return this.valueMap.has(t);
1646
1745
  }
1647
- getByKey(e) {
1648
- return this.keyMap.get(e);
1746
+ getByKey(t) {
1747
+ return this.keyMap.get(t);
1649
1748
  }
1650
- getByValue(e) {
1651
- return this.valueMap.get(e);
1749
+ getByValue(t) {
1750
+ return this.valueMap.get(t);
1652
1751
  }
1653
- deleteByKey(e) {
1654
- const t = this.keyMap.get(e);
1655
- t !== void 0 && this.valueMap.delete(t), this.keyMap.delete(e);
1752
+ deleteByKey(t) {
1753
+ const o = this.keyMap.get(t);
1754
+ o !== void 0 && this.valueMap.delete(o), this.keyMap.delete(t);
1656
1755
  }
1657
- deleteByValue(e) {
1658
- const t = this.valueMap.get(e);
1659
- t !== void 0 && this.keyMap.delete(t), this.valueMap.delete(e);
1756
+ deleteByValue(t) {
1757
+ const o = this.valueMap.get(t);
1758
+ o !== void 0 && this.keyMap.delete(o), this.valueMap.delete(t);
1660
1759
  }
1661
- forEach(e) {
1662
- this.keyMap.forEach((t, s) => {
1663
- e(t, s);
1760
+ forEach(t) {
1761
+ this.keyMap.forEach((o, r) => {
1762
+ t(o, r);
1664
1763
  });
1665
1764
  }
1666
1765
  clear() {
1667
1766
  this.keyMap.clear(), this.valueMap.clear();
1668
1767
  }
1669
1768
  }
1670
- class Le {
1671
- constructor(e) {
1672
- a(this, "transformation");
1673
- a(this, "model");
1674
- a(this, "nodes", new Te());
1675
- a(this, "nodeIdGenerator", new $(
1676
- (e) => this.nodes.hasKey(e)
1769
+ class Dt {
1770
+ constructor(t) {
1771
+ s(this, "transformation");
1772
+ s(this, "model");
1773
+ s(this, "nodes", new Lt());
1774
+ s(this, "nodeIdGenerator", new N(
1775
+ (t) => this.nodes.hasKey(t)
1677
1776
  ));
1678
- a(this, "nodesResizeObserver");
1679
- this.canvas = e, this.nodesResizeObserver = new window.ResizeObserver((t) => {
1680
- t.forEach((s) => {
1681
- const n = s.target;
1777
+ s(this, "nodesResizeObserver");
1778
+ this.canvas = t, this.nodesResizeObserver = new window.ResizeObserver((o) => {
1779
+ o.forEach((r) => {
1780
+ const n = r.target;
1682
1781
  this.reactNodeChange(n);
1683
1782
  });
1684
1783
  }), this.transformation = this.canvas.transformation, this.model = this.canvas.model;
1685
1784
  }
1686
- attach(e) {
1687
- return this.canvas.attach(e), this;
1785
+ attach(t) {
1786
+ return this.canvas.attach(t), this;
1688
1787
  }
1689
1788
  detach() {
1690
1789
  return this.canvas.detach(), this;
1691
1790
  }
1692
- addNode(e) {
1693
- const t = this.nodeIdGenerator.create(e.id);
1791
+ addNode(t) {
1792
+ const o = this.nodeIdGenerator.create(t.id);
1694
1793
  return this.canvas.addNode({
1695
- ...e,
1696
- id: t
1697
- }), this.nodes.set(t, e.element), this.nodesResizeObserver.observe(e.element), this;
1794
+ ...t,
1795
+ id: o
1796
+ }), this.nodes.set(o, t.element), this.nodesResizeObserver.observe(t.element), this;
1698
1797
  }
1699
- updateNode(e, t) {
1700
- return this.canvas.updateNode(e, t), this;
1798
+ updateNode(t, o) {
1799
+ return this.canvas.updateNode(t, o), this;
1701
1800
  }
1702
- removeNode(e) {
1703
- this.canvas.removeNode(e);
1704
- const t = this.nodes.getByKey(e);
1705
- return this.nodes.deleteByKey(e), this.nodesResizeObserver.unobserve(t), this;
1801
+ removeNode(t) {
1802
+ this.canvas.removeNode(t);
1803
+ const o = this.nodes.getByKey(t);
1804
+ return this.nodes.deleteByKey(t), this.nodesResizeObserver.unobserve(o), this;
1706
1805
  }
1707
- markPort(e) {
1708
- return this.canvas.markPort(e), this;
1806
+ markPort(t) {
1807
+ return this.canvas.markPort(t), this;
1709
1808
  }
1710
- updatePortMark(e, t) {
1711
- return this.canvas.updatePortMark(e, t), this;
1809
+ updatePort(t, o) {
1810
+ return this.canvas.updatePort(t, o), this;
1712
1811
  }
1713
- unmarkPort(e) {
1714
- return this.canvas.unmarkPort(e), this;
1812
+ unmarkPort(t) {
1813
+ return this.canvas.unmarkPort(t), this;
1715
1814
  }
1716
- addEdge(e) {
1717
- return this.canvas.addEdge(e), this;
1815
+ addEdge(t) {
1816
+ return this.canvas.addEdge(t), this;
1718
1817
  }
1719
- updateEdge(e, t) {
1720
- return this.canvas.updateEdge(e, t), this;
1818
+ updateEdge(t, o) {
1819
+ return this.canvas.updateEdge(t, o), this;
1721
1820
  }
1722
- removeEdge(e) {
1723
- return this.canvas.removeEdge(e), this;
1821
+ removeEdge(t) {
1822
+ return this.canvas.removeEdge(t), this;
1724
1823
  }
1725
- patchViewportMatrix(e) {
1726
- return this.canvas.patchViewportMatrix(e), this;
1824
+ patchViewportMatrix(t) {
1825
+ return this.canvas.patchViewportMatrix(t), this;
1727
1826
  }
1728
- patchContentMatrix(e) {
1729
- return this.canvas.patchContentMatrix(e), this;
1827
+ patchContentMatrix(t) {
1828
+ return this.canvas.patchContentMatrix(t), this;
1730
1829
  }
1731
1830
  clear() {
1732
1831
  return this.canvas.clear(), this.nodesResizeObserver.disconnect(), this.nodes.clear(), this;
@@ -1734,57 +1833,48 @@ class Le {
1734
1833
  destroy() {
1735
1834
  this.clear(), this.canvas.destroy();
1736
1835
  }
1737
- reactNodeChange(e) {
1738
- const t = this.nodes.getByValue(e);
1739
- this.canvas.updateNode(t), this.model.getNodeAdjacentEdgeIds(t).forEach((n) => {
1836
+ reactNodeChange(t) {
1837
+ const o = this.nodes.getByValue(t);
1838
+ this.canvas.updateNode(o), this.model.getNodeAdjacentEdgeIds(o).forEach((n) => {
1740
1839
  this.canvas.updateEdge(n);
1741
1840
  });
1742
1841
  }
1743
1842
  }
1744
- class Ie {
1843
+ class mt {
1745
1844
  constructor() {
1746
- a(this, "coreOptions");
1747
- a(this, "dragOptions");
1748
- a(this, "transformOptions");
1749
- a(this, "isDraggable", !1);
1750
- a(this, "isTransformable", !1);
1751
- a(this, "hasResizeReactiveNodes", !1);
1845
+ s(this, "coreOptions");
1846
+ s(this, "dragOptions");
1847
+ s(this, "transformOptions");
1848
+ s(this, "isDraggable", !1);
1849
+ s(this, "isTransformable", !1);
1850
+ s(this, "hasResizeReactiveNodes", !1);
1752
1851
  }
1753
- setOptions(e) {
1754
- return this.coreOptions = e, this;
1852
+ setOptions(t) {
1853
+ return this.coreOptions = t, this;
1755
1854
  }
1756
- setUserDraggableNodes(e) {
1757
- return this.isDraggable = !0, this.dragOptions = e, this;
1855
+ setUserDraggableNodes(t) {
1856
+ return this.isDraggable = !0, this.dragOptions = t, this;
1758
1857
  }
1759
- setUserTransformableCanvas(e) {
1760
- return this.isTransformable = !0, this.transformOptions = e, this;
1858
+ setUserTransformableCanvas(t) {
1859
+ return this.isTransformable = !0, this.transformOptions = t, this;
1761
1860
  }
1762
- setResizableReactiveNodes() {
1861
+ setResizeReactiveNodes() {
1763
1862
  return this.hasResizeReactiveNodes = !0, this;
1764
1863
  }
1765
1864
  build() {
1766
- let e = new xe(this.coreOptions);
1767
- return this.hasResizeReactiveNodes && (e = new Le(e)), this.isDraggable && (e = new fe(e, this.dragOptions)), this.isTransformable && (e = new Ne(e, this.transformOptions)), e;
1865
+ let t = new xt(this.coreOptions);
1866
+ return this.hasResizeReactiveNodes && (t = new Dt(t)), this.isDraggable && (t = new St(t, this.dragOptions)), this.isTransformable && (t = new Pt(t, this.transformOptions)), t;
1768
1867
  }
1769
1868
  }
1770
1869
  export {
1771
- O as BezierEdgeShape,
1772
- xe as CanvasCore,
1773
- re as CycleCircleEdgeShape,
1774
- X as CycleSquareEdgeShape,
1775
- se as DetourBezierEdgeShape,
1776
- G as DetourStraightEdgeShape,
1777
- C as EdgeType,
1778
- ee as HorizontalEdgeShape,
1779
- Ie as HtmlGraphBuilder,
1780
- A as HtmlGraphError,
1781
- Le as ResizeReactiveNodesCanvas,
1782
- q as StraightEdgeShape,
1783
- fe as UserDraggableNodesCanvas,
1784
- Ne as UserTransformableCanvas,
1785
- te as VerticalEdgeShape,
1786
- oe as createBezierEdgeShapeFactory,
1787
- ae as createHorizontalEdgeShapeFactory,
1788
- ne as createStraightEdgeShareFactory,
1789
- ie as createVerticalEdgeShapeFactory
1870
+ ot as BezierEdgeShape,
1871
+ xt as CanvasCore,
1872
+ rt as HorizontalEdgeShape,
1873
+ mt as HtmlGraphBuilder,
1874
+ S as HtmlGraphError,
1875
+ Dt as ResizeReactiveNodesCanvas,
1876
+ it as StraightEdgeShape,
1877
+ St as UserDraggableNodesCanvas,
1878
+ Pt as UserTransformableCanvas,
1879
+ nt as VerticalEdgeShape
1790
1880
  };