@geotab/zenith 1.26.2 → 1.26.3

package/dist/dataGrid/withSortableColumns/sortableColumnsStorage.js

@@ -11,9 +11,19 @@ const createFakeSettings = () => {
     };
 };
 class SortableColumnsStorage {
-    storeKey;
-    storage;
     constructor(pageName, storage, defaultSortState) {
+        Object.defineProperty(this, "storeKey", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        Object.defineProperty(this, "storage", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
         this.storage = storage || createFakeSettings();
         this.storeKey = `${STOREAGE_PREFIX}${pageName}`;
         defaultSortState && this.setItem(defaultSortState);
@@ -36,4 +46,3 @@ class SortableColumnsStorage {
     }
 }
 exports.SortableColumnsStorage = SortableColumnsStorage;
-//# sourceMappingURL=sortableColumnsStorage.js.map

package/dist/dataGrid/withSortableColumns/withSortableColumns.js

@@ -14,13 +14,13 @@ const columnSortDirection_1 = require("./columns/columnSortDirection");
 const withSortableColumns = (DataGridComponent) => (0, react_1.forwardRef)(
 // eslint-disable-next-line @typescript-eslint/naming-convention
 function InnerColumnsList(props, ref) {
+    var _a, _b;
     const { columns, options, onSortChange } = props;
-    const settingsStore = (0, react_1.useMemo)(() => new sortableColumnsStorage_1.SortableColumnsStorage(options.columnsSettingsStorage?.pageName || "", options.columnsSettingsStorage?.storage), [options.columnsSettingsStorage?.pageName, options.columnsSettingsStorage?.storage]);
-    const allColumns = (0, react_1.useMemo)(() => columns.map(column => ({
-        ...(0, toBasicColumn_1.toBasicColumn)({ ...column }),
-        isSortable: column.isSortable,
-        initialSortDirection: column.meta?.initialSortDirection
-    })), [columns]);
+    const settingsStore = (0, react_1.useMemo)(() => { var _a, _b; return new sortableColumnsStorage_1.SortableColumnsStorage(((_a = options.columnsSettingsStorage) === null || _a === void 0 ? void 0 : _a.pageName) || "", (_b = options.columnsSettingsStorage) === null || _b === void 0 ? void 0 : _b.storage); }, [(_a = options.columnsSettingsStorage) === null || _a === void 0 ? void 0 : _a.pageName, (_b = options.columnsSettingsStorage) === null || _b === void 0 ? void 0 : _b.storage]);
+    const allColumns = (0, react_1.useMemo)(() => columns.map(column => {
+        var _a;
+        return (Object.assign(Object.assign({}, (0, toBasicColumn_1.toBasicColumn)(Object.assign({}, column))), { isSortable: column.isSortable, initialSortDirection: (_a = column.meta) === null || _a === void 0 ? void 0 : _a.initialSortDirection }));
+    }), [columns]);
     const sortSettings = (0, react_1.useMemo)(() => options.sortOptions || settingsStore.getItem(), [options.sortOptions, settingsStore]);
     const saveSettingsToTheStore = (0, react_1.useCallback)((newSettings) => 
     // not to block main thread this operation can be postponed
@@ -43,22 +43,18 @@ function InnerColumnsList(props, ref) {
         const wrappers = column.wrappers;
         const isSortable = column.isSortable !== false && !(column.columnComponent instanceof actionsColumn_1.ActionsColumn);
         const isSortedBy = isSortable && sortSettings.sortColumn === column.name;
-        return ({
-            ...column,
-            wrappers: wrappers.some(w => w instanceof sortableColumnWrapper_1.SortableColumnWrapper) || !isSortable ? wrappers : [
+        return (Object.assign(Object.assign({}, column), { wrappers: wrappers.some(w => w instanceof sortableColumnWrapper_1.SortableColumnWrapper) || !isSortable ? wrappers : [
                 ...wrappers,
                 new sortableColumnWrapper_1.SortableColumnWrapper(column.name, {
                     isSortedBy,
                     sortDirection: isSortedBy ? sortSettings.sortDirection : columnSortDirection_1.ColumnSortDirection.None,
                     initialSortDirection: column.initialSortDirection
                 }, column.title, onSort)
-            ]
-        });
+            ] }));
     }), [allColumns, sortSettings, onSort]);
-    return (0, jsx_runtime_1.jsx)(DataGridComponent, { ...props, columns: [...sortedColumns], ref: ref }, "grid");
+    return (0, jsx_runtime_1.jsx)(DataGridComponent, Object.assign({}, props, { columns: [...sortedColumns], ref: ref }), "grid");
 });
 exports.withSortableColumns = withSortableColumns;
 exports.withSortableColumns.translations = [
     ...sortableColumnWrapper_1.SortableColumnWrapper.translations
 ];
-//# sourceMappingURL=withSortableColumns.js.map

package/dist/dateInput/cutSeconds.js

@@ -11,4 +11,3 @@ const cutSeconds = (date) => {
     return d.toISOString();
 };
 exports.cutSeconds = cutSeconds;
-//# sourceMappingURL=cutSeconds.js.map

package/dist/dateInput/dateInput.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TRANSLATIONS = exports.DateInput = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("./dateInput.less");
 const textIconButton_1 = require("../textIconButton/textIconButton");
 const button_1 = require("../button/button");
 const iconCalendar_1 = require("../icons/iconCalendar");
@@ -42,7 +41,7 @@ const DateInput = ({ className, classNamePopup, defaultValue, value, onChange, i
     const cssClass = (0, classNames_1.classNames)([
         "zen-date-input",
         error ? "zen-date-input--error" : "",
-        className ?? "",
+        className !== null && className !== void 0 ? className : "",
         !value || (0, cutSeconds_1.cutSeconds)(defaultValue) === (0, cutSeconds_1.cutSeconds)(value) ? "" : "zen-date-input--active"
     ]);
     const title = (0, react_1.useMemo)(() => dropDownTitle || translate("Pick a date"), [dropDownTitle, translate]);
@@ -88,13 +87,14 @@ const DateInput = ({ className, classNamePopup, defaultValue, value, onChange, i
         prevIsOpenRef.current = isCurrentOpen;
     }, [isMobile]);
     const component = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)("div", { className: "zen-date-input-inner__calendar-wrapper", children: (0, jsx_runtime_1.jsx)(dateInputInner_1.DateInputInner, { id: id || componentId, value: { from: customDate, to: undefined }, onChange: onCalendarChange, dateFormat: dateFormat, dateFormatter: dateFormatter, dateDeformatter: dateDeformatter, startDayOfWeek: weekStartsOnSunday ? 0 : 1, dateRangeMode: false, selectTime: timeSelect, disableFutureDates: disableFutureDates, disablePastDates: disablePastDates, disableDatesAfter: disableDatesAfter, disableDatesBefore: disableDatesBefore, title: "", isMobileView: isMobile, requireSelection: requireSelection }) }), [componentId, customDate, dateDeformatter, dateFormat, dateFormatter, disableDatesAfter, disableDatesBefore, disableFutureDates, disablePastDates, id, isMobile, onCalendarChange, requireSelection, timeSelect, weekStartsOnSunday]);
-    const memoizedDesktopView = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { className: (0, classNames_1.classNames)(["zen-date-input-popup-wrapper", driveWrapperClassName || ""]), ariaLabel: translate("Pick a date"), useTrapFocusWithTrigger: "on", triggerRef: triggerRef, onOpenChange: setIsOpen, shouldHoldScroll: true, isOpen: isOpen, recalculateOnScroll: true, children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-input-popup", drivePopupClassName || "", classNamePopup ?? ""]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-date-input-popup__header", children: title }), component, (0, jsx_runtime_1.jsxs)("div", { className: "zen-date-input-popup__footer", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-input-popup__button-clear", type: buttonType_1.ButtonType.Tertiary, disabled: isDefaultState, onClick: handleClearClick, children: translate("Clear") }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-input-popup__button-apply", type: buttonType_1.ButtonType.Primary, disabled: isValueState || (requireSelection && !customDate), onClick: handleApplyClick, children: translate("Apply") })] })] }) }), [classNamePopup, component, customDate, drivePopupClassName, driveWrapperClassName, handleApplyClick, handleClearClick, isDefaultState, isOpen, isValueState, requireSelection, title, translate]);
+    const memoizedDesktopView = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { className: (0, classNames_1.classNames)(["zen-date-input-popup-wrapper", driveWrapperClassName || ""]), ariaLabel: translate("Pick a date"), useTrapFocusWithTrigger: "on", triggerRef: triggerRef, onOpenChange: setIsOpen, shouldHoldScroll: true, isOpen: isOpen, recalculateOnScroll: true, children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-input-popup", drivePopupClassName || "", classNamePopup !== null && classNamePopup !== void 0 ? classNamePopup : ""]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-date-input-popup__header", children: title }), component, (0, jsx_runtime_1.jsxs)("div", { className: "zen-date-input-popup__footer", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-input-popup__button-clear", type: buttonType_1.ButtonType.Tertiary, disabled: isDefaultState, onClick: handleClearClick, children: translate("Clear") }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-input-popup__button-apply", type: buttonType_1.ButtonType.Primary, disabled: isValueState || (requireSelection && !customDate), onClick: handleApplyClick, children: translate("Apply") })] })] }) }), [classNamePopup, component, customDate, drivePopupClassName, driveWrapperClassName, handleApplyClick, handleClearClick, isDefaultState, isOpen, isValueState, requireSelection, title, translate]);
     const memoizedMobileFooter = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsxs)(footerButtons_1.FooterButtons, { children: [(0, jsx_runtime_1.jsx)(button_1.Button, { type: buttonType_1.ButtonType.Primary, disabled: isValueState || (requireSelection && !customDate), onClick: handleApplyClick, children: translate("Apply") }), (0, jsx_runtime_1.jsx)(button_1.Button, { type: buttonType_1.ButtonType.Tertiary, disabled: isDefaultState, onClick: handleClearClick, children: translate("Clear") })] }), [customDate, handleApplyClick, handleClearClick, isDefaultState, isValueState, requireSelection, translate]);
     const memoizedMobileView = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsxs)(mobileSheet_1.MobileSheet, { className: (0, classNames_1.classNames)(["zen-date-input-mobile-sheet", classNamePopup ? `${classNamePopup}--mobile-sheet` : ""]), label: translate("Pick a date"), triggerRef: triggerRef, isOpen: isOpen, onHidePanel: memoizedHandleClose, onCloseClick: memoizedHandleClose, useTrapFocusWithTrigger: true, onReadyForFocus: onReadyForFocus, children: [(0, jsx_runtime_1.jsx)(mobileSheet_1.MobileSheet.Title, { children: title }), (0, jsx_runtime_1.jsx)(mobileSheet_1.MobileSheet.Content, { children: renderContent ? component : null }), (0, jsx_runtime_1.jsx)(mobileSheet_1.MobileSheet.Footer, { children: memoizedMobileFooter })] }), [classNamePopup, component, isOpen, memoizedHandleClose, memoizedMobileFooter, onReadyForFocus, renderContent, title, translate]);
     (0, react_1.useEffect)(() => {
         if (!isMobile && !isOpen && prevIsOpenRef.current) {
             setTimeout(() => {
-                triggerRef.current?.focus();
+                var _a;
+                (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
             }, 0);
         }
         prevIsOpenRef.current = isOpen;
@@ -108,4 +108,3 @@ exports.TRANSLATIONS = [
     "Apply",
     "Today"
 ];
-//# sourceMappingURL=dateInput.js.map

package/dist/dateInput/getLabel.js

@@ -10,4 +10,3 @@ const getLabel = (value, dateFormat, timeFormat, translate, toLocalDateTime, tim
     return (0, formatDate_1.formatDate)(toLocalDateTime(value), format, translate);
 };
 exports.getLabel = getLabel;
-//# sourceMappingURL=getLabel.js.map

package/dist/dateInputInner/dateInputInner.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TRANSLATIONS = exports.DateInputInner = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("./dateInputInner.less");
 const react_1 = require("react");
 const calendar_1 = require("../calendar/calendar");
 const dateUtils_1 = require("../calendar/dateUtils");
@@ -14,6 +13,7 @@ const userFormatContext_1 = require("../utils/userFormat/userFormatContext");
 const dateInputInnerReducer_1 = require("./dateInputInnerReducer");
 const useTodayButton_1 = require("../utils/dateInputUtils/useTodayButton");
 const DateInputInner = ({ id, value, dateFormatter, dateDeformatter, dateFormat, onChange, dateRangeMode, selectTime, disableFutureDates, disablePastDates, disableDatesAfter, disableDatesBefore, startDayOfWeek, yearRange, title, isMobileView, requireSelection = false }) => {
+    var _a;
     const { translate } = (0, useLanguage_1.useLanguage)();
     const { toLocalDateTime, toReverseOffsetDateTime } = (0, react_1.useContext)(userFormatContext_1.userFormatContext);
     const { isTodayDisabled, todayFrom, todayTo } = (0, useTodayButton_1.useTodayButton)(dateRangeMode, disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter);
@@ -30,12 +30,13 @@ const DateInputInner = ({ id, value, dateFormatter, dateDeformatter, dateFormat,
         dispatchState({ type: dateInputInnerReducer_1.DateInputInnerStateActionType.ChangeEndDateText, payload: value.to ? dateFormatter(value.to) : "" });
     }, [value.to, dateFormatter]);
     (0, react_1.useEffect)(() => {
+        var _a, _b;
         if (value.from !== currentDateValuesRef.current.from || value.to !== currentDateValuesRef.current.to) {
             currentDateValuesRef.current = { from: value.from, to: value.to };
             dispatchState({ type: dateInputInnerReducer_1.DateInputInnerStateActionType.ChangeActiveField, payload: "start" });
             currentSelectedFieldRef.current = undefined;
-            startInputRef.current?.focus();
-            startInputRef.current?.select();
+            (_a = startInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            (_b = startInputRef.current) === null || _b === void 0 ? void 0 : _b.select();
         }
     }, [value.from, value.to, currentDateValuesRef]);
     (0, react_1.useEffect)(() => {
@@ -314,7 +315,7 @@ const DateInputInner = ({ id, value, dateFormatter, dateDeformatter, dateFormat,
             end: range.to ? dateFormatter(range.to) : "",
             hasAssistiveText: currentActiveField === "start" ? range.to !== value.to : range.from !== value.from
         };
-        currentDateValuesRef.current = { ...range };
+        currentDateValuesRef.current = Object.assign({}, range);
         dispatchState({ type: dateInputInnerReducer_1.DateInputInnerStateActionType.ChangeCalendarValue, payload: newStateValue });
         onChange(range);
     }, [dateRangeMode, value.from, value.to, toLocalDateTime, timePickerValueFromPrev, timePickerValueToPrev, dateFormatter, onChange, adjustTime, toReverseOffsetDateTime,
@@ -419,21 +420,23 @@ const DateInputInner = ({ id, value, dateFormatter, dateDeformatter, dateFormat,
         onKeyDown: handleOnKeyDown
     }), [handleOnClick, handleOnKeyDown]);
     (0, react_1.useEffect)(() => {
+        var _a, _b, _c, _d;
         if (state.currentActiveField === "start") {
-            startInputRef.current?.focus();
-            state.inputKeyDownBehavior === "start" && startInputRef.current?.select();
+            (_a = startInputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            state.inputKeyDownBehavior === "start" && ((_b = startInputRef.current) === null || _b === void 0 ? void 0 : _b.select());
         }
         if (state.currentActiveField === "end") {
-            endInputRef.current?.focus();
-            state.inputKeyDownBehavior === "end" && endInputRef.current?.select();
+            (_c = endInputRef.current) === null || _c === void 0 ? void 0 : _c.focus();
+            state.inputKeyDownBehavior === "end" && ((_d = endInputRef.current) === null || _d === void 0 ? void 0 : _d.select());
         }
     }, [state.currentActiveField, state.inputKeyDownBehavior]);
     (0, react_1.useEffect)(() => {
+        var _a, _b;
         if (state.inputKeyDownBehavior === "start") {
-            startInputRef.current?.select();
+            (_a = startInputRef.current) === null || _a === void 0 ? void 0 : _a.select();
         }
         if (state.inputKeyDownBehavior === "end") {
-            endInputRef.current?.select();
+            (_b = endInputRef.current) === null || _b === void 0 ? void 0 : _b.select();
         }
     }, [state.inputKeyDownBehavior]);
     const handleBlurStart = (0, react_1.useCallback)((e) => {
@@ -476,8 +479,8 @@ const DateInputInner = ({ id, value, dateFormatter, dateDeformatter, dateFormat,
     const memoizedEndInputComponent = (0, react_1.useMemo)(() => dateRangeMode
         ? (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-date-input-inner__separator" }), (0, jsx_runtime_1.jsx)(dateInputInnerControlBlock_1.DateInputInnerControlBlock, { className: "zen-date-input-inner__control-end", title: translate("End date"), id: state.endDateId, ref: endInputRef, dateText: state.endDateText, placeholder: dateFormat, handleSetDateText: handleSetEndDateText, onBlurDateChangeHandler: handleBlurEnd, requireSelection: requireSelection, selectTime: selectTime, timePickerValue: timePickerValueTo || timePickerValueToPrev, isMobileView: isMobileView, timeChangeHandler: endTimeChangeHandler, isActiveField: state.currentActiveField === "end", assistiveText: getAssistiveText(state.endAssistiveText, false), isSelected: state.currentActiveField === "end" && state.inputKeyDownBehavior === "end" })] }) : null, [dateRangeMode, translate, state.endDateId, state.endDateText, state.currentActiveField, state.endAssistiveText, state.inputKeyDownBehavior, dateFormat, handleSetEndDateText, handleBlurEnd,
         requireSelection, selectTime, timePickerValueTo, timePickerValueToPrev, isMobileView, endTimeChangeHandler, getAssistiveText]);
-    currentSelectedFieldRef.current?.select();
-    return (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-input-inner", driveClassName || "", isMobileView ? "zen-date-input-inner--mobile-view" : ""]), children: [(0, jsx_runtime_1.jsxs)("div", { className: "zen-date-input-inner__controls-block", ...rangeArgs, children: [memoizedStartInputComponent, memoizedEndInputComponent] }), (0, jsx_runtime_1.jsx)("div", { className: "zen-date-input-inner__calendar", children: (0, jsx_runtime_1.jsx)(calendar_1.Calendar, { id: id, value: calendarValue, onChange: calendarChangeHandler, dateRangeMode: dateRangeMode, disableFutureDates: disableFutureDates, disablePastDates: disablePastDates, disableDatesAfter: disableDatesAfterValue, disableDatesBefore: disableDatesBeforeValue, startDayOfWeek: startDayOfWeek, yearRange: yearRange, isMobileView: isMobileView, getCurrentActiveField: dateRangeMode ? getCurrentActiveField : undefined, onTodayButtonClick: isTodayDisabled ? undefined : handleTodayButtonClick }) })] });
+    (_a = currentSelectedFieldRef.current) === null || _a === void 0 ? void 0 : _a.select();
+    return (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-input-inner", driveClassName || "", isMobileView ? "zen-date-input-inner--mobile-view" : ""]), children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: "zen-date-input-inner__controls-block" }, rangeArgs, { children: [memoizedStartInputComponent, memoizedEndInputComponent] })), (0, jsx_runtime_1.jsx)("div", { className: "zen-date-input-inner__calendar", children: (0, jsx_runtime_1.jsx)(calendar_1.Calendar, { id: id, value: calendarValue, onChange: calendarChangeHandler, dateRangeMode: dateRangeMode, disableFutureDates: disableFutureDates, disablePastDates: disablePastDates, disableDatesAfter: disableDatesAfterValue, disableDatesBefore: disableDatesBeforeValue, startDayOfWeek: startDayOfWeek, yearRange: yearRange, isMobileView: isMobileView, getCurrentActiveField: dateRangeMode ? getCurrentActiveField : undefined, onTodayButtonClick: isTodayDisabled ? undefined : handleTodayButtonClick }) })] });
 };
 exports.DateInputInner = DateInputInner;
 exports.TRANSLATIONS = [
@@ -489,4 +492,3 @@ exports.TRANSLATIONS = [
     "Start time has been adjusted.",
     "End time has been adjusted."
 ];
-//# sourceMappingURL=dateInputInner.js.map

package/dist/dateInputInner/dateInputInnerControlBlock.js

@@ -11,7 +11,6 @@ const timePicker_1 = require("../timePicker/timePicker");
 const useLanguage_1 = require("../utils/localization/useLanguage");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const formFieldError_1 = require("../formFieldError/formFieldError");
-require("../formField/formField.less");
 const react_2 = __importDefault(require("react"));
 const useDriveClassName_1 = require("../utils/theme/useDriveClassName");
 // eslint-disable-next-line @typescript-eslint/naming-convention
@@ -34,4 +33,3 @@ exports.TRANSLATIONS = [
     "The date must be set",
     "The time must be set"
 ];
-//# sourceMappingURL=dateInputInnerControlBlock.js.map

package/dist/dateInputInner/dateInputInnerReducer.js

@@ -59,15 +59,7 @@ function dateInputInnerReducer(state, action) {
             }
             return action.payload.startAssistiveText || state.startAssistiveText;
         };
-        return {
-            ...state,
-            currentActiveField: action.payload.emittedBy || action.payload.nextActiveField || state.currentActiveField,
-            inputKeyDownBehavior: action.payload.emittedBy || action.payload.nextActiveField || state.inputKeyDownBehavior,
-            startDateText: action.payload.start,
-            endDateText: state.dateRangeMode ? action.payload.end : state.endDateText,
-            startAssistiveText: getStartAssistiveText(),
-            endAssistiveText: getEndAssistiveText()
-        };
+        return Object.assign(Object.assign({}, state), { currentActiveField: action.payload.emittedBy || action.payload.nextActiveField || state.currentActiveField, inputKeyDownBehavior: action.payload.emittedBy || action.payload.nextActiveField || state.inputKeyDownBehavior, startDateText: action.payload.start, endDateText: state.dateRangeMode ? action.payload.end : state.endDateText, startAssistiveText: getStartAssistiveText(), endAssistiveText: getEndAssistiveText() });
     }
     if (action.type === DateInputInnerStateActionType.ChangeCalendarValue) {
         const nextActiveField = state.currentActiveField === "start" ? "end" : "start";
@@ -89,75 +81,54 @@ function dateInputInnerReducer(state, action) {
             }
             return state.endDateText !== action.payload.end || action.payload.hasAssistiveText ? exports.AssistiveText.DateAdjusted : exports.AssistiveText.None;
         };
-        return {
-            ...state,
-            startDateText: action.payload.start,
-            endDateText: state.dateRangeMode ? action.payload.end : state.endDateText,
-            startAssistiveText: getNextStartAssistiveText(),
-            endAssistiveText: getNextEndAssistiveText(),
-            currentActiveField: state.dateRangeMode ? nextActiveField : "start",
-            inputKeyDownBehavior: state.dateRangeMode ? nextActiveField : "start"
-        };
+        return Object.assign(Object.assign({}, state), { startDateText: action.payload.start, endDateText: state.dateRangeMode ? action.payload.end : state.endDateText, startAssistiveText: getNextStartAssistiveText(), endAssistiveText: getNextEndAssistiveText(), currentActiveField: state.dateRangeMode ? nextActiveField : "start", inputKeyDownBehavior: state.dateRangeMode ? nextActiveField : "start" });
     }
     if (action.type === DateInputInnerStateActionType.ChangeStartDateText) {
         if (action.payload === state.startDateText) {
             return state;
         }
-        return { ...state, startDateText: action.payload };
+        return Object.assign(Object.assign({}, state), { startDateText: action.payload });
     }
     if (action.type === DateInputInnerStateActionType.ChangeEndDateText) {
         if (action.payload === state.endDateText || !state.dateRangeMode) {
             return state;
         }
-        return { ...state, endDateText: action.payload };
+        return Object.assign(Object.assign({}, state), { endDateText: action.payload });
     }
     if (action.type === DateInputInnerStateActionType.UpdateDateText) {
         if (action.payload.end === state.endDateText && action.payload.start === state.startDateText) {
             return state;
         }
-        return { ...state, startDateText: action.payload.start, endDateText: action.payload.end };
+        return Object.assign(Object.assign({}, state), { startDateText: action.payload.start, endDateText: action.payload.end });
     }
     if (action.type === DateInputInnerStateActionType.ChangeStartAssistiveText) {
         if (!state.dateRangeMode) {
             return state;
         }
-        return { ...state, startAssistiveText: action.payload };
+        return Object.assign(Object.assign({}, state), { startAssistiveText: action.payload });
     }
     if (action.type === DateInputInnerStateActionType.ChangeEndAssistiveText) {
-        return { ...state, endAssistiveText: action.payload };
+        return Object.assign(Object.assign({}, state), { endAssistiveText: action.payload });
     }
     if (action.type === DateInputInnerStateActionType.ChangeActiveField) {
-        return {
-            ...state,
-            currentActiveField: action.payload,
-            inputKeyDownBehavior: action.payload,
-            startAssistiveText: state.currentActiveField === "start" ? exports.AssistiveText.None : state.startAssistiveText,
-            endAssistiveText: state.currentActiveField === "end" ? exports.AssistiveText.None : state.endAssistiveText
-        };
+        return Object.assign(Object.assign({}, state), { currentActiveField: action.payload, inputKeyDownBehavior: action.payload, startAssistiveText: state.currentActiveField === "start" ? exports.AssistiveText.None : state.startAssistiveText, endAssistiveText: state.currentActiveField === "end" ? exports.AssistiveText.None : state.endAssistiveText });
     }
     if (action.type === DateInputInnerStateActionType.ChangeInputKeydownBehavior) {
-        return { ...state, inputKeyDownBehavior: action.payload };
+        return Object.assign(Object.assign({}, state), { inputKeyDownBehavior: action.payload });
     }
     if (action.type === DateInputInnerStateActionType.ToggleActiveField) {
         if (!state.dateRangeMode) {
             return state;
         }
-        return {
-            ...state,
-            currentActiveField: state.currentActiveField === "start" ? "end" : "start",
-            inputKeyDownBehavior: state.currentActiveField === "start" ? "end" : "start",
-            startAssistiveText: state.currentActiveField === "start" ? exports.AssistiveText.None : state.startAssistiveText,
-            endAssistiveText: state.currentActiveField === "end" ? exports.AssistiveText.None : state.endAssistiveText
-        };
+        return Object.assign(Object.assign({}, state), { currentActiveField: state.currentActiveField === "start" ? "end" : "start", inputKeyDownBehavior: state.currentActiveField === "start" ? "end" : "start", startAssistiveText: state.currentActiveField === "start" ? exports.AssistiveText.None : state.startAssistiveText, endAssistiveText: state.currentActiveField === "end" ? exports.AssistiveText.None : state.endAssistiveText });
     }
     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
     if (action.type === DateInputInnerStateActionType.ChangeDateRangeMode) {
         if (state.dateRangeMode === action.payload) {
             return state;
         }
-        return { ...state, dateRangeMode: action.payload };
+        return Object.assign(Object.assign({}, state), { dateRangeMode: action.payload });
     }
     return state;
 }
 exports.dateInputInnerReducer = dateInputInnerReducer;
-//# sourceMappingURL=dateInputInnerReducer.js.map

package/dist/dateRange/dateRange.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TRANSLATIONS = exports.DateRange = exports.parseLabel = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("./dateRange.less");
 const textIconButton_1 = require("../textIconButton/textIconButton");
 const button_1 = require("../button/button");
 const iconCalendar_1 = require("../icons/iconCalendar");
@@ -39,6 +38,7 @@ const parseLabel = (option, dateFormat, translate, toLacalFn) => {
 exports.parseLabel = parseLabel;
 // eslint-disable-next-line complexity
 const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, options: optionsArg, type, id, disabled, dropDownTitle, hasApplyButton, disableFutureDates, disablePastDates, disableDatesBefore, triggerLabel, disableDatesAfter, withCalendar, lockStartDate, lockEndDate, timeSelect, error, allowUnsetValue = false, stepper = false, classNameWrapper }) => {
+    var _a;
     const { translate } = (0, useLanguage_1.useLanguage)();
     const isMobile = (0, useMobile_1.useMobile)();
     const isDrive = (0, useDrive_1.useDrive)();
@@ -51,10 +51,10 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
     const previousStepOption = (0, react_1.useRef)("");
     const [selectedRange, setSelectedRange] = (0, react_1.useState)((0, getRangeOption_1.getSelectedRangeFromValue)(optionsMap, value));
     const [renderContent, setRenderContent] = (0, react_1.useState)(false);
-    const isCustomDateOption = selectedRange?.label === dateRangeInner_1.CUSTOM_CALENDAR_ID;
+    const isCustomDateOption = (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label) === dateRangeInner_1.CUSTOM_CALENDAR_ID;
     const [isOpen, setIsOpen] = (0, react_1.useState)(false);
     const prevIsOpenRef = (0, react_1.useRef)(false);
-    const [customDate, setCustomDate] = (0, react_1.useState)((0, normalizeDates_1.normalizeDates)(value?.from.toISOString(), value?.to.toISOString(), disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter));
+    const [customDate, setCustomDate] = (0, react_1.useState)((0, normalizeDates_1.normalizeDates)(value === null || value === void 0 ? void 0 : value.from.toISOString(), value === null || value === void 0 ? void 0 : value.to.toISOString(), disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter));
     const isDefaultState = !defaultValue && !selectedRange
         || defaultValue && selectedRange && defaultValue.label === selectedRange.label && defaultValue.label !== dateRangeInner_1.CUSTOM_CALENDAR_ID
         || defaultValue && selectedRange && defaultValue.label === selectedRange.label && defaultValue.label === dateRangeInner_1.CUSTOM_CALENDAR_ID && customDate.from && customDate.to
@@ -63,7 +63,7 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
     const [prevSelection, setPrevSelection] = (0, react_1.useState)((0, getRangeOption_1.getSelectedRangeFromValue)(optionsMap, value));
     const componentId = (0, useUniqueId_1.useUniqueId)();
     const calendarLabel = translate(dateRangeInner_1.CUSTOM_CALENDAR_ID);
-    const getCustomRange = (0, react_1.useCallback)(() => ({ from: prevSelection?.from || new Date(), to: prevSelection?.to || new Date() }), [prevSelection]);
+    const getCustomRange = (0, react_1.useCallback)(() => ({ from: (prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.from) || new Date(), to: (prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.to) || new Date() }), [prevSelection]);
     const options = (0, react_1.useMemo)(() => (0, getRangeOption_1.getRangeOptionsArray)(optionsArg, translate, toLocalDateTime, weekStartsOnSunday ? "Sunday" : "Monday", toReverseOffsetDateTime, withCalendar || false, prevSelection && prevSelection.label === dateRangeInner_1.CUSTOM_CALENDAR_ID, prevSelection ? getCustomRange : undefined), [optionsArg, translate, toLocalDateTime, weekStartsOnSunday, toReverseOffsetDateTime, withCalendar, prevSelection, getCustomRange]);
     const optionsMapRef = (0, react_1.useRef)(optionsMap);
     const isEqualMaps = (0, react_1.useMemo)(() => (0, areMapsEqual_1.areMapsEqual)(optionsMapRef.current, optionsMap), [optionsMap]);
@@ -86,12 +86,13 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
     }, [dateFormat, options, translate, toLocalDateTime]);
     (0, react_1.useEffect)(() => {
         const currentValue = (0, getRangeOption_1.getSelectedRangeFromValue)(optionsMap, value);
-        if (prevSelection?.label !== currentValue?.label || (prevSelection?.from.getTime() !== currentValue?.from.getTime() || prevSelection?.to.getTime() !== currentValue?.to.getTime())) {
+        if ((prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.label) !== (currentValue === null || currentValue === void 0 ? void 0 : currentValue.label) || ((prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.from.getTime()) !== (currentValue === null || currentValue === void 0 ? void 0 : currentValue.from.getTime()) || (prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.to.getTime()) !== (currentValue === null || currentValue === void 0 ? void 0 : currentValue.to.getTime()))) {
             setSelectedRange(currentValue);
             setPrevSelection(currentValue);
         }
-    }, [optionsMap, prevSelection?.from, prevSelection?.label, prevSelection?.to, value]);
+    }, [optionsMap, prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.from, prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.label, prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.to, value]);
     const handleDateRangeSelection = (0, react_1.useCallback)((newVal) => {
+        var _a, _b;
         const selection = options.find(option => option.id === newVal);
         newVal === dateRangeInner_1.CUSTOM_CALENDAR_ID && setShowMobileCalendar(true);
         if (selection && newVal !== dateRangeInner_1.CUSTOM_CALENDAR_ID && selection.getRange) {
@@ -100,35 +101,35 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
             const newRange = newVal === dateRangeInner_1.CUSTOM_CALENDAR_ID ?
                 { from: new Date(normalizedDates.from), to: new Date(normalizedDates.to) }
                 : range;
-            setSelectedRange({ label: selection.id, ...newRange });
-            !hasApplyButton && setPrevSelection({ label: selection.id, ...newRange });
-            !hasApplyButton && onChange({ label: selection.id, ...newRange });
+            setSelectedRange(Object.assign({ label: selection.id }, newRange));
+            !hasApplyButton && setPrevSelection(Object.assign({ label: selection.id }, newRange));
+            !hasApplyButton && onChange(Object.assign({ label: selection.id }, newRange));
             previousStepOption.current = "";
         }
         else {
-            const startDateForNormalize = selection?.getRange?.() && selectedRange?.label !== newVal ? selection.getRange().from.toISOString() : value?.from.toISOString();
-            const endDateForNormalize = selection?.getRange?.() && selectedRange?.label !== newVal ? selection.getRange().to.toISOString() : value?.to.toISOString();
+            const startDateForNormalize = ((_a = selection === null || selection === void 0 ? void 0 : selection.getRange) === null || _a === void 0 ? void 0 : _a.call(selection)) && (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label) !== newVal ? selection.getRange().from.toISOString() : value === null || value === void 0 ? void 0 : value.from.toISOString();
+            const endDateForNormalize = ((_b = selection === null || selection === void 0 ? void 0 : selection.getRange) === null || _b === void 0 ? void 0 : _b.call(selection)) && (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label) !== newVal ? selection.getRange().to.toISOString() : value === null || value === void 0 ? void 0 : value.to.toISOString();
             const normalizedDates = (0, normalizeDates_1.normalizeDates)(startDateForNormalize, endDateForNormalize, disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter);
             const newRange = newVal === dateRangeInner_1.CUSTOM_CALENDAR_ID ?
                 { from: new Date(normalizedDates.from), to: new Date(normalizedDates.to) }
                 : undefined;
-            const newValueFrom = newRange?.from || new Date();
-            const newValueTo = newRange?.to || new Date();
+            const newValueFrom = (newRange === null || newRange === void 0 ? void 0 : newRange.from) || new Date();
+            const newValueTo = (newRange === null || newRange === void 0 ? void 0 : newRange.to) || new Date();
             setSelectedRange({ label: newVal, from: newValueFrom, to: newValueTo });
             setCustomDate(normalizedDates);
             !hasApplyButton && onChange({ label: newVal, from: newValueFrom, to: newValueTo });
         }
         !hasApplyButton && newVal !== dateRangeInner_1.CUSTOM_CALENDAR_ID && setIsOpen(false);
-    }, [options, hasApplyButton, disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter, onChange, selectedRange?.label, value?.from, value?.to]);
+    }, [options, hasApplyButton, disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter, onChange, selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label, value === null || value === void 0 ? void 0 : value.from, value === null || value === void 0 ? void 0 : value.to]);
     const handleRangeSelection = (0, react_1.useCallback)(() => {
-        if (selectedRange?.label) {
+        if (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label) {
             const newState = { label: selectedRange.label, from: new Date(customDate.from), to: new Date(customDate.to) };
             setPrevSelection(newState);
             onChange(newState);
             setSelectedRange(newState);
             setIsOpen(false);
         }
-    }, [selectedRange?.label, customDate.from, customDate.to, onChange]);
+    }, [selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label, customDate.from, customDate.to, onChange]);
     const handleApplyClick = (0, react_1.useCallback)(() => {
         setIsOpen(false);
         setShowMobileCalendar(false);
@@ -142,7 +143,7 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
     }, [handleRangeSelection, isCustomDateOption, onChange, selectedRange]);
     const handleCancelClick = (0, react_1.useCallback)(() => {
         hasApplyButton && prevSelection && handleDateRangeSelection(prevSelection.label);
-        setCustomDate({ from: prevSelection?.from.toISOString(), to: prevSelection?.to.toISOString() });
+        setCustomDate({ from: prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.from.toISOString(), to: prevSelection === null || prevSelection === void 0 ? void 0 : prevSelection.to.toISOString() });
         setIsOpen(!isOpen);
         setShowMobileCalendar(false);
     }, [handleDateRangeSelection, prevSelection, isOpen, hasApplyButton]);
@@ -152,7 +153,7 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
         !hasApplyButton && setIsOpen(false);
         setSelectedRange(defaultValue);
         previousStepOption.current = "";
-        defaultValue?.label === dateRangeInner_1.CUSTOM_CALENDAR_ID && !allowUnsetValue && setCustomDate({ from: defaultValue.from.toISOString(), to: defaultValue.to.toISOString() });
+        (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.label) === dateRangeInner_1.CUSTOM_CALENDAR_ID && !allowUnsetValue && setCustomDate({ from: defaultValue.from.toISOString(), to: defaultValue.to.toISOString() });
         setShowMobileCalendar(false);
     }, [allowUnsetValue, defaultValue, hasApplyButton, onChange]);
     const handleMobileBackClick = (0, react_1.useCallback)(() => {
@@ -172,14 +173,14 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
         labeledValue && onChange(labeledValue);
     }, [onChange, optionsMap, toLocalDateTime, toReverseOffsetDateTime, translate]);
     (0, react_1.useEffect)(() => {
-        setCustomDate({ from: value?.from.toISOString(), to: value?.to.toISOString() });
+        setCustomDate({ from: value === null || value === void 0 ? void 0 : value.from.toISOString(), to: value === null || value === void 0 ? void 0 : value.to.toISOString() });
         const currentValue = (0, getRangeOption_1.getSelectedRangeFromValue)(optionsMapRef.current, value);
         setPrevSelection(currentValue);
     }, [value, isEqualMaps]);
     const range = (0, react_1.useMemo)(() => ({ from: customDate.from, to: customDate.to }), [customDate.from, customDate.to]);
     const component = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(dateRangeInner_1.DateRangeInner, { id: id || componentId, options: options, onOptionSelect: handleDateRangeSelection, onCalendarSelect: hasCustomOption ? (val) => {
             setCustomDate({ from: lockStartDate || val.from, to: lockEndDate || (lockStartDate ? val.to || val.from : val.to) });
-        } : undefined, selection: selectedRange?.label, range: range, timeSelect: timeSelect, disableFutureDates: disableFutureDates, disablePastDates: disablePastDates, disableDatesBefore: disableDatesBefore, disableDatesAfter: disableDatesAfter, showMobileCalendar: isMobile ? showMobileCalendar : undefined, setShowMobileCalendar: isMobile ? setShowMobileCalendar : undefined }), [id, componentId, options, handleDateRangeSelection, hasCustomOption, selectedRange?.label, range, timeSelect, disableFutureDates, disablePastDates,
+        } : undefined, selection: selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label, range: range, timeSelect: timeSelect, disableFutureDates: disableFutureDates, disablePastDates: disablePastDates, disableDatesBefore: disableDatesBefore, disableDatesAfter: disableDatesAfter, showMobileCalendar: isMobile ? showMobileCalendar : undefined, setShowMobileCalendar: isMobile ? setShowMobileCalendar : undefined }), [id, componentId, options, handleDateRangeSelection, hasCustomOption, selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label, range, timeSelect, disableFutureDates, disablePastDates,
         disableDatesBefore, disableDatesAfter, isMobile, showMobileCalendar, lockStartDate, lockEndDate]);
     const memoizedHandleClose = (0, react_1.useCallback)(() => {
         setIsOpen(false);
@@ -200,11 +201,11 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
             return false;
         }
         if (!isCustomDateOption) {
-            return selectedRange?.label === value?.label;
+            return (selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label) === (value === null || value === void 0 ? void 0 : value.label);
         }
-        return selectedRange.label === value?.label && customDate.from === value.from.toISOString() && customDate.to === value.to.toISOString();
-    }, [customDate.from, customDate.to, hasApplyButton, isCustomDateOption, selectedRange?.label, value?.from, value?.label, value?.to]);
-    const memoizedDesktopView = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { className: (0, classNames_1.classNames)(["zen-date-range-popup-wrapper", driveWrapperPopupClassName || ""]), ariaLabel: translate("Date range"), useTrapFocusWithTrigger: "on", role: "dialog", triggerRef: triggerRef, onOpenChange: setIsOpen, shouldHoldScroll: true, isOpen: isOpen, recalculateOnScroll: true, children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-range-popup", drivePopupClassName || "", classNamePopup ?? ""]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-date-range-popup__header", children: title }), component, (0, jsx_runtime_1.jsxs)("div", { className: "zen-date-range-popup__footer", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-range-popup__button-clear", type: buttonType_1.ButtonType.Tertiary, disabled: !!isDefaultState, onClick: handleClearClick, children: translate("Clear") }), (!isCustomDateOption && hasApplyButton) &&
+        return selectedRange.label === (value === null || value === void 0 ? void 0 : value.label) && customDate.from === value.from.toISOString() && customDate.to === value.to.toISOString();
+    }, [customDate.from, customDate.to, hasApplyButton, isCustomDateOption, selectedRange === null || selectedRange === void 0 ? void 0 : selectedRange.label, value === null || value === void 0 ? void 0 : value.from, value === null || value === void 0 ? void 0 : value.label, value === null || value === void 0 ? void 0 : value.to]);
+    const memoizedDesktopView = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { className: (0, classNames_1.classNames)(["zen-date-range-popup-wrapper", driveWrapperPopupClassName || ""]), ariaLabel: translate("Date range"), useTrapFocusWithTrigger: "on", role: "dialog", triggerRef: triggerRef, onOpenChange: setIsOpen, shouldHoldScroll: true, isOpen: isOpen, recalculateOnScroll: true, children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-range-popup", drivePopupClassName || "", classNamePopup !== null && classNamePopup !== void 0 ? classNamePopup : ""]), children: [(0, jsx_runtime_1.jsx)("div", { className: "zen-date-range-popup__header", children: title }), component, (0, jsx_runtime_1.jsxs)("div", { className: "zen-date-range-popup__footer", children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-range-popup__button-clear", type: buttonType_1.ButtonType.Tertiary, disabled: !!isDefaultState, onClick: handleClearClick, children: translate("Clear") }), (!isCustomDateOption && hasApplyButton) &&
                             (0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-range-popup__button-reset", type: buttonType_1.ButtonType.Secondary, onClick: handleCancelClick, children: translate("Cancel") }), (isCustomDateOption || hasApplyButton) && (0, jsx_runtime_1.jsx)(button_1.Button, { className: "zen-date-range-popup__button-apply", type: buttonType_1.ButtonType.Primary, disabled: (isCustomDateOption && (!customDate.from || !customDate.to)) || isValueNotChanged || !selectedRange, onClick: handleApplyClick, children: translate("Apply") })] })] }) }), [classNamePopup, component, customDate.from, customDate.to, drivePopupClassName, driveWrapperPopupClassName, handleApplyClick, handleCancelClick, handleClearClick, hasApplyButton, isCustomDateOption, isDefaultState, isOpen, isValueNotChanged, selectedRange, title, translate]);
     const notFocusedComponent = (0, react_1.useMemo)(() => !range.from && !range.to, [range.from, range.to]);
     const memoizedMobileFooter = (0, react_1.useMemo)(() => {
@@ -236,20 +237,21 @@ const DateRange = ({ className, classNamePopup, defaultValue, value, onChange, o
     (0, react_1.useEffect)(() => {
         if (!isMobile && !isOpen && prevIsOpenRef.current) {
             setTimeout(() => {
-                triggerRef.current?.focus();
+                var _a;
+                (_a = triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
             }, 0);
         }
         prevIsOpenRef.current = isOpen;
     }, [isOpen, isMobile]);
     const buttonLabel = (0, react_1.useMemo)(() => triggerLabel && !stepper ? triggerLabel : getButtonLabel((0, getRangeOption_1.getSelectedRangeFromValue)(optionsMap, value)), [getButtonLabel, optionsMap, value, triggerLabel, stepper]);
-    const currentLabel = (0, getRangeOption_1.getSelectedRangeFromValue)(optionsMap, value)?.label;
+    const currentLabel = (_a = (0, getRangeOption_1.getSelectedRangeFromValue)(optionsMap, value)) === null || _a === void 0 ? void 0 : _a.label;
     const cssClass = (0, classNames_1.classNames)([
         "zen-date-range",
         error ? "zen-date-range--error" : "",
-        className ?? "",
+        className !== null && className !== void 0 ? className : "",
         stepper ? "zen-date-range--with-stepper" : "",
         stepper && currentLabel === dateRangeInner_1.CUSTOM_CALENDAR_ID && buttonLabel.length > 20 ? "zen-date-range--with-stepper-custom" : "",
-        !defaultValue && !value || defaultValue?.label === currentLabel || type && type !== buttonType_1.ButtonType.Secondary ? "" : "zen-date-range--active"
+        !defaultValue && !value || (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.label) === currentLabel || type && type !== buttonType_1.ButtonType.Secondary ? "" : "zen-date-range--active"
     ]);
     const popupTriggerComponent = (0, react_1.useMemo)(() => (0, jsx_runtime_1.jsx)(textIconButton_1.TextIconButton, { htmlType: "button", icon: iconCalendar_1.IconCalendar, iconPosition: textIconButton_1.ButtonIconPosition.Start, className: cssClass, type: type, disabled: disabled, onClick: toggleVisibility, ref: triggerRef, children: buttonLabel }), [cssClass, type, disabled, toggleVisibility, buttonLabel]);
     return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [stepper ? (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-range-wrapper", driveWrapperTriggerClassName || "", classNameWrapper || ""]), children: [(0, jsx_runtime_1.jsx)("button", { type: "button", disabled: checkIsRangeDisable(false), onClick: decreaseRange, className: (0, classNames_1.classNames)(["zen-date-range__stepper", "zen-date-range__stepper--left"]), title: translate("Previous"), children: (0, jsx_runtime_1.jsx)(iconChevronLeftSmall_1.IconChevronLeftSmall, { size: isDrive ? "huge" : "large" }) }), popupTriggerComponent, (0, jsx_runtime_1.jsx)("button", { type: "button", disabled: checkIsRangeDisable(true), onClick: increaseRange, className: (0, classNames_1.classNames)(["zen-date-range__stepper", "zen-date-range__stepper--right"]), title: translate("Next"), children: (0, jsx_runtime_1.jsx)(iconChevronRightSmall_1.IconChevronRightSmall, { size: isDrive ? "huge" : "large" }) })] }) : popupTriggerComponent, isMobile ? memoizedMobileView : memoizedDesktopView, (0, jsx_runtime_1.jsx)(formFieldError_1.FormFieldError, { error: error })] });
@@ -271,4 +273,3 @@ exports.TRANSLATIONS = [
     "Some of the dates you selected aren’t available. Please try a different range.",
     "Please select the dates you want to view."
 ];
-//# sourceMappingURL=dateRange.js.map

package/dist/dateRange/dateRangeUtils.js

@@ -293,4 +293,3 @@ const GET_DEFAULT_DATE_OPTIONS = (toLocalDateTime, translate, firstDayOfWeek, to
     (0, exports.GET_LAST_THREE_MONTH_OPTION)(toLocalDateTime, translate, toReverseOffsetDateTime)
 ];
 exports.GET_DEFAULT_DATE_OPTIONS = GET_DEFAULT_DATE_OPTIONS;
-//# sourceMappingURL=dateRangeUtils.js.map

package/dist/dateRange/utils/areMapsEqual.js

@@ -33,4 +33,3 @@ function areMapsEqual(map1, map2) {
     return true;
 }
 exports.areMapsEqual = areMapsEqual;
-//# sourceMappingURL=areMapsEqual.js.map

package/dist/dateRangeInner/dateRangeInner.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TRANSLATIONS = exports.DateRangeInner = exports.CUSTOM_CALENDAR_ID = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("./dateRangeInner.less");
 const radioGroup_1 = require("../radioGroup/radioGroup");
 const dateInputInner_1 = require("../dateInputInner/dateInputInner");
 const react_1 = require("react");
@@ -23,11 +22,8 @@ const DateRangeInner = ({ id, options: optionsArg, selection, range = { from: un
     const isCalendarVisible = !!onCalendarSelect;
     const calendarLabel = translate(exports.CUSTOM_CALENDAR_ID);
     const normalizedUnknownRange = (0, react_1.useMemo)(() => (0, normalizeDates_1.normalizeDates)(undefined, undefined, disableFutureDates, disablePastDates, disableDatesBefore, disableDatesAfter), [disableDatesAfter, disableDatesBefore, disableFutureDates, disablePastDates]);
-    const options = (0, react_1.useMemo)(() => optionsArg.map((opt) => ({
-        ...opt,
-        ...(opt.hasSecondaryLabel ? { secondaryLabel: opt.getRange ? (0, dateRange_1.parseLabel)({ label: opt.label, ...opt.getRange() }, dateFormat, translate, toLocalDateTime)
-                : (0, dateRange_1.parseLabel)({ label: "unknown", from: new Date(normalizedUnknownRange.from), to: new Date(normalizedUnknownRange.to) }, dateFormat, translate, toLocalDateTime) } : {})
-    })), [optionsArg, dateFormat, translate, toLocalDateTime, normalizedUnknownRange.from, normalizedUnknownRange.to]);
+    const options = (0, react_1.useMemo)(() => optionsArg.map((opt) => (Object.assign(Object.assign({}, opt), (opt.hasSecondaryLabel ? { secondaryLabel: opt.getRange ? (0, dateRange_1.parseLabel)(Object.assign({ label: opt.label }, opt.getRange()), dateFormat, translate, toLocalDateTime)
+            : (0, dateRange_1.parseLabel)({ label: "unknown", from: new Date(normalizedUnknownRange.from), to: new Date(normalizedUnknownRange.to) }, dateFormat, translate, toLocalDateTime) } : {})))), [optionsArg, dateFormat, translate, toLocalDateTime, normalizedUnknownRange.from, normalizedUnknownRange.to]);
     const items = (0, react_1.useMemo)(() => {
         const handleButtonClick = () => {
             setShowMobileCalendar && setShowMobileCalendar(true);
@@ -76,4 +72,3 @@ exports.TRANSLATIONS = [
     "Custom Date and Time range",
     "Today"
 ];
-//# sourceMappingURL=dateRangeInner.js.map

package/dist/dateSelectionWrapper/dateSelectionWrapper.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TRANSLATIONS = exports.DateSelectionWrapper = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("./dateSelectionWrapper.less");
 const button_1 = require("../button/button");
 const buttonType_1 = require("../button/buttonType");
 const react_1 = require("react");
@@ -22,4 +21,3 @@ exports.TRANSLATIONS = [
     "Reset",
     "Apply"
 ];
-//# sourceMappingURL=dateSelectionWrapper.js.map