npm - @skbkontur/react-ui - Versions diffs - 6.4.7-b33c6.0 → 6.5.0 - Mend

@skbkontur/react-ui 6.4.7-b33c6.0 → 6.5.0

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

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

@@ -0,0 +1,69 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        popup: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      position: absolute;\n      border-radius: ", ";\n      border: ", " ", ";\n      display: flex;\n      width: max-content;\n      overflow: visible;\n    "], ["\n      position: absolute;\n      border-radius: ", ";\n      border: ", " ", ";\n      display: flex;\n      width: max-content;\n      overflow: visible;\n    "])), t.popupBorderRadius, t.popupBorder, t.popupBorderColor);
+        },
+        popupIgnoreHover: function () {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      pointer-events: none;\n    "], ["\n      pointer-events: none;\n    "])));
+        },
+        hoverBridge: function () {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      position: absolute;\n      pointer-events: auto;\n    "], ["\n      position: absolute;\n      pointer-events: auto;\n    "])));
+        },
+        hoverBridgeTop: function () {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      left: 0;\n      right: 0;\n      bottom: 100%;\n      height: var(--popup-hover-bridge-size);\n    "], ["\n      left: 0;\n      right: 0;\n      bottom: 100%;\n      height: var(--popup-hover-bridge-size);\n    "])));
+        },
+        hoverBridgeBottom: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      left: 0;\n      right: 0;\n      top: 100%;\n      height: var(--popup-hover-bridge-size);\n    "], ["\n      left: 0;\n      right: 0;\n      top: 100%;\n      height: var(--popup-hover-bridge-size);\n    "])));
+        },
+        hoverBridgeLeft: function () {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      top: 0;\n      bottom: 0;\n      right: 100%;\n      width: var(--popup-hover-bridge-size);\n    "], ["\n      top: 0;\n      bottom: 0;\n      right: 100%;\n      width: var(--popup-hover-bridge-size);\n    "])));
+        },
+        hoverBridgeRight: function () {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      top: 0;\n      bottom: 0;\n      left: 100%;\n      width: var(--popup-hover-bridge-size);\n    "], ["\n      top: 0;\n      bottom: 0;\n      left: 100%;\n      width: var(--popup-hover-bridge-size);\n    "])));
+        },
+        content: function (t) {
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      overflow: hidden;\n      border-radius: ", ";\n      flex-shrink: 0;\n      max-width: 100%;\n      line-height: normal;\n    "], ["\n      overflow: hidden;\n      border-radius: ", ";\n      flex-shrink: 0;\n      max-width: 100%;\n      line-height: normal;\n    "])), t.popupBorderRadius);
+        },
+        contentInner: function (t) {
+            return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      color: ", ";\n      background: ", ";\n    "], ["\n      color: ", ";\n      background: ", ";\n    "])), t.popupTextColor, t.popupBackground);
+        },
+        shadow: function (t) {
+            return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      box-shadow: ", ";\n    "], ["\n      box-shadow: ", ";\n    "])), t.popupBoxShadow);
+        },
+        transitionEnter: function () {
+            return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      opacity: 0.01;\n    "], ["\n      opacity: 0.01;\n    "])));
+        },
+        'transition-enter-top': function () {
+            return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n      transform: translateY(10px);\n    "], ["\n      transform: translateY(10px);\n    "])));
+        },
+        'transition-enter-middle': function () {
+            return css(templateObject_13 || (templateObject_13 = __makeTemplateObject([""], [""])));
+        },
+        'transition-enter-bottom': function () {
+            return css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n      transform: translateY(-10px);\n    "], ["\n      transform: translateY(-10px);\n    "])));
+        },
+        'transition-enter-left': function () {
+            return css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n      transform: translateX(10px);\n    "], ["\n      transform: translateX(10px);\n    "])));
+        },
+        'transition-enter-right': function () {
+            return css(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n      transform: translateX(-10px);\n    "], ["\n      transform: translateX(-10px);\n    "])));
+        },
+        transitionEnterActive: function () {
+            return css(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n      transition:\n        transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n        opacity 0.18s cubic-bezier(0.22, 0.61, 0.36, 1);\n      opacity: 1;\n      transform: translate(0, 0);\n    "], ["\n      transition:\n        transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n        opacity 0.18s cubic-bezier(0.22, 0.61, 0.36, 1);\n      opacity: 1;\n      transform: translate(0, 0);\n    "])));
+        },
+        transitionExit: function () {
+            return css(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n      opacity: 0.01;\n      transition: opacity 0.15s ease-out;\n      transform: translate(0, 0);\n    "], ["\n      opacity: 0.01;\n      transition: opacity 0.15s ease-out;\n      transform: translate(0, 0);\n    "])));
+        },
+        absoluteParent: function () {
+            return css(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n      position: absolute;\n      text-align: initial;\n    "], ["\n      position: absolute;\n      text-align: initial;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;
+//# sourceMappingURL=Popup.styles.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"Popup.styles.js","sourceRoot":"","sources":["Popup.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,KAAK,YAAC,CAAQ;YACZ,OAAO,GAAG,uOAAA,oDAES,EAAmB,mBAC1B,EAAa,GAAI,EAAkB,oFAI9C,KALkB,CAAC,CAAC,iBAAiB,EAC1B,CAAC,CAAC,WAAW,EAAI,CAAC,CAAC,gBAAgB,EAI7C;QACJ,CAAC;QAED,gBAAgB;YACd,OAAO,GAAG,wGAAA,qCAET,KAAC;QACJ,CAAC;QAED,WAAW;YACT,OAAO,GAAG,mIAAA,gEAGT,KAAC;QACJ,CAAC;QAED,cAAc;YACZ,OAAO,GAAG,gLAAA,6GAKT,KAAC;QACJ,CAAC;QAED,iBAAiB;YACf,OAAO,GAAG,6KAAA,0GAKT,KAAC;QACJ,CAAC;QAED,eAAe;YACb,OAAO,GAAG,8KAAA,2GAKT,KAAC;QACJ,CAAC;QAED,gBAAgB;YACd,OAAO,GAAG,6KAAA,0GAKT,KAAC;QACJ,CAAC;QAED,OAAO,YAAC,CAAQ;YACd,OAAO,GAAG,2MAAA,kDAES,EAAmB,oFAIrC,KAJkB,CAAC,CAAC,iBAAiB,EAIpC;QACJ,CAAC;QAED,YAAY,YAAC,CAAQ;YACnB,OAAO,GAAG,wHAAA,iBACC,EAAgB,uBACX,EAAiB,SAChC,KAFU,CAAC,CAAC,cAAc,EACX,CAAC,CAAC,eAAe,EAC/B;QACJ,CAAC;QAED,MAAM,YAAC,CAAQ;YACb,OAAO,GAAG,sGAAA,sBACM,EAAgB,SAC/B,KADe,CAAC,CAAC,cAAc,EAC9B;QACJ,CAAC;QAED,eAAe;YACb,OAAO,GAAG,mGAAA,8BAET,KAAC;QACJ,CAAC;QACD,sBAAsB;YACpB,OAAO,GAAG,iHAAA,4CAET,KAAC;QACJ,CAAC;QACD,yBAAyB;YACvB,OAAO,GAAG,uEAAA,EAAE,KAAC;QACf,CAAC;QACD,yBAAyB;YACvB,OAAO,GAAG,kHAAA,6CAET,KAAC;QACJ,CAAC;QACD,uBAAuB;YACrB,OAAO,GAAG,iHAAA,4CAET,KAAC;QACJ,CAAC;QACD,wBAAwB;YACtB,OAAO,GAAG,kHAAA,6CAET,KAAC;QACJ,CAAC;QACD,qBAAqB;YACnB,OAAO,GAAG,4QAAA,uMAMT,KAAC;QACJ,CAAC;QACD,cAAc;YACZ,OAAO,GAAG,iLAAA,4GAIT,KAAC;QACJ,CAAC;QACD,cAAc;YACZ,OAAO,GAAG,oIAAA,+DAGT,KAAC;QACJ,CAAC;KACF,CAAC;AAtI8D,CAsI9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n popup(t: Theme) {\n return css`\n position: absolute;\n border-radius: ${t.popupBorderRadius};\n border: ${t.popupBorder} ${t.popupBorderColor};\n display: flex;\n width: max-content;\n overflow: visible;\n `;\n },\n\n popupIgnoreHover() {\n return css`\n pointer-events: none;\n `;\n },\n\n hoverBridge() {\n return css`\n position: absolute;\n pointer-events: auto;\n `;\n },\n\n hoverBridgeTop() {\n return css`\n left: 0;\n right: 0;\n bottom: 100%;\n height: var(--popup-hover-bridge-size);\n `;\n },\n\n hoverBridgeBottom() {\n return css`\n left: 0;\n right: 0;\n top: 100%;\n height: var(--popup-hover-bridge-size);\n `;\n },\n\n hoverBridgeLeft() {\n return css`\n top: 0;\n bottom: 0;\n right: 100%;\n width: var(--popup-hover-bridge-size);\n `;\n },\n\n hoverBridgeRight() {\n return css`\n top: 0;\n bottom: 0;\n left: 100%;\n width: var(--popup-hover-bridge-size);\n `;\n },\n\n content(t: Theme) {\n return css`\n overflow: hidden;\n border-radius: ${t.popupBorderRadius};\n flex-shrink: 0;\n max-width: 100%;\n line-height: normal;\n `;\n },\n\n contentInner(t: Theme) {\n return css`\n color: ${t.popupTextColor};\n background: ${t.popupBackground};\n `;\n },\n\n shadow(t: Theme) {\n return css`\n box-shadow: ${t.popupBoxShadow};\n `;\n },\n\n transitionEnter() {\n return css`\n opacity: 0.01;\n `;\n },\n 'transition-enter-top'() {\n return css`\n transform: translateY(10px);\n `;\n },\n 'transition-enter-middle'() {\n return css``;\n },\n 'transition-enter-bottom'() {\n return css`\n transform: translateY(-10px);\n `;\n },\n 'transition-enter-left'() {\n return css`\n transform: translateX(10px);\n `;\n },\n 'transition-enter-right'() {\n return css`\n transform: translateX(-10px);\n `;\n },\n transitionEnterActive() {\n return css`\n transition:\n transform 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n opacity 0.18s cubic-bezier(0.22, 0.61, 0.36, 1);\n opacity: 1;\n transform: translate(0, 0);\n `;\n },\n transitionExit() {\n return css`\n opacity: 0.01;\n transition: opacity 0.15s ease-out;\n transform: translate(0, 0);\n `;\n },\n absoluteParent() {\n return css`\n position: absolute;\n text-align: initial;\n `;\n },\n}));\n"]}

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

@@ -20,6 +20,9 @@ export declare class PopupPin extends React.Component<PopupPinProps> {
     private positionObject;
     private theme;
     private isMobileLayout;
+    private styles;
+    private emotion;
+    private cx;
     private globalObject;
     private layoutEventsToken;
     private layoutUpdateId;

package/internal/Popup/PopupPin.js CHANGED Viewed

@@ -22,14 +22,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import React from 'react';
 import warning from 'warning';
 import { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';
-import { cx } from '../../lib/cx.js';
 import { getDOMRect } from '../../lib/dom/getDOMRect.js';
 import * as LayoutEvents from '../../lib/LayoutEvents.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { PopupDataTids } from './Popup.js';
 import { PopupHelper } from './PopupHelper.js';
-import { styles } from './PopupPin.css.js';
+import { getStyles } from './PopupPin.styles.js';
 var PopupPin = /** @class */ (function (_super) {
     __extends(PopupPin, _super);
     function PopupPin() {
@@ -138,16 +137,16 @@ var PopupPin = /** @class */ (function (_super) {
         _this.getPinDirectionalStyle = function () {
             switch (_this.positionObject.direction) {
                 case 'top':
-                    return styles.pinTop;
+                    return _this.styles.pinTop();
                 case 'bottom':
-                    return styles.pinBottom;
+                    return _this.styles.pinBottom();
                 case 'left':
-                    return styles.pinLeft;
+                    return _this.styles.pinLeft();
                 case 'right':
-                    return styles.pinRight;
+                    return _this.styles.pinRight();
                 default:
                     warning(false, "Can't get directional style: invalid direction '".concat(_this.positionObject.direction, "'. Must be one of - 'top', 'right', 'bottom', 'left'."));
-                    return styles.pinTop;
+                    return _this.styles.pinTop();
             }
         };
         return _this;
@@ -177,6 +176,7 @@ var PopupPin = /** @class */ (function (_super) {
         }));
     };
     PopupPin.prototype.renderPinContent = function () {
+        this.styles = getStyles(this.emotion);
         if (this.props.popupElement) {
             this.cachedPopupElement = this.props.popupElement;
         }
@@ -197,7 +197,7 @@ var PopupPin = /** @class */ (function (_super) {
             return null;
         }
         var pinEdgePadding = this.getPinEdgePadding();
-        return (React.createElement("div", { "data-tid": PopupDataTids.popupPin, className: cx(styles.pin, pinEdgePadding > 0 && styles.pinAnimated, clampedPosition.hidden && styles.pinHidden, directionalStyle), style: inlineStyle }));
+        return (React.createElement("div", { "data-tid": PopupDataTids.popupPin, className: this.cx(this.styles.pin(), pinEdgePadding > 0 && this.styles.pinAnimated(), clampedPosition.hidden && this.styles.pinHidden(), directionalStyle), style: inlineStyle }));
     };
     PopupPin.prototype.getPinEdgePadding = function () {
         return PopupHelper.getPopupViewportSidePadding(this.theme, this.isMobileLayout);

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PopupPin.js","sourceRoot":"","sources":["PopupPin.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport warning from 'warning';\n\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';\nimport { cx } from '../../lib/cx.js';\nimport { getDOMRect } from '../../lib/dom/getDOMRect.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport * as LayoutEvents from '../../lib/LayoutEvents.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { PopupDataTids } from './Popup.js';\nimport type { PositionObject, Rect } from './PopupHelper.js';\nimport { PopupHelper } from './PopupHelper.js';\nimport { styles } from './PopupPin.css.js';\n\ninterface PopupPinProps {\n /** Цвет фона пина /\n backgroundColor: string;\n\n /* Смещение пина от края попапа. Край задаётся в пропе position вторым словом /\n offset: number;\n\n /* Ссылка на попап /\n popupElement?: Nullable<Element>;\n\n /* Позиция попапа, по которой будет вычислено положение пина /\n popupPosition: string;\n\n /\n Высота пина в px. Ширина основания = 2 × size для top/bottom, для left/right наоборот.\n /\n size: number;\n}\n\ninterface ClampedPinPosition {\n left: number;\n top: number;\n hidden: boolean;\n}\n\n@withRenderEnvironment\n@responsiveLayout\nexport class PopupPin extends React.Component<PopupPinProps> {\n public static __KONTUR_REACT_UI__ = 'PopupPin';\n public static displayName = 'PopupPin';\n\n private positionObject!: PositionObject;\n private theme!: Theme;\n private isMobileLayout!: boolean;\n\n private globalObject!: GlobalObject;\n private layoutEventsToken: Nullable<ReturnType<typeof LayoutEvents.addListener>> = null;\n private layoutUpdateId: Nullable<number> = null;\n private cachedPopupElement: Nullable<Element> = null;\n\n public componentDidMount() {\n this.layoutEventsToken = LayoutEvents.addListener(this.handleLayoutEvent, this.globalObject);\n this.scheduleRemeasure();\n }\n\n public componentDidUpdate(prevProps: PopupPinProps) {\n if (\n prevProps.popupPosition !== this.props.popupPosition \|\|\n prevProps.offset !== this.props.offset \|\|\n prevProps.popupElement !== this.props.popupElement\n ) {\n this.scheduleRemeasure();\n }\n }\n\n public componentWillUnmount() {\n this.cancelScheduledRemeasure();\n this.layoutEventsToken?.remove();\n this.layoutEventsToken = null;\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderPinContent();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderPinContent() {\n if (this.props.popupElement) {\n this.cachedPopupElement = this.props.popupElement;\n }\n\n const popupElement = this.props.popupElement \|\| this.cachedPopupElement;\n\n if (!popupElement) {\n return null;\n }\n\n this.positionObject = PopupHelper.getPositionObject(this.props.popupPosition);\n\n const coords = this.getPinCoordinates(popupElement);\n if (!coords \|\| typeof coords.left !== 'number' \|\| typeof coords.top !== 'number') {\n return null;\n }\n\n const popupRect = this.getPopupElementRect(popupElement);\n const clampedPosition = this.applyEdgeClamp(coords, popupRect);\n const inlineStyle = this.getPinInlineStyle(clampedPosition.left, clampedPosition.top);\n const directionalStyle = this.getPinDirectionalStyle();\n if (!inlineStyle \|\| !directionalStyle) {\n return null;\n }\n\n const pinEdgePadding = this.getPinEdgePadding();\n\n return (\n <div\n data-tid={PopupDataTids.popupPin}\n className={cx(\n styles.pin,\n pinEdgePadding > 0 && styles.pinAnimated,\n clampedPosition.hidden && styles.pinHidden,\n directionalStyle,\n )}\n style={inlineStyle}\n ></div>\n );\n }\n\n private getPinEdgePadding(): number {\n return PopupHelper.getPopupViewportSidePadding(this.theme, this.isMobileLayout);\n }\n\n private handleLayoutEvent = () => {\n this.scheduleRemeasure();\n };\n\n private scheduleRemeasure() {\n this.cancelScheduledRemeasure();\n this.layoutUpdateId = this.globalObject.requestAnimationFrame?.(() => {\n this.layoutUpdateId = null;\n this.forceUpdate();\n });\n }\n\n private cancelScheduledRemeasure() {\n if (this.layoutUpdateId && this.layoutUpdateId !== null) {\n this.globalObject.cancelAnimationFrame?.(this.layoutUpdateId);\n this.layoutUpdateId = null;\n }\n }\n\n private getPopupOppositeDirection() {\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 warning(\n false,\n `Can't get opposite direction: invalid direction ${popupDirection}. Must be one of - 'top', 'bottom', 'left', 'right'.`,\n );\n return 'bottom';\n }\n }\n\n private getPinInlineStyle = (left: number, top: number) => {\n const direction = this.getPopupOppositeDirection();\n if (!direction) {\n return;\n }\n\n // Добавляем запас в 1px, чтобы пофиксить случайные отделения пинов\n const correctedLeft = left - 1;\n const correctedTop = top - 1;\n const correctedSize = this.props.size + 1;\n\n const defaultPinInlineStyle = {\n [direction]: -this.props.size + 'px',\n left: correctedLeft + 'px',\n width: correctedSize 2 + 'px',\n height: correctedSize + 'px',\n backgroundColor: this.props.backgroundColor,\n };\n\n switch (direction) {\n case 'top':\n case 'bottom':\n return defaultPinInlineStyle;\n case 'left':\n case 'right':\n return {\n [direction]: -this.props.size + 'px',\n top: correctedTop + 'px',\n height: correctedSize * 2 + 'px',\n width: correctedSize + 'px',\n backgroundColor: this.props.backgroundColor,\n };\n default:\n warning(\n false,\n `Can't get inline style: invalid direction '${direction}'. Must be one of - 'top', 'right', 'bottom', 'left'.`,\n );\n return defaultPinInlineStyle;\n }\n };\n\n private clampValue(value: number, min: number, max: number) {\n return Math.min(Math.max(value, min), max);\n }\n\n private applyEdgeClamp(coords: { left: number; top: number }, popupRect: Rect): ClampedPinPosition {\n const pinEdgePadding = this.getPinEdgePadding();\n\n if (pinEdgePadding <= 0) {\n return { left: coords.left, top: coords.top, hidden: false };\n }\n\n const { direction } = this.positionObject;\n const pinSpan = 2 * this.props.size;\n\n if (direction === 'top' \|\| direction === 'bottom') {\n const minLeft = pinEdgePadding;\n const maxLeft = popupRect.width - pinSpan - pinEdgePadding;\n const clampedLeft = this.clampValue(coords.left, minLeft, maxLeft);\n const centerOffset = coords.left - clampedLeft;\n\n return {\n left: clampedLeft,\n top: coords.top,\n hidden: centerOffset !== 0,\n };\n }\n\n const minTop = pinEdgePadding;\n const maxTop = popupRect.height - pinSpan - pinEdgePadding;\n const clampedTop = this.clampValue(coords.top, minTop, maxTop);\n const centerOffset = coords.top - clampedTop;\n\n return {\n left: coords.left,\n top: clampedTop,\n hidden: centerOffset !== 0,\n };\n }\n\n private getPopupElementRect(popupElement: Element): Rect {\n const rect = getDOMRect(popupElement);\n\n return {\n top: 0,\n left: 0,\n width: rect.width,\n height: rect.height,\n };\n }\n\n private getPinCoordinates = (popupElement: Element) => {\n const popupRect = this.getPopupElementRect(popupElement);\n const { direction, align } = this.positionObject;\n\n switch (direction) {\n case 'top':\n return {\n top: popupRect.height,\n left: this.getPinLeftCoordinate(popupRect, align),\n };\n case 'bottom':\n return {\n top: -2 * this.props.size,\n left: this.getPinLeftCoordinate(popupRect, align),\n };\n case 'left':\n return {\n top: this.getPinTopCoordinate(popupRect, align),\n left: popupRect.width,\n };\n case 'right':\n return {\n top: this.getPinTopCoordinate(popupRect, align),\n left: -2 * this.props.size,\n };\n default:\n warning(\n false,\n `Can't get coordinates: invalid direction '${direction}'. Must be one of - 'top', 'right', 'bottom', 'left'.`,\n );\n return {\n top: popupRect.height,\n left: this.getPinLeftCoordinate(popupRect, align),\n };\n }\n };\n\n private getPinTopCoordinate = (popupRect: Rect, align: string) => {\n const defaultTopCoordinate = this.props.offset;\n switch (align) {\n case 'top':\n return defaultTopCoordinate;\n case 'middle':\n return popupRect.height / 2 - this.props.size;\n case 'bottom':\n return popupRect.height - this.props.offset - 2 * this.props.size;\n default:\n warning(\n false,\n `Can't get top coordinate: invalid align '${align}'. Must be one of - 'top', 'middle', 'bottom'.`,\n );\n return defaultTopCoordinate;\n }\n };\n\n private getPinLeftCoordinate = (popupRect: Rect, align: string) => {\n const defaultLetfCoordinate = popupRect.width / 2 - this.props.size;\n switch (align) {\n case 'left':\n return this.props.offset;\n case 'center':\n return defaultLetfCoordinate + this.props.offset;\n case 'right':\n return popupRect.width - this.props.offset - 2 * this.props.size;\n default:\n warning(\n false,\n `Can't get left coordinate: invalid align '${align}'. Must be one of - 'left', 'center', 'right'.`,\n );\n return defaultLetfCoordinate;\n }\n };\n\n private getPinDirectionalStyle = () => {\n switch (this.positionObject.direction) {\n case 'top':\n return styles.pinTop;\n case 'bottom':\n return styles.pinBottom;\n case 'left':\n return styles.pinLeft;\n case 'right':\n return styles.pinRight;\n default:\n warning(\n false,\n `Can't get directional style: invalid direction '${this.positionObject.direction}'. Must be one of - 'top', 'right', 'bottom', 'left'.`,\n );\n return styles.pinTop;\n }\n };\n}\n"]}
1	+ {"version":3,"file":"PopupPin.js","sourceRoot":"","sources":["PopupPin.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport React from 'react';\nimport warning from 'warning';\n\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';\nimport { getDOMRect } from '../../lib/dom/getDOMRect.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport * as LayoutEvents from '../../lib/LayoutEvents.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { PopupDataTids } from './Popup.js';\nimport type { PositionObject, Rect } from './PopupHelper.js';\nimport { PopupHelper } from './PopupHelper.js';\nimport { getStyles } from './PopupPin.styles.js';\n\ninterface PopupPinProps {\n /** Цвет фона пина /\n backgroundColor: string;\n\n /* Смещение пина от края попапа. Край задаётся в пропе position вторым словом /\n offset: number;\n\n /* Ссылка на попап /\n popupElement?: Nullable<Element>;\n\n /* Позиция попапа, по которой будет вычислено положение пина /\n popupPosition: string;\n\n /\n Высота пина в px. Ширина основания = 2 × size для top/bottom, для left/right наоборот.\n /\n size: number;\n}\n\ninterface ClampedPinPosition {\n left: number;\n top: number;\n hidden: boolean;\n}\n\n@withRenderEnvironment\n@responsiveLayout\nexport class PopupPin extends React.Component<PopupPinProps> {\n public static __KONTUR_REACT_UI__ = 'PopupPin';\n public static displayName = 'PopupPin';\n\n private positionObject!: PositionObject;\n private theme!: Theme;\n private isMobileLayout!: boolean;\n\n private styles!: ReturnType<typeof getStyles>;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private globalObject!: GlobalObject;\n private layoutEventsToken: Nullable<ReturnType<typeof LayoutEvents.addListener>> = null;\n private layoutUpdateId: Nullable<number> = null;\n private cachedPopupElement: Nullable<Element> = null;\n\n public componentDidMount() {\n this.layoutEventsToken = LayoutEvents.addListener(this.handleLayoutEvent, this.globalObject);\n this.scheduleRemeasure();\n }\n\n public componentDidUpdate(prevProps: PopupPinProps) {\n if (\n prevProps.popupPosition !== this.props.popupPosition \|\|\n prevProps.offset !== this.props.offset \|\|\n prevProps.popupElement !== this.props.popupElement\n ) {\n this.scheduleRemeasure();\n }\n }\n\n public componentWillUnmount() {\n this.cancelScheduledRemeasure();\n this.layoutEventsToken?.remove();\n this.layoutEventsToken = null;\n }\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderPinContent();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderPinContent() {\n this.styles = getStyles(this.emotion);\n\n if (this.props.popupElement) {\n this.cachedPopupElement = this.props.popupElement;\n }\n\n const popupElement = this.props.popupElement \|\| this.cachedPopupElement;\n\n if (!popupElement) {\n return null;\n }\n\n this.positionObject = PopupHelper.getPositionObject(this.props.popupPosition);\n\n const coords = this.getPinCoordinates(popupElement);\n if (!coords \|\| typeof coords.left !== 'number' \|\| typeof coords.top !== 'number') {\n return null;\n }\n\n const popupRect = this.getPopupElementRect(popupElement);\n const clampedPosition = this.applyEdgeClamp(coords, popupRect);\n const inlineStyle = this.getPinInlineStyle(clampedPosition.left, clampedPosition.top);\n const directionalStyle = this.getPinDirectionalStyle();\n if (!inlineStyle \|\| !directionalStyle) {\n return null;\n }\n\n const pinEdgePadding = this.getPinEdgePadding();\n\n return (\n <div\n data-tid={PopupDataTids.popupPin}\n className={this.cx(\n this.styles.pin(),\n pinEdgePadding > 0 && this.styles.pinAnimated(),\n clampedPosition.hidden && this.styles.pinHidden(),\n directionalStyle,\n )}\n style={inlineStyle}\n ></div>\n );\n }\n\n private getPinEdgePadding(): number {\n return PopupHelper.getPopupViewportSidePadding(this.theme, this.isMobileLayout);\n }\n\n private handleLayoutEvent = () => {\n this.scheduleRemeasure();\n };\n\n private scheduleRemeasure() {\n this.cancelScheduledRemeasure();\n this.layoutUpdateId = this.globalObject.requestAnimationFrame?.(() => {\n this.layoutUpdateId = null;\n this.forceUpdate();\n });\n }\n\n private cancelScheduledRemeasure() {\n if (this.layoutUpdateId && this.layoutUpdateId !== null) {\n this.globalObject.cancelAnimationFrame?.(this.layoutUpdateId);\n this.layoutUpdateId = null;\n }\n }\n\n private getPopupOppositeDirection() {\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 warning(\n false,\n `Can't get opposite direction: invalid direction ${popupDirection}. Must be one of - 'top', 'bottom', 'left', 'right'.`,\n );\n return 'bottom';\n }\n }\n\n private getPinInlineStyle = (left: number, top: number) => {\n const direction = this.getPopupOppositeDirection();\n if (!direction) {\n return;\n }\n\n // Добавляем запас в 1px, чтобы пофиксить случайные отделения пинов\n const correctedLeft = left - 1;\n const correctedTop = top - 1;\n const correctedSize = this.props.size + 1;\n\n const defaultPinInlineStyle = {\n [direction]: -this.props.size + 'px',\n left: correctedLeft + 'px',\n width: correctedSize 2 + 'px',\n height: correctedSize + 'px',\n backgroundColor: this.props.backgroundColor,\n };\n\n switch (direction) {\n case 'top':\n case 'bottom':\n return defaultPinInlineStyle;\n case 'left':\n case 'right':\n return {\n [direction]: -this.props.size + 'px',\n top: correctedTop + 'px',\n height: correctedSize * 2 + 'px',\n width: correctedSize + 'px',\n backgroundColor: this.props.backgroundColor,\n };\n default:\n warning(\n false,\n `Can't get inline style: invalid direction '${direction}'. Must be one of - 'top', 'right', 'bottom', 'left'.`,\n );\n return defaultPinInlineStyle;\n }\n };\n\n private clampValue(value: number, min: number, max: number) {\n return Math.min(Math.max(value, min), max);\n }\n\n private applyEdgeClamp(coords: { left: number; top: number }, popupRect: Rect): ClampedPinPosition {\n const pinEdgePadding = this.getPinEdgePadding();\n\n if (pinEdgePadding <= 0) {\n return { left: coords.left, top: coords.top, hidden: false };\n }\n\n const { direction } = this.positionObject;\n const pinSpan = 2 * this.props.size;\n\n if (direction === 'top' \|\| direction === 'bottom') {\n const minLeft = pinEdgePadding;\n const maxLeft = popupRect.width - pinSpan - pinEdgePadding;\n const clampedLeft = this.clampValue(coords.left, minLeft, maxLeft);\n const centerOffset = coords.left - clampedLeft;\n\n return {\n left: clampedLeft,\n top: coords.top,\n hidden: centerOffset !== 0,\n };\n }\n\n const minTop = pinEdgePadding;\n const maxTop = popupRect.height - pinSpan - pinEdgePadding;\n const clampedTop = this.clampValue(coords.top, minTop, maxTop);\n const centerOffset = coords.top - clampedTop;\n\n return {\n left: coords.left,\n top: clampedTop,\n hidden: centerOffset !== 0,\n };\n }\n\n private getPopupElementRect(popupElement: Element): Rect {\n const rect = getDOMRect(popupElement);\n\n return {\n top: 0,\n left: 0,\n width: rect.width,\n height: rect.height,\n };\n }\n\n private getPinCoordinates = (popupElement: Element) => {\n const popupRect = this.getPopupElementRect(popupElement);\n const { direction, align } = this.positionObject;\n\n switch (direction) {\n case 'top':\n return {\n top: popupRect.height,\n left: this.getPinLeftCoordinate(popupRect, align),\n };\n case 'bottom':\n return {\n top: -2 * this.props.size,\n left: this.getPinLeftCoordinate(popupRect, align),\n };\n case 'left':\n return {\n top: this.getPinTopCoordinate(popupRect, align),\n left: popupRect.width,\n };\n case 'right':\n return {\n top: this.getPinTopCoordinate(popupRect, align),\n left: -2 * this.props.size,\n };\n default:\n warning(\n false,\n `Can't get coordinates: invalid direction '${direction}'. Must be one of - 'top', 'right', 'bottom', 'left'.`,\n );\n return {\n top: popupRect.height,\n left: this.getPinLeftCoordinate(popupRect, align),\n };\n }\n };\n\n private getPinTopCoordinate = (popupRect: Rect, align: string) => {\n const defaultTopCoordinate = this.props.offset;\n switch (align) {\n case 'top':\n return defaultTopCoordinate;\n case 'middle':\n return popupRect.height / 2 - this.props.size;\n case 'bottom':\n return popupRect.height - this.props.offset - 2 * this.props.size;\n default:\n warning(\n false,\n `Can't get top coordinate: invalid align '${align}'. Must be one of - 'top', 'middle', 'bottom'.`,\n );\n return defaultTopCoordinate;\n }\n };\n\n private getPinLeftCoordinate = (popupRect: Rect, align: string) => {\n const defaultLetfCoordinate = popupRect.width / 2 - this.props.size;\n switch (align) {\n case 'left':\n return this.props.offset;\n case 'center':\n return defaultLetfCoordinate + this.props.offset;\n case 'right':\n return popupRect.width - this.props.offset - 2 * this.props.size;\n default:\n warning(\n false,\n `Can't get left coordinate: invalid align '${align}'. Must be one of - 'left', 'center', 'right'.`,\n );\n return defaultLetfCoordinate;\n }\n };\n\n private getPinDirectionalStyle = () => {\n switch (this.positionObject.direction) {\n case 'top':\n return this.styles.pinTop();\n case 'bottom':\n return this.styles.pinBottom();\n case 'left':\n return this.styles.pinLeft();\n case 'right':\n return this.styles.pinRight();\n default:\n warning(\n false,\n `Can't get directional style: invalid direction '${this.positionObject.direction}'. Must be one of - 'top', 'right', 'bottom', 'left'.`,\n );\n return this.styles.pinTop();\n }\n };\n}\n"]}

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

@@ -0,0 +1,9 @@
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    pin(): string;
+    pinAnimated(): string;
+    pinHidden(): string;
+    pinTop(): string;
+    pinBottom(): string;
+    pinLeft(): string;
+    pinRight(): string;
+}>;

package/internal/Popup/PopupPin.styles.js ADDED Viewed

@@ -0,0 +1,33 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        pin: function () {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      position: absolute;\n    "], ["\n      position: absolute;\n    "])));
+        },
+        pinAnimated: function () {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      opacity: 1;\n      transition:\n        left 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n        top 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n        opacity 0.15s ease-out,\n        visibility 0.15s ease-out;\n    "], ["\n      opacity: 1;\n      transition:\n        left 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n        top 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n        opacity 0.15s ease-out,\n        visibility 0.15s ease-out;\n    "])));
+        },
+        pinHidden: function () {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      visibility: hidden;\n      opacity: 0;\n    "], ["\n      visibility: hidden;\n      opacity: 0;\n    "])));
+        },
+        pinTop: function () {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      clip-path: polygon(0 0, 50% 100%, 100% 0);\n    "], ["\n      clip-path: polygon(0 0, 50% 100%, 100% 0);\n    "])));
+        },
+        pinBottom: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      clip-path: polygon(0 100%, 50% 0, 100% 100%);\n    "], ["\n      clip-path: polygon(0 100%, 50% 0, 100% 100%);\n    "])));
+        },
+        pinLeft: function () {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      clip-path: polygon(0 0, 100% 50%, 0 100%);\n    "], ["\n      clip-path: polygon(0 0, 100% 50%, 0 100%);\n    "])));
+        },
+        pinRight: function () {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      clip-path: polygon(100% 0, 0 50%, 100% 100%);\n    "], ["\n      clip-path: polygon(100% 0, 0 50%, 100% 100%);\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+//# sourceMappingURL=PopupPin.styles.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"PopupPin.styles.js","sourceRoot":"","sources":["PopupPin.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,GAAG;YACD,OAAO,GAAG,sGAAA,mCAET,KAAC;QACJ,CAAC;QAED,WAAW;YACT,OAAO,GAAG,mSAAA,gOAOT,KAAC;QACJ,CAAC;QAED,SAAS;YACP,OAAO,GAAG,yHAAA,sDAGT,KAAC;QACJ,CAAC;QAED,MAAM;YACJ,OAAO,GAAG,6HAAA,0DAET,KAAC;QACJ,CAAC;QAED,SAAS;YACP,OAAO,GAAG,gIAAA,6DAET,KAAC;QACJ,CAAC;QAED,OAAO;YACL,OAAO,GAAG,6HAAA,0DAET,KAAC;QACJ,CAAC;QAED,QAAQ;YACN,OAAO,GAAG,gIAAA,6DAET,KAAC;QACJ,CAAC;KACF,CAAC;AAhD8D,CAgD9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n pin() {\n return css`\n position: absolute;\n `;\n },\n\n pinAnimated() {\n return css`\n opacity: 1;\n transition:\n left 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n top 0.18s cubic-bezier(0.22, 0.61, 0.36, 1),\n opacity 0.15s ease-out,\n visibility 0.15s ease-out;\n `;\n },\n\n pinHidden() {\n return css`\n visibility: hidden;\n opacity: 0;\n `;\n },\n\n pinTop() {\n return css`\n clip-path: polygon(0 0, 50% 100%, 100% 0);\n `;\n },\n\n pinBottom() {\n return css`\n clip-path: polygon(0 100%, 50% 0, 100% 100%);\n `;\n },\n\n pinLeft() {\n return css`\n clip-path: polygon(0 0, 100% 50%, 0 100%);\n `;\n },\n\n pinRight() {\n return css`\n clip-path: polygon(100% 0, 0 50%, 100% 100%);\n `;\n },\n}));\n"]}

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

@@ -63,6 +63,8 @@ export declare class PopupMenu extends React.Component<PopupMenuProps, PopupMenu
     static __KONTUR_REACT_UI__: string;
     static displayName: string;
     private globalObject;
+    private emotion;
+    private styles;
     private isMobileLayout;
     private rootId;
     static defaultProps: DefaultProps;

package/internal/PopupMenu/PopupMenu.js CHANGED Viewed

@@ -36,7 +36,6 @@ import { createPropsGetter } from '../../lib/createPropsGetter.js';
 import { isKeyArrowVertical, isKeyEnter, isKeyEscape, isKeySpace, someKeys, } from '../../lib/events/keyboard/identifiers.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { rootNode } from '../../lib/rootNode/index.js';
-import { memoizeTheme } from '../../lib/theming/memoizeTheme.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { ThemeFactory } from '../../lib/theming/ThemeFactory.js';
 import { getRandomID } from '../../lib/utils.js';
@@ -44,12 +43,9 @@ import { CommonWrapper } from '../CommonWrapper/index.js';
 import { Menu } from '../Menu/index.js';
 import { Popup, PopupIds } from '../Popup/index.js';
 import { RenderLayer } from '../RenderLayer/index.js';
-import { styles } from './PopupMenu.css.js';
+import { getStyles } from './PopupMenu.styles.js';
 import { PopupMenuDataTids } from './tids.js';
 import { isValidPositions } from './validatePositions.js';
-var getPopupMenuTheme = memoizeTheme(function (theme) {
-    return ThemeFactory.create({ menuOffsetY: theme.popupMenuMenuOffsetY }, theme);
-});
 export * from './tids.js';
 export var PopupMenuType = {
     Dropdown: 'dropdown',
@@ -114,13 +110,13 @@ var PopupMenu = /** @class */ (function (_super) {
                     toggleMenu: _this.toggleMenu,
                     corners: _this.props.corners,
                 });
-                return (React.createElement("span", { "data-tid": PopupMenuDataTids.caption, className: styles.caption, ref: function (element) {
+                return (React.createElement("span", { "data-tid": PopupMenuDataTids.caption, className: _this.styles.caption(), ref: function (element) {
                         _this.captionWrapper = element;
                     } }, _this.passPropsToCaption(caption)));
             }
             return (React.createElement("span", { "data-tid": PopupMenuDataTids.caption, onClick: _this.handleCaptionClick, onKeyDown: _this.handleCaptionKeyDown, ref: function (element) {
                     _this.captionWrapper = element;
-                }, className: styles.caption }, _this.passPropsToCaption(_this.props.caption)));
+                }, className: _this.styles.caption() }, _this.passPropsToCaption(_this.props.caption)));
         };
         _this.hideMenuWithoutFocusing = function () { return _this.hideMenu(); };
         _this.showMenu = function (firstItemShouldBeSelected) {
@@ -182,8 +178,11 @@ var PopupMenu = /** @class */ (function (_super) {
     PopupMenu_1 = PopupMenu;
     PopupMenu.prototype.render = function () {
         var _this = this;
+        this.styles = getStyles(this.emotion);
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
-            return React.createElement(ThemeContext.Provider, { value: getPopupMenuTheme(theme) }, _this.renderMain());
+            return (React.createElement(ThemeContext.Provider, { value: ThemeFactory.create({
+                    menuOffsetY: theme.popupMenuMenuOffsetY,
+                }, theme) }, _this.renderMain()));
         }));
     };
     PopupMenu.prototype.renderMain = function () {
@@ -191,7 +190,7 @@ var PopupMenu = /** @class */ (function (_super) {
         var _b = this.getProps(), popupHasPin = _b.popupHasPin, disableAnimations = _b.disableAnimations;
         return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.props),
             React.createElement(RenderLayer, { onClickOutside: this.hideMenuWithoutFocusing, onFocusOutside: this.hideMenuWithoutFocusing, active: this.state.menuVisible },
-                React.createElement("div", { "data-tid": PopupMenuDataTids.root, className: styles.container, style: { width: this.props.width } },
+                React.createElement("div", { "data-tid": PopupMenuDataTids.root, className: this.styles.container(), style: { width: this.props.width } },
                     this.renderCaption(),
                     this.captionWrapper && this.props.children && (React.createElement(Popup, { id: (_a = this.props.popupMenuId) !== null && _a !== void 0 ? _a : this.rootId, anchorElement: this.captionWrapper, opened: this.state.menuVisible, hasShadow: true, margin: this.props.popupMargin, hasPin: popupHasPin, pinOffset: this.props.popupPinOffset, positions: this.getPositions(), disableAnimations: disableAnimations, onOpen: this.handleOpen, mobileOnCloseRequest: this.hideMenu, width: this.isMobileLayout ? 'auto' : this.props.menuWidth || 'auto' },
                         React.createElement(Menu, { maxHeight: this.isMobileLayout ? 'none' : this.props.menuMaxHeight || 'none', onKeyDown: this.handleKeyDown, onItemClick: this.handleItemSelection, preventIconsOffset: this.props.preventIconsOffset, cyclicSelection: false, ref: this.menuRef, initialSelectedItemIndex: this.state.firstItemShouldBeSelected ? 0 : -1, header: this.props.header, footer: this.props.footer }, this.props.children)))))));

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

	@@ -1 +1 @@
1	- {"version":3,"file":"PopupMenu.js","sourceRoot":"","sources":["PopupMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { AriaAttributes, HTMLAttributes, JSX } from 'react';\nimport React from 'react';\n\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport {\n isKeyArrowVertical,\n isKeyEnter,\n isKeyEscape,\n isKeySpace,\n someKeys,\n} from '../../lib/events/keyboard/identifiers.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { memoizeTheme } from '../../lib/theming/memoizeTheme.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport { getRandomID } from '../../lib/utils.js';\nimport type { HTMLProps } from '../../typings/html.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { CommonWrapper } from '../CommonWrapper/index.js';\nimport { Menu } from '../Menu/index.js';\nimport type { MenuProps } from '../Menu/index.js';\nimport { Popup, PopupIds } from '../Popup/index.js';\nimport type { PopupPositionsType } from '../Popup/index.js';\nimport { RenderLayer } from '../RenderLayer/index.js';\nimport { styles } from './PopupMenu.css.js';\nimport { PopupMenuDataTids } from './tids.js';\nimport { isValidPositions } from './validatePositions.js';\n\nconst getPopupMenuTheme = memoizeTheme((theme: Theme) =>\n ThemeFactory.create({ menuOffsetY: theme.popupMenuMenuOffsetY }, theme),\n);\n\nexport * from './tids.js';\n\nexport interface PopupMenuCaptionProps {\n opened: boolean;\n openMenu: (firstItemShouldBeSelected?: boolean) => void;\n closeMenu: (restoreFocus?: boolean) => void;\n toggleMenu: () => void;\n /** @ignore /\n corners?: React.CSSProperties;\n}\n\nexport interface PopupMenuProps\n extends\n 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 /* `id` выпадающего меню. /\n popupMenuId?: HTMLProps['id'];\n\n /* @ignore */\n corners?: React.CSSProperties;\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\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@withRenderEnvironment\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 globalObject!: GlobalObject;\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 shouldRestoreFocusOnClose = false;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n return <ThemeContext.Provider value={getPopupMenuTheme(theme)}>{this.renderMain()}</ThemeContext.Provider>;\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 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.menuRef}\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 public componentDidUpdate(_prevProps: PopupMenuProps, prevState: PopupMenuState): void {\n if (prevState.menuVisible === this.state.menuVisible) {\n return;\n }\n\n const focusShouldBeRestored = !this.state.menuVisible && this.shouldRestoreFocusOnClose;\n\n if (focusShouldBeRestored) {\n this.restoreFocus();\n }\n\n if (this.state.menuVisible) {\n this.props.onOpen?.();\n } else {\n this.props.onClose?.();\n this.shouldRestoreFocusOnClose = false;\n }\n\n this.props.onChangeMenuState?.(this.state.menuVisible, focusShouldBeRestored);\n }\n\n private menuRef = (element: Nullable<Menu>) => {\n this.menu = element;\n };\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<any>, {\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 corners: this.props.corners,\n });\n\n return (\n <span\n data-tid={PopupMenuDataTids.caption}\n className={styles.caption}\n ref={(element) => {\n this.captionWrapper = element;\n }}\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) => {\n this.captionWrapper = element;\n }}\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.shouldRestoreFocusOnClose = false;\n this.setState({\n menuVisible: true,\n firstItemShouldBeSelected,\n });\n };\n\n private hideMenu = (restoreFocus?: boolean): void => {\n this.shouldRestoreFocusOnClose = !!restoreFocus;\n this.setState({\n menuVisible: false,\n firstItemShouldBeSelected: false,\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 (this.globalObject.document) {\n this.savedFocusableElement = this.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 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,"file":"PopupMenu.js","sourceRoot":"","sources":["PopupMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes, HTMLAttributes, JSX } from 'react';\nimport React from 'react';\n\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport {\n isKeyArrowVertical,\n isKeyEnter,\n isKeyEscape,\n isKeySpace,\n someKeys,\n} from '../../lib/events/keyboard/identifiers.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport { getRandomID } from '../../lib/utils.js';\nimport type { HTMLProps } from '../../typings/html.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { CommonWrapper } from '../CommonWrapper/index.js';\nimport { Menu } from '../Menu/index.js';\nimport type { MenuProps } from '../Menu/index.js';\nimport { Popup, PopupIds } from '../Popup/index.js';\nimport type { PopupPositionsType } from '../Popup/index.js';\nimport { RenderLayer } from '../RenderLayer/index.js';\nimport { getStyles } from './PopupMenu.styles.js';\nimport { PopupMenuDataTids } from './tids.js';\nimport { isValidPositions } from './validatePositions.js';\n\nexport * from './tids.js';\n\nexport interface PopupMenuCaptionProps {\n opened: boolean;\n openMenu: (firstItemShouldBeSelected?: boolean) => void;\n closeMenu: (restoreFocus?: boolean) => void;\n toggleMenu: () => void;\n /** @ignore /\n corners?: React.CSSProperties;\n}\n\nexport interface PopupMenuProps\n extends\n 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 /* `id` выпадающего меню. /\n popupMenuId?: HTMLProps['id'];\n\n /* @ignore */\n corners?: React.CSSProperties;\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\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@withRenderEnvironment\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 globalObject!: GlobalObject;\n private emotion!: Emotion;\n private styles!: ReturnType<typeof getStyles>;\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 shouldRestoreFocusOnClose = false;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public render(): JSX.Element {\n this.styles = getStyles(this.emotion);\n\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\n data-tid={PopupMenuDataTids.root}\n className={this.styles.container()}\n style={{ width: this.props.width }}\n >\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 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.menuRef}\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 public componentDidUpdate(_prevProps: PopupMenuProps, prevState: PopupMenuState): void {\n if (prevState.menuVisible === this.state.menuVisible) {\n return;\n }\n\n const focusShouldBeRestored = !this.state.menuVisible && this.shouldRestoreFocusOnClose;\n\n if (focusShouldBeRestored) {\n this.restoreFocus();\n }\n\n if (this.state.menuVisible) {\n this.props.onOpen?.();\n } else {\n this.props.onClose?.();\n this.shouldRestoreFocusOnClose = false;\n }\n\n this.props.onChangeMenuState?.(this.state.menuVisible, focusShouldBeRestored);\n }\n\n private menuRef = (element: Nullable<Menu>) => {\n this.menu = element;\n };\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<any>, {\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 corners: this.props.corners,\n });\n\n return (\n <span\n data-tid={PopupMenuDataTids.caption}\n className={this.styles.caption()}\n ref={(element) => {\n this.captionWrapper = element;\n }}\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) => {\n this.captionWrapper = element;\n }}\n className={this.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.shouldRestoreFocusOnClose = false;\n this.setState({\n menuVisible: true,\n firstItemShouldBeSelected,\n });\n };\n\n private hideMenu = (restoreFocus?: boolean): void => {\n this.shouldRestoreFocusOnClose = !!restoreFocus;\n this.setState({\n menuVisible: false,\n firstItemShouldBeSelected: false,\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 (this.globalObject.document) {\n this.savedFocusableElement = this.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 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.styles.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    caption(): string;
+    container(): string;
+}>;

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

@@ -0,0 +1,18 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        caption: function () {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      display: inline-block;\n      width: 100%;\n    "], ["\n      display: inline-block;\n      width: 100%;\n    "])));
+        },
+        container: function () {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      display: inline-block;\n      line-height: normal;\n    "], ["\n      display: inline-block;\n      line-height: normal;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2;
+//# sourceMappingURL=PopupMenu.styles.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"PopupMenu.styles.js","sourceRoot":"","sources":["PopupMenu.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,OAAO;YACL,OAAO,GAAG,6HAAA,0DAGT,KAAC;QACJ,CAAC;QACD,SAAS;YACP,OAAO,GAAG,qIAAA,kEAGT,KAAC;QACJ,CAAC;KACF,CAAC;AAb8D,CAa9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\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/RenderContainer/RenderContainer.d.ts CHANGED Viewed

@@ -13,12 +13,10 @@ export declare class RenderContainer extends React.Component<RenderContainerProp
     static readonly defaultRootNode: null;
     private domContainer;
     private readonly rootId;
-    private appliedThemeVars;
     getRootNode: TGetRootNode;
     shouldComponentUpdate(nextProps: RenderContainerProps): boolean;
     componentWillUnmount(): void;
     render(): React.JSX.Element;
-    private applyThemeVars;
     private createContainer;
     private mountContainer;
     private destroyContainer;

package/internal/RenderContainer/RenderContainer.js CHANGED Viewed

@@ -26,10 +26,8 @@ var __assign = (this && this.__assign) || function () {
 };
 import React from 'react';
 import { callChildRef } from '../../lib/callChildRef/callChildRef.js';
-import { REACT_UI_PREFIX } from '../../lib/prefix.js';
 import { RenderEnvironmentContext } from '../../lib/renderEnvironment/index.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
-import { getThemeSetTokens, getThemeVars, ThemeCarrierContext } from '../../lib/theming/themeVars.js';
+import { Upgrade } from '../../lib/Upgrades.js';
 import { getRandomID } from '../../lib/utils.js';
 import { RenderInnerContainer } from './RenderInnerContainer.js';
 export var PORTAL_INLET_ATTR = 'data-render-container-id';
@@ -40,7 +38,6 @@ var RenderContainer = /** @class */ (function (_super) {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.domContainer = RenderContainer.defaultRootNode;
         _this.rootId = RenderContainer.getRootId();
-        _this.appliedThemeVars = [null];
         _this.getRootNode = function () { return _this.domContainer; };
         return _this;
     }
@@ -57,48 +54,16 @@ var RenderContainer = /** @class */ (function (_super) {
         this.destroyContainer();
     };
     RenderContainer.prototype.render = function () {
-        var _this = this;
         if (this.props.children) {
             this.mountContainer();
         }
-        return (React.createElement(ThemeContext.Consumer, null, function (theme) {
-            _this.applyThemeVars(getThemeVars(theme), getThemeSetTokens(theme));
-            // портал живёт в body: переменные считаются от темы по умолчанию, для содержимого носитель — контейнер.
-            // якорь остаётся на месте в DOM, поэтому его носитель — внешний, а не контейнер
-            var children = _this.props.children;
-            return (React.createElement(RenderInnerContainer, __assign({}, _this.props, { domContainer: _this.domContainer, rootId: _this.rootId }), children && React.createElement(ThemeCarrierContext.Provider, { value: theme }, children)));
-        }));
-    };
-    RenderContainer.prototype.applyThemeVars = function (vars, setTokens) {
-        var container = this.domContainer;
-        // Popup перерисовывается на каждый скролл: переписываем атрибуты, только если сменились контейнер или тема
-        // (результаты getThemeVars и getThemeSetTokens закешированы). В рендере, а не в componentDidUpdate: вложенные
-        // компоненты меряют себя в своих componentDidMount, а он у них раньше, чем у контейнера
-        var _a = this.appliedThemeVars, appliedContainer = _a[0], appliedVars = _a[1], appliedSetTokens = _a[2];
-        if (!container || (container === appliedContainer && vars === appliedVars && setTokens === appliedSetTokens)) {
-            return;
-        }
-        this.appliedThemeVars = [container, vars, setTokens];
-        // снимаем только свои переменные: inline-стили контейнера мог поставить потребитель через containerRef
-        if (container === appliedContainer && appliedVars) {
-            Object.keys(appliedVars).forEach(function (name) { return container.style.removeProperty(name); });
-        }
-        if (setTokens) {
-            container.setAttribute('data-k-set', setTokens);
-        }
-        else {
-            container.removeAttribute('data-k-set');
-        }
-        Object.entries(vars).forEach(function (_a) {
-            var name = _a[0], value = _a[1];
-            return container.style.setProperty(name, String(value));
-        });
+        return React.createElement(RenderInnerContainer, __assign({}, this.props, { domContainer: this.domContainer, rootId: this.rootId }));
     };
     RenderContainer.prototype.createContainer = function () {
         var _a;
         var domContainer = (_a = this.context.globalObject.document) === null || _a === void 0 ? void 0 : _a.createElement('div');
         if (domContainer) {
-            domContainer.setAttribute('class', REACT_UI_PREFIX);
+            domContainer.setAttribute('class', Upgrade.getSpecificityClassName());
             domContainer.setAttribute(PORTAL_OUTLET_ATTR, "".concat(this.rootId));
             this.domContainer = domContainer;
         }