@megafon/ui-shared 5.1.0 → 5.2.1

package/dist/es/components/Table/Table.js

@@ -14,6 +14,8 @@ var Table = function Table(_ref) {
       fixColumn = _ref$fixColumn === void 0 ? true : _ref$fixColumn,
       _ref$minCellSize = _ref.minCellSize,
       minCellSize = _ref$minCellSize === void 0 ? 'large' : _ref$minCellSize,
+      _ref$disableHeightLim = _ref.disableHeightLimit,
+      disableHeightLimit = _ref$disableHeightLim === void 0 ? false : _ref$disableHeightLim,
       children = _ref.children;
   var scrollRef = React.useRef(null);
 
@@ -75,17 +77,23 @@ var Table = function Table(_ref) {
   }, []);
 
   var renderRows = function renderRows() {
-    return React.Children.map(children, function (_ref2) {
+    return React.Children.map(children, function (_ref2, index) {
       var _ref2$props = _ref2.props,
           cells = _ref2$props.children,
-          head = _ref2$props.head;
+          head = _ref2$props.head,
+          _ref2$props$vAlign = _ref2$props.vAlign,
+          vAlign = _ref2$props$vAlign === void 0 ? 'default' : _ref2$props$vAlign;
       return /*#__PURE__*/React.createElement("tr", {
+        key: index,
         className: cn('row', {
-          head: head
-        })
-      }, React.Children.map(cells, function (_ref3) {
+          head: head,
+          align: vAlign
+        }),
+        "data-testid": "Table-row"
+      }, React.Children.map(cells, function (_ref3, cellIndex) {
         var cell = _ref3.props.children;
         return /*#__PURE__*/React.createElement("td", {
+          key: cellIndex,
           className: cn('cell')
         }, typeof cell === 'string' ? convert(cell) : cell);
       }));
@@ -99,7 +107,9 @@ var Table = function Table(_ref) {
       touch: isTouchDevice
     }, [className])
   }, /*#__PURE__*/React.createElement("div", {
-    className: cn('scroll'),
+    className: cn('scroll', {
+      limit: !disableHeightLimit
+    }),
     ref: scrollRef,
     onScroll: handleTableScroll
   }, isTopShadow && /*#__PURE__*/React.createElement("div", {
@@ -119,6 +129,7 @@ Table.propTypes = {
   className: PropTypes.string,
   fixColumn: PropTypes.bool,
   minCellSize: PropTypes.oneOf(['small', 'large']),
+  disableHeightLimit: PropTypes.bool,
   children: PropTypes.arrayOf(PropTypes.element.isRequired).isRequired
 };
 export default Table;

package/dist/es/components/Table/TableRow.d.ts

@@ -3,6 +3,8 @@ import { ITableCell } from './TableCell';
 export interface ITableRow {
     /** Ряд таблицы как заголовок */
     head?: boolean;
+    /** Выравнивание по вертикали в ячейках таблицы */
+    vAlign?: 'default' | 'bottom' | 'top';
     children: Array<React.ReactElement<ITableCell>>;
 }
 declare const TableRow: React.FC<ITableRow>;

package/dist/es/components/Table/TableRow.js

@@ -9,6 +9,8 @@ var TableRow = function TableRow(_ref) {
 TableRow.propTypes = {
   // eslint-disable-next-line react/no-unused-prop-types
   head: PropTypes.bool,
+  // eslint-disable-next-line react/no-unused-prop-types
+  vAlign: PropTypes.oneOf(['default', 'bottom', 'top']),
   children: PropTypes.arrayOf(PropTypes.element.isRequired).isRequired
 };
 export default TableRow;

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/BenefitsIcons/BenefitsIcons.js

@@ -7,10 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 require("core-js/modules/es.array.map.js");
 
 require("core-js/modules/es.object.values.js");
@@ -29,6 +29,8 @@ var _throttleTime = _interopRequireDefault(require("../../constants/throttleTime
 
 var _BenefitsIconsTile = _interopRequireDefault(require("./BenefitsIconsTile"));
 
+var _helpers = _interopRequireWildcard(require("./helpers"));
+
 var _types = require("./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); }
@@ -37,117 +39,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var getLeftSideConfig = function getLeftSideConfig(count, index) {
-  var everySecondWithoutOffset = index % 2 ? '1' : undefined;
-  var columnSize = {
-    wide: '4',
-    desktop: '5',
-    tablet: '10'
-  };
-
-  switch (count) {
-    case 2:
-    case 4:
-      return (0, _extends2["default"])((0, _extends2["default"])({}, columnSize), {
-        leftOffsetWide: everySecondWithoutOffset,
-        leftOffsetDesktop: everySecondWithoutOffset
-      });
-
-    default:
-      return (0, _extends2["default"])((0, _extends2["default"])({}, columnSize), {
-        leftOffsetDesktop: everySecondWithoutOffset
-      });
-  }
-}; // left-aligned column with left-aligned icon on top
-
-
-var getLeftTopConfig = function getLeftTopConfig(count, index) {
-  var everySecondWithoutOffset = index % 2 ? '1' : undefined;
-  var everyThirdWithoutOffset = index % 3 ? '1' : undefined;
-
-  switch (count) {
-    case 2:
-      return {
-        wide: '4',
-        desktop: '4',
-        tablet: '5',
-        leftOffsetWide: everySecondWithoutOffset,
-        leftOffsetDesktop: everySecondWithoutOffset,
-        leftOffsetTablet: everySecondWithoutOffset
-      };
-
-    case 4:
-      return {
-        wide: '3',
-        desktop: '4',
-        tablet: '5',
-        leftOffsetDesktop: everySecondWithoutOffset,
-        leftOffsetTablet: everySecondWithoutOffset
-      };
-
-    default:
-      return {
-        wide: '3',
-        desktop: '4',
-        tablet: '5',
-        leftOffsetWide: everyThirdWithoutOffset,
-        leftOffsetTablet: everySecondWithoutOffset
-      };
-  }
-}; // center-aligned column with center-aligned icon on top
-
-
-var getCenterTopConfig = function getCenterTopConfig(count, index) {
-  var isEvenIndex = !(index % 2);
-  var everyEvenWithLeftOffset = isEvenIndex ? '1' : undefined;
-  var everyOddWithRightOffset = isEvenIndex ? undefined : '1';
-
-  switch (count) {
-    case 4:
-      return {
-        wide: '3',
-        desktop: '5',
-        tablet: '5',
-        leftOffsetDesktop: everyEvenWithLeftOffset,
-        leftOffsetTablet: everyEvenWithLeftOffset,
-        rightOffsetTablet: everyOddWithRightOffset,
-        rightOffsetDesktop: everyOddWithRightOffset
-      };
-
-    default:
-      return {
-        wide: '4',
-        desktop: '4',
-        tablet: '4'
-      };
-  }
-};
-
-var getOneColumnConfig = function getOneColumnConfig(iconPosition) {
-  return iconPosition !== _types.IconPositionEnum.CENTER_TOP ? {
-    wide: '10',
-    desktop: '10',
-    tablet: '10'
-  } : {
-    wide: '12',
-    desktop: '12',
-    tablet: '12'
-  };
-};
-
-var getMultiColumnConfig = function getMultiColumnConfig(iconPosition, count, index) {
-  switch (iconPosition) {
-    case _types.IconPositionEnum.LEFT_TOP:
-      return getLeftTopConfig(count, index);
-
-    case _types.IconPositionEnum.CENTER_TOP:
-      return getCenterTopConfig(count, index);
-
-    default:
-      return getLeftSideConfig(count, index);
-  }
-};
-
+var testIdPrefix = 'BenefitsIcons';
 var cn = (0, _uiHelpers.cnCreate)('mfui-benefits-icons');
 
 var BenefitsIcons = function BenefitsIcons(_ref) {
@@ -202,15 +94,28 @@ var BenefitsIcons = function BenefitsIcons(_ref) {
   }, /*#__PURE__*/React.createElement(_uiCore.Grid, {
     className: classes.grid,
     guttersLeft: "medium",
-    hAlign: itemsAlign
+    hAlign: itemsAlign,
+    dataAttrs: {
+      root: {
+        'data-testid': "".concat(testIdPrefix, "-grid-root")
+      },
+      container: {
+        'data-testid': "".concat(testIdPrefix, "-grid-container")
+      }
+    }
   }, items.map(function (_ref2, i) {
     var title = _ref2.title,
         text = _ref2.text,
         icon = _ref2.icon;
-    var columnConfig = inOneColumn ? getOneColumnConfig(iconPosition) : getMultiColumnConfig(iconPosition, items.length, i);
+    var columnConfig = inOneColumn ? (0, _helpers.getOneColumnConfig)(iconPosition) : (0, _helpers["default"])(iconPosition, items.length, i);
     return /*#__PURE__*/React.createElement(_uiCore.GridColumn, (0, _extends2["default"])({
       className: classes.gridColumn,
-      key: i
+      key: i,
+      dataAttrs: {
+        root: {
+          'data-testid': "".concat(testIdPrefix, "-grid-column")
+        }
+      }
     }, columnConfig), /*#__PURE__*/React.createElement(_BenefitsIconsTile["default"], {
       className: cn('tile', [classes.item]),
       title: title,

package/dist/lib/components/BenefitsIcons/BenefitsIconsTile.js

@@ -25,6 +25,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
+var testIdPrefix = 'BenefitsIconsTile';
 var cn = (0, _uiHelpers.cnCreate)('mfui-benefits-icons-tile');
 
 var BenefitsIconsTile = function BenefitsIconsTile(_ref) {
@@ -37,7 +38,8 @@ var BenefitsIconsTile = function BenefitsIconsTile(_ref) {
   return /*#__PURE__*/React.createElement("div", {
     className: cn({
       'icon-position': iconPosition
-    }, [className])
+    }, [className]),
+    "data-testid": "".concat(testIdPrefix, "-root")
   }, /*#__PURE__*/React.createElement("div", {
     className: cn('svg-icon')
   }, icon), /*#__PURE__*/React.createElement("div", {

package/dist/lib/components/BenefitsIcons/helpers.d.ts

@@ -0,0 +1,8 @@
+import { GridConfig } from './types';
+declare const getLeftSideConfig: (count: number, index: number) => GridConfig;
+declare const getLeftTopConfig: (count: number, index: number) => GridConfig;
+declare const getCenterTopConfig: (count: number, index: number) => GridConfig;
+declare const getOneColumnConfig: (iconPosition: "left-top" | "center-top" | "left-side") => GridConfig;
+declare const getMultiColumnConfig: (iconPosition: "left-top" | "center-top" | "left-side", count: number, index: number) => GridConfig;
+export default getMultiColumnConfig;
+export { getLeftSideConfig, getLeftTopConfig, getCenterTopConfig, getOneColumnConfig };

package/dist/lib/components/BenefitsIcons/helpers.js

@@ -0,0 +1,135 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getOneColumnConfig = exports.getCenterTopConfig = exports.getLeftTopConfig = exports.getLeftSideConfig = exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _types = require("./types");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+// left-aligned column with left side icon
+var getLeftSideConfig = function getLeftSideConfig(count, index) {
+  var everySecondWithoutOffset = index % 2 ? '1' : undefined;
+  var columnSize = {
+    wide: '4',
+    desktop: '5',
+    tablet: '10'
+  };
+
+  switch (count) {
+    case 2:
+    case 4:
+      return (0, _extends2["default"])((0, _extends2["default"])({}, columnSize), {
+        leftOffsetWide: everySecondWithoutOffset,
+        leftOffsetDesktop: everySecondWithoutOffset
+      });
+
+    default:
+      return (0, _extends2["default"])((0, _extends2["default"])({}, columnSize), {
+        leftOffsetDesktop: everySecondWithoutOffset
+      });
+  }
+}; // left-aligned column with left-aligned icon on top
+
+
+exports.getLeftSideConfig = getLeftSideConfig;
+
+var getLeftTopConfig = function getLeftTopConfig(count, index) {
+  var everySecondWithoutOffset = index % 2 ? '1' : undefined;
+  var everyThirdWithoutOffset = index % 3 ? '1' : undefined;
+
+  switch (count) {
+    case 2:
+      return {
+        wide: '4',
+        desktop: '4',
+        tablet: '5',
+        leftOffsetWide: everySecondWithoutOffset,
+        leftOffsetDesktop: everySecondWithoutOffset,
+        leftOffsetTablet: everySecondWithoutOffset
+      };
+
+    case 4:
+      return {
+        wide: '3',
+        desktop: '4',
+        tablet: '5',
+        leftOffsetDesktop: everySecondWithoutOffset,
+        leftOffsetTablet: everySecondWithoutOffset
+      };
+
+    default:
+      return {
+        wide: '3',
+        desktop: '4',
+        tablet: '5',
+        leftOffsetWide: everyThirdWithoutOffset,
+        leftOffsetTablet: everySecondWithoutOffset
+      };
+  }
+}; // center-aligned column with center-aligned icon on top
+
+
+exports.getLeftTopConfig = getLeftTopConfig;
+
+var getCenterTopConfig = function getCenterTopConfig(count, index) {
+  var isEvenIndex = !(index % 2);
+  var everyEvenWithLeftOffset = isEvenIndex ? '1' : undefined;
+  var everyOddWithRightOffset = isEvenIndex ? undefined : '1';
+
+  switch (count) {
+    case 4:
+      return {
+        wide: '3',
+        desktop: '5',
+        tablet: '5',
+        leftOffsetDesktop: everyEvenWithLeftOffset,
+        leftOffsetTablet: everyEvenWithLeftOffset,
+        rightOffsetTablet: everyOddWithRightOffset,
+        rightOffsetDesktop: everyOddWithRightOffset
+      };
+
+    default:
+      return {
+        wide: '4',
+        desktop: '4',
+        tablet: '4'
+      };
+  }
+};
+
+exports.getCenterTopConfig = getCenterTopConfig;
+
+var getOneColumnConfig = function getOneColumnConfig(iconPosition) {
+  return iconPosition !== _types.IconPositionEnum.CENTER_TOP ? {
+    wide: '10',
+    desktop: '10',
+    tablet: '10'
+  } : {
+    wide: '12',
+    desktop: '12',
+    tablet: '12'
+  };
+};
+
+exports.getOneColumnConfig = getOneColumnConfig;
+
+var getMultiColumnConfig = function getMultiColumnConfig(iconPosition, count, index) {
+  switch (iconPosition) {
+    case _types.IconPositionEnum.LEFT_TOP:
+      return getLeftTopConfig(count, index);
+
+    case _types.IconPositionEnum.CENTER_TOP:
+      return getCenterTopConfig(count, index);
+
+    default:
+      return getLeftSideConfig(count, index);
+  }
+};
+
+var _default = getMultiColumnConfig;
+exports["default"] = _default;

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;