@yuno-payments/dashboard-design-system 2.0.16 → 2.1.0

package/dist/components/atoms/checkbox/checkbox.js

@@ -1,9 +1,9 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as g, useId as v } from "react";
-import { Checkbox as C } from "../../../vendor/shadcn/checkbox.js";
-import { cn as m } from "../../../lib/utils.js";
-import { Label as j } from "../label/label.js";
-const k = g(
+import { forwardRef as g, useId as C } from "react";
+import { Checkbox as j } from "../../../vendor/shadcn/checkbox.js";
+import { cn as x } from "../../../lib/utils.js";
+import { Label as k } from "../label/label.js";
+const v = g(
   ({
     label: n,
     description: c,
@@ -15,7 +15,7 @@ const k = g(
     info: l,
     ...p
   }, h) => {
-    const u = v(), o = i || t || u, d = (r) => {
+    const u = C(), o = i || t || u, d = (r) => {
       if (!a) return;
       a({
         target: {
@@ -35,8 +35,8 @@ const k = g(
         stopPropagation: () => {
         }
       });
-    }, x = /* @__PURE__ */ e.jsx(
-      C,
+    }, m = /* @__PURE__ */ e.jsx(
+      j,
       {
         ref: h,
         id: o,
@@ -47,15 +47,15 @@ const k = g(
         className: "size-3.5 cursor-pointer"
       }
     );
-    return n ? /* @__PURE__ */ e.jsxs("div", { className: "flex items-start gap-2 rtl:flex-row-reverse", children: [
-      x,
+    return n ? /* @__PURE__ */ e.jsxs("div", { className: "flex items-start gap-2", children: [
+      m,
       /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-1.5", children: [
         /* @__PURE__ */ e.jsx(
-          j,
+          k,
           {
             htmlFor: o,
             info: l,
-            className: m(
+            className: x(
               "text-sm leading-none cursor-pointer",
               s && "text-muted-foreground",
               f
@@ -66,7 +66,7 @@ const k = g(
         c && /* @__PURE__ */ e.jsx(
           "p",
           {
-            className: m(
+            className: x(
               "text-sm text-muted-foreground",
               s && "opacity-50"
             ),
@@ -74,10 +74,10 @@ const k = g(
           }
         )
       ] })
-    ] }) : x;
+    ] }) : m;
   }
 );
-k.displayName = "Checkbox";
+v.displayName = "Checkbox";
 export {
-  k as Checkbox
+  v as Checkbox
 };

package/dist/components/atoms/filter/filter-date-range.d.ts

@@ -1,6 +1,5 @@
 import { ComponentProps, ReactNode } from 'react';
 import { RadioGroup } from '../../../vendor/shadcn/radio-group';
-import { FilterLanguage, FilterTranslations } from './filter-translations';
 export declare const FilterDateRangeValue: {
     readonly CUSTOM: "CUSTOM";
     readonly TODAY: "TODAY";
@@ -17,21 +16,6 @@ interface FilterDateRangeOptionProps extends ComponentProps<"label"> {
     value: string;
 }
 declare const FilterDateRangeOption: import('react').ForwardRefExoticComponent<Omit<FilterDateRangeOptionProps, "ref"> & import('react').RefAttributes<HTMLLabelElement>>;
-/**
- * Labels for date range filter options - allows i18n/translation support
- * @deprecated Use `lang` prop or `translations` prop instead
- */
-interface FilterDateRangeLabels {
-    custom?: string;
-    today?: string;
-    last3Days?: string;
-    last7Days?: string;
-    last30Days?: string;
-    thisMonth?: string;
-    allTime?: string;
-    startDate?: string;
-    endDate?: string;
-}
 interface FilterDateRangeProps extends ComponentProps<typeof RadioGroup> {
     showCustomFields?: boolean;
     onCustomFieldsChange?: (show: boolean) => void;
@@ -51,20 +35,6 @@ interface FilterDateRangeProps extends ComponentProps<typeof RadioGroup> {
      * Announcement text to display at the top of the filter (e.g., timezone info)
      */
     announcement?: ReactNode;
-    /**
-     * Labels for date preset options - enables i18n/translation support.
-     * @deprecated Use `lang` prop or `translations` prop instead
-     */
-    labels?: FilterDateRangeLabels;
-    /**
-     * Language code for translations
-     * @default "en"
-     */
-    lang?: FilterLanguage;
-    /**
-     * Custom translations (overrides lang-based translations)
-     */
-    translations?: FilterTranslations;
 }
 declare const FilterDateRange: import('react').ForwardRefExoticComponent<Omit<FilterDateRangeProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export { FilterDateRange, FilterDateRangeOption, type FilterDateRangeProps, type FilterDateRangeOptionProps, type FilterDateRangeLabels, };
+export { FilterDateRange, FilterDateRangeOption, type FilterDateRangeProps, type FilterDateRangeOptionProps, };

package/dist/components/atoms/filter/filter-date-range.js

@@ -1,12 +1,11 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as L, useMemo as u } from "react";
-import { RadioGroup as U, RadioGroupItem as k } from "../../../vendor/shadcn/radio-group.js";
-import { cn as O } from "../../../lib/utils.js";
-import { getFilterTranslations as E, getDayNames as G, getMonthAbbreviations as V } from "./filter-translations.js";
-import { Alert as q } from "../alert/alert.js";
-import { DatePicker as A } from "../date-picker/date-picker.js";
-import { TimePicker as w } from "../time-picker/time-picker.js";
-const c = {
+import { forwardRef as N, useMemo as b } from "react";
+import { RadioGroup as H, RadioGroupItem as R } from "../../../vendor/shadcn/radio-group.js";
+import { cn as j } from "../../../lib/utils.js";
+import { Alert as C } from "../alert/alert.js";
+import { DatePicker as h } from "../date-picker/date-picker.js";
+import { TimePicker as y } from "../time-picker/time-picker.js";
+const n = {
   CUSTOM: "CUSTOM",
   TODAY: "TODAY",
   LAST_3_DAYS: "LAST_3_DAYS",
@@ -14,45 +13,71 @@ const c = {
   LAST_30_DAYS: "LAST_30_DAYS",
   THIS_MONTH: "THIS_MONTH",
   ALL_TIME: "ALL_TIME"
-}, D = (l, t) => {
-  const s = l.getDate();
-  return `${t[l.getMonth()]} ${s}`;
-}, z = (l, t) => {
-  const s = t[l.getMonth()], i = l.getFullYear();
-  return `${s} ${i}`;
-}, B = (l, t) => t[l.getDay()], J = (l, t) => {
+}, i = (s) => {
+  const t = s.getDate();
+  return `${[
+    "Jan",
+    "Feb",
+    "Mar",
+    "Apr",
+    "May",
+    "Jun",
+    "Jul",
+    "Aug",
+    "Sep",
+    "Oct",
+    "Nov",
+    "Dec"
+  ][s.getMonth()]} ${t}`;
+}, F = (s) => {
+  const a = [
+    "Jan",
+    "Feb",
+    "Mar",
+    "Apr",
+    "May",
+    "Jun",
+    "Jul",
+    "Aug",
+    "Sep",
+    "Oct",
+    "Nov",
+    "Dec"
+  ][s.getMonth()], o = s.getFullYear();
+  return `${a} ${o}`;
+}, I = (s) => ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"][s.getDay()], J = () => {
   const s = /* @__PURE__ */ new Date();
   s.setHours(0, 0, 0, 0);
-  const i = `${B(s, l)}, ${D(s, t)}`, x = new Date(s);
-  x.setDate(x.getDate() - 2);
-  const f = `${D(x, t)} - ${D(s, t)}`, o = new Date(s);
-  o.setDate(o.getDate() - 6);
-  const p = `${D(o, t)} - ${D(s, t)}`, m = new Date(s);
-  m.setDate(m.getDate() - 29);
-  const y = `${D(m, t)} - ${D(s, t)}`, j = z(s, t);
+  const t = `${I(s)}, ${i(s)}`, a = new Date(s);
+  a.setDate(a.getDate() - 2);
+  const o = `${i(a)} - ${i(s)}`, c = new Date(s);
+  c.setDate(c.getDate() - 6);
+  const m = `${i(c)} - ${i(s)}`, l = new Date(s);
+  l.setDate(l.getDate() - 29);
+  const x = `${i(l)} - ${i(s)}`, D = F(s);
   return {
-    today: i,
-    last3Days: f,
-    last7Days: p,
-    last30Days: y,
-    thisMonth: j
+    today: t,
+    last3Days: o,
+    last7Days: m,
+    last30Days: x,
+    thisMonth: D
   };
-}, d = L(
-  ({ label: l, description: t, value: s, className: i, ...x }, f) => {
-    const o = `date-range-${s}`;
+}, r = N(
+  ({ label: s, description: t, value: a, className: o, ...c }, m) => {
+    const l = `date-range-${a}`;
     return /* @__PURE__ */ e.jsxs("div", { className: "flex items-start gap-4 w-full py-1", children: [
       /* @__PURE__ */ e.jsxs(
         "label",
         {
-          ref: f,
-          className: O(
-            "flex-1 flex items-start gap-3 cursor-pointer rtl:flex-row-reverse",
-            i
+          ref: m,
+          className: j(
+            "flex-1 flex items-start gap-3 cursor-pointer",
+            o
           ),
-          ...x,
+          ...c,
           children: [
-            /* @__PURE__ */ e.jsx(k, { id: o, value: s, className: "mt-px" }),
-            /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-1.5 items-start justify-center pb-0 pt-px px-0", children: /* @__PURE__ */ e.jsx("span", { className: "text-sm font-medium leading-none text-foreground", children: l }) })
+            /* @__PURE__ */ e.jsx(R, { id: l, value: a, className: "mt-px" }),
+            /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-1.5 items-start justify-center pb-0 pt-px px-0", children: /* @__PURE__ */ e.jsx("span", { className: "text-sm font-medium leading-none text-foreground", children: s }) })
           ]
         }
       ),
@@ -60,97 +85,82 @@ const c = {
     ] });
   }
 );
-d.displayName = "FilterDateRangeOption";
-const K = L(
+r.displayName = "FilterDateRangeOption";
+const P = N(
   ({
-    showCustomFields: l = !1,
+    showCustomFields: s = !1,
     onCustomFieldsChange: t,
-    startDate: s,
-    endDate: i,
-    startTime: x = "",
-    endTime: f = "",
-    onStartDateChange: o,
-    onEndDateChange: p,
-    onStartTimeChange: m,
-    onEndTimeChange: y,
-    mode: j = "range",
-    singleDayLabel: Y,
-    showAllTime: $ = !1,
-    className: H,
-    value: R,
-    onValueChange: C,
-    announcement: h,
-    labels: n,
-    lang: v,
-    translations: T,
-    ...F
-  }, I) => {
-    const a = u(() => {
-      const r = E(v);
-      return T ? { ...r, ...T } : r;
-    }, [v, T]), S = u(() => G(a), [a]), _ = u(() => V(a), [a]), g = u(
-      () => J(S, _),
-      [S, _]
-    ), b = (r) => {
-      C?.(r), t?.(r === c.CUSTOM);
-    }, P = (r) => {
-      if (r) {
-        const N = new Date(r);
-        N.setHours(0, 0, 0, 0);
-        const M = new Date(r);
-        M.setHours(23, 59, 59, 999), o?.(N), p?.(M);
+    startDate: a,
+    endDate: o,
+    startTime: c = "",
+    endTime: m = "",
+    onStartDateChange: l,
+    onEndDateChange: x,
+    onStartTimeChange: D,
+    onEndTimeChange: A,
+    mode: S = "range",
+    singleDayLabel: T = "Select date",
+    showAllTime: v = !1,
+    className: _,
+    value: M,
+    onValueChange: L,
+    announcement: f,
+    ...w
+  }, O) => {
+    const p = b(() => J(), []), Y = (d) => {
+      L?.(d), t?.(d === n.CUSTOM);
+    }, $ = (d) => {
+      if (d) {
+        const u = new Date(d);
+        u.setHours(0, 0, 0, 0);
+        const g = new Date(d);
+        g.setHours(23, 59, 59, 999), l?.(u), x?.(g);
       } else
-        o?.(void 0), p?.(void 0);
+        l?.(void 0), x?.(void 0);
     };
     return /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: I,
-        className: O("flex flex-col gap-4 w-full", H),
+        ref: O,
+        className: j("flex flex-col gap-4 w-full", _),
         children: [
-          h && (typeof h == "string" ? /* @__PURE__ */ e.jsx(q, { icon: "Info", description: h }) : h),
+          f && (typeof f == "string" ? /* @__PURE__ */ e.jsx(C, { icon: "Info", description: f }) : f),
           /* @__PURE__ */ e.jsxs(
-            U,
+            H,
             {
-              value: R,
-              onValueChange: b,
+              value: M,
+              onValueChange: Y,
               className: "gap-2",
-              ...F,
+              ...w,
               children: [
-                /* @__PURE__ */ e.jsx(
-                  d,
-                  {
-                    label: n?.custom ?? a.custom,
-                    value: c.CUSTOM
-                  }
-                ),
-                l && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-4 ps-7 mb-2", children: [
-                  j === "single" ? /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
-                    A,
+                /* @__PURE__ */ e.jsx(r, { label: "Custom", value: n.CUSTOM }),
+                s && /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-4 pl-7 mb-2", children: [
+                  S === "single" ? /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
+                    h,
                     {
-                      date: s,
-                      onChange: P,
-                      placeholder: Y ?? a.selectDate,
+                      date: a,
+                      onChange: $,
+                      placeholder: T,
                       className: "h-9",
                       iconPosition: "none"
                     }
                   ) }) : /* @__PURE__ */ e.jsxs("div", { className: "flex gap-4 items-start w-full", children: [
                     /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
-                      A,
+                      h,
                       {
-                        date: s,
-                        onChange: o,
-                        placeholder: n?.startDate ?? a.startDate,
+                        date: a,
+                        onChange: l,
+                        placeholder: "Start date",
                         className: "h-9",
                         iconPosition: "none"
                       }
                     ) }),
                     /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
-                      A,
+                      h,
                       {
-                        date: i,
-                        onChange: p,
-                        placeholder: n?.endDate ?? a.endDate,
+                        date: o,
+                        onChange: x,
+                        placeholder: "End date",
                         className: "h-9",
                         iconPosition: "none"
                       }
@@ -158,20 +168,20 @@ const K = L(
                   ] }),
                   /* @__PURE__ */ e.jsxs("div", { className: "flex gap-4 items-start w-full", children: [
                     /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
-                      w,
+                      y,
                       {
-                        value: x,
-                        onChange: m,
+                        value: c,
+                        onChange: D,
                         mode: "dropdown",
                         use24Hour: !0,
                         width: "100%"
                       }
                     ) }),
                     /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
-                      w,
+                      y,
                       {
-                        value: f,
-                        onChange: y,
+                        value: m,
+                        onChange: A,
                         mode: "dropdown",
                         use24Hour: !0,
                         width: "100%"
@@ -181,52 +191,46 @@ const K = L(
                 ] }),
                 /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2", children: [
                   /* @__PURE__ */ e.jsx(
-                    d,
+                    r,
                     {
-                      label: n?.today ?? a.today,
-                      value: c.TODAY,
-                      description: g.today
+                      label: "Today",
+                      value: n.TODAY,
+                      description: p.today
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    d,
+                    r,
                     {
-                      label: n?.last3Days ?? a.last3Days,
-                      value: c.LAST_3_DAYS,
-                      description: g.last3Days
+                      label: "Last 3 days",
+                      value: n.LAST_3_DAYS,
+                      description: p.last3Days
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    d,
+                    r,
                     {
-                      label: n?.last7Days ?? a.last7Days,
-                      value: c.LAST_7_DAYS,
-                      description: g.last7Days
+                      label: "Last 7 days",
+                      value: n.LAST_7_DAYS,
+                      description: p.last7Days
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    d,
+                    r,
                     {
-                      label: n?.last30Days ?? a.last30Days,
-                      value: c.LAST_30_DAYS,
-                      description: g.last30Days
+                      label: "Last 30 days",
+                      value: n.LAST_30_DAYS,
+                      description: p.last30Days
                     }
                   ),
                   /* @__PURE__ */ e.jsx(
-                    d,
+                    r,
                     {
-                      label: n?.thisMonth ?? a.thisMonth,
-                      value: c.THIS_MONTH,
-                      description: g.thisMonth
+                      label: "This month",
+                      value: n.THIS_MONTH,
+                      description: p.thisMonth
                     }
                   ),
-                  $ && /* @__PURE__ */ e.jsx(
-                    d,
-                    {
-                      label: n?.allTime ?? a.allTime,
-                      value: c.ALL_TIME
-                    }
-                  )
+                  v && /* @__PURE__ */ e.jsx(r, { label: "All time", value: n.ALL_TIME })
                 ] })
               ]
             }
@@ -236,9 +240,9 @@ const K = L(
     );
   }
 );
-K.displayName = "FilterDateRange";
+P.displayName = "FilterDateRange";
 export {
-  K as FilterDateRange,
-  d as FilterDateRangeOption,
-  c as FilterDateRangeValue
+  P as FilterDateRange,
+  r as FilterDateRangeOption,
+  n as FilterDateRangeValue
 };

package/dist/components/atoms/filter/filter-multi-input.d.ts

@@ -1,4 +1,3 @@
-import { FilterLanguage, FilterTranslations } from './filter-translations';
 /**
  * Props for FilterMultiInput component
  */
@@ -50,15 +49,6 @@ export interface FilterMultiInputProps {
      * @default false
      */
     allowDuplicates?: boolean;
-    /**
-     * Language code for translations
-     * @default "en"
-     */
-    lang?: FilterLanguage;
-    /**
-     * Custom translations (overrides lang-based translations)
-     */
-    translations?: FilterTranslations;
 }
 /**
  * Filter section component for entering multiple values via an input field.
@@ -72,7 +62,6 @@ export interface FilterMultiInputProps {
  *   onChange={setSelectedBins}
  *   placeholder="Enter BIN(s) separated by comma"
  *   numericOnly
- *   lang="es"
  * />
  * ```
  */

package/dist/components/atoms/filter/filter-multi-input.js

@@ -1,56 +1,50 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as h, useMemo as N } from "react";
-import { cn as y } from "../../../lib/utils.js";
-import { Separator as g } from "../../../vendor/shadcn/separator.js";
-import { getFilterTranslations as v } from "./filter-translations.js";
-import { MultiValuesField as w } from "../multi-values-field/multi-values-field.js";
-const A = h(
+import { forwardRef as x } from "react";
+import { cn as j } from "../../../lib/utils.js";
+import { Separator as b } from "../../../vendor/shadcn/separator.js";
+import { MultiValuesField as h } from "../multi-values-field/multi-values-field.js";
+const v = x(
   ({
-    title: a,
-    value: s,
-    onChange: o,
-    placeholder: m,
-    description: n,
-    error: f,
-    numericOnly: d = !1,
-    maxItems: c,
-    disabled: p = !1,
-    className: u,
-    allowDuplicates: x = !1,
-    lang: i,
-    translations: r
-  }, j) => {
-    const l = N(() => {
-      const t = v(i);
-      return r ? { ...t, ...r } : t;
-    }, [i, r]), b = d ? (t) => /^\d+$/.test(t) ? !0 : l.onlyNumericAllowed : void 0;
-    return /* @__PURE__ */ e.jsxs("div", { ref: j, className: y("flex flex-col h-full", u), children: [
-      /* @__PURE__ */ e.jsx("div", { className: "flex items-center justify-between mb-1", children: /* @__PURE__ */ e.jsx("span", { className: "text-sm font-normal text-foreground", children: a }) }),
-      /* @__PURE__ */ e.jsx(g, { className: "w-full mb-6" }),
+    title: t,
+    value: l,
+    onChange: r,
+    placeholder: s = "Type and press Enter...",
+    description: a,
+    error: i,
+    numericOnly: o = !1,
+    maxItems: m,
+    disabled: n = !1,
+    className: f,
+    allowDuplicates: d = !1
+  }, u) => {
+    const c = o ? (p) => /^\d+$/.test(p) ? !0 : "Only numeric values are allowed" : void 0;
+    return /* @__PURE__ */ e.jsxs("div", { ref: u, className: j("flex flex-col h-full", f), children: [
+      /* @__PURE__ */ e.jsx("div", { className: "flex items-center justify-between mb-1", children: /* @__PURE__ */ e.jsx("span", { className: "text-sm font-normal text-foreground", children: t }) }),
+      /* @__PURE__ */ e.jsx(b, { className: "w-full mb-6" }),
       /* @__PURE__ */ e.jsx(
-        w,
+        h,
         {
-          value: s,
-          onChange: o,
-          placeholder: m ?? l.typeAndPressEnter,
-          description: n,
-          error: f,
-          disabled: p,
-          maxItems: c,
-          allowDuplicates: x,
-          validate: b,
+          value: l,
+          onChange: r,
+          placeholder: s,
+          description: a,
+          error: i,
+          disabled: n,
+          maxItems: m,
+          allowDuplicates: d,
+          validate: c,
           triggerKeys: ["Enter", "Tab", "Comma"],
-          deleteAll: s.length > 0 ? {
-            label: l.clearAll,
+          deleteAll: l.length > 0 ? {
+            label: "Clear all",
             length: 1,
-            onClick: () => o([])
+            onClick: () => r([])
           } : void 0
         }
       )
     ] });
   }
 );
-A.displayName = "FilterMultiInput";
+v.displayName = "FilterMultiInput";
 export {
-  A as FilterMultiInput
+  v as FilterMultiInput
 };