@megafon/ui-shared 6.0.0-beta.5 → 6.1.0

package/dist/es/components/Card/Card.js

@@ -1,9 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
-import "core-js/modules/es.array.map.js";
 import "core-js/modules/es.string.link.js";
-import * as React from 'react';
+import "core-js/modules/es.array.map.js";
+import React from 'react';
 import { Button, Header } from '@megafon/ui-core';
 import { cnCreate, convert, filterDataAttrs } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./Card.css";
 var textsConvertConfig = {
   b: {
@@ -32,40 +33,43 @@ var textsConvertConfig = {
   }
 };
 var cn = cnCreate('mfui-card');
+
 var Card = function Card(_ref5) {
   var dataAttrs = _ref5.dataAttrs,
-    className = _ref5.className,
-    classes = _ref5.classes,
-    rootRef = _ref5.rootRef,
-    _ref5$isFullHeight = _ref5.isFullHeight,
-    isFullHeight = _ref5$isFullHeight === void 0 ? false : _ref5$isFullHeight,
-    link = _ref5.link,
-    _ref5$view = _ref5.view,
-    view = _ref5$view === void 0 ? 'shadow' : _ref5$view,
-    image = _ref5.image,
-    icon = _ref5.icon,
-    title = _ref5.title,
-    markerList = _ref5.markerList,
-    textsList = _ref5.textsList,
-    featuresList = _ref5.featuresList,
-    iconsList = _ref5.iconsList,
-    price = _ref5.price,
-    button = _ref5.button,
-    extraButton = _ref5.extraButton,
-    badge = _ref5.badge,
-    onClick = _ref5.onClick;
+      className = _ref5.className,
+      classes = _ref5.classes,
+      rootRef = _ref5.rootRef,
+      _ref5$isFullHeight = _ref5.isFullHeight,
+      isFullHeight = _ref5$isFullHeight === void 0 ? false : _ref5$isFullHeight,
+      link = _ref5.link,
+      _ref5$view = _ref5.view,
+      view = _ref5$view === void 0 ? 'shadow' : _ref5$view,
+      image = _ref5.image,
+      icon = _ref5.icon,
+      title = _ref5.title,
+      markerList = _ref5.markerList,
+      textsList = _ref5.textsList,
+      featuresList = _ref5.featuresList,
+      iconsList = _ref5.iconsList,
+      price = _ref5.price,
+      button = _ref5.button,
+      extraButton = _ref5.extraButton,
+      badge = _ref5.badge,
+      onClick = _ref5.onClick;
   var isOnlyTitle = !image && !icon && !markerList && !textsList && !featuresList && !iconsList && !price && !button && !extraButton;
   var isLink = (link === null || link === void 0 ? void 0 : link.href) && !button && !extraButton;
   var isBottomImage = (image === null || image === void 0 ? void 0 : image.position) === 'bottom';
   var ElementType = isLink ? 'a' : 'div';
+
   var renderImage = function renderImage() {
     if (!image) {
       return null;
     }
+
     var _image$position = image.position,
-      position = _image$position === void 0 ? 'top' : _image$position,
-      src = image.src,
-      alt = image.alt;
+        position = _image$position === void 0 ? 'top' : _image$position,
+        src = image.src,
+        alt = image.alt;
     return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.imgBox), {
       className: cn('img-box', {
         position: position
@@ -76,14 +80,17 @@ var Card = function Card(_ref5) {
       alt: alt
     }));
   };
+
   var renderIcon = function renderIcon() {
     if (!icon) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.icon), {
       className: cn('icon')
     }), icon);
   };
+
   var renderContent = function renderContent() {
     if (markerList) {
       return /*#__PURE__*/React.createElement("ul", {
@@ -97,6 +104,7 @@ var Card = function Card(_ref5) {
         }, convert(item.note, {})));
       }));
     }
+
     if (textsList) {
       return /*#__PURE__*/React.createElement("div", {
         className: cn('texts')
@@ -111,6 +119,7 @@ var Card = function Card(_ref5) {
         }, convert(item.desc, textsConvertConfig)));
       }));
     }
+
     if (featuresList) {
       return /*#__PURE__*/React.createElement("div", {
         className: cn('features')
@@ -131,6 +140,7 @@ var Card = function Card(_ref5) {
         }, item.value)));
       })), featuresList.desc);
     }
+
     if (iconsList) {
       return /*#__PURE__*/React.createElement("div", {
         className: cn('icons')
@@ -149,12 +159,15 @@ var Card = function Card(_ref5) {
         }, item.text));
       })));
     }
+
     return null;
   };
+
   var renderPrice = function renderPrice() {
     if (!price) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement("div", {
       className: cn('price')
     }, !!price.oldValue && /*#__PURE__*/React.createElement("div", {
@@ -165,10 +178,12 @@ var Card = function Card(_ref5) {
       className: cn('price-period')
     }, price.period));
   };
+
   var renderButtons = function renderButtons() {
     if (!button && !extraButton) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement("div", {
       className: cn('buttons', {
         centered: (button === null || button === void 0 ? void 0 : button.isCentered) || (extraButton === null || extraButton === void 0 ? void 0 : extraButton.isCentered)
@@ -192,14 +207,17 @@ var Card = function Card(_ref5) {
       onClick: extraButton === null || extraButton === void 0 ? void 0 : extraButton.onClick
     }, extraButton.title));
   };
+
   var renderFooter = function renderFooter() {
     if (!price && !button && !extraButton && !image) {
       return null;
     }
+
     return /*#__PURE__*/React.createElement("div", {
       className: cn('footer')
     }, isBottomImage && renderImage(), renderPrice(), renderButtons());
   };
+
   return /*#__PURE__*/React.createElement(ElementType, _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
     className: cn({
       'only-title': isOnlyTitle,
@@ -219,4 +237,76 @@ var Card = function Card(_ref5) {
     align: title.align
   }, title.text), badge), renderContent(), renderFooter());
 };
+
+Card.propTypes = {
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    icon: PropTypes.objectOf(PropTypes.string.isRequired),
+    imgBox: PropTypes.objectOf(PropTypes.string.isRequired),
+    button: PropTypes.objectOf(PropTypes.string.isRequired),
+    extraButton: PropTypes.objectOf(PropTypes.string.isRequired)
+  }),
+  className: PropTypes.string,
+  classes: PropTypes.shape({
+    root: PropTypes.string,
+    button: PropTypes.string,
+    extraButton: PropTypes.string
+  }),
+  rootRef: PropTypes.oneOfType([PropTypes.func, PropTypes.oneOfType([PropTypes.shape({
+    current: PropTypes.elementType
+  }), PropTypes.any])]),
+  view: PropTypes.oneOf(['shadow', 'background']),
+  link: PropTypes.shape({
+    href: PropTypes.string,
+    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])
+  }),
+  image: PropTypes.shape({
+    src: PropTypes.string.isRequired,
+    alt: PropTypes.string,
+    position: PropTypes.oneOf(['top', 'bottom'])
+  }),
+  icon: PropTypes.node,
+  title: PropTypes.shape({
+    text: PropTypes.string.isRequired,
+    align: PropTypes.oneOf(['left', 'center'])
+  }).isRequired,
+  textsList: PropTypes.arrayOf(PropTypes.shape({
+    title: PropTypes.string,
+    desc: PropTypes.string.isRequired
+  }).isRequired),
+  featuresList: PropTypes.shape({
+    desc: PropTypes.string,
+    items: PropTypes.arrayOf(PropTypes.shape({
+      title: PropTypes.string.isRequired,
+      value: PropTypes.string.isRequired
+    }).isRequired).isRequired
+  }),
+  iconsList: PropTypes.shape({
+    desc: PropTypes.string,
+    items: PropTypes.arrayOf(PropTypes.shape({
+      icon: PropTypes.node.isRequired,
+      text: PropTypes.string.isRequired
+    }).isRequired).isRequired
+  }),
+  price: PropTypes.shape({
+    oldValue: PropTypes.string,
+    value: PropTypes.string.isRequired,
+    period: PropTypes.string
+  }),
+  button: PropTypes.shape({
+    title: PropTypes.string.isRequired,
+    href: PropTypes.string,
+    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
+    isCentered: PropTypes.bool,
+    onClick: PropTypes.func
+  }),
+  extraButton: PropTypes.shape({
+    title: PropTypes.string.isRequired,
+    href: PropTypes.string,
+    target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
+    isCentered: PropTypes.bool,
+    onClick: PropTypes.func
+  }),
+  onClick: PropTypes.func
+};
 export default Card;

package/dist/es/components/Card/types.d.ts

@@ -1,12 +1,12 @@
 /// <reference types="react" />
-type Target = '_self' | '_blank' | '_parent' | '_top';
-export type Link = {
+declare type Target = '_self' | '_blank' | '_parent' | '_top';
+export declare type Link = {
     /** Ссылка */
     href?: string;
     /** Target свойство ссылки */
     target?: Target;
 };
-export type Image = {
+export declare type Image = {
     /** Ссылка на изображение */
     src: string;
     /** Значение тега alt для изображения */
@@ -14,25 +14,25 @@ export type Image = {
     /** Позиция изображения */
     position?: 'top' | 'bottom';
 };
-export type Title = {
+export declare type Title = {
     /** Текст */
     text: string;
     /** Выравнивание */
     align?: 'left' | 'center';
 };
-export type MarkerList = {
+export declare type MarkerList = {
     /** Заголовок */
     title: string;
     /** Примечание */
     note?: string;
 }[];
-export type TextsList = {
+export declare type TextsList = {
     /** Заголовок */
     title?: string;
     /** Описание */
     desc: string;
 }[];
-export type FeaturesList = {
+export declare type FeaturesList = {
     /** Список */
     items: {
         /** Заголовок */
@@ -43,7 +43,7 @@ export type FeaturesList = {
     /** Описание */
     desc?: string;
 };
-export type IconsList = {
+export declare type IconsList = {
     /** Список */
     items: {
         /** Иконка */
@@ -54,7 +54,7 @@ export type IconsList = {
     /** Описание */
     desc?: string;
 };
-export type Price = {
+export declare type Price = {
     /** Старая цена */
     oldValue?: string;
     /** Текущая цена */
@@ -62,7 +62,7 @@ export type Price = {
     /** Период */
     period?: string;
 };
-export type ButtonType = {
+export declare type ButtonType = {
     /** Название */
     title: string;
     /** Ссылка */

package/dist/es/components/Card/types.js

@@ -1 +0,0 @@
-export {};

package/dist/es/components/CardsBox/CardsBox.js

@@ -3,13 +3,15 @@ import "core-js/modules/es.array.map.js";
 import * as React from 'react';
 import { Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
 import getColumnConfig from "./helpers";
 var cn = cnCreate('mfui-cards-box');
+
 var CardsBox = function CardsBox(_ref) {
   var _ref$renderTwoColumns = _ref.renderTwoColumnsInRow,
-    renderTwoColumnsInRow = _ref$renderTwoColumns === void 0 ? false : _ref$renderTwoColumns,
-    dataAttrs = _ref.dataAttrs,
-    children = _ref.children;
+      renderTwoColumnsInRow = _ref$renderTwoColumns === void 0 ? false : _ref$renderTwoColumns,
+      dataAttrs = _ref.dataAttrs,
+      children = _ref.children;
   return /*#__PURE__*/React.createElement("div", _extends({
     className: cn()
   }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement(Grid, {
@@ -23,4 +25,13 @@ var CardsBox = function CardsBox(_ref) {
     }, getColumnConfig(React.Children.count(children), i, renderTwoColumnsInRow)), child);
   })));
 };
+
+CardsBox.propTypes = {
+  renderTwoColumnsInRow: PropTypes.bool,
+  children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element.isRequired), PropTypes.element]).isRequired,
+  dataAttrs: PropTypes.shape({
+    root: PropTypes.objectOf(PropTypes.string.isRequired),
+    column: PropTypes.objectOf(PropTypes.string.isRequired)
+  })
+};
 export default CardsBox;

package/dist/es/components/CardsBox/helpers.d.ts

@@ -1,5 +1,5 @@
-type TGridSizeValues = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';
-type GridConfig = {
+declare type TGridSizeValues = '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12';
+declare type GridConfig = {
     all?: TGridSizeValues;
     tablet?: TGridSizeValues;
     mobile?: TGridSizeValues;

package/dist/es/components/CardsBox/helpers.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
+
 var getColumnConfig = function getColumnConfig(count, index, renderTwoColumnsInRow) {
   var offset = renderTwoColumnsInRow ? '2' : undefined;
   var offsetForEvenColumn = index % 2 ? undefined : offset;
@@ -7,6 +8,7 @@ var getColumnConfig = function getColumnConfig(count, index, renderTwoColumnsInR
     tablet: '6',
     mobile: '12'
   };
+
   switch (count) {
     case 2:
     case 4:
@@ -14,8 +16,10 @@ var getColumnConfig = function getColumnConfig(count, index, renderTwoColumnsInR
         leftOffsetWide: offsetForEvenColumn,
         leftOffsetDesktop: offsetForEvenColumn
       });
+
     default:
       return _extends({}, columnSize);
   }
 };
+
 export default getColumnConfig;

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Carousel } from '@megafon/ui-core';
-type CarouselPropsTypes = React.ComponentProps<typeof Carousel>;
-type DesktopSlidesPerView = 3 | 4;
+declare type CarouselPropsTypes = React.ComponentProps<typeof Carousel>;
+declare type DesktopSlidesPerView = 3 | 4;
 interface ICarouselBox extends CarouselPropsTypes {
     /** Количество видимых слайдов на разрешении 1280 и выше */
     desktopSlidesPerView?: DesktopSlidesPerView;

package/dist/es/components/CarouselBox/CarouselBox.js

@@ -1,40 +1,52 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import "core-js/modules/es.symbol.js";
 import "core-js/modules/es.array.index-of.js";
+import "core-js/modules/es.symbol.js";
+
 var __rest = this && this.__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];
+
+  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;
 };
+
 import * as React from 'react';
 import { Carousel } from '@megafon/ui-core';
 import { cnCreate, breakpoints } from '@megafon/ui-helpers';
+
 var getDefaultSlideSettings = function getDefaultSlideSettings(desktopSlidesPerView) {
-  return _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, breakpoints.MOBILE_SMALL_START, {
+  var _ref;
+
+  return _ref = {}, _defineProperty(_ref, breakpoints.MOBILE_SMALL_START, {
     slidesPerView: 1,
     spaceBetween: 16
-  }), breakpoints.MOBILE_BIG_START, {
+  }), _defineProperty(_ref, breakpoints.MOBILE_BIG_START, {
     slidesPerView: 2,
     spaceBetween: 20
-  }), breakpoints.DESKTOP_SMALL_START, {
+  }), _defineProperty(_ref, breakpoints.DESKTOP_SMALL_START, {
     slidesPerView: 3,
     spaceBetween: 20
-  }), breakpoints.DESKTOP_MIDDLE_START, {
+  }), _defineProperty(_ref, breakpoints.DESKTOP_MIDDLE_START, {
     slidesPerView: desktopSlidesPerView,
     spaceBetween: 20
-  });
+  }), _ref;
 };
+
 var cn = cnCreate('mfui-carousel-box');
+
 var CarouselBox = function CarouselBox(_a) {
   var children = _a.children,
-    slidesSettings = _a.slidesSettings,
-    _a$desktopSlidesPerVi = _a.desktopSlidesPerView,
-    desktopSlidesPerView = _a$desktopSlidesPerVi === void 0 ? 4 : _a$desktopSlidesPerVi,
-    props = __rest(_a, ["children", "slidesSettings", "desktopSlidesPerView"]);
+      slidesSettings = _a.slidesSettings,
+      _a$desktopSlidesPerVi = _a.desktopSlidesPerView,
+      desktopSlidesPerView = _a$desktopSlidesPerVi === void 0 ? 4 : _a$desktopSlidesPerVi,
+      props = __rest(_a, ["children", "slidesSettings", "desktopSlidesPerView"]);
+
   var settings = slidesSettings || getDefaultSlideSettings(desktopSlidesPerView);
   return /*#__PURE__*/React.createElement("div", {
     className: cn()
@@ -42,4 +54,5 @@ var CarouselBox = function CarouselBox(_a) {
     slidesSettings: settings
   }), children));
 };
+
 export default CarouselBox;