@html-graph/html-graph 8.18.1 → 8.19.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,22 +1,22 @@
1
- var st = Object.defineProperty;
2
- var it = (r, e, t) => e in r ? st(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
3
- var i = (r, e, t) => it(r, typeof e != "symbol" ? e + "" : e, t);
1
+ var nt = Object.defineProperty;
2
+ var at = (r, e, t) => e in r ? nt(r, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[e] = t;
3
+ var i = (r, e, t) => at(r, typeof e != "symbol" ? e + "" : e, t);
4
4
  var I = /* @__PURE__ */ ((r) => (r.Line = "line", r.NodeCycle = "node-cycle", r.PortCycle = "port-cycle", r))(I || {});
5
- const nt = () => {
5
+ const ht = () => {
6
6
  const r = document.createElement("div");
7
7
  return r.style.width = "100%", r.style.height = "100%", r.style.position = "relative", r.style.overflow = "hidden", r;
8
- }, at = () => {
8
+ }, dt = () => {
9
9
  const r = document.createElement("div");
10
10
  return r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.width = "0", r.style.height = "0", r;
11
- }, ht = (r) => {
11
+ }, ct = (r) => {
12
12
  r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.visibility = "hidden";
13
- }, dt = (r) => {
13
+ }, lt = (r) => {
14
14
  r.style.removeProperty("position"), r.style.removeProperty("top"), r.style.removeProperty("left"), r.style.removeProperty("visibility"), r.style.removeProperty("transform");
15
15
  };
16
- class Re {
16
+ class Ve {
17
17
  constructor(e, t, o) {
18
- i(this, "host", nt());
19
- i(this, "container", at());
18
+ i(this, "host", ht());
19
+ i(this, "container", dt());
20
20
  i(this, "edgeIdToElementMap", /* @__PURE__ */ new Map());
21
21
  i(this, "attachedNodeIds", /* @__PURE__ */ new Set());
22
22
  i(this, "applyTransform", () => {
@@ -27,11 +27,11 @@ class Re {
27
27
  }
28
28
  attachNode(e) {
29
29
  const t = this.graphStore.getNode(e);
30
- ht(t.element), this.attachedNodeIds.add(e), this.container.appendChild(t.element), this.updateNodePosition(e), this.updateNodePriority(e), t.element.style.visibility = "visible";
30
+ ct(t.element), this.attachedNodeIds.add(e), this.container.appendChild(t.element), this.updateNodePosition(e), this.updateNodePriority(e), t.element.style.visibility = "visible";
31
31
  }
32
32
  detachNode(e) {
33
33
  const t = this.graphStore.getNode(e);
34
- dt(t.element), this.container.removeChild(t.element), this.attachedNodeIds.delete(e);
34
+ lt(t.element), this.container.removeChild(t.element), this.attachedNodeIds.delete(e);
35
35
  }
36
36
  attachEdge(e) {
37
37
  const t = this.graphStore.getEdge(e).payload.shape.svg;
@@ -93,7 +93,7 @@ class Re {
93
93
  };
94
94
  }
95
95
  }
96
- class ct {
96
+ class ut {
97
97
  constructor(e) {
98
98
  i(this, "xFrom", 1 / 0);
99
99
  i(this, "yFrom", 1 / 0);
@@ -113,7 +113,7 @@ class ct {
113
113
  return h <= this.xTo && d >= this.xFrom && c <= this.yTo && l >= this.yFrom;
114
114
  }
115
115
  }
116
- class lt {
116
+ class gt {
117
117
  constructor(e, t, o, s) {
118
118
  i(this, "attachedNodes", /* @__PURE__ */ new Set());
119
119
  i(this, "attachedEdges", /* @__PURE__ */ new Set());
@@ -137,7 +137,7 @@ class lt {
137
137
  this.handleAttachEdge(a);
138
138
  });
139
139
  });
140
- this.htmlView = e, this.graphStore = t, this.trigger = o, this.params = s, this.renderingBox = new ct(this.graphStore), this.trigger.subscribe(this.updateViewport);
140
+ this.htmlView = e, this.graphStore = t, this.trigger = o, this.params = s, this.renderingBox = new ut(this.graphStore), this.trigger.subscribe(this.updateViewport);
141
141
  }
142
142
  attachNode(e) {
143
143
  this.renderingBox.hasNode(e) && this.handleAttachNode(e);
@@ -191,7 +191,7 @@ class lt {
191
191
  this.htmlView.detachEdge(e), this.attachedEdges.delete(e);
192
192
  }
193
193
  }
194
- class ut {
194
+ class pt {
195
195
  constructor(e, t) {
196
196
  i(this, "deferredNodes", /* @__PURE__ */ new Set());
197
197
  i(this, "deferredEdges", /* @__PURE__ */ new Set());
@@ -265,7 +265,7 @@ const C = () => {
265
265
  const r = new q();
266
266
  return [r, r];
267
267
  };
268
- class Le {
268
+ class Ie {
269
269
  constructor(e, t, o, s) {
270
270
  i(this, "beforeDestroyEmitter");
271
271
  i(this, "destroyed", !1);
@@ -318,7 +318,7 @@ class Le {
318
318
  this.destroyed || (this.destroyed = !0, this.beforeDestroyEmitter.emit(), this.graphController.destroy(), this.viewportController.destroy());
319
319
  }
320
320
  }
321
- class gt {
321
+ class wt {
322
322
  constructor() {
323
323
  i(this, "singleToMultiMap", /* @__PURE__ */ new Map());
324
324
  i(this, "multiToSingleMap", /* @__PURE__ */ new Map());
@@ -387,7 +387,7 @@ const S = Object.freeze({
387
387
  removeNonexistentEdge: (r) => `Failed to remove edge with ID ${JSON.stringify(r)} because it does not exist`,
388
388
  accessEdgesForNonexistentPort: (r) => `Failed to access edges for port with ID ${JSON.stringify(r)} because the port does not exist`
389
389
  });
390
- class Ve {
390
+ class Fe {
391
391
  constructor() {
392
392
  i(this, "nodes", /* @__PURE__ */ new Map());
393
393
  i(this, "ports", /* @__PURE__ */ new Map());
@@ -396,7 +396,7 @@ class Ve {
396
396
  i(this, "portIncomingEdges", /* @__PURE__ */ new Map());
397
397
  i(this, "portOutgoingEdges", /* @__PURE__ */ new Map());
398
398
  i(this, "portCycleEdges", /* @__PURE__ */ new Map());
399
- i(this, "elementPorts", new gt());
399
+ i(this, "elementPorts", new wt());
400
400
  i(this, "edgesElementsMap", /* @__PURE__ */ new Map());
401
401
  i(this, "afterNodeAddedEmitter");
402
402
  i(this, "onAfterNodeAdded");
@@ -694,7 +694,7 @@ const me = (r) => ({
694
694
  x: r.scale * e.x + r.x,
695
695
  y: r.scale * e.y + r.y
696
696
  });
697
- class pt {
697
+ class ft {
698
698
  constructor(e) {
699
699
  i(this, "viewportMatrix", Ee);
700
700
  i(this, "contentMatrix", Ee);
@@ -776,16 +776,16 @@ class ee {
776
776
  this.canvas.updateNode(t);
777
777
  }
778
778
  }
779
- const wt = (r, e, t) => {
779
+ const yt = (r, e, t) => {
780
780
  const { x: o, y: s, width: n, height: a } = r.getBoundingClientRect();
781
781
  return e >= o && e <= o + n && t >= s && t <= s + a;
782
- }, ft = (r, e, t) => e >= 0 && e <= r.innerWidth && t >= 0 && t <= r.innerHeight;
783
- class yt {
782
+ }, vt = (r, e, t) => e >= 0 && e <= r.innerWidth && t >= 0 && t <= r.innerHeight;
783
+ class mt {
784
784
  constructor(e, t) {
785
785
  this.element = e, this.win = t;
786
786
  }
787
787
  verify(e, t) {
788
- return wt(this.element, e, t) && ft(this.win, e, t);
788
+ return yt(this.element, e, t) && vt(this.win, e, t);
789
789
  }
790
790
  }
791
791
  const H = (r, e) => {
@@ -805,7 +805,7 @@ const H = (r, e) => {
805
805
  }
806
806
  ]
807
807
  };
808
- }, vt = (r, e) => {
808
+ }, Et = (r, e) => {
809
809
  let t = e;
810
810
  for (; t !== null; ) {
811
811
  const o = r.findPortIdsByElement(t)[0] ?? null;
@@ -824,21 +824,21 @@ const H = (r, e) => {
824
824
  status: "notFound"
825
825
  };
826
826
  };
827
- function* Ie(r, e) {
827
+ function* Ue(r, e) {
828
828
  const t = r.elementsFromPoint(e.x, e.y);
829
829
  for (const o of t) {
830
830
  if (o.shadowRoot !== null) {
831
- const s = Ie(o.shadowRoot, e);
831
+ const s = Ue(o.shadowRoot, e);
832
832
  for (const n of s)
833
833
  yield n;
834
834
  }
835
835
  yield o;
836
836
  }
837
837
  }
838
- const Fe = (r, e) => {
839
- const t = Ie(document, e);
838
+ const $e = (r, e) => {
839
+ const t = Ue(document, e);
840
840
  for (const o of t) {
841
- const s = vt(r, o);
841
+ const s = Et(r, o);
842
842
  if (s.status === "portFound")
843
843
  return s.portId;
844
844
  if (s.status === "nodeEncountered")
@@ -847,13 +847,13 @@ const Fe = (r, e) => {
847
847
  return null;
848
848
  };
849
849
  var M = /* @__PURE__ */ ((r) => (r.StaticNodeId = "static", r.DraggingNodeId = "dragging", r.EdgeId = "edge", r))(M || {});
850
- const Ue = (r, e) => ({
850
+ const Be = (r, e) => ({
851
851
  x: r / 2,
852
852
  y: e / 2
853
853
  }), m = (r, e, t) => ({
854
854
  x: e.x * r.x - e.y * r.y + ((1 - e.x) * t.x + e.y * t.y),
855
855
  y: e.y * r.x + e.x * r.y + ((1 - e.x) * t.y - e.y * t.x)
856
- }), $e = (r, e, t) => {
856
+ }), Oe = (r, e, t) => {
857
857
  const o = {
858
858
  x: r.x + r.width / 2,
859
859
  y: r.y + r.height / 2
@@ -870,7 +870,7 @@ const Ue = (r, e) => ({
870
870
  to: { x: s.x - n, y: s.y - a }
871
871
  };
872
872
  };
873
- class mt {
873
+ class xt {
874
874
  constructor(e) {
875
875
  i(this, "path");
876
876
  i(this, "midpoint");
@@ -903,7 +903,7 @@ class mt {
903
903
  this.path = `${E}${y}${x}`;
904
904
  }
905
905
  }
906
- class Et {
906
+ class At {
907
907
  constructor(e) {
908
908
  i(this, "path");
909
909
  i(this, "midpoint");
@@ -970,16 +970,16 @@ class Et {
970
970
  }
971
971
  const te = Object.freeze({
972
972
  edgeColor: "--edge-color"
973
- }), Be = (r) => {
973
+ }), We = (r) => {
974
974
  const e = document.createElementNS("http://www.w3.org/2000/svg", "svg");
975
975
  return e.style.pointerEvents = "none", e.style.position = "absolute", e.style.top = "0", e.style.left = "0", e.style.overflow = "visible", e.style.setProperty(te.edgeColor, r), e;
976
- }, Oe = (r) => {
976
+ }, ze = (r) => {
977
977
  const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
978
978
  return e.setAttribute("stroke", `var(${te.edgeColor})`), e.setAttribute("stroke-width", `${r}`), e.setAttribute("fill", "none"), e;
979
979
  }, X = () => {
980
980
  const r = document.createElementNS("http://www.w3.org/2000/svg", "path");
981
981
  return r.setAttribute("fill", `var(${te.edgeColor})`), r;
982
- }, We = (r, e) => {
982
+ }, ke = (r, e) => {
983
983
  r.style.transform = `translate(${e.x}px, ${e.y}px)`, r.style.width = `${e.width}px`, r.style.height = `${e.height}px`;
984
984
  }, V = (r, e) => {
985
985
  const t = [];
@@ -1000,7 +1000,7 @@ const te = Object.freeze({
1000
1000
  });
1001
1001
  }
1002
1002
  return t.join(" ");
1003
- }, xt = (r, e) => {
1003
+ }, St = (r, e) => {
1004
1004
  const t = r.linePoint, o = e.linePoint, s = o.x - t.x >= 0, n = r.dirX >= 0, a = e.dirX >= 0;
1005
1005
  if (n === a) {
1006
1006
  const u = n === s, g = (t.x + o.x) / 2, p = (t.y + o.y) / 2, w = { x: g, y: p };
@@ -1038,7 +1038,7 @@ const te = Object.freeze({
1038
1038
  midpoint: { x: l.x, y: c }
1039
1039
  };
1040
1040
  };
1041
- class At {
1041
+ class bt {
1042
1042
  constructor(e) {
1043
1043
  i(this, "path");
1044
1044
  i(this, "midpoint");
@@ -1060,14 +1060,14 @@ class At {
1060
1060
  { x: t.x + p, y: t.y },
1061
1061
  s,
1062
1062
  t
1063
- ), f = m({ x: o.x - p, y: o.y }, n, o), y = xt(
1063
+ ), f = m({ x: o.x - p, y: o.y }, n, o), y = St(
1064
1064
  { arrowPoint: u, linePoint: w, dirX: s.x },
1065
1065
  { arrowPoint: g, linePoint: f, dirX: n.x }
1066
1066
  );
1067
1067
  this.path = V(y.points, d), this.midpoint = y.midpoint;
1068
1068
  }
1069
1069
  }
1070
- class St {
1070
+ class Pt {
1071
1071
  constructor(e) {
1072
1072
  i(this, "path");
1073
1073
  i(this, "midpoint");
@@ -1118,7 +1118,7 @@ class St {
1118
1118
  );
1119
1119
  }
1120
1120
  }
1121
- class bt {
1121
+ class Nt {
1122
1122
  constructor(e) {
1123
1123
  i(this, "path");
1124
1124
  i(this, "midpoint");
@@ -1160,7 +1160,7 @@ class bt {
1160
1160
  return m(n, t, o);
1161
1161
  }
1162
1162
  }
1163
- const Pt = (r, e) => {
1163
+ const Ct = (r, e) => {
1164
1164
  const t = r.linePoint, o = e.linePoint, s = o.y - t.y >= 0, n = r.dirY >= 0, a = e.dirY >= 0;
1165
1165
  if (n === a) {
1166
1166
  const u = n === s, g = (t.x + o.x) / 2, p = (t.y + o.y) / 2, w = { x: g, y: p };
@@ -1198,7 +1198,7 @@ const Pt = (r, e) => {
1198
1198
  midpoint: { x: c, y: l.y }
1199
1199
  };
1200
1200
  };
1201
- class Nt {
1201
+ class Tt {
1202
1202
  constructor(e) {
1203
1203
  i(this, "path");
1204
1204
  i(this, "midpoint");
@@ -1220,7 +1220,7 @@ class Nt {
1220
1220
  { x: t.x + p, y: t.y },
1221
1221
  d,
1222
1222
  t
1223
- ), f = m({ x: o.x - p, y: o.y }, c, o), y = Pt(
1223
+ ), f = m({ x: o.x - p, y: o.y }, c, o), y = Ct(
1224
1224
  { arrowPoint: u, linePoint: w, dirY: d.y },
1225
1225
  { arrowPoint: g, linePoint: f, dirY: c.y }
1226
1226
  );
@@ -1244,7 +1244,7 @@ class re {
1244
1244
  this.path = `${h ? "" : g}${V(u, e.roundness)}`, this.midpoint = { x: (u[3].x + u[4].x) / 2, y: (u[3].y + u[4].y) / 2 };
1245
1245
  }
1246
1246
  }
1247
- class Ct {
1247
+ class Mt {
1248
1248
  constructor(e) {
1249
1249
  i(this, "path");
1250
1250
  i(this, "midpoint");
@@ -1262,7 +1262,7 @@ class Ct {
1262
1262
  this.path = `${h ? "" : E}${y}`, this.midpoint = f[3];
1263
1263
  }
1264
1264
  }
1265
- class Tt {
1265
+ class Dt {
1266
1266
  constructor(e) {
1267
1267
  i(this, "path");
1268
1268
  i(this, "midpoint");
@@ -1307,11 +1307,11 @@ class Tt {
1307
1307
  };
1308
1308
  }
1309
1309
  }
1310
- const Mt = (r, e, t) => {
1310
+ const Rt = (r, e, t) => {
1311
1311
  const o = Math.max(r.y, e.y), s = Math.min(r.y, e.y);
1312
1312
  return (t >= 0 ? o : s) + t;
1313
1313
  };
1314
- class Dt {
1314
+ class Lt {
1315
1315
  constructor(e) {
1316
1316
  i(this, "path");
1317
1317
  i(this, "midpoint");
@@ -1345,7 +1345,7 @@ class Dt {
1345
1345
  { x: a.x - w, y: a.y },
1346
1346
  d,
1347
1347
  a
1348
- ), E = Mt(f, y, u);
1348
+ ), E = Rt(f, y, u);
1349
1349
  this.midpoint = {
1350
1350
  x: (f.x + y.x) / 2,
1351
1351
  y: E
@@ -1362,11 +1362,11 @@ class Dt {
1362
1362
  );
1363
1363
  }
1364
1364
  }
1365
- const Rt = (r, e, t) => {
1365
+ const Vt = (r, e, t) => {
1366
1366
  const o = Math.max(r.x, e.x), s = Math.min(r.x, e.x);
1367
1367
  return (t >= 0 ? o : s) + t;
1368
1368
  };
1369
- class Lt {
1369
+ class It {
1370
1370
  constructor(e) {
1371
1371
  i(this, "path");
1372
1372
  i(this, "midpoint");
@@ -1400,7 +1400,7 @@ class Lt {
1400
1400
  { x: d.x - w, y: d.y },
1401
1401
  a,
1402
1402
  d
1403
- ), E = Rt(f, y, l);
1403
+ ), E = Vt(f, y, l);
1404
1404
  this.midpoint = {
1405
1405
  x: E,
1406
1406
  y: (f.y + y.y) / 2
@@ -1453,15 +1453,15 @@ class G {
1453
1453
  i(this, "onAfterRender");
1454
1454
  i(this, "afterRenderEmitter");
1455
1455
  i(this, "arrowRenderer");
1456
- this.params = e, [this.afterRenderEmitter, this.onAfterRender] = C(), this.arrowRenderer = this.params.arrowRenderer, this.svg = Be(e.color), this.svg.appendChild(this.group), this.line = Oe(e.width), this.group.appendChild(this.line), e.hasSourceArrow && (this.sourceArrow = X(), this.group.appendChild(this.sourceArrow)), e.hasTargetArrow && (this.targetArrow = X(), this.group.appendChild(this.targetArrow));
1456
+ this.params = e, [this.afterRenderEmitter, this.onAfterRender] = C(), this.arrowRenderer = this.params.arrowRenderer, this.svg = We(e.color), this.svg.appendChild(this.group), this.line = ze(e.width), this.group.appendChild(this.line), e.hasSourceArrow && (this.sourceArrow = X(), this.group.appendChild(this.sourceArrow)), e.hasTargetArrow && (this.targetArrow = X(), this.group.appendChild(this.targetArrow));
1457
1457
  }
1458
1458
  render(e) {
1459
- const { x: t, y: o, width: s, height: n, from: a, to: h } = $e(
1459
+ const { x: t, y: o, width: s, height: n, from: a, to: h } = Oe(
1460
1460
  e.from,
1461
1461
  e.to,
1462
1462
  this.params.padding
1463
1463
  );
1464
- We(this.svg, { x: t, y: o, width: s, height: n });
1464
+ ke(this.svg, { x: t, y: o, width: s, height: n });
1465
1465
  const d = Ae(e.from.direction), c = Ae(e.to.direction);
1466
1466
  let l = { x: -c.x, y: -c.y }, u;
1467
1467
  e.category === I.PortCycle ? (u = this.params.createCyclePath, l = d) : e.category === I.NodeCycle ? u = this.params.createDetourPath : u = this.params.createLinePath;
@@ -1485,7 +1485,7 @@ class G {
1485
1485
  });
1486
1486
  }
1487
1487
  }
1488
- const Vt = (r) => (e) => {
1488
+ const Ft = (r) => (e) => {
1489
1489
  const o = [
1490
1490
  { x: 0, y: 0 },
1491
1491
  { x: e.arrowLength, y: r.radius },
@@ -1497,7 +1497,7 @@ const Vt = (r) => (e) => {
1497
1497
  y: h.y + e.shift.y
1498
1498
  })), s = `M ${o[0].x} ${o[0].y}`, n = `L ${o[1].x} ${o[1].y}`, a = `L ${o[2].x} ${o[2].y}`;
1499
1499
  return `${s} ${n} ${a} Z`;
1500
- }, It = (r) => (e) => {
1500
+ }, Ut = (r) => (e) => {
1501
1501
  const t = r.radius, o = e.arrowLength, s = (o * o + 2 * o * t) / (2 * t), n = s + t, a = o + t - t * (o + t) / n, h = t * s / n, c = [
1502
1502
  { x: 0, y: 0 },
1503
1503
  { x: a, y: -h },
@@ -1509,7 +1509,7 @@ const Vt = (r) => (e) => {
1509
1509
  y: w.y + e.shift.y
1510
1510
  })), l = `M ${c[0].x} ${c[0].y}`, u = `A ${s} ${s} 0 0 0 ${c[1].x} ${c[1].y}`, g = `A ${t} ${t} 0 0 0 ${c[2].x} ${c[2].y}`, p = `A ${s} ${s} 0 0 0 ${c[0].x} ${c[0].y}`;
1511
1511
  return `${l} ${u} ${g} ${p}`;
1512
- }, Ft = (r) => (e) => {
1512
+ }, $t = (r) => (e) => {
1513
1513
  const t = r.smallRadius, o = r.radius, s = m(
1514
1514
  {
1515
1515
  x: e.arrowLength,
@@ -1535,22 +1535,22 @@ const Vt = (r) => (e) => {
1535
1535
  return r;
1536
1536
  switch (r.type) {
1537
1537
  case "triangle":
1538
- return Vt({
1538
+ return Ft({
1539
1539
  radius: r.radius ?? v.polygonArrowRadius
1540
1540
  });
1541
1541
  case "arc":
1542
- return It({
1542
+ return Ut({
1543
1543
  radius: r.radius ?? v.circleArrowRadius
1544
1544
  });
1545
1545
  default:
1546
- return Ft({
1546
+ return $t({
1547
1547
  smallRadius: r.smallRadius ?? v.wedgeArrowSmallRadius,
1548
1548
  angle: r.angle ?? v.wedgeArrowAngle,
1549
1549
  radius: r.radius ?? v.wedgeArrowRadius
1550
1550
  });
1551
1551
  }
1552
1552
  }, O = 50;
1553
- class Ut {
1553
+ class Bt {
1554
1554
  constructor(e) {
1555
1555
  i(this, "svg");
1556
1556
  i(this, "group");
@@ -1567,7 +1567,7 @@ class Ut {
1567
1567
  i(this, "hasSourceArrow");
1568
1568
  i(this, "hasTargetArrow");
1569
1569
  i(this, "pathShape");
1570
- i(this, "createCyclePath", (e, t, o) => new Ct({
1570
+ i(this, "createCyclePath", (e, t, o) => new Mt({
1571
1571
  origin: e,
1572
1572
  dir: o,
1573
1573
  radius: this.portCycleRadius,
@@ -1575,7 +1575,7 @@ class Ut {
1575
1575
  arrowLength: this.arrowLength,
1576
1576
  hasArrow: this.hasSourceArrow || this.hasTargetArrow
1577
1577
  }));
1578
- i(this, "createDetourPath", (e, t, o, s) => new Et({
1578
+ i(this, "createDetourPath", (e, t, o, s) => new At({
1579
1579
  from: e,
1580
1580
  to: t,
1581
1581
  fromDir: o,
@@ -1587,7 +1587,7 @@ class Ut {
1587
1587
  hasSourceArrow: this.hasSourceArrow,
1588
1588
  hasTargetArrow: this.hasTargetArrow
1589
1589
  }));
1590
- i(this, "createLinePath", (e, t, o, s) => new mt({
1590
+ i(this, "createLinePath", (e, t, o, s) => new xt({
1591
1591
  from: e,
1592
1592
  to: t,
1593
1593
  fromDir: o,
@@ -1615,7 +1615,7 @@ class Ut {
1615
1615
  }
1616
1616
  }
1617
1617
  const Se = (r) => Math.cos(r) > 0 ? 0 : Math.PI;
1618
- class $t {
1618
+ class Ot {
1619
1619
  constructor(e) {
1620
1620
  i(this, "svg");
1621
1621
  i(this, "group");
@@ -1640,7 +1640,7 @@ class $t {
1640
1640
  roundness: this.roundness,
1641
1641
  hasArrow: this.hasSourceArrow || this.hasTargetArrow
1642
1642
  }));
1643
- i(this, "createDetourPath", (e, t, o, s) => new Dt({
1643
+ i(this, "createDetourPath", (e, t, o, s) => new Lt({
1644
1644
  from: e,
1645
1645
  to: t,
1646
1646
  fromDir: o,
@@ -1652,7 +1652,7 @@ class $t {
1652
1652
  hasSourceArrow: this.hasSourceArrow,
1653
1653
  hasTargetArrow: this.hasTargetArrow
1654
1654
  }));
1655
- i(this, "createLinePath", (e, t, o, s) => new At({
1655
+ i(this, "createLinePath", (e, t, o, s) => new bt({
1656
1656
  from: e,
1657
1657
  to: t,
1658
1658
  fromDir: o,
@@ -1697,7 +1697,7 @@ class $t {
1697
1697
  });
1698
1698
  }
1699
1699
  }
1700
- class Bt {
1700
+ class Wt {
1701
1701
  constructor(e) {
1702
1702
  i(this, "svg");
1703
1703
  i(this, "group");
@@ -1723,7 +1723,7 @@ class Bt {
1723
1723
  roundness: this.roundness,
1724
1724
  hasArrow: this.hasSourceArrow || this.hasTargetArrow
1725
1725
  }));
1726
- i(this, "createDetourPath", (e, t, o, s) => new St({
1726
+ i(this, "createDetourPath", (e, t, o, s) => new Pt({
1727
1727
  from: e,
1728
1728
  to: t,
1729
1729
  fromDir: o,
@@ -1736,7 +1736,7 @@ class Bt {
1736
1736
  hasSourceArrow: this.hasSourceArrow,
1737
1737
  hasTargetArrow: this.hasTargetArrow
1738
1738
  }));
1739
- i(this, "createLinePath", (e, t, o, s) => new bt({
1739
+ i(this, "createLinePath", (e, t, o, s) => new Nt({
1740
1740
  from: e,
1741
1741
  to: t,
1742
1742
  fromDir: o,
@@ -1771,7 +1771,7 @@ class Bt {
1771
1771
  }
1772
1772
  }
1773
1773
  const be = Math.PI / 2, Pe = (r) => Math.sin(r) > 0 ? be : -be;
1774
- class Ot {
1774
+ class zt {
1775
1775
  constructor(e) {
1776
1776
  i(this, "svg");
1777
1777
  i(this, "group");
@@ -1796,7 +1796,7 @@ class Ot {
1796
1796
  roundness: this.roundness,
1797
1797
  hasArrow: this.hasSourceArrow || this.hasTargetArrow
1798
1798
  }));
1799
- i(this, "createDetourPath", (e, t, o, s) => new Lt({
1799
+ i(this, "createDetourPath", (e, t, o, s) => new It({
1800
1800
  from: e,
1801
1801
  to: t,
1802
1802
  fromDir: o,
@@ -1808,7 +1808,7 @@ class Ot {
1808
1808
  hasSourceArrow: this.hasSourceArrow,
1809
1809
  hasTargetArrow: this.hasTargetArrow
1810
1810
  }));
1811
- i(this, "createLinePath", (e, t, o, s) => new Nt({
1811
+ i(this, "createLinePath", (e, t, o, s) => new Tt({
1812
1812
  from: e,
1813
1813
  to: t,
1814
1814
  fromDir: o,
@@ -1853,7 +1853,7 @@ class Ot {
1853
1853
  });
1854
1854
  }
1855
1855
  }
1856
- class ze {
1856
+ class He {
1857
1857
  constructor(e) {
1858
1858
  i(this, "svg");
1859
1859
  i(this, "group", document.createElementNS(
@@ -1871,16 +1871,16 @@ class ze {
1871
1871
  i(this, "onAfterRender");
1872
1872
  i(this, "afterRenderEmitter");
1873
1873
  i(this, "arrowRenderer");
1874
- [this.afterRenderEmitter, this.onAfterRender] = C(), this.color = (e == null ? void 0 : e.color) ?? v.color, this.width = (e == null ? void 0 : e.width) ?? v.width, this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? v.arrowLength, this.arrowRenderer = B((e == null ? void 0 : e.arrowRenderer) ?? {}), this.sourceOffset = (e == null ? void 0 : e.sourceOffset) ?? v.preOffset, this.targetOffset = (e == null ? void 0 : e.targetOffset) ?? v.preOffset, this.svg = Be(this.color), this.svg.appendChild(this.group), this.line = Oe(this.width), this.group.appendChild(this.line), e != null && e.hasSourceArrow && (this.sourceArrow = X(), this.group.appendChild(this.sourceArrow)), e != null && e.hasTargetArrow && (this.targetArrow = X(), this.group.appendChild(this.targetArrow));
1874
+ [this.afterRenderEmitter, this.onAfterRender] = C(), this.color = (e == null ? void 0 : e.color) ?? v.color, this.width = (e == null ? void 0 : e.width) ?? v.width, this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? v.arrowLength, this.arrowRenderer = B((e == null ? void 0 : e.arrowRenderer) ?? {}), this.sourceOffset = (e == null ? void 0 : e.sourceOffset) ?? v.preOffset, this.targetOffset = (e == null ? void 0 : e.targetOffset) ?? v.preOffset, this.svg = We(this.color), this.svg.appendChild(this.group), this.line = ze(this.width), this.group.appendChild(this.line), e != null && e.hasSourceArrow && (this.sourceArrow = X(), this.group.appendChild(this.sourceArrow)), e != null && e.hasTargetArrow && (this.targetArrow = X(), this.group.appendChild(this.targetArrow));
1875
1875
  }
1876
1876
  render(e) {
1877
- const { x: t, y: o, width: s, height: n, from: a, to: h } = $e(
1877
+ const { x: t, y: o, width: s, height: n, from: a, to: h } = Oe(
1878
1878
  e.from,
1879
1879
  e.to,
1880
1880
  O
1881
1881
  );
1882
- We(this.svg, { x: t, y: o, width: s, height: n });
1883
- const d = new Tt({
1882
+ ke(this.svg, { x: t, y: o, width: s, height: n });
1883
+ const d = new Dt({
1884
1884
  from: a,
1885
1885
  to: h,
1886
1886
  sourceOffset: this.sourceOffset,
@@ -1932,22 +1932,22 @@ class ze {
1932
1932
  });
1933
1933
  }
1934
1934
  }
1935
- const Wt = () => {
1935
+ const kt = () => {
1936
1936
  const r = document.createElementNS("http://www.w3.org/2000/svg", "g");
1937
1937
  return r.style.pointerEvents = "auto", r.style.cursor = "pointer", r;
1938
- }, zt = (r) => {
1938
+ }, Ht = (r) => {
1939
1939
  const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
1940
1940
  return e.setAttribute("stroke", "transparent"), e.setAttribute("stroke-width", `${r}`), e.setAttribute("fill", "none"), e.setAttribute("stroke-linecap", "round"), e;
1941
1941
  }, Ne = (r) => {
1942
1942
  const e = document.createElementNS("http://www.w3.org/2000/svg", "path");
1943
1943
  return e.setAttribute("stroke-linejoin", "round"), e.setAttribute("stroke-width", `${r}`), e.setAttribute("fill", "transparent"), e.setAttribute("stroke", "transparent"), e;
1944
1944
  };
1945
- class kt extends Error {
1945
+ class Yt extends Error {
1946
1946
  constructor(e) {
1947
1947
  super(e), this.name = "InteractiveEdgeError";
1948
1948
  }
1949
1949
  }
1950
- class ke {
1950
+ class Ye {
1951
1951
  constructor(e, t) {
1952
1952
  i(this, "svg");
1953
1953
  i(this, "group");
@@ -1957,20 +1957,20 @@ class ke {
1957
1957
  // TODO: make private
1958
1958
  /**
1959
1959
  * @deprecated
1960
- * do use shape.svg instead
1960
+ * use shape.svg instead
1961
1961
  */
1962
- i(this, "handle", Wt());
1962
+ i(this, "handle", kt());
1963
1963
  i(this, "onAfterRender");
1964
1964
  i(this, "interactiveLine");
1965
1965
  i(this, "interactiveSourceArrow", null);
1966
1966
  i(this, "interactiveTargetArrow", null);
1967
- if (this.baseEdge = e, e instanceof ke)
1968
- throw new kt(
1967
+ if (this.baseEdge = e, e instanceof Ye)
1968
+ throw new Yt(
1969
1969
  "interactive edge can be configured only once"
1970
1970
  );
1971
1971
  this.svg = this.baseEdge.svg, this.group = this.baseEdge.group, this.line = this.baseEdge.line, this.sourceArrow = this.baseEdge.sourceArrow, this.targetArrow = this.baseEdge.targetArrow, this.onAfterRender = this.baseEdge.onAfterRender;
1972
1972
  const o = (t == null ? void 0 : t.distance) ?? v.interactiveWidth;
1973
- this.interactiveLine = zt(o), this.handle.appendChild(this.interactiveLine), this.sourceArrow && (this.interactiveSourceArrow = Ne(o), this.handle.appendChild(this.interactiveSourceArrow)), this.targetArrow && (this.interactiveTargetArrow = Ne(o), this.handle.appendChild(this.interactiveTargetArrow)), this.group.appendChild(this.handle), this.baseEdge.onAfterRender.subscribe((s) => {
1973
+ this.interactiveLine = Ht(o), this.handle.appendChild(this.interactiveLine), this.sourceArrow && (this.interactiveSourceArrow = Ne(o), this.handle.appendChild(this.interactiveSourceArrow)), this.targetArrow && (this.interactiveTargetArrow = Ne(o), this.handle.appendChild(this.interactiveTargetArrow)), this.group.appendChild(this.handle), this.baseEdge.onAfterRender.subscribe((s) => {
1974
1974
  this.interactiveLine.setAttribute("d", s.edgePath.path), this.interactiveSourceArrow && this.interactiveSourceArrow.setAttribute("d", s.sourceArrowPath), this.interactiveTargetArrow && this.interactiveTargetArrow.setAttribute("d", s.targetArrowPath);
1975
1975
  });
1976
1976
  }
@@ -1995,7 +1995,7 @@ class Zr {
1995
1995
  this.baseShape.render(e);
1996
1996
  }
1997
1997
  }
1998
- class He {
1998
+ class Xe {
1999
1999
  constructor(e) {
2000
2000
  i(this, "onAfterNodeAdded");
2001
2001
  i(this, "onAfterNodeUpdated");
@@ -2110,7 +2110,7 @@ class K {
2110
2110
  this.counter = 0;
2111
2111
  }
2112
2112
  }
2113
- class Ye {
2113
+ class Ge {
2114
2114
  constructor(e, t, o) {
2115
2115
  i(this, "nodeIdGenerator", new K(
2116
2116
  (e) => this.graphStore.hasNode(e)
@@ -2241,18 +2241,18 @@ class Ye {
2241
2241
  ), this.graphStore.onBeforeEdgeRemoved.unsubscribe(this.onBeforeEdgeRemoved), this.graphStore.onBeforeClear.unsubscribe(this.onBeforeClear), this.htmlView.destroy();
2242
2242
  }
2243
2243
  }
2244
- const Ht = (r) => {
2244
+ const Xt = (r) => {
2245
2245
  setTimeout(() => {
2246
2246
  r();
2247
2247
  });
2248
- }, Yt = (r) => {
2248
+ }, Ce = (r) => {
2249
2249
  queueMicrotask(() => {
2250
2250
  r();
2251
2251
  });
2252
2252
  }, oe = (r) => {
2253
2253
  r();
2254
2254
  };
2255
- class Xe {
2255
+ class je {
2256
2256
  constructor(e) {
2257
2257
  i(this, "onBeforeUpdated");
2258
2258
  i(this, "onAfterUpdated");
@@ -2275,7 +2275,7 @@ class Xe {
2275
2275
  return this.viewportStore.createViewportCoords(e);
2276
2276
  }
2277
2277
  }
2278
- const Xt = (r, e) => Symbol.iterator in r ? {
2278
+ const Gt = (r, e) => Symbol.iterator in r ? {
2279
2279
  minContentScale: e.focus.minContentScale,
2280
2280
  nodes: r,
2281
2281
  contentPadding: e.focus.contentPadding,
@@ -2285,16 +2285,16 @@ const Xt = (r, e) => Symbol.iterator in r ? {
2285
2285
  nodes: r.nodes ?? [],
2286
2286
  contentPadding: r.contentPadding ?? r.contentOffset ?? e.focus.contentPadding,
2287
2287
  animationDuration: r.animationDuration ?? e.focus.animationDuration
2288
- }, Ge = (r, e, t) => ({
2288
+ }, Je = (r, e, t) => ({
2289
2289
  scale: r.scale,
2290
2290
  x: r.x + r.scale * e,
2291
2291
  y: r.y + r.scale * t
2292
- }), je = (r, e, t, o) => ({
2292
+ }), Ke = (r, e, t, o) => ({
2293
2293
  scale: r.scale * e,
2294
2294
  x: r.scale * (1 - e) * t + r.x,
2295
2295
  y: r.scale * (1 - e) * o + r.y
2296
2296
  });
2297
- class Je {
2297
+ class Qe {
2298
2298
  constructor(e, t, o, s) {
2299
2299
  this.graphStore = e, this.viewportStore = t, this.params = o, this.win = s;
2300
2300
  }
@@ -2306,11 +2306,11 @@ class Je {
2306
2306
  }
2307
2307
  center(e, t) {
2308
2308
  const { width: o, height: s } = this.viewportStore.getDimensions(), n = { x: o / 2, y: s / 2 }, a = this.viewportStore.getViewportMatrix(), h = this.viewportStore.createViewportCoords(e), d = h.x - n.x, c = h.y - n.y;
2309
- let l = Ge(a, d, c);
2309
+ let l = Je(a, d, c);
2310
2310
  const u = t == null ? void 0 : t.contentScale;
2311
2311
  if (u !== void 0) {
2312
2312
  const p = 1 / u;
2313
- l = je(
2313
+ l = Ke(
2314
2314
  l,
2315
2315
  p / a.scale,
2316
2316
  n.x,
@@ -2321,7 +2321,7 @@ class Je {
2321
2321
  g > 0 ? this.animateNavigation(a, l, g) : this.viewportStore.patchViewportMatrix(l);
2322
2322
  }
2323
2323
  focus(e) {
2324
- const t = Xt(e ?? {}, this.params);
2324
+ const t = Gt(e ?? {}, this.params);
2325
2325
  this.params.focus.schedule(() => {
2326
2326
  this.navigate(t);
2327
2327
  });
@@ -2370,20 +2370,20 @@ class Je {
2370
2370
  this.win.requestAnimationFrame(a);
2371
2371
  }
2372
2372
  }
2373
- const Ke = (r, e, t) => {
2374
- const o = new Ve(), s = new He(o), n = new Xe(e), a = new Re(o, e, r), h = {
2373
+ const Ze = (r, e, t) => {
2374
+ const o = new Fe(), s = new Xe(o), n = new je(e), a = new Ve(o, e, r), h = {
2375
2375
  nodes: {
2376
- centerFn: Ue,
2376
+ centerFn: Be,
2377
2377
  priorityFn: () => 0
2378
2378
  },
2379
2379
  edges: {
2380
- shapeFactory: () => new ze(),
2380
+ shapeFactory: () => new He(),
2381
2381
  priorityFn: () => 0
2382
2382
  },
2383
2383
  ports: {
2384
2384
  direction: 0
2385
2385
  }
2386
- }, d = new Ye(
2386
+ }, d = new Ge(
2387
2387
  o,
2388
2388
  a,
2389
2389
  h
@@ -2394,13 +2394,13 @@ const Ke = (r, e, t) => {
2394
2394
  schedule: oe,
2395
2395
  animationDuration: 0
2396
2396
  }
2397
- }, l = new Je(
2397
+ }, l = new Qe(
2398
2398
  o,
2399
2399
  e,
2400
2400
  c,
2401
2401
  t
2402
2402
  );
2403
- return new Le(s, n, d, l);
2403
+ return new Ie(s, n, d, l);
2404
2404
  };
2405
2405
  class j {
2406
2406
  constructor(e, t, o, s) {
@@ -2502,7 +2502,7 @@ class j {
2502
2502
  this.window.removeEventListener("touchmove", this.onWindowTouchMove), this.window.removeEventListener("touchend", this.onWindowTouchFinish), this.window.removeEventListener("touchcancel", this.onWindowTouchFinish);
2503
2503
  }
2504
2504
  }
2505
- class Gt {
2505
+ class jt {
2506
2506
  constructor() {
2507
2507
  i(this, "field", "_htmlGraphTags");
2508
2508
  }
@@ -2610,7 +2610,7 @@ const ne = (r, e) => ({
2610
2610
  from: r.isDirect ? r.staticPortId : e,
2611
2611
  to: r.isDirect ? e : r.staticPortId
2612
2612
  });
2613
- class jt {
2613
+ class Te {
2614
2614
  constructor(e, t) {
2615
2615
  this.graph = e, this.connectionAllowedVerifier = t;
2616
2616
  }
@@ -2947,7 +2947,7 @@ class J {
2947
2947
  );
2948
2948
  }
2949
2949
  moveViewport(e, t) {
2950
- const o = this.viewport.getViewportMatrix(), s = Ge(o, e, t), { width: n, height: a } = this.viewport.getDimensions(), h = this.params.transformPreprocessor({
2950
+ const o = this.viewport.getViewportMatrix(), s = Je(o, e, t), { width: n, height: a } = this.viewport.getDimensions(), h = this.params.transformPreprocessor({
2951
2951
  prevTransform: o,
2952
2952
  nextTransform: s,
2953
2953
  canvasWidth: n,
@@ -2956,7 +2956,7 @@ class J {
2956
2956
  this.performTransform(h);
2957
2957
  }
2958
2958
  scaleViewport(e, t, o) {
2959
- const s = this.canvas.viewport.getViewportMatrix(), n = je(s, e, t, o), { width: a, height: h } = this.viewport.getDimensions(), d = this.params.transformPreprocessor({
2959
+ const s = this.canvas.viewport.getViewportMatrix(), n = Ke(s, e, t, o), { width: a, height: h } = this.viewport.getDimensions(), d = this.params.transformPreprocessor({
2960
2960
  prevTransform: s,
2961
2961
  nextTransform: n,
2962
2962
  canvasWidth: a,
@@ -3141,7 +3141,7 @@ class ce {
3141
3141
  i(this, "onEdgeCreated", (e) => {
3142
3142
  this.params.onAfterEdgeCreated(e);
3143
3143
  });
3144
- this.canvas = e, this.overlayLayer = t, this.viewportStore = o, this.window = s, this.pointInsideVerifier = n, this.params = a, this.overlayCanvas = Ke(
3144
+ this.canvas = e, this.overlayLayer = t, this.viewportStore = o, this.window = s, this.pointInsideVerifier = n, this.params = a, this.overlayCanvas = Ze(
3145
3145
  this.overlayLayer,
3146
3146
  this.viewportStore,
3147
3147
  this.window
@@ -3217,7 +3217,7 @@ class ce {
3217
3217
  this.edgeInProgress = null, this.overlayCanvas.clear();
3218
3218
  }
3219
3219
  tryCreateConnection(e) {
3220
- const t = Fe(this.canvas.graph, e);
3220
+ const t = $e(this.canvas.graph, e);
3221
3221
  if (t === null) {
3222
3222
  this.params.onEdgeCreationInterrupted(this.edgeInProgress);
3223
3223
  return;
@@ -3253,7 +3253,7 @@ class le {
3253
3253
  i(this, "onEdgeReattached", (e) => {
3254
3254
  this.params.onAfterEdgeReattached(e);
3255
3255
  });
3256
- this.canvas = e, this.overlayLayer = t, this.viewportStore = o, this.window = s, this.pointInsideVerifier = n, this.params = a, this.overlayCanvas = Ke(
3256
+ this.canvas = e, this.overlayLayer = t, this.viewportStore = o, this.window = s, this.pointInsideVerifier = n, this.params = a, this.overlayCanvas = Ze(
3257
3257
  this.overlayLayer,
3258
3258
  this.viewportStore,
3259
3259
  this.window
@@ -3359,7 +3359,7 @@ class le {
3359
3359
  }).updatePort(M.DraggingNodeId, { direction: n });
3360
3360
  }
3361
3361
  tryCreateConnection(e) {
3362
- const t = Fe(this.canvas.graph, e);
3362
+ const t = $e(this.canvas.graph, e);
3363
3363
  if (this.overlayCanvas.removeEdge(M.EdgeId), t === null) {
3364
3364
  const c = this.draggingEdgePayload;
3365
3365
  this.params.onEdgeReattachInterrupted({
@@ -3644,7 +3644,7 @@ const rr = () => {
3644
3644
  }, Q = () => {
3645
3645
  const r = document.createElement("div");
3646
3646
  return r.style.position = "absolute", r.style.inset = "0", r;
3647
- }, Ce = () => {
3647
+ }, Me = () => {
3648
3648
  const r = Q();
3649
3649
  return r.style.pointerEvents = "none", r;
3650
3650
  };
@@ -3652,8 +3652,8 @@ class or {
3652
3652
  constructor(e) {
3653
3653
  i(this, "background", Q());
3654
3654
  i(this, "main", Q());
3655
- i(this, "overlayConnectablePorts", Ce());
3656
- i(this, "overlayDraggableEdges", Ce());
3655
+ i(this, "overlayConnectablePorts", Me());
3656
+ i(this, "overlayDraggableEdges", Me());
3657
3657
  i(this, "host", rr());
3658
3658
  this.element = e, this.element.appendChild(this.host), this.host.appendChild(this.background), this.host.appendChild(this.main), this.host.appendChild(this.overlayConnectablePorts), this.host.appendChild(this.overlayDraggableEdges);
3659
3659
  }
@@ -3680,7 +3680,10 @@ const b = Object.freeze({
3680
3680
  mouseUpEventVerifier: (r) => r.button === 0,
3681
3681
  movementThreshold: 10
3682
3682
  }), P = () => {
3683
- }, Qe = (r, e, t) => r === "closest-connectable-port" ? new jt(
3683
+ }, _e = (r, e, t) => r === "closest-connectable-port" ? new Te(
3684
+ e,
3685
+ t
3686
+ ) : r === "nearest-connectable-port" ? new Te(
3684
3687
  e,
3685
3688
  t
3686
3689
  ) : new Jt(r), ve = (r) => {
@@ -3688,7 +3691,7 @@ const b = Object.freeze({
3688
3691
  return r;
3689
3692
  switch (r.type) {
3690
3693
  case "straight":
3691
- return () => new Bt({
3694
+ return () => new Wt({
3692
3695
  color: r.color,
3693
3696
  width: r.width,
3694
3697
  arrowLength: r.arrowLength,
@@ -3702,7 +3705,7 @@ const b = Object.freeze({
3702
3705
  detourDirection: r.detourDirection
3703
3706
  });
3704
3707
  case "horizontal":
3705
- return () => new $t({
3708
+ return () => new Ot({
3706
3709
  color: r.color,
3707
3710
  width: r.width,
3708
3711
  arrowLength: r.arrowLength,
@@ -3715,7 +3718,7 @@ const b = Object.freeze({
3715
3718
  detourDistance: r.detourDistance
3716
3719
  });
3717
3720
  case "vertical":
3718
- return () => new Ot({
3721
+ return () => new zt({
3719
3722
  color: r.color,
3720
3723
  width: r.width,
3721
3724
  arrowLength: r.arrowLength,
@@ -3728,7 +3731,7 @@ const b = Object.freeze({
3728
3731
  detourDistance: r.detourDistance
3729
3732
  });
3730
3733
  case "direct":
3731
- return () => new ze({
3734
+ return () => new He({
3732
3735
  color: r.color,
3733
3736
  width: r.width,
3734
3737
  arrowLength: r.arrowLength,
@@ -3739,7 +3742,7 @@ const b = Object.freeze({
3739
3742
  targetOffset: r.targetOffset
3740
3743
  });
3741
3744
  default:
3742
- return () => new Ut({
3745
+ return () => new Bt({
3743
3746
  color: r.color,
3744
3747
  width: r.width,
3745
3748
  arrowLength: r.arrowLength,
@@ -3807,7 +3810,7 @@ const b = Object.freeze({
3807
3810
  canvasHeight: e.canvasHeight
3808
3811
  }),
3809
3812
  e.nextTransform
3810
- ), Te = (r) => {
3813
+ ), De = (r) => {
3811
3814
  if (typeof r == "function")
3812
3815
  return r;
3813
3816
  switch (r.type) {
@@ -3824,15 +3827,15 @@ const b = Object.freeze({
3824
3827
  maxY: r.maxY ?? 1 / 0
3825
3828
  });
3826
3829
  }
3827
- }, Me = (r) => {
3830
+ }, Re = (r) => {
3828
3831
  var g, p, w, f, y, E, x, N, T, D, F, U;
3829
3832
  const e = (g = r == null ? void 0 : r.scale) == null ? void 0 : g.mouseWheelSensitivity, t = e !== void 0 ? e : 1.2, o = r == null ? void 0 : r.transformPreprocessor;
3830
3833
  let s;
3831
3834
  o !== void 0 ? Array.isArray(o) ? s = ar(
3832
3835
  o.map(
3833
- (R) => Te(R)
3836
+ (R) => De(R)
3834
3837
  )
3835
- ) : s = Te(o) : s = (R) => R.nextTransform;
3838
+ ) : s = De(o) : s = (R) => R.nextTransform;
3836
3839
  const n = ((p = r == null ? void 0 : r.shift) == null ? void 0 : p.cursor) !== void 0 ? r.shift.cursor : "grab", a = (w = r == null ? void 0 : r.shift) == null ? void 0 : w.mouseDownEventVerifier, h = a !== void 0 ? a : (R) => R.button === 0, d = (f = r == null ? void 0 : r.shift) == null ? void 0 : f.mouseUpEventVerifier, c = d !== void 0 ? d : (R) => R.button === 0, l = (y = r == null ? void 0 : r.scale) == null ? void 0 : y.mouseWheelEventVerifier, u = l !== void 0 ? l : () => !0;
3837
3840
  return {
3838
3841
  wheelSensitivity: t,
@@ -3877,7 +3880,7 @@ const b = Object.freeze({
3877
3880
  return {
3878
3881
  connectionTypeResolver: r.connectionTypeResolver ?? $.connectionTypeResolver,
3879
3882
  connectionAllowedVerifier: o,
3880
- draggingPortDirectionResolver: Qe(
3883
+ draggingPortDirectionResolver: _e(
3881
3884
  r.dragPortDirection,
3882
3885
  t,
3883
3886
  o
@@ -3912,7 +3915,7 @@ const b = Object.freeze({
3912
3915
  onAfterEdgeReattached: ((s = r.events) == null ? void 0 : s.onAfterEdgeReattached) ?? P,
3913
3916
  onEdgeReattachInterrupted: ((n = r.events) == null ? void 0 : n.onEdgeReattachInterrupted) ?? P,
3914
3917
  onEdgeReattachPrevented: ((a = r.events) == null ? void 0 : a.onEdgeReattachPrevented) ?? P,
3915
- draggingPortDirectionResolver: Qe(
3918
+ draggingPortDirectionResolver: _e(
3916
3919
  r.dragPortDirection,
3917
3920
  e,
3918
3921
  o
@@ -3934,7 +3937,7 @@ class wr extends Error {
3934
3937
  i(this, "name", "CanvasBuilderError");
3935
3938
  }
3936
3939
  }
3937
- class Ze {
3940
+ class qe {
3938
3941
  constructor(e, t, o) {
3939
3942
  i(this, "dt");
3940
3943
  i(this, "nodeMass");
@@ -3972,7 +3975,7 @@ class Ze {
3972
3975
  });
3973
3976
  }
3974
3977
  }
3975
- class _e {
3978
+ class et {
3976
3979
  constructor(e) {
3977
3980
  i(this, "PI2", 2 * Math.PI);
3978
3981
  this.rand = e;
@@ -3991,7 +3994,7 @@ class _e {
3991
3994
  return { ex: h, ey: d, d: a };
3992
3995
  }
3993
3996
  }
3994
- const qe = (r) => {
3997
+ const tt = (r) => {
3995
3998
  if (r.distance === 0)
3996
3999
  return r.maxForce;
3997
4000
  const e = r.coefficient * (r.sourceCharge * r.targetCharge / (r.distance * r.distance));
@@ -4012,7 +4015,7 @@ class fr {
4012
4015
  const d = o[h], c = e.get(a), l = e.get(d), u = this.distanceVectorGenerator.create(
4013
4016
  c,
4014
4017
  l
4015
- ), g = qe({
4018
+ ), g = tt({
4016
4019
  coefficient: 1,
4017
4020
  sourceCharge: this.nodeCharge,
4018
4021
  targetCharge: this.nodeCharge,
@@ -4326,7 +4329,7 @@ class mr {
4326
4329
  const t = this.distanceVectorGenerator.create(
4327
4330
  e.sourceCoords,
4328
4331
  e.targetCoords
4329
- ), o = qe({
4332
+ ), o = tt({
4330
4333
  coefficient: this.nodeForceCoefficient,
4331
4334
  sourceCharge: e.sourceCharge,
4332
4335
  targetCharge: e.targetCharge,
@@ -4361,7 +4364,7 @@ class mr {
4361
4364
  }
4362
4365
  }
4363
4366
  }
4364
- const et = (r) => r.theta !== 0 ? new mr({
4367
+ const rt = (r) => r.theta !== 0 ? new mr({
4365
4368
  nodeCharge: r.nodeCharge,
4366
4369
  nodeForceCoefficient: r.nodeForceCoefficient,
4367
4370
  distanceVectorGenerator: r.distanceVectorGenerator,
@@ -4375,7 +4378,7 @@ const et = (r) => r.theta !== 0 ? new mr({
4375
4378
  distanceVectorGenerator: r.distanceVectorGenerator,
4376
4379
  maxForce: r.maxForce
4377
4380
  });
4378
- class tt {
4381
+ class ot {
4379
4382
  constructor(e) {
4380
4383
  i(this, "rand");
4381
4384
  i(this, "sparsity");
@@ -4409,7 +4412,7 @@ class Er {
4409
4412
  i(this, "edgeEquilibriumLength");
4410
4413
  i(this, "edgeStiffness");
4411
4414
  i(this, "convergenceVelocity");
4412
- this.maxIterations = e.maxIterations, this.dtSec = e.dtSec, this.nodeMass = e.nodeMass, this.edgeEquilibriumLength = e.edgeEquilibriumLength, this.edgeStiffness = e.edgeStiffness, this.convergenceVelocity = e.convergenceVelocity, this.distanceVectorGenerator = new _e(e.rand), this.nodeForcesApplicationStrategy = et({
4415
+ this.maxIterations = e.maxIterations, this.dtSec = e.dtSec, this.nodeMass = e.nodeMass, this.edgeEquilibriumLength = e.edgeEquilibriumLength, this.edgeStiffness = e.edgeStiffness, this.convergenceVelocity = e.convergenceVelocity, this.distanceVectorGenerator = new et(e.rand), this.nodeForcesApplicationStrategy = rt({
4413
4416
  distanceVectorGenerator: this.distanceVectorGenerator,
4414
4417
  nodeCharge: e.nodeCharge,
4415
4418
  maxForce: e.maxForce,
@@ -4417,7 +4420,7 @@ class Er {
4417
4420
  theta: e.barnesHutTheta,
4418
4421
  areaRadiusThreshold: e.barnesHutAreaRadiusThreshold,
4419
4422
  nodeMass: e.nodeMass
4420
- }), this.fillerLayoutAlgorithm = new tt({
4423
+ }), this.fillerLayoutAlgorithm = new ot({
4421
4424
  rand: e.rand,
4422
4425
  sparsity: e.edgeEquilibriumLength
4423
4426
  });
@@ -4427,7 +4430,7 @@ class Er {
4427
4430
  graph: t,
4428
4431
  viewport: o
4429
4432
  });
4430
- for (let n = 0; n < this.maxIterations && !(new Ze(
4433
+ for (let n = 0; n < this.maxIterations && !(new qe(
4431
4434
  t,
4432
4435
  s,
4433
4436
  {
@@ -4617,7 +4620,7 @@ class Tr {
4617
4620
  i(this, "edgeEquilibriumLength");
4618
4621
  i(this, "edgeStiffness");
4619
4622
  i(this, "fillerLayoutAlgorithm");
4620
- this.convergenceVelocity = e.convergenceVelocity, this.maxTimeDeltaSec = e.maxTimeDeltaSec, this.nodeMass = e.nodeMass, this.edgeEquilibriumLength = e.edgeEquilibriumLength, this.edgeStiffness = e.edgeStiffness, this.distanceVectorGenerator = new _e(e.rand), this.nodeForcesApplicationStrategy = et({
4623
+ this.convergenceVelocity = e.convergenceVelocity, this.maxTimeDeltaSec = e.maxTimeDeltaSec, this.nodeMass = e.nodeMass, this.edgeEquilibriumLength = e.edgeEquilibriumLength, this.edgeStiffness = e.edgeStiffness, this.distanceVectorGenerator = new et(e.rand), this.nodeForcesApplicationStrategy = rt({
4621
4624
  distanceVectorGenerator: this.distanceVectorGenerator,
4622
4625
  nodeCharge: e.nodeCharge,
4623
4626
  maxForce: e.maxForce,
@@ -4625,7 +4628,7 @@ class Tr {
4625
4628
  theta: e.barnesHutTheta,
4626
4629
  areaRadiusThreshold: e.barnesHutAreaRadiusThreshold,
4627
4630
  nodeMass: e.nodeMass
4628
- }), this.fillerLayoutAlgorithm = new tt({
4631
+ }), this.fillerLayoutAlgorithm = new ot({
4629
4632
  rand: e.rand,
4630
4633
  sparsity: e.edgeEquilibriumLength
4631
4634
  });
@@ -4635,7 +4638,7 @@ class Tr {
4635
4638
  graph: t,
4636
4639
  viewport: o
4637
4640
  });
4638
- return new Ze(
4641
+ return new qe(
4639
4642
  t,
4640
4643
  n,
4641
4644
  {
@@ -4652,12 +4655,12 @@ class Tr {
4652
4655
  }) ? /* @__PURE__ */ new Map() : n;
4653
4656
  }
4654
4657
  }
4655
- const rt = (r) => {
4658
+ const st = (r) => {
4656
4659
  let e = 1779033703, t = 3144134277, o = 1013904242, s = 2773480762;
4657
4660
  for (let n = 0, a; n < r.length; n++)
4658
4661
  a = r.charCodeAt(n), e = t ^ Math.imul(e ^ a, 597399067), t = o ^ Math.imul(t ^ a, 2869860233), o = s ^ Math.imul(o ^ a, 951274213), s = e ^ Math.imul(s ^ a, 2716044179);
4659
4662
  return e = Math.imul(o ^ e >>> 18, 597399067), t = Math.imul(s ^ t >>> 22, 2869860233), o = Math.imul(e ^ o >>> 17, 951274213), s = Math.imul(t ^ s >>> 19, 2716044179), e ^= t ^ o ^ s, t ^= e, o ^= e, s ^= e, [e >>> 0, t >>> 0, o >>> 0, s >>> 0];
4660
- }, ot = (r, e, t, o) => function() {
4663
+ }, it = (r, e, t, o) => function() {
4661
4664
  r |= 0, e |= 0, t |= 0, o |= 0;
4662
4665
  const s = (r + e | 0) + o | 0;
4663
4666
  return o = o + 1 | 0, r = e ^ e >>> 9, e = t + (t << 3) | 0, t = t << 21 | t >>> 11, t = t + s | 0, (s >>> 0) / 4294967296;
@@ -4667,7 +4670,7 @@ const rt = (r) => {
4667
4670
  case "custom":
4668
4671
  return r.instance;
4669
4672
  default: {
4670
- const o = rt((r == null ? void 0 : r.seed) ?? b.seed), s = ot(o[0], o[1], o[2], o[3]);
4673
+ const o = st((r == null ? void 0 : r.seed) ?? b.seed), s = it(o[0], o[1], o[2], o[3]);
4671
4674
  return new Tr({
4672
4675
  rand: s,
4673
4676
  maxTimeDeltaSec: (r == null ? void 0 : r.maxTimeDeltaSec) ?? b.maxTimeDeltaSec,
@@ -4675,6 +4678,7 @@ const rt = (r) => {
4675
4678
  nodeMass: (r == null ? void 0 : r.nodeMass) ?? b.nodeMass,
4676
4679
  edgeEquilibriumLength: (r == null ? void 0 : r.edgeEquilibriumLength) ?? b.edgeEquilibriumLength,
4677
4680
  edgeStiffness: (r == null ? void 0 : r.edgeStiffness) ?? b.edgeStiffness,
4681
+ // TODO: rename no `minVelocity`
4678
4682
  convergenceVelocity: (r == null ? void 0 : r.convergenceVelocity) ?? b.convergenceVelocity,
4679
4683
  maxForce: (r == null ? void 0 : r.maxForce) ?? b.maxForce,
4680
4684
  nodeForceCoefficient: (r == null ? void 0 : r.nodeForceCoefficient) ?? b.nodeForceCoefficient,
@@ -4696,12 +4700,15 @@ const rt = (r) => {
4696
4700
  }, Lr = (r) => r instanceof q ? {
4697
4701
  type: "trigger",
4698
4702
  trigger: r
4703
+ } : r === "topologyChangeMicrotask" ? {
4704
+ type: "topologyChangeSchedule",
4705
+ schedule: Ce
4699
4706
  } : (r == null ? void 0 : r.type) === "topologyChangeMacrotask" ? {
4700
4707
  type: "topologyChangeSchedule",
4701
- schedule: Ht
4708
+ schedule: Xt
4702
4709
  } : {
4703
4710
  type: "topologyChangeSchedule",
4704
- schedule: Yt
4711
+ schedule: Ce
4705
4712
  }, Z = Object.freeze({
4706
4713
  staticNodeResolver: () => !1,
4707
4714
  hierarchicalLayout: {
@@ -4866,7 +4873,7 @@ const Fr = (r) => {
4866
4873
  )
4867
4874
  });
4868
4875
  default: {
4869
- const o = rt((r == null ? void 0 : r.seed) ?? b.seed), s = ot(o[0], o[1], o[2], o[3]);
4876
+ const o = st((r == null ? void 0 : r.seed) ?? b.seed), s = it(o[0], o[1], o[2], o[3]);
4870
4877
  return new Er({
4871
4878
  dtSec: (r == null ? void 0 : r.dtSec) ?? b.dtSec,
4872
4879
  maxIterations: (r == null ? void 0 : r.maxIterations) ?? b.maxIterations,
@@ -4911,11 +4918,11 @@ const Fr = (r) => {
4911
4918
  }, zr = (r, e) => ({
4912
4919
  ...r,
4913
4920
  staticNodeResolver: (t) => r.staticNodeResolver(t) || e.has(t)
4914
- }), _ = (r) => () => r, De = _(0), kr = () => {
4921
+ }), _ = (r) => () => r, Le = _(0), kr = () => {
4915
4922
  let r = 0;
4916
4923
  return () => r++;
4917
4924
  }, Hr = (r, e) => {
4918
- let t = De, o = De;
4925
+ let t = Le, o = Le;
4919
4926
  const s = kr();
4920
4927
  return r === "incremental" && (t = s), e === "incremental" && (o = s), typeof r == "number" && (t = _(r)), typeof e == "number" && (o = _(e)), typeof r == "function" && (t = r), typeof e == "function" && (o = e), {
4921
4928
  nodesPriorityFn: t,
@@ -4929,7 +4936,7 @@ const Fr = (r) => {
4929
4936
  );
4930
4937
  return {
4931
4938
  nodes: {
4932
- centerFn: ((s = r.nodes) == null ? void 0 : s.centerFn) ?? Ue,
4939
+ centerFn: ((s = r.nodes) == null ? void 0 : s.centerFn) ?? Be,
4933
4940
  priorityFn: e.nodesPriorityFn
4934
4941
  },
4935
4942
  ports: {
@@ -4994,8 +5001,8 @@ class _r {
4994
5001
  i(this, "window", window);
4995
5002
  i(this, "animationStaticNodes", /* @__PURE__ */ new Set());
4996
5003
  i(this, "pointInsideVerifier");
4997
- i(this, "eventTagger", new Gt());
4998
- this.element = e, this.pointInsideVerifier = new yt(e, this.window);
5004
+ i(this, "eventTagger", new jt());
5005
+ this.element = e, this.pointInsideVerifier = new mt(e, this.window);
4999
5006
  }
5000
5007
  setDefaults(e) {
5001
5008
  return this.canvasDefaults = e, this;
@@ -5042,13 +5049,13 @@ class _r {
5042
5049
  "Failed to build Canvas because CanvasBuilder is a single-use object"
5043
5050
  );
5044
5051
  this.used = !0;
5045
- const e = new pt(this.element), t = new Ve(), o = new or(this.element), s = this.createHtmlView(
5052
+ const e = new ft(this.element), t = new Fe(), o = new or(this.element), s = this.createHtmlView(
5046
5053
  o.main,
5047
5054
  t,
5048
5055
  e
5049
5056
  ), n = Yr(
5050
5057
  this.canvasDefaults
5051
- ), a = new Ye(
5058
+ ), a = new Ge(
5052
5059
  t,
5053
5060
  s,
5054
5061
  n
@@ -5056,12 +5063,12 @@ class _r {
5056
5063
  canvasDefaults: this.canvasDefaults,
5057
5064
  hasLayout: this.hasLayout,
5058
5065
  layoutParams: h
5059
- }), c = new Je(
5066
+ }), c = new Qe(
5060
5067
  t,
5061
5068
  e,
5062
5069
  d,
5063
5070
  this.window
5064
- ), l = new Xe(e), u = new He(t), g = new Le(
5071
+ ), l = new je(e), u = new Xe(t), g = new Ie(
5065
5072
  u,
5066
5073
  l,
5067
5074
  a,
@@ -5154,7 +5161,7 @@ class _r {
5154
5161
  g,
5155
5162
  o.main,
5156
5163
  this.window,
5157
- Me(this.transformConfig),
5164
+ Re(this.transformConfig),
5158
5165
  this.boxRenderingTrigger,
5159
5166
  this.pointInsideVerifier,
5160
5167
  gr(this.virtualScrollConfig)
@@ -5163,7 +5170,7 @@ class _r {
5163
5170
  o.main,
5164
5171
  this.window,
5165
5172
  this.pointInsideVerifier,
5166
- Me(this.transformConfig)
5173
+ Re(this.transformConfig)
5167
5174
  ), this.hasLayout && qt.configure(g, h), this.hasAnimatedLayout) {
5168
5175
  let p = Rr(this.animatedLayoutConfig);
5169
5176
  this.hasDraggableNodes && (Wr(
@@ -5179,27 +5186,27 @@ class _r {
5179
5186
  }), g;
5180
5187
  }
5181
5188
  createHtmlView(e, t, o) {
5182
- let s = new Re(t, o, e);
5183
- return this.virtualScrollConfig !== void 0 && (s = new lt(
5189
+ let s = new Ve(t, o, e);
5190
+ return this.virtualScrollConfig !== void 0 && (s = new gt(
5184
5191
  s,
5185
5192
  t,
5186
5193
  this.boxRenderingTrigger,
5187
5194
  pr(this.virtualScrollConfig)
5188
- )), s = new ut(s, t), s;
5195
+ )), s = new pt(s, t), s;
5189
5196
  }
5190
5197
  }
5191
5198
  export {
5192
- Ut as BezierEdgeShape,
5199
+ Bt as BezierEdgeShape,
5193
5200
  _r as CanvasBuilder,
5194
5201
  wr as CanvasBuilderError,
5195
5202
  A as CanvasError,
5196
5203
  I as ConnectionCategory,
5197
- ze as DirectEdgeShape,
5204
+ He as DirectEdgeShape,
5198
5205
  q as EventSubject,
5199
- $t as HorizontalEdgeShape,
5200
- kt as InteractiveEdgeError,
5201
- ke as InteractiveEdgeShape,
5206
+ Ot as HorizontalEdgeShape,
5207
+ Yt as InteractiveEdgeError,
5208
+ Ye as InteractiveEdgeShape,
5202
5209
  Zr as MidpointEdgeShape,
5203
- Bt as StraightEdgeShape,
5204
- Ot as VerticalEdgeShape
5210
+ Wt as StraightEdgeShape,
5211
+ zt as VerticalEdgeShape
5205
5212
  };