@megafon/ui-core 6.0.0-beta.4 → 6.0.1

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

@@ -1,11 +1,11 @@
-import * as React from 'react';
-import './Button.scss';
+import React, { Ref } from 'react';
+import './Button.less';
 export declare const ButtonTypes: {
     readonly PRIMARY: "primary";
     readonly OUTLINE: "outline";
     readonly TEXT: "text";
 };
-type ButtonTypesType = (typeof ButtonTypes)[keyof typeof ButtonTypes];
+declare type ButtonTypesType = typeof ButtonTypes[keyof typeof ButtonTypes];
 export declare const ButtonThemes: {
     readonly GREEN: "green";
     readonly GREEN_SOFT: "green-soft";
@@ -15,14 +15,14 @@ export declare const ButtonThemes: {
     readonly BLACK: "black";
     readonly DANGER: "danger";
 };
-type ButtonThemesType = (typeof ButtonThemes)[keyof typeof ButtonThemes];
+declare type ButtonThemesType = typeof ButtonThemes[keyof typeof ButtonThemes];
 export declare const ButtonSizes: {
     readonly EXTRA_SMALL: "extra-small";
     readonly SMALL: "small";
     readonly MEDIUM: "medium";
     readonly LARGE: "large";
 };
-type ButtonSizesType = (typeof ButtonSizes)[keyof typeof ButtonSizes];
+declare type ButtonSizesType = typeof ButtonSizes[keyof typeof ButtonSizes];
 export interface IButtonProps {
     /** Дополнительный класс корневого элемента */
     className?: string | string[];
@@ -81,10 +81,9 @@ export interface IButtonProps {
     /** Отключение кнопки */
     disabled?: boolean;
     /** Ссылка на элемент */
-    buttonRef?: React.Ref<HTMLButtonElement | HTMLAnchorElement>;
+    buttonRef?: Ref<HTMLButtonElement | HTMLAnchorElement>;
     /** Обрезать текст при недостаточной ширине и добавлять многоточие */
     ellipsis?: boolean;
-    children?: React.ReactNode;
     /** Обработчик клика по кнопке */
     onClick?: (e: React.SyntheticEvent<EventTarget>) => void;
 }

package/dist/lib/components/Button/Button.js

@@ -1,34 +1,53 @@
 "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); }
+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"] = exports.ButtonTypes = exports.ButtonThemes = exports.ButtonSizes = void 0;
+exports["default"] = exports.ButtonSizes = exports.ButtonThemes = exports.ButtonTypes = void 0;
+
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-require("core-js/modules/es.array.concat.js");
+
 require("core-js/modules/es.array.is-array.js");
-var React = _interopRequireWildcard(require("react"));
+
+require("core-js/modules/es.array.concat.js");
+
+require("core-js/modules/es.object.values.js");
+
+var _react = _interopRequireDefault(require("react"));
+
 var _uiHelpers = require("@megafon/ui-helpers");
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
 var _Preloader = _interopRequireWildcard(require("../Preloader/Preloader"));
-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 && Object.prototype.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 _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 Arrow = function Arrow(props) {
-  return /*#__PURE__*/React.createElement("svg", (0, _extends2["default"])({
+  return /*#__PURE__*/_react["default"].createElement("svg", (0, _extends2["default"])({
     viewBox: "0 0 40 40"
-  }, props), /*#__PURE__*/React.createElement("path", {
+  }, props), /*#__PURE__*/_react["default"].createElement("path", {
     d: "M16 26l6-6-6-6 2-2 8 8-8 8z"
   }));
 };
-var ButtonTypes = exports.ButtonTypes = {
+
+var ButtonTypes = {
   PRIMARY: 'primary',
   OUTLINE: 'outline',
   TEXT: 'text'
 };
-var ButtonThemes = exports.ButtonThemes = {
+exports.ButtonTypes = ButtonTypes;
+var ButtonThemes = {
   GREEN: 'green',
   GREEN_SOFT: 'green-soft',
   PURPLE: 'purple',
@@ -37,122 +56,143 @@ var ButtonThemes = exports.ButtonThemes = {
   BLACK: 'black',
   DANGER: 'danger'
 };
-var ButtonSizes = exports.ButtonSizes = {
+exports.ButtonThemes = ButtonThemes;
+var ButtonSizes = {
   EXTRA_SMALL: 'extra-small',
   SMALL: 'small',
   MEDIUM: 'medium',
   LARGE: 'large'
 };
+exports.ButtonSizes = ButtonSizes;
 var Content;
+
 (function (Content) {
   Content["TEXT"] = "text";
   Content["ICON"] = "icon";
   Content["ICON_TEXT"] = "icon-text";
 })(Content || (Content = {}));
+
 var getLoaderSize = function getLoaderSize(size) {
   return size === ButtonSizes.SMALL || size === ButtonSizes.EXTRA_SMALL ? ButtonSizes.SMALL : ButtonSizes.MEDIUM;
 };
+
 var cn = (0, _uiHelpers.cnCreate)('mfui-button');
+
 var Button = function Button(_ref) {
-  var _ref$classes = _ref.classes,
-    _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
-    rootClassName = _ref$classes2.root,
-    contentClassName = _ref$classes2.content,
-    innerClassName = _ref$classes2.inner,
-    _ref$className = _ref.className,
-    className = _ref$className === void 0 ? '' : _ref$className,
-    _ref$theme = _ref.theme,
-    theme = _ref$theme === void 0 ? 'green' : _ref$theme,
-    _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'primary' : _ref$type,
-    href = _ref.href,
-    download = _ref.download,
-    target = _ref.target,
-    rel = _ref.rel,
-    _ref$actionType = _ref.actionType,
-    actionType = _ref$actionType === void 0 ? 'button' : _ref$actionType,
-    _ref$sizeAll = _ref.sizeAll,
-    sizeAll = _ref$sizeAll === void 0 ? 'medium' : _ref$sizeAll,
-    sizeWide = _ref.sizeWide,
-    sizeDesktop = _ref.sizeDesktop,
-    sizeTablet = _ref.sizeTablet,
-    sizeMobile = _ref.sizeMobile,
-    _ref$fullWidth = _ref.fullWidth,
-    fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
-    _ref$fullWidthMobile = _ref.fullWidthMobile,
-    fullWidthMobile = _ref$fullWidthMobile === void 0 ? false : _ref$fullWidthMobile,
-    _ref$showLoader = _ref.showLoader,
-    showLoader = _ref$showLoader === void 0 ? false : _ref$showLoader,
-    _ref$showArrow = _ref.showArrow,
-    showArrow = _ref$showArrow === void 0 ? false : _ref$showArrow,
-    icon = _ref.icon,
-    disabled = _ref.disabled,
-    children = _ref.children,
-    _ref$ellipsis = _ref.ellipsis,
-    ellipsis = _ref$ellipsis === void 0 ? false : _ref$ellipsis,
-    onClick = _ref.onClick,
-    dataAttrs = _ref.dataAttrs,
-    buttonRef = _ref.buttonRef;
-  var _React$useState = React.useState(false),
-    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-    isTouch = _React$useState2[0],
-    setTouch = _React$useState2[1];
+  var _ref$classes = _ref.classes;
+  _ref$classes = _ref$classes === void 0 ? {} : _ref$classes;
+  var rootClassName = _ref$classes.root,
+      contentClassName = _ref$classes.content,
+      innerClassName = _ref$classes.inner,
+      _ref$className = _ref.className,
+      className = _ref$className === void 0 ? '' : _ref$className,
+      _ref$theme = _ref.theme,
+      theme = _ref$theme === void 0 ? 'green' : _ref$theme,
+      _ref$type = _ref.type,
+      type = _ref$type === void 0 ? 'primary' : _ref$type,
+      href = _ref.href,
+      download = _ref.download,
+      target = _ref.target,
+      rel = _ref.rel,
+      _ref$actionType = _ref.actionType,
+      actionType = _ref$actionType === void 0 ? 'button' : _ref$actionType,
+      _ref$sizeAll = _ref.sizeAll,
+      sizeAll = _ref$sizeAll === void 0 ? 'medium' : _ref$sizeAll,
+      sizeWide = _ref.sizeWide,
+      sizeDesktop = _ref.sizeDesktop,
+      sizeTablet = _ref.sizeTablet,
+      sizeMobile = _ref.sizeMobile,
+      _ref$fullWidth = _ref.fullWidth,
+      fullWidth = _ref$fullWidth === void 0 ? false : _ref$fullWidth,
+      _ref$fullWidthMobile = _ref.fullWidthMobile,
+      fullWidthMobile = _ref$fullWidthMobile === void 0 ? false : _ref$fullWidthMobile,
+      _ref$showLoader = _ref.showLoader,
+      showLoader = _ref$showLoader === void 0 ? false : _ref$showLoader,
+      _ref$showArrow = _ref.showArrow,
+      showArrow = _ref$showArrow === void 0 ? false : _ref$showArrow,
+      icon = _ref.icon,
+      disabled = _ref.disabled,
+      children = _ref.children,
+      _ref$ellipsis = _ref.ellipsis,
+      ellipsis = _ref$ellipsis === void 0 ? false : _ref$ellipsis,
+      onClick = _ref.onClick,
+      dataAttrs = _ref.dataAttrs,
+      buttonRef = _ref.buttonRef;
+
+  var _React$useState = _react["default"].useState(false),
+      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+      isTouch = _React$useState2[0],
+      setTouch = _React$useState2[1];
+
   var ElementType = href ? 'a' : 'button';
   var displayArrow = showArrow && !icon;
-  var handleClick = React.useCallback(function (e) {
+
+  var handleClick = _react["default"].useCallback(function (e) {
     if (disabled) {
       e.preventDefault();
       return;
     }
+
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
   }, [disabled, onClick]);
-  var currentTheme = React.useMemo(function () {
+
+  var currentTheme = _react["default"].useMemo(function () {
     return type === ButtonTypes.PRIMARY && theme === ButtonThemes.BLACK ? ButtonThemes.GREEN : theme;
   }, [type, theme]);
-  var loaderWhite = React.useMemo(function () {
+
+  var loaderWhite = _react["default"].useMemo(function () {
     return type === ButtonTypes.PRIMARY && theme === ButtonThemes.GREEN || type === ButtonTypes.PRIMARY && theme === ButtonThemes.PURPLE || type === ButtonTypes.OUTLINE && theme === ButtonThemes.WHITE || type === ButtonTypes.TEXT && theme === ButtonThemes.WHITE;
   }, [type, theme]);
-  var loaderColor = React.useMemo(function () {
+
+  var loaderColor = _react["default"].useMemo(function () {
     switch (true) {
       case loaderWhite:
         return _Preloader.PreloaderColors.WHITE;
+
       case type === ButtonTypes.OUTLINE && theme === ButtonThemes.BLACK:
         return _Preloader.PreloaderColors.BLACK;
+
       default:
         return _Preloader.PreloaderColors.DEFAULT;
     }
   }, [type, theme, loaderWhite]);
-  var renderedContent = React.useMemo(function () {
+
+  var renderedContent = _react["default"].useMemo(function () {
     if (!children && !icon) {
       return null;
     }
-    return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content), {
+
+    return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content), {
       className: cn('content', {
         ellipsis: ellipsis,
         'show-loader': showLoader
       }, contentClassName)
-    }), icon && /*#__PURE__*/React.createElement("div", {
+    }), icon && /*#__PURE__*/_react["default"].createElement("div", {
       className: cn('icon')
-    }, icon), children && /*#__PURE__*/React.createElement("span", (0, _extends2["default"])({
+    }, icon), children && /*#__PURE__*/_react["default"].createElement("span", (0, _extends2["default"])({
       className: cn('text', {
         ellipsis: ellipsis
       })
-    }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text)), children), displayArrow && /*#__PURE__*/React.createElement(Arrow, (0, _extends2["default"])({
+    }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text)), children), displayArrow && /*#__PURE__*/_react["default"].createElement(Arrow, (0, _extends2["default"])({
       className: cn('icon-arrow')
     }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow))));
   }, [children, icon, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.content, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.text, dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.arrow, ellipsis, showLoader, contentClassName, displayArrow]);
-  var contentType = React.useMemo(function () {
+
+  var contentType = _react["default"].useMemo(function () {
     switch (true) {
       case icon && !children:
         return Content.ICON;
+
       case icon && !!children:
         return Content.ICON_TEXT;
+
       default:
         return Content.TEXT;
     }
   }, [icon, children]);
-  var renderedLoader = React.useMemo(function () {
-    return /*#__PURE__*/React.createElement(_Preloader["default"], {
+
+  var renderedLoader = _react["default"].useMemo(function () {
+    return /*#__PURE__*/_react["default"].createElement(_Preloader["default"], {
       delay: false,
       className: cn('preloader'),
       dataAttrs: {
@@ -166,23 +206,30 @@ var Button = function Button(_ref) {
       sizeMobile: sizeMobile && getLoaderSize(sizeMobile)
     });
   }, [dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.loader, loaderColor, sizeAll, sizeWide, sizeDesktop, sizeTablet, sizeMobile]);
+
   var setRelAttribute = function setRelAttribute() {
     if (ElementType !== 'a') {
       return undefined;
     }
+
     if (rel) {
       return rel;
     }
+
     if (target && target !== '_self') {
       return 'noreferrer noopener';
     }
+
     return undefined;
   };
+
   var classNameValue = Array.isArray(className) ? [].concat((0, _toConsumableArray2["default"])(className), [rootClassName]) : [className, rootClassName];
-  React.useEffect(function () {
+
+  _react["default"].useEffect(function () {
     setTouch((0, _uiHelpers.detectTouch)());
   }, []);
-  return /*#__PURE__*/React.createElement(ElementType, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+
+  return /*#__PURE__*/_react["default"].createElement(ElementType, (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       type: type,
       theme: currentTheme,
@@ -207,8 +254,48 @@ var Button = function Button(_ref) {
     onClick: handleClick,
     disabled: !href && disabled,
     ref: buttonRef
-  }), /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner), {
+  }), /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.inner), {
     className: cn('inner', innerClassName)
   }), renderedContent, showLoader && renderedLoader));
 };
-var _default = exports["default"] = Button;
+
+Button.propTypes = {
+  classes: _propTypes["default"].shape({
+    root: _propTypes["default"].string,
+    content: _propTypes["default"].string,
+    inner: _propTypes["default"].string
+  }),
+  dataAttrs: _propTypes["default"].shape({
+    root: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
+    content: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
+    inner: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
+    loader: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
+    text: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired),
+    arrow: _propTypes["default"].objectOf(_propTypes["default"].string.isRequired)
+  }),
+  theme: _propTypes["default"].oneOf(Object.values(ButtonThemes)),
+  type: _propTypes["default"].oneOf(Object.values(ButtonTypes)),
+  href: _propTypes["default"].string,
+  download: _propTypes["default"].bool,
+  target: _propTypes["default"].oneOf(['_self', '_blank', '_parent', '_top']),
+  rel: _propTypes["default"].string,
+  actionType: _propTypes["default"].oneOf(['button', 'reset', 'submit']),
+  sizeAll: _propTypes["default"].oneOf(Object.values(ButtonSizes)),
+  sizeWide: _propTypes["default"].oneOf(Object.values(ButtonSizes)),
+  sizeDesktop: _propTypes["default"].oneOf(Object.values(ButtonSizes)),
+  sizeTablet: _propTypes["default"].oneOf(Object.values(ButtonSizes)),
+  sizeMobile: _propTypes["default"].oneOf(Object.values(ButtonSizes)),
+  fullWidth: _propTypes["default"].bool,
+  fullWidthMobile: _propTypes["default"].bool,
+  showLoader: _propTypes["default"].bool,
+  showArrow: _propTypes["default"].bool,
+  icon: _propTypes["default"].element,
+  disabled: _propTypes["default"].bool,
+  buttonRef: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].oneOfType([_propTypes["default"].shape({
+    current: _propTypes["default"].elementType
+  }), _propTypes["default"].any])]),
+  ellipsis: _propTypes["default"].bool,
+  onClick: _propTypes["default"].func
+};
+var _default = Button;
+exports["default"] = _default;

package/dist/lib/components/Calendar/Calendar.css

@@ -1 +1,5 @@
-h1,h2,h3,h4,h5{margin:0}.mfui-calendar{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}
+.mfui-calendar {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+}

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

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import './Calendar.scss';
+import React from 'react';
+import './Calendar.less';
 export interface ICalendarProps {
     /** Дополнительные data атрибуты к внутренним элементам */
     dataAttrs?: {