@megafon/ui-core 3.0.0-beta.6 → 3.0.0

package/dist/es/components/Button/Button.js

@@ -96,7 +96,7 @@ var Button = function Button(_ref) {
       return;
     }
 
-    onClick && onClick(e);
+    onClick === null || onClick === void 0 ? void 0 : onClick(e);
   }, [disabled, onClick]);
   var currentTheme = React.useMemo(function () {
     return type === ButtonTypes.PRIMARY && theme === ButtonThemes.BLACK ? ButtonThemes.GREEN : theme;
@@ -121,16 +121,16 @@ var Button = function Button(_ref) {
       return null;
     }
 
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content), {
       className: cn('content', contentClassName)
-    }, icon && /*#__PURE__*/React.createElement("div", {
+    }), icon && /*#__PURE__*/React.createElement("div", {
       className: cn('icon')
     }, icon), children && /*#__PURE__*/React.createElement("span", {
       className: cn('text')
     }, children), !icon && showArrow && /*#__PURE__*/React.createElement(Arrow, {
       className: cn('icon-arrow')
     }));
-  }, [contentClassName, showArrow, icon, children]);
+  }, [children, icon, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content, contentClassName, showArrow]);
   var contentType = React.useMemo(function () {
     switch (true) {
       case icon && !children:
@@ -145,6 +145,9 @@ var Button = function Button(_ref) {
   }, [icon, children]);
   var renderedLoader = React.useMemo(function () {
     return /*#__PURE__*/React.createElement(Preloader, {
+      dataAttrs: {
+        root: filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader)
+      },
       color: loaderColor,
       sizeAll: getLoaderSize(sizeAll),
       sizeWide: sizeWide && getLoaderSize(sizeWide),
@@ -152,7 +155,7 @@ var Button = function Button(_ref) {
       sizeTablet: sizeTablet && getLoaderSize(sizeTablet),
       sizeMobile: sizeMobile && getLoaderSize(sizeMobile)
     });
-  }, [sizeAll, sizeWide, sizeDesktop, sizeTablet, sizeMobile]);
+  }, [dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader, loaderColor, sizeAll, sizeWide, sizeDesktop, sizeTablet, sizeMobile]);
 
   var setRelAttribute = function setRelAttribute() {
     if (ElementType !== 'a') {
@@ -174,7 +177,7 @@ var Button = function Button(_ref) {
   React.useEffect(function () {
     setTouch(detectTouch());
   }, []);
-  return /*#__PURE__*/React.createElement(ElementType, _extends({}, filterDataAttrs(dataAttrs), {
+  return /*#__PURE__*/React.createElement(ElementType, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       type: type,
       theme: currentTheme,
@@ -197,9 +200,9 @@ var Button = function Button(_ref) {
     onClick: handleClick,
     disabled: !href && disabled,
     ref: buttonRef
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner), {
     className: cn('inner', innerClassName)
-  }, !showLoader ? renderedContent : renderedLoader));
+  }), !showLoader ? renderedContent : renderedLoader));
 };
 
 Button.propTypes = {
@@ -208,6 +211,12 @@ Button.propTypes = {
     content: PropTypes.string,
     inner: PropTypes.string
   }),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    content: PropTypes.objectOf(PropTypes.string.isRequired),
+    inner: PropTypes.objectOf(PropTypes.string.isRequired),
+    loader: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   theme: PropTypes.oneOf(Object.values(ButtonThemes)),
   type: PropTypes.oneOf(Object.values(ButtonTypes)),
   href: PropTypes.string,
@@ -225,7 +234,6 @@ Button.propTypes = {
   showArrow: PropTypes.bool,
   icon: PropTypes.element,
   disabled: PropTypes.bool,
-  dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
   buttonRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
     current: PropTypes.elementType
   }), PropTypes.any])]),

package/dist/es/components/Calendar/Calendar.js

@@ -113,7 +113,7 @@ var Calendar = function Calendar(_ref) {
   useEffect(function () {
     var propsStartDate = calendarStateFromProps.startDate;
     setCalendarState(calendarStateFromProps);
-    propsStartDate && goToDate(propsStartDate);
+    propsStartDate && goToDate(propsStartDate); // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [calendarStateFromProps]);
 
   var getCalendarState = function getCalendarState(date) {
@@ -178,7 +178,7 @@ var Calendar = function Calendar(_ref) {
     var nextStartDate = nextState.startDate,
         nextEndDate = nextState.endDate;
     setCalendarState(nextState);
-    onChange && onChange(nextStartDate, nextEndDate);
+    onChange === null || onChange === void 0 ? void 0 : onChange(nextStartDate, nextEndDate);
   };
 
   var handleDateHover = function handleDateHover(date) {
@@ -224,6 +224,7 @@ var Calendar = function Calendar(_ref) {
       var month = _ref2.month,
           year = _ref2.year;
 
+      // eslint-disable-next-line react-hooks/rules-of-hooks
       var _useMonth = useMonth({
         year: year,
         month: month,

package/dist/es/components/Calendar/components/Day/Day.js

@@ -60,7 +60,7 @@ var Day = function Day(_a) {
   };
 
   var handleMouseLeave = function handleMouseLeave() {
-    onMouseLeave && onMouseLeave();
+    onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave();
   };
 
   return /*#__PURE__*/React.createElement("button", {

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

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { IFilterDataAttrs } from '@megafon/ui-helpers';
 import SwiperCore from 'swiper';
 import { PaginationOptions } from 'swiper/types/components/pagination';
 import './Carousel.less';
@@ -24,7 +23,7 @@ export declare type SlidesSettingsType = {
         spaceBetween: number;
     };
 };
-export interface ICarouselProps extends IFilterDataAttrs {
+export interface ICarouselProps {
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;
     /** Дополнительные классы для корневого элемента */
@@ -39,6 +38,14 @@ export interface ICarouselProps extends IFilterDataAttrs {
         next?: string;
         slide?: string;
     };
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        slider?: Record<string, string>;
+        prev?: Record<string, string>;
+        next?: Record<string, string>;
+        slide?: Record<string, string>;
+    };
     /** Настройки слайдов */
     slidesSettings?: SlidesSettingsType;
     /** Смена слайдов с зацикливанием */

package/dist/es/components/Carousel/Carousel.js

@@ -122,7 +122,8 @@ var Carousel = function Carousel(_ref) {
       return;
     }
 
-    autoplay.stop();
+    autoplay.stop(); // eslint-disable-next-line no-param-reassign
+
     params.autoplay.delay = autoPlayDelay * 3;
     autoplay.start();
   }, [autoPlayDelay]);
@@ -132,7 +133,7 @@ var Carousel = function Carousel(_ref) {
     }
 
     swiperInstance.slidePrev();
-    onPrevClick && onPrevClick(swiperInstance.realIndex);
+    onPrevClick === null || onPrevClick === void 0 ? void 0 : onPrevClick(swiperInstance.realIndex);
     increaseAutoplayDelay(swiperInstance);
   }, [swiperInstance, onPrevClick, increaseAutoplayDelay]);
   var handleNextClick = React.useCallback(function () {
@@ -141,14 +142,14 @@ var Carousel = function Carousel(_ref) {
     }
 
     swiperInstance.slideNext();
-    onNextClick && onNextClick(swiperInstance.realIndex);
+    onNextClick === null || onNextClick === void 0 ? void 0 : onNextClick(swiperInstance.realIndex);
     increaseAutoplayDelay(swiperInstance);
   }, [swiperInstance, onNextClick, increaseAutoplayDelay]);
   var handleSwiper = React.useCallback(function (swiper) {
     setSwiperInstance(swiper);
     setLocked(swiper.isBeginning && swiper.isEnd);
-    getSwiper && getSwiper(swiper);
-  }, []);
+    getSwiper === null || getSwiper === void 0 ? void 0 : getSwiper(swiper);
+  }, [getSwiper]);
   var handleReachBeginnig = React.useCallback(function () {
     setBeginning(true);
   }, []);
@@ -169,7 +170,7 @@ var Carousel = function Carousel(_ref) {
     var realIndex = _ref4.realIndex,
         previousIndex = _ref4.previousIndex,
         params = _ref4.params;
-    onChange && onChange(realIndex, previousIndex, params.slidesPerView);
+    onChange === null || onChange === void 0 ? void 0 : onChange(realIndex, previousIndex, params.slidesPerView);
   }, [onChange]);
 
   var handleRootClick = function handleRootClick(e) {
@@ -182,15 +183,17 @@ var Carousel = function Carousel(_ref) {
   }; // https://github.com/nolimits4web/Swiper/issues/2346
 
 
-  var handleSwiperResize = React.useCallback(throttle(function (swiper) {
-    setBeginning(swiper.isBeginning);
-    setEnd(swiper.isEnd);
-    setLocked(swiper.isBeginning && swiper.isEnd);
+  var handleSwiperResize = React.useCallback(function () {
+    throttle(function (swiper) {
+      setBeginning(swiper.isBeginning);
+      setEnd(swiper.isEnd);
+      setLocked(swiper.isBeginning && swiper.isEnd);
 
-    if (swiper.params.slidesPerView === SlidesPerView.AUTO) {
-      swiper.slides.css('width', '');
-    }
-  }, throttleTime.resize), []);
+      if (swiper.params.slidesPerView === SlidesPerView.AUTO) {
+        swiper.slides.css('width', '');
+      }
+    }, throttleTime.resize);
+  }, []);
 
   var handleSlideFocus = function handleSlideFocus(index) {
     return function (e) {
@@ -215,7 +218,7 @@ var Carousel = function Carousel(_ref) {
     e.nativeEvent.preventDefault();
   };
 
-  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs), {
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     ref: rootRef,
     className: cn({
       'nav-theme': navTheme
@@ -223,7 +226,7 @@ var Carousel = function Carousel(_ref) {
     onClick: handleRootClick
   }), /*#__PURE__*/React.createElement(Swiper, _extends({}, containerModifier ? {
     containerModifierClass: containerModifier
-  } : {}, {
+  } : {}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slider), {
     className: cn('swiper', {
       'default-inner-indents': !innerIndentsClass
     }, [innerIndentsClass, containerClass]),
@@ -253,13 +256,13 @@ var Carousel = function Carousel(_ref) {
     onTouchEnd: increaseAutoplayDelay,
     onResize: handleSwiperResize
   }), React.Children.map(children, function (child, i) {
-    return /*#__PURE__*/React.createElement(SwiperSlide, {
+    return /*#__PURE__*/React.createElement(SwiperSlide, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.slide, i + 1), {
       key: i,
       className: cn('slide', slideClass),
       onFocus: handleSlideFocus(i),
       onMouseDown: disableFocusOnSlideClick
-    }, child);
-  })), /*#__PURE__*/React.createElement(NavArrow, {
+    }), child);
+  })), /*#__PURE__*/React.createElement(NavArrow, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.prev), {
     className: cn('arrow', {
       prev: true,
       locked: isLocked
@@ -267,7 +270,7 @@ var Carousel = function Carousel(_ref) {
     onClick: handlePrevClick,
     disabled: !loop && isBeginning,
     theme: ArrowTheme.PURPLE
-  }), /*#__PURE__*/React.createElement(NavArrow, {
+  })), /*#__PURE__*/React.createElement(NavArrow, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.next), {
     className: cn('arrow', {
       next: true,
       locked: isLocked
@@ -276,7 +279,7 @@ var Carousel = function Carousel(_ref) {
     onClick: handleNextClick,
     disabled: !loop && isEnd,
     theme: ArrowTheme.PURPLE
-  }));
+  })));
 };
 
 Carousel.propTypes = {
@@ -293,7 +296,13 @@ Carousel.propTypes = {
     next: PropTypes.string,
     slide: PropTypes.string
   }),
-  dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    slider: PropTypes.objectOf(PropTypes.string.isRequired),
+    prev: PropTypes.objectOf(PropTypes.string.isRequired),
+    next: PropTypes.objectOf(PropTypes.string.isRequired),
+    slide: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   slidesSettings: PropTypes.objectOf(checkBreakpointsPropTypes({
     slidesPerView: PropTypes.oneOfType([PropTypes.number, PropTypes.oneOf(Object.values(SlidesPerView))]).isRequired,
     spaceBetween: PropTypes.number.isRequired,

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

@@ -1,7 +1,6 @@
 import React from 'react';
-import { IFilterDataAttrs } from '@megafon/ui-helpers';
 import './Checkbox.less';
-export interface ICheckboxProps extends IFilterDataAttrs {
+export interface ICheckboxProps {
     /** Цвет чекбокса */
     color?: 'dark' | 'light';
     /** Дополнительный класс корневого элемента */
@@ -11,6 +10,13 @@ export interface ICheckboxProps extends IFilterDataAttrs {
         inner?: string;
         icon?: string;
     };
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        input?: Record<string, string>;
+        customInput?: Record<string, string>;
+        extraContent?: Record<string, string>;
+    };
     /** Размер текста */
     fontSize?: 'regular' | 'small';
     /** Имя компонента в DOM */

package/dist/es/components/Checkbox/Checkbox.js

@@ -48,7 +48,7 @@ var Checkbox = function Checkbox(_ref) {
   var handleChange = function handleChange(e) {
     if (checkEventIsClickOrEnterPress(e) || e.type === CHANGE_KEY) {
       setIsChecked(!isChecked);
-      onChange && onChange(!isChecked);
+      onChange === null || onChange === void 0 ? void 0 : onChange(!isChecked);
     }
   };
 
@@ -60,13 +60,13 @@ var Checkbox = function Checkbox(_ref) {
       disabled: disabled,
       error: error
     }, className)
-  }, filterDataAttrs(dataAttrs)), /*#__PURE__*/React.createElement("div", {
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
     className: cn('inner', [classes === null || classes === void 0 ? void 0 : classes.inner])
   }, /*#__PURE__*/React.createElement("label", {
     className: cn('label', {
       'no-touch': !isTouch
     })
-  }, /*#__PURE__*/React.createElement("input", {
+  }, /*#__PURE__*/React.createElement("input", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.input), {
     className: cn('input'),
     type: "checkbox",
     tabIndex: -1,
@@ -75,17 +75,17 @@ var Checkbox = function Checkbox(_ref) {
     checked: isChecked,
     onChange: handleChange,
     disabled: disabled
-  }), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.customInput), {
     tabIndex: 0,
     role: "checkbox",
     "aria-checked": isChecked,
     className: cn('custom-input', [classes === null || classes === void 0 ? void 0 : classes.icon]),
     onKeyDown: handleChange
-  }, /*#__PURE__*/React.createElement(CheckedIcon, {
+  }), /*#__PURE__*/React.createElement(CheckedIcon, {
     className: cn('icon')
-  })), children), extraContent && /*#__PURE__*/React.createElement("span", {
+  })), children), extraContent && /*#__PURE__*/React.createElement("span", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.extraContent), {
     className: cn('extra-content')
-  }, extraContent)));
+  }), extraContent)));
 };
 
 Checkbox.propTypes = {
@@ -97,9 +97,14 @@ Checkbox.propTypes = {
   checked: PropTypes.bool,
   disabled: PropTypes.bool,
   error: PropTypes.bool,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    input: PropTypes.objectOf(PropTypes.string.isRequired),
+    customInput: PropTypes.objectOf(PropTypes.string.isRequired),
+    extraContent: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element, PropTypes.string]).isRequired,
   extraContent: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element, PropTypes.string]),
-  dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
   onChange: PropTypes.func
 };
 export default Checkbox;

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

@@ -1,23 +1,35 @@
 import * as React from 'react';
 import * as PropTypes from 'prop-types';
-declare type DefaultProps = {
+declare type CollapseDefaultProps = {
     animation?: boolean;
     animationDuration?: number;
 };
-declare type Props = DefaultProps & {
+declare type CollapseProps = CollapseDefaultProps & {
     className: string;
     classNameContainer: string;
     isOpened: boolean;
+    dataAttrs?: {
+        root?: Record<string, string>;
+        inner?: Record<string, string>;
+    };
     children: React.ReactNode;
 };
 declare const Collapse: {
-    (props: Props): React.FunctionComponentElement<Props>;
+    (props: CollapseProps): React.FunctionComponentElement<CollapseProps>;
     propTypes: {
         className: PropTypes.Requireable<string>;
         classNameContainer: PropTypes.Requireable<string>;
         isOpened: PropTypes.Validator<boolean>;
         animationDuration: PropTypes.Requireable<number>;
         animation: PropTypes.Requireable<boolean>;
+        dataAttrs: PropTypes.Requireable<PropTypes.InferProps<{
+            root: PropTypes.Requireable<{
+                [x: string]: string;
+            }>;
+            inner: PropTypes.Requireable<{
+                [x: string]: string;
+            }>;
+        }>>;
         children: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
     };
 };

package/dist/es/components/Collapse/Collapse.js

@@ -1,6 +1,8 @@
 import "core-js/modules/web.timers";
+import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import * as React from 'react';
+import { filterDataAttrs } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 var BROWSER_DELAY = 100;
 
@@ -12,7 +14,8 @@ var Collapse = function Collapse(props) {
       _props$animationDurat = props.animationDuration,
       animationDuration = _props$animationDurat === void 0 ? 300 : _props$animationDurat,
       children = props.children,
-      isOpened = props.isOpened;
+      isOpened = props.isOpened,
+      dataAttrs = props.dataAttrs;
   var canUpdate = React.useRef(false);
   var timer = React.useRef(undefined);
   var rootNode = React.useRef(null);
@@ -59,7 +62,7 @@ var Collapse = function Collapse(props) {
       return clearTimeout(timer.current);
     };
   }, [isOpened, duration]);
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: className,
     style: {
       overflow: 'hidden',
@@ -67,9 +70,9 @@ var Collapse = function Collapse(props) {
       transition: transition
     },
     ref: rootNode
-  }, /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner), {
     className: classNameContainer
-  }, children));
+  }), children));
 };
 
 Collapse.propTypes = {
@@ -78,6 +81,10 @@ Collapse.propTypes = {
   isOpened: PropTypes.bool.isRequired,
   animationDuration: PropTypes.number,
   animation: PropTypes.bool,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    inner: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   children: PropTypes.node.isRequired
 };
 export default Collapse;

package/dist/es/components/Counter/Counter.js

@@ -56,15 +56,15 @@ var Counter = function Counter(_ref) {
     }
 
     if (inputValue < min) {
-      onChange && onChange(min);
+      onChange === null || onChange === void 0 ? void 0 : onChange(min);
     }
 
     if (inputValue > max) {
-      onChange && onChange(max);
+      onChange === null || onChange === void 0 ? void 0 : onChange(max);
     }
 
     if (inputValue >= min && inputValue <= max) {
-      onChange && onChange(inputValue);
+      onChange === null || onChange === void 0 ? void 0 : onChange(inputValue);
     }
   }, [min, max, onChange, isControlled]);
   var handleMinusClick = React.useCallback(function () {

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

@@ -1,7 +1,6 @@
 import * as React from 'react';
-import { IFilterDataAttrs } from '@megafon/ui-helpers';
 import './Header.less';
-interface IHeaderProps extends IFilterDataAttrs {
+interface IHeaderProps {
     /** Тег */
     as?: 'h1' | 'h2' | 'h3' | 'h5';
     /** Цвет */
@@ -12,6 +11,10 @@ interface IHeaderProps extends IFilterDataAttrs {
     addition?: JSX.Element;
     /** Дополнительный класс корневого элемента */
     className?: string | string[];
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
     /** Горизонтальное выравнивание */
     hAlign?: 'inherit' | 'left' | 'center' | 'right';
     /** Обработчик клика */

package/dist/es/components/Header/Header.js

@@ -19,7 +19,7 @@ var Header = function Header(_ref) {
       margin = _ref.margin,
       onClick = _ref.onClick;
   var ElementType = level;
-  return /*#__PURE__*/React.createElement(ElementType, _extends({}, filterDataAttrs(dataAttrs), {
+  return /*#__PURE__*/React.createElement(ElementType, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       color: color,
       margin: margin,
@@ -38,7 +38,9 @@ Header.propTypes = {
   margin: PropTypes.bool,
   addition: PropTypes.element,
   hAlign: PropTypes.oneOf(['inherit', 'left', 'center', 'right']),
-  dataAttrs: PropTypes.objectOf(PropTypes.string.isRequired),
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   onClick: PropTypes.func
 };
 export default Header;

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

@@ -2,6 +2,9 @@ import * as React from 'react';
 import './InputLabel.less';
 export interface IInputLabelProps {
     htmlFor?: string;
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
 }
 declare const InputLabel: React.FC<IInputLabelProps>;
 export default InputLabel;

package/dist/es/components/InputLabel/InputLabel.js

@@ -1,19 +1,24 @@
+import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
-import { cnCreate } from '@megafon/ui-helpers';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
 import * as PropTypes from 'prop-types';
 import "./InputLabel.css";
 var cn = cnCreate('mfui-input-label');
 
 var InputLabel = function InputLabel(_ref) {
   var htmlFor = _ref.htmlFor,
+      dataAttrs = _ref.dataAttrs,
       children = _ref.children;
-  return /*#__PURE__*/React.createElement("label", {
+  return /*#__PURE__*/React.createElement("label", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     htmlFor: htmlFor,
     className: cn()
-  }, children);
+  }), children);
 };
 
 InputLabel.propTypes = {
-  htmlFor: PropTypes.string
+  htmlFor: PropTypes.string,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired)
+  })
 };
 export default InputLabel;

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 export interface ILinkProps {
     /** Дополнительный класс корневого элемента */
     className?: string;
@@ -8,11 +8,15 @@ export interface ILinkProps {
     target?: '_self' | '_blank' | '_parent' | '_top';
     /** rel - аргумент тега <a> */
     rel?: string;
-    /** Обработчик клика */
-    onClick?: (e: React.MouseEvent<EventTarget>) => void;
     /** Добавление атрибута download */
     download?: boolean;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
     children?: JSX.Element[] | Element[] | JSX.Element | string | Element | React.ReactNode;
+    /** Обработчик клика */
+    onClick?: (e: React.MouseEvent<EventTarget>) => void;
 }
 declare const Link: React.FC<ILinkProps>;
 export default Link;

package/dist/es/components/Link/Link.js

@@ -1,12 +1,25 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { filterDataAttrs } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 
-var Link = function Link(props) {
-  return (
-    /*#__PURE__*/
-    // eslint-disable-next-line jsx-a11y/anchor-has-content
-    React.createElement("a", props)
-  );
+var Link = function Link(_ref) {
+  var target = _ref.target,
+      href = _ref.href,
+      rel = _ref.rel,
+      onClick = _ref.onClick,
+      className = _ref.className,
+      download = _ref.download,
+      children = _ref.children,
+      dataAttrs = _ref.dataAttrs;
+  return /*#__PURE__*/React.createElement("a", _extends({
+    className: className,
+    href: href,
+    target: target,
+    rel: rel,
+    download: download,
+    onClick: onClick
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), children);
 };
 
 Link.propTypes = {
@@ -14,8 +27,11 @@ Link.propTypes = {
   children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element), PropTypes.element, PropTypes.string, PropTypes.node]),
   target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
   className: PropTypes.string,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
   rel: PropTypes.string,
-  onClick: PropTypes.func,
-  download: PropTypes.bool
+  download: PropTypes.bool,
+  onClick: PropTypes.func
 };
 export default Link;

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

@@ -37,6 +37,14 @@ export interface INotificationProps {
     target?: '_self' | '_blank' | '_parent' | '_top';
     /** Иконка */
     icon?: JSX.Element;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        title?: Record<string, string>;
+        text?: Record<string, string>;
+        link?: Record<string, string>;
+        close?: Record<string, string>;
+    };
     /** Обработчик на закрытие */
     onClose?: () => void;
     /** Обработчик клика по ссылке */