@skbkontur/react-ui 0.0.0-627b6e869c → 0.0.0-69a6fa606f

package/cjs/components/Loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Loader.tsx"],"names":["Loader","rootNode","props","childrenRef","element","childrenContainerNode","spinnerRef","spinnerContainerNode","checkSpinnerPosition","getBoundingClientRect","containerTop","top","containerRight","right","containerBottom","bottom","containerLeft","left","containerHeight","height","containerWidth","width","windowHeight","window","innerHeight","windowWidth","innerWidth","setState","isStickySpinner","spinnerStyle","Math","abs","spinnerNode","spinnerHeight","disableChildrenFocus","childrenObserver","makeObservable","tabbableElements","forEach","el","hasAttribute","setAttribute","tabIndex","toString","enableChildrenFocus","makeUnobservable","Array","from","document","querySelectorAll","getAttribute","removeAttribute","target","config","childList","subtree","observer","MutationObserver","observe","disconnect","state","isSpinnerVisible","isLoaderActive","spinnerTask","TaskWithDelayAndMinimalDuration","delayBeforeTaskStart","delayBeforeSpinnerShow","durationOfTask","minimalDelayBeforeSpinnerHide","taskStartCallback","taskStopCallback","componentDidMount","active","start","layoutEvents","LayoutEvents","addListener","componentDidUpdate","prevProps","prevState","component","update","stop","componentWillUnmount","remove","clearTask","getDerivedStateFromProps","render","theme","renderMain","type","caption","setRootNode","styles","loader","children","renderSpinner","spinnerContainer","spinnerContainerSticky","spinnerComponentWrapper","undefined","React","Component","__KONTUR_REACT_UI__","defaultProps","Spinner","Types","normal","isTestEnv","propTypes","PropTypes","bool","node","className","string","oneOf","Object","keys","number"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from 'lodash.debounce';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Spinner, SpinnerProps } from '../Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { TaskWithDelayAndMinimalDuration } from '../../lib/taskWithDelayAndMinimalDuration';\nimport { getTabbableElements } from '../../lib/dom/tabbableHelpers';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Loader.styles';\n\nexport interface LoaderProps extends CommonProps {\n  children?: React.ReactNode;\n  /**\n   * Флаг переключения состояния лоадера\n   * @default false\n   */\n  active: boolean;\n  caption?: SpinnerProps['caption'];\n  /**\n   * Компонент заменяющий спиннер.\n   */\n  component?: React.ReactNode;\n  className?: string;\n  type?: 'mini' | 'normal' | 'big';\n  /**\n   * Время в миллисекундах для показа вуали без спиннера.\n   * @default 300\n   */\n  delayBeforeSpinnerShow: number;\n  /**\n   * Минимальное время в миллисекундах для показа спиннера\n   * @default 1000\n   */\n  minimalDelayBeforeSpinnerHide: number;\n}\n\nexport interface LoaderState {\n  isStickySpinner: boolean;\n  isSpinnerVisible: boolean;\n  isLoaderActive: boolean;\n  spinnerStyle?: object;\n}\n\n/**\n * DRAFT - лоадер-контейнер\n */\n@rootNode\nexport class Loader extends React.Component<LoaderProps, LoaderState> {\n  public static __KONTUR_REACT_UI__ = 'Loader';\n\n  public static defaultProps: Partial<LoaderProps> = {\n    type: Spinner.Types.normal,\n    active: false,\n    delayBeforeSpinnerShow: isTestEnv ? 0 : 300,\n    minimalDelayBeforeSpinnerHide: isTestEnv ? 0 : 1000,\n  };\n\n  public static propTypes = {\n    /**\n     * показываем лоадер или нет\n     */\n    active: PropTypes.bool,\n\n    /**\n     * Текст рядом с лоадером.\n     *\n     * @default  \"Загрузка\"\n     */\n    caption: Spinner.propTypes.caption,\n\n    component: PropTypes.node,\n\n    /**\n     * Класс для обертки\n     */\n    className: PropTypes.string,\n\n    /**\n     * Тип спиннера: mini, normal, big\n     *\n     * @default  normal\n     *\n     * Spinner.types - все доступные типы\n     */\n    type: PropTypes.oneOf(Object.keys(Spinner.Types)),\n    /**\n     * Время в миллисекундах для показа вуали без спиннера.\n     * @default 300\n     */\n    delayBeforeSpinnerShow: PropTypes.number,\n    /**\n     * Минимальное время в миллисекундах для показа спиннера\n     * @default 1000\n     */\n    minimalDelayBeforeSpinnerHide: PropTypes.number,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n  private spinnerContainerNode: Nullable<HTMLDivElement>;\n  private childrenContainerNode: Nullable<HTMLDivElement>;\n  private spinnerNode: Nullable<HTMLDivElement>;\n  private layoutEvents: Nullable<{ remove: () => void }>;\n  private spinnerTask: TaskWithDelayAndMinimalDuration;\n  private childrenObserver: Nullable<MutationObserver>;\n\n  constructor(props: LoaderProps) {\n    super(props);\n\n    this.spinnerContainerNode = null;\n    this.childrenContainerNode = null;\n    this.childrenObserver = null;\n    this.spinnerNode = null;\n\n    this.state = {\n      isStickySpinner: false,\n      isSpinnerVisible: false,\n      isLoaderActive: false,\n    };\n\n    this.spinnerTask = new TaskWithDelayAndMinimalDuration({\n      delayBeforeTaskStart: this.props.delayBeforeSpinnerShow,\n      durationOfTask: this.props.minimalDelayBeforeSpinnerHide,\n      taskStartCallback: () => this.setState({ isSpinnerVisible: true }),\n      taskStopCallback: () => this.setState({ isSpinnerVisible: false }),\n    });\n  }\n\n  public componentDidMount() {\n    this.checkSpinnerPosition();\n    this.props.active && this.spinnerTask.start();\n    this.layoutEvents = LayoutEvents.addListener(debounce(this.checkSpinnerPosition, 10));\n\n    if (this.props.active) {\n      this.disableChildrenFocus();\n    }\n  }\n\n  public componentDidUpdate(prevProps: Readonly<LoaderProps>, prevState: Readonly<LoaderState>) {\n    const { component, active, delayBeforeSpinnerShow, minimalDelayBeforeSpinnerHide } = this.props;\n    const { isLoaderActive } = this.state;\n\n    if ((active && !prevProps.active) || prevProps.component !== component) {\n      this.checkSpinnerPosition();\n    }\n\n    if (\n      delayBeforeSpinnerShow !== prevProps.delayBeforeSpinnerShow ||\n      minimalDelayBeforeSpinnerHide !== prevProps.minimalDelayBeforeSpinnerHide\n    ) {\n      this.spinnerTask.update({\n        delayBeforeTaskStart: delayBeforeSpinnerShow,\n        durationOfTask: minimalDelayBeforeSpinnerHide,\n      });\n    }\n\n    if (active !== prevProps.active) {\n      active ? this.spinnerTask.start() : this.spinnerTask.stop();\n    }\n\n    if (isLoaderActive !== prevState.isLoaderActive) {\n      if (isLoaderActive) {\n        this.disableChildrenFocus();\n      } else {\n        this.enableChildrenFocus();\n      }\n    }\n  }\n\n  public componentWillUnmount() {\n    this.makeUnobservable();\n    if (this.layoutEvents) {\n      this.layoutEvents.remove();\n    }\n    this.spinnerTask.clearTask();\n  }\n\n  public static getDerivedStateFromProps(props: LoaderProps, state: LoaderState): Partial<LoaderState> {\n    if (props.active && !state.isLoaderActive) {\n      return {\n        isLoaderActive: true,\n      };\n    }\n    if (state.isLoaderActive && !(props.active || state.isSpinnerVisible)) {\n      return {\n        isLoaderActive: false,\n      };\n    }\n\n    return state;\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { type, caption, component } = this.props;\n    const { isLoaderActive } = this.state;\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <div className={styles.loader()} data-tid={isLoaderActive ? 'Loader__Veil' : ''}>\n          <ZIndex\n            priority={'Loader'}\n            applyZIndex={isLoaderActive}\n            coverChildren={isLoaderActive}\n            style={{ height: '100%' }}\n            wrapperRef={this.childrenRef}\n          >\n            {this.props.children}\n          </ZIndex>\n          {isLoaderActive && (\n            <ZIndex\n              wrapperRef={this.spinnerRef}\n              priority={'Loader'}\n              className={cx({\n                [styles.active(this.theme)]: isLoaderActive,\n              })}\n            >\n              {this.state.isSpinnerVisible && this.renderSpinner(type, caption, component)}\n            </ZIndex>\n          )}\n        </div>\n      </CommonWrapper>\n    );\n  }\n\n  private childrenRef = (element: HTMLDivElement | null) => {\n    this.childrenContainerNode = element;\n  };\n\n  private spinnerRef = (element: HTMLDivElement | null) => {\n    this.spinnerContainerNode = element;\n  };\n\n  private renderSpinner(type?: 'mini' | 'normal' | 'big', caption?: React.ReactNode, component?: React.ReactNode) {\n    return (\n      <span\n        data-tid={'Loader__Spinner'}\n        className={cx(styles.spinnerContainer(), { [styles.spinnerContainerSticky()]: this.state.isStickySpinner })}\n        style={this.state.spinnerStyle}\n      >\n        <div\n          className={styles.spinnerComponentWrapper()}\n          ref={(element) => {\n            this.spinnerNode = element;\n          }}\n        >\n          {component !== undefined ? component : <Spinner type={type} caption={caption} />}\n        </div>\n      </span>\n    );\n  }\n\n  private checkSpinnerPosition = () => {\n    if (!this.spinnerContainerNode) {\n      return;\n    }\n\n    const {\n      top: containerTop,\n      right: containerRight,\n      bottom: containerBottom,\n      left: containerLeft,\n      height: containerHeight,\n      width: containerWidth,\n    } = this.spinnerContainerNode.getBoundingClientRect();\n\n    const windowHeight = window.innerHeight;\n    const windowWidth = window.innerWidth;\n\n    // Если контейнер не больше высоты и не шире окна,\n    // то просто выравниваем по центру\n    if (windowHeight >= containerHeight && windowWidth >= containerWidth) {\n      this.setState({\n        isStickySpinner: false,\n        spinnerStyle: {},\n      });\n      return;\n    }\n\n    const spinnerStyle: {\n      top?: number;\n      right: number;\n      bottom: number;\n      left: number;\n    } = {\n      top: 30,\n      right: 0,\n      bottom: 30,\n      left: 0,\n    };\n\n    // ПО ВЕРТИКАЛИ\n    // Если верхний край контейнера ниже верхнего края окна,\n    // то сдвигаем и лоадер\n    if (containerTop > 0) {\n      spinnerStyle.top = containerTop + 30;\n    }\n\n    // Если нижний край контейнера выше нижнего края окна,\n    // то сдвигаем и лоадер\n    if (containerBottom < windowHeight) {\n      spinnerStyle.bottom = Math.abs(windowHeight - containerBottom) + 30;\n    }\n\n    // Если знаем высоту спиннера и нижний край контейнера поднимается\n    // выше отступа на высоту спиннера, то убираем верхнюю позицию лоадера\n    if (this.spinnerNode) {\n      const spinnerHeight = this.spinnerNode.getBoundingClientRect().height;\n\n      if (spinnerHeight && spinnerStyle.bottom >= windowHeight - spinnerHeight) {\n        delete spinnerStyle.top;\n      }\n    }\n\n    // ПО ГОРИЗОНТАЛИ\n    // Если левый край контейнера правее левого края окна,\n    // то сдвигаем и лоадер\n    if (containerLeft > 0) {\n      spinnerStyle.left = containerLeft;\n    }\n\n    // Если правый край контейнера левее правого края окна,\n    // то сдвигаем и лоадер\n    if (containerRight < windowWidth) {\n      spinnerStyle.right = windowWidth - containerRight;\n    }\n\n    this.setState({\n      isStickySpinner: true,\n      spinnerStyle,\n    });\n  };\n\n  private disableChildrenFocus = () => {\n    if (!this.childrenObserver) {\n      this.makeObservable();\n    }\n    const tabbableElements = getTabbableElements(this.childrenContainerNode);\n    tabbableElements.forEach((el) => {\n      if (!el.hasAttribute('origin-tabindex')) {\n        el.setAttribute('origin-tabindex', el.tabIndex.toString());\n      }\n      el.tabIndex = -1;\n    });\n  };\n\n  private enableChildrenFocus = () => {\n    this.makeUnobservable();\n    // NOTE: NodeList doesn't support 'forEach' method in IE11 and other older browsers\n    Array.from(document.querySelectorAll('[origin-tabindex]')).forEach((el) => {\n      el.setAttribute('tabindex', el.getAttribute('origin-tabindex') ?? '0');\n      el.removeAttribute('origin-tabindex');\n    });\n  };\n\n  private makeObservable = () => {\n    const target = this.childrenContainerNode;\n    if (!target) {\n      return;\n    }\n    const config = {\n      childList: true,\n      subtree: true,\n    };\n    const observer = new MutationObserver(this.disableChildrenFocus);\n    observer.observe(target, config);\n    this.childrenObserver = observer;\n  };\n\n  private makeUnobservable = () => {\n    this.childrenObserver?.disconnect();\n    this.childrenObserver = null;\n  };\n}\n"]}
+{"version":3,"sources":["Loader.tsx"],"names":["LoaderDataTids","veil","spinner","Loader","rootNode","props","childrenRef","element","childrenContainerNode","spinnerRef","spinnerContainerNode","checkSpinnerPosition","containerTop","top","containerRight","right","containerBottom","bottom","containerLeft","left","containerHeight","height","containerWidth","width","windowHeight","window","innerHeight","windowWidth","innerWidth","setState","isStickySpinner","spinnerStyle","Math","abs","spinnerHeight","spinnerNode","disableChildrenFocus","childrenObserver","makeObservable","tabbableElements","forEach","el","hasAttribute","setAttribute","tabIndex","toString","enableChildrenFocus","makeUnobservable","Array","from","document","querySelectorAll","getAttribute","removeAttribute","target","config","childList","subtree","observer","MutationObserver","observe","disconnect","state","isSpinnerVisible","isLoaderActive","spinnerTask","TaskWithDelayAndMinimalDuration","delayBeforeTaskStart","delayBeforeSpinnerShow","durationOfTask","minimalDelayBeforeSpinnerHide","taskStartCallback","taskStopCallback","componentDidMount","active","start","layoutEvents","LayoutEvents","addListener","componentDidUpdate","prevProps","prevState","component","update","stop","componentWillUnmount","remove","clearTask","getDerivedStateFromProps","render","theme","renderMain","type","caption","setRootNode","styles","loader","children","renderSpinner","spinnerContainer","spinnerContainerSticky","spinnerComponentWrapper","undefined","React","Component","__KONTUR_REACT_UI__","defaultProps","Spinner","Types","normal","isTestEnv","propTypes","PropTypes","bool","node","className","string","oneOf","Object","keys","number"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from 'lodash.debounce';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Spinner, SpinnerProps } from '../Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { TaskWithDelayAndMinimalDuration } from '../../lib/taskWithDelayAndMinimalDuration';\nimport { getTabbableElements } from '../../lib/dom/tabbableHelpers';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Loader.styles';\n\nexport interface LoaderProps extends CommonProps {\n  children?: React.ReactNode;\n  /**\n   * Флаг переключения состояния лоадера\n   * @default false\n   */\n  active: boolean;\n  caption?: SpinnerProps['caption'];\n  /**\n   * Компонент заменяющий спиннер.\n   */\n  component?: React.ReactNode;\n  className?: string;\n  type?: 'mini' | 'normal' | 'big';\n  /**\n   * Время в миллисекундах для показа вуали без спиннера.\n   * @default 300\n   */\n  delayBeforeSpinnerShow: number;\n  /**\n   * Минимальное время в миллисекундах для показа спиннера\n   * @default 1000\n   */\n  minimalDelayBeforeSpinnerHide: number;\n}\n\nexport interface LoaderState {\n  isStickySpinner: boolean;\n  isSpinnerVisible: boolean;\n  isLoaderActive: boolean;\n  spinnerStyle?: object;\n}\n\nexport const LoaderDataTids = {\n  veil: 'Loader__Veil',\n  spinner: 'Loader__Spinner',\n} as const;\n\n/**\n * DRAFT - лоадер-контейнер\n */\n@rootNode\nexport class Loader extends React.Component<LoaderProps, LoaderState> {\n  public static __KONTUR_REACT_UI__ = 'Loader';\n\n  public static defaultProps: Partial<LoaderProps> = {\n    type: Spinner.Types.normal,\n    active: false,\n    delayBeforeSpinnerShow: isTestEnv ? 0 : 300,\n    minimalDelayBeforeSpinnerHide: isTestEnv ? 0 : 1000,\n  };\n\n  public static propTypes = {\n    /**\n     * показываем лоадер или нет\n     */\n    active: PropTypes.bool,\n\n    /**\n     * Текст рядом с лоадером.\n     *\n     * @default  \"Загрузка\"\n     */\n    caption: Spinner.propTypes.caption,\n\n    component: PropTypes.node,\n\n    /**\n     * Класс для обертки\n     */\n    className: PropTypes.string,\n\n    /**\n     * Тип спиннера: mini, normal, big\n     *\n     * @default  normal\n     *\n     * Spinner.types - все доступные типы\n     */\n    type: PropTypes.oneOf(Object.keys(Spinner.Types)),\n    /**\n     * Время в миллисекундах для показа вуали без спиннера.\n     * @default 300\n     */\n    delayBeforeSpinnerShow: PropTypes.number,\n    /**\n     * Минимальное время в миллисекундах для показа спиннера\n     * @default 1000\n     */\n    minimalDelayBeforeSpinnerHide: PropTypes.number,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n  private spinnerContainerNode: Nullable<HTMLDivElement>;\n  private childrenContainerNode: Nullable<HTMLDivElement>;\n  private spinnerNode: Nullable<HTMLDivElement>;\n  private layoutEvents: Nullable<{ remove: () => void }>;\n  private spinnerTask: TaskWithDelayAndMinimalDuration;\n  private childrenObserver: Nullable<MutationObserver>;\n\n  constructor(props: LoaderProps) {\n    super(props);\n\n    this.spinnerContainerNode = null;\n    this.childrenContainerNode = null;\n    this.childrenObserver = null;\n    this.spinnerNode = null;\n\n    this.state = {\n      isStickySpinner: false,\n      isSpinnerVisible: false,\n      isLoaderActive: false,\n    };\n\n    this.spinnerTask = new TaskWithDelayAndMinimalDuration({\n      delayBeforeTaskStart: this.props.delayBeforeSpinnerShow,\n      durationOfTask: this.props.minimalDelayBeforeSpinnerHide,\n      taskStartCallback: () => this.setState({ isSpinnerVisible: true }),\n      taskStopCallback: () => this.setState({ isSpinnerVisible: false }),\n    });\n  }\n\n  public componentDidMount() {\n    this.checkSpinnerPosition();\n    this.props.active && this.spinnerTask.start();\n    this.layoutEvents = LayoutEvents.addListener(debounce(this.checkSpinnerPosition, 10));\n\n    if (this.props.active) {\n      this.disableChildrenFocus();\n    }\n  }\n\n  public componentDidUpdate(prevProps: Readonly<LoaderProps>, prevState: Readonly<LoaderState>) {\n    const { component, active, delayBeforeSpinnerShow, minimalDelayBeforeSpinnerHide } = this.props;\n    const { isLoaderActive } = this.state;\n\n    if ((active && !prevProps.active) || prevProps.component !== component) {\n      this.checkSpinnerPosition();\n    }\n\n    if (\n      delayBeforeSpinnerShow !== prevProps.delayBeforeSpinnerShow ||\n      minimalDelayBeforeSpinnerHide !== prevProps.minimalDelayBeforeSpinnerHide\n    ) {\n      this.spinnerTask.update({\n        delayBeforeTaskStart: delayBeforeSpinnerShow,\n        durationOfTask: minimalDelayBeforeSpinnerHide,\n      });\n    }\n\n    if (active !== prevProps.active) {\n      active ? this.spinnerTask.start() : this.spinnerTask.stop();\n    }\n\n    if (isLoaderActive !== prevState.isLoaderActive) {\n      if (isLoaderActive) {\n        this.disableChildrenFocus();\n      } else {\n        this.enableChildrenFocus();\n      }\n    }\n  }\n\n  public componentWillUnmount() {\n    this.makeUnobservable();\n    if (this.layoutEvents) {\n      this.layoutEvents.remove();\n    }\n    this.spinnerTask.clearTask();\n  }\n\n  public static getDerivedStateFromProps(props: LoaderProps, state: LoaderState): Partial<LoaderState> {\n    if (props.active && !state.isLoaderActive) {\n      return {\n        isLoaderActive: true,\n      };\n    }\n    if (state.isLoaderActive && !(props.active || state.isSpinnerVisible)) {\n      return {\n        isLoaderActive: false,\n      };\n    }\n\n    return state;\n  }\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { type, caption, component } = this.props;\n    const { isLoaderActive } = this.state;\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <div className={styles.loader()} data-tid={isLoaderActive ? LoaderDataTids.veil : ''}>\n          <ZIndex\n            priority={'Loader'}\n            applyZIndex={isLoaderActive}\n            coverChildren={isLoaderActive}\n            style={{ height: '100%' }}\n            wrapperRef={this.childrenRef}\n          >\n            {this.props.children}\n          </ZIndex>\n          {isLoaderActive && (\n            <ZIndex\n              wrapperRef={this.spinnerRef}\n              priority={'Loader'}\n              className={cx({\n                [styles.active(this.theme)]: isLoaderActive,\n              })}\n            >\n              {this.state.isSpinnerVisible && this.renderSpinner(type, caption, component)}\n            </ZIndex>\n          )}\n        </div>\n      </CommonWrapper>\n    );\n  }\n\n  private childrenRef = (element: HTMLDivElement | null) => {\n    this.childrenContainerNode = element;\n  };\n\n  private spinnerRef = (element: HTMLDivElement | null) => {\n    this.spinnerContainerNode = element;\n  };\n\n  private renderSpinner(type?: 'mini' | 'normal' | 'big', caption?: React.ReactNode, component?: React.ReactNode) {\n    return (\n      <span\n        data-tid={LoaderDataTids.spinner}\n        className={cx(styles.spinnerContainer(), { [styles.spinnerContainerSticky()]: this.state.isStickySpinner })}\n        style={this.state.spinnerStyle}\n      >\n        <div\n          className={styles.spinnerComponentWrapper()}\n          ref={(element) => {\n            this.spinnerNode = element;\n          }}\n        >\n          {component !== undefined ? component : <Spinner type={type} caption={caption} />}\n        </div>\n      </span>\n    );\n  }\n\n  private checkSpinnerPosition = () => {\n    if (!this.spinnerContainerNode) {\n      return;\n    }\n\n    const {\n      top: containerTop,\n      right: containerRight,\n      bottom: containerBottom,\n      left: containerLeft,\n      height: containerHeight,\n      width: containerWidth,\n    } = getDOMRect(this.spinnerContainerNode);\n\n    const windowHeight = window.innerHeight;\n    const windowWidth = window.innerWidth;\n\n    // Если контейнер не больше высоты и не шире окна,\n    // то просто выравниваем по центру\n    if (windowHeight >= containerHeight && windowWidth >= containerWidth) {\n      this.setState({\n        isStickySpinner: false,\n        spinnerStyle: {},\n      });\n      return;\n    }\n\n    const spinnerStyle: {\n      top?: number;\n      right: number;\n      bottom: number;\n      left: number;\n    } = {\n      top: 30,\n      right: 0,\n      bottom: 30,\n      left: 0,\n    };\n\n    // ПО ВЕРТИКАЛИ\n    // Если верхний край контейнера ниже верхнего края окна,\n    // то сдвигаем и лоадер\n    if (containerTop > 0) {\n      spinnerStyle.top = containerTop + 30;\n    }\n\n    // Если нижний край контейнера выше нижнего края окна,\n    // то сдвигаем и лоадер\n    if (containerBottom < windowHeight) {\n      spinnerStyle.bottom = Math.abs(windowHeight - containerBottom) + 30;\n    }\n\n    // Если знаем высоту спиннера и нижний край контейнера поднимается\n    // выше отступа на высоту спиннера, то убираем верхнюю позицию лоадера\n\n    const spinnerHeight = getDOMRect(this.spinnerNode).height;\n\n    if (spinnerHeight && spinnerStyle.bottom >= windowHeight - spinnerHeight) {\n      delete spinnerStyle.top;\n    }\n\n    // ПО ГОРИЗОНТАЛИ\n    // Если левый край контейнера правее левого края окна,\n    // то сдвигаем и лоадер\n    if (containerLeft > 0) {\n      spinnerStyle.left = containerLeft;\n    }\n\n    // Если правый край контейнера левее правого края окна,\n    // то сдвигаем и лоадер\n    if (containerRight < windowWidth) {\n      spinnerStyle.right = windowWidth - containerRight;\n    }\n\n    this.setState({\n      isStickySpinner: true,\n      spinnerStyle,\n    });\n  };\n\n  private disableChildrenFocus = () => {\n    if (!this.childrenObserver) {\n      this.makeObservable();\n    }\n    const tabbableElements = getTabbableElements(this.childrenContainerNode);\n    tabbableElements.forEach((el) => {\n      if (!el.hasAttribute('origin-tabindex')) {\n        el.setAttribute('origin-tabindex', el.tabIndex.toString());\n      }\n      el.tabIndex = -1;\n    });\n  };\n\n  private enableChildrenFocus = () => {\n    this.makeUnobservable();\n    // NOTE: NodeList doesn't support 'forEach' method in IE11 and other older browsers\n    Array.from(document.querySelectorAll('[origin-tabindex]')).forEach((el) => {\n      el.setAttribute('tabindex', el.getAttribute('origin-tabindex') ?? '0');\n      el.removeAttribute('origin-tabindex');\n    });\n  };\n\n  private makeObservable = () => {\n    const target = this.childrenContainerNode;\n    if (!target) {\n      return;\n    }\n    const config = {\n      childList: true,\n      subtree: true,\n    };\n    const observer = new MutationObserver(this.disableChildrenFocus);\n    observer.observe(target, config);\n    this.childrenObserver = observer;\n  };\n\n  private makeUnobservable = () => {\n    this.childrenObserver?.disconnect();\n    this.childrenObserver = null;\n  };\n}\n"]}

package/cjs/components/MenuHeader/MenuHeader.d.ts

@@ -4,6 +4,9 @@ export interface MenuHeaderProps extends CommonProps {
     _enableIconPadding?: boolean;
     children: ReactNode;
 }
+export declare const MenuHeaderDataTids: {
+    readonly root: "MenuHeader__root";
+};
 /**
  * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.
  *

package/cjs/components/MenuHeader/MenuHeader.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MenuHeader = MenuHeader;exports.isMenuHeader = void 0;var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MenuHeader = MenuHeader;exports.isMenuHeader = exports.MenuHeaderDataTids = void 0;var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
 
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
@@ -11,19 +11,24 @@ var _MenuHeader = require("./MenuHeader.styles");var _excluded = ["_enableIconPa
 
 
 
+var MenuHeaderDataTids = {
+  root: 'MenuHeader__root' };
+
+
 /**
  * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.
  *
  * _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.
  *
  * Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */
+ */exports.MenuHeaderDataTids = MenuHeaderDataTids;
 function MenuHeader(_ref) {var _cx;var _ref$_enableIconPaddi = _ref._enableIconPadding,_enableIconPadding = _ref$_enableIconPaddi === void 0 ? false : _ref$_enableIconPaddi,children = _ref.children,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
 
   return /*#__PURE__*/(
     _react.default.createElement(_CommonWrapper.CommonWrapper, rest, /*#__PURE__*/
     _react.default.createElement("div", {
+      "data-tid": MenuHeaderDataTids.root,
       className: (0, _Emotion.cx)((_cx = {}, _cx[
       _MenuHeader.styles.root(theme)] = true, _cx[
       _MenuHeader.styles.withLeftPadding(theme)] = _enableIconPadding, _cx)) },

package/cjs/components/MenuHeader/MenuHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MenuHeader.tsx"],"names":["MenuHeader","_enableIconPadding","children","rest","theme","ThemeContext","styles","root","withLeftPadding","__KONTUR_REACT_UI__","__MENU_HEADER__","isMenuHeader","child","isValidElement","Object","prototype","hasOwnProperty","call","type"],"mappings":"sTAAA;;AAEA;AACA;AACA;;AAEA,iD;;;;;;;AAOA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,UAAT,OAAwF,0CAAlEC,kBAAkE,CAAlEA,kBAAkE,sCAA7C,KAA6C,yBAAtCC,QAAsC,QAAtCA,QAAsC,CAAzBC,IAAyB;AACtF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,IAAnB;AACE;AACE,MAAA,SAAS,EAAE;AACRG,yBAAOC,IAAP,CAAYH,KAAZ,CADQ,IACa,IADb;AAERE,yBAAOE,eAAP,CAAuBJ,KAAvB,CAFQ,IAEwBH,kBAFxB,OADb;;;AAMGC,IAAAA,QANH,CADF,CADF;;;;AAYD;;AAEDF,UAAU,CAACS,mBAAX,GAAiC,YAAjC;AACAT,UAAU,CAACU,eAAX,GAA6B,IAA7B;;;;AAIO,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAA0E;AACpG,SAAO,4BAAMC,cAAN,CAAsCD,KAAtC;AACHE,EAAAA,MAAM,CAACC,SAAP,CAAiBC,cAAjB,CAAgCC,IAAhC,CAAqCL,KAAK,CAACM,IAA3C,EAAiD,iBAAjD,CADG;AAEH,OAFJ;AAGD,CAJM,C","sourcesContent":["import React, { ReactNode, useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './MenuHeader.styles';\n\nexport interface MenuHeaderProps extends CommonProps {\n  _enableIconPadding?: boolean;\n  children: ReactNode;\n}\n\n/**\n * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.\n *\n * _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.\n *\n * Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuHeader({ _enableIconPadding = false, children, ...rest }: MenuHeaderProps) {\n  const theme = useContext(ThemeContext);\n\n  return (\n    <CommonWrapper {...rest}>\n      <div\n        className={cx({\n          [styles.root(theme)]: true,\n          [styles.withLeftPadding(theme)]: _enableIconPadding,\n        })}\n      >\n        {children}\n      </div>\n    </CommonWrapper>\n  );\n}\n\nMenuHeader.__KONTUR_REACT_UI__ = 'MenuHeader';\nMenuHeader.__MENU_HEADER__ = true;\n\nexport { MenuHeader };\n\nexport const isMenuHeader = (child: React.ReactNode): child is React.ReactElement<MenuHeaderProps> => {\n  return React.isValidElement<MenuHeaderProps>(child)\n    ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_HEADER__')\n    : false;\n};\n"]}
+{"version":3,"sources":["MenuHeader.tsx"],"names":["MenuHeaderDataTids","root","MenuHeader","_enableIconPadding","children","rest","theme","ThemeContext","styles","withLeftPadding","__KONTUR_REACT_UI__","__MENU_HEADER__","isMenuHeader","child","isValidElement","Object","prototype","hasOwnProperty","call","type"],"mappings":"mVAAA;;AAEA;AACA;AACA;;AAEA,iD;;;;;;;AAOO,IAAMA,kBAAkB,GAAG;AAChCC,EAAAA,IAAI,EAAE,kBAD0B,EAA3B;;;AAIP;AACA;AACA;AACA;AACA;AACA;AACA,G;AACA,SAASC,UAAT,OAAwF,0CAAlEC,kBAAkE,CAAlEA,kBAAkE,sCAA7C,KAA6C,yBAAtCC,QAAsC,QAAtCA,QAAsC,CAAzBC,IAAyB;AACtF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,IAAnB;AACE;AACE,kBAAUL,kBAAkB,CAACC,IAD/B;AAEE,MAAA,SAAS,EAAE;AACRO,yBAAOP,IAAP,CAAYK,KAAZ,CADQ,IACa,IADb;AAERE,yBAAOC,eAAP,CAAuBH,KAAvB,CAFQ,IAEwBH,kBAFxB,OAFb;;;AAOGC,IAAAA,QAPH,CADF,CADF;;;;AAaD;;AAEDF,UAAU,CAACQ,mBAAX,GAAiC,YAAjC;AACAR,UAAU,CAACS,eAAX,GAA6B,IAA7B;;;;AAIO,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAA0E;AACpG,SAAO,4BAAMC,cAAN,CAAsCD,KAAtC;AACHE,EAAAA,MAAM,CAACC,SAAP,CAAiBC,cAAjB,CAAgCC,IAAhC,CAAqCL,KAAK,CAACM,IAA3C,EAAiD,iBAAjD,CADG;AAEH,OAFJ;AAGD,CAJM,C","sourcesContent":["import React, { ReactNode, useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './MenuHeader.styles';\n\nexport interface MenuHeaderProps extends CommonProps {\n  _enableIconPadding?: boolean;\n  children: ReactNode;\n}\n\nexport const MenuHeaderDataTids = {\n  root: 'MenuHeader__root',\n} as const;\n\n/**\n * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.\n *\n * _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.\n *\n * Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuHeader({ _enableIconPadding = false, children, ...rest }: MenuHeaderProps) {\n  const theme = useContext(ThemeContext);\n\n  return (\n    <CommonWrapper {...rest}>\n      <div\n        data-tid={MenuHeaderDataTids.root}\n        className={cx({\n          [styles.root(theme)]: true,\n          [styles.withLeftPadding(theme)]: _enableIconPadding,\n        })}\n      >\n        {children}\n      </div>\n    </CommonWrapper>\n  );\n}\n\nMenuHeader.__KONTUR_REACT_UI__ = 'MenuHeader';\nMenuHeader.__MENU_HEADER__ = true;\n\nexport { MenuHeader };\n\nexport const isMenuHeader = (child: React.ReactNode): child is React.ReactElement<MenuHeaderProps> => {\n  return React.isValidElement<MenuHeaderProps>(child)\n    ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_HEADER__')\n    : false;\n};\n"]}

package/cjs/components/MenuItem/MenuItem.d.ts

@@ -64,6 +64,10 @@ export interface MenuItemProps extends CommonProps {
     component?: React.ComponentType<any>;
     isMobile?: boolean;
 }
+export declare const MenuItemDataTids: {
+    readonly root: "MenuItem__root";
+    readonly comment: "MenuItem__comment";
+};
 /**
  *
  * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.

package/cjs/components/MenuItem/MenuItem.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.isMenuItem = exports.MenuItem = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));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.isMenuItem = exports.MenuItemDataTids = exports.MenuItem = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _utils = require("../../lib/utils");
@@ -74,6 +74,11 @@ var _MenuItem = require("./MenuItem.styles");var _excluded = ["link", "comment",
 
 
 
+
+
+var MenuItemDataTids = {
+  root: 'MenuItem__root',
+  comment: 'MenuItem__comment' };
 
 
 /**
@@ -81,7 +86,7 @@ var _MenuItem = require("./MenuItem.styles");var _excluded = ["link", "comment",
  * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.
  *
  * Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */var
+ */exports.MenuItemDataTids = MenuItemDataTids;var
 
 MenuItem = (0, _rootNodeDecorator.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(MenuItem, _React$Component);function MenuItem() {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.
 
@@ -167,7 +172,8 @@ MenuItem = (0, _rootNodeDecorator.rootNode)(_class = (_temp = _class2 = /*#__PUR
       var Component = _this.getComponent();
 
       return /*#__PURE__*/(
-        _react.default.createElement(Component, (0, _extends2.default)({},
+        _react.default.createElement(Component, (0, _extends2.default)({
+          "data-tid": MenuItemDataTids.root },
         rest, {
           state: state,
           onMouseOver: _this.handleMouseEnterFix,
@@ -179,7 +185,7 @@ MenuItem = (0, _rootNodeDecorator.rootNode)(_class = (_temp = _class2 = /*#__PUR
         content,
         _this.props.comment && /*#__PURE__*/
         _react.default.createElement("div", {
-          "data-tid": "MenuItem__comment",
+          "data-tid": MenuItemDataTids.comment,
           className: (0, _Emotion.cx)((_cx2 = {}, _cx2[
           _MenuItem.styles.comment(_this.theme)] = true, _cx2[
           _MenuItem.styles.commentHover(_this.theme)] = hover, _cx2)) },

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

@@ -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"]}
+{"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","oneOfType","target","onClick","func","isMenuItem"],"mappings":"kfAAA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;AAEA,6C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoEO,IAAMA,gBAAgB,GAAG;AAC9BC,EAAAA,IAAI,EAAE,gBADwB;AAE9BC,EAAAA,OAAO,EAAE,mBAFqB,EAAzB;;;AAKP;AACA;AACA;AACA;AACA;AACA,G;;AAEaC,Q,OADZC,2B;;;;;;;;;;;;;;;;;;;;;;;AAwBSC,IAAAA,Y,GAAe,K;;;;;;;;;;;;;;;;;;AAkBfC,IAAAA,U,GAAa,UAACC,KAAD,EAAkD;AACrE;AACEC,MAAAA,IADF;;;;;;;;;;;AAYID,MAAAA,KAZJ,CACEC,IADF,CAEEN,OAFF,GAYIK,KAZJ,CAEEL,OAFF,CAGEO,IAHF,GAYIF,KAZJ,CAGEE,IAHF,CAIEC,KAJF,GAYIH,KAZJ,CAIEG,KAJF,CAKEC,KALF,GAYIJ,KAZJ,CAKEI,KALF,CAMEC,kBANF,GAYIL,KAZJ,CAMEK,kBANF,CAOEC,SAPF,GAYIN,KAZJ,CAOEM,SAPF,CAQEC,YARF,GAYIP,KAZJ,CAQEO,YARF,CASEC,YATF,GAYIR,KAZJ,CASEQ,YATF,CAUEC,QAVF,GAYIT,KAZJ,CAUES,QAVF,CAWKC,IAXL,+CAYIV,KAZJ;;AAcA,UAAMW,KAAK,GAAGP,KAAK,KAAK,OAAV,IAAqB,CAAC,MAAKJ,KAAL,CAAWY,QAA/C;;AAEA,UAAIC,WAAW,GAAG,IAAlB;AACA,UAAIX,IAAJ,EAAU;AACRW,QAAAA,WAAW,gBAAG,sCAAK,SAAS,EAAEC,iBAAOZ,IAAP,CAAY,MAAKa,KAAjB,CAAhB,IAA0Cb,IAA1C,CAAd;AACD;;AAED,UAAMc,SAAS,GAAG;AACfF,uBAAOpB,IAAP,CAAY,MAAKqB,KAAjB,CADe,IACW,IADX;AAEfD,uBAAOG,UAAP,CAAkB,MAAKF,KAAvB,CAFe,IAEiBN,QAFjB;AAGfK,uBAAOX,KAAP,EAHe,IAGE,CAAC,CAACA,KAHJ;AAIfW,uBAAOH,KAAP,CAAa,MAAKI,KAAlB,CAJe,IAIYJ,KAJZ;AAKfG,uBAAOI,QAAP,CAAgB,MAAKH,KAArB,CALe,IAKeX,KAAK,KAAK,UALzB;AAMfU,uBAAOb,IAAP,CAAY,MAAKc,KAAjB,CANe,IAMW,CAAC,CAACd,IANb;AAOfa,uBAAOK,QAAP,CAAgB,MAAKJ,KAArB,CAPe,IAOeK,OAAO,CAACP,WAAD,CAAP,IAAwB,CAAC,CAACR,kBAPzC;AAQfS,uBAAOF,QAAP,CAAgB,MAAKG,KAArB,CARe,IAQe,CAAC,CAAC,MAAKf,KAAL,CAAWY,QAR5B,OAAlB;;;AAWA,UAAQS,QAAR,GAAqB,MAAKrB,KAA1B,CAAQqB,QAAR;;AAEA,UAAIC,OAAO,GAAGD,QAAd;AACA,UAAI,uBAAWA,QAAX,CAAJ,EAA0B;AACxBC,QAAAA,OAAO,GAAGD,QAAQ,CAAC,MAAKrB,KAAL,CAAWI,KAAZ,CAAlB;AACD;;AAED,UAAMmB,SAAS,GAAG,MAAKC,YAAL,EAAlB;;AAEA;AACE,qCAAC,SAAD;AACE,sBAAU/B,gBAAgB,CAACC,IAD7B;AAEMgB,QAAAA,IAFN;AAGE,UAAA,KAAK,EAAEN,KAHT;AAIE,UAAA,WAAW,EAAE,MAAKqB,mBAJpB;AAKE,UAAA,YAAY,EAAE,MAAKC,gBALrB;AAME,UAAA,SAAS,EAAEV,SANb;AAOE,UAAA,QAAQ,EAAE,CAAC,CAPb;;AASGH,QAAAA,WATH;AAUGS,QAAAA,OAVH;AAWG,cAAKtB,KAAL,CAAWL,OAAX;AACC;AACE,sBAAUF,gBAAgB,CAACE,OAD7B;AAEE,UAAA,SAAS,EAAE;AACRmB,2BAAOnB,OAAP,CAAe,MAAKoB,KAApB,CADQ,IACqB,IADrB;AAERD,2BAAOa,YAAP,CAAoB,MAAKZ,KAAzB,CAFQ,IAE0BJ,KAF1B,QAFb;;;AAOGhB,QAAAA,OAPH,CAZJ,CADF;;;;;AAyBD,K;;;;AAIO8B,IAAAA,mB,GAAsB,UAACG,CAAD,EAAsC;AAClE,UAAI,CAAC,MAAK9B,YAAN,IAAsB,MAAKE,KAAL,CAAWO,YAArC,EAAmD;AACjD,cAAKT,YAAL,GAAoB,IAApB;AACA,cAAKE,KAAL,CAAWO,YAAX,CAAwBqB,CAAxB;AACD;AACF,K;;AAEOF,IAAAA,gB,GAAmB,UAACE,CAAD,EAAsC;AAC/D,YAAK9B,YAAL,GAAoB,KAApB;AACA,UAAI,MAAKE,KAAL,CAAWQ,YAAf,EAA6B;AAC3B,cAAKR,KAAL,CAAWQ,YAAX,CAAwBoB,CAAxB;AACD;AACF,K;;AAEOJ,IAAAA,Y,GAAe,YAAM;AAC3B,wBAAsC,MAAKxB,KAA3C,CAAQY,QAAR,eAAQA,QAAR,CAAkBN,SAAlB,eAAkBA,SAAlB,CAA6BuB,IAA7B,eAA6BA,IAA7B;;AAEA,UAAIjB,QAAJ,EAAc;AACZ,eAAO,QAAP;AACD;;AAED,UAAIN,SAAJ,EAAe;AACb,eAAOA,SAAP;AACD;;AAED,UAAIuB,IAAJ,EAAU;AACR,eAAO,GAAP;AACD;;AAED,aAAO,QAAP;AACD,K,sDApHMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACf,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,oBACE,6BAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACgB,WAAjC,IAAkD,MAAI,CAAC/B,KAAvD,GACG,MAAI,CAACD,UADR,CADF,CAKD,CARH,CADF,CAYD,C,mBAvC2BiC,eAAMT,S,WACpBU,mB,GAAsB,U,UACtBC,a,GAAgB,I,UAEhBC,S,GAAY,EACxBxC,OAAO,EAAEyC,mBAAUC,IADK,EAGxBzB,QAAQ,EAAEwB,mBAAUE,IAHI,EAKxBT,IAAI,EAAEO,mBAAUG,MALQ,EAOxBrC,IAAI,EAAEkC,mBAAUI,SAAV,CAAoB,CAACJ,mBAAUG,MAAX,EAAmBH,mBAAUC,IAA7B,CAApB,CAPkB,EASxBlC,KAAK,EAAEiC,mBAAUE,IATO,EAWxBlC,KAAK,EAAEgC,mBAAUG,MAXO,EAaxBE,MAAM,EAAEL,mBAAUG,MAbM,EAexBG,OAAO,EAAEN,mBAAUO,IAfK,E;;;AA6IrB,IAAMC,UAAU,GAAG,+BAAmB,UAAnB,CAAnB,C","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.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        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/MenuItem/MenuItem.styles.js

@@ -10,7 +10,7 @@ var styles = (0, _Emotion.memoizeStyle)({
     var paddingX = legacyPaddingX !== 0 ? parseFloat(t.menuItemPaddingX) + legacyPaddingX + "px" : t.menuItemPaddingX;
     var paddingY = legacyPaddingY !== 0 ? parseFloat(t.menuItemPaddingY) + legacyPaddingY + "px" : t.menuItemPaddingY;
 
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n\n      cursor: pointer;\n      display: block;\n      line-height: ", ";\n      font-size: ", ";\n      padding: ", " ", " ", " ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      ", ";\n\n      cursor: pointer;\n      display: block;\n      line-height: ", ";\n      font-size: ", ";\n      padding: ", " ", " ", " ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n      border-radius: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n    "])),
     (0, _Mixins.resetButton)(),
 
 
@@ -20,7 +20,8 @@ var styles = (0, _Emotion.memoizeStyle)({
     t.menuItemPaddingY, paddingX, paddingY, t.menuItemPaddingX,
 
 
-    t.menuItemTextColor);
+    t.menuItemTextColor,
+    t.menuItemBorderRadius);
 
 
 

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

@@ -1 +1 @@
-{"version":3,"sources":["MenuItem.styles.ts"],"names":["styles","root","t","legacyPaddingX","parseFloat","menuItemLegacyPaddingX","legacyPaddingY","menuItemLegacyPaddingY","paddingX","menuItemPaddingX","paddingY","menuItemPaddingY","css","menuItemLineHeight","menuItemFontSize","menuItemTextColor","rootMobile","fontSizeMobile","lineHeightMobile","menuItemPaddingMobile","hover","menuItemHoverBg","menuItemHoverColor","selected","menuItemSelectedBg","disabled","menuItemDisabledColor","link","menuItemLinkColor","loose","withIcon","menuItemPaddingForIcon","comment","menuItemCommentColor","commentHover","menuItemCommentColorHover","icon","menuItemIconWidth","parseInt","menuItemIconLegacyMargin","menuItemIconLegacyShift"],"mappings":";AACA;AACA,iD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,QAAMC,cAAc,GAAGC,UAAU,CAACF,CAAC,CAACG,sBAAH,CAAjC;AACA,QAAMC,cAAc,GAAGF,UAAU,CAACF,CAAC,CAACK,sBAAH,CAAjC;;AAEA,QAAMC,QAAQ,GAAGL,cAAc,KAAK,CAAnB,GAA0BC,UAAU,CAACF,CAAC,CAACO,gBAAH,CAAV,GAAiCN,cAA3D,UAAgFD,CAAC,CAACO,gBAAnG;AACA,QAAMC,QAAQ,GAAGJ,cAAc,KAAK,CAAnB,GAA0BF,UAAU,CAACF,CAAC,CAACS,gBAAH,CAAV,GAAiCL,cAA3D,UAAgFJ,CAAC,CAACS,gBAAnG;;AAEA,eAAOC,YAAP;AACI,8BADJ;;;;AAKiBV,IAAAA,CAAC,CAACW,kBALnB;AAMeX,IAAAA,CAAC,CAACY,gBANjB;AAOaZ,IAAAA,CAAC,CAACS,gBAPf,EAOmCH,QAPnC,EAO+CE,QAP/C,EAO2DR,CAAC,CAACO,gBAP7D;;;AAUWP,IAAAA,CAAC,CAACa,iBAVb;;;;;;AAgBD,GAxBgC;;AA0BjCC,EAAAA,UA1BiC,sBA0BtBd,CA1BsB,EA0BZ;AACnB,eAAOU,YAAP;AACeV,IAAAA,CAAC,CAACe,cADjB;AAEiBf,IAAAA,CAAC,CAACgB,gBAFnB;AAGahB,IAAAA,CAAC,CAACiB,qBAHf;;AAKD,GAhCgC;;AAkCjCC,EAAAA,KAlCiC,iBAkC3BlB,CAlC2B,EAkCjB;AACd;AACA,eAAOU,YAAP;AACgBV,IAAAA,CAAC,CAACmB,eADlB;AAEWnB,IAAAA,CAAC,CAACoB,kBAFb;;AAID,GAxCgC;AAyCjCC,EAAAA,QAzCiC,oBAyCxBrB,CAzCwB,EAyCd;AACjB,eAAOU,YAAP;AACgBV,IAAAA,CAAC,CAACsB,kBADlB;;AAGD,GA7CgC;AA8CjCC,EAAAA,QA9CiC,oBA8CxBvB,CA9CwB,EA8Cd;AACjB,eAAOU,YAAP;;AAEWV,IAAAA,CAAC,CAACwB,qBAFb;;;AAKD,GApDgC;AAqDjCC,EAAAA,IArDiC,gBAqD5BzB,CArD4B,EAqDlB;AACb,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAAC0B,iBADb;;AAGD,GAzDgC;AA0DjCC,EAAAA,KA1DiC,mBA0DzB;AACN,eAAOjB,YAAP;;;AAGD,GA9DgC;AA+DjCkB,EAAAA,QA/DiC,oBA+DxB5B,CA/DwB,EA+Dd;AACjB,eAAOU,YAAP;AACkBV,IAAAA,CAAC,CAAC6B,sBADpB;;AAGD,GAnEgC;AAoEjCC,EAAAA,OApEiC,mBAoEzB9B,CApEyB,EAoEf;AAChB,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAAC+B,oBADb;;;AAID,GAzEgC;AA0EjCC,EAAAA,YA1EiC,wBA0EpBhC,CA1EoB,EA0EV;AACrB,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAACiC,yBADb;;;AAID,GA/EgC;AAgFjCC,EAAAA,IAhFiC,gBAgF5BlC,CAhF4B,EAgFlB;AACb,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAACmC,iBADb;;;AAIUC,IAAAA,QAAQ,CAACpC,CAAC,CAACO,gBAAH,CAAR,GAA+B6B,QAAQ,CAACpC,CAAC,CAACqC,wBAAH,CAJjD;AAKSrC,IAAAA,CAAC,CAACS,gBALX;AAM0BT,IAAAA,CAAC,CAACsC,uBAN5B;;AAQD,GAzFgC,EAAb,CAAf,C","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const legacyPaddingX = parseFloat(t.menuItemLegacyPaddingX);\n    const legacyPaddingY = parseFloat(t.menuItemLegacyPaddingY);\n\n    const paddingX = legacyPaddingX !== 0 ? `${parseFloat(t.menuItemPaddingX) + legacyPaddingX}px` : t.menuItemPaddingX;\n    const paddingY = legacyPaddingY !== 0 ? `${parseFloat(t.menuItemPaddingY) + legacyPaddingY}px` : t.menuItemPaddingY;\n\n    return css`\n      ${resetButton()};\n\n      cursor: pointer;\n      display: block;\n      line-height: ${t.menuItemLineHeight};\n      font-size: ${t.menuItemFontSize};\n      padding: ${t.menuItemPaddingY} ${paddingX} ${paddingY} ${t.menuItemPaddingX};\n      position: relative;\n      text-decoration: none;\n      color: ${t.menuItemTextColor};\n\n      button& {\n        min-width: 100%;\n      }\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.fontSizeMobile};\n      line-height: ${t.lineHeightMobile};\n      padding: ${t.menuItemPaddingMobile};\n    `;\n  },\n\n  hover(t: Theme) {\n    // Color with !important in purpose to override `a:hover`\n    return css`\n      background: ${t.menuItemHoverBg} !important;\n      color: ${t.menuItemHoverColor} !important;\n    `;\n  },\n  selected(t: Theme) {\n    return css`\n      background: ${t.menuItemSelectedBg} !important;\n    `;\n  },\n  disabled(t: Theme) {\n    return css`\n      background: transparent;\n      color: ${t.menuItemDisabledColor};\n      cursor: default;\n    `;\n  },\n  link(t: Theme) {\n    return css`\n      color: ${t.menuItemLinkColor};\n    `;\n  },\n  loose() {\n    return css`\n      padding-left: 15px;\n    `;\n  },\n  withIcon(t: Theme) {\n    return css`\n      padding-left: ${t.menuItemPaddingForIcon};\n    `;\n  },\n  comment(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColor};\n      white-space: normal;\n    `;\n  },\n  commentHover(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColorHover};\n      opacity: 0.6;\n    `;\n  },\n  icon(t: Theme) {\n    return css`\n      width: ${t.menuItemIconWidth};\n      display: inline-block;\n      position: absolute;\n      left: ${parseInt(t.menuItemPaddingX) + parseInt(t.menuItemIconLegacyMargin)}px;\n      top: ${t.menuItemPaddingY};\n      transform: translateY(${t.menuItemIconLegacyShift});\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["MenuItem.styles.ts"],"names":["styles","root","t","legacyPaddingX","parseFloat","menuItemLegacyPaddingX","legacyPaddingY","menuItemLegacyPaddingY","paddingX","menuItemPaddingX","paddingY","menuItemPaddingY","css","menuItemLineHeight","menuItemFontSize","menuItemTextColor","menuItemBorderRadius","rootMobile","fontSizeMobile","lineHeightMobile","menuItemPaddingMobile","hover","menuItemHoverBg","menuItemHoverColor","selected","menuItemSelectedBg","disabled","menuItemDisabledColor","link","menuItemLinkColor","loose","withIcon","menuItemPaddingForIcon","comment","menuItemCommentColor","commentHover","menuItemCommentColorHover","icon","menuItemIconWidth","parseInt","menuItemIconLegacyMargin","menuItemIconLegacyShift"],"mappings":";AACA;AACA,iD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,QAAMC,cAAc,GAAGC,UAAU,CAACF,CAAC,CAACG,sBAAH,CAAjC;AACA,QAAMC,cAAc,GAAGF,UAAU,CAACF,CAAC,CAACK,sBAAH,CAAjC;;AAEA,QAAMC,QAAQ,GAAGL,cAAc,KAAK,CAAnB,GAA0BC,UAAU,CAACF,CAAC,CAACO,gBAAH,CAAV,GAAiCN,cAA3D,UAAgFD,CAAC,CAACO,gBAAnG;AACA,QAAMC,QAAQ,GAAGJ,cAAc,KAAK,CAAnB,GAA0BF,UAAU,CAACF,CAAC,CAACS,gBAAH,CAAV,GAAiCL,cAA3D,UAAgFJ,CAAC,CAACS,gBAAnG;;AAEA,eAAOC,YAAP;AACI,8BADJ;;;;AAKiBV,IAAAA,CAAC,CAACW,kBALnB;AAMeX,IAAAA,CAAC,CAACY,gBANjB;AAOaZ,IAAAA,CAAC,CAACS,gBAPf,EAOmCH,QAPnC,EAO+CE,QAP/C,EAO2DR,CAAC,CAACO,gBAP7D;;;AAUWP,IAAAA,CAAC,CAACa,iBAVb;AAWmBb,IAAAA,CAAC,CAACc,oBAXrB;;;;;;AAiBD,GAzBgC;;AA2BjCC,EAAAA,UA3BiC,sBA2BtBf,CA3BsB,EA2BZ;AACnB,eAAOU,YAAP;AACeV,IAAAA,CAAC,CAACgB,cADjB;AAEiBhB,IAAAA,CAAC,CAACiB,gBAFnB;AAGajB,IAAAA,CAAC,CAACkB,qBAHf;;AAKD,GAjCgC;;AAmCjCC,EAAAA,KAnCiC,iBAmC3BnB,CAnC2B,EAmCjB;AACd;AACA,eAAOU,YAAP;AACgBV,IAAAA,CAAC,CAACoB,eADlB;AAEWpB,IAAAA,CAAC,CAACqB,kBAFb;;AAID,GAzCgC;AA0CjCC,EAAAA,QA1CiC,oBA0CxBtB,CA1CwB,EA0Cd;AACjB,eAAOU,YAAP;AACgBV,IAAAA,CAAC,CAACuB,kBADlB;;AAGD,GA9CgC;AA+CjCC,EAAAA,QA/CiC,oBA+CxBxB,CA/CwB,EA+Cd;AACjB,eAAOU,YAAP;;AAEWV,IAAAA,CAAC,CAACyB,qBAFb;;;AAKD,GArDgC;AAsDjCC,EAAAA,IAtDiC,gBAsD5B1B,CAtD4B,EAsDlB;AACb,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAAC2B,iBADb;;AAGD,GA1DgC;AA2DjCC,EAAAA,KA3DiC,mBA2DzB;AACN,eAAOlB,YAAP;;;AAGD,GA/DgC;AAgEjCmB,EAAAA,QAhEiC,oBAgExB7B,CAhEwB,EAgEd;AACjB,eAAOU,YAAP;AACkBV,IAAAA,CAAC,CAAC8B,sBADpB;;AAGD,GApEgC;AAqEjCC,EAAAA,OArEiC,mBAqEzB/B,CArEyB,EAqEf;AAChB,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAACgC,oBADb;;;AAID,GA1EgC;AA2EjCC,EAAAA,YA3EiC,wBA2EpBjC,CA3EoB,EA2EV;AACrB,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAACkC,yBADb;;;AAID,GAhFgC;AAiFjCC,EAAAA,IAjFiC,gBAiF5BnC,CAjF4B,EAiFlB;AACb,eAAOU,YAAP;AACWV,IAAAA,CAAC,CAACoC,iBADb;;;AAIUC,IAAAA,QAAQ,CAACrC,CAAC,CAACO,gBAAH,CAAR,GAA+B8B,QAAQ,CAACrC,CAAC,CAACsC,wBAAH,CAJjD;AAKStC,IAAAA,CAAC,CAACS,gBALX;AAM0BT,IAAAA,CAAC,CAACuC,uBAN5B;;AAQD,GA1FgC,EAAb,CAAf,C","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const legacyPaddingX = parseFloat(t.menuItemLegacyPaddingX);\n    const legacyPaddingY = parseFloat(t.menuItemLegacyPaddingY);\n\n    const paddingX = legacyPaddingX !== 0 ? `${parseFloat(t.menuItemPaddingX) + legacyPaddingX}px` : t.menuItemPaddingX;\n    const paddingY = legacyPaddingY !== 0 ? `${parseFloat(t.menuItemPaddingY) + legacyPaddingY}px` : t.menuItemPaddingY;\n\n    return css`\n      ${resetButton()};\n\n      cursor: pointer;\n      display: block;\n      line-height: ${t.menuItemLineHeight};\n      font-size: ${t.menuItemFontSize};\n      padding: ${t.menuItemPaddingY} ${paddingX} ${paddingY} ${t.menuItemPaddingX};\n      position: relative;\n      text-decoration: none;\n      color: ${t.menuItemTextColor};\n      border-radius: ${t.menuItemBorderRadius};\n\n      button& {\n        min-width: 100%;\n      }\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.fontSizeMobile};\n      line-height: ${t.lineHeightMobile};\n      padding: ${t.menuItemPaddingMobile};\n    `;\n  },\n\n  hover(t: Theme) {\n    // Color with !important in purpose to override `a:hover`\n    return css`\n      background: ${t.menuItemHoverBg} !important;\n      color: ${t.menuItemHoverColor} !important;\n    `;\n  },\n  selected(t: Theme) {\n    return css`\n      background: ${t.menuItemSelectedBg} !important;\n    `;\n  },\n  disabled(t: Theme) {\n    return css`\n      background: transparent;\n      color: ${t.menuItemDisabledColor};\n      cursor: default;\n    `;\n  },\n  link(t: Theme) {\n    return css`\n      color: ${t.menuItemLinkColor};\n    `;\n  },\n  loose() {\n    return css`\n      padding-left: 15px;\n    `;\n  },\n  withIcon(t: Theme) {\n    return css`\n      padding-left: ${t.menuItemPaddingForIcon};\n    `;\n  },\n  comment(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColor};\n      white-space: normal;\n    `;\n  },\n  commentHover(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColorHover};\n      opacity: 0.6;\n    `;\n  },\n  icon(t: Theme) {\n    return css`\n      width: ${t.menuItemIconWidth};\n      display: inline-block;\n      position: absolute;\n      left: ${parseInt(t.menuItemPaddingX) + parseInt(t.menuItemIconLegacyMargin)}px;\n      top: ${t.menuItemPaddingY};\n      transform: translateY(${t.menuItemIconLegacyShift});\n    `;\n  },\n});\n"]}

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

@@ -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

@@ -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

@@ -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"]}
+{"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

@@ -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

@@ -1,7 +1,8 @@
-"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"));
 
+var _utils = require("../../lib/utils");
 var _identifiers = require("../../lib/events/keyboard/identifiers");
 var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
 var _RenderContainer = require("../../internal/RenderContainer");
@@ -68,6 +69,12 @@ var mountedModalsCount = 0;
 
 
 
+
+
+var ModalDataTids = {
+  container: 'modal-container',
+  content: 'modal-content',
+  close: 'modal-close' };
 
 
 /**
@@ -83,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.
 
 
@@ -332,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 (this.stackSubscription != null) {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

@@ -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 { 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 (this.stackSubscription != null) {\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: ReadonlyArray<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"]}
+{"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"]}