dishui 0.0.59 → 0.0.60

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

@@ -1,489 +1,525 @@
-import { useFlowContext as ln } from "./context/FlowContext.js";
-import { useFlowUI as un } from "./context/FlowUIContext.js";
-import { usePixiApp as fn } from "./hooks/usePixiApp.js";
-import { useViewport as hn } from "./hooks/useViewport.js";
-import { GridRenderer as yn } from "./canvas/GridRenderer.js";
-import { SelectionOverlay as pn } from "./canvas/SelectionOverlay.js";
-import { shapeDrawers as je } from "./nodes/shapes.js";
-import { findClosestHandleWorld as At, getHandlePositions as It, handleWorldPos as Wt } from "./nodes/NodeHandles.js";
-import { distToSegment as Ne, generateId as xn, isPointInNode as Yt, rectsOverlap as gn } from "./nodes/nodeUtils.js";
-import { NodeRenderer as wn } from "./nodes/NodeRenderer.js";
-import { buildEdgePath as sn, linearizeSegments as cn, resolveEdgeEndpoints as Mt } from "./edges/edgePaths.js";
-import { EdgeRenderer as mn } from "./edges/EdgeRenderer.js";
-import { LineRenderer as vn } from "./lines/LineRenderer.js";
-import { FreehandTool as In } from "./lines/FreehandTool.js";
-import { GeometricLineTool as bn } from "./lines/GeometricLineTool.js";
-import { computeAlignmentSnap as le } from "./hooks/useAlignmentGuides.js";
-import { AlignmentGuidesRenderer as Mn } from "./canvas/AlignmentGuides.js";
-import { getDocumentSlides as Rn, nextAnimIndex as Sn } from "./nodes/animAnchors.js";
-import { useCallback as Jt, useEffect as bt, useRef as I, useState as $e } from "react";
-import { jsx as Ce, jsxs as Je } from "react/jsx-runtime";
-import { Graphics as Qt } from "pixi.js";
-var zn = {
+import { useFlowContext as Mn } from "./context/FlowContext.js";
+import { useFlowUI as Rn } from "./context/FlowUIContext.js";
+import { usePixiApp as Sn } from "./hooks/usePixiApp.js";
+import { useViewport as zn } from "./hooks/useViewport.js";
+import { GridRenderer as En } from "./canvas/GridRenderer.js";
+import { SelectionOverlay as Cn } from "./canvas/SelectionOverlay.js";
+import { shapeDrawers as an } from "./nodes/shapes.js";
+import { findClosestHandleWorld as _t, getHandlePositions as Mt, handleWorldPos as Ot } from "./nodes/NodeHandles.js";
+import { distToSegment as Le, generateId as Nn, isPointInNode as Ft, rectsOverlap as kn } from "./nodes/nodeUtils.js";
+import { NodeRenderer as Tn } from "./nodes/NodeRenderer.js";
+import { buildEdgePath as wn, linearizeSegments as mn, resolveEdgeEndpoints as St } from "./edges/edgePaths.js";
+import { EdgeRenderer as Dn } from "./edges/EdgeRenderer.js";
+import { LineRenderer as Hn } from "./lines/LineRenderer.js";
+import { FreehandTool as Pn } from "./lines/FreehandTool.js";
+import { GeometricLineTool as An } from "./lines/GeometricLineTool.js";
+import { computeAlignmentSnap as xe } from "./hooks/useAlignmentGuides.js";
+import { AlignmentGuidesRenderer as Ln } from "./canvas/AlignmentGuides.js";
+import { getDocumentSlides as Gn, nextAnimIndex as Wn } from "./nodes/animAnchors.js";
+import { useDeleteSelection as Yn } from "./hooks/useDeleteSelection.js";
+import { useCallback as ie, useEffect as Rt, useRef as b, useState as ln } from "react";
+import { jsx as Bt, jsxs as ge } from "react/jsx-runtime";
+import { Graphics as de } from "pixi.js";
+var Xn = {
   nw: "nwse-resize",
   ne: "nesw-resize",
   se: "nwse-resize",
   sw: "nesw-resize"
-}, ue = typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(pointer: coarse)").matches, Qe = ue ? 2 : 1;
-function $(_, S, H) {
-  return Math.min(S * Qe / _, H * Qe);
+}, we = typeof window < "u" && typeof window.matchMedia == "function" && window.matchMedia("(pointer: coarse)").matches, un = we ? 2 : 1;
+function J(A, M, D) {
+  return Math.min(M * un / A, D * un);
 }
-function tn(_, S, H) {
-  const { x: V, y: E } = S.position, L = S.width, D = S.height, C = [
+var vn = 26;
+function fn(A, M) {
+  return {
+    x: A.position.x + A.width / 2,
+    y: A.position.y - vn / M
+  };
+}
+function Vt(A, M, D) {
+  return !D || !(M > 0) ? A : Math.round(A / M) * M;
+}
+function hn(A, M, D) {
+  const { x: U, y: T } = M.position, G = M.width, P = M.height, C = [
     [
       "nw",
-      V,
-      E
+      U,
+      T
     ],
     [
       "ne",
-      V + L,
-      E
+      U + G,
+      T
     ],
     [
       "se",
-      V + L,
-      E + D
+      U + G,
+      T + P
     ],
     [
       "sw",
-      V,
-      E + D
+      U,
+      T + P
     ]
   ];
-  let M = null, q = H;
-  for (const [j, at, nt] of C) {
-    const K = Math.hypot(_.x - at, _.y - nt);
-    K < q && (q = K, M = j);
+  let z = null, q = D;
+  for (const [j, lt, tt] of C) {
+    const $ = Math.hypot(A.x - lt, A.y - tt);
+    $ < q && (q = $, z = j);
   }
-  return M;
+  return z;
 }
-function en(_, S, H, V, E) {
-  let L = null, D = E;
-  for (const C of H) {
-    const M = Mt(C, V);
-    if (!M) continue;
-    const q = Math.hypot(_ - M.sx, S - M.sy);
-    q < D && (D = q, L = {
+function yn(A, M, D, U, T) {
+  let G = null, P = T;
+  for (const C of D) {
+    const z = St(C, U);
+    if (!z) continue;
+    const q = Math.hypot(A - z.sx, M - z.sy);
+    q < P && (P = q, G = {
       edgeId: C.id,
       end: "source",
-      worldX: M.sx,
-      worldY: M.sy
+      worldX: z.sx,
+      worldY: z.sy
     });
-    const j = Math.hypot(_ - M.tx, S - M.ty);
-    j < D && (D = j, L = {
+    const j = Math.hypot(A - z.tx, M - z.ty);
+    j < P && (P = j, G = {
       edgeId: C.id,
       end: "target",
-      worldX: M.tx,
-      worldY: M.ty
+      worldX: z.tx,
+      worldY: z.ty
     });
   }
-  return L;
+  return G;
 }
-function nn(_, S, H, V) {
-  let E = null, L = V;
-  for (const D of H) {
-    const C = D.data.waypoints;
+function pn(A, M, D, U) {
+  let T = null, G = U;
+  for (const P of D) {
+    const C = P.data.waypoints;
     if (C)
-      for (let M = 0; M < C.length; M++) {
-        const q = Math.hypot(_ - C[M].x, S - C[M].y);
-        q < L && (L = q, E = {
-          edgeId: D.id,
-          waypointIndex: M,
-          wx: C[M].x,
-          wy: C[M].y
+      for (let z = 0; z < C.length; z++) {
+        const q = Math.hypot(A - C[z].x, M - C[z].y);
+        q < G && (G = q, T = {
+          edgeId: P.id,
+          waypointIndex: z,
+          wx: C[z].x,
+          wy: C[z].y
         });
       }
   }
-  return E;
+  return T;
 }
-function rn(_, S, H, V, E) {
-  let L = null, D = E;
-  for (const C of H) {
+function xn(A, M, D, U, T) {
+  let G = null, P = T;
+  for (const C of D) {
     if (C.type !== "simplebezier") continue;
-    const M = Mt(C, V);
-    if (!M) continue;
+    const z = St(C, U);
+    if (!z) continue;
     const q = C.data.waypoints ?? [], j = [
       {
-        x: M.sx,
-        y: M.sy
+        x: z.sx,
+        y: z.sy
       },
       ...q,
       {
-        x: M.tx,
-        y: M.ty
+        x: z.tx,
+        y: z.ty
       }
-    ], at = C.data.bezierControls, nt = j.length - 2;
-    for (let K = 0; K <= nt; K++) {
-      const rt = j[K], ot = j[K + 1], Rt = at?.[K], Xt = Math.hypot(ot.x - rt.x, ot.y - rt.y), Tt = Math.max(30, Xt * 0.3), te = Rt?.c1x ?? (K === 0 ? rt.x + M.snx * Tt : rt.x + (ot.x - rt.x) * 0.4), _t = Rt?.c1y ?? (K === 0 ? rt.y + M.sny * Tt : rt.y), Ft = Rt?.c2x ?? (K === nt ? ot.x + M.tnx * Tt : ot.x - (ot.x - rt.x) * 0.4), St = Rt?.c2y ?? (K === nt ? ot.y + M.tny * Tt : ot.y), zt = Math.hypot(_ - te, S - _t);
-      zt < D && (D = zt, L = {
+    ], lt = C.data.bezierControls, tt = j.length - 2;
+    for (let $ = 0; $ <= tt; $++) {
+      const rt = j[$], ot = j[$ + 1], zt = lt?.[$], qt = Math.hypot(ot.x - rt.x, ot.y - rt.y), At = Math.max(30, qt * 0.3), ae = zt?.c1x ?? ($ === 0 ? rt.x + z.snx * At : rt.x + (ot.x - rt.x) * 0.4), Zt = zt?.c1y ?? ($ === 0 ? rt.y + z.sny * At : rt.y), Kt = zt?.c2x ?? ($ === tt ? ot.x + z.tnx * At : ot.x - (ot.x - rt.x) * 0.4), Et = zt?.c2y ?? ($ === tt ? ot.y + z.tny * At : ot.y), Ct = Math.hypot(A - ae, M - Zt);
+      Ct < P && (P = Ct, G = {
         edgeId: C.id,
-        segmentIndex: K,
+        segmentIndex: $,
         controlEnd: "c1",
-        wx: te,
-        wy: _t
+        wx: ae,
+        wy: Zt
       });
-      const pt = Math.hypot(_ - Ft, S - St);
-      pt < D && (D = pt, L = {
+      const gt = Math.hypot(A - Kt, M - Et);
+      gt < P && (P = gt, G = {
         edgeId: C.id,
-        segmentIndex: K,
+        segmentIndex: $,
         controlEnd: "c2",
-        wx: Ft,
-        wy: St
+        wx: Kt,
+        wy: Et
       });
     }
   }
-  return L;
+  return G;
 }
-function Cn(_, S, H, V) {
-  const E = Mt(H, V);
-  if (!E) return 0;
-  const L = H.data.waypoints ?? [], D = [
+function _n(A, M, D, U) {
+  const T = St(D, U);
+  if (!T) return 0;
+  const G = D.data.waypoints ?? [], P = [
     {
-      x: E.sx,
-      y: E.sy
+      x: T.sx,
+      y: T.sy
     },
-    ...L,
+    ...G,
     {
-      x: E.tx,
-      y: E.ty
+      x: T.tx,
+      y: T.ty
     }
   ];
-  let C = 1 / 0, M = 0;
-  for (let q = 0; q < D.length - 1; q++) {
-    const j = Ne(_, S, D[q].x, D[q].y, D[q + 1].x, D[q + 1].y);
-    j < C && (C = j, M = q);
+  let C = 1 / 0, z = 0;
+  for (let q = 0; q < P.length - 1; q++) {
+    const j = Le(A, M, P[q].x, P[q].y, P[q + 1].x, P[q + 1].y);
+    j < C && (C = j, z = q);
   }
-  return M;
+  return z;
 }
-function En(_, S, H, V, E = 24) {
-  let { x: L, y: D, w: C, h: M } = { ..._ };
-  const q = S === "nw" || S === "sw", j = S === "ne" || S === "se", at = S === "nw" || S === "ne", nt = S === "sw" || S === "se";
-  return q && (L += H, C -= H), j && (C += H), at && (D += V, M -= V), nt && (M += V), C < E && (q && (L = _.x + _.w - E), C = E), M < E && (at && (D = _.y + _.h - E), M = E), {
-    x: L,
-    y: D,
+function On(A, M, D, U, T = 24) {
+  let { x: G, y: P, w: C, h: z } = { ...A };
+  const q = M === "nw" || M === "sw", j = M === "ne" || M === "se", lt = M === "nw" || M === "ne", tt = M === "sw" || M === "se";
+  return q && (G += D, C -= D), j && (C += D), lt && (P += U, z -= U), tt && (z += U), C < T && (q && (G = A.x + A.w - T), C = T), z < T && (lt && (P = A.y + A.h - T), z = T), {
+    x: G,
+    y: P,
     w: C,
-    h: M
+    h: z
   };
 }
-function Ee(_, S, H, V, E) {
-  const L = Mt(H, V);
-  if (!L) return !1;
-  const D = cn(sn(H.type, L, H.data.waypoints, H.data.bezierControls));
-  for (let C = 0; C < D.length - 1; C++) if (Ne(_, S, D[C].x, D[C].y, D[C + 1].x, D[C + 1].y) < E) return !0;
+function Ae(A, M, D, U, T) {
+  const G = St(D, U);
+  if (!G) return !1;
+  const P = mn(wn(D.type, G, D.data.waypoints, D.data.bezierControls));
+  for (let C = 0; C < P.length - 1; C++) if (Le(A, M, P[C].x, P[C].y, P[C + 1].x, P[C + 1].y) < T) return !0;
   return !1;
 }
-function on(_, S, H, V) {
-  const E = H.points;
-  for (let L = 0; L < E.length - 1; L++) if (Ne(_, S, E[L].x, E[L].y, E[L + 1].x, E[L + 1].y) < V) return !0;
+function gn(A, M, D, U) {
+  const T = D.points;
+  for (let G = 0; G < T.length - 1; G++) if (Le(A, M, T[G].x, T[G].y, T[G + 1].x, T[G + 1].y) < U) return !0;
   return !1;
 }
-function $n({ onPixiReady: _ }) {
-  const S = I(null), H = I(null), V = I(13751771), { pixiRef: E, readyRef: L } = fn(S, Jt((l) => {
-    V.current = l.gridDot, H.current && (H.current.dotColor = l.gridDot);
-  }, [])), { setViewportInternal: D, viewportReqRef: C, viewport: M, autoFocus: q, showGrid: j, showAnchors: at, gridSize: nt, toolMode: K, edgeType: rt, focusOnRect: ot, setFocusOnRect: Rt, pendingPlacement: Xt, setPendingPlacement: Tt, setContextMenu: te, beginNodeDrag: _t, endNodeDrag: Ft, presentation: St, editingNodeId: zt, setEditingNodeId: pt } = un(), { currentCanvas: fe, selection: Te, setSelection: ht, setDoc: J, currentCanvasId: he, pushCanvas: dn, doc: De } = ln(), Ct = I(null), ee = I(null), ne = I(null), re = I(null), ye = I(null), pe = I(null), oe = I(null), Ot = I(null), qt = I(null), se = I(null), Dt = I([]), xe = I(null), ge = I(null), lt = I(null), Zt = I(null), ke = I({
+function fr({ onPixiReady: A }) {
+  const M = b(null), D = b(null), U = b(13751771), { pixiRef: T, readyRef: G } = Sn(M, ie((f) => {
+    U.current = f.gridDot, D.current && (D.current.dotColor = f.gridDot);
+  }, [])), { setViewportInternal: P, viewportReqRef: C, viewport: z, autoFocus: q, showGrid: j, showAnchors: lt, gridSize: tt, toolMode: $, edgeType: rt, focusOnRect: ot, setFocusOnRect: zt, pendingPlacement: qt, setPendingPlacement: At, setContextMenu: ae, beginNodeDrag: Zt, endNodeDrag: Kt, presentation: Et, editingNodeId: Ct, setEditingNodeId: gt, readOnly: Ge, placementSnap: We } = Rn(), { currentCanvas: me, selection: Ye, setSelection: pt, setDoc: Q, currentCanvasId: ve, pushCanvas: In, doc: Xe } = Mn(), _e = Yn(), Oe = b(_e);
+  Oe.current = _e;
+  const Fe = b(null), Ut = b(Ge);
+  Ut.current = Ge;
+  const $t = b(We);
+  $t.current = We;
+  const Nt = b(tt);
+  Nt.current = tt;
+  const kt = b(null), le = b(null), ue = b(null), fe = b(null), Ie = b(null), be = b(null), he = b(null), jt = b(null), Jt = b(null), ye = b(null), Lt = b([]), Me = b(null), Re = b(null), ut = b(null), Qt = b(null), Be = b({
     time: 0,
     wx: 0,
     wy: 0
-  }), kt = I({
+  }), Gt = b({
     time: 0,
     wx: 0,
     wy: 0
-  }), He = I(0), Vt = I(null), Pe = I({
+  }), Ve = b(0), te = b(null), qe = b({
     x: 0,
     y: 0
-  }), Le = at || St ? fe : {
-    ...fe,
-    nodes: fe.nodes.filter((l) => l.type !== "animAnchor")
-  }, W = I(Le);
-  W.current = Le;
-  const B = I(he);
-  B.current = he;
-  const Bt = I(Te);
-  Bt.current = Te;
-  const Ge = I(De);
-  Ge.current = De;
-  const Kt = I(K);
-  Kt.current = K;
-  const Ut = I(q);
-  Ut.current = q;
-  const jt = I(ot);
-  jt.current = ot;
-  const Ae = I(rt);
-  Ae.current = rt;
-  const We = I(at);
-  We.current = at;
-  const Ht = I(St);
-  Ht.current = St;
-  const ce = I(Xt);
-  ce.current = Xt;
-  const Ye = I(_t);
-  Ye.current = _t;
-  const ie = I(Ft);
-  ie.current = Ft;
-  const st = I(null), Q = I(null), tt = I(null), ct = I(null), xt = I(null), yt = I(null), gt = I(null), we = I(M), me = I(0), { vmRef: F, screenToWorld: Xe } = hn(E, Jt((l) => {
-    we.current = l, me.current || (me.current = requestAnimationFrame(() => {
-      me.current = 0, D(we.current);
+  }), Ze = lt || Et ? me : {
+    ...me,
+    nodes: me.nodes.filter((f) => f.type !== "animAnchor")
+  }, Y = b(Ze);
+  Y.current = Ze;
+  const Z = b(ve);
+  Z.current = ve;
+  const ee = b(Ye);
+  ee.current = Ye;
+  const Ke = b(Xe);
+  Ke.current = Xe;
+  const ne = b($);
+  ne.current = $;
+  const re = b(q);
+  re.current = q;
+  const oe = b(ot);
+  oe.current = ot;
+  const Ue = b(rt);
+  Ue.current = rt;
+  const $e = b(lt);
+  $e.current = lt;
+  const Tt = b(Et);
+  Tt.current = Et;
+  const se = b(qt);
+  se.current = qt;
+  const Se = b(Zt);
+  Se.current = Zt;
+  const Dt = b(Kt);
+  Dt.current = Kt;
+  const st = b(null), et = b(null), nt = b(null), ft = b(null), ct = b(null), wt = b(null), xt = b(null), mt = b(null), ze = b(z), Ee = b(0), { vmRef: O, screenToWorld: je } = zn(T, ie((f) => {
+    ze.current = f, Ee.current || (Ee.current = requestAnimationFrame(() => {
+      Ee.current = 0, P(ze.current);
     }));
-  }, [D])), it = I(Xe);
-  it.current = Xe;
-  const [ut, ve] = $e(null), [Ie, be] = $e(null), Me = I(ut);
-  Me.current = ut;
-  const de = I(() => {
+  }, [P])), it = b(je);
+  it.current = je;
+  const [ht, Ce] = ln(null), [Ne, ke] = ln(null), Te = b(ht);
+  Te.current = ht;
+  const pe = b(() => {
   });
-  de.current = (l, P, X) => {
-    pt(l === "node" ? P : null), ve({
-      kind: l,
-      id: P,
-      value: X
+  pe.current = (f, L, _) => {
+    gt(f === "node" ? L : null), Ce({
+      kind: f,
+      id: L,
+      value: _
     });
   };
-  const _e = Jt((l) => {
-    const P = Me.current;
-    P && (J((X) => {
-      const A = B.current, Z = X.canvases[A];
-      if (!Z) return X;
-      let O = Z;
-      if (P.kind === "node") O = {
-        ...Z,
-        nodes: Z.nodes.map((Y) => Y.id === P.id ? {
-          ...Y,
+  const Je = ie((f) => {
+    const L = Te.current;
+    L && (Q((_) => {
+      const W = Z.current, K = _.canvases[W];
+      if (!K) return _;
+      let V = K;
+      if (L.kind === "node") V = {
+        ...K,
+        nodes: K.nodes.map((X) => X.id === L.id ? {
+          ...X,
           data: {
-            ...Y.data,
-            label: l
+            ...X.data,
+            label: f
           }
-        } : Y)
+        } : X)
       };
-      else if (P.kind === "edge") O = {
-        ...Z,
-        edges: Z.edges.map((Y) => Y.id === P.id ? {
-          ...Y,
+      else if (L.kind === "edge") V = {
+        ...K,
+        edges: K.edges.map((X) => X.id === L.id ? {
+          ...X,
           data: {
-            ...Y.data,
-            labelText: l
+            ...X.data,
+            labelText: f
           }
-        } : Y)
+        } : X)
       };
-      else return X;
+      else return _;
       return {
-        ...X,
+        ..._,
         canvases: {
-          ...X.canvases,
-          [A]: O
+          ..._.canvases,
+          [W]: V
         }
       };
-    }), ve(null), pt(null), be(null));
-  }, [J, pt]), an = Jt(() => {
-    ve(null), pt(null), be(null);
-  }, [pt]);
-  bt(() => {
-    if (!zt || Me.current?.id === zt) return;
-    const l = W.current.nodes.find((P) => P.id === zt);
-    l && de.current("node", l.id, l.data.label);
-  }, [zt]), bt(() => {
-    if (!ut) return;
-    const l = F.current;
-    if (!l) return;
-    const P = W.current;
-    let X = null;
-    if (ut.kind === "node") {
-      const A = P.nodes.find((Z) => Z.id === ut.id);
-      A && (X = {
-        x: A.position.x + A.width / 2,
-        y: A.position.y + A.height / 2
+    }), Ce(null), gt(null), ke(null));
+  }, [Q, gt]), bn = ie(() => {
+    Ce(null), gt(null), ke(null);
+  }, [gt]);
+  Rt(() => {
+    if (!Ct || Te.current?.id === Ct) return;
+    const f = Y.current.nodes.find((L) => L.id === Ct);
+    f && pe.current("node", f.id, f.data.label);
+  }, [Ct]), Rt(() => {
+    if (!ht) return;
+    const f = O.current;
+    if (!f) return;
+    const L = Y.current;
+    let _ = null;
+    if (ht.kind === "node") {
+      const W = L.nodes.find((K) => K.id === ht.id);
+      W && (_ = {
+        x: W.position.x + W.width / 2,
+        y: W.position.y + W.height / 2
       });
-    } else if (ut.kind === "edge") {
-      const A = P.edges.find((O) => O.id === ut.id), Z = /* @__PURE__ */ new Map();
-      for (const O of P.nodes) Z.set(O.id, O);
-      if (A) {
-        const O = Mt(A, Z);
-        if (O) {
-          const Y = cn(sn(A.type, O, A.data.waypoints, A.data.bezierControls)), dt = Y[Math.floor(Y.length / 2)] ?? {
-            x: (O.sx + O.tx) / 2,
-            y: (O.sy + O.ty) / 2
+    } else if (ht.kind === "edge") {
+      const W = L.edges.find((V) => V.id === ht.id), K = /* @__PURE__ */ new Map();
+      for (const V of L.nodes) K.set(V.id, V);
+      if (W) {
+        const V = St(W, K);
+        if (V) {
+          const X = mn(wn(W.type, V, W.data.waypoints, W.data.bezierControls)), dt = X[Math.floor(X.length / 2)] ?? {
+            x: (V.sx + V.tx) / 2,
+            y: (V.sy + V.ty) / 2
           };
-          X = {
+          _ = {
             x: dt.x,
             y: dt.y
           };
         }
       }
     }
-    if (X) {
-      const A = l.worldToScreen(X.x, X.y);
-      be({
-        x: A.x,
-        y: A.y
+    if (_) {
+      const W = f.worldToScreen(_.x, _.y);
+      ke({
+        x: W.x,
+        y: W.y
       });
     }
-  }, [ut, F]);
-  const Fe = I(0);
-  bt(() => {
-    C.current !== Fe.current && (Fe.current = C.current, we.current = M, F.current?.setState(M));
+  }, [ht, O]);
+  const Qe = b(0);
+  Rt(() => {
+    C.current !== Qe.current && (Qe.current = C.current, ze.current = z, O.current?.setState(z));
   }, [
-    M,
-    F,
+    z,
+    O,
     C
-  ]), bt(() => {
-    Rt((l, P, X, A, Z) => {
-      const O = F.current, Y = S.current;
-      if (!O || !Y) return;
-      const dt = Y.clientWidth || 800, wt = Y.clientHeight || 600, mt = Math.max(0, Z?.padding ?? 60), Pt = Math.max(1, dt - mt * 2), vt = Math.max(1, wt - mt * 2), Et = Z?.preserveZoom ? O.state.zoom : Math.min(Pt / Math.max(X, 1), vt / Math.max(A, 1), Z?.maxZoom ?? 2), Nt = l + X / 2, ft = P + A / 2, $t = dt / 2 - Nt * Et, Se = wt / 2 - ft * Et;
-      O.animateTo({
-        x: $t,
-        y: Se,
-        zoom: Et
-      }, Z?.duration ?? 350);
+  ]), Rt(() => {
+    zt((f, L, _, W, K) => {
+      const V = O.current, X = M.current;
+      if (!V || !X) return;
+      const dt = X.clientWidth || 800, vt = X.clientHeight || 600, It = Math.max(0, K?.padding ?? 60), Wt = Math.max(1, dt - It * 2), bt = Math.max(1, vt - It * 2), Ht = K?.preserveZoom ? V.state.zoom : Math.min(Wt / Math.max(_, 1), bt / Math.max(W, 1), K?.maxZoom ?? 2), Pt = f + _ / 2, yt = L + W / 2, ce = dt / 2 - Pt * Ht, He = vt / 2 - yt * Ht;
+      V.animateTo({
+        x: ce,
+        y: He,
+        zoom: Ht
+      }, K?.duration ?? 350);
     });
-  }, [Rt, F]);
-  const Oe = Jt((l) => {
-    J((P) => {
-      const X = P.canvases[B.current];
-      return X ? {
-        ...P,
+  }, [zt, O]);
+  const tn = ie((f) => {
+    Q((L) => {
+      const _ = L.canvases[Z.current];
+      return _ ? {
+        ...L,
         canvases: {
-          ...P.canvases,
-          [B.current]: {
-            ...X,
-            lines: [...X.lines, l]
+          ...L.canvases,
+          [Z.current]: {
+            ..._,
+            lines: [..._.lines, f]
           }
         }
-      } : P;
+      } : L;
     });
-  }, [J, he]), Re = I(Oe);
-  return Re.current = Oe, bt(() => {
-    const l = E.current;
-    if (!l || l.destroyed) return;
-    let P = !1, X = null, A = null, Z = null;
-    const O = () => {
-      if (P) return;
-      if (!L.current) {
-        setTimeout(O, 30);
+  }, [Q, ve]), De = b(tn);
+  return De.current = tn, Rt(() => {
+    const f = T.current;
+    if (!f || f.destroyed) return;
+    let L = !1, _ = null, W = null, K = null;
+    const V = () => {
+      if (L) return;
+      if (!G.current) {
+        setTimeout(V, 30);
         return;
       }
-      H.current = new yn(l.app.stage, nt, j), H.current.dotColor = V.current, Ct.current = new pn(l.app.stage), ee.current = new wn(l.world), ne.current = new mn(l.world), re.current = new vn(l.world);
-      const Y = new Qt();
-      Y.label = "connect-line", Y.visible = !1, l.world.addChild(Y), xt.current = Y;
-      const dt = new Qt();
-      dt.label = "transform-handles", l.app.stage.addChild(dt), Ot.current = dt;
-      const wt = new Qt();
-      wt.label = "handle-hover", l.world.addChild(wt), qt.current = wt;
-      const mt = new Qt();
-      mt.label = "edge-edit-handles", l.world.addChild(mt), Zt.current = mt;
-      const Pt = new Qt();
-      Pt.label = "ghost-placement", Pt.alpha = 0.5, l.world.addChild(Pt), Vt.current = Pt, se.current = new Mn(l.world), ye.current = new In(l.app.stage, l.world, {
-        onLineComplete: (f) => Re.current(f),
-        screenToWorld: (f, o) => it.current(f, o)
-      }), pe.current = new bn(l.app.stage, l.world, {
-        onLineComplete: (f) => Re.current(f),
-        screenToWorld: (f, o) => it.current(f, o)
-      }), _?.(l);
-      const vt = l.app.stage;
-      vt.on("pointerdown", (f) => {
-        if (S.current?.focus({ preventScroll: !0 }), F.current?.multiTouchActive || F.current?.isPanning || F.current?.isSpaceHeld || f.button !== 0) return;
-        const o = Kt.current;
-        if (o === "pan") {
-          F.current?.startPan(f.global.x, f.global.y);
+      D.current = new En(f.app.stage, tt, j), D.current.dotColor = U.current, kt.current = new Cn(f.app.stage), le.current = new Tn(f.world), ue.current = new Dn(f.world), fe.current = new Hn(f.world);
+      const X = new de();
+      X.label = "connect-line", X.visible = !1, f.world.addChild(X), wt.current = X;
+      const dt = new de();
+      dt.label = "transform-handles", f.app.stage.addChild(dt), jt.current = dt;
+      const vt = new de();
+      vt.label = "handle-hover", f.world.addChild(vt), Jt.current = vt;
+      const It = new de();
+      It.label = "edge-edit-handles", f.world.addChild(It), Qt.current = It;
+      const Wt = new de();
+      Wt.label = "ghost-placement", Wt.alpha = 0.5, f.world.addChild(Wt), te.current = Wt, ye.current = new Ln(f.world), Ie.current = new Pn(f.app.stage, f.world, {
+        onLineComplete: (x) => De.current(x),
+        screenToWorld: (x, c) => it.current(x, c)
+      }), be.current = new An(f.app.stage, f.world, {
+        onLineComplete: (x) => De.current(x),
+        screenToWorld: (x, c) => it.current(x, c)
+      }), A?.(f);
+      const bt = f.app.stage;
+      bt.on("pointerdown", (x) => {
+        if (M.current?.focus({ preventScroll: !0 }), O.current?.multiTouchActive || O.current?.isPanning || O.current?.isSpaceHeld || x.button !== 0) return;
+        const c = ne.current;
+        if (c === "pan") {
+          O.current?.startPan(x.global.x, x.global.y);
           return;
         }
-        if (o === "freehand" || o === "line" || o === "polyline" || o === "arrow") return;
-        const i = it.current(f.global.x, f.global.y), p = W.current.nodes, N = W.current.edges, k = W.current.lines, z = Bt.current, b = f.metaKey || f.ctrlKey || f.shiftKey, T = F.current?.state.zoom ?? 1;
-        if (ce.current) return;
-        const c = Date.now(), h = ke.current, u = c - h.time < 350 && Math.hypot(i.x - h.wx, i.y - h.wy) < 8 / T;
-        if (ke.current = {
-          time: c,
-          wx: i.x,
-          wy: i.y
-        }, z.nodeIds.size === 1 && !b && o === "select") {
-          const t = p.find((r) => r.id === [...z.nodeIds][0]);
+        if (c === "freehand" || c === "line" || c === "polyline" || c === "arrow") return;
+        const d = it.current(x.global.x, x.global.y), y = Y.current.nodes, H = Y.current.edges, N = Y.current.lines, R = ee.current, S = x.metaKey || x.ctrlKey || x.shiftKey, k = O.current?.state.zoom ?? 1;
+        if (se.current) return;
+        const s = Date.now(), h = Be.current, l = s - h.time < 350 && Math.hypot(d.x - h.wx, d.y - h.wy) < 8 / k;
+        if (Be.current = {
+          time: s,
+          wx: d.x,
+          wy: d.y
+        }, R.nodeIds.size === 1 && !S && c === "select" && !Ut.current) {
+          const t = y.find((r) => r.id === [...R.nodeIds][0]);
+          if (t) {
+            const r = fn(t, k);
+            if (Math.hypot(d.x - r.x, d.y - r.y) < J(k, 12, 24)) {
+              ft.current = {
+                active: !0,
+                nodeId: t.id,
+                cx: t.position.x + t.width / 2,
+                cy: t.position.y + t.height / 2,
+                startPointerAngle: Math.atan2(d.y - (t.position.y + t.height / 2), d.x - (t.position.x + t.width / 2)),
+                startRotation: t.data.rotation ?? 0
+              }, Se.current();
+              return;
+            }
+          }
+        }
+        if (R.nodeIds.size === 1 && !S && c === "select") {
+          const t = y.find((r) => r.id === [...R.nodeIds][0]);
           if (t) {
-            const r = tn(i, t, $(T, 10, 16));
+            const r = hn(d, t, J(k, 10, 16));
             if (r) {
-              const d = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Map(), e = t.type === "geometryGroup", s = e || t.type === "flowGroup" || t.data.isGroup, w = t.position.x, m = t.position.y, R = t.width, G = t.height;
-              for (const y of p)
-                y.id !== t.id && (y.parentId === t.id ? d.set(y.id, {
-                  x: y.position.x,
-                  y: y.position.y,
-                  w: y.width,
-                  h: y.height
-                }) : e && y.position.x >= w && y.position.y >= m && y.position.x + y.width <= w + R && y.position.y + y.height <= m + G && d.set(y.id, {
-                  x: y.position.x,
-                  y: y.position.y,
-                  w: y.width,
-                  h: y.height
+              const i = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Map(), o = t.type === "geometryGroup", n = o || t.type === "flowGroup" || t.data.isGroup, v = t.position.x, g = t.position.y, m = t.width, E = t.height;
+              for (const u of y)
+                u.id !== t.id && (u.parentId === t.id ? i.set(u.id, {
+                  x: u.position.x,
+                  y: u.position.y,
+                  w: u.width,
+                  h: u.height
+                }) : o && u.position.x >= v && u.position.y >= g && u.position.x + u.width <= v + m && u.position.y + u.height <= g + E && i.set(u.id, {
+                  x: u.position.x,
+                  y: u.position.y,
+                  w: u.width,
+                  h: u.height
                 }));
-              if (s)
-                for (const y of W.current.lines) y.parentId === t.id ? a.set(y.id, y.points.map((v) => ({ ...v }))) : e && y.points.length > 0 && y.points.every((v) => v.x >= w && v.x <= w + R && v.y >= m && v.y <= m + G) && a.set(y.id, y.points.map((v) => ({ ...v })));
-              yt.current = {
+              if (n)
+                for (const u of Y.current.lines) u.parentId === t.id ? a.set(u.id, u.points.map((w) => ({ ...w }))) : o && u.points.length > 0 && u.points.every((w) => w.x >= v && w.x <= v + m && w.y >= g && w.y <= g + E) && a.set(u.id, u.points.map((w) => ({ ...w })));
+              xt.current = {
                 active: !0,
                 nodeId: t.id,
                 handle: r,
-                startWorld: i,
+                startWorld: d,
                 startBounds: {
                   x: t.position.x,
                   y: t.position.y,
                   w: t.width,
                   h: t.height
                 },
-                childStarts: d,
+                childStarts: i,
                 childLineStarts: a.size > 0 ? a : void 0
               };
               return;
             }
           }
         }
-        let n = null;
-        for (let t = p.length - 1; t >= 0; t--) if (Yt(i.x, i.y, p[t])) {
-          n = p[t];
+        let e = null;
+        for (let t = y.length - 1; t >= 0; t--) if (Ft(d.x, d.y, y[t])) {
+          e = y[t];
           break;
         }
-        if (n?.parentId) {
-          const t = p.find((r) => r.id === n.parentId);
-          t && (n = t);
+        if (e?.parentId) {
+          const t = y.find((r) => r.id === e.parentId);
+          t && (e = t);
         }
-        if ((o === "select" || o === "connect") && (n || ue)) {
-          const t = n ? [n] : p, r = $(T, 14, 20);
-          let d = null, a = null, e = 1 / 0;
-          for (const s of t) {
-            const w = At(It(s.width, s.height), s, i.x, i.y, r);
-            if (!w) continue;
-            const m = Wt(w, s), R = Math.hypot(i.x - m.x, i.y - m.y);
-            R < e && (e = R, d = s, a = w);
+        if ((c === "select" || c === "connect") && (e || we)) {
+          const t = e ? [e] : y, r = J(k, 14, 20);
+          let i = null, a = null, o = 1 / 0;
+          for (const n of t) {
+            const v = _t(Mt(n.width, n.height), n, d.x, d.y, r);
+            if (!v) continue;
+            const g = Ot(v, n), m = Math.hypot(d.x - g.x, d.y - g.y);
+            m < o && (o = m, i = n, a = v);
           }
-          if (d && a) {
-            tt.current = {
+          if (i && a) {
+            nt.current = {
               active: !0,
-              sourceNodeId: d.id,
+              sourceNodeId: i.id,
               sourceHandleId: a.id
             };
             return;
           }
         }
-        if ((o === "select" || o === "connect") && !b && z.edgeIds.size > 0) {
+        if ((c === "select" || c === "connect") && !S && R.edgeIds.size > 0) {
           const t = /* @__PURE__ */ new Map();
-          for (const a of p) t.set(a.id, a);
-          const r = N.filter((a) => z.edgeIds.has(a.id)), d = en(i.x, i.y, r, t, $(T, 14, 20));
-          if (d) {
-            const a = N.find((e) => e.id === d.edgeId);
+          for (const a of y) t.set(a.id, a);
+          const r = H.filter((a) => R.edgeIds.has(a.id)), i = yn(d.x, d.y, r, t, J(k, 14, 20));
+          if (i) {
+            const a = H.find((o) => o.id === i.edgeId);
             if (a) {
-              const e = d.end === "source" ? "target" : "source";
+              const o = i.end === "source" ? "target" : "source";
               ct.current = {
                 active: !0,
                 edgeId: a.id,
-                movingEnd: d.end,
-                fixedNodeId: e === "source" ? a.source : a.target,
-                fixedHandleId: e === "source" ? a.sourceHandle : a.targetHandle
+                movingEnd: i.end,
+                fixedNodeId: o === "source" ? a.source : a.target,
+                fixedHandleId: o === "source" ? a.sourceHandle : a.targetHandle
               };
               return;
             }
           }
         }
-        if (o === "select" && z.edgeIds.size > 0 && !n) {
+        if (c === "select" && R.edgeIds.size > 0 && !e) {
           const t = /* @__PURE__ */ new Map();
-          for (const s of p) t.set(s.id, s);
-          const r = N.filter((s) => z.edgeIds.has(s.id)), d = $(T, 10, 14), a = rn(i.x, i.y, r, t, d);
+          for (const n of y) t.set(n.id, n);
+          const r = H.filter((n) => R.edgeIds.has(n.id)), i = J(k, 10, 14), a = xn(d.x, d.y, r, t, i);
           if (a) {
-            lt.current = {
+            ut.current = {
               active: !0,
               edgeId: a.edgeId,
               type: a.controlEnd === "c1" ? "bezierC1" : "bezierC2",
@@ -491,163 +527,163 @@ function $n({ onPixiReady: _ }) {
             };
             return;
           }
-          const e = nn(i.x, i.y, r, d);
-          if (e) {
-            if (u) {
-              J((s) => {
-                const w = s.canvases[B.current];
-                return w ? {
-                  ...s,
+          const o = pn(d.x, d.y, r, i);
+          if (o) {
+            if (l) {
+              Q((n) => {
+                const v = n.canvases[Z.current];
+                return v ? {
+                  ...n,
                   canvases: {
-                    ...s.canvases,
-                    [B.current]: {
-                      ...w,
-                      edges: w.edges.map((m) => {
-                        if (m.id !== e.edgeId) return m;
-                        const R = [...m.data.waypoints ?? []];
-                        R.splice(e.waypointIndex, 1);
-                        const G = {
-                          ...m.data,
-                          waypoints: R.length > 0 ? R : void 0
+                    ...n.canvases,
+                    [Z.current]: {
+                      ...v,
+                      edges: v.edges.map((g) => {
+                        if (g.id !== o.edgeId) return g;
+                        const m = [...g.data.waypoints ?? []];
+                        m.splice(o.waypointIndex, 1);
+                        const E = {
+                          ...g.data,
+                          waypoints: m.length > 0 ? m : void 0
                         };
-                        if (m.type === "simplebezier" && m.data.bezierControls) {
-                          const y = [...m.data.bezierControls];
-                          y.splice(e.waypointIndex, 2, null), G.bezierControls = y.some((v) => v !== null) ? y : void 0;
+                        if (g.type === "simplebezier" && g.data.bezierControls) {
+                          const u = [...g.data.bezierControls];
+                          u.splice(o.waypointIndex, 2, null), E.bezierControls = u.some((w) => w !== null) ? u : void 0;
                         }
                         return {
-                          ...m,
-                          data: G
+                          ...g,
+                          data: E
                         };
                       })
                     }
                   }
-                } : s;
+                } : n;
               });
               return;
             }
-            lt.current = {
+            ut.current = {
               active: !0,
-              edgeId: e.edgeId,
+              edgeId: o.edgeId,
               type: "waypoint",
-              index: e.waypointIndex
+              index: o.waypointIndex
             };
             return;
           }
-          if (u) {
-            for (const s of r) if (Ee(i.x, i.y, s, t, $(T, 8, 12))) {
-              const w = Cn(i.x, i.y, s, t), m = {
-                x: i.x,
-                y: i.y
+          if (l) {
+            for (const n of r) if (Ae(d.x, d.y, n, t, J(k, 8, 12))) {
+              const v = _n(d.x, d.y, n, t), g = {
+                x: d.x,
+                y: d.y
               };
-              J((R) => {
-                const G = R.canvases[B.current];
-                return G ? {
-                  ...R,
+              Q((m) => {
+                const E = m.canvases[Z.current];
+                return E ? {
+                  ...m,
                   canvases: {
-                    ...R.canvases,
-                    [B.current]: {
-                      ...G,
-                      edges: G.edges.map((y) => {
-                        if (y.id !== s.id) return y;
-                        const v = [...y.data.waypoints ?? []];
-                        v.splice(w, 0, m);
-                        const U = {
-                          ...y.data,
-                          waypoints: v
+                    ...m.canvases,
+                    [Z.current]: {
+                      ...E,
+                      edges: E.edges.map((u) => {
+                        if (u.id !== n.id) return u;
+                        const w = [...u.data.waypoints ?? []];
+                        w.splice(v, 0, g);
+                        const F = {
+                          ...u.data,
+                          waypoints: w
                         };
-                        if (y.type === "simplebezier" && y.data.bezierControls) {
-                          const et = [...y.data.bezierControls];
-                          for (; et.length < (y.data.waypoints ?? []).length + 1; ) et.push(null);
-                          et.splice(w, 1, null, null), U.bezierControls = et;
+                        if (u.type === "simplebezier" && u.data.bezierControls) {
+                          const B = [...u.data.bezierControls];
+                          for (; B.length < (u.data.waypoints ?? []).length + 1; ) B.push(null);
+                          B.splice(v, 1, null, null), F.bezierControls = B;
                         }
                         return {
-                          ...y,
-                          data: U
+                          ...u,
+                          data: F
                         };
                       })
                     }
                   }
-                } : R;
-              }), lt.current = {
+                } : m;
+              }), ut.current = {
                 active: !0,
-                edgeId: s.id,
+                edgeId: n.id,
                 type: "waypoint",
-                index: w
+                index: v
               };
               return;
             }
           }
         }
-        if (n && (o === "select" || o === "connect")) {
-          !b && !z.nodeIds.has(n.id) ? ht({
-            nodeIds: /* @__PURE__ */ new Set([n.id]),
+        if (e && (c === "select" || c === "connect")) {
+          !S && !R.nodeIds.has(e.id) ? pt({
+            nodeIds: /* @__PURE__ */ new Set([e.id]),
             edgeIds: /* @__PURE__ */ new Set(),
             lineIds: /* @__PURE__ */ new Set()
-          }) : b && ht((e) => {
-            const s = new Set(e.nodeIds);
-            return s.has(n.id) ? s.delete(n.id) : s.add(n.id), {
-              nodeIds: s,
+          }) : S && pt((o) => {
+            const n = new Set(o.nodeIds);
+            return n.has(e.id) ? n.delete(e.id) : n.add(e.id), {
+              nodeIds: n,
               edgeIds: /* @__PURE__ */ new Set(),
               lineIds: /* @__PURE__ */ new Set()
             };
-          }), Ut.current && jt.current(n.position.x, n.position.y, n.width, n.height, {
+          }), re.current && oe.current(e.position.x, e.position.y, e.width, e.height, {
             padding: 80,
             preserveZoom: !0,
             duration: 280
           });
-          const t = z.nodeIds.has(n.id) ? new Set(z.nodeIds) : /* @__PURE__ */ new Set([n.id]);
-          b && !z.nodeIds.has(n.id) && t.add(n.id);
+          const t = R.nodeIds.has(e.id) ? new Set(R.nodeIds) : /* @__PURE__ */ new Set([e.id]);
+          S && !R.nodeIds.has(e.id) && t.add(e.id);
           const r = /* @__PURE__ */ new Set();
-          for (const e of [...t]) {
-            const s = p.find((v) => v.id === e);
-            if (!s || s.type !== "flowGroup" && s.type !== "geometryGroup" && !s.data.isGroup) continue;
-            const w = s.type === "geometryGroup", m = s.position.x, R = s.position.y, G = s.width, y = s.height;
-            for (const v of p)
-              if (!(t.has(v.id) || v.id === e)) {
-                if (v.parentId === e) {
-                  t.add(v.id);
+          for (const o of [...t]) {
+            const n = y.find((w) => w.id === o);
+            if (!n || n.type !== "flowGroup" && n.type !== "geometryGroup" && !n.data.isGroup) continue;
+            const v = n.type === "geometryGroup", g = n.position.x, m = n.position.y, E = n.width, u = n.height;
+            for (const w of y)
+              if (!(t.has(w.id) || w.id === o)) {
+                if (w.parentId === o) {
+                  t.add(w.id);
                   continue;
                 }
-                w && v.position.x >= m && v.position.y >= R && v.position.x + v.width <= m + G && v.position.y + v.height <= R + y && t.add(v.id);
+                v && w.position.x >= g && w.position.y >= m && w.position.x + w.width <= g + E && w.position.y + w.height <= m + u && t.add(w.id);
               }
-            for (const v of W.current.lines) v.parentId === e && r.add(v.id);
-            if (w) for (const v of W.current.lines)
-              r.has(v.id) || v.points.length > 0 && v.points.every((U) => U.x >= m && U.x <= m + G && U.y >= R && U.y <= R + y) && r.add(v.id);
+            for (const w of Y.current.lines) w.parentId === o && r.add(w.id);
+            if (v) for (const w of Y.current.lines)
+              r.has(w.id) || w.points.length > 0 && w.points.every((F) => F.x >= g && F.x <= g + E && F.y >= m && F.y <= m + u) && r.add(w.id);
           }
-          const d = /* @__PURE__ */ new Map();
-          for (const e of p) t.has(e.id) && d.set(e.id, { ...e.position });
+          const i = /* @__PURE__ */ new Map();
+          for (const o of y) t.has(o.id) && i.set(o.id, { ...o.position });
           const a = /* @__PURE__ */ new Map();
           if (r.size > 0)
-            for (const e of W.current.lines) r.has(e.id) && a.set(e.id, e.points.map((s) => ({ ...s })));
+            for (const o of Y.current.lines) r.has(o.id) && a.set(o.id, o.points.map((n) => ({ ...n })));
           st.current = {
             active: !0,
             nodeIds: t,
             lineIds: r.size > 0 ? r : void 0,
-            startWorld: i,
-            nodeStarts: d,
+            startWorld: d,
+            nodeStarts: i,
             linePointStarts: a.size > 0 ? a : void 0
-          }, Ye.current();
+          }, Se.current();
           return;
         }
-        const g = /* @__PURE__ */ new Map();
-        for (const t of p) g.set(t.id, t);
-        const x = $(T, 8, 12);
-        for (const t of N) if (Ee(i.x, i.y, t, g, x)) {
-          if (ht(b ? (r) => {
-            const d = new Set(r.edgeIds);
-            return d.has(t.id) ? d.delete(t.id) : d.add(t.id), {
+        const I = /* @__PURE__ */ new Map();
+        for (const t of y) I.set(t.id, t);
+        const p = J(k, 8, 12);
+        for (const t of H) if (Ae(d.x, d.y, t, I, p)) {
+          if (pt(S ? (r) => {
+            const i = new Set(r.edgeIds);
+            return i.has(t.id) ? i.delete(t.id) : i.add(t.id), {
               ...r,
-              edgeIds: d
+              edgeIds: i
             };
           } : {
             nodeIds: /* @__PURE__ */ new Set(),
             edgeIds: /* @__PURE__ */ new Set([t.id]),
             lineIds: /* @__PURE__ */ new Set()
-          }), Ut.current) {
-            const r = g.get(t.source), d = g.get(t.target);
-            if (r && d) {
-              const a = Math.min(r.position.x, d.position.x), e = Math.min(r.position.y, d.position.y), s = Math.max(r.position.x + r.width, d.position.x + d.width), w = Math.max(r.position.y + r.height, d.position.y + d.height);
-              jt.current(a, e, s - a, w - e, {
+          }), re.current) {
+            const r = I.get(t.source), i = I.get(t.target);
+            if (r && i) {
+              const a = Math.min(r.position.x, i.position.x), o = Math.min(r.position.y, i.position.y), n = Math.max(r.position.x + r.width, i.position.x + i.width), v = Math.max(r.position.y + r.height, i.position.y + i.height);
+              oe.current(a, o, n - a, v - o, {
                 padding: 80,
                 preserveZoom: !0,
                 duration: 280
@@ -656,73 +692,73 @@ function $n({ onPixiReady: _ }) {
           }
           return;
         }
-        for (const t of k) if (on(i.x, i.y, t, x)) {
-          const r = z.lineIds.has(t.id);
-          if (b ? ht((e) => {
-            const s = new Set(e.lineIds);
-            return s.has(t.id) ? s.delete(t.id) : s.add(t.id), {
-              ...e,
-              lineIds: s
+        for (const t of N) if (gn(d.x, d.y, t, p)) {
+          const r = R.lineIds.has(t.id);
+          if (S ? pt((o) => {
+            const n = new Set(o.lineIds);
+            return n.has(t.id) ? n.delete(t.id) : n.add(t.id), {
+              ...o,
+              lineIds: n
             };
-          }) : r || ht({
+          }) : r || pt({
             nodeIds: /* @__PURE__ */ new Set(),
             edgeIds: /* @__PURE__ */ new Set(),
             lineIds: /* @__PURE__ */ new Set([t.id])
-          }), Ut.current && t.points.length > 0) {
-            const e = t.points.map((y) => y.x), s = t.points.map((y) => y.y), w = Math.min(...e), m = Math.min(...s), R = Math.max(...e), G = Math.max(...s);
-            jt.current(w, m, Math.max(1, R - w), Math.max(1, G - m), {
+          }), re.current && t.points.length > 0) {
+            const o = t.points.map((u) => u.x), n = t.points.map((u) => u.y), v = Math.min(...o), g = Math.min(...n), m = Math.max(...o), E = Math.max(...n);
+            oe.current(v, g, Math.max(1, m - v), Math.max(1, E - g), {
               padding: 80,
               preserveZoom: !0,
               duration: 280
             });
           }
-          const d = r ? new Set(z.lineIds) : /* @__PURE__ */ new Set([t.id]), a = /* @__PURE__ */ new Map();
-          for (const e of k) d.has(e.id) && a.set(e.id, e.points.map((s) => ({ ...s })));
-          gt.current = {
+          const i = r ? new Set(R.lineIds) : /* @__PURE__ */ new Set([t.id]), a = /* @__PURE__ */ new Map();
+          for (const o of N) i.has(o.id) && a.set(o.id, o.points.map((n) => ({ ...n })));
+          mt.current = {
             active: !0,
-            lineIds: d,
-            startWorld: i,
+            lineIds: i,
+            startWorld: d,
             pointStarts: a
           };
           return;
         }
-        b || ht({
+        S || pt({
           nodeIds: /* @__PURE__ */ new Set(),
           edgeIds: /* @__PURE__ */ new Set(),
           lineIds: /* @__PURE__ */ new Set()
-        }), o === "select" && (Q.current = {
+        }), c === "select" && (et.current = {
           active: !0,
           startScreen: {
-            x: f.global.x,
-            y: f.global.y
+            x: x.global.x,
+            y: x.global.y
           }
         });
-      }), vt.on("globalpointermove", (f) => {
-        const o = it.current(f.global.x, f.global.y);
-        if (Pe.current = o, F.current?.multiTouchActive) return;
-        const i = Kt.current;
-        if (i === "freehand" || i === "line" || i === "polyline" || i === "arrow") return;
-        const p = W.current.nodes, N = W.current.edges, k = F.current?.state.zoom ?? 1, z = !st.current?.active && !tt.current?.active && !yt.current?.active && !ct.current?.active && !lt.current?.active && !gt.current?.active;
-        let b = null;
-        for (let c = p.length - 1; c >= 0; c--) if (Yt(o.x, o.y, p[c])) {
-          const h = p[c];
-          b = h.parentId ? p.find((u) => u.id === h.parentId)?.id ?? h.id : h.id;
+      }), bt.on("globalpointermove", (x) => {
+        const c = it.current(x.global.x, x.global.y);
+        if (qe.current = c, O.current?.multiTouchActive) return;
+        const d = ne.current;
+        if (d === "freehand" || d === "line" || d === "polyline" || d === "arrow") return;
+        const y = Y.current.nodes, H = Y.current.edges, N = O.current?.state.zoom ?? 1, R = !st.current?.active && !nt.current?.active && !xt.current?.active && !ct.current?.active && !ut.current?.active && !mt.current?.active && !ft.current?.active;
+        let S = null;
+        for (let s = y.length - 1; s >= 0; s--) if (Ft(c.x, c.y, y[s])) {
+          const h = y[s];
+          S = h.parentId ? y.find((l) => l.id === h.parentId)?.id ?? h.id : h.id;
           break;
         }
-        if (oe.current = b, z && (i === "select" || i === "connect")) {
-          const c = /* @__PURE__ */ new Map();
-          for (const x of p) c.set(x.id, x);
-          const h = Bt.current, u = h.edgeIds.size > 0 ? N.filter((x) => h.edgeIds.has(x.id)) : [], n = u.length > 0 ? en(o.x, o.y, u, c, $(k, 12, 18)) : null;
-          ge.current = n;
-          let g = null;
-          if (b) {
-            const x = p.find((t) => t.id === b);
-            if (x) {
-              const t = At(It(x.width, x.height), x, o.x, o.y, $(k, 14, 20));
+        if (he.current = S, R && (d === "select" || d === "connect")) {
+          const s = /* @__PURE__ */ new Map();
+          for (const p of y) s.set(p.id, p);
+          const h = ee.current, l = h.edgeIds.size > 0 ? H.filter((p) => h.edgeIds.has(p.id)) : [], e = l.length > 0 ? yn(c.x, c.y, l, s, J(N, 12, 18)) : null;
+          Re.current = e;
+          let I = null;
+          if (S) {
+            const p = y.find((t) => t.id === S);
+            if (p) {
+              const t = _t(Mt(p.width, p.height), p, c.x, c.y, J(N, 14, 20));
               if (t) {
-                const r = Wt(t, x);
-                g = {
-                  nodeId: x.id,
+                const r = Ot(t, p);
+                I = {
+                  nodeId: p.id,
                   handleId: t.id,
                   wx: r.x,
                   wy: r.y
@@ -730,124 +766,160 @@ function $n({ onPixiReady: _ }) {
               }
             }
           }
-          xe.current = g;
+          Me.current = I;
         }
-        const T = S.current;
-        if (T && z) {
-          const c = Bt.current;
+        const k = M.current;
+        if (k && R) {
+          const s = ee.current;
           let h = "";
-          if (ge.current) h = "crosshair";
-          else if (xe.current) h = "crosshair";
-          else if (c.edgeIds.size > 0 && i === "select") {
-            const u = N.filter((x) => c.edgeIds.has(x.id)), n = /* @__PURE__ */ new Map();
-            for (const x of p) n.set(x.id, x);
-            const g = $(k, 10, 14);
-            (nn(o.x, o.y, u, g) || rn(o.x, o.y, u, n, g)) && (h = "grab");
+          if (Re.current) h = "crosshair";
+          else if (Me.current) h = "crosshair";
+          else if (s.edgeIds.size > 0 && d === "select") {
+            const l = H.filter((p) => s.edgeIds.has(p.id)), e = /* @__PURE__ */ new Map();
+            for (const p of y) e.set(p.id, p);
+            const I = J(N, 10, 14);
+            (pn(c.x, c.y, l, I) || xn(c.x, c.y, l, e, I)) && (h = "grab");
           }
-          if (!h && c.nodeIds.size === 1 && i === "select") {
-            const u = p.find((n) => n.id === [...c.nodeIds][0]);
-            if (u) {
-              const n = tn(o, u, $(k, 10, 16));
-              n && (h = zn[n]);
+          if (!h && s.nodeIds.size === 1 && d === "select") {
+            const l = y.find((e) => e.id === [...s.nodeIds][0]);
+            if (l) {
+              const e = hn(c, l, J(N, 10, 16));
+              if (e) h = Xn[e];
+              else if (!Ut.current) {
+                const I = fn(l, N);
+                Math.hypot(c.x - I.x, c.y - I.y) < J(N, 12, 24) && (h = "grab");
+              }
             }
           }
-          if (!h && i === "select") {
-            const u = W.current.lines, n = $(k, 8, 12);
-            for (const g of u) if (on(o.x, o.y, g, n)) {
+          if (!h && d === "select") {
+            const l = Y.current.lines, e = J(N, 8, 12);
+            for (const I of l) if (gn(c.x, c.y, I, e)) {
               h = "move";
               break;
             }
           }
-          T.style.cursor = h;
+          k.style.cursor = h;
         }
-        if (yt.current?.active) {
-          const c = yt.current, h = o.x - c.startWorld.x, u = o.y - c.startWorld.y, n = En(c.startBounds, c.handle, h, u), g = W.current.nodes, x = le([{
-            id: c.nodeId,
+        if (xt.current?.active) {
+          const s = xt.current, h = c.x - s.startWorld.x, l = c.y - s.startWorld.y, e = On(s.startBounds, s.handle, h, l), I = Y.current.nodes, p = xe([{
+            id: s.nodeId,
             type: "shapeRect",
             position: {
-              x: n.x,
-              y: n.y
+              x: e.x,
+              y: e.y
             },
-            width: n.w,
-            height: n.h,
+            width: e.w,
+            height: e.h,
             data: {}
-          }], g);
-          n.x += x.dx, n.y += x.dy, (c.handle === "ne" || c.handle === "se") && (n.w += x.dx), (c.handle === "se" || c.handle === "sw") && (n.h += x.dy), Dt.current = x.guides;
-          const t = c.startBounds, r = Math.max(n.w, 24), d = Math.max(n.h, 24), a = t.w > 0 ? r / t.w : 1, e = t.h > 0 ? d / t.h : 1;
-          J((s) => {
-            const w = s.canvases[B.current];
-            return w ? {
-              ...s,
+          }], I);
+          if (e.x += p.dx, e.y += p.dy, (s.handle === "ne" || s.handle === "se") && (e.w += p.dx), (s.handle === "se" || s.handle === "sw") && (e.h += p.dy), Lt.current = p.guides, $t.current && Nt.current > 0 && p.guides.length === 0) {
+            const n = Nt.current;
+            (s.handle === "nw" || s.handle === "sw") && (e.x = Math.round(e.x / n) * n), (s.handle === "nw" || s.handle === "ne") && (e.y = Math.round(e.y / n) * n), (s.handle === "ne" || s.handle === "se") && (e.w = Math.round((e.x + e.w) / n) * n - e.x), (s.handle === "se" || s.handle === "sw") && (e.h = Math.round((e.y + e.h) / n) * n - e.y);
+          }
+          const t = s.startBounds, r = Math.max(e.w, 24), i = Math.max(e.h, 24), a = t.w > 0 ? r / t.w : 1, o = t.h > 0 ? i / t.h : 1;
+          Q((n) => {
+            const v = n.canvases[Z.current];
+            return v ? {
+              ...n,
               canvases: {
-                ...s.canvases,
-                [B.current]: {
-                  ...w,
-                  nodes: w.nodes.map((m) => {
-                    if (m.id === c.nodeId) return {
-                      ...m,
+                ...n.canvases,
+                [Z.current]: {
+                  ...v,
+                  nodes: v.nodes.map((g) => {
+                    if (g.id === s.nodeId) return {
+                      ...g,
                       position: {
-                        x: n.x,
-                        y: n.y
+                        x: e.x,
+                        y: e.y
                       },
                       width: r,
-                      height: d
+                      height: i
                     };
-                    const R = c.childStarts.get(m.id);
-                    return R ? {
-                      ...m,
+                    const m = s.childStarts.get(g.id);
+                    return m ? {
+                      ...g,
                       position: {
-                        x: n.x + (R.x - t.x) * a,
-                        y: n.y + (R.y - t.y) * e
+                        x: e.x + (m.x - t.x) * a,
+                        y: e.y + (m.y - t.y) * o
                       },
-                      width: Math.max(R.w * a, 24),
-                      height: Math.max(R.h * e, 24)
-                    } : m;
+                      width: Math.max(m.w * a, 24),
+                      height: Math.max(m.h * o, 24)
+                    } : g;
                   }),
-                  lines: c.childLineStarts ? w.lines.map((m) => {
-                    const R = c.childLineStarts.get(m.id);
-                    return R ? {
-                      ...m,
-                      points: R.map((G) => ({
-                        x: n.x + (G.x - t.x) * a,
-                        y: n.y + (G.y - t.y) * e
+                  lines: s.childLineStarts ? v.lines.map((g) => {
+                    const m = s.childLineStarts.get(g.id);
+                    return m ? {
+                      ...g,
+                      points: m.map((E) => ({
+                        x: e.x + (E.x - t.x) * a,
+                        y: e.y + (E.y - t.y) * o
                       }))
-                    } : m;
-                  }) : w.lines
+                    } : g;
+                  }) : v.lines
                 }
               }
-            } : s;
+            } : n;
           });
           return;
         }
-        if (lt.current?.active) {
-          const c = lt.current, h = W.current.nodes, u = /* @__PURE__ */ new Map();
-          for (const n of h) u.set(n.id, n);
-          J((n) => {
-            const g = n.canvases[B.current];
-            return g ? {
-              ...n,
+        if (ft.current?.active) {
+          const s = ft.current, h = (Math.atan2(c.y - s.cy, c.x - s.cx) - s.startPointerAngle) * 180 / Math.PI;
+          let l = ((s.startRotation + h) % 360 + 360) % 360;
+          if (x.shiftKey) l = Math.round(l / 15) * 15 % 360;
+          else {
+            const e = Math.round(l / 45) * 45;
+            Math.abs(l - e) < 4 && (l = (e % 360 + 360) % 360);
+          }
+          Q((e) => {
+            const I = e.canvases[Z.current];
+            return I ? {
+              ...e,
               canvases: {
-                ...n.canvases,
-                [B.current]: {
-                  ...g,
-                  edges: g.edges.map((x) => {
-                    if (x.id !== c.edgeId) return x;
-                    if (c.type === "waypoint") {
-                      const Gt = [...x.data.waypoints ?? []];
-                      return c.index < Gt.length && (Gt[c.index] = {
-                        x: o.x,
-                        y: o.y
+                ...e.canvases,
+                [Z.current]: {
+                  ...I,
+                  nodes: I.nodes.map((p) => p.id === s.nodeId ? {
+                    ...p,
+                    data: {
+                      ...p.data,
+                      rotation: l
+                    }
+                  } : p)
+                }
+              }
+            } : e;
+          }), M.current && (M.current.style.cursor = "grabbing");
+          return;
+        }
+        if (ut.current?.active) {
+          const s = ut.current, h = Y.current.nodes, l = /* @__PURE__ */ new Map();
+          for (const e of h) l.set(e.id, e);
+          Q((e) => {
+            const I = e.canvases[Z.current];
+            return I ? {
+              ...e,
+              canvases: {
+                ...e.canvases,
+                [Z.current]: {
+                  ...I,
+                  edges: I.edges.map((p) => {
+                    if (p.id !== s.edgeId) return p;
+                    if (s.type === "waypoint") {
+                      const Xt = [...p.data.waypoints ?? []];
+                      return s.index < Xt.length && (Xt[s.index] = {
+                        x: c.x,
+                        y: c.y
                       }), {
-                        ...x,
+                        ...p,
                         data: {
-                          ...x.data,
-                          waypoints: Gt
+                          ...p.data,
+                          waypoints: Xt
                         }
                       };
                     }
-                    const t = Mt(x, u);
-                    if (!t) return x;
-                    const r = x.data.waypoints ?? [], d = [
+                    const t = St(p, l);
+                    if (!t) return p;
+                    const r = p.data.waypoints ?? [], i = [
                       {
                         x: t.sx,
                         y: t.sy
@@ -857,158 +929,164 @@ function $n({ onPixiReady: _ }) {
                         x: t.tx,
                         y: t.ty
                       }
-                    ], a = d.length - 1, e = [...x.data.bezierControls ?? []];
-                    for (; e.length < a; ) e.push(null);
-                    const s = c.index;
-                    if (s >= a) return x;
-                    const w = d[s], m = d[s + 1], R = e[s], G = Math.hypot(m.x - w.x, m.y - w.y), y = Math.max(30, G * 0.3), v = a - 1, U = s === 0 ? w.x + t.snx * y : w.x + (m.x - w.x) * 0.4, et = s === 0 ? w.y + t.sny * y : w.y, Lt = s === v ? m.x + t.tnx * y : m.x - (m.x - w.x) * 0.4, ae = s === v ? m.y + t.tny * y : m.y;
-                    return c.type === "bezierC1" ? e[s] = {
-                      c1x: o.x,
-                      c1y: o.y,
-                      c2x: R?.c2x ?? Lt,
-                      c2y: R?.c2y ?? ae
-                    } : e[s] = {
-                      c1x: R?.c1x ?? U,
-                      c1y: R?.c1y ?? et,
-                      c2x: o.x,
-                      c2y: o.y
+                    ], a = i.length - 1, o = [...p.data.bezierControls ?? []];
+                    for (; o.length < a; ) o.push(null);
+                    const n = s.index;
+                    if (n >= a) return p;
+                    const v = i[n], g = i[n + 1], m = o[n], E = Math.hypot(g.x - v.x, g.y - v.y), u = Math.max(30, E * 0.3), w = a - 1, F = n === 0 ? v.x + t.snx * u : v.x + (g.x - v.x) * 0.4, B = n === 0 ? v.y + t.sny * u : v.y, at = n === w ? g.x + t.tnx * u : g.x - (g.x - v.x) * 0.4, Yt = n === w ? g.y + t.tny * u : g.y;
+                    return s.type === "bezierC1" ? o[n] = {
+                      c1x: c.x,
+                      c1y: c.y,
+                      c2x: m?.c2x ?? at,
+                      c2y: m?.c2y ?? Yt
+                    } : o[n] = {
+                      c1x: m?.c1x ?? F,
+                      c1y: m?.c1y ?? B,
+                      c2x: c.x,
+                      c2y: c.y
                     }, {
-                      ...x,
+                      ...p,
                       data: {
-                        ...x.data,
-                        bezierControls: e
+                        ...p.data,
+                        bezierControls: o
                       }
                     };
                   })
                 }
               }
-            } : n;
+            } : e;
           });
           return;
         }
-        if (gt.current?.active) {
-          const c = gt.current, h = o.x - c.startWorld.x, u = o.y - c.startWorld.y;
-          J((n) => {
-            const g = n.canvases[B.current];
-            return g ? {
-              ...n,
+        if (mt.current?.active) {
+          const s = mt.current, h = c.x - s.startWorld.x, l = c.y - s.startWorld.y;
+          Q((e) => {
+            const I = e.canvases[Z.current];
+            return I ? {
+              ...e,
               canvases: {
-                ...n.canvases,
-                [B.current]: {
-                  ...g,
-                  lines: g.lines.map((x) => {
-                    const t = c.pointStarts.get(x.id);
+                ...e.canvases,
+                [Z.current]: {
+                  ...I,
+                  lines: I.lines.map((p) => {
+                    const t = s.pointStarts.get(p.id);
                     return t ? {
-                      ...x,
+                      ...p,
                       points: t.map((r) => ({
                         x: r.x + h,
-                        y: r.y + u
+                        y: r.y + l
                       }))
-                    } : x;
+                    } : p;
                   })
                 }
               }
-            } : n;
+            } : e;
           });
           return;
         }
         if (st.current?.active) {
-          const c = st.current, h = o.x - c.startWorld.x, u = o.y - c.startWorld.y, n = W.current.nodes, g = le(n.filter((r) => c.nodeIds.has(r.id)).map((r) => {
-            const d = c.nodeStarts.get(r.id);
+          const s = st.current, h = c.x - s.startWorld.x, l = c.y - s.startWorld.y;
+          let e = h, I = l;
+          if ($t.current && Nt.current > 0 && s.nodeIds.size > 0) {
+            const r = Nt.current, i = s.nodeStarts.values().next().value;
+            i && (e = Vt(i.x + h, r, !0) - i.x, I = Vt(i.y + l, r, !0) - i.y);
+          }
+          const p = Y.current.nodes, t = xe(p.filter((r) => s.nodeIds.has(r.id)).map((r) => {
+            const i = s.nodeStarts.get(r.id);
             return {
               ...r,
               position: {
-                x: d.x + h,
-                y: d.y + u
+                x: i.x + e,
+                y: i.y + I
               }
             };
-          }), n), x = h + g.dx, t = u + g.dy;
-          Dt.current = g.guides, J((r) => {
-            const d = r.canvases[B.current];
-            return d ? {
+          }), p);
+          e += t.dx, I += t.dy, Lt.current = t.guides, Q((r) => {
+            const i = r.canvases[Z.current];
+            return i ? {
               ...r,
               canvases: {
                 ...r.canvases,
-                [B.current]: {
-                  ...d,
-                  nodes: d.nodes.map((a) => {
-                    const e = c.nodeStarts.get(a.id);
-                    return e ? {
+                [Z.current]: {
+                  ...i,
+                  nodes: i.nodes.map((a) => {
+                    const o = s.nodeStarts.get(a.id);
+                    return o ? {
                       ...a,
                       position: {
-                        x: e.x + x,
-                        y: e.y + t
+                        x: o.x + e,
+                        y: o.y + I
                       }
                     } : a;
                   }),
-                  lines: c.linePointStarts ? d.lines.map((a) => {
-                    const e = c.linePointStarts.get(a.id);
-                    return e ? {
+                  lines: s.linePointStarts ? i.lines.map((a) => {
+                    const o = s.linePointStarts.get(a.id);
+                    return o ? {
                       ...a,
-                      points: e.map((s) => ({
-                        x: s.x + x,
-                        y: s.y + t
+                      points: o.map((n) => ({
+                        x: n.x + e,
+                        y: n.y + I
                       }))
                     } : a;
-                  }) : d.lines
+                  }) : i.lines
                 }
               }
             } : r;
           });
           return;
         }
-        if (Q.current?.active && Ct.current) {
-          const c = Math.min(Q.current.startScreen.x, f.global.x), h = Math.min(Q.current.startScreen.y, f.global.y), u = Math.abs(f.global.x - Q.current.startScreen.x), n = Math.abs(f.global.y - Q.current.startScreen.y);
-          Ct.current.showMarquee(c, h, u, n);
+        if (et.current?.active && kt.current) {
+          const s = Math.min(et.current.startScreen.x, x.global.x), h = Math.min(et.current.startScreen.y, x.global.y), l = Math.abs(x.global.x - et.current.startScreen.x), e = Math.abs(x.global.y - et.current.startScreen.y);
+          kt.current.showMarquee(s, h, l, e);
         }
-        if (tt.current?.active && xt.current) {
-          const c = W.current.nodes.find((h) => h.id === tt.current.sourceNodeId);
-          if (c) {
-            const h = It(c.width, c.height).find((u) => u.id === tt.current.sourceHandleId);
+        if (nt.current?.active && wt.current) {
+          const s = Y.current.nodes.find((h) => h.id === nt.current.sourceNodeId);
+          if (s) {
+            const h = Mt(s.width, s.height).find((l) => l.id === nt.current.sourceHandleId);
             if (h) {
-              const u = Wt(h, c), n = u.x, g = u.y;
-              let x = o.x, t = o.y;
-              const r = oe.current;
-              if (r && r !== tt.current.sourceNodeId) {
-                const a = W.current.nodes.find((e) => e.id === r);
+              const l = Ot(h, s), e = l.x, I = l.y;
+              let p = c.x, t = c.y;
+              const r = he.current;
+              if (r && r !== nt.current.sourceNodeId) {
+                const a = Y.current.nodes.find((o) => o.id === r);
                 if (a) {
-                  const e = At(It(a.width, a.height), a, o.x, o.y, 1 / 0);
-                  if (e) {
-                    const s = Wt(e, a);
-                    x = s.x, t = s.y;
+                  const o = _t(Mt(a.width, a.height), a, c.x, c.y, 1 / 0);
+                  if (o) {
+                    const n = Ot(o, a);
+                    p = n.x, t = n.y;
                   }
                 }
               }
-              const d = xt.current;
-              d.clear(), d.moveTo(n, g).lineTo(x, t).stroke({
+              const i = wt.current;
+              i.clear(), i.moveTo(e, I).lineTo(p, t).stroke({
                 color: 3900150,
                 width: 2,
                 alpha: 0.6
-              }), d.visible = !0;
+              }), i.visible = !0;
             }
           }
         }
-        if (ct.current?.active && xt.current && !xt.current.destroyed) {
-          const c = ct.current, h = W.current.nodes.find((u) => u.id === c.fixedNodeId);
+        if (ct.current?.active && wt.current && !wt.current.destroyed) {
+          const s = ct.current, h = Y.current.nodes.find((l) => l.id === s.fixedNodeId);
           if (h) {
-            const u = It(h.width, h.height).find((e) => e.id === c.fixedHandleId), n = u ? Wt(u, h) : {
+            const l = Mt(h.width, h.height).find((o) => o.id === s.fixedHandleId), e = l ? Ot(l, h) : {
               x: h.position.x + h.width / 2,
               y: h.position.y + h.height / 2
-            }, g = n.x, x = n.y;
-            let t = o.x, r = o.y;
-            const d = oe.current;
-            if (d && d !== c.fixedNodeId) {
-              const e = W.current.nodes.find((s) => s.id === d);
-              if (e) {
-                const s = At(It(e.width, e.height), e, o.x, o.y, 1 / 0);
-                if (s) {
-                  const w = Wt(s, e);
-                  t = w.x, r = w.y;
+            }, I = e.x, p = e.y;
+            let t = c.x, r = c.y;
+            const i = he.current;
+            if (i && i !== s.fixedNodeId) {
+              const o = Y.current.nodes.find((n) => n.id === i);
+              if (o) {
+                const n = _t(Mt(o.width, o.height), o, c.x, c.y, 1 / 0);
+                if (n) {
+                  const v = Ot(n, o);
+                  t = v.x, r = v.y;
                 }
               }
             }
-            const a = xt.current;
-            a.clear(), a.moveTo(g, x).lineTo(t, r).stroke({
+            const a = wt.current;
+            a.clear(), a.moveTo(I, p).lineTo(t, r).stroke({
               color: 16347926,
               width: 2,
               alpha: 0.7
@@ -1016,71 +1094,75 @@ function $n({ onPixiReady: _ }) {
           }
         }
       });
-      const Et = () => {
-        Dt.current = [];
+      const Ht = () => {
+        Lt.current = [];
         try {
-          se.current?.clear();
+          ye.current?.clear();
         } catch {
         }
         try {
-          const f = xt.current;
-          f && !f.destroyed && (f.clear(), f.visible = !1);
+          const x = wt.current;
+          x && !x.destroyed && (x.clear(), x.visible = !1);
         } catch {
         }
-        S.current && (S.current.style.cursor = "");
+        M.current && (M.current.style.cursor = "");
       };
-      vt.on("pointerup", (f) => {
-        if (Et(), lt.current?.active) {
-          lt.current = null;
+      bt.on("pointerup", (x) => {
+        if (Ht(), ft.current?.active) {
+          ft.current = null, Dt.current();
+          return;
+        }
+        if (ut.current?.active) {
+          ut.current = null;
           return;
         }
-        if (yt.current?.active) {
-          yt.current = null;
+        if (xt.current?.active) {
+          xt.current = null;
           return;
         }
-        if (gt.current?.active) {
-          gt.current = null;
+        if (mt.current?.active) {
+          mt.current = null;
           return;
         }
-        if (st.current?.active && (st.current = null, ie.current()), Q.current?.active) {
-          const o = it.current(Q.current.startScreen.x, Q.current.startScreen.y), i = it.current(f.global.x, f.global.y), p = Math.min(o.x, i.x), N = Math.min(o.y, i.y), k = Math.abs(i.x - o.x), z = Math.abs(i.y - o.y);
-          if (k > 4 && z > 4) {
-            const b = W.current.nodes.filter((c) => gn(p, N, k, z, c.position.x, c.position.y, c.width, c.height)), T = W.current.lines.filter((c) => c.points.length === 0 ? !1 : c.points.every((h) => h.x >= p && h.x <= p + k && h.y >= N && h.y <= N + z));
-            ht({
-              nodeIds: new Set(b.map((c) => c.id)),
+        if (st.current?.active && (st.current = null, Dt.current()), et.current?.active) {
+          const c = it.current(et.current.startScreen.x, et.current.startScreen.y), d = it.current(x.global.x, x.global.y), y = Math.min(c.x, d.x), H = Math.min(c.y, d.y), N = Math.abs(d.x - c.x), R = Math.abs(d.y - c.y);
+          if (N > 4 && R > 4) {
+            const S = Y.current.nodes.filter((s) => kn(y, H, N, R, s.position.x, s.position.y, s.width, s.height)), k = Y.current.lines.filter((s) => s.points.length === 0 ? !1 : s.points.every((h) => h.x >= y && h.x <= y + N && h.y >= H && h.y <= H + R));
+            pt({
+              nodeIds: new Set(S.map((s) => s.id)),
               edgeIds: /* @__PURE__ */ new Set(),
-              lineIds: new Set(T.map((c) => c.id))
+              lineIds: new Set(k.map((s) => s.id))
             });
           }
-          Q.current = null, Ct.current?.hideMarquee();
+          et.current = null, kt.current?.hideMarquee();
         }
         if (ct.current?.active) {
-          const o = ct.current.edgeId, i = ct.current.movingEnd, p = ct.current.fixedNodeId;
+          const c = ct.current.edgeId, d = ct.current.movingEnd, y = ct.current.fixedNodeId;
           ct.current = null;
-          const N = it.current(f.global.x, f.global.y), k = W.current.nodes, z = ue ? $(F.current?.state.zoom ?? 1, 12, 24) : 0;
-          let b = null;
-          for (let T = k.length - 1; T >= 0; T--) if (Yt(N.x, N.y, k[T], z) && k[T].id !== p) {
-            b = k[T];
+          const H = it.current(x.global.x, x.global.y), N = Y.current.nodes, R = we ? J(O.current?.state.zoom ?? 1, 12, 24) : 0;
+          let S = null;
+          for (let k = N.length - 1; k >= 0; k--) if (Ft(H.x, H.y, N[k], R) && N[k].id !== y) {
+            S = N[k];
             break;
           }
-          if (b) {
-            const T = b.id, c = At(It(b.width, b.height), b, N.x, N.y, 1 / 0)?.id;
-            J((h) => {
-              const u = h.canvases[B.current];
-              return u ? {
+          if (S) {
+            const k = S.id, s = _t(Mt(S.width, S.height), S, H.x, H.y, 1 / 0)?.id;
+            Q((h) => {
+              const l = h.canvases[Z.current];
+              return l ? {
                 ...h,
                 canvases: {
                   ...h.canvases,
-                  [B.current]: {
-                    ...u,
-                    edges: u.edges.map((n) => n.id !== o ? n : i === "source" ? {
-                      ...n,
-                      source: T,
-                      sourceHandle: c
+                  [Z.current]: {
+                    ...l,
+                    edges: l.edges.map((e) => e.id !== c ? e : d === "source" ? {
+                      ...e,
+                      source: k,
+                      sourceHandle: s
                     } : {
-                      ...n,
-                      target: T,
-                      targetHandle: c
+                      ...e,
+                      target: k,
+                      targetHandle: s
                     })
                   }
                 }
@@ -1089,31 +1171,31 @@ function $n({ onPixiReady: _ }) {
           }
           return;
         }
-        if (tt.current?.active) {
-          const o = tt.current.sourceNodeId, i = tt.current.sourceHandleId;
-          tt.current = null;
-          const p = it.current(f.global.x, f.global.y), N = W.current.nodes, k = ue ? $(F.current?.state.zoom ?? 1, 12, 24) : 0;
-          let z = null;
-          for (let b = N.length - 1; b >= 0; b--) if (Yt(p.x, p.y, N[b], k) && N[b].id !== o) {
-            z = N[b];
+        if (nt.current?.active) {
+          const c = nt.current.sourceNodeId, d = nt.current.sourceHandleId;
+          nt.current = null;
+          const y = it.current(x.global.x, x.global.y), H = Y.current.nodes, N = we ? J(O.current?.state.zoom ?? 1, 12, 24) : 0;
+          let R = null;
+          for (let S = H.length - 1; S >= 0; S--) if (Ft(y.x, y.y, H[S], N) && H[S].id !== c) {
+            R = H[S];
             break;
           }
-          if (z) {
-            const b = z.id, T = At(It(z.width, z.height), z, p.x, p.y, 1 / 0)?.id, c = `edge_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 6)}`, h = Ae.current;
-            J((u) => {
-              const n = u.canvases[B.current];
-              return !n || n.edges.some((g) => g.source === o && g.target === b && g.sourceHandle === i && g.targetHandle === T) ? u : {
-                ...u,
+          if (R) {
+            const S = R.id, k = _t(Mt(R.width, R.height), R, y.x, y.y, 1 / 0)?.id, s = `edge_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 6)}`, h = Ue.current;
+            Q((l) => {
+              const e = l.canvases[Z.current];
+              return !e || e.edges.some((I) => I.source === c && I.target === S && I.sourceHandle === d && I.targetHandle === k) ? l : {
+                ...l,
                 canvases: {
-                  ...u.canvases,
-                  [B.current]: {
-                    ...n,
-                    edges: [...n.edges, {
-                      id: c,
-                      source: o,
-                      target: b,
-                      sourceHandle: i,
-                      targetHandle: T,
+                  ...l.canvases,
+                  [Z.current]: {
+                    ...e,
+                    edges: [...e.edges, {
+                      id: s,
+                      source: c,
+                      target: S,
+                      sourceHandle: d,
+                      targetHandle: k,
                       type: h,
                       data: {
                         strokeColor: "theme:base-content",
@@ -1128,145 +1210,145 @@ function $n({ onPixiReady: _ }) {
             });
           }
         }
-      }), vt.on("pointerupoutside", () => {
-        Et(), st.current?.active && ie.current(), st.current = null, yt.current = null, Q.current = null, ct.current = null, tt.current = null, lt.current = null, gt.current = null, Ct.current?.hideMarquee();
+      }), bt.on("pointerupoutside", () => {
+        Ht(), st.current?.active && Dt.current(), ft.current?.active && Dt.current(), st.current = null, ft.current = null, xt.current = null, et.current = null, ct.current = null, nt.current = null, ut.current = null, mt.current = null, kt.current?.hideMarquee();
       });
-      const Nt = S.current;
-      let ft = null;
-      const $t = (f) => {
-        const o = Nt.getBoundingClientRect(), i = f[0].clientX, p = f[0].clientY, N = f[1].clientX, k = f[1].clientY;
+      const Pt = M.current;
+      let yt = null;
+      const ce = (x) => {
+        const c = Pt.getBoundingClientRect(), d = x[0].clientX, y = x[0].clientY, H = x[1].clientX, N = x[1].clientY;
         return {
-          dist: Math.hypot(N - i, k - p),
-          midX: (i + N) / 2 - o.left,
-          midY: (p + k) / 2 - o.top
+          dist: Math.hypot(H - d, N - y),
+          midX: (d + H) / 2 - c.left,
+          midY: (y + N) / 2 - c.top
         };
-      }, Se = () => {
-        Et(), st.current?.active && ie.current(), st.current = null, yt.current = null, Q.current = null, ct.current = null, tt.current = null, lt.current = null, gt.current = null, Ct.current?.hideMarquee(), F.current?.cancelPan();
-      }, qe = (f) => {
-        if (f.touches.length < 2) return;
-        const o = F.current;
-        o && (o.multiTouchActive = !0, Se(), ft = $t(f.touches), f.preventDefault());
-      }, Ze = (f) => {
-        if (!ft || f.touches.length < 2) return;
-        f.preventDefault();
-        const o = F.current;
-        if (!o) return;
-        const i = $t(f.touches), p = i.dist / Math.max(1, ft.dist);
-        Number.isFinite(p) && p > 0 && o.zoomAt(i.midX, i.midY, p), o.setState({
-          x: o.state.x + (i.midX - ft.midX),
-          y: o.state.y + (i.midY - ft.midY)
-        }), ft = i;
-      }, ze = (f) => {
-        if (f.touches.length >= 2) {
-          ft = $t(f.touches);
+      }, He = () => {
+        Ht(), st.current?.active && Dt.current(), ft.current?.active && Dt.current(), st.current = null, ft.current = null, xt.current = null, et.current = null, ct.current = null, nt.current = null, ut.current = null, mt.current = null, kt.current?.hideMarquee(), O.current?.cancelPan();
+      }, en = (x) => {
+        if (x.touches.length < 2) return;
+        const c = O.current;
+        c && (c.multiTouchActive = !0, He(), yt = ce(x.touches), x.preventDefault());
+      }, nn = (x) => {
+        if (!yt || x.touches.length < 2) return;
+        x.preventDefault();
+        const c = O.current;
+        if (!c) return;
+        const d = ce(x.touches), y = d.dist / Math.max(1, yt.dist);
+        Number.isFinite(y) && y > 0 && c.zoomAt(d.midX, d.midY, y), c.setState({
+          x: c.state.x + (d.midX - yt.midX),
+          y: c.state.y + (d.midY - yt.midY)
+        }), yt = d;
+      }, Pe = (x) => {
+        if (x.touches.length >= 2) {
+          yt = ce(x.touches);
           return;
         }
-        if (ft = null, f.touches.length === 0) {
-          const o = F.current;
-          o && (o.multiTouchActive = !1), He.current = performance.now() + 350;
+        if (yt = null, x.touches.length === 0) {
+          const c = O.current;
+          c && (c.multiTouchActive = !1), Ve.current = performance.now() + 350;
         }
       };
-      Nt?.addEventListener("touchstart", qe, { passive: !1 }), Nt?.addEventListener("touchmove", Ze, { passive: !1 }), Nt?.addEventListener("touchend", ze), Nt?.addEventListener("touchcancel", ze), X = qe, A = Ze, Z = ze, vt.on("rightclick", (f) => {
-        if (f.preventDefault?.(), F.current?.didRightPan) return;
-        const o = it.current(f.global.x, f.global.y), i = W.current.nodes;
-        let p = null;
-        for (let b = i.length - 1; b >= 0; b--) if (Yt(o.x, o.y, i[b])) {
-          p = i[b].id;
+      Pt?.addEventListener("touchstart", en, { passive: !1 }), Pt?.addEventListener("touchmove", nn, { passive: !1 }), Pt?.addEventListener("touchend", Pe), Pt?.addEventListener("touchcancel", Pe), _ = en, W = nn, K = Pe, bt.on("rightclick", (x) => {
+        if (x.preventDefault?.(), O.current?.didRightPan) return;
+        const c = it.current(x.global.x, x.global.y), d = Y.current.nodes;
+        let y = null;
+        for (let S = d.length - 1; S >= 0; S--) if (Ft(c.x, c.y, d[S])) {
+          y = d[S].id;
           break;
         }
-        const N = f.nativeEvent, k = N?.clientX ?? f.global.x, z = N?.clientY ?? f.global.y;
-        te({
-          x: k,
-          y: z,
-          nodeId: p
+        const H = x.nativeEvent, N = H?.clientX ?? x.global.x, R = H?.clientY ?? x.global.y;
+        ae({
+          x: N,
+          y: R,
+          nodeId: y
         });
-      }), vt.on("pointertap", (f) => {
-        if (F.current?.multiTouchActive || performance.now() < He.current || f.button !== 0) return;
-        const o = Date.now(), i = it.current(f.global.x, f.global.y), p = ce.current;
-        if (p) {
-          const b = xn("node"), T = i.x - p.width / 2, c = i.y - p.height / 2, h = le([{
+      }), bt.on("pointertap", (x) => {
+        if (O.current?.multiTouchActive || performance.now() < Ve.current || x.button !== 0) return;
+        const c = Date.now(), d = it.current(x.global.x, x.global.y), y = se.current;
+        if (y) {
+          const S = Nn("node"), k = Nt.current, s = $t.current, h = Vt(d.x - y.width / 2, k, s), l = Vt(d.y - y.height / 2, k, s), e = xe([{
             id: "__ghost__",
-            type: p.type,
+            type: y.type,
             position: {
-              x: T,
-              y: c
+              x: h,
+              y: l
             },
-            width: p.width,
-            height: p.height,
+            width: y.width,
+            height: y.height,
             data: {}
-          }], W.current.nodes), u = T + h.dx, n = c + h.dy;
-          J((g) => {
-            const x = g.canvases[B.current];
-            if (!x) return g;
-            const t = {};
-            p.type === "animAnchor" && (t.animIndex = Sn(g));
-            const r = Math.max(0, ...x.nodes.map((d) => d.zIndex ?? 0), ...x.lines.map((d) => d.zIndex ?? 0));
+          }], Y.current.nodes), I = h + e.dx, p = l + e.dy;
+          Q((t) => {
+            const r = t.canvases[Z.current];
+            if (!r) return t;
+            const i = {};
+            y.type === "animAnchor" && (i.animIndex = Wn(t));
+            const a = Math.max(0, ...r.nodes.map((o) => o.zIndex ?? 0), ...r.lines.map((o) => o.zIndex ?? 0));
             return {
-              ...g,
+              ...t,
               canvases: {
-                ...g.canvases,
-                [B.current]: {
-                  ...x,
-                  nodes: [...x.nodes, {
-                    id: b,
-                    type: p.type,
+                ...t.canvases,
+                [Z.current]: {
+                  ...r,
+                  nodes: [...r.nodes, {
+                    id: S,
+                    type: y.type,
                     position: {
-                      x: u,
-                      y: n
+                      x: I,
+                      y: p
                     },
-                    width: p.width,
-                    height: p.height,
-                    zIndex: r + 1,
+                    width: y.width,
+                    height: y.height,
+                    zIndex: a + 1,
                     data: {
-                      ...p.data,
-                      ...t
+                      ...y.data,
+                      ...i
                     }
                   }]
                 }
               }
             };
-          }), ht({
-            nodeIds: /* @__PURE__ */ new Set([b]),
+          }), pt({
+            nodeIds: /* @__PURE__ */ new Set([S]),
             edgeIds: /* @__PURE__ */ new Set(),
             lineIds: /* @__PURE__ */ new Set()
-          }), Ut.current && window.setTimeout(() => {
-            jt.current(u, n, p.width, p.height, {
+          }), re.current && window.setTimeout(() => {
+            oe.current(I, p, y.width, y.height, {
               padding: 80,
               preserveZoom: !0,
               duration: 280
             });
-          }, 0), kt.current = {
+          }, 0), Gt.current = {
             time: 0,
             wx: 0,
             wy: 0
           };
           return;
         }
-        const N = kt.current, k = i.x - N.wx, z = i.y - N.wy;
-        if (o - N.time < 400 && Math.abs(k) < 10 && Math.abs(z) < 10) {
-          const b = W.current.nodes;
-          for (let u = b.length - 1; u >= 0; u--) if (Yt(i.x, i.y, b[u])) {
-            const n = b[u], g = n.data.childCanvasId;
-            if (g) {
-              dn(g), kt.current = {
+        const H = Gt.current, N = d.x - H.wx, R = d.y - H.wy;
+        if (c - H.time < 400 && Math.abs(N) < 10 && Math.abs(R) < 10) {
+          const S = Y.current.nodes;
+          for (let l = S.length - 1; l >= 0; l--) if (Ft(d.x, d.y, S[l])) {
+            const e = S[l], I = e.data.childCanvasId;
+            if (I) {
+              In(I), Gt.current = {
                 time: 0,
                 wx: 0,
                 wy: 0
               };
               return;
             }
-            de.current("node", n.id, n.data.label ?? ""), kt.current = {
+            pe.current("node", e.id, e.data.label ?? ""), Gt.current = {
               time: 0,
               wx: 0,
               wy: 0
             };
             return;
           }
-          const T = W.current.edges, c = /* @__PURE__ */ new Map();
-          for (const u of b) c.set(u.id, u);
-          const h = F.current?.state.zoom ?? 1;
-          for (let u = T.length - 1; u >= 0; u--) if (Ee(i.x, i.y, T[u], c, $(h, 8, 12))) {
-            de.current("edge", T[u].id, T[u].data.labelText ?? ""), kt.current = {
+          const k = Y.current.edges, s = /* @__PURE__ */ new Map();
+          for (const l of S) s.set(l.id, l);
+          const h = O.current?.state.zoom ?? 1;
+          for (let l = k.length - 1; l >= 0; l--) if (Ae(d.x, d.y, k[l], s, J(h, 8, 12))) {
+            pe.current("edge", k[l].id, k[l].data.labelText ?? ""), Gt.current = {
               time: 0,
               wx: 0,
               wy: 0
@@ -1274,257 +1356,320 @@ function $n({ onPixiReady: _ }) {
             return;
           }
         }
-        kt.current = {
-          time: o,
-          wx: i.x,
-          wy: i.y
+        Gt.current = {
+          time: c,
+          wx: d.x,
+          wy: d.y
         };
       });
-      let Ve = !1;
-      l.app.ticker.add((f) => {
-        if (l.destroyed) return;
-        const o = f.deltaMS, i = l.app.screen, p = F.current?.state ?? {
+      let rn = !1;
+      f.app.ticker.add((x) => {
+        if (f.destroyed) return;
+        const c = x.deltaMS, d = f.app.screen, y = O.current?.state ?? {
           x: 0,
           y: 0,
           zoom: 1
         };
-        H.current?.update(p, i.width, i.height);
-        const N = F.current?.isPanning ?? !1;
-        N !== Ve && (Ve = N, S.current && (S.current.style.cursor = N ? "grabbing" : ""));
-        const k = W.current, z = Bt.current, b = Rn(Ge.current), T = /* @__PURE__ */ new Map();
-        b.forEach((t, r) => T.set(t.node.id, r + 1)), ee.current?.advanceAnimation(o);
-        const c = Ht.current ? b[Ht.current.current] : void 0;
-        ee.current?.sync(k.nodes, z.nodeIds, oe.current, T, {
-          showAnchors: We.current,
-          presentation: Ht.current !== null,
-          presentationAnchorId: c?.node.id,
-          presentationAnchorVisible: Ht.current?.showAnchor ?? !1
+        D.current?.update(y, d.width, d.height);
+        const H = O.current?.isPanning ?? !1;
+        H !== rn && (rn = H, M.current && (M.current.style.cursor = H ? "grabbing" : ""));
+        const N = Y.current, R = ee.current, S = Gn(Ke.current), k = /* @__PURE__ */ new Map();
+        S.forEach((r, i) => k.set(r.node.id, i + 1)), le.current?.advanceAnimation(c);
+        const s = Tt.current ? S[Tt.current.current] : void 0;
+        le.current?.sync(N.nodes, R.nodeIds, he.current, k, {
+          showAnchors: $e.current,
+          presentation: Tt.current !== null,
+          presentationAnchorId: s?.node.id,
+          presentationAnchorVisible: Tt.current?.showAnchor ?? !1
         });
         const h = /* @__PURE__ */ new Map();
-        for (const t of k.nodes) h.set(t.id, t);
-        ne.current?.advanceAnimation(o), ne.current?.sync(k.edges, h, z.edgeIds, null, { presentation: Ht.current !== null }), re.current?.advanceAnimation(o), re.current?.sync(k.lines, z.lineIds), se.current?.update(Dt.current, i.width, i.height, p);
-        const u = qt.current;
-        if (u) {
-          u.clear();
-          const t = xe.current;
-          t && (u.circle(t.wx, t.wy, 10).fill({
+        for (const r of N.nodes) h.set(r.id, r);
+        ue.current?.advanceAnimation(c), ue.current?.sync(N.edges, h, R.edgeIds, null, { presentation: Tt.current !== null }), fe.current?.advanceAnimation(c), fe.current?.sync(N.lines, R.lineIds), ye.current?.update(Lt.current, d.width, d.height, y);
+        const l = Fe.current;
+        if (l) {
+          const r = (R.nodeIds.size > 0 || R.edgeIds.size > 0 || R.lineIds.size > 0) && !Ut.current && !Tt.current && !se.current;
+          let i = !r;
+          if (r) {
+            let a = 1 / 0, o = 1 / 0, n = -1 / 0, v = -1 / 0;
+            const g = (m, E, u, w) => {
+              a = Math.min(a, m), o = Math.min(o, E), n = Math.max(n, m + u), v = Math.max(v, E + w);
+            };
+            for (const m of N.nodes) R.nodeIds.has(m.id) && g(m.position.x, m.position.y, m.width, m.height);
+            for (const m of N.edges) {
+              if (!R.edgeIds.has(m.id)) continue;
+              const E = h.get(m.source), u = h.get(m.target);
+              E && g(E.position.x, E.position.y, E.width, E.height), u && g(u.position.x, u.position.y, u.width, u.height);
+            }
+            for (const m of N.lines)
+              if (R.lineIds.has(m.id))
+                for (const E of m.points) g(E.x, E.y, 0, 0);
+            if (a === 1 / 0) i = !0;
+            else {
+              const m = y.zoom, E = 66, u = 30, w = 6;
+              let F = n * m + y.x + 8, B = o * m + y.y - u - 6;
+              F + E > d.width - w && (F = Math.max(w, d.width - E - w)), B < w && (B = o * m + y.y + w), B + u > d.height - w && (B = Math.max(w, d.height - u - w)), l.style.display = "flex", l.style.left = `${Math.round(F)}px`, l.style.top = `${Math.round(B)}px`;
+            }
+          }
+          i && l.style.display !== "none" && (l.style.display = "none");
+        }
+        const e = Jt.current;
+        if (e) {
+          e.clear();
+          const r = Me.current;
+          r && (e.circle(r.wx, r.wy, 10).fill({
             color: 3900150,
             alpha: 0.12
           }).stroke({
             color: 3900150,
             width: 1.5,
             alpha: 0.5
-          }), u.circle(t.wx, t.wy, 4).fill({
+          }), e.circle(r.wx, r.wy, 4).fill({
             color: 3900150,
             alpha: 0.9
           }));
-          const r = ge.current;
-          r && !t && (u.circle(r.worldX, r.worldY, 10).fill({
+          const i = Re.current;
+          i && !r && (e.circle(i.worldX, i.worldY, 10).fill({
             color: 16347926,
             alpha: 0.12
           }).stroke({
             color: 16347926,
             width: 1.5,
             alpha: 0.5
-          }), u.circle(r.worldX, r.worldY, 4).fill({
+          }), e.circle(i.worldX, i.worldY, 4).fill({
             color: 16347926,
             alpha: 0.9
           }));
         }
-        const n = Vt.current;
-        if (n) {
-          n.clear();
-          const t = ce.current;
-          if (t) {
-            const r = Pe.current, d = r.x - t.width / 2, a = r.y - t.height / 2, e = le([{
+        const I = te.current;
+        if (I) {
+          I.clear();
+          const r = se.current;
+          if (r) {
+            const i = qe.current, a = Nt.current, o = $t.current, n = Vt(i.x - r.width / 2, a, o), v = Vt(i.y - r.height / 2, a, o), g = xe([{
               id: "__ghost__",
-              type: t.type,
+              type: r.type,
               position: {
-                x: d,
-                y: a
+                x: n,
+                y: v
               },
-              width: t.width,
-              height: t.height,
+              width: r.width,
+              height: r.height,
               data: {}
-            }], k.nodes);
-            Dt.current = e.guides, n.position.set(d + e.dx, a + e.dy), (je[t.type] ?? je.shapeRect)(n, {
-              width: t.width,
-              height: t.height,
+            }], N.nodes);
+            Lt.current = g.guides, I.position.set(n + g.dx, v + g.dy), (an[r.type] ?? an.shapeRect)(I, {
+              width: r.width,
+              height: r.height,
               fill: "#3b82f6",
               stroke: "#3b82f6",
               strokeWidth: 1.5,
-              borderStyle: t.data.borderStyle
+              borderStyle: r.data.borderStyle
             });
           } else
-            n.position.set(0, 0), !st.current?.active && !yt.current?.active && (Dt.current = []);
+            I.position.set(0, 0), !st.current?.active && !xt.current?.active && (Lt.current = []);
         }
-        const g = Zt.current;
-        if (g && (g.clear(), z.edgeIds.size > 0 && Kt.current === "select")) {
-          const t = 1 / p.zoom;
-          for (const r of k.edges) {
-            if (!z.edgeIds.has(r.id)) continue;
-            const d = Mt(r, h);
-            d && (g.circle(d.sx, d.sy, 5 * t).fill({ color: 16777215 }).stroke({
+        const p = Qt.current;
+        if (p && (p.clear(), R.edgeIds.size > 0 && ne.current === "select")) {
+          const r = 1 / y.zoom;
+          for (const i of N.edges) {
+            if (!R.edgeIds.has(i.id)) continue;
+            const a = St(i, h);
+            a && (p.circle(a.sx, a.sy, 5 * r).fill({ color: 16777215 }).stroke({
               color: 16347926,
-              width: 1.5 * t
-            }), g.circle(d.tx, d.ty, 5 * t).fill({ color: 16777215 }).stroke({
+              width: 1.5 * r
+            }), p.circle(a.tx, a.ty, 5 * r).fill({ color: 16777215 }).stroke({
               color: 16347926,
-              width: 1.5 * t
+              width: 1.5 * r
             }));
-            const a = r.data.waypoints;
-            if (a) for (const e of a) g.circle(e.x, e.y, 5 * t).fill({ color: 16777215 }).stroke({
+            const o = i.data.waypoints;
+            if (o) for (const n of o) p.circle(n.x, n.y, 5 * r).fill({ color: 16777215 }).stroke({
               color: 3900150,
-              width: 1.5 * t
+              width: 1.5 * r
             });
-            if (r.type === "simplebezier") {
-              const e = Mt(r, h);
-              if (!e) continue;
-              const s = a ?? [], w = [
+            if (i.type === "simplebezier") {
+              const n = St(i, h);
+              if (!n) continue;
+              const v = o ?? [], g = [
                 {
-                  x: e.sx,
-                  y: e.sy
+                  x: n.sx,
+                  y: n.sy
                 },
-                ...s,
+                ...v,
                 {
-                  x: e.tx,
-                  y: e.ty
+                  x: n.tx,
+                  y: n.ty
                 }
-              ], m = r.data.bezierControls, R = w.length - 2;
-              for (let G = 0; G <= R; G++) {
-                const y = w[G], v = w[G + 1], U = m?.[G], et = Math.hypot(v.x - y.x, v.y - y.y), Lt = Math.max(30, et * 0.3), ae = U?.c1x ?? (G === 0 ? y.x + e.snx * Lt : y.x + (v.x - y.x) * 0.4), Gt = U?.c1y ?? (G === 0 ? y.y + e.sny * Lt : y.y), Be = U?.c2x ?? (G === R ? v.x + e.tnx * Lt : v.x - (v.x - y.x) * 0.4), Ke = U?.c2y ?? (G === R ? v.y + e.tny * Lt : v.y);
-                g.moveTo(y.x, y.y).lineTo(ae, Gt).stroke({
+              ], m = i.data.bezierControls, E = g.length - 2;
+              for (let u = 0; u <= E; u++) {
+                const w = g[u], F = g[u + 1], B = m?.[u], at = Math.hypot(F.x - w.x, F.y - w.y), Yt = Math.max(30, at * 0.3), Xt = B?.c1x ?? (u === 0 ? w.x + n.snx * Yt : w.x + (F.x - w.x) * 0.4), on = B?.c1y ?? (u === 0 ? w.y + n.sny * Yt : w.y), sn = B?.c2x ?? (u === E ? F.x + n.tnx * Yt : F.x - (F.x - w.x) * 0.4), cn = B?.c2y ?? (u === E ? F.y + n.tny * Yt : F.y);
+                p.moveTo(w.x, w.y).lineTo(Xt, on).stroke({
                   color: 10265519,
-                  width: 1 * t
-                }), g.moveTo(v.x, v.y).lineTo(Be, Ke).stroke({
+                  width: 1 * r
+                }), p.moveTo(F.x, F.y).lineTo(sn, cn).stroke({
                   color: 10265519,
-                  width: 1 * t
+                  width: 1 * r
                 });
-                const Ue = 4 * t;
-                g.circle(ae, Gt, Ue).fill({ color: 16777215 }).stroke({
+                const dn = 4 * r;
+                p.circle(Xt, on, dn).fill({ color: 16777215 }).stroke({
                   color: 3900150,
-                  width: 1.5 * t
-                }), g.circle(Be, Ke, Ue).fill({ color: 16777215 }).stroke({
+                  width: 1.5 * r
+                }), p.circle(sn, cn, dn).fill({ color: 16777215 }).stroke({
                   color: 3900150,
-                  width: 1.5 * t
+                  width: 1.5 * r
                 });
               }
             }
           }
         }
-        const x = Ot.current;
-        if (x && (x.clear(), z.nodeIds.size === 1 && Kt.current === "select")) {
-          const t = [...z.nodeIds][0], r = k.nodes.find((d) => d.id === t);
-          if (r) {
-            const d = p.zoom, a = r.position.x * d + p.x, e = r.position.y * d + p.y, s = r.width * d, w = r.height * d;
-            x.rect(a, e, s, w).stroke({
+        const t = jt.current;
+        if (t && (t.clear(), R.nodeIds.size === 1 && ne.current === "select")) {
+          const r = [...R.nodeIds][0], i = N.nodes.find((a) => a.id === r);
+          if (i) {
+            const a = y.zoom, o = i.position.x * a + y.x, n = i.position.y * a + y.y, v = i.width * a, g = i.height * a;
+            t.rect(o, n, v, g).stroke({
               color: 3900150,
               width: 1.5
             });
-            const m = 7, R = m / 2, G = [
-              [a, e],
-              [a + s, e],
-              [a + s, e + w],
-              [a, e + w]
+            const m = 7, E = m / 2, u = [
+              [o, n],
+              [o + v, n],
+              [o + v, n + g],
+              [o, n + g]
             ];
-            for (const [U, et] of G) x.rect(U - R, et - R, m, m).fill({ color: 16777215 }).stroke({
+            for (const [B, at] of u) t.rect(B - E, at - E, m, m).fill({ color: 16777215 }).stroke({
               color: 3900150,
               width: 1.5
             });
-            const y = 4, v = [
-              [a + s / 2, e],
-              [a + s, e + w / 2],
-              [a + s / 2, e + w],
-              [a, e + w / 2]
+            const w = 4, F = [
+              [o + v / 2, n],
+              [o + v, n + g / 2],
+              [o + v / 2, n + g],
+              [o, n + g / 2]
             ];
-            for (const [U, et] of v) x.circle(U, et, y).fill({
+            for (const [B, at] of F) t.circle(B, at, w).fill({
               color: 3900150,
               alpha: 0.9
             });
+            if (!Ut.current) {
+              const B = o + v / 2, at = n - vn;
+              t.moveTo(B, n).lineTo(B, at).stroke({
+                color: 3900150,
+                width: 1.5,
+                alpha: 0.85
+              }), t.circle(B, at, 6).fill({ color: 16777215 }).stroke({
+                color: 3900150,
+                width: 1.5
+              }), t.circle(B, at, 2.5).fill({ color: 3900150 });
+            }
           }
         }
       });
     };
-    return O(), () => {
-      if (P = !0, l && !l.destroyed) try {
-        l.app.stage.removeAllListeners();
+    return V(), () => {
+      if (L = !0, f && !f.destroyed) try {
+        f.app.stage.removeAllListeners();
       } catch {
       }
-      const Y = S.current;
-      X && Y?.removeEventListener("touchstart", X), A && Y?.removeEventListener("touchmove", A), Z && (Y?.removeEventListener("touchend", Z), Y?.removeEventListener("touchcancel", Z)), H.current?.destroy(), Ct.current?.destroy(), ee.current?.destroy(), ne.current?.destroy(), re.current?.destroy(), ye.current?.destroy(), pe.current?.destroy(), xt.current?.destroy(), Ot.current && (Ot.current.destroy(), Ot.current = null), qt.current && (qt.current.destroy(), qt.current = null), Zt.current && (Zt.current.destroy(), Zt.current = null), Vt.current && (Vt.current.destroy(), Vt.current = null), se.current?.destroy();
+      const X = M.current;
+      _ && X?.removeEventListener("touchstart", _), W && X?.removeEventListener("touchmove", W), K && (X?.removeEventListener("touchend", K), X?.removeEventListener("touchcancel", K)), D.current?.destroy(), kt.current?.destroy(), le.current?.destroy(), ue.current?.destroy(), fe.current?.destroy(), Ie.current?.destroy(), be.current?.destroy(), wt.current?.destroy(), jt.current && (jt.current.destroy(), jt.current = null), Jt.current && (Jt.current.destroy(), Jt.current = null), Qt.current && (Qt.current.destroy(), Qt.current = null), te.current && (te.current.destroy(), te.current = null), ye.current?.destroy();
     };
-  }, [E.current]), bt(() => {
-    const l = ye.current, P = pe.current;
-    if (!(!l || !P))
-      switch (l.deactivate(), P.deactivate(), K) {
+  }, [T.current]), Rt(() => {
+    const f = Ie.current, L = be.current;
+    if (!(!f || !L))
+      switch (f.deactivate(), L.deactivate(), $) {
         case "freehand":
-          l.activate();
+          f.activate();
           break;
         case "line":
-          P.activate("straight");
+          L.activate("straight");
           break;
         case "polyline":
-          P.activate("polyline");
+          L.activate("polyline");
           break;
         case "arrow":
-          P.activate("arrow");
+          L.activate("arrow");
           break;
       }
-  }, [K]), bt(() => {
-    H.current && (H.current.visible = j, H.current.gridSize = nt);
-  }, [j, nt]), bt(() => {
-    const l = S.current;
-    if (!l) return;
-    const P = 1e-3, X = (A) => {
-      A.preventDefault();
-      const Z = F.current;
-      if (!Z) return;
-      const O = l.getBoundingClientRect(), Y = A.clientX - O.left, dt = A.clientY - O.top, wt = A.ctrlKey ? 3 : 1, mt = -A.deltaY * P * wt;
-      Z.zoomAt(Y, dt, 1 + mt);
+  }, [$]), Rt(() => {
+    D.current && (D.current.visible = j, D.current.gridSize = tt);
+  }, [j, tt]), Rt(() => {
+    const f = M.current;
+    if (!f) return;
+    const L = 1e-3, _ = (W) => {
+      W.preventDefault();
+      const K = O.current;
+      if (!K) return;
+      const V = f.getBoundingClientRect(), X = W.clientX - V.left, dt = W.clientY - V.top, vt = W.ctrlKey ? 3 : 1, It = -W.deltaY * L * vt;
+      K.zoomAt(X, dt, 1 + It);
     };
-    return l.addEventListener("wheel", X, { passive: !1 }), () => l.removeEventListener("wheel", X);
-  }, [F]), /* @__PURE__ */ Je("div", {
+    return f.addEventListener("wheel", _, { passive: !1 }), () => f.removeEventListener("wheel", _);
+  }, [O]), /* @__PURE__ */ ge("div", {
     style: {
       position: "relative",
       width: "100%",
       height: "100%"
     },
     children: [
-      /* @__PURE__ */ Ce("div", {
-        ref: S,
+      /* @__PURE__ */ Bt("div", {
+        ref: M,
         className: "flow-canvas-wrapper",
         tabIndex: -1,
-        onContextMenu: (l) => l.preventDefault()
+        onContextMenu: (f) => f.preventDefault()
       }),
-      ut && Ie && /* @__PURE__ */ Ce("input", {
+      ht && Ne && /* @__PURE__ */ Bt("input", {
         className: "flow-label-editor",
         autoFocus: !0,
-        defaultValue: ut.value,
+        defaultValue: ht.value,
         style: {
-          left: Ie.x,
-          top: Ie.y
+          left: Ne.x,
+          top: Ne.y
         },
-        onFocus: (l) => l.currentTarget.select(),
-        onKeyDown: (l) => {
-          l.key === "Enter" ? (l.preventDefault(), _e(l.target.value)) : l.key === "Escape" && (l.preventDefault(), an()), l.stopPropagation();
+        onFocus: (f) => f.currentTarget.select(),
+        onKeyDown: (f) => {
+          f.key === "Enter" ? (f.preventDefault(), Je(f.target.value)) : f.key === "Escape" && (f.preventDefault(), bn()), f.stopPropagation();
         },
-        onBlur: (l) => _e(l.target.value),
-        onPointerDown: (l) => l.stopPropagation()
+        onBlur: (f) => Je(f.target.value),
+        onPointerDown: (f) => f.stopPropagation()
       }),
-      Xt && !St && /* @__PURE__ */ Je("button", {
+      qt && !Et && /* @__PURE__ */ ge("button", {
         type: "button",
         className: "flow-esc-button",
-        onClick: () => Tt(null),
+        onClick: () => At(null),
         title: "取消连续放置 (Esc)",
-        children: [/* @__PURE__ */ Ce("span", {
+        children: [/* @__PURE__ */ Bt("span", {
           "aria-hidden": !0,
           children: "⎋"
         }), " 取消放置 (ESC)"]
+      }),
+      /* @__PURE__ */ ge("button", {
+        ref: Fe,
+        type: "button",
+        className: "flow-delete-button",
+        style: { display: "none" },
+        onClick: () => Oe.current(),
+        title: "删除所选 (Delete)",
+        "aria-label": "删除所选",
+        children: [/* @__PURE__ */ ge("svg", {
+          width: "12",
+          height: "12",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          strokeWidth: "2.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          "aria-hidden": !0,
+          children: [
+            /* @__PURE__ */ Bt("path", { d: "M3 6h18" }),
+            /* @__PURE__ */ Bt("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }),
+            /* @__PURE__ */ Bt("path", { d: "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" })
+          ]
+        }), "删除"]
       })
     ]
   });
 }
 export {
-  $n as default
+  fr as default
 };
 
 //# sourceMappingURL=FlowCanvas.js.map