@megafon/ui-shared 2.0.0-beta.237 → 2.0.0-beta.240

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.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)
+
+
+### Bug Fixes
+
+* **card:** fix icon indent ([5429444](https://github.com/MegafonWebLab/megafon-ui/commit/54294443e0cb8ead74516b0d63ddcf130c29f4f5))
+
+
+### Features
+
+* **instructions:** add mobile and desktop classes for item ([2f27427](https://github.com/MegafonWebLab/megafon-ui/commit/2f27427e665d234f3f175830c0f3f4ea44486de5))
+
+
+
+
+
 # [2.0.0-beta.237](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@2.0.0-beta.236...@megafon/ui-shared@2.0.0-beta.237) (2021-11-15)
 
 

package/dist/es/components/Card/Card.css

@@ -73,22 +73,17 @@ h5 {
 .mfui-beta-card__fake-link {
   margin: 12px 10px;
 }
-.mfui-beta-card__pic-wrapper {
-  margin-bottom: 32px;
+.mfui-beta-card__svg-wrapper {
+  margin-bottom: 24px;
 }
-@media screen and (max-width: 767px) {
-  .mfui-beta-card__pic-wrapper {
-    margin-bottom: 24px;
-  }
+.mfui-beta-card__svg-wrapper svg {
+  width: 40px;
+  height: 40px;
 }
 .mfui-beta-card__pic-wrapper .mfui-beta-card__img {
   max-width: 100%;
 }
-.mfui-beta-card__pic-wrapper svg {
-  width: 40px;
-  height: 40px;
-}
-.mfui-beta-card__pic-wrapper_img {
+.mfui-beta-card__pic-wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -100,12 +95,14 @@ h5 {
           justify-content: center;
   margin-top: -32px;
   margin-right: -20px;
+  margin-bottom: 32px;
   margin-left: -20px;
 }
 @media screen and (max-width: 767px) {
-  .mfui-beta-card__pic-wrapper_img {
+  .mfui-beta-card__pic-wrapper {
     margin-top: -24px;
     margin-right: -16px;
+    margin-bottom: 24px;
     margin-left: -16px;
   }
 }

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

@@ -47,8 +47,7 @@ var Card = function Card(_ref) {
         {
           return /*#__PURE__*/React.createElement("div", {
             className: cn('pic-wrapper', {
-              'object-fit': objectFit,
-              img: true
+              'object-fit': objectFit
             })
           }, /*#__PURE__*/React.createElement("img", {
             className: cn('img'),
@@ -59,7 +58,7 @@ var Card = function Card(_ref) {
       case !!svgSrc:
         {
           return /*#__PURE__*/React.createElement("div", {
-            className: cn('pic-wrapper')
+            className: cn('svg-wrapper')
           }, svgSrc);
         }
 

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/Instructions/Instructions.d.ts

@@ -27,6 +27,8 @@ export interface IInstructionsProps {
     /** Дополнительные классы для внутренних элементов */
     classes?: {
         instructionItem?: string;
+        desktopInstructionItem?: string;
+        mobileInstructionItem?: string;
         activeInstructionItem?: string;
         desktopItemTitle?: string;
         mobileItemTitle?: string;

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

@@ -1,4 +1,3 @@
-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';
@@ -29,6 +28,8 @@ var Instructions = function Instructions(_ref) {
       _ref$classes = _ref.classes;
   _ref$classes = _ref$classes === void 0 ? {} : _ref$classes;
   var instructionItem = _ref$classes.instructionItem,
+      desktopInstructionItem = _ref$classes.desktopInstructionItem,
+      mobileInstructionItem = _ref$classes.mobileInstructionItem,
       activeInstructionItem = _ref$classes.activeInstructionItem,
       desktopItemTitle = _ref$classes.desktopItemTitle,
       mobileItemTitle = _ref$classes.mobileItemTitle,
@@ -57,13 +58,13 @@ var Instructions = function Instructions(_ref) {
     setSwiperInstance(swiper);
     getSwiper && getSwiper(swiper);
   }, []);
-  var getArticleCustomClasses = React.useCallback(function (articleIndex, activeIndex) {
-    if (!instructionItem || !activeInstructionItem) {
+  var getActiveCustomClass = React.useCallback(function (articleIndex, activeIndex) {
+    if (articleIndex !== activeIndex) {
       return;
     }
 
-    return articleIndex === activeIndex ? "".concat(instructionItem, " ").concat(activeInstructionItem) : instructionItem;
-  }, [instructionItem, activeInstructionItem]);
+    return activeInstructionItem;
+  }, [activeInstructionItem]);
   var handleArticleClick = React.useCallback(function (ind) {
     return function () {
       setSlideIndex(ind);
@@ -136,7 +137,7 @@ var Instructions = function Instructions(_ref) {
       return /*#__PURE__*/React.createElement("li", {
         className: cn('articles-item', {
           active: slideIndex === ind
-        }, [getArticleCustomClasses(ind, slideIndex)]),
+        }, [getActiveCustomClass(ind, slideIndex), instructionItem, desktopInstructionItem]),
         "data-index": ind,
         onClick: handleArticleClick(ind),
         key: ind
@@ -172,7 +173,7 @@ var Instructions = function Instructions(_ref) {
         key: ind,
         className: cn('articles-dot', {
           active: slideIndex === ind
-        }, [getArticleCustomClasses(ind, slideIndex)]),
+        }, [getActiveCustomClass(ind, slideIndex), instructionItem, mobileInstructionItem]),
         onClick: handleArticleClick(ind)
       }, /*#__PURE__*/React.createElement("span", {
         className: cn('articles-dot-number')
@@ -207,6 +208,8 @@ Instructions.propTypes = {
   }), PropTypes.any])]),
   classes: PropTypes.shape({
     instructionItem: PropTypes.string,
+    desktopInstructionItem: PropTypes.string,
+    mobileInstructionItem: PropTypes.string,
     activeInstructionItem: PropTypes.string,
     desktopItemTitle: PropTypes.string,
     mobileItemTitle: PropTypes.string,

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) {

package/dist/lib/components/Card/Card.css

@@ -73,22 +73,17 @@ h5 {
 .mfui-beta-card__fake-link {
   margin: 12px 10px;
 }
-.mfui-beta-card__pic-wrapper {
-  margin-bottom: 32px;
+.mfui-beta-card__svg-wrapper {
+  margin-bottom: 24px;
 }
-@media screen and (max-width: 767px) {
-  .mfui-beta-card__pic-wrapper {
-    margin-bottom: 24px;
-  }
+.mfui-beta-card__svg-wrapper svg {
+  width: 40px;
+  height: 40px;
 }
 .mfui-beta-card__pic-wrapper .mfui-beta-card__img {
   max-width: 100%;
 }
-.mfui-beta-card__pic-wrapper svg {
-  width: 40px;
-  height: 40px;
-}
-.mfui-beta-card__pic-wrapper_img {
+.mfui-beta-card__pic-wrapper {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -100,12 +95,14 @@ h5 {
           justify-content: center;
   margin-top: -32px;
   margin-right: -20px;
+  margin-bottom: 32px;
   margin-left: -20px;
 }
 @media screen and (max-width: 767px) {
-  .mfui-beta-card__pic-wrapper_img {
+  .mfui-beta-card__pic-wrapper {
     margin-top: -24px;
     margin-right: -16px;
+    margin-bottom: 24px;
     margin-left: -16px;
   }
 }

package/dist/lib/components/Card/Card.js

@@ -65,8 +65,7 @@ var Card = function Card(_ref) {
         {
           return /*#__PURE__*/_react["default"].createElement("div", {
             className: cn('pic-wrapper', {
-              'object-fit': objectFit,
-              img: true
+              'object-fit': objectFit
             })
           }, /*#__PURE__*/_react["default"].createElement("img", {
             className: cn('img'),
@@ -77,7 +76,7 @@ var Card = function Card(_ref) {
       case !!svgSrc:
         {
           return /*#__PURE__*/_react["default"].createElement("div", {
-            className: cn('pic-wrapper')
+            className: cn('svg-wrapper')
           }, svgSrc);
         }
 

package/dist/lib/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/lib/components/Instructions/Instructions.d.ts

@@ -27,6 +27,8 @@ export interface IInstructionsProps {
     /** Дополнительные классы для внутренних элементов */
     classes?: {
         instructionItem?: string;
+        desktopInstructionItem?: string;
+        mobileInstructionItem?: string;
         activeInstructionItem?: string;
         desktopItemTitle?: string;
         mobileItemTitle?: string;

package/dist/lib/components/Instructions/Instructions.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = exports.pictureMaskTypes = exports.pictureAlignTypes = void 0;
 
-require("core-js/modules/es.array.concat");
-
 require("core-js/modules/es.array.map");
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
@@ -48,6 +46,8 @@ var Instructions = function Instructions(_ref) {
       _ref$classes = _ref.classes;
   _ref$classes = _ref$classes === void 0 ? {} : _ref$classes;
   var instructionItem = _ref$classes.instructionItem,
+      desktopInstructionItem = _ref$classes.desktopInstructionItem,
+      mobileInstructionItem = _ref$classes.mobileInstructionItem,
       activeInstructionItem = _ref$classes.activeInstructionItem,
       desktopItemTitle = _ref$classes.desktopItemTitle,
       mobileItemTitle = _ref$classes.mobileItemTitle,
@@ -77,13 +77,13 @@ var Instructions = function Instructions(_ref) {
     getSwiper && getSwiper(swiper);
   }, []);
 
-  var getArticleCustomClasses = _react["default"].useCallback(function (articleIndex, activeIndex) {
-    if (!instructionItem || !activeInstructionItem) {
+  var getActiveCustomClass = _react["default"].useCallback(function (articleIndex, activeIndex) {
+    if (articleIndex !== activeIndex) {
       return;
     }
 
-    return articleIndex === activeIndex ? "".concat(instructionItem, " ").concat(activeInstructionItem) : instructionItem;
-  }, [instructionItem, activeInstructionItem]);
+    return activeInstructionItem;
+  }, [activeInstructionItem]);
 
   var handleArticleClick = _react["default"].useCallback(function (ind) {
     return function () {
@@ -163,7 +163,7 @@ var Instructions = function Instructions(_ref) {
       return /*#__PURE__*/_react["default"].createElement("li", {
         className: cn('articles-item', {
           active: slideIndex === ind
-        }, [getArticleCustomClasses(ind, slideIndex)]),
+        }, [getActiveCustomClass(ind, slideIndex), instructionItem, desktopInstructionItem]),
         "data-index": ind,
         onClick: handleArticleClick(ind),
         key: ind
@@ -200,7 +200,7 @@ var Instructions = function Instructions(_ref) {
         key: ind,
         className: cn('articles-dot', {
           active: slideIndex === ind
-        }, [getArticleCustomClasses(ind, slideIndex)]),
+        }, [getActiveCustomClass(ind, slideIndex), instructionItem, mobileInstructionItem]),
         onClick: handleArticleClick(ind)
       }, /*#__PURE__*/_react["default"].createElement("span", {
         className: cn('articles-dot-number')
@@ -236,6 +236,8 @@ Instructions.propTypes = {
   }), _propTypes["default"].any])]),
   classes: _propTypes["default"].shape({
     instructionItem: _propTypes["default"].string,
+    desktopInstructionItem: _propTypes["default"].string,
+    mobileInstructionItem: _propTypes["default"].string,
     activeInstructionItem: _propTypes["default"].string,
     desktopItemTitle: _propTypes["default"].string,
     mobileItemTitle: _propTypes["default"].string,

package/dist/lib/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) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-shared",
-  "version": "2.0.0-beta.237",
+  "version": "2.0.0-beta.240",
   "files": [
     "dist"
   ],
@@ -80,7 +80,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.8.4",
-    "@megafon/ui-core": "^2.0.0-beta.166",
+    "@megafon/ui-core": "^2.0.0-beta.168",
     "@megafon/ui-helpers": "^1.0.0-beta.2",
     "core-js": "^3.6.4",
     "htmr": "^0.9.2",
@@ -88,5 +88,5 @@
     "prop-types": "^15.7.2",
     "swiper": "^6.5.6"
   },
-  "gitHead": "254ee112f9080fbe99ad5f697309097a3aa9bbf9"
+  "gitHead": "ffa46c2f7563f7ae284daba239683d7699121a73"
 }