@viasat/beam-react 2.53.0 → 2.54.0

package/CHANGELOG.md

@@ -1,3 +1,13 @@
+## 2.54.0 (2026-08-12)
+
+### 🚀 Features
+
+- **DateField:** Segment locale based order ([#1392](https://git.viasat.com/vega/Beam/pull/1392))
+
+### ❤️ Thank You
+
+- Roman-Ionita, Alin
+
 ## 2.53.0 (2026-08-10)
 
 ### 🚀 Features

package/assets/DateField.css

@@ -1 +1 @@
-:root,:host,.bm-light,.bm-dark .bm-inverse,.bm-dark.bm-inverse,[data-bm-theme~=bm-dark] .bm-inverse,[data-bm-theme~=bm-dark].bm-inverse,.bm-enterprise,.bm-consumer,[data-bm-theme~=bm-light]{--bm-comp-input-color-bg:var(--bm-sem-color-surface-01,#fff);--bm-comp-input-color-bg-disabled:var(--bm-sem-color-surface-highlight,#9fafbc29);--bm-comp-input-color-border:var(--bm-sem-color-border-strong,#8697a5);--bm-comp-input-color-border-error:var(--bm-sem-color-border-negative-strong,#cc2429);--bm-comp-input-color-border-disabled:#8697a566;--bm-comp-input-color-text:var(--bm-sem-color-text-primary,#141d24);--bm-comp-input-color-text-placeholder:var(--bm-sem-color-text-secondary,#576775);--bm-comp-input-color-text-disabled:var(--bm-sem-color-text-disabled,#57677566);--bm-comp-input-color-icon-disabled:var(--bm-sem-color-text-disabled,#57677566);--bm-comp-input-color-icon:var(--bm-sem-color-icon-secondary,#576775);--bm-comp-input-color-icon-error:var(--bm-sem-color-icon-negative-strong,#cc2429);--bm-comp-input-color-divider:var(--bm-sem-color-border-02,#d1dae0);--bm-comp-input-color-choice-checkbox-selected-bg:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-checkbox-selected-icon:var(--bm-sem-color-icon-primary-inverse,#fff);--bm-comp-input-color-choice-checkbox-selected-bg-error:var(--bm-sem-color-surface-negative-strong,#cc2429);--bm-comp-input-color-choice-checkbox-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-switch-selected-bg:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-switch-selected-icon:var(--bm-sem-color-icon-primary-inverse,#fff);--bm-comp-input-color-choice-switch-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-radio-selected-bg:var(--bm-sem-color-surface-01,#fff);--bm-comp-input-color-choice-radio-selected-border:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-radio-selected-inner-circle:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-radio-selected-bg-error:var(--bm-sem-color-surface-01,#fff);--bm-comp-input-color-choice-radio-selected-border-error:var(--bm-sem-color-surface-negative-strong,#cc2429);--bm-comp-input-color-choice-radio-selected-inner-circle-error:var(--bm-sem-color-surface-negative-strong,#cc2429);--bm-comp-input-typo-sm:var(--bm-sem-typo-compact-body-sm,400 .875rem/1rem "Source Sans Pro");--bm-comp-input-typo-md:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-lg:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-character-count:var(--bm-sem-typo-body-sm,400 .875rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-label-choice:var(--bm-sem-typo-body-md,400 1rem/1.5rem "Source Sans Pro");--bm-comp-input-space-field-x-sm:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-x-md:var(--bm-sem-space-100,1rem);--bm-comp-input-space-field-x-lg:var(--bm-sem-space-125,1.25rem);--bm-comp-input-space-field-y-sm:var(--bm-sem-space-25,.25rem);--bm-comp-input-space-field-y-md:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-field-y-lg:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-gap:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-inside:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-y:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-x:var(--bm-sem-space-100,1rem);--bm-comp-input-space-choice-nudge:var(--bm-primitive-dimension-12,.125rem);--bm-comp-input-size-field-height-sm:var(--bm-sem-size-height-sm,2rem);--bm-comp-input-size-field-height-md:var(--bm-sem-size-height-md,2.5rem);--bm-comp-input-size-field-height-lg:var(--bm-sem-size-height-lg,3rem);--bm-comp-input-size-field-width:var(--bm-primitive-dimension-1800,18rem);--bm-comp-input-size-field-icon-sm:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-field-icon-md:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-icon-lg:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-text-area-height:var(--bm-primitive-dimension-475,4.75rem);--bm-comp-input-size-choice-checkbox:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio-inside:var(--bm-primitive-dimension-50,.5rem);--bm-comp-input-size-choice-switch-height:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-choice-switch-width:var(--bm-primitive-dimension-250,2.5rem);--bm-comp-input-size-choice-switch-knob:var(--bm-primitive-dimension-87,.875rem);--bm-comp-input-radius-field:var(--bm-sem-radius-input-md,.25rem);--bm-comp-input-radius-choice-checkbox:var(--bm-sem-radius-input-sm,.125rem);--bm-comp-input-radius-choice-radio:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-radius-choice-switch:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-border-width-field-default:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-border-width-field-error:var(--bm-sem-border-width-lg,.125rem);--bm-comp-input-border-width-choice:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-shadow-field:var(--bm-sem-shadow-none,0 0 0 0 #0000)}:host,.bm-dark,.bm-light .bm-inverse,.bm-light.bm-inverse,[data-bm-theme~=bm-light] .bm-inverse,[data-bm-theme~=bm-light].bm-inverse,.bm-enterprise,.bm-consumer,[data-bm-theme~=bm-dark]{--bm-comp-input-color-bg:var(--bm-sem-color-surface-01,#202e39);--bm-comp-input-color-bg-disabled:var(--bm-sem-color-surface-highlight,#8697a529);--bm-comp-input-color-border:var(--bm-sem-color-border-strong,#9fafbc);--bm-comp-input-color-border-error:var(--bm-sem-color-border-negative-strong,#f67378);--bm-comp-input-color-border-disabled:#9fafbc66;--bm-comp-input-color-text:var(--bm-sem-color-text-primary,#fff);--bm-comp-input-color-text-placeholder:var(--bm-sem-color-text-secondary,#c3cdd5);--bm-comp-input-color-text-disabled:var(--bm-sem-color-text-disabled,#c3cdd566);--bm-comp-input-color-icon-disabled:var(--bm-sem-color-text-disabled,#c3cdd566);--bm-comp-input-color-icon:var(--bm-sem-color-icon-secondary,#c3cdd5);--bm-comp-input-color-icon-error:var(--bm-sem-color-icon-negative-strong,#f67378);--bm-comp-input-color-divider:var(--bm-sem-color-border-02,#465967);--bm-comp-input-color-choice-checkbox-selected-bg:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-checkbox-selected-icon:var(--bm-sem-color-icon-primary-inverse,#141d24);--bm-comp-input-color-choice-checkbox-selected-bg-error:var(--bm-sem-color-surface-negative-strong,#f67378);--bm-comp-input-color-choice-checkbox-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-switch-selected-bg:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-switch-selected-icon:var(--bm-sem-color-icon-primary-inverse,#141d24);--bm-comp-input-color-choice-switch-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-radio-selected-bg:var(--bm-sem-color-surface-01,#202e39);--bm-comp-input-color-choice-radio-selected-border:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-radio-selected-inner-circle:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-radio-selected-bg-error:var(--bm-sem-color-surface-01,#202e39);--bm-comp-input-color-choice-radio-selected-border-error:var(--bm-sem-color-surface-negative-strong,#f67378);--bm-comp-input-color-choice-radio-selected-inner-circle-error:var(--bm-sem-color-surface-negative-strong,#f67378);--bm-comp-input-typo-sm:var(--bm-sem-typo-compact-body-sm,400 .875rem/1rem "Source Sans Pro");--bm-comp-input-typo-md:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-lg:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-character-count:var(--bm-sem-typo-body-sm,400 .875rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-label-choice:var(--bm-sem-typo-body-md,400 1rem/1.5rem "Source Sans Pro");--bm-comp-input-space-field-x-sm:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-x-md:var(--bm-sem-space-100,1rem);--bm-comp-input-space-field-x-lg:var(--bm-sem-space-125,1.25rem);--bm-comp-input-space-field-y-sm:var(--bm-sem-space-25,.25rem);--bm-comp-input-space-field-y-md:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-field-y-lg:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-gap:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-inside:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-y:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-x:var(--bm-sem-space-100,1rem);--bm-comp-input-space-choice-nudge:var(--bm-primitive-dimension-12,.125rem);--bm-comp-input-size-field-height-sm:var(--bm-sem-size-height-sm,2rem);--bm-comp-input-size-field-height-md:var(--bm-sem-size-height-md,2.5rem);--bm-comp-input-size-field-height-lg:var(--bm-sem-size-height-lg,3rem);--bm-comp-input-size-field-width:var(--bm-primitive-dimension-1800,18rem);--bm-comp-input-size-field-icon-sm:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-field-icon-md:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-icon-lg:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-text-area-height:var(--bm-primitive-dimension-475,4.75rem);--bm-comp-input-size-choice-checkbox:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio-inside:var(--bm-primitive-dimension-50,.5rem);--bm-comp-input-size-choice-switch-height:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-choice-switch-width:var(--bm-primitive-dimension-250,2.5rem);--bm-comp-input-size-choice-switch-knob:var(--bm-primitive-dimension-87,.875rem);--bm-comp-input-radius-field:var(--bm-sem-radius-input-md,.25rem);--bm-comp-input-radius-choice-checkbox:var(--bm-sem-radius-input-sm,.125rem);--bm-comp-input-radius-choice-radio:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-radius-choice-switch:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-border-width-field-default:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-border-width-field-error:var(--bm-sem-border-width-lg,.125rem);--bm-comp-input-border-width-choice:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-shadow-field:var(--bm-sem-shadow-none,0 0 0 0 #0000)}.bm-date-field{--bm-label-cursor:pointer;max-width:var(--bm-comp-input-size-field-width);--bm-label-space-bottom:var(--bm-comp-label-space-bottom);--bm-helper-text-space-top:var(--bm-comp-helper-text-space-top)}.bm-date-field--disabled{--bm-label-cursor:not-allowed;--bm-label-pointer-events:auto;--bm-text-field-cursor:not-allowed;--bm-text-field-input-cursor:not-allowed}.bm-date-field--error .bm-date-field__field{border-color:var(--bm-comp-input-color-border-error);background-color:var(--bm-comp-input-color-bg);outline-offset:calc(0px - var(--bm-comp-input-border-width-field-error));outline:var(--bm-comp-input-border-width-field-error)solid var(--bm-comp-input-color-border-error)}.bm-date-field--error .bm-date-field__field .bm-date-field__segment{color:var(--bm-comp-input-color-text)}.bm-date-field--error .bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-placeholder)}.bm-date-field--read-only .bm-date-field__field{border-color:var(--bm-comp-input-color-border-disabled);background-color:var(--bm-comp-input-color-bg-disabled)}.bm-date-field--read-only .bm-date-field__field .bm-date-field__segment{color:var(--bm-comp-input-color-text)}.bm-date-field--read-only .bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-placeholder)}.bm-date-field--disabled .bm-date-field__field{border-color:var(--bm-comp-input-color-border-disabled);background-color:var(--bm-comp-input-color-bg-disabled)}.bm-date-field--disabled .bm-date-field__field .bm-date-field__segment,.bm-date-field--disabled .bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-disabled)}.bm-date-field--fluid{max-width:100%}.bm-date-field__field{box-sizing:border-box;border-style:solid;border-color:var(--bm-comp-input-color-border);border-radius:var(--bm-comp-input-radius-field);border-width:var(--bm-comp-input-border-width-field-default);align-items:center;gap:var(--bm-comp-input-space-field-gap);box-shadow:var(--bm-comp-input-shadow-field);background-color:var(--bm-comp-input-color-bg);height:var(--bm-comp-input-size-field-height-md);padding-block:var(--bm-comp-input-space-field-y-md);padding-inline:var(--bm-comp-input-space-field-x-md);flex-wrap:nowrap;display:flex;position:relative}.bm-date-field__field:focus-within{outline-offset:calc(0px - var(--bm-sem-size-focus-offset));outline:var(--bm-sem-border-width-focus)solid var(--bm-sem-color-border-focus)}.bm-date-field__field .bm-date-field__segments{color:var(--bm-comp-input-color-text);font:var(--bm-comp-input-typo-md);font-variant-numeric:tabular-nums;align-items:baseline;gap:var(--bm-sem-space-12);display:inline-flex}.bm-date-field__field .bm-date-field__segment{box-sizing:border-box;text-align:center;border-bottom:var(--bm-sem-border-width-focus)solid transparent;outline:none;min-inline-size:2ch;display:inline-block}.bm-date-field__field .bm-date-field__segment[data-segment=year]{min-inline-size:4ch}.bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-placeholder)}.bm-date-field__field .bm-date-field__segment[data-active=true]{border-bottom-color:var(--bm-sem-color-border-focus)}.bm-date-field__field .bm-date-field__segment:focus-visible{border-bottom-color:var(--bm-sem-color-border-focus)}.bm-date-field__field .bm-date-field__segment::selection{background-color:var(--bm-sem-color-surface-info-primary)}.bm-date-field__field .bm-date-field__separator{color:var(--bm-comp-input-color-text);font:var(--bm-comp-input-typo-md);-webkit-user-select:none;user-select:none}.bm-date-field__sr-status{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
+:root,:host,.bm-light,.bm-dark .bm-inverse,.bm-dark.bm-inverse,[data-bm-theme~=bm-dark] .bm-inverse,[data-bm-theme~=bm-dark].bm-inverse,.bm-enterprise,.bm-consumer,[data-bm-theme~=bm-light]{--bm-comp-input-color-bg:var(--bm-sem-color-surface-01,#fff);--bm-comp-input-color-bg-disabled:var(--bm-sem-color-surface-highlight,#9fafbc29);--bm-comp-input-color-border:var(--bm-sem-color-border-strong,#8697a5);--bm-comp-input-color-border-error:var(--bm-sem-color-border-negative-strong,#cc2429);--bm-comp-input-color-border-disabled:#8697a566;--bm-comp-input-color-text:var(--bm-sem-color-text-primary,#141d24);--bm-comp-input-color-text-placeholder:var(--bm-sem-color-text-secondary,#576775);--bm-comp-input-color-text-disabled:var(--bm-sem-color-text-disabled,#57677566);--bm-comp-input-color-icon-disabled:var(--bm-sem-color-text-disabled,#57677566);--bm-comp-input-color-icon:var(--bm-sem-color-icon-secondary,#576775);--bm-comp-input-color-icon-error:var(--bm-sem-color-icon-negative-strong,#cc2429);--bm-comp-input-color-divider:var(--bm-sem-color-border-02,#d1dae0);--bm-comp-input-color-choice-checkbox-selected-bg:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-checkbox-selected-icon:var(--bm-sem-color-icon-primary-inverse,#fff);--bm-comp-input-color-choice-checkbox-selected-bg-error:var(--bm-sem-color-surface-negative-strong,#cc2429);--bm-comp-input-color-choice-checkbox-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-switch-selected-bg:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-switch-selected-icon:var(--bm-sem-color-icon-primary-inverse,#fff);--bm-comp-input-color-choice-switch-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-radio-selected-bg:var(--bm-sem-color-surface-01,#fff);--bm-comp-input-color-choice-radio-selected-border:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-radio-selected-inner-circle:var(--bm-alias-color-brand-primary-default,#00768f);--bm-comp-input-color-choice-radio-selected-bg-error:var(--bm-sem-color-surface-01,#fff);--bm-comp-input-color-choice-radio-selected-border-error:var(--bm-sem-color-surface-negative-strong,#cc2429);--bm-comp-input-color-choice-radio-selected-inner-circle-error:var(--bm-sem-color-surface-negative-strong,#cc2429);--bm-comp-input-typo-sm:var(--bm-sem-typo-compact-body-sm,400 .875rem/1rem "Source Sans Pro");--bm-comp-input-typo-md:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-lg:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-character-count:var(--bm-sem-typo-body-sm,400 .875rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-label-choice:var(--bm-sem-typo-body-md,400 1rem/1.5rem "Source Sans Pro");--bm-comp-input-space-field-x-sm:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-x-md:var(--bm-sem-space-100,1rem);--bm-comp-input-space-field-x-lg:var(--bm-sem-space-125,1.25rem);--bm-comp-input-space-field-y-sm:var(--bm-sem-space-25,.25rem);--bm-comp-input-space-field-y-md:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-field-y-lg:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-gap:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-inside:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-y:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-x:var(--bm-sem-space-100,1rem);--bm-comp-input-space-choice-nudge:var(--bm-primitive-dimension-12,.125rem);--bm-comp-input-size-field-height-sm:var(--bm-sem-size-height-sm,2rem);--bm-comp-input-size-field-height-md:var(--bm-sem-size-height-md,2.5rem);--bm-comp-input-size-field-height-lg:var(--bm-sem-size-height-lg,3rem);--bm-comp-input-size-field-width:var(--bm-primitive-dimension-1800,18rem);--bm-comp-input-size-field-icon-sm:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-field-icon-md:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-icon-lg:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-text-area-height:var(--bm-primitive-dimension-475,4.75rem);--bm-comp-input-size-choice-checkbox:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio-inside:var(--bm-primitive-dimension-50,.5rem);--bm-comp-input-size-choice-switch-height:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-choice-switch-width:var(--bm-primitive-dimension-250,2.5rem);--bm-comp-input-size-choice-switch-knob:var(--bm-primitive-dimension-87,.875rem);--bm-comp-input-radius-field:var(--bm-sem-radius-input-md,.25rem);--bm-comp-input-radius-choice-checkbox:var(--bm-sem-radius-input-sm,.125rem);--bm-comp-input-radius-choice-radio:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-radius-choice-switch:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-border-width-field-default:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-border-width-field-error:var(--bm-sem-border-width-lg,.125rem);--bm-comp-input-border-width-choice:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-shadow-field:var(--bm-sem-shadow-none,0 0 0 0 #0000)}:host,.bm-dark,.bm-light .bm-inverse,.bm-light.bm-inverse,[data-bm-theme~=bm-light] .bm-inverse,[data-bm-theme~=bm-light].bm-inverse,.bm-enterprise,.bm-consumer,[data-bm-theme~=bm-dark]{--bm-comp-input-color-bg:var(--bm-sem-color-surface-01,#202e39);--bm-comp-input-color-bg-disabled:var(--bm-sem-color-surface-highlight,#8697a529);--bm-comp-input-color-border:var(--bm-sem-color-border-strong,#9fafbc);--bm-comp-input-color-border-error:var(--bm-sem-color-border-negative-strong,#f67378);--bm-comp-input-color-border-disabled:#9fafbc66;--bm-comp-input-color-text:var(--bm-sem-color-text-primary,#fff);--bm-comp-input-color-text-placeholder:var(--bm-sem-color-text-secondary,#c3cdd5);--bm-comp-input-color-text-disabled:var(--bm-sem-color-text-disabled,#c3cdd566);--bm-comp-input-color-icon-disabled:var(--bm-sem-color-text-disabled,#c3cdd566);--bm-comp-input-color-icon:var(--bm-sem-color-icon-secondary,#c3cdd5);--bm-comp-input-color-icon-error:var(--bm-sem-color-icon-negative-strong,#f67378);--bm-comp-input-color-divider:var(--bm-sem-color-border-02,#465967);--bm-comp-input-color-choice-checkbox-selected-bg:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-checkbox-selected-icon:var(--bm-sem-color-icon-primary-inverse,#141d24);--bm-comp-input-color-choice-checkbox-selected-bg-error:var(--bm-sem-color-surface-negative-strong,#f67378);--bm-comp-input-color-choice-checkbox-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-switch-selected-bg:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-switch-selected-icon:var(--bm-sem-color-icon-primary-inverse,#141d24);--bm-comp-input-color-choice-switch-selected-border:var(--bm-sem-color-none,#fff0);--bm-comp-input-color-choice-radio-selected-bg:var(--bm-sem-color-surface-01,#202e39);--bm-comp-input-color-choice-radio-selected-border:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-radio-selected-inner-circle:var(--bm-alias-color-brand-primary-default,#43bfd6);--bm-comp-input-color-choice-radio-selected-bg-error:var(--bm-sem-color-surface-01,#202e39);--bm-comp-input-color-choice-radio-selected-border-error:var(--bm-sem-color-surface-negative-strong,#f67378);--bm-comp-input-color-choice-radio-selected-inner-circle-error:var(--bm-sem-color-surface-negative-strong,#f67378);--bm-comp-input-typo-sm:var(--bm-sem-typo-compact-body-sm,400 .875rem/1rem "Source Sans Pro");--bm-comp-input-typo-md:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-lg:var(--bm-sem-typo-compact-body-md,400 1rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-character-count:var(--bm-sem-typo-body-sm,400 .875rem/1.25rem "Source Sans Pro");--bm-comp-input-typo-label-choice:var(--bm-sem-typo-body-md,400 1rem/1.5rem "Source Sans Pro");--bm-comp-input-space-field-x-sm:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-x-md:var(--bm-sem-space-100,1rem);--bm-comp-input-space-field-x-lg:var(--bm-sem-space-125,1.25rem);--bm-comp-input-space-field-y-sm:var(--bm-sem-space-25,.25rem);--bm-comp-input-space-field-y-md:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-field-y-lg:var(--bm-sem-space-75,.75rem);--bm-comp-input-space-field-gap:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-inside:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-y:var(--bm-sem-space-50,.5rem);--bm-comp-input-space-choice-gap-items-x:var(--bm-sem-space-100,1rem);--bm-comp-input-space-choice-nudge:var(--bm-primitive-dimension-12,.125rem);--bm-comp-input-size-field-height-sm:var(--bm-sem-size-height-sm,2rem);--bm-comp-input-size-field-height-md:var(--bm-sem-size-height-md,2.5rem);--bm-comp-input-size-field-height-lg:var(--bm-sem-size-height-lg,3rem);--bm-comp-input-size-field-width:var(--bm-primitive-dimension-1800,18rem);--bm-comp-input-size-field-icon-sm:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-field-icon-md:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-icon-lg:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-field-text-area-height:var(--bm-primitive-dimension-475,4.75rem);--bm-comp-input-size-choice-checkbox:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio:var(--bm-sem-size-icon-sm,1rem);--bm-comp-input-size-choice-radio-inside:var(--bm-primitive-dimension-50,.5rem);--bm-comp-input-size-choice-switch-height:var(--bm-sem-size-icon-md,1.25rem);--bm-comp-input-size-choice-switch-width:var(--bm-primitive-dimension-250,2.5rem);--bm-comp-input-size-choice-switch-knob:var(--bm-primitive-dimension-87,.875rem);--bm-comp-input-radius-field:var(--bm-sem-radius-input-md,.25rem);--bm-comp-input-radius-choice-checkbox:var(--bm-sem-radius-input-sm,.125rem);--bm-comp-input-radius-choice-radio:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-radius-choice-switch:var(--bm-sem-radius-input-lg,624.938rem);--bm-comp-input-border-width-field-default:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-border-width-field-error:var(--bm-sem-border-width-lg,.125rem);--bm-comp-input-border-width-choice:var(--bm-sem-border-width-input,.063rem);--bm-comp-input-shadow-field:var(--bm-sem-shadow-none,0 0 0 0 #0000)}.bm-date-field{--bm-label-cursor:pointer;max-width:var(--bm-comp-input-size-field-width);--bm-label-space-bottom:var(--bm-comp-label-space-bottom);--bm-helper-text-space-top:var(--bm-comp-helper-text-space-top)}.bm-date-field--disabled{--bm-label-cursor:not-allowed;--bm-label-pointer-events:auto;--bm-text-field-cursor:not-allowed;--bm-text-field-input-cursor:not-allowed}.bm-date-field--error .bm-date-field__field{border-color:var(--bm-comp-input-color-border-error);background-color:var(--bm-comp-input-color-bg);outline-offset:calc(0px - var(--bm-comp-input-border-width-field-error));outline:var(--bm-comp-input-border-width-field-error)solid var(--bm-comp-input-color-border-error)}.bm-date-field--error .bm-date-field__field .bm-date-field__segment{color:var(--bm-comp-input-color-text)}.bm-date-field--error .bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-placeholder)}.bm-date-field--read-only .bm-date-field__field{border-color:var(--bm-comp-input-color-border-disabled);background-color:var(--bm-comp-input-color-bg-disabled)}.bm-date-field--read-only .bm-date-field__field .bm-date-field__segment{color:var(--bm-comp-input-color-text)}.bm-date-field--read-only .bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-placeholder)}.bm-date-field--disabled .bm-date-field__field{border-color:var(--bm-comp-input-color-border-disabled);background-color:var(--bm-comp-input-color-bg-disabled)}.bm-date-field--disabled .bm-date-field__field .bm-date-field__segment,.bm-date-field--disabled .bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-disabled)}.bm-date-field--fluid{max-width:100%}.bm-date-field__field{box-sizing:border-box;border-style:solid;border-color:var(--bm-comp-input-color-border);border-radius:var(--bm-comp-input-radius-field);border-width:var(--bm-comp-input-border-width-field-default);align-items:center;gap:var(--bm-comp-input-space-field-gap);box-shadow:var(--bm-comp-input-shadow-field);background-color:var(--bm-comp-input-color-bg);height:var(--bm-comp-input-size-field-height-md);padding-block:var(--bm-comp-input-space-field-y-md);padding-inline:var(--bm-comp-input-space-field-x-md);flex-wrap:nowrap;display:flex;position:relative}.bm-date-field__field:focus-within{outline-offset:calc(0px - var(--bm-sem-size-focus-offset));outline:var(--bm-sem-border-width-focus)solid var(--bm-sem-color-border-focus)}.bm-date-field__field .bm-date-field__segments{color:var(--bm-comp-input-color-text);font:var(--bm-comp-input-typo-md);font-variant-numeric:tabular-nums;align-items:baseline;gap:var(--bm-sem-space-12);display:inline-flex}.bm-date-field__field .bm-date-field__segment{box-sizing:border-box;text-align:center;border-block:var(--bm-sem-border-width-focus)solid transparent;outline:none;min-inline-size:2ch;display:inline-block}.bm-date-field__field .bm-date-field__segment[data-segment=year]{min-inline-size:4ch}.bm-date-field__field .bm-date-field__segment[data-placeholder=true]{color:var(--bm-comp-input-color-text-placeholder)}.bm-date-field__field .bm-date-field__segment[data-active=true]{border-bottom-color:var(--bm-sem-color-border-focus)}.bm-date-field__field .bm-date-field__segment:focus-visible{border-bottom-color:var(--bm-sem-color-border-focus)}.bm-date-field__field .bm-date-field__segment::selection{background-color:var(--bm-sem-color-surface-info-primary)}.bm-date-field__field .bm-date-field__separator{color:var(--bm-comp-input-color-text);font:var(--bm-comp-input-typo-md);-webkit-user-select:none;user-select:none}.bm-date-field__sr-status{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}

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

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

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

@@ -1,7 +1,8 @@
 import { FocusEvent, KeyboardEvent } from 'react';
-import { FocusTarget, SegmentRole, SegmentText, SegmentType, SegmentValues } from './DateField.types';
-export declare const PARTS_ORDER: ReadonlyArray<SegmentType>;
+import { DateFieldPart, FocusTarget, SegmentRole, SegmentText, SegmentType, SegmentValues } from './DateField.types';
 export interface DateFieldSegmentsProps {
+    /** Locale-derived ordered parts (segments + literal separators) to render. */
+    parts: ReadonlyArray<DateFieldPart>;
     /** Per-segment raw strings — the single source of truth for display. */
     segmentText: SegmentText;
     /** Derived per-segment numbers for `aria-valuenow`. */
@@ -23,4 +24,4 @@ export interface DateFieldSegmentsProps {
     onSegmentKeyDown: (segment: SegmentType, event: KeyboardEvent<HTMLSpanElement>) => void;
     registerSegmentRef: (segment: SegmentType) => (element: HTMLSpanElement | null) => void;
 }
-export declare const DateFieldSegments: ({ segmentText, segmentValues, focusedSegment, disabled, readOnly, invalid, role, onSegmentFocus, onSegmentBlur, onSegmentInput, onSegmentKeyDown, registerSegmentRef, }: DateFieldSegmentsProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateFieldSegments: ({ parts, segmentText, segmentValues, focusedSegment, disabled, readOnly, invalid, role, onSegmentFocus, onSegmentBlur, onSegmentInput, onSegmentKeyDown, registerSegmentRef, }: DateFieldSegmentsProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,70 +1,65 @@
 import { jsx as n } from "react/jsx-runtime";
-import { s, a as l, D as Y } from "../../../chunks/DateField.Segment.CwhRnhtq.js";
-import { getSegmentOrder as _, getDaysInMonth as f, getSegmentDisplay as T, YEAR_MAX as F, YEAR_MIN as O, MONTH_MAX as P, getMonthName as I } from "./DateField.utils.es.js";
-const m = [
-  { type: "month", value: "" },
-  { type: "literal", value: "/" },
-  { type: "day", value: "" },
-  { type: "literal", value: "/" },
-  { type: "year", value: "" }
-], B = {
+import { s, a as m, D as F } from "../../../chunks/DateField.Segment.CwhRnhtq.js";
+import { getDaysInMonth as R, getSegmentDisplay as S, YEAR_MAX as I, YEAR_MIN as T, MONTH_MAX as _, getMonthName as B } from "./DateField.utils.es.js";
+const C = {
   month: "MM",
   day: "DD",
   year: "YYYY"
-}, j = _(m), w = ({
-  segmentText: r,
+}, X = ({
+  parts: r,
+  segmentText: i,
   segmentValues: t,
-  focusedSegment: i,
-  disabled: y,
-  readOnly: c,
-  invalid: p,
-  role: d,
-  onSegmentFocus: u,
-  onSegmentBlur: h,
-  onSegmentInput: M,
-  onSegmentKeyDown: v,
+  focusedSegment: l,
+  disabled: c,
+  readOnly: y,
+  invalid: d,
+  role: p,
+  onSegmentFocus: h,
+  onSegmentBlur: M,
+  onSegmentInput: u,
+  onSegmentKeyDown: x,
   registerSegmentRef: D
 }) => {
-  const x = {
-    day: { min: 1, max: f(t.year, t.month) },
-    month: { min: 1, max: P },
-    year: { min: O, max: F }
+  const g = {
+    day: { min: 1, max: R(t.year, t.month) },
+    month: { min: 1, max: _ },
+    year: { min: T, max: I }
   };
-  return /* @__PURE__ */ n("span", { className: s[l.segments], children: m.map((a, g) => {
+  return /* @__PURE__ */ n("span", { className: s[m.segments], children: r.map((a, v) => {
     if (a.type === "literal")
       return /* @__PURE__ */ n(
         "span",
         {
           "aria-hidden": "true",
-          className: s[l.separator],
+          className: s[m.separator],
           children: a.value
         },
-        `literal-${g}`
+        `literal-${v}`
       );
-    const e = a.type, A = B[e], { displayValue: o, isPlaceholder: R } = T(
+    const e = a.type, A = C[e], { displayValue: o, isPlaceholder: N } = S(
       e,
-      r[e],
+      i[e],
       A
-    ), { min: S, max: N } = x[e], E = e === "month" && t.month != null ? I(t.month) : o;
+    ), { min: Y, max: f } = g[e], E = e === "month" && t.month != null ? B(t.month) : o;
     return /* @__PURE__ */ n(
-      Y,
+      F,
       {
         type: e,
         value: t[e],
-        valueMin: S,
-        valueMax: N,
+        valueMin: Y,
+        valueMax: f,
         displayValue: o,
-        isPlaceholder: R,
+        isPlaceholder: N,
         valueText: E,
-        invalid: p,
-        role: d,
-        isActive: i === e,
-        disabled: y,
-        readOnly: c,
-        onFocus: () => u(e),
-        onBlur: h,
-        onInput: M,
-        onKeyDown: v,
+        invalid: d,
+        role: p,
+        isActive: l === e,
+        disabled: c,
+        readOnly: y,
+        onFocus: () => h(e),
+        onBlur: M,
+        onInput: u,
+        onKeyDown: x,
         segmentRef: D(e)
       },
       e
@@ -72,6 +67,5 @@ const m = [
   }) });
 };
 export {
-  w as DateFieldSegments,
-  j as PARTS_ORDER
+  X as DateFieldSegments
 };

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),ye=require("clsx"),w=require("react"),e=require("../../../chunks/DateField.Segment.CqFLhMYA.js"),Se=require("../../../chunks/constants.CgMu0_1M.js"),he=require("../../../chunks/helpers.BIckGIbP.js"),qe=require("../../../chunks/form.context.CkC0TwMb.js"),we=require("../../Form/contexts/label.context.cjs.js"),Ie=require("../../Form/contexts/helperText.context.cjs.js"),Me=require("../../Form/hooks/useUniversalRef.hook.cjs.js"),Re=require("../../../utils/hooks/useIsMounted.cjs.js"),u=require("./DateField.Segments.cjs.js"),t=require("./DateField.utils.cjs.js"),Ne=require("./useDateFieldFocus.cjs.js"),Oe=require("./useDateFieldForm.cjs.js"),Pe=require("./useDateFieldKeyboard.cjs.js"),Te=require("./useDateFieldSegments.cjs.js"),Ve=require("./useDateFieldValidity.cjs.js"),je=require("./useDateFieldValue.cjs.js"),Ce=require("./useInvalidState.cjs.js"),Be=w.forwardRef(function({value:I,defaultValue:M,onChange:R,minDate:r,maxDate:d,getClampAnnouncement:N,label:c=null,helperText:b=null,error:F,hideRequiredMarker:O=!1,validationRules:P,width:T,theme:_,fluid:V=!1,disabled:j=!1,readOnly:C=!1,required:B=!1,name:f,id:E,className:K,style:H,"aria-label":L,"aria-describedby":$,"aria-labelledby":k,...A},U){const{disabled:s,readOnly:n,required:D,invalid:W,errorMessageProvided:m,defaultValue:z,errorId:p,helperTextId:G,validationErrorsId:J,labelId:x,ariaDescribedBy:Q,ariaLabelledBy:X,showErrors:Y}=Oe.useDateFieldForm({name:f,disabled:j,readOnly:C,required:B,defaultValue:M,error:F,hasHelperText:!!b,hasLabel:!!c,validationRules:P,ariaDescribedBy:$,ariaLabelledBy:k});w.useEffect(()=>{process.env.NODE_ENV!=="production"&&t.isMinMaxMisconfigured(r,d)&&console.warn("DateField: `minDate` is after `maxDate` — no date satisfies both, so the blur clamp is disabled and values are left as typed.")},[t.dateKeyOrNull(r),t.dateKeyOrNull(d)]);const{refFn:Z,ref:g}=Me.useUniversalRef(U),{segmentRefs:ee,registerSegmentRef:se}=Te.useDateFieldSegments(),{segmentText:ie,segmentValues:v,currentValue:y,wasTouched:ae,appendDigit:le,adjustSegment:te,clearSegment:re,beginSegmentEdit:de,commitOnBlur:ne,clampAnnouncement:oe}=je.useDateFieldValue({value:I,defaultValue:z,onChange:R,minDate:r,maxDate:d,getClampAnnouncement:N}),{focusedSegment:S,fieldTabIndex:ue,handleSegmentFocus:h,handleFieldFocus:ce,handleFieldBlur:be,handleFieldMouseDown:Fe,focusNext:q,focusPrevious:_e}=Ne.useDateFieldFocus({disabled:s,fieldRef:g,segmentRefs:ee,partsOrder:u.PARTS_ORDER,onSegmentFocusChange:de,onFieldBlur:ne}),fe=Pe.useDateFieldKeyboard({disabled:s,readOnly:n,fieldRef:g,focusNext:q,focusPrevious:_e,adjustSegment:te,clearSegment:re}),{isInvalid:De}=Ve.useDateFieldValidity({segments:v,currentValue:y,wasTouched:ae,isFocused:S!==null}),me=(a,l)=>{const{advanced:ve}=le(a,l);ve&&q(a)},o=Ce.useInvalidState({formInvalid:W,valueInvalid:De}),pe=Re.useIsMounted()&&he.isIOS()?"textbox":"spinbutton",xe=a=>{if(s)return;const l=a.target.closest("label");!l||l.id!==x||(a.preventDefault(),h(u.PARTS_ORDER[0]))},ge=ye(e.styles[e.baseClassNamePrefix],_&&Se.themeClassName(_),V&&e.styles[`${e.classModifierPrefix}fluid`],o&&e.styles[`${e.classModifierPrefix}error`],s&&e.styles[`${e.classModifierPrefix}disabled`],n&&e.styles[`${e.classModifierPrefix}read-only`],K);return i.jsxs("div",{className:ge,style:{...H,maxWidth:T},onMouseDownCapture:xe,children:[i.jsx(we.LabelProvider,{ctxId:x,ctxDisabled:s,ctxRequired:D&&!O,children:c}),i.jsx("div",{...A,ref:Z,id:E,role:"group","aria-label":L,"aria-labelledby":X,"aria-disabled":s||void 0,"aria-required":D||void 0,"aria-invalid":o||void 0,"aria-describedby":Q,"aria-errormessage":m?p:void 0,tabIndex:ue,className:e.styles[e.staticDateFieldClassNames.field],onMouseDown:Fe,onFocus:ce,children:i.jsx(u.DateFieldSegments,{segmentText:ie,segmentValues:v,focusedSegment:S,disabled:s,readOnly:n,invalid:o,role:pe,onSegmentFocus:h,onSegmentBlur:be,onSegmentInput:me,onSegmentKeyDown:fe,registerSegmentRef:se})}),i.jsx("span",{role:"status","aria-live":"polite","aria-atomic":"true",className:e.styles[e.staticDateFieldClassNames.srStatus],children:oe}),i.jsx("input",{type:"hidden",name:f,value:t.toISODateString(y),disabled:s}),i.jsxs(Ie.HelperTextProvider,{ctxId:G,ctxDisabled:s,children:[b,m&&i.jsx(qe.HelperText,{id:p,appearance:"negative",children:F})]}),Y(J)]})});exports.DateField=Be;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),qe=require("clsx"),r=require("react"),e=require("../../../chunks/DateField.Segment.CqFLhMYA.js"),we=require("../../../chunks/constants.CgMu0_1M.js"),Ie=require("../../../chunks/helpers.BIckGIbP.js"),Me=require("../../../chunks/form.context.CkC0TwMb.js"),Ne=require("../../Form/contexts/label.context.cjs.js"),Oe=require("../../Form/contexts/helperText.context.cjs.js"),Ve=require("../../Form/hooks/useUniversalRef.hook.cjs.js"),je=require("../../../utils/hooks/useIsMounted.cjs.js"),Pe=require("./DateField.Segments.cjs.js"),i=require("./DateField.utils.cjs.js"),Re=require("./useDateFieldFocus.cjs.js"),Ce=require("./useDateFieldForm.cjs.js"),Te=require("./useDateFieldKeyboard.cjs.js"),Be=require("./useDateFieldSegments.cjs.js"),Ee=require("./useDateFieldValidity.cjs.js"),Ke=require("./useDateFieldValue.cjs.js"),He=require("./useInvalidState.cjs.js"),Le=r.forwardRef(function({value:N,defaultValue:O,onChange:V,minDate:d,maxDate:n,getClampAnnouncement:j,locale:P,label:F=null,helperText:f=null,error:_,hideRequiredMarker:R=!1,validationRules:C,width:T,theme:m,fluid:B=!1,disabled:E=!1,readOnly:K=!1,required:H=!1,name:D,id:L,className:k,style:$,"aria-label":U,"aria-describedby":W,"aria-labelledby":A,...z},G){const{disabled:s,readOnly:o,required:p,invalid:J,errorMessageProvided:g,defaultValue:Q,errorId:x,helperTextId:X,validationErrorsId:Y,labelId:v,ariaDescribedBy:Z,ariaLabelledBy:ee,showErrors:se}=Ce.useDateFieldForm({name:D,disabled:E,readOnly:K,required:H,defaultValue:O,error:_,hasHelperText:!!f,hasLabel:!!F,validationRules:C,ariaDescribedBy:W,ariaLabelledBy:A});r.useEffect(()=>{process.env.NODE_ENV!=="production"&&i.isMinMaxMisconfigured(d,n)&&console.warn("DateField: `minDate` is after `maxDate` — no date satisfies both, so the blur clamp is disabled and values are left as typed.")},[i.dateKeyOrNull(d),i.dateKeyOrNull(n)]);const{refFn:ae,ref:y}=Ve.useUniversalRef(G),{segmentRefs:ie,registerSegmentRef:le}=Be.useDateFieldSegments(),te=P??"en-US",u=i.getDateParts(te),S=r.useMemo(()=>i.getSegmentOrder(u),[u]),{segmentText:re,segmentValues:h,currentValue:q,wasTouched:de,appendDigit:w,adjustSegment:ne,clearSegment:oe,beginSegmentEdit:ue,commitOnBlur:ce,clampAnnouncement:be}=Ke.useDateFieldValue({value:N,defaultValue:Q,onChange:V,minDate:d,maxDate:n,getClampAnnouncement:j}),{focusedSegment:I,fieldTabIndex:Fe,handleSegmentFocus:M,handleFieldFocus:fe,handleFieldBlur:_e,handleFieldMouseDown:me,focusNext:c,focusPrevious:De}=Re.useDateFieldFocus({disabled:s,fieldRef:y,segmentRefs:ie,partsOrder:S,onSegmentFocusChange:ue,onFieldBlur:ce}),pe=Te.useDateFieldKeyboard({disabled:s,readOnly:o,fieldRef:y,focusNext:c,focusPrevious:De,adjustSegment:ne,clearSegment:oe}),{isInvalid:ge}=Ee.useDateFieldValidity({segments:h,currentValue:q,wasTouched:de,isFocused:I!==null}),xe=r.useCallback((l,t)=>{const{advanced:he}=w(l,t);he&&c(l)},[w,c]),b=He.useInvalidState({formInvalid:J,valueInvalid:ge}),ve=je.useIsMounted()&&Ie.isIOS()?"textbox":"spinbutton",ye=l=>{if(s)return;const t=l.target.closest("label");!t||t.id!==v||(l.preventDefault(),M(S[0]))},Se=qe(e.styles[e.baseClassNamePrefix],m&&we.themeClassName(m),B&&e.styles[`${e.classModifierPrefix}fluid`],b&&e.styles[`${e.classModifierPrefix}error`],s&&e.styles[`${e.classModifierPrefix}disabled`],o&&e.styles[`${e.classModifierPrefix}read-only`],k);return a.jsxs("div",{className:Se,style:{...$,maxWidth:T},onMouseDownCapture:ye,children:[a.jsx(Ne.LabelProvider,{ctxId:v,ctxDisabled:s,ctxRequired:p&&!R,children:F}),a.jsx("div",{...z,ref:ae,id:L,role:"group","aria-label":U,"aria-labelledby":ee,"aria-disabled":s||void 0,"aria-required":p||void 0,"aria-invalid":b||void 0,"aria-describedby":Z,"aria-errormessage":g?x:void 0,tabIndex:Fe,className:e.styles[e.staticDateFieldClassNames.field],onMouseDown:me,onFocus:fe,children:a.jsx(Pe.DateFieldSegments,{parts:u,segmentText:re,segmentValues:h,focusedSegment:I,disabled:s,readOnly:o,invalid:b,role:ve,onSegmentFocus:M,onSegmentBlur:_e,onSegmentInput:xe,onSegmentKeyDown:pe,registerSegmentRef:le})}),a.jsx("span",{role:"status","aria-live":"polite","aria-atomic":"true",className:e.styles[e.staticDateFieldClassNames.srStatus],children:be}),a.jsx("input",{type:"hidden",name:D,value:i.toISODateString(q),disabled:s}),a.jsxs(Oe.HelperTextProvider,{ctxId:X,ctxDisabled:s,children:[f,g&&a.jsx(Me.HelperText,{id:x,appearance:"negative",children:_})]}),se(Y)]})});exports.DateField=Le;

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

@@ -1,198 +1,203 @@
-import { jsxs as N, jsx as r } from "react/jsx-runtime";
-import Ie from "clsx";
-import { forwardRef as Ne, useEffect as Me } from "react";
-import { s as a, b as we, c as l, a as M } from "../../../chunks/DateField.Segment.CwhRnhtq.js";
+import { jsxs as O, jsx as r } from "react/jsx-runtime";
+import Ne from "clsx";
+import { forwardRef as we, useEffect as Oe, useMemo as Ve, useCallback as Ce } from "react";
+import { s as a, b as Be, c as i, a as V } from "../../../chunks/DateField.Segment.CwhRnhtq.js";
 import { t as Re } from "../../../chunks/constants.Cruz2A1w.js";
-import { i as Oe } from "../../../chunks/helpers.CiQfGwdc.js";
-import { H as Ve } from "../../../chunks/form.context.BDYA2JQs.js";
-import { LabelProvider as Be } from "../../Form/contexts/label.context.es.js";
-import { HelperTextProvider as Ce } from "../../Form/contexts/helperText.context.es.js";
-import { useUniversalRef as Ee } from "../../Form/hooks/useUniversalRef.hook.es.js";
-import { useIsMounted as Pe } from "../../../utils/hooks/useIsMounted.es.js";
-import { DateFieldSegments as Te, PARTS_ORDER as w } from "./DateField.Segments.es.js";
-import { isMinMaxMisconfigured as qe, dateKeyOrNull as R, toISODateString as He } from "./DateField.utils.es.js";
-import { useDateFieldFocus as Ke } from "./useDateFieldFocus.es.js";
-import { useDateFieldForm as Le } from "./useDateFieldForm.es.js";
-import { useDateFieldKeyboard as $e } from "./useDateFieldKeyboard.es.js";
-import { useDateFieldSegments as je } from "./useDateFieldSegments.es.js";
-import { useDateFieldValidity as Ae } from "./useDateFieldValidity.es.js";
-import { useDateFieldValue as We } from "./useDateFieldValue.es.js";
-import { useInvalidState as _e } from "./useInvalidState.es.js";
-const fa = Ne(
+import { i as Pe } from "../../../chunks/helpers.CiQfGwdc.js";
+import { H as Ee } from "../../../chunks/form.context.BDYA2JQs.js";
+import { LabelProvider as Le } from "../../Form/contexts/label.context.es.js";
+import { HelperTextProvider as Te } from "../../Form/contexts/helperText.context.es.js";
+import { useUniversalRef as qe } from "../../Form/hooks/useUniversalRef.hook.es.js";
+import { useIsMounted as He } from "../../../utils/hooks/useIsMounted.es.js";
+import { DateFieldSegments as Ke } from "./DateField.Segments.es.js";
+import { isMinMaxMisconfigured as $e, dateKeyOrNull as C, getDateParts as je, getSegmentOrder as Ue, toISODateString as We } from "./DateField.utils.es.js";
+import { useDateFieldFocus as ke } from "./useDateFieldFocus.es.js";
+import { useDateFieldForm as Ae } from "./useDateFieldForm.es.js";
+import { useDateFieldKeyboard as _e } from "./useDateFieldKeyboard.es.js";
+import { useDateFieldSegments as ze } from "./useDateFieldSegments.es.js";
+import { useDateFieldValidity as Ge } from "./useDateFieldValidity.es.js";
+import { useDateFieldValue as Je } from "./useDateFieldValue.es.js";
+import { useInvalidState as Qe } from "./useInvalidState.es.js";
+const ha = we(
   function({
-    value: O,
-    defaultValue: V,
-    onChange: B,
-    minDate: t,
+    value: B,
+    defaultValue: R,
+    onChange: P,
+    minDate: l,
     maxDate: o,
-    getClampAnnouncement: C,
-    label: u = null,
-    helperText: m = null,
-    error: c,
-    hideRequiredMarker: E = !1,
-    validationRules: P,
-    width: T,
-    theme: f,
-    fluid: q = !1,
-    disabled: H = !1,
-    readOnly: K = !1,
-    required: L = !1,
-    name: p,
-    id: $,
-    className: j,
+    getClampAnnouncement: E,
+    locale: L,
+    label: c = null,
+    helperText: f = null,
+    error: p,
+    hideRequiredMarker: T = !1,
+    validationRules: q,
+    width: H,
+    theme: b,
+    fluid: K = !1,
+    disabled: $ = !1,
+    readOnly: j = !1,
+    required: U = !1,
+    name: g,
+    id: W,
+    className: k,
     style: A,
-    "aria-label": W,
-    "aria-describedby": _,
-    "aria-labelledby": U,
-    ...k
-  }, z) {
+    "aria-label": _,
+    "aria-describedby": z,
+    "aria-labelledby": G,
+    ...J
+  }, Q) {
     const {
       disabled: e,
       readOnly: d,
-      required: b,
-      invalid: G,
-      errorMessageProvided: g,
-      defaultValue: J,
-      errorId: v,
-      helperTextId: Q,
-      validationErrorsId: X,
-      labelId: F,
-      ariaDescribedBy: Y,
-      ariaLabelledBy: Z,
-      showErrors: ee
-    } = Le({
-      name: p,
-      disabled: H,
-      readOnly: K,
-      required: L,
-      defaultValue: V,
-      error: c,
-      hasHelperText: !!m,
-      hasLabel: !!u,
-      validationRules: P,
-      ariaDescribedBy: _,
-      ariaLabelledBy: U
+      required: v,
+      invalid: X,
+      errorMessageProvided: F,
+      defaultValue: Y,
+      errorId: D,
+      helperTextId: Z,
+      validationErrorsId: ee,
+      labelId: h,
+      ariaDescribedBy: ae,
+      ariaLabelledBy: re,
+      showErrors: se
+    } = Ae({
+      name: g,
+      disabled: $,
+      readOnly: j,
+      required: U,
+      defaultValue: R,
+      error: p,
+      hasHelperText: !!f,
+      hasLabel: !!c,
+      validationRules: q,
+      ariaDescribedBy: z,
+      ariaLabelledBy: G
     });
-    Me(() => {
-      process.env.NODE_ENV !== "production" && qe(t, o) && console.warn(
+    Oe(() => {
+      process.env.NODE_ENV !== "production" && $e(l, o) && console.warn(
         "DateField: `minDate` is after `maxDate` — no date satisfies both, so the blur clamp is disabled and values are left as typed."
       );
-    }, [R(t), R(o)]);
-    const { refFn: ae, ref: D } = Ee(z), { segmentRefs: re, registerSegmentRef: ie } = je(), {
-      segmentText: se,
-      segmentValues: h,
-      currentValue: x,
-      wasTouched: le,
-      appendDigit: te,
-      adjustSegment: oe,
-      clearSegment: de,
-      beginSegmentEdit: ne,
-      commitOnBlur: ue,
-      clampAnnouncement: me
-    } = We({
-      value: O,
-      defaultValue: J,
-      onChange: B,
-      minDate: t,
+    }, [C(l), C(o)]);
+    const { refFn: te, ref: S } = qe(Q), { segmentRefs: ie, registerSegmentRef: le } = ze(), n = je(L ?? "en-US"), x = Ve(() => Ue(n), [n]), {
+      segmentText: oe,
+      segmentValues: y,
+      currentValue: I,
+      wasTouched: de,
+      appendDigit: M,
+      adjustSegment: ne,
+      clearSegment: ue,
+      beginSegmentEdit: me,
+      commitOnBlur: ce,
+      clampAnnouncement: fe
+    } = Je({
+      value: B,
+      defaultValue: Y,
+      onChange: P,
+      minDate: l,
       maxDate: o,
-      getClampAnnouncement: C
+      getClampAnnouncement: E
     }), {
-      focusedSegment: y,
-      fieldTabIndex: ce,
-      handleSegmentFocus: S,
-      handleFieldFocus: fe,
-      handleFieldBlur: pe,
-      handleFieldMouseDown: be,
-      focusNext: I,
-      focusPrevious: ge
-    } = Ke({
+      focusedSegment: N,
+      fieldTabIndex: pe,
+      handleSegmentFocus: w,
+      handleFieldFocus: be,
+      handleFieldBlur: ge,
+      handleFieldMouseDown: ve,
+      focusNext: u,
+      focusPrevious: Fe
+    } = ke({
       disabled: e,
-      fieldRef: D,
-      segmentRefs: re,
-      partsOrder: w,
-      onSegmentFocusChange: ne,
-      onFieldBlur: ue
-    }), ve = $e({
+      fieldRef: S,
+      segmentRefs: ie,
+      partsOrder: x,
+      onSegmentFocusChange: me,
+      onFieldBlur: ce
+    }), De = _e({
       disabled: e,
       readOnly: d,
-      fieldRef: D,
-      focusNext: I,
-      focusPrevious: ge,
-      adjustSegment: oe,
-      clearSegment: de
-    }), { isInvalid: Fe } = Ae({
-      segments: h,
-      currentValue: x,
-      wasTouched: le,
-      isFocused: y !== null
-    }), De = (i, s) => {
-      const { advanced: Se } = te(i, s);
-      Se && I(i);
-    }, n = _e({
-      formInvalid: G,
-      valueInvalid: Fe
-    }), he = Pe() && Oe() ? "textbox" : "spinbutton", xe = (i) => {
+      fieldRef: S,
+      focusNext: u,
+      focusPrevious: Fe,
+      adjustSegment: ne,
+      clearSegment: ue
+    }), { isInvalid: he } = Ge({
+      segments: y,
+      currentValue: I,
+      wasTouched: de,
+      isFocused: N !== null
+    }), Se = Ce(
+      (s, t) => {
+        const { advanced: Me } = M(s, t);
+        Me && u(s);
+      },
+      [M, u]
+    ), m = Qe({
+      formInvalid: X,
+      valueInvalid: he
+    }), xe = He() && Pe() ? "textbox" : "spinbutton", ye = (s) => {
       if (e) return;
-      const s = i.target.closest("label");
-      !s || s.id !== F || (i.preventDefault(), S(w[0]));
-    }, ye = Ie(
-      a[we],
-      f && Re(f),
-      q && a[`${l}fluid`],
-      n && a[`${l}error`],
-      e && a[`${l}disabled`],
-      d && a[`${l}read-only`],
-      j
+      const t = s.target.closest("label");
+      !t || t.id !== h || (s.preventDefault(), w(x[0]));
+    }, Ie = Ne(
+      a[Be],
+      b && Re(b),
+      K && a[`${i}fluid`],
+      m && a[`${i}error`],
+      e && a[`${i}disabled`],
+      d && a[`${i}read-only`],
+      k
     );
-    return /* @__PURE__ */ N(
+    return /* @__PURE__ */ O(
       "div",
       {
-        className: ye,
-        style: { ...A, maxWidth: T },
-        onMouseDownCapture: xe,
+        className: Ie,
+        style: { ...A, maxWidth: H },
+        onMouseDownCapture: ye,
         children: [
           /* @__PURE__ */ r(
-            Be,
+            Le,
             {
-              ctxId: F,
+              ctxId: h,
               ctxDisabled: e,
-              ctxRequired: b && !E,
-              children: u
+              ctxRequired: v && !T,
+              children: c
             }
           ),
           /* @__PURE__ */ r(
             "div",
             {
-              ...k,
-              ref: ae,
-              id: $,
+              ...J,
+              ref: te,
+              id: W,
               role: "group",
-              "aria-label": W,
-              "aria-labelledby": Z,
+              "aria-label": _,
+              "aria-labelledby": re,
               "aria-disabled": e || void 0,
-              "aria-required": b || void 0,
-              "aria-invalid": n || void 0,
-              "aria-describedby": Y,
-              "aria-errormessage": g ? v : void 0,
-              tabIndex: ce,
-              className: a[M.field],
-              onMouseDown: be,
-              onFocus: fe,
+              "aria-required": v || void 0,
+              "aria-invalid": m || void 0,
+              "aria-describedby": ae,
+              "aria-errormessage": F ? D : void 0,
+              tabIndex: pe,
+              className: a[V.field],
+              onMouseDown: ve,
+              onFocus: be,
               children: /* @__PURE__ */ r(
-                Te,
+                Ke,
                 {
-                  segmentText: se,
-                  segmentValues: h,
-                  focusedSegment: y,
+                  parts: n,
+                  segmentText: oe,
+                  segmentValues: y,
+                  focusedSegment: N,
                   disabled: e,
                   readOnly: d,
-                  invalid: n,
-                  role: he,
-                  onSegmentFocus: S,
-                  onSegmentBlur: pe,
-                  onSegmentInput: De,
-                  onSegmentKeyDown: ve,
-                  registerSegmentRef: ie
+                  invalid: m,
+                  role: xe,
+                  onSegmentFocus: w,
+                  onSegmentBlur: ge,
+                  onSegmentInput: Se,
+                  onSegmentKeyDown: De,
+                  registerSegmentRef: le
                 }
               )
             }
@@ -203,29 +208,29 @@ const fa = Ne(
               role: "status",
               "aria-live": "polite",
               "aria-atomic": "true",
-              className: a[M.srStatus],
-              children: me
+              className: a[V.srStatus],
+              children: fe
             }
           ),
           /* @__PURE__ */ r(
             "input",
             {
               type: "hidden",
-              name: p,
-              value: He(x),
+              name: g,
+              value: We(I),
               disabled: e
             }
           ),
-          /* @__PURE__ */ N(Ce, { ctxId: Q, ctxDisabled: e, children: [
-            m,
-            g && /* @__PURE__ */ r(Ve, { id: v, appearance: "negative", children: c })
+          /* @__PURE__ */ O(Te, { ctxId: Z, ctxDisabled: e, children: [
+            f,
+            F && /* @__PURE__ */ r(Ee, { id: D, appearance: "negative", children: p })
           ] }),
-          ee(X)
+          se(ee)
         ]
       }
     );
   }
 );
 export {
-  fa as DateField
+  ha as DateField
 };

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

@@ -26,7 +26,7 @@ export interface AppendDigitResult {
     /** 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. */
+/** Shape mirrors `Intl.DateTimeFormatPart`; `getDateParts` derives this directly from `formatToParts()`. */
 export type DateFieldPart = {
     type: SegmentType | 'literal';
     value: string;
@@ -106,6 +106,13 @@ export interface DateFieldProps extends DateFieldInputAttributes {
      * message announced politely to screen readers. Omit → 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
+     */
+    locale?: string;
 }
 /**
  * Internal props for the segment subcomponent. Not part of the public API.

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

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

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

@@ -116,8 +116,23 @@ export declare const isMinMaxMisconfigured: (minDate?: Nullable<Date>, maxDate?:
  */
 export declare const clampDateToRange: (value: Date, minDate?: Nullable<Date>, maxDate?: Nullable<Date>) => Date;
 export declare const toISODateString: (value: Nullable<Date>) => string;
+/** Type guard: a literal separator (`/`, `.`, `年`, …) rather than a segment. */
+export declare const isLiteralPart: (part: DateFieldPart) => part is DateFieldPart & {
+    type: "literal";
+};
 /** 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
+ * back to en-US for any locale Intl can't resolve to the three date segments —
+ * en-US being the ECMAScript-guaranteed baseline (Intl's own ultimate fallback).
+ * Resolved lazily on first use, so a broken Intl (which can't render the field
+ * anyway — `getMonthName` needs it too) surfaces at render, catchable by an
+ * error boundary, instead of crashing the bundle at import.
+ */
+export declare const getDateParts: (locale: string) => ReadonlyArray<DateFieldPart>;
+/** @internal — test-only. Clears the per-locale parts cache for Intl isolation. */
+export declare const __clearDatePartsCache: () => void;
 /** 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

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

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

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

@@ -4,7 +4,7 @@ export interface UseDateFieldFocusArgs {
     disabled: boolean;
     fieldRef: RefObject<HTMLDivElement>;
     segmentRefs: MutableRefObject<Map<SegmentType, HTMLSpanElement>>;
-    /** Ordered segment types (literals stripped). En-US hardcoded; DF-8 derives from locale. */
+    /** Ordered segment types (literals stripped), derived from the active locale. */
     partsOrder: ReadonlyArray<SegmentType>;
     /** Called when focus enters a segment (any path). */
     onSegmentFocusChange?: (segment: SegmentType) => void;

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

@@ -28,9 +28,9 @@ export interface UseDateFieldKeyboardArgs {
     readOnly: boolean;
     /** Field root ref, used to detect RTL direction. */
     fieldRef: RefObject<HTMLDivElement>;
-    /** Move focus to the next segment in `PARTS_ORDER`. */
+    /** Move focus to the next segment in the locale-derived `partsOrder`. */
     focusNext: (segment: SegmentType) => void;
-    /** Move focus to the previous segment in `PARTS_ORDER`. */
+    /** 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.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viasat/beam-react",
-  "version": "2.53.0",
+  "version": "2.54.0",
   "description": "React component library for the Beam design system",
   "license": "MIT",
   "author": "Viasat",
@@ -60,12 +60,12 @@
     "access": "public"
   },
   "dependencies": {
-    "@viasat/beam-fonts": "2.53.0",
-    "@viasat/beam-shared": "2.53.0",
-    "@viasat/beam-styles": "2.53.0",
-    "@viasat/beam-tokens": "2.53.0",
-    "@viasat/beam-icons": "2.53.0",
-    "@viasat/beam-react-claude-plugin": "2.53.0",
+    "@viasat/beam-fonts": "2.54.0",
+    "@viasat/beam-shared": "2.54.0",
+    "@viasat/beam-styles": "2.54.0",
+    "@viasat/beam-tokens": "2.54.0",
+    "@viasat/beam-icons": "2.54.0",
+    "@viasat/beam-react-claude-plugin": "2.54.0",
     "clsx": "^1.2.1",
     "@floating-ui/react": "^0.26.18",
     "@stepperize/react": "^5.1.5",