@alfalab/core-components 47.1.0 → 47.3.0

package/calendar/esm/Component.responsive.js

@@ -39,6 +39,10 @@ import 'date-fns/startOfWeek';
 import 'date-fns/startOfYear';
 import 'date-fns/subDays';
 import 'date-fns/subMonths';
+import './useRange.js';
+import './usePeriod.js';
+import 'date-fns/differenceInDays';
+import '@alfalab/hooks';
 import './components/days-table/Component.js';
 import 'react-transition-group';
 import 'date-fns/isEqual';
@@ -46,7 +50,6 @@ import 'date-fns/isLastDayOfMonth';
 import 'date-fns/isToday';
 import 'date-fns/isWithinInterval';
 import '../../button/esm/desktop';
-import '@alfalab/hooks';
 import './components/header/Component.js';
 import './components/month-year-header/Component.js';
 import '@alfalab/icons-glyph/ChevronDownCompactSIcon';
@@ -59,7 +62,6 @@ import '@alfalab/icons-glyph/ChevronBackMIcon';
 import './components/period-slider/utils.js';
 import 'date-fns/addQuarters';
 import 'date-fns/addWeeks';
-import 'date-fns/differenceInDays';
 import 'date-fns/endOfMonth';
 import 'date-fns/endOfQuarter';
 import 'date-fns/getQuarter';

package/calendar/esm/components/calendar-mobile/Component.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import React from 'react';
 import { CalendarContentProps } from "./typings";
-declare const CalendarMonthOnlyView: ({ value, month: monthTimestamp, minDate: minDateTimestamp, maxDate: maxDateTimestamp, defaultMonth: defaultMonthTimestamp, offDays, events, holidays, onChange, onMonthTitleClick, selectedFrom, selectedTo, yearsAmount, dayAddons, shape, scrollableContainer, }: CalendarContentProps) => React.JSX.Element;
+declare const CalendarMonthOnlyView: ({ value, mode, rangeBehavior, month: monthTimestamp, minDate: minDateTimestamp, maxDate: maxDateTimestamp, defaultMonth: defaultMonthTimestamp, offDays, events, holidays, onChange, onMonthTitleClick, selectedFrom, selectedTo, yearsAmount, dayAddons, shape, scrollableContainer, }: CalendarContentProps) => React.JSX.Element;
 declare const CalendarMonthOnlyViewHeader: () => React.JSX.Element;
 declare const CalendarMobile: React.ForwardRefExoticComponent<{
     title?: string | undefined;
@@ -14,5 +14,5 @@ declare const CalendarMobile: React.ForwardRefExoticComponent<{
     onMonthTitleClick?: ((event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void) | undefined;
     yearsAmount?: number | undefined;
     scrollableContainer?: HTMLElement | undefined;
-} & Omit<import("../../desktop/index").CalendarDesktopProps, ("contentClassName" | "headerClassName") | ("className" | "dataTestId" | "hasHeader" | "rangeComplete" | "responsive" | "onYearClick" | "showCurrentYearSelector" | "onPeriodClick" | "onMonthChange" | "defaultView" | "selectorView")> & Pick<import("../../desktop/index").CalendarDesktopProps, "className" | "dataTestId" | "hasHeader" | "rangeComplete" | "responsive" | "onYearClick" | "showCurrentYearSelector" | "onPeriodClick" | "onMonthChange" | "defaultView" | "selectorView"> & React.RefAttributes<HTMLDivElement>>;
+} & Omit<import("../../desktop/index").CalendarDesktopProps, ("className" | "dataTestId" | "hasHeader" | "defaultView" | "selectorView" | "rangeComplete" | "onMonthChange" | "onYearClick" | "onPeriodClick" | "responsive" | "showCurrentYearSelector") | ("contentClassName" | "headerClassName")> & Pick<import("../../desktop/index").CalendarDesktopProps, "className" | "dataTestId" | "hasHeader" | "defaultView" | "selectorView" | "rangeComplete" | "onMonthChange" | "onYearClick" | "onPeriodClick" | "responsive" | "showCurrentYearSelector"> & React.RefAttributes<HTMLDivElement>>;
 export { CalendarMonthOnlyView, CalendarMonthOnlyViewHeader, CalendarMobile };

package/calendar/esm/components/calendar-mobile/Component.js

@@ -1,5 +1,5 @@
 import { __rest, __spreadArray, __assign } from 'tslib';
-import React, { forwardRef, useState, useMemo } from 'react';
+import React, { forwardRef, useState, useMemo, useRef } from 'react';
 import mergeRefs from 'react-merge-refs';
 import { Virtuoso } from 'react-virtuoso';
 import { ResizeObserver } from '@juggle/resize-observer';
@@ -13,7 +13,8 @@ import { ModalMobile } from '../../../../modal/esm/mobile';
 import { getDataTestId } from '../../../../shared/esm';
 import { CalendarDesktop } from '../../desktop/Component.desktop.js';
 import { useCalendar } from '../../useCalendar.js';
-import { limitDate, dateArrayToHashTable, addonArrayToHashTable, generateMonths, generateWeeks, monthName, WEEKDAYS } from '../../utils.js';
+import { useRange } from '../../useRange.js';
+import { limitDate, dateArrayToHashTable, addonArrayToHashTable, generateMonths, generateWeeks, monthName, WEEKDAYS, isRangeValue } from '../../utils.js';
 import { DaysTable } from '../days-table/Component.js';
 import '@alfalab/hooks';
 import '../header/Component.js';
@@ -50,6 +51,7 @@ import 'date-fns/isThisYear';
 import 'date-fns/isSameDay';
 import 'date-fns/setYear';
 import 'date-fns/subYears';
+import '../../usePeriod.js';
 import 'date-fns/eachDayOfInterval';
 import 'date-fns/eachMonthOfInterval';
 import 'date-fns/eachYearOfInterval';
@@ -67,13 +69,13 @@ import 'date-fns/isEqual';
 import 'date-fns/isLastDayOfMonth';
 import 'date-fns/isWithinInterval';
 
-var backdropTransitionStyles = {"appear":"calendar__appear_sgdrm","enter":"calendar__enter_sgdrm","appearActive":"calendar__appearActive_sgdrm","enterActive":"calendar__enterActive_sgdrm","appearDone":"calendar__appearDone_sgdrm","enterDone":"calendar__enterDone_sgdrm","exit":"calendar__exit_sgdrm","exitActive":"calendar__exitActive_sgdrm","exitDone":"calendar__exitDone_sgdrm"};
+var backdropTransitionStyles = {"appear":"calendar__appear_1fn3h","enter":"calendar__enter_1fn3h","appearActive":"calendar__appearActive_1fn3h","enterActive":"calendar__enterActive_1fn3h","appearDone":"calendar__appearDone_1fn3h","enterDone":"calendar__enterDone_1fn3h","exit":"calendar__exit_1fn3h","exitActive":"calendar__exitActive_1fn3h","exitDone":"calendar__exitDone_1fn3h"};
 require('./backdrop-transitions.css');
 
-var styles = {"wrapper":"calendar__wrapper_z65ow","withZIndex":"calendar__withZIndex_z65ow","calendar":"calendar__calendar_z65ow","dayNames":"calendar__dayNames_z65ow","withHeader":"calendar__withHeader_z65ow","month":"calendar__month_z65ow","daysTable":"calendar__daysTable_z65ow","dayName":"calendar__dayName_z65ow","virtuoso":"calendar__virtuoso_z65ow","contentModal":"calendar__contentModal_z65ow","content":"calendar__content_z65ow"};
+var styles = {"wrapper":"calendar__wrapper_isahe","withZIndex":"calendar__withZIndex_isahe","calendar":"calendar__calendar_isahe","dayNames":"calendar__dayNames_isahe","withHeader":"calendar__withHeader_isahe","month":"calendar__month_isahe","daysTable":"calendar__daysTable_isahe","dayName":"calendar__dayName_isahe","virtuoso":"calendar__virtuoso_isahe","contentModal":"calendar__contentModal_isahe","content":"calendar__content_isahe"};
 require('./index.css');
 
-var transitionStyles = {"appear":"calendar__appear_yi39g","enter":"calendar__enter_yi39g","appearActive":"calendar__appearActive_yi39g","enterActive":"calendar__enterActive_yi39g","exit":"calendar__exit_yi39g","exitActive":"calendar__exitActive_yi39g","exitDone":"calendar__exitDone_yi39g"};
+var transitionStyles = {"appear":"calendar__appear_32zpp","enter":"calendar__enter_32zpp","appearActive":"calendar__appearActive_32zpp","enterActive":"calendar__enterActive_32zpp","exit":"calendar__exit_32zpp","exitActive":"calendar__exitActive_32zpp","exitDone":"calendar__exitDone_32zpp"};
 require('./transitions.css');
 
 // ResizeObserverPolyfill необходим для корректной работы react-virtuoso.
@@ -81,18 +83,25 @@ if (typeof window !== 'undefined' && !window.ResizeObserver) {
     window.ResizeObserver = ResizeObserver;
 }
 var CalendarMonthOnlyView = function (_a) {
-    var value = _a.value, monthTimestamp = _a.month, minDateTimestamp = _a.minDate, maxDateTimestamp = _a.maxDate, defaultMonthTimestamp = _a.defaultMonth, offDays = _a.offDays, events = _a.events, holidays = _a.holidays, onChange = _a.onChange, onMonthTitleClick = _a.onMonthTitleClick, selectedFrom = _a.selectedFrom, selectedTo = _a.selectedTo, _b = _a.yearsAmount, yearsAmount = _b === void 0 ? 3 : _b, dayAddons = _a.dayAddons, _c = _a.shape, shape = _c === void 0 ? 'rounded' : _c, scrollableContainer = _a.scrollableContainer;
+    var value = _a.value, _b = _a.mode, mode = _b === void 0 ? 'single' : _b, _c = _a.rangeBehavior, rangeBehavior = _c === void 0 ? 'clarification' : _c, monthTimestamp = _a.month, minDateTimestamp = _a.minDate, maxDateTimestamp = _a.maxDate, defaultMonthTimestamp = _a.defaultMonth, offDays = _a.offDays, events = _a.events, holidays = _a.holidays, onChange = _a.onChange, onMonthTitleClick = _a.onMonthTitleClick, selectedFrom = _a.selectedFrom, selectedTo = _a.selectedTo, _d = _a.yearsAmount, yearsAmount = _d === void 0 ? 3 : _d, dayAddons = _a.dayAddons, _e = _a.shape, shape = _e === void 0 ? 'rounded' : _e, scrollableContainer = _a.scrollableContainer;
+    var range = useRange({
+        mode: mode,
+        value: value,
+        selectedFrom: selectedFrom,
+        selectedTo: selectedTo,
+        rangeBehavior: rangeBehavior,
+        onChange: onChange,
+    });
     var month = useMemo(function () { return (monthTimestamp ? new Date(monthTimestamp) : undefined); }, [monthTimestamp]);
     var minDate = useMemo(function () { return (minDateTimestamp ? startOfDay(minDateTimestamp) : undefined); }, [minDateTimestamp]);
     var maxDate = useMemo(function () { return (maxDateTimestamp ? endOfDay(maxDateTimestamp) : undefined); }, [maxDateTimestamp]);
-    var selected = useMemo(function () { return (value ? new Date(value) : undefined); }, [value]);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    var startingDate = useMemo(function () { return (value ? new Date(value) : new Date()); }, []);
+    var selected = useMemo(function () { return (range.value ? new Date(range.value) : undefined); }, [range.value]);
+    var startingDate = useRef(range.value);
     var defaultMonth = useMemo(function () {
         return startOfMonth(selected ||
             limitDate(defaultMonthTimestamp || Date.now(), minDateTimestamp, maxDateTimestamp));
     }, [defaultMonthTimestamp, maxDateTimestamp, minDateTimestamp, selected]);
-    var _d = useCalendar({
+    var _f = useCalendar({
         month: month,
         defaultMonth: defaultMonth,
         view: 'months',
@@ -101,9 +110,9 @@ var CalendarMonthOnlyView = function (_a) {
         selected: selected,
         offDays: offDays,
         events: events,
-        onChange: onChange,
+        onChange: range.onChange,
         dayAddons: dayAddons,
-    }), activeMonth = _d.activeMonth, highlighted = _d.highlighted, getDayProps = _d.getDayProps;
+    }), activeMonth = _f.activeMonth, highlighted = _f.highlighted, getDayProps = _f.getDayProps;
     var activeMonths = useMemo(function () {
         var eventsMap = dateArrayToHashTable(events || []);
         var offDaysMap = dateArrayToHashTable(offDays || []);
@@ -111,7 +120,7 @@ var CalendarMonthOnlyView = function (_a) {
         var dayAddonsMap = addonArrayToHashTable(dayAddons || []);
         var prevMonths = [];
         var nextMonths = [];
-        var date = new Date(startingDate.getTime());
+        var date = startingDate.current ? new Date(startingDate.current) : new Date();
         var currentYear = date.getFullYear();
         var currYearMonths = generateMonths(date, {});
         for (var i = 0; i < yearsAmount; i++) {
@@ -132,21 +141,11 @@ var CalendarMonthOnlyView = function (_a) {
                 holidaysMap: holidaysMap,
                 dayAddonsMap: dayAddonsMap,
             }), title: "".concat(monthName(item.date), " ").concat(item.date.getFullYear()) })); });
-    }, [
-        events,
-        offDays,
-        holidays,
-        dayAddons,
-        startingDate,
-        minDate,
-        maxDate,
-        yearsAmount,
-        selected,
-    ]);
+    }, [events, offDays, holidays, dayAddons, minDate, maxDate, yearsAmount, selected]);
     var initialMonthIndex = useMemo(function () {
-        var date = value || selectedFrom || activeMonth.getTime() || Date.now();
+        var date = range.value || range.selectedFrom || activeMonth.getTime() || Date.now();
         return activeMonths.findIndex(function (m) { return isSameMonth(date, m.date); });
-    }, [activeMonth, activeMonths, selectedFrom, value]);
+    }, [range.value, range.selectedFrom, activeMonth, activeMonths]);
     var renderMonth = function (index) { return (React.createElement("div", { className: styles.daysTable, id: "month-".concat(index) },
         onMonthTitleClick ? (
         /* eslint-disable-next-line jsx-a11y/click-events-have-key-events */
@@ -154,7 +153,7 @@ var CalendarMonthOnlyView = function (_a) {
             " ",
             activeMonths[index].title,
             " ")),
-        React.createElement(DaysTable, { withTransition: false, weeks: activeMonths[index].weeks, activeMonth: activeMonth, selectedFrom: selectedFrom, selectedTo: selectedTo, getDayProps: getDayProps, highlighted: highlighted, hasHeader: false, responsive: true, shape: shape }))); };
+        React.createElement(DaysTable, { withTransition: false, weeks: activeMonths[index].weeks, activeMonth: activeMonth, selectedFrom: range.selectedFrom, selectedTo: range.selectedTo, getDayProps: getDayProps, highlighted: highlighted, hasHeader: false, responsive: true, shape: shape }))); };
     return (React.createElement(Virtuoso, { totalCount: activeMonths.length, itemContent: renderMonth, initialTopMostItemIndex: { index: initialMonthIndex !== null && initialMonthIndex !== void 0 ? initialMonthIndex : 0, align: 'center' }, increaseViewportBy: 500, itemSize: function (el) { return el.getBoundingClientRect().height + 32; }, customScrollParent: scrollableContainer, useWindowScroll: true, className: styles.virtuoso }));
 };
 var CalendarMonthOnlyViewHeader = function () { return (React.createElement("table", { className: styles.dayNames },
@@ -193,10 +192,12 @@ var CalendarMobile = forwardRef(function (_a, ref) {
         return (React.createElement(CalendarDesktop, __assign({ responsive: true, className: cn(className, styles.calendar), contentClassName: styles.content, dataTestId: getDataTestId(dataTestId, 'mobile') }, commonProps, restProps)));
     };
     var renderFooter = function () {
-        if (selectedFrom || selectedTo) {
-            var selectButtonDisabled = !selectedFrom || !selectedTo;
+        var valueFrom = isRangeValue(value) ? value.dateFrom : selectedFrom;
+        var valueTo = isRangeValue(value) ? value.dateTo : selectedTo;
+        if (valueFrom || valueTo) {
+            var selectButtonDisabled = !valueFrom || !valueTo;
             if (allowSelectionFromEmptyRange) {
-                selectButtonDisabled = !selectedFrom;
+                selectButtonDisabled = !valueFrom;
             }
             return (React.createElement(React.Fragment, null,
                 React.createElement(ButtonMobile, { view: 'secondary', size: 'm', block: true, onClick: handleClear, dataTestId: getDataTestId(dataTestId, 'btn-reset') }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C"),

package/calendar/esm/components/calendar-mobile/backdrop-transitions.css

@@ -15,19 +15,19 @@
 } :root {
 } :root {
 } :root {
-} .calendar__appear_sgdrm,
-.calendar__enter_sgdrm {
+} .calendar__appear_1fn3h,
+.calendar__enter_1fn3h {
     background-color: transparent;
-} .calendar__appearActive_sgdrm,
-.calendar__enterActive_sgdrm,
-.calendar__appearDone_sgdrm,
-.calendar__enterDone_sgdrm {
+} .calendar__appearActive_1fn3h,
+.calendar__enterActive_1fn3h,
+.calendar__appearDone_1fn3h,
+.calendar__enterDone_1fn3h {
     background-color: var(--color-light-neutral-translucent-300);
     transition: background-color 80ms linear;
-} .calendar__exit_sgdrm {
+} .calendar__exit_1fn3h {
     background-color: var(--color-light-neutral-translucent-300);
-} .calendar__exitActive_sgdrm,
-.calendar__exitDone_sgdrm {
+} .calendar__exitActive_1fn3h,
+.calendar__exitDone_1fn3h {
     background-color: transparent;
     transition: background-color 80ms linear;
     transition-delay: 280ms;

package/calendar/esm/components/calendar-mobile/index.css

@@ -57,26 +57,26 @@
     /* mobile */
 
     /* paddings */
-} .calendar__wrapper_z65ow {
+} .calendar__wrapper_isahe {
     overflow-x: hidden;
-} .calendar__withZIndex_z65ow {
+} .calendar__withZIndex_isahe {
     z-index: 2;
-} .calendar__calendar_z65ow.calendar__calendar_z65ow {
+} .calendar__calendar_isahe.calendar__calendar_isahe {
     height: 100%;
-} .calendar__calendar_z65ow th {
+} .calendar__calendar_isahe th {
     border-bottom: 1px solid var(--color-light-neutral-300);
-} .calendar__dayNames_z65ow {
+} .calendar__dayNames_isahe {
     width: 100%;
     position: sticky;
     background: var(--modal-header-background);
     top: 0;
     height: 32px;
     padding: 0 6px
-} .calendar__dayNames_z65ow.calendar__withHeader_z65ow {
+} .calendar__dayNames_isahe.calendar__withHeader_isahe {
         top: 48px;
-    } .calendar__dayNames_z65ow th {
+    } .calendar__dayNames_isahe th {
     height: 100%;
-} .calendar__month_z65ow {
+} .calendar__month_isahe {
     font-style: normal;
     font-weight: 700;
     font-size: 12px;
@@ -85,25 +85,25 @@
     text-transform: uppercase;
     color: var(--color-light-text-primary);
     margin-bottom: var(--gap-xs);
-} .calendar__daysTable_z65ow {
+} .calendar__daysTable_isahe {
     display: flex;
     flex-direction: column;
     margin-top: var(--gap-2xl);
-} .calendar__dayName_z65ow {
+} .calendar__dayName_isahe {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
 
     height: var(--calendar-day-size);
     color: var(--color-light-text-secondary)
-} @media (max-width: 374px) { .calendar__dayName_z65ow {
+} @media (max-width: 374px) { .calendar__dayName_isahe {
         height: 36px
 }
-    } .calendar__virtuoso_z65ow {
+    } .calendar__virtuoso_isahe {
     margin: 0 var(--gap-m);
-} .calendar__contentModal_z65ow {
+} .calendar__contentModal_isahe {
     padding-right: 0;
     padding-left: 0;
-} .calendar__content_z65ow.calendar__content_z65ow {
+} .calendar__content_isahe.calendar__content_isahe {
     flex-basis: 0;
 }

package/calendar/esm/components/calendar-mobile/index.js

@@ -67,3 +67,5 @@ import 'date-fns/isThisYear';
 import '../../useCalendar.js';
 import 'date-fns/setYear';
 import 'date-fns/subYears';
+import '../../useRange.js';
+import '../../usePeriod.js';

package/calendar/esm/components/calendar-mobile/transitions.css

@@ -14,18 +14,18 @@
 } :root {
 } :root {
 } :root {
-} .calendar__appear_yi39g,
-.calendar__enter_yi39g {
+} .calendar__appear_32zpp,
+.calendar__enter_32zpp {
     transform: translateX(100%);
-} .calendar__appearActive_yi39g,
-.calendar__enterActive_yi39g {
+} .calendar__appearActive_32zpp,
+.calendar__enterActive_32zpp {
     transform: translateX(0);
     transition: transform 280ms ease-in-out;
     transition-delay: 80ms;
-} .calendar__exit_yi39g {
+} .calendar__exit_32zpp {
     transform: translateX(0);
-} .calendar__exitActive_yi39g,
-.calendar__exitDone_yi39g {
+} .calendar__exitActive_32zpp,
+.calendar__exitDone_32zpp {
     transform: translateX(100%);
     transition: transform 280ms ease-in-out;
 }

package/calendar/esm/components/days-table/Component.js

@@ -33,7 +33,7 @@ import 'date-fns/subDays';
 import 'date-fns/subMonths';
 import '../../../../shared/esm';
 
-var styles = {"daysTable":"calendar__daysTable_gwyhu","responsive":"calendar__responsive_gwyhu","dayName":"calendar__dayName_gwyhu","day":"calendar__day_gwyhu","rounded":"calendar__rounded_gwyhu","rectangular":"calendar__rectangular_gwyhu","highlighted":"calendar__highlighted_gwyhu","range":"calendar__range_gwyhu","disabled":"calendar__disabled_gwyhu","holiday":"calendar__holiday_gwyhu","today":"calendar__today_gwyhu","rangeComplete":"calendar__rangeComplete_gwyhu","selected":"calendar__selected_gwyhu","dayWrapper":"calendar__dayWrapper_gwyhu","cursorPointer":"calendar__cursorPointer_gwyhu","rangeEnd":"calendar__rangeEnd_gwyhu","rangeStart":"calendar__rangeStart_gwyhu","transitLeft":"calendar__transitLeft_gwyhu","transitRight":"calendar__transitRight_gwyhu","sharpTransitLeft":"calendar__sharpTransitLeft_gwyhu","sharpTransitRight":"calendar__sharpTransitRight_gwyhu","daysEnter":"calendar__daysEnter_gwyhu","left":"calendar__left_gwyhu","daysEnterActive":"calendar__daysEnterActive_gwyhu","daysExit":"calendar__daysExit_gwyhu","daysExitActive":"calendar__daysExitActive_gwyhu","right":"calendar__right_gwyhu","dayAddons":"calendar__dayAddons_gwyhu","dayContent":"calendar__dayContent_gwyhu","addons":"calendar__addons_gwyhu","dot":"calendar__dot_gwyhu","bottomAddon":"calendar__bottomAddon_gwyhu"};
+var styles = {"daysTable":"calendar__daysTable_1srcu","responsive":"calendar__responsive_1srcu","dayName":"calendar__dayName_1srcu","day":"calendar__day_1srcu","rounded":"calendar__rounded_1srcu","rectangular":"calendar__rectangular_1srcu","highlighted":"calendar__highlighted_1srcu","range":"calendar__range_1srcu","disabled":"calendar__disabled_1srcu","holiday":"calendar__holiday_1srcu","today":"calendar__today_1srcu","rangeComplete":"calendar__rangeComplete_1srcu","selected":"calendar__selected_1srcu","dayWrapper":"calendar__dayWrapper_1srcu","cursorPointer":"calendar__cursorPointer_1srcu","rangeEnd":"calendar__rangeEnd_1srcu","rangeStart":"calendar__rangeStart_1srcu","transitLeft":"calendar__transitLeft_1srcu","transitRight":"calendar__transitRight_1srcu","sharpTransitLeft":"calendar__sharpTransitLeft_1srcu","sharpTransitRight":"calendar__sharpTransitRight_1srcu","daysEnter":"calendar__daysEnter_1srcu","left":"calendar__left_1srcu","daysEnterActive":"calendar__daysEnterActive_1srcu","daysExit":"calendar__daysExit_1srcu","daysExitActive":"calendar__daysExitActive_1srcu","right":"calendar__right_1srcu","dayAddons":"calendar__dayAddons_1srcu","dayContent":"calendar__dayContent_1srcu","addons":"calendar__addons_1srcu","dot":"calendar__dot_1srcu","bottomAddon":"calendar__bottomAddon_1srcu"};
 require('./index.css');
 
 var DaysTable = function (_a) {

package/calendar/esm/components/days-table/index.css

@@ -70,27 +70,27 @@
     /* marker */
     --calendar-marker-background: var(--color-light-neutral-translucent-1300);
     --calendar-marker-selected-background: var(--color-light-neutral-translucent-1300-inverted);
-} .calendar__daysTable_gwyhu {
+} .calendar__daysTable_1srcu {
     border-collapse: separate;
     border-spacing: 0;
     position: relative
-} .calendar__daysTable_gwyhu.calendar__responsive_gwyhu {
+} .calendar__daysTable_1srcu.calendar__responsive_1srcu {
         width: 100%;
-    } .calendar__daysTable_gwyhu th {
+    } .calendar__daysTable_1srcu th {
         padding: 0;
-    } .calendar__daysTable_gwyhu td {
+    } .calendar__daysTable_1srcu td {
         padding: var(--gap-2xs) 0 0;
-    } .calendar__dayName_gwyhu {
+    } .calendar__dayName_1srcu {
     font-size: 14px;
     line-height: 20px;
     font-weight: 400;
 
     height: var(--calendar-day-size);
     color: var(--color-light-text-secondary)
-} @media (max-width: 374px) { .calendar__dayName_gwyhu {
+} @media (max-width: 374px) { .calendar__dayName_1srcu {
         height: 36px
 }
-    } .calendar__day_gwyhu {
+    } .calendar__day_1srcu {
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 
     position: relative;
@@ -103,41 +103,41 @@
     box-sizing: border-box;
     color: var(--color-light-text-primary);
     z-index: 1
-} .calendar__day_gwyhu.calendar__rounded_gwyhu {
+} .calendar__day_1srcu.calendar__rounded_1srcu {
         border-radius: var(--calendar-day-border-radius);
-    } .calendar__day_gwyhu.calendar__rectangular_gwyhu {
+    } .calendar__day_1srcu.calendar__rectangular_1srcu {
         border-radius: var(--border-radius-m);
         width: 44px;
-    } .calendar__day_gwyhu.calendar__highlighted_gwyhu,
-    .calendar__day_gwyhu.calendar__range_gwyhu.calendar__highlighted_gwyhu:not(.calendar__disabled_gwyhu) {
+    } .calendar__day_1srcu.calendar__highlighted_1srcu,
+    .calendar__day_1srcu.calendar__range_1srcu.calendar__highlighted_1srcu:not(.calendar__disabled_1srcu) {
         color: var(--calendar-highlighted-color);
         background: var(--calendar-highlighted-background);
-    } .calendar__day_gwyhu.calendar__holiday_gwyhu {
+    } .calendar__day_1srcu.calendar__holiday_1srcu {
         color: var(--calendar-holiday-color);
-    } .calendar__day_gwyhu.calendar__disabled_gwyhu {
+    } .calendar__day_1srcu.calendar__disabled_1srcu {
         pointer-events: none;
         color: var(--calendar-disabled-color);
 
         background: var(--calendar-disabled-background);
         cursor: default;
-    } .calendar__day_gwyhu.calendar__today_gwyhu {
+    } .calendar__day_1srcu.calendar__today_1srcu {
         color: var(--calendar-today-color);
-    } .calendar__day_gwyhu.calendar__rangeComplete_gwyhu {
+    } .calendar__day_1srcu.calendar__rangeComplete_1srcu {
         background: var(--calendar-range-complete-background);
-    } .calendar__day_gwyhu.calendar__selected_gwyhu,
-    .calendar__day_gwyhu.calendar__disabled_gwyhu.calendar__selected_gwyhu {
+    } .calendar__day_1srcu.calendar__selected_1srcu,
+    .calendar__day_1srcu.calendar__disabled_1srcu.calendar__selected_1srcu {
         color: var(--calendar-selected-color);
         background: var(--calendar-selected-background);
     } @media (hover) {
-            .calendar__day_gwyhu.calendar__selected_gwyhu:hover {
+            .calendar__day_1srcu.calendar__selected_1srcu:hover {
                 background: var(--calendar-selected-hover-background);
             }
-        } .calendar__day_gwyhu:focus {
+        } .calendar__day_1srcu:focus {
         z-index: 1;
-    } /* RANGE */ .calendar__dayWrapper_gwyhu {
+    } /* RANGE */ .calendar__dayWrapper_1srcu {
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     position: relative
-} .calendar__dayWrapper_gwyhu:before {
+} .calendar__dayWrapper_1srcu:before {
         content: '';
         display: block;
         position: absolute;
@@ -145,27 +145,27 @@
         bottom: 0;
         width: 100%;
         height: var(--calendar-day-size);
-    } .calendar__dayWrapper_gwyhu:focus {
+    } .calendar__dayWrapper_1srcu:focus {
         outline: none;
-    } .calendar__dayWrapper_gwyhu.calendar__cursorPointer_gwyhu {
+    } .calendar__dayWrapper_1srcu.calendar__cursorPointer_1srcu {
         cursor: pointer;
-    } .calendar__range_gwyhu .calendar__day_gwyhu:not(.calendar__selected_gwyhu):not(.calendar__disabled_gwyhu):not(.calendar__today_gwyhu):not(.calendar__holiday_gwyhu) {
+    } .calendar__range_1srcu .calendar__day_1srcu:not(.calendar__selected_1srcu):not(.calendar__disabled_1srcu):not(.calendar__today_1srcu):not(.calendar__holiday_1srcu) {
         color: var(--calendar-range-color);
-    } .calendar__range_gwyhu:before {
+    } .calendar__range_1srcu:before {
         background: var(--calendar-range-background);
-    } .calendar__rangeEnd_gwyhu:before {
+    } .calendar__rangeEnd_1srcu:before {
         width: calc(50% + 20px);
         border-top-right-radius: var(--calendar-day-border-radius);
         border-bottom-right-radius: var(--calendar-day-border-radius);
-    } .calendar__rangeStart_gwyhu:before {
+    } .calendar__rangeStart_1srcu:before {
         left: auto;
         right: 0;
         width: calc(50% + 20px);
         border-top-left-radius: var(--calendar-day-border-radius);
         border-bottom-left-radius: var(--calendar-day-border-radius);
-    } .calendar__rangeComplete_gwyhu:before {
+    } .calendar__rangeComplete_1srcu:before {
         background: var(--calendar-range-complete-background);
-    } .calendar__transitLeft_gwyhu:after, .calendar__transitRight_gwyhu:after {
+    } .calendar__transitLeft_1srcu:after, .calendar__transitRight_1srcu:after {
         content: '';
         position: absolute;
         display: block;
@@ -173,81 +173,81 @@
         height: var(--calendar-day-size);
         bottom: 0;
         pointer-events: none;
-    } .calendar__transitLeft_gwyhu:after {
+    } .calendar__transitLeft_1srcu:after {
         right: 100%;
         background: linear-gradient(
             270deg,
             var(--calendar-range-background) 0%,
             var(--color-light-transparent-default) 100%
         );
-    } .calendar__transitLeft_gwyhu:first-child:before {
+    } .calendar__transitLeft_1srcu:first-child:before {
             opacity: 0;
-        } .calendar__transitLeft_gwyhu:first-child:after {
+        } .calendar__transitLeft_1srcu:first-child:after {
             right: 0;
-        } .calendar__transitRight_gwyhu:after {
+        } .calendar__transitRight_1srcu:after {
         left: 100%;
         background: linear-gradient(
             270deg,
             var(--color-light-transparent-default) 0%,
             var(--calendar-range-background) 100%
         );
-    } .calendar__transitRight_gwyhu:last-child:before {
+    } .calendar__transitRight_1srcu:last-child:before {
             opacity: 0;
-        } .calendar__transitRight_gwyhu:last-child:after {
+        } .calendar__transitRight_1srcu:last-child:after {
             left: 0;
-        } .calendar__sharpTransitLeft_gwyhu:first-child:before {
+        } .calendar__sharpTransitLeft_1srcu:first-child:before {
             opacity: 1;
-        } .calendar__sharpTransitLeft_gwyhu:first-child:after {
+        } .calendar__sharpTransitLeft_1srcu:first-child:after {
             opacity: 0;
-        } .calendar__sharpTransitRight_gwyhu:last-child:before {
+        } .calendar__sharpTransitRight_1srcu:last-child:before {
             opacity: 1;
-        } .calendar__sharpTransitRight_gwyhu:last-child:after {
+        } .calendar__sharpTransitRight_1srcu:last-child:after {
             opacity: 0;
-        } .calendar__rangeComplete_gwyhu.calendar__transitLeft_gwyhu:after {
+        } .calendar__rangeComplete_1srcu.calendar__transitLeft_1srcu:after {
         background: linear-gradient(
             270deg,
             var(--calendar-range-complete-background) 0%,
             var(--color-light-transparent-default) 100%
         );
-    } .calendar__rangeComplete_gwyhu.calendar__transitRight_gwyhu:after {
+    } .calendar__rangeComplete_1srcu.calendar__transitRight_1srcu:after {
         background: linear-gradient(
             270deg,
             var(--color-light-transparent-default) 0%,
             var(--calendar-range-complete-background) 100%
         );
-    } /* SLIDE ANIMATION */ .calendar__daysEnter_gwyhu .calendar__dayWrapper_gwyhu {
+    } /* SLIDE ANIMATION */ .calendar__daysEnter_1srcu .calendar__dayWrapper_1srcu {
     width: 100px;
-} .calendar__left_gwyhu .calendar__daysEnter_gwyhu {
+} .calendar__left_1srcu .calendar__daysEnter_1srcu {
         transform: translateX(50px);
-    } .calendar__left_gwyhu .calendar__daysEnterActive_gwyhu {
+    } .calendar__left_1srcu .calendar__daysEnterActive_1srcu {
         transform: translateX(0);
-    } .calendar__left_gwyhu .calendar__daysExit_gwyhu {
+    } .calendar__left_1srcu .calendar__daysExit_1srcu {
         transform: translateX(0);
-    } .calendar__left_gwyhu .calendar__daysExitActive_gwyhu {
+    } .calendar__left_1srcu .calendar__daysExitActive_1srcu {
         transform: translateX(-50px);
-    } .calendar__right_gwyhu .calendar__daysEnter_gwyhu {
+    } .calendar__right_1srcu .calendar__daysEnter_1srcu {
         transform: translateX(-50px);
-    } .calendar__right_gwyhu .calendar__daysEnterActive_gwyhu {
+    } .calendar__right_1srcu .calendar__daysEnterActive_1srcu {
         transform: translateX(0);
-    } .calendar__right_gwyhu .calendar__daysExit_gwyhu {
+    } .calendar__right_1srcu .calendar__daysExit_1srcu {
         transform: translateX(0);
-    } .calendar__right_gwyhu .calendar__daysExitActive_gwyhu {
+    } .calendar__right_1srcu .calendar__daysExitActive_1srcu {
         transform: translateX(50px);
-    } .calendar__dayAddons_gwyhu > span {
+    } .calendar__dayAddons_1srcu > span {
         display: flex;
         flex-direction: column;
         justify-content: flex-end;
         height: inherit;
         padding: 0 var(--gap-3xs);
-    } .calendar__dayContent_gwyhu {
+    } .calendar__dayContent_1srcu {
     font-size: 16px;
     line-height: 24px;
     font-weight: 400
-} .calendar__dayContent_gwyhu.calendar__today_gwyhu {
+} .calendar__dayContent_1srcu.calendar__today_1srcu {
         font-weight: bold;
-    } .calendar__addons_gwyhu {
+    } .calendar__addons_1srcu {
     min-height: 8px;
-} .calendar__dot_gwyhu {
+} .calendar__dot_1srcu {
     display: block;
     position: absolute;
     bottom: 4px;
@@ -257,25 +257,25 @@
     transform: translateX(-50%);
     border-radius: var(--border-radius-circle);
     background: var(--calendar-marker-background);
-} .calendar__selected_gwyhu .calendar__dot_gwyhu {
+} .calendar__selected_1srcu .calendar__dot_1srcu {
     background: var(--calendar-marker-selected-background);
-} .calendar__daysEnter_gwyhu {
+} .calendar__daysEnter_1srcu {
     opacity: 0;
     position: absolute;
     left: 0;
-} .calendar__daysEnterActive_gwyhu {
+} .calendar__daysEnterActive_1srcu {
     opacity: 1;
-} .calendar__daysExit_gwyhu {
+} .calendar__daysExit_1srcu {
     pointer-events: none;
     opacity: 1;
-} .calendar__daysExitActive_gwyhu {
+} .calendar__daysExitActive_1srcu {
     opacity: 0;
-} .calendar__daysEnterActive_gwyhu,
-.calendar__daysExitActive_gwyhu {
+} .calendar__daysEnterActive_1srcu,
+.calendar__daysExitActive_1srcu {
     transition: opacity 200ms, transform 300ms;
-} .calendar__bottomAddon_gwyhu {
+} .calendar__bottomAddon_1srcu {
     margin: 0 auto
-} .calendar__bottomAddon_gwyhu.calendar__selected_gwyhu,
-    .calendar__bottomAddon_gwyhu.calendar__selected_gwyhu > * {
+} .calendar__bottomAddon_1srcu.calendar__selected_1srcu,
+    .calendar__bottomAddon_1srcu.calendar__selected_1srcu > * {
         color: var(--calendar-selected-color);
     }

package/calendar/esm/components/header/Component.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"header":"calendar__header_nyw10","withShadow":"calendar__withShadow_nyw10"};
+var styles = {"header":"calendar__header_7zz3d","withShadow":"calendar__withShadow_7zz3d"};
 require('./index.css');
 
 var Header = function (_a) {

package/calendar/esm/components/header/index.css

@@ -38,13 +38,13 @@
     /* disabled */
 
     /* marker */
-} .calendar__header_nyw10 {
+} .calendar__header_7zz3d {
     width: 100%;
     box-sizing: border-box;
     padding: var(--gap-m) var(--gap-m) var(--gap-s);
     transition: box-shadow 0.2s ease;
     display: flex;
     justify-content: center;
-} .calendar__withShadow_nyw10 {
+} .calendar__withShadow_7zz3d {
     box-shadow: 0 1px 0 0 var(--color-light-neutral-300);
 }