import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, extends as _extends, defineProperty as _defineProperty } from '../../../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { forwardRef, useRef, useState, useEffect, useLayoutEffect, useCallback, createRef } from 'react';
import cls from 'classnames';
import { customDayjs } from '../../../utils/datejs.js';
import { getDateFormatDelimiter } from '../utils/dateHelper.js';
import { useDatePicker } from '../hooks/useDatePicker.js';
import { classes } from '../DatePicker.tokens.js';
import { keys, useKeyNavigation } from '../hooks/useKeyboardNavigation.js';
import { InputHidden } from '../DatePickerBase.styles.js';
import { base as base$2 } from './variations/_size/base.js';
import { base as base$1 } from './variations/_view/base.js';
import { base as base$4 } from './variations/_hint-view/base.js';
import { base as base$5 } from './variations/_hint-size/base.js';
import { base as base$3 } from './variations/_tooltip-size/base.js';
import { base as base$6 } from './variations/_disabled/base.js';
import { base as base$7 } from './variations/_readonly/base.js';
import { base, StyledRange } from './RangeDate.styles.js';
import { RangeDatePopover } from './RangeDatePopover/RangeDatePopover.js';
import { getFormattedDates } from '../utils/getFormattedDates.js';
import { noop } from '../../../utils/noop.js';
import { invokeOnCommitDate } from '../utils/invokeOnCommitDate.js';
import { getSortedValues } from '../../Calendar/utils/calendarRangeHelper.js';

var _excluded = ["className", "name", "autoComplete", "isDoubleCalendar", "opened", "value", "defaultFirstDate", "defaultSecondDate", "preserveInvalidOnBlur", "view", "size", "readOnly", "disabled", "appearance", "hasClearDivider", "stretched", "firstValueError", "secondValueError", "firstValueSuccess", "secondValueSuccess", "firstValueEdited", "secondValueEdited", "required", "requiredPlacement", "hasRequiredIndicator", "label", "leftHelper", "contentLeft", "contentRight", "dividerVariant", "dividerIcon", "firstPlaceholder", "secondPlaceholder", "firstTextfieldContentLeft", "firstTextfieldContentRight", "secondTextfieldContentLeft", "secondTextfieldContentRight", "firstTextfieldTextBefore", "secondTextfieldTextBefore", "firstTextfieldTextAfter", "secondTextfieldTextAfter", "hintTrigger", "hintText", "hintView", "hintSize", "hintTargetIcon", "hintTargetPlacement", "hintPlacement", "hintHasArrow", "hintOffset", "hintWidth", "hintContentLeft", "frame", "usePortal", "zIndex", "placement", "closeOnOverlayClick", "closeOnEsc", "closeAfterDateSelect", "offset", "disableFlip", "format", "lang", "maskWithFormat", "min", "max", "renderFromDate", "includeEdgeDates", "eventTooltipOptions", "eventList", "disabledList", "eventMonthList", "disabledMonthList", "eventQuarterList", "disabledQuarterList", "eventYearList", "disabledYearList", "type", "calendarContainerWidth", "calendarContainerHeight", "dateShortcuts", "dateShortcutsPlacement", "dateShortcutsWidth", "onToggle", "onChange", "onChangeFirstValue", "onChangeSecondValue", "onCommitFirstDate", "onCommitSecondDate", "onFocusFirstTextfield", "onFocusSecondTextfield", "onBlurFirstTextfield", "onBlurSecondTextfield"];
var datePickerRangeRoot = function datePickerRangeRoot(Root) {
  return /*#__PURE__*/forwardRef(function (_ref, ref) {
    var _rangeRef$current, _rangeRef$current2, _outerValue$, _outerValue$2;
    var className = _ref.className,
      name = _ref.name,
      autoComplete = _ref.autoComplete,
      _ref$isDoubleCalendar = _ref.isDoubleCalendar,
      isDoubleCalendar = _ref$isDoubleCalendar === void 0 ? false : _ref$isDoubleCalendar,
      outerOpened = _ref.opened,
      outerValue = _ref.value,
      _ref$defaultFirstDate = _ref.defaultFirstDate,
      defaultFirstDate = _ref$defaultFirstDate === void 0 ? '' : _ref$defaultFirstDate,
      _ref$defaultSecondDat = _ref.defaultSecondDate,
      defaultSecondDate = _ref$defaultSecondDat === void 0 ? '' : _ref$defaultSecondDat,
      preserveInvalidOnBlur = _ref.preserveInvalidOnBlur,
      view = _ref.view,
      size = _ref.size,
      _ref$readOnly = _ref.readOnly,
      readOnly = _ref$readOnly === void 0 ? false : _ref$readOnly,
      _ref$disabled = _ref.disabled,
      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
      appearance = _ref.appearance,
      hasClearDivider = _ref.hasClearDivider,
      stretched = _ref.stretched,
      firstValueError = _ref.firstValueError,
      secondValueError = _ref.secondValueError,
      firstValueSuccess = _ref.firstValueSuccess,
      secondValueSuccess = _ref.secondValueSuccess,
      firstValueEdited = _ref.firstValueEdited,
      secondValueEdited = _ref.secondValueEdited,
      required = _ref.required,
      _ref$requiredPlacemen = _ref.requiredPlacement,
      requiredPlacement = _ref$requiredPlacemen === void 0 ? 'right' : _ref$requiredPlacemen,
      _ref$hasRequiredIndic = _ref.hasRequiredIndicator,
      hasRequiredIndicator = _ref$hasRequiredIndic === void 0 ? false : _ref$hasRequiredIndic,
      label = _ref.label,
      leftHelper = _ref.leftHelper,
      contentLeft = _ref.contentLeft,
      contentRight = _ref.contentRight,
      _ref$dividerVariant = _ref.dividerVariant,
      dividerVariant = _ref$dividerVariant === void 0 ? 'dash' : _ref$dividerVariant,
      dividerIcon = _ref.dividerIcon,
      firstPlaceholder = _ref.firstPlaceholder,
      secondPlaceholder = _ref.secondPlaceholder,
      firstTextfieldContentLeft = _ref.firstTextfieldContentLeft,
      firstTextfieldContentRight = _ref.firstTextfieldContentRight,
      secondTextfieldContentLeft = _ref.secondTextfieldContentLeft,
      secondTextfieldContentRight = _ref.secondTextfieldContentRight,
      firstTextfieldTextBefore = _ref.firstTextfieldTextBefore,
      secondTextfieldTextBefore = _ref.secondTextfieldTextBefore,
      firstTextfieldTextAfter = _ref.firstTextfieldTextAfter,
      secondTextfieldTextAfter = _ref.secondTextfieldTextAfter,
      _ref$hintTrigger = _ref.hintTrigger,
      hintTrigger = _ref$hintTrigger === void 0 ? 'hover' : _ref$hintTrigger,
      hintText = _ref.hintText,
      _ref$hintView = _ref.hintView,
      hintView = _ref$hintView === void 0 ? 'default' : _ref$hintView,
      _ref$hintSize = _ref.hintSize,
      hintSize = _ref$hintSize === void 0 ? 'm' : _ref$hintSize,
      hintTargetIcon = _ref.hintTargetIcon,
      _ref$hintTargetPlacem = _ref.hintTargetPlacement,
      hintTargetPlacement = _ref$hintTargetPlacem === void 0 ? 'outer' : _ref$hintTargetPlacem,
      _ref$hintPlacement = _ref.hintPlacement,
      hintPlacement = _ref$hintPlacement === void 0 ? 'auto' : _ref$hintPlacement,
      hintHasArrow = _ref.hintHasArrow,
      _ref$hintOffset = _ref.hintOffset,
      hintOffset = _ref$hintOffset === void 0 ? [0, 0] : _ref$hintOffset,
      hintWidth = _ref.hintWidth,
      hintContentLeft = _ref.hintContentLeft,
      _ref$frame = _ref.frame,
      frame = _ref$frame === void 0 ? 'document' : _ref$frame,
      _ref$usePortal = _ref.usePortal,
      usePortal = _ref$usePortal === void 0 ? false : _ref$usePortal,
      zIndex = _ref.zIndex,
      _ref$placement = _ref.placement,
      placement = _ref$placement === void 0 ? ['top', 'bottom'] : _ref$placement,
      _ref$closeOnOverlayCl = _ref.closeOnOverlayClick,
      closeOnOverlayClick = _ref$closeOnOverlayCl === void 0 ? true : _ref$closeOnOverlayCl,
      _ref$closeOnEsc = _ref.closeOnEsc,
      closeOnEsc = _ref$closeOnEsc === void 0 ? true : _ref$closeOnEsc,
      _ref$closeAfterDateSe = _ref.closeAfterDateSelect,
      closeAfterDateSelect = _ref$closeAfterDateSe === void 0 ? true : _ref$closeAfterDateSe,
      offset = _ref.offset,
      disableFlip = _ref.disableFlip,
      _ref$format = _ref.format,
      format = _ref$format === void 0 ? 'DD.MM.YYYY' : _ref$format,
      _ref$lang = _ref.lang,
      lang = _ref$lang === void 0 ? 'ru' : _ref$lang,
      maskWithFormat = _ref.maskWithFormat,
      min = _ref.min,
      max = _ref.max,
      renderFromDate = _ref.renderFromDate,
      _ref$includeEdgeDates = _ref.includeEdgeDates,
      includeEdgeDates = _ref$includeEdgeDates === void 0 ? false : _ref$includeEdgeDates,
      eventTooltipOptions = _ref.eventTooltipOptions,
      eventList = _ref.eventList,
      disabledList = _ref.disabledList,
      eventMonthList = _ref.eventMonthList,
      disabledMonthList = _ref.disabledMonthList,
      eventQuarterList = _ref.eventQuarterList,
      disabledQuarterList = _ref.disabledQuarterList,
      eventYearList = _ref.eventYearList,
      disabledYearList = _ref.disabledYearList,
      _ref$type = _ref.type,
      type = _ref$type === void 0 ? 'Days' : _ref$type,
      calendarContainerWidth = _ref.calendarContainerWidth,
      calendarContainerHeight = _ref.calendarContainerHeight,
      dateShortcuts = _ref.dateShortcuts,
      _ref$dateShortcutsPla = _ref.dateShortcutsPlacement,
      dateShortcutsPlacement = _ref$dateShortcutsPla === void 0 ? 'left' : _ref$dateShortcutsPla,
      dateShortcutsWidth = _ref.dateShortcutsWidth,
      onToggle = _ref.onToggle,
      onChange = _ref.onChange,
      onChangeFirstValue = _ref.onChangeFirstValue,
      onChangeSecondValue = _ref.onChangeSecondValue,
      onCommitFirstDate = _ref.onCommitFirstDate,
      onCommitSecondDate = _ref.onCommitSecondDate,
      onFocusFirstTextfield = _ref.onFocusFirstTextfield,
      onFocusSecondTextfield = _ref.onFocusSecondTextfield,
      onBlurFirstTextfield = _ref.onBlurFirstTextfield,
      onBlurSecondTextfield = _ref.onBlurSecondTextfield,
      rest = _objectWithoutProperties(_ref, _excluded);
    var rangeRef = ref && 'current' in ref ? ref : /*#__PURE__*/createRef();
    var rootRef = useRef(null);
    var innerRefFirst = useRef(null);
    var innerRefSecond = useRef(null);
    var _useState = useState(rangeRef === null || rangeRef === void 0 || (_rangeRef$current = rangeRef.current) === null || _rangeRef$current === void 0 ? void 0 : _rangeRef$current.firstTextField()),
      _useState2 = _slicedToArray(_useState, 2),
      firstInputRef = _useState2[0],
      setFirstInputRef = _useState2[1];
    var _useState3 = useState(rangeRef === null || rangeRef === void 0 || (_rangeRef$current2 = rangeRef.current) === null || _rangeRef$current2 === void 0 ? void 0 : _rangeRef$current2.secondTextField()),
      _useState4 = _slicedToArray(_useState3, 2),
      secondInputRef = _useState4[0],
      setSecondInputRef = _useState4[1];
    var _useState5 = useState(false),
      _useState6 = _slicedToArray(_useState5, 2),
      isInnerOpen = _useState6[0],
      setIsInnerOpen = _useState6[1];
    var openedValue = outerOpened !== null && outerOpened !== void 0 ? outerOpened : isInnerOpen;
    var dateFormatDelimiter = getDateFormatDelimiter(format);
    var _useState7 = useState(defaultFirstDate || ''),
      _useState8 = _slicedToArray(_useState7, 2),
      startInnerDate = _useState8[0],
      setStartInnerDate = _useState8[1];
    var startDateValue = (_outerValue$ = outerValue === null || outerValue === void 0 ? void 0 : outerValue[0]) !== null && _outerValue$ !== void 0 ? _outerValue$ : startInnerDate;
    var startInitialValues = getFormattedDates({
      value: startDateValue,
      delimiter: dateFormatDelimiter,
      lang: lang,
      format: format,
      includeEdgeDates: includeEdgeDates,
      min: min,
      max: max
    });
    var _useState9 = useState(defaultSecondDate || ''),
      _useState0 = _slicedToArray(_useState9, 2),
      endInnerDate = _useState0[0],
      setEndInnerDate = _useState0[1];
    var endDateValue = (_outerValue$2 = outerValue === null || outerValue === void 0 ? void 0 : outerValue[1]) !== null && _outerValue$2 !== void 0 ? _outerValue$2 : endInnerDate;
    var endInitialValues = getFormattedDates({
      value: endDateValue,
      delimiter: dateFormatDelimiter,
      lang: lang,
      format: format,
      includeEdgeDates: includeEdgeDates,
      min: min,
      max: max
    });
    var _useState1 = useState({
        calendar: startInitialValues.originalDate,
        input: startInitialValues.formattedDate
      }),
      _useState10 = _slicedToArray(_useState1, 2),
      correctStartDates = _useState10[0],
      setCorrectStartDates = _useState10[1];
    var _useState11 = useState({
        calendar: endInitialValues.originalDate,
        input: endInitialValues.formattedDate
      }),
      _useState12 = _slicedToArray(_useState11, 2),
      correctEndDates = _useState12[0],
      setCorrectEndDates = _useState12[1];
    var calendarFirstValue = startInitialValues.originalDate;
    var inputFirstValue = startInitialValues.formattedDate;
    var calendarSecondValue = endInitialValues.originalDate;
    var inputSecondValue = endInitialValues.formattedDate;
    var fullDateEntered = Boolean(calendarFirstValue && calendarSecondValue);
    var _useState13 = useState(false),
      _useState14 = _slicedToArray(_useState13, 2),
      secondTextFieldClicked = _useState14[0],
      setSecondTextFieldClicked = _useState14[1];
    var isSameMonth = Boolean(fullDateEntered && customDayjs(calendarFirstValue).isSame(calendarSecondValue, 'month'));
    var calendarFocusedDate = calendarFirstValue;
    if (secondTextFieldClicked && calendarSecondValue) {
      var shouldShowPreviousMonth = Boolean(isDoubleCalendar && calendarFirstValue && !isSameMonth);
      calendarFocusedDate = shouldShowPreviousMonth ? new Date(calendarSecondValue.getFullYear(), calendarSecondValue.getMonth() - 1, 1) : calendarSecondValue;
    }
    var handleInputChange = function handleInputChange(value) {
      if (onChange) {
        onChange({
          target: {
            value: value,
            name: name
          }
        });
      }
    };
    var setFirstInputValue = function setFirstInputValue(value) {
      setStartInnerDate(value);
      handleInputChange("".concat(value, " - ").concat(inputSecondValue));
    };
    var setSecondInputValue = function setSecondInputValue(value) {
      setEndInnerDate(value);
      handleInputChange("".concat(inputFirstValue, " - ").concat(value));
    };
    var commonUseDatePickerArgs = {
      format: format,
      lang: lang,
      disabled: disabled,
      readOnly: readOnly,
      maskWithFormat: maskWithFormat,
      name: name,
      type: type,
      min: min,
      max: max,
      includeEdgeDates: includeEdgeDates,
      dateFormatDelimiter: dateFormatDelimiter
    };
    var _useDatePicker = useDatePicker(_objectSpread2(_objectSpread2({
        currentValue: inputFirstValue,
        valueError: firstValueError,
        valueSuccess: firstValueSuccess,
        valueEdited: firstValueEdited
      }, commonUseDatePickerArgs), {}, {
        setCorrectDates: setCorrectStartDates,
        setInnerDate: setFirstInputValue,
        onChangeValue: onChangeFirstValue,
        onCommitDate: onCommitFirstDate
      })),
      handleChangeFirstValue = _useDatePicker.handleChangeValue,
      handleFirstCalendarPick = _useDatePicker.handleCalendarPick,
      handleSearchFirst = _useDatePicker.handleSearch,
      updateExternalFirstDate = _useDatePicker.updateExternalDate,
      getFirstQuarterInfo = _useDatePicker.getQuarterInfo;
    var _useDatePicker2 = useDatePicker(_objectSpread2(_objectSpread2({
        currentValue: inputSecondValue,
        valueError: secondValueError,
        valueSuccess: secondValueSuccess,
        valueEdited: secondValueEdited
      }, commonUseDatePickerArgs), {}, {
        setCorrectDates: setCorrectEndDates,
        setInnerDate: setSecondInputValue,
        onChangeValue: onChangeSecondValue,
        onCommitDate: onCommitSecondDate
      })),
      handleChangeSecondValue = _useDatePicker2.handleChangeValue,
      handleSecondCalendarPick = _useDatePicker2.handleCalendarPick,
      handleSearchSecond = _useDatePicker2.handleSearch,
      updateExternalSecondDate = _useDatePicker2.updateExternalDate,
      getSecondQuarterInfo = _useDatePicker2.getQuarterInfo;
    var handleToggle = function handleToggle(currentOpened, event) {
      var _firstInputRef$curren, _secondInputRef$curre;
      if (disabled || readOnly) {
        return;
      }
      var isCalendarOpen = (firstInputRef !== null && firstInputRef !== void 0 && (_firstInputRef$curren = firstInputRef.current) !== null && _firstInputRef$curren !== void 0 && _firstInputRef$curren.contains((event === null || event === void 0 ? void 0 : event.target) || null) || secondInputRef !== null && secondInputRef !== void 0 && (_secondInputRef$curre = secondInputRef.current) !== null && _secondInputRef$curre !== void 0 && _secondInputRef$curre.contains((event === null || event === void 0 ? void 0 : event.target) || null)) && (event === null || event === void 0 ? void 0 : event.code) !== keys.Escape ? true : currentOpened;
      if (!isCalendarOpen) {
        setSecondTextFieldClicked(false);
      }
      if (onToggle) {
        onToggle(isCalendarOpen, event);
      }
      setIsInnerOpen(isCalendarOpen);
    };
    var handleFocusFirstTextField = function handleFocusFirstTextField(event) {
      onFocusFirstTextfield === null || onFocusFirstTextfield === void 0 || onFocusFirstTextfield(event);
      setSecondTextFieldClicked(false);
    };
    var handleFocusSecondTextField = function handleFocusSecondTextField(event) {
      onFocusSecondTextfield === null || onFocusSecondTextfield === void 0 || onFocusSecondTextfield(event);
      setSecondTextFieldClicked(true);
    };
    var handleBlur = function handleBlur(event, outerHandler) {
      if (!inputFirstValue || !inputSecondValue || preserveInvalidOnBlur) {
        outerHandler === null || outerHandler === void 0 || outerHandler(event);
        return;
      }
      var commonArgs = {
        lang: lang,
        format: format,
        includeEdgeDates: includeEdgeDates,
        min: min,
        max: max
      };
      var _getFormattedDates = getFormattedDates(_objectSpread2({
          value: inputFirstValue,
          delimiter: dateFormatDelimiter
        }, commonArgs)),
        startOriginalDate = _getFormattedDates.originalDate;
      var _getFormattedDates2 = getFormattedDates(_objectSpread2({
          value: inputSecondValue,
          delimiter: dateFormatDelimiter
        }, commonArgs)),
        endOriginalDate = _getFormattedDates2.originalDate;
      if (!calendarFirstValue && correctStartDates.calendar) {
        startOriginalDate = new Date(correctStartDates.calendar);
      }
      if (!calendarSecondValue && correctEndDates.calendar) {
        endOriginalDate = new Date(correctEndDates.calendar);
      }
      var _getSortedValues = getSortedValues([startOriginalDate, endOriginalDate]),
        _getSortedValues2 = _slicedToArray(_getSortedValues, 2),
        startValue = _getSortedValues2[0],
        endValue = _getSortedValues2[1];
      var _getFormattedDates3 = getFormattedDates(_objectSpread2({
          value: startValue,
          delimiter: dateFormatDelimiter
        }, commonArgs)),
        formattedFirstDate = _getFormattedDates3.formattedDate,
        originalFirstDate = _getFormattedDates3.originalDate,
        isoFirstDate = _getFormattedDates3.isoDate;
      var _getFormattedDates4 = getFormattedDates(_objectSpread2({
          value: endValue,
          delimiter: dateFormatDelimiter
        }, commonArgs)),
        formattedSecondDate = _getFormattedDates4.formattedDate,
        originalSecondDate = _getFormattedDates4.originalDate,
        isoSecondDate = _getFormattedDates4.isoDate;
      if (formattedFirstDate !== inputFirstValue) {
        if (onChangeFirstValue) {
          onChangeFirstValue(event, formattedFirstDate, originalFirstDate, isoFirstDate);
        }
        if (onCommitFirstDate) {
          var dateInfo = originalFirstDate ? getFirstQuarterInfo(originalFirstDate) : undefined;
          invokeOnCommitDate({
            callback: onCommitFirstDate,
            value: formattedFirstDate,
            formattedValues: {
              error: false,
              success: true,
              dateInfo: dateInfo,
              originalDate: originalFirstDate,
              isoDate: isoFirstDate
            }
          });
        }
      }
      if (formattedSecondDate !== inputSecondValue) {
        if (onChangeSecondValue) {
          onChangeSecondValue(event, formattedSecondDate, originalSecondDate, isoSecondDate);
        }
        if (onCommitSecondDate) {
          var _dateInfo = originalSecondDate ? getSecondQuarterInfo(originalSecondDate) : undefined;
          invokeOnCommitDate({
            callback: onCommitSecondDate,
            value: formattedSecondDate,
            formattedValues: {
              error: false,
              success: true,
              dateInfo: _dateInfo,
              originalDate: originalSecondDate,
              isoDate: isoSecondDate
            }
          });
        }
      }
      setFirstInputValue(startValue);
      setSecondInputValue(endValue);
      outerHandler === null || outerHandler === void 0 || outerHandler(event);
    };
    var _useKeyNavigation = useKeyNavigation({
        isCalendarOpen: openedValue,
        format: format,
        maskWithFormat: maskWithFormat,
        delimiter: dateFormatDelimiter,
        closeOnEsc: closeOnEsc,
        onToggle: handleToggle
      }),
      onKeyDown = _useKeyNavigation.onKeyDown;
    var handleShortcutDateSelect = function handleShortcutDateSelect(shortcutDate) {
      handleFirstCalendarPick(shortcutDate[0]);
      handleSecondCalendarPick(shortcutDate[1]);
    };
    var handleChangeStartOfRange = function handleChangeStartOfRange(chosenDate, dateInfo) {
      customDayjs.locale(lang);
      if (!calendarFirstValue && secondTextFieldClicked) {
        var _rangeRef$current3;
        handleSecondCalendarPick(chosenDate, dateInfo);
        rangeRef === null || rangeRef === void 0 || (_rangeRef$current3 = rangeRef.current) === null || _rangeRef$current3 === void 0 || (_rangeRef$current3 = _rangeRef$current3.firstTextField()) === null || _rangeRef$current3 === void 0 || (_rangeRef$current3 = _rangeRef$current3.current) === null || _rangeRef$current3 === void 0 || _rangeRef$current3.focus();
        return;
      }
      var prevValue = secondTextFieldClicked ? calendarFirstValue : calendarSecondValue;
      var _getSortedValues3 = getSortedValues([prevValue, chosenDate]),
        _getSortedValues4 = _slicedToArray(_getSortedValues3, 2),
        first = _getSortedValues4[0],
        second = _getSortedValues4[1];
      var firstFormatted = first ? customDayjs(first).format(format) : '';
      var secondFormatted = second ? customDayjs(second).format(format) : '';
      if (firstFormatted !== inputFirstValue) {
        handleFirstCalendarPick(first, dateInfo);
      }
      if (secondFormatted !== inputSecondValue) {
        handleSecondCalendarPick(second, dateInfo);
      }
      if (!firstValueError && !secondValueError && closeAfterDateSelect) {
        handleToggle(false);
      }
    };
    var handleChangeCalendarValue = function handleChangeCalendarValue(_ref2, dateInfo) {
      var _ref3 = _slicedToArray(_ref2, 2),
        firstDate = _ref3[0],
        secondDate = _ref3[1];
      /**
       * NOTE: проверяем совпадает ли новая дата с предыдущей
       * Если нет, то вызываем handle{First,Second}CalendarPick
       */
      customDayjs.locale(lang);
      var firstFormatted = firstDate ? customDayjs(firstDate).format(format) : '';
      var secondFormatted = secondDate ? customDayjs(secondDate).format(format) : '';
      if (firstFormatted !== inputFirstValue) {
        handleFirstCalendarPick(firstDate, dateInfo);
      }
      if (secondFormatted !== inputSecondValue) {
        handleSecondCalendarPick(secondDate, dateInfo);
      }
      if (firstDate && secondDate && !firstValueError && !secondValueError && closeAfterDateSelect) {
        handleToggle(false);
      }
    };
    var handleSearchFirstValue = function handleSearchFirstValue(_, date) {
      handleSearchFirst(String(date));
      if (!calendarSecondValue || secondValueError) {
        var _rangeRef$current4;
        rangeRef === null || rangeRef === void 0 || (_rangeRef$current4 = rangeRef.current) === null || _rangeRef$current4 === void 0 || (_rangeRef$current4 = _rangeRef$current4.secondTextField()) === null || _rangeRef$current4 === void 0 || (_rangeRef$current4 = _rangeRef$current4.current) === null || _rangeRef$current4 === void 0 || _rangeRef$current4.focus();
      }
    };
    var handleSearchSecondValue = function handleSearchSecondValue(_, date) {
      handleSearchSecond(String(date));
      if (!calendarFirstValue || firstValueError) {
        var _rangeRef$current5;
        rangeRef === null || rangeRef === void 0 || (_rangeRef$current5 = rangeRef.current) === null || _rangeRef$current5 === void 0 || (_rangeRef$current5 = _rangeRef$current5.firstTextField()) === null || _rangeRef$current5 === void 0 || (_rangeRef$current5 = _rangeRef$current5.current) === null || _rangeRef$current5 === void 0 || _rangeRef$current5.focus();
      }
    };
    var handleCalendarSingleValueChange = function handleCalendarSingleValueChange(chosenDate, dateInfo) {
      if (secondTextFieldClicked) {
        var _rangeRef$current6;
        handleSecondCalendarPick(chosenDate, dateInfo);
        rangeRef === null || rangeRef === void 0 || (_rangeRef$current6 = rangeRef.current) === null || _rangeRef$current6 === void 0 || (_rangeRef$current6 = _rangeRef$current6.firstTextField()) === null || _rangeRef$current6 === void 0 || (_rangeRef$current6 = _rangeRef$current6.current) === null || _rangeRef$current6 === void 0 || _rangeRef$current6.focus();
      } else {
        var _rangeRef$current7;
        handleFirstCalendarPick(chosenDate, dateInfo);
        rangeRef === null || rangeRef === void 0 || (_rangeRef$current7 = rangeRef.current) === null || _rangeRef$current7 === void 0 || (_rangeRef$current7 = _rangeRef$current7.secondTextField()) === null || _rangeRef$current7 === void 0 || (_rangeRef$current7 = _rangeRef$current7.current) === null || _rangeRef$current7 === void 0 || _rangeRef$current7.focus();
      }
    };
    var handleBlurFirstTextfield = function handleBlurFirstTextfield(event) {
      return handleBlur(event, onBlurFirstTextfield);
    };
    var handleBlurSecondTextfield = function handleBlurSecondTextfield(event) {
      return handleBlur(event, onBlurSecondTextfield);
    };
    var RangeComponent = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(StyledRange, {
      size: size,
      ref: rangeRef,
      autoComplete: autoComplete,
      dividerIcon: dividerIcon,
      dividerVariant: dividerVariant,
      label: label,
      leftHelper: leftHelper,
      required: required,
      requiredIndicatorPlacement: requiredPlacement,
      hasRequiredIndicator: hasRequiredIndicator,
      disabled: disabled,
      readOnly: !disabled && readOnly,
      firstPlaceholder: firstPlaceholder,
      secondPlaceholder: secondPlaceholder,
      contentLeft: contentLeft,
      contentRight: contentRight,
      firstTextfieldTextBefore: firstTextfieldTextBefore,
      secondTextfieldTextBefore: secondTextfieldTextBefore,
      firstTextfieldTextAfter: firstTextfieldTextAfter,
      secondTextfieldTextAfter: secondTextfieldTextAfter,
      firstTextfieldContentLeft: firstTextfieldContentLeft,
      firstTextfieldContentRight: firstTextfieldContentRight,
      secondTextfieldContentLeft: secondTextfieldContentLeft,
      secondTextfieldContentRight: secondTextfieldContentRight,
      firstValue: inputFirstValue,
      secondValue: inputSecondValue,
      firstValueError: firstValueError,
      secondValueError: secondValueError,
      firstValueSuccess: firstValueSuccess,
      secondValueSuccess: secondValueSuccess,
      firstValueEdited: firstValueEdited,
      secondValueEdited: secondValueEdited,
      onChangeFirstValue: handleChangeFirstValue,
      onChangeSecondValue: handleChangeSecondValue,
      name: name,
      onSearchFirstValue: handleSearchFirstValue,
      onSearchSecondValue: handleSearchSecondValue,
      onFocusFirstTextfield: handleFocusFirstTextField,
      onFocusSecondTextfield: handleFocusSecondTextField,
      onBlurFirstTextfield: handleBlurFirstTextfield,
      onBlurSecondTextfield: handleBlurSecondTextfield,
      onKeyDown: onKeyDown,
      appearance: appearance,
      hasClearDivider: hasClearDivider,
      hintText: hintText,
      hintView: hintView,
      hintSize: hintSize,
      hintTrigger: hintTrigger,
      hintTargetIcon: hintTargetIcon,
      hintPlacement: hintPlacement,
      hintTargetPlacement: hintTargetPlacement,
      hintHasArrow: hintHasArrow,
      hintOffset: hintOffset,
      hintWidth: hintWidth,
      hintContentLeft: hintContentLeft
    }));
    useEffect(function () {
      var _rangeRef$current8, _rangeRef$current9;
      setFirstInputRef((_rangeRef$current8 = rangeRef.current) === null || _rangeRef$current8 === void 0 ? void 0 : _rangeRef$current8.firstTextField());
      setSecondInputRef((_rangeRef$current9 = rangeRef.current) === null || _rangeRef$current9 === void 0 ? void 0 : _rangeRef$current9.secondTextField());
    }, [rangeRef.current]);
    useLayoutEffect(function () {
      if (!startDateValue) {
        updateExternalFirstDate(defaultFirstDate);
      }
    }, [defaultFirstDate, format, lang]);
    useLayoutEffect(function () {
      if (!endDateValue) {
        updateExternalSecondDate(defaultSecondDate);
      }
    }, [defaultSecondDate, format, lang]);
    useLayoutEffect(function () {
      if (outerValue !== undefined && !(outerValue !== null && outerValue !== void 0 && outerValue[0])) {
        setStartInnerDate('');
        setCorrectStartDates({
          calendar: undefined,
          input: ''
        });
      }
    }, [outerValue === null || outerValue === void 0 ? void 0 : outerValue[0]]);
    useLayoutEffect(function () {
      if (outerValue !== undefined && !(outerValue !== null && outerValue !== void 0 && outerValue[1])) {
        setEndInnerDate('');
        setCorrectEndDates({
          calendar: undefined,
          input: ''
        });
      }
    }, [outerValue === null || outerValue === void 0 ? void 0 : outerValue[1]]);
    var RootWrapper = useCallback(/*#__PURE__*/forwardRef(function (_ref4, rootWrapperRef) {
      var children = _ref4.children,
        rootWrapperClassName = _ref4.className,
        onClick = _ref4.onClick;
      return /*#__PURE__*/React__default.createElement(Root, {
        ref: rootWrapperRef,
        view: view,
        size: size,
        eventTooltipSize: eventTooltipOptions === null || eventTooltipOptions === void 0 ? void 0 : eventTooltipOptions.size,
        className: rootWrapperClassName,
        disabled: disabled,
        readOnly: !disabled && readOnly,
        onClick: onClick
      }, children);
    }), [view, size, disabled, readOnly]);
    return /*#__PURE__*/React__default.createElement(Root, _extends({
      ref: rootRef,
      view: view,
      size: size,
      eventTooltipSize: eventTooltipOptions === null || eventTooltipOptions === void 0 ? void 0 : eventTooltipOptions.size,
      className: cls(classes.datePickerRoot, className, _defineProperty({}, classes.datePickerstretched, stretched)),
      disabled: disabled,
      readOnly: !disabled && readOnly
    }, hintText && {
      hintView: hintView,
      hintSize: hintSize
    }, rest), /*#__PURE__*/React__default.createElement(RangeDatePopover, {
      calendarValue: [calendarFirstValue, calendarSecondValue],
      calendarFocusedDate: calendarFocusedDate,
      target: RangeComponent,
      opened: openedValue,
      includeEdgeDates: includeEdgeDates,
      eventTooltipOptions: eventTooltipOptions,
      eventList: eventList,
      disabledList: disabledList,
      eventMonthList: eventMonthList,
      disabledMonthList: disabledMonthList,
      eventQuarterList: eventQuarterList,
      disabledQuarterList: disabledQuarterList,
      eventYearList: eventYearList,
      disabledYearList: disabledYearList,
      min: min,
      max: max,
      renderFromDate: renderFromDate,
      frame: frame,
      usePortal: usePortal,
      zIndex: zIndex,
      placement: placement,
      closeOnOverlayClick: closeOnOverlayClick,
      closeOnEsc: closeOnEsc,
      offset: offset,
      stretched: stretched,
      calendarContainerWidth: calendarContainerWidth,
      calendarContainerHeight: calendarContainerHeight,
      type: type,
      onToggle: handleToggle,
      lang: lang,
      isDoubleCalendar: isDoubleCalendar,
      rootWrapper: RootWrapper,
      onChangeStartOfRange: handleChangeStartOfRange,
      onChangeValue: handleChangeCalendarValue,
      onChangeSingleValue: handleCalendarSingleValueChange,
      setIsInnerOpen: setIsInnerOpen,
      dateShortcuts: dateShortcuts,
      dateShortcutsPlacement: dateShortcutsPlacement,
      dateShortcutsWidth: dateShortcutsWidth,
      disableFlip: disableFlip,
      onShortcutDateSelect: handleShortcutDateSelect
    }), /*#__PURE__*/React__default.createElement(InputHidden, _extends({
      name: name,
      type: "hidden",
      datatype: "datepicker-double",
      "data-datepicker": "from",
      value: inputFirstValue,
      ref: innerRefFirst
    }, noop)), /*#__PURE__*/React__default.createElement(InputHidden, _extends({
      name: name,
      type: "hidden",
      datatype: "datepicker-double",
      "data-datepicker": "to",
      value: inputSecondValue,
      ref: innerRefSecond
    }, noop)));
  });
};
var datePickerRangeConfig = {
  name: 'DatePickerRange',
  tag: 'div',
  layout: datePickerRangeRoot,
  base: base,
  variations: {
    view: {
      css: base$1
    },
    size: {
      css: base$2
    },
    eventTooltipSize: {
      css: base$3
    },
    hintView: {
      css: base$4
    },
    hintSize: {
      css: base$5
    },
    disabled: {
      css: base$6,
      attrs: true
    },
    readOnly: {
      css: base$7,
      attrs: true
    }
  },
  defaults: {
    size: 'm',
    view: 'default',
    eventTooltipSizeCSS: 'm'
  }
};

export { datePickerRangeConfig, datePickerRangeRoot };
