@skbkontur/react-ui 0.0.0-c91b3db3f4 → 0.0.0-cb270e7a13

package/cjs/components/Modal/Modal.styles.d.ts

@@ -1,25 +1,39 @@
 import { Theme } from '../../lib/theming/Theme';
-export declare const jsStyles: {
+export declare const styles: {
     root(): string;
     bg(t: Theme): string;
     container(): string;
     window(t: Theme): string;
+    mobileWindow(): string;
     centerContainer(t: Theme): string;
-    alignTop(t: Theme): string;
+    mobileCenterContainer(): string;
+    alignTop(): string;
     close(t: Theme): string;
+    mobileClose(t: Theme): string;
+    mobileCloseWithoutHeader(): string;
     closeWrapper(t: Theme): string;
+    mobileCloseWrapper(t: Theme): string;
     disabled(t: Theme): string;
+    focus(t: Theme): string;
     headerWrapper(): string;
     header(t: Theme): string;
+    mobileHeader(t: Theme): string;
     body(t: Theme): string;
+    mobileBody(t: Theme): string;
     headerWithClose(t: Theme): string;
+    mobileHeaderWithClose(t: Theme): string;
     footer(t: Theme): string;
+    mobileFooter(t: Theme): string;
     footerWrapper(): string;
     panel(t: Theme): string;
     fixedHeader(t: Theme): string;
+    mobileFixedHeader(t: Theme): string;
     fixedFooter(t: Theme): string;
     headerAddPadding(): string;
     bodyWithoutHeader(t: Theme): string;
+    mobileBodyWithoutHeader(t: Theme): string;
     bodyWithoutPadding(): string;
     bodyAddPaddingForPanel(t: Theme): string;
+    mobileBodyAddPaddingForPanel(t: Theme): string;
+    columnFlexContainer(): string;
 };

package/cjs/components/Modal/Modal.styles.js

@@ -1,8 +1,8 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");
 
-var _Mixins = require("../../lib/styles/Mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
+var _Mixins = require("../../lib/styles/Mixins");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36;
 
-var styles = {
+var styles = (0, _Emotion.memoizeStyle)({
   root: function root() {
     return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 100%;\n      left: 0;\n      position: fixed;\n      top: 0;\n      width: 100%;\n    "])));
 
@@ -49,38 +49,47 @@ var styles = {
 
 
 
-    t.bgDefault);
+    t.modalBg);
 
   },
 
-  centerContainer: function centerContainer(t) {
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n      box-sizing: border-box;\n      z-index: 10;\n      margin: 40px 20px;\n\n      @media screen and (max-width: ", ") {\n        margin: 0;\n        width: 100%;\n      }\n    "])),
+  mobileWindow: function mobileWindow() {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 100%;\n      height: 100%;\n      overflow: auto;\n    "])));
 
 
 
 
+  },
+
+  centerContainer: function centerContainer(t) {
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n      box-sizing: border-box;\n      z-index: 10;\n      margin: 40px 20px;\n    "])));
 
 
 
 
-    t.modalAdaptiveThreshold);
 
 
 
 
   },
 
-  alignTop: function alignTop(t) {
-    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        vertical-align: top;\n      }\n    "])),
-    (0, _Emotion.cssName)(styles.centerContainer(t)));
+  mobileCenterContainer: function mobileCenterContainer() {
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: 0;\n      width: 100%;\n      height: 100%;\n    "])));
+
+
+
+
+  },
 
+  alignTop: function alignTop() {
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      vertical-align: top;\n    "])));
 
 
   },
 
   close: function close(t) {
     var padding = parseInt(t.modalCloseButtonPadding);
-    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n      position: absolute;\n      display: flex;\n      right: ", "px;\n      top: ", "px;\n      background: none;\n      background: transparent;\n      cursor: pointer;\n      color: ", ";\n      text-align: center;\n      vertical-align: middle;\n      padding: ", " !important;\n      margin: -", " !important;\n\n      &:focus,\n      &:hover {\n        color: ", ";\n      }\n\n      &:focus {\n        outline: 2px solid ", ";\n      }\n\n      & > svg {\n        width: ", ";\n        height: ", ";\n        box-sizing: content-box;\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n      position: absolute;\n      display: flex;\n      right: ", "px;\n      top: ", "px;\n      background: none;\n      background: transparent;\n      cursor: pointer;\n      color: ", ";\n      text-align: center;\n      vertical-align: middle;\n      padding: ", ";\n      margin: -", ";\n\n      &:hover {\n        color: ", ";\n      }\n\n      & > svg {\n        width: ", ";\n        height: ", ";\n        box-sizing: content-box;\n      }\n    "])),
     (0, _Mixins.resetButton)(),
 
 
@@ -96,18 +105,33 @@ var styles = {
     t.modalCloseButtonClickArea,
 
 
-
     t.modalCloseButtonHoverColor,
 
 
 
-    t.borderColorFocus,
+    t.modalCloseIconSize,
+    t.modalCloseIconSize);
 
 
 
-    t.modalCloseIconSize,
-    t.modalCloseIconSize);
+  },
+
+  mobileClose: function mobileClose(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      right: ", ";\n      top: ", "px;\n      padding: ", ";\n      margin: -", ";\n\n      & > svg {\n        width: ", ";\n        height: ", ";\n      }\n    "])),
+    t.mobileModalCloseButtonRightPadding,
+    parseInt(t.mobileModalCloseButtonTopPadding) + parseInt(t.mobileModalHeaderPadding),
+    t.mobileModalCloseButtonClickArea,
+    t.mobileModalCloseButtonClickArea,
+
 
+    t.mobileModalCloseIconSize,
+    t.mobileModalCloseIconSize);
+
+
+  },
+
+  mobileCloseWithoutHeader: function mobileCloseWithoutHeader() {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: static;\n    "])));
 
 
   },
@@ -119,7 +143,7 @@ var styles = {
     var legacyShift = parseInt(t.modalCloseButtonLegacyShift);
     var blockSizeX = parseInt(t.modalCloseIconSize) + 2 * padding - legacyShift;
     var blockSizeY = parseInt(t.modalCloseIconSize) + padding + paddingBottom + legacyGap;
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      float: right;\n      width: ", "px;\n      height: ", "px;\n    "])),
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      float: right;\n      width: ", "px;\n      height: ", "px;\n    "])),
 
 
     blockSizeX + legacyGap,
@@ -127,35 +151,80 @@ var styles = {
 
   },
 
+  mobileCloseWrapper: function mobileCloseWrapper(t) {
+    var size = parseInt(t.mobileModalCloseIconSize) + parseInt(t.mobileModalCloseButtonClickArea) * 2;
+
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      right: ", ";\n      top: ", ";\n      padding: 0px;\n      margin: 0px;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      width: ", "px;\n      height: ", "px;\n      background: radial-gradient(50% 50% at 50% 50%, ", " 60%, rgba(255, 255, 255, 0) 100%);\n      border-radius: ", "px;\n    "])),
+
+    t.mobileModalCloseButtonRightPadding,
+    t.mobileModalCloseButtonTopPadding,
+
+
+
+
+
+    size,
+    size,
+    t.bgDefault,
+    size);
+
+  },
+
   disabled: function disabled(t) {
-    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        pointer-events: none;\n        cursor: default;\n        color: ", ";\n      }\n    "])),
-    (0, _Emotion.cssName)(styles.close(t)),
+    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      pointer-events: none;\n      cursor: default;\n      color: ", ";\n    "])),
 
 
     t.modalCloseButtonDisabledColor);
 
+  },
+
+  focus: function focus(t) {
+    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      outline: 2px solid ", ";\n    "])),
+    t.modalCloseButtonHoverColor,
+    t.borderColorFocus);
 
   },
 
   headerWrapper: function headerWrapper() {
-    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "])));
+    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "])));
 
 
   },
 
   header: function header(t) {
-    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", " ", " ", " ", ";\n      overflow-wrap: break-word;\n      word-wrap: break-word;\n    "])),
+    return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", " ", " ", " ", ";\n      overflow-wrap: break-word;\n      word-wrap: break-word;\n      color: ", ";\n    "])),
     t.modalHeaderFontSize,
     t.modalHeaderLineHeight,
-    t.modalHeaderPaddingTop, t.modalPaddingRight, t.modalHeaderPaddingBottom, t.modalPaddingLeft);
+    t.modalHeaderPaddingTop, t.modalPaddingRight, t.modalHeaderPaddingBottom, t.modalPaddingLeft,
 
 
+    t.modalHeaderTextColor);
+
+  },
+
+  mobileHeader: function mobileHeader(t) {
+    return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])),
+    t.mobileModalHeaderFontSize,
+    t.mobileModalHeaderLineHeight,
+    t.mobileModalHeaderPadding);
 
   },
 
   body: function body(t) {
-    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 ", " ", " ", ";\n    "])),
-    t.modalPaddingRight, t.modalBodyPaddingBottom, t.modalPaddingLeft);
+    return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 ", " ", " ", ";\n      color: ", ";\n    "])),
+    t.modalPaddingRight, t.modalBodyPaddingBottom, t.modalPaddingLeft,
+    t.modalBodyTextColor);
+
+  },
+
+  mobileBody: function mobileBody(t) {
+    return (0, _Emotion.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n      padding-top: 0px;\n      display: flex;\n      flex-flow: column;\n      flex: 1;\n      font-size: ", ";\n    "])),
+    t.mobileModalBodyPadding,
+
+
+
+
+    t.mobileModalBodyFontSize);
 
   },
 
@@ -163,35 +232,46 @@ var styles = {
     var rightPadding =
     2 * parseInt(t.modalCloseButtonPadding) + parseInt(t.modalCloseIconSize) + parseInt(t.modalCloseLegacyGap);
 
-    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
+    return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
     rightPadding);
 
   },
 
+  mobileHeaderWithClose: function mobileHeaderWithClose(t) {
+    return (0, _Emotion.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
+    2 * parseInt(t.mobileModalCloseButtonRightPadding) + parseInt(t.mobileModalCloseIconSize));
+
+  },
+
   footer: function footer(t) {
-    return (0, _Emotion.css)(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", " ", " ", ";\n    "])),
-    t.modalFooterPaddingTop, t.modalPaddingRight, t.modalFooterPaddingBottom, t.modalPaddingLeft);
+    return (0, _Emotion.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", " ", " ", ";\n      color: ", ";\n    "])),
+    t.modalFooterPaddingTop, t.modalPaddingRight, t.modalFooterPaddingBottom, t.modalPaddingLeft,
+    t.modalFooterTextColor);
+
+  },
+
+  mobileFooter: function mobileFooter(t) {
+    return (0, _Emotion.css)(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n    "])),
+    t.mobileModalFooterPadding);
 
   },
 
   footerWrapper: function footerWrapper() {
-    return (0, _Emotion.css)(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "])));
+    return (0, _Emotion.css)(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "])));
 
 
   },
 
   panel: function panel(t) {
-    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        padding-top: ", " !important;\n        padding-bottom: ", " !important;\n        background: ", " !important;\n      }\n    "])),
-    (0, _Emotion.cssName)(styles.footer(t)),
+    return (0, _Emotion.css)(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      background: ", ";\n    "])),
     t.modalFooterPanelPaddingTop,
     t.modalFooterPanelPaddingBottom,
     t.modalFooterBg);
 
-
   },
 
   fixedHeader: function fixedHeader(t) {
-    return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-bottom: 10px;\n      padding-bottom: ", ";\n      background: ", ";\n\n      &:after {\n        bottom: 11px;\n        content: '';\n        position: absolute;\n        height: 1px;\n        width: 100%;\n        left: 0;\n        z-index: -1;\n        box-shadow: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-bottom: 10px;\n      padding-bottom: ", ";\n      background: ", ";\n\n      &:after {\n        bottom: 11px;\n        content: '';\n        position: absolute;\n        height: 1px;\n        width: 100%;\n        left: 0;\n        z-index: -1;\n        box-shadow: ", ";\n      }\n    "])),
 
     t.modalFixedHeaderPaddingBottom,
     t.modalFixedHeaderBg,
@@ -209,9 +289,14 @@ var styles = {
 
   },
 
+  mobileFixedHeader: function mobileFixedHeader(t) {
+    return (0, _Emotion.css)(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+    t.mobileModalHeaderPadding);
+
+  },
+
   fixedFooter: function fixedFooter(t) {
-    return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        padding-top: 20px;\n        margin-top: 10px;\n        background: ", ";\n      }\n\n      &:before {\n        top: 11px;\n        content: '';\n        position: absolute;\n        height: 1px;\n        width: 100%;\n        left: 0;\n        z-index: -1;\n        box-shadow: ", ";\n      }\n    "])),
-    (0, _Emotion.cssName)(styles.footer(t)),
+    return (0, _Emotion.css)(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: 20px;\n      margin-top: 10px;\n      background: ", ";\n\n      &:before {\n        top: 11px;\n        content: '';\n        position: absolute;\n        height: 1px;\n        width: 100%;\n        left: 0;\n        z-index: -1;\n        box-shadow: ", ";\n      }\n    "])),
 
 
     t.modalFixedHeaderBg,
@@ -224,35 +309,52 @@ var styles = {
 
 
 
-
     t.modalFixedFooterShadow);
 
 
   },
 
   headerAddPadding: function headerAddPadding() {
-    return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: 22px;\n    "])));
+    return (0, _Emotion.css)(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: 22px;\n    "])));
 
 
   },
 
   bodyWithoutHeader: function bodyWithoutHeader(t) {
-    return (0, _Emotion.css)(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", " !important;\n    "])),
+    return (0, _Emotion.css)(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n    "])),
     t.modalPaddingTop);
 
   },
 
+  mobileBodyWithoutHeader: function mobileBodyWithoutHeader(t) {
+    return (0, _Emotion.css)(_templateObject32 || (_templateObject32 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: 0px;\n    "])));
+
+
+  },
+
   bodyWithoutPadding: function bodyWithoutPadding() {
-    return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 !important;\n    "])));
+    return (0, _Emotion.css)(_templateObject33 || (_templateObject33 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0;\n    "])));
 
 
   },
 
   bodyAddPaddingForPanel: function bodyAddPaddingForPanel(t) {
-    return (0, _Emotion.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject34 || (_templateObject34 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
     t.modalPaddingBottom);
 
-  } };
+  },
+
+  mobileBodyAddPaddingForPanel: function mobileBodyAddPaddingForPanel(t) {
+    return (0, _Emotion.css)(_templateObject35 || (_templateObject35 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+    t.mobileModalBodyPadding);
+
+  },
+
+  columnFlexContainer: function columnFlexContainer() {
+    return (0, _Emotion.css)(_templateObject36 || (_templateObject36 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 100%;\n      display: flex;\n      flex-flow: column;\n      overflow-y: scroll;\n    "])));
+
+
+
 
 
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

package/cjs/components/Modal/Modal.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Modal.styles.ts"],"names":["styles","root","css","bg","t","modalBackBg","modalBackOpacity","container","window","bgDefault","centerContainer","modalAdaptiveThreshold","alignTop","close","padding","parseInt","modalCloseButtonPadding","modalCloseButtonColor","modalCloseButtonClickArea","modalCloseButtonHoverColor","borderColorFocus","modalCloseIconSize","closeWrapper","paddingBottom","modalCloseButtonBottomPadding","legacyGap","modalCloseWrapperLegacyGap","legacyShift","modalCloseButtonLegacyShift","blockSizeX","blockSizeY","disabled","modalCloseButtonDisabledColor","headerWrapper","header","modalHeaderFontSize","modalHeaderLineHeight","modalHeaderPaddingTop","modalPaddingRight","modalHeaderPaddingBottom","modalPaddingLeft","body","modalBodyPaddingBottom","headerWithClose","rightPadding","modalCloseLegacyGap","footer","modalFooterPaddingTop","modalFooterPaddingBottom","footerWrapper","panel","modalFooterPanelPaddingTop","modalFooterPanelPaddingBottom","modalFooterBg","fixedHeader","modalFixedHeaderPaddingBottom","modalFixedHeaderBg","modalFixedHeaderShadow","fixedFooter","modalFixedFooterShadow","headerAddPadding","bodyWithoutHeader","modalPaddingTop","bodyWithoutPadding","bodyAddPaddingForPanel","modalPaddingBottom","jsStyles"],"mappings":"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","sourcesContent":["import { css, cssName, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { resetButton } from '../../lib/styles/Mixins';\r\n\r\nconst styles = {\r\n  root() {\r\n    return css`\r\n      height: 100%;\r\n      left: 0;\r\n      position: fixed;\r\n      top: 0;\r\n      width: 100%;\r\n    `;\r\n  },\r\n\r\n  bg(t: Theme) {\r\n    return css`\r\n      bottom: 0;\r\n      left: 0;\r\n      position: absolute;\r\n      right: 0;\r\n      top: 0;\r\n      background: ${t.modalBackBg};\r\n      opacity: ${t.modalBackOpacity};\r\n    `;\r\n  },\r\n\r\n  container() {\r\n    return css`\r\n      position: relative;\r\n      white-space: nowrap;\r\n      text-align: center;\r\n      height: 100%;\r\n      overflow-y: auto;\r\n      outline: none;\r\n\r\n      &::before {\r\n        content: '';\r\n        display: inline-block;\r\n        vertical-align: middle;\r\n        height: 80%; /* to vertical align modal 40%/60% of screen height */\r\n      }\r\n    `;\r\n  },\r\n\r\n  window(t: Theme) {\r\n    return css`\r\n      position: relative;\r\n      white-space: normal;\r\n      margin: auto;\r\n      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\r\n      background: ${t.bgDefault};\r\n    `;\r\n  },\r\n\r\n  centerContainer(t: Theme) {\r\n    return css`\r\n      position: relative;\r\n      display: inline-block;\r\n      text-align: left;\r\n      vertical-align: middle;\r\n      box-sizing: border-box;\r\n      z-index: 10;\r\n      margin: 40px 20px;\r\n\r\n      @media screen and (max-width: ${t.modalAdaptiveThreshold}) {\r\n        margin: 0;\r\n        width: 100%;\r\n      }\r\n    `;\r\n  },\r\n\r\n  alignTop(t: Theme) {\r\n    return css`\r\n      ${cssName(styles.centerContainer(t))}& {\r\n        vertical-align: top;\r\n      }\r\n    `;\r\n  },\r\n\r\n  close(t: Theme) {\r\n    const padding = parseInt(t.modalCloseButtonPadding);\r\n    return css`\r\n      ${resetButton()};\r\n      position: absolute;\r\n      display: flex;\r\n      right: ${padding}px;\r\n      top: ${padding}px;\r\n      background: none;\r\n      background: transparent;\r\n      cursor: pointer;\r\n      color: ${t.modalCloseButtonColor};\r\n      text-align: center;\r\n      vertical-align: middle;\r\n      padding: ${t.modalCloseButtonClickArea} !important;\r\n      margin: -${t.modalCloseButtonClickArea} !important;\r\n\r\n      &:focus,\r\n      &:hover {\r\n        color: ${t.modalCloseButtonHoverColor};\r\n      }\r\n\r\n      &:focus {\r\n        outline: 2px solid ${t.borderColorFocus};\r\n      }\r\n\r\n      & > svg {\r\n        width: ${t.modalCloseIconSize};\r\n        height: ${t.modalCloseIconSize};\r\n        box-sizing: content-box;\r\n      }\r\n    `;\r\n  },\r\n\r\n  closeWrapper(t: Theme) {\r\n    const padding = parseInt(t.modalCloseButtonPadding);\r\n    const paddingBottom = parseInt(t.modalCloseButtonBottomPadding);\r\n    const legacyGap = parseInt(t.modalCloseWrapperLegacyGap);\r\n    const legacyShift = parseInt(t.modalCloseButtonLegacyShift);\r\n    const blockSizeX = parseInt(t.modalCloseIconSize) + 2 * padding - legacyShift;\r\n    const blockSizeY = parseInt(t.modalCloseIconSize) + padding + paddingBottom + legacyGap;\r\n    return css`\r\n      position: relative;\r\n      float: right;\r\n      width: ${blockSizeX + legacyGap}px;\r\n      height: ${blockSizeY}px;\r\n    `;\r\n  },\r\n\r\n  disabled(t: Theme) {\r\n    return css`\r\n      ${cssName(styles.close(t))}& {\r\n        pointer-events: none;\r\n        cursor: default;\r\n        color: ${t.modalCloseButtonDisabledColor};\r\n      }\r\n    `;\r\n  },\r\n\r\n  headerWrapper() {\r\n    return css`\r\n      position: relative;\r\n    `;\r\n  },\r\n\r\n  header(t: Theme) {\r\n    return css`\r\n      font-size: ${t.modalHeaderFontSize};\r\n      line-height: ${t.modalHeaderLineHeight};\r\n      padding: ${t.modalHeaderPaddingTop} ${t.modalPaddingRight} ${t.modalHeaderPaddingBottom} ${t.modalPaddingLeft};\r\n      overflow-wrap: break-word;\r\n      word-wrap: break-word;\r\n    `;\r\n  },\r\n\r\n  body(t: Theme) {\r\n    return css`\r\n      padding: 0 ${t.modalPaddingRight} ${t.modalBodyPaddingBottom} ${t.modalPaddingLeft};\r\n    `;\r\n  },\r\n\r\n  headerWithClose(t: Theme) {\r\n    const rightPadding =\r\n      2 * parseInt(t.modalCloseButtonPadding) + parseInt(t.modalCloseIconSize) + parseInt(t.modalCloseLegacyGap);\r\n\r\n    return css`\r\n      padding-right: ${rightPadding}px;\r\n    `;\r\n  },\r\n\r\n  footer(t: Theme) {\r\n    return css`\r\n      padding: ${t.modalFooterPaddingTop} ${t.modalPaddingRight} ${t.modalFooterPaddingBottom} ${t.modalPaddingLeft};\r\n    `;\r\n  },\r\n\r\n  footerWrapper() {\r\n    return css`\r\n      position: relative;\r\n    `;\r\n  },\r\n\r\n  panel(t: Theme) {\r\n    return css`\r\n      ${cssName(styles.footer(t))}& {\r\n        padding-top: ${t.modalFooterPanelPaddingTop} !important;\r\n        padding-bottom: ${t.modalFooterPanelPaddingBottom} !important;\r\n        background: ${t.modalFooterBg} !important;\r\n      }\r\n    `;\r\n  },\r\n\r\n  fixedHeader(t: Theme) {\r\n    return css`\r\n      margin-bottom: 10px;\r\n      padding-bottom: ${t.modalFixedHeaderPaddingBottom};\r\n      background: ${t.modalFixedHeaderBg};\r\n\r\n      &:after {\r\n        bottom: 11px;\r\n        content: '';\r\n        position: absolute;\r\n        height: 1px;\r\n        width: 100%;\r\n        left: 0;\r\n        z-index: -1;\r\n        box-shadow: ${t.modalFixedHeaderShadow};\r\n      }\r\n    `;\r\n  },\r\n\r\n  fixedFooter(t: Theme) {\r\n    return css`\r\n      ${cssName(styles.footer(t))}& {\r\n        padding-top: 20px;\r\n        margin-top: 10px;\r\n        background: ${t.modalFixedHeaderBg};\r\n      }\r\n\r\n      &:before {\r\n        top: 11px;\r\n        content: '';\r\n        position: absolute;\r\n        height: 1px;\r\n        width: 100%;\r\n        left: 0;\r\n        z-index: -1;\r\n        box-shadow: ${t.modalFixedFooterShadow};\r\n      }\r\n    `;\r\n  },\r\n\r\n  headerAddPadding() {\r\n    return css`\r\n      padding-bottom: 22px;\r\n    `;\r\n  },\r\n\r\n  bodyWithoutHeader(t: Theme) {\r\n    return css`\r\n      padding-top: ${t.modalPaddingTop} !important;\r\n    `;\r\n  },\r\n\r\n  bodyWithoutPadding() {\r\n    return css`\r\n      padding: 0 !important;\r\n    `;\r\n  },\r\n\r\n  bodyAddPaddingForPanel(t: Theme) {\r\n    return css`\r\n      padding-bottom: ${t.modalPaddingBottom};\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["Modal.styles.ts"],"names":["styles","root","css","bg","t","modalBackBg","modalBackOpacity","container","window","modalBg","mobileWindow","centerContainer","mobileCenterContainer","alignTop","close","padding","parseInt","modalCloseButtonPadding","modalCloseButtonColor","modalCloseButtonClickArea","modalCloseButtonHoverColor","modalCloseIconSize","mobileClose","mobileModalCloseButtonRightPadding","mobileModalCloseButtonTopPadding","mobileModalHeaderPadding","mobileModalCloseButtonClickArea","mobileModalCloseIconSize","mobileCloseWithoutHeader","closeWrapper","paddingBottom","modalCloseButtonBottomPadding","legacyGap","modalCloseWrapperLegacyGap","legacyShift","modalCloseButtonLegacyShift","blockSizeX","blockSizeY","mobileCloseWrapper","size","bgDefault","disabled","modalCloseButtonDisabledColor","focus","borderColorFocus","headerWrapper","header","modalHeaderFontSize","modalHeaderLineHeight","modalHeaderPaddingTop","modalPaddingRight","modalHeaderPaddingBottom","modalPaddingLeft","modalHeaderTextColor","mobileHeader","mobileModalHeaderFontSize","mobileModalHeaderLineHeight","body","modalBodyPaddingBottom","modalBodyTextColor","mobileBody","mobileModalBodyPadding","mobileModalBodyFontSize","headerWithClose","rightPadding","modalCloseLegacyGap","mobileHeaderWithClose","footer","modalFooterPaddingTop","modalFooterPaddingBottom","modalFooterTextColor","mobileFooter","mobileModalFooterPadding","footerWrapper","panel","modalFooterPanelPaddingTop","modalFooterPanelPaddingBottom","modalFooterBg","fixedHeader","modalFixedHeaderPaddingBottom","modalFixedHeaderBg","modalFixedHeaderShadow","mobileFixedHeader","fixedFooter","modalFixedFooterShadow","headerAddPadding","bodyWithoutHeader","modalPaddingTop","mobileBodyWithoutHeader","bodyWithoutPadding","bodyAddPaddingForPanel","modalPaddingBottom","mobileBodyAddPaddingForPanel","columnFlexContainer"],"mappings":"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","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      height: 100%;\n      left: 0;\n      position: fixed;\n      top: 0;\n      width: 100%;\n    `;\n  },\n\n  bg(t: Theme) {\n    return css`\n      bottom: 0;\n      left: 0;\n      position: absolute;\n      right: 0;\n      top: 0;\n      background: ${t.modalBackBg};\n      opacity: ${t.modalBackOpacity};\n    `;\n  },\n\n  container() {\n    return css`\n      position: relative;\n      white-space: nowrap;\n      text-align: center;\n      height: 100%;\n      overflow-y: auto;\n      outline: none;\n\n      &::before {\n        content: '';\n        display: inline-block;\n        vertical-align: middle;\n        height: 80%; /* to vertical align modal 40%/60% of screen height */\n      }\n    `;\n  },\n\n  window(t: Theme) {\n    return css`\n      position: relative;\n      white-space: normal;\n      margin: auto;\n      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\n      background: ${t.modalBg};\n    `;\n  },\n\n  mobileWindow() {\n    return css`\n      width: 100%;\n      height: 100%;\n      overflow: auto;\n    `;\n  },\n\n  centerContainer(t: Theme) {\n    return css`\n      position: relative;\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n      box-sizing: border-box;\n      z-index: 10;\n      margin: 40px 20px;\n    `;\n  },\n\n  mobileCenterContainer() {\n    return css`\n      margin: 0;\n      width: 100%;\n      height: 100%;\n    `;\n  },\n\n  alignTop() {\n    return css`\n      vertical-align: top;\n    `;\n  },\n\n  close(t: Theme) {\n    const padding = parseInt(t.modalCloseButtonPadding);\n    return css`\n      ${resetButton()};\n      position: absolute;\n      display: flex;\n      right: ${padding}px;\n      top: ${padding}px;\n      background: none;\n      background: transparent;\n      cursor: pointer;\n      color: ${t.modalCloseButtonColor};\n      text-align: center;\n      vertical-align: middle;\n      padding: ${t.modalCloseButtonClickArea};\n      margin: -${t.modalCloseButtonClickArea};\n\n      &:hover {\n        color: ${t.modalCloseButtonHoverColor};\n      }\n\n      & > svg {\n        width: ${t.modalCloseIconSize};\n        height: ${t.modalCloseIconSize};\n        box-sizing: content-box;\n      }\n    `;\n  },\n\n  mobileClose(t: Theme) {\n    return css`\n      right: ${t.mobileModalCloseButtonRightPadding};\n      top: ${parseInt(t.mobileModalCloseButtonTopPadding) + parseInt(t.mobileModalHeaderPadding)}px;\n      padding: ${t.mobileModalCloseButtonClickArea};\n      margin: -${t.mobileModalCloseButtonClickArea};\n\n      & > svg {\n        width: ${t.mobileModalCloseIconSize};\n        height: ${t.mobileModalCloseIconSize};\n      }\n    `;\n  },\n\n  mobileCloseWithoutHeader() {\n    return css`\n      position: static;\n    `;\n  },\n\n  closeWrapper(t: Theme) {\n    const padding = parseInt(t.modalCloseButtonPadding);\n    const paddingBottom = parseInt(t.modalCloseButtonBottomPadding);\n    const legacyGap = parseInt(t.modalCloseWrapperLegacyGap);\n    const legacyShift = parseInt(t.modalCloseButtonLegacyShift);\n    const blockSizeX = parseInt(t.modalCloseIconSize) + 2 * padding - legacyShift;\n    const blockSizeY = parseInt(t.modalCloseIconSize) + padding + paddingBottom + legacyGap;\n    return css`\n      position: relative;\n      float: right;\n      width: ${blockSizeX + legacyGap}px;\n      height: ${blockSizeY}px;\n    `;\n  },\n\n  mobileCloseWrapper(t: Theme) {\n    const size = parseInt(t.mobileModalCloseIconSize) + parseInt(t.mobileModalCloseButtonClickArea) * 2;\n\n    return css`\n      position: absolute;\n      right: ${t.mobileModalCloseButtonRightPadding};\n      top: ${t.mobileModalCloseButtonTopPadding};\n      padding: 0px;\n      margin: 0px;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      width: ${size}px;\n      height: ${size}px;\n      background: radial-gradient(50% 50% at 50% 50%, ${t.bgDefault} 60%, rgba(255, 255, 255, 0) 100%);\n      border-radius: ${size}px;\n    `;\n  },\n\n  disabled(t: Theme) {\n    return css`\n      pointer-events: none;\n      cursor: default;\n      color: ${t.modalCloseButtonDisabledColor};\n    `;\n  },\n\n  focus(t: Theme) {\n    return css`\n      color: ${t.modalCloseButtonHoverColor};\n      outline: 2px solid ${t.borderColorFocus};\n    `;\n  },\n\n  headerWrapper() {\n    return css`\n      position: relative;\n    `;\n  },\n\n  header(t: Theme) {\n    return css`\n      font-size: ${t.modalHeaderFontSize};\n      line-height: ${t.modalHeaderLineHeight};\n      padding: ${t.modalHeaderPaddingTop} ${t.modalPaddingRight} ${t.modalHeaderPaddingBottom} ${t.modalPaddingLeft};\n      overflow-wrap: break-word;\n      word-wrap: break-word;\n      color: ${t.modalHeaderTextColor};\n    `;\n  },\n\n  mobileHeader(t: Theme) {\n    return css`\n      font-size: ${t.mobileModalHeaderFontSize};\n      line-height: ${t.mobileModalHeaderLineHeight};\n      padding: ${t.mobileModalHeaderPadding};\n    `;\n  },\n\n  body(t: Theme) {\n    return css`\n      padding: 0 ${t.modalPaddingRight} ${t.modalBodyPaddingBottom} ${t.modalPaddingLeft};\n      color: ${t.modalBodyTextColor};\n    `;\n  },\n\n  mobileBody(t: Theme) {\n    return css`\n      padding: ${t.mobileModalBodyPadding};\n      padding-top: 0px;\n      display: flex;\n      flex-flow: column;\n      flex: 1;\n      font-size: ${t.mobileModalBodyFontSize};\n    `;\n  },\n\n  headerWithClose(t: Theme) {\n    const rightPadding =\n      2 * parseInt(t.modalCloseButtonPadding) + parseInt(t.modalCloseIconSize) + parseInt(t.modalCloseLegacyGap);\n\n    return css`\n      padding-right: ${rightPadding}px;\n    `;\n  },\n\n  mobileHeaderWithClose(t: Theme) {\n    return css`\n      padding-right: ${2 * parseInt(t.mobileModalCloseButtonRightPadding) + parseInt(t.mobileModalCloseIconSize)}px;\n    `;\n  },\n\n  footer(t: Theme) {\n    return css`\n      padding: ${t.modalFooterPaddingTop} ${t.modalPaddingRight} ${t.modalFooterPaddingBottom} ${t.modalPaddingLeft};\n      color: ${t.modalFooterTextColor};\n    `;\n  },\n\n  mobileFooter(t: Theme) {\n    return css`\n      padding: ${t.mobileModalFooterPadding};\n    `;\n  },\n\n  footerWrapper() {\n    return css`\n      position: relative;\n    `;\n  },\n\n  panel(t: Theme) {\n    return css`\n      padding-top: ${t.modalFooterPanelPaddingTop};\n      padding-bottom: ${t.modalFooterPanelPaddingBottom};\n      background: ${t.modalFooterBg};\n    `;\n  },\n\n  fixedHeader(t: Theme) {\n    return css`\n      margin-bottom: 10px;\n      padding-bottom: ${t.modalFixedHeaderPaddingBottom};\n      background: ${t.modalFixedHeaderBg};\n\n      &:after {\n        bottom: 11px;\n        content: '';\n        position: absolute;\n        height: 1px;\n        width: 100%;\n        left: 0;\n        z-index: -1;\n        box-shadow: ${t.modalFixedHeaderShadow};\n      }\n    `;\n  },\n\n  mobileFixedHeader(t: Theme) {\n    return css`\n      padding-bottom: ${t.mobileModalHeaderPadding};\n    `;\n  },\n\n  fixedFooter(t: Theme) {\n    return css`\n      padding-top: 20px;\n      margin-top: 10px;\n      background: ${t.modalFixedHeaderBg};\n\n      &:before {\n        top: 11px;\n        content: '';\n        position: absolute;\n        height: 1px;\n        width: 100%;\n        left: 0;\n        z-index: -1;\n        box-shadow: ${t.modalFixedFooterShadow};\n      }\n    `;\n  },\n\n  headerAddPadding() {\n    return css`\n      padding-bottom: 22px;\n    `;\n  },\n\n  bodyWithoutHeader(t: Theme) {\n    return css`\n      padding-top: ${t.modalPaddingTop};\n    `;\n  },\n\n  mobileBodyWithoutHeader(t: Theme) {\n    return css`\n      padding-top: 0px;\n    `;\n  },\n\n  bodyWithoutPadding() {\n    return css`\n      padding: 0;\n    `;\n  },\n\n  bodyAddPaddingForPanel(t: Theme) {\n    return css`\n      padding-bottom: ${t.modalPaddingBottom};\n    `;\n  },\n\n  mobileBodyAddPaddingForPanel(t: Theme) {\n    return css`\n      padding-bottom: ${t.mobileModalBodyPadding};\n    `;\n  },\n\n  columnFlexContainer() {\n    return css`\n      height: 100%;\n      display: flex;\n      flex-flow: column;\n      overflow-y: scroll;\n    `;\n  },\n});\n"]}

package/cjs/components/Modal/ModalBody.d.ts

@@ -15,6 +15,8 @@ export declare class ModalBody extends React.Component<ModalBodyProps> {
     static __KONTUR_REACT_UI__: string;
     static __MODAL_BODY__: boolean;
     private theme;
+    private isMobileLayout;
     render(): JSX.Element;
+    private handleResize;
     renderMain(): JSX.Element;
 }

package/cjs/components/Modal/ModalBody.js

@@ -1,13 +1,16 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ModalBody = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");exports.__esModule = true;exports.ModalBody = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 var _ZIndex = require("../../internal/ZIndex");
 var _CommonWrapper = require("../../internal/CommonWrapper");
+var _Emotion = require("../../lib/theming/Emotion");
+var _ResponsiveLayout = require("../ResponsiveLayout");
+var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
+var _ResizeDetector = require("../../internal/ResizeDetector");
 
 var _ModalContext = require("./ModalContext");
-var _Modal = require("./Modal.styles");
+var _Modal = require("./Modal.styles");var _class, _class2, _temp;
 
 
 
@@ -16,43 +19,55 @@ var _Modal = require("./Modal.styles");
 
 
 
-/**
- * Контейнер с отступами от края модалки
- *
- * @visibleName Modal.Body
+/**
+ * Контейнер с отступами от края модалки
+ *
+ * @visibleName Modal.Body
  */var
-ModalBody = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ModalBody, _React$Component);function ModalBody() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+ModalBody = (0, _ResponsiveLayout.responsiveLayout)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(ModalBody, _React$Component);function ModalBody() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+
+
+    theme = void 0;_this.
+    isMobileLayout = void 0;_this.
+
+
 
 
 
-    theme = void 0;return _this;}var _proto = ModalBody.prototype;_proto.
 
-  render = function render() {var _this2 = this;
-    return /*#__PURE__*/(
-      _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null,
-      function (theme) {
-        _this2.theme = theme;
-        return _this2.renderMain();
-      }));
 
 
-  };_proto.
+
+
+
+
+    handleResize = function (event) {
+      LayoutEvents.emit();
+    };return _this;}var _proto = ModalBody.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.
 
   renderMain = function renderMain() {var _this3 = this;var
     noPadding = this.props.noPadding;
     return /*#__PURE__*/(
       _react.default.createElement(_ModalContext.ModalContext.Consumer, null,
-      function (_ref) {var _cn;var additionalPadding = _ref.additionalPadding,hasHeader = _ref.hasHeader;return /*#__PURE__*/(
+      function (_ref) {var _cx;var additionalPadding = _ref.additionalPadding,hasHeader = _ref.hasHeader;return /*#__PURE__*/(
           _react.default.createElement(_CommonWrapper.CommonWrapper, _this3.props, /*#__PURE__*/
           _react.default.createElement(_ZIndex.ZIndex, {
             priority: 'ModalBody',
             createStackingContext: true,
-            className: (0, _classnames.default)((_cn = {}, _cn[
-            _Modal.jsStyles.body(_this3.theme)] = true, _cn[
-            _Modal.jsStyles.bodyWithoutHeader(_this3.theme)] = !hasHeader, _cn[
-            _Modal.jsStyles.bodyAddPaddingForPanel(_this3.theme)] = additionalPadding, _cn[
-            _Modal.jsStyles.bodyWithoutPadding()] = noPadding, _cn)) },
+            className: (0, _Emotion.cx)((_cx = {}, _cx[
+            _Modal.styles.body(_this3.theme)] = true, _cx[
+            _Modal.styles.mobileBody(_this3.theme)] = _this3.isMobileLayout, _cx[
+            _Modal.styles.bodyWithoutHeader(_this3.theme)] = !hasHeader, _cx[
+            _Modal.styles.mobileBodyWithoutHeader(_this3.theme)] = !hasHeader && _this3.isMobileLayout, _cx[
+            _Modal.styles.bodyAddPaddingForPanel(_this3.theme)] = additionalPadding, _cx[
+            _Modal.styles.mobileBodyAddPaddingForPanel(_this3.theme)] = additionalPadding && _this3.isMobileLayout, _cx[
+            _Modal.styles.bodyWithoutPadding()] = noPadding, _cx)) },
+
 
+          _this3.isMobileLayout ? /*#__PURE__*/
+          _react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: _this3.handleResize }, _this3.props.children) :
 
           _this3.props.children)));}));
 
@@ -60,4 +75,5 @@ ModalBody = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.defaul
 
 
 
-  };return ModalBody;}(_react.default.Component);exports.ModalBody = ModalBody;ModalBody.__KONTUR_REACT_UI__ = 'ModalBody';ModalBody.__MODAL_BODY__ = true;
+
+  };return ModalBody;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'ModalBody', _class2.__MODAL_BODY__ = true, _temp)) || _class;exports.ModalBody = ModalBody;

package/cjs/components/Modal/ModalBody.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ModalBody.tsx"],"names":["ModalBody","theme","render","renderMain","noPadding","props","additionalPadding","hasHeader","jsStyles","body","bodyWithoutHeader","bodyAddPaddingForPanel","bodyWithoutPadding","children","React","Component","__KONTUR_REACT_UI__","__MODAL_BODY__"],"mappings":"qPAAA;AACA;;AAEA;;AAEA;AACA;;AAEA;AACA;;;;;;;;;AASA;AACA;AACA;AACA;AACA,G;AACaA,S;;;;AAIHC,IAAAA,K;;AAEDC,EAAAA,M,GAAP,kBAAgB;AACd;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,gBAAAD,KAAK,EAAI;AACR,QAAA,MAAI,CAACA,KAAL,GAAaA,KAAb;AACA,eAAO,MAAI,CAACE,UAAL,EAAP;AACD,OAJH,CADF;;;AAQD,G;;AAEMA,EAAAA,U,GAAP,sBAAiC;AACvBC,IAAAA,SADuB,GACT,KAAKC,KADI,CACvBD,SADuB;AAE/B;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,mCAAGE,iBAAH,QAAGA,iBAAH,CAAsBC,SAAtB,QAAsBA,SAAtB;AACC,uCAAC,4BAAD,EAAmB,MAAI,CAACF,KAAxB;AACE,uCAAC,cAAD;AACE,YAAA,QAAQ,EAAE,WADZ;AAEE,YAAA,qBAAqB,MAFvB;AAGE,YAAA,SAAS,EAAE;AACRG,4BAASC,IAAT,CAAc,MAAI,CAACR,KAAnB,CADQ,IACoB,IADpB;AAERO,4BAASE,iBAAT,CAA2B,MAAI,CAACT,KAAhC,CAFQ,IAEiC,CAACM,SAFlC;AAGRC,4BAASG,sBAAT,CAAgC,MAAI,CAACV,KAArC,CAHQ,IAGsCK,iBAHtC;AAIRE,4BAASI,kBAAT,EAJQ,IAIwBR,SAJxB,OAHb;;;AAUG,UAAA,MAAI,CAACC,KAAL,CAAWQ,QAVd,CADF,CADD,GADH,CADF;;;;;;AAoBD,G,oBAvC4BC,eAAMC,S,gCAAxBf,S,CACGgB,mB,GAAsB,W,CADzBhB,S,CAEGiB,c,GAAiB,I","sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\r\n\r\nimport { ModalContext } from './ModalContext';\r\nimport { jsStyles } from './Modal.styles';\r\n\r\nexport interface ModalBodyProps extends CommonProps {\r\n  /**\r\n   * убирает отступы\r\n   */\r\n  noPadding?: boolean;\r\n}\r\n\r\n/**\r\n * Контейнер с отступами от края модалки\r\n *\r\n * @visibleName Modal.Body\r\n */\r\nexport class ModalBody extends React.Component<ModalBodyProps> {\r\n  public static __KONTUR_REACT_UI__ = 'ModalBody';\r\n  public static __MODAL_BODY__ = true;\r\n\r\n  private theme!: Theme;\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return this.renderMain();\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  public renderMain(): JSX.Element {\r\n    const { noPadding } = this.props;\r\n    return (\r\n      <ModalContext.Consumer>\r\n        {({ additionalPadding, hasHeader }) => (\r\n          <CommonWrapper {...this.props}>\r\n            <ZIndex\r\n              priority={'ModalBody'}\r\n              createStackingContext\r\n              className={cn({\r\n                [jsStyles.body(this.theme)]: true,\r\n                [jsStyles.bodyWithoutHeader(this.theme)]: !hasHeader,\r\n                [jsStyles.bodyAddPaddingForPanel(this.theme)]: additionalPadding,\r\n                [jsStyles.bodyWithoutPadding()]: noPadding,\r\n              })}\r\n            >\r\n              {this.props.children}\r\n            </ZIndex>\r\n          </CommonWrapper>\r\n        )}\r\n      </ModalContext.Consumer>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"sources":["ModalBody.tsx"],"names":["ModalBody","responsiveLayout","theme","isMobileLayout","handleResize","event","LayoutEvents","emit","render","renderMain","noPadding","props","additionalPadding","hasHeader","styles","body","mobileBody","bodyWithoutHeader","mobileBodyWithoutHeader","bodyAddPaddingForPanel","mobileBodyAddPaddingForPanel","bodyWithoutPadding","children","React","Component","__KONTUR_REACT_UI__","__MODAL_BODY__"],"mappings":"4UAAA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,uC;;;;;;;;;AASA;AACA;AACA;AACA;AACA,G;;AAEaA,S,OADZC,kC;;;;AAKSC,IAAAA,K;AACAC,IAAAA,c;;;;;;;;;;;;;AAaAC,IAAAA,Y,GAAe,UAACC,KAAD,EAAoB;AACzCC,MAAAA,YAAY,CAACC,IAAb;AACD,K,uDAbMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACN,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACO,UAAL,EAAP,CACD,CAJH,CADF,CAQD,C;;AAMMA,EAAAA,U,GAAP,sBAAiC;AACvBC,IAAAA,SADuB,GACT,KAAKC,KADI,CACvBD,SADuB;AAE/B;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,mCAAGE,iBAAH,QAAGA,iBAAH,CAAsBC,SAAtB,QAAsBA,SAAtB;AACC,uCAAC,4BAAD,EAAmB,MAAI,CAACF,KAAxB;AACE,uCAAC,cAAD;AACE,YAAA,QAAQ,EAAE,WADZ;AAEE,YAAA,qBAAqB,MAFvB;AAGE,YAAA,SAAS,EAAE;AACRG,0BAAOC,IAAP,CAAY,MAAI,CAACb,KAAjB,CADQ,IACkB,IADlB;AAERY,0BAAOE,UAAP,CAAkB,MAAI,CAACd,KAAvB,CAFQ,IAEwB,MAAI,CAACC,cAF7B;AAGRW,0BAAOG,iBAAP,CAAyB,MAAI,CAACf,KAA9B,CAHQ,IAG+B,CAACW,SAHhC;AAIRC,0BAAOI,uBAAP,CAA+B,MAAI,CAAChB,KAApC,CAJQ,IAIqC,CAACW,SAAD,IAAc,MAAI,CAACV,cAJxD;AAKRW,0BAAOK,sBAAP,CAA8B,MAAI,CAACjB,KAAnC,CALQ,IAKoCU,iBALpC;AAMRE,0BAAOM,4BAAP,CAAoC,MAAI,CAAClB,KAAzC,CANQ,IAM0CU,iBAAiB,IAAI,MAAI,CAACT,cANpE;AAORW,0BAAOO,kBAAP,EAPQ,IAOsBX,SAPtB,OAHb;;;AAaG,UAAA,MAAI,CAACP,cAAL;AACC,uCAAC,8BAAD,IAAgB,QAAQ,EAAE,MAAI,CAACC,YAA/B,IAA8C,MAAI,CAACO,KAAL,CAAWW,QAAzD,CADD;;AAGC,UAAA,MAAI,CAACX,KAAL,CAAWW,QAhBf,CADF,CADD,GADH,CADF;;;;;;;AA2BD,G,oBAnD4BC,eAAMC,S,WACrBC,mB,GAAsB,W,UACtBC,c,GAAiB,I","sourcesContent":["import React from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { responsiveLayout } from '../ResponsiveLayout';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\n\nimport { ModalContext } from './ModalContext';\nimport { styles } from './Modal.styles';\n\nexport interface ModalBodyProps extends CommonProps {\n  /**\n   * убирает отступы\n   */\n  noPadding?: boolean;\n}\n\n/**\n * Контейнер с отступами от края модалки\n *\n * @visibleName Modal.Body\n */\n@responsiveLayout\nexport class ModalBody extends React.Component<ModalBodyProps> {\n  public static __KONTUR_REACT_UI__ = 'ModalBody';\n  public static __MODAL_BODY__ = true;\n\n  private theme!: Theme;\n  private isMobileLayout!: boolean;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private handleResize = (event: UIEvent) => {\n    LayoutEvents.emit();\n  };\n\n  public renderMain(): JSX.Element {\n    const { noPadding } = this.props;\n    return (\n      <ModalContext.Consumer>\n        {({ additionalPadding, hasHeader }) => (\n          <CommonWrapper {...this.props}>\n            <ZIndex\n              priority={'ModalBody'}\n              createStackingContext\n              className={cx({\n                [styles.body(this.theme)]: true,\n                [styles.mobileBody(this.theme)]: this.isMobileLayout,\n                [styles.bodyWithoutHeader(this.theme)]: !hasHeader,\n                [styles.mobileBodyWithoutHeader(this.theme)]: !hasHeader && this.isMobileLayout,\n                [styles.bodyAddPaddingForPanel(this.theme)]: additionalPadding,\n                [styles.mobileBodyAddPaddingForPanel(this.theme)]: additionalPadding && this.isMobileLayout,\n                [styles.bodyWithoutPadding()]: noPadding,\n              })}\n            >\n              {this.isMobileLayout ? (\n                <ResizeDetector onResize={this.handleResize}>{this.props.children}</ResizeDetector>\n              ) : (\n                this.props.children\n              )}\n            </ZIndex>\n          </CommonWrapper>\n        )}\n      </ModalContext.Consumer>\n    );\n  }\n}\n"]}

package/cjs/components/Modal/ModalClose.d.ts

@@ -1,2 +1,2 @@
 import { CloseProps } from './ModalContext';
-export declare function ModalClose({ disableClose, requestClose }: CloseProps): JSX.Element;
+export declare function ModalClose({ disableClose, requestClose, ...otherProps }: CloseProps): JSX.Element;