@elliemae/ds-form-date-time-picker 3.12.0-rc.2 → 3.12.0-rc.20
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.
- package/dist/cjs/ControlledDateTimePicker.js +1 -4
- package/dist/cjs/ControlledDateTimePicker.js.map +1 -1
- package/dist/cjs/config/useGlobalKeyHandlers.js +11 -4
- package/dist/cjs/config/useGlobalKeyHandlers.js.map +2 -2
- package/dist/cjs/parts/ClearButton/ClearButton.js +19 -18
- package/dist/cjs/parts/ClearButton/ClearButton.js.map +1 -1
- package/dist/cjs/parts/ControlledDateTimePickerContent.js +9 -11
- package/dist/cjs/parts/ControlledDateTimePickerContent.js.map +1 -1
- package/dist/cjs/parts/DateInputs/DDInput.js +20 -17
- package/dist/cjs/parts/DateInputs/DDInput.js.map +1 -1
- package/dist/cjs/parts/DateInputs/DateInputs.js +63 -63
- package/dist/cjs/parts/DateInputs/DateInputs.js.map +1 -1
- package/dist/cjs/parts/DateInputs/MMInput.js +17 -14
- package/dist/cjs/parts/DateInputs/MMInput.js.map +1 -1
- package/dist/cjs/parts/DateInputs/YYYYInput.js +20 -17
- package/dist/cjs/parts/DateInputs/YYYYInput.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/Calendar.js +6 -18
- package/dist/cjs/parts/Pickers/Calendar/Calendar.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarBody.js +4 -11
- package/dist/cjs/parts/Pickers/Calendar/CalendarBody.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarContent.js +10 -11
- package/dist/cjs/parts/Pickers/Calendar/CalendarContent.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarDaysList.js +11 -20
- package/dist/cjs/parts/Pickers/Calendar/CalendarDaysList.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarFooter.js +1 -5
- package/dist/cjs/parts/Pickers/Calendar/CalendarFooter.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarHead.js +27 -36
- package/dist/cjs/parts/Pickers/Calendar/CalendarHead.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarIconTrigger.js +15 -12
- package/dist/cjs/parts/Pickers/Calendar/CalendarIconTrigger.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarMonthDays.js +9 -6
- package/dist/cjs/parts/Pickers/Calendar/CalendarMonthDays.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarWeekDays.js +12 -40
- package/dist/cjs/parts/Pickers/Calendar/CalendarWeekDays.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/CalendarWrapper.js +11 -8
- package/dist/cjs/parts/Pickers/Calendar/CalendarWrapper.js.map +1 -1
- package/dist/cjs/parts/Pickers/Calendar/Day.js +30 -24
- package/dist/cjs/parts/Pickers/Calendar/Day.js.map +1 -1
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheel.js +5 -17
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheel.js.map +1 -1
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContent.js +12 -9
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContent.js.map +1 -1
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelFooter.js +8 -5
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelFooter.js.map +1 -1
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +15 -12
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js.map +1 -1
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelWrapper.js +11 -8
- package/dist/cjs/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelWrapper.js.map +1 -1
- package/dist/cjs/parts/Pickers/PickersIcons.js +5 -9
- package/dist/cjs/parts/Pickers/PickersIcons.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/HoursList.js +68 -72
- package/dist/cjs/parts/Pickers/TimeWheel/HoursList.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/MeridiemList.js +82 -86
- package/dist/cjs/parts/Pickers/TimeWheel/MeridiemList.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/MinutesList.js +73 -70
- package/dist/cjs/parts/Pickers/TimeWheel/MinutesList.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheel.js +6 -18
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheel.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelContent.js +18 -28
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelContent.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelFooter.js +1 -5
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelFooter.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +15 -12
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelWrapper.js +11 -8
- package/dist/cjs/parts/Pickers/TimeWheel/TimeWheelWrapper.js.map +1 -1
- package/dist/cjs/parts/Pickers/TimeWheel/useKeyboardHandlers.js +7 -2
- package/dist/cjs/parts/Pickers/TimeWheel/useKeyboardHandlers.js.map +2 -2
- package/dist/cjs/parts/Styleds.js +2 -1
- package/dist/cjs/parts/Styleds.js.map +2 -2
- package/dist/cjs/parts/TimeInputs/HHInput.js +21 -18
- package/dist/cjs/parts/TimeInputs/HHInput.js.map +1 -1
- package/dist/cjs/parts/TimeInputs/MeridiemInput.js +20 -17
- package/dist/cjs/parts/TimeInputs/MeridiemInput.js.map +1 -1
- package/dist/cjs/parts/TimeInputs/MinutesInput.js +20 -17
- package/dist/cjs/parts/TimeInputs/MinutesInput.js.map +1 -1
- package/dist/cjs/parts/TimeInputs/TimeInputs.js +62 -61
- package/dist/cjs/parts/TimeInputs/TimeInputs.js.map +1 -1
- package/dist/esm/ControlledDateTimePicker.js +1 -4
- package/dist/esm/ControlledDateTimePicker.js.map +1 -1
- package/dist/esm/config/useGlobalKeyHandlers.js +11 -4
- package/dist/esm/config/useGlobalKeyHandlers.js.map +2 -2
- package/dist/esm/parts/ClearButton/ClearButton.js +19 -18
- package/dist/esm/parts/ClearButton/ClearButton.js.map +1 -1
- package/dist/esm/parts/ControlledDateTimePickerContent.js +9 -11
- package/dist/esm/parts/ControlledDateTimePickerContent.js.map +1 -1
- package/dist/esm/parts/DateInputs/DDInput.js +20 -17
- package/dist/esm/parts/DateInputs/DDInput.js.map +1 -1
- package/dist/esm/parts/DateInputs/DateInputs.js +63 -63
- package/dist/esm/parts/DateInputs/DateInputs.js.map +1 -1
- package/dist/esm/parts/DateInputs/MMInput.js +17 -14
- package/dist/esm/parts/DateInputs/MMInput.js.map +1 -1
- package/dist/esm/parts/DateInputs/YYYYInput.js +20 -17
- package/dist/esm/parts/DateInputs/YYYYInput.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/Calendar.js +6 -18
- package/dist/esm/parts/Pickers/Calendar/Calendar.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarBody.js +4 -11
- package/dist/esm/parts/Pickers/Calendar/CalendarBody.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarContent.js +10 -11
- package/dist/esm/parts/Pickers/Calendar/CalendarContent.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarDaysList.js +11 -20
- package/dist/esm/parts/Pickers/Calendar/CalendarDaysList.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarFooter.js +1 -5
- package/dist/esm/parts/Pickers/Calendar/CalendarFooter.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarHead.js +27 -36
- package/dist/esm/parts/Pickers/Calendar/CalendarHead.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarIconTrigger.js +15 -12
- package/dist/esm/parts/Pickers/Calendar/CalendarIconTrigger.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarMonthDays.js +9 -6
- package/dist/esm/parts/Pickers/Calendar/CalendarMonthDays.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarWeekDays.js +12 -40
- package/dist/esm/parts/Pickers/Calendar/CalendarWeekDays.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/CalendarWrapper.js +11 -8
- package/dist/esm/parts/Pickers/Calendar/CalendarWrapper.js.map +1 -1
- package/dist/esm/parts/Pickers/Calendar/Day.js +30 -24
- package/dist/esm/parts/Pickers/Calendar/Day.js.map +1 -1
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheel.js +5 -17
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheel.js.map +1 -1
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContent.js +12 -9
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContent.js.map +1 -1
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelFooter.js +8 -5
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelFooter.js.map +1 -1
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +15 -12
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js.map +1 -1
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelWrapper.js +11 -8
- package/dist/esm/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelWrapper.js.map +1 -1
- package/dist/esm/parts/Pickers/PickersIcons.js +5 -9
- package/dist/esm/parts/Pickers/PickersIcons.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/HoursList.js +68 -72
- package/dist/esm/parts/Pickers/TimeWheel/HoursList.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/MeridiemList.js +82 -86
- package/dist/esm/parts/Pickers/TimeWheel/MeridiemList.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/MinutesList.js +73 -70
- package/dist/esm/parts/Pickers/TimeWheel/MinutesList.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheel.js +6 -18
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheel.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelContent.js +18 -28
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelContent.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelFooter.js +1 -5
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelFooter.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +15 -12
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelWrapper.js +11 -8
- package/dist/esm/parts/Pickers/TimeWheel/TimeWheelWrapper.js.map +1 -1
- package/dist/esm/parts/Pickers/TimeWheel/useKeyboardHandlers.js +7 -2
- package/dist/esm/parts/Pickers/TimeWheel/useKeyboardHandlers.js.map +2 -2
- package/dist/esm/parts/Styleds.js +2 -1
- package/dist/esm/parts/Styleds.js.map +2 -2
- package/dist/esm/parts/TimeInputs/HHInput.js +21 -18
- package/dist/esm/parts/TimeInputs/HHInput.js.map +1 -1
- package/dist/esm/parts/TimeInputs/MeridiemInput.js +20 -17
- package/dist/esm/parts/TimeInputs/MeridiemInput.js.map +1 -1
- package/dist/esm/parts/TimeInputs/MinutesInput.js +20 -17
- package/dist/esm/parts/TimeInputs/MinutesInput.js.map +1 -1
- package/dist/esm/parts/TimeInputs/TimeInputs.js +62 -61
- package/dist/esm/parts/TimeInputs/TimeInputs.js.map +1 -1
- package/package.json +8 -8
|
@@ -38,10 +38,7 @@ var import_ControlledDateTimePickerContent = require("./parts/ControlledDateTime
|
|
|
38
38
|
var import_ControlledDateTimePickerCTX = require("./ControlledDateTimePickerCTX");
|
|
39
39
|
const DSControlledDateTimePicker = (props) => {
|
|
40
40
|
const ctx = (0, import_useControlledDateTimePicker.useControlledDateTimePicker)(props);
|
|
41
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext.Provider, {
|
|
42
|
-
value: ctx,
|
|
43
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledDateTimePickerContent.ControlledDateTimePickerContent, {})
|
|
44
|
-
});
|
|
41
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledDateTimePickerContent.ControlledDateTimePickerContent, {}) });
|
|
45
42
|
};
|
|
46
43
|
DSControlledDateTimePicker.displayName = import_theming.DSControlledDateTimePickerName;
|
|
47
44
|
const DSControlledDateTimePickerWithSchema = (0, import_ds_utilities.describe)(DSControlledDateTimePicker);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ControlledDateTimePicker.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { DSControlledDateTimePickerName } from './exported-related/theming';\nimport { propTypes } from './propTypes';\nimport { useControlledDateTimePicker } from './config/useControlledDateTimePicker';\nimport { ControlledDateTimePickerContent } from './parts/ControlledDateTimePickerContent';\nimport { ControlledDateTimePickerContext } from './ControlledDateTimePickerCTX';\nimport type { DSControlledDateTimePickerT } from './propTypes';\n\nconst DSControlledDateTimePicker = (props: DSControlledDateTimePickerT.Props): JSX.Element => {\n const ctx = useControlledDateTimePicker(props);\n return (\n <ControlledDateTimePickerContext.Provider value={ctx}>\n <ControlledDateTimePickerContent />\n </ControlledDateTimePickerContext.Provider>\n );\n};\n\nDSControlledDateTimePicker.displayName = DSControlledDateTimePickerName;\nconst DSControlledDateTimePickerWithSchema = describe(DSControlledDateTimePicker);\nDSControlledDateTimePickerWithSchema.propTypes = propTypes;\n\nexport { DSControlledDateTimePickerWithSchema, DSControlledDateTimePicker };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcjB;AAZN,0BAAyB;AACzB,qBAA+C;AAC/C,uBAA0B;AAC1B,yCAA4C;AAC5C,6CAAgD;AAChD,yCAAgD;AAGhD,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,QAAM,UAAM,gEAA4B,KAAK;AAC7C,SACE,4CAAC,mEAAgC,UAAhC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcjB;AAZN,0BAAyB;AACzB,qBAA+C;AAC/C,uBAA0B;AAC1B,yCAA4C;AAC5C,6CAAgD;AAChD,yCAAgD;AAGhD,MAAM,6BAA6B,CAAC,UAA0D;AAC5F,QAAM,UAAM,gEAA4B,KAAK;AAC7C,SACE,4CAAC,mEAAgC,UAAhC,EAAyC,OAAO,KAC/C,sDAAC,0EAAgC,GACnC;AAEJ;AAEA,2BAA2B,cAAc;AACzC,MAAM,2CAAuC,8BAAS,0BAA0B;AAChF,qCAAqC,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -32,7 +32,7 @@ var import_react = require("react");
|
|
|
32
32
|
var import_dateHelpers = require("../utils/dateHelpers");
|
|
33
33
|
var import_timeHelpers = require("../utils/timeHelpers");
|
|
34
34
|
var import_stringHelpers = require("../utils/stringHelpers");
|
|
35
|
-
const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers }) => {
|
|
35
|
+
const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers, flags }) => {
|
|
36
36
|
const {
|
|
37
37
|
getIsOutOfRangeDay,
|
|
38
38
|
getIsDisabledDay,
|
|
@@ -45,7 +45,8 @@ const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers
|
|
|
45
45
|
appOnMeridiemChange
|
|
46
46
|
} = propsBasedOnType;
|
|
47
47
|
const { handleChangeComposedDateTimeString, handleClearAll } = changeHandlers;
|
|
48
|
-
const { trackFocusLastSegment } = focusTrackers;
|
|
48
|
+
const { trackFocusLastSegment, trackFocusClearBtn } = focusTrackers;
|
|
49
|
+
const { withAnyPicker, shouldPreserveClearableSpace } = flags;
|
|
49
50
|
const onFillWithCurrentDateKeys = (0, import_react.useCallback)(
|
|
50
51
|
(e, metaInfo = { isAutomaticFillTrigger: true }) => {
|
|
51
52
|
const now = new Date();
|
|
@@ -66,7 +67,10 @@ const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers
|
|
|
66
67
|
appOnMinuteChange(minutes, e, metaInfo);
|
|
67
68
|
appOnMeridiemChange(meridiem, e, metaInfo);
|
|
68
69
|
handleChangeComposedDateTimeString(nowDateString, nowTimeString, finalMetaInfo);
|
|
69
|
-
|
|
70
|
+
if (shouldPreserveClearableSpace && !withAnyPicker)
|
|
71
|
+
trackFocusClearBtn();
|
|
72
|
+
else
|
|
73
|
+
trackFocusLastSegment();
|
|
70
74
|
},
|
|
71
75
|
[
|
|
72
76
|
appOnDayChange,
|
|
@@ -79,7 +83,10 @@ const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers
|
|
|
79
83
|
getIsDisabledTime,
|
|
80
84
|
getIsOutOfRangeDay,
|
|
81
85
|
handleChangeComposedDateTimeString,
|
|
82
|
-
|
|
86
|
+
shouldPreserveClearableSpace,
|
|
87
|
+
trackFocusClearBtn,
|
|
88
|
+
trackFocusLastSegment,
|
|
89
|
+
withAnyPicker
|
|
83
90
|
]
|
|
84
91
|
);
|
|
85
92
|
const onGlobalKeyDown = (0, import_react.useCallback)(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/useGlobalKeyHandlers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable no-nested-ternary */\n/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useCallback, useMemo } from 'react';\nimport type { useChangeHandlers } from './useChangeHandlers';\nimport type { useGetPropsBasedOnType } from './useGetPropsBasedOnType';\nimport type { useGetReferences } from './useGetReferences';\nimport type { useGetFlags } from './useGetFlags';\nimport type { useFocusTracker } from './useFocusTracker';\nimport { getValidationDateStringMetaInfo, getDateStringFromDay, getTimeStringFromDay } from '../utils/dateHelpers';\nimport { getValidationTimeStringMetaInfo } from '../utils/timeHelpers';\nimport { deconstructValuesFromDateString, deconstructValuesFromTimeString } from '../utils/stringHelpers';\nimport type { DSControlledDateTimePickerT } from '../propTypes';\n\ninterface Config {\n propsBasedOnType: ReturnType<typeof useGetPropsBasedOnType>;\n changeHandlers: ReturnType<typeof useChangeHandlers>;\n DOMRefs: ReturnType<typeof useGetReferences>;\n flags: ReturnType<typeof useGetFlags>;\n focusTrackers: ReturnType<typeof useFocusTracker>;\n}\n\nexport const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers }: Config) => {\n const {\n getIsOutOfRangeDay,\n getIsDisabledDay,\n getIsDisabledTime,\n appOnMonthChange,\n appOnDayChange,\n appOnYearChange,\n appOnHourChange,\n appOnMinuteChange,\n appOnMeridiemChange,\n } = propsBasedOnType;\n const { handleChangeComposedDateTimeString, handleClearAll } = changeHandlers;\n const { trackFocusLastSegment } = focusTrackers;\n\n const onFillWithCurrentDateKeys = useCallback(\n (\n e: React.KeyboardEvent<HTMLInputElement | HTMLButtonElement>,\n metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = { isAutomaticFillTrigger: true },\n ) => {\n const now = new Date();\n const nowDateString = getDateStringFromDay(now);\n const nowTimeString = getTimeStringFromDay(now);\n const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n ...metaInfo,\n ...getValidationDateStringMetaInfo(nowDateString, getIsOutOfRangeDay, getIsDisabledDay),\n ...getValidationTimeStringMetaInfo(nowTimeString, getIsDisabledTime),\n newDateString: nowDateString,\n };\n const { month, day, year } = deconstructValuesFromDateString(nowDateString);\n appOnMonthChange(month, e, metaInfo);\n appOnDayChange(day, e, metaInfo);\n appOnYearChange(year, e, metaInfo);\n const { hours, minutes, meridiem } = deconstructValuesFromTimeString(nowTimeString);\n appOnHourChange(hours, e, metaInfo);\n appOnMinuteChange(minutes, e, metaInfo);\n appOnMeridiemChange(meridiem, e, metaInfo);\n handleChangeComposedDateTimeString(nowDateString, nowTimeString, finalMetaInfo);\n trackFocusLastSegment();\n },\n [\n appOnDayChange,\n appOnHourChange,\n appOnMeridiemChange,\n appOnMinuteChange,\n appOnMonthChange,\n appOnYearChange,\n getIsDisabledDay,\n getIsDisabledTime,\n getIsOutOfRangeDay,\n handleChangeComposedDateTimeString,\n trackFocusLastSegment,\n ],\n );\n\n const onGlobalKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement | HTMLButtonElement>) => {\n const { key, ctrlKey, metaKey } = e;\n if ((ctrlKey || metaKey) && key === ';') {\n onFillWithCurrentDateKeys(e);\n }\n if ((ctrlKey || metaKey) && (key === 'Delete' || key === 'Backspace')) handleClearAll(e);\n },\n [handleClearAll, onFillWithCurrentDateKeys],\n );\n\n return useMemo(\n () => ({\n onFillWithCurrentDateKeys,\n onGlobalKeyDown,\n }),\n [onFillWithCurrentDateKeys, onGlobalKeyDown],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,mBAAqC;AAMrC,yBAA4F;AAC5F,yBAAgD;AAChD,2BAAiF;AAW1E,MAAM,uBAAuB,CAAC,EAAE,kBAAkB,gBAAgB,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable no-nested-ternary */\n/* eslint-disable max-lines */\n/* eslint-disable import/prefer-default-export */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport { useCallback, useMemo } from 'react';\nimport type { useChangeHandlers } from './useChangeHandlers';\nimport type { useGetPropsBasedOnType } from './useGetPropsBasedOnType';\nimport type { useGetReferences } from './useGetReferences';\nimport type { useGetFlags } from './useGetFlags';\nimport type { useFocusTracker } from './useFocusTracker';\nimport { getValidationDateStringMetaInfo, getDateStringFromDay, getTimeStringFromDay } from '../utils/dateHelpers';\nimport { getValidationTimeStringMetaInfo } from '../utils/timeHelpers';\nimport { deconstructValuesFromDateString, deconstructValuesFromTimeString } from '../utils/stringHelpers';\nimport type { DSControlledDateTimePickerT } from '../propTypes';\n\ninterface Config {\n propsBasedOnType: ReturnType<typeof useGetPropsBasedOnType>;\n changeHandlers: ReturnType<typeof useChangeHandlers>;\n DOMRefs: ReturnType<typeof useGetReferences>;\n flags: ReturnType<typeof useGetFlags>;\n focusTrackers: ReturnType<typeof useFocusTracker>;\n}\n\nexport const useGlobalKeyHandlers = ({ propsBasedOnType, changeHandlers, focusTrackers, flags }: Config) => {\n const {\n getIsOutOfRangeDay,\n getIsDisabledDay,\n getIsDisabledTime,\n appOnMonthChange,\n appOnDayChange,\n appOnYearChange,\n appOnHourChange,\n appOnMinuteChange,\n appOnMeridiemChange,\n } = propsBasedOnType;\n const { handleChangeComposedDateTimeString, handleClearAll } = changeHandlers;\n const { trackFocusLastSegment, trackFocusClearBtn } = focusTrackers;\n const { withAnyPicker, shouldPreserveClearableSpace } = flags;\n\n const onFillWithCurrentDateKeys = useCallback(\n (\n e: React.KeyboardEvent<HTMLInputElement | HTMLButtonElement>,\n metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo> = { isAutomaticFillTrigger: true },\n ) => {\n const now = new Date();\n const nowDateString = getDateStringFromDay(now);\n const nowTimeString = getTimeStringFromDay(now);\n const finalMetaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo = {\n ...metaInfo,\n ...getValidationDateStringMetaInfo(nowDateString, getIsOutOfRangeDay, getIsDisabledDay),\n ...getValidationTimeStringMetaInfo(nowTimeString, getIsDisabledTime),\n newDateString: nowDateString,\n };\n const { month, day, year } = deconstructValuesFromDateString(nowDateString);\n appOnMonthChange(month, e, metaInfo);\n appOnDayChange(day, e, metaInfo);\n appOnYearChange(year, e, metaInfo);\n const { hours, minutes, meridiem } = deconstructValuesFromTimeString(nowTimeString);\n appOnHourChange(hours, e, metaInfo);\n appOnMinuteChange(minutes, e, metaInfo);\n appOnMeridiemChange(meridiem, e, metaInfo);\n handleChangeComposedDateTimeString(nowDateString, nowTimeString, finalMetaInfo);\n // trackFocusLastSegment is not enough here,\n // after this key combination the value may change from empty to non-empty\n // when non empty the last segment may become the clear-btn (clear btn only appears when non empty)\n // as such this must be micro-managed here\n if (shouldPreserveClearableSpace && !withAnyPicker) trackFocusClearBtn();\n else trackFocusLastSegment();\n },\n [\n appOnDayChange,\n appOnHourChange,\n appOnMeridiemChange,\n appOnMinuteChange,\n appOnMonthChange,\n appOnYearChange,\n getIsDisabledDay,\n getIsDisabledTime,\n getIsOutOfRangeDay,\n handleChangeComposedDateTimeString,\n shouldPreserveClearableSpace,\n trackFocusClearBtn,\n trackFocusLastSegment,\n withAnyPicker,\n ],\n );\n\n const onGlobalKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement | HTMLButtonElement>) => {\n const { key, ctrlKey, metaKey } = e;\n if ((ctrlKey || metaKey) && key === ';') {\n onFillWithCurrentDateKeys(e);\n }\n if ((ctrlKey || metaKey) && (key === 'Delete' || key === 'Backspace')) handleClearAll(e);\n },\n [handleClearAll, onFillWithCurrentDateKeys],\n );\n\n return useMemo(\n () => ({\n onFillWithCurrentDateKeys,\n onGlobalKeyDown,\n }),\n [onFillWithCurrentDateKeys, onGlobalKeyDown],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,mBAAqC;AAMrC,yBAA4F;AAC5F,yBAAgD;AAChD,2BAAiF;AAW1E,MAAM,uBAAuB,CAAC,EAAE,kBAAkB,gBAAgB,eAAe,MAAM,MAAc;AAC1G,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,oCAAoC,eAAe,IAAI;AAC/D,QAAM,EAAE,uBAAuB,mBAAmB,IAAI;AACtD,QAAM,EAAE,eAAe,6BAA6B,IAAI;AAExD,QAAM,gCAA4B;AAAA,IAChC,CACE,GACA,WAA8E,EAAE,wBAAwB,KAAK,MAC1G;AACH,YAAM,MAAM,IAAI,KAAK;AACrB,YAAM,oBAAgB,yCAAqB,GAAG;AAC9C,YAAM,oBAAgB,yCAAqB,GAAG;AAC9C,YAAM,gBAA0E;AAAA,QAC9E,GAAG;AAAA,QACH,OAAG,oDAAgC,eAAe,oBAAoB,gBAAgB;AAAA,QACtF,OAAG,oDAAgC,eAAe,iBAAiB;AAAA,QACnE,eAAe;AAAA,MACjB;AACA,YAAM,EAAE,OAAO,KAAK,KAAK,QAAI,sDAAgC,aAAa;AAC1E,uBAAiB,OAAO,GAAG,QAAQ;AACnC,qBAAe,KAAK,GAAG,QAAQ;AAC/B,sBAAgB,MAAM,GAAG,QAAQ;AACjC,YAAM,EAAE,OAAO,SAAS,SAAS,QAAI,sDAAgC,aAAa;AAClF,sBAAgB,OAAO,GAAG,QAAQ;AAClC,wBAAkB,SAAS,GAAG,QAAQ;AACtC,0BAAoB,UAAU,GAAG,QAAQ;AACzC,yCAAmC,eAAe,eAAe,aAAa;AAK9E,UAAI,gCAAgC,CAAC;AAAe,2BAAmB;AAAA;AAClE,8BAAsB;AAAA,IAC7B;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,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAAiE;AAChE,YAAM,EAAE,KAAK,SAAS,QAAQ,IAAI;AAClC,WAAK,WAAW,YAAY,QAAQ,KAAK;AACvC,kCAA0B,CAAC;AAAA,MAC7B;AACA,WAAK,WAAW,aAAa,QAAQ,YAAY,QAAQ;AAAc,uBAAe,CAAC;AAAA,IACzF;AAAA,IACA,CAAC,gBAAgB,yBAAyB;AAAA,EAC5C;AAEA,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,2BAA2B,eAAe;AAAA,EAC7C;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -43,23 +43,24 @@ const ClearButton = () => {
|
|
|
43
43
|
shouldDisplay: withClearBtn
|
|
44
44
|
};
|
|
45
45
|
const { latestInteractionRegion, currFocusDescriber } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
|
|
46
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
DomElem
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
46
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
47
|
+
import_Styleds.StyledClearButton,
|
|
48
|
+
{
|
|
49
|
+
"aria-label": "clear selected date",
|
|
50
|
+
buttonType: "icon",
|
|
51
|
+
size: import_ds_button.BUTTON_SIZES.M,
|
|
52
|
+
"data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CLEAR_BUTTON,
|
|
53
|
+
innerRef: (DomElem) => {
|
|
54
|
+
clearButtonRef.current = DomElem;
|
|
55
|
+
if (latestInteractionRegion === "clear-btn" && currFocusDescriber === "clear-btn")
|
|
56
|
+
DomElem?.focus?.();
|
|
57
|
+
},
|
|
58
|
+
onClick: onClearClick,
|
|
59
|
+
onKeyDown: onClearButtonKeyDown,
|
|
60
|
+
type: "button",
|
|
61
|
+
...styledsAttrs,
|
|
62
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.CloseMedium, { color: import_ds_icon.DSIconColors.PRIMARY })
|
|
63
|
+
}
|
|
64
|
+
);
|
|
64
65
|
};
|
|
65
66
|
//# sourceMappingURL=ClearButton.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/ClearButton/ClearButton.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */\nimport React, { useContext } from 'react';\nimport { CloseMedium } from '@elliemae/ds-icons';\nimport { DSIconColors } from '@elliemae/ds-icon';\nimport { BUTTON_SIZES } from '@elliemae/ds-button';\nimport { StyledClearButton } from '../Styleds';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid';\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX';\nimport { useClearButton } from './useClearButton';\n\nexport const ClearButton = (): JSX.Element => {\n const { onClearClick, onClearButtonKeyDown, clearButtonRef, withClearBtn } = useClearButton();\n const styledsAttrs = {\n shouldDisplay: withClearBtn,\n };\n const { latestInteractionRegion, currFocusDescriber } = useContext(ControlledDateTimePickerContext);\n\n return (\n <StyledClearButton\n aria-label=\"clear selected date\"\n buttonType=\"icon\"\n size={BUTTON_SIZES.M}\n data-testid={ControlledDateTimePickerDatatestid.CLEAR_BUTTON}\n innerRef={(DomElem: HTMLButtonElement) => {\n clearButtonRef.current = DomElem;\n if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem?.focus?.();\n }}\n onClick={onClearClick}\n onKeyDown={onClearButtonKeyDown}\n type=\"button\"\n {...styledsAttrs}\n >\n <CloseMedium color={DSIconColors.PRIMARY} />\n </StyledClearButton>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgCjB;AA/BN,mBAAkC;AAClC,sBAA4B;AAC5B,qBAA6B;AAC7B,uBAA6B;AAC7B,qBAAkC;AAClC,gDAAmD;AACnD,yCAAgD;AAChD,4BAA+B;AAExB,MAAM,cAAc,MAAmB;AAC5C,QAAM,EAAE,cAAc,sBAAsB,gBAAgB,aAAa,QAAI,sCAAe;AAC5F,QAAM,eAAe;AAAA,IACnB,eAAe;AAAA,EACjB;AACA,QAAM,EAAE,yBAAyB,mBAAmB,QAAI,yBAAW,kEAA+B;AAElG,SACE,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgCjB;AA/BN,mBAAkC;AAClC,sBAA4B;AAC5B,qBAA6B;AAC7B,uBAA6B;AAC7B,qBAAkC;AAClC,gDAAmD;AACnD,yCAAgD;AAChD,4BAA+B;AAExB,MAAM,cAAc,MAAmB;AAC5C,QAAM,EAAE,cAAc,sBAAsB,gBAAgB,aAAa,QAAI,sCAAe;AAC5F,QAAM,eAAe;AAAA,IACnB,eAAe;AAAA,EACjB;AACA,QAAM,EAAE,yBAAyB,mBAAmB,QAAI,yBAAW,kEAA+B;AAElG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,cAAW;AAAA,MACX,YAAW;AAAA,MACX,MAAM,8BAAa;AAAA,MACnB,eAAa,6EAAmC;AAAA,MAChD,UAAU,CAAC,YAA+B;AACxC,uBAAe,UAAU;AACzB,YAAI,4BAA4B,eAAe,uBAAuB;AAAa,mBAAS,QAAQ;AAAA,MACtG;AAAA,MACA,SAAS;AAAA,MACT,WAAW;AAAA,MACX,MAAK;AAAA,MACJ,GAAG;AAAA,MAEJ,sDAAC,+BAAY,OAAO,4BAAa,SAAS;AAAA;AAAA,EAC5C;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -73,8 +73,9 @@ const ControlledDateTimePickerContent = () => {
|
|
|
73
73
|
rightControlCols.push("28px");
|
|
74
74
|
if (withAnyPicker)
|
|
75
75
|
rightControlCols.push("auto");
|
|
76
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
|
|
77
|
-
|
|
76
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
77
|
+
import_Styleds.StyledInputsWrapperGrid,
|
|
78
|
+
{
|
|
78
79
|
cols: mainCols,
|
|
79
80
|
gutter: "xxs",
|
|
80
81
|
pr: hideDatePicker && hideTimePicker && hideDateTimePicker ? "2px" : void 0,
|
|
@@ -88,15 +89,12 @@ const ControlledDateTimePickerContent = () => {
|
|
|
88
89
|
children: [
|
|
89
90
|
hideDate ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DateInputs.DateInputs, {}),
|
|
90
91
|
hideTime ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_TimeInputs.TimeInputs, {}),
|
|
91
|
-
withAnyRightController ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
withAnyPicker ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_PickersIcons.PickersIcons, {}) : null
|
|
96
|
-
]
|
|
97
|
-
}) : null
|
|
92
|
+
withAnyRightController ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: rightControlCols, children: [
|
|
93
|
+
shouldPreserveClearableSpace ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ClearButton.ClearButton, {}) : null,
|
|
94
|
+
withAnyPicker ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_PickersIcons.PickersIcons, {}) : null
|
|
95
|
+
] }) : null
|
|
98
96
|
]
|
|
99
|
-
}
|
|
100
|
-
});
|
|
97
|
+
}
|
|
98
|
+
) });
|
|
101
99
|
};
|
|
102
100
|
//# sourceMappingURL=ControlledDateTimePickerContent.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/ControlledDateTimePickerContent.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable complexity */\nimport React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ControlledDateTimePickerContext } from '../ControlledDateTimePickerCTX';\nimport { StyledInputsWrapperGrid } from './Styleds';\nimport { DateInputs } from './DateInputs/DateInputs';\nimport { TimeInputs } from './TimeInputs/TimeInputs';\nimport { PickersIcons } from './Pickers/PickersIcons';\nimport { ClearButton } from './ClearButton/ClearButton';\nimport { ControlledDateTimePickerDatatestid } from '../ControlledDateTimePickerDatatestid';\n\nexport const ControlledDateTimePickerContent = (): JSX.Element => {\n const {\n props: { hasError, disabled },\n hideDate,\n hideDatePicker,\n hideTime,\n hideTimePicker,\n hideDateTimePicker,\n withAnyPicker,\n withAnyRightController,\n shouldPreserveClearableSpace,\n isControllerOnly,\n globalAttrs,\n xstyledAttrs,\n onGlobalKeyDown,\n trackFocusResetter,\n } = useContext(ControlledDateTimePickerContext);\n\n const styledsAttrs = {\n justPicker: hideDate && hideTime,\n withAnyPicker,\n hasError,\n isControllerOnly,\n };\n\n const mainCols = [];\n if (!hideDate) mainCols.push('auto');\n if (!hideTime) mainCols.push('auto');\n if (withAnyRightController) mainCols.push('auto');\n\n const rightControlCols = [];\n if (shouldPreserveClearableSpace) rightControlCols.push('28px');\n if (withAnyPicker) rightControlCols.push('auto');\n\n return (\n <>\n {/* The <div> element is catching the component-wise global hotkeys, there is no valid aria role for this */}\n {/* eslint-disable-next-line max-len */}\n {/* https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-static-element-interactions.md#case-the-event-handler-is-only-being-used-to-capture-bubbled-events */}\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <StyledInputsWrapperGrid\n cols={mainCols}\n gutter=\"xxs\"\n pr={hideDatePicker && hideTimePicker && hideDateTimePicker ? '2px' : undefined}\n onKeyDown={onGlobalKeyDown}\n disabled={disabled}\n onBlur={trackFocusResetter}\n data-testid={ControlledDateTimePickerDatatestid.CONTAINER}\n {...styledsAttrs}\n {...globalAttrs}\n {...xstyledAttrs}\n >\n {hideDate ? null : <DateInputs />}\n {hideTime ? null : <TimeInputs />}\n {withAnyRightController ? (\n <Grid cols={rightControlCols}>\n {shouldPreserveClearableSpace ? <ClearButton /> : null}\n {withAnyPicker ? <PickersIcons /> : null}\n </Grid>\n ) : null}\n </StyledInputsWrapperGrid>\n </>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8CnB;AA7CJ,mBAAkC;AAClC,qBAAqB;AACrB,yCAAgD;AAChD,qBAAwC;AACxC,wBAA2B;AAC3B,wBAA2B;AAC3B,0BAA6B;AAC7B,yBAA4B;AAC5B,gDAAmD;AAE5C,MAAM,kCAAkC,MAAmB;AAChE,QAAM;AAAA,IACJ,OAAO,EAAE,UAAU,SAAS;AAAA,IAC5B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAE9C,QAAM,eAAe;AAAA,IACnB,YAAY,YAAY;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,WAAW,CAAC;AAClB,MAAI,CAAC;AAAU,aAAS,KAAK,MAAM;AACnC,MAAI,CAAC;AAAU,aAAS,KAAK,MAAM;AACnC,MAAI;AAAwB,aAAS,KAAK,MAAM;AAEhD,QAAM,mBAAmB,CAAC;AAC1B,MAAI;AAA8B,qBAAiB,KAAK,MAAM;AAC9D,MAAI;AAAe,qBAAiB,KAAK,MAAM;AAE/C,SACE;AAAA,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8CnB;AA7CJ,mBAAkC;AAClC,qBAAqB;AACrB,yCAAgD;AAChD,qBAAwC;AACxC,wBAA2B;AAC3B,wBAA2B;AAC3B,0BAA6B;AAC7B,yBAA4B;AAC5B,gDAAmD;AAE5C,MAAM,kCAAkC,MAAmB;AAChE,QAAM;AAAA,IACJ,OAAO,EAAE,UAAU,SAAS;AAAA,IAC5B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAE9C,QAAM,eAAe;AAAA,IACnB,YAAY,YAAY;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,WAAW,CAAC;AAClB,MAAI,CAAC;AAAU,aAAS,KAAK,MAAM;AACnC,MAAI,CAAC;AAAU,aAAS,KAAK,MAAM;AACnC,MAAI;AAAwB,aAAS,KAAK,MAAM;AAEhD,QAAM,mBAAmB,CAAC;AAC1B,MAAI;AAA8B,qBAAiB,KAAK,MAAM;AAC9D,MAAI;AAAe,qBAAiB,KAAK,MAAM;AAE/C,SACE,2EAKE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,QAAO;AAAA,MACP,IAAI,kBAAkB,kBAAkB,qBAAqB,QAAQ;AAAA,MACrE,WAAW;AAAA,MACX;AAAA,MACA,QAAQ;AAAA,MACR,eAAa,6EAAmC;AAAA,MAC/C,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MAEH;AAAA,mBAAW,OAAO,4CAAC,gCAAW;AAAA,QAC9B,WAAW,OAAO,4CAAC,gCAAW;AAAA,QAC9B,yBACC,6CAAC,uBAAK,MAAM,kBACT;AAAA,yCAA+B,4CAAC,kCAAY,IAAK;AAAA,UACjD,gBAAgB,4CAAC,oCAAa,IAAK;AAAA,WACtC,IACE;AAAA;AAAA;AAAA,EACN,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -62,23 +62,26 @@ const DDInput = import_react.default.memo(
|
|
|
62
62
|
},
|
|
63
63
|
[onChange]
|
|
64
64
|
);
|
|
65
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
DomElem
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
65
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
66
|
+
import_Styleds.Styled2DigitsInput,
|
|
67
|
+
{
|
|
68
|
+
onChange: validateOnChange,
|
|
69
|
+
onBlur,
|
|
70
|
+
onFocus,
|
|
71
|
+
onKeyDown,
|
|
72
|
+
value,
|
|
73
|
+
ref: (DomElem) => {
|
|
74
|
+
contextRef.current = DomElem;
|
|
75
|
+
if (isFocused)
|
|
76
|
+
DomElem?.focus?.();
|
|
77
|
+
},
|
|
78
|
+
placeholder,
|
|
79
|
+
"aria-label": `day input field, ${ariaCurrentValueForInputs}`,
|
|
80
|
+
"data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY,
|
|
81
|
+
disabled,
|
|
82
|
+
"aria-disabled": disabled
|
|
83
|
+
}
|
|
84
|
+
);
|
|
82
85
|
}
|
|
83
86
|
);
|
|
84
87
|
//# sourceMappingURL=DDInput.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DateInputs/DDInput.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useCallback } from 'react';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid';\nimport { Styled2DigitsInput } from '../Styleds';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidDay = (day: string) => {\n if (day === '') return false;\n const numberOnly = regExpNumbers.test(day);\n return day.length > 2 || day === '00' || !numberOnly || Number.parseInt(day, 10) > 31;\n};\n\ninterface DDInputsPropsT {\n onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n value: string;\n disabled: boolean;\n placeholder: string;\n ariaCurrentValueForInputs: string;\n contextRef: React.MutableRefObject<HTMLInputElement | null>;\n isFocused: boolean;\n}\nexport const DDInput = React.memo(\n ({\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n value,\n disabled,\n contextRef,\n placeholder,\n ariaCurrentValueForInputs,\n isFocused,\n }: DDInputsPropsT): JSX.Element => {\n const validateOnChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n if (isInvalidDay(e?.currentTarget?.value)) {\n e.preventDefault();\n return;\n }\n onChange(e);\n },\n [onChange],\n );\n return (\n <Styled2DigitsInput\n onChange={validateOnChange}\n onBlur={onBlur}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n value={value}\n ref={(DomElem: HTMLInputElement) => {\n (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n if (isFocused) DomElem?.focus?.();\n }}\n placeholder={placeholder}\n aria-label={`day input field, ${ariaCurrentValueForInputs}`}\n data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY}\n disabled={disabled}\n aria-disabled={disabled}\n />\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgDjB;AAhDN,mBAAmC;AACnC,gDAAmD;AACnD,qBAAmC;AAGnC,MAAM,gBAAgB;AACtB,MAAM,eAAe,CAAC,QAAgB;AACpC,MAAI,QAAQ;AAAI,WAAO;AACvB,QAAM,aAAa,cAAc,KAAK,GAAG;AACzC,SAAO,IAAI,SAAS,KAAK,QAAQ,QAAQ,CAAC,cAAc,OAAO,SAAS,KAAK,EAAE,IAAI;AACrF;AAcO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,aAAa,GAAG,eAAe,KAAK,GAAG;AACzC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgDjB;AAhDN,mBAAmC;AACnC,gDAAmD;AACnD,qBAAmC;AAGnC,MAAM,gBAAgB;AACtB,MAAM,eAAe,CAAC,QAAgB;AACpC,MAAI,QAAQ;AAAI,WAAO;AACvB,QAAM,aAAa,cAAc,KAAK,GAAG;AACzC,SAAO,IAAI,SAAS,KAAK,QAAQ,QAAQ,CAAC,cAAc,OAAO,SAAS,KAAK,EAAE,IAAI;AACrF;AAcO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,aAAa,GAAG,eAAe,KAAK,GAAG;AACzC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,KAAK,CAAC,YAA8B;AAClC,UAAC,WAAwD,UAAU;AACnE,cAAI;AAAW,qBAAS,QAAQ;AAAA,QAClC;AAAA,QACA;AAAA,QACA,cAAY,oBAAoB;AAAA,QAChC,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -67,68 +67,68 @@ const DateInputs = () => {
|
|
|
67
67
|
latestInteractionRegion,
|
|
68
68
|
currFocusDescriber
|
|
69
69
|
} = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
|
|
70
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
alignItems: "center",
|
|
115
|
-
children:
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
})
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
70
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
71
|
+
import_ds_grid.Grid,
|
|
72
|
+
{
|
|
73
|
+
cols: [
|
|
74
|
+
import_config.fixedValues.smallInputWidth,
|
|
75
|
+
import_config.fixedValues.separatorWidth,
|
|
76
|
+
import_config.fixedValues.smallInputWidth,
|
|
77
|
+
import_config.fixedValues.separatorWidth,
|
|
78
|
+
import_config.fixedValues.largeInputWidth
|
|
79
|
+
],
|
|
80
|
+
children: [
|
|
81
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledFocusWithIn, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
82
|
+
import_MMInput.MMInput,
|
|
83
|
+
{
|
|
84
|
+
onChange: onMonthChange,
|
|
85
|
+
onBlur: onMonthBlur,
|
|
86
|
+
onFocus: onMonthFocus,
|
|
87
|
+
onKeyDown: onMonthKeyDown,
|
|
88
|
+
value: month,
|
|
89
|
+
contextRef: monthInputRef,
|
|
90
|
+
innerRef: innerRefMonthInput,
|
|
91
|
+
autoFocusMonthInput,
|
|
92
|
+
placeholder: "MM",
|
|
93
|
+
ariaCurrentValueForInputs,
|
|
94
|
+
disabled,
|
|
95
|
+
isFocused: latestInteractionRegion === "date-inputs" && currFocusDescriber === "month-input"
|
|
96
|
+
}
|
|
97
|
+
) }),
|
|
98
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledSeparator, { alignItems: "center", children: "/" }),
|
|
99
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledFocusWithIn, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
100
|
+
import_DDInput.DDInput,
|
|
101
|
+
{
|
|
102
|
+
onChange: onDayChange,
|
|
103
|
+
onBlur: onDayBlur,
|
|
104
|
+
onFocus: onDayFocus,
|
|
105
|
+
onKeyDown: onDayKeyDown,
|
|
106
|
+
value: day,
|
|
107
|
+
contextRef: dayInputRef,
|
|
108
|
+
placeholder: "DD",
|
|
109
|
+
ariaCurrentValueForInputs,
|
|
110
|
+
disabled,
|
|
111
|
+
isFocused: latestInteractionRegion === "date-inputs" && currFocusDescriber === "day-input"
|
|
112
|
+
}
|
|
113
|
+
) }),
|
|
114
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledSeparator, { alignItems: "center", children: "/" }),
|
|
115
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Styleds.StyledFocusWithIn, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
116
|
+
import_YYYYInput.YYYYInput,
|
|
117
|
+
{
|
|
118
|
+
onChange: onYearChange,
|
|
119
|
+
onBlur: onYearBlur,
|
|
120
|
+
onFocus: onYearFocus,
|
|
121
|
+
onKeyDown: onYearKeyDown,
|
|
122
|
+
value: year,
|
|
123
|
+
contextRef: yearInputRef,
|
|
124
|
+
placeholder: "YYYY",
|
|
125
|
+
ariaCurrentValueForInputs,
|
|
126
|
+
disabled,
|
|
127
|
+
isFocused: latestInteractionRegion === "date-inputs" && currFocusDescriber === "year-input"
|
|
128
|
+
}
|
|
129
|
+
) })
|
|
130
|
+
]
|
|
131
|
+
}
|
|
132
|
+
);
|
|
133
133
|
};
|
|
134
134
|
//# sourceMappingURL=DateInputs.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DateInputs/DateInputs.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\n\nimport { ControlledDateTimePickerContext } from '../../ControlledDateTimePickerCTX';\nimport { MMInput } from './MMInput';\nimport { DDInput } from './DDInput';\nimport { YYYYInput } from './YYYYInput';\nimport { StyledFocusWithIn, StyledSeparator } from '../Styleds';\nimport { useDateInputs } from './useDateInputs';\nimport { fixedValues } from '../config';\n\nexport const DateInputs = (): JSX.Element => {\n const {\n month,\n day,\n year,\n autoFocusMonthInput,\n innerRefMonthInput,\n onMonthChange,\n onDayChange,\n onYearChange,\n onMonthBlur,\n onDayBlur,\n onYearBlur,\n onMonthFocus,\n onDayFocus,\n onYearFocus,\n onMonthKeyDown,\n onDayKeyDown,\n onYearKeyDown,\n disabled,\n } = useDateInputs();\n // we do this here so MMInput,DDInput,YYYYInput can be pure component memoized via React.memo\n const {\n monthInputRef,\n dayInputRef,\n yearInputRef,\n ariaCurrentValueForInputs,\n latestInteractionRegion,\n currFocusDescriber,\n } = useContext(ControlledDateTimePickerContext);\n\n return (\n <Grid\n cols={[\n fixedValues.smallInputWidth,\n fixedValues.separatorWidth,\n fixedValues.smallInputWidth,\n fixedValues.separatorWidth,\n fixedValues.largeInputWidth,\n ]}\n >\n <StyledFocusWithIn>\n <MMInput\n onChange={onMonthChange}\n onBlur={onMonthBlur}\n onFocus={onMonthFocus}\n onKeyDown={onMonthKeyDown}\n value={month}\n contextRef={monthInputRef}\n innerRef={innerRefMonthInput}\n autoFocusMonthInput={autoFocusMonthInput}\n placeholder=\"MM\"\n ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n disabled={disabled}\n isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'month-input'}\n />\n </StyledFocusWithIn>\n <StyledSeparator alignItems=\"center\">/</StyledSeparator>\n <StyledFocusWithIn>\n <DDInput\n onChange={onDayChange}\n onBlur={onDayBlur}\n onFocus={onDayFocus}\n onKeyDown={onDayKeyDown}\n value={day}\n contextRef={dayInputRef}\n placeholder=\"DD\"\n ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n disabled={disabled}\n isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'day-input'}\n />\n </StyledFocusWithIn>\n <StyledSeparator alignItems=\"center\">/</StyledSeparator>\n <StyledFocusWithIn>\n <YYYYInput\n onChange={onYearChange}\n onBlur={onYearBlur}\n onFocus={onYearFocus}\n onKeyDown={onYearKeyDown}\n value={year}\n contextRef={yearInputRef}\n placeholder=\"YYYY\"\n ariaCurrentValueForInputs={ariaCurrentValueForInputs}\n disabled={disabled}\n isFocused={latestInteractionRegion === 'date-inputs' && currFocusDescriber === 'year-input'}\n />\n </StyledFocusWithIn>\n </Grid>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2CnB;AA3CJ,mBAAkC;AAClC,qBAAqB;AAErB,yCAAgD;AAChD,qBAAwB;AACxB,qBAAwB;AACxB,uBAA0B;AAC1B,qBAAmD;AACnD,2BAA8B;AAC9B,oBAA4B;AAErB,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,oCAAc;AAElB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAE9C,SACE,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2CnB;AA3CJ,mBAAkC;AAClC,qBAAqB;AAErB,yCAAgD;AAChD,qBAAwB;AACxB,qBAAwB;AACxB,uBAA0B;AAC1B,qBAAmD;AACnD,2BAA8B;AAC9B,oBAA4B;AAErB,MAAM,aAAa,MAAmB;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,oCAAc;AAElB,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,yBAAW,kEAA+B;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,QACZ,0BAAY;AAAA,MACd;AAAA,MAEA;AAAA,oDAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ,UAAU;AAAA,YACV;AAAA,YACA,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA;AAAA,QACjF,GACF;AAAA,QACA,4CAAC,kCAAgB,YAAW,UAAS,eAAC;AAAA,QACtC,4CAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA;AAAA,QACjF,GACF;AAAA,QACA,4CAAC,kCAAgB,YAAW,UAAS,eAAC;AAAA,QACtC,4CAAC,oCACC;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,QAAQ;AAAA,YACR,SAAS;AAAA,YACT,WAAW;AAAA,YACX,OAAO;AAAA,YACP,YAAY;AAAA,YACZ,aAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACA,WAAW,4BAA4B,iBAAiB,uBAAuB;AAAA;AAAA,QACjF,GACF;AAAA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -79,20 +79,23 @@ const MMInput = import_react.default.memo(
|
|
|
79
79
|
}
|
|
80
80
|
return handleRef;
|
|
81
81
|
}, [handleRef, innerRef]);
|
|
82
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
82
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
83
|
+
import_Styleds.Styled2DigitsInput,
|
|
84
|
+
{
|
|
85
|
+
autoFocus: autoFocusMonthInput,
|
|
86
|
+
onChange: validateOnChange,
|
|
87
|
+
onBlur,
|
|
88
|
+
onFocus,
|
|
89
|
+
onKeyDown,
|
|
90
|
+
value,
|
|
91
|
+
ref: currentRef,
|
|
92
|
+
placeholder,
|
|
93
|
+
"aria-label": `month input field, ${ariaCurrentValueForInputs}`,
|
|
94
|
+
"data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.MONTH,
|
|
95
|
+
disabled,
|
|
96
|
+
"aria-disabled": disabled
|
|
97
|
+
}
|
|
98
|
+
);
|
|
96
99
|
}
|
|
97
100
|
);
|
|
98
101
|
//# sourceMappingURL=MMInput.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DateInputs/MMInput.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport { setMultipleRefs } from '@elliemae/ds-utilities';\nimport { Styled2DigitsInput } from '../Styleds';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidMonth = (month: string) => {\n if (month === '') return false;\n const numberOnly = regExpNumbers.test(month);\n return month.length > 2 || month === '00' || !numberOnly || Number.parseInt(month, 10) > 12;\n};\ninterface MMInputsPropsT {\n onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n autoFocusMonthInput: boolean;\n value: string;\n disabled: boolean;\n contextRef: React.MutableRefObject<HTMLInputElement | null>;\n placeholder: string;\n ariaCurrentValueForInputs: string;\n isFocused: boolean;\n innerRef: React.MutableRefObject<HTMLInputElement | HTMLButtonElement | null>;\n}\nexport const MMInput = React.memo(\n ({\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n value,\n disabled,\n placeholder,\n contextRef,\n innerRef,\n autoFocusMonthInput,\n ariaCurrentValueForInputs,\n isFocused,\n }: MMInputsPropsT): JSX.Element => {\n const validateOnChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n if (isInvalidMonth(e?.target?.value)) {\n e.preventDefault();\n return;\n }\n onChange(e);\n },\n [onChange],\n );\n\n const handleRef = useCallback(\n (DomElem: HTMLInputElement) => {\n (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n if (isFocused) DomElem?.focus?.();\n },\n [contextRef, isFocused],\n );\n\n const currentRef = useMemo(() => {\n if (innerRef) {\n return setMultipleRefs([handleRef, innerRef]);\n }\n return handleRef;\n }, [handleRef, innerRef]);\n\n return (\n <Styled2DigitsInput\n autoFocus={autoFocusMonthInput}\n onChange={validateOnChange}\n onBlur={onBlur}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n value={value}\n ref={currentRef}\n placeholder={placeholder}\n aria-label={`month input field, ${ariaCurrentValueForInputs}`}\n data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.MONTH}\n disabled={disabled}\n aria-disabled={disabled}\n />\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoEjB;AApEN,mBAA4C;AAC5C,0BAAgC;AAChC,qBAAmC;AACnC,gDAAmD;AAGnD,MAAM,gBAAgB;AACtB,MAAM,iBAAiB,CAAC,UAAkB;AACxC,MAAI,UAAU;AAAI,WAAO;AACzB,QAAM,aAAa,cAAc,KAAK,KAAK;AAC3C,SAAO,MAAM,SAAS,KAAK,UAAU,QAAQ,CAAC,cAAc,OAAO,SAAS,OAAO,EAAE,IAAI;AAC3F;AAeO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,eAAe,GAAG,QAAQ,KAAK,GAAG;AACpC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AAEA,UAAM,gBAAY;AAAA,MAChB,CAAC,YAA8B;AAC7B,QAAC,WAAwD,UAAU;AACnE,YAAI;AAAW,mBAAS,QAAQ;AAAA,MAClC;AAAA,MACA,CAAC,YAAY,SAAS;AAAA,IACxB;AAEA,UAAM,iBAAa,sBAAQ,MAAM;AAC/B,UAAI,UAAU;AACZ,mBAAO,qCAAgB,CAAC,WAAW,QAAQ,CAAC;AAAA,MAC9C;AACA,aAAO;AAAA,IACT,GAAG,CAAC,WAAW,QAAQ,CAAC;AAExB,WACE,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoEjB;AApEN,mBAA4C;AAC5C,0BAAgC;AAChC,qBAAmC;AACnC,gDAAmD;AAGnD,MAAM,gBAAgB;AACtB,MAAM,iBAAiB,CAAC,UAAkB;AACxC,MAAI,UAAU;AAAI,WAAO;AACzB,QAAM,aAAa,cAAc,KAAK,KAAK;AAC3C,SAAO,MAAM,SAAS,KAAK,UAAU,QAAQ,CAAC,cAAc,OAAO,SAAS,OAAO,EAAE,IAAI;AAC3F;AAeO,MAAM,UAAU,aAAAA,QAAM;AAAA,EAC3B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAmC;AACjC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,eAAe,GAAG,QAAQ,KAAK,GAAG;AACpC,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AAEA,UAAM,gBAAY;AAAA,MAChB,CAAC,YAA8B;AAC7B,QAAC,WAAwD,UAAU;AACnE,YAAI;AAAW,mBAAS,QAAQ;AAAA,MAClC;AAAA,MACA,CAAC,YAAY,SAAS;AAAA,IACxB;AAEA,UAAM,iBAAa,sBAAQ,MAAM;AAC/B,UAAI,UAAU;AACZ,mBAAO,qCAAgB,CAAC,WAAW,QAAQ,CAAC;AAAA,MAC9C;AACA,aAAO;AAAA,IACT,GAAG,CAAC,WAAW,QAAQ,CAAC;AAExB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,QACX,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,KAAK;AAAA,QACL;AAAA,QACA,cAAY,sBAAsB;AAAA,QAClC,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -62,23 +62,26 @@ const YYYYInput = import_react.default.memo(
|
|
|
62
62
|
},
|
|
63
63
|
[onChange]
|
|
64
64
|
);
|
|
65
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
DomElem
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
65
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
66
|
+
import_Styleds.StyledMin4DigitsInput,
|
|
67
|
+
{
|
|
68
|
+
onChange: validateOnChange,
|
|
69
|
+
onBlur,
|
|
70
|
+
onFocus,
|
|
71
|
+
onKeyDown,
|
|
72
|
+
value,
|
|
73
|
+
ref: (DomElem) => {
|
|
74
|
+
contextRef.current = DomElem;
|
|
75
|
+
if (isFocused)
|
|
76
|
+
DomElem?.focus?.();
|
|
77
|
+
},
|
|
78
|
+
placeholder,
|
|
79
|
+
"aria-label": `year input field, ${ariaCurrentValueForInputs}`,
|
|
80
|
+
"data-testid": import_ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR,
|
|
81
|
+
disabled,
|
|
82
|
+
"aria-disabled": disabled
|
|
83
|
+
}
|
|
84
|
+
);
|
|
82
85
|
}
|
|
83
86
|
);
|
|
84
87
|
//# sourceMappingURL=YYYYInput.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DateInputs/YYYYInput.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useCallback } from 'react';\nimport { ControlledDateTimePickerDatatestid } from '../../ControlledDateTimePickerDatatestid';\nimport { StyledMin4DigitsInput } from '../Styleds';\nimport type { DSControlledDateTimePickerInternalsT } from '../../sharedTypes';\n\nconst regExpNumbers = /^[0-9]+$/;\nconst isInvalidYear = (year: string) => {\n if (year === '') return false;\n const numberOnly = regExpNumbers.test(year);\n return year.length > 4 || !numberOnly || Number.parseInt(year, 10) > 9999;\n};\n\ninterface YYYYInputsPropsT {\n onChange: DSControlledDateTimePickerInternalsT.OnChangeFunc;\n onBlur: DSControlledDateTimePickerInternalsT.OnBlurFunc;\n onFocus: DSControlledDateTimePickerInternalsT.OnFocusFunc;\n onKeyDown: DSControlledDateTimePickerInternalsT.OnKeyDown;\n value: string;\n disabled: boolean;\n contextRef: React.MutableRefObject<HTMLInputElement | null>;\n placeholder: string;\n ariaCurrentValueForInputs: string;\n isFocused: boolean;\n}\nexport const YYYYInput = React.memo(\n ({\n onChange,\n onBlur,\n onFocus,\n onKeyDown,\n value,\n disabled,\n placeholder,\n contextRef,\n ariaCurrentValueForInputs,\n isFocused,\n }: YYYYInputsPropsT): JSX.Element => {\n const validateOnChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n if (isInvalidYear(e?.currentTarget?.value)) {\n e.preventDefault();\n return;\n }\n onChange(e);\n },\n [onChange],\n );\n return (\n <StyledMin4DigitsInput\n onChange={validateOnChange}\n onBlur={onBlur}\n onFocus={onFocus}\n onKeyDown={onKeyDown}\n value={value}\n ref={(DomElem: HTMLInputElement) => {\n (contextRef as React.MutableRefObject<HTMLInputElement>).current = DomElem;\n if (isFocused) DomElem?.focus?.();\n }}\n placeholder={placeholder}\n aria-label={`year input field, ${ariaCurrentValueForInputs}`}\n data-testid={ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR}\n disabled={disabled}\n aria-disabled={disabled}\n />\n );\n },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgDjB;AAhDN,mBAAmC;AACnC,gDAAmD;AACnD,qBAAsC;AAGtC,MAAM,gBAAgB;AACtB,MAAM,gBAAgB,CAAC,SAAiB;AACtC,MAAI,SAAS;AAAI,WAAO;AACxB,QAAM,aAAa,cAAc,KAAK,IAAI;AAC1C,SAAO,KAAK,SAAS,KAAK,CAAC,cAAc,OAAO,SAAS,MAAM,EAAE,IAAI;AACvE;AAcO,MAAM,YAAY,aAAAA,QAAM;AAAA,EAC7B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAqC;AACnC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,cAAc,GAAG,eAAe,KAAK,GAAG;AAC1C,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgDjB;AAhDN,mBAAmC;AACnC,gDAAmD;AACnD,qBAAsC;AAGtC,MAAM,gBAAgB;AACtB,MAAM,gBAAgB,CAAC,SAAiB;AACtC,MAAI,SAAS;AAAI,WAAO;AACxB,QAAM,aAAa,cAAc,KAAK,IAAI;AAC1C,SAAO,KAAK,SAAS,KAAK,CAAC,cAAc,OAAO,SAAS,MAAM,EAAE,IAAI;AACvE;AAcO,MAAM,YAAY,aAAAA,QAAM;AAAA,EAC7B,CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,MAAqC;AACnC,UAAM,uBAAmB;AAAA,MACvB,CAAC,MAA2C;AAC1C,YAAI,cAAc,GAAG,eAAe,KAAK,GAAG;AAC1C,YAAE,eAAe;AACjB;AAAA,QACF;AACA,iBAAS,CAAC;AAAA,MACZ;AAAA,MACA,CAAC,QAAQ;AAAA,IACX;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,KAAK,CAAC,YAA8B;AAClC,UAAC,WAAwD,UAAU;AACnE,cAAI;AAAW,qBAAS,QAAQ;AAAA,QAClC;AAAA,QACA;AAAA,QACA,cAAY,qBAAqB;AAAA,QACjC,eAAa,6EAAmC,YAAY;AAAA,QAC5D;AAAA,QACA,iBAAe;AAAA;AAAA,IACjB;AAAA,EAEJ;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -38,27 +38,15 @@ var import_CalendarContext = require("./CalendarContext");
|
|
|
38
38
|
var import_useConfigCalendarCTX = require("./useConfigCalendarCTX");
|
|
39
39
|
const WrappedCalendarContext = ({ children }) => {
|
|
40
40
|
const ctx = (0, import_useConfigCalendarCTX.useConfigCalendarCTX)();
|
|
41
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CalendarContext.CalendarContext.Provider, {
|
|
42
|
-
value: ctx,
|
|
43
|
-
children
|
|
44
|
-
});
|
|
41
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CalendarContext.CalendarContext.Provider, { value: ctx, children });
|
|
45
42
|
};
|
|
46
43
|
const CalendarContent = () => {
|
|
47
44
|
const { showCalendar, handleMenuWrapperKeyDown } = (0, import_react.useContext)(import_CalendarContext.CalendarContext);
|
|
48
45
|
const { isControllerOnly } = (0, import_react.useContext)(import_ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
|
|
49
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
54
|
-
onKeyDown: handleMenuWrapperKeyDown,
|
|
55
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CalendarWrapper.CalendarWrapper, {})
|
|
56
|
-
})
|
|
57
|
-
}) : null
|
|
58
|
-
]
|
|
59
|
-
});
|
|
46
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
47
|
+
isControllerOnly ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CalendarIconTrigger.CalendarIconTrigger, {}),
|
|
48
|
+
isControllerOnly || showCalendar ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { onKeyDown: handleMenuWrapperKeyDown, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CalendarWrapper.CalendarWrapper, {}) }) }) : null
|
|
49
|
+
] });
|
|
60
50
|
};
|
|
61
|
-
const Calendar = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WrappedCalendarContext, {
|
|
62
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CalendarContent, {})
|
|
63
|
-
});
|
|
51
|
+
const Calendar = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(WrappedCalendarContext, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CalendarContent, {}) });
|
|
64
52
|
//# sourceMappingURL=Calendar.js.map
|