@megafon/ui-shared 4.19.0 → 4.20.1

package/CHANGELOG.md

@@ -3,6 +3,34 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.20.1](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@4.20.0...@megafon/ui-shared@4.20.1) (2023-06-05)
+
+
+### Bug Fixes
+
+* **storebanner:** fix new mask for iphone 12 and green theme ([c7da417](https://github.com/MegafonWebLab/megafon-ui/commit/c7da417b7919eb4564eadfc2a6ee20895daf7740))
+
+
+
+
+
+# [4.20.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@4.19.0...@megafon/ui-shared@4.20.0) (2023-05-23)
+
+
+### Bug Fixes
+
+* **counterbadge:** fix required props ([6824153](https://github.com/MegafonWebLab/megafon-ui/commit/6824153b4f2543eb3961cd408c447c8bcb9cd83d))
+
+
+### Features
+
+* **container:** add bottomShadow props ([b8d8249](https://github.com/MegafonWebLab/megafon-ui/commit/b8d82492b7300211548b71049820264bdc54a761))
+* **videobanner:** add bottomShadow prop ([b103f1d](https://github.com/MegafonWebLab/megafon-ui/commit/b103f1defc5562bd50ef1ff5dcd5e568310378cf))
+
+
+
+
+
 # [4.19.0](https://github.com/MegafonWebLab/megafon-ui/compare/@megafon/ui-shared@4.18.3...@megafon/ui-shared@4.19.0) (2023-05-17)
 
 

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

@@ -6,6 +6,7 @@ h5 {
   margin: 0;
 }
 .mfui-container {
+  position: relative;
   padding-bottom: 96px;
 }
 .mfui-container_bg-color_default {
@@ -27,11 +28,17 @@ h5 {
   .mfui-container {
     padding-bottom: 72px;
   }
+  .mfui-container_bottom-shadow:after {
+    bottom: 72px !important;
+  }
 }
 @media screen and (max-width: 767px) {
   .mfui-container {
     padding-bottom: 48px;
   }
+  .mfui-container_bottom-shadow:after {
+    bottom: 48px !important;
+  }
 }
 .mfui-container_bg-color_default + .mfui-container_bg-color_light-gray {
   padding-top: 96px;
@@ -3073,9 +3080,22 @@ h5 {
     margin-top: 24px;
   }
 }
+.mfui-container_bottom-shadow:after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 96px;
+  width: 100%;
+  height: 100%;
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(95.25%, rgba(255, 255, 255, 0)), to(rgba(0, 0, 0, 0.024)));
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 95.25%, rgba(0, 0, 0, 0.024) 100%);
+}
 .mfui-container_disable-padding-top {
   padding-top: 0 !important;
 }
 .mfui-container_disable-padding-bottom {
   padding-bottom: 0 !important;
 }
+.mfui-container_disable-padding-bottom.mfui-container_bottom-shadow:after {
+  bottom: 0 !important;
+}

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

@@ -21,6 +21,8 @@ declare type Props = {
     disablePaddingTop?: boolean;
     /** Отключить отступ снизу */
     disablePaddingBottom?: boolean;
+    /** Включить тень в нижней части компонента */
+    bottomShadow?: boolean;
 };
 declare const Container: React.FC<Props>;
 export default Container;

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

@@ -21,10 +21,13 @@ var Container = function Container(_ref) {
       className = _ref.className,
       children = _ref.children,
       disablePaddingTop = _ref.disablePaddingTop,
-      disablePaddingBottom = _ref.disablePaddingBottom;
+      disablePaddingBottom = _ref.disablePaddingBottom,
+      _ref$bottomShadow = _ref.bottomShadow,
+      bottomShadow = _ref$bottomShadow === void 0 ? false : _ref$bottomShadow;
   return /*#__PURE__*/React.createElement("div", {
     className: cn({
       'bg-color': backgroundColor,
+      'bottom-shadow': bottomShadow,
       'disable-padding-top': disablePaddingTop,
       'disable-padding-bottom': disablePaddingBottom
     }, [className]),
@@ -41,6 +44,7 @@ Container.propTypes = {
     current: PropTypes.elementType
   }), PropTypes.any])]),
   disablePaddingTop: PropTypes.bool,
-  disablePaddingBottom: PropTypes.bool
+  disablePaddingBottom: PropTypes.bool,
+  bottomShadow: PropTypes.bool
 };
 export default Container;

package/dist/es/components/DeviceMask/DeviceMask.css

@@ -0,0 +1,66 @@
+h1,
+h2,
+h3,
+h4,
+h5 {
+  margin: 0;
+}
+.mfui-device-mask {
+  position: relative;
+  width: 250px;
+  height: 550px;
+  overflow: hidden;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+.mfui-device-mask__screen-content {
+  position: absolute;
+  z-index: 0;
+  width: 214px;
+  height: 462px;
+  overflow: hidden;
+}
+.mfui-device-mask__screen-content_android {
+  top: 10px;
+  left: 10px;
+  width: 228px;
+  height: 460px;
+}
+.mfui-device-mask__screen-content_iphone {
+  top: 16px;
+  left: 16px;
+  width: 218px;
+  height: 469px;
+}
+.mfui-device-mask__screen-content_black-iphone,
+.mfui-device-mask__screen-content_white-iphone {
+  top: 60px;
+  left: 17px;
+  width: 216px;
+  height: 381px;
+}
+.mfui-device-mask__screen-content > * {
+  max-width: 100%;
+}
+.mfui-device-mask__device {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+  background-repeat: no-repeat;
+  background-size: 100% auto;
+}
+.mfui-device-mask__device_android {
+  background-image: url('./i/android.png');
+}
+.mfui-device-mask__device_iphone {
+  background-image: url('./i/iphone.png');
+}
+.mfui-device-mask__device_black-iphone {
+  background-image: url('./i/black-iphone.png');
+}
+.mfui-device-mask__device_white-iphone {
+  background-image: url('./i/white-iphone.png');
+}

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

@@ -0,0 +1,15 @@
+import React from 'react';
+import './DeviceMask.less';
+export declare const Devices: {
+    readonly IPHONE: "iphone";
+    readonly ANDROID: "android";
+    readonly BLACK_IPHONE: "black-iphone";
+    readonly WHITE_IPHONE: "white-iphone";
+};
+declare type DevicesType = typeof Devices[keyof typeof Devices];
+export interface IDeviceMaskProps {
+    device: DevicesType;
+    screenContent: React.ReactNode;
+}
+declare const DeviceMask: React.FC<IDeviceMaskProps>;
+export default DeviceMask;

package/dist/es/components/DeviceMask/DeviceMask.js

@@ -0,0 +1,25 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import React from 'react';
+import { cnCreate } from '@megafon/ui-helpers';
+import "./DeviceMask.css";
+export var Devices = {
+  IPHONE: 'iphone',
+  ANDROID: 'android',
+  BLACK_IPHONE: 'black-iphone',
+  WHITE_IPHONE: 'white-iphone'
+};
+var cn = cnCreate('mfui-device-mask');
+
+var DeviceMask = function DeviceMask(_ref) {
+  var device = _ref.device,
+      screenContent = _ref.screenContent;
+  return /*#__PURE__*/React.createElement("div", {
+    className: cn()
+  }, /*#__PURE__*/React.createElement("div", {
+    className: cn('screen-content', _defineProperty({}, device, true))
+  }, screenContent), /*#__PURE__*/React.createElement("div", {
+    className: cn('device', _defineProperty({}, device, true))
+  }));
+};
+
+export default DeviceMask;

package/dist/es/components/VideoBanner/VideoBanner.css

@@ -33,6 +33,16 @@ h5 {
     margin-left: -16px;
   }
 }
+.mfui-video-banner_bottom-shadow:after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(95.25%, rgba(255, 255, 255, 0)), to(rgba(0, 0, 0, 0.024)));
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 95.25%, rgba(0, 0, 0, 0.024) 100%);
+}
 .mfui-video-banner__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;

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

@@ -104,6 +104,8 @@ interface IVideoBannerProps {
     breadcrumbs?: BreadCrumbsItemsType;
     /** Включить микроразметку хлебных крошек */
     hasBreadcrumbsMicrodata?: boolean;
+    /** Включить тень в нижней части компонента */
+    bottomShadow?: boolean;
 }
 declare const VideoBanner: React.FC<IVideoBannerProps>;
 export default VideoBanner;

package/dist/es/components/VideoBanner/VideoBanner.js

@@ -68,7 +68,9 @@ var VideoBanner = function VideoBanner(_ref2) {
       _ref2$videoMobile = _ref2.videoMobile,
       videoMobile = _ref2$videoMobile === void 0 ? false : _ref2$videoMobile,
       _ref2$hasBreadcrumbsM = _ref2.hasBreadcrumbsMicrodata,
-      hasBreadcrumbsMicrodata = _ref2$hasBreadcrumbsM === void 0 ? false : _ref2$hasBreadcrumbsM;
+      hasBreadcrumbsMicrodata = _ref2$hasBreadcrumbsM === void 0 ? false : _ref2$hasBreadcrumbsM,
+      _ref2$bottomShadow = _ref2.bottomShadow,
+      bottomShadow = _ref2$bottomShadow === void 0 ? false : _ref2$bottomShadow;
 
   var _React$useState = React.useState(true),
       _React$useState2 = _slicedToArray(_React$useState, 2),
@@ -208,9 +210,12 @@ var VideoBanner = function VideoBanner(_ref2) {
       window.removeEventListener('resize', resizeHandlerThrottled);
     };
   }, [setIsMobile]);
-  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
-    className: cn([className, classes.root]),
+  return /*#__PURE__*/React.createElement("div", _extends({
     ref: rootRef
+  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      'bottom-shadow': bottomShadow
+    }, [className, classes.root])
   }), /*#__PURE__*/React.createElement(ContentArea, null, /*#__PURE__*/React.createElement("div", {
     className: cn('wrapper')
   }, !!(breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) && /*#__PURE__*/React.createElement(Breadcrumbs, {
@@ -290,6 +295,7 @@ VideoBanner.propTypes = {
     title: PropTypes.string.isRequired,
     href: PropTypes.string
   }).isRequired),
-  hasBreadcrumbsMicrodata: PropTypes.bool
+  hasBreadcrumbsMicrodata: PropTypes.bool,
+  bottomShadow: PropTypes.bool
 };
 export default VideoBanner;

package/dist/es/index.d.ts

@@ -15,6 +15,7 @@ export { default as Card } from './components/Card/Card';
 export { default as CardsBox } from './components/CardsBox/CardsBox';
 export { default as CarouselBox } from './components/CarouselBox/CarouselBox';
 export { default as Container } from './components/Container/Container';
+export { default as DeviceMask } from './components/DeviceMask/DeviceMask';
 export { default as DownloadLink } from './components/DownloadLinks/DownloadLink';
 export { default as DownloadLinks } from './components/DownloadLinks/DownloadLinks';
 export { default as FaqWrapper } from './components/FaqWrapper/FaqWrapper';

package/dist/es/index.js

@@ -15,6 +15,7 @@ export { default as Card } from "./components/Card/Card";
 export { default as CardsBox } from "./components/CardsBox/CardsBox";
 export { default as CarouselBox } from "./components/CarouselBox/CarouselBox";
 export { default as Container } from "./components/Container/Container";
+export { default as DeviceMask } from "./components/DeviceMask/DeviceMask";
 export { default as DownloadLink } from "./components/DownloadLinks/DownloadLink";
 export { default as DownloadLinks } from "./components/DownloadLinks/DownloadLinks";
 export { default as FaqWrapper } from "./components/FaqWrapper/FaqWrapper";

package/dist/lib/components/Container/Container.css

@@ -6,6 +6,7 @@ h5 {
   margin: 0;
 }
 .mfui-container {
+  position: relative;
   padding-bottom: 96px;
 }
 .mfui-container_bg-color_default {
@@ -27,11 +28,17 @@ h5 {
   .mfui-container {
     padding-bottom: 72px;
   }
+  .mfui-container_bottom-shadow:after {
+    bottom: 72px !important;
+  }
 }
 @media screen and (max-width: 767px) {
   .mfui-container {
     padding-bottom: 48px;
   }
+  .mfui-container_bottom-shadow:after {
+    bottom: 48px !important;
+  }
 }
 .mfui-container_bg-color_default + .mfui-container_bg-color_light-gray {
   padding-top: 96px;
@@ -3073,9 +3080,22 @@ h5 {
     margin-top: 24px;
   }
 }
+.mfui-container_bottom-shadow:after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 96px;
+  width: 100%;
+  height: 100%;
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(95.25%, rgba(255, 255, 255, 0)), to(rgba(0, 0, 0, 0.024)));
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 95.25%, rgba(0, 0, 0, 0.024) 100%);
+}
 .mfui-container_disable-padding-top {
   padding-top: 0 !important;
 }
 .mfui-container_disable-padding-bottom {
   padding-bottom: 0 !important;
 }
+.mfui-container_disable-padding-bottom.mfui-container_bottom-shadow:after {
+  bottom: 0 !important;
+}

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

@@ -21,6 +21,8 @@ declare type Props = {
     disablePaddingTop?: boolean;
     /** Отключить отступ снизу */
     disablePaddingBottom?: boolean;
+    /** Включить тень в нижней части компонента */
+    bottomShadow?: boolean;
 };
 declare const Container: React.FC<Props>;
 export default Container;

package/dist/lib/components/Container/Container.js

@@ -35,10 +35,13 @@ var Container = function Container(_ref) {
       className = _ref.className,
       children = _ref.children,
       disablePaddingTop = _ref.disablePaddingTop,
-      disablePaddingBottom = _ref.disablePaddingBottom;
+      disablePaddingBottom = _ref.disablePaddingBottom,
+      _ref$bottomShadow = _ref.bottomShadow,
+      bottomShadow = _ref$bottomShadow === void 0 ? false : _ref$bottomShadow;
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: cn({
       'bg-color': backgroundColor,
+      'bottom-shadow': bottomShadow,
       'disable-padding-top': disablePaddingTop,
       'disable-padding-bottom': disablePaddingBottom
     }, [className]),
@@ -55,7 +58,8 @@ Container.propTypes = {
     current: _propTypes["default"].elementType
   }), _propTypes["default"].any])]),
   disablePaddingTop: _propTypes["default"].bool,
-  disablePaddingBottom: _propTypes["default"].bool
+  disablePaddingBottom: _propTypes["default"].bool,
+  bottomShadow: _propTypes["default"].bool
 };
 var _default = Container;
 exports["default"] = _default;

package/dist/lib/components/DeviceMask/DeviceMask.css

@@ -0,0 +1,66 @@
+h1,
+h2,
+h3,
+h4,
+h5 {
+  margin: 0;
+}
+.mfui-device-mask {
+  position: relative;
+  width: 250px;
+  height: 550px;
+  overflow: hidden;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+.mfui-device-mask__screen-content {
+  position: absolute;
+  z-index: 0;
+  width: 214px;
+  height: 462px;
+  overflow: hidden;
+}
+.mfui-device-mask__screen-content_android {
+  top: 10px;
+  left: 10px;
+  width: 228px;
+  height: 460px;
+}
+.mfui-device-mask__screen-content_iphone {
+  top: 16px;
+  left: 16px;
+  width: 218px;
+  height: 469px;
+}
+.mfui-device-mask__screen-content_black-iphone,
+.mfui-device-mask__screen-content_white-iphone {
+  top: 60px;
+  left: 17px;
+  width: 216px;
+  height: 381px;
+}
+.mfui-device-mask__screen-content > * {
+  max-width: 100%;
+}
+.mfui-device-mask__device {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 1;
+  width: 100%;
+  height: 100%;
+  background-repeat: no-repeat;
+  background-size: 100% auto;
+}
+.mfui-device-mask__device_android {
+  background-image: url('./i/android.png');
+}
+.mfui-device-mask__device_iphone {
+  background-image: url('./i/iphone.png');
+}
+.mfui-device-mask__device_black-iphone {
+  background-image: url('./i/black-iphone.png');
+}
+.mfui-device-mask__device_white-iphone {
+  background-image: url('./i/white-iphone.png');
+}

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

@@ -0,0 +1,15 @@
+import React from 'react';
+import './DeviceMask.less';
+export declare const Devices: {
+    readonly IPHONE: "iphone";
+    readonly ANDROID: "android";
+    readonly BLACK_IPHONE: "black-iphone";
+    readonly WHITE_IPHONE: "white-iphone";
+};
+declare type DevicesType = typeof Devices[keyof typeof Devices];
+export interface IDeviceMaskProps {
+    device: DevicesType;
+    screenContent: React.ReactNode;
+}
+declare const DeviceMask: React.FC<IDeviceMaskProps>;
+export default DeviceMask;

package/dist/lib/components/DeviceMask/DeviceMask.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Devices = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _uiHelpers = require("@megafon/ui-helpers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var Devices = {
+  IPHONE: 'iphone',
+  ANDROID: 'android',
+  BLACK_IPHONE: 'black-iphone',
+  WHITE_IPHONE: 'white-iphone'
+};
+exports.Devices = Devices;
+var cn = (0, _uiHelpers.cnCreate)('mfui-device-mask');
+
+var DeviceMask = function DeviceMask(_ref) {
+  var device = _ref.device,
+      screenContent = _ref.screenContent;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: cn()
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: cn('screen-content', (0, _defineProperty2["default"])({}, device, true))
+  }, screenContent), /*#__PURE__*/_react["default"].createElement("div", {
+    className: cn('device', (0, _defineProperty2["default"])({}, device, true))
+  }));
+};
+
+var _default = DeviceMask;
+exports["default"] = _default;

package/dist/lib/components/VideoBanner/VideoBanner.css

@@ -33,6 +33,16 @@ h5 {
     margin-left: -16px;
   }
 }
+.mfui-video-banner_bottom-shadow:after {
+  content: '';
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(95.25%, rgba(255, 255, 255, 0)), to(rgba(0, 0, 0, 0.024)));
+  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 95.25%, rgba(0, 0, 0, 0.024) 100%);
+}
 .mfui-video-banner__wrapper {
   display: -webkit-box;
   display: -ms-flexbox;

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

@@ -104,6 +104,8 @@ interface IVideoBannerProps {
     breadcrumbs?: BreadCrumbsItemsType;
     /** Включить микроразметку хлебных крошек */
     hasBreadcrumbsMicrodata?: boolean;
+    /** Включить тень в нижней части компонента */
+    bottomShadow?: boolean;
 }
 declare const VideoBanner: React.FC<IVideoBannerProps>;
 export default VideoBanner;

package/dist/lib/components/VideoBanner/VideoBanner.js

@@ -100,7 +100,9 @@ var VideoBanner = function VideoBanner(_ref2) {
       _ref2$videoMobile = _ref2.videoMobile,
       videoMobile = _ref2$videoMobile === void 0 ? false : _ref2$videoMobile,
       _ref2$hasBreadcrumbsM = _ref2.hasBreadcrumbsMicrodata,
-      hasBreadcrumbsMicrodata = _ref2$hasBreadcrumbsM === void 0 ? false : _ref2$hasBreadcrumbsM;
+      hasBreadcrumbsMicrodata = _ref2$hasBreadcrumbsM === void 0 ? false : _ref2$hasBreadcrumbsM,
+      _ref2$bottomShadow = _ref2.bottomShadow,
+      bottomShadow = _ref2$bottomShadow === void 0 ? false : _ref2$bottomShadow;
 
   var _React$useState = _react["default"].useState(true),
       _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
@@ -244,9 +246,12 @@ var VideoBanner = function VideoBanner(_ref2) {
     };
   }, [setIsMobile]);
 
-  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
-    className: cn([className, classes.root]),
+  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
     ref: rootRef
+  }, (0, _uiHelpers.filterDataAttrs)(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
+    className: cn({
+      'bottom-shadow': bottomShadow
+    }, [className, classes.root])
   }), /*#__PURE__*/_react["default"].createElement(_uiCore.ContentArea, null, /*#__PURE__*/_react["default"].createElement("div", {
     className: cn('wrapper')
   }, !!(breadcrumbs === null || breadcrumbs === void 0 ? void 0 : breadcrumbs.length) && /*#__PURE__*/_react["default"].createElement(_Breadcrumbs["default"], {
@@ -326,7 +331,8 @@ VideoBanner.propTypes = {
     title: PropTypes.string.isRequired,
     href: PropTypes.string
   }).isRequired),
-  hasBreadcrumbsMicrodata: PropTypes.bool
+  hasBreadcrumbsMicrodata: PropTypes.bool,
+  bottomShadow: PropTypes.bool
 };
 var _default = VideoBanner;
 exports["default"] = _default;

package/dist/lib/index.d.ts

@@ -15,6 +15,7 @@ export { default as Card } from './components/Card/Card';
 export { default as CardsBox } from './components/CardsBox/CardsBox';
 export { default as CarouselBox } from './components/CarouselBox/CarouselBox';
 export { default as Container } from './components/Container/Container';
+export { default as DeviceMask } from './components/DeviceMask/DeviceMask';
 export { default as DownloadLink } from './components/DownloadLinks/DownloadLink';
 export { default as DownloadLinks } from './components/DownloadLinks/DownloadLinks';
 export { default as FaqWrapper } from './components/FaqWrapper/FaqWrapper';

package/dist/lib/index.js

@@ -105,6 +105,12 @@ Object.defineProperty(exports, "Container", {
     return _Container["default"];
   }
 });
+Object.defineProperty(exports, "DeviceMask", {
+  enumerable: true,
+  get: function get() {
+    return _DeviceMask["default"];
+  }
+});
 Object.defineProperty(exports, "DownloadLink", {
   enumerable: true,
   get: function get() {
@@ -308,6 +314,8 @@ var _CarouselBox = _interopRequireDefault(require("./components/CarouselBox/Caro
 
 var _Container = _interopRequireDefault(require("./components/Container/Container"));
 
+var _DeviceMask = _interopRequireDefault(require("./components/DeviceMask/DeviceMask"));
+
 var _DownloadLink = _interopRequireDefault(require("./components/DownloadLinks/DownloadLink"));
 
 var _DownloadLinks = _interopRequireDefault(require("./components/DownloadLinks/DownloadLinks"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@megafon/ui-shared",
-  "version": "4.19.0",
+  "version": "4.20.1",
   "files": [
     "dist"
   ],
@@ -86,7 +86,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.8.4",
-    "@megafon/ui-core": "^4.16.0",
+    "@megafon/ui-core": "^4.16.1",
     "@megafon/ui-helpers": "^2.5.0",
     "core-js": "^3.6.4",
     "htmr": "^0.9.2",
@@ -94,5 +94,5 @@
     "prop-types": "^15.7.2",
     "swiper": "^6.5.6"
   },
-  "gitHead": "7e5ec2880019da52a81060df8e96320269ab5f2f"
+  "gitHead": "a5c7e2036b6bd896caecea24f7ddab0fd3648309"
 }