dishui 0.0.47 → 0.0.49

package/dist/components/pro/Flow/FlowCanvas.js

@@ -1,405 +1,407 @@
-import { useFlowContext as Ve } from "./context/FlowContext.js";
-import { useFlowUI as Be } from "./context/FlowUIContext.js";
-import { usePixiApp as Ke } from "./hooks/usePixiApp.js";
-import { useViewport as je } from "./hooks/useViewport.js";
-import { GridRenderer as Ue } from "./canvas/GridRenderer.js";
-import { SelectionOverlay as $e } from "./canvas/SelectionOverlay.js";
-import { shapeDrawers as Pe } from "./nodes/shapes.js";
-import { findClosestHandleWorld as Dt, getHandlePositions as gt, handleWorldPos as Ot } from "./nodes/NodeHandles.js";
-import { distToSegment as me, generateId as Je, isPointInNode as Ht, rectsOverlap as Qe } from "./nodes/nodeUtils.js";
-import { NodeRenderer as tn } from "./nodes/NodeRenderer.js";
-import { buildEdgePath as _e, linearizeSegments as Ze, resolveEdgeEndpoints as Mt } from "./edges/edgePaths.js";
-import { EdgeRenderer as en } from "./edges/EdgeRenderer.js";
-import { LineRenderer as nn } from "./lines/LineRenderer.js";
-import { FreehandTool as rn } from "./lines/FreehandTool.js";
-import { GeometricLineTool as on } from "./lines/GeometricLineTool.js";
-import { computeAlignmentSnap as ee } from "./hooks/useAlignmentGuides.js";
-import { AlignmentGuidesRenderer as sn } from "./canvas/AlignmentGuides.js";
-import { getDocumentSlides as cn, nextAnimIndex as dn } from "./nodes/animAnchors.js";
-import { useCallback as ne, useEffect as wt, useRef as b, useState as Ge } from "react";
-import { jsx as We, jsxs as an } from "react/jsx-runtime";
-import { Graphics as Vt } from "pixi.js";
-var ln = {
+import { useFlowContext as Be } from "./context/FlowContext.js";
+import { useFlowUI as Ke } from "./context/FlowUIContext.js";
+import { usePixiApp as je } from "./hooks/usePixiApp.js";
+import { useViewport as Ue } from "./hooks/useViewport.js";
+import { GridRenderer as $e } from "./canvas/GridRenderer.js";
+import { SelectionOverlay as Je } from "./canvas/SelectionOverlay.js";
+import { shapeDrawers as Ge } from "./nodes/shapes.js";
+import { findClosestHandleWorld as Et, getHandlePositions as gt, handleWorldPos as Zt } from "./nodes/NodeHandles.js";
+import { distToSegment as me, generateId as Qe, isPointInNode as Dt, rectsOverlap as tn } from "./nodes/nodeUtils.js";
+import { NodeRenderer as en } from "./nodes/NodeRenderer.js";
+import { buildEdgePath as Ze, linearizeSegments as qe, resolveEdgeEndpoints as Mt } from "./edges/edgePaths.js";
+import { EdgeRenderer as nn } from "./edges/EdgeRenderer.js";
+import { LineRenderer as rn } from "./lines/LineRenderer.js";
+import { FreehandTool as on } from "./lines/FreehandTool.js";
+import { GeometricLineTool as sn } from "./lines/GeometricLineTool.js";
+import { computeAlignmentSnap as ne } from "./hooks/useAlignmentGuides.js";
+import { AlignmentGuidesRenderer as cn } from "./canvas/AlignmentGuides.js";
+import { getDocumentSlides as dn, nextAnimIndex as an } from "./nodes/animAnchors.js";
+import { useCallback as qt, useEffect as wt, useRef as b, useState as We } from "react";
+import { jsx as Le, jsxs as ln } from "react/jsx-runtime";
+import { Graphics as Ot } from "pixi.js";
+var un = {
   nw: "nwse-resize",
   ne: "nesw-resize",
   se: "nwse-resize",
   sw: "nesw-resize"
 };
-function Le(_, E, X) {
-  const { x: O, y: D } = E.position, T = E.width, k = E.height, N = [
+function Ae(F, E, G) {
+  const { x: Z, y: D } = E.position, W = E.width, k = E.height, z = [
     [
       "nw",
-      O,
+      Z,
       D
     ],
     [
       "ne",
-      O + T,
+      Z + W,
       D
     ],
     [
       "se",
-      O + T,
+      Z + W,
       D + k
     ],
     [
       "sw",
-      O,
+      Z,
       D + k
     ]
   ];
-  let M = null, F = X;
-  for (const [j, tt, ct] of N) {
-    const U = Math.hypot(_.x - tt, _.y - ct);
-    U < F && (F = U, M = j);
+  let M = null, _ = G;
+  for (const [U, it, tt] of z) {
+    const K = Math.hypot(F.x - it, F.y - tt);
+    K < _ && (_ = K, M = U);
   }
   return M;
 }
-function Ae(_, E, X, O, D) {
-  let T = null, k = D;
-  for (const N of X) {
-    const M = Mt(N, O);
+function Ye(F, E, G, Z, D) {
+  let W = null, k = D;
+  for (const z of G) {
+    const M = Mt(z, Z);
     if (!M) continue;
-    const F = Math.hypot(_ - M.sx, E - M.sy);
-    F < k && (k = F, T = {
-      edgeId: N.id,
+    const _ = Math.hypot(F - M.sx, E - M.sy);
+    _ < k && (k = _, W = {
+      edgeId: z.id,
       end: "source",
       worldX: M.sx,
       worldY: M.sy
     });
-    const j = Math.hypot(_ - M.tx, E - M.ty);
-    j < k && (k = j, T = {
-      edgeId: N.id,
+    const U = Math.hypot(F - M.tx, E - M.ty);
+    U < k && (k = U, W = {
+      edgeId: z.id,
       end: "target",
       worldX: M.tx,
       worldY: M.ty
     });
   }
-  return T;
+  return W;
 }
-function Ye(_, E, X, O) {
-  let D = null, T = O;
-  for (const k of X) {
-    const N = k.data.waypoints;
-    if (N)
-      for (let M = 0; M < N.length; M++) {
-        const F = Math.hypot(_ - N[M].x, E - N[M].y);
-        F < T && (T = F, D = {
+function Xe(F, E, G, Z) {
+  let D = null, W = Z;
+  for (const k of G) {
+    const z = k.data.waypoints;
+    if (z)
+      for (let M = 0; M < z.length; M++) {
+        const _ = Math.hypot(F - z[M].x, E - z[M].y);
+        _ < W && (W = _, D = {
           edgeId: k.id,
           waypointIndex: M,
-          wx: N[M].x,
-          wy: N[M].y
+          wx: z[M].x,
+          wy: z[M].y
         });
       }
   }
   return D;
 }
-function Xe(_, E, X, O, D) {
-  let T = null, k = D;
-  for (const N of X) {
-    if (N.type !== "simplebezier") continue;
-    const M = Mt(N, O);
+function Fe(F, E, G, Z, D) {
+  let W = null, k = D;
+  for (const z of G) {
+    if (z.type !== "simplebezier") continue;
+    const M = Mt(z, Z);
     if (!M) continue;
-    const F = N.data.waypoints ?? [], j = [
+    const _ = z.data.waypoints ?? [], U = [
       {
         x: M.sx,
         y: M.sy
       },
-      ...F,
+      ..._,
       {
         x: M.tx,
         y: M.ty
       }
-    ], tt = N.data.bezierControls, ct = j.length - 2;
-    for (let U = 0; U <= ct; U++) {
-      const et = j[U], nt = j[U + 1], Tt = tt?.[U], re = Math.hypot(nt.x - et.x, nt.y - et.y), mt = Math.max(30, re * 0.3), Pt = Tt?.c1x ?? (U === 0 ? et.x + M.snx * mt : et.x + (nt.x - et.x) * 0.4), Rt = Tt?.c1y ?? (U === 0 ? et.y + M.sny * mt : et.y), It = Tt?.c2x ?? (U === ct ? nt.x + M.tnx * mt : nt.x - (nt.x - et.x) * 0.4), yt = Tt?.c2y ?? (U === ct ? nt.y + M.tny * mt : nt.y), St = Math.hypot(_ - Pt, E - Rt);
-      St < k && (k = St, T = {
-        edgeId: N.id,
-        segmentIndex: U,
+    ], it = z.data.bezierControls, tt = U.length - 2;
+    for (let K = 0; K <= tt; K++) {
+      const et = U[K], nt = U[K + 1], mt = it?.[K], Vt = Math.hypot(nt.x - et.x, nt.y - et.y), kt = Math.max(30, Vt * 0.3), Bt = mt?.c1x ?? (K === 0 ? et.x + M.snx * kt : et.x + (nt.x - et.x) * 0.4), Ht = mt?.c1y ?? (K === 0 ? et.y + M.sny * kt : et.y), Tt = mt?.c2x ?? (K === tt ? nt.x + M.tnx * kt : nt.x - (nt.x - et.x) * 0.4), Rt = mt?.c2y ?? (K === tt ? nt.y + M.tny * kt : nt.y), It = Math.hypot(F - Bt, E - Ht);
+      It < k && (k = It, W = {
+        edgeId: z.id,
+        segmentIndex: K,
         controlEnd: "c1",
-        wx: Pt,
-        wy: Rt
+        wx: Bt,
+        wy: Ht
       });
-      const Gt = Math.hypot(_ - It, E - yt);
-      Gt < k && (k = Gt, T = {
-        edgeId: N.id,
-        segmentIndex: U,
+      const yt = Math.hypot(F - Tt, E - Rt);
+      yt < k && (k = yt, W = {
+        edgeId: z.id,
+        segmentIndex: K,
         controlEnd: "c2",
-        wx: It,
-        wy: yt
+        wx: Tt,
+        wy: Rt
       });
     }
   }
-  return T;
+  return W;
 }
-function un(_, E, X, O) {
-  const D = Mt(X, O);
+function fn(F, E, G, Z) {
+  const D = Mt(G, Z);
   if (!D) return 0;
-  const T = X.data.waypoints ?? [], k = [
+  const W = G.data.waypoints ?? [], k = [
     {
       x: D.sx,
       y: D.sy
     },
-    ...T,
+    ...W,
     {
       x: D.tx,
       y: D.ty
     }
   ];
-  let N = 1 / 0, M = 0;
-  for (let F = 0; F < k.length - 1; F++) {
-    const j = me(_, E, k[F].x, k[F].y, k[F + 1].x, k[F + 1].y);
-    j < N && (N = j, M = F);
+  let z = 1 / 0, M = 0;
+  for (let _ = 0; _ < k.length - 1; _++) {
+    const U = me(F, E, k[_].x, k[_].y, k[_ + 1].x, k[_ + 1].y);
+    U < z && (z = U, M = _);
   }
   return M;
 }
-function fn(_, E, X, O, D = 24) {
-  let { x: T, y: k, w: N, h: M } = { ..._ };
-  const F = E === "nw" || E === "sw", j = E === "ne" || E === "se", tt = E === "nw" || E === "ne", ct = E === "sw" || E === "se";
-  return F && (T += X, N -= X), j && (N += X), tt && (k += O, M -= O), ct && (M += O), N < D && (F && (T = _.x + _.w - D), N = D), M < D && (tt && (k = _.y + _.h - D), M = D), {
-    x: T,
+function hn(F, E, G, Z, D = 24) {
+  let { x: W, y: k, w: z, h: M } = { ...F };
+  const _ = E === "nw" || E === "sw", U = E === "ne" || E === "se", it = E === "nw" || E === "ne", tt = E === "sw" || E === "se";
+  return _ && (W += G, z -= G), U && (z += G), it && (k += Z, M -= Z), tt && (M += Z), z < D && (_ && (W = F.x + F.w - D), z = D), M < D && (it && (k = F.y + F.h - D), M = D), {
+    x: W,
     y: k,
-    w: N,
+    w: z,
     h: M
   };
 }
-function we(_, E, X, O, D) {
-  const T = Mt(X, O);
-  if (!T) return !1;
-  const k = Ze(_e(X.type, T, X.data.waypoints, X.data.bezierControls));
-  for (let N = 0; N < k.length - 1; N++) if (me(_, E, k[N].x, k[N].y, k[N + 1].x, k[N + 1].y) < D) return !0;
+function we(F, E, G, Z, D) {
+  const W = Mt(G, Z);
+  if (!W) return !1;
+  const k = qe(Ze(G.type, W, G.data.waypoints, G.data.bezierControls));
+  for (let z = 0; z < k.length - 1; z++) if (me(F, E, k[z].x, k[z].y, k[z + 1].x, k[z + 1].y) < D) return !0;
   return !1;
 }
-function Fe(_, E, X, O) {
-  const D = X.points;
-  for (let T = 0; T < D.length - 1; T++) if (me(_, E, D[T].x, D[T].y, D[T + 1].x, D[T + 1].y) < O) return !0;
+function _e(F, E, G, Z) {
+  const D = G.points;
+  for (let W = 0; W < D.length - 1; W++) if (me(F, E, D[W].x, D[W].y, D[W + 1].x, D[W + 1].y) < Z) return !0;
   return !1;
 }
-function Gn({ onPixiReady: _ }) {
-  const E = b(null), { pixiRef: X, readyRef: O } = Ke(E), { setViewportInternal: D, viewportReqRef: T, viewport: k, autoFocus: N, showGrid: M, showAnchors: F, gridSize: j, toolMode: tt, edgeType: ct, focusOnRect: U, setFocusOnRect: et, pendingPlacement: nt, setPendingPlacement: Tt, setContextMenu: re, beginNodeDrag: mt, endNodeDrag: Pt, presentation: Rt, editingNodeId: It, setEditingNodeId: yt } = Be(), { currentCanvas: St, selection: Gt, setSelection: lt, setDoc: J, currentCanvasId: oe, pushCanvas: qe, doc: Ie } = Ve(), zt = b(null), Nt = b(null), Bt = b(null), Kt = b(null), jt = b(null), se = b(null), ie = b(null), Ut = b(null), Wt = b(null), Lt = b(null), $t = b(null), Ct = b([]), ce = b(null), de = b(null), ut = b(null), At = b(null), ve = b({
+function Wn({ onPixiReady: F }) {
+  const E = b(null), G = b(null), Z = b(13751771), { pixiRef: D, readyRef: W } = je(E, qt((l) => {
+    Z.current = l.gridDot, G.current && (G.current.dotColor = l.gridDot);
+  }, [])), { setViewportInternal: k, viewportReqRef: z, viewport: M, autoFocus: _, showGrid: U, showAnchors: it, gridSize: tt, toolMode: K, edgeType: et, focusOnRect: nt, setFocusOnRect: mt, pendingPlacement: Vt, setPendingPlacement: kt, setContextMenu: Bt, beginNodeDrag: Ht, endNodeDrag: Tt, presentation: Rt, editingNodeId: It, setEditingNodeId: yt } = Ke(), { currentCanvas: re, selection: Ie, setSelection: lt, setDoc: J, currentCanvasId: oe, pushCanvas: Oe, doc: ve } = Be(), St = b(null), Kt = b(null), jt = b(null), Ut = b(null), se = b(null), ce = b(null), $t = b(null), Pt = b(null), Gt = b(null), Jt = b(null), zt = b([]), ie = b(null), de = b(null), ut = b(null), Wt = b(null), be = b({
     time: 0,
     wx: 0,
     wy: 0
-  }), Yt = b({
+  }), Lt = b({
     time: 0,
     wx: 0,
     wy: 0
-  }), Xt = b(null), be = b({
+  }), At = b(null), Me = b({
     x: 0,
     y: 0
-  }), Me = F || Rt ? St : {
-    ...St,
-    nodes: St.nodes.filter((u) => u.type !== "animAnchor")
-  }, L = b(Me);
-  L.current = Me;
+  }), Re = it || Rt ? re : {
+    ...re,
+    nodes: re.nodes.filter((l) => l.type !== "animAnchor")
+  }, A = b(Re);
+  A.current = Re;
   const V = b(oe);
   V.current = oe;
-  const Ft = b(Gt);
-  Ft.current = Gt;
-  const Re = b(Ie);
-  Re.current = Ie;
-  const _t = b(tt);
-  _t.current = tt;
-  const Zt = b(N);
-  Zt.current = N;
-  const qt = b(U);
-  qt.current = U;
-  const Se = b(ct);
-  Se.current = ct;
-  const ze = b(F);
-  ze.current = F;
-  const Et = b(Rt);
-  Et.current = Rt;
-  const ae = b(nt);
-  ae.current = nt;
-  const Ne = b(mt);
-  Ne.current = mt;
-  const le = b(Pt);
-  le.current = Pt;
-  const ft = b(null), rt = b(null), ot = b(null), dt = b(null), xt = b(null), pt = b(null), vt = b(null), ue = b(k), fe = b(0), { vmRef: $, screenToWorld: Ce } = je(X, ne((u) => {
-    ue.current = u, fe.current || (fe.current = requestAnimationFrame(() => {
-      fe.current = 0, D(ue.current);
+  const Yt = b(Ie);
+  Yt.current = Ie;
+  const Se = b(ve);
+  Se.current = ve;
+  const Xt = b(K);
+  Xt.current = K;
+  const Ft = b(_);
+  Ft.current = _;
+  const _t = b(nt);
+  _t.current = nt;
+  const ze = b(et);
+  ze.current = et;
+  const Ce = b(it);
+  Ce.current = it;
+  const Ct = b(Rt);
+  Ct.current = Rt;
+  const ae = b(Vt);
+  ae.current = Vt;
+  const Ne = b(Ht);
+  Ne.current = Ht;
+  const le = b(Tt);
+  le.current = Tt;
+  const ft = b(null), rt = b(null), ot = b(null), dt = b(null), xt = b(null), pt = b(null), vt = b(null), ue = b(M), fe = b(0), { vmRef: $, screenToWorld: Ee } = Ue(D, qt((l) => {
+    ue.current = l, fe.current || (fe.current = requestAnimationFrame(() => {
+      fe.current = 0, k(ue.current);
     }));
-  }, [D])), st = b(Ce);
-  st.current = Ce;
-  const [at, he] = Ge(null), [ye, xe] = Ge(null), pe = b(at);
+  }, [k])), st = b(Ee);
+  st.current = Ee;
+  const [at, he] = We(null), [ye, xe] = We(null), pe = b(at);
   pe.current = at;
-  const Jt = b(() => {
+  const Qt = b(() => {
   });
-  Jt.current = (u, P, A) => {
-    yt(u === "node" ? P : null), he({
-      kind: u,
-      id: P,
-      value: A
+  Qt.current = (l, T, Y) => {
+    yt(l === "node" ? T : null), he({
+      kind: l,
+      id: T,
+      value: Y
     });
   };
-  const Ee = ne((u) => {
-    const P = pe.current;
-    P && (J((A) => {
-      const W = V.current, Z = A.canvases[W];
-      if (!Z) return A;
-      let Y = Z;
-      if (P.kind === "node") Y = {
-        ...Z,
-        nodes: Z.nodes.map((B) => B.id === P.id ? {
+  const De = qt((l) => {
+    const T = pe.current;
+    T && (J((Y) => {
+      const L = V.current, q = Y.canvases[L];
+      if (!q) return Y;
+      let X = q;
+      if (T.kind === "node") X = {
+        ...q,
+        nodes: q.nodes.map((B) => B.id === T.id ? {
           ...B,
           data: {
             ...B.data,
-            label: u
+            label: l
           }
         } : B)
       };
-      else if (P.kind === "edge") Y = {
-        ...Z,
-        edges: Z.edges.map((B) => B.id === P.id ? {
+      else if (T.kind === "edge") X = {
+        ...q,
+        edges: q.edges.map((B) => B.id === T.id ? {
           ...B,
           data: {
             ...B.data,
-            labelText: u
+            labelText: l
           }
         } : B)
       };
-      else return A;
+      else return Y;
       return {
-        ...A,
+        ...Y,
         canvases: {
-          ...A.canvases,
-          [W]: Y
+          ...Y.canvases,
+          [L]: X
         }
       };
     }), he(null), yt(null), xe(null));
-  }, [J, yt]), Oe = ne(() => {
+  }, [J, yt]), Ve = qt(() => {
     he(null), yt(null), xe(null);
   }, [yt]);
   wt(() => {
     if (!It || pe.current?.id === It) return;
-    const u = L.current.nodes.find((P) => P.id === It);
-    u && Jt.current("node", u.id, u.data.label);
+    const l = A.current.nodes.find((T) => T.id === It);
+    l && Qt.current("node", l.id, l.data.label);
   }, [It]), wt(() => {
     if (!at) return;
-    const u = $.current;
-    if (!u) return;
-    const P = L.current;
-    let A = null;
+    const l = $.current;
+    if (!l) return;
+    const T = A.current;
+    let Y = null;
     if (at.kind === "node") {
-      const W = P.nodes.find((Z) => Z.id === at.id);
-      W && (A = {
-        x: W.position.x + W.width / 2,
-        y: W.position.y + W.height / 2
+      const L = T.nodes.find((q) => q.id === at.id);
+      L && (Y = {
+        x: L.position.x + L.width / 2,
+        y: L.position.y + L.height / 2
       });
     } else if (at.kind === "edge") {
-      const W = P.edges.find((Y) => Y.id === at.id), Z = /* @__PURE__ */ new Map();
-      for (const Y of P.nodes) Z.set(Y.id, Y);
-      if (W) {
-        const Y = Mt(W, Z);
-        if (Y) {
-          const B = Ze(_e(W.type, Y, W.data.waypoints, W.data.bezierControls)), Q = B[Math.floor(B.length / 2)] ?? {
-            x: (Y.sx + Y.tx) / 2,
-            y: (Y.sy + Y.ty) / 2
+      const L = T.edges.find((X) => X.id === at.id), q = /* @__PURE__ */ new Map();
+      for (const X of T.nodes) q.set(X.id, X);
+      if (L) {
+        const X = Mt(L, q);
+        if (X) {
+          const B = qe(Ze(L.type, X, L.data.waypoints, L.data.bezierControls)), Q = B[Math.floor(B.length / 2)] ?? {
+            x: (X.sx + X.tx) / 2,
+            y: (X.sy + X.ty) / 2
           };
-          A = {
+          Y = {
             x: Q.x,
             y: Q.y
           };
         }
       }
     }
-    if (A) {
-      const W = u.worldToScreen(A.x, A.y);
+    if (Y) {
+      const L = l.worldToScreen(Y.x, Y.y);
       xe({
-        x: W.x,
-        y: W.y
+        x: L.x,
+        y: L.y
       });
     }
   }, [at, $]);
   const ke = b(0);
   wt(() => {
-    T.current !== ke.current && (ke.current = T.current, ue.current = k, $.current?.setState(k));
+    z.current !== ke.current && (ke.current = z.current, ue.current = M, $.current?.setState(M));
   }, [
-    k,
+    M,
     $,
-    T
+    z
   ]), wt(() => {
-    et((u, P, A, W, Z) => {
-      const Y = $.current, B = E.current;
-      if (!Y || !B) return;
-      const Q = B.clientWidth || 800, it = B.clientHeight || 600, bt = Math.max(0, Z?.padding ?? 60), Qt = Math.max(1, Q - bt * 2), m = Math.max(1, it - bt * 2), s = Z?.preserveZoom ? Y.state.zoom : Math.min(Qt / Math.max(A, 1), m / Math.max(W, 1), Z?.maxZoom ?? 2), l = u + A / 2, v = P + W / 2, G = Q / 2 - l * s, C = it / 2 - v * s;
-      Y.animateTo({
-        x: G,
-        y: C,
+    mt((l, T, Y, L, q) => {
+      const X = $.current, B = E.current;
+      if (!X || !B) return;
+      const Q = B.clientWidth || 800, ct = B.clientHeight || 600, bt = Math.max(0, q?.padding ?? 60), te = Math.max(1, Q - bt * 2), m = Math.max(1, ct - bt * 2), s = q?.preserveZoom ? X.state.zoom : Math.min(te / Math.max(Y, 1), m / Math.max(L, 1), q?.maxZoom ?? 2), u = l + Y / 2, v = T + L / 2, P = Q / 2 - u * s, N = ct / 2 - v * s;
+      X.animateTo({
+        x: P,
+        y: N,
         zoom: s
-      }, Z?.duration ?? 350);
+      }, q?.duration ?? 350);
     });
-  }, [et, $]);
-  const De = ne((u) => {
-    J((P) => {
-      const A = P.canvases[V.current];
-      return A ? {
-        ...P,
+  }, [mt, $]);
+  const He = qt((l) => {
+    J((T) => {
+      const Y = T.canvases[V.current];
+      return Y ? {
+        ...T,
         canvases: {
-          ...P.canvases,
+          ...T.canvases,
           [V.current]: {
-            ...A,
-            lines: [...A.lines, u]
+            ...Y,
+            lines: [...Y.lines, l]
           }
         }
-      } : P;
+      } : T;
     });
-  }, [J, oe]), ge = b(De);
-  return ge.current = De, wt(() => {
-    const u = X.current;
-    if (!u || u.destroyed) return;
-    let P = !1;
-    const A = () => {
-      if (P) return;
-      if (!O.current) {
-        setTimeout(A, 30);
+  }, [J, oe]), ge = b(He);
+  return ge.current = He, wt(() => {
+    const l = D.current;
+    if (!l || l.destroyed) return;
+    let T = !1;
+    const Y = () => {
+      if (T) return;
+      if (!W.current) {
+        setTimeout(Y, 30);
         return;
       }
-      zt.current = new Ue(u.app.stage, j, M), Nt.current = new $e(u.app.stage), Bt.current = new tn(u.world), Kt.current = new en(u.world), jt.current = new nn(u.world);
-      const W = new Vt();
-      W.label = "connect-line", W.visible = !1, u.world.addChild(W), xt.current = W;
-      const Z = new Vt();
-      Z.label = "transform-handles", u.app.stage.addChild(Z), Wt.current = Z;
-      const Y = new Vt();
-      Y.label = "handle-hover", u.world.addChild(Y), Lt.current = Y;
-      const B = new Vt();
-      B.label = "edge-edit-handles", u.world.addChild(B), At.current = B;
-      const Q = new Vt();
-      Q.label = "ghost-placement", Q.alpha = 0.5, u.world.addChild(Q), Xt.current = Q, $t.current = new sn(u.world), se.current = new rn(u.app.stage, u.world, {
+      G.current = new $e(l.app.stage, tt, U), G.current.dotColor = Z.current, St.current = new Je(l.app.stage), Kt.current = new en(l.world), jt.current = new nn(l.world), Ut.current = new rn(l.world);
+      const L = new Ot();
+      L.label = "connect-line", L.visible = !1, l.world.addChild(L), xt.current = L;
+      const q = new Ot();
+      q.label = "transform-handles", l.app.stage.addChild(q), Pt.current = q;
+      const X = new Ot();
+      X.label = "handle-hover", l.world.addChild(X), Gt.current = X;
+      const B = new Ot();
+      B.label = "edge-edit-handles", l.world.addChild(B), Wt.current = B;
+      const Q = new Ot();
+      Q.label = "ghost-placement", Q.alpha = 0.5, l.world.addChild(Q), At.current = Q, Jt.current = new cn(l.world), se.current = new on(l.app.stage, l.world, {
         onLineComplete: (m) => ge.current(m),
         screenToWorld: (m, s) => st.current(m, s)
-      }), ie.current = new on(u.app.stage, u.world, {
+      }), ce.current = new sn(l.app.stage, l.world, {
         onLineComplete: (m) => ge.current(m),
         screenToWorld: (m, s) => st.current(m, s)
-      }), _?.(u);
-      const it = u.app.stage;
-      it.on("pointerdown", (m) => {
+      }), F?.(l);
+      const ct = l.app.stage;
+      ct.on("pointerdown", (m) => {
         if (E.current?.focus({ preventScroll: !0 }), $.current?.isPanning || $.current?.isSpaceHeld || m.button !== 0) return;
-        const s = _t.current;
+        const s = Xt.current;
         if (s === "pan") {
           $.current?.startPan(m.global.x, m.global.y);
           return;
         }
         if (s === "freehand" || s === "line" || s === "polyline" || s === "arrow") return;
-        const l = st.current(m.global.x, m.global.y), v = L.current.nodes, G = L.current.edges, C = L.current.lines, I = Ft.current, S = m.metaKey || m.ctrlKey || m.shiftKey, q = $.current?.state.zoom ?? 1, e = ae.current;
+        const u = st.current(m.global.x, m.global.y), v = A.current.nodes, P = A.current.edges, N = A.current.lines, I = Yt.current, S = m.metaKey || m.ctrlKey || m.shiftKey, O = $.current?.state.zoom ?? 1, e = ae.current;
         if (e) {
-          const t = Je("node"), c = l.x - e.width / 2, n = l.y - e.height / 2, o = ee([{
+          const t = Qe("node"), i = u.x - e.width / 2, n = u.y - e.height / 2, o = ne([{
             id: "__ghost__",
             type: e.type,
             position: {
-              x: c,
+              x: i,
               y: n
             },
             width: e.width,
             height: e.height,
             data: {}
-          }], v), r = c + o.dx, d = n + o.dy;
+          }], v), r = i + o.dx, d = n + o.dy;
           J((w) => {
             const g = w.canvases[V.current];
             if (!g) return w;
-            const z = {};
-            e.type === "animAnchor" && (z.animIndex = dn(w));
+            const C = {};
+            e.type === "animAnchor" && (C.animIndex = an(w));
             const H = Math.max(0, ...g.nodes.map((h) => h.zIndex ?? 0), ...g.lines.map((h) => h.zIndex ?? 0));
             return {
               ...w,
@@ -419,7 +421,7 @@ function Gn({ onPixiReady: _ }) {
                     zIndex: H + 1,
                     data: {
                       ...e.data,
-                      ...z
+                      ...C
                     }
                   }]
                 }
@@ -429,8 +431,8 @@ function Gn({ onPixiReady: _ }) {
             nodeIds: /* @__PURE__ */ new Set([t]),
             edgeIds: /* @__PURE__ */ new Set(),
             lineIds: /* @__PURE__ */ new Set()
-          }), Zt.current && window.setTimeout(() => {
-            qt.current(r, d, e.width, e.height, {
+          }), Ft.current && window.setTimeout(() => {
+            _t.current(r, d, e.width, e.height, {
               padding: 80,
               preserveZoom: !0,
               duration: 280
@@ -438,36 +440,36 @@ function Gn({ onPixiReady: _ }) {
           }, 0);
           return;
         }
-        const i = Date.now(), y = ve.current, f = i - y.time < 350 && Math.hypot(l.x - y.wx, l.y - y.wy) < 8 / q;
-        if (ve.current = {
-          time: i,
-          wx: l.x,
-          wy: l.y
+        const c = Date.now(), y = be.current, f = c - y.time < 350 && Math.hypot(u.x - y.wx, u.y - y.wy) < 8 / O;
+        if (be.current = {
+          time: c,
+          wx: u.x,
+          wy: u.y
         }, I.nodeIds.size === 1 && !S && s === "select") {
-          const t = v.find((c) => c.id === [...I.nodeIds][0]);
+          const t = v.find((i) => i.id === [...I.nodeIds][0]);
           if (t) {
-            const c = Le(l, t, Math.min(10 / q, 16));
-            if (c) {
-              const n = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), r = t.type === "geometryGroup", d = r || t.type === "flowGroup" || t.data.isGroup, w = t.position.x, g = t.position.y, z = t.width, H = t.height;
+            const i = Ae(u, t, Math.min(10 / O, 16));
+            if (i) {
+              const n = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), r = t.type === "geometryGroup", d = r || t.type === "flowGroup" || t.data.isGroup, w = t.position.x, g = t.position.y, C = t.width, H = t.height;
               for (const h of v)
                 h.id !== t.id && (h.parentId === t.id ? n.set(h.id, {
                   x: h.position.x,
                   y: h.position.y,
                   w: h.width,
                   h: h.height
-                }) : r && h.position.x >= w && h.position.y >= g && h.position.x + h.width <= w + z && h.position.y + h.height <= g + H && n.set(h.id, {
+                }) : r && h.position.x >= w && h.position.y >= g && h.position.x + h.width <= w + C && h.position.y + h.height <= g + H && n.set(h.id, {
                   x: h.position.x,
                   y: h.position.y,
                   w: h.width,
                   h: h.height
                 }));
               if (d)
-                for (const h of L.current.lines) h.parentId === t.id ? o.set(h.id, h.points.map((R) => ({ ...R }))) : r && h.points.length > 0 && h.points.every((R) => R.x >= w && R.x <= w + z && R.y >= g && R.y <= g + H) && o.set(h.id, h.points.map((R) => ({ ...R })));
+                for (const h of A.current.lines) h.parentId === t.id ? o.set(h.id, h.points.map((R) => ({ ...R }))) : r && h.points.length > 0 && h.points.every((R) => R.x >= w && R.x <= w + C && R.y >= g && R.y <= g + H) && o.set(h.id, h.points.map((R) => ({ ...R })));
               pt.current = {
                 active: !0,
                 nodeId: t.id,
-                handle: c,
-                startWorld: l,
+                handle: i,
+                startWorld: u,
                 startBounds: {
                   x: t.position.x,
                   y: t.position.y,
@@ -482,16 +484,16 @@ function Gn({ onPixiReady: _ }) {
           }
         }
         let x = null;
-        for (let t = v.length - 1; t >= 0; t--) if (Ht(l.x, l.y, v[t])) {
+        for (let t = v.length - 1; t >= 0; t--) if (Dt(u.x, u.y, v[t])) {
           x = v[t];
           break;
         }
         if (x?.parentId) {
-          const t = v.find((c) => c.id === x.parentId);
+          const t = v.find((i) => i.id === x.parentId);
           t && (x = t);
         }
         if (x && (s === "select" || s === "connect")) {
-          const t = Dt(gt(x.width, x.height), x, l.x, l.y, Math.min(14 / q, 20));
+          const t = Et(gt(x.width, x.height), x, u.x, u.y, Math.min(14 / O, 20));
           if (t) {
             ot.current = {
               active: !0,
@@ -504,9 +506,9 @@ function Gn({ onPixiReady: _ }) {
         if ((s === "select" || s === "connect") && !S && I.edgeIds.size > 0) {
           const t = /* @__PURE__ */ new Map();
           for (const o of v) t.set(o.id, o);
-          const c = G.filter((o) => I.edgeIds.has(o.id)), n = Ae(l.x, l.y, c, t, Math.min(14 / q, 20));
+          const i = P.filter((o) => I.edgeIds.has(o.id)), n = Ye(u.x, u.y, i, t, Math.min(14 / O, 20));
           if (n) {
-            const o = G.find((r) => r.id === n.edgeId);
+            const o = P.find((r) => r.id === n.edgeId);
             if (o) {
               const r = n.end === "source" ? "target" : "source";
               dt.current = {
@@ -523,7 +525,7 @@ function Gn({ onPixiReady: _ }) {
         if (s === "select" && I.edgeIds.size > 0 && !x) {
           const t = /* @__PURE__ */ new Map();
           for (const d of v) t.set(d.id, d);
-          const c = G.filter((d) => I.edgeIds.has(d.id)), n = Math.min(10 / q, 14), o = Xe(l.x, l.y, c, t, n);
+          const i = P.filter((d) => I.edgeIds.has(d.id)), n = Math.min(10 / O, 14), o = Fe(u.x, u.y, i, t, n);
           if (o) {
             ut.current = {
               active: !0,
@@ -533,7 +535,7 @@ function Gn({ onPixiReady: _ }) {
             };
             return;
           }
-          const r = Ye(l.x, l.y, c, n);
+          const r = Xe(u.x, u.y, i, n);
           if (r) {
             if (f) {
               J((d) => {
@@ -546,11 +548,11 @@ function Gn({ onPixiReady: _ }) {
                       ...w,
                       edges: w.edges.map((g) => {
                         if (g.id !== r.edgeId) return g;
-                        const z = [...g.data.waypoints ?? []];
-                        z.splice(r.waypointIndex, 1);
+                        const C = [...g.data.waypoints ?? []];
+                        C.splice(r.waypointIndex, 1);
                         const H = {
                           ...g.data,
-                          waypoints: z.length > 0 ? z : void 0
+                          waypoints: C.length > 0 ? C : void 0
                         };
                         if (g.type === "simplebezier" && g.data.bezierControls) {
                           const h = [...g.data.bezierControls];
@@ -576,40 +578,40 @@ function Gn({ onPixiReady: _ }) {
             return;
           }
           if (f) {
-            for (const d of c) if (we(l.x, l.y, d, t, Math.min(8 / q, 12))) {
-              const w = un(l.x, l.y, d, t), g = {
-                x: l.x,
-                y: l.y
+            for (const d of i) if (we(u.x, u.y, d, t, Math.min(8 / O, 12))) {
+              const w = fn(u.x, u.y, d, t), g = {
+                x: u.x,
+                y: u.y
               };
-              J((z) => {
-                const H = z.canvases[V.current];
+              J((C) => {
+                const H = C.canvases[V.current];
                 return H ? {
-                  ...z,
+                  ...C,
                   canvases: {
-                    ...z.canvases,
+                    ...C.canvases,
                     [V.current]: {
                       ...H,
                       edges: H.edges.map((h) => {
                         if (h.id !== d.id) return h;
                         const R = [...h.data.waypoints ?? []];
                         R.splice(w, 0, g);
-                        const K = {
+                        const j = {
                           ...h.data,
                           waypoints: R
                         };
                         if (h.type === "simplebezier" && h.data.bezierControls) {
                           const ht = [...h.data.bezierControls];
                           for (; ht.length < (h.data.waypoints ?? []).length + 1; ) ht.push(null);
-                          ht.splice(w, 1, null, null), K.bezierControls = ht;
+                          ht.splice(w, 1, null, null), j.bezierControls = ht;
                         }
                         return {
                           ...h,
-                          data: K
+                          data: j
                         };
                       })
                     }
                   }
-                } : z;
+                } : C;
               }), ut.current = {
                 active: !0,
                 edgeId: d.id,
@@ -632,40 +634,40 @@ function Gn({ onPixiReady: _ }) {
               edgeIds: /* @__PURE__ */ new Set(),
               lineIds: /* @__PURE__ */ new Set()
             };
-          }), Zt.current && qt.current(x.position.x, x.position.y, x.width, x.height, {
+          }), Ft.current && _t.current(x.position.x, x.position.y, x.width, x.height, {
             padding: 80,
             preserveZoom: !0,
             duration: 280
           });
           const t = I.nodeIds.has(x.id) ? new Set(I.nodeIds) : /* @__PURE__ */ new Set([x.id]);
           S && !I.nodeIds.has(x.id) && t.add(x.id);
-          const c = /* @__PURE__ */ new Set();
+          const i = /* @__PURE__ */ new Set();
           for (const r of [...t]) {
             const d = v.find((R) => R.id === r);
             if (!d || d.type !== "flowGroup" && d.type !== "geometryGroup" && !d.data.isGroup) continue;
-            const w = d.type === "geometryGroup", g = d.position.x, z = d.position.y, H = d.width, h = d.height;
+            const w = d.type === "geometryGroup", g = d.position.x, C = d.position.y, H = d.width, h = d.height;
             for (const R of v)
               if (!(t.has(R.id) || R.id === r)) {
                 if (R.parentId === r) {
                   t.add(R.id);
                   continue;
                 }
-                w && R.position.x >= g && R.position.y >= z && R.position.x + R.width <= g + H && R.position.y + R.height <= z + h && t.add(R.id);
+                w && R.position.x >= g && R.position.y >= C && R.position.x + R.width <= g + H && R.position.y + R.height <= C + h && t.add(R.id);
               }
-            for (const R of L.current.lines) R.parentId === r && c.add(R.id);
-            if (w) for (const R of L.current.lines)
-              c.has(R.id) || R.points.length > 0 && R.points.every((K) => K.x >= g && K.x <= g + H && K.y >= z && K.y <= z + h) && c.add(R.id);
+            for (const R of A.current.lines) R.parentId === r && i.add(R.id);
+            if (w) for (const R of A.current.lines)
+              i.has(R.id) || R.points.length > 0 && R.points.every((j) => j.x >= g && j.x <= g + H && j.y >= C && j.y <= C + h) && i.add(R.id);
           }
           const n = /* @__PURE__ */ new Map();
           for (const r of v) t.has(r.id) && n.set(r.id, { ...r.position });
           const o = /* @__PURE__ */ new Map();
-          if (c.size > 0)
-            for (const r of L.current.lines) c.has(r.id) && o.set(r.id, r.points.map((d) => ({ ...d })));
+          if (i.size > 0)
+            for (const r of A.current.lines) i.has(r.id) && o.set(r.id, r.points.map((d) => ({ ...d })));
           ft.current = {
             active: !0,
             nodeIds: t,
-            lineIds: c.size > 0 ? c : void 0,
-            startWorld: l,
+            lineIds: i.size > 0 ? i : void 0,
+            startWorld: u,
             nodeStarts: n,
             linePointStarts: o.size > 0 ? o : void 0
           }, Ne.current();
@@ -673,23 +675,23 @@ function Gn({ onPixiReady: _ }) {
         }
         const p = /* @__PURE__ */ new Map();
         for (const t of v) p.set(t.id, t);
-        const a = Math.min(8 / q, 12);
-        for (const t of G) if (we(l.x, l.y, t, p, a)) {
-          if (lt(S ? (c) => {
-            const n = new Set(c.edgeIds);
+        const a = Math.min(8 / O, 12);
+        for (const t of P) if (we(u.x, u.y, t, p, a)) {
+          if (lt(S ? (i) => {
+            const n = new Set(i.edgeIds);
             return n.has(t.id) ? n.delete(t.id) : n.add(t.id), {
-              ...c,
+              ...i,
               edgeIds: n
             };
           } : {
             nodeIds: /* @__PURE__ */ new Set(),
             edgeIds: /* @__PURE__ */ new Set([t.id]),
             lineIds: /* @__PURE__ */ new Set()
-          }), Zt.current) {
-            const c = p.get(t.source), n = p.get(t.target);
-            if (c && n) {
-              const o = Math.min(c.position.x, n.position.x), r = Math.min(c.position.y, n.position.y), d = Math.max(c.position.x + c.width, n.position.x + n.width), w = Math.max(c.position.y + c.height, n.position.y + n.height);
-              qt.current(o, r, d - o, w - r, {
+          }), Ft.current) {
+            const i = p.get(t.source), n = p.get(t.target);
+            if (i && n) {
+              const o = Math.min(i.position.x, n.position.x), r = Math.min(i.position.y, n.position.y), d = Math.max(i.position.x + i.width, n.position.x + n.width), w = Math.max(i.position.y + i.height, n.position.y + n.height);
+              _t.current(o, r, d - o, w - r, {
                 padding: 80,
                 preserveZoom: !0,
                 duration: 280
@@ -698,32 +700,32 @@ function Gn({ onPixiReady: _ }) {
           }
           return;
         }
-        for (const t of C) if (Fe(l.x, l.y, t, a)) {
-          const c = I.lineIds.has(t.id);
+        for (const t of N) if (_e(u.x, u.y, t, a)) {
+          const i = I.lineIds.has(t.id);
           if (S ? lt((r) => {
             const d = new Set(r.lineIds);
             return d.has(t.id) ? d.delete(t.id) : d.add(t.id), {
               ...r,
               lineIds: d
             };
-          }) : c || lt({
+          }) : i || lt({
             nodeIds: /* @__PURE__ */ new Set(),
             edgeIds: /* @__PURE__ */ new Set(),
             lineIds: /* @__PURE__ */ new Set([t.id])
-          }), Zt.current && t.points.length > 0) {
-            const r = t.points.map((h) => h.x), d = t.points.map((h) => h.y), w = Math.min(...r), g = Math.min(...d), z = Math.max(...r), H = Math.max(...d);
-            qt.current(w, g, Math.max(1, z - w), Math.max(1, H - g), {
+          }), Ft.current && t.points.length > 0) {
+            const r = t.points.map((h) => h.x), d = t.points.map((h) => h.y), w = Math.min(...r), g = Math.min(...d), C = Math.max(...r), H = Math.max(...d);
+            _t.current(w, g, Math.max(1, C - w), Math.max(1, H - g), {
               padding: 80,
               preserveZoom: !0,
               duration: 280
             });
           }
-          const n = c ? new Set(I.lineIds) : /* @__PURE__ */ new Set([t.id]), o = /* @__PURE__ */ new Map();
-          for (const r of C) n.has(r.id) && o.set(r.id, r.points.map((d) => ({ ...d })));
+          const n = i ? new Set(I.lineIds) : /* @__PURE__ */ new Set([t.id]), o = /* @__PURE__ */ new Map();
+          for (const r of N) n.has(r.id) && o.set(r.id, r.points.map((d) => ({ ...d })));
           vt.current = {
             active: !0,
             lineIds: n,
-            startWorld: l,
+            startWorld: u,
             pointStarts: o
           };
           return;
@@ -739,30 +741,30 @@ function Gn({ onPixiReady: _ }) {
             y: m.global.y
           }
         });
-      }), it.on("globalpointermove", (m) => {
+      }), ct.on("globalpointermove", (m) => {
         const s = st.current(m.global.x, m.global.y);
-        be.current = s;
-        const l = _t.current;
-        if (l === "freehand" || l === "line" || l === "polyline" || l === "arrow") return;
-        const v = L.current.nodes, G = L.current.edges, C = $.current?.state.zoom ?? 1, I = !ft.current?.active && !ot.current?.active && !pt.current?.active && !dt.current?.active && !ut.current?.active && !vt.current?.active;
+        Me.current = s;
+        const u = Xt.current;
+        if (u === "freehand" || u === "line" || u === "polyline" || u === "arrow") return;
+        const v = A.current.nodes, P = A.current.edges, N = $.current?.state.zoom ?? 1, I = !ft.current?.active && !ot.current?.active && !pt.current?.active && !dt.current?.active && !ut.current?.active && !vt.current?.active;
         let S = null;
-        for (let e = v.length - 1; e >= 0; e--) if (Ht(s.x, s.y, v[e])) {
-          const i = v[e];
-          S = i.parentId ? v.find((y) => y.id === i.parentId)?.id ?? i.id : i.id;
+        for (let e = v.length - 1; e >= 0; e--) if (Dt(s.x, s.y, v[e])) {
+          const c = v[e];
+          S = c.parentId ? v.find((y) => y.id === c.parentId)?.id ?? c.id : c.id;
           break;
         }
-        if (Ut.current = S, I && (l === "select" || l === "connect")) {
+        if ($t.current = S, I && (u === "select" || u === "connect")) {
           const e = /* @__PURE__ */ new Map();
           for (const p of v) e.set(p.id, p);
-          const i = Ft.current, y = i.edgeIds.size > 0 ? G.filter((p) => i.edgeIds.has(p.id)) : [], f = y.length > 0 ? Ae(s.x, s.y, y, e, Math.min(12 / C, 18)) : null;
+          const c = Yt.current, y = c.edgeIds.size > 0 ? P.filter((p) => c.edgeIds.has(p.id)) : [], f = y.length > 0 ? Ye(s.x, s.y, y, e, Math.min(12 / N, 18)) : null;
           de.current = f;
           let x = null;
           if (S) {
             const p = v.find((a) => a.id === S);
             if (p) {
-              const a = Dt(gt(p.width, p.height), p, s.x, s.y, Math.min(14 / C, 20));
+              const a = Et(gt(p.width, p.height), p, s.x, s.y, Math.min(14 / N, 20));
               if (a) {
-                const t = Ot(a, p);
+                const t = Zt(a, p);
                 x = {
                   nodeId: p.id,
                   handleId: a.id,
@@ -772,38 +774,38 @@ function Gn({ onPixiReady: _ }) {
               }
             }
           }
-          ce.current = x;
+          ie.current = x;
         }
-        const q = E.current;
-        if (q && I) {
-          const e = Ft.current;
-          let i = "";
-          if (de.current) i = "crosshair";
-          else if (ce.current) i = "crosshair";
-          else if (e.edgeIds.size > 0 && l === "select") {
-            const y = G.filter((p) => e.edgeIds.has(p.id)), f = /* @__PURE__ */ new Map();
+        const O = E.current;
+        if (O && I) {
+          const e = Yt.current;
+          let c = "";
+          if (de.current) c = "crosshair";
+          else if (ie.current) c = "crosshair";
+          else if (e.edgeIds.size > 0 && u === "select") {
+            const y = P.filter((p) => e.edgeIds.has(p.id)), f = /* @__PURE__ */ new Map();
             for (const p of v) f.set(p.id, p);
-            const x = Math.min(10 / C, 14);
-            (Ye(s.x, s.y, y, x) || Xe(s.x, s.y, y, f, x)) && (i = "grab");
+            const x = Math.min(10 / N, 14);
+            (Xe(s.x, s.y, y, x) || Fe(s.x, s.y, y, f, x)) && (c = "grab");
           }
-          if (!i && e.nodeIds.size === 1 && l === "select") {
+          if (!c && e.nodeIds.size === 1 && u === "select") {
             const y = v.find((f) => f.id === [...e.nodeIds][0]);
             if (y) {
-              const f = Le(s, y, Math.min(10 / C, 16));
-              f && (i = ln[f]);
+              const f = Ae(s, y, Math.min(10 / N, 16));
+              f && (c = un[f]);
             }
           }
-          if (!i && l === "select") {
-            const y = L.current.lines, f = Math.min(8 / C, 12);
-            for (const x of y) if (Fe(s.x, s.y, x, f)) {
-              i = "move";
+          if (!c && u === "select") {
+            const y = A.current.lines, f = Math.min(8 / N, 12);
+            for (const x of y) if (_e(s.x, s.y, x, f)) {
+              c = "move";
               break;
             }
           }
-          q.style.cursor = i;
+          O.style.cursor = c;
         }
         if (pt.current?.active) {
-          const e = pt.current, i = s.x - e.startWorld.x, y = s.y - e.startWorld.y, f = fn(e.startBounds, e.handle, i, y), x = L.current.nodes, p = ee([{
+          const e = pt.current, c = s.x - e.startWorld.x, y = s.y - e.startWorld.y, f = hn(e.startBounds, e.handle, c, y), x = A.current.nodes, p = ne([{
             id: e.nodeId,
             type: "shapeRect",
             position: {
@@ -814,8 +816,8 @@ function Gn({ onPixiReady: _ }) {
             height: f.h,
             data: {}
           }], x);
-          f.x += p.dx, f.y += p.dy, (e.handle === "ne" || e.handle === "se") && (f.w += p.dx), (e.handle === "se" || e.handle === "sw") && (f.h += p.dy), Ct.current = p.guides;
-          const a = e.startBounds, t = Math.max(f.w, 24), c = Math.max(f.h, 24), n = a.w > 0 ? t / a.w : 1, o = a.h > 0 ? c / a.h : 1;
+          f.x += p.dx, f.y += p.dy, (e.handle === "ne" || e.handle === "se") && (f.w += p.dx), (e.handle === "se" || e.handle === "sw") && (f.h += p.dy), zt.current = p.guides;
+          const a = e.startBounds, t = Math.max(f.w, 24), i = Math.max(f.h, 24), n = a.w > 0 ? t / a.w : 1, o = a.h > 0 ? i / a.h : 1;
           J((r) => {
             const d = r.canvases[V.current];
             return d ? {
@@ -832,7 +834,7 @@ function Gn({ onPixiReady: _ }) {
                         y: f.y
                       },
                       width: t,
-                      height: c
+                      height: i
                     };
                     const g = e.childStarts.get(w.id);
                     return g ? {
@@ -849,9 +851,9 @@ function Gn({ onPixiReady: _ }) {
                     const g = e.childLineStarts.get(w.id);
                     return g ? {
                       ...w,
-                      points: g.map((z) => ({
-                        x: f.x + (z.x - a.x) * n,
-                        y: f.y + (z.y - a.y) * o
+                      points: g.map((C) => ({
+                        x: f.x + (C.x - a.x) * n,
+                        y: f.y + (C.y - a.y) * o
                       }))
                     } : w;
                   }) : d.lines
@@ -862,8 +864,8 @@ function Gn({ onPixiReady: _ }) {
           return;
         }
         if (ut.current?.active) {
-          const e = ut.current, i = L.current.nodes, y = /* @__PURE__ */ new Map();
-          for (const f of i) y.set(f.id, f);
+          const e = ut.current, c = A.current.nodes, y = /* @__PURE__ */ new Map();
+          for (const f of c) y.set(f.id, f);
           J((f) => {
             const x = f.canvases[V.current];
             return x ? {
@@ -875,21 +877,21 @@ function Gn({ onPixiReady: _ }) {
                   edges: x.edges.map((p) => {
                     if (p.id !== e.edgeId) return p;
                     if (e.type === "waypoint") {
-                      const kt = [...p.data.waypoints ?? []];
-                      return e.index < kt.length && (kt[e.index] = {
+                      const Nt = [...p.data.waypoints ?? []];
+                      return e.index < Nt.length && (Nt[e.index] = {
                         x: s.x,
                         y: s.y
                       }), {
                         ...p,
                         data: {
                           ...p.data,
-                          waypoints: kt
+                          waypoints: Nt
                         }
                       };
                     }
                     const a = Mt(p, y);
                     if (!a) return p;
-                    const t = p.data.waypoints ?? [], c = [
+                    const t = p.data.waypoints ?? [], i = [
                       {
                         x: a.sx,
                         y: a.sy
@@ -899,19 +901,19 @@ function Gn({ onPixiReady: _ }) {
                         x: a.tx,
                         y: a.ty
                       }
-                    ], n = c.length - 1, o = [...p.data.bezierControls ?? []];
+                    ], n = i.length - 1, o = [...p.data.bezierControls ?? []];
                     for (; o.length < n; ) o.push(null);
                     const r = e.index;
                     if (r >= n) return p;
-                    const d = c[r], w = c[r + 1], g = o[r], z = Math.hypot(w.x - d.x, w.y - d.y), H = Math.max(30, z * 0.3), h = n - 1, R = r === 0 ? d.x + a.snx * H : d.x + (w.x - d.x) * 0.4, K = r === 0 ? d.y + a.sny * H : d.y, ht = r === h ? w.x + a.tnx * H : w.x - (w.x - d.x) * 0.4, te = r === h ? w.y + a.tny * H : w.y;
+                    const d = i[r], w = i[r + 1], g = o[r], C = Math.hypot(w.x - d.x, w.y - d.y), H = Math.max(30, C * 0.3), h = n - 1, R = r === 0 ? d.x + a.snx * H : d.x + (w.x - d.x) * 0.4, j = r === 0 ? d.y + a.sny * H : d.y, ht = r === h ? w.x + a.tnx * H : w.x - (w.x - d.x) * 0.4, ee = r === h ? w.y + a.tny * H : w.y;
                     return e.type === "bezierC1" ? o[r] = {
                       c1x: s.x,
                       c1y: s.y,
                       c2x: g?.c2x ?? ht,
-                      c2y: g?.c2y ?? te
+                      c2y: g?.c2y ?? ee
                     } : o[r] = {
                       c1x: g?.c1x ?? R,
-                      c1y: g?.c1y ?? K,
+                      c1y: g?.c1y ?? j,
                       c2x: s.x,
                       c2y: s.y
                     }, {
@@ -929,7 +931,7 @@ function Gn({ onPixiReady: _ }) {
           return;
         }
         if (vt.current?.active) {
-          const e = vt.current, i = s.x - e.startWorld.x, y = s.y - e.startWorld.y;
+          const e = vt.current, c = s.x - e.startWorld.x, y = s.y - e.startWorld.y;
           J((f) => {
             const x = f.canvases[V.current];
             return x ? {
@@ -943,7 +945,7 @@ function Gn({ onPixiReady: _ }) {
                     return a ? {
                       ...p,
                       points: a.map((t) => ({
-                        x: t.x + i,
+                        x: t.x + c,
                         y: t.y + y
                       }))
                     } : p;
@@ -955,25 +957,25 @@ function Gn({ onPixiReady: _ }) {
           return;
         }
         if (ft.current?.active) {
-          const e = ft.current, i = s.x - e.startWorld.x, y = s.y - e.startWorld.y, f = L.current.nodes, x = ee(f.filter((t) => e.nodeIds.has(t.id)).map((t) => {
-            const c = e.nodeStarts.get(t.id);
+          const e = ft.current, c = s.x - e.startWorld.x, y = s.y - e.startWorld.y, f = A.current.nodes, x = ne(f.filter((t) => e.nodeIds.has(t.id)).map((t) => {
+            const i = e.nodeStarts.get(t.id);
             return {
               ...t,
               position: {
-                x: c.x + i,
-                y: c.y + y
+                x: i.x + c,
+                y: i.y + y
               }
             };
-          }), f), p = i + x.dx, a = y + x.dy;
-          Ct.current = x.guides, J((t) => {
-            const c = t.canvases[V.current];
-            return c ? {
+          }), f), p = c + x.dx, a = y + x.dy;
+          zt.current = x.guides, J((t) => {
+            const i = t.canvases[V.current];
+            return i ? {
               ...t,
               canvases: {
                 ...t.canvases,
                 [V.current]: {
-                  ...c,
-                  nodes: c.nodes.map((n) => {
+                  ...i,
+                  nodes: i.nodes.map((n) => {
                     const o = e.nodeStarts.get(n.id);
                     return o ? {
                       ...n,
@@ -983,7 +985,7 @@ function Gn({ onPixiReady: _ }) {
                       }
                     } : n;
                   }),
-                  lines: e.linePointStarts ? c.lines.map((n) => {
+                  lines: e.linePointStarts ? i.lines.map((n) => {
                     const o = e.linePointStarts.get(n.id);
                     return o ? {
                       ...n,
@@ -992,59 +994,59 @@ function Gn({ onPixiReady: _ }) {
                         y: r.y + a
                       }))
                     } : n;
-                  }) : c.lines
+                  }) : i.lines
                 }
               }
             } : t;
           });
           return;
         }
-        if (rt.current?.active && Nt.current) {
-          const e = Math.min(rt.current.startScreen.x, m.global.x), i = Math.min(rt.current.startScreen.y, m.global.y), y = Math.abs(m.global.x - rt.current.startScreen.x), f = Math.abs(m.global.y - rt.current.startScreen.y);
-          Nt.current.showMarquee(e, i, y, f);
+        if (rt.current?.active && St.current) {
+          const e = Math.min(rt.current.startScreen.x, m.global.x), c = Math.min(rt.current.startScreen.y, m.global.y), y = Math.abs(m.global.x - rt.current.startScreen.x), f = Math.abs(m.global.y - rt.current.startScreen.y);
+          St.current.showMarquee(e, c, y, f);
         }
         if (ot.current?.active && xt.current) {
-          const e = L.current.nodes.find((i) => i.id === ot.current.sourceNodeId);
+          const e = A.current.nodes.find((c) => c.id === ot.current.sourceNodeId);
           if (e) {
-            const i = gt(e.width, e.height).find((y) => y.id === ot.current.sourceHandleId);
-            if (i) {
-              const y = Ot(i, e), f = y.x, x = y.y;
+            const c = gt(e.width, e.height).find((y) => y.id === ot.current.sourceHandleId);
+            if (c) {
+              const y = Zt(c, e), f = y.x, x = y.y;
               let p = s.x, a = s.y;
-              const t = Ut.current;
+              const t = $t.current;
               if (t && t !== ot.current.sourceNodeId) {
-                const n = L.current.nodes.find((o) => o.id === t);
+                const n = A.current.nodes.find((o) => o.id === t);
                 if (n) {
-                  const o = Dt(gt(n.width, n.height), n, s.x, s.y, 1 / 0);
+                  const o = Et(gt(n.width, n.height), n, s.x, s.y, 1 / 0);
                   if (o) {
-                    const r = Ot(o, n);
+                    const r = Zt(o, n);
                     p = r.x, a = r.y;
                   }
                 }
               }
-              const c = xt.current;
-              c.clear(), c.moveTo(f, x).lineTo(p, a).stroke({
+              const i = xt.current;
+              i.clear(), i.moveTo(f, x).lineTo(p, a).stroke({
                 color: 3900150,
                 width: 2,
                 alpha: 0.6
-              }), c.visible = !0;
+              }), i.visible = !0;
             }
           }
         }
         if (dt.current?.active && xt.current && !xt.current.destroyed) {
-          const e = dt.current, i = L.current.nodes.find((y) => y.id === e.fixedNodeId);
-          if (i) {
-            const y = gt(i.width, i.height).find((o) => o.id === e.fixedHandleId), f = y ? Ot(y, i) : {
-              x: i.position.x + i.width / 2,
-              y: i.position.y + i.height / 2
+          const e = dt.current, c = A.current.nodes.find((y) => y.id === e.fixedNodeId);
+          if (c) {
+            const y = gt(c.width, c.height).find((o) => o.id === e.fixedHandleId), f = y ? Zt(y, c) : {
+              x: c.position.x + c.width / 2,
+              y: c.position.y + c.height / 2
             }, x = f.x, p = f.y;
             let a = s.x, t = s.y;
-            const c = Ut.current;
-            if (c && c !== e.fixedNodeId) {
-              const o = L.current.nodes.find((r) => r.id === c);
+            const i = $t.current;
+            if (i && i !== e.fixedNodeId) {
+              const o = A.current.nodes.find((r) => r.id === i);
               if (o) {
-                const r = Dt(gt(o.width, o.height), o, s.x, s.y, 1 / 0);
+                const r = Et(gt(o.width, o.height), o, s.x, s.y, 1 / 0);
                 if (r) {
-                  const d = Ot(r, o);
+                  const d = Zt(r, o);
                   a = d.x, t = d.y;
                 }
               }
@@ -1059,9 +1061,9 @@ function Gn({ onPixiReady: _ }) {
         }
       });
       const bt = () => {
-        Ct.current = [];
+        zt.current = [];
         try {
-          $t.current?.clear();
+          Jt.current?.clear();
         } catch {
         }
         try {
@@ -1071,7 +1073,7 @@ function Gn({ onPixiReady: _ }) {
         }
         E.current && (E.current.style.cursor = "");
       };
-      it.on("pointerup", (m) => {
+      ct.on("pointerup", (m) => {
         if (bt(), ut.current?.active) {
           ut.current = null;
           return;
@@ -1085,44 +1087,44 @@ function Gn({ onPixiReady: _ }) {
           return;
         }
         if (ft.current?.active && (ft.current = null, le.current()), rt.current?.active) {
-          const s = st.current(rt.current.startScreen.x, rt.current.startScreen.y), l = st.current(m.global.x, m.global.y), v = Math.min(s.x, l.x), G = Math.min(s.y, l.y), C = Math.abs(l.x - s.x), I = Math.abs(l.y - s.y);
-          if (C > 4 && I > 4) {
-            const S = L.current.nodes.filter((e) => Qe(v, G, C, I, e.position.x, e.position.y, e.width, e.height)), q = L.current.lines.filter((e) => e.points.length === 0 ? !1 : e.points.every((i) => i.x >= v && i.x <= v + C && i.y >= G && i.y <= G + I));
+          const s = st.current(rt.current.startScreen.x, rt.current.startScreen.y), u = st.current(m.global.x, m.global.y), v = Math.min(s.x, u.x), P = Math.min(s.y, u.y), N = Math.abs(u.x - s.x), I = Math.abs(u.y - s.y);
+          if (N > 4 && I > 4) {
+            const S = A.current.nodes.filter((e) => tn(v, P, N, I, e.position.x, e.position.y, e.width, e.height)), O = A.current.lines.filter((e) => e.points.length === 0 ? !1 : e.points.every((c) => c.x >= v && c.x <= v + N && c.y >= P && c.y <= P + I));
             lt({
               nodeIds: new Set(S.map((e) => e.id)),
               edgeIds: /* @__PURE__ */ new Set(),
-              lineIds: new Set(q.map((e) => e.id))
+              lineIds: new Set(O.map((e) => e.id))
             });
           }
-          rt.current = null, Nt.current?.hideMarquee();
+          rt.current = null, St.current?.hideMarquee();
         }
         if (dt.current?.active) {
-          const s = dt.current.edgeId, l = dt.current.movingEnd, v = dt.current.fixedNodeId;
+          const s = dt.current.edgeId, u = dt.current.movingEnd, v = dt.current.fixedNodeId;
           dt.current = null;
-          const G = st.current(m.global.x, m.global.y), C = L.current.nodes;
+          const P = st.current(m.global.x, m.global.y), N = A.current.nodes;
           let I = null;
-          for (let S = C.length - 1; S >= 0; S--) if (Ht(G.x, G.y, C[S]) && C[S].id !== v) {
-            I = C[S];
+          for (let S = N.length - 1; S >= 0; S--) if (Dt(P.x, P.y, N[S]) && N[S].id !== v) {
+            I = N[S];
             break;
           }
           if (I) {
-            const S = I.id, q = Dt(gt(I.width, I.height), I, G.x, G.y, 1 / 0)?.id;
+            const S = I.id, O = Et(gt(I.width, I.height), I, P.x, P.y, 1 / 0)?.id;
             J((e) => {
-              const i = e.canvases[V.current];
-              return i ? {
+              const c = e.canvases[V.current];
+              return c ? {
                 ...e,
                 canvases: {
                   ...e.canvases,
                   [V.current]: {
-                    ...i,
-                    edges: i.edges.map((y) => y.id !== s ? y : l === "source" ? {
+                    ...c,
+                    edges: c.edges.map((y) => y.id !== s ? y : u === "source" ? {
                       ...y,
                       source: S,
-                      sourceHandle: q
+                      sourceHandle: O
                     } : {
                       ...y,
                       target: S,
-                      targetHandle: q
+                      targetHandle: O
                     })
                   }
                 }
@@ -1132,33 +1134,33 @@ function Gn({ onPixiReady: _ }) {
           return;
         }
         if (ot.current?.active) {
-          const s = ot.current.sourceNodeId, l = ot.current.sourceHandleId;
+          const s = ot.current.sourceNodeId, u = ot.current.sourceHandleId;
           ot.current = null;
-          const v = st.current(m.global.x, m.global.y), G = L.current.nodes;
-          let C = null;
-          for (let I = G.length - 1; I >= 0; I--) if (Ht(v.x, v.y, G[I]) && G[I].id !== s) {
-            C = G[I];
+          const v = st.current(m.global.x, m.global.y), P = A.current.nodes;
+          let N = null;
+          for (let I = P.length - 1; I >= 0; I--) if (Dt(v.x, v.y, P[I]) && P[I].id !== s) {
+            N = P[I];
             break;
           }
-          if (C) {
-            const I = C.id, S = Dt(gt(C.width, C.height), C, v.x, v.y, 1 / 0)?.id, q = `edge_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 6)}`, e = Se.current;
-            J((i) => {
-              const y = i.canvases[V.current];
-              return !y || y.edges.some((f) => f.source === s && f.target === I && f.sourceHandle === l && f.targetHandle === S) ? i : {
-                ...i,
+          if (N) {
+            const I = N.id, S = Et(gt(N.width, N.height), N, v.x, v.y, 1 / 0)?.id, O = `edge_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 6)}`, e = ze.current;
+            J((c) => {
+              const y = c.canvases[V.current];
+              return !y || y.edges.some((f) => f.source === s && f.target === I && f.sourceHandle === u && f.targetHandle === S) ? c : {
+                ...c,
                 canvases: {
-                  ...i.canvases,
+                  ...c.canvases,
                   [V.current]: {
                     ...y,
                     edges: [...y.edges, {
-                      id: q,
+                      id: O,
                       source: s,
                       target: I,
-                      sourceHandle: l,
+                      sourceHandle: u,
                       targetHandle: S,
                       type: e,
                       data: {
-                        strokeColor: "#374151",
+                        strokeColor: "theme:base-content",
                         strokeWidth: 2,
                         lineStyle: "solid",
                         markerEnd: "arrowclosed"
@@ -1170,49 +1172,49 @@ function Gn({ onPixiReady: _ }) {
             });
           }
         }
-      }), it.on("pointerupoutside", () => {
-        bt(), ft.current?.active && le.current(), ft.current = null, pt.current = null, rt.current = null, dt.current = null, ot.current = null, ut.current = null, vt.current = null, Nt.current?.hideMarquee();
-      }), it.on("rightclick", (m) => {
+      }), ct.on("pointerupoutside", () => {
+        bt(), ft.current?.active && le.current(), ft.current = null, pt.current = null, rt.current = null, dt.current = null, ot.current = null, ut.current = null, vt.current = null, St.current?.hideMarquee();
+      }), ct.on("rightclick", (m) => {
         if (m.preventDefault?.(), $.current?.didRightPan) return;
-        const s = st.current(m.global.x, m.global.y), l = L.current.nodes;
+        const s = st.current(m.global.x, m.global.y), u = A.current.nodes;
         let v = null;
-        for (let S = l.length - 1; S >= 0; S--) if (Ht(s.x, s.y, l[S])) {
-          v = l[S].id;
+        for (let S = u.length - 1; S >= 0; S--) if (Dt(s.x, s.y, u[S])) {
+          v = u[S].id;
           break;
         }
-        const G = m.nativeEvent, C = G?.clientX ?? m.global.x, I = G?.clientY ?? m.global.y;
-        re({
-          x: C,
+        const P = m.nativeEvent, N = P?.clientX ?? m.global.x, I = P?.clientY ?? m.global.y;
+        Bt({
+          x: N,
           y: I,
           nodeId: v
         });
-      }), it.on("pointertap", (m) => {
+      }), ct.on("pointertap", (m) => {
         if (m.button !== 0) return;
-        const s = Date.now(), l = st.current(m.global.x, m.global.y), v = Yt.current, G = l.x - v.wx, C = l.y - v.wy;
-        if (s - v.time < 400 && Math.abs(G) < 10 && Math.abs(C) < 10) {
-          const I = L.current.nodes;
-          for (let i = I.length - 1; i >= 0; i--) if (Ht(l.x, l.y, I[i])) {
-            const y = I[i], f = y.data.childCanvasId;
+        const s = Date.now(), u = st.current(m.global.x, m.global.y), v = Lt.current, P = u.x - v.wx, N = u.y - v.wy;
+        if (s - v.time < 400 && Math.abs(P) < 10 && Math.abs(N) < 10) {
+          const I = A.current.nodes;
+          for (let c = I.length - 1; c >= 0; c--) if (Dt(u.x, u.y, I[c])) {
+            const y = I[c], f = y.data.childCanvasId;
             if (f) {
-              qe(f), Yt.current = {
+              Oe(f), Lt.current = {
                 time: 0,
                 wx: 0,
                 wy: 0
               };
               return;
             }
-            Jt.current("node", y.id, y.data.label ?? ""), Yt.current = {
+            Qt.current("node", y.id, y.data.label ?? ""), Lt.current = {
               time: 0,
               wx: 0,
               wy: 0
             };
             return;
           }
-          const S = L.current.edges, q = /* @__PURE__ */ new Map();
-          for (const i of I) q.set(i.id, i);
+          const S = A.current.edges, O = /* @__PURE__ */ new Map();
+          for (const c of I) O.set(c.id, c);
           const e = $.current?.state.zoom ?? 1;
-          for (let i = S.length - 1; i >= 0; i--) if (we(l.x, l.y, S[i], q, Math.min(8 / e, 12))) {
-            Jt.current("edge", S[i].id, S[i].data.labelText ?? ""), Yt.current = {
+          for (let c = S.length - 1; c >= 0; c--) if (we(u.x, u.y, S[c], O, Math.min(8 / e, 12))) {
+            Qt.current("edge", S[c].id, S[c].data.labelText ?? ""), Lt.current = {
               time: 0,
               wx: 0,
               wy: 0
@@ -1220,39 +1222,39 @@ function Gn({ onPixiReady: _ }) {
             return;
           }
         }
-        Yt.current = {
+        Lt.current = {
           time: s,
-          wx: l.x,
-          wy: l.y
+          wx: u.x,
+          wy: u.y
         };
       });
-      let Qt = !1;
-      u.app.ticker.add((m) => {
-        if (u.destroyed) return;
-        const s = m.deltaMS, l = u.app.screen, v = $.current?.state ?? {
+      let te = !1;
+      l.app.ticker.add((m) => {
+        if (l.destroyed) return;
+        const s = m.deltaMS, u = l.app.screen, v = $.current?.state ?? {
           x: 0,
           y: 0,
           zoom: 1
         };
-        zt.current?.update(v, l.width, l.height);
-        const G = $.current?.isPanning ?? !1;
-        G !== Qt && (Qt = G, E.current && (E.current.style.cursor = G ? "grabbing" : ""));
-        const C = L.current, I = Ft.current, S = cn(Re.current), q = /* @__PURE__ */ new Map();
-        S.forEach((a, t) => q.set(a.node.id, t + 1)), Bt.current?.advanceAnimation(s);
-        const e = Et.current ? S[Et.current.current] : void 0;
-        Bt.current?.sync(C.nodes, I.nodeIds, Ut.current, q, {
-          showAnchors: ze.current,
-          presentation: Et.current !== null,
+        G.current?.update(v, u.width, u.height);
+        const P = $.current?.isPanning ?? !1;
+        P !== te && (te = P, E.current && (E.current.style.cursor = P ? "grabbing" : ""));
+        const N = A.current, I = Yt.current, S = dn(Se.current), O = /* @__PURE__ */ new Map();
+        S.forEach((a, t) => O.set(a.node.id, t + 1)), Kt.current?.advanceAnimation(s);
+        const e = Ct.current ? S[Ct.current.current] : void 0;
+        Kt.current?.sync(N.nodes, I.nodeIds, $t.current, O, {
+          showAnchors: Ce.current,
+          presentation: Ct.current !== null,
           presentationAnchorId: e?.node.id,
-          presentationAnchorVisible: Et.current?.showAnchor ?? !1
+          presentationAnchorVisible: Ct.current?.showAnchor ?? !1
         });
-        const i = /* @__PURE__ */ new Map();
-        for (const a of C.nodes) i.set(a.id, a);
-        Kt.current?.advanceAnimation(s), Kt.current?.sync(C.edges, i, I.edgeIds, null, { presentation: Et.current !== null }), jt.current?.advanceAnimation(s), jt.current?.sync(C.lines, I.lineIds), $t.current?.update(Ct.current, l.width, l.height, v);
-        const y = Lt.current;
+        const c = /* @__PURE__ */ new Map();
+        for (const a of N.nodes) c.set(a.id, a);
+        jt.current?.advanceAnimation(s), jt.current?.sync(N.edges, c, I.edgeIds, null, { presentation: Ct.current !== null }), Ut.current?.advanceAnimation(s), Ut.current?.sync(N.lines, I.lineIds), Jt.current?.update(zt.current, u.width, u.height, v);
+        const y = Gt.current;
         if (y) {
           y.clear();
-          const a = ce.current;
+          const a = ie.current;
           a && (y.circle(a.wx, a.wy, 10).fill({
             color: 3900150,
             alpha: 0.12
@@ -1277,23 +1279,23 @@ function Gn({ onPixiReady: _ }) {
             alpha: 0.9
           }));
         }
-        const f = Xt.current;
+        const f = At.current;
         if (f) {
           f.clear();
           const a = ae.current;
           if (a) {
-            const t = be.current, c = t.x - a.width / 2, n = t.y - a.height / 2, o = ee([{
+            const t = Me.current, i = t.x - a.width / 2, n = t.y - a.height / 2, o = ne([{
               id: "__ghost__",
               type: a.type,
               position: {
-                x: c,
+                x: i,
                 y: n
               },
               width: a.width,
               height: a.height,
               data: {}
-            }], C.nodes);
-            Ct.current = o.guides, f.position.set(c + o.dx, n + o.dy), (Pe[a.type] ?? Pe.shapeRect)(f, {
+            }], N.nodes);
+            zt.current = o.guides, f.position.set(i + o.dx, n + o.dy), (Ge[a.type] ?? Ge.shapeRect)(f, {
               width: a.width,
               height: a.height,
               fill: "#3b82f6",
@@ -1302,22 +1304,22 @@ function Gn({ onPixiReady: _ }) {
               borderStyle: a.data.borderStyle
             });
           } else
-            f.position.set(0, 0), !ft.current?.active && !pt.current?.active && (Ct.current = []);
+            f.position.set(0, 0), !ft.current?.active && !pt.current?.active && (zt.current = []);
         }
-        const x = At.current;
-        if (x && (x.clear(), I.edgeIds.size > 0 && _t.current === "select")) {
+        const x = Wt.current;
+        if (x && (x.clear(), I.edgeIds.size > 0 && Xt.current === "select")) {
           const a = 1 / v.zoom;
-          for (const t of C.edges) {
+          for (const t of N.edges) {
             if (!I.edgeIds.has(t.id)) continue;
-            const c = t.data.waypoints;
-            if (c) for (const n of c) x.circle(n.x, n.y, 5 * a).fill({ color: 16777215 }).stroke({
+            const i = t.data.waypoints;
+            if (i) for (const n of i) x.circle(n.x, n.y, 5 * a).fill({ color: 16777215 }).stroke({
               color: 3900150,
               width: 1.5 * a
             });
             if (t.type === "simplebezier") {
-              const n = Mt(t, i);
+              const n = Mt(t, c);
               if (!n) continue;
-              const o = c ?? [], r = [
+              const o = i ?? [], r = [
                 {
                   x: n.sx,
                   y: n.sy
@@ -1329,19 +1331,19 @@ function Gn({ onPixiReady: _ }) {
                 }
               ], d = t.data.bezierControls, w = r.length - 2;
               for (let g = 0; g <= w; g++) {
-                const z = r[g], H = r[g + 1], h = d?.[g], R = Math.hypot(H.x - z.x, H.y - z.y), K = Math.max(30, R * 0.3), ht = h?.c1x ?? (g === 0 ? z.x + n.snx * K : z.x + (H.x - z.x) * 0.4), te = h?.c1y ?? (g === 0 ? z.y + n.sny * K : z.y), kt = h?.c2x ?? (g === w ? H.x + n.tnx * K : H.x - (H.x - z.x) * 0.4), He = h?.c2y ?? (g === w ? H.y + n.tny * K : H.y);
-                x.moveTo(z.x, z.y).lineTo(ht, te).stroke({
+                const C = r[g], H = r[g + 1], h = d?.[g], R = Math.hypot(H.x - C.x, H.y - C.y), j = Math.max(30, R * 0.3), ht = h?.c1x ?? (g === 0 ? C.x + n.snx * j : C.x + (H.x - C.x) * 0.4), ee = h?.c1y ?? (g === 0 ? C.y + n.sny * j : C.y), Nt = h?.c2x ?? (g === w ? H.x + n.tnx * j : H.x - (H.x - C.x) * 0.4), Te = h?.c2y ?? (g === w ? H.y + n.tny * j : H.y);
+                x.moveTo(C.x, C.y).lineTo(ht, ee).stroke({
                   color: 10265519,
                   width: 1 * a
-                }), x.moveTo(H.x, H.y).lineTo(kt, He).stroke({
+                }), x.moveTo(H.x, H.y).lineTo(Nt, Te).stroke({
                   color: 10265519,
                   width: 1 * a
                 });
-                const Te = 4 * a;
-                x.circle(ht, te, Te).fill({ color: 16777215 }).stroke({
+                const Pe = 4 * a;
+                x.circle(ht, ee, Pe).fill({ color: 16777215 }).stroke({
                   color: 3900150,
                   width: 1.5 * a
-                }), x.circle(kt, He, Te).fill({ color: 16777215 }).stroke({
+                }), x.circle(Nt, Te, Pe).fill({ color: 16777215 }).stroke({
                   color: 3900150,
                   width: 1.5 * a
                 });
@@ -1349,22 +1351,22 @@ function Gn({ onPixiReady: _ }) {
             }
           }
         }
-        const p = Wt.current;
-        if (p && (p.clear(), I.nodeIds.size === 1 && _t.current === "select")) {
-          const a = [...I.nodeIds][0], t = C.nodes.find((c) => c.id === a);
+        const p = Pt.current;
+        if (p && (p.clear(), I.nodeIds.size === 1 && Xt.current === "select")) {
+          const a = [...I.nodeIds][0], t = N.nodes.find((i) => i.id === a);
           if (t) {
-            const c = v.zoom, n = t.position.x * c + v.x, o = t.position.y * c + v.y, r = t.width * c, d = t.height * c;
+            const i = v.zoom, n = t.position.x * i + v.x, o = t.position.y * i + v.y, r = t.width * i, d = t.height * i;
             p.rect(n, o, r, d).stroke({
               color: 3900150,
               width: 1.5
             });
-            const w = 7, g = w / 2, z = [
+            const w = 7, g = w / 2, C = [
               [n, o],
               [n + r, o],
               [n + r, o + d],
               [n, o + d]
             ];
-            for (const [R, K] of z) p.rect(R - g, K - g, w, w).fill({ color: 16777215 }).stroke({
+            for (const [R, j] of C) p.rect(R - g, j - g, w, w).fill({ color: 16777215 }).stroke({
               color: 3900150,
               width: 1.5
             });
@@ -1374,7 +1376,7 @@ function Gn({ onPixiReady: _ }) {
               [n + r / 2, o + d],
               [n, o + d / 2]
             ];
-            for (const [R, K] of h) p.circle(R, K, H).fill({
+            for (const [R, j] of h) p.circle(R, j, H).fill({
               color: 3900150,
               alpha: 0.9
             });
@@ -1382,55 +1384,55 @@ function Gn({ onPixiReady: _ }) {
         }
       });
     };
-    return A(), () => {
-      if (P = !0, u && !u.destroyed) try {
-        u.app.stage.removeAllListeners();
+    return Y(), () => {
+      if (T = !0, l && !l.destroyed) try {
+        l.app.stage.removeAllListeners();
       } catch {
       }
-      zt.current?.destroy(), Nt.current?.destroy(), Bt.current?.destroy(), Kt.current?.destroy(), jt.current?.destroy(), se.current?.destroy(), ie.current?.destroy(), xt.current?.destroy(), Wt.current && (Wt.current.destroy(), Wt.current = null), Lt.current && (Lt.current.destroy(), Lt.current = null), At.current && (At.current.destroy(), At.current = null), Xt.current && (Xt.current.destroy(), Xt.current = null), $t.current?.destroy();
+      G.current?.destroy(), St.current?.destroy(), Kt.current?.destroy(), jt.current?.destroy(), Ut.current?.destroy(), se.current?.destroy(), ce.current?.destroy(), xt.current?.destroy(), Pt.current && (Pt.current.destroy(), Pt.current = null), Gt.current && (Gt.current.destroy(), Gt.current = null), Wt.current && (Wt.current.destroy(), Wt.current = null), At.current && (At.current.destroy(), At.current = null), Jt.current?.destroy();
     };
-  }, [X.current]), wt(() => {
-    const u = se.current, P = ie.current;
-    if (!(!u || !P))
-      switch (u.deactivate(), P.deactivate(), tt) {
+  }, [D.current]), wt(() => {
+    const l = se.current, T = ce.current;
+    if (!(!l || !T))
+      switch (l.deactivate(), T.deactivate(), K) {
         case "freehand":
-          u.activate();
+          l.activate();
           break;
         case "line":
-          P.activate("straight");
+          T.activate("straight");
           break;
         case "polyline":
-          P.activate("polyline");
+          T.activate("polyline");
           break;
         case "arrow":
-          P.activate("arrow");
+          T.activate("arrow");
           break;
       }
-  }, [tt]), wt(() => {
-    zt.current && (zt.current.visible = M, zt.current.gridSize = j);
-  }, [M, j]), wt(() => {
-    const u = E.current;
-    if (!u) return;
-    const P = 1e-3, A = (W) => {
-      W.preventDefault();
-      const Z = $.current;
-      if (!Z) return;
-      const Y = u.getBoundingClientRect(), B = W.clientX - Y.left, Q = W.clientY - Y.top, it = W.ctrlKey ? 3 : 1, bt = -W.deltaY * P * it;
-      Z.zoomAt(B, Q, 1 + bt);
+  }, [K]), wt(() => {
+    G.current && (G.current.visible = U, G.current.gridSize = tt);
+  }, [U, tt]), wt(() => {
+    const l = E.current;
+    if (!l) return;
+    const T = 1e-3, Y = (L) => {
+      L.preventDefault();
+      const q = $.current;
+      if (!q) return;
+      const X = l.getBoundingClientRect(), B = L.clientX - X.left, Q = L.clientY - X.top, ct = L.ctrlKey ? 3 : 1, bt = -L.deltaY * T * ct;
+      q.zoomAt(B, Q, 1 + bt);
     };
-    return u.addEventListener("wheel", A, { passive: !1 }), () => u.removeEventListener("wheel", A);
-  }, [$]), /* @__PURE__ */ an("div", {
+    return l.addEventListener("wheel", Y, { passive: !1 }), () => l.removeEventListener("wheel", Y);
+  }, [$]), /* @__PURE__ */ ln("div", {
     style: {
       position: "relative",
       width: "100%",
       height: "100%"
     },
-    children: [/* @__PURE__ */ We("div", {
+    children: [/* @__PURE__ */ Le("div", {
       ref: E,
       className: "flow-canvas-wrapper",
       tabIndex: -1,
-      onContextMenu: (u) => u.preventDefault()
-    }), at && ye && /* @__PURE__ */ We("input", {
+      onContextMenu: (l) => l.preventDefault()
+    }), at && ye && /* @__PURE__ */ Le("input", {
       className: "flow-label-editor",
       autoFocus: !0,
       defaultValue: at.value,
@@ -1438,16 +1440,16 @@ function Gn({ onPixiReady: _ }) {
         left: ye.x,
         top: ye.y
       },
-      onKeyDown: (u) => {
-        u.key === "Enter" ? (u.preventDefault(), Ee(u.target.value)) : u.key === "Escape" && (u.preventDefault(), Oe()), u.stopPropagation();
+      onKeyDown: (l) => {
+        l.key === "Enter" ? (l.preventDefault(), De(l.target.value)) : l.key === "Escape" && (l.preventDefault(), Ve()), l.stopPropagation();
       },
-      onBlur: (u) => Ee(u.target.value),
-      onPointerDown: (u) => u.stopPropagation()
+      onBlur: (l) => De(l.target.value),
+      onPointerDown: (l) => l.stopPropagation()
     })]
   });
 }
 export {
-  Gn as default
+  Wn as default
 };
 
 //# sourceMappingURL=FlowCanvas.js.map