npm - @skbkontur/react-ui - Versions diffs - 0.0.0-ce2a893b1a → 0.0.0-d1bb8f344a - Mend

@skbkontur/react-ui 0.0.0-ce2a893b1a → 0.0.0-d1bb8f344a

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 (3293) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["PopupPin.tsx"],"names":["React","PropTypes","PopupHelper","styles","borderStyles","position","borderStyle","borderTopColor","borderBottomColor","borderLeftColor","borderRightColor","PopupPin","render","props","popupElement","options","getPinOptions","getElementAbsoluteRect","getPositionObject","popupPosition","size","offset","borderWidth","styleOuter","getOuterStyle","activeBorder","outerSize","borderColor","styleInner","getInnerStyle","backgroundColor","styleWrapper","getWrapperStyle","outerLeft","outerTop","wrapper","getPopupOppositeDirection","popupDirection","direction","TypeError","left","top","width","height","borderWitdth","popupRect","pinSize","pinOffset","bordersDelta","getPinLeftCoordinate","align","innerTop","innerLeft","getPinTopCoordinate","Error","pinHeight","Component","__KONTUR_REACT_UI__","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';\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<HTMLElement>;\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 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":["React","PropTypes","PopupHelper","styles","PopupDataTids","borderStyles","position","borderStyle","borderTopColor","borderBottomColor","borderLeftColor","borderRightColor","PopupPin","render","props","popupElement","options","getPinOptions","getElementAbsoluteRect","getPositionObject","popupPosition","size","offset","borderWidth","styleOuter","getOuterStyle","activeBorder","outerSize","borderColor","styleInner","getInnerStyle","backgroundColor","styleWrapper","getWrapperStyle","outerLeft","outerTop","popupPin","wrapper","getPopupOppositeDirection","popupDirection","direction","TypeError","left","top","width","height","borderWitdth","popupRect","pinSize","pinOffset","bordersDelta","getPinLeftCoordinate","align","innerTop","innerLeft","getPinTopCoordinate","Error","pinHeight","Component","__KONTUR_REACT_UI__","displayName","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 public static displayName = '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/internal/Popup/PopupPin.d.ts CHANGED Viewed

@@ -6,12 +6,13 @@ interface Props {
     borderColor: string;
     borderWidth: number;
     offset: number;
-    popupElement: Nullable<HTMLElement>;
+    popupElement: Nullable<Element>;
     popupPosition: string;
     size: number;
 }
 export declare class PopupPin extends React.Component<Props> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static propTypes: {
         /**
          * Цвет фон пина
@@ -34,7 +35,7 @@ export declare class PopupPin extends React.Component<Props> {
          */
         popupElement: PropTypes.Requireable<any>;
         /**
-         * Позиция поапа, по которой будет вычеслено положение пина
+         * Позиция попапа, по которой будет вычислено положение пина
          */
         popupPosition: PropTypes.Requireable<string>;
         /**

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

@@ -4,19 +4,28 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 var _class, _class2, _temp;
 import React from 'react';
+import { globalObject } from '@skbkontur/global-object';
+import { getRandomID } from "../../../lib/utils";
 import { isKeyArrowVertical, isKeyEnter, isKeyEscape, isKeySpace, someKeys } from "../../../lib/events/keyboard/identifiers";
-import { InternalMenu } from "../../InternalMenu";
-import { Popup } from "../../Popup";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+import { Popup, PopupIds } from "../../Popup";
 import { RenderLayer } from "../../RenderLayer";
-import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { CommonWrapper } from "../../CommonWrapper";
 import { responsiveLayout } from "../../../components/ResponsiveLayout/decorator";
 import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { Menu } from "../../Menu";
 import { isValidPositions } from "../validatePositions";
 import { styles } from "../PopupMenu.styles";
 export var PopupMenuType = {
   Dropdown: 'dropdown',
   Tooltip: 'tooltip'
 };
+export var PopupMenuDataTids = {
+  root: 'PopupMenu__root',
+  caption: 'PopupMenu__caption'
+};
 var Positions = ['top left', 'top center', 'top right', 'right top', 'right middle', 'right bottom', 'bottom left', 'bottom center', 'bottom right', 'left top', 'left middle', 'left bottom'];
 export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(PopupMenu, _React$Component);
@@ -29,6 +38,8 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
     }
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.rootId = PopupIds.root + getRandomID();
+    _this.getProps = createPropsGetter(PopupMenu.defaultProps);
     _this.state = {
       menuVisible: false,
       firstItemShouldBeSelected: false
@@ -55,6 +66,21 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
       }
     };
+    _this.passPropsToCaption = function (caption) {
+      var _this$props$popupMenu;
+      if (typeof caption === 'string' || typeof caption === 'number') {
+        return caption;
+      }
+      return /*#__PURE__*/React.cloneElement(caption, {
+        id: _this.props.id,
+        '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({
@@ -65,23 +91,23 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
         });
         return /*#__PURE__*/React.createElement("span", {
-          "data-tid": "PopupMenu__caption",
+          "data-tid": PopupMenuDataTids.caption,
           className: styles.caption(),
           ref: function ref(element) {
             return _this.captionWrapper = element;
           }
-        }, caption);
+        }, _this.passPropsToCaption(caption));
       }
       return /*#__PURE__*/React.createElement("span", {
-        "data-tid": "PopupMenu__caption",
+        "data-tid": PopupMenuDataTids.caption,
         onClick: _this.handleCaptionClick,
         onKeyDown: _this.handleCaptionKeyDown,
         ref: function ref(element) {
           return _this.captionWrapper = element;
         },
         className: styles.caption()
-      }, _this.props.caption);
+      }, _this.passPropsToCaption(_this.props.caption));
     };
     _this.hideMenuWithoutFocusing = function () {
@@ -133,8 +159,8 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
     };
     _this.saveFocus = function () {
-      if (document) {
-        _this.savedFocusableElement = document.activeElement;
+      if (globalObject.document) {
+        _this.savedFocusableElement = globalObject.document.activeElement;
       }
     };
@@ -184,6 +210,24 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
   var _proto = PopupMenu.prototype;
   _proto.render = function render() {
+    var _this2 = this;
+    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+      return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+        value: 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.createElement(CommonWrapper, _extends({
       rootNodeRef: this.setRootNode
     }, this.props), /*#__PURE__*/React.createElement(RenderLayer, {
@@ -191,27 +235,30 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
       onFocusOutside: this.hideMenuWithoutFocusing,
       active: this.state.menuVisible
     }, /*#__PURE__*/React.createElement("div", {
+      "data-tid": PopupMenuDataTids.root,
       className: styles.container(),
       style: {
         width: this.props.width
       }
     }, this.renderCaption(), this.captionWrapper && this.props.children && /*#__PURE__*/React.createElement(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: this.props.popupHasPin,
+      hasPin: popupHasPin,
       pinOffset: this.props.popupPinOffset,
       positions: this.getPositions(),
-      disableAnimations: this.props.disableAnimations,
+      disableAnimations: disableAnimations,
       onOpen: this.handleOpen,
       mobileOnCloseRequest: this.hideMenu,
       width: this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto'
-    }, /*#__PURE__*/React.createElement(InternalMenu, {
+    }, /*#__PURE__*/React.createElement(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,
@@ -221,15 +268,17 @@ export var PopupMenu = rootNode(_class = responsiveLayout(_class = (_temp = _cla
   };
   _proto.getPositions = function getPositions() {
-    if (this.props.positions && isValidPositions(this.props.positions)) {
-      return this.props.positions;
+    var positions = this.getProps().positions;
+    if (positions && isValidPositions(positions)) {
+      return positions;
     }
     return Positions;
   };
   return PopupMenu;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'PopupMenu', _class2.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'PopupMenu', _class2.displayName = 'PopupMenu', _class2.defaultProps = {
   positions: Positions,
   type: PopupMenuType.Tooltip,
   popupHasPin: true,

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["PopupMenu.tsx"],"names":["React","isKeyArrowVertical","isKeyEnter","isKeyEscape","isKeySpace","someKeys","InternalMenu","Popup","RenderLayer","CommonWrapper","responsiveLayout","rootNode","isValidPositions","styles","PopupMenuType","Dropdown","Tooltip","Positions","PopupMenu","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","renderCaption","props","caption","opened","openMenu","closeMenu","toggleMenu","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onOpen","onClose","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","setRootNode","container","width","children","popupMargin","popupHasPin","popupPinOffset","getPositions","disableAnimations","isMobileLayout","menuWidth","menuMaxHeight","header","footer","positions","Component","__KONTUR_REACT_UI__","defaultProps","Type"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport {\n isKeyArrowVertical,\n isKeyEnter,\n isKeyEscape,\n isKeySpace,\n someKeys,\n} from '../../lib/events/keyboard/identifiers';\nimport { InternalMenu } from '../InternalMenu';\nimport { Popup, 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';\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};\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\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 = {\n positions: Positions,\n type: PopupMenuType.Tooltip,\n popupHasPin: true,\n disableAnimations: false,\n };\n\n public static Type = PopupMenuType;\n\n public state = {\n menuVisible: false,\n firstItemShouldBeSelected: false,\n };\n\n private captionWrapper: HTMLSpanElement \| null = null;\n private savedFocusableElement: HTMLElement \| null = null;\n private menu: Nullable<InternalMenu> = null;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <RenderLayer\n onClickOutside={this.hideMenuWithoutFocusing}\n onFocusOutside={this.hideMenuWithoutFocusing}\n active={this.state.menuVisible}\n >\n <div className={styles.container()} style={{ width: this.props.width }}>\n {this.renderCaption()}\n {this.captionWrapper && this.props.children && (\n <Popup\n anchorElement={this.captionWrapper}\n opened={this.state.menuVisible}\n hasShadow\n margin={this.props.popupMargin}\n hasPin={this.props.popupHasPin}\n pinOffset={this.props.popupPinOffset}\n positions={this.getPositions()}\n disableAnimations={this.props.disableAnimations}\n onOpen={this.handleOpen}\n mobileOnCloseRequest={this.hideMenu}\n width={this.isMobileLayout ? 'auto' : this.props.menuWidth \|\| 'auto'}\n >\n <InternalMenu\n hasShadow={false}\n maxHeight={this.isMobileLayout ? 'none' : this.props.menuMaxHeight \|\| 'none'}\n onKeyDown={this.handleKeyDown}\n onItemClick={this.handleItemSelection}\n cyclicSelection={false}\n ref={this.refInternalMenu}\n initialSelectedItemIndex={this.state.firstItemShouldBeSelected ? 0 : -1}\n header={this.props.header}\n footer={this.props.footer}\n >\n {this.props.children}\n </InternalMenu>\n </Popup>\n )}\n </div>\n </RenderLayer>\n </CommonWrapper>\n );\n }\n\n public open = (): void => this.showMenu();\n public close = (): void => this.hideMenu();\n\n private refInternalMenu = (element: Nullable<InternalMenu>) => (this.menu = element);\n\n private handleOpen = () => {\n if (this.menu) {\n this.menu.focus();\n }\n };\n\n private renderCaption = () => {\n if (typeof this.props.caption === 'function') {\n const caption = this.props.caption({\n opened: this.state.menuVisible,\n openMenu: this.showMenu,\n closeMenu: this.hideMenu,\n toggleMenu: this.toggleMenu,\n });\n\n return (\n <span\n data-tid=\"PopupMenu__caption\"\n className={styles.caption()}\n ref={(element) => (this.captionWrapper = element)}\n >\n {caption}\n </span>\n );\n }\n\n return (\n <span\n data-tid=\"PopupMenu__caption\"\n onClick={this.handleCaptionClick}\n onKeyDown={this.handleCaptionKeyDown}\n ref={(element) => (this.captionWrapper = element)}\n className={styles.caption()}\n >\n {this.props.caption}\n </span>\n );\n };\n\n private hideMenuWithoutFocusing = () => this.hideMenu();\n\n private getPositions(): Readonly<PopupPositionsType[]> {\n if (this.props.positions && isValidPositions(this.props.positions)) {\n return this.props.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":["React","globalObject","getRandomID","isKeyArrowVertical","isKeyEnter","isKeyEscape","isKeySpace","someKeys","ThemeContext","ThemeFactory","Popup","PopupIds","RenderLayer","CommonWrapper","responsiveLayout","rootNode","createPropsGetter","Menu","isValidPositions","styles","PopupMenuType","Dropdown","Tooltip","PopupMenuDataTids","root","caption","Positions","PopupMenu","rootId","getProps","defaultProps","state","menuVisible","firstItemShouldBeSelected","captionWrapper","savedFocusableElement","menu","open","showMenu","close","hideMenu","refInternalMenu","element","handleOpen","focus","passPropsToCaption","cloneElement","id","props","popupMenuId","renderCaption","opened","openMenu","closeMenu","toggleMenu","handleCaptionClick","handleCaptionKeyDown","hideMenuWithoutFocusing","saveFocus","setState","handleChangeMenuVisible","restoreFocus","e","preventDefault","handleKeyDown","document","activeElement","focusShouldBeRestored","onOpen","onClose","onChangeMenuState","handleItemSelection","event","isDefaultPrevented","type","render","theme","create","menuOffsetY","popupMenuMenuOffsetY","renderMain","popupHasPin","disableAnimations","setRootNode","container","width","children","popupMargin","popupPinOffset","getPositions","isMobileLayout","menuWidth","menuMaxHeight","preventIconsOffset","header","footer","positions","Component","__KONTUR_REACT_UI__","displayName","Type"],"mappings":"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","sourcesContent":["import React, { AriaAttributes, HTMLAttributes } 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 '../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<HTMLAttributes<HTMLElement>, 'id'>,\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 public static displayName = '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 id: this.props.id,\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/internal/PopupMenu/PopupMenu.d.ts CHANGED Viewed

@@ -1,13 +1,15 @@
-import React from 'react';
+import React, { AriaAttributes, HTMLAttributes } from 'react';
+import { HTMLProps } from '../../typings/html';
 import { PopupPositionsType } from '../Popup';
-import { CommonProps } from '../../internal/CommonWrapper';
+import { CommonProps } from '../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<HTMLAttributes<HTMLElement>, 'id'>, Pick<AriaAttributes, 'aria-label'> {
     children?: React.ReactNode;
     /** Максимальная высота меню */
     menuMaxHeight?: number | string;
@@ -33,32 +35,41 @@ export interface PopupMenuProps extends CommonProps {
     popupMargin?: number;
     popupPinOffset?: number;
     type?: 'dropdown' | 'tooltip';
-    disableAnimations: boolean;
+    disableAnimations?: boolean;
     /** Действие при открытии меню */
     onOpen?: () => void;
     /** Действие при закрытии меню */
     onClose?: () => void;
+    /**
+     * Позволяет задать `id` выпадающему меню.
+     *
+     * Это может пригодиться при реализации a11y. Например, для того, чтобы связать `aria-controls` с выпадающим меню.
+     */
+    popupMenuId?: HTMLProps['id'];
 }
 interface PopupMenuState {
     menuVisible: boolean;
     firstItemShouldBeSelected?: boolean;
 }
 export declare const PopupMenuType: {
-    Dropdown: string;
-    Tooltip: string;
+    readonly Dropdown: "dropdown";
+    readonly Tooltip: "tooltip";
 };
+export declare const PopupMenuDataTids: {
+    readonly root: "PopupMenu__root";
+    readonly caption: "PopupMenu__caption";
+};
+declare type DefaultProps = Required<Pick<PopupMenuProps, 'positions' | 'type' | 'popupHasPin' | 'disableAnimations'>>;
 export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     private isMobileLayout;
-    static defaultProps: {
-        positions: ("top left" | "top center" | "top right" | "right top" | "right middle" | "right bottom" | "bottom right" | "bottom center" | "bottom left" | "left bottom" | "left middle" | "left top")[];
-        type: string;
-        popupHasPin: boolean;
-        disableAnimations: boolean;
-    };
+    private rootId;
+    static defaultProps: DefaultProps;
+    private getProps;
     static Type: {
-        Dropdown: string;
-        Tooltip: string;
+        readonly Dropdown: "dropdown";
+        readonly Tooltip: "tooltip";
     };
     state: {
         menuVisible: boolean;
@@ -69,10 +80,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/internal/RenderContainer/RenderContainer/RenderContainer.js CHANGED Viewed

@@ -1,25 +1,26 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
-import { canUseDOM, isBrowser } from "../../../lib/client";
+import { globalObject } from '@skbkontur/global-object';
 import { getRandomID } from "../../../lib/utils";
 import { Upgrade } from "../../../lib/Upgrades";
 import { callChildRef } from "../../../lib/callChildRef/callChildRef";
 import { RenderInnerContainer } from "../RenderInnerContainer";
+export var PORTAL_INLET_ATTR = 'data-render-container-id';
+export var PORTAL_OUTLET_ATTR = 'data-rendered-container-id';
 export var RenderContainer = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(RenderContainer, _React$Component);
-  function RenderContainer(props) {
+  function RenderContainer() {
     var _this;
-    _this = _React$Component.call(this, props) || this;
-    _this.domContainer = null;
-    _this.rootId = RenderContainer.getRootId();
-    if (isBrowser && props.children) {
-      _this.mountContainer();
+    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.rootId = RenderContainer.getRootId();
     return _this;
   }
@@ -42,6 +43,10 @@ export var RenderContainer = /*#__PURE__*/function (_React$Component) {
   };
   _proto.render = function render() {
+    if (this.props.children) {
+      this.mountContainer();
+    }
     return /*#__PURE__*/React.createElement(RenderInnerContainer, _extends({}, this.props, {
       domContainer: this.domContainer,
       rootId: this.rootId
@@ -49,28 +54,35 @@ export var RenderContainer = /*#__PURE__*/function (_React$Component) {
   };
   _proto.createContainer = function createContainer() {
-    if (canUseDOM) {
-      var domContainer = document.createElement('div');
+    var _globalObject$documen;
+    var domContainer = (_globalObject$documen = globalObject.document) == null ? void 0 : _globalObject$documen.createElement('div');
+    if (domContainer) {
       domContainer.setAttribute('class', Upgrade.getSpecificityClassName());
-      domContainer.setAttribute('data-rendered-container-id', "" + this.rootId);
+      domContainer.setAttribute(PORTAL_OUTLET_ATTR, "" + this.rootId);
       this.domContainer = domContainer;
     }
   };
   _proto.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.document) == null ? void 0 : _globalObject$documen2.body)) {
+      var _globalObject$documen3;
+      (_globalObject$documen3 = globalObject.document) == null ? void 0 : _globalObject$documen3.body.appendChild(this.domContainer);
       if (this.props.containerRef) {
         callChildRef(this.props.containerRef, this.domContainer);
       }
-      if (window.ReactTesting) {
-        window.ReactTesting.addRenderContainer(this.rootId, this);
+      if (globalObject.ReactTesting) {
+        globalObject.ReactTesting.addRenderContainer(this.rootId, this);
       }
     }
   };
@@ -90,8 +102,8 @@ export var RenderContainer = /*#__PURE__*/function (_React$Component) {
         callChildRef(this.props.containerRef, null);
       }
-      if (window.ReactTesting) {
-        window.ReactTesting.removeRenderContainer(this.rootId);
+      if (globalObject.ReactTesting) {
+        globalObject.ReactTesting.removeRenderContainer(this.rootId);
       }
     }
   };
@@ -99,6 +111,7 @@ export var RenderContainer = /*#__PURE__*/function (_React$Component) {
   return RenderContainer;
 }(React.Component);
 RenderContainer.__KONTUR_REACT_UI__ = 'RenderContainer';
+RenderContainer.displayName = 'RenderContainer';
 RenderContainer.getRootId = function () {
   return getRandomID();

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["RenderContainer.tsx"],"names":["React","~~canUseDOM~~","~~isBrowser","~~getRandomID","Upgrade","callChildRef","RenderInnerContainer","~~RenderContainer~~","~~props~~","domContainer","rootId","getRootId","~~children~~","~~mountContainer~~","~~shouldComponentUpdate~~","~~nextProps~~","unmountContainer","componentWillUnmount","destroyContainer","render","createContainer","document","createElement","setAttribute","getSpecificityClassName","parentNode","body","appendChild","containerRef","~~window","~~ReactTesting","addRenderContainer","removeChild","removeRenderContainer","Component","__KONTUR_REACT_UI__"],"mappings":"gIAAA,OAAOA,KAAP,MAAkB,OAAlB~~;;AAEA~~,SAASC,~~SAAT~~,~~EAAoBC~~,~~SAApB~~,~~QAAqC,kBAArC;;AAEA,~~SAASC,WAAT,QAA4B,iBAA5B;AACA,SAASC,OAAT,QAAwB,oBAAxB;AACA,SAASC,YAAT,QAA6B,qCAA7B;;AAEA,SAASC,oBAAT,QAAqC,wBAArC;;;AAGA,~~WAAaC~~,~~eAAb;;;;;;;;AAQE~~,~~2BAAYC~~,~~KAAZ~~,~~EAAyC~~;~~AACvC~~,~~wCAAMA~~,~~KAAN~~,~~UADuC~~,~~MAJjCC~~,~~YAIiC~~,~~GAJK~~,~~IAIL~~,~~OAFxBC~~,~~MAEwB~~,~~GAFPH~~,~~eAAe,CAACI,SAAhB,EAEO~~;;~~AAGvC~~,~~QAAIT~~,~~SAAS~~,~~IAAIM~~,~~KAAK~~,~~CAACI~~,~~QAAvB~~,~~EAAiC;AAC/B,YAAKC,cAAL;AACD,KALsC;AAMxC,GAdH~~;;~~AAgBSC~~,EAAAA,~~qBAhBT~~,~~GAgBE~~,+BAA6BC,SAA7B,EAA8D;AAC5D,QAAI,CAAC,~~KAAKP~~,KAAL,~~CAAWI~~,QAAZ,~~IAAwBG~~,SAAS,~~CAACH~~,QAAtC,EAAgD;AAC9C,WAAKC,cAAL;AACD;AACD,QAAI,~~KAAKL~~,KAAL,~~CAAWI~~,QAAX,IAAuB,~~CAACG~~,SAAS,~~CAACH~~,QAAtC,EAAgD;AAC9C,~~WAAKI~~,gBAAL;AACD;AACD,WAAO,IAAP;AACD,~~GAxBH~~;;~~AA0BSC~~,EAAAA,~~oBA1BT~~,~~GA0BE~~,gCAA8B;AAC5B,SAAKC,gBAAL;AACD,~~GA5BH~~;;~~AA8BSC~~,EAAAA,~~MA9BT~~,~~GA8BE~~,kBAAgB;AACd,wBAAO,oBAAC,oBAAD,eAA0B,~~KAAKX~~,KAA/B,IAAsC,YAAY,EAAE,~~KAAKC~~,YAAzD,EAAuE,MAAM,EAAE,KAAKC,MAApF,IAAP;AACD,~~GAhCH~~;;~~AAkCUU~~,EAAAA,~~eAlCV~~,~~GAkCE~~,2BAA0B;AACxB,~~QAAInB~~,~~SAAJ~~,~~EAAe;AACb~~,~~UAAMQ,~~YAAY,~~GAAGY~~,~~QAAQ~~,~~CAACC~~,~~aAAT~~,~~CAAuB~~,~~KAAvB~~,CAArB;~~AACAb~~,MAAAA,YAAY,~~CAACc~~,YAAb,CAA0B,OAA1B,~~EAAmCnB~~,OAAO,~~CAACoB~~,uBAAR,EAAnC;~~AACAf~~,MAAAA,YAAY,~~CAACc~~,YAAb,~~CAA0B~~,~~4BAA1B~~,~~OAA2D~~,~~KAAKb~~,~~MAAhE~~;AACA,WAAKD,YAAL,GAAoBA,YAApB;AACD;AACF,~~GAzCH~~;;~~AA2CUI~~,EAAAA,~~cA3CV~~,~~GA2CE~~,0BAAyB;AACvB,QAAI,CAAC,~~KAAKJ~~,YAAV,EAAwB;AACtB,~~WAAKW~~,eAAL;AACD;AACD,QAAI,~~KAAKX~~,YAAL,IAAqB,KAAKA,YAAL,~~CAAkBgB~~,UAAlB,~~KAAiCJ~~,~~QAAQ~~,~~CAACK~~,~~IAAnE~~,~~EAAyE~~;~~AACvEL~~,~~MAAAA~~,~~QAAQ~~,~~CAACK~~,~~IAAT~~,~~CAAcC~~,~~WAAd~~,~~CAA0B~~,~~KAAKlB~~,~~YAA/B~~;;AAEA,UAAI,~~KAAKD~~,KAAL,~~CAAWoB~~,YAAf,EAA6B;~~AAC3BvB~~,QAAAA,YAAY,CAAC,~~KAAKG~~,KAAL,~~CAAWoB~~,YAAZ,EAA0B,~~KAAKnB~~,YAA/B,CAAZ;AACD;AACD,~~UAAIoB~~,~~MAAM~~,~~CAACC~~,~~YAAX~~,~~EAAyB~~;~~AACvBD~~,QAAAA,~~MAAM~~,~~CAACC~~,~~YAAP~~,~~CAAoBC~~,~~kBAApB~~,~~CAAuC~~,KAAKrB,~~MAA5C~~,~~EAAoD~~,~~IAApD~~;AACD;AACF;AACF,~~GAzDH~~;;~~AA2DUQ~~,EAAAA,~~gBA3DV~~,~~GA2DE~~,4BAA2B;AACzB,QAAI,~~KAAKT~~,YAAT,EAAuB;AACrB,~~WAAKO~~,gBAAL;AACA,~~WAAKP~~,YAAL,GAAoB,IAApB;AACD;AACF,~~GAhEH~~;;~~AAkEUO~~,EAAAA,~~gBAlEV~~,~~GAkEE~~,4BAA2B;AACzB,QAAI,~~KAAKP~~,YAAL,IAAqB,KAAKA,YAAL,~~CAAkBgB~~,UAA3C,EAAuD;AACrD,~~WAAKhB~~,YAAL,~~CAAkBgB~~,UAAlB,~~CAA6BO~~,WAA7B,CAAyC,KAAKvB,YAA9C;;AAEA,UAAI,~~KAAKD~~,KAAL,~~CAAWoB~~,YAAf,EAA6B;~~AAC3BvB~~,QAAAA,YAAY,CAAC,~~KAAKG~~,KAAL,~~CAAWoB~~,YAAZ,EAA0B,IAA1B,CAAZ;AACD;;AAED,~~UAAIC~~,~~MAAM~~,~~CAACC~~,~~YAAX~~,~~EAAyB~~;~~AACvBD~~,QAAAA,~~MAAM~~,~~CAACC~~,~~YAAP~~,~~CAAoBG~~,~~qBAApB~~,~~CAA0C~~,KAAKvB,~~MAA/C~~;AACD;AACF;AACF,~~GA9EH~~,0BAAqCV,KAAK,CAACkC,SAA3C,~~EAAa3B~~,e,~~CACG4B~~,mB,GAAsB,iB,~~CADzB5B~~,e,~~CAGII~~,S,GAAY,~~oBAAMR~~,WAAW,EAAjB,E","sourcesContent":["import React from 'react';\n\nimport { ~~canUseDOM,~~ ~~isBrowser~~ } from '~~../../lib~~/~~client~~';\nimport { Nullable } from '../../typings/utility-types';\nimport { getRandomID } from '../../lib/utils';\nimport { Upgrade } from '../../lib/Upgrades';\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":["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.d.ts CHANGED Viewed

@@ -1,11 +1,13 @@
 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;
-    constructor(props: RenderContainerProps);
     shouldComponentUpdate(nextProps: RenderContainerProps): boolean;
     componentWillUnmount(): void;
     render(): JSX.Element;