@metadev/daga-react 4.2.4 → 4.2.5

package/index.mjs

@@ -1,9 +1,9 @@
-import { jsx as k, jsxs as V, Fragment as Hi } from "react/jsx-runtime";
+import { jsx as k, jsxs as V, Fragment as Yi } from "react/jsx-runtime";
 import * as N from "d3";
-import { debounceTime as Gi, Subject as Zt, merge as Bi, map as Ui } from "rxjs";
-import { createContext as yi, useState as U, useContext as Wt, useRef as dt, useEffect as Tt, useMemo as Yi } from "react";
+import { debounceTime as Xi, Subject as Zt, merge as ji, map as Wi } from "rxjs";
+import { createContext as Ci, useState as U, useContext as Wt, useRef as dt, useEffect as Tt, useMemo as Zi } from "react";
 var b = /* @__PURE__ */ ((i) => (i.Bottom = "bottom", i.Left = "left", i.Right = "right", i.Top = "top", i))(b || {}), qt = /* @__PURE__ */ ((i) => (i.BottomLeft = "bottom-left", i.BottomRight = "bottom-right", i.TopLeft = "top-left", i.TopRight = "top-right", i))(qt || {}), zt = /* @__PURE__ */ ((i) => (i.Left = "left", i.Center = "center", i.Right = "right", i))(zt || {}), Qt = /* @__PURE__ */ ((i) => (i.Top = "top", i.Center = "center", i.Bottom = "bottom", i))(Qt || {});
-const Nt = (i) => [Math.round(i[0]), Math.round(i[1])], kt = (i, t, e) => t < e ? t <= i && i <= e : e <= i && i <= t, ri = (i, t, e) => (i - t[0]) / (t[1] - t[0]) * (e[1] - e[0]) + e[0], te = (i, t, e, o, a, l, s) => {
+const Nt = (i) => [Math.round(i[0]), Math.round(i[1])], kt = (i, t, e) => t < e ? t <= i && i <= e : e <= i && i <= t, di = (i, t, e) => (i - t[0]) / (t[1] - t[0]) * (e[1] - e[0]) + e[0], te = (i, t, e, o, a, l, s) => {
   const n = (() => {
     switch (l) {
       case "start":
@@ -16,7 +16,7 @@ const Nt = (i) => [Math.round(i[0]), Math.round(i[1])], kt = (i, t, e) => t < e
       }
       case "floating":
       default:
-        return ri(i[0], t, o);
+        return di(i[0], t, o);
     }
   })(), r = (() => {
     switch (s) {
@@ -30,11 +30,11 @@ const Nt = (i) => [Math.round(i[0]), Math.round(i[1])], kt = (i, t, e) => t < e
       }
       case "floating":
       default:
-        return ri(i[1], e, a);
+        return di(i[1], e, a);
     }
   })();
   return [n, r];
-}, bi = (i, t) => ((i[0] - t[0]) ** 2 + (i[1] - t[1]) ** 2) ** 0.5, Xi = (i, t) => (kt(
+}, Si = (i, t) => ((i[0] - t[0]) ** 2 + (i[1] - t[1]) ** 2) ** 0.5, Ki = (i, t) => (kt(
   i[0][0],
   t[0][0],
   t[1][0]
@@ -69,8 +69,8 @@ const Nt = (i) => [Math.round(i[0]), Math.round(i[1])], kt = (i, t, e) => t < e
 ));
 var L = /* @__PURE__ */ ((i) => (i.Blur = "blur", i.Change = "change", i.Click = "click", i.ContextMenu = "contextmenu", i.DoubleClick = "dblclick", i.Focus = "focus", i.FocusIn = "focusin", i.FocusOut = "focusout", i.Input = "input", i.KeyDown = "keydown", i.KeyUp = "keyup", i.MouseDown = "mousedown", i.MouseEnter = "mouseenter", i.MouseLeave = "mouseleave", i.MouseMove = "mousemove", i.MouseOut = "mouseout", i.MouseOver = "mouseover", i.MouseUp = "mouseup", i.TouchStart = "touchstart", i.TouchEnd = "touchend", i.Wheel = "wheel", i))(L || {}), it = /* @__PURE__ */ ((i) => (i.Alt = "Alt", i.AltGraph = "AltGraph", i.ArrowDown = "ArrowDown", i.ArrowLeft = "ArrowLeft", i.ArrowRight = "ArrowRight", i.ArrowUp = "ArrowUp", i.Backspace = "Backspace", i.Control = "Control", i.Delete = "Delete", i.End = "End", i.Enter = "Enter", i.Escape = "Escape", i.Home = "Home", i.OS = "OS", i.PageDown = "PageDown", i.PageUp = "PageUp", i.Shift = "Shift", i.Tab = "Tab", i))(it || {}), M = /* @__PURE__ */ ((i) => (i.Drag = "drag", i.Start = "start", i.End = "end", i))(M || {}), ve = /* @__PURE__ */ ((i) => (i.Zoom = "zoom", i.Start = "start", i.End = "end", i))(ve || {});
 const ye = (i) => i.replace(/([!"#$%&'()*+,\-./:;<=>?@[\\\]^`{|}])/g, "\\$1");
-var ki = /* @__PURE__ */ ((i) => (i.Straight = "straight", i.Bezier = "bezier", i.Square = "square", i))(ki || {}), Se = /* @__PURE__ */ ((i) => (i.Solid = "solid", i.Dashed = "dashed", i.GappedDashes = "gapped-dashes", i.Dotted = "dotted", i))(Se || {});
-const ji = 20, Wi = (i, t, e, o, a) => {
+var Ii = /* @__PURE__ */ ((i) => (i.Straight = "straight", i.Bezier = "bezier", i.Square = "square", i))(Ii || {}), Se = /* @__PURE__ */ ((i) => (i.Solid = "solid", i.Dashed = "dashed", i.GappedDashes = "gapped-dashes", i.Dotted = "dotted", i))(Se || {});
+const qi = 20, Ji = (i, t, e, o, a) => {
   if (typeof i == "function")
     return i(
       t,
@@ -83,7 +83,7 @@ const ji = 20, Wi = (i, t, e, o, a) => {
   if (t.length === 1)
     return `M ${t[0][0]} ${t[0][1]}`;
   {
-    a = a || ji;
+    a = a || qi;
     let l = "", s, n;
     switch (i) {
       case "straight":
@@ -251,60 +251,60 @@ const ke = (i, t, e, o, a) => {
     return i(t, e, o, a);
   switch (i) {
     case "ellipse":
-      return wi(t, e, o, a);
+      return Ai(t, e, o, a);
     case "empty":
-      return Zi();
+      return Qi();
     case "folder":
-      return Ki(t, e, o, a);
+      return to(t, e, o, a);
     case "hexagon":
-      return qi(t, e, o, a);
+      return eo(t, e, o, a);
     case "octagon":
-      return Ji(t, e, o, a);
+      return io(t, e, o, a);
     case "pill":
       return Jt(t, e, o, a);
     case "rectangle":
-      return ai(t, e, o, a);
+      return hi(t, e, o, a);
     case "rhombus":
-      return Qi(t, e, o, a);
+      return oo(t, e, o, a);
     case "rounded-rectangle":
-      return to(t, e, o, a);
+      return so(t, e, o, a);
     case "sticky-note":
-      return eo(t, e, o, a);
+      return no(t, e, o, a);
     default:
-      return ai(t, e, o, a);
+      return hi(t, e, o, a);
   }
-}, wi = (i, t, e, o) => `M ${i + e / 2} ${t} A ${e / 2} ${o / 2} 0 0 0 ${i + e / 2} ${t + o} A ${e / 2} ${o / 2} 0 1 0 ${i + e / 2} ${t} Z`, Zi = () => "Z", Ki = (i, t, e, o) => `M ${i} ${t} L ${i + e / 3} ${t} L ${i + e / 2} ${t + o / 6} L ${i + e} ${t + o / 6} L ${i + e} ${t + o} L ${i} ${t + o} Z`, qi = (i, t, e, o) => `M ${i + e / 4} ${t} L ${i + 3 * e / 4} ${t} L ${i + e} ${t + o / 2} L ${i + 3 * e / 4} ${t + o} L ${i + e / 4} ${t + o} L ${i} ${t + o / 2} Z`, Ji = (i, t, e, o) => `M ${i + e / 4} ${t} L ${i + 3 * e / 4} ${t} L ${i + e} ${t + o / 4} L ${i + e} ${t + 3 * o / 4} L ${i + 3 * e / 4} ${t + o} L ${i + e / 4} ${t + o} L ${i} ${t + 3 * o / 4} L ${i} ${t + o / 4} L ${i + e / 4} ${t} Z`, Jt = (i, t, e, o) => o < e ? `M ${i + o / 2} ${t} L ${i + e - o / 2} ${t} A ${o / 2} ${o / 2} 0 0 1 ${i + e} ${t + o / 2} A ${o / 2} ${o / 2} 0 0 1 ${i + e - o / 2} ${t + o} L ${i + o / 2} ${t + o} A ${o / 2} ${o / 2} 0 0 1 ${i} ${t + o / 2} A ${o / 2} ${o / 2} 0 0 1 ${i + o / 2} ${t} Z` : o > e ? `M ${i} ${t + e / 2} L ${i} ${t + o - e / 2} A ${e / 2} ${e / 2} 0 0 0 ${i + e / 2} ${t + o} A ${e / 2} ${e / 2} 0 0 0 ${i + e} ${t + o - e / 2} L ${i + e} ${t + e / 2} A ${e / 2} ${e / 2} 0 0 0 ${i + e / 2} ${t} A ${e / 2} ${e / 2} 0 0 0 ${i} ${t + e / 2} Z` : wi(i, t, e, o), ai = (i, t, e, o) => `M ${i} ${t} L ${i + e} ${t} L ${i + e} ${t + o} L ${i} ${t + o} Z`, Qi = (i, t, e, o) => `M ${i + e / 2} ${t} L ${i + e} ${t + o / 2} L ${i + e / 2} ${t + o} L ${i} ${t + o / 2} Z`, to = (i, t, e, o) => `M ${i + e / 4} ${t} L ${i + 3 * e / 4} ${t} A ${e / 4} ${o / 4} 0 0 1 ${i + e} ${t + o / 4} L ${i + e} ${t + 3 * o / 4} A ${e / 4} ${o / 4} 0 0 1 ${i + 3 * e / 4} ${t + o} L ${i + e / 4} ${t + o} A ${e / 4} ${o / 4} 0 0 1 ${i} ${t + 3 * o / 4} L ${i} ${t + o / 4} A ${e / 4} ${o / 4} 0 0 1 ${i + e / 4} ${t} Z`, eo = (i, t, e, o) => `M ${i} ${t} L ${i + 3 * e / 4} ${t} L ${i + 3 * e / 4} ${t + o / 4} L ${i + 3 * e / 4} ${t} L ${i + e} ${t + o / 4} L ${i + 3 * e / 4} ${t + o / 4} L ${i + e} ${t + o / 4} L ${i + e} ${t + o} L ${i} ${t + o} Z`;
+}, Ai = (i, t, e, o) => `M ${i + e / 2} ${t} A ${e / 2} ${o / 2} 0 0 0 ${i + e / 2} ${t + o} A ${e / 2} ${o / 2} 0 1 0 ${i + e / 2} ${t} Z`, Qi = () => "Z", to = (i, t, e, o) => `M ${i} ${t} L ${i + e / 3} ${t} L ${i + e / 2} ${t + o / 6} L ${i + e} ${t + o / 6} L ${i + e} ${t + o} L ${i} ${t + o} Z`, eo = (i, t, e, o) => `M ${i + e / 4} ${t} L ${i + 3 * e / 4} ${t} L ${i + e} ${t + o / 2} L ${i + 3 * e / 4} ${t + o} L ${i + e / 4} ${t + o} L ${i} ${t + o / 2} Z`, io = (i, t, e, o) => `M ${i + e / 4} ${t} L ${i + 3 * e / 4} ${t} L ${i + e} ${t + o / 4} L ${i + e} ${t + 3 * o / 4} L ${i + 3 * e / 4} ${t + o} L ${i + e / 4} ${t + o} L ${i} ${t + 3 * o / 4} L ${i} ${t + o / 4} L ${i + e / 4} ${t} Z`, Jt = (i, t, e, o) => o < e ? `M ${i + o / 2} ${t} L ${i + e - o / 2} ${t} A ${o / 2} ${o / 2} 0 0 1 ${i + e} ${t + o / 2} A ${o / 2} ${o / 2} 0 0 1 ${i + e - o / 2} ${t + o} L ${i + o / 2} ${t + o} A ${o / 2} ${o / 2} 0 0 1 ${i} ${t + o / 2} A ${o / 2} ${o / 2} 0 0 1 ${i + o / 2} ${t} Z` : o > e ? `M ${i} ${t + e / 2} L ${i} ${t + o - e / 2} A ${e / 2} ${e / 2} 0 0 0 ${i + e / 2} ${t + o} A ${e / 2} ${e / 2} 0 0 0 ${i + e} ${t + o - e / 2} L ${i + e} ${t + e / 2} A ${e / 2} ${e / 2} 0 0 0 ${i + e / 2} ${t} A ${e / 2} ${e / 2} 0 0 0 ${i} ${t + e / 2} Z` : Ai(i, t, e, o), hi = (i, t, e, o) => `M ${i} ${t} L ${i + e} ${t} L ${i + e} ${t + o} L ${i} ${t + o} Z`, oo = (i, t, e, o) => `M ${i + e / 2} ${t} L ${i + e} ${t + o / 2} L ${i + e / 2} ${t + o} L ${i} ${t + o / 2} Z`, so = (i, t, e, o) => `M ${i + e / 4} ${t} L ${i + 3 * e / 4} ${t} A ${e / 4} ${o / 4} 0 0 1 ${i + e} ${t + o / 4} L ${i + e} ${t + 3 * o / 4} A ${e / 4} ${o / 4} 0 0 1 ${i + 3 * e / 4} ${t + o} L ${i + e / 4} ${t + o} A ${e / 4} ${o / 4} 0 0 1 ${i} ${t + 3 * o / 4} L ${i} ${t + o / 4} A ${e / 4} ${o / 4} 0 0 1 ${i + e / 4} ${t} Z`, no = (i, t, e, o) => `M ${i} ${t} L ${i + 3 * e / 4} ${t} L ${i + 3 * e / 4} ${t + o / 4} L ${i + 3 * e / 4} ${t} L ${i + e} ${t + o / 4} L ${i + 3 * e / 4} ${t + o / 4} L ${i + e} ${t + o / 4} L ${i + e} ${t + o} L ${i} ${t + o} Z`;
 var P = /* @__PURE__ */ ((i) => (i.AllScroll = "all-scroll", i.Auto = "auto", i.Crosshair = "crosshair", i.EWResize = "ew-resize", i.Grab = "grab", i.Grabbing = "grabbing", i.Move = "move", i.NoDrop = "no-drop", i.NSResize = "ns-resize", i.NotAllowed = "not-allowed", i.ZoomIn = "zoom-in", i.ZoomOut = "zoom-out", i))(P || {});
-const io = (i) => Math.max(...i.split(`
-`).map((t) => t.length)), oo = (i) => {
+const ro = (i) => Math.max(...i.split(`
+`).map((t) => t.length)), ao = (i) => {
   var t;
   return ((t = i.match(/\n/g)) == null ? void 0 : t.length) || 0;
 }, et = [];
 for (let i = 0; i < 256; ++i)
   et.push((i + 256).toString(16).slice(1));
-function so(i, t = 0) {
+function lo(i, t = 0) {
   return (et[i[t + 0]] + et[i[t + 1]] + et[i[t + 2]] + et[i[t + 3]] + "-" + et[i[t + 4]] + et[i[t + 5]] + "-" + et[i[t + 6]] + et[i[t + 7]] + "-" + et[i[t + 8]] + et[i[t + 9]] + "-" + et[i[t + 10]] + et[i[t + 11]] + et[i[t + 12]] + et[i[t + 13]] + et[i[t + 14]] + et[i[t + 15]]).toLowerCase();
 }
 let de;
-const no = new Uint8Array(16);
-function ro() {
+const co = new Uint8Array(16);
+function ho() {
   if (!de) {
     if (typeof crypto > "u" || !crypto.getRandomValues)
       throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
     de = crypto.getRandomValues.bind(crypto);
   }
-  return de(no);
+  return de(co);
 }
-const ao = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), li = { randomUUID: ao };
-function ci(i, t, e) {
+const go = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), gi = { randomUUID: go };
+function ui(i, t, e) {
   var a;
-  if (li.randomUUID && !i)
-    return li.randomUUID();
+  if (gi.randomUUID && !i)
+    return gi.randomUUID();
   i = i || {};
-  const o = i.random ?? ((a = i.rng) == null ? void 0 : a.call(i)) ?? ro();
+  const o = i.random ?? ((a = i.rng) == null ? void 0 : a.call(i)) ?? ho();
   if (o.length < 16)
     throw new Error("Random bytes length must be >= 16");
-  return o[6] = o[6] & 15 | 64, o[8] = o[8] & 63 | 128, so(o);
+  return o[6] = o[6] & 15 | 64, o[8] = o[8] & 63 | 128, lo(o);
 }
 const at = (i) => {
   const { selected: t, highlighted: e, ...o } = i, a = o, l = {
@@ -510,7 +510,7 @@ class bt extends ie {
         yield e;
   }
 }
-class lo {
+class uo {
   constructor(t, e, o, a, l, s, n) {
     this.name = t, this.label = e, this.type = o, this.defaultValue = a, this.basic = l, this.editable = s, this.rootAttribute = n, this.options = void 0, this.properties = void 0;
   }
@@ -535,11 +535,11 @@ class oe {
 function xt(i, t) {
   return !t || i[0] > t[0] ? !0 : i[0] === t[0] ? i[1] >= t[1] : !1;
 }
-const di = (i) => i == null || i === "" || i instanceof Array && i.length === 0 || i instanceof Object && Object.keys(i).length === 0, Et = (i, t) => i === t || JSON.stringify(i) === JSON.stringify(t), Ci = (i, t, e) => {
+const mi = (i) => i == null || i === "" || i instanceof Array && i.length === 0 || i instanceof Object && Object.keys(i).length === 0, Et = (i, t) => i === t || JSON.stringify(i) === JSON.stringify(t), xi = (i, t, e) => {
   const o = {}, a = {};
   for (const l in e.propertySet.propertyMap)
     if (e.propertySet.propertyMap[l].type === _.Object) {
-      const s = Ci(
+      const s = xi(
         i[l],
         t[l],
         e.getSubValueSet(l)
@@ -548,7 +548,7 @@ const di = (i) => i == null || i === "" || i instanceof Array && i.length === 0
     } else
       Et(i[l], t[l]) || (o[l] = i[l], a[l] = t[l]);
   return [o, a];
-}, co = (i) => i != null && i.constructor === Object;
+}, mo = (i) => i != null && i.constructor === Object;
 class It {
   constructor(t, e) {
     this.displayedProperties = [], this.hiddenProperties = [], this.values = {}, this.valueSets = {}, this.ownTimestamps = {}, this.propertySet = t, this.rootElement = e, this.resetValues();
@@ -657,7 +657,7 @@ class It {
    */
   hasValue(t) {
     const e = this.getValue(t);
-    return !di(e);
+    return !mi(e);
   }
   /**
    * Checks if the value under the key is not empty or the default value.
@@ -667,7 +667,7 @@ class It {
    */
   hasSetValue(t) {
     const e = this.getValue(t), o = this.propertySet.getProperty(t);
-    return o && o.type === _.Object ? this.getSubValueSet(t).hasAnySetValue() : !di(e) && !Et(e, o == null ? void 0 : o.defaultValue);
+    return o && o.type === _.Object ? this.getSubValueSet(t).hasAnySetValue() : !mi(e) && !Et(e, o == null ? void 0 : o.defaultValue);
   }
   /**
    * Checks if any of the values in the set are not empty or the default value.
@@ -801,7 +801,7 @@ const st = {
     lookType: "connection-look",
     color: "#000000",
     thickness: 1,
-    shape: ki.Straight,
+    shape: Ii.Straight,
     style: Se.Solid,
     selected: {
       color: "#AA00AA"
@@ -816,7 +816,7 @@ const st = {
   endTypes: [],
   properties: []
 };
-class Si {
+class Li {
   constructor(t) {
     const e = {
       ...st,
@@ -1060,7 +1060,7 @@ class ut extends Mt {
     return this.start ? this.end ? Math.min(this.start.getPriority(), this.end.getPriority()) : this.start.getPriority() : this.end ? this.end.getPriority() : Ot;
   }
 }
-class ho extends bt {
+class fo extends bt {
   /**
    * Instance a set of connections for the given model. This method is used internally.
    * @private
@@ -1079,7 +1079,7 @@ class ho extends bt {
    */
   new(t, e, o, a) {
     let l;
-    if (t instanceof Si)
+    if (t instanceof Li)
       l = t;
     else {
       const n = this.types.get(t);
@@ -1180,7 +1180,7 @@ class vt extends Mt {
     return ((t = this.rootElement) == null ? void 0 : t.getPriority()) || Ot;
   }
 }
-class go extends bt {
+class po extends bt {
   /**
    * Instance a set of fields for the given model. This method is used internally.
    * @private
@@ -1219,22 +1219,22 @@ class go extends bt {
     e && (((o = e.rootElement) == null ? void 0 : o.label) !== void 0 && e.rootElement.label === e && (e.rootElement.label = void 0), super.remove(t), e.updateInView());
   }
 }
-const nt = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : i.margin.length === 1 || i.margin.length === 2 ? i.margin[0] : (i.margin.length === 3, i.margin[2]), tt = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : i.margin.length === 1 ? i.margin[0] : i.margin.length === 2 || i.margin.length === 3 ? i.margin[1] : i.margin[3], ct = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : i.margin.length === 1 ? i.margin[0] : (i.margin.length === 2 || i.margin.length === 3, i.margin[1]), Z = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : (i.margin.length === 1 || i.margin.length === 2 || i.margin.length === 3, i.margin[0]), Gt = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : i.padding.length === 1 || i.padding.length === 2 ? i.padding[0] : (i.padding.length === 3, i.padding[2]), Bt = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : i.padding.length === 1 ? i.padding[0] : i.padding.length === 2 || i.padding.length === 3 ? i.padding[1] : i.padding[3], Ut = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : i.padding.length === 1 ? i.padding[0] : (i.padding.length === 2 || i.padding.length === 3, i.padding[1]), Yt = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : (i.padding.length === 1 || i.padding.length === 2 || i.padding.length === 3, i.padding[0]), hi = 1, gi = 1, uo = 1, mo = 1;
-class fo {
+const nt = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : i.margin.length === 1 || i.margin.length === 2 ? i.margin[0] : (i.margin.length === 3, i.margin[2]), tt = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : i.margin.length === 1 ? i.margin[0] : i.margin.length === 2 || i.margin.length === 3 ? i.margin[1] : i.margin[3], ct = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : i.margin.length === 1 ? i.margin[0] : (i.margin.length === 2 || i.margin.length === 3, i.margin[1]), Z = (i) => (i == null ? void 0 : i.margin) === null || (i == null ? void 0 : i.margin) === void 0 ? F.margin : typeof i.margin == "number" ? i.margin : i.margin.length === 0 ? F.margin : (i.margin.length === 1 || i.margin.length === 2 || i.margin.length === 3, i.margin[0]), Gt = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : i.padding.length === 1 || i.padding.length === 2 ? i.padding[0] : (i.padding.length === 3, i.padding[2]), Bt = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : i.padding.length === 1 ? i.padding[0] : i.padding.length === 2 || i.padding.length === 3 ? i.padding[1] : i.padding[3], Ut = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : i.padding.length === 1 ? i.padding[0] : (i.padding.length === 2 || i.padding.length === 3, i.padding[1]), Yt = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? F.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? F.padding : (i.padding.length === 1 || i.padding.length === 2 || i.padding.length === 3, i.padding[0]), fi = 1, pi = 1, vo = 1, yo = 1;
+class bo {
   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 o = [];
       this.sections.push(o);
       for (const a of e)
-        o.push(new po(a));
+        o.push(new ko(a));
     }
   }
 }
-class po {
+class ko {
   constructor(t) {
     this.label = t.label || null, this.ports = t.ports || [], this.priority = t.priority || Ot, this.resizableX = t.resizableX, this.resizableY = t.resizableY;
-    const e = at(t.look || Ii);
+    const e = at(t.look || Ei);
     this.defaultLook = e.defaultLook, this.selectedLook = e.selectedLook, this.highlightedLook = e.highlightedLook, this.selectedAndHighlightedLook = e.selectedAndHighlightedLook;
   }
 }
@@ -1310,11 +1310,11 @@ class X extends Mt {
   }
   getMinWidth() {
     var t, e, o, a;
-    return ((a = (o = (e = (t = this.node) == null ? void 0 : t.type) == null ? void 0 : e.sectionGrid) == null ? void 0 : o.minWidths) == null ? void 0 : a[this.indexXInNode]) || uo;
+    return ((a = (o = (e = (t = this.node) == null ? void 0 : t.type) == null ? void 0 : e.sectionGrid) == null ? void 0 : o.minWidths) == null ? void 0 : a[this.indexXInNode]) || vo;
   }
   getMinHeight() {
     var t, e, o, a;
-    return ((a = (o = (e = (t = this.node) == null ? void 0 : t.type) == null ? void 0 : e.sectionGrid) == null ? void 0 : o.minHeights) == null ? void 0 : a[this.indexYInNode]) || mo;
+    return ((a = (o = (e = (t = this.node) == null ? void 0 : t.type) == null ? void 0 : e.sectionGrid) == null ? void 0 : o.minHeights) == null ? void 0 : a[this.indexYInNode]) || yo;
   }
   getPriority() {
     var t, e, o, a, l, s;
@@ -1491,7 +1491,7 @@ class X extends Mt {
     ((n = this.model.canvas) == null ? void 0 : n.autoTightenConnections) !== !1 && this.getConnections().forEach((r) => r.tighten()), this.updateInView();
   }
 }
-class vo extends bt {
+class wo extends bt {
   /**
    * Instance a set of sections for the given model. This method is used internally.
    * @private
@@ -1616,7 +1616,7 @@ class vo extends bt {
     }
   }
 }
-const Ii = {
+const Ei = {
   lookType: "shaped-look",
   shape: _t.Rectangle,
   fillColor: "#FFFFFF",
@@ -1642,20 +1642,20 @@ const Ii = {
   ports: [],
   decorators: [],
   sectionGrid: null,
-  look: Ii,
+  look: Ei,
   isUnique: !1,
   canBeParentless: !0,
   childrenTypes: [],
   priority: Ot,
   properties: []
 };
-class Ai {
+class Ti {
   constructor(t) {
     const e = {
       ...yt,
       ...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.bottomPadding = bo(e), this.leftPadding = ko(e), this.rightPadding = wo(e), this.topPadding = Co(e), this.label = e.label, this.ports = e.ports, this.decorators = e.decorators, this.sectionGrid = e.sectionGrid ? new fo(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.bottomPadding = So(e), this.leftPadding = Io(e), this.rightPadding = Ao(e), this.topPadding = xo(e), this.label = e.label, this.ports = e.ports, this.decorators = e.decorators, this.sectionGrid = e.sectionGrid ? new bo(e.sectionGrid) : null;
     const o = at(e.look);
     this.defaultLook = o.defaultLook, this.selectedLook = o.selectedLook, this.highlightedLook = o.highlightedLook, this.selectedAndHighlightedLook = o.selectedAndHighlightedLook, this.isUnique = e.isUnique, this.canBeParentless = e.canBeParentless, this.childrenTypes = e.childrenTypes, this.priority = e.priority, this.propertySet = new oe((t == null ? void 0 : t.properties) || []);
   }
@@ -2210,7 +2210,7 @@ class O extends Mt {
     this.stretch(b.Bottom, e + o);
   }
 }
-class yo extends bt {
+class Co extends bt {
   /**
    * Instance a set of nodes for the given model. This method is used internally.
    * @private
@@ -2229,7 +2229,7 @@ class yo extends bt {
   new(t, e, o) {
     var s, n, r, c, d, h, u;
     let a;
-    if (t instanceof Ai)
+    if (t instanceof Ti)
       a = t;
     else {
       const p = this.types.get(t);
@@ -2248,11 +2248,11 @@ class yo extends bt {
             g,
             f,
             [m, p],
-            ((s = a.sectionGrid.defaultWidths) == null ? void 0 : s[g]) || hi,
-            ((n = a.sectionGrid.defaultHeights) == null ? void 0 : n[f]) || gi,
+            ((s = a.sectionGrid.defaultWidths) == null ? void 0 : s[g]) || fi,
+            ((n = a.sectionGrid.defaultHeights) == null ? void 0 : n[f]) || pi,
             `${l.id}_${f}_${g}`
-          ), m += (((r = a.sectionGrid.defaultWidths) == null ? void 0 : r[g]) || hi) + (a.sectionGrid.margin || 0);
-        p += (((c = a.sectionGrid.defaultHeights) == null ? void 0 : c[f]) || gi) + (a.sectionGrid.margin || 0);
+          ), m += (((r = a.sectionGrid.defaultWidths) == null ? void 0 : r[g]) || fi) + (a.sectionGrid.margin || 0);
+        p += (((c = a.sectionGrid.defaultHeights) == null ? void 0 : c[f]) || pi) + (a.sectionGrid.margin || 0);
       }
     }
     if (a.ports.length > 0)
@@ -2390,12 +2390,12 @@ class yo extends bt {
     return o;
   }
 }
-const xi = (i) => {
+const $i = (i) => {
   for (let t = 0; t < i.length; ++t)
     for (let e = 0; e < i.length; ++e)
       e !== t && i[e].isAncestorOf(i[t]) && (i.splice(e, 1), --e, t > e && --t);
   return i;
-}, bo = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : i.padding.length === 1 || i.padding.length === 2 ? i.padding[0] : (i.padding.length === 3, i.padding[2]), ko = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : i.padding.length === 1 ? i.padding[0] : i.padding.length === 2 || i.padding.length === 3 ? i.padding[1] : i.padding[3], wo = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : i.padding.length === 1 ? i.padding[0] : (i.padding.length === 2 || i.padding.length === 3, i.padding[1]), Co = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : (i.padding.length === 1 || i.padding.length === 2 || i.padding.length === 3, i.padding[0]), Li = {
+}, So = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : i.padding.length === 1 || i.padding.length === 2 ? i.padding[0] : (i.padding.length === 3, i.padding[2]), Io = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : i.padding.length === 1 ? i.padding[0] : i.padding.length === 2 || i.padding.length === 3 ? i.padding[1] : i.padding[3], Ao = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : i.padding.length === 1 ? i.padding[0] : (i.padding.length === 2 || i.padding.length === 3, i.padding[1]), xo = (i) => (i == null ? void 0 : i.padding) === null || (i == null ? void 0 : i.padding) === void 0 ? yt.padding : typeof i.padding == "number" ? i.padding : i.padding.length === 0 ? yt.padding : (i.padding.length === 1 || i.padding.length === 2 || i.padding.length === 3, i.padding[0]), Mi = {
   lookType: "shaped-look",
   shape: _t.Ellipse,
   fillColor: "transparent",
@@ -2407,18 +2407,18 @@ const xi = (i) => {
   highlighted: {
     fillColor: "rgba(0, 255, 255, 0.5)"
   }
-}, Kt = at(Li), Ei = {
+}, Kt = at(Mi), Ni = {
   name: "",
   label: null,
   allowsOutgoing: !0,
   allowsIncoming: !0,
   width: 24,
-  look: Li
+  look: Mi
 };
-class So {
+class Lo {
   constructor(t) {
     const e = {
-      ...Ei,
+      ...Ni,
       ...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;
@@ -2519,7 +2519,7 @@ class At extends Mt {
    */
   get width() {
     var t;
-    return ((t = this.type) == null ? void 0 : t.width) || Ei.width;
+    return ((t = this.type) == null ? void 0 : t.width) || Ni.width;
   }
   /**
    * Current height of this port. Same as the width.
@@ -2595,10 +2595,10 @@ class At extends Mt {
     ]), this.updateInView();
   }
   distanceTo(t) {
-    return bi(this.coords, t);
+    return Si(this.coords, t);
   }
 }
-class Io extends bt {
+class Eo extends bt {
   /**
    * Instance a set of ports for the given model. This method is used internally.
    * @private
@@ -2635,7 +2635,7 @@ class Io extends bt {
     }
   }
 }
-class Ti {
+class Pi {
   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 o of e.nodes || [])
@@ -2743,7 +2743,7 @@ class Ti {
             A,
             v,
             y.coords,
-            y.connectionPoint,
+            y.connectionPoint || y.coords,
             y.direction,
             y.id
           );
@@ -2813,7 +2813,7 @@ class Ti {
           v,
           f,
           g.coords,
-          g.connectionPoint,
+          g.connectionPoint || g.coords,
           g.direction,
           g.id
         );
@@ -3213,7 +3213,7 @@ class re {
     this.canvas = t, this.nodes = e, this.connections = o;
   }
   do() {
-    const t = new Ti();
+    const t = new Pi();
     this.canvas.userSelection.clear();
     for (const e of this.nodes) {
       const o = t.importNode(this.canvas.model, e);
@@ -3242,9 +3242,9 @@ class re {
     );
   }
 }
-class Ao {
+class To {
   constructor(t) {
-    this.isInRoom = !1, this.canvas = t, this.replicaId = ci();
+    this.isInRoom = !1, this.canvas = t, this.replicaId = ui();
   }
   /**
    * Returns a fresh timestamp, suitable for use by new CollabActions.
@@ -3256,7 +3256,7 @@ class Ao {
    * Returns a fresh unique ID, suitable for use by new CollabActions.
    */
   freshId() {
-    return "id" + ci();
+    return "id" + ui();
   }
   /**
    * Performs the action - immediately locally, and eventually for remote collaborators.
@@ -3345,7 +3345,7 @@ class Ao {
     }
   }
 }
-class xo {
+class $o {
   constructor(t, e) {
     this.canvas = t, this.maximum = e, this.history = [], this.index = 0;
   }
@@ -3398,7 +3398,7 @@ class xo {
   }
 }
 var S = /* @__PURE__ */ ((i) => (i.AddConnection = "add-connection", i.AddNode = "add-node", i.AddSectionAction = "add-section", i.ApplyLayout = "apply-layout", i.Clipboard = "clipboard", i.ContextMenu = "context-menu", i.EditField = "edit-field", i.MoveNode = "move-node", i.Paste = "paste", i.Remove = "remove", i.StretchNode = "stretch-node", i.StretchSection = "stretch-section", i.UpdateValues = "update-values", i.Zoom = "zoom", i))(S || {});
-class Lo {
+class Mo {
   constructor(t, e, o, a, l, s, n, r, c) {
     this.canvas = t, this.type = e, this.coords = o, this.parentId = a, this.ancestorId = l, this.fromAncestorGeometry = s, this.toAncestorGeometry = n, this.label = r, this.values = c, this.id = this.canvas.collabEngine.freshId();
   }
@@ -3556,7 +3556,7 @@ class J {
     return t !== void 0;
   }
 }
-class Eo {
+class No {
   constructor(t, e, o, a, l, s, n, r, c) {
     this.canvas = t, this.childId = e, this.fromParentId = o, this.toParentId = a, this.fromChildGeometry = l, this.toChildGeometry = s, this.ancestorId = n, this.fromAncestorGeometry = r, this.toAncestorGeometry = c;
   }
@@ -3643,7 +3643,7 @@ class ge {
     return this.canvas.collabEngine.doCollaboratively(e), t === void 0;
   }
 }
-class ui {
+class vi {
   constructor(t, e, o, a) {
     this.canvas = t, this.fieldId = e, this.from = o, this.to = a;
   }
@@ -3685,7 +3685,7 @@ class ui {
     return t !== void 0;
   }
 }
-class To {
+class Po {
   constructor(t, e, o, a) {
     this.canvas = t, this.id = e, this.from = o, this.to = a;
   }
@@ -3725,7 +3725,7 @@ class To {
     return !e.rootElement.removed;
   }
 }
-class $o {
+class zo {
   constructor(t, e, o, a, l, s) {
     this.canvas = t, this.nodeIds = e, this.sectionIds = o, this.portIds = a, this.connectionIds = l, this.fieldIds = s;
   }
@@ -3767,7 +3767,7 @@ class $o {
     return this.do();
   }
 }
-class Mo {
+class Ro {
   constructor(t, e, o, a) {
     this.canvas = t, this.nodes = e, this.connections = o, this.coords = a;
   }
@@ -3793,7 +3793,10 @@ class Mo {
               d.id.includes(l.id) ? d.id = d.id.replace(l.id, n) : d.id = this.canvas.collabEngine.freshId(), o[h] = d.id, e && (d.coords = [
                 d.coords[0] + e[0],
                 d.coords[1] + e[1]
-              ]);
+              ], d.connectionPoint && (d.connectionPoint = [
+                d.connectionPoint[0] + e[0],
+                d.connectionPoint[1] + e[1]
+              ]));
             }
         }
       if (l.ports)
@@ -3802,7 +3805,10 @@ class Mo {
           r.id.includes(l.id) ? r.id = r.id.replace(l.id, n) : r.id = this.canvas.collabEngine.freshId(), o[c] = r.id, e && (r.coords = [
             r.coords[0] + e[0],
             r.coords[1] + e[1]
-          ]);
+          ], r.connectionPoint && (r.connectionPoint = [
+            r.connectionPoint[0] + e[0],
+            r.connectionPoint[1] + e[1]
+          ]));
         }
     }
     for (const l of this.connections) {
@@ -3860,7 +3866,7 @@ class ae {
     this.defaultPrevented = !0;
   }
 }
-var $i = /* @__PURE__ */ ((i) => (i[i.DoubleClick = 0] = "DoubleClick", i[i.SecondaryClick = 1] = "SecondaryClick", i[i.Selection = 2] = "Selection", i[i.Highlight = 3] = "Highlight", i))($i || {});
+var zi = /* @__PURE__ */ ((i) => (i[i.DoubleClick = 0] = "DoubleClick", i[i.SecondaryClick = 1] = "SecondaryClick", i[i.Selection = 2] = "Selection", i[i.Highlight = 3] = "Highlight", i))(zi || {});
 class wt extends ae {
   /**
    * Create a diagram double click event.
@@ -3918,7 +3924,7 @@ class ot extends ae {
     ), this.target = t;
   }
 }
-class Mi extends Mt {
+class Ri extends Mt {
   constructor(t, e, o, a, l, s, n, r, c = "floating", d = "floating") {
     if (t.objects.get(r) !== void 0)
       throw new Error(`DiagramDecorator with id "${r}" already exists`);
@@ -3949,7 +3955,7 @@ class Mi extends Mt {
     return this.priority;
   }
 }
-class No extends bt {
+class Vo extends bt {
   /**
    * Instance a set of decorators for the given model. This method is used internally.
    * @private
@@ -3969,7 +3975,7 @@ class No extends bt {
    * @returns The instanced decorator.
    */
   new(t, e, o, a, l, s, n, r = "floating", c = "floating") {
-    const d = new Mi(
+    const d = new Ri(
       this.model,
       t,
       e,
@@ -3988,7 +3994,7 @@ class No extends bt {
     e && ((e.rootElement instanceof O || e.rootElement instanceof X) && K(e.rootElement.decorators, e), super.remove(t), e.updateInView());
   }
 }
-class Po extends Mt {
+class _o extends Mt {
   constructor(t, e, o, a, l, s, n) {
     if (t.objects.get(n) !== void 0)
       throw new Error(`DiagramObject with id "${n}" already exists`);
@@ -4019,7 +4025,7 @@ class Po extends Mt {
     return this.priority;
   }
 }
-class zo extends bt {
+class Oo extends bt {
   /**
    * Instance a set of objects for the given model. This method is used internally.
    * @private
@@ -4039,7 +4045,7 @@ class zo extends bt {
    * @returns The instanced object.
    */
   new(t, e, o, a, l, s) {
-    const n = new Po(
+    const n = new _o(
       this.model,
       t,
       e,
@@ -4055,9 +4061,9 @@ class zo extends bt {
     e && (super.remove(t), e.updateInView());
   }
 }
-class Ni {
+class Vi {
   constructor(t, e, o, a, l, s = []) {
-    this.nodes = new yo(this), this.sections = new vo(this), this.ports = new Io(this), this.connections = new ho(this), this.fields = new go(this), this.objects = new zo(this), this.decorators = new No(this), this.canvas = t, this.id = e, this.name = o, this.description = a, this.type = l, this.createdAt = /* @__PURE__ */ new Date(), this.updatedAt = /* @__PURE__ */ new Date(), this.logicalClock = 0, this.valueSet = new It(new oe(s), this);
+    this.nodes = new Co(this), this.sections = new wo(this), this.ports = new Eo(this), this.connections = new fo(this), this.fields = new po(this), this.objects = new Oo(this), this.decorators = new Vo(this), this.canvas = t, this.id = e, this.name = o, this.description = a, this.type = l, this.createdAt = /* @__PURE__ */ new Date(), this.updatedAt = /* @__PURE__ */ new Date(), this.logicalClock = 0, this.valueSet = new It(new oe(s), this);
   }
   /**
    * Deletes everything in this diagram.
@@ -4068,7 +4074,7 @@ class Ni {
     (t = this.canvas) == null || t.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(), (e = this.canvas) == null || e.updateModelInView();
   }
 }
-const St = (i) => !!i.button, ue = (i, t, e, o, a, l, s, n) => Wi(
+const St = (i) => !!i.button, ue = (i, t, e, o, a, l, s, n) => Ji(
   i,
   [t, e],
   o,
@@ -4156,7 +4162,7 @@ const St = (i) => !!i.button, ue = (i, t, e, o, a, l, s, n) => Wi(
   snap: !1,
   spacing: 10,
   thickness: 0.05
-}, Ro = (i, t, e) => {
+}, Do = (i, t, e) => {
   const o = t.append("defs");
   if (i.gridSize > 0 && isFinite(i.gridSize)) {
     const a = o.append("pattern").attr("id", e).attr("x", -i.gridSize / 2).attr("y", -i.gridSize / 2).attr("width", i.gridSize).attr("height", i.gridSize).attr("patternUnits", "userSpaceOnUse");
@@ -4176,17 +4182,17 @@ const St = (i) => !!i.button, ue = (i, t, e, o, a, l, s, n) => Wi(
     }
     t.select("rect").attr("fill", `url(#${e})`);
   }
-}, we = 96, Q = 32, Pt = we + Q, Vo = Math.PI / 4, _o = 100, mi = {
+}, we = 96, Q = 32, Pt = we + Q, Fo = Math.PI / 4, Ho = 100, yi = {
   customButtons: []
 };
-class Oo {
+class Go {
   /**
    * Constructs a context menu object.
    * @public
    * @param canvas A canvas.
    */
   constructor(t, e) {
-    this.canvas = t, this.config = e || mi;
+    this.canvas = t, this.config = e || yi;
   }
   /**
    * Opens the context menu at the location determined by the given mouse event.
@@ -4229,7 +4235,7 @@ class Oo {
         s.userSelection.removeFromModel(), s.cancelAllUserActions();
       }
     });
-    for (const s of this.config.customButtons || mi.customButtons)
+    for (const s of this.config.customButtons || yi.customButtons)
       (s.condition === void 0 || s.condition(this.canvas)) && l.push(s);
     l.length === 0 && l.push({
       name: "NONE",
@@ -4237,7 +4243,7 @@ class Oo {
       onPress: void 0
     });
     for (let s = 0; s < l.length; ++s) {
-      const n = l[s], r = n.onPress, c = (s + 0.5 - l.length / 2) * Vo, d = a.append("xhtml:div").attr(
+      const n = l[s], r = n.onPress, c = (s + 0.5 - l.length / 2) * Fo, d = a.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 * Q}px`).style("height", `${2 * Q}px`).style("border-radius", `${Q}px`).style("pointer-events", "auto").on(L.Click, (h) => {
@@ -4245,7 +4251,7 @@ class Oo {
       }).on(L.KeyDown, (h) => {
         r && h.key === it.Enter && (h.preventDefault(), r(this.canvas));
       });
-      n.imageClass !== void 0 ? d.append("xhtml:div").style("position", "absolute").style("left", `${0.75 * Q}px`).style("top", `${0.5 * Q}px`).style("width", `${0.5 * Q}px`).style("height", `${0.5 * Q}px`).style("background-size", "contain").style("background-repeat", "no-repeat").attr("class", n.imageClass) : n.image !== void 0 && d.append("xhtml:img").style("position", "absolute").style("left", `${0.75 * Q}px`).style("top", `${0.5 * Q}px`).style("width", `${0.5 * Q}px`).style("height", `${0.5 * Q}px`).attr("src", n.image), d.append("xhtml:span").style("position", "absolute").style("left", `${0.2 * Q}px`).style("top", `${1.1 * Q}px`).style("text-align", "center").style("width", `${1.6 * Q}px`).style("height", `${0.35 * Q}px`).style("margin", "0").style("font-size", `${0.35 * Q}px`).style("font-weight", "700").style("user-select", "none").text(n.name), d.transition().ease(N.easeLinear).duration(_o).tween("progress", () => (h) => {
+      n.imageClass !== void 0 ? d.append("xhtml:div").style("position", "absolute").style("left", `${0.75 * Q}px`).style("top", `${0.5 * Q}px`).style("width", `${0.5 * Q}px`).style("height", `${0.5 * Q}px`).style("background-size", "contain").style("background-repeat", "no-repeat").attr("class", n.imageClass) : n.image !== void 0 && d.append("xhtml:img").style("position", "absolute").style("left", `${0.75 * Q}px`).style("top", `${0.5 * Q}px`).style("width", `${0.5 * Q}px`).style("height", `${0.5 * Q}px`).attr("src", n.image), d.append("xhtml:span").style("position", "absolute").style("left", `${0.2 * Q}px`).style("top", `${1.1 * Q}px`).style("text-align", "center").style("width", `${1.6 * Q}px`).style("height", `${0.35 * Q}px`).style("margin", "0").style("font-size", `${0.35 * Q}px`).style("font-weight", "700").style("user-select", "none").text(n.name), d.transition().ease(N.easeLinear).duration(Ho).tween("progress", () => (h) => {
         const u = c * h;
         return d.style(
           "left",
@@ -4266,7 +4272,7 @@ class Oo {
     (t = this.contextMenuContainer) == null || t.remove(), this.contextMenuContainer = void 0;
   }
 }
-class Do extends bt {
+class Bo extends bt {
   /**
    * Constructs a user highlight object.
    * @public
@@ -4288,7 +4294,7 @@ class Do extends bt {
    * @param element
    */
   focusOn(t) {
-    this.clear(), this.focus = t, (t instanceof vt || t instanceof Mi) && t.rootElement ? this.focusOn(t.rootElement) : this.add(t);
+    this.clear(), this.focus = t, (t instanceof vt || t instanceof Ri) && t.rootElement ? this.focusOn(t.rootElement) : this.add(t);
   }
   add(t) {
     if (super.add(t), t instanceof O) {
@@ -4320,13 +4326,13 @@ class Do extends bt {
     this.focus = void 0;
   }
 }
-const Fo = 1;
-class Pi {
+const Uo = 1;
+class _i {
   export(t, e = !1) {
     const o = {
       name: t.name,
       type: t.type,
-      typeVersion: Fo,
+      typeVersion: Uo,
       createdAt: t.createdAt,
       updatedAt: t.updatedAt,
       nodes: [],
@@ -4361,7 +4367,7 @@ class Pi {
           id: f.id,
           type: (s = f.type) == null ? void 0 : s.id,
           coords: Nt(f.coords),
-          connectionPoint: Nt(f.connectionPoint),
+          connectionPoint: Nt(f.connectionPoint || f.coords),
           direction: f.direction,
           label: ((n = f.label) == null ? void 0 : n.text) || "",
           ...e ? {
@@ -4398,7 +4404,7 @@ class Pi {
         id: u.id,
         type: (c = u.type) == null ? void 0 : c.id,
         coords: Nt(u.coords),
-        connectionPoint: Nt(u.connectionPoint),
+        connectionPoint: Nt(u.connectionPoint || u.coords),
         direction: u.direction,
         label: ((d = u.label) == null ? void 0 : d.text) || "",
         ...e ? {
@@ -4466,15 +4472,15 @@ class Pi {
     } : {};
   }
 }
-const Ho = "Diagram properties";
-class Go extends bt {
+const Yo = "Diagram properties";
+class Xo extends bt {
   /**
    * Constructs a user selection object.
    * @public
    * @param canvas A canvas.
    */
   constructor(t) {
-    super(), this.canvas = t, this.canvas.propertyEditorChanges$.pipe(Gi(2e3)).subscribe(() => {
+    super(), this.canvas = t, this.canvas.propertyEditorChanges$.pipe(Xi(2e3)).subscribe(() => {
       this.makeUpdateValuesAction();
     });
   }
@@ -4525,7 +4531,7 @@ class Go extends bt {
       const t = [], e = [], o = [], a = [], l = [];
       for (const n of this.all())
         n instanceof O ? t.push(n.id) : n instanceof X ? e.push(n.id) : n instanceof At ? o.push(n.id) : n instanceof ut ? a.push(n.id) : n instanceof vt && l.push(n.id);
-      const s = new $o(
+      const s = new zo(
         this.canvas,
         t,
         e,
@@ -4541,7 +4547,7 @@ class Go extends bt {
    * @public
    */
   copyToClipboard() {
-    const t = { type: "daga-user-selection", nodes: [], connections: [] }, e = new Pi();
+    const t = { type: "daga-user-selection", nodes: [], connections: [] }, e = new _i();
     for (const o of this.all())
       o instanceof O && t.nodes.push(e.exportNode(o, !1)), o instanceof ut && t.connections.push(
         e.exportConnection(o, !1)
@@ -4565,7 +4571,7 @@ class Go extends bt {
         const o = JSON.parse(e);
         if (o.type !== "daga-user-selection")
           return;
-        const a = new Mo(
+        const a = new Ro(
           this.canvas,
           o.nodes,
           o.connections,
@@ -4594,13 +4600,13 @@ class Go extends bt {
     const a = t == null ? void 0 : t.valueSet;
     a ? (this.propertyEditorSelection = t, e && (this.propertyEditorValues = structuredClone(
       a.getValues()
-    )), o && (t instanceof O || t instanceof ut ? (t instanceof O ? t.name ? o.title = `${t.type.name}: ${t.name}` : o.title = t.type.name : t instanceof ut && (o.title = t.type.name), o.valueSet = void 0, o.valueSet = a) : (o.title = Ho, o.valueSet = void 0, o.valueSet = a))) : (this.propertyEditorSelection = void 0, this.propertyEditorValues = void 0, o && (o.title = "", o.valueSet = void 0));
+    )), o && (t instanceof O || t instanceof ut ? (t instanceof O ? t.name ? o.title = `${t.type.name}: ${t.name}` : o.title = t.type.name : t instanceof ut && (o.title = t.type.name), o.valueSet = void 0, o.valueSet = a) : (o.title = Yo, o.valueSet = void 0, o.valueSet = a))) : (this.propertyEditorSelection = void 0, this.propertyEditorValues = void 0, o && (o.title = "", o.valueSet = void 0));
   }
   makeUpdateValuesAction() {
     var n, r, c;
     if (this.propertyEditorSelection === void 0 || this.propertyEditorValues === void 0)
       return;
-    const t = this.propertyEditorSelection instanceof Ni ? void 0 : this.propertyEditorSelection.id;
+    const t = this.propertyEditorSelection instanceof Vi ? void 0 : this.propertyEditorSelection.id;
     if (Et(
       this.propertyEditorValues,
       (n = this.propertyEditorSelection) == null ? void 0 : n.valueSet.getValues()
@@ -4608,11 +4614,11 @@ class Go extends bt {
       return;
     const e = this.propertyEditorValues, o = structuredClone(
       (r = this.propertyEditorSelection) == null ? void 0 : r.valueSet.getValues()
-    ), [a, l] = Ci(
+    ), [a, l] = xi(
       e,
       o,
       (c = this.propertyEditorSelection) == null ? void 0 : c.valueSet
-    ), s = new To(
+    ), s = new Po(
       this.canvas,
       t,
       a,
@@ -4621,10 +4627,10 @@ class Go extends bt {
     s.do(), this.canvas.actionStack.add(s), this.propertyEditorValues = o;
   }
 }
-const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
-  const o = Bo(e), a = Math.sin(o), l = Math.cos(o), s = (Math.abs(i * l) - Math.abs(t * a)) / (l * l - a * a), n = (Math.abs(i * a) - Math.abs(t * l)) / (a * a - l * l);
+const jo = (i) => i * Math.PI / 180, bi = (i, t, e) => {
+  const o = jo(e), a = Math.sin(o), l = Math.cos(o), s = (Math.abs(i * l) - Math.abs(t * a)) / (l * l - a * a), n = (Math.abs(i * a) - Math.abs(t * l)) / (a * a - l * l);
   return [s, n];
-}, Uo = 12, G = 6, Yo = 25, pe = "diagram-connection-unfinished", ee = class ee {
+}, Wo = 12, G = 6, Zo = 25, pe = "diagram-connection-unfinished", ee = class ee {
   /**
    * Constructs a canvas object.
    * @public
@@ -4633,21 +4639,21 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
    */
   constructor(t, e) {
     var o, a, l, s, n, r, c, d, h, u, p, f, m, g, v, w, y, A, I, E, $, C, R, T, z, j, D, q, H;
-    if (this.backgroundPatternId = `daga-background-pattern-id-${ee.canvasCount++}`, this.zoomTransform = N.zoomIdentity, this.draggingFrom = [0, 0], this.dragging = !1, this.secondaryButton = !1, this.validatorChange$ = new Zt(), this.diagramChange$ = new Zt(), this.diagramEvent$ = new Zt(), this.propertyEditorChanges$ = new Zt(), this.parentComponent = t, this.model = new Ni(
+    if (this.backgroundPatternId = `daga-background-pattern-id-${ee.canvasCount++}`, this.zoomTransform = N.zoomIdentity, this.draggingFrom = [0, 0], this.dragging = !1, this.secondaryButton = !1, this.validatorChange$ = new Zt(), this.diagramChange$ = new Zt(), this.diagramEvent$ = new Zt(), this.propertyEditorChanges$ = new Zt(), this.parentComponent = t, this.model = new Vi(
       this,
       void 0,
       e.name || "unnamed",
       "",
       e.type || "",
       e.properties || []
-    ), this.userSelection = new Go(this), this.userHighlight = new Do(
+    ), this.userSelection = new Xo(this), this.userHighlight = new Bo(
       this,
       ((o = e.canvas) == null ? void 0 : o.highlightSections) !== !1
-    ), this.contextMenu = new Oo(this, (a = e.canvas) == null ? void 0 : a.contextMenu), this.backgroundColor = ((l = e.canvas) == null ? void 0 : l.backgroundColor) || "#FFFFFF", this.gridStyle = ((n = (s = e.canvas) == null ? void 0 : s.grid) == null ? void 0 : n.style) ?? Ht.style, this.gridSize = ((c = (r = e.canvas) == null ? void 0 : r.grid) == null ? void 0 : c.enabled) === !1 || ((d = e.canvas) == null ? void 0 : d.grid) === void 0 ? 0 : Math.abs(((u = (h = e.canvas) == null ? void 0 : h.grid) == null ? void 0 : u.spacing) || Ht.spacing), this.gridThickness = Math.abs(
+    ), this.contextMenu = new Go(this, (a = e.canvas) == null ? void 0 : a.contextMenu), this.backgroundColor = ((l = e.canvas) == null ? void 0 : l.backgroundColor) || "#FFFFFF", this.gridStyle = ((n = (s = e.canvas) == null ? void 0 : s.grid) == null ? void 0 : n.style) ?? Ht.style, this.gridSize = ((c = (r = e.canvas) == null ? void 0 : r.grid) == null ? void 0 : c.enabled) === !1 || ((d = e.canvas) == null ? void 0 : d.grid) === void 0 ? 0 : Math.abs(((u = (h = e.canvas) == null ? void 0 : h.grid) == null ? void 0 : u.spacing) || Ht.spacing), this.gridThickness = Math.abs(
       ((f = (p = e.canvas) == null ? void 0 : p.grid) == null ? void 0 : f.thickness) || Ht.thickness
-    ), this.gridColor = ((g = (m = e.canvas) == null ? void 0 : m.grid) == null ? void 0 : g.color) || Ht.color, this.snapToGrid = ((w = (v = e.canvas) == null ? void 0 : v.grid) == null ? void 0 : w.enabled) === !1 || ((y = e.canvas) == null ? void 0 : y.grid) === void 0 ? !1 : ((I = (A = e.canvas) == null ? void 0 : A.grid) == null ? void 0 : I.snap) || Ht.snap, this.zoomFactor = ((E = e.canvas) == null ? void 0 : E.zoomFactor) || 2, this.panRate = (($ = e.canvas) == null ? void 0 : $.panRate) || 100, this.inferConnectionType = ((C = e.connectionSettings) == null ? void 0 : C.inferConnectionType) || !1, this.autoTightenConnections = ((R = e.connectionSettings) == null ? void 0 : R.autoTighten) !== !1, this.allowConnectionLoops = ((T = e.connectionSettings) == null ? void 0 : T.allowLoops) || !1, this.allowSharingPorts = ((z = e.connectionSettings) == null ? void 0 : z.sharePorts) !== !1, this.allowSharingBothPorts = ((j = e.connectionSettings) == null ? void 0 : j.shareBothPorts) || !1, this.portHighlightRadius = ((D = e.connectionSettings) == null ? void 0 : D.portHighlightRadius) || 100, this.multipleSelectionOn = !1, this.priorityThresholds = ((q = e.canvas) == null ? void 0 : q.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, Yo), this.collabEngine = new Ao(this), e.nodeTypes)
+    ), this.gridColor = ((g = (m = e.canvas) == null ? void 0 : m.grid) == null ? void 0 : g.color) || Ht.color, this.snapToGrid = ((w = (v = e.canvas) == null ? void 0 : v.grid) == null ? void 0 : w.enabled) === !1 || ((y = e.canvas) == null ? void 0 : y.grid) === void 0 ? !1 : ((I = (A = e.canvas) == null ? void 0 : A.grid) == null ? void 0 : I.snap) || Ht.snap, this.zoomFactor = ((E = e.canvas) == null ? void 0 : E.zoomFactor) || 2, this.panRate = (($ = e.canvas) == null ? void 0 : $.panRate) || 100, this.inferConnectionType = ((C = e.connectionSettings) == null ? void 0 : C.inferConnectionType) || !1, this.autoTightenConnections = ((R = e.connectionSettings) == null ? void 0 : R.autoTighten) !== !1, this.allowConnectionLoops = ((T = e.connectionSettings) == null ? void 0 : T.allowLoops) || !1, this.allowSharingPorts = ((z = e.connectionSettings) == null ? void 0 : z.sharePorts) !== !1, this.allowSharingBothPorts = ((j = e.connectionSettings) == null ? void 0 : j.shareBothPorts) || !1, this.portHighlightRadius = ((D = e.connectionSettings) == null ? void 0 : D.portHighlightRadius) || 100, this.multipleSelectionOn = !1, this.priorityThresholds = ((q = e.canvas) == null ? void 0 : q.priorityThresholds) || [], this.priorityThreshold = this.priorityThresholds ? this.priorityThresholds[0] : void 0, this.layoutFormat = e.layoutFormat, this.userActions = e.userActions || {}, this.validators = [], this.actionStack = new $o(this, Zo), this.collabEngine = new To(this), e.nodeTypes)
       for (const Y of e.nodeTypes) {
-        const W = new Ai({
+        const W = new Ti({
           ...e.nodeTypeDefaults,
           ...Y
         });
@@ -4655,7 +4661,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       }
     if (e.portTypes)
       for (const Y of e.portTypes) {
-        const W = new So({
+        const W = new Lo({
           ...e.portTypeDefaults,
           ...Y
         });
@@ -4663,7 +4669,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       }
     if (e.connectionTypes) {
       for (const Y of e.connectionTypes) {
-        const W = new Si({
+        const W = new Li({
           ...e.connectionTypeDefaults,
           ...Y
         });
@@ -4793,7 +4799,10 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       }).on(M.End, (a) => {
         this.finishMultipleSelection(a);
       })
-    ), Ro(this, o, this.backgroundPatternId), o.append("g").attr("class", "daga-canvas-elements");
+    ), Do(this, o, this.backgroundPatternId), o.append("g").attr("class", "daga-canvas-elements");
+  }
+  getZoomLevel() {
+    return this.zoomTransform.k;
   }
   zoomBy(t) {
     isNaN(t) || this.zoomBehavior.scaleBy(this.selectCanvasView(), t);
@@ -4801,6 +4810,9 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
   zoomTo(t) {
     isNaN(t) || this.zoomBehavior.scaleTo(this.selectCanvasView(), t);
   }
+  getViewCoordinates() {
+    return [this.zoomTransform.x, this.zoomTransform.y];
+  }
   translateBy(t, e) {
     !isNaN(t) && !isNaN(e) && this.zoomBehavior.translateBy(this.selectCanvasView(), t, e);
   }
@@ -5477,7 +5489,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       }
     ).attr("stroke", "transparent").attr("pointer-events", "stroke").attr(
       "stroke-width",
-      (n) => `${(n.look.thickness || st.look.thickness) + Uo}px`
+      (n) => `${(n.look.thickness || st.look.thickness) + Wo}px`
     ).attr(
       "stroke-dasharray",
       (n) => be(
@@ -5531,7 +5543,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       }
     }).on(L.DoubleClick, (s, n) => {
       const r = new wt(s, n);
-      this.diagramEvent$.next(r), !r.defaultPrevented && this.canUserPerformAction(S.EditField) && n.editable && !n.removed && (this.currentAction = new ui(this, n.id, n.text, ""), this.createInputField(
+      this.diagramEvent$.next(r), !r.defaultPrevented && this.canUserPerformAction(S.EditField) && n.editable && !n.removed && (this.currentAction = new vi(this, n.id, n.text, ""), this.createInputField(
         n.text,
         n.coords,
         n.width,
@@ -5542,7 +5554,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
         (c) => {
         },
         (c) => {
-          n.text = c, this.currentAction instanceof ui && (this.currentAction.to = c, this.currentAction.do(), this.actionStack.add(this.currentAction), this.currentAction = void 0);
+          n.text = c, this.currentAction instanceof vi && (this.currentAction.to = c, this.currentAction.do(), this.actionStack.add(this.currentAction), this.currentAction = void 0);
         }
       ));
     }).call(
@@ -5577,10 +5589,10 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       (s) => s.verticalAlign === Qt.Center ? "center" : s.verticalAlign === Qt.Bottom ? "end" : "start"
     ).select("p").style(
       "max-width",
-      (s) => s.fit ? "default" : `${fi(s.width, s.height, s.orientation)[0]}px`
+      (s) => s.fit ? "default" : `${bi(s.width, s.height, s.orientation)[0]}px`
     ).style(
       "max-height",
-      (s) => s.fit ? "default" : `${fi(s.width, s.height, s.orientation)[1]}px`
+      (s) => s.fit ? "default" : `${bi(s.width, s.height, s.orientation)[1]}px`
     ).style("overflow", (s) => s.fit ? "default" : "clip").style("text-overflow", (s) => s.fit ? "default" : "ellipsis").style(
       "text-align",
       (s) => s.horizontalAlign === zt.Center ? "center" : s.horizontalAlign === zt.Right ? "end" : "start"
@@ -6040,7 +6052,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
       }
     }).on(L.Input, () => {
       const m = h.property("value");
-      h.attr("cols", io(m) + 1), h.attr("rows", oo(m) + 1), h.style("width", ""), h.style("height", ""), u = h.property("scrollWidth") + 1, p = h.property("scrollHeight") + 1;
+      h.attr("cols", ro(m) + 1), h.attr("rows", ao(m) + 1), h.style("width", ""), h.style("height", ""), u = h.property("scrollWidth") + 1, p = h.property("scrollHeight") + 1;
       const g = Math.max(u, o), v = Math.max(p, a);
       d == null || d.attr("width", `${g}px`), h.style("width", `${g}px`), d == null || d.attr("height", `${v}px`), h.style("height", `${v}px`), r && r(m);
     }).on(L.Click, (m) => {
@@ -6132,11 +6144,11 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
         e.move(s);
         const r = this.model.nodes.getAtCoordinates(t.x, t.y).filter((h) => h.id !== e.id && !h.isDescendantOf(e)).filter(
           (h) => h.type.childrenTypes.includes(e.type.id)
-        ), c = xi(
+        ), c = $i(
           r
         ), d = c[c.length - 1];
         if (d !== e.parent && (e.type.canBeParentless || d !== void 0)) {
-          const h = d == null ? void 0 : d.getLastAncestor(), u = this.currentAction.from, p = new Eo(
+          const h = d == null ? void 0 : d.getLastAncestor(), u = this.currentAction.from, p = new No(
             this,
             e.id,
             (o = e.parent) == null ? void 0 : o.id,
@@ -6184,7 +6196,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
     const e = this.getPointerLocationRelativeToCanvas(t);
     (o = this.multipleSelectionContainer) == null || o.remove(), this.multipleSelectionContainer = void 0, this.userSelection.clear();
     for (const a of this.model.nodes)
-      Xi(
+      Ki(
         [
           a.coords,
           [a.coords[0] + a.width, a.coords[1] + a.height]
@@ -6198,7 +6210,7 @@ const Bo = (i) => i * Math.PI / 180, fi = (i, t, e) => {
 };
 ee.canvasCount = 0;
 let Ce = ee;
-class zi {
+class Oi {
   constructor() {
     this.grid = [[void 0]], this.offsetX = 0, this.offsetY = 0;
   }
@@ -6310,7 +6322,7 @@ class zi {
     }
   }
 }
-class Xo {
+class Ko {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6318,9 +6330,9 @@ class Xo {
     var n;
     if (t.nodes.length === 0)
       return t;
-    const e = new zi(), o = t.nodes.filter((r) => !r.parent);
+    const e = new Oi(), o = t.nodes.filter((r) => !r.parent);
     for (; o.length > 0; )
-      Ri(
+      Di(
         o[0],
         e,
         [0, 0],
@@ -6338,18 +6350,18 @@ class Xo {
     return t;
   }
 }
-const Ri = (i, t, e, o) => {
+const Di = (i, t, e, o) => {
   const a = t.getClosestEmptyCoordinate(e);
   t.set(a, i), K(o, i);
   for (const l of i.getAdjacentNodes())
-    o.includes(l) && Ri(
+    o.includes(l) && Di(
       l,
       t,
       a,
       o
     );
 };
-class jo {
+class qo {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6357,7 +6369,7 @@ class jo {
     var d;
     if (t.nodes.length === 0)
       return t;
-    const e = new zi(), o = t.nodes.filter((h) => !h.parent), a = {}, l = o[0];
+    const e = new Oi(), o = t.nodes.filter((h) => !h.parent), a = {}, l = o[0];
     let s = [l];
     for (a[l.id] = [0, 0]; o.length > 0; ) {
       const h = [];
@@ -6426,7 +6438,7 @@ class le {
     return t;
   }
 }
-class Wo {
+class Jo {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6454,7 +6466,7 @@ class Wo {
           ], v = [
             m.coords[0] + m.width / 2,
             m.coords[1] + m.height / 2
-          ], w = bi(
+          ], w = Si(
             p.coords,
             m.coords
           ), y = [m.coords[0], m.coords[1]];
@@ -6477,7 +6489,7 @@ class Wo {
     return t;
   }
 }
-class Zo {
+class Qo {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6493,7 +6505,7 @@ class Zo {
     return t;
   }
 }
-class Ko {
+class ts {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6561,7 +6573,7 @@ class Ko {
     return t;
   }
 }
-class qo {
+class es {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6581,11 +6593,11 @@ class qo {
       const h = l[0];
       l.splice(0, 1);
       const u = new xe(void 0, h);
-      Vi(u, l), s.push(u);
+      Fi(u, l), s.push(u);
     }
     const n = [];
     for (const h of s)
-      n.push([h]), _i(h, n, n.length);
+      n.push([h]), Hi(h, n, n.length);
     const r = Math.max(...t.nodes.map((h) => h.height));
     let c = 0;
     for (let h = 0; h < n.length; ++h) {
@@ -6604,21 +6616,21 @@ class qo {
     return t;
   }
 }
-const Vi = (i, t) => {
+const Fi = (i, t) => {
   for (const e of i.node.getAdjacentNodes().sort((o, a) => a.getPriority() - o.getPriority())) {
     const o = t.indexOf(e);
     if (o >= 0) {
       t.splice(o, 1);
       const a = i.addBranch(e);
-      Vi(a, t);
+      Fi(a, t);
     }
   }
-}, _i = (i, t, e) => {
+}, Hi = (i, t, e) => {
   if (i.branches.length > 0) {
     for (; e >= t.length; )
       t.push([]);
     for (const o of i.branches)
-      t[e].push(o), _i(o, t, e + 1);
+      t[e].push(o), Hi(o, t, e + 1);
   }
 };
 class xe {
@@ -6640,7 +6652,7 @@ class xe {
     }
   }
 }
-class Jo {
+class is {
   constructor(t) {
     this.gapSize = t;
   }
@@ -6656,17 +6668,17 @@ class Jo {
     return t;
   }
 }
-const pi = {
-  adjacency: new Xo(),
+const ki = {
+  adjacency: new Ko(),
   breadth: new le(),
-  "breadth-adjacency": new jo(),
-  force: new Wo(),
-  horizontal: new Zo(),
-  priority: new Ko(),
-  tree: new qo(),
-  vertical: new Jo()
-}, Qo = yi({}), $t = yi({});
-class ts {
+  "breadth-adjacency": new qo(),
+  force: new Jo(),
+  horizontal: new Qo(),
+  priority: new ts(),
+  tree: new es(),
+  vertical: new is()
+}, os = Ci({}), $t = Ci({});
+class ss {
   constructor(t, e) {
     this.onTitleChange = t, this.onValueSetChange = e;
   }
@@ -6730,10 +6742,10 @@ const Le = ({
       children: /* @__PURE__ */ k("div", { className: u() })
     }
   ) });
-}, es = () => {
+}, ns = () => {
   const i = Wt($t), t = dt(null), [e, o] = U([]);
-  Bi(i.validatorChange$, i.diagramChange$).pipe(
-    Ui(() => a())
+  ji(i.validatorChange$, i.diagramChange$).pipe(
+    Wi(() => a())
   ).subscribe();
   const a = () => {
     o([]);
@@ -6788,7 +6800,7 @@ const Le = ({
       n
     )) }) })
   ] }) });
-}, is = 200, vi = (i) => (i || "").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""), Oi = ({
+}, rs = 200, wi = (i) => (i || "").toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, ""), Gi = ({
   disabled: i,
   options: t,
   value: e,
@@ -6827,10 +6839,10 @@ const Le = ({
       }
   }, y = () => {
     if (!i) {
-      const T = vi(l.trim());
+      const T = wi(l.trim());
       c([]), h([]), p([]), m([]);
       for (const z of t) {
-        const D = vi(z.label).indexOf(T);
+        const D = wi(z.label).indexOf(T);
         if (D >= 0) {
           const q = z.label.substring(0, D), H = z.label.substring(
             D,
@@ -6863,7 +6875,7 @@ const Le = ({
   }, E = () => {
     setTimeout(() => {
       A();
-    }, is);
+    }, rs);
   }, $ = (T) => {
     var j;
     const z = (j = a.current) == null ? void 0 : j.querySelectorAll("li")[T];
@@ -6913,10 +6925,10 @@ const Le = ({
       ]
     }
   );
-}, os = (i, t) => {
+}, as = (i, t) => {
   var e;
   return ((e = i.find((o) => o.key === t)) == null ? void 0 : e.label) || `${t}`;
-}, ss = ({
+}, ls = ({
   disabled: i,
   allowRepeats: t,
   options: e,
@@ -6925,7 +6937,7 @@ const Le = ({
 }) => {
   const [l, s] = U(), [n, r] = U([]), [c, d] = U([]);
   Tt(() => {
-    const g = o.length === 0, v = o.map((w) => os(e, w));
+    const g = o.length === 0, v = o.map((w) => as(e, w));
     r(v), g && a(o), m();
   }, [o, e]);
   const h = (g) => {
@@ -6961,7 +6973,7 @@ const Le = ({
     ] }, v)),
     !i && /* @__PURE__ */ V("div", { className: "daga-value-item-input", children: [
       /* @__PURE__ */ k("div", { className: "daga-input daga-relatively-positioned", children: /* @__PURE__ */ k(
-        Oi,
+        Gi,
         {
           disabled: i,
           options: t ? e || [] : c || [],
@@ -6972,7 +6984,7 @@ const Le = ({
       /* @__PURE__ */ k("button", { className: "daga-property-button", onClick: p, children: /* @__PURE__ */ k("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, ns = ({
+}, cs = ({
   disabled: i,
   allowRepeats: t,
   value: e,
@@ -6998,7 +7010,7 @@ const Le = ({
   }, h = (u) => {
     u.key === "Enter" && c();
   };
-  return /* @__PURE__ */ V(Hi, { children: [
+  return /* @__PURE__ */ V(Yi, { children: [
     e.map((u, p) => /* @__PURE__ */ V("div", { className: "daga-value-item-element", children: [
       /* @__PURE__ */ k(
         "input",
@@ -7035,7 +7047,7 @@ const Le = ({
       /* @__PURE__ */ k("button", { className: "daga-property-button", onClick: c, children: /* @__PURE__ */ k("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, rs = ({
+}, ds = ({
   disabled: i,
   value: t,
   onChange: e
@@ -7150,7 +7162,7 @@ const Le = ({
       /* @__PURE__ */ k("button", { className: "daga-property-button", onClick: u, children: /* @__PURE__ */ k("div", { className: "daga-icon daga-add-icon" }) })
     ] })
   ] });
-}, Di = ({
+}, Bi = ({
   valueSet: i,
   onValueChange: t,
   depth: e
@@ -7291,7 +7303,7 @@ const Le = ({
           )
         ] }),
         c.type === _.Option && /* @__PURE__ */ k("div", { className: "daga-relatively-positioned", children: /* @__PURE__ */ k(
-          Oi,
+          Gi,
           {
             disabled: c.editable === !1 || !a,
             options: c.options || [],
@@ -7300,7 +7312,7 @@ const Le = ({
           }
         ) }),
         (c.type === _.OptionList || c.type === _.OptionSet) && /* @__PURE__ */ k(
-          ss,
+          ls,
           {
             disabled: c.editable === !1 || !a,
             allowRepeats: c.type === _.OptionList,
@@ -7310,7 +7322,7 @@ const Le = ({
           }
         ),
         (c.type === _.TextList || c.type === _.TextSet) && /* @__PURE__ */ k(
-          ns,
+          cs,
           {
             disabled: c.editable === !1 || !a,
             allowRepeats: c.type === _.TextList,
@@ -7319,7 +7331,7 @@ const Le = ({
           }
         ),
         c.type === _.TextMap && /* @__PURE__ */ k(
-          rs,
+          ds,
           {
             disabled: c.editable === !1 || !a,
             value: i == null ? void 0 : i.getValue(c.name),
@@ -7327,7 +7339,7 @@ const Le = ({
           }
         ),
         c.type === _.Object && /* @__PURE__ */ k("div", { className: "daga-left-bar", children: /* @__PURE__ */ k(
-          Di,
+          Bi,
           {
             valueSet: i.getSubValueSet(c.name),
             onValueChange: t,
@@ -7338,7 +7350,7 @@ const Le = ({
     },
     c.name
   )) });
-}, Fi = ({ valueSet: i, depth: t }) => {
+}, Ui = ({ valueSet: i, depth: t }) => {
   const e = Wt($t), o = dt(null), a = (r) => "daga-property-name-" + r.replace(/\s/g, ""), l = () => {
     for (const r of (i == null ? void 0 : i.displayedProperties) || []) {
       let c = 0, d = 0, h = 0;
@@ -7405,7 +7417,7 @@ const Le = ({
     if (i === void 0)
       return;
     let c;
-    r instanceof lo ? c = r : r instanceof Event ? c = i == null ? void 0 : i.propertySet.getProperty(
+    r instanceof uo ? c = r : r instanceof Event ? c = i == null ? void 0 : i.propertySet.getProperty(
       ((d = r.target) == null ? void 0 : d.value) || ""
     ) : c = i == null ? void 0 : i.propertySet.getProperty(r || ""), c && (i == null || i.hideProperty(c)), l();
   };
@@ -7435,9 +7447,9 @@ const Le = ({
                     )
                   ] })
                 ] }),
-                r.type !== _.Object && /* @__PURE__ */ k("div", { className: "daga-property-value", children: as(i == null ? void 0 : i.getValue(r.name)) }),
+                r.type !== _.Object && /* @__PURE__ */ k("div", { className: "daga-property-value", children: hs(i == null ? void 0 : i.getValue(r.name)) }),
                 r.type === _.Object && /* @__PURE__ */ k(
-                  Fi,
+                  Ui,
                   {
                     valueSet: i == null ? void 0 : i.getSubValueSet(r.name),
                     depth: t + 1
@@ -7457,71 +7469,71 @@ const Le = ({
       r.name
     ))
   ] });
-}, as = (i) => Array.isArray(i) ? i.join(", ") : co(i) ? Object.entries(i).map((t) => t.map((e) => JSON.stringify(e)).join(": ")).join(", ") : i instanceof Date ? i.toLocaleString() : i == null ? "" : "" + i, ls = ({ location: i, direction: t, width: e, title: o, valueSet: a, onValueChange: l }) => {
-  const s = dt(null), [n, r] = U(!1), [c, d] = U(!1), h = () => N.select(s.current);
+}, hs = (i) => Array.isArray(i) ? i.join(", ") : mo(i) ? Object.entries(i).map((t) => t.map((e) => JSON.stringify(e)).join(": ")).join(", ") : i instanceof Date ? i.toLocaleString() : i == null ? "" : "" + i, gs = ({ location: i, direction: t, width: e, height: o, title: a, valueSet: l, onValueChange: s }) => {
+  const n = dt(null), [r, c] = U(!1), [d, h] = U(!1), u = () => N.select(n.current);
   return Tt(() => {
-    if (s.current)
+    if (n.current)
       switch (t) {
         case b.Bottom:
         case b.Top:
-          h().style("width", e);
+          u().style("width", e), o && u().select(".daga-panel-content").style("height", o);
           break;
         case b.Left:
         case b.Right:
-          h().style("height", e);
+          u().style("height", e), o && u().select(".daga-panel-content").style("width", o);
           break;
       }
   }, [e, t]), /* @__PURE__ */ k("daga-property-editor", { children: /* @__PURE__ */ V(
     "div",
     {
-      ref: s,
+      ref: n,
       className: `daga-panel daga-bottom daga-${i} daga-${t}`,
       children: [
         /* @__PURE__ */ k(
           Le,
           {
-            disabled: !a || !a.propertySet || !a.propertySet.hasProperties(),
-            collapsed: n,
+            disabled: !l || !l.propertySet || !l.propertySet.hasProperties(),
+            collapsed: r,
             direction: t,
-            collapsableSelector: s,
+            collapsableSelector: n,
             collapsableAdditionalSelector: ".daga-panel-content",
             rule: "display",
             collapsedValue: "none",
             visibleValue: "block",
-            onCollapse: r
+            onCollapse: c
           }
         ),
-        a && a.propertySet && a.propertySet.hasProperties() && !n && /* @__PURE__ */ V("div", { className: "daga-panel-content", children: [
-          o && /* @__PURE__ */ V("p", { className: "daga-title", children: [
-            o,
+        /* @__PURE__ */ k("div", { className: "daga-panel-content", children: l && l.propertySet && l.propertySet.hasProperties() && !r && /* @__PURE__ */ V("div", { children: [
+          a && /* @__PURE__ */ V("p", { className: "daga-title", children: [
+            a,
             /* @__PURE__ */ k(
               "button",
               {
                 className: "daga-property-button",
-                onClick: () => d(!c),
+                onClick: () => h(!d),
                 children: /* @__PURE__ */ k(
                   "div",
                   {
-                    className: `daga-icon daga-settings-icon ${c ? "daga-unrotate" : "daga-rotate"}`
+                    className: `daga-icon daga-settings-icon ${d ? "daga-unrotate" : "daga-rotate"}`
                   }
                 )
               }
             )
           ] }),
-          !c && /* @__PURE__ */ k(
-            Di,
+          !d && /* @__PURE__ */ k(
+            Bi,
             {
-              valueSet: a,
-              onValueChange: l,
+              valueSet: l,
+              onValueChange: s,
               depth: 0
             }
           ),
-          c && /* @__PURE__ */ k(Fi, { valueSet: a, depth: 0 })
-        ] })
+          d && /* @__PURE__ */ k(Ui, { valueSet: l, depth: 0 })
+        ] }) })
       ]
     }
   ) });
-}, cs = 6, ds = (i) => {
+}, us = 6, ms = (i) => {
   const t = Wt($t), [e, o] = U(
     i.currentPalette || i.palettes[0]
   ), [a, l] = U(0), [s, n] = U(
@@ -7606,12 +7618,12 @@ const Le = ({
             D[1]
           ).filter(
             (Lt) => Lt.type.childrenTypes.includes(m.id)
-          ), W = xi(
+          ), W = $i(
             Y
           ), lt = W[W.length - 1];
           if (!m.canBeParentless && lt === void 0)
             return;
-          const mt = lt == null ? void 0 : lt.getLastAncestor(), Dt = new Lo(
+          const mt = lt == null ? void 0 : lt.getLastAncestor(), Dt = new Mo(
             t,
             m,
             q,
@@ -7700,7 +7712,7 @@ const Le = ({
       )
     ).attr("fill", g.backgroundColor).attr("stroke", "black").attr("stroke-width", "1px"), g.icon !== "" && w.append("image").attr("x", 0).attr("y", 0).attr("width", g.width).attr("height", g.height).attr("href", g.icon), g.label !== "" && w.append("text").attr(
       "transform",
-      `translate(${g.width / 2},${g.height / 2 + cs})`
+      `translate(${g.width / 2},${g.height / 2 + us})`
     ).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(g.label);
   };
   return Tt(() => {
@@ -7708,11 +7720,11 @@ const Le = ({
       switch (i.direction) {
         case b.Bottom:
         case b.Top:
-          r.current.style.width = i.width;
+          r.current.style.width = i.width, i.height && (r.current.style.height = i.height);
           break;
         case b.Left:
         case b.Right:
-          r.current.style.height = i.width;
+          r.current.style.height = i.width, i.height && (r.current.style.width = i.height);
           break;
       }
   }, [e, i.palettes]), /* @__PURE__ */ k("daga-palette", { children: /* @__PURE__ */ V(
@@ -7748,7 +7760,7 @@ const Le = ({
       ]
     }
   ) });
-}, hs = ({
+}, fs = ({
   location: i,
   direction: t,
   enableAction: e,
@@ -7800,7 +7812,7 @@ const Le = ({
   }, I = () => {
     w.center();
   }, E = () => {
-    w.layoutFormat && w.layoutFormat in pi && pi[w.layoutFormat].apply(w.model);
+    w.layoutFormat && w.layoutFormat in ki && ki[w.layoutFormat].apply(w.model);
   }, $ = () => {
     n = !n, N.select(
       g.current
@@ -7826,7 +7838,7 @@ const Le = ({
       m.current
     ).classed("daga-on", !0).classed("daga-off", !1);
     const H = w.diagramEvent$.subscribe((Y) => {
-      Y.type === $i.Selection && (N.select(
+      Y.type === zi.Selection && (N.select(
         m.current
       ).classed("daga-on", !1).classed("daga-off", !0), H.unsubscribe());
     });
@@ -7854,15 +7866,15 @@ const Le = ({
       ]
     }
   ) });
-}, fs = ({
+}, bs = ({
   config: i,
   model: t,
   onCanvasCreated: e,
   onDiagramEvent: o,
   onModelChange: a
 }) => {
-  var $, C, R, T, z, j, D, q, H, Y, W, lt, mt, Dt, Lt, Ee, Te, $e, Me, Ne, Pe, ze, Re, Ve, _e, Oe, De, Fe, He, Ge, Be, Ue, Ye, Xe, je, We, Ze, Ke, qe, Je, Qe, ti, ei, ii, oi;
-  const l = new Ti(), s = new Pi(), n = dt(null), r = dt(void 0), c = dt(!1), d = [], [h, u] = U(void 0), [p, f] = U(void 0), m = {
+  var $, C, R, T, z, j, D, q, H, Y, W, lt, mt, Dt, Lt, Ee, Te, $e, Me, Ne, Pe, ze, Re, Ve, _e, Oe, De, Fe, He, Ge, Be, Ue, Ye, Xe, je, We, Ze, Ke, qe, Je, Qe, ti, ei, ii, oi, si, ni, ri, ai;
+  const l = new Pi(), s = new _i(), n = dt(null), r = dt(void 0), c = dt(!1), d = [], [h, u] = U(void 0), [p, f] = U(void 0), m = {
     zoomIn: () => {
     },
     zoomOut: () => {
@@ -7880,7 +7892,7 @@ const Le = ({
   }, g = {
     refreshPalette: () => {
     }
-  }, v = new ts(
+  }, v = new ss(
     (gt) => u(gt),
     (gt) => f(gt)
   ), w = {
@@ -7901,27 +7913,27 @@ const Le = ({
   };
   Tt(() => {
     n.current && (c.current || (I(n.current), c.current = !0, e == null || e(A)));
-  }, [n.current]), Yi(() => {
+  }, [n.current]), Zi(() => {
     n.current && (y(!0), I(n.current), e == null || e(A));
   }, [i]), Tt(() => {
     t && l.import(A.model, t);
   }, [t]);
-  const E = (gt, ft, si) => {
-    var ni;
-    if (p !== void 0 && ft.editable !== !1 && !Et(gt.getValue(ft.name), si)) {
-      gt.setValue(ft.name, si);
+  const E = (gt, ft, li) => {
+    var ci;
+    if (p !== void 0 && ft.editable !== !1 && !Et(gt.getValue(ft.name), li)) {
+      gt.setValue(ft.name, li);
       const ce = new It(
         p.propertySet,
         p.rootElement
       );
-      ce.setValues(p.getValues()), v.valueSet = ce, p.rootElement.valueSet = ce, (ni = A.propertyEditorChanges$) == null || ni.next();
+      ce.setValues(p.getValues()), v.valueSet = ce, p.rootElement.valueSet = ce, (ci = A.propertyEditorChanges$) == null || ci.next();
     }
   };
-  return /* @__PURE__ */ k("daga-diagram", { children: /* @__PURE__ */ k(Qo.Provider, { value: i, children: /* @__PURE__ */ k($t.Provider, { value: A, children: /* @__PURE__ */ V("daga-diagram-editor", { children: [
+  return /* @__PURE__ */ k("daga-diagram", { children: /* @__PURE__ */ k(os.Provider, { value: i, children: /* @__PURE__ */ k($t.Provider, { value: A, children: /* @__PURE__ */ V("daga-diagram-editor", { children: [
     /* @__PURE__ */ k("div", { className: "daga-append-to", ref: n }),
     /* @__PURE__ */ V($t.Provider, { value: A, children: [
       (($ = i.components) == null ? void 0 : $.buttons) !== void 0 && ((R = (C = i.components) == null ? void 0 : C.buttons) == null ? void 0 : R.enabled) !== !1 && /* @__PURE__ */ k(
-        hs,
+        fs,
         {
           location: ((z = (T = i.components) == null ? void 0 : T.buttons) == null ? void 0 : z.location) || qt.BottomRight,
           direction: ((D = (j = i.components) == null ? void 0 : j.buttons) == null ? void 0 : D.direction) || b.Top,
@@ -7933,29 +7945,31 @@ const Le = ({
         }
       ),
       (($e = i.components) == null ? void 0 : $e.palette) !== void 0 && ((Ne = (Me = i.components) == null ? void 0 : Me.palette) == null ? void 0 : Ne.enabled) !== !1 && ((ze = (Pe = i.components) == null ? void 0 : Pe.palette) == null ? void 0 : ze.sections) && (((_e = (Ve = (Re = i.components) == null ? void 0 : Re.palette) == null ? void 0 : Ve.sections) == null ? void 0 : _e.length) || 0) > 0 && /* @__PURE__ */ k(
-        ds,
+        ms,
         {
           location: ((De = (Oe = i.components) == null ? void 0 : Oe.palette) == null ? void 0 : De.location) || qt.TopLeft,
           direction: ((He = (Fe = i.components) == null ? void 0 : Fe.palette) == null ? void 0 : He.direction) || b.Bottom,
           width: ((Be = (Ge = i.components) == null ? void 0 : Ge.palette) == null ? void 0 : Be.width) || "12rem",
-          palettes: ((Ye = (Ue = i.components) == null ? void 0 : Ue.palette) == null ? void 0 : Ye.sections) || []
+          height: (Ye = (Ue = i.components) == null ? void 0 : Ue.palette) == null ? void 0 : Ye.height,
+          palettes: ((je = (Xe = i.components) == null ? void 0 : Xe.palette) == null ? void 0 : je.sections) || []
         }
       ),
-      ((Xe = i.components) == null ? void 0 : Xe.propertyEditor) !== void 0 && ((We = (je = i.components) == null ? void 0 : je.propertyEditor) == null ? void 0 : We.enabled) !== !1 && /* @__PURE__ */ k(
-        ls,
+      ((We = i.components) == null ? void 0 : We.propertyEditor) !== void 0 && ((Ke = (Ze = i.components) == null ? void 0 : Ze.propertyEditor) == null ? void 0 : Ke.enabled) !== !1 && /* @__PURE__ */ k(
+        gs,
         {
-          location: ((Ke = (Ze = i.components) == null ? void 0 : Ze.propertyEditor) == null ? void 0 : Ke.location) || qt.TopRight,
-          direction: ((Je = (qe = i.components) == null ? void 0 : qe.propertyEditor) == null ? void 0 : Je.direction) || b.Bottom,
-          width: ((ti = (Qe = i.components) == null ? void 0 : Qe.propertyEditor) == null ? void 0 : ti.width) || "24rem",
+          location: ((Je = (qe = i.components) == null ? void 0 : qe.propertyEditor) == null ? void 0 : Je.location) || qt.TopRight,
+          direction: ((ti = (Qe = i.components) == null ? void 0 : Qe.propertyEditor) == null ? void 0 : ti.direction) || b.Bottom,
+          width: ((ii = (ei = i.components) == null ? void 0 : ei.propertyEditor) == null ? void 0 : ii.width) || "24rem",
+          height: (si = (oi = i.components) == null ? void 0 : oi.propertyEditor) == null ? void 0 : si.height,
           title: h,
           valueSet: p,
           onValueChange: E
         }
       ),
-      ((ei = i.components) == null ? void 0 : ei.errors) !== void 0 && ((oi = (ii = i.components) == null ? void 0 : ii.errors) == null ? void 0 : oi.enabled) !== !1 && /* @__PURE__ */ k(es, {})
+      ((ni = i.components) == null ? void 0 : ni.errors) !== void 0 && ((ai = (ri = i.components) == null ? void 0 : ri.errors) == null ? void 0 : ai.enabled) !== !1 && /* @__PURE__ */ k(ns, {})
     ] })
   ] }) }) }) });
 };
 export {
-  fs as DagaDiagram
+  bs as DagaDiagram
 };