impact-nova 2.2.1 → 2.2.2

package/dist/components/forms/date-picker/month-picker.js

@@ -2,113 +2,120 @@ import { jsxs as k, jsx as s } from "react/jsx-runtime";
 import * as o from "react";
 import { Cross as _, CalendarMonth as ee } from "impact-nova-icons";
 import { cn as te } from "../../../lib/utils.js";
-import { usePickerDismissActionsRef as ne, usePickerFooterDismissNudge as re, isDateInputInvalid as oe, compareMonthSelection as se, resolveDateInputOnBlur as ie, maskDateInput as ae, parseDateInput as ce, resolveDateInputOnEnter as le } from "./date-input-behavior.js";
-import { Input as pe } from "../input/input.js";
-import { Popover as fe, PopoverAnchor as de, PopoverContent as me } from "../../feedback/popover/popover.js";
-import { Calendar as ue } from "../../data-display/calendar/calendar.js";
-import { Tooltip as E, TooltipTrigger as b, TooltipContent as V } from "../../feedback/tooltip/tooltip.js";
-import { useImpactNovaI18n as he } from "../../../i18n/use-impact-nova-i18n.js";
-import { coerceSingleMonthApply as ye, coerceSingleMonth as Me } from "./calendar-selection-adapters.js";
-import { buildDateBoundsMatcher as ge } from "../../../lib/date-bounds-matcher.js";
-const u = (e) => `${(e.month + 1).toString().padStart(2, "0")}/${e.year}`, De = o.forwardRef(
+import { usePickerDismissActionsRef as ne, usePickerFooterDismissNudge as re, isDateInputInvalid as oe, resolveSingleValueDismissFlash as se, compareMonthSelection as ie, resolveDateInputOnBlur as ae, maskDateInput as ce, parseDateInput as le, resolveDateInputOnEnter as pe } from "./date-input-behavior.js";
+import { Input as fe } from "../input/input.js";
+import { Popover as de, PopoverAnchor as me, PopoverContent as ue } from "../../feedback/popover/popover.js";
+import { Calendar as he } from "../../data-display/calendar/calendar.js";
+import { Tooltip as E, TooltipTrigger as V, TooltipContent as b } from "../../feedback/tooltip/tooltip.js";
+import { useImpactNovaI18n as ye } from "../../../i18n/use-impact-nova-i18n.js";
+import { coerceSingleMonthApply as Me, coerceSingleMonth as ge } from "./calendar-selection-adapters.js";
+import { buildDateBoundsMatcher as De } from "../../../lib/date-bounds-matcher.js";
+const u = (t) => `${(t.month + 1).toString().padStart(2, "0")}/${t.year}`, ke = o.forwardRef(
   ({
-    value: e,
+    value: t,
     onChange: p,
-    placeholder: w,
-    minDate: v,
+    placeholder: v,
+    minDate: w,
     maxDate: B,
     startMonth: O,
     endMonth: Y,
     showFooter: i = !0,
     disabled: f,
     className: j,
-    ...K
-  }, z) => {
-    const { t: d } = he(), F = w ?? d("datePicker.selectMonth"), P = o.useRef(null), S = o.useRef(null);
-    o.useImperativeHandle(z, () => P.current);
-    const [r, c] = o.useState(!1), R = ne(), { footerFlashKey: H, footerFlashTarget: $, popoverHandlers: L } = re(i, r, R, S), [h, a] = o.useState(e), [m, l] = o.useState(e ? u(e) : ""), [q, I] = o.useState(e ? new Date(e.year, e.month) : /* @__PURE__ */ new Date());
+    ...F
+  }, K) => {
+    const { t: d } = ye(), z = v ?? d("datePicker.selectMonth"), C = o.useRef(null), P = o.useRef(null);
+    o.useImperativeHandle(K, () => C.current);
+    const [r, c] = o.useState(!1), R = ne(), { footerFlashKey: H, footerFlashTarget: $, popoverHandlers: L } = re(i, r, R, P), [y, a] = o.useState(t), [m, l] = o.useState(t ? u(t) : ""), [q, I] = o.useState(t ? new Date(t.year, t.month) : /* @__PURE__ */ new Date());
     o.useEffect(() => {
-      r || (l(e ? u(e) : ""), a(e));
-    }, [r, e]), o.useEffect(() => {
-      r && (a(e), I(e ? new Date(e.year, e.month) : /* @__PURE__ */ new Date()), l(e ? u(e) : ""));
-    }, [r, e]);
-    const G = (t) => {
-      const n = Me(t);
+      r || (l(t ? u(t) : ""), a(t));
+    }, [r, t]), o.useEffect(() => {
+      r && (a(t), I(t ? new Date(t.year, t.month) : /* @__PURE__ */ new Date()), l(t ? u(t) : ""));
+    }, [r, t]);
+    const G = (e) => {
+      const n = ge(e);
       a(n), n && l(u(n)), i || (p?.(n), c(!1));
-    }, x = (t) => {
-      const n = ye(t, h);
+    }, x = (e) => {
+      const n = Me(e, y);
       p?.(n), c(!1);
-    }, C = () => {
-      a(e), l(e ? u(e) : ""), c(!1);
+    }, S = () => {
+      a(t), l(t ? u(t) : ""), c(!1);
     }, A = () => {
       a(void 0), l(""), p?.(void 0), i || c(!1);
-    }, y = "MM/yyyy", M = e ? u(e) : "", g = o.useRef(!1), J = (t) => {
-      const n = ae(t.target.value, y, m);
+    }, h = "MM/yyyy", M = t ? u(t) : "", g = o.useRef(!1), J = (e) => {
+      const n = ce(e.target.value, h, m);
       if (l(n), n === "") {
         a(void 0), i || p?.(void 0);
         return;
       }
-      const { parsed: D, isValid: Z } = ce(n, y);
+      const { parsed: D, isValid: Z } = le(n, h);
       if (Z && D) {
         const T = { month: D.getMonth(), year: D.getFullYear() };
         a(T), I(D), i || p?.(T);
       }
     }, Q = () => {
       if (r) return;
-      const t = ie(m, y, M);
-      if (t.resetToCommitted) {
-        l(M), a(e);
+      const e = ae(m, h, M);
+      if (e.resetToCommitted) {
+        l(M), a(t);
         return;
       }
-      if (t.parsed) {
-        const n = { month: t.parsed.getMonth(), year: t.parsed.getFullYear() };
-        l(t.display), a(n), i || p?.(n);
+      if (e.parsed) {
+        const n = { month: e.parsed.getMonth(), year: e.parsed.getFullYear() };
+        l(e.display), a(n), i || p?.(n);
         return;
       }
-      l(M), a(e);
+      l(M), a(t);
     }, U = () => {
       if (r && i) {
         x();
         return;
       }
-      const t = le(m, y);
-      if (t.parsed) {
+      const e = pe(m, h);
+      if (e.parsed) {
         const n = {
-          month: t.parsed.getMonth(),
-          year: t.parsed.getFullYear()
+          month: e.parsed.getMonth(),
+          year: e.parsed.getFullYear()
         };
         i && (p?.(n), c(!1));
         return;
       }
       r || (g.current = !0, c(!0));
-    }, N = M !== m, W = oe(m, y), X = o.useCallback(() => h && (!e || se(h, e) !== 0) ? "apply" : "cancel", [h, e]);
+    }, N = M !== m, W = oe(m, h), X = o.useCallback(
+      () => se(
+        y,
+        t,
+        (e, n) => ie(e, n) === 0
+      ),
+      [y, t]
+    );
     return o.useLayoutEffect(() => {
       R.current = {
-        onDismiss: C,
+        onDismiss: S,
         resolveFlash: X
       };
-    }), /* @__PURE__ */ k(fe, { open: f ? !1 : r, onOpenChange: (t) => {
-      f || !t && i || c(t);
+    }), /* @__PURE__ */ k(de, { open: f ? !1 : r, onOpenChange: (e) => {
+      f || !e && i || c(e);
     }, children: [
-      /* @__PURE__ */ s(de, { asChild: !0, children: /* @__PURE__ */ s(
+      /* @__PURE__ */ s(me, { asChild: !0, children: /* @__PURE__ */ s(
         "div",
         {
-          ref: S,
+          ref: P,
           "data-component": "month-picker",
           "data-state": r ? "open" : "closed",
           "data-pending": N || void 0,
           children: /* @__PURE__ */ s(
-            pe,
+            fe,
             {
-              ref: P,
+              ref: C,
               value: m,
               onChange: J,
               onBlur: Q,
               onClick: () => !f && c(!0),
-              onKeyDown: (t) => {
-                t.key === "Enter" && !f && (t.preventDefault(), U()), t.key === "ArrowDown" && !r && !f && (t.preventDefault(), g.current = !0, c(!0)), t.key === "Escape" && r && (t.preventDefault(), C());
+              onKeyDown: (e) => {
+                e.key === "Enter" && !f && (e.preventDefault(), U()), e.key === "ArrowDown" && !r && !f && (e.preventDefault(), g.current = !0, c(!0)), e.key === "Escape" && r && (e.preventDefault(), S());
               },
-              placeholder: r ? d("datePicker.monthYearFormat") : F,
+              placeholder: r ? d("datePicker.monthYearFormat") : z,
               disabled: f,
               "data-form-control": "input",
               className: te(
@@ -117,59 +124,59 @@ const u = (e) => `${(e.month + 1).toString().padStart(2, "0")}/${e.year}`, De =
                 j
               ),
               suffix: /* @__PURE__ */ k("div", { className: "flex items-center gap-1", children: [
-                e && !f && /* @__PURE__ */ k(E, { children: [
-                  /* @__PURE__ */ s(b, { asChild: !0, children: /* @__PURE__ */ s(
+                t && !f && /* @__PURE__ */ k(E, { children: [
+                  /* @__PURE__ */ s(V, { asChild: !0, children: /* @__PURE__ */ s(
                     "button",
                     {
                       type: "button",
                       tabIndex: 0,
                       "aria-label": d("calendar.clear"),
-                      onClick: (t) => {
-                        t.stopPropagation(), A();
+                      onClick: (e) => {
+                        e.stopPropagation(), A();
                       },
                       className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
                       children: /* @__PURE__ */ s(_, { className: "size-3 hover:text-content" })
                     }
                   ) }),
-                  /* @__PURE__ */ s(V, { variant: "tertiary", side: "top", children: d("calendar.clear") })
+                  /* @__PURE__ */ s(b, { variant: "tertiary", side: "top", children: d("calendar.clear") })
                 ] }),
                 /* @__PURE__ */ k(E, { children: [
-                  /* @__PURE__ */ s(b, { asChild: !0, children: /* @__PURE__ */ s(ee, { className: "h-4 w-4 text-secondary-foreground" }) }),
-                  /* @__PURE__ */ s(V, { variant: "tertiary", side: "top", children: d("datePicker.selectMonth") })
+                  /* @__PURE__ */ s(V, { asChild: !0, children: /* @__PURE__ */ s(ee, { className: "h-4 w-4 text-secondary-foreground" }) }),
+                  /* @__PURE__ */ s(b, { variant: "tertiary", side: "top", children: d("datePicker.selectMonth") })
                 ] })
               ] }),
-              ...K
+              ...F
             }
           )
         }
       ) }),
       /* @__PURE__ */ s(
-        me,
+        ue,
         {
           className: "w-auto p-0",
           align: "start",
           "aria-label": d("datePicker.selectMonth"),
-          onOpenAutoFocus: (t) => {
-            g.current || t.preventDefault(), g.current = !1;
+          onOpenAutoFocus: (e) => {
+            g.current || e.preventDefault(), g.current = !1;
           },
           ...L,
           children: /* @__PURE__ */ s(
-            ue,
+            he,
             {
               pickerType: "month",
               monthMode: "single",
-              selectedMonths: h,
+              selectedMonths: y,
               footerFlashKey: H,
               footerFlashTarget: $,
               onMonthSelect: G,
               month: q,
               onMonthChange: I,
-              disabled: ge(v, B),
+              disabled: De(w, B),
               startMonth: O,
               endMonth: Y,
               showFooter: i,
               onApply: x,
-              onCancel: C,
+              onCancel: S,
               onClear: A
             }
           )
@@ -178,7 +185,7 @@ const u = (e) => `${(e.month + 1).toString().padStart(2, "0")}/${e.year}`, De =
     ] });
   }
 );
-De.displayName = "MonthPicker";
+ke.displayName = "MonthPicker";
 export {
-  De as MonthPicker
+  ke as MonthPicker
 };

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

@@ -33,7 +33,7 @@ const Ze = s.forwardRef(
     startMonth: ae,
     endMonth: ce,
     showFooter: g = !0,
-    disabled: c,
+    disabled: f,
     className: fe,
     error: de,
     isError: le,
@@ -53,75 +53,75 @@ const Ze = s.forwardRef(
       helperTextPosition: ue,
       error: q,
       required: he,
-      disabled: c ?? void 0,
+      disabled: f ?? void 0,
       rootClassName: "w-full min-w-[240px]"
-    }), { t: x } = Je(), L = s.useRef(null), ye = s.useRef(null), G = s.useRef(null), S = s.useRef(null), K = s.useRef(null), f = s.useMemo(
+    }), { t: x } = Je(), L = s.useRef(null), ye = s.useRef(null), G = s.useRef(null), S = s.useRef(null), K = s.useRef(null), d = s.useMemo(
       () => i === "YYYY/MM" ? "yyyy/MM" : "MM/yyyy",
       [i]
     );
     s.useImperativeHandle(Me, () => L.current);
-    const [m, M] = s.useState(!1), J = Ve(), { footerFlashKey: ke, footerFlashTarget: ve, popoverHandlers: xe } = Oe(g, m, J, G), w = s.useRef(!1), [d, R] = s.useState(t), [p, k] = s.useState(t?.from ? h(t.from, i) : ""), [y, v] = s.useState(t?.to ? h(t.to, i) : ""), [Ye, P] = s.useState(() => t?.from ? new Date(t.from.year, t.from.month, 1) : b || /* @__PURE__ */ new Date());
+    const [m, M] = s.useState(!1), J = Ve(), { footerFlashKey: ke, footerFlashTarget: ve, popoverHandlers: xe } = Oe(g, m, J, G), w = s.useRef(!1), [c, R] = s.useState(t), [p, k] = s.useState(t?.from ? h(t.from, i) : ""), [y, v] = s.useState(t?.to ? h(t.to, i) : ""), [Ye, P] = s.useState(() => t?.from ? new Date(t.from.year, t.from.month, 1) : b || /* @__PURE__ */ new Date());
     s.useEffect(() => {
       k(t?.from ? h(t.from, i) : ""), v(t?.to ? h(t.to, i) : ""), R(t);
     }, [t, i]);
     const Ce = s.useCallback(
       (e) => Ke({
-        disabled: c ?? void 0,
+        disabled: f ?? void 0,
         showFooter: g,
         containerRef: S,
         popoverContentRef: K,
         setOpen: M
       })(e),
-      [c, g]
+      [f, g]
     ), Q = s.useRef(!1);
     s.useEffect(() => {
       if (m && !Q.current) {
-        const e = z(p, f);
-        e.parsed ? P(e.parsed) : d?.from ? P(new Date(d.from.year, d.from.month, 1)) : t?.from ? P(new Date(t.from.year, t.from.month, 1)) : b && P(b);
+        const e = z(p, d);
+        e.parsed ? P(e.parsed) : c?.from ? P(new Date(c.from.year, c.from.month, 1)) : t?.from ? P(new Date(t.from.year, t.from.month, 1)) : b && P(b);
       }
       Q.current = m;
-    }, [m, p, f, d?.from, t?.from, b]);
+    }, [m, p, d, c?.from, t?.from, b]);
     const be = (e) => {
       const r = Ue(e) ? e : void 0;
       R(r), r?.from && k(h(r.from, i)), r?.to && v(h(r.to, i)), !g && r?.from && r?.to && (r.from.month !== r.to.month || r.from.year !== r.to.year) && (n?.(r), M(!1));
     }, U = (e) => {
-      const r = Qe(e, d), o = F(r?.from, r?.to, O);
+      const r = Qe(e, c), o = F(r?.from, r?.to, O);
       o.swapped && (o.from && k(h(o.from, i)), o.to && v(h(o.to, i)), R({ from: o.from, to: o.to }), ee(S.current)), n?.({ from: o.from, to: o.to }), M(!1);
     }, B = () => {
       R(t), k(t?.from ? h(t.from, i) : ""), v(t?.to ? h(t.to, i) : ""), M(!1);
     }, j = () => {
       R(void 0), k(""), v(""), n?.(void 0), g || M(!1);
     }, Ie = (e) => {
-      const r = re(e.target.value, f, p);
+      const r = re(e.target.value, d, p);
       if (k(r), r === "") {
-        const l = { from: void 0, to: d?.to };
+        const l = { from: void 0, to: c?.to };
         R(l), g || n?.(l);
         return;
       }
-      const { parsed: o, isValid: a } = z(r, f);
+      const { parsed: o, isValid: a } = z(r, d);
       if (a && o) {
-        const T = { from: I(o), to: d?.to };
+        const T = { from: I(o), to: c?.to };
         R(T), P(o), g || n?.(T);
       }
     }, Pe = (e) => {
-      const r = re(e.target.value, f, y);
+      const r = re(e.target.value, d, y);
       if (v(r), r === "") {
-        const l = { from: d?.from, to: void 0 };
+        const l = { from: c?.from, to: void 0 };
         R(l), g || n?.(l);
         return;
       }
-      const { parsed: o, isValid: a } = z(r, f);
+      const { parsed: o, isValid: a } = z(r, d);
       if (a && o) {
-        const l = I(o), T = { from: d?.from, to: l };
+        const l = I(o), T = { from: c?.from, to: l };
         R(T), P(o), g || n?.(T);
       }
     }, N = s.useCallback((e, r) => {
       const o = F(e, r, O);
       return o.swapped && (o.from && k(h(o.from, i)), o.to && v(h(o.to, i)), ee(S.current)), { from: o.from, to: o.to };
     }, [i]), we = () => {
-      const e = V(p, f, Y), r = V(y, f, C);
+      const e = V(p, d, Y), r = V(y, d, C);
       e.resetToCommitted ? k(Y) : e.parsed && k(e.display), r.resetToCommitted ? v(C) : r.parsed && v(r.display);
-      let o = e.parsed ? I(e.parsed) : d?.from, a = r.parsed ? I(r.parsed) : d?.to;
+      let o = e.parsed ? I(e.parsed) : c?.from, a = r.parsed ? I(r.parsed) : c?.to;
       if ({ from: o, to: a } = N(o, a), o || a) {
         const l = { from: o, to: a };
         R(l), n?.(l);
@@ -131,9 +131,9 @@ const Ze = s.forwardRef(
         S,
         K,
         () => {
-          const e = A(p, f, Y), r = A(y, f, C);
+          const e = A(p, d, Y), r = A(y, d, C);
           e.resetToCommitted ? k(Y) : e.parsed && k(e.display), r.resetToCommitted ? v(C) : r.parsed && v(r.display);
-          let o = e.parsed ? I(e.parsed) : e.resetToCommitted ? t?.from : d?.from, a = r.parsed ? I(r.parsed) : r.resetToCommitted ? t?.to : d?.to;
+          let o = e.parsed ? I(e.parsed) : e.resetToCommitted ? t?.from : c?.from, a = r.parsed ? I(r.parsed) : r.resetToCommitted ? t?.to : c?.to;
           o && a && ({ from: o, to: a } = N(o, a));
           const l = o || a ? { from: o, to: a } : void 0;
           R(l), g || (l ? n?.(l) : !p && !y && n?.(void 0));
@@ -149,13 +149,13 @@ const Ze = s.forwardRef(
           we();
           return;
         }
-        const e = V(p, f, Y), r = V(y, f, C);
+        const e = V(p, d, Y), r = V(y, d, C);
         if (e.parsed || r.parsed) return;
         w.current = !0, M(!0);
       }
-    }, Y = t?.from ? h(t.from, i) : "", C = t?.to ? h(t.to, i) : "", De = p !== Y, Ee = y !== C, Se = te(p, f), Te = te(y, f), Z = x("datePicker.startMonth"), _ = x("datePicker.endMonth"), Be = s.useCallback(() => {
-      const e = A(p, f, Y), r = A(y, f, C);
-      let o = e.parsed ? I(e.parsed) : e.resetToCommitted ? t?.from : d?.from, a = r.parsed ? I(r.parsed) : r.resetToCommitted ? t?.to : d?.to;
+    }, Y = t?.from ? h(t.from, i) : "", C = t?.to ? h(t.to, i) : "", De = p !== Y, Ee = y !== C, Se = te(p, d), Te = te(y, d), Z = x("datePicker.startMonth"), _ = x("datePicker.endMonth"), Be = s.useCallback(() => {
+      const e = A(p, d, Y), r = A(y, d, C);
+      let o = e.parsed ? I(e.parsed) : e.resetToCommitted ? t?.from : c?.from, a = r.parsed ? I(r.parsed) : r.resetToCommitted ? t?.to : c?.to;
       o && a && ({ from: o, to: a } = N(o, a));
       const l = o || a ? { from: o, to: a } : void 0;
       return je({
@@ -164,6 +164,7 @@ const Ze = s.forwardRef(
         committedStart: Y,
         committedEnd: C,
         committedRange: t,
+        pendingRange: c,
         computeEffectiveRange: () => l,
         rangesEqual: Xe
       });
@@ -173,8 +174,8 @@ const Ze = s.forwardRef(
       Y,
       C,
       t,
+      c,
       d,
-      f,
       N
     ]);
     return s.useLayoutEffect(() => {
@@ -187,9 +188,9 @@ const Ze = s.forwardRef(
       {
         ref: G,
         "data-component": "month-range-picker",
-        "data-disabled": c || void 0,
+        "data-disabled": f || void 0,
         children: Re.wrapControl(
-          /* @__PURE__ */ D(He, { open: c ? !1 : m, onOpenChange: Ce, children: [
+          /* @__PURE__ */ D(He, { open: f ? !1 : m, onOpenChange: Ce, children: [
             /* @__PURE__ */ u(qe, { asChild: !0, children: /* @__PURE__ */ D(
               "div",
               {
@@ -199,7 +200,7 @@ const Ze = s.forwardRef(
                   "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",
                   q ? "border-destructive hover:border-destructive" : "border-field",
                   H === "sm" ? "h-6" : H === "md" ? "h-[28px]" : "h-8",
-                  c && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
+                  f && "pointer-events-none opacity-100 bg-disabled-surface border-stroke text-disabled-foreground hover:border-stroke",
                   "cursor-pointer",
                   fe
                 ),
@@ -213,12 +214,12 @@ const Ze = s.forwardRef(
                         value: p,
                         onChange: Ie,
                         onBlur: W,
-                        onClick: () => !c && M(!0),
+                        onClick: () => !f && M(!0),
                         onKeyDown: (e) => {
-                          e.key === "Enter" && !c && (e.preventDefault(), X()), e.key === "ArrowDown" && !m && !c && (e.preventDefault(), w.current = !0, M(!0)), e.key === "Escape" && m && (e.preventDefault(), B());
+                          e.key === "Enter" && !f && (e.preventDefault(), X()), e.key === "ArrowDown" && !m && !f && (e.preventDefault(), w.current = !0, M(!0)), e.key === "Escape" && m && (e.preventDefault(), B());
                         },
                         placeholder: m ? i === "YYYY/MM" ? "YYYY/MM" : x("datePicker.monthYearFormat") : Z,
-                        disabled: !!c,
+                        disabled: !!f,
                         "aria-label": Z,
                         "data-field": "start",
                         className: $(
@@ -236,12 +237,12 @@ const Ze = s.forwardRef(
                         value: y,
                         onChange: Pe,
                         onBlur: W,
-                        onClick: () => !c && M(!0),
+                        onClick: () => !f && M(!0),
                         onKeyDown: (e) => {
-                          e.key === "Enter" && !c && (e.preventDefault(), X()), e.key === "ArrowDown" && !m && !c && (e.preventDefault(), w.current = !0, M(!0)), e.key === "Escape" && m && (e.preventDefault(), B());
+                          e.key === "Enter" && !f && (e.preventDefault(), X()), e.key === "ArrowDown" && !m && !f && (e.preventDefault(), w.current = !0, M(!0)), e.key === "Escape" && m && (e.preventDefault(), B());
                         },
                         placeholder: m ? i === "YYYY/MM" ? "YYYY/MM" : x("datePicker.monthYearFormat") : _,
-                        disabled: !!c,
+                        disabled: !!f,
                         "aria-label": _,
                         "data-field": "end",
                         className: $(
@@ -252,7 +253,7 @@ const Ze = s.forwardRef(
                     )
                   ] }),
                   /* @__PURE__ */ D("div", { className: "flex items-center gap-1 shrink-0", children: [
-                    t?.from && !c && /* @__PURE__ */ D(oe, { children: [
+                    t?.from && !f && /* @__PURE__ */ D(oe, { children: [
                       /* @__PURE__ */ u(ne, { asChild: !0, children: /* @__PURE__ */ u(
                         "button",
                         {
@@ -273,9 +274,9 @@ const Ze = s.forwardRef(
                     ] }),
                     /* @__PURE__ */ D(oe, { children: [
                       /* @__PURE__ */ u(ne, { asChild: !0, children: /* @__PURE__ */ u("button", { type: "button", tabIndex: 0, "aria-label": x("datePicker.selectMonthRange"), onClick: (e) => {
-                        e.stopPropagation(), c || M(!m);
+                        e.stopPropagation(), f || M(!m);
                       }, onKeyDown: (e) => {
-                        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), c || (w.current = !0, M(!m)));
+                        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), f || (w.current = !0, M(!m)));
                       }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ u(Ae, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
                       /* @__PURE__ */ u(se, { variant: "tertiary", side: "top", children: x("datePicker.selectMonthRange") })
                     ] })
@@ -299,7 +300,7 @@ const Ze = s.forwardRef(
                   {
                     pickerType: "month",
                     monthMode: "range",
-                    selectedMonths: d,
+                    selectedMonths: c,
                     footerFlashKey: ke,
                     footerFlashTarget: ve,
                     onMonthSelect: be,

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

@@ -1,18 +1,18 @@
 import { jsxs as m, jsx as r } from "react/jsx-runtime";
 import * as o from "react";
-import { Cross as q, CalendarMonth as G } from "impact-nova-icons";
-import { format as J } from "date-fns";
-import { cn as Q } from "../../../lib/utils.js";
-import { Input as U } from "../input/input.js";
-import { Popover as W, PopoverAnchor as X, PopoverContent as Y } from "../../feedback/popover/popover.js";
-import { Calendar as Z } from "../../data-display/calendar/calendar.js";
+import { Cross as $, CalendarMonth as q } from "impact-nova-icons";
+import { format as G } from "date-fns";
+import { cn as J } from "../../../lib/utils.js";
+import { Input as Q } from "../input/input.js";
+import { Popover as U, PopoverAnchor as W, PopoverContent as X } from "../../feedback/popover/popover.js";
+import { Calendar as Y } from "../../data-display/calendar/calendar.js";
 import { Tooltip as D, TooltipTrigger as P, TooltipContent as k } from "../../feedback/tooltip/tooltip.js";
-import { useImpactNovaI18n as _ } from "../../../i18n/use-impact-nova-i18n.js";
-import { getDateFnsLocale as w } from "../../../i18n/getDateFnsLocale.js";
-import { coerceDateArrayApply as ee, coerceDateArray as te } from "./calendar-selection-adapters.js";
-import { usePickerDismissActionsRef as re, usePickerFooterDismissNudge as oe } from "./date-input-behavior.js";
-import { buildDateBoundsMatcher as ne } from "../../../lib/date-bounds-matcher.js";
-const se = o.forwardRef(
+import { useImpactNovaI18n as Z } from "../../../i18n/use-impact-nova-i18n.js";
+import { getDateFnsLocale as _ } from "../../../i18n/getDateFnsLocale.js";
+import { coerceDateArrayApply as w, coerceDateArray as ee } from "./calendar-selection-adapters.js";
+import { usePickerDismissActionsRef as te, usePickerFooterDismissNudge as re } from "./date-input-behavior.js";
+import { buildDateBoundsMatcher as oe } from "../../../lib/date-bounds-matcher.js";
+const ne = o.forwardRef(
   ({
     value: e,
     onChange: f,
@@ -27,36 +27,36 @@ const se = o.forwardRef(
     className: R,
     ...L
   }, v) => {
-    const { locale: u, t: i } = _(), F = o.useMemo(() => w(u), [u]), I = M ?? i("datePicker.selectMultipleDates"), [p, c] = o.useState(!1), h = o.useRef(null), y = re(), { footerFlashKey: S, footerFlashTarget: j, popoverHandlers: O } = oe(s, p, y, h), [l, d] = o.useState(e);
+    const { locale: u, t: i } = Z(), F = o.useMemo(() => _(u), [u]), I = M ?? i("datePicker.selectMultipleDates"), [p, c] = o.useState(!1), h = o.useRef(null), y = te(), { footerFlashKey: S, footerFlashTarget: j, popoverHandlers: O } = re(s, p, y, h), [l, d] = o.useState(e);
     o.useEffect(() => {
       d(e);
     }, [p, e]);
     const z = (t) => {
-      const n = te(t);
+      const n = ee(t);
       d(n), s || f?.(n);
     }, E = (t) => {
-      const n = ee(t, l);
+      const n = w(t, l);
       f?.(n), c(!1);
     }, g = () => {
       d(e), c(!1);
     }, C = () => {
       d(void 0), f?.(void 0), s || c(!1);
-    }, B = e && e.length > 0 ? e.length === 1 ? J(e[0], A, { locale: F }) : `${e.length} dates selected` : "", H = o.useCallback(() => {
-      const t = l?.length ?? 0, n = e?.length ?? 0, K = t === n && (l ?? []).every(
-        (V, $) => V.getTime() === e?.[$]?.getTime()
-      );
-      return t > 0 && !K ? "apply" : "cancel";
+    }, B = e && e.length > 0 ? e.length === 1 ? G(e[0], A, { locale: F }) : `${e.length} dates selected` : "", H = o.useCallback(() => {
+      const t = l?.length ?? 0, n = e?.length ?? 0;
+      return t === n && (l ?? []).every(
+        (K, V) => K.getTime() === e?.[V]?.getTime()
+      ) ? "dismiss" : t > 0 ? "apply" : "cancel";
     }, [l, e]);
     return o.useLayoutEffect(() => {
       y.current = {
         onDismiss: g,
         resolveFlash: H
       };
-    }), /* @__PURE__ */ m(W, { open: a ? !1 : p, onOpenChange: (t) => {
+    }), /* @__PURE__ */ m(U, { open: a ? !1 : p, onOpenChange: (t) => {
       a || !t && s || c(t);
     }, children: [
-      /* @__PURE__ */ r(X, { asChild: !0, children: /* @__PURE__ */ r("div", { ref: h, children: /* @__PURE__ */ r(
-        U,
+      /* @__PURE__ */ r(W, { asChild: !0, children: /* @__PURE__ */ r("div", { ref: h, children: /* @__PURE__ */ r(
+        Q,
         {
           ref: v,
           value: B,
@@ -66,7 +66,7 @@ const se = o.forwardRef(
           onClick: () => {
             !a && !p && c(!0);
           },
-          className: Q("cursor-pointer", R),
+          className: J("cursor-pointer", R),
           suffix: /* @__PURE__ */ m("div", { className: "flex items-center gap-1", children: [
             e && e.length > 0 && !a && /* @__PURE__ */ m(D, { children: [
               /* @__PURE__ */ r(P, { asChild: !0, children: /* @__PURE__ */ r(
@@ -79,13 +79,13 @@ const se = o.forwardRef(
                     t.stopPropagation(), C();
                   },
                   className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
-                  children: /* @__PURE__ */ r(q, { className: "size-3 hover:text-content" })
+                  children: /* @__PURE__ */ r($, { className: "size-3 hover:text-content" })
                 }
               ) }),
               /* @__PURE__ */ r(k, { variant: "tertiary", side: "top", children: i("calendar.clear") })
             ] }),
             /* @__PURE__ */ m(D, { children: [
-              /* @__PURE__ */ r(P, { asChild: !0, children: /* @__PURE__ */ r(G, { className: "h-4 w-4 text-secondary-foreground" }) }),
+              /* @__PURE__ */ r(P, { asChild: !0, children: /* @__PURE__ */ r(q, { className: "h-4 w-4 text-secondary-foreground" }) }),
               /* @__PURE__ */ r(k, { variant: "tertiary", side: "top", children: i("datePicker.selectMultipleDates") })
             ] })
           ] }),
@@ -93,7 +93,7 @@ const se = o.forwardRef(
         }
       ) }) }),
       /* @__PURE__ */ r(
-        Y,
+        X,
         {
           className: "w-auto p-0",
           align: "start",
@@ -101,14 +101,14 @@ const se = o.forwardRef(
           onOpenAutoFocus: (t) => t.preventDefault(),
           ...O,
           children: /* @__PURE__ */ r(
-            Z,
+            Y,
             {
               mode: "multiple",
               selected: l,
               footerFlashKey: S,
               footerFlashTarget: j,
               onSelect: z,
-              disabled: ne(x, N),
+              disabled: oe(x, N),
               startMonth: T,
               endMonth: b,
               showFooter: s,
@@ -123,7 +123,7 @@ const se = o.forwardRef(
     ] });
   }
 );
-se.displayName = "MultiDatePicker";
+ne.displayName = "MultiDatePicker";
 export {
-  se as MultiDatePicker
+  ne as MultiDatePicker
 };