@elliemae/ds-controlled-form 2.4.2-rc.12 → 2.4.2-rc.13
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/cjs/autocomplete/config/useAutocomplete.js +0 -1
- package/cjs/autocomplete/parts/A11yFocusedOption.js +9 -6
- package/cjs/autocomplete/parts/container/Container.js +1 -1
- package/cjs/autocomplete/parts/container/useKeyboardNavigation.js +2 -2
- package/cjs/autocomplete/parts/menu-list/MenuList.js +3 -5
- package/cjs/autocomplete/parts/menu-list/styled.js +2 -2
- package/cjs/autocomplete/parts/menu-list/useItemRenderer.js +1 -1
- package/cjs/checkbox/config/useValidateProps.js +6 -3
- package/cjs/checkbox/styles.js +72 -28
- package/cjs/checkbox/utils/styleHelpers.js +20 -2
- package/cjs/combobox/config/useComboBox.js +1 -2
- package/cjs/combobox/config/useCorrectOptions.js +1 -2
- package/cjs/combobox/parts/A11yFocusedOption.js +4 -4
- package/cjs/combobox/parts/A11ySelectedValues.js +2 -2
- package/cjs/combobox/parts/DropdownIndicator.js +13 -5
- package/cjs/combobox/parts/container/Container.js +1 -1
- package/cjs/combobox/parts/container/styled.js +11 -10
- package/cjs/combobox/parts/controls/Controls.js +3 -9
- package/cjs/combobox/parts/controls/styled.js +54 -22
- package/cjs/combobox/parts/controls/useOnPillsNavigation.js +4 -12
- package/cjs/combobox/parts/controls-input/styled.js +41 -11
- package/cjs/combobox/parts/controls-input/useControlsInput.js +1 -5
- package/cjs/combobox/parts/controls-input/useKeyboardNavigation.js +4 -6
- package/cjs/combobox/parts/controls-input/useMaskedOnChange.js +1 -1
- package/cjs/combobox/parts/header-list/HeaderList.js +1 -1
- package/cjs/combobox/parts/header-list/styled.js +39 -10
- package/cjs/combobox/parts/header-list/useHeaderListHandlers.js +4 -11
- package/cjs/combobox/parts/menu-list/MenuList.js +2 -2
- package/cjs/combobox/parts/menu-list/styled.js +37 -21
- package/cjs/combobox/parts/menu-list/useItemRenderer.js +3 -3
- package/cjs/combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.js +1 -1
- package/cjs/combobox/parts/multi-selected-values-container/RemovableSelectedValuePill.js +1 -3
- package/cjs/combobox/parts/multi-selected-values-container/useGroupPills.js +1 -2
- package/cjs/combobox/parts/styled.js +6 -7
- package/cjs/combobox/sharedTypes.js +2 -2
- package/cjs/combobox/utils/listHelper.js +4 -9
- package/cjs/date-range-picker/config/useRangePickerLogic.js +4 -8
- package/cjs/date-range-picker/parts/ControlledDateRangeCalendar.js +0 -2
- package/cjs/date-range-picker/parts/ControlledDateRangeFromDate.js +0 -2
- package/cjs/date-range-picker/parts/ControlledDateRangeToDate.js +0 -2
- package/cjs/date-time-picker/config/useChangeHandlers.js +3 -3
- package/cjs/date-time-picker/config/useControlledDateTimePicker.js +1 -1
- package/cjs/date-time-picker/config/useFocusTracker.js +1 -1
- package/cjs/date-time-picker/config/useGetDestructuredValues.js +6 -6
- package/cjs/date-time-picker/config/useGetPropsBasedOnType.js +1 -1
- package/cjs/date-time-picker/config/useGetReferences.js +1 -1
- package/cjs/date-time-picker/config/useRelevantValueFromProps.js +1 -1
- package/cjs/date-time-picker/config/useValidateProps.js +42 -11
- package/cjs/date-time-picker/parts/ClearButton/ClearButton.js +1 -3
- package/cjs/date-time-picker/parts/DateInputs/DDInput.js +3 -7
- package/cjs/date-time-picker/parts/DateInputs/MMInput.js +3 -7
- package/cjs/date-time-picker/parts/DateInputs/YYYYInput.js +3 -7
- package/cjs/date-time-picker/parts/DateInputs/useDateInputs.js +13 -23
- package/cjs/date-time-picker/parts/Pickers/Calendar/CalendarDaysList.js +4 -4
- package/cjs/date-time-picker/parts/Pickers/Calendar/CalendarHead.js +6 -14
- package/cjs/date-time-picker/parts/Pickers/Calendar/CalendarIconTrigger.js +1 -1
- package/cjs/date-time-picker/parts/Pickers/Calendar/Day.js +8 -10
- package/cjs/date-time-picker/parts/Pickers/Calendar/Styleds.js +44 -15
- package/cjs/date-time-picker/parts/Pickers/Calendar/useConfigCalendarCTX.js +1 -2
- package/cjs/date-time-picker/parts/Pickers/Calendar/useCurrentDisplayedMonthYearLogic.js +2 -1
- package/cjs/date-time-picker/parts/Pickers/Calendar/useFocusLogic.js +0 -1
- package/cjs/date-time-picker/parts/Pickers/Calendar/usePopperTriggerLogic.js +3 -5
- package/cjs/date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +1 -1
- package/cjs/date-time-picker/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js +3 -5
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/HoursList.js +5 -7
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/MeridiemList.js +6 -8
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/MinutesList.js +5 -7
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/SecondsList.js +2 -2
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/Styleds.js +47 -15
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/TimeWheelContent.js +1 -1
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +1 -1
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/useCurrentDisplayedWheelsLogic.js +3 -3
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/usePopperTriggerLogic.js +2 -5
- package/cjs/date-time-picker/parts/Styleds.js +12 -6
- package/cjs/date-time-picker/parts/TimeInputs/HHInput.js +2 -4
- package/cjs/date-time-picker/parts/TimeInputs/MeridiemInput.js +3 -8
- package/cjs/date-time-picker/parts/TimeInputs/MinutesInput.js +3 -7
- package/cjs/date-time-picker/parts/TimeInputs/useTimeInputs.js +14 -26
- package/cjs/date-time-picker/utils/dateHelpers.js +17 -34
- package/cjs/date-time-picker/utils/hooks/useOnClickOutside.js +1 -3
- package/cjs/date-time-picker/utils/stringHelpers.js +5 -11
- package/cjs/input-group/styled.js +79 -13
- package/cjs/large-text-input/DSControlledLargeTextInput.js +1 -1
- package/cjs/large-text-input/styles.js +27 -13
- package/cjs/mask-hook/hooks/useNumberMask.js +1 -5
- package/cjs/mask-hook/hooks/usePhoneMask.js +1 -4
- package/cjs/mask-hook/hooks/useRegExpMask.js +4 -7
- package/cjs/mask-hook/hooks/useSSNMask.js +1 -4
- package/cjs/mask-hook/hooks/useZipCodeMask.js +1 -4
- package/cjs/mask-hook/utils/addSpecialCharacters.js +0 -1
- package/cjs/mask-hook/utils/flatStringArray.js +0 -1
- package/cjs/text-input/config/useInputText.js +0 -1
- package/cjs/text-input/styled/borders.js +18 -11
- package/cjs/text-input/styled/components.js +49 -10
- package/cjs/toggle/ControlledToggle.js +2 -3
- package/cjs/toggle/styles.js +7 -5
- package/esm/autocomplete/config/useAutocomplete.js +0 -1
- package/esm/autocomplete/parts/A11yFocusedOption.js +9 -5
- package/esm/autocomplete/parts/container/Container.js +1 -1
- package/esm/autocomplete/parts/container/useKeyboardNavigation.js +2 -2
- package/esm/autocomplete/parts/menu-list/MenuList.js +3 -5
- package/esm/autocomplete/parts/menu-list/styled.js +2 -2
- package/esm/autocomplete/parts/menu-list/useItemRenderer.js +1 -1
- package/esm/checkbox/config/useValidateProps.js +6 -3
- package/esm/checkbox/styles.js +72 -24
- package/esm/checkbox/utils/styleHelpers.js +20 -2
- package/esm/combobox/config/useComboBox.js +0 -1
- package/esm/combobox/config/useCorrectOptions.js +1 -2
- package/esm/combobox/parts/A11yFocusedOption.js +4 -4
- package/esm/combobox/parts/A11ySelectedValues.js +2 -2
- package/esm/combobox/parts/DropdownIndicator.js +13 -4
- package/esm/combobox/parts/container/Container.js +1 -1
- package/esm/combobox/parts/container/styled.js +11 -6
- package/esm/combobox/parts/controls/Controls.js +3 -9
- package/esm/combobox/parts/controls/styled.js +54 -18
- package/esm/combobox/parts/controls/useOnPillsNavigation.js +4 -12
- package/esm/combobox/parts/controls-input/styled.js +41 -7
- package/esm/combobox/parts/controls-input/useControlsInput.js +1 -5
- package/esm/combobox/parts/controls-input/useKeyboardNavigation.js +4 -6
- package/esm/combobox/parts/controls-input/useMaskedOnChange.js +1 -1
- package/esm/combobox/parts/header-list/HeaderList.js +1 -1
- package/esm/combobox/parts/header-list/styled.js +40 -7
- package/esm/combobox/parts/header-list/useHeaderListHandlers.js +4 -11
- package/esm/combobox/parts/menu-list/MenuList.js +2 -2
- package/esm/combobox/parts/menu-list/styled.js +37 -17
- package/esm/combobox/parts/menu-list/useItemRenderer.js +3 -3
- package/esm/combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.js +1 -1
- package/esm/combobox/parts/multi-selected-values-container/RemovableSelectedValuePill.js +1 -3
- package/esm/combobox/parts/multi-selected-values-container/useGroupPills.js +1 -2
- package/esm/combobox/parts/styled.js +6 -3
- package/esm/combobox/sharedTypes.js +2 -2
- package/esm/combobox/utils/listHelper.js +4 -9
- package/esm/date-range-picker/config/useRangePickerLogic.js +3 -7
- package/esm/date-range-picker/parts/ControlledDateRangeCalendar.js +0 -2
- package/esm/date-range-picker/parts/ControlledDateRangeFromDate.js +0 -2
- package/esm/date-range-picker/parts/ControlledDateRangeToDate.js +0 -2
- package/esm/date-time-picker/config/useChangeHandlers.js +3 -3
- package/esm/date-time-picker/config/useControlledDateTimePicker.js +1 -1
- package/esm/date-time-picker/config/useFocusTracker.js +1 -1
- package/esm/date-time-picker/config/useGetDestructuredValues.js +6 -6
- package/esm/date-time-picker/config/useGetPropsBasedOnType.js +1 -1
- package/esm/date-time-picker/config/useGetReferences.js +1 -1
- package/esm/date-time-picker/config/useRelevantValueFromProps.js +1 -1
- package/esm/date-time-picker/config/useValidateProps.js +42 -11
- package/esm/date-time-picker/parts/ClearButton/ClearButton.js +1 -3
- package/esm/date-time-picker/parts/DateInputs/DDInput.js +3 -7
- package/esm/date-time-picker/parts/DateInputs/MMInput.js +3 -7
- package/esm/date-time-picker/parts/DateInputs/YYYYInput.js +3 -7
- package/esm/date-time-picker/parts/DateInputs/useDateInputs.js +13 -23
- package/esm/date-time-picker/parts/Pickers/Calendar/CalendarDaysList.js +4 -4
- package/esm/date-time-picker/parts/Pickers/Calendar/CalendarHead.js +6 -14
- package/esm/date-time-picker/parts/Pickers/Calendar/CalendarIconTrigger.js +1 -1
- package/esm/date-time-picker/parts/Pickers/Calendar/Day.js +8 -10
- package/esm/date-time-picker/parts/Pickers/Calendar/Styleds.js +44 -14
- package/esm/date-time-picker/parts/Pickers/Calendar/useConfigCalendarCTX.js +0 -1
- package/esm/date-time-picker/parts/Pickers/Calendar/useCurrentDisplayedMonthYearLogic.js +2 -1
- package/esm/date-time-picker/parts/Pickers/Calendar/useFocusLogic.js +0 -1
- package/esm/date-time-picker/parts/Pickers/Calendar/usePopperTriggerLogic.js +3 -5
- package/esm/date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +1 -1
- package/esm/date-time-picker/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js +3 -5
- package/esm/date-time-picker/parts/Pickers/TimeWheel/HoursList.js +5 -7
- package/esm/date-time-picker/parts/Pickers/TimeWheel/MeridiemList.js +6 -8
- package/esm/date-time-picker/parts/Pickers/TimeWheel/MinutesList.js +5 -7
- package/esm/date-time-picker/parts/Pickers/TimeWheel/SecondsList.js +2 -2
- package/esm/date-time-picker/parts/Pickers/TimeWheel/Styleds.js +47 -14
- package/esm/date-time-picker/parts/Pickers/TimeWheel/TimeWheelContent.js +1 -1
- package/esm/date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +1 -1
- package/esm/date-time-picker/parts/Pickers/TimeWheel/useCurrentDisplayedWheelsLogic.js +3 -3
- package/esm/date-time-picker/parts/Pickers/TimeWheel/usePopperTriggerLogic.js +2 -5
- package/esm/date-time-picker/parts/Styleds.js +12 -6
- package/esm/date-time-picker/parts/TimeInputs/HHInput.js +2 -4
- package/esm/date-time-picker/parts/TimeInputs/MeridiemInput.js +3 -8
- package/esm/date-time-picker/parts/TimeInputs/MinutesInput.js +3 -7
- package/esm/date-time-picker/parts/TimeInputs/useTimeInputs.js +14 -26
- package/esm/date-time-picker/utils/dateHelpers.js +17 -34
- package/esm/date-time-picker/utils/hooks/useOnClickOutside.js +1 -3
- package/esm/date-time-picker/utils/stringHelpers.js +5 -11
- package/esm/input-group/styled.js +79 -9
- package/esm/large-text-input/DSControlledLargeTextInput.js +1 -1
- package/esm/large-text-input/styles.js +27 -9
- package/esm/mask-hook/hooks/useNumberMask.js +1 -5
- package/esm/mask-hook/hooks/usePhoneMask.js +1 -4
- package/esm/mask-hook/hooks/useRegExpMask.js +4 -7
- package/esm/mask-hook/hooks/useSSNMask.js +1 -4
- package/esm/mask-hook/hooks/useZipCodeMask.js +1 -4
- package/esm/mask-hook/utils/addSpecialCharacters.js +0 -1
- package/esm/mask-hook/utils/flatStringArray.js +0 -1
- package/esm/text-input/config/useInputText.js +0 -1
- package/esm/text-input/styled/borders.js +18 -7
- package/esm/text-input/styled/components.js +49 -6
- package/esm/toggle/ControlledToggle.js +0 -1
- package/esm/toggle/styles.js +7 -5
- package/package.json +15 -15
- package/types/text-input/config/useInputText.d.ts +3 -3
|
@@ -9,7 +9,6 @@ require('core-js/modules/esnext.async-iterator.some.js');
|
|
|
9
9
|
require('core-js/modules/esnext.iterator.some.js');
|
|
10
10
|
require('core-js/modules/esnext.async-iterator.find.js');
|
|
11
11
|
require('core-js/modules/esnext.iterator.find.js');
|
|
12
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
13
12
|
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
14
13
|
require('core-js/modules/esnext.iterator.for-each.js');
|
|
15
14
|
var constants = require('../constants.js');
|
|
@@ -21,11 +20,11 @@ const isSelectedValueMultiple = value => Array.isArray(value);
|
|
|
21
20
|
const isSelected = (value, activeOption) => {
|
|
22
21
|
if (isSelectedValueMultiple(value)) {
|
|
23
22
|
const multiValue = value;
|
|
24
|
-
return multiValue.some(item =>
|
|
23
|
+
return multiValue.some(item => item?.value === activeOption?.value);
|
|
25
24
|
}
|
|
26
25
|
|
|
27
26
|
const singleValue = value;
|
|
28
|
-
return
|
|
27
|
+
return singleValue?.value === activeOption.value;
|
|
29
28
|
};
|
|
30
29
|
const findInCircularList = function (list, from, criteria) {
|
|
31
30
|
let step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
|
|
@@ -75,8 +74,6 @@ const getSuggestedValueOnChange = (selectedOption, selectedValues) => {
|
|
|
75
74
|
};
|
|
76
75
|
const filterOptions = (inputValue, options) => options.filter(option => option.type === constants.MENU_OPTION_TYPES.OPTION && option.label.toLowerCase().includes(inputValue.toLowerCase()));
|
|
77
76
|
const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
|
|
78
|
-
var _items2;
|
|
79
|
-
|
|
80
77
|
const items = [];
|
|
81
78
|
if (optionsToParse) optionsToParse.forEach(option => {
|
|
82
79
|
// const isSelectedValue = multiSelectedValue.find((item) => item?.dsId === option.dsId);
|
|
@@ -85,9 +82,7 @@ const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
|
|
|
85
82
|
}
|
|
86
83
|
|
|
87
84
|
if (option.type === constants.MENU_OPTION_TYPES.SECTION) {
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
if (((_items = items[items.length - 1]) === null || _items === void 0 ? void 0 : _items.type) === constants.MENU_OPTION_TYPES.SECTION) {
|
|
85
|
+
if (items[items.length - 1]?.type === constants.MENU_OPTION_TYPES.SECTION) {
|
|
91
86
|
items[items.length - 1] = option;
|
|
92
87
|
} else {
|
|
93
88
|
items.push(option);
|
|
@@ -95,7 +90,7 @@ const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
|
|
|
95
90
|
}
|
|
96
91
|
});
|
|
97
92
|
|
|
98
|
-
if (
|
|
93
|
+
if (items[items.length - 1]?.type === constants.MENU_OPTION_TYPES.SECTION) {
|
|
99
94
|
items.pop();
|
|
100
95
|
}
|
|
101
96
|
|
|
@@ -2,18 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
7
5
|
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
8
6
|
require('core-js/modules/esnext.iterator.constructor.js');
|
|
9
7
|
require('core-js/modules/esnext.iterator.filter.js');
|
|
10
8
|
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
11
9
|
require('core-js/modules/esnext.iterator.for-each.js');
|
|
10
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
12
11
|
var React = require('react');
|
|
13
12
|
require('../../date-time-picker/ControlledDateTimePicker.js');
|
|
14
13
|
require('core-js/modules/esnext.async-iterator.map.js');
|
|
15
14
|
require('core-js/modules/esnext.iterator.map.js');
|
|
16
|
-
require('core-js/modules/es.string.replace.js');
|
|
17
15
|
var dateHelpers = require('../../date-time-picker/utils/dateHelpers.js');
|
|
18
16
|
|
|
19
17
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -54,7 +52,7 @@ const useRangePickerLogic = _ref => {
|
|
|
54
52
|
const dateToString = calendarChangeIsFrom ? toDate : changedDay;
|
|
55
53
|
const dateTo = dateHelpers.getDayFromDateString(dateToString); // we force the "from" to ALWAYS be before the "to" date
|
|
56
54
|
|
|
57
|
-
const isToBeforeFrom =
|
|
55
|
+
const isToBeforeFrom = dateTo?.getTime() < dateFrom?.getTime();
|
|
58
56
|
const newDateFromString = isToBeforeFrom ? dateToString : dateFromString;
|
|
59
57
|
const forcingFromDatePick = isToBeforeFrom ? !calendarChangeIsFrom : false;
|
|
60
58
|
const newDateToString = isToBeforeFrom ? dateFromString : dateToString;
|
|
@@ -129,19 +127,17 @@ const useRangePickerLogic = _ref => {
|
|
|
129
127
|
}, [getChangedDayStringValues, onFromDateChange, onToDateChange]);
|
|
130
128
|
const getIsStartRangeDay = React.useCallback(dayString => dayString === fromDate, [fromDate]);
|
|
131
129
|
const getIsDayInRange = React.useCallback(dayString => {
|
|
132
|
-
var _getDayFromDateString;
|
|
133
|
-
|
|
134
130
|
const dayFrom = dateHelpers.getDayFromDateString(fromDate);
|
|
135
131
|
const dayTo = dateHelpers.getDayFromDateString(toDate);
|
|
136
132
|
if (!dayFrom || !dayTo || !dayString) return false;
|
|
137
|
-
const newDayTime =
|
|
133
|
+
const newDayTime = dateHelpers.getDayFromDateString(dayString)?.getTime();
|
|
138
134
|
return newDayTime <= dayTo.getTime() && newDayTime >= dayFrom.getTime();
|
|
139
135
|
}, [fromDate, toDate]);
|
|
140
136
|
const getIsEndRangeDay = React.useCallback(dayString => dayString === toDate, [toDate]);
|
|
141
137
|
const getIsToBeforeFrom = React.useCallback((fromString, toString) => {
|
|
142
138
|
const dateFrom = dateHelpers.getDayFromDateString(fromString);
|
|
143
139
|
const dateTo = dateHelpers.getDayFromDateString(toString);
|
|
144
|
-
return
|
|
140
|
+
return dateTo?.getTime() < dateFrom?.getTime();
|
|
145
141
|
}, []);
|
|
146
142
|
const handleFromDateChange = React.useCallback((newVal, metaInfo) => {
|
|
147
143
|
const isIncorrectOrder = getIsToBeforeFrom(newVal, toDate);
|
|
@@ -8,8 +8,6 @@ var ControlledDateTimePicker = require('../../date-time-picker/ControlledDateTim
|
|
|
8
8
|
var ControlledDateTimePickerTypes = require('../../date-time-picker/ControlledDateTimePickerTypes.js');
|
|
9
9
|
require('core-js/modules/esnext.async-iterator.map.js');
|
|
10
10
|
require('core-js/modules/esnext.iterator.map.js');
|
|
11
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
12
|
-
require('core-js/modules/es.string.replace.js');
|
|
13
11
|
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
14
12
|
require('core-js/modules/esnext.iterator.constructor.js');
|
|
15
13
|
require('core-js/modules/esnext.iterator.filter.js');
|
|
@@ -9,8 +9,6 @@ var ControlledDateTimePicker = require('../../date-time-picker/ControlledDateTim
|
|
|
9
9
|
var ControlledDateTimePickerTypes = require('../../date-time-picker/ControlledDateTimePickerTypes.js');
|
|
10
10
|
require('core-js/modules/esnext.async-iterator.map.js');
|
|
11
11
|
require('core-js/modules/esnext.iterator.map.js');
|
|
12
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
13
|
-
require('core-js/modules/es.string.replace.js');
|
|
14
12
|
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
15
13
|
require('core-js/modules/esnext.iterator.constructor.js');
|
|
16
14
|
require('core-js/modules/esnext.iterator.filter.js');
|
|
@@ -9,8 +9,6 @@ var ControlledDateTimePicker = require('../../date-time-picker/ControlledDateTim
|
|
|
9
9
|
var ControlledDateTimePickerTypes = require('../../date-time-picker/ControlledDateTimePickerTypes.js');
|
|
10
10
|
require('core-js/modules/esnext.async-iterator.map.js');
|
|
11
11
|
require('core-js/modules/esnext.iterator.map.js');
|
|
12
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
13
|
-
require('core-js/modules/es.string.replace.js');
|
|
14
12
|
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
15
13
|
require('core-js/modules/esnext.iterator.constructor.js');
|
|
16
14
|
require('core-js/modules/esnext.iterator.filter.js');
|
|
@@ -89,7 +89,7 @@ const useChangeHandlers = _ref => {
|
|
|
89
89
|
appOnTimeChange(appTimeString, metaInfo); // don't do this on useEffect to avoid complete chaos
|
|
90
90
|
|
|
91
91
|
setTimeString(newTimeString);
|
|
92
|
-
const newDateTimeString =
|
|
92
|
+
const newDateTimeString = `${newDateString} ${newTimeString}`;
|
|
93
93
|
|
|
94
94
|
const newMetaInfo = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaInfo), getTimeMetaInfo(newTimeString, metaInfo)), getDateMetaInfo(newDateString, metaInfo)), {}, {
|
|
95
95
|
newDateString,
|
|
@@ -106,7 +106,7 @@ const useChangeHandlers = _ref => {
|
|
|
106
106
|
appOnDateChange(appDateString, metaInfo); // don't do this on useEffect to avoid complete chaos
|
|
107
107
|
|
|
108
108
|
setTempDateString(newDateString);
|
|
109
|
-
const newDateTimeString =
|
|
109
|
+
const newDateTimeString = `${newDateString} ${tempTimeString}`;
|
|
110
110
|
|
|
111
111
|
const newMetaInfo = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaInfo), getTimeMetaInfo(tempTimeString, metaInfo)), getDateMetaInfo(newDateString, metaInfo)), {}, {
|
|
112
112
|
newDateString,
|
|
@@ -122,7 +122,7 @@ const useChangeHandlers = _ref => {
|
|
|
122
122
|
appOnTimeChange(appTimeString, metaInfo); // don't do this on useEffect to avoid complete chaos
|
|
123
123
|
|
|
124
124
|
setTimeString(newTimeString);
|
|
125
|
-
const newDateTimeString =
|
|
125
|
+
const newDateTimeString = `${tempDateString} ${newTimeString}`;
|
|
126
126
|
|
|
127
127
|
const newMetaInfo = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaInfo), getTimeMetaInfo(newTimeString, metaInfo)), getDateMetaInfo(tempDateString, metaInfo)), {}, {
|
|
128
128
|
newDateTimeString,
|
|
@@ -68,7 +68,7 @@ const useControlledDateTimePicker = props => {
|
|
|
68
68
|
isDateTimeSelector,
|
|
69
69
|
isWithTimeInputs
|
|
70
70
|
} = flags;
|
|
71
|
-
const ariaCurrentValueForInputs =
|
|
71
|
+
const ariaCurrentValueForInputs = `current values: ${isWithDateInputs ? `${announcedDateValues}` : ''}${isDateTimeSelector ? ', ' : ''}${isWithTimeInputs ? `${announcedTimeValues}` : ''}`;
|
|
72
72
|
const ctx = React__default["default"].useMemo(() => _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
|
|
73
73
|
props: propsWithDefaults,
|
|
74
74
|
ariaCurrentValueForInputs,
|
|
@@ -42,8 +42,8 @@ const useGetDestructuredDateValues = _ref => {
|
|
|
42
42
|
const yearNum = numberHelpers.convertToPositiveNumberIfPossible(year);
|
|
43
43
|
const announcedMonth = monthNum !== -1 ? constants.monthNames[monthNum - 1] : 'empty month';
|
|
44
44
|
const announcedDay = dayNum !== -1 ? constants.announcableCardinalDays[dayNum] : 'empty day';
|
|
45
|
-
const announcedYear = yearNum !== -1 ? stringHelpers.fillStringWithPlaceHolders(
|
|
46
|
-
const announcedDateValues =
|
|
45
|
+
const announcedYear = yearNum !== -1 ? stringHelpers.fillStringWithPlaceHolders(`${yearNum}`, 4, '0') : 'empty year';
|
|
46
|
+
const announcedDateValues = `${announcedMonth}, ${announcedDay}, ${announcedYear}`;
|
|
47
47
|
return React.useMemo(() => ({
|
|
48
48
|
month,
|
|
49
49
|
day,
|
|
@@ -77,12 +77,12 @@ const useGetDestructuredTimeValues = _ref2 => {
|
|
|
77
77
|
const hoursNum = numberHelpers.convertToPositiveNumberIfPossible(hours);
|
|
78
78
|
const minutesNum = numberHelpers.convertToPositiveNumberIfPossible(minutes); // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...
|
|
79
79
|
|
|
80
|
-
const announcedHours = hoursNum !== -1 ?
|
|
80
|
+
const announcedHours = hoursNum !== -1 ? `${hoursNum}` : 'empty hours'; // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...
|
|
81
81
|
|
|
82
|
-
const announcedMinutes = minutesNum !== -1 ?
|
|
82
|
+
const announcedMinutes = minutesNum !== -1 ? `${minutesNum}` : 'empty minutes';
|
|
83
83
|
const announcedMeridiem = // eslint-disable-next-line no-nested-ternary
|
|
84
|
-
meridiem === 'PM' ?
|
|
85
|
-
const announcedTimeValues =
|
|
84
|
+
meridiem === 'PM' ? `post meridiem` : meridiem === 'AM' ? 'ante meridiem' : 'empty meriediem';
|
|
85
|
+
const announcedTimeValues = `${announcedHours}, ${announcedMinutes}, ${announcedMeridiem}`;
|
|
86
86
|
return React.useMemo(() => ({
|
|
87
87
|
hours,
|
|
88
88
|
minutes,
|
|
@@ -27,7 +27,7 @@ const useGetPropsBasedOnType = propsWithDefaults => {
|
|
|
27
27
|
const appOnMonthChange = (isDateTime || isDate) && propsWithDefaults.onMonthChange ? propsWithDefaults.onMonthChange : noop;
|
|
28
28
|
const appOnDayChange = (isDateTime || isDate) && propsWithDefaults.onDayChange ? propsWithDefaults.onDayChange : noop;
|
|
29
29
|
const appOnYearChange = (isDateTime || isDate) && propsWithDefaults.onYearChange ? propsWithDefaults.onYearChange : noop;
|
|
30
|
-
const emptyPickerStartingMonthDefault =
|
|
30
|
+
const emptyPickerStartingMonthDefault = `${new Date().getMonth() + 1}/__/${new Date().getFullYear()}`;
|
|
31
31
|
const emptyPickerStartingMonth = (isDateTime || isDate) && propsWithDefaults.emptyPickerStartingMonth ? propsWithDefaults.emptyPickerStartingMonth : emptyPickerStartingMonthDefault;
|
|
32
32
|
const onCalendarOpenFocusedDay = (isDateTime || isDate) && propsWithDefaults.onCalendarOpenFocusedDay ? propsWithDefaults.onCalendarOpenFocusedDay : undefined;
|
|
33
33
|
/* -------------------------- -------------- --------------------------*/
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
6
5
|
var React = require('react');
|
|
7
6
|
|
|
7
|
+
/* eslint-disable complexity */
|
|
8
8
|
const useGetReferences = _ref => {
|
|
9
9
|
let {
|
|
10
10
|
isWithDateInputs,
|
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
require('core-js/modules/web.dom-collections.iterator.js');
|
|
6
5
|
var React = require('react');
|
|
7
6
|
var typeGuards = require('../utils/typeGuards.js');
|
|
8
7
|
var stringHelpers = require('../utils/stringHelpers.js');
|
|
9
8
|
|
|
9
|
+
/* eslint-disable complexity */
|
|
10
10
|
const useRelevantValueFromProps = props => {
|
|
11
11
|
const dateStringFromProps = React.useMemo(() => {
|
|
12
12
|
if (typeGuards.getIsDateTime(props)) return props.dateTime !== '' ? stringHelpers.dateTimeToDate(props.dateTime) : '__/__/____';
|
|
@@ -2,46 +2,77 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
+
require('core-js/modules/es.error.cause.js');
|
|
5
6
|
var stringHelpers = require('../utils/stringHelpers.js');
|
|
6
7
|
var numberHelpers = require('../utils/numberHelpers.js');
|
|
7
8
|
var typeGuards = require('../utils/typeGuards.js');
|
|
8
9
|
|
|
9
|
-
|
|
10
|
-
|
|
10
|
+
const PREPEND = `ControlledDateTimePicker:
|
|
11
|
+
Invalid configuration detected::
|
|
12
|
+
|
|
13
|
+
`;
|
|
11
14
|
const NOT_A_DEFECT = ''; // '\n\n\t\tThis is not a defect, please check\n\n\t\thttps://qa.dimsum.rd.elliemae.io/?path=/story/components-desktop-components-d-controlledform-date-time-picker--basic\n\n\t\tfor instructions on how to use the component correctly\n\n';
|
|
12
15
|
|
|
13
|
-
const INLINE_RECEIVED_PREPEND =
|
|
16
|
+
const INLINE_RECEIVED_PREPEND = `
|
|
17
|
+
|
|
18
|
+
Received:`;
|
|
14
19
|
|
|
15
20
|
const throwInvalidDateTimeError = invalidValue => {
|
|
16
|
-
throw new Error(
|
|
21
|
+
throw new Error(`${PREPEND}the "dateTime" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
|
|
17
22
|
};
|
|
18
23
|
|
|
19
24
|
const throwInvalidDaterror = invalidValue => {
|
|
20
|
-
throw new Error(
|
|
25
|
+
throw new Error(`${PREPEND}the "date" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
|
|
21
26
|
};
|
|
22
27
|
|
|
23
28
|
const throwInvalidTimerror = invalidValue => {
|
|
24
|
-
throw new Error(
|
|
29
|
+
throw new Error(`${PREPEND}the "time" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
|
|
25
30
|
};
|
|
26
31
|
|
|
27
32
|
const throwUncontrolledDateError = (date, onDateChange) => {
|
|
28
|
-
throw new Error(
|
|
33
|
+
throw new Error(`${PREPEND}you are trying to use a date selector while providing a non-string "date" or providing a non-function to "onDateChange"
|
|
34
|
+
the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations
|
|
35
|
+
|
|
36
|
+
Received:
|
|
37
|
+
date: ${date}(${typeof date})
|
|
38
|
+
onDateChange: (${typeof onDateChange})
|
|
39
|
+
${NOT_A_DEFECT}`);
|
|
29
40
|
};
|
|
30
41
|
|
|
31
42
|
const throwUncontrolledTimeError = (time, onTimeChange) => {
|
|
32
|
-
throw new Error(
|
|
43
|
+
throw new Error(`${PREPEND}you are trying to use a time selector while providing a non-string "time" or providing a non-function to "onTimeChange"
|
|
44
|
+
the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations
|
|
45
|
+
|
|
46
|
+
Received:
|
|
47
|
+
time: ${time}(${typeof time})
|
|
48
|
+
onTimeChange: (${typeof onTimeChange})
|
|
49
|
+
${NOT_A_DEFECT}`);
|
|
33
50
|
};
|
|
34
51
|
|
|
35
52
|
const throwUncontrolledDateTimeError = (dateTime, onDateTimeChange) => {
|
|
36
|
-
throw new Error(
|
|
53
|
+
throw new Error(`${PREPEND}you are trying to use a date-time selector while providing a non-string "dateTime" or providing a non-function to "onDateTimeChange"
|
|
54
|
+
the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations
|
|
55
|
+
|
|
56
|
+
Received:
|
|
57
|
+
dateTime: ${dateTime}(${typeof dateTime})
|
|
58
|
+
onDateTimeChange: (${typeof onDateTimeChange})
|
|
59
|
+
${NOT_A_DEFECT}`);
|
|
37
60
|
};
|
|
38
61
|
|
|
39
62
|
const throwInvalidEmptyPickerStartingMonthError = emptyPickerStartingMonth => {
|
|
40
|
-
throw new Error(
|
|
63
|
+
throw new Error(`${PREPEND}the provided emptyPickerStartingMonth props is invalid. please provide a string with the format mm/__/yyyy, (mm 01~12, yyyy 0001~9999)
|
|
64
|
+
|
|
65
|
+
Received:
|
|
66
|
+
${emptyPickerStartingMonth}(${typeof emptyPickerStartingMonth})
|
|
67
|
+
${NOT_A_DEFECT}`);
|
|
41
68
|
};
|
|
42
69
|
|
|
43
70
|
const throwInvalidOnCalendarOpenFocusedDayError = onCalendarOpenFocusedDay => {
|
|
44
|
-
throw new Error(
|
|
71
|
+
throw new Error(`${PREPEND}the provided onCalendarOpenFocusedDay props is invalid. please provide a string with the format mm/dd/yyyy, (mm 01~12, dd 01~31, yyyy 0001~9999)
|
|
72
|
+
|
|
73
|
+
Received:
|
|
74
|
+
${onCalendarOpenFocusedDay}(${typeof onCalendarOpenFocusedDay})
|
|
75
|
+
${NOT_A_DEFECT}`);
|
|
45
76
|
};
|
|
46
77
|
|
|
47
78
|
const useValidateProps = props => {
|
|
@@ -47,10 +47,8 @@ const ClearButton = () => {
|
|
|
47
47
|
size: DSButton.BUTTON_SIZES.M,
|
|
48
48
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CLEAR_BUTTON,
|
|
49
49
|
innerRef: DomElem => {
|
|
50
|
-
var _DomElem$focus;
|
|
51
|
-
|
|
52
50
|
clearButtonRef.current = DomElem;
|
|
53
|
-
if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem
|
|
51
|
+
if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem?.focus?.();
|
|
54
52
|
},
|
|
55
53
|
onClick: onClearClick,
|
|
56
54
|
onKeyDown: onClearButtonKeyDown
|
|
@@ -33,9 +33,7 @@ const DDInput = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
33
33
|
isFocused
|
|
34
34
|
} = _ref;
|
|
35
35
|
const validateOnChange = React.useCallback(e => {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
if (isInvalidDay(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
|
|
36
|
+
if (isInvalidDay(e?.target?.value)) {
|
|
39
37
|
e.preventDefault();
|
|
40
38
|
return;
|
|
41
39
|
}
|
|
@@ -49,13 +47,11 @@ const DDInput = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
49
47
|
onKeyDown: onKeyDown,
|
|
50
48
|
value: value,
|
|
51
49
|
ref: DomElem => {
|
|
52
|
-
var _DomElem$focus;
|
|
53
|
-
|
|
54
50
|
contextRef.current = DomElem;
|
|
55
|
-
if (isFocused) DomElem
|
|
51
|
+
if (isFocused) DomElem?.focus?.();
|
|
56
52
|
},
|
|
57
53
|
placeholder: placeholder,
|
|
58
|
-
"aria-label":
|
|
54
|
+
"aria-label": `day input field, ${ariaCurrentValueForInputs}`,
|
|
59
55
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY,
|
|
60
56
|
disabled: disabled,
|
|
61
57
|
"aria-disabled": disabled
|
|
@@ -34,9 +34,7 @@ const MMInput = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
34
34
|
isFocused
|
|
35
35
|
} = _ref;
|
|
36
36
|
const validateOnChange = React.useCallback(e => {
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
if (isInvalidMonth(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
|
|
37
|
+
if (isInvalidMonth(e?.target?.value)) {
|
|
40
38
|
e.preventDefault();
|
|
41
39
|
return;
|
|
42
40
|
}
|
|
@@ -51,13 +49,11 @@ const MMInput = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
51
49
|
onKeyDown: onKeyDown,
|
|
52
50
|
value: value,
|
|
53
51
|
ref: DomElem => {
|
|
54
|
-
var _DomElem$focus;
|
|
55
|
-
|
|
56
52
|
contextRef.current = DomElem;
|
|
57
|
-
if (isFocused) DomElem
|
|
53
|
+
if (isFocused) DomElem?.focus?.();
|
|
58
54
|
},
|
|
59
55
|
placeholder: placeholder,
|
|
60
|
-
"aria-label":
|
|
56
|
+
"aria-label": `month input field, ${ariaCurrentValueForInputs}`,
|
|
61
57
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.MONTH,
|
|
62
58
|
disabled: disabled,
|
|
63
59
|
"aria-disabled": disabled
|
|
@@ -33,9 +33,7 @@ const YYYYInput = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
33
33
|
isFocused
|
|
34
34
|
} = _ref;
|
|
35
35
|
const validateOnChange = React.useCallback(e => {
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
if (isInvalidYear(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
|
|
36
|
+
if (isInvalidYear(e?.target?.value)) {
|
|
39
37
|
e.preventDefault();
|
|
40
38
|
return;
|
|
41
39
|
}
|
|
@@ -49,13 +47,11 @@ const YYYYInput = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
49
47
|
onKeyDown: onKeyDown,
|
|
50
48
|
value: value,
|
|
51
49
|
ref: DomElem => {
|
|
52
|
-
var _DomElem$focus;
|
|
53
|
-
|
|
54
50
|
contextRef.current = DomElem;
|
|
55
|
-
if (isFocused) DomElem
|
|
51
|
+
if (isFocused) DomElem?.focus?.();
|
|
56
52
|
},
|
|
57
53
|
placeholder: placeholder,
|
|
58
|
-
"aria-label":
|
|
54
|
+
"aria-label": `year input field, ${ariaCurrentValueForInputs}`,
|
|
59
55
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR,
|
|
60
56
|
disabled: disabled,
|
|
61
57
|
"aria-disabled": disabled
|
|
@@ -75,9 +75,7 @@ const useDateInputs = () => {
|
|
|
75
75
|
trackFocusMonthInput();
|
|
76
76
|
}, [trackFocusMonthInput]);
|
|
77
77
|
const onMonthChange = React.useCallback(e => {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
let newMonth = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value; // converts months 2~9 to 02~09
|
|
78
|
+
let newMonth = e?.target?.value; // converts months 2~9 to 02~09
|
|
81
79
|
|
|
82
80
|
if (Number.parseInt(newMonth, 10) > 1) newMonth = stringHelpers.prependStringWithPlaceHolders(newMonth, 2);
|
|
83
81
|
handleChangeMonth(newMonth, e); // auto-advance functionality:
|
|
@@ -100,12 +98,12 @@ const useDateInputs = () => {
|
|
|
100
98
|
const monthInteger = Number.isNaN(monthStringConvertedToInteger) ? 0 : monthStringConvertedToInteger;
|
|
101
99
|
let newMonth;
|
|
102
100
|
if (key === 'ArrowUp') newMonth = monthInteger + 1 <= 12 ? monthInteger + 1 : monthInteger;else newMonth = monthInteger - 1 > 0 ? monthInteger - 1 : 1;
|
|
103
|
-
newMonth = stringHelpers.prependStringWithPlaceHolders(
|
|
101
|
+
newMonth = stringHelpers.prependStringWithPlaceHolders(`${newMonth}`, 2);
|
|
104
102
|
handleChangeMonth(newMonth, e);
|
|
105
103
|
}
|
|
106
104
|
|
|
107
105
|
if (!Number.isNaN(monthStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\')) {
|
|
108
|
-
const newMonth = stringHelpers.prependStringWithPlaceHolders(
|
|
106
|
+
const newMonth = stringHelpers.prependStringWithPlaceHolders(`${monthStringConvertedToInteger}`, 2);
|
|
109
107
|
handleChangeMonth(newMonth, e); // auto-advance functionality:
|
|
110
108
|
|
|
111
109
|
if (newMonth.length === 2) trackFocusDayInput();
|
|
@@ -115,9 +113,7 @@ const useDateInputs = () => {
|
|
|
115
113
|
if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();
|
|
116
114
|
}, [month, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, trackFocusDayInput, handleChangeMonth]);
|
|
117
115
|
const onMonthBlur = React.useCallback(e => {
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
const newMonth = e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value;
|
|
116
|
+
const newMonth = e?.target?.value;
|
|
121
117
|
if (newMonth === '0') handleChangeMonth('01', e, {
|
|
122
118
|
isAutomaticFillTrigger: true
|
|
123
119
|
});else if (newMonth.length > 0 && newMonth.length < 2) handleChangeMonth(stringHelpers.prependStringWithPlaceHolders(newMonth, 2), e, {
|
|
@@ -143,9 +139,7 @@ const useDateInputs = () => {
|
|
|
143
139
|
trackFocusDayInput();
|
|
144
140
|
}, [trackFocusDayInput]);
|
|
145
141
|
const onDayChange = React.useCallback(e => {
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
let newDay = e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value; // converts days 4~9 to 04~09
|
|
142
|
+
let newDay = e?.target?.value; // converts days 4~9 to 04~09
|
|
149
143
|
|
|
150
144
|
if (Number.parseInt(newDay, 10) > 3) newDay = stringHelpers.prependStringWithPlaceHolders(newDay, 2);
|
|
151
145
|
handleChangeDay(newDay, e); // auto-advance functionality:
|
|
@@ -168,19 +162,19 @@ const useDateInputs = () => {
|
|
|
168
162
|
const dayInteger = Number.isNaN(dayStringConvertedToInteger) ? 0 : dayStringConvertedToInteger;
|
|
169
163
|
let newDay;
|
|
170
164
|
if (key === 'ArrowUp') newDay = dayInteger + 1 <= 31 ? dayInteger + 1 : dayInteger;else newDay = dayInteger - 1 > 0 ? dayInteger - 1 : 1;
|
|
171
|
-
newDay = stringHelpers.prependStringWithPlaceHolders(
|
|
165
|
+
newDay = stringHelpers.prependStringWithPlaceHolders(`${newDay}`, 2);
|
|
172
166
|
handleChangeDay(newDay, e);
|
|
173
167
|
}
|
|
174
168
|
|
|
175
169
|
if (!Number.isNaN(dayStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\')) {
|
|
176
|
-
const newDay = stringHelpers.prependStringWithPlaceHolders(
|
|
170
|
+
const newDay = stringHelpers.prependStringWithPlaceHolders(`${dayStringConvertedToInteger}`, 2);
|
|
177
171
|
handleChangeDay(newDay, e); // auto-advance functionality:
|
|
178
172
|
|
|
179
173
|
if (newDay.length === 2) trackFocusYearInput();
|
|
180
174
|
} // regressive backspace functionality
|
|
181
175
|
|
|
182
176
|
|
|
183
|
-
if (key === 'Backspace' &&
|
|
177
|
+
if (key === 'Backspace' && day?.length === 0) {
|
|
184
178
|
trackFocusMonthInput();
|
|
185
179
|
} // focus last fragment on fill with now
|
|
186
180
|
|
|
@@ -188,9 +182,7 @@ const useDateInputs = () => {
|
|
|
188
182
|
if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();
|
|
189
183
|
}, [day, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, handleChangeDay, trackFocusYearInput, trackFocusMonthInput]);
|
|
190
184
|
const onDayBlur = React.useCallback(e => {
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
const newDay = e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : _e$target4.value;
|
|
185
|
+
const newDay = e?.target?.value;
|
|
194
186
|
if (newDay === '0') handleChangeDay('01', e, {
|
|
195
187
|
isAutomaticFillTrigger: true
|
|
196
188
|
});else if (newDay.length > 0 && newDay.length < 2) handleChangeDay(stringHelpers.prependStringWithPlaceHolders(newDay, 2), e, {
|
|
@@ -216,9 +208,7 @@ const useDateInputs = () => {
|
|
|
216
208
|
trackFocusYearInput();
|
|
217
209
|
}, [trackFocusYearInput]);
|
|
218
210
|
const onYearChange = React.useCallback(e => {
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
const newYear = e === null || e === void 0 ? void 0 : (_e$target5 = e.target) === null || _e$target5 === void 0 ? void 0 : _e$target5.value;
|
|
211
|
+
const newYear = e?.target?.value;
|
|
222
212
|
handleChangeYear(newYear, e); // auto-advance functionality:
|
|
223
213
|
|
|
224
214
|
if (newYear.length === 4) {
|
|
@@ -237,12 +227,12 @@ const useDateInputs = () => {
|
|
|
237
227
|
|
|
238
228
|
const yearStringConvertedToInteger = Number.parseInt(year, 10);
|
|
239
229
|
const yearInteger = Number.isNaN(yearStringConvertedToInteger) ? 0 : yearStringConvertedToInteger;
|
|
240
|
-
let newYear = yearInteger !== 0 ? stringHelpers.fillStringWithPlaceHolders(
|
|
230
|
+
let newYear = yearInteger !== 0 ? stringHelpers.fillStringWithPlaceHolders(`${yearInteger}`, 4, '0') : '';
|
|
241
231
|
|
|
242
232
|
if (key === 'ArrowUp' || key === 'ArrowDown') {
|
|
243
233
|
let newYearInteger;
|
|
244
234
|
if (key === 'ArrowUp') newYearInteger = yearInteger + 1 <= 9999 ? yearInteger + 1 : yearInteger;else newYearInteger = yearInteger - 1 > 0 ? yearInteger - 1 : 1;
|
|
245
|
-
newYear = stringHelpers.prependStringWithPlaceHolders(
|
|
235
|
+
newYear = stringHelpers.prependStringWithPlaceHolders(`${newYearInteger}`, 4);
|
|
246
236
|
}
|
|
247
237
|
|
|
248
238
|
const isAutomaticFillTrigger = newYear !== year && ['Tab', ' '].includes(key);
|
|
@@ -275,7 +265,7 @@ const useDateInputs = () => {
|
|
|
275
265
|
/* ********** regressive backspace logic ********** */
|
|
276
266
|
|
|
277
267
|
|
|
278
|
-
if (key === 'Backspace' &&
|
|
268
|
+
if (key === 'Backspace' && year?.length === 0) {
|
|
279
269
|
trackFocusDayInput();
|
|
280
270
|
} // focus last fragment on fill with now
|
|
281
271
|
|
|
@@ -28,7 +28,7 @@ const CalendarDaysList = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
28
28
|
children: [invisibleFirstDay ? /*#__PURE__*/_jsx__default["default"](Day.Day, {
|
|
29
29
|
metaDay: invisibleFirstDay,
|
|
30
30
|
isInvisible: true
|
|
31
|
-
},
|
|
31
|
+
}, `ds-calendar-${invisibleFirstDay.day.toString()}`) : null, daysMatrixByWeekday.map((week, i) => /*#__PURE__*/_jsx__default["default"](Styleds.StyledWeekDaysListWrapper, {
|
|
32
32
|
role: "row",
|
|
33
33
|
"aria-rowindex": i + 1,
|
|
34
34
|
cols: ['32px', '32px', '32px', '32px', '32px', '32px', '32px'],
|
|
@@ -37,13 +37,13 @@ const CalendarDaysList = /*#__PURE__*/React__default["default"].memo(_ref => {
|
|
|
37
37
|
px: "2px",
|
|
38
38
|
justifyContent: "space-between",
|
|
39
39
|
alignItems: "center"
|
|
40
|
-
},
|
|
40
|
+
}, `ds-calendar-week-${week[0].day.toString()}-${week[6].day.toString()}`, week.map((metaDay, z) => /*#__PURE__*/_jsx__default["default"](Day.Day, {
|
|
41
41
|
metaDay: metaDay,
|
|
42
42
|
colIndex: z + 1
|
|
43
|
-
},
|
|
43
|
+
}, `ds-calendar-${metaDay.day.toString()}`)))), invisibleLastDay ? /*#__PURE__*/_jsx__default["default"](Day.Day, {
|
|
44
44
|
metaDay: invisibleLastDay,
|
|
45
45
|
isInvisible: true
|
|
46
|
-
},
|
|
46
|
+
}, `ds-calendar-${invisibleLastDay.day.toString()}`) : null]
|
|
47
47
|
});
|
|
48
48
|
});
|
|
49
49
|
|