@yuno-payments/dashboard-design-system 2.4.2-rtl.7 → 2.4.2-rtl.8

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

@@ -1,10 +1,10 @@
 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 "../../atoms/alert/alert.js";
-import { DatePicker as A } from "../../atoms/date-picker/date-picker.js";
+import { RadioGroup as k, RadioGroupItem as E } from "../../../vendor/shadcn/radio-group.js";
+import { cn as O, getDirection as Y } from "../../../lib/utils.js";
+import { getFilterTranslations as G, getDayNames as V, getMonthAbbreviations as q } from "./filter-translations.js";
+import { Alert as z } from "../../atoms/alert/alert.js";
+import { DatePicker as v } from "../../atoms/date-picker/date-picker.js";
 import { TimePicker as w } from "../../molecules/time-picker/time-picker.js";
 const c = {
   CUSTOM: "CUSTOM",
@@ -14,44 +14,45 @@ const c = {
   LAST_30_DAYS: "LAST_30_DAYS",
   THIS_MONTH: "THIS_MONTH",
   ALL_TIME: "ALL_TIME"
-}, D = (l, t) => {
+}, f = (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) => {
+}, B = (l, t) => {
+  const s = t[l.getMonth()], r = l.getFullYear();
+  return `${s} ${r}`;
+}, J = (l, t) => t[l.getDay()], K = (l, t) => {
   const s = /* @__PURE__ */ new Date();
   s.setHours(0, 0, 0, 0);
-  const i = `${B(s, l)}, ${D(s, t)}`, x = new Date(s);
+  const r = `${J(s, l)}, ${f(s, t)}`, x = new Date(s);
   x.setDate(x.getDate() - 2);
-  const f = `${D(x, t)} - ${D(s, t)}`, o = new Date(s);
+  const p = `${f(x, t)} - ${f(s, t)}`, o = new Date(s);
   o.setDate(o.getDate() - 6);
-  const p = `${D(o, t)} - ${D(s, t)}`, m = new Date(s);
+  const D = `${f(o, t)} - ${f(s, t)}`, m = new Date(s);
   m.setDate(m.getDate() - 29);
-  const y = `${D(m, t)} - ${D(s, t)}`, j = z(s, t);
+  const y = `${f(m, t)} - ${f(s, t)}`, j = B(s, t);
   return {
-    today: i,
-    last3Days: f,
-    last7Days: p,
+    today: r,
+    last3Days: p,
+    last7Days: D,
     last30Days: y,
     thisMonth: j
   };
 }, d = L(
-  ({ label: l, description: t, value: s, className: i, ...x }, f) => {
-    const o = `date-range-${s}`;
+  ({ label: l, description: t, value: s, className: r, ...x }, p) => {
+    const o = `date-range-${s}`, D = Y() === "rtl";
     return /* @__PURE__ */ e.jsxs("div", { className: "flex items-start gap-4 w-full py-1", children: [
       /* @__PURE__ */ e.jsxs(
         "label",
         {
-          ref: f,
+          ref: p,
           className: O(
-            "flex-1 flex items-start gap-3 cursor-pointer rtl:flex-row-reverse",
-            i
+            "flex-1 flex items-start gap-3 cursor-pointer",
+            D && "flex-row-reverse",
+            r
           ),
           ...x,
           children: [
-            /* @__PURE__ */ e.jsx(k, { id: o, value: s, className: "mt-px" }),
+            /* @__PURE__ */ e.jsx(E, { 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 }) })
           ]
         }
@@ -61,61 +62,62 @@ const c = {
   }
 );
 d.displayName = "FilterDateRangeOption";
-const K = L(
+const Q = L(
   ({
     showCustomFields: l = !1,
     onCustomFieldsChange: t,
     startDate: s,
-    endDate: i,
+    endDate: r,
     startTime: x = "",
-    endTime: f = "",
+    endTime: p = "",
     onStartDateChange: o,
-    onEndDateChange: p,
+    onEndDateChange: D,
     onStartTimeChange: m,
     onEndTimeChange: y,
     mode: j = "range",
-    singleDayLabel: Y,
-    showAllTime: $ = !1,
-    className: H,
-    value: R,
-    onValueChange: C,
+    singleDayLabel: $,
+    showAllTime: H = !1,
+    className: R,
+    value: C,
+    onValueChange: F,
     announcement: h,
     labels: n,
-    lang: v,
-    translations: T,
-    ...F
-  }, I) => {
+    lang: T,
+    translations: A,
+    ...I
+  }, b) => {
     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, _),
+      const i = G(T);
+      return A ? { ...i, ...A } : i;
+    }, [T, A]), S = u(() => V(a), [a]), _ = u(() => q(a), [a]), g = u(
+      () => K(S, _),
       [S, _]
-    ), b = (r) => {
-      C?.(r), t?.(r === c.CUSTOM);
-    }, P = (r) => {
-      if (r) {
-        const N = new Date(r);
+    ), P = (i) => {
+      F?.(i), t?.(i === c.CUSTOM);
+    }, U = (i) => {
+      if (i) {
+        const N = new Date(i);
         N.setHours(0, 0, 0, 0);
-        const M = new Date(r);
-        M.setHours(23, 59, 59, 999), o?.(N), p?.(M);
+        const M = new Date(i);
+        M.setHours(23, 59, 59, 999), o?.(N), D?.(M);
       } else
-        o?.(void 0), p?.(void 0);
+        o?.(void 0), D?.(void 0);
     };
     return /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: I,
-        className: O("flex flex-col gap-4 w-full", H),
+        ref: b,
+        dir: Y(T),
+        className: O("flex flex-col gap-4 w-full", R),
         children: [
-          h && (typeof h == "string" ? /* @__PURE__ */ e.jsx(q, { icon: "Info", description: h }) : h),
+          h && (typeof h == "string" ? /* @__PURE__ */ e.jsx(z, { icon: "Info", description: h }) : h),
           /* @__PURE__ */ e.jsxs(
-            U,
+            k,
             {
-              value: R,
-              onValueChange: b,
+              value: C,
+              onValueChange: P,
               className: "gap-2",
-              ...F,
+              ...I,
               children: [
                 /* @__PURE__ */ e.jsx(
                   d,
@@ -126,17 +128,17 @@ const K = L(
                 ),
                 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,
+                    v,
                     {
                       date: s,
-                      onChange: P,
-                      placeholder: Y ?? a.selectDate,
+                      onChange: U,
+                      placeholder: $ ?? a.selectDate,
                       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,
+                      v,
                       {
                         date: s,
                         onChange: o,
@@ -146,10 +148,10 @@ const K = L(
                       }
                     ) }),
                     /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
-                      A,
+                      v,
                       {
-                        date: i,
-                        onChange: p,
+                        date: r,
+                        onChange: D,
                         placeholder: n?.endDate ?? a.endDate,
                         className: "h-9",
                         iconPosition: "none"
@@ -170,7 +172,7 @@ const K = L(
                     /* @__PURE__ */ e.jsx("div", { className: "flex-1 flex flex-col gap-3", children: /* @__PURE__ */ e.jsx(
                       w,
                       {
-                        value: f,
+                        value: p,
                         onChange: y,
                         mode: "dropdown",
                         use24Hour: !0,
@@ -220,7 +222,7 @@ const K = L(
                       description: g.thisMonth
                     }
                   ),
-                  $ && /* @__PURE__ */ e.jsx(
+                  H && /* @__PURE__ */ e.jsx(
                     d,
                     {
                       label: n?.allTime ?? a.allTime,
@@ -236,9 +238,9 @@ const K = L(
     );
   }
 );
-K.displayName = "FilterDateRange";
+Q.displayName = "FilterDateRange";
 export {
-  K as FilterDateRange,
+  Q as FilterDateRange,
   d as FilterDateRangeOption,
   c as FilterDateRangeValue
 };

package/dist/components/organisms/filter/filter.js

@@ -1,23 +1,23 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { forwardRef as v, useMemo as k, useState as Q } from "react";
+import { forwardRef as y, useMemo as k, useState as Q } from "react";
 import { Button as w } from "../../../vendor/shadcn/button.js";
-import { Badge as I } from "../../../vendor/shadcn/badge.js";
-import { Separator as S } from "../../../vendor/shadcn/separator.js";
+import { Badge as z } from "../../../vendor/shadcn/badge.js";
+import { Separator as R } from "../../../vendor/shadcn/separator.js";
 import { Checkbox as U } from "../../../vendor/shadcn/checkbox.js";
 import { RadioGroupItem as X, RadioGroup as q } from "../../../vendor/shadcn/radio-group.js";
-import { Icon as R } from "../../atoms/icon/icon.js";
-import { cn as y, getDirection as z } from "../../../lib/utils.js";
-import { getFilterTranslations as T, formatMoreFilters as H } from "./filter-translations.js";
+import { Icon as T } from "../../atoms/icon/icon.js";
+import { cn as b, getDirection as S } from "../../../lib/utils.js";
+import { getFilterTranslations as I, formatMoreFilters as H } from "./filter-translations.js";
 import { DEFAULT_FILTER_TRANSLATIONS as xe, FILTER_TRANSLATIONS as ue } from "./filter-translations.js";
 import { Tooltip as V } from "../../atoms/tooltip/tooltip.js";
 import { Field as A } from "../../molecules/field/field.js";
-const L = v(
+const L = y(
   ({ label: s, onRemove: l, className: n, ...a }, r) => /* @__PURE__ */ e.jsxs(
-    I,
+    z,
     {
       ref: r,
       variant: "secondary",
-      className: y("h-8 gap-2 px-3 py-2 shadow-xs", n),
+      className: b("h-8 gap-2 px-3 py-2 shadow-xs", n),
       ...a,
       children: [
         /* @__PURE__ */ e.jsx("span", { className: "text-xs font-medium leading-none", children: s }),
@@ -27,7 +27,7 @@ const L = v(
             onClick: l,
             className: "inline-flex items-center justify-center",
             "aria-label": `Remove ${s} filter`,
-            children: /* @__PURE__ */ e.jsx(R, { name: "X", className: "size-4" })
+            children: /* @__PURE__ */ e.jsx(T, { name: "X", className: "size-4" })
           }
         )
       ]
@@ -35,48 +35,48 @@ const L = v(
   )
 );
 L.displayName = "FilterTag";
-const J = v(
+const J = y(
   ({
     appliedFilters: s = [],
     onRemoveFilter: l,
     onClearAll: n,
     maxVisibleTags: a = 4,
     className: r,
-    lang: m,
-    translations: c,
+    lang: c,
+    translations: o,
     ...d
-  }, b) => {
+  }, j) => {
     const f = k(() => {
-      const o = T(m);
-      return c ? { ...o, ...c } : o;
-    }, [m, c]), x = s.length > 0, F = s.slice(0, a), N = s.length - a;
+      const m = I(c);
+      return o ? { ...m, ...o } : m;
+    }, [c, o]), x = s.length > 0, F = s.slice(0, a), p = s.length - a;
     return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-4", children: [
       /* @__PURE__ */ e.jsxs(
         w,
         {
-          ref: b,
+          ref: j,
           variant: "outline",
           size: "sm",
-          className: y("h-8 gap-2 px-3 py-2", r),
+          className: b("h-8 gap-2 px-3 py-2", r),
           ...d,
           children: [
-            /* @__PURE__ */ e.jsx(R, { name: "FunnelSimple", className: "size-4" }),
+            /* @__PURE__ */ e.jsx(T, { name: "FunnelSimple", className: "size-4" }),
             /* @__PURE__ */ e.jsx("span", { className: "text-xs font-medium leading-none", children: f.addFilter })
           ]
         }
       ),
       x && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        /* @__PURE__ */ e.jsx(S, { orientation: "vertical", className: "h-5" }),
+        /* @__PURE__ */ e.jsx(R, { orientation: "vertical", className: "h-5" }),
         /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-2", children: [
-          F.map((o) => /* @__PURE__ */ e.jsx(
+          F.map((m) => /* @__PURE__ */ e.jsx(
             L,
             {
-              label: o.label,
-              onRemove: () => l?.(o.id)
+              label: m.label,
+              onRemove: () => l?.(m.id)
             },
-            o.id
+            m.id
           )),
-          N > 0 && /* @__PURE__ */ e.jsx(I, { variant: "default", className: "h-8 px-3 py-2 shadow-xs", children: /* @__PURE__ */ e.jsx("span", { className: "text-xs font-medium leading-none", children: H(f, N) }) }),
+          p > 0 && /* @__PURE__ */ e.jsx(z, { variant: "default", className: "h-8 px-3 py-2 shadow-xs", children: /* @__PURE__ */ e.jsx("span", { className: "text-xs font-medium leading-none", children: H(f, p) }) }),
           n && /* @__PURE__ */ e.jsx(
             w,
             {
@@ -90,44 +90,44 @@ const J = v(
         ] })
       ] }),
       !x && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-        /* @__PURE__ */ e.jsx(S, { orientation: "vertical", className: "h-5" }),
+        /* @__PURE__ */ e.jsx(R, { orientation: "vertical", className: "h-5" }),
         /* @__PURE__ */ e.jsx("span", { className: "text-sm font-normal text-muted-foreground", children: f.noFiltersApplied })
       ] })
     ] });
   }
 );
 J.displayName = "FilterButton";
-const K = v(
+const K = y(
   (s, l) => {
     const {
       title: n,
       items: a,
       className: r,
-      searchable: m = !1,
-      searchPlaceholder: c,
+      searchable: c = !1,
+      searchPlaceholder: o,
       showActions: d = !1,
-      enableSelectAll: b = !0,
+      enableSelectAll: j = !0,
       enableInverse: f = !0,
       enableNone: x = !0,
       description: F,
-      lang: N,
-      translations: o
+      lang: p,
+      translations: m
     } = s, C = k(() => {
-      const t = T(N);
-      return o ? { ...t, ...o } : t;
-    }, [N, o]), g = s.type || "checkbox", P = g === "radio", B = g === "checkbox" || !s.type, [j, G] = Q(""), p = k(() => j ? a.filter(
-      (t) => t.label.toLowerCase().includes(j.toLowerCase())
-    ) : a, [a, j]), M = () => {
+      const t = I(p);
+      return m ? { ...t, ...m } : t;
+    }, [p, m]), g = s.type || "checkbox", P = g === "radio", B = g === "checkbox" || !s.type, [N, G] = Q(""), v = k(() => N ? a.filter(
+      (t) => t.label.toLowerCase().includes(N.toLowerCase())
+    ) : a, [a, N]), M = () => {
       if (g === "checkbox" && "selectedValues" in s) {
-        const t = p.map((u) => u.value), i = j ? [.../* @__PURE__ */ new Set([...s.selectedValues, ...t])] : t;
+        const t = v.map((u) => u.value), i = N ? [.../* @__PURE__ */ new Set([...s.selectedValues, ...t])] : t;
         s.onChange(i);
       }
     }, _ = () => {
       if (g === "checkbox" && "selectedValues" in s)
-        if (j) {
-          const t = new Set(p.map((h) => h.value)), i = s.selectedValues.filter(
+        if (N) {
+          const t = new Set(v.map((h) => h.value)), i = s.selectedValues.filter(
             (h) => !t.has(h)
-          ), u = p.filter((h) => !s.selectedValues.includes(h.value)).map((h) => h.value);
+          ), u = v.filter((h) => !s.selectedValues.includes(h.value)).map((h) => h.value);
           s.onChange([...i, ...u]);
         } else {
           const t = a.filter((i) => !s.selectedValues.includes(i.value)).map((i) => i.value);
@@ -135,8 +135,8 @@ const K = v(
         }
     }, $ = () => {
       if (g === "checkbox" && "selectedValues" in s)
-        if (j) {
-          const t = new Set(p.map((u) => u.value)), i = s.selectedValues.filter(
+        if (N) {
+          const t = new Set(v.map((u) => u.value)), i = s.selectedValues.filter(
             (u) => !t.has(u)
           );
           s.onChange(i);
@@ -149,12 +149,12 @@ const K = v(
         s.onChange(u);
       }
     };
-    return /* @__PURE__ */ e.jsxs("div", { ref: l, dir: z(N), className: y("flex flex-col h-full", r), children: [
-      m && /* @__PURE__ */ e.jsx(
+    return /* @__PURE__ */ e.jsxs("div", { ref: l, dir: S(p), className: b("flex flex-col h-full", r), children: [
+      c && /* @__PURE__ */ e.jsx(
         A,
         {
-          placeholder: c ?? C.search,
-          value: j,
+          placeholder: o ?? C.search,
+          value: N,
           onChange: (t) => G(t.target.value),
           startIcon: "MagnifyingGlass",
           className: "mb-4"
@@ -164,7 +164,7 @@ const K = v(
       /* @__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 }),
         d && g === "checkbox" && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-end gap-4", children: [
-          b && /* @__PURE__ */ e.jsx(
+          j && /* @__PURE__ */ e.jsx(
             w,
             {
               variant: "link",
@@ -196,14 +196,14 @@ const K = v(
           )
         ] })
       ] }),
-      /* @__PURE__ */ e.jsx(S, { className: "w-full mb-6" }),
+      /* @__PURE__ */ e.jsx(R, { className: "w-full mb-6" }),
       P && "selectedValue" in s ? /* @__PURE__ */ e.jsx(
         q,
         {
           value: s.selectedValue,
           onValueChange: s.onChange,
           className: "grid grid-cols-2 gap-x-4 gap-y-5 overflow-y-auto",
-          children: p.map((t) => /* @__PURE__ */ e.jsx(
+          children: v.map((t) => /* @__PURE__ */ e.jsx(
             E,
             {
               label: t.label,
@@ -213,7 +213,7 @@ const K = v(
             t.value
           ))
         }
-      ) : B && "selectedValues" in s ? /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-2 gap-x-4 gap-y-5 overflow-y-auto", children: p.map((t) => /* @__PURE__ */ e.jsx(
+      ) : B && "selectedValues" in s ? /* @__PURE__ */ e.jsx("div", { className: "grid grid-cols-2 gap-x-4 gap-y-5 overflow-y-auto", children: v.map((t) => /* @__PURE__ */ e.jsx(
         O,
         {
           label: t.label,
@@ -228,70 +228,76 @@ const K = v(
   }
 );
 K.displayName = "FilterSection";
-const O = v(({ label: s, checked: l, onCheckedChange: n, description: a, className: r, icon: m }, c) => /* @__PURE__ */ e.jsxs("label", { className: y("flex items-start gap-2 cursor-pointer rtl:flex-row-reverse", r), children: [
-  /* @__PURE__ */ e.jsx(U, { ref: c, checked: l, onCheckedChange: n }),
-  m && /* @__PURE__ */ e.jsx(
-    "img",
-    {
-      src: m,
-      alt: "",
-      className: "size-4 object-contain shrink-0",
-      onError: (d) => {
-        d.currentTarget.style.display = "none";
-      }
-    }
-  ),
-  /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0 flex-1", children: [
-    /* @__PURE__ */ e.jsx(V, { content: s, triggerProps: { className: "w-fit" }, children: /* @__PURE__ */ e.jsx("p", { className: "text-sm font-medium leading-4 truncate max-w-[165px]", children: s }) }),
-    a && /* @__PURE__ */ e.jsx(V, { content: a, triggerProps: { className: "w-fit mt-2" }, children: /* @__PURE__ */ e.jsx("p", { className: "text-sm font-normal leading-5 text-muted-foreground truncate max-w-[165px]", children: a }) })
-  ] })
-] }));
-O.displayName = "FilterCheckboxOption";
-const E = v(
-  ({ label: s, value: l, description: n, className: a }, r) => /* @__PURE__ */ e.jsxs("div", { className: y("flex items-start gap-3 rtl:flex-row-reverse", a), children: [
-    /* @__PURE__ */ e.jsx(X, { ref: r, value: l, id: `radio-${l}` }),
-    /* @__PURE__ */ e.jsxs(
-      "label",
+const O = y(({ label: s, checked: l, onCheckedChange: n, description: a, className: r, icon: c }, o) => {
+  const d = S() === "rtl";
+  return /* @__PURE__ */ e.jsxs("label", { className: b("flex items-start gap-2 cursor-pointer", d && "flex-row-reverse", r), children: [
+    /* @__PURE__ */ e.jsx(U, { ref: o, checked: l, onCheckedChange: n }),
+    c && /* @__PURE__ */ e.jsx(
+      "img",
       {
-        htmlFor: `radio-${l}`,
-        className: "flex flex-col gap-0.5 cursor-pointer flex-1 truncate",
-        children: [
-          /* @__PURE__ */ e.jsx(V, { content: s, triggerProps: { className: "w-fit" }, children: /* @__PURE__ */ e.jsx("p", { className: "text-sm font-medium leading-4 truncate max-w-[165px]", children: s }) }),
-          n && /* @__PURE__ */ e.jsx(V, { content: n, triggerProps: { className: "w-fit mt-2" }, children: /* @__PURE__ */ e.jsx("p", { className: "w-fittext-sm font-normal leading-4 text-muted-foreground truncate max-w-[165px]", children: n }) })
-        ]
+        src: c,
+        alt: "",
+        className: "size-4 object-contain shrink-0",
+        onError: (j) => {
+          j.currentTarget.style.display = "none";
+        }
       }
-    )
-  ] })
+    ),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-0.5 min-w-0 flex-1", children: [
+      /* @__PURE__ */ e.jsx(V, { content: s, triggerProps: { className: "w-fit" }, children: /* @__PURE__ */ e.jsx("p", { className: "text-sm font-medium leading-4 truncate max-w-[165px]", children: s }) }),
+      a && /* @__PURE__ */ e.jsx(V, { content: a, triggerProps: { className: "w-fit mt-2" }, children: /* @__PURE__ */ e.jsx("p", { className: "text-sm font-normal leading-5 text-muted-foreground truncate max-w-[165px]", children: a }) })
+    ] })
+  ] });
+});
+O.displayName = "FilterCheckboxOption";
+const E = y(
+  ({ label: s, value: l, description: n, className: a }, r) => {
+    const c = S() === "rtl";
+    return /* @__PURE__ */ e.jsxs("div", { className: b("flex items-start gap-3", c && "flex-row-reverse", a), children: [
+      /* @__PURE__ */ e.jsx(X, { ref: r, value: l, id: `radio-${l}` }),
+      /* @__PURE__ */ e.jsxs(
+        "label",
+        {
+          htmlFor: `radio-${l}`,
+          className: "flex flex-col gap-0.5 cursor-pointer flex-1 truncate",
+          children: [
+            /* @__PURE__ */ e.jsx(V, { content: s, triggerProps: { className: "w-fit" }, children: /* @__PURE__ */ e.jsx("p", { className: "text-sm font-medium leading-4 truncate max-w-[165px]", children: s }) }),
+            n && /* @__PURE__ */ e.jsx(V, { content: n, triggerProps: { className: "w-fit mt-2" }, children: /* @__PURE__ */ e.jsx("p", { className: "w-fittext-sm font-normal leading-4 text-muted-foreground truncate max-w-[165px]", children: n }) })
+          ]
+        }
+      )
+    ] });
+  }
 );
 E.displayName = "FilterRadioOption";
-const W = v(
+const W = y(
   ({
     children: s,
     showSearch: l = !1,
     searchPlaceholder: n,
     searchValue: a,
     onSearchChange: r,
-    className: m,
-    lang: c,
+    className: c,
+    lang: o,
     translations: d
-  }, b) => {
+  }, j) => {
     const f = k(() => {
-      const x = T(c);
+      const x = I(o);
       return d ? { ...x, ...d } : x;
-    }, [c, d]);
+    }, [o, d]);
     return /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: b,
-        dir: z(c),
-        className: y(
+        ref: j,
+        dir: S(o),
+        className: b(
           "flex flex-col gap-6 bg-input rounded-md p-6 min-w-[448px]",
-          m
+          c
         ),
         children: [
           l && /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
             /* @__PURE__ */ e.jsx(
-              R,
+              T,
               {
                 name: "MagnifyingGlass",
                 className: "absolute start-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground"
@@ -324,5 +330,5 @@ export {
   K as FilterSection,
   L as FilterTag,
   H as formatMoreFilters,
-  T as getFilterTranslations
+  I as getFilterTranslations
 };