saha-ui 1.22.4 → 1.22.6

package/dist/components/DragDrop/DebugOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DebugOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/DragDrop/DebugOverlay.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAS3D,MAAM,WAAW,iBAAiB;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAC;IACrE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAMD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAoSpD,CAAC"}
+{"version":3,"file":"DebugOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/DragDrop/DebugOverlay.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAS3D,MAAM,WAAW,iBAAiB;IAChC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAC;IACrE,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAMD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyXpD,CAAC"}

package/dist/components/DragDrop/DebugOverlay.js

@@ -1,51 +1,57 @@
-import { jsxs as t, Fragment as T, jsx as e } from "react/jsx-runtime";
-import { useState as m, useRef as b, useEffect as u } from "react";
-import { useDragDropContext as z } from "./DragDropContext.js";
-import { cn as v } from "../../lib/utils.js";
-import { ChevronUp as O, ChevronDown as P } from "lucide-react";
-const E = ({
-  enabled: p = !0,
-  position: w = "top-right",
-  showCollisionRects: U = !0,
-  showDragPath: D = !0,
-  showPerformanceMetrics: f = !0
+import { jsxs as t, Fragment as C, jsx as e } from "react/jsx-runtime";
+import { useState as l, useRef as I, useEffect as h } from "react";
+import { useDragDropContext as G } from "./DragDropContext.js";
+import { cn as j } from "../../lib/utils.js";
+import { ChevronUp as T, ChevronDown as L } from "lucide-react";
+const Y = ({
+  enabled: x = !0,
+  position: D = "top-right",
+  showCollisionRects: M = !0,
+  showDragPath: c = !0,
+  showPerformanceMetrics: g = !0
 }) => {
-  const j = z(), [r, I] = m(!0), [o, g] = m([]), [h, C] = m(0), [S, R] = m(0), a = b({ frames: 0, lastTime: performance.now() }), N = b(0), {
-    activeId: k,
-    activeItem: y,
-    activeIndex: F,
-    sourceContainerId: A,
-    dragPosition: n,
+  const O = G(), [m, S] = l(!0), [p, y] = l([]), [N, k] = l(0), [R, P] = l(0), a = I({ frames: 0, lastTime: performance.now() }), b = I(0), {
+    activeId: F,
+    activeItem: v,
+    activeIndex: A,
+    sourceContainerId: z,
+    dragPosition: o,
     isDragging: i,
-    selectionState: d,
-    historyState: l
-  } = j;
-  return u(() => {
-    g(i && n ? (s) => [
-      ...s.slice(-50),
-      // Keep last 50 points
-      { x: n.x, y: n.y, timestamp: Date.now() }
-    ] : []);
-  }, [i, n]), u(() => {
-    if (!p || !f) return;
+    selectionState: f,
+    historyState: u
+  } = O, [d, w] = l(null);
+  return h(() => {
+    if (!i || !c) {
+      y([]);
+      return;
+    }
+    const s = (r) => {
+      const n = { x: r.clientX, y: r.clientY, timestamp: Date.now() };
+      w(n), y((E) => [...E.slice(-50), n]);
+    };
+    return window.addEventListener("pointermove", s), () => {
+      window.removeEventListener("pointermove", s), w(null), y([]);
+    };
+  }, [i, c]), h(() => {
+    if (!x || !g) return;
     const s = () => {
-      const x = performance.now();
-      a.current.frames++, x >= a.current.lastTime + 1e3 && (C(
+      const n = performance.now();
+      a.current.frames++, n >= a.current.lastTime + 1e3 && (k(
         Math.round(
-          a.current.frames * 1e3 / (x - a.current.lastTime)
+          a.current.frames * 1e3 / (n - a.current.lastTime)
         )
-      ), a.current.frames = 0, a.current.lastTime = x), requestAnimationFrame(s);
-    }, c = requestAnimationFrame(s);
-    return () => cancelAnimationFrame(c);
-  }, [p, f]), u(() => {
-    N.current = performance.now();
-  }), u(() => {
-    R(performance.now() - N.current);
-  }), p ? /* @__PURE__ */ t(T, { children: [
+      ), a.current.frames = 0, a.current.lastTime = n), requestAnimationFrame(s);
+    }, r = requestAnimationFrame(s);
+    return () => cancelAnimationFrame(r);
+  }, [x, g]), h(() => {
+    b.current = performance.now();
+  }), h(() => {
+    P(performance.now() - b.current);
+  }), x ? /* @__PURE__ */ t(C, { children: [
     /* @__PURE__ */ t(
       "div",
       {
-        className: v(
+        className: j(
           "fixed z-[9999] bg-background border rounded-lg shadow-lg",
           "max-w-md transition-all duration-200",
           {
@@ -53,8 +59,8 @@ const E = ({
             "top-right": "top-4 right-4",
             "bottom-left": "bottom-4 left-4",
             "bottom-right": "bottom-4 right-4"
-          }[w],
-          !r && "w-auto"
+          }[D],
+          !m && "w-auto"
         ),
         children: [
           /* @__PURE__ */ t("div", { className: "flex items-center justify-between px-3 py-2 border-b bg-muted/50", children: [
@@ -65,14 +71,14 @@ const E = ({
             /* @__PURE__ */ e("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => I(!r),
+                onClick: () => S(!m),
                 className: "p-1 hover:bg-background rounded transition-colors",
-                children: r ? /* @__PURE__ */ e(O, { className: "w-4 h-4" }) : /* @__PURE__ */ e(P, { className: "w-4 h-4" })
+                children: m ? /* @__PURE__ */ e(T, { className: "w-4 h-4" }) : /* @__PURE__ */ e(L, { className: "w-4 h-4" })
               }
             ) })
           ] }),
-          r && /* @__PURE__ */ t("div", { className: "p-3 space-y-3 text-xs max-h-[500px] overflow-auto", children: [
-            f && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+          m && /* @__PURE__ */ t("div", { className: "p-3 space-y-3 text-xs max-h-[500px] overflow-auto", children: [
+            g && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
               /* @__PURE__ */ e("h4", { className: "font-semibold text-foreground mb-2", children: "Performance" }),
               /* @__PURE__ */ t("div", { className: "grid grid-cols-2 gap-2", children: [
                 /* @__PURE__ */ t("div", { className: "bg-muted/50 rounded px-2 py-1", children: [
@@ -80,18 +86,18 @@ const E = ({
                   /* @__PURE__ */ e(
                     "span",
                     {
-                      className: v(
+                      className: j(
                         "ml-2 font-mono font-medium",
-                        h >= 50 ? "text-green-500" : h >= 30 ? "text-yellow-500" : "text-red-500"
+                        N >= 50 ? "text-green-500" : N >= 30 ? "text-yellow-500" : "text-red-500"
                       ),
-                      children: h
+                      children: N
                     }
                   )
                 ] }),
                 /* @__PURE__ */ t("div", { className: "bg-muted/50 rounded px-2 py-1", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Render:" }),
                   /* @__PURE__ */ t("span", { className: "ml-2 font-mono font-medium", children: [
-                    S.toFixed(2),
+                    R.toFixed(2),
                     "ms"
                   ] })
                 ] })
@@ -106,41 +112,41 @@ const E = ({
                 ] }),
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Active ID:" }),
-                  /* @__PURE__ */ e("span", { className: "font-mono font-medium truncate max-w-[120px]", children: k || "—" })
+                  /* @__PURE__ */ e("span", { className: "font-mono font-medium truncate max-w-[120px]", children: F || "—" })
                 ] }),
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Active Index:" }),
-                  /* @__PURE__ */ e("span", { className: "font-medium", children: F ?? "—" })
+                  /* @__PURE__ */ e("span", { className: "font-medium", children: A ?? "—" })
                 ] }),
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Container:" }),
-                  /* @__PURE__ */ e("span", { className: "font-mono font-medium truncate max-w-[120px]", children: A || "—" })
+                  /* @__PURE__ */ e("span", { className: "font-mono font-medium truncate max-w-[120px]", children: z || "—" })
                 ] }),
-                n && /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
+                o && /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Position:" }),
                   /* @__PURE__ */ t("span", { className: "font-mono font-medium", children: [
                     "x: ",
-                    Math.round(n.x),
+                    Math.round(o.x),
                     ", y:",
                     " ",
-                    Math.round(n.y)
+                    Math.round(o.y)
                   ] })
                 ] })
               ] })
             ] }),
-            d && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+            f && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
               /* @__PURE__ */ e("h4", { className: "font-semibold text-foreground mb-2", children: "Multi-Selection" }),
               /* @__PURE__ */ t("div", { className: "bg-muted/50 rounded px-2 py-1 space-y-1", children: [
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Selected:" }),
                   /* @__PURE__ */ t("span", { className: "font-medium", children: [
-                    d.selectedIds.size,
+                    f.selectedIds.size,
                     " items"
                   ] })
                 ] }),
-                d.selectedIds.size > 0 && /* @__PURE__ */ t("div", { className: "mt-1 pt-1 border-t border-border", children: [
+                f.selectedIds.size > 0 && /* @__PURE__ */ t("div", { className: "mt-1 pt-1 border-t border-border", children: [
                   /* @__PURE__ */ e("div", { className: "text-muted-foreground mb-1", children: "IDs:" }),
-                  /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1", children: Array.from(d.selectedIds).map((s) => /* @__PURE__ */ e(
+                  /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1", children: Array.from(f.selectedIds).map((s) => /* @__PURE__ */ e(
                     "span",
                     {
                       className: "px-1.5 py-0.5 bg-primary/20 text-primary rounded text-[10px] font-mono",
@@ -151,66 +157,136 @@ const E = ({
                 ] })
               ] })
             ] }),
-            l && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+            u && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
               /* @__PURE__ */ e("h4", { className: "font-semibold text-foreground mb-2", children: "Undo/Redo" }),
               /* @__PURE__ */ t("div", { className: "bg-muted/50 rounded px-2 py-1 space-y-1", children: [
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Can Undo:" }),
-                  /* @__PURE__ */ e("span", { className: "font-medium", children: l.past.length > 0 ? "Yes" : "No" })
+                  /* @__PURE__ */ e("span", { className: "font-medium", children: u.past.length > 0 ? "Yes" : "No" })
                 ] }),
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Can Redo:" }),
-                  /* @__PURE__ */ e("span", { className: "font-medium", children: l.future.length > 0 ? "Yes" : "No" })
+                  /* @__PURE__ */ e("span", { className: "font-medium", children: u.future.length > 0 ? "Yes" : "No" })
                 ] }),
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "History Size:" }),
-                  /* @__PURE__ */ e("span", { className: "font-medium", children: l.past.length })
+                  /* @__PURE__ */ e("span", { className: "font-medium", children: u.past.length })
                 ] })
               ] })
             ] }),
-            y && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+            v && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
               /* @__PURE__ */ e("h4", { className: "font-semibold text-foreground mb-2", children: "Active Item" }),
-              /* @__PURE__ */ e("pre", { className: "bg-muted/50 rounded px-2 py-1 overflow-auto max-h-32 text-[10px] font-mono", children: JSON.stringify(y, null, 2) })
+              /* @__PURE__ */ e("pre", { className: "bg-muted/50 rounded px-2 py-1 overflow-auto max-h-32 text-[10px] font-mono", children: JSON.stringify(v, null, 2) })
             ] })
           ] })
         ]
       }
     ),
-    D && i && o.length > 1 && /* @__PURE__ */ t(
+    c && i && p.length > 1 && /* @__PURE__ */ t(
       "svg",
       {
         className: "fixed inset-0 pointer-events-none z-[9998]",
         style: { width: "100vw", height: "100vh" },
         children: [
+          /* @__PURE__ */ t("defs", { children: [
+            /* @__PURE__ */ t("linearGradient", { id: "dragPathGrad", x1: "0%", y1: "0%", x2: "100%", y2: "0%", children: [
+              /* @__PURE__ */ e("stop", { offset: "0%", stopColor: "#6366f1", stopOpacity: "0.6" }),
+              /* @__PURE__ */ e("stop", { offset: "50%", stopColor: "#8b5cf6", stopOpacity: "0.9" }),
+              /* @__PURE__ */ e("stop", { offset: "100%", stopColor: "#6366f1", stopOpacity: "1" })
+            ] }),
+            /* @__PURE__ */ t("radialGradient", { id: "dotGrad", cx: "30%", cy: "30%", r: "70%", children: [
+              /* @__PURE__ */ e("stop", { offset: "0%", stopColor: "#ffffff", stopOpacity: "1" }),
+              /* @__PURE__ */ e("stop", { offset: "30%", stopColor: "#6366f1", stopOpacity: "1" }),
+              /* @__PURE__ */ e("stop", { offset: "100%", stopColor: "#8b5cf6", stopOpacity: "0.6" })
+            ] })
+          ] }),
           /* @__PURE__ */ e(
             "polyline",
             {
-              points: o.map((s) => `${s.x},${s.y}`).join(" "),
+              points: p.map((s) => `${s.x},${s.y}`).join(" "),
               fill: "none",
-              stroke: "hsl(var(--primary))",
-              strokeWidth: "2",
-              strokeOpacity: "0.5",
+              stroke: "url(#dragPathGrad)",
+              strokeWidth: 2,
+              strokeOpacity: 0.95,
               strokeLinecap: "round",
               strokeLinejoin: "round"
             }
           ),
-          o.map((s, c) => /* @__PURE__ */ e(
-            "circle",
-            {
-              cx: s.x,
-              cy: s.y,
-              r: 2,
-              fill: "hsl(var(--primary))",
-              fillOpacity: 0.3 + c / o.length * 0.7
-            },
-            c
-          ))
+          p.map((s, r) => {
+            const n = 0.18 + r / p.length * 0.82;
+            return /* @__PURE__ */ e(
+              "circle",
+              {
+                cx: s.x,
+                cy: s.y,
+                r: 2.25,
+                fill: "url(#dotGrad)",
+                fillOpacity: n
+              },
+              r
+            );
+          })
         ]
       }
-    )
+    ),
+    c && i && (d || o) && /* @__PURE__ */ t(C, { children: [
+      /* @__PURE__ */ e("style", { children: "@keyframes sahaPulse { 0% { transform: scale(1); opacity: 0.95 } 50% { transform: scale(1.12); opacity: 0.75 } 100% { transform: scale(1); opacity: 0.95 } }" }),
+      /* @__PURE__ */ t(
+        "div",
+        {
+          "aria-hidden": !0,
+          style: {
+            position: "fixed",
+            left: d ? d.x : o.x,
+            top: d ? d.y : o.y,
+            transform: "translate(-50%, -50%)",
+            pointerEvents: "none",
+            zIndex: 1e4,
+            width: 40,
+            height: 40,
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center"
+          },
+          children: [
+            /* @__PURE__ */ e(
+              "div",
+              {
+                style: {
+                  width: 40,
+                  height: 40,
+                  borderRadius: 9999,
+                  background: "radial-gradient(circle at 35% 30%, rgba(139,92,246,0.20), rgba(99,102,241,0.06))",
+                  border: "1px solid rgba(99,102,241,0.18)",
+                  boxShadow: "0 8px 22px rgba(15,23,42,0.14)",
+                  animation: "sahaPulse 1.6s ease-in-out infinite",
+                  transformOrigin: "center"
+                }
+              }
+            ),
+            /* @__PURE__ */ e(
+              "div",
+              {
+                style: {
+                  position: "absolute",
+                  left: "50%",
+                  top: "50%",
+                  transform: "translate(-50%, -50%)",
+                  width: 10,
+                  height: 10,
+                  borderRadius: 9999,
+                  background: "linear-gradient(135deg,#8b5cf6,#6366f1)",
+                  boxShadow: "0 6px 18px rgba(139,92,246,0.24)"
+                }
+              }
+            )
+          ]
+        }
+      )
+    ] })
   ] }) : null;
 };
-E.displayName = "DebugOverlay";
+Y.displayName = "DebugOverlay";
 export {
-  E as DebugOverlay
+  Y as DebugOverlay
 };

package/dist/components/DragDrop/DragDropContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DragDropContext.d.ts","sourceRoot":"","sources":["../../../src/components/DragDrop/DragDropContext.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,oBAAoB,EASpB,4BAA4B,EAI7B,MAAM,kBAAkB,CAAC;AAkB1B,eAAO,MAAM,kBAAkB,4BAM9B,CAAC;AAMF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CA4dnE,CAAC"}
+{"version":3,"file":"DragDropContext.d.ts","sourceRoot":"","sources":["../../../src/components/DragDrop/DragDropContext.tsx"],"names":[],"mappings":"AAEA,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EACV,oBAAoB,EASpB,4BAA4B,EAI7B,MAAM,kBAAkB,CAAC;AAkB1B,eAAO,MAAM,kBAAkB,4BAM9B,CAAC;AAMF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CA8fnE,CAAC"}