@skbkontur/react-ui 3.9.4 → 3.10.0

package/internal/PopupMenu/PopupMenu/PopupMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PopupMenu.tsx"],"names":["React","isKeyArrowVertical","isKeyEnter","isKeyEscape","isKeySpace","someKeys","InternalMenu","Popup","RenderLayer","CommonWrapper","PopupMenuPositions","isValidPositions","styles","PopupMenuType","Dropdown","Tooltip","PopupMenu","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","caption","opened","openMenu","closeMenu","toggleMenu","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","container","width","children","popupMargin","popupHasPin","popupPinOffset","getPositions","disableAnimations","menuWidth","menuMaxHeight","header","footer","positions","Component","__KONTUR_REACT_UI__","defaultProps","Type"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {\n  isKeyArrowVertical,\n  isKeyEnter,\n  isKeyEscape,\n  isKeySpace,\n  someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { InternalMenu } from '../InternalMenu';\nimport { Popup, PopupPosition } from '../Popup';\nimport { RenderLayer } from '../RenderLayer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { PopupMenuPositions } from './PopupMenuPositions';\nimport { isValidPositions } from './validatePositions';\nimport { styles } from './PopupMenu.styles';\n\nexport interface PopupMenuCaptionProps {\n  opened: boolean;\n  openMenu: (firstItemShouldBeSelected?: boolean) => void;\n  closeMenu: (restoreFocus?: boolean) => void;\n  toggleMenu: () => void;\n}\n\nexport interface PopupMenuProps extends CommonProps {\n  children?: React.ReactNode;\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /** Ширина контейнера и caption */\n  width?: React.CSSProperties['width'];\n\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо ```caption```,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: React.ReactNode | ((props: PopupMenuCaptionProps) => React.ReactNode);\n\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n\n  /**  Массив разрешенных положений меню относительно caption'а. */\n  positions?: PopupPosition[];\n  /** Колбэк, вызываемый после открытия/закрытия меню */\n  onChangeMenuState?: (isOpened: boolean, restoreFocus: boolean) => void;\n  /** Пропсы, передающиеся в Popup */\n  popupHasPin?: boolean;\n  popupMargin?: number;\n  popupPinOffset?: number;\n  type?: 'dropdown' | 'tooltip';\n  disableAnimations: boolean;\n}\n\ninterface PopupMenuState {\n  menuVisible: boolean;\n  firstItemShouldBeSelected?: boolean;\n}\n\nexport const PopupMenuType = {\n  Dropdown: 'dropdown',\n  Tooltip: 'tooltip',\n};\n\nexport class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {\n  public static __KONTUR_REACT_UI__ = 'PopupMenu';\n\n  public static defaultProps = {\n    positions: PopupMenuPositions,\n    type: PopupMenuType.Tooltip,\n    popupHasPin: true,\n    disableAnimations: false,\n  };\n\n  public static Type = PopupMenuType;\n\n  public state = {\n    menuVisible: false,\n    firstItemShouldBeSelected: false,\n  };\n\n  private captionWrapper: HTMLSpanElement | null = null;\n  private savedFocusableElement: HTMLElement | null = null;\n  private menu: Nullable<InternalMenu> = null;\n\n  public render() {\n    return (\n      <CommonWrapper {...this.props}>\n        <RenderLayer\n          onClickOutside={this.hideMenuWithoutFocusing}\n          onFocusOutside={this.hideMenuWithoutFocusing}\n          active={this.state.menuVisible}\n        >\n          <div className={styles.container()} style={{ width: this.props.width }}>\n            {this.renderCaption()}\n            {this.captionWrapper && this.props.children && (\n              <Popup\n                anchorElement={this.captionWrapper}\n                opened={this.state.menuVisible}\n                hasShadow\n                margin={this.props.popupMargin}\n                hasPin={this.props.popupHasPin}\n                pinOffset={this.props.popupPinOffset}\n                positions={this.getPositions()}\n                disableAnimations={this.props.disableAnimations}\n                onOpen={this.handleOpen}\n                width={this.props.menuWidth || 'auto'}\n              >\n                <InternalMenu\n                  hasShadow={false}\n                  maxHeight={this.props.menuMaxHeight || 'none'}\n                  onKeyDown={this.handleKeyDown}\n                  onItemClick={this.handleItemSelection}\n                  cyclicSelection={false}\n                  ref={this.refInternalMenu}\n                  initialSelectedItemIndex={this.state.firstItemShouldBeSelected ? 0 : -1}\n                  header={this.props.header}\n                  footer={this.props.footer}\n                >\n                  {this.props.children}\n                </InternalMenu>\n              </Popup>\n            )}\n          </div>\n        </RenderLayer>\n      </CommonWrapper>\n    );\n  }\n\n  public open = (): void => this.showMenu();\n  public close = (): void => this.hideMenu();\n\n  private refInternalMenu = (element: Nullable<InternalMenu>) => (this.menu = element);\n\n  private handleOpen = () => {\n    if (this.menu) {\n      this.menu.focus();\n    }\n  };\n\n  private renderCaption = () => {\n    if (typeof this.props.caption === 'function') {\n      const caption = this.props.caption({\n        opened: this.state.menuVisible,\n        openMenu: this.showMenu,\n        closeMenu: this.hideMenu,\n        toggleMenu: this.toggleMenu,\n      });\n\n      return (\n        <span\n          data-tid=\"PopupMenu__caption\"\n          className={styles.caption()}\n          ref={(element) => (this.captionWrapper = element)}\n        >\n          {caption}\n        </span>\n      );\n    }\n\n    return (\n      <span\n        data-tid=\"PopupMenu__caption\"\n        onClick={this.handleCaptionClick}\n        onKeyDown={this.handleCaptionKeyDown}\n        ref={(element) => (this.captionWrapper = element)}\n        className={styles.caption()}\n      >\n        {this.props.caption}\n      </span>\n    );\n  };\n\n  private hideMenuWithoutFocusing = () => this.hideMenu();\n\n  private getPositions() {\n    if (this.props.positions && isValidPositions(this.props.positions)) {\n      return this.props.positions;\n    }\n\n    return PopupMenuPositions;\n  }\n\n  private showMenu = (firstItemShouldBeSelected?: boolean): void => {\n    this.saveFocus();\n    this.setState(\n      {\n        menuVisible: true,\n        firstItemShouldBeSelected,\n      },\n      () => {\n        this.handleChangeMenuVisible(false);\n      },\n    );\n  };\n\n  private hideMenu = (restoreFocus?: boolean): void => {\n    this.setState(\n      {\n        menuVisible: false,\n        firstItemShouldBeSelected: false,\n      },\n      () => {\n        this.handleChangeMenuVisible(!!restoreFocus);\n      },\n    );\n  };\n\n  private toggleMenu = (): void => {\n    this.state.menuVisible ? this.hideMenu() : this.showMenu();\n  };\n\n  private handleCaptionClick = (): void => {\n    this.toggleMenu();\n  };\n\n  private handleCaptionKeyDown = (e: React.KeyboardEvent<HTMLElement>): void => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      this.showMenu(true);\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n    if (isKeyEscape(e)) {\n      const restoreFocus = true;\n      this.hideMenu(restoreFocus);\n    }\n  };\n\n  private saveFocus = (): void => {\n    if (document) {\n      this.savedFocusableElement = document.activeElement as HTMLElement;\n    }\n  };\n\n  private restoreFocus = (): void => {\n    if (this.savedFocusableElement) {\n      this.savedFocusableElement.focus();\n      this.savedFocusableElement = null;\n    }\n  };\n\n  private handleChangeMenuVisible = (focusShouldBeRestored: boolean): void => {\n    if (focusShouldBeRestored) {\n      this.restoreFocus();\n    }\n    if (typeof this.props.onChangeMenuState === 'function') {\n      this.props.onChangeMenuState(this.state.menuVisible, focusShouldBeRestored);\n    }\n  };\n\n  private handleItemSelection = (event: React.SyntheticEvent<HTMLElement>): void => {\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (event.type === 'keydown') {\n      event.preventDefault();\n    }\n\n    const restoreFocus = event.type === 'keydown';\n    this.hideMenu(restoreFocus);\n  };\n}\n"]}
+{"version":3,"sources":["PopupMenu.tsx"],"names":["React","isKeyArrowVertical","isKeyEnter","isKeyEscape","isKeySpace","someKeys","InternalMenu","Popup","RenderLayer","CommonWrapper","rootNode","PopupMenuPositions","isValidPositions","styles","PopupMenuType","Dropdown","Tooltip","PopupMenu","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","setRootNode","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","caption","opened","openMenu","closeMenu","toggleMenu","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","container","width","children","popupMargin","popupHasPin","popupPinOffset","getPositions","disableAnimations","menuWidth","menuMaxHeight","header","footer","positions","Component","__KONTUR_REACT_UI__","defaultProps","Type"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {\n  isKeyArrowVertical,\n  isKeyEnter,\n  isKeyEscape,\n  isKeySpace,\n  someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { InternalMenu } from '../InternalMenu';\nimport { Popup, PopupPosition } from '../Popup';\nimport { RenderLayer } from '../RenderLayer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { PopupMenuPositions } from './PopupMenuPositions';\nimport { isValidPositions } from './validatePositions';\nimport { styles } from './PopupMenu.styles';\n\nexport interface PopupMenuCaptionProps {\n  opened: boolean;\n  openMenu: (firstItemShouldBeSelected?: boolean) => void;\n  closeMenu: (restoreFocus?: boolean) => void;\n  toggleMenu: () => void;\n}\n\nexport interface PopupMenuProps extends CommonProps {\n  children?: React.ReactNode;\n  /** Максимальная высота меню */\n  menuMaxHeight?: number | string;\n  /** Ширина меню */\n  menuWidth?: number | string;\n  /** Ширина контейнера и caption */\n  width?: React.CSSProperties['width'];\n\n  /**\n   * Элемент или функция возвращающая элемент,\n   * если передана, используется вместо ```caption```,\n   * в таком случае управлять открытием и закрытием меню\n   * придется в этой функции\n   */\n  caption: React.ReactNode | ((props: PopupMenuCaptionProps) => React.ReactNode);\n\n  header?: React.ReactNode;\n  footer?: React.ReactNode;\n\n  /**  Массив разрешенных положений меню относительно caption'а. */\n  positions?: PopupPosition[];\n  /** Колбэк, вызываемый после открытия/закрытия меню */\n  onChangeMenuState?: (isOpened: boolean, restoreFocus: boolean) => void;\n  /** Пропсы, передающиеся в Popup */\n  popupHasPin?: boolean;\n  popupMargin?: number;\n  popupPinOffset?: number;\n  type?: 'dropdown' | 'tooltip';\n  disableAnimations: boolean;\n}\n\ninterface PopupMenuState {\n  menuVisible: boolean;\n  firstItemShouldBeSelected?: boolean;\n}\n\nexport const PopupMenuType = {\n  Dropdown: 'dropdown',\n  Tooltip: 'tooltip',\n};\n\n@rootNode\nexport class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {\n  public static __KONTUR_REACT_UI__ = 'PopupMenu';\n\n  public static defaultProps = {\n    positions: PopupMenuPositions,\n    type: PopupMenuType.Tooltip,\n    popupHasPin: true,\n    disableAnimations: false,\n  };\n\n  public static Type = PopupMenuType;\n\n  public state = {\n    menuVisible: false,\n    firstItemShouldBeSelected: false,\n  };\n\n  private captionWrapper: HTMLSpanElement | null = null;\n  private savedFocusableElement: HTMLElement | null = null;\n  private menu: Nullable<InternalMenu> = null;\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <RenderLayer\n          onClickOutside={this.hideMenuWithoutFocusing}\n          onFocusOutside={this.hideMenuWithoutFocusing}\n          active={this.state.menuVisible}\n        >\n          <div className={styles.container()} style={{ width: this.props.width }}>\n            {this.renderCaption()}\n            {this.captionWrapper && this.props.children && (\n              <Popup\n                anchorElement={this.captionWrapper}\n                opened={this.state.menuVisible}\n                hasShadow\n                margin={this.props.popupMargin}\n                hasPin={this.props.popupHasPin}\n                pinOffset={this.props.popupPinOffset}\n                positions={this.getPositions()}\n                disableAnimations={this.props.disableAnimations}\n                onOpen={this.handleOpen}\n                width={this.props.menuWidth || 'auto'}\n              >\n                <InternalMenu\n                  hasShadow={false}\n                  maxHeight={this.props.menuMaxHeight || 'none'}\n                  onKeyDown={this.handleKeyDown}\n                  onItemClick={this.handleItemSelection}\n                  cyclicSelection={false}\n                  ref={this.refInternalMenu}\n                  initialSelectedItemIndex={this.state.firstItemShouldBeSelected ? 0 : -1}\n                  header={this.props.header}\n                  footer={this.props.footer}\n                >\n                  {this.props.children}\n                </InternalMenu>\n              </Popup>\n            )}\n          </div>\n        </RenderLayer>\n      </CommonWrapper>\n    );\n  }\n\n  public open = (): void => this.showMenu();\n  public close = (): void => this.hideMenu();\n\n  private refInternalMenu = (element: Nullable<InternalMenu>) => (this.menu = element);\n\n  private handleOpen = () => {\n    if (this.menu) {\n      this.menu.focus();\n    }\n  };\n\n  private renderCaption = () => {\n    if (typeof this.props.caption === 'function') {\n      const caption = this.props.caption({\n        opened: this.state.menuVisible,\n        openMenu: this.showMenu,\n        closeMenu: this.hideMenu,\n        toggleMenu: this.toggleMenu,\n      });\n\n      return (\n        <span\n          data-tid=\"PopupMenu__caption\"\n          className={styles.caption()}\n          ref={(element) => (this.captionWrapper = element)}\n        >\n          {caption}\n        </span>\n      );\n    }\n\n    return (\n      <span\n        data-tid=\"PopupMenu__caption\"\n        onClick={this.handleCaptionClick}\n        onKeyDown={this.handleCaptionKeyDown}\n        ref={(element) => (this.captionWrapper = element)}\n        className={styles.caption()}\n      >\n        {this.props.caption}\n      </span>\n    );\n  };\n\n  private hideMenuWithoutFocusing = () => this.hideMenu();\n\n  private getPositions() {\n    if (this.props.positions && isValidPositions(this.props.positions)) {\n      return this.props.positions;\n    }\n\n    return PopupMenuPositions;\n  }\n\n  private showMenu = (firstItemShouldBeSelected?: boolean): void => {\n    this.saveFocus();\n    this.setState(\n      {\n        menuVisible: true,\n        firstItemShouldBeSelected,\n      },\n      () => {\n        this.handleChangeMenuVisible(false);\n      },\n    );\n  };\n\n  private hideMenu = (restoreFocus?: boolean): void => {\n    this.setState(\n      {\n        menuVisible: false,\n        firstItemShouldBeSelected: false,\n      },\n      () => {\n        this.handleChangeMenuVisible(!!restoreFocus);\n      },\n    );\n  };\n\n  private toggleMenu = (): void => {\n    this.state.menuVisible ? this.hideMenu() : this.showMenu();\n  };\n\n  private handleCaptionClick = (): void => {\n    this.toggleMenu();\n  };\n\n  private handleCaptionKeyDown = (e: React.KeyboardEvent<HTMLElement>): void => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      this.showMenu(true);\n    }\n  };\n\n  private handleKeyDown = (e: React.KeyboardEvent<HTMLElement>) => {\n    if (isKeyEscape(e)) {\n      const restoreFocus = true;\n      this.hideMenu(restoreFocus);\n    }\n  };\n\n  private saveFocus = (): void => {\n    if (document) {\n      this.savedFocusableElement = document.activeElement as HTMLElement;\n    }\n  };\n\n  private restoreFocus = (): void => {\n    if (this.savedFocusableElement) {\n      this.savedFocusableElement.focus();\n      this.savedFocusableElement = null;\n    }\n  };\n\n  private handleChangeMenuVisible = (focusShouldBeRestored: boolean): void => {\n    if (focusShouldBeRestored) {\n      this.restoreFocus();\n    }\n    if (typeof this.props.onChangeMenuState === 'function') {\n      this.props.onChangeMenuState(this.state.menuVisible, focusShouldBeRestored);\n    }\n  };\n\n  private handleItemSelection = (event: React.SyntheticEvent<HTMLElement>): void => {\n    if (event.isDefaultPrevented()) {\n      return;\n    }\n\n    if (event.type === 'keydown') {\n      event.preventDefault();\n    }\n\n    const restoreFocus = event.type === 'keydown';\n    this.hideMenu(restoreFocus);\n  };\n}\n"]}

package/internal/PopupMenu/PopupMenu.d.ts

@@ -62,6 +62,7 @@ export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenu
     private captionWrapper;
     private savedFocusableElement;
     private menu;
+    private setRootNode;
     render(): JSX.Element;
     open: () => void;
     close: () => void;

package/internal/RenderContainer/RenderContainer/RenderContainer.js

@@ -24,7 +24,7 @@ export var RenderContainer = /*#__PURE__*/function (_React$Component) {
 
   var _proto = RenderContainer.prototype;
 
-  _proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {
+  _proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
     if (!this.props.children && nextProps.children) {
       this.mountContainer();
     }
@@ -32,6 +32,8 @@ export var RenderContainer = /*#__PURE__*/function (_React$Component) {
     if (this.props.children && !nextProps.children) {
       this.unmountContainer();
     }
+
+    return true;
   };
 
   _proto.componentWillUnmount = function componentWillUnmount() {

package/internal/RenderContainer/RenderContainer/RenderContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["RenderContainer.tsx"],"names":["React","canUseDOM","isBrowser","getRandomID","Upgrade","RenderInnerContainer","RenderContainer","props","domContainer","rootId","getRootId","children","mountContainer","UNSAFE_componentWillReceiveProps","nextProps","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","document","createElement","setAttribute","getSpecificityClassName","parentNode","body","appendChild","window","ReactTesting","addRenderContainer","removeChild","removeRenderContainer","Component","__KONTUR_REACT_UI__"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,SAAT,EAAoBC,SAApB,QAAqC,kBAArC;;AAEA,SAASC,WAAT,QAA4B,iBAA5B;AACA,SAASC,OAAT,QAAwB,oBAAxB;;AAEA,SAASC,oBAAT,QAAqC,wBAArC;;;AAGA,WAAaC,eAAb;;;;;;;;AAQE,2BAAYC,KAAZ,EAAyC;AACvC,wCAAMA,KAAN,UADuC,MAJjCC,YAIiC,GAJK,IAIL,OAFxBC,MAEwB,GAFPH,eAAe,CAACI,SAAhB,EAEO;;AAGvC,QAAIR,SAAS,IAAIK,KAAK,CAACI,QAAvB,EAAiC;AAC/B,YAAKC,cAAL;AACD,KALsC;AAMxC,GAdH;;AAgBSC,EAAAA,gCAhBT,GAgBE,0CAAwCC,SAAxC,EAAyF;AACvF,QAAI,CAAC,KAAKP,KAAL,CAAWI,QAAZ,IAAwBG,SAAS,CAACH,QAAtC,EAAgD;AAC9C,WAAKC,cAAL;AACD;AACD,QAAI,KAAKL,KAAL,CAAWI,QAAX,IAAuB,CAACG,SAAS,CAACH,QAAtC,EAAgD;AAC9C,WAAKI,gBAAL;AACD;AACF,GAvBH;;AAyBSC,EAAAA,oBAzBT,GAyBE,gCAA8B;AAC5B,SAAKC,gBAAL;AACD,GA3BH;;AA6BSC,EAAAA,MA7BT,GA6BE,kBAAgB;AACd,wBAAO,oBAAC,oBAAD,eAA0B,KAAKX,KAA/B,IAAsC,YAAY,EAAE,KAAKC,YAAzD,EAAuE,MAAM,EAAE,KAAKC,MAApF,IAAP;AACD,GA/BH;;AAiCUU,EAAAA,eAjCV,GAiCE,2BAA0B;AACxB,QAAIlB,SAAJ,EAAe;AACb,UAAMO,YAAY,GAAGY,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAArB;AACAb,MAAAA,YAAY,CAACc,YAAb,CAA0B,OAA1B,EAAmClB,OAAO,CAACmB,uBAAR,EAAnC;AACAf,MAAAA,YAAY,CAACc,YAAb,CAA0B,4BAA1B,OAA2D,KAAKb,MAAhE;AACA,WAAKD,YAAL,GAAoBA,YAApB;AACD;AACF,GAxCH;;AA0CUI,EAAAA,cA1CV,GA0CE,0BAAyB;AACvB,QAAI,CAAC,KAAKJ,YAAV,EAAwB;AACtB,WAAKW,eAAL;AACD;AACD,QAAI,KAAKX,YAAL,IAAqB,KAAKA,YAAL,CAAkBgB,UAAlB,KAAiCJ,QAAQ,CAACK,IAAnE,EAAyE;AACvEL,MAAAA,QAAQ,CAACK,IAAT,CAAcC,WAAd,CAA0B,KAAKlB,YAA/B;AACA,UAAImB,MAAM,CAACC,YAAX,EAAyB;AACvBD,QAAAA,MAAM,CAACC,YAAP,CAAoBC,kBAApB,CAAuC,KAAKpB,MAA5C,EAAoD,IAApD;AACD;AACF;AACF,GApDH;;AAsDUQ,EAAAA,gBAtDV,GAsDE,4BAA2B;AACzB,QAAI,KAAKT,YAAT,EAAuB;AACrB,WAAKO,gBAAL;AACA,WAAKP,YAAL,GAAoB,IAApB;AACD;AACF,GA3DH;;AA6DUO,EAAAA,gBA7DV,GA6DE,4BAA2B;AACzB,QAAI,KAAKP,YAAL,IAAqB,KAAKA,YAAL,CAAkBgB,UAA3C,EAAuD;AACrD,WAAKhB,YAAL,CAAkBgB,UAAlB,CAA6BM,WAA7B,CAAyC,KAAKtB,YAA9C;;AAEA,UAAImB,MAAM,CAACC,YAAX,EAAyB;AACvBD,QAAAA,MAAM,CAACC,YAAP,CAAoBG,qBAApB,CAA0C,KAAKtB,MAA/C;AACD;AACF;AACF,GArEH,0BAAqCT,KAAK,CAACgC,SAA3C,EAAa1B,e,CACG2B,mB,GAAsB,iB,CADzB3B,e,CAGII,S,GAAY,oBAAMP,WAAW,EAAjB,E","sourcesContent":["import React from 'react';\n\nimport { canUseDOM, isBrowser } from '../../lib/client';\nimport { Nullable } from '../../typings/utility-types';\nimport { getRandomID } from '../../lib/utils';\nimport { Upgrade } from '../../lib/Upgrades';\n\nimport { RenderInnerContainer } from './RenderInnerContainer';\nimport { RenderContainerProps } from './RenderContainerTypes';\n\nexport class RenderContainer extends React.Component<RenderContainerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderContainer';\n\n  private static getRootId = () => getRandomID();\n  private domContainer: Nullable<HTMLElement> = null;\n\n  private readonly rootId: string = RenderContainer.getRootId();\n\n  constructor(props: RenderContainerProps) {\n    super(props);\n\n    if (isBrowser && props.children) {\n      this.mountContainer();\n    }\n  }\n\n  public UNSAFE_componentWillReceiveProps(nextProps: Readonly<RenderContainerProps>): void {\n    if (!this.props.children && nextProps.children) {\n      this.mountContainer();\n    }\n    if (this.props.children && !nextProps.children) {\n      this.unmountContainer();\n    }\n  }\n\n  public componentWillUnmount() {\n    this.destroyContainer();\n  }\n\n  public render() {\n    return <RenderInnerContainer {...this.props} domContainer={this.domContainer} rootId={this.rootId} />;\n  }\n\n  private createContainer() {\n    if (canUseDOM) {\n      const domContainer = document.createElement('div');\n      domContainer.setAttribute('class', Upgrade.getSpecificityClassName());\n      domContainer.setAttribute('data-rendered-container-id', `${this.rootId}`);\n      this.domContainer = domContainer;\n    }\n  }\n\n  private mountContainer() {\n    if (!this.domContainer) {\n      this.createContainer();\n    }\n    if (this.domContainer && this.domContainer.parentNode !== document.body) {\n      document.body.appendChild(this.domContainer);\n      if (window.ReactTesting) {\n        window.ReactTesting.addRenderContainer(this.rootId, this);\n      }\n    }\n  }\n\n  private destroyContainer() {\n    if (this.domContainer) {\n      this.unmountContainer();\n      this.domContainer = null;\n    }\n  }\n\n  private unmountContainer() {\n    if (this.domContainer && this.domContainer.parentNode) {\n      this.domContainer.parentNode.removeChild(this.domContainer);\n\n      if (window.ReactTesting) {\n        window.ReactTesting.removeRenderContainer(this.rootId);\n      }\n    }\n  }\n}\n"]}
+{"version":3,"sources":["RenderContainer.tsx"],"names":["React","canUseDOM","isBrowser","getRandomID","Upgrade","RenderInnerContainer","RenderContainer","props","domContainer","rootId","getRootId","children","mountContainer","shouldComponentUpdate","nextProps","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","document","createElement","setAttribute","getSpecificityClassName","parentNode","body","appendChild","window","ReactTesting","addRenderContainer","removeChild","removeRenderContainer","Component","__KONTUR_REACT_UI__"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,SAAT,EAAoBC,SAApB,QAAqC,kBAArC;;AAEA,SAASC,WAAT,QAA4B,iBAA5B;AACA,SAASC,OAAT,QAAwB,oBAAxB;;AAEA,SAASC,oBAAT,QAAqC,wBAArC;;;AAGA,WAAaC,eAAb;;;;;;;;AAQE,2BAAYC,KAAZ,EAAyC;AACvC,wCAAMA,KAAN,UADuC,MAJjCC,YAIiC,GAJK,IAIL,OAFxBC,MAEwB,GAFPH,eAAe,CAACI,SAAhB,EAEO;;AAGvC,QAAIR,SAAS,IAAIK,KAAK,CAACI,QAAvB,EAAiC;AAC/B,YAAKC,cAAL;AACD,KALsC;AAMxC,GAdH;;AAgBSC,EAAAA,qBAhBT,GAgBE,+BAA6BC,SAA7B,EAA8D;AAC5D,QAAI,CAAC,KAAKP,KAAL,CAAWI,QAAZ,IAAwBG,SAAS,CAACH,QAAtC,EAAgD;AAC9C,WAAKC,cAAL;AACD;AACD,QAAI,KAAKL,KAAL,CAAWI,QAAX,IAAuB,CAACG,SAAS,CAACH,QAAtC,EAAgD;AAC9C,WAAKI,gBAAL;AACD;AACD,WAAO,IAAP;AACD,GAxBH;;AA0BSC,EAAAA,oBA1BT,GA0BE,gCAA8B;AAC5B,SAAKC,gBAAL;AACD,GA5BH;;AA8BSC,EAAAA,MA9BT,GA8BE,kBAAgB;AACd,wBAAO,oBAAC,oBAAD,eAA0B,KAAKX,KAA/B,IAAsC,YAAY,EAAE,KAAKC,YAAzD,EAAuE,MAAM,EAAE,KAAKC,MAApF,IAAP;AACD,GAhCH;;AAkCUU,EAAAA,eAlCV,GAkCE,2BAA0B;AACxB,QAAIlB,SAAJ,EAAe;AACb,UAAMO,YAAY,GAAGY,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAArB;AACAb,MAAAA,YAAY,CAACc,YAAb,CAA0B,OAA1B,EAAmClB,OAAO,CAACmB,uBAAR,EAAnC;AACAf,MAAAA,YAAY,CAACc,YAAb,CAA0B,4BAA1B,OAA2D,KAAKb,MAAhE;AACA,WAAKD,YAAL,GAAoBA,YAApB;AACD;AACF,GAzCH;;AA2CUI,EAAAA,cA3CV,GA2CE,0BAAyB;AACvB,QAAI,CAAC,KAAKJ,YAAV,EAAwB;AACtB,WAAKW,eAAL;AACD;AACD,QAAI,KAAKX,YAAL,IAAqB,KAAKA,YAAL,CAAkBgB,UAAlB,KAAiCJ,QAAQ,CAACK,IAAnE,EAAyE;AACvEL,MAAAA,QAAQ,CAACK,IAAT,CAAcC,WAAd,CAA0B,KAAKlB,YAA/B;AACA,UAAImB,MAAM,CAACC,YAAX,EAAyB;AACvBD,QAAAA,MAAM,CAACC,YAAP,CAAoBC,kBAApB,CAAuC,KAAKpB,MAA5C,EAAoD,IAApD;AACD;AACF;AACF,GArDH;;AAuDUQ,EAAAA,gBAvDV,GAuDE,4BAA2B;AACzB,QAAI,KAAKT,YAAT,EAAuB;AACrB,WAAKO,gBAAL;AACA,WAAKP,YAAL,GAAoB,IAApB;AACD;AACF,GA5DH;;AA8DUO,EAAAA,gBA9DV,GA8DE,4BAA2B;AACzB,QAAI,KAAKP,YAAL,IAAqB,KAAKA,YAAL,CAAkBgB,UAA3C,EAAuD;AACrD,WAAKhB,YAAL,CAAkBgB,UAAlB,CAA6BM,WAA7B,CAAyC,KAAKtB,YAA9C;;AAEA,UAAImB,MAAM,CAACC,YAAX,EAAyB;AACvBD,QAAAA,MAAM,CAACC,YAAP,CAAoBG,qBAApB,CAA0C,KAAKtB,MAA/C;AACD;AACF;AACF,GAtEH,0BAAqCT,KAAK,CAACgC,SAA3C,EAAa1B,e,CACG2B,mB,GAAsB,iB,CADzB3B,e,CAGII,S,GAAY,oBAAMP,WAAW,EAAjB,E","sourcesContent":["import React from 'react';\n\nimport { canUseDOM, isBrowser } from '../../lib/client';\nimport { Nullable } from '../../typings/utility-types';\nimport { getRandomID } from '../../lib/utils';\nimport { Upgrade } from '../../lib/Upgrades';\n\nimport { RenderInnerContainer } from './RenderInnerContainer';\nimport { RenderContainerProps } from './RenderContainerTypes';\n\nexport class RenderContainer extends React.Component<RenderContainerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderContainer';\n\n  private static getRootId = () => getRandomID();\n  private domContainer: Nullable<HTMLElement> = null;\n\n  private readonly rootId: string = RenderContainer.getRootId();\n\n  constructor(props: RenderContainerProps) {\n    super(props);\n\n    if (isBrowser && props.children) {\n      this.mountContainer();\n    }\n  }\n\n  public shouldComponentUpdate(nextProps: RenderContainerProps) {\n    if (!this.props.children && nextProps.children) {\n      this.mountContainer();\n    }\n    if (this.props.children && !nextProps.children) {\n      this.unmountContainer();\n    }\n    return true;\n  }\n\n  public componentWillUnmount() {\n    this.destroyContainer();\n  }\n\n  public render() {\n    return <RenderInnerContainer {...this.props} domContainer={this.domContainer} rootId={this.rootId} />;\n  }\n\n  private createContainer() {\n    if (canUseDOM) {\n      const domContainer = document.createElement('div');\n      domContainer.setAttribute('class', Upgrade.getSpecificityClassName());\n      domContainer.setAttribute('data-rendered-container-id', `${this.rootId}`);\n      this.domContainer = domContainer;\n    }\n  }\n\n  private mountContainer() {\n    if (!this.domContainer) {\n      this.createContainer();\n    }\n    if (this.domContainer && this.domContainer.parentNode !== document.body) {\n      document.body.appendChild(this.domContainer);\n      if (window.ReactTesting) {\n        window.ReactTesting.addRenderContainer(this.rootId, this);\n      }\n    }\n  }\n\n  private destroyContainer() {\n    if (this.domContainer) {\n      this.unmountContainer();\n      this.domContainer = null;\n    }\n  }\n\n  private unmountContainer() {\n    if (this.domContainer && this.domContainer.parentNode) {\n      this.domContainer.parentNode.removeChild(this.domContainer);\n\n      if (window.ReactTesting) {\n        window.ReactTesting.removeRenderContainer(this.rootId);\n      }\n    }\n  }\n}\n"]}

package/internal/RenderContainer/RenderContainer.d.ts

@@ -6,7 +6,7 @@ export declare class RenderContainer extends React.Component<RenderContainerProp
     private domContainer;
     private readonly rootId;
     constructor(props: RenderContainerProps);
-    UNSAFE_componentWillReceiveProps(nextProps: Readonly<RenderContainerProps>): void;
+    shouldComponentUpdate(nextProps: RenderContainerProps): boolean;
     componentWillUnmount(): void;
     render(): JSX.Element;
     private createContainer;

package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js

@@ -1,7 +1,6 @@
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
-import ReactDOM from 'react-dom';
-import { CommonWrapper } from "../../CommonWrapper"; // Заглушка нужна для корректной гидрации порталов после SSR,
+import ReactDOM from 'react-dom'; // Заглушка нужна для корректной гидрации порталов после SSR,
 // которую реакт сам пока не поддерживает.
 // @see https://github.com/facebook/react/issues/13097
 // А также для вставки актуального render-container-id на клиенте.
@@ -56,7 +55,7 @@ export var RenderInnerContainer = /*#__PURE__*/function (_React$Component) {
         key: "portal-ref",
         rt_rootID: rootId,
         container: domContainer
-      }, /*#__PURE__*/React.createElement(CommonWrapper, this.props, children)));
+      }, children));
     }
 
     return inner;

package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["RenderInnerContainer.tsx"],"names":["React","ReactDOM","CommonWrapper","SSRPlaceholder","Portal","container","rt_rootID","children","createPortal","RenderInnerContainer","render","props","anchor","domContainer","rootId","inner","Component","__KONTUR_REACT_UI__"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,WAArB;;;AAGA,SAASC,aAAT,QAA8B,kBAA9B;;;;;;;;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,wBAAM,gCAAQ,WAAQ,iBAAhB,GAAN,EAAvB;;AAEA,OAAO,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,OAAwC,KAArCC,SAAqC,QAArCA,SAAqC,CAA1BC,SAA0B,QAA1BA,SAA0B,CAAfC,QAAe,QAAfA,QAAe;AAClG;AACA;AACE,wBAAC,KAAD,CAAO,QAAP;AACGF,IAAAA,SAAS,gBAAGJ,QAAQ,CAACO,YAAT,CAAsBD,QAAtB,EAAgCF,SAAhC,CAAH,gBAAgD,oBAAC,cAAD,OAD5D;AAEGA,IAAAA,SAAS,gBAAG,kCAAU,4BAA0BC,SAApC,GAAH,gBAAuD,oBAAC,cAAD,OAFnE,CADF;;;AAMD,CARM;;AAUP,WAAaG,oBAAb;;;AAGSC,EAAAA,MAHT,GAGE,kBAAgB;AACqC,SAAKC,KAD1C,CACNC,MADM,eACNA,MADM,CACEL,QADF,eACEA,QADF,CACYM,YADZ,eACYA,YADZ,CAC0BC,MAD1B,eAC0BA,MAD1B;AAEd,QAAIC,KAAK,GAAGH,MAAZ;;AAEA,QAAIL,QAAJ,EAAc;AACZQ,MAAAA,KAAK;AACH,0BAAC,KAAD,CAAO,QAAP;AACGH,MAAAA,MADH;AAEE,0BAAC,MAAD,IAAQ,GAAG,EAAC,YAAZ,EAAyB,SAAS,EAAEE,MAApC,EAA4C,SAAS,EAAED,YAAvD;AACE,0BAAC,aAAD,EAAmB,KAAKF,KAAxB,EAAgCJ,QAAhC,CADF,CAFF,CADF;;;;AAQD;;AAED,WAAOQ,KAAP;AACD,GAnBH,+BAA0Cf,KAAK,CAACgB,SAAhD,EAAaP,oB,CACGQ,mB,GAAsB,sB","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonWrapper } from '../CommonWrapper';\n\nimport { PortalProps, RenderContainerProps } from './RenderContainerTypes';\n\ninterface RenderInnerContainerProps extends RenderContainerProps {\n  domContainer: Nullable<HTMLElement>;\n  rootId: string;\n}\n\n// Заглушка нужна для корректной гидрации порталов после SSR,\n// которую реакт сам пока не поддерживает.\n// @see https://github.com/facebook/react/issues/13097\n// А также для вставки актуального render-container-id на клиенте.\n//\n// Дело в том, что во время гидрации, структура HTML на сервере\n// и на клиенте должна совпадать, иначе возможны артефакты.\n// Алгоритм там примерно такой. Клиент во время гидрации идет\n// по этим двум деревьям и сравнивает узлы. Элементы разных типов\n// он подменяет на свои. А те, что совпадают, он оставляет как есть\n// вместе со всеми атрибутами, навесив только обработчики событий.\n//\n// Поэтому, для портала, который рендерится только на клиенте,\n// нужно использовать серверную заглушку, чтобы при гидрации\n// он не испортил какой-то другой элемент. Null не подходит,\n// т.к. на сервере он тоже не рендерится.\n// А элемент с render-container-id нужно отрендерить с нуля.\n\nconst SSRPlaceholder = () => <script data-id=\"ssr-placeholder\" />;\n\nexport const Portal: React.FunctionComponent<PortalProps> = ({ container, rt_rootID, children }) => {\n  // container exists only in browser\n  return (\n    <React.Fragment>\n      {container ? ReactDOM.createPortal(children, container) : <SSRPlaceholder />}\n      {container ? <noscript data-render-container-id={rt_rootID} /> : <SSRPlaceholder />}\n    </React.Fragment>\n  );\n};\n\nexport class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderInnerContainer';\n\n  public render() {\n    const { anchor, children, domContainer, rootId } = this.props;\n    let inner = anchor;\n\n    if (children) {\n      inner = (\n        <React.Fragment>\n          {anchor}\n          <Portal key=\"portal-ref\" rt_rootID={rootId} container={domContainer}>\n            <CommonWrapper {...this.props}>{children}</CommonWrapper>\n          </Portal>\n        </React.Fragment>\n      );\n    }\n\n    return inner;\n  }\n}\n"]}
+{"version":3,"sources":["RenderInnerContainer.tsx"],"names":["React","ReactDOM","SSRPlaceholder","Portal","container","rt_rootID","children","createPortal","RenderInnerContainer","render","props","anchor","domContainer","rootId","inner","Component","__KONTUR_REACT_UI__"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,WAArB;;;;;;;;;;;AAWA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,wBAAM,gCAAQ,WAAQ,iBAAhB,GAAN,EAAvB;;AAEA,OAAO,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,OAAwC,KAArCC,SAAqC,QAArCA,SAAqC,CAA1BC,SAA0B,QAA1BA,SAA0B,CAAfC,QAAe,QAAfA,QAAe;AAClG;AACA;AACE,wBAAC,KAAD,CAAO,QAAP;AACGF,IAAAA,SAAS,gBAAGH,QAAQ,CAACM,YAAT,CAAsBD,QAAtB,EAAgCF,SAAhC,CAAH,gBAAgD,oBAAC,cAAD,OAD5D;AAEGA,IAAAA,SAAS,gBAAG,kCAAU,4BAA0BC,SAApC,GAAH,gBAAuD,oBAAC,cAAD,OAFnE,CADF;;;AAMD,CARM;;AAUP,WAAaG,oBAAb;;;AAGSC,EAAAA,MAHT,GAGE,kBAAgB;AACqC,SAAKC,KAD1C,CACNC,MADM,eACNA,MADM,CACEL,QADF,eACEA,QADF,CACYM,YADZ,eACYA,YADZ,CAC0BC,MAD1B,eAC0BA,MAD1B;AAEd,QAAIC,KAAK,GAAGH,MAAZ;;AAEA,QAAIL,QAAJ,EAAc;AACZQ,MAAAA,KAAK;AACH,0BAAC,KAAD,CAAO,QAAP;AACGH,MAAAA,MADH;AAEE,0BAAC,MAAD,IAAQ,GAAG,EAAC,YAAZ,EAAyB,SAAS,EAAEE,MAApC,EAA4C,SAAS,EAAED,YAAvD;AACGN,MAAAA,QADH,CAFF,CADF;;;;AAQD;;AAED,WAAOQ,KAAP;AACD,GAnBH,+BAA0Cd,KAAK,CAACe,SAAhD,EAAaP,oB,CACGQ,mB,GAAsB,sB","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\n\nimport { Nullable } from '../../typings/utility-types';\n\nimport { PortalProps, RenderContainerProps } from './RenderContainerTypes';\n\ninterface RenderInnerContainerProps extends RenderContainerProps {\n  domContainer: Nullable<HTMLElement>;\n  rootId: string;\n}\n\n// Заглушка нужна для корректной гидрации порталов после SSR,\n// которую реакт сам пока не поддерживает.\n// @see https://github.com/facebook/react/issues/13097\n// А также для вставки актуального render-container-id на клиенте.\n//\n// Дело в том, что во время гидрации, структура HTML на сервере\n// и на клиенте должна совпадать, иначе возможны артефакты.\n// Алгоритм там примерно такой. Клиент во время гидрации идет\n// по этим двум деревьям и сравнивает узлы. Элементы разных типов\n// он подменяет на свои. А те, что совпадают, он оставляет как есть\n// вместе со всеми атрибутами, навесив только обработчики событий.\n//\n// Поэтому, для портала, который рендерится только на клиенте,\n// нужно использовать серверную заглушку, чтобы при гидрации\n// он не испортил какой-то другой элемент. Null не подходит,\n// т.к. на сервере он тоже не рендерится.\n// А элемент с render-container-id нужно отрендерить с нуля.\n\nconst SSRPlaceholder = () => <script data-id=\"ssr-placeholder\" />;\n\nexport const Portal: React.FunctionComponent<PortalProps> = ({ container, rt_rootID, children }) => {\n  // container exists only in browser\n  return (\n    <React.Fragment>\n      {container ? ReactDOM.createPortal(children, container) : <SSRPlaceholder />}\n      {container ? <noscript data-render-container-id={rt_rootID} /> : <SSRPlaceholder />}\n    </React.Fragment>\n  );\n};\n\nexport class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderInnerContainer';\n\n  public render() {\n    const { anchor, children, domContainer, rootId } = this.props;\n    let inner = anchor;\n\n    if (children) {\n      inner = (\n        <React.Fragment>\n          {anchor}\n          <Portal key=\"portal-ref\" rt_rootID={rootId} container={domContainer}>\n            {children}\n          </Portal>\n        </React.Fragment>\n      );\n    }\n\n    return inner;\n  }\n}\n"]}

package/internal/RenderLayer/RenderLayer/RenderLayer.js

@@ -1,9 +1,14 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
 import React from 'react';
-import { findDOMNode } from 'react-dom';
 import { listen as listenFocusOutside, containsTargetOrRenderContainer } from "../../../lib/listenFocusOutside";
 import { CommonWrapper } from "../../CommonWrapper";
-export var RenderLayer = /*#__PURE__*/function (_React$Component) {
+import { getRootNode, rootNode } from "../../../lib/rootNode";
+export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(RenderLayer, _React$Component);
 
   function RenderLayer() {
@@ -15,6 +20,7 @@ export var RenderLayer = /*#__PURE__*/function (_React$Component) {
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
     _this.focusOutsideListenerToken = null;
+    _this.setRootNode = void 0;
 
     _this.handleFocusOutside = function (event) {
       if (_this.props.onFocusOutside) {
@@ -24,10 +30,9 @@ export var RenderLayer = /*#__PURE__*/function (_React$Component) {
 
     _this.handleNativeDocClick = function (event) {
       var target = event.target || event.srcElement;
+      var node = getRootNode(_assertThisInitialized(_this)) || getRootNode(_this.props.getAnchorElement == null ? void 0 : _this.props.getAnchorElement());
 
-      var node = _this.getDomNode();
-
-      if (target instanceof Element && containsTargetOrRenderContainer(target)(node)) {
+      if (!node || target instanceof Element && containsTargetOrRenderContainer(target)(node)) {
         return;
       }
 
@@ -64,14 +69,18 @@ export var RenderLayer = /*#__PURE__*/function (_React$Component) {
   };
 
   _proto.render = function render() {
-    return /*#__PURE__*/React.createElement(CommonWrapper, this.props, React.Children.only(this.props.children));
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), React.Children.only(this.props.children));
   };
 
   _proto.attachListeners = function attachListeners() {
-    var _this2 = this;
+    var _this$props$getAnchor, _this$props;
 
+    var rootNode = getRootNode(this) || ((_this$props$getAnchor = (_this$props = this.props).getAnchorElement) == null ? void 0 : _this$props$getAnchor.call(_this$props));
+    if (!rootNode) return;
     this.focusOutsideListenerToken = listenFocusOutside(function () {
-      return [_this2.getDomNode()];
+      return [rootNode];
     }, this.handleFocusOutside);
     window.addEventListener('blur', this.handleFocusOutside);
     document.addEventListener('ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown', this.handleNativeDocClick);
@@ -87,14 +96,8 @@ export var RenderLayer = /*#__PURE__*/function (_React$Component) {
     document.removeEventListener('ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown', this.handleNativeDocClick);
   };
 
-  _proto.getDomNode = function getDomNode() {
-    return findDOMNode(this);
-  };
-
   return RenderLayer;
-}(React.Component);
-RenderLayer.__KONTUR_REACT_UI__ = 'RenderLayer';
-RenderLayer.propTypes = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'RenderLayer', _class2.propTypes = {
   active: function active(props, propName, componentName) {
     var active = props.active,
         onClickOutside = props.onClickOutside,
@@ -104,7 +107,6 @@ RenderLayer.propTypes = {
       return new Error("[" + componentName + "]: using the component without either 'onClickOutside' or 'onFocusOutside' callback is pointless.");
     }
   }
-};
-RenderLayer.defaultProps = {
+}, _class2.defaultProps = {
   active: true
-};
+}, _temp)) || _class;

package/internal/RenderLayer/RenderLayer/RenderLayer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["RenderLayer.tsx"],"names":["React","findDOMNode","listen","listenFocusOutside","containsTargetOrRenderContainer","CommonWrapper","RenderLayer","focusOutsideListenerToken","handleFocusOutside","event","props","onFocusOutside","handleNativeDocClick","target","srcElement","node","getDomNode","Element","onClickOutside","componentDidMount","active","attachListeners","componentDidUpdate","prevProps","detachListeners","componentWillUnmount","render","Children","only","children","window","addEventListener","document","documentElement","remove","removeEventListener","Component","__KONTUR_REACT_UI__","propTypes","propName","componentName","Error","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { findDOMNode } from 'react-dom';\n\nimport { listen as listenFocusOutside, containsTargetOrRenderContainer } from '../../lib/listenFocusOutside';\nimport { CommonProps, CommonWrapper } from '../CommonWrapper';\n\nexport interface RenderLayerProps extends CommonProps {\n  children: JSX.Element;\n  onClickOutside?: (e: Event) => void;\n  onFocusOutside?: (e: Event) => void;\n  active?: boolean;\n}\n\nexport class RenderLayer extends React.Component<RenderLayerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderLayer';\n\n  public static propTypes = {\n    active(props: RenderLayerProps, propName: keyof RenderLayerProps, componentName: string) {\n      const { active, onClickOutside, onFocusOutside } = props;\n      if (active && !(onClickOutside || onFocusOutside)) {\n        return new Error(\n          `[${componentName}]: using the component without either 'onClickOutside' or 'onFocusOutside' callback is pointless.`,\n        );\n      }\n    },\n  };\n\n  public static defaultProps = {\n    active: true,\n  };\n\n  private focusOutsideListenerToken: {\n    remove: () => void;\n  } | null = null;\n\n  public componentDidMount() {\n    if (this.props.active) {\n      this.attachListeners();\n    }\n  }\n\n  public componentDidUpdate(prevProps: RenderLayerProps) {\n    if (!prevProps.active && this.props.active) {\n      this.attachListeners();\n    }\n    if (prevProps.active && !this.props.active) {\n      this.detachListeners();\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.props.active) {\n      this.detachListeners();\n    }\n  }\n\n  public render() {\n    return <CommonWrapper {...this.props}>{React.Children.only(this.props.children)}</CommonWrapper>;\n  }\n\n  private attachListeners() {\n    this.focusOutsideListenerToken = listenFocusOutside(() => [this.getDomNode()], this.handleFocusOutside);\n    window.addEventListener('blur', this.handleFocusOutside);\n    document.addEventListener(\n      'ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private detachListeners() {\n    if (this.focusOutsideListenerToken) {\n      this.focusOutsideListenerToken.remove();\n      this.focusOutsideListenerToken = null;\n    }\n\n    window.removeEventListener('blur', this.handleFocusOutside);\n    document.removeEventListener(\n      'ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private getDomNode() {\n    return findDOMNode(this) as HTMLElement;\n  }\n\n  private handleFocusOutside = (event: Event) => {\n    if (this.props.onFocusOutside) {\n      this.props.onFocusOutside(event);\n    }\n  };\n\n  private handleNativeDocClick = (event: Event) => {\n    const target = event.target || event.srcElement;\n    const node = this.getDomNode();\n\n    if (target instanceof Element && containsTargetOrRenderContainer(target)(node)) {\n      return;\n    }\n\n    if (this.props.onClickOutside) {\n      this.props.onClickOutside(event);\n    }\n  };\n}\n"]}
+{"version":3,"sources":["RenderLayer.tsx"],"names":["React","listen","listenFocusOutside","containsTargetOrRenderContainer","CommonWrapper","getRootNode","rootNode","RenderLayer","focusOutsideListenerToken","setRootNode","handleFocusOutside","event","props","onFocusOutside","handleNativeDocClick","target","srcElement","node","getAnchorElement","Element","onClickOutside","componentDidMount","active","attachListeners","componentDidUpdate","prevProps","detachListeners","componentWillUnmount","render","Children","only","children","window","addEventListener","document","documentElement","remove","removeEventListener","Component","__KONTUR_REACT_UI__","propTypes","propName","componentName","Error","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { listen as listenFocusOutside, containsTargetOrRenderContainer } from '../../lib/listenFocusOutside';\nimport { CommonProps, CommonWrapper } from '../CommonWrapper';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { Nullable } from '../../typings/utility-types';\n\nexport interface RenderLayerProps extends CommonProps {\n  children: JSX.Element;\n  onClickOutside?: (e: Event) => void;\n  onFocusOutside?: (e: Event) => void;\n  active?: boolean;\n  getAnchorElement?: () => Nullable<HTMLElement>;\n}\n\n@rootNode\nexport class RenderLayer extends React.Component<RenderLayerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderLayer';\n\n  public static propTypes = {\n    active(props: RenderLayerProps, propName: keyof RenderLayerProps, componentName: string) {\n      const { active, onClickOutside, onFocusOutside } = props;\n      if (active && !(onClickOutside || onFocusOutside)) {\n        return new Error(\n          `[${componentName}]: using the component without either 'onClickOutside' or 'onFocusOutside' callback is pointless.`,\n        );\n      }\n    },\n  };\n\n  public static defaultProps = {\n    active: true,\n  };\n\n  private focusOutsideListenerToken: {\n    remove: () => void;\n  } | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    if (this.props.active) {\n      this.attachListeners();\n    }\n  }\n\n  public componentDidUpdate(prevProps: RenderLayerProps) {\n    if (!prevProps.active && this.props.active) {\n      this.attachListeners();\n    }\n    if (prevProps.active && !this.props.active) {\n      this.detachListeners();\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.props.active) {\n      this.detachListeners();\n    }\n  }\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {React.Children.only(this.props.children)}\n      </CommonWrapper>\n    );\n  }\n\n  private attachListeners() {\n    const rootNode = getRootNode(this) || this.props.getAnchorElement?.();\n    if (!rootNode) return;\n    this.focusOutsideListenerToken = listenFocusOutside(() => [rootNode], this.handleFocusOutside);\n    window.addEventListener('blur', this.handleFocusOutside);\n    document.addEventListener(\n      'ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private detachListeners() {\n    if (this.focusOutsideListenerToken) {\n      this.focusOutsideListenerToken.remove();\n      this.focusOutsideListenerToken = null;\n    }\n\n    window.removeEventListener('blur', this.handleFocusOutside);\n    document.removeEventListener(\n      'ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown',\n      this.handleNativeDocClick,\n    );\n  }\n\n  private handleFocusOutside = (event: Event) => {\n    if (this.props.onFocusOutside) {\n      this.props.onFocusOutside(event);\n    }\n  };\n\n  private handleNativeDocClick = (event: Event) => {\n    const target = event.target || event.srcElement;\n    const node = getRootNode(this) || getRootNode(this.props.getAnchorElement?.());\n\n    if (!node || (target instanceof Element && containsTargetOrRenderContainer(target)(node))) {\n      return;\n    }\n\n    if (this.props.onClickOutside) {\n      this.props.onClickOutside(event);\n    }\n  };\n}\n"]}

package/internal/RenderLayer/RenderLayer.d.ts

@@ -1,10 +1,12 @@
 import React from 'react';
 import { CommonProps } from '../CommonWrapper';
+import { Nullable } from '../../typings/utility-types';
 export interface RenderLayerProps extends CommonProps {
     children: JSX.Element;
     onClickOutside?: (e: Event) => void;
     onFocusOutside?: (e: Event) => void;
     active?: boolean;
+    getAnchorElement?: () => Nullable<HTMLElement>;
 }
 export declare class RenderLayer extends React.Component<RenderLayerProps> {
     static __KONTUR_REACT_UI__: string;
@@ -15,13 +17,13 @@ export declare class RenderLayer extends React.Component<RenderLayerProps> {
         active: boolean;
     };
     private focusOutsideListenerToken;
+    private setRootNode;
     componentDidMount(): void;
     componentDidUpdate(prevProps: RenderLayerProps): void;
     componentWillUnmount(): void;
     render(): JSX.Element;
     private attachListeners;
     private detachListeners;
-    private getDomNode;
     private handleFocusOutside;
     private handleNativeDocClick;
 }

package/internal/ThemeShowcase/ThemeShowcase/ThemeShowcase.js

@@ -17,14 +17,10 @@ var ALL_VARIABLES = Object.keys(defaultVariables);
 export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(ThemeShowcase, _React$Component);
 
-  function ThemeShowcase() {
+  function ThemeShowcase(props) {
     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 = _React$Component.call(this, props) || this;
     _this.state = {};
     _this.isUnmounting = false;
     _this.variablesDiff = [];
@@ -59,27 +55,23 @@ export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
       }
     };
 
-    return _this;
-  }
-
-  var _proto = ThemeShowcase.prototype;
-
-  _proto.UNSAFE_componentWillMount = function UNSAFE_componentWillMount() {
-    var _this2 = this;
-
-    if (this.props.isDebugMode) {
+    if (props.isDebugMode) {
       ALL_VARIABLES.forEach(function (variable) {
         var found = ALL_USED_VARIABLES.includes(variable);
 
         if (!found) {
-          _this2.variablesDiff.push(variable);
+          _this.variablesDiff.push(variable);
         }
       });
     }
-  };
+
+    return _this;
+  }
+
+  var _proto = ThemeShowcase.prototype;
 
   _proto.render = function render() {
-    var _this3 = this;
+    var _this2 = this;
 
     if (!IS_PROXY_SUPPORTED) {
       return /*#__PURE__*/React.createElement("div", null, "\u0422\u0430\u0431\u043B\u0438\u0446\u0430 \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u043E\u0432\u0430\u043D\u0438\u044F \u043F\u0435\u0440\u0435\u043C\u0435\u043D\u043D\u044B\u0445 \u0434\u043E\u0441\u0442\u0443\u043F\u043D\u0430 \u0442\u043E\u043B\u044C\u043A\u043E \u0432", ' ', /*#__PURE__*/React.createElement(Link, {
@@ -118,7 +110,7 @@ export var ThemeShowcase = /*#__PURE__*/function (_React$Component) {
         name: componentName,
         description: descriptionsToRender[componentName],
         isDebugMode: isDebugMode,
-        onVariableSelect: _this3.handleVariableChange
+        onVariableSelect: _this2.handleVariableChange
       });
     })), /*#__PURE__*/React.createElement(ShowUnusedVariables, {
       diff: this.variablesDiff
@@ -160,7 +152,7 @@ var ComponentShowcase = /*#__PURE__*/function (_React$Component2) {
   var _proto2 = ComponentShowcase.prototype;
 
   _proto2.render = function render() {
-    var _this4 = this;
+    var _this3 = this;
 
     var _this$props = this.props,
         name = _this$props.name,
@@ -176,7 +168,7 @@ var ComponentShowcase = /*#__PURE__*/function (_React$Component2) {
 
       return /*#__PURE__*/React.createElement("h2", {
         className: cx((_cx = {}, _cx[styles.heading()] = true, _cx[styles.headingSticky()] = isSticky, _cx))
-      }, _this4.props.name);
+      }, _this3.props.name);
     }), /*#__PURE__*/React.createElement("table", {
       className: styles.table()
     }, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("th", {
@@ -223,7 +215,7 @@ var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
   var _proto3 = ComponentShowcaseRow.prototype;
 
   _proto3.render = function render() {
-    var _this5 = this;
+    var _this4 = this;
 
     var _this$props2 = this.props,
         el = _this$props2.element,
@@ -258,7 +250,7 @@ var ComponentShowcaseRow = /*#__PURE__*/function (_React$Component3) {
       }, /*#__PURE__*/React.createElement(VariableName, {
         variableName: varName,
         dependencies: dependencies,
-        onVariableSelect: _this5.props.onVariableSelect
+        onVariableSelect: _this4.props.onVariableSelect
       })), /*#__PURE__*/React.createElement("td", {
         className: styles.cell()
       }, /*#__PURE__*/React.createElement(VariableValue, {
@@ -278,18 +270,18 @@ var VariableName = /*#__PURE__*/function (_React$Component4) {
   _inheritsLoose(VariableName, _React$Component4);
 
   function VariableName() {
-    var _this6;
+    var _this5;
 
-    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-      args[_key2] = arguments[_key2];
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
     }
 
-    _this6 = _React$Component4.call.apply(_React$Component4, [this].concat(args)) || this;
+    _this5 = _React$Component4.call.apply(_React$Component4, [this].concat(args)) || this;
 
-    _this6.handleVariableSelect = function () {
-      var _this6$props = _this6.props,
-          variableName = _this6$props.variableName,
-          onVariableSelect = _this6$props.onVariableSelect;
+    _this5.handleVariableSelect = function () {
+      var _this5$props = _this5.props,
+          variableName = _this5$props.variableName,
+          onVariableSelect = _this5$props.onVariableSelect;
 
       if (onVariableSelect) {
         onVariableSelect({
@@ -299,7 +291,7 @@ var VariableName = /*#__PURE__*/function (_React$Component4) {
       }
     };
 
-    return _this6;
+    return _this5;
   }
 
   var _proto4 = VariableName.prototype;
@@ -331,16 +323,16 @@ var DependencyName = /*#__PURE__*/function (_React$Component5) {
   _inheritsLoose(DependencyName, _React$Component5);
 
   function DependencyName() {
-    var _this7;
+    var _this6;
 
-    for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-      args[_key3] = arguments[_key3];
+    for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      args[_key2] = arguments[_key2];
     }
 
-    _this7 = _React$Component5.call.apply(_React$Component5, [this].concat(args)) || this;
+    _this6 = _React$Component5.call.apply(_React$Component5, [this].concat(args)) || this;
 
-    _this7.getValues = function () {
-      var dependencyName = _this7.props.dependencyName;
+    _this6.getValues = function () {
+      var dependencyName = _this6.props.dependencyName;
       var dependencyDefault = defaultVariables[dependencyName];
       var dependencyFlat = flatVariables[dependencyName];
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, "Default value: ", /*#__PURE__*/React.createElement(VariableValue, {
@@ -350,10 +342,10 @@ var DependencyName = /*#__PURE__*/function (_React$Component5) {
       })));
     };
 
-    _this7.handleDependencySelect = function () {
-      var _this7$props = _this7.props,
-          dependencyName = _this7$props.dependencyName,
-          onDependencySelect = _this7$props.onDependencySelect;
+    _this6.handleDependencySelect = function () {
+      var _this6$props = _this6.props,
+          dependencyName = _this6$props.dependencyName,
+          onDependencySelect = _this6$props.onDependencySelect;
 
       if (onDependencySelect) {
         onDependencySelect({
@@ -363,7 +355,7 @@ var DependencyName = /*#__PURE__*/function (_React$Component5) {
       }
     };
 
-    return _this7;
+    return _this6;
   }
 
   var _proto5 = DependencyName.prototype;