@yuno-payments/dashboard-design-system 0.0.136 → 0.0.138-beta.1

package/dist/components/atoms/filter/filter.js

@@ -1,21 +1,21 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as x, useState as A, useMemo as M } from "react";
-import { Button as g } from "../../../vendor/shadcn/button.js";
+import { forwardRef as f, useState as A, useMemo as M } from "react";
+import { Button as j } from "../../../vendor/shadcn/button.js";
 import { Badge as C } from "../../../vendor/shadcn/badge.js";
 import { Separator as p } from "../../../vendor/shadcn/separator.js";
-import { Checkbox as Q } from "../../../vendor/shadcn/checkbox.js";
-import { RadioGroup as E, RadioGroupItem as L } from "../../../vendor/shadcn/radio-group.js";
+import { Checkbox as E } from "../../../vendor/shadcn/checkbox.js";
+import { RadioGroup as Q, RadioGroupItem as L } from "../../../vendor/shadcn/radio-group.js";
 import { Icon as y } from "../icon/icon.js";
-import { cn as u } from "../../../lib/utils.js";
+import { cn as g } from "../../../lib/utils.js";
 import { Field as k } from "../field/field.js";
 import { Tooltip as v } from "../tooltip/tooltip.js";
-const F = x(
+const F = f(
   ({ label: s, onRemove: t, className: n, ...l }, i) => /* @__PURE__ */ e.jsxs(
     C,
     {
       ref: i,
       variant: "secondary",
-      className: u("h-8 gap-2 px-3 py-2 shadow-xs", n),
+      className: g("h-8 gap-2 px-3 py-2 shadow-xs", n),
       ...l,
       children: [
         /* @__PURE__ */ e.jsx("span", { className: "text-xs font-medium leading-none", children: s }),
@@ -33,49 +33,49 @@ const F = x(
   )
 );
 F.displayName = "FilterTag";
-const P = x(
+const P = f(
   ({
     appliedFilters: s = [],
     onRemoveFilter: t,
     onClearAll: n,
     maxVisibleTags: l = 4,
     className: i,
-    ...r
-  }, d) => {
-    const c = s.length > 0, h = s.slice(0, l), j = s.length - l;
+    ...c
+  }, r) => {
+    const o = s.length > 0, x = s.slice(0, l), u = s.length - l;
     return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-4", children: [
       /* @__PURE__ */ e.jsxs(
-        g,
+        j,
         {
-          ref: d,
+          ref: r,
           variant: "outline",
           size: "sm",
-          className: u("h-8 gap-2 px-3 py-2", i),
-          ...r,
+          className: g("h-8 gap-2 px-3 py-2", i),
+          ...c,
           children: [
             /* @__PURE__ */ e.jsx(y, { name: "FunnelSimple", className: "size-4" }),
             /* @__PURE__ */ e.jsx("span", { className: "text-xs font-medium leading-none", children: "Add filter" })
           ]
         }
       ),
-      c && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      o && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsx(p, { orientation: "vertical", className: "h-5" }),
         /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
-          h.map((f) => /* @__PURE__ */ e.jsx(
+          x.map((m) => /* @__PURE__ */ e.jsx(
             F,
             {
-              label: f.label,
-              onRemove: () => t?.(f.id)
+              label: m.label,
+              onRemove: () => t?.(m.id)
             },
-            f.id
+            m.id
           )),
-          j > 0 && /* @__PURE__ */ e.jsx(C, { variant: "default", className: "h-8 px-3 py-2 shadow-xs", children: /* @__PURE__ */ e.jsxs("span", { className: "text-xs font-medium leading-none", children: [
+          u > 0 && /* @__PURE__ */ e.jsx(C, { variant: "default", className: "h-8 px-3 py-2 shadow-xs", children: /* @__PURE__ */ e.jsxs("span", { className: "text-xs font-medium leading-none", children: [
             "+",
-            j,
+            u,
             " more"
           ] }) }),
           n && /* @__PURE__ */ e.jsx(
-            g,
+            j,
             {
               variant: "ghost",
               size: "sm",
@@ -86,7 +86,7 @@ const P = x(
           )
         ] })
       ] }),
-      !c && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      !o && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsx(p, { orientation: "vertical", className: "h-5" }),
         /* @__PURE__ */ e.jsx("span", { className: "text-sm font-normal text-muted-foreground", children: "No filters applied" })
       ] })
@@ -94,43 +94,43 @@ const P = x(
   }
 );
 P.displayName = "FilterButton";
-const X = x(
+const X = f(
   (s, t) => {
     const {
       title: n,
       items: l,
       className: i,
-      searchable: r = !1,
-      searchPlaceholder: d = "Search...",
-      showActions: c = !1,
-      enableSelectAll: h = !0,
-      enableInverse: j = !0,
-      enableNone: f = !0
-    } = s, o = s.type || "checkbox", S = o === "radio", z = o === "checkbox" || !s.type, [N, I] = A(""), b = M(() => N ? l.filter(
+      searchable: c = !1,
+      searchPlaceholder: r = "Search...",
+      showActions: o = !1,
+      enableSelectAll: x = !0,
+      enableInverse: u = !0,
+      enableNone: m = !0
+    } = s, d = s.type || "checkbox", w = d === "radio", z = d === "checkbox" || !s.type, [N, I] = A(""), b = M(() => N ? l.filter(
       (a) => a.label.toLowerCase().includes(N.toLowerCase())
     ) : l, [l, N]), R = () => {
-      if (o === "checkbox" && "selectedValues" in s) {
-        const a = l.map((m) => m.value);
+      if (d === "checkbox" && "selectedValues" in s) {
+        const a = l.map((h) => h.value);
         s.onChange(a);
       }
     }, T = () => {
-      if (o === "checkbox" && "selectedValues" in s) {
-        const a = l.filter((m) => !s.selectedValues.includes(m.value)).map((m) => m.value);
+      if (d === "checkbox" && "selectedValues" in s) {
+        const a = l.filter((h) => !s.selectedValues.includes(h.value)).map((h) => h.value);
         s.onChange(a);
       }
     }, B = () => {
-      o === "checkbox" && "selectedValues" in s ? s.onChange([]) : o === "radio" && "selectedValue" in s && s.onChange("");
+      d === "checkbox" && "selectedValues" in s ? s.onChange([]) : d === "radio" && "selectedValue" in s && s.onChange("");
     }, G = (a) => {
-      if (o === "checkbox" && "selectedValues" in s) {
+      if (d === "checkbox" && "selectedValues" in s) {
         const O = s.selectedValues.includes(a) ? s.selectedValues.filter(($) => $ !== a) : [...s.selectedValues, a];
         s.onChange(O);
       }
     };
-    return /* @__PURE__ */ e.jsxs("div", { ref: t, className: u("flex flex-col h-full", i), children: [
-      r && /* @__PURE__ */ e.jsx(
+    return /* @__PURE__ */ e.jsxs("div", { ref: t, className: g("flex flex-col h-full", i), children: [
+      c && /* @__PURE__ */ e.jsx(
         k,
         {
-          placeholder: d,
+          placeholder: r,
           value: N,
           onChange: (a) => I(a.target.value),
           startIcon: "MagnifyingGlass",
@@ -139,9 +139,9 @@ const X = x(
       ),
       /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between mb-1", children: [
         /* @__PURE__ */ e.jsx("span", { className: "text-sm font-normal text-foreground", children: n }),
-        c && o === "checkbox" && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
-          h && /* @__PURE__ */ e.jsx(
-            g,
+        o && d === "checkbox" && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-end gap-2", children: [
+          x && /* @__PURE__ */ e.jsx(
+            j,
             {
               variant: "link",
               size: "sm",
@@ -150,8 +150,8 @@ const X = x(
               children: "Select all"
             }
           ),
-          j && /* @__PURE__ */ e.jsx(
-            g,
+          u && /* @__PURE__ */ e.jsx(
+            j,
             {
               variant: "link",
               size: "sm",
@@ -160,8 +160,8 @@ const X = x(
               children: "Inverse"
             }
           ),
-          f && /* @__PURE__ */ e.jsx(
-            g,
+          m && /* @__PURE__ */ e.jsx(
+            j,
             {
               variant: "link",
               size: "sm",
@@ -173,14 +173,14 @@ const X = x(
         ] })
       ] }),
       /* @__PURE__ */ e.jsx(p, { className: "w-full mb-6" }),
-      S && "selectedValue" in s ? /* @__PURE__ */ e.jsx(
-        E,
+      w && "selectedValue" in s ? /* @__PURE__ */ e.jsx(
+        Q,
         {
           value: s.selectedValue,
           onValueChange: s.onChange,
-          className: "grid grid-cols-2 gap-4 overflow-y-auto",
+          className: "grid grid-cols-2 gap-x-4 gap-y-5 overflow-y-auto",
           children: b.map((a) => /* @__PURE__ */ e.jsx(
-            w,
+            S,
             {
               label: a.label,
               value: a.value,
@@ -189,11 +189,12 @@ const X = x(
             a.value
           ))
         }
-      ) : z && "selectedValues" in s ? /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-2 gap-4 overflow-y-auto", children: b.map((a) => /* @__PURE__ */ e.jsx(
+      ) : z && "selectedValues" in s ? /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-2 gap-x-4 gap-y-5 overflow-y-auto", children: b.map((a) => /* @__PURE__ */ e.jsx(
         V,
         {
           label: a.label,
           description: a.description,
+          icon: a.icon,
           checked: s.selectedValues.includes(a.value),
           onCheckedChange: () => G(a.value)
         },
@@ -203,19 +204,30 @@ const X = x(
   }
 );
 X.displayName = "FilterSection";
-const V = x(({ label: s, checked: t, onCheckedChange: n, description: l, className: i, maxLabelLength: r = 14 }, d) => {
-  const c = s.length > r, h = c ? `${s.slice(0, r)}...` : s;
-  return /* @__PURE__ */ e.jsxs("label", { className: u("flex items-start gap-2 cursor-pointer", i), children: [
-    /* @__PURE__ */ e.jsx(Q, { ref: d, checked: t, onCheckedChange: n }),
+const V = f(({ label: s, checked: t, onCheckedChange: n, description: l, className: i, maxLabelLength: c = 14, icon: r }, o) => {
+  const x = s.length > c, u = x ? `${s.slice(0, c)}...` : s;
+  return /* @__PURE__ */ e.jsxs("label", { className: g("flex items-start gap-2 cursor-pointer", i), children: [
+    /* @__PURE__ */ e.jsx(E, { ref: o, checked: t, onCheckedChange: n }),
+    r && /* @__PURE__ */ e.jsx(
+      "img",
+      {
+        src: r,
+        alt: "",
+        className: "size-4 object-contain shrink-0",
+        onError: (m) => {
+          m.currentTarget.style.display = "none";
+        }
+      }
+    ),
     /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5 min-w-0 flex-1", children: [
-      /* @__PURE__ */ e.jsx(v, { content: c ? s : "", children: /* @__PURE__ */ e.jsx("span", { className: "text-sm font-medium leading-none truncate", children: h }) }),
+      /* @__PURE__ */ e.jsx(v, { content: x ? s : "", children: /* @__PURE__ */ e.jsx("span", { className: "text-sm font-medium leading-none truncate", children: u }) }),
       l && /* @__PURE__ */ e.jsx("span", { className: "text-sm font-normal leading-5 text-muted-foreground truncate", children: l })
     ] })
   ] });
 });
 V.displayName = "FilterCheckboxOption";
-const w = x(
-  ({ label: s, value: t, description: n, className: l }, i) => /* @__PURE__ */ e.jsxs("div", { className: u("flex items-start gap-3", l), children: [
+const S = f(
+  ({ label: s, value: t, description: n, className: l }, i) => /* @__PURE__ */ e.jsxs("div", { className: g("flex items-start gap-3", l), children: [
     /* @__PURE__ */ e.jsx(L, { ref: i, value: t, id: `radio-${t}` }),
     /* @__PURE__ */ e.jsxs(
       "label",
@@ -230,22 +242,22 @@ const w = x(
     )
   ] })
 );
-w.displayName = "FilterRadioOption";
-const q = x(
+S.displayName = "FilterRadioOption";
+const q = f(
   ({
     children: s,
     showSearch: t = !1,
     searchPlaceholder: n = "Search...",
     searchValue: l,
     onSearchChange: i,
-    className: r
-  }, d) => /* @__PURE__ */ e.jsxs(
+    className: c
+  }, r) => /* @__PURE__ */ e.jsxs(
     "div",
     {
-      ref: d,
-      className: u(
-        "flex flex-col gap-6 bg-white rounded-md p-6 min-w-[448px]",
-        r
+      ref: r,
+      className: g(
+        "flex flex-col gap-6 bg-background rounded-md p-6 min-w-[448px]",
+        c
       ),
       children: [
         t && /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
@@ -261,7 +273,7 @@ const q = x(
             {
               placeholder: n,
               value: l,
-              onChange: (c) => i?.(c.target.value),
+              onChange: (o) => i?.(o.target.value),
               className: "pl-9"
             }
           )
@@ -276,7 +288,7 @@ export {
   P as FilterButton,
   V as FilterCheckboxOption,
   q as FilterContent,
-  w as FilterRadioOption,
+  S as FilterRadioOption,
   X as FilterSection,
   F as FilterTag
 };

package/dist/components/atoms/filter-dropdown/filter-dropdown.js

@@ -1,51 +1,51 @@
 import { j as t } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as j, useState as I, useRef as _, useCallback as K, useEffect as X } from "react";
-import { Button as E } from "../../../vendor/shadcn/button.js";
-import { Separator as S } from "../../../vendor/shadcn/separator.js";
+import { forwardRef as j, useState as F, useRef as _, useCallback as K, useEffect as X } from "react";
+import { Button as I } from "../../../vendor/shadcn/button.js";
+import { Separator as E } from "../../../vendor/shadcn/separator.js";
 import { Badge as k } from "../../../vendor/shadcn/badge.js";
 import { Icon as b } from "../icon/icon.js";
-import { FilterSection as M } from "../filter/filter.js";
+import { FilterSection as S } from "../filter/filter.js";
 import { FilterDateRange as Y, FilterDateRangeValue as g } from "../filter/filter-date-range.js";
-import { cn as d } from "../../../lib/utils.js";
-const A = j(
-  ({ icon: r, label: u, isActive: l = !1, showChevron: m = !1, className: h, ...o }, C) => /* @__PURE__ */ t.jsxs(
+import { cn as c } from "../../../lib/utils.js";
+const M = j(
+  ({ icon: s, label: u, isActive: r = !1, showChevron: m = !1, className: h, ...l }, C) => /* @__PURE__ */ t.jsxs(
     "button",
     {
       ref: C,
-      className: d(
+      className: c(
         "flex items-center gap-2 h-8 px-2 rounded-md w-full transition-colors",
         "hover:bg-secondary",
         h
       ),
-      ...o,
+      ...l,
       children: [
-        r && /* @__PURE__ */ t.jsx(
+        s && /* @__PURE__ */ t.jsx(
           b,
           {
-            name: r,
-            className: d(
+            name: s,
+            className: c(
               "size-4 shrink-0",
-              l ? "text-primary" : "text-foreground"
+              r ? "text-primary" : "text-foreground"
             )
           }
         ),
         /* @__PURE__ */ t.jsx(
           "span",
           {
-            className: d(
+            className: c(
               "flex-1 text-sm font-normal text-left truncate",
-              l ? "font-medium text-primary" : "text-foreground"
+              r ? "font-medium text-primary" : "text-foreground"
             ),
             children: u
           }
         ),
-        (l || m) && /* @__PURE__ */ t.jsx(
+        (r || m) && /* @__PURE__ */ t.jsx(
           b,
           {
             name: "CaretRight",
-            className: d(
+            className: c(
               "size-4 shrink-0",
-              l ? "text-primary" : "text-foreground"
+              r ? "text-primary" : "text-foreground"
             )
           }
         )
@@ -53,94 +53,91 @@ const A = j(
     }
   )
 );
-A.displayName = "FilterMenuItem";
-const V = j(
-  ({ items: r, activeItemId: u, onItemClick: l, className: m }, h) => /* @__PURE__ */ t.jsx(
+M.displayName = "FilterMenuItem";
+const A = j(
+  ({ items: s, activeItemId: u, onItemClick: r, className: m }, h) => /* @__PURE__ */ t.jsx(
     "div",
     {
       ref: h,
-      className: d(
+      className: c(
         "flex flex-col gap-2 w-64 h-full p-2 bg-surface border border-border rounded-md",
         m
       ),
-      children: r.map((o) => /* @__PURE__ */ t.jsx(
-        A,
+      children: s.map((l) => /* @__PURE__ */ t.jsx(
+        M,
         {
-          icon: o.icon,
-          label: o.label,
-          isActive: u === o.id,
-          showChevron: o.showChevron,
-          onClick: () => l?.(o.id)
+          icon: l.icon,
+          label: l.label,
+          isActive: u === l.id,
+          showChevron: l.showChevron,
+          onClick: () => r?.(l.id)
         },
-        o.id
+        l.id
       ))
     }
   )
 );
-V.displayName = "FilterMenu";
+A.displayName = "FilterMenu";
 const $ = j(
   ({
-    filters: r,
+    filters: s,
     buttonText: u = "Add filter",
-    appliedFilters: l = [],
+    appliedFilters: r = [],
     onRemoveFilter: m,
     onClearAllFilters: h,
-    maxVisibleTags: o = 4,
+    maxVisibleTags: l = 4,
     className: C,
-    disabled: O = !1
+    disabled: V = !1
   }, x) => {
-    const [f, p] = I(!1), [v, N] = I(
-      r.length > 0 && r[0]?.id || ""
-    ), w = _(null), R = K(
+    const [f, p] = F(!1), [v, w] = F(
+      s.length > 0 && s[0]?.id || ""
+    ), N = _(null), O = K(
       (n) => {
-        w.current = n, typeof x == "function" ? x(n) : x && (x.current = n);
+        N.current = n, typeof x == "function" ? x(n) : x && (x.current = n);
       },
       [x]
     );
     X(() => {
       if (!f) return;
-      const n = (s) => {
-        const c = s.target;
-        w.current?.contains(c) || c.closest?.(
+      const n = (i) => {
+        const d = i.target;
+        N.current?.contains(d) || d.closest?.(
           "[data-radix-popper-content-wrapper], [data-radix-portal]"
-        ) || c.closest?.(
+        ) || d.closest?.(
           ".rdp, .rdp-root, [data-calendar]"
         ) || p(!1);
-      }, a = (s) => {
-        s.key === "Escape" && p(!1);
-      }, i = setTimeout(() => {
+      }, a = (i) => {
+        i.key === "Escape" && p(!1);
+      }, o = setTimeout(() => {
         document.addEventListener("mousedown", n), document.addEventListener("keydown", a);
       }, 0);
       return () => {
-        clearTimeout(i), document.removeEventListener("mousedown", n), document.removeEventListener("keydown", a);
+        clearTimeout(o), document.removeEventListener("mousedown", n), document.removeEventListener("keydown", a);
       };
     }, [f]);
-    const z = l.length > 0, L = l.slice(0, o), y = l.length - o, T = (n) => {
-      if (r.find((s) => s.id === n)) return n;
-      const i = n.split("-");
-      if (i.length > 1) {
-        const s = i[0];
-        if (r.find((F) => F.id === s)) return s;
+    const R = r.length > 0, z = r.slice(0, l), y = r.length - l, T = (n) => s.find((o) => o.id === n)?.clearable !== !1, L = (n) => {
+      if (s.find((i) => i.id === n)) return n;
+      const o = n.split("-");
+      if (o.length > 1) {
+        const i = o[0];
+        if (s.find((D) => D.id === i)) return i;
       }
       return n;
-    }, D = (n) => {
-      const a = T(n);
-      return r.find((s) => s.id === a)?.clearable !== !1;
     }, P = (n) => {
-      const a = T(n);
-      N(a), p(!0);
-    }, B = l.some(
-      (n) => D(n.id)
-    ), U = r.map((n) => ({
+      const a = L(n);
+      w(a), p(!0);
+    }, B = r.some(
+      (n) => T(n.id)
+    ), U = s.map((n) => ({
       id: n.id,
       icon: n.icon,
       label: n.label
-    })), e = r.find((n) => n.id === v), H = () => {
+    })), e = s.find((n) => n.id === v), H = () => {
       if (!e) return null;
       switch (e.type) {
         case "checkbox":
           return /* @__PURE__ */ t.jsx(
-            M,
+            S,
             {
               title: e.label,
               items: e.items || [],
@@ -157,7 +154,7 @@ const $ = j(
           );
         case "radio":
           return /* @__PURE__ */ t.jsx(
-            M,
+            S,
             {
               type: "radio",
               title: e.label,
@@ -176,10 +173,10 @@ const $ = j(
         case "date": {
           const n = (a) => {
             if (e.onDateValueChange?.(a), a === g.CUSTOM && !e.dateInit && !e.dateEnd) {
-              const i = /* @__PURE__ */ new Date(), s = new Date(i);
-              s.setHours(23, 59, 59, 999);
-              const c = new Date(i);
-              c.setHours(0, 0, 0, 0), e.onDateInitChange?.(c), e.onDateEndChange?.(s), e.startTime || e.onStartTimeChange?.("00:00:00"), e.endTime || e.onEndTimeChange?.("23:59:59");
+              const o = /* @__PURE__ */ new Date(), i = new Date(o);
+              i.setHours(23, 59, 59, 999);
+              const d = new Date(o);
+              d.setHours(0, 0, 0, 0), e.onDateInitChange?.(d), e.onDateEndChange?.(i), e.startTime || e.onStartTimeChange?.("00:00:00"), e.endTime || e.onEndTimeChange?.("23:59:59");
             }
           };
           return /* @__PURE__ */ t.jsx(
@@ -214,42 +211,42 @@ const $ = j(
     return /* @__PURE__ */ t.jsxs(
       "div",
       {
-        ref: R,
-        className: d("flex flex-col gap-1 relative", C),
+        ref: O,
+        className: c("flex flex-col gap-1 relative", C),
         children: [
           /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-4", children: [
             /* @__PURE__ */ t.jsxs(
-              E,
+              I,
               {
                 variant: "outline",
                 size: "sm",
-                className: "h-8 gap-2 px-3 py-2",
+                className: "h-8 gap-2 px-3 py-2 border-border dark:bg-white/[0.045]",
                 onClick: () => p(!f),
-                disabled: O,
+                disabled: V,
                 children: [
                   /* @__PURE__ */ t.jsx(b, { name: "FunnelSimple", className: "size-4" }),
                   /* @__PURE__ */ t.jsx("span", { className: "text-xs font-medium leading-none", children: u })
                 ]
               }
             ),
-            z ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-              /* @__PURE__ */ t.jsx(S, { orientation: "vertical", className: "h-5" }),
+            R ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+              /* @__PURE__ */ t.jsx(E, { orientation: "vertical", className: "h-5" }),
               /* @__PURE__ */ t.jsxs("div", { className: "flex items-center gap-2", children: [
-                L.map((n) => {
-                  const a = D(n.id);
+                z.map((n) => {
+                  const a = T(n.id);
                   return /* @__PURE__ */ t.jsxs(
                     k,
                     {
                       variant: "secondary",
-                      className: "h-8 gap-2 px-3 py-2 shadow-xs cursor-pointer",
+                      className: "h-8 gap-2 px-3 py-2 shadow-xs cursor-pointer border-border dark:bg-white/[0.045]",
                       onClick: () => P(n.id),
                       children: [
                         /* @__PURE__ */ t.jsx("span", { className: "text-xs font-medium leading-none", children: n.label }),
                         m && a && /* @__PURE__ */ t.jsx(
                           "button",
                           {
-                            onClick: (i) => {
-                              i.stopPropagation(), m(n.id);
+                            onClick: (o) => {
+                              o.stopPropagation(), m(n.id);
                             },
                             className: "inline-flex items-center justify-center",
                             "aria-label": `Remove ${n.label} filter`,
@@ -267,7 +264,7 @@ const $ = j(
                   " more"
                 ] }) }),
                 h && B && /* @__PURE__ */ t.jsx(
-                  E,
+                  I,
                   {
                     variant: "ghost",
                     size: "sm",
@@ -278,14 +275,14 @@ const $ = j(
                 )
               ] })
             ] }) : /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-              /* @__PURE__ */ t.jsx(S, { orientation: "vertical", className: "h-5" }),
+              /* @__PURE__ */ t.jsx(E, { orientation: "vertical", className: "h-5" }),
               /* @__PURE__ */ t.jsx("span", { className: "text-sm font-normal text-muted-foreground", children: "No filters applied" })
             ] })
           ] }),
           f && /* @__PURE__ */ t.jsxs(
             "div",
             {
-              className: d(
+              className: c(
                 "z-50 shadow-lg",
                 "absolute top-full left-0 mt-1",
                 "flex flex-row gap-2",
@@ -294,11 +291,11 @@ const $ = j(
               ),
               children: [
                 /* @__PURE__ */ t.jsx(
-                  V,
+                  A,
                   {
                     items: U,
                     activeItemId: v,
-                    onItemClick: N
+                    onItemClick: w
                   }
                 ),
                 /* @__PURE__ */ t.jsx("div", { className: "flex flex-col gap-4 p-6 bg-popover w-[448px] h-full rounded-md overflow-y-auto", children: H() })
@@ -313,6 +310,6 @@ const $ = j(
 $.displayName = "FilterDropdown";
 export {
   $ as FilterDropdown,
-  V as FilterMenu,
-  A as FilterMenuItem
+  A as FilterMenu,
+  M as FilterMenuItem
 };