@metadev/daga-react 4.2.13 → 4.2.14

package/index.mjs

@@ -1,9 +1,9 @@
-import { jsx as v, jsxs as M, Fragment as ao } from "react/jsx-runtime";
+import { jsx as v, jsxs as T, Fragment as ho } from "react/jsx-runtime";
 import * as x from "d3";
-import { debounceTime as lo, Subject as jt, merge as co, map as ho } from "rxjs";
-import { createContext as He, useState as U, useContext as Ut, useRef as rt, useEffect as Ct, useMemo as go } from "react";
-var g = /* @__PURE__ */ ((s) => (s.Bottom = "bottom", s.Left = "left", s.Right = "right", s.Top = "top", s))(g || {}), Zt = /* @__PURE__ */ ((s) => (s.BottomLeft = "bottom-left", s.BottomRight = "bottom-right", s.TopLeft = "top-left", s.TopRight = "top-right", s))(Zt || {}), Lt = /* @__PURE__ */ ((s) => (s.Left = "left", s.Center = "center", s.Right = "right", s))(Lt || {}), qt = /* @__PURE__ */ ((s) => (s.Top = "top", s.Center = "center", s.Bottom = "bottom", s))(qt || {});
-const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e ? t <= s && s <= e : e <= s && s <= t, Ie = (s, t, e) => (s - t[0]) / (t[1] - t[0]) * (e[1] - e[0]) + e[0], Jt = (s, t, e, a, l, r, i) => {
+import { debounceTime as go, Subject as Wt, merge as fo, map as uo } from "rxjs";
+import { createContext as Fe, useState as D, useContext as Dt, useRef as rt, useEffect as Ct, useMemo as po } from "react";
+var g = /* @__PURE__ */ ((s) => (s.Bottom = "bottom", s.Left = "left", s.Right = "right", s.Top = "top", s))(g || {}), Kt = /* @__PURE__ */ ((s) => (s.BottomLeft = "bottom-left", s.BottomRight = "bottom-right", s.TopLeft = "top-left", s.TopRight = "top-right", s))(Kt || {}), Lt = /* @__PURE__ */ ((s) => (s.Left = "left", s.Center = "center", s.Right = "right", s))(Lt || {}), Jt = /* @__PURE__ */ ((s) => (s.Top = "top", s.Center = "center", s.Bottom = "bottom", s))(Jt || {});
+const It = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e ? t <= s && s <= e : e <= s && s <= t, Le = (s, t, e) => (s - t[0]) / (t[1] - t[0]) * (e[1] - e[0]) + e[0], Qt = (s, t, e, a, l, r, i) => {
   const n = (() => {
     switch (r) {
       case "start":
@@ -11,11 +11,11 @@ const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e
       case "end":
         return a[1] - (t[1] - s[0]);
       case "middle": {
-        const d = (t[0] + t[1]) / 2, c = (a[0] + a[1]) / 2, h = t[1] - t[0], f = a[1] - a[0], y = (s[0] - d) / h;
-        return c + y * f;
+        const d = (t[0] + t[1]) / 2, c = (a[0] + a[1]) / 2, h = t[1] - t[0], f = a[1] - a[0], b = (s[0] - d) / h;
+        return c + b * f;
       }
       default:
-        return Ie(s[0], t, a);
+        return Le(s[0], t, a);
     }
   })(), o = (() => {
     switch (i) {
@@ -24,15 +24,15 @@ const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e
       case "end":
         return l[1] - (e[1] - s[1]);
       case "middle": {
-        const d = (e[0] + e[1]) / 2, c = (l[0] + l[1]) / 2, h = e[1] - e[0], f = l[1] - l[0], y = (s[1] - d) / h;
-        return c + y * f;
+        const d = (e[0] + e[1]) / 2, c = (l[0] + l[1]) / 2, h = e[1] - e[0], f = l[1] - l[0], b = (s[1] - d) / h;
+        return c + b * f;
       }
       default:
-        return Ie(s[1], e, l);
+        return Le(s[1], e, l);
     }
   })();
   return [n, o];
-}, _e = (s, t) => ((s[0] - t[0]) ** 2 + (s[1] - t[1]) ** 2) ** 0.5, fo = (s, t) => (ut(
+}, Ue = (s, t) => ((s[0] - t[0]) ** 2 + (s[1] - t[1]) ** 2) ** 0.5, mo = (s, t) => (ut(
   s[0][0],
   t[0][0],
   t[1][0]
@@ -65,10 +65,10 @@ const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e
   s[1][1],
   s[0][1]
 ));
-var $ = /* @__PURE__ */ ((s) => (s.Blur = "blur", s.Change = "change", s.Click = "click", s.ContextMenu = "contextmenu", s.DoubleClick = "dblclick", s.Focus = "focus", s.FocusIn = "focusin", s.FocusOut = "focusout", s.Input = "input", s.KeyDown = "keydown", s.KeyUp = "keyup", s.MouseDown = "mousedown", s.MouseEnter = "mouseenter", s.MouseLeave = "mouseleave", s.MouseMove = "mousemove", s.MouseOut = "mouseout", s.MouseOver = "mouseover", s.MouseUp = "mouseup", s.TouchStart = "touchstart", s.TouchEnd = "touchend", s.Wheel = "wheel", s))($ || {}), Z = /* @__PURE__ */ ((s) => (s.Alt = "Alt", s.AltGraph = "AltGraph", s.ArrowDown = "ArrowDown", s.ArrowLeft = "ArrowLeft", s.ArrowRight = "ArrowRight", s.ArrowUp = "ArrowUp", s.Backspace = "Backspace", s.Control = "Control", s.Delete = "Delete", s.End = "End", s.Enter = "Enter", s.Escape = "Escape", s.Home = "Home", s.OS = "OS", s.PageDown = "PageDown", s.PageUp = "PageUp", s.Shift = "Shift", s.Tab = "Tab", s))(Z || {}), I = /* @__PURE__ */ ((s) => (s.Drag = "drag", s.Start = "start", s.End = "end", s))(I || {}), fe = /* @__PURE__ */ ((s) => (s.Zoom = "zoom", s.Start = "start", s.End = "end", s))(fe || {});
-const ue = (s) => s.replace(/([!"#$%&'()*+,\-./:;<=>?@[\\\]^`{|}])/g, "\\$1");
-var Ge = /* @__PURE__ */ ((s) => (s.Straight = "straight", s.Bezier = "bezier", s.Square = "square", s))(Ge || {}), be = /* @__PURE__ */ ((s) => (s.Solid = "solid", s.Dashed = "dashed", s.GappedDashes = "gapped-dashes", s.Dotted = "dotted", s))(be || {});
-const uo = 20, po = (s, t, e, a, l) => {
+var $ = /* @__PURE__ */ ((s) => (s.Blur = "blur", s.Change = "change", s.Click = "click", s.ContextMenu = "contextmenu", s.DoubleClick = "dblclick", s.Focus = "focus", s.FocusIn = "focusin", s.FocusOut = "focusout", s.Input = "input", s.KeyDown = "keydown", s.KeyUp = "keyup", s.MouseDown = "mousedown", s.MouseEnter = "mouseenter", s.MouseLeave = "mouseleave", s.MouseMove = "mousemove", s.MouseOut = "mouseout", s.MouseOver = "mouseover", s.MouseUp = "mouseup", s.TouchStart = "touchstart", s.TouchEnd = "touchend", s.Wheel = "wheel", s))($ || {}), Z = /* @__PURE__ */ ((s) => (s.Alt = "Alt", s.AltGraph = "AltGraph", s.ArrowDown = "ArrowDown", s.ArrowLeft = "ArrowLeft", s.ArrowRight = "ArrowRight", s.ArrowUp = "ArrowUp", s.Backspace = "Backspace", s.Control = "Control", s.Delete = "Delete", s.End = "End", s.Enter = "Enter", s.Escape = "Escape", s.Home = "Home", s.OS = "OS", s.PageDown = "PageDown", s.PageUp = "PageUp", s.Shift = "Shift", s.Tab = "Tab", s))(Z || {}), A = /* @__PURE__ */ ((s) => (s.Drag = "drag", s.Start = "start", s.End = "end", s))(A || {}), ue = /* @__PURE__ */ ((s) => (s.Zoom = "zoom", s.Start = "start", s.End = "end", s))(ue || {});
+const pe = (s) => s.replace(/([!"#$%&'()*+,\-./:;<=>?@[\\\]^`{|}])/g, "\\$1");
+var De = /* @__PURE__ */ ((s) => (s.Straight = "straight", s.Bezier = "bezier", s.Square = "square", s))(De || {}), Se = /* @__PURE__ */ ((s) => (s.Solid = "solid", s.Dashed = "dashed", s.GappedDashes = "gapped-dashes", s.Dotted = "dotted", s))(Se || {});
+const vo = 20, yo = (s, t, e, a, l) => {
   if (typeof s == "function")
     return s(
       t,
@@ -81,7 +81,7 @@ const uo = 20, po = (s, t, e, a, l) => {
   if (t.length === 1)
     return `M ${t[0][0]} ${t[0][1]}`;
   {
-    l = l || uo;
+    l = l || vo;
     let r = "", i, n;
     switch (s) {
       case "straight":
@@ -270,7 +270,7 @@ const uo = 20, po = (s, t, e, a, l) => {
     }
     return r;
   }
-}, pe = (s, t) => {
+}, me = (s, t) => {
   switch (s) {
     case "dotted":
       return `${t}`;
@@ -281,67 +281,67 @@ const uo = 20, po = (s, t, e, a, l) => {
     default:
       return "none";
   }
-}, Y = (s, t) => {
+}, B = (s, t) => {
   const e = s.indexOf(t);
   return e >= 0 && s.splice(e, 1), s;
 };
-var Tt = /* @__PURE__ */ ((s) => (s.Ellipse = "ellipse", s.Empty = "empty", s.Folder = "folder", s.Hexagon = "hexagon", s.Octagon = "octagon", s.Pill = "pill", s.Rectangle = "rectangle", s.Rhombus = "rhombus", s.RoundedRectangle = "rounded-rectangle", s.StickyNote = "sticky-note", s))(Tt || {});
-const me = (s, t, e, a, l) => {
+var Mt = /* @__PURE__ */ ((s) => (s.Ellipse = "ellipse", s.Empty = "empty", s.Folder = "folder", s.Hexagon = "hexagon", s.Octagon = "octagon", s.Pill = "pill", s.Rectangle = "rectangle", s.Rhombus = "rhombus", s.RoundedRectangle = "rounded-rectangle", s.StickyNote = "sticky-note", s))(Mt || {});
+const ve = (s, t, e, a, l) => {
   if (typeof s == "function")
     return s(t, e, a, l);
   switch (s) {
     case "ellipse":
-      return Fe(t, e, a, l);
+      return Ye(t, e, a, l);
     case "empty":
-      return mo();
+      return bo();
     case "folder":
-      return vo(t, e, a, l);
+      return ko(t, e, a, l);
     case "hexagon":
-      return yo(t, e, a, l);
+      return wo(t, e, a, l);
     case "octagon":
-      return bo(t, e, a, l);
+      return So(t, e, a, l);
     case "pill":
-      return Kt(t, e, a, l);
+      return qt(t, e, a, l);
     case "rectangle":
-      return Ae(t, e, a, l);
+      return Ee(t, e, a, l);
     case "rhombus":
-      return ko(t, e, a, l);
+      return Co(t, e, a, l);
     case "rounded-rectangle":
-      return wo(t, e, a, l);
+      return $o(t, e, a, l);
     case "sticky-note":
-      return So(t, e, a, l);
+      return Ao(t, e, a, l);
     default:
-      return Ae(t, e, a, l);
+      return Ee(t, e, a, l);
   }
-}, Fe = (s, t, e, a) => `M ${s + e / 2} ${t} A ${e / 2} ${a / 2} 0 0 0 ${s + e / 2} ${t + a} A ${e / 2} ${a / 2} 0 1 0 ${s + e / 2} ${t} Z`, mo = () => "Z", vo = (s, t, e, a) => `M ${s} ${t} L ${s + e / 3} ${t} L ${s + e / 2} ${t + a / 6} L ${s + e} ${t + a / 6} L ${s + e} ${t + a} L ${s} ${t + a} Z`, yo = (s, t, e, a) => `M ${s + e / 4} ${t} L ${s + 3 * e / 4} ${t} L ${s + e} ${t + a / 2} L ${s + 3 * e / 4} ${t + a} L ${s + e / 4} ${t + a} L ${s} ${t + a / 2} Z`, bo = (s, t, e, a) => `M ${s + e / 4} ${t} L ${s + 3 * e / 4} ${t} L ${s + e} ${t + a / 4} L ${s + e} ${t + 3 * a / 4} L ${s + 3 * e / 4} ${t + a} L ${s + e / 4} ${t + a} L ${s} ${t + 3 * a / 4} L ${s} ${t + a / 4} L ${s + e / 4} ${t} Z`, Kt = (s, t, e, a) => a < e ? `M ${s + a / 2} ${t} L ${s + e - a / 2} ${t} A ${a / 2} ${a / 2} 0 0 1 ${s + e} ${t + a / 2} A ${a / 2} ${a / 2} 0 0 1 ${s + e - a / 2} ${t + a} L ${s + a / 2} ${t + a} A ${a / 2} ${a / 2} 0 0 1 ${s} ${t + a / 2} A ${a / 2} ${a / 2} 0 0 1 ${s + a / 2} ${t} Z` : a > e ? `M ${s} ${t + e / 2} L ${s} ${t + a - e / 2} A ${e / 2} ${e / 2} 0 0 0 ${s + e / 2} ${t + a} A ${e / 2} ${e / 2} 0 0 0 ${s + e} ${t + a - e / 2} L ${s + e} ${t + e / 2} A ${e / 2} ${e / 2} 0 0 0 ${s + e / 2} ${t} A ${e / 2} ${e / 2} 0 0 0 ${s} ${t + e / 2} Z` : Fe(s, t, e, a), Ae = (s, t, e, a) => `M ${s} ${t} L ${s + e} ${t} L ${s + e} ${t + a} L ${s} ${t + a} Z`, ko = (s, t, e, a) => `M ${s + e / 2} ${t} L ${s + e} ${t + a / 2} L ${s + e / 2} ${t + a} L ${s} ${t + a / 2} Z`, wo = (s, t, e, a) => `M ${s + e / 4} ${t} L ${s + 3 * e / 4} ${t} A ${e / 4} ${a / 4} 0 0 1 ${s + e} ${t + a / 4} L ${s + e} ${t + 3 * a / 4} A ${e / 4} ${a / 4} 0 0 1 ${s + 3 * e / 4} ${t + a} L ${s + e / 4} ${t + a} A ${e / 4} ${a / 4} 0 0 1 ${s} ${t + 3 * a / 4} L ${s} ${t + a / 4} A ${e / 4} ${a / 4} 0 0 1 ${s + e / 4} ${t} Z`, So = (s, t, e, a) => `M ${s} ${t} L ${s + 3 * e / 4} ${t} L ${s + 3 * e / 4} ${t + a / 4} L ${s + 3 * e / 4} ${t} L ${s + e} ${t + a / 4} L ${s + 3 * e / 4} ${t + a / 4} L ${s + e} ${t + a / 4} L ${s + e} ${t + a} L ${s} ${t + a} Z`;
+}, Ye = (s, t, e, a) => `M ${s + e / 2} ${t} A ${e / 2} ${a / 2} 0 0 0 ${s + e / 2} ${t + a} A ${e / 2} ${a / 2} 0 1 0 ${s + e / 2} ${t} Z`, bo = () => "Z", ko = (s, t, e, a) => `M ${s} ${t} L ${s + e / 3} ${t} L ${s + e / 2} ${t + a / 6} L ${s + e} ${t + a / 6} L ${s + e} ${t + a} L ${s} ${t + a} Z`, wo = (s, t, e, a) => `M ${s + e / 4} ${t} L ${s + 3 * e / 4} ${t} L ${s + e} ${t + a / 2} L ${s + 3 * e / 4} ${t + a} L ${s + e / 4} ${t + a} L ${s} ${t + a / 2} Z`, So = (s, t, e, a) => `M ${s + e / 4} ${t} L ${s + 3 * e / 4} ${t} L ${s + e} ${t + a / 4} L ${s + e} ${t + 3 * a / 4} L ${s + 3 * e / 4} ${t + a} L ${s + e / 4} ${t + a} L ${s} ${t + 3 * a / 4} L ${s} ${t + a / 4} L ${s + e / 4} ${t} Z`, qt = (s, t, e, a) => a < e ? `M ${s + a / 2} ${t} L ${s + e - a / 2} ${t} A ${a / 2} ${a / 2} 0 0 1 ${s + e} ${t + a / 2} A ${a / 2} ${a / 2} 0 0 1 ${s + e - a / 2} ${t + a} L ${s + a / 2} ${t + a} A ${a / 2} ${a / 2} 0 0 1 ${s} ${t + a / 2} A ${a / 2} ${a / 2} 0 0 1 ${s + a / 2} ${t} Z` : a > e ? `M ${s} ${t + e / 2} L ${s} ${t + a - e / 2} A ${e / 2} ${e / 2} 0 0 0 ${s + e / 2} ${t + a} A ${e / 2} ${e / 2} 0 0 0 ${s + e} ${t + a - e / 2} L ${s + e} ${t + e / 2} A ${e / 2} ${e / 2} 0 0 0 ${s + e / 2} ${t} A ${e / 2} ${e / 2} 0 0 0 ${s} ${t + e / 2} Z` : Ye(s, t, e, a), Ee = (s, t, e, a) => `M ${s} ${t} L ${s + e} ${t} L ${s + e} ${t + a} L ${s} ${t + a} Z`, Co = (s, t, e, a) => `M ${s + e / 2} ${t} L ${s + e} ${t + a / 2} L ${s + e / 2} ${t + a} L ${s} ${t + a / 2} Z`, $o = (s, t, e, a) => `M ${s + e / 4} ${t} L ${s + 3 * e / 4} ${t} A ${e / 4} ${a / 4} 0 0 1 ${s + e} ${t + a / 4} L ${s + e} ${t + 3 * a / 4} A ${e / 4} ${a / 4} 0 0 1 ${s + 3 * e / 4} ${t + a} L ${s + e / 4} ${t + a} A ${e / 4} ${a / 4} 0 0 1 ${s} ${t + 3 * a / 4} L ${s} ${t + a / 4} A ${e / 4} ${a / 4} 0 0 1 ${s + e / 4} ${t} Z`, Ao = (s, t, e, a) => `M ${s} ${t} L ${s + 3 * e / 4} ${t} L ${s + 3 * e / 4} ${t + a / 4} L ${s + 3 * e / 4} ${t} L ${s + e} ${t + a / 4} L ${s + 3 * e / 4} ${t + a / 4} L ${s + e} ${t + a / 4} L ${s + e} ${t + a} L ${s} ${t + a} Z`;
 var L = /* @__PURE__ */ ((s) => (s.AllScroll = "all-scroll", s.Auto = "auto", s.Crosshair = "crosshair", s.EWResize = "ew-resize", s.Grab = "grab", s.Grabbing = "grabbing", s.Move = "move", s.NoDrop = "no-drop", s.NSResize = "ns-resize", s.NotAllowed = "not-allowed", s.ZoomIn = "zoom-in", s.ZoomOut = "zoom-out", s))(L || {});
-const Co = (s) => Math.max(...s.split(`
-`).map((t) => t.length)), $o = (s) => s.match(/\n/g)?.length || 0, W = [];
+const Io = (s) => Math.max(...s.split(`
+`).map((t) => t.length)), xo = (s) => s.match(/\n/g)?.length || 0, W = [];
 for (let s = 0; s < 256; ++s)
   W.push((s + 256).toString(16).slice(1));
-function Io(s, t = 0) {
+function Lo(s, t = 0) {
   return (W[s[t + 0]] + W[s[t + 1]] + W[s[t + 2]] + W[s[t + 3]] + "-" + W[s[t + 4]] + W[s[t + 5]] + "-" + W[s[t + 6]] + W[s[t + 7]] + "-" + W[s[t + 8]] + W[s[t + 9]] + "-" + W[s[t + 10]] + W[s[t + 11]] + W[s[t + 12]] + W[s[t + 13]] + W[s[t + 14]] + W[s[t + 15]]).toLowerCase();
 }
-let re;
-const Ao = new Uint8Array(16);
-function xo() {
-  if (!re) {
+let ae;
+const Eo = new Uint8Array(16);
+function To() {
+  if (!ae) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-    re = crypto.getRandomValues.bind(crypto);
+    ae = crypto.getRandomValues.bind(crypto);
   }
-  return re(Ao);
+  return ae(Eo);
 }
-const Lo = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), xe = { randomUUID: Lo };
-function Eo(s, t, e) {
+const Mo = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), Te = { randomUUID: Mo };
+function No(s, t, e) {
   s = s || {};
-  const a = s.random ?? s.rng?.() ?? xo();
+  const a = s.random ?? s.rng?.() ?? To();
   if (a.length < 16)
     throw new Error("Random bytes length must be >= 16");
-  return a[6] = a[6] & 15 | 64, a[8] = a[8] & 63 | 128, Io(a);
+  return a[6] = a[6] & 15 | 64, a[8] = a[8] & 63 | 128, Lo(a);
 }
-function Le(s, t, e) {
-  return xe.randomUUID && !s ? xe.randomUUID() : Eo(s);
+function Me(s, t, e) {
+  return Te.randomUUID && !s ? Te.randomUUID() : No(s);
 }
 const Nt = (s) => {
   if (typeof s != "object")
@@ -370,7 +370,7 @@ const Nt = (s) => {
     selectedAndHighlightedLook: o
   };
 };
-class te {
+class ee {
   constructor() {
     this.entities = [], this.entityMap = {};
   }
@@ -463,7 +463,7 @@ class te {
    */
   remove(t) {
     const e = this.get(t);
-    e !== void 0 && (delete this.entityMap[t], Y(this.entities, e));
+    e !== void 0 && (delete this.entityMap[t], B(this.entities, e));
   }
   /**
    * Gets the number of entities in this set.
@@ -482,7 +482,7 @@ class te {
   }
 }
 const Pt = 0;
-class It {
+class At {
   constructor(t, e) {
     this.selfRemoved = !1, this.selfRemovedTimestamp = null, this.model = t, this._id = e;
   }
@@ -511,10 +511,10 @@ class It {
    * @private
    */
   select() {
-    return this.model.canvas?.selectCanvasView()?.select(`[id='${ue(this.id)}']`);
+    return this.model.canvas?.selectCanvasView()?.select(`[id='${pe(this.id)}']`);
   }
 }
-class ft extends te {
+class ft extends ee {
   all(t = !1) {
     return t ? super.all() : super.filter((e) => !e.removed);
   }
@@ -538,7 +538,7 @@ class ft extends te {
   }
   remove(t) {
     const e = this.get(t, !0);
-    e !== void 0 && (delete this.entityMap[t], Y(this.entities, e));
+    e !== void 0 && (delete this.entityMap[t], B(this.entities, e));
   }
   size(t = !1) {
     return t ? super.size() : super.filter((e) => !e.removed).length;
@@ -552,13 +552,13 @@ class ft extends te {
         yield e;
   }
 }
-class Mo {
+class Po {
   constructor(t, e, a, l, r, i, n) {
     this.name = t, this.label = e, this.type = a, this.defaultValue = l, this.basic = r, this.editable = i, this.rootAttribute = n, this.options = void 0, this.properties = void 0;
   }
 }
-var T = /* @__PURE__ */ ((s) => (s.Boolean = "boolean", s.Color = "color", s.Date = "date", s.Datetime = "datetime", s.Number = "number", s.Object = "object", s.Option = "option", s.OptionList = "option-list", s.OptionSet = "option-set", s.Text = "text", s.TextArea = "text-area", s.TextList = "text-list", s.TextSet = "text-set", s.TextMap = "text-map", s.Time = "time", s.Url = "url", s))(T || {});
-class ee {
+var M = /* @__PURE__ */ ((s) => (s.Boolean = "boolean", s.Color = "color", s.Date = "date", s.Datetime = "datetime", s.Number = "number", s.Object = "object", s.Option = "option", s.OptionList = "option-list", s.OptionSet = "option-set", s.Text = "text", s.TextArea = "text-area", s.TextList = "text-list", s.TextSet = "text-set", s.TextMap = "text-map", s.Time = "time", s.Url = "url", s))(M || {});
+class oe {
   constructor(t = []) {
     this.propertyList = t, this.propertyMap = {};
     for (const e of this.propertyList)
@@ -577,11 +577,11 @@ class ee {
 function kt(s, t) {
   return !t || s[0] > t[0] ? !0 : s[0] === t[0] ? s[1] >= t[1] : !1;
 }
-const Ee = (s) => s == null || s === "" || s instanceof Array && s.length === 0 || s instanceof Object && Object.keys(s).length === 0, St = (s, t) => s === t || JSON.stringify(s) === JSON.stringify(t), Ue = (s, t, e) => {
+const Ne = (s) => s == null || s === "" || s instanceof Array && s.length === 0 || s instanceof Object && Object.keys(s).length === 0, St = (s, t) => s === t || JSON.stringify(s) === JSON.stringify(t), Be = (s, t, e) => {
   const a = {}, l = {};
   for (const r in e.propertySet.propertyMap)
-    if (e.propertySet.propertyMap[r].type === T.Object) {
-      const i = Ue(
+    if (e.propertySet.propertyMap[r].type === M.Object) {
+      const i = Be(
         s[r],
         t[r],
         e.getSubValueSet(r)
@@ -590,7 +590,7 @@ const Ee = (s) => s == null || s === "" || s instanceof Array && s.length === 0
     } else
       St(s[r], t[r]) || (a[r] = s[r], l[r] = t[r]);
   return [a, l];
-}, To = (s) => s != null && s.constructor === Object;
+}, zo = (s) => s != null && s.constructor === Object;
 class yt {
   constructor(t, e) {
     this.displayedProperties = [], this.hiddenProperties = [], this.values = {}, this.valueSets = {}, this.ownTimestamps = {}, this.propertySet = t, this.rootElement = e, this.resetValues();
@@ -652,7 +652,7 @@ class yt {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   getValue(t) {
     const e = this.propertySet.getProperty(t)?.rootAttribute;
-    return e != null && (this.values[t] = this.getRootElementValue(e)), this.propertySet.getProperty(t).type === T.Object ? this.valueSets[t].getValues() : this.values[t];
+    return e != null && (this.values[t] = this.getRootElementValue(e)), this.propertySet.getProperty(t).type === M.Object ? this.valueSets[t].getValues() : this.values[t];
   }
   /**
    * Obtains all the values in the set.
@@ -662,7 +662,7 @@ class yt {
   getValues() {
     const t = {};
     for (const e in this.propertySet.propertyMap)
-      this.propertySet.getProperty(e).type === T.Object ? t[e] = this.valueSets[e].getValues() : t[e] = this.getValue(e);
+      this.propertySet.getProperty(e).type === M.Object ? t[e] = this.valueSets[e].getValues() : t[e] = this.getValue(e);
     return t;
   }
   /**
@@ -673,7 +673,7 @@ class yt {
   getValuesForKeys(t) {
     const e = {};
     for (const a in t)
-      this.propertySet.getProperty(a).type === T.Object ? e[a] = this.valueSets[a].getValuesForKeys(
+      this.propertySet.getProperty(a).type === M.Object ? e[a] = this.valueSets[a].getValuesForKeys(
         t[a]
       ) : e[a] = this.getValue(a);
     return e;
@@ -686,7 +686,7 @@ class yt {
   getTimestamps() {
     const t = {};
     for (const e in this.propertySet.propertyMap)
-      if (this.propertySet.getProperty(e).type === T.Object)
+      if (this.propertySet.getProperty(e).type === M.Object)
         t[e] = this.valueSets[e].getTimestamps();
       else {
         const l = this.ownTimestamps[e];
@@ -702,7 +702,7 @@ class yt {
    */
   hasValue(t) {
     const e = this.getValue(t);
-    return !Ee(e);
+    return !Ne(e);
   }
   /**
    * Checks if the value under the key is not empty or the default value.
@@ -712,7 +712,7 @@ class yt {
    */
   hasSetValue(t) {
     const e = this.getValue(t), a = this.propertySet.getProperty(t);
-    return a && a.type === T.Object ? this.getSubValueSet(t).hasAnySetValue() : !Ee(e) && !St(e, a?.defaultValue);
+    return a && a.type === M.Object ? this.getSubValueSet(t).hasAnySetValue() : !Ne(e) && !St(e, a?.defaultValue);
   }
   /**
    * Checks if any of the values in the set are not empty or the default value.
@@ -734,7 +734,7 @@ class yt {
   setValue(t, e) {
     const a = this.propertySet.getProperty(t);
     if (a) {
-      a.type === T.Object ? this.valueSets[t].setValues(e) : (this.values[t] = e, St(e, a.defaultValue) || this.displayProperty(a));
+      a.type === M.Object ? this.valueSets[t].setValues(e) : (this.values[t] = e, St(e, a.defaultValue) || this.displayProperty(a));
       const l = a.rootAttribute;
       l != null && this.setRootElementValue(l, e);
     }
@@ -747,7 +747,7 @@ class yt {
   setValues(t) {
     this.resetValues();
     for (const e in t)
-      this.propertySet.getProperty(e).type === T.Object ? this.valueSets[e].setValues(
+      this.propertySet.getProperty(e).type === M.Object ? this.valueSets[e].setValues(
         t[e]
       ) : this.setValue(e, t[e]);
   }
@@ -759,7 +759,7 @@ class yt {
   setTimestamps(t) {
     this.ownTimestamps = {};
     for (const e in t)
-      this.propertySet.getProperty(e).type === T.Object ? this.valueSets[e].setTimestamps(
+      this.propertySet.getProperty(e).type === M.Object ? this.valueSets[e].setTimestamps(
         t[e]
       ) : this.ownTimestamps[e] = t[e];
   }
@@ -770,7 +770,7 @@ class yt {
    */
   overwriteValues(t) {
     for (const e in t)
-      this.propertySet.getProperty(e).type === T.Object ? this.valueSets[e].overwriteValues(
+      this.propertySet.getProperty(e).type === M.Object ? this.valueSets[e].overwriteValues(
         t[e]
       ) : this.setValue(e, t[e]);
   }
@@ -781,7 +781,7 @@ class yt {
    */
   overwriteValuesLww(t, e) {
     for (const a in t)
-      this.propertySet.getProperty(a).type === T.Object ? this.valueSets[a].overwriteValuesLww(
+      this.propertySet.getProperty(a).type === M.Object ? this.valueSets[a].overwriteValuesLww(
         t[a],
         e
       ) : kt(e, this.ownTimestamps[a]) && (this.setValue(a, t[a]), this.ownTimestamps[a] = e);
@@ -795,7 +795,7 @@ class yt {
     this.displayedProperties = [], this.hiddenProperties = [], this.ownTimestamps = {};
     for (const t in this.propertySet.propertyMap) {
       const e = this.propertySet.getProperty(t), a = e.rootAttribute;
-      e.type === T.Object ? this.valueSets[t] = this.constructSubValueSet(t) : this.values[t] = Nt(e.defaultValue), a != null && e.defaultValue !== void 0 && !St(
+      e.type === M.Object ? this.valueSets[t] = this.constructSubValueSet(t) : this.values[t] = Nt(e.defaultValue), a != null && e.defaultValue !== void 0 && !St(
         this.getRootElementValue(a),
         e.defaultValue
       ) && this.setRootElementValue(a, this.values[t]), e.basic !== !1 ? this.displayedProperties.push(e) : this.hiddenProperties.push(e);
@@ -808,7 +808,7 @@ class yt {
    * @returns The constructed ValueSet.
    */
   constructSubValueSet(t) {
-    const e = this.propertySet.getProperty(t), a = new ee(e.properties), l = new yt(a, this.rootElement);
+    const e = this.propertySet.getProperty(t), a = new oe(e.properties), l = new yt(a, this.rootElement);
     return l.overwriteValues(
       Nt(e.defaultValue)
     ), l;
@@ -828,7 +828,7 @@ class yt {
    * @param property A property.
    */
   displayProperty(t) {
-    this.displayedProperties.includes(t) || (this.displayedProperties.push(t), Y(this.hiddenProperties, t));
+    this.displayedProperties.includes(t) || (this.displayedProperties.push(t), B(this.hiddenProperties, t));
   }
   /**
    * Moves the given property to the list of hidden properties.
@@ -836,7 +836,7 @@ class yt {
    * @param property A property.
    */
   hideProperty(t) {
-    this.hiddenProperties.includes(t) || (this.hiddenProperties.push(t), Y(this.displayedProperties, t));
+    this.hiddenProperties.includes(t) || (this.hiddenProperties.push(t), B(this.displayedProperties, t));
   }
 }
 const et = {
@@ -846,8 +846,8 @@ const et = {
     lookType: "connection-look",
     color: "#000000",
     thickness: 1,
-    shape: Ge.Straight,
-    style: be.Solid,
+    shape: De.Straight,
+    style: Se.Solid,
     selected: {
       color: "#AA00AA"
     },
@@ -861,7 +861,7 @@ const et = {
   endTypes: [],
   properties: []
 };
-class De {
+class Xe {
   constructor(t) {
     const e = {
       ...et,
@@ -883,7 +883,7 @@ class De {
       this.defaultEndMarkerLook = l.defaultLook, this.selectedEndMarkerLook = l.selectedLook, this.highlightedEndMarkerLook = l.highlightedLook, this.selectedAndHighlightedEndMarkerLook = l.selectedAndHighlightedLook;
     } else
       this.defaultEndMarkerLook = null, this.selectedEndMarkerLook = null, this.highlightedEndMarkerLook = null, this.selectedAndHighlightedEndMarkerLook = null;
-    this.startTypes = e.startTypes, this.endTypes = e.endTypes, this.propertySet = new ee(e.properties);
+    this.startTypes = e.startTypes, this.endTypes = e.endTypes, this.propertySet = new oe(e.properties);
   }
   canStartFromType(t) {
     return this.startTypes.indexOf(t) >= 0;
@@ -892,7 +892,7 @@ class De {
     return this.endTypes.indexOf(t) >= 0;
   }
 }
-class dt extends It {
+class dt extends At {
   constructor(t, e, a, l, r) {
     if (t.connections.get(r) !== void 0)
       throw new Error(`DiagramConnection with id "${r}" already exists`);
@@ -1078,7 +1078,7 @@ class dt extends It {
    * @param start A port.
    */
   setStart(t) {
-    this.start !== t ? (this.start !== void 0 && Y(this.start.outgoingConnections, this), this.start = t, t !== void 0 && (t.outgoingConnections.push(this), this.startDirection = t?.direction, this.startCoords = t?.connectionPoint || [0, 0])) : (this.startDirection = t?.direction, this.startCoords = t?.connectionPoint || [0, 0]), this.updateInView();
+    this.start !== t ? (this.start !== void 0 && B(this.start.outgoingConnections, this), this.start = t, t !== void 0 && (t.outgoingConnections.push(this), this.startDirection = t?.direction, this.startCoords = t?.connectionPoint || [0, 0])) : (this.startDirection = t?.direction, this.startCoords = t?.connectionPoint || [0, 0]), this.updateInView();
   }
   /**
    * Set the end of this connection to the given port or reset this connection's ending port if `undefined`.
@@ -1087,7 +1087,7 @@ class dt extends It {
    * @param end A port.
    */
   setEnd(t) {
-    this.end !== t ? (this.end !== void 0 && Y(this.end.incomingConnections, this), this.end = t, t !== void 0 && (t.incomingConnections.push(this), this.endDirection = t?.direction, this.endCoords = t?.connectionPoint || [0, 0])) : (this.endDirection = t?.direction, this.endCoords = t?.connectionPoint || [0, 0]), this.updateInView();
+    this.end !== t ? (this.end !== void 0 && B(this.end.incomingConnections, this), this.end = t, t !== void 0 && (t.incomingConnections.push(this), this.endDirection = t?.direction, this.endCoords = t?.connectionPoint || [0, 0])) : (this.endDirection = t?.direction, this.endCoords = t?.connectionPoint || [0, 0]), this.updateInView();
   }
   /**
    * Reassign the start and end ports of this connection to ports with less distance between them that have the same root element.
@@ -1161,13 +1161,13 @@ class dt extends It {
     return this.start ? this.end ? Math.min(this.start.getPriority(), this.end.getPriority()) : this.start.getPriority() : this.end ? this.end.getPriority() : Pt;
   }
 }
-class No extends ft {
+class Ro extends ft {
   /**
    * Instance a set of connections for the given model. This method is used internally.
    * @private
    */
   constructor(t) {
-    super(), this.types = new te(), this.model = t;
+    super(), this.types = new ee(), this.model = t;
   }
   /**
    * Instance a new connection and add it to this set.
@@ -1180,7 +1180,7 @@ class No extends ft {
    */
   new(t, e, a, l) {
     let r;
-    if (t instanceof De)
+    if (t instanceof Xe)
       r = t;
     else {
       const n = this.types.get(t);
@@ -1201,10 +1201,10 @@ class No extends ft {
   }
   remove(t) {
     const e = this.get(t, !0);
-    e && (Y(e.start?.outgoingConnections || [], e), Y(e.end?.incomingConnections || [], e), super.remove(t), e.updateInView());
+    e && (B(e.start?.outgoingConnections || [], e), B(e.end?.incomingConnections || [], e), super.remove(t), e.updateInView());
   }
 }
-const R = {
+const V = {
   editable: !0,
   fontSize: 0,
   margin: 0,
@@ -1214,17 +1214,17 @@ const R = {
   selectedColor: "#000000",
   backgroundColor: "#00000000",
   horizontalAlign: Lt.Center,
-  verticalAlign: qt.Center,
+  verticalAlign: Jt.Center,
   orientation: g.Top,
   fit: !1,
   shrink: !0
 };
-class ht extends It {
-  constructor(t, e, a, l, r, i, n, o, d, c, h, f, y, m, p, u) {
-    const k = `${e?.id}_field`;
-    if (t.fields.get(k) !== void 0)
+class ht extends At {
+  constructor(t, e, a, l, r, i, n, o, d, c, h, f, b, m, p, u) {
+    const y = `${e?.id}_field`;
+    if (t.fields.get(y) !== void 0)
       throw new Error("DiagramField for rootElement already exists");
-    if (super(t, k), this.textTimestamp = null, this.rootElement = e, this.coords = a, this.width = l, this.height = r, this.fontSize = i, this.fontFamily = n, this.color = o, this.selectedColor = d, this.horizontalAlign = c, this.verticalAlign = h, !isNaN(Number(f)))
+    if (super(t, y), this.textTimestamp = null, this.rootElement = e, this.coords = a, this.width = l, this.height = r, this.fontSize = i, this.fontFamily = n, this.color = o, this.selectedColor = d, this.horizontalAlign = c, this.verticalAlign = h, !isNaN(Number(f)))
       this.orientation = Number(f);
     else
       switch (f) {
@@ -1243,7 +1243,7 @@ class ht extends It {
         default:
           this.orientation = 0;
       }
-    this.defaultText = y, this._text = y, this.editable = m, this.fit = p, this.shrink = u;
+    this.defaultText = b, this._text = b, this.editable = m, this.fit = p, this.shrink = u;
   }
   /**
    * Text contents of this field.
@@ -1276,7 +1276,7 @@ class ht extends It {
     return this.rootElement?.getPriority() || Pt;
   }
 }
-class Po extends ft {
+class Vo extends ft {
   /**
    * Instance a set of fields for the given model. This method is used internally.
    * @private
@@ -1288,7 +1288,7 @@ class Po extends ft {
    * Instance a new field and add it to this set. This method is normally called when instancing an element with a field and it is rarely called by itself.
    * @private
    */
-  new(t, e, a, l, r, i, n, o, d, c, h, f, y, m, p) {
+  new(t, e, a, l, r, i, n, o, d, c, h, f, b, m, p) {
     const u = new ht(
       this.model,
       t,
@@ -1303,7 +1303,7 @@ class Po extends ft {
       c,
       h,
       f,
-      y,
+      b,
       m,
       p
     );
@@ -1314,26 +1314,28 @@ class Po extends ft {
     e && (e.rootElement?.label !== void 0 && e.rootElement.label === e && (e.rootElement.label = void 0), super.remove(t), e.updateInView());
   }
 }
-const K = (s) => s?.margin === null || s?.margin === void 0 ? R.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? R.margin : s.margin.length === 1 || s.margin.length === 2 ? s.margin[0] : (s.margin.length === 3, s.margin[2]), B = (s) => s?.margin === null || s?.margin === void 0 ? R.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? R.margin : s.margin.length === 1 ? s.margin[0] : s.margin.length === 2 || s.margin.length === 3 ? s.margin[1] : s.margin[3], ot = (s) => s?.margin === null || s?.margin === void 0 ? R.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? R.margin : s.margin.length === 1 ? s.margin[0] : (s.margin.length === 2 || s.margin.length === 3, s.margin[1]), F = (s) => s?.margin === null || s?.margin === void 0 ? R.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? R.margin : (s.margin.length === 1 || s.margin.length === 2 || s.margin.length === 3, s.margin[0]), Rt = (s) => s?.padding === null || s?.padding === void 0 ? R.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? R.padding : s.padding.length === 1 || s.padding.length === 2 ? s.padding[0] : (s.padding.length === 3, s.padding[2]), Ot = (s) => s?.padding === null || s?.padding === void 0 ? R.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? R.padding : s.padding.length === 1 ? s.padding[0] : s.padding.length === 2 || s.padding.length === 3 ? s.padding[1] : s.padding[3], Ht = (s) => s?.padding === null || s?.padding === void 0 ? R.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? R.padding : s.padding.length === 1 ? s.padding[0] : (s.padding.length === 2 || s.padding.length === 3, s.padding[1]), _t = (s) => s?.padding === null || s?.padding === void 0 ? R.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? R.padding : (s.padding.length === 1 || s.padding.length === 2 || s.padding.length === 3, s.padding[0]), Me = 1, Te = 1, zo = 1, Vo = 1;
-class Ro {
+const K = (s) => s?.margin === null || s?.margin === void 0 ? V.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? V.margin : s.margin.length === 1 || s.margin.length === 2 ? s.margin[0] : (s.margin.length === 3, s.margin[2]), Y = (s) => s?.margin === null || s?.margin === void 0 ? V.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? V.margin : s.margin.length === 1 ? s.margin[0] : s.margin.length === 2 || s.margin.length === 3 ? s.margin[1] : s.margin[3], ot = (s) => s?.margin === null || s?.margin === void 0 ? V.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? V.margin : s.margin.length === 1 ? s.margin[0] : (s.margin.length === 2 || s.margin.length === 3, s.margin[1]), U = (s) => s?.margin === null || s?.margin === void 0 ? V.margin : typeof s.margin == "number" ? s.margin : s.margin.length === 0 ? V.margin : (s.margin.length === 1 || s.margin.length === 2 || s.margin.length === 3, s.margin[0]), Vt = (s) => s?.padding === null || s?.padding === void 0 ? V.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? V.padding : s.padding.length === 1 || s.padding.length === 2 ? s.padding[0] : (s.padding.length === 3, s.padding[2]), Ot = (s) => s?.padding === null || s?.padding === void 0 ? V.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? V.padding : s.padding.length === 1 ? s.padding[0] : s.padding.length === 2 || s.padding.length === 3 ? s.padding[1] : s.padding[3], Ht = (s) => s?.padding === null || s?.padding === void 0 ? V.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? V.padding : s.padding.length === 1 ? s.padding[0] : (s.padding.length === 2 || s.padding.length === 3, s.padding[1]), _t = (s) => s?.padding === null || s?.padding === void 0 ? V.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? V.padding : (s.padding.length === 1 || s.padding.length === 2 || s.padding.length === 3, s.padding[0]);
+var Gt = /* @__PURE__ */ ((s) => (s[s.OnlyWhenSelected = 0] = "OnlyWhenSelected", s))(Gt || {});
+const Pe = 1, ze = 1, Oo = 1, Ho = 1;
+class _o {
   constructor(t) {
     this.margin = t.margin || 0, this.defaultWidths = t.defaultWidths || null, this.defaultHeights = t.defaultHeights || null, this.minWidths = t.minWidths || null, this.minHeights = t.minHeights || null, this.sections = [];
     for (const e of t.sections) {
       const a = [];
       this.sections.push(a);
       for (const l of e)
-        a.push(new Oo(l));
+        a.push(new Go(l));
     }
   }
 }
-class Oo {
+class Go {
   constructor(t) {
     this.label = t.label || null, this.ports = t.ports || [], this.priority = t.priority || Pt, this.resizableX = t.resizableX, this.resizableY = t.resizableY;
-    const e = st(t.look || Be);
+    const e = st(t.look || je);
     this.defaultLook = e.defaultLook, this.selectedLook = e.selectedLook, this.highlightedLook = e.highlightedLook, this.selectedAndHighlightedLook = e.selectedAndHighlightedLook;
   }
 }
-class D extends It {
+class F extends At {
   constructor(t, e, a, l, r, i, n, o) {
     if (t.sections.get(o) !== void 0)
       throw new Error(`DiagramSection with id "${o}" already exists`);
@@ -1413,10 +1415,10 @@ class D extends It {
     return this.node?.type?.sectionGrid?.sections?.[this.indexYInNode]?.[this.indexXInNode];
   }
   getMinWidth() {
-    return this.node?.type?.sectionGrid?.minWidths?.[this.indexXInNode] || zo;
+    return this.node?.type?.sectionGrid?.minWidths?.[this.indexXInNode] || Oo;
   }
   getMinHeight() {
-    return this.node?.type?.sectionGrid?.minHeights?.[this.indexYInNode] || Vo;
+    return this.node?.type?.sectionGrid?.minHeights?.[this.indexYInNode] || Ho;
   }
   getPriority() {
     return this.node?.type?.sectionGrid?.sections?.[this.indexYInNode]?.[this.indexXInNode]?.priority || Pt;
@@ -1429,7 +1431,7 @@ class D extends It {
    */
   getResizableX() {
     const t = this.type;
-    return t?.resizableX !== void 0 ? t.resizableX : this.node?.type?.resizableX || !1;
+    return t?.resizableX !== void 0 ? t.resizableX === Gt.OnlyWhenSelected ? this.selected : t.resizableX : this.node?.getResizableX() || !1;
   }
   /**
    * Returns whether this section can be resized vertically.
@@ -1439,7 +1441,7 @@ class D extends It {
    */
   getResizableY() {
     const t = this.type;
-    return t?.resizableY !== void 0 ? t.resizableY : this.node?.type?.resizableY || !1;
+    return t?.resizableY !== void 0 ? t.resizableY === Gt.OnlyWhenSelected ? this.selected : t.resizableY : this.node?.getResizableY() || !1;
   }
   /**
    * Get the port of this section which is closest to the given coordinates.
@@ -1559,7 +1561,7 @@ class D extends It {
     const l = [this.coords[0], this.coords[0] + this.width], r = [this.coords[1], this.coords[1] + this.height];
     for (const n of this.ports)
       n.move(
-        Jt(
+        Qt(
           n.coords,
           e,
           a,
@@ -1571,12 +1573,12 @@ class D extends It {
       );
     const i = this.type;
     this.label && (this.label.coords = [
-      this.coords[0] + B(i?.label),
-      this.coords[1] + F(i?.label)
-    ], this.label.width = this.width - B(i?.label) - ot(i?.label), this.label.height = this.height - F(i?.label) - K(i?.label), this.label.updateInView());
+      this.coords[0] + Y(i?.label),
+      this.coords[1] + U(i?.label)
+    ], this.label.width = this.width - Y(i?.label) - ot(i?.label), this.label.height = this.height - U(i?.label) - K(i?.label), this.label.updateInView());
     for (const n of this.decorators)
       n.move(
-        Jt(
+        Qt(
           n.coords,
           e,
           a,
@@ -1589,7 +1591,7 @@ class D extends It {
     this.model.canvas?.autoTightenConnections !== !1 && this.getConnections().forEach((n) => n.tighten()), this.updateInView();
   }
 }
-class Ho extends ft {
+class Fo extends ft {
   /**
    * Instance a set of sections for the given model. This method is used internally.
    * @private
@@ -1602,7 +1604,7 @@ class Ho extends ft {
    * @private
    */
   new(t, e, a, l, r, i, n) {
-    const o = new D(
+    const o = new F(
       this.model,
       t,
       e,
@@ -1616,7 +1618,7 @@ class Ho extends ft {
     const d = t.type.sectionGrid?.sections?.[a]?.[e]?.ports;
     if (d && d.length > 0)
       for (let h = 0; h < d.length; ++h) {
-        const f = d[h], y = this.model.ports.new(
+        const f = d[h], b = this.model.ports.new(
           f.type !== void 0 ? this.model.ports.types.get(f.type) : void 0,
           o,
           [
@@ -1632,33 +1634,33 @@ class Ho extends ft {
           f.anchorPointX || "floating",
           f.anchorPointY || "floating"
         );
-        if (y.type?.label) {
+        if (b.type?.label) {
           const m = {
-            ...R,
-            ...y.type?.label
-          }, p = 6 * m.fontSize + Ot(m) + Ht(m), u = m.fontSize + _t(m) + Rt(m);
-          let k;
-          switch (y.direction) {
+            ...V,
+            ...b.type?.label
+          }, p = 6 * m.fontSize + Ot(m) + Ht(m), u = m.fontSize + _t(m) + Vt(m);
+          let y;
+          switch (b.direction) {
             case g.Bottom:
             case g.Left:
             case g.Right:
-              k = [
-                y.coords[0] - p / 2,
-                y.coords[1] - u - K(m)
+              y = [
+                b.coords[0] - p / 2,
+                b.coords[1] - u - K(m)
               ];
               break;
             case g.Top:
-              k = [
-                y.coords[0] - p / 2,
-                y.coords[1] + F(m)
+              y = [
+                b.coords[0] - p / 2,
+                b.coords[1] + U(m)
               ];
               break;
             default:
-              k = y.coords;
+              y = b.coords;
           }
           this.model.fields.new(
+            b,
             y,
-            k,
             m.fontSize,
             m.fontFamily,
             m.color,
@@ -1678,21 +1680,21 @@ class Ho extends ft {
     const c = t.type.sectionGrid?.sections?.[a]?.[e]?.label;
     if (c) {
       const h = {
-        ...R,
+        ...V,
         ...c
       };
       this.model.fields.new(
         o,
         [
-          o.coords[0] + B(h),
-          o.coords[1] + F(h)
+          o.coords[0] + Y(h),
+          o.coords[1] + U(h)
         ],
         h.fontSize,
         h.fontFamily,
         h.color,
         h.selectedColor,
-        o.width - B(h) - ot(h),
-        o.height - F(h) - K(h),
+        o.width - Y(h) - ot(h),
+        o.height - U(h) - K(h),
         h.horizontalAlign,
         h.verticalAlign,
         h.orientation,
@@ -1709,13 +1711,13 @@ class Ho extends ft {
     if (e) {
       for (; e.ports.length > 0; )
         this.model.ports.remove(e.ports[0].id);
-      e.label && this.model.fields.remove(e.label.id), e.node && Y(e.node.sections, e), super.remove(t), e.updateInView();
+      e.label && this.model.fields.remove(e.label.id), e.node && B(e.node.sections, e), super.remove(t), e.updateInView();
     }
   }
 }
-const Be = {
+const je = {
   lookType: "shaped-look",
-  shape: Tt.Rectangle,
+  shape: Mt.Rectangle,
   fillColor: "#FFFFFF",
   borderColor: "#000000",
   borderThickness: 1,
@@ -1740,25 +1742,25 @@ const Be = {
   ports: [],
   decorators: [],
   sectionGrid: null,
-  look: Be,
+  look: je,
   isUnique: !1,
   canBeParentless: !0,
   childrenTypes: [],
   priority: Pt,
   properties: []
 };
-class Ye {
+class We {
   constructor(t) {
     const e = {
       ...gt,
       ...t
     };
-    this.id = e.id, this.name = e.name, this.defaultWidth = e.defaultWidth, this.defaultHeight = e.defaultHeight, this.minWidth = e.minWidth, this.minHeight = e.minHeight, this.resizableX = e.resizableX, this.resizableY = e.resizableY, this.snapToGridOffset = e.snapToGridOffset, this.bottomPadding = Go(e), this.leftPadding = Fo(e), this.rightPadding = Uo(e), this.topPadding = Do(e), this.label = e.label, this.ports = e.ports, this.decorators = e.decorators, this.sectionGrid = e.sectionGrid ? new Ro(e.sectionGrid) : null;
+    this.id = e.id, this.name = e.name, this.defaultWidth = e.defaultWidth, this.defaultHeight = e.defaultHeight, this.minWidth = e.minWidth, this.minHeight = e.minHeight, this.resizableX = e.resizableX, this.resizableY = e.resizableY, this.snapToGridOffset = e.snapToGridOffset, this.bottomPadding = Do(e), this.leftPadding = Yo(e), this.rightPadding = Bo(e), this.topPadding = Xo(e), this.label = e.label, this.ports = e.ports, this.decorators = e.decorators, this.sectionGrid = e.sectionGrid ? new _o(e.sectionGrid) : null;
     const a = st(e.look);
-    this.defaultLook = a.defaultLook, this.selectedLook = a.selectedLook, this.highlightedLook = a.highlightedLook, this.selectedAndHighlightedLook = a.selectedAndHighlightedLook, this.isUnique = e.isUnique, this.canBeParentless = e.canBeParentless, this.childrenTypes = e.childrenTypes, this.priority = e.priority, this.propertySet = new ee(t?.properties || []);
+    this.defaultLook = a.defaultLook, this.selectedLook = a.selectedLook, this.highlightedLook = a.highlightedLook, this.selectedAndHighlightedLook = a.selectedAndHighlightedLook, this.isUnique = e.isUnique, this.canBeParentless = e.canBeParentless, this.childrenTypes = e.childrenTypes, this.priority = e.priority, this.propertySet = new oe(t?.properties || []);
   }
 }
-class z extends It {
+class z extends At {
   constructor(t, e, a = [0, 0], l) {
     if (t.nodes.get(l) !== void 0)
       throw new Error(`DiagramNode with id "${l}" already exists`);
@@ -1857,6 +1859,22 @@ class z extends It {
   getPriority() {
     return this.type.priority;
   }
+  /**
+   * Returns whether this node can be resized horizontally.
+   * @public
+   */
+  getResizableX() {
+    const t = this.type.resizableX;
+    return t === Gt.OnlyWhenSelected ? this.selected : t;
+  }
+  /**
+   * Returns whether this node can be resized vertically.
+   * @public
+   */
+  getResizableY() {
+    const t = this.type.resizableY;
+    return t === Gt.OnlyWhenSelected ? this.selected : t;
+  }
   /**
    * Get the port of this node which is closest to the given coordinates.
    * @param coords A point in the diagram.
@@ -1990,7 +2008,7 @@ class z extends It {
     a || this.children.indexOf(t) >= 0 || (this.fitToChild(t), this.children.push(t), t.parent = this, t.raise());
   }
   removeChild(t) {
-    Y(this.children, t), t.parent = void 0;
+    B(this.children, t), t.parent = void 0;
   }
   fitToChild(t) {
     const e = Math.max(
@@ -2181,7 +2199,7 @@ class z extends It {
     }
     for (const i of this.ports)
       i.move(
-        Jt(
+        Qt(
           i.coords,
           e,
           a,
@@ -2192,12 +2210,12 @@ class z extends It {
         )
       );
     this.label && (this.label.coords = [
-      this.coords[0] + B(this.type.label),
-      this.coords[1] + F(this.type.label)
-    ], this.label.width = this.width - B(this.type.label) - ot(this.type.label), this.label.height = this.height - F(this.type.label) - K(this.type.label), this.label.updateInView());
+      this.coords[0] + Y(this.type.label),
+      this.coords[1] + U(this.type.label)
+    ], this.label.width = this.width - Y(this.type.label) - ot(this.type.label), this.label.height = this.height - U(this.type.label) - K(this.type.label), this.label.updateInView());
     for (const i of this.decorators)
       i.move(
-        Jt(
+        Qt(
           i.coords,
           e,
           a,
@@ -2312,13 +2330,13 @@ class z extends It {
     this.stretch(g.Bottom, e + a);
   }
 }
-class _o extends ft {
+class Uo extends ft {
   /**
    * Instance a set of nodes for the given model. This method is used internally.
    * @private
    */
   constructor(t) {
-    super(), this.types = new te(), this.model = t;
+    super(), this.types = new ee(), this.model = t;
   }
   /**
    * Instance a new node and add it to this set.
@@ -2330,7 +2348,7 @@ class _o extends ft {
    */
   new(t, e, a) {
     let l;
-    if (t instanceof Ye)
+    if (t instanceof We)
       l = t;
     else {
       const i = this.types.get(t);
@@ -2349,11 +2367,11 @@ class _o extends ft {
             d,
             n,
             [o, i],
-            l.sectionGrid.defaultWidths?.[d] || Me,
-            l.sectionGrid.defaultHeights?.[n] || Te,
+            l.sectionGrid.defaultWidths?.[d] || Pe,
+            l.sectionGrid.defaultHeights?.[n] || ze,
             `${r.id}_${n}_${d}`
-          ), o += (l.sectionGrid.defaultWidths?.[d] || Me) + (l.sectionGrid.margin || 0);
-        i += (l.sectionGrid.defaultHeights?.[n] || Te) + (l.sectionGrid.margin || 0);
+          ), o += (l.sectionGrid.defaultWidths?.[d] || Pe) + (l.sectionGrid.margin || 0);
+        i += (l.sectionGrid.defaultHeights?.[n] || ze) + (l.sectionGrid.margin || 0);
       }
     }
     if (l.ports.length > 0)
@@ -2376,31 +2394,31 @@ class _o extends ft {
         );
         if (d.type?.label) {
           const c = {
-            ...R,
+            ...V,
             ...d.type?.label
-          }, h = 6 * c.fontSize + Ot(c) + Ht(c), f = c.fontSize + _t(c) + Rt(c);
-          let y;
+          }, h = 6 * c.fontSize + Ot(c) + Ht(c), f = c.fontSize + _t(c) + Vt(c);
+          let b;
           switch (d.direction) {
             case g.Bottom:
             case g.Left:
             case g.Right:
-              y = [
+              b = [
                 d.coords[0] - h / 2,
                 d.coords[1] - f - K(c)
               ];
               break;
             case g.Top:
-              y = [
+              b = [
                 d.coords[0] - h / 2,
-                d.coords[1] + F(c)
+                d.coords[1] + U(c)
               ];
               break;
             default:
-              y = d.coords;
+              b = d.coords;
           }
           this.model.fields.new(
             d,
-            y,
+            b,
             c.fontSize,
             c.fontFamily,
             c.color,
@@ -2419,21 +2437,21 @@ class _o extends ft {
       }
     if (l.label) {
       const i = {
-        ...R,
+        ...V,
         ...l.label
       };
       this.model.fields.new(
         r,
         [
-          r.coords[0] + B(i),
-          r.coords[1] + F(i)
+          r.coords[0] + Y(i),
+          r.coords[1] + U(i)
         ],
         i.fontSize,
         i.fontFamily,
         i.color,
         i.selectedColor,
-        r.width - B(i) - ot(i),
-        r.height - F(i) - K(i),
+        r.width - Y(i) - ot(i),
+        r.height - U(i) - K(i),
         i.horizontalAlign,
         i.verticalAlign,
         i.orientation,
@@ -2466,7 +2484,7 @@ class _o extends ft {
   remove(t) {
     const e = this.get(t, !0);
     if (e) {
-      for (e.parent && Y(e.parent.children, e); e.children.length > 0; )
+      for (e.parent && B(e.parent.children, e); e.children.length > 0; )
         this.model.nodes.remove(e.children[0].id);
       for (; e.sections.length > 0; )
         this.model.sections.remove(e.sections[0].id);
@@ -2491,14 +2509,14 @@ class _o extends ft {
     return a;
   }
 }
-const Xe = (s) => {
+const Ze = (s) => {
   for (let t = 0; t < s.length; ++t)
     for (let e = 0; e < s.length; ++e)
       e !== t && s[e].isAncestorOf(s[t]) && (s.splice(e, 1), --e, t > e && --t);
   return s;
-}, Go = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : s.padding.length === 1 || s.padding.length === 2 ? s.padding[0] : (s.padding.length === 3, s.padding[2]), Fo = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : s.padding.length === 1 ? s.padding[0] : s.padding.length === 2 || s.padding.length === 3 ? s.padding[1] : s.padding[3], Uo = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : s.padding.length === 1 ? s.padding[0] : (s.padding.length === 2 || s.padding.length === 3, s.padding[1]), Do = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : (s.padding.length === 1 || s.padding.length === 2 || s.padding.length === 3, s.padding[0]), je = {
+}, Do = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : s.padding.length === 1 || s.padding.length === 2 ? s.padding[0] : (s.padding.length === 3, s.padding[2]), Yo = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : s.padding.length === 1 ? s.padding[0] : s.padding.length === 2 || s.padding.length === 3 ? s.padding[1] : s.padding[3], Bo = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : s.padding.length === 1 ? s.padding[0] : (s.padding.length === 2 || s.padding.length === 3, s.padding[1]), Xo = (s) => s?.padding === null || s?.padding === void 0 ? gt.padding : typeof s.padding == "number" ? s.padding : s.padding.length === 0 ? gt.padding : (s.padding.length === 1 || s.padding.length === 2 || s.padding.length === 3, s.padding[0]), Ke = {
   lookType: "shaped-look",
-  shape: Tt.Ellipse,
+  shape: Mt.Ellipse,
   fillColor: "transparent",
   borderColor: "transparent",
   borderThickness: 0,
@@ -2508,18 +2526,18 @@ const Xe = (s) => {
   highlighted: {
     fillColor: "rgba(0, 255, 255, 0.5)"
   }
-}, Wt = st(je), We = {
+}, Zt = st(Ke), qe = {
   name: "",
   label: null,
   allowsOutgoing: !0,
   allowsIncoming: !0,
   width: 24,
-  look: je
+  look: Ke
 };
-class Bo {
+class jo {
   constructor(t) {
     const e = {
-      ...We,
+      ...qe,
       ...t
     };
     this.id = e.id, this.name = e.name, this.label = e.label, this.allowsOutgoing = e.allowsOutgoing, this.allowsIncoming = e.allowsIncoming, this.width = e.width;
@@ -2527,7 +2545,7 @@ class Bo {
     this.defaultLook = a.defaultLook, this.selectedLook = a.selectedLook, this.highlightedLook = a.highlightedLook, this.selectedAndHighlightedLook = a.selectedAndHighlightedLook;
   }
 }
-class bt extends It {
+class bt extends At {
   constructor(t, e, a, l, r, i, n, o = "floating", d = "floating") {
     if (t.ports.get(n) !== void 0)
       throw new Error(`DiagramPort with id "${n}" already exists`);
@@ -2580,7 +2598,7 @@ class bt extends It {
    * @private
    */
   get look() {
-    return this.selected ? this.highlighted ? this._selectedAndHighlightedLook !== void 0 ? this._selectedAndHighlightedLook : (this.type || Wt)?.selectedAndHighlightedLook : this._selectedLook !== void 0 ? this._selectedLook : (this.type || Wt)?.selectedLook : this.highlighted ? this._highlightedLook !== void 0 ? this._highlightedLook : (this.type || Wt)?.highlightedLook : this._defaultLook !== void 0 ? this._defaultLook : (this.type || Wt)?.defaultLook;
+    return this.selected ? this.highlighted ? this._selectedAndHighlightedLook !== void 0 ? this._selectedAndHighlightedLook : (this.type || Zt)?.selectedAndHighlightedLook : this._selectedLook !== void 0 ? this._selectedLook : (this.type || Zt)?.selectedLook : this.highlighted ? this._highlightedLook !== void 0 ? this._highlightedLook : (this.type || Zt)?.highlightedLook : this._defaultLook !== void 0 ? this._defaultLook : (this.type || Zt)?.defaultLook;
   }
   /**
    * An alias for the `lookConfig` attribute.
@@ -2627,7 +2645,7 @@ class bt extends It {
    * @private
    */
   get width() {
-    return this.type?.width || We.width;
+    return this.type?.width || qe.width;
   }
   /**
    * Current height of this port. Same as the width.
@@ -2673,7 +2691,7 @@ class bt extends It {
   getNode() {
     if (this.rootElement instanceof z)
       return this.rootElement;
-    if (this.rootElement instanceof D)
+    if (this.rootElement instanceof F)
       return this.rootElement.node;
   }
   getPriority() {
@@ -2700,16 +2718,16 @@ class bt extends It {
     ]), this.updateInView();
   }
   distanceTo(t) {
-    return _e(this.coords, t);
+    return Ue(this.coords, t);
   }
 }
-class Yo extends ft {
+class Wo extends ft {
   /**
    * Instance a set of ports for the given model. This method is used internally.
    * @private
    */
   constructor(t) {
-    super(), this.types = new te(), this.model = t;
+    super(), this.types = new ee(), this.model = t;
   }
   /**
    * Instance a new port and add it to this set. This method is normally called when instancing an element with a port and it is rarely called by itself.
@@ -2736,11 +2754,11 @@ class Yo extends ft {
         this.model.connections.remove(e.outgoingConnections[0].id);
       for (; e.incomingConnections.length > 0; )
         this.model.connections.remove(e.incomingConnections[0].id);
-      e.label && this.model.fields.remove(e.label.id), (e.rootElement instanceof z || e.rootElement instanceof D) && Y(e.rootElement.ports, e), super.remove(t), e.updateInView();
+      e.label && this.model.fields.remove(e.label.id), (e.rootElement instanceof z || e.rootElement instanceof F) && B(e.rootElement.ports, e), super.remove(t), e.updateInView();
     }
   }
 }
-class Ze {
+class Je {
   import(t, e) {
     t.clear(), e.id && (t.id = e.id), t.name = e.name, t.description = e.description, t.type = e.type, t.createdAt = new Date(e.createdAt), t.updatedAt = new Date(e.updatedAt);
     for (const a of e.nodes || [])
@@ -2772,17 +2790,17 @@ class Ze {
           }
         if (a.label) {
           const i = {
-            ...R,
+            ...V,
             ...a.label
           }, n = new ht(
             t,
             l,
             [
-              l.coords[0] + B(i),
-              l.coords[1] + F(i)
+              l.coords[0] + Y(i),
+              l.coords[1] + U(i)
             ],
-            l.width - B(i) - ot(i),
-            l.height - F(i) - K(i),
+            l.width - Y(i) - ot(i),
+            l.height - U(i) - K(i),
             i.fontSize,
             i.fontFamily,
             i.color,
@@ -2803,7 +2821,7 @@ class Ze {
         n !== void 0 && (l.children?.push(n), n.parent = l);
       }
       for (const i of e.sections || []) {
-        const n = new D(
+        const n = new F(
           t,
           l,
           i.indexXInNode,
@@ -2815,17 +2833,17 @@ class Ze {
         );
         if (l.sections?.push(n), t.sections.add(n), i.label && a.sectionGrid?.sections?.[i.indexYInNode]?.[i.indexXInNode]?.label) {
           const d = {
-            ...R,
+            ...V,
             ...a.sectionGrid?.sections?.[i.indexYInNode]?.[i.indexXInNode]?.label
           }, c = new ht(
             t,
             n,
             [
-              n.coords[0] + B(d),
-              n.coords[1] + F(d)
+              n.coords[0] + Y(d),
+              n.coords[1] + U(d)
             ],
-            n.width - B(d) - ot(d),
-            n.height - F(d) - K(d),
+            n.width - Y(d) - ot(d),
+            n.height - U(d) - K(d),
             d.fontSize,
             d.fontFamily,
             d.color,
@@ -2854,37 +2872,37 @@ class Ze {
           if (n.ports.push(h), t.ports.add(h), d.label) {
             if (a.ports.length > o && c?.label) {
               const f = {
-                ...R,
+                ...V,
                 ...c?.label
               };
-              let y;
+              let b;
               switch (h.direction) {
                 case g.Top:
                 case g.Left:
-                  y = [
+                  b = [
                     h.coords[0] - f.fontSize,
                     h.coords[1] - f.fontSize
                   ];
                   break;
                 case g.Bottom:
-                  y = [
+                  b = [
                     h.coords[0] - f.fontSize,
                     h.coords[1] + f.fontSize
                   ];
                   break;
                 case g.Right:
-                  y = [
+                  b = [
                     h.coords[0] + f.fontSize,
                     h.coords[1] - f.fontSize
                   ];
                   break;
                 default:
-                  y = h.coords;
+                  b = h.coords;
               }
               const m = new ht(
                 t,
                 h,
-                y,
+                b,
                 f.fontSize,
                 f.fontSize,
                 f.fontSize,
@@ -2924,7 +2942,7 @@ class Ze {
         if (l.ports.push(o), t.ports.add(o), i.label) {
           if (a.ports.length > r && n?.label) {
             const d = {
-              ...R,
+              ...V,
               ...n?.label
             };
             let c;
@@ -2997,7 +3015,7 @@ class Ze {
     t && e && (t.selfRemoved = e.selfRemoved, t.selfRemovedTimestamp = e.selfRemovedTimestamp, t.textTimestamp = e.textTimestamp);
   }
 }
-class oe {
+class ie {
   constructor(t, e, a, l, r, i, n) {
     this.canvas = t, this.id = e, this.typeId = a, this.coords = l, this.parentId = r, this.label = i, this.values = n;
   }
@@ -3022,7 +3040,7 @@ class oe {
     };
   }
   static deserialize(t, e) {
-    return new oe(
+    return new ie(
       t,
       e.id,
       e.typeId,
@@ -3033,7 +3051,7 @@ class oe {
     );
   }
 }
-class ke {
+class Ce {
   constructor(t, e, a, l, r, i, n) {
     this.canvas = t, this.nodeId = e, this.copyColumnIndex = a, this.copyRowIndex = l, this.removeColumnIndex = r, this.removeRowIndex = i, this.timestamp = n;
   }
@@ -3053,7 +3071,7 @@ class ke {
     };
   }
   static deserialize(t, e) {
-    return new ke(
+    return new Ce(
       t,
       e.nodeId,
       e.copyColumnIndex,
@@ -3064,7 +3082,7 @@ class ke {
     );
   }
 }
-class we {
+class $e {
   constructor(t, e, a) {
     this.canvas = t, this.to = e, this.timestamp = a;
   }
@@ -3085,14 +3103,14 @@ class we {
     };
   }
   static deserialize(t, e) {
-    return new we(
+    return new $e(
       t,
       e.to,
       e.timestamp
     );
   }
 }
-class Gt {
+class Ft {
   constructor(t, e, a, l) {
     this.canvas = t, this.nodeIds = e, this.delta = a, this.timestamp = l;
   }
@@ -3114,7 +3132,7 @@ class Gt {
     };
   }
   static deserialize(t, e) {
-    return new Gt(
+    return new Ft(
       t,
       e.nodeIds,
       e.delta,
@@ -3155,7 +3173,7 @@ class it {
     );
   }
 }
-class Ft {
+class Ut {
   constructor(t, e, a, l, r) {
     this.canvas = t, this.childId = e, this.parentId = a, this.childGeometry = l, this.timestamp = r;
   }
@@ -3173,7 +3191,7 @@ class Ft {
     };
   }
   static deserialize(t, e) {
-    return new Ft(
+    return new Ut(
       t,
       e.childId,
       e.parentId,
@@ -3182,7 +3200,7 @@ class Ft {
     );
   }
 }
-class ie {
+class se {
   constructor(t, e, a, l, r) {
     this.canvas = t, this.id = e, this.typeId = a, this.startId = l, this.endId = r;
   }
@@ -3200,7 +3218,7 @@ class ie {
     };
   }
   static deserialize(t, e) {
-    return new ie(
+    return new se(
       t,
       e.id,
       e.typeId,
@@ -3234,7 +3252,7 @@ class Et {
     );
   }
 }
-class Mt {
+class Tt {
   constructor(t, e, a, l) {
     this.canvas = t, this.id = e, this.to = a, this.timestamp = l;
   }
@@ -3253,7 +3271,7 @@ class Mt {
     };
   }
   static deserialize(t, e) {
-    return new Mt(
+    return new Tt(
       t,
       e.id,
       e.to,
@@ -3306,12 +3324,12 @@ class at {
     );
   }
 }
-class se {
+class ne {
   constructor(t, e, a) {
     this.canvas = t, this.nodes = e, this.connections = a;
   }
   do() {
-    const t = new Ze();
+    const t = new Je();
     this.canvas.userSelection.clear();
     for (const e of this.nodes) {
       const a = t.importNode(this.canvas.model, e);
@@ -3333,16 +3351,16 @@ class se {
     };
   }
   static deserialize(t, e) {
-    return new se(
+    return new ne(
       t,
       e.nodes,
       e.connections
     );
   }
 }
-class Xo {
+class Zo {
   constructor(t) {
-    this.isInRoom = !1, this.canvas = t, this.replicaId = Le();
+    this.isInRoom = !1, this.canvas = t, this.replicaId = Me();
   }
   /**
    * Returns a fresh timestamp, suitable for use by new CollabActions.
@@ -3354,7 +3372,7 @@ class Xo {
    * Returns a fresh unique ID, suitable for use by new CollabActions.
    */
   freshId() {
-    return "id" + Le();
+    return "id" + Me();
   }
   /**
    * Performs the action - immediately locally, and eventually for remote collaborators.
@@ -3377,22 +3395,22 @@ class Xo {
       t.timestamp[0]
     )), t.type) {
       case "addNode": {
-        oe.deserialize(this.canvas, t).do();
+        ie.deserialize(this.canvas, t).do();
         break;
       }
       case "addSection": {
-        ke.deserialize(this.canvas, t).do();
+        Ce.deserialize(this.canvas, t).do();
         break;
       }
       case "applyLayout": {
-        we.deserialize(
+        $e.deserialize(
           this.canvas,
           t
         ).do();
         break;
       }
       case "move": {
-        Gt.deserialize(this.canvas, t).do();
+        Ft.deserialize(this.canvas, t).do();
         break;
       }
       case "setGeometry": {
@@ -3403,11 +3421,11 @@ class Xo {
         break;
       }
       case "setParent": {
-        Ft.deserialize(this.canvas, t).do();
+        Ut.deserialize(this.canvas, t).do();
         break;
       }
       case "addConnection": {
-        ie.deserialize(
+        se.deserialize(
           this.canvas,
           t
         ).do();
@@ -3418,7 +3436,7 @@ class Xo {
         break;
       }
       case "updateValues": {
-        Mt.deserialize(
+        Tt.deserialize(
           this.canvas,
           t
         ).do();
@@ -3432,7 +3450,7 @@ class Xo {
         break;
       }
       case "paste": {
-        se.deserialize(this.canvas, t).do();
+        ne.deserialize(this.canvas, t).do();
         break;
       }
       default:
@@ -3443,7 +3461,7 @@ class Xo {
     }
   }
 }
-class jo {
+class Ko {
   constructor(t, e) {
     this.canvas = t, this.maximum = e, this.history = [], this.index = 0;
   }
@@ -3496,12 +3514,12 @@ class jo {
   }
 }
 var w = /* @__PURE__ */ ((s) => (s.AddConnection = "add-connection", s.AddNode = "add-node", s.AddSectionAction = "add-section", s.ApplyLayout = "apply-layout", s.Clipboard = "clipboard", s.ContextMenu = "context-menu", s.EditField = "edit-field", s.MoveNode = "move-node", s.Paste = "paste", s.Remove = "remove", s.StretchNode = "stretch-node", s.StretchSection = "stretch-section", s.UpdateValues = "update-values", s.Zoom = "zoom", s))(w || {});
-class Wo {
+class qo {
   constructor(t, e, a, l, r, i, n, o, d) {
     this.canvas = t, this.type = e, this.coords = a, this.parentId = l, this.ancestorId = r, this.fromAncestorGeometry = i, this.toAncestorGeometry = n, this.label = o, this.values = d, this.id = this.canvas.collabEngine.freshId();
   }
   do() {
-    const t = new oe(
+    const t = new ie(
       this.canvas,
       this.id,
       this.type.id,
@@ -3566,12 +3584,12 @@ class Wo {
     return t === void 0;
   }
 }
-class ae {
+class le {
   constructor(t, e, a) {
     this.canvas = t, this.nodeIds = e, this.delta = a;
   }
   do() {
-    const t = new Gt(
+    const t = new Ft(
       this.canvas,
       this.nodeIds,
       this.delta,
@@ -3580,7 +3598,7 @@ class ae {
     return this.canvas.collabEngine.doCollaboratively(t), this.nodeIds.map((e) => this.canvas.model.nodes.get(e) !== void 0).includes(!0) && (this.delta[0] !== 0 || this.delta[1] !== 0);
   }
   undo() {
-    const t = new Gt(
+    const t = new Ft(
       this.canvas,
       this.nodeIds,
       [-this.delta[0], -this.delta[1]],
@@ -3654,12 +3672,12 @@ class X {
     return t !== void 0;
   }
 }
-class Zo {
+class Jo {
   constructor(t, e, a, l, r, i, n, o, d) {
     this.canvas = t, this.childId = e, this.fromParentId = a, this.toParentId = l, this.fromChildGeometry = r, this.toChildGeometry = i, this.ancestorId = n, this.fromAncestorGeometry = o, this.toAncestorGeometry = d;
   }
   do() {
-    const t = this.canvas.model.nodes.get(this.childId), e = new Ft(
+    const t = this.canvas.model.nodes.get(this.childId), e = new Ut(
       this.canvas,
       this.childId,
       this.toParentId,
@@ -3678,7 +3696,7 @@ class Zo {
     return t !== void 0;
   }
   undo() {
-    const t = this.canvas.model.nodes.get(this.childId), e = new Ft(
+    const t = this.canvas.model.nodes.get(this.childId), e = new Ut(
       this.canvas,
       this.childId,
       this.fromParentId,
@@ -3700,12 +3718,12 @@ class Zo {
     return this.do();
   }
 }
-class le {
+class de {
   constructor(t, e, a, l) {
     this.canvas = t, this.type = e, this.startId = a, this.endId = l, this.id = this.canvas.collabEngine.freshId();
   }
   do() {
-    const t = new ie(
+    const t = new se(
       this.canvas,
       this.id,
       this.type.id,
@@ -3741,7 +3759,7 @@ class le {
     return this.canvas.collabEngine.doCollaboratively(e), t === void 0;
   }
 }
-class Ne {
+class Re {
   constructor(t, e, a, l) {
     this.canvas = t, this.fieldId = e, this.from = a, this.to = l;
   }
@@ -3783,12 +3801,12 @@ class Ne {
     return t !== void 0;
   }
 }
-class Ko {
+class Qo {
   constructor(t, e, a, l) {
     this.canvas = t, this.id = e, this.from = a, this.to = l;
   }
   do() {
-    const t = new Mt(
+    const t = new Tt(
       this.canvas,
       this.id,
       this.to,
@@ -3797,7 +3815,7 @@ class Ko {
     return this.canvas.collabEngine.doCollaboratively(t), !0;
   }
   undo() {
-    const t = new Mt(
+    const t = new Tt(
       this.canvas,
       this.id,
       this.from,
@@ -3810,7 +3828,7 @@ class Ko {
     return !e.rootElement.removed;
   }
   redo() {
-    const t = new Mt(
+    const t = new Tt(
       this.canvas,
       this.id,
       this.to,
@@ -3823,7 +3841,7 @@ class Ko {
     return !e.rootElement.removed;
   }
 }
-class qo {
+class ti {
   constructor(t, e, a, l, r, i) {
     this.canvas = t, this.nodeIds = e, this.sectionIds = a, this.portIds = l, this.connectionIds = r, this.fieldIds = i;
   }
@@ -3865,7 +3883,7 @@ class qo {
     return this.do();
   }
 }
-class Jo {
+class ei {
   constructor(t, e, a, l) {
     this.canvas = t, this.nodes = e, this.connections = a, this.coords = l;
   }
@@ -3918,7 +3936,7 @@ class Jo {
             r.points[n][1] + e[1]
           ];
     }
-    const l = new se(
+    const l = new ne(
       this.canvas,
       this.nodes,
       this.connections
@@ -3956,7 +3974,7 @@ class Jo {
     return this.canvas.collabEngine.doCollaboratively(e), t;
   }
 }
-class Dt {
+class Yt {
   constructor(t) {
     this.type = t, this.defaultPrevented = !1;
   }
@@ -3964,8 +3982,8 @@ class Dt {
     this.defaultPrevented = !0;
   }
 }
-var Ke = /* @__PURE__ */ ((s) => (s[s.Zoom = 0] = "Zoom", s[s.DoubleClick = 1] = "DoubleClick", s[s.SecondaryClick = 2] = "SecondaryClick", s[s.Selection = 3] = "Selection", s[s.Highlight = 4] = "Highlight", s))(Ke || {});
-class Qo extends Dt {
+var Qe = /* @__PURE__ */ ((s) => (s[s.Zoom = 0] = "Zoom", s[s.DoubleClick = 1] = "DoubleClick", s[s.SecondaryClick = 2] = "SecondaryClick", s[s.Selection = 3] = "Selection", s[s.Highlight = 4] = "Highlight", s))(Qe || {});
+class oi extends Yt {
   /**
    * Create a diagram zoom event.
    *
@@ -3978,7 +3996,7 @@ class Qo extends Dt {
     ), this.coords = t, this.zoom = e;
   }
 }
-class pt extends Dt {
+class pt extends Yt {
   /**
    * Create a diagram double click event.
    *
@@ -3993,7 +4011,7 @@ class pt extends Dt {
     ), this.cause = t, this.target = e, this.coords = a;
   }
 }
-class mt extends Dt {
+class mt extends Yt {
   /**
    * Create a diagram secondary click event.
    *
@@ -4008,7 +4026,7 @@ class mt extends Dt {
     ), this.cause = t, this.target = e, this.coords = a;
   }
 }
-class G extends Dt {
+class G extends Yt {
   /**
    * Create a diagram selection event.
    *
@@ -4022,7 +4040,7 @@ class G extends Dt {
     ), this.targets = t, this.selected = e;
   }
 }
-class Q extends Dt {
+class Q extends Yt {
   /**
    * Create a diagram highlight event.
    *
@@ -4035,7 +4053,7 @@ class Q extends Dt {
     ), this.target = t;
   }
 }
-class qe extends It {
+class to extends At {
   constructor(t, e, a, l, r, i, n, o, d = "floating", c = "floating") {
     if (t.objects.get(o) !== void 0)
       throw new Error(`DiagramDecorator with id "${o}" already exists`);
@@ -4064,7 +4082,7 @@ class qe extends It {
     return this.priority;
   }
 }
-class ti extends ft {
+class ii extends ft {
   /**
    * Instance a set of decorators for the given model. This method is used internally.
    * @private
@@ -4084,7 +4102,7 @@ class ti extends ft {
    * @returns The instanced decorator.
    */
   new(t, e, a, l, r, i, n, o = "floating", d = "floating") {
-    const c = new qe(
+    const c = new to(
       this.model,
       t,
       e,
@@ -4100,10 +4118,10 @@ class ti extends ft {
   }
   remove(t) {
     const e = this.get(t, !0);
-    e && ((e.rootElement instanceof z || e.rootElement instanceof D) && Y(e.rootElement.decorators, e), super.remove(t), e.updateInView());
+    e && ((e.rootElement instanceof z || e.rootElement instanceof F) && B(e.rootElement.decorators, e), super.remove(t), e.updateInView());
   }
 }
-class ei extends It {
+class si extends At {
   constructor(t, e, a, l, r, i, n) {
     if (t.objects.get(n) !== void 0)
       throw new Error(`DiagramObject with id "${n}" already exists`);
@@ -4132,7 +4150,7 @@ class ei extends It {
     return this.priority;
   }
 }
-class oi extends ft {
+class ni extends ft {
   /**
    * Instance a set of objects for the given model. This method is used internally.
    * @private
@@ -4152,7 +4170,7 @@ class oi extends ft {
    * @returns The instanced object.
    */
   new(t, e, a, l, r, i) {
-    const n = new ei(
+    const n = new si(
       this.model,
       t,
       e,
@@ -4168,9 +4186,9 @@ class oi extends ft {
     e && (super.remove(t), e.updateInView());
   }
 }
-class Je {
+class eo {
   constructor(t, e, a, l, r, i = []) {
-    this.nodes = new _o(this), this.sections = new Ho(this), this.ports = new Yo(this), this.connections = new No(this), this.fields = new Po(this), this.objects = new oi(this), this.decorators = new ti(this), this.canvas = t, this.id = e, this.name = a, this.description = l, this.type = r, this.createdAt = /* @__PURE__ */ new Date(), this.updatedAt = /* @__PURE__ */ new Date(), this.logicalClock = 0, this.valueSet = new yt(new ee(i), this);
+    this.nodes = new Uo(this), this.sections = new Fo(this), this.ports = new Wo(this), this.connections = new Ro(this), this.fields = new Vo(this), this.objects = new ni(this), this.decorators = new ii(this), this.canvas = t, this.id = e, this.name = a, this.description = l, this.type = r, this.createdAt = /* @__PURE__ */ new Date(), this.updatedAt = /* @__PURE__ */ new Date(), this.logicalClock = 0, this.valueSet = new yt(new oe(i), this);
   }
   /**
    * Deletes everything in this diagram.
@@ -4180,7 +4198,7 @@ class Je {
     this.canvas?.cancelAllUserActions(), this.id = void 0, this.name = "", this.description = void 0, this.createdAt = /* @__PURE__ */ new Date(), this.updatedAt = /* @__PURE__ */ new Date(), this.logicalClock = 0, this.nodes.clear(), this.sections.clear(), this.ports.clear(), this.connections.clear(), this.fields.clear(), this.objects.clear(), this.decorators.clear(), this.valueSet.resetValues(), this.canvas?.updateModelInView();
   }
 }
-const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => po(
+const vt = (s) => !!s.button, ce = (s, t, e, a, l, r, i, n) => yo(
   s,
   [t, e],
   a,
@@ -4193,18 +4211,38 @@ const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => po(
   ) * r
 ), S = (s) => {
   s ? x.select("body").style("cursor", s) : x.select("body").style("cursor", L.Auto);
-}, ct = (s) => s instanceof z ? s : s instanceof D ? s.node || s : s.rootElement instanceof z || s.rootElement instanceof D || s.rootElement instanceof bt ? ct(s.rootElement) : s, ce = (s) => {
+}, ct = (s) => s instanceof z ? s : s instanceof F ? s.node || s : s.rootElement instanceof z || s.rootElement instanceof F || s.rootElement instanceof bt ? ct(s.rootElement) : s, ye = (s) => {
+  if (s instanceof z)
+    return s.type.resizableX !== !1;
+  if (s instanceof F) {
+    if (s.type !== void 0)
+      return s.type.resizableX !== !1;
+    if (s.node !== void 0)
+      return ye(s.node);
+  }
+  return !1;
+}, be = (s) => {
+  if (s instanceof z)
+    return s.type.resizableY !== !1;
+  if (s instanceof F) {
+    if (s.type !== void 0)
+      return s.type.resizableY !== !1;
+    if (s.node !== void 0)
+      return be(s.node);
+  }
+  return !1;
+}, he = (s) => {
   s.filter(".shaped-look").append("path"), s.filter(".image-look").append("image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "top-left-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "top-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "top-right-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "left-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "center-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "right-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "bottom-left-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "bottom-image").attr("preserveAspectRatio", "none"), s.filter(".stretchable-image-look").append("image").attr("class", "bottom-right-image").attr("preserveAspectRatio", "none");
 }, zt = {
   fillColor: "#FFFFFF",
   borderColor: "#000000",
   borderThickness: 1,
-  borderStyle: be.Solid
-}, he = (s) => {
+  borderStyle: Se.Solid
+}, ge = (s) => {
   s.filter(".shaped-look").select("path").attr(
     "d",
-    (t) => me(
-      t.look.shape || Tt.Rectangle,
+    (t) => ve(
+      t.look.shape || Mt.Rectangle,
       0,
       0,
       t.width,
@@ -4221,7 +4259,7 @@ const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => po(
     (t) => `${t.look.borderThickness || zt.borderThickness}px`
   ).attr(
     "stroke-dasharray",
-    (t) => pe(
+    (t) => me(
       t.look.borderStyle || zt.borderStyle,
       t.type?.defaultLook?.borderThickness || t.look?.borderThickness || zt.borderThickness
     )
@@ -4262,13 +4300,13 @@ const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => po(
     "href",
     (t) => t.look.backgroundImageBottomRight
   );
-}, Vt = {
+}, Rt = {
   style: "dots",
   color: "rgba(0, 0, 0, 0.1)",
   snap: !1,
   spacing: 10,
   thickness: 0.05
-}, ii = (s, t, e) => {
+}, ri = (s, t, e) => {
   const a = t.append("defs");
   if (s.gridSize > 0 && isFinite(s.gridSize)) {
     const l = a.append("pattern").attr("id", e).attr("x", -s.gridSize / 2).attr("y", -s.gridSize / 2).attr("width", s.gridSize).attr("height", s.gridSize).attr("patternUnits", "userSpaceOnUse");
@@ -4288,17 +4326,17 @@ const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => po(
     }
     t.select("rect").attr("fill", `url(#${e})`);
   }
-}, ve = 96, j = 32, xt = ve + j, si = Math.PI / 4, ni = 100, Pe = {
+}, ke = 96, j = 32, xt = ke + j, ai = Math.PI / 4, li = 100, Ve = {
   customButtons: []
 };
-class ri {
+class di {
   /**
    * Constructs a context menu object.
    * @public
    * @param canvas A canvas.
    */
   constructor(t, e) {
-    this.canvas = t, this.config = e || Pe;
+    this.canvas = t, this.config = e || Ve;
   }
   /**
    * Opens the context menu at the location determined by the given mouse event.
@@ -4341,7 +4379,7 @@ class ri {
         i.userSelection.removeFromModel(), i.cancelAllUserActions();
       }
     });
-    for (const i of this.config.customButtons || Pe.customButtons)
+    for (const i of this.config.customButtons || Ve.customButtons)
       (i.condition === void 0 || i.condition(this.canvas)) && r.push(i);
     r.length === 0 && r.push({
       name: "NONE",
@@ -4349,7 +4387,7 @@ class ri {
       onPress: void 0
     });
     for (let i = 0; i < r.length; ++i) {
-      const n = r[i], o = n.onPress, d = (i + 0.5 - r.length / 2) * si, c = l.append("xhtml:div").attr(
+      const n = r[i], o = n.onPress, d = (i + 0.5 - r.length / 2) * ai, c = l.append("xhtml:div").attr(
         "class",
         `daga-context-menu-button ${n.onPress !== void 0 ? " daga-clickable" : ""}`
       ).attr("tabindex", 0).style("position", "absolute").style("box-sizing", "border-box").style("width", `${2 * j}px`).style("height", `${2 * j}px`).style("border-radius", `${j}px`).style("pointer-events", "auto").on($.Click, (h) => {
@@ -4357,14 +4395,14 @@ class ri {
       }).on($.KeyDown, (h) => {
         o && h.key === Z.Enter && (h.preventDefault(), o(this.canvas));
       });
-      n.imageClass !== void 0 ? c.append("xhtml:div").style("position", "absolute").style("left", `${0.75 * j}px`).style("top", `${0.5 * j}px`).style("width", `${0.5 * j}px`).style("height", `${0.5 * j}px`).style("background-size", "contain").style("background-repeat", "no-repeat").attr("class", n.imageClass) : n.image !== void 0 && c.append("xhtml:img").style("position", "absolute").style("left", `${0.75 * j}px`).style("top", `${0.5 * j}px`).style("width", `${0.5 * j}px`).style("height", `${0.5 * j}px`).attr("src", n.image), c.append("xhtml:span").style("position", "absolute").style("left", `${0.2 * j}px`).style("top", `${1.1 * j}px`).style("text-align", "center").style("width", `${1.6 * j}px`).style("height", `${0.35 * j}px`).style("margin", "0").style("font-size", `${0.35 * j}px`).style("font-weight", "700").style("user-select", "none").text(n.name), c.transition().ease(x.easeLinear).duration(ni).tween("progress", () => (h) => {
+      n.imageClass !== void 0 ? c.append("xhtml:div").style("position", "absolute").style("left", `${0.75 * j}px`).style("top", `${0.5 * j}px`).style("width", `${0.5 * j}px`).style("height", `${0.5 * j}px`).style("background-size", "contain").style("background-repeat", "no-repeat").attr("class", n.imageClass) : n.image !== void 0 && c.append("xhtml:img").style("position", "absolute").style("left", `${0.75 * j}px`).style("top", `${0.5 * j}px`).style("width", `${0.5 * j}px`).style("height", `${0.5 * j}px`).attr("src", n.image), c.append("xhtml:span").style("position", "absolute").style("left", `${0.2 * j}px`).style("top", `${1.1 * j}px`).style("text-align", "center").style("width", `${1.6 * j}px`).style("height", `${0.35 * j}px`).style("margin", "0").style("font-size", `${0.35 * j}px`).style("font-weight", "700").style("user-select", "none").text(n.name), c.transition().ease(x.easeLinear).duration(li).tween("progress", () => (h) => {
         const f = d * h;
         return c.style(
           "left",
-          `${Math.sin(f) * ve - j + xt}px`
+          `${Math.sin(f) * ke - j + xt}px`
         ).style(
           "top",
-          `${-Math.cos(f) * ve - j + xt}px`
+          `${-Math.cos(f) * ke - j + xt}px`
         );
       });
     }
@@ -4377,7 +4415,7 @@ class ri {
     this.contextMenuContainer?.remove(), this.contextMenuContainer = void 0;
   }
 }
-class ai extends ft {
+class ci extends ft {
   /**
    * Constructs a user highlight object.
    * @public
@@ -4399,7 +4437,7 @@ class ai extends ft {
    * @param element
    */
   focusOn(t) {
-    this.clear(), this.focus = t, (t instanceof ht || t instanceof qe) && t.rootElement ? this.focusOn(t.rootElement) : this.add(t);
+    this.clear(), this.focus = t, (t instanceof ht || t instanceof to) && t.rootElement ? this.focusOn(t.rootElement) : this.add(t);
   }
   add(t) {
     if (super.add(t), t instanceof z) {
@@ -4413,7 +4451,7 @@ class ai extends ft {
       for (const e of t.ports)
         super.add(e), this.canvas.updatePortsInView(e.id);
       t.label && (super.add(t.label), this.canvas.updateFieldsInView(t.label.id)), this.canvas.updateNodesInView(t.id);
-    } else if (t instanceof D)
+    } else if (t instanceof F)
       if (!this.highlightSections && t.node)
         this.add(t.node);
       else {
@@ -4431,13 +4469,13 @@ class ai extends ft {
     this.focus = void 0;
   }
 }
-const li = 1;
-class Qe {
+const hi = 1;
+class oo {
   export(t, e = !1) {
     const a = {
       name: t.name,
       type: t.type,
-      typeVersion: li,
+      typeVersion: hi,
       createdAt: t.createdAt,
       updatedAt: t.updatedAt,
       nodes: [],
@@ -4470,8 +4508,8 @@ class Qe {
         n.push({
           id: o.id,
           type: o.type?.id,
-          coords: At(o.coords),
-          connectionPoint: At(o.connectionPoint || o.coords),
+          coords: It(o.coords),
+          connectionPoint: It(o.connectionPoint || o.coords),
           direction: o.direction,
           label: o.label?.text || "",
           ...e ? {
@@ -4489,7 +4527,7 @@ class Qe {
         label: i.label?.text || "",
         indexXInNode: i.indexXInNode,
         indexYInNode: i.indexYInNode,
-        coords: At(i.coords),
+        coords: It(i.coords),
         width: i.width,
         height: i.height,
         ...e ? {
@@ -4507,8 +4545,8 @@ class Qe {
       r.push({
         id: i.id,
         type: i.type?.id,
-        coords: At(i.coords),
-        connectionPoint: At(i.connectionPoint || i.coords),
+        coords: It(i.coords),
+        connectionPoint: It(i.connectionPoint || i.coords),
         direction: i.direction,
         label: i.label?.text || "",
         ...e ? {
@@ -4527,7 +4565,7 @@ class Qe {
       sections: l,
       ports: r,
       label: t.label?.text || "",
-      coords: At(t.coords),
+      coords: It(t.coords),
       width: t.width,
       height: t.height,
       data: t.valueSet.getValues(),
@@ -4575,20 +4613,20 @@ class Qe {
     } : {};
   }
 }
-const di = "Diagram properties";
-class ci extends ft {
+const gi = "Diagram properties";
+class fi extends ft {
   /**
    * Constructs a user selection object.
    * @public
    * @param canvas A canvas.
    */
   constructor(t, e) {
-    super(), this.canvas = t, this.canvas.propertyEditorChanges$.pipe(lo(2e3)).subscribe(() => {
+    super(), this.canvas = t, this.canvas.propertyEditorChanges$.pipe(go(2e3)).subscribe(() => {
       this.makeUpdateValuesAction();
-    }), this.diagramPropertiesText = e !== void 0 ? e : di;
+    }), this.diagramPropertiesText = e !== void 0 ? e : gi;
   }
   add(t) {
-    if (!this.contains(t.id) && (this.length === 0 ? this.propertyEditorSelection === void 0 && (t instanceof z || t instanceof dt) ? this.openInPropertyEditor(t) : this.propertyEditorSelection === void 0 && t instanceof D ? this.openInPropertyEditor(t.node) : this.openInPropertyEditor(void 0) : this.openInPropertyEditor(void 0), super.add(t), t.updateInView(), t instanceof z && t.sections))
+    if (!this.contains(t.id) && (this.length === 0 ? this.propertyEditorSelection === void 0 && (t instanceof z || t instanceof dt) ? this.openInPropertyEditor(t) : this.propertyEditorSelection === void 0 && t instanceof F ? this.openInPropertyEditor(t.node) : this.openInPropertyEditor(void 0) : this.openInPropertyEditor(void 0), super.add(t), t.updateInView(), t instanceof z && t.sections))
       for (const e of t.sections)
         super.add(e), e.updateInView();
   }
@@ -4633,8 +4671,8 @@ class ci extends ft {
     if (this.length > 0) {
       const t = [], e = [], a = [], l = [], r = [];
       for (const n of this.all())
-        n instanceof z ? t.push(n.id) : n instanceof D ? e.push(n.id) : n instanceof bt ? a.push(n.id) : n instanceof dt ? l.push(n.id) : n instanceof ht && r.push(n.id);
-      const i = new qo(
+        n instanceof z ? t.push(n.id) : n instanceof F ? e.push(n.id) : n instanceof bt ? a.push(n.id) : n instanceof dt ? l.push(n.id) : n instanceof ht && r.push(n.id);
+      const i = new ti(
         this.canvas,
         t,
         e,
@@ -4650,7 +4688,7 @@ class ci extends ft {
    * @public
    */
   copyToClipboard() {
-    const t = { type: "daga-user-selection", nodes: [], connections: [] }, e = new Qe();
+    const t = { type: "daga-user-selection", nodes: [], connections: [] }, e = new oo();
     for (const a of this.all())
       a instanceof z && t.nodes.push(e.exportNode(a, !1)), a instanceof dt && t.connections.push(
         e.exportConnection(a, !1)
@@ -4674,7 +4712,7 @@ class ci extends ft {
         const a = JSON.parse(e);
         if (a.type !== "daga-user-selection")
           return;
-        const l = new Jo(
+        const l = new ei(
           this.canvas,
           a.nodes,
           a.connections,
@@ -4705,17 +4743,17 @@ class ci extends ft {
   makeUpdateValuesAction() {
     if (this.propertyEditorSelection === void 0 || this.propertyEditorValues === void 0)
       return;
-    const t = this.propertyEditorSelection instanceof Je ? void 0 : this.propertyEditorSelection.id;
+    const t = this.propertyEditorSelection instanceof eo ? void 0 : this.propertyEditorSelection.id;
     if (St(
       this.propertyEditorValues,
       this.propertyEditorSelection?.valueSet.getValues()
     ))
       return;
-    const e = this.propertyEditorValues, a = Nt(this.propertyEditorSelection?.valueSet.getValues()), [l, r] = Ue(
+    const e = this.propertyEditorValues, a = Nt(this.propertyEditorSelection?.valueSet.getValues()), [l, r] = Be(
       e,
       a,
       this.propertyEditorSelection?.valueSet
-    ), i = new Ko(
+    ), i = new Qo(
       this.canvas,
       t,
       l,
@@ -4724,10 +4762,10 @@ class ci extends ft {
     i.do(), this.canvas.actionStack.add(i), this.propertyEditorValues = a;
   }
 }
-const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
-  const a = hi(e), l = Math.sin(a), r = Math.cos(a), i = (Math.abs(s * r) - Math.abs(t * l)) / (r * r - l * l), n = (Math.abs(s * l) - Math.abs(t * r)) / (l * l - r * r);
+const ui = (s) => s * Math.PI / 180, Oe = (s, t, e) => {
+  const a = ui(e), l = Math.sin(a), r = Math.cos(a), i = (Math.abs(s * r) - Math.abs(t * l)) / (r * r - l * l), n = (Math.abs(s * l) - Math.abs(t * r)) / (l * l - r * r);
   return [i, n];
-}, gi = (s) => /^((?!chrome|android).)*safari/i.test(s), Ve = gi(navigator.userAgent), fi = 12, H = 6, ui = 25, ge = "diagram-connection-unfinished", Qt = class Qt {
+}, pi = (s) => /^((?!chrome|android).)*safari/i.test(s), He = pi(navigator.userAgent), mi = 12, H = 6, vi = 25, fe = "diagram-connection-unfinished", te = class te {
   /**
    * Constructs a canvas object.
    * @public
@@ -4735,24 +4773,24 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
    * @param config The configuration object used to set the parameters of this canvas.
    */
   constructor(t, e) {
-    if (this.backgroundPatternId = `daga-background-pattern-id-${Qt.canvasCount++}`, this.zoomTransform = x.zoomIdentity, this.draggingFrom = [0, 0], this.dragging = !1, this.secondaryButton = !1, this.validatorChange$ = new jt(), this.diagramChange$ = new jt(), this.diagramEvent$ = new jt(), this.propertyEditorChanges$ = new jt(), this.parentComponent = t, this.model = new Je(
+    if (this.backgroundPatternId = `daga-background-pattern-id-${te.canvasCount++}`, this.zoomTransform = x.zoomIdentity, this.draggingFrom = [0, 0], this.dragging = !1, this.secondaryButton = !1, this.validatorChange$ = new Wt(), this.diagramChange$ = new Wt(), this.diagramEvent$ = new Wt(), this.propertyEditorChanges$ = new Wt(), this.parentComponent = t, this.model = new eo(
       this,
       void 0,
       e.name || "unnamed",
       "",
       e.type || "",
       e.properties || []
-    ), this.userSelection = new ci(
+    ), this.userSelection = new fi(
       this,
       e.components?.propertyEditor?.title
-    ), this.userHighlight = new ai(
+    ), this.userHighlight = new ci(
       this,
       e.canvas?.highlightSections !== !1
-    ), this.contextMenu = new ri(this, e.canvas?.contextMenu), this.backgroundColor = e.canvas?.backgroundColor || "#FFFFFF", this.gridStyle = e.canvas?.grid?.style ?? Vt.style, this.gridSize = e.canvas?.grid?.enabled === !1 || e.canvas?.grid === void 0 ? 0 : Math.abs(e.canvas?.grid?.spacing || Vt.spacing), this.gridThickness = Math.abs(
-      e.canvas?.grid?.thickness || Vt.thickness
-    ), this.gridColor = e.canvas?.grid?.color || Vt.color, this.snapToGrid = e.canvas?.grid?.enabled === !1 || e.canvas?.grid === void 0 ? !1 : e.canvas?.grid?.snap || Vt.snap, this.zoomFactor = e.canvas?.zoomFactor || 2, this.panRate = e.canvas?.panRate || 100, this.inferConnectionType = e.connectionSettings?.inferConnectionType || !1, this.autoTightenConnections = e.connectionSettings?.autoTighten !== !1, this.allowConnectionLoops = e.connectionSettings?.allowLoops || !1, this.allowSharingPorts = e.connectionSettings?.sharePorts !== !1, this.allowSharingBothPorts = e.connectionSettings?.shareBothPorts || !1, this.portHighlightRadius = e.connectionSettings?.portHighlightRadius || 100, this.multipleSelectionOn = !1, this.priorityThresholds = e.canvas?.priorityThresholds || [], this.priorityThreshold = this.priorityThresholds ? this.priorityThresholds[0] : void 0, this.layoutFormat = e.layoutFormat, this.userActions = e.userActions || {}, this.validators = [], this.actionStack = new jo(this, ui), this.collabEngine = new Xo(this), e.nodeTypes)
+    ), this.contextMenu = new di(this, e.canvas?.contextMenu), this.backgroundColor = e.canvas?.backgroundColor || "#FFFFFF", this.gridStyle = e.canvas?.grid?.style ?? Rt.style, this.gridSize = e.canvas?.grid?.enabled === !1 || e.canvas?.grid === void 0 ? 0 : Math.abs(e.canvas?.grid?.spacing || Rt.spacing), this.gridThickness = Math.abs(
+      e.canvas?.grid?.thickness || Rt.thickness
+    ), this.gridColor = e.canvas?.grid?.color || Rt.color, this.snapToGrid = e.canvas?.grid?.enabled === !1 || e.canvas?.grid === void 0 ? !1 : e.canvas?.grid?.snap || Rt.snap, this.zoomFactor = e.canvas?.zoomFactor || 2, this.panRate = e.canvas?.panRate || 100, this.inferConnectionType = e.connectionSettings?.inferConnectionType || !1, this.autoTightenConnections = e.connectionSettings?.autoTighten !== !1, this.allowConnectionLoops = e.connectionSettings?.allowLoops || !1, this.allowSharingPorts = e.connectionSettings?.sharePorts !== !1, this.allowSharingBothPorts = e.connectionSettings?.shareBothPorts || !1, this.portHighlightRadius = e.connectionSettings?.portHighlightRadius || 100, this.multipleSelectionOn = !1, this.priorityThresholds = e.canvas?.priorityThresholds || [], this.priorityThreshold = this.priorityThresholds ? this.priorityThresholds[0] : void 0, this.layoutFormat = e.layoutFormat, this.userActions = e.userActions || {}, this.validators = [], this.actionStack = new Ko(this, vi), this.collabEngine = new Zo(this), e.nodeTypes)
       for (const a of e.nodeTypes) {
-        const l = new Ye({
+        const l = new We({
           ...e.nodeTypeDefaults,
           ...a
         });
@@ -4760,7 +4798,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     if (e.portTypes)
       for (const a of e.portTypes) {
-        const l = new Bo({
+        const l = new jo({
           ...e.portTypeDefaults,
           ...a
         });
@@ -4768,7 +4806,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     if (e.connectionTypes) {
       for (const a of e.connectionTypes) {
-        const l = new De({
+        const l = new Xe({
           ...e.connectionTypeDefaults,
           ...a
         });
@@ -4789,7 +4827,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     this.validators.push(t), this.validatorChange$.next();
   }
   removeValidator(t) {
-    Y(this.validators, t), this.validatorChange$.next();
+    B(this.validators, t), this.validatorChange$.next();
   }
   getPriorityThresholdOptions() {
     return this.priorityThresholds;
@@ -4856,7 +4894,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     });
     const a = this.selectSVGElement().append("g").attr("class", "daga-canvas-view").attr("width", "100%").attr("height", "100%");
     a.call(
-      this.zoomBehavior = x.zoom().filter((l) => l.type !== $.DoubleClick).on(fe.Zoom, (l) => {
+      this.zoomBehavior = x.zoom().filter((l) => l.type !== $.DoubleClick).on(ue.Zoom, (l) => {
         if (l.sourceEvent) {
           if (!this.canUserPerformAction(w.Zoom)) {
             S(L.NotAllowed);
@@ -4869,13 +4907,13 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         this.selectCanvasElements().attr("transform", r), x.select(`#${this.backgroundPatternId}`).attr(
           "patternTransform",
           r
-        ), Ve && this.updateFieldsInView(), this.contextMenu.close(), this.diagramEvent$.next(
-          new Qo(
+        ), He && this.updateFieldsInView(), this.contextMenu.close(), this.diagramEvent$.next(
+          new oi(
             [this.zoomTransform.x, this.zoomTransform.y],
             this.zoomTransform.k
           )
         );
-      }).on(fe.End, () => {
+      }).on(ue.End, () => {
         S();
       })
     ), a.append("rect").attr("x", 0).attr("y", 0).attr("width", "100%").attr("height", "100%").attr("fill", this.backgroundColor).attr("stroke-width", "0").on($.MouseMove, (l) => {
@@ -4894,14 +4932,14 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
       this.userSelection.openInPropertyEditor(this.model);
     }).call(
-      x.drag().filter((l) => this.multipleSelectionOn || vt(l)).on(I.Start, (l) => {
+      x.drag().filter((l) => this.multipleSelectionOn || vt(l)).on(A.Start, (l) => {
         this.startMultipleSelection(l);
-      }).on(I.Drag, (l) => {
+      }).on(A.Drag, (l) => {
         this.continueMultipleSelection(l);
-      }).on(I.End, (l) => {
+      }).on(A.End, (l) => {
         this.finishMultipleSelection(l);
       })
-    ), ii(this, a, this.backgroundPatternId), a.append("g").attr("class", "daga-canvas-elements");
+    ), ri(this, a, this.backgroundPatternId), a.append("g").attr("class", "daga-canvas-elements");
   }
   getZoomLevel() {
     return this.zoomTransform.k;
@@ -4913,7 +4951,11 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     isNaN(t) || this.zoomBehavior.scaleTo(this.selectCanvasView(), t);
   }
   getViewCoordinates() {
-    return [this.zoomTransform.x, this.zoomTransform.y];
+    const t = this.selectCanvasView()?.select("rect")?.node()?.getBBox();
+    return [
+      ((t.width + t.x) / 2 - this.zoomTransform.x) / this.zoomTransform.k,
+      ((t.height + t.y) / 2 - this.zoomTransform.y) / this.zoomTransform.k
+    ];
   }
   translateBy(t, e) {
     !isNaN(t) && !isNaN(e) && this.zoomBehavior.translateBy(this.selectCanvasView(), t, e);
@@ -4921,14 +4963,34 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
   translateTo(t, e) {
     !isNaN(t) && !isNaN(e) && this.zoomBehavior.translateTo(this.selectCanvasView(), t, e);
   }
-  center() {
+  zoomAndPanTo(t, e, a, l) {
+    if (!l || l <= 0) {
+      this.zoomBehavior.scaleTo(this.selectCanvasView(), a), this.zoomBehavior.translateTo(this.selectCanvasView(), t, e);
+      return;
+    }
+    this.zoomBehavior.interpolate(x.interpolate);
+    const [r, i] = this.getViewCoordinates(), n = this.getZoomLevel(), o = t, d = e, c = a;
+    this.selectCanvasElements().transition().duration(l).ease(x.easeCubicInOut).tween("progress", () => (h) => {
+      const f = h * (o - r) + r, b = h * (d - i) + i, m = h * (c - n) + n;
+      this.zoomBehavior.scaleTo(this.selectCanvasView(), m), this.zoomBehavior.translateTo(
+        this.selectCanvasView(),
+        f,
+        b
+      );
+    });
+  }
+  center(t, e, a) {
     if (this.model.nodes.length > 0) {
-      const t = this.selectCanvasView().select("rect").node()?.getBBox(), e = this.model.nodes.all(), a = Math.min(...e.map((m) => m.coords[0])), l = Math.max(
-        ...e.map((m) => m.coords[0] + m.width)
-      ), r = (a + l) / 2, i = l - a, n = t.width, o = Math.min(...e.map((m) => m.coords[1])), d = Math.max(
-        ...e.map((m) => m.coords[1] + m.height)
-      ), c = (o + d) / 2, h = d - o, f = t.height, y = Math.min(n / i, f / h, 1);
-      this.translateTo(r, c), this.zoomTo(y);
+      const l = this.selectCanvasView().select("rect").node()?.getBBox(), r = t?.map((y) => this.model.nodes.get(y)).filter((y) => !!y) || this.model.nodes.all(), i = Math.min(...r.map((y) => y.coords[0])), n = Math.max(
+        ...r.map((y) => y.coords[0] + y.width)
+      ), o = (i + n) / 2, d = n - i, c = l.width, h = Math.min(...r.map((y) => y.coords[1])), f = Math.max(
+        ...r.map((y) => y.coords[1] + y.height)
+      ), b = (h + f) / 2, m = f - h, p = l.height, u = Math.min(
+        c / d,
+        p / m,
+        e !== void 0 ? e : 1
+      );
+      this.zoomAndPanTo(o, b, u, a);
     }
   }
   getClosestGridPoint(t) {
@@ -5003,7 +5065,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     );
     const a = e.exit(), l = e.enter().append("g").attr("id", (i) => i.id).attr(
       "class",
-      (i) => `diagram-node${i.type.resizableX ? " resizable-x" : ""}${i.type.resizableY ? " resizable-y" : ""} ${i.type.defaultLook.lookType}`
+      (i) => `diagram-node${ye(i) ? " resizable-x" : ""}${be(i) ? " resizable-y" : ""} ${i.type.defaultLook.lookType}`
     );
     t && t.length > 0 && (e = e.filter((i) => t.includes(i.id)));
     const r = l.merge(e);
@@ -5028,35 +5090,35 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       const o = new pt(i, n);
       this.diagramEvent$.next(o);
     }).call(
-      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(I.Start, (i, n) => {
+      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(A.Start, (i, n) => {
         this.multipleSelectionOn || this.secondaryButton ? this.startMultipleSelection(i) : this.startMovingNode(i, n);
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         this.multipleSelectionOn || this.secondaryButton ? this.continueMultipleSelection(i) : this.continueMovingNode(i, n);
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         this.multipleSelectionOn || this.secondaryButton ? this.finishMultipleSelection(i) : this.finishMovingNode(i, n), this.secondaryButton = !1;
       })
-    ), ce(
+    ), he(
       l
     ), l.filter(".resizable-x").append("line").attr("class", "left-resizer").attr("stroke", "transparent").attr("stroke-width", `${H}px`).on($.MouseOver, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed && S(L.EWResize);
+      this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed && S(L.EWResize);
     }).on($.MouseOut, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed && S();
+      this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
-        this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed ? (S(L.EWResize), this.currentAction = new X(
+      x.drag().on(A.Start, (i, n) => {
+        this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed ? (S(L.EWResize), this.currentAction = new X(
           this,
           w.StretchNode,
           n.id,
           n.getGeometry(),
           n.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed) {
+      }).on(A.Drag, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.stretch(g.Left, n.coords[0] - o[0]);
         }
-      }).on(I.End, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
+      }).on(A.End, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint([
             o[0] - n.type.snapToGridOffset[0],
@@ -5066,25 +5128,25 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         S();
       })
     ), l.filter(".resizable-y").append("line").attr("class", "top-resizer").attr("stroke", "transparent").attr("stroke-width", `${H}px`).on($.MouseOver, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed && S(L.NSResize);
+      this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed && S(L.NSResize);
     }).on($.MouseOut, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed && S();
+      this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
-        this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed ? (S(L.NSResize), this.currentAction = new X(
+      x.drag().on(A.Start, (i, n) => {
+        this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed ? (S(L.NSResize), this.currentAction = new X(
           this,
           w.StretchNode,
           n.id,
           n.getGeometry(),
           n.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed) {
+      }).on(A.Drag, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.stretch(g.Top, n.coords[1] - o[1]);
         }
-      }).on(I.End, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
+      }).on(A.End, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint([
             o[0] - n.type.snapToGridOffset[0],
@@ -5094,25 +5156,25 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         S();
       })
     ), l.filter(".resizable-x").append("line").attr("class", "right-resizer").attr("stroke", "transparent").attr("stroke-width", `${H}px`).on($.MouseOver, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed && S(L.EWResize);
+      this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed && S(L.EWResize);
     }).on($.MouseOut, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed && S();
+      this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
-        this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed ? (S(L.EWResize), this.currentAction = new X(
+      x.drag().on(A.Start, (i, n) => {
+        this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed ? (S(L.EWResize), this.currentAction = new X(
           this,
           w.StretchNode,
           n.id,
           n.getGeometry(),
           n.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed) {
+      }).on(A.Drag, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.stretch(g.Right, o[0] - (n.coords[0] + n.width));
         }
-      }).on(I.End, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableX && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
+      }).on(A.End, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableX() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint([
             o[0] - n.type.snapToGridOffset[2],
@@ -5122,28 +5184,28 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         S();
       })
     ), l.filter(".resizable-y").append("line").attr("class", "bottom-resizer").attr("stroke", "transparent").attr("stroke-width", `${H}px`).on($.MouseOver, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed && S(L.NSResize);
+      this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed && S(L.NSResize);
     }).on($.MouseOut, (i, n) => {
-      this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed && S();
+      this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
-        this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed ? (S(L.NSResize), this.currentAction = new X(
+      x.drag().on(A.Start, (i, n) => {
+        this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed ? (S(L.NSResize), this.currentAction = new X(
           this,
           w.StretchNode,
           n.id,
           n.getGeometry(),
           n.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed) {
+      }).on(A.Drag, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.stretch(
             g.Bottom,
             o[1] - (n.coords[1] + n.height)
           );
         }
-      }).on(I.End, (i, n) => {
-        if (this.canUserPerformAction(w.StretchNode) && n.type.resizableY && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
+      }).on(A.End, (i, n) => {
+        if (this.canUserPerformAction(w.StretchNode) && n.getResizableY() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchNode) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && this.snapToGrid && (o = this.getClosestGridPoint([
             o[0] - n.type.snapToGridOffset[2],
@@ -5155,9 +5217,9 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         }
         S();
       })
-    ), r.attr("transform", (i) => `translate(${i.coords[0]},${i.coords[1]})`).attr("opacity", (i) => i.removed ? 0.5 : 1), he(
+    ), r.attr("transform", (i) => `translate(${i.coords[0]},${i.coords[1]})`).attr("opacity", (i) => i.removed ? 0.5 : 1), ge(
       r
-    ), r.filter(".resizable-x").select("line.left-resizer").attr("x1", H / 2).attr("x2", H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.top-resizer").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", H / 2).attr("y2", H / 2), r.filter(".resizable-x").select("line.right-resizer").attr("x1", (i) => i.width - H / 2).attr("x2", (i) => i.width - H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.bottom-resizer").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", (i) => i.height - H / 2).attr("y2", (i) => i.height - H / 2);
+    ), r.filter(".resizable-x").select("line.left-resizer").style("pointer-events", (i) => i.getResizableX() ? "initial" : "none").attr("x1", H / 2).attr("x2", H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.top-resizer").style("pointer-events", (i) => i.getResizableY() ? "initial" : "none").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", H / 2).attr("y2", H / 2), r.filter(".resizable-x").select("line.right-resizer").style("pointer-events", (i) => i.getResizableX() ? "initial" : "none").attr("x1", (i) => i.width - H / 2).attr("x2", (i) => i.width - H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.bottom-resizer").style("pointer-events", (i) => i.getResizableY() ? "initial" : "none").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", (i) => i.height - H / 2).attr("y2", (i) => i.height - H / 2);
   }
   updateSectionsInView(...t) {
     let e = this.selectCanvasElements().selectAll("g.diagram-section").data(
@@ -5168,7 +5230,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     );
     const a = e.exit(), l = e.enter().append("g").attr("id", (i) => i.id).attr(
       "class",
-      (i) => `diagram-section${i.getResizableX() ? " resizable-x" : ""}${i.getResizableY() ? " resizable-y" : ""} ${i.look?.lookType}`
+      (i) => `diagram-section${ye(i) ? " resizable-x" : ""}${be(i) ? " resizable-y" : ""} ${i.look?.lookType}`
     );
     t && t.length > 0 && (e = e.filter((i) => t.includes(i.id)));
     const r = l.merge(e);
@@ -5205,21 +5267,21 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       const o = new pt(i, n);
       this.diagramEvent$.next(o);
     }).call(
-      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(I.Start, (i, n) => {
+      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(A.Start, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.startMultipleSelection(i);
         else {
           const o = n?.node;
           o ? this.startMovingNode(i, o) : S(L.NotAllowed);
         }
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.continueMultipleSelection(i);
         else {
           const o = n?.node;
           o ? this.continueMovingNode(i, o) : S(L.NotAllowed);
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.finishMultipleSelection(i);
         else {
@@ -5228,14 +5290,14 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         }
         this.secondaryButton = !1;
       })
-    ), ce(
+    ), he(
       l
     ), l.filter(".resizable-x").append("line").attr("class", "left-resizer").attr("stroke", "transparent").attr("stroke-width", `${H}px`).on($.MouseOver, (i, n) => {
       this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && S(L.EWResize);
     }).on($.MouseOut, (i, n) => {
       this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
+      x.drag().on(A.Start, (i, n) => {
         this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && n.node ? (S(L.EWResize), this.currentAction = new X(
           this,
           w.StretchSection,
@@ -5243,7 +5305,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           n.node.getGeometry(),
           n.node.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && n.node) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.node.stretchSections(
@@ -5253,7 +5315,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             n.indexYInNode
           );
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchSection && n.node) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint(o)), n.node.stretchSections(
@@ -5270,7 +5332,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     }).on($.MouseOut, (i, n) => {
       this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
+      x.drag().on(A.Start, (i, n) => {
         this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && n.node ? (S(L.NSResize), this.currentAction = new X(
           this,
           w.StretchSection,
@@ -5278,7 +5340,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           n.node.getGeometry(),
           n.node.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && n.node) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.node.stretchSections(
@@ -5288,7 +5350,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             n.indexYInNode
           );
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchSection && n.node) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint(o)), n.node.stretchSections(
@@ -5305,7 +5367,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     }).on($.MouseOut, (i, n) => {
       this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
+      x.drag().on(A.Start, (i, n) => {
         this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && n.node ? (S(L.EWResize), this.currentAction = new X(
           this,
           w.StretchSection,
@@ -5313,7 +5375,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           n.node.getGeometry(),
           n.node.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && n.node) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.node.stretchSections(
@@ -5323,7 +5385,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             n.indexYInNode
           );
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableX() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchSection && n.node) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint(o)), n.node.stretchSections(
@@ -5340,7 +5402,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     }).on($.MouseOut, (i, n) => {
       this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && S();
     }).call(
-      x.drag().on(I.Start, (i, n) => {
+      x.drag().on(A.Start, (i, n) => {
         this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && n.node ? (S(L.NSResize), this.currentAction = new X(
           this,
           w.StretchSection,
@@ -5348,7 +5410,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           n.node.getGeometry(),
           n.node.getGeometry()
         )) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && n.node) {
           const o = this.getPointerLocationRelativeToCanvas(i);
           n.node.stretchSections(
@@ -5358,7 +5420,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             n.indexYInNode
           );
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.canUserPerformAction(w.StretchSection) && n.getResizableY() && !n.removed && this.currentAction instanceof X && this.currentAction.intent === w.StretchSection && n.node) {
           let o = this.getPointerLocationRelativeToCanvas(i);
           this.snapToGrid && (o = this.getClosestGridPoint(o)), n.node.stretchSections(
@@ -5370,9 +5432,9 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         }
         S();
       })
-    ), r.attr("transform", (i) => `translate(${i.coords[0]},${i.coords[1]})`).attr("opacity", (i) => i.removed ? 0.5 : 1), he(
+    ), r.attr("transform", (i) => `translate(${i.coords[0]},${i.coords[1]})`).attr("opacity", (i) => i.removed ? 0.5 : 1), ge(
       r
-    ), r.filter(".resizable-x").select("line.left-resizer").attr("x1", H / 2).attr("x2", H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.top-resizer").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", H / 2).attr("y2", H / 2), r.filter(".resizable-x").select("line.right-resizer").attr("x1", (i) => i.width - H / 2).attr("x2", (i) => i.width - H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.bottom-resizer").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", (i) => i.height - H / 2).attr("y2", (i) => i.height - H / 2);
+    ), r.filter(".resizable-x").select("line.left-resizer").style("pointer-events", (i) => i.getResizableX() ? "initial" : "none").attr("x1", H / 2).attr("x2", H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.top-resizer").style("pointer-events", (i) => i.getResizableY() ? "initial" : "none").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", H / 2).attr("y2", H / 2), r.filter(".resizable-x").select("line.right-resizer").style("pointer-events", (i) => i.getResizableX() ? "initial" : "none").attr("x1", (i) => i.width - H / 2).attr("x2", (i) => i.width - H / 2).attr("y1", 0).attr("y2", (i) => i.height), r.filter(".resizable-y").select("line.bottom-resizer").style("pointer-events", (i) => i.getResizableY() ? "initial" : "none").attr("x1", 0).attr("x2", (i) => i.width).attr("y1", (i) => i.height - H / 2).attr("y2", (i) => i.height - H / 2);
   }
   updatePortsInView(...t) {
     let e = this.selectCanvasElements().selectAll("g.diagram-port").data(
@@ -5431,16 +5493,16 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       const o = new pt(i, n);
       this.diagramEvent$.next(o);
     }).call(
-      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(I.Start, (i, n) => {
+      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(A.Start, (i, n) => {
         this.multipleSelectionOn || this.secondaryButton ? this.startMultipleSelection(i) : this.canUserPerformAction(w.AddConnection) && (this.allowSharingPorts || n.incomingConnections.filter((o) => !o.removed).length === 0 && n.outgoingConnections.filter((o) => !o.removed).length === 0) && !n.removed ? (S(L.Grabbing), this.startConnection(n), this.unfinishedConnection && (this.unfinishedConnectionTracer = this.selectCanvasElements().append("path").attr("stroke", "none").attr("fill", "none"))) : S(L.NotAllowed);
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.continueMultipleSelection(i);
         else if (this.canUserPerformAction(w.AddConnection) && !n.removed && this.unfinishedConnection !== void 0) {
           const o = [i.x, i.y];
           this.unfinishedConnectionTracer?.attr(
             "d",
-            de(
+            ce(
               this.unfinishedConnection.look.shape || et.look.shape,
               this.unfinishedConnection.startCoords,
               o,
@@ -5465,17 +5527,17 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             ];
           } else
             this.unfinishedConnection.endCoords = o;
-          if (this.updateConnectionsInView(ge), this.model.ports.length > 0) {
+          if (this.updateConnectionsInView(fe), this.model.ports.length > 0) {
             const c = this.getPointerLocationRelativeToCanvas(i);
             let h = Number.POSITIVE_INFINITY, f;
-            for (const y of this.model.ports) {
-              const m = y.distanceTo(c);
-              m < h && (h = m, f = y);
+            for (const b of this.model.ports) {
+              const m = b.distanceTo(c);
+              m < h && (h = m, f = b);
             }
             f && h < this.portHighlightRadius ? this.userHighlight.focusOn(f) : this.userHighlight.clear();
           }
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.finishMultipleSelection(i);
         else {
@@ -5486,11 +5548,11 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
               this.finishConnection(o);
             else if (o instanceof ht && o.rootElement instanceof bt)
               this.finishConnection(o.rootElement);
-            else if (o instanceof z || o instanceof D || o instanceof ht) {
+            else if (o instanceof z || o instanceof F || o instanceof ht) {
               let d;
-              if (o instanceof z || o instanceof D)
+              if (o instanceof z || o instanceof F)
                 d = o;
-              else if (o.rootElement instanceof z || o.rootElement instanceof D)
+              else if (o.rootElement instanceof z || o.rootElement instanceof F)
                 d = o.rootElement;
               else {
                 this.dropConnection();
@@ -5508,12 +5570,12 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         }
         this.secondaryButton = !1;
       })
-    ), l.filter(".image-look").append("image"), ce(
+    ), l.filter(".image-look").append("image"), he(
       l
     ), r.attr(
       "transform",
       (i) => `translate(${i.coords[0] - i.width / 2},${i.coords[1] - i.width / 2})`
-    ).attr("opacity", (i) => i.removed ? 0.5 : 1), he(
+    ).attr("opacity", (i) => i.removed ? 0.5 : 1), ge(
       r
     );
   }
@@ -5547,16 +5609,16 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       const d = new pt(n, o);
       this.diagramEvent$.next(d);
     }).call(
-      x.drag().filter((n) => (this.secondaryButton = vt(n), !0)).on(I.Start, (n) => {
+      x.drag().filter((n) => (this.secondaryButton = vt(n), !0)).on(A.Start, (n) => {
         this.startMultipleSelection(n);
-      }).on(I.Drag, (n) => {
+      }).on(A.Drag, (n) => {
         this.continueMultipleSelection(n);
-      }).on(I.End, (n) => {
+      }).on(A.End, (n) => {
         this.finishMultipleSelection(n);
       })
     ), r.append("path").attr("class", "diagram-connection-path"), r.append("path").attr("class", "diagram-connection-path-box"), r.append("marker").attr("id", (n) => `${n.id}-start-marker`).attr("class", "diagram-connection-start-marker").append("image").attr("preserveAspectRatio", "none"), r.append("marker").attr("id", (n) => `${n.id}-end-marker`).attr("class", "diagram-connection-end-marker").append("image").attr("preserveAspectRatio", "none"), r.append("g").attr("class", "diagram-connection-start-label"), r.select("g.diagram-connection-start-label").append("path"), r.select("g.diagram-connection-start-label").append("text").style("user-select", "none"), r.append("g").attr("class", "diagram-connection-middle-label"), r.select("g.diagram-connection-middle-label").append("path"), r.select("g.diagram-connection-middle-label").append("text").style("user-select", "none"), r.append("g").attr("class", "diagram-connection-end-label"), r.select("g.diagram-connection-end-label").append("path"), r.select("g.diagram-connection-end-label").append("text").style("user-select", "none"), i.attr("opacity", (n) => n.removed ? 0.5 : 1).select("path.diagram-connection-path").attr(
       "d",
-      (n) => de(
+      (n) => ce(
         n.look.shape || et.look.shape,
         n.startCoords,
         n.endCoords,
@@ -5571,13 +5633,13 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       (n) => n.look.color || et.look.color
     ).attr("stroke-width", (n) => `${n.look.thickness}px`).attr(
       "stroke-dasharray",
-      (n) => pe(
+      (n) => me(
         n.look.style || et.look.style,
         n.type.defaultLook.thickness || et.look.thickness
       )
     ).attr("fill", "none"), i.select("path.diagram-connection-path-box").attr(
       "d",
-      (n) => de(
+      (n) => ce(
         n.look.shape || et.look.shape,
         n.startCoords,
         n.endCoords,
@@ -5589,10 +5651,10 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       )
     ).attr("stroke", "transparent").attr("pointer-events", "stroke").attr(
       "stroke-width",
-      (n) => `${(n.look.thickness || et.look.thickness) + fi}px`
+      (n) => `${(n.look.thickness || et.look.thickness) + mi}px`
     ).attr(
       "stroke-dasharray",
-      (n) => pe(
+      (n) => me(
         n.look.style || et.look.style,
         n.type.defaultLook.thickness || et.look.thickness
       )
@@ -5643,41 +5705,41 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     }).on($.DoubleClick, (i, n) => {
       const o = new pt(i, n);
-      this.diagramEvent$.next(o), !o.defaultPrevented && this.canUserPerformAction(w.EditField) && n.editable && !n.removed && (this.currentAction = new Ne(this, n.id, n.text, ""), this.createInputField(
+      this.diagramEvent$.next(o), !o.defaultPrevented && this.canUserPerformAction(w.EditField) && n.editable && !n.removed && (this.currentAction = new Re(this, n.id, n.text, ""), this.createInputField(
         n.text,
         n.coords,
         n.width,
         n.height,
         n.fontSize,
-        n.fontFamily || R.fontFamily,
+        n.fontFamily || V.fontFamily,
         n.orientation,
         (d) => {
         },
         (d) => {
-          n.text = d, this.currentAction instanceof Ne && (this.currentAction.to = d, this.currentAction.do(), this.actionStack.add(this.currentAction), this.currentAction = void 0);
+          n.text = d, this.currentAction instanceof Re && (this.currentAction.to = d, this.currentAction.do(), this.actionStack.add(this.currentAction), this.currentAction = void 0);
         }
       ));
     }).call(
-      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(I.Start, (i, n) => {
+      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(A.Start, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.startMultipleSelection(i);
         else {
           let o;
-          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof D && (o = n.rootElement.node), o ? this.startMovingNode(i, o) : S(L.NotAllowed);
+          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof F && (o = n.rootElement.node), o ? this.startMovingNode(i, o) : S(L.NotAllowed);
         }
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.continueMultipleSelection(i);
         else {
           let o;
-          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof D && (o = n.rootElement.node), o ? this.continueMovingNode(i, o) : S(L.NotAllowed);
+          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof F && (o = n.rootElement.node), o ? this.continueMovingNode(i, o) : S(L.NotAllowed);
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.finishMultipleSelection(i);
         else {
           let o;
-          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof D && (o = n.rootElement.node), o ? this.finishMovingNode(i, o) : S();
+          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof F && (o = n.rootElement.node), o ? this.finishMovingNode(i, o) : S();
         }
         this.secondaryButton = !1;
       })
@@ -5686,13 +5748,13 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       (i) => i.horizontalAlign === Lt.Center ? "center" : i.horizontalAlign === Lt.Right ? "flex-end" : "flex-start"
     ).style(
       "align-items",
-      (i) => i.verticalAlign === qt.Center ? "center" : i.verticalAlign === qt.Bottom ? "end" : "start"
+      (i) => i.verticalAlign === Jt.Center ? "center" : i.verticalAlign === Jt.Bottom ? "end" : "start"
     ).select("p").style(
       "max-width",
-      (i) => i.fit ? "default" : `${ze(i.width, i.height, i.orientation)[0]}px`
+      (i) => i.fit ? "default" : `${Oe(i.width, i.height, i.orientation)[0]}px`
     ).style(
       "max-height",
-      (i) => i.fit ? "default" : `${ze(i.width, i.height, i.orientation)[1]}px`
+      (i) => i.fit ? "default" : `${Oe(i.width, i.height, i.orientation)[1]}px`
     ).style("overflow", (i) => i.fit ? "default" : "clip").style("text-overflow", (i) => i.fit ? "default" : "ellipsis").style(
       "text-align",
       (i) => i.horizontalAlign === Lt.Center ? "center" : i.horizontalAlign === Lt.Right ? "end" : "start"
@@ -5704,7 +5766,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       (i) => i.selected ? i.selectedColor || "#000000" : i.color || "#000000"
     ).html(
       (i) => i.text.replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\n/g, "<br/>")
-    ), Ve) {
+    ), He) {
       const i = this.zoomTransform.k;
       r.attr("width", (n) => `${n.width * i}px`).attr("height", (n) => `${n.height * i}px`).select("div").style("position", "absolute").style(
         "left",
@@ -5734,11 +5796,11 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       const o = new pt(i, n);
       this.diagramEvent$.next(o);
     }).call(
-      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(I.Start, (i) => {
+      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(A.Start, (i) => {
         (this.multipleSelectionOn || this.secondaryButton) && this.startMultipleSelection(i);
-      }).on(I.Drag, (i) => {
+      }).on(A.Drag, (i) => {
         (this.multipleSelectionOn || this.secondaryButton) && this.continueMultipleSelection(i);
-      }).on(I.End, (i) => {
+      }).on(A.End, (i) => {
         (this.multipleSelectionOn || this.secondaryButton) && this.finishMultipleSelection(i);
       })
     );
@@ -5788,26 +5850,26 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       const o = new pt(i, n);
       this.diagramEvent$.next(o);
     }).call(
-      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(I.Start, (i, n) => {
+      x.drag().filter((i) => (this.secondaryButton = vt(i), !0)).on(A.Start, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.startMultipleSelection(i);
         else {
           let o;
-          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof D && (o = n.rootElement.node), o ? this.startMovingNode(i, o) : S(L.NotAllowed);
+          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof F && (o = n.rootElement.node), o ? this.startMovingNode(i, o) : S(L.NotAllowed);
         }
-      }).on(I.Drag, (i, n) => {
+      }).on(A.Drag, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.continueMultipleSelection(i);
         else {
           let o;
-          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof D && (o = n.rootElement.node), o ? this.continueMovingNode(i, o) : S(L.NotAllowed);
+          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof F && (o = n.rootElement.node), o ? this.continueMovingNode(i, o) : S(L.NotAllowed);
         }
-      }).on(I.End, (i, n) => {
+      }).on(A.End, (i, n) => {
         if (this.multipleSelectionOn || this.secondaryButton)
           this.finishMultipleSelection(i);
         else {
           let o;
-          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof D && (o = n.rootElement.node), o ? this.finishMovingNode(i, o) : S();
+          n.rootElement instanceof z ? o = n.rootElement : n.rootElement instanceof F && (o = n.rootElement.node), o ? this.finishMovingNode(i, o) : S();
         }
         this.secondaryButton = !1;
       })
@@ -5815,16 +5877,16 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
   }
   updateConnectionLabelsInView(t) {
     const e = this.selectCanvasView().select(
-      `[id='${ue(t.id)}']`
+      `[id='${pe(t.id)}']`
     ), l = e.select("path").node(), r = {
-      ...R,
+      ...V,
       ...t.type.label
     };
     if (l) {
       const i = l.getTotalLength();
       let n = 0, o = 0, d = 0, c = 0, h = 0, f = 0;
       if (r.backgroundColor === "#00000000") {
-        const u = t.endCoords[0] - t.startCoords[0], k = t.endCoords[1] - t.startCoords[1];
+        const u = t.endCoords[0] - t.startCoords[0], y = t.endCoords[1] - t.startCoords[1];
         switch (t.startDirection) {
           case g.Top:
             n = u >= 0 ? -0.5 : 0.5, h = n;
@@ -5833,10 +5895,10 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             n = u >= 0 ? -0.5 : 0.5, h = n;
             break;
           case g.Left:
-            o = k > 0 ? -0.5 : 0.5, f = o;
+            o = y > 0 ? -0.5 : 0.5, f = o;
             break;
           case g.Right:
-            o = k > 0 ? -0.5 : 0.5, f = o;
+            o = y > 0 ? -0.5 : 0.5, f = o;
             break;
           default:
             n = 0.5, h = n, o = -0.5, f = o;
@@ -5849,66 +5911,66 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             h = u >= 0 ? 0.5 : -0.5;
             break;
           case g.Left:
-            f = k > 0 ? 0.5 : -0.5;
+            f = y > 0 ? 0.5 : -0.5;
             break;
           case g.Right:
-            f = k > 0 ? 0.5 : -0.5;
+            f = y > 0 ? 0.5 : -0.5;
             break;
           default:
             h = 0.5, f = -0.5;
         }
-        Math.abs(u) >= Math.abs(k) ? (d = u > 0 ? -0.5 : 0.5, c = k > 0 ? 0.5 : -0.5) : (d = u > 0 ? 0.5 : -0.5, c = k > 0 ? -0.5 : 0.5);
+        Math.abs(u) >= Math.abs(y) ? (d = u > 0 ? -0.5 : 0.5, c = y > 0 ? 0.5 : -0.5) : (d = u > 0 ? 0.5 : -0.5, c = y > 0 ? -0.5 : 0.5);
       }
       e.select("g.diagram-connection-start-label text").attr("x", 0).attr("y", r.fontSize / 3).attr("text-anchor", "middle").attr("font-family", r.fontFamily).attr("font-size", r.fontSize).attr(
         "fill",
         t.selected ? r.selectedColor : r.color
       ).style("font-kerning", "none").text(t.startLabel);
-      const y = e.select("g.diagram-connection-start-label text").node()?.getBoundingClientRect();
-      if (y) {
-        const u = t.startLabel ? y.width / this.zoomTransform.k + Ot(r) + Ht(r) : 0, k = t.startLabel ? y.height / this.zoomTransform.k + _t(r) + Rt(r) : 0;
-        let b;
+      const b = e.select("g.diagram-connection-start-label text").node()?.getBoundingClientRect();
+      if (b) {
+        const u = t.startLabel ? b.width / this.zoomTransform.k + Ot(r) + Ht(r) : 0, y = t.startLabel ? b.height / this.zoomTransform.k + _t(r) + Vt(r) : 0;
+        let k;
         switch (t.startDirection) {
           case g.Left:
-            b = l.getPointAtLength(
+            k = l.getPointAtLength(
               ot(r) + u / 2
             );
             break;
           case g.Right:
-            b = l.getPointAtLength(
-              B(r) + u / 2
+            k = l.getPointAtLength(
+              Y(r) + u / 2
             );
             break;
           case g.Top:
-            b = l.getPointAtLength(
+            k = l.getPointAtLength(
               K(r) + u / 2
             );
             break;
           case g.Bottom:
-            b = l.getPointAtLength(
-              F(r) + u / 2
+            k = l.getPointAtLength(
+              U(r) + u / 2
             );
             break;
           default:
-            b = l.getPointAtLength(
+            k = l.getPointAtLength(
               Math.max(
-                B(r) + u / 2,
+                Y(r) + u / 2,
                 ot(r) + u / 2,
-                F(r) + k / 2,
-                K(r) + k / 2
+                U(r) + y / 2,
+                K(r) + y / 2
               )
             );
         }
         e.select("g.diagram-connection-start-label path").attr(
           "d",
-          Kt(
+          qt(
             -u / 2,
-            -k / 2,
+            -y / 2,
             u,
-            k
+            y
           )
         ).attr("fill", r.backgroundColor).attr("stroke", "none"), e.select("g.diagram-connection-start-label").attr(
           "transform",
-          `translate(${b.x + n * u},${b.y + o * k})`
+          `translate(${k.x + n * u},${k.y + o * y})`
         );
       }
       e.select("g.diagram-connection-middle-label text").attr("x", 0).attr("y", r.fontSize / 3).attr("text-anchor", "middle").attr("font-family", r.fontFamily).attr("font-size", r.fontSize).attr(
@@ -5917,18 +5979,18 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       ).style("font-kerning", "none").text(t.middleLabel);
       const m = e.select("g.diagram-connection-middle-label text").node()?.getBoundingClientRect();
       if (m) {
-        const u = t.middleLabel ? m.width / this.zoomTransform.k + Ot(r) + Ht(r) : 0, k = t.middleLabel ? m.height / this.zoomTransform.k + _t(r) + Rt(r) : 0, b = l.getPointAtLength(i / 2);
+        const u = t.middleLabel ? m.width / this.zoomTransform.k + Ot(r) + Ht(r) : 0, y = t.middleLabel ? m.height / this.zoomTransform.k + _t(r) + Vt(r) : 0, k = l.getPointAtLength(i / 2);
         e.select("g.diagram-connection-middle-label path").attr(
           "d",
-          Kt(
+          qt(
             -u / 2,
-            -k / 2,
+            -y / 2,
             u,
-            k
+            y
           )
         ).attr("fill", r.backgroundColor).attr("stroke", "none"), e.select("g.diagram-connection-middle-label").attr(
           "transform",
-          `translate(${b.x + d * u},${b.y + c * k})`
+          `translate(${k.x + d * u},${k.y + c * y})`
         );
       }
       e.select("g.diagram-connection-end-label text").attr("x", 0).attr("y", r.fontSize / 3).attr("text-anchor", "middle").attr("font-family", r.fontFamily).attr("font-size", r.fontSize).attr(
@@ -5937,57 +5999,57 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       ).style("font-kerning", "none").text(t.endLabel);
       const p = e.select("g.diagram-connection-end-label text").node()?.getBoundingClientRect();
       if (p) {
-        const u = t.endLabel ? p.width / this.zoomTransform.k + Ot(r) + Ht(r) : 0, k = t.endLabel ? p.height / this.zoomTransform.k + _t(r) + Rt(r) : 0;
-        let b;
+        const u = t.endLabel ? p.width / this.zoomTransform.k + Ot(r) + Ht(r) : 0, y = t.endLabel ? p.height / this.zoomTransform.k + _t(r) + Vt(r) : 0;
+        let k;
         switch (t.endDirection) {
           case g.Left:
-            b = l.getPointAtLength(
+            k = l.getPointAtLength(
               i - (ot(r) + u / 2)
             );
             break;
           case g.Right:
-            b = l.getPointAtLength(
-              i - (B(r) + u / 2)
+            k = l.getPointAtLength(
+              i - (Y(r) + u / 2)
             );
             break;
           case g.Top:
-            b = l.getPointAtLength(
+            k = l.getPointAtLength(
               i - (K(r) + u / 2)
             );
             break;
           case g.Bottom:
-            b = l.getPointAtLength(
-              i - (F(r) + u / 2)
+            k = l.getPointAtLength(
+              i - (U(r) + u / 2)
             );
             break;
           default:
-            b = l.getPointAtLength(
+            k = l.getPointAtLength(
               i - Math.max(
-                B(r) + u / 2,
+                Y(r) + u / 2,
                 ot(r) + u / 2,
-                F(r) + k / 2,
-                K(r) + k / 2
+                U(r) + y / 2,
+                K(r) + y / 2
               )
             );
         }
         e.select("g.diagram-connection-end-label path").attr(
           "d",
-          Kt(
+          qt(
             -u / 2,
-            -k / 2,
+            -y / 2,
             u,
-            k
+            y
           )
         ).attr("fill", r.backgroundColor).attr("stroke", "none"), e.select("g.diagram-connection-end-label").attr(
           "transform",
-          `translate(${b.x + h * u},${b.y + f * k})`
+          `translate(${k.x + h * u},${k.y + f * y})`
         );
       }
     }
   }
   updateConnectionMarkersInView(t) {
     const e = this.selectCanvasView().select(
-      `[id='${ue(t.id)}']`
+      `[id='${pe(t.id)}']`
     ), a = e.select("marker.diagram-connection-start-marker"), l = e.select("marker.diagram-connection-end-marker");
     t.startMarkerLook !== null ? a.attr("orient", "auto-start-reverse").attr("markerWidth", t.startMarkerLook.width).attr("markerHeight", t.startMarkerLook.height).attr("refX", t.startMarkerLook.refX).attr("refY", t.startMarkerLook.refY).select("image").attr("href", t.startMarkerLook.image).attr("width", t.startMarkerLook.width).attr("height", t.startMarkerLook.height) : a.attr("orient", "auto-start-reverse").attr("markerWidth", 0).attr("markerHeight", 0), t.endMarkerLook !== null ? l.attr("orient", "auto-start-reverse").attr("markerWidth", t.endMarkerLook.width).attr("markerHeight", t.endMarkerLook.height).attr("refX", t.endMarkerLook.refX).attr("refY", t.endMarkerLook.refY).select("image").attr("href", t.endMarkerLook.image).attr("width", t.endMarkerLook.width).attr("height", t.endMarkerLook.height) : l.attr("orient", "auto-start-reverse").attr("markerWidth", 0).attr("markerHeight", 0);
   }
@@ -5995,8 +6057,8 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     const e = this.model.fields.get(t);
     if (!e)
       return !1;
-    if (e.rootElement instanceof z || e.rootElement instanceof D) {
-      const a = this.minimumSizeOfField(e), l = a[0] + B(e.rootElement.type?.label) + ot(e.rootElement.type?.label) - e.rootElement.width, r = a[1] + F(e.rootElement.type?.label) + K(e.rootElement.type?.label) - e.rootElement.height;
+    if (e.rootElement instanceof z || e.rootElement instanceof F) {
+      const a = this.minimumSizeOfField(e), l = a[0] + Y(e.rootElement.type?.label) + ot(e.rootElement.type?.label) - e.rootElement.width, r = a[1] + U(e.rootElement.type?.label) + K(e.rootElement.type?.label) - e.rootElement.height;
       return l <= 0 && r <= 0;
     }
     return !0;
@@ -6006,10 +6068,10 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     if (a) {
       if (a.rootElement instanceof z) {
         const l = this.minimumSizeOfField(a);
-        let r = l[0] + B(a.rootElement.type.label) + ot(a.rootElement.type.label) - a.rootElement.width, i = l[1] + F(a.rootElement.type.label) + K(a.rootElement.type.label) - a.rootElement.height;
+        let r = l[0] + Y(a.rootElement.type.label) + ot(a.rootElement.type.label) - a.rootElement.width, i = l[1] + U(a.rootElement.type.label) + K(a.rootElement.type.label) - a.rootElement.height;
         this.snapToGrid && (r = Math.ceil(r / this.gridSize) * this.gridSize, i = Math.ceil(i / this.gridSize) * this.gridSize), a.rootElement.width + r < a.rootElement.type.minWidth && (r = a.rootElement.type.minWidth - a.rootElement.width), a.rootElement.height + i < a.rootElement.type.minHeight && (i = a.rootElement.type.minHeight - a.rootElement.height), (e !== !1 || r > 0) && a.rootElement.stretch(g.Right, r), (e !== !1 || i > 0) && a.rootElement.stretch(g.Bottom, i);
       }
-      if (a.rootElement instanceof D) {
+      if (a.rootElement instanceof F) {
         const l = this.minimumSizeOfField(a);
         let r = l[0], i = l[1];
         for (const c of a.rootElement.node?.sections || [])
@@ -6022,7 +6084,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           )));
         l[0] < r && (l[0] = r), l[1] < i && (l[1] = i);
         const n = a.rootElement.type;
-        let o = l[0] + B(n?.label) + ot(n?.label) - a.rootElement.width, d = l[1] + F(n?.label) + K(n?.label) - a.rootElement.height;
+        let o = l[0] + Y(n?.label) + ot(n?.label) - a.rootElement.width, d = l[1] + U(n?.label) + K(n?.label) - a.rootElement.height;
         this.snapToGrid && (o = Math.ceil(o / this.gridSize) * this.gridSize, d = Math.ceil(d / this.gridSize) * this.gridSize), a.rootElement.width + o < (a.rootElement.getMinWidth() || 0) && (o = (a.rootElement.getMinWidth() || 0) - a.rootElement.width), a.rootElement.height + d < (a.rootElement.getMinHeight() || 0) && (d = (a.rootElement.getMinHeight() || 0) - a.rootElement.height), (e || o > 0) && a.rootElement.node?.stretchSections(
           g.Right,
           o,
@@ -6080,7 +6142,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           this.connectionType,
           t,
           void 0,
-          ge
+          fe
         );
       else if (this.inferConnectionType) {
         let e = this.model.connections.types.all().find(
@@ -6093,7 +6155,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
           e,
           t,
           void 0,
-          ge
+          fe
         ));
       }
     }
@@ -6119,7 +6181,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       ) && this.unfinishedConnection?.start?.allowsOutgoing && this.unfinishedConnection.type.canFinishOnType(
         t.getNode()?.type?.id || ""
       ) && t.allowsIncoming) {
-        const e = new le(
+        const e = new de(
           this,
           this.unfinishedConnection.type,
           this.unfinishedConnection.start?.id,
@@ -6131,7 +6193,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       ) && this.unfinishedConnection?.start?.allowsIncoming && this.unfinishedConnection.type.canStartFromType(
         t.getNode()?.type?.id || ""
       ) && t.allowsOutgoing) {
-        const e = new le(
+        const e = new de(
           this,
           this.unfinishedConnection.type,
           t.id,
@@ -6149,7 +6211,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
             this.unfinishedConnection?.start?.getNode()?.type?.id || ""
           ) && this.unfinishedConnection?.start?.allowsIncoming && l.canStartFromType(t.getNode()?.type?.id || "") && t.allowsOutgoing
         ), a = !0), e !== void 0) {
-          const l = new le(
+          const l = new de(
             this,
             e,
             a ? t.id : this.unfinishedConnection.start?.id,
@@ -6176,7 +6238,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     const c = this.selectCanvasElements().append("foreignObject").attr("x", `${e[0]}px`).attr("y", `${e[1]}px`).attr("width", `${a}px`).attr("height", `${l}px`).style("box-sizing", "border-box").style("border", "1px solid");
     this.inputFieldContainer = c;
     const h = c.append("xhtml:textarea");
-    let f, y;
+    let f, b;
     h.text(t).style("box-sizing", "border-box").style("width", `${a}px`).style("height", `${l}px`).style("font-size", `${r}px`).style("font-family", i).style("resize", "none").style("outline", 0).style("border", 0).style("margin", 0).style("padding", 0).on($.KeyDown, (p) => {
       p.stopPropagation();
     }).on($.KeyUp, (p) => {
@@ -6186,9 +6248,9 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     }).on($.Input, () => {
       const p = h.property("value");
-      h.attr("cols", Co(p) + 1), h.attr("rows", $o(p) + 1), h.style("width", ""), h.style("height", ""), f = h.property("scrollWidth") + 1, y = h.property("scrollHeight") + 1;
-      const u = Math.max(f, a), k = Math.max(y, l);
-      c?.attr("width", `${u}px`), h.style("width", `${u}px`), c?.attr("height", `${k}px`), h.style("height", `${k}px`), o && o(p);
+      h.attr("cols", Io(p) + 1), h.attr("rows", xo(p) + 1), h.style("width", ""), h.style("height", ""), f = h.property("scrollWidth") + 1, b = h.property("scrollHeight") + 1;
+      const u = Math.max(f, a), y = Math.max(b, l);
+      c?.attr("width", `${u}px`), h.style("width", `${u}px`), c?.attr("height", `${y}px`), h.style("height", `${y}px`), o && o(p);
     }).on($.Click, (p) => {
       p.stopPropagation();
     }).on($.FocusOut, () => {
@@ -6217,7 +6279,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
   startMovingNode(t, e) {
     if (this.canUserPerformAction(w.MoveNode) && !e.removed)
       if (S(L.Grabbing), this.draggingFrom = [t.x, t.y], e.selected && this.userSelection.count((a) => a instanceof z) > 1)
-        this.currentAction = new ae(
+        this.currentAction = new le(
           this,
           this.userSelection.filter((a) => a instanceof z).map((a) => a.id),
           e.coords
@@ -6242,7 +6304,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
    * Method to call to continue the moving of a node triggered by a user drag event.
    */
   continueMovingNode(t, e) {
-    if (this.canUserPerformAction(w.MoveNode) && (this.currentAction instanceof ae || this.currentAction instanceof X) && !e.removed) {
+    if (this.canUserPerformAction(w.MoveNode) && (this.currentAction instanceof le || this.currentAction instanceof X) && !e.removed) {
       const a = [
         t.x - e.width / 2,
         t.y - e.height / 2
@@ -6265,7 +6327,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       if (this.snapToGrid && (a = this.getClosestGridPoint([
         a[0] - e.type.snapToGridOffset[0],
         a[1] - e.type.snapToGridOffset[1]
-      ]), a[0] += e.type.snapToGridOffset[0], a[1] += e.type.snapToGridOffset[1]), this.currentAction instanceof ae) {
+      ]), a[0] += e.type.snapToGridOffset[0], a[1] += e.type.snapToGridOffset[1]), this.currentAction instanceof le) {
         const l = this.currentAction.delta;
         this.currentAction.delta = [
           a[0] - l[0],
@@ -6278,11 +6340,11 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         e.move(a);
         const r = this.model.nodes.getAtCoordinates(t.x, t.y).filter((o) => o.id !== e.id && !o.isDescendantOf(e)).filter(
           (o) => o.type.childrenTypes.includes(e.type.id)
-        ), i = Xe(
+        ), i = Ze(
           r
         ), n = i[i.length - 1];
         if (n !== e.parent && (e.type.canBeParentless || n !== void 0)) {
-          const o = n?.getLastAncestor(), d = this.currentAction.from, c = new Zo(
+          const o = n?.getLastAncestor(), d = this.currentAction.from, c = new Jo(
             this,
             e.id,
             e.parent?.id,
@@ -6328,7 +6390,7 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     const e = this.getPointerLocationRelativeToCanvas(t);
     this.multipleSelectionContainer?.remove(), this.multipleSelectionContainer = void 0, this.userSelection.clear();
     for (const a of this.model.nodes)
-      fo(
+      mo(
         [
           a.coords,
           [a.coords[0] + a.width, a.coords[1] + a.height]
@@ -6340,9 +6402,9 @@ const hi = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     ), S();
   }
 };
-Qt.canvasCount = 0;
-let ye = Qt;
-class to {
+te.canvasCount = 0;
+let we = te;
+class io {
   constructor() {
     this.grid = [[void 0]], this.offsetX = 0, this.offsetY = 0;
   }
@@ -6454,16 +6516,16 @@ class to {
     }
   }
 }
-class pi {
+class yi {
   constructor(t) {
     this.gapSize = t;
   }
   apply(t) {
     if (t.nodes.length === 0)
       return t;
-    const e = new to(), a = t.nodes.filter((n) => !n.parent);
+    const e = new io(), a = t.nodes.filter((n) => !n.parent);
     for (; a.length > 0; )
-      eo(
+      so(
         a[0],
         e,
         [0, 0],
@@ -6481,25 +6543,25 @@ class pi {
     return t;
   }
 }
-const eo = (s, t, e, a) => {
+const so = (s, t, e, a) => {
   const l = t.getClosestEmptyCoordinate(e);
-  t.set(l, s), Y(a, s);
+  t.set(l, s), B(a, s);
   for (const r of s.getAdjacentNodes())
-    a.includes(r) && eo(
+    a.includes(r) && so(
       r,
       t,
       l,
       a
     );
 };
-class mi {
+class bi {
   constructor(t) {
     this.gapSize = t;
   }
   apply(t) {
     if (t.nodes.length === 0)
       return t;
-    const e = new to(), a = t.nodes.filter((c) => !c.parent), l = {}, r = a[0];
+    const e = new io(), a = t.nodes.filter((c) => !c.parent), l = {}, r = a[0];
     let i = [r];
     for (l[r.id] = [0, 0]; a.length > 0; ) {
       const c = [];
@@ -6509,10 +6571,10 @@ class mi {
             l[h.id]
           ),
           h
-        ), Y(a, h);
+        ), B(a, h);
         const f = h.getAdjacentNodes();
-        for (const y of f)
-          a.includes(y) && (c.push(y), l[y.id] = l[h.id]);
+        for (const b of f)
+          a.includes(b) && (c.push(b), l[b.id] = l[h.id]);
       }
       if (c.length > 0)
         i = c;
@@ -6533,7 +6595,7 @@ class mi {
     return t;
   }
 }
-class ne {
+class re {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6543,14 +6605,14 @@ class ne {
     const e = this.gapSize !== void 0 ? this.gapSize : (t.canvas?.gridSize || 0) * 2;
     let a = t.nodes.filter((n) => !n.parent);
     const l = a[0];
-    Y(a, l);
+    B(a, l);
     const r = [[l]];
     for (; a.length > 0; ) {
       const n = r[r.length - 1], o = [];
       for (const d of n) {
         const c = d.getAdjacentNodes();
         for (const h of c)
-          a.includes(h) && (Y(a, h), o.push(h));
+          a.includes(h) && (B(a, h), o.push(h));
       }
       o.length > 0 ? r.push(o) : (r.push(a), a = []);
     }
@@ -6567,14 +6629,14 @@ class ne {
     return t;
   }
 }
-class vi {
+class ki {
   constructor(t) {
     this.gapSize = t;
   }
   apply(t) {
     if (t.nodes.length === 0)
       return t;
-    new ne(this.gapSize).apply(t);
+    new re(this.gapSize).apply(t);
     const e = this.gapSize !== void 0 ? this.gapSize : (t.canvas?.gridSize || 0) * 2, a = 0.99, l = 1, r = 0.1, i = 2e5, n = 0.5, o = 1, d = 2e-3;
     let c = 100;
     for (; c > l; ) {
@@ -6586,7 +6648,7 @@ class vi {
         h[0] = h[0] / t.nodes.length, h[1] = h[1] / t.nodes.length;
       }
       for (const f of t.nodes) {
-        const y = f.getAdjacentNodes();
+        const b = f.getAdjacentNodes();
         for (const m of t.nodes) {
           const p = [
             f.coords[0] + f.width / 2,
@@ -6594,16 +6656,16 @@ class vi {
           ], u = [
             m.coords[0] + m.width / 2,
             m.coords[1] + m.height / 2
-          ], k = _e(
+          ], y = Ue(
             f.coords,
             m.coords
-          ), b = [m.coords[0], m.coords[1]];
-          if (y.includes(m) && k > 0 && (k > e + (Math.max(f.width, f.height) + Math.max(m.width, m.height)) / 2 ? (b[0] = b[0] - (u[0] - p[0]) * r, b[1] = b[1] - (u[1] - p[1]) * r) : (b[0] = b[0] + (u[0] - p[0]) * n, b[1] = b[1] + (u[1] - p[1]) * n)), k > 0) {
-            const N = i / (k * k);
-            b[0] = b[0] + N * (u[0] - p[0]) / k, b[1] = b[1] + N * (u[1] - p[1]) / k;
+          ), k = [m.coords[0], m.coords[1]];
+          if (b.includes(m) && y > 0 && (y > e + (Math.max(f.width, f.height) + Math.max(m.width, m.height)) / 2 ? (k[0] = k[0] - (u[0] - p[0]) * r, k[1] = k[1] - (u[1] - p[1]) * r) : (k[0] = k[0] + (u[0] - p[0]) * n, k[1] = k[1] + (u[1] - p[1]) * n)), y > 0) {
+            const N = i / (y * y);
+            k[0] = k[0] + N * (u[0] - p[0]) / y, k[1] = k[1] + N * (u[1] - p[1]) / y;
           } else
-            b[0] = b[0] + o * (Math.random() * 2 - 1), b[1] = b[1] + o * (Math.random() * 2 - 1);
-          b[0] = b[0] - (u[0] - h[0]) * d, b[1] = b[1] - (u[1] - h[1]) * d, b[0] - m.coords[0] > c ? b[0] = m.coords[0] + c : b[0] - m.coords[0] < -c && (b[0] = m.coords[0] - c), b[1] - m.coords[1] > c ? b[1] = m.coords[1] + c : b[1] - m.coords[1] < -c && (b[1] = m.coords[1] - c), m.move(b);
+            k[0] = k[0] + o * (Math.random() * 2 - 1), k[1] = k[1] + o * (Math.random() * 2 - 1);
+          k[0] = k[0] - (u[0] - h[0]) * d, k[1] = k[1] - (u[1] - h[1]) * d, k[0] - m.coords[0] > c ? k[0] = m.coords[0] + c : k[0] - m.coords[0] < -c && (k[0] = m.coords[0] - c), k[1] - m.coords[1] > c ? k[1] = m.coords[1] + c : k[1] - m.coords[1] < -c && (k[1] = m.coords[1] - c), m.move(k);
         }
       }
     }
@@ -6620,7 +6682,7 @@ class vi {
     return t;
   }
 }
-class yi {
+class wi {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6635,7 +6697,7 @@ class yi {
     return t;
   }
 }
-class bi {
+class Si {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6648,53 +6710,53 @@ class bi {
       ...t.nodes.map((c) => c.getPriority())
     );
     if (e === a)
-      return new ne(this.gapSize).apply(t), t;
+      return new re(this.gapSize).apply(t), t;
     const l = this.gapSize !== void 0 ? this.gapSize : (t.canvas?.gridSize || 0) * 2, r = t.nodes.filter((c) => !c.parent), i = [], n = t.nodes.filter((c) => !c.parent).filter((c) => c.getPriority() >= e), o = [];
     if (n.length > 1) {
       const c = n[0];
       n.splice(0, 1), o.push(c);
       const h = [c], f = [c];
       for (; h.length > 0; ) {
-        const y = h[0];
-        h.splice(0, 1), n.includes(y) && (o.push(y), Y(n, y));
-        const m = y.getAdjacentNodes();
+        const b = h[0];
+        h.splice(0, 1), n.includes(b) && (o.push(b), B(n, b));
+        const m = b.getAdjacentNodes();
         for (const p of m)
           f.includes(p) || (h.push(p), f.push(p));
       }
-      for (const y of n)
-        o.push(y);
+      for (const b of n)
+        o.push(b);
     } else
       o.push(n[0]);
     for (const c of o)
-      Y(r, c), i.push([c]);
+      B(r, c), i.push([c]);
     for (i.push([]), r.sort((c, h) => h.type.priority - c.type.priority); r.length > 0; ) {
       const c = r[0];
       r.splice(0, 1);
       const h = [c], f = [c];
-      let y = !1;
+      let b = !1;
       for (; h.length > 0; ) {
         const m = h[0];
         h.splice(0, 1);
         const p = o.indexOf(m);
         if (p >= 0) {
-          i[p].push(c), y = !0;
+          i[p].push(c), b = !0;
           break;
         } else {
           const u = m.getAdjacentNodes();
-          for (const k of u)
-            f.includes(k) || (h.push(k), f.push(k));
+          for (const y of u)
+            f.includes(y) || (h.push(y), f.push(y));
         }
       }
-      y || i[i.length - 1].push(c);
+      b || i[i.length - 1].push(c);
     }
     let d = 0;
     for (let c = 0; c < i.length; ++c) {
       let h = 0;
-      for (let y = 0; y < i[c].length; ++y) {
-        const m = i[c][y];
+      for (let b = 0; b < i[c].length; ++b) {
+        const m = i[c][b];
         m.move([d, h]), h += l + m.height;
       }
-      const f = Math.max(...i[c].map((y) => y.width));
+      const f = Math.max(...i[c].map((b) => b.width));
       d += l + f;
     }
     for (const c of t.connections)
@@ -6702,7 +6764,7 @@ class bi {
     return t;
   }
 }
-class ki {
+class Ci {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6715,27 +6777,27 @@ class ki {
       ...t.nodes.map((c) => c.getPriority())
     );
     if (e === a)
-      return new ne(this.gapSize).apply(t), t;
+      return new re(this.gapSize).apply(t), t;
     const l = this.gapSize !== void 0 ? this.gapSize : (t.canvas?.gridSize || 0) * 2, r = t.nodes.filter((c) => !c.parent).sort((c, h) => h.getPriority() - c.getPriority()), i = [];
     for (; r.length > 0; ) {
       const c = r[0];
       r.splice(0, 1);
-      const h = new Se(void 0, c);
-      oo(h, r), i.push(h);
+      const h = new Ae(void 0, c);
+      no(h, r), i.push(h);
     }
     const n = [];
     for (const c of i)
-      n.push([c]), io(c, n, n.length);
+      n.push([c]), ro(c, n, n.length);
     const o = Math.max(...t.nodes.map((c) => c.height));
     let d = 0;
     for (let c = 0; c < n.length; ++c) {
       let h = 0;
-      for (let y = 0; y < n[c].length; ++y) {
-        const m = n[c][y];
+      for (let b = 0; b < n[c].length; ++b) {
+        const m = n[c][b];
         m.node.move([d, h]), h += (l + o) * m.countBranchHeight();
       }
       const f = Math.max(
-        ...n[c].map((y) => y.node.width)
+        ...n[c].map((b) => b.node.width)
       );
       d += l + f;
     }
@@ -6744,29 +6806,29 @@ class ki {
     return t;
   }
 }
-const oo = (s, t) => {
+const no = (s, t) => {
   for (const e of s.node.getAdjacentNodes().sort((a, l) => l.getPriority() - a.getPriority())) {
     const a = t.indexOf(e);
     if (a >= 0) {
       t.splice(a, 1);
       const l = s.addBranch(e);
-      oo(l, t);
+      no(l, t);
     }
   }
-}, io = (s, t, e) => {
+}, ro = (s, t, e) => {
   if (s.branches.length > 0) {
     for (; e >= t.length; )
       t.push([]);
     for (const a of s.branches)
-      t[e].push(a), io(a, t, e + 1);
+      t[e].push(a), ro(a, t, e + 1);
   }
 };
-class Se {
+class Ae {
   constructor(t, e) {
     this.parent = t, this.branches = [], this.depth = 0, this.node = e;
   }
   addBranch(t) {
-    const e = new Se(this, t);
+    const e = new Ae(this, t);
     return e.depth = this.depth + 1, this.branches.push(e), e;
   }
   countBranchHeight() {
@@ -6780,7 +6842,7 @@ class Se {
     }
   }
 }
-class wi {
+class $i {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6795,17 +6857,17 @@ class wi {
     return t;
   }
 }
-const Re = {
-  adjacency: new pi(),
-  breadth: new ne(),
-  "breadth-adjacency": new mi(),
-  force: new vi(),
-  horizontal: new yi(),
-  priority: new bi(),
-  tree: new ki(),
-  vertical: new wi()
-}, Si = He({}), $t = He({});
-class Ci {
+const _e = {
+  adjacency: new yi(),
+  breadth: new re(),
+  "breadth-adjacency": new bi(),
+  force: new ki(),
+  horizontal: new wi(),
+  priority: new Si(),
+  tree: new Ci(),
+  vertical: new $i()
+}, Ai = Fe({}), $t = Fe({});
+class Ii {
   constructor(t, e) {
     this.onTitleChange = t, this.onValueSetChange = e;
   }
@@ -6824,7 +6886,7 @@ class Ci {
   highlightProperty(...t) {
   }
 }
-const Ce = ({
+const Ie = ({
   direction: s,
   collapsableSelector: t,
   collapsableAdditionalSelector: e,
@@ -6835,10 +6897,10 @@ const Ce = ({
   visibleValue: n,
   onCollapse: o
 }) => {
-  const [d, c] = U(a), h = () => {
+  const [d, c] = D(a), h = () => {
     if (!l) {
-      const y = !d;
-      c(y), o?.(y);
+      const b = !d;
+      c(b), o?.(b);
       let m;
       if (typeof t == "string")
         m = x.select(t), e && (m = m.select(e));
@@ -6847,7 +6909,7 @@ const Ce = ({
         if (!p) throw new Error("collapsableSelector is not a valid ref");
         m = x.select(p.current), e && (m = m.select(e));
       }
-      m.style(r, y ? i : n);
+      m.style(r, b ? i : n);
     }
   }, f = () => {
     switch (s) {
@@ -6869,10 +6931,10 @@ const Ce = ({
       children: /* @__PURE__ */ v("div", { className: f() })
     }
   ) });
-}, $i = () => {
-  const s = Ut($t), t = rt(null), [e, a] = U([]);
-  co(s.validatorChange$, s.diagramChange$).pipe(
-    ho(() => l())
+}, xi = () => {
+  const s = Dt($t), t = rt(null), [e, a] = D([]);
+  fo(s.validatorChange$, s.diagramChange$).pipe(
+    uo(() => l())
   ).subscribe();
   const l = () => {
     a([]);
@@ -6896,15 +6958,15 @@ const Ce = ({
       ...i.propertyNames
     ));
   };
-  return /* @__PURE__ */ v("daga-errors", { children: /* @__PURE__ */ M("div", { ref: t, className: "daga-errors", children: [
+  return /* @__PURE__ */ v("daga-errors", { children: /* @__PURE__ */ T("div", { ref: t, className: "daga-errors", children: [
     e.length === 0 && /* @__PURE__ */ v("div", { className: "daga-errors-summary daga-no-errors daga-prevent-user-select", children: /* @__PURE__ */ v("span", { children: "No errors found" }) }),
-    e.length > 0 && /* @__PURE__ */ M("div", { className: "daga-errors-summary daga-with-errors daga-prevent-user-select", children: [
-      /* @__PURE__ */ M("span", { children: [
+    e.length > 0 && /* @__PURE__ */ T("div", { className: "daga-errors-summary daga-with-errors daga-prevent-user-select", children: [
+      /* @__PURE__ */ T("span", { children: [
         e.length,
         " errors found"
       ] }),
       /* @__PURE__ */ v("div", { className: "daga-collapse-button-container", children: /* @__PURE__ */ v(
-        Ce,
+        Ie,
         {
           collapsableSelector: t,
           collapsableAdditionalSelector: ".daga-error-panel",
@@ -6926,59 +6988,59 @@ const Ce = ({
       n
     )) }) })
   ] }) });
-}, Ii = 200, Oe = (s) => (s || "").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""), so = ({
+}, Li = 200, Ge = (s) => (s || "").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""), ao = ({
   disabled: s,
   options: t,
   value: e,
   onChange: a
 }) => {
-  const l = rt(null), [r, i] = U("");
+  const l = rt(null), [r, i] = D("");
   let n;
-  const [o, d] = U([]), [c, h] = U([]), [f, y] = U([]), [m, p] = U([]), [u, k] = U(!1);
+  const [o, d] = D([]), [c, h] = D([]), [f, b] = D([]), [m, p] = D([]), [u, y] = D(!1);
   Ct(() => {
-    i(t.find((A) => St(A.key, e))?.label || "");
+    i(t.find((I) => St(I.key, e))?.label || "");
   }, [e, t]);
-  const b = (A) => {
+  const k = (I) => {
     if (!s)
-      switch (A.key) {
+      switch (I.key) {
         case Z.PageDown:
-          n === void 0 ? (P(0), E(0)) : (P(n + 5), E(n)), A.preventDefault();
+          n === void 0 ? (P(0), E(0)) : (P(n + 5), E(n)), I.preventDefault();
           break;
         case Z.ArrowDown:
-          n === void 0 ? (P(0), E(0)) : (P(n + 1), E(n)), A.preventDefault();
+          n === void 0 ? (P(0), E(0)) : (P(n + 1), E(n)), I.preventDefault();
           break;
         case Z.PageUp:
-          n === void 0 ? (P(t.length - 1), E(t.length - 1)) : (P(n - 5), E(n)), A.preventDefault();
+          n === void 0 ? (P(t.length - 1), E(t.length - 1)) : (P(n - 5), E(n)), I.preventDefault();
           break;
         case Z.ArrowUp:
-          n === void 0 ? (P(t.length - 1), E(t.length - 1)) : (P(n - 1), E(n)), A.preventDefault();
+          n === void 0 ? (P(t.length - 1), E(t.length - 1)) : (P(n - 1), E(n)), I.preventDefault();
           break;
         case Z.Escape:
-          V(), A.preventDefault();
+          R(), I.preventDefault();
           break;
         case Z.Enter:
-          O(t[n || 0]), A.preventDefault();
+          O(t[n || 0]), I.preventDefault();
           break;
         default:
           N();
       }
   }, N = () => {
     if (!s) {
-      const A = Oe(r.trim());
-      d([]), h([]), y([]), p([]);
+      const I = Ge(r.trim());
+      d([]), h([]), b([]), p([]);
       for (const _ of t) {
-        const q = Oe(_.label).indexOf(A);
+        const q = Ge(_.label).indexOf(I);
         if (q >= 0) {
           const Bt = _.label.substring(0, q), J = _.label.substring(
             q,
-            q + A.length
+            q + I.length
           ), wt = _.label.substring(
-            q + A.length
+            q + I.length
           );
           d((nt) => [...nt, _]), h((nt) => [
             ...nt,
             Bt
-          ]), y((nt) => [
+          ]), b((nt) => [
             ...nt,
             J
           ]), p((nt) => [
@@ -6987,56 +7049,56 @@ const Ce = ({
           ]);
         }
       }
-      k(!0);
+      y(!0);
     }
-  }, V = () => {
-    k(!1);
-  }, P = (A) => {
+  }, R = () => {
+    y(!1);
+  }, P = (I) => {
     if (!s) {
-      if (n = A, A === void 0)
+      if (n = I, I === void 0)
         return;
-      A < 0 && (n = 0), A >= t.length && (n = t.length - 1);
+      I < 0 && (n = 0), I >= t.length && (n = t.length - 1);
     }
   }, tt = () => {
     setTimeout(() => {
-      V();
-    }, Ii);
-  }, E = (A) => {
-    const _ = l.current?.querySelectorAll("li")[A];
+      R();
+    }, Li);
+  }, E = (I) => {
+    const _ = l.current?.querySelectorAll("li")[I];
     _ && _.scrollIntoView({ block: "center" });
   }, C = () => {
-    s || (i(""), k(!1), n = void 0);
-  }, O = (A) => {
-    s || (i(A.label), k(!1), n = void 0, a(A.key));
+    s || (i(""), y(!1), n = void 0);
+  }, O = (I) => {
+    s || (i(I.label), y(!1), n = void 0, a(I.key));
   };
-  return /* @__PURE__ */ M(
+  return /* @__PURE__ */ T(
     "div",
     {
       ref: l,
       className: `daga-autocomplete ${u ? "daga-showing-options" : ""}`,
       children: [
-        /* @__PURE__ */ M("div", { className: "daga-autocomplete-input", children: [
+        /* @__PURE__ */ T("div", { className: "daga-autocomplete-input", children: [
           /* @__PURE__ */ v(
             "input",
             {
               value: r,
               disabled: s,
-              onKeyUp: b,
+              onKeyUp: k,
               onFocus: N,
               onBlur: tt,
-              onChange: (A) => i(A.target.value)
+              onChange: (I) => i(I.target.value)
             }
           ),
           r !== "" && /* @__PURE__ */ v("button", { className: "daga-clear", onClick: C })
         ] }),
-        /* @__PURE__ */ v("div", { className: "daga-autocomplete-options", children: /* @__PURE__ */ M("ul", { className: "daga-autocomplete-option-list", children: [
+        /* @__PURE__ */ v("div", { className: "daga-autocomplete-options", children: /* @__PURE__ */ T("ul", { className: "daga-autocomplete-option-list", children: [
           o.length === 0 && /* @__PURE__ */ v("li", { className: "daga-autocomplete-option no-options", children: "(No options)" }),
-          o.map((A, _) => /* @__PURE__ */ M(
+          o.map((I, _) => /* @__PURE__ */ T(
             "li",
             {
               className: `daga-autocomplete-option ${_ === n ? "daga-focused" : ""}`,
               onMouseMove: () => P(_),
-              onClick: () => O(A),
+              onClick: () => O(I),
               children: [
                 /* @__PURE__ */ v("span", { children: c[_] }),
                 /* @__PURE__ */ v("span", { className: "daga-match", children: f[_] }),
@@ -7049,52 +7111,52 @@ const Ce = ({
       ]
     }
   );
-}, Ai = (s, t) => s.find((e) => e.key === t)?.label || `${t}`, xi = ({
+}, Ei = (s, t) => s.find((e) => e.key === t)?.label || `${t}`, Ti = ({
   disabled: s,
   allowRepeats: t,
   options: e,
   value: a,
   onChange: l
 }) => {
-  const [r, i] = U(), [n, o] = U([]), [d, c] = U([]);
+  const [r, i] = D(), [n, o] = D([]), [d, c] = D([]);
   Ct(() => {
-    const u = a.length === 0, k = a.map((b) => Ai(e, b));
-    o(k), u && l(a), p();
+    const u = a.length === 0, y = a.map((k) => Ei(e, k));
+    o(y), u && l(a), p();
   }, [a, e]);
   const h = (u) => {
-    for (const k of a)
-      if (k === u)
+    for (const y of a)
+      if (y === u)
         return !0;
     return !1;
   }, f = (u) => {
-    a.length > u && (a.splice(u, 1), o(n.filter((k, b) => b !== u)), l(a), p());
-  }, y = () => {
+    a.length > u && (a.splice(u, 1), o(n.filter((y, k) => k !== u)), l(a), p());
+  }, b = () => {
     r !== void 0 && (t || !h(r)) && (l(a.concat(r)), m());
   }, m = () => {
     i("");
   }, p = () => {
     if (!t) {
       const u = [];
-      for (const k of e)
-        h(k.key) || u.push(k);
+      for (const y of e)
+        h(y.key) || u.push(y);
       c(u);
     }
   };
-  return /* @__PURE__ */ M("div", { children: [
-    a.map((u, k) => /* @__PURE__ */ M("div", { className: "daga-value-item-element", children: [
-      /* @__PURE__ */ v("span", { className: "daga-input", children: n[k] }),
+  return /* @__PURE__ */ T("div", { children: [
+    a.map((u, y) => /* @__PURE__ */ T("div", { className: "daga-value-item-element", children: [
+      /* @__PURE__ */ v("span", { className: "daga-input", children: n[y] }),
       !s && /* @__PURE__ */ v(
         "button",
         {
           className: "daga-property-button",
-          onClick: () => f(k),
+          onClick: () => f(y),
           children: /* @__PURE__ */ v("div", { className: "daga-icon daga-close-icon" })
         }
       )
-    ] }, k)),
-    !s && /* @__PURE__ */ M("div", { className: "daga-value-item-input", children: [
+    ] }, y)),
+    !s && /* @__PURE__ */ T("div", { className: "daga-value-item-input", children: [
       /* @__PURE__ */ v("div", { className: "daga-input daga-relatively-positioned", children: /* @__PURE__ */ v(
-        so,
+        ao,
         {
           disabled: s,
           options: t ? e || [] : d || [],
@@ -7102,25 +7164,25 @@ const Ce = ({
           onChange: i
         }
       ) }),
-      /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: y, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
+      /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: b, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, Li = ({
+}, Mi = ({
   disabled: s,
   allowRepeats: t,
   value: e,
   onChange: a
 }) => {
-  const [l, r] = U(""), i = (f) => {
-    for (const y of f || [])
-      if (y === f)
+  const [l, r] = D(""), i = (f) => {
+    for (const b of f || [])
+      if (b === f)
         return !0;
     return !1;
   }, n = (f) => {
-    e.length > f && a(e.filter((y, m) => m !== f));
-  }, o = (f, y, m) => {
+    e.length > f && a(e.filter((b, m) => m !== f));
+  }, o = (f, b, m) => {
     const p = e.map(
-      (u, k) => k === y ? m === "blur" ? f.trim() : f : u
+      (u, y) => y === b ? m === "blur" ? f.trim() : f : u
     );
     a(p);
   }, d = () => {
@@ -7131,29 +7193,29 @@ const Ce = ({
   }, h = (f) => {
     f.key === "Enter" && d();
   };
-  return /* @__PURE__ */ M(ao, { children: [
-    e.map((f, y) => /* @__PURE__ */ M("div", { className: "daga-value-item-element", children: [
+  return /* @__PURE__ */ T(ho, { children: [
+    e.map((f, b) => /* @__PURE__ */ T("div", { className: "daga-value-item-element", children: [
       /* @__PURE__ */ v(
         "input",
         {
           className: "daga-input",
           disabled: s,
           value: f,
-          onChange: (m) => o(m.target.value, y, "change"),
-          onBlur: (m) => o(m.target.value, y, "blur")
+          onChange: (m) => o(m.target.value, b, "change"),
+          onBlur: (m) => o(m.target.value, b, "blur")
         }
       ),
       /* @__PURE__ */ v(
         "button",
         {
           className: "daga-property-button",
-          onClick: () => n(y),
+          onClick: () => n(b),
           children: /* @__PURE__ */ v("div", { className: "daga-icon daga-close-icon" })
         }
       )
-    ] }, y)),
-    !s && /* @__PURE__ */ M("div", { className: "daga-value-item-input", children: [
-      /* @__PURE__ */ M("div", { className: "daga-input daga-relatively-positioned", children: [
+    ] }, b)),
+    !s && /* @__PURE__ */ T("div", { className: "daga-value-item-input", children: [
+      /* @__PURE__ */ T("div", { className: "daga-input daga-relatively-positioned", children: [
         /* @__PURE__ */ v(
           "input",
           {
@@ -7168,62 +7230,62 @@ const Ce = ({
       /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: d, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, Ei = ({
+}, Ni = ({
   disabled: s,
   value: t,
   onChange: e
 }) => {
-  const [a, l] = U(""), [r, i] = U(""), [n, o] = U({}), d = (u) => {
-    const k = {};
-    Object.keys(t).forEach((b) => {
-      b !== u && (k[b] = t[b]);
-    }), e(k);
-  }, c = (u, k, b) => {
-    const N = b === "blur" ? k.trim() : k;
-    if (b === "blur") {
+  const [a, l] = D(""), [r, i] = D(""), [n, o] = D({}), d = (u) => {
+    const y = {};
+    Object.keys(t).forEach((k) => {
+      k !== u && (y[k] = t[k]);
+    }), e(y);
+  }, c = (u, y, k) => {
+    const N = k === "blur" ? y.trim() : y;
+    if (k === "blur") {
       if (u !== N) {
-        const V = {};
+        const R = {};
         Object.keys(t).forEach((P) => {
-          P === u ? V[N] = t[P] : V[P] = t[P];
-        }), e(V), o((P) => {
+          P === u ? R[N] = t[P] : R[P] = t[P];
+        }), e(R), o((P) => {
           const tt = { ...P };
           return delete tt[u], tt;
         });
       }
     } else
-      o((V) => ({
-        ...V,
-        [u]: k
+      o((R) => ({
+        ...R,
+        [u]: y
       }));
-  }, h = (u, k, b) => {
-    const N = b === "blur" ? k.trim() : k;
+  }, h = (u, y, k) => {
+    const N = k === "blur" ? y.trim() : y;
     if (N !== "") {
-      const V = {};
+      const R = {};
       Object.keys(t).forEach((P) => {
-        P === u ? V[P] = N : V[P] = t[P];
-      }), e(V);
+        P === u ? R[P] = N : R[P] = t[P];
+      }), e(R);
     }
   }, f = () => {
-    const u = a.trim(), k = r.trim();
-    if (u !== "" && k !== "") {
-      const b = {};
+    const u = a.trim(), y = r.trim();
+    if (u !== "" && y !== "") {
+      const k = {};
       Object.keys(t).forEach((N) => {
-        b[N] = t[N];
-      }), b[u] = k, e(b), l(""), i("");
+        k[N] = t[N];
+      }), k[u] = y, e(k), l(""), i("");
     }
-  }, y = () => {
+  }, b = () => {
     l("");
   }, m = () => {
     i("");
   }, p = (u) => {
     u.key === "Enter" && f();
   };
-  return /* @__PURE__ */ M("div", { children: [
-    Object.entries(t).map(([u, k], b) => /* @__PURE__ */ M("div", { className: "daga-value-item-element", children: [
+  return /* @__PURE__ */ T("div", { children: [
+    Object.entries(t).map(([u, y], k) => /* @__PURE__ */ T("div", { className: "daga-value-item-element", children: [
       /* @__PURE__ */ v(
         "input",
         {
-          id: `key-${b}`,
+          id: `key-${k}`,
           className: "daga-input",
           type: "text",
           disabled: s,
@@ -7235,11 +7297,11 @@ const Ce = ({
       /* @__PURE__ */ v(
         "input",
         {
-          id: `value-${b}`,
+          id: `value-${k}`,
           className: "daga-input",
           type: "text",
           disabled: s,
-          value: k,
+          value: y,
           onChange: (N) => h(u, N.target.value, "change"),
           onBlur: (N) => h(u, N.target.value, "blur")
         }
@@ -7253,8 +7315,8 @@ const Ce = ({
         }
       )
     ] }, u)),
-    !s && /* @__PURE__ */ M("div", { className: "daga-value-item-input", children: [
-      /* @__PURE__ */ M("div", { className: "daga-input daga-relatively-positioned", children: [
+    !s && /* @__PURE__ */ T("div", { className: "daga-value-item-input", children: [
+      /* @__PURE__ */ T("div", { className: "daga-input daga-relatively-positioned", children: [
         /* @__PURE__ */ v(
           "input",
           {
@@ -7265,9 +7327,9 @@ const Ce = ({
             onBlur: (u) => c(a, u.target.value, "blur")
           }
         ),
-        /* @__PURE__ */ v("button", { className: "daga-clear", onClick: y })
+        /* @__PURE__ */ v("button", { className: "daga-clear", onClick: b })
       ] }),
-      /* @__PURE__ */ M("div", { className: "daga-input daga-relatively-positioned", children: [
+      /* @__PURE__ */ T("div", { className: "daga-input daga-relatively-positioned", children: [
         /* @__PURE__ */ v(
           "input",
           {
@@ -7283,12 +7345,12 @@ const Ce = ({
       /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: f, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, no = ({
+}, lo = ({
   valueSet: s,
   onValueChange: t,
   depth: e
 }) => {
-  const l = Ut($t).canUserPerformAction(w.UpdateValues) && s?.rootElement?.removed !== !0, r = (o) => "daga-property-name-" + o.replace(/\s/g, ""), i = (o) => {
+  const l = Dt($t).canUserPerformAction(w.UpdateValues) && s?.rootElement?.removed !== !0, r = (o) => "daga-property-name-" + o.replace(/\s/g, ""), i = (o) => {
     if (typeof o == "string")
       return o;
     if (o == null || isNaN(o.valueOf()))
@@ -7296,13 +7358,13 @@ const Ce = ({
     const d = new Date(o), c = d.getTimezoneOffset();
     return d.setMinutes(d.getMinutes() - c), d.toISOString().substring(0, 19);
   }, n = (o) => new Date(o);
-  return /* @__PURE__ */ v("daga-object-editor", { children: s.displayedProperties.map((o) => /* @__PURE__ */ M(
+  return /* @__PURE__ */ v("daga-object-editor", { children: s.displayedProperties.map((o) => /* @__PURE__ */ T(
     "div",
     {
       className: `daga-property ${r(o.name)}`,
       children: [
         /* @__PURE__ */ v("p", { className: "daga-property-name", children: o.label || o.name }),
-        o.type === T.Text && /* @__PURE__ */ v(
+        o.type === M.Text && /* @__PURE__ */ v(
           "input",
           {
             type: "daga-text",
@@ -7311,7 +7373,7 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.TextArea && /* @__PURE__ */ v(
+        o.type === M.TextArea && /* @__PURE__ */ v(
           "textarea",
           {
             disabled: o.editable === !1 || !l,
@@ -7319,7 +7381,7 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.Number && /* @__PURE__ */ v(
+        o.type === M.Number && /* @__PURE__ */ v(
           "input",
           {
             type: "number",
@@ -7328,7 +7390,7 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.Color && /* @__PURE__ */ v(
+        o.type === M.Color && /* @__PURE__ */ v(
           "input",
           {
             type: "text",
@@ -7338,7 +7400,7 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.Datetime && /* @__PURE__ */ v(
+        o.type === M.Datetime && /* @__PURE__ */ v(
           "input",
           {
             type: "datetime-local",
@@ -7353,7 +7415,7 @@ const Ce = ({
             )
           }
         ),
-        o.type === T.Date && /* @__PURE__ */ v(
+        o.type === M.Date && /* @__PURE__ */ v(
           "input",
           {
             type: "date",
@@ -7362,7 +7424,7 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.Time && /* @__PURE__ */ v(
+        o.type === M.Time && /* @__PURE__ */ v(
           "input",
           {
             type: "time",
@@ -7371,7 +7433,7 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.Url && /* @__PURE__ */ v(
+        o.type === M.Url && /* @__PURE__ */ v(
           "input",
           {
             type: "url",
@@ -7380,8 +7442,8 @@ const Ce = ({
             onChange: (d) => t(s, o, d.target.value)
           }
         ),
-        o.type === T.Boolean && /* @__PURE__ */ M("div", { className: "daga-radio", children: [
-          /* @__PURE__ */ M(
+        o.type === M.Boolean && /* @__PURE__ */ T("div", { className: "daga-radio", children: [
+          /* @__PURE__ */ T(
             "label",
             {
               className: "daga-radio-item daga-radio-start" + (s?.getValue(o.name) === !1 ? " daga-checked" : ""),
@@ -7401,7 +7463,7 @@ const Ce = ({
               ]
             }
           ),
-          /* @__PURE__ */ M(
+          /* @__PURE__ */ T(
             "label",
             {
               className: "daga-radio-item daga-radio-end" + (s?.getValue(o.name) === !0 ? " daga-checked" : ""),
@@ -7422,8 +7484,8 @@ const Ce = ({
             }
           )
         ] }),
-        o.type === T.Option && /* @__PURE__ */ v("div", { className: "daga-relatively-positioned", children: /* @__PURE__ */ v(
-          so,
+        o.type === M.Option && /* @__PURE__ */ v("div", { className: "daga-relatively-positioned", children: /* @__PURE__ */ v(
+          ao,
           {
             disabled: o.editable === !1 || !l,
             options: o.options || [],
@@ -7431,35 +7493,35 @@ const Ce = ({
             onChange: (d) => t(s, o, d)
           }
         ) }),
-        (o.type === T.OptionList || o.type === T.OptionSet) && /* @__PURE__ */ v(
-          xi,
+        (o.type === M.OptionList || o.type === M.OptionSet) && /* @__PURE__ */ v(
+          Ti,
           {
             disabled: o.editable === !1 || !l,
-            allowRepeats: o.type === T.OptionList,
+            allowRepeats: o.type === M.OptionList,
             options: o.options || [],
             value: s?.getValue(o.name),
             onChange: (d) => t(s, o, d)
           }
         ),
-        (o.type === T.TextList || o.type === T.TextSet) && /* @__PURE__ */ v(
-          Li,
+        (o.type === M.TextList || o.type === M.TextSet) && /* @__PURE__ */ v(
+          Mi,
           {
             disabled: o.editable === !1 || !l,
-            allowRepeats: o.type === T.TextList,
+            allowRepeats: o.type === M.TextList,
             value: s?.getValue(o.name),
             onChange: (d) => t(s, o, d)
           }
         ),
-        o.type === T.TextMap && /* @__PURE__ */ v(
-          Ei,
+        o.type === M.TextMap && /* @__PURE__ */ v(
+          Ni,
           {
             disabled: o.editable === !1 || !l,
             value: s?.getValue(o.name),
             onChange: (d) => t(s, o, d)
           }
         ),
-        o.type === T.Object && /* @__PURE__ */ v("div", { className: "daga-left-bar", children: /* @__PURE__ */ v(
-          no,
+        o.type === M.Object && /* @__PURE__ */ v("div", { className: "daga-left-bar", children: /* @__PURE__ */ v(
+          lo,
           {
             valueSet: s.getSubValueSet(o.name),
             onValueChange: t,
@@ -7470,34 +7532,34 @@ const Ce = ({
     },
     o.name
   )) });
-}, ro = ({ valueSet: s, depth: t }) => {
-  const e = Ut($t), a = rt(null), l = (o) => "daga-property-name-" + o.replace(/\s/g, ""), r = () => {
+}, co = ({ valueSet: s, depth: t }) => {
+  const e = Dt($t), a = rt(null), l = (o) => "daga-property-name-" + o.replace(/\s/g, ""), r = () => {
     for (const o of s?.displayedProperties || []) {
       let d = 0, c = 0, h = 0;
       const f = x.select(a.current).select(
         `.daga-property.${l(o.name)}.daga-depth-${t}`
       );
       f.select("button.daga-move-button").call(
-        x.drag().on(I.Start, (y) => {
+        x.drag().on(A.Start, (b) => {
           S(L.Grabbing);
-          const m = e.getPointerLocationRelativeToScreen(y);
+          const m = e.getPointerLocationRelativeToScreen(b);
           if (m.length < 2 || isNaN(m[0]) || isNaN(m[1]))
             return;
           const p = f.node()?.getBoundingClientRect();
           d = p?.width || 0, c = p?.height || 0, f.style("position", "fixed").style("left", `${m[0] - d / 2}px`).style("top", `${m[1] - c / 2}px`).style("width", `${d}px`).style("height", `${c}px`).style("z-index", 1);
-        }).on(I.Drag, (y) => {
+        }).on(A.Drag, (b) => {
           S(L.Grabbing);
-          const m = e.getPointerLocationRelativeToScreen(y);
+          const m = e.getPointerLocationRelativeToScreen(b);
           m.length < 2 || isNaN(m[0]) || isNaN(m[1]) || (f.style("position", "fixed").style("left", `${m[0] - d / 2}px`).style("top", `${m[1] - c / 2}px`).style("width", `${d}px`).style("height", `${c}px`).style("z-index", 1), x.select(a.current).select(
             `.daga-dropbar.daga-index-${h}.daga-depth-${t}`
           ).style("visibility", "hidden").style("height", 0), h = i(m), x.select(a.current).select(
             `.daga-dropbar.daga-index-${h}.daga-depth-${t}`
           ).style("visibility", "visible").style("height", "0.25rem"));
-        }).on(I.End, (y) => {
+        }).on(A.End, (b) => {
           S(L.Auto), f.style("position", "relative").style("left", 0).style("top", 0).style("z-index", 0).style("width", "unset").style("height", "unset"), x.select(a.current).select(
             `.daga-dropbar.daga-index-${h}.daga-depth-${t}`
           ).style("visibility", "hidden").style("height", 0);
-          const m = e.getPointerLocationRelativeToScreen(y);
+          const m = e.getPointerLocationRelativeToScreen(b);
           m.length < 2 || isNaN(m[0]) || isNaN(m[1]) || (h = i(m), s?.displayedProperties?.splice(
             s.displayedProperties.indexOf(o),
             1
@@ -7522,7 +7584,7 @@ const Ce = ({
     }
     if (c.length > 0) {
       const h = c.map(
-        (y) => ((o[0] - y[0]) ** 2 + (o[1] - y[1]) ** 2) ** 0.5
+        (b) => ((o[0] - b[0]) ** 2 + (o[1] - b[1]) ** 2) ** 0.5
       );
       return h.indexOf(
         Math.min(...h)
@@ -7533,25 +7595,25 @@ const Ce = ({
     if (s === void 0)
       return;
     let d;
-    o instanceof Mo ? d = o : o instanceof Event ? d = s?.propertySet.getProperty(
+    o instanceof Po ? d = o : o instanceof Event ? d = s?.propertySet.getProperty(
       o.target?.value || ""
     ) : d = s?.propertySet.getProperty(o || ""), d && s?.hideProperty(d), r();
   };
-  return /* @__PURE__ */ M("daga-property-settings", { ref: a, children: [
+  return /* @__PURE__ */ T("daga-property-settings", { ref: a, children: [
     /* @__PURE__ */ v("div", { className: `daga-dropbar daga-index-0 daga-depth-${t}` }),
-    s?.displayedProperties.map((o, d) => /* @__PURE__ */ M(
+    s?.displayedProperties.map((o, d) => /* @__PURE__ */ T(
       "div",
       {
         className: `daga-property-and-dropbar ${l(o.name)} daga-depth-${t}`,
         children: [
-          /* @__PURE__ */ M(
+          /* @__PURE__ */ T(
             "div",
             {
               className: `daga-property ${l(o.name)} daga-depth-${t}`,
               children: [
-                /* @__PURE__ */ M("div", { className: "daga-property-name", children: [
+                /* @__PURE__ */ T("div", { className: "daga-property-name", children: [
                   /* @__PURE__ */ v("span", { children: o.label || o.name }),
-                  /* @__PURE__ */ M("div", { className: "daga-buttons", children: [
+                  /* @__PURE__ */ T("div", { className: "daga-buttons", children: [
                     /* @__PURE__ */ v("button", { className: "daga-property-button daga-move-button", children: /* @__PURE__ */ v("div", { className: "daga-icon daga-move-icon" }) }),
                     /* @__PURE__ */ v(
                       "button",
@@ -7563,9 +7625,9 @@ const Ce = ({
                     )
                   ] })
                 ] }),
-                o.type !== T.Object && /* @__PURE__ */ v("div", { className: "daga-property-value", children: Mi(s?.getValue(o.name)) }),
-                o.type === T.Object && /* @__PURE__ */ v(
-                  ro,
+                o.type !== M.Object && /* @__PURE__ */ v("div", { className: "daga-property-value", children: Pi(s?.getValue(o.name)) }),
+                o.type === M.Object && /* @__PURE__ */ v(
+                  co,
                   {
                     valueSet: s?.getSubValueSet(o.name),
                     depth: t + 1
@@ -7585,8 +7647,8 @@ const Ce = ({
       o.name
     ))
   ] });
-}, Mi = (s) => Array.isArray(s) ? s.join(", ") : To(s) ? Object.entries(s).map((t) => t.map((e) => JSON.stringify(e)).join(": ")).join(", ") : s instanceof Date ? s.toLocaleString() : s == null ? "" : "" + s, Ti = ({ location: s, direction: t, width: e, height: a, title: l, valueSet: r, onValueChange: i }) => {
-  const n = rt(null), [o, d] = U(!1), [c, h] = U(!1), f = () => x.select(n.current);
+}, Pi = (s) => Array.isArray(s) ? s.join(", ") : zo(s) ? Object.entries(s).map((t) => t.map((e) => JSON.stringify(e)).join(": ")).join(", ") : s instanceof Date ? s.toLocaleString() : s == null ? "" : "" + s, zi = ({ location: s, direction: t, width: e, height: a, title: l, valueSet: r, onValueChange: i }) => {
+  const n = rt(null), [o, d] = D(!1), [c, h] = D(!1), f = () => x.select(n.current);
   return Ct(() => {
     if (n.current)
       switch (t) {
@@ -7599,14 +7661,14 @@ const Ce = ({
           f().style("height", e), a && f().select(".daga-panel-content").style("width", a);
           break;
       }
-  }, [e, t]), /* @__PURE__ */ v("daga-property-editor", { children: /* @__PURE__ */ M(
+  }, [e, t]), /* @__PURE__ */ v("daga-property-editor", { children: /* @__PURE__ */ T(
     "div",
     {
       ref: n,
       className: `daga-panel daga-bottom daga-${s} daga-${t}`,
       children: [
         /* @__PURE__ */ v(
-          Ce,
+          Ie,
           {
             disabled: !r || !r.propertySet || !r.propertySet.hasProperties(),
             collapsed: o,
@@ -7619,8 +7681,8 @@ const Ce = ({
             onCollapse: d
           }
         ),
-        /* @__PURE__ */ v("div", { className: "daga-panel-content", children: r && r.propertySet && r.propertySet.hasProperties() && !o && /* @__PURE__ */ M("div", { children: [
-          l && /* @__PURE__ */ M("p", { className: "daga-title", children: [
+        /* @__PURE__ */ v("div", { className: "daga-panel-content", children: r && r.propertySet && r.propertySet.hasProperties() && !o && /* @__PURE__ */ T("div", { children: [
+          l && /* @__PURE__ */ T("p", { className: "daga-title", children: [
             l,
             /* @__PURE__ */ v(
               "button",
@@ -7637,22 +7699,22 @@ const Ce = ({
             )
           ] }),
           !c && /* @__PURE__ */ v(
-            no,
+            lo,
             {
               valueSet: r,
               onValueChange: i,
               depth: 0
             }
           ),
-          c && /* @__PURE__ */ v(ro, { valueSet: r, depth: 0 })
+          c && /* @__PURE__ */ v(co, { valueSet: r, depth: 0 })
         ] }) })
       ]
     }
   ) });
-}, Ni = 6, Pi = (s) => {
-  const t = Ut($t), [e, a] = U(
+}, Ri = 6, Vi = (s) => {
+  const t = Dt($t), [e, a] = D(
     s.currentPalette || s.palettes[0]
-  ), [l, r] = U(0), [i, n] = U(
+  ), [l, r] = D(0), [i, n] = D(
     void 0
   ), o = rt(null), d = (p) => {
     if (a(p), c().selectAll("*").remove(), r(t.getPriorityThreshold() || 0), p.categories && h(p.categories), p.templates)
@@ -7661,62 +7723,62 @@ const Ce = ({
   }, c = () => x.select(o.current).select(".daga-palette-view"), h = (p) => {
     const u = c().append("select").style("width", "100%").style("height", "2rem").style("padding", "0.5rem").style("border-radius", "0.25rem").style("background-color", "#f7f8fc").style("border", "1px solid #e6e6e6");
     u.append("option").attr("value", "").text("(None selected)");
-    for (const k in p)
-      u.append("option").attr("value", k).text(k);
+    for (const y in p)
+      u.append("option").attr("value", y).text(y);
     u.on($.Change, () => {
       i && c().selectAll(".daga-template-container.daga-in-category").remove();
-      const k = u.property("value");
-      n(k);
-      const b = p[k] || [];
-      for (const N of b)
+      const y = u.property("value");
+      n(y);
+      const k = p[y] || [];
+      for (const N of k)
         f(N, "daga-in-category");
     }), i && (u.property("value", i), u.dispatch($.Change));
   }, f = (p, u) => {
     if (p.templateType === "node") {
-      const k = t.model.nodes.types.get(p.type);
-      k ? y(k, p, u) : console.error(`Could not find a node type called '${p.type}'`);
+      const y = t.model.nodes.types.get(p.type);
+      y ? b(y, p, u) : console.error(`Could not find a node type called '${p.type}'`);
     } else if (p.templateType === "connection") {
-      const k = t.model.connections.types.get(p.type);
-      k ? m(k, p, u) : console.error(
+      const y = t.model.connections.types.get(p.type);
+      y ? m(y, p, u) : console.error(
         `Could not find a connection type called '${p.type}'`
       );
     }
-  }, y = (p, u, k) => {
+  }, b = (p, u, y) => {
     if (l !== void 0 && p.priority < l)
       return;
-    const b = p.defaultLook.lookType === "shaped-look" ? p.defaultLook.borderThickness || 1 : 0, N = p.defaultHeight + b, V = p.defaultWidth + b, P = u.height || N, tt = u.width || V, E = c().append("div").attr(
+    const k = p.defaultLook.lookType === "shaped-look" ? p.defaultLook.borderThickness || 1 : 0, N = p.defaultHeight + k, R = p.defaultWidth + k, P = u.height || N, tt = u.width || R, E = c().append("div").attr(
       "class",
-      `daga-template-container ${k !== void 0 ? k : ""}`
+      `daga-template-container ${y !== void 0 ? y : ""}`
     ).style("width", `${tt}px`).style("height", `${P}px`).call(
-      x.drag().on(I.Drag, (O) => {
+      x.drag().on(A.Drag, (O) => {
         if (t.canUserPerformAction(w.AddNode)) {
-          const A = t.getPointerLocationRelativeToScreen(O);
-          if (A.length < 2 || isNaN(A[0]) || isNaN(A[1]))
+          const I = t.getPointerLocationRelativeToScreen(O);
+          if (I.length < 2 || isNaN(I[0]) || isNaN(I[1]))
             return;
-          E.style("position", "fixed").style("left", `${A[0] - tt / 2}px`).style("top", `${A[1] - P / 2}px`).style("z-index", 1);
+          E.style("position", "fixed").style("left", `${I[0] - tt / 2}px`).style("top", `${I[1] - P / 2}px`).style("z-index", 1);
         }
-      }).on(I.Start, (O) => {
+      }).on(A.Start, (O) => {
         if (t.canUserPerformAction(w.AddNode)) {
           S(L.Grabbing);
-          const A = t.getPointerLocationRelativeToScreen(O);
-          if (A.length < 2 || isNaN(A[0]) || isNaN(A[1]))
+          const I = t.getPointerLocationRelativeToScreen(O);
+          if (I.length < 2 || isNaN(I[0]) || isNaN(I[1]))
             return;
-          E.style("position", "fixed").style("left", `${A[0] - tt / 2}px`).style("top", `${A[1] - P / 2}px`).style("z-index", 1), p.isUnique && t.model.nodes.find(
+          E.style("position", "fixed").style("left", `${I[0] - tt / 2}px`).style("top", `${I[1] - P / 2}px`).style("z-index", 1), p.isUnique && t.model.nodes.find(
             (_) => !_.removed && _.type.id === p.id
           ) !== void 0 && S(L.NotAllowed);
         }
-      }).on(I.End, (O) => {
+      }).on(A.End, (O) => {
         if (t.canUserPerformAction(w.AddNode)) {
           if (S(L.Auto), E.style("position", "relative").style("left", 0).style("top", 0).style("z-index", "auto"), p.isUnique && t.model.nodes.find(
-            (Xt) => !Xt.removed && Xt.type.id === p.id
+            (jt) => !jt.removed && jt.type.id === p.id
           ) !== void 0)
             return;
-          const A = t.getPointerLocationRelativeToScreen(O);
-          if (A.length < 2 || isNaN(A[0]) || isNaN(A[1]))
+          const I = t.getPointerLocationRelativeToScreen(O);
+          if (I.length < 2 || isNaN(I[0]) || isNaN(I[1]))
             return;
           const _ = document.elementFromPoint(
-            A[0],
-            A[1]
+            I[0],
+            I[1]
           );
           if (_ && !t.selectCanvasView().node()?.contains(_))
             return;
@@ -7735,33 +7797,33 @@ const Ce = ({
             lt[0],
             lt[1]
           ).filter(
-            (Xt) => Xt.type.childrenTypes.includes(p.id)
-          ), wt = Xe(
+            (jt) => jt.type.childrenTypes.includes(p.id)
+          ), wt = Ze(
             J
           ), nt = wt[wt.length - 1];
           if (!p.canBeParentless && nt === void 0)
             return;
-          const Yt = nt?.getLastAncestor(), $e = new Wo(
+          const Xt = nt?.getLastAncestor(), xe = new qo(
             t,
             p,
             q,
             nt?.id,
-            Yt?.id,
-            Yt?.getGeometry(),
+            Xt?.id,
+            Xt?.getGeometry(),
             void 0,
             u.label,
             u.values
           );
-          $e.do(), t?.actionStack.add($e), S();
+          xe.do(), t?.actionStack.add(xe), S();
         }
       })
-    ).append("svg").attr("class", `palette-node ${p.id}`).attr("viewBox", `0 0 ${V} ${N}`).attr("preserveAspectRatio", "none").style("position", "relative").style("left", 0).style("top", 0).style("width", `${tt}px`).style("height", `${P}px`), C = u.look || p.defaultLook;
+    ).append("svg").attr("class", `palette-node ${p.id}`).attr("viewBox", `0 0 ${R} ${N}`).attr("preserveAspectRatio", "none").style("position", "relative").style("left", 0).style("top", 0).style("width", `${tt}px`).style("height", `${P}px`), C = u.look || p.defaultLook;
     switch (C.lookType) {
       case "shaped-look":
         E.append("path").attr(
           "d",
-          me(
-            C.shape || Tt.Rectangle,
+          ve(
+            C.shape || Mt.Rectangle,
             (C.borderThickness || 1) / 2,
             (C.borderThickness || 1) / 2,
             p.defaultWidth,
@@ -7802,35 +7864,35 @@ const Ce = ({
           ).html(O.html);
       if (u.label) {
         const O = {
-          ...R,
+          ...V,
           ...p.label,
           ...u.labelLook
         };
         E.append("text").attr(
           "transform",
-          `translate(${(B(O) + p.defaultWidth) / 2},${(F(O) + p.defaultHeight) / 2})`
+          `translate(${(Y(O) + p.defaultWidth) / 2},${(U(O) + p.defaultHeight) / 2})`
         ).attr("x", 0).attr("y", 0).attr("font-size", `${O.fontSize}px`).attr("text-anchor", "middle").attr("font-family", O.fontFamily).attr("font-weight", 400).attr("fill", O.color).attr("stroke", "none").style("font-kerning", "none").style("user-select", "none").text(u.label);
       }
     }
-  }, m = (p, u, k) => {
-    const b = c().append("div").attr(
+  }, m = (p, u, y) => {
+    const k = c().append("div").attr(
       "class",
-      `daga-template-container ${k !== void 0 ? k : ""}`
+      `daga-template-container ${y !== void 0 ? y : ""}`
     ).style("width", `${u.width}px`).style("height", `${u.height}px`).append("svg").attr("class", `palette-button ${p.id}`).style("position", "relative").style("left", 0).style("top", 0).style("width", "100%").style("height", "100%").on("click", () => {
       t.connectionType = p;
     });
-    b.append("path").attr(
+    k.append("path").attr(
       "d",
-      me(
-        Tt.Rectangle,
+      ve(
+        Mt.Rectangle,
         0,
         0,
         u.width,
         u.height
       )
-    ).attr("fill", u.backgroundColor).attr("stroke", "black").attr("stroke-width", "1px"), u.icon !== "" && b.append("image").attr("x", 0).attr("y", 0).attr("width", u.width).attr("height", u.height).attr("href", u.icon), u.label !== "" && b.append("text").attr(
+    ).attr("fill", u.backgroundColor).attr("stroke", "black").attr("stroke-width", "1px"), u.icon !== "" && k.append("image").attr("x", 0).attr("y", 0).attr("width", u.width).attr("height", u.height).attr("href", u.icon), u.label !== "" && k.append("text").attr(
       "transform",
-      `translate(${u.width / 2},${u.height / 2 + Ni})`
+      `translate(${u.width / 2},${u.height / 2 + Ri})`
     ).attr("x", 0).attr("y", 0).attr("font-size", "20px").attr("text-anchor", "middle").attr("font-family", "'Wonder Unit Sans', sans-serif").attr("font-weight", 400).attr("fill", "#000000").attr("stroke", "none").style("font-kerning", "none").style("user-select", "none").text(u.label);
   };
   return Ct(() => {
@@ -7845,14 +7907,14 @@ const Ce = ({
           o.current.style.height = s.width, s.height && (o.current.style.width = s.height);
           break;
       }
-  }, [e, s.palettes]), /* @__PURE__ */ v("daga-palette", { children: /* @__PURE__ */ M(
+  }, [e, s.palettes]), /* @__PURE__ */ v("daga-palette", { children: /* @__PURE__ */ T(
     "div",
     {
       ref: o,
       className: `daga-panel daga-${s.location} daga-${s.direction}`,
       children: [
         /* @__PURE__ */ v(
-          Ce,
+          Ie,
           {
             direction: s.direction,
             collapsableSelector: o,
@@ -7864,7 +7926,7 @@ const Ce = ({
             disabled: !1
           }
         ),
-        /* @__PURE__ */ M("div", { className: "daga-panel-content", children: [
+        /* @__PURE__ */ T("div", { className: "daga-panel-content", children: [
           s.palettes.length > 1 && /* @__PURE__ */ v("div", { className: "daga-panel-tabs", children: s.palettes.map((p) => /* @__PURE__ */ v(
             "div",
             {
@@ -7878,7 +7940,7 @@ const Ce = ({
       ]
     }
   ) });
-}, zi = ({
+}, Oi = ({
   location: s,
   direction: t,
   enableAction: e,
@@ -7887,111 +7949,111 @@ const Ce = ({
   enableSelection: r,
   enableZoom: i
 }) => {
-  let n = !1, o = !0, d = !1, c, h, f, y;
+  let n = !1, o = !0, d = !1, c, h, f, b;
   switch (t) {
     case g.Bottom:
-      c = "height", h = "scaleY", f = "top", y = "bottom";
+      c = "height", h = "scaleY", f = "top", b = "bottom";
       break;
     case g.Top:
-      c = "height", h = "scaleY", f = "bottom", y = "top";
+      c = "height", h = "scaleY", f = "bottom", b = "top";
       break;
     case g.Left:
-      c = "width", h = "scaleX", f = "right", y = "left";
+      c = "width", h = "scaleX", f = "right", b = "left";
       break;
     case g.Right:
-      c = "width", h = "scaleX", f = "left", y = "right";
+      c = "width", h = "scaleX", f = "left", b = "right";
       break;
   }
   const m = rt(null), p = rt(null), u = rt(null);
   Ct(() => {
     x.select(
       m.current
-    ).style(`margin-${y}`, "-1rem").style(c, "0rem").style("transform", `${h}(0)`).style("transform-origin", f);
+    ).style(`margin-${b}`, "-1rem").style(c, "0rem").style("transform", `${h}(0)`).style("transform-origin", f);
   });
-  const k = async () => {
+  const y = async () => {
     const J = x.select(
       m.current
     );
     if (!d)
       if (o) {
         o = !1;
-        const Yt = `${4 * J.selectChildren().size()}rem`;
-        J.transition().duration(500).ease(x.easeLinear).style(c, Yt).style("transform", `${h}(1)`), setTimeout(() => {
+        const Xt = `${4 * J.selectChildren().size()}rem`;
+        J.transition().duration(500).ease(x.easeLinear).style(c, Xt).style("transform", `${h}(1)`), setTimeout(() => {
           d = !1;
         }, 500);
       } else
         o = !0, J.transition().duration(500).ease(x.easeLinear).style(c, "0rem").style("transform", `${h}(0)`), setTimeout(() => {
           d = !1;
         }, 500);
-  }, b = Ut($t), N = () => {
-    b.zoomBy(b.zoomFactor);
-  }, V = () => {
-    b.zoomBy(1 / b.zoomFactor);
+  }, k = Dt($t), N = () => {
+    k.zoomBy(k.zoomFactor);
+  }, R = () => {
+    k.zoomBy(1 / k.zoomFactor);
   }, P = () => {
-    b.center();
+    k.center();
   }, tt = () => {
-    b.layoutFormat && b.layoutFormat in Re && Re[b.layoutFormat].apply(b.model);
+    k.layoutFormat && k.layoutFormat in _e && _e[k.layoutFormat].apply(k.model);
   }, E = () => {
     n = !n, x.select(
       u.current
     ).classed("daga-on", n).classed("daga-off", !n);
-    const J = b.getPriorityThresholdOptions();
-    J && J.length >= 2 && b.setPriorityThreshold(
+    const J = k.getPriorityThresholdOptions();
+    J && J.length >= 2 && k.setPriorityThreshold(
       J[n ? 1 : 0]
     );
   }, C = () => {
-    b.actionStack.undo();
+    k.actionStack.undo();
   }, O = () => {
-    b.actionStack.redo();
-  }, A = () => {
-    b.userSelection.copyToClipboard();
+    k.actionStack.redo();
+  }, I = () => {
+    k.userSelection.copyToClipboard();
   }, _ = () => {
-    b.userSelection.cutToClipboard();
+    k.userSelection.cutToClipboard();
   }, lt = () => {
-    b.userSelection.pasteFromClipboard();
+    k.userSelection.pasteFromClipboard();
   }, q = () => {
-    b.userSelection.removeFromModel();
+    k.userSelection.removeFromModel();
   }, Bt = () => {
-    b.multipleSelectionOn = !0, x.select(
+    k.multipleSelectionOn = !0, x.select(
       p.current
     ).classed("daga-on", !0).classed("daga-off", !1);
-    const J = b.diagramEvent$.subscribe((wt) => {
-      wt.type === Ke.Selection && (x.select(
+    const J = k.diagramEvent$.subscribe((wt) => {
+      wt.type === Qe.Selection && (x.select(
         p.current
       ).classed("daga-on", !1).classed("daga-off", !0), J.unsubscribe());
     });
   };
-  return /* @__PURE__ */ v("daga-diagram-buttons", { children: /* @__PURE__ */ M(
+  return /* @__PURE__ */ v("daga-diagram-buttons", { children: /* @__PURE__ */ T(
     "div",
     {
       className: `daga-diagram-buttons daga-${s} daga-${t}`,
       children: [
-        i && b.canUserPerformAction(w.Zoom) && /* @__PURE__ */ v("button", { className: "daga-zoom-in", onClick: N, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Zoom in" }) }),
-        i && b.canUserPerformAction(w.Zoom) && /* @__PURE__ */ v("button", { className: "daga-zoom-out", onClick: V, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Zoom out" }) }),
-        /* @__PURE__ */ M("div", { className: "daga-collapsable-buttons daga-collapsed", ref: m, children: [
-          i && b.canUserPerformAction(w.Zoom) && /* @__PURE__ */ v("button", { className: "daga-center", onClick: P, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Fit diagram to screen" }) }),
+        i && k.canUserPerformAction(w.Zoom) && /* @__PURE__ */ v("button", { className: "daga-zoom-in", onClick: N, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Zoom in" }) }),
+        i && k.canUserPerformAction(w.Zoom) && /* @__PURE__ */ v("button", { className: "daga-zoom-out", onClick: R, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Zoom out" }) }),
+        /* @__PURE__ */ T("div", { className: "daga-collapsable-buttons daga-collapsed", ref: m, children: [
+          i && k.canUserPerformAction(w.Zoom) && /* @__PURE__ */ v("button", { className: "daga-center", onClick: P, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Fit diagram to screen" }) }),
           e && /* @__PURE__ */ v("button", { className: "daga-undo", onClick: C, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Undo" }) }),
           e && /* @__PURE__ */ v("button", { className: "daga-redo", onClick: O, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Redo" }) }),
-          r && /* @__PURE__ */ v("button", { className: "daga-copy", onClick: A, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Copy" }) }),
+          r && /* @__PURE__ */ v("button", { className: "daga-copy", onClick: I, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Copy" }) }),
           r && /* @__PURE__ */ v("button", { className: "daga-cut", onClick: _, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Cut" }) }),
           r && /* @__PURE__ */ v("button", { className: `daga-multiple-selection ${n ? "daga-on" : "daga-off"}`, onClick: Bt, ref: p, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Multiple selection" }) }),
           r && /* @__PURE__ */ v("button", { className: "daga-paste", onClick: lt, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Paste" }) }),
           r && /* @__PURE__ */ v("button", { className: "daga-delete", onClick: q, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Delete" }) }),
-          l && b.layoutFormat && /* @__PURE__ */ v("button", { className: "daga-layout", onClick: tt, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Apply layout" }) }),
+          l && k.layoutFormat && /* @__PURE__ */ v("button", { className: "daga-layout", onClick: tt, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Apply layout" }) }),
           a && /* @__PURE__ */ v("button", { className: `daga-filter ${n ? "daga-on" : "daga-off"}`, onClick: E, ref: u, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Apply filter" }) })
         ] }),
-        /* @__PURE__ */ v("button", { className: "daga-more-options", onClick: k, children: o ? /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "More options" }) : /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Less options" }) })
+        /* @__PURE__ */ v("button", { className: "daga-more-options", onClick: y, children: o ? /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "More options" }) : /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Less options" }) })
       ]
     }
   ) });
-}, Hi = ({
+}, Fi = ({
   config: s,
   model: t,
   onCanvasCreated: e,
   onDiagramEvent: a,
   onModelChange: l
 }) => {
-  const r = new Ze(), i = new Qe(), n = rt(null), o = rt(void 0), d = rt(!1), c = [], [h, f] = U(void 0), [y, m] = U(void 0), p = {
+  const r = new Je(), i = new oo(), n = rt(null), o = rt(void 0), d = rt(!1), c = [], [h, f] = D(void 0), [b, m] = D(void 0), p = {
     zoomIn: () => {
     },
     zoomOut: () => {
@@ -8009,49 +8071,49 @@ const Ce = ({
   }, u = {
     refreshPalette: () => {
     }
-  }, k = new Ci(
+  }, y = new Ii(
     (E) => f(E),
     (E) => m(E)
-  ), b = {
+  ), k = {
     diagramButtons: p,
     palette: u,
-    propertyEditor: k
-  }, N = (E = !1) => ((!o.current || E) && (c.forEach((C) => C.unsubscribe()), o.current = new ye(b, s)), o.current), V = N(), P = (E) => {
-    V.initView(E), c.push(
-      V.diagramEvent$.subscribe((C) => {
+    propertyEditor: y
+  }, N = (E = !1) => ((!o.current || E) && (c.forEach((C) => C.unsubscribe()), o.current = new we(k, s)), o.current), R = N(), P = (E) => {
+    R.initView(E), c.push(
+      R.diagramEvent$.subscribe((C) => {
         a?.(C);
       })
     ), c.push(
-      V.diagramChange$.subscribe(() => {
-        const C = i.export(V.model);
+      R.diagramChange$.subscribe(() => {
+        const C = i.export(R.model);
         l?.(C);
       })
     );
   };
   Ct(() => {
-    n.current && (d.current || (P(n.current), d.current = !0, e?.(V)));
-  }, [n.current]), go(() => {
-    n.current && (N(!0), P(n.current), e?.(V));
+    n.current && (d.current || (P(n.current), d.current = !0, e?.(R)));
+  }, [n.current]), po(() => {
+    n.current && (N(!0), P(n.current), e?.(R));
   }, [s]), Ct(() => {
-    t && r.import(V.model, t);
+    t && r.import(R.model, t);
   }, [t]);
   const tt = (E, C, O) => {
-    if (y !== void 0 && C.editable !== !1 && !St(E.getValue(C.name), O)) {
+    if (b !== void 0 && C.editable !== !1 && !St(E.getValue(C.name), O)) {
       E.setValue(C.name, O);
-      const A = new yt(
-        y.propertySet,
+      const I = new yt(
+        b.propertySet,
         void 0
       );
-      A.setValues(y.getValues()), A.rootElement = y.rootElement, k.valueSet = A, y.rootElement.valueSet = A, V.propertyEditorChanges$?.next();
+      I.setValues(b.getValues()), I.rootElement = b.rootElement, y.valueSet = I, b.rootElement.valueSet = I, R.propertyEditorChanges$?.next();
     }
   };
-  return /* @__PURE__ */ v("daga-diagram", { children: /* @__PURE__ */ v(Si.Provider, { value: s, children: /* @__PURE__ */ v($t.Provider, { value: V, children: /* @__PURE__ */ M("daga-diagram-editor", { children: [
+  return /* @__PURE__ */ v("daga-diagram", { children: /* @__PURE__ */ v(Ai.Provider, { value: s, children: /* @__PURE__ */ v($t.Provider, { value: R, children: /* @__PURE__ */ T("daga-diagram-editor", { children: [
     /* @__PURE__ */ v("div", { className: "daga-append-to", ref: n }),
-    /* @__PURE__ */ M($t.Provider, { value: V, children: [
+    /* @__PURE__ */ T($t.Provider, { value: R, children: [
       s.components?.buttons !== void 0 && s.components?.buttons?.enabled !== !1 && /* @__PURE__ */ v(
-        zi,
+        Oi,
         {
-          location: s.components?.buttons?.location || Zt.BottomRight,
+          location: s.components?.buttons?.location || Kt.BottomRight,
           direction: s.components?.buttons?.direction || g.Top,
           enableAction: s.components?.buttons?.enableAction !== !1,
           enableFilter: s.components?.buttons?.enableFilter === !0,
@@ -8061,9 +8123,9 @@ const Ce = ({
         }
       ),
       s.components?.palette !== void 0 && s.components?.palette?.enabled !== !1 && s.components?.palette?.sections && (s.components?.palette?.sections?.length || 0) > 0 && /* @__PURE__ */ v(
-        Pi,
+        Vi,
         {
-          location: s.components?.palette?.location || Zt.TopLeft,
+          location: s.components?.palette?.location || Kt.TopLeft,
           direction: s.components?.palette?.direction || g.Bottom,
           width: s.components?.palette?.width || "12rem",
           height: s.components?.palette?.height,
@@ -8071,21 +8133,21 @@ const Ce = ({
         }
       ),
       s.components?.propertyEditor !== void 0 && s.components?.propertyEditor?.enabled !== !1 && /* @__PURE__ */ v(
-        Ti,
+        zi,
         {
-          location: s.components?.propertyEditor?.location || Zt.TopRight,
+          location: s.components?.propertyEditor?.location || Kt.TopRight,
           direction: s.components?.propertyEditor?.direction || g.Bottom,
           width: s.components?.propertyEditor?.width || "24rem",
           height: s.components?.propertyEditor?.height,
           title: h,
-          valueSet: y,
+          valueSet: b,
           onValueChange: tt
         }
       ),
-      s.components?.errors !== void 0 && s.components?.errors?.enabled !== !1 && /* @__PURE__ */ v($i, {})
+      s.components?.errors !== void 0 && s.components?.errors?.enabled !== !1 && /* @__PURE__ */ v(xi, {})
     ] })
   ] }) }) }) });
 };
 export {
-  Hi as DagaDiagram
+  Fi as DagaDiagram
 };