@yuno-payments/dashboard-design-system 0.0.133 → 0.0.135

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuno-payments/dashboard-design-system",
-  "version": "0.0.133",
+  "version": "0.0.135",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",