@viasat/beam-react 2.39.3 → 2.41.0

package/chunks/{DateField.Segment.BVKky9IE.js → DateField.Segment.C2qoaY0Z.js}

@@ -1,15 +1,15 @@
 import "../assets/DateField.css";
-import { jsx as E } from "react/jsx-runtime";
-import x from "clsx";
-import { useRef as h, useCallback as v, useLayoutEffect as M } from "react";
-import { g as N } from "./classNames.ZWNk1hey.js";
+import { jsx as h } from "react/jsx-runtime";
+import v from "clsx";
+import { useRef as D, useCallback as M, useLayoutEffect as N } from "react";
+import { g as k } from "./classNames.ZWNk1hey.js";
 import { selectElementContents as I } from "../lib/wip/DateField/DateField.utils.es.js";
-const k = "date-field", { baseClassNamePrefix: F, classModifierPrefix: G, subElementClassPrefix: s } = N(k), D = {
+const $ = "date-field", { baseClassNamePrefix: j, classModifierPrefix: z, subElementClassPrefix: s } = k($), B = {
   field: `${s}field`,
   segments: `${s}segments`,
   segment: `${s}segment`,
   separator: `${s}separator`
-}, R = {
+}, L = {
   "bm-light": "bm-light",
   "bm-dark": "bm-dark",
   "bm-inverse": "bm-inverse",
@@ -24,50 +24,48 @@ const k = "date-field", { baseClassNamePrefix: F, classModifierPrefix: G, subEle
   "bm-date-field--fluid": "bm-date-field--fluid",
   "bm-date-field__segments": "bm-date-field__segments",
   "bm-date-field__separator": "bm-date-field__separator"
-}, $ = {
-  day: 31,
-  month: 12,
-  year: 9999
-}, y = {
+}, P = {
   day: "day",
   month: "month",
   year: "year"
-}, j = ({
+}, G = ({
   type: r,
   value: b,
+  valueMax: c,
   displayValue: t,
-  isPlaceholder: c,
+  isPlaceholder: u,
   isActive: a,
   disabled: o,
   readOnly: i,
-  onFocus: u,
-  onBlur: _,
-  onInput: p,
+  onFocus: p,
+  onBlur: g,
+  onInput: _,
+  onKeyDown: C,
   segmentRef: m
 }) => {
-  const n = !o && !i, l = h(null), g = v(
+  const n = !o && !i, l = D(null), x = M(
     (e) => {
       l.current = e, m(e);
     },
     [m]
-  ), C = (e) => {
+  ), E = (e) => {
     if (!n) return;
     const f = e.currentTarget, d = e.nativeEvent.data;
-    d != null && d.length === 1 && p(r, d), f.textContent !== t && (f.textContent = t);
+    d != null && d.length === 1 && _(r, d), f.textContent !== t && (f.textContent = t);
   };
-  return M(() => {
+  return N(() => {
     if (!a || !n) return;
     const e = l.current;
     e && I(e);
-  }, [t, a, n]), /* @__PURE__ */ E(
+  }, [t, a, n]), /* @__PURE__ */ h(
     "span",
     {
-      ref: g,
+      ref: x,
       role: "spinbutton",
-      "aria-label": y[r],
+      "aria-label": P[r],
       "aria-valuenow": b ?? void 0,
       "aria-valuemin": 1,
-      "aria-valuemax": $[r],
+      "aria-valuemax": c,
       "aria-valuetext": t,
       "aria-disabled": o || void 0,
       "aria-readonly": i || void 0,
@@ -80,20 +78,21 @@ const k = "date-field", { baseClassNamePrefix: F, classModifierPrefix: G, subEle
       autoCapitalize: "off",
       "data-segment": r,
       "data-active": a,
-      "data-placeholder": c,
-      onFocus: u,
-      onBlur: _,
-      onInput: C,
+      "data-placeholder": u,
+      onFocus: p,
+      onBlur: g,
+      onInput: E,
+      onKeyDown: (e) => C(r, e),
       onMouseUp: (e) => e.preventDefault(),
-      className: x(R[D.segment]),
+      className: v(L[B.segment]),
       children: t
     }
   );
 };
 export {
-  j as D,
-  D as a,
-  F as b,
-  G as c,
-  R as s
+  G as D,
+  B as a,
+  j as b,
+  z as c,
+  L as s
 };

package/chunks/DateField.Segment.CY0jg03_.js

@@ -0,0 +1 @@
+var w=require("../assets/DateField.css");const N=require("react/jsx-runtime"),F=require("clsx"),d=require("react"),M=require("./classNames.DC8Ra4sw.js"),q=require("../lib/wip/DateField/DateField.utils.cjs.js"),P="date-field",{baseClassNamePrefix:R,classModifierPrefix:k,subElementClassPrefix:r}=M.getBEMClassNames(P),c={field:`${r}field`,segments:`${r}segments`,segment:`${r}segment`,separator:`${r}separator`},u={"bm-light":"bm-light","bm-dark":"bm-dark","bm-inverse":"bm-inverse","bm-enterprise":"bm-enterprise","bm-consumer":"bm-consumer","bm-date-field":"bm-date-field","bm-date-field--disabled":"bm-date-field--disabled","bm-date-field--error":"bm-date-field--error","bm-date-field__field":"bm-date-field__field","bm-date-field__segment":"bm-date-field__segment","bm-date-field--read-only":"bm-date-field--read-only","bm-date-field--fluid":"bm-date-field--fluid","bm-date-field__segments":"bm-date-field__segments","bm-date-field__separator":"bm-date-field__separator"},I={day:"day",month:"month",year:"year"},$=({type:n,value:_,valueMax:g,displayValue:t,isPlaceholder:C,isActive:a,disabled:l,readOnly:o,onFocus:p,onBlur:x,onInput:E,onKeyDown:h,segmentRef:m})=>{const s=!l&&!o,f=d.useRef(null),v=d.useCallback(e=>{f.current=e,m(e)},[m]),D=e=>{if(!s)return;const b=e.currentTarget,i=e.nativeEvent.data;i!=null&&i.length===1&&E(n,i),b.textContent!==t&&(b.textContent=t)};return d.useLayoutEffect(()=>{if(!a||!s)return;const e=f.current;e&&q.selectElementContents(e)},[t,a,s]),N.jsx("span",{ref:v,role:"spinbutton","aria-label":I[n],"aria-valuenow":_??void 0,"aria-valuemin":1,"aria-valuemax":g,"aria-valuetext":t,"aria-disabled":l||void 0,"aria-readonly":o||void 0,contentEditable:s&&a,suppressContentEditableWarning:!0,tabIndex:a?0:-1,inputMode:s?"numeric":void 0,spellCheck:!1,autoCorrect:"off",autoCapitalize:"off","data-segment":n,"data-active":a,"data-placeholder":C,onFocus:p,onBlur:x,onInput:D,onKeyDown:e=>h(n,e),onMouseUp:e=>e.preventDefault(),className:F(u[c.segment]),children:t})};exports.DateFieldSegment=$;exports.baseClassNamePrefix=R;exports.classModifierPrefix=k;exports.staticDateFieldClassNames=c;exports.styles=u;

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("clsx");require("react");const e=require("../../../chunks/DateField.Segment.BBcn6sug.js");require("./DateField.utils.cjs.js");exports.DateFieldSegment=e.DateFieldSegment;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");require("clsx");require("react");const e=require("../../../chunks/DateField.Segment.CY0jg03_.js");require("./DateField.utils.cjs.js");exports.DateFieldSegment=e.DateFieldSegment;

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

@@ -1,2 +1,2 @@
 import { DateFieldSegmentProps } from './DateField.types';
-export declare const DateFieldSegment: ({ type, value, displayValue, isPlaceholder, isActive, disabled, readOnly, onFocus, onBlur, onInput, segmentRef, }: DateFieldSegmentProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateFieldSegment: ({ type, value, valueMax, displayValue, isPlaceholder, isActive, disabled, readOnly, onFocus, onBlur, onInput, onKeyDown, segmentRef, }: DateFieldSegmentProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "clsx";
 import "react";
-import { D as p } from "../../../chunks/DateField.Segment.BVKky9IE.js";
+import { D as p } from "../../../chunks/DateField.Segment.C2qoaY0Z.js";
 import "./DateField.utils.es.js";
 export {
   p as DateFieldSegment

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),t=require("../../../chunks/DateField.Segment.BBcn6sug.js"),l=require("./DateField.utils.cjs.js"),i=[{type:"month",value:""},{type:"literal",value:"/"},{type:"day",value:""},{type:"literal",value:"/"},{type:"year",value:""}],F={month:"MM",day:"DD",year:"YYYY"},R=l.getSegmentOrder(i),v=({segmentText:n,segmentValues:r,focusedSegment:o,disabled:u,readOnly:c,onSegmentFocus:d,onSegmentBlur:y,onSegmentInput:m,registerSegmentRef:p})=>a.jsx("span",{className:t.styles[t.staticDateFieldClassNames.segments],children:i.map((s,D)=>{if(s.type==="literal")return a.jsx("span",{"aria-hidden":"true",className:t.styles[t.staticDateFieldClassNames.separator],children:s.value},`literal-${D}`);const e=s.type,g=F[e],{displayValue:S,isPlaceholder:_}=l.getSegmentDisplay(e,n[e],g);return a.jsx(t.DateFieldSegment,{type:e,value:r[e],displayValue:S,isPlaceholder:_,isActive:o===e,disabled:u,readOnly:c,onFocus:()=>d(e),onBlur:y,onInput:m,segmentRef:p(e)},e)})});exports.DateFieldSegments=v;exports.PARTS_ORDER=R;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("../../../chunks/DateField.Segment.CY0jg03_.js"),a=require("./DateField.utils.cjs.js"),i=[{type:"month",value:""},{type:"literal",value:"/"},{type:"day",value:""},{type:"literal",value:"/"},{type:"year",value:""}],h={month:"MM",day:"DD",year:"YYYY"},A=a.getSegmentOrder(i),M=({segmentText:r,segmentValues:s,focusedSegment:o,disabled:c,readOnly:y,onSegmentFocus:d,onSegmentBlur:u,onSegmentInput:p,onSegmentKeyDown:m,registerSegmentRef:D})=>{const S=a.getDaysInMonth(s.year,s.month);return n.jsx("span",{className:t.styles[t.staticDateFieldClassNames.segments],children:i.map((l,_)=>{if(l.type==="literal")return n.jsx("span",{"aria-hidden":"true",className:t.styles[t.staticDateFieldClassNames.separator],children:l.value},`literal-${_}`);const e=l.type,g=h[e],{displayValue:R,isPlaceholder:v}=a.getSegmentDisplay(e,r[e],g),F=e==="day"?S:a.SEGMENT_ARIA_MAX[e];return n.jsx(t.DateFieldSegment,{type:e,value:s[e],valueMax:F,displayValue:R,isPlaceholder:v,isActive:o===e,disabled:c,readOnly:y,onFocus:()=>d(e),onBlur:u,onInput:p,onKeyDown:m,segmentRef:D(e)},e)})})};exports.DateFieldSegments=M;exports.PARTS_ORDER=A;

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

@@ -1,4 +1,4 @@
-import { FocusEvent } from 'react';
+import { FocusEvent, KeyboardEvent } from 'react';
 import { FocusTarget, SegmentText, SegmentType, SegmentValues } from './DateField.types';
 export declare const PARTS_ORDER: ReadonlyArray<SegmentType>;
 export interface DateFieldSegmentsProps {
@@ -9,9 +9,14 @@ export interface DateFieldSegmentsProps {
     focusedSegment: FocusTarget;
     disabled: boolean;
     readOnly: boolean;
+    /** Forwarded to each segment's focus handler. */
     onSegmentFocus: (segment: SegmentType) => void;
+    /** Forwarded to each segment's blur handler. */
     onSegmentBlur: (event: FocusEvent<HTMLSpanElement>) => void;
+    /** Forwarded to each segment's single-digit input handler. */
     onSegmentInput: (segment: SegmentType, char: string) => void;
+    /** Keyboard handler from `useDateFieldKeyboard`, forwarded to each segment. */
+    onSegmentKeyDown: (segment: SegmentType, event: KeyboardEvent<HTMLSpanElement>) => void;
     registerSegmentRef: (segment: SegmentType) => (element: HTMLSpanElement | null) => void;
 }
-export declare const DateFieldSegments: ({ segmentText, segmentValues, focusedSegment, disabled, readOnly, onSegmentFocus, onSegmentBlur, onSegmentInput, registerSegmentRef, }: DateFieldSegmentsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateFieldSegments: ({ segmentText, segmentValues, focusedSegment, disabled, readOnly, onSegmentFocus, onSegmentBlur, onSegmentInput, onSegmentKeyDown, registerSegmentRef, }: DateFieldSegmentsProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,61 +1,67 @@
-import { jsx as a } from "react/jsx-runtime";
-import { s, a as l, D as h } from "../../../chunks/DateField.Segment.BVKky9IE.js";
-import { getSegmentOrder as R, getSegmentDisplay as f } from "./DateField.utils.es.js";
-const n = [
+import { jsx as s } from "react/jsx-runtime";
+import { s as n, a as l, D as R } from "../../../chunks/DateField.Segment.C2qoaY0Z.js";
+import { getSegmentOrder as E, getDaysInMonth as f, getSegmentDisplay as N, SEGMENT_ARIA_MAX as _ } from "./DateField.utils.es.js";
+const o = [
   { type: "month", value: "" },
   { type: "literal", value: "/" },
   { type: "day", value: "" },
   { type: "literal", value: "/" },
   { type: "year", value: "" }
-], A = {
+], x = {
   month: "MM",
   day: "DD",
   year: "YYYY"
-}, P = R(n), Y = ({
+}, Y = E(o), I = ({
   segmentText: r,
-  segmentValues: o,
+  segmentValues: t,
   focusedSegment: i,
-  disabled: m,
+  disabled: y,
   readOnly: p,
   onSegmentFocus: c,
-  onSegmentBlur: y,
-  onSegmentInput: u,
-  registerSegmentRef: d
-}) => /* @__PURE__ */ a("span", { className: s[l.segments], children: n.map((t, g) => {
-  if (t.type === "literal")
-    return /* @__PURE__ */ a(
-      "span",
+  onSegmentBlur: m,
+  onSegmentInput: d,
+  onSegmentKeyDown: u,
+  registerSegmentRef: D
+}) => {
+  const h = f(t.year, t.month);
+  return /* @__PURE__ */ s("span", { className: n[l.segments], children: o.map((a, v) => {
+    if (a.type === "literal")
+      return /* @__PURE__ */ s(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: n[l.separator],
+          children: a.value
+        },
+        `literal-${v}`
+      );
+    const e = a.type, S = x[e], { displayValue: g, isPlaceholder: A } = N(
+      e,
+      r[e],
+      S
+    ), M = e === "day" ? h : _[e];
+    return /* @__PURE__ */ s(
+      R,
       {
-        "aria-hidden": "true",
-        className: s[l.separator],
-        children: t.value
+        type: e,
+        value: t[e],
+        valueMax: M,
+        displayValue: g,
+        isPlaceholder: A,
+        isActive: i === e,
+        disabled: y,
+        readOnly: p,
+        onFocus: () => c(e),
+        onBlur: m,
+        onInput: d,
+        onKeyDown: u,
+        segmentRef: D(e)
       },
-      `literal-${g}`
+      e
     );
-  const e = t.type, D = A[e], { displayValue: v, isPlaceholder: S } = f(
-    e,
-    r[e],
-    D
-  );
-  return /* @__PURE__ */ a(
-    h,
-    {
-      type: e,
-      value: o[e],
-      displayValue: v,
-      isPlaceholder: S,
-      isActive: i === e,
-      disabled: m,
-      readOnly: p,
-      onFocus: () => c(e),
-      onBlur: y,
-      onInput: u,
-      segmentRef: d(e)
-    },
-    e
-  );
-}) });
+  }) });
+};
 export {
-  Y as DateFieldSegments,
-  P as PARTS_ORDER
+  I as DateFieldSegments,
+  Y as PARTS_ORDER
 };

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

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

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

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