@salutejs/plasma-new-hope 0.109.0-canary.1310.10007111729.0 → 0.109.1-canary.1301.10056166255.0

package/styled-components/cjs/components/Calendar/store/reducer.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.reducer = exports.getInitialState = void 0;
+exports.sizeMap = exports.reducer = exports.getInitialState = void 0;
 var _utils = /*#__PURE__*/require("../utils");
 var _types = /*#__PURE__*/require("./types");
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
@@ -18,16 +18,35 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-var getInitialState = exports.getInitialState = function getInitialState(value, size, calendarState) {
+var sizeMap = exports.sizeMap = {
+  Days: {
+    single: [5, 6],
+    "double": [11, 6]
+  },
+  Months: {
+    single: [3, 2],
+    "double": [7, 2]
+  },
+  Years: {
+    single: [3, 2],
+    "double": [7, 2]
+  },
+  Quarters: {
+    single: [1, 1],
+    "double": [3, 1]
+  }
+};
+var getInitialState = exports.getInitialState = function getInitialState(value, calendarState, isDouble) {
   var initDate = value || new Date();
   var date = (0, _utils.getDateFromValue)(initDate);
+  var resSize = isDouble ? sizeMap[calendarState]["double"] : sizeMap[calendarState].single;
   return {
     date: _objectSpread(_objectSpread({}, date), {}, {
       day: value !== undefined ? date.day : 0
     }),
     startYear: (0, _utils.getStartYear)(date.year),
     calendarState: calendarState,
-    size: size
+    size: resSize
   };
 };
 var reducer = exports.reducer = function reducer(state, action) {
@@ -134,8 +153,10 @@ var reducer = exports.reducer = function reducer(state, action) {
       {
         var _action$payload4 = action.payload,
           _calendarState = _action$payload4.calendarState,
-          _year2 = _action$payload4.year;
+          _year2 = _action$payload4.year,
+          _size = _action$payload4.size;
         return _objectSpread(_objectSpread({}, state), {}, {
+          size: _size,
           calendarState: _calendarState,
           date: {
             day: state.date.day,
@@ -148,10 +169,10 @@ var reducer = exports.reducer = function reducer(state, action) {
       {
         var _action$payload5 = action.payload,
           _calendarState2 = _action$payload5.calendarState,
-          _size = _action$payload5.size;
+          _size2 = _action$payload5.size;
         return _objectSpread(_objectSpread({}, state), {}, {
           calendarState: _calendarState2,
-          size: _size || state.size
+          size: _size2 || state.size
         });
       }
     default:

package/styled-components/cjs/components/Calendar/store/types.js

@@ -8,6 +8,7 @@ var CalendarState = exports.CalendarState = /*#__PURE__*/function (CalendarState
   CalendarState["Days"] = "Days";
   CalendarState["Months"] = "Months";
   CalendarState["Years"] = "Years";
+  CalendarState["Quarters"] = "Quarters";
   return CalendarState;
 }({});
 var ActionType = exports.ActionType = /*#__PURE__*/function (ActionType) {

package/styled-components/cjs/components/Calendar/ui/CalendarDays/CalendarDays.js

@@ -8,11 +8,15 @@ exports.CalendarDays = void 0;
 var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
 var _hooks = /*#__PURE__*/require("../../hooks");
 var _utils = /*#__PURE__*/require("../../utils");
-var _CalendarDayItem = /*#__PURE__*/require("../CalendarDayItem/CalendarDayItem");
+var _DateStructureItem = /*#__PURE__*/require("../DateStructureItem/DateStructureItem");
+var _Calendar = /*#__PURE__*/require("../../Calendar.tokens");
 var _CalendarDays = /*#__PURE__*/require("./CalendarDays.styles");
 var _StyledCalendarDaysHi;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 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."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -39,13 +43,22 @@ var CalendarDays = exports.CalendarDays = function CalendarDays(_ref) {
     onHoverDay = _ref.onHoverDay,
     onSetSelected = _ref.onSetSelected,
     onKeyDown = _ref.onKeyDown;
-  var _useDays = (0, _hooks.useDays)(currentDate, value, eventList, disabledList, min, max, includeEdgeDates),
+  var _useDays = (0, _hooks.useDays)({
+      date: currentDate,
+      value: value,
+      eventList: eventList,
+      disabledList: disabledList,
+      min: min,
+      max: max,
+      includeEdgeDates: includeEdgeDates
+    }),
     _useDays2 = _slicedToArray(_useDays, 2),
     days = _useDays2[0],
     selected = _useDays2[1];
   var selectedRef = (0, _react.useRef)(selected);
   var onSetSelectedRef = (0, _react.useRef)(onSetSelected);
   var offset = isSecond ? _utils.ROW_STEP : 0;
+  var dayItemTokens = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(_Calendar.innerTokens.dateStructureFontFamily), "var(".concat(_Calendar.tokens.calendarDayFontFamily, ")")), "".concat(_Calendar.innerTokens.dateStructureFontSize), "var(".concat(_Calendar.tokens.calendarDayFontSize, ")")), "".concat(_Calendar.innerTokens.dateStructureFontWeight), "var(".concat(_Calendar.tokens.calendarDayFontWeight, ")")), "".concat(_Calendar.innerTokens.dateStructureFontLineHeight), "var(".concat(_Calendar.tokens.calendarDayFontLineHeight, ")")), "".concat(_Calendar.innerTokens.dateStructureFontLetterSpacing), "var(".concat(_Calendar.tokens.calendarDayFontLetterSpacing, ")")), "".concat(_Calendar.innerTokens.dateStructureFontStyle), "var(".concat(_Calendar.tokens.calendarDayFontStyle, ")")), "".concat(_Calendar.innerTokens.dateStructureSelectedFontWeight), "var(".concat(_Calendar.tokens.calendarDaySelectedFontWeight, ")")), "".concat(_Calendar.innerTokens.dateStructureWidth), "var(".concat(_Calendar.tokens.calendarDayItemWidth, ")")), "".concat(_Calendar.innerTokens.dateStructureHeight), "var(".concat(_Calendar.tokens.calendarDayItemHeight, ")")), "".concat(_Calendar.innerTokens.dateStructureBorderRadius), "var(".concat(_Calendar.tokens.calendarDayItemBorderRadius, ")"));
   var getSelectedDate = (0, _react.useCallback)(function (event) {
     var _event$currentTarget$ = event.currentTarget.dataset,
       day = _event$currentTarget$.day,
@@ -81,14 +94,11 @@ var CalendarDays = exports.CalendarDays = function CalendarDays(_ref) {
     }
     onHoverDay === null || onHoverDay === void 0 || onHoverDay(selectedDate);
   }, [getSelectedDate, onHoverDay, value]);
-  var handleOnFocusDay = (0, _react.useCallback)(function () {
-    // заглушка будет убрана при реализации доступности
-  }, []);
-  var getRefs = (0, _react.useCallback)(function (element, isDayInCurrentMonth, i, j) {
+  var getRefs = function getRefs(element, isDayInCurrentMonth, i, j) {
     if (isDayInCurrentMonth) {
       outerRefs.current[i + offset][j] = element;
     }
-  }, [offset, outerRefs]);
+  };
   (0, _react.useEffect)(function () {
     if (selectedRef.current) {
       var _onSetSelectedRef$cur;
@@ -104,13 +114,14 @@ var CalendarDays = exports.CalendarDays = function CalendarDays(_ref) {
   }, "\u0414\u043B\u044F \u043D\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 \u0442\u043E\u043B\u044C\u043A\u043E \u043F\u043E \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u044B\u043C \u0434\u0430\u0442\u0430\u043C \u0443\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0439\u0442\u0435 \u043A\u043B\u0430\u0432\u0438\u0448\u0443 Shift.")), /*#__PURE__*/_react["default"].createElement(_CalendarDays.StyledFlex, {
     role: "row"
   }, _utils.SHORT_DAY_NAMES.map(function (name) {
-    return /*#__PURE__*/_react["default"].createElement(_CalendarDayItem.CalendarDayItem, {
+    return /*#__PURE__*/_react["default"].createElement(_DateStructureItem.DateStructureItem, {
       role: "columnheader",
       "aria-label": _utils.FULL_DAY_NAMES[name],
       key: name,
       dayOfWeek: true,
-      day: name
-    });
+      day: name,
+      style: dayItemTokens
+    }, name);
   })), days.map(function (day, i) {
     return /*#__PURE__*/_react["default"].createElement(_CalendarDays.StyledFlex, {
       role: "row",
@@ -126,11 +137,12 @@ var CalendarDays = exports.CalendarDays = function CalendarDays(_ref) {
         _ref2$isOutOfMinMaxRa = _ref2.isOutOfMinMaxRange,
         isOutOfMinMaxRange = _ref2$isOutOfMinMaxRa === void 0 ? false : _ref2$isOutOfMinMaxRa,
         disabledArrowKey = _ref2.disabledArrowKey,
-        disabledMonths = _ref2.disabledMonths;
-      return /*#__PURE__*/_react["default"].createElement(_CalendarDayItem.CalendarDayItem, {
+        disabledDates = _ref2.disabledDates;
+      return /*#__PURE__*/_react["default"].createElement(_DateStructureItem.DateStructureItem, {
         ref: function ref(element) {
-          return getRefs(element, isDayInCurrentMonth, i, j);
+          return getRefs(element, Boolean(isDayInCurrentMonth), i, j);
         },
+        style: dayItemTokens,
         eventList: events,
         disabled: disabled,
         day: date.day,
@@ -146,12 +158,11 @@ var CalendarDays = exports.CalendarDays = function CalendarDays(_ref) {
         sideInRange: (0, _utils.getSideInRange)(value, date, hoveredDay, isSelected),
         onClick: disabled ? undefined : handleOnChangeDay(i, j),
         onMouseOver: disabled ? undefined : handleOnHoverDay,
-        onFocus: handleOnFocusDay,
-        key: "StyledDay-".concat(j),
+        key: "StyledDay-".concat(i, "-").concat(j),
         role: "gridcell",
         disabledArrowKey: disabledArrowKey,
-        disabledMonths: disabledMonths
-      });
+        disabledMonths: disabledDates
+      }, date.day);
     }));
   }));
 };

package/styled-components/cjs/components/Calendar/ui/CalendarHeader/CalendarHeader.js

@@ -10,6 +10,7 @@ var _Icon = /*#__PURE__*/require("../../../_Icon");
 var _types = /*#__PURE__*/require("../../store/types");
 var _utils = /*#__PURE__*/require("../../utils");
 var _Calendar = /*#__PURE__*/require("../../Calendar.tokens");
+var _reducer = /*#__PURE__*/require("../../store/reducer");
 var _CalendarHeader = /*#__PURE__*/require("./CalendarHeader.styles");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
@@ -29,14 +30,15 @@ var CalendarHeader = exports.CalendarHeader = function CalendarHeader(_ref) {
     onNext = _ref.onNext,
     onUpdateCalendarState = _ref.onUpdateCalendarState;
   var handleCalendarState = (0, _react.useCallback)(function () {
+    var newSize = isDouble ? _reducer.sizeMap.Months["double"] : _reducer.sizeMap.Months.single;
     if (type === _types.CalendarState.Days) {
-      onUpdateCalendarState === null || onUpdateCalendarState === void 0 || onUpdateCalendarState(_types.CalendarState.Months, [3, 2]);
+      onUpdateCalendarState === null || onUpdateCalendarState === void 0 || onUpdateCalendarState(_types.CalendarState.Months, newSize);
     }
-    if (type === _types.CalendarState.Months) {
-      onUpdateCalendarState === null || onUpdateCalendarState === void 0 || onUpdateCalendarState(_types.CalendarState.Years, [3, 2]);
+    if (type === _types.CalendarState.Months || type === _types.CalendarState.Quarters) {
+      onUpdateCalendarState === null || onUpdateCalendarState === void 0 || onUpdateCalendarState(_types.CalendarState.Years, newSize);
     }
   }, [type, onUpdateCalendarState]);
-  var getHeaderContent = (0, _react.useCallback)(function (date) {
+  var getHeaderContent = (0, _react.useCallback)(function (date, secondPart) {
     if (!date) {
       return '';
     }
@@ -46,21 +48,22 @@ var CalendarHeader = exports.CalendarHeader = function CalendarHeader(_ref) {
         size: size === 'xs' ? 'xs' : 's'
       })));
     }
-    if (type === _types.CalendarState.Months) {
+    if (type === _types.CalendarState.Months || type === _types.CalendarState.Quarters) {
       return /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeaderDate, null, date.year, /*#__PURE__*/_react["default"].createElement(_Icon.IconDisclosureDownFill, {
         color: "inherit",
         size: size === 'xs' ? 'xs' : 's'
       }));
     }
     if (type === _types.CalendarState.Years) {
-      return /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeaderDate, null, startYear, "\u2014", startYear + _utils.YEAR_RENDER_COUNT - 1, /*#__PURE__*/_react["default"].createElement(_Icon.IconDisclosureDownFill, {
+      var yearValue = secondPart ? startYear + 12 : startYear;
+      return /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeaderDate, null, yearValue, "\u2014", yearValue + _utils.YEAR_RENDER_COUNT - 1, /*#__PURE__*/_react["default"].createElement(_Icon.IconDisclosureDownFill, {
         color: "inherit",
         size: size === 'xs' ? 'xs' : 's'
       }));
     }
     return '';
   }, [type, startYear, size]);
-  var currentCalendarType = (0, _utils.getCalendarType)(isDouble ? _types.CalendarState.Days : type);
+  var currentCalendarType = (0, _utils.getCalendarType)(type);
   var PreviousButton = (0, _react.useMemo)(function () {
     return /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledArrow, {
       "aria-label": "\u041F\u0440\u0435\u0434\u044B\u0434\u0443\u0449\u0438\u0439 ".concat(currentCalendarType),
@@ -84,12 +87,14 @@ var CalendarHeader = exports.CalendarHeader = function CalendarHeader(_ref) {
     }));
   }, [currentCalendarType, size, onNext]);
   return /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledCalendarHeader, null, isDouble ? /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledNavigation, null, /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledDoubleHeaderWrapper, null, PreviousButton, /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeaderDouble, {
+    onClick: handleCalendarState,
     "aria-live": "polite"
   }, getHeaderContent(firstDate))), /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledDoubleHeaderWrapper, {
     className: _Calendar.classes.doubleHeaderLastDateWrapper
   }, /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeaderDouble, {
+    onClick: handleCalendarState,
     "aria-live": "polite"
-  }, getHeaderContent(secondDate)), NextButton)) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeader, {
+  }, getHeaderContent(secondDate, true)), NextButton)) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_CalendarHeader.StyledHeader, {
     type: "button",
     "aria-live": "polite",
     id: "id-grid-label",

package/styled-components/cjs/components/Calendar/ui/CalendarHeader/CalendarHeader.styles.js

@@ -40,7 +40,12 @@ var StyledNavigation = exports.StyledNavigation = /*#__PURE__*/_styledComponents
 })(["width:100%;", ";"], _mixins.flexCenter);
 var StyledDoubleHeaderWrapper = exports.StyledDoubleHeaderWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-186pzg3-6"
-})(["width:100%;display:grid;grid-template-columns:var(", ") 1fr var(", ");grid-template-areas:'a b c';", "{grid-area:a;}&.", " ", "{grid-area:c;}"], _Calendar.tokens.iconButtonWidth, _Calendar.tokens.iconButtonWidth, StyledArrow, _Calendar.classes.doubleHeaderLastDateWrapper, StyledArrow);
-var StyledHeaderDouble = exports.StyledHeaderDouble = /*#__PURE__*/_styledComponents["default"].h4.withConfig({
+})(["width:100%;display:grid;align-items:center;grid-template-columns:var(", ") 1fr var(", ");grid-template-areas:'a b c';", "{grid-area:a;}&.", " ", "{grid-area:c;}"], _Calendar.tokens.iconButtonWidth, _Calendar.tokens.iconButtonWidth, StyledArrow, _Calendar.classes.doubleHeaderLastDateWrapper, StyledArrow);
+var StyledHeaderDouble = exports.StyledHeaderDouble = /*#__PURE__*/_styledComponents["default"].button.withConfig({
   componentId: "plasma-new-hope__sc-186pzg3-7"
-})(["font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");grid-area:b;justify-self:center;cursor:pointer;display:flex;gap:var(", ");justify-content:space-between;align-items:center;margin:0;", ";"], _Calendar.tokens.calendarHeaderFontFamily, _Calendar.tokens.calendarHeaderFontSize, _Calendar.tokens.calendarHeaderFontStyle, _Calendar.tokens.calendarHeaderFontWeightBold, _Calendar.tokens.calendarHeaderFontLetterSpacing, _Calendar.tokens.calendarHeaderFontLineHeight, _Calendar.tokens.calendarHeaderDateGap, /*#__PURE__*/String(_mixins.flexCenter));
+})(["border:none;background-color:transparent;padding:0;outline:none;font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");color:var(", ");grid-area:b;justify-self:center;cursor:pointer;display:flex;gap:var(", ");justify-content:space-between;align-items:center;margin:0;height:fit-content;", ";", ";"], _Calendar.tokens.calendarHeaderFontFamily, _Calendar.tokens.calendarHeaderFontSize, _Calendar.tokens.calendarHeaderFontStyle, _Calendar.tokens.calendarHeaderFontWeightBold, _Calendar.tokens.calendarHeaderFontLetterSpacing, _Calendar.tokens.calendarHeaderFontLineHeight, _Calendar.tokens.calendarContentPrimaryColor, _Calendar.tokens.calendarHeaderDateGap, /*#__PURE__*/String(_mixins.flexCenter), /*#__PURE__*/(0, _mixins2.addFocus)({
+  outlineSize: '0.063rem',
+  outlineOffset: '-0.125rem',
+  outlineColor: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarOutlineFocusColor, ")"),
+  outlineRadius: '0.563rem'
+}));

package/styled-components/cjs/components/Calendar/ui/CalendarMonths/CalendarMonths.js

@@ -6,12 +6,16 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CalendarMonths = void 0;
 var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
-var _utils = /*#__PURE__*/require("../../../../utils");
 var _hooks = /*#__PURE__*/require("../../hooks");
 var _Calendar = /*#__PURE__*/require("../../Calendar.tokens");
+var _utils = /*#__PURE__*/require("../../utils");
+var _DateStructureItem = /*#__PURE__*/require("../DateStructureItem/DateStructureItem");
 var _CalendarMonths = /*#__PURE__*/require("./CalendarMonths.styles");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 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."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -23,30 +27,79 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  */
 var CalendarMonths = exports.CalendarMonths = function CalendarMonths(_ref) {
   var currentDate = _ref.date,
+    value = _ref.value,
     selectIndexes = _ref.selectIndexes,
+    eventList = _ref.eventList,
+    disabledList = _ref.disabledList,
+    min = _ref.min,
+    max = _ref.max,
     outerRefs = _ref.outerRefs,
+    isDouble = _ref.isDouble,
+    isSecond = _ref.isSecond,
+    hoveredMonth = _ref.hoveredMonth,
     onChangeMonth = _ref.onChangeMonth,
+    onHoverMonth = _ref.onHoverMonth,
     onSetSelected = _ref.onSetSelected,
     onKeyDown = _ref.onKeyDown;
-  var _useMonths = (0, _hooks.useMonths)(currentDate),
+  var _useMonths = (0, _hooks.useMonths)({
+      date: currentDate,
+      value: value,
+      eventList: eventList,
+      disabledList: disabledList,
+      min: min,
+      max: max
+    }),
     _useMonths2 = _slicedToArray(_useMonths, 2),
     months = _useMonths2[0],
     selected = _useMonths2[1];
   var selectedRef = (0, _react.useRef)(selected);
   var onSetSelectedRef = (0, _react.useRef)(onSetSelected);
-  var handleOnChangeMonth = (0, _react.useCallback)(function (event) {
-    /**
-     * нужно вызвать stopImmediatePropagation для случаев, когда
-     * обработчик события onClick навешивается снаружи.
-     * Как, например, в компоненте Popup
-     */
-    event.nativeEvent.stopImmediatePropagation();
-    var monthIndex = event.currentTarget.dataset.monthIndex;
-    onChangeMonth(Number(monthIndex));
-  }, [onChangeMonth]);
+  var offset = isSecond ? _utils.ROW_MONTH_STEP : 0;
+  var monthItemTokens = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(_Calendar.innerTokens.dateStructureFontFamily), "var(".concat(_Calendar.tokens.calendarMonthFontFamily, ")")), "".concat(_Calendar.innerTokens.dateStructureFontSize), "var(".concat(_Calendar.tokens.calendarMonthFontSize, ")")), "".concat(_Calendar.innerTokens.dateStructureFontWeight), "var(".concat(_Calendar.tokens.calendarMonthFontWeight, ")")), "".concat(_Calendar.innerTokens.dateStructureFontLineHeight), "var(".concat(_Calendar.tokens.calendarMonthFontLineHeight, ")")), "".concat(_Calendar.innerTokens.dateStructureFontLetterSpacing), "var(".concat(_Calendar.tokens.calendarMonthFontLetterSpacing, ")")), "".concat(_Calendar.innerTokens.dateStructureFontStyle), "var(".concat(_Calendar.tokens.calendarMonthFontStyle, ")")), "".concat(_Calendar.innerTokens.dateStructureSelectedFontWeight), "var(".concat(_Calendar.tokens.calendarMonthSelectedFontWeight, ")")), "".concat(_Calendar.innerTokens.dateStructureWidth), "var(".concat(_Calendar.tokens.calendarMonthItemWidth, ")")), "".concat(_Calendar.innerTokens.dateStructureHeight), "var(".concat(_Calendar.tokens.calendarMonthItemHeight, ")")), "".concat(_Calendar.innerTokens.dateStructureBorderRadius), "var(".concat(_Calendar.tokens.calendarMonthItemBorderRadius, ")"));
+  var getSelectedDate = (0, _react.useCallback)(function (event) {
+    var _event$currentTarget$ = event.currentTarget.dataset,
+      day = _event$currentTarget$.day,
+      monthIndex = _event$currentTarget$.monthIndex,
+      year = _event$currentTarget$.year;
+    var selectedDate = {
+      day: Number(day),
+      monthIndex: Number(monthIndex),
+      year: Number(year)
+    };
+    if (!(0, _utils.canSelectDate)(selectedDate, value, disabledList)) {
+      return;
+    }
+    return selectedDate;
+  }, [disabledList, value]);
+  var handleOnChangeMonth = (0, _react.useCallback)(function (i, j) {
+    return function (event) {
+      /**
+       * нужно вызвать stopImmediatePropagation для случаев, когда
+       * обработчик события onClick навешивается снаружи.
+       * Как, например, в компоненте Popup
+       */
+      event.nativeEvent.stopImmediatePropagation();
+      var selectedDate = getSelectedDate(event);
+      if (!selectedDate) {
+        return;
+      }
+      onChangeMonth(selectedDate, [i + offset, j]);
+      if ((0, _utils.isSelectProcess)(value)) {
+        onHoverMonth === null || onHoverMonth === void 0 || onHoverMonth(undefined);
+      }
+    };
+  }, [getSelectedDate, onChangeMonth, offset, value, onHoverMonth]);
+  var handleOnHoverMonth = (0, _react.useCallback)(function (event) {
+    var selectedDate = getSelectedDate(event);
+    var isSelectedDone = Array.isArray(value) && value[0] && value[1];
+    if (!selectedDate || !Array.isArray(value) || isSelectedDone) {
+      return;
+    }
+    onHoverMonth === null || onHoverMonth === void 0 || onHoverMonth(selectedDate);
+  }, [getSelectedDate, onHoverMonth, value]);
   var getRefs = (0, _react.useCallback)(function (element, i, j) {
-    outerRefs.current[i][j] = element;
-  }, [outerRefs]);
+    outerRefs.current[i + offset][j] = element;
+  }, [offset, outerRefs]);
   (0, _react.useEffect)(function () {
     if (selectedRef.current) {
       var _onSetSelectedRef$cur;
@@ -66,23 +119,40 @@ var CalendarMonths = exports.CalendarMonths = function CalendarMonths(_ref) {
         monthIndex = _ref2.monthIndex,
         isSelected = _ref2.isSelected,
         isCurrent = _ref2.isCurrent,
-        monthFullName = _ref2.monthFullName;
-      var selectedClass = isSelected ? _Calendar.classes.selectedItem : undefined;
-      var currentClass = isCurrent ? _Calendar.classes.currentItem : undefined;
-      return /*#__PURE__*/_react["default"].createElement(_CalendarMonths.StyledMonthRoot, {
-        id: "month-test-".concat(i, "-").concat(j),
-        className: (0, _utils.cx)(selectedClass, currentClass, _Calendar.classes.selectableItem),
+        monthFullName = _ref2.monthFullName,
+        date = _ref2.date,
+        events = _ref2.events,
+        isOutOfMinMaxRange = _ref2.isOutOfMinMaxRange,
+        inRange = _ref2.inRange,
+        disabled = _ref2.disabled,
+        disabledArrowKey = _ref2.disabledArrowKey,
+        disabledDates = _ref2.disabledDates;
+      return /*#__PURE__*/_react["default"].createElement(_DateStructureItem.DateStructureItem, {
         ref: function ref(element) {
           return getRefs(element, i, j);
         },
-        tabIndex: i === (selectIndexes === null || selectIndexes === void 0 ? void 0 : selectIndexes[0]) && j === (selectIndexes === null || selectIndexes === void 0 ? void 0 : selectIndexes[1]) ? 0 : -1,
-        onClick: handleOnChangeMonth,
-        "data-month-index": monthIndex,
-        "aria-selected": isSelected,
-        role: "gridcell",
+        style: monthItemTokens,
+        eventList: events,
+        disabled: disabled,
+        day: date.day,
+        year: date.year,
+        monthIndex: monthIndex,
+        isFocused: i + offset === (selectIndexes === null || selectIndexes === void 0 ? void 0 : selectIndexes[0]) && j === (selectIndexes === null || selectIndexes === void 0 ? void 0 : selectIndexes[1]) && !isOutOfMinMaxRange,
+        isSelected: isSelected,
+        isCurrent: isCurrent,
+        isDouble: isDouble,
+        isHovered: (0, _utils.isSameDay)(date, hoveredMonth),
+        inRange: (0, _utils.getInRange)(value, date, hoveredMonth, inRange),
+        sideInRange: (0, _utils.getSideInRange)(value, date, hoveredMonth, isSelected),
+        onClick: disabled ? undefined : handleOnChangeMonth(i, j),
+        onMouseOver: disabled ? undefined : handleOnHoverMonth,
         key: "StyledMonth-".concat(i, "-").concat(j),
-        "aria-label": monthFullName
-      }, /*#__PURE__*/_react["default"].createElement(_CalendarMonths.StyledMonth, null, monthName));
+        role: "gridcell",
+        "aria-label": monthFullName,
+        disabledArrowKey: disabledArrowKey,
+        disabledMonths: disabledDates,
+        isDayInCurrentMonth: true
+      }, monthName);
     }));
   }));
 };

package/styled-components/cjs/components/Calendar/ui/CalendarMonths/CalendarMonths.styles.js

@@ -3,41 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledMonthRoot = exports.StyledMonth = exports.StyledFlex = exports.StyledCalendarMonths = void 0;
+exports.StyledFlex = exports.StyledCalendarMonths = void 0;
 var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
 var _Calendar = /*#__PURE__*/require("../../Calendar.tokens");
-var _mixins = /*#__PURE__*/require("../../../../mixins");
-var _mixins2 = /*#__PURE__*/require("../../mixins");
+var _mixins = /*#__PURE__*/require("../../mixins");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var StyledCalendarMonths = exports.StyledCalendarMonths = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-mx5ps9-0"
 })(["padding:var(", ");box-sizing:border-box;"], _Calendar.tokens.calendarMonthsPadding);
 var StyledFlex = exports.StyledFlex = /*#__PURE__*/_styledComponents["default"].div.withConfig({
   componentId: "plasma-new-hope__sc-mx5ps9-1"
-})(["", ";"], /*#__PURE__*/String(_mixins2.flexCenter));
-var StyledMonth = exports.StyledMonth = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-mx5ps9-2"
-})(["border-radius:calc(var(", ") - 0.125rem);", ";"], _Calendar.tokens.calendarMonthItemBorderRadius, /*#__PURE__*/String(_mixins2.flexCenter));
-var StyledMonthRoot = exports.StyledMonthRoot = /*#__PURE__*/_styledComponents["default"].div.withConfig({
-  componentId: "plasma-new-hope__sc-mx5ps9-3"
-})(["font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");position:relative;box-sizing:border-box;min-height:var(", ");min-width:var(", ");border-radius:var(", ");", ";", ";", ";&.", "{", ";}"], _Calendar.tokens.calendarMonthFontFamily, _Calendar.tokens.calendarMonthFontSize, _Calendar.tokens.calendarMonthFontStyle, _Calendar.tokens.calendarMonthFontWeight, _Calendar.tokens.calendarMonthFontLetterSpacing, _Calendar.tokens.calendarMonthFontLineHeight, _Calendar.tokens.calendarMonthItemHeight, _Calendar.tokens.calendarMonthItemWidth, _Calendar.tokens.calendarMonthItemBorderRadius, /*#__PURE__*/String(_mixins2.flexCenter), /*#__PURE__*/(0, _mixins2.addSelected)({
-  minWidth: /*#__PURE__*/"calc(var(".concat(_Calendar.tokens.calendarMonthItemWidth, ") - 0.25rem)"),
-  minHeight: /*#__PURE__*/"calc(var(".concat(_Calendar.tokens.calendarMonthItemHeight, ") - 0.25rem)"),
-  selectedFontWeight: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarMonthSelectedFontWeight, ")"),
-  selectedBackground: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarSelectedItemBackground, ")"),
-  selectedColor: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarSelectedItemColor, ")"),
-  selectableBackgroundHover: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarSelectableItemBackgroundHover, ")"),
-  currentBorderColor: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarCurrentItemBorderColor, ")"),
-  activeBackground: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarActiveItemBackground, ")"),
-  activeColor: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarActiveItemColor, ")")
-}), /*#__PURE__*/(0, _mixins.addFocus)({
-  outlineSize: '0.063rem',
-  outlineOffset: '-0.125rem',
-  outlineColor: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarOutlineFocusColor, ")"),
-  outlineRadius: /*#__PURE__*/"calc(var(".concat(_Calendar.tokens.calendarMonthItemBorderRadius, ") + 0.125rem)")
-}), _Calendar.classes.currentItem, /*#__PURE__*/(0, _mixins.addFocus)({
-  outlineSize: '0.063rem',
-  outlineOffset: '-0.1875rem',
-  outlineColor: /*#__PURE__*/"var(".concat(_Calendar.tokens.calendarOutlineFocusColor, ")"),
-  outlineRadius: /*#__PURE__*/"calc(var(".concat(_Calendar.tokens.calendarMonthItemBorderRadius, ") + 0.125rem)")
-}));
+})(["", ";"], /*#__PURE__*/String(_mixins.flexCenter));