@skbkontur/react-ui 0.0.0-1e20264c71 → 0.0.0-1fb0cccdc2

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

@@ -0,0 +1 @@
+{"version":3,"sources":["RenderContainer.tsx"],"names":["React","globalObject","getRandomID","Upgrade","callChildRef","RenderInnerContainer","PORTAL_INLET_ATTR","PORTAL_OUTLET_ATTR","RenderContainer","domContainer","rootId","getRootId","shouldComponentUpdate","nextProps","props","children","mountContainer","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","document","createElement","setAttribute","getSpecificityClassName","parentNode","body","appendChild","containerRef","ReactTesting","addRenderContainer","removeChild","removeRenderContainer","Component","__KONTUR_REACT_UI__","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { getRandomID } from '../../lib/utils';\nimport { Upgrade } from '../../lib/Upgrades';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\n\nimport { RenderInnerContainer } from './RenderInnerContainer';\nimport { RenderContainerProps } from './RenderContainerTypes';\n\nexport const PORTAL_INLET_ATTR = 'data-render-container-id';\nexport const PORTAL_OUTLET_ATTR = 'data-rendered-container-id';\n\nexport class RenderContainer extends React.Component<RenderContainerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderContainer';\n  public static displayName = 'RenderContainer';\n\n  private static getRootId = () => getRandomID();\n  private domContainer: Nullable<HTMLElement> = null;\n\n  private readonly rootId: string = RenderContainer.getRootId();\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    if (this.props.children) {\n      this.mountContainer();\n    }\n\n    return <RenderInnerContainer {...this.props} domContainer={this.domContainer} rootId={this.rootId} />;\n  }\n\n  private createContainer() {\n    const domContainer = globalObject.document?.createElement('div');\n    if (domContainer) {\n      domContainer.setAttribute('class', Upgrade.getSpecificityClassName());\n      domContainer.setAttribute(PORTAL_OUTLET_ATTR, `${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 !== globalObject.document?.body) {\n      globalObject.document?.body.appendChild(this.domContainer);\n\n      if (this.props.containerRef) {\n        callChildRef(this.props.containerRef, this.domContainer);\n      }\n      if (globalObject.ReactTesting) {\n        globalObject.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 (this.props.containerRef) {\n        callChildRef(this.props.containerRef, null);\n      }\n\n      if (globalObject.ReactTesting) {\n        globalObject.ReactTesting.removeRenderContainer(this.rootId);\n      }\n    }\n  }\n}\n"]}

package/internal/RenderContainer/RenderContainer/package.json

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

package/internal/RenderContainer/RenderContainer.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { RenderContainerProps } from './RenderContainerTypes';
+export declare const PORTAL_INLET_ATTR = "data-render-container-id";
+export declare const PORTAL_OUTLET_ATTR = "data-rendered-container-id";
+export declare class RenderContainer extends React.Component<RenderContainerProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    private static getRootId;
+    private domContainer;
+    private readonly rootId;
+    shouldComponentUpdate(nextProps: RenderContainerProps): boolean;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private createContainer;
+    private mountContainer;
+    private destroyContainer;
+    private unmountContainer;
+}

package/internal/RenderContainer/RenderContainerTypes/RenderContainerTypes.js

@@ -0,0 +1 @@
+export {};

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

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

package/internal/RenderContainer/RenderContainerTypes/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/internal/RenderContainer/RenderContainerTypes.js",
+  "module": "RenderContainerTypes",
+  "types": "../RenderContainerTypes.d.ts",
+  "sideEffects": false
+}

package/internal/RenderContainer/RenderContainerTypes.d.ts

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

package/internal/RenderContainer/RenderInnerContainer/RenderInnerContainer.js

@@ -0,0 +1,78 @@
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import React from 'react';
+import ReactDOM from 'react-dom';
+import propTypes from 'prop-types';
+import { globalObject } from '@skbkontur/global-object';
+import { safePropTypesInstanceOf } from "../../../lib/SSRSafe";
+import { PORTAL_INLET_ATTR } from "../RenderContainer"; // Заглушка нужна для корректной гидрации порталов после SSR,
+// которую реакт сам пока не поддерживает.
+// @see https://github.com/facebook/react/issues/13097
+// А также для вставки актуального render-container-id на клиенте.
+//
+// Дело в том, что во время гидрации, структура HTML на сервере
+// и на клиенте должна совпадать, иначе возможны артефакты.
+// Алгоритм там примерно такой. Клиент во время гидрации идет
+// по этим двум деревьям и сравнивает узлы. Элементы разных типов
+// он подменяет на свои. А те, что совпадают, он оставляет как есть
+// вместе со всеми атрибутами, навесив только обработчики событий.
+//
+// Поэтому, для портала, который рендерится только на клиенте,
+// нужно использовать серверную заглушку, чтобы при гидрации
+// он не испортил какой-то другой элемент. Null не подходит,
+// т.к. на сервере он тоже не рендерится.
+// А элемент с render-container-id нужно отрендерить с нуля.
+
+var SSRPlaceholder = function SSRPlaceholder() {
+  return /*#__PURE__*/React.createElement("script", {
+    "data-id": "ssr-placeholder"
+  });
+};
+
+export var Portal = function Portal(_ref) {
+  var _ref2;
+
+  var container = _ref.container,
+      rt_rootID = _ref.rt_rootID,
+      children = _ref.children; // container exists only in browser
+
+  return /*#__PURE__*/React.createElement(React.Fragment, null, container ? /*#__PURE__*/ReactDOM.createPortal(children, container) : /*#__PURE__*/React.createElement(SSRPlaceholder, null), container ? /*#__PURE__*/React.createElement("noscript", (_ref2 = {}, _ref2[PORTAL_INLET_ATTR] = rt_rootID, _ref2)) : /*#__PURE__*/React.createElement(SSRPlaceholder, null));
+};
+export var RenderInnerContainer = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(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.createElement(React.Fragment, null, anchor, /*#__PURE__*/React.createElement(Portal, {
+        key: "portal-ref",
+        rt_rootID: rootId,
+        container: domContainer
+      }, children));
+    }
+
+    return inner;
+  };
+
+  return RenderInnerContainer;
+}(React.Component);
+RenderInnerContainer.__KONTUR_REACT_UI__ = 'RenderInnerContainer';
+RenderInnerContainer.displayName = 'RenderInnerContainer';
+Portal.propTypes = {
+  container: safePropTypesInstanceOf(globalObject.HTMLElement),
+  rt_rootID: propTypes.string.isRequired,
+  children: propTypes.node.isRequired
+};
+Portal.__KONTUR_REACT_UI__ = 'Portal';
+Portal.displayName = 'Portal';

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

@@ -0,0 +1 @@
+{"version":3,"sources":["RenderInnerContainer.tsx"],"names":["React","ReactDOM","propTypes","globalObject","safePropTypesInstanceOf","PORTAL_INLET_ATTR","SSRPlaceholder","Portal","container","rt_rootID","children","createPortal","RenderInnerContainer","render","props","anchor","domContainer","rootId","inner","Component","__KONTUR_REACT_UI__","displayName","HTMLElement","string","isRequired","node"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,QAAP,MAAqB,WAArB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,YAAT,QAA6B,0BAA7B;;;AAGA,SAASC,uBAAT,QAAwC,mBAAxC;;;AAGA,SAASC,iBAAT,QAAkC,mBAAlC;;;;;;;AAOA;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,MAAM,GAAG,SAATA,MAAS,OAAqD,eAAlDC,SAAkD,QAAlDA,SAAkD,CAAvCC,SAAuC,QAAvCA,SAAuC,CAA5BC,QAA4B,QAA5BA,QAA4B;AACzE;AACA;AACE,wBAAC,KAAD,CAAO,QAAP;AACGF,IAAAA,SAAS,gBAAGP,QAAQ,CAACU,YAAT,CAAsBD,QAAtB,EAAgCF,SAAhC,CAAH,gBAAgD,oBAAC,cAAD,OAD5D;AAEGA,IAAAA,SAAS,gBAAG,mDAAiBH,iBAAjB,IAAqCI,SAArC,SAAH,gBAA0D,oBAAC,cAAD,OAFtE,CADF;;;AAMD,CARM;;AAUP,WAAaG,oBAAb;;;;AAISC,EAAAA,MAJT,GAIE,kBAAgB;AACd,sBAAmD,KAAKC,KAAxD,CAAQC,MAAR,eAAQA,MAAR,CAAgBL,QAAhB,eAAgBA,QAAhB,CAA0BM,YAA1B,eAA0BA,YAA1B,CAAwCC,MAAxC,eAAwCA,MAAxC;AACA,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,GApBH,+BAA0ClB,KAAK,CAACmB,SAAhD,EAAaP,oB,CACGQ,mB,GAAsB,sB,CADzBR,oB,CAEGS,W,GAAc,sB;;;AAqB9Bd,MAAM,CAACL,SAAP,GAAmB;AACjBM,EAAAA,SAAS,EAAEJ,uBAAuB,CAACD,YAAY,CAACmB,WAAd,CADjB;AAEjBb,EAAAA,SAAS,EAAEP,SAAS,CAACqB,MAAV,CAAiBC,UAFX;AAGjBd,EAAAA,QAAQ,EAAER,SAAS,CAACuB,IAAV,CAAeD,UAHR,EAAnB;;;AAMAjB,MAAM,CAACa,mBAAP,GAA6B,QAA7B;AACAb,MAAM,CAACc,WAAP,GAAqB,QAArB","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport propTypes from 'prop-types';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { safePropTypesInstanceOf } from '../../lib/SSRSafe';\n\nimport { PortalProps, RenderContainerProps } from './RenderContainerTypes';\nimport { PORTAL_INLET_ATTR } from './RenderContainer';\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 = ({ container, rt_rootID, children }: PortalProps) => {\n  // container exists only in browser\n  return (\n    <React.Fragment>\n      {container ? ReactDOM.createPortal(children, container) : <SSRPlaceholder />}\n      {container ? <noscript {...{ [PORTAL_INLET_ATTR]: rt_rootID }} /> : <SSRPlaceholder />}\n    </React.Fragment>\n  );\n};\n\nexport class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderInnerContainer';\n  public static displayName = '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\nPortal.propTypes = {\n  container: safePropTypesInstanceOf(globalObject.HTMLElement),\n  rt_rootID: propTypes.string.isRequired,\n  children: propTypes.node.isRequired,\n};\n\nPortal.__KONTUR_REACT_UI__ = 'Portal';\nPortal.displayName = 'Portal';\n"]}

package/internal/RenderContainer/RenderInnerContainer/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/internal/RenderContainer/RenderInnerContainer.js",
+  "module": "RenderInnerContainer",
+  "types": "../RenderInnerContainer.d.ts",
+  "sideEffects": false
+}

package/internal/RenderContainer/RenderInnerContainer.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import propTypes from 'prop-types';
+import { Nullable } from '../../typings/utility-types';
+import { PortalProps, RenderContainerProps } from './RenderContainerTypes';
+interface RenderInnerContainerProps extends RenderContainerProps {
+    domContainer: Nullable<HTMLElement>;
+    rootId: string;
+}
+export declare const Portal: {
+    ({ container, rt_rootID, children }: PortalProps): JSX.Element;
+    propTypes: {
+        container: propTypes.Requireable<HTMLElement>;
+        rt_rootID: propTypes.Validator<string>;
+        children: propTypes.Validator<string | number | boolean | {} | propTypes.ReactElementLike | propTypes.ReactNodeArray>;
+    };
+    __KONTUR_REACT_UI__: string;
+    displayName: string;
+};
+export declare class RenderInnerContainer extends React.Component<RenderInnerContainerProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    render(): React.ReactNode;
+}
+export {};

package/internal/RenderContainer/index/index.js

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

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

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

package/internal/RenderContainer/index/package.json

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

package/internal/RenderContainer/index.d.ts

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

package/internal/RenderContainer/package.json

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

package/internal/RenderLayer/RenderLayer/RenderLayer.js

@@ -0,0 +1,128 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
+import React from 'react';
+import { globalObject } from '@skbkontur/global-object';
+import { listen as listenFocusOutside, containsTargetOrRenderContainer } from "../../../lib/listenFocusOutside";
+import { CommonWrapper } from "../../CommonWrapper";
+import { getRootNode, rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { isInstanceOf } from "../../../lib/isInstanceOf";
+export var RenderLayer = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(RenderLayer, _React$Component);
+
+  function RenderLayer() {
+    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.getProps = createPropsGetter(RenderLayer.defaultProps);
+    _this.focusOutsideListenerToken = null;
+
+    _this.handleFocusOutside = function (event) {
+      if (_this.props.onFocusOutside) {
+        _this.props.onFocusOutside(event);
+      }
+    };
+
+    _this.handleNativeDocClick = function (event) {
+      var target = event.target || event.srcElement;
+
+      var node = _this.getAnchorNode();
+
+      if (!node || isInstanceOf(target, globalObject.Element) && containsTargetOrRenderContainer(target)(node)) {
+        return;
+      }
+
+      if (_this.props.onClickOutside) {
+        _this.props.onClickOutside(event);
+      }
+    };
+
+    return _this;
+  }
+
+  var _proto = RenderLayer.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    if (this.getProps().active) {
+      this.attachListeners();
+    }
+  };
+
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var active = this.getProps().active;
+
+    if (!prevProps.active && active) {
+      this.attachListeners();
+    }
+
+    if (prevProps.active && !active) {
+      this.detachListeners();
+    }
+  };
+
+  _proto.componentWillUnmount = function componentWillUnmount() {
+    if (this.getProps().active) {
+      this.detachListeners();
+    }
+  };
+
+  _proto.render = function render() {
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), React.Children.only(this.props.children));
+  };
+
+  _proto.getAnchorNode = function getAnchorNode() {
+    var getAnchorElement = this.props.getAnchorElement;
+    return getAnchorElement ? getAnchorElement() : getRootNode(this);
+  };
+
+  _proto.attachListeners = function attachListeners() {
+    var _globalObject$documen;
+
+    var node = this.getAnchorNode();
+
+    if (!node) {
+      return;
+    }
+
+    this.focusOutsideListenerToken = listenFocusOutside(function () {
+      return [node];
+    }, this.handleFocusOutside);
+    globalObject.addEventListener == null ? void 0 : globalObject.addEventListener('blur', this.handleFocusOutside);
+    (_globalObject$documen = globalObject.document) == null ? void 0 : _globalObject$documen.addEventListener('ontouchstart' in globalObject.document.documentElement && 'onpointerup' in globalObject.document.documentElement ? 'pointerup' : 'mousedown', this.handleNativeDocClick);
+  };
+
+  _proto.detachListeners = function detachListeners() {
+    var _globalObject$documen2;
+
+    if (this.focusOutsideListenerToken) {
+      this.focusOutsideListenerToken.remove();
+      this.focusOutsideListenerToken = null;
+    }
+
+    globalObject.removeEventListener == null ? void 0 : globalObject.removeEventListener('blur', this.handleFocusOutside);
+    (_globalObject$documen2 = globalObject.document) == null ? void 0 : _globalObject$documen2.removeEventListener('ontouchstart' in globalObject.document.documentElement && 'onpointerup' in globalObject.document.documentElement ? 'pointerup' : 'mousedown', this.handleNativeDocClick);
+  };
+
+  return RenderLayer;
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'RenderLayer', _class2.displayName = 'RenderLayer', _class2.propTypes = {
+  active: function active(props, propName, componentName) {
+    var active = props.active,
+        onClickOutside = props.onClickOutside,
+        onFocusOutside = props.onFocusOutside;
+
+    if (active && !(onClickOutside || onFocusOutside)) {
+      return new Error("[" + componentName + "]: using the component without either 'onClickOutside' or 'onFocusOutside' callback is pointless.");
+    }
+  }
+}, _class2.defaultProps = {
+  active: true
+}, _temp)) || _class;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["RenderLayer.tsx"],"names":["React","globalObject","listen","listenFocusOutside","containsTargetOrRenderContainer","CommonWrapper","getRootNode","rootNode","createPropsGetter","isInstanceOf","RenderLayer","getProps","defaultProps","focusOutsideListenerToken","handleFocusOutside","event","props","onFocusOutside","handleNativeDocClick","target","srcElement","node","getAnchorNode","Element","onClickOutside","componentDidMount","active","attachListeners","componentDidUpdate","prevProps","detachListeners","componentWillUnmount","render","setRootNode","Children","only","children","getAnchorElement","addEventListener","document","documentElement","remove","removeEventListener","Component","__KONTUR_REACT_UI__","displayName","propTypes","propName","componentName","Error"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\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';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isInstanceOf } from '../../lib/isInstanceOf';\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<Element>;\n}\n\ntype DefaultProps = Required<Pick<RenderLayerProps, 'active'>>;\n\n@rootNode\nexport class RenderLayer extends React.Component<RenderLayerProps> {\n  public static __KONTUR_REACT_UI__ = 'RenderLayer';\n  public static displayName = '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: DefaultProps = {\n    active: true,\n  };\n\n  private getProps = createPropsGetter(RenderLayer.defaultProps);\n\n  private focusOutsideListenerToken: {\n    remove: () => void;\n  } | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    if (this.getProps().active) {\n      this.attachListeners();\n    }\n  }\n\n  public componentDidUpdate(prevProps: RenderLayerProps) {\n    const active = this.getProps().active;\n    if (!prevProps.active && active) {\n      this.attachListeners();\n    }\n    if (prevProps.active && !active) {\n      this.detachListeners();\n    }\n  }\n\n  public componentWillUnmount() {\n    if (this.getProps().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 getAnchorNode(): Nullable<Element> {\n    const { getAnchorElement } = this.props;\n    return getAnchorElement ? getAnchorElement() : getRootNode(this);\n  }\n\n  private attachListeners() {\n    const node = this.getAnchorNode();\n    if (!node) {\n      return;\n    }\n\n    this.focusOutsideListenerToken = listenFocusOutside(() => [node], this.handleFocusOutside);\n    globalObject.addEventListener?.('blur', this.handleFocusOutside);\n    globalObject.document?.addEventListener(\n      'ontouchstart' in globalObject.document.documentElement && 'onpointerup' in globalObject.document.documentElement\n        ? 'pointerup'\n        : '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    globalObject.removeEventListener?.('blur', this.handleFocusOutside);\n    globalObject.document?.removeEventListener(\n      'ontouchstart' in globalObject.document.documentElement && 'onpointerup' in globalObject.document.documentElement\n        ? 'pointerup'\n        : '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 = this.getAnchorNode();\n\n    if (!node || (isInstanceOf(target, globalObject.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/package.json

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

package/internal/RenderLayer/RenderLayer.d.ts

@@ -0,0 +1,32 @@
+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<Element>;
+}
+declare type DefaultProps = Required<Pick<RenderLayerProps, 'active'>>;
+export declare class RenderLayer extends React.Component<RenderLayerProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    static propTypes: {
+        active(props: RenderLayerProps, propName: keyof RenderLayerProps, componentName: string): Error | undefined;
+    };
+    static defaultProps: DefaultProps;
+    private getProps;
+    private focusOutsideListenerToken;
+    private setRootNode;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: RenderLayerProps): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private getAnchorNode;
+    private attachListeners;
+    private detachListeners;
+    private handleFocusOutside;
+    private handleNativeDocClick;
+}
+export {};

package/internal/RenderLayer/index/index.js

@@ -0,0 +1 @@
+export * from "../RenderLayer";

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAd","sourcesContent":["export * from './RenderLayer';\n"]}

package/internal/RenderLayer/index/package.json

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

package/internal/RenderLayer/index.d.ts

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

package/internal/RenderLayer/package.json

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

package/internal/ResizeDetector/ResizeDetector/ResizeDetector.js

@@ -0,0 +1,59 @@
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+import React from 'react';
+import { cx } from "../../../lib/theming/Emotion";
+import { styles } from "../ResizeDetector.styles";
+export var ResizeDetector = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(ResizeDetector, _React$Component);
+
+  function ResizeDetector() {
+    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.iframeWindow = null;
+
+    _this.handleResize = function (event) {
+      if (_this.props.onResize) {
+        _this.props.onResize(event);
+      }
+    };
+
+    _this.iframeRef = function (iframe) {
+      if (iframe && iframe.contentWindow) {
+        _this.iframeWindow = iframe.contentWindow;
+      }
+    };
+
+    return _this;
+  }
+
+  var _proto = ResizeDetector.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    if (this.iframeWindow) {
+      this.iframeWindow.addEventListener('resize', this.handleResize);
+    }
+  };
+
+  _proto.render = function render() {
+    var _cx;
+
+    return /*#__PURE__*/React.createElement("div", {
+      className: styles.root()
+    }, /*#__PURE__*/React.createElement("iframe", {
+      title: "resizeDetector",
+      ref: this.iframeRef,
+      className: styles.iframe(),
+      tabIndex: -1
+    }), /*#__PURE__*/React.createElement("div", {
+      className: cx((_cx = {}, _cx[styles.content()] = true, _cx[styles.fullHeight()] = this.props.fullHeight, _cx))
+    }, this.props.children));
+  };
+
+  return ResizeDetector;
+}(React.Component);
+ResizeDetector.__KONTUR_REACT_UI__ = 'ResizeDetector';
+ResizeDetector.displayName = 'ResizeDetector';

package/internal/ResizeDetector/ResizeDetector/ResizeDetector.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ResizeDetector.tsx"],"names":["React","cx","styles","ResizeDetector","iframeWindow","handleResize","event","props","onResize","iframeRef","iframe","contentWindow","componentDidMount","addEventListener","render","root","content","fullHeight","children","Component","__KONTUR_REACT_UI__","displayName"],"mappings":"sEAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,EAAT,QAAmB,2BAAnB;;AAEA,SAASC,MAAT,QAAuB,yBAAvB;;;;;;;AAOA,WAAaC,cAAb;;;;AAIUC,IAAAA,YAJV,GAIwC,IAJxC;;;;;;;;;;;;;;;;;;;AAuBUC,IAAAA,YAvBV,GAuByB,UAACC,KAAD,EAAoB;AACzC,UAAI,MAAKC,KAAL,CAAWC,QAAf,EAAyB;AACvB,cAAKD,KAAL,CAAWC,QAAX,CAAoBF,KAApB;AACD;AACF,KA3BH;;AA6BUG,IAAAA,SA7BV,GA6BsB,UAACC,MAAD,EAA+B;AACjD,UAAIA,MAAM,IAAIA,MAAM,CAACC,aAArB,EAAoC;AAClC,cAAKP,YAAL,GAAoBM,MAAM,CAACC,aAA3B;AACD;AACF,KAjCH,4DAMSC,iBANT,GAME,6BAA2B,CACzB,IAAI,KAAKR,YAAT,EAAuB,CACrB,KAAKA,YAAL,CAAkBS,gBAAlB,CAAmC,QAAnC,EAA6C,KAAKR,YAAlD,EACD,CACF,CAVH,QAYSS,MAZT,GAYE,kBAAgB,SACd,oBACE,6BAAK,SAAS,EAAEZ,MAAM,CAACa,IAAP,EAAhB,iBACE,gCAAQ,KAAK,EAAC,gBAAd,EAA+B,GAAG,EAAE,KAAKN,SAAzC,EAAoD,SAAS,EAAEP,MAAM,CAACQ,MAAP,EAA/D,EAAgF,QAAQ,EAAE,CAAC,CAA3F,GADF,eAEE,6BAAK,SAAS,EAAET,EAAE,gBAAIC,MAAM,CAACc,OAAP,EAAJ,IAAuB,IAAvB,MAA8Bd,MAAM,CAACe,UAAP,EAA9B,IAAoD,KAAKV,KAAL,CAAWU,UAA/D,OAAlB,IACG,KAAKV,KAAL,CAAWW,QADd,CAFF,CADF,CAQD,CArBH,yBAAoClB,KAAK,CAACmB,SAA1C,EAAahB,c,CACGiB,mB,GAAsB,gB,CADzBjB,c,CAEGkB,W,GAAc,gB","sourcesContent":["import React from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './ResizeDetector.styles';\n\nexport interface ResizeDetectorProps {\n  onResize?: (event: UIEvent) => void;\n  fullHeight?: boolean;\n}\n\nexport class ResizeDetector extends React.Component<ResizeDetectorProps> {\n  public static __KONTUR_REACT_UI__ = 'ResizeDetector';\n  public static displayName = 'ResizeDetector';\n\n  private iframeWindow: Window | null = null;\n\n  public componentDidMount() {\n    if (this.iframeWindow) {\n      this.iframeWindow.addEventListener('resize', this.handleResize);\n    }\n  }\n\n  public render() {\n    return (\n      <div className={styles.root()}>\n        <iframe title=\"resizeDetector\" ref={this.iframeRef} className={styles.iframe()} tabIndex={-1} />\n        <div className={cx({ [styles.content()]: true, [styles.fullHeight()]: this.props.fullHeight })}>\n          {this.props.children}\n        </div>\n      </div>\n    );\n  }\n\n  private handleResize = (event: UIEvent) => {\n    if (this.props.onResize) {\n      this.props.onResize(event);\n    }\n  };\n\n  private iframeRef = (iframe: HTMLIFrameElement) => {\n    if (iframe && iframe.contentWindow) {\n      this.iframeWindow = iframe.contentWindow;\n    }\n  };\n}\n"]}

package/internal/ResizeDetector/ResizeDetector/package.json

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

package/internal/ResizeDetector/ResizeDetector.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface ResizeDetectorProps {
+    onResize?: (event: UIEvent) => void;
+    fullHeight?: boolean;
+}
+export declare class ResizeDetector extends React.Component<ResizeDetectorProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    private iframeWindow;
+    componentDidMount(): void;
+    render(): JSX.Element;
+    private handleResize;
+    private iframeRef;
+}

package/internal/ResizeDetector/ResizeDetector.styles/ResizeDetector.styles.js

@@ -0,0 +1,19 @@
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+
+import { css, memoizeStyle } from "../../../lib/theming/Emotion";
+export var styles = memoizeStyle({
+  root: function root() {
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      position: relative;\n      height: 100%;\n    "])));
+  },
+  iframe: function iframe() {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      padding: 0;\n      margin: 0;\n      border: 0;\n      background: transparent;\n      opacity: 0;\n    "])));
+  },
+  content: function content() {
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      position: relative;\n    "])));
+  },
+  fullHeight: function fullHeight() {
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      height: 100%;\n    "])));
+  }
+});

package/internal/ResizeDetector/ResizeDetector.styles/ResizeDetector.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ResizeDetector.styles.ts"],"names":["css","memoizeStyle","styles","root","iframe","content","fullHeight"],"mappings":"0KAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,IADiC,kBAC1B;AACL,WAAOH,GAAP;;;;AAID,GANgC;;AAQjCI,EAAAA,MARiC,oBAQxB;AACP,WAAOJ,GAAP;;;;;;;;;;;;AAYD,GArBgC;;AAuBjCK,EAAAA,OAvBiC,qBAuBvB;AACR,WAAOL,GAAP;;;AAGD,GA3BgC;;AA6BjCM,EAAAA,UA7BiC,wBA6BpB;AACX,WAAON,GAAP;;;AAGD,GAjCgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n  root() {\n    return css`\n      position: relative;\n      height: 100%;\n    `;\n  },\n\n  iframe() {\n    return css`\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      padding: 0;\n      margin: 0;\n      border: 0;\n      background: transparent;\n      opacity: 0;\n    `;\n  },\n\n  content() {\n    return css`\n      position: relative;\n    `;\n  },\n\n  fullHeight() {\n    return css`\n      height: 100%;\n    `;\n  },\n});\n"]}

package/internal/ResizeDetector/ResizeDetector.styles/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/internal/ResizeDetector/ResizeDetector.styles.js",
+  "module": "ResizeDetector.styles",
+  "types": "../ResizeDetector.styles.d.ts",
+  "sideEffects": false
+}

package/internal/ResizeDetector/ResizeDetector.styles.d.ts

@@ -0,0 +1,6 @@
+export declare const styles: {
+    root(): string;
+    iframe(): string;
+    content(): string;
+    fullHeight(): string;
+};

package/internal/ResizeDetector/index/index.js

@@ -0,0 +1 @@
+export * from "../ResizeDetector";

package/internal/ResizeDetector/index/index.js.map

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

package/internal/ResizeDetector/index/package.json

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

package/internal/ResizeDetector/index.d.ts

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

package/internal/ResizeDetector/package.json

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