@elliemae/ds-controlled-form 2.4.3-rc.8 → 2.4.3-rc.9
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/date-time-picker/parts/ClearButton/ClearButton.js +2 -1
- package/cjs/date-time-picker/parts/Pickers/Calendar/CalendarHead.js +8 -4
- package/cjs/date-time-picker/parts/Pickers/Calendar/CalendarIconTrigger.js +2 -1
- package/cjs/date-time-picker/parts/Pickers/Calendar/Day.js +2 -1
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/HoursList.js +6 -3
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/MeridiemList.js +4 -0
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/MinutesList.js +6 -3
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/SecondsList.js +6 -3
- package/cjs/date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +2 -1
- package/esm/date-time-picker/parts/ClearButton/ClearButton.js +2 -1
- package/esm/date-time-picker/parts/Pickers/Calendar/CalendarHead.js +8 -4
- package/esm/date-time-picker/parts/Pickers/Calendar/CalendarIconTrigger.js +2 -1
- package/esm/date-time-picker/parts/Pickers/Calendar/Day.js +2 -1
- package/esm/date-time-picker/parts/Pickers/TimeWheel/HoursList.js +6 -3
- package/esm/date-time-picker/parts/Pickers/TimeWheel/MeridiemList.js +4 -0
- package/esm/date-time-picker/parts/Pickers/TimeWheel/MinutesList.js +6 -3
- package/esm/date-time-picker/parts/Pickers/TimeWheel/SecondsList.js +6 -3
- package/esm/date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +2 -1
- package/package.json +15 -15
|
@@ -51,7 +51,8 @@ const ClearButton = () => {
|
|
|
51
51
|
if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem?.focus?.();
|
|
52
52
|
},
|
|
53
53
|
onClick: onClearClick,
|
|
54
|
-
onKeyDown: onClearButtonKeyDown
|
|
54
|
+
onKeyDown: onClearButtonKeyDown,
|
|
55
|
+
type: "button"
|
|
55
56
|
}, styledsAttrs), {}, {
|
|
56
57
|
children: /*#__PURE__*/_jsx__default["default"](dsIcons.CloseMedium, {
|
|
57
58
|
color: dsIcon.DSIconColors.PRIMARY
|
|
@@ -78,7 +78,8 @@ const CalendarHead = () => {
|
|
|
78
78
|
onKeyDown: handlePrevYearKeyDown,
|
|
79
79
|
onFocus: onPrevYearFocus,
|
|
80
80
|
tabIndex: isControllerOnly ? -1 : 1,
|
|
81
|
-
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.PREV_YEAR
|
|
81
|
+
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.PREV_YEAR,
|
|
82
|
+
type: "button"
|
|
82
83
|
}, void 0, _ChevronDoubleLeft || (_ChevronDoubleLeft = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronDoubleLeft, {
|
|
83
84
|
height: 14,
|
|
84
85
|
width: 14,
|
|
@@ -92,7 +93,8 @@ const CalendarHead = () => {
|
|
|
92
93
|
innerRef: handlePrevMonthRef,
|
|
93
94
|
onKeyDown: handlePrevMonthKeyDown,
|
|
94
95
|
onFocus: onPrevMonthFocus,
|
|
95
|
-
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.PREV_MONTH
|
|
96
|
+
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.PREV_MONTH,
|
|
97
|
+
type: "button" // this is a tabstop for when the calendar is open
|
|
96
98
|
|
|
97
99
|
}, void 0, _ChevronLeft || (_ChevronLeft = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronLeft, {
|
|
98
100
|
fill: "#25292f"
|
|
@@ -104,7 +106,8 @@ const CalendarHead = () => {
|
|
|
104
106
|
innerRef: handleNextMonthRef,
|
|
105
107
|
onKeyDown: handleNextMonthKeyDown,
|
|
106
108
|
onFocus: onNextMonthFocus,
|
|
107
|
-
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.NEXT_MONTH
|
|
109
|
+
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.NEXT_MONTH,
|
|
110
|
+
type: "button"
|
|
108
111
|
}, void 0, _ChevronRight || (_ChevronRight = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronRight, {
|
|
109
112
|
fill: "#25292f"
|
|
110
113
|
}))), /*#__PURE__*/_jsx__default["default"](Styleds.StyledHeaderButton, {
|
|
@@ -115,7 +118,8 @@ const CalendarHead = () => {
|
|
|
115
118
|
innerRef: handleNextYearRef,
|
|
116
119
|
onKeyDown: handleNextYearKeyDown,
|
|
117
120
|
onFocus: onNextYearFocus,
|
|
118
|
-
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.NEXT_YEAR
|
|
121
|
+
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CALENDAR.NEXT_YEAR,
|
|
122
|
+
type: "button"
|
|
119
123
|
}, void 0, _ChevronDoubleRight || (_ChevronDoubleRight = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronDoubleRight, {
|
|
120
124
|
height: 14,
|
|
121
125
|
width: 14,
|
|
@@ -39,7 +39,8 @@ const CalendarIconTrigger = () => {
|
|
|
39
39
|
onClick: handleToggleCalendar,
|
|
40
40
|
onKeyDown: handlePickerIconKeyDown,
|
|
41
41
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR,
|
|
42
|
-
disabled: disabled
|
|
42
|
+
disabled: disabled,
|
|
43
|
+
type: "button"
|
|
43
44
|
}, void 0, _DatePicker || (_DatePicker = /*#__PURE__*/_jsx__default["default"](dsIcons.DatePicker, {}))), [ariaCurrentValueForInputs, handleSetTriggerRef, handleToggleCalendar, handlePickerIconKeyDown, disabled]);
|
|
44
45
|
};
|
|
45
46
|
|
|
@@ -140,7 +140,8 @@ const Day = _ref => {
|
|
|
140
140
|
innerRef: handleInnerRef,
|
|
141
141
|
tabIndex: isSelected ? 0 : -1,
|
|
142
142
|
"data-isfocused": isFocused,
|
|
143
|
-
"data-testid": dataTestid
|
|
143
|
+
"data-testid": dataTestid,
|
|
144
|
+
type: "button"
|
|
144
145
|
}, void 0, `${day.getDate()}`)
|
|
145
146
|
}));
|
|
146
147
|
};
|
|
@@ -64,7 +64,8 @@ const HoursList = () => {
|
|
|
64
64
|
onClick: handlePrevHour,
|
|
65
65
|
innerRef: prevHourBtnRef,
|
|
66
66
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_HOUR,
|
|
67
|
-
tabIndex: -1
|
|
67
|
+
tabIndex: -1,
|
|
68
|
+
type: "button"
|
|
68
69
|
}, void 0, _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallUp, {})))), visibleHours.map(hourString => {
|
|
69
70
|
const key = `timewheel-hour-${hourString || ''}`;
|
|
70
71
|
if (!hourString) return /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {}, key);
|
|
@@ -97,7 +98,8 @@ const HoursList = () => {
|
|
|
97
98
|
"aria-valuemax": 12,
|
|
98
99
|
"aria-valuemin": 1,
|
|
99
100
|
"aria-valuenow": currHourNum,
|
|
100
|
-
"aria-valuetext": `${hourString} hours
|
|
101
|
+
"aria-valuetext": `${hourString} hours`,
|
|
102
|
+
type: "button"
|
|
101
103
|
}, btnProps), {}, {
|
|
102
104
|
children: hourString
|
|
103
105
|
})));
|
|
@@ -108,7 +110,8 @@ const HoursList = () => {
|
|
|
108
110
|
onClick: handleNextHour,
|
|
109
111
|
innerRef: nextHourBtnRef,
|
|
110
112
|
tabIndex: -1,
|
|
111
|
-
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_HOUR
|
|
113
|
+
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_HOUR,
|
|
114
|
+
type: "button"
|
|
112
115
|
}, void 0, _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})))));
|
|
113
116
|
};
|
|
114
117
|
|
|
@@ -79,6 +79,7 @@ const MeridiemList = () => {
|
|
|
79
79
|
onClick: e => handleTimeWheelBtnChangeMeridiem('AM', e),
|
|
80
80
|
innerRef: prevMeridiemBtnRef,
|
|
81
81
|
tabIndex: -1,
|
|
82
|
+
type: "button",
|
|
82
83
|
children: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallUp, {}))
|
|
83
84
|
}))), currMeridiem === 'AM' || currMeridiem === '' ? _StyledWheelListItem || (_StyledWheelListItem = /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {})) : null, /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {
|
|
84
85
|
isCurrentListItem: isAmCurrent
|
|
@@ -98,6 +99,7 @@ const MeridiemList = () => {
|
|
|
98
99
|
"aria-valuemin": 0,
|
|
99
100
|
"aria-valuenow": isPmCurrent ? 1 : 0,
|
|
100
101
|
"aria-valuetext": isAmCurrent ? 'ante meridiem' : 'post meridiem',
|
|
102
|
+
type: "button",
|
|
101
103
|
children: "AM"
|
|
102
104
|
}))), /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {
|
|
103
105
|
isCurrentListItem: isPmCurrent
|
|
@@ -117,6 +119,7 @@ const MeridiemList = () => {
|
|
|
117
119
|
"aria-valuemin": 0,
|
|
118
120
|
"aria-valuenow": isPmCurrent ? 1 : 0,
|
|
119
121
|
"aria-valuetext": isAmCurrent ? 'ante meridiem' : 'post meridiem',
|
|
122
|
+
type: "button",
|
|
120
123
|
children: "PM"
|
|
121
124
|
}))), currMeridiem === 'PM' ? _StyledWheelListItem2 || (_StyledWheelListItem2 = /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {})) : null, /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(Styleds.StyledWheelChangeTimeBtn, _objectSpread(_objectSpread({}, styledPropsNextMeridiem), {}, {
|
|
122
125
|
"aria-label": "set pm meridiem",
|
|
@@ -127,6 +130,7 @@ const MeridiemList = () => {
|
|
|
127
130
|
onClick: e => handleTimeWheelBtnChangeMeridiem('PM', e),
|
|
128
131
|
innerRef: nextMeridiemBtnRef,
|
|
129
132
|
tabIndex: -1,
|
|
133
|
+
type: "button",
|
|
130
134
|
children: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {}))
|
|
131
135
|
}))));
|
|
132
136
|
};
|
|
@@ -63,7 +63,8 @@ const MinutesList = () => {
|
|
|
63
63
|
onClick: handlePrevMinute,
|
|
64
64
|
innerRef: prevMinutesBtnRef,
|
|
65
65
|
tabIndex: -1,
|
|
66
|
-
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_MINUTE
|
|
66
|
+
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_MINUTE,
|
|
67
|
+
type: "button"
|
|
67
68
|
}, void 0, _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallUp, {})))), visibleMinutes.map(minutesString => {
|
|
68
69
|
const key = `timewheel-minutes-${minutesString || ''}`;
|
|
69
70
|
if (!minutesString) return /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {}, key);
|
|
@@ -96,7 +97,8 @@ const MinutesList = () => {
|
|
|
96
97
|
"aria-valuemax": 59,
|
|
97
98
|
"aria-valuemin": 0,
|
|
98
99
|
"aria-valuenow": currMinuteNum,
|
|
99
|
-
"aria-valuetext": `${minutesString} minutes
|
|
100
|
+
"aria-valuetext": `${minutesString} minutes`,
|
|
101
|
+
type: "button"
|
|
100
102
|
}, btnProps), {}, {
|
|
101
103
|
children: minutesString
|
|
102
104
|
})));
|
|
@@ -107,7 +109,8 @@ const MinutesList = () => {
|
|
|
107
109
|
onClick: handleNextMinute,
|
|
108
110
|
innerRef: nextMinutesBtnRef,
|
|
109
111
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_MINUTE,
|
|
110
|
-
tabIndex: -1
|
|
112
|
+
tabIndex: -1,
|
|
113
|
+
type: "button"
|
|
111
114
|
}, void 0, _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})))));
|
|
112
115
|
};
|
|
113
116
|
|
|
@@ -53,7 +53,8 @@ const SecondsList = () => {
|
|
|
53
53
|
onClick: handlePrevSecond,
|
|
54
54
|
onKeyDown: handlePrevSecondBtnOnKeyDown,
|
|
55
55
|
innerRef: prevSecondsBtnRef,
|
|
56
|
-
tabIndex: -1
|
|
56
|
+
tabIndex: -1,
|
|
57
|
+
type: "button"
|
|
57
58
|
}, void 0, _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallUp, {})))), visibleSeconds.map(secondsString => {
|
|
58
59
|
const key = `timewheel-seconds-${secondsString}`;
|
|
59
60
|
if (!secondsString) return /*#__PURE__*/_jsx__default["default"](Styleds.StyledWheelListItem, {}, key);
|
|
@@ -72,7 +73,8 @@ const SecondsList = () => {
|
|
|
72
73
|
size: "l",
|
|
73
74
|
variant: DSButton.BUTTON_VARIANT.DEFAULT,
|
|
74
75
|
onClick: e => handleTimeWheelBtnChangeSeconds(secondsString, e),
|
|
75
|
-
tabIndex: tabIndex
|
|
76
|
+
tabIndex: tabIndex,
|
|
77
|
+
type: "button"
|
|
76
78
|
}, btnProps), {}, {
|
|
77
79
|
children: secondsString
|
|
78
80
|
})));
|
|
@@ -84,7 +86,8 @@ const SecondsList = () => {
|
|
|
84
86
|
onClick: handleNextSecond,
|
|
85
87
|
onKeyDown: handleNextSecondBtnOnKeyDown,
|
|
86
88
|
innerRef: nextSecondsBtnRef,
|
|
87
|
-
tabIndex: -1
|
|
89
|
+
tabIndex: -1,
|
|
90
|
+
type: "button"
|
|
88
91
|
}, void 0, _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})))));
|
|
89
92
|
};
|
|
90
93
|
|
|
@@ -38,7 +38,8 @@ const TimeWheelIconTrigger = () => {
|
|
|
38
38
|
onClick: handleToggleTimePicker,
|
|
39
39
|
onKeyDown: handlePickerIconKeyDown,
|
|
40
40
|
"data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.PICKER_ICONS.TIMEWHEEL,
|
|
41
|
-
disabled: disabled
|
|
41
|
+
disabled: disabled,
|
|
42
|
+
type: "button"
|
|
42
43
|
}, void 0, _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx__default["default"](dsIcons.RecentDocuments, {}))), [ariaCurrentValueForInputs, disabled, handlePickerIconKeyDown, handleSetTriggerRef, handleToggleTimePicker]);
|
|
43
44
|
};
|
|
44
45
|
|
|
@@ -42,7 +42,8 @@ const ClearButton = () => {
|
|
|
42
42
|
if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem?.focus?.();
|
|
43
43
|
},
|
|
44
44
|
onClick: onClearClick,
|
|
45
|
-
onKeyDown: onClearButtonKeyDown
|
|
45
|
+
onKeyDown: onClearButtonKeyDown,
|
|
46
|
+
type: "button"
|
|
46
47
|
}, styledsAttrs), {}, {
|
|
47
48
|
children: /*#__PURE__*/_jsx(CloseMedium, {
|
|
48
49
|
color: DSIconColors.PRIMARY
|
|
@@ -70,7 +70,8 @@ const CalendarHead = () => {
|
|
|
70
70
|
onKeyDown: handlePrevYearKeyDown,
|
|
71
71
|
onFocus: onPrevYearFocus,
|
|
72
72
|
tabIndex: isControllerOnly ? -1 : 1,
|
|
73
|
-
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.PREV_YEAR
|
|
73
|
+
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.PREV_YEAR,
|
|
74
|
+
type: "button"
|
|
74
75
|
}, void 0, _ChevronDoubleLeft || (_ChevronDoubleLeft = /*#__PURE__*/_jsx(ChevronDoubleLeft, {
|
|
75
76
|
height: 14,
|
|
76
77
|
width: 14,
|
|
@@ -84,7 +85,8 @@ const CalendarHead = () => {
|
|
|
84
85
|
innerRef: handlePrevMonthRef,
|
|
85
86
|
onKeyDown: handlePrevMonthKeyDown,
|
|
86
87
|
onFocus: onPrevMonthFocus,
|
|
87
|
-
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.PREV_MONTH
|
|
88
|
+
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.PREV_MONTH,
|
|
89
|
+
type: "button" // this is a tabstop for when the calendar is open
|
|
88
90
|
|
|
89
91
|
}, void 0, _ChevronLeft || (_ChevronLeft = /*#__PURE__*/_jsx(ChevronLeft, {
|
|
90
92
|
fill: "#25292f"
|
|
@@ -96,7 +98,8 @@ const CalendarHead = () => {
|
|
|
96
98
|
innerRef: handleNextMonthRef,
|
|
97
99
|
onKeyDown: handleNextMonthKeyDown,
|
|
98
100
|
onFocus: onNextMonthFocus,
|
|
99
|
-
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.NEXT_MONTH
|
|
101
|
+
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.NEXT_MONTH,
|
|
102
|
+
type: "button"
|
|
100
103
|
}, void 0, _ChevronRight || (_ChevronRight = /*#__PURE__*/_jsx(ChevronRight, {
|
|
101
104
|
fill: "#25292f"
|
|
102
105
|
}))), /*#__PURE__*/_jsx(StyledHeaderButton, {
|
|
@@ -107,7 +110,8 @@ const CalendarHead = () => {
|
|
|
107
110
|
innerRef: handleNextYearRef,
|
|
108
111
|
onKeyDown: handleNextYearKeyDown,
|
|
109
112
|
onFocus: onNextYearFocus,
|
|
110
|
-
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.NEXT_YEAR
|
|
113
|
+
"data-testid": ControlledDateTimePickerDatatestid.CALENDAR.NEXT_YEAR,
|
|
114
|
+
type: "button"
|
|
111
115
|
}, void 0, _ChevronDoubleRight || (_ChevronDoubleRight = /*#__PURE__*/_jsx(ChevronDoubleRight, {
|
|
112
116
|
height: 14,
|
|
113
117
|
width: 14,
|
|
@@ -31,7 +31,8 @@ const CalendarIconTrigger = () => {
|
|
|
31
31
|
onClick: handleToggleCalendar,
|
|
32
32
|
onKeyDown: handlePickerIconKeyDown,
|
|
33
33
|
"data-testid": ControlledDateTimePickerDatatestid.PICKER_ICONS.CALENDAR,
|
|
34
|
-
disabled: disabled
|
|
34
|
+
disabled: disabled,
|
|
35
|
+
type: "button"
|
|
35
36
|
}, void 0, _DatePicker || (_DatePicker = /*#__PURE__*/_jsx(DatePicker, {}))), [ariaCurrentValueForInputs, handleSetTriggerRef, handleToggleCalendar, handlePickerIconKeyDown, disabled]);
|
|
36
37
|
};
|
|
37
38
|
|
|
@@ -131,7 +131,8 @@ const Day = _ref => {
|
|
|
131
131
|
innerRef: handleInnerRef,
|
|
132
132
|
tabIndex: isSelected ? 0 : -1,
|
|
133
133
|
"data-isfocused": isFocused,
|
|
134
|
-
"data-testid": dataTestid
|
|
134
|
+
"data-testid": dataTestid,
|
|
135
|
+
type: "button"
|
|
135
136
|
}, void 0, `${day.getDate()}`)
|
|
136
137
|
}));
|
|
137
138
|
};
|
|
@@ -55,7 +55,8 @@ const HoursList = () => {
|
|
|
55
55
|
onClick: handlePrevHour,
|
|
56
56
|
innerRef: prevHourBtnRef,
|
|
57
57
|
"data-testid": ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_HOUR,
|
|
58
|
-
tabIndex: -1
|
|
58
|
+
tabIndex: -1,
|
|
59
|
+
type: "button"
|
|
59
60
|
}, void 0, _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx(ChevronSmallUp, {})))), visibleHours.map(hourString => {
|
|
60
61
|
const key = `timewheel-hour-${hourString || ''}`;
|
|
61
62
|
if (!hourString) return /*#__PURE__*/_jsx(StyledWheelListItem, {}, key);
|
|
@@ -88,7 +89,8 @@ const HoursList = () => {
|
|
|
88
89
|
"aria-valuemax": 12,
|
|
89
90
|
"aria-valuemin": 1,
|
|
90
91
|
"aria-valuenow": currHourNum,
|
|
91
|
-
"aria-valuetext": `${hourString} hours
|
|
92
|
+
"aria-valuetext": `${hourString} hours`,
|
|
93
|
+
type: "button"
|
|
92
94
|
}, btnProps), {}, {
|
|
93
95
|
children: hourString
|
|
94
96
|
})));
|
|
@@ -99,7 +101,8 @@ const HoursList = () => {
|
|
|
99
101
|
onClick: handleNextHour,
|
|
100
102
|
innerRef: nextHourBtnRef,
|
|
101
103
|
tabIndex: -1,
|
|
102
|
-
"data-testid": ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_HOUR
|
|
104
|
+
"data-testid": ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_HOUR,
|
|
105
|
+
type: "button"
|
|
103
106
|
}, void 0, _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {})))));
|
|
104
107
|
};
|
|
105
108
|
|
|
@@ -70,6 +70,7 @@ const MeridiemList = () => {
|
|
|
70
70
|
onClick: e => handleTimeWheelBtnChangeMeridiem('AM', e),
|
|
71
71
|
innerRef: prevMeridiemBtnRef,
|
|
72
72
|
tabIndex: -1,
|
|
73
|
+
type: "button",
|
|
73
74
|
children: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx(ChevronSmallUp, {}))
|
|
74
75
|
}))), currMeridiem === 'AM' || currMeridiem === '' ? _StyledWheelListItem || (_StyledWheelListItem = /*#__PURE__*/_jsx(StyledWheelListItem, {})) : null, /*#__PURE__*/_jsx(StyledWheelListItem, {
|
|
75
76
|
isCurrentListItem: isAmCurrent
|
|
@@ -89,6 +90,7 @@ const MeridiemList = () => {
|
|
|
89
90
|
"aria-valuemin": 0,
|
|
90
91
|
"aria-valuenow": isPmCurrent ? 1 : 0,
|
|
91
92
|
"aria-valuetext": isAmCurrent ? 'ante meridiem' : 'post meridiem',
|
|
93
|
+
type: "button",
|
|
92
94
|
children: "AM"
|
|
93
95
|
}))), /*#__PURE__*/_jsx(StyledWheelListItem, {
|
|
94
96
|
isCurrentListItem: isPmCurrent
|
|
@@ -108,6 +110,7 @@ const MeridiemList = () => {
|
|
|
108
110
|
"aria-valuemin": 0,
|
|
109
111
|
"aria-valuenow": isPmCurrent ? 1 : 0,
|
|
110
112
|
"aria-valuetext": isAmCurrent ? 'ante meridiem' : 'post meridiem',
|
|
113
|
+
type: "button",
|
|
111
114
|
children: "PM"
|
|
112
115
|
}))), currMeridiem === 'PM' ? _StyledWheelListItem2 || (_StyledWheelListItem2 = /*#__PURE__*/_jsx(StyledWheelListItem, {})) : null, /*#__PURE__*/_jsx(StyledWheelListItem, {}, void 0, /*#__PURE__*/jsx(StyledWheelChangeTimeBtn, _objectSpread(_objectSpread({}, styledPropsNextMeridiem), {}, {
|
|
113
116
|
"aria-label": "set pm meridiem",
|
|
@@ -118,6 +121,7 @@ const MeridiemList = () => {
|
|
|
118
121
|
onClick: e => handleTimeWheelBtnChangeMeridiem('PM', e),
|
|
119
122
|
innerRef: nextMeridiemBtnRef,
|
|
120
123
|
tabIndex: -1,
|
|
124
|
+
type: "button",
|
|
121
125
|
children: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {}))
|
|
122
126
|
}))));
|
|
123
127
|
};
|
|
@@ -54,7 +54,8 @@ const MinutesList = () => {
|
|
|
54
54
|
onClick: handlePrevMinute,
|
|
55
55
|
innerRef: prevMinutesBtnRef,
|
|
56
56
|
tabIndex: -1,
|
|
57
|
-
"data-testid": ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_MINUTE
|
|
57
|
+
"data-testid": ControlledDateTimePickerDatatestid.TIMEWHEEL.PREV_MINUTE,
|
|
58
|
+
type: "button"
|
|
58
59
|
}, void 0, _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx(ChevronSmallUp, {})))), visibleMinutes.map(minutesString => {
|
|
59
60
|
const key = `timewheel-minutes-${minutesString || ''}`;
|
|
60
61
|
if (!minutesString) return /*#__PURE__*/_jsx(StyledWheelListItem, {}, key);
|
|
@@ -87,7 +88,8 @@ const MinutesList = () => {
|
|
|
87
88
|
"aria-valuemax": 59,
|
|
88
89
|
"aria-valuemin": 0,
|
|
89
90
|
"aria-valuenow": currMinuteNum,
|
|
90
|
-
"aria-valuetext": `${minutesString} minutes
|
|
91
|
+
"aria-valuetext": `${minutesString} minutes`,
|
|
92
|
+
type: "button"
|
|
91
93
|
}, btnProps), {}, {
|
|
92
94
|
children: minutesString
|
|
93
95
|
})));
|
|
@@ -98,7 +100,8 @@ const MinutesList = () => {
|
|
|
98
100
|
onClick: handleNextMinute,
|
|
99
101
|
innerRef: nextMinutesBtnRef,
|
|
100
102
|
"data-testid": ControlledDateTimePickerDatatestid.TIMEWHEEL.NEXT_MINUTE,
|
|
101
|
-
tabIndex: -1
|
|
103
|
+
tabIndex: -1,
|
|
104
|
+
type: "button"
|
|
102
105
|
}, void 0, _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {})))));
|
|
103
106
|
};
|
|
104
107
|
|
|
@@ -43,7 +43,8 @@ const SecondsList = () => {
|
|
|
43
43
|
onClick: handlePrevSecond,
|
|
44
44
|
onKeyDown: handlePrevSecondBtnOnKeyDown,
|
|
45
45
|
innerRef: prevSecondsBtnRef,
|
|
46
|
-
tabIndex: -1
|
|
46
|
+
tabIndex: -1,
|
|
47
|
+
type: "button"
|
|
47
48
|
}, void 0, _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx(ChevronSmallUp, {})))), visibleSeconds.map(secondsString => {
|
|
48
49
|
const key = `timewheel-seconds-${secondsString}`;
|
|
49
50
|
if (!secondsString) return /*#__PURE__*/_jsx(StyledWheelListItem, {}, key);
|
|
@@ -62,7 +63,8 @@ const SecondsList = () => {
|
|
|
62
63
|
size: "l",
|
|
63
64
|
variant: BUTTON_VARIANT.DEFAULT,
|
|
64
65
|
onClick: e => handleTimeWheelBtnChangeSeconds(secondsString, e),
|
|
65
|
-
tabIndex: tabIndex
|
|
66
|
+
tabIndex: tabIndex,
|
|
67
|
+
type: "button"
|
|
66
68
|
}, btnProps), {}, {
|
|
67
69
|
children: secondsString
|
|
68
70
|
})));
|
|
@@ -74,7 +76,8 @@ const SecondsList = () => {
|
|
|
74
76
|
onClick: handleNextSecond,
|
|
75
77
|
onKeyDown: handleNextSecondBtnOnKeyDown,
|
|
76
78
|
innerRef: nextSecondsBtnRef,
|
|
77
|
-
tabIndex: -1
|
|
79
|
+
tabIndex: -1,
|
|
80
|
+
type: "button"
|
|
78
81
|
}, void 0, _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {})))));
|
|
79
82
|
};
|
|
80
83
|
|
|
@@ -30,7 +30,8 @@ const TimeWheelIconTrigger = () => {
|
|
|
30
30
|
onClick: handleToggleTimePicker,
|
|
31
31
|
onKeyDown: handlePickerIconKeyDown,
|
|
32
32
|
"data-testid": ControlledDateTimePickerDatatestid.PICKER_ICONS.TIMEWHEEL,
|
|
33
|
-
disabled: disabled
|
|
33
|
+
disabled: disabled,
|
|
34
|
+
type: "button"
|
|
34
35
|
}, void 0, _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx(RecentDocuments, {}))), [ariaCurrentValueForInputs, disabled, handlePickerIconKeyDown, handleSetTriggerRef, handleToggleTimePicker]);
|
|
35
36
|
};
|
|
36
37
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-controlled-form",
|
|
3
|
-
"version": "2.4.3-rc.
|
|
3
|
+
"version": "2.4.3-rc.9",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Controlled Form Controllers",
|
|
6
6
|
"module": "./esm/index.js",
|
|
@@ -896,20 +896,20 @@
|
|
|
896
896
|
"build": "node ../../scripts/build/build.js"
|
|
897
897
|
},
|
|
898
898
|
"dependencies": {
|
|
899
|
-
"@elliemae/ds-button": "2.4.3-rc.
|
|
900
|
-
"@elliemae/ds-circular-progress-indicator": "2.4.3-rc.
|
|
901
|
-
"@elliemae/ds-controlled-form": "2.4.3-rc.
|
|
902
|
-
"@elliemae/ds-form": "2.4.3-rc.
|
|
903
|
-
"@elliemae/ds-form-layout-blocks": "2.4.3-rc.
|
|
904
|
-
"@elliemae/ds-grid": "2.4.3-rc.
|
|
905
|
-
"@elliemae/ds-icon": "2.4.3-rc.
|
|
906
|
-
"@elliemae/ds-icons": "2.4.3-rc.
|
|
907
|
-
"@elliemae/ds-pills": "2.4.3-rc.
|
|
908
|
-
"@elliemae/ds-popperjs": "2.4.3-rc.
|
|
909
|
-
"@elliemae/ds-props-helpers": "2.4.3-rc.
|
|
910
|
-
"@elliemae/ds-system": "2.4.3-rc.
|
|
911
|
-
"@elliemae/ds-tooltip": "2.4.3-rc.
|
|
912
|
-
"@elliemae/ds-truncated-tooltip-text": "2.4.3-rc.
|
|
899
|
+
"@elliemae/ds-button": "2.4.3-rc.9",
|
|
900
|
+
"@elliemae/ds-circular-progress-indicator": "2.4.3-rc.9",
|
|
901
|
+
"@elliemae/ds-controlled-form": "2.4.3-rc.9",
|
|
902
|
+
"@elliemae/ds-form": "2.4.3-rc.9",
|
|
903
|
+
"@elliemae/ds-form-layout-blocks": "2.4.3-rc.9",
|
|
904
|
+
"@elliemae/ds-grid": "2.4.3-rc.9",
|
|
905
|
+
"@elliemae/ds-icon": "2.4.3-rc.9",
|
|
906
|
+
"@elliemae/ds-icons": "2.4.3-rc.9",
|
|
907
|
+
"@elliemae/ds-pills": "2.4.3-rc.9",
|
|
908
|
+
"@elliemae/ds-popperjs": "2.4.3-rc.9",
|
|
909
|
+
"@elliemae/ds-props-helpers": "2.4.3-rc.9",
|
|
910
|
+
"@elliemae/ds-system": "2.4.3-rc.9",
|
|
911
|
+
"@elliemae/ds-tooltip": "2.4.3-rc.9",
|
|
912
|
+
"@elliemae/ds-truncated-tooltip-text": "2.4.3-rc.9",
|
|
913
913
|
"prop-types": "~15.7.2",
|
|
914
914
|
"react-desc": "~4.1.3",
|
|
915
915
|
"react-popper": "~2.2.5",
|