@elliemae/ds-form-date-time-picker 3.51.0-rc.9 → 3.51.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (27) hide show
  1. package/dist/cjs/ControlledDateTimePickerDefinitions.js +1 -1
  2. package/dist/cjs/ControlledDateTimePickerDefinitions.js.map +1 -1
  3. package/dist/cjs/index.js +3 -3
  4. package/dist/cjs/parts/Pickers/Calendar/CalendarIconTrigger.js +1 -3
  5. package/dist/cjs/parts/Pickers/Calendar/CalendarIconTrigger.js.map +2 -2
  6. package/dist/cjs/parts/Pickers/Calendar/usePopperTriggerLogic.js +2 -4
  7. package/dist/cjs/parts/Pickers/Calendar/usePopperTriggerLogic.js.map +2 -2
  8. package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +1 -3
  9. package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js.map +2 -2
  10. package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js +3 -4
  11. package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js.map +2 -2
  12. package/dist/cjs/parts/Pickers/TimeWheel/usePopperTriggerLogic.js +3 -11
  13. package/dist/cjs/parts/Pickers/TimeWheel/usePopperTriggerLogic.js.map +2 -2
  14. package/dist/esm/ControlledDateTimePickerDefinitions.js +1 -1
  15. package/dist/esm/ControlledDateTimePickerDefinitions.js.map +1 -1
  16. package/dist/esm/parts/Pickers/Calendar/CalendarIconTrigger.js +1 -3
  17. package/dist/esm/parts/Pickers/Calendar/CalendarIconTrigger.js.map +2 -2
  18. package/dist/esm/parts/Pickers/Calendar/usePopperTriggerLogic.js +2 -4
  19. package/dist/esm/parts/Pickers/Calendar/usePopperTriggerLogic.js.map +2 -2
  20. package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +1 -3
  21. package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js.map +2 -2
  22. package/dist/esm/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js +3 -4
  23. package/dist/esm/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js.map +2 -2
  24. package/dist/esm/parts/Pickers/TimeWheel/usePopperTriggerLogic.js +3 -11
  25. package/dist/esm/parts/Pickers/TimeWheel/usePopperTriggerLogic.js.map +2 -2
  26. package/dist/types/ControlledDateTimePickerDefinitions.d.ts +1 -1
  27. package/package.json +12 -12
package/dist/cjs/ControlledDateTimePickerDefinitions.js CHANGED
@@ -34,7 +34,7 @@ __export(ControlledDateTimePickerDefinitions_exports, {
34
34
  });
35
35
  module.exports = __toCommonJS(ControlledDateTimePickerDefinitions_exports);
36
36
  var React = __toESM(require("react"));
37
- const DSControlledDateTimePickerName = "DSControlledDateTimePicker";
37
+ const DSControlledDateTimePickerName = "DSControlleddatetimepicker";
38
38
  const DSControlledDateTimePickerSlotsFlatten = {
39
39
  CONTAINER: "root",
40
40
  INPUT: "field-input",
package/dist/cjs/ControlledDateTimePickerDefinitions.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/ControlledDateTimePickerDefinitions.ts", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["export const DSControlledDateTimePickerName = 'DSControlledDateTimePicker';\n\nexport const DSControlledDateTimePickerSlotsFlatten = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS_MONTH: 'time-picker-month-input',\n DATE_INPUTS_DAY: 'time-picker-day-input',\n DATE_INPUTS_YEAR: 'time-picker-year-input',\n TIME_INPUTS_HOUR: 'time-picker-hour-input',\n TIME_INPUTS_MINUTE: 'time-picker-minute-input',\n TIME_INPUTS_MERIDIEM: 'time-picker-meridiem-input',\n PICKER_ICONS_CALENDAR: 'calendar-trigger-icon',\n PICKER_ICONS_TIMEWHEEL: 'timewheel-trigger-icon',\n PICKER_ICONS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-trigger-icon',\n CALENDAR_DAY_BUTTON: 'calendar-day',\n CALENDAR_HEADER_LABEL: 'calendar-header-label',\n CALENDAR_HEADER_BUTTON: 'calendar-header-buttons',\n CALENDAR_HEADER_WEEKLY_DAY_LIST: 'calendar-header-weekly-day-list',\n TIMEWHEEL_TIME_BUTTON: 'timewheel-time-button',\n TIMEWHEEL_TIME_CHANGE_BUTTON: 'timewheel-time-change-button',\n TIMEWHEEL_HEADER_LABEL: 'timewheel-header-label',\n CONTEXTUAL_MENU_CALENDAR: 'calendar-context-content-wrapper',\n CONTEXTUAL_MENU_TIMEWHEEL: 'timewheel-context-content-wrapper',\n CONTEXTUAL_MENU_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-content-wrapper',\n FOOTERS_CALENDAR: 'calendar-context-footer',\n FOOTERS_TIMEWHEEL: 'timewheel-context-footer',\n FOOTERS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-footer',\n CONTROLLER_COMPONENT_CALENDAR: 'calendar-controller-wrapper',\n CONTROLLER_COMPONENT_TIMEWHEEL: 'timewheel-controller-wrapper',\n CONTROLLER_COMPONENT_CALENDAR_TIMEWHEEL: 'calendar-timewheel-controller-wrapper',\n CLEAR_BUTTON: 'clear-btn',\n} as const;\n\nexport const DSControlledDateTimePickerSlots = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS: {\n MONTH: 'time-picker-month-input',\n DAY: 'time-picker-day-input',\n YEAR: 'time-picker-year-input',\n },\n TIME_INPUTS: {\n HOUR: 'time-picker-hour-input',\n MINUTE: 'time-picker-minute-input',\n MERIDIEM: '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"],
4
+ "sourcesContent": ["export const DSControlledDateTimePickerName = 'DSControlleddatetimepicker';\n\nexport const DSControlledDateTimePickerSlotsFlatten = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS_MONTH: 'time-picker-month-input',\n DATE_INPUTS_DAY: 'time-picker-day-input',\n DATE_INPUTS_YEAR: 'time-picker-year-input',\n TIME_INPUTS_HOUR: 'time-picker-hour-input',\n TIME_INPUTS_MINUTE: 'time-picker-minute-input',\n TIME_INPUTS_MERIDIEM: 'time-picker-meridiem-input',\n PICKER_ICONS_CALENDAR: 'calendar-trigger-icon',\n PICKER_ICONS_TIMEWHEEL: 'timewheel-trigger-icon',\n PICKER_ICONS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-trigger-icon',\n CALENDAR_DAY_BUTTON: 'calendar-day',\n CALENDAR_HEADER_LABEL: 'calendar-header-label',\n CALENDAR_HEADER_BUTTON: 'calendar-header-buttons',\n CALENDAR_HEADER_WEEKLY_DAY_LIST: 'calendar-header-weekly-day-list',\n TIMEWHEEL_TIME_BUTTON: 'timewheel-time-button',\n TIMEWHEEL_TIME_CHANGE_BUTTON: 'timewheel-time-change-button',\n TIMEWHEEL_HEADER_LABEL: 'timewheel-header-label',\n CONTEXTUAL_MENU_CALENDAR: 'calendar-context-content-wrapper',\n CONTEXTUAL_MENU_TIMEWHEEL: 'timewheel-context-content-wrapper',\n CONTEXTUAL_MENU_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-content-wrapper',\n FOOTERS_CALENDAR: 'calendar-context-footer',\n FOOTERS_TIMEWHEEL: 'timewheel-context-footer',\n FOOTERS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-footer',\n CONTROLLER_COMPONENT_CALENDAR: 'calendar-controller-wrapper',\n CONTROLLER_COMPONENT_TIMEWHEEL: 'timewheel-controller-wrapper',\n CONTROLLER_COMPONENT_CALENDAR_TIMEWHEEL: 'calendar-timewheel-controller-wrapper',\n CLEAR_BUTTON: 'clear-btn',\n} as const;\n\nexport const DSControlledDateTimePickerSlots = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS: {\n MONTH: 'time-picker-month-input',\n DAY: 'time-picker-day-input',\n YEAR: 'time-picker-year-input',\n },\n TIME_INPUTS: {\n HOUR: 'time-picker-hour-input',\n MINUTE: 'time-picker-minute-input',\n MERIDIEM: '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"],
5
5
  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,iCAAiC;AAEvC,MAAM,yCAAyC;AAAA,EACpD,WAAW;AAAA,EACX,OAAO;AAAA,EACP,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,sBAAsB;AAAA,EACtB,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,iCAAiC;AAAA,EACjC,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,iCAAiC;AAAA,EACjC,uBAAuB;AAAA,EACvB,8BAA8B;AAAA,EAC9B,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,2BAA2B;AAAA,EAC3B,oCAAoC;AAAA,EACpC,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,4BAA4B;AAAA,EAC5B,+BAA+B;AAAA,EAC/B,gCAAgC;AAAA,EAChC,yCAAyC;AAAA,EACzC,cAAc;AAChB;AAEO,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;",
6
6
  "names": []
7
7
  }
package/dist/cjs/index.js CHANGED
@@ -26,8 +26,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
26
26
  mod
27
27
  ));
28
28
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var src_exports = {};
30
- __export(src_exports, {
29
+ var index_exports = {};
30
+ __export(index_exports, {
31
31
  CONTROLLED_DATE_TIME_PICKER_TYPES: () => import_ControlledDateTimePickerTypes.CONTROLLED_DATE_TIME_PICKER_TYPES,
32
32
  ControlledDateTimePickerDatatestid: () => import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid,
33
33
  ControlledDateTimePickerDatatestidFlattened: () => import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestidFlattened,
@@ -47,7 +47,7 @@ __export(src_exports, {
47
47
  isValidTimeString: () => import_stringHelpers2.isValidTimeString,
48
48
  prependStringWithPlaceHolders: () => import_stringHelpers.prependStringWithPlaceHolders
49
49
  });
50
- module.exports = __toCommonJS(src_exports);
50
+ module.exports = __toCommonJS(index_exports);
51
51
  var React = __toESM(require("react"));
52
52
  var import_ControlledDateTimePicker = require("./ControlledDateTimePicker.js");
53
53
  var import_ControlledDateTimePickerDatatestid = require("./ControlledDateTimePickerDatatestid.js");
package/dist/cjs/parts/Pickers/Calendar/CalendarIconTrigger.js CHANGED
@@ -43,7 +43,7 @@ var import_Styleds = require("./Styleds.js");
43
43
  const CalendarIconTrigger = () => {
44
44
  const { handleToggleCalendar, handleSetTriggerRef, handlePickerIconKeyDown } = (0, import_react.useContext)(import_CalendarContext.CalendarContext);
45
45
  const {
46
- props: { disabled, tabIndex, applyAriaDisabled, readOnly },
46
+ props: { disabled, tabIndex, applyAriaDisabled },
47
47
  getProps,
48
48
  ariaCurrentValueForInputs
49
49
  } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
@@ -60,7 +60,6 @@ const CalendarIconTrigger = () => {
60
60
  onKeyDown: handlePickerIconKeyDown,
61
61
  "data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR,
62
62
  disabled,
63
- "aria-disabled": applyAriaDisabled || readOnly ? "true" : void 0,
64
63
  applyAriaDisabled,
65
64
  type: "button",
66
65
  getOwnerProps: getProps,
@@ -75,7 +74,6 @@ const CalendarIconTrigger = () => {
75
74
  handlePickerIconKeyDown,
76
75
  disabled,
77
76
  applyAriaDisabled,
78
- readOnly,
79
77
  getProps
80
78
  ]
81
79
  );
package/dist/cjs/parts/Pickers/Calendar/CalendarIconTrigger.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Pickers/Calendar/CalendarIconTrigger.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from './CalendarContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\n// we memoize the Icon for maximum optimization\n// this is particularly usefull due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarIconTrigger = (): JSX.Element => {\n const { handleToggleCalendar, handleSetTriggerRef, handlePickerIconKeyDown } = useContext(CalendarContext);\n const {\n props: { disabled, tabIndex, applyAriaDisabled, readOnly },\n getProps,\n ariaCurrentValueForInputs,\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendar}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR}\n disabled={disabled}\n aria-disabled={applyAriaDisabled || readOnly ? 'true' : undefined}\n applyAriaDisabled={applyAriaDisabled}\n type=\"button\"\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n ariaCurrentValueForInputs,\n handleSetTriggerRef,\n tabIndex,\n handleToggleCalendar,\n handlePickerIconKeyDown,\n disabled,\n applyAriaDisabled,\n readOnly,\n getProps,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkCf;AAlCR,mBAA2C;AAC3C,0BAA6B;AAC7B,sBAA2B;AAC3B,gDAAmD;AACnD,yCAAgD;AAChD,6BAAgC;AAChC,qBAAwC;AAIjC,MAAM,sBAAsB,MAAmB;AACpD,QAAM,EAAE,sBAAsB,qBAAqB,wBAAwB,QAAI,yBAAW,sCAAe;AACzG,QAAM;AAAA,IACJ,OAAO,EAAE,UAAU,UAAU,mBAAmB,SAAS;AAAA,IACzD;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAC9C,aAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,qCAAqC,yBAAyB;AAAA,QAC1E,YAAW;AAAA,QACX,MAAM,iCAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,6EAAmC,aAAa;AAAA,QAC7D;AAAA,QACA,iBAAe,qBAAqB,WAAW,SAAS;AAAA,QACxD;AAAA,QACA,MAAK;AAAA,QACL,eAAe;AAAA,QAEf,sDAAC,8BAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from './CalendarContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\n// we memoize the Icon for maximum optimization\n// this is particularly usefull due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarIconTrigger = (): JSX.Element => {\n const { handleToggleCalendar, handleSetTriggerRef, handlePickerIconKeyDown } = useContext(CalendarContext);\n const {\n props: { disabled, tabIndex, applyAriaDisabled },\n getProps,\n ariaCurrentValueForInputs,\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendar}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled}\n type=\"button\"\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n ariaCurrentValueForInputs,\n handleSetTriggerRef,\n tabIndex,\n handleToggleCalendar,\n handlePickerIconKeyDown,\n disabled,\n applyAriaDisabled,\n getProps,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiCf;AAjCR,mBAA2C;AAC3C,0BAA6B;AAC7B,sBAA2B;AAC3B,gDAAmD;AACnD,yCAAgD;AAChD,6BAAgC;AAChC,qBAAwC;AAIjC,MAAM,sBAAsB,MAAmB;AACpD,QAAM,EAAE,sBAAsB,qBAAqB,wBAAwB,QAAI,yBAAW,sCAAe;AACzG,QAAM;AAAA,IACJ,OAAO,EAAE,UAAU,UAAU,kBAAkB;AAAA,IAC/C;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAC9C,aAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,qCAAqC,yBAAyB;AAAA,QAC1E,YAAW;AAAA,QACX,MAAM,iCAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,6EAAmC,aAAa;AAAA,QAC7D;AAAA,QACA;AAAA,QACA,MAAK;AAAA,QACL,eAAe;AAAA,QAEf,sDAAC,8BAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/Pickers/Calendar/usePopperTriggerLogic.js CHANGED
@@ -41,7 +41,7 @@ const usePopperTriggerLogic = ({
41
41
  }) => {
42
42
  const { focusedDay, resetFocusedDayToStartDate } = focusLogic;
43
43
  const {
44
- props: { onPickerOpen, onPickerClose, readOnly, disabled, applyAriaDisabled },
44
+ props: { onPickerOpen, onPickerClose, disabled },
45
45
  pickerButtonRef,
46
46
  trackFocusCalendarMetafocusedDay,
47
47
  trackFocusCalendarPrevMonth,
@@ -54,17 +54,15 @@ const usePopperTriggerLogic = ({
54
54
  onPickerOpen();
55
55
  }, [onPickerOpen]);
56
56
  const openCalendar = (0, import_react.useCallback)(() => {
57
- if (readOnly || disabled || applyAriaDisabled) return;
57
+ if (disabled) return;
58
58
  if (focusedDay) trackFocusCalendarMetafocusedDay();
59
59
  else setTimeout(() => trackFocusCalendarPrevMonth());
60
60
  setShowCalendar(true);
61
61
  handleOnPickerOpen();
62
62
  }, [
63
- applyAriaDisabled,
64
63
  disabled,
65
64
  focusedDay,
66
65
  handleOnPickerOpen,
67
- readOnly,
68
66
  setShowCalendar,
69
67
  trackFocusCalendarMetafocusedDay,
70
68
  trackFocusCalendarPrevMonth
package/dist/cjs/parts/Pickers/Calendar/usePopperTriggerLogic.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Pickers/Calendar/usePopperTriggerLogic.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useCallback, useState, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport type { useFocusLogic } from './useFocusLogic.js';\n\ninterface UsePopperTriggerLogic {\n focusLogic: ReturnType<typeof useFocusLogic>;\n showCalendar: boolean;\n setShowCalendar: TypescriptHelpersT.StateSetter<boolean>;\n}\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n closeCalendar: () => void;\n handleToggleCalendar: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = ({\n focusLogic,\n showCalendar,\n setShowCalendar,\n}: UsePopperTriggerLogic): PopperTriggerLogicT => {\n const { focusedDay, resetFocusedDayToStartDate } = focusLogic;\n const {\n props: { onPickerOpen, onPickerClose, readOnly, disabled, applyAriaDisabled },\n\n pickerButtonRef,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n // onOpen we try to focus the day we should focus, if we should focus one\n const handleOnPickerOpen = useCallback(() => {\n onPickerOpen();\n }, [onPickerOpen]);\n const openCalendar = useCallback(() => {\n if (readOnly || disabled || applyAriaDisabled) return;\n if (focusedDay) trackFocusCalendarMetafocusedDay();\n else setTimeout(() => trackFocusCalendarPrevMonth());\n setShowCalendar(true);\n handleOnPickerOpen();\n }, [\n applyAriaDisabled,\n disabled,\n focusedDay,\n handleOnPickerOpen,\n readOnly,\n setShowCalendar,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n ]);\n\n const closeCalendar = useCallback(() => {\n setShowCalendar(false);\n onPickerClose();\n resetFocusedDayToStartDate();\n trackFocusPicker();\n }, [setShowCalendar, onPickerClose, resetFocusedDayToStartDate, trackFocusPicker]);\n\n const handleToggleCalendar = useCallback(() => {\n const isOpening = !showCalendar;\n if (isOpening) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendar]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'date-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n return useMemo(\n () => ({\n referenceElement,\n closeCalendar,\n handleSetTriggerRef,\n handleToggleCalendar,\n handleMenuWrapperKeyDown,\n }),\n [closeCalendar, handleMenuWrapperKeyDown, handleSetTriggerRef, handleToggleCalendar, referenceElement],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAA2D;AAE3D,yCAAgD;AAezC,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AACF,MAAkD;AAChD,QAAM,EAAE,YAAY,2BAA2B,IAAI;AACnD,QAAM;AAAA,IACJ,OAAO,EAAE,cAAc,eAAe,UAAU,UAAU,kBAAkB;AAAA,IAE5E;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAC9C,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,uBAAmC,IAAI;AAEvF,QAAM,yBAAqB,0BAAY,MAAM;AAC3C,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AACjB,QAAM,mBAAe,0BAAY,MAAM;AACrC,QAAI,YAAY,YAAY,kBAAmB;AAC/C,QAAI,WAAY,kCAAiC;AAAA,QAC5C,YAAW,MAAM,4BAA4B,CAAC;AACnD,oBAAgB,IAAI;AACpB,uBAAmB;AAAA,EACrB,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,oBAAgB,0BAAY,MAAM;AACtC,oBAAgB,KAAK;AACrB,kBAAc;AACd,+BAA2B;AAC3B,qBAAiB;AAAA,EACnB,GAAG,CAAC,iBAAiB,eAAe,4BAA4B,gBAAgB,CAAC;AAEjF,QAAM,2BAAuB,0BAAY,MAAM;AAC7C,UAAM,YAAY,CAAC;AACnB,QAAI,UAAW,cAAa;AAAA,QACvB,eAAc;AAAA,EACrB,GAAG,CAAC,eAAe,cAAc,YAAY,CAAC;AAE9C,QAAM,0BAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAC1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,+BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,sBAAc;AACd,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,eAAe,gBAAgB;AAAA,EAClC;AAEA,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,eAAe,0BAA0B,qBAAqB,sBAAsB,gBAAgB;AAAA,EACvG;AACF;",
4
+ "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useCallback, useState, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport type { useFocusLogic } from './useFocusLogic.js';\n\ninterface UsePopperTriggerLogic {\n focusLogic: ReturnType<typeof useFocusLogic>;\n showCalendar: boolean;\n setShowCalendar: TypescriptHelpersT.StateSetter<boolean>;\n}\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n closeCalendar: () => void;\n handleToggleCalendar: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = ({\n focusLogic,\n showCalendar,\n setShowCalendar,\n}: UsePopperTriggerLogic): PopperTriggerLogicT => {\n const { focusedDay, resetFocusedDayToStartDate } = focusLogic;\n const {\n props: { onPickerOpen, onPickerClose, disabled },\n\n pickerButtonRef,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n // onOpen we try to focus the day we should focus, if we should focus one\n const handleOnPickerOpen = useCallback(() => {\n onPickerOpen();\n }, [onPickerOpen]);\n const openCalendar = useCallback(() => {\n if (disabled) return;\n if (focusedDay) trackFocusCalendarMetafocusedDay();\n else setTimeout(() => trackFocusCalendarPrevMonth());\n setShowCalendar(true);\n handleOnPickerOpen();\n }, [\n disabled,\n focusedDay,\n handleOnPickerOpen,\n setShowCalendar,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n ]);\n\n const closeCalendar = useCallback(() => {\n setShowCalendar(false);\n onPickerClose();\n resetFocusedDayToStartDate();\n trackFocusPicker();\n }, [setShowCalendar, onPickerClose, resetFocusedDayToStartDate, trackFocusPicker]);\n\n const handleToggleCalendar = useCallback(() => {\n const isOpening = !showCalendar;\n if (isOpening) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendar]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'date-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n return useMemo(\n () => ({\n referenceElement,\n closeCalendar,\n handleSetTriggerRef,\n handleToggleCalendar,\n handleMenuWrapperKeyDown,\n }),\n [closeCalendar, handleMenuWrapperKeyDown, handleSetTriggerRef, handleToggleCalendar, referenceElement],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAA2D;AAE3D,yCAAgD;AAezC,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AACF,MAAkD;AAChD,QAAM,EAAE,YAAY,2BAA2B,IAAI;AACnD,QAAM;AAAA,IACJ,OAAO,EAAE,cAAc,eAAe,SAAS;AAAA,IAE/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAC9C,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,uBAAmC,IAAI;AAEvF,QAAM,yBAAqB,0BAAY,MAAM;AAC3C,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AACjB,QAAM,mBAAe,0BAAY,MAAM;AACrC,QAAI,SAAU;AACd,QAAI,WAAY,kCAAiC;AAAA,QAC5C,YAAW,MAAM,4BAA4B,CAAC;AACnD,oBAAgB,IAAI;AACpB,uBAAmB;AAAA,EACrB,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,oBAAgB,0BAAY,MAAM;AACtC,oBAAgB,KAAK;AACrB,kBAAc;AACd,+BAA2B;AAC3B,qBAAiB;AAAA,EACnB,GAAG,CAAC,iBAAiB,eAAe,4BAA4B,gBAAgB,CAAC;AAEjF,QAAM,2BAAuB,0BAAY,MAAM;AAC7C,UAAM,YAAY,CAAC;AACnB,QAAI,UAAW,cAAa;AAAA,QACvB,eAAc;AAAA,EACrB,GAAG,CAAC,eAAe,cAAc,YAAY,CAAC;AAE9C,QAAM,0BAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAC1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,+BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,sBAAc;AACd,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,eAAe,gBAAgB;AAAA,EAClC;AAEA,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,eAAe,0BAA0B,qBAAqB,sBAAsB,gBAAgB;AAAA,EACvG;AACF;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js CHANGED
@@ -51,7 +51,7 @@ const CalendarWithTimeWheelIconTrigger = () => {
51
51
  } = (0, import_react.useContext)(import_CalendarWithTimeWheelContext.CalendarWithTimeWheelContext);
52
52
  const {
53
53
  getProps,
54
- props: { readOnly, tabIndex }
54
+ props: { tabIndex }
55
55
  } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
56
56
  return (0, import_react.useMemo)(
57
57
  () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -67,7 +67,6 @@ const CalendarWithTimeWheelIconTrigger = () => {
67
67
  onKeyDown: handlePickerIconKeyDown,
68
68
  "data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR_TIMEWHEEL,
69
69
  disabled,
70
- "aria-disabled": applyAriaDisabled || readOnly ? "true" : void 0,
71
70
  applyAriaDisabled,
72
71
  getOwnerProps: getProps,
73
72
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.DatePicker, {})
@@ -81,7 +80,6 @@ const CalendarWithTimeWheelIconTrigger = () => {
81
80
  handlePickerIconKeyDown,
82
81
  handleSetTriggerRef,
83
82
  handleToggleCalendarWithTimeWheel,
84
- readOnly,
85
83
  tabIndex
86
84
  ]
87
85
  );
package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { CalendarWithTimeWheelContext } from './CalendarWithTimeWheelContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\n\n// we memoize the Icon for maximum optimization\n// this is particularly useful due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarWithTimeWheelIconTrigger = (): JSX.Element => {\n const {\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n handlePickerIconKeyDown,\n ariaCurrentValueForInputs,\n disabled,\n applyAriaDisabled,\n } = useContext(CalendarWithTimeWheelContext);\n const {\n getProps,\n props: { readOnly, tabIndex },\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date time picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n type=\"button\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendarWithTimeWheel}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR_TIMEWHEEL}\n disabled={disabled}\n aria-disabled={applyAriaDisabled || readOnly ? 'true' : undefined}\n applyAriaDisabled={applyAriaDisabled}\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n disabled,\n getProps,\n handlePickerIconKeyDown,\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n readOnly,\n tabIndex,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyCf;AAzCR,mBAA2C;AAC3C,0BAA6B;AAC7B,sBAA2B;AAC3B,0CAA6C;AAC7C,qBAAwC;AACxC,yCAAgD;AAChD,gDAAmD;AAK5C,MAAM,mCAAmC,MAAmB;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gEAA4B;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,UAAU,SAAS;AAAA,EAC9B,QAAI,yBAAW,kEAA+B;AAC9C,aAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,0CAA0C,yBAAyB;AAAA,QAC/E,YAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAM,iCAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,6EAAmC,aAAa;AAAA,QAC7D;AAAA,QACA,iBAAe,qBAAqB,WAAW,SAAS;AAAA,QACxD;AAAA,QACA,eAAe;AAAA,QAEf,sDAAC,8BAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { CalendarWithTimeWheelContext } from './CalendarWithTimeWheelContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\n\n// we memoize the Icon for maximum optimization\n// this is particularly useful due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarWithTimeWheelIconTrigger = (): JSX.Element => {\n const {\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n handlePickerIconKeyDown,\n ariaCurrentValueForInputs,\n disabled,\n applyAriaDisabled,\n } = useContext(CalendarWithTimeWheelContext);\n const {\n getProps,\n props: { tabIndex },\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date time picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n type=\"button\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendarWithTimeWheel}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR_TIMEWHEEL}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled}\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n disabled,\n getProps,\n handlePickerIconKeyDown,\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n tabIndex,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwCf;AAxCR,mBAA2C;AAC3C,0BAA6B;AAC7B,sBAA2B;AAC3B,0CAA6C;AAC7C,qBAAwC;AACxC,yCAAgD;AAChD,gDAAmD;AAK5C,MAAM,mCAAmC,MAAmB;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,gEAA4B;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,SAAS;AAAA,EACpB,QAAI,yBAAW,kEAA+B;AAC9C,aAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,0CAA0C,yBAAyB;AAAA,QAC/E,YAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAM,iCAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,6EAAmC,aAAa;AAAA,QAC7D;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QAEf,sDAAC,8BAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js CHANGED
@@ -40,7 +40,7 @@ var import_TimeWheelContext = require("../TimeWheel/TimeWheelContext.js");
40
40
  const useConfigCalendarWithTimeWheelCTX = () => {
41
41
  const {
42
42
  pickerButtonRef,
43
- props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled, readOnly },
43
+ props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled },
44
44
  withAnyInputs,
45
45
  isWithTimeInputs,
46
46
  ariaCurrentValueForInputs,
@@ -51,7 +51,6 @@ const useConfigCalendarWithTimeWheelCTX = () => {
51
51
  latestInteractionRegion,
52
52
  currFocusDescriber
53
53
  } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
54
- const shouldPreventValueChanges = disabled || applyAriaDisabled || readOnly;
55
54
  const { handleToggleCalendar } = (0, import_react.useContext)(import_CalendarContext.CalendarContext);
56
55
  const { handleToggleTimePicker } = (0, import_react.useContext)(import_TimeWheelContext.TimeWheelContext);
57
56
  const [showCalendarWithTimeWheel, setShowCalendarWithTimeWheel] = (0, import_react.useState)(false);
@@ -73,12 +72,12 @@ const useConfigCalendarWithTimeWheelCTX = () => {
73
72
  );
74
73
  const [referenceElement, setReferenceElement] = (0, import_react.useState)(null);
75
74
  const openCalendar = (0, import_react.useCallback)(() => {
76
- if (shouldPreventValueChanges) return;
75
+ if (disabled) return;
77
76
  setShowCalendarWithTimeWheel(true);
78
77
  onPickerOpen();
79
78
  setTimeout(() => handleToggleCalendar());
80
79
  setTimeout(() => handleToggleTimePicker());
81
- }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, shouldPreventValueChanges]);
80
+ }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, disabled]);
82
81
  const closeCalendar = (0, import_react.useCallback)(() => {
83
82
  setShowCalendarWithTimeWheel(false);
84
83
  onPickerClose();
package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useState, useCallback, useContext } from 'react';\nimport { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../../ControlledDateTimePickerTypes.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from '../Calendar/CalendarContext.js';\nimport { TimeWheelContext } from '../TimeWheel/TimeWheelContext.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../../sharedTypes.js';\nexport interface CalendarWithTimeWheelContextT {\n referenceElement: HTMLButtonElement | null;\n ariaCurrentValueForInputs: string;\n showCalendarWithTimeWheel: boolean;\n closeCalendar: () => void;\n handleToggleCalendarWithTimeWheel: (\n e: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>,\n ) => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n handlePickerIconKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n isControllerOnly: boolean;\n disabled: boolean;\n applyAriaDisabled?: boolean;\n}\nexport const useConfigCalendarWithTimeWheelCTX = (): CalendarWithTimeWheelContextT => {\n const {\n pickerButtonRef,\n props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled, readOnly },\n withAnyInputs,\n isWithTimeInputs,\n ariaCurrentValueForInputs,\n trackFocusFirstSegment,\n trackFocusMeridiemInput,\n trackFocusYearInput,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const shouldPreventValueChanges = disabled || applyAriaDisabled || readOnly;\n const { handleToggleCalendar } = useContext(CalendarContext);\n const { handleToggleTimePicker } = useContext(TimeWheelContext);\n const [showCalendarWithTimeWheel, setShowCalendarWithTimeWheel] = useState(false);\n const onHomeKeyDown = useCallback(() => {\n trackFocusFirstSegment();\n }, [trackFocusFirstSegment]);\n const handlePickerIconKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown<HTMLButtonElement> = useCallback(\n (e) => {\n const { key } = e;\n if (['Home', 'End'].includes(key)) e.preventDefault();\n if (['Home', 'End'].includes(key)) e.stopPropagation();\n if (key === 'Home') onHomeKeyDown();\n if (key === 'Backspace' && withAnyInputs) {\n if (isWithTimeInputs) trackFocusMeridiemInput();\n else trackFocusYearInput();\n }\n },\n [isWithTimeInputs, onHomeKeyDown, trackFocusMeridiemInput, trackFocusYearInput, withAnyInputs],\n );\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const openCalendar = useCallback(() => {\n if (shouldPreventValueChanges) return;\n setShowCalendarWithTimeWheel(true);\n onPickerOpen();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, shouldPreventValueChanges]);\n const closeCalendar = useCallback(() => {\n setShowCalendarWithTimeWheel(false);\n onPickerClose();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerClose]);\n\n const handleToggleCalendarWithTimeWheel = useCallback(() => {\n if (!showCalendarWithTimeWheel) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendarWithTimeWheel]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'datetime-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n const isControllerOnly = useMemo(() => type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.CONTROLLER_ONLY, [type]);\n\n return useMemo(\n () => ({\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n }),\n [\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useState, useCallback, useContext } from 'react';\nimport { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../../ControlledDateTimePickerTypes.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from '../Calendar/CalendarContext.js';\nimport { TimeWheelContext } from '../TimeWheel/TimeWheelContext.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../../sharedTypes.js';\nexport interface CalendarWithTimeWheelContextT {\n referenceElement: HTMLButtonElement | null;\n ariaCurrentValueForInputs: string;\n showCalendarWithTimeWheel: boolean;\n closeCalendar: () => void;\n handleToggleCalendarWithTimeWheel: (\n e: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>,\n ) => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n handlePickerIconKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n isControllerOnly: boolean;\n disabled: boolean;\n applyAriaDisabled?: boolean;\n}\nexport const useConfigCalendarWithTimeWheelCTX = (): CalendarWithTimeWheelContextT => {\n const {\n pickerButtonRef,\n props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled },\n withAnyInputs,\n isWithTimeInputs,\n ariaCurrentValueForInputs,\n trackFocusFirstSegment,\n trackFocusMeridiemInput,\n trackFocusYearInput,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const { handleToggleCalendar } = useContext(CalendarContext);\n const { handleToggleTimePicker } = useContext(TimeWheelContext);\n const [showCalendarWithTimeWheel, setShowCalendarWithTimeWheel] = useState(false);\n const onHomeKeyDown = useCallback(() => {\n trackFocusFirstSegment();\n }, [trackFocusFirstSegment]);\n const handlePickerIconKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown<HTMLButtonElement> = useCallback(\n (e) => {\n const { key } = e;\n if (['Home', 'End'].includes(key)) e.preventDefault();\n if (['Home', 'End'].includes(key)) e.stopPropagation();\n if (key === 'Home') onHomeKeyDown();\n if (key === 'Backspace' && withAnyInputs) {\n if (isWithTimeInputs) trackFocusMeridiemInput();\n else trackFocusYearInput();\n }\n },\n [isWithTimeInputs, onHomeKeyDown, trackFocusMeridiemInput, trackFocusYearInput, withAnyInputs],\n );\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const openCalendar = useCallback(() => {\n if (disabled) return;\n setShowCalendarWithTimeWheel(true);\n onPickerOpen();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, disabled]);\n const closeCalendar = useCallback(() => {\n setShowCalendarWithTimeWheel(false);\n onPickerClose();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerClose]);\n\n const handleToggleCalendarWithTimeWheel = useCallback(() => {\n if (!showCalendarWithTimeWheel) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendarWithTimeWheel]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'datetime-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n const isControllerOnly = useMemo(() => type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.CONTROLLER_ONLY, [type]);\n\n return useMemo(\n () => ({\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n }),\n [\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/Pickers/TimeWheel/usePopperTriggerLogic.js CHANGED
@@ -37,7 +37,7 @@ var import_ControlledDateTimePickerCTX = require("../../../ControlledDateTimePic
37
37
  const usePopperTriggerLogic = () => {
38
38
  const {
39
39
  pickerButtonRef,
40
- props: { onPickerClose, onPickerOpen, applyAriaDisabled, readOnly, disabled },
40
+ props: { onPickerClose, onPickerOpen, disabled },
41
41
  isWithCalendarToo,
42
42
  trackFocusTimewheelCurrHour,
43
43
  trackFocusPicker,
@@ -51,7 +51,7 @@ const usePopperTriggerLogic = () => {
51
51
  onPickerClose();
52
52
  }, [onPickerClose]);
53
53
  const handleToggleTimePicker = (0, import_react.useCallback)(() => {
54
- if (readOnly || applyAriaDisabled || disabled) return;
54
+ if (disabled) return;
55
55
  setShowTimePicker((oldShowCalendar) => {
56
56
  if (!oldShowCalendar) {
57
57
  onPickerOpen();
@@ -59,15 +59,7 @@ const usePopperTriggerLogic = () => {
59
59
  } else onPickerClose();
60
60
  return !oldShowCalendar;
61
61
  });
62
- }, [
63
- applyAriaDisabled,
64
- disabled,
65
- isWithCalendarToo,
66
- onPickerClose,
67
- onPickerOpen,
68
- readOnly,
69
- trackFocusTimewheelCurrHour
70
- ]);
62
+ }, [disabled, isWithCalendarToo, onPickerClose, onPickerOpen, trackFocusTimewheelCurrHour]);
71
63
  const handleSetTriggerRef = (0, import_react.useCallback)(
72
64
  (newRef) => {
73
65
  pickerButtonRef.current = newRef;
package/dist/cjs/parts/Pickers/TimeWheel/usePopperTriggerLogic.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/Pickers/TimeWheel/usePopperTriggerLogic.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { useState, useCallback, useMemo, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\n\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n showTimePicker: boolean;\n closeTimePicker: () => void;\n setShowTimePicker: TypescriptHelpersT.StateSetter<boolean>;\n handleToggleTimePicker: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = (): PopperTriggerLogicT => {\n const {\n pickerButtonRef,\n props: { onPickerClose, onPickerOpen, applyAriaDisabled, readOnly, disabled },\n isWithCalendarToo,\n trackFocusTimewheelCurrHour,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [showTimePicker, setShowTimePicker] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const closeTimePicker = useCallback(() => {\n setShowTimePicker(false);\n onPickerClose();\n }, [onPickerClose]);\n const handleToggleTimePicker = useCallback(() => {\n if (readOnly || applyAriaDisabled || disabled) return;\n setShowTimePicker((oldShowCalendar) => {\n if (!oldShowCalendar) {\n onPickerOpen();\n if (!isWithCalendarToo) trackFocusTimewheelCurrHour();\n } else onPickerClose();\n return !oldShowCalendar;\n });\n }, [\n applyAriaDisabled,\n disabled,\n isWithCalendarToo,\n onPickerClose,\n onPickerOpen,\n readOnly,\n trackFocusTimewheelCurrHour,\n ]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'time-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeTimePicker();\n trackFocusPicker();\n }\n },\n [closeTimePicker, trackFocusPicker],\n );\n return useMemo(\n () => ({\n referenceElement,\n showTimePicker,\n setShowTimePicker,\n handleToggleTimePicker,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n closeTimePicker,\n }),\n [\n closeTimePicker,\n handleMenuWrapperKeyDown,\n handleSetTriggerRef,\n handleToggleTimePicker,\n referenceElement,\n showTimePicker,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA2D;AAE3D,yCAAgD;AAWzC,MAAM,wBAAwB,MAA2B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,eAAe,cAAc,mBAAmB,UAAU,SAAS;AAAA,IAC5E;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAC9C,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAAS,KAAK;AAC1D,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,uBAAmC,IAAI;AACvF,QAAM,sBAAkB,0BAAY,MAAM;AACxC,sBAAkB,KAAK;AACvB,kBAAc;AAAA,EAChB,GAAG,CAAC,aAAa,CAAC;AAClB,QAAM,6BAAyB,0BAAY,MAAM;AAC/C,QAAI,YAAY,qBAAqB,SAAU;AAC/C,sBAAkB,CAAC,oBAAoB;AACrC,UAAI,CAAC,iBAAiB;AACpB,qBAAa;AACb,YAAI,CAAC,kBAAmB,6BAA4B;AAAA,MACtD,MAAO,eAAc;AACrB,aAAO,CAAC;AAAA,IACV,CAAC;AAAA,EACH,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,0BAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAE1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,+BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,wBAAgB;AAChB,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,gBAAgB;AAAA,EACpC;AACA,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import { useState, useCallback, useMemo, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\n\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n showTimePicker: boolean;\n closeTimePicker: () => void;\n setShowTimePicker: TypescriptHelpersT.StateSetter<boolean>;\n handleToggleTimePicker: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = (): PopperTriggerLogicT => {\n const {\n pickerButtonRef,\n props: { onPickerClose, onPickerOpen, disabled },\n isWithCalendarToo,\n trackFocusTimewheelCurrHour,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [showTimePicker, setShowTimePicker] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const closeTimePicker = useCallback(() => {\n setShowTimePicker(false);\n onPickerClose();\n }, [onPickerClose]);\n const handleToggleTimePicker = useCallback(() => {\n if (disabled) return;\n setShowTimePicker((oldShowCalendar) => {\n if (!oldShowCalendar) {\n onPickerOpen();\n if (!isWithCalendarToo) trackFocusTimewheelCurrHour();\n } else onPickerClose();\n return !oldShowCalendar;\n });\n }, [disabled, isWithCalendarToo, onPickerClose, onPickerOpen, trackFocusTimewheelCurrHour]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'time-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeTimePicker();\n trackFocusPicker();\n }\n },\n [closeTimePicker, trackFocusPicker],\n );\n return useMemo(\n () => ({\n referenceElement,\n showTimePicker,\n setShowTimePicker,\n handleToggleTimePicker,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n closeTimePicker,\n }),\n [\n closeTimePicker,\n handleMenuWrapperKeyDown,\n handleSetTriggerRef,\n handleToggleTimePicker,\n referenceElement,\n showTimePicker,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA2D;AAE3D,yCAAgD;AAWzC,MAAM,wBAAwB,MAA2B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,eAAe,cAAc,SAAS;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAC9C,QAAM,CAAC,gBAAgB,iBAAiB,QAAI,uBAAS,KAAK;AAC1D,QAAM,CAAC,kBAAkB,mBAAmB,QAAI,uBAAmC,IAAI;AACvF,QAAM,sBAAkB,0BAAY,MAAM;AACxC,sBAAkB,KAAK;AACvB,kBAAc;AAAA,EAChB,GAAG,CAAC,aAAa,CAAC;AAClB,QAAM,6BAAyB,0BAAY,MAAM;AAC/C,QAAI,SAAU;AACd,sBAAkB,CAAC,oBAAoB;AACrC,UAAI,CAAC,iBAAiB;AACpB,qBAAa;AACb,YAAI,CAAC,kBAAmB,6BAA4B;AAAA,MACtD,MAAO,eAAc;AACrB,aAAO,CAAC;AAAA,IACV,CAAC;AAAA,EACH,GAAG,CAAC,UAAU,mBAAmB,eAAe,cAAc,2BAA2B,CAAC;AAE1F,QAAM,0BAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAE1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,+BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,wBAAgB;AAChB,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,gBAAgB;AAAA,EACpC;AACA,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/ControlledDateTimePickerDefinitions.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- const DSControlledDateTimePickerName = "DSControlledDateTimePicker";
2
+ const DSControlledDateTimePickerName = "DSControlleddatetimepicker";
3
3
  const DSControlledDateTimePickerSlotsFlatten = {
4
4
  CONTAINER: "root",
5
5
  INPUT: "field-input",
package/dist/esm/ControlledDateTimePickerDefinitions.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/ControlledDateTimePickerDefinitions.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSControlledDateTimePickerName = 'DSControlledDateTimePicker';\n\nexport const DSControlledDateTimePickerSlotsFlatten = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS_MONTH: 'time-picker-month-input',\n DATE_INPUTS_DAY: 'time-picker-day-input',\n DATE_INPUTS_YEAR: 'time-picker-year-input',\n TIME_INPUTS_HOUR: 'time-picker-hour-input',\n TIME_INPUTS_MINUTE: 'time-picker-minute-input',\n TIME_INPUTS_MERIDIEM: 'time-picker-meridiem-input',\n PICKER_ICONS_CALENDAR: 'calendar-trigger-icon',\n PICKER_ICONS_TIMEWHEEL: 'timewheel-trigger-icon',\n PICKER_ICONS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-trigger-icon',\n CALENDAR_DAY_BUTTON: 'calendar-day',\n CALENDAR_HEADER_LABEL: 'calendar-header-label',\n CALENDAR_HEADER_BUTTON: 'calendar-header-buttons',\n CALENDAR_HEADER_WEEKLY_DAY_LIST: 'calendar-header-weekly-day-list',\n TIMEWHEEL_TIME_BUTTON: 'timewheel-time-button',\n TIMEWHEEL_TIME_CHANGE_BUTTON: 'timewheel-time-change-button',\n TIMEWHEEL_HEADER_LABEL: 'timewheel-header-label',\n CONTEXTUAL_MENU_CALENDAR: 'calendar-context-content-wrapper',\n CONTEXTUAL_MENU_TIMEWHEEL: 'timewheel-context-content-wrapper',\n CONTEXTUAL_MENU_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-content-wrapper',\n FOOTERS_CALENDAR: 'calendar-context-footer',\n FOOTERS_TIMEWHEEL: 'timewheel-context-footer',\n FOOTERS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-footer',\n CONTROLLER_COMPONENT_CALENDAR: 'calendar-controller-wrapper',\n CONTROLLER_COMPONENT_TIMEWHEEL: 'timewheel-controller-wrapper',\n CONTROLLER_COMPONENT_CALENDAR_TIMEWHEEL: 'calendar-timewheel-controller-wrapper',\n CLEAR_BUTTON: 'clear-btn',\n} as const;\n\nexport const DSControlledDateTimePickerSlots = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS: {\n MONTH: 'time-picker-month-input',\n DAY: 'time-picker-day-input',\n YEAR: 'time-picker-year-input',\n },\n TIME_INPUTS: {\n HOUR: 'time-picker-hour-input',\n MINUTE: 'time-picker-minute-input',\n MERIDIEM: '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"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSControlledDateTimePickerName = 'DSControlleddatetimepicker';\n\nexport const DSControlledDateTimePickerSlotsFlatten = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS_MONTH: 'time-picker-month-input',\n DATE_INPUTS_DAY: 'time-picker-day-input',\n DATE_INPUTS_YEAR: 'time-picker-year-input',\n TIME_INPUTS_HOUR: 'time-picker-hour-input',\n TIME_INPUTS_MINUTE: 'time-picker-minute-input',\n TIME_INPUTS_MERIDIEM: 'time-picker-meridiem-input',\n PICKER_ICONS_CALENDAR: 'calendar-trigger-icon',\n PICKER_ICONS_TIMEWHEEL: 'timewheel-trigger-icon',\n PICKER_ICONS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-trigger-icon',\n CALENDAR_DAY_BUTTON: 'calendar-day',\n CALENDAR_HEADER_LABEL: 'calendar-header-label',\n CALENDAR_HEADER_BUTTON: 'calendar-header-buttons',\n CALENDAR_HEADER_WEEKLY_DAY_LIST: 'calendar-header-weekly-day-list',\n TIMEWHEEL_TIME_BUTTON: 'timewheel-time-button',\n TIMEWHEEL_TIME_CHANGE_BUTTON: 'timewheel-time-change-button',\n TIMEWHEEL_HEADER_LABEL: 'timewheel-header-label',\n CONTEXTUAL_MENU_CALENDAR: 'calendar-context-content-wrapper',\n CONTEXTUAL_MENU_TIMEWHEEL: 'timewheel-context-content-wrapper',\n CONTEXTUAL_MENU_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-content-wrapper',\n FOOTERS_CALENDAR: 'calendar-context-footer',\n FOOTERS_TIMEWHEEL: 'timewheel-context-footer',\n FOOTERS_CALENDAR_TIMEWHEEL: 'calendar-timewheel-context-footer',\n CONTROLLER_COMPONENT_CALENDAR: 'calendar-controller-wrapper',\n CONTROLLER_COMPONENT_TIMEWHEEL: 'timewheel-controller-wrapper',\n CONTROLLER_COMPONENT_CALENDAR_TIMEWHEEL: 'calendar-timewheel-controller-wrapper',\n CLEAR_BUTTON: 'clear-btn',\n} as const;\n\nexport const DSControlledDateTimePickerSlots = {\n CONTAINER: 'root',\n INPUT: 'field-input',\n DATE_INPUTS: {\n MONTH: 'time-picker-month-input',\n DAY: 'time-picker-day-input',\n YEAR: 'time-picker-year-input',\n },\n TIME_INPUTS: {\n HOUR: 'time-picker-hour-input',\n MINUTE: 'time-picker-minute-input',\n MERIDIEM: '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"],
5
5
  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,iCAAiC;AAEvC,MAAM,yCAAyC;AAAA,EACpD,WAAW;AAAA,EACX,OAAO;AAAA,EACP,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,oBAAoB;AAAA,EACpB,sBAAsB;AAAA,EACtB,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,iCAAiC;AAAA,EACjC,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,iCAAiC;AAAA,EACjC,uBAAuB;AAAA,EACvB,8BAA8B;AAAA,EAC9B,wBAAwB;AAAA,EACxB,0BAA0B;AAAA,EAC1B,2BAA2B;AAAA,EAC3B,oCAAoC;AAAA,EACpC,kBAAkB;AAAA,EAClB,mBAAmB;AAAA,EACnB,4BAA4B;AAAA,EAC5B,+BAA+B;AAAA,EAC/B,gCAAgC;AAAA,EAChC,yCAAyC;AAAA,EACzC,cAAc;AAChB;AAEO,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;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/Pickers/Calendar/CalendarIconTrigger.js CHANGED
@@ -10,7 +10,7 @@ import { StyledIconTriggerButton } from "./Styleds.js";
10
10
  const CalendarIconTrigger = () => {
11
11
  const { handleToggleCalendar, handleSetTriggerRef, handlePickerIconKeyDown } = useContext(CalendarContext);
12
12
  const {
13
- props: { disabled, tabIndex, applyAriaDisabled, readOnly },
13
+ props: { disabled, tabIndex, applyAriaDisabled },
14
14
  getProps,
15
15
  ariaCurrentValueForInputs
16
16
  } = useContext(ControlledDateTimePickerContext);
@@ -27,7 +27,6 @@ const CalendarIconTrigger = () => {
27
27
  onKeyDown: handlePickerIconKeyDown,
28
28
  "data-testid": ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR,
29
29
  disabled,
30
- "aria-disabled": applyAriaDisabled || readOnly ? "true" : void 0,
31
30
  applyAriaDisabled,
32
31
  type: "button",
33
32
  getOwnerProps: getProps,
@@ -42,7 +41,6 @@ const CalendarIconTrigger = () => {
42
41
  handlePickerIconKeyDown,
43
42
  disabled,
44
43
  applyAriaDisabled,
45
- readOnly,
46
44
  getProps
47
45
  ]
48
46
  );
package/dist/esm/parts/Pickers/Calendar/CalendarIconTrigger.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Pickers/Calendar/CalendarIconTrigger.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from './CalendarContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\n// we memoize the Icon for maximum optimization\n// this is particularly usefull due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarIconTrigger = (): JSX.Element => {\n const { handleToggleCalendar, handleSetTriggerRef, handlePickerIconKeyDown } = useContext(CalendarContext);\n const {\n props: { disabled, tabIndex, applyAriaDisabled, readOnly },\n getProps,\n ariaCurrentValueForInputs,\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendar}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR}\n disabled={disabled}\n aria-disabled={applyAriaDisabled || readOnly ? 'true' : undefined}\n applyAriaDisabled={applyAriaDisabled}\n type=\"button\"\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n ariaCurrentValueForInputs,\n handleSetTriggerRef,\n tabIndex,\n handleToggleCalendar,\n handlePickerIconKeyDown,\n disabled,\n applyAriaDisabled,\n readOnly,\n getProps,\n ],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACkCf;AAlCR,SAAgB,YAAY,eAAe;AAC3C,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,0CAA0C;AACnD,SAAS,uCAAuC;AAChD,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAIjC,MAAM,sBAAsB,MAAmB;AACpD,QAAM,EAAE,sBAAsB,qBAAqB,wBAAwB,IAAI,WAAW,eAAe;AACzG,QAAM;AAAA,IACJ,OAAO,EAAE,UAAU,UAAU,mBAAmB,SAAS;AAAA,IACzD;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,SAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,qCAAqC,yBAAyB;AAAA,QAC1E,YAAW;AAAA,QACX,MAAM,aAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,mCAAmC,aAAa;AAAA,QAC7D;AAAA,QACA,iBAAe,qBAAqB,WAAW,SAAS;AAAA,QACxD;AAAA,QACA,MAAK;AAAA,QACL,eAAe;AAAA,QAEf,8BAAC,cAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from './CalendarContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\n// we memoize the Icon for maximum optimization\n// this is particularly usefull due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarIconTrigger = (): JSX.Element => {\n const { handleToggleCalendar, handleSetTriggerRef, handlePickerIconKeyDown } = useContext(CalendarContext);\n const {\n props: { disabled, tabIndex, applyAriaDisabled },\n getProps,\n ariaCurrentValueForInputs,\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendar}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled}\n type=\"button\"\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n ariaCurrentValueForInputs,\n handleSetTriggerRef,\n tabIndex,\n handleToggleCalendar,\n handlePickerIconKeyDown,\n disabled,\n applyAriaDisabled,\n getProps,\n ],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACiCf;AAjCR,SAAgB,YAAY,eAAe;AAC3C,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,0CAA0C;AACnD,SAAS,uCAAuC;AAChD,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AAIjC,MAAM,sBAAsB,MAAmB;AACpD,QAAM,EAAE,sBAAsB,qBAAqB,wBAAwB,IAAI,WAAW,eAAe;AACzG,QAAM;AAAA,IACJ,OAAO,EAAE,UAAU,UAAU,kBAAkB;AAAA,IAC/C;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,SAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,qCAAqC,yBAAyB;AAAA,QAC1E,YAAW;AAAA,QACX,MAAM,aAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,mCAAmC,aAAa;AAAA,QAC7D;AAAA,QACA;AAAA,QACA,MAAK;AAAA,QACL,eAAe;AAAA,QAEf,8BAAC,cAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/Pickers/Calendar/usePopperTriggerLogic.js CHANGED
@@ -8,7 +8,7 @@ const usePopperTriggerLogic = ({
8
8
  }) => {
9
9
  const { focusedDay, resetFocusedDayToStartDate } = focusLogic;
10
10
  const {
11
- props: { onPickerOpen, onPickerClose, readOnly, disabled, applyAriaDisabled },
11
+ props: { onPickerOpen, onPickerClose, disabled },
12
12
  pickerButtonRef,
13
13
  trackFocusCalendarMetafocusedDay,
14
14
  trackFocusCalendarPrevMonth,
@@ -21,17 +21,15 @@ const usePopperTriggerLogic = ({
21
21
  onPickerOpen();
22
22
  }, [onPickerOpen]);
23
23
  const openCalendar = useCallback(() => {
24
- if (readOnly || disabled || applyAriaDisabled) return;
24
+ if (disabled) return;
25
25
  if (focusedDay) trackFocusCalendarMetafocusedDay();
26
26
  else setTimeout(() => trackFocusCalendarPrevMonth());
27
27
  setShowCalendar(true);
28
28
  handleOnPickerOpen();
29
29
  }, [
30
- applyAriaDisabled,
31
30
  disabled,
32
31
  focusedDay,
33
32
  handleOnPickerOpen,
34
- readOnly,
35
33
  setShowCalendar,
36
34
  trackFocusCalendarMetafocusedDay,
37
35
  trackFocusCalendarPrevMonth
package/dist/esm/parts/Pickers/Calendar/usePopperTriggerLogic.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Pickers/Calendar/usePopperTriggerLogic.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useCallback, useState, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport type { useFocusLogic } from './useFocusLogic.js';\n\ninterface UsePopperTriggerLogic {\n focusLogic: ReturnType<typeof useFocusLogic>;\n showCalendar: boolean;\n setShowCalendar: TypescriptHelpersT.StateSetter<boolean>;\n}\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n closeCalendar: () => void;\n handleToggleCalendar: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = ({\n focusLogic,\n showCalendar,\n setShowCalendar,\n}: UsePopperTriggerLogic): PopperTriggerLogicT => {\n const { focusedDay, resetFocusedDayToStartDate } = focusLogic;\n const {\n props: { onPickerOpen, onPickerClose, readOnly, disabled, applyAriaDisabled },\n\n pickerButtonRef,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n // onOpen we try to focus the day we should focus, if we should focus one\n const handleOnPickerOpen = useCallback(() => {\n onPickerOpen();\n }, [onPickerOpen]);\n const openCalendar = useCallback(() => {\n if (readOnly || disabled || applyAriaDisabled) return;\n if (focusedDay) trackFocusCalendarMetafocusedDay();\n else setTimeout(() => trackFocusCalendarPrevMonth());\n setShowCalendar(true);\n handleOnPickerOpen();\n }, [\n applyAriaDisabled,\n disabled,\n focusedDay,\n handleOnPickerOpen,\n readOnly,\n setShowCalendar,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n ]);\n\n const closeCalendar = useCallback(() => {\n setShowCalendar(false);\n onPickerClose();\n resetFocusedDayToStartDate();\n trackFocusPicker();\n }, [setShowCalendar, onPickerClose, resetFocusedDayToStartDate, trackFocusPicker]);\n\n const handleToggleCalendar = useCallback(() => {\n const isOpening = !showCalendar;\n if (isOpening) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendar]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'date-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n return useMemo(\n () => ({\n referenceElement,\n closeCalendar,\n handleSetTriggerRef,\n handleToggleCalendar,\n handleMenuWrapperKeyDown,\n }),\n [closeCalendar, handleMenuWrapperKeyDown, handleSetTriggerRef, handleToggleCalendar, referenceElement],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,SAAS,aAAa,UAAU,kBAAkB;AAE3D,SAAS,uCAAuC;AAezC,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AACF,MAAkD;AAChD,QAAM,EAAE,YAAY,2BAA2B,IAAI;AACnD,QAAM;AAAA,IACJ,OAAO,EAAE,cAAc,eAAe,UAAU,UAAU,kBAAkB;AAAA,IAE5E;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAmC,IAAI;AAEvF,QAAM,qBAAqB,YAAY,MAAM;AAC3C,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AACjB,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI,YAAY,YAAY,kBAAmB;AAC/C,QAAI,WAAY,kCAAiC;AAAA,QAC5C,YAAW,MAAM,4BAA4B,CAAC;AACnD,oBAAgB,IAAI;AACpB,uBAAmB;AAAA,EACrB,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,YAAY,MAAM;AACtC,oBAAgB,KAAK;AACrB,kBAAc;AACd,+BAA2B;AAC3B,qBAAiB;AAAA,EACnB,GAAG,CAAC,iBAAiB,eAAe,4BAA4B,gBAAgB,CAAC;AAEjF,QAAM,uBAAuB,YAAY,MAAM;AAC7C,UAAM,YAAY,CAAC;AACnB,QAAI,UAAW,cAAa;AAAA,QACvB,eAAc;AAAA,EACrB,GAAG,CAAC,eAAe,cAAc,YAAY,CAAC;AAE9C,QAAM,sBAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAC1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,2BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,sBAAc;AACd,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,eAAe,gBAAgB;AAAA,EAClC;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,eAAe,0BAA0B,qBAAqB,sBAAsB,gBAAgB;AAAA,EACvG;AACF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useCallback, useState, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport type { useFocusLogic } from './useFocusLogic.js';\n\ninterface UsePopperTriggerLogic {\n focusLogic: ReturnType<typeof useFocusLogic>;\n showCalendar: boolean;\n setShowCalendar: TypescriptHelpersT.StateSetter<boolean>;\n}\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n closeCalendar: () => void;\n handleToggleCalendar: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = ({\n focusLogic,\n showCalendar,\n setShowCalendar,\n}: UsePopperTriggerLogic): PopperTriggerLogicT => {\n const { focusedDay, resetFocusedDayToStartDate } = focusLogic;\n const {\n props: { onPickerOpen, onPickerClose, disabled },\n\n pickerButtonRef,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n // onOpen we try to focus the day we should focus, if we should focus one\n const handleOnPickerOpen = useCallback(() => {\n onPickerOpen();\n }, [onPickerOpen]);\n const openCalendar = useCallback(() => {\n if (disabled) return;\n if (focusedDay) trackFocusCalendarMetafocusedDay();\n else setTimeout(() => trackFocusCalendarPrevMonth());\n setShowCalendar(true);\n handleOnPickerOpen();\n }, [\n disabled,\n focusedDay,\n handleOnPickerOpen,\n setShowCalendar,\n trackFocusCalendarMetafocusedDay,\n trackFocusCalendarPrevMonth,\n ]);\n\n const closeCalendar = useCallback(() => {\n setShowCalendar(false);\n onPickerClose();\n resetFocusedDayToStartDate();\n trackFocusPicker();\n }, [setShowCalendar, onPickerClose, resetFocusedDayToStartDate, trackFocusPicker]);\n\n const handleToggleCalendar = useCallback(() => {\n const isOpening = !showCalendar;\n if (isOpening) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendar]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'date-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n return useMemo(\n () => ({\n referenceElement,\n closeCalendar,\n handleSetTriggerRef,\n handleToggleCalendar,\n handleMenuWrapperKeyDown,\n }),\n [closeCalendar, handleMenuWrapperKeyDown, handleSetTriggerRef, handleToggleCalendar, referenceElement],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACIvB,SAAS,SAAS,aAAa,UAAU,kBAAkB;AAE3D,SAAS,uCAAuC;AAezC,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AACF,MAAkD;AAChD,QAAM,EAAE,YAAY,2BAA2B,IAAI;AACnD,QAAM;AAAA,IACJ,OAAO,EAAE,cAAc,eAAe,SAAS;AAAA,IAE/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAmC,IAAI;AAEvF,QAAM,qBAAqB,YAAY,MAAM;AAC3C,iBAAa;AAAA,EACf,GAAG,CAAC,YAAY,CAAC;AACjB,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI,SAAU;AACd,QAAI,WAAY,kCAAiC;AAAA,QAC5C,YAAW,MAAM,4BAA4B,CAAC;AACnD,oBAAgB,IAAI;AACpB,uBAAmB;AAAA,EACrB,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,gBAAgB,YAAY,MAAM;AACtC,oBAAgB,KAAK;AACrB,kBAAc;AACd,+BAA2B;AAC3B,qBAAiB;AAAA,EACnB,GAAG,CAAC,iBAAiB,eAAe,4BAA4B,gBAAgB,CAAC;AAEjF,QAAM,uBAAuB,YAAY,MAAM;AAC7C,UAAM,YAAY,CAAC;AACnB,QAAI,UAAW,cAAa;AAAA,QACvB,eAAc;AAAA,EACrB,GAAG,CAAC,eAAe,cAAc,YAAY,CAAC;AAE9C,QAAM,sBAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAC1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,2BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,sBAAc;AACd,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,eAAe,gBAAgB;AAAA,EAClC;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,eAAe,0BAA0B,qBAAqB,sBAAsB,gBAAgB;AAAA,EACvG;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js CHANGED
@@ -18,7 +18,7 @@ const CalendarWithTimeWheelIconTrigger = () => {
18
18
  } = useContext(CalendarWithTimeWheelContext);
19
19
  const {
20
20
  getProps,
21
- props: { readOnly, tabIndex }
21
+ props: { tabIndex }
22
22
  } = useContext(ControlledDateTimePickerContext);
23
23
  return useMemo(
24
24
  () => /* @__PURE__ */ jsx(
@@ -34,7 +34,6 @@ const CalendarWithTimeWheelIconTrigger = () => {
34
34
  onKeyDown: handlePickerIconKeyDown,
35
35
  "data-testid": ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR_TIMEWHEEL,
36
36
  disabled,
37
- "aria-disabled": applyAriaDisabled || readOnly ? "true" : void 0,
38
37
  applyAriaDisabled,
39
38
  getOwnerProps: getProps,
40
39
  children: /* @__PURE__ */ jsx(DatePicker, {})
@@ -48,7 +47,6 @@ const CalendarWithTimeWheelIconTrigger = () => {
48
47
  handlePickerIconKeyDown,
49
48
  handleSetTriggerRef,
50
49
  handleToggleCalendarWithTimeWheel,
51
- readOnly,
52
50
  tabIndex
53
51
  ]
54
52
  );
package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { CalendarWithTimeWheelContext } from './CalendarWithTimeWheelContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\n\n// we memoize the Icon for maximum optimization\n// this is particularly useful due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarWithTimeWheelIconTrigger = (): JSX.Element => {\n const {\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n handlePickerIconKeyDown,\n ariaCurrentValueForInputs,\n disabled,\n applyAriaDisabled,\n } = useContext(CalendarWithTimeWheelContext);\n const {\n getProps,\n props: { readOnly, tabIndex },\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date time picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n type=\"button\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendarWithTimeWheel}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR_TIMEWHEEL}\n disabled={disabled}\n aria-disabled={applyAriaDisabled || readOnly ? 'true' : undefined}\n applyAriaDisabled={applyAriaDisabled}\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n disabled,\n getProps,\n handlePickerIconKeyDown,\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n readOnly,\n tabIndex,\n ],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACyCf;AAzCR,SAAgB,YAAY,eAAe;AAC3C,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,oCAAoC;AAC7C,SAAS,+BAA+B;AACxC,SAAS,uCAAuC;AAChD,SAAS,0CAA0C;AAK5C,MAAM,mCAAmC,MAAmB;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,4BAA4B;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,UAAU,SAAS;AAAA,EAC9B,IAAI,WAAW,+BAA+B;AAC9C,SAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,0CAA0C,yBAAyB;AAAA,QAC/E,YAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAM,aAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,mCAAmC,aAAa;AAAA,QAC7D;AAAA,QACA,iBAAe,qBAAqB,WAAW,SAAS;AAAA,QACxD;AAAA,QACA,eAAe;AAAA,QAEf,8BAAC,cAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo } from 'react';\nimport { BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport { CalendarWithTimeWheelContext } from './CalendarWithTimeWheelContext.js';\nimport { StyledIconTriggerButton } from './Styleds.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { ControlledDateTimePickerDatatestid } from '../../../ControlledDateTimePickerDatatestid.js';\n\n// we memoize the Icon for maximum optimization\n// this is particularly useful due to how usePopper needs to check the references\n// since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders\nexport const CalendarWithTimeWheelIconTrigger = (): JSX.Element => {\n const {\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n handlePickerIconKeyDown,\n ariaCurrentValueForInputs,\n disabled,\n applyAriaDisabled,\n } = useContext(CalendarWithTimeWheelContext);\n const {\n getProps,\n props: { tabIndex },\n } = useContext(ControlledDateTimePickerContext);\n return useMemo(\n () => (\n <StyledIconTriggerButton\n aria-label={`date time picker context menu trigger, ${ariaCurrentValueForInputs}`}\n buttonType=\"icon\"\n type=\"button\"\n size={BUTTON_SIZES.M}\n innerRef={handleSetTriggerRef}\n tabIndex={tabIndex}\n onClick={handleToggleCalendarWithTimeWheel}\n onKeyDown={handlePickerIconKeyDown}\n data-testid={ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR_TIMEWHEEL}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled}\n getOwnerProps={getProps}\n >\n <DatePicker />\n </StyledIconTriggerButton>\n ),\n [\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n disabled,\n getProps,\n handlePickerIconKeyDown,\n handleSetTriggerRef,\n handleToggleCalendarWithTimeWheel,\n tabIndex,\n ],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACwCf;AAxCR,SAAgB,YAAY,eAAe;AAC3C,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB;AAC3B,SAAS,oCAAoC;AAC7C,SAAS,+BAA+B;AACxC,SAAS,uCAAuC;AAChD,SAAS,0CAA0C;AAK5C,MAAM,mCAAmC,MAAmB;AACjE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,4BAA4B;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,SAAS;AAAA,EACpB,IAAI,WAAW,+BAA+B;AAC9C,SAAO;AAAA,IACL,MACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,0CAA0C,yBAAyB;AAAA,QAC/E,YAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAM,aAAa;AAAA,QACnB,UAAU;AAAA,QACV;AAAA,QACA,SAAS;AAAA,QACT,WAAW;AAAA,QACX,eAAa,mCAAmC,aAAa;AAAA,QAC7D;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QAEf,8BAAC,cAAW;AAAA;AAAA,IACd;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js CHANGED
@@ -7,7 +7,7 @@ import { TimeWheelContext } from "../TimeWheel/TimeWheelContext.js";
7
7
  const useConfigCalendarWithTimeWheelCTX = () => {
8
8
  const {
9
9
  pickerButtonRef,
10
- props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled, readOnly },
10
+ props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled },
11
11
  withAnyInputs,
12
12
  isWithTimeInputs,
13
13
  ariaCurrentValueForInputs,
@@ -18,7 +18,6 @@ const useConfigCalendarWithTimeWheelCTX = () => {
18
18
  latestInteractionRegion,
19
19
  currFocusDescriber
20
20
  } = useContext(ControlledDateTimePickerContext);
21
- const shouldPreventValueChanges = disabled || applyAriaDisabled || readOnly;
22
21
  const { handleToggleCalendar } = useContext(CalendarContext);
23
22
  const { handleToggleTimePicker } = useContext(TimeWheelContext);
24
23
  const [showCalendarWithTimeWheel, setShowCalendarWithTimeWheel] = useState(false);
@@ -40,12 +39,12 @@ const useConfigCalendarWithTimeWheelCTX = () => {
40
39
  );
41
40
  const [referenceElement, setReferenceElement] = useState(null);
42
41
  const openCalendar = useCallback(() => {
43
- if (shouldPreventValueChanges) return;
42
+ if (disabled) return;
44
43
  setShowCalendarWithTimeWheel(true);
45
44
  onPickerOpen();
46
45
  setTimeout(() => handleToggleCalendar());
47
46
  setTimeout(() => handleToggleTimePicker());
48
- }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, shouldPreventValueChanges]);
47
+ }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, disabled]);
49
48
  const closeCalendar = useCallback(() => {
50
49
  setShowCalendarWithTimeWheel(false);
51
50
  onPickerClose();
package/dist/esm/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useState, useCallback, useContext } from 'react';\nimport { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../../ControlledDateTimePickerTypes.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from '../Calendar/CalendarContext.js';\nimport { TimeWheelContext } from '../TimeWheel/TimeWheelContext.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../../sharedTypes.js';\nexport interface CalendarWithTimeWheelContextT {\n referenceElement: HTMLButtonElement | null;\n ariaCurrentValueForInputs: string;\n showCalendarWithTimeWheel: boolean;\n closeCalendar: () => void;\n handleToggleCalendarWithTimeWheel: (\n e: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>,\n ) => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n handlePickerIconKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n isControllerOnly: boolean;\n disabled: boolean;\n applyAriaDisabled?: boolean;\n}\nexport const useConfigCalendarWithTimeWheelCTX = (): CalendarWithTimeWheelContextT => {\n const {\n pickerButtonRef,\n props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled, readOnly },\n withAnyInputs,\n isWithTimeInputs,\n ariaCurrentValueForInputs,\n trackFocusFirstSegment,\n trackFocusMeridiemInput,\n trackFocusYearInput,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const shouldPreventValueChanges = disabled || applyAriaDisabled || readOnly;\n const { handleToggleCalendar } = useContext(CalendarContext);\n const { handleToggleTimePicker } = useContext(TimeWheelContext);\n const [showCalendarWithTimeWheel, setShowCalendarWithTimeWheel] = useState(false);\n const onHomeKeyDown = useCallback(() => {\n trackFocusFirstSegment();\n }, [trackFocusFirstSegment]);\n const handlePickerIconKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown<HTMLButtonElement> = useCallback(\n (e) => {\n const { key } = e;\n if (['Home', 'End'].includes(key)) e.preventDefault();\n if (['Home', 'End'].includes(key)) e.stopPropagation();\n if (key === 'Home') onHomeKeyDown();\n if (key === 'Backspace' && withAnyInputs) {\n if (isWithTimeInputs) trackFocusMeridiemInput();\n else trackFocusYearInput();\n }\n },\n [isWithTimeInputs, onHomeKeyDown, trackFocusMeridiemInput, trackFocusYearInput, withAnyInputs],\n );\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const openCalendar = useCallback(() => {\n if (shouldPreventValueChanges) return;\n setShowCalendarWithTimeWheel(true);\n onPickerOpen();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, shouldPreventValueChanges]);\n const closeCalendar = useCallback(() => {\n setShowCalendarWithTimeWheel(false);\n onPickerClose();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerClose]);\n\n const handleToggleCalendarWithTimeWheel = useCallback(() => {\n if (!showCalendarWithTimeWheel) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendarWithTimeWheel]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'datetime-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n const isControllerOnly = useMemo(() => type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.CONTROLLER_ONLY, [type]);\n\n return useMemo(\n () => ({\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n }),\n [\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n ],\n );\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable max-lines */\nimport type React from 'react';\nimport { useMemo, useState, useCallback, useContext } from 'react';\nimport { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../../ControlledDateTimePickerTypes.js';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\nimport { CalendarContext } from '../Calendar/CalendarContext.js';\nimport { TimeWheelContext } from '../TimeWheel/TimeWheelContext.js';\nimport type { DSControlledDateTimePickerInternalsT } from '../../../sharedTypes.js';\nexport interface CalendarWithTimeWheelContextT {\n referenceElement: HTMLButtonElement | null;\n ariaCurrentValueForInputs: string;\n showCalendarWithTimeWheel: boolean;\n closeCalendar: () => void;\n handleToggleCalendarWithTimeWheel: (\n e: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>,\n ) => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n handlePickerIconKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n isControllerOnly: boolean;\n disabled: boolean;\n applyAriaDisabled?: boolean;\n}\nexport const useConfigCalendarWithTimeWheelCTX = (): CalendarWithTimeWheelContextT => {\n const {\n pickerButtonRef,\n props: { type, onPickerOpen, onPickerClose, disabled, applyAriaDisabled },\n withAnyInputs,\n isWithTimeInputs,\n ariaCurrentValueForInputs,\n trackFocusFirstSegment,\n trackFocusMeridiemInput,\n trackFocusYearInput,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const { handleToggleCalendar } = useContext(CalendarContext);\n const { handleToggleTimePicker } = useContext(TimeWheelContext);\n const [showCalendarWithTimeWheel, setShowCalendarWithTimeWheel] = useState(false);\n const onHomeKeyDown = useCallback(() => {\n trackFocusFirstSegment();\n }, [trackFocusFirstSegment]);\n const handlePickerIconKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown<HTMLButtonElement> = useCallback(\n (e) => {\n const { key } = e;\n if (['Home', 'End'].includes(key)) e.preventDefault();\n if (['Home', 'End'].includes(key)) e.stopPropagation();\n if (key === 'Home') onHomeKeyDown();\n if (key === 'Backspace' && withAnyInputs) {\n if (isWithTimeInputs) trackFocusMeridiemInput();\n else trackFocusYearInput();\n }\n },\n [isWithTimeInputs, onHomeKeyDown, trackFocusMeridiemInput, trackFocusYearInput, withAnyInputs],\n );\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const openCalendar = useCallback(() => {\n if (disabled) return;\n setShowCalendarWithTimeWheel(true);\n onPickerOpen();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerOpen, disabled]);\n const closeCalendar = useCallback(() => {\n setShowCalendarWithTimeWheel(false);\n onPickerClose();\n setTimeout(() => handleToggleCalendar());\n setTimeout(() => handleToggleTimePicker());\n }, [handleToggleCalendar, handleToggleTimePicker, onPickerClose]);\n\n const handleToggleCalendarWithTimeWheel = useCallback(() => {\n if (!showCalendarWithTimeWheel) openCalendar();\n else closeCalendar();\n }, [closeCalendar, openCalendar, showCalendarWithTimeWheel]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'datetime-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeCalendar();\n trackFocusPicker();\n }\n },\n [closeCalendar, trackFocusPicker],\n );\n\n const isControllerOnly = useMemo(() => type === CONTROLLED_DATE_TIME_PICKER_TYPES.DATE_TIME.CONTROLLER_ONLY, [type]);\n\n return useMemo(\n () => ({\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n }),\n [\n referenceElement,\n showCalendarWithTimeWheel,\n closeCalendar,\n handleToggleCalendarWithTimeWheel,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n handlePickerIconKeyDown,\n isControllerOnly,\n disabled,\n applyAriaDisabled,\n ariaCurrentValueForInputs,\n ],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,SAAS,UAAU,aAAa,kBAAkB;AAC3D,SAAS,yCAAyC;AAClD,SAAS,uCAAuC;AAChD,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AAiB1B,MAAM,oCAAoC,MAAqC;AACpF,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,MAAM,cAAc,eAAe,UAAU,kBAAkB;AAAA,IACxE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,QAAM,EAAE,qBAAqB,IAAI,WAAW,eAAe;AAC3D,QAAM,EAAE,uBAAuB,IAAI,WAAW,gBAAgB;AAC9D,QAAM,CAAC,2BAA2B,4BAA4B,IAAI,SAAS,KAAK;AAChF,QAAM,gBAAgB,YAAY,MAAM;AACtC,2BAAuB;AAAA,EACzB,GAAG,CAAC,sBAAsB,CAAC;AAC3B,QAAM,0BAA6F;AAAA,IACjG,CAAC,MAAM;AACL,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,CAAC,QAAQ,KAAK,EAAE,SAAS,GAAG,EAAG,GAAE,eAAe;AACpD,UAAI,CAAC,QAAQ,KAAK,EAAE,SAAS,GAAG,EAAG,GAAE,gBAAgB;AACrD,UAAI,QAAQ,OAAQ,eAAc;AAClC,UAAI,QAAQ,eAAe,eAAe;AACxC,YAAI,iBAAkB,yBAAwB;AAAA,YACzC,qBAAoB;AAAA,MAC3B;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,eAAe,yBAAyB,qBAAqB,aAAa;AAAA,EAC/F;AACA,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAmC,IAAI;AACvF,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI,SAAU;AACd,iCAA6B,IAAI;AACjC,iBAAa;AACb,eAAW,MAAM,qBAAqB,CAAC;AACvC,eAAW,MAAM,uBAAuB,CAAC;AAAA,EAC3C,GAAG,CAAC,sBAAsB,wBAAwB,cAAc,QAAQ,CAAC;AACzE,QAAM,gBAAgB,YAAY,MAAM;AACtC,iCAA6B,KAAK;AAClC,kBAAc;AACd,eAAW,MAAM,qBAAqB,CAAC;AACvC,eAAW,MAAM,uBAAuB,CAAC;AAAA,EAC3C,GAAG,CAAC,sBAAsB,wBAAwB,aAAa,CAAC;AAEhE,QAAM,oCAAoC,YAAY,MAAM;AAC1D,QAAI,CAAC,0BAA2B,cAAa;AAAA,QACxC,eAAc;AAAA,EACrB,GAAG,CAAC,eAAe,cAAc,yBAAyB,CAAC;AAE3D,QAAM,sBAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAC1B,UAAI,4BAA4B,iBAAiB,uBAAuB,uBAAwB,SAAQ,MAAM;AAAA,IAChH;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,2BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,sBAAc;AACd,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,eAAe,gBAAgB;AAAA,EAClC;AAEA,QAAM,mBAAmB,QAAQ,MAAM,SAAS,kCAAkC,UAAU,iBAAiB,CAAC,IAAI,CAAC;AAEnH,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/Pickers/TimeWheel/usePopperTriggerLogic.js CHANGED
@@ -4,7 +4,7 @@ import { ControlledDateTimePickerContext } from "../../../ControlledDateTimePick
4
4
  const usePopperTriggerLogic = () => {
5
5
  const {
6
6
  pickerButtonRef,
7
- props: { onPickerClose, onPickerOpen, applyAriaDisabled, readOnly, disabled },
7
+ props: { onPickerClose, onPickerOpen, disabled },
8
8
  isWithCalendarToo,
9
9
  trackFocusTimewheelCurrHour,
10
10
  trackFocusPicker,
@@ -18,7 +18,7 @@ const usePopperTriggerLogic = () => {
18
18
  onPickerClose();
19
19
  }, [onPickerClose]);
20
20
  const handleToggleTimePicker = useCallback(() => {
21
- if (readOnly || applyAriaDisabled || disabled) return;
21
+ if (disabled) return;
22
22
  setShowTimePicker((oldShowCalendar) => {
23
23
  if (!oldShowCalendar) {
24
24
  onPickerOpen();
@@ -26,15 +26,7 @@ const usePopperTriggerLogic = () => {
26
26
  } else onPickerClose();
27
27
  return !oldShowCalendar;
28
28
  });
29
- }, [
30
- applyAriaDisabled,
31
- disabled,
32
- isWithCalendarToo,
33
- onPickerClose,
34
- onPickerOpen,
35
- readOnly,
36
- trackFocusTimewheelCurrHour
37
- ]);
29
+ }, [disabled, isWithCalendarToo, onPickerClose, onPickerOpen, trackFocusTimewheelCurrHour]);
38
30
  const handleSetTriggerRef = useCallback(
39
31
  (newRef) => {
40
32
  pickerButtonRef.current = newRef;
package/dist/esm/parts/Pickers/TimeWheel/usePopperTriggerLogic.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Pickers/TimeWheel/usePopperTriggerLogic.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useState, useCallback, useMemo, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\n\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n showTimePicker: boolean;\n closeTimePicker: () => void;\n setShowTimePicker: TypescriptHelpersT.StateSetter<boolean>;\n handleToggleTimePicker: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = (): PopperTriggerLogicT => {\n const {\n pickerButtonRef,\n props: { onPickerClose, onPickerOpen, applyAriaDisabled, readOnly, disabled },\n isWithCalendarToo,\n trackFocusTimewheelCurrHour,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [showTimePicker, setShowTimePicker] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const closeTimePicker = useCallback(() => {\n setShowTimePicker(false);\n onPickerClose();\n }, [onPickerClose]);\n const handleToggleTimePicker = useCallback(() => {\n if (readOnly || applyAriaDisabled || disabled) return;\n setShowTimePicker((oldShowCalendar) => {\n if (!oldShowCalendar) {\n onPickerOpen();\n if (!isWithCalendarToo) trackFocusTimewheelCurrHour();\n } else onPickerClose();\n return !oldShowCalendar;\n });\n }, [\n applyAriaDisabled,\n disabled,\n isWithCalendarToo,\n onPickerClose,\n onPickerOpen,\n readOnly,\n trackFocusTimewheelCurrHour,\n ]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'time-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeTimePicker();\n trackFocusPicker();\n }\n },\n [closeTimePicker, trackFocusPicker],\n );\n return useMemo(\n () => ({\n referenceElement,\n showTimePicker,\n setShowTimePicker,\n handleToggleTimePicker,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n closeTimePicker,\n }),\n [\n closeTimePicker,\n handleMenuWrapperKeyDown,\n handleSetTriggerRef,\n handleToggleTimePicker,\n referenceElement,\n showTimePicker,\n ],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,UAAU,aAAa,SAAS,kBAAkB;AAE3D,SAAS,uCAAuC;AAWzC,MAAM,wBAAwB,MAA2B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,eAAe,cAAc,mBAAmB,UAAU,SAAS;AAAA,IAC5E;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAmC,IAAI;AACvF,QAAM,kBAAkB,YAAY,MAAM;AACxC,sBAAkB,KAAK;AACvB,kBAAc;AAAA,EAChB,GAAG,CAAC,aAAa,CAAC;AAClB,QAAM,yBAAyB,YAAY,MAAM;AAC/C,QAAI,YAAY,qBAAqB,SAAU;AAC/C,sBAAkB,CAAC,oBAAoB;AACrC,UAAI,CAAC,iBAAiB;AACpB,qBAAa;AACb,YAAI,CAAC,kBAAmB,6BAA4B;AAAA,MACtD,MAAO,eAAc;AACrB,aAAO,CAAC;AAAA,IACV,CAAC;AAAA,EACH,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,sBAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAE1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,2BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,wBAAgB;AAChB,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,gBAAgB;AAAA,EACpC;AACA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useState, useCallback, useMemo, useContext } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ControlledDateTimePickerContext } from '../../../ControlledDateTimePickerCTX.js';\n\ninterface PopperTriggerLogicT {\n referenceElement: HTMLButtonElement | null;\n showTimePicker: boolean;\n closeTimePicker: () => void;\n setShowTimePicker: TypescriptHelpersT.StateSetter<boolean>;\n handleToggleTimePicker: () => void;\n handleSetTriggerRef: (instance: HTMLButtonElement) => void;\n handleMenuWrapperKeyDown: (e: React.KeyboardEvent<HTMLElement>) => void;\n}\nexport const usePopperTriggerLogic = (): PopperTriggerLogicT => {\n const {\n pickerButtonRef,\n props: { onPickerClose, onPickerOpen, disabled },\n isWithCalendarToo,\n trackFocusTimewheelCurrHour,\n trackFocusPicker,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n const [showTimePicker, setShowTimePicker] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(null);\n const closeTimePicker = useCallback(() => {\n setShowTimePicker(false);\n onPickerClose();\n }, [onPickerClose]);\n const handleToggleTimePicker = useCallback(() => {\n if (disabled) return;\n setShowTimePicker((oldShowCalendar) => {\n if (!oldShowCalendar) {\n onPickerOpen();\n if (!isWithCalendarToo) trackFocusTimewheelCurrHour();\n } else onPickerClose();\n return !oldShowCalendar;\n });\n }, [disabled, isWithCalendarToo, onPickerClose, onPickerOpen, trackFocusTimewheelCurrHour]);\n\n const handleSetTriggerRef = useCallback(\n (newRef: HTMLButtonElement) => {\n pickerButtonRef.current = newRef;\n setReferenceElement(newRef);\n\n if (latestInteractionRegion === 'picker-icon' && currFocusDescriber === 'time-picker-icon') newRef?.focus();\n },\n [currFocusDescriber, latestInteractionRegion, pickerButtonRef],\n );\n const handleMenuWrapperKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n const { key } = e;\n if (key === 'Escape') {\n closeTimePicker();\n trackFocusPicker();\n }\n },\n [closeTimePicker, trackFocusPicker],\n );\n return useMemo(\n () => ({\n referenceElement,\n showTimePicker,\n setShowTimePicker,\n handleToggleTimePicker,\n handleSetTriggerRef,\n handleMenuWrapperKeyDown,\n closeTimePicker,\n }),\n [\n closeTimePicker,\n handleMenuWrapperKeyDown,\n handleSetTriggerRef,\n handleToggleTimePicker,\n referenceElement,\n showTimePicker,\n ],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,UAAU,aAAa,SAAS,kBAAkB;AAE3D,SAAS,uCAAuC;AAWzC,MAAM,wBAAwB,MAA2B;AAC9D,QAAM;AAAA,IACJ;AAAA,IACA,OAAO,EAAE,eAAe,cAAc,SAAS;AAAA,IAC/C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,+BAA+B;AAC9C,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,SAAS,KAAK;AAC1D,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAAmC,IAAI;AACvF,QAAM,kBAAkB,YAAY,MAAM;AACxC,sBAAkB,KAAK;AACvB,kBAAc;AAAA,EAChB,GAAG,CAAC,aAAa,CAAC;AAClB,QAAM,yBAAyB,YAAY,MAAM;AAC/C,QAAI,SAAU;AACd,sBAAkB,CAAC,oBAAoB;AACrC,UAAI,CAAC,iBAAiB;AACpB,qBAAa;AACb,YAAI,CAAC,kBAAmB,6BAA4B;AAAA,MACtD,MAAO,eAAc;AACrB,aAAO,CAAC;AAAA,IACV,CAAC;AAAA,EACH,GAAG,CAAC,UAAU,mBAAmB,eAAe,cAAc,2BAA2B,CAAC;AAE1F,QAAM,sBAAsB;AAAA,IAC1B,CAAC,WAA8B;AAC7B,sBAAgB,UAAU;AAC1B,0BAAoB,MAAM;AAE1B,UAAI,4BAA4B,iBAAiB,uBAAuB,mBAAoB,SAAQ,MAAM;AAAA,IAC5G;AAAA,IACA,CAAC,oBAAoB,yBAAyB,eAAe;AAAA,EAC/D;AACA,QAAM,2BAA2B;AAAA,IAC/B,CAAC,MAAwC;AACvC,YAAM,EAAE,IAAI,IAAI;AAChB,UAAI,QAAQ,UAAU;AACpB,wBAAgB;AAChB,yBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,gBAAgB;AAAA,EACpC;AACA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/types/ControlledDateTimePickerDefinitions.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- export declare const DSControlledDateTimePickerName = "DSControlledDateTimePicker";
1
+ export declare const DSControlledDateTimePickerName = "DSControlleddatetimepicker";
2
2
  export declare const DSControlledDateTimePickerSlotsFlatten: {
3
3
  readonly CONTAINER: "root";
4
4
  readonly INPUT: "field-input";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-form-date-time-picker",
3
- "version": "3.51.0-rc.9",
3
+ "version": "3.51.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Date Time Picker",
6
6
  "files": [
@@ -36,25 +36,25 @@
36
36
  "indent": 4
37
37
  },
38
38
  "dependencies": {
39
- "@elliemae/ds-accessibility": "3.51.0-rc.9",
40
- "@elliemae/ds-grid": "3.51.0-rc.9",
41
- "@elliemae/ds-popperjs": "3.51.0-rc.9",
42
- "@elliemae/ds-props-helpers": "3.51.0-rc.9",
43
- "@elliemae/ds-button-v2": "3.51.0-rc.9",
44
- "@elliemae/ds-icons": "3.51.0-rc.9",
45
- "@elliemae/ds-system": "3.51.0-rc.9",
46
- "@elliemae/ds-typescript-helpers": "3.51.0-rc.9"
39
+ "@elliemae/ds-accessibility": "3.51.1",
40
+ "@elliemae/ds-button-v2": "3.51.1",
41
+ "@elliemae/ds-grid": "3.51.1",
42
+ "@elliemae/ds-popperjs": "3.51.1",
43
+ "@elliemae/ds-props-helpers": "3.51.1",
44
+ "@elliemae/ds-system": "3.51.1",
45
+ "@elliemae/ds-typescript-helpers": "3.51.1",
46
+ "@elliemae/ds-icons": "3.51.1"
47
47
  },
48
48
  "devDependencies": {
49
49
  "@elliemae/pui-cli": "9.0.0-next.55",
50
- "@elliemae/pui-theme": "~2.10.0",
50
+ "@elliemae/pui-theme": "~2.11.0",
51
51
  "jest": "~29.7.0",
52
52
  "styled-components": "~5.3.9",
53
53
  "styled-system": "^5.1.5",
54
- "@elliemae/ds-monorepo-devops": "3.51.0-rc.9"
54
+ "@elliemae/ds-monorepo-devops": "3.51.1"
55
55
  },
56
56
  "peerDependencies": {
57
- "@elliemae/pui-theme": "~2.10.0",
57
+ "@elliemae/pui-theme": "~2.11.0",
58
58
  "react": "^18.3.1",
59
59
  "react-dom": "^18.3.1",
60
60
  "styled-components": "~5.3.9",