@megafon/ui-core 2.0.0-beta.97 → 2.1.0

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

@@ -5,289 +5,371 @@ h4,
 h5 {
   margin: 0;
 }
-.mfui-beta-button {
+.mfui-button {
   font-family: inherit;
   font-size: 15px;
   line-height: 24px;
-  font-weight: 500;
-  vertical-align: top;
-  text-align: center;
-  border: none;
-  background-color: transparent;
   display: inline-block;
-  cursor: pointer;
-  outline: none;
-  text-decoration: none;
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
-  color: #FFFFFF;
-  border-radius: 30px;
   padding: 0 32px;
+  border: none;
+  border-radius: 30px;
+  color: #FFFFFF;
+  font-weight: 500;
+  text-align: center;
+  text-decoration: none;
+  vertical-align: top;
+  background-color: transparent;
+  outline: none;
+  cursor: pointer;
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
-.mfui-beta-button:hover {
-  text-decoration: none;
-}
-.mfui-beta-button_disabled {
-  cursor: default;
-}
-.mfui-beta-button__inner {
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  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;
-          justify-content: center;
-  width: 100%;
-  vertical-align: top;
+.mfui-button_size-all_small .mfui-button__inner {
+  min-width: 32px;
+  height: 32px;
 }
-.mfui-beta-button__text {
-  margin-bottom: 2px;
+.mfui-button_size-all_medium .mfui-button__inner {
+  min-width: 48px;
+  height: 48px;
 }
-.mfui-beta-button__content {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
+.mfui-button_size-all_large .mfui-button__inner {
+  min-width: 60px;
+  height: 60px;
 }
-.mfui-beta-button__icon {
+.mfui-button_size-all_small .mfui-button__icon {
   width: 24px;
   height: 24px;
-  margin-right: 8px;
 }
-.mfui-beta-button__icon-arrow {
+.mfui-button_size-all_medium .mfui-button__icon {
   width: 32px;
   height: 32px;
-  margin-left: 4px;
-  margin-right: -8px;
 }
-.mfui-beta-button_size-all_small .mfui-beta-button__inner {
-  height: 32px;
-}
-.mfui-beta-button_size-all_medium .mfui-beta-button__inner {
-  height: 48px;
-}
-.mfui-beta-button_size-all_large .mfui-beta-button__inner {
-  height: 60px;
+.mfui-button_size-all_large .mfui-button__icon {
+  width: 40px;
+  height: 40px;
 }
 @media screen and (min-width: 1280px) {
-  .mfui-beta-button_size-wide_small .mfui-beta-button__inner {
+  .mfui-button_size-wide_small .mfui-button__inner {
+    min-width: 32px;
     height: 32px;
   }
-  .mfui-beta-button_size-wide_medium .mfui-beta-button__inner {
+  .mfui-button_size-wide_medium .mfui-button__inner {
+    min-width: 48px;
     height: 48px;
   }
-  .mfui-beta-button_size-wide_large .mfui-beta-button__inner {
+  .mfui-button_size-wide_large .mfui-button__inner {
+    min-width: 60px;
     height: 60px;
   }
+  .mfui-button_size-wide_small .mfui-button__icon {
+    width: 24px;
+    height: 24px;
+  }
+  .mfui-button_size-wide_medium .mfui-button__icon {
+    width: 32px;
+    height: 32px;
+  }
+  .mfui-button_size-wide_large .mfui-button__icon {
+    width: 40px;
+    height: 40px;
+  }
 }
 @media screen and (min-width: 1024px) {
-  .mfui-beta-button_size-desktop_small .mfui-beta-button__inner {
+  .mfui-button_size-desktop_small .mfui-button__inner {
+    min-width: 32px;
     height: 32px;
   }
-  .mfui-beta-button_size-desktop_medium .mfui-beta-button__inner {
+  .mfui-button_size-desktop_medium .mfui-button__inner {
+    min-width: 48px;
     height: 48px;
   }
-  .mfui-beta-button_size-desktop_large .mfui-beta-button__inner {
+  .mfui-button_size-desktop_large .mfui-button__inner {
+    min-width: 60px;
     height: 60px;
   }
+  .mfui-button_size-desktop_small .mfui-button__icon {
+    width: 24px;
+    height: 24px;
+  }
+  .mfui-button_size-desktop_medium .mfui-button__icon {
+    width: 32px;
+    height: 32px;
+  }
+  .mfui-button_size-desktop_large .mfui-button__icon {
+    width: 40px;
+    height: 40px;
+  }
 }
 @media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-beta-button_size-tablet_small .mfui-beta-button__inner {
+  .mfui-button_size-tablet_small .mfui-button__inner {
+    min-width: 32px;
     height: 32px;
   }
-  .mfui-beta-button_size-tablet_medium .mfui-beta-button__inner {
+  .mfui-button_size-tablet_medium .mfui-button__inner {
+    min-width: 48px;
     height: 48px;
   }
-  .mfui-beta-button_size-tablet_large .mfui-beta-button__inner {
+  .mfui-button_size-tablet_large .mfui-button__inner {
+    min-width: 60px;
     height: 60px;
   }
+  .mfui-button_size-tablet_small .mfui-button__icon {
+    width: 24px;
+    height: 24px;
+  }
+  .mfui-button_size-tablet_medium .mfui-button__icon {
+    width: 32px;
+    height: 32px;
+  }
+  .mfui-button_size-tablet_large .mfui-button__icon {
+    width: 40px;
+    height: 40px;
+  }
 }
 @media screen and (max-width: 767px) {
-  .mfui-beta-button_size-mobile_small .mfui-beta-button__inner {
+  .mfui-button_size-mobile_small .mfui-button__inner {
+    min-width: 32px;
     height: 32px;
   }
-  .mfui-beta-button_size-mobile_medium .mfui-beta-button__inner {
+  .mfui-button_size-mobile_medium .mfui-button__inner {
+    min-width: 48px;
     height: 48px;
   }
-  .mfui-beta-button_size-mobile_large .mfui-beta-button__inner {
+  .mfui-button_size-mobile_large .mfui-button__inner {
+    min-width: 60px;
     height: 60px;
   }
+  .mfui-button_size-mobile_small .mfui-button__icon {
+    width: 24px;
+    height: 24px;
+  }
+  .mfui-button_size-mobile_medium .mfui-button__icon {
+    width: 32px;
+    height: 32px;
+  }
+  .mfui-button_size-mobile_large .mfui-button__icon {
+    width: 40px;
+    height: 40px;
+  }
+}
+.mfui-button:hover {
+  text-decoration: none;
+}
+.mfui-button_disabled {
+  cursor: default;
+}
+.mfui-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;
+          justify-content: center;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  width: 100%;
+  vertical-align: top;
 }
-.mfui-beta-button_size-all_small .mfui-beta-button__icon {
+.mfui-button__text {
+  margin-bottom: 2px;
+}
+.mfui-button__content {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.mfui-button__icon-arrow {
+  width: 32px;
+  height: 32px;
+  margin-right: -8px;
+  margin-left: 4px;
+}
+.mfui-button_content-type_icon {
+  padding: 0;
+}
+.mfui-button_content-type_icon-text .mfui-button__icon {
+  width: 24px;
+  height: 24px;
+  margin-right: 8px;
+  margin-left: -8px;
+}
+.mfui-button_content-type_icon-text.mfui-button_size-all_small .mfui-button__icon {
   display: none;
 }
-.mfui-beta-button_type_primary.mfui-beta-button_theme_green {
-  background-color: #00B956;
+.mfui-button_type_primary.mfui-button_theme_green {
   color: #FFFFFF;
+  background-color: #00B956;
 }
-.mfui-beta-button_type_primary.mfui-beta-button_theme_green svg {
+.mfui-button_type_primary.mfui-button_theme_green svg {
   fill: #FFFFFF;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_green:not(.mfui-beta-button_loading):hover {
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_green:not(.mfui-button_loading):hover {
+  background-color: #10E272;
   -webkit-box-shadow: inset 0 0 0 1px #10E272;
           box-shadow: inset 0 0 0 1px #10E272;
-  background-color: #10E272;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_green:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_green:not(.mfui-button_loading):active {
+  background-color: #404D46;
   -webkit-box-shadow: inset 0 0 0 1px #404D46;
           box-shadow: inset 0 0 0 1px #404D46;
-  background-color: #404D46;
 }
-.mfui-beta-button_type_primary.mfui-beta-button_theme_purple {
-  background-color: #731982;
+.mfui-button_type_primary.mfui-button_theme_purple {
   color: #FFFFFF;
+  background-color: #731982;
 }
-.mfui-beta-button_type_primary.mfui-beta-button_theme_purple svg {
+.mfui-button_type_primary.mfui-button_theme_purple svg {
   fill: #FFFFFF;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_purple:not(.mfui-beta-button_loading):hover {
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_purple:not(.mfui-button_loading):hover {
+  background-color: #A500BF;
   -webkit-box-shadow: inset 0 0 0 1px #A500BF;
           box-shadow: inset 0 0 0 1px #A500BF;
-  background-color: #A500BF;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_purple:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_purple:not(.mfui-button_loading):active {
+  background-color: #404D46;
   -webkit-box-shadow: inset 0 0 0 1px #404D46;
           box-shadow: inset 0 0 0 1px #404D46;
-  background-color: #404D46;
 }
-.mfui-beta-button_type_primary.mfui-beta-button_theme_white {
-  background-color: #FFFFFF;
+.mfui-button_type_primary.mfui-button_theme_white {
   color: #333333;
+  background-color: #FFFFFF;
 }
-.mfui-beta-button_type_primary.mfui-beta-button_theme_white svg {
+.mfui-button_type_primary.mfui-button_theme_white svg {
   fill: #333333;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_white:not(.mfui-beta-button_loading):hover {
-  -webkit-box-shadow: inset 0 0 0 1px #10E272;
-          box-shadow: inset 0 0 0 1px #10E272;
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_white:not(.mfui-button_loading):hover {
   color: #FFFFFF;
   background-color: #10E272;
+  -webkit-box-shadow: inset 0 0 0 1px #10E272;
+          box-shadow: inset 0 0 0 1px #10E272;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_white:not(.mfui-beta-button_loading):hover svg {
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_white:not(.mfui-button_loading):hover svg {
   fill: #FFFFFF;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_theme_white:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_primary.mfui-button_theme_white:not(.mfui-button_loading):active {
+  background-color: #404D46;
   -webkit-box-shadow: inset 0 0 0 1px #404D46;
           box-shadow: inset 0 0 0 1px #404D46;
-  background-color: #404D46;
 }
-.mfui-beta-button.mfui-beta-button_type_primary.mfui-beta-button_disabled,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_disabled,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_disabled:hover,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_disabled:active {
-  -webkit-box-shadow: inset 0 0 0 1px #D8D8D8;
-          box-shadow: inset 0 0 0 1px #D8D8D8;
-  color: rgba(51, 51, 51, 0.5);
-  background-color: #EDEDED;
-}
-.mfui-beta-button.mfui-beta-button_type_primary.mfui-beta-button_disabled svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_disabled svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_disabled:hover svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_primary.mfui-beta-button_disabled:active svg {
-  fill: rgba(51, 51, 51, 0.5);
-}
-.mfui-beta-button_type_outline.mfui-beta-button_theme_green {
-  -webkit-box-shadow: inset 0 0 0 1px #00B956;
-          box-shadow: inset 0 0 0 1px #00B956;
+.mfui-button_type_outline.mfui-button_theme_green {
   color: #00B956;
   background-color: transparent;
+  -webkit-box-shadow: inset 0 0 0 1px #00B956;
+          box-shadow: inset 0 0 0 1px #00B956;
 }
-.mfui-beta-button_type_outline.mfui-beta-button_theme_green svg {
+.mfui-button_type_outline.mfui-button_theme_green svg {
   fill: #00B956;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_green:not(.mfui-beta-button_loading):hover {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_green:not(.mfui-button_loading):hover {
   background-color: rgba(0, 185, 86, 0.07);
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_green:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_green:not(.mfui-button_loading):active {
   background-color: rgba(0, 185, 86, 0.14);
 }
-.mfui-beta-button_type_outline.mfui-beta-button_theme_purple {
-  -webkit-box-shadow: inset 0 0 0 1px #731982;
-          box-shadow: inset 0 0 0 1px #731982;
+.mfui-button_type_outline.mfui-button_theme_purple {
   color: #731982;
   background-color: transparent;
+  -webkit-box-shadow: inset 0 0 0 1px #731982;
+          box-shadow: inset 0 0 0 1px #731982;
 }
-.mfui-beta-button_type_outline.mfui-beta-button_theme_purple svg {
+.mfui-button_type_outline.mfui-button_theme_purple svg {
   fill: #731982;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_purple:not(.mfui-beta-button_loading):hover {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_purple:not(.mfui-button_loading):hover {
   background-color: rgba(115, 25, 130, 0.07);
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_purple:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_purple:not(.mfui-button_loading):active {
   background-color: rgba(115, 25, 130, 0.14);
 }
-.mfui-beta-button_type_outline.mfui-beta-button_theme_white {
-  -webkit-box-shadow: inset 0 0 0 1px #FFFFFF;
-          box-shadow: inset 0 0 0 1px #FFFFFF;
+.mfui-button_type_outline.mfui-button_theme_white {
   color: #FFFFFF;
   background-color: transparent;
+  -webkit-box-shadow: inset 0 0 0 1px #FFFFFF;
+          box-shadow: inset 0 0 0 1px #FFFFFF;
 }
-.mfui-beta-button_type_outline.mfui-beta-button_theme_white svg {
+.mfui-button_type_outline.mfui-button_theme_white svg {
   fill: #FFFFFF;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white:not(.mfui-beta-button_loading):hover {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white:not(.mfui-button_loading):hover {
   background-color: rgba(255, 255, 255, 0.07);
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white:not(.mfui-button_loading):active {
   background-color: rgba(255, 255, 255, 0.14);
 }
-.mfui-beta-button.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled:hover,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled:active {
-  -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
-          box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
-  color: rgba(255, 255, 255, 0.5);
+.mfui-button_type_outline.mfui-button_theme_black {
+  color: #333333;
   background-color: transparent;
-}
-.mfui-beta-button.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled:hover svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_white.mfui-beta-button_disabled:active svg {
-  fill: rgba(255, 255, 255, 0.5);
-}
-.mfui-beta-button_type_outline.mfui-beta-button_theme_black {
   -webkit-box-shadow: inset 0 0 0 1px #333333;
           box-shadow: inset 0 0 0 1px #333333;
-  color: #333333;
-  background-color: transparent;
 }
-.mfui-beta-button_type_outline.mfui-beta-button_theme_black svg {
+.mfui-button_type_outline.mfui-button_theme_black svg {
   fill: #333333;
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_black:not(.mfui-beta-button_loading):hover {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_black:not(.mfui-button_loading):hover {
   background-color: rgba(51, 51, 51, 0.07);
 }
-.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_theme_black:not(.mfui-beta-button_loading):active {
+.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_black:not(.mfui-button_loading):active {
   background-color: rgba(51, 51, 51, 0.14);
 }
-.mfui-beta-button.mfui-beta-button_type_outline.mfui-beta-button_disabled,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_disabled,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_disabled:hover,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_disabled:active {
+.mfui-button_full-width {
+  display: block;
+  width: 100%;
+}
+.mfui-button svg {
+  display: block;
+}
+.mfui-button.mfui-button_type_primary.mfui-button_disabled,
+.mfui-button.mfui-button_no-touch.mfui-button_type_primary.mfui-button_disabled,
+.mfui-button.mfui-button_no-touch.mfui-button_type_primary.mfui-button_disabled:hover,
+.mfui-button.mfui-button_no-touch.mfui-button_type_primary.mfui-button_disabled:active {
+  color: rgba(51, 51, 51, 0.5);
+  background-color: #EDEDED;
   -webkit-box-shadow: inset 0 0 0 1px #D8D8D8;
           box-shadow: inset 0 0 0 1px #D8D8D8;
+}
+.mfui-button.mfui-button_type_primary.mfui-button_disabled svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_primary.mfui-button_disabled svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_primary.mfui-button_disabled:hover svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_primary.mfui-button_disabled:active svg {
+  fill: rgba(51, 51, 51, 0.5);
+}
+.mfui-button.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled:hover,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled:active {
+  color: rgba(255, 255, 255, 0.5);
+  background-color: transparent;
+  -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
+          box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.5);
+}
+.mfui-button.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled:hover svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_theme_white.mfui-button_disabled:active svg {
+  fill: rgba(255, 255, 255, 0.5);
+}
+.mfui-button.mfui-button_type_outline.mfui-button_disabled,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_disabled,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_disabled:hover,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_disabled:active {
   color: rgba(51, 51, 51, 0.5);
   background-color: transparent;
+  -webkit-box-shadow: inset 0 0 0 1px #D8D8D8;
+          box-shadow: inset 0 0 0 1px #D8D8D8;
 }
-.mfui-beta-button.mfui-beta-button_type_outline.mfui-beta-button_disabled svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_disabled svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_disabled:hover svg,
-.mfui-beta-button.mfui-beta-button_no-touch.mfui-beta-button_type_outline.mfui-beta-button_disabled:active svg {
+.mfui-button.mfui-button_type_outline.mfui-button_disabled svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_disabled svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_disabled:hover svg,
+.mfui-button.mfui-button_no-touch.mfui-button_type_outline.mfui-button_disabled:active svg {
   fill: rgba(51, 51, 51, 0.5);
 }
-.mfui-beta-button_full-width {
-  display: block;
-  width: 100%;
-}

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

@@ -1,6 +1,6 @@
 import React, { Ref } from 'react';
+import { IFilterDataAttrs } from '@megafon/ui-helpers';
 import './Button.less';
-import { IDataAttributes } from './../../utils/dataAttrs';
 export declare const ButtonTypes: {
     readonly PRIMARY: "primary";
     readonly OUTLINE: "outline";
@@ -19,17 +19,17 @@ export declare const ButtonSizes: {
     readonly LARGE: "large";
 };
 declare type ButtonSizesType = typeof ButtonSizes[keyof typeof ButtonSizes];
-export interface IButtonProps extends IDataAttributes {
+export interface IButtonProps extends IFilterDataAttrs {
     /** Дополнительный класс корневого элемента */
     className?: string | string[];
     /** Дополнительные классы для внутренних элементов */
     classes?: {
         /** Button class */
-        root?: string | null;
+        root?: string;
         /** Content class */
-        content?: string | null;
+        content?: string;
         /** Inner container class */
-        inner?: string | null;
+        inner?: string;
     };
     /** Тема компонента */
     theme?: ButtonThemesType;
@@ -37,6 +37,8 @@ export interface IButtonProps extends IDataAttributes {
     type?: ButtonTypesType;
     /** Ссылка */
     href?: string;
+    /** Задает атрибут download для тега <a> */
+    download?: boolean;
     /** Target - свойство тега <a> */
     target?: '_self' | '_blank' | '_parent' | '_top';
     /** Rel - атрибут тега <a> */
@@ -59,8 +61,8 @@ export interface IButtonProps extends IDataAttributes {
     showLoader?: boolean;
     /** Показать стелку */
     showArrow?: boolean;
-    /** Иконка слева */
-    iconLeft?: JSX.Element;
+    /** Иконка */
+    icon?: JSX.Element;
     /** Управление возможностью взаимодействия с компонентом */
     disabled?: boolean;
     /** Ссылка на элемент */