@megafon/ui-shared 2.0.0-beta.238 → 2.0.0-beta.241

package/CHANGELOG.md

@@ -3,6 +3,47 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.0.0-beta.241](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.0-beta.240...@megafon/ui-shared@2.0.0-beta.241) (2021-11-29)
+
+
+### Bug Fixes
+
+* **ui-shared:** enable more eslint rules and fix problems ([063b874](https://github.com/MegafonWebLab/megafon-ui/commit/063b8747e2dfd3f883f07a04e177cbceef4cca2e))
+* **ui-shared:** enable more eslint rules and fix problems ([4bde8f9](https://github.com/MegafonWebLab/megafon-ui/commit/4bde8f93be7a13efe912f22d659371a3e380e6f3))
+* **ui-shared:** enable some eslint rules and fix problems ([73ea828](https://github.com/MegafonWebLab/megafon-ui/commit/73ea828ea060d5cfecb18fdd5d1498efa1e93fbd))
+* **ui-shared:** fix children type ([0f04517](https://github.com/MegafonWebLab/megafon-ui/commit/0f04517deaa60ff05fd05eeb478d66e0a116b999))
+* **ui-shared:** fixes after rebase ([c326ee8](https://github.com/MegafonWebLab/megafon-ui/commit/c326ee8c3ca2f47c6b3202d78c91e08b0e42914e))
+* **ui-shared:** remove alt content; rename interface ([316e04a](https://github.com/MegafonWebLab/megafon-ui/commit/316e04a1a594ce61c7d198113f1fb6612cc7d913))
+
+
+
+
+
+# [2.0.0-beta.240](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.0-beta.239...@megafon/ui-shared@2.0.0-beta.240) (2021-11-23)
+
+
+### Bug Fixes
+
+* **instructions:** fix activeInstructionItem class ([4f4c611](https://github.com/MegafonWebLab/megafon-ui/commit/4f4c611d5fdb227f00c164cc2bcfae6f6eb91c5e))
+
+
+### Features
+
+* **container:** add new indents to child components ([02a4d5b](https://github.com/MegafonWebLab/megafon-ui/commit/02a4d5b819d7c0c653ab819df04c1f069a94c3b1))
+* **storebanner:** fixed style and changed buttons image ([87b77a8](https://github.com/MegafonWebLab/megafon-ui/commit/87b77a8e5da178f8273287bd1be85ac7ccd8f0bd))
+
+
+
+
+
+# [2.0.0-beta.239](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.0-beta.238...@megafon/ui-shared@2.0.0-beta.239) (2021-11-15)
+
+**Note:** Version bump only for package @megafon/ui-shared
+
+
+
+
+
 # [2.0.0-beta.238](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.0-beta.237...@megafon/ui-shared@2.0.0-beta.238) (2021-11-15)
 
 

package/dist/es/components/AccordionBox/AccordionBox.js

@@ -15,9 +15,9 @@ var __rest = this && this.__rest || function (s, e) {
 };
 
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
 import { Grid, GridColumn, Accordion } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
 import "./AccordionBox.css";
 var cn = cnCreate('mfui-beta-accordion-box');
 

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import './style/BenefitsIcons.less';
 import { IconPosition, IBenefit } from './types';
+import './style/BenefitsIcons.less';
 export interface IBenefitsIcons {
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;

package/dist/es/components/BenefitsIcons/BenefitsIcons.js

@@ -3,14 +3,14 @@ import "core-js/modules/es.object.values";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
-import PropTypes from 'prop-types';
-import "./style/BenefitsIcons.css";
 import { Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate, breakpoints } from '@megafon/ui-helpers';
+import throttle from 'lodash.throttle';
+import PropTypes from 'prop-types';
+import throttleTime from "../../constants/throttleTime";
 import BenefitsIconsTile from "./BenefitsIconsTile";
 import { IconPositionEnum, ItemsAlignEnum } from "./types";
-import throttle from 'lodash.throttle';
-import throttleTime from "../../constants/throttleTime"; // left-aligned column with left side icon,
+import "./style/BenefitsIcons.css"; // left-aligned column with left side icon,
 
 var getLeftSideConfig = function getLeftSideConfig(count, index) {
   var everySecondWithoutOffset = index % 2 ? '1' : undefined;

package/dist/es/components/BenefitsIcons/BenefitsIconsTile.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import './style/BenefitsIconsTile.less';
 import { IBenefit, IconPosition } from './types';
+import './style/BenefitsIconsTile.less';
 export interface IBenefitsIconsTile extends IBenefit {
     iconPosition?: IconPosition;
     className?: string;

package/dist/es/components/BenefitsIcons/BenefitsIconsTile.js

@@ -1,10 +1,10 @@
 import "core-js/modules/es.object.values";
 import * as React from 'react';
-import PropTypes from 'prop-types';
-import "./style/BenefitsIconsTile.css";
 import { Header } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import { IconPositionEnum } from "./types";
+import "./style/BenefitsIconsTile.css";
 var cn = cnCreate('mfui-beta-benefits-icons-tile');
 
 var BenefitsIconsTile = function BenefitsIconsTile(_ref) {

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import './BenfitsPictures.less';
 import { IBenefit, GridGutterSize } from './types';
+import './BenfitsPictures.less';
 export interface IBenefitsPicturesProps {
     /** Ссылка на корневой элемент */
     rootRef?: React.Ref<HTMLDivElement>;

package/dist/es/components/BenefitsPictures/BenefitsPictures.js

@@ -3,13 +3,13 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
 import { useCallback } from 'react';
-import PropTypes from 'prop-types';
-import throttle from 'lodash.throttle';
-import "./BenfitsPictures.css";
 import { Grid, GridColumn, Header, Paragraph } from '@megafon/ui-core';
 import { breakpoints, cnCreate } from '@megafon/ui-helpers';
 import convert from 'htmr';
+import throttle from 'lodash.throttle';
+import PropTypes from 'prop-types';
 import throttleTime from "../../constants/throttleTime";
+import "./BenfitsPictures.css";
 var ONLY_LEFT_ALIGN_ITEMS_COUNT = 3;
 var columnSize = {
   wide: '4',
@@ -139,7 +139,7 @@ var BenefitsPictures = function BenefitsPictures(_ref) {
     } else {
       setCurrentGutter('large');
     }
-  }, []);
+  }, [isLargeGutter]);
   React.useEffect(function () {
     var throttledResizeHandler = throttle(resizeHandler, throttleTime.resize);
     resizeHandler();
@@ -147,7 +147,7 @@ var BenefitsPictures = function BenefitsPictures(_ref) {
     return function () {
       return window.removeEventListener('resize', throttledResizeHandler);
     };
-  }, []);
+  }, [resizeHandler]);
   return /*#__PURE__*/React.createElement("div", {
     className: cn([className, classes.root]),
     ref: rootRef

package/dist/es/components/Breadcrumbs/Breadcrumbs.js

@@ -1,9 +1,9 @@
 import "core-js/modules/es.array.map";
 import "core-js/modules/es.object.values";
 import React from 'react';
-import PropTypes from 'prop-types';
 import { TextLink } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./Breadcrumbs.css";
 export var TextColor = {
   BLACK: 'black',

package/dist/es/components/ButtonBanner/ButtonBanner.js

@@ -1,10 +1,10 @@
 import "core-js/modules/es.object.values";
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
-import * as PropTypes from 'prop-types';
-import "./ButtonBanner.css";
 import { Button, Grid, GridColumn, Header } from '@megafon/ui-core';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
+import "./ButtonBanner.css";
 export var ButtonColor = {
   GREEN: 'green',
   PURPLE: 'purple'

package/dist/es/components/ButtonLinkBox/ButtonLinkBox.js

@@ -1,9 +1,9 @@
 import "core-js/modules/es.string.link";
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
-import * as PropTypes from 'prop-types';
 import { Button, TextLink } from '@megafon/ui-core';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
 import "./ButtonLinkBox.css";
 var cn = cnCreate('mfui-beta-button-link-box');
 

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

@@ -51,7 +51,8 @@ var Card = function Card(_ref) {
             })
           }, /*#__PURE__*/React.createElement("img", {
             className: cn('img'),
-            src: imageSrc
+            src: imageSrc,
+            alt: ""
           }));
         }
 

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

@@ -6,10 +6,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _SlidesSettings;
 
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import throttle from 'lodash.throttle';
 import { Grid, GridColumn, Carousel } from '@megafon/ui-core';
 import { breakpoints, cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import throttle from 'lodash.throttle';
+import * as PropTypes from 'prop-types';
 import throttleTime from "../../constants/throttleTime";
 var MAX_CARDS_COUNT_IN_GRID_ON_MOBILE = 2;
 var SlidesSettings = (_SlidesSettings = {}, _defineProperty(_SlidesSettings, breakpoints.MOBILE_SMALL_START, {
@@ -50,7 +50,7 @@ var CardsBox = function CardsBox(_ref) {
       slidesSettings: SlidesSettings,
       onChange: onChange
     }, children);
-  }, [children]);
+  }, [children, onChange]);
   React.useEffect(function () {
     var resizeHandler = function resizeHandler() {
       return window.innerWidth <= breakpoints.MOBILE_BIG_END ? setIsMobile(true) : setIsMobile(false);

package/dist/es/components/Container/Container.css

@@ -2104,19 +2104,41 @@ h5 {
     margin-top: 40px;
   }
 }
+.mfui-beta-container .mfui-beta-button-link-box + .mfui-beta-download-links {
+  margin-top: 56px;
+}
 .mfui-beta-container .mfui-beta-button-link-box + .mfui-beta-text-box {
   margin-top: 56px;
 }
 @media screen and (min-width: 768px) and (max-width: 1023px) {
+  .mfui-beta-container .mfui-beta-button-link-box + .mfui-beta-download-links {
+    margin-top: 48px;
+  }
   .mfui-beta-container .mfui-beta-button-link-box + .mfui-beta-text-box {
     margin-top: 48px;
   }
 }
 @media screen and (max-width: 767px) {
+  .mfui-beta-container .mfui-beta-button-link-box + .mfui-beta-download-links {
+    margin-top: 40px;
+  }
   .mfui-beta-container .mfui-beta-button-link-box + .mfui-beta-text-box {
     margin-top: 40px;
   }
 }
+.mfui-beta-container .mfui-beta-download-links + .mfui-beta-text-box {
+  margin-top: 56px;
+}
+@media screen and (min-width: 768px) and (max-width: 1023px) {
+  .mfui-beta-container .mfui-beta-download-links + .mfui-beta-text-box {
+    margin-top: 48px;
+  }
+}
+@media screen and (max-width: 767px) {
+  .mfui-beta-container .mfui-beta-download-links + .mfui-beta-text-box {
+    margin-top: 40px;
+  }
+}
 .mfui-beta-container .mfui-beta-text-box + .mfui-beta-benefits-icons {
   margin-top: 56px;
 }

package/dist/es/components/Container/Container.js

@@ -1,9 +1,9 @@
 import "core-js/modules/es.object.values";
 import React from 'react';
-import PropTypes from 'prop-types';
-import "./Container.css";
 import { ContentArea } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
+import "./Container.css";
 export var BackgroundColors = {
   DEFAULT: 'default',
   LIGHT_GRAY: 'light-gray',

package/dist/es/components/DownloadLinks/DownloadLink.js

@@ -2,9 +2,9 @@ import "core-js/modules/es.array.concat";
 import "core-js/modules/es.string.link";
 import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
 import { TextLink } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
 import "./DownloadLink.css";
 
 var DownloadIcon = function DownloadIcon(props) {

package/dist/es/components/DownloadLinks/DownloadLinks.js

@@ -1,9 +1,9 @@
 import "core-js/modules/es.array.map";
 import _extends from "@babel/runtime/helpers/extends";
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
 import { Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
 import "./DownloadLinks.css";
 
 var getColumnConfig = function getColumnConfig(itemsCount) {

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

@@ -1,6 +1,6 @@
 import React, { Ref } from 'react';
-import './Instructions.less';
 import SwiperCore from 'swiper';
+import './Instructions.less';
 export declare const pictureAlignTypes: {
     readonly LEFT: "left";
     readonly RIGHT: "right";

package/dist/es/components/Instructions/Instructions.js

@@ -1,13 +1,12 @@
-import "core-js/modules/es.array.concat";
 import "core-js/modules/es.array.map";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React from 'react';
-import PropTypes from 'prop-types';
-import "./Instructions.css";
-import convert from 'htmr';
-import { Swiper, SwiperSlide } from 'swiper/react';
 import { Grid, GridColumn, Header, Paragraph } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import convert from 'htmr';
+import PropTypes from 'prop-types';
+import { Swiper, SwiperSlide } from 'swiper/react';
+import "./Instructions.css";
 export var pictureAlignTypes = {
   LEFT: 'left',
   RIGHT: 'right'
@@ -58,45 +57,20 @@ var Instructions = function Instructions(_ref) {
   var getSwiperInstance = React.useCallback(function (swiper) {
     setSwiperInstance(swiper);
     getSwiper && getSwiper(swiper);
-  }, []);
-  var getArticleCustomClasses = React.useCallback(function (articleIndex, activeIndex) {
-    if (!instructionItem || !activeInstructionItem) {
-      return;
+  }, [getSwiper]);
+  var getActiveCustomClass = React.useCallback(function (articleIndex, activeIndex) {
+    if (articleIndex !== activeIndex) {
+      return undefined;
     }
 
-    return articleIndex === activeIndex ? "".concat(instructionItem, " ").concat(activeInstructionItem) : instructionItem;
-  }, [instructionItem, activeInstructionItem]);
+    return activeInstructionItem;
+  }, [activeInstructionItem]);
   var handleArticleClick = React.useCallback(function (ind) {
     return function () {
       setSlideIndex(ind);
       swiperInstance && swiperInstance.slideTo(ind);
     };
   }, [swiperInstance]);
-  var renderTitle = React.useCallback(function (resolution) {
-    return /*#__PURE__*/React.createElement(Header, {
-      className: cn('title', {
-        resolution: resolution
-      }),
-      as: "h2"
-    }, title);
-  }, []);
-  var renderText = React.useCallback(function () {
-    return /*#__PURE__*/React.createElement(Paragraph, {
-      className: cn('text', [additionalText]),
-      hasMargin: false
-    }, convert(text));
-  }, [text, additionalText]);
-  var renderPicture = React.useCallback(function () {
-    if (pictureMask === pictureMaskTypes.NONE) {
-      return renderSlider();
-    }
-
-    return /*#__PURE__*/React.createElement("div", {
-      className: cn('img-wrapper')
-    }, /*#__PURE__*/React.createElement("div", {
-      className: cn('device-screen')
-    }), renderSlider());
-  }, [pictureMask]);
   var renderVideo = React.useCallback(function (mediaUrl) {
     return /*#__PURE__*/React.createElement("video", {
       className: cn('swiper-img'),
@@ -126,7 +100,32 @@ var Instructions = function Instructions(_ref) {
         alt: ""
       }));
     }));
-  }, [instructionItems]);
+  }, [getSwiperInstance, instructionItemImg, instructionItems, renderVideo]);
+  var renderTitle = React.useCallback(function (resolution) {
+    return /*#__PURE__*/React.createElement(Header, {
+      className: cn('title', {
+        resolution: resolution
+      }),
+      as: "h2"
+    }, title);
+  }, [title]);
+  var renderText = React.useCallback(function () {
+    return /*#__PURE__*/React.createElement(Paragraph, {
+      className: cn('text', [additionalText]),
+      hasMargin: false
+    }, convert(text));
+  }, [text, additionalText]);
+  var renderPicture = React.useCallback(function () {
+    if (pictureMask === pictureMaskTypes.NONE) {
+      return renderSlider();
+    }
+
+    return /*#__PURE__*/React.createElement("div", {
+      className: cn('img-wrapper')
+    }, /*#__PURE__*/React.createElement("div", {
+      className: cn('device-screen')
+    }), renderSlider());
+  }, [pictureMask, renderSlider]);
   var renderDesktopArticles = React.useCallback(function () {
     return /*#__PURE__*/React.createElement("ul", {
       className: cn('articles-list', {
@@ -135,22 +134,26 @@ var Instructions = function Instructions(_ref) {
       })
     }, instructionItems.map(function (_ref3, ind) {
       var itemTitle = _ref3.title;
-      return /*#__PURE__*/React.createElement("li", {
-        className: cn('articles-item', {
-          active: slideIndex === ind
-        }, [getArticleCustomClasses(ind, slideIndex), desktopInstructionItem]),
-        "data-index": ind,
-        onClick: handleArticleClick(ind),
-        key: ind
-      }, /*#__PURE__*/React.createElement("div", {
-        className: cn('articles-item-dot')
-      }, /*#__PURE__*/React.createElement("span", {
-        className: cn('articles-item-dot-number')
-      }, ind + 1)), /*#__PURE__*/React.createElement("div", {
-        className: cn('articles-item-title', [desktopItemTitle])
-      }, itemTitle));
+      return (
+        /*#__PURE__*/
+        // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+        React.createElement("li", {
+          className: cn('articles-item', {
+            active: slideIndex === ind
+          }, [getActiveCustomClass(ind, slideIndex), instructionItem, desktopInstructionItem]),
+          "data-index": ind,
+          onClick: handleArticleClick(ind),
+          key: ind
+        }, /*#__PURE__*/React.createElement("div", {
+          className: cn('articles-item-dot')
+        }, /*#__PURE__*/React.createElement("span", {
+          className: cn('articles-item-dot-number')
+        }, ind + 1)), /*#__PURE__*/React.createElement("div", {
+          className: cn('articles-item-title', [desktopItemTitle])
+        }, itemTitle))
+      );
     }));
-  }, [instructionItems, slideIndex, handleArticleClick, text]);
+  }, [desktopInstructionItem, desktopItemTitle, getActiveCustomClass, handleArticleClick, instructionItem, instructionItems, slideIndex, text]);
   var renderMobileArticles = React.useCallback(function () {
     return /*#__PURE__*/React.createElement("div", {
       className: cn('articles-list', {
@@ -174,13 +177,13 @@ var Instructions = function Instructions(_ref) {
         key: ind,
         className: cn('articles-dot', {
           active: slideIndex === ind
-        }, [getArticleCustomClasses(ind, slideIndex), mobileInstructionItem]),
+        }, [getActiveCustomClass(ind, slideIndex), instructionItem, mobileInstructionItem]),
         onClick: handleArticleClick(ind)
       }, /*#__PURE__*/React.createElement("span", {
         className: cn('articles-dot-number')
       }, ind + 1));
     })));
-  }, [instructionItems, slideIndex, handleArticleClick, text]);
+  }, [getActiveCustomClass, handleArticleClick, instructionItem, instructionItems, mobileInstructionItem, mobileItemTitle, slideIndex, text]);
   return /*#__PURE__*/React.createElement("div", {
     className: cn({
       mask: pictureMask

package/dist/es/components/PageTitle/PageTitle.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import { Header, Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./PageTitle.css";
 import Breadcrumbs from "../Breadcrumbs/Breadcrumbs";
 var cn = cnCreate('mfui-beta-page-title');
@@ -28,7 +28,7 @@ var PageTitle = function PageTitle(_ref) {
       }),
       as: "h1"
     }, title));
-  }, [breadcrumbs, classes, badge, title]);
+  }, [badge, title, isBreadcrumbs]);
   var renderPageTitleWithGrid = React.useCallback(function () {
     return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, {
       wide: "8",

package/dist/es/components/Partners/Partners.js

@@ -6,9 +6,9 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _slidesSettings;
 
 import * as React from 'react';
-import * as PropTypes from 'prop-types';
 import { Grid, GridColumn, Tile, Carousel } from '@megafon/ui-core';
 import { breakpoints, cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import * as PropTypes from 'prop-types';
 import "./Partners.css";
 var MAX_GRID_ITEMS_LENGTH = 8;
 var slidesSettings = (_slidesSettings = {}, _defineProperty(_slidesSettings, breakpoints.MOBILE_SMALL_START, {
@@ -57,7 +57,7 @@ var Partners = function Partners(_ref) {
       alt: alt,
       className: cn('tile-img')
     }))));
-  }, []);
+  }, [itemClass]);
   var renderGrid = React.useCallback(function () {
     return /*#__PURE__*/React.createElement(Grid, {
       guttersLeft: "medium",
@@ -69,7 +69,7 @@ var Partners = function Partners(_ref) {
         mobile: "6"
       }, renderItem(item));
     }));
-  }, [items]);
+  }, [items, renderItem]);
   var renderCarousel = React.useCallback(function () {
     var halfItemsLength = Math.ceil(items.length / 2);
     var topRow = items.slice(0, halfItemsLength);
@@ -85,7 +85,7 @@ var Partners = function Partners(_ref) {
         className: cn('slide')
       }, renderItem(item), renderItem(bottomRow[i]));
     }));
-  }, [items]);
+  }, [items, onChange, onNextClick, onPrevClick, renderItem]);
   return /*#__PURE__*/React.createElement("div", _extends({
     ref: rootRef,
     className: cn([root, className])

package/dist/es/components/PictureWithDescription/PictureWithDescription.js

@@ -1,8 +1,8 @@
 import * as React from 'react';
+import { Header } from '@megafon/ui-core';
+import { cnCreate } from '@megafon/ui-helpers';
 import PropTypes from 'prop-types';
 import "./PictureWithDescription.css";
-import { cnCreate } from '@megafon/ui-helpers';
-import { Header } from '@megafon/ui-core';
 export var pictureAlignTypes = {
   LEFT: 'left',
   RIGHT: 'right'

package/dist/es/components/Property/Property.js

@@ -3,9 +3,9 @@ import "core-js/modules/es.symbol.description";
 import "core-js/modules/es.array.map";
 import _extends from "@babel/runtime/helpers/extends";
 import React from 'react';
-import PropTypes from 'prop-types';
 import { Header, Grid, GridColumn } from '@megafon/ui-core';
 import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./Property.css";
 import PropertyDescription from "./PropertyDescription";
 var cn = cnCreate('mfui-beta-property');
@@ -29,14 +29,14 @@ var Property = function Property(_ref) {
   var renderTitle = React.useCallback(function (title) {
     return title && title.map(function (titleItem, i) {
       return /*#__PURE__*/React.createElement(Header, {
-        as: 'h5',
+        as: "h5",
         key: i,
         className: classes.title
       }, icon && i === 0 && /*#__PURE__*/React.createElement("div", {
         className: cn('icon')
       }, icon), titleItem);
     });
-  }, []);
+  }, [classes.title, icon]);
   var renderDescription = React.useCallback(function (description) {
     return description && description.map(function (_ref2, j) {
       var value = _ref2.value,
@@ -53,7 +53,7 @@ var Property = function Property(_ref) {
         }
       }));
     });
-  }, []);
+  }, [classes.openedDescription, classes.toggleDescription]);
   var getColumnConfig = React.useCallback(function () {
     return fullWidth ? {
       all: '12'

package/dist/es/components/Property/PropertyDescription.js

@@ -1,8 +1,8 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import { Collapse } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./PropertyDescription.css";
 var cn = cnCreate('mfui-beta-property-description');
 

package/dist/es/components/Steps/Steps.js

@@ -1,8 +1,8 @@
 import "core-js/modules/es.array.map";
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import { Header } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./Steps.css";
 var cn = cnCreate('mfui-beta-steps');
 

package/dist/es/components/Steps/StepsItem.js

@@ -1,7 +1,7 @@
 import React from 'react';
-import PropTypes from 'prop-types';
 import { Paragraph } from '@megafon/ui-core';
 import { cnCreate } from '@megafon/ui-helpers';
+import PropTypes from 'prop-types';
 import "./StepsItem.css";
 var cn = cnCreate('mfui-beta-steps-item');
 

package/dist/es/components/StoreBanner/StoreBanner.css

@@ -220,6 +220,9 @@ h5 {
   -webkit-transform: translateX(-50%);
           transform: translateX(-50%);
 }
+.mfui-beta-store-banner__button {
+  margin: 0 auto;
+}
 .mfui-beta-store-banner__links_three .mfui-beta-store-banner__qr-code {
   -o-object-fit: contain;
      object-fit: contain;
@@ -262,8 +265,22 @@ h5 {
   margin-right: 0;
 }
 .mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link {
-  width: 119px;
-  height: 35px;
+  width: 136px;
+  height: 40px;
+}
+@media screen and (max-width: 1023px) {
+  .mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link {
+    width: 119px;
+    height: 35px;
+  }
+}
+.mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link:not(:last-child) {
+  margin-bottom: 8px;
+}
+@media screen and (max-width: 767px) {
+  .mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link:not(:last-child) {
+    margin-bottom: 16px;
+  }
 }
 @media screen and (max-width: 1023px) {
   .mfui-beta-store-banner__links_three .mfui-beta-store-banner__store-link:not(:first-child) {