@salutejs/plasma-new-hope 0.346.0 → 0.346.1-dev.0

package/dist/styled-components/cjs/components/DatePicker/RangeDate/RangeDate.js

@@ -103,6 +103,9 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
+function _iterable_to_array(iter) {
+    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
 function _iterable_to_array_limit(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
@@ -171,12 +174,22 @@ function _object_spread_props(target, source) {
 }
 function _object_without_properties(source, excluded) {
     if (source == null) return {};
-    var target = _object_without_properties_loose(source, excluded);
-    var key, i;
+    var target = {}, sourceKeys, key, i;
+    if (typeof Reflect !== "undefined" && Reflect.ownKeys) {
+        sourceKeys = Reflect.ownKeys(source);
+        for(i = 0; i < sourceKeys.length; i++){
+            key = sourceKeys[i];
+            if (excluded.indexOf(key) >= 0) continue;
+            if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+            target[key] = source[key];
+        }
+        return target;
+    }
+    target = _object_without_properties_loose(source, excluded);
     if (Object.getOwnPropertySymbols) {
-        var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-        for(i = 0; i < sourceSymbolKeys.length; i++){
-            key = sourceSymbolKeys[i];
+        sourceKeys = Object.getOwnPropertySymbols(source);
+        for(i = 0; i < sourceKeys.length; i++){
+            key = sourceKeys[i];
             if (excluded.indexOf(key) >= 0) continue;
             if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
             target[key] = source[key];
@@ -186,12 +199,11 @@ function _object_without_properties(source, excluded) {
 }
 function _object_without_properties_loose(source, excluded) {
     if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
+    var target = {}, sourceKeys = Object.getOwnPropertyNames(source), key, i;
     for(i = 0; i < sourceKeys.length; i++){
         key = sourceKeys[i];
         if (excluded.indexOf(key) >= 0) continue;
+        if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
         target[key] = source[key];
     }
     return target;
@@ -199,6 +211,9 @@ function _object_without_properties_loose(source, excluded) {
 function _sliced_to_array(arr, i) {
     return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
 }
+function _to_array(arr) {
+    return _array_with_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_rest();
+}
 function _unsupported_iterable_to_array(o, minLen) {
     if (!o) return;
     if (typeof o === "string") return _array_like_to_array(o, minLen);
@@ -207,21 +222,24 @@ function _unsupported_iterable_to_array(o, minLen) {
     if (n === "Map" || n === "Set") return Array.from(n);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
 }
-var datePickerRangeRoot = function(Root) {
-    return /*#__PURE__*/ (0, _react.forwardRef)(function(_param, ref) {
-        var className = _param.className, name = _param.name, autoComplete = _param.autoComplete, _param_isDoubleCalendar = _param.// controlled
-        isDoubleCalendar, isDoubleCalendar = _param_isDoubleCalendar === void 0 ? false : _param_isDoubleCalendar, _param_opened = _param.opened, opened = _param_opened === void 0 ? false : _param_opened, outerValue = _param.value, _param_defaultFirstDate = _param.defaultFirstDate, defaultFirstDate = _param_defaultFirstDate === void 0 ? '' : _param_defaultFirstDate, _param_defaultSecondDate = _param.defaultSecondDate, defaultSecondDate = _param_defaultSecondDate === void 0 ? '' : _param_defaultSecondDate, preserveInvalidOnBlur = _param.preserveInvalidOnBlur, // variations
-        view = _param.view, size = _param.size, _param_readOnly = _param.readOnly, readOnly = _param_readOnly === void 0 ? false : _param_readOnly, _param_disabled = _param.disabled, disabled = _param_disabled === void 0 ? false : _param_disabled, appearance = _param.appearance, hasClearDivider = _param.hasClearDivider, stretched = _param.stretched, firstValueError = _param.firstValueError, secondValueError = _param.secondValueError, firstValueSuccess = _param.firstValueSuccess, secondValueSuccess = _param.secondValueSuccess, // layout
-        required = _param.required, _param_requiredPlacement = _param.requiredPlacement, requiredPlacement = _param_requiredPlacement === void 0 ? 'right' : _param_requiredPlacement, _param_hasRequiredIndicator = _param.hasRequiredIndicator, hasRequiredIndicator = _param_hasRequiredIndicator === void 0 ? false : _param_hasRequiredIndicator, label = _param.label, leftHelper = _param.leftHelper, contentLeft = _param.contentLeft, contentRight = _param.contentRight, _param_dividerVariant = _param.dividerVariant, dividerVariant = _param_dividerVariant === void 0 ? 'dash' : _param_dividerVariant, dividerIcon = _param.dividerIcon, firstPlaceholder = _param.firstPlaceholder, secondPlaceholder = _param.secondPlaceholder, firstTextfieldContentLeft = _param.firstTextfieldContentLeft, firstTextfieldContentRight = _param.firstTextfieldContentRight, secondTextfieldContentLeft = _param.secondTextfieldContentLeft, secondTextfieldContentRight = _param.secondTextfieldContentRight, firstTextfieldTextBefore = _param.firstTextfieldTextBefore, secondTextfieldTextBefore = _param.secondTextfieldTextBefore, firstTextfieldTextAfter = _param.firstTextfieldTextAfter, secondTextfieldTextAfter = _param.secondTextfieldTextAfter, _param_hintTrigger = _param.// hint
-        hintTrigger, hintTrigger = _param_hintTrigger === void 0 ? 'hover' : _param_hintTrigger, hintText = _param.hintText, _param_hintView = _param.hintView, hintView = _param_hintView === void 0 ? 'default' : _param_hintView, _param_hintSize = _param.hintSize, hintSize = _param_hintSize === void 0 ? 'm' : _param_hintSize, hintTargetIcon = _param.hintTargetIcon, _param_hintTargetPlacement = _param.hintTargetPlacement, hintTargetPlacement = _param_hintTargetPlacement === void 0 ? 'outer' : _param_hintTargetPlacement, _param_hintPlacement = _param.hintPlacement, hintPlacement = _param_hintPlacement === void 0 ? 'auto' : _param_hintPlacement, hintHasArrow = _param.hintHasArrow, _param_hintOffset = _param.hintOffset, hintOffset = _param_hintOffset === void 0 ? [
+var datePickerRangeRoot = function datePickerRangeRoot(Root) {
+    return /*#__PURE__*/ (0, _react.forwardRef)(function(_0, _1) {
+        var _ref = [
+            _0,
+            _1
+        ], _ref1 = _to_array(_ref), _ref2 = _ref1[0], _rest = _ref1.slice(1), className = _ref2.className, name = _ref2.name, autoComplete = _ref2.autoComplete, _ref_isDoubleCalendar = _ref2.// controlled
+        isDoubleCalendar, isDoubleCalendar = _ref_isDoubleCalendar === void 0 ? false : _ref_isDoubleCalendar, _ref_opened = _ref2.opened, opened = _ref_opened === void 0 ? false : _ref_opened, outerValue = _ref2.value, _ref_defaultFirstDate = _ref2.defaultFirstDate, defaultFirstDate = _ref_defaultFirstDate === void 0 ? '' : _ref_defaultFirstDate, _ref_defaultSecondDate = _ref2.defaultSecondDate, defaultSecondDate = _ref_defaultSecondDate === void 0 ? '' : _ref_defaultSecondDate, preserveInvalidOnBlur = _ref2.preserveInvalidOnBlur, // variations
+        view = _ref2.view, size = _ref2.size, _ref_readOnly = _ref2.readOnly, readOnly = _ref_readOnly === void 0 ? false : _ref_readOnly, _ref_disabled = _ref2.disabled, disabled = _ref_disabled === void 0 ? false : _ref_disabled, appearance = _ref2.appearance, hasClearDivider = _ref2.hasClearDivider, stretched = _ref2.stretched, firstValueError = _ref2.firstValueError, secondValueError = _ref2.secondValueError, firstValueSuccess = _ref2.firstValueSuccess, secondValueSuccess = _ref2.secondValueSuccess, // layout
+        required = _ref2.required, _ref_requiredPlacement = _ref2.requiredPlacement, requiredPlacement = _ref_requiredPlacement === void 0 ? 'right' : _ref_requiredPlacement, _ref_hasRequiredIndicator = _ref2.hasRequiredIndicator, hasRequiredIndicator = _ref_hasRequiredIndicator === void 0 ? false : _ref_hasRequiredIndicator, label = _ref2.label, leftHelper = _ref2.leftHelper, contentLeft = _ref2.contentLeft, contentRight = _ref2.contentRight, _ref_dividerVariant = _ref2.dividerVariant, dividerVariant = _ref_dividerVariant === void 0 ? 'dash' : _ref_dividerVariant, dividerIcon = _ref2.dividerIcon, firstPlaceholder = _ref2.firstPlaceholder, secondPlaceholder = _ref2.secondPlaceholder, firstTextfieldContentLeft = _ref2.firstTextfieldContentLeft, firstTextfieldContentRight = _ref2.firstTextfieldContentRight, secondTextfieldContentLeft = _ref2.secondTextfieldContentLeft, secondTextfieldContentRight = _ref2.secondTextfieldContentRight, firstTextfieldTextBefore = _ref2.firstTextfieldTextBefore, secondTextfieldTextBefore = _ref2.secondTextfieldTextBefore, firstTextfieldTextAfter = _ref2.firstTextfieldTextAfter, secondTextfieldTextAfter = _ref2.secondTextfieldTextAfter, _ref_hintTrigger = _ref2.// hint
+        hintTrigger, hintTrigger = _ref_hintTrigger === void 0 ? 'hover' : _ref_hintTrigger, hintText = _ref2.hintText, _ref_hintView = _ref2.hintView, hintView = _ref_hintView === void 0 ? 'default' : _ref_hintView, _ref_hintSize = _ref2.hintSize, hintSize = _ref_hintSize === void 0 ? 'm' : _ref_hintSize, hintTargetIcon = _ref2.hintTargetIcon, _ref_hintTargetPlacement = _ref2.hintTargetPlacement, hintTargetPlacement = _ref_hintTargetPlacement === void 0 ? 'outer' : _ref_hintTargetPlacement, _ref_hintPlacement = _ref2.hintPlacement, hintPlacement = _ref_hintPlacement === void 0 ? 'auto' : _ref_hintPlacement, hintHasArrow = _ref2.hintHasArrow, _ref_hintOffset = _ref2.hintOffset, hintOffset = _ref_hintOffset === void 0 ? [
             0,
             0
-        ] : _param_hintOffset, hintWidth = _param.hintWidth, hintContentLeft = _param.hintContentLeft, _param_frame = _param.// calendar-container
-        frame, frame = _param_frame === void 0 ? 'document' : _param_frame, _param_usePortal = _param.usePortal, usePortal = _param_usePortal === void 0 ? false : _param_usePortal, zIndex = _param.zIndex, _param_placement = _param.placement, placement = _param_placement === void 0 ? [
+        ] : _ref_hintOffset, hintWidth = _ref2.hintWidth, hintContentLeft = _ref2.hintContentLeft, _ref_frame = _ref2.// calendar-container
+        frame, frame = _ref_frame === void 0 ? 'document' : _ref_frame, _ref_usePortal = _ref2.usePortal, usePortal = _ref_usePortal === void 0 ? false : _ref_usePortal, zIndex = _ref2.zIndex, _ref_placement = _ref2.placement, placement = _ref_placement === void 0 ? [
             'top',
             'bottom'
-        ] : _param_placement, _param_closeOnOverlayClick = _param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, _param_closeOnEsc = _param.closeOnEsc, closeOnEsc = _param_closeOnEsc === void 0 ? true : _param_closeOnEsc, _param_closeAfterDateSelect = _param.closeAfterDateSelect, closeAfterDateSelect = _param_closeAfterDateSelect === void 0 ? true : _param_closeAfterDateSelect, offset = _param.offset, _param_format = _param.// calendar
-        format, format = _param_format === void 0 ? 'DD.MM.YYYY' : _param_format, _param_lang = _param.lang, lang = _param_lang === void 0 ? 'ru' : _param_lang, maskWithFormat = _param.maskWithFormat, min = _param.min, max = _param.max, renderFromDate = _param.renderFromDate, _param_includeEdgeDates = _param.includeEdgeDates, includeEdgeDates = _param_includeEdgeDates === void 0 ? false : _param_includeEdgeDates, eventTooltipOptions = _param.eventTooltipOptions, eventList = _param.eventList, disabledList = _param.disabledList, eventMonthList = _param.eventMonthList, disabledMonthList = _param.disabledMonthList, eventQuarterList = _param.eventQuarterList, disabledQuarterList = _param.disabledQuarterList, eventYearList = _param.eventYearList, disabledYearList = _param.disabledYearList, _param_type = _param.type, type = _param_type === void 0 ? 'Days' : _param_type, calendarContainerWidth = _param.calendarContainerWidth, calendarContainerHeight = _param.calendarContainerHeight, onToggle = _param.onToggle, onChange = _param.onChange, onChangeFirstValue = _param.onChangeFirstValue, onChangeSecondValue = _param.onChangeSecondValue, onCommitFirstDate = _param.onCommitFirstDate, onCommitSecondDate = _param.onCommitSecondDate, onFocusFirstTextfield = _param.onFocusFirstTextfield, onFocusSecondTextfield = _param.onFocusSecondTextfield, onBlurFirstTextfield = _param.onBlurFirstTextfield, onBlurSecondTextfield = _param.onBlurSecondTextfield, rest = _object_without_properties(_param, [
+        ] : _ref_placement, _ref_closeOnOverlayClick = _ref2.closeOnOverlayClick, closeOnOverlayClick = _ref_closeOnOverlayClick === void 0 ? true : _ref_closeOnOverlayClick, _ref_closeOnEsc = _ref2.closeOnEsc, closeOnEsc = _ref_closeOnEsc === void 0 ? true : _ref_closeOnEsc, _ref_closeAfterDateSelect = _ref2.closeAfterDateSelect, closeAfterDateSelect = _ref_closeAfterDateSelect === void 0 ? true : _ref_closeAfterDateSelect, offset = _ref2.offset, _ref_format = _ref2.// calendar
+        format, format = _ref_format === void 0 ? 'DD.MM.YYYY' : _ref_format, _ref_lang = _ref2.lang, lang = _ref_lang === void 0 ? 'ru' : _ref_lang, maskWithFormat = _ref2.maskWithFormat, min = _ref2.min, max = _ref2.max, renderFromDate = _ref2.renderFromDate, _ref_includeEdgeDates = _ref2.includeEdgeDates, includeEdgeDates = _ref_includeEdgeDates === void 0 ? false : _ref_includeEdgeDates, eventTooltipOptions = _ref2.eventTooltipOptions, eventList = _ref2.eventList, disabledList = _ref2.disabledList, eventMonthList = _ref2.eventMonthList, disabledMonthList = _ref2.disabledMonthList, eventQuarterList = _ref2.eventQuarterList, disabledQuarterList = _ref2.disabledQuarterList, eventYearList = _ref2.eventYearList, disabledYearList = _ref2.disabledYearList, _ref_type = _ref2.type, type = _ref_type === void 0 ? 'Days' : _ref_type, calendarContainerWidth = _ref2.calendarContainerWidth, calendarContainerHeight = _ref2.calendarContainerHeight, dateShortcuts = _ref2.dateShortcuts, _ref_dateShortcutsPlacement = _ref2.dateShortcutsPlacement, dateShortcutsPlacement = _ref_dateShortcutsPlacement === void 0 ? 'left' : _ref_dateShortcutsPlacement, dateShortcutsWidth = _ref2.dateShortcutsWidth, onToggle = _ref2.onToggle, onChange = _ref2.onChange, onChangeFirstValue = _ref2.onChangeFirstValue, onChangeSecondValue = _ref2.onChangeSecondValue, onCommitFirstDate = _ref2.onCommitFirstDate, onCommitSecondDate = _ref2.onCommitSecondDate, onFocusFirstTextfield = _ref2.onFocusFirstTextfield, onFocusSecondTextfield = _ref2.onFocusSecondTextfield, onBlurFirstTextfield = _ref2.onBlurFirstTextfield, onBlurSecondTextfield = _ref2.onBlurSecondTextfield, rest = _object_without_properties(_ref2, [
             "className",
             "name",
             "autoComplete",
@@ -299,6 +317,9 @@ var datePickerRangeRoot = function(Root) {
             "type",
             "calendarContainerWidth",
             "calendarContainerHeight",
+            "dateShortcuts",
+            "dateShortcutsPlacement",
+            "dateShortcutsWidth",
             "onToggle",
             "onChange",
             "onChangeFirstValue",
@@ -309,7 +330,8 @@ var datePickerRangeRoot = function(Root) {
             "onFocusSecondTextfield",
             "onBlurFirstTextfield",
             "onBlurSecondTextfield"
-        ]);
+        ]), _rest1 = _sliced_to_array(_rest, 1), ref = _rest1[0];
+        var _ref3, _ref4;
         var _rangeRef_current, _rangeRef_current1;
         var rangeRef = ref && 'current' in ref ? ref : /*#__PURE__*/ (0, _react.createRef)();
         var rootRef = (0, _react.useRef)(null);
@@ -320,8 +342,7 @@ var datePickerRangeRoot = function(Root) {
         var _useState2 = _sliced_to_array((0, _react.useState)(opened), 2), isInnerOpen = _useState2[0], setIsInnerOpen = _useState2[1];
         var dateFormatDelimiter = (0, _dateHelper.getDateFormatDelimiter)(format);
         var _useState3 = _sliced_to_array((0, _react.useState)(defaultFirstDate || ''), 2), startInnerDate = _useState3[0], setStartInnerDate = _useState3[1];
-        var _outerValue_;
-        var startDateValue = (_outerValue_ = outerValue === null || outerValue === void 0 ? void 0 : outerValue[0]) !== null && _outerValue_ !== void 0 ? _outerValue_ : startInnerDate;
+        var startDateValue = (_ref3 = outerValue === null || outerValue === void 0 ? void 0 : outerValue[0]) !== null && _ref3 !== void 0 ? _ref3 : startInnerDate;
         var startInitialValues = (0, _utils2.getFormattedDates)({
             value: startDateValue,
             delimiter: dateFormatDelimiter,
@@ -332,8 +353,7 @@ var datePickerRangeRoot = function(Root) {
             max: max
         });
         var _useState4 = _sliced_to_array((0, _react.useState)(defaultSecondDate || ''), 2), endInnerDate = _useState4[0], setEndInnerDate = _useState4[1];
-        var _outerValue_1;
-        var endDateValue = (_outerValue_1 = outerValue === null || outerValue === void 0 ? void 0 : outerValue[1]) !== null && _outerValue_1 !== void 0 ? _outerValue_1 : endInnerDate;
+        var endDateValue = (_ref4 = outerValue === null || outerValue === void 0 ? void 0 : outerValue[1]) !== null && _ref4 !== void 0 ? _ref4 : endInnerDate;
         var endInitialValues = (0, _utils2.getFormattedDates)({
             value: endDateValue,
             delimiter: dateFormatDelimiter,
@@ -357,7 +377,7 @@ var datePickerRangeRoot = function(Root) {
         var inputSecondValue = endInitialValues.formattedDate;
         var fullDateEntered = Boolean(calendarFirstValue && calendarSecondValue);
         var _useState7 = _sliced_to_array((0, _react.useState)(false), 2), secondTextFieldClicked = _useState7[0], setSecondTextFieldClicked = _useState7[1];
-        var handleInputChange = function(value) {
+        var handleInputChange = function handleInputChange(value) {
             if (onChange) {
                 onChange({
                     target: {
@@ -367,11 +387,11 @@ var datePickerRangeRoot = function(Root) {
                 });
             }
         };
-        var setFirstInputValue = function(value) {
+        var setFirstInputValue = function setFirstInputValue(value) {
             setStartInnerDate(value);
             handleInputChange("".concat(value, " - ").concat(inputSecondValue));
         };
-        var setSecondInputValue = function(value) {
+        var setSecondInputValue = function setSecondInputValue(value) {
             setEndInnerDate(value);
             handleInputChange("".concat(inputFirstValue, " - ").concat(value));
         };
@@ -408,7 +428,7 @@ var datePickerRangeRoot = function(Root) {
             onChangeValue: onChangeSecondValue,
             onCommitDate: onCommitSecondDate
         })), handleChangeSecondValue = _useDatePicker2.handleChangeValue, handleSecondCalendarPick = _useDatePicker2.handleCalendarPick, handleSearchSecond = _useDatePicker2.handleSearch, updateExternalSecondDate = _useDatePicker2.updateExternalDate, getSecondQuarterInfo = _useDatePicker2.getQuarterInfo;
-        var handleToggle = function(currentOpened, event) {
+        var handleToggle = function handleToggle(currentOpened, event) {
             var _firstInputRef_current, _secondInputRef_current;
             if (disabled || readOnly) {
                 return;
@@ -422,15 +442,15 @@ var datePickerRangeRoot = function(Root) {
             }
             setIsInnerOpen(isCalendarOpen);
         };
-        var handleFocusFirstTextField = function(event) {
+        var handleFocusFirstTextField = function handleFocusFirstTextField(event) {
             onFocusFirstTextfield === null || onFocusFirstTextfield === void 0 ? void 0 : onFocusFirstTextfield(event);
             setSecondTextFieldClicked(false);
         };
-        var handleFocusSecondTextField = function(event) {
+        var handleFocusSecondTextField = function handleFocusSecondTextField(event) {
             onFocusSecondTextfield === null || onFocusSecondTextfield === void 0 ? void 0 : onFocusSecondTextfield(event);
             setSecondTextFieldClicked(true);
         };
-        var handleBlur = function(event, outerHandler) {
+        var handleBlur = function handleBlur(event, outerHandler) {
             if (!inputFirstValue || !inputSecondValue || preserveInvalidOnBlur) {
                 outerHandler === null || outerHandler === void 0 ? void 0 : outerHandler(event);
                 return;
@@ -518,7 +538,11 @@ var datePickerRangeRoot = function(Root) {
             closeOnEsc: closeOnEsc,
             onToggle: handleToggle
         }).onKeyDown;
-        var handleChangeStartOfRange = function(chosenDate, dateInfo) {
+        var handleShortcutDateSelect = function handleShortcutDateSelect(shortcutDate) {
+            handleFirstCalendarPick(shortcutDate[0]);
+            handleSecondCalendarPick(shortcutDate[1]);
+        };
+        var handleChangeStartOfRange = function handleChangeStartOfRange(chosenDate, dateInfo) {
             if (!fullDateEntered) {
                 handleFirstCalendarPick(chosenDate, dateInfo);
                 handleSecondCalendarPick(undefined);
@@ -545,8 +569,8 @@ var datePickerRangeRoot = function(Root) {
                 handleToggle(false);
             }
         };
-        var handleChangeCalendarValue = function(param, dateInfo) {
-            var _$_param = _sliced_to_array(param, 2), firstDate = _$_param[0], secondDate = _$_param[1];
+        var handleChangeCalendarValue = function handleChangeCalendarValue(param, dateInfo) {
+            var _param = _sliced_to_array(param, 2), firstDate = _param[0], secondDate = _param[1];
             /**
                  * NOTE: проверяем совпадает ли новая дата с предыдущей
                  * Если нет, то вызываем handle{First,Second}CalendarPick
@@ -597,14 +621,14 @@ var datePickerRangeRoot = function(Root) {
             onChangeFirstValue: handleChangeFirstValue,
             onChangeSecondValue: handleChangeSecondValue,
             name: name,
-            onSearchFirstValue: function(_, date) {
+            onSearchFirstValue: function onSearchFirstValue(_, date) {
                 handleSearchFirst(String(date));
                 if (!calendarSecondValue || secondValueError) {
                     var _rangeRef_current_secondTextField_current, _rangeRef_current_secondTextField, _rangeRef_current;
                     rangeRef === null || rangeRef === void 0 ? void 0 : (_rangeRef_current = rangeRef.current) === null || _rangeRef_current === void 0 ? void 0 : (_rangeRef_current_secondTextField = _rangeRef_current.secondTextField()) === null || _rangeRef_current_secondTextField === void 0 ? void 0 : (_rangeRef_current_secondTextField_current = _rangeRef_current_secondTextField.current) === null || _rangeRef_current_secondTextField_current === void 0 ? void 0 : _rangeRef_current_secondTextField_current.focus();
                 }
             },
-            onSearchSecondValue: function(_, date) {
+            onSearchSecondValue: function onSearchSecondValue(_, date) {
                 handleSearchSecond(String(date));
                 if (!calendarFirstValue || firstValueError) {
                     var _rangeRef_current_firstTextField_current, _rangeRef_current_firstTextField, _rangeRef_current;
@@ -613,10 +637,10 @@ var datePickerRangeRoot = function(Root) {
             },
             onFocusFirstTextfield: handleFocusFirstTextField,
             onFocusSecondTextfield: handleFocusSecondTextField,
-            onBlurFirstTextfield: function(event) {
+            onBlurFirstTextfield: function onBlurFirstTextfield1(event) {
                 return handleBlur(event, onBlurFirstTextfield);
             },
-            onBlurSecondTextfield: function(event) {
+            onBlurSecondTextfield: function onBlurSecondTextfield1(event) {
                 return handleBlur(event, onBlurSecondTextfield);
             },
             onKeyDown: onKeyDown,
@@ -732,7 +756,11 @@ var datePickerRangeRoot = function(Root) {
             rootWrapper: RootWrapper,
             onChangeStartOfRange: handleChangeStartOfRange,
             onChangeValue: handleChangeCalendarValue,
-            setIsInnerOpen: setIsInnerOpen
+            setIsInnerOpen: setIsInnerOpen,
+            dateShortcuts: dateShortcuts,
+            dateShortcutsPlacement: dateShortcutsPlacement,
+            dateShortcutsWidth: dateShortcutsWidth,
+            onShortcutDateSelect: handleShortcutDateSelect
         }), /*#__PURE__*/ _react.default.createElement(_DatePickerBasestyles.InputHidden, _object_spread({
             name: name,
             type: "hidden",

package/dist/styled-components/cjs/components/DatePicker/RangeDate/RangeDate.styles.js

@@ -71,13 +71,29 @@ var mergedPopoverConfig = (0, _engines.mergeConfig)(_Popover.popoverConfig);
 var Popover = (0, _engines.component)(mergedPopoverConfig);
 var StyledPopover = (0, _styledcomponents.default)(Popover).withConfig({
     displayName: "RangeDate.styles__StyledPopover",
-    componentId: "sc-9752899b-0"
+    componentId: "sc-8a6fa694-0"
 })([
-    ""
-]);
+    ".",
+    "{box-sizing:border-box;display:flex;gap:var(",
+    ");border-radius:var(",
+    ");padding:var(",
+    ");border:var(",
+    ") solid var(",
+    ");background:var(",
+    ");box-shadow:var(",
+    ");overflow:hidden;width:",
+    ";height:",
+    ";}"
+], _DatePickertokens.classes.datePickerRoot, _DatePickertokens.tokens.popoverGap, _DatePickertokens.tokens.popoverBorderRadius, _DatePickertokens.tokens.popoverPadding, _DatePickertokens.tokens.calendarBorderWidth, _DatePickertokens.tokens.calendarBorderColor, _DatePickertokens.tokens.popoverBackgroundColor, _DatePickertokens.tokens.popoverShadow, function(param) {
+    var innerWidth = param.innerWidth;
+    return innerWidth || 'fit-content';
+}, function(param) {
+    var innerHeight = param.innerHeight;
+    return innerHeight || 'fit-content';
+});
 var StyledRange = (0, _styledcomponents.default)(Range).withConfig({
     displayName: "RangeDate.styles__StyledRange",
-    componentId: "sc-9752899b-1"
+    componentId: "sc-8a6fa694-1"
 })([
     "",
     ":var(",

package/dist/styled-components/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.js

@@ -13,6 +13,7 @@ var _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
 var _utils = require("../../../../utils");
 var _RangeDatestyles = require("../RangeDate.styles");
 var _DatePickertokens = require("../../DatePicker.tokens");
+var _ui = require("../../ui");
 var _RangeDatePopoverstyles = require("./RangeDatePopover.styles");
 function _define_property(obj, key, value) {
     if (key in obj) {
@@ -73,17 +74,17 @@ function _interop_require_wildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-var RangeDatePopover = function(param) {
+var RangeDatePopover = function RangeDatePopover(param) {
     var Root = param.rootWrapper, target = param.target, isOpen = param.isOpen, opened = param.opened, isDoubleCalendar = param.isDoubleCalendar, calendarValue = param.calendarValue, min = param.min, max = param.max, renderFromDate = param.renderFromDate, includeEdgeDates = param.includeEdgeDates, eventTooltipOptions = param.eventTooltipOptions, eventList = param.eventList, disabledList = param.disabledList, eventMonthList = param.eventMonthList, disabledMonthList = param.disabledMonthList, eventQuarterList = param.eventQuarterList, disabledQuarterList = param.disabledQuarterList, eventYearList = param.eventYearList, disabledYearList = param.disabledYearList, _param_frame = param.frame, frame = _param_frame === void 0 ? 'document' : _param_frame, _param_usePortal = param.usePortal, usePortal = _param_usePortal === void 0 ? false : _param_usePortal, zIndex = param.zIndex, _param_placement = param.placement, placement = _param_placement === void 0 ? [
         'top',
         'bottom'
-    ] : _param_placement, _param_closeOnOverlayClick = param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, closeOnEsc = param.closeOnEsc, offset = param.offset, calendarContainerWidth = param.calendarContainerWidth, calendarContainerHeight = param.calendarContainerHeight, stretched = param.stretched, type = param.type, size = param.size, _param_lang = param.lang, lang = _param_lang === void 0 ? 'ru' : _param_lang, disabled = param.disabled, readOnly = param.readOnly, setIsInnerOpen = param.setIsInnerOpen, onChangeValue = param.onChangeValue, onChangeStartOfRange = param.onChangeStartOfRange, onToggle = param.onToggle;
+    ] : _param_placement, _param_closeOnOverlayClick = param.closeOnOverlayClick, closeOnOverlayClick = _param_closeOnOverlayClick === void 0 ? true : _param_closeOnOverlayClick, closeOnEsc = param.closeOnEsc, offset = param.offset, calendarContainerWidth = param.calendarContainerWidth, calendarContainerHeight = param.calendarContainerHeight, stretched = param.stretched, type = param.type, size = param.size, _param_lang = param.lang, lang = _param_lang === void 0 ? 'ru' : _param_lang, disabled = param.disabled, readOnly = param.readOnly, dateShortcuts = param.dateShortcuts, _param_dateShortcutsPlacement = param.dateShortcutsPlacement, dateShortcutsPlacement = _param_dateShortcutsPlacement === void 0 ? 'left' : _param_dateShortcutsPlacement, dateShortcutsWidth = param.dateShortcutsWidth, onShortcutDateSelect = param.onShortcutDateSelect, setIsInnerOpen = param.setIsInnerOpen, onChangeValue = param.onChangeValue, onChangeStartOfRange = param.onChangeStartOfRange, onToggle = param.onToggle;
     var innerIsOpen = Boolean(isOpen || opened);
     var calendarRootRef = (0, _react.useRef)(null);
     var doubleCalendarRootRef = (0, _react.useRef)(null);
     var calendarContainerWidthValue = calendarContainerWidth ? (0, _utils.getSizeValueFromProp)(calendarContainerWidth, 'rem') : undefined;
     var calendarContainerHeightValue = calendarContainerHeight ? (0, _utils.getSizeValueFromProp)(calendarContainerHeight, 'rem') : undefined;
-    var handleCalendarRootClick = function(event) {
+    var handleCalendarRootClick = function handleCalendarRootClick(event) {
         if (disabled || readOnly) {
             return;
         }
@@ -108,12 +109,20 @@ var RangeDatePopover = function(param) {
             isFocusTrapped: false,
             target: target,
             preventOverflow: false,
-            zIndex: zIndex
+            zIndex: zIndex,
+            innerWidth: calendarContainerWidthValue,
+            innerHeight: calendarContainerHeightValue
         }, /*#__PURE__*/ _react.default.createElement(Root, {
             ref: doubleCalendarRootRef,
             className: (0, _classnames.default)(_DatePickertokens.classes.datePickerRoot, _define_property({}, _DatePickertokens.classes.datePickerstretched, stretched)),
             onClick: handleCalendarRootClick
-        }, /*#__PURE__*/ _react.default.createElement(_RangeDatePopoverstyles.StyledCalendarDouble, {
+        }, (dateShortcuts === null || dateShortcuts === void 0 ? void 0 : dateShortcuts.length) && onShortcutDateSelect ? /*#__PURE__*/ _react.default.createElement(_ui.StyledShortcutList, {
+            items: dateShortcuts,
+            setShortcutDate: onShortcutDateSelect,
+            dateShortcutsWidth: dateShortcutsWidth,
+            calendarContainerHeight: calendarContainerHeight,
+            dateShortcutsPlacement: dateShortcutsPlacement
+        }) : null, /*#__PURE__*/ _react.default.createElement(_RangeDatePopoverstyles.StyledCalendarDouble, {
             className: (0, _classnames.default)(_define_property({}, _DatePickertokens.classes.datePickerCalendarstretched, stretched)),
             innerWidth: calendarContainerWidthValue,
             innerHeight: calendarContainerHeightValue,
@@ -151,12 +160,20 @@ var RangeDatePopover = function(param) {
         target: target,
         preventOverflow: false,
         closeOnEsc: closeOnEsc,
-        zIndex: zIndex
+        zIndex: zIndex,
+        innerWidth: calendarContainerWidthValue,
+        innerHeight: calendarContainerHeightValue
     }, /*#__PURE__*/ _react.default.createElement(Root, {
         ref: calendarRootRef,
         className: (0, _classnames.default)(_DatePickertokens.classes.datePickerRoot, _define_property({}, _DatePickertokens.classes.datePickerstretched, stretched)),
         onClick: handleCalendarRootClick
-    }, /*#__PURE__*/ _react.default.createElement(_RangeDatePopoverstyles.StyledCalendar, {
+    }, (dateShortcuts === null || dateShortcuts === void 0 ? void 0 : dateShortcuts.length) && onShortcutDateSelect ? /*#__PURE__*/ _react.default.createElement(_ui.StyledShortcutList, {
+        items: dateShortcuts,
+        setShortcutDate: onShortcutDateSelect,
+        dateShortcutsWidth: dateShortcutsWidth,
+        calendarContainerHeight: calendarContainerHeight,
+        dateShortcutsPlacement: dateShortcutsPlacement
+    }) : null, /*#__PURE__*/ _react.default.createElement(_RangeDatePopoverstyles.StyledCalendar, {
         className: (0, _classnames.default)(_define_property({}, _DatePickertokens.classes.datePickerCalendarstretched, stretched)),
         innerWidth: calendarContainerWidthValue,
         innerHeight: calendarContainerHeightValue,

package/dist/styled-components/cjs/components/DatePicker/RangeDate/RangeDatePopover/RangeDatePopover.styles.js

@@ -34,35 +34,41 @@ var CalendarDoubleRange = (0, _Calendar.withRange)(CalendarDouble);
 var CalendarRange = (0, _Calendar.withRange)(Calendar);
 var StyledCalendarDouble = (0, _styledcomponents.default)(CalendarDoubleRange).withConfig({
     displayName: "RangeDatePopover.styles__StyledCalendarDouble",
-    componentId: "sc-95daf184-0"
+    componentId: "sc-94558ff2-0"
 })([
     "",
-    ":var(",
-    ");",
-    " ",
     ":calc(var(",
-    ") * 2 + 2.063rem);width:",
+    ") * 2 + 2.063rem);flex-shrink:",
+    ";width:",
     ";height:",
-    ";"
-], _Calendar.calendarBaseTokens.calendarSeparatorBackground, _DatePickertokens.tokens.calendarSeparatorBackground, _DatePickerBasestyles.baseCalendarTokens, _DatePickertokens.pivateTokens.calendarDoubleWidth, _DatePickertokens.tokens.calendarContainerWidth, function(param) {
+    ";",
+    ""
+], _DatePickertokens.privateTokens.calendarDoubleWidth, _DatePickertokens.tokens.calendarWidth, function(param) {
     var innerWidth = param.innerWidth;
-    return innerWidth || "var(".concat(_DatePickertokens.pivateTokens.calendarDoubleWidth, ")");
+    return innerWidth && innerWidth !== '0' ? '1' : '0';
+}, function(param) {
+    var innerWidth = param.innerWidth;
+    return innerWidth && innerWidth !== '0' ? '100%' : "var(".concat(_DatePickertokens.privateTokens.calendarDoubleWidth, ")");
 }, function(param) {
     var innerHeight = param.innerHeight;
-    return innerHeight || "var(".concat(_DatePickertokens.tokens.calendarContainerHeight, ")");
-});
+    return innerHeight && innerHeight !== '0' ? '100%' : "var(".concat(_DatePickertokens.tokens.calendarHeight, ")");
+}, _DatePickerBasestyles.baseCalendarTokens);
 var StyledCalendar = (0, _styledcomponents.default)(CalendarRange).withConfig({
     displayName: "RangeDatePopover.styles__StyledCalendar",
-    componentId: "sc-95daf184-1"
+    componentId: "sc-94558ff2-1"
 })([
-    "",
-    " width:",
+    "flex-shrink:",
+    ";width:",
     ";height:",
-    ";"
-], _DatePickerBasestyles.baseCalendarTokens, function(param) {
+    ";",
+    ""
+], function(param) {
     var innerWidth = param.innerWidth;
-    return innerWidth || "var(".concat(_DatePickertokens.tokens.calendarContainerWidth, ")");
+    return innerWidth && innerWidth !== '0' ? '1' : '0';
+}, function(param) {
+    var innerWidth = param.innerWidth;
+    return innerWidth && innerWidth !== '0' ? '100%' : "var(".concat(_DatePickertokens.tokens.calendarWidth, ")");
 }, function(param) {
     var innerHeight = param.innerHeight;
-    return innerHeight || "var(".concat(_DatePickertokens.tokens.calendarContainerHeight, ")");
-});
+    return innerHeight && innerHeight !== '0' ? '100%' : "var(".concat(_DatePickertokens.tokens.calendarHeight, ")");
+}, _DatePickerBasestyles.baseCalendarTokens);