@html-graph/html-graph 7.0.0 → 7.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -734,7 +734,6 @@ declare type LayoutAlgorithmConfig = {
734
734
  readonly dtSec?: number;
735
735
  readonly maxIterations?: number;
736
736
  readonly seed?: string;
737
- readonly maxTimeDeltaSec?: number;
738
737
  readonly nodeCharge?: number;
739
738
  readonly nodeMass?: number;
740
739
  readonly edgeEquilibriumLength?: number;
@@ -15,7 +15,7 @@ const Oe = () => {
15
15
  }, ke = (r) => {
16
16
  r.style.position = "absolute", r.style.top = "0", r.style.left = "0", r.style.visibility = "hidden";
17
17
  };
18
- class ye {
18
+ class me {
19
19
  constructor(e, t, s) {
20
20
  o(this, "host", Oe());
21
21
  o(this, "container", We());
@@ -268,7 +268,7 @@ class G {
268
268
  });
269
269
  }
270
270
  }
271
- const S = () => {
271
+ const x = () => {
272
272
  const r = new G();
273
273
  return [r, r];
274
274
  };
@@ -361,7 +361,7 @@ class ve {
361
361
  this.onAfterEdgeShapeUpdated
362
362
  ), this.graphStore.onAfterEdgeUpdated.subscribe(this.onAfterEdgeUpdated), this.graphStore.onAfterEdgePriorityUpdated.subscribe(
363
363
  this.onAfterEdgePriorityUpdated
364
- ), this.graphStore.onBeforeEdgeRemoved.subscribe(this.onBeforeEdgeRemoved), this.graphStore.onBeforeClear.subscribe(this.onBeforeClear), [this.onBeforeDestroyEmitter, this.onBeforeDestroy] = S();
364
+ ), this.graphStore.onBeforeEdgeRemoved.subscribe(this.onBeforeEdgeRemoved), this.graphStore.onBeforeClear.subscribe(this.onBeforeClear), [this.onBeforeDestroyEmitter, this.onBeforeDestroy] = x();
365
365
  }
366
366
  /**
367
367
  * adds new node
@@ -586,7 +586,7 @@ class Ee {
586
586
  o(this, "onBeforeEdgeRemoved");
587
587
  o(this, "beforeClearEmitter");
588
588
  o(this, "onBeforeClear");
589
- [this.afterNodeAddedEmitter, this.onAfterNodeAdded] = S(), [this.afterNodeUpdatedEmitter, this.onAfterNodeUpdated] = S(), [this.afterNodePriorityUpdatedEmitter, this.onAfterNodePriorityUpdated] = S(), [this.beforeNodeRemovedEmitter, this.onBeforeNodeRemoved] = S(), [this.afterPortAddedEmitter, this.onAfterPortAdded] = S(), [this.afterPortUpdatedEmitter, this.onAfterPortUpdated] = S(), [this.beforePortRemovedEmitter, this.onBeforePortRemoved] = S(), [this.afterEdgeAddedEmitter, this.onAfterEdgeAdded] = S(), [this.afterEdgeShapeUpdatedEmitter, this.onAfterEdgeShapeUpdated] = S(), [this.afterEdgeUpdatedEmitter, this.onAfterEdgeUpdated] = S(), [this.afterEdgePriorityUpdatedEmitter, this.onAfterEdgePriorityUpdated] = S(), [this.beforeEdgeRemovedEmitter, this.onBeforeEdgeRemoved] = S(), [this.beforeClearEmitter, this.onBeforeClear] = S();
589
+ [this.afterNodeAddedEmitter, this.onAfterNodeAdded] = x(), [this.afterNodeUpdatedEmitter, this.onAfterNodeUpdated] = x(), [this.afterNodePriorityUpdatedEmitter, this.onAfterNodePriorityUpdated] = x(), [this.beforeNodeRemovedEmitter, this.onBeforeNodeRemoved] = x(), [this.afterPortAddedEmitter, this.onAfterPortAdded] = x(), [this.afterPortUpdatedEmitter, this.onAfterPortUpdated] = x(), [this.beforePortRemovedEmitter, this.onBeforePortRemoved] = x(), [this.afterEdgeAddedEmitter, this.onAfterEdgeAdded] = x(), [this.afterEdgeShapeUpdatedEmitter, this.onAfterEdgeShapeUpdated] = x(), [this.afterEdgeUpdatedEmitter, this.onAfterEdgeUpdated] = x(), [this.afterEdgePriorityUpdatedEmitter, this.onAfterEdgePriorityUpdated] = x(), [this.beforeEdgeRemovedEmitter, this.onBeforeEdgeRemoved] = x(), [this.beforeClearEmitter, this.onBeforeClear] = x();
590
590
  }
591
591
  addNode(e) {
592
592
  const t = /* @__PURE__ */ new Map(), s = {
@@ -772,7 +772,7 @@ class je {
772
772
  o(this, "contentMatrix", le);
773
773
  o(this, "afterUpdateEmitter");
774
774
  o(this, "onAfterUpdated");
775
- [this.afterUpdateEmitter, this.onAfterUpdated] = S();
775
+ [this.afterUpdateEmitter, this.onAfterUpdated] = x();
776
776
  }
777
777
  getViewportMatrix() {
778
778
  return this.viewportMatrix;
@@ -866,7 +866,7 @@ const xe = (r, e) => ({
866
866
  }), p = {
867
867
  x: 0,
868
868
  y: 0
869
- }, y = (r, e, t) => ({
869
+ }, m = (r, e, t) => ({
870
870
  x: e.x * r.x - e.y * r.y + ((1 - e.x) * t.x + e.y * t.y),
871
871
  y: e.y * r.x + e.x * r.y + ((1 - e.x) * t.y - e.y * t.x)
872
872
  }), Se = (r, e) => {
@@ -896,11 +896,11 @@ class Je {
896
896
  this.params = e;
897
897
  const t = this.params.to;
898
898
  this.midpoint = { x: t.x / 2, y: t.y / 2 };
899
- const s = y(
899
+ const s = m(
900
900
  { x: this.params.arrowLength, y: p.y },
901
901
  this.params.sourceDirection,
902
902
  p
903
- ), i = y(
903
+ ), i = m(
904
904
  { x: this.params.to.x - this.params.arrowLength, y: this.params.to.y },
905
905
  this.params.targetDirection,
906
906
  this.params.to
@@ -919,25 +919,25 @@ class Qe {
919
919
  o(this, "path");
920
920
  o(this, "midpoint");
921
921
  this.params = e;
922
- const t = this.params.hasSourceArrow ? y(
922
+ const t = this.params.hasSourceArrow ? m(
923
923
  { x: this.params.arrowLength, y: p.y },
924
924
  this.params.sourceDirection,
925
925
  p
926
- ) : p, s = this.params.hasTargetArrow ? y(
926
+ ) : p, s = this.params.hasTargetArrow ? m(
927
927
  {
928
928
  x: this.params.to.x - this.params.arrowLength,
929
929
  y: this.params.to.y
930
930
  },
931
931
  this.params.targetDirection,
932
932
  this.params.to
933
- ) : this.params.to, i = this.params.arrowLength, n = Math.cos(this.params.detourDirection) * this.params.detourDistance, a = Math.sin(this.params.detourDirection) * this.params.detourDistance, h = n * this.params.flipX, d = a * this.params.flipY, c = y(
933
+ ) : this.params.to, i = this.params.arrowLength, n = Math.cos(this.params.detourDirection) * this.params.detourDistance, a = Math.sin(this.params.detourDirection) * this.params.detourDistance, h = n * this.params.flipX, d = a * this.params.flipY, c = m(
934
934
  { x: i, y: p.y },
935
935
  this.params.sourceDirection,
936
936
  p
937
937
  ), g = {
938
938
  x: c.x + h,
939
939
  y: c.y + d
940
- }, l = y(
940
+ }, l = m(
941
941
  { x: this.params.to.x - i, y: this.params.to.y },
942
942
  this.params.targetDirection,
943
943
  this.params.to
@@ -947,7 +947,7 @@ class Qe {
947
947
  }, w = {
948
948
  x: (g.x + u.x) / 2,
949
949
  y: (g.y + u.y) / 2
950
- }, m = {
950
+ }, y = {
951
951
  x: c.x + this.params.curvature * this.params.sourceDirection.x,
952
952
  y: c.y + this.params.curvature * this.params.sourceDirection.y
953
953
  }, v = {
@@ -963,7 +963,7 @@ class Qe {
963
963
  this.path = [
964
964
  `M ${t.x} ${t.y}`,
965
965
  `L ${c.x} ${c.y}`,
966
- `C ${m.x} ${m.y} ${E.x} ${E.y} ${w.x} ${w.y}`,
966
+ `C ${y.x} ${y.y} ${E.x} ${E.y} ${w.x} ${w.y}`,
967
967
  `C ${A.x} ${A.y} ${v.x} ${v.y} ${l.x} ${l.y}`,
968
968
  `L ${s.x} ${s.y}`
969
969
  ].join(" "), this.midpoint = W(w, e.flipX, e.flipY, e.to);
@@ -992,13 +992,13 @@ const Z = Object.freeze({
992
992
  let i = 0, n = 0, a = 0;
993
993
  r.forEach((h, d) => {
994
994
  let c = 0, g = 0, l = 0;
995
- const u = d > 0, w = d < s, m = u && w;
995
+ const u = d > 0, w = d < s, y = u && w;
996
996
  if (u && (c = -i, g = -n, l = a), w) {
997
997
  const $ = r[d + 1];
998
998
  i = $.x - h.x, n = $.y - h.y, a = Math.sqrt(i * i + n * n);
999
999
  }
1000
- const E = a !== 0 ? Math.min((m ? e : 0) / a, d < s - 1 ? 0.5 : 1) : 0, A = m ? { x: h.x + i * E, y: h.y + n * E } : h, T = l !== 0 ? Math.min((m ? e : 0) / l, d > 1 ? 0.5 : 1) : 0, N = m ? { x: h.x + c * T, y: h.y + g * T } : h;
1001
- d > 0 && t.push(`L ${N.x} ${N.y}`), m && t.push(
1000
+ const E = a !== 0 ? Math.min((y ? e : 0) / a, d < s - 1 ? 0.5 : 1) : 0, A = y ? { x: h.x + i * E, y: h.y + n * E } : h, T = l !== 0 ? Math.min((y ? e : 0) / l, d > 1 ? 0.5 : 1) : 0, N = y ? { x: h.x + c * T, y: h.y + g * T } : h;
1001
+ d > 0 && t.push(`L ${N.x} ${N.y}`), y && t.push(
1002
1002
  `C ${h.x} ${h.y} ${h.x} ${h.y} ${A.x} ${A.y}`
1003
1003
  );
1004
1004
  });
@@ -1012,22 +1012,22 @@ class qe {
1012
1012
  this.params = e;
1013
1013
  const t = this.params.to;
1014
1014
  this.midpoint = { x: t.x / 2, y: t.y / 2 };
1015
- const s = this.params.hasSourceArrow ? y(
1015
+ const s = this.params.hasSourceArrow ? m(
1016
1016
  { x: this.params.arrowLength, y: p.y },
1017
1017
  this.params.sourceDirection,
1018
1018
  p
1019
- ) : p, i = this.params.hasTargetArrow ? y(
1019
+ ) : p, i = this.params.hasTargetArrow ? m(
1020
1020
  {
1021
1021
  x: this.params.to.x - this.params.arrowLength,
1022
1022
  y: this.params.to.y
1023
1023
  },
1024
1024
  this.params.targetDirection,
1025
1025
  this.params.to
1026
- ) : this.params.to, n = this.params.arrowLength + this.params.arrowOffset, a = n - this.params.roundness, h = y(
1026
+ ) : this.params.to, n = this.params.arrowLength + this.params.arrowOffset, a = n - this.params.roundness, h = m(
1027
1027
  { x: a, y: p.y },
1028
1028
  this.params.sourceDirection,
1029
1029
  p
1030
- ), d = y(
1030
+ ), d = m(
1031
1031
  { x: this.params.to.x - a, y: this.params.to.y },
1032
1032
  this.params.targetDirection,
1033
1033
  this.params.to
@@ -1037,9 +1037,9 @@ class qe {
1037
1037
  }, u = { x: l.x, y: g }, w = {
1038
1038
  x: this.params.flipX > 0 ? this.params.to.x - c : this.params.to.x + n,
1039
1039
  y: d.y
1040
- }, m = { x: w.x, y: g };
1040
+ }, y = { x: w.x, y: g };
1041
1041
  this.path = L(
1042
- [s, h, l, u, m, w, d, i],
1042
+ [s, h, l, u, y, w, d, i],
1043
1043
  this.params.roundness
1044
1044
  );
1045
1045
  }
@@ -1049,22 +1049,22 @@ class _e {
1049
1049
  o(this, "path");
1050
1050
  o(this, "midpoint");
1051
1051
  this.params = e;
1052
- const t = this.params.hasSourceArrow ? y(
1052
+ const t = this.params.hasSourceArrow ? m(
1053
1053
  { x: this.params.arrowLength, y: p.y },
1054
1054
  this.params.sourceDirection,
1055
1055
  p
1056
- ) : p, s = this.params.hasTargetArrow ? y(
1056
+ ) : p, s = this.params.hasTargetArrow ? m(
1057
1057
  {
1058
1058
  x: this.params.to.x - this.params.arrowLength,
1059
1059
  y: this.params.to.y
1060
1060
  },
1061
1061
  this.params.targetDirection,
1062
1062
  this.params.to
1063
- ) : this.params.to, i = this.params.arrowLength + this.params.arrowOffset, n = y(
1063
+ ) : this.params.to, i = this.params.arrowLength + this.params.arrowOffset, n = m(
1064
1064
  { x: i, y: p.y },
1065
1065
  this.params.sourceDirection,
1066
1066
  p
1067
- ), a = Math.cos(this.params.detourDirection) * this.params.detourDistance, h = Math.sin(this.params.detourDirection) * this.params.detourDistance, d = a * this.params.flipX, c = h * this.params.flipY, g = { x: n.x + d, y: n.y + c }, l = y(
1067
+ ), a = Math.cos(this.params.detourDirection) * this.params.detourDistance, h = Math.sin(this.params.detourDirection) * this.params.detourDistance, d = a * this.params.flipX, c = h * this.params.flipY, g = { x: n.x + d, y: n.y + c }, l = m(
1068
1068
  { x: this.params.to.x - i, y: this.params.to.y },
1069
1069
  this.params.targetDirection,
1070
1070
  this.params.to
@@ -1082,22 +1082,22 @@ class et {
1082
1082
  this.params = e;
1083
1083
  const t = this.params.to;
1084
1084
  this.midpoint = { x: t.x / 2, y: t.y / 2 };
1085
- const s = this.params.hasSourceArrow ? y(
1085
+ const s = this.params.hasSourceArrow ? m(
1086
1086
  { x: this.params.arrowLength, y: p.y },
1087
1087
  this.params.sourceDirection,
1088
1088
  p
1089
- ) : p, i = this.params.hasTargetArrow ? y(
1089
+ ) : p, i = this.params.hasTargetArrow ? m(
1090
1090
  {
1091
1091
  x: this.params.to.x - this.params.arrowLength,
1092
1092
  y: this.params.to.y
1093
1093
  },
1094
1094
  this.params.targetDirection,
1095
1095
  this.params.to
1096
- ) : this.params.to, n = this.params.arrowLength + this.params.arrowOffset, a = y(
1096
+ ) : this.params.to, n = this.params.arrowLength + this.params.arrowOffset, a = m(
1097
1097
  { x: n, y: p.y },
1098
1098
  this.params.sourceDirection,
1099
1099
  p
1100
- ), h = y(
1100
+ ), h = m(
1101
1101
  { x: this.params.to.x - n, y: this.params.to.y },
1102
1102
  this.params.targetDirection,
1103
1103
  this.params.to
@@ -1112,22 +1112,22 @@ class tt {
1112
1112
  this.params = e;
1113
1113
  const t = this.params.to;
1114
1114
  this.midpoint = { x: t.x / 2, y: t.y / 2 };
1115
- const s = this.params.hasSourceArrow ? y(
1115
+ const s = this.params.hasSourceArrow ? m(
1116
1116
  { x: this.params.arrowLength, y: p.y },
1117
1117
  this.params.sourceDirection,
1118
1118
  p
1119
- ) : p, i = this.params.hasTargetArrow ? y(
1119
+ ) : p, i = this.params.hasTargetArrow ? m(
1120
1120
  {
1121
1121
  x: this.params.to.x - this.params.arrowLength,
1122
1122
  y: this.params.to.y
1123
1123
  },
1124
1124
  this.params.targetDirection,
1125
1125
  this.params.to
1126
- ) : this.params.to, n = this.params.arrowLength + this.params.arrowOffset, a = n - this.params.roundness, h = y(
1126
+ ) : this.params.to, n = this.params.arrowLength + this.params.arrowOffset, a = n - this.params.roundness, h = m(
1127
1127
  { x: a, y: p.y },
1128
1128
  this.params.sourceDirection,
1129
1129
  p
1130
- ), d = y(
1130
+ ), d = m(
1131
1131
  { x: this.params.to.x - a, y: this.params.to.y },
1132
1132
  this.params.targetDirection,
1133
1133
  this.params.to
@@ -1137,9 +1137,9 @@ class tt {
1137
1137
  }, u = { x: g, y: l.y }, w = {
1138
1138
  x: d.x,
1139
1139
  y: this.params.flipY > 0 ? this.params.to.y - c : this.params.to.y + n
1140
- }, m = { x: g, y: w.y };
1140
+ }, y = { x: g, y: w.y };
1141
1141
  this.path = L(
1142
- [s, h, l, u, m, w, d, i],
1142
+ [s, h, l, u, y, w, d, i],
1143
1143
  this.params.roundness
1144
1144
  );
1145
1145
  }
@@ -1159,7 +1159,7 @@ class J {
1159
1159
  { x: i, y: p.y },
1160
1160
  { x: this.params.arrowLength, y: p.y }
1161
1161
  ].map(
1162
- (c) => y(c, this.params.sourceDirection, p)
1162
+ (c) => m(c, this.params.sourceDirection, p)
1163
1163
  ), d = `M ${p.x} ${p.y} L ${h[0].x} ${h[0].y} `;
1164
1164
  this.path = `${this.params.hasSourceArrow || this.params.hasTargetArrow ? "" : d}${L(h, this.params.roundness)}`, this.midpoint = { x: (h[3].x + h[4].x) / 2, y: (h[3].y + h[4].y) / 2 };
1165
1165
  }
@@ -1175,7 +1175,7 @@ class rt {
1175
1175
  { x: c, y: -n },
1176
1176
  { x: d, y: 0 }
1177
1177
  ].map(
1178
- (m) => y(m, this.params.sourceDirection, p)
1178
+ (y) => m(y, this.params.sourceDirection, p)
1179
1179
  ), u = [
1180
1180
  `M ${l[0].x} ${l[0].y}`,
1181
1181
  `A ${t} ${t} 0 0 1 ${l[1].x} ${l[1].y}`,
@@ -1226,22 +1226,22 @@ class ot {
1226
1226
  o(this, "path");
1227
1227
  o(this, "midpoint");
1228
1228
  this.params = e;
1229
- const t = this.params.hasSourceArrow ? y(
1229
+ const t = this.params.hasSourceArrow ? m(
1230
1230
  { x: this.params.arrowLength, y: p.y },
1231
1231
  this.params.sourceDirection,
1232
1232
  p
1233
- ) : p, s = this.params.hasTargetArrow ? y(
1233
+ ) : p, s = this.params.hasTargetArrow ? m(
1234
1234
  {
1235
1235
  x: this.params.to.x - this.params.arrowLength,
1236
1236
  y: this.params.to.y
1237
1237
  },
1238
1238
  this.params.targetDirection,
1239
1239
  this.params.to
1240
- ) : this.params.to, i = this.params.arrowLength + this.params.arrowOffset, n = y(
1240
+ ) : this.params.to, i = this.params.arrowLength + this.params.arrowOffset, n = m(
1241
1241
  { x: i, y: p.y },
1242
1242
  this.params.sourceDirection,
1243
1243
  p
1244
- ), a = y(
1244
+ ), a = m(
1245
1245
  { x: this.params.to.x - i, y: this.params.to.y },
1246
1246
  this.params.targetDirection,
1247
1247
  this.params.to
@@ -1267,22 +1267,22 @@ class it {
1267
1267
  o(this, "path");
1268
1268
  o(this, "midpoint");
1269
1269
  this.params = e;
1270
- const t = this.params.hasSourceArrow ? y(
1270
+ const t = this.params.hasSourceArrow ? m(
1271
1271
  { x: this.params.arrowLength, y: p.y },
1272
1272
  this.params.sourceDirection,
1273
1273
  p
1274
- ) : p, s = this.params.hasTargetArrow ? y(
1274
+ ) : p, s = this.params.hasTargetArrow ? m(
1275
1275
  {
1276
1276
  x: this.params.to.x - this.params.arrowLength,
1277
1277
  y: this.params.to.y
1278
1278
  },
1279
1279
  this.params.targetDirection,
1280
1280
  this.params.to
1281
- ) : this.params.to, i = this.params.arrowLength + this.params.arrowOffset, n = y(
1281
+ ) : this.params.to, i = this.params.arrowLength + this.params.arrowOffset, n = m(
1282
1282
  { x: i, y: p.y },
1283
1283
  this.params.sourceDirection,
1284
1284
  p
1285
- ), a = y(
1285
+ ), a = m(
1286
1286
  { x: this.params.to.x - i, y: this.params.to.y },
1287
1287
  this.params.targetDirection,
1288
1288
  this.params.to
@@ -1336,7 +1336,7 @@ class k {
1336
1336
  o(this, "onAfterRender");
1337
1337
  o(this, "afterRenderEmitter");
1338
1338
  o(this, "arrowRenderer");
1339
- this.params = e, [this.afterRenderEmitter, this.onAfterRender] = S(), this.arrowRenderer = this.params.arrowRenderer, this.svg = Pe(e.color), this.svg.appendChild(this.group), this.line = be(e.width), this.group.appendChild(this.line), e.hasSourceArrow && (this.sourceArrow = O(), this.group.appendChild(this.sourceArrow)), e.hasTargetArrow && (this.targetArrow = O(), this.group.appendChild(this.targetArrow));
1339
+ this.params = e, [this.afterRenderEmitter, this.onAfterRender] = x(), this.arrowRenderer = this.params.arrowRenderer, this.svg = Pe(e.color), this.svg.appendChild(this.group), this.line = be(e.width), this.group.appendChild(this.line), e.hasSourceArrow && (this.sourceArrow = O(), this.group.appendChild(this.sourceArrow)), e.hasTargetArrow && (this.targetArrow = O(), this.group.appendChild(this.targetArrow));
1340
1340
  }
1341
1341
  render(e) {
1342
1342
  const { x: t, y: s, width: i, height: n, flipX: a, flipY: h } = Se(
@@ -1366,12 +1366,12 @@ class k {
1366
1366
  h
1367
1367
  );
1368
1368
  this.line.setAttribute("d", w.path);
1369
- let m = null;
1370
- this.sourceArrow && (m = this.arrowRenderer({
1369
+ let y = null;
1370
+ this.sourceArrow && (y = this.arrowRenderer({
1371
1371
  direction: d,
1372
1372
  shift: p,
1373
1373
  arrowLength: this.params.arrowLength
1374
- }), this.sourceArrow.setAttribute("d", m));
1374
+ }), this.sourceArrow.setAttribute("d", y));
1375
1375
  let v = null;
1376
1376
  this.targetArrow && (v = this.arrowRenderer({
1377
1377
  direction: l,
@@ -1379,7 +1379,7 @@ class k {
1379
1379
  arrowLength: this.params.arrowLength
1380
1380
  }), this.targetArrow.setAttribute("d", v)), this.afterRenderEmitter.emit({
1381
1381
  edgePath: w,
1382
- sourceArrowPath: m,
1382
+ sourceArrowPath: y,
1383
1383
  targetArrowPath: v
1384
1384
  });
1385
1385
  }
@@ -1390,7 +1390,7 @@ const nt = (r) => (e) => {
1390
1390
  { x: e.arrowLength, y: r.radius },
1391
1391
  { x: e.arrowLength, y: -r.radius }
1392
1392
  ].map(
1393
- (h) => y(h, e.direction, p)
1393
+ (h) => m(h, e.direction, p)
1394
1394
  ).map((h) => ({
1395
1395
  x: h.x + e.shift.x,
1396
1396
  y: h.y + e.shift.y
@@ -1398,14 +1398,14 @@ const nt = (r) => (e) => {
1398
1398
  return `${i} ${n} ${a} Z`;
1399
1399
  }, at = (r) => (e) => {
1400
1400
  const t = r.radius, s = e.arrowLength, i = (s * s + 2 * s * t) / (2 * t), n = i + t, a = s + t - t * (s + t) / n, h = t * i / n, c = [p, { x: a, y: -h }, { x: a, y: h }].map(
1401
- (m) => y(m, e.direction, p)
1402
- ).map((m) => ({
1403
- x: m.x + e.shift.x,
1404
- y: m.y + e.shift.y
1401
+ (y) => m(y, e.direction, p)
1402
+ ).map((y) => ({
1403
+ x: y.x + e.shift.x,
1404
+ y: y.y + e.shift.y
1405
1405
  })), g = `M ${c[0].x} ${c[0].y}`, l = `A ${i} ${i} 0 0 0 ${c[1].x} ${c[1].y}`, u = `A ${t} ${t} 0 0 0 ${c[2].x} ${c[2].y}`, w = `A ${i} ${i} 0 0 0 ${c[0].x} ${c[0].y}`;
1406
1406
  return `${g} ${l} ${u} ${w}`;
1407
1407
  }, ht = (r) => (e) => {
1408
- const t = r.smallRadius, s = r.radius, i = y(
1408
+ const t = r.smallRadius, s = r.radius, i = m(
1409
1409
  {
1410
1410
  x: e.arrowLength,
1411
1411
  y: 0
@@ -1419,7 +1419,7 @@ const nt = (r) => (e) => {
1419
1419
  y: 0
1420
1420
  }
1421
1421
  ), a = [p, { x: i.x, y: -i.y }, i].map(
1422
- (l) => y(l, e.direction, p)
1422
+ (l) => m(l, e.direction, p)
1423
1423
  ).map((l) => ({
1424
1424
  x: l.x + e.shift.x,
1425
1425
  y: l.y + e.shift.y
@@ -1737,7 +1737,7 @@ class Ne {
1737
1737
  o(this, "onAfterRender");
1738
1738
  o(this, "afterRenderEmitter");
1739
1739
  o(this, "arrowRenderer");
1740
- [this.afterRenderEmitter, this.onAfterRender] = S(), this.color = (e == null ? void 0 : e.color) ?? f.color, this.width = (e == null ? void 0 : e.width) ?? f.width, this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? f.arrowLength, this.arrowRenderer = I((e == null ? void 0 : e.arrowRenderer) ?? {}), this.sourceOffset = (e == null ? void 0 : e.sourceOffset) ?? f.preOffset, this.targetOffset = (e == null ? void 0 : e.targetOffset) ?? f.preOffset, this.svg = Pe(this.color), this.svg.appendChild(this.group), this.line = be(this.width), this.group.appendChild(this.line), e != null && e.hasSourceArrow && (this.sourceArrow = O(), this.group.appendChild(this.sourceArrow)), e != null && e.hasTargetArrow && (this.targetArrow = O(), this.group.appendChild(this.targetArrow));
1740
+ [this.afterRenderEmitter, this.onAfterRender] = x(), this.color = (e == null ? void 0 : e.color) ?? f.color, this.width = (e == null ? void 0 : e.width) ?? f.width, this.arrowLength = (e == null ? void 0 : e.arrowLength) ?? f.arrowLength, this.arrowRenderer = I((e == null ? void 0 : e.arrowRenderer) ?? {}), this.sourceOffset = (e == null ? void 0 : e.sourceOffset) ?? f.preOffset, this.targetOffset = (e == null ? void 0 : e.targetOffset) ?? f.preOffset, this.svg = Pe(this.color), this.svg.appendChild(this.group), this.line = be(this.width), this.group.appendChild(this.line), e != null && e.hasSourceArrow && (this.sourceArrow = O(), this.group.appendChild(this.sourceArrow)), e != null && e.hasTargetArrow && (this.targetArrow = O(), this.group.appendChild(this.targetArrow));
1741
1741
  }
1742
1742
  render(e) {
1743
1743
  const { x: t, y: s, width: i, height: n, flipX: a, flipY: h } = Se(
@@ -1764,26 +1764,26 @@ class Ne {
1764
1764
  y: d.y / u
1765
1765
  };
1766
1766
  if (this.sourceArrow) {
1767
- const m = {
1767
+ const y = {
1768
1768
  x: w.x * this.sourceOffset,
1769
1769
  y: w.y * this.sourceOffset
1770
1770
  };
1771
1771
  g = this.arrowRenderer({
1772
1772
  direction: w,
1773
- shift: m,
1773
+ shift: y,
1774
1774
  arrowLength: this.arrowLength
1775
1775
  }), this.sourceArrow.setAttribute("d", g);
1776
1776
  }
1777
1777
  if (this.targetArrow) {
1778
- const m = {
1778
+ const y = {
1779
1779
  x: w.x * this.targetOffset,
1780
1780
  y: w.y * this.targetOffset
1781
1781
  };
1782
1782
  l = this.arrowRenderer({
1783
1783
  direction: { x: -w.x, y: -w.y },
1784
1784
  shift: {
1785
- x: d.x - m.x,
1786
- y: d.y - m.y
1785
+ x: d.x - y.x,
1786
+ y: d.y - y.y
1787
1787
  },
1788
1788
  arrowLength: this.arrowLength
1789
1789
  }), this.targetArrow.setAttribute("d", l);
@@ -1960,7 +1960,7 @@ class Re {
1960
1960
  }
1961
1961
  }
1962
1962
  const Ce = (r, e) => {
1963
- const t = new Ee(), s = new Le(t), i = new Re(e), n = new ye(t, e, r), a = {
1963
+ const t = new Ee(), s = new Le(t), i = new Re(e), n = new me(t, e, r), a = {
1964
1964
  nodes: {
1965
1965
  centerFn: xe,
1966
1966
  priorityFn: () => 0
@@ -2283,7 +2283,7 @@ const ft = (r, e, t) => ({
2283
2283
  scale: r.scale,
2284
2284
  x: r.x + r.scale * e,
2285
2285
  y: r.y + r.scale * t
2286
- }), mt = (r, e, t, s) => ({
2286
+ }), yt = (r, e, t, s) => ({
2287
2287
  scale: r.scale * e,
2288
2288
  x: r.scale * (1 - e) * t + r.x,
2289
2289
  y: r.scale * (1 - e) * s + r.y
@@ -2415,7 +2415,7 @@ class X {
2415
2415
  this.performTransform(h);
2416
2416
  }
2417
2417
  scaleViewport(e, t, s) {
2418
- const i = this.canvas.viewport.getViewportMatrix(), n = mt(i, e, t, s), { width: a, height: h } = this.element.getBoundingClientRect(), d = this.params.transformPreprocessor({
2418
+ const i = this.canvas.viewport.getViewportMatrix(), n = yt(i, e, t, s), { width: a, height: h } = this.element.getBoundingClientRect(), d = this.params.transformPreprocessor({
2419
2419
  prevTransform: i,
2420
2420
  nextTransform: n,
2421
2421
  canvasWidth: a,
@@ -2527,7 +2527,7 @@ class q {
2527
2527
  this.trigger.emit({ x: s, y: i, width: n, height: a });
2528
2528
  }
2529
2529
  }
2530
- const yt = () => {
2530
+ const mt = () => {
2531
2531
  const r = document.createElementNS("http://www.w3.org/2000/svg", "svg");
2532
2532
  return r.style.position = "absolute", r.style.inset = "0", r;
2533
2533
  }, vt = () => {
@@ -2542,7 +2542,7 @@ const yt = () => {
2542
2542
  };
2543
2543
  class _ {
2544
2544
  constructor(e, t, s) {
2545
- o(this, "svg", yt());
2545
+ o(this, "svg", mt());
2546
2546
  o(this, "patternRenderingRectangle", vt());
2547
2547
  o(this, "pattern", Et());
2548
2548
  o(this, "patternContent");
@@ -2638,9 +2638,9 @@ class ee {
2638
2638
  portDirection: this.params.dragPortDirection
2639
2639
  };
2640
2640
  this.isTargetDragging = s === "direct";
2641
- const [m, v] = this.isTargetDragging ? [u, w] : [w, u];
2642
- this.overlayCanvas.addNode(F(m)), this.overlayCanvas.addNode(F(v)), this.overlayCanvas.addEdge({
2643
- from: m.overlayId,
2641
+ const [y, v] = this.isTargetDragging ? [u, w] : [w, u];
2642
+ this.overlayCanvas.addNode(F(y)), this.overlayCanvas.addNode(F(v)), this.overlayCanvas.addEdge({
2643
+ from: y.overlayId,
2644
2644
  to: v.overlayId,
2645
2645
  shape: this.params.edgeShapeFactory(b.Edge)
2646
2646
  });
@@ -2724,7 +2724,7 @@ class te {
2724
2724
  const d = this.canvas.graph.getPort(e), c = this.canvas.graph.getPort(h), g = c.element.getBoundingClientRect(), l = {
2725
2725
  x: g.x + g.width / 2,
2726
2726
  y: g.y + g.height / 2
2727
- }, u = this.canvas.viewport.getViewportMatrix(), w = this.overlayLayer.getBoundingClientRect(), m = D(u, {
2727
+ }, u = this.canvas.viewport.getViewportMatrix(), w = this.overlayLayer.getBoundingClientRect(), y = D(u, {
2728
2728
  x: l.x - w.x,
2729
2729
  y: l.y - w.y
2730
2730
  }), v = D(u, {
@@ -2740,7 +2740,7 @@ class te {
2740
2740
  }, this.canvas.removeEdge(s);
2741
2741
  const E = {
2742
2742
  overlayId: b.Static,
2743
- portCoords: m,
2743
+ portCoords: y,
2744
2744
  portDirection: c.direction
2745
2745
  }, A = {
2746
2746
  overlayId: b.Dragging,
@@ -3028,10 +3028,10 @@ const j = (r) => () => r, we = j(0), bt = () => {
3028
3028
  }
3029
3029
  };
3030
3030
  }, Nt = (r) => {
3031
- var u, w, m, v, E;
3031
+ var u, w, y, v, E;
3032
3032
  const e = ((u = r.events) == null ? void 0 : u.onNodeDrag) ?? (() => {
3033
3033
  }), t = r.nodeDragVerifier ?? (() => !0), s = ((w = r.events) == null ? void 0 : w.onNodeDragFinished) ?? (() => {
3034
- }), i = r.moveOnTop !== !1, n = r.moveEdgesOnTop !== !1 && i, a = (m = r.mouse) == null ? void 0 : m.dragCursor, h = a !== void 0 ? a : "grab", d = (v = r.mouse) == null ? void 0 : v.mouseDownEventVerifier, c = d !== void 0 ? d : (A) => A.button === 0, g = (E = r.mouse) == null ? void 0 : E.mouseUpEventVerifier, l = g !== void 0 ? g : (A) => A.button === 0;
3034
+ }), i = r.moveOnTop !== !1, n = r.moveEdgesOnTop !== !1 && i, a = (y = r.mouse) == null ? void 0 : y.dragCursor, h = a !== void 0 ? a : "grab", d = (v = r.mouse) == null ? void 0 : v.mouseDownEventVerifier, c = d !== void 0 ? d : (A) => A.button === 0, g = (E = r.mouse) == null ? void 0 : E.mouseUpEventVerifier, l = g !== void 0 ? g : (A) => A.button === 0;
3035
3035
  return {
3036
3036
  moveOnTop: i,
3037
3037
  moveEdgesOnTop: n,
@@ -3099,9 +3099,9 @@ const j = (r) => () => r, we = j(0), bt = () => {
3099
3099
  maxY: r.maxY ?? 1 / 0
3100
3100
  });
3101
3101
  }
3102
- }, me = (r) => {
3103
- var m, v, E, A, R, T, N, $, ne, ae, he, de;
3104
- const e = (m = r == null ? void 0 : r.scale) == null ? void 0 : m.mouseWheelSensitivity, t = e !== void 0 ? e : 1.2, s = r == null ? void 0 : r.transformPreprocessor;
3102
+ }, ye = (r) => {
3103
+ var y, v, E, A, R, T, N, $, ne, ae, he, de;
3104
+ const e = (y = r == null ? void 0 : r.scale) == null ? void 0 : y.mouseWheelSensitivity, t = e !== void 0 ? e : 1.2, s = r == null ? void 0 : r.transformPreprocessor;
3105
3105
  let i;
3106
3106
  s !== void 0 ? Array.isArray(s) ? i = Rt(
3107
3107
  s.map(
@@ -3241,13 +3241,13 @@ class Ve {
3241
3241
  const c = s[d], g = i.getVector(h, c);
3242
3242
  if (g.d > this.effectiveDistance)
3243
3243
  continue;
3244
- const l = this.k / g.d2, u = l * g.ex, w = l * g.ey, m = u / 2, v = w / 2, E = t.get(h), A = t.get(c);
3245
- E.x -= m, E.y -= v, A.x += m, A.y += v;
3244
+ const l = this.k / g.d2, u = l * g.ex, w = l * g.ey, y = u / 2, v = w / 2, E = t.get(h), A = t.get(c);
3245
+ E.x -= y, E.y -= v, A.x += y, A.y += v;
3246
3246
  }
3247
3247
  }
3248
3248
  return this.graph.getAllEdgeIds().forEach((a) => {
3249
- const h = this.graph.getEdge(a), d = this.graph.getPort(h.from), c = this.graph.getPort(h.to), g = i.getVector(d.nodeId, c.nodeId), u = (g.d - this.edgeEquilibriumLength) * this.edgeStiffness / 2, w = g.ex * u, m = g.ey * u, v = t.get(d.nodeId), E = t.get(c.nodeId);
3250
- v.x += w, v.y += m, E.x -= w, E.y -= m;
3249
+ const h = this.graph.getEdge(a), d = this.graph.getPort(h.from), c = this.graph.getPort(h.to), g = i.getVector(d.nodeId, c.nodeId), u = (g.d - this.edgeEquilibriumLength) * this.edgeStiffness / 2, w = g.ex * u, y = g.ey * u, v = t.get(d.nodeId), E = t.get(c.nodeId);
3250
+ v.x += w, v.y += y, E.x -= w, E.y -= y;
3251
3251
  }), this.currentCoords.forEach((a, h) => {
3252
3252
  const d = t.get(h), c = {
3253
3253
  x: d.x / this.nodeMass * this.dtSec,
@@ -3323,7 +3323,7 @@ const Ie = (r) => {
3323
3323
  r |= 0, e |= 0, t |= 0, s |= 0;
3324
3324
  const i = (r + e | 0) + s | 0;
3325
3325
  return s = s + 1 | 0, r = e ^ e >>> 9, e = t + (t << 3) | 0, t = t << 21 | t >>> 11, t = t + i | 0, (i >>> 0) / 4294967296;
3326
- }, x = Object.freeze({
3326
+ }, S = Object.freeze({
3327
3327
  seed: "HTMLGraph is awesome",
3328
3328
  maxTimeDeltaSec: 0.1,
3329
3329
  nodeCharge: 1e5,
@@ -3340,16 +3340,16 @@ const Ie = (r) => {
3340
3340
  case "custom":
3341
3341
  return r.algorithm.instance;
3342
3342
  default: {
3343
- const t = r == null ? void 0 : r.algorithm, s = Ie((t == null ? void 0 : t.seed) ?? x.seed), i = Ue(s[0], s[1], s[2], s[3]);
3343
+ const t = r == null ? void 0 : r.algorithm, s = Ie((t == null ? void 0 : t.seed) ?? S.seed), i = Ue(s[0], s[1], s[2], s[3]);
3344
3344
  return new zt({
3345
3345
  rand: i,
3346
- maxTimeDeltaSec: (t == null ? void 0 : t.maxTimeDeltaSec) ?? x.maxTimeDeltaSec,
3347
- nodeCharge: (t == null ? void 0 : t.nodeCharge) ?? x.nodeCharge,
3348
- nodeMass: (t == null ? void 0 : t.nodeMass) ?? x.nodeMass,
3349
- edgeEquilibriumLength: (t == null ? void 0 : t.edgeEquilibriumLength) ?? x.edgeEquilibriumLength,
3350
- effectiveDistance: x.effectiveDistance,
3351
- edgeStiffness: (t == null ? void 0 : t.edgeStiffness) ?? x.edgeStiffness,
3352
- convergenceDelta: (t == null ? void 0 : t.convergenceDelta) ?? x.convergenceDelta
3346
+ maxTimeDeltaSec: (t == null ? void 0 : t.maxTimeDeltaSec) ?? S.maxTimeDeltaSec,
3347
+ nodeCharge: (t == null ? void 0 : t.nodeCharge) ?? S.nodeCharge,
3348
+ nodeMass: (t == null ? void 0 : t.nodeMass) ?? S.nodeMass,
3349
+ edgeEquilibriumLength: (t == null ? void 0 : t.edgeEquilibriumLength) ?? S.edgeEquilibriumLength,
3350
+ effectiveDistance: S.effectiveDistance,
3351
+ edgeStiffness: (t == null ? void 0 : t.edgeStiffness) ?? S.edgeStiffness,
3352
+ convergenceDelta: (t == null ? void 0 : t.convergenceDelta) ?? S.convergenceDelta
3353
3353
  });
3354
3354
  }
3355
3355
  }
@@ -3363,18 +3363,17 @@ const Ie = (r) => {
3363
3363
  case "custom":
3364
3364
  return r.instance;
3365
3365
  default: {
3366
- const e = Ie((r == null ? void 0 : r.seed) ?? x.seed), t = Ue(e[0], e[1], e[2], e[3]);
3366
+ const e = Ie((r == null ? void 0 : r.seed) ?? S.seed), t = Ue(e[0], e[1], e[2], e[3]);
3367
3367
  return new kt({
3368
- dtSec: (r == null ? void 0 : r.dtSec) ?? x.dtSec,
3369
- maxIterations: (r == null ? void 0 : r.maxIterations) ?? x.maxIterations,
3368
+ dtSec: (r == null ? void 0 : r.dtSec) ?? S.dtSec,
3369
+ maxIterations: (r == null ? void 0 : r.maxIterations) ?? S.maxIterations,
3370
3370
  rand: t,
3371
- maxTimeDeltaSec: (r == null ? void 0 : r.maxTimeDeltaSec) ?? x.maxTimeDeltaSec,
3372
- nodeCharge: (r == null ? void 0 : r.nodeCharge) ?? x.nodeCharge,
3373
- nodeMass: (r == null ? void 0 : r.nodeMass) ?? x.nodeMass,
3374
- edgeEquilibriumLength: (r == null ? void 0 : r.edgeEquilibriumLength) ?? x.edgeEquilibriumLength,
3375
- edgeStiffness: (r == null ? void 0 : r.edgeStiffness) ?? x.edgeStiffness,
3376
- effectiveDistance: (r == null ? void 0 : r.effectiveDistance) ?? x.effectiveDistance,
3377
- convergenceDelta: (r == null ? void 0 : r.convergenceDelta) ?? x.convergenceDelta
3371
+ nodeCharge: (r == null ? void 0 : r.nodeCharge) ?? S.nodeCharge,
3372
+ nodeMass: (r == null ? void 0 : r.nodeMass) ?? S.nodeMass,
3373
+ edgeEquilibriumLength: (r == null ? void 0 : r.edgeEquilibriumLength) ?? S.edgeEquilibriumLength,
3374
+ edgeStiffness: (r == null ? void 0 : r.edgeStiffness) ?? S.edgeStiffness,
3375
+ effectiveDistance: (r == null ? void 0 : r.effectiveDistance) ?? S.effectiveDistance,
3376
+ convergenceDelta: (r == null ? void 0 : r.convergenceDelta) ?? S.convergenceDelta
3378
3377
  });
3379
3378
  }
3380
3379
  }
@@ -3492,7 +3491,7 @@ class Qt {
3492
3491
  throw new Ot("CanvasBuilder is a single use object");
3493
3492
  this.used = !0;
3494
3493
  const e = new Pt(this.element);
3495
- let t = new ye(
3494
+ let t = new me(
3496
3495
  this.graphStore,
3497
3496
  this.viewportStore,
3498
3497
  e.main
@@ -3558,14 +3557,14 @@ class Qt {
3558
3557
  i,
3559
3558
  e.main,
3560
3559
  this.window,
3561
- me(this.transformConfig),
3560
+ ye(this.transformConfig),
3562
3561
  this.boxRenderingTrigger,
3563
3562
  Bt(this.virtualScrollConfig)
3564
3563
  ) : this.hasTransformableViewport && X.configure(
3565
3564
  i,
3566
3565
  e.main,
3567
3566
  this.window,
3568
- me(this.transformConfig)
3567
+ ye(this.transformConfig)
3569
3568
  ), this.hasLayout && At.configure(
3570
3569
  i,
3571
3570
  jt(this.layoutConfig)
@@ -1 +1 @@
1
- (function(E,A){typeof exports=="object"&&typeof module<"u"?A(exports):typeof define=="function"&&define.amd?define(["exports"],A):(E=typeof globalThis<"u"?globalThis:E||self,A(E.HtmlGraph={}))})(this,function(E){"use strict";var Jt=Object.defineProperty;var Qt=(E,A,D)=>A in E?Jt(E,A,{enumerable:!0,configurable:!0,writable:!0,value:D}):E[A]=D;var o=(E,A,D)=>Qt(E,typeof A!="symbol"?A+"":A,D);const A=(r,e)=>({x:r.scale*e.x+r.x,y:r.scale*e.y+r.y});var D=(r=>(r.Line="line",r.NodeCycle="node-cycle",r.PortCycle="port-cycle",r))(D||{});const Xe=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r.style.overflow="hidden",r},Ye=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.width="0",r.style.height="0",r},je=r=>{r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.visibility="hidden"};class de{constructor(e,t,s){o(this,"host",Xe());o(this,"container",Ye());o(this,"edgeIdToElementMap",new Map);o(this,"attachedNodeIds",new Set);o(this,"applyTransform",()=>{const e=this.viewportStore.getContentMatrix();this.container.style.transform=`matrix(${e.scale}, 0, 0, ${e.scale}, ${e.x}, ${e.y})`});this.graphStore=e,this.viewportStore=t,this.element=s,this.element.appendChild(this.host),this.host.appendChild(this.container),this.viewportStore.onAfterUpdated.subscribe(this.applyTransform)}attachNode(e){const t=this.graphStore.getNode(e);je(t.element),this.attachedNodeIds.add(e),this.container.appendChild(t.element),this.updateNodePosition(e),this.updateNodePriority(e),t.element.style.visibility="visible"}detachNode(e){const t=this.graphStore.getNode(e);this.container.removeChild(t.element),this.attachedNodeIds.delete(e)}attachEdge(e){const t=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,t),this.container.appendChild(t),this.renderEdge(e),this.updateEdgePriority(e)}detachEdge(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t),this.edgeIdToElementMap.delete(e)}clear(){this.edgeIdToElementMap.forEach((e,t)=>{this.detachEdge(t)}),this.attachedNodeIds.forEach(e=>{this.detachNode(e)})}destroy(){this.viewportStore.onAfterUpdated.unsubscribe(this.applyTransform),this.element.removeChild(this.host),this.host.removeChild(this.container)}updateNodePosition(e){const t=this.graphStore.getNode(e),{width:s,height:i}=t.element.getBoundingClientRect(),n=this.viewportStore.getViewportMatrix().scale,{payload:a}=t,h=a.centerFn(s,i),d=a.x-n*h.x,c=a.y-n*h.y;t.element.style.transform=`translate(${d}px, ${c}px)`}updateNodePriority(e){const t=this.graphStore.getNode(e);t.element.style.zIndex=`${t.payload.priority}`}updateEdgeShape(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t);const i=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,i),this.container.appendChild(i)}renderEdge(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from),i=this.graphStore.getPort(t.to),n=s.element.getBoundingClientRect(),a=i.element.getBoundingClientRect(),h=this.host.getBoundingClientRect(),d=this.viewportStore.getViewportMatrix(),c=this.createEdgeRenderPort(s,n,h,d),g=this.createEdgeRenderPort(i,a,h,d);let l=D.Line;s.element===i.element?l=D.PortCycle:s.nodeId===i.nodeId&&(l=D.NodeCycle),t.payload.shape.render({from:c,to:g,category:l})}updateEdgePriority(e){const t=this.graphStore.getEdge(e);t.payload.shape.svg.style.zIndex=`${t.payload.priority}`}createEdgeRenderPort(e,t,s,i){const n={x:t.left-s.left,y:t.top-s.top},a=A(i,n);return{x:a.x,y:a.y,width:t.width*i.scale,height:t.height*i.scale,direction:e.payload.direction}}}class Ge{constructor(e){o(this,"xFrom",1/0);o(this,"yFrom",1/0);o(this,"xTo",1/0);o(this,"yTo",1/0);this.graphStore=e}setRenderingBox(e){this.xFrom=e.x,this.xTo=e.x+e.width,this.yFrom=e.y,this.yTo=e.y+e.height}hasNode(e){const t=this.graphStore.getNode(e).payload,{x:s,y:i}=t;return s>=this.xFrom&&s<=this.xTo&&i>=this.yFrom&&i<=this.yTo}hasEdge(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from).nodeId,i=this.graphStore.getPort(t.to).nodeId,n=this.graphStore.getNode(s).payload,a=this.graphStore.getNode(i).payload,h=Math.min(n.x,a.x),d=Math.max(n.x,a.x),c=Math.min(n.y,a.y),g=Math.max(n.y,a.y);return h<=this.xTo&&d>=this.xFrom&&c<=this.yTo&&g>=this.yFrom}}class Ke{constructor(e,t,s,i){o(this,"attachedNodes",new Set);o(this,"attachedEdges",new Set);o(this,"renderingBox");o(this,"updateViewport",e=>{this.renderingBox.setRenderingBox(e);const t=new Set,s=new Set,i=new Set,n=new Set;this.graphStore.getAllNodeIds().forEach(a=>{const h=this.renderingBox.hasNode(a),d=this.attachedNodes.has(a);h&&!d?t.add(a):!h&&d&&s.add(a)}),this.graphStore.getAllEdgeIds().forEach(a=>{const h=this.renderingBox.hasEdge(a),d=this.attachedEdges.has(a),c=this.graphStore.getEdge(a),g=this.graphStore.getPort(c.from).nodeId,l=this.graphStore.getPort(c.to).nodeId;h&&(this.renderingBox.hasNode(g)||(t.add(g),s.delete(g)),this.renderingBox.hasNode(l)||(t.add(l),s.delete(l))),h&&!d?i.add(a):!h&&d&&n.add(a)}),n.forEach(a=>{this.handleDetachEdge(a)}),s.forEach(a=>{this.handleDetachNode(a)}),t.forEach(a=>{this.attachedNodes.has(a)||this.handleAttachNode(a)}),i.forEach(a=>{this.handleAttachEdge(a)})});this.htmlView=e,this.graphStore=t,this.trigger=s,this.params=i,this.renderingBox=new Ge(this.graphStore),this.trigger.subscribe(this.updateViewport)}attachNode(e){this.renderingBox.hasNode(e)&&this.handleAttachNode(e)}detachNode(e){this.attachedNodes.has(e)&&this.handleDetachNode(e)}attachEdge(e){this.renderingBox.hasEdge(e)&&this.attachEdgeEntities(e)}detachEdge(e){this.attachedEdges.has(e)&&this.handleDetachEdge(e)}updateNodePosition(e){this.attachedNodes.has(e)?this.htmlView.updateNodePosition(e):this.renderingBox.hasNode(e)&&(this.handleAttachNode(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(t=>{this.attachEdgeEntities(t)}))}updateNodePriority(e){this.attachedNodes.has(e)&&this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgeShape(e)}renderEdge(e){this.attachedEdges.has(e)&&this.htmlView.renderEdge(e)}updateEdgePriority(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgePriority(e)}clear(){this.htmlView.clear(),this.attachedNodes.clear(),this.attachedEdges.clear()}destroy(){this.clear(),this.htmlView.destroy(),this.trigger.unsubscribe(this.updateViewport)}attachEdgeEntities(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from).nodeId,i=this.graphStore.getPort(t.to).nodeId;this.attachedNodes.has(s)||this.handleAttachNode(s),this.attachedNodes.has(i)||this.handleAttachNode(i),this.handleAttachEdge(e)}handleAttachNode(e){this.params.onBeforeNodeAttached(e),this.attachedNodes.add(e),this.htmlView.attachNode(e)}handleDetachNode(e){this.htmlView.detachNode(e),this.attachedNodes.delete(e),this.params.onAfterNodeDetached(e)}handleAttachEdge(e){this.attachedEdges.add(e),this.htmlView.attachEdge(e)}handleDetachEdge(e){this.htmlView.detachEdge(e),this.attachedEdges.delete(e)}}class Ze{constructor(e,t){o(this,"deferredNodes",new Set);o(this,"deferredEdges",new Set);this.htmlView=e,this.graphStore=t}attachNode(e){this.isNodeValid(e)?this.htmlView.attachNode(e):this.deferredNodes.add(e)}detachNode(e){this.deferredNodes.has(e)?this.deferredNodes.delete(e):this.htmlView.detachNode(e)}attachEdge(e){this.isEdgeValid(e)?this.htmlView.attachEdge(e):this.deferredEdges.add(e)}detachEdge(e){this.deferredEdges.has(e)?this.deferredEdges.delete(e):this.htmlView.detachEdge(e)}updateNodePosition(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePosition(e)}updateNodePriority(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgeShape(e)}renderEdge(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.renderEdge(e)}updateEdgePriority(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgePriority(e)}clear(){this.deferredNodes.clear(),this.deferredEdges.clear(),this.htmlView.clear()}destroy(){this.htmlView.destroy()}isNodeValid(e){const t=this.graphStore.getNode(e);return!(t.payload.x===null||t.payload.y===null)}tryAttachNode(e){this.isNodeValid(e)&&(this.deferredNodes.delete(e),this.htmlView.attachNode(e))}isEdgeValid(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from),i=this.graphStore.getPort(t.to);return!(this.deferredNodes.has(s.nodeId)||this.deferredNodes.has(i.nodeId))}tryAttachEdge(e){this.isEdgeValid(e)&&(this.deferredEdges.delete(e),this.htmlView.attachEdge(e))}}class B{constructor(){o(this,"callbacks",new Set)}subscribe(e){this.callbacks.add(e)}unsubscribe(e){this.callbacks.delete(e)}emit(e){this.callbacks.forEach(t=>{t(e)})}}const b=()=>{const r=new B;return[r,r]};class j{constructor(e){o(this,"counter",0);this.checkExists=e}create(e){if(e!==void 0)return e;for(;this.checkExists(this.counter);)this.counter++;return this.counter}reset(){this.counter=0}}class T extends Error{constructor(){super(...arguments);o(this,"name","CanvasError")}}class ce{constructor(e,t,s,i,n,a){o(this,"nodeIdGenerator",new j(e=>this.graphStore.getNode(e)!==void 0));o(this,"portIdGenerator",new j(e=>this.graphStore.getPort(e)!==void 0));o(this,"edgeIdGenerator",new j(e=>this.graphStore.getEdge(e)!==void 0));o(this,"onAfterNodeAdded",e=>{this.htmlView.attachNode(e)});o(this,"onAfterNodeUpdated",e=>{this.htmlView.updateNodePosition(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(s=>{this.htmlView.renderEdge(s)})});o(this,"onAfterNodePriorityUpdated",e=>{this.htmlView.updateNodePriority(e)});o(this,"onBeforeNodeRemoved",e=>{this.graphStore.getNodePortIds(e).forEach(t=>{this.unmarkPort(t)}),this.htmlView.detachNode(e)});o(this,"onAfterPortUpdated",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(s=>{this.htmlView.renderEdge(s)})});o(this,"onBeforePortUnmarked",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(t=>{this.removeEdge(t)})});o(this,"onAfterEdgeAdded",e=>{this.htmlView.attachEdge(e)});o(this,"onAfterEdgeShapeUpdated",e=>{this.htmlView.updateEdgeShape(e)});o(this,"onAfterEdgeUpdated",e=>{this.htmlView.renderEdge(e)});o(this,"onAfterEdgePriorityUpdated",e=>{this.htmlView.updateEdgePriority(e)});o(this,"onBeforeEdgeRemoved",e=>{this.htmlView.detachEdge(e)});o(this,"onBeforeClear",()=>{this.nodeIdGenerator.reset(),this.portIdGenerator.reset(),this.edgeIdGenerator.reset(),this.htmlView.clear()});o(this,"onBeforeDestroyEmitter");o(this,"destroyed",!1);o(this,"onBeforeDestroy");this.graph=e,this.viewport=t,this.graphStore=s,this.viewportStore=i,this.htmlView=n,this.params=a,this.graphStore.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.subscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.subscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.subscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.subscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.subscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.subscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.subscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.subscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.subscribe(this.onBeforeClear),[this.onBeforeDestroyEmitter,this.onBeforeDestroy]=b()}addNode(e){const t=this.nodeIdGenerator.create(e.id);if(this.graphStore.getNode(t)!==void 0)throw new T("failed to add node with existing id");if(this.graphStore.getElementNodeId(e.element)!==void 0)throw new T("failed to add node with html element already in use by another node");if(this.graphStore.addNode({id:t,element:e.element,x:e.x??null,y:e.y??null,centerFn:e.centerFn??this.params.nodes.centerFn,priority:e.priority??this.params.nodes.priorityFn()}),e.ports!==void 0)for(const s of e.ports)this.markPort({id:s.id,element:s.element,nodeId:t,direction:s.direction});return this}updateNode(e,t){if(this.graphStore.getNode(e)===void 0)throw new T("failed to update nonexistent node");return this.graphStore.updateNode(e,t??{}),this}removeNode(e){if(this.graphStore.getNode(e)===void 0)throw new T("failed to remove nonexistent node");return this.graphStore.removeNode(e),this}markPort(e){const t=this.portIdGenerator.create(e.id);if(this.graphStore.getPort(t)!==void 0)throw new T("failed to add port with existing id");if(this.graphStore.getNode(e.nodeId)===void 0)throw new T("failed to mark port for nonexistent node");return this.graphStore.addPort({id:t,element:e.element,nodeId:e.nodeId,direction:e.direction??this.params.ports.direction}),this}updatePort(e,t){if(this.graphStore.getPort(e)===void 0)throw new T("failed to update nonexistent port");return this.graphStore.updatePort(e,t??{}),this}unmarkPort(e){if(this.graphStore.getPort(e)===void 0)throw new T("failed to unmark nonexistent port");return this.graphStore.removePort(e),this}addEdge(e){const t=this.edgeIdGenerator.create(e.id);if(this.graphStore.getEdge(t)!==void 0)throw new T("failed to add edge with existing id");if(this.graphStore.getPort(e.from)===void 0)throw new T("failed to add edge from nonexistent port");if(this.graphStore.getPort(e.to)===void 0)throw new T("failed to add edge to nonexistent port");return this.graphStore.addEdge({id:t,from:e.from,to:e.to,shape:e.shape??this.params.edges.shapeFactory(t),priority:e.priority??this.params.edges.priorityFn()}),this}updateEdge(e,t){if(this.graphStore.getEdge(e)===void 0)throw new T("failed to update nonexistent edge");return this.graphStore.updateEdge(e,t??{}),this}removeEdge(e){if(this.graphStore.getEdge(e)===void 0)throw new T("failed to remove nonexistent edge");return this.graphStore.removeEdge(e),this}clear(){return this.graphStore.clear(),this}patchViewportMatrix(e){return this.viewportStore.patchViewportMatrix(e),this}patchContentMatrix(e){return this.viewportStore.patchContentMatrix(e),this}destroy(){this.destroyed||(this.clear(),this.onBeforeDestroyEmitter.emit(),this.graphStore.onAfterNodeAdded.unsubscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.unsubscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.unsubscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.unsubscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.unsubscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.unsubscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.unsubscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.unsubscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.unsubscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.unsubscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.unsubscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.unsubscribe(this.onBeforeClear),this.htmlView.destroy(),this.destroyed=!0)}}class Je{constructor(){o(this,"singleToMultiMap",new Map);o(this,"multiToSingleMap",new Map)}addRecord(e,t){const s=this.singleToMultiMap.get(e);s===void 0?this.singleToMultiMap.set(e,new Set([t])):s.add(t),this.multiToSingleMap.set(t,e)}getMultiBySingle(e){const t=this.singleToMultiMap.get(e)??new Set;return Array.from(t.values())}removeByMulti(e){const t=this.multiToSingleMap.get(e),s=this.singleToMultiMap.get(t);s.delete(e),s.size===0&&this.singleToMultiMap.delete(t),this.multiToSingleMap.delete(e)}getByMulti(e){return this.multiToSingleMap.get(e)}removeBySingle(e){this.singleToMultiMap.get(e).forEach(s=>{this.multiToSingleMap.delete(s)}),this.singleToMultiMap.delete(e)}clear(){this.singleToMultiMap.clear(),this.multiToSingleMap.clear()}forEachSingle(e){this.singleToMultiMap.forEach((t,s)=>{e(s)})}hasSingle(e){return this.singleToMultiMap.get(e)!==void 0}hasMulti(e){return this.multiToSingleMap.get(e)!==void 0}}class le{constructor(){o(this,"nodes",new Map);o(this,"ports",new Map);o(this,"edges",new Map);o(this,"nodesElementsMap",new Map);o(this,"portIncomingEdges",new Map);o(this,"portOutcomingEdges",new Map);o(this,"portCycleEdges",new Map);o(this,"elementPorts",new Je);o(this,"afterNodeAddedEmitter");o(this,"onAfterNodeAdded");o(this,"afterNodeUpdatedEmitter");o(this,"onAfterNodeUpdated");o(this,"afterNodePriorityUpdatedEmitter");o(this,"onAfterNodePriorityUpdated");o(this,"beforeNodeRemovedEmitter");o(this,"onBeforeNodeRemoved");o(this,"afterPortAddedEmitter");o(this,"onAfterPortAdded");o(this,"afterPortUpdatedEmitter");o(this,"onAfterPortUpdated");o(this,"beforePortRemovedEmitter");o(this,"onBeforePortRemoved");o(this,"afterEdgeAddedEmitter");o(this,"onAfterEdgeAdded");o(this,"afterEdgeShapeUpdatedEmitter");o(this,"onAfterEdgeShapeUpdated");o(this,"afterEdgeUpdatedEmitter");o(this,"onAfterEdgeUpdated");o(this,"afterEdgePriorityUpdatedEmitter");o(this,"onAfterEdgePriorityUpdated");o(this,"beforeEdgeRemovedEmitter");o(this,"onBeforeEdgeRemoved");o(this,"beforeClearEmitter");o(this,"onBeforeClear");[this.afterNodeAddedEmitter,this.onAfterNodeAdded]=b(),[this.afterNodeUpdatedEmitter,this.onAfterNodeUpdated]=b(),[this.afterNodePriorityUpdatedEmitter,this.onAfterNodePriorityUpdated]=b(),[this.beforeNodeRemovedEmitter,this.onBeforeNodeRemoved]=b(),[this.afterPortAddedEmitter,this.onAfterPortAdded]=b(),[this.afterPortUpdatedEmitter,this.onAfterPortUpdated]=b(),[this.beforePortRemovedEmitter,this.onBeforePortRemoved]=b(),[this.afterEdgeAddedEmitter,this.onAfterEdgeAdded]=b(),[this.afterEdgeShapeUpdatedEmitter,this.onAfterEdgeShapeUpdated]=b(),[this.afterEdgeUpdatedEmitter,this.onAfterEdgeUpdated]=b(),[this.afterEdgePriorityUpdatedEmitter,this.onAfterEdgePriorityUpdated]=b(),[this.beforeEdgeRemovedEmitter,this.onBeforeEdgeRemoved]=b(),[this.beforeClearEmitter,this.onBeforeClear]=b()}addNode(e){const t=new Map,s={element:e.element,payload:{x:e.x,y:e.y,centerFn:e.centerFn,priority:e.priority},ports:t};this.nodes.set(e.id,s),this.nodesElementsMap.set(e.element,e.id),this.afterNodeAddedEmitter.emit(e.id)}getAllNodeIds(){return Array.from(this.nodes.keys())}getNode(e){return this.nodes.get(e)}getElementNodeId(e){return this.nodesElementsMap.get(e)}updateNode(e,t){const s=this.nodes.get(e).payload;s.x=t.x??s.x,s.y=t.y??s.y,s.centerFn=t.centerFn??s.centerFn,t.priority!==void 0&&(s.priority=t.priority,this.afterNodePriorityUpdatedEmitter.emit(e)),this.afterNodeUpdatedEmitter.emit(e)}removeNode(e){this.beforeNodeRemovedEmitter.emit(e);const t=this.nodes.get(e);this.nodesElementsMap.delete(t.element),this.nodes.delete(e)}addPort(e){this.ports.set(e.id,{element:e.element,payload:{direction:e.direction},nodeId:e.nodeId}),this.elementPorts.addRecord(e.element,e.id),this.portCycleEdges.set(e.id,new Set),this.portIncomingEdges.set(e.id,new Set),this.portOutcomingEdges.set(e.id,new Set),this.nodes.get(e.nodeId).ports.set(e.id,e.element),this.afterPortAddedEmitter.emit(e.id)}getPort(e){return this.ports.get(e)}updatePort(e,t){const s=this.ports.get(e).payload;s.direction=t.direction??s.direction,this.afterPortUpdatedEmitter.emit(e)}getAllPortIds(){return Array.from(this.ports.keys())}getElementPortIds(e){return this.elementPorts.getMultiBySingle(e)}getNodePortIds(e){const t=this.nodes.get(e);if(t!==void 0)return Array.from(t.ports.keys())}removePort(e){const t=this.ports.get(e).nodeId;this.beforePortRemovedEmitter.emit(e),this.nodes.get(t).ports.delete(e),this.ports.delete(e),this.elementPorts.removeByMulti(e)}addEdge(e){this.addEdgeInternal(e),this.afterEdgeAddedEmitter.emit(e.id)}updateEdge(e,t){if(t.from!==void 0||t.to!==void 0){const i=this.edges.get(e),n=i.payload;this.removeEdgeInternal(e),this.addEdgeInternal({id:e,from:t.from??i.from,to:t.to??i.to,shape:n.shape,priority:n.priority})}const s=this.edges.get(e);t.shape!==void 0&&(s.payload.shape=t.shape,this.afterEdgeShapeUpdatedEmitter.emit(e)),t.priority!==void 0&&(s.payload.priority=t.priority,this.afterEdgePriorityUpdatedEmitter.emit(e)),this.afterEdgeUpdatedEmitter.emit(e)}getAllEdgeIds(){return Array.from(this.edges.keys())}getEdge(e){return this.edges.get(e)}removeEdge(e){this.beforeEdgeRemovedEmitter.emit(e),this.removeEdgeInternal(e)}clear(){this.beforeClearEmitter.emit(),this.portIncomingEdges.clear(),this.portOutcomingEdges.clear(),this.portCycleEdges.clear(),this.elementPorts.clear(),this.nodesElementsMap.clear(),this.edges.clear(),this.ports.clear(),this.nodes.clear()}getPortIncomingEdgeIds(e){return Array.from(this.portIncomingEdges.get(e))}getPortOutgoingEdgeIds(e){return Array.from(this.portOutcomingEdges.get(e))}getPortCycleEdgeIds(e){return Array.from(this.portCycleEdges.get(e))}getPortAdjacentEdgeIds(e){return[...this.getPortIncomingEdgeIds(e),...this.getPortOutgoingEdgeIds(e),...this.getPortCycleEdgeIds(e)]}getNodeIncomingEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortIncomingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.from).nodeId!==e}).forEach(n=>{s.push(n)})}),s}getNodeOutgoingEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortOutgoingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId!==e}).forEach(n=>{s.push(n)})}),s}getNodeCycleEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortCycleEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortIncomingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId===e}).forEach(n=>{s.push(n)})}),s}getNodeAdjacentEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortIncomingEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortOutgoingEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortCycleEdgeIds(i).forEach(n=>{s.push(n)})}),s}addEdgeInternal(e){this.edges.set(e.id,{from:e.from,to:e.to,payload:{shape:e.shape,priority:e.priority}}),e.from!==e.to?(this.portOutcomingEdges.get(e.from).add(e.id),this.portIncomingEdges.get(e.to).add(e.id)):this.portCycleEdges.get(e.from).add(e.id)}removeEdgeInternal(e){const t=this.edges.get(e),s=t.from,i=t.to;this.portCycleEdges.get(s).delete(e),this.portCycleEdges.get(i).delete(e),this.portIncomingEdges.get(s).delete(e),this.portIncomingEdges.get(i).delete(e),this.portOutcomingEdges.get(s).delete(e),this.portOutcomingEdges.get(i).delete(e),this.edges.delete(e)}}const ge=r=>({scale:1/r.scale,x:-r.x/r.scale,y:-r.y/r.scale}),ue={scale:1,x:0,y:0};class Qe{constructor(){o(this,"viewportMatrix",ue);o(this,"contentMatrix",ue);o(this,"afterUpdateEmitter");o(this,"onAfterUpdated");[this.afterUpdateEmitter,this.onAfterUpdated]=b()}getViewportMatrix(){return this.viewportMatrix}getContentMatrix(){return this.contentMatrix}patchViewportMatrix(e){this.viewportMatrix={scale:e.scale??this.viewportMatrix.scale,x:e.x??this.viewportMatrix.x,y:e.y??this.viewportMatrix.y},this.contentMatrix=ge(this.viewportMatrix),this.afterUpdateEmitter.emit()}patchContentMatrix(e){this.contentMatrix={scale:e.scale??this.contentMatrix.scale,x:e.x??this.contentMatrix.x,y:e.y??this.contentMatrix.y},this.viewportMatrix=ge(this.contentMatrix),this.afterUpdateEmitter.emit()}}class G{constructor(e){o(this,"elementToNodeId",new Map);o(this,"nodesResizeObserver");o(this,"onAfterNodeAdded",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.set(t.element,e),this.nodesResizeObserver.observe(t.element)});o(this,"onBeforeNodeRemoved",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.delete(t.element),this.nodesResizeObserver.unobserve(t.element)});o(this,"onBeforeClear",()=>{this.nodesResizeObserver.disconnect(),this.elementToNodeId.clear()});this.canvas=e,this.nodesResizeObserver=new ResizeObserver(t=>{t.forEach(s=>{const i=s.target;this.handleNodeResize(i)})}),this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear)}static configure(e){new G(e)}handleNodeResize(e){const t=this.elementToNodeId.get(e);this.canvas.updateNode(t)}}const qe=(r,e,t)=>{const{x:s,y:i,width:n,height:a}=r.getBoundingClientRect();return e>=s&&e<=s+n&&t>=i&&t<=i+a},_e=(r,e,t)=>e>=0&&e<=r.innerWidth&&t>=0&&t<=r.innerHeight,V=(r,e,t,s)=>qe(e,t,s)&&_e(r,t,s),F=(r,e)=>{e!==null?r.style.cursor=e:r.style.removeProperty("cursor")},O=r=>{const e=document.createElement("div");return{id:r.overlayId,element:e,x:r.portCoords.x,y:r.portCoords.y,ports:[{id:r.overlayId,element:e,direction:r.portDirection}]}},et=(r,e)=>{let t=e,s=null;for(;t!==null&&(s=r.getElementPortIds(t)[0]??null,s===null);)t=t.parentElement;return s},pe=(r,e)=>{const t=document.elementsFromPoint(e.x,e.y);for(const s of t){const i=et(r,s);if(i!==null)return i}return null};var N=(r=>(r.Static="static",r.Dragging="dragging",r.Edge="edge",r))(N||{});const we=(r,e)=>({x:r/2,y:e/2}),u={x:0,y:0},y=(r,e,t)=>({x:e.x*r.x-e.y*r.y+((1-e.x)*t.x+e.y*t.y),y:e.y*r.x+e.x*r.y+((1-e.x)*t.y-e.y*t.x)}),fe=(r,e)=>{const t={x:r.x+r.width/2,y:r.y+r.height/2},s={x:e.x+e.width/2,y:e.y+e.height/2},i=Math.min(t.x,s.x),n=Math.min(t.y,s.y),a=Math.abs(s.x-t.x),h=Math.abs(s.y-t.y),d=t.x<=s.x?1:-1,c=t.y<=s.y?1:-1;return{x:i,y:n,width:a,height:h,flipX:d,flipY:c}},W=(r,e,t,s)=>({x:e*r.x+(1-e)/2*s.x,y:t*r.y+(1-t)/2*s.y});class tt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u),i=y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to),n={x:s.x+this.params.sourceDirection.x*this.params.curvature,y:s.y+this.params.sourceDirection.y*this.params.curvature},a={x:i.x-this.params.targetDirection.x*this.params.curvature,y:i.y-this.params.targetDirection.y*this.params.curvature},h=`M ${s.x} ${s.y} C ${n.x} ${n.y}, ${a.x} ${a.y}, ${i.x} ${i.y}`,d=this.params.hasSourceArrow?"":`M ${u.x} ${u.y} L ${s.x} ${s.y} `,c=this.params.hasTargetArrow?"":` M ${i.x} ${i.y} L ${this.params.to.x} ${this.params.to.y}`;this.path=`${d}${h}${c}`}}class rt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength,n=Math.cos(this.params.detourDirection)*this.params.detourDistance,a=Math.sin(this.params.detourDirection)*this.params.detourDistance,h=n*this.params.flipX,d=a*this.params.flipY,c=y({x:i,y:u.y},this.params.sourceDirection,u),g={x:c.x+h,y:c.y+d},l=y({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),p={x:l.x+h,y:l.y+d},w={x:(g.x+p.x)/2,y:(g.y+p.y)/2},m={x:c.x+this.params.curvature*this.params.sourceDirection.x,y:c.y+this.params.curvature*this.params.sourceDirection.y},v={x:l.x-this.params.curvature*this.params.targetDirection.x,y:l.y-this.params.curvature*this.params.targetDirection.y},x={x:c.x+h,y:c.y+d},P={x:l.x+h,y:l.y+d};this.path=[`M ${t.x} ${t.y}`,`L ${c.x} ${c.y}`,`C ${m.x} ${m.y} ${x.x} ${x.y} ${w.x} ${w.y}`,`C ${P.x} ${P.y} ${v.x} ${v.y} ${l.x} ${l.y}`,`L ${s.x} ${s.y}`].join(" "),this.midpoint=W(w,e.flipX,e.flipY,e.to)}}const K=Object.freeze({edgeColor:"--edge-color"}),me=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","svg");return e.style.pointerEvents="none",e.style.position="absolute",e.style.top="0",e.style.left="0",e.style.overflow="visible",e.style.setProperty(K.edgeColor,r),e},ye=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke",`var(${K.edgeColor})`),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e},k=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","path");return r.setAttribute("fill",`var(${K.edgeColor})`),r},ve=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.transformOrigin="50% 50%",r},Ee=(r,e)=>{r.style.transform=`translate(${e.x}px, ${e.y}px)`,r.style.width=`${Math.max(e.width,1)}px`,r.style.height=`${Math.max(e.height,1)}px`},L=(r,e)=>{const t=[];if(r.length>0&&t.push(`M ${r[0].x} ${r[0].y}`),r.length===2&&t.push(`L ${r[1].x} ${r[1].y}`),r.length>2){const s=r.length-1;let i=0,n=0,a=0;r.forEach((h,d)=>{let c=0,g=0,l=0;const p=d>0,w=d<s,m=p&&w;if(p&&(c=-i,g=-n,l=a),w){const U=r[d+1];i=U.x-h.x,n=U.y-h.y,a=Math.sqrt(i*i+n*n)}const x=a!==0?Math.min((m?e:0)/a,d<s-1?.5:1):0,P=m?{x:h.x+i*x,y:h.y+n*x}:h,M=l!==0?Math.min((m?e:0)/l,d>1?.5:1):0,C=m?{x:h.x+c*M,y:h.y+g*M}:h;d>0&&t.push(`L ${C.x} ${C.y}`),m&&t.push(`C ${h.x} ${h.y} ${h.x} ${h.y} ${P.x} ${P.y}`)})}return t.join(" ")};class st{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,i=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=y({x:a,y:u.y},this.params.sourceDirection,u),d=y({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.x+d.x)/2,n),g=this.params.to.y/2,l={x:this.params.flipX>0?c:-n,y:h.y},p={x:l.x,y:g},w={x:this.params.flipX>0?this.params.to.x-c:this.params.to.x+n,y:d.y},m={x:w.x,y:g};this.path=L([s,h,l,p,m,w,d,i],this.params.roundness)}}class ot{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=y({x:i,y:u.y},this.params.sourceDirection,u),a=Math.cos(this.params.detourDirection)*this.params.detourDistance,h=Math.sin(this.params.detourDirection)*this.params.detourDistance,d=a*this.params.flipX,c=h*this.params.flipY,g={x:n.x+d,y:n.y+c},l=y({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),p={x:l.x+d,y:l.y+c},w={x:(g.x+p.x)/2,y:(g.y+p.y)/2};this.midpoint=W(w,e.flipX,e.flipY,e.to),this.path=L([t,n,g,p,l,s],this.params.roundness)}}class it{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,i=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=y({x:n,y:u.y},this.params.sourceDirection,u),h=y({x:this.params.to.x-n,y:this.params.to.y},this.params.targetDirection,this.params.to);this.path=L([s,a,h,i],this.params.roundness)}}class nt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,i=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=y({x:a,y:u.y},this.params.sourceDirection,u),d=y({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.y+d.y)/2,n),g=this.params.to.x/2,l={x:h.x,y:this.params.flipY>0?c:-n},p={x:g,y:l.y},w={x:d.x,y:this.params.flipY>0?this.params.to.y-c:this.params.to.y+n},m={x:g,y:w.y};this.path=L([s,h,l,p,m,w,d,i],this.params.roundness)}}class Z{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.arrowOffset,s=this.params.side,i=this.params.arrowLength+t,n=i+2*s,h=[{x:this.params.arrowLength,y:u.y},{x:i,y:u.y},{x:i,y:this.params.side},{x:n,y:this.params.side},{x:n,y:-this.params.side},{x:i,y:-this.params.side},{x:i,y:u.y},{x:this.params.arrowLength,y:u.y}].map(c=>y(c,this.params.sourceDirection,u)),d=`M ${u.x} ${u.y} L ${h[0].x} ${h[0].y} `;this.path=`${this.params.hasSourceArrow||this.params.hasTargetArrow?"":d}${L(h,this.params.roundness)}`,this.midpoint={x:(h[3].x+h[4].x)/2,y:(h[3].y+h[4].y)/2}}}class at{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.smallRadius,s=this.params.radius,i=t+s,n=t*s/i,a=Math.sqrt(i*i-t*t),h=a*t/i,d=a+s+this.params.arrowLength,c=this.params.arrowLength+h,l=[{x:this.params.arrowLength,y:u.y},{x:c,y:n},{x:c,y:-n},{x:d,y:0}].map(m=>y(m,this.params.sourceDirection,u)),p=[`M ${l[0].x} ${l[0].y}`,`A ${t} ${t} 0 0 1 ${l[1].x} ${l[1].y}`,`A ${s} ${s} 0 1 0 ${l[2].x} ${l[2].y}`,`A ${t} ${t} 0 0 1 ${l[0].x} ${l[0].y}`].join(" "),w=`M 0 0 L ${l[0].x} ${l[0].y} `;this.path=`${this.params.hasSourceArrow||this.params.hasTargetArrow?"":w}${p}`,this.midpoint=l[3]}}class ht{constructor(e){o(this,"path");o(this,"midpoint");o(this,"diagonalDistance");this.params=e;const t=this.params.to;if(this.midpoint={x:t.x/2,y:t.y/2},this.diagonalDistance=Math.sqrt(this.params.to.x*this.params.to.x+this.params.to.y*this.params.to.y),Math.sqrt(this.params.to.x*this.params.to.x+this.params.to.y*this.params.to.y)===0){this.path="";return}const i=this.createDirectLinePoint({offset:this.params.sourceOffset,hasArrow:this.params.hasSourceArrow,flip:1,shift:u}),n=this.createDirectLinePoint({offset:this.params.targetOffset,hasArrow:this.params.hasTargetArrow,flip:-1,shift:this.params.to});this.path=`M ${i.x} ${i.y} L ${n.x} ${n.y}`}createDirectLinePoint(e){const t=e.hasArrow?this.params.arrowLength:0,s=e.offset+t,i=e.flip*s/this.diagonalDistance;return{x:this.params.to.x*i+e.shift.x,y:this.params.to.y*i+e.shift.y}}}class dt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=y({x:i,y:u.y},this.params.sourceDirection,u),a=y({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.y/2,c=d+Math.abs(this.params.detourDistance),g=d+c*this.params.flipY*h,l={x:(n.x+a.x)/2,y:g};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=L([t,n,{x:n.x,y:g},{x:a.x,y:g},a,s],this.params.roundness)}}class ct{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?y({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?y({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=y({x:i,y:u.y},this.params.sourceDirection,u),a=y({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.x/2,c=d+Math.abs(this.params.detourDistance),g=d+c*this.params.flipX*h,l={x:g,y:(n.y+a.y)/2};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=L([t,n,{x:g,y:n.y},{x:g,y:a.y},a,s],this.params.roundness)}}const f=Object.freeze({color:"#777777",width:1,arrowLength:20,polygonArrowRadius:4,circleArrowRadius:8,wedgeArrowSmallRadius:20,wedgeArrowRadius:100,wedgeArrowAngle:Math.PI/12,arrowOffset:15,hasSourceArrow:!1,hasTargetArrow:!1,cycleRadius:30,cycleSquareSide:30,roundness:10,detourDistance:100,detourDirection:-Math.PI/2,detourDirectionVertical:0,smallCycleRadius:15,curvature:90,interactiveWidth:10,preOffset:0}),Ae=(r,e,t)=>({x:e*Math.cos(r),y:t*Math.sin(r)});class z{constructor(e){o(this,"svg");o(this,"group",ve());o(this,"line");o(this,"sourceArrow",null);o(this,"targetArrow",null);o(this,"onAfterRender");o(this,"afterRenderEmitter");o(this,"arrowRenderer");this.params=e,[this.afterRenderEmitter,this.onAfterRender]=b(),this.arrowRenderer=this.params.arrowRenderer,this.svg=me(e.color),this.svg.appendChild(this.group),this.line=ye(e.width),this.group.appendChild(this.line),e.hasSourceArrow&&(this.sourceArrow=k(),this.group.appendChild(this.sourceArrow)),e.hasTargetArrow&&(this.targetArrow=k(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:s,width:i,height:n,flipX:a,flipY:h}=fe(e.from,e.to);Ee(this.svg,{x:t,y:s,width:i,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d=Ae(e.from.direction,a,h),c=Ae(e.to.direction,a,h),g={x:i,y:n};let l={x:-c.x,y:-c.y},p;e.category===D.PortCycle?(p=this.params.createCyclePath,l=d):e.category===D.NodeCycle?p=this.params.createDetourPath:p=this.params.createLinePath;const w=p(d,c,g,a,h);this.line.setAttribute("d",w.path);let m=null;this.sourceArrow&&(m=this.arrowRenderer({direction:d,shift:u,arrowLength:this.params.arrowLength}),this.sourceArrow.setAttribute("d",m));let v=null;this.targetArrow&&(v=this.arrowRenderer({direction:l,shift:g,arrowLength:this.params.arrowLength}),this.targetArrow.setAttribute("d",v)),this.afterRenderEmitter.emit({edgePath:w,sourceArrowPath:m,targetArrowPath:v})}}const lt=r=>e=>{const s=[u,{x:e.arrowLength,y:r.radius},{x:e.arrowLength,y:-r.radius}].map(h=>y(h,e.direction,u)).map(h=>({x:h.x+e.shift.x,y:h.y+e.shift.y})),i=`M ${s[0].x} ${s[0].y}`,n=`L ${s[1].x} ${s[1].y}`,a=`L ${s[2].x} ${s[2].y}`;return`${i} ${n} ${a} Z`},gt=r=>e=>{const t=r.radius,s=e.arrowLength,i=(s*s+2*s*t)/(2*t),n=i+t,a=s+t-t*(s+t)/n,h=t*i/n,c=[u,{x:a,y:-h},{x:a,y:h}].map(m=>y(m,e.direction,u)).map(m=>({x:m.x+e.shift.x,y:m.y+e.shift.y})),g=`M ${c[0].x} ${c[0].y}`,l=`A ${i} ${i} 0 0 0 ${c[1].x} ${c[1].y}`,p=`A ${t} ${t} 0 0 0 ${c[2].x} ${c[2].y}`,w=`A ${i} ${i} 0 0 0 ${c[0].x} ${c[0].y}`;return`${g} ${l} ${p} ${w}`},ut=r=>e=>{const t=r.smallRadius,s=r.radius,i=y({x:e.arrowLength,y:0},{x:Math.cos(r.angle),y:Math.sin(r.angle)},{x:e.arrowLength+r.smallRadius,y:0}),a=[u,{x:i.x,y:-i.y},i].map(l=>y(l,e.direction,u)).map(l=>({x:l.x+e.shift.x,y:l.y+e.shift.y})),h=`M ${a[0].x} ${a[0].y}`,d=`A ${s} ${s} 0 0 1 ${a[1].x} ${a[1].y}`,c=`A ${t} ${t} 0 0 1 ${a[2].x} ${a[2].y}`,g=`A ${s} ${s} 0 0 1 ${a[0].x} ${a[0].y}`;return`${h} ${d} ${c} ${g}`},I=r=>{if(typeof r=="function")return r;switch(r.type){case"triangle":return lt({radius:r.radius??f.polygonArrowRadius});case"arc":return gt({radius:r.radius??f.circleArrowRadius});default:return ut({smallRadius:r.smallRadius??f.wedgeArrowSmallRadius,angle:r.angle??f.wedgeArrowAngle,radius:r.radius??f.wedgeArrowRadius})}};class xe{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"curvature");o(this,"portCycleRadius");o(this,"portCycleSmallRadius");o(this,"detourDirection");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new at({sourceDirection:e,radius:this.portCycleRadius,smallRadius:this.portCycleSmallRadius,arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new rt({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,detourDirection:this.detourDirection,detourDistance:this.detourDistance,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s)=>new tt({to:s,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.curvature=(e==null?void 0:e.curvature)??f.curvature,this.portCycleRadius=(e==null?void 0:e.cycleRadius)??f.cycleRadius,this.portCycleSmallRadius=(e==null?void 0:e.smallCycleRadius)??f.smallCycleRadius,this.detourDirection=(e==null?void 0:e.detourDirection)??f.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Se{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new dt({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s,i)=>new st({to:s,sourceDirection:e,targetDirection:t,flipX:i,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Pe{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDirection");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new ot({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDirection:this.detourDirection,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s)=>new it({to:s,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDirection=(e==null?void 0:e.detourDirection)??f.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class be{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new ct({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s,i,n)=>new nt({to:s,sourceDirection:e,targetDirection:t,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class J{constructor(e){o(this,"svg");o(this,"group",ve());o(this,"line");o(this,"sourceArrow",null);o(this,"targetArrow",null);o(this,"color");o(this,"width");o(this,"arrowLength");o(this,"sourceOffset");o(this,"targetOffset");o(this,"onAfterRender");o(this,"afterRenderEmitter");o(this,"arrowRenderer");[this.afterRenderEmitter,this.onAfterRender]=b(),this.color=(e==null?void 0:e.color)??f.color,this.width=(e==null?void 0:e.width)??f.width,this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowRenderer=I((e==null?void 0:e.arrowRenderer)??{}),this.sourceOffset=(e==null?void 0:e.sourceOffset)??f.preOffset,this.targetOffset=(e==null?void 0:e.targetOffset)??f.preOffset,this.svg=me(this.color),this.svg.appendChild(this.group),this.line=ye(this.width),this.group.appendChild(this.line),e!=null&&e.hasSourceArrow&&(this.sourceArrow=k(),this.group.appendChild(this.sourceArrow)),e!=null&&e.hasTargetArrow&&(this.targetArrow=k(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:s,width:i,height:n,flipX:a,flipY:h}=fe(e.from,e.to);Ee(this.svg,{x:t,y:s,width:i,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d={x:i,y:n},c=new ht({to:d,sourceOffset:this.sourceOffset,targetOffset:this.targetOffset,hasSourceArrow:this.sourceArrow!==null,hasTargetArrow:this.targetArrow!==null,arrowLength:this.arrowLength});this.line.setAttribute("d",c.path);let g=null,l=null;const p=c.diagonalDistance;if(p===0)this.sourceArrow!==null&&(g="",this.sourceArrow.setAttribute("d",g)),this.targetArrow!==null&&(l="",this.targetArrow.setAttribute("d",l));else{const w={x:d.x/p,y:d.y/p};if(this.sourceArrow){const m={x:w.x*this.sourceOffset,y:w.y*this.sourceOffset};g=this.arrowRenderer({direction:w,shift:m,arrowLength:this.arrowLength}),this.sourceArrow.setAttribute("d",g)}if(this.targetArrow){const m={x:w.x*this.targetOffset,y:w.y*this.targetOffset};l=this.arrowRenderer({direction:{x:-w.x,y:-w.y},shift:{x:d.x-m.x,y:d.y-m.y},arrowLength:this.arrowLength}),this.targetArrow.setAttribute("d",l)}}this.afterRenderEmitter.emit({edgePath:c,sourceArrowPath:g,targetArrowPath:l})}}const pt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.pointerEvents="auto",r.style.cursor="pointer",r},wt=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke","transparent"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e.setAttribute("stroke-linecap","round"),e},Te=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke-linejoin","round"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","transparent"),e.setAttribute("stroke","transparent"),e};class De extends Error{constructor(e){super(e),this.name="InteractiveEdgeError"}}class Q{constructor(e,t){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"handle",pt());o(this,"onAfterRender");o(this,"interactiveLine");o(this,"interactiveSourceArrow",null);o(this,"interactiveTargetArrow",null);if(this.baseEdge=e,e instanceof Q)throw new De("interactive edge can be configured only once");this.svg=this.baseEdge.svg,this.group=this.baseEdge.group,this.line=this.baseEdge.line,this.sourceArrow=this.baseEdge.sourceArrow,this.targetArrow=this.baseEdge.targetArrow,this.onAfterRender=this.baseEdge.onAfterRender;const s=(t==null?void 0:t.distance)??f.interactiveWidth;this.interactiveLine=wt(s),this.handle.appendChild(this.interactiveLine),this.sourceArrow&&(this.interactiveSourceArrow=Te(s),this.handle.appendChild(this.interactiveSourceArrow)),this.targetArrow&&(this.interactiveTargetArrow=Te(s),this.handle.appendChild(this.interactiveTargetArrow)),this.group.appendChild(this.handle),this.baseEdge.onAfterRender.subscribe(i=>{this.interactiveLine.setAttribute("d",i.edgePath.path),this.interactiveSourceArrow&&this.interactiveSourceArrow.setAttribute("d",i.sourceArrowPath),this.interactiveTargetArrow&&this.interactiveTargetArrow.setAttribute("d",i.targetArrowPath)})}render(e){this.baseEdge.render(e)}}class ft{constructor(e,t){o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"svg");this.baseShape=e,this.midpointElement=t,this.svg=this.baseShape.svg,this.group=this.baseShape.group,this.line=this.baseShape.line,this.sourceArrow=this.baseShape.sourceArrow,this.targetArrow=this.baseShape.targetArrow,this.onAfterRender=this.baseShape.onAfterRender,this.svg.append(this.midpointElement),this.baseShape.onAfterRender.subscribe(s=>{const i=s.edgePath.midpoint,n=`translate(${i.x}px, ${i.y}px)`;this.midpointElement.style.setProperty("transform",n)})}render(e){this.baseShape.render(e)}}class Ne{constructor(e){o(this,"onAfterNodeAdded");o(this,"onAfterNodeUpdated");o(this,"onAfterNodePriorityUpdated");o(this,"onBeforeNodeRemoved");o(this,"onAfterPortMarked");o(this,"onAfterPortUpdated");o(this,"onBeforePortUnmarked");o(this,"onAfterEdgeAdded");o(this,"onAfterEdgeShapeUpdated");o(this,"onAfterEdgeUpdated");o(this,"onAfterEdgePriorityUpdated");o(this,"onBeforeEdgeRemoved");o(this,"onBeforeClear");this.graphStore=e,this.onAfterNodeAdded=this.graphStore.onAfterNodeAdded,this.onAfterNodeUpdated=this.graphStore.onAfterNodeUpdated,this.onAfterNodePriorityUpdated=this.graphStore.onAfterNodePriorityUpdated,this.onBeforeNodeRemoved=this.graphStore.onBeforeNodeRemoved,this.onAfterPortMarked=this.graphStore.onAfterPortAdded,this.onAfterPortUpdated=this.graphStore.onAfterPortUpdated,this.onBeforePortUnmarked=this.graphStore.onBeforePortRemoved,this.onAfterEdgeAdded=this.graphStore.onAfterEdgeAdded,this.onAfterEdgeShapeUpdated=this.graphStore.onAfterEdgeShapeUpdated,this.onAfterEdgeUpdated=this.graphStore.onAfterEdgeUpdated,this.onAfterEdgePriorityUpdated=this.graphStore.onAfterEdgePriorityUpdated,this.onBeforeEdgeRemoved=this.graphStore.onBeforeEdgeRemoved,this.onBeforeClear=this.graphStore.onBeforeClear}getNode(e){const t=this.graphStore.getNode(e);if(t===void 0)return null;const s=t.payload;return{element:t.element,x:s.x,y:s.y,centerFn:s.centerFn,priority:s.priority}}getElementNodeId(e){return this.graphStore.getElementNodeId(e)??null}getAllNodeIds(){return this.graphStore.getAllNodeIds()}getPort(e){const t=this.graphStore.getPort(e);return t===void 0?null:{element:t.element,direction:t.payload.direction,nodeId:t.nodeId}}getAllPortIds(){return this.graphStore.getAllPortIds()}getNodePortIds(e){return this.graphStore.getNodePortIds(e)??null}getElementPortIds(e){return[...this.graphStore.getElementPortIds(e)]}getAllEdgeIds(){return this.graphStore.getAllEdgeIds()}getEdge(e){const t=this.graphStore.getEdge(e);if(t===void 0)return null;const s=t.payload;return{from:t.from,to:t.to,priority:s.priority,shape:s.shape}}getPortIncomingEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortIncomingEdgeIds(e)}getPortOutgoingEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortOutgoingEdgeIds(e)}getPortCycleEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortCycleEdgeIds(e)}getPortAdjacentEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortAdjacentEdgeIds(e)}getNodeIncomingEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeIncomingEdgeIds(e)}getNodeOutgoingEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeOutgoingEdgeIds(e)}getNodeCycleEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeCycleEdgeIds(e)}getNodeAdjacentEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeAdjacentEdgeIds(e)}}class Me{constructor(e){o(this,"onAfterUpdated");this.viewportStore=e,this.onAfterUpdated=this.viewportStore.onAfterUpdated}getViewportMatrix(){return{...this.viewportStore.getViewportMatrix()}}getContentMatrix(){return{...this.viewportStore.getContentMatrix()}}}const Le=(r,e)=>{const t=new le,s=new Ne(t),i=new Me(e),n=new de(t,e,r),a={nodes:{centerFn:we,priorityFn:()=>0},edges:{shapeFactory:()=>new J,priorityFn:()=>0},ports:{direction:0}};return new ce(s,i,t,e,n,a)};class H{constructor(e,t,s,i){o(this,"onAfterPortMarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.getElementPortIds(t.element).length===1&&this.hookPortEvents(t.element)});o(this,"onBeforePortUnmarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.getElementPortIds(t.element).length===1&&this.unhookPortEvents(t.element)});o(this,"onPortMouseDown",e=>{if(!this.params.mouseDownEventVerifier(e))return;const t=e.currentTarget,s=this.canvas.graph.getElementPortIds(t)[0];this.params.onPortPointerDown(s,{x:e.clientX,y:e.clientY})&&(e.stopPropagation(),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}))});o(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.stopMouseDrag();return}this.params.onPointerMove({x:e.clientX,y:e.clientY})});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&(this.params.onPointerUp({x:e.clientX,y:e.clientY}),this.stopMouseDrag())});o(this,"onPortTouchStart",e=>{if(e.touches.length!==1)return;const t=e.touches[0],s=e.currentTarget,i=this.canvas.graph.getElementPortIds(s)[0];this.params.onPortPointerDown(i,{x:t.clientX,y:t.clientY})&&(e.stopPropagation(),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}))});o(this,"onWindowTouchMove",e=>{const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.stopTouchDrag();return}this.params.onPointerMove({x:t.clientX,y:t.clientY})});o(this,"onWindowTouchFinish",e=>{const t=e.changedTouches[0];this.params.onPointerUp({x:t.clientX,y:t.clientY}),this.stopTouchDrag()});o(this,"onBeforeClear",()=>{this.canvas.graph.getAllPortIds().forEach(e=>{const t=this.canvas.graph.getPort(e);this.unhookPortEvents(t.element)})});o(this,"onBeforeDestroy",()=>{this.params.onStopDrag(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked),this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new H(e,t,s,i)}hookPortEvents(e){e.addEventListener("mousedown",this.onPortMouseDown,{passive:!0}),e.addEventListener("touchstart",this.onPortTouchStart,{passive:!0})}unhookPortEvents(e){e.removeEventListener("mousedown",this.onPortMouseDown),e.removeEventListener("touchstart",this.onPortTouchStart)}stopMouseDrag(){this.params.onStopDrag(),this.removeWindowMouseListeners()}stopTouchDrag(){this.params.onStopDrag(),this.removeWindowTouchListeners()}removeWindowMouseListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}removeWindowTouchListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}}class q{constructor(e,t,s,i){o(this,"grabbedNode",null);o(this,"maxNodePriority",0);o(this,"graph");o(this,"onAfterNodeAdded",e=>{this.updateMaxNodePriority(e);const t=this.graph.getNode(e);t.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),t.element.addEventListener("touchstart",this.onTouchStart,{passive:!0})});o(this,"onAfterNodeUpdated",e=>{this.updateMaxNodePriority(e)});o(this,"onBeforeNodeRemoved",e=>{const t=this.graph.getNode(e);t.element.removeEventListener("mousedown",this.onMouseDown),t.element.removeEventListener("touchstart",this.onTouchStart)});o(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});o(this,"onBeforeClear",()=>{this.canvas.graph.getAllNodeIds().forEach(e=>{const t=this.canvas.graph.getNode(e);t.element.removeEventListener("mousedown",this.onMouseDown),t.element.removeEventListener("touchstart",this.onTouchStart)}),this.maxNodePriority=0});o(this,"onMouseDown",e=>{if(!this.params.mouseDownEventVerifier(e))return;const t=e.currentTarget,s=this.graph.getElementNodeId(t),i=this.graph.getNode(s);if(!this.params.nodeDragVerifier(s))return;e.stopPropagation();const a=this.calculateContentPoint({x:e.clientX,y:e.clientY});this.grabbedNode={nodeId:s,dx:a.x-i.x,dy:a.y-i.y},F(this.element,this.params.dragCursor),this.moveNodeOnTop(s),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0})});o(this,"onTouchStart",e=>{if(e.touches.length!==1)return;e.stopPropagation();const t=e.touches[0],s=e.currentTarget,i=this.canvas.graph.getElementNodeId(s),n=this.graph.getNode(i);if(!this.params.nodeDragVerifier({nodeId:i,element:n.element,x:n.x,y:n.y}))return;const h=this.calculateContentPoint({x:t.clientX,y:t.clientY});this.grabbedNode={nodeId:i,dx:h.x-n.x,dy:h.y-n.y},this.moveNodeOnTop(i),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0})});o(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.cancelMouseDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:e.clientX,y:e.clientY})});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.cancelMouseDrag()});o(this,"onWindowTouchMove",e=>{if(e.touches.length!==1)return;const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.cancelTouchDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:t.clientX,y:t.clientY})});o(this,"onWindowTouchFinish",()=>{this.cancelTouchDrag()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.graph=e.graph,this.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graph.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new q(e,t,s,i)}moveNode(e,t){if(this.graph.getNode(e.nodeId)===null)return;const i=this.calculateContentPoint(t),n={x:i.x-e.dx,y:i.y-e.dy},a=this.adjustNodeCoords(n);this.canvas.updateNode(e.nodeId,{x:a.x,y:a.y}),this.params.onNodeDrag(e.nodeId)}moveNodeOnTop(e){if(this.params.moveOnTop){if(this.maxNodePriority++,this.params.moveEdgesOnTop){const t=this.maxNodePriority;this.maxNodePriority++,this.graph.getNodeAdjacentEdgeIds(e).forEach(i=>{this.canvas.updateEdge(i,{priority:t})})}this.canvas.updateNode(e,{priority:this.maxNodePriority})}}cancelMouseDrag(){this.grabbedNode!==null&&this.graph.getNode(this.grabbedNode.nodeId)!==null&&this.params.onNodeDragFinished(this.grabbedNode.nodeId),this.grabbedNode=null,F(this.element,null),this.removeMouseDragListeners()}removeMouseDragListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}cancelTouchDrag(){if(this.grabbedNode!==null){const e=this.graph.getNode(this.grabbedNode.nodeId);e!==null&&this.params.onNodeDragFinished({nodeId:this.grabbedNode.nodeId,element:e.element,x:e.x,y:e.y})}this.grabbedNode=null,this.removeTouchDragListeners()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}updateMaxNodePriority(e){const t=this.graph.getNode(e).priority;this.maxNodePriority=Math.max(this.maxNodePriority,t)}calculateContentPoint(e){const t=this.element.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.getViewportMatrix();return A(i,s)}adjustNodeCoords(e){const t=this.params.gridSize;if(t!==null){const s=t/2;return{x:Math.floor((e.x+s)/t)*t,y:Math.floor((e.y+s)/t)*t}}return e}}const mt=(r,e,t)=>({scale:r.scale,x:r.x+r.scale*e,y:r.y+r.scale*t}),yt=(r,e,t,s)=>({scale:r.scale*e,x:r.scale*(1-e)*t+r.x,y:r.scale*(1-e)*s+r.y}),X=r=>{const e=[],t=r.touches.length;for(let h=0;h<t;h++)e.push([r.touches[h].clientX,r.touches[h].clientY]);const s=e.reduce((h,d)=>[h[0]+d[0],h[1]+d[1]],[0,0]),i=[s[0]/t,s[1]/t],a=e.map(h=>[h[0]-i[0],h[1]-i[1]]).reduce((h,d)=>h+Math.sqrt(d[0]*d[0]+d[1]*d[1]),0);return{x:i[0],y:i[1],scale:a/t,touchesCnt:t,touches:e}};class Y{constructor(e,t,s,i){o(this,"viewport");o(this,"prevTouches",null);o(this,"wheelFinishTimer",null);o(this,"transformInProgress",!1);o(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});o(this,"onMouseDown",e=>{this.element===null||!this.params.mouseDownEventVerifier(e)||(F(this.element,this.params.shiftCursor),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}),this.startRegisteredTransform())});o(this,"onWindowMouseMove",e=>{const t=V(this.window,this.element,e.clientX,e.clientY);if(this.element===null||!t){this.stopMouseDrag();return}const s=-e.movementX,i=-e.movementY;this.moveViewport(s,i)});o(this,"onWindowMouseUp",e=>{this.element===null||!this.params.mouseUpEventVerifier(e)||this.stopMouseDrag()});o(this,"onWheelScroll",e=>{if(!this.params.mouseWheelEventVerifier(e))return;const{left:t,top:s}=this.element.getBoundingClientRect(),i=e.clientX-t,n=e.clientY-s,h=1/(e.deltaY<0?this.params.wheelSensitivity:1/this.params.wheelSensitivity);this.wheelFinishTimer===null&&this.params.onTransformStarted(),this.scaleViewport(h,i,n),this.wheelFinishTimer!==null&&clearTimeout(this.wheelFinishTimer),this.wheelFinishTimer=setTimeout(()=>{this.transformInProgress||this.params.onTransformFinished(),this.wheelFinishTimer=null},this.params.scaleWheelFinishTimeout)});o(this,"onTouchStart",e=>{if(this.prevTouches!==null){this.prevTouches=X(e);return}this.prevTouches=X(e),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}),this.startRegisteredTransform()});o(this,"onWindowTouchMove",e=>{const t=X(e);if(!t.touches.every(i=>V(this.window,this.element,i[0],i[1]))){this.stopTouchDrag();return}if((t.touchesCnt===1||t.touchesCnt===2)&&this.moveViewport(-(t.x-this.prevTouches.x),-(t.y-this.prevTouches.y)),t.touchesCnt===2){const{left:i,top:n}=this.element.getBoundingClientRect(),a=this.prevTouches.x-i,h=this.prevTouches.y-n,c=1/(t.scale/this.prevTouches.scale);this.scaleViewport(c,a,h)}this.prevTouches=t});o(this,"onWindowTouchFinish",e=>{e.touches.length>0?this.prevTouches=X(e):this.stopTouchDrag()});o(this,"observer",new ResizeObserver(()=>{const e=this.viewport.getViewportMatrix(),{width:t,height:s}=this.element.getBoundingClientRect(),i=this.params.transformPreprocessor({prevTransform:e,nextTransform:e,canvasWidth:t,canvasHeight:s});this.params.onResizeTransformStarted(),this.canvas.patchViewportMatrix(i),this.params.onResizeTransformFinished()}));o(this,"preventWheelScaleListener",e=>{e.preventDefault()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.element.addEventListener("wheel",this.preventWheelScaleListener,{passive:!1}),this.viewport=e.viewport,this.observer.observe(this.element),this.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),this.element.addEventListener("wheel",this.onWheelScroll,{passive:!0}),this.element.addEventListener("touchstart",this.onTouchStart,{passive:!0}),e.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new Y(e,t,s,i)}moveViewport(e,t){const s=this.viewport.getViewportMatrix(),i=mt(s,e,t),{width:n,height:a}=this.element.getBoundingClientRect(),h=this.params.transformPreprocessor({prevTransform:s,nextTransform:i,canvasWidth:n,canvasHeight:a});this.performTransform(h)}scaleViewport(e,t,s){const i=this.canvas.viewport.getViewportMatrix(),n=yt(i,e,t,s),{width:a,height:h}=this.element.getBoundingClientRect(),d=this.params.transformPreprocessor({prevTransform:i,nextTransform:n,canvasWidth:a,canvasHeight:h});this.performTransform(d)}stopMouseDrag(){F(this.element,null),this.removeMouseDragListeners(),this.finishRegisteredTransform()}removeMouseDragListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}stopTouchDrag(){this.prevTouches=null,this.removeTouchDragListeners(),this.finishRegisteredTransform()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}performTransform(e){this.params.onBeforeTransformChange(),this.canvas.patchViewportMatrix(e),this.params.onTransformChange()}startRegisteredTransform(){this.transformInProgress=!0,this.params.onTransformStarted()}finishRegisteredTransform(){this.transformInProgress=!1,this.params.onTransformFinished()}}class _{constructor(e,t,s,i,n,a){o(this,"canvasResizeObserver");o(this,"nodeHorizontal");o(this,"nodeVertical");o(this,"viewport");o(this,"viewportWidth",0);o(this,"viewportHeight",0);o(this,"viewportMatrix");o(this,"loadedArea",{xFrom:1/0,xTo:1/0,yFrom:1/0,yTo:1/0});o(this,"updateLoadedArea",e=>{this.loadedArea={xFrom:e.x,xTo:e.x+e.width,yFrom:e.y,yTo:e.y+e.height}});o(this,"onAfterViewportUpdated",()=>{this.userTransformInProgress||(this.viewportMatrix=this.viewport.getViewportMatrix(),this.loadAreaAroundViewport())});o(this,"userTransformInProgress",!1);this.canvas=e,this.element=t,this.window=s,this.trigger=n,this.params=a,this.nodeHorizontal=this.params.nodeVerticalRadius,this.nodeVertical=this.params.nodeHorizontalRadius,this.canvasResizeObserver=new ResizeObserver(d=>{const c=d[0];this.viewportWidth=c.contentRect.width,this.viewportHeight=c.contentRect.height,this.scheduleLoadAreaAroundViewport()}),this.viewport=e.viewport;const h={...i,onResizeTransformStarted:()=>{this.userTransformInProgress=!0,i.onResizeTransformStarted()},onResizeTransformFinished:()=>{this.userTransformInProgress=!1,i.onResizeTransformFinished()},onBeforeTransformChange:()=>{this.userTransformInProgress=!0,i.onBeforeTransformChange()},onTransformChange:()=>{this.userTransformInProgress=!1;const d=this.viewportMatrix;this.viewportMatrix=this.viewport.getViewportMatrix(),d.scale!==this.viewportMatrix.scale&&this.scheduleEnsureViewportAreaLoaded(),i.onTransformChange()},onTransformFinished:()=>{this.scheduleLoadAreaAroundViewport(),i.onTransformFinished()}};Y.configure(e,this.element,this.window,h),this.viewportMatrix=this.viewport.getViewportMatrix(),this.trigger.subscribe(this.updateLoadedArea),this.canvasResizeObserver.observe(this.element),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated)}static configure(e,t,s,i,n,a){new _(e,t,s,i,n,a)}scheduleLoadAreaAroundViewport(){setTimeout(()=>{this.loadAreaAroundViewport()})}scheduleEnsureViewportAreaLoaded(){const e=this.viewportWidth*this.viewportMatrix.scale,t=this.viewportHeight*this.viewportMatrix.scale,s=this.viewportMatrix.x-this.nodeHorizontal,i=this.viewportMatrix.y-this.nodeVertical,n=this.viewportMatrix.x+e+this.nodeHorizontal,a=this.viewportMatrix.y+t+this.nodeVertical;this.loadedArea.xFrom<s&&this.loadedArea.xTo>n&&this.loadedArea.yFrom<i&&this.loadedArea.yTo>a||this.scheduleLoadAreaAroundViewport()}loadAreaAroundViewport(){const e=this.viewportWidth*this.viewportMatrix.scale,t=this.viewportHeight*this.viewportMatrix.scale,s=this.viewportMatrix.x-e-this.nodeHorizontal,i=this.viewportMatrix.y-t-this.nodeVertical,n=3*e+2*this.nodeHorizontal,a=3*t+2*this.nodeVertical;this.trigger.emit({x:s,y:i,width:n,height:a})}}const vt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","svg");return r.style.position="absolute",r.style.inset="0",r},Et=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","rect");return r.setAttribute("fill","url(#pattern)"),r},At=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","pattern");return r.setAttribute("id","pattern"),r};class ee{constructor(e,t,s){o(this,"svg",vt());o(this,"patternRenderingRectangle",Et());o(this,"pattern",At());o(this,"patternContent");o(this,"tileWidth");o(this,"tileHeight");o(this,"halfTileWidth");o(this,"halfTileHeight");o(this,"maxViewportScale");o(this,"visible",!1);o(this,"resizeObserver",new ResizeObserver(e=>{const t=e[0],{width:s,height:i}=t.contentRect;this.svg.setAttribute("width",`${s}`),this.svg.setAttribute("height",`${i}`),this.patternRenderingRectangle.setAttribute("width",`${s}`),this.patternRenderingRectangle.setAttribute("height",`${i}`);const n=this.tileWidth/s,a=this.tileHeight/i;this.pattern.setAttribute("width",`${n}`),this.pattern.setAttribute("height",`${a}`)}));o(this,"onAfterTransformUpdated",()=>{const e=this.canvas.viewport.getContentMatrix(),t=e.x-this.halfTileWidth*e.scale,s=e.y-this.halfTileHeight*e.scale,i=`matrix(${e.scale}, 0, 0, ${e.scale}, ${t}, ${s})`;this.pattern.setAttribute("patternTransform",i),this.updateVisibility()});this.canvas=e,this.backgroundHost=s,this.tileWidth=t.tileWidth,this.tileHeight=t.tileHeight,this.halfTileWidth=this.tileWidth/2,this.halfTileHeight=this.tileHeight/2,this.patternContent=t.renderer,this.maxViewportScale=t.maxViewportScale;const i=`translate(${this.halfTileWidth}, ${this.halfTileHeight})`;this.patternContent.setAttribute("transform",i),this.pattern.appendChild(this.patternContent);const n=document.createElementNS("http://www.w3.org/2000/svg","defs");n.appendChild(this.pattern),this.svg.appendChild(n),this.svg.appendChild(this.patternRenderingRectangle),this.resizeObserver.observe(this.backgroundHost),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterTransformUpdated),this.onAfterTransformUpdated()}static configure(e,t,s){new ee(e,t,s)}updateVisibility(){const t=this.canvas.viewport.getViewportMatrix().scale>this.maxViewportScale;t&&this.visible?(this.visible=!1,this.backgroundHost.removeChild(this.svg)):!t&&!this.visible&&(this.visible=!0,this.backgroundHost.appendChild(this.svg))}}class te{constructor(e,t,s,i,n){o(this,"overlayCanvas");o(this,"staticPortId",null);o(this,"isTargetDragging",!0);o(this,"onEdgeCreated",e=>{this.params.onAfterEdgeCreated(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=s,this.window=i,this.params=n,this.overlayCanvas=Le(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>{const d=this.params.connectionTypeResolver(a);return d===null?!1:(this.grabPort(a,h,d),!0)},onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,s,i,n){new te(e,t,s,i,n)}grabPort(e,t,s){const i=this.canvas.graph.getPort(e);this.staticPortId=e;const n=i.element.getBoundingClientRect(),a=n.x+n.width/2,h=n.y+n.height/2,d=this.overlayLayer.getBoundingClientRect(),c=this.canvas.viewport.getViewportMatrix(),g=A(c,{x:a-d.x,y:h-d.y}),l=A(c,{x:t.x-d.x,y:t.y-d.y}),p={overlayId:N.Static,portCoords:g,portDirection:i.direction},w={overlayId:N.Dragging,portCoords:l,portDirection:this.params.dragPortDirection};this.isTargetDragging=s==="direct";const[m,v]=this.isTargetDragging?[p,w]:[w,p];this.overlayCanvas.addNode(O(m)),this.overlayCanvas.addNode(O(v)),this.overlayCanvas.addEdge({from:m.overlayId,to:v.overlayId,shape:this.params.edgeShapeFactory(N.Edge)})}resetDragState(){this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}tryCreateConnection(e){const t=pe(this.canvas.graph,e),s=this.staticPortId;if(t===null){this.params.onEdgeCreationInterrupted({staticPortId:s,isDirect:this.isTargetDragging});return}const i=this.isTargetDragging?s:t,n=this.isTargetDragging?t:s,a={from:i,to:n},h=this.params.connectionPreprocessor(a);h!==null?(this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeCreated),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeCreated)):this.params.onEdgeCreationPrevented(a)}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.getViewportMatrix(),n=A(i,s);this.overlayCanvas.updateNode(N.Dragging,{x:n.x,y:n.y})}}class re{constructor(e,t,s,i,n){o(this,"overlayCanvas");o(this,"staticPortId",null);o(this,"isTargetDragging",!0);o(this,"draggingEdgePayload",null);o(this,"onEdgeReattached",e=>{this.params.onAfterEdgeReattached(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=s,this.window=i,this.params=n,this.overlayCanvas=Le(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>this.tryStartEdgeDragging(a,h),onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,s,i,n){new re(e,t,s,i,n)}tryStartEdgeDragging(e,t){const s=this.params.draggingEdgeResolver(e);if(s===null)return!1;const i=this.canvas.graph.getEdge(s);if(i===null)return!1;const n=e===i.from,a=e===i.to,h=n?i.to:i.from;this.staticPortId=h,this.isTargetDragging=a;const d=this.canvas.graph.getPort(e),c=this.canvas.graph.getPort(h),g=c.element.getBoundingClientRect(),l={x:g.x+g.width/2,y:g.y+g.height/2},p=this.canvas.viewport.getViewportMatrix(),w=this.overlayLayer.getBoundingClientRect(),m=A(p,{x:l.x-w.x,y:l.y-w.y}),v=A(p,{x:t.x-w.x,y:t.y-w.y});this.draggingEdgePayload={id:s,from:i.from,to:i.to,shape:i.shape,priority:i.priority},this.canvas.removeEdge(s);const x={overlayId:N.Static,portCoords:m,portDirection:c.direction},P={overlayId:N.Dragging,portCoords:v,portDirection:d.direction},[$,M]=this.isTargetDragging?[x,P]:[P,x];this.overlayCanvas.addNode(O($)),this.overlayCanvas.addNode(O(M));const C=this.params.draggingEdgeShapeFactory!==null?this.params.draggingEdgeShapeFactory(N.Edge):i.shape;return this.overlayCanvas.addEdge({id:N.Edge,from:$.overlayId,to:M.overlayId,shape:C}),!0}resetDragState(){this.draggingEdgePayload=null,this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.getViewportMatrix(),n=A(i,s);this.overlayCanvas.updateNode(N.Dragging,{x:n.x,y:n.y})}tryCreateConnection(e){const t=pe(this.canvas.graph,e);if(this.overlayCanvas.removeEdge(N.Edge),t===null){const d=this.draggingEdgePayload;this.params.onEdgeReattachInterrupted({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority});return}const[s,i]=this.isTargetDragging?[this.staticPortId,t]:[t,this.staticPortId],n=this.draggingEdgePayload,a={id:n.id,from:s,to:i,shape:n.shape,priority:n.priority},h=this.params.connectionPreprocessor(a);if(h!==null)this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeReattached),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeReattached);else{const d=this.draggingEdgePayload;this.params.onEdgeReattachPrevented({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority})}}}class se{constructor(e,t,s){this.canvas=e,this.layoutAlgorithm=t,this.trigger=s,this.trigger.subscribe(()=>{this.applyLayout()})}static configure(e,t,s){new se(e,t,s)}applyLayout(){this.layoutAlgorithm.calculateCoordinates(this.canvas.graph).forEach((t,s)=>{this.canvas.updateNode(s,t)})}}class oe{constructor(e,t){o(this,"applyScheduled",!1);this.canvas=e,this.layoutAlgorithm=t,this.canvas.graph.onAfterNodeAdded.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onBeforeNodeRemoved.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onAfterEdgeAdded.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onBeforeEdgeRemoved.subscribe(()=>{this.scheduleApply()})}static configure(e,t){new oe(e,t)}scheduleApply(){this.applyScheduled||(this.applyScheduled=!0,setTimeout(()=>{this.applyScheduled=!1,this.applyLayout()}))}applyLayout(){this.layoutAlgorithm.calculateCoordinates(this.canvas.graph).forEach((t,s)=>{this.canvas.updateNode(s,t)})}}class xt{static configure(e,t){const s=t.applyOn;switch(s.type){case"manual":{se.configure(e,t.algorithm,s.trigger);break}case"topologyChangeTimeout":{oe.configure(e,t.algorithm);break}}}}class St{constructor(e,t){o(this,"previousTimeStamp");o(this,"step",e=>{if(this.previousTimeStamp===void 0)this.previousTimeStamp=e;else{const t=(e-this.previousTimeStamp)/1e3;this.previousTimeStamp=e,this.callback(t)}this.win.requestAnimationFrame(this.step)});this.win=e,this.callback=t,this.win.requestAnimationFrame(this.step)}}class ie{constructor(e,t,s,i){o(this,"step",e=>{this.algorithm.calculateNextCoordinates(this.canvas.graph,e).forEach((s,i)=>{this.staticNodes.has(i)||this.canvas.updateNode(i,{x:s.x,y:s.y})})});this.canvas=e,this.algorithm=t,this.staticNodes=s,this.win=i,new St(this.win,this.step)}static configure(e,t,s,i){new ie(e,t,s,i)}}const Pt=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r},ne=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.inset="0",r},Ce=()=>{const r=ne();return r.style.pointerEvents="none",r};class bt{constructor(e){o(this,"background",ne());o(this,"main",ne());o(this,"overlayConnectablePorts",Ce());o(this,"overlayDraggableEdges",Ce());o(this,"host",Pt());this.element=e,this.element.appendChild(this.host),this.host.appendChild(this.background),this.host.appendChild(this.main),this.host.appendChild(this.overlayConnectablePorts),this.host.appendChild(this.overlayDraggableEdges)}destroy(){this.host.removeChild(this.background),this.host.removeChild(this.main),this.host.removeChild(this.overlayConnectablePorts),this.host.removeChild(this.overlayDraggableEdges),this.element.removeChild(this.host)}}const ae=r=>()=>r,Re=ae(0),Tt=()=>{let r=0;return()=>r++},Dt=(r,e)=>{let t=Re,s=Re;const i=Tt();return r==="incremental"&&(t=i),e==="incremental"&&(s=i),typeof r=="number"&&(t=ae(r)),typeof e=="number"&&(s=ae(e)),typeof r=="function"&&(t=r),typeof e=="function"&&(s=e),{nodesPriorityFn:t,edgesPriorityFn:s}},he=r=>{if(typeof r=="function")return r;switch(r.type){case"straight":return()=>new Pe({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance,detourDirection:r.detourDirection});case"horizontal":return()=>new Se({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"vertical":return()=>new be({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"direct":return()=>new J({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,sourceOffset:r.sourceOffset,targetOffset:r.targetOffset});default:return()=>new xe({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleRadius:r.cycleRadius,smallCycleRadius:r.smallCycleRadius,curvature:r.curvature,detourDistance:r.detourDistance,detourDirection:r.detourDirection})}},Nt=r=>{var t,s,i,n,a;const e=Dt((t=r.nodes)==null?void 0:t.priority,(s=r.edges)==null?void 0:s.priority);return{nodes:{centerFn:((i=r.nodes)==null?void 0:i.centerFn)??we,priorityFn:e.nodesPriorityFn},ports:{direction:((n=r.ports)==null?void 0:n.direction)??0},edges:{shapeFactory:he(((a=r.edges)==null?void 0:a.shape)??{}),priorityFn:e.edgesPriorityFn}}},Mt=r=>{var p,w,m,v,x;const e=((p=r.events)==null?void 0:p.onNodeDrag)??(()=>{}),t=r.nodeDragVerifier??(()=>!0),s=((w=r.events)==null?void 0:w.onNodeDragFinished)??(()=>{}),i=r.moveOnTop!==!1,n=r.moveEdgesOnTop!==!1&&i,a=(m=r.mouse)==null?void 0:m.dragCursor,h=a!==void 0?a:"grab",d=(v=r.mouse)==null?void 0:v.mouseDownEventVerifier,c=d!==void 0?d:P=>P.button===0,g=(x=r.mouse)==null?void 0:x.mouseUpEventVerifier,l=g!==void 0?g:P=>P.button===0;return{moveOnTop:i,moveEdgesOnTop:n,dragCursor:h,gridSize:r.gridSize??null,mouseDownEventVerifier:c,mouseUpEventVerifier:l,onNodeDrag:e,nodeDragVerifier:t,onNodeDragFinished:s}},Lt=r=>{const e=r.minX!==null?r.minX:-1/0,t=r.maxX!==null?r.maxX:1/0,s=r.minY!==null?r.minY:-1/0,i=r.maxY!==null?r.maxY:1/0;return n=>{let a=n.nextTransform.x,h=n.nextTransform.y;a<e&&a<n.prevTransform.x&&(a=Math.min(n.prevTransform.x,e));const d=n.canvasWidth*n.prevTransform.scale,c=t-d;a>c&&a>n.prevTransform.x&&(a=Math.max(n.prevTransform.x,c)),h<s&&h<n.prevTransform.y&&(h=Math.min(n.prevTransform.y,s));const g=n.canvasHeight*n.prevTransform.scale,l=i-g;return h>l&&h>n.prevTransform.y&&(h=Math.max(n.prevTransform.y,l)),{scale:n.nextTransform.scale,x:a,y:h}}},Ct=r=>{const e=r.maxContentScale,t=r.minContentScale,s=e!==null?1/e:0,i=t!==null?1/t:1/0;return n=>{const a=n.prevTransform,h=n.nextTransform;let d=h.scale,c=h.x,g=h.y;if(h.scale>i&&h.scale>a.scale){d=Math.max(a.scale,i),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*l,g=a.y+(h.y-a.y)*l}if(h.scale<s&&h.scale<a.scale){d=Math.min(a.scale,s),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*l,g=a.y+(h.y-a.y)*l}return{scale:d,x:c,y:g}}},Rt=r=>e=>r.reduce((t,s)=>s({prevTransform:e.prevTransform,nextTransform:t,canvasWidth:e.canvasWidth,canvasHeight:e.canvasHeight}),e.nextTransform),Ve=r=>{if(typeof r=="function")return r;switch(r.type){case"scale-limit":return Ct({minContentScale:r.minContentScale??0,maxContentScale:r.maxContentScale??1/0});case"shift-limit":return Lt({minX:r.minX??-1/0,maxX:r.maxX??1/0,minY:r.minY??-1/0,maxY:r.maxY??1/0})}},$e=r=>{var m,v,x,P,$,M,C,U,We,ke,ze,He;const e=(m=r==null?void 0:r.scale)==null?void 0:m.mouseWheelSensitivity,t=e!==void 0?e:1.2,s=r==null?void 0:r.transformPreprocessor;let i;s!==void 0?Array.isArray(s)?i=Rt(s.map(R=>Ve(R))):i=Ve(s):i=R=>R.nextTransform;const n=((v=r==null?void 0:r.shift)==null?void 0:v.cursor)!==void 0?r.shift.cursor:"grab",a=((x=r==null?void 0:r.events)==null?void 0:x.onBeforeTransformChange)??(()=>{}),h=((P=r==null?void 0:r.events)==null?void 0:P.onTransformChange)??(()=>{}),d=($=r==null?void 0:r.shift)==null?void 0:$.mouseDownEventVerifier,c=d!==void 0?d:R=>R.button===0,g=(M=r==null?void 0:r.shift)==null?void 0:M.mouseUpEventVerifier,l=g!==void 0?g:R=>R.button===0,p=(C=r==null?void 0:r.scale)==null?void 0:C.mouseWheelEventVerifier,w=p!==void 0?p:()=>!0;return{wheelSensitivity:t,onTransformStarted:((U=r==null?void 0:r.events)==null?void 0:U.onTransformStarted)??(()=>{}),onTransformFinished:((We=r==null?void 0:r.events)==null?void 0:We.onTransformFinished)??(()=>{}),onBeforeTransformChange:a,onTransformChange:h,transformPreprocessor:i,shiftCursor:n,mouseDownEventVerifier:c,mouseUpEventVerifier:l,mouseWheelEventVerifier:w,scaleWheelFinishTimeout:((ke=r==null?void 0:r.scale)==null?void 0:ke.wheelFinishTimeout)??500,onResizeTransformStarted:((ze=r==null?void 0:r.events)==null?void 0:ze.onResizeTransformStarted)??(()=>{}),onResizeTransformFinished:((He=r==null?void 0:r.events)==null?void 0:He.onResizeTransformFinished)??(()=>{})}},Vt=(r,e)=>{const t=document.createElementNS("http://www.w3.org/2000/svg","circle");return t.setAttribute("cx","0"),t.setAttribute("cy","0"),t.setAttribute("r",`${r}`),t.setAttribute("fill",`${e}`),t},$t=r=>r instanceof SVGElement?r:Vt((r==null?void 0:r.radius)??1.5,(r==null?void 0:r.color)??"#d8d8d8"),It=r=>{const e=r.tileDimensions,t=(e==null?void 0:e.width)??25,s=(e==null?void 0:e.height)??25,i=$t(r.renderer??{});return{tileWidth:t,tileHeight:s,renderer:i,maxViewportScale:r.maxViewportScale??10}},Ut=(r,e,t)=>{var c,g,l;const s=()=>"direct",i=p=>p,n=p=>p.button===0,a=()=>{},h=()=>{},d=()=>{};return{connectionTypeResolver:r.connectionTypeResolver??s,connectionPreprocessor:r.connectionPreprocessor??i,mouseDownEventVerifier:r.mouseDownEventVerifier??n,mouseUpEventVerifier:r.mouseUpEventVerifier??n,onAfterEdgeCreated:((c=r.events)==null?void 0:c.onAfterEdgeCreated)??a,onEdgeCreationInterrupted:((g=r.events)==null?void 0:g.onEdgeCreationInterrupted)??d,onEdgeCreationPrevented:((l=r.events)==null?void 0:l.onEdgeCreationPrevented)??h,dragPortDirection:r.dragPortDirection??t,edgeShapeFactory:r.edgeShape!==void 0?he(r.edgeShape):e}},Bt=(r,e)=>{var c,g,l;const t=p=>p,s=p=>p.button===0&&p.ctrlKey,i=p=>p.button===0,n=p=>{const w=e.getPortAdjacentEdgeIds(p);return w.length>0?w[w.length-1]:null},a=()=>{},h=()=>{},d=()=>{};return{connectionPreprocessor:r.connectionPreprocessor??t,mouseDownEventVerifier:r.mouseDownEventVerifier??s,mouseUpEventVerifier:r.mouseUpEventVerifier??i,draggingEdgeResolver:r.draggingEdgeResolver??n,draggingEdgeShapeFactory:r.draggingEdgeShape!==void 0?he(r.draggingEdgeShape):null,onAfterEdgeReattached:((c=r.events)==null?void 0:c.onAfterEdgeReattached)??a,onEdgeReattachInterrupted:((g=r.events)==null?void 0:g.onEdgeReattachInterrupted)??d,onEdgeReattachPrevented:((l=r.events)==null?void 0:l.onEdgeReattachPrevented)??h}},Ft=r=>({nodeVerticalRadius:r.nodeContainingRadius.vertical,nodeHorizontalRadius:r.nodeContainingRadius.horizontal}),Ot=r=>{var e,t;return{onAfterNodeDetached:((e=r==null?void 0:r.events)==null?void 0:e.onAfterNodeDetached)??(()=>{}),onBeforeNodeAttached:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeNodeAttached)??(()=>{})}};class Ie extends Error{constructor(){super(...arguments);o(this,"name","CanvasBuilderError")}}class Wt{constructor(e,t){this.coordinates=e,this.rand=t}getVector(e,t){const s=this.coordinates.get(e),i=this.coordinates.get(t),n=i.x-s.x,a=i.y-s.y,h=n*n+a*a;if(h===0){const l=this.rand()*2*Math.PI;return{ex:Math.cos(l),ey:Math.sin(l),d2:1,d:1}}const d=Math.sqrt(h),c=n/d,g=a/d;return{ex:c,ey:g,d2:h,d}}}class Ue{constructor(e,t,s){o(this,"dtSec");o(this,"k");o(this,"nodeMass");o(this,"edgeEquilibriumLength");o(this,"edgeStiffness");o(this,"effectiveDistance");this.graph=e,this.currentCoords=t,this.params=s,this.dtSec=this.params.dtSec,this.k=this.params.nodeCharge*this.params.nodeCharge,this.nodeMass=this.params.nodeMass,this.edgeEquilibriumLength=this.params.edgeEquilibriumLength,this.edgeStiffness=this.params.edgeStiffness,this.effectiveDistance=this.params.effectiveDistance}next(){let e=0;const t=new Map,s=this.graph.getAllNodeIds();s.forEach(a=>{t.set(a,{x:0,y:0})});const i=new Wt(this.currentCoords,this.params.rand),n=s.length;for(let a=0;a<n;a++){const h=s[a];for(let d=a+1;d<n;d++){const c=s[d],g=i.getVector(h,c);if(g.d>this.effectiveDistance)continue;const l=this.k/g.d2,p=l*g.ex,w=l*g.ey,m=p/2,v=w/2,x=t.get(h),P=t.get(c);x.x-=m,x.y-=v,P.x+=m,P.y+=v}}return this.graph.getAllEdgeIds().forEach(a=>{const h=this.graph.getEdge(a),d=this.graph.getPort(h.from),c=this.graph.getPort(h.to),g=i.getVector(d.nodeId,c.nodeId),p=(g.d-this.edgeEquilibriumLength)*this.edgeStiffness/2,w=g.ex*p,m=g.ey*p,v=t.get(d.nodeId),x=t.get(c.nodeId);v.x+=w,v.y+=m,x.x-=w,x.y-=m}),this.currentCoords.forEach((a,h)=>{const d=t.get(h),c={x:d.x/this.nodeMass*this.dtSec,y:d.y/this.nodeMass*this.dtSec},g=c.x*this.dtSec,l=c.y*this.dtSec;a.x+=g,a.y+=l,e=Math.max(e,Math.sqrt(g*g+l*l))}),e}}const Be=(r,e,t)=>{const s=new Map,i=r.getAllNodeIds(),n=Math.sqrt(i.length)*t;return i.forEach(a=>{const h=r.getNode(a);s.set(a,{x:h.x??n*e(),y:h.y??n*e()})}),s};class kt{constructor(e){this.params=e}calculateCoordinates(e){const t=Be(e,this.params.rand,this.params.edgeEquilibriumLength);for(let s=0;s<this.params.maxIterations&&!(new Ue(e,t,{rand:this.params.rand,dtSec:this.params.dtSec,nodeMass:this.params.nodeMass,nodeCharge:this.params.nodeCharge,edgeEquilibriumLength:this.params.edgeEquilibriumLength,effectiveDistance:this.params.effectiveDistance,edgeStiffness:this.params.edgeStiffness}).next()<this.params.convergenceDelta);s++);return t}}class zt{constructor(e){this.params=e}calculateNextCoordinates(e,t){const s=Be(e,this.params.rand,this.params.edgeEquilibriumLength);return new Ue(e,s,{rand:this.params.rand,dtSec:Math.min(t,this.params.maxTimeDeltaSec),nodeMass:this.params.nodeMass,nodeCharge:this.params.nodeCharge,edgeEquilibriumLength:this.params.edgeEquilibriumLength,effectiveDistance:this.params.effectiveDistance,edgeStiffness:this.params.edgeStiffness}).next()<this.params.convergenceDelta&&!e.getAllNodeIds().some(h=>{const d=e.getNode(h);return d.x===null||d.y===null})?new Map:s}}const Fe=r=>{let e=1779033703,t=3144134277,s=1013904242,i=2773480762;for(let n=0,a;n<r.length;n++)a=r.charCodeAt(n),e=t^Math.imul(e^a,597399067),t=s^Math.imul(t^a,2869860233),s=i^Math.imul(s^a,951274213),i=e^Math.imul(i^a,2716044179);return e=Math.imul(s^e>>>18,597399067),t=Math.imul(i^t>>>22,2869860233),s=Math.imul(e^s>>>17,951274213),i=Math.imul(t^i>>>19,2716044179),e^=t^s^i,t^=e,s^=e,i^=e,[e>>>0,t>>>0,s>>>0,i>>>0]},Oe=(r,e,t,s)=>function(){r|=0,e|=0,t|=0,s|=0;const i=(r+e|0)+s|0;return s=s+1|0,r=e^e>>>9,e=t+(t<<3)|0,t=t<<21|t>>>11,t=t+i|0,(i>>>0)/4294967296},S=Object.freeze({seed:"HTMLGraph is awesome",maxTimeDeltaSec:.1,nodeCharge:1e5,nodeMass:1,edgeEquilibriumLength:300,edgeStiffness:1e3,effectiveDistance:1e3,dtSec:.02,maxIterations:100,convergenceDelta:.001}),Ht=r=>{var e;switch((e=r==null?void 0:r.algorithm)==null?void 0:e.type){case"custom":return r.algorithm.instance;default:{const t=r==null?void 0:r.algorithm,s=Fe((t==null?void 0:t.seed)??S.seed),i=Oe(s[0],s[1],s[2],s[3]);return new zt({rand:i,maxTimeDeltaSec:(t==null?void 0:t.maxTimeDeltaSec)??S.maxTimeDeltaSec,nodeCharge:(t==null?void 0:t.nodeCharge)??S.nodeCharge,nodeMass:(t==null?void 0:t.nodeMass)??S.nodeMass,edgeEquilibriumLength:(t==null?void 0:t.edgeEquilibriumLength)??S.edgeEquilibriumLength,effectiveDistance:S.effectiveDistance,edgeStiffness:(t==null?void 0:t.edgeStiffness)??S.edgeStiffness,convergenceDelta:(t==null?void 0:t.convergenceDelta)??S.convergenceDelta})}}},Xt=r=>r instanceof B?{type:"manual",trigger:r}:{type:"topologyChangeTimeout"},Yt=r=>{switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const e=Fe((r==null?void 0:r.seed)??S.seed),t=Oe(e[0],e[1],e[2],e[3]);return new kt({dtSec:(r==null?void 0:r.dtSec)??S.dtSec,maxIterations:(r==null?void 0:r.maxIterations)??S.maxIterations,rand:t,maxTimeDeltaSec:(r==null?void 0:r.maxTimeDeltaSec)??S.maxTimeDeltaSec,nodeCharge:(r==null?void 0:r.nodeCharge)??S.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??S.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??S.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??S.edgeStiffness,effectiveDistance:(r==null?void 0:r.effectiveDistance)??S.effectiveDistance,convergenceDelta:(r==null?void 0:r.convergenceDelta)??S.convergenceDelta})}}},jt=r=>({algorithm:Yt(r==null?void 0:r.algorithm),applyOn:Xt(r==null?void 0:r.applyOn)}),Gt=(r,e)=>({...r,nodeDragVerifier:t=>(e.add(t),r.nodeDragVerifier(t)),onNodeDragFinished:t=>{e.delete(t),r.onNodeDragFinished(t)}}),Kt=(r,e)=>{r.onBeforeNodeRemoved.subscribe(t=>{e.delete(t)}),r.onBeforeClear.subscribe(()=>{e.clear()})};class Zt{constructor(e){o(this,"used",!1);o(this,"canvasDefaults",{});o(this,"dragConfig",{});o(this,"transformConfig",{});o(this,"backgroundConfig",{});o(this,"connectablePortsConfig",{});o(this,"draggableEdgesConfig",{});o(this,"virtualScrollConfig");o(this,"layoutConfig");o(this,"animatedLayoutConfig");o(this,"hasDraggableNodes",!1);o(this,"hasTransformableViewport",!1);o(this,"hasNodeResizeReactiveEdges",!1);o(this,"hasBackground",!1);o(this,"hasUserConnectablePorts",!1);o(this,"hasUserDraggableEdges",!1);o(this,"hasAnimatedLayout",!1);o(this,"hasLayout",!1);o(this,"boxRenderingTrigger",new B);o(this,"graphStore",new le);o(this,"viewportStore",new Qe);o(this,"graph",new Ne(this.graphStore));o(this,"viewport",new Me(this.viewportStore));o(this,"window",window);o(this,"animationStaticNodes",new Set);this.element=e}setDefaults(e){return this.canvasDefaults=e,this}enableUserDraggableNodes(e){return this.hasDraggableNodes=!0,this.dragConfig=e??{},this}enableUserTransformableViewport(e){return this.hasTransformableViewport=!0,this.transformConfig=e??{},this}enableNodeResizeReactiveEdges(){return this.hasNodeResizeReactiveEdges=!0,this}enableVirtualScroll(e){return this.virtualScrollConfig=e,this}enableBackground(e){return this.hasBackground=!0,this.backgroundConfig=e??{},this}enableUserConnectablePorts(e){return this.hasUserConnectablePorts=!0,this.connectablePortsConfig=e??{},this}enableUserDraggableEdges(e){return this.hasUserDraggableEdges=!0,this.draggableEdgesConfig=e??{},this}enableLayout(e){return this.layoutConfig=e,this.hasLayout=!0,this.hasAnimatedLayout=!1,this}enableAnimatedLayout(e){return this.animatedLayoutConfig=e,this.hasAnimatedLayout=!0,this.hasLayout=!1,this}build(){if(this.used)throw new Ie("CanvasBuilder is a single use object");this.used=!0;const e=new bt(this.element);let t=new de(this.graphStore,this.viewportStore,e.main);this.virtualScrollConfig!==void 0&&(t=new Ke(t,this.graphStore,this.boxRenderingTrigger,Ot(this.virtualScrollConfig))),t=new Ze(t,this.graphStore);const s=Nt(this.canvasDefaults),i=new ce(this.graph,this.viewport,this.graphStore,this.viewportStore,t,s);if(this.hasBackground&&ee.configure(i,It(this.backgroundConfig),e.background),this.hasNodeResizeReactiveEdges&&G.configure(i),this.hasDraggableNodes){let a=Mt(this.dragConfig);this.hasAnimatedLayout&&(a=Gt(a,this.animationStaticNodes)),q.configure(i,e.main,this.window,a)}if(this.hasUserConnectablePorts){const a=Ut(this.connectablePortsConfig,s.edges.shapeFactory,s.ports.direction);te.configure(i,e.overlayConnectablePorts,this.viewportStore,this.window,a)}if(this.hasUserDraggableEdges){const a=Bt(this.draggableEdgesConfig,i.graph);re.configure(i,e.overlayDraggableEdges,this.viewportStore,this.window,a)}this.virtualScrollConfig!==void 0?_.configure(i,e.main,this.window,$e(this.transformConfig),this.boxRenderingTrigger,Ft(this.virtualScrollConfig)):this.hasTransformableViewport&&Y.configure(i,e.main,this.window,$e(this.transformConfig)),this.hasLayout&&xt.configure(i,jt(this.layoutConfig)),this.hasAnimatedLayout&&(Kt(i.graph,this.animationStaticNodes),ie.configure(i,Ht(this.animatedLayoutConfig),this.animationStaticNodes,this.window));const n=()=>{e.destroy(),i.onBeforeDestroy.unsubscribe(n)};return i.onBeforeDestroy.subscribe(n),i}}E.BezierEdgeShape=xe,E.CanvasBuilder=Zt,E.CanvasBuilderError=Ie,E.CanvasError=T,E.DirectEdgeShape=J,E.EventSubject=B,E.HorizontalEdgeShape=Se,E.InteractiveEdgeError=De,E.InteractiveEdgeShape=Q,E.MidpointEdgeShape=ft,E.StraightEdgeShape=Pe,E.VerticalEdgeShape=be,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
1
+ (function(E,A){typeof exports=="object"&&typeof module<"u"?A(exports):typeof define=="function"&&define.amd?define(["exports"],A):(E=typeof globalThis<"u"?globalThis:E||self,A(E.HtmlGraph={}))})(this,function(E){"use strict";var Jt=Object.defineProperty;var Qt=(E,A,D)=>A in E?Jt(E,A,{enumerable:!0,configurable:!0,writable:!0,value:D}):E[A]=D;var o=(E,A,D)=>Qt(E,typeof A!="symbol"?A+"":A,D);const A=(r,e)=>({x:r.scale*e.x+r.x,y:r.scale*e.y+r.y});var D=(r=>(r.Line="line",r.NodeCycle="node-cycle",r.PortCycle="port-cycle",r))(D||{});const Xe=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r.style.overflow="hidden",r},Ye=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.width="0",r.style.height="0",r},je=r=>{r.style.position="absolute",r.style.top="0",r.style.left="0",r.style.visibility="hidden"};class de{constructor(e,t,s){o(this,"host",Xe());o(this,"container",Ye());o(this,"edgeIdToElementMap",new Map);o(this,"attachedNodeIds",new Set);o(this,"applyTransform",()=>{const e=this.viewportStore.getContentMatrix();this.container.style.transform=`matrix(${e.scale}, 0, 0, ${e.scale}, ${e.x}, ${e.y})`});this.graphStore=e,this.viewportStore=t,this.element=s,this.element.appendChild(this.host),this.host.appendChild(this.container),this.viewportStore.onAfterUpdated.subscribe(this.applyTransform)}attachNode(e){const t=this.graphStore.getNode(e);je(t.element),this.attachedNodeIds.add(e),this.container.appendChild(t.element),this.updateNodePosition(e),this.updateNodePriority(e),t.element.style.visibility="visible"}detachNode(e){const t=this.graphStore.getNode(e);this.container.removeChild(t.element),this.attachedNodeIds.delete(e)}attachEdge(e){const t=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,t),this.container.appendChild(t),this.renderEdge(e),this.updateEdgePriority(e)}detachEdge(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t),this.edgeIdToElementMap.delete(e)}clear(){this.edgeIdToElementMap.forEach((e,t)=>{this.detachEdge(t)}),this.attachedNodeIds.forEach(e=>{this.detachNode(e)})}destroy(){this.viewportStore.onAfterUpdated.unsubscribe(this.applyTransform),this.element.removeChild(this.host),this.host.removeChild(this.container)}updateNodePosition(e){const t=this.graphStore.getNode(e),{width:s,height:i}=t.element.getBoundingClientRect(),n=this.viewportStore.getViewportMatrix().scale,{payload:a}=t,h=a.centerFn(s,i),d=a.x-n*h.x,c=a.y-n*h.y;t.element.style.transform=`translate(${d}px, ${c}px)`}updateNodePriority(e){const t=this.graphStore.getNode(e);t.element.style.zIndex=`${t.payload.priority}`}updateEdgeShape(e){const t=this.edgeIdToElementMap.get(e);this.container.removeChild(t);const i=this.graphStore.getEdge(e).payload.shape.svg;this.edgeIdToElementMap.set(e,i),this.container.appendChild(i)}renderEdge(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from),i=this.graphStore.getPort(t.to),n=s.element.getBoundingClientRect(),a=i.element.getBoundingClientRect(),h=this.host.getBoundingClientRect(),d=this.viewportStore.getViewportMatrix(),c=this.createEdgeRenderPort(s,n,h,d),g=this.createEdgeRenderPort(i,a,h,d);let l=D.Line;s.element===i.element?l=D.PortCycle:s.nodeId===i.nodeId&&(l=D.NodeCycle),t.payload.shape.render({from:c,to:g,category:l})}updateEdgePriority(e){const t=this.graphStore.getEdge(e);t.payload.shape.svg.style.zIndex=`${t.payload.priority}`}createEdgeRenderPort(e,t,s,i){const n={x:t.left-s.left,y:t.top-s.top},a=A(i,n);return{x:a.x,y:a.y,width:t.width*i.scale,height:t.height*i.scale,direction:e.payload.direction}}}class Ge{constructor(e){o(this,"xFrom",1/0);o(this,"yFrom",1/0);o(this,"xTo",1/0);o(this,"yTo",1/0);this.graphStore=e}setRenderingBox(e){this.xFrom=e.x,this.xTo=e.x+e.width,this.yFrom=e.y,this.yTo=e.y+e.height}hasNode(e){const t=this.graphStore.getNode(e).payload,{x:s,y:i}=t;return s>=this.xFrom&&s<=this.xTo&&i>=this.yFrom&&i<=this.yTo}hasEdge(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from).nodeId,i=this.graphStore.getPort(t.to).nodeId,n=this.graphStore.getNode(s).payload,a=this.graphStore.getNode(i).payload,h=Math.min(n.x,a.x),d=Math.max(n.x,a.x),c=Math.min(n.y,a.y),g=Math.max(n.y,a.y);return h<=this.xTo&&d>=this.xFrom&&c<=this.yTo&&g>=this.yFrom}}class Ke{constructor(e,t,s,i){o(this,"attachedNodes",new Set);o(this,"attachedEdges",new Set);o(this,"renderingBox");o(this,"updateViewport",e=>{this.renderingBox.setRenderingBox(e);const t=new Set,s=new Set,i=new Set,n=new Set;this.graphStore.getAllNodeIds().forEach(a=>{const h=this.renderingBox.hasNode(a),d=this.attachedNodes.has(a);h&&!d?t.add(a):!h&&d&&s.add(a)}),this.graphStore.getAllEdgeIds().forEach(a=>{const h=this.renderingBox.hasEdge(a),d=this.attachedEdges.has(a),c=this.graphStore.getEdge(a),g=this.graphStore.getPort(c.from).nodeId,l=this.graphStore.getPort(c.to).nodeId;h&&(this.renderingBox.hasNode(g)||(t.add(g),s.delete(g)),this.renderingBox.hasNode(l)||(t.add(l),s.delete(l))),h&&!d?i.add(a):!h&&d&&n.add(a)}),n.forEach(a=>{this.handleDetachEdge(a)}),s.forEach(a=>{this.handleDetachNode(a)}),t.forEach(a=>{this.attachedNodes.has(a)||this.handleAttachNode(a)}),i.forEach(a=>{this.handleAttachEdge(a)})});this.htmlView=e,this.graphStore=t,this.trigger=s,this.params=i,this.renderingBox=new Ge(this.graphStore),this.trigger.subscribe(this.updateViewport)}attachNode(e){this.renderingBox.hasNode(e)&&this.handleAttachNode(e)}detachNode(e){this.attachedNodes.has(e)&&this.handleDetachNode(e)}attachEdge(e){this.renderingBox.hasEdge(e)&&this.attachEdgeEntities(e)}detachEdge(e){this.attachedEdges.has(e)&&this.handleDetachEdge(e)}updateNodePosition(e){this.attachedNodes.has(e)?this.htmlView.updateNodePosition(e):this.renderingBox.hasNode(e)&&(this.handleAttachNode(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(t=>{this.attachEdgeEntities(t)}))}updateNodePriority(e){this.attachedNodes.has(e)&&this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgeShape(e)}renderEdge(e){this.attachedEdges.has(e)&&this.htmlView.renderEdge(e)}updateEdgePriority(e){this.attachedEdges.has(e)&&this.htmlView.updateEdgePriority(e)}clear(){this.htmlView.clear(),this.attachedNodes.clear(),this.attachedEdges.clear()}destroy(){this.clear(),this.htmlView.destroy(),this.trigger.unsubscribe(this.updateViewport)}attachEdgeEntities(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from).nodeId,i=this.graphStore.getPort(t.to).nodeId;this.attachedNodes.has(s)||this.handleAttachNode(s),this.attachedNodes.has(i)||this.handleAttachNode(i),this.handleAttachEdge(e)}handleAttachNode(e){this.params.onBeforeNodeAttached(e),this.attachedNodes.add(e),this.htmlView.attachNode(e)}handleDetachNode(e){this.htmlView.detachNode(e),this.attachedNodes.delete(e),this.params.onAfterNodeDetached(e)}handleAttachEdge(e){this.attachedEdges.add(e),this.htmlView.attachEdge(e)}handleDetachEdge(e){this.htmlView.detachEdge(e),this.attachedEdges.delete(e)}}class Ze{constructor(e,t){o(this,"deferredNodes",new Set);o(this,"deferredEdges",new Set);this.htmlView=e,this.graphStore=t}attachNode(e){this.isNodeValid(e)?this.htmlView.attachNode(e):this.deferredNodes.add(e)}detachNode(e){this.deferredNodes.has(e)?this.deferredNodes.delete(e):this.htmlView.detachNode(e)}attachEdge(e){this.isEdgeValid(e)?this.htmlView.attachEdge(e):this.deferredEdges.add(e)}detachEdge(e){this.deferredEdges.has(e)?this.deferredEdges.delete(e):this.htmlView.detachEdge(e)}updateNodePosition(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePosition(e)}updateNodePriority(e){this.deferredNodes.has(e)?this.tryAttachNode(e):this.htmlView.updateNodePriority(e)}updateEdgeShape(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgeShape(e)}renderEdge(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.renderEdge(e)}updateEdgePriority(e){this.deferredEdges.has(e)?this.tryAttachEdge(e):this.htmlView.updateEdgePriority(e)}clear(){this.deferredNodes.clear(),this.deferredEdges.clear(),this.htmlView.clear()}destroy(){this.htmlView.destroy()}isNodeValid(e){const t=this.graphStore.getNode(e);return!(t.payload.x===null||t.payload.y===null)}tryAttachNode(e){this.isNodeValid(e)&&(this.deferredNodes.delete(e),this.htmlView.attachNode(e))}isEdgeValid(e){const t=this.graphStore.getEdge(e),s=this.graphStore.getPort(t.from),i=this.graphStore.getPort(t.to);return!(this.deferredNodes.has(s.nodeId)||this.deferredNodes.has(i.nodeId))}tryAttachEdge(e){this.isEdgeValid(e)&&(this.deferredEdges.delete(e),this.htmlView.attachEdge(e))}}class B{constructor(){o(this,"callbacks",new Set)}subscribe(e){this.callbacks.add(e)}unsubscribe(e){this.callbacks.delete(e)}emit(e){this.callbacks.forEach(t=>{t(e)})}}const P=()=>{const r=new B;return[r,r]};class j{constructor(e){o(this,"counter",0);this.checkExists=e}create(e){if(e!==void 0)return e;for(;this.checkExists(this.counter);)this.counter++;return this.counter}reset(){this.counter=0}}class T extends Error{constructor(){super(...arguments);o(this,"name","CanvasError")}}class ce{constructor(e,t,s,i,n,a){o(this,"nodeIdGenerator",new j(e=>this.graphStore.getNode(e)!==void 0));o(this,"portIdGenerator",new j(e=>this.graphStore.getPort(e)!==void 0));o(this,"edgeIdGenerator",new j(e=>this.graphStore.getEdge(e)!==void 0));o(this,"onAfterNodeAdded",e=>{this.htmlView.attachNode(e)});o(this,"onAfterNodeUpdated",e=>{this.htmlView.updateNodePosition(e),this.graphStore.getNodeAdjacentEdgeIds(e).forEach(s=>{this.htmlView.renderEdge(s)})});o(this,"onAfterNodePriorityUpdated",e=>{this.htmlView.updateNodePriority(e)});o(this,"onBeforeNodeRemoved",e=>{this.graphStore.getNodePortIds(e).forEach(t=>{this.unmarkPort(t)}),this.htmlView.detachNode(e)});o(this,"onAfterPortUpdated",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(s=>{this.htmlView.renderEdge(s)})});o(this,"onBeforePortUnmarked",e=>{this.graphStore.getPortAdjacentEdgeIds(e).forEach(t=>{this.removeEdge(t)})});o(this,"onAfterEdgeAdded",e=>{this.htmlView.attachEdge(e)});o(this,"onAfterEdgeShapeUpdated",e=>{this.htmlView.updateEdgeShape(e)});o(this,"onAfterEdgeUpdated",e=>{this.htmlView.renderEdge(e)});o(this,"onAfterEdgePriorityUpdated",e=>{this.htmlView.updateEdgePriority(e)});o(this,"onBeforeEdgeRemoved",e=>{this.htmlView.detachEdge(e)});o(this,"onBeforeClear",()=>{this.nodeIdGenerator.reset(),this.portIdGenerator.reset(),this.edgeIdGenerator.reset(),this.htmlView.clear()});o(this,"onBeforeDestroyEmitter");o(this,"destroyed",!1);o(this,"onBeforeDestroy");this.graph=e,this.viewport=t,this.graphStore=s,this.viewportStore=i,this.htmlView=n,this.params=a,this.graphStore.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.subscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.subscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.subscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.subscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.subscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.subscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.subscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.subscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.subscribe(this.onBeforeClear),[this.onBeforeDestroyEmitter,this.onBeforeDestroy]=P()}addNode(e){const t=this.nodeIdGenerator.create(e.id);if(this.graphStore.getNode(t)!==void 0)throw new T("failed to add node with existing id");if(this.graphStore.getElementNodeId(e.element)!==void 0)throw new T("failed to add node with html element already in use by another node");if(this.graphStore.addNode({id:t,element:e.element,x:e.x??null,y:e.y??null,centerFn:e.centerFn??this.params.nodes.centerFn,priority:e.priority??this.params.nodes.priorityFn()}),e.ports!==void 0)for(const s of e.ports)this.markPort({id:s.id,element:s.element,nodeId:t,direction:s.direction});return this}updateNode(e,t){if(this.graphStore.getNode(e)===void 0)throw new T("failed to update nonexistent node");return this.graphStore.updateNode(e,t??{}),this}removeNode(e){if(this.graphStore.getNode(e)===void 0)throw new T("failed to remove nonexistent node");return this.graphStore.removeNode(e),this}markPort(e){const t=this.portIdGenerator.create(e.id);if(this.graphStore.getPort(t)!==void 0)throw new T("failed to add port with existing id");if(this.graphStore.getNode(e.nodeId)===void 0)throw new T("failed to mark port for nonexistent node");return this.graphStore.addPort({id:t,element:e.element,nodeId:e.nodeId,direction:e.direction??this.params.ports.direction}),this}updatePort(e,t){if(this.graphStore.getPort(e)===void 0)throw new T("failed to update nonexistent port");return this.graphStore.updatePort(e,t??{}),this}unmarkPort(e){if(this.graphStore.getPort(e)===void 0)throw new T("failed to unmark nonexistent port");return this.graphStore.removePort(e),this}addEdge(e){const t=this.edgeIdGenerator.create(e.id);if(this.graphStore.getEdge(t)!==void 0)throw new T("failed to add edge with existing id");if(this.graphStore.getPort(e.from)===void 0)throw new T("failed to add edge from nonexistent port");if(this.graphStore.getPort(e.to)===void 0)throw new T("failed to add edge to nonexistent port");return this.graphStore.addEdge({id:t,from:e.from,to:e.to,shape:e.shape??this.params.edges.shapeFactory(t),priority:e.priority??this.params.edges.priorityFn()}),this}updateEdge(e,t){if(this.graphStore.getEdge(e)===void 0)throw new T("failed to update nonexistent edge");return this.graphStore.updateEdge(e,t??{}),this}removeEdge(e){if(this.graphStore.getEdge(e)===void 0)throw new T("failed to remove nonexistent edge");return this.graphStore.removeEdge(e),this}clear(){return this.graphStore.clear(),this}patchViewportMatrix(e){return this.viewportStore.patchViewportMatrix(e),this}patchContentMatrix(e){return this.viewportStore.patchContentMatrix(e),this}destroy(){this.destroyed||(this.clear(),this.onBeforeDestroyEmitter.emit(),this.graphStore.onAfterNodeAdded.unsubscribe(this.onAfterNodeAdded),this.graphStore.onAfterNodeUpdated.unsubscribe(this.onAfterNodeUpdated),this.graphStore.onAfterNodePriorityUpdated.unsubscribe(this.onAfterNodePriorityUpdated),this.graphStore.onBeforeNodeRemoved.unsubscribe(this.onBeforeNodeRemoved),this.graphStore.onAfterPortUpdated.unsubscribe(this.onAfterPortUpdated),this.graphStore.onBeforePortRemoved.unsubscribe(this.onBeforePortUnmarked),this.graphStore.onAfterEdgeAdded.unsubscribe(this.onAfterEdgeAdded),this.graphStore.onAfterEdgeShapeUpdated.unsubscribe(this.onAfterEdgeShapeUpdated),this.graphStore.onAfterEdgeUpdated.unsubscribe(this.onAfterEdgeUpdated),this.graphStore.onAfterEdgePriorityUpdated.unsubscribe(this.onAfterEdgePriorityUpdated),this.graphStore.onBeforeEdgeRemoved.unsubscribe(this.onBeforeEdgeRemoved),this.graphStore.onBeforeClear.unsubscribe(this.onBeforeClear),this.htmlView.destroy(),this.destroyed=!0)}}class Je{constructor(){o(this,"singleToMultiMap",new Map);o(this,"multiToSingleMap",new Map)}addRecord(e,t){const s=this.singleToMultiMap.get(e);s===void 0?this.singleToMultiMap.set(e,new Set([t])):s.add(t),this.multiToSingleMap.set(t,e)}getMultiBySingle(e){const t=this.singleToMultiMap.get(e)??new Set;return Array.from(t.values())}removeByMulti(e){const t=this.multiToSingleMap.get(e),s=this.singleToMultiMap.get(t);s.delete(e),s.size===0&&this.singleToMultiMap.delete(t),this.multiToSingleMap.delete(e)}getByMulti(e){return this.multiToSingleMap.get(e)}removeBySingle(e){this.singleToMultiMap.get(e).forEach(s=>{this.multiToSingleMap.delete(s)}),this.singleToMultiMap.delete(e)}clear(){this.singleToMultiMap.clear(),this.multiToSingleMap.clear()}forEachSingle(e){this.singleToMultiMap.forEach((t,s)=>{e(s)})}hasSingle(e){return this.singleToMultiMap.get(e)!==void 0}hasMulti(e){return this.multiToSingleMap.get(e)!==void 0}}class le{constructor(){o(this,"nodes",new Map);o(this,"ports",new Map);o(this,"edges",new Map);o(this,"nodesElementsMap",new Map);o(this,"portIncomingEdges",new Map);o(this,"portOutcomingEdges",new Map);o(this,"portCycleEdges",new Map);o(this,"elementPorts",new Je);o(this,"afterNodeAddedEmitter");o(this,"onAfterNodeAdded");o(this,"afterNodeUpdatedEmitter");o(this,"onAfterNodeUpdated");o(this,"afterNodePriorityUpdatedEmitter");o(this,"onAfterNodePriorityUpdated");o(this,"beforeNodeRemovedEmitter");o(this,"onBeforeNodeRemoved");o(this,"afterPortAddedEmitter");o(this,"onAfterPortAdded");o(this,"afterPortUpdatedEmitter");o(this,"onAfterPortUpdated");o(this,"beforePortRemovedEmitter");o(this,"onBeforePortRemoved");o(this,"afterEdgeAddedEmitter");o(this,"onAfterEdgeAdded");o(this,"afterEdgeShapeUpdatedEmitter");o(this,"onAfterEdgeShapeUpdated");o(this,"afterEdgeUpdatedEmitter");o(this,"onAfterEdgeUpdated");o(this,"afterEdgePriorityUpdatedEmitter");o(this,"onAfterEdgePriorityUpdated");o(this,"beforeEdgeRemovedEmitter");o(this,"onBeforeEdgeRemoved");o(this,"beforeClearEmitter");o(this,"onBeforeClear");[this.afterNodeAddedEmitter,this.onAfterNodeAdded]=P(),[this.afterNodeUpdatedEmitter,this.onAfterNodeUpdated]=P(),[this.afterNodePriorityUpdatedEmitter,this.onAfterNodePriorityUpdated]=P(),[this.beforeNodeRemovedEmitter,this.onBeforeNodeRemoved]=P(),[this.afterPortAddedEmitter,this.onAfterPortAdded]=P(),[this.afterPortUpdatedEmitter,this.onAfterPortUpdated]=P(),[this.beforePortRemovedEmitter,this.onBeforePortRemoved]=P(),[this.afterEdgeAddedEmitter,this.onAfterEdgeAdded]=P(),[this.afterEdgeShapeUpdatedEmitter,this.onAfterEdgeShapeUpdated]=P(),[this.afterEdgeUpdatedEmitter,this.onAfterEdgeUpdated]=P(),[this.afterEdgePriorityUpdatedEmitter,this.onAfterEdgePriorityUpdated]=P(),[this.beforeEdgeRemovedEmitter,this.onBeforeEdgeRemoved]=P(),[this.beforeClearEmitter,this.onBeforeClear]=P()}addNode(e){const t=new Map,s={element:e.element,payload:{x:e.x,y:e.y,centerFn:e.centerFn,priority:e.priority},ports:t};this.nodes.set(e.id,s),this.nodesElementsMap.set(e.element,e.id),this.afterNodeAddedEmitter.emit(e.id)}getAllNodeIds(){return Array.from(this.nodes.keys())}getNode(e){return this.nodes.get(e)}getElementNodeId(e){return this.nodesElementsMap.get(e)}updateNode(e,t){const s=this.nodes.get(e).payload;s.x=t.x??s.x,s.y=t.y??s.y,s.centerFn=t.centerFn??s.centerFn,t.priority!==void 0&&(s.priority=t.priority,this.afterNodePriorityUpdatedEmitter.emit(e)),this.afterNodeUpdatedEmitter.emit(e)}removeNode(e){this.beforeNodeRemovedEmitter.emit(e);const t=this.nodes.get(e);this.nodesElementsMap.delete(t.element),this.nodes.delete(e)}addPort(e){this.ports.set(e.id,{element:e.element,payload:{direction:e.direction},nodeId:e.nodeId}),this.elementPorts.addRecord(e.element,e.id),this.portCycleEdges.set(e.id,new Set),this.portIncomingEdges.set(e.id,new Set),this.portOutcomingEdges.set(e.id,new Set),this.nodes.get(e.nodeId).ports.set(e.id,e.element),this.afterPortAddedEmitter.emit(e.id)}getPort(e){return this.ports.get(e)}updatePort(e,t){const s=this.ports.get(e).payload;s.direction=t.direction??s.direction,this.afterPortUpdatedEmitter.emit(e)}getAllPortIds(){return Array.from(this.ports.keys())}getElementPortIds(e){return this.elementPorts.getMultiBySingle(e)}getNodePortIds(e){const t=this.nodes.get(e);if(t!==void 0)return Array.from(t.ports.keys())}removePort(e){const t=this.ports.get(e).nodeId;this.beforePortRemovedEmitter.emit(e),this.nodes.get(t).ports.delete(e),this.ports.delete(e),this.elementPorts.removeByMulti(e)}addEdge(e){this.addEdgeInternal(e),this.afterEdgeAddedEmitter.emit(e.id)}updateEdge(e,t){if(t.from!==void 0||t.to!==void 0){const i=this.edges.get(e),n=i.payload;this.removeEdgeInternal(e),this.addEdgeInternal({id:e,from:t.from??i.from,to:t.to??i.to,shape:n.shape,priority:n.priority})}const s=this.edges.get(e);t.shape!==void 0&&(s.payload.shape=t.shape,this.afterEdgeShapeUpdatedEmitter.emit(e)),t.priority!==void 0&&(s.payload.priority=t.priority,this.afterEdgePriorityUpdatedEmitter.emit(e)),this.afterEdgeUpdatedEmitter.emit(e)}getAllEdgeIds(){return Array.from(this.edges.keys())}getEdge(e){return this.edges.get(e)}removeEdge(e){this.beforeEdgeRemovedEmitter.emit(e),this.removeEdgeInternal(e)}clear(){this.beforeClearEmitter.emit(),this.portIncomingEdges.clear(),this.portOutcomingEdges.clear(),this.portCycleEdges.clear(),this.elementPorts.clear(),this.nodesElementsMap.clear(),this.edges.clear(),this.ports.clear(),this.nodes.clear()}getPortIncomingEdgeIds(e){return Array.from(this.portIncomingEdges.get(e))}getPortOutgoingEdgeIds(e){return Array.from(this.portOutcomingEdges.get(e))}getPortCycleEdgeIds(e){return Array.from(this.portCycleEdges.get(e))}getPortAdjacentEdgeIds(e){return[...this.getPortIncomingEdgeIds(e),...this.getPortOutgoingEdgeIds(e),...this.getPortCycleEdgeIds(e)]}getNodeIncomingEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortIncomingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.from).nodeId!==e}).forEach(n=>{s.push(n)})}),s}getNodeOutgoingEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortOutgoingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId!==e}).forEach(n=>{s.push(n)})}),s}getNodeCycleEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortCycleEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortIncomingEdgeIds(i).filter(n=>{const a=this.getEdge(n);return this.getPort(a.to).nodeId===e}).forEach(n=>{s.push(n)})}),s}getNodeAdjacentEdgeIds(e){const t=Array.from(this.nodes.get(e).ports.keys()),s=[];return t.forEach(i=>{this.getPortIncomingEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortOutgoingEdgeIds(i).forEach(n=>{s.push(n)}),this.getPortCycleEdgeIds(i).forEach(n=>{s.push(n)})}),s}addEdgeInternal(e){this.edges.set(e.id,{from:e.from,to:e.to,payload:{shape:e.shape,priority:e.priority}}),e.from!==e.to?(this.portOutcomingEdges.get(e.from).add(e.id),this.portIncomingEdges.get(e.to).add(e.id)):this.portCycleEdges.get(e.from).add(e.id)}removeEdgeInternal(e){const t=this.edges.get(e),s=t.from,i=t.to;this.portCycleEdges.get(s).delete(e),this.portCycleEdges.get(i).delete(e),this.portIncomingEdges.get(s).delete(e),this.portIncomingEdges.get(i).delete(e),this.portOutcomingEdges.get(s).delete(e),this.portOutcomingEdges.get(i).delete(e),this.edges.delete(e)}}const ge=r=>({scale:1/r.scale,x:-r.x/r.scale,y:-r.y/r.scale}),ue={scale:1,x:0,y:0};class Qe{constructor(){o(this,"viewportMatrix",ue);o(this,"contentMatrix",ue);o(this,"afterUpdateEmitter");o(this,"onAfterUpdated");[this.afterUpdateEmitter,this.onAfterUpdated]=P()}getViewportMatrix(){return this.viewportMatrix}getContentMatrix(){return this.contentMatrix}patchViewportMatrix(e){this.viewportMatrix={scale:e.scale??this.viewportMatrix.scale,x:e.x??this.viewportMatrix.x,y:e.y??this.viewportMatrix.y},this.contentMatrix=ge(this.viewportMatrix),this.afterUpdateEmitter.emit()}patchContentMatrix(e){this.contentMatrix={scale:e.scale??this.contentMatrix.scale,x:e.x??this.contentMatrix.x,y:e.y??this.contentMatrix.y},this.viewportMatrix=ge(this.contentMatrix),this.afterUpdateEmitter.emit()}}class G{constructor(e){o(this,"elementToNodeId",new Map);o(this,"nodesResizeObserver");o(this,"onAfterNodeAdded",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.set(t.element,e),this.nodesResizeObserver.observe(t.element)});o(this,"onBeforeNodeRemoved",e=>{const t=this.canvas.graph.getNode(e);this.elementToNodeId.delete(t.element),this.nodesResizeObserver.unobserve(t.element)});o(this,"onBeforeClear",()=>{this.nodesResizeObserver.disconnect(),this.elementToNodeId.clear()});this.canvas=e,this.nodesResizeObserver=new ResizeObserver(t=>{t.forEach(s=>{const i=s.target;this.handleNodeResize(i)})}),this.canvas.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.canvas.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear)}static configure(e){new G(e)}handleNodeResize(e){const t=this.elementToNodeId.get(e);this.canvas.updateNode(t)}}const qe=(r,e,t)=>{const{x:s,y:i,width:n,height:a}=r.getBoundingClientRect();return e>=s&&e<=s+n&&t>=i&&t<=i+a},_e=(r,e,t)=>e>=0&&e<=r.innerWidth&&t>=0&&t<=r.innerHeight,V=(r,e,t,s)=>qe(e,t,s)&&_e(r,t,s),F=(r,e)=>{e!==null?r.style.cursor=e:r.style.removeProperty("cursor")},O=r=>{const e=document.createElement("div");return{id:r.overlayId,element:e,x:r.portCoords.x,y:r.portCoords.y,ports:[{id:r.overlayId,element:e,direction:r.portDirection}]}},et=(r,e)=>{let t=e,s=null;for(;t!==null&&(s=r.getElementPortIds(t)[0]??null,s===null);)t=t.parentElement;return s},pe=(r,e)=>{const t=document.elementsFromPoint(e.x,e.y);for(const s of t){const i=et(r,s);if(i!==null)return i}return null};var N=(r=>(r.Static="static",r.Dragging="dragging",r.Edge="edge",r))(N||{});const we=(r,e)=>({x:r/2,y:e/2}),u={x:0,y:0},m=(r,e,t)=>({x:e.x*r.x-e.y*r.y+((1-e.x)*t.x+e.y*t.y),y:e.y*r.x+e.x*r.y+((1-e.x)*t.y-e.y*t.x)}),fe=(r,e)=>{const t={x:r.x+r.width/2,y:r.y+r.height/2},s={x:e.x+e.width/2,y:e.y+e.height/2},i=Math.min(t.x,s.x),n=Math.min(t.y,s.y),a=Math.abs(s.x-t.x),h=Math.abs(s.y-t.y),d=t.x<=s.x?1:-1,c=t.y<=s.y?1:-1;return{x:i,y:n,width:a,height:h,flipX:d,flipY:c}},W=(r,e,t,s)=>({x:e*r.x+(1-e)/2*s.x,y:t*r.y+(1-t)/2*s.y});class tt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u),i=m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to),n={x:s.x+this.params.sourceDirection.x*this.params.curvature,y:s.y+this.params.sourceDirection.y*this.params.curvature},a={x:i.x-this.params.targetDirection.x*this.params.curvature,y:i.y-this.params.targetDirection.y*this.params.curvature},h=`M ${s.x} ${s.y} C ${n.x} ${n.y}, ${a.x} ${a.y}, ${i.x} ${i.y}`,d=this.params.hasSourceArrow?"":`M ${u.x} ${u.y} L ${s.x} ${s.y} `,c=this.params.hasTargetArrow?"":` M ${i.x} ${i.y} L ${this.params.to.x} ${this.params.to.y}`;this.path=`${d}${h}${c}`}}class rt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength,n=Math.cos(this.params.detourDirection)*this.params.detourDistance,a=Math.sin(this.params.detourDirection)*this.params.detourDistance,h=n*this.params.flipX,d=a*this.params.flipY,c=m({x:i,y:u.y},this.params.sourceDirection,u),g={x:c.x+h,y:c.y+d},l=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),p={x:l.x+h,y:l.y+d},w={x:(g.x+p.x)/2,y:(g.y+p.y)/2},y={x:c.x+this.params.curvature*this.params.sourceDirection.x,y:c.y+this.params.curvature*this.params.sourceDirection.y},v={x:l.x-this.params.curvature*this.params.targetDirection.x,y:l.y-this.params.curvature*this.params.targetDirection.y},x={x:c.x+h,y:c.y+d},S={x:l.x+h,y:l.y+d};this.path=[`M ${t.x} ${t.y}`,`L ${c.x} ${c.y}`,`C ${y.x} ${y.y} ${x.x} ${x.y} ${w.x} ${w.y}`,`C ${S.x} ${S.y} ${v.x} ${v.y} ${l.x} ${l.y}`,`L ${s.x} ${s.y}`].join(" "),this.midpoint=W(w,e.flipX,e.flipY,e.to)}}const K=Object.freeze({edgeColor:"--edge-color"}),ye=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","svg");return e.style.pointerEvents="none",e.style.position="absolute",e.style.top="0",e.style.left="0",e.style.overflow="visible",e.style.setProperty(K.edgeColor,r),e},me=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke",`var(${K.edgeColor})`),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e},k=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","path");return r.setAttribute("fill",`var(${K.edgeColor})`),r},ve=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.transformOrigin="50% 50%",r},Ee=(r,e)=>{r.style.transform=`translate(${e.x}px, ${e.y}px)`,r.style.width=`${Math.max(e.width,1)}px`,r.style.height=`${Math.max(e.height,1)}px`},L=(r,e)=>{const t=[];if(r.length>0&&t.push(`M ${r[0].x} ${r[0].y}`),r.length===2&&t.push(`L ${r[1].x} ${r[1].y}`),r.length>2){const s=r.length-1;let i=0,n=0,a=0;r.forEach((h,d)=>{let c=0,g=0,l=0;const p=d>0,w=d<s,y=p&&w;if(p&&(c=-i,g=-n,l=a),w){const U=r[d+1];i=U.x-h.x,n=U.y-h.y,a=Math.sqrt(i*i+n*n)}const x=a!==0?Math.min((y?e:0)/a,d<s-1?.5:1):0,S=y?{x:h.x+i*x,y:h.y+n*x}:h,M=l!==0?Math.min((y?e:0)/l,d>1?.5:1):0,C=y?{x:h.x+c*M,y:h.y+g*M}:h;d>0&&t.push(`L ${C.x} ${C.y}`),y&&t.push(`C ${h.x} ${h.y} ${h.x} ${h.y} ${S.x} ${S.y}`)})}return t.join(" ")};class st{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,i=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=m({x:a,y:u.y},this.params.sourceDirection,u),d=m({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.x+d.x)/2,n),g=this.params.to.y/2,l={x:this.params.flipX>0?c:-n,y:h.y},p={x:l.x,y:g},w={x:this.params.flipX>0?this.params.to.x-c:this.params.to.x+n,y:d.y},y={x:w.x,y:g};this.path=L([s,h,l,p,y,w,d,i],this.params.roundness)}}class ot{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=m({x:i,y:u.y},this.params.sourceDirection,u),a=Math.cos(this.params.detourDirection)*this.params.detourDistance,h=Math.sin(this.params.detourDirection)*this.params.detourDistance,d=a*this.params.flipX,c=h*this.params.flipY,g={x:n.x+d,y:n.y+c},l=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),p={x:l.x+d,y:l.y+c},w={x:(g.x+p.x)/2,y:(g.y+p.y)/2};this.midpoint=W(w,e.flipX,e.flipY,e.to),this.path=L([t,n,g,p,l,s],this.params.roundness)}}class it{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,i=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=m({x:n,y:u.y},this.params.sourceDirection,u),h=m({x:this.params.to.x-n,y:this.params.to.y},this.params.targetDirection,this.params.to);this.path=L([s,a,h,i],this.params.roundness)}}class nt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.to;this.midpoint={x:t.x/2,y:t.y/2};const s=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,i=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,n=this.params.arrowLength+this.params.arrowOffset,a=n-this.params.roundness,h=m({x:a,y:u.y},this.params.sourceDirection,u),d=m({x:this.params.to.x-a,y:this.params.to.y},this.params.targetDirection,this.params.to),c=Math.max((h.y+d.y)/2,n),g=this.params.to.x/2,l={x:h.x,y:this.params.flipY>0?c:-n},p={x:g,y:l.y},w={x:d.x,y:this.params.flipY>0?this.params.to.y-c:this.params.to.y+n},y={x:g,y:w.y};this.path=L([s,h,l,p,y,w,d,i],this.params.roundness)}}class Z{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.arrowOffset,s=this.params.side,i=this.params.arrowLength+t,n=i+2*s,h=[{x:this.params.arrowLength,y:u.y},{x:i,y:u.y},{x:i,y:this.params.side},{x:n,y:this.params.side},{x:n,y:-this.params.side},{x:i,y:-this.params.side},{x:i,y:u.y},{x:this.params.arrowLength,y:u.y}].map(c=>m(c,this.params.sourceDirection,u)),d=`M ${u.x} ${u.y} L ${h[0].x} ${h[0].y} `;this.path=`${this.params.hasSourceArrow||this.params.hasTargetArrow?"":d}${L(h,this.params.roundness)}`,this.midpoint={x:(h[3].x+h[4].x)/2,y:(h[3].y+h[4].y)/2}}}class at{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.smallRadius,s=this.params.radius,i=t+s,n=t*s/i,a=Math.sqrt(i*i-t*t),h=a*t/i,d=a+s+this.params.arrowLength,c=this.params.arrowLength+h,l=[{x:this.params.arrowLength,y:u.y},{x:c,y:n},{x:c,y:-n},{x:d,y:0}].map(y=>m(y,this.params.sourceDirection,u)),p=[`M ${l[0].x} ${l[0].y}`,`A ${t} ${t} 0 0 1 ${l[1].x} ${l[1].y}`,`A ${s} ${s} 0 1 0 ${l[2].x} ${l[2].y}`,`A ${t} ${t} 0 0 1 ${l[0].x} ${l[0].y}`].join(" "),w=`M 0 0 L ${l[0].x} ${l[0].y} `;this.path=`${this.params.hasSourceArrow||this.params.hasTargetArrow?"":w}${p}`,this.midpoint=l[3]}}class ht{constructor(e){o(this,"path");o(this,"midpoint");o(this,"diagonalDistance");this.params=e;const t=this.params.to;if(this.midpoint={x:t.x/2,y:t.y/2},this.diagonalDistance=Math.sqrt(this.params.to.x*this.params.to.x+this.params.to.y*this.params.to.y),Math.sqrt(this.params.to.x*this.params.to.x+this.params.to.y*this.params.to.y)===0){this.path="";return}const i=this.createDirectLinePoint({offset:this.params.sourceOffset,hasArrow:this.params.hasSourceArrow,flip:1,shift:u}),n=this.createDirectLinePoint({offset:this.params.targetOffset,hasArrow:this.params.hasTargetArrow,flip:-1,shift:this.params.to});this.path=`M ${i.x} ${i.y} L ${n.x} ${n.y}`}createDirectLinePoint(e){const t=e.hasArrow?this.params.arrowLength:0,s=e.offset+t,i=e.flip*s/this.diagonalDistance;return{x:this.params.to.x*i+e.shift.x,y:this.params.to.y*i+e.shift.y}}}class dt{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=m({x:i,y:u.y},this.params.sourceDirection,u),a=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.y/2,c=d+Math.abs(this.params.detourDistance),g=d+c*this.params.flipY*h,l={x:(n.x+a.x)/2,y:g};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=L([t,n,{x:n.x,y:g},{x:a.x,y:g},a,s],this.params.roundness)}}class ct{constructor(e){o(this,"path");o(this,"midpoint");this.params=e;const t=this.params.hasSourceArrow?m({x:this.params.arrowLength,y:u.y},this.params.sourceDirection,u):u,s=this.params.hasTargetArrow?m({x:this.params.to.x-this.params.arrowLength,y:this.params.to.y},this.params.targetDirection,this.params.to):this.params.to,i=this.params.arrowLength+this.params.arrowOffset,n=m({x:i,y:u.y},this.params.sourceDirection,u),a=m({x:this.params.to.x-i,y:this.params.to.y},this.params.targetDirection,this.params.to),h=this.params.detourDistance>0?1:-1,d=this.params.to.x/2,c=d+Math.abs(this.params.detourDistance),g=d+c*this.params.flipX*h,l={x:g,y:(n.y+a.y)/2};this.midpoint=W(l,e.flipX,e.flipY,e.to),this.path=L([t,n,{x:g,y:n.y},{x:g,y:a.y},a,s],this.params.roundness)}}const f=Object.freeze({color:"#777777",width:1,arrowLength:20,polygonArrowRadius:4,circleArrowRadius:8,wedgeArrowSmallRadius:20,wedgeArrowRadius:100,wedgeArrowAngle:Math.PI/12,arrowOffset:15,hasSourceArrow:!1,hasTargetArrow:!1,cycleRadius:30,cycleSquareSide:30,roundness:10,detourDistance:100,detourDirection:-Math.PI/2,detourDirectionVertical:0,smallCycleRadius:15,curvature:90,interactiveWidth:10,preOffset:0}),Ae=(r,e,t)=>({x:e*Math.cos(r),y:t*Math.sin(r)});class z{constructor(e){o(this,"svg");o(this,"group",ve());o(this,"line");o(this,"sourceArrow",null);o(this,"targetArrow",null);o(this,"onAfterRender");o(this,"afterRenderEmitter");o(this,"arrowRenderer");this.params=e,[this.afterRenderEmitter,this.onAfterRender]=P(),this.arrowRenderer=this.params.arrowRenderer,this.svg=ye(e.color),this.svg.appendChild(this.group),this.line=me(e.width),this.group.appendChild(this.line),e.hasSourceArrow&&(this.sourceArrow=k(),this.group.appendChild(this.sourceArrow)),e.hasTargetArrow&&(this.targetArrow=k(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:s,width:i,height:n,flipX:a,flipY:h}=fe(e.from,e.to);Ee(this.svg,{x:t,y:s,width:i,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d=Ae(e.from.direction,a,h),c=Ae(e.to.direction,a,h),g={x:i,y:n};let l={x:-c.x,y:-c.y},p;e.category===D.PortCycle?(p=this.params.createCyclePath,l=d):e.category===D.NodeCycle?p=this.params.createDetourPath:p=this.params.createLinePath;const w=p(d,c,g,a,h);this.line.setAttribute("d",w.path);let y=null;this.sourceArrow&&(y=this.arrowRenderer({direction:d,shift:u,arrowLength:this.params.arrowLength}),this.sourceArrow.setAttribute("d",y));let v=null;this.targetArrow&&(v=this.arrowRenderer({direction:l,shift:g,arrowLength:this.params.arrowLength}),this.targetArrow.setAttribute("d",v)),this.afterRenderEmitter.emit({edgePath:w,sourceArrowPath:y,targetArrowPath:v})}}const lt=r=>e=>{const s=[u,{x:e.arrowLength,y:r.radius},{x:e.arrowLength,y:-r.radius}].map(h=>m(h,e.direction,u)).map(h=>({x:h.x+e.shift.x,y:h.y+e.shift.y})),i=`M ${s[0].x} ${s[0].y}`,n=`L ${s[1].x} ${s[1].y}`,a=`L ${s[2].x} ${s[2].y}`;return`${i} ${n} ${a} Z`},gt=r=>e=>{const t=r.radius,s=e.arrowLength,i=(s*s+2*s*t)/(2*t),n=i+t,a=s+t-t*(s+t)/n,h=t*i/n,c=[u,{x:a,y:-h},{x:a,y:h}].map(y=>m(y,e.direction,u)).map(y=>({x:y.x+e.shift.x,y:y.y+e.shift.y})),g=`M ${c[0].x} ${c[0].y}`,l=`A ${i} ${i} 0 0 0 ${c[1].x} ${c[1].y}`,p=`A ${t} ${t} 0 0 0 ${c[2].x} ${c[2].y}`,w=`A ${i} ${i} 0 0 0 ${c[0].x} ${c[0].y}`;return`${g} ${l} ${p} ${w}`},ut=r=>e=>{const t=r.smallRadius,s=r.radius,i=m({x:e.arrowLength,y:0},{x:Math.cos(r.angle),y:Math.sin(r.angle)},{x:e.arrowLength+r.smallRadius,y:0}),a=[u,{x:i.x,y:-i.y},i].map(l=>m(l,e.direction,u)).map(l=>({x:l.x+e.shift.x,y:l.y+e.shift.y})),h=`M ${a[0].x} ${a[0].y}`,d=`A ${s} ${s} 0 0 1 ${a[1].x} ${a[1].y}`,c=`A ${t} ${t} 0 0 1 ${a[2].x} ${a[2].y}`,g=`A ${s} ${s} 0 0 1 ${a[0].x} ${a[0].y}`;return`${h} ${d} ${c} ${g}`},I=r=>{if(typeof r=="function")return r;switch(r.type){case"triangle":return lt({radius:r.radius??f.polygonArrowRadius});case"arc":return gt({radius:r.radius??f.circleArrowRadius});default:return ut({smallRadius:r.smallRadius??f.wedgeArrowSmallRadius,angle:r.angle??f.wedgeArrowAngle,radius:r.radius??f.wedgeArrowRadius})}};class xe{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"curvature");o(this,"portCycleRadius");o(this,"portCycleSmallRadius");o(this,"detourDirection");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new at({sourceDirection:e,radius:this.portCycleRadius,smallRadius:this.portCycleSmallRadius,arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new rt({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,detourDirection:this.detourDirection,detourDistance:this.detourDistance,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s)=>new tt({to:s,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,curvature:this.curvature,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.curvature=(e==null?void 0:e.curvature)??f.curvature,this.portCycleRadius=(e==null?void 0:e.cycleRadius)??f.cycleRadius,this.portCycleSmallRadius=(e==null?void 0:e.smallCycleRadius)??f.smallCycleRadius,this.detourDirection=(e==null?void 0:e.detourDirection)??f.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Se{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new dt({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s,i)=>new st({to:s,sourceDirection:e,targetDirection:t,flipX:i,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class Pe{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDirection");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new ot({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDirection:this.detourDirection,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s)=>new it({to:s,sourceDirection:e,targetDirection:t,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDirection=(e==null?void 0:e.detourDirection)??f.detourDirection,this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class be{constructor(e){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"arrowLength");o(this,"arrowOffset");o(this,"roundness");o(this,"cycleSquareSide");o(this,"detourDistance");o(this,"hasSourceArrow");o(this,"hasTargetArrow");o(this,"pathShape");o(this,"createCyclePath",e=>new Z({sourceDirection:e,arrowLength:this.arrowLength,side:this.cycleSquareSide,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createDetourPath",(e,t,s,i,n)=>new ct({to:s,sourceDirection:e,targetDirection:t,flipX:i,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,detourDistance:this.detourDistance,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));o(this,"createLinePath",(e,t,s,i,n)=>new nt({to:s,sourceDirection:e,targetDirection:t,flipY:n,arrowLength:this.arrowLength,arrowOffset:this.arrowOffset,roundness:this.roundness,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow}));this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowOffset=(e==null?void 0:e.arrowOffset)??f.arrowOffset,this.cycleSquareSide=(e==null?void 0:e.cycleSquareSide)??f.cycleSquareSide;const t=(e==null?void 0:e.roundness)??f.roundness;this.roundness=Math.min(t,this.arrowOffset,this.cycleSquareSide/2),this.detourDistance=(e==null?void 0:e.detourDistance)??f.detourDistance,this.hasSourceArrow=(e==null?void 0:e.hasSourceArrow)??f.hasSourceArrow,this.hasTargetArrow=(e==null?void 0:e.hasTargetArrow)??f.hasTargetArrow,this.pathShape=new z({color:(e==null?void 0:e.color)??f.color,width:(e==null?void 0:e.width)??f.width,arrowRenderer:I((e==null?void 0:e.arrowRenderer)??{}),arrowLength:this.arrowLength,hasSourceArrow:this.hasSourceArrow,hasTargetArrow:this.hasTargetArrow,createCyclePath:this.createCyclePath,createDetourPath:this.createDetourPath,createLinePath:this.createLinePath}),this.svg=this.pathShape.svg,this.group=this.pathShape.group,this.line=this.pathShape.line,this.sourceArrow=this.pathShape.sourceArrow,this.targetArrow=this.pathShape.targetArrow,this.onAfterRender=this.pathShape.onAfterRender}render(e){this.pathShape.render(e)}}class J{constructor(e){o(this,"svg");o(this,"group",ve());o(this,"line");o(this,"sourceArrow",null);o(this,"targetArrow",null);o(this,"color");o(this,"width");o(this,"arrowLength");o(this,"sourceOffset");o(this,"targetOffset");o(this,"onAfterRender");o(this,"afterRenderEmitter");o(this,"arrowRenderer");[this.afterRenderEmitter,this.onAfterRender]=P(),this.color=(e==null?void 0:e.color)??f.color,this.width=(e==null?void 0:e.width)??f.width,this.arrowLength=(e==null?void 0:e.arrowLength)??f.arrowLength,this.arrowRenderer=I((e==null?void 0:e.arrowRenderer)??{}),this.sourceOffset=(e==null?void 0:e.sourceOffset)??f.preOffset,this.targetOffset=(e==null?void 0:e.targetOffset)??f.preOffset,this.svg=ye(this.color),this.svg.appendChild(this.group),this.line=me(this.width),this.group.appendChild(this.line),e!=null&&e.hasSourceArrow&&(this.sourceArrow=k(),this.group.appendChild(this.sourceArrow)),e!=null&&e.hasTargetArrow&&(this.targetArrow=k(),this.group.appendChild(this.targetArrow))}render(e){const{x:t,y:s,width:i,height:n,flipX:a,flipY:h}=fe(e.from,e.to);Ee(this.svg,{x:t,y:s,width:i,height:n}),this.group.style.transform=`scale(${a}, ${h})`;const d={x:i,y:n},c=new ht({to:d,sourceOffset:this.sourceOffset,targetOffset:this.targetOffset,hasSourceArrow:this.sourceArrow!==null,hasTargetArrow:this.targetArrow!==null,arrowLength:this.arrowLength});this.line.setAttribute("d",c.path);let g=null,l=null;const p=c.diagonalDistance;if(p===0)this.sourceArrow!==null&&(g="",this.sourceArrow.setAttribute("d",g)),this.targetArrow!==null&&(l="",this.targetArrow.setAttribute("d",l));else{const w={x:d.x/p,y:d.y/p};if(this.sourceArrow){const y={x:w.x*this.sourceOffset,y:w.y*this.sourceOffset};g=this.arrowRenderer({direction:w,shift:y,arrowLength:this.arrowLength}),this.sourceArrow.setAttribute("d",g)}if(this.targetArrow){const y={x:w.x*this.targetOffset,y:w.y*this.targetOffset};l=this.arrowRenderer({direction:{x:-w.x,y:-w.y},shift:{x:d.x-y.x,y:d.y-y.y},arrowLength:this.arrowLength}),this.targetArrow.setAttribute("d",l)}}this.afterRenderEmitter.emit({edgePath:c,sourceArrowPath:g,targetArrowPath:l})}}const pt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","g");return r.style.pointerEvents="auto",r.style.cursor="pointer",r},wt=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke","transparent"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","none"),e.setAttribute("stroke-linecap","round"),e},Te=r=>{const e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("stroke-linejoin","round"),e.setAttribute("stroke-width",`${r}`),e.setAttribute("fill","transparent"),e.setAttribute("stroke","transparent"),e};class De extends Error{constructor(e){super(e),this.name="InteractiveEdgeError"}}class Q{constructor(e,t){o(this,"svg");o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"handle",pt());o(this,"onAfterRender");o(this,"interactiveLine");o(this,"interactiveSourceArrow",null);o(this,"interactiveTargetArrow",null);if(this.baseEdge=e,e instanceof Q)throw new De("interactive edge can be configured only once");this.svg=this.baseEdge.svg,this.group=this.baseEdge.group,this.line=this.baseEdge.line,this.sourceArrow=this.baseEdge.sourceArrow,this.targetArrow=this.baseEdge.targetArrow,this.onAfterRender=this.baseEdge.onAfterRender;const s=(t==null?void 0:t.distance)??f.interactiveWidth;this.interactiveLine=wt(s),this.handle.appendChild(this.interactiveLine),this.sourceArrow&&(this.interactiveSourceArrow=Te(s),this.handle.appendChild(this.interactiveSourceArrow)),this.targetArrow&&(this.interactiveTargetArrow=Te(s),this.handle.appendChild(this.interactiveTargetArrow)),this.group.appendChild(this.handle),this.baseEdge.onAfterRender.subscribe(i=>{this.interactiveLine.setAttribute("d",i.edgePath.path),this.interactiveSourceArrow&&this.interactiveSourceArrow.setAttribute("d",i.sourceArrowPath),this.interactiveTargetArrow&&this.interactiveTargetArrow.setAttribute("d",i.targetArrowPath)})}render(e){this.baseEdge.render(e)}}class ft{constructor(e,t){o(this,"group");o(this,"line");o(this,"sourceArrow");o(this,"targetArrow");o(this,"onAfterRender");o(this,"svg");this.baseShape=e,this.midpointElement=t,this.svg=this.baseShape.svg,this.group=this.baseShape.group,this.line=this.baseShape.line,this.sourceArrow=this.baseShape.sourceArrow,this.targetArrow=this.baseShape.targetArrow,this.onAfterRender=this.baseShape.onAfterRender,this.svg.append(this.midpointElement),this.baseShape.onAfterRender.subscribe(s=>{const i=s.edgePath.midpoint,n=`translate(${i.x}px, ${i.y}px)`;this.midpointElement.style.setProperty("transform",n)})}render(e){this.baseShape.render(e)}}class Ne{constructor(e){o(this,"onAfterNodeAdded");o(this,"onAfterNodeUpdated");o(this,"onAfterNodePriorityUpdated");o(this,"onBeforeNodeRemoved");o(this,"onAfterPortMarked");o(this,"onAfterPortUpdated");o(this,"onBeforePortUnmarked");o(this,"onAfterEdgeAdded");o(this,"onAfterEdgeShapeUpdated");o(this,"onAfterEdgeUpdated");o(this,"onAfterEdgePriorityUpdated");o(this,"onBeforeEdgeRemoved");o(this,"onBeforeClear");this.graphStore=e,this.onAfterNodeAdded=this.graphStore.onAfterNodeAdded,this.onAfterNodeUpdated=this.graphStore.onAfterNodeUpdated,this.onAfterNodePriorityUpdated=this.graphStore.onAfterNodePriorityUpdated,this.onBeforeNodeRemoved=this.graphStore.onBeforeNodeRemoved,this.onAfterPortMarked=this.graphStore.onAfterPortAdded,this.onAfterPortUpdated=this.graphStore.onAfterPortUpdated,this.onBeforePortUnmarked=this.graphStore.onBeforePortRemoved,this.onAfterEdgeAdded=this.graphStore.onAfterEdgeAdded,this.onAfterEdgeShapeUpdated=this.graphStore.onAfterEdgeShapeUpdated,this.onAfterEdgeUpdated=this.graphStore.onAfterEdgeUpdated,this.onAfterEdgePriorityUpdated=this.graphStore.onAfterEdgePriorityUpdated,this.onBeforeEdgeRemoved=this.graphStore.onBeforeEdgeRemoved,this.onBeforeClear=this.graphStore.onBeforeClear}getNode(e){const t=this.graphStore.getNode(e);if(t===void 0)return null;const s=t.payload;return{element:t.element,x:s.x,y:s.y,centerFn:s.centerFn,priority:s.priority}}getElementNodeId(e){return this.graphStore.getElementNodeId(e)??null}getAllNodeIds(){return this.graphStore.getAllNodeIds()}getPort(e){const t=this.graphStore.getPort(e);return t===void 0?null:{element:t.element,direction:t.payload.direction,nodeId:t.nodeId}}getAllPortIds(){return this.graphStore.getAllPortIds()}getNodePortIds(e){return this.graphStore.getNodePortIds(e)??null}getElementPortIds(e){return[...this.graphStore.getElementPortIds(e)]}getAllEdgeIds(){return this.graphStore.getAllEdgeIds()}getEdge(e){const t=this.graphStore.getEdge(e);if(t===void 0)return null;const s=t.payload;return{from:t.from,to:t.to,priority:s.priority,shape:s.shape}}getPortIncomingEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortIncomingEdgeIds(e)}getPortOutgoingEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortOutgoingEdgeIds(e)}getPortCycleEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortCycleEdgeIds(e)}getPortAdjacentEdgeIds(e){return this.graphStore.getPort(e)===void 0?null:this.graphStore.getPortAdjacentEdgeIds(e)}getNodeIncomingEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeIncomingEdgeIds(e)}getNodeOutgoingEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeOutgoingEdgeIds(e)}getNodeCycleEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeCycleEdgeIds(e)}getNodeAdjacentEdgeIds(e){return this.graphStore.getNode(e)===void 0?null:this.graphStore.getNodeAdjacentEdgeIds(e)}}class Me{constructor(e){o(this,"onAfterUpdated");this.viewportStore=e,this.onAfterUpdated=this.viewportStore.onAfterUpdated}getViewportMatrix(){return{...this.viewportStore.getViewportMatrix()}}getContentMatrix(){return{...this.viewportStore.getContentMatrix()}}}const Le=(r,e)=>{const t=new le,s=new Ne(t),i=new Me(e),n=new de(t,e,r),a={nodes:{centerFn:we,priorityFn:()=>0},edges:{shapeFactory:()=>new J,priorityFn:()=>0},ports:{direction:0}};return new ce(s,i,t,e,n,a)};class H{constructor(e,t,s,i){o(this,"onAfterPortMarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.getElementPortIds(t.element).length===1&&this.hookPortEvents(t.element)});o(this,"onBeforePortUnmarked",e=>{const t=this.canvas.graph.getPort(e);this.canvas.graph.getElementPortIds(t.element).length===1&&this.unhookPortEvents(t.element)});o(this,"onPortMouseDown",e=>{if(!this.params.mouseDownEventVerifier(e))return;const t=e.currentTarget,s=this.canvas.graph.getElementPortIds(t)[0];this.params.onPortPointerDown(s,{x:e.clientX,y:e.clientY})&&(e.stopPropagation(),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}))});o(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.stopMouseDrag();return}this.params.onPointerMove({x:e.clientX,y:e.clientY})});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&(this.params.onPointerUp({x:e.clientX,y:e.clientY}),this.stopMouseDrag())});o(this,"onPortTouchStart",e=>{if(e.touches.length!==1)return;const t=e.touches[0],s=e.currentTarget,i=this.canvas.graph.getElementPortIds(s)[0];this.params.onPortPointerDown(i,{x:t.clientX,y:t.clientY})&&(e.stopPropagation(),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}))});o(this,"onWindowTouchMove",e=>{const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.stopTouchDrag();return}this.params.onPointerMove({x:t.clientX,y:t.clientY})});o(this,"onWindowTouchFinish",e=>{const t=e.changedTouches[0];this.params.onPointerUp({x:t.clientX,y:t.clientY}),this.stopTouchDrag()});o(this,"onBeforeClear",()=>{this.canvas.graph.getAllPortIds().forEach(e=>{const t=this.canvas.graph.getPort(e);this.unhookPortEvents(t.element)})});o(this,"onBeforeDestroy",()=>{this.params.onStopDrag(),this.removeWindowMouseListeners(),this.removeWindowTouchListeners()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.canvas.graph.onAfterPortMarked.subscribe(this.onAfterPortMarked),this.canvas.graph.onBeforePortUnmarked.subscribe(this.onBeforePortUnmarked),this.canvas.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new H(e,t,s,i)}hookPortEvents(e){e.addEventListener("mousedown",this.onPortMouseDown,{passive:!0}),e.addEventListener("touchstart",this.onPortTouchStart,{passive:!0})}unhookPortEvents(e){e.removeEventListener("mousedown",this.onPortMouseDown),e.removeEventListener("touchstart",this.onPortTouchStart)}stopMouseDrag(){this.params.onStopDrag(),this.removeWindowMouseListeners()}stopTouchDrag(){this.params.onStopDrag(),this.removeWindowTouchListeners()}removeWindowMouseListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}removeWindowTouchListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}}class q{constructor(e,t,s,i){o(this,"grabbedNode",null);o(this,"maxNodePriority",0);o(this,"graph");o(this,"onAfterNodeAdded",e=>{this.updateMaxNodePriority(e);const t=this.graph.getNode(e);t.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),t.element.addEventListener("touchstart",this.onTouchStart,{passive:!0})});o(this,"onAfterNodeUpdated",e=>{this.updateMaxNodePriority(e)});o(this,"onBeforeNodeRemoved",e=>{const t=this.graph.getNode(e);t.element.removeEventListener("mousedown",this.onMouseDown),t.element.removeEventListener("touchstart",this.onTouchStart)});o(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});o(this,"onBeforeClear",()=>{this.canvas.graph.getAllNodeIds().forEach(e=>{const t=this.canvas.graph.getNode(e);t.element.removeEventListener("mousedown",this.onMouseDown),t.element.removeEventListener("touchstart",this.onTouchStart)}),this.maxNodePriority=0});o(this,"onMouseDown",e=>{if(!this.params.mouseDownEventVerifier(e))return;const t=e.currentTarget,s=this.graph.getElementNodeId(t),i=this.graph.getNode(s);if(!this.params.nodeDragVerifier(s))return;e.stopPropagation();const a=this.calculateContentPoint({x:e.clientX,y:e.clientY});this.grabbedNode={nodeId:s,dx:a.x-i.x,dy:a.y-i.y},F(this.element,this.params.dragCursor),this.moveNodeOnTop(s),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0})});o(this,"onTouchStart",e=>{if(e.touches.length!==1)return;e.stopPropagation();const t=e.touches[0],s=e.currentTarget,i=this.canvas.graph.getElementNodeId(s),n=this.graph.getNode(i);if(!this.params.nodeDragVerifier({nodeId:i,element:n.element,x:n.x,y:n.y}))return;const h=this.calculateContentPoint({x:t.clientX,y:t.clientY});this.grabbedNode={nodeId:i,dx:h.x-n.x,dy:h.y-n.y},this.moveNodeOnTop(i),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0})});o(this,"onWindowMouseMove",e=>{if(!V(this.window,this.element,e.clientX,e.clientY)){this.cancelMouseDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:e.clientX,y:e.clientY})});o(this,"onWindowMouseUp",e=>{this.params.mouseUpEventVerifier(e)&&this.cancelMouseDrag()});o(this,"onWindowTouchMove",e=>{if(e.touches.length!==1)return;const t=e.touches[0];if(!V(this.window,this.element,t.clientX,t.clientY)){this.cancelTouchDrag();return}this.grabbedNode!==null&&this.moveNode(this.grabbedNode,{x:t.clientX,y:t.clientY})});o(this,"onWindowTouchFinish",()=>{this.cancelTouchDrag()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.graph=e.graph,this.graph.onAfterNodeAdded.subscribe(this.onAfterNodeAdded),this.graph.onAfterNodeUpdated.subscribe(this.onAfterNodeUpdated),this.graph.onBeforeNodeRemoved.subscribe(this.onBeforeNodeRemoved),this.graph.onBeforeClear.subscribe(this.onBeforeClear),this.canvas.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new q(e,t,s,i)}moveNode(e,t){if(this.graph.getNode(e.nodeId)===null)return;const i=this.calculateContentPoint(t),n={x:i.x-e.dx,y:i.y-e.dy},a=this.adjustNodeCoords(n);this.canvas.updateNode(e.nodeId,{x:a.x,y:a.y}),this.params.onNodeDrag(e.nodeId)}moveNodeOnTop(e){if(this.params.moveOnTop){if(this.maxNodePriority++,this.params.moveEdgesOnTop){const t=this.maxNodePriority;this.maxNodePriority++,this.graph.getNodeAdjacentEdgeIds(e).forEach(i=>{this.canvas.updateEdge(i,{priority:t})})}this.canvas.updateNode(e,{priority:this.maxNodePriority})}}cancelMouseDrag(){this.grabbedNode!==null&&this.graph.getNode(this.grabbedNode.nodeId)!==null&&this.params.onNodeDragFinished(this.grabbedNode.nodeId),this.grabbedNode=null,F(this.element,null),this.removeMouseDragListeners()}removeMouseDragListeners(){this.window.removeEventListener("mouseup",this.onWindowMouseUp),this.window.removeEventListener("mousemove",this.onWindowMouseMove)}cancelTouchDrag(){if(this.grabbedNode!==null){const e=this.graph.getNode(this.grabbedNode.nodeId);e!==null&&this.params.onNodeDragFinished({nodeId:this.grabbedNode.nodeId,element:e.element,x:e.x,y:e.y})}this.grabbedNode=null,this.removeTouchDragListeners()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}updateMaxNodePriority(e){const t=this.graph.getNode(e).priority;this.maxNodePriority=Math.max(this.maxNodePriority,t)}calculateContentPoint(e){const t=this.element.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.getViewportMatrix();return A(i,s)}adjustNodeCoords(e){const t=this.params.gridSize;if(t!==null){const s=t/2;return{x:Math.floor((e.x+s)/t)*t,y:Math.floor((e.y+s)/t)*t}}return e}}const yt=(r,e,t)=>({scale:r.scale,x:r.x+r.scale*e,y:r.y+r.scale*t}),mt=(r,e,t,s)=>({scale:r.scale*e,x:r.scale*(1-e)*t+r.x,y:r.scale*(1-e)*s+r.y}),X=r=>{const e=[],t=r.touches.length;for(let h=0;h<t;h++)e.push([r.touches[h].clientX,r.touches[h].clientY]);const s=e.reduce((h,d)=>[h[0]+d[0],h[1]+d[1]],[0,0]),i=[s[0]/t,s[1]/t],a=e.map(h=>[h[0]-i[0],h[1]-i[1]]).reduce((h,d)=>h+Math.sqrt(d[0]*d[0]+d[1]*d[1]),0);return{x:i[0],y:i[1],scale:a/t,touchesCnt:t,touches:e}};class Y{constructor(e,t,s,i){o(this,"viewport");o(this,"prevTouches",null);o(this,"wheelFinishTimer",null);o(this,"transformInProgress",!1);o(this,"onBeforeDestroy",()=>{this.removeMouseDragListeners(),this.removeTouchDragListeners()});o(this,"onMouseDown",e=>{this.element===null||!this.params.mouseDownEventVerifier(e)||(F(this.element,this.params.shiftCursor),this.window.addEventListener("mousemove",this.onWindowMouseMove,{passive:!0}),this.window.addEventListener("mouseup",this.onWindowMouseUp,{passive:!0}),this.startRegisteredTransform())});o(this,"onWindowMouseMove",e=>{const t=V(this.window,this.element,e.clientX,e.clientY);if(this.element===null||!t){this.stopMouseDrag();return}const s=-e.movementX,i=-e.movementY;this.moveViewport(s,i)});o(this,"onWindowMouseUp",e=>{this.element===null||!this.params.mouseUpEventVerifier(e)||this.stopMouseDrag()});o(this,"onWheelScroll",e=>{if(!this.params.mouseWheelEventVerifier(e))return;const{left:t,top:s}=this.element.getBoundingClientRect(),i=e.clientX-t,n=e.clientY-s,h=1/(e.deltaY<0?this.params.wheelSensitivity:1/this.params.wheelSensitivity);this.wheelFinishTimer===null&&this.params.onTransformStarted(),this.scaleViewport(h,i,n),this.wheelFinishTimer!==null&&clearTimeout(this.wheelFinishTimer),this.wheelFinishTimer=setTimeout(()=>{this.transformInProgress||this.params.onTransformFinished(),this.wheelFinishTimer=null},this.params.scaleWheelFinishTimeout)});o(this,"onTouchStart",e=>{if(this.prevTouches!==null){this.prevTouches=X(e);return}this.prevTouches=X(e),this.window.addEventListener("touchmove",this.onWindowTouchMove,{passive:!0}),this.window.addEventListener("touchend",this.onWindowTouchFinish,{passive:!0}),this.window.addEventListener("touchcancel",this.onWindowTouchFinish,{passive:!0}),this.startRegisteredTransform()});o(this,"onWindowTouchMove",e=>{const t=X(e);if(!t.touches.every(i=>V(this.window,this.element,i[0],i[1]))){this.stopTouchDrag();return}if((t.touchesCnt===1||t.touchesCnt===2)&&this.moveViewport(-(t.x-this.prevTouches.x),-(t.y-this.prevTouches.y)),t.touchesCnt===2){const{left:i,top:n}=this.element.getBoundingClientRect(),a=this.prevTouches.x-i,h=this.prevTouches.y-n,c=1/(t.scale/this.prevTouches.scale);this.scaleViewport(c,a,h)}this.prevTouches=t});o(this,"onWindowTouchFinish",e=>{e.touches.length>0?this.prevTouches=X(e):this.stopTouchDrag()});o(this,"observer",new ResizeObserver(()=>{const e=this.viewport.getViewportMatrix(),{width:t,height:s}=this.element.getBoundingClientRect(),i=this.params.transformPreprocessor({prevTransform:e,nextTransform:e,canvasWidth:t,canvasHeight:s});this.params.onResizeTransformStarted(),this.canvas.patchViewportMatrix(i),this.params.onResizeTransformFinished()}));o(this,"preventWheelScaleListener",e=>{e.preventDefault()});this.canvas=e,this.element=t,this.window=s,this.params=i,this.element.addEventListener("wheel",this.preventWheelScaleListener,{passive:!1}),this.viewport=e.viewport,this.observer.observe(this.element),this.element.addEventListener("mousedown",this.onMouseDown,{passive:!0}),this.element.addEventListener("wheel",this.onWheelScroll,{passive:!0}),this.element.addEventListener("touchstart",this.onTouchStart,{passive:!0}),e.onBeforeDestroy.subscribe(this.onBeforeDestroy)}static configure(e,t,s,i){new Y(e,t,s,i)}moveViewport(e,t){const s=this.viewport.getViewportMatrix(),i=yt(s,e,t),{width:n,height:a}=this.element.getBoundingClientRect(),h=this.params.transformPreprocessor({prevTransform:s,nextTransform:i,canvasWidth:n,canvasHeight:a});this.performTransform(h)}scaleViewport(e,t,s){const i=this.canvas.viewport.getViewportMatrix(),n=mt(i,e,t,s),{width:a,height:h}=this.element.getBoundingClientRect(),d=this.params.transformPreprocessor({prevTransform:i,nextTransform:n,canvasWidth:a,canvasHeight:h});this.performTransform(d)}stopMouseDrag(){F(this.element,null),this.removeMouseDragListeners(),this.finishRegisteredTransform()}removeMouseDragListeners(){this.window.removeEventListener("mousemove",this.onWindowMouseMove),this.window.removeEventListener("mouseup",this.onWindowMouseUp)}stopTouchDrag(){this.prevTouches=null,this.removeTouchDragListeners(),this.finishRegisteredTransform()}removeTouchDragListeners(){this.window.removeEventListener("touchmove",this.onWindowTouchMove),this.window.removeEventListener("touchend",this.onWindowTouchFinish),this.window.removeEventListener("touchcancel",this.onWindowTouchFinish)}performTransform(e){this.params.onBeforeTransformChange(),this.canvas.patchViewportMatrix(e),this.params.onTransformChange()}startRegisteredTransform(){this.transformInProgress=!0,this.params.onTransformStarted()}finishRegisteredTransform(){this.transformInProgress=!1,this.params.onTransformFinished()}}class _{constructor(e,t,s,i,n,a){o(this,"canvasResizeObserver");o(this,"nodeHorizontal");o(this,"nodeVertical");o(this,"viewport");o(this,"viewportWidth",0);o(this,"viewportHeight",0);o(this,"viewportMatrix");o(this,"loadedArea",{xFrom:1/0,xTo:1/0,yFrom:1/0,yTo:1/0});o(this,"updateLoadedArea",e=>{this.loadedArea={xFrom:e.x,xTo:e.x+e.width,yFrom:e.y,yTo:e.y+e.height}});o(this,"onAfterViewportUpdated",()=>{this.userTransformInProgress||(this.viewportMatrix=this.viewport.getViewportMatrix(),this.loadAreaAroundViewport())});o(this,"userTransformInProgress",!1);this.canvas=e,this.element=t,this.window=s,this.trigger=n,this.params=a,this.nodeHorizontal=this.params.nodeVerticalRadius,this.nodeVertical=this.params.nodeHorizontalRadius,this.canvasResizeObserver=new ResizeObserver(d=>{const c=d[0];this.viewportWidth=c.contentRect.width,this.viewportHeight=c.contentRect.height,this.scheduleLoadAreaAroundViewport()}),this.viewport=e.viewport;const h={...i,onResizeTransformStarted:()=>{this.userTransformInProgress=!0,i.onResizeTransformStarted()},onResizeTransformFinished:()=>{this.userTransformInProgress=!1,i.onResizeTransformFinished()},onBeforeTransformChange:()=>{this.userTransformInProgress=!0,i.onBeforeTransformChange()},onTransformChange:()=>{this.userTransformInProgress=!1;const d=this.viewportMatrix;this.viewportMatrix=this.viewport.getViewportMatrix(),d.scale!==this.viewportMatrix.scale&&this.scheduleEnsureViewportAreaLoaded(),i.onTransformChange()},onTransformFinished:()=>{this.scheduleLoadAreaAroundViewport(),i.onTransformFinished()}};Y.configure(e,this.element,this.window,h),this.viewportMatrix=this.viewport.getViewportMatrix(),this.trigger.subscribe(this.updateLoadedArea),this.canvasResizeObserver.observe(this.element),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterViewportUpdated)}static configure(e,t,s,i,n,a){new _(e,t,s,i,n,a)}scheduleLoadAreaAroundViewport(){setTimeout(()=>{this.loadAreaAroundViewport()})}scheduleEnsureViewportAreaLoaded(){const e=this.viewportWidth*this.viewportMatrix.scale,t=this.viewportHeight*this.viewportMatrix.scale,s=this.viewportMatrix.x-this.nodeHorizontal,i=this.viewportMatrix.y-this.nodeVertical,n=this.viewportMatrix.x+e+this.nodeHorizontal,a=this.viewportMatrix.y+t+this.nodeVertical;this.loadedArea.xFrom<s&&this.loadedArea.xTo>n&&this.loadedArea.yFrom<i&&this.loadedArea.yTo>a||this.scheduleLoadAreaAroundViewport()}loadAreaAroundViewport(){const e=this.viewportWidth*this.viewportMatrix.scale,t=this.viewportHeight*this.viewportMatrix.scale,s=this.viewportMatrix.x-e-this.nodeHorizontal,i=this.viewportMatrix.y-t-this.nodeVertical,n=3*e+2*this.nodeHorizontal,a=3*t+2*this.nodeVertical;this.trigger.emit({x:s,y:i,width:n,height:a})}}const vt=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","svg");return r.style.position="absolute",r.style.inset="0",r},Et=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","rect");return r.setAttribute("fill","url(#pattern)"),r},At=()=>{const r=document.createElementNS("http://www.w3.org/2000/svg","pattern");return r.setAttribute("id","pattern"),r};class ee{constructor(e,t,s){o(this,"svg",vt());o(this,"patternRenderingRectangle",Et());o(this,"pattern",At());o(this,"patternContent");o(this,"tileWidth");o(this,"tileHeight");o(this,"halfTileWidth");o(this,"halfTileHeight");o(this,"maxViewportScale");o(this,"visible",!1);o(this,"resizeObserver",new ResizeObserver(e=>{const t=e[0],{width:s,height:i}=t.contentRect;this.svg.setAttribute("width",`${s}`),this.svg.setAttribute("height",`${i}`),this.patternRenderingRectangle.setAttribute("width",`${s}`),this.patternRenderingRectangle.setAttribute("height",`${i}`);const n=this.tileWidth/s,a=this.tileHeight/i;this.pattern.setAttribute("width",`${n}`),this.pattern.setAttribute("height",`${a}`)}));o(this,"onAfterTransformUpdated",()=>{const e=this.canvas.viewport.getContentMatrix(),t=e.x-this.halfTileWidth*e.scale,s=e.y-this.halfTileHeight*e.scale,i=`matrix(${e.scale}, 0, 0, ${e.scale}, ${t}, ${s})`;this.pattern.setAttribute("patternTransform",i),this.updateVisibility()});this.canvas=e,this.backgroundHost=s,this.tileWidth=t.tileWidth,this.tileHeight=t.tileHeight,this.halfTileWidth=this.tileWidth/2,this.halfTileHeight=this.tileHeight/2,this.patternContent=t.renderer,this.maxViewportScale=t.maxViewportScale;const i=`translate(${this.halfTileWidth}, ${this.halfTileHeight})`;this.patternContent.setAttribute("transform",i),this.pattern.appendChild(this.patternContent);const n=document.createElementNS("http://www.w3.org/2000/svg","defs");n.appendChild(this.pattern),this.svg.appendChild(n),this.svg.appendChild(this.patternRenderingRectangle),this.resizeObserver.observe(this.backgroundHost),this.canvas.viewport.onAfterUpdated.subscribe(this.onAfterTransformUpdated),this.onAfterTransformUpdated()}static configure(e,t,s){new ee(e,t,s)}updateVisibility(){const t=this.canvas.viewport.getViewportMatrix().scale>this.maxViewportScale;t&&this.visible?(this.visible=!1,this.backgroundHost.removeChild(this.svg)):!t&&!this.visible&&(this.visible=!0,this.backgroundHost.appendChild(this.svg))}}class te{constructor(e,t,s,i,n){o(this,"overlayCanvas");o(this,"staticPortId",null);o(this,"isTargetDragging",!0);o(this,"onEdgeCreated",e=>{this.params.onAfterEdgeCreated(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=s,this.window=i,this.params=n,this.overlayCanvas=Le(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>{const d=this.params.connectionTypeResolver(a);return d===null?!1:(this.grabPort(a,h,d),!0)},onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,s,i,n){new te(e,t,s,i,n)}grabPort(e,t,s){const i=this.canvas.graph.getPort(e);this.staticPortId=e;const n=i.element.getBoundingClientRect(),a=n.x+n.width/2,h=n.y+n.height/2,d=this.overlayLayer.getBoundingClientRect(),c=this.canvas.viewport.getViewportMatrix(),g=A(c,{x:a-d.x,y:h-d.y}),l=A(c,{x:t.x-d.x,y:t.y-d.y}),p={overlayId:N.Static,portCoords:g,portDirection:i.direction},w={overlayId:N.Dragging,portCoords:l,portDirection:this.params.dragPortDirection};this.isTargetDragging=s==="direct";const[y,v]=this.isTargetDragging?[p,w]:[w,p];this.overlayCanvas.addNode(O(y)),this.overlayCanvas.addNode(O(v)),this.overlayCanvas.addEdge({from:y.overlayId,to:v.overlayId,shape:this.params.edgeShapeFactory(N.Edge)})}resetDragState(){this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}tryCreateConnection(e){const t=pe(this.canvas.graph,e),s=this.staticPortId;if(t===null){this.params.onEdgeCreationInterrupted({staticPortId:s,isDirect:this.isTargetDragging});return}const i=this.isTargetDragging?s:t,n=this.isTargetDragging?t:s,a={from:i,to:n},h=this.params.connectionPreprocessor(a);h!==null?(this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeCreated),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeCreated)):this.params.onEdgeCreationPrevented(a)}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.getViewportMatrix(),n=A(i,s);this.overlayCanvas.updateNode(N.Dragging,{x:n.x,y:n.y})}}class re{constructor(e,t,s,i,n){o(this,"overlayCanvas");o(this,"staticPortId",null);o(this,"isTargetDragging",!0);o(this,"draggingEdgePayload",null);o(this,"onEdgeReattached",e=>{this.params.onAfterEdgeReattached(e)});this.canvas=e,this.overlayLayer=t,this.viewportStore=s,this.window=i,this.params=n,this.overlayCanvas=Le(this.overlayLayer,this.viewportStore),H.configure(this.canvas,this.overlayLayer,this.window,{mouseDownEventVerifier:this.params.mouseDownEventVerifier,mouseUpEventVerifier:this.params.mouseUpEventVerifier,onStopDrag:()=>{this.resetDragState()},onPortPointerDown:(a,h)=>this.tryStartEdgeDragging(a,h),onPointerMove:a=>{this.moveDraggingPort(a)},onPointerUp:a=>{this.tryCreateConnection(a)}})}static configure(e,t,s,i,n){new re(e,t,s,i,n)}tryStartEdgeDragging(e,t){const s=this.params.draggingEdgeResolver(e);if(s===null)return!1;const i=this.canvas.graph.getEdge(s);if(i===null)return!1;const n=e===i.from,a=e===i.to,h=n?i.to:i.from;this.staticPortId=h,this.isTargetDragging=a;const d=this.canvas.graph.getPort(e),c=this.canvas.graph.getPort(h),g=c.element.getBoundingClientRect(),l={x:g.x+g.width/2,y:g.y+g.height/2},p=this.canvas.viewport.getViewportMatrix(),w=this.overlayLayer.getBoundingClientRect(),y=A(p,{x:l.x-w.x,y:l.y-w.y}),v=A(p,{x:t.x-w.x,y:t.y-w.y});this.draggingEdgePayload={id:s,from:i.from,to:i.to,shape:i.shape,priority:i.priority},this.canvas.removeEdge(s);const x={overlayId:N.Static,portCoords:y,portDirection:c.direction},S={overlayId:N.Dragging,portCoords:v,portDirection:d.direction},[$,M]=this.isTargetDragging?[x,S]:[S,x];this.overlayCanvas.addNode(O($)),this.overlayCanvas.addNode(O(M));const C=this.params.draggingEdgeShapeFactory!==null?this.params.draggingEdgeShapeFactory(N.Edge):i.shape;return this.overlayCanvas.addEdge({id:N.Edge,from:$.overlayId,to:M.overlayId,shape:C}),!0}resetDragState(){this.draggingEdgePayload=null,this.staticPortId=null,this.isTargetDragging=!0,this.overlayCanvas.clear()}moveDraggingPort(e){const t=this.overlayLayer.getBoundingClientRect(),s={x:e.x-t.x,y:e.y-t.y},i=this.canvas.viewport.getViewportMatrix(),n=A(i,s);this.overlayCanvas.updateNode(N.Dragging,{x:n.x,y:n.y})}tryCreateConnection(e){const t=pe(this.canvas.graph,e);if(this.overlayCanvas.removeEdge(N.Edge),t===null){const d=this.draggingEdgePayload;this.params.onEdgeReattachInterrupted({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority});return}const[s,i]=this.isTargetDragging?[this.staticPortId,t]:[t,this.staticPortId],n=this.draggingEdgePayload,a={id:n.id,from:s,to:i,shape:n.shape,priority:n.priority},h=this.params.connectionPreprocessor(a);if(h!==null)this.canvas.graph.onAfterEdgeAdded.subscribe(this.onEdgeReattached),this.canvas.addEdge(h),this.canvas.graph.onAfterEdgeAdded.unsubscribe(this.onEdgeReattached);else{const d=this.draggingEdgePayload;this.params.onEdgeReattachPrevented({id:d.id,from:d.from,to:d.to,shape:d.shape,priority:d.priority})}}}class se{constructor(e,t,s){this.canvas=e,this.layoutAlgorithm=t,this.trigger=s,this.trigger.subscribe(()=>{this.applyLayout()})}static configure(e,t,s){new se(e,t,s)}applyLayout(){this.layoutAlgorithm.calculateCoordinates(this.canvas.graph).forEach((t,s)=>{this.canvas.updateNode(s,t)})}}class oe{constructor(e,t){o(this,"applyScheduled",!1);this.canvas=e,this.layoutAlgorithm=t,this.canvas.graph.onAfterNodeAdded.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onBeforeNodeRemoved.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onAfterEdgeAdded.subscribe(()=>{this.scheduleApply()}),this.canvas.graph.onBeforeEdgeRemoved.subscribe(()=>{this.scheduleApply()})}static configure(e,t){new oe(e,t)}scheduleApply(){this.applyScheduled||(this.applyScheduled=!0,setTimeout(()=>{this.applyScheduled=!1,this.applyLayout()}))}applyLayout(){this.layoutAlgorithm.calculateCoordinates(this.canvas.graph).forEach((t,s)=>{this.canvas.updateNode(s,t)})}}class xt{static configure(e,t){const s=t.applyOn;switch(s.type){case"manual":{se.configure(e,t.algorithm,s.trigger);break}case"topologyChangeTimeout":{oe.configure(e,t.algorithm);break}}}}class St{constructor(e,t){o(this,"previousTimeStamp");o(this,"step",e=>{if(this.previousTimeStamp===void 0)this.previousTimeStamp=e;else{const t=(e-this.previousTimeStamp)/1e3;this.previousTimeStamp=e,this.callback(t)}this.win.requestAnimationFrame(this.step)});this.win=e,this.callback=t,this.win.requestAnimationFrame(this.step)}}class ie{constructor(e,t,s,i){o(this,"step",e=>{this.algorithm.calculateNextCoordinates(this.canvas.graph,e).forEach((s,i)=>{this.staticNodes.has(i)||this.canvas.updateNode(i,{x:s.x,y:s.y})})});this.canvas=e,this.algorithm=t,this.staticNodes=s,this.win=i,new St(this.win,this.step)}static configure(e,t,s,i){new ie(e,t,s,i)}}const Pt=()=>{const r=document.createElement("div");return r.style.width="100%",r.style.height="100%",r.style.position="relative",r},ne=()=>{const r=document.createElement("div");return r.style.position="absolute",r.style.inset="0",r},Ce=()=>{const r=ne();return r.style.pointerEvents="none",r};class bt{constructor(e){o(this,"background",ne());o(this,"main",ne());o(this,"overlayConnectablePorts",Ce());o(this,"overlayDraggableEdges",Ce());o(this,"host",Pt());this.element=e,this.element.appendChild(this.host),this.host.appendChild(this.background),this.host.appendChild(this.main),this.host.appendChild(this.overlayConnectablePorts),this.host.appendChild(this.overlayDraggableEdges)}destroy(){this.host.removeChild(this.background),this.host.removeChild(this.main),this.host.removeChild(this.overlayConnectablePorts),this.host.removeChild(this.overlayDraggableEdges),this.element.removeChild(this.host)}}const ae=r=>()=>r,Re=ae(0),Tt=()=>{let r=0;return()=>r++},Dt=(r,e)=>{let t=Re,s=Re;const i=Tt();return r==="incremental"&&(t=i),e==="incremental"&&(s=i),typeof r=="number"&&(t=ae(r)),typeof e=="number"&&(s=ae(e)),typeof r=="function"&&(t=r),typeof e=="function"&&(s=e),{nodesPriorityFn:t,edgesPriorityFn:s}},he=r=>{if(typeof r=="function")return r;switch(r.type){case"straight":return()=>new Pe({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance,detourDirection:r.detourDirection});case"horizontal":return()=>new Se({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"vertical":return()=>new be({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowOffset:r.arrowOffset,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleSquareSide:r.cycleSquareSide,roundness:r.roundness,detourDistance:r.detourDistance});case"direct":return()=>new J({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,sourceOffset:r.sourceOffset,targetOffset:r.targetOffset});default:return()=>new xe({color:r.color,width:r.width,arrowLength:r.arrowLength,arrowRenderer:r.arrowRenderer,hasSourceArrow:r.hasSourceArrow,hasTargetArrow:r.hasTargetArrow,cycleRadius:r.cycleRadius,smallCycleRadius:r.smallCycleRadius,curvature:r.curvature,detourDistance:r.detourDistance,detourDirection:r.detourDirection})}},Nt=r=>{var t,s,i,n,a;const e=Dt((t=r.nodes)==null?void 0:t.priority,(s=r.edges)==null?void 0:s.priority);return{nodes:{centerFn:((i=r.nodes)==null?void 0:i.centerFn)??we,priorityFn:e.nodesPriorityFn},ports:{direction:((n=r.ports)==null?void 0:n.direction)??0},edges:{shapeFactory:he(((a=r.edges)==null?void 0:a.shape)??{}),priorityFn:e.edgesPriorityFn}}},Mt=r=>{var p,w,y,v,x;const e=((p=r.events)==null?void 0:p.onNodeDrag)??(()=>{}),t=r.nodeDragVerifier??(()=>!0),s=((w=r.events)==null?void 0:w.onNodeDragFinished)??(()=>{}),i=r.moveOnTop!==!1,n=r.moveEdgesOnTop!==!1&&i,a=(y=r.mouse)==null?void 0:y.dragCursor,h=a!==void 0?a:"grab",d=(v=r.mouse)==null?void 0:v.mouseDownEventVerifier,c=d!==void 0?d:S=>S.button===0,g=(x=r.mouse)==null?void 0:x.mouseUpEventVerifier,l=g!==void 0?g:S=>S.button===0;return{moveOnTop:i,moveEdgesOnTop:n,dragCursor:h,gridSize:r.gridSize??null,mouseDownEventVerifier:c,mouseUpEventVerifier:l,onNodeDrag:e,nodeDragVerifier:t,onNodeDragFinished:s}},Lt=r=>{const e=r.minX!==null?r.minX:-1/0,t=r.maxX!==null?r.maxX:1/0,s=r.minY!==null?r.minY:-1/0,i=r.maxY!==null?r.maxY:1/0;return n=>{let a=n.nextTransform.x,h=n.nextTransform.y;a<e&&a<n.prevTransform.x&&(a=Math.min(n.prevTransform.x,e));const d=n.canvasWidth*n.prevTransform.scale,c=t-d;a>c&&a>n.prevTransform.x&&(a=Math.max(n.prevTransform.x,c)),h<s&&h<n.prevTransform.y&&(h=Math.min(n.prevTransform.y,s));const g=n.canvasHeight*n.prevTransform.scale,l=i-g;return h>l&&h>n.prevTransform.y&&(h=Math.max(n.prevTransform.y,l)),{scale:n.nextTransform.scale,x:a,y:h}}},Ct=r=>{const e=r.maxContentScale,t=r.minContentScale,s=e!==null?1/e:0,i=t!==null?1/t:1/0;return n=>{const a=n.prevTransform,h=n.nextTransform;let d=h.scale,c=h.x,g=h.y;if(h.scale>i&&h.scale>a.scale){d=Math.max(a.scale,i),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*l,g=a.y+(h.y-a.y)*l}if(h.scale<s&&h.scale<a.scale){d=Math.min(a.scale,s),c=a.x,g=a.y;const l=(d-a.scale)/(h.scale-a.scale);c=a.x+(h.x-a.x)*l,g=a.y+(h.y-a.y)*l}return{scale:d,x:c,y:g}}},Rt=r=>e=>r.reduce((t,s)=>s({prevTransform:e.prevTransform,nextTransform:t,canvasWidth:e.canvasWidth,canvasHeight:e.canvasHeight}),e.nextTransform),Ve=r=>{if(typeof r=="function")return r;switch(r.type){case"scale-limit":return Ct({minContentScale:r.minContentScale??0,maxContentScale:r.maxContentScale??1/0});case"shift-limit":return Lt({minX:r.minX??-1/0,maxX:r.maxX??1/0,minY:r.minY??-1/0,maxY:r.maxY??1/0})}},$e=r=>{var y,v,x,S,$,M,C,U,We,ke,ze,He;const e=(y=r==null?void 0:r.scale)==null?void 0:y.mouseWheelSensitivity,t=e!==void 0?e:1.2,s=r==null?void 0:r.transformPreprocessor;let i;s!==void 0?Array.isArray(s)?i=Rt(s.map(R=>Ve(R))):i=Ve(s):i=R=>R.nextTransform;const n=((v=r==null?void 0:r.shift)==null?void 0:v.cursor)!==void 0?r.shift.cursor:"grab",a=((x=r==null?void 0:r.events)==null?void 0:x.onBeforeTransformChange)??(()=>{}),h=((S=r==null?void 0:r.events)==null?void 0:S.onTransformChange)??(()=>{}),d=($=r==null?void 0:r.shift)==null?void 0:$.mouseDownEventVerifier,c=d!==void 0?d:R=>R.button===0,g=(M=r==null?void 0:r.shift)==null?void 0:M.mouseUpEventVerifier,l=g!==void 0?g:R=>R.button===0,p=(C=r==null?void 0:r.scale)==null?void 0:C.mouseWheelEventVerifier,w=p!==void 0?p:()=>!0;return{wheelSensitivity:t,onTransformStarted:((U=r==null?void 0:r.events)==null?void 0:U.onTransformStarted)??(()=>{}),onTransformFinished:((We=r==null?void 0:r.events)==null?void 0:We.onTransformFinished)??(()=>{}),onBeforeTransformChange:a,onTransformChange:h,transformPreprocessor:i,shiftCursor:n,mouseDownEventVerifier:c,mouseUpEventVerifier:l,mouseWheelEventVerifier:w,scaleWheelFinishTimeout:((ke=r==null?void 0:r.scale)==null?void 0:ke.wheelFinishTimeout)??500,onResizeTransformStarted:((ze=r==null?void 0:r.events)==null?void 0:ze.onResizeTransformStarted)??(()=>{}),onResizeTransformFinished:((He=r==null?void 0:r.events)==null?void 0:He.onResizeTransformFinished)??(()=>{})}},Vt=(r,e)=>{const t=document.createElementNS("http://www.w3.org/2000/svg","circle");return t.setAttribute("cx","0"),t.setAttribute("cy","0"),t.setAttribute("r",`${r}`),t.setAttribute("fill",`${e}`),t},$t=r=>r instanceof SVGElement?r:Vt((r==null?void 0:r.radius)??1.5,(r==null?void 0:r.color)??"#d8d8d8"),It=r=>{const e=r.tileDimensions,t=(e==null?void 0:e.width)??25,s=(e==null?void 0:e.height)??25,i=$t(r.renderer??{});return{tileWidth:t,tileHeight:s,renderer:i,maxViewportScale:r.maxViewportScale??10}},Ut=(r,e,t)=>{var c,g,l;const s=()=>"direct",i=p=>p,n=p=>p.button===0,a=()=>{},h=()=>{},d=()=>{};return{connectionTypeResolver:r.connectionTypeResolver??s,connectionPreprocessor:r.connectionPreprocessor??i,mouseDownEventVerifier:r.mouseDownEventVerifier??n,mouseUpEventVerifier:r.mouseUpEventVerifier??n,onAfterEdgeCreated:((c=r.events)==null?void 0:c.onAfterEdgeCreated)??a,onEdgeCreationInterrupted:((g=r.events)==null?void 0:g.onEdgeCreationInterrupted)??d,onEdgeCreationPrevented:((l=r.events)==null?void 0:l.onEdgeCreationPrevented)??h,dragPortDirection:r.dragPortDirection??t,edgeShapeFactory:r.edgeShape!==void 0?he(r.edgeShape):e}},Bt=(r,e)=>{var c,g,l;const t=p=>p,s=p=>p.button===0&&p.ctrlKey,i=p=>p.button===0,n=p=>{const w=e.getPortAdjacentEdgeIds(p);return w.length>0?w[w.length-1]:null},a=()=>{},h=()=>{},d=()=>{};return{connectionPreprocessor:r.connectionPreprocessor??t,mouseDownEventVerifier:r.mouseDownEventVerifier??s,mouseUpEventVerifier:r.mouseUpEventVerifier??i,draggingEdgeResolver:r.draggingEdgeResolver??n,draggingEdgeShapeFactory:r.draggingEdgeShape!==void 0?he(r.draggingEdgeShape):null,onAfterEdgeReattached:((c=r.events)==null?void 0:c.onAfterEdgeReattached)??a,onEdgeReattachInterrupted:((g=r.events)==null?void 0:g.onEdgeReattachInterrupted)??d,onEdgeReattachPrevented:((l=r.events)==null?void 0:l.onEdgeReattachPrevented)??h}},Ft=r=>({nodeVerticalRadius:r.nodeContainingRadius.vertical,nodeHorizontalRadius:r.nodeContainingRadius.horizontal}),Ot=r=>{var e,t;return{onAfterNodeDetached:((e=r==null?void 0:r.events)==null?void 0:e.onAfterNodeDetached)??(()=>{}),onBeforeNodeAttached:((t=r==null?void 0:r.events)==null?void 0:t.onBeforeNodeAttached)??(()=>{})}};class Ie extends Error{constructor(){super(...arguments);o(this,"name","CanvasBuilderError")}}class Wt{constructor(e,t){this.coordinates=e,this.rand=t}getVector(e,t){const s=this.coordinates.get(e),i=this.coordinates.get(t),n=i.x-s.x,a=i.y-s.y,h=n*n+a*a;if(h===0){const l=this.rand()*2*Math.PI;return{ex:Math.cos(l),ey:Math.sin(l),d2:1,d:1}}const d=Math.sqrt(h),c=n/d,g=a/d;return{ex:c,ey:g,d2:h,d}}}class Ue{constructor(e,t,s){o(this,"dtSec");o(this,"k");o(this,"nodeMass");o(this,"edgeEquilibriumLength");o(this,"edgeStiffness");o(this,"effectiveDistance");this.graph=e,this.currentCoords=t,this.params=s,this.dtSec=this.params.dtSec,this.k=this.params.nodeCharge*this.params.nodeCharge,this.nodeMass=this.params.nodeMass,this.edgeEquilibriumLength=this.params.edgeEquilibriumLength,this.edgeStiffness=this.params.edgeStiffness,this.effectiveDistance=this.params.effectiveDistance}next(){let e=0;const t=new Map,s=this.graph.getAllNodeIds();s.forEach(a=>{t.set(a,{x:0,y:0})});const i=new Wt(this.currentCoords,this.params.rand),n=s.length;for(let a=0;a<n;a++){const h=s[a];for(let d=a+1;d<n;d++){const c=s[d],g=i.getVector(h,c);if(g.d>this.effectiveDistance)continue;const l=this.k/g.d2,p=l*g.ex,w=l*g.ey,y=p/2,v=w/2,x=t.get(h),S=t.get(c);x.x-=y,x.y-=v,S.x+=y,S.y+=v}}return this.graph.getAllEdgeIds().forEach(a=>{const h=this.graph.getEdge(a),d=this.graph.getPort(h.from),c=this.graph.getPort(h.to),g=i.getVector(d.nodeId,c.nodeId),p=(g.d-this.edgeEquilibriumLength)*this.edgeStiffness/2,w=g.ex*p,y=g.ey*p,v=t.get(d.nodeId),x=t.get(c.nodeId);v.x+=w,v.y+=y,x.x-=w,x.y-=y}),this.currentCoords.forEach((a,h)=>{const d=t.get(h),c={x:d.x/this.nodeMass*this.dtSec,y:d.y/this.nodeMass*this.dtSec},g=c.x*this.dtSec,l=c.y*this.dtSec;a.x+=g,a.y+=l,e=Math.max(e,Math.sqrt(g*g+l*l))}),e}}const Be=(r,e,t)=>{const s=new Map,i=r.getAllNodeIds(),n=Math.sqrt(i.length)*t;return i.forEach(a=>{const h=r.getNode(a);s.set(a,{x:h.x??n*e(),y:h.y??n*e()})}),s};class kt{constructor(e){this.params=e}calculateCoordinates(e){const t=Be(e,this.params.rand,this.params.edgeEquilibriumLength);for(let s=0;s<this.params.maxIterations&&!(new Ue(e,t,{rand:this.params.rand,dtSec:this.params.dtSec,nodeMass:this.params.nodeMass,nodeCharge:this.params.nodeCharge,edgeEquilibriumLength:this.params.edgeEquilibriumLength,effectiveDistance:this.params.effectiveDistance,edgeStiffness:this.params.edgeStiffness}).next()<this.params.convergenceDelta);s++);return t}}class zt{constructor(e){this.params=e}calculateNextCoordinates(e,t){const s=Be(e,this.params.rand,this.params.edgeEquilibriumLength);return new Ue(e,s,{rand:this.params.rand,dtSec:Math.min(t,this.params.maxTimeDeltaSec),nodeMass:this.params.nodeMass,nodeCharge:this.params.nodeCharge,edgeEquilibriumLength:this.params.edgeEquilibriumLength,effectiveDistance:this.params.effectiveDistance,edgeStiffness:this.params.edgeStiffness}).next()<this.params.convergenceDelta&&!e.getAllNodeIds().some(h=>{const d=e.getNode(h);return d.x===null||d.y===null})?new Map:s}}const Fe=r=>{let e=1779033703,t=3144134277,s=1013904242,i=2773480762;for(let n=0,a;n<r.length;n++)a=r.charCodeAt(n),e=t^Math.imul(e^a,597399067),t=s^Math.imul(t^a,2869860233),s=i^Math.imul(s^a,951274213),i=e^Math.imul(i^a,2716044179);return e=Math.imul(s^e>>>18,597399067),t=Math.imul(i^t>>>22,2869860233),s=Math.imul(e^s>>>17,951274213),i=Math.imul(t^i>>>19,2716044179),e^=t^s^i,t^=e,s^=e,i^=e,[e>>>0,t>>>0,s>>>0,i>>>0]},Oe=(r,e,t,s)=>function(){r|=0,e|=0,t|=0,s|=0;const i=(r+e|0)+s|0;return s=s+1|0,r=e^e>>>9,e=t+(t<<3)|0,t=t<<21|t>>>11,t=t+i|0,(i>>>0)/4294967296},b=Object.freeze({seed:"HTMLGraph is awesome",maxTimeDeltaSec:.1,nodeCharge:1e5,nodeMass:1,edgeEquilibriumLength:300,edgeStiffness:1e3,effectiveDistance:1e3,dtSec:.02,maxIterations:100,convergenceDelta:.001}),Ht=r=>{var e;switch((e=r==null?void 0:r.algorithm)==null?void 0:e.type){case"custom":return r.algorithm.instance;default:{const t=r==null?void 0:r.algorithm,s=Fe((t==null?void 0:t.seed)??b.seed),i=Oe(s[0],s[1],s[2],s[3]);return new zt({rand:i,maxTimeDeltaSec:(t==null?void 0:t.maxTimeDeltaSec)??b.maxTimeDeltaSec,nodeCharge:(t==null?void 0:t.nodeCharge)??b.nodeCharge,nodeMass:(t==null?void 0:t.nodeMass)??b.nodeMass,edgeEquilibriumLength:(t==null?void 0:t.edgeEquilibriumLength)??b.edgeEquilibriumLength,effectiveDistance:b.effectiveDistance,edgeStiffness:(t==null?void 0:t.edgeStiffness)??b.edgeStiffness,convergenceDelta:(t==null?void 0:t.convergenceDelta)??b.convergenceDelta})}}},Xt=r=>r instanceof B?{type:"manual",trigger:r}:{type:"topologyChangeTimeout"},Yt=r=>{switch(r==null?void 0:r.type){case"custom":return r.instance;default:{const e=Fe((r==null?void 0:r.seed)??b.seed),t=Oe(e[0],e[1],e[2],e[3]);return new kt({dtSec:(r==null?void 0:r.dtSec)??b.dtSec,maxIterations:(r==null?void 0:r.maxIterations)??b.maxIterations,rand:t,nodeCharge:(r==null?void 0:r.nodeCharge)??b.nodeCharge,nodeMass:(r==null?void 0:r.nodeMass)??b.nodeMass,edgeEquilibriumLength:(r==null?void 0:r.edgeEquilibriumLength)??b.edgeEquilibriumLength,edgeStiffness:(r==null?void 0:r.edgeStiffness)??b.edgeStiffness,effectiveDistance:(r==null?void 0:r.effectiveDistance)??b.effectiveDistance,convergenceDelta:(r==null?void 0:r.convergenceDelta)??b.convergenceDelta})}}},jt=r=>({algorithm:Yt(r==null?void 0:r.algorithm),applyOn:Xt(r==null?void 0:r.applyOn)}),Gt=(r,e)=>({...r,nodeDragVerifier:t=>(e.add(t),r.nodeDragVerifier(t)),onNodeDragFinished:t=>{e.delete(t),r.onNodeDragFinished(t)}}),Kt=(r,e)=>{r.onBeforeNodeRemoved.subscribe(t=>{e.delete(t)}),r.onBeforeClear.subscribe(()=>{e.clear()})};class Zt{constructor(e){o(this,"used",!1);o(this,"canvasDefaults",{});o(this,"dragConfig",{});o(this,"transformConfig",{});o(this,"backgroundConfig",{});o(this,"connectablePortsConfig",{});o(this,"draggableEdgesConfig",{});o(this,"virtualScrollConfig");o(this,"layoutConfig");o(this,"animatedLayoutConfig");o(this,"hasDraggableNodes",!1);o(this,"hasTransformableViewport",!1);o(this,"hasNodeResizeReactiveEdges",!1);o(this,"hasBackground",!1);o(this,"hasUserConnectablePorts",!1);o(this,"hasUserDraggableEdges",!1);o(this,"hasAnimatedLayout",!1);o(this,"hasLayout",!1);o(this,"boxRenderingTrigger",new B);o(this,"graphStore",new le);o(this,"viewportStore",new Qe);o(this,"graph",new Ne(this.graphStore));o(this,"viewport",new Me(this.viewportStore));o(this,"window",window);o(this,"animationStaticNodes",new Set);this.element=e}setDefaults(e){return this.canvasDefaults=e,this}enableUserDraggableNodes(e){return this.hasDraggableNodes=!0,this.dragConfig=e??{},this}enableUserTransformableViewport(e){return this.hasTransformableViewport=!0,this.transformConfig=e??{},this}enableNodeResizeReactiveEdges(){return this.hasNodeResizeReactiveEdges=!0,this}enableVirtualScroll(e){return this.virtualScrollConfig=e,this}enableBackground(e){return this.hasBackground=!0,this.backgroundConfig=e??{},this}enableUserConnectablePorts(e){return this.hasUserConnectablePorts=!0,this.connectablePortsConfig=e??{},this}enableUserDraggableEdges(e){return this.hasUserDraggableEdges=!0,this.draggableEdgesConfig=e??{},this}enableLayout(e){return this.layoutConfig=e,this.hasLayout=!0,this.hasAnimatedLayout=!1,this}enableAnimatedLayout(e){return this.animatedLayoutConfig=e,this.hasAnimatedLayout=!0,this.hasLayout=!1,this}build(){if(this.used)throw new Ie("CanvasBuilder is a single use object");this.used=!0;const e=new bt(this.element);let t=new de(this.graphStore,this.viewportStore,e.main);this.virtualScrollConfig!==void 0&&(t=new Ke(t,this.graphStore,this.boxRenderingTrigger,Ot(this.virtualScrollConfig))),t=new Ze(t,this.graphStore);const s=Nt(this.canvasDefaults),i=new ce(this.graph,this.viewport,this.graphStore,this.viewportStore,t,s);if(this.hasBackground&&ee.configure(i,It(this.backgroundConfig),e.background),this.hasNodeResizeReactiveEdges&&G.configure(i),this.hasDraggableNodes){let a=Mt(this.dragConfig);this.hasAnimatedLayout&&(a=Gt(a,this.animationStaticNodes)),q.configure(i,e.main,this.window,a)}if(this.hasUserConnectablePorts){const a=Ut(this.connectablePortsConfig,s.edges.shapeFactory,s.ports.direction);te.configure(i,e.overlayConnectablePorts,this.viewportStore,this.window,a)}if(this.hasUserDraggableEdges){const a=Bt(this.draggableEdgesConfig,i.graph);re.configure(i,e.overlayDraggableEdges,this.viewportStore,this.window,a)}this.virtualScrollConfig!==void 0?_.configure(i,e.main,this.window,$e(this.transformConfig),this.boxRenderingTrigger,Ft(this.virtualScrollConfig)):this.hasTransformableViewport&&Y.configure(i,e.main,this.window,$e(this.transformConfig)),this.hasLayout&&xt.configure(i,jt(this.layoutConfig)),this.hasAnimatedLayout&&(Kt(i.graph,this.animationStaticNodes),ie.configure(i,Ht(this.animatedLayoutConfig),this.animationStaticNodes,this.window));const n=()=>{e.destroy(),i.onBeforeDestroy.unsubscribe(n)};return i.onBeforeDestroy.subscribe(n),i}}E.BezierEdgeShape=xe,E.CanvasBuilder=Zt,E.CanvasBuilderError=Ie,E.CanvasError=T,E.DirectEdgeShape=J,E.EventSubject=B,E.HorizontalEdgeShape=Se,E.InteractiveEdgeError=De,E.InteractiveEdgeShape=Q,E.MidpointEdgeShape=ft,E.StraightEdgeShape=Pe,E.VerticalEdgeShape=be,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@html-graph/html-graph",
3
3
  "author": "Dmitry Marov <d.marov94@gmail.com>",
4
4
  "private": false,
5
- "version": "7.0.0",
5
+ "version": "7.0.1",
6
6
  "type": "module",
7
7
  "main": "dist/html-graph.js",
8
8
  "types": "dist/html-graph.d.ts",