npm - @skbkontur/react-ui - Versions diffs - 0.0.0-8ea1692541 → 0.0.0-9216939ede - Mend

@skbkontur/react-ui 0.0.0-8ea1692541 → 0.0.0-9216939ede

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

Files changed (2661) hide show

package/cjs/internal/Popup/PopupPin.js CHANGED Viewed

@@ -283,7 +283,7 @@ PopupPin = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default
    */offset: _propTypes.default.number, /**
    * Ссылка на попап
    */popupElement: _propTypes.default.any, /**
-   * Позиция поапа, по которой будет вычеслено положение пина
+   * Позиция попапа, по которой будет вычислено положение пина
    */popupPosition: _propTypes.default.string, /**
    * Сторона пина без учёта границы.
    * Пин представляет собой равносторонний треугольник, высота от попапа

package/cjs/internal/Popup/PopupPin.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["PopupPin.tsx"],"names":["borderStyles","position","borderStyle","borderTopColor","borderBottomColor","borderLeftColor","borderRightColor","PopupPin","render","props","popupElement","options","getPinOptions","PopupHelper","getElementAbsoluteRect","getPositionObject","popupPosition","size","offset","borderWidth","styleOuter","getOuterStyle","activeBorder","outerSize","borderColor","styleInner","getInnerStyle","backgroundColor","styleWrapper","getWrapperStyle","outerLeft","outerTop","PopupDataTids","popupPin","styles","wrapper","getPopupOppositeDirection","popupDirection","direction","TypeError","left","top","width","height","borderWitdth","popupRect","pinSize","pinOffset","bordersDelta","getPinLeftCoordinate","align","innerTop","innerLeft","getPinTopCoordinate","Error","pinHeight","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","string","number","any"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Nullable } from '../../typings/utility-types';\n\nimport { PopupHelper, PositionObject, Rect } from './PopupHelper';\nimport { styles } from './PopupPin.styles';\nimport { PopupDataTids } from './Popup';\n\nconst borderStyles = {\n position: 'absolute',\n borderStyle: 'solid',\n borderTopColor: 'transparent',\n borderBottomColor: 'transparent',\n borderLeftColor: 'transparent',\n borderRightColor: 'transparent',\n};\n\ninterface Props {\n backgroundColor: string;\n borderColor: string;\n borderWidth: number;\n offset: number;\n popupElement: Nullable<Element>;\n popupPosition: string;\n size: number;\n}\n\nexport class PopupPin extends React.Component<Props> {\n public static __KONTUR_REACT_UI__ = 'PopupPin';\n\n public static propTypes = {\n /*\n Цвет фон пина\n /\n backgroundColor: PropTypes.string,\n\n /\n Цвет границы пина\n /\n borderColor: PropTypes.string,\n\n /\n Ширина границы пина\n /\n borderWidth: PropTypes.number,\n\n /\n Смещение пина от края попапа. Край задаётся в пропе position вторым словом\n /\n offset: PropTypes.number,\n\n /\n Ссылка на попап\n /\n popupElement: PropTypes.any,\n\n /\n Позиция поапа, по которой будет вычеслено положение пина\n /\n popupPosition: PropTypes.string,\n\n /\n Сторона пина без учёта границы.\n * Пин представляет собой равносторонний треугольник, высота от попапа\n * до \"носика\" пина будет соответствовать формуле (size* √3)/2\n /\n size: PropTypes.number,\n };\n\n public render() {\n if (!this.props.popupElement) {\n return null;\n }\n\n const options = this.getPinOptions(\n PopupHelper.getElementAbsoluteRect(this.props.popupElement),\n PopupHelper.getPositionObject(this.props.popupPosition),\n this.props.size,\n this.props.offset,\n this.props.borderWidth,\n );\n\n const styleOuter: React.CSSProperties = this.getOuterStyle(\n options.activeBorder,\n options.outerSize,\n this.props.borderColor,\n );\n\n const styleInner: React.CSSProperties = this.getInnerStyle(\n options.activeBorder,\n this.props.size,\n this.props.backgroundColor,\n );\n\n const styleWrapper = this.getWrapperStyle(options.outerLeft, options.outerTop, options.outerSize);\n\n return (\n <div data-tid={PopupDataTids.popupPin} className={styles.wrapper()} style={styleWrapper}>\n <div style={styleOuter}>\n <div style={styleInner} />\n </div>\n </div>\n );\n }\n\n private getPopupOppositeDirection(): 'bottom' \| 'top' \| 'left' \| 'right' {\n const popupDirection = PopupHelper.getPositionObject(this.props.popupPosition).direction;\n switch (popupDirection) {\n case 'top':\n return 'bottom';\n case 'bottom':\n return 'top';\n case 'left':\n return 'right';\n case 'right':\n return 'left';\n default:\n throw new TypeError('Unknown direction ' + popupDirection);\n }\n }\n\n private getWrapperStyle(left: number, top: number, borderWidth: number) {\n const direction = this.getPopupOppositeDirection();\n switch (direction) {\n case 'top':\n case 'bottom':\n return {\n [direction]: -borderWidth + 'px',\n left: left + 'px',\n width: borderWidth 2 + 'px',\n height: borderWidth + 'px',\n };\n case 'left':\n case 'right':\n return {\n [direction]: -borderWidth + 'px',\n top: top + 'px',\n height: borderWidth * 2 + 'px',\n width: borderWidth + 'px',\n };\n default:\n throw new TypeError('Unknown direction ' + direction);\n }\n }\n\n private getOuterStyle(activeBorder: string, borderWitdth: number, borderColor: string): React.CSSProperties {\n const direction = this.getPopupOppositeDirection();\n switch (direction) {\n case 'top':\n case 'bottom':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 'px',\n left: '0px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n case 'left':\n case 'right':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 'px',\n top: '0px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n default:\n throw new TypeError('Unknown direction ' + direction);\n }\n }\n\n private getInnerStyle(activeBorder: string, borderWitdth: number, borderColor: string): React.CSSProperties {\n const direction = this.getPopupOppositeDirection();\n switch (direction) {\n case 'top':\n case 'bottom':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 2 + 'px',\n left: -borderWitdth + 'px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n case 'left':\n case 'right':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 2 + 'px',\n top: -borderWitdth + 'px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n default:\n throw new TypeError('Unknown direction ' + direction);\n }\n }\n\n private getPinOptions(\n popupRect: Rect,\n popupPosition: PositionObject,\n pinSize: number,\n pinOffset: number,\n borderWidth: number,\n ) {\n const bordersDelta = 2 * borderWidth;\n const outerSize = pinSize + bordersDelta;\n\n switch (popupPosition.direction) {\n case 'top':\n return {\n outerTop: popupRect.height,\n outerLeft: this.getPinLeftCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n innerTop: -outerSize,\n innerLeft: -outerSize + bordersDelta,\n activeBorder: 'Top',\n outerSize,\n };\n case 'bottom':\n return {\n outerTop: -2 * outerSize,\n outerLeft: this.getPinLeftCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n innerTop: -outerSize + 2 * bordersDelta,\n innerLeft: -outerSize + bordersDelta,\n activeBorder: 'Bottom',\n outerSize,\n };\n case 'left':\n return {\n outerTop: this.getPinTopCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n outerLeft: popupRect.width,\n innerTop: -outerSize + bordersDelta,\n innerLeft: -outerSize,\n activeBorder: 'Left',\n outerSize,\n };\n case 'right':\n return {\n outerTop: this.getPinTopCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n outerLeft: -2 * outerSize,\n innerTop: -outerSize + bordersDelta,\n innerLeft: -outerSize + 2 * bordersDelta,\n activeBorder: 'Right',\n outerSize,\n };\n default:\n throw new Error('Direction must be one of top, right, bottom, left');\n }\n }\n\n private getPinTopCoordinate(popupRect: Rect, align: string, pinHeight: number, pinOffset: number) {\n switch (align) {\n case 'top':\n return pinOffset;\n case 'middle':\n return popupRect.height / 2 - pinHeight;\n case 'bottom':\n return popupRect.height - pinOffset - 2 * pinHeight;\n default:\n throw new Error(`Unexpected align '${align}'`);\n }\n }\n\n private getPinLeftCoordinate(popupRect: Rect, align: string, pinHeight: number, pinOffset: number) {\n switch (align) {\n case 'left':\n return pinOffset;\n case 'center':\n return popupRect.width / 2 - pinHeight;\n case 'right':\n return popupRect.width - pinOffset - 2 * pinHeight;\n default:\n throw new Error(`Unexpected align '${align}'`);\n }\n }\n}\n"]}
1	+ {"version":3,"sources":["PopupPin.tsx"],"names":["borderStyles","position","borderStyle","borderTopColor","borderBottomColor","borderLeftColor","borderRightColor","PopupPin","render","props","popupElement","options","getPinOptions","PopupHelper","getElementAbsoluteRect","getPositionObject","popupPosition","size","offset","borderWidth","styleOuter","getOuterStyle","activeBorder","outerSize","borderColor","styleInner","getInnerStyle","backgroundColor","styleWrapper","getWrapperStyle","outerLeft","outerTop","PopupDataTids","popupPin","styles","wrapper","getPopupOppositeDirection","popupDirection","direction","TypeError","left","top","width","height","borderWitdth","popupRect","pinSize","pinOffset","bordersDelta","getPinLeftCoordinate","align","innerTop","innerLeft","getPinTopCoordinate","Error","pinHeight","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","string","number","any"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Nullable } from '../../typings/utility-types';\n\nimport { PopupHelper, PositionObject, Rect } from './PopupHelper';\nimport { styles } from './PopupPin.styles';\nimport { PopupDataTids } from './Popup';\n\nconst borderStyles = {\n position: 'absolute',\n borderStyle: 'solid',\n borderTopColor: 'transparent',\n borderBottomColor: 'transparent',\n borderLeftColor: 'transparent',\n borderRightColor: 'transparent',\n};\n\ninterface Props {\n backgroundColor: string;\n borderColor: string;\n borderWidth: number;\n offset: number;\n popupElement: Nullable<Element>;\n popupPosition: string;\n size: number;\n}\n\nexport class PopupPin extends React.Component<Props> {\n public static __KONTUR_REACT_UI__ = 'PopupPin';\n\n public static propTypes = {\n /*\n Цвет фон пина\n /\n backgroundColor: PropTypes.string,\n\n /\n Цвет границы пина\n /\n borderColor: PropTypes.string,\n\n /\n Ширина границы пина\n /\n borderWidth: PropTypes.number,\n\n /\n Смещение пина от края попапа. Край задаётся в пропе position вторым словом\n /\n offset: PropTypes.number,\n\n /\n Ссылка на попап\n /\n popupElement: PropTypes.any,\n\n /\n Позиция попапа, по которой будет вычислено положение пина\n /\n popupPosition: PropTypes.string,\n\n /\n Сторона пина без учёта границы.\n * Пин представляет собой равносторонний треугольник, высота от попапа\n * до \"носика\" пина будет соответствовать формуле (size* √3)/2\n /\n size: PropTypes.number,\n };\n\n public render() {\n if (!this.props.popupElement) {\n return null;\n }\n\n const options = this.getPinOptions(\n PopupHelper.getElementAbsoluteRect(this.props.popupElement),\n PopupHelper.getPositionObject(this.props.popupPosition),\n this.props.size,\n this.props.offset,\n this.props.borderWidth,\n );\n\n const styleOuter: React.CSSProperties = this.getOuterStyle(\n options.activeBorder,\n options.outerSize,\n this.props.borderColor,\n );\n\n const styleInner: React.CSSProperties = this.getInnerStyle(\n options.activeBorder,\n this.props.size,\n this.props.backgroundColor,\n );\n\n const styleWrapper = this.getWrapperStyle(options.outerLeft, options.outerTop, options.outerSize);\n\n return (\n <div data-tid={PopupDataTids.popupPin} className={styles.wrapper()} style={styleWrapper}>\n <div style={styleOuter}>\n <div style={styleInner} />\n </div>\n </div>\n );\n }\n\n private getPopupOppositeDirection(): 'bottom' \| 'top' \| 'left' \| 'right' {\n const popupDirection = PopupHelper.getPositionObject(this.props.popupPosition).direction;\n switch (popupDirection) {\n case 'top':\n return 'bottom';\n case 'bottom':\n return 'top';\n case 'left':\n return 'right';\n case 'right':\n return 'left';\n default:\n throw new TypeError('Unknown direction ' + popupDirection);\n }\n }\n\n private getWrapperStyle(left: number, top: number, borderWidth: number) {\n const direction = this.getPopupOppositeDirection();\n switch (direction) {\n case 'top':\n case 'bottom':\n return {\n [direction]: -borderWidth + 'px',\n left: left + 'px',\n width: borderWidth 2 + 'px',\n height: borderWidth + 'px',\n };\n case 'left':\n case 'right':\n return {\n [direction]: -borderWidth + 'px',\n top: top + 'px',\n height: borderWidth * 2 + 'px',\n width: borderWidth + 'px',\n };\n default:\n throw new TypeError('Unknown direction ' + direction);\n }\n }\n\n private getOuterStyle(activeBorder: string, borderWitdth: number, borderColor: string): React.CSSProperties {\n const direction = this.getPopupOppositeDirection();\n switch (direction) {\n case 'top':\n case 'bottom':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 'px',\n left: '0px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n case 'left':\n case 'right':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 'px',\n top: '0px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n default:\n throw new TypeError('Unknown direction ' + direction);\n }\n }\n\n private getInnerStyle(activeBorder: string, borderWitdth: number, borderColor: string): React.CSSProperties {\n const direction = this.getPopupOppositeDirection();\n switch (direction) {\n case 'top':\n case 'bottom':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 2 + 'px',\n left: -borderWitdth + 'px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n case 'left':\n case 'right':\n return {\n ...borderStyles,\n [direction]: -borderWitdth + 2 + 'px',\n top: -borderWitdth + 'px',\n borderWidth: borderWitdth + 'px',\n ['border' + activeBorder + 'Color']: borderColor,\n } as React.CSSProperties;\n default:\n throw new TypeError('Unknown direction ' + direction);\n }\n }\n\n private getPinOptions(\n popupRect: Rect,\n popupPosition: PositionObject,\n pinSize: number,\n pinOffset: number,\n borderWidth: number,\n ) {\n const bordersDelta = 2 * borderWidth;\n const outerSize = pinSize + bordersDelta;\n\n switch (popupPosition.direction) {\n case 'top':\n return {\n outerTop: popupRect.height,\n outerLeft: this.getPinLeftCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n innerTop: -outerSize,\n innerLeft: -outerSize + bordersDelta,\n activeBorder: 'Top',\n outerSize,\n };\n case 'bottom':\n return {\n outerTop: -2 * outerSize,\n outerLeft: this.getPinLeftCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n innerTop: -outerSize + 2 * bordersDelta,\n innerLeft: -outerSize + bordersDelta,\n activeBorder: 'Bottom',\n outerSize,\n };\n case 'left':\n return {\n outerTop: this.getPinTopCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n outerLeft: popupRect.width,\n innerTop: -outerSize + bordersDelta,\n innerLeft: -outerSize,\n activeBorder: 'Left',\n outerSize,\n };\n case 'right':\n return {\n outerTop: this.getPinTopCoordinate(popupRect, popupPosition.align, pinSize, pinOffset) - bordersDelta,\n outerLeft: -2 * outerSize,\n innerTop: -outerSize + bordersDelta,\n innerLeft: -outerSize + 2 * bordersDelta,\n activeBorder: 'Right',\n outerSize,\n };\n default:\n throw new Error('Direction must be one of top, right, bottom, left');\n }\n }\n\n private getPinTopCoordinate(popupRect: Rect, align: string, pinHeight: number, pinOffset: number) {\n switch (align) {\n case 'top':\n return pinOffset;\n case 'middle':\n return popupRect.height / 2 - pinHeight;\n case 'bottom':\n return popupRect.height - pinOffset - 2 * pinHeight;\n default:\n throw new Error(`Unexpected align '${align}'`);\n }\n }\n\n private getPinLeftCoordinate(popupRect: Rect, align: string, pinHeight: number, pinOffset: number) {\n switch (align) {\n case 'left':\n return pinOffset;\n case 'center':\n return popupRect.width / 2 - pinHeight;\n case 'right':\n return popupRect.width - pinOffset - 2 * pinHeight;\n default:\n throw new Error(`Unexpected align '${align}'`);\n }\n }\n}\n"]}

package/cjs/internal/PopupMenu/PopupMenu.d.ts CHANGED Viewed

@@ -1,13 +1,15 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
+import { HTMLProps } from '../../typings/html';
 import { PopupPositionsType } from '../Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
+import { MenuProps } from '../Menu';
 export interface PopupMenuCaptionProps {
     opened: boolean;
     openMenu: (firstItemShouldBeSelected?: boolean) => void;
     closeMenu: (restoreFocus?: boolean) => void;
     toggleMenu: () => void;
 }
-export interface PopupMenuProps extends CommonProps {
+export interface PopupMenuProps extends CommonProps, Pick<MenuProps, 'preventIconsOffset'>, Pick<AriaAttributes, 'aria-label'> {
     children?: React.ReactNode;
     /** Максимальная высота меню */
     menuMaxHeight?: number | string;
@@ -38,6 +40,12 @@ export interface PopupMenuProps extends CommonProps {
     onOpen?: () => void;
     /** Действие при закрытии меню */
     onClose?: () => void;
+    /**
+     * Позволяет задать `id` выпадающему меню.
+     *
+     * Это может пригодиться при реализации a11y. Например, для того, чтобы связать `aria-controls` с выпадающим меню.
+     */
+    popupMenuId?: HTMLProps['id'];
 }
 interface PopupMenuState {
     menuVisible: boolean;
@@ -55,6 +63,7 @@ declare type DefaultProps = Required<Pick<PopupMenuProps, 'positions' | 'type' |
 export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {
     static __KONTUR_REACT_UI__: string;
     private isMobileLayout;
+    private rootId;
     static defaultProps: DefaultProps;
     private getProps;
     static Type: {
@@ -70,10 +79,12 @@ export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenu
     private menu;
     private setRootNode;
     render(): JSX.Element;
+    private renderMain;
     open: () => void;
     close: () => void;
     private refInternalMenu;
     private handleOpen;
+    private passPropsToCaption;
     private renderCaption;
     private hideMenuWithoutFocusing;
     private getPositions;

package/cjs/internal/PopupMenu/PopupMenu.js CHANGED Viewed

@@ -1,4 +1,7 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.PopupMenuType = exports.PopupMenuDataTids = exports.PopupMenu = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+var _globalObject = require("@skbkontur/global-object");
+var _utils = require("../../lib/utils");
 var _identifiers = require("../../lib/events/keyboard/identifiers");
@@ -7,7 +10,8 @@ var _identifiers = require("../../lib/events/keyboard/identifiers");
-var _InternalMenu = require("../InternalMenu");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _ThemeFactory = require("../../lib/theming/ThemeFactory");
 var _Popup = require("../Popup");
 var _RenderLayer = require("../RenderLayer");
@@ -15,6 +19,7 @@ var _CommonWrapper = require("../../internal/CommonWrapper");
 var _decorator = require("../../components/ResponsiveLayout/decorator");
 var _rootNode = require("../../lib/rootNode");
 var _createPropsGetter = require("../../lib/createPropsGetter");
+var _Menu = require("../Menu");
 var _validatePositions = require("./validatePositions");
 var _PopupMenu = require("./PopupMenu.styles");var _class, _class2, _temp;
@@ -57,6 +62,15 @@ var _PopupMenu = require("./PopupMenu.styles");var _class, _class2, _temp;
@@ -100,6 +114,7 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
+    rootId = _Popup.PopupIds.root + (0, _utils.getRandomID)();_this.
@@ -147,6 +162,29 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
@@ -179,6 +217,18 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
       }
     };_this.
+    passPropsToCaption = function (caption) {var _this$props$popupMenu;
+      if (typeof caption === 'string' || typeof caption === 'number') {
+        return caption;
+      }
+      return /*#__PURE__*/_react.default.cloneElement(caption, {
+        'aria-controls': (_this$props$popupMenu = _this.props.popupMenuId) != null ? _this$props$popupMenu : _this.rootId,
+        'aria-expanded': _this.state.menuVisible ? 'true' : 'false',
+        'aria-label': _this.props['aria-label'] });
+    };_this.
     renderCaption = function () {
       if (typeof _this.props.caption === 'function') {
         var caption = _this.props.caption({
@@ -194,7 +244,7 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
             className: _PopupMenu.styles.caption(),
             ref: function ref(element) {return _this.captionWrapper = element;} },
-          caption));
+          _this.passPropsToCaption(caption)));
       }
@@ -207,7 +257,7 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
           ref: function ref(element) {return _this.captionWrapper = element;},
           className: _PopupMenu.styles.caption() },
-        _this.props.caption));
+        _this.passPropsToCaption(_this.props.caption)));
     };_this.
@@ -271,8 +321,8 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
     };_this.
     saveFocus = function () {
-      if (document) {
-        _this.savedFocusableElement = document.activeElement;
+      if (_globalObject.globalObject.document) {
+        _this.savedFocusableElement = _globalObject.globalObject.document.activeElement;
       }
     };_this.
@@ -312,4 +362,4 @@ PopupMenu = (0, _rootNode.rootNode)(_class = (0, _decorator.responsiveLayout)(_c
       var restoreFocus = event.type === 'keydown';
       _this.hideMenu(restoreFocus);
-    };return _this;}var _proto = PopupMenu.prototype;_proto.render = function render() {var _this$getProps = this.getProps(),popupHasPin = _this$getProps.popupHasPin,disableAnimations = _this$getProps.disableAnimations;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: this.hideMenuWithoutFocusing, onFocusOutside: this.hideMenuWithoutFocusing, active: this.state.menuVisible }, /*#__PURE__*/_react.default.createElement("div", { "data-tid": PopupMenuDataTids.root, 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: popupHasPin, pinOffset: this.props.popupPinOffset, positions: this.getPositions(), disableAnimations: 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() {var positions = this.getProps().positions;if (positions && (0, _validatePositions.isValidPositions)(positions)) {return positions;}return Positions;};return PopupMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'PopupMenu', _class2.defaultProps = { positions: Positions, type: PopupMenuType.Tooltip, popupHasPin: true, disableAnimations: false }, _class2.Type = PopupMenuType, _temp)) || _class) || _class;exports.PopupMenu = PopupMenu;
+    };return _this;}var _proto = PopupMenu.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ menuOffsetY: theme.popupMenuMenuOffsetY }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var _this$props$popupMenu2;var _this$getProps = this.getProps(),popupHasPin = _this$getProps.popupHasPin,disableAnimations = _this$getProps.disableAnimations;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: this.hideMenuWithoutFocusing, onFocusOutside: this.hideMenuWithoutFocusing, active: this.state.menuVisible }, /*#__PURE__*/_react.default.createElement("div", { "data-tid": PopupMenuDataTids.root, className: _PopupMenu.styles.container(), style: { width: this.props.width } }, this.renderCaption(), this.captionWrapper && this.props.children && /*#__PURE__*/_react.default.createElement(_Popup.Popup, { id: (_this$props$popupMenu2 = this.props.popupMenuId) != null ? _this$props$popupMenu2 : this.rootId, anchorElement: this.captionWrapper, opened: this.state.menuVisible, hasShadow: true, margin: this.props.popupMargin, hasPin: popupHasPin, pinOffset: this.props.popupPinOffset, positions: this.getPositions(), disableAnimations: disableAnimations, onOpen: this.handleOpen, mobileOnCloseRequest: this.hideMenu, width: this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto' }, /*#__PURE__*/_react.default.createElement(_Menu.Menu, { hasShadow: false, maxHeight: this.isMobileLayout ? 'none' : this.props.menuMaxHeight || 'none', onKeyDown: this.handleKeyDown, onItemClick: this.handleItemSelection, preventIconsOffset: this.props.preventIconsOffset, 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() {var positions = this.getProps().positions;if (positions && (0, _validatePositions.isValidPositions)(positions)) {return positions;}return Positions;};return PopupMenu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'PopupMenu', _class2.defaultProps = { positions: Positions, type: PopupMenuType.Tooltip, popupHasPin: true, disableAnimations: false }, _class2.Type = PopupMenuType, _temp)) || _class) || _class;exports.PopupMenu = PopupMenu;

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["PopupMenu.tsx"],"names":["PopupMenuType","Dropdown","Tooltip","PopupMenuDataTids","root","caption","Positions","PopupMenu","rootNode","responsiveLayout","getProps","defaultProps","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","opened","openMenu","closeMenu","toggleMenu","styles","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onOpen","onClose","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","popupHasPin","disableAnimations","setRootNode","container","width","children","popupMargin","popupPinOffset","getPositions","isMobileLayout","menuWidth","menuMaxHeight","header","footer","positions","React","Component","__KONTUR_REACT_UI__","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, PopupPositionsType } from '../Popup';\nimport { RenderLayer } from '../RenderLayer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\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?: PopupPositionsType[];\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 onOpen?: () => void;\n /* Действие при закрытии меню */\n onClose?: () => void;\n}\n\ninterface PopupMenuState {\n menuVisible: boolean;\n firstItemShouldBeSelected?: boolean;\n}\n\nexport const PopupMenuType = {\n Dropdown: 'dropdown',\n Tooltip: 'tooltip',\n} as const;\n\nexport const PopupMenuDataTids = {\n root: 'PopupMenu__root',\n caption: 'PopupMenu__caption',\n} as const;\n\nconst Positions: PopupPositionsType[] = [\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\ntype DefaultProps = Required<Pick<PopupMenuProps, 'positions' \| 'type' \| 'popupHasPin' \| 'disableAnimations'>>;\n\n@rootNode\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: DefaultProps = {\n positions: Positions,\n type: PopupMenuType.Tooltip,\n popupHasPin: true,\n disableAnimations: false,\n };\n\n private getProps = createPropsGetter(PopupMenu.defaultProps);\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 const { popupHasPin, disableAnimations } = this.getProps();\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 data-tid={PopupMenuDataTids.root} 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={popupHasPin}\n pinOffset={this.props.popupPinOffset}\n positions={this.getPositions()}\n disableAnimations={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={PopupMenuDataTids.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={PopupMenuDataTids.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(): Readonly<PopupPositionsType[]> {\n const positions = this.getProps().positions;\n if (positions && isValidPositions(positions)) {\n return positions;\n }\n\n return Positions;\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\n if (this.state.menuVisible && this.props.onOpen) {\n this.props.onOpen();\n }\n\n if (!this.state.menuVisible && this.props.onClose) {\n this.props.onClose();\n }\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"]}
1	+ {"version":3,"sources":["PopupMenu.tsx"],"names":["PopupMenuType","Dropdown","Tooltip","PopupMenuDataTids","root","caption","Positions","PopupMenu","rootNode","responsiveLayout","rootId","PopupIds","getProps","defaultProps","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","passPropsToCaption","React","cloneElement","props","popupMenuId","renderCaption","opened","openMenu","closeMenu","toggleMenu","styles","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleKeyDown","globalObject","document","activeElement","focusShouldBeRestored","onOpen","onClose","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","theme","ThemeFactory","create","menuOffsetY","popupMenuMenuOffsetY","renderMain","popupHasPin","disableAnimations","setRootNode","container","width","children","popupMargin","popupPinOffset","getPositions","isMobileLayout","menuWidth","menuMaxHeight","preventIconsOffset","header","footer","positions","Component","__KONTUR_REACT_UI__","Type"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { getRandomID } from '../../lib/utils';\nimport { HTMLProps } from '../../typings/html';\nimport {\n isKeyArrowVertical,\n isKeyEnter,\n isKeyEscape,\n isKeySpace,\n someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { Popup, PopupIds, PopupPositionsType } from '../Popup';\nimport { RenderLayer } from '../RenderLayer';\nimport { Nullable } from '../../typings/utility-types';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { Menu, MenuProps } from '../Menu';\n\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\n extends CommonProps,\n Pick<MenuProps, 'preventIconsOffset'>,\n Pick<AriaAttributes, 'aria-label'> {\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?: PopupPositionsType[];\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 onOpen?: () => void;\n /* Действие при закрытии меню /\n onClose?: () => void;\n /\n Позволяет задать `id` выпадающему меню.\n \n Это может пригодиться при реализации a11y. Например, для того, чтобы связать `aria-controls` с выпадающим меню.\n */\n popupMenuId?: HTMLProps['id'];\n}\n\ninterface PopupMenuState {\n menuVisible: boolean;\n firstItemShouldBeSelected?: boolean;\n}\n\nexport const PopupMenuType = {\n Dropdown: 'dropdown',\n Tooltip: 'tooltip',\n} as const;\n\nexport const PopupMenuDataTids = {\n root: 'PopupMenu__root',\n caption: 'PopupMenu__caption',\n} as const;\n\nconst Positions: PopupPositionsType[] = [\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\ntype DefaultProps = Required<Pick<PopupMenuProps, 'positions' \| 'type' \| 'popupHasPin' \| 'disableAnimations'>>;\n\n@rootNode\n@responsiveLayout\nexport class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {\n public static __KONTUR_REACT_UI__ = 'PopupMenu';\n\n private isMobileLayout!: boolean;\n private rootId = PopupIds.root + getRandomID();\n\n public static defaultProps: DefaultProps = {\n positions: Positions,\n type: PopupMenuType.Tooltip,\n popupHasPin: true,\n disableAnimations: false,\n };\n\n private getProps = createPropsGetter(PopupMenu.defaultProps);\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<Menu> = null;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return (\n <ThemeContext.Provider\n value={ThemeFactory.create(\n {\n menuOffsetY: theme.popupMenuMenuOffsetY,\n },\n theme,\n )}\n >\n {this.renderMain()}\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain() {\n const { popupHasPin, disableAnimations } = this.getProps();\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 data-tid={PopupMenuDataTids.root} className={styles.container()} style={{ width: this.props.width }}>\n {this.renderCaption()}\n {this.captionWrapper && this.props.children && (\n <Popup\n id={this.props.popupMenuId ?? this.rootId}\n anchorElement={this.captionWrapper}\n opened={this.state.menuVisible}\n hasShadow\n margin={this.props.popupMargin}\n hasPin={popupHasPin}\n pinOffset={this.props.popupPinOffset}\n positions={this.getPositions()}\n disableAnimations={disableAnimations}\n onOpen={this.handleOpen}\n mobileOnCloseRequest={this.hideMenu}\n width={this.isMobileLayout ? 'auto' : this.props.menuWidth \|\| 'auto'}\n >\n <Menu\n hasShadow={false}\n maxHeight={this.isMobileLayout ? 'none' : this.props.menuMaxHeight \|\| 'none'}\n onKeyDown={this.handleKeyDown}\n onItemClick={this.handleItemSelection}\n preventIconsOffset={this.props.preventIconsOffset}\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 </Menu>\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<Menu>) => (this.menu = element);\n\n private handleOpen = () => {\n if (this.menu) {\n this.menu.focus();\n }\n };\n\n private passPropsToCaption = (caption: React.ReactNode) => {\n if (typeof caption === 'string' \|\| typeof caption === 'number') {\n return caption;\n }\n\n return React.cloneElement(caption as React.ReactElement, {\n 'aria-controls': this.props.popupMenuId ?? this.rootId,\n 'aria-expanded': this.state.menuVisible ? 'true' : 'false',\n 'aria-label': this.props['aria-label'],\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={PopupMenuDataTids.caption}\n className={styles.caption()}\n ref={(element) => (this.captionWrapper = element)}\n >\n {this.passPropsToCaption(caption)}\n </span>\n );\n }\n\n return (\n <span\n data-tid={PopupMenuDataTids.caption}\n onClick={this.handleCaptionClick}\n onKeyDown={this.handleCaptionKeyDown}\n ref={(element) => (this.captionWrapper = element)}\n className={styles.caption()}\n >\n {this.passPropsToCaption(this.props.caption)}\n </span>\n );\n };\n\n private hideMenuWithoutFocusing = () => this.hideMenu();\n\n private getPositions(): Readonly<PopupPositionsType[]> {\n const positions = this.getProps().positions;\n if (positions && isValidPositions(positions)) {\n return positions;\n }\n\n return Positions;\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 (globalObject.document) {\n this.savedFocusableElement = globalObject.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\n if (this.state.menuVisible && this.props.onOpen) {\n this.props.onOpen();\n }\n\n if (!this.state.menuVisible && this.props.onClose) {\n this.props.onClose();\n }\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/RenderContainer/RenderContainer.d.ts CHANGED Viewed

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

package/cjs/internal/RenderContainer/RenderContainer.js CHANGED Viewed

@@ -1,6 +1,6 @@
 "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 _globalObject = require("@skbkontur/global-object");
-var _client = require("../../lib/client");
 var _utils = require("../../lib/utils");
 var _Upgrades = require("../../lib/Upgrades");
@@ -9,21 +9,13 @@ var _callChildRef = require("../../lib/callChildRef/callChildRef");
 var _RenderInnerContainer = require("./RenderInnerContainer");var
-RenderContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(RenderContainer, _React$Component);
+RenderContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(RenderContainer, _React$Component);function RenderContainer() {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.
+    domContainer = null;_this.
-  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.
+    rootId = RenderContainer.getRootId();return _this;}var _proto = RenderContainer.prototype;_proto.
   shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
     if (!this.props.children && nextProps.children) {
@@ -40,30 +32,34 @@ RenderContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.
   };_proto.
   render = function render() {
+    if (this.props.children) {
+      this.mountContainer();
+    }
     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');
+  createContainer = function createContainer() {var _globalObject$documen;
+    var domContainer = (_globalObject$documen = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen.createElement('div');
+    if (domContainer) {
       domContainer.setAttribute('class', _Upgrades.Upgrade.getSpecificityClassName());
       domContainer.setAttribute('data-rendered-container-id', "" + this.rootId);
       this.domContainer = domContainer;
     }
   };_proto.
-  mountContainer = function mountContainer() {
+  mountContainer = function mountContainer() {var _globalObject$documen2;
     if (!this.domContainer) {
       this.createContainer();
     }
-    if (this.domContainer && this.domContainer.parentNode !== document.body) {
-      document.body.appendChild(this.domContainer);
+    if (this.domContainer && this.domContainer.parentNode !== ((_globalObject$documen2 = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen2.body)) {var _globalObject$documen3;
+      (_globalObject$documen3 = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen3.body.appendChild(this.domContainer);
       if (this.props.containerRef) {
         (0, _callChildRef.callChildRef)(this.props.containerRef, this.domContainer);
       }
-      if (window.ReactTesting) {
-        window.ReactTesting.addRenderContainer(this.rootId, this);
+      if (_globalObject.globalObject.ReactTesting) {
+        _globalObject.globalObject.ReactTesting.addRenderContainer(this.rootId, this);
       }
     }
   };_proto.
@@ -83,8 +79,8 @@ RenderContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.
         (0, _callChildRef.callChildRef)(this.props.containerRef, null);
       }
-      if (window.ReactTesting) {
-        window.ReactTesting.removeRenderContainer(this.rootId);
+      if (_globalObject.globalObject.ReactTesting) {
+        _globalObject.globalObject.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 CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["RenderContainer.tsx"],"names":["RenderContainer","~~props","~~domContainer","rootId","getRootId","~~isBrowser~~","~~children~~","~~mountContainer~~","~~shouldComponentUpdate~~","~~nextProps~~","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","~~canUseDOM~~","document","createElement","setAttribute","Upgrade","getSpecificityClassName","parentNode","body","appendChild","containerRef","~~window","~~ReactTesting","addRenderContainer","removeChild","removeRenderContainer","React","Component","__KONTUR_REACT_UI__"],"mappings":"6UAAA~~;;AAEA;;AAEA~~;AACA;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,qB,GAAP,+BAA6BC,SAA7B,EAA8D;AAC5D,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;AACD,WAAO,IAAP;AACD,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~~;;AAEA,UAAI,~~KAAKD~~,KAAL,~~CAAWuB~~,YAAf,EAA6B;AAC3B,wCAAa,~~KAAKvB~~,KAAL,~~CAAWuB~~,YAAxB,EAAsC,KAAKtB,YAA3C;AACD;AACD,~~UAAIuB~~,~~MAAM~~,~~CAACC~~,~~YAAX,EAAyB~~;~~AACvBD~~,~~QAAAA~~,~~MAAM~~,~~CAACC~~,~~YAAP~~,~~CAAoBC~~,~~kBAApB~~,~~CAAuC~~,~~KAAKxB~~,~~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,~~CAA6BO~~,WAA7B,CAAyC,~~KAAK1B~~,YAA9C;;AAEA,UAAI,~~KAAKD~~,KAAL,~~CAAWuB~~,YAAf,EAA6B;AAC3B,wCAAa,~~KAAKvB~~,KAAL,~~CAAWuB~~,YAAxB,EAAsC,IAAtC;AACD;;AAED,~~UAAIC~~,~~MAAM~~,~~CAACC~~,~~YAAX,EAAyB~~;~~AACvBD~~,~~QAAAA~~,~~MAAM~~,~~CAACC~~,~~YAAP~~,~~CAAoBG~~,~~qBAApB~~,~~CAA0C,KAAK1B,MAA/C~~;AACD;AACF;AACF,G,~~0BA9EkC2B~~,eAAMC,S,~~4CAA9B/B~~,e,~~CACGgC~~,mB,GAAsB,iB,~~CADzBhC~~,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';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef';\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\n if (this.props.containerRef) {\n callChildRef(this.props.containerRef, this.domContainer);\n }\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 (this.props.containerRef) {\n callChildRef(this.props.containerRef, null);\n }\n\n if (~~window~~.ReactTesting) {\n ~~window~~.ReactTesting.removeRenderContainer(this.rootId);\n }\n }\n }\n}\n"]}
1	+ {"version":3,"sources":["RenderContainer.tsx"],"names":["RenderContainer","domContainer","rootId","getRootId","shouldComponentUpdate","nextProps","props","children","mountContainer","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","globalObject","document","createElement","setAttribute","Upgrade","getSpecificityClassName","parentNode","body","appendChild","containerRef","ReactTesting","addRenderContainer","removeChild","removeRenderContainer","React","Component","__KONTUR_REACT_UI__"],"mappings":"6UAAA;AACA;;;AAGA;AACA;AACA;;AAEA,8D;;;AAGaA,e;;;;AAIHC,IAAAA,Y,GAAsC,I;;AAE7BC,IAAAA,M,GAAiBF,eAAe,CAACG,SAAhB,E;;AAE3BC,EAAAA,qB,GAAP,+BAA6BC,SAA7B,EAA8D;AAC5D,QAAI,CAAC,KAAKC,KAAL,CAAWC,QAAZ,IAAwBF,SAAS,CAACE,QAAtC,EAAgD;AAC9C,WAAKC,cAAL;AACD;AACD,QAAI,KAAKF,KAAL,CAAWC,QAAX,IAAuB,CAACF,SAAS,CAACE,QAAtC,EAAgD;AAC9C,WAAKE,gBAAL;AACD;AACD,WAAO,IAAP;AACD,G;;AAEMC,EAAAA,oB,GAAP,gCAA8B;AAC5B,SAAKC,gBAAL;AACD,G;;AAEMC,EAAAA,M,GAAP,kBAAgB;AACd,QAAI,KAAKN,KAAL,CAAWC,QAAf,EAAyB;AACvB,WAAKC,cAAL;AACD;;AAED,wBAAO,6BAAC,0CAAD,6BAA0B,KAAKF,KAA/B,IAAsC,YAAY,EAAE,KAAKL,YAAzD,EAAuE,MAAM,EAAE,KAAKC,MAApF,IAAP;AACD,G;;AAEOW,EAAAA,e,GAAR,2BAA0B;AACxB,QAAMZ,YAAY,4BAAGa,2BAAaC,QAAhB,qBAAG,sBAAuBC,aAAvB,CAAqC,KAArC,CAArB;AACA,QAAIf,YAAJ,EAAkB;AAChBA,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;;AAEOO,EAAAA,c,GAAR,0BAAyB;AACvB,QAAI,CAAC,KAAKP,YAAV,EAAwB;AACtB,WAAKY,eAAL;AACD;AACD,QAAI,KAAKZ,YAAL,IAAqB,KAAKA,YAAL,CAAkBmB,UAAlB,gCAAiCN,2BAAaC,QAA9C,qBAAiC,uBAAuBM,IAAxD,CAAzB,EAAuF;AACrF,2DAAaN,QAAb,4CAAuBM,IAAvB,CAA4BC,WAA5B,CAAwC,KAAKrB,YAA7C;;AAEA,UAAI,KAAKK,KAAL,CAAWiB,YAAf,EAA6B;AAC3B,wCAAa,KAAKjB,KAAL,CAAWiB,YAAxB,EAAsC,KAAKtB,YAA3C;AACD;AACD,UAAIa,2BAAaU,YAAjB,EAA+B;AAC7BV,mCAAaU,YAAb,CAA0BC,kBAA1B,CAA6C,KAAKvB,MAAlD,EAA0D,IAA1D;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,UAAI,KAAKK,KAAL,CAAWiB,YAAf,EAA6B;AAC3B,wCAAa,KAAKjB,KAAL,CAAWiB,YAAxB,EAAsC,IAAtC;AACD;;AAED,UAAIT,2BAAaU,YAAjB,EAA+B;AAC7BV,mCAAaU,YAAb,CAA0BG,qBAA1B,CAAgD,KAAKzB,MAArD;AACD;AACF;AACF,G,0BA1EkC0B,eAAMC,S,4CAA9B7B,e,CACG8B,mB,GAAsB,iB,CADzB9B,e,CAGIG,S,GAAY,oBAAM,yBAAN,E","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 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 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('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 !== 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/cjs/internal/RenderContainer/RenderInnerContainer.js CHANGED Viewed

@@ -1,6 +1,7 @@
 "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 _propTypes = _interopRequireDefault(require("prop-types"));
+var _globalObject = require("@skbkontur/global-object");
 var _SSRSafe = require("../../lib/SSRSafe");
@@ -65,6 +66,6 @@ RenderInnerContainer = /*#__PURE__*/function (_React$Component) {(0, _inheritsLo
 Portal.propTypes = {
-  container: (0, _SSRSafe.safePropTypesInstanceOf)(function () {return HTMLElement;}),
+  container: (0, _SSRSafe.safePropTypesInstanceOf)(_globalObject.globalObject.HTMLElement),
   rt_rootID: _propTypes.default.string.isRequired,
   children: _propTypes.default.node.isRequired };

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

	@@ -1 +1 @@
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__","propTypes","HTMLElement","string","isRequired","node"],"mappings":"iRAAA;AACA;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,MAAM,GAAG,SAATA,MAAS,OAAqD,KAAlDC,SAAkD,QAAlDA,SAAkD,CAAvCC,SAAuC,QAAvCA,SAAuC,CAA5BC,QAA4B,QAA5BA,QAA4B;AACzE;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;AACd,sBAAmD,KAAKC,KAAxD,CAAQC,MAAR,eAAQA,MAAR,CAAgBN,QAAhB,eAAgBA,QAAhB,CAA0BO,YAA1B,eAA0BA,YAA1B,CAAwCC,MAAxC,eAAwCA,MAAxC;AACA,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;AACGP,MAAAA,QADH,CAFF,CADF;;;;AAQD;;AAED,WAAOS,KAAP;AACD,G,+BAnBuCC,eAAMC,S,sDAAnCR,oB,CACGS,mB,GAAsB,sB;;;AAqBtCf,MAAM,CAACgB,SAAP,GAAmB;AACjBf,EAAAA,SAAS,EAAE,~~sCAAwB~~,~~oBAAMgB~~,~~WAAN~~,~~EAAxB,~~CADM;~~AAEjBf~~,EAAAA,SAAS,EAAEc,~~mBAAUE~~,MAAV,CAAiBC,UAFX;~~AAGjBhB~~,EAAAA,QAAQ,EAAEa,~~mBAAUI~~,IAAV,CAAeD,UAHR,EAAnB","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport propTypes from 'prop-types';\n\nimport { Nullable } from '../../typings/utility-types';\nimport { safePropTypesInstanceOf } from '../../lib/SSRSafe';\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 = ({ 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 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\nPortal.propTypes = {\n container: safePropTypesInstanceOf(~~() =>~~ HTMLElement),\n rt_rootID: propTypes.string.isRequired,\n children: propTypes.node.isRequired,\n};\n"]}
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__","propTypes","globalObject","HTMLElement","string","isRequired","node"],"mappings":"iRAAA;AACA;AACA;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,MAAM,GAAG,SAATA,MAAS,OAAqD,KAAlDC,SAAkD,QAAlDA,SAAkD,CAAvCC,SAAuC,QAAvCA,SAAuC,CAA5BC,QAA4B,QAA5BA,QAA4B;AACzE;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;AACd,sBAAmD,KAAKC,KAAxD,CAAQC,MAAR,eAAQA,MAAR,CAAgBN,QAAhB,eAAgBA,QAAhB,CAA0BO,YAA1B,eAA0BA,YAA1B,CAAwCC,MAAxC,eAAwCA,MAAxC;AACA,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;AACGP,MAAAA,QADH,CAFF,CADF;;;;AAQD;;AAED,WAAOS,KAAP;AACD,G,+BAnBuCC,eAAMC,S,sDAAnCR,oB,CACGS,mB,GAAsB,sB;;;AAqBtCf,MAAM,CAACgB,SAAP,GAAmB;AACjBf,EAAAA,SAAS,EAAE,sCAAwBgB,2BAAaC,WAArC,CADM;AAEjBhB,EAAAA,SAAS,EAAEc,mBAAUG,MAAV,CAAiBC,UAFX;AAGjBjB,EAAAA,QAAQ,EAAEa,mBAAUK,IAAV,CAAeD,UAHR,EAAnB","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';\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 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\nPortal.propTypes = {\n container: safePropTypesInstanceOf(globalObject.HTMLElement),\n rt_rootID: propTypes.string.isRequired,\n children: propTypes.node.isRequired,\n};\n"]}

package/cjs/internal/RenderLayer/RenderLayer.js CHANGED Viewed

@@ -1,10 +1,12 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.RenderLayer = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+var _globalObject = require("@skbkontur/global-object");
 var _listenFocusOutside = require("../../lib/listenFocusOutside");
 var _CommonWrapper = require("../CommonWrapper");
 var _rootNode = require("../../lib/rootNode");
-var _createPropsGetter = require("../../lib/createPropsGetter");var _class, _class2, _temp;var
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _isInstanceOf = require("../../lib/isInstanceOf");var _class, _class2, _temp;var
@@ -99,6 +101,10 @@ RenderLayer = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/f
@@ -114,11 +120,11 @@ RenderLayer = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/f
       var target = event.target || event.srcElement;
       var node = _this.getAnchorNode();
-      if (!node || target instanceof Element && (0, _listenFocusOutside.containsTargetOrRenderContainer)(target)(node)) {
+      if (!node || (0, _isInstanceOf.isInstanceOf)(target, _globalObject.globalObject.Element) && (0, _listenFocusOutside.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.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), _react.default.Children.only(this.props.children));};_proto.getAnchorNode = function getAnchorNode() {var getAnchorElement = this.props.getAnchorElement;return getAnchorElement ? getAnchorElement() : (0, _rootNode.getRootNode)(this);};_proto.attachListeners = function attachListeners() {var node = this.getAnchorNode();if (!node) {return;}this.focusOutsideListenerToken = (0, _listenFocusOutside.listen)(function () {return [node];}, this.handleFocusOutside);window.addEventListener('blur', this.handleFocusOutside);document.addEventListener('ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown', this.handleNativeDocClick);};_proto.detachListeners = function detachListeners() {if (this.focusOutsideListenerToken) {this.focusOutsideListenerToken.remove();this.focusOutsideListenerToken = null;}window.removeEventListener('blur', this.handleFocusOutside);document.removeEventListener('ontouchstart' in document.documentElement ? 'touchstart' : 'mousedown', this.handleNativeDocClick);};return RenderLayer;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = '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;exports.RenderLayer = RenderLayer;
+    };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.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), _react.default.Children.only(this.props.children));};_proto.getAnchorNode = function getAnchorNode() {var getAnchorElement = this.props.getAnchorElement;return getAnchorElement ? getAnchorElement() : (0, _rootNode.getRootNode)(this);};_proto.attachListeners = function attachListeners() {var _globalObject$documen;var node = this.getAnchorNode();if (!node) {return;}this.focusOutsideListenerToken = (0, _listenFocusOutside.listen)(function () {return [node];}, this.handleFocusOutside);_globalObject.globalObject.addEventListener == null ? void 0 : _globalObject.globalObject.addEventListener('blur', this.handleFocusOutside);(_globalObject$documen = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen.addEventListener('ontouchstart' in _globalObject.globalObject.document.documentElement && 'onpointerup' in _globalObject.globalObject.document.documentElement ? 'pointerup' : 'mousedown', this.handleNativeDocClick);};_proto.detachListeners = function detachListeners() {var _globalObject$documen2;if (this.focusOutsideListenerToken) {this.focusOutsideListenerToken.remove();this.focusOutsideListenerToken = null;}_globalObject.globalObject.removeEventListener == null ? void 0 : _globalObject.globalObject.removeEventListener('blur', this.handleFocusOutside);(_globalObject$documen2 = _globalObject.globalObject.document) == null ? void 0 : _globalObject$documen2.removeEventListener('ontouchstart' in _globalObject.globalObject.document.documentElement && 'onpointerup' in _globalObject.globalObject.document.documentElement ? 'pointerup' : 'mousedown', this.handleNativeDocClick);};return RenderLayer;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = '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;exports.RenderLayer = RenderLayer;