@metadev/daga-react 4.2.11 → 4.2.13

package/index.mjs

@@ -1,7 +1,7 @@
-import { jsx as v, jsxs as M, Fragment as ro } from "react/jsx-runtime";
+import { jsx as v, jsxs as M, Fragment as ao } from "react/jsx-runtime";
 import * as x from "d3";
-import { debounceTime as ao, Subject as jt, merge as lo, map as co } from "rxjs";
-import { createContext as Oe, useState as U, useContext as Ut, useRef as rt, useEffect as Ct, useMemo as ho } from "react";
+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) => {
   const n = (() => {
@@ -14,7 +14,6 @@ const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e
         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;
       }
-      case "floating":
       default:
         return Ie(s[0], t, a);
     }
@@ -28,13 +27,12 @@ const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e
         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;
       }
-      case "floating":
       default:
         return Ie(s[1], e, l);
     }
   })();
   return [n, o];
-}, He = (s, t) => ((s[0] - t[0]) ** 2 + (s[1] - t[1]) ** 2) ** 0.5, go = (s, t) => (ut(
+}, _e = (s, t) => ((s[0] - t[0]) ** 2 + (s[1] - t[1]) ** 2) ** 0.5, fo = (s, t) => (ut(
   s[0][0],
   t[0][0],
   t[1][0]
@@ -69,8 +67,8 @@ const At = (s) => [Math.round(s[0]), Math.round(s[1])], ut = (s, t, e) => t < e
 ));
 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 _e = /* @__PURE__ */ ((s) => (s.Straight = "straight", s.Bezier = "bezier", s.Square = "square", s))(_e || {}), be = /* @__PURE__ */ ((s) => (s.Solid = "solid", s.Dashed = "dashed", s.GappedDashes = "gapped-dashes", s.Dotted = "dotted", s))(be || {});
-const fo = 20, uo = (s, t, e, a, l) => {
+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) => {
   if (typeof s == "function")
     return s(
       t,
@@ -83,7 +81,7 @@ const fo = 20, uo = (s, t, e, a, l) => {
   if (t.length === 1)
     return `M ${t[0][0]} ${t[0][1]}`;
   {
-    l = l || fo;
+    l = l || uo;
     let r = "", i, n;
     switch (s) {
       case "straight":
@@ -280,7 +278,6 @@ const fo = 20, uo = (s, t, e, a, l) => {
       return `${4 * t} ${t}`;
     case "gapped-dashes":
       return `${4 * t} ${4 * t}`;
-    case "solid":
     default:
       return "none";
   }
@@ -294,57 +291,57 @@ const me = (s, t, e, a, l) => {
     return s(t, e, a, l);
   switch (s) {
     case "ellipse":
-      return Ge(t, e, a, l);
+      return Fe(t, e, a, l);
     case "empty":
-      return po();
+      return mo();
     case "folder":
-      return mo(t, e, a, l);
-    case "hexagon":
       return vo(t, e, a, l);
-    case "octagon":
+    case "hexagon":
       return yo(t, e, a, l);
+    case "octagon":
+      return bo(t, e, a, l);
     case "pill":
       return Kt(t, e, a, l);
     case "rectangle":
       return Ae(t, e, a, l);
     case "rhombus":
-      return bo(t, e, a, l);
-    case "rounded-rectangle":
       return ko(t, e, a, l);
-    case "sticky-note":
+    case "rounded-rectangle":
       return wo(t, e, a, l);
+    case "sticky-note":
+      return So(t, e, a, l);
     default:
       return Ae(t, e, a, l);
   }
-}, Ge = (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`, po = () => "Z", mo = (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`, vo = (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`, yo = (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` : Ge(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`, bo = (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`, ko = (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`, wo = (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`;
+}, 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`;
 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 So = (s) => Math.max(...s.split(`
-`).map((t) => t.length)), Co = (s) => s.match(/\n/g)?.length || 0, W = [];
+const Co = (s) => Math.max(...s.split(`
+`).map((t) => t.length)), $o = (s) => s.match(/\n/g)?.length || 0, W = [];
 for (let s = 0; s < 256; ++s)
   W.push((s + 256).toString(16).slice(1));
-function $o(s, t = 0) {
+function Io(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 Io = new Uint8Array(16);
-function Ao() {
+const Ao = new Uint8Array(16);
+function xo() {
   if (!re) {
     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);
   }
-  return re(Io);
+  return re(Ao);
 }
-const xo = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), xe = { randomUUID: xo };
-function Lo(s, t, e) {
+const Lo = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), xe = { randomUUID: Lo };
+function Eo(s, t, e) {
   s = s || {};
-  const a = s.random ?? s.rng?.() ?? Ao();
+  const a = s.random ?? s.rng?.() ?? xo();
   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, $o(a);
+  return a[6] = a[6] & 15 | 64, a[8] = a[8] & 63 | 128, Io(a);
 }
 function Le(s, t, e) {
-  return xe.randomUUID && !s ? xe.randomUUID() : Lo(s);
+  return xe.randomUUID && !s ? xe.randomUUID() : Eo(s);
 }
 const Nt = (s) => {
   if (typeof s != "object")
@@ -555,7 +552,7 @@ class ft extends te {
         yield e;
   }
 }
-class Eo {
+class Mo {
   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;
   }
@@ -580,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), Fe = (s, t, e) => {
+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 a = {}, l = {};
   for (const r in e.propertySet.propertyMap)
     if (e.propertySet.propertyMap[r].type === T.Object) {
-      const i = Fe(
+      const i = Ue(
         s[r],
         t[r],
         e.getSubValueSet(r)
@@ -593,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];
-}, Mo = (s) => s != null && s.constructor === Object;
+}, To = (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();
@@ -849,7 +846,7 @@ const et = {
     lookType: "connection-look",
     color: "#000000",
     thickness: 1,
-    shape: _e.Straight,
+    shape: Ge.Straight,
     style: be.Solid,
     selected: {
       color: "#AA00AA"
@@ -864,7 +861,7 @@ const et = {
   endTypes: [],
   properties: []
 };
-class Ue {
+class De {
   constructor(t) {
     const e = {
       ...et,
@@ -1164,7 +1161,7 @@ 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 To extends ft {
+class No extends ft {
   /**
    * Instance a set of connections for the given model. This method is used internally.
    * @private
@@ -1183,7 +1180,7 @@ class To extends ft {
    */
   new(t, e, a, l) {
     let r;
-    if (t instanceof Ue)
+    if (t instanceof De)
       r = t;
     else {
       const n = this.types.get(t);
@@ -1207,7 +1204,7 @@ class To extends ft {
     e && (Y(e.start?.outgoingConnections || [], e), Y(e.end?.incomingConnections || [], e), super.remove(t), e.updateInView());
   }
 }
-const V = {
+const R = {
   editable: !0,
   fontSize: 0,
   margin: 0,
@@ -1279,7 +1276,7 @@ class ht extends It {
     return this.rootElement?.getPriority() || Pt;
   }
 }
-class No extends ft {
+class Po extends ft {
   /**
    * Instance a set of fields for the given model. This method is used internally.
    * @private
@@ -1317,7 +1314,7 @@ class No 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 ? 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]), B = (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]), F = (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]), Me = 1, Te = 1, Po = 1, zo = 1;
+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 {
   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 = [];
@@ -1325,14 +1322,14 @@ class Ro {
       const a = [];
       this.sections.push(a);
       for (const l of e)
-        a.push(new Vo(l));
+        a.push(new Oo(l));
     }
   }
 }
-class Vo {
+class Oo {
   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 || De);
+    const e = st(t.look || Be);
     this.defaultLook = e.defaultLook, this.selectedLook = e.selectedLook, this.highlightedLook = e.highlightedLook, this.selectedAndHighlightedLook = e.selectedAndHighlightedLook;
   }
 }
@@ -1416,10 +1413,10 @@ class D extends It {
     return this.node?.type?.sectionGrid?.sections?.[this.indexYInNode]?.[this.indexXInNode];
   }
   getMinWidth() {
-    return this.node?.type?.sectionGrid?.minWidths?.[this.indexXInNode] || Po;
+    return this.node?.type?.sectionGrid?.minWidths?.[this.indexXInNode] || zo;
   }
   getMinHeight() {
-    return this.node?.type?.sectionGrid?.minHeights?.[this.indexYInNode] || zo;
+    return this.node?.type?.sectionGrid?.minHeights?.[this.indexYInNode] || Vo;
   }
   getPriority() {
     return this.node?.type?.sectionGrid?.sections?.[this.indexYInNode]?.[this.indexXInNode]?.priority || Pt;
@@ -1592,7 +1589,7 @@ class D extends It {
     this.model.canvas?.autoTightenConnections !== !1 && this.getConnections().forEach((n) => n.tighten()), this.updateInView();
   }
 }
-class Oo extends ft {
+class Ho extends ft {
   /**
    * Instance a set of sections for the given model. This method is used internally.
    * @private
@@ -1637,9 +1634,9 @@ class Oo extends ft {
         );
         if (y.type?.label) {
           const m = {
-            ...V,
+            ...R,
             ...y.type?.label
-          }, p = 6 * m.fontSize + Ot(m) + Ht(m), u = m.fontSize + _t(m) + Vt(m);
+          }, p = 6 * m.fontSize + Ot(m) + Ht(m), u = m.fontSize + _t(m) + Rt(m);
           let k;
           switch (y.direction) {
             case g.Bottom:
@@ -1681,7 +1678,7 @@ class Oo extends ft {
     const c = t.type.sectionGrid?.sections?.[a]?.[e]?.label;
     if (c) {
       const h = {
-        ...V,
+        ...R,
         ...c
       };
       this.model.fields.new(
@@ -1716,7 +1713,7 @@ class Oo extends ft {
     }
   }
 }
-const De = {
+const Be = {
   lookType: "shaped-look",
   shape: Tt.Rectangle,
   fillColor: "#FFFFFF",
@@ -1743,20 +1740,20 @@ const De = {
   ports: [],
   decorators: [],
   sectionGrid: null,
-  look: De,
+  look: Be,
   isUnique: !1,
   canBeParentless: !0,
   childrenTypes: [],
   priority: Pt,
   properties: []
 };
-class Be {
+class Ye {
   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 = _o(e), this.leftPadding = Go(e), this.rightPadding = Fo(e), this.topPadding = Uo(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 = 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;
     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 || []);
   }
@@ -2315,7 +2312,7 @@ class z extends It {
     this.stretch(g.Bottom, e + a);
   }
 }
-class Ho extends ft {
+class _o extends ft {
   /**
    * Instance a set of nodes for the given model. This method is used internally.
    * @private
@@ -2333,7 +2330,7 @@ class Ho extends ft {
    */
   new(t, e, a) {
     let l;
-    if (t instanceof Be)
+    if (t instanceof Ye)
       l = t;
     else {
       const i = this.types.get(t);
@@ -2379,9 +2376,9 @@ class Ho extends ft {
         );
         if (d.type?.label) {
           const c = {
-            ...V,
+            ...R,
             ...d.type?.label
-          }, h = 6 * c.fontSize + Ot(c) + Ht(c), f = c.fontSize + _t(c) + Vt(c);
+          }, h = 6 * c.fontSize + Ot(c) + Ht(c), f = c.fontSize + _t(c) + Rt(c);
           let y;
           switch (d.direction) {
             case g.Bottom:
@@ -2422,7 +2419,7 @@ class Ho extends ft {
       }
     if (l.label) {
       const i = {
-        ...V,
+        ...R,
         ...l.label
       };
       this.model.fields.new(
@@ -2494,12 +2491,12 @@ class Ho extends ft {
     return a;
   }
 }
-const Ye = (s) => {
+const Xe = (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;
-}, _o = (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]), 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[0] : s.padding.length === 2 || s.padding.length === 3 ? s.padding[1] : s.padding[3], 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]), 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.length === 2 || s.padding.length === 3, s.padding[0]), Xe = {
+}, 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 = {
   lookType: "shaped-look",
   shape: Tt.Ellipse,
   fillColor: "transparent",
@@ -2511,18 +2508,18 @@ const Ye = (s) => {
   highlighted: {
     fillColor: "rgba(0, 255, 255, 0.5)"
   }
-}, Wt = st(Xe), je = {
+}, Wt = st(je), We = {
   name: "",
   label: null,
   allowsOutgoing: !0,
   allowsIncoming: !0,
   width: 24,
-  look: Xe
+  look: je
 };
-class Do {
+class Bo {
   constructor(t) {
     const e = {
-      ...je,
+      ...We,
       ...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;
@@ -2630,7 +2627,7 @@ class bt extends It {
    * @private
    */
   get width() {
-    return this.type?.width || je.width;
+    return this.type?.width || We.width;
   }
   /**
    * Current height of this port. Same as the width.
@@ -2703,10 +2700,10 @@ class bt extends It {
     ]), this.updateInView();
   }
   distanceTo(t) {
-    return He(this.coords, t);
+    return _e(this.coords, t);
   }
 }
-class Bo extends ft {
+class Yo extends ft {
   /**
    * Instance a set of ports for the given model. This method is used internally.
    * @private
@@ -2743,7 +2740,7 @@ class Bo extends ft {
     }
   }
 }
-class We {
+class Ze {
   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 || [])
@@ -2775,7 +2772,7 @@ class We {
           }
         if (a.label) {
           const i = {
-            ...V,
+            ...R,
             ...a.label
           }, n = new ht(
             t,
@@ -2818,7 +2815,7 @@ class We {
         );
         if (l.sections?.push(n), t.sections.add(n), i.label && a.sectionGrid?.sections?.[i.indexYInNode]?.[i.indexXInNode]?.label) {
           const d = {
-            ...V,
+            ...R,
             ...a.sectionGrid?.sections?.[i.indexYInNode]?.[i.indexXInNode]?.label
           }, c = new ht(
             t,
@@ -2857,7 +2854,7 @@ class We {
           if (n.ports.push(h), t.ports.add(h), d.label) {
             if (a.ports.length > o && c?.label) {
               const f = {
-                ...V,
+                ...R,
                 ...c?.label
               };
               let y;
@@ -2927,7 +2924,7 @@ class We {
         if (l.ports.push(o), t.ports.add(o), i.label) {
           if (a.ports.length > r && n?.label) {
             const d = {
-              ...V,
+              ...R,
               ...n?.label
             };
             let c;
@@ -3314,7 +3311,7 @@ class se {
     this.canvas = t, this.nodes = e, this.connections = a;
   }
   do() {
-    const t = new We();
+    const t = new Ze();
     this.canvas.userSelection.clear();
     for (const e of this.nodes) {
       const a = t.importNode(this.canvas.model, e);
@@ -3343,7 +3340,7 @@ class se {
     );
   }
 }
-class Yo {
+class Xo {
   constructor(t) {
     this.isInRoom = !1, this.canvas = t, this.replicaId = Le();
   }
@@ -3446,7 +3443,7 @@ class Yo {
     }
   }
 }
-class Xo {
+class jo {
   constructor(t, e) {
     this.canvas = t, this.maximum = e, this.history = [], this.index = 0;
   }
@@ -3499,7 +3496,7 @@ class Xo {
   }
 }
 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 jo {
+class Wo {
   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();
   }
@@ -3657,7 +3654,7 @@ class X {
     return t !== void 0;
   }
 }
-class Wo {
+class Zo {
   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;
   }
@@ -3786,7 +3783,7 @@ class Ne {
     return t !== void 0;
   }
 }
-class Zo {
+class Ko {
   constructor(t, e, a, l) {
     this.canvas = t, this.id = e, this.from = a, this.to = l;
   }
@@ -3826,7 +3823,7 @@ class Zo {
     return !e.rootElement.removed;
   }
 }
-class Ko {
+class qo {
   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;
   }
@@ -3868,7 +3865,7 @@ class Ko {
     return this.do();
   }
 }
-class qo {
+class Jo {
   constructor(t, e, a, l) {
     this.canvas = t, this.nodes = e, this.connections = a, this.coords = l;
   }
@@ -3967,8 +3964,8 @@ class Dt {
     this.defaultPrevented = !0;
   }
 }
-var Ze = /* @__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))(Ze || {});
-class Jo extends Dt {
+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 {
   /**
    * Create a diagram zoom event.
    *
@@ -4038,7 +4035,7 @@ class Q extends Dt {
     ), this.target = t;
   }
 }
-class Ke extends It {
+class qe extends It {
   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`);
@@ -4067,7 +4064,7 @@ class Ke extends It {
     return this.priority;
   }
 }
-class Qo extends ft {
+class ti extends ft {
   /**
    * Instance a set of decorators for the given model. This method is used internally.
    * @private
@@ -4087,7 +4084,7 @@ class Qo extends ft {
    * @returns The instanced decorator.
    */
   new(t, e, a, l, r, i, n, o = "floating", d = "floating") {
-    const c = new Ke(
+    const c = new qe(
       this.model,
       t,
       e,
@@ -4106,7 +4103,7 @@ class Qo extends ft {
     e && ((e.rootElement instanceof z || e.rootElement instanceof D) && Y(e.rootElement.decorators, e), super.remove(t), e.updateInView());
   }
 }
-class ti extends It {
+class ei extends It {
   constructor(t, e, a, l, r, i, n) {
     if (t.objects.get(n) !== void 0)
       throw new Error(`DiagramObject with id "${n}" already exists`);
@@ -4135,7 +4132,7 @@ class ti extends It {
     return this.priority;
   }
 }
-class ei extends ft {
+class oi extends ft {
   /**
    * Instance a set of objects for the given model. This method is used internally.
    * @private
@@ -4155,7 +4152,7 @@ class ei extends ft {
    * @returns The instanced object.
    */
   new(t, e, a, l, r, i) {
-    const n = new ti(
+    const n = new ei(
       this.model,
       t,
       e,
@@ -4171,9 +4168,9 @@ class ei extends ft {
     e && (super.remove(t), e.updateInView());
   }
 }
-class qe {
+class Je {
   constructor(t, e, a, l, r, i = []) {
-    this.nodes = new Ho(this), this.sections = new Oo(this), this.ports = new Bo(this), this.connections = new To(this), this.fields = new No(this), this.objects = new ei(this), this.decorators = new Qo(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 _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);
   }
   /**
    * Deletes everything in this diagram.
@@ -4183,7 +4180,7 @@ class qe {
     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) => uo(
+const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => po(
   s,
   [t, e],
   a,
@@ -4265,13 +4262,13 @@ const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => uo(
     "href",
     (t) => t.look.backgroundImageBottomRight
   );
-}, Rt = {
+}, Vt = {
   style: "dots",
   color: "rgba(0, 0, 0, 0.1)",
   snap: !1,
   spacing: 10,
   thickness: 0.05
-}, oi = (s, t, e) => {
+}, ii = (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");
@@ -4291,10 +4288,10 @@ const vt = (s) => !!s.button, de = (s, t, e, a, l, r, i, n) => uo(
     }
     t.select("rect").attr("fill", `url(#${e})`);
   }
-}, ve = 96, j = 32, xt = ve + j, ii = Math.PI / 4, si = 100, Pe = {
+}, ve = 96, j = 32, xt = ve + j, si = Math.PI / 4, ni = 100, Pe = {
   customButtons: []
 };
-class ni {
+class ri {
   /**
    * Constructs a context menu object.
    * @public
@@ -4352,7 +4349,7 @@ class ni {
       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) * ii, c = l.append("xhtml:div").attr(
+      const n = r[i], o = n.onPress, d = (i + 0.5 - r.length / 2) * si, 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) => {
@@ -4360,7 +4357,7 @@ class ni {
       }).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(si).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(ni).tween("progress", () => (h) => {
         const f = d * h;
         return c.style(
           "left",
@@ -4380,7 +4377,7 @@ class ni {
     this.contextMenuContainer?.remove(), this.contextMenuContainer = void 0;
   }
 }
-class ri extends ft {
+class ai extends ft {
   /**
    * Constructs a user highlight object.
    * @public
@@ -4402,7 +4399,7 @@ class ri extends ft {
    * @param element
    */
   focusOn(t) {
-    this.clear(), this.focus = t, (t instanceof ht || t instanceof Ke) && t.rootElement ? this.focusOn(t.rootElement) : this.add(t);
+    this.clear(), this.focus = t, (t instanceof ht || t instanceof qe) && t.rootElement ? this.focusOn(t.rootElement) : this.add(t);
   }
   add(t) {
     if (super.add(t), t instanceof z) {
@@ -4434,13 +4431,13 @@ class ri extends ft {
     this.focus = void 0;
   }
 }
-const ai = 1;
-class Je {
+const li = 1;
+class Qe {
   export(t, e = !1) {
     const a = {
       name: t.name,
       type: t.type,
-      typeVersion: ai,
+      typeVersion: li,
       createdAt: t.createdAt,
       updatedAt: t.updatedAt,
       nodes: [],
@@ -4578,17 +4575,17 @@ class Je {
     } : {};
   }
 }
-const li = "Diagram properties";
-class di extends ft {
+const di = "Diagram properties";
+class ci extends ft {
   /**
    * Constructs a user selection object.
    * @public
    * @param canvas A canvas.
    */
   constructor(t, e) {
-    super(), this.canvas = t, this.canvas.propertyEditorChanges$.pipe(ao(2e3)).subscribe(() => {
+    super(), this.canvas = t, this.canvas.propertyEditorChanges$.pipe(lo(2e3)).subscribe(() => {
       this.makeUpdateValuesAction();
-    }), console.log(e), this.diagramPropertiesText = e !== void 0 ? e : li;
+    }), this.diagramPropertiesText = e !== void 0 ? e : di;
   }
   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))
@@ -4637,7 +4634,7 @@ class di extends ft {
       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 Ko(
+      const i = new qo(
         this.canvas,
         t,
         e,
@@ -4653,7 +4650,7 @@ class di extends ft {
    * @public
    */
   copyToClipboard() {
-    const t = { type: "daga-user-selection", nodes: [], connections: [] }, e = new Je();
+    const t = { type: "daga-user-selection", nodes: [], connections: [] }, e = new Qe();
     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)
@@ -4677,7 +4674,7 @@ class di extends ft {
         const a = JSON.parse(e);
         if (a.type !== "daga-user-selection")
           return;
-        const l = new qo(
+        const l = new Jo(
           this.canvas,
           a.nodes,
           a.connections,
@@ -4708,17 +4705,17 @@ class di extends ft {
   makeUpdateValuesAction() {
     if (this.propertyEditorSelection === void 0 || this.propertyEditorValues === void 0)
       return;
-    const t = this.propertyEditorSelection instanceof qe ? void 0 : this.propertyEditorSelection.id;
+    const t = this.propertyEditorSelection instanceof Je ? 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] = Fe(
+    const e = this.propertyEditorValues, a = Nt(this.propertyEditorSelection?.valueSet.getValues()), [l, r] = Ue(
       e,
       a,
       this.propertyEditorSelection?.valueSet
-    ), i = new Zo(
+    ), i = new Ko(
       this.canvas,
       t,
       l,
@@ -4727,10 +4724,10 @@ class di extends ft {
     i.do(), this.canvas.actionStack.add(i), this.propertyEditorValues = a;
   }
 }
-const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
-  const a = ci(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 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);
   return [i, n];
-}, hi = 12, H = 6, gi = 25, ge = "diagram-connection-unfinished", Qt = class Qt {
+}, 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 {
   /**
    * Constructs a canvas object.
    * @public
@@ -4738,24 +4735,24 @@ const ci = (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 qe(
+    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(
       this,
       void 0,
       e.name || "unnamed",
       "",
       e.type || "",
       e.properties || []
-    ), this.userSelection = new di(
+    ), this.userSelection = new ci(
       this,
       e.components?.propertyEditor?.title
-    ), this.userHighlight = new ri(
+    ), this.userHighlight = new ai(
       this,
       e.canvas?.highlightSections !== !1
-    ), this.contextMenu = new ni(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 Xo(this, gi), this.collabEngine = new Yo(this), e.nodeTypes)
+    ), 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)
       for (const a of e.nodeTypes) {
-        const l = new Be({
+        const l = new Ye({
           ...e.nodeTypeDefaults,
           ...a
         });
@@ -4763,7 +4760,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     if (e.portTypes)
       for (const a of e.portTypes) {
-        const l = new Do({
+        const l = new Bo({
           ...e.portTypeDefaults,
           ...a
         });
@@ -4771,7 +4768,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     if (e.connectionTypes) {
       for (const a of e.connectionTypes) {
-        const l = new Ue({
+        const l = new De({
           ...e.connectionTypeDefaults,
           ...a
         });
@@ -4872,8 +4869,8 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         this.selectCanvasElements().attr("transform", r), x.select(`#${this.backgroundPatternId}`).attr(
           "patternTransform",
           r
-        ), this.contextMenu.close(), this.diagramEvent$.next(
-          new Jo(
+        ), Ve && this.updateFieldsInView(), this.contextMenu.close(), this.diagramEvent$.next(
+          new Qo(
             [this.zoomTransform.x, this.zoomTransform.y],
             this.zoomTransform.k
           )
@@ -4904,7 +4901,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }).on(I.End, (l) => {
         this.finishMultipleSelection(l);
       })
-    ), oi(this, a, this.backgroundPatternId), a.append("g").attr("class", "daga-canvas-elements");
+    ), ii(this, a, this.backgroundPatternId), a.append("g").attr("class", "daga-canvas-elements");
   }
   getZoomLevel() {
     return this.zoomTransform.k;
@@ -5592,7 +5589,7 @@ const ci = (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) + hi}px`
+      (n) => `${(n.look.thickness || et.look.thickness) + fi}px`
     ).attr(
       "stroke-dasharray",
       (n) => pe(
@@ -5615,7 +5612,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     const a = e.exit(), l = e.enter().append("foreignObject").attr("id", (i) => i.id).attr("class", "diagram-field");
     t && t.length > 0 && (e = e.filter((i) => t.includes(i.id)));
     const r = l.merge(e);
-    a.remove(), l.style("box-sizing", "border-box").on($.MouseOver, (i, n) => {
+    if (a.remove(), l.style("box-sizing", "border-box").on($.MouseOver, (i, n) => {
       this.dragging || (this.userHighlight.focusOn(n), this.diagramEvent$.next(new Q(n)));
     }).on($.Click, (i, n) => {
       if (!i.ctrlKey && !i.shiftKey) {
@@ -5652,7 +5649,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
         n.width,
         n.height,
         n.fontSize,
-        n.fontFamily || V.fontFamily,
+        n.fontFamily || R.fontFamily,
         n.orientation,
         (d) => {
         },
@@ -5707,18 +5704,25 @@ const ci = (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) {
+      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",
+        (n) => `${n.coords[0] * i + this.zoomTransform.x}px`
+      ).style(
+        "top",
+        (n) => `${n.coords[1] * i + this.zoomTransform.y}px`
+      ).select("p").style("font-size", (n) => `${n.fontSize * i}px`);
+    }
   }
   updateObjectsInView(...t) {
-    let e = this.selectCanvasElements().selectAll(
-      "foreignObject.diagram-object"
-    ).data(
+    let e = this.selectCanvasElements().selectAll("g.diagram-object").data(
       this.model.objects.filter(
         (i) => this.priorityThreshold !== void 0 ? i.getPriority() >= this.priorityThreshold : !0
       ),
       (i) => i.id
     );
-    const a = e.exit(), l = e.enter().append("foreignObject").attr("id", (i) => i.id).attr("class", "diagram-object");
+    const a = e.exit(), l = e.enter().append("g").attr("id", (i) => i.id).attr("class", "diagram-object");
     t && t.length > 0 && (e = e.filter((i) => t.includes(i.id))), l.merge(e).attr("width", (i) => `${i.width}px`).attr("height", (i) => `${i.height}px`).attr("transform", (i) => `translate(${i.coords[0]},${i.coords[1]})`).html((i) => i.html), a.remove(), l.on($.ContextMenu, (i, n) => {
       if (this.dragging) {
         i.preventDefault(), i.stopPropagation(), this.dragging = !1;
@@ -5740,15 +5744,13 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     );
   }
   updateDecoratorsInView(...t) {
-    let e = this.selectCanvasElements().selectAll(
-      "foreignObject.diagram-decorator"
-    ).data(
+    let e = this.selectCanvasElements().selectAll("g.diagram-decorator").data(
       this.model.decorators.filter(
         (i) => this.priorityThreshold !== void 0 ? i.getPriority() >= this.priorityThreshold : !0
       ),
       (i) => i.id
     );
-    const a = e.exit(), l = e.enter().append("foreignObject").attr("id", (i) => i.id).attr("class", "diagram-decorator");
+    const a = e.exit(), l = e.enter().append("g").attr("id", (i) => i.id).attr("class", "diagram-decorator");
     t && t.length > 0 && (e = e.filter((i) => t.includes(i.id))), l.merge(e).attr("width", (i) => `${i.width}px`).attr("height", (i) => `${i.height}px`).attr("transform", (i) => `translate(${i.coords[0]},${i.coords[1]})`).html((i) => i.html), a.remove(), l.on($.MouseOver, (i, n) => {
       this.dragging || (this.userHighlight.focusOn(n), this.diagramEvent$.next(new Q(n)));
     }).on($.Click, (i, n) => {
@@ -5815,7 +5817,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
     const e = this.selectCanvasView().select(
       `[id='${ue(t.id)}']`
     ), l = e.select("path").node(), r = {
-      ...V,
+      ...R,
       ...t.type.label
     };
     if (l) {
@@ -5863,7 +5865,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       ).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) + Vt(r) : 0;
+        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;
         switch (t.startDirection) {
           case g.Left:
@@ -5915,7 +5917,7 @@ const ci = (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) + Vt(r) : 0, b = l.getPointAtLength(i / 2);
+        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);
         e.select("g.diagram-connection-middle-label path").attr(
           "d",
           Kt(
@@ -5935,7 +5937,7 @@ const ci = (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) + Vt(r) : 0;
+        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;
         switch (t.endDirection) {
           case g.Left:
@@ -6184,7 +6186,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
       }
     }).on($.Input, () => {
       const p = h.property("value");
-      h.attr("cols", So(p) + 1), h.attr("rows", Co(p) + 1), h.style("width", ""), h.style("height", ""), f = h.property("scrollWidth") + 1, y = h.property("scrollHeight") + 1;
+      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);
     }).on($.Click, (p) => {
@@ -6276,11 +6278,11 @@ const ci = (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 = Ye(
+        ), i = Xe(
           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 Wo(
+          const o = n?.getLastAncestor(), d = this.currentAction.from, c = new Zo(
             this,
             e.id,
             e.parent?.id,
@@ -6326,7 +6328,7 @@ const ci = (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)
-      go(
+      fo(
         [
           a.coords,
           [a.coords[0] + a.width, a.coords[1] + a.height]
@@ -6340,7 +6342,7 @@ const ci = (s) => s * Math.PI / 180, ze = (s, t, e) => {
 };
 Qt.canvasCount = 0;
 let ye = Qt;
-class Qe {
+class to {
   constructor() {
     this.grid = [[void 0]], this.offsetX = 0, this.offsetY = 0;
   }
@@ -6452,16 +6454,16 @@ class Qe {
     }
   }
 }
-class fi {
+class pi {
   constructor(t) {
     this.gapSize = t;
   }
   apply(t) {
     if (t.nodes.length === 0)
       return t;
-    const e = new Qe(), a = t.nodes.filter((n) => !n.parent);
+    const e = new to(), a = t.nodes.filter((n) => !n.parent);
     for (; a.length > 0; )
-      to(
+      eo(
         a[0],
         e,
         [0, 0],
@@ -6479,25 +6481,25 @@ class fi {
     return t;
   }
 }
-const to = (s, t, e, a) => {
+const eo = (s, t, e, a) => {
   const l = t.getClosestEmptyCoordinate(e);
   t.set(l, s), Y(a, s);
   for (const r of s.getAdjacentNodes())
-    a.includes(r) && to(
+    a.includes(r) && eo(
       r,
       t,
       l,
       a
     );
 };
-class ui {
+class mi {
   constructor(t) {
     this.gapSize = t;
   }
   apply(t) {
     if (t.nodes.length === 0)
       return t;
-    const e = new Qe(), a = t.nodes.filter((c) => !c.parent), l = {}, r = a[0];
+    const e = new to(), 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 = [];
@@ -6565,7 +6567,7 @@ class ne {
     return t;
   }
 }
-class pi {
+class vi {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6592,7 +6594,7 @@ class pi {
           ], u = [
             m.coords[0] + m.width / 2,
             m.coords[1] + m.height / 2
-          ], k = He(
+          ], k = _e(
             f.coords,
             m.coords
           ), b = [m.coords[0], m.coords[1]];
@@ -6618,7 +6620,7 @@ class pi {
     return t;
   }
 }
-class mi {
+class yi {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6633,7 +6635,7 @@ class mi {
     return t;
   }
 }
-class vi {
+class bi {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6700,7 +6702,7 @@ class vi {
     return t;
   }
 }
-class yi {
+class ki {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6719,11 +6721,11 @@ class yi {
       const c = r[0];
       r.splice(0, 1);
       const h = new Se(void 0, c);
-      eo(h, r), i.push(h);
+      oo(h, r), i.push(h);
     }
     const n = [];
     for (const c of i)
-      n.push([c]), oo(c, n, n.length);
+      n.push([c]), io(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) {
@@ -6742,21 +6744,21 @@ class yi {
     return t;
   }
 }
-const eo = (s, t) => {
+const oo = (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);
-      eo(l, t);
+      oo(l, t);
     }
   }
-}, oo = (s, t, e) => {
+}, io = (s, t, e) => {
   if (s.branches.length > 0) {
     for (; e >= t.length; )
       t.push([]);
     for (const a of s.branches)
-      t[e].push(a), oo(a, t, e + 1);
+      t[e].push(a), io(a, t, e + 1);
   }
 };
 class Se {
@@ -6778,7 +6780,7 @@ class Se {
     }
   }
 }
-class bi {
+class wi {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6794,16 +6796,16 @@ class bi {
   }
 }
 const Re = {
-  adjacency: new fi(),
+  adjacency: new pi(),
   breadth: new ne(),
-  "breadth-adjacency": new ui(),
-  force: new pi(),
-  horizontal: new mi(),
-  priority: new vi(),
-  tree: new yi(),
-  vertical: new bi()
-}, ki = Oe({}), $t = Oe({});
-class wi {
+  "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 {
   constructor(t, e) {
     this.onTitleChange = t, this.onValueSetChange = e;
   }
@@ -6867,10 +6869,10 @@ const Ce = ({
       children: /* @__PURE__ */ v("div", { className: f() })
     }
   ) });
-}, Si = () => {
+}, $i = () => {
   const s = Ut($t), t = rt(null), [e, a] = U([]);
-  lo(s.validatorChange$, s.diagramChange$).pipe(
-    co(() => l())
+  co(s.validatorChange$, s.diagramChange$).pipe(
+    ho(() => l())
   ).subscribe();
   const l = () => {
     a([]);
@@ -6924,7 +6926,7 @@ const Ce = ({
       n
     )) }) })
   ] }) });
-}, Ci = 200, Ve = (s) => (s || "").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""), io = ({
+}, Ii = 200, Oe = (s) => (s || "").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""), so = ({
   disabled: s,
   options: t,
   value: e,
@@ -6952,7 +6954,7 @@ const Ce = ({
           n === void 0 ? (P(t.length - 1), E(t.length - 1)) : (P(n - 1), E(n)), A.preventDefault();
           break;
         case Z.Escape:
-          R(), A.preventDefault();
+          V(), A.preventDefault();
           break;
         case Z.Enter:
           O(t[n || 0]), A.preventDefault();
@@ -6962,10 +6964,10 @@ const Ce = ({
       }
   }, N = () => {
     if (!s) {
-      const A = Ve(r.trim());
+      const A = Oe(r.trim());
       d([]), h([]), y([]), p([]);
       for (const _ of t) {
-        const q = Ve(_.label).indexOf(A);
+        const q = Oe(_.label).indexOf(A);
         if (q >= 0) {
           const Bt = _.label.substring(0, q), J = _.label.substring(
             q,
@@ -6987,7 +6989,7 @@ const Ce = ({
       }
       k(!0);
     }
-  }, R = () => {
+  }, V = () => {
     k(!1);
   }, P = (A) => {
     if (!s) {
@@ -6997,8 +6999,8 @@ const Ce = ({
     }
   }, tt = () => {
     setTimeout(() => {
-      R();
-    }, Ci);
+      V();
+    }, Ii);
   }, E = (A) => {
     const _ = l.current?.querySelectorAll("li")[A];
     _ && _.scrollIntoView({ block: "center" });
@@ -7047,7 +7049,7 @@ const Ce = ({
       ]
     }
   );
-}, $i = (s, t) => s.find((e) => e.key === t)?.label || `${t}`, Ii = ({
+}, Ai = (s, t) => s.find((e) => e.key === t)?.label || `${t}`, xi = ({
   disabled: s,
   allowRepeats: t,
   options: e,
@@ -7056,7 +7058,7 @@ const Ce = ({
 }) => {
   const [r, i] = U(), [n, o] = U([]), [d, c] = U([]);
   Ct(() => {
-    const u = a.length === 0, k = a.map((b) => $i(e, b));
+    const u = a.length === 0, k = a.map((b) => Ai(e, b));
     o(k), u && l(a), p();
   }, [a, e]);
   const h = (u) => {
@@ -7092,7 +7094,7 @@ const Ce = ({
     ] }, k)),
     !s && /* @__PURE__ */ M("div", { className: "daga-value-item-input", children: [
       /* @__PURE__ */ v("div", { className: "daga-input daga-relatively-positioned", children: /* @__PURE__ */ v(
-        io,
+        so,
         {
           disabled: s,
           options: t ? e || [] : d || [],
@@ -7103,7 +7105,7 @@ const Ce = ({
       /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: y, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, Ai = ({
+}, Li = ({
   disabled: s,
   allowRepeats: t,
   value: e,
@@ -7129,7 +7131,7 @@ const Ce = ({
   }, h = (f) => {
     f.key === "Enter" && d();
   };
-  return /* @__PURE__ */ M(ro, { children: [
+  return /* @__PURE__ */ M(ao, { children: [
     e.map((f, y) => /* @__PURE__ */ M("div", { className: "daga-value-item-element", children: [
       /* @__PURE__ */ v(
         "input",
@@ -7166,7 +7168,7 @@ const Ce = ({
       /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: d, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, xi = ({
+}, Ei = ({
   disabled: s,
   value: t,
   onChange: e
@@ -7180,26 +7182,26 @@ const Ce = ({
     const N = b === "blur" ? k.trim() : k;
     if (b === "blur") {
       if (u !== N) {
-        const R = {};
+        const V = {};
         Object.keys(t).forEach((P) => {
-          P === u ? R[N] = t[P] : R[P] = t[P];
-        }), e(R), o((P) => {
+          P === u ? V[N] = t[P] : V[P] = t[P];
+        }), e(V), o((P) => {
           const tt = { ...P };
           return delete tt[u], tt;
         });
       }
     } else
-      o((R) => ({
-        ...R,
+      o((V) => ({
+        ...V,
         [u]: k
       }));
   }, h = (u, k, b) => {
     const N = b === "blur" ? k.trim() : k;
     if (N !== "") {
-      const R = {};
+      const V = {};
       Object.keys(t).forEach((P) => {
-        P === u ? R[P] = N : R[P] = t[P];
-      }), e(R);
+        P === u ? V[P] = N : V[P] = t[P];
+      }), e(V);
     }
   }, f = () => {
     const u = a.trim(), k = r.trim();
@@ -7281,7 +7283,7 @@ const Ce = ({
       /* @__PURE__ */ v("button", { className: "daga-property-button", onClick: f, children: /* @__PURE__ */ v("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, so = ({
+}, no = ({
   valueSet: s,
   onValueChange: t,
   depth: e
@@ -7421,7 +7423,7 @@ const Ce = ({
           )
         ] }),
         o.type === T.Option && /* @__PURE__ */ v("div", { className: "daga-relatively-positioned", children: /* @__PURE__ */ v(
-          io,
+          so,
           {
             disabled: o.editable === !1 || !l,
             options: o.options || [],
@@ -7430,7 +7432,7 @@ const Ce = ({
           }
         ) }),
         (o.type === T.OptionList || o.type === T.OptionSet) && /* @__PURE__ */ v(
-          Ii,
+          xi,
           {
             disabled: o.editable === !1 || !l,
             allowRepeats: o.type === T.OptionList,
@@ -7440,7 +7442,7 @@ const Ce = ({
           }
         ),
         (o.type === T.TextList || o.type === T.TextSet) && /* @__PURE__ */ v(
-          Ai,
+          Li,
           {
             disabled: o.editable === !1 || !l,
             allowRepeats: o.type === T.TextList,
@@ -7449,7 +7451,7 @@ const Ce = ({
           }
         ),
         o.type === T.TextMap && /* @__PURE__ */ v(
-          xi,
+          Ei,
           {
             disabled: o.editable === !1 || !l,
             value: s?.getValue(o.name),
@@ -7457,7 +7459,7 @@ const Ce = ({
           }
         ),
         o.type === T.Object && /* @__PURE__ */ v("div", { className: "daga-left-bar", children: /* @__PURE__ */ v(
-          so,
+          no,
           {
             valueSet: s.getSubValueSet(o.name),
             onValueChange: t,
@@ -7468,7 +7470,7 @@ const Ce = ({
     },
     o.name
   )) });
-}, no = ({ valueSet: s, depth: t }) => {
+}, ro = ({ valueSet: s, depth: t }) => {
   const e = Ut($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;
@@ -7531,7 +7533,7 @@ const Ce = ({
     if (s === void 0)
       return;
     let d;
-    o instanceof Eo ? d = o : o instanceof Event ? d = s?.propertySet.getProperty(
+    o instanceof Mo ? d = o : o instanceof Event ? d = s?.propertySet.getProperty(
       o.target?.value || ""
     ) : d = s?.propertySet.getProperty(o || ""), d && s?.hideProperty(d), r();
   };
@@ -7561,9 +7563,9 @@ const Ce = ({
                     )
                   ] })
                 ] }),
-                o.type !== T.Object && /* @__PURE__ */ v("div", { className: "daga-property-value", children: Li(s?.getValue(o.name)) }),
+                o.type !== T.Object && /* @__PURE__ */ v("div", { className: "daga-property-value", children: Mi(s?.getValue(o.name)) }),
                 o.type === T.Object && /* @__PURE__ */ v(
-                  no,
+                  ro,
                   {
                     valueSet: s?.getSubValueSet(o.name),
                     depth: t + 1
@@ -7583,7 +7585,7 @@ const Ce = ({
       o.name
     ))
   ] });
-}, Li = (s) => Array.isArray(s) ? s.join(", ") : Mo(s) ? Object.entries(s).map((t) => t.map((e) => JSON.stringify(e)).join(": ")).join(", ") : s instanceof Date ? s.toLocaleString() : s == null ? "" : "" + s, Ei = ({ location: s, direction: t, width: e, height: a, title: l, valueSet: r, onValueChange: i }) => {
+}, 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);
   return Ct(() => {
     if (n.current)
@@ -7635,19 +7637,19 @@ const Ce = ({
             )
           ] }),
           !c && /* @__PURE__ */ v(
-            so,
+            no,
             {
               valueSet: r,
               onValueChange: i,
               depth: 0
             }
           ),
-          c && /* @__PURE__ */ v(no, { valueSet: r, depth: 0 })
+          c && /* @__PURE__ */ v(ro, { valueSet: r, depth: 0 })
         ] }) })
       ]
     }
   ) });
-}, Mi = 6, Ti = (s) => {
+}, Ni = 6, Pi = (s) => {
   const t = Ut($t), [e, a] = U(
     s.currentPalette || s.palettes[0]
   ), [l, r] = U(0), [i, n] = U(
@@ -7682,7 +7684,7 @@ const Ce = ({
   }, y = (p, u, k) => {
     if (l !== void 0 && p.priority < l)
       return;
-    const b = p.defaultLook.lookType === "shaped-look" ? p.defaultLook.borderThickness || 1 : 0, N = p.defaultHeight + b, R = p.defaultWidth + b, P = u.height || N, tt = u.width || R, E = c().append("div").attr(
+    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(
       "class",
       `daga-template-container ${k !== void 0 ? k : ""}`
     ).style("width", `${tt}px`).style("height", `${P}px`).call(
@@ -7734,12 +7736,12 @@ const Ce = ({
             lt[1]
           ).filter(
             (Xt) => Xt.type.childrenTypes.includes(p.id)
-          ), wt = Ye(
+          ), wt = Xe(
             J
           ), nt = wt[wt.length - 1];
           if (!p.canBeParentless && nt === void 0)
             return;
-          const Yt = nt?.getLastAncestor(), $e = new jo(
+          const Yt = nt?.getLastAncestor(), $e = new Wo(
             t,
             p,
             q,
@@ -7753,7 +7755,7 @@ const Ce = ({
           $e.do(), t?.actionStack.add($e), S();
         }
       })
-    ).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;
+    ).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;
     switch (C.lookType) {
       case "shaped-look":
         E.append("path").attr(
@@ -7800,7 +7802,7 @@ const Ce = ({
           ).html(O.html);
       if (u.label) {
         const O = {
-          ...V,
+          ...R,
           ...p.label,
           ...u.labelLook
         };
@@ -7828,7 +7830,7 @@ const Ce = ({
       )
     ).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(
       "transform",
-      `translate(${u.width / 2},${u.height / 2 + Mi})`
+      `translate(${u.width / 2},${u.height / 2 + Ni})`
     ).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(() => {
@@ -7876,7 +7878,7 @@ const Ce = ({
       ]
     }
   ) });
-}, Ni = ({
+}, zi = ({
   location: s,
   direction: t,
   enableAction: e,
@@ -7923,7 +7925,7 @@ const Ce = ({
         }, 500);
   }, b = Ut($t), N = () => {
     b.zoomBy(b.zoomFactor);
-  }, R = () => {
+  }, V = () => {
     b.zoomBy(1 / b.zoomFactor);
   }, P = () => {
     b.center();
@@ -7954,7 +7956,7 @@ const Ce = ({
       p.current
     ).classed("daga-on", !0).classed("daga-off", !1);
     const J = b.diagramEvent$.subscribe((wt) => {
-      wt.type === Ze.Selection && (x.select(
+      wt.type === Ke.Selection && (x.select(
         p.current
       ).classed("daga-on", !1).classed("daga-off", !0), J.unsubscribe());
     });
@@ -7965,7 +7967,7 @@ const Ce = ({
       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: R, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Zoom out" }) }),
+        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" }) }),
           e && /* @__PURE__ */ v("button", { className: "daga-undo", onClick: C, children: /* @__PURE__ */ v("span", { className: "daga-tooltip", children: "Undo" }) }),
@@ -7982,14 +7984,14 @@ const Ce = ({
       ]
     }
   ) });
-}, Vi = ({
+}, Hi = ({
   config: s,
   model: t,
   onCanvasCreated: e,
   onDiagramEvent: a,
   onModelChange: l
 }) => {
-  const r = new We(), i = new Je(), 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 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 = {
     zoomIn: () => {
     },
     zoomOut: () => {
@@ -8007,31 +8009,31 @@ const Ce = ({
   }, u = {
     refreshPalette: () => {
     }
-  }, k = new wi(
+  }, k = new Ci(
     (E) => f(E),
     (E) => m(E)
   ), b = {
     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), R = N(), P = (E) => {
-    R.initView(E), c.push(
-      R.diagramEvent$.subscribe((C) => {
+  }, 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) => {
         a?.(C);
       })
     ), c.push(
-      R.diagramChange$.subscribe(() => {
-        const C = i.export(R.model);
+      V.diagramChange$.subscribe(() => {
+        const C = i.export(V.model);
         l?.(C);
       })
     );
   };
   Ct(() => {
-    n.current && (d.current || (P(n.current), d.current = !0, e?.(R)));
-  }, [n.current]), ho(() => {
-    n.current && (N(!0), P(n.current), e?.(R));
+    n.current && (d.current || (P(n.current), d.current = !0, e?.(V)));
+  }, [n.current]), go(() => {
+    n.current && (N(!0), P(n.current), e?.(V));
   }, [s]), Ct(() => {
-    t && r.import(R.model, t);
+    t && r.import(V.model, t);
   }, [t]);
   const tt = (E, C, O) => {
     if (y !== void 0 && C.editable !== !1 && !St(E.getValue(C.name), O)) {
@@ -8040,14 +8042,14 @@ const Ce = ({
         y.propertySet,
         void 0
       );
-      A.setValues(y.getValues()), A.rootElement = y.rootElement, k.valueSet = A, y.rootElement.valueSet = A, R.propertyEditorChanges$?.next();
+      A.setValues(y.getValues()), A.rootElement = y.rootElement, k.valueSet = A, y.rootElement.valueSet = A, V.propertyEditorChanges$?.next();
     }
   };
-  return /* @__PURE__ */ v("daga-diagram", { children: /* @__PURE__ */ v(ki.Provider, { value: s, children: /* @__PURE__ */ v($t.Provider, { value: R, children: /* @__PURE__ */ M("daga-diagram-editor", { children: [
+  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: [
     /* @__PURE__ */ v("div", { className: "daga-append-to", ref: n }),
-    /* @__PURE__ */ M($t.Provider, { value: R, children: [
+    /* @__PURE__ */ M($t.Provider, { value: V, children: [
       s.components?.buttons !== void 0 && s.components?.buttons?.enabled !== !1 && /* @__PURE__ */ v(
-        Ni,
+        zi,
         {
           location: s.components?.buttons?.location || Zt.BottomRight,
           direction: s.components?.buttons?.direction || g.Top,
@@ -8059,7 +8061,7 @@ 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(
-        Ti,
+        Pi,
         {
           location: s.components?.palette?.location || Zt.TopLeft,
           direction: s.components?.palette?.direction || g.Bottom,
@@ -8069,7 +8071,7 @@ const Ce = ({
         }
       ),
       s.components?.propertyEditor !== void 0 && s.components?.propertyEditor?.enabled !== !1 && /* @__PURE__ */ v(
-        Ei,
+        Ti,
         {
           location: s.components?.propertyEditor?.location || Zt.TopRight,
           direction: s.components?.propertyEditor?.direction || g.Bottom,
@@ -8080,10 +8082,10 @@ const Ce = ({
           onValueChange: tt
         }
       ),
-      s.components?.errors !== void 0 && s.components?.errors?.enabled !== !1 && /* @__PURE__ */ v(Si, {})
+      s.components?.errors !== void 0 && s.components?.errors?.enabled !== !1 && /* @__PURE__ */ v($i, {})
     ] })
   ] }) }) }) });
 };
 export {
-  Vi as DagaDiagram
+  Hi as DagaDiagram
 };