impact-nova 2.6.0-alpha.0 → 2.6.0

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

@@ -1,116 +1,117 @@
-import { jsxs as m, jsx as r } from "react/jsx-runtime";
-import * as s from "react";
+import { jsxs as u, jsx as r } from "react/jsx-runtime";
+import * as n from "react";
 import { Cross as ne, CalendarMonth as oe } from "impact-nova-icons";
-import { format as W } from "date-fns";
+import { format as b } from "date-fns";
 import { cn as se } from "../../../lib/utils.js";
-import { Input as ie } from "../input/input.js";
-import { Popover as ae, PopoverAnchor as ce, PopoverContent as le } from "../../feedback/popover/popover.js";
+import { Input as ae } from "../input/input.js";
+import { Popover as ie, PopoverAnchor as ce, PopoverContent as le } from "../../feedback/popover/popover.js";
 import { Calendar as pe } from "../../data-display/calendar/calendar.js";
-import { Tooltip as b, TooltipTrigger as x, TooltipContent as A } from "../../feedback/tooltip/tooltip.js";
-import { usePickerI18n as de } from "./use-picker-i18n.js";
-import { coerceWeekArrayApply as fe, coerceWeekArray as ue } from "./calendar-selection-adapters.js";
-import { usePickerDismissActionsRef as me, usePickerFooterDismissNudge as he, handlePickerSurfacePointerDown as ke } from "./date-input-behavior.js";
-import { buildDateBoundsMatcher as ye } from "../../../lib/date-bounds-matcher.js";
-import { fiscalCalendarPassThrough as ge } from "./fiscal-pass-through.js";
-const Pe = (t, i = "MM/dd/yyyy", a) => {
-  const h = W(t.startDate, i, a ? { locale: a } : {}), k = W(t.endDate, i, a ? { locale: a } : {});
-  return `${h} - ${k}`;
-}, Ce = s.forwardRef(
+import { Tooltip as x, TooltipTrigger as A, TooltipContent as M } from "../../feedback/tooltip/tooltip.js";
+import { useImpactNovaI18n as de } from "../../../i18n/use-impact-nova-i18n.js";
+import { getDateFnsLocale as fe } from "../../../i18n/getDateFnsLocale.js";
+import { coerceWeekArrayApply as me, coerceWeekArray as ue } from "./calendar-selection-adapters.js";
+import { usePickerDismissActionsRef as he, usePickerFooterDismissNudge as ye, handlePickerSurfacePointerDown as ke } from "./date-input-behavior.js";
+import { buildDateBoundsMatcher as ge } from "../../../lib/date-bounds-matcher.js";
+import { fiscalCalendarPassThrough as Pe } from "./fiscal-pass-through.js";
+const Ce = (t, a = "MM/dd/yyyy", i) => {
+  const h = b(t.startDate, a, i ? { locale: i } : {}), y = b(t.endDate, a, i ? { locale: i } : {});
+  return `${h} - ${y}`;
+}, De = n.forwardRef(
   ({
     value: t,
-    onChange: i,
-    format: a,
+    onChange: a,
+    format: i = "MM/dd/yyyy",
     placeholder: h,
-    minDate: k,
-    maxDate: T,
-    startMonth: N,
+    minDate: y,
+    maxDate: N,
+    startMonth: T,
     endMonth: R,
     showFooter: d = !0,
     calendarKind: S,
-    fiscalMode: M = "basic",
+    fiscalMode: v = "basic",
     granularity: w,
-    fiscalMonthPattern: v,
-    fiscalYearStartMonth: O = 1,
-    fiscalConfig: j,
-    weekStartsOn: F,
-    showPresets: I,
+    fiscalMonthPattern: I,
+    fiscalYearStartMonth: L = 1,
+    fiscalConfig: O,
+    weekStartsOn: j,
+    showPresets: F,
     showPeriodBoundaries: E,
     autoNavigateToAvailable: K,
-    comparison: L,
-    onComparisonChange: $,
-    disabled: n,
-    className: z,
-    ...V
-  }, q) => {
-    const { dateFnsLocale: B, dateFormat: H, t: c } = de(a), G = h ?? c("datePicker.selectWeeks"), [l, o] = s.useState(!1), y = s.useRef(!1), g = s.useRef(null), P = me(), { footerFlashKey: J, footerFlashTarget: Q, popoverHandlers: U } = he(d, l, P, g), [f, u] = s.useState(t);
-    s.useEffect(() => {
-      u(t);
+    comparison: $,
+    onComparisonChange: z,
+    disabled: o,
+    className: V,
+    ...q
+  }, B) => {
+    const { locale: P, t: c } = de(), H = n.useMemo(() => fe(P), [P]), G = h ?? c("datePicker.selectWeeks"), [l, s] = n.useState(!1), k = n.useRef(!1), g = n.useRef(null), C = he(), { footerFlashKey: J, footerFlashTarget: Q, popoverHandlers: U } = ye(d, l, C, g), [f, m] = n.useState(t);
+    n.useEffect(() => {
+      m(t);
     }, [l, t]);
     const X = (e) => {
       const p = ue(e);
-      u(p), d || i?.(p);
+      m(p), d || a?.(p);
     }, Y = (e) => {
-      const p = fe(e, f);
-      i?.(p), o(!1);
-    }, C = () => {
-      u(t), o(!1);
+      const p = me(e, f);
+      a?.(p), s(!1);
     }, D = () => {
-      u(void 0), i?.(void 0), d || o(!1);
-    }, Z = t && t.length > 0 ? t.length === 1 ? Pe(t[0], H, B) : `${t.length} weeks selected` : "", _ = (e) => {
-      n || !e && d || o(e);
-    }, ee = s.useCallback(() => {
+      m(t), s(!1);
+    }, W = () => {
+      m(void 0), a?.(void 0), d || s(!1);
+    }, Z = t && t.length > 0 ? t.length === 1 ? Ce(t[0], i, H) : `${t.length} weeks selected` : "", _ = (e) => {
+      o || !e && d || s(e);
+    }, ee = n.useCallback(() => {
       const e = f?.length ?? 0, p = t?.length ?? 0;
       return e === p && (f ?? []).every(
         (te, re) => te.startDate.getTime() === t?.[re]?.startDate.getTime()
       ) ? "dismiss" : e > 0 ? "apply" : "cancel";
     }, [f, t]);
-    return s.useLayoutEffect(() => {
-      P.current = {
-        onDismiss: C,
+    return n.useLayoutEffect(() => {
+      C.current = {
+        onDismiss: D,
         resolveFlash: ee
       };
-    }), /* @__PURE__ */ m(ae, { open: n ? !1 : l, onOpenChange: _, children: [
+    }), /* @__PURE__ */ u(ie, { open: o ? !1 : l, onOpenChange: _, children: [
       /* @__PURE__ */ r(ce, { asChild: !0, children: /* @__PURE__ */ r(
         "div",
         {
           ref: g,
           onPointerDown: (e) => ke({
-            disabled: n,
+            disabled: o,
             event: e,
-            onOpen: () => o(!0),
+            onOpen: () => s(!0),
             focusField: () => g.current?.querySelector("input")?.focus()
           }),
           children: /* @__PURE__ */ r(
-            ie,
+            ae,
             {
-              ref: q,
+              ref: B,
               value: Z,
               placeholder: G,
               readOnly: !0,
-              disabled: n,
+              disabled: o,
               onClick: () => {
-                !n && !l && o(!0);
+                !o && !l && s(!0);
               },
-              className: se("cursor-pointer", z),
-              suffix: /* @__PURE__ */ m("div", { className: "flex items-center gap-1", children: [
-                t && t.length > 0 && !n && /* @__PURE__ */ m(b, { children: [
-                  /* @__PURE__ */ r(x, { asChild: !0, children: /* @__PURE__ */ r(
+              className: se("cursor-pointer", V),
+              suffix: /* @__PURE__ */ u("div", { className: "flex items-center gap-1", children: [
+                t && t.length > 0 && !o && /* @__PURE__ */ u(x, { children: [
+                  /* @__PURE__ */ r(A, { asChild: !0, children: /* @__PURE__ */ r(
                     "button",
                     {
                       type: "button",
                       tabIndex: 0,
                       "aria-label": c("calendar.clear"),
                       onClick: (e) => {
-                        e.stopPropagation(), D();
+                        e.stopPropagation(), W();
                       },
                       className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
                       children: /* @__PURE__ */ r(ne, { className: "size-3 hover:text-content" })
                     }
                   ) }),
-                  /* @__PURE__ */ r(A, { variant: "tertiary", side: "top", children: c("calendar.clear") })
+                  /* @__PURE__ */ r(M, { variant: "tertiary", side: "top", children: c("calendar.clear") })
                 ] }),
-                /* @__PURE__ */ m(b, { children: [
-                  /* @__PURE__ */ r(x, { asChild: !0, children: /* @__PURE__ */ r(
+                /* @__PURE__ */ u(x, { children: [
+                  /* @__PURE__ */ r(A, { asChild: !0, children: /* @__PURE__ */ r(
                     "button",
                     {
                       type: "button",
@@ -118,19 +119,19 @@ const Pe = (t, i = "MM/dd/yyyy", a) => {
                       "data-component": "calendar-trigger",
                       "aria-label": c("datePicker.selectWeeks"),
                       onPointerDown: (e) => {
-                        e.preventDefault(), e.stopPropagation(), n || o(!l);
+                        e.preventDefault(), e.stopPropagation(), o || s(!l);
                       },
                       onKeyDown: (e) => {
-                        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), n || (y.current = !0, o(!l)));
+                        (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), o || (k.current = !0, s(!l)));
                       },
                       className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer",
                       children: /* @__PURE__ */ r(oe, { className: "h-4 w-4 text-secondary-foreground" })
                     }
                   ) }),
-                  /* @__PURE__ */ r(A, { variant: "tertiary", side: "top", children: c("datePicker.selectWeeks") })
+                  /* @__PURE__ */ r(M, { variant: "tertiary", side: "top", children: c("datePicker.selectWeeks") })
                 ] })
               ] }),
-              ...V
+              ...q
             }
           )
         }
@@ -142,7 +143,7 @@ const Pe = (t, i = "MM/dd/yyyy", a) => {
           align: "start",
           "aria-label": c("datePicker.selectWeeks"),
           onOpenAutoFocus: (e) => {
-            y.current || e.preventDefault(), y.current = !1;
+            k.current || e.preventDefault(), k.current = !1;
           },
           ...U,
           children: /* @__PURE__ */ r(
@@ -154,27 +155,27 @@ const Pe = (t, i = "MM/dd/yyyy", a) => {
               footerFlashKey: J,
               footerFlashTarget: Q,
               onWeekSelect: X,
-              disabled: ye(k, T),
-              startMonth: N,
+              disabled: ge(y, N),
+              startMonth: T,
               endMonth: R,
               showFooter: d,
-              ...ge({
+              ...Pe({
                 calendarKind: S,
-                fiscalMode: M,
+                fiscalMode: v,
                 granularity: w,
-                fiscalMonthPattern: v,
-                fiscalYearStartMonth: O,
-                fiscalConfig: j,
-                weekStartsOn: F,
-                showPresets: I,
+                fiscalMonthPattern: I,
+                fiscalYearStartMonth: L,
+                fiscalConfig: O,
+                weekStartsOn: j,
+                showPresets: F,
                 showPeriodBoundaries: E,
                 autoNavigateToAvailable: K,
-                comparison: L,
-                onComparisonChange: $
+                comparison: $,
+                onComparisonChange: z
               }),
               onApply: Y,
-              onCancel: C,
-              onClear: D,
+              onCancel: D,
+              onClear: W,
               captionLayout: "dropdown"
             }
           )
@@ -183,7 +184,7 @@ const Pe = (t, i = "MM/dd/yyyy", a) => {
     ] });
   }
 );
-Ce.displayName = "MultiWeekPicker";
+De.displayName = "MultiWeekPicker";
 export {
-  Ce as MultiWeekPicker
+  De as MultiWeekPicker
 };

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

@@ -1,73 +1,73 @@
 import { jsx as r, jsxs as y } from "react/jsx-runtime";
 import * as n from "react";
-import { Cross as ee, CalendarMonth as te } from "impact-nova-icons";
-import { cn as re } from "../../../lib/utils.js";
-import { Input as ne } from "../input/input.js";
-import { Calendar as oe } from "../../data-display/calendar/calendar.js";
+import { Cross as te, CalendarMonth as re } from "impact-nova-icons";
+import { cn as ne } from "../../../lib/utils.js";
+import { Input as oe } from "../input/input.js";
+import { Calendar as ae } from "../../data-display/calendar/calendar.js";
 import { Tooltip as M, TooltipTrigger as x, TooltipContent as R } from "../../feedback/tooltip/tooltip.js";
-import { useImpactNovaI18n as ae } from "../../../i18n/use-impact-nova-i18n.js";
-import { buildDateBoundsMatcher as ie } from "../../../lib/date-bounds-matcher.js";
+import { useImpactNovaI18n as ie } from "../../../i18n/use-impact-nova-i18n.js";
+import { buildDateBoundsMatcher as le } from "../../../lib/date-bounds-matcher.js";
 import { fiscalCalendarPassThrough as se } from "./fiscal-pass-through.js";
 import { DatePickerShell as ce } from "./date-picker-shell.js";
-import { usePickerDismissActionsRef as le, usePickerFooterDismissNudge as pe, handleReadonlyPickerKeyDown as fe, handlePickerSurfacePointerDown as de } from "./date-input-behavior.js";
-import { formatYearInput as ue } from "../../data-display/calendar/calendar-fiscal-labels.js";
-import { viewMonthFromYear as me } from "../../data-display/calendar/calendar-year-utils.js";
-const he = n.forwardRef(
+import { usePickerDismissActionsRef as pe, usePickerFooterDismissNudge as ue, handleReadonlyPickerKeyDown as fe, handlePickerSurfacePointerDown as de } from "./date-input-behavior.js";
+import { formatYearInput as me } from "../../data-display/calendar/calendar-fiscal-labels.js";
+import { viewMonthFromYear as he } from "../../data-display/calendar/calendar-year-utils.js";
+const ye = n.forwardRef(
   ({
-    value: t,
-    onChange: f,
-    placeholder: D,
-    minDate: Y,
-    maxDate: N,
-    startMonth: S,
-    endMonth: A,
-    showFooter: c = !0,
+    value: g,
+    onChange: u,
+    placeholder: Y,
+    minDate: D,
+    maxDate: A,
+    startMonth: N,
+    endMonth: S,
+    showFooter: s = !0,
     disabled: o,
     className: I,
     calendarKind: O,
     fiscalMode: T,
     granularity: w,
-    fiscalMonthPattern: v,
-    fiscalYearStartMonth: K,
-    fiscalConfig: g,
-    weekStartsOn: j,
-    showPresets: F,
-    showPeriodBoundaries: L,
-    autoNavigateToAvailable: z,
-    showIntervalCaption: E = !1,
-    ...H
-  }, V) => {
-    const { t: a } = ae(), B = D ?? a("datePicker.selectMultipleYears"), q = g?.fyLabel ?? "fy-long", d = n.useRef(null), k = n.useRef(null);
-    n.useImperativeHandle(V, () => d.current);
-    const [i, s] = n.useState(!1), u = n.useRef(!1), P = le(), { footerFlashKey: G, footerFlashTarget: J, popoverHandlers: Q } = pe(c, i, P, k), [C, l] = n.useState(t), [U, W] = n.useState(me(t?.[0]));
+    fiscalMonthPattern: K,
+    fiscalYearStartMonth: j,
+    fiscalConfig: k,
+    weekStartsOn: F,
+    showPresets: L,
+    showPeriodBoundaries: z,
+    autoNavigateToAvailable: E,
+    showIntervalCaption: H = !1,
+    ...V
+  }, B) => {
+    const { t: a } = ie(), q = Y ?? a("datePicker.selectMultipleYears"), G = k?.fyLabel ?? "fy-long", f = n.useRef(null), P = n.useRef(null);
+    n.useImperativeHandle(B, () => f.current);
+    const [i, l] = n.useState(!1), d = n.useRef(!1), v = pe(), { footerFlashKey: J, footerFlashTarget: Q, popoverHandlers: U } = ue(s, i, v, P), t = Array.isArray(g) ? g : void 0, [C, c] = n.useState(t), [W, X] = n.useState(he(t?.[0]));
     n.useEffect(() => {
-      i || l(t);
+      i || c(t);
     }, [i, t]);
-    const m = n.useCallback(() => s(!1), []), X = se({
+    const m = n.useCallback(() => l(!1), []), Z = se({
       calendarKind: O,
       fiscalMode: T,
       granularity: w,
-      fiscalMonthPattern: v,
-      fiscalYearStartMonth: K,
-      fiscalConfig: g,
-      weekStartsOn: j,
-      showPresets: F,
-      showPeriodBoundaries: L,
-      autoNavigateToAvailable: z
-    }), Z = (e) => {
+      fiscalMonthPattern: K,
+      fiscalYearStartMonth: j,
+      fiscalConfig: k,
+      weekStartsOn: F,
+      showPresets: L,
+      showPeriodBoundaries: z,
+      autoNavigateToAvailable: E
+    }), _ = (e) => {
       const p = Array.isArray(e) && e.length > 0 ? e : void 0;
-      l(p), c || f?.(p);
-    }, _ = () => {
-      f?.(C), m();
+      c(p), s || u?.(p);
+    }, $ = () => {
+      u?.(C), m();
     }, h = () => {
-      l(t), m();
+      c(t), m();
     }, b = () => {
-      l(void 0), f?.(void 0), c || m();
+      c(void 0), u?.(void 0), s || m();
     };
     n.useLayoutEffect(() => {
-      P.current = { onDismiss: h, resolveFlash: () => "cancel" };
+      v.current = { onDismiss: h, resolveFlash: () => "cancel" };
     });
-    const $ = t && t.length > 0 ? t.length === 1 ? ue(t[0], q) : a("datePicker.yearsSelected", { count: t.length }) : "";
+    const ee = t && t.length > 0 ? t.length === 1 ? me(t[0], G) : a("datePicker.yearsSelected", { count: t.length }) : "";
     return /* @__PURE__ */ r(
       ce,
       {
@@ -75,44 +75,44 @@ const he = n.forwardRef(
         disabled: o,
         ariaLabel: a("datePicker.selectMultipleYears"),
         onOpenChange: (e) => {
-          o || s(e);
+          o || l(e);
         },
         onOpenAutoFocus: (e) => {
-          u.current || e.preventDefault(), u.current = !1;
+          d.current || e.preventDefault(), d.current = !1;
         },
-        popoverHandlers: Q,
+        popoverHandlers: U,
         trigger: /* @__PURE__ */ r(
           "div",
           {
-            ref: k,
+            ref: P,
             "data-component": "multi-year-picker",
             "data-state": i ? "open" : "closed",
             onPointerDown: (e) => de({
               disabled: o,
               event: e,
-              onOpen: () => s(!0),
-              focusField: () => d.current?.focus()
+              onOpen: () => l(!0),
+              focusField: () => f.current?.focus()
             }),
             children: /* @__PURE__ */ r(
-              ne,
+              oe,
               {
-                ref: d,
-                value: $,
+                ref: f,
+                value: ee,
                 readOnly: !0,
                 onKeyDown: (e) => fe(e, {
                   disabled: o,
                   open: i,
-                  onOpen: () => s(!0),
+                  onOpen: () => l(!0),
                   onCancel: h,
                   onKeyboardOpen: () => {
-                    u.current = !0;
+                    d.current = !0;
                   }
                 }),
-                onClick: () => !o && s(!0),
-                placeholder: B,
+                onClick: () => !o && l(!0),
+                placeholder: q,
                 disabled: o,
                 "data-form-control": "input",
-                className: re("cursor-pointer", I),
+                className: ne("cursor-pointer", I),
                 suffix: /* @__PURE__ */ y("div", { className: "flex items-center gap-1", children: [
                   t && t.length > 0 && !o ? /* @__PURE__ */ y(M, { children: [
                     /* @__PURE__ */ r(x, { asChild: !0, children: /* @__PURE__ */ r(
@@ -125,7 +125,7 @@ const he = n.forwardRef(
                           e.stopPropagation(), b();
                         },
                         className: "inline-flex size-4 items-center justify-center border-none bg-transparent p-0",
-                        children: /* @__PURE__ */ r(ee, { className: "size-3 hover:text-content" })
+                        children: /* @__PURE__ */ r(te, { className: "size-3 hover:text-content" })
                       }
                     ) }),
                     /* @__PURE__ */ r(R, { variant: "tertiary", side: "top", children: a("calendar.clear") })
@@ -139,47 +139,47 @@ const he = n.forwardRef(
                         "data-component": "calendar-trigger",
                         "aria-label": a("datePicker.selectMultipleYears"),
                         onClick: (e) => {
-                          e.stopPropagation(), o || s((p) => !p);
+                          e.stopPropagation(), o || l((p) => !p);
                         },
                         className: "inline-flex items-center justify-center border-none bg-transparent p-0",
-                        children: /* @__PURE__ */ r(te, { className: "h-4 w-4 text-secondary-foreground" })
+                        children: /* @__PURE__ */ r(re, { className: "h-4 w-4 text-secondary-foreground" })
                       }
                     ) }),
                     /* @__PURE__ */ r(R, { variant: "tertiary", side: "top", children: a("datePicker.selectMultipleYears") })
                   ] })
                 ] }),
-                ...H
+                ...V
               }
             )
           }
         ),
         children: /* @__PURE__ */ r(
-          oe,
+          ae,
           {
             pickerType: "year",
             yearMode: "multiple",
             selectedYear: C,
-            footerFlashKey: G,
-            footerFlashTarget: J,
-            onYearSelect: Z,
-            month: U,
-            onMonthChange: W,
-            disabled: ie(Y, N),
-            startMonth: S,
-            endMonth: A,
-            showFooter: c,
-            onApply: _,
+            footerFlashKey: J,
+            footerFlashTarget: Q,
+            onYearSelect: _,
+            month: W,
+            onMonthChange: X,
+            disabled: le(D, A),
+            startMonth: N,
+            endMonth: S,
+            showFooter: s,
+            onApply: $,
             onCancel: h,
             onClear: b,
-            showIntervalCaption: E,
-            ...X
+            showIntervalCaption: H,
+            ...Z
           }
         )
       }
     );
   }
 );
-he.displayName = "MultiYearPicker";
+ye.displayName = "MultiYearPicker";
 export {
-  he as MultiYearPicker
+  ye as MultiYearPicker
 };