@megafon/ui-shared 6.10.0 → 6.11.1

package/dist/es/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/es/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/es/components/ButtonsBox/ButtonsBox.js

@@ -0,0 +1,89 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React from 'react';
+import { Button } from '@megafon/ui-core';
+import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
+import { setRelAttribute } from "../../helpers/setRelAttribute";
+import "./ButtonsBox.css";
+var cn = 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.createElement(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: setRelAttribute(btnProps.rel, btnProps.target),
+      onClick: btnProps.onClick
+    }, btnProps.title);
+  };
+
+  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      'h-align': align
+    }, [className, classes.root]),
+    ref: rootRef
+  }), /*#__PURE__*/React.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
+  })
+};
+export default ButtonsBox;