@megafon/ui-core 6.2.1 → 7.0.0

package/dist/es/components/Calendar/Calendar.js

@@ -2,30 +2,23 @@ import _typeof from "@babel/runtime/helpers/typeof";
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-import "core-js/modules/es.array.index-of.js";
 import "core-js/modules/es.symbol.js";
-import "core-js/modules/es.date.to-string.js";
-import "core-js/modules/es.array.reverse.js";
-import "core-js/modules/es.array.from.js";
-import "core-js/modules/es.string.iterator.js";
 import "core-js/modules/es.array.concat.js";
+import "core-js/modules/es.array.from.js";
+import "core-js/modules/es.array.index-of.js";
 import "core-js/modules/es.array.map.js";
-import "core-js/modules/es.object.values.js";
-
+import "core-js/modules/es.array.reverse.js";
+import "core-js/modules/es.date.to-string.js";
+import "core-js/modules/es.string.iterator.js";
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
-
-  for (var p in s) {
-    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  }
-
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-
-import React, { useState, useEffect, useMemo, useRef } from 'react';
+import * as React from 'react';
 import { START_DATE, END_DATE, useDatepicker, useMonth } from '@datepicker-react/hooks';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import { addMonths, subMonths } from 'date-fns';
@@ -36,18 +29,15 @@ import isBefore from 'date-fns/isBefore';
 import isEqual from 'date-fns/isEqual';
 import isSameMonth from 'date-fns/isSameMonth';
 import ruLocale from 'date-fns/locale/ru';
-import PropTypes from 'prop-types';
-import Day from "./components/Day/Day";
-import Month from "./components/Month/Month";
+import Day from "./components/_Day/Day";
+import Month from "./components/_Month/Month";
 import "./Calendar.css";
-
 var formatDate = function formatDate(date, pattern) {
   var locale = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : ruLocale;
   return format(date, pattern, {
     locale: locale
   });
 };
-
 export var CalendarTypes = {
   CLASSIC: 'Classic',
   MODERN: 'Modern'
@@ -57,19 +47,15 @@ export var CalendarDirectionTypes = {
   FUTURE: 'future',
   BOTH: 'both'
 };
-
 var weekdayLabelFormat = function weekdayLabelFormat(date) {
   return formatDate(date, 'EEEEEE');
 };
-
 var dayLabelFormat = function dayLabelFormat(date) {
   return formatDate(date, 'd');
 };
-
 var monthLabelFormat = function monthLabelFormat(date) {
   return formatDate(date, 'LLLL');
 };
-
 var generateMonthsData = function generateMonthsData(pastMonthsCount, futureMonthsCount, direction) {
   var months = [];
   var currentDate = new Date();
@@ -77,7 +63,6 @@ var generateMonthsData = function generateMonthsData(pastMonthsCount, futureMont
     year: currentDate.getFullYear(),
     month: currentDate.getMonth()
   };
-
   if (direction === 'past' || direction === 'both') {
     var pastMonths = Array.from({
       length: pastMonthsCount
@@ -92,7 +77,6 @@ var generateMonthsData = function generateMonthsData(pastMonthsCount, futureMont
   } else {
     months.push(currentMonth);
   }
-
   if (direction === 'future' || direction === 'both') {
     var futureMonths = Array.from({
       length: futureMonthsCount
@@ -103,9 +87,8 @@ var generateMonthsData = function generateMonthsData(pastMonthsCount, futureMont
         month: monthDate.getMonth()
       };
     });
-    months = [].concat(_toConsumableArray(months), _toConsumableArray(futureMonths));
+    months = [].concat(_toConsumableArray(months), futureMonths);
   }
-
   return months;
 };
 /* List of cases to check on component change:
@@ -118,31 +101,28 @@ var generateMonthsData = function generateMonthsData(pastMonthsCount, futureMont
 - Should correctly highlights period if start date chosen and hover on possible end date
 
 */
-
-
 var cn = cnCreate('mfui-calendar');
-
 var Calendar = function Calendar(_ref) {
   var dataAttrs = _ref.dataAttrs,
-      _ref$isSingleDate = _ref.isSingleDate,
-      isSingleDate = _ref$isSingleDate === void 0 ? false : _ref$isSingleDate,
-      _ref$startDate = _ref.startDate,
-      startDate = _ref$startDate === void 0 ? null : _ref$startDate,
-      _ref$endDate = _ref.endDate,
-      endDate = _ref$endDate === void 0 ? null : _ref$endDate,
-      className = _ref.className,
-      onChange = _ref.onChange,
-      minBookingDate = _ref.minBookingDate,
-      maxBookingDate = _ref.maxBookingDate,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'Classic' : _ref$type,
-      _ref$pastMonthsCount = _ref.pastMonthsCount,
-      pastMonthsCount = _ref$pastMonthsCount === void 0 ? 1 : _ref$pastMonthsCount,
-      _ref$futureMonthsCoun = _ref.futureMonthsCount,
-      futureMonthsCount = _ref$futureMonthsCoun === void 0 ? 1 : _ref$futureMonthsCoun,
-      _ref$direction = _ref.direction,
-      direction = _ref$direction === void 0 ? 'past' : _ref$direction;
-  var calendarStateFromProps = useMemo(function () {
+    _ref$isSingleDate = _ref.isSingleDate,
+    isSingleDate = _ref$isSingleDate === void 0 ? false : _ref$isSingleDate,
+    _ref$startDate = _ref.startDate,
+    startDate = _ref$startDate === void 0 ? null : _ref$startDate,
+    _ref$endDate = _ref.endDate,
+    endDate = _ref$endDate === void 0 ? null : _ref$endDate,
+    className = _ref.className,
+    onChange = _ref.onChange,
+    minBookingDate = _ref.minBookingDate,
+    maxBookingDate = _ref.maxBookingDate,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? 'Classic' : _ref$type,
+    _ref$pastMonthsCount = _ref.pastMonthsCount,
+    pastMonthsCount = _ref$pastMonthsCount === void 0 ? 1 : _ref$pastMonthsCount,
+    _ref$futureMonthsCoun = _ref.futureMonthsCount,
+    futureMonthsCount = _ref$futureMonthsCoun === void 0 ? 1 : _ref$futureMonthsCoun,
+    _ref$direction = _ref.direction,
+    direction = _ref$direction === void 0 ? 'past' : _ref$direction;
+  var calendarStateFromProps = React.useMemo(function () {
     var isInitialDatesEqual = startDate && endDate && isEqual(startDate, endDate);
     var isStartFocus = !startDate || endDate && !isInitialDatesEqual;
     var isStartDateBlocked = startDate && minBookingDate && maxBookingDate && (isAfter(minBookingDate, startDate) || isBefore(maxBookingDate, startDate));
@@ -154,57 +134,51 @@ var Calendar = function Calendar(_ref) {
       focusedInput: isStartFocus ? START_DATE : END_DATE
     };
   }, [startDate, endDate, isSingleDate, minBookingDate, maxBookingDate]);
-  var monthsData = useMemo(function () {
+  var monthsData = React.useMemo(function () {
     return generateMonthsData(pastMonthsCount, futureMonthsCount, direction);
   }, [pastMonthsCount, futureMonthsCount, direction]);
-
-  var _useState = useState(calendarStateFromProps),
-      _useState2 = _slicedToArray(_useState, 2),
-      calendarState = _useState2[0],
-      setCalendarState = _useState2[1];
-
-  var _useState3 = useState(undefined),
-      _useState4 = _slicedToArray(_useState3, 2),
-      hoveredDate = _useState4[0],
-      setHoveredDate = _useState4[1];
-
-  var isUserChoice = useRef(false);
-  var currentMonthRef = useRef(null);
+  var _React$useState = React.useState(calendarStateFromProps),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    calendarState = _React$useState2[0],
+    setCalendarState = _React$useState2[1];
+  var _React$useState3 = React.useState(undefined),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    hoveredDate = _React$useState4[0],
+    setHoveredDate = _React$useState4[1];
+  var isUserChoice = React.useRef(false);
+  var currentMonthRef = React.useRef(null);
   var stateStartDate = calendarState.startDate,
-      stateEndDate = calendarState.endDate,
-      stateFocusedInput = calendarState.focusedInput;
+    stateEndDate = calendarState.endDate,
+    stateFocusedInput = calendarState.focusedInput;
   var isModernType = type === CalendarTypes.MODERN;
-
   var _a = useDatepicker(_extends({
-    onDatesChange: function onDatesChange() {
-      return undefined;
-    },
-    numberOfMonths: 1,
-    minBookingDate: minBookingDate,
-    maxBookingDate: maxBookingDate,
-    initialVisibleMonth: stateStartDate || undefined
-  }, calendarState)),
-      firstDayOfWeek = _a.firstDayOfWeek,
-      activeMonths = _a.activeMonths,
-      goToPreviousMonths = _a.goToPreviousMonths,
-      goToNextMonths = _a.goToNextMonths,
-      goToDate = _a.goToDate,
-      pickerProps = __rest(_a, ["firstDayOfWeek", "activeMonths", "goToPreviousMonths", "goToNextMonths", "goToDate"]);
-
-  useEffect(function () {
+      onDatesChange: function onDatesChange() {
+        return undefined;
+      },
+      numberOfMonths: 1,
+      minBookingDate: minBookingDate,
+      maxBookingDate: maxBookingDate,
+      initialVisibleMonth: stateStartDate || undefined
+    }, calendarState)),
+    firstDayOfWeek = _a.firstDayOfWeek,
+    activeMonths = _a.activeMonths,
+    goToPreviousMonths = _a.goToPreviousMonths,
+    goToNextMonths = _a.goToNextMonths,
+    goToDate = _a.goToDate,
+    pickerProps = __rest(_a, ["firstDayOfWeek", "activeMonths", "goToPreviousMonths", "goToNextMonths", "goToDate"]);
+  React.useEffect(function () {
     isUserChoice.current = false;
   }, [startDate]);
-  useEffect(function () {
+  React.useEffect(function () {
     var propsStartDate = calendarStateFromProps.startDate;
     setCalendarState(calendarStateFromProps);
-    !isUserChoice.current && propsStartDate && goToDate(propsStartDate); // eslint-disable-next-line react-hooks/exhaustive-deps
+    !isUserChoice.current && propsStartDate && goToDate(propsStartDate);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [calendarStateFromProps]);
-  useEffect(function () {
+  React.useEffect(function () {
     var _a, _b;
-
     if (isModernType && direction !== 'future') {
       var parentElement = (_a = currentMonthRef.current) === null || _a === void 0 ? void 0 : _a.parentNode;
-
       if (parentElement && currentMonthRef.current) {
         parentElement.scrollTo({
           top: ((_b = currentMonthRef.current) === null || _b === void 0 ? void 0 : _b.scrollHeight) * pastMonthsCount || 0
@@ -212,7 +186,6 @@ var Calendar = function Calendar(_ref) {
       }
     }
   }, [isModernType, direction, pastMonthsCount]);
-
   var getCalendarState = function getCalendarState(date) {
     var isStartChose = stateFocusedInput === START_DATE;
     var isEndChose = stateFocusedInput === END_DATE;
@@ -224,10 +197,8 @@ var Calendar = function Calendar(_ref) {
     var isClickAfterChosenEndDate = stateEndDate && isStartChose && isAfter(date, stateEndDate || 0);
     var isClickBeforeStartDate = stateStartDate && isEndChose && !isAfter(date, stateStartDate || 0);
     var isStartDateChose = isStartDateClick || isEndDateClick || isClickBeforeChosenEndDate || isClickAfterChosenEndDate || isClickBeforeStartDate;
-
     if (isModernType) {
       var resetEndDateCondition = isStartChose || !stateStartDate || !!stateEndDate;
-
       if (resetEndDateCondition || isEndChose && stateStartDate && isBefore(date, stateStartDate)) {
         return {
           startDate: date,
@@ -235,7 +206,6 @@ var Calendar = function Calendar(_ref) {
           focusedInput: END_DATE
         };
       }
-
       if (isEndChose && stateStartDate) {
         return {
           startDate: stateStartDate,
@@ -244,13 +214,11 @@ var Calendar = function Calendar(_ref) {
         };
       }
     }
-
     switch (true) {
       case isSingleDate:
         return _extends(_extends({}, calendarState), {
           startDate: date
         });
-
       case isPeriodNarrow:
         {
           var isCloserToStart = stateStartDate && stateEndDate && differenceInDays(stateStartDate, date) >= differenceInDays(date, stateEndDate);
@@ -260,20 +228,17 @@ var Calendar = function Calendar(_ref) {
             focusedInput: START_DATE
           });
         }
-
       case isStartDateChose:
         return {
           startDate: date,
           endDate: null,
           focusedInput: END_DATE
         };
-
       case isEndDateChose:
         return _extends(_extends({}, calendarState), {
           endDate: date,
           focusedInput: START_DATE
         });
-
       default:
         return _extends(_extends({}, calendarState), {
           startDate: date,
@@ -281,45 +246,37 @@ var Calendar = function Calendar(_ref) {
         });
     }
   };
-
   var isDateHighlighted = function isDateHighlighted(date) {
     if (!stateStartDate || !!stateEndDate || isSingleDate) {
       return false;
     }
-
     return !!stateStartDate && !!hoveredDate && isAfter(hoveredDate, date) && isBefore(stateStartDate, date);
   };
-
   var handleDaySelect = function handleDaySelect(date) {
     var nextState = getCalendarState(date);
     var nextStartDate = nextState.startDate,
-        nextEndDate = nextState.endDate;
+      nextEndDate = nextState.endDate;
     setCalendarState(nextState);
     isUserChoice.current = true;
     onChange === null || onChange === void 0 ? void 0 : onChange(nextStartDate, nextEndDate);
   };
-
   var handleDateHover = function handleDateHover(date) {
-    return setHoveredDate(date);
+    date && setHoveredDate(date);
   };
-
   var handleDateMouseLeave = function handleDateMouseLeave() {
     return setHoveredDate(undefined);
   };
-
   var renderDays = function renderDays(days) {
     var correctionIndex = 0;
     return days.map(function (day, index) {
       if (_typeof(day) === 'object') {
         var date = day.date,
-            dayLabel = day.dayLabel;
-
+          dayLabel = day.dayLabel;
         if (!dayLabel) {
           return /*#__PURE__*/React.createElement("div", {
             key: index + String(date)
           });
         }
-
         return /*#__PURE__*/React.createElement(Day, _extends({
           dataAttrs: {
             root: _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.day, index + 1 - correctionIndex))
@@ -335,33 +292,29 @@ var Calendar = function Calendar(_ref) {
           isModern: isModernType
         }));
       }
-
       correctionIndex += 1;
       return /*#__PURE__*/React.createElement("div", {
         key: index + day
       });
     });
   };
-
   var renderMonths = function renderMonths() {
     var monthsArray = isModernType ? monthsData : activeMonths;
     return monthsArray.map(function (_ref2) {
       var month = _ref2.month,
-          year = _ref2.year;
-
+        year = _ref2.year;
       // eslint-disable-next-line react-hooks/rules-of-hooks
       var _useMonth = useMonth({
-        year: year,
-        month: month,
-        firstDayOfWeek: firstDayOfWeek,
-        dayLabelFormat: dayLabelFormat,
-        weekdayLabelFormat: weekdayLabelFormat,
-        monthLabelFormat: monthLabelFormat
-      }),
-          days = _useMonth.days,
-          weekdayLabels = _useMonth.weekdayLabels,
-          monthLabel = _useMonth.monthLabel;
-
+          year: year,
+          month: month,
+          firstDayOfWeek: firstDayOfWeek,
+          dayLabelFormat: dayLabelFormat,
+          weekdayLabelFormat: weekdayLabelFormat,
+          monthLabelFormat: monthLabelFormat
+        }),
+        days = _useMonth.days,
+        weekdayLabels = _useMonth.weekdayLabels,
+        monthLabel = _useMonth.monthLabel;
       var isPrevMonthDisabled = !!minBookingDate && isSameMonth(new Date(year, month, 1), minBookingDate);
       var isNextMonthDisabled = !!maxBookingDate && isSameMonth(new Date(year, month, 1), maxBookingDate);
       var isCurrentMonth = new Date().getFullYear() === year && new Date().getMonth() === month;
@@ -385,32 +338,10 @@ var Calendar = function Calendar(_ref) {
       }, renderDays(days)));
     });
   };
-
   return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn([className], {
       modern: isModernType
     })
   }), renderMonths());
 };
-
-Calendar.propTypes = {
-  dataAttrs: PropTypes.shape({
-    root: PropTypes.objectOf(PropTypes.string.isRequired),
-    day: PropTypes.objectOf(PropTypes.string.isRequired),
-    month: PropTypes.objectOf(PropTypes.string.isRequired),
-    arrowLeft: PropTypes.objectOf(PropTypes.string.isRequired),
-    arrowRight: PropTypes.objectOf(PropTypes.string.isRequired)
-  }),
-  isSingleDate: PropTypes.bool,
-  className: PropTypes.string,
-  startDate: PropTypes.instanceOf(Date),
-  endDate: PropTypes.instanceOf(Date),
-  minBookingDate: PropTypes.instanceOf(Date),
-  maxBookingDate: PropTypes.instanceOf(Date),
-  type: PropTypes.oneOf(Object.values(CalendarTypes)),
-  pastMonthsCount: PropTypes.number,
-  futureMonthsCount: PropTypes.number,
-  direction: PropTypes.oneOf(Object.values(CalendarDirectionTypes)),
-  onChange: PropTypes.func
-};
 export default Calendar;

package/dist/es/components/Calendar/components/_Day/Day.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-day{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;-webkit-box-sizing:content-box;box-sizing:content-box;color:var(--content);cursor:pointer;height:32px;line-height:24px;outline:none;padding:0 10px 8px 0;position:relative;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:32px;-webkit-tap-highlight-color:rgba(0,0,0,0);font-size:12px;line-height:18px}.mfui-day:last-child{padding-right:0}.mfui-day:not(:disabled):not(.mfui-day_active):focus:after,.mfui-day:not(:disabled):not(.mfui-day_active):hover:after,.mfui-day_active-modern:after,.mfui-day_active:after{background-color:var(--spbSky0);border-radius:50%!important;color:var(--content);content:"";height:32px;left:0;position:absolute;top:0;width:32px;z-index:1}.mfui-day_active-modern:after{height:38px;width:38px}.mfui-day_active-modern:hover:after{background-color:var(--brandGreen)!important}.mfui-day:not(:disabled):not(.mfui-day_active):hover:after{background-color:var(--spbSky0);color:var(--content)}.mfui-day:not(:disabled):not(.mfui-day_active):focus:after,.mfui-day_active-modern:after,.mfui-day_active:after{background-color:var(--brandGreen)}.mfui-day_disabled{cursor:default;opacity:.3;pointer-events:none}.mfui-day:not(:disabled):not(.mfui-day_active):focus,.mfui-day_active,.mfui-day_active-modern:after{color:var(--stcWhite)}.mfui-day_active+.mfui-day_active:before,.mfui-day_between:hover+.mfui-day:not(.mfui-day_monday).mfui-day_active:before{background-color:var(--spbSky1);content:"";display:block;height:32px;left:-22px;position:absolute;top:0;width:32px;z-index:-1}.mfui-day_between{border-radius:0;position:relative}.mfui-day_between:before{left:-22px;padding:0 20px}.mfui-day_between:after,.mfui-day_between:before{background-color:var(--spbSky1);content:"";display:block;height:32px;position:absolute;top:0;z-index:-1}.mfui-day_between:after{right:-16px;width:40px}.mfui-day_last,.mfui-day_sunday{border-radius:50%}.mfui-day_last:after,.mfui-day_sunday:after{border-radius:50%;right:10px;width:32px}.mfui-day_last:after{right:0}.mfui-day_first,.mfui-day_monday{border-radius:50%}.mfui-day_first:before,.mfui-day_monday:before{border-radius:50%;left:0;padding:0;width:32px}.mfui-day_sunday.mfui-day_first{border-radius:50%}.mfui-day__label{position:relative;z-index:99}.mfui-day_modern{height:38px;width:38.29px}.mfui-day_modern:not(:disabled):not(.mfui-day_active-modern):focus:after,.mfui-day_modern:not(:disabled):not(.mfui-day_active-modern):hover:after,.mfui-day_modern_active-modern:after{background-color:var(--spbSky0);border-radius:50%!important;color:var(--content);content:"";height:38px;left:0;position:absolute;top:0;width:38px;z-index:1}.mfui-day_modern:not(:disabled):not(.mfui-day_active-modern):hover:after{background-color:var(--spbSky0);color:var(--content)}.mfui-day_modern:not(:disabled):not(.mfui-day_active-modern):focus:after,.mfui-day_modern_active-modern:after{background-color:var(--brandGreen)}.mfui-day:not(:disabled):focus,.mfui-day_active-modern{color:var(--stcWhite)}.mfui-day_active-modern+.mfui-day_active-modern:before,.mfui-day_between-modern:hover+.mfui-day:not(.mfui-day_monday-modern).mfui-day_active-modern:before{background-color:var(--spbSky1);content:"";display:block;height:38px;left:-22px;position:absolute;top:0;width:40px;z-index:-1}.mfui-day_between-modern{border-radius:0;position:relative}.mfui-day_between-modern:before{left:-28px;padding:0 29px}.mfui-day_between-modern:after,.mfui-day_between-modern:before{background-color:var(--spbSky1);content:"";display:block;height:38px;position:absolute;top:0;z-index:-1}.mfui-day_between-modern:after{right:-18px;width:45px}.mfui-day_last-modern,.mfui-day_sunday-modern{border-radius:50%}.mfui-day_last-modern:before,.mfui-day_sunday-modern:before{padding-left:20px}.mfui-day_last-modern:after,.mfui-day_sunday-modern:after{border-radius:50%;right:10px;width:38.29px}.mfui-day_last-modern:after{right:0}.mfui-day_first-modern,.mfui-day_monday-modern{border-radius:50%}.mfui-day_first-modern:before,.mfui-day_monday-modern:before{border-radius:50%;left:0;padding:0;width:38px}.mfui-day_sunday-modern.mfui-day_first-modern{border-radius:50%}.mfui-day__label_modern{font-size:15px;font-weight:400;line-height:24px;text-align:center}

package/dist/es/components/Calendar/components/{Day → _Day}/Day.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import './Day.less';
+import * as React from 'react';
+import './Day.scss';
 export interface IDayPickerProps {
     dataAttrs?: {
         root?: Record<string, string>;
@@ -14,13 +14,13 @@ export interface IDayPickerProps {
     onDateSelect: (date: Date) => void;
     onDateFocus: (date: Date) => void;
 }
-export declare type DayType = {
+export type DayType = {
     isBetween?: boolean;
     dayLabel?: string;
     date: Date;
     isModern?: boolean;
     onMouseLeave?: () => void;
 };
-export declare type IDayProps = IDayPickerProps & DayType;
+export type IDayProps = IDayPickerProps & DayType;
 declare const Day: React.FC<IDayProps>;
 export default Day;

package/dist/es/components/Calendar/components/{Day → _Day}/Day.js

@@ -1,57 +1,45 @@
 import _extends from "@babel/runtime/helpers/extends";
-import "core-js/modules/es.array.index-of.js";
 import "core-js/modules/es.symbol.js";
-import "core-js/modules/es.date.to-string.js";
-
+import "core-js/modules/es.array.index-of.js";
 var __rest = this && this.__rest || function (s, e) {
   var t = {};
-
-  for (var p in s) {
-    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  }
-
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
   if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
     if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
   }
   return t;
 };
-
-import React from 'react';
+import * as React from 'react';
 import { useDay } from '@datepicker-react/hooks';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import isFirstDayOfMonth from 'date-fns/isFirstDayOfMonth';
 import isLastDayOfMonth from 'date-fns/isLastDayOfMonth';
 import isMonday from 'date-fns/isMonday';
 import isSunday from 'date-fns/isSunday';
-import PropTypes from 'prop-types';
 import "./Day.css";
 var cn = cnCreate('mfui-day');
-
 var Day = function Day(_a) {
   var dataAttrs = _a.dataAttrs,
-      _a$isBetween = _a.isBetween,
-      isBetween = _a$isBetween === void 0 ? false : _a$isBetween,
-      dayLabel = _a.dayLabel,
-      date = _a.date,
-      _a$isModern = _a.isModern,
-      isModern = _a$isModern === void 0 ? false : _a$isModern,
-      onMouseLeave = _a.onMouseLeave,
-      pickerProps = __rest(_a, ["dataAttrs", "isBetween", "dayLabel", "date", "isModern", "onMouseLeave"]);
-
+    _a$isBetween = _a.isBetween,
+    isBetween = _a$isBetween === void 0 ? false : _a$isBetween,
+    dayLabel = _a.dayLabel,
+    date = _a.date,
+    _a$isModern = _a.isModern,
+    isModern = _a$isModern === void 0 ? false : _a$isModern,
+    onMouseLeave = _a.onMouseLeave,
+    pickerProps = __rest(_a, ["dataAttrs", "isBetween", "dayLabel", "date", "isModern", "onMouseLeave"]);
   var dayRef = React.useRef(null);
-
   var _useDay = useDay(_extends({
-    date: date,
-    dayRef: dayRef
-  }, pickerProps)),
-      isSelected = _useDay.isSelected,
-      isSelectedStartOrEnd = _useDay.isSelectedStartOrEnd,
-      isDateDisabled = _useDay.disabledDate,
-      onClick = _useDay.onClick,
-      onKeyDown = _useDay.onKeyDown,
-      onMouseEnter = _useDay.onMouseEnter,
-      tabIndex = _useDay.tabIndex;
-
+      date: date,
+      dayRef: dayRef
+    }, pickerProps)),
+    isSelected = _useDay.isSelected,
+    isSelectedStartOrEnd = _useDay.isSelectedStartOrEnd,
+    isDateDisabled = _useDay.disabledDate,
+    onClick = _useDay.onClick,
+    onKeyDown = _useDay.onKeyDown,
+    onMouseEnter = _useDay.onMouseEnter,
+    tabIndex = _useDay.tabIndex;
   var modernClasses = {
     modern: isModern,
     disabled: isDateDisabled,
@@ -72,11 +60,9 @@ var Day = function Day(_a) {
     disabled: isDateDisabled
   };
   var modClasses = isModern ? modernClasses : classicClasses;
-
   var handleMouseLeave = function handleMouseLeave() {
     onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave();
   };
-
   return /*#__PURE__*/React.createElement("button", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     onClick: onClick,
     onKeyDown: onKeyDown,
@@ -92,22 +78,4 @@ var Day = function Day(_a) {
     })
   }, dayLabel));
 };
-
-Day.propTypes = {
-  dataAttrs: PropTypes.shape({
-    root: PropTypes.objectOf(PropTypes.string.isRequired)
-  }),
-  dayLabel: PropTypes.string,
-  date: PropTypes.instanceOf(Date).isRequired,
-  focusedDate: PropTypes.instanceOf(Date),
-  isModern: PropTypes.bool,
-  isDateSelected: PropTypes.func.isRequired,
-  isDateHovered: PropTypes.func.isRequired,
-  isFirstOrLastSelectedDate: PropTypes.func.isRequired,
-  isDateBlocked: PropTypes.func.isRequired,
-  isDateFocused: PropTypes.func.isRequired,
-  onDateHover: PropTypes.func.isRequired,
-  onDateSelect: PropTypes.func.isRequired,
-  onDateFocus: PropTypes.func.isRequired
-};
 export default Day;

package/dist/es/components/Calendar/components/_Month/Month.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-month{position:relative;z-index:1;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:28px 0;width:284px}.mfui-month,.mfui-month__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-month__header{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:20px;text-transform:capitalize;width:282px}.mfui-month__header svg{cursor:pointer;height:24.5px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;fill:var(--content)}.mfui-month__title{font-size:15px;font-weight:500;line-height:24px;text-align:center;width:224px}.mfui-month__weekday-labels{border-bottom:1px solid var(--spbSky1);-webkit-column-gap:22px;-moz-column-gap:22px;column-gap:22px;display:grid;grid-template-columns:repeat(7,1fr);padding-bottom:13px;width:272px}.mfui-month__weekday{color:var(--content);font-size:12px;font-weight:600;height:16px;line-height:18px;line-height:24px;text-align:center;text-transform:capitalize;width:20px}.mfui-month__days{-webkit-column-gap:0;-moz-column-gap:0;column-gap:0;display:grid;grid-template-columns:repeat(7,1fr);margin-top:8px;row-gap:0;width:284px}.mfui-month svg.mfui-month__arrow_disabled{cursor:default;opacity:.5}.mfui-month_modern{padding:0 0 24px;width:344px}.mfui-month_modern .mfui-month__header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-bottom:16px;text-transform:capitalize;width:328px}.mfui-month_modern .mfui-month__title{font-size:15px;font-weight:500;line-height:24px;margin:0 auto;text-align:center;width:224px}.mfui-month_modern .mfui-month__weekday-labels{border-bottom:none;-webkit-column-gap:8px;-moz-column-gap:8px;column-gap:8px;display:grid;grid-template-columns:repeat(7,1fr);padding-bottom:0;width:328px}.mfui-month_modern .mfui-month__weekday{color:var(--spbSky3);font-size:15px;font-weight:400;height:24px;line-height:24px;margin:0 auto;text-align:center;text-transform:capitalize;width:20px}.mfui-month_modern .mfui-month__days{-webkit-column-gap:0;-moz-column-gap:0;column-gap:0;display:grid;grid-template-columns:repeat(7,1fr);margin-top:10px;row-gap:0;width:328px}

package/dist/es/components/Calendar/components/{Month → _Month}/Month.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import * as React from 'react';
 import { FirstDayOfWeek, MonthType } from '@datepicker-react/hooks';
-import './Month.less';
+import './Month.scss';
 export interface IMonthPickerProps {
     firstDayOfWeek: FirstDayOfWeek;
     activeMonths: MonthType[];
@@ -21,6 +21,7 @@ export interface IMonthProps {
     goToPreviousMonth: () => void;
     goToNextMonth: () => void;
     isModern?: boolean;
+    children?: React.ReactNode;
 }
 declare const Month: React.FC<IMonthProps>;
 export default Month;