@skbkontur/react-ui 0.0.0-dd8159fe6c → 0.0.0-ecefada396

package/cjs/internal/PopupMenu/PopupMenu.js

@@ -0,0 +1,273 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.PopupMenu = exports.PopupMenuType = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+
+var _identifiers = require("../../lib/events/keyboard/identifiers");
+
+
+
+
+
+
+var _InternalMenu = require("../InternalMenu");
+var _Popup = require("../Popup");
+var _RenderLayer = require("../RenderLayer");
+
+var _CommonWrapper = require("../../internal/CommonWrapper");
+var _ResponsiveLayout = require("../../components/ResponsiveLayout");
+
+var _PopupMenuPositions = require("./PopupMenuPositions");
+var _validatePositions = require("./validatePositions");
+var _PopupMenu = require("./PopupMenu.styles");var _class, _class2, _temp;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var PopupMenuType = {
+  Dropdown: 'dropdown',
+  Tooltip: 'tooltip' };exports.PopupMenuType = PopupMenuType;var
+
+
+
+PopupMenu = (0, _ResponsiveLayout.responsiveLayout)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(PopupMenu, _React$Component);function PopupMenu() {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.
+
+
+    isMobileLayout = void 0;_this.
+
+
+
+
+
+
+
+
+
+
+    state = {
+      menuVisible: false,
+      firstItemShouldBeSelected: false };_this.
+
+
+    captionWrapper = null;_this.
+    savedFocusableElement = null;_this.
+    menu = null;_this.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    open = function () {return _this.showMenu();};_this.
+    close = function () {return _this.hideMenu();};_this.
+
+    refInternalMenu = function (element) {return _this.menu = element;};_this.
+
+    handleOpen = function () {
+      if (_this.menu) {
+        _this.menu.focus();
+      }
+    };_this.
+
+    renderCaption = function () {
+      if (typeof _this.props.caption === 'function') {
+        var caption = _this.props.caption({
+          opened: _this.state.menuVisible,
+          openMenu: _this.showMenu,
+          closeMenu: _this.hideMenu,
+          toggleMenu: _this.toggleMenu });
+
+
+        return /*#__PURE__*/(
+          _react.default.createElement("span", {
+            "data-tid": "PopupMenu__caption",
+            className: _PopupMenu.styles.caption(),
+            ref: function ref(element) {return _this.captionWrapper = element;} },
+
+          caption));
+
+
+      }
+
+      return /*#__PURE__*/(
+        _react.default.createElement("span", {
+          "data-tid": "PopupMenu__caption",
+          onClick: _this.handleCaptionClick,
+          onKeyDown: _this.handleCaptionKeyDown,
+          ref: function ref(element) {return _this.captionWrapper = element;},
+          className: _PopupMenu.styles.caption() },
+
+        _this.props.caption));
+
+
+    };_this.
+
+    hideMenuWithoutFocusing = function () {return _this.hideMenu();};_this.
+
+
+
+
+
+
+
+
+
+    showMenu = function (firstItemShouldBeSelected) {
+      _this.saveFocus();
+      _this.setState(
+      {
+        menuVisible: true,
+        firstItemShouldBeSelected: firstItemShouldBeSelected },
+
+      function () {
+        _this.handleChangeMenuVisible(false);
+      });
+
+    };_this.
+
+    hideMenu = function (restoreFocus) {
+      _this.setState(
+      {
+        menuVisible: false,
+        firstItemShouldBeSelected: false },
+
+      function () {
+        _this.handleChangeMenuVisible(!!restoreFocus);
+      });
+
+    };_this.
+
+    toggleMenu = function () {
+      _this.state.menuVisible ? _this.hideMenu() : _this.showMenu();
+    };_this.
+
+    handleCaptionClick = function () {
+      _this.toggleMenu();
+    };_this.
+
+    handleCaptionKeyDown = function (e) {
+      if ((0, _identifiers.someKeys)(_identifiers.isKeyEnter, _identifiers.isKeySpace, _identifiers.isKeyArrowVertical)(e)) {
+        e.preventDefault();
+        _this.showMenu(true);
+      }
+    };_this.
+
+    handleKeyDown = function (e) {
+      if ((0, _identifiers.isKeyEscape)(e)) {
+        var _restoreFocus = true;
+        _this.hideMenu(_restoreFocus);
+      }
+    };_this.
+
+    saveFocus = function () {
+      if (document) {
+        _this.savedFocusableElement = document.activeElement;
+      }
+    };_this.
+
+    restoreFocus = function () {
+      if (_this.savedFocusableElement) {
+        _this.savedFocusableElement.focus();
+        _this.savedFocusableElement = null;
+      }
+    };_this.
+
+    handleChangeMenuVisible = function (focusShouldBeRestored) {
+      if (focusShouldBeRestored) {
+        _this.restoreFocus();
+      }
+      if (typeof _this.props.onChangeMenuState === 'function') {
+        _this.props.onChangeMenuState(_this.state.menuVisible, focusShouldBeRestored);
+      }
+    };_this.
+
+    handleItemSelection = function (event) {
+      if (event.isDefaultPrevented()) {
+        return;
+      }
+
+      if (event.type === 'keydown') {
+        event.preventDefault();
+      }
+
+      var restoreFocus = event.type === 'keydown';
+      _this.hideMenu(restoreFocus);
+    };return _this;}var _proto = PopupMenu.prototype;_proto.render = function render() {return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: this.hideMenuWithoutFocusing, onFocusOutside: this.hideMenuWithoutFocusing, active: this.state.menuVisible }, /*#__PURE__*/_react.default.createElement("div", { className: _PopupMenu.styles.container(), style: { width: this.props.width } }, this.renderCaption(), this.captionWrapper && this.props.children && /*#__PURE__*/_react.default.createElement(_Popup.Popup, { anchorElement: this.captionWrapper, opened: this.state.menuVisible, hasShadow: true, margin: this.props.popupMargin, hasPin: this.props.popupHasPin, pinOffset: this.props.popupPinOffset, positions: this.getPositions(), disableAnimations: this.props.disableAnimations, onOpen: this.handleOpen, mobileOnCloseRequest: this.hideMenu, width: this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto' }, /*#__PURE__*/_react.default.createElement(_InternalMenu.InternalMenu, { hasShadow: false, maxHeight: this.isMobileLayout ? 'none' : this.props.menuMaxHeight || 'none', onKeyDown: this.handleKeyDown, onItemClick: this.handleItemSelection, cyclicSelection: false, ref: this.refInternalMenu, initialSelectedItemIndex: this.state.firstItemShouldBeSelected ? 0 : -1, header: this.props.header, footer: this.props.footer }, this.props.children)))));};_proto.getPositions = function getPositions() {if (this.props.positions && (0, _validatePositions.isValidPositions)(this.props.positions)) {return this.props.positions;}return _PopupMenuPositions.PopupMenuPositions;};return PopupMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'PopupMenu', _class2.defaultProps = { positions: _PopupMenuPositions.PopupMenuPositions, type: PopupMenuType.Tooltip, popupHasPin: true, disableAnimations: false }, _class2.Type = PopupMenuType, _temp)) || _class;exports.PopupMenu = PopupMenu;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["PopupMenu.tsx"],"names":["PopupMenuType","Dropdown","Tooltip","PopupMenu","responsiveLayout","isMobileLayout","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","caption","opened","openMenu","closeMenu","toggleMenu","styles","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","container","width","children","popupMargin","popupHasPin","popupPinOffset","getPositions","disableAnimations","menuWidth","menuMaxHeight","header","footer","positions","PopupMenuPositions","React","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 { responsiveLayout } from '../../components/ResponsiveLayout';\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@responsiveLayout\nexport class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {\n  public static __KONTUR_REACT_UI__ = 'PopupMenu';\n\n  private isMobileLayout!: boolean;\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                mobileOnCloseRequest={this.hideMenu}\n                width={this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto'}\n              >\n                <InternalMenu\n                  hasShadow={false}\n                  maxHeight={this.isMobileLayout ? 'none' : 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/cjs/internal/PopupMenu/PopupMenu.styles.d.ts

@@ -0,0 +1,4 @@
+export declare const styles: {
+    caption(): string;
+    container(): string;
+};

package/cjs/internal/PopupMenu/PopupMenu.styles.js

@@ -0,0 +1,15 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2;
+
+var styles = (0, _Emotion.memoizeStyle)({
+  caption: function caption() {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      width: 100%;\n    "])));
+
+
+
+  },
+  container: function container() {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      line-height: normal;\n    "])));
+
+
+
+  } });exports.styles = styles;

package/cjs/internal/PopupMenu/PopupMenu.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PopupMenu.styles.ts"],"names":["styles","caption","css","container"],"mappings":"4QAAA,oD;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,OADiC,qBACvB;AACR,eAAOC,YAAP;;;;AAID,GANgC;AAOjCC,EAAAA,SAPiC,uBAOrB;AACV,eAAOD,YAAP;;;;AAID,GAZgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  caption() {\n    return css`\n      display: inline-block;\n      width: 100%;\n    `;\n  },\n  container() {\n    return css`\n      display: inline-block;\n      line-height: normal;\n    `;\n  },\n});\n"]}

package/cjs/internal/PopupMenu/PopupMenuPositions.d.ts

@@ -0,0 +1,2 @@
+import { PopupPosition } from '../Popup';
+export declare const PopupMenuPositions: PopupPosition[];

package/cjs/internal/PopupMenu/PopupMenuPositions.js

@@ -0,0 +1,15 @@
+"use strict";exports.__esModule = true;exports.PopupMenuPositions = void 0;
+
+var PopupMenuPositions = [
+'top left',
+'top center',
+'top right',
+'right top',
+'right middle',
+'right bottom',
+'bottom left',
+'bottom center',
+'bottom right',
+'left top',
+'left middle',
+'left bottom'];exports.PopupMenuPositions = PopupMenuPositions;

package/cjs/internal/PopupMenu/PopupMenuPositions.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PopupMenuPositions.tsx"],"names":["PopupMenuPositions"],"mappings":";;AAEO,IAAMA,kBAAmC,GAAG;AACjD,UADiD;AAEjD,YAFiD;AAGjD,WAHiD;AAIjD,WAJiD;AAKjD,cALiD;AAMjD,cANiD;AAOjD,aAPiD;AAQjD,eARiD;AASjD,cATiD;AAUjD,UAViD;AAWjD,aAXiD;AAYjD,aAZiD,CAA5C,C","sourcesContent":["import { PopupPosition } from '../Popup';\n\nexport const PopupMenuPositions: PopupPosition[] = [\n  'top left',\n  'top center',\n  'top right',\n  'right top',\n  'right middle',\n  'right bottom',\n  'bottom left',\n  'bottom center',\n  'bottom right',\n  'left top',\n  'left middle',\n  'left bottom',\n];\n"]}

package/cjs/internal/PopupMenu/index.d.ts

@@ -0,0 +1 @@
+export * from './PopupMenu';

package/cjs/internal/PopupMenu/index.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;var _PopupMenu = require("./PopupMenu");Object.keys(_PopupMenu).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _PopupMenu[key]) return;exports[key] = _PopupMenu[key];});

package/cjs/internal/PopupMenu/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './PopupMenu';\n"]}

package/cjs/internal/PopupMenu/validatePositions.d.ts

@@ -0,0 +1,2 @@
+import { PopupPosition } from '../Popup';
+export declare const isValidPositions: (positions: PopupPosition[]) => boolean;

package/cjs/internal/PopupMenu/validatePositions.js

@@ -0,0 +1,22 @@
+"use strict";exports.__esModule = true;exports.isValidPositions = void 0;var _currentEnvironment = require("../../lib/currentEnvironment");
+
+
+var _PopupMenuPositions = require("./PopupMenuPositions");
+
+var isValidPosition = function isValidPosition(position) {
+  return _PopupMenuPositions.PopupMenuPositions.includes(position);
+};
+
+var isValidPositions = function isValidPositions(positions) {
+  return positions.every(function (item) {
+    if (_currentEnvironment.isProductionEnv) {
+      return isValidPosition(item);
+    } else {
+      if (isValidPosition(item)) {
+        return true;
+      } else {
+        throw new Error("Unxpected position \"" + item + "\"");
+      }
+    }
+  });
+};exports.isValidPositions = isValidPositions;

package/cjs/internal/PopupMenu/validatePositions.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["validatePositions.tsx"],"names":["isValidPosition","position","PopupMenuPositions","includes","isValidPositions","positions","every","item","isProductionEnv","Error"],"mappings":"yEAAA;;;AAGA;;AAEA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,CAACC,QAAD,EAAsC;AAC5D,SAAOC,uCAAmBC,QAAnB,CAA4BF,QAA5B,CAAP;AACD,CAFD;;AAIO,IAAMG,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,SAAD,EAAyC;AACvE,SAAOA,SAAS,CAACC,KAAV,CAAgB,UAACC,IAAD,EAAU;AAC/B,QAAIC,mCAAJ,EAAqB;AACnB,aAAOR,eAAe,CAACO,IAAD,CAAtB;AACD,KAFD,MAEO;AACL,UAAIP,eAAe,CAACO,IAAD,CAAnB,EAA2B;AACzB,eAAO,IAAP;AACD,OAFD,MAEO;AACL,cAAM,IAAIE,KAAJ,2BAAiCF,IAAjC,QAAN;AACD;AACF;AACF,GAVM,CAAP;AAWD,CAZM,C","sourcesContent":["import { isProductionEnv } from '../../lib/currentEnvironment';\nimport { PopupPosition } from '../Popup';\n\nimport { PopupMenuPositions } from './PopupMenuPositions';\n\nconst isValidPosition = (position: PopupPosition): boolean => {\n  return PopupMenuPositions.includes(position);\n};\n\nexport const isValidPositions = (positions: PopupPosition[]): boolean => {\n  return positions.every((item) => {\n    if (isProductionEnv) {\n      return isValidPosition(item);\n    } else {\n      if (isValidPosition(item)) {\n        return true;\n      } else {\n        throw new Error(`Unxpected position \"${item}\"`);\n      }\n    }\n  });\n};\n"]}

package/cjs/internal/RenderContainer/RenderContainer.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { RenderContainerProps } from './RenderContainerTypes';
+export declare class RenderContainer extends React.Component<RenderContainerProps> {
+    static __KONTUR_REACT_UI__: string;
+    private static getRootId;
+    private domContainer;
+    private readonly rootId;
+    constructor(props: RenderContainerProps);
+    UNSAFE_componentWillReceiveProps(nextProps: Readonly<RenderContainerProps>): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private createContainer;
+    private mountContainer;
+    private destroyContainer;
+    private unmountContainer;
+}

package/cjs/internal/RenderContainer/RenderContainer.js

@@ -0,0 +1,80 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.RenderContainer = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+
+var _client = require("../../lib/client");
+
+var _utils = require("../../lib/utils");
+var _Upgrades = require("../../lib/Upgrades");
+
+var _RenderInnerContainer = require("./RenderInnerContainer");var
+
+
+RenderContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(RenderContainer, _React$Component);
+
+
+
+
+
+
+
+  function RenderContainer(props) {var _this;
+    _this = _React$Component.call(this, props) || this;_this.domContainer = null;_this.rootId = RenderContainer.getRootId();
+
+    if (_client.isBrowser && props.children) {
+      _this.mountContainer();
+    }return _this;
+  }var _proto = RenderContainer.prototype;_proto.
+
+  UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {
+    if (!this.props.children && nextProps.children) {
+      this.mountContainer();
+    }
+    if (this.props.children && !nextProps.children) {
+      this.unmountContainer();
+    }
+  };_proto.
+
+  componentWillUnmount = function componentWillUnmount() {
+    this.destroyContainer();
+  };_proto.
+
+  render = function render() {
+    return /*#__PURE__*/_react.default.createElement(_RenderInnerContainer.RenderInnerContainer, (0, _extends2.default)({}, this.props, { domContainer: this.domContainer, rootId: this.rootId }));
+  };_proto.
+
+  createContainer = function createContainer() {
+    if (_client.canUseDOM) {
+      var domContainer = document.createElement('div');
+      domContainer.setAttribute('class', _Upgrades.Upgrade.getSpecificityClassName());
+      domContainer.setAttribute('data-rendered-container-id', "" + this.rootId);
+      this.domContainer = domContainer;
+    }
+  };_proto.
+
+  mountContainer = function mountContainer() {
+    if (!this.domContainer) {
+      this.createContainer();
+    }
+    if (this.domContainer && this.domContainer.parentNode !== document.body) {
+      document.body.appendChild(this.domContainer);
+      if (window.ReactTesting) {
+        window.ReactTesting.addRenderContainer(this.rootId, this);
+      }
+    }
+  };_proto.
+
+  destroyContainer = function destroyContainer() {
+    if (this.domContainer) {
+      this.unmountContainer();
+      this.domContainer = null;
+    }
+  };_proto.
+
+  unmountContainer = function unmountContainer() {
+    if (this.domContainer && this.domContainer.parentNode) {
+      this.domContainer.parentNode.removeChild(this.domContainer);
+
+      if (window.ReactTesting) {
+        window.ReactTesting.removeRenderContainer(this.rootId);
+      }
+    }
+  };return RenderContainer;}(_react.default.Component);exports.RenderContainer = RenderContainer;RenderContainer.__KONTUR_REACT_UI__ = 'RenderContainer';RenderContainer.getRootId = function () {return (0, _utils.getRandomID)();};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["RenderContainer.tsx"],"names":["RenderContainer","props","domContainer","rootId","getRootId","isBrowser","children","mountContainer","UNSAFE_componentWillReceiveProps","nextProps","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","canUseDOM","document","createElement","setAttribute","Upgrade","getSpecificityClassName","parentNode","body","appendChild","window","ReactTesting","addRenderContainer","removeChild","removeRenderContainer","React","Component","__KONTUR_REACT_UI__"],"mappings":"6UAAA;;AAEA;;AAEA;AACA;;AAEA,8D;;;AAGaA,e;;;;;;;;AAQX,2BAAYC,KAAZ,EAAyC;AACvC,wCAAMA,KAAN,UADuC,MAJjCC,YAIiC,GAJK,IAIL,OAFxBC,MAEwB,GAFPH,eAAe,CAACI,SAAhB,EAEO;;AAGvC,QAAIC,qBAAaJ,KAAK,CAACK,QAAvB,EAAiC;AAC/B,YAAKC,cAAL;AACD,KALsC;AAMxC,G;;AAEMC,EAAAA,gC,GAAP,0CAAwCC,SAAxC,EAAyF;AACvF,QAAI,CAAC,KAAKR,KAAL,CAAWK,QAAZ,IAAwBG,SAAS,CAACH,QAAtC,EAAgD;AAC9C,WAAKC,cAAL;AACD;AACD,QAAI,KAAKN,KAAL,CAAWK,QAAX,IAAuB,CAACG,SAAS,CAACH,QAAtC,EAAgD;AAC9C,WAAKI,gBAAL;AACD;AACF,G;;AAEMC,EAAAA,oB,GAAP,gCAA8B;AAC5B,SAAKC,gBAAL;AACD,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd,wBAAO,6BAAC,0CAAD,6BAA0B,KAAKZ,KAA/B,IAAsC,YAAY,EAAE,KAAKC,YAAzD,EAAuE,MAAM,EAAE,KAAKC,MAApF,IAAP;AACD,G;;AAEOW,EAAAA,e,GAAR,2BAA0B;AACxB,QAAIC,iBAAJ,EAAe;AACb,UAAMb,YAAY,GAAGc,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAArB;AACAf,MAAAA,YAAY,CAACgB,YAAb,CAA0B,OAA1B,EAAmCC,kBAAQC,uBAAR,EAAnC;AACAlB,MAAAA,YAAY,CAACgB,YAAb,CAA0B,4BAA1B,OAA2D,KAAKf,MAAhE;AACA,WAAKD,YAAL,GAAoBA,YAApB;AACD;AACF,G;;AAEOK,EAAAA,c,GAAR,0BAAyB;AACvB,QAAI,CAAC,KAAKL,YAAV,EAAwB;AACtB,WAAKY,eAAL;AACD;AACD,QAAI,KAAKZ,YAAL,IAAqB,KAAKA,YAAL,CAAkBmB,UAAlB,KAAiCL,QAAQ,CAACM,IAAnE,EAAyE;AACvEN,MAAAA,QAAQ,CAACM,IAAT,CAAcC,WAAd,CAA0B,KAAKrB,YAA/B;AACA,UAAIsB,MAAM,CAACC,YAAX,EAAyB;AACvBD,QAAAA,MAAM,CAACC,YAAP,CAAoBC,kBAApB,CAAuC,KAAKvB,MAA5C,EAAoD,IAApD;AACD;AACF;AACF,G;;AAEOS,EAAAA,gB,GAAR,4BAA2B;AACzB,QAAI,KAAKV,YAAT,EAAuB;AACrB,WAAKQ,gBAAL;AACA,WAAKR,YAAL,GAAoB,IAApB;AACD;AACF,G;;AAEOQ,EAAAA,gB,GAAR,4BAA2B;AACzB,QAAI,KAAKR,YAAL,IAAqB,KAAKA,YAAL,CAAkBmB,UAA3C,EAAuD;AACrD,WAAKnB,YAAL,CAAkBmB,UAAlB,CAA6BM,WAA7B,CAAyC,KAAKzB,YAA9C;;AAEA,UAAIsB,MAAM,CAACC,YAAX,EAAyB;AACvBD,QAAAA,MAAM,CAACC,YAAP,CAAoBG,qBAApB,CAA0C,KAAKzB,MAA/C;AACD;AACF;AACF,G,0BArEkC0B,eAAMC,S,4CAA9B9B,e,CACG+B,mB,GAAsB,iB,CADzB/B,e,CAGII,S,GAAY,oBAAM,yBAAN,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"]}

package/cjs/internal/RenderContainer/RenderContainerTypes.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Nullable } from '../../typings/utility-types';
+import { CommonProps } from '../CommonWrapper';
+export interface PortalProps {
+    rt_rootID: string;
+    container: Nullable<HTMLElement>;
+}
+export interface RenderContainerProps extends CommonProps {
+    anchor?: React.ReactNode;
+    children?: React.ReactNode;
+}

package/cjs/internal/RenderContainer/RenderContainerTypes.js

@@ -0,0 +1 @@
+"use strict";

package/cjs/internal/RenderContainer/RenderContainerTypes.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/cjs/internal/RenderContainer/RenderInnerContainer.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { Nullable } from '../../typings/utility-types';
+import { PortalProps, RenderContainerProps } from './RenderContainerTypes';
+interface RenderInnerContainerProps extends RenderContainerProps {
+    domContainer: Nullable<HTMLElement>;
+    rootId: string;
+}
+export declare const Portal: React.FunctionComponent<PortalProps>;
+export declare class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {
+    static __KONTUR_REACT_UI__: string;
+    render(): React.ReactNode;
+}
+export {};

package/cjs/internal/RenderContainer/RenderInnerContainer.js

@@ -0,0 +1,63 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.RenderInnerContainer = exports.Portal = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+var _reactDom = _interopRequireDefault(require("react-dom"));
+
+
+var _CommonWrapper = require("../CommonWrapper");
+
+
+
+
+
+
+
+
+// Заглушка нужна для корректной гидрации порталов после SSR,
+// которую реакт сам пока не поддерживает.
+// @see https://github.com/facebook/react/issues/13097
+// А также для вставки актуального render-container-id на клиенте.
+//
+// Дело в том, что во время гидрации, структура HTML на сервере
+// и на клиенте должна совпадать, иначе возможны артефакты.
+// Алгоритм там примерно такой. Клиент во время гидрации идет
+// по этим двум деревьям и сравнивает узлы. Элементы разных типов
+// он подменяет на свои. А те, что совпадают, он оставляет как есть
+// вместе со всеми атрибутами, навесив только обработчики событий.
+//
+// Поэтому, для портала, который рендерится только на клиенте,
+// нужно использовать серверную заглушку, чтобы при гидрации
+// он не испортил какой-то другой элемент. Null не подходит,
+// т.к. на сервере он тоже не рендерится.
+// А элемент с render-container-id нужно отрендерить с нуля.
+
+var SSRPlaceholder = function SSRPlaceholder() {return /*#__PURE__*/_react.default.createElement("script", { "data-id": "ssr-placeholder" });};
+
+var Portal = function Portal(_ref) {var container = _ref.container,rt_rootID = _ref.rt_rootID,children = _ref.children;
+  // container exists only in browser
+  return /*#__PURE__*/(
+    _react.default.createElement(_react.default.Fragment, null,
+    container ? /*#__PURE__*/_reactDom.default.createPortal(children, container) : /*#__PURE__*/_react.default.createElement(SSRPlaceholder, null),
+    container ? /*#__PURE__*/_react.default.createElement("noscript", { "data-render-container-id": rt_rootID }) : /*#__PURE__*/_react.default.createElement(SSRPlaceholder, null)));
+
+
+};exports.Portal = Portal;var
+
+RenderInnerContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(RenderInnerContainer, _React$Component);function RenderInnerContainer() {return _React$Component.apply(this, arguments) || this;}var _proto = RenderInnerContainer.prototype;_proto.
+
+
+  render = function render() {var _this$props =
+    this.props,anchor = _this$props.anchor,children = _this$props.children,domContainer = _this$props.domContainer,rootId = _this$props.rootId;
+    var inner = anchor;
+
+    if (children) {
+      inner = /*#__PURE__*/
+      _react.default.createElement(_react.default.Fragment, null,
+      anchor, /*#__PURE__*/
+      _react.default.createElement(Portal, { key: "portal-ref", rt_rootID: rootId, container: domContainer }, /*#__PURE__*/
+      _react.default.createElement(_CommonWrapper.CommonWrapper, this.props, children)));
+
+
+
+    }
+
+    return inner;
+  };return RenderInnerContainer;}(_react.default.Component);exports.RenderInnerContainer = RenderInnerContainer;RenderInnerContainer.__KONTUR_REACT_UI__ = 'RenderInnerContainer';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["RenderInnerContainer.tsx"],"names":["SSRPlaceholder","Portal","container","rt_rootID","children","ReactDOM","createPortal","RenderInnerContainer","render","props","anchor","domContainer","rootId","inner","React","Component","__KONTUR_REACT_UI__"],"mappings":"iRAAA;AACA;;;AAGA;;;;;;;;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,wBAAM,yCAAQ,WAAQ,iBAAhB,GAAN,EAAvB;;AAEO,IAAMC,MAA4C,GAAG,SAA/CA,MAA+C,OAAwC,KAArCC,SAAqC,QAArCA,SAAqC,CAA1BC,SAA0B,QAA1BA,SAA0B,CAAfC,QAAe,QAAfA,QAAe;AAClG;AACA;AACE,iCAAC,cAAD,CAAO,QAAP;AACGF,IAAAA,SAAS,gBAAGG,kBAASC,YAAT,CAAsBF,QAAtB,EAAgCF,SAAhC,CAAH,gBAAgD,6BAAC,cAAD,OAD5D;AAEGA,IAAAA,SAAS,gBAAG,2CAAU,4BAA0BC,SAApC,GAAH,gBAAuD,6BAAC,cAAD,OAFnE,CADF;;;AAMD,CARM,C;;AAUMI,oB;;;AAGJC,EAAAA,M,GAAP,kBAAgB;AACqC,SAAKC,KAD1C,CACNC,MADM,eACNA,MADM,CACEN,QADF,eACEA,QADF,CACYO,YADZ,eACYA,YADZ,CAC0BC,MAD1B,eAC0BA,MAD1B;AAEd,QAAIC,KAAK,GAAGH,MAAZ;;AAEA,QAAIN,QAAJ,EAAc;AACZS,MAAAA,KAAK;AACH,mCAAC,cAAD,CAAO,QAAP;AACGH,MAAAA,MADH;AAEE,mCAAC,MAAD,IAAQ,GAAG,EAAC,YAAZ,EAAyB,SAAS,EAAEE,MAApC,EAA4C,SAAS,EAAED,YAAvD;AACE,mCAAC,4BAAD,EAAmB,KAAKF,KAAxB,EAAgCL,QAAhC,CADF,CAFF,CADF;;;;AAQD;;AAED,WAAOS,KAAP;AACD,G,+BAnBuCC,eAAMC,S,sDAAnCR,oB,CACGS,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"]}

package/cjs/internal/RenderContainer/index.d.ts

@@ -0,0 +1 @@
+export * from './RenderContainer';

package/cjs/internal/RenderContainer/index.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;var _RenderContainer = require("./RenderContainer");Object.keys(_RenderContainer).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _RenderContainer[key]) return;exports[key] = _RenderContainer[key];});

package/cjs/internal/RenderContainer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.tsx"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './RenderContainer';\n"]}