@infinit-canvas/react 0.1.13 → 0.1.14

package/dist/react-infinite-canvas.js

@@ -1,5 +1,5 @@
-import { jsx as D, jsxs as Ft, Fragment as Ye } from "react/jsx-runtime";
-import bn, { useRef as K, useState as ne, useMemo as Wt, useEffect as gt, useCallback as F, useContext as xe, createContext as gr, memo as ie, useLayoutEffect as Yr } from "react";
+import { jsx as D, jsxs as Xt, Fragment as Ye } from "react/jsx-runtime";
+import bn, { useRef as K, useState as ne, useMemo as Ft, useEffect as gt, useCallback as F, useContext as xe, createContext as gr, memo as ie, useLayoutEffect as Yr } from "react";
 import { createPortal as pr } from "react-dom";
 const xr = 160, mr = 60;
 function Xo(t) {
@@ -986,7 +986,7 @@ function Zr(t, e) {
   const i = { worker: r };
   return Zn.set(t, i), i;
 }
-const fe = 160, ce = 60, jr = 10;
+const he = 160, ue = 60, jr = 10;
 function Gr({
   cards: t = [],
   nodes: e = [],
@@ -1020,7 +1020,7 @@ function Gr({
   onConnectStart: S,
   onConnectEnd: P,
   onInit: W,
-  onMoveStart: Q,
+  onMoveStart: J,
   onMove: ot,
   onMoveEnd: et,
   onDelete: st,
@@ -1034,16 +1034,16 @@ function Gr({
   initialCamera: Lt = { x: 0, y: 0, zoom: 1 },
   fitView: re = !1,
   fitViewOptions: dt,
-  nodesDraggable: Bt = !0,
-  nodesConnectable: Dt = !0,
+  nodesDraggable: Dt = !0,
+  nodesConnectable: Ht = !0,
   elementsSelectable: Ut = !0,
   multiSelectionKeyCode: yt = "Shift",
   selectionOnDrag: kt = !1,
   selectionMode: Jt = "partial",
-  connectionMode: Ht = "loose",
-  connectionRadius: he = 20,
+  connectionMode: _t = "loose",
+  connectionRadius: ye = 20,
   connectOnClick: $e = !1,
-  snapToGrid: _t = !1,
+  snapToGrid: Wt = !1,
   snapGrid: jt = [15, 15],
   deleteKeyCode: Kt = ["Delete", "Backspace"],
   panActivationKeyCode: Ae = " ",
@@ -1059,7 +1059,7 @@ function Gr({
   defaultEdgeOptions: Be = {},
   autoPanOnNodeDrag: Ln = !0,
   autoPanOnConnect: Pn = !0,
-  autoPanSpeed: ue = 5,
+  autoPanSpeed: le = 5,
   edgesReconnectable: rr = !1,
   elevateNodesOnSelect: Tn = !1,
   elevateEdgesOnSelect: $n = !1,
@@ -1070,7 +1070,7 @@ function Gr({
   onSelectionDragStop: Dn,
   edgeRouting: we = !0
 } = {}) {
-  const vt = K(null), Ze = K(null), St = K(null), ct = K({ ...Lt }), be = K([...t]), tt = K([...e]), zt = K([...n]), xn = K(/* @__PURE__ */ new Map()), ye = K(!1), _e = K(null), [Hn, _n] = ne(!1), qt = K(null), Gt = K(null), je = K(null), Xt = K(null), Ge = K(!1), Ne = K(null), [Oe, Wn] = ne({ x: Lt.x, y: Lt.y, zoom: Lt.zoom }), [Me, Re] = ne(null), ge = Wt(() => /* @__PURE__ */ new Set(), []), oe = Wt(() => /* @__PURE__ */ new Set(), []), We = K(!1), j = K({});
+  const vt = K(null), Ze = K(null), St = K(null), ct = K({ ...Lt }), be = K([...t]), tt = K([...e]), zt = K([...n]), xn = K(/* @__PURE__ */ new Map()), ge = K(!1), _e = K(null), [Hn, _n] = ne(!1), qt = K(null), Gt = K(null), je = K(null), Yt = K(null), Ge = K(!1), Ne = K(null), [Oe, Wn] = ne({ x: Lt.x, y: Lt.y, zoom: Lt.zoom }), [Me, Re] = ne(null), ae = Ft(() => /* @__PURE__ */ new Set(), []), oe = Ft(() => /* @__PURE__ */ new Set(), []), We = K(!1), j = K({});
   j.current = {
     onHudUpdate: r,
     onNodesProcessed: i,
@@ -1101,7 +1101,7 @@ function Gr({
     onConnectStart: S,
     onConnectEnd: P,
     onInit: W,
-    onMoveStart: Q,
+    onMoveStart: J,
     onMove: ot,
     onMoveEnd: et,
     onDelete: st,
@@ -1161,7 +1161,7 @@ function Gr({
     for (let C = 0; C < u.length; C++)
       u[C].type === "select" && w.push({ id: u[C].id, selected: u[C].selected });
     w.length > 0 && ((M = St.current) == null || M.postMessage({ type: "edgeSelections", data: { selections: w } }));
-  }, le = F(() => {
+  }, de = F(() => {
     var y;
     const u = tt.current.filter((M) => M.selected), w = zt.current.filter((M) => M.selected), c = { nodes: u, edges: w };
     (y = Rt.current) == null || y.call(Rt, c);
@@ -1230,13 +1230,13 @@ function Gr({
       x: (u - y.left - M.x) / M.zoom,
       y: (w - y.top - M.y) / M.zoom
     };
-  }, []), ae = F((u, w) => {
+  }, []), ce = F((u, w) => {
     const c = se.current.length > 0 ? se.current : tt.current;
     let y = null;
     for (let M = c.length - 1; M >= 0; M--) {
       const C = c[M];
       if (C.hidden) continue;
-      const x = C._absolutePosition || C.position, L = C.width || fe, k = C.height || ce;
+      const x = C._absolutePosition || C.position, L = C.width || he, k = C.height || ue;
       if (u >= x.x && u <= x.x + L && w >= x.y && w <= x.y + k) {
         if (C.type === "group") {
           y || (y = C);
@@ -1246,8 +1246,8 @@ function Gr({
       }
     }
     return y;
-  }, []), J = F((u, w) => {
-    const c = w.width || fe, y = w.height || ce;
+  }, []), O = F((u, w) => {
+    const c = w.width || he, y = w.height || ue;
     if (u.x !== void 0 && u.y !== void 0)
       return { x: w.position.x + u.x, y: w.position.y + u.y };
     switch (u.position || (u.type === "source" ? "right" : "left")) {
@@ -1262,11 +1262,11 @@ function Gr({
       default:
         return { x: w.position.x + c, y: w.position.y + y / 2 };
     }
-  }, []), Yt = F((u) => {
-    const w = u.width || fe, c = u.height || ce;
+  }, []), Tt = F((u) => {
+    const w = u.width || he, c = u.height || ue;
     if (u.handles && u.handles.length > 0)
       return u.handles.map((k) => {
-        const Z = J(k, u);
+        const Z = O(k, u);
         return { id: k.id || null, type: k.type, x: Z.x, y: Z.y };
       });
     const y = u.targetPosition || "left", M = u.sourcePosition || "right", C = (k) => {
@@ -1287,24 +1287,24 @@ function Gr({
       { id: null, type: "target", x: x.x, y: x.y },
       { id: null, type: "source", x: L.x, y: L.y }
     ];
-  }, [J]), bt = F((u, w) => {
-    const c = tt.current, y = ct.current, M = Math.max(jr, he) / y.zoom;
+  }, [O]), bt = F((u, w) => {
+    const c = tt.current, y = ct.current, M = Math.max(jr, ye) / y.zoom;
     for (let C = c.length - 1; C >= 0; C--) {
       const x = c[C];
       if (x.hidden) continue;
-      const L = Yt(x);
+      const L = Tt(x);
       for (const k of L)
         if (Math.abs(u - k.x) < M && Math.abs(w - k.y) < M)
           return { nodeId: x.id, handleId: k.id, type: k.type, x: k.x, y: k.y };
     }
     return null;
-  }, [Yt]), Tt = F((u, w) => {
+  }, [Tt]), $t = F((u, w) => {
     const y = 8 / ct.current.zoom;
     for (let M = zt.current.length - 1; M >= 0; M--) {
       const C = zt.current[M], x = tt.current.find((it) => it.id === C.source), L = tt.current.find((it) => it.id === C.target);
       if (!x || !L) continue;
-      const k = x.width || fe, Z = x.height || ce, H = L.height || ce, G = x.position.x + k, O = x.position.y + Z / 2, Mt = L.position.x, $t = L.position.y + H / 2;
-      if (Or(u, w, G, O, Mt, $t) < y) return C;
+      const k = x.width || he, Z = x.height || ue, H = L.height || ue, G = x.position.x + k, Q = x.position.y + Z / 2, Mt = L.position.x, At = L.position.y + H / 2;
+      if (Or(u, w, G, Q, Mt, At) < y) return C;
     }
     return null;
   }, []);
@@ -1325,15 +1325,15 @@ function Gr({
       edgeRouting: we
     });
     x.onmessage = (H) => {
-      var G, O, Mt, $t;
-      H.data.type === "hud" && ((G = ze.current) == null || G.call(ze, H.data.data)), H.data.type === "ready" && _n(!0), H.data.type === "nodesProcessed" && ((O = Xe.current) == null || O.call(Xe, H.data.data)), H.data.type === "error" && (($t = (Mt = j.current).onError) == null || $t.call(Mt, "worker-error", H.data.message || "Canvas worker error"));
+      var G, Q, Mt, At;
+      H.data.type === "hud" && ((G = ze.current) == null || G.call(ze, H.data.data)), H.data.type === "ready" && _n(!0), H.data.type === "nodesProcessed" && ((Q = Xe.current) == null || Q.call(Xe, H.data.data)), H.data.type === "error" && ((At = (Mt = j.current).onError) == null || At.call(Mt, "worker-error", H.data.message || "Canvas worker error"));
     }, x.onerror = (H) => {
-      var G, O;
-      (O = (G = j.current).onError) == null || O.call(G, "worker-error", H.message || "Canvas worker crashed");
+      var G, Q;
+      (Q = (G = j.current).onError) == null || Q.call(G, "worker-error", H.message || "Canvas worker crashed");
     }, St.current = x;
     const L = new ResizeObserver((H) => {
-      const { width: G, height: O } = H[0].contentRect;
-      x.postMessage({ type: "resize", data: { width: G, height: O } });
+      const { width: G, height: Q } = H[0].contentRect;
+      x.postMessage({ type: "resize", data: { width: G, height: Q } });
     });
     L.observe(w);
     let k, Z;
@@ -1347,7 +1347,7 @@ function Gr({
     var u;
     (u = St.current) == null || u.postMessage({ type: "edgeRouting", data: { enabled: we } });
   }, [we]);
-  const de = K(0), ut = F((u = null) => {
+  const fe = K(0), ut = F((u = null) => {
     var y, M, C;
     const w = ct.current;
     if (me) {
@@ -1360,22 +1360,22 @@ function Gr({
     (y = St.current) == null || y.postMessage({ type: "camera", data: { camera: { ...w } } });
     const c = { x: w.x, y: w.y, zoom: w.zoom };
     (C = (M = j.current).onMove) == null || C.call(M, u, c);
-    for (const x of ge) x(c);
-    cancelAnimationFrame(de.current), de.current = requestAnimationFrame(() => {
+    for (const x of ae) x(c);
+    cancelAnimationFrame(fe.current), fe.current = requestAnimationFrame(() => {
       Wn({ x: w.x, y: w.y, zoom: w.zoom });
     });
-  }, [ge, me]), Vt = F(() => {
+  }, [ae, me]), Vt = F(() => {
     var c, y;
     const u = Gt.current, w = je.current;
     u && w ? ((c = St.current) == null || c.postMessage({ type: "connecting", data: { from: u.startPos, to: w, _routedPoints: null } }), Re({ source: u.sourceId, sourceHandle: u.sourceHandle, target: null, targetHandle: null })) : ((y = St.current) == null || y.postMessage({ type: "connecting", data: null }), Re(null));
   }, []), Ce = F(() => {
     var w, c;
-    const u = Xt.current;
+    const u = Yt.current;
     u ? (w = St.current) == null || w.postMessage({ type: "selectionBox", data: u }) : (c = St.current) == null || c.postMessage({ type: "selectionBox", data: null });
   }, []), Fn = F((u) => {
-    var x, L, k, Z, H, G, O, Mt, $t, nt, it, Et, At, Zt, te, Qt, on, pe;
+    var x, L, k, Z, H, G, Q, Mt, At, nt, it, Et, Bt, Zt, te, Qt, on, pe;
     const w = tt.current.length > 0, c = It(u.clientX, u.clientY), y = Ge.current;
-    if (w && Dt && !y) {
+    if (w && Ht && !y) {
       const q = bt(c.x, c.y);
       if ($e && Ne.current && q) {
         const rt = Ne.current;
@@ -1386,7 +1386,7 @@ function Gr({
         Ne.current = null;
         return;
       }
-      if (Ht === "strict" ? q && q.type === "source" : q != null) {
+      if (_t === "strict" ? q && q.type === "source" : q != null) {
         if ($e) {
           Ne.current = { nodeId: q.nodeId, handleId: q.handleId || null, handleType: q.type }, (k = (L = j.current).onConnectStart) == null || k.call(L, u, { nodeId: q.nodeId, handleId: q.handleId, handleType: q.type });
           return;
@@ -1418,7 +1418,7 @@ function Gr({
       return !1;
     };
     if (w) {
-      const q = ae(c.x, c.y);
+      const q = ce(c.x, c.y);
       if (q) {
         if (Nt.current && Ut) {
           const mt = [];
@@ -1440,16 +1440,16 @@ function Gr({
                 { type: "add", item: { ...tt.current[rt], selected: !0 } }
               ]);
             }
-            le();
+            de();
           }
         }
-        if ((O = Fe.current) == null || O.call(Fe, u, q), Bt && !M(u.target)) {
+        if ((Q = Fe.current) == null || Q.call(Fe, u, q), Dt && !M(u.target)) {
           const mt = q.selected;
           let rt = null;
           if (q.parentId && q.extent === "parent") {
             const ft = tt.current.find((ee) => ee.id === q.parentId);
             if (ft) {
-              const ee = ft.width || fe, sn = ft.height || ce, wn = q.width || ((Mt = q.measured) == null ? void 0 : Mt.width) || fe, an = q.height || (($t = q.measured) == null ? void 0 : $t.height) || ce;
+              const ee = ft.width || he, sn = ft.height || ue, wn = q.width || ((Mt = q.measured) == null ? void 0 : Mt.width) || he, an = q.height || ((At = q.measured) == null ? void 0 : At.height) || ue;
               rt = { minX: 0, minY: 0, maxX: ee - wn, maxY: sn - an };
             }
           }
@@ -1465,7 +1465,7 @@ function Gr({
               if (ft.parentId && ft.extent === "parent") {
                 const an = tt.current.find((qn) => qn.id === ft.parentId);
                 if (an) {
-                  const qn = an.width || fe, Wr = an.height || ce, Fr = ft.width || ((sn = ft.measured) == null ? void 0 : sn.width) || fe, Xr = ft.height || ((wn = ft.measured) == null ? void 0 : wn.height) || ce;
+                  const qn = an.width || he, Wr = an.height || ue, Fr = ft.width || ((sn = ft.measured) == null ? void 0 : sn.width) || he, Xr = ft.height || ((wn = ft.measured) == null ? void 0 : wn.height) || ue;
                   ee = { minX: 0, minY: 0, maxX: qn - Fr, maxY: Wr - Xr };
                 }
               }
@@ -1473,7 +1473,7 @@ function Gr({
             }) : []
           }, (nt = vt.current) == null || nt.setPointerCapture(u.pointerId), (it = Qe.current) == null || it.call(Qe, u, q), qt.current.selectedStarts.length > 0) {
             const ft = tt.current.filter((ee) => ee.selected);
-            (At = (Et = j.current).onSelectionDragStart) == null || At.call(Et, u, ft);
+            (Bt = (Et = j.current).onSelectionDragStart) == null || Bt.call(Et, u, ft);
           }
           if (Nt.current) {
             const ft = [{ id: q.id, type: "position", dragging: !0 }];
@@ -1486,7 +1486,7 @@ function Gr({
       }
     }
     if (zt.current.length > 0 && Ut) {
-      const q = Tt(c.x, c.y);
+      const q = $t(c.x, c.y);
       if (q) {
         if (Pt.current) {
           const mt = [];
@@ -1508,7 +1508,7 @@ function Gr({
                 { type: "add", item: { ...zt.current[rt], selected: !0 } }
               ]);
             }
-            le();
+            de();
           }
         }
         (Zt = Ve.current) == null || Zt.call(Ve, u, q);
@@ -1517,35 +1517,35 @@ function Gr({
     }
     if (!y) {
       const q = tt.current.filter((rt) => rt.selected).map((rt) => ({ id: rt.id, type: "select", selected: !1 })), mt = zt.current.filter((rt) => rt.selected).map((rt) => ({ id: rt.id, type: "select", selected: !1 }));
-      q.length && Nt.current && Nt.current(q), mt.length && Pt.current && Pt.current(mt), (q.length || mt.length) && le();
+      q.length && Nt.current && Nt.current(q), mt.length && Pt.current && Pt.current(mt), (q.length || mt.length) && de();
     }
     if ((te = tn.current) == null || te.call(tn, u), kt || y) {
-      Xt.current = { startWorld: { ...c }, endWorld: { ...c } }, (Qt = vt.current) == null || Qt.setPointerCapture(u.pointerId), Ce();
+      Yt.current = { startWorld: { ...c }, endWorld: { ...c } }, (Qt = vt.current) == null || Qt.setPointerCapture(u.pointerId), Ce();
       return;
     }
-    C(u.target) || (ye.current = !0, _e.current = { x: u.clientX, y: u.clientY }, (on = vt.current) == null || on.classList.add("dragging"), (pe = vt.current) == null || pe.setPointerCapture(u.pointerId));
-  }, [It, ae, bt, Tt, Bt, Dt, Ut, kt, Vt, Ce, le, De, He]), Xn = F((u) => {
+    C(u.target) || (ge.current = !0, _e.current = { x: u.clientX, y: u.clientY }, (on = vt.current) == null || on.classList.add("dragging"), (pe = vt.current) == null || pe.setPointerCapture(u.pointerId));
+  }, [It, ce, bt, $t, Dt, Ht, Ut, kt, Vt, Ce, de, De, He]), Xn = F((u) => {
     var c, y, M, C;
     if (Gt.current) {
       if (je.current = It(u.clientX, u.clientY), Vt(), Pn) {
         const x = vt.current;
         if (x) {
           const L = x.getBoundingClientRect(), k = 40, Z = u.clientX - L.left, H = u.clientY - L.top;
-          let G = 0, O = 0;
-          Z < k ? G = ue : Z > L.width - k && (G = -ue), H < k ? O = ue : H > L.height - k && (O = -ue), (G || O) && (ct.current.x += G, ct.current.y += O, ut(u));
+          let G = 0, Q = 0;
+          Z < k ? G = le : Z > L.width - k && (G = -le), H < k ? Q = le : H > L.height - k && (Q = -le), (G || Q) && (ct.current.x += G, ct.current.y += Q, ut(u));
         }
       }
       return;
     }
-    if (Xt.current) {
-      Xt.current.endWorld = It(u.clientX, u.clientY), Ce();
-      const x = Xt.current, L = Math.min(x.startWorld.x, x.endWorld.x), k = Math.min(x.startWorld.y, x.endWorld.y), Z = Math.max(x.startWorld.x, x.endWorld.x), H = Math.max(x.startWorld.y, x.endWorld.y);
+    if (Yt.current) {
+      Yt.current.endWorld = It(u.clientX, u.clientY), Ce();
+      const x = Yt.current, L = Math.min(x.startWorld.x, x.endWorld.x), k = Math.min(x.startWorld.y, x.endWorld.y), Z = Math.max(x.startWorld.x, x.endWorld.x), H = Math.max(x.startWorld.y, x.endWorld.y);
       if (Nt.current) {
         const G = [];
-        for (const O of tt.current) {
-          if (O.hidden) continue;
-          const Mt = O.width || fe, $t = O.height || ce, nt = Jt === "full" ? O.position.x >= L && O.position.x + Mt <= Z && O.position.y >= k && O.position.y + $t <= H : O.position.x + Mt > L && O.position.x < Z && O.position.y + $t > k && O.position.y < H;
-          nt !== !!O.selected && G.push({ id: O.id, type: "select", selected: nt });
+        for (const Q of tt.current) {
+          if (Q.hidden) continue;
+          const Mt = Q.width || he, At = Q.height || ue, nt = Jt === "full" ? Q.position.x >= L && Q.position.x + Mt <= Z && Q.position.y >= k && Q.position.y + At <= H : Q.position.x + Mt > L && Q.position.x < Z && Q.position.y + At > k && Q.position.y < H;
+          nt !== !!Q.selected && G.push({ id: Q.id, type: "select", selected: nt });
         }
         G.length && Nt.current(G);
       }
@@ -1554,32 +1554,32 @@ function Gr({
     if (qt.current) {
       const x = It(u.clientX, u.clientY), L = qt.current, k = x.x - L.startMouse.x, Z = x.y - L.startMouse.y;
       let H = { x: L.startPos.x + k, y: L.startPos.y + Z };
-      if (_t && (H = sr(H, jt)), ve && (H = ir(H, ve)), L.parentClamp) {
+      if (Wt && (H = sr(H, jt)), ve && (H = ir(H, ve)), L.parentClamp) {
         const nt = L.parentClamp;
         H = { x: Math.max(nt.minX, Math.min(H.x, nt.maxX)), y: Math.max(nt.minY, Math.min(H.y, nt.maxY)) };
       }
       const G = [{ id: L.id, position: H }];
       for (const nt of L.selectedStarts) {
         let it = { x: nt.startPos.x + k, y: nt.startPos.y + Z };
-        if (_t && (it = sr(it, jt)), ve && (it = ir(it, ve)), nt.parentClamp) {
+        if (Wt && (it = sr(it, jt)), ve && (it = ir(it, ve)), nt.parentClamp) {
           const Et = nt.parentClamp;
           it = { x: Math.max(Et.minX, Math.min(it.x, Et.maxX)), y: Math.max(Et.minY, Math.min(it.y, Et.maxY)) };
         }
         G.push({ id: nt.id, position: it });
       }
-      const O = [];
+      const Q = [];
       for (const nt of G) {
         const it = tt.current.find((Et) => Et.id === nt.id);
         if (it) {
           it.position = nt.position, it.dragging = !0;
           let Et = nt.position;
           if (it.parentId) {
-            let At = tt.current.find((Qt) => Qt.id === it.parentId), Zt = nt.position.x, te = nt.position.y;
-            for (; At; )
-              Zt += At.position.x, te += At.position.y, At = At.parentId ? tt.current.find((Qt) => Qt.id === At.parentId) : null;
+            let Bt = tt.current.find((Qt) => Qt.id === it.parentId), Zt = nt.position.x, te = nt.position.y;
+            for (; Bt; )
+              Zt += Bt.position.x, te += Bt.position.y, Bt = Bt.parentId ? tt.current.find((Qt) => Qt.id === Bt.parentId) : null;
             Et = { x: Zt, y: te };
           }
-          O.push({
+          Q.push({
             id: nt.id,
             position: nt.position,
             _absolutePosition: Et,
@@ -1593,43 +1593,43 @@ function Gr({
       const Mt = new Set(G.map((nt) => nt.id));
       for (const nt of tt.current)
         if (nt.parentId && Mt.has(nt.parentId) && !Mt.has(nt.id)) {
-          let it = tt.current.find((Zt) => Zt.id === nt.parentId), Et = nt.position.x, At = nt.position.y;
+          let it = tt.current.find((Zt) => Zt.id === nt.parentId), Et = nt.position.x, Bt = nt.position.y;
           for (; it; )
-            Et += it.position.x, At += it.position.y, it = it.parentId ? tt.current.find((Zt) => Zt.id === it.parentId) : null;
-          O.push({
+            Et += it.position.x, Bt += it.position.y, it = it.parentId ? tt.current.find((Zt) => Zt.id === it.parentId) : null;
+          Q.push({
             id: nt.id,
             position: nt.position,
-            _absolutePosition: { x: Et, y: At },
+            _absolutePosition: { x: Et, y: Bt },
             width: nt.width,
             height: nt.height,
             dragging: !1,
             selected: nt.selected
           });
         }
-      if ((c = St.current) == null || c.postMessage({ type: "nodePositions", data: { updates: O } }), Ln) {
+      if ((c = St.current) == null || c.postMessage({ type: "nodePositions", data: { updates: Q } }), Ln) {
         const nt = vt.current;
         if (nt) {
-          const it = nt.getBoundingClientRect(), Et = 40, At = u.clientX - it.left, Zt = u.clientY - it.top;
+          const it = nt.getBoundingClientRect(), Et = 40, Bt = u.clientX - it.left, Zt = u.clientY - it.top;
           let te = 0, Qt = 0;
-          At < Et ? te = ue : At > it.width - Et && (te = -ue), Zt < Et ? Qt = ue : Zt > it.height - Et && (Qt = -ue), (te || Qt) && (ct.current.x += te, ct.current.y += Qt, ut(u));
+          Bt < Et ? te = le : Bt > it.width - Et && (te = -le), Zt < Et ? Qt = le : Zt > it.height - Et && (Qt = -le), (te || Qt) && (ct.current.x += te, ct.current.y += Qt, ut(u));
         }
       }
-      const $t = tt.current.find((nt) => nt.id === L.id);
-      if ($t && ((y = Je.current) == null || y.call(Je, u, $t)), L.selectedStarts.length > 0) {
+      const At = tt.current.find((nt) => nt.id === L.id);
+      if (At && ((y = Je.current) == null || y.call(Je, u, At)), L.selectedStarts.length > 0) {
         const nt = tt.current.filter((it) => it.selected);
         (C = (M = j.current).onSelectionDrag) == null || C.call(M, u, nt);
       }
       return;
     }
-    if (!ye.current) return;
+    if (!ge.current) return;
     const w = ct.current;
     w.x += u.clientX - _e.current.x, w.y += u.clientY - _e.current.y, _e.current = { x: u.clientX, y: u.clientY }, ut();
   }, [ut, It, Vt, Ce]), Le = F((u) => {
     var w, c, y, M, C, x, L;
     if (Gt.current) {
       const k = It(u.clientX, u.clientY), Z = bt(k.x, k.y);
-      if (Z && Z.nodeId !== Gt.current.sourceId && (Ht === "loose" || Z.type === "target")) {
-        const O = Gt.current.sourceType === "target" ? {
+      if (Z && Z.nodeId !== Gt.current.sourceId && (_t === "loose" || Z.type === "target")) {
+        const Q = Gt.current.sourceType === "target" ? {
           source: Z.nodeId,
           target: Gt.current.sourceId,
           sourceHandle: Z.handleId || null,
@@ -1640,28 +1640,28 @@ function Gr({
           sourceHandle: Gt.current.sourceHandle,
           targetHandle: Z.handleId || null
         };
-        (j.current.isValidConnection ? j.current.isValidConnection(O) : !0) && ((w = ke.current) == null || w.call(ke, { ...O, ...Be }));
+        (j.current.isValidConnection ? j.current.isValidConnection(Q) : !0) && ((w = ke.current) == null || w.call(ke, { ...Q, ...Be }));
       }
       (y = (c = j.current).onConnectEnd) == null || y.call(c, u.nativeEvent || u), Gt.current = null, je.current = null, Vt();
       return;
     }
-    if (Xt.current) {
-      Xt.current = null, Ce(), le();
+    if (Yt.current) {
+      Yt.current = null, Ce(), de();
       return;
     }
     if (qt.current) {
       const k = qt.current;
       if (Nt.current) {
-        const H = tt.current.find((O) => O.id === k.id), G = [{
+        const H = tt.current.find((Q) => Q.id === k.id), G = [{
           id: k.id,
           type: "position",
           position: H ? { ...H.position } : void 0,
           dragging: !1
         }];
-        for (const O of k.selectedStarts) {
-          const Mt = tt.current.find(($t) => $t.id === O.id);
+        for (const Q of k.selectedStarts) {
+          const Mt = tt.current.find((At) => At.id === Q.id);
           G.push({
-            id: O.id,
+            id: Q.id,
             type: "position",
             position: Mt ? { ...Mt.position } : void 0,
             dragging: !1
@@ -1680,8 +1680,8 @@ function Gr({
       Z && ((x = Ke.current) == null || x.call(Ke, u, Z));
       return;
     }
-    ye.current = !1, (L = vt.current) == null || L.classList.remove("dragging");
-  }, [It, bt, Vt, Ce, le]);
+    ge.current = !1, (L = vt.current) == null || L.classList.remove("dragging");
+  }, [It, bt, Vt, Ce, de]);
   gt(() => {
     const u = vt.current;
     if (!u) return;
@@ -1718,8 +1718,8 @@ function Gr({
         x.preventDefault();
         const L = x.touches[0].clientX - x.touches[1].clientX, k = x.touches[0].clientY - x.touches[1].clientY, Z = Math.hypot(L, k), H = Z / w;
         w = Z;
-        const G = ct.current, O = c.x, Mt = c.y;
-        G.x = O - (O - G.x) * H, G.y = Mt - (Mt - G.y) * H, G.zoom = Math.min(lt, Math.max(at, G.zoom * H)), ut(x);
+        const G = ct.current, Q = c.x, Mt = c.y;
+        G.x = Q - (Q - G.x) * H, G.y = Mt - (Mt - G.y) * H, G.zoom = Math.min(lt, Math.max(at, G.zoom * H)), ut(x);
       }
     }, C = () => {
       w = 0, c = null;
@@ -1732,32 +1732,32 @@ function Gr({
     const u = vt.current;
     if (!u) return;
     const w = (c) => {
-      var H, G, O, Mt;
+      var H, G, Q, Mt;
       const y = It(c.clientX, c.clientY);
-      if (ae(y.x, y.y)) {
-        (G = (H = j.current).onNodeDoubleClick) == null || G.call(H, c, ae(y.x, y.y));
+      if (ce(y.x, y.y)) {
+        (G = (H = j.current).onNodeDoubleClick) == null || G.call(H, c, ce(y.x, y.y));
         return;
       }
-      const M = Tt(y.x, y.y);
+      const M = $t(y.x, y.y);
       if (M) {
-        (Mt = (O = j.current).onEdgeDoubleClick) == null || Mt.call(O, c, M);
+        (Mt = (Q = j.current).onEdgeDoubleClick) == null || Mt.call(Q, c, M);
         return;
       }
       const C = 1.5, x = u.getBoundingClientRect(), L = c.clientX - x.left, k = c.clientY - x.top, Z = ct.current;
       Z.x = L - (L - Z.x) * C, Z.y = k - (k - Z.y) * C, Z.zoom = Math.min(lt, Math.max(at, Z.zoom * C)), ut(c);
     };
     return u.addEventListener("dblclick", w), () => u.removeEventListener("dblclick", w);
-  }, [gn, ut, at, lt, It, ae, Tt]), gt(() => {
+  }, [gn, ut, at, lt, It, ce, $t]), gt(() => {
     const u = vt.current;
     if (!u) return;
     const w = (c) => {
       var x, L, k, Z, H, G;
-      const y = It(c.clientX, c.clientY), M = ae(y.x, y.y);
+      const y = It(c.clientX, c.clientY), M = ce(y.x, y.y);
       if (M) {
         (L = (x = j.current).onNodeContextMenu) == null || L.call(x, c, M);
         return;
       }
-      const C = Tt(y.x, y.y);
+      const C = $t(y.x, y.y);
       if (C) {
         (Z = (k = j.current).onEdgeContextMenu) == null || Z.call(k, c, C);
         return;
@@ -1765,29 +1765,29 @@ function Gr({
       (G = (H = j.current).onPaneContextMenu) == null || G.call(H, c);
     };
     return u.addEventListener("contextmenu", w), () => u.removeEventListener("contextmenu", w);
-  }, [It, ae, Tt]), gt(() => {
+  }, [It, ce, $t]), gt(() => {
     const u = vt.current;
     if (!u) return;
     let w = null, c = null;
     const y = (x) => {
-      var Z, H, G, O, Mt, $t, nt, it, Et, At, Zt, te, Qt, on;
-      if ((H = (Z = j.current).onPaneMouseMove) == null || H.call(Z, x), ye.current || qt.current || Gt.current || Xt.current) return;
-      const L = It(x.clientX, x.clientY), k = ae(L.x, L.y);
-      if (k !== w && (w && ((O = (G = j.current).onNodeMouseLeave) == null || O.call(G, x, w)), k && (($t = (Mt = j.current).onNodeMouseEnter) == null || $t.call(Mt, x, k)), w = k), k && ((it = (nt = j.current).onNodeMouseMove) == null || it.call(nt, x, k)), !k) {
-        const pe = Tt(L.x, L.y);
-        pe !== c && (c && ((At = (Et = j.current).onEdgeMouseLeave) == null || At.call(Et, x, c)), pe && ((te = (Zt = j.current).onEdgeMouseEnter) == null || te.call(Zt, x, pe)), c = pe), pe && ((on = (Qt = j.current).onEdgeMouseMove) == null || on.call(Qt, x, pe));
+      var Z, H, G, Q, Mt, At, nt, it, Et, Bt, Zt, te, Qt, on;
+      if ((H = (Z = j.current).onPaneMouseMove) == null || H.call(Z, x), ge.current || qt.current || Gt.current || Yt.current) return;
+      const L = It(x.clientX, x.clientY), k = ce(L.x, L.y);
+      if (k !== w && (w && ((Q = (G = j.current).onNodeMouseLeave) == null || Q.call(G, x, w)), k && ((At = (Mt = j.current).onNodeMouseEnter) == null || At.call(Mt, x, k)), w = k), k && ((it = (nt = j.current).onNodeMouseMove) == null || it.call(nt, x, k)), !k) {
+        const pe = $t(L.x, L.y);
+        pe !== c && (c && ((Bt = (Et = j.current).onEdgeMouseLeave) == null || Bt.call(Et, x, c)), pe && ((te = (Zt = j.current).onEdgeMouseEnter) == null || te.call(Zt, x, pe)), c = pe), pe && ((on = (Qt = j.current).onEdgeMouseMove) == null || on.call(Qt, x, pe));
       }
     }, M = (x) => {
       var L, k;
       return (k = (L = j.current).onPaneMouseEnter) == null ? void 0 : k.call(L, x);
     }, C = (x) => {
-      var L, k, Z, H, G, O;
-      (k = (L = j.current).onPaneMouseLeave) == null || k.call(L, x), w && ((H = (Z = j.current).onNodeMouseLeave) == null || H.call(Z, x, w), w = null), c && ((O = (G = j.current).onEdgeMouseLeave) == null || O.call(G, x, c), c = null);
+      var L, k, Z, H, G, Q;
+      (k = (L = j.current).onPaneMouseLeave) == null || k.call(L, x), w && ((H = (Z = j.current).onNodeMouseLeave) == null || H.call(Z, x, w), w = null), c && ((Q = (G = j.current).onEdgeMouseLeave) == null || Q.call(G, x, c), c = null);
     };
     return u.addEventListener("mousemove", y), u.addEventListener("mouseenter", M), u.addEventListener("mouseleave", C), () => {
       u.removeEventListener("mousemove", y), u.removeEventListener("mouseenter", M), u.removeEventListener("mouseleave", C);
     };
-  }, [It, ae, Tt]), gt(() => {
+  }, [It, ce, $t]), gt(() => {
     const u = Array.isArray(Kt) ? Kt : [Kt], w = async (c) => {
       var y, M, C, x;
       if (u.includes(c.key)) {
@@ -1940,14 +1940,14 @@ function Gr({
       if (!c) return;
       const y = c.getBoundingClientRect();
       u.position = {
-        x: Math.round(-w.x / w.zoom + y.width / 2 / w.zoom) - fe / 2,
-        y: Math.round(-w.y / w.zoom + y.height / 2 / w.zoom) - ce / 2
+        x: Math.round(-w.x / w.zoom + y.width / 2 / w.zoom) - he / 2,
+        y: Math.round(-w.y / w.zoom + y.height / 2 / w.zoom) - ue / 2
       };
     }
     u.data || (u.data = { label: u.id }), Nt.current && Nt.current([{ type: "add", item: u }]);
   }, []), Yn = F(() => ({ ...ct.current }), []), Un = F((u) => {
     ct.current = { ...ct.current, ...u }, ut();
-  }, [ut]), Hr = F((u) => It(u.x, u.y), [It]), or = n, _r = Wt(() => ({
+  }, [ut]), Hr = F((u) => It(u.x, u.y), [It]), or = n, _r = Ft(() => ({
     wrapRef: vt,
     canvasRef: Ze,
     workerRef: St,
@@ -1960,11 +1960,11 @@ function Gr({
     onEdgesChangeRef: Pt,
     sendCamera: ut,
     screenToWorld: It,
-    viewportListeners: ge,
+    viewportListeners: ae,
     selectionListeners: oe,
     zoomMin: at,
     zoomMax: lt,
-    snapToGrid: _t,
+    snapToGrid: Wt,
     snapGrid: jt,
     nodeExtent: ve,
     defaultEdgeOptions: Be,
@@ -1987,7 +1987,7 @@ function Gr({
     get connection() {
       return Me;
     }
-  }), [e, n, or, Oe, Me, ut, It, mn, ge, oe, at, lt, _t, jt, ve, Be, we, De, He]);
+  }), [e, n, or, Oe, Me, ut, It, mn, ae, oe, at, lt, Wt, jt, ve, Be, we, De, He]);
   return {
     wrapRef: vt,
     canvasRef: Ze,
@@ -2148,8 +2148,8 @@ function to({ node: t, nodeType: e }) {
     const W = () => {
       var V, ht;
       P && ((ht = (V = r.current.onNodesChangeRef).current) == null || ht.call(V, P), P = null), S = null;
-    }, Q = (V) => {
-      var Dt, Ut;
+    }, J = (V) => {
+      var Ht, Ut;
       if (!a.current) return;
       const ht = r.current.cameraRef.current, wt = A.getBoundingClientRect(), at = (V.clientX - wt.left - ht.x) / ht.zoom, lt = (V.clientY - wt.top - ht.y) / ht.zoom, Lt = at - a.current.startMouse.x, re = lt - a.current.startMouse.y;
       let dt = { x: a.current.startPos.x + Lt, y: a.current.startPos.y + re };
@@ -2159,10 +2159,10 @@ function to({ node: t, nodeType: e }) {
       }), t.parentId && t.extent === "parent") {
         const yt = r.current.nodesRef.current.find((kt) => kt.id === t.parentId);
         if (yt) {
-          const kt = yt.width || 160, Jt = yt.height || 60, Ht = t.width || ((Dt = t.measured) == null ? void 0 : Dt.width) || 160, he = t.height || ((Ut = t.measured) == null ? void 0 : Ut.height) || 60;
+          const kt = yt.width || 160, Jt = yt.height || 60, _t = t.width || ((Ht = t.measured) == null ? void 0 : Ht.width) || 160, ye = t.height || ((Ut = t.measured) == null ? void 0 : Ut.height) || 60;
           dt = {
-            x: Math.max(0, Math.min(dt.x, kt - Ht)),
-            y: Math.max(0, Math.min(dt.y, Jt - he))
+            x: Math.max(0, Math.min(dt.x, kt - _t)),
+            y: Math.max(0, Math.min(dt.y, Jt - ye))
           };
         }
       }
@@ -2176,15 +2176,15 @@ function to({ node: t, nodeType: e }) {
         const Jt = A.querySelector(`[data-nodeid="${yt.id}"]`);
         Jt && (Jt.style.left = kt.x + "px", Jt.style.top = kt.y + "px");
       }
-      const Bt = [{ id: t.id, type: "position", position: dt, dragging: !0 }];
+      const Dt = [{ id: t.id, type: "position", position: dt, dragging: !0 }];
       for (const yt of a.current.selectedStarts) {
         let kt = { x: yt.startPos.x + Lt, y: yt.startPos.y + re };
         r.current.snapToGrid && r.current.snapGrid && (kt = {
           x: r.current.snapGrid[0] * Math.round(kt.x / r.current.snapGrid[0]),
           y: r.current.snapGrid[1] * Math.round(kt.y / r.current.snapGrid[1])
-        }), Bt.push({ id: yt.id, type: "position", position: kt, dragging: !0 });
+        }), Dt.push({ id: yt.id, type: "position", position: kt, dragging: !0 });
       }
-      P = Bt, S || (S = requestAnimationFrame(W));
+      P = Dt, S || (S = requestAnimationFrame(W));
     }, ot = (V) => {
       var wt, at;
       if (!a.current) return;
@@ -2192,9 +2192,9 @@ function to({ node: t, nodeType: e }) {
       const ht = [{ id: t.id, type: "position", dragging: !1 }];
       for (const lt of a.current.selectedStarts)
         ht.push({ id: lt.id, type: "position", dragging: !1 });
-      (at = (wt = r.current.onNodesChangeRef).current) == null || at.call(wt, ht), a.current = null, g && g.releasePointerCapture(V.pointerId), g == null || g.removeEventListener("pointermove", Q), g == null || g.removeEventListener("pointerup", ot);
+      (at = (wt = r.current.onNodesChangeRef).current) == null || at.call(wt, ht), a.current = null, g && g.releasePointerCapture(V.pointerId), g == null || g.removeEventListener("pointermove", J), g == null || g.removeEventListener("pointerup", ot);
     };
-    g == null || g.addEventListener("pointermove", Q), g == null || g.addEventListener("pointerup", ot);
+    g == null || g.addEventListener("pointermove", J), g == null || g.addEventListener("pointerup", ot);
   }, [t]), p = F((N) => {
     var A, I, U, X, T, v;
     if (!t.selected) return;
@@ -2342,7 +2342,7 @@ function oo({ edge: t, edgeType: e, nodes: n, reconnectable: r }) {
     v.stopPropagation(), v.preventDefault();
     const S = o.current, P = S.wrapRef.current;
     if (!P) return;
-    const W = T === "source" ? g : h, Q = T === "source" ? t.target : t.source;
+    const W = T === "source" ? g : h, J = T === "source" ? t.target : t.source;
     (pt = S.workerRef.current) == null || pt.postMessage({
       type: "connecting",
       data: { from: { x: W.x, y: W.y }, to: { x: W.x, y: W.y } }
@@ -2355,49 +2355,49 @@ function oo({ edge: t, edgeType: e, nodes: n, reconnectable: r }) {
         data: { from: { x: W.x, y: W.y }, to: { x: ht, y: wt } }
       });
     }, st = (xt) => {
-      var dt, Bt, Dt, Ut;
+      var dt, Dt, Ht, Ut;
       const V = S.cameraRef.current, ht = (xt.clientX - ot.left - V.x) / V.zoom, wt = (xt.clientY - ot.top - V.y) / V.zoom, at = 20 / V.zoom;
       let lt = null, Lt = null;
       const re = (dt = S.handleRegistryRef) == null ? void 0 : dt.current;
       for (const yt of S.nodesRef.current) {
         if (yt.hidden) continue;
-        const kt = yt.width || Mr, Jt = yt.height || Rr, Ht = yt._absolutePosition || yt.position, he = [];
+        const kt = yt.width || Mr, Jt = yt.height || Rr, _t = yt._absolutePosition || yt.position, ye = [];
         if (re)
-          for (const [, _t] of re)
-            _t.nodeId === yt.id && he.push(_t);
-        const $e = he.length > 0 ? he : yt.handles || [
+          for (const [, Wt] of re)
+            Wt.nodeId === yt.id && ye.push(Wt);
+        const $e = ye.length > 0 ? ye : yt.handles || [
           { type: "target", position: "left" },
           { type: "source", position: "right" }
         ];
-        for (const _t of $e) {
+        for (const Wt of $e) {
           let jt, Kt;
-          if (_t.x !== void 0 && _t.y !== void 0)
-            jt = Ht.x + _t.x, Kt = Ht.y + _t.y;
+          if (Wt.x !== void 0 && Wt.y !== void 0)
+            jt = _t.x + Wt.x, Kt = _t.y + Wt.y;
           else
-            switch (_t.position || (_t.type === "source" ? "right" : "left")) {
+            switch (Wt.position || (Wt.type === "source" ? "right" : "left")) {
               case "top":
-                jt = Ht.x + kt / 2, Kt = Ht.y;
+                jt = _t.x + kt / 2, Kt = _t.y;
                 break;
               case "bottom":
-                jt = Ht.x + kt / 2, Kt = Ht.y + Jt;
+                jt = _t.x + kt / 2, Kt = _t.y + Jt;
                 break;
               case "left":
-                jt = Ht.x, Kt = Ht.y + Jt / 2;
+                jt = _t.x, Kt = _t.y + Jt / 2;
                 break;
               default:
-                jt = Ht.x + kt, Kt = Ht.y + Jt / 2;
+                jt = _t.x + kt, Kt = _t.y + Jt / 2;
                 break;
             }
           if (Math.abs(ht - jt) < at && Math.abs(wt - Kt) < at) {
-            lt = yt, Lt = _t.id || null;
+            lt = yt, Lt = Wt.id || null;
             break;
           }
         }
         if (lt) break;
       }
       if (lt) {
-        const yt = T === "source" ? { source: lt.id, target: Q, sourceHandle: Lt, targetHandle: t.targetHandle } : { source: Q, target: lt.id, sourceHandle: t.sourceHandle, targetHandle: Lt };
-        (Dt = (Bt = S.onEdgesChangeRef).current) == null || Dt.call(Bt, [
+        const yt = T === "source" ? { source: lt.id, target: J, sourceHandle: Lt, targetHandle: t.targetHandle } : { source: J, target: lt.id, sourceHandle: t.sourceHandle, targetHandle: Lt };
+        (Ht = (Dt = S.onEdgesChangeRef).current) == null || Ht.call(Dt, [
           { id: t.id, type: "remove" },
           { type: "add", item: { id: t.id, ...yt } }
         ]);
@@ -2406,7 +2406,7 @@ function oo({ edge: t, edgeType: e, nodes: n, reconnectable: r }) {
     };
     P.addEventListener("pointermove", et), P.addEventListener("pointerup", st);
   }, [t]), l = n.find((T) => T.id === t.source), f = n.find((T) => T.id === t.target), m = l && !!(l.width || (I = l.measured) != null && I.width), z = f && !!(f.width || (U = f.measured) != null && U.width), b = o.current, E = (X = b.handleRegistryRef) == null ? void 0 : X.current, N = m ? ur(l, "source", t.sourceHandle, E) : null, R = z ? ur(f, "target", t.targetHandle, E) : null, $ = t.type === "bezier" || t.type === "simplebezier" || t.type === "default", Y = b.routedEdges || b.edges, B = Y == null ? void 0 : Y.find((T) => T.id === t.id), _ = $ ? null : (B == null ? void 0 : B._routedPoints) || t._routedPoints || null, A = r !== !1 && t.reconnectable !== !1;
-  return !N || !R ? null : /* @__PURE__ */ Ft(
+  return !N || !R ? null : /* @__PURE__ */ Xt(
     "g",
     {
       className: `ric-edge-wrapper ${t.selected ? "selected" : ""}`,
@@ -2439,7 +2439,7 @@ function oo({ edge: t, edgeType: e, nodes: n, reconnectable: r }) {
             routedPoints: _
           }
         ),
-        A && (a || t.selected) && /* @__PURE__ */ Ft(Ye, { children: [
+        A && (a || t.selected) && /* @__PURE__ */ Xt(Ye, { children: [
           /* @__PURE__ */ D(
             lr,
             {
@@ -2489,7 +2489,7 @@ function kr({ selectionKeyCode: t = "Shift", selectionMode: e = "partial" }) {
       const v = n.cameraRef.current, h = R.getBoundingClientRect(), g = (T.clientX - h.left - v.x) / v.zoom, S = (T.clientY - h.top - v.y) / v.zoom;
       i({ startX: Y.x, startY: Y.y, endX: g, endY: S });
     }, X = (T) => {
-      var Q, ot;
+      var J, ot;
       if (!$ || !Y) return;
       $ = !1;
       const v = n.cameraRef.current, h = R.getBoundingClientRect(), g = (T.clientX - h.left - v.x) / v.zoom, S = (T.clientY - h.top - v.y) / v.zoom, P = {
@@ -2503,7 +2503,7 @@ function kr({ selectionKeyCode: t = "Shift", selectionMode: e = "partial" }) {
         let V;
         e === "full" ? V = st.x >= P.x && st.y >= P.y && st.x + pt <= P.x + P.width && st.y + xt <= P.y + P.height : V = st.x + pt > P.x && st.x < P.x + P.width && st.y + xt > P.y && st.y < P.y + P.height, W.push({ id: et.id, type: "select", selected: V });
       }
-      W.length && ((ot = (Q = n.onNodesChangeRef).current) == null || ot.call(Q, W)), Y = null, i(null);
+      W.length && ((ot = (J = n.onNodesChangeRef).current) == null || ot.call(J, W)), Y = null, i(null);
     };
     return R.addEventListener("pointerdown", I, !0), R.addEventListener("pointermove", U), R.addEventListener("pointerup", X), window.addEventListener("keydown", _), window.addEventListener("keyup", A), () => {
       R.removeEventListener("pointerdown", I, !0), R.removeEventListener("pointermove", U), R.removeEventListener("pointerup", X), window.removeEventListener("keydown", _), window.removeEventListener("keyup", A);
@@ -2601,13 +2601,13 @@ function uo({
     [z]
   ), N = K(E);
   N.current = E, Yr(() => {
-    var v, h, g, S, P, W, Q;
+    var v, h, g, S, P, W, J;
     if (!m) return;
     const B = N.current(), _ = (v = B.handleRegistryRef) == null ? void 0 : v.current;
     if (!_) return;
     const A = `${m}__${n || t}`, I = (g = (h = B.nodesRef) == null ? void 0 : h.current) == null ? void 0 : g.find((ot) => ot.id === m), U = (I == null ? void 0 : I.width) || ((S = I == null ? void 0 : I.measured) == null ? void 0 : S.width), X = (I == null ? void 0 : I.height) || ((P = I == null ? void 0 : I.measured) == null ? void 0 : P.height);
     let T;
-    U && X ? T = Jn(e, U, X) : b.current ? T = ao(b.current, (Q = (W = B.cameraRef) == null ? void 0 : W.current) == null ? void 0 : Q.zoom) : T = Jn(e, 160, 60), _.set(A, { nodeId: m, id: n || null, type: t, position: e, x: T.x, y: T.y });
+    U && X ? T = Jn(e, U, X) : b.current ? T = ao(b.current, (J = (W = B.cameraRef) == null ? void 0 : W.current) == null ? void 0 : J.zoom) : T = Jn(e, 160, 60), _.set(A, { nodeId: m, id: n || null, type: t, position: e, x: T.x, y: T.y });
   }, [m, n, t, e]), gt(() => {
     if (!m) return;
     const B = N.current();
@@ -2652,14 +2652,14 @@ function uo({
     }), I.setPointerCapture(B.pointerId);
     const h = (P) => {
       var ot;
-      const W = (P.clientX - U.left - A.x) / A.zoom, Q = (P.clientY - U.top - A.y) / A.zoom;
+      const W = (P.clientX - U.left - A.x) / A.zoom, J = (P.clientY - U.top - A.y) / A.zoom;
       (ot = _.workerRef.current) == null || ot.postMessage({
         type: "connecting",
-        data: { from: { x: T, y: v }, to: { x: W, y: Q } }
+        data: { from: { x: T, y: v }, to: { x: W, y: J } }
       });
     }, g = (P) => {
       var xt, V, ht, wt;
-      const W = (P.clientX - U.left - A.x) / A.zoom, Q = (P.clientY - U.top - A.y) / A.zoom, ot = 20 / A.zoom;
+      const W = (P.clientX - U.left - A.x) / A.zoom, J = (P.clientY - U.top - A.y) / A.zoom, ot = 20 / A.zoom;
       let et = null, st = null;
       const pt = (xt = _.handleRegistryRef) == null ? void 0 : xt.current;
       for (const at of _.nodesRef.current) {
@@ -2673,27 +2673,27 @@ function uo({
           { type: "source", position: "right" }
         ];
         for (const dt of re) {
-          let Bt, Dt;
+          let Dt, Ht;
           if (dt.x !== void 0 && dt.y !== void 0)
-            Bt = lt.x + dt.x, Dt = lt.y + dt.y;
+            Dt = lt.x + dt.x, Ht = lt.y + dt.y;
           else {
             const Ut = at.width || 160, yt = at.height || 60;
             switch (dt.position || (dt.type === "source" ? "right" : "left")) {
               case "top":
-                Bt = lt.x + Ut / 2, Dt = lt.y;
+                Dt = lt.x + Ut / 2, Ht = lt.y;
                 break;
               case "bottom":
-                Bt = lt.x + Ut / 2, Dt = lt.y + yt;
+                Dt = lt.x + Ut / 2, Ht = lt.y + yt;
                 break;
               case "left":
-                Bt = lt.x, Dt = lt.y + yt / 2;
+                Dt = lt.x, Ht = lt.y + yt / 2;
                 break;
               default:
-                Bt = lt.x + Ut, Dt = lt.y + yt / 2;
+                Dt = lt.x + Ut, Ht = lt.y + yt / 2;
                 break;
             }
           }
-          if (Math.abs(W - Bt) < ot && Math.abs(Q - Dt) < ot) {
+          if (Math.abs(W - Dt) < ot && Math.abs(J - Ht) < ot) {
             et = at, st = dt.id || null;
             break;
           }
@@ -2756,7 +2756,7 @@ function Vo({
   hideSourceHandle: o = !1,
   hideTargetHandle: a = !1
 }) {
-  return /* @__PURE__ */ Ft(
+  return /* @__PURE__ */ Xt(
     "div",
     {
       className: `ric-default-node${n ? " selected" : ""}`,
@@ -2785,7 +2785,7 @@ function lo({
   sourcePosition: r = "right",
   hideSourceHandle: i = !1
 }) {
-  return /* @__PURE__ */ Ft(
+  return /* @__PURE__ */ Xt(
     "div",
     {
       className: `ric-input-node${n ? " selected" : ""}`,
@@ -2814,7 +2814,7 @@ function fo({
   targetPosition: r = "left",
   hideTargetHandle: i = !1
 }) {
-  return /* @__PURE__ */ Ft(
+  return /* @__PURE__ */ Xt(
     "div",
     {
       className: `ric-output-node${n ? " selected" : ""}`,
@@ -2889,7 +2889,7 @@ function Er({
         height: E.height
       });
     }
-  }, [n]), n ? /* @__PURE__ */ Ft(
+  }, [n]), n ? /* @__PURE__ */ Xt(
     "g",
     {
       transform: `translate(${t - m.width / 2} ${e - m.height / 2})`,
@@ -2949,7 +2949,7 @@ function In({
   className: E = "",
   ...N
 }) {
-  return /* @__PURE__ */ Ft(Ye, { children: [
+  return /* @__PURE__ */ Xt(Ye, { children: [
     /* @__PURE__ */ D(
       "path",
       {
@@ -3286,15 +3286,15 @@ function Pr(t, e, n) {
     }
     if (U[g]) continue;
     U[g] = 1;
-    const S = g / f | 0, P = g % f, W = a[P], Q = d[S], ot = I[g];
+    const S = g / f | 0, P = g % f, W = a[P], J = d[S], ot = I[g];
     for (let et = 0; et < 4; et++) {
       const st = P + v[et][0], pt = S + v[et][1];
       if (st < 0 || st >= f || pt < 0 || pt >= m) continue;
       const xt = z(st, pt);
       if (U[xt]) continue;
       const V = a[st], ht = d[pt];
-      if (xo(V, ht, n) || !tr(W, Q, V, ht, n)) continue;
-      const wt = Math.abs(V - W) + Math.abs(ht - Q), at = ot >= 0 && ot !== et ? T : 0, lt = B[g] + wt + at;
+      if (xo(V, ht, n) || !tr(W, J, V, ht, n)) continue;
+      const wt = Math.abs(V - W) + Math.abs(ht - J), at = ot >= 0 && ot !== et ? T : 0, lt = B[g] + wt + at;
       lt < B[xt] && (A[xt] = g, I[xt] = et, B[xt] = lt, _[xt] = lt + Math.abs(a[N] - V) + Math.abs(d[R] - ht), X.push(xt));
     }
   }
@@ -3545,7 +3545,7 @@ const $r = ie(function({
 $r.displayName = "SmoothStepEdge";
 const bo = ie(function({ id: e, ...n }) {
   var i;
-  const r = Wt(
+  const r = Ft(
     () => {
       var o;
       return { borderRadius: 0, offset: (o = n.pathOptions) == null ? void 0 : o.offset };
@@ -3670,7 +3670,7 @@ function ss({
   onNodeDragStop: S,
   onEdgeClick: P,
   onEdgeDoubleClick: W,
-  onEdgeMouseEnter: Q,
+  onEdgeMouseEnter: J,
   onEdgeMouseMove: ot,
   onEdgeMouseLeave: et,
   onEdgeContextMenu: st,
@@ -3684,18 +3684,18 @@ function ss({
   onMoveStart: Lt,
   onMove: re,
   onMoveEnd: dt,
-  onDelete: Bt,
-  onBeforeDelete: Dt,
+  onDelete: Dt,
+  onBeforeDelete: Ht,
   onError: Ut,
   // Drag and drop
   onDragOver: yt,
   onDrop: kt,
   onDragEnter: Jt,
-  onDragLeave: Ht,
+  onDragLeave: _t,
   // Behavior
-  nodesDraggable: he,
+  nodesDraggable: ye,
   nodesConnectable: $e,
-  elementsSelectable: _t,
+  elementsSelectable: Wt,
   multiSelectionKeyCode: jt,
   selectionOnDrag: Kt,
   selectionMode: Ae,
@@ -3711,7 +3711,7 @@ function ss({
   panOnScroll: Be,
   panOnScrollMode: Ln,
   panOnScrollSpeed: Pn,
-  zoomOnScroll: ue,
+  zoomOnScroll: le,
   zoomOnDoubleClick: rr,
   zoomOnPinch: Tn,
   preventScrolling: $n,
@@ -3732,7 +3732,7 @@ function ss({
   // Edge routing (obstacle avoidance)
   edgeRouting: xn = !0,
   // HUD
-  onHudUpdate: ye,
+  onHudUpdate: ge,
   onNodesProcessed: _e,
   showHud: Hn = !0,
   showHint: _n = !0,
@@ -3740,18 +3740,20 @@ function ss({
   children: Gt,
   ...je
 }) {
-  const [Xt, Ge] = ne({ wx: 0, wy: 0, zoom: "1.00" }), Ne = K(null), Oe = K(null), Wn = F(
-    (J) => {
-      Ge(J), ye == null || ye(J);
+  const [Yt, Ge] = ne({ wx: 0, wy: 0, zoom: "1.00" }), Ne = K(null), Oe = K(null), Wn = F(
+    (O) => {
+      Ge(O), ge == null || ge(O);
     },
-    [ye]
-  ), Me = Wt(() => ({ ...Mo, ...r }), [r]), Re = Wt(() => ({ ...Ro, ...i }), [i]), ge = Wt(() => Eo(e), [e]), oe = Wt(() => {
-    const J = e.filter((Yt) => Yt.type && Me[Yt.type]);
-    return J.sort((Yt, bt) => {
-      const Tt = Yt.type === "group" || !Yt.parentId && J.some((ut) => ut.parentId === Yt.id), de = bt.type === "group" || !bt.parentId && J.some((ut) => ut.parentId === bt.id);
-      return Tt && !de ? -1 : !Tt && de ? 1 : 0;
+    [ge]
+  ), Me = Ft(() => ({ ...Mo, ...r }), [r]), Re = Ft(() => ({ ...Ro, ...i }), [i]), ae = Ft(() => Eo(e), [e]), oe = Ft(() => {
+    const O = ae.filter(
+      (Tt) => Tt.type && Me[Tt.type] && (Tt.selected || Tt.dragging)
+    );
+    return O.sort((Tt, bt) => {
+      const $t = Tt.type === "group" || !Tt.parentId && O.some((ut) => ut.parentId === Tt.id), fe = bt.type === "group" || !bt.parentId && O.some((ut) => ut.parentId === bt.id);
+      return $t && !fe ? -1 : !$t && fe ? 1 : 0;
     });
-  }, [e, Me]), We = Wt(() => n.filter((J) => J.type && Re[J.type]), [n, Re]), j = Wt(() => e.map((J) => J.type && Me[J.type] ? { ...J, _customRendered: !0 } : J), [e, Me]), ke = Wt(() => n.map((J) => J.type && Re[J.type] ? { ...J, _customRendered: !0 } : J), [n, Re]), {
+  }, [ae, Me]), We = Ft(() => n.filter((O) => O.type && Re[O.type]), [n, Re]), j = Ft(() => e.map((O) => O.type && Me[O.type] && (O.selected || O.dragging) ? { ...O, _customRendered: !0 } : O), [e, Me]), ke = Ft(() => n.map((O) => O.type && Re[O.type] ? { ...O, _customRendered: !0 } : O), [n, Re]), {
     wrapRef: Fe,
     canvasRef: Qe,
     canvasReady: Je,
@@ -3788,7 +3790,7 @@ function ss({
     onNodeDragStop: S,
     onEdgeClick: P,
     onEdgeDoubleClick: W,
-    onEdgeMouseEnter: Q,
+    onEdgeMouseEnter: J,
     onEdgeMouseMove: ot,
     onEdgeMouseLeave: et,
     onEdgeContextMenu: st,
@@ -3802,12 +3804,12 @@ function ss({
     onMoveStart: Lt,
     onMove: re,
     onMoveEnd: dt,
-    onDelete: Bt,
-    onBeforeDelete: Dt,
+    onDelete: Dt,
+    onBeforeDelete: Ht,
     onError: Ut,
-    nodesDraggable: he,
+    nodesDraggable: ye,
     nodesConnectable: $e,
-    elementsSelectable: _t,
+    elementsSelectable: Wt,
     multiSelectionKeyCode: jt,
     selectionOnDrag: Kt,
     selectionMode: Ae,
@@ -3823,7 +3825,7 @@ function ss({
     panOnScroll: Be,
     panOnScrollMode: Ln,
     panOnScrollSpeed: Pn,
-    zoomOnScroll: ue,
+    zoomOnScroll: le,
     zoomOnDoubleClick: rr,
     zoomOnPinch: Tn,
     preventScrolling: $n,
@@ -3845,7 +3847,7 @@ function ss({
   gt(() => {
     Xe && queueMicrotask(() => {
       ze.setState({
-        nodes: ge,
+        nodes: ae,
         edges: n,
         nodesRef: Rt.nodesRef,
         edgesRef: Rt.edgesRef,
@@ -3856,13 +3858,13 @@ function ss({
         workerRef: Rt.workerRef
       });
     });
-  }, [Xe, ge, n, Rt, ze]);
-  const Nt = Wt(() => ({
+  }, [Xe, ae, n, Rt, ze]);
+  const Nt = Ft(() => ({
     ...Rt,
     edgeLabelContainerRef: Ne,
     viewportPortalRef: Oe,
     get nodes() {
-      return ge;
+      return ae;
     },
     get edges() {
       return n;
@@ -3880,40 +3882,40 @@ function ss({
       return Rt.wrapRef.current;
     },
     get width() {
-      var J;
-      return ((J = Rt.wrapRef.current) == null ? void 0 : J.clientWidth) || 0;
+      var O;
+      return ((O = Rt.wrapRef.current) == null ? void 0 : O.clientWidth) || 0;
     },
     get height() {
-      var J;
-      return ((J = Rt.wrapRef.current) == null ? void 0 : J.clientHeight) || 0;
+      var O;
+      return ((O = Rt.wrapRef.current) == null ? void 0 : O.clientHeight) || 0;
     }
-  }), [Rt, ge, n]), en = K(null), Pt = K(null), nn = K(null), le = K(null), Ie = K(null);
+  }), [Rt, ae, n]), en = K(null), Pt = K(null), nn = K(null), de = K(null), Ie = K(null);
   gt(() => {
-    let J;
-    const Yt = () => {
-      const bt = Rt.cameraRef.current, Tt = `translate(${bt.x}px, ${bt.y}px) scale(${bt.zoom})`, de = `translate(${bt.x}, ${bt.y}) scale(${bt.zoom})`;
-      en.current && (en.current.style.transform = Tt), Pt.current && Pt.current.setAttribute("transform", de), nn.current && (nn.current.style.transform = Tt), le.current && (le.current.style.transform = Tt);
+    let O;
+    const Tt = () => {
+      const bt = Rt.cameraRef.current, $t = `translate(${bt.x}px, ${bt.y}px) scale(${bt.zoom})`, fe = `translate(${bt.x}, ${bt.y}) scale(${bt.zoom})`;
+      en.current && (en.current.style.transform = $t), Pt.current && Pt.current.setAttribute("transform", fe), nn.current && (nn.current.style.transform = $t), de.current && (de.current.style.transform = $t);
       const ut = Fe.current;
       if (ut) {
         const Vt = bt.zoom < 0.15 ? "lod-minimal" : bt.zoom < 0.35 ? "lod-reduced" : null;
         Vt !== Ie.current && (ut.classList.remove("lod-minimal", "lod-reduced"), Vt && ut.classList.add(Vt), Ie.current = Vt);
       }
-      J = requestAnimationFrame(Yt);
+      O = requestAnimationFrame(Tt);
     };
-    return J = requestAnimationFrame(Yt), () => cancelAnimationFrame(J);
+    return O = requestAnimationFrame(Tt), () => cancelAnimationFrame(O);
   }, [Rt]);
   const [se, Ee] = ne(null);
   gt(() => {
     if (!oe.length) return;
-    let J;
-    const Yt = () => {
+    let O;
+    const Tt = () => {
       var rn, vn;
-      const bt = Rt.cameraRef.current, Tt = Rt.wrapRef.current;
-      if (!Tt) {
-        J = requestAnimationFrame(Yt);
+      const bt = Rt.cameraRef.current, $t = Rt.wrapRef.current;
+      if (!$t) {
+        O = requestAnimationFrame(Tt);
         return;
       }
-      const de = Tt.getBoundingClientRect(), ut = 200, Vt = -bt.x / bt.zoom - ut, Ce = -bt.y / bt.zoom - ut, Fn = (de.width - bt.x) / bt.zoom + ut, Xn = (de.height - bt.y) / bt.zoom + ut, Le = /* @__PURE__ */ new Set();
+      const fe = $t.getBoundingClientRect(), ut = 200, Vt = -bt.x / bt.zoom - ut, Ce = -bt.y / bt.zoom - ut, Fn = (fe.width - bt.x) / bt.zoom + ut, Xn = (fe.height - bt.y) / bt.zoom + ut, Le = /* @__PURE__ */ new Set();
       for (const Ot of oe) {
         const Se = Ot._absolutePosition || Ot.position, Yn = Ot.width || ((rn = Ot.measured) == null ? void 0 : rn.width) || 200, Un = Ot.height || ((vn = Ot.measured) == null ? void 0 : vn.height) || 100;
         Se.x + Yn >= Vt && Se.x <= Fn && Se.y + Un >= Ce && Se.y <= Xn && Le.add(Ot.id);
@@ -3923,12 +3925,12 @@ function ss({
         for (const Se of Le)
           if (!Ot.has(Se)) return Le;
         return Ot;
-      }), J = requestAnimationFrame(Yt);
+      }), O = requestAnimationFrame(Tt);
     };
-    return J = requestAnimationFrame(Yt), () => cancelAnimationFrame(J);
+    return O = requestAnimationFrame(Tt), () => cancelAnimationFrame(O);
   }, [oe, Rt]);
-  const mn = Wt(() => se ? oe.filter((J) => se.has(J.id)) : oe, [oe, se]), It = oe.length > 0, ae = We.length > 0;
-  return /* @__PURE__ */ D(Te.Provider, { value: Nt, children: /* @__PURE__ */ Ft(
+  const mn = Ft(() => se ? oe.filter((O) => se.has(O.id)) : oe, [oe, se]), It = oe.length > 0, ce = We.length > 0;
+  return /* @__PURE__ */ D(Te.Provider, { value: Nt, children: /* @__PURE__ */ Xt(
     "div",
     {
       ref: Fe,
@@ -3940,12 +3942,12 @@ function ss({
       onDragOver: yt,
       onDrop: kt,
       onDragEnter: Jt,
-      onDragLeave: Ht,
+      onDragLeave: _t,
       tabIndex: 0,
       children: [
         /* @__PURE__ */ D("canvas", { ref: Qe, className: "ric-canvas" }),
         !Je && /* @__PURE__ */ D("div", { className: "ric-loader", children: /* @__PURE__ */ D("div", { className: "ric-spinner" }) }),
-        ae && /* @__PURE__ */ D(
+        ce && /* @__PURE__ */ D(
           "svg",
           {
             className: "ric-edges-overlay",
@@ -3958,15 +3960,15 @@ function ss({
               pointerEvents: "none",
               overflow: "visible"
             },
-            children: /* @__PURE__ */ D("g", { ref: Pt, children: We.map((J) => /* @__PURE__ */ D(
+            children: /* @__PURE__ */ D("g", { ref: Pt, children: We.map((O) => /* @__PURE__ */ D(
               so,
               {
-                edge: J,
-                edgeType: Re[J.type],
+                edge: O,
+                edgeType: Re[O.type],
                 nodes: e,
                 reconnectable: we
               },
-              J.id
+              O.id
             )) })
           }
         ),
@@ -3985,21 +3987,21 @@ function ss({
               pointerEvents: "none",
               zIndex: 10
             },
-            children: mn.map((J) => /* @__PURE__ */ D(
+            children: mn.map((O) => /* @__PURE__ */ D(
               eo,
               {
-                node: J,
-                nodeType: Me[J.type]
+                node: O,
+                nodeType: Me[O.type]
               },
-              J.id
+              O.id
             ))
           }
         ),
         /* @__PURE__ */ D(
           "div",
           {
-            ref: (J) => {
-              Ne.current = J, nn.current = J;
+            ref: (O) => {
+              Ne.current = O, nn.current = O;
             },
             className: "ric-edge-labels",
             style: {
@@ -4017,8 +4019,8 @@ function ss({
         /* @__PURE__ */ D(
           "div",
           {
-            ref: (J) => {
-              Oe.current = J, le.current = J;
+            ref: (O) => {
+              Oe.current = O, de.current = O;
             },
             className: "ric-viewport-portal",
             style: {
@@ -4034,21 +4036,21 @@ function ss({
           }
         ),
         _n && /* @__PURE__ */ D("div", { className: "ric-hint", children: qt }),
-        Hn && /* @__PURE__ */ Ft("div", { className: "ric-info", children: [
+        Hn && /* @__PURE__ */ Xt("div", { className: "ric-info", children: [
           "world: (",
-          Xt.wx,
+          Yt.wx,
           ", ",
-          Xt.wy,
+          Yt.wy,
           ")   zoom: ",
-          Xt.zoom,
+          Yt.zoom,
           "x",
-          Xt.nodeCount > 0 && /* @__PURE__ */ Ft(Ye, { children: [
+          Yt.nodeCount > 0 && /* @__PURE__ */ Xt(Ye, { children: [
             "   nodes: ",
-            Xt.nodeCount
+            Yt.nodeCount
           ] }),
-          Xt.edgeCount > 0 && /* @__PURE__ */ Ft(Ye, { children: [
+          Yt.edgeCount > 0 && /* @__PURE__ */ Xt(Ye, { children: [
             "   edges: ",
-            Xt.edgeCount
+            Yt.edgeCount
           ] })
         ] }),
         /* @__PURE__ */ D(
@@ -4145,8 +4147,8 @@ function Io() {
     if (typeof v == "function") {
       const W = v(e().nodesRef.current);
       (g = (h = e().onNodesChangeRef).current) == null || g.call(h, [
-        ...e().nodesRef.current.map((Q) => ({ id: Q.id, type: "remove" })),
-        ...W.map((Q) => ({ type: "add", item: Q }))
+        ...e().nodesRef.current.map((J) => ({ id: J.id, type: "remove" })),
+        ...W.map((J) => ({ type: "add", item: J }))
       ]);
     } else
       (P = (S = e().onNodesChangeRef).current) == null || P.call(S, [
@@ -4158,8 +4160,8 @@ function Io() {
     if (typeof v == "function") {
       const W = v(e().edgesRef.current);
       (g = (h = e().onEdgesChangeRef).current) == null || g.call(h, [
-        ...e().edgesRef.current.map((Q) => ({ id: Q.id, type: "remove" })),
-        ...W.map((Q) => ({ type: "add", item: Q }))
+        ...e().edgesRef.current.map((J) => ({ id: J.id, type: "remove" })),
+        ...W.map((J) => ({ type: "add", item: J }))
       ]);
     } else
       (P = (S = e().onEdgesChangeRef).current) == null || P.call(S, [
@@ -4190,7 +4192,7 @@ function Io() {
       return;
     }
     const g = { ...e().cameraRef.current }, S = performance.now(), P = (W) => {
-      const Q = W - S, ot = Math.min(Q / h, 1), et = 1 - Math.pow(1 - ot, 3);
+      const J = W - S, ot = Math.min(J / h, 1), et = 1 - Math.pow(1 - ot, 3);
       e().cameraRef.current = {
         x: g.x + (v.x - g.x) * et,
         y: g.y + (v.y - g.y) * et,
@@ -4208,27 +4210,27 @@ function Io() {
   }, [e, b]), N = F(() => e().cameraRef.current.zoom, [e]), R = F((v) => {
     const h = e().cameraRef.current, g = e().wrapRef.current;
     if (!g) return;
-    const S = g.getBoundingClientRect(), P = S.width / 2, W = S.height / 2, Q = 1.2, ot = {
-      x: P - (P - h.x) * Q,
-      y: W - (W - h.y) * Q,
-      zoom: Math.min(e().zoomMax, h.zoom * Q)
+    const S = g.getBoundingClientRect(), P = S.width / 2, W = S.height / 2, J = 1.2, ot = {
+      x: P - (P - h.x) * J,
+      y: W - (W - h.y) * J,
+      zoom: Math.min(e().zoomMax, h.zoom * J)
     };
     b(ot, v == null ? void 0 : v.duration);
   }, [e, b]), $ = F((v) => {
     const h = e().cameraRef.current, g = e().wrapRef.current;
     if (!g) return;
-    const S = g.getBoundingClientRect(), P = S.width / 2, W = S.height / 2, Q = 1 / 1.2, ot = {
-      x: P - (P - h.x) * Q,
-      y: W - (W - h.y) * Q,
-      zoom: Math.max(e().zoomMin, h.zoom * Q)
+    const S = g.getBoundingClientRect(), P = S.width / 2, W = S.height / 2, J = 1 / 1.2, ot = {
+      x: P - (P - h.x) * J,
+      y: W - (W - h.y) * J,
+      zoom: Math.max(e().zoomMin, h.zoom * J)
     };
     b(ot, v == null ? void 0 : v.duration);
   }, [e, b]), Y = F((v, h) => {
     const g = e().cameraRef.current, S = e().wrapRef.current;
     if (!S) return;
-    const P = S.getBoundingClientRect(), W = P.width / 2, Q = P.height / 2, ot = Math.min(e().zoomMax, Math.max(e().zoomMin, v)), et = ot / g.zoom, st = {
+    const P = S.getBoundingClientRect(), W = P.width / 2, J = P.height / 2, ot = Math.min(e().zoomMax, Math.max(e().zoomMin, v)), et = ot / g.zoom, st = {
       x: W - (W - g.x) * et,
-      y: Q - (Q - g.y) * et,
+      y: J - (J - g.y) * et,
       zoom: ot
     };
     b(st, h == null ? void 0 : h.duration);
@@ -4239,7 +4241,7 @@ function Io() {
     if (!g) return;
     const S = g.getBoundingClientRect(), P = v.padding ?? 0.1, W = v.nodes ? h.filter((et) => v.nodes.some((st) => st.id === et.id)) : h;
     if (!W.length) return;
-    const Q = Qn(W), ot = ln(Q, S.width, S.height, P);
+    const J = Qn(W), ot = ln(J, S.width, S.height, P);
     v.maxZoom && (ot.zoom = Math.min(ot.zoom, v.maxZoom)), v.minZoom && (ot.zoom = Math.max(ot.zoom, v.minZoom)), b(ot, v.duration);
   }, [e, b]), _ = F((v, h = {}) => {
     const g = e().wrapRef.current;
@@ -4249,12 +4251,12 @@ function Io() {
   }, [e, b]), A = F((v, h, g = {}) => {
     const S = e().wrapRef.current;
     if (!S) return;
-    const P = S.getBoundingClientRect(), W = g.zoom ?? e().cameraRef.current.zoom, Q = {
+    const P = S.getBoundingClientRect(), W = g.zoom ?? e().cameraRef.current.zoom, J = {
       x: P.width / 2 - v * W,
       y: P.height / 2 - h * W,
       zoom: W
     };
-    b(Q, g.duration);
+    b(J, g.duration);
   }, [e, b]), I = F(() => ({
     nodes: [...e().nodesRef.current],
     edges: [...e().edgesRef.current],
@@ -4269,7 +4271,7 @@ function Io() {
     };
   }, [e]), T = F((v, h) => {
     var P, W;
-    const g = e().nodesRef.current.find((Q) => Q.id === v);
+    const g = e().nodesRef.current.find((J) => J.id === v);
     if (!g) return;
     const S = typeof h == "function" ? h(g.data) : { ...g.data, ...h };
     (W = (P = e().onNodesChangeRef).current) == null || W.call(P, [{ id: v, type: "replace", item: { ...g, data: S } }]);
@@ -4313,18 +4315,18 @@ function hs() {
 }
 function ys(t) {
   const e = Ct(), n = Array.isArray(t) ? t : [t];
-  return Wt(() => n.map((r) => {
+  return Ft(() => n.map((r) => {
     const i = e.nodes.find((o) => o.id === r);
     return i ? { id: i.id, type: i.type, data: i.data } : null;
   }).filter(Boolean), [e.nodes, ...n]);
 }
 function gs(t) {
   const e = Ct();
-  return Wt(() => e.edges.filter((n) => n.source === t || n.target === t), [e.edges, t]);
+  return Ft(() => e.edges.filter((n) => n.source === t || n.target === t), [e.edges, t]);
 }
 function ps({ nodeId: t, type: e, handleId: n }) {
   const r = Ct();
-  return Wt(() => r.edges.filter((i) => e === "source" ? i.source === t && (n ? i.sourceHandle === n : !0) : i.target === t && (n ? i.targetHandle === n : !0)), [r.edges, t, e, n]);
+  return Ft(() => r.edges.filter((i) => e === "source" ? i.source === t && (n ? i.sourceHandle === n : !0) : i.target === t && (n ? i.targetHandle === n : !0)), [r.edges, t, e, n]);
 }
 function xs({ onChange: t, onStart: e, onEnd: n }) {
   const r = Ct(), i = K(t), o = K(e), a = K(n);
@@ -4386,7 +4388,7 @@ function bs(t = {}) {
 }
 function Ms(t) {
   const e = Ct();
-  return Wt(() => e.nodes.find((n) => n.id === t) || void 0, [e.nodes, t]);
+  return Ft(() => e.nodes.find((n) => n.id === t) || void 0, [e.nodes, t]);
 }
 function Rs(t, e) {
   return Ct(t, e);
@@ -4481,21 +4483,21 @@ function Ss({
     const _ = $ - N, A = Y - R, I = Math.min(t / _, e / A), U = (t - _ * I) / 2, X = (e - A * I) / 2;
     for (const h of E) {
       if (h.hidden) continue;
-      const g = h.width || Gn, S = h.height || On, P = (h.position.x - N) * I + U, W = (h.position.y - R) * I + X, Q = g * I, ot = S * I;
-      z.fillStyle = h.selected ? "#f59e0b" : typeof n == "function" ? n(h) : n, z.fillRect(P, W, Math.max(Q, 2), Math.max(ot, 2));
+      const g = h.width || Gn, S = h.height || On, P = (h.position.x - N) * I + U, W = (h.position.y - R) * I + X, J = g * I, ot = S * I;
+      z.fillStyle = h.selected ? "#f59e0b" : typeof n == "function" ? n(h) : n, z.fillRect(P, W, Math.max(J, 2), Math.max(ot, 2));
     }
     const T = d.cameraRef.current, v = d.wrapRef.current;
     if (v) {
       const h = v.getBoundingClientRect(), g = -T.x / T.zoom, S = -T.y / T.zoom, P = h.width / T.zoom, W = h.height / T.zoom;
       z.fillStyle = i, z.fillRect(0, 0, t, e);
-      const Q = (g - N) * I + U, ot = (S - R) * I + X, et = P * I, st = W * I;
-      z.clearRect(Q, ot, et, st);
+      const J = (g - N) * I + U, ot = (S - R) * I + X, et = P * I, st = W * I;
+      z.clearRect(J, ot, et, st);
       for (const pt of E) {
         if (pt.hidden) continue;
         const xt = pt.width || Gn, V = pt.height || On, ht = (pt.position.x - N) * I + U, wt = (pt.position.y - R) * I + X;
         z.fillStyle = pt.selected ? "#f59e0b" : typeof n == "function" ? n(pt) : n, z.fillRect(ht, wt, Math.max(xt * I, 2), Math.max(V * I, 2));
       }
-      z.strokeStyle = "#3b82f6", z.lineWidth = 1.5, z.strokeRect(Q, ot, et, st);
+      z.strokeStyle = "#3b82f6", z.lineWidth = 1.5, z.strokeRect(J, ot, et, st);
     }
   }, [d, t, e, n, r, i]);
   return gt(() => {
@@ -4530,7 +4532,7 @@ function Ss({
   );
 }
 function Po() {
-  return /* @__PURE__ */ Ft("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  return /* @__PURE__ */ Xt("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
     /* @__PURE__ */ D("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
     /* @__PURE__ */ D("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
   ] });
@@ -4542,13 +4544,13 @@ function $o() {
   return /* @__PURE__ */ D("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ D("path", { d: "M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7" }) });
 }
 function Ao() {
-  return /* @__PURE__ */ Ft("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  return /* @__PURE__ */ Xt("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
     /* @__PURE__ */ D("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2" }),
     /* @__PURE__ */ D("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })
   ] });
 }
 function Bo() {
-  return /* @__PURE__ */ Ft("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  return /* @__PURE__ */ Xt("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "16", height: "16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
     /* @__PURE__ */ D("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2" }),
     /* @__PURE__ */ D("path", { d: "M7 11V7a5 5 0 0 1 9.9-1" })
   ] });
@@ -4597,7 +4599,7 @@ function Do({
     "bottom-right": { bottom: 30, right: 10 },
     "bottom-center": { bottom: 30, left: "50%", transform: "translateX(-50%)" }
   }[p] || { bottom: 30, left: 10 };
-  return /* @__PURE__ */ Ft(
+  return /* @__PURE__ */ Xt(
     "div",
     {
       className: `ric-controls ${m}`,
@@ -4613,7 +4615,7 @@ function Do({
       role: "toolbar",
       "aria-label": z,
       children: [
-        t && /* @__PURE__ */ Ft(Ye, { children: [
+        t && /* @__PURE__ */ Xt(Ye, { children: [
           /* @__PURE__ */ D(
             kn,
             {
@@ -4769,7 +4771,7 @@ function Ps({
     zIndex: 20,
     ...o
   };
-  return /* @__PURE__ */ Ft(Ye, { children: [
+  return /* @__PURE__ */ Xt(Ye, { children: [
     /* @__PURE__ */ D(
       "div",
       {