impact-nova 1.7.31 → 1.7.33

package/dist/components/ui/horizontal-scroller/horizontal-scroller.js

@@ -1,156 +1,160 @@
-import { jsxs as c, jsx as t, Fragment as O } from "react/jsx-runtime";
-import * as a from "react";
-import { ChevronRight as T } from "lucide-react";
-import { useVirtualizer as $ } from "@tanstack/react-virtual";
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import * as o from "react";
+import { ChevronRight as j } from "lucide-react";
+import { useVirtualizer as I } from "@tanstack/react-virtual";
 import { cn as h } from "../../../lib/utils.js";
-import { Button as A } from "../button.js";
-import { useImpactNovaI18n as D } from "../../../i18n/ImpactNovaI18nContext.js";
-const F = a.forwardRef(
+import { Button as O } from "../button.js";
+import { useImpactNovaI18n as T } from "../../../i18n/ImpactNovaI18nContext.js";
+const $ = o.forwardRef(
   ({
     className: N,
-    items: u,
-    renderItem: R,
-    scrollStep: g = 200,
-    hideScrollbar: p = !0,
-    controlsPosition: s = "right",
-    renderPrevious: v,
-    renderNext: b,
-    maxWidth: L = "100%",
+    items: d,
+    renderItem: C,
+    scrollStep: p = 200,
+    hideScrollbar: u = !0,
+    controlsPosition: v = "right",
+    renderPrevious: x,
+    renderNext: g,
+    maxWidth: R = "100%",
     estimateSize: m = 200,
-    overscan: k = 5,
-    ...C
-  }, B) => {
-    const { t: x } = D(), l = a.useRef(null), [n, E] = a.useState(!1), [o, H] = a.useState(!1);
-    a.useImperativeHandle(B, () => l.current);
-    const i = $({
-      count: u.length,
-      getScrollElement: () => l.current,
+    overscan: L = 5,
+    ...B
+  }, E) => {
+    const { t: b } = T(), r = o.useRef(null), [n, H] = o.useState(!1), [s, V] = o.useState(!1);
+    o.useImperativeHandle(E, () => r.current);
+    const c = I({
+      count: d.length,
+      getScrollElement: () => r.current,
       estimateSize: typeof m == "function" ? m : () => m,
       horizontal: !0,
-      overscan: k
-    }), V = i.getTotalSize(), d = a.useCallback(() => {
-      const e = l.current;
-      e && (E(e.scrollLeft > 0), H(Math.ceil(e.scrollLeft + e.clientWidth) < e.scrollWidth));
+      overscan: L
+    }), W = c.getTotalSize(), f = o.useCallback(() => {
+      const e = r.current;
+      e && (H(e.scrollLeft > 0), V(Math.ceil(e.scrollLeft + e.clientWidth) < e.scrollWidth));
     }, []);
-    a.useEffect(() => {
-      const e = l.current;
+    o.useEffect(() => {
+      const e = r.current;
       if (!e) return;
-      d();
-      const r = () => d();
-      e.addEventListener("scroll", r);
-      const f = new ResizeObserver(() => {
-        d();
+      f();
+      const l = () => f();
+      e.addEventListener("scroll", l);
+      const i = new ResizeObserver(() => {
+        f();
       });
-      return f.observe(e), () => {
-        e.removeEventListener("scroll", r), f.disconnect();
+      return i.observe(e), () => {
+        e.removeEventListener("scroll", l), i.disconnect();
       };
-    }, [d, u, V]);
-    const z = () => {
-      l.current?.scrollBy({ left: -g, behavior: "smooth" });
-    }, y = () => {
-      l.current?.scrollBy({ left: g, behavior: "smooth" });
-    }, w = ({
+    }, [f, d, W]);
+    const w = () => {
+      r.current?.scrollBy({ left: -p, behavior: "smooth" });
+    }, z = () => {
+      r.current?.scrollBy({ left: p, behavior: "smooth" });
+    }, y = ({
       direction: e,
-      onClick: r,
-      disabled: f
+      onClick: l,
+      disabled: i
     }) => {
-      if (f) return null;
-      const S = x(e === "left" ? "horizontalScroller.scrollLeft" : "horizontalScroller.scrollRight");
-      return /* @__PURE__ */ c(
-        A,
+      if (i) return null;
+      const k = b(e === "left" ? "horizontalScroller.scrollLeft" : "horizontalScroller.scrollRight");
+      return /* @__PURE__ */ a(
+        O,
         {
           variant: "ghost",
           size: "icon",
           className: h(
             "h-8 w-8 rounded-md bg-canvas-muted text-content-tertiary hover:bg-brand-tint hover:text-brand"
           ),
-          onClick: r,
-          disabled: f,
-          "aria-label": S,
+          onClick: l,
+          disabled: i,
+          "aria-label": k,
           "data-component": e === "left" ? "horizontal-scroller-prev" : "horizontal-scroller-next",
           children: [
             /* @__PURE__ */ t(
-              T,
+              j,
               {
                 className: h("h-4 w-4", e === "left" && "rotate-180")
               }
             ),
-            /* @__PURE__ */ t("span", { className: "sr-only", children: S })
+            /* @__PURE__ */ t("span", { className: "sr-only", children: k })
           ]
         }
       );
-    }, W = () => {
-      const e = v ? v({ onClick: z, disabled: !n }) : /* @__PURE__ */ t(
-        w,
+    }, S = (() => {
+      const e = x ? x({ onClick: w, disabled: !n }) : /* @__PURE__ */ t(
+        y,
         {
           direction: "left",
-          onClick: z,
+          onClick: w,
           disabled: !n
         }
-      ), r = b ? b({ onClick: y, disabled: !o }) : /* @__PURE__ */ t(
-        w,
+      ), l = g ? g({ onClick: z, disabled: !s }) : /* @__PURE__ */ t(
+        y,
         {
           direction: "right",
-          onClick: y,
-          disabled: !o
+          onClick: z,
+          disabled: !s
         }
       );
-      return s === "split" ? /* @__PURE__ */ c(O, { children: [
-        /* @__PURE__ */ t("div", { className: "absolute left-0 top-1/2 z-20 -translate-y-1/2", children: e }),
-        /* @__PURE__ */ t("div", { className: "absolute right-0 top-1/2 z-20 -translate-y-1/2", children: r })
-      ] }) : s === "left" ? /* @__PURE__ */ c("div", { className: "absolute left-0 top-1/2 z-20 flex -translate-y-1/2 items-center gap-1", children: [
-        e,
-        r
-      ] }) : /* @__PURE__ */ c("div", { className: "absolute right-0 top-1/2 z-20 flex -translate-y-1/2 items-center gap-1", children: [
-        e,
-        r
-      ] });
-    }, j = () => s === "left" ? n && o ? "pl-20" : n || o ? "pl-12" : "" : s === "split" && n ? "pl-12" : "", I = () => s === "right" ? n && o ? "pr-20" : n || o ? "pr-12" : "" : s === "split" && o ? "pr-12" : "";
-    return /* @__PURE__ */ c(
+      return v === "split" ? {
+        left: n ? /* @__PURE__ */ t("div", { className: "flex-shrink-0", children: e }) : null,
+        right: s ? /* @__PURE__ */ t("div", { className: "flex-shrink-0", children: l }) : null
+      } : v === "left" ? {
+        left: n || s ? /* @__PURE__ */ a("div", { className: "flex-shrink-0 flex items-center gap-1", children: [
+          e,
+          l
+        ] }) : null,
+        right: null
+      } : {
+        left: null,
+        right: n || s ? /* @__PURE__ */ a("div", { className: "flex-shrink-0 flex items-center gap-1", children: [
+          e,
+          l
+        ] }) : null
+      };
+    })();
+    return /* @__PURE__ */ a(
       "div",
       {
         className: h(
-          "relative group min-w-0 w-full bg-transparent",
-          j(),
-          I(),
+          "flex items-center gap-2 min-w-0 w-full bg-transparent",
           N
         ),
-        style: { maxWidth: L },
+        style: { maxWidth: R },
         "data-component": "horizontal-scroller",
-        ...C,
+        ...B,
         children: [
-          W(),
+          S.left,
           /* @__PURE__ */ t(
             "div",
             {
-              ref: l,
+              ref: r,
               className: h(
-                "flex w-full overflow-x-auto overflow-y-hidden whitespace-nowrap",
-                p && "scrollbar-hide",
+                "flex flex-1 min-w-0 overflow-x-auto overflow-y-hidden whitespace-nowrap",
+                u && "scrollbar-hide",
                 "scroll-smooth"
               ),
               style: {
-                scrollbarWidth: p ? "none" : "auto",
-                msOverflowStyle: p ? "none" : "auto"
+                scrollbarWidth: u ? "none" : "auto",
+                msOverflowStyle: u ? "none" : "auto"
               },
               "data-component": "horizontal-scroller-viewport",
-              children: /* @__PURE__ */ c(
+              children: /* @__PURE__ */ a(
                 "div",
                 {
                   style: {
-                    width: `${i.getTotalSize()}px`,
+                    width: `${c.getTotalSize()}px`,
                     display: "flex",
                     position: "relative"
                   },
                   children: [
-                    /* @__PURE__ */ t("div", { style: { width: `${i.getVirtualItems()[0]?.start ?? 0}px`, flexShrink: 0 } }),
-                    i.getVirtualItems().map((e) => /* @__PURE__ */ t(
+                    /* @__PURE__ */ t("div", { style: { width: `${c.getVirtualItems()[0]?.start ?? 0}px`, flexShrink: 0 } }),
+                    c.getVirtualItems().map((e) => /* @__PURE__ */ t(
                       "div",
                       {
-                        ref: i.measureElement,
+                        ref: c.measureElement,
                         "data-index": e.index,
                         className: "flex-shrink-0",
-                        children: R(u[e.index], e.index)
+                        children: C(d[e.index], e.index)
                       },
                       e.key
                     ))
@@ -158,13 +162,14 @@ const F = a.forwardRef(
                 }
               )
             }
-          )
+          ),
+          S.right
         ]
       }
     );
   }
 );
-F.displayName = "HorizontalScroller";
+$.displayName = "HorizontalScroller";
 export {
-  F as default
+  $ as default
 };

package/dist/components/ui/nested-list/hooks/useNestedListDragDrop.js

@@ -1,6 +1,6 @@
 import { useCallback as S } from "react";
 import { useSensors as Z, useSensor as V, MouseSensor as $, TouchSensor as E, closestCenter as p } from "@dnd-kit/core";
-import { arrayMove as w } from "@dnd-kit/sortable";
+import { arrayMove as A } from "@dnd-kit/sortable";
 const W = "droppable-", y = /* @__PURE__ */ new Set(["root-frozen", "root-scrollable"]);
 function X(h) {
   if (h.startsWith(W)) {
@@ -65,7 +65,7 @@ const rn = ({
       return null;
     },
     []
-  ), A = S(
+  ), G = S(
     (t, e, o) => t.map((r) => {
       if (r.children && r.children.length > 0) {
         const n = r.children.findIndex(
@@ -74,7 +74,7 @@ const rn = ({
           (i) => i.id === o
         );
         if (n !== -1 && l !== -1) {
-          const i = w(r.children, n, l);
+          const i = A(r.children, n, l);
           return {
             ...r,
             children: i
@@ -82,7 +82,7 @@ const rn = ({
         }
         return {
           ...r,
-          children: A(r.children, e, o)
+          children: G(r.children, e, o)
         };
       }
       return r;
@@ -98,7 +98,7 @@ const rn = ({
         (i) => i.id === e
       );
       if (n !== -1 && l !== -1) {
-        const i = w(
+        const i = A(
           t,
           l,
           n
@@ -112,7 +112,7 @@ const rn = ({
     (t, e, o) => {
       const r = t.findIndex((l) => l.id === e), n = t.findIndex((l) => l.id === o);
       if (r !== -1 && n !== -1) {
-        const l = w(t, r, n);
+        const l = A(t, r, n);
         return u?.(e, o), l;
       }
       return null;
@@ -120,20 +120,20 @@ const rn = ({
     [u]
   ), z = S(
     (t, e, o) => {
-      const r = A(t, e, o);
+      const r = G(t, e, o);
       return u?.(e, o), r;
     },
-    [A, u]
-  ), G = S(
+    [G, u]
+  ), N = S(
     (t, e, o, r = !1) => {
       const n = F(t, e);
       if (!n) return null;
       const l = (s) => s.filter((c) => c.id !== e).map(
         (c) => c.children ? { ...c, children: l(c.children) } : c
-      ).filter((c) => !(c.children && c.children.length === 0 && c.category === "group")), i = F(t, o), f = !n.children || n.children.length === 0, R = i?.children && i.children.length > 0, M = d[o] === !0, _ = f && R && !M, g = (s) => {
+      ).filter((c) => !(c.children && c.children.length === 0 && c.category === "group")), i = F(t, o), f = !n.children || n.children.length === 0, R = i?.children && i.children.length > 0, M = d[o] === !0, w = f && R && !M && r, g = (s) => {
         for (let c = 0; c < s.length; c++) {
           if (s[c].id === o)
-            if (_) {
+            if (w) {
               const L = {
                 ...s[c],
                 children: [n, ...s[c].children || []]
@@ -156,7 +156,7 @@ const rn = ({
       return Y ? (u?.(e, o), O) : null;
     },
     [u, d]
-  ), N = S(
+  ), _ = S(
     (t, e, o) => {
       const r = F(t, e);
       if (!r) return t;
@@ -181,10 +181,10 @@ const rn = ({
         }
         const f = X(i);
         if (f)
-          return N(n, l, f);
-        const R = C(n, l), M = C(n, i), _ = T(n, l), g = T(n, i);
+          return _(n, l, f);
+        const R = C(n, l), M = C(n, i), w = T(n, l), g = T(n, i);
         if (y.has(i) && R !== null && R > 0)
-          return N(n, l, i);
+          return _(n, l, i);
         if (R === 0 && M !== null && M > 0)
           return B(
             n,
@@ -193,7 +193,7 @@ const rn = ({
           ) || n;
         if (R === null || M === null)
           return n;
-        if (R > 0 && M > 0 && _ !== g) {
+        if (R > 0 && M > 0 && w !== g) {
           const P = j(n, l), O = j(n, i);
           if (P && O && P !== O) {
             const a = o.rect.current.translated, b = r.rect;
@@ -202,7 +202,7 @@ const rn = ({
               const Q = a.top + a.height / 2, U = b.top + b.height / 2;
               H = Q > U;
             }
-            return G(n, l, i, H) || n;
+            return N(n, l, i, H) || n;
           }
           const Y = o.rect.current.translated, s = r.rect;
           let c = !1;
@@ -210,7 +210,7 @@ const rn = ({
             const a = Y.top + Y.height / 2, b = s.top + s.height / 2;
             c = a > b;
           }
-          return G(n, l, i, c) || n;
+          return N(n, l, i, c) || n;
         }
         return R === 0 ? k(n, l, i) || n : z(n, l, i);
       });
@@ -221,8 +221,8 @@ const rn = ({
       B,
       k,
       z,
-      G,
       N,
+      _,
       x
     ]
   ), K = S(

package/dist/components/ui/types/horizontal-scroller.types.d.ts

@@ -46,4 +46,8 @@ export interface HorizontalScrollerProps<T = any> extends Omit<React.HTMLAttribu
      * Number of items to render outside visible area. Default 5.
      */
     overscan?: number;
+    /**
+     * Disable virtualization and render all items. Useful for small lists where keyboard navigation is important. Default false.
+     */
+    disableVirtualization?: boolean;
 }