@elliemae/ds-form-date-time-picker 3.50.1-next.9 → 3.51.0-beta.2

package/dist/cjs/exported-related/theming.js

@@ -33,7 +33,7 @@ __export(theming_exports, {
 });
 module.exports = __toCommonJS(theming_exports);
 var React = __toESM(require("react"));
-const DSControlledDateTimePickerName = "DSControlledDateTimePicker";
+const DSControlledDateTimePickerName = "DSControlleddatetimepicker";
 const DSControlledDateTimePickerSlots = {
   CONTAINER: "root",
   INPUT: "field-input",

package/dist/cjs/exported-related/theming.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/exported-related/theming.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export const DSControlledDateTimePickerName = 'DSControlledDateTimePicker';\n\nexport const DSControlledDateTimePickerSlots = {\n  CONTAINER: 'root',\n  INPUT: 'field-input',\n  DATE_INPUTS: {\n    MONTH: 'ds-controlled-date-time-picker-month-input',\n    DAY: 'ds-controlled-date-time-picker-day-input',\n    YEAR: 'ds-controlled-date-time-picker-year-input',\n  },\n  TIME_INPUTS: {\n    HOUR: 'ds-controlled-date-time-picker-hour-input',\n    MINUTE: 'ds-controlled-date-time-picker-minute-input',\n    MERIDIEM: 'ds-controlled-date-time-picker-meridiem-input',\n  },\n  PICKER_ICONS: {\n    CALENDAR: 'calendar-trigger-icon',\n    TIMEWHEEL: 'timewheel-trigger-icon',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-trigger-icon',\n  },\n  CALENDAR: {\n    DAY_BUTTON: 'calendar-day',\n    HEADER_LABEL: 'calendar-header-label',\n    HEADER_BUTTON: 'calendar-header-buttons',\n    HEADER_WEEKLY_DAY_LIST: 'calendar-header-weekly-day-list',\n  },\n  TIMEWHEEL: {\n    TIME_BUTTON: 'timewheel-time-button',\n    TIME_CHANGE_BUTTON: 'timewheel-time-change-button',\n    HEADER_LABEL: 'timewheel-header-label',\n  },\n  CONTEXTUAL_MENU: {\n    CALENDAR: 'calendar-context-content-wrapper',\n    TIMEWHEEL: 'timewheel-context-content-wrapper',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-content-wrapper',\n  },\n  FOOTERS: {\n    CALENDAR: 'calendar-context-footer',\n    TIMEWHEEL: 'timewheel-context-footer',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-footer',\n  },\n  CONTROLLER_COMPONENT: {\n    CALENDAR: 'calendar-controller-wrapper',\n    TIMEWHEEL: 'timewheel-controller-wrapper',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-controller-wrapper',\n  },\n  CLEAR_BUTTON: 'clear-btn',\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["export const DSControlledDateTimePickerName = 'DSControlleddatetimepicker';\n\nexport const DSControlledDateTimePickerSlots = {\n  CONTAINER: 'root',\n  INPUT: 'field-input',\n  DATE_INPUTS: {\n    MONTH: 'ds-controlled-date-time-picker-month-input',\n    DAY: 'ds-controlled-date-time-picker-day-input',\n    YEAR: 'ds-controlled-date-time-picker-year-input',\n  },\n  TIME_INPUTS: {\n    HOUR: 'ds-controlled-date-time-picker-hour-input',\n    MINUTE: 'ds-controlled-date-time-picker-minute-input',\n    MERIDIEM: 'ds-controlled-date-time-picker-meridiem-input',\n  },\n  PICKER_ICONS: {\n    CALENDAR: 'calendar-trigger-icon',\n    TIMEWHEEL: 'timewheel-trigger-icon',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-trigger-icon',\n  },\n  CALENDAR: {\n    DAY_BUTTON: 'calendar-day',\n    HEADER_LABEL: 'calendar-header-label',\n    HEADER_BUTTON: 'calendar-header-buttons',\n    HEADER_WEEKLY_DAY_LIST: 'calendar-header-weekly-day-list',\n  },\n  TIMEWHEEL: {\n    TIME_BUTTON: 'timewheel-time-button',\n    TIME_CHANGE_BUTTON: 'timewheel-time-change-button',\n    HEADER_LABEL: 'timewheel-header-label',\n  },\n  CONTEXTUAL_MENU: {\n    CALENDAR: 'calendar-context-content-wrapper',\n    TIMEWHEEL: 'timewheel-context-content-wrapper',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-content-wrapper',\n  },\n  FOOTERS: {\n    CALENDAR: 'calendar-context-footer',\n    TIMEWHEEL: 'timewheel-context-footer',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-footer',\n  },\n  CONTROLLER_COMPONENT: {\n    CALENDAR: 'calendar-controller-wrapper',\n    TIMEWHEEL: 'timewheel-controller-wrapper',\n    CALENDAR_TIMEWHEEL: 'calendar-timewheel-controller-wrapper',\n  },\n  CLEAR_BUTTON: 'clear-btn',\n};\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,iCAAiC;AAEvC,MAAM,kCAAkC;AAAA,EAC7C,WAAW;AAAA,EACX,OAAO;AAAA,EACP,aAAa;AAAA,IACX,OAAO;AAAA,IACP,KAAK;AAAA,IACL,MAAM;AAAA,EACR;AAAA,EACA,aAAa;AAAA,IACX,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,UAAU;AAAA,EACZ;AAAA,EACA,cAAc;AAAA,IACZ,UAAU;AAAA,IACV,WAAW;AAAA,IACX,oBAAoB;AAAA,EACtB;AAAA,EACA,UAAU;AAAA,IACR,YAAY;AAAA,IACZ,cAAc;AAAA,IACd,eAAe;AAAA,IACf,wBAAwB;AAAA,EAC1B;AAAA,EACA,WAAW;AAAA,IACT,aAAa;AAAA,IACb,oBAAoB;AAAA,IACpB,cAAc;AAAA,EAChB;AAAA,EACA,iBAAiB;AAAA,IACf,UAAU;AAAA,IACV,WAAW;AAAA,IACX,oBAAoB;AAAA,EACtB;AAAA,EACA,SAAS;AAAA,IACP,UAAU;AAAA,IACV,WAAW;AAAA,IACX,oBAAoB;AAAA,EACtB;AAAA,EACA,sBAAsB;AAAA,IACpB,UAAU;AAAA,IACV,WAAW;AAAA,IACX,oBAAoB;AAAA,EACtB;AAAA,EACA,cAAc;AAChB;",
   "names": []
 }

package/dist/cjs/parts/DateInputs/DDInput.js

@@ -56,7 +56,8 @@ const DDInput = import_react.default.memo(
     placeholder,
     ariaCurrentValueForInputs,
     isFocused,
-    getProps
+    getProps,
+    readOnly
   }) => {
     const validateOnChange = (0, import_react.useCallback)(
       (e) => {
@@ -87,7 +88,8 @@ const DDInput = import_react.default.memo(
         disabled,
         "aria-disabled": disabled,
         "aria-invalid": hasError,
-        getOwnerProps: getProps
+        getOwnerProps: getProps,
+        readOnly
       }
     );
   }

package/dist/cjs/parts/DateInputs/DDInput.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/DateInputs/DDInput.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';\nimport { StyledDateInput } from '../Styleds.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { ControlledDateTimePickerContextT } from '../../config/useControlledDateTimePicker.js';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidDay = (day: string) => {\n  if (day === '') return false;\n  const numberOnly = regExpNumbers.test(day);\n  return day.length > 2 || day === '00' || !numberOnly || Number.parseInt(day, 10) > 31;\n};\n\ninterface DDInputsPropsT {\n  onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n  onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n  onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n  onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n  value: string;\n  disabled: boolean;\n  hasError: boolean;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n  contextRef: React.MutableRefObject<HTMLInputElement | null>;\n  tabIndex?: TypescriptHelpersT.WCAGTabIndex;\n  isFocused: boolean;\n  getProps: ControlledDateTimePickerContextT['getProps'];\n}\nexport const DDInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    hasError,\n    contextRef,\n    tabIndex,\n    placeholder,\n    ariaCurrentValueForInputs,\n    isFocused,\n    getProps,\n  }: DDInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (isInvalidDay(e?.currentTarget?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n    return (\n      <StyledDateInput\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        innerRef={(DomElem: HTMLInputElement) => {\n          (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n          if (isFocused) DomElem?.focus?.();\n        }}\n        tabIndex={tabIndex}\n        placeholder={placeholder}\n        aria-label={`day input field, ${ariaCurrentValueForInputs}`}\n        data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY}\n        disabled={disabled}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        getOwnerProps={getProps}\n      />\n    );\n  },\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwDjB;AAxDN,mBAAmC;AAEnC,gDAAmD;AACnD,qBAAgC;AAIhC,MAAM,gBAAgB;AACtB,MAAM,eAAe,CAAC,QAAgB;AACpC,MAAI,QAAQ,GAAI,QAAO;AACvB,QAAM,aAAa,cAAc,KAAK,GAAG;AACzC,SAAO,IAAI,SAAS,KAAK,QAAQ,QAAQ,CAAC,cAAc,OAAO,SAAS,KAAK,EAAE,IAAI;AACrF;AAiBO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,aAAa,GAAG,eAAe,KAAK,GAAG;AACzC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,CAAC,YAA8B;AACvC,UAAC,WAAwD,UAAU;AACnE,cAAI,UAAW,UAAS,QAAQ;AAAA,QAClC;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY,oBAAoB,yBAAyB;AAAA,QACzD,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,eAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;",
+  "sourcesContent": ["import React, { useCallback } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';\nimport { StyledDateInput } from '../Styleds.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { ControlledDateTimePickerContextT } from '../../config/useControlledDateTimePicker.js';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidDay = (day: string) => {\n  if (day === '') return false;\n  const numberOnly = regExpNumbers.test(day);\n  return day.length > 2 || day === '00' || !numberOnly || Number.parseInt(day, 10) > 31;\n};\n\ninterface DDInputsPropsT {\n  onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n  onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n  onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n  onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n  value: string;\n  disabled: boolean;\n  hasError: boolean;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n  contextRef: React.MutableRefObject<HTMLInputElement | null>;\n  tabIndex?: TypescriptHelpersT.WCAGTabIndex;\n  isFocused: boolean;\n  getProps: ControlledDateTimePickerContextT['getProps'];\n  readOnly: boolean;\n}\nexport const DDInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    hasError,\n    contextRef,\n    tabIndex,\n    placeholder,\n    ariaCurrentValueForInputs,\n    isFocused,\n    getProps,\n    readOnly,\n  }: DDInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (isInvalidDay(e?.currentTarget?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n    return (\n      <StyledDateInput\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        innerRef={(DomElem: HTMLInputElement) => {\n          (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n          if (isFocused) DomElem?.focus?.();\n        }}\n        tabIndex={tabIndex}\n        placeholder={placeholder}\n        aria-label={`day input field, ${ariaCurrentValueForInputs}`}\n        data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY}\n        disabled={disabled}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        getOwnerProps={getProps}\n        readOnly={readOnly}\n      />\n    );\n  },\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0DjB;AA1DN,mBAAmC;AAEnC,gDAAmD;AACnD,qBAAgC;AAIhC,MAAM,gBAAgB;AACtB,MAAM,eAAe,CAAC,QAAgB;AACpC,MAAI,QAAQ,GAAI,QAAO;AACvB,QAAM,aAAa,cAAc,KAAK,GAAG;AACzC,SAAO,IAAI,SAAS,KAAK,QAAQ,QAAQ,CAAC,cAAc,OAAO,SAAS,KAAK,EAAE,IAAI;AACrF;AAkBO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,aAAa,GAAG,eAAe,KAAK,GAAG;AACzC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,CAAC,YAA8B;AACvC,UAAC,WAAwD,UAAU;AACnE,cAAI,UAAW,UAAS,QAAQ;AAAA,QAClC;AAAA,QACA;AAAA,QACA;AAAA,QACA,cAAY,oBAAoB,yBAAyB;AAAA,QACzD,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,eAAe;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;",
   "names": ["React"]
 }

package/dist/cjs/parts/DateInputs/DateInputs.js

@@ -71,7 +71,7 @@ const DateInputs = () => {
     latestInteractionRegion,
     currFocusDescriber,
     getProps,
-    props: { tabIndex, hasError }
+    props: { tabIndex, hasError, readOnly }
   } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     import_ds_grid.Grid,
@@ -101,7 +101,8 @@ const DateInputs = () => {
             disabled,
             hasError,
             isFocused: latestInteractionRegion === "date-inputs" && currFocusDescriber === "month-input",
-            getProps
+            getProps,
+            readOnly
           }
         ) }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledSeparator, { alignItems: "center", children: "/" }),
@@ -120,7 +121,8 @@ const DateInputs = () => {
             disabled,
             hasError,
             isFocused: latestInteractionRegion === "date-inputs" && currFocusDescriber === "day-input",
-            getProps
+            getProps,
+            readOnly
           }
         ) }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledSeparator, { alignItems: "center", children: "/" }),
@@ -139,7 +141,8 @@ const DateInputs = () => {
             disabled,
             hasError,
             isFocused: latestInteractionRegion === "date-inputs" && currFocusDescriber === "year-input",
-            getProps
+            getProps,
+            readOnly
           }
         ) })
       ]

package/dist/cjs/parts/DateInputs/DateInputs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/DateInputs/DateInputs.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';\nimport { MMInput } from './MMInput.js';\nimport { DDInput } from './DDInput.js';\nimport { YYYYInput } from './YYYYInput.js';\nimport { StyledFocusWithIn, StyledSeparator } from '../Styleds.js';\nimport { useDateInputs } from './useDateInputs.js';\nimport { fixedValues } from '../config.js';\n\nexport const DateInputs = (): JSX.Element => {\n  const {\n    month,\n    day,\n    year,\n    autoFocusMonthInput,\n    innerRefMonthInput,\n    onMonthChange,\n    onDayChange,\n    onYearChange,\n    onMonthBlur,\n    onDayBlur,\n    onYearBlur,\n    onMonthFocus,\n    onDayFocus,\n    onYearFocus,\n    onMonthKeyDown,\n    onDayKeyDown,\n    onYearKeyDown,\n    disabled,\n  } = useDateInputs();\n  // we do this here so MMInput,DDInput,YYYYInput can be pure component memoized via React.memo\n  const {\n    monthInputRef,\n    dayInputRef,\n    yearInputRef,\n    ariaCurrentValueForInputs,\n    latestInteractionRegion,\n    currFocusDescriber,\n    getProps,\n    props: { tabIndex, hasError },\n  } = useContext(ControlledDateTimePickerContext);\n\n  return (\n    <Grid\n      cols={[\n        fixedValues.smallInputWidth,\n        fixedValues.separatorWidth,\n        fixedValues.smallInputWidth,\n        fixedValues.separatorWidth,\n        fixedValues.largeInputWidth,\n      ]}\n    >\n      <StyledFocusWithIn>\n        <MMInput\n          onChange={onMonthChange}\n          onBlur={onMonthBlur}\n          onFocus={onMonthFocus}\n          onKeyDown={onMonthKeyDown}\n          value={month}\n          contextRef={monthInputRef}\n          innerRef={innerRefMonthInput}\n          tabIndex={tabIndex}\n          autoFocusMonthInput={autoFocusMonthInput}\n          placeholder=\"MM\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n          hasError={hasError}\n          isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'month-input'}\n          getProps={getProps}\n        />\n      </StyledFocusWithIn>\n      <StyledSeparator alignItems=\"center\">/</StyledSeparator>\n      <StyledFocusWithIn>\n        <DDInput\n          onChange={onDayChange}\n          onBlur={onDayBlur}\n          onFocus={onDayFocus}\n          onKeyDown={onDayKeyDown}\n          value={day}\n          contextRef={dayInputRef}\n          tabIndex={tabIndex}\n          placeholder=\"DD\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n          hasError={hasError}\n          isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'day-input'}\n          getProps={getProps}\n        />\n      </StyledFocusWithIn>\n      <StyledSeparator alignItems=\"center\">/</StyledSeparator>\n      <StyledFocusWithIn>\n        <YYYYInput\n          onChange={onYearChange}\n          onBlur={onYearBlur}\n          onFocus={onYearFocus}\n          onKeyDown={onYearKeyDown}\n          value={year}\n          contextRef={yearInputRef}\n          tabIndex={tabIndex}\n          placeholder=\"YYYY\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n          hasError={hasError}\n          isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'year-input'}\n          getProps={getProps}\n        />\n      </StyledFocusWithIn>\n    </Grid>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4CnB;AA5CJ,mBAAkC;AAClC,qBAAqB;AACrB,yCAAgD;AAChD,qBAAwB;AACxB,qBAAwB;AACxB,uBAA0B;AAC1B,qBAAmD;AACnD,2BAA8B;AAC9B,oBAA4B;AAErB,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,oCAAc;AAElB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,SAAS;AAAA,EAC9B,QAAI,yBAAW,kEAA+B;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,MACd;AAAA,MAEA;AAAA,oDAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA,YAC/E;AAAA;AAAA,QACF,GACF;AAAA,QACA,4CAAC,kCAAgB,YAAW,UAAS,eAAC;AAAA,QACtC,4CAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA,YAC/E;AAAA;AAAA,QACF,GACF;AAAA,QACA,4CAAC,kCAAgB,YAAW,UAAS,eAAC;AAAA,QACtC,4CAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA,YAC/E;AAAA;AAAA,QACF,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
+  "sourcesContent": ["import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';\nimport { MMInput } from './MMInput.js';\nimport { DDInput } from './DDInput.js';\nimport { YYYYInput } from './YYYYInput.js';\nimport { StyledFocusWithIn, StyledSeparator } from '../Styleds.js';\nimport { useDateInputs } from './useDateInputs.js';\nimport { fixedValues } from '../config.js';\n\nexport const DateInputs = (): JSX.Element => {\n  const {\n    month,\n    day,\n    year,\n    autoFocusMonthInput,\n    innerRefMonthInput,\n    onMonthChange,\n    onDayChange,\n    onYearChange,\n    onMonthBlur,\n    onDayBlur,\n    onYearBlur,\n    onMonthFocus,\n    onDayFocus,\n    onYearFocus,\n    onMonthKeyDown,\n    onDayKeyDown,\n    onYearKeyDown,\n    disabled,\n  } = useDateInputs();\n  // we do this here so MMInput,DDInput,YYYYInput can be pure component memoized via React.memo\n  const {\n    monthInputRef,\n    dayInputRef,\n    yearInputRef,\n    ariaCurrentValueForInputs,\n    latestInteractionRegion,\n    currFocusDescriber,\n    getProps,\n    props: { tabIndex, hasError, readOnly },\n  } = useContext(ControlledDateTimePickerContext);\n\n  return (\n    <Grid\n      cols={[\n        fixedValues.smallInputWidth,\n        fixedValues.separatorWidth,\n        fixedValues.smallInputWidth,\n        fixedValues.separatorWidth,\n        fixedValues.largeInputWidth,\n      ]}\n    >\n      <StyledFocusWithIn>\n        <MMInput\n          onChange={onMonthChange}\n          onBlur={onMonthBlur}\n          onFocus={onMonthFocus}\n          onKeyDown={onMonthKeyDown}\n          value={month}\n          contextRef={monthInputRef}\n          innerRef={innerRefMonthInput}\n          tabIndex={tabIndex}\n          autoFocusMonthInput={autoFocusMonthInput}\n          placeholder=\"MM\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n          hasError={hasError}\n          isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'month-input'}\n          getProps={getProps}\n          readOnly={readOnly}\n        />\n      </StyledFocusWithIn>\n      <StyledSeparator alignItems=\"center\">/</StyledSeparator>\n      <StyledFocusWithIn>\n        <DDInput\n          onChange={onDayChange}\n          onBlur={onDayBlur}\n          onFocus={onDayFocus}\n          onKeyDown={onDayKeyDown}\n          value={day}\n          contextRef={dayInputRef}\n          tabIndex={tabIndex}\n          placeholder=\"DD\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n          hasError={hasError}\n          isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'day-input'}\n          getProps={getProps}\n          readOnly={readOnly}\n        />\n      </StyledFocusWithIn>\n      <StyledSeparator alignItems=\"center\">/</StyledSeparator>\n      <StyledFocusWithIn>\n        <YYYYInput\n          onChange={onYearChange}\n          onBlur={onYearBlur}\n          onFocus={onYearFocus}\n          onKeyDown={onYearKeyDown}\n          value={year}\n          contextRef={yearInputRef}\n          tabIndex={tabIndex}\n          placeholder=\"YYYY\"\n          ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n          disabled={disabled}\n          hasError={hasError}\n          isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'year-input'}\n          getProps={getProps}\n          readOnly={readOnly}\n        />\n      </StyledFocusWithIn>\n    </Grid>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4CnB;AA5CJ,mBAAkC;AAClC,qBAAqB;AACrB,yCAAgD;AAChD,qBAAwB;AACxB,qBAAwB;AACxB,uBAA0B;AAC1B,qBAAmD;AACnD,2BAA8B;AAC9B,oBAA4B;AAErB,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,oCAAc;AAElB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO,EAAE,UAAU,UAAU,SAAS;AAAA,EACxC,QAAI,yBAAW,kEAA+B;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,MACd;AAAA,MAEA;AAAA,oDAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA,YAC/E;AAAA,YACA;AAAA;AAAA,QACF,GACF;AAAA,QACA,4CAAC,kCAAgB,YAAW,UAAS,eAAC;AAAA,QACtC,4CAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA,YAC/E;AAAA,YACA;AAAA;AAAA,QACF,GACF;AAAA,QACA,4CAAC,kCAAgB,YAAW,UAAS,eAAC;AAAA,QACtC,4CAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA,YAC/E;AAAA,YACA;AAAA;AAAA,QACF,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/cjs/parts/DateInputs/MMInput.js

@@ -59,7 +59,8 @@ const MMInput = import_react.default.memo(
     autoFocusMonthInput,
     ariaCurrentValueForInputs,
     isFocused,
-    getProps
+    getProps,
+    readOnly
   }) => {
     const validateOnChange = (0, import_react.useCallback)(
       (e) => {
@@ -101,7 +102,8 @@ const MMInput = import_react.default.memo(
         disabled,
         "aria-disabled": disabled,
         "aria-invalid": hasError,
-        getOwnerProps: getProps
+        getOwnerProps: getProps,
+        readOnly
       }
     );
   }

package/dist/cjs/parts/DateInputs/MMInput.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/DateInputs/MMInput.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport { setMultipleRefs } from '@elliemae/ds-system';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';\nimport { StyledMonthInput } from '../Styleds.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { ControlledDateTimePickerContextT } from '../../config/useControlledDateTimePicker.js';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidMonth = (month: string) => {\n  if (month === '') return false;\n  const numberOnly = regExpNumbers.test(month);\n  return month.length > 2 || month === '00' || !numberOnly || Number.parseInt(month, 10) > 12;\n};\ninterface MMInputsPropsT {\n  onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n  onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n  onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n  onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n  autoFocusMonthInput: boolean;\n  value: string;\n  disabled: boolean;\n  hasError: boolean;\n  contextRef: React.MutableRefObject<HTMLInputElement | null>;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n  isFocused: boolean;\n  innerRef?:\n    | React.MutableRefObject<HTMLInputElement | HTMLButtonElement | null>\n    | ((ref: HTMLInputElement | HTMLButtonElement | null) => void);\n  tabIndex?: TypescriptHelpersT.WCAGTabIndex;\n  getProps: ControlledDateTimePickerContextT['getProps'];\n}\nexport const MMInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    hasError,\n    placeholder,\n    contextRef,\n    innerRef,\n    tabIndex,\n    autoFocusMonthInput,\n    ariaCurrentValueForInputs,\n    isFocused,\n    getProps,\n  }: MMInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (isInvalidMonth(e?.target?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n\n    const handleRef = useCallback(\n      (DomElem: HTMLInputElement) => {\n        (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n        if (isFocused) DomElem?.focus?.();\n      },\n      [contextRef, isFocused],\n    );\n\n    const currentRef = useMemo(() => {\n      if (innerRef) {\n        return setMultipleRefs([handleRef, innerRef]);\n      }\n      return handleRef;\n    }, [handleRef, innerRef]);\n\n    return (\n      <StyledMonthInput\n        autoFocus={autoFocusMonthInput}\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        innerRef={currentRef}\n        tabIndex={tabIndex}\n        placeholder={placeholder}\n        aria-label={`month input field, ${ariaCurrentValueForInputs}`}\n        data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.MONTH}\n        disabled={disabled}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        getOwnerProps={getProps}\n      />\n    );\n  },\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8EjB;AA9EN,mBAA4C;AAC5C,uBAAgC;AAEhC,gDAAmD;AACnD,qBAAiC;AAIjC,MAAM,gBAAgB;AACtB,MAAM,iBAAiB,CAAC,UAAkB;AACxC,MAAI,UAAU,GAAI,QAAO;AACzB,QAAM,aAAa,cAAc,KAAK,KAAK;AAC3C,SAAO,MAAM,SAAS,KAAK,UAAU,QAAQ,CAAC,cAAc,OAAO,SAAS,OAAO,EAAE,IAAI;AAC3F;AAoBO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,eAAe,GAAG,QAAQ,KAAK,GAAG;AACpC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AAEA,UAAM,gBAAY;AAAA,MAChB,CAAC,YAA8B;AAC7B,QAAC,WAAwD,UAAU;AACnE,YAAI,UAAW,UAAS,QAAQ;AAAA,MAClC;AAAA,MACA,CAAC,YAAY,SAAS;AAAA,IACxB;AAEA,UAAM,iBAAa,sBAAQ,MAAM;AAC/B,UAAI,UAAU;AACZ,mBAAO,kCAAgB,CAAC,WAAW,QAAQ,CAAC;AAAA,MAC9C;AACA,aAAO;AAAA,IACT,GAAG,CAAC,WAAW,QAAQ,CAAC;AAExB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,QACX,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA,cAAY,sBAAsB,yBAAyB;AAAA,QAC3D,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,eAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;",
+  "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport { setMultipleRefs } from '@elliemae/ds-system';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';\nimport { StyledMonthInput } from '../Styleds.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { ControlledDateTimePickerContextT } from '../../config/useControlledDateTimePicker.js';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidMonth = (month: string) => {\n  if (month === '') return false;\n  const numberOnly = regExpNumbers.test(month);\n  return month.length > 2 || month === '00' || !numberOnly || Number.parseInt(month, 10) > 12;\n};\ninterface MMInputsPropsT {\n  onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n  onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n  onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n  onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n  autoFocusMonthInput: boolean;\n  value: string;\n  disabled: boolean;\n  hasError: boolean;\n  contextRef: React.MutableRefObject<HTMLInputElement | null>;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n  isFocused: boolean;\n  innerRef?:\n    | React.MutableRefObject<HTMLInputElement | HTMLButtonElement | null>\n    | ((ref: HTMLInputElement | HTMLButtonElement | null) => void);\n  tabIndex?: TypescriptHelpersT.WCAGTabIndex;\n  getProps: ControlledDateTimePickerContextT['getProps'];\n  readOnly: boolean;\n}\nexport const MMInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    hasError,\n    placeholder,\n    contextRef,\n    innerRef,\n    tabIndex,\n    autoFocusMonthInput,\n    ariaCurrentValueForInputs,\n    isFocused,\n    getProps,\n    readOnly,\n  }: MMInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (isInvalidMonth(e?.target?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n\n    const handleRef = useCallback(\n      (DomElem: HTMLInputElement) => {\n        (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n        if (isFocused) DomElem?.focus?.();\n      },\n      [contextRef, isFocused],\n    );\n\n    const currentRef = useMemo(() => {\n      if (innerRef) {\n        return setMultipleRefs([handleRef, innerRef]);\n      }\n      return handleRef;\n    }, [handleRef, innerRef]);\n\n    return (\n      <StyledMonthInput\n        autoFocus={autoFocusMonthInput}\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        innerRef={currentRef}\n        tabIndex={tabIndex}\n        placeholder={placeholder}\n        aria-label={`month input field, ${ariaCurrentValueForInputs}`}\n        data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.MONTH}\n        disabled={disabled}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        getOwnerProps={getProps}\n        readOnly={readOnly}\n      />\n    );\n  },\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgFjB;AAhFN,mBAA4C;AAC5C,uBAAgC;AAEhC,gDAAmD;AACnD,qBAAiC;AAIjC,MAAM,gBAAgB;AACtB,MAAM,iBAAiB,CAAC,UAAkB;AACxC,MAAI,UAAU,GAAI,QAAO;AACzB,QAAM,aAAa,cAAc,KAAK,KAAK;AAC3C,SAAO,MAAM,SAAS,KAAK,UAAU,QAAQ,CAAC,cAAc,OAAO,SAAS,OAAO,EAAE,IAAI;AAC3F;AAqBO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,eAAe,GAAG,QAAQ,KAAK,GAAG;AACpC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AAEA,UAAM,gBAAY;AAAA,MAChB,CAAC,YAA8B;AAC7B,QAAC,WAAwD,UAAU;AACnE,YAAI,UAAW,UAAS,QAAQ;AAAA,MAClC;AAAA,MACA,CAAC,YAAY,SAAS;AAAA,IACxB;AAEA,UAAM,iBAAa,sBAAQ,MAAM;AAC/B,UAAI,UAAU;AACZ,mBAAO,kCAAgB,CAAC,WAAW,QAAQ,CAAC;AAAA,MAC9C;AACA,aAAO;AAAA,IACT,GAAG,CAAC,WAAW,QAAQ,CAAC;AAExB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,QACX,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA,cAAY,sBAAsB,yBAAyB;AAAA,QAC3D,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,eAAe;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;",
   "names": ["React"]
 }

package/dist/cjs/parts/DateInputs/YYYYInput.js

@@ -56,7 +56,8 @@ const YYYYInput = import_react.default.memo(
     tabIndex,
     ariaCurrentValueForInputs,
     isFocused,
-    getProps
+    getProps,
+    readOnly
   }) => {
     const validateOnChange = (0, import_react.useCallback)(
       (e) => {
@@ -87,7 +88,8 @@ const YYYYInput = import_react.default.memo(
         disabled,
         "aria-disabled": disabled,
         "aria-invalid": hasError,
-        getOwnerProps: getProps
+        getOwnerProps: getProps,
+        readOnly
       }
     );
   }

package/dist/cjs/parts/DateInputs/YYYYInput.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/DateInputs/YYYYInput.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { StyledYearInput } from '../Styleds.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { ControlledDateTimePickerContextT } from '../../config/useControlledDateTimePicker.js';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidYear = (year: string) => {\n  if (year === '') return false;\n  const numberOnly = regExpNumbers.test(year);\n  return year.length > 4 || !numberOnly || Number.parseInt(year, 10) > 9999;\n};\n\ninterface YYYYInputsPropsT {\n  onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n  onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n  onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n  onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n  value: string;\n  disabled: boolean;\n  hasError: boolean;\n  contextRef: React.MutableRefObject<HTMLInputElement | null>;\n  tabIndex?: TypescriptHelpersT.WCAGTabIndex;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n  isFocused: boolean;\n  getProps: ControlledDateTimePickerContextT['getProps'];\n}\nexport const YYYYInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    hasError,\n    placeholder,\n    contextRef,\n    tabIndex,\n    ariaCurrentValueForInputs,\n    isFocused,\n    getProps,\n  }: YYYYInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (isInvalidYear(e?.currentTarget?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n    return (\n      <StyledYearInput\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        innerRef={(DomElem: HTMLInputElement) => {\n          (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n          if (isFocused) DomElem?.focus?.();\n        }}\n        tabIndex={tabIndex}\n        data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR}\n        placeholder={placeholder}\n        aria-label={`year input field, ${ariaCurrentValueForInputs}`}\n        disabled={disabled}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        getOwnerProps={getProps}\n      />\n    );\n  },\n);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuDjB;AAvDN,mBAAmC;AAEnC,qBAAgC;AAGhC,gDAAmD;AACnD,MAAM,gBAAgB;AACtB,MAAM,gBAAgB,CAAC,SAAiB;AACtC,MAAI,SAAS,GAAI,QAAO;AACxB,QAAM,aAAa,cAAc,KAAK,IAAI;AAC1C,SAAO,KAAK,SAAS,KAAK,CAAC,cAAc,OAAO,SAAS,MAAM,EAAE,IAAI;AACvE;AAiBO,MAAM,YAAY,aAAAA,QAAM;AAAA,EAC7B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAqC;AACnC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,cAAc,GAAG,eAAe,KAAK,GAAG;AAC1C,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,CAAC,YAA8B;AACvC,UAAC,WAAwD,UAAU;AACnE,cAAI,UAAW,UAAS,QAAQ;AAAA,QAClC;AAAA,QACA;AAAA,QACA,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,cAAY,qBAAqB,yBAAyB;AAAA,QAC1D;AAAA,QACA,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,eAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;",
+  "sourcesContent": ["import React, { useCallback } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { StyledYearInput } from '../Styleds.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { ControlledDateTimePickerContextT } from '../../config/useControlledDateTimePicker.js';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid.js';\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidYear = (year: string) => {\n  if (year === '') return false;\n  const numberOnly = regExpNumbers.test(year);\n  return year.length > 4 || !numberOnly || Number.parseInt(year, 10) > 9999;\n};\n\ninterface YYYYInputsPropsT {\n  onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n  onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n  onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n  onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n  value: string;\n  disabled: boolean;\n  hasError: boolean;\n  contextRef: React.MutableRefObject<HTMLInputElement | null>;\n  tabIndex?: TypescriptHelpersT.WCAGTabIndex;\n  placeholder: string;\n  ariaCurrentValueForInputs: string;\n  isFocused: boolean;\n  getProps: ControlledDateTimePickerContextT['getProps'];\n  readOnly: boolean;\n}\nexport const YYYYInput = React.memo(\n  ({\n    onChange,\n    onBlur,\n    onFocus,\n    onKeyDown,\n    value,\n    disabled,\n    hasError,\n    placeholder,\n    contextRef,\n    tabIndex,\n    ariaCurrentValueForInputs,\n    isFocused,\n    getProps,\n    readOnly,\n  }: YYYYInputsPropsT): JSX.Element => {\n    const validateOnChange = useCallback(\n      (e: React.ChangeEvent<HTMLInputElement>) => {\n        if (isInvalidYear(e?.currentTarget?.value)) {\n          e.preventDefault();\n          return;\n        }\n        onChange(e);\n      },\n      [onChange],\n    );\n    return (\n      <StyledYearInput\n        onChange={validateOnChange}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n        value={value}\n        innerRef={(DomElem: HTMLInputElement) => {\n          (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n          if (isFocused) DomElem?.focus?.();\n        }}\n        tabIndex={tabIndex}\n        data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR}\n        placeholder={placeholder}\n        aria-label={`year input field, ${ariaCurrentValueForInputs}`}\n        disabled={disabled}\n        aria-disabled={disabled}\n        aria-invalid={hasError}\n        getOwnerProps={getProps}\n        readOnly={readOnly}\n      />\n    );\n  },\n);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyDjB;AAzDN,mBAAmC;AAEnC,qBAAgC;AAGhC,gDAAmD;AACnD,MAAM,gBAAgB;AACtB,MAAM,gBAAgB,CAAC,SAAiB;AACtC,MAAI,SAAS,GAAI,QAAO;AACxB,QAAM,aAAa,cAAc,KAAK,IAAI;AAC1C,SAAO,KAAK,SAAS,KAAK,CAAC,cAAc,OAAO,SAAS,MAAM,EAAE,IAAI;AACvE;AAkBO,MAAM,YAAY,aAAAA,QAAM;AAAA,EAC7B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAqC;AACnC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,cAAc,GAAG,eAAe,KAAK,GAAG;AAC1C,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,UAAU,CAAC,YAA8B;AACvC,UAAC,WAAwD,UAAU;AACnE,cAAI,UAAW,UAAS,QAAQ;AAAA,QAClC;AAAA,QACA;AAAA,QACA,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,cAAY,qBAAqB,yBAAyB;AAAA,QAC1D;AAAA,QACA,iBAAe;AAAA,QACf,gBAAc;AAAA,QACd,eAAe;AAAA,QACf;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;",
   "names": ["React"]
 }

package/dist/cjs/parts/DateInputs/useDateInputs.js

@@ -39,7 +39,7 @@ var import_dateHelpers = require("../../utils/dateHelpers.js");
 var import_constants = require("../../utils/constants.js");
 const useDateInputs = () => {
   const {
-    props: { disabled },
+    props: { disabled, readOnly },
     appOnMonthChange,
     appOnDayChange,
     appOnYearChange,
@@ -102,6 +102,7 @@ const useDateInputs = () => {
   );
   const onMonthKeyDown = (0, import_react.useCallback)(
     (e) => {
+      if (readOnly) return;
       const { key, ctrlKey, metaKey } = e;
       const monthStringConvertedToInteger = Number.parseInt(month, 10);
       if (["Home", "End", "ArrowUp", "ArrowDown", "-", "/", "\\"].includes(key)) e.preventDefault();
@@ -124,7 +125,7 @@ const useDateInputs = () => {
       }
       if ((ctrlKey || metaKey) && key === ";") trackFocusLastSegment();
     },
-    [month, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, trackFocusDayInput, handleChangeMonth]
+    [month, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, trackFocusDayInput, handleChangeMonth, readOnly]
   );
   const onMonthBlur = (0, import_react.useCallback)(
     (e) => {
@@ -168,6 +169,7 @@ const useDateInputs = () => {
   );
   const onDayKeyDown = (0, import_react.useCallback)(
     (e) => {
+      if (readOnly) return;
       const { key, ctrlKey, metaKey, target, currentTarget } = e;
       const dayStringConvertedToInteger = Number.parseInt(day, 10);
       if (["Home", "End", "ArrowUp", "ArrowDown", "-", "/", "\\"].includes(key)) e.preventDefault();
@@ -201,7 +203,8 @@ const useDateInputs = () => {
       trackFocusLastSegment,
       handleChangeDay,
       trackFocusYearInput,
-      trackFocusMonthInput
+      trackFocusMonthInput,
+      readOnly
     ]
   );
   const onDayBlur = (0, import_react.useCallback)(
@@ -260,6 +263,7 @@ const useDateInputs = () => {
   );
   const onYearKeyDown = (0, import_react.useCallback)(
     (e) => {
+      if (readOnly) return;
       const { key, ctrlKey, metaKey, target, currentTarget } = e;
       const yearStringConvertedToInteger = Number.parseInt(year, 10);
       const yearInteger = Number.isNaN(yearStringConvertedToInteger) ? 0 : yearStringConvertedToInteger;
@@ -306,7 +310,8 @@ const useDateInputs = () => {
       onEndKeyDown,
       trackFocusLastSegment,
       trackFocusDayInput,
-      handleChangeYear
+      handleChangeYear,
+      readOnly
     ]
   );
   const onYearBlur = (0, import_react.useCallback)(

package/dist/cjs/parts/DateInputs/useDateInputs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/parts/DateInputs/useDateInputs.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport { useCallback, useMemo, useContext } from 'react';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';\nimport {\n  getFormattedDateString,\n  prependStringWithPlaceHolders,\n  fillStringWithPlaceHolders,\n} from '../../utils/stringHelpers.js';\nimport { getValidationDateStringMetaInfo } from '../../utils/dateHelpers.js';\nimport { defaultMetaInfo } from '../../utils/constants.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { DSControlledDateTimePickerT } from '../../react-desc-prop-types.js';\n\nexport const useDateInputs = (): DSControlledDateTimePickerInternalsT.UseDateInputsR => {\n  const {\n    props: { disabled },\n    appOnMonthChange,\n    appOnDayChange,\n    appOnYearChange,\n    getIsDisabledDay,\n    getIsOutOfRangeDay,\n    month,\n    day,\n    year,\n    hideTime,\n    handleChangeComposedDateString,\n    withClearBtn,\n    withAnyPicker,\n    withAnyRightController,\n    autoFocusMonthInput,\n    innerRefMonthInput,\n    trackFocusResetter,\n    trackFocusFirstSegment,\n    trackFocusLastSegment,\n    trackFocusDayInput,\n    trackFocusMonthInput,\n    trackFocusYearInput,\n    trackFocusHourInput,\n    trackFocusClearBtn,\n    trackFocusPicker,\n  } = useContext(ControlledDateTimePickerContext);\n\n  const onHomeKeyDown = useCallback(() => {\n    trackFocusFirstSegment();\n  }, [trackFocusFirstSegment]);\n  const onEndKeyDown = useCallback(() => {\n    trackFocusLastSegment();\n  }, [trackFocusLastSegment]);\n\n  const handleChangeMonth = useCallback(\n    (\n      newMonth: string,\n      e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent,\n      metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = defaultMetaInfo,\n    ) => {\n      const newDateString = getFormattedDateString({\n        month: newMonth,\n        day,\n        year,\n      });\n      const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n        ...metaInfo,\n        ...getValidationDateStringMetaInfo(newDateString, getIsOutOfRangeDay, getIsDisabledDay),\n        newDateString,\n      };\n      appOnMonthChange(newMonth, e, finalMetaInfo);\n      handleChangeComposedDateString(newDateString, finalMetaInfo);\n    },\n    [day, year, getIsOutOfRangeDay, getIsDisabledDay, appOnMonthChange, handleChangeComposedDateString],\n  );\n  const onMonthFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc = useCallback(() => {\n    trackFocusMonthInput();\n  }, [trackFocusMonthInput]);\n  const onMonthChange: DSControlledDateTimePickerInternalsT.OnChangeFunc = useCallback(\n    (e) => {\n      let newMonth = e?.target?.value;\n      // converts months 2~9 to 02~09\n      if (Number.parseInt(newMonth, 10) > 1) newMonth = prependStringWithPlaceHolders(newMonth, 2);\n      handleChangeMonth(newMonth, e);\n      // auto-advance functionality:\n      if (newMonth.length === 2) trackFocusDayInput();\n    },\n    [handleChangeMonth, trackFocusDayInput],\n  );\n  const onMonthKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown = useCallback(\n    (e) => {\n      const { key, ctrlKey, metaKey } = e;\n      const monthStringConvertedToInteger = Number.parseInt(month, 10);\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.preventDefault();\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        const monthInteger = Number.isNaN(monthStringConvertedToInteger) ? 0 : monthStringConvertedToInteger;\n        let newMonth;\n        if (key === 'ArrowUp') newMonth = monthInteger + 1 <= 12 ? monthInteger + 1 : monthInteger;\n        else newMonth = monthInteger - 1 > 0 ? monthInteger - 1 : 1;\n        newMonth = prependStringWithPlaceHolders(`${newMonth}`, 2);\n        handleChangeMonth(newMonth, e);\n      }\n      if (!Number.isNaN(monthStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\\\')) {\n        let newMonth = prependStringWithPlaceHolders(`${monthStringConvertedToInteger}`, 2);\n        // occam's razor: if month is 00, convert to 01 and move on\n        if (newMonth === '00') newMonth = '01';\n        handleChangeMonth(newMonth, e);\n        // auto-advance functionality:\n        trackFocusDayInput();\n      }\n\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();\n    },\n    [month, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, trackFocusDayInput, handleChangeMonth],\n  );\n  const onMonthBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc = useCallback(\n    (e) => {\n      const newMonth = e?.target?.value;\n      if (newMonth === '0') handleChangeMonth('01', e, { isAutomaticFillTrigger: true });\n      else if (newMonth.length > 0 && newMonth.length < 2)\n        handleChangeMonth(prependStringWithPlaceHolders(newMonth, 2), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeMonth],\n  );\n\n  const handleChangeDay = useCallback(\n    (\n      newDay: string,\n      e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent,\n      metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = defaultMetaInfo,\n    ) => {\n      const newDateString = getFormattedDateString({\n        month,\n        day: newDay,\n        year,\n      });\n      const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n        ...metaInfo,\n        ...getValidationDateStringMetaInfo(newDateString, getIsOutOfRangeDay, getIsDisabledDay),\n        newDateString,\n      };\n      appOnDayChange(newDay, e, finalMetaInfo);\n      handleChangeComposedDateString(newDateString, finalMetaInfo);\n    },\n    [month, year, getIsOutOfRangeDay, getIsDisabledDay, appOnDayChange, handleChangeComposedDateString],\n  );\n  const onDayFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc = useCallback(() => {\n    trackFocusDayInput();\n  }, [trackFocusDayInput]);\n  const onDayChange: DSControlledDateTimePickerInternalsT.OnChangeFunc = useCallback(\n    (e) => {\n      let newDay = e?.target?.value;\n      // converts days 4~9 to 04~09\n      if (Number.parseInt(newDay, 10) > 3) newDay = prependStringWithPlaceHolders(newDay, 2);\n      handleChangeDay(newDay, e);\n      // auto-advance functionality:\n      if (newDay.length === 2) trackFocusYearInput();\n    },\n    [handleChangeDay, trackFocusYearInput],\n  );\n  const onDayKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown = useCallback(\n    (e) => {\n      const { key, ctrlKey, metaKey, target, currentTarget } = e;\n      const dayStringConvertedToInteger = Number.parseInt(day, 10);\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.preventDefault();\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.stopPropagation();\n\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        const dayInteger = Number.isNaN(dayStringConvertedToInteger) ? 0 : dayStringConvertedToInteger;\n        let newDay;\n        if (key === 'ArrowUp') newDay = dayInteger + 1 <= 31 ? dayInteger + 1 : dayInteger;\n        else newDay = dayInteger - 1 > 0 ? dayInteger - 1 : 1;\n        newDay = prependStringWithPlaceHolders(`${newDay}`, 2);\n        handleChangeDay(newDay, e);\n      }\n      if (!Number.isNaN(dayStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\\\')) {\n        let newDay = prependStringWithPlaceHolders(`${dayStringConvertedToInteger}`, 2);\n        // occam's razor: if day is 00, convert to 01 and move on\n        if (newDay === '00') newDay = '01';\n        handleChangeDay(newDay, e);\n        // auto-advance functionality:\n        trackFocusYearInput();\n      }\n      // regressive backspace functionality\n      if (\n        key === 'Backspace' &&\n        target === currentTarget &&\n        (target as HTMLInputElement).selectionStart === 0 &&\n        (target as HTMLInputElement).selectionEnd === 0\n      ) {\n        e.preventDefault();\n        trackFocusMonthInput();\n      }\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();\n    },\n    [\n      day,\n      onHomeKeyDown,\n      onEndKeyDown,\n      trackFocusLastSegment,\n      handleChangeDay,\n      trackFocusYearInput,\n      trackFocusMonthInput,\n    ],\n  );\n  const onDayBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc = useCallback(\n    (e) => {\n      const newDay = e?.target?.value;\n      if (newDay === '0') handleChangeDay('01', e, { isAutomaticFillTrigger: true });\n      else if (newDay.length > 0 && newDay.length < 2)\n        handleChangeDay(prependStringWithPlaceHolders(newDay, 2), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeDay],\n  );\n\n  const handleChangeYear = useCallback(\n    (\n      newYear: string,\n      e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent,\n      metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = defaultMetaInfo,\n    ) => {\n      const newDateString = getFormattedDateString({\n        month,\n        day,\n        year: newYear,\n      });\n      const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n        ...metaInfo,\n        ...getValidationDateStringMetaInfo(newDateString, getIsOutOfRangeDay, getIsDisabledDay),\n        newDateString,\n      };\n      appOnYearChange(newYear, e, finalMetaInfo);\n      handleChangeComposedDateString(newDateString, finalMetaInfo);\n    },\n    [month, day, getIsOutOfRangeDay, getIsDisabledDay, appOnYearChange, handleChangeComposedDateString],\n  );\n  const onYearFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc = useCallback(() => {\n    trackFocusYearInput();\n  }, [trackFocusYearInput]);\n  const onYearChange: DSControlledDateTimePickerInternalsT.OnChangeFunc = useCallback(\n    (e) => {\n      const newYear = e?.target?.value;\n      handleChangeYear(newYear, e);\n      // auto-advance functionality:\n      if (newYear.length === 4) {\n        if (!hideTime) trackFocusHourInput();\n        else if (withAnyRightController) {\n          if (withClearBtn) trackFocusClearBtn();\n          else if (withAnyPicker) trackFocusPicker();\n          // pending approval from Seda, check which one should be focused first...\n        }\n      }\n    },\n    [\n      handleChangeYear,\n      hideTime,\n      trackFocusHourInput,\n      withAnyRightController,\n      withClearBtn,\n      trackFocusClearBtn,\n      withAnyPicker,\n      trackFocusPicker,\n    ],\n  );\n  const onYearKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown = useCallback(\n    (e) => {\n      const { key, ctrlKey, metaKey, target, currentTarget } = e;\n\n      /* ****** New year value calculator logic ********* */\n      const yearStringConvertedToInteger = Number.parseInt(year, 10);\n      const yearInteger = Number.isNaN(yearStringConvertedToInteger) ? 0 : yearStringConvertedToInteger;\n      let newYear = yearInteger !== 0 ? fillStringWithPlaceHolders(`${yearInteger}`, 4, '0') : '';\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        let newYearInteger;\n        if (key === 'ArrowUp') newYearInteger = yearInteger + 1 <= 9999 ? yearInteger + 1 : yearInteger;\n        else newYearInteger = yearInteger - 1 > 0 ? yearInteger - 1 : 1;\n        newYear = prependStringWithPlaceHolders(`${newYearInteger}`, 4);\n      }\n      const isAutomaticFillTrigger = newYear !== year && ['Tab', ' '].includes(key);\n      const metainfo = { isAutomaticFillTrigger };\n\n      /* ************* new year apply logic ************* */\n      // tab/spacebar applies auto-fill\n      // arrows up/down applies increment/decrement\n      if (key === 'ArrowUp' || key === 'ArrowDown' || isAutomaticFillTrigger) {\n        handleChangeYear(newYear, e, metainfo);\n      }\n\n      /* ************* focus tracking logic ************* */\n      let trackNextFocus = trackFocusResetter; // if nothing after, we reset internal focus tracker to avoid re-render unexpected focus shift\n      if (!hideTime) trackNextFocus = trackFocusHourInput;\n      else if (withClearBtn) trackNextFocus = trackFocusClearBtn;\n      else if (withAnyPicker) trackNextFocus = trackFocusPicker;\n\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', ' '].includes(key)) e.preventDefault();\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', ' '].includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n\n      /* ************** auto-advance logic ************** */\n      if (['Tab', ' '].includes(key)) {\n        // occam's razor: if user typed 0 and pressed space/tab, convert to 0000 and move on\n        if (year !== '' && yearInteger === 0) handleChangeYear('0000', e);\n        // auto-advance functionality:\n        if (key === ' ') trackNextFocus(); // tab must be handled by the browser\n      }\n      /* ********** regressive backspace logic ********** */\n      if (\n        key === 'Backspace' &&\n        target === currentTarget &&\n        (target as HTMLInputElement).selectionStart === 0 &&\n        (target as HTMLInputElement).selectionEnd === 0\n      ) {\n        e.preventDefault();\n        trackFocusDayInput();\n      }\n\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();\n    },\n    [\n      year,\n      trackFocusResetter,\n      hideTime,\n      trackFocusHourInput,\n      withClearBtn,\n      trackFocusClearBtn,\n      withAnyPicker,\n      trackFocusPicker,\n      onHomeKeyDown,\n      onEndKeyDown,\n      trackFocusLastSegment,\n      trackFocusDayInput,\n      handleChangeYear,\n    ],\n  );\n  const onYearBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc = useCallback(\n    (e) => {\n      const newYear = e?.target?.value;\n      if (newYear === '0') handleChangeYear('0000', e, { isAutomaticFillTrigger: true });\n      else if (newYear.length > 0 && newYear.length < 4)\n        handleChangeYear(fillStringWithPlaceHolders(newYear, 4, '0'), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeYear],\n  );\n\n  return useMemo(\n    () => ({\n      month,\n      day,\n      year,\n      autoFocusMonthInput,\n      innerRefMonthInput,\n      disabled,\n      onMonthFocus,\n      onMonthChange,\n      onDayFocus,\n      onDayChange,\n      onYearFocus,\n      onYearChange,\n      onMonthBlur,\n      onDayBlur,\n      onYearBlur,\n      onMonthKeyDown,\n      onDayKeyDown,\n      onYearKeyDown,\n    }),\n    [\n      month,\n      day,\n      year,\n      autoFocusMonthInput,\n      innerRefMonthInput,\n      disabled,\n      onMonthFocus,\n      onMonthChange,\n      onDayFocus,\n      onDayChange,\n      onYearFocus,\n      onYearChange,\n      onMonthBlur,\n      onDayBlur,\n      onYearBlur,\n      onMonthKeyDown,\n      onDayKeyDown,\n      onYearKeyDown,\n    ],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport { useCallback, useMemo, useContext } from 'react';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX.js';\nimport {\n  getFormattedDateString,\n  prependStringWithPlaceHolders,\n  fillStringWithPlaceHolders,\n} from '../../utils/stringHelpers.js';\nimport { getValidationDateStringMetaInfo } from '../../utils/dateHelpers.js';\nimport { defaultMetaInfo } from '../../utils/constants.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes.js';\nimport type { DSControlledDateTimePickerT } from '../../react-desc-prop-types.js';\n\nexport const useDateInputs = (): DSControlledDateTimePickerInternalsT.UseDateInputsR => {\n  const {\n    props: { disabled, readOnly },\n    appOnMonthChange,\n    appOnDayChange,\n    appOnYearChange,\n    getIsDisabledDay,\n    getIsOutOfRangeDay,\n    month,\n    day,\n    year,\n    hideTime,\n    handleChangeComposedDateString,\n    withClearBtn,\n    withAnyPicker,\n    withAnyRightController,\n    autoFocusMonthInput,\n    innerRefMonthInput,\n    trackFocusResetter,\n    trackFocusFirstSegment,\n    trackFocusLastSegment,\n    trackFocusDayInput,\n    trackFocusMonthInput,\n    trackFocusYearInput,\n    trackFocusHourInput,\n    trackFocusClearBtn,\n    trackFocusPicker,\n  } = useContext(ControlledDateTimePickerContext);\n\n  const onHomeKeyDown = useCallback(() => {\n    trackFocusFirstSegment();\n  }, [trackFocusFirstSegment]);\n  const onEndKeyDown = useCallback(() => {\n    trackFocusLastSegment();\n  }, [trackFocusLastSegment]);\n\n  const handleChangeMonth = useCallback(\n    (\n      newMonth: string,\n      e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent,\n      metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = defaultMetaInfo,\n    ) => {\n      const newDateString = getFormattedDateString({\n        month: newMonth,\n        day,\n        year,\n      });\n      const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n        ...metaInfo,\n        ...getValidationDateStringMetaInfo(newDateString, getIsOutOfRangeDay, getIsDisabledDay),\n        newDateString,\n      };\n      appOnMonthChange(newMonth, e, finalMetaInfo);\n      handleChangeComposedDateString(newDateString, finalMetaInfo);\n    },\n    [day, year, getIsOutOfRangeDay, getIsDisabledDay, appOnMonthChange, handleChangeComposedDateString],\n  );\n  const onMonthFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc = useCallback(() => {\n    trackFocusMonthInput();\n  }, [trackFocusMonthInput]);\n  const onMonthChange: DSControlledDateTimePickerInternalsT.OnChangeFunc = useCallback(\n    (e) => {\n      let newMonth = e?.target?.value;\n      // converts months 2~9 to 02~09\n      if (Number.parseInt(newMonth, 10) > 1) newMonth = prependStringWithPlaceHolders(newMonth, 2);\n      handleChangeMonth(newMonth, e);\n      // auto-advance functionality:\n      if (newMonth.length === 2) trackFocusDayInput();\n    },\n    [handleChangeMonth, trackFocusDayInput],\n  );\n  const onMonthKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown = useCallback(\n    (e) => {\n      if (readOnly) return;\n      const { key, ctrlKey, metaKey } = e;\n      const monthStringConvertedToInteger = Number.parseInt(month, 10);\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.preventDefault();\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        const monthInteger = Number.isNaN(monthStringConvertedToInteger) ? 0 : monthStringConvertedToInteger;\n        let newMonth;\n        if (key === 'ArrowUp') newMonth = monthInteger + 1 <= 12 ? monthInteger + 1 : monthInteger;\n        else newMonth = monthInteger - 1 > 0 ? monthInteger - 1 : 1;\n        newMonth = prependStringWithPlaceHolders(`${newMonth}`, 2);\n        handleChangeMonth(newMonth, e);\n      }\n      if (!Number.isNaN(monthStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\\\')) {\n        let newMonth = prependStringWithPlaceHolders(`${monthStringConvertedToInteger}`, 2);\n        // occam's razor: if month is 00, convert to 01 and move on\n        if (newMonth === '00') newMonth = '01';\n        handleChangeMonth(newMonth, e);\n        // auto-advance functionality:\n        trackFocusDayInput();\n      }\n\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();\n    },\n    [month, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, trackFocusDayInput, handleChangeMonth, readOnly],\n  );\n  const onMonthBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc = useCallback(\n    (e) => {\n      const newMonth = e?.target?.value;\n      if (newMonth === '0') handleChangeMonth('01', e, { isAutomaticFillTrigger: true });\n      else if (newMonth.length > 0 && newMonth.length < 2)\n        handleChangeMonth(prependStringWithPlaceHolders(newMonth, 2), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeMonth],\n  );\n\n  const handleChangeDay = useCallback(\n    (\n      newDay: string,\n      e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent,\n      metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = defaultMetaInfo,\n    ) => {\n      const newDateString = getFormattedDateString({\n        month,\n        day: newDay,\n        year,\n      });\n      const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n        ...metaInfo,\n        ...getValidationDateStringMetaInfo(newDateString, getIsOutOfRangeDay, getIsDisabledDay),\n        newDateString,\n      };\n      appOnDayChange(newDay, e, finalMetaInfo);\n      handleChangeComposedDateString(newDateString, finalMetaInfo);\n    },\n    [month, year, getIsOutOfRangeDay, getIsDisabledDay, appOnDayChange, handleChangeComposedDateString],\n  );\n  const onDayFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc = useCallback(() => {\n    trackFocusDayInput();\n  }, [trackFocusDayInput]);\n  const onDayChange: DSControlledDateTimePickerInternalsT.OnChangeFunc = useCallback(\n    (e) => {\n      let newDay = e?.target?.value;\n      // converts days 4~9 to 04~09\n      if (Number.parseInt(newDay, 10) > 3) newDay = prependStringWithPlaceHolders(newDay, 2);\n      handleChangeDay(newDay, e);\n      // auto-advance functionality:\n      if (newDay.length === 2) trackFocusYearInput();\n    },\n    [handleChangeDay, trackFocusYearInput],\n  );\n  const onDayKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown = useCallback(\n    (e) => {\n      if (readOnly) return;\n      const { key, ctrlKey, metaKey, target, currentTarget } = e;\n      const dayStringConvertedToInteger = Number.parseInt(day, 10);\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.preventDefault();\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\\\'].includes(key)) e.stopPropagation();\n\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        const dayInteger = Number.isNaN(dayStringConvertedToInteger) ? 0 : dayStringConvertedToInteger;\n        let newDay;\n        if (key === 'ArrowUp') newDay = dayInteger + 1 <= 31 ? dayInteger + 1 : dayInteger;\n        else newDay = dayInteger - 1 > 0 ? dayInteger - 1 : 1;\n        newDay = prependStringWithPlaceHolders(`${newDay}`, 2);\n        handleChangeDay(newDay, e);\n      }\n      if (!Number.isNaN(dayStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\\\')) {\n        let newDay = prependStringWithPlaceHolders(`${dayStringConvertedToInteger}`, 2);\n        // occam's razor: if day is 00, convert to 01 and move on\n        if (newDay === '00') newDay = '01';\n        handleChangeDay(newDay, e);\n        // auto-advance functionality:\n        trackFocusYearInput();\n      }\n      // regressive backspace functionality\n      if (\n        key === 'Backspace' &&\n        target === currentTarget &&\n        (target as HTMLInputElement).selectionStart === 0 &&\n        (target as HTMLInputElement).selectionEnd === 0\n      ) {\n        e.preventDefault();\n        trackFocusMonthInput();\n      }\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();\n    },\n    [\n      day,\n      onHomeKeyDown,\n      onEndKeyDown,\n      trackFocusLastSegment,\n      handleChangeDay,\n      trackFocusYearInput,\n      trackFocusMonthInput,\n      readOnly,\n    ],\n  );\n  const onDayBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc = useCallback(\n    (e) => {\n      const newDay = e?.target?.value;\n      if (newDay === '0') handleChangeDay('01', e, { isAutomaticFillTrigger: true });\n      else if (newDay.length > 0 && newDay.length < 2)\n        handleChangeDay(prependStringWithPlaceHolders(newDay, 2), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeDay],\n  );\n\n  const handleChangeYear = useCallback(\n    (\n      newYear: string,\n      e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent,\n      metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = defaultMetaInfo,\n    ) => {\n      const newDateString = getFormattedDateString({\n        month,\n        day,\n        year: newYear,\n      });\n      const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n        ...metaInfo,\n        ...getValidationDateStringMetaInfo(newDateString, getIsOutOfRangeDay, getIsDisabledDay),\n        newDateString,\n      };\n      appOnYearChange(newYear, e, finalMetaInfo);\n      handleChangeComposedDateString(newDateString, finalMetaInfo);\n    },\n    [month, day, getIsOutOfRangeDay, getIsDisabledDay, appOnYearChange, handleChangeComposedDateString],\n  );\n  const onYearFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc = useCallback(() => {\n    trackFocusYearInput();\n  }, [trackFocusYearInput]);\n  const onYearChange: DSControlledDateTimePickerInternalsT.OnChangeFunc = useCallback(\n    (e) => {\n      const newYear = e?.target?.value;\n      handleChangeYear(newYear, e);\n      // auto-advance functionality:\n      if (newYear.length === 4) {\n        if (!hideTime) trackFocusHourInput();\n        else if (withAnyRightController) {\n          if (withClearBtn) trackFocusClearBtn();\n          else if (withAnyPicker) trackFocusPicker();\n          // pending approval from Seda, check which one should be focused first...\n        }\n      }\n    },\n    [\n      handleChangeYear,\n      hideTime,\n      trackFocusHourInput,\n      withAnyRightController,\n      withClearBtn,\n      trackFocusClearBtn,\n      withAnyPicker,\n      trackFocusPicker,\n    ],\n  );\n  const onYearKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown = useCallback(\n    (e) => {\n      if (readOnly) return;\n      const { key, ctrlKey, metaKey, target, currentTarget } = e;\n\n      /* ****** New year value calculator logic ********* */\n      const yearStringConvertedToInteger = Number.parseInt(year, 10);\n      const yearInteger = Number.isNaN(yearStringConvertedToInteger) ? 0 : yearStringConvertedToInteger;\n      let newYear = yearInteger !== 0 ? fillStringWithPlaceHolders(`${yearInteger}`, 4, '0') : '';\n      if (key === 'ArrowUp' || key === 'ArrowDown') {\n        let newYearInteger;\n        if (key === 'ArrowUp') newYearInteger = yearInteger + 1 <= 9999 ? yearInteger + 1 : yearInteger;\n        else newYearInteger = yearInteger - 1 > 0 ? yearInteger - 1 : 1;\n        newYear = prependStringWithPlaceHolders(`${newYearInteger}`, 4);\n      }\n      const isAutomaticFillTrigger = newYear !== year && ['Tab', ' '].includes(key);\n      const metainfo = { isAutomaticFillTrigger };\n\n      /* ************* new year apply logic ************* */\n      // tab/spacebar applies auto-fill\n      // arrows up/down applies increment/decrement\n      if (key === 'ArrowUp' || key === 'ArrowDown' || isAutomaticFillTrigger) {\n        handleChangeYear(newYear, e, metainfo);\n      }\n\n      /* ************* focus tracking logic ************* */\n      let trackNextFocus = trackFocusResetter; // if nothing after, we reset internal focus tracker to avoid re-render unexpected focus shift\n      if (!hideTime) trackNextFocus = trackFocusHourInput;\n      else if (withClearBtn) trackNextFocus = trackFocusClearBtn;\n      else if (withAnyPicker) trackNextFocus = trackFocusPicker;\n\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', ' '].includes(key)) e.preventDefault();\n      if (['Home', 'End', 'ArrowUp', 'ArrowDown', ' '].includes(key)) e.stopPropagation();\n      if (key === 'Home') onHomeKeyDown();\n      if (key === 'End') onEndKeyDown();\n\n      /* ************** auto-advance logic ************** */\n      if (['Tab', ' '].includes(key)) {\n        // occam's razor: if user typed 0 and pressed space/tab, convert to 0000 and move on\n        if (year !== '' && yearInteger === 0) handleChangeYear('0000', e);\n        // auto-advance functionality:\n        if (key === ' ') trackNextFocus(); // tab must be handled by the browser\n      }\n      /* ********** regressive backspace logic ********** */\n      if (\n        key === 'Backspace' &&\n        target === currentTarget &&\n        (target as HTMLInputElement).selectionStart === 0 &&\n        (target as HTMLInputElement).selectionEnd === 0\n      ) {\n        e.preventDefault();\n        trackFocusDayInput();\n      }\n\n      // focus last fragment on fill with now\n      if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();\n    },\n    [\n      year,\n      trackFocusResetter,\n      hideTime,\n      trackFocusHourInput,\n      withClearBtn,\n      trackFocusClearBtn,\n      withAnyPicker,\n      trackFocusPicker,\n      onHomeKeyDown,\n      onEndKeyDown,\n      trackFocusLastSegment,\n      trackFocusDayInput,\n      handleChangeYear,\n      readOnly,\n    ],\n  );\n  const onYearBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc = useCallback(\n    (e) => {\n      const newYear = e?.target?.value;\n      if (newYear === '0') handleChangeYear('0000', e, { isAutomaticFillTrigger: true });\n      else if (newYear.length > 0 && newYear.length < 4)\n        handleChangeYear(fillStringWithPlaceHolders(newYear, 4, '0'), e, {\n          isAutomaticFillTrigger: true,\n        });\n    },\n    [handleChangeYear],\n  );\n\n  return useMemo(\n    () => ({\n      month,\n      day,\n      year,\n      autoFocusMonthInput,\n      innerRefMonthInput,\n      disabled,\n      onMonthFocus,\n      onMonthChange,\n      onDayFocus,\n      onDayChange,\n      onYearFocus,\n      onYearChange,\n      onMonthBlur,\n      onDayBlur,\n      onYearBlur,\n      onMonthKeyDown,\n      onDayKeyDown,\n      onYearKeyDown,\n    }),\n    [\n      month,\n      day,\n      year,\n      autoFocusMonthInput,\n      innerRefMonthInput,\n      disabled,\n      onMonthFocus,\n      onMonthChange,\n      onDayFocus,\n      onDayChange,\n      onYearFocus,\n      onYearChange,\n      onMonthBlur,\n      onDayBlur,\n      onYearBlur,\n      onMonthKeyDown,\n      onDayKeyDown,\n      onYearKeyDown,\n    ],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/parts/Pickers/Calendar/Day.js

@@ -49,7 +49,7 @@ const Day = ({ metaDay, colIndex, isInvisible }) => {
     handleChangeComposedDateString,
     dateStringFromProps,
     getProps,
-    props: { preventCloseOnSelection },
+    props: { preventCloseOnSelection, readOnly },
     getIsDisabledDay,
     getIsOutOfRangeDay,
     getIsStartRangeDay,
@@ -93,7 +93,7 @@ const Day = ({ metaDay, colIndex, isInvisible }) => {
   const handleOnDayClick = (0, import_react.useCallback)(
     (e) => {
       handleFocusMetaDayByDay(day);
-      if (!isDisabled && !isOutOfRange) {
+      if (!isDisabled && !isOutOfRange && !readOnly) {
         const newDateString = (0, import_dateHelpers.getDateStringFromDay)(day);
         const metaInfo = { ...import_constants.defaultMetaInfo, newDateString };
         const { month, day: dayNumber, year } = (0, import_dateHelpers.getDateValuesFromDate)(day);
@@ -120,7 +120,8 @@ const Day = ({ metaDay, colIndex, isInvisible }) => {
       preventCloseOnSelection,
       closeCalendar,
       read,
-      dayAriaLabel
+      dayAriaLabel,
+      readOnly
     ]
   );
   const handleInnerRef = (0, import_react.useCallback)(
@@ -174,7 +175,7 @@ const Day = ({ metaDay, colIndex, isInvisible }) => {
           import_Styleds.StyledDayBtn,
           {
             "aria-label": dayAriaLabel,
-            "aria-disabled": isOutOfRange || isDisabled,
+            "aria-disabled": isOutOfRange || isDisabled || readOnly,
             "aria-hidden": !!isInvisible,
             buttonType: "raw",
             size: "m",

package/dist/cjs/parts/Pickers/Calendar/Day.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/parts/Pickers/Calendar/Day.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useContext, useCallback, useMemo } from 'react';\nimport { useLiveRegion } from '@elliemae/ds-accessibility';\nimport {\n  getDateStringFromDay,\n  getDayFromDateString,\n  getDateValuesFromDate,\n  isSameDateMoment,\n  compareTwoDatesDayEquality,\n} from '../../../utils/dateHelpers.js';\nimport { defaultMetaInfo, weekDays } from '../../../utils/constants.js';\nimport { getAriaDayFromDateString } from '../../../utils/stringHelpers.js';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from './CalendarContext.js';\nimport { StyledDayBtn } from './Styleds.js';\nimport type { DSControlledDateTimePickerT } from '../../../react-desc-prop-types.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../../sharedTypes.js';\n\ninterface CalendarDayPropsT {\n  metaDay: DSControlledDateTimePickerInternalsT.MetaMonthDay;\n  colIndex?: number;\n  isInvisible?: boolean;\n}\nconst displayNone = { display: 'none' };\n\nexport const Day = ({ metaDay, colIndex, isInvisible }: CalendarDayPropsT): JSX.Element => {\n  const { day, isCurrMonthDay, isHidden, dayBtnRef, dayAsString } = metaDay;\n  const {\n    handleChangeComposedDateString,\n    dateStringFromProps,\n    getProps,\n    props: { preventCloseOnSelection },\n    getIsDisabledDay,\n    getIsOutOfRangeDay,\n    getIsStartRangeDay,\n    getIsDayInRange,\n    getIsEndRangeDay,\n    appOnMonthChange,\n    appOnDayChange,\n    appOnYearChange,\n    latestInteractionRegion,\n    isWithTimeWheelToo,\n    trackFocusCalendarMetafocusedDay,\n    fromDate,\n    toDate,\n  } = useContext(ControlledDateTimePickerContext);\n  const { read, LiveRegion } = useLiveRegion({});\n\n  const { focusedDay, handleDayOnKeyDown, handleFocusMetaDayByDay, closeCalendar } = useContext(CalendarContext);\n  const isFocusedMetaDay = focusedDay?.day ? compareTwoDatesDayEquality(metaDay?.day, focusedDay?.day) : false;\n  const isSelected = useMemo(() => {\n    const selectedDate = getDayFromDateString(dateStringFromProps);\n    return selectedDate ? isSameDateMoment(day, selectedDate) : false;\n  }, [dateStringFromProps, day]);\n  const isFocused = latestInteractionRegion === 'calendar-days' && isFocusedMetaDay;\n  const isDisabled = getIsDisabledDay(metaDay.dayAsString);\n  const isOutOfRange = getIsOutOfRangeDay(metaDay.dayAsString);\n  const isStartRangeDay = getIsStartRangeDay(metaDay.dayAsString);\n  const isEndRangeDay = getIsEndRangeDay(metaDay.dayAsString);\n  const isDayInRangeImproper = getIsDayInRange(metaDay.dayAsString);\n  const isDayInRange = !isStartRangeDay && !isEndRangeDay && isDayInRangeImproper;\n\n  const dayAriaLabel = useMemo(\n    () => `${getAriaDayFromDateString(dayAsString)}, ${weekDays[metaDay.day.getDay()]}`,\n    [dayAsString, metaDay],\n  );\n\n  const rangeSelectionAnnouncement = useMemo(() => {\n    if (fromDate && toDate) {\n      if (fromDate === toDate) return `Please select another day to complete range selection.`;\n      return `Range from ${fromDate} to ${toDate} selected.`;\n    }\n    if (fromDate && !toDate) return `Please select another day to complete range selection.`;\n    return '';\n  }, [fromDate, toDate]);\n\n  const handleOnDayClick = useCallback(\n    (e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent) => {\n      handleFocusMetaDayByDay(day);\n      if (!isDisabled && !isOutOfRange) {\n        const newDateString = getDateStringFromDay(day);\n        const metaInfo = { ...defaultMetaInfo, newDateString };\n        const { month, day: dayNumber, year } = getDateValuesFromDate(day);\n        appOnMonthChange(`${month + 1}`, e, metaInfo);\n        if (dayNumber) appOnDayChange(`${dayNumber}`, e, metaInfo);\n        appOnYearChange(`${year}`, e, metaInfo);\n        handleChangeComposedDateString(newDateString, metaInfo);\n        trackFocusCalendarMetafocusedDay();\n        if (!isWithTimeWheelToo && !preventCloseOnSelection) closeCalendar();\n        read(`${dayAriaLabel} selected.`, {});\n      }\n    },\n    [\n      handleFocusMetaDayByDay,\n      day,\n      isDisabled,\n      isOutOfRange,\n      appOnMonthChange,\n      appOnDayChange,\n      appOnYearChange,\n      handleChangeComposedDateString,\n      trackFocusCalendarMetafocusedDay,\n      isWithTimeWheelToo,\n      preventCloseOnSelection,\n      closeCalendar,\n      read,\n      dayAriaLabel,\n    ],\n  );\n\n  const handleInnerRef = useCallback(\n    (ButtonDomNode: HTMLButtonElement) => {\n      window.requestAnimationFrame(() => {\n        dayBtnRef.current = ButtonDomNode;\n        if (isFocused) ButtonDomNode?.focus?.();\n      });\n    },\n    [dayBtnRef, isFocused],\n  );\n\n  const handleOnDayFocus = useCallback(() => {\n    trackFocusCalendarMetafocusedDay();\n  }, [trackFocusCalendarMetafocusedDay]);\n\n  const dayClassModifiers = useMemo(\n    () =>\n      `dayWrapper ${isSelected ? 'selectedDay ' : ''}${isDisabled ? 'disabledDay ' : ''}${\n        isOutOfRange ? 'outOfRangeDay ' : ''\n      }${isFocused ? 'focusedDay ' : ''}${isStartRangeDay ? 'startRangeDay ' : ''}${\n        isDayInRangeImproper ? 'inRangeImproperDay ' : ''\n      }${isDayInRange ? 'inRangeDay ' : ''}${isEndRangeDay ? 'endRangeDay ' : ''}${\n        isCurrMonthDay ? '' : 'notCurrentMonth'\n      }`,\n    [\n      isSelected,\n      isDisabled,\n      isOutOfRange,\n      isFocused,\n      isStartRangeDay,\n      isDayInRangeImproper,\n      isDayInRange,\n      isEndRangeDay,\n      isCurrMonthDay,\n    ],\n  );\n\n  let dataTestid: (typeof ControlledDateTimePickerDatatestid)['CALENDAR'][keyof (typeof ControlledDateTimePickerDatatestid)['CALENDAR']] =\n    ControlledDateTimePickerDatatestid.CALENDAR.DAY;\n\n  if (isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_DAY;\n  if (isFocused) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.FOCUSED_DAY;\n  if (isFocused && isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_FOCUSED_DAY;\n  if (isStartRangeDay) {\n    dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.START_RANGE_DAY;\n    if (isFocused) read(`${dayAriaLabel} selected. ${rangeSelectionAnnouncement}`, {});\n  }\n  if (isEndRangeDay) {\n    dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.END_RANGE_DAY;\n    if (isFocused) read(`${dayAriaLabel} selected. ${rangeSelectionAnnouncement}`, {});\n  }\n  if (isDayInRange) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.IN_RANGE_DAY;\n\n  return (\n    <div\n      className={dayClassModifiers}\n      style={isHidden ? displayNone : undefined}\n      role=\"gridcell\"\n      {...(Number.isInteger(colIndex) && { 'aria-colindex': colIndex })}\n    >\n      <StyledDayBtn\n        aria-label={dayAriaLabel}\n        aria-disabled={isOutOfRange || isDisabled}\n        aria-hidden={!!isInvisible}\n        buttonType=\"raw\"\n        size=\"m\"\n        onClick={handleOnDayClick} // DSButton triggers this with \"spacebar\" and \"enter\" too...\n        onFocus={handleOnDayFocus}\n        onKeyDown={(e: React.KeyboardEvent<Element>) => {\n          handleDayOnKeyDown(e, metaDay);\n        }}\n        innerRef={handleInnerRef}\n        tabIndex={-1}\n        data-isfocused={isFocused}\n        data-testid={dataTestid}\n        type=\"button\"\n        getOwnerProps={getProps}\n      >\n        {`${day.getDate()}`}\n      </StyledDayBtn>\n      <LiveRegion />\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useContext, useCallback, useMemo } from 'react';\nimport { useLiveRegion } from '@elliemae/ds-accessibility';\nimport {\n  getDateStringFromDay,\n  getDayFromDateString,\n  getDateValuesFromDate,\n  isSameDateMoment,\n  compareTwoDatesDayEquality,\n} from '../../../utils/dateHelpers.js';\nimport { defaultMetaInfo, weekDays } from '../../../utils/constants.js';\nimport { getAriaDayFromDateString } from '../../../utils/stringHelpers.js';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from './CalendarContext.js';\nimport { StyledDayBtn } from './Styleds.js';\nimport type { DSControlledDateTimePickerT } from '../../../react-desc-prop-types.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../../sharedTypes.js';\n\ninterface CalendarDayPropsT {\n  metaDay: DSControlledDateTimePickerInternalsT.MetaMonthDay;\n  colIndex?: number;\n  isInvisible?: boolean;\n}\nconst displayNone = { display: 'none' };\n\nexport const Day = ({ metaDay, colIndex, isInvisible }: CalendarDayPropsT): JSX.Element => {\n  const { day, isCurrMonthDay, isHidden, dayBtnRef, dayAsString } = metaDay;\n  const {\n    handleChangeComposedDateString,\n    dateStringFromProps,\n    getProps,\n    props: { preventCloseOnSelection, readOnly },\n    getIsDisabledDay,\n    getIsOutOfRangeDay,\n    getIsStartRangeDay,\n    getIsDayInRange,\n    getIsEndRangeDay,\n    appOnMonthChange,\n    appOnDayChange,\n    appOnYearChange,\n    latestInteractionRegion,\n    isWithTimeWheelToo,\n    trackFocusCalendarMetafocusedDay,\n    fromDate,\n    toDate,\n  } = useContext(ControlledDateTimePickerContext);\n  const { read, LiveRegion } = useLiveRegion({});\n\n  const { focusedDay, handleDayOnKeyDown, handleFocusMetaDayByDay, closeCalendar } = useContext(CalendarContext);\n  const isFocusedMetaDay = focusedDay?.day ? compareTwoDatesDayEquality(metaDay?.day, focusedDay?.day) : false;\n  const isSelected = useMemo(() => {\n    const selectedDate = getDayFromDateString(dateStringFromProps);\n    return selectedDate ? isSameDateMoment(day, selectedDate) : false;\n  }, [dateStringFromProps, day]);\n  const isFocused = latestInteractionRegion === 'calendar-days' && isFocusedMetaDay;\n  const isDisabled = getIsDisabledDay(metaDay.dayAsString);\n  const isOutOfRange = getIsOutOfRangeDay(metaDay.dayAsString);\n  const isStartRangeDay = getIsStartRangeDay(metaDay.dayAsString);\n  const isEndRangeDay = getIsEndRangeDay(metaDay.dayAsString);\n  const isDayInRangeImproper = getIsDayInRange(metaDay.dayAsString);\n  const isDayInRange = !isStartRangeDay && !isEndRangeDay && isDayInRangeImproper;\n\n  const dayAriaLabel = useMemo(\n    () => `${getAriaDayFromDateString(dayAsString)}, ${weekDays[metaDay.day.getDay()]}`,\n    [dayAsString, metaDay],\n  );\n\n  const rangeSelectionAnnouncement = useMemo(() => {\n    if (fromDate && toDate) {\n      if (fromDate === toDate) return `Please select another day to complete range selection.`;\n      return `Range from ${fromDate} to ${toDate} selected.`;\n    }\n    if (fromDate && !toDate) return `Please select another day to complete range selection.`;\n    return '';\n  }, [fromDate, toDate]);\n\n  const handleOnDayClick = useCallback(\n    (e: DSControlledDateTimePickerT.OnInternalValuesChangeEvent) => {\n      handleFocusMetaDayByDay(day);\n      if (!isDisabled && !isOutOfRange && !readOnly) {\n        const newDateString = getDateStringFromDay(day);\n        const metaInfo = { ...defaultMetaInfo, newDateString };\n        const { month, day: dayNumber, year } = getDateValuesFromDate(day);\n        appOnMonthChange(`${month + 1}`, e, metaInfo);\n        if (dayNumber) appOnDayChange(`${dayNumber}`, e, metaInfo);\n        appOnYearChange(`${year}`, e, metaInfo);\n        handleChangeComposedDateString(newDateString, metaInfo);\n        trackFocusCalendarMetafocusedDay();\n        if (!isWithTimeWheelToo && !preventCloseOnSelection) closeCalendar();\n        read(`${dayAriaLabel} selected.`, {});\n      }\n    },\n    [\n      handleFocusMetaDayByDay,\n      day,\n      isDisabled,\n      isOutOfRange,\n      appOnMonthChange,\n      appOnDayChange,\n      appOnYearChange,\n      handleChangeComposedDateString,\n      trackFocusCalendarMetafocusedDay,\n      isWithTimeWheelToo,\n      preventCloseOnSelection,\n      closeCalendar,\n      read,\n      dayAriaLabel,\n      readOnly,\n    ],\n  );\n\n  const handleInnerRef = useCallback(\n    (ButtonDomNode: HTMLButtonElement) => {\n      window.requestAnimationFrame(() => {\n        dayBtnRef.current = ButtonDomNode;\n        if (isFocused) ButtonDomNode?.focus?.();\n      });\n    },\n    [dayBtnRef, isFocused],\n  );\n\n  const handleOnDayFocus = useCallback(() => {\n    trackFocusCalendarMetafocusedDay();\n  }, [trackFocusCalendarMetafocusedDay]);\n\n  const dayClassModifiers = useMemo(\n    () =>\n      `dayWrapper ${isSelected ? 'selectedDay ' : ''}${isDisabled ? 'disabledDay ' : ''}${\n        isOutOfRange ? 'outOfRangeDay ' : ''\n      }${isFocused ? 'focusedDay ' : ''}${isStartRangeDay ? 'startRangeDay ' : ''}${\n        isDayInRangeImproper ? 'inRangeImproperDay ' : ''\n      }${isDayInRange ? 'inRangeDay ' : ''}${isEndRangeDay ? 'endRangeDay ' : ''}${\n        isCurrMonthDay ? '' : 'notCurrentMonth'\n      }`,\n    [\n      isSelected,\n      isDisabled,\n      isOutOfRange,\n      isFocused,\n      isStartRangeDay,\n      isDayInRangeImproper,\n      isDayInRange,\n      isEndRangeDay,\n      isCurrMonthDay,\n    ],\n  );\n\n  let dataTestid: (typeof ControlledDateTimePickerDatatestid)['CALENDAR'][keyof (typeof ControlledDateTimePickerDatatestid)['CALENDAR']] =\n    ControlledDateTimePickerDatatestid.CALENDAR.DAY;\n\n  if (isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_DAY;\n  if (isFocused) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.FOCUSED_DAY;\n  if (isFocused && isSelected) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.SELECTED_FOCUSED_DAY;\n  if (isStartRangeDay) {\n    dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.START_RANGE_DAY;\n    if (isFocused) read(`${dayAriaLabel} selected. ${rangeSelectionAnnouncement}`, {});\n  }\n  if (isEndRangeDay) {\n    dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.END_RANGE_DAY;\n    if (isFocused) read(`${dayAriaLabel} selected. ${rangeSelectionAnnouncement}`, {});\n  }\n  if (isDayInRange) dataTestid = ControlledDateTimePickerDatatestid.CALENDAR.IN_RANGE_DAY;\n\n  return (\n    <div\n      className={dayClassModifiers}\n      style={isHidden ? displayNone : undefined}\n      role=\"gridcell\"\n      {...(Number.isInteger(colIndex) && { 'aria-colindex': colIndex })}\n    >\n      <StyledDayBtn\n        aria-label={dayAriaLabel}\n        aria-disabled={isOutOfRange || isDisabled || readOnly}\n        aria-hidden={!!isInvisible}\n        buttonType=\"raw\"\n        size=\"m\"\n        onClick={handleOnDayClick} // DSButton triggers this with \"spacebar\" and \"enter\" too...\n        onFocus={handleOnDayFocus}\n        onKeyDown={(e: React.KeyboardEvent<Element>) => {\n          handleDayOnKeyDown(e, metaDay);\n        }}\n        innerRef={handleInnerRef}\n        tabIndex={-1}\n        data-isfocused={isFocused}\n        data-testid={dataTestid}\n        type=\"button\"\n        getOwnerProps={getProps}\n      >\n        {`${day.getDate()}`}\n      </StyledDayBtn>\n      <LiveRegion />\n    </div>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/parts/Pickers/TimeWheel/HoursList.js

@@ -60,7 +60,8 @@ const HoursList = () => {
     hours,
     latestInteractionRegion,
     currFocusDescriber,
-    getProps
+    getProps,
+    props: { readOnly }
   } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
   const handleCurrYearRef = (0, import_react.useCallback)(
     (ButtonDomNode) => {
@@ -82,6 +83,7 @@ const HoursList = () => {
         onClick: handlePrevHour,
         innerRef: prevHourBtnRef,
         "data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_HOUR,
+        "aria-disabled": readOnly,
         getOwnerProps: getProps,
         tabIndex: -1,
         type: "button",
@@ -112,7 +114,7 @@ const HoursList = () => {
           "data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL[isCurrentListItem ? "CURRENT_HOUR" : "HOUR"],
           selected: hours.length === 2 && (0, import_numberHelpers.convertToPositiveNumberIfPossible)(hourString) === currHourNum,
           "aria-label": `${hourString} hours`,
-          "aria-disabled": isDisabled,
+          "aria-disabled": isDisabled || readOnly,
           buttonType: "raw",
           size: "m",
           onClick: (e) => handleTimeWheelBtnChangeHours(hourString, e),
@@ -134,6 +136,7 @@ const HoursList = () => {
         innerRef: nextHourBtnRef,
         tabIndex: -1,
         "data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_HOUR,
+        "aria-disabled": readOnly,
         getOwnerProps: getProps,
         type: "button",
         children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronSmallDown, { color: ["brand-primary", "700"] })