@viasat/beam-react 2.30.0 → 2.37.0

package/lib/wip/DateField/DateField.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),ce=require("clsx"),Fe=require("react"),e=require("../../../chunks/DateField.Segment.7oCeBSNo.js"),_e=require("../../../chunks/constants.hwjHOsvT.js"),be=require("../../../chunks/form.context.hesWPMlU.js"),fe=require("../../Form/contexts/label.context.cjs.js"),De=require("../../Form/contexts/helperText.context.cjs.js"),me=require("../../Form/hooks/useUniversalRef.hook.cjs.js"),r=require("./DateField.Segments.cjs.js"),xe=require("./DateField.utils.cjs.js"),pe=require("./useDateFieldFocus.cjs.js"),ge=require("./useDateFieldForm.cjs.js"),ve=require("./useDateFieldSegments.cjs.js"),ye=require("./useDateFieldValidity.cjs.js"),qe=require("./useDateFieldValue.cjs.js"),Se=require("./useInvalidState.cjs.js"),he=Fe.forwardRef(function({value:v,defaultValue:y,onChange:q,label:t=null,helperText:d=null,error:n,hideRequiredMarker:S=!1,validationRules:h,width:I,theme:o,fluid:w=!1,disabled:R=!1,readOnly:T=!1,required:P=!1,name:u,id:V,className:M,style:j,"aria-label":N,"aria-describedby":O,"aria-labelledby":B,...C},E){const{disabled:i,readOnly:c,required:F,invalid:H,errorMessageProvided:_,defaultValue:L,errorId:b,helperTextId:$,validationErrorsId:k,labelId:f,ariaDescribedBy:A,ariaLabelledBy:U,showErrors:W}=ge.useDateFieldForm({name:u,disabled:R,readOnly:T,required:P,defaultValue:y,error:n,hasHelperText:!!d,hasLabel:!!t,validationRules:h,ariaDescribedBy:O,ariaLabelledBy:B}),{refFn:z,ref:G}=me.useUniversalRef(E),{segmentRefs:J,registerSegmentRef:K}=ve.useDateFieldSegments(),{segmentText:Q,segmentValues:D,currentValue:m,wasTouched:X,appendDigit:Y,beginSegmentEdit:Z,commitOnBlur:ee}=qe.useDateFieldValue({value:v,defaultValue:L,onChange:q}),{focusedSegment:x,fieldTabIndex:ie,handleSegmentFocus:p,handleFieldFocus:le,handleFieldBlur:ae,handleFieldMouseDown:se,focusNext:re}=pe.useDateFieldFocus({disabled:i,fieldRef:G,segmentRefs:J,partsOrder:r.PARTS_ORDER,onSegmentFocusChange:Z,onFieldBlur:ee}),{isInvalid:te}=ye.useDateFieldValidity({segments:D,currentValue:m,wasTouched:X,isFocused:x!==null}),de=(a,s)=>{const{advanced:ue}=Y(a,s);ue&&re(a)},g=Se.useInvalidState({formInvalid:H,valueInvalid:te}),ne=a=>{if(i)return;const s=a.target.closest("label");!s||s.id!==f||(a.preventDefault(),p(r.PARTS_ORDER[0]))},oe=ce(e.styles[e.baseClassNamePrefix],o&&_e.themeClassName(o),w&&e.styles[`${e.classModifierPrefix}fluid`],g&&e.styles[`${e.classModifierPrefix}error`],i&&e.styles[`${e.classModifierPrefix}disabled`],c&&e.styles[`${e.classModifierPrefix}read-only`],M);return l.jsxs("div",{className:oe,style:{...j,maxWidth:I},onMouseDownCapture:ne,children:[l.jsx(fe.LabelProvider,{ctxId:f,ctxDisabled:i,ctxRequired:F&&!S,children:t}),l.jsx("div",{...C,ref:z,id:V,role:"group","aria-label":N,"aria-labelledby":U,"aria-disabled":i||void 0,"aria-required":F||void 0,"aria-invalid":g||void 0,"aria-describedby":A,"aria-errormessage":_?b:void 0,tabIndex:ie,className:e.styles[e.staticDateFieldClassNames.field],onMouseDown:se,onFocus:le,children:l.jsx(r.DateFieldSegments,{segmentText:Q,segmentValues:D,focusedSegment:x,disabled:i,readOnly:c,onSegmentFocus:p,onSegmentBlur:ae,onSegmentInput:de,registerSegmentRef:K})}),l.jsx("input",{type:"hidden",name:u,value:xe.toISODateString(m),disabled:i}),l.jsxs(De.HelperTextProvider,{ctxId:$,ctxDisabled:i,children:[d,_&&l.jsx(be.HelperText,{id:b,appearance:"negative",children:n})]}),W(k)]})});exports.DateField=he;

package/lib/wip/DateField/DateField.d.ts

@@ -0,0 +1,3 @@
+import { DateFieldProps } from './DateField.types';
+/** Segmented date input. */
+export declare const DateField: import('react').ForwardRefExoticComponent<DateFieldProps & import('react').RefAttributes<HTMLDivElement>>;

package/lib/wip/DateField/DateField.es.js

@@ -0,0 +1,191 @@
+import { jsxs as h, jsx as l } from "react/jsx-runtime";
+import ce from "clsx";
+import { forwardRef as pe } from "react";
+import { s as a, b as be, c as s, a as ge } from "../../../chunks/DateField.Segment.DbjGMAPP.js";
+import { t as ve } from "../../../chunks/constants.CKKGf1-i.js";
+import { H as Fe } from "../../../chunks/form.context.D7b4066_.js";
+import { LabelProvider as De } from "../../Form/contexts/label.context.es.js";
+import { HelperTextProvider as xe } from "../../Form/contexts/helperText.context.es.js";
+import { useUniversalRef as he } from "../../Form/hooks/useUniversalRef.hook.es.js";
+import { DateFieldSegments as Ie, PARTS_ORDER as I } from "./DateField.Segments.es.js";
+import { toISODateString as ye } from "./DateField.utils.es.js";
+import { useDateFieldFocus as Se } from "./useDateFieldFocus.es.js";
+import { useDateFieldForm as Re } from "./useDateFieldForm.es.js";
+import { useDateFieldSegments as Ne } from "./useDateFieldSegments.es.js";
+import { useDateFieldValidity as Ve } from "./useDateFieldValidity.es.js";
+import { useDateFieldValue as we } from "./useDateFieldValue.es.js";
+import { useInvalidState as Be } from "./useInvalidState.es.js";
+const Je = pe(
+  function({
+    value: y,
+    defaultValue: S,
+    onChange: R,
+    label: d = null,
+    helperText: t = null,
+    error: o,
+    hideRequiredMarker: N = !1,
+    validationRules: V,
+    width: w,
+    theme: n,
+    fluid: B = !1,
+    disabled: C = !1,
+    readOnly: O = !1,
+    required: T = !1,
+    name: u,
+    id: M,
+    className: P,
+    style: q,
+    "aria-label": E,
+    "aria-describedby": H,
+    "aria-labelledby": L,
+    ...$
+  }, j) {
+    const {
+      disabled: e,
+      readOnly: m,
+      required: f,
+      invalid: W,
+      errorMessageProvided: c,
+      defaultValue: A,
+      errorId: p,
+      helperTextId: U,
+      validationErrorsId: _,
+      labelId: b,
+      ariaDescribedBy: k,
+      ariaLabelledBy: z,
+      showErrors: G
+    } = Re({
+      name: u,
+      disabled: C,
+      readOnly: O,
+      required: T,
+      defaultValue: S,
+      error: o,
+      hasHelperText: !!t,
+      hasLabel: !!d,
+      validationRules: V,
+      ariaDescribedBy: H,
+      ariaLabelledBy: L
+    }), { refFn: J, ref: K } = he(j), { segmentRefs: Q, registerSegmentRef: X } = Ne(), {
+      segmentText: Y,
+      segmentValues: g,
+      currentValue: v,
+      wasTouched: Z,
+      appendDigit: ee,
+      beginSegmentEdit: ae,
+      commitOnBlur: re
+    } = we({
+      value: y,
+      defaultValue: A,
+      onChange: R
+    }), {
+      focusedSegment: F,
+      fieldTabIndex: le,
+      handleSegmentFocus: D,
+      handleFieldFocus: ie,
+      handleFieldBlur: se,
+      handleFieldMouseDown: de,
+      focusNext: te
+    } = Se({
+      disabled: e,
+      fieldRef: K,
+      segmentRefs: Q,
+      partsOrder: I,
+      onSegmentFocusChange: ae,
+      onFieldBlur: re
+    }), { isInvalid: oe } = Ve({
+      segments: g,
+      currentValue: v,
+      wasTouched: Z,
+      isFocused: F !== null
+    }), ne = (r, i) => {
+      const { advanced: fe } = ee(r, i);
+      fe && te(r);
+    }, x = Be({
+      formInvalid: W,
+      valueInvalid: oe
+    }), ue = (r) => {
+      if (e) return;
+      const i = r.target.closest("label");
+      !i || i.id !== b || (r.preventDefault(), D(I[0]));
+    }, me = ce(
+      a[be],
+      n && ve(n),
+      B && a[`${s}fluid`],
+      x && a[`${s}error`],
+      e && a[`${s}disabled`],
+      m && a[`${s}read-only`],
+      P
+    );
+    return /* @__PURE__ */ h(
+      "div",
+      {
+        className: me,
+        style: { ...q, maxWidth: w },
+        onMouseDownCapture: ue,
+        children: [
+          /* @__PURE__ */ l(
+            De,
+            {
+              ctxId: b,
+              ctxDisabled: e,
+              ctxRequired: f && !N,
+              children: d
+            }
+          ),
+          /* @__PURE__ */ l(
+            "div",
+            {
+              ...$,
+              ref: J,
+              id: M,
+              role: "group",
+              "aria-label": E,
+              "aria-labelledby": z,
+              "aria-disabled": e || void 0,
+              "aria-required": f || void 0,
+              "aria-invalid": x || void 0,
+              "aria-describedby": k,
+              "aria-errormessage": c ? p : void 0,
+              tabIndex: le,
+              className: a[ge.field],
+              onMouseDown: de,
+              onFocus: ie,
+              children: /* @__PURE__ */ l(
+                Ie,
+                {
+                  segmentText: Y,
+                  segmentValues: g,
+                  focusedSegment: F,
+                  disabled: e,
+                  readOnly: m,
+                  onSegmentFocus: D,
+                  onSegmentBlur: se,
+                  onSegmentInput: ne,
+                  registerSegmentRef: X
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ l(
+            "input",
+            {
+              type: "hidden",
+              name: u,
+              value: ye(v),
+              disabled: e
+            }
+          ),
+          /* @__PURE__ */ h(xe, { ctxId: U, ctxDisabled: e, children: [
+            t,
+            c && /* @__PURE__ */ l(Fe, { id: p, appearance: "negative", children: o })
+          ] }),
+          G(_)
+        ]
+      }
+    );
+  }
+);
+export {
+  Je as DateField
+};

package/lib/wip/DateField/DateField.types.cjs.js

@@ -0,0 +1 @@
+"use strict";

package/lib/wip/DateField/DateField.types.d.ts

@@ -0,0 +1,118 @@
+import { ComponentPropsWithRef, ReactElement, FocusEvent } 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';
+type DateFieldInputAttributes = Omit<ComponentPropsWithRef<'input'>, 'value' | 'defaultValue' | 'onChange' | 'min' | 'max' | 'type' | 'size' | 'ref' | 'form' | 'autoComplete' | 'inputMode'>;
+export type SegmentType = 'day' | 'month' | 'year';
+export type FocusTarget = SegmentType | 'all' | null;
+/** Per-segment values. Month is 1-12 (NOT 0-11). */
+export interface SegmentValues {
+    day: number | null;
+    month: number | null;
+    year: number | null;
+}
+/** Per-segment raw input strings — the single source of truth. '' = empty. */
+export type SegmentText = Record<SegmentType, string>;
+export interface AppendDigitResult {
+    /** True when the segment completed and focus should auto-advance. */
+    advanced: boolean;
+    /** True when the digit was refused (invalid char, out-of-range, or full). */
+    rejected: boolean;
+}
+/** Shape mirrors `Intl.DateTimeFormatPart` so DF-8 can swap in locale-derived parts directly. */
+export type DateFieldPart = {
+    type: SegmentType | 'literal';
+    value: string;
+};
+export interface DateFieldProps extends DateFieldInputAttributes {
+    /**
+     * Specify HelperText for DateField
+     */
+    helperText?: Nullable<ReactElement>;
+    /**
+     * Specify if DateField is a required input
+     * @default false
+     */
+    required?: boolean;
+    /**
+     * Specify if the DateField displays with an asterisk
+     * @default false
+     */
+    hideRequiredMarker?: boolean;
+    /**
+     * Specify Label for DateField
+     */
+    label?: Nullable<ReactElement>;
+    /**
+     * Specify error text and display error state of a DateField
+     */
+    error?: boolean | string;
+    /**
+     * Specify if DateField displays in a read-only state
+     * @default false
+     */
+    readOnly?: boolean;
+    /**
+     * Specify if DateField displays in a disabled state
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Specify if DateField is fluid
+     * @default false
+     */
+    fluid?: boolean;
+    /**
+     * Specify the width of DateField
+     */
+    width?: string;
+    /**
+     * Specify the theme of the DateField. By default it inherits the theme from the parent
+     */
+    theme?: ThemeTypes;
+    /**
+     * Specify form validation rules for DateField
+     */
+    validationRules?: Array<FormValidator>;
+    /**
+     * Controlled date value. Pass `null` to clear.
+     */
+    value?: Nullable<Date>;
+    /**
+     * Uncontrolled initial date value. Ignored when `value` is provided.
+     */
+    defaultValue?: Nullable<Date>;
+    /**
+     * Fires when the derived `Date | null` value transitions.
+     * In DF-1, user-input handlers don't exist yet — wired up in DF-2.
+     */
+    onChange?: (value: Nullable<Date>) => void;
+}
+/**
+ * Internal props for the segment subcomponent. Not part of the public API.
+ * `displayValue` / `isPlaceholder` are pre-computed from the segment string so
+ * the segment is pure render; `value` is the parsed number for `aria-valuenow`.
+ */
+export interface DateFieldSegmentProps {
+    type: SegmentType;
+    /** Numeric segment value — used for `aria-valuenow`. `null` when the segment has no committed value. */
+    value: Nullable<number>;
+    /** Pre-computed text to render inside the segment (buffer, formatted value, or placeholder). */
+    displayValue: string;
+    /** True when `displayValue` IS the placeholder (drives `data-placeholder` CSS hook). */
+    isPlaceholder: boolean;
+    isActive: boolean;
+    disabled: boolean;
+    readOnly: boolean;
+    onFocus: () => void;
+    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.
+     */
+    onInput: (type: SegmentType, char: string) => void;
+    segmentRef: (element: HTMLSpanElement | null) => void;
+}
+export {};

package/lib/wip/DateField/DateField.types.es.js

@@ -0,0 +1 @@
+

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

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./DateField.validation.cjs.js"),u={day:"",month:"",year:""},o=e=>e instanceof Date&&!Number.isNaN(e.getTime()),s=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},g=(e,t)=>e==null&&t==null?!0:e==null||t==null?!1:e.getTime()===t.getTime(),m=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}`},d=e=>e.filter(t=>t.type!=="literal").map(t=>t.type),c=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")}:u,l=(e,t)=>{if(t===""||e==="year"&&t.length<i.SEGMENT_MAX_LENGTH.year)return null;const n=parseInt(t,10);return Number.isNaN(n)||n===0?null:n},S=e=>s({day:l("day",e.day),month:l("month",e.month),year:l("year",e.year)}),y=(e,t)=>t===""?"":t.padStart(i.SEGMENT_MAX_LENGTH[e],"0"),T=(e,t,n)=>t===""?{displayValue:n,isPlaceholder:!0}:{displayValue:t.padStart(i.SEGMENT_MAX_LENGTH[e],"0"),isPlaceholder:!1},p=e=>{const t=window.getSelection();if(!t)return;const n=document.createRange();n.selectNodeContents(e),t.removeAllRanges(),t.addRange(n)};exports.deriveValue=s;exports.deriveValueFromText=S;exports.getSegmentDisplay=T;exports.getSegmentOrder=d;exports.isSameDateValue=g;exports.normalizeSegmentText=y;exports.segmentNumber=l;exports.segmentTextFromValue=c;exports.selectElementContents=p;exports.toISODateString=m;

package/lib/wip/DateField/DateField.utils.d.ts

@@ -0,0 +1,26 @@
+import { Nullable } from '@viasat/beam-shared/utils/types';
+import { DateFieldPart, SegmentText, SegmentType, SegmentValues } from './DateField.types';
+export declare const deriveValue: (segments: SegmentValues) => Nullable<Date>;
+export declare const isSameDateValue: (a: Nullable<Date>, b: Nullable<Date>) => boolean;
+export declare const toISODateString: (value: Nullable<Date>) => string;
+/** Ordered segment types from a parts array (literals stripped). */
+export declare const getSegmentOrder: (parts: ReadonlyArray<DateFieldPart>) => ReadonlyArray<SegmentType>;
+/** Per-segment zero-padded strings from a Date. All-empty for null/invalid. */
+export declare const segmentTextFromValue: (value: Nullable<Date>) => SegmentText;
+/** The number a segment string contributes to the date / `aria-valuenow`, or
+ *  null when it shouldn't yet: empty, a parsed 0, or a year under 4 digits. */
+export declare const segmentNumber: (type: SegmentType, text: string) => Nullable<number>;
+/** Derives a Date from the per-segment strings (single source of truth). */
+export declare const deriveValueFromText: (text: SegmentText) => Nullable<Date>;
+/** Zero-pads a segment to its full width on blur (day/month → 2, year → 4),
+ *  e.g. "1" → "01" / "0001". No year minimum, so a lone "1" settles as year 1. */
+export declare const normalizeSegmentText: (type: SegmentType, text: string) => string;
+export interface SegmentDisplay {
+    displayValue: string;
+    isPlaceholder: boolean;
+}
+/** Placeholder when empty, else the digits zero-padded to the segment width
+ *  ("1" → "01" / "0001"). Display-only — the raw query drives append + value. */
+export declare const getSegmentDisplay: (type: SegmentType, text: string, placeholder: string) => SegmentDisplay;
+/** Selects an element's entire textContent (whole-segment highlight). */
+export declare const selectElementContents: (element: HTMLElement) => void;

package/lib/wip/DateField/DateField.utils.es.js

@@ -0,0 +1,45 @@
+import { SEGMENT_MAX_LENGTH as o } from "./DateField.validation.es.js";
+const s = { day: "", month: "", year: "" }, i = (e) => e instanceof Date && !Number.isNaN(e.getTime()), u = (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;
+}, m = (e, t) => e == null && t == null ? !0 : e == null || t == null ? !1 : e.getTime() === t.getTime(), d = (e) => {
+  if (!i(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}`;
+}, c = (e) => e.filter(
+  (t) => t.type !== "literal"
+).map((t) => t.type), y = (e) => i(e) ? {
+  day: String(e.getDate()).padStart(2, "0"),
+  month: String(e.getMonth() + 1).padStart(2, "0"),
+  year: String(e.getFullYear()).padStart(4, "0")
+} : s, l = (e, t) => {
+  if (t === "" || e === "year" && t.length < o.year) return null;
+  const n = parseInt(t, 10);
+  return Number.isNaN(n) || n === 0 ? null : n;
+}, S = (e) => u({
+  day: l("day", e.day),
+  month: l("month", e.month),
+  year: l("year", e.year)
+}), p = (e, t) => t === "" ? "" : t.padStart(o[e], "0"), f = (e, t, n) => t === "" ? { displayValue: n, isPlaceholder: !0 } : {
+  displayValue: t.padStart(o[e], "0"),
+  isPlaceholder: !1
+}, N = (e) => {
+  const t = window.getSelection();
+  if (!t) return;
+  const n = document.createRange();
+  n.selectNodeContents(e), t.removeAllRanges(), t.addRange(n);
+};
+export {
+  u as deriveValue,
+  S as deriveValueFromText,
+  f as getSegmentDisplay,
+  c as getSegmentOrder,
+  m as isSameDateValue,
+  p as normalizeSegmentText,
+  l as segmentNumber,
+  y as segmentTextFromValue,
+  N as selectElementContents,
+  d as toISODateString
+};

package/lib/wip/DateField/DateField.validation.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s={day:2,month:2,year:4},c=/^[0-9]$/,a=(r,e,n)=>{if(!c.test(n))return{newBuffer:e,shouldAdvance:!1,rejected:!0};const u=s[r];if(e.length>=u)return{newBuffer:e,shouldAdvance:!1,rejected:!0};if(r==="year"){const t=e+n;return{newBuffer:t,shouldAdvance:t.length===u,rejected:!1}}return r==="month"?l(e,n):d(e,n)},l=(r,e)=>r===""?e==="0"||e==="1"?{newBuffer:e,shouldAdvance:!1,rejected:!1}:{newBuffer:`0${e}`,shouldAdvance:!0,rejected:!1}:r==="0"?e==="0"?{newBuffer:r,shouldAdvance:!1,rejected:!0}:{newBuffer:`0${e}`,shouldAdvance:!0,rejected:!1}:r==="1"?e==="0"||e==="1"||e==="2"?{newBuffer:`1${e}`,shouldAdvance:!0,rejected:!1}:{newBuffer:r,shouldAdvance:!1,rejected:!0}:{newBuffer:r,shouldAdvance:!1,rejected:!0},d=(r,e)=>r===""?e==="0"||e==="1"||e==="2"||e==="3"?{newBuffer:e,shouldAdvance:!1,rejected:!1}:{newBuffer:`0${e}`,shouldAdvance:!0,rejected:!1}:r==="0"?e==="0"?{newBuffer:r,shouldAdvance:!1,rejected:!0}:{newBuffer:`0${e}`,shouldAdvance:!0,rejected:!1}:r==="1"||r==="2"?{newBuffer:`${r}${e}`,shouldAdvance:!0,rejected:!1}:r==="3"?e==="0"||e==="1"?{newBuffer:`3${e}`,shouldAdvance:!0,rejected:!1}:{newBuffer:r,shouldAdvance:!1,rejected:!0}:{newBuffer:r,shouldAdvance:!1,rejected:!0},f=s;exports.SEGMENT_MAX_LENGTH=f;exports.tryAppendDigit=a;

package/lib/wip/DateField/DateField.validation.d.ts

@@ -0,0 +1,26 @@
+import { SegmentType } from './DateField.types';
+export interface TryAppendDigitResult {
+    /** Buffer state after the append. Unchanged when `rejected` is true. */
+    newBuffer: string;
+    /** True when the segment completed and focus should auto-advance. */
+    shouldAdvance: boolean;
+    /** True when the digit was refused (invalid char, out-of-range, buffer full). */
+    rejected: boolean;
+}
+/**
+ * Per-segment input validation with intermediate-state awareness. Decides
+ * whether a typed digit is accepted (buffer grows), accepted-with-pad (e.g.
+ * "5" in empty month → "05"), or rejected ("13" for month).
+ *
+ * Pure; entirely driven by the (type, buffer, digit) tuple. Cross-segment
+ * validity (Feb 30) is NOT checked here — that's `deriveValue`'s job.
+ *
+ * - 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.
+ */
+export declare const tryAppendDigit: (type: SegmentType, buffer: string, digit: string) => TryAppendDigitResult;
+/** Re-export so `formatSegment` and `tryAppendDigit` share the same max-length
+ *  constants without a circular dep. */
+export declare const SEGMENT_MAX_LENGTH: Record<SegmentType, number>;

package/lib/wip/DateField/DateField.validation.es.js

@@ -0,0 +1,24 @@
+const s = {
+  day: 2,
+  month: 2,
+  year: 4
+}, c = /^[0-9]$/, f = (r, e, n) => {
+  if (!c.test(n))
+    return { newBuffer: e, shouldAdvance: !1, rejected: !0 };
+  const u = s[r];
+  if (e.length >= u)
+    return { newBuffer: e, shouldAdvance: !1, rejected: !0 };
+  if (r === "year") {
+    const t = e + n;
+    return {
+      newBuffer: t,
+      shouldAdvance: t.length === u,
+      rejected: !1
+    };
+  }
+  return r === "month" ? a(e, n) : l(e, n);
+}, a = (r, e) => r === "" ? e === "0" || e === "1" ? { newBuffer: e, shouldAdvance: !1, rejected: !1 } : { newBuffer: `0${e}`, shouldAdvance: !0, rejected: !1 } : r === "0" ? e === "0" ? { newBuffer: r, shouldAdvance: !1, rejected: !0 } : { newBuffer: `0${e}`, shouldAdvance: !0, rejected: !1 } : r === "1" ? e === "0" || e === "1" || e === "2" ? { newBuffer: `1${e}`, shouldAdvance: !0, rejected: !1 } : { newBuffer: r, shouldAdvance: !1, rejected: !0 } : { newBuffer: r, shouldAdvance: !1, rejected: !0 }, l = (r, e) => r === "" ? e === "0" || e === "1" || e === "2" || e === "3" ? { newBuffer: e, shouldAdvance: !1, rejected: !1 } : { newBuffer: `0${e}`, shouldAdvance: !0, rejected: !1 } : r === "0" ? e === "0" ? { newBuffer: r, shouldAdvance: !1, rejected: !0 } : { newBuffer: `0${e}`, shouldAdvance: !0, rejected: !1 } : r === "1" || r === "2" ? { newBuffer: `${r}${e}`, shouldAdvance: !0, rejected: !1 } : r === "3" ? e === "0" || e === "1" ? { newBuffer: `3${e}`, shouldAdvance: !0, rejected: !1 } : { newBuffer: r, shouldAdvance: !1, rejected: !0 } : { newBuffer: r, shouldAdvance: !1, rejected: !0 }, d = s;
+export {
+  d as SEGMENT_MAX_LENGTH,
+  f as tryAppendDigit
+};

package/lib/wip/DateField/index.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./DateField.cjs.js");exports.DateField=e.DateField;

package/lib/wip/DateField/index.d.ts

@@ -0,0 +1,2 @@
+export { DateField } from './DateField';
+export type { DateFieldProps } from './DateField.types';

package/lib/wip/DateField/index.es.js

@@ -0,0 +1,4 @@
+import { DateField as r } from "./DateField.es.js";
+export {
+  r as DateField
+};

package/lib/wip/DateField/useDateFieldFocus.cjs.js

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

package/lib/wip/DateField/useDateFieldFocus.d.ts

@@ -0,0 +1,23 @@
+import { FocusEvent, MouseEvent, MutableRefObject } from 'react';
+import { FocusTarget, SegmentType } from './DateField.types';
+export interface UseDateFieldFocusArgs {
+    disabled: boolean;
+    fieldRef: MutableRefObject<HTMLDivElement | null>;
+    segmentRefs: MutableRefObject<Map<SegmentType, HTMLSpanElement>>;
+    /** Ordered segment types (literals stripped). En-US hardcoded; DF-8 derives from locale. */
+    partsOrder: ReadonlyArray<SegmentType>;
+    /** Called when focus enters a segment (any path). */
+    onSegmentFocusChange?: (segment: SegmentType) => void;
+    /** Called when focus leaves the field entirely (intra-field hops ignored). */
+    onFieldBlur?: () => void;
+}
+export interface UseDateFieldFocusReturn {
+    focusedSegment: FocusTarget;
+    fieldTabIndex: number;
+    handleSegmentFocus: (segment: SegmentType) => void;
+    handleFieldFocus: (event: FocusEvent<HTMLDivElement>) => void;
+    handleFieldBlur: (event: FocusEvent<HTMLElement>) => void;
+    handleFieldMouseDown: (event: MouseEvent<HTMLDivElement>) => void;
+    focusNext: (currentType: SegmentType) => void;
+}
+export declare function useDateFieldFocus({ disabled, fieldRef, segmentRefs, partsOrder, onSegmentFocusChange, onFieldBlur, }: UseDateFieldFocusArgs): UseDateFieldFocusReturn;

package/lib/wip/DateField/useDateFieldFocus.es.js

@@ -0,0 +1,65 @@
+import { useState as N, useRef as I, useEffect as k, useCallback as s } from "react";
+function z({
+  disabled: n,
+  fieldRef: f,
+  segmentRefs: D,
+  partsOrder: o,
+  onSegmentFocusChange: a,
+  onFieldBlur: T
+}) {
+  const [e, i] = N(null), l = o[0], r = I(a), x = I(T);
+  k(() => {
+    r.current = a, x.current = T;
+  }, [a, T]), k(() => {
+    if (e === null || e === "all") return;
+    const t = D.current.get(e);
+    t && document.activeElement !== t && t.focus();
+  }, [e, D]);
+  const p = s(
+    (t) => {
+      var u;
+      n || (i(t), (u = r.current) == null || u.call(r, t));
+    },
+    [n]
+  ), v = s(
+    (t) => {
+      var u;
+      n || t.target === f.current && (i(l), (u = r.current) == null || u.call(r, l));
+    },
+    [n, f, l]
+  ), w = s(
+    (t) => {
+      var u, c;
+      (u = f.current) != null && u.contains(t.relatedTarget) || (i(null), (c = x.current) == null || c.call(x));
+    },
+    [f]
+  ), y = s(
+    (t) => {
+      var c;
+      if (n) return;
+      t.target.closest("[data-segment]") || (t.preventDefault(), i(l), (c = r.current) == null || c.call(r, l));
+    },
+    [n, l]
+  ), M = s(
+    (t) => {
+      var E;
+      const u = o.indexOf(t);
+      if (u === -1) return;
+      const c = o[u + 1];
+      c != null && (i(c), (E = r.current) == null || E.call(r, c));
+    },
+    [o]
+  );
+  return {
+    focusedSegment: e,
+    fieldTabIndex: n ? -1 : e === null ? 0 : -1,
+    handleSegmentFocus: p,
+    handleFieldFocus: v,
+    handleFieldBlur: w,
+    handleFieldMouseDown: y,
+    focusNext: M
+  };
+}
+export {
+  z as useDateFieldFocus
+};

package/lib/wip/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.hesWPMlU.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("react/jsx-runtime");function L({name:i,disabled:b=!1,readOnly:y=!1,required:I=!1,defaultValue:q,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:y,requiredProp:I}),{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=q??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/useDateFieldForm.d.ts

@@ -0,0 +1,32 @@
+import { FormValidator } from '@viasat/beam-shared/components/form';
+import { Nullable } from '@viasat/beam-shared/utils/types';
+import { useFormField } from '../../Form/contexts';
+export interface UseDateFieldFormArgs {
+    name?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    required?: boolean;
+    defaultValue?: Nullable<Date>;
+    error?: boolean | string;
+    hasHelperText: boolean;
+    validationRules?: Array<FormValidator>;
+    ariaDescribedBy?: string;
+    ariaLabelledBy?: string;
+    hasLabel: boolean;
+}
+export interface UseDateFieldFormReturn {
+    disabled: boolean;
+    readOnly: boolean;
+    required: boolean;
+    invalid: boolean;
+    errorMessageProvided: boolean;
+    defaultValue: Nullable<Date>;
+    errorId: string;
+    helperTextId: string;
+    validationErrorsId: string;
+    labelId: string;
+    ariaDescribedBy: string | undefined;
+    ariaLabelledBy: string | undefined;
+    showErrors: ReturnType<typeof useFormField>['showErrors'];
+}
+export declare function useDateFieldForm({ name, disabled: _disabled, readOnly: _readOnly, required: _required, defaultValue: _defaultValue, error, hasHelperText, hasLabel, validationRules, ariaDescribedBy: _ariaDescribedBy, ariaLabelledBy: _ariaLabelledBy, }: UseDateFieldFormArgs): UseDateFieldFormReturn;

package/lib/wip/DateField/useDateFieldForm.es.js

@@ -0,0 +1,51 @@
+import c from "clsx";
+import { useContext as V } from "react";
+import { b as w, F as C } from "../../../chunks/form.context.D7b4066_.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 "react/jsx-runtime";
+function z({
+  name: d,
+  disabled: m = !1,
+  readOnly: p = !1,
+  required: u = !1,
+  defaultValue: b,
+  error: e,
+  hasHelperText: f,
+  hasLabel: y,
+  validationRules: I = [],
+  ariaDescribedBy: h,
+  ariaLabelledBy: v
+}) {
+  const { showErrors: x, isInvalid: B, errorShown: F, disabled: g, readOnly: D, required: P } = w({
+    name: d,
+    validationRules: I,
+    disabledProp: m,
+    readOnlyProp: p,
+    requiredProp: u
+  }), { ctxInitialValues: q } = V(C), { id: i } = o(), { id: r } = o(), { id: s } = o(), { id: t } = o(), a = !!(e != null && e.length), L = !!e || B, O = b ?? q[d], l = c(
+    f && r,
+    a && i,
+    F && s,
+    h
+  ), n = c(y && t, v);
+  return {
+    disabled: g,
+    readOnly: D,
+    required: P,
+    invalid: L,
+    errorMessageProvided: a,
+    defaultValue: O,
+    errorId: i,
+    helperTextId: r,
+    validationErrorsId: s,
+    labelId: t,
+    ariaDescribedBy: l.length > 0 ? l : void 0,
+    ariaLabelledBy: n.length > 0 ? n : void 0,
+    showErrors: x
+  };
+}
+export {
+  z as useDateFieldForm
+};