@megafon/ui-shared 5.2.0 → 5.2.1

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.2.1](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-shared@5.2.0...@megafon/ui-shared@5.2.1) (2023-10-17)
+
+**Note:** Version bump only for package @megafon/ui-shared
+
+
+
+
+
 # [5.2.0](https://hq-gitlab.megafon.ru/site-portal/services/megafon-ui/compare/@megafon/ui-shared@5.1.0...@megafon/ui-shared@5.2.0) (2023-09-21)
 
 

package/dist/es/components/ButtonBanner/ButtonBanner.js

@@ -25,6 +25,7 @@ var getMediaStyle = function getMediaStyle(imageUrl) {
 };
 
 var cn = cnCreate('mfui-button-banner');
+var testIdPrefix = 'ButtonBanner';
 
 var ButtonBanner = function ButtonBanner(_ref) {
   var dataAttrs = _ref.dataAttrs,
@@ -74,7 +75,8 @@ var ButtonBanner = function ButtonBanner(_ref) {
     leftOffsetDesktop: "1",
     leftOffsetWide: "1"
   }, /*#__PURE__*/React.createElement("div", {
-    className: cn('content')
+    className: cn('content'),
+    "data-testid": "".concat(testIdPrefix, "-content")
   }, /*#__PURE__*/React.createElement(Header, {
     className: cn('header'),
     as: "h2"
@@ -85,7 +87,8 @@ var ButtonBanner = function ButtonBanner(_ref) {
     mobile: "12"
   }, /*#__PURE__*/React.createElement("div", {
     className: cn('media'),
-    style: getMediaStyle(imageUrl)
+    style: getMediaStyle(imageUrl),
+    "data-testid": "".concat(testIdPrefix, "-media")
   }, !imageUrl && buttonElem))));
 };
 

package/dist/es/components/DownloadLinks/DownloadLink.js

@@ -45,7 +45,7 @@ var DownloadLink = function DownloadLink(_ref) {
     className: cn('link', [classes.link])
   }, text), /*#__PURE__*/React.createElement("p", {
     className: cn('info')
-  }, "".concat(extension).concat(extension && fileSize ? ',' : '', " ").concat(fileSize))));
+  }, "".concat(extension).concat(extension && fileSize ? ', ' : '').concat(fileSize))));
 };
 
 DownloadLink.propTypes = {

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

@@ -1,6 +1,16 @@
 import * as React from 'react';
+import { GridColumn } from '@megafon/ui-core';
 import './DownloadLinks.less';
 import { IDownloadLink } from './DownloadLink';
+declare type GridColumnType = React.ComponentProps<typeof GridColumn>;
+declare type ColumnConfig = {
+    wide?: GridColumnType['wide'];
+    desktop?: GridColumnType['desktop'];
+    tablet?: GridColumnType['tablet'];
+    mobile?: GridColumnType['mobile'];
+    all?: GridColumnType['all'];
+};
+export declare const getColumnConfig: (itemsCount: number) => ColumnConfig;
 interface IDownloadLinks {
     /** Выстраивать ссылки в одну колонку вне зависимости от количества */
     inOneColumn?: boolean;

package/dist/es/components/DownloadLinks/DownloadLinks.js

@@ -5,8 +5,7 @@ import { Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./DownloadLinks.css";
-
-var getColumnConfig = function getColumnConfig(itemsCount) {
+export var getColumnConfig = function getColumnConfig(itemsCount) {
   switch (true) {
     case itemsCount <= 2:
       {
@@ -35,7 +34,7 @@ var getColumnConfig = function getColumnConfig(itemsCount) {
       }
   }
 };
-
+var testIdPrefix = 'DownloadLinks';
 var cn = cnCreate('mfui-download-links');
 
 var DownloadLinks = function DownloadLinks(_ref) {
@@ -45,7 +44,8 @@ var DownloadLinks = function DownloadLinks(_ref) {
 
   if (inOneColumn) {
     return /*#__PURE__*/React.createElement("div", {
-      className: cn()
+      className: cn(),
+      "data-testid": "".concat(testIdPrefix, "-oneColumn")
     }, React.Children.map(children, function (child) {
       return /*#__PURE__*/React.createElement("div", {
         className: cn('item')

package/dist/es/components/Instructions/Instructions.js

@@ -28,6 +28,7 @@ export var pictureMaskTypes = {
   IPHONE_12: 'iphone-12',
   NONE: 'none'
 };
+var testIdPrefix = 'Instructions';
 var cn = cnCreate('mfui-instructions');
 var swiperSlideCn = cn('slide');
 
@@ -143,7 +144,8 @@ var Instructions = function Instructions(_ref) {
     }
 
     return /*#__PURE__*/React.createElement("div", {
-      className: cn('img-wrapper')
+      className: cn('img-wrapper'),
+      "data-testid": "".concat(testIdPrefix, "-img-wrapper")
     }, /*#__PURE__*/React.createElement("div", {
       className: cn('device-screen')
     }), renderSlider());
@@ -153,7 +155,8 @@ var Instructions = function Instructions(_ref) {
       className: cn('articles-list', {
         'text-after': !!text,
         desktop: true
-      })
+      }),
+      "data-testid": "".concat(testIdPrefix, "-articles-list-desktop")
     }, instructionItems.map(function (_ref4, i) {
       var itemTitle = _ref4.title;
       return (
@@ -180,7 +183,8 @@ var Instructions = function Instructions(_ref) {
     return /*#__PURE__*/React.createElement("div", {
       className: cn('articles-list', {
         mobile: true
-      })
+      }),
+      "data-testid": "".concat(testIdPrefix, "-articles-list-mobile")
     }, /*#__PURE__*/React.createElement("div", {
       className: cn('articles-title-block')
     }, instructionItems.map(function (_ref5, i) {
@@ -194,7 +198,8 @@ var Instructions = function Instructions(_ref) {
     })), /*#__PURE__*/React.createElement("ul", {
       className: cn('articles-dots', {
         'text-after': !!text
-      })
+      }),
+      "data-testid": "".concat(testIdPrefix, "-articles-dots-mobile")
     }, instructionItems.map(function (_item, i) {
       return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, i + 1), {
         key: i,
@@ -222,7 +227,8 @@ var Instructions = function Instructions(_ref) {
     className: cn('picture', {
       align: pictureAlign,
       'vertical-align': pictureVerticalAlign
-    })
+    }),
+    "data-testid": "".concat(testIdPrefix, "-picture")
   }, renderPicture()), /*#__PURE__*/React.createElement("div", {
     className: cn('articles', {
       align: pictureAlign

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import './PageTitle.less';
 import { Props as BreadcrumbsType } from '../Breadcrumbs/Breadcrumbs';
-declare type Props = {
+export declare type PageTitleProps = {
     /** Дополнительные data атрибуты к внутренним элементам */
     dataAttrs?: {
         root?: Record<string, string>;
@@ -27,5 +27,5 @@ declare type Props = {
     /** Ссылка на корневой элемент */
     rootRef?: React.RefObject<HTMLDivElement>;
 };
-declare const PageTitle: React.FC<Props>;
+declare const PageTitle: React.FC<PageTitleProps>;
 export default PageTitle;

package/dist/es/components/PageTitle/PageTitle.js

@@ -5,6 +5,7 @@ import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import PropTypes from 'prop-types';
 import "./PageTitle.css";
 import Breadcrumbs from "../Breadcrumbs/Breadcrumbs";
+var testIdPrefix = 'PageTitle';
 var cn = cnCreate('mfui-page-title');
 
 var PageTitle = function PageTitle(_ref) {
@@ -34,7 +35,13 @@ var PageTitle = function PageTitle(_ref) {
     }, title));
   }, [badge, title, isBreadcrumbs]);
   var renderPageTitleWithGrid = React.useCallback(function () {
-    return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, {
+    return /*#__PURE__*/React.createElement(Grid, {
+      dataAttrs: {
+        root: {
+          'data-testid': "".concat(testIdPrefix, "-grid")
+        }
+      }
+    }, /*#__PURE__*/React.createElement(GridColumn, {
       wide: "8",
       desktop: "10",
       tablet: "12",

package/dist/es/components/Partners/Partners.js

@@ -21,6 +21,7 @@ var slidesSettings = (_slidesSettings = {}, _defineProperty(_slidesSettings, bre
   slidesPerView: 4,
   spaceBetween: 20
 }), _slidesSettings);
+var testIdPrefix = 'Partners';
 var cn = cnCreate('mfui-partners');
 
 var Partners = function Partners(_ref) {
@@ -56,7 +57,8 @@ var Partners = function Partners(_ref) {
         root: _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, index + 1))
       }
     }, /*#__PURE__*/React.createElement("div", {
-      className: cn('tile-inner', [itemClass])
+      className: cn('tile-inner', [itemClass]),
+      "data-testid": "".concat(testIdPrefix, "-tile-inner")
     }, /*#__PURE__*/React.createElement("div", {
       className: cn('img-wrapper')
     }, /*#__PURE__*/React.createElement("img", {
@@ -85,7 +87,15 @@ var Partners = function Partners(_ref) {
       slidesSettings: slidesSettings,
       onChange: onChange,
       onNextClick: onNextClick,
-      onPrevClick: onPrevClick
+      onPrevClick: onPrevClick,
+      dataAttrs: {
+        prev: {
+          'data-testid': "".concat(testIdPrefix, "-prev")
+        },
+        next: {
+          'data-testid': "".concat(testIdPrefix, "-next")
+        }
+      }
     }, topRow.map(function (item, i) {
       return /*#__PURE__*/React.createElement("div", {
         key: i + item.src,

package/dist/es/components/PictureWithDescription/PictureWithDescription.js

@@ -7,6 +7,7 @@ export var pictureAlignTypes = {
   LEFT: 'left',
   RIGHT: 'right'
 };
+var testIdPrefix = 'PictureWithDescription';
 var cn = cnCreate('mfui-picture-with-description');
 
 var PictureWithDescription = function PictureWithDescription(_ref) {
@@ -27,7 +28,8 @@ var PictureWithDescription = function PictureWithDescription(_ref) {
   }, /*#__PURE__*/React.createElement("div", {
     className: cn('picture', {
       align: pictureAlign
-    })
+    }),
+    "data-testid": "".concat(testIdPrefix, "-picture")
   }, /*#__PURE__*/React.createElement("img", {
     className: cn('img'),
     src: pictureUrl,
@@ -36,7 +38,8 @@ var PictureWithDescription = function PictureWithDescription(_ref) {
     className: cn('articles', {
       align: pictureAlign,
       'text-top-align': isTextTopAlign
-    })
+    }),
+    "data-testid": "".concat(testIdPrefix, "-articles")
   }, !!title && /*#__PURE__*/React.createElement(Header, {
     className: cn('title', [classes.title]),
     as: "h2"

package/dist/es/components/StoreBanner/StoreBanner.js

@@ -19,6 +19,7 @@ export var DeviceMask = {
   NEW_IPHONE: 'new-iphone',
   WHITE_IPHONE: 'white-iphone'
 };
+var testIdPrefix = 'StoreBanner';
 var cn = cnCreate('mfui-store-banner');
 
 var StoreBanner = function StoreBanner(_ref) {
@@ -90,9 +91,11 @@ var StoreBanner = function StoreBanner(_ref) {
   }, !linkButton && qrCode && /*#__PURE__*/React.createElement("img", {
     src: qrCode,
     className: cn('qr-code'),
-    alt: "QR-\u043A\u043E\u0434"
+    alt: "QR-\u043A\u043E\u0434",
+    "data-testid": "".concat(testIdPrefix, "-qrCode")
   }), !linkButton && /*#__PURE__*/React.createElement("div", {
-    className: cn('stores')
+    className: cn('stores'),
+    "data-testid": "".concat(testIdPrefix, "-stores")
   }, linkApple && /*#__PURE__*/React.createElement(StoreButton, {
     dataAttrs: {
       root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkApple

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Tabs } from '@megafon/ui-core';
-declare type TabsPropsType = React.ComponentProps<typeof Tabs> & {
+export declare type TabsPropsType = React.ComponentProps<typeof Tabs> & {
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;
 };

package/dist/es/components/TabsBox/TabsBox.js

@@ -21,12 +21,13 @@ var cn = cnCreate('mfui-tabs-box');
 
 var TabsBox = function TabsBox(_a) {
   var rootRef = _a.rootRef,
-      props = __rest(_a, ["rootRef"]);
+      children = _a.children,
+      props = __rest(_a, ["rootRef", "children"]);
 
   return /*#__PURE__*/React.createElement("div", {
     ref: rootRef,
     className: cn()
-  }, /*#__PURE__*/React.createElement(Tabs, props));
+  }, /*#__PURE__*/React.createElement(Tabs, props, children));
 };
 
 export default TabsBox;

package/dist/es/components/TextBox/TextBox.js

@@ -24,7 +24,12 @@ var TextBox = function TextBox(_ref) {
 
   var renderTextBoxWithGrid = function renderTextBoxWithGrid() {
     return /*#__PURE__*/React.createElement(Grid, {
-      hAlign: centeringWithLimitedWidth ? 'center' : 'left'
+      hAlign: centeringWithLimitedWidth ? 'center' : 'left',
+      dataAttrs: {
+        container: {
+          'data-testid': 'TextBox-grid'
+        }
+      }
     }, /*#__PURE__*/React.createElement(GridColumn, {
       wide: "8",
       desktop: "10",

package/dist/es/components/TextWithIcon/TextWithIcon.js

@@ -4,6 +4,7 @@ import { Header, Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./TextWithIcon.css";
+var testIdPrefix = 'TextWithIcon';
 var cn = cnCreate('mfui-text-with-icon');
 
 var TextWithIcon = function TextWithIcon(_ref) {
@@ -23,7 +24,13 @@ var TextWithIcon = function TextWithIcon(_ref) {
   };
 
   var renderContentWithGrid = function renderContentWithGrid() {
-    return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, {
+    return /*#__PURE__*/React.createElement(Grid, {
+      dataAttrs: {
+        container: {
+          'data-testid': "".concat(testIdPrefix, "-grid")
+        }
+      }
+    }, /*#__PURE__*/React.createElement(GridColumn, {
       mobile: '12',
       tablet: '7',
       desktop: '6',

package/dist/es/components/TextWithIcon/TextWithIconItem.js

@@ -5,6 +5,7 @@ import * as React from 'react';
 import { cnCreate, convert, filterDataAttrs, textConvertConfig } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./TextWithIconItem.css";
+var testIdPrefix = 'TextWithIconItem';
 var cn = cnCreate('mfui-text-with-icon-item');
 
 var TextWithIconItem = function TextWithIconItem(_ref) {
@@ -28,9 +29,11 @@ var TextWithIconItem = function TextWithIconItem(_ref) {
     className: cn([className]),
     ref: rootRef
   }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
-    className: cn('svg-icon', [classes.icon])
+    className: cn('svg-icon', [classes.icon]),
+    "data-testid": "".concat(testIdPrefix, "-icon")
   }, icon), /*#__PURE__*/React.createElement("div", {
-    className: cn('text', [classes.text])
+    className: cn('text', [classes.text]),
+    "data-testid": "".concat(testIdPrefix, "-text")
   }, renderText));
 };
 

package/dist/lib/components/ButtonBanner/ButtonBanner.js

@@ -48,6 +48,7 @@ var getMediaStyle = function getMediaStyle(imageUrl) {
 };
 
 var cn = (0, _uiHelpers.cnCreate)('mfui-button-banner');
+var testIdPrefix = 'ButtonBanner';
 
 var ButtonBanner = function ButtonBanner(_ref) {
   var dataAttrs = _ref.dataAttrs,
@@ -99,7 +100,8 @@ var ButtonBanner = function ButtonBanner(_ref) {
     leftOffsetDesktop: "1",
     leftOffsetWide: "1"
   }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: cn('content')
+    className: cn('content'),
+    "data-testid": "".concat(testIdPrefix, "-content")
   }, /*#__PURE__*/_react["default"].createElement(_uiCore.Header, {
     className: cn('header'),
     as: "h2"
@@ -110,7 +112,8 @@ var ButtonBanner = function ButtonBanner(_ref) {
     mobile: "12"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('media'),
-    style: getMediaStyle(imageUrl)
+    style: getMediaStyle(imageUrl),
+    "data-testid": "".concat(testIdPrefix, "-media")
   }, !imageUrl && buttonElem))));
 };
 

package/dist/lib/components/DownloadLinks/DownloadLink.js

@@ -65,7 +65,7 @@ var DownloadLink = function DownloadLink(_ref) {
     className: cn('link', [classes.link])
   }, text), /*#__PURE__*/React.createElement("p", {
     className: cn('info')
-  }, "".concat(extension).concat(extension && fileSize ? ',' : '', " ").concat(fileSize))));
+  }, "".concat(extension).concat(extension && fileSize ? ', ' : '').concat(fileSize))));
 };
 
 DownloadLink.propTypes = {

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

@@ -1,6 +1,16 @@
 import * as React from 'react';
+import { GridColumn } from '@megafon/ui-core';
 import './DownloadLinks.less';
 import { IDownloadLink } from './DownloadLink';
+declare type GridColumnType = React.ComponentProps<typeof GridColumn>;
+declare type ColumnConfig = {
+    wide?: GridColumnType['wide'];
+    desktop?: GridColumnType['desktop'];
+    tablet?: GridColumnType['tablet'];
+    mobile?: GridColumnType['mobile'];
+    all?: GridColumnType['all'];
+};
+export declare const getColumnConfig: (itemsCount: number) => ColumnConfig;
 interface IDownloadLinks {
     /** Выстраивать ссылки в одну колонку вне зависимости от количества */
     inOneColumn?: boolean;

package/dist/lib/components/DownloadLinks/DownloadLinks.js

@@ -5,7 +5,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports["default"] = exports.getColumnConfig = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -55,6 +55,8 @@ var getColumnConfig = function getColumnConfig(itemsCount) {
   }
 };
 
+exports.getColumnConfig = getColumnConfig;
+var testIdPrefix = 'DownloadLinks';
 var cn = (0, _uiHelpers.cnCreate)('mfui-download-links');
 
 var DownloadLinks = function DownloadLinks(_ref) {
@@ -64,7 +66,8 @@ var DownloadLinks = function DownloadLinks(_ref) {
 
   if (inOneColumn) {
     return /*#__PURE__*/React.createElement("div", {
-      className: cn()
+      className: cn(),
+      "data-testid": "".concat(testIdPrefix, "-oneColumn")
     }, React.Children.map(children, function (child) {
       return /*#__PURE__*/React.createElement("div", {
         className: cn('item')

package/dist/lib/components/Instructions/Instructions.js

@@ -46,6 +46,7 @@ var pictureMaskTypes = {
   NONE: 'none'
 };
 exports.pictureMaskTypes = pictureMaskTypes;
+var testIdPrefix = 'Instructions';
 var cn = (0, _uiHelpers.cnCreate)('mfui-instructions');
 var swiperSlideCn = cn('slide');
 
@@ -169,7 +170,8 @@ var Instructions = function Instructions(_ref) {
     }
 
     return /*#__PURE__*/_react["default"].createElement("div", {
-      className: cn('img-wrapper')
+      className: cn('img-wrapper'),
+      "data-testid": "".concat(testIdPrefix, "-img-wrapper")
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: cn('device-screen')
     }), renderSlider());
@@ -180,7 +182,8 @@ var Instructions = function Instructions(_ref) {
       className: cn('articles-list', {
         'text-after': !!text,
         desktop: true
-      })
+      }),
+      "data-testid": "".concat(testIdPrefix, "-articles-list-desktop")
     }, instructionItems.map(function (_ref4, i) {
       var itemTitle = _ref4.title;
       return (
@@ -208,7 +211,8 @@ var Instructions = function Instructions(_ref) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: cn('articles-list', {
         mobile: true
-      })
+      }),
+      "data-testid": "".concat(testIdPrefix, "-articles-list-mobile")
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: cn('articles-title-block')
     }, instructionItems.map(function (_ref5, i) {
@@ -222,7 +226,8 @@ var Instructions = function Instructions(_ref) {
     })), /*#__PURE__*/_react["default"].createElement("ul", {
       className: cn('articles-dots', {
         'text-after': !!text
-      })
+      }),
+      "data-testid": "".concat(testIdPrefix, "-articles-dots-mobile")
     }, instructionItems.map(function (_item, i) {
       return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, i + 1), {
         key: i,
@@ -251,7 +256,8 @@ var Instructions = function Instructions(_ref) {
     className: cn('picture', {
       align: pictureAlign,
       'vertical-align': pictureVerticalAlign
-    })
+    }),
+    "data-testid": "".concat(testIdPrefix, "-picture")
   }, renderPicture()), /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('articles', {
       align: pictureAlign

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import './PageTitle.less';
 import { Props as BreadcrumbsType } from '../Breadcrumbs/Breadcrumbs';
-declare type Props = {
+export declare type PageTitleProps = {
     /** Дополнительные data атрибуты к внутренним элементам */
     dataAttrs?: {
         root?: Record<string, string>;
@@ -27,5 +27,5 @@ declare type Props = {
     /** Ссылка на корневой элемент */
     rootRef?: React.RefObject<HTMLDivElement>;
 };
-declare const PageTitle: React.FC<Props>;
+declare const PageTitle: React.FC<PageTitleProps>;
 export default PageTitle;

package/dist/lib/components/PageTitle/PageTitle.js

@@ -25,6 +25,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+var testIdPrefix = 'PageTitle';
 var cn = (0, _uiHelpers.cnCreate)('mfui-page-title');
 
 var PageTitle = function PageTitle(_ref) {
@@ -54,7 +55,13 @@ var PageTitle = function PageTitle(_ref) {
     }, title));
   }, [badge, title, isBreadcrumbs]);
   var renderPageTitleWithGrid = React.useCallback(function () {
-    return /*#__PURE__*/React.createElement(_uiCore.Grid, null, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
+    return /*#__PURE__*/React.createElement(_uiCore.Grid, {
+      dataAttrs: {
+        root: {
+          'data-testid': "".concat(testIdPrefix, "-grid")
+        }
+      }
+    }, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
       wide: "8",
       desktop: "10",
       tablet: "12",

package/dist/lib/components/Partners/Partners.js

@@ -42,6 +42,7 @@ var slidesSettings = (_slidesSettings = {}, (0, _defineProperty2["default"])(_sl
   slidesPerView: 4,
   spaceBetween: 20
 }), _slidesSettings);
+var testIdPrefix = 'Partners';
 var cn = (0, _uiHelpers.cnCreate)('mfui-partners');
 
 var Partners = function Partners(_ref) {
@@ -77,7 +78,8 @@ var Partners = function Partners(_ref) {
         root: (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, index + 1))
       }
     }, /*#__PURE__*/React.createElement("div", {
-      className: cn('tile-inner', [itemClass])
+      className: cn('tile-inner', [itemClass]),
+      "data-testid": "".concat(testIdPrefix, "-tile-inner")
     }, /*#__PURE__*/React.createElement("div", {
       className: cn('img-wrapper')
     }, /*#__PURE__*/React.createElement("img", {
@@ -106,7 +108,15 @@ var Partners = function Partners(_ref) {
       slidesSettings: slidesSettings,
       onChange: onChange,
       onNextClick: onNextClick,
-      onPrevClick: onPrevClick
+      onPrevClick: onPrevClick,
+      dataAttrs: {
+        prev: {
+          'data-testid': "".concat(testIdPrefix, "-prev")
+        },
+        next: {
+          'data-testid': "".concat(testIdPrefix, "-next")
+        }
+      }
     }, topRow.map(function (item, i) {
       return /*#__PURE__*/React.createElement("div", {
         key: i + item.src,

package/dist/lib/components/PictureWithDescription/PictureWithDescription.js

@@ -26,6 +26,7 @@ var pictureAlignTypes = {
   RIGHT: 'right'
 };
 exports.pictureAlignTypes = pictureAlignTypes;
+var testIdPrefix = 'PictureWithDescription';
 var cn = (0, _uiHelpers.cnCreate)('mfui-picture-with-description');
 
 var PictureWithDescription = function PictureWithDescription(_ref) {
@@ -46,7 +47,8 @@ var PictureWithDescription = function PictureWithDescription(_ref) {
   }, /*#__PURE__*/React.createElement("div", {
     className: cn('picture', {
       align: pictureAlign
-    })
+    }),
+    "data-testid": "".concat(testIdPrefix, "-picture")
   }, /*#__PURE__*/React.createElement("img", {
     className: cn('img'),
     src: pictureUrl,
@@ -55,7 +57,8 @@ var PictureWithDescription = function PictureWithDescription(_ref) {
     className: cn('articles', {
       align: pictureAlign,
       'text-top-align': isTextTopAlign
-    })
+    }),
+    "data-testid": "".concat(testIdPrefix, "-articles")
   }, !!title && /*#__PURE__*/React.createElement(_uiCore.Header, {
     className: cn('title', [classes.title]),
     as: "h2"

package/dist/lib/components/StoreBanner/StoreBanner.js

@@ -42,6 +42,7 @@ var DeviceMask = {
   WHITE_IPHONE: 'white-iphone'
 };
 exports.DeviceMask = DeviceMask;
+var testIdPrefix = 'StoreBanner';
 var cn = (0, _uiHelpers.cnCreate)('mfui-store-banner');
 
 var StoreBanner = function StoreBanner(_ref) {
@@ -113,9 +114,11 @@ var StoreBanner = function StoreBanner(_ref) {
   }, !linkButton && qrCode && /*#__PURE__*/React.createElement("img", {
     src: qrCode,
     className: cn('qr-code'),
-    alt: "QR-\u043A\u043E\u0434"
+    alt: "QR-\u043A\u043E\u0434",
+    "data-testid": "".concat(testIdPrefix, "-qrCode")
   }), !linkButton && /*#__PURE__*/React.createElement("div", {
-    className: cn('stores')
+    className: cn('stores'),
+    "data-testid": "".concat(testIdPrefix, "-stores")
   }, linkApple && /*#__PURE__*/React.createElement(_StoreButton["default"], {
     dataAttrs: {
       root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkApple

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Tabs } from '@megafon/ui-core';
-declare type TabsPropsType = React.ComponentProps<typeof Tabs> & {
+export declare type TabsPropsType = React.ComponentProps<typeof Tabs> & {
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;
 };

package/dist/lib/components/TabsBox/TabsBox.js

@@ -38,12 +38,13 @@ var cn = (0, _uiHelpers.cnCreate)('mfui-tabs-box');
 
 var TabsBox = function TabsBox(_a) {
   var rootRef = _a.rootRef,
-      props = __rest(_a, ["rootRef"]);
+      children = _a.children,
+      props = __rest(_a, ["rootRef", "children"]);
 
   return /*#__PURE__*/React.createElement("div", {
     ref: rootRef,
     className: cn()
-  }, /*#__PURE__*/React.createElement(_uiCore.Tabs, props));
+  }, /*#__PURE__*/React.createElement(_uiCore.Tabs, props, children));
 };
 
 var _default = TabsBox;

package/dist/lib/components/TextBox/TextBox.js

@@ -40,7 +40,12 @@ var TextBox = function TextBox(_ref) {
 
   var renderTextBoxWithGrid = function renderTextBoxWithGrid() {
     return /*#__PURE__*/React.createElement(_uiCore.Grid, {
-      hAlign: centeringWithLimitedWidth ? 'center' : 'left'
+      hAlign: centeringWithLimitedWidth ? 'center' : 'left',
+      dataAttrs: {
+        container: {
+          'data-testid': 'TextBox-grid'
+        }
+      }
     }, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
       wide: "8",
       desktop: "10",

package/dist/lib/components/TextWithIcon/TextWithIcon.js

@@ -23,6 +23,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+var testIdPrefix = 'TextWithIcon';
 var cn = (0, _uiHelpers.cnCreate)('mfui-text-with-icon');
 
 var TextWithIcon = function TextWithIcon(_ref) {
@@ -42,7 +43,13 @@ var TextWithIcon = function TextWithIcon(_ref) {
   };
 
   var renderContentWithGrid = function renderContentWithGrid() {
-    return /*#__PURE__*/React.createElement(_uiCore.Grid, null, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
+    return /*#__PURE__*/React.createElement(_uiCore.Grid, {
+      dataAttrs: {
+        container: {
+          'data-testid': "".concat(testIdPrefix, "-grid")
+        }
+      }
+    }, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
       mobile: '12',
       tablet: '7',
       desktop: '6',

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

@@ -25,6 +25,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+var testIdPrefix = 'TextWithIconItem';
 var cn = (0, _uiHelpers.cnCreate)('mfui-text-with-icon-item');
 
 var TextWithIconItem = function TextWithIconItem(_ref) {
@@ -48,9 +49,11 @@ var TextWithIconItem = function TextWithIconItem(_ref) {
     className: cn([className]),
     ref: rootRef
   }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
-    className: cn('svg-icon', [classes.icon])
+    className: cn('svg-icon', [classes.icon]),
+    "data-testid": "".concat(testIdPrefix, "-icon")
   }, icon), /*#__PURE__*/React.createElement("div", {
-    className: cn('text', [classes.text])
+    className: cn('text', [classes.text]),
+    "data-testid": "".concat(testIdPrefix, "-text")
   }, renderText));
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-shared",
-  "version": "5.2.0",
+  "version": "5.2.1",
   "files": [
     "dist"
   ],
@@ -82,7 +82,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.8.4",
-    "@megafon/ui-core": "^5.2.2",
+    "@megafon/ui-core": "^5.2.3",
     "@megafon/ui-helpers": "^2.5.3",
     "core-js": "^3.6.4",
     "htmr": "^0.9.2",
@@ -90,5 +90,5 @@
     "prop-types": "^15.7.2",
     "swiper": "^6.5.6"
   },
-  "gitHead": "03a9bcbea7cad951a3c18033c77696c25427c15e"
+  "gitHead": "1bb6769da99d917f5dd4420892c57a7af5be3ab4"
 }