impact-nova 2.0.6 → 2.0.8

package/dist/components/ui/date-picker/month-range-picker.js

@@ -1,26 +1,26 @@
-import { jsxs as h, jsx as d } from "react/jsx-runtime";
-import * as p from "react";
+import { jsxs as h, jsx as i } from "react/jsx-runtime";
+import * as u from "react";
 import { Cross as ht, CalendarMonth as gt, Info as J } from "impact-nova-icons";
-import { isValid as M, parse as Y } from "date-fns";
-import { cn as g, padValidDateString as R, maskDate as L } from "../../../lib/utils.js";
+import { isValid as Y, parse as y } from "date-fns";
+import { cn as x, padValidDateString as R, maskDate as L } from "../../../lib/utils.js";
 import { Popover as xt, PopoverAnchor as Mt, PopoverContent as Yt } from "../popover.js";
 import { Calendar as yt } from "../calendar.js";
 import { Tooltip as Q, TooltipTrigger as U, TooltipContent as W } from "../tooltip.js";
 import { useImpactNovaI18n as wt } from "../../../i18n/ImpactNovaI18nContext.js";
-const m = (e, i = "MM/YYYY") => {
+const p = (e, s = "MM/YYYY") => {
   const A = (e.month + 1).toString().padStart(2, "0");
-  return i === "YYYY/MM" ? `${e.year}/${A}` : `${A}/${e.year}`;
-}, bt = p.forwardRef(
+  return s === "YYYY/MM" ? `${e.year}/${A}` : `${A}/${e.year}`;
+}, bt = u.forwardRef(
   ({
     value: e,
-    onChange: i,
+    onChange: s,
     placeholder: A,
     minDate: I,
     maxDate: X,
     startMonth: Z,
     endMonth: _,
-    showFooter: x = !0,
-    disabled: u,
+    showFooter: M = !0,
+    disabled: m,
     className: F,
     isError: S,
     size: B,
@@ -33,175 +33,175 @@ const m = (e, i = "MM/YYYY") => {
     displayFormat: a = "MM/YYYY",
     ...et
   }, nt) => {
-    const { t: y } = wt();
-    A ?? y("datePicker.selectMonthRange");
-    const H = p.useRef(null), ot = p.useRef(null), c = p.useMemo(
+    const { t: w } = wt();
+    A ?? w("datePicker.selectMonthRange");
+    const H = u.useRef(null), ot = u.useRef(null), c = u.useMemo(
       () => a === "YYYY/MM" ? "yyyy/MM" : "MM/yyyy",
       [a]
     );
-    p.useImperativeHandle(nt, () => H.current);
-    const [s, w] = p.useState(!1), V = p.useRef(!1), [v, b] = p.useState(e), [k, N] = p.useState(e?.from ? m(e.from, a) : ""), [D, P] = p.useState(e?.to ? m(e.to, a) : ""), [rt, j] = p.useState(() => e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date());
-    p.useEffect(() => {
-      s || (N(e?.from ? m(e.from, a) : ""), P(e?.to ? m(e.to, a) : ""), b(e));
-    }, [s, e, a]), p.useEffect(() => {
-      s && (b(e), N(e?.from ? m(e.from, a) : ""), P(e?.to ? m(e.to, a) : ""), j(e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date()));
-    }, [s, e, a, I]);
+    u.useImperativeHandle(nt, () => H.current);
+    const [l, g] = u.useState(!1), V = u.useRef(!1), [P, b] = u.useState(e), [k, N] = u.useState(e?.from ? p(e.from, a) : ""), [D, v] = u.useState(e?.to ? p(e.to, a) : ""), [rt, j] = u.useState(() => e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date());
+    u.useEffect(() => {
+      l || (N(e?.from ? p(e.from, a) : ""), v(e?.to ? p(e.to, a) : ""), b(e));
+    }, [l, e, a]), u.useEffect(() => {
+      l && (b(e), N(e?.from ? p(e.from, a) : ""), v(e?.to ? p(e.to, a) : ""), j(e?.from ? new Date(e.from.year, e.from.month, 1) : I || /* @__PURE__ */ new Date()));
+    }, [l, e, a, I]);
     const at = (t) => {
-      b(t), t?.from && N(m(t.from, a)), t?.to && P(m(t.to, a)), !x && t?.from && t?.to && (t.from.month !== t.to.month || t.from.year !== t.to.year) && (i?.(t), w(!1));
+      b(t), t?.from && N(p(t.from, a)), t?.to && v(p(t.to, a)), !M && t?.from && t?.to && (t.from.month !== t.to.month || t.from.year !== t.to.year) && (s?.(t), g(!1));
     }, st = (t) => {
-      i?.(t !== void 0 ? t : v), w(!1);
+      s?.(t !== void 0 ? t : P), g(!1);
     }, K = () => {
-      b(e), N(e?.from ? m(e.from, a) : ""), P(e?.to ? m(e.to, a) : ""), w(!1);
+      b(e), N(e?.from ? p(e.from, a) : ""), v(e?.to ? p(e.to, a) : ""), g(!1);
     }, $ = () => {
-      b(void 0), N(""), P(""), i?.(void 0), x || w(!1);
-    }, it = (t) => {
+      b(void 0), N(""), v(""), s?.(void 0), M || g(!1);
+    }, ct = (t) => {
       const f = t.target.value, r = L(f, c, k);
       if (N(r), r === "") {
-        const o = { from: void 0, to: v?.to };
-        b(o), x || i?.(o);
+        const o = { from: void 0, to: P?.to };
+        b(o), M || s?.(o);
         return;
       }
-      const n = Y(r, c, /* @__PURE__ */ new Date());
-      if (M(n) && r.length === 7) {
-        const l = { from: { month: n.getMonth(), year: n.getFullYear() }, to: v?.to };
-        b(l), j(n), x || i?.(l);
+      const n = y(r, c, /* @__PURE__ */ new Date());
+      if (Y(n) && r.length === 7) {
+        const d = { from: { month: n.getMonth(), year: n.getFullYear() }, to: P?.to };
+        b(d), j(n), M || s?.(d);
       }
-    }, ct = (t) => {
+    }, it = (t) => {
       const f = t.target.value, r = L(f, c, D);
-      if (P(r), r === "") {
-        const o = { from: v?.from, to: void 0 };
-        b(o), x || i?.(o);
+      if (v(r), r === "") {
+        const o = { from: P?.from, to: void 0 };
+        b(o), M || s?.(o);
         return;
       }
-      const n = Y(r, c, /* @__PURE__ */ new Date());
-      if (M(n) && r.length === 7) {
-        const o = { month: n.getMonth(), year: n.getFullYear() }, l = { from: v?.from, to: o };
-        b(l), j(n), x || i?.(l);
+      const n = y(r, c, /* @__PURE__ */ new Date());
+      if (Y(n) && r.length === 7) {
+        const o = { month: n.getMonth(), year: n.getFullYear() }, d = { from: P?.from, to: o };
+        b(d), j(n), M || s?.(d);
       }
     }, T = () => {
-      if (s) return;
-      const t = R(k, c), f = R(D, c), r = Y(t, c, /* @__PURE__ */ new Date()), n = Y(f, c, /* @__PURE__ */ new Date()), o = M(r) && t.length === 7, l = M(n) && f.length === 7;
-      k && !o ? N(e?.from ? m(e.from, a) : "") : o && N(t), D && !l ? P(e?.to ? m(e.to, a) : "") : l && P(f), o && l && !x ? i?.({
+      if (l) return;
+      const t = R(k, c), f = R(D, c), r = y(t, c, /* @__PURE__ */ new Date()), n = y(f, c, /* @__PURE__ */ new Date()), o = Y(r) && t.length === 7, d = Y(n) && f.length === 7;
+      k && !o ? N(e?.from ? p(e.from, a) : "") : o && N(t), D && !d ? v(e?.to ? p(e.to, a) : "") : d && v(f), o && d && !M ? s?.({
         from: { month: r.getMonth(), year: r.getFullYear() },
         to: { month: n.getMonth(), year: n.getFullYear() }
-      }) : o && !x ? i?.({
+      }) : o && !M ? s?.({
         from: { month: r.getMonth(), year: r.getFullYear() },
         to: e?.to
-      }) : l && !x && i?.({
+      }) : d && !M && s?.({
         from: e?.from,
         to: { month: n.getMonth(), year: n.getFullYear() }
       });
-    }, dt = e?.from ? m(e.from, a) : "", lt = e?.to ? m(e.to, a) : "", ft = k !== dt, mt = D !== lt, pt = k.length === 7 && !M(Y(k, c, /* @__PURE__ */ new Date())), ut = D.length === 7 && !M(Y(D, c, /* @__PURE__ */ new Date())), q = y("datePicker.startMonth"), G = y("datePicker.endMonth");
-    return /* @__PURE__ */ h("div", { className: "flex w-full min-w-[240px] flex-col gap-[6px]", "data-component": "month-range-picker", "data-disabled": u || void 0, children: [
+    }, lt = e?.from ? p(e.from, a) : "", dt = e?.to ? p(e.to, a) : "", ft = k !== lt, mt = D !== dt, pt = k.length === 7 && !Y(y(k, c, /* @__PURE__ */ new Date())), ut = D.length === 7 && !Y(y(D, c, /* @__PURE__ */ new Date())), q = w("datePicker.startMonth"), G = w("datePicker.endMonth");
+    return /* @__PURE__ */ h("div", { className: "flex w-full min-w-[240px] flex-col gap-[6px]", "data-component": "month-range-picker", "data-disabled": m || void 0, children: [
       /* @__PURE__ */ h("div", { className: "flex flex-col gap-[6px]", children: [
         O && /* @__PURE__ */ h(
           "label",
           {
-            className: g(
+            className: x(
               "text-xs font-medium leading-[18px] text-content-tertiary",
-              u && "opacity-70",
+              m && "opacity-70",
               S && "text-destructive"
             ),
             children: [
               O,
               " ",
-              tt && /* @__PURE__ */ d("span", { className: "text-destructive", children: "*" })
+              tt && /* @__PURE__ */ i("span", { className: "text-destructive", children: "*" })
             ]
           }
         ),
         /* @__PURE__ */ h(
           "div",
           {
-            className: g(
+            className: x(
               "w-full",
               E && z === "absolute" && "relative"
             ),
             children: [
-              /* @__PURE__ */ h(xt, { open: u ? !1 : s, onOpenChange: (t) => {
-                u || w(t);
+              /* @__PURE__ */ h(xt, { open: m ? !1 : l, onOpenChange: (t) => {
+                m || g(t);
               }, children: [
-                /* @__PURE__ */ d(Mt, { asChild: !0, children: /* @__PURE__ */ h(
+                /* @__PURE__ */ i(Mt, { asChild: !0, children: /* @__PURE__ */ h(
                   "div",
                   {
-                    "data-state": s ? "open" : "closed",
-                    className: g(
+                    "data-state": l ? "open" : "closed",
+                    className: x(
                       "flex w-full items-center justify-between gap-2 rounded-md border bg-canvas-elevated px-3 text-sm shadow-sm transition-colors hover:border-brand disabled:cursor-not-allowed disabled:bg-disabled-surface disabled:text-disabled-foreground disabled:border-stroke",
                       S ? "border-destructive hover:border-destructive" : "border-field",
                       B === "sm" ? "h-6" : B === "md" ? "h-[28px]" : "h-8",
-                      u && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
+                      m && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
                       "cursor-pointer",
                       F
                     ),
                     children: [
                       /* @__PURE__ */ h("div", { className: "flex items-center gap-4 flex-1 min-w-0", children: [
-                        /* @__PURE__ */ d(
+                        /* @__PURE__ */ i(
                           "input",
                           {
                             ref: H,
                             type: "text",
                             value: k,
-                            onChange: it,
+                            onChange: ct,
                             onBlur: T,
-                            onClick: (t) => s && t.stopPropagation(),
+                            onClick: () => !m && g(!0),
                             onKeyDown: (t) => {
-                              if (t.key === "Enter" && !s) {
+                              if (t.key === "Enter" && !l) {
                                 t.preventDefault();
-                                const f = R(k, c), r = R(D, c), n = Y(f, c, /* @__PURE__ */ new Date()), o = Y(r, c, /* @__PURE__ */ new Date()), l = M(n) && f.length === 7, C = M(o) && r.length === 7;
-                                l && C ? i?.({
+                                const f = R(k, c), r = R(D, c), n = y(f, c, /* @__PURE__ */ new Date()), o = y(r, c, /* @__PURE__ */ new Date()), d = Y(n) && f.length === 7, C = Y(o) && r.length === 7;
+                                d && C ? s?.({
                                   from: { month: n.getMonth(), year: n.getFullYear() },
                                   to: { month: o.getMonth(), year: o.getFullYear() }
-                                }) : l ? i?.({
+                                }) : d ? s?.({
                                   from: { month: n.getMonth(), year: n.getFullYear() },
                                   to: e?.to
-                                }) : C && i?.({
+                                }) : C && s?.({
                                   from: e?.from,
                                   to: { month: o.getMonth(), year: o.getFullYear() }
                                 });
                               }
-                              t.key === "ArrowDown" && !s && !u && (t.preventDefault(), V.current = !0, w(!0)), t.key === "Escape" && s && (t.preventDefault(), K());
+                              t.key === "ArrowDown" && !l && !m && (t.preventDefault(), V.current = !0, g(!0)), t.key === "Escape" && l && (t.preventDefault(), K());
                             },
-                            placeholder: s ? a === "YYYY/MM" ? "YYYY/MM" : y("datePicker.monthYearFormat") : q,
-                            disabled: !!u,
+                            placeholder: l ? a === "YYYY/MM" ? "YYYY/MM" : w("datePicker.monthYearFormat") : q,
+                            disabled: !!m,
                             "aria-label": q,
                             "data-field": "start",
-                            className: g(
+                            className: x(
                               "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
                               pt ? "text-destructive" : ft ? "text-content-muted" : ""
                             ),
                             ...et
                           }
                         ),
-                        /* @__PURE__ */ d(
+                        /* @__PURE__ */ i(
                           "input",
                           {
                             ref: ot,
                             type: "text",
                             value: D,
-                            onChange: ct,
+                            onChange: it,
                             onBlur: T,
-                            onClick: (t) => s && t.stopPropagation(),
+                            onClick: () => !m && g(!0),
                             onKeyDown: (t) => {
-                              if (t.key === "Enter" && !s) {
+                              if (t.key === "Enter" && !l) {
                                 t.preventDefault();
-                                const f = R(k, c), r = R(D, c), n = Y(f, c, /* @__PURE__ */ new Date()), o = Y(r, c, /* @__PURE__ */ new Date()), l = M(n) && f.length === 7, C = M(o) && r.length === 7;
-                                l && C ? i?.({
+                                const f = R(k, c), r = R(D, c), n = y(f, c, /* @__PURE__ */ new Date()), o = y(r, c, /* @__PURE__ */ new Date()), d = Y(n) && f.length === 7, C = Y(o) && r.length === 7;
+                                d && C ? s?.({
                                   from: { month: n.getMonth(), year: n.getFullYear() },
                                   to: { month: o.getMonth(), year: o.getFullYear() }
-                                }) : l ? i?.({
+                                }) : d ? s?.({
                                   from: { month: n.getMonth(), year: n.getFullYear() },
                                   to: e?.to
-                                }) : C && i?.({
+                                }) : C && s?.({
                                   from: e?.from,
                                   to: { month: o.getMonth(), year: o.getFullYear() }
                                 });
                               }
-                              t.key === "ArrowDown" && !s && !u && (t.preventDefault(), V.current = !0, w(!0)), t.key === "Escape" && s && (t.preventDefault(), K());
+                              t.key === "ArrowDown" && !l && !m && (t.preventDefault(), V.current = !0, g(!0)), t.key === "Escape" && l && (t.preventDefault(), K());
                             },
-                            placeholder: s ? a === "YYYY/MM" ? "YYYY/MM" : y("datePicker.monthYearFormat") : G,
-                            disabled: !!u,
+                            placeholder: l ? a === "YYYY/MM" ? "YYYY/MM" : w("datePicker.monthYearFormat") : G,
+                            disabled: !!m,
                             "aria-label": G,
                             "data-field": "end",
-                            className: g(
+                            className: x(
                               "flex-1 min-w-0 bg-transparent p-0 text-sm font-medium outline-none placeholder:font-medium placeholder:text-content-empty disabled:cursor-not-allowed disabled:opacity-50",
                               ut ? "text-destructive" : mt ? "text-content-muted" : ""
                             )
@@ -209,13 +209,13 @@ const m = (e, i = "MM/YYYY") => {
                         )
                       ] }),
                       /* @__PURE__ */ h("div", { className: "flex items-center gap-1 shrink-0", children: [
-                        e?.from && !u && /* @__PURE__ */ h(Q, { children: [
-                          /* @__PURE__ */ d(U, { asChild: !0, children: /* @__PURE__ */ d(
+                        e?.from && !m && /* @__PURE__ */ h(Q, { children: [
+                          /* @__PURE__ */ i(U, { asChild: !0, children: /* @__PURE__ */ i(
                             "button",
                             {
                               type: "button",
                               tabIndex: 0,
-                              "aria-label": y("calendar.clear"),
+                              "aria-label": w("calendar.clear"),
                               onClick: (t) => {
                                 t.stopPropagation(), $();
                               },
@@ -223,24 +223,24 @@ const m = (e, i = "MM/YYYY") => {
                                 (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), $());
                               },
                               className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
-                              children: /* @__PURE__ */ d(ht, { className: "size-3 hover:text-content text-content-muted" })
+                              children: /* @__PURE__ */ i(ht, { className: "size-3 hover:text-content text-content-muted" })
                             }
                           ) }),
-                          /* @__PURE__ */ d(W, { variant: "tertiary", side: "top", children: y("calendar.clear") })
+                          /* @__PURE__ */ i(W, { variant: "tertiary", side: "top", children: w("calendar.clear") })
                         ] }),
                         /* @__PURE__ */ h(Q, { children: [
-                          /* @__PURE__ */ d(U, { asChild: !0, children: /* @__PURE__ */ d("button", { type: "button", tabIndex: 0, "aria-label": y("datePicker.selectMonthRange"), onClick: (t) => {
-                            t.stopPropagation(), u || w(!s);
+                          /* @__PURE__ */ i(U, { asChild: !0, children: /* @__PURE__ */ i("button", { type: "button", tabIndex: 0, "aria-label": w("datePicker.selectMonthRange"), onClick: (t) => {
+                            t.stopPropagation(), m || g(!l);
                           }, onKeyDown: (t) => {
-                            (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), u || (V.current = !0, w(!s)));
-                          }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ d(gt, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
-                          /* @__PURE__ */ d(W, { variant: "tertiary", side: "top", children: y("datePicker.selectMonthRange") })
+                            (t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), m || (V.current = !0, g(!l)));
+                          }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ i(gt, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
+                          /* @__PURE__ */ i(W, { variant: "tertiary", side: "top", children: w("datePicker.selectMonthRange") })
                         ] })
                       ] })
                     ]
                   }
                 ) }),
-                /* @__PURE__ */ d(
+                /* @__PURE__ */ i(
                   Yt,
                   {
                     className: "w-auto p-0",
@@ -248,19 +248,19 @@ const m = (e, i = "MM/YYYY") => {
                     onOpenAutoFocus: (t) => {
                       V.current || t.preventDefault(), V.current = !1;
                     },
-                    children: /* @__PURE__ */ d(
+                    children: /* @__PURE__ */ i(
                       yt,
                       {
                         pickerType: "month",
                         monthMode: "range",
-                        selectedMonths: v,
+                        selectedMonths: P,
                         onMonthSelect: at,
                         month: rt,
                         onMonthChange: j,
                         disabled: { before: I, after: X },
                         startMonth: Z,
                         endMonth: _,
-                        showFooter: x,
+                        showFooter: M,
                         onApply: st,
                         onCancel: K,
                         onClear: $
@@ -269,21 +269,21 @@ const m = (e, i = "MM/YYYY") => {
                   }
                 )
               ] }),
-              E && z === "absolute" && /* @__PURE__ */ h("div", { className: g("absolute left-0 top-full z-10 mt-1 flex min-w-0 max-w-full items-center gap-[6px]", S && "text-destructive"), children: [
-                /* @__PURE__ */ d(
+              E && z === "absolute" && /* @__PURE__ */ h("div", { className: x("absolute left-0 top-full z-10 mt-1 flex min-w-0 max-w-full items-center gap-[6px]", S && "text-destructive"), children: [
+                /* @__PURE__ */ i(
                   J,
                   {
                     size: "xs",
-                    className: g(
+                    className: x(
                       "shrink-0",
                       S ? "text-destructive" : "text-content-muted"
                     )
                   }
                 ),
-                /* @__PURE__ */ d(
+                /* @__PURE__ */ i(
                   "p",
                   {
-                    className: g(
+                    className: x(
                       "min-w-0 text-[12px] font-medium leading-[18px] text-navigation-muted",
                       S && "text-destructive"
                     ),
@@ -295,21 +295,21 @@ const m = (e, i = "MM/YYYY") => {
           }
         )
       ] }),
-      E && z === "flow" && /* @__PURE__ */ h("div", { className: g("flex items-center gap-[6px]", S && "text-destructive"), children: [
-        /* @__PURE__ */ d(
+      E && z === "flow" && /* @__PURE__ */ h("div", { className: x("flex items-center gap-[6px]", S && "text-destructive"), children: [
+        /* @__PURE__ */ i(
           J,
           {
             size: "xs",
-            className: g(
+            className: x(
               "shrink-0",
               S ? "text-destructive" : "text-content-muted"
             )
           }
         ),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ i(
           "p",
           {
-            className: g(
+            className: x(
               "text-[12px] font-medium leading-[18px] text-navigation-muted",
               S && "text-destructive"
             ),

package/dist/components/ui/date-picker/multi-date-picker.js

@@ -1,5 +1,5 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import * as o from "react";
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import * as a from "react";
 import { Cross as j, CalendarMonth as w } from "impact-nova-icons";
 import { format as z } from "date-fns";
 import { cn as R } from "../../../lib/utils.js";
@@ -9,10 +9,10 @@ import { Calendar as q } from "../calendar.js";
 import { Tooltip as u, TooltipTrigger as y, TooltipContent as g } from "../tooltip.js";
 import { getDateFnsLocale as B } from "../../../i18n/getDateFnsLocale.js";
 import { useImpactNovaI18n as G } from "../../../i18n/ImpactNovaI18nContext.js";
-const H = o.forwardRef(
+const H = a.forwardRef(
   ({
     value: t,
-    onChange: c,
+    onChange: s,
     format: C = "MM/dd/yyyy",
     placeholder: x,
     minDate: P,
@@ -20,43 +20,46 @@ const H = o.forwardRef(
     startMonth: N,
     endMonth: D,
     showFooter: p = !0,
-    disabled: n,
-    className: A,
-    ...T
-  }, b) => {
-    const { locale: d, t: a } = G(), k = o.useMemo(() => B(d), [d]), v = x ?? a("datePicker.selectMultipleDates"), [m, l] = o.useState(!1), [f, i] = o.useState(t);
-    o.useEffect(() => {
+    disabled: o,
+    className: k,
+    ...A
+  }, T) => {
+    const { locale: m, t: l } = G(), b = a.useMemo(() => B(m), [m]), v = x ?? l("datePicker.selectMultipleDates"), [d, n] = a.useState(!1), [f, i] = a.useState(t);
+    a.useEffect(() => {
       i(t);
-    }, [m, t]);
+    }, [d, t]);
     const I = (r) => {
-      i(r), p || c?.(r);
+      i(r), p || s?.(r);
     }, L = (r) => {
-      c?.(r !== void 0 ? r : f), l(!1);
+      s?.(r !== void 0 ? r : f), n(!1);
     }, O = () => {
-      i(t), l(!1);
+      i(t), n(!1);
     }, h = () => {
-      i(void 0), c?.(void 0), p || l(!1);
-    }, S = t && t.length > 0 ? t.length === 1 ? z(t[0], C, { locale: k }) : `${t.length} dates selected` : "";
-    return /* @__PURE__ */ s(F, { open: n ? !1 : m, onOpenChange: (r) => {
-      n || l(r);
+      i(void 0), s?.(void 0), p || n(!1);
+    }, S = t && t.length > 0 ? t.length === 1 ? z(t[0], C, { locale: b }) : `${t.length} dates selected` : "";
+    return /* @__PURE__ */ c(F, { open: o ? !1 : d, onOpenChange: (r) => {
+      o || n(r);
     }, children: [
       /* @__PURE__ */ e(V, { asChild: !0, children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(
         E,
         {
-          ref: b,
+          ref: T,
           value: S,
           placeholder: v,
           readOnly: !0,
-          disabled: n,
-          className: R("cursor-pointer", A),
-          suffix: /* @__PURE__ */ s("div", { className: "flex items-center gap-1", children: [
-            t && t.length > 0 && !n && /* @__PURE__ */ s(u, { children: [
+          disabled: o,
+          onClick: () => {
+            !o && !d && n(!0);
+          },
+          className: R("cursor-pointer", k),
+          suffix: /* @__PURE__ */ c("div", { className: "flex items-center gap-1", children: [
+            t && t.length > 0 && !o && /* @__PURE__ */ c(u, { children: [
               /* @__PURE__ */ e(y, { asChild: !0, children: /* @__PURE__ */ e(
                 "button",
                 {
                   type: "button",
                   tabIndex: 0,
-                  "aria-label": a("calendar.clear"),
+                  "aria-label": l("calendar.clear"),
                   onClick: (r) => {
                     r.stopPropagation(), h();
                   },
@@ -64,14 +67,14 @@ const H = o.forwardRef(
                   children: /* @__PURE__ */ e(j, { className: "size-3 hover:text-content" })
                 }
               ) }),
-              /* @__PURE__ */ e(g, { variant: "tertiary", side: "top", children: a("calendar.clear") })
+              /* @__PURE__ */ e(g, { variant: "tertiary", side: "top", children: l("calendar.clear") })
             ] }),
-            /* @__PURE__ */ s(u, { children: [
+            /* @__PURE__ */ c(u, { children: [
               /* @__PURE__ */ e(y, { asChild: !0, children: /* @__PURE__ */ e(w, { className: "h-4 w-4 text-secondary-foreground" }) }),
-              /* @__PURE__ */ e(g, { variant: "tertiary", side: "top", children: a("datePicker.selectMultipleDates") })
+              /* @__PURE__ */ e(g, { variant: "tertiary", side: "top", children: l("datePicker.selectMultipleDates") })
             ] })
           ] }),
-          ...T
+          ...A
         }
       ) }) }),
       /* @__PURE__ */ e(