@megafon/ui-shared 5.15.0 → 5.17.0

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

@@ -1,5 +1,4 @@
 import React, { Ref } from 'react';
-import { PriceBadge } from '@megafon/ui-core';
 import './ImageBanner.less';
 export declare const BackgroundColor: {
     readonly TRANSPARENT: "transparent";
@@ -26,11 +25,6 @@ export declare const ImageVerticalAlign: {
     readonly BOTTOM: "bottom";
 };
 export declare type ImageVerticalAlignType = typeof ImageVerticalAlign[keyof typeof ImageVerticalAlign];
-declare type PriceBadgeTypes = React.ComponentProps<typeof PriceBadge>;
-export declare type PriceBadgePropsType = Pick<PriceBadgeTypes, 'iconType'> & {
-    /** Текст бейджа */
-    text: string;
-};
 export interface IImageBannerProps {
     /** Дополнительные data атрибуты к внутренним элементам */
     dataAttrs?: {
@@ -43,13 +37,14 @@ export interface IImageBannerProps {
     classes?: {
         root?: string;
         image?: string;
+        imageSource?: string;
         title?: string;
         description?: string;
         cost?: string;
         badgesContainer?: string;
         badges?: string;
-        badge?: string;
         adBlock?: string;
+        children?: string;
     };
     /** Ссылка на корневой элемент */
     rootRef?: Ref<HTMLDivElement>;
@@ -83,8 +78,8 @@ export interface IImageBannerProps {
     autoHeight?: boolean;
     /** Изображение растягивается на всю ширину или вписывается в фиксированный фрейм (по умолчанию фрейм) */
     isImageFullWidth?: boolean;
-    /** Данные для блока с бейджами */
-    badges?: PriceBadgePropsType[];
+    /** Бейджи */
+    badges?: JSX.Element[] | JSX.Element;
     /** Элемент блока с рекламой */
     adBlock?: JSX.Element | null;
 }

package/dist/lib/components/ImageBanner/ImageBanner.js

@@ -15,8 +15,6 @@ require("core-js/modules/es.symbol.js");
 
 require("core-js/modules/es.symbol.description.js");
 
-require("core-js/modules/es.array.map.js");
-
 require("core-js/modules/es.array.concat.js");
 
 require("core-js/modules/es.object.values.js");
@@ -117,8 +115,7 @@ var ImageBanner = function ImageBanner(_ref2) {
       radius = _ref2$radius === void 0 ? Radius.CORNERS : _ref2$radius,
       autoHeight = _ref2.autoHeight,
       isImageFullWidth = _ref2.isImageFullWidth,
-      _ref2$badges = _ref2.badges,
-      badges = _ref2$badges === void 0 ? [] : _ref2$badges,
+      badges = _ref2.badges,
       adBlock = _ref2.adBlock,
       _ref2$children = _ref2.children,
       children = _ref2$children === void 0 ? [] : _ref2$children;
@@ -146,18 +143,9 @@ var ImageBanner = function ImageBanner(_ref2) {
   var navTheme = getTheme(backgroundColor);
   var hasImage = !!(imageMobile || imageMobile2x || imageDesktop || imageDesktop2x);
 
-  var renderBadges = !!badges.length && /*#__PURE__*/_react["default"].createElement("div", {
+  var renderBadges = !!badges && /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('badges', [classes.badges])
-  }, badges.map(function (_ref4) {
-    var text = _ref4.text,
-        iconType = _ref4.iconType;
-    return /*#__PURE__*/_react["default"].createElement(_uiCore.PriceBadge, {
-      className: classes.badge,
-      theme: navTheme,
-      iconType: iconType,
-      key: text
-    }, text);
-  }));
+  }, badges);
 
   var renderAdBlock = !!adBlock && /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('ad-block', [classes.adBlock])
@@ -178,7 +166,7 @@ var ImageBanner = function ImageBanner(_ref2) {
   }, typeof description === 'string' ? (0, _uiHelpers.convert)(description, _uiHelpers.titleConvertConfig) : description), !!cost && /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('cost', [classes.cost])
   }, (0, _uiHelpers.convert)(cost, typographyConfig)), !!children && !!_react["default"].Children.count(children) && /*#__PURE__*/_react["default"].createElement("div", {
-    className: cn('children')
+    className: cn('children', [classes.children])
   }, children));
 
   var renderImage = /*#__PURE__*/_react["default"].createElement("picture", {
@@ -186,10 +174,11 @@ var ImageBanner = function ImageBanner(_ref2) {
       'v-align': imageVerticalAlign
     })
   }, /*#__PURE__*/_react["default"].createElement("source", {
+    className: classes.imageSource,
     media: "(min-width: ".concat(_uiHelpers.breakpoints.DESKTOP_SMALL_START, "px)"),
     srcSet: "".concat(imageDesktop, ", ").concat(imageDesktop2x, " 2x")
   }), /*#__PURE__*/_react["default"].createElement("img", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.image), {
-    className: cn('background-image', [classes.image]),
+    className: cn('image', [classes.image]),
     src: imageMobile || imageMobile2x,
     srcSet: imageMobile2x ? "".concat(imageMobile2x, " 2x") : undefined,
     alt: imageAlt
@@ -217,13 +206,15 @@ ImageBanner.propTypes = {
   classes: PropTypes.shape({
     root: PropTypes.string,
     image: PropTypes.string,
+    imageSource: PropTypes.string,
     title: PropTypes.string,
     description: PropTypes.string,
     cost: PropTypes.string,
     badgesContainer: PropTypes.string,
     badges: PropTypes.string,
     badge: PropTypes.string,
-    adBlock: PropTypes.string
+    adBlock: PropTypes.string,
+    children: PropTypes.string
   }),
   rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
     current: PropTypes.elementType
@@ -243,10 +234,7 @@ ImageBanner.propTypes = {
   imageVerticalAlign: PropTypes.oneOf(Object.values(ImageVerticalAlign)),
   autoHeight: PropTypes.bool,
   isImageFullWidth: PropTypes.bool,
-  badges: PropTypes.arrayOf(PropTypes.shape({
-    iconType: PropTypes.oneOf(['timer', 'price', 'check', 'attention', 'info', 'profile']).isRequired,
-    text: PropTypes.string.isRequired
-  }).isRequired),
+  badges: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element]),
   adBlock: PropTypes.element
 };
 var _default = ImageBanner;

package/dist/lib/components/TextWithIcon/TextWithIconItem.css

@@ -14,18 +14,16 @@ h5 {
           align-items: center;
 }
 .mfui-text-with-icon-item:not(:first-of-type) {
-  margin-top: 16px;
-}
-@media screen and (max-width: 767px) {
-  .mfui-text-with-icon-item:not(:first-of-type) {
-    margin-top: 24px;
-  }
+  margin-top: 12px;
 }
 .mfui-text-with-icon-item__svg-icon {
-  width: 40px;
-  min-width: 40px;
-  height: 40px;
-  min-height: 40px;
+  width: 44px;
+  min-width: 44px;
+  height: 44px;
+  min-height: 44px;
   margin-right: 16px;
+  padding: 6px;
+  border: 1px solid var(--spbSky2);
+  border-radius: 50%;
   overflow: hidden;
 }

package/dist/lib/helpers/getColumnConfig.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const getColumnConfig: (isFullWidth: boolean) => Pick<React.PropsWithChildren<import("@megafon/ui-core/dist/lib/components/Grid/GridColumn").IGridColumn>, "all" | "wide" | "mobile" | "desktop" | "tablet">;
+export declare const getColumnConfig: (isFullWidth: boolean) => Pick<React.PropsWithChildren<import("../../../ui-core/dist/lib/components/Grid/GridColumn").IGridColumn>, "all" | "wide" | "mobile" | "desktop" | "tablet">;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-shared",
-  "version": "5.15.0",
+  "version": "5.17.0",
   "files": [
     "dist"
   ],
@@ -48,7 +48,7 @@
     "@babel/preset-env": "^7.8.6",
     "@babel/preset-react": "^7.8.3",
     "@babel/preset-typescript": "^7.8.3",
-    "@megafon/ui-icons": "^2.25.0",
+    "@megafon/ui-icons": "^2.26.0",
     "@svgr/core": "^2.4.1",
     "@testing-library/jest-dom": "5.16.2",
     "@testing-library/react": "12.1.2",
@@ -82,7 +82,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.8.4",
-    "@megafon/ui-core": "^5.17.0",
+    "@megafon/ui-core": "^5.18.1",
     "@megafon/ui-helpers": "^2.6.0",
     "core-js": "^3.6.4",
     "htmr": "^0.9.2",
@@ -90,5 +90,5 @@
     "prop-types": "^15.7.2",
     "swiper": "^6.5.6"
   },
-  "gitHead": "426c7d8e65c13746f9cc1c895a2e7e1b4b08316a"
+  "gitHead": "e39d4dae5d51999d67300d83f502e1d20293798f"
 }