@megafon/ui-core 6.2.1 → 6.4.0

package/dist/es/components/Switcher/Switcher.css

@@ -1,10 +1,10 @@
-.mfui-switcher {
+.mfui-v6-switcher {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-tap-highlight-color: transparent;
 }
-.mfui-switcher__content {
+.mfui-v6-switcher__content {
   font-size: 15px;
   line-height: 24px;
   font-weight: 400;
@@ -12,18 +12,18 @@
       align-self: center;
   margin-left: 12px;
 }
-.mfui-switcher__content_size_small {
+.mfui-v6-switcher__content_size_small {
   font-size: 12px;
   line-height: 18px;
 }
-.mfui-switcher__content_left {
+.mfui-v6-switcher__content_left {
   margin-right: 12px;
   margin-left: 0;
 }
-.mfui-switcher__content_left + .mfui-switcher__input {
+.mfui-v6-switcher__content_left + .mfui-v6-switcher__input {
   margin-left: auto;
 }
-.mfui-switcher__pointer {
+.mfui-v6-switcher__pointer {
   position: relative;
   top: 2px;
   left: 2px;
@@ -34,7 +34,7 @@
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
 }
-.mfui-switcher__loader {
+.mfui-v6-switcher__loader {
   position: absolute;
   top: 0;
   right: 0;
@@ -42,7 +42,7 @@
   left: 0;
   overflow: hidden;
 }
-.mfui-switcher__loader:before {
+.mfui-v6-switcher__loader:before {
   content: '';
   position: absolute;
   top: 0;
@@ -75,7 +75,7 @@
             transform: translateX(0);
   }
 }
-.mfui-switcher__timer {
+.mfui-v6-switcher__timer {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -86,7 +86,7 @@
   -webkit-transform: translate(-50%, -50%);
           transform: translate(-50%, -50%);
 }
-.mfui-switcher__timer-icon {
+.mfui-v6-switcher__timer-icon {
   position: absolute;
   top: 50%;
   left: 50%;
@@ -96,7 +96,7 @@
           transform: translate(-50%, -50%);
   fill: var(--spbSky2);
 }
-.mfui-switcher__input {
+.mfui-v6-switcher__input {
   position: relative;
   -ms-flex-item-align: start;
       align-self: flex-start;
@@ -113,48 +113,48 @@
   -webkit-transition: background-color 0.3s;
   transition: background-color 0.3s;
 }
-.mfui-switcher__input_disabled {
+.mfui-v6-switcher__input_disabled {
   background-color: var(--spbSky1);
 }
-.mfui-switcher__input_disabled,
-.mfui-switcher__input_loaded,
-.mfui-switcher__input_waiting {
+.mfui-v6-switcher__input_disabled,
+.mfui-v6-switcher__input_loaded,
+.mfui-v6-switcher__input_waiting {
   cursor: default;
 }
-.mfui-switcher__input:hover:not(.mfui-switcher__input_disabled) {
+.mfui-v6-switcher__input:hover:not(.mfui-v6-switcher__input_disabled) {
   background-color: var(--spbSky2);
 }
-.mfui-switcher__input_checked:not(.mfui-switcher__input_disabled) {
+.mfui-v6-switcher__input_checked:not(.mfui-v6-switcher__input_disabled) {
   border-color: var(--brandGreen);
   background-color: var(--brandGreen);
 }
-.mfui-switcher__input_checked:hover:not(.mfui-switcher__input_disabled) {
+.mfui-v6-switcher__input_checked:hover:not(.mfui-v6-switcher__input_disabled) {
   border-color: var(--buttonHoverGreen);
   background-color: var(--buttonHoverGreen);
 }
-.mfui-switcher__input_disabled .mfui-switcher__pointer {
+.mfui-v6-switcher__input_disabled .mfui-v6-switcher__pointer {
   background-color: var(--spbSky2);
 }
-.mfui-switcher__input_checked .mfui-switcher__pointer {
+.mfui-v6-switcher__input_checked .mfui-v6-switcher__pointer {
   left: 22px;
 }
-.mfui-switcher__input_checked .mfui-switcher__loader:before {
+.mfui-v6-switcher__input_checked .mfui-v6-switcher__loader:before {
   background: -webkit-gradient(linear, left top, right top, from(var(--brandGreen)), color-stop(16%, var(--buttonHoverGreen)), color-stop(33%, var(--brandGreen)), color-stop(50%, var(--buttonHoverGreen)), color-stop(66%, var(--brandGreen)), color-stop(82%, var(--buttonHoverGreen)), to(var(--brandGreen)));
   background: linear-gradient(90deg, var(--brandGreen) 0%, var(--buttonHoverGreen) 16%, var(--brandGreen) 33%, var(--buttonHoverGreen) 50%, var(--brandGreen) 66%, var(--buttonHoverGreen) 82%, var(--brandGreen) 100%);
 }
-.mfui-switcher_disabled .mfui-switcher__content {
+.mfui-v6-switcher_disabled .mfui-v6-switcher__content {
   color: var(--spbSky3);
 }
-.mfui-switcher_theme_on-gray .mfui-switcher__input:not(.mfui-switcher__input_checked),
-.mfui-switcher_theme_on-gray .mfui-switcher__input_disabled {
+.mfui-v6-switcher_theme_on-gray .mfui-v6-switcher__input:not(.mfui-v6-switcher__input_checked),
+.mfui-v6-switcher_theme_on-gray .mfui-v6-switcher__input_disabled {
   background-color: var(--spbSky2);
 }
-.mfui-switcher_theme_on-gray .mfui-switcher__input:not(.mfui-switcher__input_checked):not(.mfui-switcher__input_disabled):hover {
+.mfui-v6-switcher_theme_on-gray .mfui-v6-switcher__input:not(.mfui-v6-switcher__input_checked):not(.mfui-v6-switcher__input_disabled):hover {
   background-color: var(--spbSky3);
 }
-.mfui-switcher_theme_on-gray .mfui-switcher__input_disabled .mfui-switcher__pointer {
+.mfui-v6-switcher_theme_on-gray .mfui-v6-switcher__input_disabled .mfui-v6-switcher__pointer {
   background-color: var(--spbSky3);
 }
-.mfui-switcher_theme_on-gray .mfui-switcher__timer-icon {
+.mfui-v6-switcher_theme_on-gray .mfui-v6-switcher__timer-icon {
   fill: var(--spbSky3);
 }

package/dist/es/components/Switcher/Switcher.js

@@ -14,7 +14,7 @@ var WaitingIcon = function WaitingIcon(props) {
   }));
 };
 
-var cn = cnCreate('mfui-switcher');
+var cn = cnCreate('mfui-v6-switcher');
 
 var Switcher = function Switcher(_ref) {
   var dataAttrs = _ref.dataAttrs,

package/dist/es/components/Tabs/Tabs.css

@@ -1,4 +1,4 @@
-.mfui-tabs .swiper-wrapper {
+.mfui-v6-tabs .swiper-wrapper {
   position: relative;
   z-index: 0;
   display: -webkit-box;
@@ -6,7 +6,7 @@
   display: flex;
   width: 100%;
 }
-.mfui-tabs__wrapper {
+.mfui-v6-tabs__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -14,15 +14,15 @@
       -ms-flex-pack: center;
           justify-content: center;
 }
-.mfui-tabs__swiper-wrapper {
+.mfui-v6-tabs__swiper-wrapper {
   position: relative;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   width: 100%;
 }
-.mfui-tabs__swiper-wrapper:before,
-.mfui-tabs__swiper-wrapper:after {
+.mfui-v6-tabs__swiper-wrapper:before,
+.mfui-v6-tabs__swiper-wrapper:after {
   content: '';
   position: absolute;
   top: 0;
@@ -34,21 +34,21 @@
   background: linear-gradient(270deg, var(--stcBlack5) 0%, transparent 64%);
   pointer-events: none;
 }
-.mfui-tabs__swiper-wrapper:before {
+.mfui-v6-tabs__swiper-wrapper:before {
   left: 0;
   -webkit-transform: matrix(-1, 0, 0, 1, 0, 0);
           transform: matrix(-1, 0, 0, 1, 0, 0);
 }
-.mfui-tabs__swiper-wrapper:after {
+.mfui-v6-tabs__swiper-wrapper:after {
   right: 0;
 }
-.mfui-tabs__swiper-wrapper_beginning:before {
+.mfui-v6-tabs__swiper-wrapper_beginning:before {
   display: none;
 }
-.mfui-tabs__swiper-wrapper_end:after {
+.mfui-v6-tabs__swiper-wrapper_end:after {
   display: none;
 }
-.mfui-tabs__swiper {
+.mfui-v6-tabs__swiper {
   font-family: inherit;
   font-size: 15px;
   line-height: 24px;
@@ -61,19 +61,19 @@
   overflow: hidden;
   background-color: var(--spbSky0);
 }
-.mfui-tabs__slide {
+.mfui-v6-tabs__slide {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -webkit-box-flex: 1;
       -ms-flex: 1;
           flex: 1;
 }
-.mfui-tabs__panel {
+.mfui-v6-tabs__panel {
   display: none;
 }
-.mfui-tabs__panel_current {
+.mfui-v6-tabs__panel_current {
   display: block;
 }
-.mfui-tabs__underline {
+.mfui-v6-tabs__underline {
   position: absolute;
   top: 0;
   bottom: 0;
@@ -87,14 +87,14 @@
   -webkit-transition-duration: 0.3s;
           transition-duration: 0.3s;
 }
-.mfui-tabs__underline:before {
+.mfui-v6-tabs__underline:before {
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   background-color: var(--stcWhite20);
 }
-.mfui-tabs__arrow {
+.mfui-v6-tabs__arrow {
   position: absolute;
   top: 50%;
   z-index: 2;
@@ -114,29 +114,29 @@
   fill: var(--base);
 }
 @media screen and (max-width: 1023px) {
-  .mfui-tabs__arrow {
+  .mfui-v6-tabs__arrow {
     display: none;
   }
 }
-.mfui-tabs__arrow:hover {
+.mfui-v6-tabs__arrow:hover {
   background-color: var(--spbSky3);
 }
-.mfui-tabs__arrow:active {
+.mfui-v6-tabs__arrow:active {
   background-color: var(--buttonDown);
 }
-.mfui-tabs__arrow_prev {
+.mfui-v6-tabs__arrow_prev {
   left: 14px;
 }
-.mfui-tabs__arrow_next {
+.mfui-v6-tabs__arrow_next {
   right: 14px;
   -webkit-transform: translateY(-50%) rotate(180deg);
           transform: translateY(-50%) rotate(180deg);
 }
-.mfui-tabs__arrow_hide {
+.mfui-v6-tabs__arrow_hide {
   opacity: 0;
   pointer-events: none;
 }
-.mfui-tabs__tab-inner {
+.mfui-v6-tabs__tab-inner {
   font-size: 15px;
   line-height: 24px;
   font-weight: 500;
@@ -163,107 +163,107 @@
   transition: color 0.3s, fill 0.3s;
   fill: var(--content);
 }
-.mfui-tabs__tab-inner:hover {
+.mfui-v6-tabs__tab-inner:hover {
   text-decoration: none;
 }
-.mfui-tabs__tab-inner:not(.mfui-tabs__tab-inner_current) {
+.mfui-v6-tabs__tab-inner:not(.mfui-v6-tabs__tab-inner_current) {
   opacity: 0.8;
 }
 @media screen and (min-width: 1024px) {
-  .mfui-tabs__tab-inner:not(.mfui-tabs__tab-inner_current):hover {
+  .mfui-v6-tabs__tab-inner:not(.mfui-v6-tabs__tab-inner_current):hover {
     color: var(--content);
     fill: var(--content);
   }
 }
-.mfui-tabs__tab-inner:not(.mfui-tabs__tab-inner_current):hover {
+.mfui-v6-tabs__tab-inner:not(.mfui-v6-tabs__tab-inner_current):hover {
   opacity: 1;
 }
-.mfui-tabs__tab-inner:not(.mfui-tabs__tab-inner_current):active {
+.mfui-v6-tabs__tab-inner:not(.mfui-v6-tabs__tab-inner_current):active {
   color: var(--buttonDown);
   fill: var(--buttonDown);
 }
-.mfui-tabs__tab-inner_with-icon {
+.mfui-v6-tabs__tab-inner_with-icon {
   padding-left: 8px;
 }
-.mfui-tabs__tab-inner_current {
+.mfui-v6-tabs__tab-inner_current {
   color: var(--content);
   cursor: auto;
   fill: var(--content);
 }
-.mfui-tabs__tab-icon {
+.mfui-v6-tabs__tab-icon {
   width: 32px;
   height: 32px;
   margin-right: 4px;
 }
-.mfui-tabs__tab-icon svg {
+.mfui-v6-tabs__tab-icon svg {
   width: 100%;
   height: 100%;
 }
-.mfui-tabs__tab-bubble {
+.mfui-v6-tabs__tab-bubble {
   margin-left: 6px;
 }
-.mfui-tabs_size_large .mfui-tabs__swiper {
+.mfui-v6-tabs_size_large .mfui-v6-tabs__swiper {
   padding: 6px;
 }
 @media screen and (min-width: 768px) {
-  .mfui-tabs_size_large .mfui-tabs__swiper {
+  .mfui-v6-tabs_size_large .mfui-v6-tabs__swiper {
     padding: 8px;
   }
 }
-.mfui-tabs_size_large .mfui-tabs__tab-inner {
+.mfui-v6-tabs_size_large .mfui-v6-tabs__tab-inner {
   height: 48px;
   padding: 8px 24px;
 }
 @media screen and (min-width: 768px) {
-  .mfui-tabs_size_large .mfui-tabs__tab-inner {
+  .mfui-v6-tabs_size_large .mfui-v6-tabs__tab-inner {
     height: 56px;
     padding: 12px 40px;
   }
 }
-.mfui-tabs_size_large .mfui-tabs__tab-inner_with-icon {
+.mfui-v6-tabs_size_large .mfui-v6-tabs__tab-inner_with-icon {
   padding-left: 20px;
 }
 @media screen and (min-width: 768px) {
-  .mfui-tabs_size_large .mfui-tabs__tab-inner_with-icon {
+  .mfui-v6-tabs_size_large .mfui-v6-tabs__tab-inner_with-icon {
     padding-left: 28px;
   }
 }
-.mfui-tabs_size_large .mfui-tabs__tab-icon {
+.mfui-v6-tabs_size_large .mfui-v6-tabs__tab-icon {
   margin-right: 6px;
 }
-.mfui-tabs_size_large .mfui-tabs__tab-bubble {
+.mfui-v6-tabs_size_large .mfui-v6-tabs__tab-bubble {
   margin-left: 12px;
 }
-.mfui-tabs_size_large .mfui-tabs__tab-bubble_with-icon {
+.mfui-v6-tabs_size_large .mfui-v6-tabs__tab-bubble_with-icon {
   margin-left: 6px;
 }
-.mfui-tabs_auto-width .mfui-tabs__swiper {
+.mfui-v6-tabs_auto-width .mfui-v6-tabs__swiper {
   width: auto;
   max-width: 100%;
 }
-.mfui-tabs_auto-width .mfui-tabs__slide {
+.mfui-v6-tabs_auto-width .mfui-v6-tabs__slide {
   -webkit-box-flex: 0;
       -ms-flex: 0 0 auto;
           flex: 0 0 auto;
 }
-.mfui-tabs_auto-width.mfui-tabs_h-align_center .mfui-tabs__swiper-wrapper {
+.mfui-v6-tabs_auto-width.mfui-v6-tabs_h-align_center .mfui-v6-tabs__swiper-wrapper {
   -webkit-box-pack: center;
       -ms-flex-pack: center;
           justify-content: center;
 }
 @media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-tabs_indents .mfui-tabs__swiper-wrapper {
+  .mfui-v6-tabs_indents .mfui-v6-tabs__swiper-wrapper {
     margin: 0 -48px;
     padding: 0 48px;
   }
 }
 @media screen and (max-width: 767px) {
-  .mfui-tabs_indents .mfui-tabs__swiper-wrapper {
+  .mfui-v6-tabs_indents .mfui-v6-tabs__swiper-wrapper {
     margin: 0 -16px;
     padding: 0 16px;
   }
 }
-.mfui-tabs_sticky .mfui-tabs__swiper-wrapper {
+.mfui-v6-tabs_sticky .mfui-v6-tabs__swiper-wrapper {
   position: fixed;
   top: 0;
   right: 0;
@@ -271,36 +271,36 @@
   z-index: 100;
   background-color: var(--base);
 }
-.mfui-tabs_tab-color_gray .mfui-tabs__swiper {
+.mfui-v6-tabs_tab-color_gray .mfui-v6-tabs__swiper {
   background-color: var(--spbSky1);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__swiper {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__swiper {
   background-color: var(--stcBlack20);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__tab-inner:not(.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__tab-inner_current) {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__tab-inner:not(.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__tab-inner_current) {
   color: var(--stcWhite);
   opacity: 0.8;
   fill: var(--stcWhite);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__tab-inner:not(.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__tab-inner_current):hover {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__tab-inner:not(.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__tab-inner_current):hover {
   color: var(--stcWhite);
   opacity: 1;
   fill: var(--stcWhite);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__tab-inner_current {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__tab-inner_current {
   color: var(--stcBlack);
   fill: var(--stcBlack);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__underline {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__underline {
   background-color: var(--stcWhite);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__arrow {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__arrow {
   background-color: var(--stcWhite);
   fill: var(--stcBlack);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__arrow:hover {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__arrow:hover {
   background-color: var(--stcWhite50);
 }
-.mfui-tabs_tab-color_green:not(.mfui-tabs_sticky) .mfui-tabs__arrow:active {
+.mfui-v6-tabs_tab-color_green:not(.mfui-v6-tabs_sticky) .mfui-v6-tabs__arrow:active {
   background-color: var(--stcBlack0);
 }

package/dist/es/components/Tabs/Tabs.js

@@ -38,7 +38,7 @@ export var TabColorTheme = {
   GREEN: 'green',
   GRAY: 'gray'
 };
-var cn = cnCreate('mfui-tabs');
+var cn = cnCreate('mfui-v6-tabs');
 
 var Tabs = function Tabs(_ref) {
   var className = _ref.className,