@skbkontur/react-ui 0.0.0-6a047cca2c → 0.0.0-6fbd9fadb2

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

@@ -1,35 +1,40 @@
-"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").default;exports.__esModule = true;exports.modalGlobalClasses = exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
 
-var _Mixins = require("../../lib/styles/Mixins");function _templateObject22() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "]);_templateObject22 = function _templateObject22() {return data;};return data;}function _templateObject21() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 !important;\n    "]);_templateObject21 = function _templateObject21() {return data;};return data;}function _templateObject20() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", " !important;\n    "]);_templateObject20 = function _templateObject20() {return data;};return data;}function _templateObject19() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: 22px;\n    "]);_templateObject19 = function _templateObject19() {return data;};return data;}function _templateObject18() {var data = (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    "]);_templateObject18 = function _templateObject18() {return data;};return data;}function _templateObject17() {var data = (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    "]);_templateObject17 = function _templateObject17() {return data;};return data;}function _templateObject16() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        padding-top: ", " !important;\n        padding-bottom: ", " !important;\n        background: ", " !important;\n      }\n    "]);_templateObject16 = function _templateObject16() {return data;};return data;}function _templateObject15() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "]);_templateObject15 = function _templateObject15() {return data;};return data;}function _templateObject14() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", " ", " ", ";\n    "]);_templateObject14 = function _templateObject14() {return data;};return data;}function _templateObject13() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "]);_templateObject13 = function _templateObject13() {return data;};return data;}function _templateObject12() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 ", " ", " ", ";\n    "]);_templateObject12 = function _templateObject12() {return data;};return data;}function _templateObject11() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", " ", " ", " ", ";\n      overflow-wrap: break-word;\n      word-wrap: break-word;\n    "]);_templateObject11 = function _templateObject11() {return data;};return data;}function _templateObject10() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "]);_templateObject10 = function _templateObject10() {return data;};return data;}function _templateObject9() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        pointer-events: none;\n        cursor: default;\n        color: ", ";\n      }\n    "]);_templateObject9 = function _templateObject9() {return data;};return data;}function _templateObject8() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      float: right;\n      width: ", "px;\n      height: ", "px;\n    "]);_templateObject8 = function _templateObject8() {return data;};return data;}function _templateObject7() {var data = (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    "]);_templateObject7 = function _templateObject7() {return data;};return data;}function _templateObject6() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", "& {\n        vertical-align: top;\n      }\n    "]);_templateObject6 = function _templateObject6() {return data;};return data;}function _templateObject5() {var data = (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    "]);_templateObject5 = function _templateObject5() {return data;};return data;}function _templateObject4() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      white-space: normal;\n      margin: auto;\n      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);\n      background: ", ";\n    "]);_templateObject4 = function _templateObject4() {return data;};return data;}function _templateObject3() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\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    "]);_templateObject3 = function _templateObject3() {return data;};return data;}function _templateObject2() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      bottom: 0;\n      left: 0;\n      position: absolute;\n      right: 0;\n      top: 0;\n      background: ", ";\n      opacity: ", ";\n    "]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 100%;\n      left: 0;\n      position: fixed;\n      top: 0;\n      width: 100%;\n    "]);_templateObject = function _templateObject() {return data;};return data;}
+var _Emotion = require("../../lib/theming/Emotion");
 
-var styles = {
-  root: function root() {
-    return (0, _Emotion.css)(_templateObject());
+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, _templateObject37, _templateObject38, _templateObject39;
 
+var modalGlobalClasses = (0, _Emotion.prefix)('modal')({
+  root: 'root',
+  container: 'container' });exports.modalGlobalClasses = modalGlobalClasses;
 
 
+var getStyles = function getStyles(emotion) {return (
+    (0, _Emotion.memoizeStyle)({
+      root: function root() {
+        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 100%;\n      left: 0;\n      position: fixed;\n      top: 0;\n      width: 100%;\n    "])));
 
 
 
-  },
 
-  bg: function bg(t) {
-    return (0, _Emotion.css)(_templateObject2(),
 
 
+      },
 
+      bg: function bg(t) {
+        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      bottom: 0;\n      left: 0;\n      position: absolute;\n      right: 0;\n      top: 0;\n      background: ", ";\n      opacity: ", ";\n    "])),
 
 
-    t.modalBackBg,
-    t.modalBackOpacity);
 
-  },
 
-  container: function container() {
-    return (0, _Emotion.css)(_templateObject3());
 
+        t.modalBackBg,
+        t.modalBackOpacity);
 
+      },
 
+      container: function container() {
+        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\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    "])));
 
 
 
@@ -41,218 +46,359 @@ var styles = {
 
 
 
-  },
 
-  window: function window(t) {
-    return (0, _Emotion.css)(_templateObject4(),
 
 
+      },
 
+      containerMobile: function containerMobile(t) {
+        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: ", ";\n      margin-top: ", ";\n      margin-right: ", ";\n      margin-bottom: ", ";\n      margin-left: ", ";\n    "])),
+        t.mobileModalContainerHeight,
+        t.mobileModalContainerMarginTop,
+        t.mobileModalContainerMarginRight,
+        t.mobileModalContainerMarginBottom,
+        t.mobileModalContainerMarginLeft);
 
-    t.bgDefault);
+      },
 
-  },
+      window: function window(t) {
+        return emotion.css(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      white-space: normal;\n      margin: auto;\n      box-shadow: ", ";\n      background: ", ";\n      border-radius: ", ";\n    "])),
 
-  centerContainer: function centerContainer(t) {
-    return (0, _Emotion.css)(_templateObject5(),
 
 
+        t.modalWindowShadow,
+        t.modalBg,
+        t.modalBorderRadius);
 
+      },
 
+      mobileWindow: function mobileWindow() {
+        return emotion.css(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 100%;\n      height: 100%;\n      overflow: auto;\n    "])));
 
 
 
 
-    t.modalAdaptiveThreshold);
+      },
 
+      centerContainer: function centerContainer() {
+        return emotion.css(_templateObject7 || (_templateObject7 = (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    "])));
 
 
 
-  },
 
-  alignTop: function alignTop(t) {
-    return (0, _Emotion.css)(_templateObject6(),
-    (0, _Emotion.cssName)(styles.centerContainer(t)));
 
 
 
-  },
 
-  close: function close(t) {
-    var padding = parseInt(t.modalCloseButtonPadding);
-    return (0, _Emotion.css)(_templateObject7(),
-    (0, _Mixins.resetButton)(),
+      },
 
+      mobileCenterContainer: function mobileCenterContainer() {
+        return emotion.css(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: 0;\n      width: 100%;\n      height: 100%;\n    "])));
 
-    padding,
-    padding,
 
 
 
-    t.modalCloseButtonColor,
+      },
 
+      alignTop: function alignTop() {
+        return emotion.css(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      vertical-align: top;\n    "])));
 
-    t.modalCloseButtonClickArea,
-    t.modalCloseButtonClickArea,
 
+      },
 
+      close: function close(t) {
+        var padding = parseInt(t.modalCloseButtonPadding);
+        return emotion.css(_templateObject10 || (_templateObject10 = (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)(emotion),
 
-    t.modalCloseButtonHoverColor,
 
+        padding,
+        padding,
 
 
-    t.borderColorFocus,
 
+        t.modalCloseButtonColor,
 
 
-    t.modalCloseIconSize,
-    t.modalCloseIconSize);
+        t.modalCloseButtonClickArea,
+        t.modalCloseButtonClickArea,
 
 
+        t.modalCloseButtonHoverColor,
 
-  },
 
-  closeWrapper: function closeWrapper(t) {
-    var padding = parseInt(t.modalCloseButtonPadding);
-    var paddingBottom = parseInt(t.modalCloseButtonBottomPadding);
-    var legacyGap = parseInt(t.modalCloseWrapperLegacyGap);
-    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(),
 
+        t.modalCloseIconSize,
+        t.modalCloseIconSize);
 
-    blockSizeX + legacyGap,
-    blockSizeY);
 
-  },
 
-  disabled: function disabled(t) {
-    return (0, _Emotion.css)(_templateObject9(),
-    (0, _Emotion.cssName)(styles.close(t)),
+      },
 
+      mobileClose: function mobileClose(t) {
+        return emotion.css(_templateObject11 || (_templateObject11 = (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.modalCloseButtonDisabledColor);
 
+        t.mobileModalCloseIconSize,
+        t.mobileModalCloseIconSize);
 
-  },
 
-  headerWrapper: function headerWrapper() {
-    return (0, _Emotion.css)(_templateObject10());
+      },
 
+      mobileCloseWithoutHeader: function mobileCloseWithoutHeader() {
+        return emotion.css(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: static;\n    "])));
 
-  },
 
-  header: function header(t) {
-    return (0, _Emotion.css)(_templateObject11(),
-    t.modalHeaderFontSize,
-    t.modalHeaderLineHeight,
-    t.modalHeaderPaddingTop, t.modalPaddingRight, t.modalHeaderPaddingBottom, t.modalPaddingLeft);
+      },
 
+      closeWrapper: function closeWrapper(t) {
+        var padding = parseInt(t.modalCloseButtonPadding);
+        var paddingBottom = parseInt(t.modalCloseButtonBottomPadding);
+        var legacyGap = parseInt(t.modalCloseWrapperLegacyGap);
+        var legacyShift = parseInt(t.modalCloseButtonLegacyShift);
+        var blockSizeX = parseInt(t.modalCloseIconSize) + 2 * padding - legacyShift;
+        var blockSizeY = parseInt(t.modalCloseIconSize) + padding + paddingBottom + legacyGap;
+        return emotion.css(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      float: right;\n      width: ", "px;\n      height: ", "px;\n    "])),
 
 
-  },
+        blockSizeX + legacyGap,
+        blockSizeY);
 
-  body: function body(t) {
-    return (0, _Emotion.css)(_templateObject12(),
-    t.modalPaddingRight, t.modalBodyPaddingBottom, t.modalPaddingLeft);
+      },
 
-  },
+      mobileCloseWrapper: function mobileCloseWrapper(t) {
+        var size = parseInt(t.mobileModalCloseIconSize) + parseInt(t.mobileModalCloseButtonClickArea) * 2;
 
-  headerWithClose: function headerWithClose(t) {
-    var rightPadding =
-    2 * parseInt(t.modalCloseButtonPadding) + parseInt(t.modalCloseIconSize) + parseInt(t.modalCloseLegacyGap);
+        return emotion.css(_templateObject14 || (_templateObject14 = (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    "])),
 
-    return (0, _Emotion.css)(_templateObject13(),
-    rightPadding);
+        t.mobileModalCloseButtonRightPadding,
+        t.mobileModalCloseButtonTopPadding,
 
-  },
 
-  footer: function footer(t) {
-    return (0, _Emotion.css)(_templateObject14(),
-    t.modalFooterPaddingTop, t.modalPaddingRight, t.modalFooterPaddingBottom, t.modalPaddingLeft);
 
-  },
 
-  footerWrapper: function footerWrapper() {
-    return (0, _Emotion.css)(_templateObject15());
 
+        size,
+        size,
+        t.bgDefault,
+        size);
 
-  },
+      },
 
-  panel: function panel(t) {
-    return (0, _Emotion.css)(_templateObject16(),
-    (0, _Emotion.cssName)(styles.footer(t)),
-    t.modalFooterPanelPaddingTop,
-    t.modalFooterPanelPaddingBottom,
-    t.modalFooterBg);
+      disabled: function disabled(t) {
+        return emotion.css(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      pointer-events: none;\n      cursor: default;\n      color: ", ";\n    "])),
 
 
-  },
+        t.modalCloseButtonDisabledColor);
 
-  fixedHeader: function fixedHeader(t) {
-    return (0, _Emotion.css)(_templateObject17(),
+      },
 
-    t.modalFixedHeaderPaddingBottom,
-    t.modalFixedHeaderBg,
+      focus: function focus(t) {
+        return emotion.css(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      outline: 2px solid ", ";\n    "])),
+        t.modalCloseButtonHoverColor,
+        t.borderColorFocus);
 
+      },
 
+      header: function header(t) {
+        return 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      font-weight: ", ";\n    "])),
+        t.modalHeaderFontSize,
+        t.modalHeaderLineHeight,
+        t.modalHeaderPaddingTop, t.modalPaddingRight, t.modalHeaderPaddingBottom, t.modalPaddingLeft,
 
 
+        t.modalHeaderTextColor,
+        t.modalHeaderFontWeight);
 
+      },
 
+      mobileHeader: function mobileHeader(t) {
+        return emotion.css(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])),
 
+        t.mobileModalHeaderFontSize,
+        t.mobileModalHeaderLineHeight,
+        t.mobileModalHeaderPadding);
 
+      },
 
-    t.modalFixedHeaderShadow);
+      body: function body(t) {
+        return emotion.css(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-radius: ", ";\n      padding-top: ", ";\n      padding-right: ", ";\n      padding-bottom: ", ";\n      padding-left: ", ";\n      color: ", ";\n    "])),
+        t.modalBodyBorderRadius,
+        t.modalBodyPaddingTop,
+        t.modalPaddingRight,
+        t.modalBodyPaddingBottom,
+        t.modalPaddingLeft,
+        t.modalBodyTextColor);
 
+      },
 
-  },
+      mobileBody: function mobileBody(t) {
+        return emotion.css(_templateObject20 || (_templateObject20 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n      display: flex;\n      flex-flow: column;\n      flex: 1;\n      font-size: ", ";\n    "])),
+        t.mobileModalBodyPadding,
 
-  fixedFooter: function fixedFooter(t) {
-    return (0, _Emotion.css)(_templateObject18(),
-    (0, _Emotion.cssName)(styles.footer(t)),
 
 
-    t.modalFixedHeaderBg,
+        t.mobileModalBodyFontSize);
 
+      },
 
+      headerWithClose: function headerWithClose(t) {
+        var rightPadding =
+        2 * parseInt(t.modalCloseButtonPadding) + parseInt(t.modalCloseIconSize) + parseInt(t.modalCloseLegacyGap);
 
+        return emotion.css(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
+        rightPadding);
 
+      },
 
+      mobileHeaderWithClose: function mobileHeaderWithClose(t) {
+        return emotion.css(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
+        2 * parseInt(t.mobileModalCloseButtonRightPadding) + parseInt(t.mobileModalCloseIconSize));
 
+      },
 
+      footer: function footer(t) {
+        return emotion.css(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", " ", " ", ";\n      color: ", ";\n      border-radius: 0 0 ", " ", ";\n    "])),
+        t.modalFooterPaddingTop, t.modalPaddingRight, t.modalFooterPaddingBottom, t.modalPaddingLeft,
+        t.modalFooterTextColor,
+        t.modalBorderRadius, t.modalBorderRadius);
 
+      },
 
+      mobileFooter: function mobileFooter(t) {
+        return emotion.css(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n    "])),
+        t.mobileModalFooterPadding);
 
-    t.modalFixedFooterShadow);
+      },
 
+      panel: function panel(t) {
+        return emotion.css(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      background: ", ";\n    "])),
+        t.modalFooterPanelPaddingTop,
+        t.modalFooterPanelPaddingBottom,
+        t.modalFooterBg);
 
-  },
+      },
 
-  headerAddPadding: function headerAddPadding() {
-    return (0, _Emotion.css)(_templateObject19());
+      fixedHeader: function fixedHeader(t) {
+        return emotion.css(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-bottom: ", ";\n      padding-bottom: ", ";\n      background: ", ";\n      border-bottom: ", ";\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.modalFixedHeaderMarginBottom,
+        t.modalFixedHeaderPaddingBottom,
+        t.modalFixedHeaderBg,
+        t.modalFixedHeaderBorder,
 
 
-  },
 
-  bodyWithoutHeader: function bodyWithoutHeader(t) {
-    return (0, _Emotion.css)(_templateObject20(),
-    t.modalPaddingTop);
 
-  },
 
-  bodyWithoutPadding: function bodyWithoutPadding() {
-    return (0, _Emotion.css)(_templateObject21());
 
 
-  },
 
-  bodyAddPaddingForPanel: function bodyAddPaddingForPanel(t) {
-    return (0, _Emotion.css)(_templateObject22(),
-    t.modalPaddingBottom);
 
-  } };
+        t.modalFixedHeaderShadow);
 
 
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+      },
+
+      mobileFixedHeader: function mobileFixedHeader(t) {
+        return emotion.css(_templateObject27 || (_templateObject27 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+        t.mobileModalHeaderPadding);
+
+      },
+
+      fixedFooter: function fixedFooter(t) {
+        return emotion.css(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n      margin-top: ", ";\n      background: ", ";\n      border-top: ", ";\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.modalFixedFooterPaddingTop,
+        t.modalFixedFooterMarginTop,
+        t.modalFixedHeaderBg,
+        t.modalFixedFooterBorder,
+
+
+
+
+
+
+
+
+
+        t.modalFixedFooterShadow);
+
+
+      },
+
+      fixedPanel: function fixedPanel(t) {
+        return emotion.css(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:before {\n        box-shadow: ", ";\n      }\n    "])),
+
+        t.modalFixedPanelShadow);
+
+
+      },
+
+      headerAddPadding: function headerAddPadding(t) {
+        return emotion.css(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+        t.modalHeaderAdditionalPaddingBottom);
+
+      },
+
+      bodyWithoutHeader: function bodyWithoutHeader(t) {
+        return emotion.css(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n    "])),
+        t.modalPaddingTop);
+
+      },
+
+      mobileBodyWithoutHeader: function mobileBodyWithoutHeader() {
+        return emotion.css(_templateObject32 || (_templateObject32 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: 0px;\n    "])));
+
+
+      },
+
+      bodyWithoutPadding: function bodyWithoutPadding() {
+        return emotion.css(_templateObject33 || (_templateObject33 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0;\n    "])));
+
+
+      },
+
+      bodyAddPaddingForPanel: function bodyAddPaddingForPanel(t) {
+        return emotion.css(_templateObject34 || (_templateObject34 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+        t.modalPaddingBottom);
+
+      },
+
+      mobileBodyAddPaddingForPanel: function mobileBodyAddPaddingForPanel(t) {
+        return emotion.css(_templateObject35 || (_templateObject35 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n    "])),
+        t.mobileModalBodyPadding);
+
+      },
+
+      columnFlexContainer: function columnFlexContainer() {
+        return emotion.css(_templateObject36 || (_templateObject36 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 100%;\n      display: flex;\n      flex-flow: column;\n      overflow-y: auto;\n    "])));
+
+
+
+
+
+      },
+
+      modalSeparatorWrapper: function modalSeparatorWrapper() {
+        return emotion.css(_templateObject37 || (_templateObject37 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      width: 100%;\n    "])));
+
+
+
+      },
+
+      modalSeparator: function modalSeparator(t) {
+        return emotion.css(_templateObject38 || (_templateObject38 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-bottom: ", ";\n      margin: 0 32px;\n      transition: margin 0.3s;\n    "])),
+        t.modalSeparatorBorderBottom);
+
+
+
+      },
+
+      modalSeparatorFixed: function modalSeparatorFixed() {
+        return emotion.css(_templateObject39 || (_templateObject39 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: 0 16px;\n    "])));
+
+
+      } }));};exports.getStyles = getStyles;

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":["modalGlobalClasses","root","container","getStyles","emotion","css","bg","t","modalBackBg","modalBackOpacity","containerMobile","mobileModalContainerHeight","mobileModalContainerMarginTop","mobileModalContainerMarginRight","mobileModalContainerMarginBottom","mobileModalContainerMarginLeft","window","modalWindowShadow","modalBg","modalBorderRadius","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","header","modalHeaderFontSize","modalHeaderLineHeight","modalHeaderPaddingTop","modalPaddingRight","modalHeaderPaddingBottom","modalPaddingLeft","modalHeaderTextColor","modalHeaderFontWeight","mobileHeader","mobileModalHeaderFontSize","mobileModalHeaderLineHeight","body","modalBodyBorderRadius","modalBodyPaddingTop","modalBodyPaddingBottom","modalBodyTextColor","mobileBody","mobileModalBodyPadding","mobileModalBodyFontSize","headerWithClose","rightPadding","modalCloseLegacyGap","mobileHeaderWithClose","footer","modalFooterPaddingTop","modalFooterPaddingBottom","modalFooterTextColor","mobileFooter","mobileModalFooterPadding","panel","modalFooterPanelPaddingTop","modalFooterPanelPaddingBottom","modalFooterBg","fixedHeader","modalFixedHeaderMarginBottom","modalFixedHeaderPaddingBottom","modalFixedHeaderBg","modalFixedHeaderBorder","modalFixedHeaderShadow","mobileFixedHeader","fixedFooter","modalFixedFooterPaddingTop","modalFixedFooterMarginTop","modalFixedFooterBorder","modalFixedFooterShadow","fixedPanel","modalFixedPanelShadow","headerAddPadding","modalHeaderAdditionalPaddingBottom","bodyWithoutHeader","modalPaddingTop","mobileBodyWithoutHeader","bodyWithoutPadding","bodyAddPaddingForPanel","modalPaddingBottom","mobileBodyAddPaddingForPanel","columnFlexContainer","modalSeparatorWrapper","modalSeparator","modalSeparatorBorderBottom","modalSeparatorFixed"],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle, prefix } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const modalGlobalClasses = prefix('modal')({\n  root: 'root',\n  container: 'container',\n});\n\nexport const getStyles = (emotion: Emotion) =>\n  memoizeStyle({\n    root() {\n      return emotion.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 emotion.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 emotion.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    containerMobile(t: Theme) {\n      return emotion.css`\n      height: ${t.mobileModalContainerHeight};\n      margin-top: ${t.mobileModalContainerMarginTop};\n      margin-right: ${t.mobileModalContainerMarginRight};\n      margin-bottom: ${t.mobileModalContainerMarginBottom};\n      margin-left: ${t.mobileModalContainerMarginLeft};\n    `;\n    },\n\n    window(t: Theme) {\n      return emotion.css`\n      position: relative;\n      white-space: normal;\n      margin: auto;\n      box-shadow: ${t.modalWindowShadow};\n      background: ${t.modalBg};\n      border-radius: ${t.modalBorderRadius};\n    `;\n    },\n\n    mobileWindow() {\n      return emotion.css`\n      width: 100%;\n      height: 100%;\n      overflow: auto;\n    `;\n    },\n\n    centerContainer() {\n      return emotion.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 emotion.css`\n      margin: 0;\n      width: 100%;\n      height: 100%;\n    `;\n    },\n\n    alignTop() {\n      return emotion.css`\n      vertical-align: top;\n    `;\n    },\n\n    close(t: Theme) {\n      const padding = parseInt(t.modalCloseButtonPadding);\n      return emotion.css`\n      ${resetButton(emotion)};\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 emotion.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 emotion.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 emotion.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 emotion.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 emotion.css`\n      pointer-events: none;\n      cursor: default;\n      color: ${t.modalCloseButtonDisabledColor};\n    `;\n    },\n\n    focus(t: Theme) {\n      return emotion.css`\n      color: ${t.modalCloseButtonHoverColor};\n      outline: 2px solid ${t.borderColorFocus};\n    `;\n    },\n\n    header(t: Theme) {\n      return emotion.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      font-weight: ${t.modalHeaderFontWeight};\n    `;\n    },\n\n    mobileHeader(t: Theme) {\n      return emotion.css`\n      position: relative;\n      font-size: ${t.mobileModalHeaderFontSize};\n      line-height: ${t.mobileModalHeaderLineHeight};\n      padding: ${t.mobileModalHeaderPadding};\n    `;\n    },\n\n    body(t: Theme) {\n      return emotion.css`\n      border-radius: ${t.modalBodyBorderRadius};\n      padding-top: ${t.modalBodyPaddingTop};\n      padding-right: ${t.modalPaddingRight};\n      padding-bottom: ${t.modalBodyPaddingBottom};\n      padding-left: ${t.modalPaddingLeft};\n      color: ${t.modalBodyTextColor};\n    `;\n    },\n\n    mobileBody(t: Theme) {\n      return emotion.css`\n      padding: ${t.mobileModalBodyPadding};\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 emotion.css`\n      padding-right: ${rightPadding}px;\n    `;\n    },\n\n    mobileHeaderWithClose(t: Theme) {\n      return emotion.css`\n      padding-right: ${2 * parseInt(t.mobileModalCloseButtonRightPadding) + parseInt(t.mobileModalCloseIconSize)}px;\n    `;\n    },\n\n    footer(t: Theme) {\n      return emotion.css`\n      padding: ${t.modalFooterPaddingTop} ${t.modalPaddingRight} ${t.modalFooterPaddingBottom} ${t.modalPaddingLeft};\n      color: ${t.modalFooterTextColor};\n      border-radius: 0 0 ${t.modalBorderRadius} ${t.modalBorderRadius};\n    `;\n    },\n\n    mobileFooter(t: Theme) {\n      return emotion.css`\n      padding: ${t.mobileModalFooterPadding};\n    `;\n    },\n\n    panel(t: Theme) {\n      return emotion.css`\n      padding-top: ${t.modalFooterPanelPaddingTop};\n      padding-bottom: ${t.modalFooterPanelPaddingBottom};\n      background: ${t.modalFooterBg};\n    `;\n    },\n\n    fixedHeader(t: Theme) {\n      return emotion.css`\n      margin-bottom: ${t.modalFixedHeaderMarginBottom};\n      padding-bottom: ${t.modalFixedHeaderPaddingBottom};\n      background: ${t.modalFixedHeaderBg};\n      border-bottom: ${t.modalFixedHeaderBorder};\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 emotion.css`\n      padding-bottom: ${t.mobileModalHeaderPadding};\n    `;\n    },\n\n    fixedFooter(t: Theme) {\n      return emotion.css`\n      padding-top: ${t.modalFixedFooterPaddingTop};\n      margin-top: ${t.modalFixedFooterMarginTop};\n      background: ${t.modalFixedHeaderBg};\n      border-top: ${t.modalFixedFooterBorder};\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    fixedPanel(t: Theme) {\n      return emotion.css`\n      &:before {\n        box-shadow: ${t.modalFixedPanelShadow};\n      }\n    `;\n    },\n\n    headerAddPadding(t: Theme) {\n      return emotion.css`\n      padding-bottom: ${t.modalHeaderAdditionalPaddingBottom};\n    `;\n    },\n\n    bodyWithoutHeader(t: Theme) {\n      return emotion.css`\n      padding-top: ${t.modalPaddingTop};\n    `;\n    },\n\n    mobileBodyWithoutHeader() {\n      return emotion.css`\n      padding-top: 0px;\n    `;\n    },\n\n    bodyWithoutPadding() {\n      return emotion.css`\n      padding: 0;\n    `;\n    },\n\n    bodyAddPaddingForPanel(t: Theme) {\n      return emotion.css`\n      padding-bottom: ${t.modalPaddingBottom};\n    `;\n    },\n\n    mobileBodyAddPaddingForPanel(t: Theme) {\n      return emotion.css`\n      padding: ${t.mobileModalBodyPadding};\n    `;\n    },\n\n    columnFlexContainer() {\n      return emotion.css`\n      height: 100%;\n      display: flex;\n      flex-flow: column;\n      overflow-y: auto;\n    `;\n    },\n\n    modalSeparatorWrapper() {\n      return emotion.css`\n      position: absolute;\n      width: 100%;\n    `;\n    },\n\n    modalSeparator(t: Theme) {\n      return emotion.css`\n      border-bottom: ${t.modalSeparatorBorderBottom};\n      margin: 0 32px;\n      transition: margin 0.3s;\n    `;\n    },\n\n    modalSeparatorFixed() {\n      return emotion.css`\n      margin: 0 16px;\n    `;\n    },\n  });\n"]}

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

@@ -13,8 +13,13 @@ export interface ModalBodyProps extends CommonProps {
  */
 export declare class ModalBody extends React.Component<ModalBodyProps> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static __MODAL_BODY__: boolean;
     private theme;
+    private emotion;
+    private isMobileLayout;
+    private setRootNode;
     render(): JSX.Element;
+    private handleResize;
     renderMain(): JSX.Element;
 }