@viasat/beam-react 2.67.1 → 2.69.0

package/lib/DateField/DateField.es.js

@@ -0,0 +1,274 @@
+import { jsxs as W, jsx as s } from "react/jsx-runtime";
+import $e from "clsx";
+import { forwardRef as He, useRef as u, useMemo as Ke, useCallback as o } from "react";
+import { s as t, b as je, c as i, a as g } from "../../chunks/DateField.Segment.Dtgriddw.js";
+import { d as qe } from "../../chunks/input.f81KzcGZ.js";
+import { t as We } from "../../chunks/constants.Cruz2A1w.js";
+import { i as Ye } from "../../chunks/helpers.CiQfGwdc.js";
+import { H as _e } from "../../chunks/form.context.BDYA2JQs.js";
+import { LabelProvider as ke } from "../Form/contexts/label.context.es.js";
+import { HelperTextProvider as ze } from "../Form/contexts/helperText.context.es.js";
+import { useIsMounted as Ue } from "../../utils/hooks/useIsMounted.es.js";
+import { mergeRefs as Ge } from "../../utils/functions.es.js";
+import { ErrorBoundary as Je } from "../_ErrorBoundary/ErrorBoundary.es.js";
+import { DateFieldSegments as Qe } from "./DateField.Segments.es.js";
+import { useDevMinMaxWarning as Xe, useDevInvalidValueWarning as Ze } from "./DateField.devWarnings.es.js";
+import { getDateParts as er, getSegmentOrder as rr, toISODateString as ar, DEFAULT_LOCALE as Y } from "./DateField.utils.es.js";
+import { useDateFieldFocus as tr } from "./useDateFieldFocus.es.js";
+import { useDateFieldForm as sr } from "./useDateFieldForm.es.js";
+import { useDateFieldKeyboard as nr } from "./useDateFieldKeyboard.es.js";
+import { useDateFieldSegments as lr } from "./useDateFieldSegments.es.js";
+import { useDateFieldValidity as or } from "./useDateFieldValidity.es.js";
+import { useDateFieldValue as ir } from "./useDateFieldValue.es.js";
+import { useInvalidState as dr } from "./useInvalidState.es.js";
+const cr = "MM/DD/YYYY", ur = () => {
+  process.env.NODE_ENV !== "production" && console.warn("DateField: segments failed to render; showing a static fallback.");
+}, Ar = He(
+  function({
+    value: v,
+    defaultValue: D,
+    onChange: _,
+    minDate: F,
+    maxDate: h,
+    getClampAnnouncement: k,
+    locale: z,
+    label: S = null,
+    helperText: x = null,
+    error: I,
+    hideRequiredMarker: U = !1,
+    validationRules: G,
+    width: J,
+    theme: y,
+    fluid: Q = !1,
+    size: X = qe,
+    disabled: Z = !1,
+    readOnly: ee = !1,
+    required: re = !1,
+    name: M,
+    id: ae,
+    className: te,
+    style: se,
+    "aria-label": ne,
+    "aria-describedby": le,
+    "aria-labelledby": oe,
+    ...ie
+  }, R) {
+    const {
+      disabled: e,
+      readOnly: n,
+      required: E,
+      invalid: de,
+      errorMessageProvided: N,
+      defaultValue: ce,
+      errorId: O,
+      helperTextId: ue,
+      validationErrorsId: me,
+      labelId: w,
+      ariaDescribedBy: fe,
+      ariaLabelledBy: pe,
+      showErrors: be
+    } = sr({
+      name: M,
+      disabled: Z,
+      readOnly: ee,
+      required: re,
+      defaultValue: D,
+      error: I,
+      hasHelperText: !!x,
+      hasLabel: !!S,
+      validationRules: G,
+      ariaDescribedBy: le,
+      ariaLabelledBy: oe
+    });
+    Xe(F, h), Ze(v, D);
+    const l = u(null), { segmentRefs: ge, registerSegmentRef: ve } = lr(), De = z ?? Y, C = Ue(), m = er(C ? De : Y), d = Ke(() => rr(m), [m]), {
+      segmentText: Fe,
+      segmentValues: L,
+      currentValue: B,
+      wasTouched: he,
+      appendDigit: V,
+      adjustSegment: Se,
+      clearSegment: xe,
+      clearAll: T,
+      beginSegmentEdit: Ie,
+      commitOnBlur: ye,
+      clampAnnouncement: Me
+    } = ir({
+      value: v,
+      defaultValue: ce,
+      onChange: _,
+      minDate: F,
+      maxDate: h,
+      getClampAnnouncement: k
+    }), {
+      focusedSegment: A,
+      fieldTabIndex: Re,
+      handleSegmentFocus: c,
+      handleFieldFocus: Ee,
+      handleFieldBlur: Ne,
+      handleFieldMouseDown: Oe,
+      focusNext: f,
+      focusPrevious: we
+    } = tr({
+      disabled: e,
+      fieldRef: l,
+      segmentRefs: ge,
+      partsOrder: d,
+      onSegmentFocusChange: Ie,
+      onFieldBlur: ye
+    }), Ce = nr({
+      disabled: e,
+      readOnly: n,
+      fieldRef: l,
+      focusNext: f,
+      focusPrevious: we,
+      adjustSegment: Se,
+      clearSegment: xe
+    }), { isInvalid: Le } = or({
+      segments: L,
+      currentValue: B,
+      wasTouched: he,
+      isFocused: A !== null
+    }), Be = o(
+      (r, a) => {
+        const { advanced: b } = V(r, a);
+        b && f(r);
+      },
+      [V, f]
+    ), p = dr({
+      formInvalid: de,
+      valueInvalid: Le
+    }), Ve = C && Ye() ? "textbox" : "spinbutton", P = o(
+      (r) => {
+        e || c(d[0], r);
+      },
+      [e, c, d]
+    ), $ = o(() => {
+      var a;
+      if (e) return;
+      const r = document.activeElement;
+      r instanceof HTMLElement && r !== l.current && ((a = l.current) != null && a.contains(r)) && r.blur();
+    }, [e]), H = o(() => {
+      e || n || T();
+    }, [e, n, T]), K = u(P), j = u($), q = u(H);
+    K.current = P, j.current = $, q.current = H;
+    const Te = o(
+      (r) => {
+        const a = r ? Object.assign(r, {
+          focus: (b) => K.current(b),
+          blur: () => j.current(),
+          clear: () => q.current()
+        }) : null;
+        Ge(
+          l,
+          R
+        )(a);
+      },
+      [R]
+    ), Ae = (r) => {
+      if (e) return;
+      const a = r.target.closest("label");
+      !a || a.id !== w || (r.preventDefault(), c(d[0]));
+    }, Pe = $e(
+      t[je],
+      y && We(y),
+      t[`${i}${X}`],
+      Q && t[`${i}fluid`],
+      p && t[`${i}error`],
+      e && t[`${i}disabled`],
+      n && t[`${i}read-only`],
+      te
+    );
+    return /* @__PURE__ */ W(
+      "div",
+      {
+        className: Pe,
+        style: { ...se, maxWidth: J },
+        onMouseDownCapture: Ae,
+        children: [
+          /* @__PURE__ */ s(
+            ke,
+            {
+              ctxId: w,
+              ctxDisabled: e,
+              ctxRequired: E && !U,
+              children: S
+            }
+          ),
+          /* @__PURE__ */ s(
+            "div",
+            {
+              ...ie,
+              ref: Te,
+              id: ae,
+              role: "group",
+              "aria-label": ne,
+              "aria-labelledby": pe,
+              "aria-disabled": e || void 0,
+              "aria-invalid": p || void 0,
+              "aria-describedby": fe,
+              "aria-errormessage": N ? O : void 0,
+              tabIndex: Re,
+              className: t[g.field],
+              onMouseDown: Oe,
+              onFocus: Ee,
+              children: /* @__PURE__ */ s(
+                Je,
+                {
+                  fallback: /* @__PURE__ */ s("span", { className: t[g.segments], children: cr }),
+                  onError: ur,
+                  children: /* @__PURE__ */ s(
+                    Qe,
+                    {
+                      parts: m,
+                      segmentText: Fe,
+                      segmentValues: L,
+                      focusedSegment: A,
+                      disabled: e,
+                      readOnly: n,
+                      required: E,
+                      invalid: p,
+                      role: Ve,
+                      onSegmentFocus: c,
+                      onSegmentBlur: Ne,
+                      onSegmentInput: Be,
+                      onSegmentKeyDown: Ce,
+                      registerSegmentRef: ve
+                    }
+                  )
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ s(
+            "span",
+            {
+              role: "status",
+              "aria-live": "polite",
+              "aria-atomic": "true",
+              className: t[g.srStatus],
+              children: Me
+            }
+          ),
+          /* @__PURE__ */ s(
+            "input",
+            {
+              type: "hidden",
+              name: M,
+              value: ar(B),
+              disabled: e
+            }
+          ),
+          /* @__PURE__ */ W(ze, { ctxId: ue, ctxDisabled: e, children: [
+            x,
+            N && /* @__PURE__ */ s(_e, { id: O, appearance: "negative", children: I })
+          ] }),
+          be(me)
+        ]
+      }
+    );
+  }
+);
+export {
+  Ar as DateField
+};

package/lib/{wip/DateField → DateField}/DateField.types.d.ts

@@ -1,7 +1,8 @@
-import { ComponentPropsWithRef, ReactElement, FocusEvent, KeyboardEvent } from 'react';
+import { ComponentPropsWithRef, FocusEvent, KeyboardEvent, ReactNode } from 'react';
 import { Nullable } from '@viasat/beam-shared/utils/types';
 import { ThemeTypes } from '@viasat/beam-shared/utils/constants';
 import { FormValidator } from '@viasat/beam-shared/components/form';
+import { InputSize } from '@viasat/beam-shared/components/input';
 type DateFieldInputAttributes = Omit<ComponentPropsWithRef<'input'>, 'value' | 'defaultValue' | 'onChange' | 'min' | 'max' | 'type' | 'size' | 'ref' | 'form' | 'autoComplete' | 'inputMode'>;
 export type SegmentType = 'day' | 'month' | 'year';
 /**
@@ -32,18 +33,11 @@ export type DateFieldPart = {
     value: string;
 };
 /**
- * The DateField `ref` value (DF-16): the field's **root DOM element**
- * (`role="group"`) augmented with a `clear()` method. Keeping the ref a real
- * element (not a separate handle object) means it works anywhere a DOM node is
- * expected — a `Popover` / `FloatingUI` trigger, measuring, `scrollIntoView` —
- * while also carrying the field's imperative API.
- *
- * `focus()` and `blur()` are field-aware overrides of the native element methods:
- * `focus()` moves to the first segment; `blur()` exits the field (running the
- * same commit / normalize / clamp as a user blur). Both no-op when the field is
- * disabled. `clear()` empties every segment and fires `onChange(null)` (only
- * when a value was present), and no-ops when disabled or read-only.
- * (`selectAll()` is reserved for DF-13.)
+ * The DateField `ref`: the field's root element augmented with `clear()`. It
+ * stays a real DOM node so it works anywhere one is expected — a `Popover`
+ * trigger, measuring, `scrollIntoView` — while `focus()` and `blur()` become
+ * field-aware overrides that move to the first segment and exit the field.
+ * All three no-op when disabled; `clear()` also no-ops when read-only.
  */
 export type DateFieldHandle = HTMLDivElement & {
     clear(): void;
@@ -52,7 +46,7 @@ export interface DateFieldProps extends DateFieldInputAttributes {
     /**
      * Specify HelperText for DateField
      */
-    helperText?: Nullable<ReactElement>;
+    helperText?: Nullable<ReactNode>;
     /**
      * Specify if DateField is a required input
      * @default false
@@ -66,7 +60,7 @@ export interface DateFieldProps extends DateFieldInputAttributes {
     /**
      * Specify Label for DateField
      */
-    label?: Nullable<ReactElement>;
+    label?: Nullable<ReactNode>;
     /**
      * Specify error text and display error state of a DateField
      */
@@ -86,6 +80,11 @@ export interface DateFieldProps extends DateFieldInputAttributes {
      * @default false
      */
     fluid?: boolean;
+    /**
+     * Specify the size of DateField
+     * @default 'md'
+     */
+    size?: InputSize;
     /**
      * Specify the width of DateField
      */
@@ -99,35 +98,36 @@ export interface DateFieldProps extends DateFieldInputAttributes {
      */
     validationRules?: Array<FormValidator>;
     /**
-     * Controlled date value. Pass `null` to clear.
+     * Specify the controlled date value of DateField; pass `null` to clear
      */
     value?: Nullable<Date>;
     /**
-     * Uncontrolled initial date value. Ignored when `value` is provided.
+     * Specify the initial date value of an uncontrolled DateField
      */
     defaultValue?: Nullable<Date>;
     /**
-     * Fires when the derived `Date | null` value transitions.
+     * Specify the handler called when the date value changes
      */
     onChange?: (value: Nullable<Date>) => void;
     /**
-     * Lower bound; on blur, a touched value springs up to it. Use `validationRules` for validation.
+     * Specify the earliest date; a touched value springs up to it on blur
+     * (add a `validationRules` entry to block submit)
      */
     minDate?: Date;
     /**
-     * Upper bound; on blur, a touched value springs down to it. Use `validationRules` for validation.
+     * Specify the latest date; a touched value springs down to it on blur
+     * (add a `validationRules` entry to block submit)
      */
     maxDate?: Date;
     /**
-     * Called when a touched value springs to a bound on blur; return a localized
-     * message announced politely to screen readers. Omit → no announcement.
+     * Specify a localized message, announced politely to screen readers when a
+     * touched value springs to a bound; omit for no announcement
      */
     getClampAnnouncement?: (clampedDate: Date) => string;
     /**
-     * BCP-47 locale tag driving segment order + separators (e.g. `en-GB` →
-     * DD/MM/YYYY, `de-DE` → DD.MM.YYYY). A future `DatesProvider` will supply the
-     * default.
-     * @default en-US
+     * Specify the BCP-47 locale tag driving segment order and separators
+     * (e.g. `en-GB` → DD/MM/YYYY, `de-DE` → DD.MM.YYYY)
+     * @default 'en-US'
      */
     locale?: string;
 }
@@ -140,17 +140,11 @@ export interface DateFieldSegmentProps {
     type: SegmentType;
     /** Numeric segment value — used for `aria-valuenow`. `null` when the segment has no committed value. */
     value: Nullable<number>;
-    /**
-     * The lower bound announced as `aria-valuemin` — an intrinsic calendar
-     * range, NOT the `minDate` prop (day/month: always 1; year: always 1).
-     * Computed by `DateField.Segments` so the segment itself stays a pure renderer.
-     */
+    /** `aria-valuemin` — the intrinsic calendar floor, not the `minDate` prop. */
     valueMin: number;
     /**
-     * The upper bound announced as `aria-valuemax` — an intrinsic calendar
-     * range, NOT the `maxDate` prop (day: month-aware, e.g. 28 for Feb
-     * non-leap; month: 12; year: always 9999).
-     * Computed by `DateField.Segments` so the segment itself stays a pure renderer.
+     * `aria-valuemax` — the intrinsic calendar ceiling, not the `maxDate` prop:
+     * month-aware for day (28 for a non-leap February), 12 for month, 9999 for year.
      */
     valueMax: number;
     /** Pre-computed text to render inside the segment (buffer, formatted value, or placeholder). */
@@ -166,22 +160,19 @@ export interface DateFieldSegmentProps {
     isActive: boolean;
     disabled: boolean;
     readOnly: boolean;
+    /**
+     * Drives `aria-required`, which lives on the segments rather than the field
+     * root: it is role-specific, and `group` does not support it while
+     * `spinbutton` and `textbox` do.
+     */
+    required: boolean;
     /** Fires when the segment gains focus (Tab, click, or programmatic). */
     onFocus: () => void;
     /** Fires when focus leaves the segment; `relatedTarget` drives field-exit detection. */
     onBlur: (event: FocusEvent<HTMLSpanElement>) => void;
-    /**
-     * Single-character input callback. DF-2 single-digit typing path. The
-     * orchestrator routes this into `appendDigit` and (on advance) `focusNext`.
-     * Multi-character input (paste, IME composition commit) is ignored here —
-     * DF-13 will add a paste-aware branch for whole-value parsing.
-     */
+    /** Fires per typed character; multi-character input (paste, IME commit) is ignored. */
     onInput: (type: SegmentType, char: string) => void;
-    /**
-     * Fires on segment keydown. The orchestrator routes it into
-     * `useDateFieldKeyboard` (DF-3: ArrowLeft/Right segment nav, RTL-aware;
-     * DF-4/DF-5 extend with increment/clear).
-     */
+    /** Fires on segment keydown; the orchestrator routes it into `useDateFieldKeyboard`. */
     onKeyDown: (type: SegmentType, event: KeyboardEvent<HTMLSpanElement>) => void;
     segmentRef: (element: HTMLSpanElement | null) => void;
 }

package/lib/DateField/DateField.utils.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../chunks/constants.CgMu0_1M.js");const A=require("../../chunks/helpers.BIckGIbP.js"),d=require("./DateField.validation.cjs.js"),l="en-US",N=new Intl.DateTimeFormat("en-US",{month:"long"}),w=e=>N.format(new Date(2e3,e-1,1)),u=31,i=12,m=1,f=9999,M=(e,t,n)=>Math.min(n,Math.max(t,e)),T=(e,t)=>((e-1)%t+t)%t+1,F=2024,P=(e,t)=>t==null?31:new Date(e??F,t,0).getDate(),R=()=>{const e=new Date;return{day:e.getDate(),month:e.getMonth()+1,year:e.getFullYear()}},o=e=>e instanceof Date&&!Number.isNaN(e.getTime()),I=(e,t,n,r)=>{if(n==="min")return e==="year"?null:1;if(n==="max")return e==="year"?null:e==="day"?r.daysInMonth:i;if(t==null){if(e==="year")return r.today.year;const E=e==="day"?u:i;return n>0?1:E}if(e==="year")return M(t+n,m,f);const a=e==="day"?u:i;return T(t+n,a)},L={day:"",month:"",year:""},h=e=>{const{day:t,month:n,year:r}=e;if(t==null||n==null||r==null)return null;const a=new Date(r,n-1,t);return a.setFullYear(r),Number.isNaN(a.getTime())||a.getFullYear()!==r||a.getMonth()!==n-1||a.getDate()!==t?null:a},Y=(e,t)=>e==null&&t==null?!0:e==null||t==null?!1:e.getTime()===t.getTime(),s=A.dateToDayKey,O=e=>o(e)?s(e):null,V=(e,t,n)=>{const r=s(e);return!(o(t)&&r<s(t)||o(n)&&r>s(n))},_=(e,t)=>o(e)&&o(t)&&s(e)>s(t),C=(e,t,n)=>{if(_(t,n))return e;const r=s(e);return o(t)&&r<s(t)?new Date(t.getFullYear(),t.getMonth(),t.getDate()):o(n)&&r>s(n)?new Date(n.getFullYear(),n.getMonth(),n.getDate()):e},X=e=>{if(!o(e))return"";const t=String(e.getFullYear()).padStart(4,"0"),n=String(e.getMonth()+1).padStart(2,"0"),r=String(e.getDate()).padStart(2,"0");return`${t}-${n}-${r}`},p=e=>e.type==="literal",D=e=>e.filter(t=>!p(t)).map(t=>t.type),b=new Date(2020,0,2),G=new Set([8206,8207,8234,8235,8236,8237,8238,8294,8295,8296,8297]),H=e=>[...e].filter(t=>!G.has(t.codePointAt(0)??-1)).join(""),K=new Set(["day","month","year","literal"]),y=3,S=e=>{try{const t=new Intl.DateTimeFormat(e,{year:"numeric",month:"2-digit",day:"2-digit",calendar:"gregory"}).formatToParts(b).filter(r=>K.has(r.type)).map(r=>({type:r.type,value:r.type==="literal"?H(r.value):""})),n=D(t);return n.length===y&&new Set(n).size===y?t:null}catch{return null}},g=new Map,$=e=>{try{return new Intl.Locale(e).toString()}catch{return e.toLowerCase()}},k=e=>{try{return Intl.DateTimeFormat.supportedLocalesOf([e]).length>0}catch{return!1}},U=e=>{const t=$(e),n=g.get(t);if(n)return n;const r=k(e);!r&&process.env.NODE_ENV!=="production"&&console.warn(`DateField: locale "${e}" is not supported; falling back to ${l}.`);const a=(r?S(e):null)??S(l);if(!a)throw new Error(`DateField: Intl cannot resolve ${l} date parts`);return g.set(t,a),a},j=()=>g.clear(),q=e=>o(e)?{day:String(e.getDate()).padStart(2,"0"),month:String(e.getMonth()+1).padStart(2,"0"),year:String(e.getFullYear()).padStart(4,"0")}:L,c=(e,t)=>{if(t===""||e==="year"&&t.length<d.SEGMENT_MAX_LENGTH.year)return null;const n=parseInt(t,10);return Number.isNaN(n)||n===0?null:n},v=e=>h({day:c("day",e.day),month:c("month",e.month),year:c("year",e.year)}),z=(e,t)=>t===""?"":t.padStart(d.SEGMENT_MAX_LENGTH[e],"0"),B=(e,t,n)=>t===""?{displayValue:n,isPlaceholder:!0}:{displayValue:t.padStart(d.SEGMENT_MAX_LENGTH[e],"0"),isPlaceholder:!1},W=e=>{const t=window.getSelection();if(!t)return;const n=document.createRange();n.selectNodeContents(e),t.removeAllRanges(),t.addRange(n)},J=e=>{var n;if(!e)return;const t=(n=window.getSelection)==null?void 0:n.call(window);t&&t.rangeCount>0&&e.contains(t.anchorNode)&&t.removeAllRanges()};exports.DAY_SPIN_MAX=u;exports.DEFAULT_LOCALE=l;exports.MONTH_MAX=i;exports.YEAR_MAX=f;exports.YEAR_MIN=m;exports.__clearDatePartsCache=j;exports.adjustSegmentValue=I;exports.clamp=M;exports.clampDateToRange=C;exports.clearSelectionWithin=J;exports.dateKeyOrNull=O;exports.deriveValue=h;exports.deriveValueFromText=v;exports.getDateParts=U;exports.getDaysInMonth=P;exports.getMonthName=w;exports.getSegmentDisplay=B;exports.getSegmentOrder=D;exports.isDateInRange=V;exports.isLiteralPart=p;exports.isMinMaxMisconfigured=_;exports.isSameDateValue=Y;exports.isValidDate=o;exports.normalizeSegmentText=z;exports.segmentNumber=c;exports.segmentTextFromValue=q;exports.selectElementContents=W;exports.toISODateString=X;exports.todayParts=R;exports.wrapInRange=T;

package/lib/{wip/DateField → DateField}/DateField.utils.d.ts

@@ -18,9 +18,8 @@ export declare const DAY_SPIN_MAX = 31;
 /** Absolute maximum for month (1-based). */
 export declare const MONTH_MAX = 12;
 /**
- * Absolute floor/ceiling for the free-spinning year segment. `minDate`/
- * `maxDate` no longer bound the year directly (DF-10: the whole date clamps
- * to those bounds on blur instead — see `commitOnBlur`).
+ * Absolute floor/ceiling for the free-spinning year segment. `minDate`/`maxDate`
+ * don't bound the year directly — the whole date clamps to them on blur instead.
  */
 export declare const YEAR_MIN = 1;
 export declare const YEAR_MAX = 9999;
@@ -40,10 +39,7 @@ export declare const wrapInRange: (n: number, max: number) => number;
  *   so February correctly reports 29 days (leap-safe fallback).
  */
 export declare const getDaysInMonth: (year: Nullable<number>, month: Nullable<number>) => number;
-/**
- * Returns today's date parts as a plain object.
- * Extracted so callers in the value hook and DF-8 can share the same helper.
- */
+/** Returns today's date parts as a plain object. */
 export declare const todayParts: () => {
     day: number;
     month: number;
@@ -70,20 +66,12 @@ export interface AdjustSegmentContext {
  * Computes the next numeric value for a date segment after an increment,
  * decrement, or boundary jump.
  *
- * Day and month wrap modularly within their absolute ranges (day:
- * `[1, DAY_SPIN_MAX]`; month: `[1, MONTH_MAX]`); out-of-range dates (e.g. Feb
- * 31) are flagged by the validity layer, not clamped here. Year clamps (no
- * wrap) within `[YEAR_MIN, YEAR_MAX]` and spins free of `minDate`/`maxDate`
- * (DF-10: those clamp the whole date on blur instead — see `commitOnBlur`);
- * year `'min'`/`'max'` (Home/End) are a no-op (`null`). An empty segment seeds
- * on the first numeric press: day/month to a direction-based first/last valid
- * value (positive amount → `1`, negative → `DAY_SPIN_MAX`/`MONTH_MAX`;
- * EPTOOLS-2766), year to `ctx.today.year`.
- *
- * @param type - Segment kind (`'day'`, `'month'`, or `'year'`).
- * @param current - Current numeric value of the segment, or `null` when empty.
- * @param amount - Numeric delta (e.g. ±1, ±5) or `'min'`/`'max'` for Home/End.
- * @param ctx - Pure context: days-in-month and today's date parts.
+ * Day and month wrap modularly within their absolute ranges; an impossible
+ * combination such as Feb 31 is left for the validity layer rather than clamped
+ * here. The year clamps without wrapping and spins free of `minDate`/`maxDate`,
+ * which bound the whole date on blur instead, so year `'min'`/`'max'` returns
+ * `null`. An empty segment seeds on the first press: day and month follow the
+ * direction of travel, the year starts at today.
  */
 export declare const adjustSegmentValue: (type: SegmentType, current: Nullable<number>, amount: SegmentAdjustment, ctx: AdjustSegmentContext) => Nullable<number>;
 export declare const deriveValue: (segments: SegmentValues) => Nullable<Date>;
@@ -126,7 +114,7 @@ export declare const isLiteralPart: (part: DateFieldPart) => part is DateFieldPa
 /** Ordered segment types from a parts array (literals stripped). */
 export declare const getSegmentOrder: (parts: ReadonlyArray<DateFieldPart>) => ReadonlyArray<SegmentType>;
 /**
- * Locale-derived segment order + separators (DF-8), memoized per locale. Falls
+ * Locale-derived segment order and separators, memoized per locale. Falls
  * back to {@link DEFAULT_LOCALE} for any locale Intl can't resolve to the three
  * date segments. Resolved lazily on first use, so a broken Intl (which can't
  * render the field anyway — `getMonthName` needs it too) surfaces at render,

package/lib/{wip/DateField → DateField}/DateField.utils.es.js

@@ -1,5 +1,5 @@
-import "../../../chunks/constants.Cruz2A1w.js";
-import { a as S } from "../../../chunks/helpers.CiQfGwdc.js";
+import "../../chunks/constants.Cruz2A1w.js";
+import { a as S } from "../../chunks/helpers.CiQfGwdc.js";
 import { SEGMENT_MAX_LENGTH as g } from "./DateField.validation.es.js";
 const l = "en-US", h = new Intl.DateTimeFormat("en-US", { month: "long" }), $ = (t) => h.format(new Date(2e3, t - 1, 1)), d = 31, c = 12, p = 1, T = 9999, M = (t, e, n) => Math.min(n, Math.max(e, t)), A = (t, e) => ((t - 1) % e + e) % e + 1, E = 2024, k = (t, e) => e == null ? 31 : new Date(t ?? E, e, 0).getDate(), X = () => {
   const t = /* @__PURE__ */ new Date();
@@ -82,9 +82,7 @@ const l = "en-US", h = new Intl.DateTimeFormat("en-US", { month: "long" }), $ =
   );
   const a = (r ? f(t) : null) ?? f(l);
   if (!a)
-    throw new Error(
-      `DateField: Intl cannot resolve ${l} date parts`
-    );
+    throw new Error(`DateField: Intl cannot resolve ${l} date parts`);
   return u.set(e, a), a;
 }, W = () => u.clear(), q = (t) => s(t) ? {
   day: String(t.getDate()).padStart(2, "0"),

package/lib/{wip/DateField → DateField}/DateField.validation.d.ts

@@ -17,8 +17,8 @@ export interface TryAppendDigitResult {
  *
  * - Day uses a fixed max of 31; month-dependent day max is intentionally
  *   deferred — invalid combinations surface as cross-segment errors.
- * - Year accepts any 4-digit value 0000-9999; min/max range tightening lands
- *   in DF-10 via dedicated `minDate` / `maxDate` props.
+ * - Year accepts any 4-digit value 0000-9999; `minDate`/`maxDate` narrow the
+ *   date as a whole on blur, not the digits accepted here.
  */
 export declare const tryAppendDigit: (type: SegmentType, buffer: string, digit: string) => TryAppendDigitResult;
 /** Re-export so `formatSegment` and `tryAppendDigit` share the same max-length

package/lib/DateField/useDateFieldFocus.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),j=require("./DateField.utils.cjs.js");function w({disabled:l,fieldRef:a,segmentRefs:v,partsOrder:b,onSegmentFocusChange:D,onFieldBlur:x}){const[n,o]=e.useState(null),i=b[0],y=e.useRef(n);y.current=n;const r=e.useRef(D),d=e.useRef(x);e.useEffect(()=>{r.current=D,d.current=x},[D,x]);const T=e.useRef(void 0);e.useEffect(()=>{if(n===null||n==="all")return;const t=v.current.get(n);t&&(document.activeElement!==t&&t.focus(T.current),T.current=void 0)},[n,v]);const E=e.useCallback((t,c)=>{var u;l||(T.current=c,o(t),(u=r.current)==null||u.call(r,t))},[l]),_=e.useCallback(t=>{var c;l||t.target===a.current&&(o(i),(c=r.current)==null||c.call(r,i))},[l,a,i]),q=e.useCallback(t=>{var u,s,f,p;if((u=a.current)!=null&&u.contains(t.relatedTarget))return;const c=(f=(s=t.target)==null?void 0:s.getAttribute)==null?void 0:f.call(s,"data-segment");c&&c!==y.current||(o(null),(p=d.current)==null||p.call(d),j.clearSelectionWithin(a.current))},[a]),I=e.useCallback(t=>{var u;if(l){t.preventDefault();return}t.target.closest("[data-segment]")||(t.preventDefault(),o(i),(u=r.current)==null||u.call(r,i))},[l,i]),k=e.useCallback((t,c)=>{var f;const u=b.indexOf(t);if(u===-1)return;const s=b[u+c];s!=null&&(o(s),(f=r.current)==null||f.call(r,s))},[b]),M=e.useCallback(t=>{k(t,1)},[k]),P=e.useCallback(t=>{k(t,-1)},[k]);return{focusedSegment:n,fieldTabIndex:l?-1:n===null?0:-1,handleSegmentFocus:E,handleFieldFocus:_,handleFieldBlur:q,handleFieldMouseDown:I,focusNext:M,focusPrevious:P}}exports.useDateFieldFocus=w;

package/lib/{wip/DateField → DateField}/useDateFieldFocus.es.js

@@ -1,20 +1,20 @@
-import { useState as j, useRef as d, useEffect as k, useCallback as s } from "react";
+import { useState as j, useRef as T, useEffect as k, useCallback as s } from "react";
 import { clearSelectionWithin as q } from "./DateField.utils.es.js";
 function J({
   disabled: o,
   fieldRef: f,
   segmentRefs: y,
   partsOrder: x,
-  onSegmentFocusChange: v,
-  onFieldBlur: D
+  onSegmentFocusChange: d,
+  onFieldBlur: v
 }) {
-  const [u, l] = j(null), i = x[0], E = d(u);
+  const [u, l] = j(null), i = x[0], E = T(u);
   E.current = u;
-  const r = d(v), p = d(D);
+  const r = T(d), p = T(v);
   k(() => {
-    r.current = v, p.current = D;
-  }, [v, D]);
-  const m = d(void 0);
+    r.current = d, p.current = v;
+  }, [d, v]);
+  const m = T(void 0);
   k(() => {
     if (u === null || u === "all") return;
     const t = y.current.get(u);
@@ -43,11 +43,14 @@ function J({
   ), N = s(
     (t) => {
       var c;
-      if (o) return;
+      if (o) {
+        t.preventDefault();
+        return;
+      }
       t.target.closest("[data-segment]") || (t.preventDefault(), l(i), (c = r.current) == null || c.call(r, i));
     },
     [o, i]
-  ), T = s(
+  ), D = s(
     (t, n) => {
       var a;
       const c = x.indexOf(t);
@@ -58,14 +61,14 @@ function J({
     [x]
   ), P = s(
     (t) => {
-      T(t, 1);
+      D(t, 1);
     },
-    [T]
+    [D]
   ), W = s(
     (t) => {
-      T(t, -1);
+      D(t, -1);
     },
-    [T]
+    [D]
   );
   return {
     focusedSegment: u,

package/lib/DateField/useDateFieldForm.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("clsx"),T=require("react"),u=require("../../chunks/form.context.CkC0TwMb.js");require("../Form/contexts/label.context.cjs.js");require("../Form/contexts/helperText.context.cjs.js");const s=require("../Form/hooks/useAccessibleId.hook.cjs.js");require("../../chunks/constants.CgMu0_1M.js");require("react/jsx-runtime");function L({name:i,disabled:b=!1,readOnly:q=!1,required:y=!1,defaultValue:I,error:e,hasHelperText:p,hasLabel:h,validationRules:F=[],ariaDescribedBy:f,ariaLabelledBy:m}){const{showErrors:v,isInvalid:x,errorShown:g,disabled:B,readOnly:_,required:A}=u.useFormField({name:i,validationRules:F,disabledProp:b,readOnlyProp:q,requiredProp:y}),{ctxInitialValues:D}=T.useContext(u.FormContext),{id:r}=s.useAccessibleId(),{id:d}=s.useAccessibleId(),{id:l}=s.useAccessibleId(),{id:o}=s.useAccessibleId(),t=!!(e!=null&&e.length),P=!!e||x,O=I??D[i],a=n(p&&d,t&&r,g&&l,f),c=n(h&&o,m);return{disabled:B,readOnly:_,required:A,invalid:P,errorMessageProvided:t,defaultValue:O,errorId:r,helperTextId:d,validationErrorsId:l,labelId:o,ariaDescribedBy:a.length>0?a:void 0,ariaLabelledBy:c.length>0?c:void 0,showErrors:v}}exports.useDateFieldForm=L;

package/lib/{wip/DateField → DateField}/useDateFieldForm.d.ts

@@ -1,6 +1,6 @@
 import { FormValidator } from '@viasat/beam-shared/components/form';
 import { Nullable } from '@viasat/beam-shared/utils/types';
-import { useFormField } from '../../Form/contexts';
+import { useFormField } from '../Form/contexts';
 export interface UseDateFieldFormArgs {
     name?: string;
     disabled?: boolean;

package/lib/{wip/DateField → DateField}/useDateFieldForm.es.js

@@ -1,10 +1,10 @@
 import c from "clsx";
 import { useContext as V } from "react";
-import { b as w, F as C } from "../../../chunks/form.context.BDYA2JQs.js";
-import "../../Form/contexts/label.context.es.js";
-import "../../Form/contexts/helperText.context.es.js";
-import { useAccessibleId as o } from "../../Form/hooks/useAccessibleId.hook.es.js";
-import "../../../chunks/constants.Cruz2A1w.js";
+import { b as w, F as C } from "../../chunks/form.context.BDYA2JQs.js";
+import "../Form/contexts/label.context.es.js";
+import "../Form/contexts/helperText.context.es.js";
+import { useAccessibleId as o } from "../Form/hooks/useAccessibleId.hook.es.js";
+import "../../chunks/constants.Cruz2A1w.js";
 import "react/jsx-runtime";
 function G({
   name: d,

package/lib/{wip/DateField → DateField}/useDateFieldKeyboard.d.ts

@@ -33,11 +33,8 @@ export interface UseDateFieldKeyboardArgs {
     /** Move focus to the previous segment in the locale-derived `partsOrder`. */
     focusPrevious: (segment: SegmentType) => void;
     /**
-     * Increment, decrement, or jump a segment to its min/max boundary.
-     * Provided by `useDateFieldValue`. Numeric `amount` wraps day/month and
-     * clamps year; `'min'`/`'max'` map to Home/End respectively. Returns `false`
-     * on a no-op (year `'min'`/`'max'` until DF-10 adds year bounds) so the
-     * dispatcher leaves the key to native page scroll.
+     * Steps a segment, or jumps it to a boundary for Home/End. Returns `false` on
+     * a no-op so the dispatcher leaves the key to native page scroll.
      */
     adjustSegment: (type: SegmentType, amount: SegmentAdjustment) => boolean;
     /**