@stenajs-webui/calendar 15.5.9 → 15.7.0
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/CHANGELOG.md +12 -0
- package/dist/components/input-types/date-input/DateInput.d.ts +4 -0
- package/dist/components/input-types/date-input/DateInput.stories.d.ts +1 -0
- package/dist/components/input-types/date-range-dual-text-input/DateRangeDualTextInput.d.ts +2 -1
- package/dist/components/input-types/date-range-dual-text-input/DateRangeDualTextInput.stories.d.ts +2 -1
- package/dist/components/input-types/date-range-input/DateRangeInput.d.ts +5 -1
- package/dist/components/input-types/date-range-input/DateRangeInput.stories.d.ts +2 -1
- package/dist/components/input-types/date-time-input/DateTimeInput.d.ts +1 -0
- package/dist/components/input-types/date-time-input/DateTimeInput.stories.d.ts +1 -0
- package/dist/features/dual-text-input/DualTextInput.d.ts +1 -0
- package/dist/index.es.js +20 -19
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +20 -19
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
package/dist/index.js
CHANGED
|
@@ -1179,12 +1179,13 @@ var useDateInput = function (onChange, onClose, openOnMount) {
|
|
|
1179
1179
|
var defaultMaxDate = "2999-12-31";
|
|
1180
1180
|
|
|
1181
1181
|
var DateInput = function (_a) {
|
|
1182
|
-
var _b = _a.displayFormat, displayFormat = _b === void 0 ? DateFormats.fullDate : _b, _c = _a.placeholder, placeholder = _c === void 0 ? "Enter date" : _c, value = _a.value, _d = _a.zIndex, zIndex = _d === void 0 ? 100 : _d, _e = _a.calendarTheme, calendarTheme = _e === void 0 ? defaultCalendarTheme : _e, calendarProps = _a.calendarProps, openOnMount = _a.openOnMount, onClose = _a.onClose, onChange = _a.onChange, portalTarget = _a.portalTarget, variant = _a.variant, width = _a.width, minDate = _a.minDate, _f = _a.maxDate, maxDate = _f === void 0 ? defaultMaxDate : _f;
|
|
1182
|
+
var _b = _a.displayFormat, displayFormat = _b === void 0 ? DateFormats.fullDate : _b, _c = _a.placeholder, placeholder = _c === void 0 ? "Enter date" : _c, value = _a.value, _d = _a.zIndex, zIndex = _d === void 0 ? 100 : _d, _e = _a.calendarTheme, calendarTheme = _e === void 0 ? defaultCalendarTheme : _e, calendarProps = _a.calendarProps, openOnMount = _a.openOnMount, onClose = _a.onClose, onChange = _a.onChange, portalTarget = _a.portalTarget, variant = _a.variant, width = _a.width, minDate = _a.minDate, _f = _a.maxDate, maxDate = _f === void 0 ? defaultMaxDate : _f, disabled = _a.disabled;
|
|
1183
1183
|
var _g = useDateInput(onChange, onClose, openOnMount), hideCalendar = _g.hideCalendar, showingCalendar = _g.showingCalendar, onSelectDate = _g.onSelectDate, showCalendar = _g.showCalendar;
|
|
1184
1184
|
var _h = useCalendarPopoverUpdater(), tippyRef = _h.tippyRef, onChangePanel = _h.onChangePanel;
|
|
1185
1185
|
return (React__namespace.createElement(core.Box, { width: width },
|
|
1186
|
-
React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, visible: showingCalendar, onClickOutside: hideCalendar, placement: defaultPopoverPlacement, zIndex: zIndex, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", tippyRef: tippyRef, content: React__namespace.createElement(SingleDateCalendar, __assign({}, calendarProps, { onChange: onSelectDate, value: value, theme: calendarTheme, onChangePanel: onChangePanel, minDate: minDate, maxDate: maxDate })) },
|
|
1187
|
-
React__namespace.createElement(forms.TextInput, { type: "date",
|
|
1186
|
+
React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, visible: showingCalendar, onClickOutside: hideCalendar, placement: defaultPopoverPlacement, zIndex: zIndex, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", tippyRef: tippyRef, disabled: disabled, content: React__namespace.createElement(SingleDateCalendar, __assign({}, calendarProps, { onChange: onSelectDate, value: value, theme: calendarTheme, onChangePanel: onChangePanel, minDate: minDate, maxDate: maxDate })) },
|
|
1187
|
+
React__namespace.createElement(forms.TextInput, { type: "date", contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
|
|
1188
|
+
React__namespace.createElement(elements.FlatButton, { size: "small", disabled: disabled, leftIcon: faCalendarAlt.faCalendarAlt, onClick: showCalendar })), onFocus: showCalendar, onClickRight: showCalendar, value: value ? dateFns.format(value, displayFormat) : "", placeholder: placeholder, size: 9, disabled: disabled, autoFocus: openOnMount, variant: variant, min: minDate, max: maxDate }))));
|
|
1188
1189
|
};
|
|
1189
1190
|
|
|
1190
1191
|
var useDateRangeInput = function (value, onValueChange) {
|
|
@@ -1256,20 +1257,20 @@ var useDateRangeInput = function (value, onValueChange) {
|
|
|
1256
1257
|
* @deprecated Please use DateRangeDualTextInput instead.
|
|
1257
1258
|
*/
|
|
1258
1259
|
var DateRangeInput = function (_a) {
|
|
1259
|
-
var _b = _a.displayFormat, displayFormat = _b === void 0 ? DateFormats.fullDate : _b, _c = _a.placeholderStartDate, placeholderStartDate = _c === void 0 ? "Start date" : _c, _d = _a.placeholderEndDate, placeholderEndDate = _d === void 0 ? "End date" : _d, portalTarget = _a.portalTarget, value = _a.value, onValueChange = _a.onValueChange, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, width = _a.width, _f = _a.calendarTheme, calendarTheme = _f === void 0 ? defaultCalendarTheme : _f, calendarProps = _a.calendarProps, minDate = _a.minDate, _g = _a.maxDate, maxDate = _g === void 0 ? defaultMaxDate : _g;
|
|
1260
|
+
var _b = _a.displayFormat, displayFormat = _b === void 0 ? DateFormats.fullDate : _b, _c = _a.placeholderStartDate, placeholderStartDate = _c === void 0 ? "Start date" : _c, _d = _a.placeholderEndDate, placeholderEndDate = _d === void 0 ? "End date" : _d, portalTarget = _a.portalTarget, value = _a.value, onValueChange = _a.onValueChange, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, width = _a.width, _f = _a.calendarTheme, calendarTheme = _f === void 0 ? defaultCalendarTheme : _f, calendarProps = _a.calendarProps, minDate = _a.minDate, _g = _a.maxDate, maxDate = _g === void 0 ? defaultMaxDate : _g, disabled = _a.disabled;
|
|
1260
1261
|
var _h = React.useState(function () { var _a; return (_a = (focusedInput && (value === null || value === void 0 ? void 0 : value[focusedInput]))) !== null && _a !== void 0 ? _a : new Date(); }), dateInFocus = _h[0], setDateInFocus = _h[1];
|
|
1261
1262
|
var _j = React.useState("calendar"), currentPanel = _j[0], setCurrentPanel = _j[1];
|
|
1262
1263
|
var _k = useDateRangeInput(value, onValueChange), hideCalendar = _k.hideCalendar, showCalendarEndDate = _k.showCalendarEndDate, showCalendarStartDate = _k.showCalendarStartDate, showingCalendar = _k.showingCalendar, focusedInput = _k.focusedInput, startDateInputRef = _k.startDateInputRef, endDateInputRef = _k.endDateInputRef, onClickDay = _k.onClickDay, startDateIsAfterEnd = _k.startDateIsAfterEnd;
|
|
1263
1264
|
var statePerMonth = React.useMemo(function () {
|
|
1264
1265
|
return buildDayStateForDateRange(undefined, value === null || value === void 0 ? void 0 : value.startDate, value === null || value === void 0 ? void 0 : value.endDate);
|
|
1265
1266
|
}, [value]);
|
|
1266
|
-
return (React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, visible: showingCalendar, zIndex: zIndex, placement: defaultPopoverPlacement, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", onClickOutside: hideCalendar, content: React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, calendarProps, { dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, statePerMonth: statePerMonth, theme: calendarTheme, onClickDay: onClickDay, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) },
|
|
1267
|
+
return (React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, visible: showingCalendar, zIndex: zIndex, placement: defaultPopoverPlacement, appendTo: portalTarget !== null && portalTarget !== void 0 ? portalTarget : "parent", onClickOutside: hideCalendar, content: React__namespace.createElement(CalendarWithMonthSwitcher, __assign({}, calendarProps, { dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, statePerMonth: statePerMonth, theme: calendarTheme, onClickDay: onClickDay, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) },
|
|
1267
1268
|
React__namespace.createElement(core.Row, { alignItems: "center" },
|
|
1268
|
-
React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarStartDate, value: (value === null || value === void 0 ? void 0 : value.startDate) ? dateFns.format(value.startDate, displayFormat) : "", placeholder: placeholderStartDate, width: width, inputRef: startDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }),
|
|
1269
|
+
React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarStartDate, value: (value === null || value === void 0 ? void 0 : value.startDate) ? dateFns.format(value.startDate, displayFormat) : "", placeholder: placeholderStartDate, width: width, disabled: disabled, inputRef: startDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }),
|
|
1269
1270
|
React__namespace.createElement(core.Space, null),
|
|
1270
1271
|
React__namespace.createElement(elements.Icon, { icon: faLongArrowAltRight.faLongArrowAltRight, color: theme.cssColor("--lhds-color-ui-500"), size: 14 }),
|
|
1271
1272
|
React__namespace.createElement(core.Space, null),
|
|
1272
|
-
React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarEndDate, value: (value === null || value === void 0 ? void 0 : value.endDate) ? dateFns.format(value.endDate, displayFormat) : "", placeholder: placeholderEndDate, width: width, inputRef: endDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }))));
|
|
1273
|
+
React__namespace.createElement(forms.TextInput, { iconLeft: faCalendarAlt$1.faCalendarAlt, onFocus: showCalendarEndDate, value: (value === null || value === void 0 ? void 0 : value.endDate) ? dateFns.format(value.endDate, displayFormat) : "", placeholder: placeholderEndDate, width: width, disabled: disabled, inputRef: endDateInputRef, size: 9, variant: startDateIsAfterEnd ? "error" : undefined }))));
|
|
1273
1274
|
};
|
|
1274
1275
|
|
|
1275
1276
|
var DateTextInput = function (_a) {
|
|
@@ -1442,7 +1443,7 @@ var TimeTextInput = function (_a) {
|
|
|
1442
1443
|
};
|
|
1443
1444
|
|
|
1444
1445
|
var DualTextInput = function (_a) {
|
|
1445
|
-
var autoFocusLeft = _a.autoFocusLeft, autoFocusRight = _a.autoFocusRight, onEsc = _a.onEsc, onEnter = _a.onEnter, onValueChangeLeft = _a.onValueChangeLeft, onValueChangeRight = _a.onValueChangeRight, separatorIcon = _a.separatorIcon, placeholderLeft = _a.placeholderLeft, placeholderRight = _a.placeholderRight, typeLeft = _a.typeLeft, typeRight = _a.typeRight, onChangeLeft = _a.onChangeLeft, onChangeRight = _a.onChangeRight, valueLeft = _a.valueLeft, valueRight = _a.valueRight, minLeft = _a.minLeft, maxLeft = _a.maxLeft, minRight = _a.minRight, maxRight = _a.maxRight, onClickLeft = _a.onClickLeft, onClickRight = _a.onClickRight, onClickCalendar = _a.onClickCalendar, onClickArrowDown = _a.onClickArrowDown, onBlurLeft = _a.onBlurLeft, onBlurRight = _a.onBlurRight, onFocusLeft = _a.onFocusLeft, onFocusRight = _a.onFocusRight, inputRefLeft = _a.inputRefLeft, inputRefRight = _a.inputRefRight, variant = _a.variant, variantLeft = _a.variantLeft, variantRight = _a.variantRight, onBlur = _a.onBlur, showPresets = _a.showPresets, widthLeft = _a.widthLeft, widthRight = _a.widthRight;
|
|
1446
|
+
var autoFocusLeft = _a.autoFocusLeft, autoFocusRight = _a.autoFocusRight, onEsc = _a.onEsc, onEnter = _a.onEnter, onValueChangeLeft = _a.onValueChangeLeft, onValueChangeRight = _a.onValueChangeRight, separatorIcon = _a.separatorIcon, placeholderLeft = _a.placeholderLeft, placeholderRight = _a.placeholderRight, typeLeft = _a.typeLeft, typeRight = _a.typeRight, onChangeLeft = _a.onChangeLeft, onChangeRight = _a.onChangeRight, valueLeft = _a.valueLeft, valueRight = _a.valueRight, minLeft = _a.minLeft, maxLeft = _a.maxLeft, minRight = _a.minRight, maxRight = _a.maxRight, onClickLeft = _a.onClickLeft, onClickRight = _a.onClickRight, onClickCalendar = _a.onClickCalendar, onClickArrowDown = _a.onClickArrowDown, onBlurLeft = _a.onBlurLeft, onBlurRight = _a.onBlurRight, onFocusLeft = _a.onFocusLeft, onFocusRight = _a.onFocusRight, inputRefLeft = _a.inputRefLeft, inputRefRight = _a.inputRefRight, variant = _a.variant, variantLeft = _a.variantLeft, variantRight = _a.variantRight, onBlur = _a.onBlur, showPresets = _a.showPresets, widthLeft = _a.widthLeft, widthRight = _a.widthRight, disabled = _a.disabled;
|
|
1446
1447
|
var focusCounter = React.useRef(0);
|
|
1447
1448
|
var tryTriggerOnBlur = React.useMemo(function () {
|
|
1448
1449
|
return lodash.debounce(function (focusCounter) {
|
|
@@ -1480,20 +1481,20 @@ var DualTextInput = function (_a) {
|
|
|
1480
1481
|
}
|
|
1481
1482
|
}, [onBlurRight, focusCounter, tryTriggerOnBlur]);
|
|
1482
1483
|
return (React__namespace.createElement(core.Box, null,
|
|
1483
|
-
React__namespace.createElement(forms.TextInputBox, { disableContentPaddingRight: true, variant: variant, contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
|
|
1484
|
+
React__namespace.createElement(forms.TextInputBox, { disableContentPaddingRight: true, disabled: disabled, variant: variant, contentRight: React__namespace.createElement(core.Row, { alignItems: "center" },
|
|
1484
1485
|
React__namespace.createElement(core.Indent, { num: 0.5 },
|
|
1485
|
-
React__namespace.createElement(elements.FlatButton, { leftIcon: faCalendarAlt.faCalendarAlt, onClick: onClickCalendar, size: "small" })),
|
|
1486
|
+
React__namespace.createElement(elements.FlatButton, { leftIcon: faCalendarAlt.faCalendarAlt, onClick: onClickCalendar, disabled: disabled, size: "small" })),
|
|
1486
1487
|
showPresets ? (React__namespace.createElement(React__namespace.Fragment, null,
|
|
1487
1488
|
React__namespace.createElement(core.Row, { height: "22px" },
|
|
1488
1489
|
React__namespace.createElement(core.SeparatorLine, { vertical: true })),
|
|
1489
1490
|
React__namespace.createElement(core.Indent, { num: 0.5 },
|
|
1490
|
-
React__namespace.createElement(elements.FlatButton, { leftIcon: faAngleDown.faAngleDown, onClick: onClickArrowDown, size: "small" })))) : null) },
|
|
1491
|
+
React__namespace.createElement(elements.FlatButton, { leftIcon: faAngleDown.faAngleDown, onClick: onClickArrowDown, disabled: disabled, size: "small" })))) : null) },
|
|
1491
1492
|
React__namespace.createElement(core.Box, { width: widthLeft },
|
|
1492
|
-
React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickLeft, hideBorder: true, placeholder: placeholderLeft, value: valueLeft, onValueChange: onValueChangeLeft, onChange: onChangeLeft, onBlur: blurLeftHandler, onFocus: focusLeftHandler, inputRef: inputRefLeft, variant: variantLeft, type: typeLeft, autoFocus: autoFocusLeft, min: minLeft, max: maxLeft })),
|
|
1493
|
+
React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickLeft, disabled: disabled, hideBorder: true, placeholder: placeholderLeft, value: valueLeft, onValueChange: onValueChangeLeft, onChange: onChangeLeft, onBlur: blurLeftHandler, onFocus: focusLeftHandler, inputRef: inputRefLeft, variant: variantLeft, type: typeLeft, autoFocus: autoFocusLeft, min: minLeft, max: maxLeft })),
|
|
1493
1494
|
React__namespace.createElement(core.Row, { indent: 0.5, alignItems: "center", justifyContent: "center" },
|
|
1494
1495
|
React__namespace.createElement(elements.Icon, { icon: separatorIcon, size: 12, color: theme.cssColor("--lhds-color-ui-500") })),
|
|
1495
1496
|
React__namespace.createElement(core.Box, { width: widthRight },
|
|
1496
|
-
React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickRight, hideBorder: true, placeholder: placeholderRight, value: valueRight, onValueChange: onValueChangeRight, onChange: onChangeRight, onBlur: blurRightHandler, onFocus: focusRightHandler, inputRef: inputRefRight, variant: variantRight, type: typeRight, autoFocus: autoFocusRight, min: minRight, max: maxRight })))));
|
|
1497
|
+
React__namespace.createElement(forms.TextInput, { onEsc: onEsc, onEnter: onEnter, onClick: onClickRight, disabled: disabled, hideBorder: true, placeholder: placeholderRight, value: valueRight, onValueChange: onValueChangeRight, onChange: onChangeRight, onBlur: blurRightHandler, onFocus: focusRightHandler, inputRef: inputRefRight, variant: variantRight, type: typeRight, autoFocus: autoFocusRight, min: minRight, max: maxRight })))));
|
|
1497
1498
|
};
|
|
1498
1499
|
|
|
1499
1500
|
var transformTimeStringToNumber = function (time) {
|
|
@@ -1798,7 +1799,7 @@ var useUserInputHandlers$1 = function (onChangeDate, dateInputRef, showCalendar,
|
|
|
1798
1799
|
};
|
|
1799
1800
|
|
|
1800
1801
|
var DateTimeInput = function (_a) {
|
|
1801
|
-
var value = _a.value, onValueChange = _a.onValueChange, onEnter = _a.onEnter, onEsc = _a.onEsc, onBlur = _a.onBlur, autoFocus = _a.autoFocus, minDate = _a.minDate, _b = _a.widthLeft, widthLeft = _b === void 0 ? 128 : _b, _c = _a.widthRight, widthRight = _c === void 0 ? 80 : _c, _d = _a.maxDate, maxDate = _d === void 0 ? defaultMaxDate : _d;
|
|
1802
|
+
var value = _a.value, onValueChange = _a.onValueChange, onEnter = _a.onEnter, onEsc = _a.onEsc, onBlur = _a.onBlur, autoFocus = _a.autoFocus, minDate = _a.minDate, _b = _a.widthLeft, widthLeft = _b === void 0 ? 128 : _b, _c = _a.widthRight, widthRight = _c === void 0 ? 80 : _c, _d = _a.maxDate, maxDate = _d === void 0 ? defaultMaxDate : _d, disabled = _a.disabled;
|
|
1802
1803
|
var dateInputRef = React.useRef(null);
|
|
1803
1804
|
var timeInputRef = React.useRef(null);
|
|
1804
1805
|
var states = useInputStates$1(value);
|
|
@@ -1824,13 +1825,13 @@ var DateTimeInput = function (_a) {
|
|
|
1824
1825
|
var delayedIsCalendarVisible = core.useDelayedFalse(isCalendarVisible, 300);
|
|
1825
1826
|
var delayedIsTimePickerVisible = core.useDelayedFalse(isTimePickerVisible, 300);
|
|
1826
1827
|
return (React__namespace.createElement(core.Box, { onKeyDown: onKeyDownHandler },
|
|
1827
|
-
React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, placement: defaultPopoverPlacement, visible: isCalendarVisible || isTimePickerVisible, onClickOutside: hideAll, content: (delayedIsCalendarVisible || delayedIsTimePickerVisible) && (React__namespace.createElement(core.Column, null, delayedIsCalendarVisible ? (React__namespace.createElement(CalendarWithMonthSwitcher, { statePerMonth: statePerMonth, onClickDay: onClickDay, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) : delayedIsTimePickerVisible ? (React__namespace.createElement(core.Column, null,
|
|
1828
|
+
React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, placement: defaultPopoverPlacement, visible: isCalendarVisible || isTimePickerVisible, onClickOutside: hideAll, content: (delayedIsCalendarVisible || delayedIsTimePickerVisible) && (React__namespace.createElement(core.Column, null, delayedIsCalendarVisible ? (React__namespace.createElement(CalendarWithMonthSwitcher, { statePerMonth: statePerMonth, onClickDay: onClickDay, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate })) : delayedIsTimePickerVisible ? (React__namespace.createElement(core.Column, null,
|
|
1828
1829
|
React__namespace.createElement(core.Column, { overflow: "hidden", height: "250px" },
|
|
1829
1830
|
React__namespace.createElement(TimePicker, { value: timeValue !== null && timeValue !== void 0 ? timeValue : "", onValueChange: onChangeTime })),
|
|
1830
1831
|
React__namespace.createElement(core.Space, null),
|
|
1831
1832
|
React__namespace.createElement(core.Row, { justifyContent: "flex-end" },
|
|
1832
1833
|
React__namespace.createElement(elements.PrimaryButton, { label: "Done", onClick: hideTimePicker })))) : null)) },
|
|
1833
|
-
React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, separatorIcon: faClock$1.faClock, typeLeft: "date", typeRight: "time", placeholderLeft: "yyyy-mm-dd", placeholderRight: "hh:mm", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: dateInputRef, inputRefRight: timeInputRef, valueRight: timeValue !== null && timeValue !== void 0 ? timeValue : "", widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate }))));
|
|
1834
|
+
React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, disabled: disabled, separatorIcon: faClock$1.faClock, typeLeft: "date", typeRight: "time", placeholderLeft: "yyyy-mm-dd", placeholderRight: "hh:mm", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: dateInputRef, inputRefRight: timeInputRef, valueRight: timeValue !== null && timeValue !== void 0 ? timeValue : "", widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate }))));
|
|
1834
1835
|
};
|
|
1835
1836
|
|
|
1836
1837
|
var useDateRangeEffects = function (startDate, endDate, setDateInFocus, startDateInputRef, endDateInputRef) {
|
|
@@ -2081,7 +2082,7 @@ var useUserInputHandlers = function (startDate, endDate, onValueChange, startDat
|
|
|
2081
2082
|
};
|
|
2082
2083
|
|
|
2083
2084
|
var DateRangeDualTextInput = function (_a) {
|
|
2084
|
-
var value = _a.value, onValueChange = _a.onValueChange, autoFocus = _a.autoFocus, onBlur = _a.onBlur, onEnter = _a.onEnter, onEsc = _a.onEsc, minDate = _a.minDate, _b = _a.maxDate, maxDate = _b === void 0 ? defaultMaxDate : _b, calendarProps = _a.calendarProps, _c = _a.widthLeft, widthLeft = _c === void 0 ? 128 : _c, _d = _a.widthRight, widthRight = _d === void 0 ? 128 : _d;
|
|
2085
|
+
var value = _a.value, onValueChange = _a.onValueChange, autoFocus = _a.autoFocus, onBlur = _a.onBlur, onEnter = _a.onEnter, onEsc = _a.onEsc, minDate = _a.minDate, _b = _a.maxDate, maxDate = _b === void 0 ? defaultMaxDate : _b, calendarProps = _a.calendarProps, _c = _a.widthLeft, widthLeft = _c === void 0 ? 128 : _c, _d = _a.widthRight, widthRight = _d === void 0 ? 128 : _d, disabled = _a.disabled;
|
|
2085
2086
|
var _e = value || {}, startDate = _e.startDate, endDate = _e.endDate;
|
|
2086
2087
|
var startDateInputRef = React.useRef(null);
|
|
2087
2088
|
var endDateInputRef = React.useRef(null);
|
|
@@ -2096,8 +2097,8 @@ var DateRangeDualTextInput = function (_a) {
|
|
|
2096
2097
|
}, [calendarProps === null || calendarProps === void 0 ? void 0 : calendarProps.statePerMonth, startDate, endDate, dateInFocus]);
|
|
2097
2098
|
var delayedIsCalendarVisible = core.useDelayedFalse(isCalendarVisible, 300);
|
|
2098
2099
|
return (React__namespace.createElement(core.Box, { onKeyDown: onKeyDownHandler },
|
|
2099
|
-
React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, placement: defaultPopoverPlacement, onClickOutside: hideCalendar, visible: isCalendarVisible, content: delayedIsCalendarVisible && (React__namespace.createElement(CalendarWithMonthSwitcher, __assign({ onClickDay: onClickDay, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate }, calendarProps, { statePerMonth: statePerMonth }))) },
|
|
2100
|
-
React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, separatorIcon: elements.stenaArrowRight, typeLeft: "date", typeRight: "date", placeholderLeft: "Start date", placeholderRight: "End date", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: startDateInputRef, inputRefRight: endDateInputRef, variant: startDateIsAfterEnd ? "error" : undefined, widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate, minRight: minDate, maxRight: maxDate }))));
|
|
2100
|
+
React__namespace.createElement(tooltip.Popover, { arrow: false, lazy: true, disabled: disabled, placement: defaultPopoverPlacement, onClickOutside: hideCalendar, visible: isCalendarVisible, content: delayedIsCalendarVisible && (React__namespace.createElement(CalendarWithMonthSwitcher, __assign({ onClickDay: onClickDay, dateInFocus: dateInFocus, setDateInFocus: setDateInFocus, currentPanel: currentPanel, setCurrentPanel: setCurrentPanel, minDate: minDate, maxDate: maxDate }, calendarProps, { statePerMonth: statePerMonth }))) },
|
|
2101
|
+
React__namespace.createElement(DualTextInput, { autoFocusLeft: autoFocus, onEsc: onEsc, onEnter: onEnter, onBlur: onBlur, disabled: disabled, separatorIcon: elements.stenaArrowRight, typeLeft: "date", typeRight: "date", placeholderLeft: "Start date", placeholderRight: "End date", onChangeLeft: inputLeftChangeHandler, onChangeRight: inputRightChangeHandler, onClickArrowDown: onClickArrowButton, onClickCalendar: onClickCalendarButton, onFocusLeft: onFocusLeft, onFocusRight: onFocusRight, onClickLeft: onFocusLeft, onClickRight: onFocusRight, inputRefLeft: startDateInputRef, inputRefRight: endDateInputRef, variant: startDateIsAfterEnd ? "error" : undefined, widthLeft: widthLeft, widthRight: widthRight, minLeft: minDate, maxLeft: maxDate, minRight: minDate, maxRight: maxDate }))));
|
|
2101
2102
|
};
|
|
2102
2103
|
|
|
2103
2104
|
exports.Calendar = Calendar;
|