@megafon/ui-core 6.0.0-beta.4 → 6.0.1

package/dist/lib/components/Avatar/Avatar.js

@@ -1,17 +1,28 @@
 "use strict";
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 require("core-js/modules/es.array.slice.js");
+
 var React = _interopRequireWildcard(require("react"));
+
 var _uiHelpers = require("@megafon/ui-helpers");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
 var PlaceholderIcon = function PlaceholderIcon(props) {
   return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
     viewBox: "0 0 40 40"
@@ -19,18 +30,21 @@ var PlaceholderIcon = function PlaceholderIcon(props) {
     d: "M29.188 40.75l2.625-9.752-.42-.407A16.63 16.63 0 0020 26.312a16.642 16.642 0 00-11.393 4.292l-.42.394 2.626 9.752h18.374zM12.125 15.813a7.875 7.875 0 1015.75 0 7.875 7.875 0 00-15.75 0z"
   }));
 };
+
 var cn = (0, _uiHelpers.cnCreate)('mfui-avatar');
+
 var Avatar = function Avatar(_ref) {
   var src = _ref.src,
-    _ref$alt = _ref.alt,
-    alt = _ref$alt === void 0 ? 'avatar' : _ref$alt,
-    letters = _ref.letters,
-    _ref$color = _ref.color,
-    color = _ref$color === void 0 ? 'green' : _ref$color,
-    _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'default' : _ref$size,
-    className = _ref.className,
-    dataAttrs = _ref.dataAttrs;
+      _ref$alt = _ref.alt,
+      alt = _ref$alt === void 0 ? 'avatar' : _ref$alt,
+      letters = _ref.letters,
+      _ref$color = _ref.color,
+      color = _ref$color === void 0 ? 'green' : _ref$color,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'default' : _ref$size,
+      className = _ref.className,
+      dataAttrs = _ref.dataAttrs;
+
   var renderContent = function renderContent() {
     if (src) {
       return /*#__PURE__*/React.createElement("img", {
@@ -39,16 +53,19 @@ var Avatar = function Avatar(_ref) {
         alt: alt
       });
     }
+
     if (letters) {
       var text = letters.slice(0, 2).toUpperCase();
       return /*#__PURE__*/React.createElement("span", {
         className: cn('text')
       }, text);
     }
+
     return /*#__PURE__*/React.createElement(PlaceholderIcon, {
       className: cn('placeholder')
     });
   };
+
   return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
     className: cn({
       color: color,
@@ -56,4 +73,15 @@ var Avatar = function Avatar(_ref) {
     }, [className])
   }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), renderContent());
 };
-var _default = exports["default"] = Avatar;
+
+Avatar.propTypes = {
+  src: PropTypes.string,
+  alt: PropTypes.string,
+  letters: PropTypes.string,
+  color: PropTypes.oneOf(['green', 'gray']),
+  size: PropTypes.oneOf(['default', 'auto']),
+  className: PropTypes.string,
+  dataAttrs: PropTypes.objectOf(PropTypes.object)
+};
+var _default = Avatar;
+exports["default"] = _default;

package/dist/lib/components/Badges/components/CounterBadge/CounterBadge.css

@@ -0,0 +1,54 @@
+.mfui-counter-badge {
+  padding: 5px 6px;
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+  min-width: 24px;
+  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;
+          justify-content: center;
+  font-weight: 500;
+  font-size: 12px;
+  line-height: 14px;
+  border-radius: 12px;
+}
+.mfui-counter-badge_limited {
+  padding: 5px 12px;
+}
+@media screen and (min-width: 1024px) {
+  .mfui-counter-badge_adaptive {
+    min-width: 28px;
+    font-size: 15px;
+    line-height: 18px;
+  }
+}
+.mfui-counter-badge_icon {
+  padding: 2px 4px 2px 12px;
+}
+.mfui-counter-badge_adaptive.mfui-counter-badge_icon {
+  padding: 4px 4px 4px 12px;
+}
+.mfui-counter-badge__icon {
+  margin-left: 4px;
+  width: 20px;
+  min-width: 20px;
+  height: 20px;
+}
+.mfui-counter-badge_theme_light-blue {
+  background-color: var(--311C20);
+}
+.mfui-counter-badge_theme_light-blue .mfui-counter-badge__icon {
+  fill: var(--311C);
+}
+.mfui-counter-badge_theme_purple {
+  background-color: var(--brandPurple20);
+}
+.mfui-counter-badge_theme_purple .mfui-counter-badge__icon {
+  fill: var(--brandPurple);
+}

package/dist/lib/components/Badges/{CounterBadge → components/CounterBadge}/CounterBadge.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import './CounterBadge.scss';
+import './CounterBadge.less';
 export declare const CounterBadgeColorTheme: {
     readonly LIGHT_BLUE: "light-blue";
     readonly PURPLE: "purple";
 };
-type CounterBadgeColorThemeType = (typeof CounterBadgeColorTheme)[keyof typeof CounterBadgeColorTheme];
+declare type CounterBadgeColorThemeType = typeof CounterBadgeColorTheme[keyof typeof CounterBadgeColorTheme];
 export interface ICounterBadgeProps {
     /** Текущее значение */
     currentValue: number;

package/dist/lib/components/Badges/components/CounterBadge/CounterBadge.js

@@ -0,0 +1,81 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.CounterBadgeColorTheme = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+require("core-js/modules/es.object.values.js");
+
+var React = _interopRequireWildcard(require("react"));
+
+var _uiHelpers = require("@megafon/ui-helpers");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var DefaultIcon = function DefaultIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
+    viewBox: "0 0 20 20"
+  }, props), /*#__PURE__*/React.createElement("path", {
+    d: "M11.39 9H16v1l-7.5 8H7l1.61-7H4v-1l7.5-8H13z",
+    fillRule: "evenodd"
+  }));
+};
+
+var CounterBadgeColorTheme = {
+  LIGHT_BLUE: 'light-blue',
+  PURPLE: 'purple'
+};
+exports.CounterBadgeColorTheme = CounterBadgeColorTheme;
+var cn = (0, _uiHelpers.cnCreate)('mfui-counter-badge');
+
+var CounterBadge = function CounterBadge(_ref) {
+  var totalCount = _ref.totalCount,
+      currentValue = _ref.currentValue,
+      _ref$hasIcon = _ref.hasIcon,
+      hasIcon = _ref$hasIcon === void 0 ? false : _ref$hasIcon,
+      customIcon = _ref.customIcon,
+      _ref$colorTheme = _ref.colorTheme,
+      colorTheme = _ref$colorTheme === void 0 ? 'light-blue' : _ref$colorTheme,
+      _ref$isAdaptive = _ref.isAdaptive,
+      isAdaptive = _ref$isAdaptive === void 0 ? false : _ref$isAdaptive,
+      className = _ref.className,
+      dataAttrs = _ref.dataAttrs;
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: cn({
+      limited: !!totalCount,
+      adaptive: isAdaptive,
+      theme: colorTheme,
+      icon: hasIcon
+    }, className)
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("span", {
+    className: cn('value')
+  }, currentValue, !!totalCount && "/".concat(totalCount)), hasIcon && /*#__PURE__*/React.createElement("div", {
+    className: cn('icon')
+  }, customIcon || /*#__PURE__*/React.createElement(DefaultIcon, null)));
+};
+
+CounterBadge.propTypes = {
+  totalCount: PropTypes.number,
+  currentValue: PropTypes.number.isRequired,
+  customIcon: PropTypes.element,
+  colorTheme: PropTypes.oneOf(Object.values(CounterBadgeColorTheme)),
+  hasIcon: PropTypes.bool,
+  isAdaptive: PropTypes.bool,
+  className: PropTypes.string,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired).isRequired
+  })
+};
+var _default = CounterBadge;
+exports["default"] = _default;

package/dist/lib/components/Badges/components/NotificationBadge/NotificationBadge.css

@@ -0,0 +1,58 @@
+.mfui-notification-badge {
+  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;
+          justify-content: center;
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  overflow: hidden;
+  color: var(--stcWhite);
+}
+.mfui-notification-badge_theme_green {
+  background-color: var(--brandGreen);
+  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 185, 86, 0.5);
+          box-shadow: 0 2px 4px 0 rgba(0, 185, 86, 0.5);
+}
+.mfui-notification-badge_theme_red {
+  background-color: var(--warmRedC);
+  -webkit-box-shadow: 0 2px 4px 0 rgba(235, 90, 64, 0.5);
+          box-shadow: 0 2px 4px 0 rgba(235, 90, 64, 0.5);
+}
+.mfui-notification-badge_auto-width {
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+  min-width: 24px;
+  padding: 5px 8px;
+  border-radius: 12px;
+}
+.mfui-notification-badge_size_small {
+  width: 8px;
+  height: 8px;
+  padding: 0;
+  border-radius: 50%;
+}
+.mfui-notification-badge_size_small .mfui-notification-badge__text {
+  display: none;
+}
+.mfui-notification-badge_size_medium {
+  width: 16px;
+  height: 16px;
+  border-radius: 50%;
+}
+.mfui-notification-badge_size_medium .mfui-notification-badge__text {
+  font-size: 10px;
+  line-height: 12px;
+}
+.mfui-notification-badge__text {
+  font-family: inherit;
+  font-weight: 500;
+  font-size: 12px;
+  line-height: 14px;
+}

package/dist/lib/components/Badges/{NotificationBadge → components/NotificationBadge}/NotificationBadge.d.ts

@@ -1,15 +1,16 @@
 import * as React from 'react';
-import './NotificationBadge.scss';
+import './NotificationBadge.less';
 export declare const NotificationBadgeTheme: {
     readonly GREEN: "green";
     readonly RED: "red";
 };
-type NotificationBadgeThemeType = (typeof NotificationBadgeTheme)[keyof typeof NotificationBadgeTheme];
+declare type NotificationBadgeThemeType = typeof NotificationBadgeTheme[keyof typeof NotificationBadgeTheme];
 export declare const NotificationBadgeSize: {
     readonly SMALL: "small";
     readonly MEDIUM: "medium";
+    readonly BIG: "big";
 };
-type NotificationBadgeSizeType = (typeof NotificationBadgeSize)[keyof typeof NotificationBadgeSize];
+declare type NotificationBadgeSizeType = typeof NotificationBadgeSize[keyof typeof NotificationBadgeSize];
 export interface INotificationBadgeProps {
     /** Цветовая тема */
     theme?: NotificationBadgeThemeType;

package/dist/lib/components/Badges/components/NotificationBadge/NotificationBadge.js

@@ -0,0 +1,71 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.NotificationBadgeSize = exports.NotificationBadgeTheme = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+require("core-js/modules/es.object.values.js");
+
+var React = _interopRequireWildcard(require("react"));
+
+var _uiHelpers = require("@megafon/ui-helpers");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var NotificationBadgeTheme = {
+  GREEN: 'green',
+  RED: 'red'
+};
+exports.NotificationBadgeTheme = NotificationBadgeTheme;
+var NotificationBadgeSize = {
+  SMALL: 'small',
+  MEDIUM: 'medium',
+  BIG: 'big'
+};
+exports.NotificationBadgeSize = NotificationBadgeSize;
+var cn = (0, _uiHelpers.cnCreate)('mfui-notification-badge');
+
+var NotificationBadge = function NotificationBadge(_ref) {
+  var _ref$theme = _ref.theme,
+      theme = _ref$theme === void 0 ? 'green' : _ref$theme,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'big' : _ref$size,
+      _ref$autoWidth = _ref.autoWidth,
+      autoWidth = _ref$autoWidth === void 0 ? false : _ref$autoWidth,
+      className = _ref.className,
+      dataAttrs = _ref.dataAttrs,
+      children = _ref.children;
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      theme: theme,
+      size: size,
+      'auto-width': autoWidth
+    }, className)
+  }), /*#__PURE__*/React.createElement("span", {
+    className: cn('text')
+  }, children));
+};
+
+NotificationBadge.propTypes = {
+  theme: PropTypes.oneOf(Object.values(NotificationBadgeTheme)),
+  size: PropTypes.oneOf(Object.values(NotificationBadgeSize)),
+  autoWidth: PropTypes.bool,
+  className: PropTypes.string,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
+  children: PropTypes.node
+};
+var _default = NotificationBadge;
+exports["default"] = _default;

package/dist/lib/components/Badges/components/PriceBadge/PriceBadge.css

@@ -0,0 +1,119 @@
+.mfui-price-badge {
+  font-size: 12px;
+  line-height: 18px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+  height: -webkit-fit-content;
+  height: -moz-fit-content;
+  height: fit-content;
+  padding: 2px;
+  padding-right: 8px;
+  border-radius: 8px;
+  font-weight: 500;
+}
+@media screen and (min-width: 1024px) {
+  .mfui-price-badge_adaptive {
+    font-size: 15px;
+    line-height: 24px;
+    min-height: 32px;
+    padding: 4px;
+    padding-right: 8px;
+    border-radius: 12px;
+  }
+}
+.mfui-price-badge_theme_grey {
+  background-color: var(--spbSky0);
+}
+.mfui-price-badge_theme_grey .mfui-price-badge__text {
+  color: var(--spbSky3);
+}
+.mfui-price-badge_theme_grey .mfui-price-badge__icon {
+  fill: var(--spbSky3);
+}
+.mfui-price-badge_theme_orange {
+  background-color: var(--137C20);
+}
+.mfui-price-badge_theme_orange .mfui-price-badge__text {
+  color: var(--137C);
+}
+.mfui-price-badge_theme_orange .mfui-price-badge__icon {
+  fill: var(--137C);
+}
+.mfui-price-badge_theme_green {
+  background-color: var(--brandGreen20);
+}
+.mfui-price-badge_theme_green .mfui-price-badge__text {
+  color: var(--brandGreen);
+}
+.mfui-price-badge_theme_green .mfui-price-badge__icon {
+  fill: var(--brandGreen);
+}
+.mfui-price-badge_theme_purple {
+  background-color: var(--brandPurple80);
+}
+.mfui-price-badge_theme_purple .mfui-price-badge__text {
+  color: var(--stcWhite);
+}
+.mfui-price-badge_theme_purple .mfui-price-badge__icon {
+  fill: var(--stcWhite);
+}
+.mfui-price-badge_theme_red {
+  background-color: var(--fury20);
+}
+.mfui-price-badge_theme_red .mfui-price-badge__text {
+  color: var(--fury);
+}
+.mfui-price-badge_theme_red .mfui-price-badge__icon {
+  fill: var(--fury);
+}
+.mfui-price-badge_theme_light {
+  background-color: var(--stcWhite20);
+}
+.mfui-price-badge_theme_dark {
+  background-color: var(--stcBlack20);
+}
+.mfui-price-badge_theme_light .mfui-price-badge__text,
+.mfui-price-badge_theme_dark .mfui-price-badge__text {
+  font-weight: 400;
+  color: var(--stcWhite);
+}
+.mfui-price-badge_theme_light .mfui-price-badge__icon,
+.mfui-price-badge_theme_dark .mfui-price-badge__icon {
+  fill: var(--stcWhite);
+}
+.mfui-price-badge_size_big {
+  padding: 12px 12px 12px 4px;
+  font-size: 15px;
+  line-height: 18px;
+}
+.mfui-price-badge__text {
+  font-family: inherit;
+  margin-left: 2px;
+}
+.mfui-price-badge__icon-container {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+}
+.mfui-price-badge__icon {
+  width: 20px;
+  min-width: 20px;
+  height: 20px;
+}
+.mfui-price-badge_size_big .mfui-price-badge__icon {
+  width: 32px;
+  min-width: 32px;
+  height: 32px;
+}
+.mfui-price-badge_size_big .mfui-price-badge__sub-title {
+  margin-top: 2px;
+  font-size: 12px;
+  line-height: 18px;
+}

package/dist/lib/components/Badges/{PriceBadge → components/PriceBadge}/PriceBadge.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import './PriceBadge.scss';
+import './PriceBadge.less';
 export declare const PriceBadgeTheme: {
     readonly RED: "red";
     readonly GREY: "grey";
@@ -21,9 +21,9 @@ export declare const PriseBadgeSize: {
     readonly SMALL: "small";
     readonly BIG: "big";
 };
-type PriceBadgeThemeType = (typeof PriceBadgeTheme)[keyof typeof PriceBadgeTheme];
-type PriceBadgeIconType = (typeof PriceBadgeIcon)[keyof typeof PriceBadgeIcon];
-type PriseBadgeSizeType = (typeof PriseBadgeSize)[keyof typeof PriseBadgeSize];
+declare type PriceBadgeThemeType = typeof PriceBadgeTheme[keyof typeof PriceBadgeTheme];
+declare type PriceBadgeIconType = typeof PriceBadgeIcon[keyof typeof PriceBadgeIcon];
+declare type PriseBadgeSizeType = typeof PriseBadgeSize[keyof typeof PriseBadgeSize];
 export interface IPriceBadgeProps {
     /** Адаптивный режим */
     isAdaptive?: boolean;