@megafon/ui-core 9.0.0-alpha.12 → 9.0.0-alpha.14

package/dist/es/components/Badges/TimerBadge/TimerBadge.d.ts

@@ -12,6 +12,8 @@ export interface ITimerBadgeProps {
     countdownText?: string;
     /** Текст перед таймером в режиме даты. Появляется при hasPrefix=true. */
     expirationDateText?: string;
+    /** Кастомный текст после окончания обратного отсчета */
+    countdownEndText?: string;
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Дополнительные data-атрибуты к внутренним элементам */

package/dist/es/components/Badges/TimerBadge/TimerBadge.js

@@ -33,6 +33,8 @@ var TimerBadge = function TimerBadge(_ref) {
     countdownText = _ref$countdownText === void 0 ? 'Закончится через' : _ref$countdownText,
     _ref$expirationDateTe = _ref.expirationDateText,
     expirationDateText = _ref$expirationDateTe === void 0 ? 'Воспользуйтесь до' : _ref$expirationDateTe,
+    _ref$countdownEndText = _ref.countdownEndText,
+    countdownEndText = _ref$countdownEndText === void 0 ? 'Время действия истекло' : _ref$countdownEndText,
     className = _ref.className,
     dataAttrs = _ref.dataAttrs;
   var remainingTime = (expirationDate.getTime() - Date.now()) / MS_IN_SECOND;
@@ -74,7 +76,7 @@ var TimerBadge = function TimerBadge(_ref) {
     className: cn('icon')
   })), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text), {
     className: cn('text')
-  }), isTimeExpired ? 'Время действия истекло' : /*#__PURE__*/React.createElement(Timer, {
+  }), isTimeExpired ? countdownEndText : /*#__PURE__*/React.createElement(Timer, {
     additionalText: hasPrefix ? additionalText : undefined,
     showCountdown: showCountdown,
     expirationDate: expirationDate,

package/dist/es/components/Buttons/Button/Button.css

@@ -1 +1 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-9-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;border-radius:30px;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--stcWhite);cursor:pointer;display:inline-block;font-family:inherit;font-size:15px;font-weight:500;line-height:24px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content;outline:none;overflow:hidden;padding:0 32px;text-align:center;text-decoration:none;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s;vertical-align:top;-webkit-tap-highlight-color:rgba(0,0,0,0)}.mfui-9-button svg{display:block;-webkit-transition:fill .3s;transition:fill .3s}.mfui-9-button_size-all_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 16px}.mfui-9-button_size-all_extra-small .mfui-9-button__icon,.mfui-9-button_size-all_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-all_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-all_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-all_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-all_small{border-radius:12px;height:40px;min-width:40px;padding:0 24px}.mfui-9-button_size-all_small .mfui-9-button__icon,.mfui-9-button_size-all_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-all_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-all_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-all_medium .mfui-9-button__icon,.mfui-9-button_size-all_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-all_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-all_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-all_large .mfui-9-button__icon,.mfui-9-button_size-all_large .mfui-9-button__icon-arrow,.mfui-9-button_size-all_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-all_extra-small.mfui-9-buttonhas-arrow{padding:0 8px}.mfui-9-button_size-all_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-all_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-all_medium.mfui-9-buttonhas-arrow{padding:0 24px}.mfui-9-button_size-all_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-all_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-all_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{padding:0}@media screen and (min-width:1024px){.mfui-9-button_size-desktop_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 16px}.mfui-9-button_size-desktop_extra-small .mfui-9-button__icon,.mfui-9-button_size-desktop_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-desktop_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-desktop_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-desktop_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-desktop_small{border-radius:12px;height:40px;min-width:40px;padding:0 24px}.mfui-9-button_size-desktop_small .mfui-9-button__icon,.mfui-9-button_size-desktop_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-desktop_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-desktop_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-desktop_medium .mfui-9-button__icon,.mfui-9-button_size-desktop_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-desktop_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-desktop_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-desktop_large .mfui-9-button__icon,.mfui-9-button_size-desktop_large .mfui-9-button__icon-arrow,.mfui-9-button_size-desktop_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-desktop_extra-small.mfui-9-buttonhas-arrow{padding:0 8px}.mfui-9-button_size-desktop_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-desktop_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-desktop_medium.mfui-9-buttonhas-arrow{padding:0 24px}.mfui-9-button_size-desktop_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-desktop_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-desktop_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{padding:0}}@media screen and (min-width:1280px){.mfui-9-button_size-wide_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 16px}.mfui-9-button_size-wide_extra-small .mfui-9-button__icon,.mfui-9-button_size-wide_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-wide_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-wide_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-wide_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-wide_small{border-radius:12px;height:40px;min-width:40px;padding:0 24px}.mfui-9-button_size-wide_small .mfui-9-button__icon,.mfui-9-button_size-wide_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-wide_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-wide_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-wide_medium .mfui-9-button__icon,.mfui-9-button_size-wide_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-wide_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-wide_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-wide_large .mfui-9-button__icon,.mfui-9-button_size-wide_large .mfui-9-button__icon-arrow,.mfui-9-button_size-wide_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-wide_extra-small.mfui-9-buttonhas-arrow{padding:0 8px}.mfui-9-button_size-wide_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-wide_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-wide_medium.mfui-9-buttonhas-arrow{padding:0 24px}.mfui-9-button_size-wide_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-wide_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-wide_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{padding:0}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-9-button_size-tablet_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 16px}.mfui-9-button_size-tablet_extra-small .mfui-9-button__icon,.mfui-9-button_size-tablet_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-tablet_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-tablet_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-tablet_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-tablet_small{border-radius:12px;height:40px;min-width:40px;padding:0 24px}.mfui-9-button_size-tablet_small .mfui-9-button__icon,.mfui-9-button_size-tablet_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-tablet_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-tablet_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-tablet_medium .mfui-9-button__icon,.mfui-9-button_size-tablet_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-tablet_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-tablet_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-tablet_large .mfui-9-button__icon,.mfui-9-button_size-tablet_large .mfui-9-button__icon-arrow,.mfui-9-button_size-tablet_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-tablet_extra-small.mfui-9-buttonhas-arrow{padding:0 8px}.mfui-9-button_size-tablet_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-tablet_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-tablet_medium.mfui-9-buttonhas-arrow{padding:0 24px}.mfui-9-button_size-tablet_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-tablet_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-tablet_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{padding:0}}@media screen and (max-width:767px){.mfui-9-button_size-mobile_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 16px}.mfui-9-button_size-mobile_extra-small .mfui-9-button__icon,.mfui-9-button_size-mobile_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-mobile_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-mobile_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-mobile_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-mobile_small{border-radius:12px;height:40px;min-width:40px;padding:0 24px}.mfui-9-button_size-mobile_small .mfui-9-button__icon,.mfui-9-button_size-mobile_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-mobile_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-mobile_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-mobile_medium .mfui-9-button__icon,.mfui-9-button_size-mobile_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-mobile_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-mobile_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-mobile_large .mfui-9-button__icon,.mfui-9-button_size-mobile_large .mfui-9-button__icon-arrow,.mfui-9-button_size-mobile_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-mobile_extra-small.mfui-9-buttonhas-arrow{padding:0 8px}.mfui-9-button_size-mobile_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-mobile_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-mobile_medium.mfui-9-buttonhas-arrow{padding:0 24px}.mfui-9-button_size-mobile_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-mobile_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-mobile_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{padding:0}}.mfui-9-button:hover{text-decoration:none;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s}.mfui-9-button:hover svg{-webkit-transition:fill .3s;transition:fill .3s}.mfui-9-button_disabled{cursor:default}.mfui-9-button__inner{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-sizing:border-box;box-sizing:border-box;height:inherit;justify-content:center;vertical-align:top;width:100%}.mfui-9-button__text{margin-bottom:2px}.mfui-9-button__text_ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mfui-9-button__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-button__content_ellipsis{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;width:inherit}.mfui-9-button__content_show-loader{visibility:hidden}.mfui-9-button__preloader{position:absolute}.mfui-9-button__icon-arrow{height:32px;margin-left:4px;width:32px}.mfui-9-button_content-type_icon{padding:0}.mfui-9-button_content-type_icon-text .mfui-9-button__icon,.mfui-9-button_content-type_icon-text:not(.mfui-9-button_type_text) .mfui-9-button__text{margin-right:4px}.mfui-9-button_type_text.mfui-9-button_theme_green{background-color:transparent;color:var(--brandGreen);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_green svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover{color:var(--buttonHoverGreen)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover svg{fill:var(--buttonHoverGreen)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_purple{background-color:transparent;color:var(--brandPurple);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_purple svg{fill:var(--brandPurple)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover{color:var(--buttonHoverPurple)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover svg{fill:var(--buttonHoverPurple)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_white{background-color:transparent;color:var(--stcWhite);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_white svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover{color:var(--buttonHoverGrey)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover svg{fill:var(--buttonHoverGrey)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_black{background-color:transparent;color:var(--stcBlack);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_black svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black{--stcBlack7:#818181}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):hover{color:var(--stcBlack7)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):hover svg{fill:var(--stcBlack7)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_danger{background-color:transparent;color:var(--fury);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_danger svg{fill:var(--fury)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):hover{color:var(--fury80)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):hover svg{fill:var(--fury80)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_primary.mfui-9-button_theme_green{background-color:var(--brandGreen);color:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_green svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverGreen)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green:not(.mfui-9-button_loading):active{background-color:var(--buttonDown)}.mfui-9-button_type_primary.mfui-9-button_theme_green-soft{background-color:var(--brandGreen20);border:1px solid rgba(0,185,86,.2);color:var(--brandGreen)}.mfui-9-button_type_primary.mfui-9-button_theme_green-soft svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverGreenSoft)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):active{background-color:var(--buttonDown);color:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):active svg{fill:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_purple{background-color:var(--brandPurple);color:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_purple svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverPurple)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active{background-color:var(--buttonDown)}.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft{background-color:var(--brandPurple20);border:1px solid rgba(115,25,130,.2);color:var(--brandPurple)}.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft svg{fill:var(--brandPurple)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverPurpleSoft)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft:not(.mfui-9-button_loading):active{background-color:var(--buttonDown);color:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft:not(.mfui-9-button_loading):active svg{fill:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_white{background-color:var(--stcWhite);color:var(--stcBlack)}.mfui-9-button_type_primary.mfui-9-button_theme_white svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverGrey);color:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):active{background-color:var(--buttonDown);color:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):active svg{fill:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_gray{background-color:var(--spbSky0);color:var(--content)}.mfui-9-button_type_primary.mfui-9-button_theme_gray svg{fill:var(--content)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):hover{background-color:var(--spbSky1)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):hover svg{fill:var(--content)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):active{background-color:var(--spbSky2)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):active svg{fill:var(--content)}.mfui-9-button_type_outline.mfui-9-button_theme_green{background-color:transparent;border:1px solid var(--brandGreen);color:var(--brandGreen)}.mfui-9-button_type_outline.mfui-9-button_theme_green svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green{--brandGreen7:rgba(0,185,86,.07);--brandGreen14:rgba(0,185,86,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover{background-color:var(--brandGreen7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green:not(.mfui-9-button_loading):active{background-color:var(--brandGreen14)}.mfui-9-button_type_outline.mfui-9-button_theme_green-soft{background-color:transparent;color:var(--brandGreen)}.mfui-9-button_type_outline.mfui-9-button_theme_green-soft svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green-soft{--brandGreen7:rgba(0,185,86,.07);--brandGreen14:rgba(0,185,86,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):hover{background-color:var(--brandGreen7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):active{background-color:var(--brandGreen14)}.mfui-9-button_type_outline.mfui-9-button_theme_purple{background-color:transparent;border:1px solid var(--brandPurple);color:var(--brandPurple)}.mfui-9-button_type_outline.mfui-9-button_theme_purple svg{fill:var(--brandPurple)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_purple{--brandPurple7:rgba(115,25,130,.07);--brandPurple14:rgba(115,25,130,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover{background-color:var(--brandPurple7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active{background-color:var(--brandPurple14)}.mfui-9-button_type_outline.mfui-9-button_theme_white{background-color:transparent;border:1px solid var(--stcWhite);color:var(--stcWhite)}.mfui-9-button_type_outline.mfui-9-button_theme_white svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white{--stcWhite7:hsla(0,0%,100%,.07);--stcWhite14:hsla(0,0%,100%,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover{background-color:var(--stcWhite7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white:not(.mfui-9-button_loading):active{background-color:var(--stcWhite14)}.mfui-9-button_type_outline.mfui-9-button_theme_black{background-color:transparent;border:1px solid var(--stcBlack);color:var(--stcBlack)}.mfui-9-button_type_outline.mfui-9-button_theme_black svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_black{--stcBlack7:rgba(51,51,51,.07);--stcBlack14:rgba(51,51,51,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_black:not(.mfui-9-button_loading):hover{background-color:var(--stcBlack7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_black:not(.mfui-9-button_loading):active{background-color:var(--stcBlack14)}.mfui-9-button_full-width{display:block;width:100%}@media screen and (max-width:767px){.mfui-9-button_full-width-mobile{display:block;width:100%}}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_primary.mfui-9-button_disabled{background-color:var(--spbSky1);border:1px solid var(--spbSky2);color:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_primary.mfui-9-button_disabled svg{fill:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled{background-color:transparent;border:1px solid var(--stcWhite);color:var(--stcWhite50)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled svg{fill:var(--stcWhite50)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_disabled{background-color:transparent;border:1px solid var(--spbSky2);color:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_disabled svg{fill:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_disabled{color:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_disabled svg{fill:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled{background-color:transparent;color:var(--stcWhite)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled svg{fill:var(--stcWhite)}
+h1,h2,h3,h4,h5{margin:0}.mfui-9-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:1px solid transparent;border-radius:30px;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--stcWhite);cursor:pointer;display:inline-block;font-family:inherit;font-size:15px;font-weight:500;line-height:24px;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content;outline:none;overflow:hidden;padding:0 31px;text-align:center;text-decoration:none;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s;vertical-align:top;-webkit-tap-highlight-color:rgba(0,0,0,0)}.mfui-9-button svg{display:block;-webkit-transition:fill .3s;transition:fill .3s}.mfui-9-button_size-all_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 15px}.mfui-9-button_size-all_extra-small .mfui-9-button__icon,.mfui-9-button_size-all_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-all_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-all_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-all_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-all_small{border-radius:12px;height:40px;min-width:40px;padding:0 23px}.mfui-9-button_size-all_small .mfui-9-button__icon,.mfui-9-button_size-all_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-all_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-all_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-all_medium .mfui-9-button__icon,.mfui-9-button_size-all_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-all_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-all_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-all_large .mfui-9-button__icon,.mfui-9-button_size-all_large .mfui-9-button__icon-arrow,.mfui-9-button_size-all_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-all_extra-small.mfui-9-buttonhas-arrow{padding:0 7px}.mfui-9-button_size-all_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-all_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-all_medium.mfui-9-buttonhas-arrow{padding:0 23px}.mfui-9-button_size-all_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-all_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-all_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{border:none;padding:0}@media screen and (min-width:1024px){.mfui-9-button_size-desktop_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 15px}.mfui-9-button_size-desktop_extra-small .mfui-9-button__icon,.mfui-9-button_size-desktop_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-desktop_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-desktop_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-desktop_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-desktop_small{border-radius:12px;height:40px;min-width:40px;padding:0 23px}.mfui-9-button_size-desktop_small .mfui-9-button__icon,.mfui-9-button_size-desktop_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-desktop_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-desktop_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-desktop_medium .mfui-9-button__icon,.mfui-9-button_size-desktop_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-desktop_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-desktop_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-desktop_large .mfui-9-button__icon,.mfui-9-button_size-desktop_large .mfui-9-button__icon-arrow,.mfui-9-button_size-desktop_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-desktop_extra-small.mfui-9-buttonhas-arrow{padding:0 7px}.mfui-9-button_size-desktop_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-desktop_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-desktop_medium.mfui-9-buttonhas-arrow{padding:0 23px}.mfui-9-button_size-desktop_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-desktop_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-desktop_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{border:none;padding:0}}@media screen and (min-width:1280px){.mfui-9-button_size-wide_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 15px}.mfui-9-button_size-wide_extra-small .mfui-9-button__icon,.mfui-9-button_size-wide_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-wide_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-wide_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-wide_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-wide_small{border-radius:12px;height:40px;min-width:40px;padding:0 23px}.mfui-9-button_size-wide_small .mfui-9-button__icon,.mfui-9-button_size-wide_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-wide_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-wide_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-wide_medium .mfui-9-button__icon,.mfui-9-button_size-wide_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-wide_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-wide_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-wide_large .mfui-9-button__icon,.mfui-9-button_size-wide_large .mfui-9-button__icon-arrow,.mfui-9-button_size-wide_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-wide_extra-small.mfui-9-buttonhas-arrow{padding:0 7px}.mfui-9-button_size-wide_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-wide_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-wide_medium.mfui-9-buttonhas-arrow{padding:0 23px}.mfui-9-button_size-wide_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-wide_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-wide_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{border:none;padding:0}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-9-button_size-tablet_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 15px}.mfui-9-button_size-tablet_extra-small .mfui-9-button__icon,.mfui-9-button_size-tablet_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-tablet_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-tablet_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-tablet_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-tablet_small{border-radius:12px;height:40px;min-width:40px;padding:0 23px}.mfui-9-button_size-tablet_small .mfui-9-button__icon,.mfui-9-button_size-tablet_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-tablet_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-tablet_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-tablet_medium .mfui-9-button__icon,.mfui-9-button_size-tablet_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-tablet_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-tablet_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-tablet_large .mfui-9-button__icon,.mfui-9-button_size-tablet_large .mfui-9-button__icon-arrow,.mfui-9-button_size-tablet_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-tablet_extra-small.mfui-9-buttonhas-arrow{padding:0 7px}.mfui-9-button_size-tablet_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-tablet_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-tablet_medium.mfui-9-buttonhas-arrow{padding:0 23px}.mfui-9-button_size-tablet_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-tablet_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-tablet_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{border:none;padding:0}}@media screen and (max-width:767px){.mfui-9-button_size-mobile_extra-small{border-radius:8px;font-size:12px;height:24px;line-height:14px;min-width:24px;padding:0 15px}.mfui-9-button_size-mobile_extra-small .mfui-9-button__icon,.mfui-9-button_size-mobile_extra-small .mfui-9-button__icon-arrow,.mfui-9-button_size-mobile_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:20px;width:20px}.mfui-9-button_size-mobile_extra-small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{margin-right:2px}.mfui-9-button_size-mobile_extra-small .mfui-9-button__icon-arrow{margin-left:0}.mfui-9-button_size-mobile_small{border-radius:12px;height:40px;min-width:40px;padding:0 23px}.mfui-9-button_size-mobile_small .mfui-9-button__icon,.mfui-9-button_size-mobile_small .mfui-9-button__icon-arrow{height:20px;width:20px}.mfui-9-button_size-mobile_small.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-mobile_medium{border-radius:16px;height:52px;min-width:52px}.mfui-9-button_size-mobile_medium .mfui-9-button__icon,.mfui-9-button_size-mobile_medium .mfui-9-button__icon-arrow,.mfui-9-button_size-mobile_medium.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-mobile_large{border-radius:16px;height:60px;min-width:60px}.mfui-9-button_size-mobile_large .mfui-9-button__icon,.mfui-9-button_size-mobile_large .mfui-9-button__icon-arrow,.mfui-9-button_size-mobile_large.mfui-9-button_content-type_icon-text .mfui-9-button__icon{height:32px;width:32px}.mfui-9-button_size-mobile_extra-small.mfui-9-buttonhas-arrow{padding:0 7px}.mfui-9-button_size-mobile_extra-small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:12px}.mfui-9-button_size-mobile_large.mfui-9-buttonhas-arrow,.mfui-9-button_size-mobile_medium.mfui-9-buttonhas-arrow{padding:0 23px}.mfui-9-button_size-mobile_large.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-mobile_medium.mfui-9-buttonhas-arrow .mfui-9-button__content,.mfui-9-button_size-mobile_small.mfui-9-buttonhas-arrow .mfui-9-button__content{padding-left:16px}.mfui-9-button_type_text{border:none;padding:0}}.mfui-9-button:hover{text-decoration:none;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s}.mfui-9-button:hover svg{-webkit-transition:fill .3s;transition:fill .3s}.mfui-9-button_disabled{cursor:default}.mfui-9-button__inner{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-sizing:border-box;box-sizing:border-box;height:inherit;justify-content:center;vertical-align:top;width:100%}.mfui-9-button__text{margin-bottom:2px}.mfui-9-button__text_ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mfui-9-button__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-button__content_ellipsis{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;width:inherit}.mfui-9-button__content_show-loader{visibility:hidden}.mfui-9-button__preloader{position:absolute}.mfui-9-button__icon-arrow{height:32px;margin-left:4px;width:32px}.mfui-9-button_content-type_icon{padding:0}.mfui-9-button_content-type_icon-text .mfui-9-button__icon,.mfui-9-button_content-type_icon-text:not(.mfui-9-button_type_text) .mfui-9-button__text{margin-right:4px}.mfui-9-button_type_text.mfui-9-button_theme_green{background-color:transparent;color:var(--brandGreen);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_green svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover{color:var(--buttonHoverGreen)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover svg{fill:var(--buttonHoverGreen)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_green:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_purple{background-color:transparent;color:var(--brandPurple);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_purple svg{fill:var(--brandPurple)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover{color:var(--buttonHoverPurple)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover svg{fill:var(--buttonHoverPurple)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_white{background-color:transparent;color:var(--stcWhite);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_white svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover{color:var(--buttonHoverGrey)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover svg{fill:var(--buttonHoverGrey)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_black{background-color:transparent;color:var(--stcBlack);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_black svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black{--stcBlack7:#818181}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):hover{color:var(--stcBlack7)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):hover svg{fill:var(--stcBlack7)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_black:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_text.mfui-9-button_theme_danger{background-color:transparent;color:var(--fury);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.mfui-9-button_type_text.mfui-9-button_theme_danger svg{fill:var(--fury)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):hover{color:var(--fury80)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):hover svg{fill:var(--fury80)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):active{color:var(--buttonDown)}.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_danger:not(.mfui-9-button_loading):active svg{fill:var(--buttonDown)}.mfui-9-button_type_primary.mfui-9-button_theme_green{background-color:var(--brandGreen);color:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_green svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverGreen)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green:not(.mfui-9-button_loading):active{background-color:var(--buttonDown)}.mfui-9-button_type_primary.mfui-9-button_theme_green-soft{background-color:var(--brandGreen20);border:1px solid rgba(0,185,86,.2);color:var(--brandGreen)}.mfui-9-button_type_primary.mfui-9-button_theme_green-soft svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverGreenSoft)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):active{background-color:var(--buttonDown);color:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):active svg{fill:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_purple{background-color:var(--brandPurple);color:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_purple svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverPurple)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active{background-color:var(--buttonDown)}.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft{background-color:var(--brandPurple20);border:1px solid rgba(115,25,130,.2);color:var(--brandPurple)}.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft svg{fill:var(--brandPurple)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverPurpleSoft)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft:not(.mfui-9-button_loading):active{background-color:var(--buttonDown);color:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_purple-soft:not(.mfui-9-button_loading):active svg{fill:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_white{background-color:var(--stcWhite);color:var(--stcBlack)}.mfui-9-button_type_primary.mfui-9-button_theme_white svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover{background-color:var(--buttonHoverGrey);color:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):active{background-color:var(--buttonDown);color:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_white:not(.mfui-9-button_loading):active svg{fill:var(--stcWhite)}.mfui-9-button_type_primary.mfui-9-button_theme_gray{background-color:var(--spbSky0);color:var(--content)}.mfui-9-button_type_primary.mfui-9-button_theme_gray svg{fill:var(--content)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):hover{background-color:var(--spbSky1)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):hover svg{fill:var(--content)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):active{background-color:var(--spbSky2)}.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_theme_gray:not(.mfui-9-button_loading):active svg{fill:var(--content)}.mfui-9-button_type_outline.mfui-9-button_theme_green{background-color:transparent;border:1px solid var(--brandGreen);color:var(--brandGreen)}.mfui-9-button_type_outline.mfui-9-button_theme_green svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green{--brandGreen7:rgba(0,185,86,.07);--brandGreen14:rgba(0,185,86,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green:not(.mfui-9-button_loading):hover{background-color:var(--brandGreen7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green:not(.mfui-9-button_loading):active{background-color:var(--brandGreen14)}.mfui-9-button_type_outline.mfui-9-button_theme_green-soft{background-color:transparent;color:var(--brandGreen)}.mfui-9-button_type_outline.mfui-9-button_theme_green-soft svg{fill:var(--brandGreen)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green-soft{--brandGreen7:rgba(0,185,86,.07);--brandGreen14:rgba(0,185,86,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):hover{background-color:var(--brandGreen7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_green-soft:not(.mfui-9-button_loading):active{background-color:var(--brandGreen14)}.mfui-9-button_type_outline.mfui-9-button_theme_purple{background-color:transparent;border:1px solid var(--brandPurple);color:var(--brandPurple)}.mfui-9-button_type_outline.mfui-9-button_theme_purple svg{fill:var(--brandPurple)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_purple{--brandPurple7:rgba(115,25,130,.07);--brandPurple14:rgba(115,25,130,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_purple:not(.mfui-9-button_loading):hover{background-color:var(--brandPurple7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_purple:not(.mfui-9-button_loading):active{background-color:var(--brandPurple14)}.mfui-9-button_type_outline.mfui-9-button_theme_white{background-color:transparent;border:1px solid var(--stcWhite);color:var(--stcWhite)}.mfui-9-button_type_outline.mfui-9-button_theme_white svg{fill:var(--stcWhite)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white{--stcWhite7:hsla(0,0%,100%,.07);--stcWhite14:hsla(0,0%,100%,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white:not(.mfui-9-button_loading):hover{background-color:var(--stcWhite7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white:not(.mfui-9-button_loading):active{background-color:var(--stcWhite14)}.mfui-9-button_type_outline.mfui-9-button_theme_black{background-color:transparent;border:1px solid var(--stcBlack);color:var(--stcBlack)}.mfui-9-button_type_outline.mfui-9-button_theme_black svg{fill:var(--stcBlack)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_black{--stcBlack7:rgba(51,51,51,.07);--stcBlack14:rgba(51,51,51,.14)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_black:not(.mfui-9-button_loading):hover{background-color:var(--stcBlack7)}.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_black:not(.mfui-9-button_loading):active{background-color:var(--stcBlack14)}.mfui-9-button_full-width{display:block;width:100%}@media screen and (max-width:767px){.mfui-9-button_full-width-mobile{display:block;width:100%}}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_primary.mfui-9-button_disabled{background-color:var(--spbSky1);border:1px solid var(--spbSky2);color:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_primary.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_primary.mfui-9-button_disabled svg{fill:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled{background-color:transparent;border:1px solid var(--stcWhite);color:var(--stcWhite50)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_theme_white.mfui-9-button_disabled svg{fill:var(--stcWhite50)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_disabled{background-color:transparent;border:1px solid var(--spbSky2);color:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_outline.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_outline.mfui-9-button_disabled svg{fill:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_disabled{color:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_disabled svg{fill:var(--spbSky3)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:active,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:hover,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled{background-color:transparent;color:var(--stcWhite)}.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:active svg,.mfui-9-button.mfui-9-button_no-touch.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled:hover svg,.mfui-9-button.mfui-9-button_type_text.mfui-9-button_theme_white.mfui-9-button_disabled svg{fill:var(--stcWhite)}

package/dist/es/components/Chips/Chips/Chip.css

@@ -1 +1 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-9-chip{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:inherit;font-size:15px;font-weight:500;line-height:24px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--spbSky0);border:none;border-radius:20px;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--content);overflow:hidden;padding:8px 20px;text-align:center;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;outline:none;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s}.mfui-9-chip.mfui-9-chip_theme_gray{background-color:var(--spbSky1)}.mfui-9-chip svg{-webkit-transition:fill .3s;transition:fill .3s;fill:var(--content)}@media screen and (max-width:767px){.mfui-9-chip{padding:4px 12px}}.mfui-9-chip:hover{background-color:var(--spbSky1)}.mfui-9-chip.mfui-9-chip_theme_gray:hover{background-color:var(--spbSky2)}.mfui-9-chip__inner{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mfui-9-chip__counter{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--spbSky3);margin-left:6px}@media screen and (max-width:767px){.mfui-9-chip__counter{margin-left:4px}}.mfui-9-chip__icon,.mfui-9-chip__icon-arrow{display:block;max-height:20px;min-width:20px;width:20px}.mfui-9-chip__icon svg,.mfui-9-chip__icon-arrow svg{display:block;height:100%;width:100%}.mfui-9-chip__icon{margin-right:6px}@media screen and (max-width:767px){.mfui-9-chip__icon{margin-right:4px}}.mfui-9-chip_disabled,.mfui-9-chip_disabled:hover{background-color:var(--spbSky0);color:var(--spbSky3);cursor:default;pointer-events:none}.mfui-9-chip_disabled svg,.mfui-9-chip_disabled:hover svg{fill:var(--spbSky3)}.mfui-9-chip_disabled .mfui-9-chip__counter,.mfui-9-chip_disabled:hover .mfui-9-chip__counter{color:var(--spbSky2)}.mfui-9-chip_disabled.mfui-9-chip_theme_gray,.mfui-9-chip_disabled.mfui-9-chip_theme_gray:hover{background-color:var(--spbSky1)}.mfui-9-chip_checked,.mfui-9-chip_checked:hover{background-color:var(--night);color:var(--stcWhite)}.mfui-9-chip_checked svg,.mfui-9-chip_checked:hover svg{fill:var(--stcWhite)}.mfui-9-chip_checked .mfui-9-chip__counter,.mfui-9-chip_checked:hover .mfui-9-chip__counter{color:var(--stcWhite)}.mfui-9-chip_checked.mfui-9-chip_color_black,.mfui-9-chip_checked.mfui-9-chip_color_black:hover{background-color:var(--content);color:var(--base)}.mfui-9-chip_checked.mfui-9-chip_color_black svg,.mfui-9-chip_checked.mfui-9-chip_color_black:hover svg{fill:var(--base)}.mfui-9-chip_checked.mfui-9-chip_color_black .mfui-9-chip__counter,.mfui-9-chip_checked.mfui-9-chip_color_black:hover .mfui-9-chip__counter{color:var(--base)}.mfui-9-chip_with-icon{padding-left:16px}@media screen and (max-width:767px){.mfui-9-chip_with-icon{padding-left:8px}}
+h1,h2,h3,h4,h5{margin:0}.mfui-9-chip{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:inherit;font-size:15px;font-weight:500;line-height:24px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:var(--spbSky0);border:none;border-radius:20px;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--content);overflow:hidden;padding:8px 20px;text-align:center;text-decoration:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;outline:none;-webkit-transition:background-color .3s,color .3s;transition:background-color .3s,color .3s}.mfui-9-chip svg{-webkit-transition:fill .3s;transition:fill .3s;fill:var(--content)}@media screen and (max-width:767px){.mfui-9-chip{padding:4px 12px}}.mfui-9-chip:hover{background-color:var(--spbSky1)}.mfui-9-chip__inner{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mfui-9-chip__counter{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--spbSky3);margin-left:6px}@media screen and (max-width:767px){.mfui-9-chip__counter{margin-left:4px}}.mfui-9-chip__icon,.mfui-9-chip__icon-arrow{display:block;max-height:20px;min-width:20px;width:20px}.mfui-9-chip__icon svg,.mfui-9-chip__icon-arrow svg{display:block;height:100%;width:100%}.mfui-9-chip__icon{margin-right:6px}@media screen and (max-width:767px){.mfui-9-chip__icon{margin-right:4px}}.mfui-9-chip_theme_gray{background-color:var(--spbSky1)}.mfui-9-chip_theme_gray:hover{background-color:var(--spbSky2)}.mfui-9-chip_disabled,.mfui-9-chip_disabled:hover{background-color:var(--spbSky0);color:var(--spbSky3);cursor:default;pointer-events:none}.mfui-9-chip_disabled svg,.mfui-9-chip_disabled:hover svg{fill:var(--spbSky3)}.mfui-9-chip_disabled .mfui-9-chip__counter,.mfui-9-chip_disabled:hover .mfui-9-chip__counter{color:var(--spbSky2)}.mfui-9-chip_disabled.mfui-9-chip_theme_gray,.mfui-9-chip_disabled.mfui-9-chip_theme_gray:hover{background-color:var(--spbSky1)}.mfui-9-chip_checked,.mfui-9-chip_checked:hover{background-color:var(--night);color:var(--stcWhite)}.mfui-9-chip_checked svg,.mfui-9-chip_checked:hover svg{fill:var(--stcWhite)}.mfui-9-chip_checked .mfui-9-chip__counter,.mfui-9-chip_checked:hover .mfui-9-chip__counter{color:var(--stcWhite)}.mfui-9-chip_checked.mfui-9-chip_color_black,.mfui-9-chip_checked.mfui-9-chip_color_black:hover{background-color:var(--content);color:var(--base)}.mfui-9-chip_checked.mfui-9-chip_color_black svg,.mfui-9-chip_checked.mfui-9-chip_color_black:hover svg{fill:var(--base)}.mfui-9-chip_checked.mfui-9-chip_color_black .mfui-9-chip__counter,.mfui-9-chip_checked.mfui-9-chip_color_black:hover .mfui-9-chip__counter{color:var(--base)}.mfui-9-chip_with-icon{padding-left:16px}@media screen and (max-width:767px){.mfui-9-chip_with-icon{padding-left:8px}}

package/dist/es/components/ContentArea/ContentArea.css

@@ -1 +1 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-9-content-area_background-color_transparent{background-color:transparent}.mfui-9-content-area_background-color_black{background-color:var(--stcBlack)}.mfui-9-content-area_background-color_white{background-color:var(--stcWhite)}.mfui-9-content-area_background-color_green{background-color:var(--brandGreen)}.mfui-9-content-area_background-color_purple{background-color:var(--brandPurple)}.mfui-9-content-area_background-color_spbSky0{background-color:var(--spbSky0)}.mfui-9-content-area_background-color_spbSky1{background-color:var(--spbSky1)}.mfui-9-content-area_background-color_spbSky2{background-color:var(--spbSky2)}.mfui-9-content-area__inner{-webkit-box-sizing:content-box;box-sizing:content-box;margin:0 auto;max-width:1440px;padding-left:80px;padding-right:80px}@media screen and (max-width:767px){.mfui-9-content-area__inner{padding-left:16px;padding-right:16px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-9-content-area__inner{padding-left:48px;padding-right:48px}}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-9-content-area__inner{padding-left:64px;padding-right:64px}}@media screen and (max-width:767px){.mfui-9-content-area__inner_disable-indents_mobile{padding-left:0;padding-right:0}}@media screen and (max-width:1023px){.mfui-9-content-area__inner_disable-indents_mobile-tablet{padding-left:0;padding-right:0}}@media screen and (min-width:768px){.mfui-9-content-area__inner_disable-indents_tablet-desktop{padding-left:0;padding-right:0}}.mfui-9-content-area__inner_disable-indents_all{padding-left:0;padding-right:0}@media screen and (max-width:359px){.mfui-9-content-area__inner_indents_small-mobile{padding-left:8px;padding-right:8px}}.mfui-9-content-area__inner_background-color_transparent{background-color:transparent}.mfui-9-content-area__inner_background-color_black{background-color:var(--stcBlack)}.mfui-9-content-area__inner_background-color_white{background-color:var(--stcWhite)}.mfui-9-content-area__inner_background-color_green{background-color:var(--brandGreen)}.mfui-9-content-area__inner_background-color_purple{background-color:var(--brandPurple)}.mfui-9-content-area__inner_background-color_spbSky0{background-color:var(--spbSky0)}.mfui-9-content-area__inner_background-color_spbSky1{background-color:var(--spbSky1)}.mfui-9-content-area__inner_background-color_spbSky2{background-color:var(--spbSky2)}
+h1,h2,h3,h4,h5{margin:0}.mfui-9-content-area_background-color_transparent{background-color:transparent}.mfui-9-content-area_background-color_black{background-color:var(--stcBlack)}.mfui-9-content-area_background-color_white{background-color:var(--stcWhite)}.mfui-9-content-area_background-color_green{background-color:var(--brandGreen)}.mfui-9-content-area_background-color_purple{background-color:var(--brandPurple)}.mfui-9-content-area_background-color_spbSky0{background-color:var(--spbSky0)}.mfui-9-content-area_background-color_spbSky1{background-color:var(--spbSky1)}.mfui-9-content-area_background-color_spbSky2{background-color:var(--spbSky2)}.mfui-9-content-area__inner{-webkit-box-sizing:content-box;box-sizing:content-box;margin:0 auto;max-width:1440px;padding-left:80px;padding-right:80px}@media screen and (max-width:767px){.mfui-9-content-area__inner{padding-left:16px;padding-right:16px}}@media screen and (min-width:768px) and (max-width:1023px){.mfui-9-content-area__inner{padding-left:48px;padding-right:48px}}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-9-content-area__inner{padding-left:64px;padding-right:64px}}@media screen and (max-width:767px){.mfui-9-content-area__inner_disable-indents_mobile{padding-left:0;padding-right:0}}@media screen and (max-width:1023px){.mfui-9-content-area__inner_disable-indents_mobile-desktop-small,.mfui-9-content-area__inner_disable-indents_mobile-tablet{padding-left:0;padding-right:0}}@media screen and (min-width:1024px) and (max-width:1279px){.mfui-9-content-area__inner_disable-indents_mobile-desktop-small{padding-left:0;padding-right:0}}@media screen and (min-width:768px){.mfui-9-content-area__inner_disable-indents_tablet-desktop{padding-left:0;padding-right:0}}.mfui-9-content-area__inner_disable-indents_all{padding-left:0;padding-right:0}@media screen and (max-width:359px){.mfui-9-content-area__inner_indents_small-mobile{padding-left:8px;padding-right:8px}}.mfui-9-content-area__inner_background-color_transparent{background-color:transparent}.mfui-9-content-area__inner_background-color_black{background-color:var(--stcBlack)}.mfui-9-content-area__inner_background-color_white{background-color:var(--stcWhite)}.mfui-9-content-area__inner_background-color_green{background-color:var(--brandGreen)}.mfui-9-content-area__inner_background-color_purple{background-color:var(--brandPurple)}.mfui-9-content-area__inner_background-color_spbSky0{background-color:var(--spbSky0)}.mfui-9-content-area__inner_background-color_spbSky1{background-color:var(--spbSky1)}.mfui-9-content-area__inner_background-color_spbSky2{background-color:var(--spbSky2)}

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

@@ -14,6 +14,7 @@ export type BackgroundColorType = (typeof BACKGROUND_COLORS)[keyof typeof BACKGR
 declare const DisableIndents: {
     readonly MOBILE: "mobile";
     readonly MOBILE_TABLET: "mobile-tablet";
+    readonly MOBILE_DESKTOP_SMALL: "mobile-desktop-small";
     readonly TABLET_DESKTOP: "tablet-desktop";
     readonly ALL: "all";
 };
@@ -22,7 +23,7 @@ declare const Indents: {
 };
 type DisableIndentsType = (typeof DisableIndents)[keyof typeof DisableIndents];
 type IndentsType = (typeof Indents)[keyof typeof Indents];
-export interface IConrentAreaProps {
+export interface IContentAreaProps {
     /** Фоновый цвет внешнего контейнера */
     outerBackgroundColor?: BackgroundColorType;
     /** Фоновый цвет внутреннего контейнера */
@@ -45,5 +46,5 @@ export interface IConrentAreaProps {
     };
     children: React.ReactNode;
 }
-declare const ContentArea: React.FC<IConrentAreaProps>;
+declare const ContentArea: React.FC<IContentAreaProps>;
 export default ContentArea;

package/dist/es/components/ContentArea/ContentArea.js

@@ -14,8 +14,13 @@ var BACKGROUND_COLORS = {
 };
 var DisableIndents = {
   MOBILE: 'mobile',
+  // <= 767
   MOBILE_TABLET: 'mobile-tablet',
+  // <= 1023
+  MOBILE_DESKTOP_SMALL: 'mobile-desktop-small',
+  // <= 1279
   TABLET_DESKTOP: 'tablet-desktop',
+  // >= 768
   ALL: 'all'
 };
 var Indents = {

package/dist/es/components/Snackbar/Snackbar.css

@@ -1 +1 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-9-snackbar{-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;width:480px;z-index:1}@-webkit-keyframes snackbar-show{0%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}}@keyframes snackbar-show{0%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}}@-webkit-keyframes snackbar-hide{0%{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}99%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{display:none}}@keyframes snackbar-hide{0%{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}99%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{display:none}}@media screen and (max-width:767px){.mfui-9-snackbar{width:304px}}.mfui-9-snackbar_move{-webkit-transition:none;transition:none}.mfui-9-snackbar .mfui-9-snackbar__tile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-animation:snackbar-show .2s linear .2s 1 forwards;animation:snackbar-show .2s linear .2s 1 forwards;background-color:var(--content);border:2px solid var(--stcWhite10);justify-content:space-between;min-height:64px;opacity:0;padding:12px 16px 12px 12px}@media screen and (max-width:767px){.mfui-9-snackbar .mfui-9-snackbar__tile{min-height:48px}}.mfui-9-snackbar__tile_closed{-webkit-animation:snackbar-hide .1s linear 1;animation:snackbar-hide .1s linear 1}.mfui-9-snackbar__tile_type_success .mfui-9-snackbar__icon-container svg{fill:var(--brandGreen)}.mfui-9-snackbar__tile_type_attention .mfui-9-snackbar__icon-container svg{fill:var(--fury80)}.mfui-9-snackbar__icon-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;height:32px;justify-content:center;margin-right:8px;min-width:32px;width:32px}.mfui-9-snackbar__icon-container svg{fill:var(--base)}@media screen and (max-width:767px){.mfui-9-snackbar__icon-container{height:20px;min-width:20px;width:20px}}.mfui-9-snackbar__icon-container_desktop{display:none}@media screen and (min-width:768px){.mfui-9-snackbar__icon-container_desktop{display:block}}.mfui-9-snackbar__icon-container_mobile{display:none}@media screen and (max-width:767px){.mfui-9-snackbar__icon-container_mobile{display:block}}.mfui-9-snackbar__text-wrapper{-webkit-box-flex:1;-ms-flex-positive:1;color:var(--base);flex-grow:1}@media screen and (max-width:767px){.mfui-9-snackbar__text-wrapper{-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0}}.mfui-9-snackbar__text{display:none;overflow:hidden}@media screen and (min-width:768px){.mfui-9-snackbar__text_desktop{display:block;max-height:48px}}@media screen and (max-width:767px){.mfui-9-snackbar__text_mobile{display:block;max-height:36px}}.mfui-9-snackbar__text_short{max-width:272px}.mfui-9-snackbar__text-button{margin-left:12px;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.mfui-9-snackbar__close-button{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:transparent;border:none;border-radius:40px;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:32px;justify-content:center;margin-left:24px;padding:0;width:32px}@media screen and (max-width:767px){.mfui-9-snackbar__close-button{display:none}}.mfui-9-snackbar__close-button:hover{background-color:hsla(0,0%,60%,.2)}.mfui-9-snackbar__close-button:active{background-color:hsla(0,0%,60%,.4)}.mfui-9-snackbar__close-button-icon{height:40px;min-width:40px;width:40px;fill:var(--spbSky3)}
+h1,h2,h3,h4,h5{margin:0}.mfui-9-snackbar{-webkit-transition:-webkit-transform .3s;transition:-webkit-transform .3s;transition:transform .3s;transition:transform .3s,-webkit-transform .3s;width:480px;z-index:1}@-webkit-keyframes snackbar-show{0%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}}@keyframes snackbar-show{0%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}}@-webkit-keyframes snackbar-hide{0%{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}99%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{display:none}}@keyframes snackbar-hide{0%{opacity:1;-webkit-transform:scale(100%);transform:scale(100%)}99%{opacity:0;-webkit-transform:scale(90%);transform:scale(90%)}to{display:none}}@media screen and (max-width:767px){.mfui-9-snackbar{width:304px}}.mfui-9-snackbar_move{-webkit-transition:none;transition:none}.mfui-9-snackbar .mfui-9-snackbar__tile{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;-webkit-animation:snackbar-show .2s linear .2s 1 forwards;animation:snackbar-show .2s linear .2s 1 forwards;background-color:var(--content);border:2px solid var(--stcWhite10);justify-content:space-between;min-height:64px;opacity:0;padding:12px 16px 12px 12px}@media screen and (max-width:767px){.mfui-9-snackbar .mfui-9-snackbar__tile{min-height:48px}}.mfui-9-snackbar__tile_closed{-webkit-animation:snackbar-hide .1s linear 1;animation:snackbar-hide .1s linear 1}.mfui-9-snackbar__tile_type_success .mfui-9-snackbar__icon-container svg{fill:var(--brandGreen)}.mfui-9-snackbar__tile_type_attention .mfui-9-snackbar__icon-container svg{fill:var(--fury80)}.mfui-9-snackbar__icon-container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;height:32px;justify-content:center;margin-right:8px;min-width:32px;width:32px}.mfui-9-snackbar__icon-container svg{fill:var(--base)}@media screen and (max-width:767px){.mfui-9-snackbar__icon-container{height:20px;min-width:20px;width:20px}}.mfui-9-snackbar__icon-container_desktop{display:none}@media screen and (min-width:768px){.mfui-9-snackbar__icon-container_desktop{display:block}}.mfui-9-snackbar__icon-container_mobile{display:none}@media screen and (max-width:767px){.mfui-9-snackbar__icon-container_mobile{display:block}}.mfui-9-snackbar__text-wrapper{-webkit-box-flex:1;-ms-flex-positive:1;color:var(--base);flex-grow:1}@media screen and (max-width:767px){.mfui-9-snackbar__text-wrapper{-webkit-box-flex:1;-ms-flex:1 0 0px;flex:1 0 0}}.mfui-9-snackbar__text{display:none;overflow:hidden}@media screen and (min-width:768px){.mfui-9-snackbar__text_desktop{display:block;max-height:48px}}@media screen and (max-width:767px){.mfui-9-snackbar__text_mobile{display:block;max-height:36px}}.mfui-9-snackbar__text_short{max-width:272px}.mfui-9-snackbar__text-button{margin-left:12px;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}.mfui-9-snackbar__close-button{margin-left:24px}

package/dist/es/components/Snackbar/Snackbar.js

@@ -4,8 +4,10 @@ import _extends from "@babel/runtime/helpers/extends";
 import "core-js/modules/web.timers.js";
 import * as React from 'react';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import useResolution from "../../hooks/useResolution";
 import useSwipe, { TransitionSteps } from "../../hooks/useSwipe";
 import Button from "../Buttons/Button/Button";
+import ButtonClose from "../Buttons/ButtonClose/ButtonClose";
 import Caption from "../Caption/Caption";
 import Header from "../Header/Header";
 import Tile from "../Tile/Tile";
@@ -53,13 +55,6 @@ var CheckedIcon24 = function CheckedIcon24(props) {
     d: "M22.2 9l-7.8 9.4-3.6-3.7L9 16.5c3.6 3.7 5.4 5.5 5.5 5.5.1 0 3.3-3.8 9.5-11.3L22.2 9z"
   }));
 };
-var CancelIcon = function CancelIcon(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
-    viewBox: "0 0 40 40"
-  }, props), /*#__PURE__*/React.createElement("path", {
-    d: "M20 18.586l6.364-6.364 1.414 1.414L21.414 20l6.364 6.364-1.414 1.414L20 21.414l-6.364 6.364-1.414-1.414L18.586 20l-6.364-6.364 1.414-1.414L20 18.586z"
-  }));
-};
 var DEFAULT_MAX_TIMER_SECONDS = 4;
 var CLOSE_DELAY_MS = 80;
 export var SnackbarTypes = {
@@ -110,6 +105,8 @@ var Snackbar = function Snackbar(_ref) {
     dataAttrs = _ref.dataAttrs,
     onClose = _ref.onClose,
     onButtonClick = _ref.onButtonClick;
+  var _useResolution = useResolution(),
+    isMobile = _useResolution.isMobile;
   var _React$useState = React.useState(true),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     isOpened = _React$useState2[0],
@@ -221,13 +218,11 @@ var Snackbar = function Snackbar(_ref) {
       root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.textButton
     },
     onClick: handleTextButtonClick
-  }, currentButtonText), /*#__PURE__*/React.createElement("button", _extends({
-    type: "button",
-    className: cn('close-button')
-  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.closeButton), {
+  }, currentButtonText), !isMobile && /*#__PURE__*/React.createElement(ButtonClose, _extends({
+    className: cn('close-button'),
+    size: "medium",
+    theme: "black",
     onClick: handleClose
-  }), /*#__PURE__*/React.createElement(CancelIcon, {
-    className: cn('close-button-icon')
-  }))));
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.closeButton)))));
 };
 export default Snackbar;

package/dist/es/components/Stepper/Stepper.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-9-stepper{gap:16px}.mfui-9-stepper,.mfui-9-stepper__items-wrap{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.mfui-9-stepper__items-wrap{gap:12px;overflow-x:auto}.mfui-9-stepper::-webkit-scrollbar{height:8px}.mfui-9-stepper::-webkit-scrollbar-thumb{background-color:var(--spbSky2);border-radius:8px}.mfui-9-stepper_is-horizontal .mfui-9-stepper__items-wrap{-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}

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

@@ -0,0 +1,52 @@
+import * as React from 'react';
+import type { IStepperItemProps } from './StepperItem';
+import './Stepper.scss';
+export type StepperItemType = Pick<IStepperItemProps, 'title' | 'text' | 'icon' | 'linkText' | 'linkUrl'>;
+export interface IStepperProps {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Дополнительные классы элементов */
+    classes?: {
+        root?: string;
+        itemsWrap?: string;
+        item?: string;
+        itemIconButton?: string;
+        itemTitle?: string;
+        itemText?: string;
+        itemLink?: string;
+    };
+    /** Ссылка на корневой элемент */
+    rootRef?: React.Ref<HTMLDivElement>;
+    /** Индекс активного шага */
+    activeStep?: number;
+    /** Количество шагов */
+    stepCount?: number;
+    /** Шаги */
+    items?: StepperItemType[];
+    /** Направление */
+    isHorizontal?: boolean;
+    /** Цифры вместо галочек */
+    isNumeric?: boolean;
+    /** Отключение кнопок */
+    isDisabled?: boolean;
+    /** Все шаги пройдены */
+    isAllChecked?: boolean;
+    /** Отображение контента только активного шага */
+    showActiveStepContent?: boolean;
+    /** Выравнивание */
+    align?: 'center' | 'left';
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        itemsWrap?: Record<string, string>;
+        item?: Record<string, string>;
+        itemIconButton?: Record<string, string>;
+        itemTitle?: Record<string, string>;
+        itemText?: Record<string, string>;
+        itemLink?: Record<string, string>;
+    };
+    /** Обработчик события смены шага */
+    onChange?: (index: number) => void;
+}
+declare const Stepper: React.FC<IStepperProps>;
+export default Stepper;

package/dist/es/components/Stepper/Stepper.js

@@ -0,0 +1,159 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _extends from "@babel/runtime/helpers/extends";
+import "core-js/modules/es.array.from.js";
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.string.iterator.js";
+import * as React from 'react';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import StepperItem, { STEPPER_ITEM_THEME_ENUM, STEPPER_ITEM_VIEW_ENUM } from "./StepperItem";
+import "./Stepper.css";
+var CheckedIcon = function CheckedIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    viewBox: "0 0 20 20"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M8.832 11.547L6.619 9.335l-1.414 1.413 2.462 2.462 1.445 1.446 5.932-8.486-1.638-1.148-4.574 6.525z"
+  }));
+};
+var cn = cnCreate('mfui-9-stepper');
+var Stepper = function Stepper(_ref) {
+  var className = _ref.className,
+    _ref$classes = _ref.classes,
+    _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
+    rootClassName = _ref$classes2.root,
+    itemsWrapClassName = _ref$classes2.itemsWrap,
+    itemClassName = _ref$classes2.item,
+    itemIconButtonClassName = _ref$classes2.itemIconButton,
+    itemTitleClassName = _ref$classes2.itemTitle,
+    itemTextClassname = _ref$classes2.itemText,
+    itemLinkClassName = _ref$classes2.itemLink,
+    rootRef = _ref.rootRef,
+    _ref$activeStep = _ref.activeStep,
+    activeStep = _ref$activeStep === void 0 ? 0 : _ref$activeStep,
+    _ref$stepCount = _ref.stepCount,
+    stepCount = _ref$stepCount === void 0 ? 2 : _ref$stepCount,
+    _ref$items = _ref.items,
+    items = _ref$items === void 0 ? [] : _ref$items,
+    _ref$isHorizontal = _ref.isHorizontal,
+    isHorizontal = _ref$isHorizontal === void 0 ? true : _ref$isHorizontal,
+    isNumeric = _ref.isNumeric,
+    isDisabled = _ref.isDisabled,
+    isAllChecked = _ref.isAllChecked,
+    _ref$showActiveStepCo = _ref.showActiveStepContent,
+    showActiveStepContent = _ref$showActiveStepCo === void 0 ? false : _ref$showActiveStepCo,
+    _ref$align = _ref.align,
+    align = _ref$align === void 0 ? 'center' : _ref$align,
+    _ref$dataAttrs = _ref.dataAttrs,
+    _ref$dataAttrs2 = _ref$dataAttrs === void 0 ? {} : _ref$dataAttrs,
+    rootAttrs = _ref$dataAttrs2.root,
+    itemsWrapAttrs = _ref$dataAttrs2.itemsWrap,
+    itemAttrs = _ref$dataAttrs2.item,
+    itemIconButtonAttrs = _ref$dataAttrs2.itemIconButton,
+    itemTitleAttrs = _ref$dataAttrs2.itemTitle,
+    itemTextAttrs = _ref$dataAttrs2.itemText,
+    itemLinkAttrs = _ref$dataAttrs2.itemLink,
+    _ref$onChange = _ref.onChange,
+    onChange = _ref$onChange === void 0 ? function () {
+      return null;
+    } : _ref$onChange;
+  var _React$useState = React.useState(activeStep),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    currentIndex = _React$useState2[0],
+    setCurrentIndex = _React$useState2[1];
+  var hasCustomItems = !!items.length;
+  var isHorizontalContent = isHorizontal || showActiveStepContent;
+  var currentItems = hasCustomItems ? items : Array.from({
+    length: stepCount
+  });
+  var isCorrectDisabled = React.useMemo(function () {
+    return !!isAllChecked || !!isDisabled;
+  }, [isAllChecked, isDisabled]);
+  var defineItemTheme = React.useCallback(function (index) {
+    switch (true) {
+      case isAllChecked:
+      case index < currentIndex:
+        {
+          return STEPPER_ITEM_THEME_ENUM.CHECKED;
+        }
+      case index === currentIndex:
+        {
+          return STEPPER_ITEM_THEME_ENUM.ACTIVE;
+        }
+      default:
+        {
+          return STEPPER_ITEM_THEME_ENUM.DEFAULT;
+        }
+    }
+  }, [currentIndex, isAllChecked]);
+  var handleClickItem = React.useCallback(function (index) {
+    return function () {
+      if (isCorrectDisabled) {
+        return;
+      }
+      setCurrentIndex(index);
+      onChange(index);
+    };
+  }, [isCorrectDisabled, onChange]);
+  React.useEffect(function () {
+    if (activeStep === undefined) {
+      return;
+    }
+    setCurrentIndex(activeStep);
+  }, [activeStep]);
+  var renderIcon = React.useCallback(function (index, theme) {
+    var isChecked = theme === STEPPER_ITEM_THEME_ENUM.CHECKED;
+    if (isNumeric || !isChecked) {
+      return index + 1;
+    }
+    return /*#__PURE__*/React.createElement(CheckedIcon, null);
+  }, [isNumeric]);
+  var renderItem = React.useCallback(function (props, index) {
+    return /*#__PURE__*/React.createElement(StepperItem, _extends({}, props, {
+      key: index,
+      className: itemClassName,
+      classes: {
+        iconButton: itemIconButtonClassName,
+        title: itemTitleClassName,
+        text: itemTextClassname,
+        link: itemLinkClassName
+      },
+      dataAttrs: {
+        root: itemAttrs,
+        iconButton: itemIconButtonAttrs,
+        title: itemTitleAttrs,
+        text: itemTextAttrs,
+        link: itemLinkAttrs
+      }
+    }));
+  }, [itemAttrs, itemIconButtonAttrs, itemIconButtonClassName, itemClassName, itemLinkAttrs, itemLinkClassName, itemTextAttrs, itemTextClassname, itemTitleAttrs, itemTitleClassName]);
+  var renderItems = React.useMemo(function () {
+    return currentItems.map(function (elem, i) {
+      var item = elem || {};
+      var itemTheme = defineItemTheme(i);
+      var itemIcon = item.icon || renderIcon(i, itemTheme);
+      return renderItem(_extends(_extends({}, item), {
+        icon: itemIcon,
+        hasSeparator: i < currentItems.length - 1,
+        isHorizontal: isHorizontalContent,
+        isDisabled: isCorrectDisabled,
+        align: align,
+        theme: itemTheme,
+        view: showActiveStepContent ? STEPPER_ITEM_VIEW_ENUM.ICON : STEPPER_ITEM_VIEW_ENUM.DEFAULT,
+        onClick: handleClickItem(i)
+      }), i);
+    });
+  }, [align, currentItems, isCorrectDisabled, showActiveStepContent, isHorizontalContent, defineItemTheme, handleClickItem, renderIcon, renderItem]);
+  var renderSingleItem = renderItem(_extends(_extends({}, currentItems[currentIndex]), {
+    isDisabled: isCorrectDisabled,
+    align: align,
+    view: STEPPER_ITEM_VIEW_ENUM.CONTENT
+  }));
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(rootAttrs), {
+    className: cn([className, rootClassName], {
+      'is-horizontal': isHorizontalContent
+    }),
+    ref: rootRef
+  }), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(itemsWrapAttrs), {
+    className: cn('items-wrap', [itemsWrapClassName])
+  }), renderItems), showActiveStepContent && renderSingleItem);
+};
+export default Stepper;

package/dist/es/components/Stepper/StepperItem.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-9-stepper-item{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;gap:16px}.mfui-9-stepper-item_is-horizontal{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-9-stepper-item_is-horizontal .mfui-9-stepper-item__separator{-o-border-image:url(img/separator-mobile.png) 2 round;border-image:url(img/separator-mobile.png) 2 round;border-left:none;border-radius:100px;border-top:2px solid transparent;height:2px;left:calc(50% + 22px);min-height:2px;position:absolute;top:19px;width:calc(100% - 32px)}@media screen and (min-width:768px){.mfui-9-stepper-item_is-horizontal .mfui-9-stepper-item__separator{-o-border-image:url(img/separator.png) 2 repeat;border-image:url(img/separator.png) 2 repeat}}@media screen and (min-width:1024px){.mfui-9-stepper-item_is-horizontal .mfui-9-stepper-item__separator{left:calc(50% + 32px);width:calc(100% - 52px)}}.mfui-9-stepper-item_theme_active .mfui-9-stepper-item__icon-button{background-color:var(--night20)}.mfui-9-stepper-item_theme_active .mfui-9-stepper-item__icon{background-color:var(--night)}.mfui-9-stepper-item_theme_checked .mfui-9-stepper-item__icon-button{background-color:var(--brandGreen20)}.mfui-9-stepper-item_theme_checked .mfui-9-stepper-item__icon{background-color:var(--brandGreen)}.mfui-9-stepper-item_theme_checked .mfui-9-stepper-item__separator{border-color:var(--brandGreen);-o-border-image:none;border-image:none}.mfui-9-stepper-item_align_left{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.mfui-9-stepper-item_align_left .mfui-9-stepper-item__separator{left:42px;right:0}@media screen and (min-width:1024px){.mfui-9-stepper-item_align_left .mfui-9-stepper-item__separator{left:auto}}.mfui-9-stepper-item_align_left .mfui-9-stepper-item__content,.mfui-9-stepper-item_align_left .mfui-9-stepper-item__icon-button-area{-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.mfui-9-stepper-item__icon-button-area{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:12px;-ms-flex-align:center;-ms-flex-item-align:stretch;align-self:stretch}.mfui-9-stepper-item__icon-button,.mfui-9-stepper-item__icon-button-area{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;align-items:center}.mfui-9-stepper-item__icon-button{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky0);border:none;border-radius:100%;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer;height:40px;justify-content:center;outline:none;-webkit-transition:background-color .25s ease-out;transition:background-color .25s ease-out;width:40px}.mfui-9-stepper-item__icon-button:disabled{cursor:default}.mfui-9-stepper-item__icon{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;background-color:var(--spbSky2);border-radius:100%;color:var(--stcWhite);font-weight:500;height:24px;justify-content:center;-webkit-transition:background-color .25s ease-out;transition:background-color .25s ease-out;width:24px}.mfui-9-stepper-item__icon svg{height:20px;width:20px;fill:var(--stcWhite)}.mfui-9-stepper-item__separator{-o-border-image:url(img/separator-vertical.png) 2 repeat;border-image:url(img/separator-vertical.png) 2 repeat;border-left:2px solid transparent;border-top:none;height:100%;min-height:20px;position:static;-webkit-transition:border-color .25s ease-out;transition:border-color .25s ease-out;width:2px}.mfui-9-stepper-item__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:4px;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-width:160px;padding-bottom:20px}.mfui-9-stepper-item__link{margin-top:13px}

package/dist/es/components/Stepper/StepperItem.d.ts

@@ -0,0 +1,57 @@
+import * as React from 'react';
+import './StepperItem.scss';
+export declare enum STEPPER_ITEM_THEME_ENUM {
+    CHECKED = "checked",
+    ACTIVE = "active",
+    DEFAULT = "default"
+}
+export declare enum STEPPER_ITEM_VIEW_ENUM {
+    ICON = "icon",
+    CONTENT = "content",
+    DEFAULT = "default"
+}
+export interface IStepperItemProps {
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Дополнительные классы элементов */
+    classes?: {
+        iconButton?: string;
+        title?: string;
+        text?: string;
+        link?: string;
+    };
+    /** Тема */
+    theme?: STEPPER_ITEM_THEME_ENUM;
+    /** Заголовок */
+    title?: string;
+    /** Текст */
+    text?: string;
+    /** Текст ссылки */
+    linkText?: string;
+    /** Адрес ссылки */
+    linkUrl?: string;
+    /** Иконка */
+    icon?: string | number | JSX.Element;
+    /** Наличие разделителя */
+    hasSeparator?: boolean;
+    /** Направление */
+    isHorizontal?: boolean;
+    /** Отключение */
+    isDisabled?: boolean;
+    /** Выравнивание */
+    align?: 'center' | 'left';
+    /** Варианты отображения */
+    view?: STEPPER_ITEM_VIEW_ENUM;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        iconButton?: Record<string, string>;
+        title?: Record<string, string>;
+        text?: Record<string, string>;
+        link?: Record<string, string>;
+    };
+    /** Обработчик события клика */
+    onClick?: () => void;
+}
+declare const StepperItem: React.FC<IStepperItemProps>;
+export default StepperItem;