impact-nova 2.5.6 → 2.5.8

package/dist/components/forms/date-picker/date-input-behavior.js

@@ -1,12 +1,12 @@
 import { parse as h, isValid as D } from "date-fns";
 import * as d from "react";
-import { resolveRangeFooterFlashTarget as v } from "../../data-display/calendar/calendar-footer-emphasis.js";
-import { padValidDateString as y, maskDate as k } from "../../../lib/utils.js";
-function T(e, t, n) {
+import { resolveRangeFooterFlashTarget as y } from "../../data-display/calendar/calendar-footer-emphasis.js";
+import { padValidDateString as v, maskDate as k } from "../../../lib/utils.js";
+function I(e, t, n) {
   return k(e, t, n);
 }
 function f(e, t, n) {
-  const r = y(e, t), s = h(r, t, /* @__PURE__ */ new Date(), n ? { locale: n } : {}), a = D(s) && r.length === t.length;
+  const r = v(e, t), s = h(r, t, /* @__PURE__ */ new Date(), n ? { locale: n } : {}), a = D(s) && r.length === t.length;
   return {
     padded: r,
     parsed: a ? s : void 0,
@@ -14,7 +14,7 @@ function f(e, t, n) {
     isValid: a
   };
 }
-function C(e, t, n) {
+function T(e, t, n) {
   return !e || e.length !== t.length ? !1 : !f(e, t, n).isValid;
 }
 function m(e, t) {
@@ -42,7 +42,10 @@ function O(e, t) {
   const n = e.target;
   return n instanceof Node ? !!t.current?.contains(n) : !1;
 }
-function V({
+function V(e, t) {
+  t.disabled || (e.key === "ArrowDown" && !t.open && (e.preventDefault(), t.onKeyboardOpen?.(), t.onOpen()), e.key === "Escape" && t.open && (e.preventDefault(), t.onCancel()));
+}
+function b({
   disabled: e,
   event: t,
   onOpen: n,
@@ -74,11 +77,11 @@ function F(e, t, n, r) {
     } : void 0
   } : {};
 }
-function b(e, t, n) {
+function B(e, t, n) {
   const r = e == null, s = t == null;
   return r && s || !r && !s && n(e, t) ? "dismiss" : r ? "cancel" : "apply";
 }
-function B(e) {
+function q(e) {
   const {
     startInput: t,
     endInput: n,
@@ -89,18 +92,18 @@ function B(e) {
     computeEffectiveRange: u,
     rangesEqual: o
   } = e, c = t !== r || n !== s, l = u(), p = !c && i !== void 0 ? i : l, g = !o(p, a);
-  return !c && !g ? "dismiss" : v(
+  return !c && !g ? "dismiss" : y(
     c ? l : p
   ) === "apply" ? "apply" : "cancel";
 }
-function q() {
+function M() {
   return d.useRef({
     onDismiss: () => {
     },
     resolveFlash: () => "cancel"
   });
 }
-function M(e, t, n, r) {
+function K(e, t, n, r) {
   const [s, a] = d.useState({ key: 0, target: "cancel" }), i = d.useRef(t);
   d.useLayoutEffect(() => {
     i.current !== t && (i.current = t, a({ key: 0, target: "cancel" }));
@@ -152,13 +155,13 @@ function x(e, t, n) {
 function H(e, t, n) {
   return e === void 0 || t === void 0 ? { from: e, to: t, swapped: !1 } : n(e, t) <= 0 ? { from: e, to: t, swapped: !1 } : { from: t, to: e, swapped: !0 };
 }
-function K(e, t) {
+function L(e, t) {
   return e.year * 12 + e.month - (t.year * 12 + t.month);
 }
-function L(e, t) {
+function z(e, t) {
   return e.getTime() - t.getTime();
 }
-function z(e) {
+function W(e) {
   if (!e || typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches)
     return;
   const t = e.querySelector('[data-field="start"]'), n = e.querySelector('[data-field="end"]');
@@ -173,24 +176,25 @@ function z(e) {
   ));
 }
 export {
-  L as compareDates,
-  K as compareMonthSelection,
+  z as compareDates,
+  L as compareMonthSelection,
   S as createRangePickerOpenChangeHandler,
   N as deferRangeInputBlur,
-  z as flashRangeReorder,
-  V as handlePickerSurfacePointerDown,
-  C as isDateInputInvalid,
+  W as flashRangeReorder,
+  b as handlePickerSurfacePointerDown,
+  V as handleReadonlyPickerKeyDown,
+  T as isDateInputInvalid,
   O as isEventOnPickerSurface,
   m as isFocusInsidePicker,
-  T as maskDateInput,
+  I as maskDateInput,
   H as normalizeOrderedRange,
   f as parseDateInput,
   F as preventOutsideDismissWhenFooter,
   P as resolveDateInputOnBlur,
   x as resolveDateInputOnEnter,
   X as resolveRangeFieldBlur,
-  B as resolveRangePickerDismissFlash,
-  b as resolveSingleValueDismissFlash,
-  q as usePickerDismissActionsRef,
-  M as usePickerFooterDismissNudge
+  q as resolveRangePickerDismissFlash,
+  B as resolveSingleValueDismissFlash,
+  M as usePickerDismissActionsRef,
+  K as usePickerFooterDismissNudge
 };

package/dist/components/forms/date-picker/date-picker-shell.d.ts

@@ -0,0 +1,13 @@
+import { PopoverContent } from '../../feedback/popover';
+import * as React from "react";
+export interface DatePickerShellProps {
+    open: boolean;
+    disabled?: boolean | null;
+    ariaLabel: string;
+    onOpenChange: (open: boolean) => void;
+    onOpenAutoFocus?: (event: Event) => void;
+    popoverHandlers?: React.ComponentProps<typeof PopoverContent>;
+    children: React.ReactNode;
+    trigger: React.ReactNode;
+}
+export declare function DatePickerShell({ open, disabled, ariaLabel, onOpenChange, onOpenAutoFocus, popoverHandlers, children, trigger, }: DatePickerShellProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,31 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import "react";
+import { Popover as c, PopoverAnchor as m, PopoverContent as h } from "../../feedback/popover/popover.js";
+function d({
+  open: o,
+  disabled: e,
+  ariaLabel: t,
+  onOpenChange: a,
+  onOpenAutoFocus: i,
+  popoverHandlers: l,
+  children: n,
+  trigger: p
+}) {
+  return /* @__PURE__ */ s(c, { open: e ? !1 : o, onOpenChange: a, children: [
+    /* @__PURE__ */ r(m, { asChild: !0, children: p }),
+    /* @__PURE__ */ r(
+      h,
+      {
+        className: "w-auto p-0",
+        align: "start",
+        "aria-label": t,
+        onOpenAutoFocus: i,
+        ...l,
+        children: n
+      }
+    )
+  ] });
+}
+export {
+  d as DatePickerShell
+};

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

@@ -1,69 +1,79 @@
-import { jsxs as x, jsx as o } from "react/jsx-runtime";
+import { jsx as s, jsxs as S } from "react/jsx-runtime";
 import * as r from "react";
-import { Cross as se, CalendarMonth as le } from "impact-nova-icons";
-import { format as w } from "date-fns";
-import { cn as ce } from "../../../lib/utils.js";
-import { usePickerDismissActionsRef as ae, usePickerFooterDismissNudge as pe, isDateInputInvalid as ue, resolveSingleValueDismissFlash as fe, handlePickerSurfacePointerDown as de, maskDateInput as me, parseDateInput as he, resolveDateInputOnBlur as De, resolveDateInputOnEnter as ge } from "./date-input-behavior.js";
-import { Input as ye } from "../input/input.js";
-import { Popover as ke, PopoverAnchor as ve, PopoverContent as Ce } from "../../feedback/popover/popover.js";
-import { Calendar as Ie } from "../../data-display/calendar/calendar.js";
+import { Cross as he, CalendarMonth as De } from "impact-nova-icons";
+import { format as b } from "date-fns";
+import { cn as ge } from "../../../lib/utils.js";
+import { usePickerDismissActionsRef as ye, usePickerFooterDismissNudge as ke, isDateInputInvalid as ve, resolveSingleValueDismissFlash as Ie, handlePickerSurfacePointerDown as Ce, maskDateInput as Pe, parseDateInput as Me, resolveDateInputOnBlur as xe, resolveDateInputOnEnter as Re } from "./date-input-behavior.js";
+import { Input as Se } from "../input/input.js";
+import { Calendar as be } from "../../data-display/calendar/calendar.js";
 import { Tooltip as j, TooltipTrigger as B, TooltipContent as K } from "../../feedback/tooltip/tooltip.js";
-import { useImpactNovaI18n as Pe } from "../../../i18n/use-impact-nova-i18n.js";
-import { getDateFnsLocale as Me } from "../../../i18n/getDateFnsLocale.js";
-import { createComponent as xe } from "../../../lib/primitives/create-component.js";
-import { coerceSingleDateApply as Re, coerceSingleDate as be } from "./calendar-selection-adapters.js";
-import { buildDateBoundsMatcher as we } from "../../../lib/date-bounds-matcher.js";
-const Ge = xe(
+import { useImpactNovaI18n as we } from "../../../i18n/use-impact-nova-i18n.js";
+import { getDateFnsLocale as Te } from "../../../i18n/getDateFnsLocale.js";
+import { createComponent as Ee } from "../../../lib/primitives/create-component.js";
+import { coerceSingleDateApply as Ae, coerceSingleDate as Ne } from "./calendar-selection-adapters.js";
+import { buildDateBoundsMatcher as Le } from "../../../lib/date-bounds-matcher.js";
+import { fiscalCalendarPassThrough as Oe } from "./fiscal-pass-through.js";
+import { DatePickerShell as Ve } from "./date-picker-shell.js";
+const $e = Ee(
   "DatePicker",
   ({
     value: n,
-    onChange: u,
-    format: c = "MM/dd/yyyy",
+    onChange: p,
+    format: l = "MM/dd/yyyy",
     placeholder: z,
     minDate: H,
     maxDate: q,
     startMonth: G,
     endMonth: J,
     showFooter: a = !0,
-    weekStartsOn: S,
-    disabled: l,
+    weekStartsOn: w,
+    disabled: c,
     className: Q,
-    ...U
-  }, W) => {
-    const { locale: T, t: h } = Pe(), f = r.useMemo(() => Me(T), [T]), X = z ?? h("datePicker.selectDate"), g = r.useRef(null), A = r.useRef(null), I = r.useRef(null);
-    r.useImperativeHandle(W, () => g.current);
-    const [i, E] = r.useState(!1), N = ae(), { footerFlashKey: Y, footerFlashTarget: Z, popoverHandlers: _ } = pe(a, i, N, A), y = r.useRef(!1), [R, s] = r.useState(null), k = n ? w(n, c, { locale: f }) : "", d = R?.input ?? k, P = i ? R?.pending ?? n : n, $ = R?.viewMonth ?? n ?? /* @__PURE__ */ new Date(), p = r.useCallback(() => {
-      s(null), E(!1);
+    calendarKind: U,
+    fiscalMode: W,
+    granularity: X,
+    fiscalMonthPattern: Y,
+    fiscalYearStartMonth: Z,
+    fiscalConfig: _,
+    showPresets: $,
+    comparison: F,
+    onComparisonChange: ee,
+    ...te
+  }, ne) => {
+    const { locale: T, t: h } = we(), f = r.useMemo(() => Te(T), [T]), re = z ?? h("datePicker.selectDate"), g = r.useRef(null), E = r.useRef(null), C = r.useRef(null);
+    r.useImperativeHandle(ne, () => g.current);
+    const [i, A] = r.useState(!1), N = ye(), { footerFlashKey: ie, footerFlashTarget: oe, popoverHandlers: se } = ke(a, i, N, E), y = r.useRef(!1), [x, o] = r.useState(null), k = n ? b(n, l, { locale: f }) : "", d = x?.input ?? k, P = i ? x?.pending ?? n : n, ce = x?.viewMonth ?? n ?? /* @__PURE__ */ new Date(), u = r.useCallback(() => {
+      o(null), A(!1);
     }, []), m = (e) => {
-      if (!l) {
+      if (!c) {
         if (e) {
-          s({
+          o({
             input: k,
             pending: n,
             viewMonth: n ?? /* @__PURE__ */ new Date()
-          }), E(!0);
+          }), A(!0);
           return;
         }
-        p();
+        u();
       }
     };
     r.useEffect(() => {
-      g.current && I.current !== null && (g.current.setSelectionRange(I.current, I.current), I.current = null);
+      g.current && C.current !== null && (g.current.setSelectionRange(C.current, C.current), C.current = null);
     }, [d]);
-    const F = (e) => {
-      const t = be(e), D = t ? w(t, c, { locale: f }) : "";
-      s(
+    const le = (e) => {
+      const t = Ne(e), D = t ? b(t, l, { locale: f }) : "";
+      o(
         (v) => v ? { ...v, pending: t, input: D, viewMonth: t ?? v.viewMonth } : null
-      ), t && !a && (u?.(t), p());
-    }, O = (e) => {
-      const t = Re(e, P);
-      u?.(t), p();
-    }, b = () => {
-      p();
-    }, V = () => {
-      u?.(void 0), a ? s(
+      ), t && !a && (p?.(t), u());
+    }, L = (e) => {
+      const t = Ae(e, P);
+      p?.(t), u();
+    }, R = () => {
+      u();
+    }, O = () => {
+      p?.(void 0), a ? o(
         (e) => e ? { ...e, pending: void 0, input: "" } : null
-      ) : p();
+      ) : u();
     }, M = r.useCallback(
       () => ({
         input: k,
@@ -71,59 +81,59 @@ const Ge = xe(
         viewMonth: n ?? /* @__PURE__ */ new Date()
       }),
       [k, n]
-    ), ee = (e) => {
-      const t = me(e.target.value, c, d);
-      if (s((C) => ({ ...C ?? M(), input: t })), t === "") {
-        s((C) => ({ ...C ?? M(), input: "", pending: void 0 })), a || u?.(void 0);
+    ), ae = (e) => {
+      const t = Pe(e.target.value, l, d);
+      if (o((I) => ({ ...I ?? M(), input: t })), t === "") {
+        o((I) => ({ ...I ?? M(), input: "", pending: void 0 })), a || p?.(void 0);
         return;
       }
-      const { parsed: D, isValid: v } = he(t, c, f);
-      v && D && (s((C) => ({
-        ...C ?? M(),
+      const { parsed: D, isValid: v } = Me(t, l, f);
+      v && D && (o((I) => ({
+        ...I ?? M(),
         input: t,
         pending: D,
         viewMonth: D
-      })), a || u?.(D));
-    }, te = r.useCallback(
+      })), a || p?.(D));
+    }, ue = r.useCallback(
       (e) => {
-        u?.(e), p();
+        p?.(e), u();
       },
-      [u, p]
-    ), ne = () => {
+      [p, u]
+    ), pe = () => {
       if (i) return;
-      const e = De(
+      const e = xe(
         d,
-        c,
+        l,
         k,
         f
       );
       if (e.resetToCommitted) {
-        s(null);
+        o(null);
         return;
       }
       if (e.parsed) {
-        s((t) => ({
+        o((t) => ({
           ...t ?? M(),
           input: e.display,
           pending: e.parsed,
           viewMonth: e.parsed
-        })), a || (u?.(e.parsed), s(null));
+        })), a || (p?.(e.parsed), o(null));
         return;
       }
-      s(null);
-    }, re = () => {
+      o(null);
+    }, fe = () => {
       if (i && a) {
-        O();
+        L();
         return;
       }
-      const e = ge(d, c, f);
+      const e = Re(d, l, f);
       if (e.parsed) {
-        a && te(e.parsed);
+        a && ue(e.parsed);
         return;
       }
       i || (y.current = !0, m(!0));
-    }, L = (n ? w(n, c, { locale: f }) : "") !== d, oe = ue(d, c, f), ie = r.useCallback(
-      () => fe(
+    }, V = (n ? b(n, l, { locale: f }) : "") !== d, de = ve(d, l, f), me = r.useCallback(
+      () => Ie(
         P,
         n,
         (e, t) => e.getTime() === t.getTime()
@@ -132,111 +142,121 @@ const Ge = xe(
     );
     return r.useLayoutEffect(() => {
       N.current = {
-        onDismiss: b,
-        resolveFlash: ie
+        onDismiss: R,
+        resolveFlash: me
       };
-    }), /* @__PURE__ */ x(ke, { open: l ? !1 : i, onOpenChange: m, children: [
-      /* @__PURE__ */ o(ve, { asChild: !0, children: /* @__PURE__ */ o(
-        "div",
-        {
-          ref: A,
-          "data-component": "date-picker",
-          "data-state": i ? "open" : "closed",
-          "data-pending": L || void 0,
-          onPointerDown: (e) => de({
-            disabled: l,
-            event: e,
-            onOpen: () => m(!0),
-            focusField: () => g.current?.focus()
-          }),
-          children: /* @__PURE__ */ o(
-            ye,
-            {
-              ref: g,
-              value: d,
-              onChange: ee,
-              onBlur: ne,
-              onClick: () => !l && m(!0),
-              onKeyDown: (e) => {
-                e.key === "Enter" && !l && (e.preventDefault(), re()), e.key === "ArrowDown" && !i && !l && (e.preventDefault(), y.current = !0, m(!0)), e.key === "Escape" && i && (e.preventDefault(), b());
-              },
-              placeholder: i ? c : X,
-              disabled: l,
-              "data-form-control": "input",
-              className: ce(
-                "cursor-pointer",
-                oe ? "text-destructive" : L ? "text-content-placeholder" : "",
-                Q
-              ),
-              suffix: /* @__PURE__ */ x("div", { className: "flex items-center gap-1", children: [
-                n && !l && /* @__PURE__ */ x(j, { children: [
-                  /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ o(
-                    "button",
-                    {
-                      type: "button",
-                      tabIndex: 0,
-                      "aria-label": h("calendar.clear"),
-                      onClick: (e) => {
-                        e.stopPropagation(), V();
-                      },
-                      className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
-                      children: /* @__PURE__ */ o(se, { className: "size-3 hover:text-content" })
-                    }
-                  ) }),
-                  /* @__PURE__ */ o(K, { variant: "tertiary", side: "top", children: h("calendar.clear") })
+    }), /* @__PURE__ */ s(
+      Ve,
+      {
+        open: i,
+        disabled: c,
+        ariaLabel: h("datePicker.selectDate"),
+        onOpenChange: m,
+        onOpenAutoFocus: (e) => {
+          y.current || e.preventDefault(), y.current = !1;
+        },
+        popoverHandlers: se,
+        trigger: /* @__PURE__ */ s(
+          "div",
+          {
+            ref: E,
+            "data-component": "date-picker",
+            "data-state": i ? "open" : "closed",
+            "data-pending": V || void 0,
+            onPointerDown: (e) => Ce({
+              disabled: c,
+              event: e,
+              onOpen: () => m(!0),
+              focusField: () => g.current?.focus()
+            }),
+            children: /* @__PURE__ */ s(
+              Se,
+              {
+                ref: g,
+                value: d,
+                onChange: ae,
+                onBlur: pe,
+                onClick: () => !c && m(!0),
+                onKeyDown: (e) => {
+                  e.key === "Enter" && !c && (e.preventDefault(), fe()), e.key === "ArrowDown" && !i && !c && (e.preventDefault(), y.current = !0, m(!0)), e.key === "Escape" && i && (e.preventDefault(), R());
+                },
+                placeholder: i ? l : re,
+                disabled: c,
+                "data-form-control": "input",
+                className: ge(
+                  "cursor-pointer",
+                  de ? "text-destructive" : V ? "text-content-placeholder" : "",
+                  Q
+                ),
+                suffix: /* @__PURE__ */ S("div", { className: "flex items-center gap-1", children: [
+                  n && !c && /* @__PURE__ */ S(j, { children: [
+                    /* @__PURE__ */ s(B, { asChild: !0, children: /* @__PURE__ */ s(
+                      "button",
+                      {
+                        type: "button",
+                        tabIndex: 0,
+                        "aria-label": h("calendar.clear"),
+                        onClick: (e) => {
+                          e.stopPropagation(), O();
+                        },
+                        className: "inline-flex size-4 items-center justify-center bg-transparent border-none p-0 cursor-pointer",
+                        children: /* @__PURE__ */ s(he, { className: "size-3 hover:text-content" })
+                      }
+                    ) }),
+                    /* @__PURE__ */ s(K, { variant: "tertiary", side: "top", children: h("calendar.clear") })
+                  ] }),
+                  /* @__PURE__ */ S(j, { children: [
+                    /* @__PURE__ */ s(B, { asChild: !0, children: /* @__PURE__ */ s("button", { type: "button", tabIndex: 0, "aria-label": h("datePicker.selectDate"), onClick: (e) => {
+                      e.stopPropagation(), c || (i ? u() : m(!0));
+                    }, onKeyDown: (e) => {
+                      (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), c || (y.current = !0, i ? u() : m(!0)));
+                    }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ s(De, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
+                    /* @__PURE__ */ s(K, { variant: "tertiary", side: "top", children: h("datePicker.selectDate") })
+                  ] })
                 ] }),
-                /* @__PURE__ */ x(j, { children: [
-                  /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ o("button", { type: "button", tabIndex: 0, "aria-label": h("datePicker.selectDate"), onClick: (e) => {
-                    e.stopPropagation(), l || (i ? p() : m(!0));
-                  }, onKeyDown: (e) => {
-                    (e.key === "Enter" || e.key === " ") && (e.preventDefault(), e.stopPropagation(), l || (y.current = !0, i ? p() : m(!0)));
-                  }, className: "inline-flex items-center justify-center bg-transparent border-none p-0 cursor-pointer", children: /* @__PURE__ */ o(le, { className: "h-4 w-4 text-secondary-foreground" }) }) }),
-                  /* @__PURE__ */ o(K, { variant: "tertiary", side: "top", children: h("datePicker.selectDate") })
-                ] })
-              ] }),
-              ...U
-            }
-          )
-        }
-      ) }),
-      /* @__PURE__ */ o(
-        Ce,
-        {
-          className: "w-auto p-0",
-          align: "start",
-          "aria-label": h("datePicker.selectDate"),
-          onOpenAutoFocus: (e) => {
-            y.current || e.preventDefault(), y.current = !1;
-          },
-          ..._,
-          children: /* @__PURE__ */ o(
-            Ie,
-            {
-              mode: "single",
-              selected: P,
-              footerFlashKey: Y,
-              footerFlashTarget: Z,
-              onSelect: F,
-              month: $,
-              onMonthChange: (e) => s(
-                (t) => t ? { ...t, viewMonth: e } : null
-              ),
-              disabled: we(H, q),
-              startMonth: G,
-              endMonth: J,
-              showFooter: a,
-              onApply: O,
-              onCancel: b,
-              onClear: V,
-              captionLayout: "dropdown",
-              ...S !== void 0 ? { weekStartsOn: S } : {}
-            }
-          )
-        }
-      )
-    ] });
+                ...te
+              }
+            )
+          }
+        ),
+        children: /* @__PURE__ */ s(
+          be,
+          {
+            mode: "single",
+            selected: P,
+            footerFlashKey: ie,
+            footerFlashTarget: oe,
+            onSelect: le,
+            month: ce,
+            onMonthChange: (e) => o(
+              (t) => t ? { ...t, viewMonth: e } : null
+            ),
+            disabled: Le(H, q),
+            startMonth: G,
+            endMonth: J,
+            showFooter: a,
+            onApply: L,
+            onCancel: R,
+            onClear: O,
+            captionLayout: "dropdown",
+            ...w !== void 0 ? { weekStartsOn: w } : {},
+            ...Oe({
+              calendarKind: U,
+              fiscalMode: W,
+              granularity: X,
+              fiscalMonthPattern: Y,
+              fiscalYearStartMonth: Z,
+              fiscalConfig: _,
+              showPresets: $,
+              comparison: F,
+              onComparisonChange: ee
+            })
+          }
+        )
+      }
+    );
   }
 );
 export {
-  Ge as DatePicker
+  $e as DatePicker
 };