@skbkontur/react-ui 0.0.0-e55f22da73 → 0.0.0-ea6161656e

package/components/MiniModal/MiniModalFooter/MiniModalFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["MiniModalFooter.tsx"],"names":["React","Modal","forwardRefAndName","isIE11","useEmotion","useTheme","getStyles","MiniModalDataTids","MiniModalFooter","ref","direction","children","rest","theme","emotion","styles","childrenCount","Children","count","_direction","IE11FallbackClasses","cx","actionsRowIE11Fallback","actionsColumnIE11Fallback","actions","actionsRow","actionsColumn"],"mappings":"8IAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,KAAT,QAAwC,UAAxC;AACA,SAASC,iBAAT,QAAkC,6BAAlC;AACA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAASC,UAAT,QAA2B,2BAA3B;AACA,SAASC,QAAT,QAAyB,4BAAzB;;AAEA,SAASC,SAAT,QAA0B,oBAA1B;AACA,SAASC,iBAAT,QAAkC,aAAlC;;;;;;;;;;;;;AAaA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAGN,iBAAiB;AAC9C,iBAD8C;AAE9C,gBAA2CO,GAA3C,EAAmD,2BAAhDC,SAAgD,CAAhDA,SAAgD,+BAApC,KAAoC,kBAA7BC,QAA6B,QAA7BA,QAA6B,CAAhBC,IAAgB;AACjD,MAAMC,KAAK,GAAGR,QAAQ,EAAtB;AACA,MAAMS,OAAO,GAAGV,UAAU,EAA1B;AACA,MAAMW,MAAM,GAAGT,SAAS,CAACQ,OAAD,CAAxB;;AAEA,MAAME,aAAa,GAAGhB,KAAK,CAACiB,QAAN,CAAeC,KAAf,CAAqBP,QAArB,CAAtB;AACA,MAAMQ,UAAU,GAAGH,aAAa,GAAG,CAAhB,IAAqBA,aAAa,KAAK,CAAvC,GAA2C,QAA3C,GAAsDN,SAAzE;;AAEA;AACA,MAAMU,mBAAmB;AACvBjB,EAAAA,MAAM;AACNW,EAAAA,OAAO,CAACO,EAAR;AACEF,EAAAA,UAAU,KAAK,KAAf,IAAwBJ,MAAM,CAACO,sBAAP,CAA8BT,KAA9B,CAD1B;AAEEM,EAAAA,UAAU,KAAK,QAAf,IAA2BJ,MAAM,CAACQ,yBAAP,CAAiCV,KAAjC,CAF7B,CAFF;;;AAOA;AACE,wBAAC,KAAD,CAAO,MAAP,EAAkBD,IAAlB;AACE;AACE,MAAA,GAAG,EAAEH,GADP;AAEE,kBAAUF,iBAAiB,CAACiB,OAF9B;AAGE,MAAA,SAAS,EAAEV,OAAO,CAACO,EAAR;AACTN,MAAAA,MAAM,CAACS,OAAP,CAAeX,KAAf,CADS;AAETM,MAAAA,UAAU,KAAK,KAAf,IAAwBJ,MAAM,CAACU,UAAP,EAFf;AAGTN,MAAAA,UAAU,KAAK,QAAf,IAA2BJ,MAAM,CAACW,aAAP,EAHlB;AAITN,MAAAA,mBAJS,CAHb;;;AAUGT,IAAAA,QAVH,CADF,CADF;;;;AAgBD,CAlC6C,CAAzC","sourcesContent":["import React from 'react';\n\nimport { Modal, ModalFooterProps } from '../Modal';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { isIE11 } from '../../lib/client';\nimport { useEmotion } from '../../lib/theming/Emotion';\nimport { useTheme } from '../../lib/theming/useTheme';\n\nimport { getStyles } from './MiniModal.styles';\nimport { MiniModalDataTids } from './MiniModal';\n\ninterface MiniModalFooterProps extends ModalFooterProps {\n  /**\n   * Направление позиционирования кнопок.\n   * `row` работает только для 2 элементов,\n   * в других случаях автоматически включиться `column`.\n   *\n   * @default row\n   */\n  direction?: 'row' | 'column';\n}\n\n/**\n * Обёртка над Modal.Footer\n *\n * @visibleName MiniModal.Footer\n */\nexport const MiniModalFooter = forwardRefAndName<HTMLDivElement, MiniModalFooterProps>(\n  'MiniModalFooter',\n  ({ direction = 'row', children, ...rest }, ref) => {\n    const theme = useTheme();\n    const emotion = useEmotion();\n    const styles = getStyles(emotion);\n\n    const childrenCount = React.Children.count(children);\n    const _direction = childrenCount > 2 || childrenCount === 1 ? 'column' : direction;\n\n    // IE11 does not support CSS property `gap`\n    const IE11FallbackClasses =\n      isIE11 &&\n      emotion.cx(\n        _direction === 'row' && styles.actionsRowIE11Fallback(theme),\n        _direction === 'column' && styles.actionsColumnIE11Fallback(theme),\n      );\n\n    return (\n      <Modal.Footer {...rest}>\n        <div\n          ref={ref}\n          data-tid={MiniModalDataTids.actions}\n          className={emotion.cx(\n            styles.actions(theme),\n            _direction === 'row' && styles.actionsRow(),\n            _direction === 'column' && styles.actionsColumn(),\n            IE11FallbackClasses,\n          )}\n        >\n          {children}\n        </div>\n      </Modal.Footer>\n    );\n  },\n);\n"]}

package/components/MiniModal/MiniModalFooter/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MiniModal/MiniModalFooter.js",
+  "module": "MiniModalFooter",
+  "types": "../MiniModalFooter.d.ts",
+  "sideEffects": false
+}

package/components/MiniModal/MiniModalFooter.d.ts

@@ -0,0 +1,18 @@
+import { ModalFooterProps } from '../Modal';
+interface MiniModalFooterProps extends ModalFooterProps {
+    /**
+     * Направление позиционирования кнопок.
+     * `row` работает только для 2 элементов,
+     * в других случаях автоматически включиться `column`.
+     *
+     * @default row
+     */
+    direction?: 'row' | 'column';
+}
+/**
+ * Обёртка над Modal.Footer
+ *
+ * @visibleName MiniModal.Footer
+ */
+export declare const MiniModalFooter: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLDivElement, MiniModalFooterProps> & Record<never, never>;
+export {};

package/components/MiniModal/MiniModalHeader/MiniModalHeader.js

@@ -0,0 +1,35 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["icon", "children"];
+import React from 'react';
+import { Modal } from "../../Modal";
+import { forwardRefAndName } from "../../../lib/forwardRefAndName";
+import { InfoCircleIcon64Regular } from "../../../internal/icons2022/InfoCircleIcon/InfoCircleIcon64Regular";
+import { useTheme } from "../../../lib/theming/useTheme";
+import { useEmotion } from "../../../lib/theming/Emotion";
+import { getStyles } from "../MiniModal.styles";
+import { MiniModalDataTids } from "../MiniModal";
+/**
+ * Обёртка над Modal.Header
+ *
+ * @visibleName MiniModal.Header
+ */
+
+export var MiniModalHeader = forwardRefAndName('MiniModalHeader', function (_ref, ref) {
+  var _ref$icon = _ref.icon,
+      icon = _ref$icon === void 0 ? /*#__PURE__*/React.createElement(InfoCircleIcon64Regular, null) : _ref$icon,
+      children = _ref.children,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var theme = useTheme();
+  var emotion = useEmotion();
+  var styles = getStyles(emotion);
+  return /*#__PURE__*/React.createElement(Modal.Header, rest, /*#__PURE__*/React.createElement("div", {
+    ref: ref
+  }, icon && /*#__PURE__*/React.createElement("div", {
+    "data-tid": MiniModalDataTids.icon,
+    className: styles.icon()
+  }, icon), children && /*#__PURE__*/React.createElement("div", {
+    "data-tid": MiniModalDataTids.title,
+    className: emotion.cx(styles.title(), icon && styles.titleWithIcon(theme))
+  }, children)));
+});

package/components/MiniModal/MiniModalHeader/MiniModalHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["MiniModalHeader.tsx"],"names":["React","Modal","forwardRefAndName","InfoCircleIcon64Regular","useTheme","useEmotion","getStyles","MiniModalDataTids","MiniModalHeader","ref","icon","children","rest","theme","emotion","styles","title","cx","titleWithIcon"],"mappings":"yIAAA,OAAOA,KAAP,MAAiC,OAAjC;;AAEA,SAASC,KAAT,QAAwC,UAAxC;AACA,SAASC,iBAAT,QAAkC,6BAAlC;AACA,SAASC,uBAAT,QAAwC,iEAAxC;AACA,SAASC,QAAT,QAAyB,4BAAzB;AACA,SAASC,UAAT,QAA2B,2BAA3B;;AAEA,SAASC,SAAT,QAA0B,oBAA1B;AACA,SAASC,iBAAT,QAAkC,aAAlC;;;;;;;;;;;AAWA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAGN,iBAAiB;AAC9C,iBAD8C;AAE9C,gBAA4DO,GAA5D,EAAoE,sBAAjEC,IAAiE,CAAjEA,IAAiE,uCAA1D,oBAAC,uBAAD,OAA0D,aAA7BC,QAA6B,QAA7BA,QAA6B,CAAhBC,IAAgB;AAClE,MAAMC,KAAK,GAAGT,QAAQ,EAAtB;AACA,MAAMU,OAAO,GAAGT,UAAU,EAA1B;AACA,MAAMU,MAAM,GAAGT,SAAS,CAACQ,OAAD,CAAxB;;AAEA;AACE,wBAAC,KAAD,CAAO,MAAP,EAAkBF,IAAlB;AACE,iCAAK,GAAG,EAAEH,GAAV;AACGC,IAAAA,IAAI;AACH,iCAAK,YAAUH,iBAAiB,CAACG,IAAjC,EAAuC,SAAS,EAAEK,MAAM,CAACL,IAAP,EAAlD;AACGA,IAAAA,IADH,CAFJ;;;AAMGC,IAAAA,QAAQ;AACP;AACE,kBAAUJ,iBAAiB,CAACS,KAD9B;AAEE,MAAA,SAAS,EAAEF,OAAO,CAACG,EAAR,CAAWF,MAAM,CAACC,KAAP,EAAX,EAA2BN,IAAI,IAAIK,MAAM,CAACG,aAAP,CAAqBL,KAArB,CAAnC,CAFb;;AAIGF,IAAAA,QAJH,CAPJ,CADF,CADF;;;;;;AAmBD,CA1B6C,CAAzC","sourcesContent":["import React, { ReactNode } from 'react';\n\nimport { Modal, ModalHeaderProps } from '../Modal';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { InfoCircleIcon64Regular } from '../../internal/icons2022/InfoCircleIcon/InfoCircleIcon64Regular';\nimport { useTheme } from '../../lib/theming/useTheme';\nimport { useEmotion } from '../../lib/theming/Emotion';\n\nimport { getStyles } from './MiniModal.styles';\nimport { MiniModalDataTids } from './MiniModal';\n\ninterface MiniModalHeaderProps extends ModalHeaderProps {\n  /**\n   * Пиктограмма в шапке компонента.\n   *\n   * @default InfoCircleIcon64Regular\n   */\n  icon?: ReactNode;\n}\n\n/**\n * Обёртка над Modal.Header\n *\n * @visibleName MiniModal.Header\n */\nexport const MiniModalHeader = forwardRefAndName<HTMLDivElement, MiniModalHeaderProps>(\n  'MiniModalHeader',\n  ({ icon = <InfoCircleIcon64Regular />, children, ...rest }, ref) => {\n    const theme = useTheme();\n    const emotion = useEmotion();\n    const styles = getStyles(emotion);\n\n    return (\n      <Modal.Header {...rest}>\n        <div ref={ref}>\n          {icon && (\n            <div data-tid={MiniModalDataTids.icon} className={styles.icon()}>\n              {icon}\n            </div>\n          )}\n          {children && (\n            <div\n              data-tid={MiniModalDataTids.title}\n              className={emotion.cx(styles.title(), icon && styles.titleWithIcon(theme))}\n            >\n              {children}\n            </div>\n          )}\n        </div>\n      </Modal.Header>\n    );\n  },\n);\n"]}

package/components/MiniModal/MiniModalHeader/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MiniModal/MiniModalHeader.js",
+  "module": "MiniModalHeader",
+  "types": "../MiniModalHeader.d.ts",
+  "sideEffects": false
+}

package/components/MiniModal/MiniModalHeader.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import { ModalHeaderProps } from '../Modal';
+interface MiniModalHeaderProps extends ModalHeaderProps {
+    /**
+     * Пиктограмма в шапке компонента.
+     *
+     * @default InfoCircleIcon64Regular
+     */
+    icon?: ReactNode;
+}
+/**
+ * Обёртка над Modal.Header
+ *
+ * @visibleName MiniModal.Header
+ */
+export declare const MiniModalHeader: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLDivElement, MiniModalHeaderProps> & Record<never, never>;
+export {};

package/components/MiniModal/MiniModalIndent/MiniModalIndent.js

@@ -0,0 +1,29 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["children"];
+import React from 'react';
+import { forwardRefAndName } from "../../../lib/forwardRefAndName";
+import { useEmotion } from "../../../lib/theming/Emotion";
+import { isIE11 } from "../../../lib/client";
+import { useTheme } from "../../../lib/theming/useTheme";
+import { getStyles } from "../MiniModal.styles";
+import { MiniModalDataTids } from "../MiniModal";
+/**
+ * Отступ между кнопками
+ *
+ * @visibleName MiniModal.Indent
+ */
+
+export var MiniModalIndent = forwardRefAndName('MiniModalIndent', function (_ref, ref) {
+  var children = _ref.children,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var theme = useTheme();
+  var emotion = useEmotion();
+  var styles = getStyles(emotion);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-tid": MiniModalDataTids.indent,
+    ref: ref,
+    className: emotion.cx(!isIE11 ? styles.actionsIndent(theme) : styles.actionsIndentIE11Fallback(theme))
+  }, rest));
+});

package/components/MiniModal/MiniModalIndent/MiniModalIndent.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["MiniModalIndent.tsx"],"names":["React","forwardRefAndName","useEmotion","isIE11","useTheme","getStyles","MiniModalDataTids","MiniModalIndent","ref","children","rest","theme","emotion","styles","indent","cx","actionsIndent","actionsIndentIE11Fallback"],"mappings":"2LAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,iBAAT,QAAkC,6BAAlC;AACA,SAASC,UAAT,QAA2B,2BAA3B;AACA,SAASC,MAAT,QAAuB,kBAAvB;AACA,SAASC,QAAT,QAAyB,4BAAzB;;AAEA,SAASC,SAAT,QAA0B,oBAA1B;AACA,SAASC,iBAAT,QAAkC,aAAlC;;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,eAAe,GAAGN,iBAAiB;AAC9C,iBAD8C;AAE9C,gBAAwBO,GAAxB,EAAgC,KAA7BC,QAA6B,QAA7BA,QAA6B,CAAhBC,IAAgB;AAC9B,MAAMC,KAAK,GAAGP,QAAQ,EAAtB;AACA,MAAMQ,OAAO,GAAGV,UAAU,EAA1B;AACA,MAAMW,MAAM,GAAGR,SAAS,CAACO,OAAD,CAAxB;;AAEA;AACE;AACE,kBAAUN,iBAAiB,CAACQ,MAD9B;AAEE,MAAA,GAAG,EAAEN,GAFP;AAGE,MAAA,SAAS,EAAEI,OAAO,CAACG,EAAR,CAAW,CAACZ,MAAD,GAAUU,MAAM,CAACG,aAAP,CAAqBL,KAArB,CAAV,GAAwCE,MAAM,CAACI,yBAAP,CAAiCN,KAAjC,CAAnD,CAHb;AAIMD,IAAAA,IAJN,EADF;;;AAQD,CAf6C,CAAzC","sourcesContent":["import React from 'react';\n\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { useEmotion } from '../../lib/theming/Emotion';\nimport { isIE11 } from '../../lib/client';\nimport { useTheme } from '../../lib/theming/useTheme';\n\nimport { getStyles } from './MiniModal.styles';\nimport { MiniModalDataTids } from './MiniModal';\n\n/**\n * Отступ между кнопками\n *\n * @visibleName MiniModal.Indent\n */\nexport const MiniModalIndent = forwardRefAndName<HTMLDivElement, unknown>(\n  'MiniModalIndent',\n  ({ children, ...rest }, ref) => {\n    const theme = useTheme();\n    const emotion = useEmotion();\n    const styles = getStyles(emotion);\n\n    return (\n      <div\n        data-tid={MiniModalDataTids.indent}\n        ref={ref}\n        className={emotion.cx(!isIE11 ? styles.actionsIndent(theme) : styles.actionsIndentIE11Fallback(theme))}\n        {...rest}\n      />\n    );\n  },\n);\n"]}

package/components/MiniModal/MiniModalIndent/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MiniModal/MiniModalIndent.js",
+  "module": "MiniModalIndent",
+  "types": "../MiniModalIndent.d.ts",
+  "sideEffects": false
+}

package/components/MiniModal/MiniModalIndent.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Отступ между кнопками
+ *
+ * @visibleName MiniModal.Indent
+ */
+export declare const MiniModalIndent: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLDivElement, unknown> & Record<never, never>;

package/components/MiniModal/getMiniModalTheme/getMiniModalTheme.js

@@ -0,0 +1,23 @@
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+export var getMiniModalTheme = function getMiniModalTheme(contextTheme, propsTheme) {
+  if (propsTheme === void 0) {
+    propsTheme = {};
+  }
+
+  var theme = ThemeFactory.create(propsTheme, contextTheme);
+  return ThemeFactory.create({
+    modalBodyPaddingTop: theme.miniModalBodyPaddingTop,
+    modalBodyPaddingBottom: theme.miniModalBodyPaddingBottom,
+    modalHeaderPaddingTop: theme.miniModalHeaderPaddingTop,
+    modalHeaderPaddingBottom: theme.miniModalHeaderPaddingBottom,
+    modalFooterPaddingTop: theme.miniModalFooterPaddingTop,
+    modalFooterPaddingBottom: theme.miniModalFooterPaddingBottom,
+    mobileModalFooterPadding: theme.miniModalFooterPaddingMobile,
+    mobileModalHeaderPadding: theme.miniModalHeaderPaddingMobile,
+    mobileModalBodyPadding: theme.miniModalBodyPaddingMobile,
+    mobileModalContainerHeight: theme.miniModalHeightMobile,
+    mobileModalContainerMarginTop: theme.miniModalMarginTopMobile,
+    mobileModalContainerMarginRight: theme.miniModalMarginRightMobile,
+    mobileModalContainerMarginLeft: theme.miniModalMarginLeftMobile
+  }, theme);
+};

package/components/MiniModal/getMiniModalTheme/getMiniModalTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["getMiniModalTheme.ts"],"names":["ThemeFactory","getMiniModalTheme","contextTheme","propsTheme","theme","create","modalBodyPaddingTop","miniModalBodyPaddingTop","modalBodyPaddingBottom","miniModalBodyPaddingBottom","modalHeaderPaddingTop","miniModalHeaderPaddingTop","modalHeaderPaddingBottom","miniModalHeaderPaddingBottom","modalFooterPaddingTop","miniModalFooterPaddingTop","modalFooterPaddingBottom","miniModalFooterPaddingBottom","mobileModalFooterPadding","miniModalFooterPaddingMobile","mobileModalHeaderPadding","miniModalHeaderPaddingMobile","mobileModalBodyPadding","miniModalBodyPaddingMobile","mobileModalContainerHeight","miniModalHeightMobile","mobileModalContainerMarginTop","miniModalMarginTopMobile","mobileModalContainerMarginRight","miniModalMarginRightMobile","mobileModalContainerMarginLeft","miniModalMarginLeftMobile"],"mappings":"AAAA,SAASA,YAAT,QAA6B,gCAA7B;;;AAGA,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,CAACC,YAAD,EAAsBC,UAAtB,EAAmD,KAA7BA,UAA6B,cAA7BA,UAA6B,GAAP,EAAO;AAClF,MAAMC,KAAK,GAAGJ,YAAY,CAACK,MAAb,CAAoBF,UAApB,EAAgCD,YAAhC,CAAd;AACA,SAAOF,YAAY,CAACK,MAAb;AACL;AACEC,IAAAA,mBAAmB,EAAEF,KAAK,CAACG,uBAD7B;AAEEC,IAAAA,sBAAsB,EAAEJ,KAAK,CAACK,0BAFhC;AAGEC,IAAAA,qBAAqB,EAAEN,KAAK,CAACO,yBAH/B;AAIEC,IAAAA,wBAAwB,EAAER,KAAK,CAACS,4BAJlC;AAKEC,IAAAA,qBAAqB,EAAEV,KAAK,CAACW,yBAL/B;AAMEC,IAAAA,wBAAwB,EAAEZ,KAAK,CAACa,4BANlC;AAOEC,IAAAA,wBAAwB,EAAEd,KAAK,CAACe,4BAPlC;AAQEC,IAAAA,wBAAwB,EAAEhB,KAAK,CAACiB,4BARlC;AASEC,IAAAA,sBAAsB,EAAElB,KAAK,CAACmB,0BAThC;AAUEC,IAAAA,0BAA0B,EAAEpB,KAAK,CAACqB,qBAVpC;AAWEC,IAAAA,6BAA6B,EAAEtB,KAAK,CAACuB,wBAXvC;AAYEC,IAAAA,+BAA+B,EAAExB,KAAK,CAACyB,0BAZzC;AAaEC,IAAAA,8BAA8B,EAAE1B,KAAK,CAAC2B,yBAbxC,EADK;;AAgBL3B,EAAAA,KAhBK,CAAP;;AAkBD,CApBM","sourcesContent":["import { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\n\nexport const getMiniModalTheme = (contextTheme: Theme, propsTheme: ThemeIn = {}) => {\n  const theme = ThemeFactory.create(propsTheme, contextTheme);\n  return ThemeFactory.create(\n    {\n      modalBodyPaddingTop: theme.miniModalBodyPaddingTop,\n      modalBodyPaddingBottom: theme.miniModalBodyPaddingBottom,\n      modalHeaderPaddingTop: theme.miniModalHeaderPaddingTop,\n      modalHeaderPaddingBottom: theme.miniModalHeaderPaddingBottom,\n      modalFooterPaddingTop: theme.miniModalFooterPaddingTop,\n      modalFooterPaddingBottom: theme.miniModalFooterPaddingBottom,\n      mobileModalFooterPadding: theme.miniModalFooterPaddingMobile,\n      mobileModalHeaderPadding: theme.miniModalHeaderPaddingMobile,\n      mobileModalBodyPadding: theme.miniModalBodyPaddingMobile,\n      mobileModalContainerHeight: theme.miniModalHeightMobile,\n      mobileModalContainerMarginTop: theme.miniModalMarginTopMobile,\n      mobileModalContainerMarginRight: theme.miniModalMarginRightMobile,\n      mobileModalContainerMarginLeft: theme.miniModalMarginLeftMobile,\n    },\n    theme,\n  );\n};\n"]}

package/components/MiniModal/getMiniModalTheme/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MiniModal/getMiniModalTheme.js",
+  "module": "getMiniModalTheme",
+  "types": "../getMiniModalTheme.d.ts",
+  "sideEffects": false
+}

package/components/MiniModal/getMiniModalTheme.d.ts

@@ -0,0 +1,16 @@
+import { Theme, ThemeIn } from '../../lib/theming/Theme';
+export declare const getMiniModalTheme: (contextTheme: Theme, propsTheme?: ThemeIn) => Readonly<Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> & {
+    modalBodyPaddingTop: string;
+    modalBodyPaddingBottom: string;
+    modalHeaderPaddingTop: string;
+    modalHeaderPaddingBottom: string;
+    modalFooterPaddingTop: string;
+    modalFooterPaddingBottom: string;
+    mobileModalFooterPadding: string;
+    mobileModalHeaderPadding: string;
+    mobileModalBodyPadding: string;
+    mobileModalContainerHeight: string;
+    mobileModalContainerMarginTop: string;
+    mobileModalContainerMarginRight: string;
+    mobileModalContainerMarginLeft: string;
+}>;

package/components/MiniModal/index/index.js

@@ -0,0 +1,5 @@
+export * from "../MiniModal";
+export * from "../MiniModalHeader";
+export * from "../MiniModalBody";
+export * from "../MiniModalFooter";
+export * from "../MiniModalIndent";

package/components/MiniModal/index/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAd;AACA,cAAc,mBAAd;AACA,cAAc,iBAAd;AACA,cAAc,mBAAd;AACA,cAAc,mBAAd","sourcesContent":["export * from './MiniModal';\nexport * from './MiniModalHeader';\nexport * from './MiniModalBody';\nexport * from './MiniModalFooter';\nexport * from './MiniModalIndent';\n"]}

package/components/MiniModal/index/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/MiniModal/index.js",
+  "module": "index",
+  "types": "../index.d.ts",
+  "sideEffects": false
+}

package/components/MiniModal/index.d.ts

@@ -0,0 +1,5 @@
+export * from './MiniModal';
+export * from './MiniModalHeader';
+export * from './MiniModalBody';
+export * from './MiniModalFooter';
+export * from './MiniModalIndent';

package/components/MiniModal/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../cjs/components/MiniModal/index.js",
+  "module": "index",
+  "types": "index.d.ts",
+  "sideEffects": false
+}

package/components/Modal/Modal/Modal.js

@@ -2,7 +2,9 @@ import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitial
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
 import FocusLock from 'react-focus-lock';
-import cn from 'classnames';
+import throttle from 'lodash.throttle';
+import { globalObject } from '@skbkontur/global-object';
+import { isNonNullable } from "../../../lib/utils";
 import { isKeyEscape } from "../../../lib/events/keyboard/identifiers";
 import * as LayoutEvents from "../../../lib/LayoutEvents";
 import { RenderContainer } from "../../../internal/RenderContainer";
@@ -11,34 +13,41 @@ import { stopPropagation } from "../../../lib/events/stopPropagation";
 import { HideBodyVerticalScroll } from "../../../internal/HideBodyVerticalScroll";
 import { ModalStack } from "../../../lib/ModalStack";
 import { ResizeDetector } from "../../../internal/ResizeDetector";
+import { isIE11 } from "../../../lib/client";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { ResponsiveLayout } from "../../ResponsiveLayout";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
-import { isIE11 } from "../../../lib/utils";
 import { ModalContext } from "../ModalContext";
 import { ModalFooter } from "../ModalFooter";
 import { ModalHeader } from "../ModalHeader";
-import { isBody, isFooter, isHeader } from "../helpers";
 import { ModalBody } from "../ModalBody";
 import { ModalClose } from "../ModalClose";
-import { jsStyles } from "../Modal.styles";
+import { getStyles } from "../Modal.styles";
+import { getModalTheme } from "../getModalTheme";
 var mountedModalsCount = 0;
-/**
-                             * Модальное окно
-                             *
-                             * Содержит в себе три компоненты: **Modal.Header**,
-                             * **Modal.Body** и **Modal.Footer**
-                             *
-                             * Для отображения серой плашки в футере в компонент
-                             * **Footer** необходимо передать пропс **panel**
-                             *
-                             * Для отключения прилипания шапки и футера
-                             * в соответствующий компонет нужно передать
-                             * проп **sticky** со значением **false**
-                             * (по-умолчанию прилипание включено)
-                             */
-
-export var Modal =
-/*#__PURE__*/
-function (_React$Component) {
+export var ModalDataTids = {
+  container: 'modal-container',
+  content: 'modal-content',
+  close: 'modal-close'
+};
+/**
+ * Модальное окно
+ *
+ * Содержит в себе три компоненты: **Modal.Header**,
+ * **Modal.Body** и **Modal.Footer**
+ *
+ * Для отображения серой плашки в футере в компонент
+ * **Footer** необходимо передать пропс **panel**
+ *
+ * Для отключения прилипания шапки и футера
+ * в соответствующий компонент нужно передать
+ * проп **sticky** со значением **false**
+ * (по-умолчанию прилипание включено)
+ */
+
+export var Modal = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Modal, _React$Component);
 
   function Modal() {
@@ -49,11 +58,15 @@ function (_React$Component) {
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Modal.defaultProps);
     _this.state = {
       stackPosition: 0,
-      horizontalScroll: false
+      hasBackground: true,
+      horizontalScroll: false,
+      hasHeader: false,
+      hasFooter: false,
+      hasPanel: false
     };
-    _this.theme = void 0;
     _this.stackSubscription = null;
     _this.containerNode = null;
     _this.mouseDownTarget = null;
@@ -75,7 +88,8 @@ function (_React$Component) {
 
     _this.handleStackChange = function (stack) {
       _this.setState({
-        stackPosition: stack.indexOf(_assertThisInitialized(_this))
+        stackPosition: stack.indexOf(_assertThisInitialized(_this)),
+        hasBackground: ModalStack.isBlocking(_assertThisInitialized(_this))
       });
     };
 
@@ -130,10 +144,42 @@ function (_React$Component) {
       }
     };
 
-    _this.handleResize = function (event) {
+    _this.throttledCheckHorizontalScroll = throttle(_this.checkHorizontalScrollAppearance, 100);
+
+    _this.handleResize = function () {
       LayoutEvents.emit();
     };
 
+    _this.setHasHeader = function (hasHeader) {
+      if (hasHeader === void 0) {
+        hasHeader = true;
+      }
+
+      _this.state.hasHeader !== hasHeader && _this.setState({
+        hasHeader: hasHeader
+      });
+    };
+
+    _this.setHasFooter = function (hasFooter) {
+      if (hasFooter === void 0) {
+        hasFooter = true;
+      }
+
+      _this.state.hasFooter !== hasFooter && _this.setState({
+        hasFooter: hasFooter
+      });
+    };
+
+    _this.setHasPanel = function (hasPanel) {
+      if (hasPanel === void 0) {
+        hasPanel = false;
+      }
+
+      _this.state.hasPanel !== hasPanel && _this.setState({
+        hasPanel: hasPanel
+      });
+    };
+
     return _this;
   }
 
@@ -143,11 +189,11 @@ function (_React$Component) {
     this.stackSubscription = ModalStack.add(this, this.handleStackChange);
 
     if (mountedModalsCount === 0) {
-      window.addEventListener('resize', this.checkHorizontalScrollAppearance);
+      globalObject.addEventListener == null ? void 0 : globalObject.addEventListener('resize', this.throttledCheckHorizontalScroll);
     }
 
     mountedModalsCount++;
-    window.addEventListener('keydown', this.handleKeyDown);
+    globalObject.addEventListener == null ? void 0 : globalObject.addEventListener('keydown', this.handleKeyDown);
     this.checkHorizontalScrollAppearance();
 
     if (this.containerNode) {
@@ -157,13 +203,13 @@ function (_React$Component) {
 
   _proto.componentWillUnmount = function componentWillUnmount() {
     if (--mountedModalsCount === 0) {
-      window.removeEventListener('resize', this.checkHorizontalScrollAppearance);
+      globalObject.removeEventListener == null ? void 0 : globalObject.removeEventListener('resize', this.throttledCheckHorizontalScroll);
       LayoutEvents.emit();
     }
 
-    window.removeEventListener('keydown', this.handleKeyDown);
+    globalObject.removeEventListener == null ? void 0 : globalObject.removeEventListener('keydown', this.handleKeyDown);
 
-    if (this.stackSubscription != null) {
+    if (isNonNullable(this.stackSubscription)) {
       this.stackSubscription.remove();
     }
 
@@ -177,39 +223,48 @@ function (_React$Component) {
   _proto.render = function render() {
     var _this2 = this;
 
-    return React.createElement(ThemeContext.Consumer, null, function (theme) {
-      _this2.theme = theme;
-      return _this2.renderMain();
+    return /*#__PURE__*/React.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+        _this2.theme = getModalTheme(theme, _this2.props.theme);
+        return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+          value: _this2.theme
+        }, _this2.renderMain());
+      });
     });
   };
 
   _proto.renderMain = function renderMain() {
-    var _cn;
+    var _this3 = this;
+
+    var _this$props = this.props,
+        noClose = _this$props.noClose,
+        disableClose = _this$props.disableClose,
+        width = _this$props.width,
+        alignTop = _this$props.alignTop,
+        children = _this$props.children,
+        ariaLabel = _this$props['aria-label'],
+        ariaLabelledby = _this$props['aria-labelledby'];
+    var _this$state = this.state,
+        hasHeader = _this$state.hasHeader,
+        hasFooter = _this$state.hasFooter,
+        hasPanel = _this$state.hasPanel;
+
+    var _this$getProps = this.getProps(),
+        role = _this$getProps.role,
+        disableFocusLock = _this$getProps.disableFocusLock;
 
-    var hasHeader = false;
-    var hasFooter = false;
-    var hasPanel = false;
-    React.Children.toArray(this.props.children).forEach(function (child) {
-      if (isHeader(child)) {
-        hasHeader = true;
-      }
-
-      if (isFooter(child)) {
-        hasFooter = true;
-
-        if (child.props.panel) {
-          hasPanel = true;
-        }
-      }
-    });
     var modalContextProps = {
       hasHeader: hasHeader,
-      horizontalScroll: this.state.horizontalScroll
+      horizontalScroll: this.state.horizontalScroll,
+      setHasHeader: this.setHasHeader,
+      setHasFooter: this.setHasFooter,
+      setHasPanel: this.setHasPanel
     };
 
-    if (hasHeader && !this.props.noClose) {
+    if (!noClose) {
       modalContextProps.close = {
-        disableClose: this.props.disableClose,
+        disableClose: disableClose,
         requestClose: this.requestClose
       };
     }
@@ -225,63 +280,71 @@ function (_React$Component) {
     var style = {};
     var containerStyle = {};
 
-    if (this.props.width) {
-      style.width = this.props.width;
+    if (width) {
+      style.width = width;
     } else {
       containerStyle.width = 'auto';
     }
 
-    return React.createElement(RenderContainer, null, React.createElement(ZIndex, {
+    var styles = getStyles(this.emotion);
+    return /*#__PURE__*/React.createElement(RenderContainer, null, /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement(ZIndex, {
       priority: 'Modal',
-      className: jsStyles.root()
-    }, React.createElement(HideBodyVerticalScroll, null), this.state.stackPosition === 0 && React.createElement("div", {
-      className: jsStyles.bg(this.theme)
-    }), React.createElement("div", {
-      ref: this.refContainer,
-      className: jsStyles.container(),
+      className: styles.root()
+    }, /*#__PURE__*/React.createElement(HideBodyVerticalScroll, null), this.state.hasBackground && /*#__PURE__*/React.createElement("div", {
       onMouseDown: this.handleContainerMouseDown,
       onMouseUp: this.handleContainerMouseUp,
       onClick: this.handleContainerClick,
-      "data-tid": "modal-container"
-    }, React.createElement("div", {
-      className: cn((_cn = {}, _cn[jsStyles.centerContainer(this.theme)] = true, _cn[jsStyles.alignTop(this.theme)] = Boolean(this.props.alignTop), _cn)),
-      style: containerStyle,
-      "data-tid": "modal-content"
-    }, React.createElement("div", {
-      className: jsStyles.window(this.theme),
-      style: style
-    }, React.createElement(ResizeDetector, {
-      onResize: this.handleResize
-    }, React.createElement(FocusLock, {
-      disabled: this.props.disableFocusLock,
-      autoFocus: false
-    }, !hasHeader && !this.props.noClose ? React.createElement(ZIndex, {
-      priority: 'ModalCross',
-      className: jsStyles.closeWrapper()
-    }, React.createElement(ModalClose, {
-      requestClose: this.requestClose,
-      disableClose: this.props.disableClose
-    })) : null, React.createElement(ModalContext.Provider, {
-      value: modalContextProps
-    }, this.props.children))))))));
+      className: styles.bg(this.theme)
+    }), /*#__PURE__*/React.createElement(ResponsiveLayout, null, function (_ref) {
+      var _this3$emotion$cx, _this3$emotion$cx2, _this3$emotion$cx3, _this3$emotion$cx4, _this3$emotion$cx5;
+
+      var isMobile = _ref.isMobile;
+      return /*#__PURE__*/React.createElement("div", {
+        "aria-labelledby": ariaLabelledby,
+        ref: _this3.refContainer,
+        className: _this3.emotion.cx(styles.container(), isMobile && styles.containerMobile(_this3.theme)),
+        onMouseDown: _this3.handleContainerMouseDown,
+        onMouseUp: _this3.handleContainerMouseUp,
+        onClick: _this3.handleContainerClick,
+        "data-tid": ModalDataTids.container
+      }, /*#__PURE__*/React.createElement("div", {
+        "aria-modal": true,
+        "aria-label": ariaLabel,
+        role: role,
+        className: _this3.emotion.cx((_this3$emotion$cx = {}, _this3$emotion$cx[styles.centerContainer()] = true, _this3$emotion$cx[styles.mobileCenterContainer()] = isMobile, _this3$emotion$cx[styles.alignTop()] = Boolean(alignTop), _this3$emotion$cx)),
+        style: isMobile ? undefined : containerStyle,
+        "data-tid": ModalDataTids.content
+      }, /*#__PURE__*/React.createElement("div", {
+        className: _this3.emotion.cx((_this3$emotion$cx2 = {}, _this3$emotion$cx2[styles.window(_this3.theme)] = true, _this3$emotion$cx2[styles.mobileWindow()] = isMobile, _this3$emotion$cx2)),
+        style: isMobile ? undefined : style
+      }, /*#__PURE__*/React.createElement(ResizeDetector, {
+        onResize: _this3.handleResize,
+        fullHeight: isMobile
+      }, /*#__PURE__*/React.createElement(FocusLock, {
+        disabled: disableFocusLock,
+        autoFocus: false,
+        className: _this3.emotion.cx((_this3$emotion$cx3 = {}, _this3$emotion$cx3[styles.columnFlexContainer()] = isMobile, _this3$emotion$cx3), 'focus-lock-container')
+      }, !hasHeader && !noClose && /*#__PURE__*/React.createElement(ZIndex, {
+        className: _this3.emotion.cx((_this3$emotion$cx4 = {}, _this3$emotion$cx4[styles.closeWrapper(_this3.theme)] = true, _this3$emotion$cx4[styles.mobileCloseWrapper(_this3.theme)] = isMobile, _this3$emotion$cx4))
+      }, /*#__PURE__*/React.createElement(ModalClose, {
+        className: _this3.emotion.cx((_this3$emotion$cx5 = {}, _this3$emotion$cx5[styles.mobileCloseWithoutHeader()] = isMobile && !_this3.state.hasHeader, _this3$emotion$cx5)),
+        requestClose: _this3.requestClose,
+        disableClose: disableClose
+      })), /*#__PURE__*/React.createElement(ModalContext.Provider, {
+        value: modalContextProps
+      }, children))))));
+    }))));
   };
 
   return Modal;
 }(React.Component);
 Modal.__KONTUR_REACT_UI__ = 'Modal';
+Modal.displayName = 'Modal';
 Modal.Header = ModalHeader;
 Modal.Body = ModalBody;
 Modal.Footer = ModalFooter;
-Modal.propTypes = {
-  children: function children(props, propName, componentName) {
-    if (React.Children.toArray(props[propName]).some(function (child) {
-      return !isHeader(child) && !isBody(child) && !isFooter(child);
-    })) {
-      return new Error("Only 'Header/Body/Footer' components are allowed for '" + propName + "' prop of '" + componentName + "' component");
-    }
-  }
-};
 Modal.defaultProps = {
   // NOTE: в ie нормально не работает
-  disableFocusLock: isIE11
+  disableFocusLock: isIE11,
+  role: 'dialog'
 };