impact-nova 1.7.50 → 1.8.0

package/dist/components/ui/ag-grid-react/index.js

@@ -110,7 +110,7 @@ function De({
     applyAdvancedFilter: (e) => {
       if (!c.current) return;
       const t = ge(e);
-      c.current.setFilterModel(t), c.current.onFilterChanged();
+      c.current.setFilterModel(t), c.current.onFilterChanged(), c.current.refreshHeader();
     },
     openMenu: (e, t, o = "column") => {
       S.current = e, T.current = t, E.current = o, L(!0);

package/dist/components/ui/choice-card/choice-card.d.ts

@@ -0,0 +1,45 @@
+import * as React from "react";
+type ChoiceCardGroupBaseProps = {
+    disabled?: boolean;
+    orientation?: "horizontal" | "vertical";
+    className?: string;
+    children?: React.ReactNode;
+};
+export type ChoiceCardGroupSingleProps = ChoiceCardGroupBaseProps & {
+    type?: "single";
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+};
+export type ChoiceCardGroupMultipleProps = ChoiceCardGroupBaseProps & {
+    type: "multiple";
+    value?: string[];
+    defaultValue?: string[];
+    onValueChange?: (value: string[]) => void;
+};
+export type ChoiceCardGroupProps = ChoiceCardGroupSingleProps | ChoiceCardGroupMultipleProps;
+export declare function useChoiceCardGroup(): {
+    value: string | string[];
+    type: "multiple" | "single";
+    setValue: (value: string | string[]) => void;
+    isSelected: (itemValue: string) => boolean;
+};
+declare const ChoiceCardGroup: React.FC<ChoiceCardGroupProps>;
+export interface ChoiceCardProps extends React.HTMLAttributes<HTMLDivElement> {
+    value: string;
+    disabled?: boolean;
+}
+declare const ChoiceCard: React.ForwardRefExoticComponent<ChoiceCardProps & React.RefAttributes<HTMLDivElement>>;
+declare const ChoiceCardIndicator: React.FC<{
+    className?: string;
+}>;
+export type ChoiceCardContentProps = React.HTMLAttributes<HTMLDivElement>;
+declare const ChoiceCardContent: React.ForwardRefExoticComponent<ChoiceCardContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const ChoiceCardMedia: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const ChoiceCardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLHeadingElement>>;
+export interface ChoiceCardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+}
+declare const ChoiceCardHeader: React.ForwardRefExoticComponent<ChoiceCardHeaderProps & React.RefAttributes<HTMLDivElement>>;
+declare const ChoiceCardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+export { ChoiceCardGroup, ChoiceCard, ChoiceCardIndicator, ChoiceCardContent, ChoiceCardMedia, ChoiceCardTitle, ChoiceCardHeader, ChoiceCardDescription, };

package/dist/components/ui/choice-card/choice-card.js

@@ -0,0 +1,282 @@
+import { jsx as a } from "react/jsx-runtime";
+import * as c from "react";
+import * as g from "@radix-ui/react-radio-group";
+import { useControllableState as v } from "@radix-ui/react-use-controllable-state";
+import { Check as R } from "../../../icons/index.js";
+import { cn as l } from "../../../lib/utils.js";
+const b = c.createContext(null), f = c.createContext({
+  selected: !1,
+  type: "single"
+}), x = () => {
+  const e = c.useContext(b);
+  if (!e)
+    throw new Error("ChoiceCard components must be used within ChoiceCardGroup");
+  return e;
+};
+function B() {
+  const { value: e, type: t, setValue: o, isSelected: r } = x();
+  return c.useMemo(
+    () => ({
+      value: e,
+      type: t,
+      setValue: o,
+      isSelected: r
+    }),
+    [e, t, o, r]
+  );
+}
+const y = (e, t, o) => l(
+  "relative flex flex-col items-start gap-3 p-3 rounded-xl",
+  "border-t border-r border-b-2 border-l-4",
+  "cursor-pointer select-none transition-[border-color,background-color] duration-150",
+  "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-focus-ring",
+  e ? "border-brand bg-brand-tint hover:bg-brand-tint-hover" : "border-stroke-subtle bg-canvas-elevated hover:border-brand hover:bg-canvas-muted",
+  t && "cursor-not-allowed opacity-60",
+  o
+), G = ({
+  value: e,
+  defaultValue: t = "",
+  onValueChange: o,
+  disabled: r,
+  orientation: p = "horizontal",
+  className: u,
+  children: s
+}) => {
+  const [n, i] = v({
+    prop: e,
+    defaultProp: t,
+    onChange: o
+  }), d = c.useCallback(
+    (C) => n === C,
+    [n]
+  ), m = c.useMemo(
+    () => ({
+      type: "single",
+      disabled: r,
+      value: n,
+      setValue: (C) => i(C),
+      isSelected: d,
+      toggle: (C) => i(C)
+    }),
+    [r, n, i, d]
+  );
+  return /* @__PURE__ */ a(b.Provider, { value: m, children: /* @__PURE__ */ a(
+    g.Root,
+    {
+      value: n,
+      onValueChange: i,
+      disabled: r,
+      className: l(
+        "flex gap-4",
+        p === "vertical" && "flex-col gap-2",
+        u
+      ),
+      "data-component": "choice-card-group",
+      "data-type": "single",
+      children: s
+    }
+  ) });
+}, M = ({
+  value: e,
+  defaultValue: t = [],
+  onValueChange: o,
+  disabled: r,
+  orientation: p = "horizontal",
+  className: u,
+  children: s
+}) => {
+  const [n, i] = v({
+    prop: e,
+    defaultProp: t,
+    onChange: o
+  }), d = c.useMemo(() => n ?? [], [n]), m = c.useCallback(
+    (h) => d.includes(h),
+    [d]
+  ), C = c.useCallback(
+    (h) => {
+      if (d.includes(h)) {
+        i(d.filter((k) => k !== h));
+        return;
+      }
+      i([...d, h]);
+    },
+    [d, i]
+  ), w = c.useMemo(
+    () => ({
+      type: "multiple",
+      disabled: r,
+      value: d,
+      setValue: (h) => i(h),
+      isSelected: m,
+      toggle: C
+    }),
+    [r, d, i, m, C]
+  );
+  return /* @__PURE__ */ a(b.Provider, { value: w, children: /* @__PURE__ */ a(
+    "div",
+    {
+      role: "group",
+      className: l(
+        "flex gap-4",
+        p === "vertical" && "flex-col gap-2",
+        u
+      ),
+      "data-component": "choice-card-group",
+      "data-type": "multiple",
+      children: s
+    }
+  ) });
+}, S = (e) => e.type === "multiple" ? /* @__PURE__ */ a(M, { ...e }) : /* @__PURE__ */ a(G, { ...e });
+S.displayName = "ChoiceCardGroup";
+const N = c.forwardRef(({ className: e, selected: t, disabled: o, children: r, ...p }, u) => /* @__PURE__ */ a(
+  "div",
+  {
+    ref: u,
+    className: y(t, o, e),
+    "data-component": "choice-card",
+    "data-selected": t || void 0,
+    ...p,
+    children: r
+  }
+));
+N.displayName = "ChoiceCardSurface";
+const P = c.forwardRef(
+  ({ value: e, className: t, children: o, disabled: r, ...p }, u) => {
+    const s = x(), n = r || s.disabled, i = s.isSelected(e), d = c.useMemo(
+      () => ({
+        selected: i,
+        disabled: n,
+        type: s.type
+      }),
+      [i, n, s.type]
+    );
+    return s.type === "single" ? /* @__PURE__ */ a(f.Provider, { value: d, children: /* @__PURE__ */ a(g.Item, { value: e, asChild: !0, disabled: n, children: /* @__PURE__ */ a(
+      N,
+      {
+        ref: u,
+        selected: i,
+        disabled: n,
+        className: t,
+        ...p,
+        children: o
+      }
+    ) }) }) : /* @__PURE__ */ a(f.Provider, { value: d, children: /* @__PURE__ */ a(
+      "button",
+      {
+        ref: u,
+        type: "button",
+        role: "checkbox",
+        "aria-checked": i,
+        disabled: n,
+        className: y(i, n, t),
+        "data-component": "choice-card",
+        "data-selected": i || void 0,
+        onClick: () => s.toggle(e),
+        children: o
+      }
+    ) });
+  }
+);
+P.displayName = "ChoiceCard";
+const V = ({ className: e }) => {
+  const { selected: t, type: o } = c.useContext(f);
+  return o === "multiple" ? /* @__PURE__ */ a(
+    "div",
+    {
+      className: l(
+        "w-5 h-5 rounded border-2 flex items-center justify-center shrink-0 transition-colors",
+        t ? "border-brand bg-brand text-brand-foreground" : "border-stroke-field bg-transparent",
+        e
+      ),
+      "aria-hidden": "true",
+      children: t && /* @__PURE__ */ a(R, { size: 12 })
+    }
+  ) : /* @__PURE__ */ a(
+    "div",
+    {
+      className: l(
+        "w-5 h-5 rounded-full border-2 flex items-center justify-center shrink-0 transition-colors",
+        t ? "border-brand" : "border-stroke-field",
+        e
+      ),
+      "aria-hidden": "true",
+      children: t && /* @__PURE__ */ a("div", { className: "w-2.5 h-2.5 rounded-full bg-brand" })
+    }
+  );
+};
+V.displayName = "ChoiceCardIndicator";
+const j = c.forwardRef(
+  ({ className: e, children: t, ...o }, r) => /* @__PURE__ */ a(
+    "div",
+    {
+      ref: r,
+      className: l("flex flex-col items-start gap-2 w-full", e),
+      "data-slot": "choice-card-content",
+      ...o,
+      children: t
+    }
+  )
+);
+j.displayName = "ChoiceCardContent";
+const z = c.forwardRef(
+  ({ className: e, children: t, ...o }, r) => /* @__PURE__ */ a(
+    "div",
+    {
+      ref: r,
+      className: l("flex items-center justify-center shrink-0", e),
+      "data-slot": "choice-card-media",
+      ...o,
+      children: t
+    }
+  )
+);
+z.displayName = "ChoiceCardMedia";
+const I = c.forwardRef(
+  ({ className: e, children: t, ...o }, r) => /* @__PURE__ */ a(
+    "h3",
+    {
+      ref: r,
+      className: l(
+        "text-base font-medium leading-tight text-content capitalize",
+        e
+      ),
+      ...o,
+      children: t
+    }
+  )
+);
+I.displayName = "ChoiceCardTitle";
+const D = c.forwardRef(
+  ({ className: e, children: t, ...o }, r) => /* @__PURE__ */ a(
+    "div",
+    {
+      ref: r,
+      className: l("flex items-center gap-1 w-full", e),
+      "data-slot": "choice-card-header",
+      ...o,
+      children: t
+    }
+  )
+);
+D.displayName = "ChoiceCardHeader";
+const H = c.forwardRef(({ className: e, children: t, ...o }, r) => /* @__PURE__ */ a(
+  "p",
+  {
+    ref: r,
+    className: l("text-xs font-medium leading-4 text-content-secondary", e),
+    ...o,
+    children: t
+  }
+));
+H.displayName = "ChoiceCardDescription";
+export {
+  P as ChoiceCard,
+  j as ChoiceCardContent,
+  H as ChoiceCardDescription,
+  S as ChoiceCardGroup,
+  D as ChoiceCardHeader,
+  V as ChoiceCardIndicator,
+  z as ChoiceCardMedia,
+  I as ChoiceCardTitle,
+  B as useChoiceCardGroup
+};

package/dist/components/ui/choice-card/index.d.ts

@@ -0,0 +1 @@
+export { ChoiceCardGroup, ChoiceCard, ChoiceCardIndicator, ChoiceCardContent, ChoiceCardMedia, ChoiceCardTitle, ChoiceCardHeader, ChoiceCardDescription, useChoiceCardGroup, type ChoiceCardGroupProps, type ChoiceCardGroupSingleProps, type ChoiceCardGroupMultipleProps, type ChoiceCardProps, type ChoiceCardContentProps, type ChoiceCardHeaderProps, } from './choice-card';

package/dist/components/ui/choice-card/index.js

@@ -0,0 +1,12 @@
+import { ChoiceCard as o, ChoiceCardContent as r, ChoiceCardDescription as i, ChoiceCardGroup as a, ChoiceCardHeader as d, ChoiceCardIndicator as c, ChoiceCardMedia as h, ChoiceCardTitle as t, useChoiceCardGroup as n } from "./choice-card.js";
+export {
+  o as ChoiceCard,
+  r as ChoiceCardContent,
+  i as ChoiceCardDescription,
+  a as ChoiceCardGroup,
+  d as ChoiceCardHeader,
+  c as ChoiceCardIndicator,
+  h as ChoiceCardMedia,
+  t as ChoiceCardTitle,
+  n as useChoiceCardGroup
+};

package/dist/components/ui/data-table/data-table-saved-views.js

@@ -1,8 +1,8 @@
 import { jsxs as i, Fragment as W, jsx as t } from "react/jsx-runtime";
 import * as n from "react";
-import { ChevronDown as ge, Star as O, Search as ye, Bookmark as Ne, Pencil as we, Trash2 as Te } from "lucide-react";
-import { cn as V } from "../../../lib/utils.js";
-import { Popover as Ve, PopoverTrigger as ke, PopoverContent as Ce } from "../popover.js";
+import { ChevronDown as ge, Star as O, Search as ye, Bookmark as we, Pencil as Ne, Trash2 as Te } from "lucide-react";
+import { cn as k } from "../../../lib/utils.js";
+import { Popover as ke, PopoverTrigger as Ve, PopoverContent as Ce } from "../popover.js";
 import { Tooltip as X, TooltipTrigger as Z, TooltipContent as q } from "../tooltip.js";
 import { Button as m } from "../button.js";
 import { Badge as E } from "../badge.js";
@@ -22,12 +22,12 @@ const Ae = ["default", "active", "system"], Ye = ({
   menuOpen: j,
   defaultMenuOpen: ne = !1,
   onMenuOpenChange: R,
-  onSearch: k,
+  onSearch: V,
   isLoadingViews: L = !1,
   customListContent: _,
   disableApply: ie = !1,
-  className: le,
-  onSaveViewClick: re,
+  className: re,
+  onSaveViewClick: le,
   onApply: se,
   onCancel: oe,
   onEditView: de,
@@ -41,41 +41,41 @@ const Ae = ["default", "active", "system"], Ye = ({
       C || pe(e), R?.(e);
     },
     [C, R]
-  ), [v, D] = n.useState("All"), [N, S] = n.useState(""), [F, z] = n.useState("");
+  ), [v, D] = n.useState("All"), [w, S] = n.useState(""), [F, z] = n.useState("");
   n.useEffect(() => {
-    const e = window.setTimeout(() => z(N), 300);
+    const e = window.setTimeout(() => z(w), 300);
     return () => window.clearTimeout(e);
-  }, [N]), n.useEffect(() => {
-    k && k(F);
-  }, [F, k]);
+  }, [w]), n.useEffect(() => {
+    V && V(F);
+  }, [F, V]);
   const Q = n.useMemo(
     () => o.find((e) => e.isActive),
     [o]
-  ), d = Q ?? null, Y = te ?? Q?.viewName ?? a("dataTable.savedViewsNotApplicable"), [w, M] = n.useState(null), [x, $] = n.useState(null), K = n.useRef(!1);
+  ), d = Q ?? null, Y = te ?? Q?.viewName ?? a("dataTable.savedViewsNotApplicable"), [N, M] = n.useState(null), [x, $] = n.useState(null), K = n.useRef(!1);
   n.useEffect(() => {
     const e = u && !K.current;
     if (K.current = u, e) {
-      const l = o.find((c) => c.isActive);
-      M(l?.id ?? null), D("All"), S(""), z("");
+      const r = o.find((c) => c.isActive);
+      M(r?.id ?? null), D("All"), S(""), z("");
     }
   }, [u, o]);
-  const g = n.useMemo(() => v === "All" ? o : o.filter((e) => e.viewType === v), [o, v]), f = N.trim().toLowerCase(), T = n.useCallback(
-    (e, l) => l ? (e.viewName ?? "").trim().toLowerCase().includes(l) : !0,
+  const g = n.useMemo(() => v === "All" ? o : o.filter((e) => e.viewType === v), [o, v]), f = w.trim().toLowerCase(), T = n.useCallback(
+    (e, r) => r ? (e.viewName ?? "").trim().toLowerCase().includes(r) : !0,
     []
   ), A = n.useMemo(() => {
     let e = g;
-    return f && (e = e.filter((l) => T(l, f))), e;
+    return f && (e = e.filter((r) => T(r, f))), e;
   }, [g, f, T]), h = n.useMemo(() => {
     if (g.length === 0) return [];
     const e = Object.groupBy(g, Me);
-    return Ae.flatMap((l) => {
-      const c = e[l]?.[0];
+    return Ae.flatMap((r) => {
+      const c = e[r]?.[0];
       return c ? f && !T(c, f) ? [] : [c] : [];
     });
   }, [g, f, T]), P = n.useMemo(() => {
-    const e = new Set(h.map((l) => l.id));
-    return A.filter((l) => !e.has(l.id));
-  }, [A, h]), G = w === null ? null : o.find((e) => e.id === w) ?? null, fe = () => {
+    const e = new Set(h.map((r) => r.id));
+    return A.filter((r) => !e.has(r.id));
+  }, [A, h]), G = N === null ? null : o.find((e) => e.id === N) ?? null, fe = () => {
     se?.(G, { activeView: d }), p(!1);
   }, he = () => {
     oe?.({ activeView: d, pendingView: G }), p(!1);
@@ -84,14 +84,14 @@ const Ae = ["default", "active", "system"], Ye = ({
   };
   if (!b)
     return null;
-  const ve = o.length > 0, H = (e, l, c) => {
-    const B = w === e.id, s = me === e.id, J = l === "priority" && !!e.isActive, xe = l === "list" && !!e.isActive;
+  const ve = o.length > 0, H = (e, r, c) => {
+    const B = N === e.id, s = me === e.id, J = r === "priority" && !!e.isActive, xe = r === "list" && !!e.isActive;
     return /* @__PURE__ */ i(
       "div",
       {
         role: "button",
         tabIndex: 0,
-        className: V(
+        className: k(
           "mb-1 flex cursor-pointer items-center justify-between rounded-lg px-3 py-2 text-left text-sm font-medium font-['Manrope'] transition-all duration-300 relative overflow-hidden",
           !s && "hover:bg-muted",
           !s && J && !B && "bg-primary/10 dark:bg-primary/15",
@@ -100,8 +100,8 @@ const Ae = ["default", "active", "system"], Ye = ({
           s && "pointer-events-none"
         ),
         onClick: () => !s && M(e.id),
-        onKeyDown: (r) => {
-          (r.key === "Enter" || r.key === " ") && (r.preventDefault(), s || M(e.id));
+        onKeyDown: (l) => {
+          (l.key === "Enter" || l.key === " ") && (l.preventDefault(), s || M(e.id));
         },
         children: [
           s && /* @__PURE__ */ t(
@@ -118,7 +118,7 @@ const Ae = ["default", "active", "system"], Ye = ({
             /* @__PURE__ */ t(Z, { asChild: !0, children: /* @__PURE__ */ t(
               "span",
               {
-                className: V(
+                className: k(
                   "min-w-0 flex-1 truncate relative z-10",
                   xe && "underline decoration-primary decoration-2 underline-offset-2"
                 ),
@@ -136,10 +136,10 @@ const Ae = ["default", "active", "system"], Ye = ({
                 size: "iconSm",
                 className: "text-foreground hover:text-content-charcoal",
                 "aria-label": a("dataTable.savedViewsEdit"),
-                onClick: (r) => {
-                  r.stopPropagation(), r.preventDefault(), p(!1), de?.(e, { activeView: d });
+                onClick: (l) => {
+                  l.stopPropagation(), l.preventDefault(), p(!1), de?.(e, { activeView: d });
                 },
-                children: /* @__PURE__ */ t(we, { className: "size-3.5" })
+                children: /* @__PURE__ */ t(Ne, { className: "size-3.5" })
               }
             ) : null,
             e.isDeletable ? /* @__PURE__ */ t(
@@ -150,8 +150,8 @@ const Ae = ["default", "active", "system"], Ye = ({
                 size: "iconSm",
                 className: "text-foreground hover:text-destructive",
                 "aria-label": a("dataTable.savedViewsDelete"),
-                onClick: (r) => {
-                  r.stopPropagation(), r.preventDefault(), p(!1), $(e);
+                onClick: (l) => {
+                  l.stopPropagation(), l.preventDefault(), p(!1), $(e);
                 },
                 children: /* @__PURE__ */ t(Te, { className: "size-3.5" })
               }
@@ -165,8 +165,8 @@ const Ae = ["default", "active", "system"], Ye = ({
                 className: "text-yellow-500 hover:text-yellow-600 disabled:opacity-50",
                 "aria-label": a("dataTable.savedViewsDefaultAction"),
                 disabled: s,
-                onClick: (r) => {
-                  r.stopPropagation(), r.preventDefault(), s || (y(e.id), setTimeout(() => y(null), 1200), U?.(e, { activeView: d }));
+                onClick: (l) => {
+                  l.stopPropagation(), l.preventDefault(), s || (y(e.id), setTimeout(() => y(null), 1200), U?.(e, { activeView: d }));
                 },
                 children: s ? /* @__PURE__ */ t("div", { className: "size-3.5 animate-spin rounded-full border-2 border-yellow-500 border-t-transparent" }) : /* @__PURE__ */ t(O, { className: "size-3.5 fill-current" })
               }
@@ -179,8 +179,8 @@ const Ae = ["default", "active", "system"], Ye = ({
                 className: "text-yellow-500 hover:text-yellow-600 disabled:opacity-50",
                 "aria-label": a("dataTable.savedViewsSetDefault"),
                 disabled: s,
-                onClick: (r) => {
-                  r.stopPropagation(), r.preventDefault(), s || (y(e.id), setTimeout(() => y(null), 1200), U?.(e, { activeView: d }));
+                onClick: (l) => {
+                  l.stopPropagation(), l.preventDefault(), s || (y(e.id), setTimeout(() => y(null), 1200), U?.(e, { activeView: d }));
                 },
                 children: s ? /* @__PURE__ */ t("div", { className: "size-3.5 animate-spin rounded-full border-2 border-yellow-500 border-t-transparent" }) : /* @__PURE__ */ t(O, { className: "size-3.5" })
               }
@@ -196,20 +196,20 @@ const Ae = ["default", "active", "system"], Ye = ({
       "div",
       {
         "data-component": "data-table-saved-views",
-        className: V(
-          "mb-2 mx-4 rounded-lg bg-[linear-gradient(83.74deg,#F5F9EC_72.68%,#D7E5B2_108.88%)] flex min-w-0 flex-wrap items-center justify-between gap-2 px-2 py-3",
-          le
+        className: k(
+          "mb-2 mx-4 flex min-w-0 flex-nowrap items-center justify-between gap-2 rounded-lg bg-[linear-gradient(83.74deg,#F5F9EC_72.68%,#D7E5B2_108.88%)] px-2 py-3",
+          re
         ),
         children: [
-          L ? /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center gap-1", children: [
+          L ? /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center gap-1 overflow-hidden", children: [
             /* @__PURE__ */ t(I, { className: "h-6 w-24 rounded-full bg-black/10" }),
-            /* @__PURE__ */ t(I, { className: "h-6 w-6 rounded-md bg-black/10" })
-          ] }) : ve ? /* @__PURE__ */ t("div", { className: "flex min-w-0 flex-1 items-center gap-1 sm:flex-initial", children: /* @__PURE__ */ i(Ve, { open: u, onOpenChange: be, children: [
-            /* @__PURE__ */ t(ke, { asChild: !0, children: /* @__PURE__ */ i(
+            /* @__PURE__ */ t(I, { className: "h-6 w-6 shrink-0 rounded-md bg-black/10" })
+          ] }) : ve ? /* @__PURE__ */ t("div", { className: "flex min-w-0 flex-1 items-center justify-start gap-1 overflow-hidden", children: /* @__PURE__ */ i(ke, { open: u, onOpenChange: be, children: [
+            /* @__PURE__ */ t(Ve, { asChild: !0, children: /* @__PURE__ */ i(
               "button",
               {
                 type: "button",
-                className: "flex min-w-0 max-w-full cursor-pointer items-center gap-1 rounded-md border-none bg-transparent p-0 text-left outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-2",
+                className: "inline-flex min-w-0 max-w-full cursor-pointer items-center gap-1 overflow-hidden rounded-md border-none bg-transparent p-0 text-left outline-none focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-2",
                 "aria-expanded": u,
                 "aria-haspopup": "dialog",
                 "aria-label": a("dataTable.savedViewsOpenMenu"),
@@ -220,8 +220,8 @@ const Ae = ["default", "active", "system"], Ye = ({
                       {
                         color: "success",
                         variant: "outline",
-                        className: "max-w-[min(100%,200px)] shrink font-['Manrope']",
-                        children: /* @__PURE__ */ t("span", { className: "truncate", children: Y })
+                        className: "w-fit max-w-full min-w-0 shrink font-['Manrope']",
+                        children: Y
                       }
                     ) }),
                     /* @__PURE__ */ t(q, { variant: "tertiary", side: "top", children: Y })
@@ -229,7 +229,7 @@ const Ae = ["default", "active", "system"], Ye = ({
                   /* @__PURE__ */ t(
                     "span",
                     {
-                      className: V(
+                      className: k(
                         "flex size-6 shrink-0 items-center justify-center rounded-md bg-white transition-transform duration-200",
                         u && "rotate-180"
                       ),
@@ -298,7 +298,7 @@ const Ae = ["default", "active", "system"], Ye = ({
                     {
                       size: "sm",
                       placeholder: a("dataTable.savedViewsSearchPlaceholder"),
-                      value: N,
+                      value: w,
                       onChange: (e) => S(e.target.value),
                       prefix: /* @__PURE__ */ t(
                         ye,
@@ -349,7 +349,7 @@ const Ae = ["default", "active", "system"], Ye = ({
                         type: "button",
                         variant: "default",
                         size: "md",
-                        disabled: ie || w === d?.id,
+                        disabled: ie || N === d?.id,
                         onClick: fe,
                         children: a("dataTable.savedViewsApply")
                       }
@@ -358,8 +358,8 @@ const Ae = ["default", "active", "system"], Ye = ({
                 ] })
               }
             )
-          ] }) }) : /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center gap-2 text-content-tertiary", children: [
-            /* @__PURE__ */ t(Ne, { className: "size-4 shrink-0", "aria-hidden": !0 }),
+          ] }) }) : /* @__PURE__ */ i("div", { className: "flex min-w-0 flex-1 items-center gap-2 overflow-hidden text-content-tertiary", children: [
+            /* @__PURE__ */ t(we, { className: "size-4 shrink-0", "aria-hidden": !0 }),
             /* @__PURE__ */ t("span", { className: "text-sm font-medium font-['Manrope']", children: a("dataTable.savedViewsNoneYet") })
           ] }),
           /* @__PURE__ */ t(
@@ -370,7 +370,7 @@ const Ae = ["default", "active", "system"], Ye = ({
               size: "sm",
               className: "shrink-0 font-['Manrope']",
               onClick: () => {
-                p(!1), re?.({ activeView: d });
+                p(!1), le?.({ activeView: d });
               },
               children: a("dataTable.savedViewsSave")
             }

package/dist/components/ui/nested-list/components/NestedListContent.d.ts

@@ -8,8 +8,9 @@ interface NestedListContentProps {
     items: {
         item: NestedListItem;
         level: number;
+        indentLevel: number;
     }[];
-    renderItem: (item: NestedListItem, level: number) => React.ReactNode;
+    renderItem: (item: NestedListItem, level: number, indentLevel: number) => React.ReactNode;
     onDragStart: (event: DragStartEvent) => void;
     onDragOver: (event: DragOverEvent) => void;
     onDragEnd: (event: DragEndEvent) => void;