impact-nova 1.3.0 → 1.5.2

package/dist/components/ui/nested-list/components/SortableItem.js

@@ -1,28 +1,29 @@
-import { jsx as t, jsxs as h } from "react/jsx-runtime";
-import D, { useMemo as z } from "react";
-import { useSortable as E, defaultAnimateLayoutChanges as O } from "@dnd-kit/sortable";
-import { useDroppable as P } from "@dnd-kit/core";
-import { CSS as $ } from "@dnd-kit/utilities";
-import { Checkbox as j } from "../../checkbox.js";
-import { ChevronRight as H, Drag as L } from "../../../../icons/index.js";
-import { cn as n } from "../../../../lib/utils.js";
-const F = (e, o, r, l, a) => {
-  const d = "flex items-center gap-1 py-[3px] px-2 rounded transition-all duration-200";
-  return e ? n(d, "bg-transparent") : a ? n(d, "bg-red-100 border border-red-300 animate-pulse") : o && r ? l ? n(d, "bg-blue-50 border-2 border-blue-300 shadow-sm") : n(d, "bg-red-50 border-2 border-red-300 shadow-sm") : n(d, "hover:bg-gray-50");
-}, M = (e) => O({ ...e, wasDragging: !0 }), _ = ({ item: e, isAnyDragging: o }) => {
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+import z, { useMemo as L } from "react";
+import { useSortable as O, defaultAnimateLayoutChanges as P } from "@dnd-kit/sortable";
+import { useDroppable as $ } from "@dnd-kit/core";
+import { CSS as j } from "@dnd-kit/utilities";
+import { Checkbox as E } from "../../checkbox.js";
+import { ChevronRight as H, Drag as F } from "../../../../icons/index.js";
+import { cn as d } from "../../../../lib/utils.js";
+import { useImpactNovaI18n as M } from "../../../../i18n/ImpactNovaI18nContext.js";
+const _ = (e, o, r, l, a) => {
+  const s = "flex items-center gap-1 py-[3px] px-2 rounded transition-all duration-200";
+  return e ? d(s, "bg-transparent") : a ? d(s, "bg-red-100 border border-red-300 animate-pulse") : o && r ? l ? d(s, "bg-blue-50 border-2 border-blue-300 shadow-sm") : d(s, "bg-red-50 border-2 border-red-300 shadow-sm") : d(s, "hover:bg-gray-50");
+}, T = (e) => P({ ...e, wasDragging: !0 }), q = ({ item: e, isAnyDragging: o }) => {
   const r = !e.children || e.children.length === 0, {
     setNodeRef: l,
     isOver: a
-  } = P({
+  } = $({
     id: `droppable-${e.id}`,
     data: { sectionId: e.id },
     disabled: !r
   });
-  return /* @__PURE__ */ h("div", { ref: r ? l : void 0, children: [
-    /* @__PURE__ */ h(
+  return /* @__PURE__ */ p("div", { ref: r ? l : void 0, children: [
+    /* @__PURE__ */ p(
       "div",
       {
-        className: n(
+        className: d(
           "flex items-center px-2 py-0 text-xs font-[500] leading-4 text-[#7a8294] select-none",
           e.id === "root-scrollable" ? "mt-2 pt-2 pb-1 border-t border-solid border-gray-100" : "mt-1 pb-1",
           a && o && r && "bg-blue-50 rounded"
@@ -36,7 +37,7 @@ const F = (e, o, r, l, a) => {
     r && /* @__PURE__ */ t(
       "div",
       {
-        className: n(
+        className: d(
           "mx-2 my-1 rounded border-2 border-dashed min-h-[36px] flex items-center justify-center text-[11px] transition-colors",
           a && o ? "border-blue-400 bg-blue-50 text-blue-400" : "border-gray-200 text-gray-300"
         ),
@@ -44,42 +45,42 @@ const F = (e, o, r, l, a) => {
       }
     )
   ] });
-}, T = ({
+}, B = ({
   item: e,
   level: o,
   isCollapsed: r,
   onToggle: l,
   onToggleCollapse: a,
-  isAnyDragging: d = !1,
-  isOver: p = !1,
-  isValidDrop: f = !1,
-  enableDragDrop: x = !0,
+  isAnyDragging: s = !1,
+  isOver: h = !1,
+  isValidDrop: x = !1,
+  enableDragDrop: g = !0,
   enableCollapse: u = !0,
-  shouldBlink: g = !1
+  shouldBlink: v = !1
 }) => {
-  const m = e.category === "structure", c = e.children && e.children.length > 0, v = z(() => !e.children || e.children.length === 0 || e.children.every((b) => b.checked) ? !1 : e.children.some((b) => b.checked), [e.children]), {
+  const { t: m } = M(), f = e.category === "structure", c = e.children && e.children.length > 0, y = L(() => !e.children || e.children.length === 0 || e.children.every((b) => b.checked) ? !1 : e.children.some((b) => b.checked), [e.children]), {
     attributes: C,
-    listeners: y,
-    setNodeRef: k,
-    transform: N,
-    transition: I,
+    listeners: k,
+    setNodeRef: N,
+    transform: I,
+    transition: S,
     isDragging: i,
-    isOver: S
-  } = E({
+    isOver: w
+  } = O({
     id: e.id,
-    animateLayoutChanges: M,
+    animateLayoutChanges: T,
     data: {
       level: o,
       hasChildren: c,
       isExpanded: !r
     },
-    disabled: m || e.disabled
+    disabled: f || e.disabled
   });
-  if (m)
-    return /* @__PURE__ */ t(_, { item: e, isAnyDragging: d });
-  const w = p !== void 0 ? p : S, R = {
-    transform: $.Transform.toString(N),
-    transition: I,
+  if (f)
+    return /* @__PURE__ */ t(q, { item: e, isAnyDragging: s });
+  const R = h !== void 0 ? h : w, D = {
+    transform: j.Transform.toString(I),
+    transition: S,
     opacity: i ? 0.5 : 1,
     zIndex: i ? 100 : "auto",
     height: "auto"
@@ -87,23 +88,23 @@ const F = (e, o, r, l, a) => {
   return /* @__PURE__ */ t(
     "div",
     {
-      ref: k,
-      style: R,
+      ref: N,
+      style: D,
       className: "relative",
       "data-item-id": e.id,
       "data-level": o,
       "data-checked": e.checked,
       "data-disabled": e.disabled,
       "data-collapsed": r,
-      children: /* @__PURE__ */ h(
+      children: /* @__PURE__ */ p(
         "div",
         {
-          className: F(
+          className: _(
             i,
-            w,
-            d,
-            f,
-            g
+            R,
+            s,
+            x,
+            v
           ),
           style: {
             paddingLeft: `${8 + o * 20}px`
@@ -113,36 +114,36 @@ const F = (e, o, r, l, a) => {
               "button",
               {
                 type: "button",
-                onClick: (s) => {
-                  s.stopPropagation(), a(e.id);
+                onClick: (n) => {
+                  n.stopPropagation(), a(e.id);
                 },
-                onMouseDown: (s) => s.stopPropagation(),
+                onMouseDown: (n) => n.stopPropagation(),
                 className: "p-1 hover:bg-gray-200 rounded-full transition-colors flex items-center text-[#8C8C8C] hover:text-primary",
-                "aria-label": r ? "Expand" : "Collapse",
+                "aria-label": m(r ? "nestedList.expand" : "nestedList.collapse"),
                 children: /* @__PURE__ */ t(
                   H,
                   {
                     size: "16px",
-                    className: n("transition-transform", !r && "rotate-90")
+                    className: d("transition-transform", !r && "rotate-90")
                   }
                 )
               }
             ),
             (!u || !c) && /* @__PURE__ */ t("div", { className: "w-4" }),
             /* @__PURE__ */ t(
-              j,
+              E,
               {
                 id: `checkbox-${e.id}`,
-                checked: v ? "indeterminate" : e.checked,
+                checked: y ? "indeterminate" : e.checked,
                 onCheckedChange: () => l(e.id),
                 disabled: e.disabled
               }
             ),
-            x && /* @__PURE__ */ t(
+            g && /* @__PURE__ */ t(
               "div",
               {
                 ...C,
-                ...y,
+                ...k,
                 className: "cursor-grab active:cursor-grabbing p-0 hover:bg-gray-200 rounded flex items-center",
                 style: {
                   pointerEvents: "auto",
@@ -150,10 +151,10 @@ const F = (e, o, r, l, a) => {
                   zIndex: 30,
                   touchAction: "none"
                 },
-                onPointerDown: (s) => {
-                  s.stopPropagation();
+                onPointerDown: (n) => {
+                  n.stopPropagation();
                 },
-                children: /* @__PURE__ */ t(L, { size: "14px", color: "#8C8C8C" })
+                children: /* @__PURE__ */ t(F, { size: "14px", color: "#8C8C8C" })
               }
             ),
             /* @__PURE__ */ t(
@@ -169,7 +170,7 @@ const F = (e, o, r, l, a) => {
       )
     }
   );
-}, X = D.memo(T);
+}, A = z.memo(B);
 export {
-  X as SortableItem
+  A as SortableItem
 };