@megafon/ui-shared 3.0.0-beta.9 → 3.1.0

package/dist/es/components/Container/Container.css

@@ -344,6 +344,9 @@ h5 {
 .mfui-container .mfui-title-description-box + .mfui-download-links {
   margin-top: 32px;
 }
+.mfui-container .mfui-title-description-box + .mfui-text-with-icon {
+  margin-top: 24px;
+}
 @media screen and (min-width: 768px) and (max-width: 1023px) {
   .mfui-container .mfui-title-description-box + .mfui-benefits-icons {
     margin-top: 48px;
@@ -2230,6 +2233,9 @@ h5 {
 .mfui-container .mfui-text-box + .mfui-download-links {
   margin-top: 32px;
 }
+.mfui-container .mfui-text-box + .mfui-text-with-icon {
+  margin-top: 32px;
+}
 @media screen and (min-width: 768px) and (max-width: 1023px) {
   .mfui-container .mfui-text-box + .mfui-benefits-icons {
     margin-top: 48px;
@@ -2869,6 +2875,163 @@ h5 {
 .mfui-container .mfui-page-title + .mfui-button-link-box {
   margin-top: 0 !important;
 }
+.mfui-container .mfui-text-with-icon + .mfui-benefits-pictures {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-cards-box {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-carousel-box {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-video-block {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-tabs-box {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-partners {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-instructions {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-property {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-table {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-accordion-box {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-button-link-box {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-download-links {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-text-box {
+  margin-top: 32px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-picture-with-description {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-store-banner {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-button-banner {
+  margin-top: 40px;
+}
+.mfui-container .mfui-text-with-icon + .mfui-steps {
+  margin-top: 40px;
+}
+@media screen and (min-width: 768px) and (max-width: 1023px) {
+  .mfui-container .mfui-text-with-icon + .mfui-benefits-pictures {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-cards-box {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-carousel-box {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-video-block {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-tabs-box {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-partners {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-instructions {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-property {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-table {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-accordion-box {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-button-link-box {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-download-links {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-text-box {
+    margin-top: 32px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-picture-with-description {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-store-banner {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-button-banner {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-steps {
+    margin-top: 48px;
+  }
+}
+@media screen and (min-width: 1024px) {
+  .mfui-container .mfui-text-with-icon + .mfui-benefits-pictures {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-cards-box {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-carousel-box {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-video-block {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-tabs-box {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-partners {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-instructions {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-property {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-table {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-accordion-box {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-button-link-box {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-download-links {
+    margin-top: 48px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-text-box {
+    margin-top: 32px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-picture-with-description {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-store-banner {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-button-banner {
+    margin-top: 56px;
+  }
+  .mfui-container .mfui-text-with-icon + .mfui-steps {
+    margin-top: 56px;
+  }
+}
 .mfui-container_disable-padding-top {
   padding-top: 0 !important;
 }

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

@@ -32,6 +32,6 @@ h5 {
   margin: 0;
   font-size: 12px;
   line-height: 16px;
-  color: var(--stcBlack5);
+  color: var(--spbSky3);
   text-transform: uppercase;
 }

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

@@ -1,6 +1,11 @@
 import * as React from 'react';
 import './DownloadLink.less';
 export interface IDownloadLink {
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        link?: Record<string, string>;
+    };
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;
     /** Адресы ссылки */

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

@@ -3,7 +3,7 @@ import "core-js/modules/es.string.link";
 import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { TextLink } from '@megafon/ui-core';
-import { cnCreate } from '@megafon/ui-helpers';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./DownloadLink.css";
 
@@ -26,25 +26,33 @@ var DownloadLink = function DownloadLink(_ref) {
       className = _ref.className,
       _ref$classes = _ref.classes,
       classes = _ref$classes === void 0 ? {} : _ref$classes,
-      rootRef = _ref.rootRef;
-  return /*#__PURE__*/React.createElement("div", {
+      rootRef = _ref.rootRef,
+      dataAttrs = _ref.dataAttrs;
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn([className, classes.root]),
     ref: rootRef
-  }, /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: cn('icon')
   }, /*#__PURE__*/React.createElement(DownloadIcon, {
     className: cn('icon-svg')
   })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(TextLink, {
-    className: cn('link', [classes.link]),
+    download: true,
     href: href,
     onClick: onClick,
-    download: true
+    dataAttrs: {
+      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.link
+    },
+    className: cn('link', [classes.link])
   }, text), /*#__PURE__*/React.createElement("p", {
     className: cn('info')
   }, "".concat(extension).concat(extension && fileSize ? ',' : '', " ").concat(fileSize))));
 };
 
 DownloadLink.propTypes = {
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    link: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
     current: PropTypes.elementType
   }), PropTypes.any])]),

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

@@ -22,6 +22,13 @@ export declare type InstructionItemType = {
     isVideo: boolean;
 };
 export interface IInstructionsProps {
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        item?: Record<string, string>;
+        image?: Record<string, string>;
+        mobileItemText?: Record<string, string>;
+    };
     /** Ссылка на корневой элемент */
     rootRef?: Ref<HTMLDivElement>;
     /** Дополнительные классы для внутренних элементов */

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

@@ -1,4 +1,5 @@
 import "core-js/modules/es.array.map";
+import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 
 /* eslint-disable jsx-a11y/no-static-element-interactions */
@@ -6,7 +7,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /* eslint-disable jsx-a11y/click-events-have-key-events */
 import React from 'react';
 import { Grid, GridColumn, Header, Paragraph } from '@megafon/ui-core';
-import { cnCreate } from '@megafon/ui-helpers';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import convert from 'htmr';
 import PropTypes from 'prop-types';
 import { Swiper, SwiperSlide } from 'swiper/react';
@@ -28,7 +29,8 @@ var cn = cnCreate('mfui-instructions');
 var swiperSlideCn = cn('slide');
 
 var Instructions = function Instructions(_ref) {
-  var rootRef = _ref.rootRef,
+  var dataAttrs = _ref.dataAttrs,
+      rootRef = _ref.rootRef,
       _ref$classes = _ref.classes;
   _ref$classes = _ref$classes === void 0 ? {} : _ref$classes;
   var instructionItem = _ref$classes.instructionItem,
@@ -75,36 +77,37 @@ var Instructions = function Instructions(_ref) {
       swiperInstance && swiperInstance.slideTo(ind);
     };
   }, [swiperInstance]);
-  var renderVideo = React.useCallback(function (mediaUrl) {
-    return /*#__PURE__*/React.createElement("video", {
-      className: cn('swiper-img'),
-      autoPlay: true,
-      muted: true,
+  var renderVideo = React.useCallback(function (mediaUrl, index) {
+    return /*#__PURE__*/React.createElement("video", _extends({
       loop: true,
-      playsInline: true
-    }, /*#__PURE__*/React.createElement("source", {
+      muted: true,
+      autoPlay: true,
+      playsInline: true,
+      className: cn('swiper-img')
+    }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.image, index + 1)), /*#__PURE__*/React.createElement("source", {
       src: mediaUrl,
       type: "video/mp4"
     }));
-  }, []);
+  }, [dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.image]);
   var renderSlider = React.useCallback(function () {
     return /*#__PURE__*/React.createElement(Swiper, {
       className: cn('swiper'),
       onSwiper: getSwiperInstance,
       noSwipingClass: swiperSlideCn
-    }, instructionItems.map(function (_ref2, ind) {
+    }, instructionItems.map(function (_ref2, i) {
       var mediaUrl = _ref2.mediaUrl,
           isVideo = _ref2.isVideo;
       return /*#__PURE__*/React.createElement(SwiperSlide, {
         className: swiperSlideCn,
-        key: ind + mediaUrl
-      }, isVideo ? renderVideo(mediaUrl) : /*#__PURE__*/React.createElement("img", {
-        className: cn('swiper-img', [instructionItemImg]),
-        src: mediaUrl,
-        alt: ""
-      }));
+        key: i + mediaUrl
+      }, isVideo ? renderVideo(mediaUrl, i) : /*#__PURE__*/React.createElement("img", _extends({
+        alt: "",
+        src: mediaUrl
+      }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.image, i + 1), {
+        className: cn('swiper-img', [instructionItemImg])
+      })));
     }));
-  }, [getSwiperInstance, instructionItemImg, instructionItems, renderVideo]);
+  }, [getSwiperInstance, instructionItemImg, instructionItems, renderVideo, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.image]);
   var renderTitle = React.useCallback(function (resolution) {
     return /*#__PURE__*/React.createElement(Header, {
       className: cn('title', {
@@ -136,28 +139,28 @@ var Instructions = function Instructions(_ref) {
         'text-after': !!text,
         desktop: true
       })
-    }, instructionItems.map(function (_ref3, ind) {
+    }, instructionItems.map(function (_ref3, i) {
       var itemTitle = _ref3.title;
       return (
         /*#__PURE__*/
         // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-        React.createElement("li", {
+        React.createElement("li", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, i + 1), {
           className: cn('articles-item', {
-            active: slideIndex === ind
-          }, [getActiveCustomClass(ind, slideIndex), instructionItem, desktopInstructionItem]),
-          "data-index": ind,
-          onClick: handleArticleClick(ind),
-          key: ind
-        }, /*#__PURE__*/React.createElement("div", {
+            active: slideIndex === i
+          }, [getActiveCustomClass(i, slideIndex), instructionItem, desktopInstructionItem]),
+          "data-index": i,
+          onClick: handleArticleClick(i),
+          key: i
+        }), /*#__PURE__*/React.createElement("div", {
           className: cn('articles-item-dot')
         }, /*#__PURE__*/React.createElement("span", {
           className: cn('articles-item-dot-number')
-        }, ind + 1)), /*#__PURE__*/React.createElement("div", {
+        }, i + 1)), /*#__PURE__*/React.createElement("div", {
           className: cn('articles-item-title', [desktopItemTitle])
         }, itemTitle))
       );
     }));
-  }, [desktopInstructionItem, desktopItemTitle, getActiveCustomClass, handleArticleClick, instructionItem, instructionItems, slideIndex, text]);
+  }, [desktopInstructionItem, desktopItemTitle, getActiveCustomClass, handleArticleClick, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, instructionItem, instructionItems, slideIndex, text]);
   var renderMobileArticles = React.useCallback(function () {
     return /*#__PURE__*/React.createElement("div", {
       className: cn('articles-list', {
@@ -165,35 +168,36 @@ var Instructions = function Instructions(_ref) {
       })
     }, /*#__PURE__*/React.createElement("div", {
       className: cn('articles-title-block')
-    }, instructionItems.map(function (_ref4, ind) {
+    }, instructionItems.map(function (_ref4, i) {
       var itemTitle = _ref4.title;
-      return slideIndex === ind && /*#__PURE__*/React.createElement("div", {
-        className: cn('articles-title', [mobileItemTitle]),
-        "data-index": ind,
-        key: ind
-      }, itemTitle);
+      return slideIndex === i && /*#__PURE__*/React.createElement("div", _extends({
+        key: i,
+        "data-index": i
+      }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.mobileItemText, i + 1), {
+        className: cn('articles-title', [mobileItemTitle])
+      }), itemTitle);
     })), /*#__PURE__*/React.createElement("ul", {
       className: cn('articles-dots', {
         'text-after': !!text
       })
-    }, instructionItems.map(function (_item, ind) {
-      return /*#__PURE__*/React.createElement("div", {
-        key: ind,
+    }, 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,
         className: cn('articles-dot', {
-          active: slideIndex === ind
-        }, [getActiveCustomClass(ind, slideIndex), instructionItem, mobileInstructionItem]),
-        onClick: handleArticleClick(ind)
-      }, /*#__PURE__*/React.createElement("span", {
+          active: slideIndex === i
+        }, [getActiveCustomClass(i, slideIndex), instructionItem, mobileInstructionItem]),
+        onClick: handleArticleClick(i)
+      }), /*#__PURE__*/React.createElement("span", {
         className: cn('articles-dot-number')
-      }, ind + 1));
+      }, i + 1));
     })));
-  }, [getActiveCustomClass, handleArticleClick, instructionItem, instructionItems, mobileInstructionItem, mobileItemTitle, slideIndex, text]);
-  return /*#__PURE__*/React.createElement("div", {
+  }, [dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.mobileItemText, getActiveCustomClass, handleArticleClick, instructionItem, instructionItems, mobileInstructionItem, mobileItemTitle, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, slideIndex, text]);
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       mask: pictureMask
     }),
     ref: rootRef
-  }, /*#__PURE__*/React.createElement(Grid, {
+  }), /*#__PURE__*/React.createElement(Grid, {
     hAlign: "center"
   }, /*#__PURE__*/React.createElement(GridColumn, {
     all: "12"
@@ -211,6 +215,12 @@ var Instructions = function Instructions(_ref) {
 };
 
 Instructions.propTypes = {
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    item: PropTypes.objectOf(PropTypes.string.isRequired),
+    image: PropTypes.objectOf(PropTypes.string.isRequired),
+    mobileItemText: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
     current: PropTypes.elementType
   }), PropTypes.any])]),

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

@@ -2,6 +2,12 @@ import * as React from 'react';
 import './PageTitle.less';
 import { Props as BreadcrumbsType } from '../Breadcrumbs/Breadcrumbs';
 declare type Props = {
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        breadcrumbs?: Record<string, string>;
+        breadcrumbsLink?: Record<string, string>;
+    };
     /** Текст заголовка */
     title: string | React.ReactNode | React.ReactNode[];
     /** Хлебные крошки */

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

@@ -1,13 +1,15 @@
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { Header, Grid, GridColumn } from '@megafon/ui-core';
-import { cnCreate } from '@megafon/ui-helpers';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import PropTypes from 'prop-types';
 import "./PageTitle.css";
 import Breadcrumbs from "../Breadcrumbs/Breadcrumbs";
 var cn = cnCreate('mfui-page-title');
 
 var PageTitle = function PageTitle(_ref) {
-  var title = _ref.title,
+  var dataAttrs = _ref.dataAttrs,
+      title = _ref.title,
       breadcrumbs = _ref.breadcrumbs,
       badge = _ref.badge,
       _ref$isFullWidth = _ref.isFullWidth,
@@ -37,16 +39,25 @@ var PageTitle = function PageTitle(_ref) {
       mobile: "12"
     }, renderPageTitle()));
   }, [renderPageTitle]);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn([className]),
     ref: rootRef
-  }, (breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) && /*#__PURE__*/React.createElement(Breadcrumbs, {
+  }), (breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) && /*#__PURE__*/React.createElement(Breadcrumbs, {
     items: breadcrumbs,
+    dataAttrs: {
+      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.breadcrumbs,
+      link: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.breadcrumbsLink
+    },
     className: cn('breadcrumbs', [classes.breadcrumbs])
   }), isFullWidth ? renderPageTitle() : renderPageTitleWithGrid());
 };
 
 PageTitle.propTypes = {
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    breadcrumbs: PropTypes.objectOf(PropTypes.string.isRequired),
+    breadcrumbsLink: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   title: PropTypes.oneOfType([PropTypes.string, PropTypes.node, PropTypes.arrayOf(PropTypes.node)]).isRequired,
   breadcrumbs: PropTypes.arrayOf(PropTypes.shape({
     title: PropTypes.string.isRequired,

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

@@ -6,6 +6,11 @@ export declare type ItemType = {
     alt: string;
 };
 export interface IPartnersProps {
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        item?: Record<string, string>;
+    };
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;
     /** Дополнительные классы для корневого и внутренних элементов */
@@ -13,10 +18,6 @@ export interface IPartnersProps {
         root?: string;
         itemClass?: string;
     };
-    /** Дата атрибуты для корневого элемента */
-    dataAttrs?: {
-        [key: string]: string;
-    };
     /** Дополнительный класс корневого элемента */
     className?: string;
     /** Список логотипов */

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

@@ -36,6 +36,8 @@ var Partners = function Partners(_ref) {
       onNextClick = _ref.onNextClick,
       onPrevClick = _ref.onPrevClick;
   var renderItem = React.useCallback(function (item) {
+    var index = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+
     if (!item) {
       return null;
     }
@@ -44,10 +46,13 @@ var Partners = function Partners(_ref) {
         href = item.href,
         alt = item.alt;
     return /*#__PURE__*/React.createElement(Tile, {
-      className: cn('tile'),
       href: href,
       shadowLevel: "low",
-      isInteractive: !!href
+      isInteractive: !!href,
+      className: cn('tile'),
+      dataAttrs: {
+        root: _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item, index + 1))
+      }
     }, /*#__PURE__*/React.createElement("div", {
       className: cn('tile-inner', [itemClass])
     }, /*#__PURE__*/React.createElement("div", {
@@ -57,7 +62,7 @@ var Partners = function Partners(_ref) {
       alt: alt,
       className: cn('tile-img')
     }))));
-  }, [itemClass]);
+  }, [itemClass, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.item]);
   var renderGrid = React.useCallback(function () {
     return /*#__PURE__*/React.createElement(Grid, {
       guttersLeft: "medium",
@@ -67,7 +72,7 @@ var Partners = function Partners(_ref) {
         key: i + item.src,
         all: "3",
         mobile: "6"
-      }, renderItem(item));
+      }, renderItem(item, i));
     }));
   }, [items, renderItem]);
   var renderCarousel = React.useCallback(function () {
@@ -83,13 +88,13 @@ var Partners = function Partners(_ref) {
       return /*#__PURE__*/React.createElement("div", {
         key: i + item.src,
         className: cn('slide')
-      }, renderItem(item), renderItem(bottomRow[i]));
+      }, renderItem(item, i), renderItem(bottomRow[i], i));
     }));
   }, [items, onChange, onNextClick, onPrevClick, renderItem]);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: rootRef,
     className: cn([root, className])
-  }, filterDataAttrs(dataAttrs)), items.length > MAX_GRID_ITEMS_LENGTH ? renderCarousel() : renderGrid());
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), items.length > MAX_GRID_ITEMS_LENGTH ? renderCarousel() : renderGrid());
 };
 
 Partners.propTypes = {
@@ -100,7 +105,10 @@ Partners.propTypes = {
     root: PropTypes.string,
     itemClass: PropTypes.string
   }),
-  dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    item: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   className: PropTypes.string,
   items: PropTypes.arrayOf(PropTypes.shape({
     href: PropTypes.string,

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

@@ -18,9 +18,10 @@ export interface IProperty {
     icon?: React.ReactNode;
     /** Растягивание компонента на всю доступную ширину */
     fullWidth?: boolean;
-    /** Дата атрибуты для корневого элемента */
+    /** Дополнительные data атрибуты к внутренним элементам */
     dataAttrs?: {
-        [key: string]: string;
+        root?: Record<string, string>;
+        moreLink?: Record<string, string>;
     };
     /** Дополнительные классы для внутренних элементов */
     classes?: {

package/dist/es/components/Property/Property.js

@@ -47,13 +47,16 @@ var Property = function Property(_ref) {
       }, /*#__PURE__*/React.createElement(PropertyDescription, {
         value: value,
         isCollapsible: isCollapsible,
+        dataAttrs: {
+          moreLink: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.moreLink
+        },
         classes: {
           open: classes.openedDescription,
           toggle: classes.toggleDescription
         }
       }));
     });
-  }, [classes.openedDescription, classes.toggleDescription]);
+  }, [classes.openedDescription, classes.toggleDescription, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.moreLink]);
   var getColumnConfig = React.useCallback(function () {
     return fullWidth ? {
       all: '12'
@@ -69,7 +72,7 @@ var Property = function Property(_ref) {
       'border-bottom': borderBottom
     }, [className]),
     ref: rootRef
-  }, filterDataAttrs(dataAttrs)), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, getColumnConfig(), /*#__PURE__*/React.createElement("div", {
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, getColumnConfig(), /*#__PURE__*/React.createElement("div", {
     className: cn('wrapper')
   }, badge && /*#__PURE__*/React.createElement("div", {
     className: cn('badge-wrapper')
@@ -120,7 +123,10 @@ Property.propTypes = {
   mergedValue: PropTypes.string,
   icon: PropTypes.node,
   fullWidth: PropTypes.bool,
-  dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    moreLink: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   classes: PropTypes.shape({
     title: PropTypes.string,
     openedDescription: PropTypes.string,