@salutejs/plasma-new-hope 0.109.0-canary.1310.10007111729.0 → 0.109.0-dev.0

package/emotion/es/components/Calendar/CalendarDouble/CalendarDouble.js

@@ -1,5 +1,5 @@
-var _StyledSeparator;
-var _excluded = ["value", "min", "max", "includeEdgeDates", "eventList", "disabledList", "onChangeValue"];
+var _StyledSeparator, _StyledSeparator2, _StyledSeparator3, _StyledSeparator4;
+var _excluded = ["value", "min", "max", "includeEdgeDates", "type", "eventList", "disabledList", "eventMonthList", "disabledMonthList", "eventQuarterList", "disabledQuarterList", "eventYearList", "disabledYearList", "onChangeValue"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -9,10 +9,13 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import React, { useState, useCallback, useMemo, forwardRef, useEffect } from 'react';
-import { getDateFromValue, getNextDate, getPrevDate, isValueUpdate } from '../utils';
-import { useKeyNavigation } from '../hooks';
-import { CalendarDays, CalendarHeader } from '../ui';
+import React, { useState, useCallback, useMemo, forwardRef, useEffect, useReducer } from 'react';
+import { YEAR_RENDER_COUNT, getNextDate, isValueUpdate } from '../utils';
+import { useKeyNavigation, useCalendarNavigation, useCalendarDateChange } from '../hooks';
+import { CalendarDays, CalendarHeader, CalendarMonths, CalendarQuarters, CalendarYears } from '../ui';
+import { getInitialState, reducer, sizeMap } from '../store/reducer';
+import { ActionType, CalendarState } from '../store/types';
+import { IsOutOfRange } from '../CalendarBase/CalendarBase.styles';
 import { base as viewCSS } from './variations/_view/base';
 import { StyledCalendar, StyledSeparator, StyledWrapper } from './CalendarDouble.styles';
 /**
@@ -24,8 +27,16 @@ export var calendarDoubleRoot = function calendarDoubleRoot(Root) {
       min = _ref.min,
       max = _ref.max,
       includeEdgeDates = _ref.includeEdgeDates,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'Days' : _ref$type,
       eventList = _ref.eventList,
       disabledList = _ref.disabledList,
+      eventMonthList = _ref.eventMonthList,
+      disabledMonthList = _ref.disabledMonthList,
+      eventQuarterList = _ref.eventQuarterList,
+      disabledQuarterList = _ref.disabledQuarterList,
+      eventYearList = _ref.eventYearList,
+      disabledYearList = _ref.disabledYearList,
       onChangeValue = _ref.onChangeValue,
       rest = _objectWithoutProperties(_ref, _excluded);
     var _useMemo = useMemo(function () {
@@ -37,150 +48,299 @@ export var calendarDoubleRoot = function calendarDoubleRoot(Root) {
     var value = secondValue || firstValue;
     var _useState = useState(),
       _useState2 = _slicedToArray(_useState, 2),
-      hoveredDay = _useState2[0],
-      setHoveredDay = _useState2[1];
-    var _useState3 = useState(getDateFromValue(value)),
+      hoveredItem = _useState2[0],
+      setHoveredItem = _useState2[1];
+    var _useState3 = useState(type),
       _useState4 = _slicedToArray(_useState3, 2),
-      date = _useState4[0],
-      setDate = _useState4[1];
+      prevType = _useState4[0],
+      setPrevType = _useState4[1];
     var _useState5 = useState(value),
       _useState6 = _slicedToArray(_useState5, 2),
       prevValue = _useState6[0],
       setPrevValue = _useState6[1];
-    var _useState7 = useState(function () {
-        var nextDate = getDateFromValue(firstValue);
-        var _getNextDate = getNextDate(nextDate.year, nextDate.monthIndex),
-          _getNextDate2 = _slicedToArray(_getNextDate, 2),
-          initialYear = _getNextDate2[0],
-          initialMonth = _getNextDate2[1];
-        return {
-          monthIndex: [nextDate.monthIndex, initialMonth],
-          year: [nextDate.year, initialYear]
-        };
-      }),
+    var _useState7 = useState(0),
       _useState8 = _slicedToArray(_useState7, 2),
-      doubleDate = _useState8[0],
-      setMonths = _useState8[1];
-    var handleMonth = useCallback(function (getDate) {
-      var _getDate = getDate(doubleDate.year[0], doubleDate.monthIndex[0]),
-        _getDate2 = _slicedToArray(_getDate, 2),
-        newCurrentYear = _getDate2[0],
-        newCurrentMonth = _getDate2[1];
-      var _getDate3 = getDate(doubleDate.year[1], doubleDate.monthIndex[1]),
-        _getDate4 = _slicedToArray(_getDate3, 2),
-        newNextYear = _getDate4[0],
-        newNextMonth = _getDate4[1];
-      setMonths({
-        monthIndex: [newCurrentMonth, newNextMonth],
-        year: [newCurrentYear, newNextYear]
-      });
-    }, [doubleDate]);
-    var handlePrev = useCallback(function () {
-      handleMonth(getPrevDate);
-    }, [handleMonth]);
-    var handleNext = useCallback(function () {
-      handleMonth(getNextDate);
-    }, [handleMonth]);
+      outOfRangeKey = _useState8[0],
+      setOutOfRangeKey = _useState8[1];
+    var _useReducer = useReducer(reducer, getInitialState(value, type, true)),
+      _useReducer2 = _slicedToArray(_useReducer, 2),
+      state = _useReducer2[0],
+      dispatch = _useReducer2[1];
+    var date = state.date,
+      calendarState = state.calendarState,
+      startYear = state.startYear,
+      size = state.size;
+    var _useState9 = useState(date),
+      _useState10 = _slicedToArray(_useState9, 2),
+      firstDate = _useState10[0],
+      setFirstDate = _useState10[1];
+    var _useState11 = useState(date),
+      _useState12 = _slicedToArray(_useState11, 2),
+      secondDate = _useState12[0],
+      setSecondDate = _useState12[1];
+    var _useCalendarNavigatio = useCalendarNavigation({
+        calendarState: calendarState,
+        date: date,
+        dispatch: dispatch
+      }),
+      handleNext = _useCalendarNavigatio.handleNext,
+      handlePrev = _useCalendarNavigatio.handlePrev;
     var _useKeyNavigation = useKeyNavigation({
         isDouble: true,
-        size: [11, 6],
+        size: size,
+        calendarState: calendarState,
         onNext: handleNext,
         onPrev: handlePrev
       }),
-      _useKeyNavigation2 = _slicedToArray(_useKeyNavigation, 4),
+      _useKeyNavigation2 = _slicedToArray(_useKeyNavigation, 5),
       selectIndexes = _useKeyNavigation2[0],
       onKeyDown = _useKeyNavigation2[1],
       onSelectIndexes = _useKeyNavigation2[2],
-      outerRefs = _useKeyNavigation2[3];
-    var handleOnChangeDay = useCallback(function (newDate, coord) {
-      var newDay = new Date(newDate.year, newDate.monthIndex, newDate.day);
-      onChangeValue === null || onChangeValue === void 0 || onChangeValue(newDay);
-      onSelectIndexes(coord);
-    }, [onChangeValue, onSelectIndexes]);
-    var firstDate = useMemo(function () {
-      return {
-        day: date.day,
-        year: doubleDate.year[0],
-        monthIndex: doubleDate.monthIndex[0]
-      };
-    }, [date, doubleDate]);
-    var secondDate = useMemo(function () {
-      return {
-        day: date.day,
-        year: doubleDate.year[1],
-        monthIndex: doubleDate.monthIndex[1]
-      };
-    }, [date, doubleDate]);
-    if (value && prevValue && isValueUpdate(value, prevValue)) {
-      var newDate = getDateFromValue(value);
-      var year = newDate.year,
-        monthIndex = newDate.monthIndex;
-      var _doubleDate$monthInde = _slicedToArray(doubleDate.monthIndex, 2),
-        prevMonthIndex = _doubleDate$monthInde[1],
-        _doubleDate$year = _slicedToArray(doubleDate.year, 2),
-        prevYear = _doubleDate$year[1];
-      if (prevMonthIndex !== monthIndex || prevYear !== year) {
-        var _getNextDate3 = getNextDate(year, monthIndex),
-          _getNextDate4 = _slicedToArray(_getNextDate3, 2),
-          nextYear = _getNextDate4[0],
-          nextMonthIndex = _getNextDate4[1];
-        setDate(newDate);
-        setMonths({
-          monthIndex: [monthIndex, nextMonthIndex],
-          year: [year, nextYear]
+      outerRefs = _useKeyNavigation2[3],
+      isOutOfRange = _useKeyNavigation2[4];
+    var _useCalendarDateChang = useCalendarDateChange({
+        type: type,
+        onChangeValue: onChangeValue,
+        onSelectIndexes: onSelectIndexes,
+        dispatch: dispatch
+      }),
+      handleOnChangeDay = _useCalendarDateChang.handleOnChangeDay,
+      handleOnChangeMonth = _useCalendarDateChang.handleOnChangeMonth,
+      handleOnChangeQuarter = _useCalendarDateChang.handleOnChangeQuarter,
+      handleOnChangeYear = _useCalendarDateChang.handleOnChangeYear,
+      handleUpdateCalendarState = _useCalendarDateChang.handleUpdateCalendarState;
+    var updateSecondDate = function updateSecondDate() {
+      if (calendarState === CalendarState.Days) {
+        var _getNextDate = getNextDate(date.year, date.monthIndex),
+          _getNextDate2 = _slicedToArray(_getNextDate, 2),
+          nextYear = _getNextDate2[0],
+          nextMonthIndex = _getNextDate2[1];
+        setSecondDate({
+          year: nextYear,
+          monthIndex: nextMonthIndex,
+          day: date.day
         });
       }
-      setPrevValue(value);
-    }
+      if (calendarState === CalendarState.Months || calendarState === CalendarState.Quarters) {
+        setSecondDate({
+          year: date.year + 1,
+          monthIndex: date.monthIndex,
+          day: date.day
+        });
+      }
+      if (calendarState === CalendarState.Years) {
+        setSecondDate({
+          year: startYear + YEAR_RENDER_COUNT,
+          monthIndex: date.monthIndex,
+          day: date.day
+        });
+      }
+    };
+    var getBoundaryDates = function getBoundaryDates() {
+      // NOTE: Если установить индекс дня равным "0", то берется последнее число предыдущего месяца
+      if (calendarState === CalendarState.Days) {
+        return [new Date(firstDate.year, firstDate.monthIndex, 1), new Date(secondDate.year, secondDate.monthIndex + 1, 0)];
+      }
+      if (calendarState === CalendarState.Months || calendarState === CalendarState.Quarters) {
+        return [new Date(firstDate.year, 0), new Date(secondDate.year, 12, 0)];
+      }
+      var endVisibleYear = startYear + YEAR_RENDER_COUNT * 2 - 1;
+      return [new Date(startYear, 0), new Date(endVisibleYear, 11)];
+    };
+
+    // Изменяем ключ каждый раз как пытаемся перейти на даты которые находятся за пределами min/max ограничений.
+    // Это необходимо для того чтобы screen-reader корректно озвучивал уведомление aria-live="assertive"
+    // о том что нет доступных дат
+    var handleKeyDown = useCallback(function (event) {
+      setOutOfRangeKey(function (previousState) {
+        return Number(!previousState);
+      });
+      onKeyDown(event);
+    }, [onKeyDown]);
+    useEffect(function () {
+      if (prevType !== calendarState) {
+        dispatch({
+          type: ActionType.UPDATE_CALENDAR_STATE,
+          payload: {
+            calendarState: calendarState,
+            size: sizeMap[calendarState]["double"]
+          }
+        });
+        setPrevType(calendarState);
+      }
+    }, [calendarState]);
     useEffect(function () {
       if (!prevValue) {
         setPrevValue(value);
       }
+      if (value && prevValue && isValueUpdate(value, prevValue) || value && !prevValue) {
+        var _getBoundaryDates = getBoundaryDates(),
+          _getBoundaryDates2 = _slicedToArray(_getBoundaryDates, 2),
+          minVisibleDate = _getBoundaryDates2[0],
+          maxVisibleDate = _getBoundaryDates2[1];
+        if (value > maxVisibleDate || value < minVisibleDate) {
+          dispatch({
+            type: ActionType.UPDATE_DATE,
+            payload: {
+              value: value
+            }
+          });
+        }
+        setPrevValue(value);
+      }
     }, [value, prevValue]);
+    useEffect(function () {
+      setFirstDate(date);
+      updateSecondDate();
+    }, [date, calendarState]);
     return /*#__PURE__*/React.createElement(Root, _extends({
       ref: outerRootRef,
       "aria-label": "\u0412\u044B\u0431\u043E\u0440 \u0434\u0430\u0442\u044B"
-    }, rest), /*#__PURE__*/React.createElement(CalendarHeader, {
+    }, rest), isOutOfRange && /*#__PURE__*/React.createElement(IsOutOfRange, {
+      key: outOfRangeKey,
+      "aria-atomic": "true",
+      role: "alert",
+      "aria-live": "assertive",
+      "aria-relevant": "additions"
+    }, "\u0414\u0430\u043B\u0435\u0435 \u043D\u0435\u0442 \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u0445 \u0434\u0430\u0442."), /*#__PURE__*/React.createElement(CalendarHeader, {
       isDouble: true,
       size: rest.size,
       firstDate: firstDate,
       secondDate: secondDate,
+      startYear: startYear,
+      type: calendarState,
       onPrev: handlePrev,
-      onNext: handleNext
-    }), /*#__PURE__*/React.createElement(StyledWrapper, null, /*#__PURE__*/React.createElement(CalendarDays, {
-      isDouble: true,
+      onNext: handleNext,
+      onUpdateCalendarState: handleUpdateCalendarState
+    }), /*#__PURE__*/React.createElement(StyledWrapper, null, calendarState === CalendarState.Days && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CalendarDays, {
+      value: externalValue,
+      date: firstDate,
+      min: min,
+      max: max,
       eventList: eventList,
       disabledList: disabledList,
+      includeEdgeDates: includeEdgeDates,
+      hoveredDay: hoveredItem,
+      selectIndexes: selectIndexes,
+      onChangeDay: handleOnChangeDay,
+      onHoverDay: setHoveredItem,
+      onSetSelected: onSelectIndexes,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true
+    }), _StyledSeparator || (_StyledSeparator = /*#__PURE__*/React.createElement(StyledSeparator, null)), /*#__PURE__*/React.createElement(CalendarDays, {
+      value: externalValue,
+      date: secondDate,
       min: min,
       max: max,
+      eventList: eventList,
+      disabledList: disabledList,
       includeEdgeDates: includeEdgeDates,
+      hoveredDay: hoveredItem,
+      selectIndexes: selectIndexes,
+      onChangeDay: handleOnChangeDay,
+      onHoverDay: setHoveredItem,
+      onSetSelected: onSelectIndexes,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true,
+      isSecond: true
+    })), calendarState === CalendarState.Months && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CalendarMonths, {
       value: externalValue,
       date: firstDate,
-      hoveredDay: hoveredDay,
+      min: min,
+      max: max,
+      eventList: eventMonthList,
+      disabledList: disabledMonthList,
+      hoveredMonth: hoveredItem,
       selectIndexes: selectIndexes,
-      onChangeDay: handleOnChangeDay,
-      onHoverDay: setHoveredDay,
+      onChangeMonth: handleOnChangeMonth,
       onSetSelected: onSelectIndexes,
-      onKeyDown: onKeyDown,
-      outerRefs: outerRefs
-    }), _StyledSeparator || (_StyledSeparator = /*#__PURE__*/React.createElement(StyledSeparator, null)), /*#__PURE__*/React.createElement(CalendarDays, {
+      onHoverMonth: setHoveredItem,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true
+    }), _StyledSeparator2 || (_StyledSeparator2 = /*#__PURE__*/React.createElement(StyledSeparator, null)), /*#__PURE__*/React.createElement(CalendarMonths, {
+      value: externalValue,
+      date: secondDate,
+      min: min,
+      max: max,
+      eventList: eventMonthList,
+      disabledList: disabledMonthList,
+      hoveredMonth: hoveredItem,
+      selectIndexes: selectIndexes,
+      onChangeMonth: handleOnChangeMonth,
+      onSetSelected: onSelectIndexes,
+      onHoverMonth: setHoveredItem,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
       isDouble: true,
-      isSecond: true,
-      eventList: eventList,
-      disabledList: disabledList,
+      isSecond: true
+    })), calendarState === CalendarState.Quarters && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CalendarQuarters, {
+      value: externalValue,
+      date: firstDate,
       min: min,
       max: max,
-      includeEdgeDates: includeEdgeDates,
+      eventList: eventQuarterList,
+      disabledList: disabledQuarterList,
+      hoveredQuarter: hoveredItem,
+      selectIndexes: selectIndexes,
+      onChangeQuarter: handleOnChangeQuarter,
+      onSetSelected: onSelectIndexes,
+      onHoverQuarter: setHoveredItem,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true
+    }), _StyledSeparator3 || (_StyledSeparator3 = /*#__PURE__*/React.createElement(StyledSeparator, null)), /*#__PURE__*/React.createElement(CalendarQuarters, {
       value: externalValue,
       date: secondDate,
-      hoveredDay: hoveredDay,
+      min: min,
+      max: max,
+      eventList: eventQuarterList,
+      disabledList: disabledQuarterList,
+      hoveredQuarter: hoveredItem,
       selectIndexes: selectIndexes,
-      onChangeDay: handleOnChangeDay,
-      onHoverDay: setHoveredDay,
+      onChangeQuarter: handleOnChangeQuarter,
+      onSetSelected: onSelectIndexes,
+      onHoverQuarter: setHoveredItem,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true,
+      isSecond: true
+    })), calendarState === CalendarState.Years && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CalendarYears, {
+      value: externalValue,
+      date: firstDate,
+      startYear: startYear,
+      selectIndexes: selectIndexes,
+      min: min,
+      max: max,
+      eventList: eventYearList,
+      disabledList: disabledYearList,
+      hoveredYear: hoveredItem,
+      onChangeYear: handleOnChangeYear,
       onSetSelected: onSelectIndexes,
-      onKeyDown: onKeyDown,
-      outerRefs: outerRefs
-    })));
+      onHoverYear: setHoveredItem,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true
+    }), _StyledSeparator4 || (_StyledSeparator4 = /*#__PURE__*/React.createElement(StyledSeparator, null)), /*#__PURE__*/React.createElement(CalendarYears, {
+      value: externalValue,
+      date: secondDate,
+      startYear: startYear + YEAR_RENDER_COUNT,
+      selectIndexes: selectIndexes,
+      min: min,
+      max: max,
+      eventList: eventYearList,
+      disabledList: disabledYearList,
+      hoveredYear: hoveredItem,
+      onChangeYear: handleOnChangeYear,
+      onSetSelected: onSelectIndexes,
+      onHoverYear: setHoveredItem,
+      onKeyDown: handleKeyDown,
+      outerRefs: outerRefs,
+      isDouble: true,
+      isSecond: true
+    }))));
   });
 };
 export var calendarDoubleConfig = {

package/emotion/es/components/Calendar/hoc/withRange.js

@@ -1,4 +1,4 @@
-var _excluded = ["value", "disabledList", "eventList", "min", "max", "onChangeValue", "onChangeStartOfRange"];
+var _excluded = ["value", "min", "max", "disabledList", "eventList", "eventMonthList", "disabledMonthList", "eventYearList", "disabledYearList", "onChangeValue", "onChangeStartOfRange"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -17,10 +17,14 @@ import { getSortedValues, isValueUpdate } from '../utils';
 export var withRange = function withRange(Component) {
   return function (_ref) {
     var value = _ref.value,
-      disabledList = _ref.disabledList,
-      eventList = _ref.eventList,
       min = _ref.min,
       max = _ref.max,
+      disabledList = _ref.disabledList,
+      eventList = _ref.eventList,
+      eventMonthList = _ref.eventMonthList,
+      disabledMonthList = _ref.disabledMonthList,
+      eventYearList = _ref.eventYearList,
+      disabledYearList = _ref.disabledYearList,
       onChangeValue = _ref.onChangeValue,
       onChangeStartOfRange = _ref.onChangeStartOfRange,
       rest = _objectWithoutProperties(_ref, _excluded);
@@ -44,10 +48,10 @@ export var withRange = function withRange(Component) {
       setValues([startExternalValue, endExternalValue]);
       setPrevValue(value);
     }
-    var handleOnChangeDay = useCallback(function (newDay) {
+    var handleOnChangeDay = useCallback(function (newDay, dateInfo) {
       if (endValue) {
         setValues([newDay, undefined]);
-        onChangeStartOfRange === null || onChangeStartOfRange === void 0 || onChangeStartOfRange(newDay);
+        onChangeStartOfRange === null || onChangeStartOfRange === void 0 || onChangeStartOfRange(newDay, dateInfo);
         return;
       }
       setValues([startValue, newDay]);
@@ -56,7 +60,7 @@ export var withRange = function withRange(Component) {
         first = _getSortedValues2[0],
         second = _getSortedValues2[1];
       if (first) {
-        onChangeValue([first, second]);
+        onChangeValue([first, second], dateInfo);
       }
     }, [onChangeValue, onChangeStartOfRange, startValue, endValue]);
     return /*#__PURE__*/React.createElement(Component, _extends({
@@ -64,6 +68,10 @@ export var withRange = function withRange(Component) {
       onChangeValue: handleOnChangeDay,
       disabledList: disabledList,
       eventList: eventList,
+      eventMonthList: eventMonthList,
+      disabledMonthList: disabledMonthList,
+      eventYearList: eventYearList,
+      disabledYearList: disabledYearList,
       min: min,
       max: max
     }, rest));

package/emotion/es/components/Calendar/hooks/index.js

@@ -1,4 +1,7 @@
 export { useDays } from './useDays';
 export { useMonths } from './useMonths';
 export { useYears } from './useYears';
-export { useKeyNavigation } from './useKeyNavigation';
+export { useQuarters } from './useQuarters';
+export { useKeyNavigation } from './useKeyNavigation';
+export { useCalendarNavigation } from './useCalendarNavigation';
+export { useCalendarDateChange } from './useCalendarDateChange';

package/emotion/es/components/Calendar/hooks/useCalendarDateChange.js

@@ -0,0 +1,84 @@
+import { useCallback } from 'react';
+import { ActionType, CalendarState } from '../store/types';
+import { sizeMap } from '../store/reducer';
+export var useCalendarDateChange = function useCalendarDateChange(_ref) {
+  var type = _ref.type,
+    onChangeValue = _ref.onChangeValue,
+    onSelectIndexes = _ref.onSelectIndexes,
+    dispatch = _ref.dispatch;
+  var handleOnChangeDay = useCallback(function (newDate, coord) {
+    var newDay = new Date(newDate.year, newDate.monthIndex, newDate.day);
+    onChangeValue === null || onChangeValue === void 0 || onChangeValue(newDay);
+    onSelectIndexes(coord);
+  }, [onChangeValue, onSelectIndexes]);
+  var handleOnChangeQuarter = useCallback(function (newDate, coord, quarterName) {
+    var newQuarterDate = new Date(newDate.year, newDate.monthIndex, newDate.day);
+    var endQuarter = new Date(newQuarterDate);
+    endQuarter.setMonth(newQuarterDate.getMonth() + 3);
+    endQuarter.setDate(0);
+    onChangeValue === null || onChangeValue === void 0 || onChangeValue(newQuarterDate, {
+      name: quarterName,
+      fullValue: [newQuarterDate, endQuarter]
+    });
+    onSelectIndexes(coord);
+  }, [onChangeValue, onSelectIndexes, type]);
+  var handleOnChangeMonth = useCallback(function (newDate, coord) {
+    if (type === CalendarState.Months) {
+      var newMonthDate = new Date(newDate.year, newDate.monthIndex, newDate.day);
+      onChangeValue === null || onChangeValue === void 0 || onChangeValue(newMonthDate);
+      onSelectIndexes(coord);
+      return;
+    }
+    dispatch({
+      type: ActionType.UPDATE_MONTH,
+      payload: {
+        calendarState: CalendarState.Days,
+        monthIndex: newDate.monthIndex,
+        size: sizeMap.Days["double"]
+      }
+    });
+  }, [onChangeValue, onSelectIndexes, type]);
+  var handleOnChangeYear = useCallback(function (newDate, coord) {
+    if (type === CalendarState.Years) {
+      var newYearDate = new Date(newDate.year, newDate.monthIndex, newDate.day);
+      onChangeValue === null || onChangeValue === void 0 || onChangeValue(newYearDate);
+      onSelectIndexes(coord);
+      return;
+    }
+    if (type === CalendarState.Quarters) {
+      dispatch({
+        type: ActionType.UPDATE_YEAR,
+        payload: {
+          calendarState: CalendarState.Quarters,
+          year: newDate.year,
+          size: sizeMap.Quarters["double"]
+        }
+      });
+      return;
+    }
+    dispatch({
+      type: ActionType.UPDATE_YEAR,
+      payload: {
+        calendarState: CalendarState.Months,
+        year: newDate.year,
+        size: sizeMap.Months["double"]
+      }
+    });
+  }, [onChangeValue, onSelectIndexes, type]);
+  var handleUpdateCalendarState = useCallback(function (newCalendarState, newSize) {
+    dispatch({
+      type: ActionType.UPDATE_CALENDAR_STATE,
+      payload: {
+        calendarState: newCalendarState,
+        size: newSize
+      }
+    });
+  }, []);
+  return {
+    handleOnChangeDay: handleOnChangeDay,
+    handleOnChangeMonth: handleOnChangeMonth,
+    handleOnChangeQuarter: handleOnChangeQuarter,
+    handleOnChangeYear: handleOnChangeYear,
+    handleUpdateCalendarState: handleUpdateCalendarState
+  };
+};