npm - @skbkontur/react-ui - Versions diffs - 0.0.0-5a76463ffc → 0.0.0-69a6fa606f - Mend

@skbkontur/react-ui 0.0.0-5a76463ffc → 0.0.0-69a6fa606f

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

package/internal/Popup/PopupHelper.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { PopupPosition } from './Popup';
+import { PopupPositionsType } from './Popup';
 export interface Rect {
     top: number;
     left: number;
@@ -16,7 +16,7 @@ export interface PositionObject {
 declare function getPositionObject(position: string): PositionObject;
 declare function getElementAbsoluteRect(element: HTMLElement): Rect;
 declare function isAbsoluteRectFullyVisible(coordinates: Offset, popupRect: Rect): boolean;
-declare function canBecomeFullyVisible(positionName: PopupPosition, coordinates: Offset): boolean;
+declare function canBecomeFullyVisible(positionName: PopupPositionsType, coordinates: Offset): boolean;
 export declare const PopupHelper: {
     getPositionObject: typeof getPositionObject;
     getElementAbsoluteRect: typeof getElementAbsoluteRect;

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

@@ -3,7 +3,8 @@ import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
 import React from 'react';
 import PropTypes from 'prop-types';
 import { PopupHelper } from "../PopupHelper";
-import { jsStyles } from "../PopupPin.styles";
+import { styles } from "../PopupPin.styles";
+import { PopupDataTids } from "../Popup";
 var borderStyles = {
   position: 'absolute',
   borderStyle: 'solid',
@@ -31,7 +32,8 @@ export var PopupPin = /*#__PURE__*/function (_React$Component) {
     var styleInner = this.getInnerStyle(options.activeBorder, this.props.size, this.props.backgroundColor);
     var styleWrapper = this.getWrapperStyle(options.outerLeft, options.outerTop, options.outerSize);
     return /*#__PURE__*/React.createElement("div", {
-      className: jsStyles.wrapper(),
+      "data-tid": PopupDataTids.popupPin,
+      className: styles.wrapper(),
       style: styleWrapper
     }, /*#__PURE__*/React.createElement("div", {
       style: styleOuter
@@ -204,40 +206,40 @@ export var PopupPin = /*#__PURE__*/function (_React$Component) {
 }(React.Component);
 PopupPin.__KONTUR_REACT_UI__ = 'PopupPin';
 PopupPin.propTypes = {
-  /**
-  * Цвет фон пина
+  /**
+  * Цвет фон пина
   */
   backgroundColor: PropTypes.string,
-  /**
-  * Цвет границы пина
+  /**
+  * Цвет границы пина
   */
   borderColor: PropTypes.string,
-  /**
-  * Ширина границы пина
+  /**
+  * Ширина границы пина
   */
   borderWidth: PropTypes.number,
-  /**
-  * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
+  /**
+  * Смещение пина от края попапа. Край задаётся в пропе position вторым словом
   */
   offset: PropTypes.number,
-  /**
-  * Ссылка на попап
+  /**
+  * Ссылка на попап
   */
   popupElement: PropTypes.any,
-  /**
-  * Позиция поапа, по которой будет вычеслено положение пина
+  /**
+  * Позиция поапа, по которой будет вычеслено положение пина
   */
   popupPosition: PropTypes.string,
-  /**
-  * Сторона пина без учёта границы.
-  * Пин представляет собой равносторонний треугольник, высота от попапа
-  * до "носика" пина будет соответствовать формуле (size* √3)/2
+  /**
+  * Сторона пина без учёта границы.
+  * Пин представляет собой равносторонний треугольник, высота от попапа
+  * до "носика" пина будет соответствовать формуле (size* √3)/2
   */
   size: PropTypes.number
 };

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

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

@@ -1,19 +1,10 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      overflow: hidden;\n      position: absolute;\n      pointer-events: none;\n    "]);
-  _templateObject = function _templateObject() {
-    return data;
-  };
-  return data;
-}
+var _templateObject;
 import { css, memoizeStyle } from "../../../lib/theming/Emotion";
-var styles = {
+export var styles = memoizeStyle({
   wrapper: function wrapper() {
-    return css(_templateObject());
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      overflow: hidden;\n      position: absolute;\n      pointer-events: none;\n    "])));
   }
-};
-export var jsStyles = memoizeStyle(styles);
+});

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["PopupPin.styles.ts"],"names":["css","memoizeStyle","styles","wrapper"~~,"jsStyles"~~],"mappings":"~~yUAAA~~,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,IAAMC,MAAM,~~GAAG~~;~~AACbC~~,EAAAA,~~OADa~~,~~qBACH~~;AACR,WAAOH,GAAP;;;;;AAKD,~~GAPY~~,~~EAAf;;;AAUA~~,~~OAAO,IAAMI,QAAQ,GAAGH,YAAY,CAACC,MAAD,CAA7B~~","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\n\~~r\nconst~~ styles = {\r\n wrapper() {\r\n return css`\r\n overflow: hidden;\r\n position: absolute;\r\n pointer-events: none;\r\n `;\r\n },\r\n}~~;\r\n\r\nexport const jsStyles = memoizeStyle(styles~~);\r\n"]}
1	+ {"version":3,"sources":["PopupPin.styles.ts"],"names":["css","memoizeStyle","styles","wrapper"],"mappings":"oHAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,OADiC,qBACvB;AACR,WAAOH,GAAP;;;;;AAKD,GAPgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n wrapper() {\n return css`\n overflow: hidden;\n position: absolute;\n pointer-events: none;\n `;\n },\n});\n"]}

package/internal/Popup/PopupPin.styles.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
-export declare const jsStyles: {
+export declare const styles: {
     wrapper(): string;
 };

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

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

package/internal/Popup/types/package.json ADDED Viewed

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

package/internal/Popup/types/types.js ADDED Viewed

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

package/internal/Popup/types/types.js.map ADDED Viewed

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

package/internal/Popup/types.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import { PopupPositionsType as Type } from './Popup';
2	+ export declare type PopupPositionsType = Type;

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

@@ -1,18 +1,28 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+var _class, _class2, _temp;
 import React from 'react';
 import { isKeyArrowVertical, isKeyEnter, isKeyEscape, isKeySpace, someKeys } from "../../../lib/events/keyboard/identifiers";
 import { InternalMenu } from "../../InternalMenu";
 import { Popup } from "../../Popup";
 import { RenderLayer } from "../../RenderLayer";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { PopupMenuPositions } from "../PopupMenuPositions";
+import { responsiveLayout } from "../../../components/ResponsiveLayout/decorator";
+import { rootNode } from "../../../lib/rootNode";
 import { isValidPositions } from "../validatePositions";
-import { jsStyles } from "../PopupMenu.styles";
+import { styles } from "../PopupMenu.styles";
 export var PopupMenuType = {
   Dropdown: 'dropdown',
   Tooltip: 'tooltip'
 };
-export var PopupMenu = /*#__PURE__*/function (_React$Component) {
+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);
   function PopupMenu() {
@@ -59,8 +69,8 @@ export var PopupMenu = /*#__PURE__*/function (_React$Component) {
         });
         return /*#__PURE__*/React.createElement("span", {
-          "data-tid": "PopupMenu__caption",
-          className: jsStyles.caption(),
+          "data-tid": PopupMenuDataTids.caption,
+          className: styles.caption(),
           ref: function ref(element) {
             return _this.captionWrapper = element;
           }
@@ -68,13 +78,13 @@ export var PopupMenu = /*#__PURE__*/function (_React$Component) {
       }
       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: jsStyles.caption()
+        className: styles.caption()
       }, _this.props.caption);
     };
@@ -145,6 +155,14 @@ export var PopupMenu = /*#__PURE__*/function (_React$Component) {
         _this.restoreFocus();
       }
+      if (_this.state.menuVisible && _this.props.onOpen) {
+        _this.props.onOpen();
+      }
+      if (!_this.state.menuVisible && _this.props.onClose) {
+        _this.props.onClose();
+      }
       if (typeof _this.props.onChangeMenuState === 'function') {
         _this.props.onChangeMenuState(_this.state.menuVisible, focusShouldBeRestored);
       }
@@ -170,12 +188,18 @@ export var PopupMenu = /*#__PURE__*/function (_React$Component) {
   var _proto = PopupMenu.prototype;
   _proto.render = function render() {
-    return /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement(RenderLayer, {
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), /*#__PURE__*/React.createElement(RenderLayer, {
       onClickOutside: this.hideMenuWithoutFocusing,
       onFocusOutside: this.hideMenuWithoutFocusing,
       active: this.state.menuVisible
     }, /*#__PURE__*/React.createElement("div", {
-      className: jsStyles.container()
+      "data-tid": PopupMenuDataTids.root,
+      className: styles.container(),
+      style: {
+        width: this.props.width
+      }
     }, this.renderCaption(), this.captionWrapper && this.props.children && /*#__PURE__*/React.createElement(Popup, {
       anchorElement: this.captionWrapper,
       opened: this.state.menuVisible,
@@ -185,12 +209,13 @@ export var PopupMenu = /*#__PURE__*/function (_React$Component) {
       pinOffset: this.props.popupPinOffset,
       positions: this.getPositions(),
       disableAnimations: this.props.disableAnimations,
-      onOpen: this.handleOpen
+      onOpen: this.handleOpen,
+      mobileOnCloseRequest: this.hideMenu,
+      width: this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto'
     }, /*#__PURE__*/React.createElement(InternalMenu, {
       hasShadow: false,
-      maxHeight: this.props.menuMaxHeight || 'none',
+      maxHeight: this.isMobileLayout ? 'none' : this.props.menuMaxHeight || 'none',
       onKeyDown: this.handleKeyDown,
-      width: this.props.menuWidth || 'auto',
       onItemClick: this.handleItemSelection,
       cyclicSelection: false,
       ref: this.refInternalMenu,
@@ -205,17 +230,13 @@ export var PopupMenu = /*#__PURE__*/function (_React$Component) {
       return this.props.positions;
     }
-    return PopupMenuPositions;
+    return Positions;
   };
   return PopupMenu;
-}(React.Component);
-PopupMenu.__KONTUR_REACT_UI__ = 'PopupMenu';
-PopupMenu.defaultProps = {
-  positions: PopupMenuPositions,
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'PopupMenu', _class2.defaultProps = {
+  positions: Positions,
   type: PopupMenuType.Tooltip,
   popupHasPin: true,
-  popupMargin: 0,
   disableAnimations: false
-};
-PopupMenu.Type = PopupMenuType;
+}, _class2.Type = PopupMenuType, _temp)) || _class) || _class;

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

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { PopupPosition } from '../Popup';
+import { PopupPositionsType } from '../Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
 export interface PopupMenuCaptionProps {
     opened: boolean;
@@ -13,6 +13,8 @@ export interface PopupMenuProps extends CommonProps {
     menuMaxHeight?: number | string;
     /** Ширина меню */
     menuWidth?: number | string;
+    /** Ширина контейнера и caption */
+    width?: React.CSSProperties['width'];
     /**
      * Элемент или функция возвращающая элемент,
      * если передана, используется вместо ```caption```,
@@ -23,7 +25,7 @@ export interface PopupMenuProps extends CommonProps {
     header?: React.ReactNode;
     footer?: React.ReactNode;
     /**  Массив разрешенных положений меню относительно caption'а. */
-    positions?: PopupPosition[];
+    positions?: PopupPositionsType[];
     /** Колбэк, вызываемый после открытия/закрытия меню */
     onChangeMenuState?: (isOpened: boolean, restoreFocus: boolean) => void;
     /** Пропсы, передающиеся в Popup */
@@ -32,6 +34,10 @@ export interface PopupMenuProps extends CommonProps {
     popupPinOffset?: number;
     type?: 'dropdown' | 'tooltip';
     disableAnimations: boolean;
+    /** Действие при открытии меню */
+    onOpen?: () => void;
+    /** Действие при закрытии меню */
+    onClose?: () => void;
 }
 interface PopupMenuState {
     menuVisible: boolean;
@@ -41,13 +47,17 @@ export declare const PopupMenuType: {
     Dropdown: string;
     Tooltip: string;
 };
+export declare const PopupMenuDataTids: {
+    readonly root: "PopupMenu_root";
+    readonly caption: "PopupMenu__caption";
+};
 export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenuState> {
     static __KONTUR_REACT_UI__: string;
+    private isMobileLayout;
     static defaultProps: {
-        positions: PopupPosition[];
+        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;
-        popupMargin: number;
         disableAnimations: boolean;
     };
     static Type: {
@@ -61,6 +71,7 @@ export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenu
     private captionWrapper;
     private savedFocusableElement;
     private menu;
+    private setRootNode;
     render(): JSX.Element;
     open: () => void;
     close: () => void;

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

@@ -1,32 +1,13 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n    "]);
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-  return data;
-}
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n    "]);
-  _templateObject = function _templateObject() {
-    return data;
-  };
-  return data;
-}
+var _templateObject, _templateObject2;
 import { css, memoizeStyle } from "../../../lib/theming/Emotion";
-var styles = {
+export var styles = memoizeStyle({
   caption: function caption() {
-    return css(_templateObject());
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      width: 100%;\n    "])));
   },
   container: function container() {
-    return css(_templateObject2());
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      line-height: normal;\n    "])));
   }
-};
-export var jsStyles = memoizeStyle(styles);
+});

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["PopupMenu.styles.ts"],"names":["css","memoizeStyle","styles","caption","container"~~,"jsStyles"~~],"mappings":"~~+cAAA~~,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,IAAMC,MAAM,~~GAAG~~;~~AACbC~~,EAAAA,~~OADa~~,~~qBACH~~;AACR,WAAOH,GAAP~~;;;AAGD~~,~~GALY~~;~~AAMbI~~,EAAAA,~~SANa~~,~~uBAMD~~;AACV,WAAOJ,GAAP~~;;;AAGD~~,~~GAVY~~,~~EAAf;;;AAaA~~,~~OAAO,IAAMK,QAAQ,GAAGJ,YAAY,CAACC,MAAD,CAA7B~~","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\n\~~r\nconst~~ styles = {\r\n caption() {\r\n return css`\r\n display: inline-block;\r\n `;\r\n },\r\n container() {\r\n return css`\r\n display: inline-block;\r\n `;\r\n },\r\n}~~;\r\n\r\nexport const jsStyles = memoizeStyle(styles~~);\r\n"]}
1	+ {"version":3,"sources":["PopupMenu.styles.ts"],"names":["css","memoizeStyle","styles","caption","container"],"mappings":"sIAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,OADiC,qBACvB;AACR,WAAOH,GAAP;;;;AAID,GANgC;AAOjCI,EAAAA,SAPiC,uBAOrB;AACV,WAAOJ,GAAP;;;;AAID,GAZgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n caption() {\n return css`\n display: inline-block;\n width: 100%;\n `;\n },\n container() {\n return css`\n display: inline-block;\n line-height: normal;\n `;\n },\n});\n"]}

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

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

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

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

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

@@ -1,20 +1,20 @@
 import { isProductionEnv } from "../../../lib/currentEnvironment";
-import { PopupMenuPositions } from "../PopupMenuPositions";
+import { PopupPositions } from "../../Popup";
 var isValidPosition = function isValidPosition(position) {
-  return PopupMenuPositions.includes(position);
+  return PopupPositions.includes(position);
 };
 export var isValidPositions = function isValidPositions(positions) {
   return positions.every(function (item) {
     if (isProductionEnv) {
       return isValidPosition(item);
-    } else {
-      if (isValidPosition(item)) {
-        return true;
-      } else {
-        throw new Error("Unxpected position \"" + item + "\"");
-      }
     }
+    if (isValidPosition(item)) {
+      return true;
+    }
+    throw new Error("Unxpected position \"" + item + "\"");
   });
 };

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

	@@ -1 +1 @@
1	- {"version":3,"sources":["validatePositions.~~tsx~~"],"names":["isProductionEnv","~~PopupMenuPositions~~","isValidPosition","position","includes","isValidPositions","positions","every","item","Error"],"mappings":"AAAA,SAASA,eAAT,QAAgC,8BAAhC~~;;;AAGA~~,~~SAASC~~,~~kBAAT~~,~~QAAmC~~,~~sBAAnC~~;;AAEA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACC,QAAD,~~EAAsC~~;~~AAC5D~~,SAAOF,~~kBAAkB~~,CAACG,~~QAAnB~~,~~CAA4BD~~,~~QAA5B~~,CAAP;AACD,CAFD;;AAIA,OAAO,IAAME,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,SAAD,~~EAAyC~~;~~AACvE~~,SAAOA,SAAS,CAACC,KAAV,CAAgB,~~UAAAC~~,~~IAAI~~,~~EAAI~~;~~AAC7B~~,QAAIR,eAAJ,EAAqB;AACnB,aAAOE,eAAe,CAACM,IAAD,CAAtB;AACD,~~KAFD~~,~~MAEO;AACL,UAAIN,~~eAAe,CAACM,IAAD,CAAnB,EAA2B;AACzB,~~eAAO~~,IAAP;AACD,~~OAFD~~,~~MAEO;AACL,cAAM,~~IAAIC,KAAJ,2BAAiCD,IAAjC,QAAN;AACD~~;AACF;AACF~~,GAVM,CAAP;AAWD,CAZM","sourcesContent":["import { isProductionEnv } from '../../lib/currentEnvironment';\r\nimport { ~~PopupPosition~~ } from '../Popup';\r\n\~~r\nimport { PopupMenuPositions } from './PopupMenuPositions';\r\n\r\~~nconst isValidPosition = (position: ~~PopupPosition~~): boolean => {\r\n return ~~PopupMenuPositions~~.includes(position);\r\n};\r\n\r\nexport const isValidPositions = (positions: ~~PopupPosition~~[]): boolean => {\r\n return positions.every(item => {\r\n if (isProductionEnv) {\r\n return isValidPosition(item);\r\n } ~~else {~~\r\n if (isValidPosition(item)) {\r\n return true;\r\n } ~~else {~~\r\n throw new Error(`Unxpected position \"${item}\"`);\r\n ~~}\r\n }\r\n~~ });\r\n};\r\n"]}
1	+ {"version":3,"sources":["validatePositions.ts"],"names":["isProductionEnv","PopupPositions","isValidPosition","position","includes","isValidPositions","positions","every","item","Error"],"mappings":"AAAA,SAASA,eAAT,QAAgC,8BAAhC;AACA,SAA6BC,cAA7B,QAAmD,UAAnD;;AAEA,IAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAACC,QAAD,EAA2C;AACjE,SAAOF,cAAc,CAACG,QAAf,CAAwBD,QAAxB,CAAP;AACD,CAFD;;AAIA,OAAO,IAAME,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,SAAD,EAA8C;AAC5E,SAAOA,SAAS,CAACC,KAAV,CAAgB,UAACC,IAAD,EAAU;AAC/B,QAAIR,eAAJ,EAAqB;AACnB,aAAOE,eAAe,CAACM,IAAD,CAAtB;AACD;;AAED,QAAIN,eAAe,CAACM,IAAD,CAAnB,EAA2B;AACzB,aAAO,IAAP;AACD;;AAED,UAAM,IAAIC,KAAJ,2BAAiCD,IAAjC,QAAN;AACD,GAVM,CAAP;AAWD,CAZM","sourcesContent":["import { isProductionEnv } from '../../lib/currentEnvironment';\nimport { PopupPositionsType, PopupPositions } from '../Popup';\n\nconst isValidPosition = (position: PopupPositionsType): boolean => {\n return PopupPositions.includes(position);\n};\n\nexport const isValidPositions = (positions: PopupPositionsType[]): boolean => {\n return positions.every((item) => {\n if (isProductionEnv) {\n return isValidPosition(item);\n }\n\n if (isValidPosition(item)) {\n return true;\n }\n\n throw new Error(`Unxpected position \"${item}\"`);\n });\n};\n"]}

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

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