@megafon/ui-shared 6.10.0 → 6.11.0

package/dist/es/index.d.ts

@@ -13,6 +13,7 @@ export { default as Breadcrumbs } from './components/Breadcrumbs/Breadcrumbs';
 export { default as BreadcrumbsItem } from './components/Breadcrumbs/components/BreadcrumbsItem';
 export { default as ButtonBanner } from './components/ButtonBanner/ButtonBanner';
 export { default as ButtonLinkBox } from './components/ButtonLinkBox/ButtonLinkBox';
+export { default as ButtonsBox } from './components/ButtonsBox/ButtonsBox';
 export { default as Card } from './components/Card/Card';
 export { default as CardsBox } from './components/CardsBox/CardsBox';
 export { default as CarouselBox } from './components/CarouselBox/CarouselBox';
@@ -30,6 +31,8 @@ export { default as NotificationBox } from './components/NotificationBox/Notific
 export { default as PageTitle } from './components/PageTitle/PageTitle';
 export { default as Partners } from './components/Partners/Partners';
 export { default as PictureWithDescription } from './components/PictureWithDescription/PictureWithDescription';
+export { default as PromoCard } from './components/PromoCards/components/PromoCard/PromoCard';
+export { default as PromoCards } from './components/PromoCards/PromoCards';
 export { default as Property } from './components/Property/Property';
 export { default as PropertyDescription } from './components/Property/PropertyDescription';
 export { default as SidePictureCard } from './components/SidePictureCards/components/SidePictureCard';

package/dist/es/index.js

@@ -13,6 +13,7 @@ export { default as Breadcrumbs } from "./components/Breadcrumbs/Breadcrumbs";
 export { default as BreadcrumbsItem } from "./components/Breadcrumbs/components/BreadcrumbsItem";
 export { default as ButtonBanner } from "./components/ButtonBanner/ButtonBanner";
 export { default as ButtonLinkBox } from "./components/ButtonLinkBox/ButtonLinkBox";
+export { default as ButtonsBox } from "./components/ButtonsBox/ButtonsBox";
 export { default as Card } from "./components/Card/Card";
 export { default as CardsBox } from "./components/CardsBox/CardsBox";
 export { default as CarouselBox } from "./components/CarouselBox/CarouselBox";
@@ -30,6 +31,8 @@ export { default as NotificationBox } from "./components/NotificationBox/Notific
 export { default as PageTitle } from "./components/PageTitle/PageTitle";
 export { default as Partners } from "./components/Partners/Partners";
 export { default as PictureWithDescription } from "./components/PictureWithDescription/PictureWithDescription";
+export { default as PromoCard } from "./components/PromoCards/components/PromoCard/PromoCard";
+export { default as PromoCards } from "./components/PromoCards/PromoCards";
 export { default as Property } from "./components/Property/Property";
 export { default as PropertyDescription } from "./components/Property/PropertyDescription";
 export { default as SidePictureCard } from "./components/SidePictureCards/components/SidePictureCard";

package/dist/lib/components/ButtonsBox/ButtonsBox.css

@@ -0,0 +1,34 @@
+h1,
+h2,
+h3,
+h4,
+h5 {
+  margin: 0;
+}
+.mfui-v6-buttons-box {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+}
+.mfui-v6-buttons-box__buttons_equal-width {
+  display: grid;
+  gap: 20px;
+  max-width: -webkit-max-content;
+  max-width: -moz-max-content;
+  max-width: max-content;
+}
+@media screen and (max-width: 767px) {
+  .mfui-v6-buttons-box__buttons_equal-width {
+    grid-template-rows: repeat(2, 1fr);
+  }
+}
+@media screen and (min-width: 768px) {
+  .mfui-v6-buttons-box__buttons_equal-width {
+    grid-template-columns: repeat(2, 1fr);
+  }
+}
+.mfui-v6-buttons-box_h-align_center {
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+}

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

@@ -0,0 +1,48 @@
+import React from 'react';
+import './ButtonsBox.less';
+export declare type ButtonType = {
+    /** Тип */
+    type?: 'primary' | 'outline';
+    /** Иконка */
+    icon?: JSX.Element;
+    /** Название */
+    title?: string;
+    /** Ссылка */
+    href?: string;
+    /** Target свойство кнопки */
+    target?: '_self' | '_blank' | '_parent' | '_top';
+    /** Rel - атрибут тега <a> */
+    rel?: string;
+    /** Задает атрибут download для тега <a> */
+    download?: boolean;
+    /** Показать стелку */
+    showArrow?: boolean;
+    /** Обработчик клика */
+    onClick?: (e: React.SyntheticEvent<EventTarget>) => void;
+};
+export interface IButtonsBox {
+    /** Дополнительные data атрибуты к внутренним элементам */
+    dataAttrs?: {
+        root?: Record<string, string>;
+        button?: Record<string, string>;
+        extraButton?: Record<string, string>;
+    };
+    /** Дополнительный класс корневого элемента */
+    className?: string;
+    /** Дополнительные классы для внутренних элементов */
+    classes?: {
+        root?: string;
+        button?: string;
+        extraButton?: string;
+    };
+    /** Кнопка */
+    button: ButtonType;
+    /** Дополнительная кнопка */
+    extraButton?: ButtonType;
+    /** Горизонтальное выравнивание */
+    align?: 'center' | 'left';
+    /** Ссылка на корневой элемент */
+    rootRef?: React.Ref<HTMLDivElement>;
+}
+declare const ButtonsBox: React.FC<IButtonsBox>;
+export default ButtonsBox;

package/dist/lib/components/ButtonsBox/ButtonsBox.js

@@ -0,0 +1,110 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _uiCore = require("@megafon/ui-core");
+
+var _uiHelpers = require("@megafon/ui-helpers");
+
+var PropTypes = _interopRequireWildcard(require("prop-types"));
+
+var _setRelAttribute = require("../../helpers/setRelAttribute");
+
+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); }
+
+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; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var cn = (0, _uiHelpers.cnCreate)('mfui-v6-buttons-box');
+
+var ButtonsBox = function ButtonsBox(_ref) {
+  var className = _ref.className,
+      _ref$classes = _ref.classes,
+      classes = _ref$classes === void 0 ? {} : _ref$classes,
+      dataAttrs = _ref.dataAttrs,
+      button = _ref.button,
+      extraButton = _ref.extraButton,
+      align = _ref.align,
+      rootRef = _ref.rootRef;
+  var showTwoButtons = !!button && !!extraButton;
+
+  var renderButton = function renderButton(btnProps, btnClassName, dataAttr) {
+    return /*#__PURE__*/_react["default"].createElement(_uiCore.Button, {
+      dataAttrs: {
+        root: dataAttr
+      },
+      className: btnClassName,
+      fullWidth: showTwoButtons,
+      type: btnProps.type,
+      theme: "green",
+      icon: btnProps.icon,
+      href: btnProps.href,
+      target: btnProps.target,
+      download: btnProps.download,
+      showArrow: btnProps.showArrow,
+      rel: (0, _setRelAttribute.setRelAttribute)(btnProps.rel, btnProps.target),
+      onClick: btnProps.onClick
+    }, btnProps.title);
+  };
+
+  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      'h-align': align
+    }, [className, classes.root]),
+    ref: rootRef
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: cn('buttons', {
+      'equal-width': showTwoButtons
+    })
+  }, !!button && renderButton(button, classes.button, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button), !!extraButton && renderButton(extraButton, classes.extraButton, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.extraButton)));
+};
+
+ButtonsBox.propTypes = {
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    link: PropTypes.objectOf(PropTypes.string.isRequired),
+    button: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
+  className: PropTypes.string,
+  classes: PropTypes.shape({
+    root: PropTypes.string,
+    button: PropTypes.string,
+    link: PropTypes.string
+  }),
+  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
+    current: PropTypes.elementType
+  }), PropTypes.any])]),
+  align: PropTypes.oneOf(['center', 'left']),
+  button: PropTypes.shape({
+    type: PropTypes.oneOf(['primary', 'outline']),
+    icon: PropTypes.element,
+    title: PropTypes.string,
+    href: PropTypes.string,
+    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
+    rel: PropTypes.string,
+    download: PropTypes.bool,
+    onClick: PropTypes.func
+  }).isRequired,
+  extraButton: PropTypes.shape({
+    type: PropTypes.oneOf(['primary', 'outline']),
+    icon: PropTypes.element,
+    title: PropTypes.string,
+    href: PropTypes.string,
+    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
+    rel: PropTypes.string,
+    download: PropTypes.bool,
+    onClick: PropTypes.func
+  })
+};
+var _default = ButtonsBox;
+exports["default"] = _default;