@megafon/ui-core 6.4.3 → 6.5.0

package/dist/es/components/Banner/Banner.css

@@ -154,6 +154,9 @@
     bottom: 72px;
   }
 }
+.mfui-v6-banner_margin-top {
+  margin-top: 24px;
+}
 .mfui-v6-banner_radius_rounded .mfui-v6-banner__swiper {
   border-radius: 24px;
 }

package/dist/es/components/Banner/Banner.d.ts

@@ -69,6 +69,8 @@ export interface IBannerProps {
     noIncreaseAutoplayDelay?: boolean;
     /** Показать часть следующего слайда */
     showNextSlide?: boolean;
+    /** Отступ сверху */
+    hasMarginTop?: boolean;
     /** Ref на swiper */
     getSwiper?: (instance: SwiperCore) => void;
     /** Обработчик клика по стрелке "вперед" (должен быть обернут в useCallback) */

package/dist/es/components/Banner/Banner.js

@@ -66,6 +66,8 @@ var Banner = function Banner(_ref) {
       autoHeight = _ref$autoHeight === void 0 ? false : _ref$autoHeight,
       noIncreaseAutoplayDelay = _ref.noIncreaseAutoplayDelay,
       showNextSlide = _ref.showNextSlide,
+      _ref$hasMarginTop = _ref.hasMarginTop,
+      hasMarginTop = _ref$hasMarginTop === void 0 ? false : _ref$hasMarginTop,
       _ref$children = _ref.children,
       children = _ref$children === void 0 ? [] : _ref$children,
       getSwiper = _ref.getSwiper,
@@ -268,7 +270,8 @@ var Banner = function Banner(_ref) {
       'background-color': backgroundColor,
       'no-touch': !isTouch,
       radius: radius,
-      'show-next-slide': showNextSlide
+      'show-next-slide': showNextSlide,
+      'margin-top': hasMarginTop
     }, className),
     ref: rootRef
   }), /*#__PURE__*/React.createElement("div", {
@@ -330,6 +333,7 @@ Banner.propTypes = {
   noIncreaseAutoplayDelay: PropTypes.bool,
   showNextSlide: PropTypes.bool,
   getSwiper: PropTypes.func,
+  hasMarginTop: PropTypes.bool,
   onNextClick: PropTypes.func,
   onPrevClick: PropTypes.func,
   onDotClick: PropTypes.func,

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

@@ -5,16 +5,15 @@
 }
 .mfui-v6-calendar_modern {
   display: block;
-  width: 364px;
+  width: 100%;
   height: 304px;
   overflow-x: hidden;
   overflow-y: scroll;
 }
 .mfui-v6-calendar_modern::-webkit-scrollbar {
-  width: 16px;
+  width: 4px;
 }
 .mfui-v6-calendar_modern::-webkit-scrollbar-thumb {
-  border: 6px solid transparent;
   border-radius: 16px;
   background-color: #D8D8D8;
   background-clip: padding-box;

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

@@ -366,14 +366,14 @@ var Calendar = function Calendar(_ref) {
       var isNextMonthDisabled = !!maxBookingDate && isSameMonth(new Date(year, month, 1), maxBookingDate);
       var isCurrentMonth = new Date().getFullYear() === year && new Date().getMonth() === month;
       return /*#__PURE__*/React.createElement("div", {
-        ref: isCurrentMonth ? currentMonthRef : null
+        ref: isCurrentMonth ? currentMonthRef : null,
+        key: "".concat(year, "-").concat(month)
       }, /*#__PURE__*/React.createElement(Month, {
         dataAttrs: {
           root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.month,
           arrowLeft: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrowLeft,
           arrowRight: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrowRight
         },
-        key: "".concat(year, "-").concat(month),
         year: year,
         weekdayLabels: weekdayLabels,
         monthLabel: monthLabel,

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

@@ -45,7 +45,10 @@
   width: 38px;
   height: 38px;
 }
-.mfui-v6-day_active-modern:hover:after {
+.mfui-v6-day_active-modern:hover:after,
+.mfui-v6-day_active-modern:focus:after {
+  width: 38px !important;
+  height: 38px !important;
   background-color: var(--brandGreen) !important;
 }
 .mfui-v6-day:not(:disabled):not(.mfui-v6-day_active):hover:after {
@@ -67,7 +70,7 @@
 .mfui-v6-day:not(:disabled):not(.mfui-v6-day_active):focus {
   color: var(--stcWhite);
 }
-.mfui-v6-day_active + .mfui-v6-day_active:before,
+.mfui-v6-day_active + .mfui-v6-day:not(.mfui-v6-day_monday).mfui-v6-day_active:before,
 .mfui-v6-day_between:hover + .mfui-v6-day:not(.mfui-v6-day_monday).mfui-v6-day_active:before {
   content: '';
   position: absolute;
@@ -137,7 +140,7 @@
   z-index: 99;
 }
 .mfui-v6-day_modern {
-  width: 38.29px;
+  width: 100%;
   height: 38px;
 }
 .mfui-v6-day_modern:not(:disabled):not(.mfui-v6-day_modern_active-modern):hover:after,
@@ -166,7 +169,7 @@
 .mfui-v6-day:not(:disabled):focus {
   color: var(--stcWhite);
 }
-.mfui-v6-day_active-modern + .mfui-v6-day_active-modern:before,
+.mfui-v6-day_active-modern + .mfui-v6-day:not(.mfui-v6-day_monday-modern).mfui-v6-day_active-modern:before,
 .mfui-v6-day_between-modern:hover + .mfui-v6-day:not(.mfui-v6-day_monday-modern).mfui-v6-day_active-modern:before {
   content: '';
   position: absolute;
@@ -186,7 +189,7 @@
   content: '';
   position: absolute;
   top: 0;
-  left: -28px;
+  left: -20px;
   z-index: -1;
   display: block;
   height: 38px;
@@ -197,7 +200,7 @@
   content: '';
   position: absolute;
   top: 0;
-  right: -18px;
+  right: -12px;
   z-index: -1;
   display: block;
   width: 45px;
@@ -210,7 +213,7 @@
 }
 .mfui-v6-day_sunday-modern:before,
 .mfui-v6-day_last-modern:before {
-  padding-left: 20px;
+  padding-left: 8px;
 }
 .mfui-v6-day_sunday-modern:after,
 .mfui-v6-day_last-modern:after {

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

@@ -80,8 +80,8 @@ svg.mfui-v6-month__arrow_disabled {
   opacity: 0.5;
 }
 .mfui-v6-month_modern {
-  width: 344px;
-  padding: 0 0 24px;
+  width: 100%;
+  padding: 0 16px 24px 0;
 }
 .mfui-v6-month_modern .mfui-v6-month__header {
   display: -webkit-box;
@@ -90,7 +90,7 @@ svg.mfui-v6-month__arrow_disabled {
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
-  width: 328px;
+  width: 100%;
   margin-bottom: 16px;
   text-transform: capitalize;
 }
@@ -105,7 +105,7 @@ svg.mfui-v6-month__arrow_disabled {
 .mfui-v6-month_modern .mfui-v6-month__weekday-labels {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
-  width: 328px;
+  width: 100%;
   padding-bottom: 0;
   border-bottom: none;
   -webkit-column-gap: 8px;
@@ -126,7 +126,7 @@ svg.mfui-v6-month__arrow_disabled {
 .mfui-v6-month_modern .mfui-v6-month__days {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
-  width: 328px;
+  width: 100%;
   margin-top: 10px;
   -webkit-column-gap: 0;
      -moz-column-gap: 0;

package/dist/es/components/Tooltip/Tooltip.css

@@ -269,6 +269,20 @@
   -webkit-transform: rotate(-90deg);
           transform: rotate(-90deg);
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='right'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateX(15px);
+          transform: translateX(15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='right'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-end'] .mfui-v6-tooltip__arrow-wrap {
+  left: -6px;
+}
 .mfui-v6-tooltip[data-popper-placement='left'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='left-start'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='left-end'] .mfui-v6-tooltip__content,
@@ -292,6 +306,20 @@
   -webkit-transform: rotate(90deg);
           transform: rotate(90deg);
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='left'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateX(-15px);
+          transform: translateX(-15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='left'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-end'] .mfui-v6-tooltip__arrow-wrap {
+  right: -6px;
+}
 .mfui-v6-tooltip[data-popper-placement='top'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='top-start'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='top-end'] .mfui-v6-tooltip__content,
@@ -315,6 +343,20 @@
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='top'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateY(-15px);
+          transform: translateY(-15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='top'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-end'] .mfui-v6-tooltip__arrow-wrap {
+  bottom: 4px;
+}
 .mfui-v6-tooltip[data-popper-placement='bottom'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='bottom-start'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='bottom-end'] .mfui-v6-tooltip__content,
@@ -329,6 +371,20 @@
 .mfui-v6-tooltip[data-popper-placement='bottom-end'] .mfui-v6-tooltip__arrow-wrap {
   top: 13px;
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateY(15px);
+          transform: translateY(15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-end'] .mfui-v6-tooltip__arrow-wrap {
+  top: 4px;
+}
 .mfui-v6-tooltip[data-popper-escaped='true'].mfui-v6-tooltip_has-escape {
   visibility: hidden;
   pointer-events: none;

package/dist/es/components/Tooltip/Tooltip.d.ts

@@ -23,6 +23,10 @@ export declare const Paddings: {
     readonly MEDIUM: "medium";
 };
 declare type PaddingsType = typeof Paddings[keyof typeof Paddings];
+export declare const Offset: {
+    readonly SMALL: "small";
+};
+declare type OffsetType = typeof Offset[keyof typeof Offset];
 export declare const TriggerEvent: {
     readonly HOVER: "hover";
     readonly CLICK: "click";
@@ -55,6 +59,8 @@ export interface ITooltipProps {
     hasCloseButton?: boolean;
     /** Позиционирование относительно триггер-элемента */
     placement?: PlacementType;
+    /** Смещение тултипа относительно триггер-элемента */
+    offset?: OffsetType;
     /** Направления перестроения тултипа при переполнении */
     fallbackPlacements?: PlacementType[];
     /** Размер отступов от контента */
@@ -69,6 +75,8 @@ export interface ITooltipProps {
     targetElement?: React.RefObject<HTMLElement>;
     /** Управление состоянием. Компонент поддерживает контроллируемое и неконтроллируемое состояние. */
     isOpened?: boolean;
+    /** Пересчет позиции тултипа в скрытом состоянии при изменении размера окна */
+    isHiddenResize?: boolean;
     /** Отрендерить компонент в корневой элементе страницы body */
     isPortal?: boolean;
     /** Рендеринг компонента в указанном селекторе */

package/dist/es/components/Tooltip/Tooltip.js

@@ -62,6 +62,9 @@ export var Paddings = {
   SMALL: 'small',
   MEDIUM: 'medium'
 };
+export var Offset = {
+  SMALL: 'small'
+};
 export var TriggerEvent = {
   HOVER: 'hover',
   CLICK: 'click',
@@ -95,6 +98,7 @@ var Tooltip = function Tooltip(_ref) {
       fallbackPlacements = _ref$fallbackPlacemen === void 0 ? ['left', 'right', 'top', 'bottom'] : _ref$fallbackPlacemen,
       _ref$paddings = _ref.paddings,
       paddings = _ref$paddings === void 0 ? 'small' : _ref$paddings,
+      offset = _ref.offset,
       _ref$triggerEvent = _ref.triggerEvent,
       triggerEvent = _ref$triggerEvent === void 0 ? 'hover' : _ref$triggerEvent,
       boundaryElement = _ref.boundaryElement,
@@ -104,6 +108,8 @@ var Tooltip = function Tooltip(_ref) {
       isOpened = _ref$isOpened === void 0 ? false : _ref$isOpened,
       _ref$isPortal = _ref.isPortal,
       isPortal = _ref$isPortal === void 0 ? false : _ref$isPortal,
+      _ref$isHiddenResize = _ref.isHiddenResize,
+      isHiddenResize = _ref$isHiddenResize === void 0 ? false : _ref$isHiddenResize,
       portalSelector = _ref.portalSelector,
       children = _ref.children,
       _ref$classes = _ref.classes;
@@ -180,7 +186,7 @@ var Tooltip = function Tooltip(_ref) {
         name: 'eventListeners',
         options: {
           scroll: isOpen,
-          resize: isOpen
+          resize: isHiddenResize || isOpen
         }
       }, {
         name: 'preventOverflow',
@@ -189,7 +195,7 @@ var Tooltip = function Tooltip(_ref) {
         }
       }]
     };
-  }, [placement, arrowElement, currentBoundary, isOpen, fallbackPlacements]);
+  }, [placement, arrowElement, fallbackPlacements, isOpen, isHiddenResize, currentBoundary]);
 
   var _usePopper = usePopper(currentTarget, popperElement, options),
       styles = _usePopper.styles,
@@ -335,6 +341,7 @@ var Tooltip = function Tooltip(_ref) {
     className: cn({
       theme: theme,
       paddings: paddings,
+      offset: offset,
       open: isOpen,
       small: !isBigSize,
       'has-escape': !targetElement
@@ -399,6 +406,7 @@ Tooltip.propTypes = {
   placement: PropTypes.oneOf(Object.values(Placement)),
   fallbackPlacements: PropTypes.arrayOf(PropTypes.oneOf(Object.values(Placement)).isRequired),
   paddings: PropTypes.oneOf(Object.values(Paddings)),
+  offset: PropTypes.oneOf(Object.values(Offset)),
   triggerEvent: PropTypes.oneOf(Object.values(TriggerEvent)),
   boundaryElement: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
     current: PropTypes.elementType
@@ -424,6 +432,7 @@ Tooltip.propTypes = {
   }), PropTypes.any])]),
   isOpened: PropTypes.bool,
   isPortal: PropTypes.bool,
+  isHiddenResize: PropTypes.bool,
   portalSelector: PropTypes.string,
   className: PropTypes.string,
   classes: PropTypes.shape({

package/dist/lib/components/Banner/Banner.css

@@ -154,6 +154,9 @@
     bottom: 72px;
   }
 }
+.mfui-v6-banner_margin-top {
+  margin-top: 24px;
+}
 .mfui-v6-banner_radius_rounded .mfui-v6-banner__swiper {
   border-radius: 24px;
 }

package/dist/lib/components/Banner/Banner.d.ts

@@ -69,6 +69,8 @@ export interface IBannerProps {
     noIncreaseAutoplayDelay?: boolean;
     /** Показать часть следующего слайда */
     showNextSlide?: boolean;
+    /** Отступ сверху */
+    hasMarginTop?: boolean;
     /** Ref на swiper */
     getSwiper?: (instance: SwiperCore) => void;
     /** Обработчик клика по стрелке "вперед" (должен быть обернут в useCallback) */

package/dist/lib/components/Banner/Banner.js

@@ -97,6 +97,8 @@ var Banner = function Banner(_ref) {
       autoHeight = _ref$autoHeight === void 0 ? false : _ref$autoHeight,
       noIncreaseAutoplayDelay = _ref.noIncreaseAutoplayDelay,
       showNextSlide = _ref.showNextSlide,
+      _ref$hasMarginTop = _ref.hasMarginTop,
+      hasMarginTop = _ref$hasMarginTop === void 0 ? false : _ref$hasMarginTop,
       _ref$children = _ref.children,
       children = _ref$children === void 0 ? [] : _ref$children,
       getSwiper = _ref.getSwiper,
@@ -299,7 +301,8 @@ var Banner = function Banner(_ref) {
       'background-color': backgroundColor,
       'no-touch': !isTouch,
       radius: radius,
-      'show-next-slide': showNextSlide
+      'show-next-slide': showNextSlide,
+      'margin-top': hasMarginTop
     }, className),
     ref: rootRef
   }), /*#__PURE__*/React.createElement("div", {
@@ -361,6 +364,7 @@ Banner.propTypes = {
   noIncreaseAutoplayDelay: PropTypes.bool,
   showNextSlide: PropTypes.bool,
   getSwiper: PropTypes.func,
+  hasMarginTop: PropTypes.bool,
   onNextClick: PropTypes.func,
   onPrevClick: PropTypes.func,
   onDotClick: PropTypes.func,

package/dist/lib/components/Calendar/Calendar.css

@@ -5,16 +5,15 @@
 }
 .mfui-v6-calendar_modern {
   display: block;
-  width: 364px;
+  width: 100%;
   height: 304px;
   overflow-x: hidden;
   overflow-y: scroll;
 }
 .mfui-v6-calendar_modern::-webkit-scrollbar {
-  width: 16px;
+  width: 4px;
 }
 .mfui-v6-calendar_modern::-webkit-scrollbar-thumb {
-  border: 6px solid transparent;
   border-radius: 16px;
   background-color: #D8D8D8;
   background-clip: padding-box;

package/dist/lib/components/Calendar/Calendar.js

@@ -406,14 +406,14 @@ var Calendar = function Calendar(_ref) {
       var isNextMonthDisabled = !!maxBookingDate && (0, _isSameMonth["default"])(new Date(year, month, 1), maxBookingDate);
       var isCurrentMonth = new Date().getFullYear() === year && new Date().getMonth() === month;
       return /*#__PURE__*/_react["default"].createElement("div", {
-        ref: isCurrentMonth ? currentMonthRef : null
+        ref: isCurrentMonth ? currentMonthRef : null,
+        key: "".concat(year, "-").concat(month)
       }, /*#__PURE__*/_react["default"].createElement(_Month["default"], {
         dataAttrs: {
           root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.month,
           arrowLeft: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrowLeft,
           arrowRight: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrowRight
         },
-        key: "".concat(year, "-").concat(month),
         year: year,
         weekdayLabels: weekdayLabels,
         monthLabel: monthLabel,

package/dist/lib/components/Calendar/components/Day/Day.css

@@ -45,7 +45,10 @@
   width: 38px;
   height: 38px;
 }
-.mfui-v6-day_active-modern:hover:after {
+.mfui-v6-day_active-modern:hover:after,
+.mfui-v6-day_active-modern:focus:after {
+  width: 38px !important;
+  height: 38px !important;
   background-color: var(--brandGreen) !important;
 }
 .mfui-v6-day:not(:disabled):not(.mfui-v6-day_active):hover:after {
@@ -67,7 +70,7 @@
 .mfui-v6-day:not(:disabled):not(.mfui-v6-day_active):focus {
   color: var(--stcWhite);
 }
-.mfui-v6-day_active + .mfui-v6-day_active:before,
+.mfui-v6-day_active + .mfui-v6-day:not(.mfui-v6-day_monday).mfui-v6-day_active:before,
 .mfui-v6-day_between:hover + .mfui-v6-day:not(.mfui-v6-day_monday).mfui-v6-day_active:before {
   content: '';
   position: absolute;
@@ -137,7 +140,7 @@
   z-index: 99;
 }
 .mfui-v6-day_modern {
-  width: 38.29px;
+  width: 100%;
   height: 38px;
 }
 .mfui-v6-day_modern:not(:disabled):not(.mfui-v6-day_modern_active-modern):hover:after,
@@ -166,7 +169,7 @@
 .mfui-v6-day:not(:disabled):focus {
   color: var(--stcWhite);
 }
-.mfui-v6-day_active-modern + .mfui-v6-day_active-modern:before,
+.mfui-v6-day_active-modern + .mfui-v6-day:not(.mfui-v6-day_monday-modern).mfui-v6-day_active-modern:before,
 .mfui-v6-day_between-modern:hover + .mfui-v6-day:not(.mfui-v6-day_monday-modern).mfui-v6-day_active-modern:before {
   content: '';
   position: absolute;
@@ -186,7 +189,7 @@
   content: '';
   position: absolute;
   top: 0;
-  left: -28px;
+  left: -20px;
   z-index: -1;
   display: block;
   height: 38px;
@@ -197,7 +200,7 @@
   content: '';
   position: absolute;
   top: 0;
-  right: -18px;
+  right: -12px;
   z-index: -1;
   display: block;
   width: 45px;
@@ -210,7 +213,7 @@
 }
 .mfui-v6-day_sunday-modern:before,
 .mfui-v6-day_last-modern:before {
-  padding-left: 20px;
+  padding-left: 8px;
 }
 .mfui-v6-day_sunday-modern:after,
 .mfui-v6-day_last-modern:after {

package/dist/lib/components/Calendar/components/Month/Month.css

@@ -80,8 +80,8 @@ svg.mfui-v6-month__arrow_disabled {
   opacity: 0.5;
 }
 .mfui-v6-month_modern {
-  width: 344px;
-  padding: 0 0 24px;
+  width: 100%;
+  padding: 0 16px 24px 0;
 }
 .mfui-v6-month_modern .mfui-v6-month__header {
   display: -webkit-box;
@@ -90,7 +90,7 @@ svg.mfui-v6-month__arrow_disabled {
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
-  width: 328px;
+  width: 100%;
   margin-bottom: 16px;
   text-transform: capitalize;
 }
@@ -105,7 +105,7 @@ svg.mfui-v6-month__arrow_disabled {
 .mfui-v6-month_modern .mfui-v6-month__weekday-labels {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
-  width: 328px;
+  width: 100%;
   padding-bottom: 0;
   border-bottom: none;
   -webkit-column-gap: 8px;
@@ -126,7 +126,7 @@ svg.mfui-v6-month__arrow_disabled {
 .mfui-v6-month_modern .mfui-v6-month__days {
   display: grid;
   grid-template-columns: repeat(7, 1fr);
-  width: 328px;
+  width: 100%;
   margin-top: 10px;
   -webkit-column-gap: 0;
      -moz-column-gap: 0;

package/dist/lib/components/Tooltip/Tooltip.css

@@ -269,6 +269,20 @@
   -webkit-transform: rotate(-90deg);
           transform: rotate(-90deg);
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='right'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateX(15px);
+          transform: translateX(15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='right'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='right-end'] .mfui-v6-tooltip__arrow-wrap {
+  left: -6px;
+}
 .mfui-v6-tooltip[data-popper-placement='left'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='left-start'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='left-end'] .mfui-v6-tooltip__content,
@@ -292,6 +306,20 @@
   -webkit-transform: rotate(90deg);
           transform: rotate(90deg);
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='left'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateX(-15px);
+          transform: translateX(-15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='left'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='left-end'] .mfui-v6-tooltip__arrow-wrap {
+  right: -6px;
+}
 .mfui-v6-tooltip[data-popper-placement='top'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='top-start'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='top-end'] .mfui-v6-tooltip__content,
@@ -315,6 +343,20 @@
   -webkit-transform: rotate(180deg);
           transform: rotate(180deg);
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='top'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateY(-15px);
+          transform: translateY(-15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='top'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='top-end'] .mfui-v6-tooltip__arrow-wrap {
+  bottom: 4px;
+}
 .mfui-v6-tooltip[data-popper-placement='bottom'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='bottom-start'] .mfui-v6-tooltip__content,
 .mfui-v6-tooltip[data-popper-placement='bottom-end'] .mfui-v6-tooltip__content,
@@ -329,6 +371,20 @@
 .mfui-v6-tooltip[data-popper-placement='bottom-end'] .mfui-v6-tooltip__arrow-wrap {
   top: 13px;
 }
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-start'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-end'] .mfui-v6-tooltip__content,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-start'] .mfui-v6-tooltip__content-shadow,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-end'] .mfui-v6-tooltip__content-shadow {
+  -webkit-transform: translateY(15px);
+          transform: translateY(15px);
+}
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-start'] .mfui-v6-tooltip__arrow-wrap,
+.mfui-v6-tooltip_offset_small[data-popper-placement='bottom-end'] .mfui-v6-tooltip__arrow-wrap {
+  top: 4px;
+}
 .mfui-v6-tooltip[data-popper-escaped='true'].mfui-v6-tooltip_has-escape {
   visibility: hidden;
   pointer-events: none;

package/dist/lib/components/Tooltip/Tooltip.d.ts

@@ -23,6 +23,10 @@ export declare const Paddings: {
     readonly MEDIUM: "medium";
 };
 declare type PaddingsType = typeof Paddings[keyof typeof Paddings];
+export declare const Offset: {
+    readonly SMALL: "small";
+};
+declare type OffsetType = typeof Offset[keyof typeof Offset];
 export declare const TriggerEvent: {
     readonly HOVER: "hover";
     readonly CLICK: "click";
@@ -55,6 +59,8 @@ export interface ITooltipProps {
     hasCloseButton?: boolean;
     /** Позиционирование относительно триггер-элемента */
     placement?: PlacementType;
+    /** Смещение тултипа относительно триггер-элемента */
+    offset?: OffsetType;
     /** Направления перестроения тултипа при переполнении */
     fallbackPlacements?: PlacementType[];
     /** Размер отступов от контента */
@@ -69,6 +75,8 @@ export interface ITooltipProps {
     targetElement?: React.RefObject<HTMLElement>;
     /** Управление состоянием. Компонент поддерживает контроллируемое и неконтроллируемое состояние. */
     isOpened?: boolean;
+    /** Пересчет позиции тултипа в скрытом состоянии при изменении размера окна */
+    isHiddenResize?: boolean;
     /** Отрендерить компонент в корневой элементе страницы body */
     isPortal?: boolean;
     /** Рендеринг компонента в указанном селекторе */