@oscherbakov/react-flow-automated-layout 1.3.1 → 1.3.3

package/dist/react-flow-automated-layout.es.js

@@ -1,10 +1,10 @@
-import { jsx as d, jsxs as T, Fragment as P } from "react/jsx-runtime";
-import { createContext as Ut, useContext as Ft, useState as B, useEffect as V, useRef as ut, useCallback as U } from "react";
-import { Position as A, useReactFlow as Vt, useNodes as Yt, useEdges as It, useOnSelectionChange as Pt, ControlButton as D, Controls as jt } from "@xyflow/react";
-import dt from "@dagrejs/dagre";
-const Lt = Ut(void 0);
-function Y() {
-  const t = Ft(Lt);
+import { jsx as u, jsxs as T, Fragment as P } from "react/jsx-runtime";
+import { createContext as Ft, useContext as Vt, useState as B, useEffect as V, useRef as dt, useCallback as U } from "react";
+import { Position as A, useReactFlow as It, useNodes as Yt, useEdges as Pt, useOnSelectionChange as jt, ControlButton as D, Controls as Xt } from "@xyflow/react";
+import ut from "@dagrejs/dagre";
+const Lt = Ft(void 0);
+function I() {
+  const t = Vt(Lt);
   if (t === void 0)
     throw new Error("useLayoutContext must be used within a LayoutProvider");
   return t;
@@ -35,7 +35,7 @@ const ft = (t) => {
     default:
       return "DOWN";
   }
-}, Xt = {
+}, Jt = {
   enabled: !0,
   padding: {
     horizontal: 80,
@@ -44,7 +44,7 @@ const ft = (t) => {
   respectHeaderHeight: !0,
   minWidth: 200,
   minHeight: 100
-}, Jt = (t) => {
+}, Zt = (t) => {
   switch (t) {
     case "DOWN":
       return A.Bottom;
@@ -57,7 +57,7 @@ const ft = (t) => {
     default:
       return A.Bottom;
   }
-}, Zt = (t) => {
+}, qt = (t) => {
   switch (t) {
     case "DOWN":
       return A.Top;
@@ -71,7 +71,7 @@ const ft = (t) => {
       return A.Top;
   }
 };
-function qt(t, r, e) {
+function Qt(t, r, e) {
   if (e)
     return { nodes: t, edges: r };
   const o = t.filter((l) => !l.hidden), n = new Set(o.map((l) => l.id)), i = r.filter(
@@ -79,8 +79,8 @@ function qt(t, r, e) {
   );
   return { nodes: o, edges: i };
 }
-const Qt = 172, Wt = 36, X = async (t, r, e, o = 0, n = 50, i = 50, l = Qt, c = Wt, h = !1) => {
-  const a = new dt.graphlib.Graph().setDefaultEdgeLabel(() => ({}));
+const Wt = 172, Kt = 36, X = async (t, r, e, o = 0, n = 50, i = 50, l = Wt, c = Kt, h = !1) => {
+  const a = new ut.graphlib.Graph().setDefaultEdgeLabel(() => ({}));
   a.setGraph({
     rankdir: e,
     marginx: o,
@@ -91,55 +91,55 @@ const Qt = 172, Wt = 36, X = async (t, r, e, o = 0, n = 50, i = 50, l = Qt, c =
     //When we have siblings, we want their top edges to be aligned
     ranker: "tight-tree"
   });
-  const s = h ? t : t.filter((p) => !p.hidden);
+  const s = h ? t : t.filter((f) => !f.hidden);
   if (s.length === 0)
     return { nodes: [], edges: [], width: 0, height: 0 };
-  s.forEach((p) => {
-    var y, x;
-    const f = Number((y = p.style) == null ? void 0 : y.width) || l, m = Number((x = p.style) == null ? void 0 : x.height) || c;
-    a.setNode(p.id, { width: f, height: m });
-  }), r.forEach((p) => {
-    var E, L;
-    const f = p.sourceHandle, m = p.targetHandle, y = !!((E = p.data) != null && E.isReciprocal), x = !!((L = p.data) != null && L.isSyntheticBridge);
-    let w = {};
-    y ? w = { constraint: !1, minlen: 1, weight: 5 } : x ? w = { constraint: !0, minlen: 1, weight: 4 } : f === "right" && m === "left" ? w = { constraint: !1, minlen: 1 } : f === "bottom" && m === "top" ? w = { constraint: !0, minlen: 1 } : w = { constraint: !0, minlen: 2 }, a.setEdge(p.source, p.target, w);
-  }), dt.layout(a);
-  const u = a.graph().width || 0, g = a.graph().height || 0, N = Jt(pt(e)), b = Zt(pt(e));
+  s.forEach((f) => {
+    var w, y;
+    const p = Number((w = f.style) == null ? void 0 : w.width) || l, m = Number((y = f.style) == null ? void 0 : y.height) || c;
+    a.setNode(f.id, { width: p, height: m });
+  }), r.forEach((f) => {
+    var C, b;
+    const p = f.sourceHandle, m = f.targetHandle, w = !!((C = f.data) != null && C.isReciprocal), y = !!((b = f.data) != null && b.isSyntheticBridge);
+    let g = {};
+    w ? g = { constraint: !1, minlen: 1, weight: 5 } : y ? g = { constraint: !0, minlen: 1, weight: 4 } : p === "right" && m === "left" ? g = { constraint: !1, minlen: 1 } : p === "bottom" && m === "top" ? g = { constraint: !0, minlen: 1 } : g = { constraint: !0, minlen: 2 }, a.setEdge(f.source, f.target, g);
+  }), ut.layout(a);
+  const d = a.graph().width || 0, x = a.graph().height || 0, N = Zt(pt(e)), L = qt(pt(e));
   return {
-    nodes: s.map((p) => {
-      var L;
-      const f = a.node(p.id), { width: m, height: y } = f, x = {
-        ...p,
+    nodes: s.map((f) => {
+      var b;
+      const p = a.node(f.id), { width: m, height: w } = p, y = {
+        ...f,
         sourcePosition: N,
-        targetPosition: b,
+        targetPosition: L,
         selected: !1
-      }, w = f.x, E = f.y;
-      switch ((L = p.data) == null ? void 0 : L.positionType) {
+      }, g = p.x, C = p.y;
+      switch ((b = f.data) == null ? void 0 : b.positionType) {
         case "center":
-          x.position = { x: w, y: E };
+          y.position = { x: g, y: C };
           break;
         case "topRight":
-          x.position = { x: w + m / 2, y: E - y / 2 };
+          y.position = { x: g + m / 2, y: C - w / 2 };
           break;
         case "bottomLeft":
-          x.position = { x: w - m / 2, y: E + y / 2 };
+          y.position = { x: g - m / 2, y: C + w / 2 };
           break;
         case "bottomRight":
-          x.position = { x: w + m / 2, y: E + y / 2 };
+          y.position = { x: g + m / 2, y: C + w / 2 };
           break;
         case "topLeft":
         default:
-          x.position = { x: w - m / 2, y: E - y / 2 };
+          y.position = { x: g - m / 2, y: C - w / 2 };
       }
-      return x;
+      return y;
     }),
     edges: r,
-    width: u,
-    height: g
+    width: d,
+    height: x
   };
-}, Kt = {
+}, te = {
   calculate: async (t, r, e) => {
-    const o = e.nodes || t, n = e.edges || r, l = e.dagreDirection || typeof e.direction == "string" && (e.direction === "RIGHT" || e.direction === "LEFT" ? "LR" : "TB") || "TB", c = e.margin ?? (typeof e.padding == "number" ? e.padding : 0), h = e.nodeSpacing ?? 50, a = e.layerSpacing ?? 50, s = e.nodeWidth ?? 172, u = e.nodeHeight ?? 36, g = e.layoutHidden ?? !1;
+    const o = e.nodes || t, n = e.edges || r, l = e.dagreDirection || typeof e.direction == "string" && (e.direction === "RIGHT" || e.direction === "LEFT" ? "LR" : "TB") || "TB", c = e.margin ?? (typeof e.padding == "number" ? e.padding : 0), h = e.nodeSpacing ?? 50, a = e.layerSpacing ?? 50, s = e.nodeWidth ?? 172, d = e.nodeHeight ?? 36, x = e.layoutHidden ?? !1;
     return X(
       o,
       n,
@@ -148,14 +148,14 @@ const Qt = 172, Wt = 36, X = async (t, r, e, o = 0, n = 50, i = 50, l = Qt, c =
       h,
       a,
       s,
-      u,
-      g
+      d,
+      x
     );
   }
-}, te = {
-  dagre: Kt
+}, ee = {
+  dagre: te
 };
-function ee({
+function re({
   initialDirection: t = "DOWN",
   initialAlgorithm: r = "layered",
   initialAutoLayout: e = !0,
@@ -166,38 +166,38 @@ function ee({
   includeHidden: c = !1,
   layoutEngines: h
 }) {
-  const [a, s] = B(t), [u, g] = B(r), [N, b] = B(e), [C, p] = B(!1), [f, m] = B(c), [y, x] = B({
-    ...te,
+  const [a, s] = B(t), [d, x] = B(r), [N, L] = B(e), [E, f] = B(!1), [p, m] = B(c), [w, y] = B({
+    ...ee,
     ...h
-  }), [w, E] = B({}), [L, M] = B(o), [G, O] = B(n.node || 150), [k, v] = B(n.layer || 180), [S, R] = B(i.width || 100), [_, J] = B(i.height || 100), [Z, q] = B({
-    ...Xt,
+  }), [g, C] = B({}), [b, M] = B(o), [G, O] = B(n.node || 150), [k, v] = B(n.layer || 180), [S, R] = B(i.width || 100), [_, J] = B(i.height || 100), [Z, q] = B({
+    ...Jt,
     ...l,
     enabled: e
-  }), [I, Q] = B([]);
+  }), [Y, Q] = B([]);
   return {
     // State
     direction: a,
-    algorithm: u,
+    algorithm: d,
     autoLayout: N,
-    layoutInProgress: C,
-    layoutHidden: f,
-    layoutEngines: y,
-    layoutEngineOptions: w,
-    padding: L,
+    layoutInProgress: E,
+    layoutHidden: p,
+    layoutEngines: w,
+    layoutEngineOptions: g,
+    padding: b,
     nodeSpacing: G,
     layerSpacing: k,
     nodeWidth: S,
     nodeHeight: _,
     parentResizingOptions: Z,
-    selectedNodes: I,
+    selectedNodes: Y,
     // Setters
     setDirection: s,
-    setAlgorithm: g,
-    setAutoLayout: b,
-    setLayoutInProgress: p,
+    setAlgorithm: x,
+    setAutoLayout: L,
+    setLayoutInProgress: f,
     setLayoutHidden: m,
-    setLayoutEngines: x,
-    setLayoutEngineOptions: E,
+    setLayoutEngines: y,
+    setLayoutEngineOptions: C,
     setPadding: M,
     setNodeSpacing: O,
     setLayerSpacing: v,
@@ -207,49 +207,50 @@ function ee({
     setSelectedNodes: Q
   };
 }
-function re({
+function ne({
   nodes: t,
   externalNodeIdWithNode: r,
   externalNodeParentIdMapWithChildIdSet: e,
   noParentKey: o = "no-parent"
 }) {
-  const [n, i] = B(/* @__PURE__ */ new Map()), [l, c] = B(/* @__PURE__ */ new Map()), [h, a] = B({}), [s, u] = B(t.length), [g, N] = B(!1), b = r || n, C = e || l, p = b.size;
+  const [n, i] = B(/* @__PURE__ */ new Map()), [l, c] = B(/* @__PURE__ */ new Map()), [h, a] = B({}), [s, d] = B(t.length), [x, N] = B(!1), [L, E] = B(!1), f = r || n, p = e || l, m = f.size;
   return V(() => {
     if (!r || !e) {
-      const f = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map();
-      t.forEach((y) => {
-        var w;
-        f.set(y.id, y);
-        const x = y.parentId || o;
-        m.has(x) || m.set(x, /* @__PURE__ */ new Set()), (w = m.get(x)) == null || w.add(y.id);
-      }), r || i(f), e || c(m);
+      const w = /* @__PURE__ */ new Map(), y = /* @__PURE__ */ new Map();
+      E(!1), t.forEach((g) => {
+        var b;
+        w.set(g.id, g);
+        const C = g.parentId || o;
+        y.has(C) || y.set(C, /* @__PURE__ */ new Set()), (b = y.get(C)) == null || b.add(g.id);
+      }), r || i(w), e || c(y);
     }
   }, [t, r, e, o]), V(() => {
-    t.length !== s && u(t.length);
+    t.length !== s && d(t.length);
   }, [t]), V(() => {
-    b.size > 0 && C.size > 0 && !g && N(!0);
-  }, [b, C, g]), V(() => {
-    const f = {};
-    C.forEach((y, x) => {
-      f[x] = y.size;
+    f.size > 0 && p.size > 0 && !x && (N(!0), E(!0));
+  }, [f, p, x]), V(() => {
+    const w = {};
+    p.forEach((g, C) => {
+      w[C] = g.size;
     });
-    let m = !1;
-    for (const y in f)
-      if (!h.hasOwnProperty(y) || f[y] !== h[y]) {
-        m = !0;
+    let y = !1;
+    for (const g in w)
+      if (!h.hasOwnProperty(g) || w[g] !== h[g]) {
+        y = !0;
         break;
       }
-    m && a(f);
-  }, [C]), {
-    nodeIdWithNode: b,
-    nodeParentIdMapWithChildIdSet: C,
-    numberOfNodes: p,
+    y && a(w);
+  }, [p]), {
+    nodeIdWithNode: f,
+    nodeParentIdMapWithChildIdSet: p,
+    numberOfNodes: m,
     nodesLength: s,
-    childrenInitialized: g,
+    nodesInitialized: L,
+    childrenInitialized: x,
     parentChildStructure: h
   };
 }
-function ne({
+function oe({
   nodes: t,
   edges: r,
   selectedNodes: e,
@@ -262,22 +263,22 @@ function ne({
   setNodeSpacing: a,
   setLayerSpacing: s
 }) {
-  const u = Vt(), g = ut(null), N = ut(null), b = U(async (p = [], f = []) => {
-    g.current && g.current.abort();
+  const d = It(), x = dt(null), N = dt(null), L = U(async (f = [], p = []) => {
+    x.current && x.current.abort();
     const m = new AbortController();
-    g.current = m;
-    const y = p.length > 0 ? p : t, x = f.length > 0 ? f : r;
-    if (y.length === 0)
-      return { nodes: y, edges: x };
+    x.current = m;
+    const w = f.length > 0 ? f : t, y = p.length > 0 ? p : r;
+    if (w.length === 0)
+      return { nodes: w, edges: y };
     try {
       if (h(!0), m.signal.aborted)
-        return { nodes: y, edges: x };
-      const { nodes: w, edges: E } = qt(y, x, o), L = await n(w, E, e, m.signal);
-      return m.signal.aborted ? { nodes: y, edges: x } : (g.current === m && (l ? l(L.nodes) : u != null && u.setNodes && u.setNodes(L.nodes), c ? c(L.edges) : u != null && u.setEdges && u.setEdges(L.edges), N.current && (N.current.node !== void 0 && a(N.current.node), N.current.layer !== void 0 && s(N.current.layer), N.current = null)), L);
-    } catch (w) {
-      return m.signal.aborted || console.error("Error applying layout:", w), { nodes: y, edges: x };
+        return { nodes: w, edges: y };
+      const { nodes: g, edges: C } = Qt(w, y, o), b = await n(g, C, e, m.signal);
+      return m.signal.aborted ? { nodes: w, edges: y } : (x.current === m && (l ? l(b.nodes) : d != null && d.setNodes && d.setNodes(b.nodes), c ? c(b.edges) : d != null && d.setEdges && d.setEdges(b.edges), N.current && (N.current.node !== void 0 && a(N.current.node), N.current.layer !== void 0 && s(N.current.layer), N.current = null)), b);
+    } catch (g) {
+      return m.signal.aborted || console.error("Error applying layout:", g), { nodes: w, edges: y };
     } finally {
-      g.current === m && (h(!1), g.current = null);
+      x.current === m && (h(!1), x.current = null);
     }
   }, [
     t,
@@ -286,32 +287,32 @@ function ne({
     n,
     l,
     c,
-    u,
+    d,
     o,
     h,
     a,
     s
-  ]), C = U(async (p) => {
-    g.current && g.current.abort();
-    const f = new AbortController();
-    if (g.current = f, t.length === 0) return { nodes: t, edges: r };
+  ]), E = U(async (f) => {
+    x.current && x.current.abort();
+    const p = new AbortController();
+    if (x.current = p, t.length === 0) return { nodes: t, edges: r };
     try {
-      if (h(!0), f.signal.aborted) return { nodes: t, edges: r };
-      const m = await i(p, t, r, f.signal);
-      return f.signal.aborted ? { nodes: t, edges: r } : (g.current === f && (l ? l(m.nodes) : u != null && u.setNodes && u.setNodes(m.nodes), c ? c(m.edges) : u != null && u.setEdges && u.setEdges(m.edges)), m);
+      if (h(!0), p.signal.aborted) return { nodes: t, edges: r };
+      const m = await i(f, t, r, p.signal);
+      return p.signal.aborted ? { nodes: t, edges: r } : (x.current === p && (l ? l(m.nodes) : d != null && d.setNodes && d.setNodes(m.nodes), c ? c(m.edges) : d != null && d.setEdges && d.setEdges(m.edges)), m);
     } catch (m) {
-      return f.signal.aborted || console.error("Error applying container layout:", m), { nodes: t, edges: r };
+      return p.signal.aborted || console.error("Error applying container layout:", m), { nodes: t, edges: r };
     } finally {
-      g.current === f && (h(!1), g.current = null);
+      x.current === p && (h(!1), x.current = null);
     }
-  }, [t, r, i, l, c, u, h]);
+  }, [t, r, i, l, c, d, h]);
   return {
-    applyLayout: b,
-    applyContainerLayout: C,
+    applyLayout: L,
+    applyContainerLayout: E,
     pendingSpacingUpdateRef: N
   };
 }
-const oe = (t, r, e = "no-parent") => {
+const ie = (t, r, e = "no-parent") => {
   const o = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Map();
   t.forEach((c, h) => {
     const a = r.get(h);
@@ -327,11 +328,11 @@ const oe = (t, r, e = "no-parent") => {
     o.add(c);
     const s = n.get(c);
     s.depth = h;
-    const u = t.get(c) || /* @__PURE__ */ new Set();
-    for (const g of u)
-      if (t.has(g) && r.get(g)) {
-        const b = i(g, h + 1);
-        b && s.children.push(b);
+    const d = t.get(c) || /* @__PURE__ */ new Set();
+    for (const x of d)
+      if (t.has(x) && r.get(x)) {
+        const L = i(x, h + 1);
+        L && s.children.push(L);
       }
     return s;
   }, l = [];
@@ -340,8 +341,8 @@ const oe = (t, r, e = "no-parent") => {
     if (a) {
       const s = a.parentId;
       if (!s || s === e) {
-        const u = i(h, 0);
-        u && l.push(u);
+        const d = i(h, 0);
+        d && l.push(d);
       }
     }
   }), l;
@@ -374,23 +375,23 @@ function z(t, r, e, o = "no-parent") {
 function F(t, r, e, o = "no-parent") {
   const n = tt(t, e, o), i = tt(r, e, o), l = new Set(i);
   let c = null, h = -1;
-  for (let g = 0; g < n.length; g++)
-    if (l.has(n[g])) {
-      c = n[g], h = g;
+  for (let x = 0; x < n.length; x++)
+    if (l.has(n[x])) {
+      c = n[x], h = x;
       break;
     }
   if (!c)
     return { lca: null, sourceChild: null, targetChild: null };
-  const a = i.indexOf(c), s = h > 0 ? n[h - 1] : t, u = a > 0 ? i[a - 1] : r;
-  return { lca: c, sourceChild: s, targetChild: u };
+  const a = i.indexOf(c), s = h > 0 ? n[h - 1] : t, d = a > 0 ? i[a - 1] : r;
+  return { lca: c, sourceChild: s, targetChild: d };
 }
-const ie = (t) => JSON.parse(JSON.stringify(t)), Et = (t, r, e, o, n) => {
-  const i = ie(t);
+const se = (t) => JSON.parse(JSON.stringify(t)), Et = (t, r, e, o, n) => {
+  const i = se(t);
   return i.source = r, i.target = e, i.id = o, i.data = {
     ...i.data,
     ...n
   }, i;
-}, se = (t) => {
+}, ce = (t) => {
   for (const r of t.values()) {
     const e = /* @__PURE__ */ new Map();
     r.forEach((n) => {
@@ -413,7 +414,7 @@ const ie = (t) => JSON.parse(JSON.stringify(t)), Et = (t, r, e, o, n) => {
       }), o.add(i), o.add(l);
     });
   }
-}, ce = (t, r, e, o) => {
+}, ae = (t, r, e, o) => {
   const n = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
   t.forEach((c) => {
     const h = n.get(c.target) || [];
@@ -425,77 +426,77 @@ const ie = (t) => JSON.parse(JSON.stringify(t)), Et = (t, r, e, o, n) => {
   i.forEach((c, h) => {
     const a = n.get(h) || [];
     a.length !== 0 && a.forEach((s) => {
-      c.forEach((u) => {
-        if (s.source === u.target)
+      c.forEach((d) => {
+        if (s.source === d.target)
           return;
-        const { lca: g, sourceChild: N, targetChild: b } = F(
+        const { lca: x, sourceChild: N, targetChild: L } = F(
           s.source,
-          u.target,
+          d.target,
           r,
           o
-        ), C = F(
+        ), E = F(
           s.source,
           h,
           r,
           o
-        ).lca, p = F(
+        ).lca, f = F(
           h,
-          u.target,
+          d.target,
           r,
           o
         ).lca;
-        if (!C || C !== p)
+        if (!E || E !== f)
           return;
-        const f = z(
+        const p = z(
           s.source,
-          C,
+          E,
           r,
           o
         ), m = z(
-          u.target,
-          C,
+          d.target,
+          E,
           r,
           o
-        ), y = z(
+        ), w = z(
           h,
-          C,
+          E,
           r,
           o
         );
-        if (!f || !m || !y || f !== m || f === y)
+        if (!p || !m || !w || p !== m || p === w)
           return;
-        const x = f, w = z(
+        const y = p, g = z(
           s.source,
-          x,
+          y,
           r,
           o
-        ), E = z(
-          u.target,
-          x,
+        ), C = z(
+          d.target,
+          y,
           r,
           o
         );
-        if (!g || !N || !b || !w || !E || w === E)
+        if (!x || !N || !L || !g || !C || g === C)
           return;
-        const L = `synthetic_bridge_${s.id}_${h}_${u.id}_${x}`;
-        if (l.has(L))
+        const b = `synthetic_bridge_${s.id}_${h}_${d.id}_${y}`;
+        if (l.has(b))
           return;
         const M = Et(
           s,
-          w,
-          E,
-          L,
+          g,
+          C,
+          b,
           {
             isTemporary: !0,
             isSyntheticBridge: !0,
             bridgeNode: h,
-            bridgeBranch: y,
-            anchorBranch: f,
+            bridgeBranch: w,
+            anchorBranch: p,
             originalSource: s.source,
-            originalTarget: u.target
+            originalTarget: d.target
           }
         );
-        e.has(x) || e.set(x, []), e.get(x).push(M), l.add(L);
+        e.has(y) || e.set(y, []), e.get(y).push(M), l.add(b);
       });
     });
   });
@@ -524,7 +525,7 @@ function et(t, r, e = "no-parent") {
       o.has(i) || o.set(i, []), o.get(i).push(h);
     }
   }
-  return ce(t, r, o, e), se(o), o;
+  return ae(t, r, o, e), ce(o), o;
 }
 const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
   var c, h;
@@ -551,13 +552,13 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     x: t.position.x + r / 2,
     y: t.position.y + e / 2
   };
-}, ae = (t, r) => {
+}, le = (t, r) => {
   if (t.length === 0)
     return { nodes: t, width: 0, height: 0 };
   let e = Number.POSITIVE_INFINITY, o = Number.POSITIVE_INFINITY, n = Number.NEGATIVE_INFINITY, i = Number.NEGATIVE_INFINITY;
   t.forEach((s) => {
-    const { width: u, height: g } = $(s);
-    e = Math.min(e, s.position.x), o = Math.min(o, s.position.y), n = Math.max(n, s.position.x + u), i = Math.max(i, s.position.y + g);
+    const { width: d, height: x } = $(s);
+    e = Math.min(e, s.position.x), o = Math.min(o, s.position.y), n = Math.max(n, s.position.x + d), i = Math.max(i, s.position.y + x);
   });
   const l = r - e, c = r - o;
   t.forEach((s) => {
@@ -568,7 +569,7 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
   });
   const h = n - e + r * 2, a = i - o + r * 2;
   return { nodes: t, width: h, height: a };
-}, le = (t, r, e, o) => {
+}, he = (t, r, e, o) => {
   if (!(t.length < 2 || o.size === 0))
     if (r === "TB" || r === "BT") {
       const n = [...t].sort((i, l) => i.position.x - l.position.x);
@@ -577,8 +578,8 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
           return;
         let c = i.position.x + $(i).width;
         for (let h = l + 1; h < n.length; h++) {
-          const a = n[h], { width: s } = $(a), u = c + e;
-          a.position.x < u && (a.position.x = u), c = a.position.x + s;
+          const a = n[h], { width: s } = $(a), d = c + e;
+          a.position.x < d && (a.position.x = d), c = a.position.x + s;
         }
       });
     } else {
@@ -588,12 +589,12 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
           return;
         let c = i.position.y + $(i).height;
         for (let h = l + 1; h < n.length; h++) {
-          const a = n[h], { height: s } = $(a), u = c + e;
-          a.position.y < u && (a.position.y = u), c = a.position.y + s;
+          const a = n[h], { height: s } = $(a), d = c + e;
+          a.position.y < d && (a.position.y = d), c = a.position.y + s;
         }
       });
     }
-}, he = (t, r, e, o) => {
+}, de = (t, r, e, o) => {
   const n = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
   r.forEach((c) => {
     const h = n.get(c.target) || [];
@@ -605,88 +606,88 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
   return i.forEach((c, h) => {
     const a = n.get(h) || [];
     a.length !== 0 && a.forEach((s) => {
-      c.forEach((u) => {
-        if (s.source === u.target)
+      c.forEach((d) => {
+        if (s.source === d.target)
           return;
-        const g = F(
+        const x = F(
           s.source,
           h,
           e,
           o
         ).lca, N = F(
           h,
-          u.target,
+          d.target,
           e,
           o
         ).lca;
-        if (g !== t || N !== t)
+        if (x !== t || N !== t)
           return;
-        const b = z(
+        const L = z(
           s.source,
           t,
           e,
           o
-        ), C = z(
-          u.target,
+        ), E = z(
+          d.target,
           t,
           e,
           o
-        ), p = z(
+        ), f = z(
           h,
           t,
           e,
           o
         );
-        if (!b || !C || !p || b !== C || b === p)
+        if (!L || !E || !f || L !== E || L === f)
           return;
-        const f = z(
+        const p = z(
           s.source,
-          b,
+          L,
           e,
           o
         ), m = z(
-          u.target,
-          b,
+          d.target,
+          L,
           e,
           o
         );
-        if (!f || !m || f === m)
+        if (!p || !m || p === m)
           return;
-        const y = `${b}:${p}:${f}:${m}`;
-        l.set(y, {
-          anchorContainerId: b,
-          bridgeContainerId: p,
-          sourceNodeId: f,
+        const w = `${L}:${f}:${p}:${m}`;
+        l.set(w, {
+          anchorContainerId: L,
+          bridgeContainerId: f,
+          sourceNodeId: p,
           targetNodeId: m
         });
       });
     });
   }), [...l.values()];
 }, ue = (t, r, e, o, n, i, l) => {
-  const c = he(r, n, i, l), h = /* @__PURE__ */ new Set();
+  const c = de(r, n, i, l), h = /* @__PURE__ */ new Set();
   return c.forEach((a) => {
-    const s = gt(t, a.anchorContainerId), u = gt(t, a.bridgeContainerId);
-    if (!s || !u)
+    const s = gt(t, a.anchorContainerId), d = gt(t, a.bridgeContainerId);
+    if (!s || !d)
       return;
-    const g = yt(a.sourceNodeId, r, i), N = yt(a.targetNodeId, r, i);
-    if (!g || !N)
+    const x = yt(a.sourceNodeId, r, i), N = yt(a.targetNodeId, r, i);
+    if (!x || !N)
       return;
-    const { width: b, height: C } = $(u), { width: p, height: f } = $(s), m = xt(s), y = xt(u);
+    const { width: L, height: E } = $(d), { width: f, height: p } = $(s), m = xt(s), w = xt(d);
     if (e === "TB" || e === "BT") {
-      const x = (g.y + N.y) / 2;
-      u.position.y = x - C / 2;
-      const w = y.x >= m.x, E = w ? u.position.x - (s.position.x + p) : s.position.x - (u.position.x + b), L = Math.max(o, E);
-      u.position.x = w ? s.position.x + p + L : s.position.x - b - L;
+      const y = (x.y + N.y) / 2;
+      d.position.y = y - E / 2;
+      const g = w.x >= m.x, C = g ? d.position.x - (s.position.x + f) : s.position.x - (d.position.x + L), b = Math.max(o, C);
+      d.position.x = g ? s.position.x + f + b : s.position.x - L - b;
     } else {
-      const x = (g.x + N.x) / 2;
-      u.position.x = x - b / 2;
-      const w = y.y >= m.y, E = w ? u.position.y - (s.position.y + f) : s.position.y - (u.position.y + C), L = Math.max(o, E);
-      u.position.y = w ? s.position.y + f + L : s.position.y - C - L;
+      const y = (x.x + N.x) / 2;
+      d.position.x = y - L / 2;
+      const g = w.y >= m.y, C = g ? d.position.y - (s.position.y + p) : s.position.y - (d.position.y + E), b = Math.max(o, C);
+      d.position.y = g ? s.position.y + p + b : s.position.y - E - b;
     }
-    h.add(u.id);
+    h.add(d.id);
   }), h;
-}, Nt = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = "no-parent") => {
-  const N = et(n, o, g), { updatedNodes: b } = await j(
+}, Nt = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, d = !1, x = "no-parent") => {
+  const N = et(n, o, x), { updatedNodes: L } = await j(
     t,
     r,
     e,
@@ -698,14 +699,14 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     h,
     a,
     s,
-    u,
+    d,
     N,
-    g
-  ), C = o.get(t);
-  if (!C)
-    return { updatedNodes: b, updatedEdges: n };
-  const { updatedNodes: p } = await Nt(
-    C.parentId || g,
+    x
+  ), E = o.get(t);
+  if (!E)
+    return { updatedNodes: L, updatedEdges: n };
+  const { updatedNodes: f } = await Nt(
+    E.parentId || x,
     r,
     e,
     o,
@@ -716,83 +717,83 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     h,
     a,
     s,
-    u,
-    g
+    d,
+    x
   );
   return {
-    updatedNodes: [...p, ...b],
+    updatedNodes: [...f, ...L],
     updatedEdges: n
     // Always return original edges unchanged
   };
-}, j = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = /* @__PURE__ */ new Map(), N = "no-parent") => {
-  const b = e.get(t);
-  if (!b || b.size === 0)
+}, j = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, d = !1, x = /* @__PURE__ */ new Map(), N = "no-parent") => {
+  const L = e.get(t);
+  if (!L || L.size === 0)
     return { updatedNodes: [] };
-  const C = [];
-  if (b.forEach((L) => {
-    const M = o.get(L);
-    M && C.push(M);
-  }), C.length === 0)
+  const E = [];
+  if (L.forEach((b) => {
+    const M = o.get(b);
+    M && E.push(M);
+  }), E.length === 0)
     return { updatedNodes: [] };
-  let p = r;
-  const f = o.get(t);
-  f && f.data.layoutDirection && (p = f.data.layoutDirection);
-  const m = g.get(t) || [], { nodes: y, edges: x } = await s(
-    C,
+  let f = r;
+  const p = o.get(t);
+  p && p.data.layoutDirection && (f = p.data.layoutDirection);
+  const m = x.get(t) || [], { nodes: w, edges: y } = await s(
+    E,
     m,
     // Only use temporary edges for layout
-    p,
+    f,
     i,
     l,
     c,
     h,
     a,
-    u
+    d
   );
-  y.forEach((L) => {
-    o.set(L.id, L);
+  w.forEach((b) => {
+    o.set(b.id, b);
   });
-  const w = ue(
-    y,
+  const g = ue(
+    w,
     t,
-    p,
+    f,
     l,
     n,
     o,
     N
   );
-  le(
-    y,
-    p,
+  he(
+    w,
+    f,
     l,
-    w
-  ), y.forEach((L) => {
-    o.set(L.id, L);
+    g
+  ), w.forEach((b) => {
+    o.set(b.id, b);
   });
-  const E = ae(y, i);
-  return E.nodes.forEach((L) => {
-    o.set(L.id, L);
-  }), f && E.width && E.height && de(f, E.width, E.height), {
-    updatedNodes: [...E.nodes],
-    udpatedParentNode: f || void 0
+  const C = le(w, i);
+  return C.nodes.forEach((b) => {
+    o.set(b.id, b);
+  }), p && C.width && C.height && fe(p, C.width, C.height), {
+    updatedNodes: [...C.nodes],
+    udpatedParentNode: p || void 0
   };
-}, de = (t, r, e) => (t.style || (t.style = {}), t.width = r, t.height = e, t.measured = {
+}, fe = (t, r, e) => (t.style || (t.style = {}), t.width = r, t.height = e, t.measured = {
   width: r,
   height: e
-}, t.style.width = r, t.style.height = e, t), fe = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, u = !1, g = "no-parent") => {
+}, t.style.width = r, t.style.height = e, t), pe = async (t, r, e, o, n, i = rt, l = 50, c = 50, h = 172, a = 36, s = X, d = !1, x = "no-parent") => {
   let N = [];
-  const b = et(n, o, g), C = /* @__PURE__ */ new Map();
-  let p = 0;
-  const f = (y, x) => {
-    x > p && (p = x);
-    for (const w of y)
-      C.has(x) || C.set(x, []), C.get(x).push(w.id), w.children.length > 0 && f(w.children, x + 1);
+  const L = et(n, o, x), E = /* @__PURE__ */ new Map();
+  let f = 0;
+  const p = (w, y) => {
+    y > f && (f = y);
+    for (const g of w)
+      E.has(y) || E.set(y, []), E.get(y).push(g.id), g.children.length > 0 && p(g.children, y + 1);
   };
-  f(t, 0);
-  for (let y = p; y >= 0; y--) {
-    const x = C.get(y) || [], w = await Promise.all(x.map(
-      (E) => j(
-        E,
+  p(t, 0);
+  for (let w = f; w >= 0; w--) {
+    const y = E.get(w) || [], g = await Promise.all(y.map(
+      (C) => j(
+        C,
         r,
         e,
         o,
@@ -804,17 +805,17 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
         h,
         a,
         s,
-        u,
-        b,
+        d,
+        L,
         // Pass the global temporary edges map
-        g
+        x
       )
     ));
-    for (const { updatedNodes: E } of w)
-      N = [...E, ...N];
+    for (const { updatedNodes: C } of g)
+      N = [...C, ...N];
   }
   const { updatedNodes: m } = await j(
-    g,
+    x,
     r,
     e,
     o,
@@ -826,17 +827,17 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     h,
     a,
     s,
-    u,
-    b,
+    d,
+    L,
     // Process root-level temporary edges
-    g
+    x
   );
   return N = [...m, ...N], {
     updatedNodes: N,
     updatedEdges: n
     // Always return original edges unchanged
   };
-}, pe = (t, r, e, o = "no-parent") => {
+}, ge = (t, r, e, o = "no-parent") => {
   const n = t.map((a) => a.id), i = t.map((a) => {
     var s;
     return ((s = e.get(a.id)) == null ? void 0 : s.parentId) || a.parentId;
@@ -847,7 +848,7 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     return s ? !s.parentId || !c.includes(s.parentId) : !0;
   });
   return h.length === 0 ? [o] : h;
-}, ge = async (t, r, e) => {
+}, ye = async (t, r, e) => {
   const {
     dagreDirection: o,
     nodeParentIdMapWithChildIdSet: n,
@@ -857,24 +858,24 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     margin: h,
     nodeSpacing: a,
     layerSpacing: s,
-    nodeWidth: u,
-    nodeHeight: g,
+    nodeWidth: d,
+    nodeHeight: x,
     layoutHidden: N = !1,
-    noParentKey: b = "no-parent"
-  } = r, C = pe(
+    noParentKey: L = "no-parent"
+  } = r, E = ge(
     t,
     n,
     i,
-    b
+    L
   );
-  if (C.length === 0)
+  if (E.length === 0)
     return { nodes: l, edges: c };
-  const p = /* @__PURE__ */ new Map(), f = /* @__PURE__ */ new Map();
+  const f = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Map();
   if (e != null && e.aborted)
     return { nodes: l, edges: c };
   (await Promise.all(
-    C.map(async (w) => e != null && e.aborted ? { updatedNodes: [], updatedEdges: [] } : Nt(
-      w,
+    E.map(async (g) => e != null && e.aborted ? { updatedNodes: [], updatedEdges: [] } : Nt(
+      g,
       o,
       n,
       i,
@@ -882,74 +883,74 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
       h,
       a,
       s,
-      u,
-      g,
+      d,
+      x,
       void 0,
       N
     ))
-  )).forEach(({ updatedNodes: w, updatedEdges: E }) => {
-    w.forEach((L) => {
-      p.set(L.id, L);
-    }), E.forEach((L) => {
-      f.set(L.id, L);
+  )).forEach(({ updatedNodes: g, updatedEdges: C }) => {
+    g.forEach((b) => {
+      f.set(b.id, b);
+    }), C.forEach((b) => {
+      p.set(b.id, b);
     });
   });
-  const y = l.map(
-    (w) => p.has(w.id) ? p.get(w.id) : w
-  ), x = c.map(
-    (w) => f.has(w.id) ? f.get(w.id) : w
+  const w = l.map(
+    (g) => f.has(g.id) ? f.get(g.id) : g
+  ), y = c.map(
+    (g) => p.has(g.id) ? p.get(g.id) : g
   );
-  return { nodes: y, edges: x };
-}, ye = (t, r, e, o, n, i, l, c, h = 172, a = 36, s = !1, u = "no-parent") => {
-  const g = U(async (b, C, p, f) => {
+  return { nodes: w, edges: y };
+}, xe = (t, r, e, o, n, i, l, c, h = 172, a = 36, s = !1, d = "no-parent") => {
+  const x = U(async (L, E, f, p) => {
     if (!(t[e] || t.dagre))
-      return console.error(`Layout engine "${e}" not found`), { nodes: b, edges: C };
-    const y = s ? b : b.filter((k) => !k.hidden), x = new Set(y.map((k) => k.id)), w = s ? C : C.filter(
-      (k) => x.has(k.source) && x.has(k.target)
-    ), E = ft(r), L = o.padding.horizontal;
+      return console.error(`Layout engine "${e}" not found`), { nodes: L, edges: E };
+    const w = s ? L : L.filter((k) => !k.hidden), y = new Set(w.map((k) => k.id)), g = s ? E : E.filter(
+      (k) => y.has(k.source) && y.has(k.target)
+    ), C = ft(r), b = o.padding.horizontal;
     let M = [], G = [];
-    if (p && p.length > 0) {
-      const k = s ? p : p.filter((S) => !S.hidden), v = await ge(
+    if (f && f.length > 0) {
+      const k = s ? f : f.filter((S) => !S.hidden), v = await ye(
         k,
         {
-          dagreDirection: E,
+          dagreDirection: C,
           nodeParentIdMapWithChildIdSet: n,
           nodeIdWithNode: i,
-          nodes: y,
-          edges: w,
-          margin: L,
+          nodes: w,
+          edges: g,
+          margin: b,
           nodeSpacing: l,
           layerSpacing: c,
           nodeWidth: h,
           nodeHeight: a,
           layoutHidden: s,
-          noParentKey: u
+          noParentKey: d
         },
-        f
+        p
       );
       M = v.nodes, G = v.edges;
     } else {
-      if (f != null && f.aborted)
-        return { nodes: b, edges: C };
-      const k = oe(n, i, u), v = await fe(
+      if (p != null && p.aborted)
+        return { nodes: L, edges: E };
+      const k = ie(n, i, d), v = await pe(
         k,
-        E,
+        C,
         n,
         i,
-        w,
-        L,
+        g,
+        b,
         l,
         c,
         h,
         a,
         void 0,
         s,
-        u
+        d
       );
       M = v.updatedNodes, G = v.updatedEdges;
     }
     return {
-      nodes: b.map((k) => !s && k.hidden ? k : M.find((S) => S.id === k.id) || k),
+      nodes: L.map((k) => !s && k.hidden ? k : M.find((S) => S.id === k.id) || k),
       edges: G
     };
   }, [
@@ -964,37 +965,37 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     h,
     a,
     s,
-    u
-  ]), N = U(async (b, C, p, f) => {
-    if (f != null && f.aborted) return { nodes: C, edges: p };
-    const m = ft(r), y = o.padding.horizontal, x = s ? C : C.filter((v) => !v.hidden), w = new Set(x.map((v) => v.id)), E = s ? p : p.filter((v) => w.has(v.source) && w.has(v.target)), L = et(E, i, u), M = (v) => {
+    d
+  ]), N = U(async (L, E, f, p) => {
+    if (p != null && p.aborted) return { nodes: E, edges: f };
+    const m = ft(r), w = o.padding.horizontal, y = s ? E : E.filter((v) => !v.hidden), g = new Set(y.map((v) => v.id)), C = s ? f : f.filter((v) => g.has(v.source) && g.has(v.target)), b = et(C, i, d), M = (v) => {
       const S = [], R = n.get(v);
       if (R)
         for (const _ of R)
           n.has(_) && S.push(...M(_));
       return S.push(v), S;
-    }, G = M(b), O = /* @__PURE__ */ new Map();
+    }, G = M(L), O = /* @__PURE__ */ new Map();
     for (const v of G) {
-      if (f != null && f.aborted) return { nodes: C, edges: p };
+      if (p != null && p.aborted) return { nodes: E, edges: f };
       const { updatedNodes: S, udpatedParentNode: R } = await j(
         v,
         m,
         n,
         i,
-        E,
-        y,
+        C,
+        w,
         l,
         c,
         h,
         a,
         void 0,
         s,
-        L,
-        u
+        b,
+        d
       );
       S.forEach((_) => O.set(_.id, _)), R && O.set(R.id, { ...R });
     }
-    return { nodes: C.map((v) => O.get(v.id) ?? v), edges: p };
+    return { nodes: E.map((v) => O.get(v.id) ?? v), edges: f };
   }, [
     r,
     o.padding.horizontal,
@@ -1005,11 +1006,11 @@ const rt = 10, gt = (t, r) => t.find((e) => e.id === r), yt = (t, r, e) => {
     h,
     a,
     s,
-    u
+    d
   ]);
-  return { calculateLayout: g, calculateContainerLayout: N };
+  return { calculateLayout: x, calculateContainerLayout: N };
 };
-function Ce({
+function Le({
   children: t,
   initialDirection: r = "DOWN",
   initialAlgorithm: e = "layered",
@@ -1021,19 +1022,19 @@ function Ce({
   includeHidden: h = !1,
   layoutEngines: a,
   updateNodes: s,
-  updateEdges: u,
-  nodeParentIdMapWithChildIdSet: g,
+  updateEdges: d,
+  nodeParentIdMapWithChildIdSet: x,
   nodeIdWithNode: N,
-  noParentKey: b = "no-parent",
-  disableAutoLayoutEffect: C = !1
+  noParentKey: L = "no-parent",
+  disableAutoLayoutEffect: E = !1
 }) {
-  const p = Yt(), f = It(), {
+  const f = Yt(), p = Pt(), {
     direction: m,
-    algorithm: y,
-    autoLayout: x,
-    layoutInProgress: w,
-    layoutHidden: E,
-    layoutEngines: L,
+    algorithm: w,
+    autoLayout: y,
+    layoutInProgress: g,
+    layoutHidden: C,
+    layoutEngines: b,
     layoutEngineOptions: M,
     padding: G,
     nodeSpacing: O,
@@ -1045,7 +1046,7 @@ function Ce({
     setDirection: J,
     setAlgorithm: Z,
     setAutoLayout: q,
-    setLayoutInProgress: I,
+    setLayoutInProgress: Y,
     setLayoutHidden: Q,
     setLayoutEngines: nt,
     setLayoutEngineOptions: vt,
@@ -1056,7 +1057,7 @@ function Ce({
     setNodeHeight: Bt,
     setParentResizingOptionsState: st,
     setSelectedNodes: ct
-  } = ee({
+  } = re({
     initialDirection: r,
     initialAlgorithm: e,
     initialAutoLayout: o,
@@ -1072,22 +1073,23 @@ function Ce({
     numberOfNodes: Mt,
     nodesLength: St,
     childrenInitialized: lt,
-    parentChildStructure: Dt
-  } = re({
-    nodes: p,
+    nodesInitialized: Dt,
+    parentChildStructure: Rt
+  } = ne({
+    nodes: f,
     externalNodeIdWithNode: N,
-    externalNodeParentIdMapWithChildIdSet: g,
-    noParentKey: b
-  }), Rt = U(({ nodes: H }) => {
+    externalNodeParentIdMapWithChildIdSet: x,
+    noParentKey: L
+  }), Ot = U(({ nodes: H }) => {
     ct(H);
   }, [ct]);
-  Pt({
-    onChange: Rt
+  jt({
+    onChange: Ot
   });
-  const { calculateLayout: Ot, calculateContainerLayout: At } = ye(
-    L,
+  const { calculateLayout: At, calculateContainerLayout: zt } = xe(
+    b,
     m,
-    y,
+    w,
     R,
     at,
     W,
@@ -1095,71 +1097,72 @@ function Ce({
     k,
     v,
     S,
-    E,
-    b
-  ), { applyLayout: ht, applyContainerLayout: zt } = ne({
-    nodes: p,
-    edges: f,
+    C,
+    L
+  ), { applyLayout: ht, applyContainerLayout: Gt } = oe({
+    nodes: f,
+    edges: p,
     selectedNodes: _,
-    layoutHidden: E,
-    calculateLayout: Ot,
-    calculateContainerLayout: At,
+    layoutHidden: C,
+    calculateLayout: At,
+    calculateContainerLayout: zt,
     updateNodes: s,
-    updateEdges: u,
-    setLayoutInProgress: I,
+    updateEdges: d,
+    setLayoutInProgress: Y,
     setNodeSpacing: ot,
     setLayerSpacing: it
-  }), Gt = U((H, K) => {
-    nt(($t) => ({ ...$t, [H]: K }));
-  }, [nt]), _t = U((H) => {
+  }), _t = U((H, K) => {
+    nt((Ut) => ({ ...Ut, [H]: K }));
+  }, [nt]), Ht = U((H) => {
     st((K) => ({
       ...K,
       ...H,
-      enabled: x
+      enabled: y
     }));
-  }, [x, st]);
+  }, [y, st]);
   V(() => {
     var H;
-    C || W.has((H = p[p.length - 1]) == null ? void 0 : H.id) && lt && x && ht();
-  }, [lt, x, m, Mt, O, k, Dt, St]);
-  const Ht = {
+    E || W.has((H = f[f.length - 1]) == null ? void 0 : H.id) && lt && y && ht();
+  }, [lt, y, m, Mt, O, k, Rt, St]);
+  const $t = {
     direction: m,
-    algorithm: y,
-    autoLayout: x,
-    layoutInProgress: w,
+    algorithm: w,
+    autoLayout: y,
+    layoutInProgress: g,
+    nodesInitialized: Dt,
     padding: G,
     nodeSpacing: O,
     layerSpacing: k,
     nodeWidth: v,
     nodeHeight: S,
-    layoutHidden: E,
+    layoutHidden: C,
     parentResizingOptions: R,
-    layoutEngines: L,
+    layoutEngines: b,
     layoutEngineOptions: M,
     nodeParentIdMapWithChildIdSet: at,
     nodeIdWithNode: W,
-    noParentKey: b,
+    noParentKey: L,
     updateNodes: s,
-    updateEdges: u,
+    updateEdges: d,
     setDirection: J,
     setAlgorithm: Z,
     setAutoLayout: q,
-    setLayoutInProgress: I,
+    setLayoutInProgress: Y,
     setPadding: Tt,
     setNodeSpacing: ot,
     setLayerSpacing: it,
     setNodeWidth: kt,
     setNodeHeight: Bt,
     setLayoutHidden: Q,
-    setParentResizingOptions: _t,
+    setParentResizingOptions: Ht,
     setLayoutEngineOptions: vt,
     applyLayout: ht,
-    applyContainerLayout: zt,
+    applyContainerLayout: Gt,
     clearLayoutCache: () => {
     },
-    registerLayoutEngine: Gt
+    registerLayoutEngine: _t
   };
-  return /* @__PURE__ */ d(Lt.Provider, { value: Ht, children: t });
+  return /* @__PURE__ */ u(Lt.Provider, { value: $t, children: t });
 }
 const wt = ({
   compact: t = !1
@@ -1168,57 +1171,57 @@ const wt = ({
     direction: r,
     setDirection: e,
     clearLayoutCache: o
-  } = Y(), n = (i) => {
+  } = I(), n = (i) => {
     e(i), o && o();
   };
-  return t ? /* @__PURE__ */ d(
+  return t ? /* @__PURE__ */ u(
     D,
     {
       onClick: () => n(r === "DOWN" ? "RIGHT" : "DOWN"),
       title: `Switch to ${r === "DOWN" ? "horizontal" : "vertical"} layout`,
-      children: /* @__PURE__ */ d("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: r === "DOWN" ? (
+      children: /* @__PURE__ */ u("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: r === "DOWN" ? (
         // Horizontal layout icon
-        /* @__PURE__ */ d("path", { d: "M4 12h16M16 6l6 6-6 6" })
+        /* @__PURE__ */ u("path", { d: "M4 12h16M16 6l6 6-6 6" })
       ) : (
         // Vertical layout icon
-        /* @__PURE__ */ d("path", { d: "M12 4v16M6 16l6 6 6-6" })
+        /* @__PURE__ */ u("path", { d: "M12 4v16M6 16l6 6 6-6" })
       ) })
     }
   ) : /* @__PURE__ */ T(P, { children: [
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ u(
       D,
       {
         onClick: () => n("DOWN"),
         className: r === "DOWN" ? "selected" : "",
         title: "Top to Bottom",
-        children: /* @__PURE__ */ d("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ d("path", { d: "M12 4v16M6 16l6 6 6-6" }) })
+        children: /* @__PURE__ */ u("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ u("path", { d: "M12 4v16M6 16l6 6 6-6" }) })
       }
     ),
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ u(
       D,
       {
         onClick: () => n("RIGHT"),
         className: r === "RIGHT" ? "selected" : "",
         title: "Left to Right",
-        children: /* @__PURE__ */ d("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ d("path", { d: "M4 12h16M16 6l6 6-6 6" }) })
+        children: /* @__PURE__ */ u("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ u("path", { d: "M4 12h16M16 6l6 6-6 6" }) })
       }
     ),
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ u(
       D,
       {
         onClick: () => n("LEFT"),
         className: r === "LEFT" ? "selected" : "",
         title: "Right to Left",
-        children: /* @__PURE__ */ d("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ d("path", { d: "M20 12H4M8 6L2 12l6 6" }) })
+        children: /* @__PURE__ */ u("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ u("path", { d: "M20 12H4M8 6L2 12l6 6" }) })
       }
     ),
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ u(
       D,
       {
         onClick: () => n("UP"),
         className: r === "UP" ? "selected" : "",
         title: "Bottom to Top",
-        children: /* @__PURE__ */ d("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ d("path", { d: "M12 20V4M6 8l6-6 6 6" }) })
+        children: /* @__PURE__ */ u("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: /* @__PURE__ */ u("path", { d: "M12 20V4M6 8l6-6 6 6" }) })
       }
     )
   ] });
@@ -1231,23 +1234,23 @@ const wt = ({
     setNodeSpacing: o,
     setLayerSpacing: n,
     clearLayoutCache: i
-  } = Y(), [l, c] = B(!1), h = (s) => {
+  } = I(), [l, c] = B(!1), h = (s) => {
     o(s), i && i();
   }, a = (s) => {
     n(s), i && i();
   };
   return t ? /* @__PURE__ */ T("div", { style: { position: "relative" }, children: [
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ u(
       D,
       {
         onClick: () => c(!l),
         title: "Adjust node and layer spacing",
         children: /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: [
-          /* @__PURE__ */ d("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
-          /* @__PURE__ */ d("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1" }),
-          /* @__PURE__ */ d("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1" }),
-          /* @__PURE__ */ d("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1" }),
-          /* @__PURE__ */ d("path", { d: "M7 10v4M17 10v4M10 7h4M10 17h4" })
+          /* @__PURE__ */ u("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
+          /* @__PURE__ */ u("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1" }),
+          /* @__PURE__ */ u("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1" }),
+          /* @__PURE__ */ u("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1" }),
+          /* @__PURE__ */ u("path", { d: "M7 10v4M17 10v4M10 7h4M10 17h4" })
         ] })
       }
     ),
@@ -1275,7 +1278,7 @@ const wt = ({
               r,
               "px"
             ] }),
-            /* @__PURE__ */ d("div", { style: { display: "flex", gap: "4px" }, children: [50, 100, 150, 200].map((s) => /* @__PURE__ */ d(
+            /* @__PURE__ */ u("div", { style: { display: "flex", gap: "4px" }, children: [50, 100, 150, 200].map((s) => /* @__PURE__ */ u(
               "button",
               {
                 onClick: () => h(s),
@@ -1298,7 +1301,7 @@ const wt = ({
               e,
               "px"
             ] }),
-            /* @__PURE__ */ d("div", { style: { display: "flex", gap: "4px" }, children: [50, 100, 150, 200].map((s) => /* @__PURE__ */ d(
+            /* @__PURE__ */ u("div", { style: { display: "flex", gap: "4px" }, children: [50, 100, 150, 200].map((s) => /* @__PURE__ */ u(
               "button",
               {
                 onClick: () => a(s),
@@ -1315,7 +1318,7 @@ const wt = ({
               s
             )) })
           ] }),
-          /* @__PURE__ */ d("div", { style: { marginTop: "12px", textAlign: "right" }, children: /* @__PURE__ */ d(
+          /* @__PURE__ */ u("div", { style: { marginTop: "12px", textAlign: "right" }, children: /* @__PURE__ */ u(
             "button",
             {
               onClick: () => c(!1),
@@ -1340,16 +1343,16 @@ const wt = ({
         title: "Decrease node spacing",
         children: [
           /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: [
-            /* @__PURE__ */ d("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("line", { x1: "7", y1: "10", x2: "7", y2: "14" }),
-            /* @__PURE__ */ d("line", { x1: "17", y1: "10", x2: "17", y2: "14" }),
-            /* @__PURE__ */ d("line", { x1: "10", y1: "7", x2: "14", y2: "7" }),
-            /* @__PURE__ */ d("line", { x1: "10", y1: "17", x2: "14", y2: "17" })
+            /* @__PURE__ */ u("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("line", { x1: "7", y1: "10", x2: "7", y2: "14" }),
+            /* @__PURE__ */ u("line", { x1: "17", y1: "10", x2: "17", y2: "14" }),
+            /* @__PURE__ */ u("line", { x1: "10", y1: "7", x2: "14", y2: "7" }),
+            /* @__PURE__ */ u("line", { x1: "10", y1: "17", x2: "14", y2: "17" })
           ] }),
-          /* @__PURE__ */ d("span", { style: { marginLeft: "4px" }, children: "-" })
+          /* @__PURE__ */ u("span", { style: { marginLeft: "4px" }, children: "-" })
         ]
       }
     ),
@@ -1373,20 +1376,20 @@ const wt = ({
         title: "Increase node spacing",
         children: [
           /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: [
-            /* @__PURE__ */ d("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1" }),
-            /* @__PURE__ */ d("line", { x1: "7", y1: "10", x2: "7", y2: "14" }),
-            /* @__PURE__ */ d("line", { x1: "17", y1: "10", x2: "17", y2: "14" }),
-            /* @__PURE__ */ d("line", { x1: "10", y1: "7", x2: "14", y2: "7" }),
-            /* @__PURE__ */ d("line", { x1: "10", y1: "17", x2: "14", y2: "17" })
+            /* @__PURE__ */ u("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1" }),
+            /* @__PURE__ */ u("line", { x1: "7", y1: "10", x2: "7", y2: "14" }),
+            /* @__PURE__ */ u("line", { x1: "17", y1: "10", x2: "17", y2: "14" }),
+            /* @__PURE__ */ u("line", { x1: "10", y1: "7", x2: "14", y2: "7" }),
+            /* @__PURE__ */ u("line", { x1: "10", y1: "17", x2: "14", y2: "17" })
           ] }),
-          /* @__PURE__ */ d("span", { style: { marginLeft: "4px" }, children: "+" })
+          /* @__PURE__ */ u("span", { style: { marginLeft: "4px" }, children: "+" })
         ]
       }
     ),
-    /* @__PURE__ */ d("div", { style: { display: "inline-block", width: "1px", height: "24px", background: "#ddd", margin: "0 10px" } }),
+    /* @__PURE__ */ u("div", { style: { display: "inline-block", width: "1px", height: "24px", background: "#ddd", margin: "0 10px" } }),
     /* @__PURE__ */ T(
       D,
       {
@@ -1394,11 +1397,11 @@ const wt = ({
         title: "Decrease layer spacing",
         children: [
           /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: [
-            /* @__PURE__ */ d("line", { x1: "4", y1: "6", x2: "20", y2: "6" }),
-            /* @__PURE__ */ d("line", { x1: "4", y1: "12", x2: "20", y2: "12" }),
-            /* @__PURE__ */ d("line", { x1: "4", y1: "18", x2: "20", y2: "18" })
+            /* @__PURE__ */ u("line", { x1: "4", y1: "6", x2: "20", y2: "6" }),
+            /* @__PURE__ */ u("line", { x1: "4", y1: "12", x2: "20", y2: "12" }),
+            /* @__PURE__ */ u("line", { x1: "4", y1: "18", x2: "20", y2: "18" })
           ] }),
-          /* @__PURE__ */ d("span", { style: { marginLeft: "4px" }, children: "-" })
+          /* @__PURE__ */ u("span", { style: { marginLeft: "4px" }, children: "-" })
         ]
       }
     ),
@@ -1422,11 +1425,11 @@ const wt = ({
         title: "Increase layer spacing",
         children: [
           /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "2", fill: "none", children: [
-            /* @__PURE__ */ d("line", { x1: "4", y1: "6", x2: "20", y2: "6" }),
-            /* @__PURE__ */ d("line", { x1: "4", y1: "12", x2: "20", y2: "12" }),
-            /* @__PURE__ */ d("line", { x1: "4", y1: "18", x2: "20", y2: "18" })
+            /* @__PURE__ */ u("line", { x1: "4", y1: "6", x2: "20", y2: "6" }),
+            /* @__PURE__ */ u("line", { x1: "4", y1: "12", x2: "20", y2: "12" }),
+            /* @__PURE__ */ u("line", { x1: "4", y1: "18", x2: "20", y2: "18" })
           ] }),
-          /* @__PURE__ */ d("span", { style: { marginLeft: "4px" }, children: "+" })
+          /* @__PURE__ */ u("span", { style: { marginLeft: "4px" }, children: "+" })
         ]
       }
     )
@@ -1437,8 +1440,8 @@ const wt = ({
   const {
     autoLayout: r,
     setAutoLayout: e
-  } = Y();
-  return /* @__PURE__ */ d(
+  } = I();
+  return /* @__PURE__ */ u(
     D,
     {
       onClick: () => {
@@ -1448,12 +1451,12 @@ const wt = ({
       title: r ? "Disable automatic layout" : "Enable automatic layout",
       style: { color: r ? "green" : "inherit" },
       children: t ? /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "1.5", fill: "none", children: [
-        /* @__PURE__ */ d("rect", { x: "4", y: "4", width: "4", height: "4", rx: "1" }),
-        /* @__PURE__ */ d("rect", { x: "4", y: "16", width: "4", height: "4", rx: "1" }),
-        /* @__PURE__ */ d("rect", { x: "16", y: "10", width: "4", height: "4", rx: "1" }),
+        /* @__PURE__ */ u("rect", { x: "4", y: "4", width: "4", height: "4", rx: "1" }),
+        /* @__PURE__ */ u("rect", { x: "4", y: "16", width: "4", height: "4", rx: "1" }),
+        /* @__PURE__ */ u("rect", { x: "16", y: "10", width: "4", height: "4", rx: "1" }),
         /* @__PURE__ */ T(P, { children: [
-          /* @__PURE__ */ d("path", { d: "M8 6c6 0 3 8 8 6" }),
-          /* @__PURE__ */ d("path", { d: "M8 18c3-3 2-8 6-6" })
+          /* @__PURE__ */ u("path", { d: "M8 6c6 0 3 8 8 6" }),
+          /* @__PURE__ */ u("path", { d: "M8 18c3-3 2-8 6-6" })
         ] })
       ] }) : /* @__PURE__ */ T(P, { children: [
         "Auto-Layout ",
@@ -1468,7 +1471,7 @@ const wt = ({
     layoutInProgress: r,
     setLayoutInProgress: e,
     applyLayout: o
-  } = Y();
+  } = I();
   return /* @__PURE__ */ T(
     D,
     {
@@ -1485,19 +1488,19 @@ const wt = ({
       style: { color: r ? "#999" : "#000" },
       children: [
         /* @__PURE__ */ T("svg", { viewBox: "0 0 24 24", width: "16", height: "16", stroke: "currentColor", strokeWidth: "1.5", fill: "none", children: [
-          /* @__PURE__ */ d("rect", { x: "3", y: "3", width: "5", height: "5", rx: "1" }),
-          /* @__PURE__ */ d("rect", { x: "16", y: "3", width: "5", height: "5", rx: "1" }),
-          /* @__PURE__ */ d("rect", { x: "3", y: "16", width: "5", height: "5", rx: "1" }),
-          /* @__PURE__ */ d("rect", { x: "16", y: "16", width: "5", height: "5", rx: "1" }),
-          /* @__PURE__ */ d("path", { d: "M8 5.5h8M5.5 8v8M18.5 8v8M8 18.5h8" }),
-          /* @__PURE__ */ d("circle", { cx: "12", cy: "12", r: "3" }),
-          /* @__PURE__ */ d("path", { d: "M11 10.5v3l2-1.5z", fill: "currentColor" })
+          /* @__PURE__ */ u("rect", { x: "3", y: "3", width: "5", height: "5", rx: "1" }),
+          /* @__PURE__ */ u("rect", { x: "16", y: "3", width: "5", height: "5", rx: "1" }),
+          /* @__PURE__ */ u("rect", { x: "3", y: "16", width: "5", height: "5", rx: "1" }),
+          /* @__PURE__ */ u("rect", { x: "16", y: "16", width: "5", height: "5", rx: "1" }),
+          /* @__PURE__ */ u("path", { d: "M8 5.5h8M5.5 8v8M18.5 8v8M8 18.5h8" }),
+          /* @__PURE__ */ u("circle", { cx: "12", cy: "12", r: "3" }),
+          /* @__PURE__ */ u("path", { d: "M11 10.5v3l2-1.5z", fill: "currentColor" })
         ] }),
-        !t && /* @__PURE__ */ d("span", { style: { marginLeft: "4px" }, children: "Apply Layout" })
+        !t && /* @__PURE__ */ u("span", { style: { marginLeft: "4px" }, children: "Apply Layout" })
       ]
     }
   );
-}, Le = ({
+}, Ee = ({
   showDirectionControls: t = !0,
   showSpacingControls: r = !0,
   showAutoLayoutToggle: e = !0,
@@ -1506,54 +1509,54 @@ const wt = ({
   standalone: n = !1,
   position: i = "top-right"
 }) => {
-  const l = Y(), {
+  const l = I(), {
     autoLayout: c
   } = l;
-  return n ? /* @__PURE__ */ T(jt, { position: i, showZoom: !1, showFitView: !1, showInteractive: !1, children: [
-    o && !c && /* @__PURE__ */ d(
+  return n ? /* @__PURE__ */ T(Xt, { position: i, showZoom: !1, showFitView: !1, showInteractive: !1, children: [
+    o && !c && /* @__PURE__ */ u(
       Ct,
       {
         compact: !0
       }
     ),
-    t && /* @__PURE__ */ d(
+    t && /* @__PURE__ */ u(
       wt,
       {
         compact: !0
       }
     ),
-    r && /* @__PURE__ */ d(
+    r && /* @__PURE__ */ u(
       mt,
       {
         compact: !0
       }
     ),
-    e && /* @__PURE__ */ d(
+    e && /* @__PURE__ */ u(
       bt,
       {
         compact: !0
       }
     )
   ] }) : /* @__PURE__ */ T(P, { children: [
-    o && !c && /* @__PURE__ */ d(
+    o && !c && /* @__PURE__ */ u(
       Ct,
       {
         compact: !0
       }
     ),
-    t && /* @__PURE__ */ d(
+    t && /* @__PURE__ */ u(
       wt,
       {
         compact: !0
       }
     ),
-    r && /* @__PURE__ */ d(
+    r && /* @__PURE__ */ u(
       mt,
       {
         compact: !0
       }
     ),
-    e && /* @__PURE__ */ d(
+    e && /* @__PURE__ */ u(
       bt,
       {
         compact: !0
@@ -1563,11 +1566,11 @@ const wt = ({
 };
 export {
   bt as AutoLayoutToggle,
-  Kt as DagreEngine,
+  te as DagreEngine,
   wt as DirectionControls,
-  Le as LayoutControls,
-  Ce as LayoutProvider,
+  Ee as LayoutControls,
+  Le as LayoutProvider,
   mt as SpacingControls,
-  te as engines,
-  Y as useLayoutContext
+  ee as engines,
+  I as useLayoutContext
 };