@skbkontur/react-ui 0.0.0-bb4cbfe9c6 → 0.0.0-bd4276284d

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

@@ -1,6 +1,6 @@
 "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, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29, _templateObject30, _templateObject31, _templateObject32, _templateObject33, _templateObject34, _templateObject35, _templateObject36;
+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;
 
 var styles = (0, _Emotion.memoizeStyle)({
   root: function root() {
@@ -44,12 +44,13 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   window: function window(t) {
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (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    "])),
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      white-space: normal;\n      margin: auto;\n      box-shadow: ", ";\n      background: ", ";\n      border-radius: ", ";\n    "])),
 
 
 
-
-    t.modalBg);
+    t.modalWindowShadow,
+    t.modalBg,
+    t.modalBorderRadius);
 
   },
 
@@ -61,7 +62,7 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
-  centerContainer: function centerContainer(t) {
+  centerContainer: function centerContainer() {
     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    "])));
 
 
@@ -185,25 +186,21 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
-  headerWrapper: function headerWrapper() {
-    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "])));
-
-
-  },
-
   header: function header(t) {
-    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    "])),
+    return (0, _Emotion.css)(_templateObject16 || (_templateObject16 = (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.modalHeaderTextColor,
+    t.modalHeaderFontWeight);
 
   },
 
   mobileHeader: function mobileHeader(t) {
-    return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])),
+
     t.mobileModalHeaderFontSize,
     t.mobileModalHeaderLineHeight,
     t.mobileModalHeaderPadding);
@@ -211,14 +208,15 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   body: function body(t) {
-    return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0 ", " ", " ", ";\n      color: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-radius: ", ";\n      padding: 0 ", " ", " ", ";\n      color: ", ";\n    "])),
+    t.modalBodyBorderRadius,
     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    "])),
+    return (0, _Emotion.css)(_templateObject19 || (_templateObject19 = (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,
 
 
@@ -232,38 +230,33 @@ var styles = (0, _Emotion.memoizeStyle)({
     var rightPadding =
     2 * parseInt(t.modalCloseButtonPadding) + parseInt(t.modalCloseIconSize) + parseInt(t.modalCloseLegacyGap);
 
-    return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
+    return (0, _Emotion.css)(_templateObject20 || (_templateObject20 = (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    "])),
+    return (0, _Emotion.css)(_templateObject21 || (_templateObject21 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-right: ", "px;\n    "])),
     2 * parseInt(t.mobileModalCloseButtonRightPadding) + parseInt(t.mobileModalCloseIconSize));
 
   },
 
   footer: function footer(t) {
-    return (0, _Emotion.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", " ", " ", ";\n      color: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject22 || (_templateObject22 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " ", " ", " ", ";\n      color: ", ";\n      border-radius: 0 0 ", " ", ";\n    "])),
     t.modalFooterPaddingTop, t.modalPaddingRight, t.modalFooterPaddingBottom, t.modalPaddingLeft,
-    t.modalFooterTextColor);
+    t.modalFooterTextColor,
+    t.modalBorderRadius, t.modalBorderRadius);
 
   },
 
   mobileFooter: function mobileFooter(t) {
-    return (0, _Emotion.css)(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject23 || (_templateObject23 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", ";\n    "])),
     t.mobileModalFooterPadding);
 
   },
 
-  footerWrapper: function footerWrapper() {
-    return (0, _Emotion.css)(_templateObject25 || (_templateObject25 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n    "])));
-
-
-  },
-
   panel: function panel(t) {
-    return (0, _Emotion.css)(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      background: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject24 || (_templateObject24 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n      padding-bottom: ", ";\n      background: ", ";\n    "])),
     t.modalFooterPanelPaddingTop,
     t.modalFooterPanelPaddingBottom,
     t.modalFooterBg);
@@ -271,10 +264,11 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   fixedHeader: function fixedHeader(t) {
-    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    "])),
-
+    return (0, _Emotion.css)(_templateObject25 || (_templateObject25 = (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,
 
 
 
@@ -290,16 +284,17 @@ var styles = (0, _Emotion.memoizeStyle)({
   },
 
   mobileFixedHeader: function mobileFixedHeader(t) {
-    return (0, _Emotion.css)(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject26 || (_templateObject26 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
     t.mobileModalHeaderPadding);
 
   },
 
   fixedFooter: function fixedFooter(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    "])),
-
-
+    return (0, _Emotion.css)(_templateObject27 || (_templateObject27 = (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,
 
 
 
@@ -314,47 +309,76 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
-  headerAddPadding: function headerAddPadding() {
-    return (0, _Emotion.css)(_templateObject30 || (_templateObject30 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: 22px;\n    "])));
+  fixedPanel: function fixedPanel(t) {
+    return (0, _Emotion.css)(_templateObject28 || (_templateObject28 = (0, _taggedTemplateLiteralLoose2.default)(["\n      &:before {\n        box-shadow: ", ";\n      }\n    "])),
+
+    t.modalFixedPanelShadow);
 
 
   },
 
+  headerAddPadding: function headerAddPadding(t) {
+    return (0, _Emotion.css)(_templateObject29 || (_templateObject29 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+    t.modalHeaderAdditionalPaddingBottom);
+
+  },
+
   bodyWithoutHeader: function bodyWithoutHeader(t) {
-    return (0, _Emotion.css)(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject30 || (_templateObject30 = (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    "])));
+  mobileBodyWithoutHeader: function mobileBodyWithoutHeader() {
+    return (0, _Emotion.css)(_templateObject31 || (_templateObject31 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-top: 0px;\n    "])));
 
 
   },
 
   bodyWithoutPadding: function bodyWithoutPadding() {
-    return (0, _Emotion.css)(_templateObject33 || (_templateObject33 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0;\n    "])));
+    return (0, _Emotion.css)(_templateObject32 || (_templateObject32 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 0;\n    "])));
 
 
   },
 
   bodyAddPaddingForPanel: function bodyAddPaddingForPanel(t) {
-    return (0, _Emotion.css)(_templateObject34 || (_templateObject34 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding-bottom: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject33 || (_templateObject33 = (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    "])),
+    return (0, _Emotion.css)(_templateObject34 || (_templateObject34 = (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    "])));
+    return (0, _Emotion.css)(_templateObject35 || (_templateObject35 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: 100%;\n      display: flex;\n      flex-flow: column;\n      overflow-y: auto;\n    "])));
+
+
+
+
+
+  },
 
+  modalSeparatorWrapper: function modalSeparatorWrapper() {
+    return (0, _Emotion.css)(_templateObject36 || (_templateObject36 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: absolute;\n      width: 100%;\n    "])));
 
 
 
+  },
+
+  modalSeparator: function modalSeparator(t) {
+    return (0, _Emotion.css)(_templateObject37 || (_templateObject37 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-bottom: ", ";\n      margin: 0 32px;\n      transition: margin 0.3s;\n    "])),
+    t.modalSeparatorBorderBottom);
+
+
+
+  },
+
+  modalSeparatorFixed: function modalSeparatorFixed() {
+    return (0, _Emotion.css)(_templateObject38 || (_templateObject38 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: 0 16px;\n    "])));
+
 
   } });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","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"]}
+{"version":3,"sources":["Modal.styles.ts"],"names":["styles","root","css","bg","t","modalBackBg","modalBackOpacity","container","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","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 { 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: ${t.modalWindowShadow};\n      background: ${t.modalBg};\n      border-radius: ${t.modalBorderRadius};\n    `;\n  },\n\n  mobileWindow() {\n    return css`\n      width: 100%;\n      height: 100%;\n      overflow: auto;\n    `;\n  },\n\n  centerContainer() {\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  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      font-weight: ${t.modalHeaderFontWeight};\n    `;\n  },\n\n  mobileHeader(t: Theme) {\n    return 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 css`\n      border-radius: ${t.modalBodyBorderRadius};\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      border-radius: 0 0 ${t.modalBorderRadius} ${t.modalBorderRadius};\n    `;\n  },\n\n  mobileFooter(t: Theme) {\n    return css`\n      padding: ${t.mobileModalFooterPadding};\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: ${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 css`\n      padding-bottom: ${t.mobileModalHeaderPadding};\n    `;\n  },\n\n  fixedFooter(t: Theme) {\n    return 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 css`\n      &:before {\n        box-shadow: ${t.modalFixedPanelShadow};\n      }\n    `;\n  },\n\n  headerAddPadding(t: Theme) {\n    return css`\n      padding-bottom: ${t.modalHeaderAdditionalPaddingBottom};\n    `;\n  },\n\n  bodyWithoutHeader(t: Theme) {\n    return css`\n      padding-top: ${t.modalPaddingTop};\n    `;\n  },\n\n  mobileBodyWithoutHeader() {\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: auto;\n    `;\n  },\n\n  modalSeparatorWrapper() {\n    return css`\n      position: absolute;\n      width: 100%;\n    `;\n  },\n\n  modalSeparator(t: Theme) {\n    return css`\n      border-bottom: ${t.modalSeparatorBorderBottom};\n      margin: 0 32px;\n      transition: margin 0.3s;\n    `;\n  },\n\n  modalSeparatorFixed() {\n    return css`\n      margin: 0 16px;\n    `;\n  },\n});\n"]}

package/cjs/components/Modal/ModalBody.js

@@ -11,7 +11,8 @@ var _ResizeDetector = require("../../internal/ResizeDetector");
 var _rootNode = require("../../lib/rootNode");
 
 var _ModalContext = require("./ModalContext");
-var _Modal = require("./Modal.styles");var _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _Modal = require("./Modal.styles");
+var _getModalBodyTheme = require("./getModalBodyTheme");var _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 
 
@@ -46,9 +47,9 @@ ModalBody = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)(_c
 
 
 
-    handleResize = function (event) {
+    handleResize = function () {
       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.
+    };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 = (0, _getModalBodyTheme.getModalBodyTheme)(theme);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _this2.theme }, _this2.renderMain());});};_proto.
 
   renderMain = function renderMain() {var _this3 = this;
     var noPadding = this.props.noPadding;
@@ -57,13 +58,11 @@ ModalBody = (0, _decorator.responsiveLayout)(_class = (0, _rootNode.rootNode)(_c
       function (_ref) {var _cx;var additionalPadding = _ref.additionalPadding,hasHeader = _ref.hasHeader;return /*#__PURE__*/(
           _react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this3.setRootNode }, _this3.props), /*#__PURE__*/
           _react.default.createElement(_ZIndex.ZIndex, {
-            priority: 'ModalBody',
-            createStackingContext: true,
             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.mobileBodyWithoutHeader()] = !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)) },

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

@@ -1 +1 @@
-{"version":3,"sources":["ModalBody.tsx"],"names":["ModalBody","responsiveLayout","rootNode","handleResize","event","LayoutEvents","emit","render","theme","renderMain","noPadding","props","additionalPadding","hasHeader","setRootNode","styles","body","mobileBody","isMobileLayout","bodyWithoutHeader","mobileBodyWithoutHeader","bodyAddPaddingForPanel","mobileBodyAddPaddingForPanel","bodyWithoutPadding","children","React","Component","__KONTUR_REACT_UI__","__MODAL_BODY__"],"mappings":"uUAAA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,uC;;;;;;;;;AASA;AACA;AACA;AACA;AACA,G;;;AAGaA,S,OAFZC,2B,eACAC,kB;;;;;;;;;;;;;;;;;;;AAoBSC,IAAAA,Y,GAAe,UAACC,KAAD,EAAoB;AACzCC,MAAAA,YAAY,CAACC,IAAb;AACD,K,uDAbMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACC,UAAL,EAAP,CACD,CAJH,CADF,CAQD,C;;AAMMA,EAAAA,U,GAAP,sBAAiC;AAC/B,QAAQC,SAAR,GAAsB,KAAKC,KAA3B,CAAQD,SAAR;AACA;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,mCAAGE,iBAAH,QAAGA,iBAAH,CAAsBC,SAAtB,QAAsBA,SAAtB;AACC,uCAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACC,WAAjC,IAAkD,MAAI,CAACH,KAAvD;AACE,uCAAC,cAAD;AACE,YAAA,QAAQ,EAAE,WADZ;AAEE,YAAA,qBAAqB,MAFvB;AAGE,YAAA,SAAS,EAAE;AACRI,0BAAOC,IAAP,CAAY,MAAI,CAACR,KAAjB,CADQ,IACkB,IADlB;AAERO,0BAAOE,UAAP,CAAkB,MAAI,CAACT,KAAvB,CAFQ,IAEwB,MAAI,CAACU,cAF7B;AAGRH,0BAAOI,iBAAP,CAAyB,MAAI,CAACX,KAA9B,CAHQ,IAG+B,CAACK,SAHhC;AAIRE,0BAAOK,uBAAP,CAA+B,MAAI,CAACZ,KAApC,CAJQ,IAIqC,CAACK,SAAD,IAAc,MAAI,CAACK,cAJxD;AAKRH,0BAAOM,sBAAP,CAA8B,MAAI,CAACb,KAAnC,CALQ,IAKoCI,iBALpC;AAMRG,0BAAOO,4BAAP,CAAoC,MAAI,CAACd,KAAzC,CANQ,IAM0CI,iBAAiB,IAAI,MAAI,CAACM,cANpE;AAORH,0BAAOQ,kBAAP,EAPQ,IAOsBb,SAPtB,OAHb;;;AAaG,UAAA,MAAI,CAACQ,cAAL;AACC,uCAAC,8BAAD,IAAgB,QAAQ,EAAE,MAAI,CAACf,YAA/B,IAA8C,MAAI,CAACQ,KAAL,CAAWa,QAAzD,CADD;;AAGC,UAAA,MAAI,CAACb,KAAL,CAAWa,QAhBf,CADF,CADD,GADH,CADF;;;;;;;AA2BD,G,oBApD4BC,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/decorator';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\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\n@rootNode\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  private setRootNode!: TSetRootNode;\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 rootNodeRef={this.setRootNode} {...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"]}
+{"version":3,"sources":["ModalBody.tsx"],"names":["ModalBody","responsiveLayout","rootNode","handleResize","LayoutEvents","emit","render","theme","renderMain","noPadding","props","additionalPadding","hasHeader","setRootNode","styles","body","mobileBody","isMobileLayout","bodyWithoutHeader","mobileBodyWithoutHeader","bodyAddPaddingForPanel","mobileBodyAddPaddingForPanel","bodyWithoutPadding","children","React","Component","__KONTUR_REACT_UI__","__MODAL_BODY__"],"mappings":"uUAAA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,wD;;;;;;;;;AASA;AACA;AACA;AACA;AACA,G;;;AAGaA,S,OAFZC,2B,eACAC,kB;;;;;;;;;;;;;;;;;;;AAoBSC,IAAAA,Y,GAAe,YAAM;AAC3BC,MAAAA,YAAY,CAACC,IAAb;AACD,K,uDAbMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAa,0CAAkBA,KAAlB,CAAb,CACA,oBAAO,6BAAC,0BAAD,CAAc,QAAd,IAAuB,KAAK,EAAE,MAAI,CAACA,KAAnC,IAA2C,MAAI,CAACC,UAAL,EAA3C,CAAP,CACD,CAJH,CADF,CAQD,C;;AAMMA,EAAAA,U,GAAP,sBAAiC;AAC/B,QAAQC,SAAR,GAAsB,KAAKC,KAA3B,CAAQD,SAAR;AACA;AACE,mCAAC,0BAAD,CAAc,QAAd;AACG,mCAAGE,iBAAH,QAAGA,iBAAH,CAAsBC,SAAtB,QAAsBA,SAAtB;AACC,uCAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACC,WAAjC,IAAkD,MAAI,CAACH,KAAvD;AACE,uCAAC,cAAD;AACE,YAAA,SAAS,EAAE;AACRI,0BAAOC,IAAP,CAAY,MAAI,CAACR,KAAjB,CADQ,IACkB,IADlB;AAERO,0BAAOE,UAAP,CAAkB,MAAI,CAACT,KAAvB,CAFQ,IAEwB,MAAI,CAACU,cAF7B;AAGRH,0BAAOI,iBAAP,CAAyB,MAAI,CAACX,KAA9B,CAHQ,IAG+B,CAACK,SAHhC;AAIRE,0BAAOK,uBAAP,EAJQ,IAI2B,CAACP,SAAD,IAAc,MAAI,CAACK,cAJ9C;AAKRH,0BAAOM,sBAAP,CAA8B,MAAI,CAACb,KAAnC,CALQ,IAKoCI,iBALpC;AAMRG,0BAAOO,4BAAP,CAAoC,MAAI,CAACd,KAAzC,CANQ,IAM0CI,iBAAiB,IAAI,MAAI,CAACM,cANpE;AAORH,0BAAOQ,kBAAP,EAPQ,IAOsBb,SAPtB,OADb;;;AAWG,UAAA,MAAI,CAACQ,cAAL;AACC,uCAAC,8BAAD,IAAgB,QAAQ,EAAE,MAAI,CAACd,YAA/B,IAA8C,MAAI,CAACO,KAAL,CAAWa,QAAzD,CADD;;AAGC,UAAA,MAAI,CAACb,KAAL,CAAWa,QAdf,CADF,CADD,GADH,CADF;;;;;;;AAyBD,G,oBAlD4BC,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/decorator';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { ModalContext } from './ModalContext';\nimport { styles } from './Modal.styles';\nimport { getModalBodyTheme } from './getModalBodyTheme';\n\nexport interface ModalBodyProps extends CommonProps {\n  /**\n   * убирает отступы\n   */\n  noPadding?: boolean;\n}\n\n/**\n * Контейнер с отступами от края модалки\n *\n * @visibleName Modal.Body\n */\n@responsiveLayout\n@rootNode\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  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = getModalBodyTheme(theme);\n          return <ThemeContext.Provider value={this.theme}>{this.renderMain()}</ThemeContext.Provider>;\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private handleResize = () => {\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 rootNodeRef={this.setRootNode} {...this.props}>\n            <ZIndex\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()]: !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.js

@@ -6,9 +6,12 @@ var _Emotion = require("../../lib/theming/Emotion");
 var _keyListener = require("../../lib/events/keyListener");
 var _ResponsiveLayout = require("../ResponsiveLayout");
 var _CommonWrapper = require("../../internal/CommonWrapper");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
+var _XIcon20Regular = require("../../internal/icons2022/XIcon/XIcon20Regular");
 
 
-var _Modal = require("./Modal.styles");var _excluded = ["disableClose", "requestClose"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _Modal = require("./Modal.styles");
+var _Modal2 = require("./Modal");var _excluded = ["disableClose", "requestClose"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _ref.requestClose,otherProps = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
@@ -28,6 +31,8 @@ function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _
     setFocusedByTab(false);
   };
 
+  var icon = (0, _ThemeHelpers.isTheme2022)(theme) ? /*#__PURE__*/_react.default.createElement(_XIcon20Regular.XIcon20Regular, { align: "none" }) : /*#__PURE__*/_react.default.createElement(_CrossIcon.CrossIcon, null);
+
   return /*#__PURE__*/(
     _react.default.createElement(_CommonWrapper.CommonWrapper, otherProps, /*#__PURE__*/
     _react.default.createElement(_ResponsiveLayout.ResponsiveLayout, null,
@@ -42,10 +47,10 @@ function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _
           onClick: requestClose,
           onFocus: handleFocus,
           onBlur: handleBlur,
-          "data-tid": "modal-close",
-          tabIndex: disableClose ? -1 : 0 }, /*#__PURE__*/
+          "data-tid": _Modal2.ModalDataTids.close,
+          tabIndex: disableClose ? -1 : 0 },
 
-        _react.default.createElement(_CrossIcon.CrossIcon, null)));})));
+        icon));})));
 
 
 

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

@@ -1 +1 @@
-{"version":3,"sources":["ModalClose.tsx"],"names":["ModalClose","disableClose","requestClose","otherProps","theme","ThemeContext","React","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","isMobile","styles","close","mobileClose","disabled","focus"],"mappings":"wRAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAGA,uC;;AAEO,SAASA,UAAT,OAA+E,KAAzDC,YAAyD,QAAzDA,YAAyD,CAA3CC,YAA2C,QAA3CA,YAA2C,CAA1BC,UAA0B;AACpF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,wBAAwCC,eAAMC,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,IAAAA,qBAAqB,CAAC,YAAM;AAC1B,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BJ,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJoB,CAArB;AAKD,GARD;;AAUA,MAAMK,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvBL,IAAAA,eAAe,CAAC,KAAD,CAAf;AACD,GAFD;;AAIA;AACE,iCAAC,4BAAD,EAAmBN,UAAnB;AACE,iCAAC,kCAAD;AACG,kCAAGY,QAAH,SAAGA,QAAH;AACC;AACE,UAAA,SAAS,EAAE;AACRC,wBAAOC,KAAP,CAAab,KAAb,CADQ,IACc,IADd;AAERY,wBAAOE,WAAP,CAAmBd,KAAnB,CAFQ,IAEoBW,QAFpB;AAGRC,wBAAOG,QAAP,CAAgBf,KAAhB,CAHQ,IAGiBH,YAHjB;AAIRe,wBAAOI,KAAP,CAAahB,KAAb,CAJQ,IAIcI,YAJd,OADb;;AAOE,UAAA,OAAO,EAAEN,YAPX;AAQE,UAAA,OAAO,EAAEQ,WARX;AASE,UAAA,MAAM,EAAEI,UATV;AAUE,sBAAS,aAVX;AAWE,UAAA,QAAQ,EAAEb,YAAY,GAAG,CAAC,CAAJ,GAAQ,CAXhC;;AAaE,qCAAC,oBAAD,OAbF,CADD,GADH,CADF,CADF;;;;;;AAuBD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { CloseProps } from './ModalContext';\nimport { styles } from './Modal.styles';\n\nexport function ModalClose({ disableClose, requestClose, ...otherProps }: CloseProps) {\n  const theme = useContext(ThemeContext);\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    requestAnimationFrame(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n\n  const handleBlur = () => {\n    setFocusedByTab(false);\n  };\n\n  return (\n    <CommonWrapper {...otherProps}>\n      <ResponsiveLayout>\n        {({ isMobile }) => (\n          <button\n            className={cx({\n              [styles.close(theme)]: true,\n              [styles.mobileClose(theme)]: isMobile,\n              [styles.disabled(theme)]: disableClose,\n              [styles.focus(theme)]: focusedByTab,\n            })}\n            onClick={requestClose}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            data-tid=\"modal-close\"\n            tabIndex={disableClose ? -1 : 0}\n          >\n            <CrossIcon />\n          </button>\n        )}\n      </ResponsiveLayout>\n    </CommonWrapper>\n  );\n}\n"]}
+{"version":3,"sources":["ModalClose.tsx"],"names":["ModalClose","disableClose","requestClose","otherProps","theme","ThemeContext","React","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","icon","isMobile","styles","close","mobileClose","disabled","focus","ModalDataTids"],"mappings":"wRAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA,iC;;AAEO,SAASA,UAAT,OAA+E,KAAzDC,YAAyD,QAAzDA,YAAyD,CAA3CC,YAA2C,QAA3CA,YAA2C,CAA1BC,UAA0B;AACpF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,wBAAwCC,eAAMC,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,IAAAA,qBAAqB,CAAC,YAAM;AAC1B,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BJ,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJoB,CAArB;AAKD,GARD;;AAUA,MAAMK,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvBL,IAAAA,eAAe,CAAC,KAAD,CAAf;AACD,GAFD;;AAIA,MAAMM,IAAI,GAAG,+BAAYX,KAAZ,iBAAqB,6BAAC,8BAAD,IAAgB,KAAK,EAAC,MAAtB,GAArB,gBAAuD,6BAAC,oBAAD,OAApE;;AAEA;AACE,iCAAC,4BAAD,EAAmBD,UAAnB;AACE,iCAAC,kCAAD;AACG,kCAAGa,QAAH,SAAGA,QAAH;AACC;AACE,UAAA,SAAS,EAAE;AACRC,wBAAOC,KAAP,CAAad,KAAb,CADQ,IACc,IADd;AAERa,wBAAOE,WAAP,CAAmBf,KAAnB,CAFQ,IAEoBY,QAFpB;AAGRC,wBAAOG,QAAP,CAAgBhB,KAAhB,CAHQ,IAGiBH,YAHjB;AAIRgB,wBAAOI,KAAP,CAAajB,KAAb,CAJQ,IAIcI,YAJd,OADb;;AAOE,UAAA,OAAO,EAAEN,YAPX;AAQE,UAAA,OAAO,EAAEQ,WARX;AASE,UAAA,MAAM,EAAEI,UATV;AAUE,sBAAUQ,sBAAcJ,KAV1B;AAWE,UAAA,QAAQ,EAAEjB,YAAY,GAAG,CAAC,CAAJ,GAAQ,CAXhC;;AAaGc,QAAAA,IAbH,CADD,GADH,CADF,CADF;;;;;;AAuBD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { XIcon20Regular } from '../../internal/icons2022/XIcon/XIcon20Regular';\n\nimport { CloseProps } from './ModalContext';\nimport { styles } from './Modal.styles';\nimport { ModalDataTids } from './Modal';\n\nexport function ModalClose({ disableClose, requestClose, ...otherProps }: CloseProps) {\n  const theme = useContext(ThemeContext);\n  const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n  const handleFocus = () => {\n    // focus event fires before keyDown eventlistener\n    // so we should check tabPressed in async way\n    requestAnimationFrame(() => {\n      if (keyListener.isTabPressed) {\n        setFocusedByTab(true);\n      }\n    });\n  };\n\n  const handleBlur = () => {\n    setFocusedByTab(false);\n  };\n\n  const icon = isTheme2022(theme) ? <XIcon20Regular align=\"none\" /> : <CrossIcon />;\n\n  return (\n    <CommonWrapper {...otherProps}>\n      <ResponsiveLayout>\n        {({ isMobile }) => (\n          <button\n            className={cx({\n              [styles.close(theme)]: true,\n              [styles.mobileClose(theme)]: isMobile,\n              [styles.disabled(theme)]: disableClose,\n              [styles.focus(theme)]: focusedByTab,\n            })}\n            onClick={requestClose}\n            onFocus={handleFocus}\n            onBlur={handleBlur}\n            data-tid={ModalDataTids.close}\n            tabIndex={disableClose ? -1 : 0}\n          >\n            {icon}\n          </button>\n        )}\n      </ResponsiveLayout>\n    </CommonWrapper>\n  );\n}\n"]}

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

@@ -1,13 +1,30 @@
 import { ReactNode } from 'react';
 import { CommonProps } from '../../internal/CommonWrapper';
+import { GappedProps } from '../Gapped';
 export interface ModalFooterProps extends CommonProps {
     /**
      * Включает серый цвет в футере
      */
     panel?: boolean;
+    /**
+     * Закрепляет футер снизу модального окна
+     *
+     * На десктопе по умолчанию равен `true`
+     * На мобильных по умолчанию равен `false`
+     */
     sticky?: boolean;
+    /**
+     * Контент футера
+     */
     children?: ReactNode;
+    /**
+     * Задаёт отступ между элементами футера
+     */
+    gap?: GappedProps['gap'];
 }
+export declare const ModalFooterDataTids: {
+    readonly root: "ModalFooter__root";
+};
 /**
  * Футер модального окна.
  *

package/cjs/components/Modal/ModalFooter.js

@@ -1,15 +1,17 @@
-"use strict";exports.__esModule = true;exports.ModalFooter = ModalFooter;var _react = _interopRequireWildcard(require("react"));
+"use strict";exports.__esModule = true;exports.ModalFooter = ModalFooter;exports.ModalFooterDataTids = void 0;var _react = _interopRequireWildcard(require("react"));
 
 var _getScrollWidth = require("../../lib/dom/getScrollWidth");
 var _Sticky = require("../Sticky");
 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 _Gapped = require("../Gapped");
+var _utils = require("../../lib/utils");
 
 var _Modal = require("./Modal.styles");
-var _ModalContext = require("./ModalContext");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _ModalContext = require("./ModalContext");
+var _ModalSeparator = require("./ModalSeparator");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 
 
@@ -20,19 +22,36 @@ var _ModalContext = require("./ModalContext");function _getRequireWildcardCache(
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+var ModalFooterDataTids = {
+  root: 'ModalFooter__root' };
+
+
 /**
  * Футер модального окна.
  *
  * @visibleName Modal.Footer
- */
+ */exports.ModalFooterDataTids = ModalFooterDataTids;
 function ModalFooter(props) {
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
   var modal = (0, _react.useContext)(_ModalContext.ModalContext);
   var layout = (0, _ResponsiveLayout.useResponsiveLayout)();
 
-  var _props$sticky = props.sticky,sticky = _props$sticky === void 0 ? layout.isMobile ? false : true : _props$sticky,panel = props.panel,children = props.children;
+  var _props$sticky = props.sticky,sticky = _props$sticky === void 0 ? !layout.isMobile : _props$sticky,gap = props.gap,panel = props.panel,children = props.children;
 
-  (0, _react.useEffect)(function () {
+  (0, _react.useLayoutEffect)(function () {
     modal.setHasFooter == null ? void 0 : modal.setHasFooter();
     modal.setHasPanel == null ? void 0 : modal.setHasPanel(panel);
 
@@ -42,31 +61,40 @@ function ModalFooter(props) {
     };
   }, [panel]);
 
-  var renderContent = function renderContent(fixed) {var _cx;if (fixed === void 0) {fixed = false;}
+  var renderContent = function renderContent(fixed) {if (fixed === void 0) {fixed = false;}
     return /*#__PURE__*/(
+      _react.default.createElement(_react.default.Fragment, null,
+      (panel || fixed) && /*#__PURE__*/_react.default.createElement(_ModalSeparator.ModalSeparator, { fixed: fixed }), /*#__PURE__*/
       _react.default.createElement("div", {
-        className: (0, _Emotion.cx)((_cx = {}, _cx[
-        _Modal.styles.footer(theme)] = true, _cx[
-        _Modal.styles.fixedFooter(theme)] = fixed, _cx[
-        _Modal.styles.panel(theme)] = Boolean(panel), _cx[
-        _Modal.styles.mobileFooter(theme)] = layout.isMobile, _cx)) },
+        "data-tid": ModalFooterDataTids.root,
+        className: (0, _Emotion.cx)(
+        _Modal.styles.footer(theme),
+        fixed && _Modal.styles.fixedFooter(theme),
+        Boolean(panel) && _Modal.styles.panel(theme),
+        fixed && Boolean(panel) && _Modal.styles.fixedPanel(theme),
+        layout.isMobile && _Modal.styles.mobileFooter(theme)) },
+
+
+      (0, _utils.isNonNullable)(gap) ? /*#__PURE__*/
+      _react.default.createElement(_Gapped.Gapped, { vertical: layout.isMobile, gap: gap },
+      children) :
+
+
+      children)));
 
 
-      children));
 
 
   };
 
   return /*#__PURE__*/(
-    _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
-    _react.default.createElement(_ZIndex.ZIndex, { priority: 'ModalFooter', className: _Modal.styles.footerWrapper() },
+    _react.default.createElement(_CommonWrapper.CommonWrapper, props,
     sticky ? /*#__PURE__*/
     _react.default.createElement(_Sticky.Sticky, { side: "bottom", offset: modal.horizontalScroll ? (0, _getScrollWidth.getScrollWidth)() : 0 },
     renderContent) :
 
 
-    renderContent())));
-
+    renderContent()));