saha-ui 1.22.4 → 1.22.5

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,CAwWpD,CAAC"}

package/dist/components/DragDrop/DebugOverlay.js

@@ -1,51 +1,51 @@
-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 v, jsx as e } from "react/jsx-runtime";
+import { useState as f, useRef as w, useEffect as p } from "react";
+import { useDragDropContext as P } from "./DragDropContext.js";
+import { cn as C } from "../../lib/utils.js";
+import { ChevronUp as z, ChevronDown as G } from "lucide-react";
+const T = ({
+  enabled: u = !0,
+  position: I = "top-right",
+  showCollisionRects: E = !0,
+  showDragPath: g = !0,
+  showPerformanceMetrics: h = !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,
+  const j = P(), [i, D] = f(!0), [d, y] = f([]), [x, O] = f(0), [S, k] = f(0), n = w({ frames: 0, lastTime: performance.now() }), N = w(0), {
+    activeId: R,
+    activeItem: b,
     activeIndex: F,
     sourceContainerId: A,
-    dragPosition: n,
-    isDragging: i,
-    selectionState: d,
-    historyState: l
+    dragPosition: a,
+    isDragging: r,
+    selectionState: l,
+    historyState: c
   } = j;
-  return u(() => {
-    g(i && n ? (s) => [
+  return p(() => {
+    y(r && a ? (s) => [
       ...s.slice(-50),
       // Keep last 50 points
-      { x: n.x, y: n.y, timestamp: Date.now() }
+      { x: a.x, y: a.y, timestamp: Date.now() }
     ] : []);
-  }, [i, n]), u(() => {
-    if (!p || !f) return;
+  }, [r, a]), p(() => {
+    if (!u || !h) return;
     const s = () => {
-      const x = performance.now();
-      a.current.frames++, x >= a.current.lastTime + 1e3 && (C(
+      const o = performance.now();
+      n.current.frames++, o >= n.current.lastTime + 1e3 && (O(
         Math.round(
-          a.current.frames * 1e3 / (x - a.current.lastTime)
+          n.current.frames * 1e3 / (o - n.current.lastTime)
         )
-      ), a.current.frames = 0, a.current.lastTime = x), requestAnimationFrame(s);
-    }, c = requestAnimationFrame(s);
-    return () => cancelAnimationFrame(c);
-  }, [p, f]), u(() => {
+      ), n.current.frames = 0, n.current.lastTime = o), requestAnimationFrame(s);
+    }, m = requestAnimationFrame(s);
+    return () => cancelAnimationFrame(m);
+  }, [u, h]), p(() => {
     N.current = performance.now();
-  }), u(() => {
-    R(performance.now() - N.current);
-  }), p ? /* @__PURE__ */ t(T, { children: [
+  }), p(() => {
+    k(performance.now() - N.current);
+  }), u ? /* @__PURE__ */ t(v, { children: [
     /* @__PURE__ */ t(
       "div",
       {
-        className: v(
+        className: C(
           "fixed z-[9999] bg-background border rounded-lg shadow-lg",
           "max-w-md transition-all duration-200",
           {
@@ -53,8 +53,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"
+          }[I],
+          !i && "w-auto"
         ),
         children: [
           /* @__PURE__ */ t("div", { className: "flex items-center justify-between px-3 py-2 border-b bg-muted/50", children: [
@@ -65,14 +65,14 @@ const E = ({
             /* @__PURE__ */ e("div", { className: "flex items-center gap-1", children: /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => I(!r),
+                onClick: () => D(!i),
                 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: i ? /* @__PURE__ */ e(z, { className: "w-4 h-4" }) : /* @__PURE__ */ e(G, { 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: [
+          i && /* @__PURE__ */ t("div", { className: "p-3 space-y-3 text-xs max-h-[500px] overflow-auto", children: [
+            h && /* @__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,11 +80,11 @@ const E = ({
                   /* @__PURE__ */ e(
                     "span",
                     {
-                      className: v(
+                      className: C(
                         "ml-2 font-mono font-medium",
-                        h >= 50 ? "text-green-500" : h >= 30 ? "text-yellow-500" : "text-red-500"
+                        x >= 50 ? "text-green-500" : x >= 30 ? "text-yellow-500" : "text-red-500"
                       ),
-                      children: h
+                      children: x
                     }
                   )
                 ] }),
@@ -102,11 +102,11 @@ const E = ({
               /* @__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: "Is Dragging:" }),
-                  /* @__PURE__ */ e("span", { className: "font-medium", children: i ? "Yes" : "No" })
+                  /* @__PURE__ */ e("span", { className: "font-medium", children: r ? "Yes" : "No" })
                 ] }),
                 /* @__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: R || "—" })
                 ] }),
                 /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Active Index:" }),
@@ -116,31 +116,31 @@ const E = ({
                   /* @__PURE__ */ e("span", { className: "text-muted-foreground", children: "Container:" }),
                   /* @__PURE__ */ e("span", { className: "font-mono font-medium truncate max-w-[120px]", children: A || "—" })
                 ] }),
-                n && /* @__PURE__ */ t("div", { className: "flex justify-between", children: [
+                a && /* @__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(a.x),
                     ", y:",
                     " ",
-                    Math.round(n.y)
+                    Math.round(a.y)
                   ] })
                 ] })
               ] })
             ] }),
-            d && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+            l && /* @__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,
+                    l.selectedIds.size,
                     " items"
                   ] })
                 ] }),
-                d.selectedIds.size > 0 && /* @__PURE__ */ t("div", { className: "mt-1 pt-1 border-t border-border", children: [
+                l.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(l.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 +151,136 @@ const E = ({
                 ] })
               ] })
             ] }),
-            l && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+            c && /* @__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: c.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: c.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: c.past.length })
                 ] })
               ] })
             ] }),
-            y && /* @__PURE__ */ t("div", { className: "space-y-1", children: [
+            b && /* @__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(b, null, 2) })
             ] })
           ] })
         ]
       }
     ),
-    D && i && o.length > 1 && /* @__PURE__ */ t(
+    g && r && d.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: d.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
-          ))
+          d.map((s, m) => {
+            const o = 0.18 + m / d.length * 0.82;
+            return /* @__PURE__ */ e(
+              "circle",
+              {
+                cx: s.x,
+                cy: s.y,
+                r: 2.25,
+                fill: "url(#dotGrad)",
+                fillOpacity: o
+              },
+              m
+            );
+          })
         ]
       }
-    )
+    ),
+    g && r && a && /* @__PURE__ */ t(v, { 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: a.x,
+            top: a.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";
+T.displayName = "DebugOverlay";
 export {
-  E as DebugOverlay
+  T 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"}