npm - @skbkontur/react-ui - Versions diffs - 4.1.2 → 4.2.2 - Mend

@skbkontur/react-ui 4.1.2 → 4.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (449) hide show

package/cjs/components/MenuItem/MenuItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MenuItem.tsx"],"names":["MenuItem","rootNode","mouseEntered","renderMain","props","link","comment","icon","loose","state","_enableIconPadding","component","onMouseEnter","onMouseLeave","isMobile","rest","hover","disabled","iconElement","styles","theme","className","root","rootMobile","selected","withIcon","Boolean","children","content","Component","getComponent","handleMouseEnterFix","handleMouseLeave","commentHover","e","href","render","setRootNode","React","__KONTUR_REACT_UI__","__MENU_ITEM__","propTypes","PropTypes","node","bool","string","oneOfType","target","onClick","func","isMenuItem"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isFunction, isReactUIComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode/rootNodeDecorator';\n\nimport { styles } from './MenuItem.styles';\n\nexport type MenuItemState = null \| 'hover' \| 'selected' \| void;\n\nexport interface MenuItemProps extends CommonProps {\n /*\n @ignore\n /\n _enableIconPadding?: boolean;\n /\n Добавляет описание для элемента меню.\n /\n comment?: React.ReactNode;\n /\n Отключенное состояние.\n /\n disabled?: boolean;\n /\n Добавляет элементу меню иконку.\n /\n icon?: React.ReactElement<any>;\n /\n Меняет цвет текста на синий.\n /\n link?: boolean;\n /\n @ignore\n /\n loose?: boolean;\n /\n @ignore\n /\n state?: MenuItemState;\n /\n HTML-событие `onclick`.\n /\n onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n /\n HTML-событие `mouseenter`.\n /\n onMouseEnter?: React.MouseEventHandler;\n /\n HTML-событие `mouseleave`.\n /\n onMouseLeave?: React.MouseEventHandler;\n children?: React.ReactNode \| ((state: MenuItemState) => React.ReactNode);\n /\n HTML-атрибут `target`.\n /\n target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];\n /\n HTML-атрибут `title`.\n /\n title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];\n /\n HTML-атрибут `href`.\n /\n href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];\n /\n Заменяет корневой элемент, на компонент переданный в проп.\n \n По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.\n /\n component?: React.ComponentType<any>;\n\n isMobile?: boolean;\n}\n\n/\n \n * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.\n \n Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\n@rootNode\nexport class MenuItem extends React.Component<MenuItemProps> {\n public static __KONTUR_REACT_UI__ = 'MenuItem';\n public static __MENU_ITEM__ = true;\n\n public static propTypes = {\n comment: PropTypes.node,\n\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n\n loose: PropTypes.bool,\n\n state: PropTypes.string,\n\n target: PropTypes.string,\n\n onClick: PropTypes.func,\n };\n\n private theme!: Theme;\n private mouseEntered = false;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<MenuItemProps>) => {\n const {\n link,\n comment,\n icon,\n loose,\n state,\n _enableIconPadding,\n component,\n onMouseEnter,\n onMouseLeave,\n isMobile,\n ...rest\n } = props;\n\n const hover = state === 'hover' && !this.props.disabled;\n\n let iconElement = null;\n if (icon) {\n iconElement = <div className={styles.icon(this.theme)}>{icon}</div>;\n }\n\n const className = cx({\n [styles.root(this.theme)]: true,\n [styles.rootMobile(this.theme)]: isMobile,\n [styles.loose()]: !!loose,\n [styles.hover(this.theme)]: hover,\n [styles.selected(this.theme)]: state === 'selected',\n [styles.link(this.theme)]: !!link,\n [styles.withIcon(this.theme)]: Boolean(iconElement) \|\| !!_enableIconPadding,\n [styles.disabled(this.theme)]: !!this.props.disabled,\n });\n\n const { children } = this.props;\n\n let content = children;\n if (isFunction(children)) {\n content = children(this.props.state);\n }\n\n const Component = this.getComponent();\n\n return (\n <Component\n {...rest}\n state={state}\n onMouseOver={this.handleMouseEnterFix}\n onMouseLeave={this.handleMouseLeave}\n className={className}\n tabIndex={-1}\n >\n {iconElement}\n {content}\n {this.props.comment && (\n <div\n data-tid=\"MenuItem__comment\"\n className={cx({\n [styles.comment(this.theme)]: true,\n [styles.commentHover(this.theme)]: hover,\n })}\n >\n {comment}\n </div>\n )}\n </Component>\n );\n };\n\n // https://github.com/facebook/react/issues/10109\n // Mouseenter event not triggered when cursor moves from disabled button\n private handleMouseEnterFix = (e: React.MouseEvent<HTMLElement>) => {\n if (!this.mouseEntered && this.props.onMouseEnter) {\n this.mouseEntered = true;\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n this.mouseEntered = false;\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private getComponent = () => {\n const { disabled, component, href } = this.props;\n\n if (disabled) {\n return 'button';\n }\n\n if (component) {\n return component;\n }\n\n if (href) {\n return 'a';\n }\n\n return 'button';\n };\n}\n\nexport const isMenuItem = isReactUIComponent('MenuItem');\n"]}
1	+ {"version":3,"sources":["MenuItem.tsx"],"names":["MenuItemDataTids","root","comment","MenuItem","rootNode","mouseEntered","renderMain","props","link","icon","loose","state","_enableIconPadding","component","onMouseEnter","onMouseLeave","isMobile","rest","hover","disabled","iconElement","styles","theme","className","rootMobile","selected","withIcon","Boolean","children","content","Component","getComponent","handleMouseEnterFix","handleMouseLeave","commentHover","e","href","render","setRootNode","React","__KONTUR_REACT_UI__","__MENU_ITEM__","propTypes","PropTypes","node","bool","string","target","onClick","func","isMenuItem"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isFunction, isReactUIComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode/rootNodeDecorator';\n\nimport { styles } from './MenuItem.styles';\n\nexport type MenuItemState = null \| 'hover' \| 'selected' \| void;\n\nexport interface MenuItemProps extends CommonProps {\n /*\n @ignore\n /\n _enableIconPadding?: boolean;\n /\n Добавляет описание для элемента меню.\n /\n comment?: React.ReactNode;\n /\n Отключенное состояние.\n /\n disabled?: boolean;\n /\n Добавляет элементу меню иконку.\n /\n icon?: React.ReactElement<any>;\n /\n Меняет цвет текста на синий.\n /\n link?: boolean;\n /\n @ignore\n /\n loose?: boolean;\n /\n @ignore\n /\n state?: MenuItemState;\n /\n HTML-событие `onclick`.\n /\n onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n /\n HTML-событие `mouseenter`.\n /\n onMouseEnter?: React.MouseEventHandler;\n /\n HTML-событие `mouseleave`.\n /\n onMouseLeave?: React.MouseEventHandler;\n children?: React.ReactNode \| ((state: MenuItemState) => React.ReactNode);\n /\n HTML-атрибут `target`.\n /\n target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];\n /\n HTML-атрибут `title`.\n /\n title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];\n /\n HTML-атрибут `href`.\n /\n href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];\n /\n Заменяет корневой элемент, на компонент переданный в проп.\n \n По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.\n /\n component?: React.ComponentType<any>;\n\n isMobile?: boolean;\n}\n\nexport const MenuItemDataTids = {\n root: 'MenuItem__root',\n comment: 'MenuItem__comment',\n} as const;\n\n/\n \n * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.\n \n Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\n@rootNode\nexport class MenuItem extends React.Component<MenuItemProps> {\n public static __KONTUR_REACT_UI__ = 'MenuItem';\n public static __MENU_ITEM__ = true;\n\n public static propTypes = {\n comment: PropTypes.node,\n\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.node,\n\n loose: PropTypes.bool,\n\n state: PropTypes.string,\n\n target: PropTypes.string,\n\n onClick: PropTypes.func,\n };\n\n private theme!: Theme;\n private mouseEntered = false;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<MenuItemProps>) => {\n const {\n link,\n comment,\n icon,\n loose,\n state,\n _enableIconPadding,\n component,\n onMouseEnter,\n onMouseLeave,\n isMobile,\n ...rest\n } = props;\n\n const hover = state === 'hover' && !this.props.disabled;\n\n let iconElement = null;\n if (icon) {\n iconElement = <div className={styles.icon(this.theme)}>{icon}</div>;\n }\n\n const className = cx({\n [styles.root(this.theme)]: true,\n [styles.rootMobile(this.theme)]: isMobile,\n [styles.loose()]: !!loose,\n [styles.hover(this.theme)]: hover,\n [styles.selected(this.theme)]: state === 'selected',\n [styles.link(this.theme)]: !!link,\n [styles.withIcon(this.theme)]: Boolean(iconElement) \|\| !!_enableIconPadding,\n [styles.disabled(this.theme)]: !!this.props.disabled,\n });\n\n const { children } = this.props;\n\n let content = children;\n if (isFunction(children)) {\n content = children(this.props.state);\n }\n\n const Component = this.getComponent();\n\n return (\n <Component\n data-tid={MenuItemDataTids.root}\n {...rest}\n state={state}\n onMouseOver={this.handleMouseEnterFix}\n onMouseLeave={this.handleMouseLeave}\n className={className}\n tabIndex={-1}\n >\n {iconElement}\n {content}\n {this.props.comment && (\n <div\n data-tid={MenuItemDataTids.comment}\n className={cx({\n [styles.comment(this.theme)]: true,\n [styles.commentHover(this.theme)]: hover,\n })}\n >\n {comment}\n </div>\n )}\n </Component>\n );\n };\n\n // https://github.com/facebook/react/issues/10109\n // Mouseenter event not triggered when cursor moves from disabled button\n private handleMouseEnterFix = (e: React.MouseEvent<HTMLElement>) => {\n if (!this.mouseEntered && this.props.onMouseEnter) {\n this.mouseEntered = true;\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n this.mouseEntered = false;\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private getComponent = () => {\n const { disabled, component, href } = this.props;\n\n if (disabled) {\n return 'button';\n }\n\n if (component) {\n return component;\n }\n\n if (href) {\n return 'a';\n }\n\n return 'button';\n };\n}\n\nexport const isMenuItem = isReactUIComponent('MenuItem');\n"]}

package/cjs/components/MenuSeparator/MenuSeparator.d.ts CHANGED Viewed

@@ -1,5 +1,8 @@
 import { CommonProps } from '../../internal/CommonWrapper';
 export declare type MenuSeparatorProps = CommonProps;
+export declare const MenuSeparatorDataTids: {
+    readonly root: "MenuSeparator__root";
+};
 /**
  * Добавляет разделительную линию между элементами меню.
  *

package/cjs/components/MenuSeparator/MenuSeparator.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;exports.MenuSeparator = MenuSeparator;var _react = _interopRequireWildcard(require("react"));
+"use strict";exports.__esModule = true;exports.MenuSeparator = MenuSeparator;exports.MenuSeparatorDataTids = void 0;var _react = _interopRequireWildcard(require("react"));
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
@@ -6,17 +6,21 @@ var _CommonWrapper = require("../../internal/CommonWrapper");
 var _MenuSeparator = require("./MenuSeparator.styles");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 MenuSeparatorDataTids = {
+  root: 'MenuSeparator__root' };
 /**
  * Добавляет разделительную линию между элементами меню.
  *
  * Сущности в которых может быть использован `MenuSeparator`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */
+ */exports.MenuSeparatorDataTids = MenuSeparatorDataTids;
 function MenuSeparator(props) {
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
   return /*#__PURE__*/(
     _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
-    _react.default.createElement("div", { className: _MenuSeparator.styles.root(theme) })));
+    _react.default.createElement("div", { "data-tid": MenuSeparatorDataTids.root, className: _MenuSeparator.styles.root(theme) })));
 }

package/cjs/components/MenuSeparator/MenuSeparator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MenuSeparator.tsx"],"names":["MenuSeparator","props","theme","ThemeContext","styles","~~root","~~__KONTUR_REACT_UI__"],"mappings":"~~6EAAA~~;;AAEA;AACA;;AAEA,uD~~;;;AAGA~~;AACA;AACA;AACA;AACA;AACA,~~SAASA~~,aAAT,CAAuBC,KAAvB,EAAkD;AAChD,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,KAAnB;AACE,0CAAK,SAAS,~~EAAEG~~,~~sBAAOC~~,IAAP,~~CAAYH~~,KAAZ,~~CAAhB~~,GADF,CADF;;;AAKD;;AAEDF,aAAa,~~CAACM~~,mBAAd,GAAoC,eAApC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { styles } from './MenuSeparator.styles';\n\nexport type MenuSeparatorProps = CommonProps;\n/*\n Добавляет разделительную линию между элементами меню.\n \n Сущности в которых может быть использован `MenuSeparator`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n const theme = useContext(ThemeContext);\n\n return (\n <CommonWrapper {...props}>\n <div className={styles.root(theme)} />\n </CommonWrapper>\n );\n}\n\nMenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';\n\nexport { MenuSeparator };\n"]}
1	+ {"version":3,"sources":["MenuSeparator.tsx"],"names":["MenuSeparatorDataTids","root","MenuSeparator","props","theme","ThemeContext","styles","__KONTUR_REACT_UI__"],"mappings":"oHAAA;;AAEA;AACA;;AAEA,uD;;;;AAIO,IAAMA,qBAAqB,GAAG;AACnCC,EAAAA,IAAI,EAAE,qBAD6B,EAA9B;;AAGP;AACA;AACA;AACA;AACA,G;AACA,SAASC,aAAT,CAAuBC,KAAvB,EAAkD;AAChD,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,KAAnB;AACE,0CAAK,YAAUH,qBAAqB,CAACC,IAArC,EAA2C,SAAS,EAAEK,sBAAOL,IAAP,CAAYG,KAAZ,CAAtD,GADF,CADF;;;AAKD;;AAEDF,aAAa,CAACK,mBAAd,GAAoC,eAApC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { styles } from './MenuSeparator.styles';\n\nexport type MenuSeparatorProps = CommonProps;\n\nexport const MenuSeparatorDataTids = {\n root: 'MenuSeparator__root',\n} as const;\n/*\n Добавляет разделительную линию между элементами меню.\n \n Сущности в которых может быть использован `MenuSeparator`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n const theme = useContext(ThemeContext);\n\n return (\n <CommonWrapper {...props}>\n <div data-tid={MenuSeparatorDataTids.root} className={styles.root(theme)} />\n </CommonWrapper>\n );\n}\n\nMenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';\n\nexport { MenuSeparator };\n"]}

package/cjs/components/Modal/Modal.d.ts CHANGED Viewed

@@ -40,6 +40,11 @@ export interface ModalState {
     hasFooter: boolean;
     hasPanel: boolean;
 }
+export declare const ModalDataTids: {
+    readonly container: "modal-container";
+    readonly content: "modal-content";
+    readonly close: "modal-close";
+};
 /**
  * Модальное окно
  *

package/cjs/components/Modal/Modal.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Modal = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ModalDataTids = exports.Modal = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _reactFocusLock = _interopRequireDefault(require("react-focus-lock"));
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
@@ -69,6 +69,12 @@ var mountedModalsCount = 0;
+var ModalDataTids = {
+  container: 'modal-container',
+  content: 'modal-content',
+  close: 'modal-close' };
 /**
@@ -84,7 +90,7 @@ var mountedModalsCount = 0;
  * в соответствующий компонент нужно передать
  * проп **sticky** со значением **false**
  * (по-умолчанию прилипание включено)
- */var
+ */exports.ModalDataTids = ModalDataTids;var
 Modal = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Modal, _React$Component);function Modal() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
@@ -333,5 +339,5 @@ Modal = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(M
     setHasPanel = function (hasPanel) {if (hasPanel === void 0) {hasPanel = false;}
       _this.state.hasPanel !== hasPanel && _this.setState({ hasPanel: hasPanel });
-    };return _this;}var _proto = Modal.prototype;_proto.componentDidMount = function componentDidMount() {this.stackSubscription = _ModalStack.ModalStack.add(this, this.handleStackChange);if (mountedModalsCount === 0) {window.addEventListener('resize', this.throttledCheckHorizontalScroll);}mountedModalsCount++;window.addEventListener('keydown', this.handleKeyDown);this.checkHorizontalScrollAppearance();if (this.containerNode) {this.containerNode.addEventListener('scroll', LayoutEvents.emit);}};_proto.componentWillUnmount = function componentWillUnmount() {if (--mountedModalsCount === 0) {window.removeEventListener('resize', this.throttledCheckHorizontalScroll);LayoutEvents.emit();}window.removeEventListener('keydown', this.handleKeyDown);if ((0, _utils.isNonNullable)(this.stackSubscription)) {this.stackSubscription.remove();}_ModalStack.ModalStack.remove(this);if (this.containerNode) {this.containerNode.removeEventListener('scroll', LayoutEvents.emit);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this3 = this;var _this$state = this.state,hasHeader = _this$state.hasHeader,hasFooter = _this$state.hasFooter,hasPanel = _this$state.hasPanel;var modalContextProps = { hasHeader: hasHeader, horizontalScroll: this.state.horizontalScroll, setHasHeader: this.setHasHeader, setHasFooter: this.setHasFooter, setHasPanel: this.setHasPanel };if (!this.props.noClose) {modalContextProps.close = { disableClose: this.props.disableClose, requestClose: this.requestClose };}if (!hasFooter) {modalContextProps.additionalPadding = true;}if (hasFooter && hasPanel) {modalContextProps.additionalPadding = true;}var style = {};var containerStyle = {};if (this.props.width) {style.width = this.props.width;} else {containerStyle.width = 'auto';}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'Modal', className: _Modal.styles.root() }, /*#__PURE__*/_react.default.createElement(_HideBodyVerticalScroll.HideBodyVerticalScroll, null), this.state.hasBackground && /*#__PURE__*/_react.default.createElement("div", { className: _Modal.styles.bg(this.theme) }), /*#__PURE__*/_react.default.createElement("div", { ref: this.refContainer, className: _Modal.styles.container(), onMouseDown: this.handleContainerMouseDown, onMouseUp: this.handleContainerMouseUp, onClick: this.handleContainerClick, "data-tid": "modal-container" }, /*#__PURE__*/_react.default.createElement(_ResponsiveLayout.ResponsiveLayout, null, function (_ref) {var _cx, _cx2, _cx3, _cx4, _cx5;var isMobile = _ref.isMobile;return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx = {}, _cx[_Modal.styles.centerContainer(_this3.theme)] = true, _cx[_Modal.styles.mobileCenterContainer()] = isMobile, _cx[_Modal.styles.alignTop()] = Boolean(_this3.props.alignTop), _cx)), style: isMobile ? undefined : containerStyle, "data-tid": "modal-content" }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Modal.styles.window(_this3.theme)] = true, _cx2[_Modal.styles.mobileWindow()] = isMobile, _cx2)), style: isMobile ? undefined : style }, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: _this3.handleResize, fullHeight: isMobile }, /*#__PURE__*/_react.default.createElement(_reactFocusLock.default, { disabled: _this3.props.disableFocusLock, autoFocus: false, className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_Modal.styles.columnFlexContainer()] = isMobile, _cx3), 'focus-lock-container') }, !hasHeader && !_this3.props.noClose && /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'ModalCross', className: (0, _Emotion.cx)((_cx4 = {}, _cx4[_Modal.styles.closeWrapper(_this3.theme)] = true, _cx4[_Modal.styles.mobileCloseWrapper(_this3.theme)] = isMobile, _cx4)) }, /*#__PURE__*/_react.default.createElement(_ModalClose.ModalClose, { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Modal.styles.mobileCloseWithoutHeader()] = isMobile && !_this3.state.hasHeader, _cx5)), requestClose: _this3.requestClose, disableClose: _this3.props.disableClose })), /*#__PURE__*/_react.default.createElement(_ModalContext.ModalContext.Provider, { value: modalContextProps }, _this3.props.children)))));})))));};return Modal;}(_react.default.Component);exports.Modal = Modal;Modal.__KONTUR_REACT_UI__ = 'Modal';Modal.Header = _ModalHeader.ModalHeader;Modal.Body = _ModalBody.ModalBody;Modal.Footer = _ModalFooter.ModalFooter;Modal.defaultProps = { // NOTE: в ie нормально не работает
+    };return _this;}var _proto = Modal.prototype;_proto.componentDidMount = function componentDidMount() {this.stackSubscription = _ModalStack.ModalStack.add(this, this.handleStackChange);if (mountedModalsCount === 0) {window.addEventListener('resize', this.throttledCheckHorizontalScroll);}mountedModalsCount++;window.addEventListener('keydown', this.handleKeyDown);this.checkHorizontalScrollAppearance();if (this.containerNode) {this.containerNode.addEventListener('scroll', LayoutEvents.emit);}};_proto.componentWillUnmount = function componentWillUnmount() {if (--mountedModalsCount === 0) {window.removeEventListener('resize', this.throttledCheckHorizontalScroll);LayoutEvents.emit();}window.removeEventListener('keydown', this.handleKeyDown);if ((0, _utils.isNonNullable)(this.stackSubscription)) {this.stackSubscription.remove();}_ModalStack.ModalStack.remove(this);if (this.containerNode) {this.containerNode.removeEventListener('scroll', LayoutEvents.emit);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this3 = this;var _this$state = this.state,hasHeader = _this$state.hasHeader,hasFooter = _this$state.hasFooter,hasPanel = _this$state.hasPanel;var modalContextProps = { hasHeader: hasHeader, horizontalScroll: this.state.horizontalScroll, setHasHeader: this.setHasHeader, setHasFooter: this.setHasFooter, setHasPanel: this.setHasPanel };if (!this.props.noClose) {modalContextProps.close = { disableClose: this.props.disableClose, requestClose: this.requestClose };}if (!hasFooter) {modalContextProps.additionalPadding = true;}if (hasFooter && hasPanel) {modalContextProps.additionalPadding = true;}var style = {};var containerStyle = {};if (this.props.width) {style.width = this.props.width;} else {containerStyle.width = 'auto';}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'Modal', className: _Modal.styles.root() }, /*#__PURE__*/_react.default.createElement(_HideBodyVerticalScroll.HideBodyVerticalScroll, null), this.state.hasBackground && /*#__PURE__*/_react.default.createElement("div", { className: _Modal.styles.bg(this.theme) }), /*#__PURE__*/_react.default.createElement("div", { ref: this.refContainer, className: _Modal.styles.container(), onMouseDown: this.handleContainerMouseDown, onMouseUp: this.handleContainerMouseUp, onClick: this.handleContainerClick, "data-tid": ModalDataTids.container }, /*#__PURE__*/_react.default.createElement(_ResponsiveLayout.ResponsiveLayout, null, function (_ref) {var _cx, _cx2, _cx3, _cx4, _cx5;var isMobile = _ref.isMobile;return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx = {}, _cx[_Modal.styles.centerContainer(_this3.theme)] = true, _cx[_Modal.styles.mobileCenterContainer()] = isMobile, _cx[_Modal.styles.alignTop()] = Boolean(_this3.props.alignTop), _cx)), style: isMobile ? undefined : containerStyle, "data-tid": ModalDataTids.content }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Modal.styles.window(_this3.theme)] = true, _cx2[_Modal.styles.mobileWindow()] = isMobile, _cx2)), style: isMobile ? undefined : style }, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: _this3.handleResize, fullHeight: isMobile }, /*#__PURE__*/_react.default.createElement(_reactFocusLock.default, { disabled: _this3.props.disableFocusLock, autoFocus: false, className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_Modal.styles.columnFlexContainer()] = isMobile, _cx3), 'focus-lock-container') }, !hasHeader && !_this3.props.noClose && /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'ModalCross', className: (0, _Emotion.cx)((_cx4 = {}, _cx4[_Modal.styles.closeWrapper(_this3.theme)] = true, _cx4[_Modal.styles.mobileCloseWrapper(_this3.theme)] = isMobile, _cx4)) }, /*#__PURE__*/_react.default.createElement(_ModalClose.ModalClose, { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Modal.styles.mobileCloseWithoutHeader()] = isMobile && !_this3.state.hasHeader, _cx5)), requestClose: _this3.requestClose, disableClose: _this3.props.disableClose })), /*#__PURE__*/_react.default.createElement(_ModalContext.ModalContext.Provider, { value: modalContextProps }, _this3.props.children)))));})))));};return Modal;}(_react.default.Component);exports.Modal = Modal;Modal.__KONTUR_REACT_UI__ = 'Modal';Modal.Header = _ModalHeader.ModalHeader;Modal.Body = _ModalBody.ModalBody;Modal.Footer = _ModalFooter.ModalFooter;Modal.defaultProps = { // NOTE: в ie нормально не работает
   disableFocusLock: _client.isIE11 };

package/cjs/components/Modal/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Modal.tsx"],"names":["mountedModalsCount","Modal","state","stackPosition","hasBackground","horizontalScroll","hasHeader","hasFooter","hasPanel","stackSubscription","containerNode","mouseDownTarget","mouseUpTarget","requestClose","props","disableClose","onClose","refContainer","center","handleStackChange","stack","setState","indexOf","ModalStack","isBlocking","handleContainerMouseDown","event","target","handleContainerMouseUp","handleContainerClick","ignoreBackgroundClick","currentTarget","handleKeyDown","e","checkHorizontalScrollAppearance","hasScroll","containerClientWidth","clientWidth","containerScrollWidth","scrollWidth","throttledCheckHorizontalScroll","handleResize","LayoutEvents","emit","setHasHeader","setHasFooter","setHasPanel","componentDidMount","add","window","addEventListener","componentWillUnmount","removeEventListener","remove","render","theme","renderMain","modalContextProps","noClose","close","additionalPadding","style","containerStyle","width","styles","root","bg","container","isMobile","centerContainer","mobileCenterContainer","alignTop","Boolean","undefined","mobileWindow","disableFocusLock","columnFlexContainer","closeWrapper","mobileCloseWrapper","mobileCloseWithoutHeader","children","React","Component","__KONTUR_REACT_UI__","Header","ModalHeader","Body","ModalBody","Footer","ModalFooter","defaultProps","isIE11"],"mappings":"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","sourcesContent":["import React from 'react';\nimport FocusLock from 'react-focus-lock';\nimport throttle from 'lodash.throttle';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../../internal/RenderContainer';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { stopPropagation } from '../../lib/events/stopPropagation';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll';\nimport { ModalStack, ModalStackSubscription } from '../../lib/ModalStack';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isIE11 } from '../../lib/client';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\n\nimport { ModalContext, ModalContextProps } from './ModalContext';\nimport { ModalFooter } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { ModalClose } from './ModalClose';\nimport { styles } from './Modal.styles';\n\nlet mountedModalsCount = 0;\n\nexport interface ModalProps extends CommonProps {\n /*\n Отключает событие onClose, также дизейблит кнопку закрытия модалки\n /\n disableClose?: boolean;\n\n /\n Выравнивание окна по верху страницы.\n /\n alignTop?: boolean;\n\n /\n Не закрывать окно при клике на фон.\n /\n ignoreBackgroundClick?: boolean;\n\n /\n Не показывать крестик для закрытия окна.\n /\n noClose?: boolean;\n width?: number \| string;\n\n /\n Вызывается, когда пользователь запросил закрытие окна (нажал на фон, на\n * Escape или на крестик).\n /\n onClose?: () => void;\n\n /\n Не использовать фокус-лок внутри модалки.\n * По умолчанию true для IE11.\n /\n disableFocusLock?: boolean;\n}\n\nexport interface ModalState {\n stackPosition: number;\n hasBackground: boolean;\n horizontalScroll: boolean;\n hasHeader: boolean;\n hasFooter: boolean;\n hasPanel: boolean;\n}\n\n/\n Модальное окно\n \n Содержит в себе три компоненты: Modal.Header,\n * Modal.Body и Modal.Footer\n \n Для отображения серой плашки в футере в компонент\n * Footer необходимо передать пропс panel\n \n Для отключения прилипания шапки и футера\n * в соответствующий компонент нужно передать\n * проп sticky со значением false\n * (по-умолчанию прилипание включено)\n */\nexport class Modal extends React.Component<ModalProps, ModalState> {\n public static __KONTUR_REACT_UI__ = 'Modal';\n\n public static Header = ModalHeader;\n public static Body = ModalBody;\n public static Footer = ModalFooter;\n\n public static defaultProps = {\n // NOTE: в ie нормально не работает\n disableFocusLock: isIE11,\n };\n\n public state: ModalState = {\n stackPosition: 0,\n hasBackground: true,\n horizontalScroll: false,\n hasHeader: false,\n hasFooter: false,\n hasPanel: false,\n };\n\n private theme!: Theme;\n private stackSubscription: ModalStackSubscription \| null = null;\n private containerNode: HTMLDivElement \| null = null;\n private mouseDownTarget: EventTarget \| null = null;\n private mouseUpTarget: EventTarget \| null = null;\n\n public componentDidMount() {\n this.stackSubscription = ModalStack.add(this, this.handleStackChange);\n\n if (mountedModalsCount === 0) {\n window.addEventListener('resize', this.throttledCheckHorizontalScroll);\n }\n\n mountedModalsCount++;\n window.addEventListener('keydown', this.handleKeyDown);\n this.checkHorizontalScrollAppearance();\n\n if (this.containerNode) {\n this.containerNode.addEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public componentWillUnmount() {\n if (--mountedModalsCount === 0) {\n window.removeEventListener('resize', this.throttledCheckHorizontalScroll);\n LayoutEvents.emit();\n }\n\n window.removeEventListener('keydown', this.handleKeyDown);\n if (isNonNullable(this.stackSubscription)) {\n this.stackSubscription.remove();\n }\n ModalStack.remove(this);\n\n if (this.containerNode) {\n this.containerNode.removeEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { hasHeader, hasFooter, hasPanel } = this.state;\n\n const modalContextProps: ModalContextProps = {\n hasHeader,\n horizontalScroll: this.state.horizontalScroll,\n setHasHeader: this.setHasHeader,\n setHasFooter: this.setHasFooter,\n setHasPanel: this.setHasPanel,\n };\n if (!this.props.noClose) {\n modalContextProps.close = {\n disableClose: this.props.disableClose,\n requestClose: this.requestClose,\n };\n }\n if (!hasFooter) {\n modalContextProps.additionalPadding = true;\n }\n if (hasFooter && hasPanel) {\n modalContextProps.additionalPadding = true;\n }\n\n const style: { width?: number \| string } = {};\n const containerStyle: { width?: number \| string } = {};\n\n if (this.props.width) {\n style.width = this.props.width;\n } else {\n containerStyle.width = 'auto';\n }\n\n return (\n <RenderContainer>\n <CommonWrapper {...this.props}>\n <ZIndex priority={'Modal'} className={styles.root()}>\n <HideBodyVerticalScroll />\n {this.state.hasBackground && <div className={styles.bg(this.theme)} />}\n <div\n ref={this.refContainer}\n className={styles.container()}\n onMouseDown={this.handleContainerMouseDown}\n onMouseUp={this.handleContainerMouseUp}\n onClick={this.handleContainerClick}\n data-tid=\"modal-container\"\n >\n <ResponsiveLayout>\n {({ isMobile }) => {\n return (\n <div\n className={cx({\n [styles.centerContainer(this.theme)]: true,\n [styles.mobileCenterContainer()]: isMobile,\n [styles.alignTop()]: Boolean(this.props.alignTop),\n })}\n style={isMobile ? undefined : containerStyle}\n data-tid=\"modal-content\"\n >\n <div\n className={cx({ [styles.window(this.theme)]: true, [styles.mobileWindow()]: isMobile })}\n style={isMobile ? undefined : style}\n >\n <ResizeDetector onResize={this.handleResize} fullHeight={isMobile}>\n <FocusLock\n disabled={this.props.disableFocusLock}\n autoFocus={false}\n className={cx({ [styles.columnFlexContainer()]: isMobile }, 'focus-lock-container')}\n >\n {!hasHeader && !this.props.noClose && (\n <ZIndex\n priority={'ModalCross'}\n className={cx({\n [styles.closeWrapper(this.theme)]: true,\n [styles.mobileCloseWrapper(this.theme)]: isMobile,\n })}\n >\n <ModalClose\n className={cx({\n [styles.mobileCloseWithoutHeader()]: isMobile && !this.state.hasHeader,\n })}\n requestClose={this.requestClose}\n disableClose={this.props.disableClose}\n />\n </ZIndex>\n )}\n <ModalContext.Provider value={modalContextProps}>\n {this.props.children}\n </ModalContext.Provider>\n </FocusLock>\n </ResizeDetector>\n </div>\n </div>\n );\n }}\n </ResponsiveLayout>\n </div>\n </ZIndex>\n </CommonWrapper>\n </RenderContainer>\n );\n }\n\n private requestClose = () => {\n if (this.props.disableClose) {\n return;\n }\n if (this.props.onClose) {\n this.props.onClose();\n }\n };\n\n private refContainer = (center: HTMLDivElement \| null) => {\n this.containerNode = center;\n };\n\n private handleStackChange = (stack: readonly React.Component[]) => {\n this.setState({ stackPosition: stack.indexOf(this), hasBackground: ModalStack.isBlocking(this) });\n };\n\n private handleContainerMouseDown = (event: React.MouseEvent) => {\n this.mouseDownTarget = event.target;\n };\n\n private handleContainerMouseUp = (event: React.MouseEvent) => {\n this.mouseUpTarget = event.target;\n };\n\n private handleContainerClick = (event: React.MouseEvent<HTMLDivElement>) => {\n if (!this.props.ignoreBackgroundClick) {\n const { target, currentTarget } = event;\n if (target === currentTarget && this.mouseDownTarget === currentTarget && this.mouseUpTarget === currentTarget) {\n this.requestClose();\n }\n }\n };\n\n private handleKeyDown = (e: KeyboardEvent) => {\n if (this.state.stackPosition !== 0) {\n return;\n }\n if (isKeyEscape(e)) {\n stopPropagation(e);\n this.requestClose();\n }\n };\n\n private checkHorizontalScrollAppearance = () => {\n let hasScroll = false;\n\n if (this.containerNode) {\n const containerClientWidth = this.containerNode.clientWidth;\n const containerScrollWidth = this.containerNode.scrollWidth;\n hasScroll = containerClientWidth < containerScrollWidth;\n }\n if (hasScroll && !this.state.horizontalScroll) {\n this.setState({ horizontalScroll: true });\n } else if (this.state.horizontalScroll) {\n this.setState({ horizontalScroll: false });\n }\n };\n\n private throttledCheckHorizontalScroll = throttle(this.checkHorizontalScrollAppearance, 100);\n\n private handleResize = (event: UIEvent) => {\n LayoutEvents.emit();\n };\n\n private setHasHeader = (hasHeader = true) => {\n this.state.hasHeader !== hasHeader && this.setState({ hasHeader });\n };\n\n private setHasFooter = (hasFooter = true) => {\n this.state.hasFooter !== hasFooter && this.setState({ hasFooter });\n };\n\n private setHasPanel = (hasPanel = false) => {\n this.state.hasPanel !== hasPanel && this.setState({ hasPanel });\n };\n}\n"]}
1	+ {"version":3,"sources":["Modal.tsx"],"names":["mountedModalsCount","ModalDataTids","container","content","close","Modal","state","stackPosition","hasBackground","horizontalScroll","hasHeader","hasFooter","hasPanel","stackSubscription","containerNode","mouseDownTarget","mouseUpTarget","requestClose","props","disableClose","onClose","refContainer","center","handleStackChange","stack","setState","indexOf","ModalStack","isBlocking","handleContainerMouseDown","event","target","handleContainerMouseUp","handleContainerClick","ignoreBackgroundClick","currentTarget","handleKeyDown","e","checkHorizontalScrollAppearance","hasScroll","containerClientWidth","clientWidth","containerScrollWidth","scrollWidth","throttledCheckHorizontalScroll","handleResize","LayoutEvents","emit","setHasHeader","setHasFooter","setHasPanel","componentDidMount","add","window","addEventListener","componentWillUnmount","removeEventListener","remove","render","theme","renderMain","modalContextProps","noClose","additionalPadding","style","containerStyle","width","styles","root","bg","isMobile","centerContainer","mobileCenterContainer","alignTop","Boolean","undefined","mobileWindow","disableFocusLock","columnFlexContainer","closeWrapper","mobileCloseWrapper","mobileCloseWithoutHeader","children","React","Component","__KONTUR_REACT_UI__","Header","ModalHeader","Body","ModalBody","Footer","ModalFooter","defaultProps","isIE11"],"mappings":"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","sourcesContent":["import React from 'react';\nimport FocusLock from 'react-focus-lock';\nimport throttle from 'lodash.throttle';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../../internal/RenderContainer';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { stopPropagation } from '../../lib/events/stopPropagation';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll';\nimport { ModalStack, ModalStackSubscription } from '../../lib/ModalStack';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isIE11 } from '../../lib/client';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\n\nimport { ModalContext, ModalContextProps } from './ModalContext';\nimport { ModalFooter } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { ModalClose } from './ModalClose';\nimport { styles } from './Modal.styles';\n\nlet mountedModalsCount = 0;\n\nexport interface ModalProps extends CommonProps {\n /*\n Отключает событие onClose, также дизейблит кнопку закрытия модалки\n /\n disableClose?: boolean;\n\n /\n Выравнивание окна по верху страницы.\n /\n alignTop?: boolean;\n\n /\n Не закрывать окно при клике на фон.\n /\n ignoreBackgroundClick?: boolean;\n\n /\n Не показывать крестик для закрытия окна.\n /\n noClose?: boolean;\n width?: number \| string;\n\n /\n Вызывается, когда пользователь запросил закрытие окна (нажал на фон, на\n * Escape или на крестик).\n /\n onClose?: () => void;\n\n /\n Не использовать фокус-лок внутри модалки.\n * По умолчанию true для IE11.\n /\n disableFocusLock?: boolean;\n}\n\nexport interface ModalState {\n stackPosition: number;\n hasBackground: boolean;\n horizontalScroll: boolean;\n hasHeader: boolean;\n hasFooter: boolean;\n hasPanel: boolean;\n}\n\nexport const ModalDataTids = {\n container: 'modal-container',\n content: 'modal-content',\n close: 'modal-close',\n} as const;\n\n/\n Модальное окно\n \n Содержит в себе три компоненты: Modal.Header,\n * Modal.Body и Modal.Footer\n \n Для отображения серой плашки в футере в компонент\n * Footer необходимо передать пропс panel\n \n Для отключения прилипания шапки и футера\n * в соответствующий компонент нужно передать\n * проп sticky со значением false\n * (по-умолчанию прилипание включено)\n */\nexport class Modal extends React.Component<ModalProps, ModalState> {\n public static __KONTUR_REACT_UI__ = 'Modal';\n\n public static Header = ModalHeader;\n public static Body = ModalBody;\n public static Footer = ModalFooter;\n\n public static defaultProps = {\n // NOTE: в ie нормально не работает\n disableFocusLock: isIE11,\n };\n\n public state: ModalState = {\n stackPosition: 0,\n hasBackground: true,\n horizontalScroll: false,\n hasHeader: false,\n hasFooter: false,\n hasPanel: false,\n };\n\n private theme!: Theme;\n private stackSubscription: ModalStackSubscription \| null = null;\n private containerNode: HTMLDivElement \| null = null;\n private mouseDownTarget: EventTarget \| null = null;\n private mouseUpTarget: EventTarget \| null = null;\n\n public componentDidMount() {\n this.stackSubscription = ModalStack.add(this, this.handleStackChange);\n\n if (mountedModalsCount === 0) {\n window.addEventListener('resize', this.throttledCheckHorizontalScroll);\n }\n\n mountedModalsCount++;\n window.addEventListener('keydown', this.handleKeyDown);\n this.checkHorizontalScrollAppearance();\n\n if (this.containerNode) {\n this.containerNode.addEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public componentWillUnmount() {\n if (--mountedModalsCount === 0) {\n window.removeEventListener('resize', this.throttledCheckHorizontalScroll);\n LayoutEvents.emit();\n }\n\n window.removeEventListener('keydown', this.handleKeyDown);\n if (isNonNullable(this.stackSubscription)) {\n this.stackSubscription.remove();\n }\n ModalStack.remove(this);\n\n if (this.containerNode) {\n this.containerNode.removeEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { hasHeader, hasFooter, hasPanel } = this.state;\n\n const modalContextProps: ModalContextProps = {\n hasHeader,\n horizontalScroll: this.state.horizontalScroll,\n setHasHeader: this.setHasHeader,\n setHasFooter: this.setHasFooter,\n setHasPanel: this.setHasPanel,\n };\n if (!this.props.noClose) {\n modalContextProps.close = {\n disableClose: this.props.disableClose,\n requestClose: this.requestClose,\n };\n }\n if (!hasFooter) {\n modalContextProps.additionalPadding = true;\n }\n if (hasFooter && hasPanel) {\n modalContextProps.additionalPadding = true;\n }\n\n const style: { width?: number \| string } = {};\n const containerStyle: { width?: number \| string } = {};\n\n if (this.props.width) {\n style.width = this.props.width;\n } else {\n containerStyle.width = 'auto';\n }\n\n return (\n <RenderContainer>\n <CommonWrapper {...this.props}>\n <ZIndex priority={'Modal'} className={styles.root()}>\n <HideBodyVerticalScroll />\n {this.state.hasBackground && <div className={styles.bg(this.theme)} />}\n <div\n ref={this.refContainer}\n className={styles.container()}\n onMouseDown={this.handleContainerMouseDown}\n onMouseUp={this.handleContainerMouseUp}\n onClick={this.handleContainerClick}\n data-tid={ModalDataTids.container}\n >\n <ResponsiveLayout>\n {({ isMobile }) => {\n return (\n <div\n className={cx({\n [styles.centerContainer(this.theme)]: true,\n [styles.mobileCenterContainer()]: isMobile,\n [styles.alignTop()]: Boolean(this.props.alignTop),\n })}\n style={isMobile ? undefined : containerStyle}\n data-tid={ModalDataTids.content}\n >\n <div\n className={cx({ [styles.window(this.theme)]: true, [styles.mobileWindow()]: isMobile })}\n style={isMobile ? undefined : style}\n >\n <ResizeDetector onResize={this.handleResize} fullHeight={isMobile}>\n <FocusLock\n disabled={this.props.disableFocusLock}\n autoFocus={false}\n className={cx({ [styles.columnFlexContainer()]: isMobile }, 'focus-lock-container')}\n >\n {!hasHeader && !this.props.noClose && (\n <ZIndex\n priority={'ModalCross'}\n className={cx({\n [styles.closeWrapper(this.theme)]: true,\n [styles.mobileCloseWrapper(this.theme)]: isMobile,\n })}\n >\n <ModalClose\n className={cx({\n [styles.mobileCloseWithoutHeader()]: isMobile && !this.state.hasHeader,\n })}\n requestClose={this.requestClose}\n disableClose={this.props.disableClose}\n />\n </ZIndex>\n )}\n <ModalContext.Provider value={modalContextProps}>\n {this.props.children}\n </ModalContext.Provider>\n </FocusLock>\n </ResizeDetector>\n </div>\n </div>\n );\n }}\n </ResponsiveLayout>\n </div>\n </ZIndex>\n </CommonWrapper>\n </RenderContainer>\n );\n }\n\n private requestClose = () => {\n if (this.props.disableClose) {\n return;\n }\n if (this.props.onClose) {\n this.props.onClose();\n }\n };\n\n private refContainer = (center: HTMLDivElement \| null) => {\n this.containerNode = center;\n };\n\n private handleStackChange = (stack: readonly React.Component[]) => {\n this.setState({ stackPosition: stack.indexOf(this), hasBackground: ModalStack.isBlocking(this) });\n };\n\n private handleContainerMouseDown = (event: React.MouseEvent) => {\n this.mouseDownTarget = event.target;\n };\n\n private handleContainerMouseUp = (event: React.MouseEvent) => {\n this.mouseUpTarget = event.target;\n };\n\n private handleContainerClick = (event: React.MouseEvent<HTMLDivElement>) => {\n if (!this.props.ignoreBackgroundClick) {\n const { target, currentTarget } = event;\n if (target === currentTarget && this.mouseDownTarget === currentTarget && this.mouseUpTarget === currentTarget) {\n this.requestClose();\n }\n }\n };\n\n private handleKeyDown = (e: KeyboardEvent) => {\n if (this.state.stackPosition !== 0) {\n return;\n }\n if (isKeyEscape(e)) {\n stopPropagation(e);\n this.requestClose();\n }\n };\n\n private checkHorizontalScrollAppearance = () => {\n let hasScroll = false;\n\n if (this.containerNode) {\n const containerClientWidth = this.containerNode.clientWidth;\n const containerScrollWidth = this.containerNode.scrollWidth;\n hasScroll = containerClientWidth < containerScrollWidth;\n }\n if (hasScroll && !this.state.horizontalScroll) {\n this.setState({ horizontalScroll: true });\n } else if (this.state.horizontalScroll) {\n this.setState({ horizontalScroll: false });\n }\n };\n\n private throttledCheckHorizontalScroll = throttle(this.checkHorizontalScrollAppearance, 100);\n\n private handleResize = (event: UIEvent) => {\n LayoutEvents.emit();\n };\n\n private setHasHeader = (hasHeader = true) => {\n this.state.hasHeader !== hasHeader && this.setState({ hasHeader });\n };\n\n private setHasFooter = (hasFooter = true) => {\n this.state.hasFooter !== hasFooter && this.setState({ hasFooter });\n };\n\n private setHasPanel = (hasPanel = false) => {\n this.state.hasPanel !== hasPanel && this.setState({ hasPanel });\n };\n}\n"]}

package/cjs/components/Modal/ModalClose.js CHANGED Viewed

@@ -8,7 +8,8 @@ var _ResponsiveLayout = require("../ResponsiveLayout");
 var _CommonWrapper = require("../../internal/CommonWrapper");
-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);
@@ -42,7 +43,7 @@ function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _
           onClick: requestClose,
           onFocus: handleFocus,
           onBlur: handleBlur,
-          "data-tid": "modal-close",
+          "data-tid": _Modal2.ModalDataTids.close,
           tabIndex: disableClose ? -1 : 0 }, /*#__PURE__*/
         _react.default.createElement(_CrossIcon.CrossIcon, null)));})));

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

	@@ -1 +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"]}
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","ModalDataTids"],"mappings":"wRAAA;;AAEA;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;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,sBAAUO,sBAAcJ,KAV1B;AAWE,UAAA,QAAQ,EAAEhB,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';\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 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 <CrossIcon />\n </button>\n )}\n </ResponsiveLayout>\n </CommonWrapper>\n );\n}\n"]}

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

@@ -8,6 +8,9 @@ export interface ModalFooterProps extends CommonProps {
     sticky?: boolean;
     children?: ReactNode;
 }
+export declare const ModalFooterDataTids: {
+    readonly root: "ModalFooter__root";
+};
 /**
  * Футер модального окна.
  *

package/cjs/components/Modal/ModalFooter.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"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");
@@ -20,11 +20,15 @@ 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);
@@ -32,7 +36,7 @@ function ModalFooter(props) {
   var _props$sticky = props.sticky,sticky = _props$sticky === void 0 ? !layout.isMobile : _props$sticky,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);
@@ -45,6 +49,7 @@ function ModalFooter(props) {
   var renderContent = function renderContent(fixed) {var _cx;if (fixed === void 0) {fixed = false;}
     return /*#__PURE__*/(
       _react.default.createElement("div", {
+        "data-tid": ModalFooterDataTids.root,
         className: (0, _Emotion.cx)((_cx = {}, _cx[
         _Modal.styles.footer(theme)] = true, _cx[
         _Modal.styles.fixedFooter(theme)] = fixed, _cx[

package/cjs/components/Modal/ModalFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["ModalFooter.tsx"],"names":["ModalFooter","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","panel","children","setHasFooter","setHasPanel","renderContent","fixed","styles","footer","fixedFooter","Boolean","fixedPanel","mobileFooter","footerWrapper","horizontalScroll","__KONTUR_REACT_UI__","__MODAL_FOOTER__"],"mappings":"~~yEAAA~~;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8C;;;;;;;;;;;~~AAWA~~;AACA;AACA;AACA;AACA;AACA,~~SAASA~~,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAuDL,KAAvD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,KAAnC,GAAuDR,KAAvD,CAAmCQ,KAAnC,CAA0CC,QAA1C,GAAuDT,KAAvD,CAA0CS,QAA1C;;AAEA,~~wBAAU~~,YAAM;~~AACdN~~,IAAAA,KAAK,CAACO,YAAN,oBAAAP,KAAK,CAACO,YAAN;AACAP,IAAAA,KAAK,CAACQ,WAAN,oBAAAR,KAAK,CAACQ,WAAN,CAAoBH,KAApB;;AAEA,WAAO,YAAM;AACXL,MAAAA,KAAK,CAACO,YAAN,oBAAAP,KAAK,CAACO,YAAN,CAAqB,KAArB;AACAP,MAAAA,KAAK,CAACQ,WAAN,oBAAAR,KAAK,CAACQ,WAAN,CAAoB,KAApB;AACD,KAHD;AAID,GARD,EAQG,CAACH,KAAD,CARH;;AAUA,MAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,QAAA,SAAS,EAAE;~~AACRC~~,sBAAOC,MAAP,CAAcd,KAAd,CADQ,IACe,IADf;AAERa,sBAAOE,WAAP,CAAmBf,KAAnB,CAFQ,IAEoBY,KAFpB;AAGRC,sBAAON,KAAP,CAAaP,KAAb,CAHQ,IAGcgB,OAAO,CAACT,KAAD,CAHrB;AAIRM,sBAAOI,UAAP,CAAkBjB,KAAlB,CAJQ,IAImBY,KAAK,IAAII,OAAO,CAACT,KAAD,CAJnC;AAKRM,sBAAOK,YAAP,CAAoBlB,KAApB,CALQ,IAKqBI,MAAM,CAACE,QAL5B,~~OADb~~;;;~~AASGE~~,MAAAA,~~QATH~~,CADF;;;~~AAaD~~,~~GAdD~~;;~~AAgBA~~;AACE,iCAAC,4BAAD,EAAmBT,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEc,cAAOM,aAAP,EAA5C;AACGd,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,IAAI,EAAC,QAAb,EAAsB,MAAM,EAAEH,KAAK,CAACkB,gBAAN,GAAyB,qCAAzB,GAA4C,CAA1E;AACGT,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF,CADF;;;;;AAaD;;AAEDb,WAAW,CAACuB,mBAAZ,GAAkC,aAAlC;AACAvB,WAAW,CAACwB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, ~~useEffect~~ } from 'react';\n\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalContext } from './ModalContext';\n\nexport interface ModalFooterProps extends CommonProps {\n /*\n Включает серый цвет в футере\n /\n panel?: boolean;\n sticky?: boolean;\n children?: ReactNode;\n}\n\n/\n Футер модального окна.\n \n @visibleName Modal.Footer\n */\nfunction ModalFooter(props: ModalFooterProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, panel, children } = props;\n\n ~~useEffect~~(() => {\n modal.setHasFooter?.();\n modal.setHasPanel?.(panel);\n\n return () => {\n modal.setHasFooter?.(false);\n modal.setHasPanel?.(false);\n };\n }, [panel]);\n\n const renderContent = (fixed = false) => {\n return (\n <div\n className={cx({\n [styles.footer(theme)]: true,\n [styles.fixedFooter(theme)]: fixed,\n [styles.panel(theme)]: Boolean(panel),\n [styles.fixedPanel(theme)]: fixed && Boolean(panel),\n [styles.mobileFooter(theme)]: layout.isMobile,\n })}\n >\n {children}\n </div>\n );\n };\n\n return (\n <CommonWrapper {...props}>\n <ZIndex priority={'ModalFooter'} className={styles.footerWrapper()}>\n {sticky ? (\n <Sticky side=\"bottom\" offset={modal.horizontalScroll ? getScrollWidth() : 0}>\n {renderContent}\n </Sticky>\n ) : (\n renderContent()\n )}\n </ZIndex>\n </CommonWrapper>\n );\n}\n\nModalFooter.__KONTUR_REACT_UI__ = 'ModalFooter';\nModalFooter.__MODAL_FOOTER__ = true;\n\nexport { ModalFooter };\n"]}
1	+ {"version":3,"sources":["ModalFooter.tsx"],"names":["ModalFooterDataTids","root","ModalFooter","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","panel","children","setHasFooter","setHasPanel","renderContent","fixed","styles","footer","fixedFooter","Boolean","fixedPanel","mobileFooter","footerWrapper","horizontalScroll","__KONTUR_REACT_UI__","__MODAL_FOOTER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA,8C;;;;;;;;;;;AAWO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAuDL,KAAvD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,KAAnC,GAAuDR,KAAvD,CAAmCQ,KAAnC,CAA0CC,QAA1C,GAAuDT,KAAvD,CAA0CS,QAA1C;;AAEA,8BAAgB,YAAM;AACpBN,IAAAA,KAAK,CAACO,YAAN,oBAAAP,KAAK,CAACO,YAAN;AACAP,IAAAA,KAAK,CAACQ,WAAN,oBAAAR,KAAK,CAACQ,WAAN,CAAoBH,KAApB;;AAEA,WAAO,YAAM;AACXL,MAAAA,KAAK,CAACO,YAAN,oBAAAP,KAAK,CAACO,YAAN,CAAqB,KAArB;AACAP,MAAAA,KAAK,CAACQ,WAAN,oBAAAR,KAAK,CAACQ,WAAN,CAAoB,KAApB;AACD,KAHD;AAID,GARD,EAQG,CAACH,KAAD,CARH;;AAUA,MAAMI,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,oBAAUhB,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACRgB,sBAAOC,MAAP,CAAcd,KAAd,CADQ,IACe,IADf;AAERa,sBAAOE,WAAP,CAAmBf,KAAnB,CAFQ,IAEoBY,KAFpB;AAGRC,sBAAON,KAAP,CAAaP,KAAb,CAHQ,IAGcgB,OAAO,CAACT,KAAD,CAHrB;AAIRM,sBAAOI,UAAP,CAAkBjB,KAAlB,CAJQ,IAImBY,KAAK,IAAII,OAAO,CAACT,KAAD,CAJnC;AAKRM,sBAAOK,YAAP,CAAoBlB,KAApB,CALQ,IAKqBI,MAAM,CAACE,QAL5B,OAFb;;;AAUGE,MAAAA,QAVH,CADF;;;AAcD,GAfD;;AAiBA;AACE,iCAAC,4BAAD,EAAmBT,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEc,cAAOM,aAAP,EAA5C;AACGd,IAAAA,MAAM;AACL,iCAAC,cAAD,IAAQ,IAAI,EAAC,QAAb,EAAsB,MAAM,EAAEH,KAAK,CAACkB,gBAAN,GAAyB,qCAAzB,GAA4C,CAA1E;AACGT,IAAAA,aADH,CADK;;;AAKLA,IAAAA,aAAa,EANjB,CADF,CADF;;;;;AAaD;;AAEDb,WAAW,CAACuB,mBAAZ,GAAkC,aAAlC;AACAvB,WAAW,CAACwB,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { getScrollWidth } from '../../lib/dom/getScrollWidth';\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalContext } from './ModalContext';\n\nexport interface ModalFooterProps extends CommonProps {\n /*\n Включает серый цвет в футере\n /\n panel?: boolean;\n sticky?: boolean;\n children?: ReactNode;\n}\n\nexport const ModalFooterDataTids = {\n root: 'ModalFooter__root',\n} as const;\n\n/\n Футер модального окна.\n \n @visibleName Modal.Footer\n */\nfunction ModalFooter(props: ModalFooterProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, panel, children } = props;\n\n useLayoutEffect(() => {\n modal.setHasFooter?.();\n modal.setHasPanel?.(panel);\n\n return () => {\n modal.setHasFooter?.(false);\n modal.setHasPanel?.(false);\n };\n }, [panel]);\n\n const renderContent = (fixed = false) => {\n return (\n <div\n data-tid={ModalFooterDataTids.root}\n className={cx({\n [styles.footer(theme)]: true,\n [styles.fixedFooter(theme)]: fixed,\n [styles.panel(theme)]: Boolean(panel),\n [styles.fixedPanel(theme)]: fixed && Boolean(panel),\n [styles.mobileFooter(theme)]: layout.isMobile,\n })}\n >\n {children}\n </div>\n );\n };\n\n return (\n <CommonWrapper {...props}>\n <ZIndex priority={'ModalFooter'} className={styles.footerWrapper()}>\n {sticky ? (\n <Sticky side=\"bottom\" offset={modal.horizontalScroll ? getScrollWidth() : 0}>\n {renderContent}\n </Sticky>\n ) : (\n renderContent()\n )}\n </ZIndex>\n </CommonWrapper>\n );\n}\n\nModalFooter.__KONTUR_REACT_UI__ = 'ModalFooter';\nModalFooter.__MODAL_FOOTER__ = true;\n\nexport { ModalFooter };\n"]}

package/cjs/components/Modal/ModalHeader.d.ts CHANGED Viewed

@@ -4,6 +4,9 @@ export interface ModalHeaderProps extends CommonProps {
     sticky?: boolean;
     children?: ReactNode;
 }
+export declare const ModalHeaderDataTids: {
+    readonly root: "ModalHeader__root";
+};
 /**
  * Шапка модального окна
  *

package/cjs/components/Modal/ModalHeader.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;exports.ModalHeader = ModalHeader;var _react = _interopRequireWildcard(require("react"));
+"use strict";exports.__esModule = true;exports.ModalHeader = ModalHeader;exports.ModalHeaderDataTids = void 0;var _react = _interopRequireWildcard(require("react"));
 var _Sticky = require("../Sticky");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
@@ -15,11 +15,16 @@ var _ModalContext = require("./ModalContext");function _getRequireWildcardCache(
+var ModalHeaderDataTids = {
+  root: 'ModalHeader__root' };
 /**
  * Шапка модального окна
  *
  * @visibleName Modal.Header
- */
+ */exports.ModalHeaderDataTids = ModalHeaderDataTids;
 function ModalHeader(props) {
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
   var modal = (0, _react.useContext)(_ModalContext.ModalContext);
@@ -27,7 +32,7 @@ function ModalHeader(props) {
   var _props$sticky = props.sticky,sticky = _props$sticky === void 0 ? !layout.isMobile : _props$sticky,children = props.children;
-  (0, _react.useEffect)(function () {
+  (0, _react.useLayoutEffect)(function () {
     modal.setHasHeader == null ? void 0 : modal.setHasHeader();
     return function () {return modal.setHasHeader == null ? void 0 : modal.setHasHeader(false);};
@@ -36,6 +41,7 @@ function ModalHeader(props) {
   var renderContent = function renderContent(fixed) {var _cx;if (fixed === void 0) {fixed = false;}
     return /*#__PURE__*/(
       _react.default.createElement("div", {
+        "data-tid": ModalHeaderDataTids.root,
         className: (0, _Emotion.cx)((_cx = {}, _cx[
         _Modal.styles.header(theme)] = true, _cx[
         _Modal.styles.mobileHeader(theme)] = layout.isMobile, _cx[

package/cjs/components/Modal/ModalHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeader","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","headerAddPadding","Boolean","additionalPadding","fixedHeader","mobileFixedHeader","headerWithClose","close","mobileHeaderWithClose","requestClose","disableClose","headerWrapper","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"~~yEAAA~~;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,8C~~;;;;;;AAMA~~;AACA;AACA;AACA;AACA;AACA,~~SAASA~~,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAgDL,KAAhD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,QAAnC,GAAgDR,KAAhD,CAAmCQ,QAAnC;;AAEA,~~wBAAU~~,YAAM;~~AACdL~~,IAAAA,KAAK,CAACM,YAAN,oBAAAN,KAAK,CAACM,YAAN;;AAEA,WAAO,oBAAMN,KAAK,CAACM,YAAZ,oBAAMN,KAAK,CAACM,YAAN,CAAqB,KAArB,CAAN,EAAP;AACD,GAJD,EAIG,EAJH;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,QAAA,SAAS,EAAE;~~AACRC~~,sBAAOC,MAAP,CAAcZ,KAAd,CADQ,IACe,IADf;AAERW,sBAAOE,YAAP,CAAoBb,KAApB,CAFQ,IAEqBI,MAAM,CAACE,QAF5B;AAGRK,sBAAOG,gBAAP,EAHQ,IAGoBC,OAAO,CAACb,KAAK,CAACc,iBAAP,CAH3B;AAIRL,sBAAOM,WAAP,CAAmBjB,KAAnB,CAJQ,IAIoBU,KAJpB;AAKRC,sBAAOO,iBAAP,CAAyBlB,KAAzB,CALQ,IAK0BU,KAAK,IAAIN,MAAM,CAACE,QAL1C;AAMRK,sBAAOQ,eAAP,CAAuBnB,KAAvB,CANQ,IAMwBe,OAAO,CAACb,KAAK,CAACkB,KAAP,CAN/B;AAORT,sBAAOU,qBAAP,CAA6BrB,KAA7B,CAPQ,IAO8BI,MAAM,CAACE,QAPrC,~~OADb~~;;;~~AAWGJ~~,MAAAA,KAAK,CAACkB,KAAN,iBAAe,6BAAC,sBAAD,IAAY,YAAY,EAAElB,KAAK,CAACkB,KAAN,CAAYE,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACkB,KAAN,CAAYG,YAA9E,~~GAXlB~~;~~AAYGhB~~,MAAAA,~~QAZH~~,CADF;;;~~AAgBD~~,~~GAjBD~~;;~~AAmBA~~;AACE,iCAAC,4BAAD,EAAmBR,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEY,cAAOa,aAAP,EAA5C;AACGnB,IAAAA,MAAM,gBAAG,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EADvE,CADF,CADF;;;;AAOD;;AAEDX,WAAW,CAAC2B,mBAAZ,GAAkC,aAAlC;AACA3B,WAAW,CAAC4B,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, ~~useEffect~~ } from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalClose } from './ModalClose';\nimport { ModalContext } from './ModalContext';\n\nexport interface ModalHeaderProps extends CommonProps {\n sticky?: boolean;\n children?: ReactNode;\n}\n/*\n Шапка модального окна\n \n @visibleName Modal.Header\n */\nfunction ModalHeader(props: ModalHeaderProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, children } = props;\n\n ~~useEffect~~(() => {\n modal.setHasHeader?.();\n\n return () => modal.setHasHeader?.(false);\n }, []);\n\n const renderContent = (fixed = false) => {\n return (\n <div\n className={cx({\n [styles.header(theme)]: true,\n [styles.mobileHeader(theme)]: layout.isMobile,\n [styles.headerAddPadding()]: Boolean(modal.additionalPadding),\n [styles.fixedHeader(theme)]: fixed,\n [styles.mobileFixedHeader(theme)]: fixed && layout.isMobile,\n [styles.headerWithClose(theme)]: Boolean(modal.close),\n [styles.mobileHeaderWithClose(theme)]: layout.isMobile,\n })}\n >\n {modal.close && <ModalClose requestClose={modal.close.requestClose} disableClose={modal.close.disableClose} />}\n {children}\n </div>\n );\n };\n\n return (\n <CommonWrapper {...props}>\n <ZIndex priority={'ModalHeader'} className={styles.headerWrapper()}>\n {sticky ? <Sticky side=\"top\">{renderContent}</Sticky> : renderContent()}\n </ZIndex>\n </CommonWrapper>\n );\n}\n\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\nModalHeader.__MODAL_HEADER__ = true;\n\nexport { ModalHeader };\n"]}
1	+ {"version":3,"sources":["ModalHeader.tsx"],"names":["ModalHeaderDataTids","root","ModalHeader","props","theme","ThemeContext","modal","ModalContext","layout","sticky","isMobile","children","setHasHeader","renderContent","fixed","styles","header","mobileHeader","headerAddPadding","Boolean","additionalPadding","fixedHeader","mobileFixedHeader","headerWithClose","close","mobileHeaderWithClose","requestClose","disableClose","headerWrapper","__KONTUR_REACT_UI__","__MODAL_HEADER__"],"mappings":"8GAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,8C;;;;;;;AAOO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B;;;AAIP;AACA;AACA;AACA;AACA,G;AACA,SAASC,WAAT,CAAqBC,KAArB,EAA8C;AAC5C,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,MAAMC,MAAM,GAAG,4CAAf;;AAEA,sBAAgDL,KAAhD,CAAQM,MAAR,CAAQA,MAAR,8BAAiB,CAACD,MAAM,CAACE,QAAzB,iBAAmCC,QAAnC,GAAgDR,KAAhD,CAAmCQ,QAAnC;;AAEA,8BAAgB,YAAM;AACpBL,IAAAA,KAAK,CAACM,YAAN,oBAAAN,KAAK,CAACM,YAAN;;AAEA,WAAO,oBAAMN,KAAK,CAACM,YAAZ,oBAAMN,KAAK,CAACM,YAAN,CAAqB,KAArB,CAAN,EAAP;AACD,GAJD,EAIG,EAJH;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAAmB,aAAlBA,KAAkB,cAAlBA,KAAkB,GAAV,KAAU;AACvC;AACE;AACE,oBAAUd,mBAAmB,CAACC,IADhC;AAEE,QAAA,SAAS,EAAE;AACRc,sBAAOC,MAAP,CAAcZ,KAAd,CADQ,IACe,IADf;AAERW,sBAAOE,YAAP,CAAoBb,KAApB,CAFQ,IAEqBI,MAAM,CAACE,QAF5B;AAGRK,sBAAOG,gBAAP,EAHQ,IAGoBC,OAAO,CAACb,KAAK,CAACc,iBAAP,CAH3B;AAIRL,sBAAOM,WAAP,CAAmBjB,KAAnB,CAJQ,IAIoBU,KAJpB;AAKRC,sBAAOO,iBAAP,CAAyBlB,KAAzB,CALQ,IAK0BU,KAAK,IAAIN,MAAM,CAACE,QAL1C;AAMRK,sBAAOQ,eAAP,CAAuBnB,KAAvB,CANQ,IAMwBe,OAAO,CAACb,KAAK,CAACkB,KAAP,CAN/B;AAORT,sBAAOU,qBAAP,CAA6BrB,KAA7B,CAPQ,IAO8BI,MAAM,CAACE,QAPrC,OAFb;;;AAYGJ,MAAAA,KAAK,CAACkB,KAAN,iBAAe,6BAAC,sBAAD,IAAY,YAAY,EAAElB,KAAK,CAACkB,KAAN,CAAYE,YAAtC,EAAoD,YAAY,EAAEpB,KAAK,CAACkB,KAAN,CAAYG,YAA9E,GAZlB;AAaGhB,MAAAA,QAbH,CADF;;;AAiBD,GAlBD;;AAoBA;AACE,iCAAC,4BAAD,EAAmBR,KAAnB;AACE,iCAAC,cAAD,IAAQ,QAAQ,EAAE,aAAlB,EAAiC,SAAS,EAAEY,cAAOa,aAAP,EAA5C;AACGnB,IAAAA,MAAM,gBAAG,6BAAC,cAAD,IAAQ,IAAI,EAAC,KAAb,IAAoBI,aAApB,CAAH,GAAiDA,aAAa,EADvE,CADF,CADF;;;;AAOD;;AAEDX,WAAW,CAAC2B,mBAAZ,GAAkC,aAAlC;AACA3B,WAAW,CAAC4B,gBAAZ,GAA+B,IAA/B","sourcesContent":["import React, { ReactNode, useContext, useLayoutEffect } from 'react';\n\nimport { Sticky } from '../Sticky';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { useResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './Modal.styles';\nimport { ModalClose } from './ModalClose';\nimport { ModalContext } from './ModalContext';\n\nexport interface ModalHeaderProps extends CommonProps {\n sticky?: boolean;\n children?: ReactNode;\n}\n\nexport const ModalHeaderDataTids = {\n root: 'ModalHeader__root',\n} as const;\n\n/*\n Шапка модального окна\n \n @visibleName Modal.Header\n */\nfunction ModalHeader(props: ModalHeaderProps) {\n const theme = useContext(ThemeContext);\n const modal = useContext(ModalContext);\n const layout = useResponsiveLayout();\n\n const { sticky = !layout.isMobile, children } = props;\n\n useLayoutEffect(() => {\n modal.setHasHeader?.();\n\n return () => modal.setHasHeader?.(false);\n }, []);\n\n const renderContent = (fixed = false) => {\n return (\n <div\n data-tid={ModalHeaderDataTids.root}\n className={cx({\n [styles.header(theme)]: true,\n [styles.mobileHeader(theme)]: layout.isMobile,\n [styles.headerAddPadding()]: Boolean(modal.additionalPadding),\n [styles.fixedHeader(theme)]: fixed,\n [styles.mobileFixedHeader(theme)]: fixed && layout.isMobile,\n [styles.headerWithClose(theme)]: Boolean(modal.close),\n [styles.mobileHeaderWithClose(theme)]: layout.isMobile,\n })}\n >\n {modal.close && <ModalClose requestClose={modal.close.requestClose} disableClose={modal.close.disableClose} />}\n {children}\n </div>\n );\n };\n\n return (\n <CommonWrapper {...props}>\n <ZIndex priority={'ModalHeader'} className={styles.headerWrapper()}>\n {sticky ? <Sticky side=\"top\">{renderContent}</Sticky> : renderContent()}\n </ZIndex>\n </CommonWrapper>\n );\n}\n\nModalHeader.__KONTUR_REACT_UI__ = 'ModalHeader';\nModalHeader.__MODAL_HEADER__ = true;\n\nexport { ModalHeader };\n"]}

package/cjs/components/Paging/Paging.d.ts CHANGED Viewed

@@ -49,13 +49,20 @@ export interface PagingState {
     keyboardControl: boolean;
 }
 export declare type ItemType = number | '.' | 'forward';
+export declare const PagingDataTids: {
+    readonly root: "Paging__root";
+    readonly dots: "Paging__dots";
+    readonly forwardLink: "Paging__forwardLink";
+    readonly pageLinkWrapper: "Paging__pageLinkWrapper";
+    readonly pageLink: "Paging__pageLink";
+};
 export declare class Paging extends React.PureComponent<PagingProps, PagingState> {
     static __KONTUR_REACT_UI__: string;
     static defaultProps: {
         component: ({ onClick, className, children, ...rest }: import("./PagingDefaultComponent").PagingDefaultComponentProps) => JSX.Element;
         shouldBeVisibleWithLessThanTwoPages: boolean;
         useGlobalListener: boolean;
-        'data-tid': string;
+        'data-tid': "Paging__root";
     };
     static propTypes: {};
     private setRootNode;

package/cjs/components/Paging/Paging.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Paging = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.PagingDataTids = exports.Paging = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("prop-types");
 var _identifiers = require("../../lib/events/keyboard/identifiers");
@@ -20,7 +20,7 @@ var _PagingHelper = require("./PagingHelper");
 var _locale = require("./locale");
 var _PagingDefaultComponent = require("./PagingDefaultComponent");var _dec, _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 IGNORE_EVENT_TAGS = ['input', 'textarea'];var
+var IGNORE_EVENT_TAGS = ['input', 'textarea'];
@@ -72,6 +72,14 @@ var IGNORE_EVENT_TAGS = ['input', 'textarea'];var
+var PagingDataTids = {
+  root: 'Paging__root',
+  dots: 'Paging__dots',
+  forwardLink: 'Paging__forwardLink',
+  pageLinkWrapper: 'Paging__pageLinkWrapper',
+  pageLink: 'Paging__pageLink' };exports.PagingDataTids = PagingDataTids;var
@@ -185,7 +193,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     renderDots = function (key) {
       return /*#__PURE__*/(
-        _react.default.createElement("span", { "data-tid": "Paging__dots", key: key, className: _Paging.styles.dots(_this.theme) },
+        _react.default.createElement("span", { "data-tid": PagingDataTids.dots, key: key, className: _Paging.styles.dots(_this.theme) },
         '...'));
@@ -203,7 +211,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
       return /*#__PURE__*/(
         _react.default.createElement(Component, {
           key: 'forward',
-          "data-tid": "Paging__forwardLink",
+          "data-tid": PagingDataTids.forwardLink,
           active: false,
           className: classes,
           onClick: disabled ? _utils.emptyHandler : _this.goForward,
@@ -229,13 +237,13 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
       return /*#__PURE__*/(
         _react.default.createElement("span", {
-          "data-tid": "Paging__pageLinkWrapper",
+          "data-tid": PagingDataTids.pageLinkWrapper,
           key: pageNumber,
           className: _Paging.styles.pageLinkWrapper(),
           onMouseDown: _this.handleMouseDownPageLink }, /*#__PURE__*/
         _react.default.createElement(Component, {
-          "data-tid": "Paging__pageLink",
+          "data-tid": PagingDataTids.pageLink,
           active: active,
           className: classes,
           onClick: handleClick,
@@ -448,7 +456,7 @@ Paging = (_dec = (0, _decorators.locale)('Paging', _locale.PagingLocaleHelper),
     refContainer = function (element) {
       _this.container = element;
-    };return _this;}Paging.isForward = function isForward(pageNumber) /* %checks */{return pageNumber === 'forward';};var _proto = Paging.prototype;_proto.componentDidMount = function componentDidMount() {var useGlobalListener = this.props.useGlobalListener;if (useGlobalListener) {this.addGlobalListener();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (!prevProps.useGlobalListener && this.props.useGlobalListener) {this.addGlobalListener();}if (prevProps.useGlobalListener && !this.props.useGlobalListener) {this.removeGlobalListener();}if (prevProps.useGlobalListener !== this.props.useGlobalListener) {this.setState({ keyboardControl: this.props.useGlobalListener });}};_proto.componentWillUnmount = function componentWillUnmount() {this.removeGlobalListener();};_proto.render = function render() {var _this2 = this;if (this.props.pagesCount < 2 && !this.props.shouldBeVisibleWithLessThanTwoPages) {return null;}return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", { tabIndex: 0, "data-tid": this.props['data-tid'], className: _Paging.styles.paging(this.theme), onKeyDown: this.props.useGlobalListener ? undefined : this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, ref: this.refContainer }, this.getItems().map(this.renderItem)));};return Paging;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Paging', _class2.defaultProps = { component: _PagingDefaultComponent.PagingDefaultComponent, shouldBeVisibleWithLessThanTwoPages: true, useGlobalListener: false, 'data-tid': 'Paging__root' }, _class2.propTypes = {}, _temp)) || _class) || _class);exports.Paging = Paging;
+    };return _this;}Paging.isForward = function isForward(pageNumber) /* %checks */{return pageNumber === 'forward';};var _proto = Paging.prototype;_proto.componentDidMount = function componentDidMount() {var useGlobalListener = this.props.useGlobalListener;if (useGlobalListener) {this.addGlobalListener();}};_proto.componentDidUpdate = function componentDidUpdate(prevProps) {if (!prevProps.useGlobalListener && this.props.useGlobalListener) {this.addGlobalListener();}if (prevProps.useGlobalListener && !this.props.useGlobalListener) {this.removeGlobalListener();}if (prevProps.useGlobalListener !== this.props.useGlobalListener) {this.setState({ keyboardControl: this.props.useGlobalListener });}};_proto.componentWillUnmount = function componentWillUnmount() {this.removeGlobalListener();};_proto.render = function render() {var _this2 = this;if (this.props.pagesCount < 2 && !this.props.shouldBeVisibleWithLessThanTwoPages) {return null;}return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", { tabIndex: 0, "data-tid": this.props['data-tid'], className: _Paging.styles.paging(this.theme), onKeyDown: this.props.useGlobalListener ? undefined : this.handleKeyDown, onFocus: this.handleFocus, onBlur: this.handleBlur, onMouseDown: this.handleMouseDown, ref: this.refContainer }, this.getItems().map(this.renderItem)));};return Paging;}(_react.default.PureComponent), _class2.__KONTUR_REACT_UI__ = 'Paging', _class2.defaultProps = { component: _PagingDefaultComponent.PagingDefaultComponent, shouldBeVisibleWithLessThanTwoPages: true, useGlobalListener: false, 'data-tid': PagingDataTids.root }, _class2.propTypes = {}, _temp)) || _class) || _class);exports.Paging = Paging;
 Paging.propTypes = {