@megafon/ui-shared 8.14.0 → 8.14.2

package/dist/lib/components/Table/Table.js

@@ -0,0 +1,136 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+require("core-js/modules/es.array.map.js");
+var React = _interopRequireWildcard(require("react"));
+var _uiHelpers = require("@megafon/ui-helpers");
+var _htmr = _interopRequireDefault(require("htmr"));
+var _lodash = _interopRequireDefault(require("lodash.throttle"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var cn = (0, _uiHelpers.cnCreate)('mfui-table');
+var Table = function Table(_ref) {
+  var className = _ref.className,
+    _ref$fixColumn = _ref.fixColumn,
+    fixColumn = _ref$fixColumn === void 0 ? true : _ref$fixColumn,
+    _ref$boldFontInFirstC = _ref.boldFontInFirstColumn,
+    boldFontInFirstColumn = _ref$boldFontInFirstC === void 0 ? false : _ref$boldFontInFirstC,
+    _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);
+  var _React$useState = React.useState({
+      top: false,
+      left: false
+    }),
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    shadow = _React$useState2[0],
+    setShadow = _React$useState2[1];
+  var _React$useState3 = React.useState({
+      right: false,
+      bottom: false
+    }),
+    _React$useState4 = (0, _slicedToArray2["default"])(_React$useState3, 2),
+    gradient = _React$useState4[0],
+    setGradient = _React$useState4[1];
+  var _React$useState5 = React.useState(false),
+    _React$useState6 = (0, _slicedToArray2["default"])(_React$useState5, 2),
+    hasHorizontalScroll = _React$useState6[0],
+    setHasHorizontalScroll = _React$useState6[1];
+  var _React$useState7 = React.useState(false),
+    _React$useState8 = (0, _slicedToArray2["default"])(_React$useState7, 2),
+    isTouchDevice = _React$useState8[0],
+    setTouchDevice = _React$useState8[1];
+  var handleTableScroll = React.useCallback(function () {
+    var scrollNode = scrollRef.current;
+    if (!scrollNode) {
+      return;
+    }
+    var scrollHeight = scrollNode.scrollHeight,
+      clientHeight = scrollNode.clientHeight,
+      scrollTop = scrollNode.scrollTop,
+      scrollWidth = scrollNode.scrollWidth,
+      clientWidth = scrollNode.clientWidth,
+      scrollLeft = scrollNode.scrollLeft;
+    var deltaHeight = scrollHeight - clientHeight;
+    var deltaWidth = scrollWidth - clientWidth;
+    setGradient({
+      right: deltaWidth !== Math.floor(scrollLeft),
+      bottom: deltaHeight !== Math.floor(scrollTop)
+    });
+    setShadow({
+      top: !!scrollTop,
+      left: !!scrollLeft
+    });
+    setHasHorizontalScroll(!!deltaWidth);
+  }, []);
+  React.useEffect(function () {
+    var handleResize = (0, _lodash["default"])(handleTableScroll, 300);
+    handleTableScroll();
+    window.addEventListener('resize', handleResize);
+    return function () {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, [handleTableScroll]);
+  React.useEffect(function () {
+    setTouchDevice((0, _uiHelpers.detectTouch)());
+  }, []);
+  var renderRows = function renderRows() {
+    return React.Children.map(children, function (_ref2, index) {
+      var _ref2$props = _ref2.props,
+        cells = _ref2$props.children,
+        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,
+          content: !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' ? (0, _htmr["default"])(cell) : cell);
+      }));
+    });
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn({
+      'fix-column': fixColumn,
+      'min-cell-size': minCellSize,
+      'bold-font': boldFontInFirstColumn,
+      'horizontal-scroll': hasHorizontalScroll,
+      touch: isTouchDevice
+    }, [className])
+  }, /*#__PURE__*/React.createElement("div", {
+    className: cn('scroll', {
+      limit: !disableHeightLimit
+    }),
+    ref: scrollRef,
+    onScroll: handleTableScroll
+  }, shadow.top && /*#__PURE__*/React.createElement("div", {
+    className: cn('top-shadow')
+  }), shadow.left && /*#__PURE__*/React.createElement("div", {
+    className: cn('left-shadow')
+  }), /*#__PURE__*/React.createElement("table", {
+    className: cn('table')
+  }, /*#__PURE__*/React.createElement("tbody", null, renderRows())), gradient.right && /*#__PURE__*/React.createElement("div", {
+    className: cn('right-gradient')
+  }), gradient.bottom && /*#__PURE__*/React.createElement("div", {
+    className: cn('bottom-gradient')
+  })));
+};
+var _default = exports["default"] = Table;

package/dist/lib/components/Table/TableCell.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface ITableCell {
+    children?: React.ReactNode;
+}
+declare const TableCell: React.FC<ITableCell>;
+export default TableCell;

package/dist/lib/components/Table/TableCell.js

@@ -0,0 +1,15 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var React = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var TableCell = function TableCell(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children && children);
+};
+var _default = exports["default"] = TableCell;

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

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

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

@@ -0,0 +1,17 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var React = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+/* eslint-disable react/no-unused-prop-types */
+
+var TableRow = function TableRow(_ref) {
+  var children = _ref.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+};
+var _default = exports["default"] = TableRow;

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

@@ -0,0 +1,2 @@
+import { Tab } from '@megafon/ui-core';
+export default Tab;

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

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _uiCore = require("@megafon/ui-core");
+var _default = exports["default"] = _uiCore.Tab;

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

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

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

@@ -0,0 +1,33 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.array.index-of.js");
+var React = _interopRequireWildcard(require("react"));
+var _uiCore = require("@megafon/ui-core");
+var _uiHelpers = require("@megafon/ui-helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var cn = (0, _uiHelpers.cnCreate)('mfui-tabs-box');
+var TabsBox = function TabsBox(_a) {
+  var rootRef = _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, children));
+};
+var _default = exports["default"] = TabsBox;

package/dist/lib/components/TextBox/TextBox.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-text-box__content :first-child{margin-top:0!important}.mfui-text-box__content :last-child{margin-bottom:0!important}.mfui-text-box_text-center{text-align:center}.mfui-text-box .mfui-text-with-icon{margin:24px 0}.mfui-text-box .mfui-text-with-icon+.mfui-header{margin-top:32px}.mfui-text-box .mfui-text-box-picture+.mfui-text-with-icon{margin:32px 0 24px}

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

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import './TextBox.scss';
+export interface ITextBoxProps {
+    /** Центрирование текста по горизонтали */
+    textCenter?: boolean;
+    /** Центрирование компонента по горизонтали при ограниченной ширине */
+    centeringWithLimitedWidth?: boolean;
+    /** Растягивание компонента на всю доступную ширину */
+    isFullWidth?: boolean;
+    /** Ссылка на корневой элемент */
+    rootRef?: React.Ref<HTMLDivElement>;
+    /** Дополнительный класс для корневого элемента */
+    className?: string;
+    children?: React.ReactNode;
+}
+declare const TextBox: React.FC<ITextBoxProps>;
+export default TextBox;

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

@@ -0,0 +1,51 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _uiCore = require("@megafon/ui-core");
+var _uiHelpers = require("@megafon/ui-helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var cn = (0, _uiHelpers.cnCreate)('mfui-text-box');
+var TextBox = function TextBox(_ref) {
+  var _ref$textCenter = _ref.textCenter,
+    textCenter = _ref$textCenter === void 0 ? false : _ref$textCenter,
+    _ref$centeringWithLim = _ref.centeringWithLimitedWidth,
+    centeringWithLimitedWidth = _ref$centeringWithLim === void 0 ? false : _ref$centeringWithLim,
+    _ref$isFullWidth = _ref.isFullWidth,
+    isFullWidth = _ref$isFullWidth === void 0 ? true : _ref$isFullWidth,
+    rootRef = _ref.rootRef,
+    className = _ref.className,
+    children = _ref.children;
+  var renderContent = function renderContent() {
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn('content')
+    }, children);
+  };
+  var renderTextBoxWithGrid = function renderTextBoxWithGrid() {
+    return /*#__PURE__*/React.createElement(_uiCore.Grid, {
+      hAlign: centeringWithLimitedWidth ? 'center' : 'left',
+      dataAttrs: {
+        container: {
+          'data-testid': 'TextBox-grid'
+        }
+      }
+    }, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
+      wide: "8",
+      desktop: "10",
+      tablet: "12",
+      mobile: "12"
+    }, renderContent()));
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn({
+      'text-center': textCenter
+    }, [className]),
+    ref: rootRef
+  }, isFullWidth ? renderContent() : renderTextBoxWithGrid());
+};
+var _default = exports["default"] = TextBox;

package/dist/lib/components/TextBox/TextBoxPicture.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-text-box-picture_margin_default{margin:16px 0}.mfui-text-box-picture_margin_big-top{margin:24px 0 16px}.mfui-text-box-picture_margin_big-bottom{margin:16px 0 24px}.mfui-text-box-picture_margin_big-vertical{margin:24px 0}.mfui-text-box-picture__img{border:1px solid var(--spbSky1);display:block;max-width:100%}.mfui-text-box-picture__img_no-border{border:none}

package/dist/lib/components/TextBox/TextBoxPicture.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import './TextBoxPicture.scss';
+export declare const pictureMarginTypes: {
+    readonly DEFAULT: "default";
+    readonly BIG_TOP: "big-top";
+    readonly BIG_BOTTOM: "big-bottom";
+    readonly BIG_VERTICAL: "big-vertical";
+};
+type PictureMarginTypesType = (typeof pictureMarginTypes)[keyof typeof pictureMarginTypes];
+export interface ITextBoxPictureProps {
+    /** URL картинки */
+    url: string;
+    /** Значение вертикальных отступов */
+    margin?: PictureMarginTypesType;
+    /** Значение тега alt для изображения */
+    alt?: string;
+    /** Отключить отображение рамки вокруг картинки */
+    disableBorder?: boolean;
+}
+declare const TextBoxPicture: React.FC<ITextBoxPictureProps>;
+export default TextBoxPicture;

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

@@ -0,0 +1,38 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.pictureMarginTypes = exports["default"] = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _uiHelpers = require("@megafon/ui-helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var pictureMarginTypes = exports.pictureMarginTypes = {
+  DEFAULT: 'default',
+  BIG_TOP: 'big-top',
+  BIG_BOTTOM: 'big-bottom',
+  BIG_VERTICAL: 'big-vertical'
+};
+var cn = (0, _uiHelpers.cnCreate)('mfui-text-box-picture');
+var TextBoxPicture = function TextBoxPicture(_ref) {
+  var url = _ref.url,
+    _ref$margin = _ref.margin,
+    margin = _ref$margin === void 0 ? pictureMarginTypes.DEFAULT : _ref$margin,
+    alt = _ref.alt,
+    _ref$disableBorder = _ref.disableBorder,
+    disableBorder = _ref$disableBorder === void 0 ? false : _ref$disableBorder;
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn({
+      margin: margin
+    })
+  }, /*#__PURE__*/React.createElement("img", {
+    className: cn('img', {
+      'no-border': disableBorder
+    }),
+    src: url,
+    alt: alt
+  }));
+};
+var _default = exports["default"] = TextBoxPicture;

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

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-text-with-icon__header{margin-bottom:24px}

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

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { ITextWithIconItem } from './TextWithIconItem';
+import './TextWithIcon.scss';
+export interface ITextWithIconProps {
+    /** Заголовок */
+    title?: string;
+    /** Ссылка на корневой элемент */
+    rootRef?: React.Ref<HTMLDivElement>;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+    /** Дополнительный класс для корневого элемента */
+    className?: string;
+    /** Включить растягивание на всю ширину контейнера */
+    isFullWidth?: boolean;
+    /** Допустимый дочерний компонент */
+    children: React.ReactElement<ITextWithIconItem>[] | React.ReactElement<ITextWithIconItem>;
+}
+declare const TextWithIcon: React.FC<ITextWithIconProps>;
+export default TextWithIcon;

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

@@ -0,0 +1,50 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _uiCore = require("@megafon/ui-core");
+var _uiHelpers = require("@megafon/ui-helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var testIdPrefix = 'TextWithIcon';
+var cn = (0, _uiHelpers.cnCreate)('mfui-text-with-icon');
+var TextWithIcon = function TextWithIcon(_ref) {
+  var title = _ref.title,
+    rootRef = _ref.rootRef,
+    dataAttrs = _ref.dataAttrs,
+    className = _ref.className,
+    _ref$isFullWidth = _ref.isFullWidth,
+    isFullWidth = _ref$isFullWidth === void 0 ? false : _ref$isFullWidth,
+    children = _ref.children;
+  var renderContent = function renderContent() {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, title && /*#__PURE__*/React.createElement(_uiCore.Header, {
+      className: cn('header'),
+      as: "h5"
+    }, title), children);
+  };
+  var renderContentWithGrid = function renderContentWithGrid() {
+    return /*#__PURE__*/React.createElement(_uiCore.Grid, {
+      dataAttrs: {
+        container: {
+          'data-testid': "".concat(testIdPrefix, "-grid")
+        }
+      }
+    }, /*#__PURE__*/React.createElement(_uiCore.GridColumn, {
+      mobile: '12',
+      tablet: '7',
+      desktop: '6',
+      wide: '6'
+    }, renderContent()));
+  };
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: cn([className]),
+    ref: rootRef
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), isFullWidth ? renderContent() : renderContentWithGrid());
+};
+var _default = exports["default"] = TextWithIcon;

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

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-text-with-icon-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.mfui-text-with-icon-item:not(:first-of-type){margin-top:12px}.mfui-text-with-icon-item__svg-icon{-webkit-box-sizing:border-box;box-sizing:border-box;height:40px;margin-right:12px;min-height:40px;min-width:40px;overflow:hidden;width:40px}.mfui-text-with-icon-item_icon-background_stroke .mfui-text-with-icon-item__svg-icon{border:1px solid var(--spbSky2);border-radius:50%;padding:3px}.mfui-text-with-icon-item_icon-background_gray .mfui-text-with-icon-item__svg-icon{background-color:var(--spbSky0);border-radius:50%;padding:4px}

package/dist/lib/components/TextWithIcon/TextWithIconItem.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import './TextWithIconItem.scss';
+export interface ITextWithIconItem {
+    /** Дополнительные классы для внутренних элементов */
+    classes?: {
+        icon?: string;
+        text?: string;
+    };
+    /** Текст */
+    text: string | string[];
+    /** Иконка */
+    icon: React.ReactNode;
+    /** Фон для иконки */
+    iconBackground?: 'no' | 'stroke' | 'gray';
+    /** Ссылка на корневой элемент */
+    rootRef?: React.Ref<HTMLDivElement>;
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+    /** Дополнительный класс для корневого элемента */
+    className?: string;
+}
+declare const TextWithIconItem: React.FC<ITextWithIconItem>;
+export default TextWithIconItem;

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

@@ -0,0 +1,49 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+require("core-js/modules/es.array.is-array.js");
+require("core-js/modules/es.array.map.js");
+var React = _interopRequireWildcard(require("react"));
+var _uiHelpers = require("@megafon/ui-helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var testIdPrefix = 'TextWithIconItem';
+var cn = (0, _uiHelpers.cnCreate)('mfui-text-with-icon-item');
+var TextWithIconItem = function TextWithIconItem(_ref) {
+  var className = _ref.className,
+    _ref$classes = _ref.classes,
+    classes = _ref$classes === void 0 ? {} : _ref$classes,
+    text = _ref.text,
+    icon = _ref.icon,
+    _ref$iconBackground = _ref.iconBackground,
+    iconBackground = _ref$iconBackground === void 0 ? 'no' : _ref$iconBackground,
+    rootRef = _ref.rootRef,
+    dataAttrs = _ref.dataAttrs;
+  var renderText = React.useMemo(function () {
+    if (Array.isArray(text)) {
+      return text.map(function (item) {
+        return (0, _uiHelpers.convert)(item, _uiHelpers.textConvertConfig);
+      });
+    }
+    return (0, _uiHelpers.convert)(text, _uiHelpers.textConvertConfig);
+  }, [text]);
+  return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({
+    className: cn({
+      'icon-background': iconBackground
+    }, [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]),
+    "data-testid": "".concat(testIdPrefix, "-icon")
+  }, icon), /*#__PURE__*/React.createElement("div", {
+    className: cn('text', [classes.text]),
+    "data-testid": "".concat(testIdPrefix, "-text")
+  }, renderText));
+};
+var _default = exports["default"] = TextWithIconItem;

package/dist/lib/components/TitleDescriptionBox/TitleDescriptionBox.css

@@ -0,0 +1 @@
+h1,h2,h3,h4,h5{margin:0}.mfui-title-description-box{color:var(--content),.mfui-title-description-box __item_header;font-family:inherit;color-white-space:pre-wrap}.mfui-title-description-box__item:not(:last-child){margin-bottom:16px}.mfui-title-description-box_text-color_white{color:var(--stcWhite)}.mfui-title-description-box_h-align_center{text-align:center}.mfui-title-description-box__description{font-size:15px;font-weight:400;line-height:24px}.mfui-title-description-box__description :last-child{margin-bottom:0!important}

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

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import './TitleDescriptionBox.scss';
+export interface ITitleDescriptionBoxProps {
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+    };
+    /** Ссылка на корневой элемент */
+    rootRef?: React.Ref<HTMLDivElement>;
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Заголовок */
+    title?: string | React.ReactNode[] | React.ReactNode;
+    /** Описание */
+    description?: string | React.ReactNode[] | React.ReactNode;
+    /** Цвет текста */
+    textColor?: 'white';
+    /** Горизонтальное выравнивание */
+    align?: 'center';
+}
+declare const TitleDescriptionBox: React.FC<ITitleDescriptionBoxProps>;
+export default TitleDescriptionBox;