@skbkontur/react-ui 0.0.0-4c5579465d → 0.0.0-4da47ece08

package/cjs/internal/Menu/Menu.styles.d.ts

@@ -1,11 +1,16 @@
 import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     root(t: Theme): string;
-    rootMobile(t: Theme): string;
+    mobileRoot(t: Theme): string;
     alignRight(): string;
     alignRightIE11(): string;
     alignRightIE11FixAutoWidth(): string;
     scrollContainer(t: Theme): string;
     scrollContainerMobile(t: Theme): string;
     shadow(t: Theme): string;
+    wrapper(): string;
+    headerWrapper(): string;
+    footerWrapper(): string;
+    contentWrapper(): string;
+    menuSeparatorWrapper(t: Theme): string;
 };

package/cjs/internal/Menu/Menu.styles.js

@@ -1,20 +1,19 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
 
 
 var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-radius: ", ";\n      box-sizing: ", ";\n      overflow: auto;\n      padding: 0 ", ";\n      margin: ", " 0;\n      border-radius: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-radius: ", ";\n      box-sizing: ", ";\n      outline: none;\n      padding: ", " ", ";\n      margin: ", " 0;\n    "])),
     t.menuBgDefault,
     t.menuBorderRadius,
     t.menuBoxSizing,
 
-    t.menuPaddingX,
-    t.menuOffsetY,
-    t.menuBorderRadius);
+    t.menuPaddingY, t.menuPaddingX,
+    t.menuOffsetY);
 
   },
 
-  rootMobile: function rootMobile(t) {
+  mobileRoot: function mobileRoot(t) {
     return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-radius: 0;\n      margin: 0;\n      padding: 0 ", ";\n    "])),
 
 
@@ -44,13 +43,13 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   scrollContainer: function scrollContainer(t) {
     return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " 0;\n    "])),
-    t.menuPaddingY);
+    t.menuScrollContainerContentWrapperPaddingY);
 
   },
 
   scrollContainerMobile: function scrollContainerMobile(t) {
     return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " 0;\n    "])),
-    t.mobileMenuPaddingY);
+    t.mobileMenuScrollContainerContentWrapperPaddingY);
 
   },
 
@@ -59,4 +58,39 @@ var styles = (0, _Emotion.memoizeStyle)({
     t.menuBorder,
     t.menuShadow);
 
+  },
+
+  wrapper: function wrapper() {
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      position: relative;\n      z-index: 1;\n      width: 100%;\n      overflow: hidden;\n      line-height: 18px;\n      box-sizing: border-box;\n    "])));
+
+
+
+
+
+
+
+  },
+
+  headerWrapper: function headerWrapper() {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      top: -5px;\n    "])));
+
+
+  },
+
+  footerWrapper: function footerWrapper() {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      bottom: -5px;\n    "])));
+
+
+  },
+
+  contentWrapper: function contentWrapper() {
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: 6px 18px 7px 8px;\n    "])));
+
+
+  },
+
+  menuSeparatorWrapper: function menuSeparatorWrapper(t) {
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      height: ", ";\n    "])),
+    t.menuSeparatorBorderWidth);
+
   } });exports.styles = styles;

package/cjs/internal/Menu/Menu.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","menuBgDefault","menuBorderRadius","menuBoxSizing","menuPaddingX","menuOffsetY","rootMobile","mobileMenuPaddingX","alignRight","alignRightIE11","alignRightIE11FixAutoWidth","scrollContainer","menuPaddingY","scrollContainerMobile","mobileMenuPaddingY","shadow","menuBorder","menuShadow"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,aADlB;AAEmBF,IAAAA,CAAC,CAACG,gBAFrB;AAGgBH,IAAAA,CAAC,CAACI,aAHlB;;AAKeJ,IAAAA,CAAC,CAACK,YALjB;AAMYL,IAAAA,CAAC,CAACM,WANd;AAOmBN,IAAAA,CAAC,CAACG,gBAPrB;;AASD,GAXgC;;AAajCI,EAAAA,UAbiC,sBAatBP,CAbsB,EAaZ;AACnB,eAAOC,YAAP;;;AAGeD,IAAAA,CAAC,CAACQ,kBAHjB;;AAKD,GAnBgC;;AAqBjCC,EAAAA,UArBiC,wBAqBpB;AACX,eAAOR,YAAP;;;AAGD,GAzBgC;;AA2BjCS,EAAAA,cA3BiC,4BA2BhB;AACf,eAAOT,YAAP;;;;AAID,GAhCgC;;AAkCjCU,EAAAA,0BAlCiC,wCAkCJ;AAC3B,eAAOV,YAAP;;;;AAID,GAvCgC;;AAyCjCW,EAAAA,eAzCiC,2BAyCjBZ,CAzCiB,EAyCP;AACxB,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACa,YADf;;AAGD,GA7CgC;;AA+CjCC,EAAAA,qBA/CiC,iCA+CXd,CA/CW,EA+CD;AAC9B,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACe,kBADf;;AAGD,GAnDgC;;AAqDjCC,EAAAA,MArDiC,kBAqD1BhB,CArD0B,EAqDhB;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACiB,UADd;AAEgBjB,IAAAA,CAAC,CAACkB,UAFlB;;AAID,GA1DgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      background: ${t.menuBgDefault};\n      border-radius: ${t.menuBorderRadius};\n      box-sizing: ${t.menuBoxSizing};\n      overflow: auto;\n      padding: 0 ${t.menuPaddingX};\n      margin: ${t.menuOffsetY} 0;\n      border-radius: ${t.menuBorderRadius};\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      border-radius: 0;\n      margin: 0;\n      padding: 0 ${t.mobileMenuPaddingX};\n    `;\n  },\n\n  alignRight() {\n    return css`\n      flex: 1 1 100%;\n    `;\n  },\n\n  alignRightIE11() {\n    return css`\n      float: right;\n      width: 100%;\n    `;\n  },\n\n  alignRightIE11FixAutoWidth() {\n    return css`\n      box-sizing: border-box !important; // override root styles\n      overflow: hidden !important; // override root styles\n    `;\n  },\n\n  scrollContainer(t: Theme) {\n    return css`\n      padding: ${t.menuPaddingY} 0;\n    `;\n  },\n\n  scrollContainerMobile(t: Theme) {\n    return css`\n      padding: ${t.mobileMenuPaddingY} 0;\n    `;\n  },\n\n  shadow(t: Theme) {\n    return css`\n      border: ${t.menuBorder};\n      box-shadow: ${t.menuShadow};\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","menuBgDefault","menuBorderRadius","menuBoxSizing","menuPaddingY","menuPaddingX","menuOffsetY","mobileRoot","mobileMenuPaddingX","alignRight","alignRightIE11","alignRightIE11FixAutoWidth","scrollContainer","menuScrollContainerContentWrapperPaddingY","scrollContainerMobile","mobileMenuScrollContainerContentWrapperPaddingY","shadow","menuBorder","menuShadow","wrapper","headerWrapper","footerWrapper","contentWrapper","menuSeparatorWrapper","menuSeparatorBorderWidth"],"mappings":"oRAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,aADlB;AAEmBF,IAAAA,CAAC,CAACG,gBAFrB;AAGgBH,IAAAA,CAAC,CAACI,aAHlB;;AAKaJ,IAAAA,CAAC,CAACK,YALf,EAK+BL,CAAC,CAACM,YALjC;AAMYN,IAAAA,CAAC,CAACO,WANd;;AAQD,GAVgC;;AAYjCC,EAAAA,UAZiC,sBAYtBR,CAZsB,EAYZ;AACnB,eAAOC,YAAP;;;AAGeD,IAAAA,CAAC,CAACS,kBAHjB;;AAKD,GAlBgC;;AAoBjCC,EAAAA,UApBiC,wBAoBpB;AACX,eAAOT,YAAP;;;AAGD,GAxBgC;;AA0BjCU,EAAAA,cA1BiC,4BA0BhB;AACf,eAAOV,YAAP;;;;AAID,GA/BgC;;AAiCjCW,EAAAA,0BAjCiC,wCAiCJ;AAC3B,eAAOX,YAAP;;;;AAID,GAtCgC;;AAwCjCY,EAAAA,eAxCiC,2BAwCjBb,CAxCiB,EAwCP;AACxB,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACc,yCADf;;AAGD,GA5CgC;;AA8CjCC,EAAAA,qBA9CiC,iCA8CXf,CA9CW,EA8CD;AAC9B,eAAOC,YAAP;AACaD,IAAAA,CAAC,CAACgB,+CADf;;AAGD,GAlDgC;;AAoDjCC,EAAAA,MApDiC,kBAoD1BjB,CApD0B,EAoDhB;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACkB,UADd;AAEgBlB,IAAAA,CAAC,CAACmB,UAFlB;;AAID,GAzDgC;;AA2DjCC,EAAAA,OA3DiC,qBA2DvB;AACR,eAAOnB,YAAP;;;;;;;;AAQD,GApEgC;;AAsEjCoB,EAAAA,aAtEiC,2BAsEjB;AACd,eAAOpB,YAAP;;;AAGD,GA1EgC;;AA4EjCqB,EAAAA,aA5EiC,2BA4EjB;AACd,eAAOrB,YAAP;;;AAGD,GAhFgC;;AAkFjCsB,EAAAA,cAlFiC,4BAkFhB;AACf,eAAOtB,YAAP;;;AAGD,GAtFgC;;AAwFjCuB,EAAAA,oBAxFiC,gCAwFZxB,CAxFY,EAwFF;AAC7B,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACyB,wBADd;;AAGD,GA5FgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      background: ${t.menuBgDefault};\n      border-radius: ${t.menuBorderRadius};\n      box-sizing: ${t.menuBoxSizing};\n      outline: none;\n      padding: ${t.menuPaddingY} ${t.menuPaddingX};\n      margin: ${t.menuOffsetY} 0;\n    `;\n  },\n\n  mobileRoot(t: Theme) {\n    return css`\n      border-radius: 0;\n      margin: 0;\n      padding: 0 ${t.mobileMenuPaddingX};\n    `;\n  },\n\n  alignRight() {\n    return css`\n      flex: 1 1 100%;\n    `;\n  },\n\n  alignRightIE11() {\n    return css`\n      float: right;\n      width: 100%;\n    `;\n  },\n\n  alignRightIE11FixAutoWidth() {\n    return css`\n      box-sizing: border-box !important; // override root styles\n      overflow: hidden !important; // override root styles\n    `;\n  },\n\n  scrollContainer(t: Theme) {\n    return css`\n      padding: ${t.menuScrollContainerContentWrapperPaddingY} 0;\n    `;\n  },\n\n  scrollContainerMobile(t: Theme) {\n    return css`\n      padding: ${t.mobileMenuScrollContainerContentWrapperPaddingY} 0;\n    `;\n  },\n\n  shadow(t: Theme) {\n    return css`\n      border: ${t.menuBorder};\n      box-shadow: ${t.menuShadow};\n    `;\n  },\n\n  wrapper() {\n    return css`\n      position: relative;\n      z-index: 1;\n      width: 100%;\n      overflow: hidden;\n      line-height: 18px;\n      box-sizing: border-box;\n    `;\n  },\n\n  headerWrapper() {\n    return css`\n      top: -5px;\n    `;\n  },\n\n  footerWrapper() {\n    return css`\n      bottom: -5px;\n    `;\n  },\n\n  contentWrapper() {\n    return css`\n      padding: 6px 18px 7px 8px;\n    `;\n  },\n\n  menuSeparatorWrapper(t: Theme) {\n    return css`\n      height: ${t.menuSeparatorBorderWidth};\n    `;\n  },\n});\n"]}

package/cjs/internal/Menu/MenuContext.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { MenuItem } from '../../components/MenuItem';
+import { MenuNavigation } from './MenuNavigation';
+export interface MenuContextType {
+    navigation: MenuNavigation<MenuItem> | null;
+    enableIconPadding: boolean;
+    setEnableIconPadding?: (isIconPaddingEnabled: boolean) => void;
+    onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
+}
+export declare const MenuContext: React.Context<MenuContextType>;

package/cjs/internal/Menu/MenuContext.js

@@ -0,0 +1,16 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.MenuContext = void 0;var _react = _interopRequireDefault(require("react"));
+
+
+
+
+
+
+
+
+
+
+
+
+var MenuContext = /*#__PURE__*/_react.default.createContext({
+  navigation: null,
+  enableIconPadding: false });exports.MenuContext = MenuContext;

package/cjs/internal/Menu/MenuContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["MenuContext.ts"],"names":["MenuContext","React","createContext","navigation","enableIconPadding"],"mappings":"iKAAA;;;;;;;;;;;;;AAaO,IAAMA,WAAW,gBAAGC,eAAMC,aAAN,CAAqC;AAC9DC,EAAAA,UAAU,EAAE,IADkD;AAE9DC,EAAAA,iBAAiB,EAAE,KAF2C,EAArC,CAApB,C","sourcesContent":["import React from 'react';\n\nimport { MenuItem } from '../../components/MenuItem';\n\nimport { MenuNavigation } from './MenuNavigation';\n\nexport interface MenuContextType {\n  navigation: MenuNavigation<MenuItem> | null;\n  enableIconPadding: boolean;\n  setEnableIconPadding?: (isIconPaddingEnabled: boolean) => void;\n  onItemClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n}\n\nexport const MenuContext = React.createContext<MenuContextType>({\n  navigation: null,\n  enableIconPadding: false,\n});\n"]}

package/cjs/internal/Menu/MenuNavigation.d.ts

@@ -0,0 +1,26 @@
+import React, { RefObject } from 'react';
+interface Highlightable {
+    highlight(): void;
+    unhighlight(): void;
+    select(...args: unknown[]): void;
+    isEnabled(): boolean;
+}
+export declare class MenuNavigation<T extends Highlightable> {
+    private readonly root;
+    private readonly itemsContentDataTid;
+    private tagsAndItems;
+    highlightedItem: T | null;
+    items: T[];
+    constructor(root: RefObject<HTMLDivElement> | null, itemsContentDataTid: string);
+    private update;
+    add(tag: Element, item: T): void;
+    remove(tag: HTMLElement): void;
+    move(step: number, isCyclic: boolean): number;
+    highlight(item: T | null): void;
+    highlightByIndex(index: number): void;
+    unhighlight(): void;
+    select(event: React.SyntheticEvent<HTMLElement>): boolean;
+    reset(): void;
+    private getEnabledItems;
+}
+export {};

package/cjs/internal/Menu/MenuNavigation.js

@@ -0,0 +1,107 @@
+"use strict";exports.__esModule = true;exports.MenuNavigation = void 0;var
+
+
+
+
+
+
+
+
+MenuNavigation = /*#__PURE__*/function () {
+
+
+
+
+
+
+
+  function MenuNavigation(root, itemsContentDataTid) {var _this = this;this.tagsAndItems = new WeakMap();this.highlightedItem = null;this.items = [];this.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    getEnabledItems = function () {
+      return _this.items.filter(function (item) {return item.isEnabled();});
+    };this.root = root;this.itemsContentDataTid = itemsContentDataTid;}var _proto = MenuNavigation.prototype;_proto.update = function update() {var _this$root,_this2 = this;if ((_this$root = this.root) != null && _this$root.current) {var menuItems = Array.from(this.root.current.querySelectorAll("span[data-tid=\"" + this.itemsContentDataTid + "\"]"));this.items = menuItems.map(function (item) {return _this2.tagsAndItems.get(item);}).filter(function (item) {return item !== undefined;});}};_proto.add = function add(tag, item) {var _this$root2;this.tagsAndItems.set(tag, item);if ((_this$root2 = this.root) != null && _this$root2.current) {this.update();} else {this.items.push(item);}};_proto.remove = function remove(tag) {this.tagsAndItems.delete(tag);this.update();};_proto.move = function move(step, isCyclic) {var enabledItems = this.getEnabledItems();var currentIndex = this.highlightedItem ? enabledItems.indexOf(this.highlightedItem) : -1;var minIndex = 0;var maxIndex = enabledItems.length - 1;var nextIndex = currentIndex + step;if (nextIndex < minIndex) {nextIndex = isCyclic ? maxIndex : minIndex;}if (nextIndex > maxIndex) {nextIndex = isCyclic ? minIndex : maxIndex;}var nextItem = enabledItems[nextIndex];this.highlight(nextItem);return nextIndex;};_proto.highlight = function highlight(item) {var _this3 = this;var enabledItems = this.getEnabledItems();enabledItems.forEach(function (_item) {if (item === _item) {_item.highlight();_this3.highlightedItem = item;} else {_item.unhighlight();}});};_proto.highlightByIndex = function highlightByIndex(index) {var _this4 = this;this.items.forEach(function (_item, i) {if (index === i && _item.isEnabled()) {_item.highlight();_this4.highlightedItem = _item;} else {_item.unhighlight();}});};_proto.unhighlight = function unhighlight() {var _this$highlightedItem;(_this$highlightedItem = this.highlightedItem) == null ? void 0 : _this$highlightedItem.unhighlight();this.highlightedItem = null;};_proto.select = function select(event) {if (this.highlightedItem) {this.highlightedItem.select(event);return true;}return false;};_proto.reset = function reset() {this.highlight(null);this.highlightedItem = null;};return MenuNavigation;}();exports.MenuNavigation = MenuNavigation;

package/cjs/internal/Menu/MenuNavigation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["MenuNavigation.tsx"],"names":["MenuNavigation","root","itemsContentDataTid","tagsAndItems","WeakMap","highlightedItem","items","getEnabledItems","filter","item","isEnabled","update","current","menuItems","Array","from","querySelectorAll","map","get","undefined","add","tag","set","push","remove","delete","move","step","isCyclic","enabledItems","currentIndex","indexOf","minIndex","maxIndex","length","nextIndex","nextItem","highlight","forEach","_item","unhighlight","highlightByIndex","index","i","select","event","reset"],"mappings":";;;;;;;;;AASaA,c;;;;;;;;AAQX,0BAAYC,IAAZ,EAAoDC,mBAApD,EAAiF,uBALzEC,YAKyE,GALrC,IAAIC,OAAJ,EAKqC,MAH1EC,eAG0E,GAH9C,IAG8C,MAF1EC,KAE0E,GAF7D,EAE6D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuFzEC,IAAAA,eAvFyE,GAuFvD,YAAM;AAC9B,aAAO,KAAI,CAACD,KAAL,CAAWE,MAAX,CAAkB,UAACC,IAAD,UAAUA,IAAI,CAACC,SAAL,EAAV,EAAlB,CAAP;AACD,KAzFgF,CAC/E,KAAKT,IAAL,GAAYA,IAAZ,CACA,KAAKC,mBAAL,GAA2BA,mBAA3B,CACD,C,6CAEOS,M,GAAR,kBAAiB,8BACf,kBAAI,KAAKV,IAAT,aAAI,WAAWW,OAAf,EAAwB,CACtB,IAAMC,SAAS,GAAGC,KAAK,CAACC,IAAN,CAAW,KAAKd,IAAL,CAAUW,OAAV,CAAkBI,gBAAlB,sBAAqD,KAAKd,mBAA1D,SAAX,CAAlB,CACA,KAAKI,KAAL,GAAaO,SAAS,CAACI,GAAV,CAAc,UAACR,IAAD,UAAU,MAAI,CAACN,YAAL,CAAkBe,GAAlB,CAAsBT,IAAtB,CAAV,EAAd,EAAqDD,MAArD,CAA4D,UAACC,IAAD,UAAqBA,IAAI,KAAKU,SAA9B,EAA5D,CAAb,CACD,CACF,C,QAEMC,G,GAAP,aAAWC,GAAX,EAAyBZ,IAAzB,EAAkC,iBAChC,KAAKN,YAAL,CAAkBmB,GAAlB,CAAsBD,GAAtB,EAA2BZ,IAA3B,EACA,mBAAI,KAAKR,IAAT,aAAI,YAAWW,OAAf,EAAwB,CACtB,KAAKD,MAAL,GACD,CAFD,MAEO,CACL,KAAKL,KAAL,CAAWiB,IAAX,CAAgBd,IAAhB,EACD,CACF,C,QAEMe,M,GAAP,gBAAcH,GAAd,EAAgC,CAC9B,KAAKlB,YAAL,CAAkBsB,MAAlB,CAAyBJ,GAAzB,EACA,KAAKV,MAAL,GACD,C,QAEMe,I,GAAP,cAAYC,IAAZ,EAA0BC,QAA1B,EAA6C,CAC3C,IAAMC,YAAY,GAAG,KAAKtB,eAAL,EAArB,CACA,IAAMuB,YAAY,GAAG,KAAKzB,eAAL,GAAuBwB,YAAY,CAACE,OAAb,CAAqB,KAAK1B,eAA1B,CAAvB,GAAoE,CAAC,CAA1F,CACA,IAAM2B,QAAQ,GAAG,CAAjB,CACA,IAAMC,QAAQ,GAAGJ,YAAY,CAACK,MAAb,GAAsB,CAAvC,CACA,IAAIC,SAAS,GAAGL,YAAY,GAAGH,IAA/B,CACA,IAAIQ,SAAS,GAAGH,QAAhB,EAA0B,CACxBG,SAAS,GAAGP,QAAQ,GAAGK,QAAH,GAAcD,QAAlC,CACD,CACD,IAAIG,SAAS,GAAGF,QAAhB,EAA0B,CACxBE,SAAS,GAAGP,QAAQ,GAAGI,QAAH,GAAcC,QAAlC,CACD,CAED,IAAMG,QAAQ,GAAGP,YAAY,CAACM,SAAD,CAA7B,CAEA,KAAKE,SAAL,CAAeD,QAAf,EAEA,OAAOD,SAAP,CACD,C,QAEME,S,GAAP,mBAAiB5B,IAAjB,EAAiC,mBAC/B,IAAMoB,YAAY,GAAG,KAAKtB,eAAL,EAArB,CACAsB,YAAY,CAACS,OAAb,CAAqB,UAACC,KAAD,EAAW,CAC9B,IAAI9B,IAAI,KAAK8B,KAAb,EAAoB,CAClBA,KAAK,CAACF,SAAN,GACA,MAAI,CAAChC,eAAL,GAAuBI,IAAvB,CACD,CAHD,MAGO,CACL8B,KAAK,CAACC,WAAN,GACD,CACF,CAPD,EAQD,C,QAEMC,gB,GAAP,0BAAwBC,KAAxB,EAAuC,mBACrC,KAAKpC,KAAL,CAAWgC,OAAX,CAAmB,UAACC,KAAD,EAAQI,CAAR,EAAc,CAC/B,IAAID,KAAK,KAAKC,CAAV,IAAeJ,KAAK,CAAC7B,SAAN,EAAnB,EAAsC,CACpC6B,KAAK,CAACF,SAAN,GACA,MAAI,CAAChC,eAAL,GAAuBkC,KAAvB,CACD,CAHD,MAGO,CACLA,KAAK,CAACC,WAAN,GACD,CACF,CAPD,EAQD,C,QAEMA,W,GAAP,uBAAqB,2BACnB,8BAAKnC,eAAL,2CAAsBmC,WAAtB,GACA,KAAKnC,eAAL,GAAuB,IAAvB,CACD,C,QAEMuC,M,GAAP,gBAAcC,KAAd,EAAwD,CACtD,IAAI,KAAKxC,eAAT,EAA0B,CACxB,KAAKA,eAAL,CAAqBuC,MAArB,CAA4BC,KAA5B,EACA,OAAO,IAAP,CACD,CACD,OAAO,KAAP,CACD,C,QAEMC,K,GAAP,iBAAe,CACb,KAAKT,SAAL,CAAe,IAAf,EACA,KAAKhC,eAAL,GAAuB,IAAvB,CACD,C","sourcesContent":["import React, { RefObject } from 'react';\n\ninterface Highlightable {\n  highlight(): void;\n  unhighlight(): void;\n  select(...args: unknown[]): void;\n  isEnabled(): boolean;\n}\n\nexport class MenuNavigation<T extends Highlightable> {\n  private readonly root: RefObject<HTMLDivElement> | null;\n  private readonly itemsContentDataTid: string;\n  private tagsAndItems: WeakMap<Element, T> = new WeakMap();\n\n  public highlightedItem: T | null = null;\n  public items: T[] = [];\n\n  constructor(root: RefObject<HTMLDivElement> | null, itemsContentDataTid: string) {\n    this.root = root;\n    this.itemsContentDataTid = itemsContentDataTid;\n  }\n\n  private update() {\n    if (this.root?.current) {\n      const menuItems = Array.from(this.root.current.querySelectorAll(`span[data-tid=\"${this.itemsContentDataTid}\"]`));\n      this.items = menuItems.map((item) => this.tagsAndItems.get(item)).filter((item): item is T => item !== undefined);\n    }\n  }\n\n  public add(tag: Element, item: T) {\n    this.tagsAndItems.set(tag, item);\n    if (this.root?.current) {\n      this.update();\n    } else {\n      this.items.push(item);\n    }\n  }\n\n  public remove(tag: HTMLElement) {\n    this.tagsAndItems.delete(tag);\n    this.update();\n  }\n\n  public move(step: number, isCyclic: boolean) {\n    const enabledItems = this.getEnabledItems();\n    const currentIndex = this.highlightedItem ? enabledItems.indexOf(this.highlightedItem) : -1;\n    const minIndex = 0;\n    const maxIndex = enabledItems.length - 1;\n    let nextIndex = currentIndex + step;\n    if (nextIndex < minIndex) {\n      nextIndex = isCyclic ? maxIndex : minIndex;\n    }\n    if (nextIndex > maxIndex) {\n      nextIndex = isCyclic ? minIndex : maxIndex;\n    }\n\n    const nextItem = enabledItems[nextIndex];\n\n    this.highlight(nextItem);\n\n    return nextIndex;\n  }\n\n  public highlight(item: T | null) {\n    const enabledItems = this.getEnabledItems();\n    enabledItems.forEach((_item) => {\n      if (item === _item) {\n        _item.highlight();\n        this.highlightedItem = item;\n      } else {\n        _item.unhighlight();\n      }\n    });\n  }\n\n  public highlightByIndex(index: number) {\n    this.items.forEach((_item, i) => {\n      if (index === i && _item.isEnabled()) {\n        _item.highlight();\n        this.highlightedItem = _item;\n      } else {\n        _item.unhighlight();\n      }\n    });\n  }\n\n  public unhighlight() {\n    this.highlightedItem?.unhighlight();\n    this.highlightedItem = null;\n  }\n\n  public select(event: React.SyntheticEvent<HTMLElement>) {\n    if (this.highlightedItem) {\n      this.highlightedItem.select(event);\n      return true;\n    }\n    return false;\n  }\n\n  public reset() {\n    this.highlight(null);\n    this.highlightedItem = null;\n  }\n\n  private getEnabledItems = () => {\n    return this.items.filter((item) => item.isEnabled());\n  };\n}\n"]}

package/cjs/internal/Menu/isActiveElement.js

@@ -3,5 +3,5 @@
 var _MenuItem = require("../../components/MenuItem");
 
 function isActiveElement(element) {
-  return (0, _MenuItem.isMenuItem)(element) && !element.props.disabled;
+  return (0, _MenuItem.isMenuItem)(element) && !element.props.disabled && !element.props.isNotSelectable;
 }

package/cjs/internal/Menu/isActiveElement.js.map

@@ -1 +1 @@
-{"version":3,"sources":["isActiveElement.tsx"],"names":["isActiveElement","element","props","disabled"],"mappings":";;AAEA;;AAEO,SAASA,eAAT,CAAyBC,OAAzB,EAAmG;AACxG,SAAO,0BAAWA,OAAX,KAAuB,CAACA,OAAO,CAACC,KAAR,CAAcC,QAA7C;AACD","sourcesContent":["import React from 'react';\n\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\n\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\n  return isMenuItem(element) && !element.props.disabled;\n}\n"]}
+{"version":3,"sources":["isActiveElement.tsx"],"names":["isActiveElement","element","props","disabled","isNotSelectable"],"mappings":";;AAEA;;AAEO,SAASA,eAAT,CAAyBC,OAAzB,EAAmG;AACxG,SAAO,0BAAWA,OAAX,KAAuB,CAACA,OAAO,CAACC,KAAR,CAAcC,QAAtC,IAAkD,CAACF,OAAO,CAACC,KAAR,CAAcE,eAAxE;AACD","sourcesContent":["import React from 'react';\n\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\n\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\n  return isMenuItem(element) && !element.props.disabled && !element.props.isNotSelectable;\n}\n"]}

package/cjs/internal/MenuMessage/MenuMessage.d.ts

@@ -1,10 +1,12 @@
 import React from 'react';
 import { CommonProps } from '../CommonWrapper';
+import { SizeProp } from '../../lib/types/props';
 export interface MenuMessageProps extends CommonProps {
     children: React.ReactNode;
     as?: React.ElementType;
+    size?: SizeProp;
 }
 export declare const MenuMessageDataTids: {
     readonly root: "MenuMessage__root";
 };
-export declare const MenuMessage: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLOrSVGElement, MenuMessageProps>;
+export declare const MenuMessage: import("../../lib/forwardRefAndName").ReactUIComponentWithRef<HTMLOrSVGElement, MenuMessageProps> & Record<never, never>;

package/cjs/internal/MenuMessage/MenuMessage.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MenuMessageDataTids = exports.MenuMessage = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.MenuMessageDataTids = exports.MenuMessage = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
 
 var _forwardRefAndName = require("../../lib/forwardRefAndName");
 var _ResponsiveLayout = require("../../components/ResponsiveLayout");
@@ -6,7 +6,9 @@ var _Emotion = require("../../lib/theming/Emotion");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 
 
-var _MenuMessage = require("./MenuMessage.styles");var _excluded = ["children", "className", "as"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+
+var _MenuMessage = require("./MenuMessage.styles");var _excluded = ["children", "className", "size", "as"];
+
 
 
 
@@ -19,16 +21,29 @@ var MenuMessageDataTids = {
 
 var MenuMessage = (0, _forwardRefAndName.forwardRefAndName)(
 'MenuMessage',
-function (_ref, ref) {var _cx;var children = _ref.children,className = _ref.className,_ref$as = _ref.as,Tag = _ref$as === void 0 ? 'p' : _ref$as,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+function (_ref, ref) {var _cx;var children = _ref.children,className = _ref.className,_ref$size = _ref.size,size = _ref$size === void 0 ? 'small' : _ref$size,_ref$as = _ref.as,Tag = _ref$as === void 0 ? 'p' : _ref$as,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
   var _useResponsiveLayout = (0, _ResponsiveLayout.useResponsiveLayout)(),isMobile = _useResponsiveLayout.isMobile;
 
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
 
+  var getMenuMessageSizeClassName = function getMenuMessageSizeClassName() {
+    switch (size) {
+      case 'large':
+        return (0, _Emotion.cx)(_MenuMessage.styles.rootLarge(theme));
+      case 'medium':
+        return (0, _Emotion.cx)(_MenuMessage.styles.rootMedium(theme));
+      case 'small':
+      default:
+        return (0, _Emotion.cx)(_MenuMessage.styles.rootSmall(theme));}
+
+  };
+
   return /*#__PURE__*/(
     _react.default.createElement(Tag, (0, _extends2.default)({
       ref: ref,
       "data-tid": MenuMessageDataTids.root,
-      className: (0, _Emotion.cx)((_cx = {}, _cx[
+      className: (0, _Emotion.cx)(
+      getMenuMessageSizeClassName(), (_cx = {}, _cx[
 
       _MenuMessage.styles.root(theme)] = true, _cx[
       _MenuMessage.styles.rootMobile(theme)] = isMobile, _cx),

package/cjs/internal/MenuMessage/MenuMessage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MenuMessage.tsx"],"names":["MenuMessageDataTids","root","MenuMessage","ref","children","className","as","Tag","rest","isMobile","theme","ThemeContext","styles","rootMobile"],"mappings":"qYAAA;;AAEA;AACA;AACA;AACA;;;AAGA,mD;;;;;;;AAOO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B,C;;;AAIA,IAAMC,WAAW,GAAG;AACzB,aADyB;AAEzB,gBAAkDC,GAAlD,EAA0D,aAAvDC,QAAuD,QAAvDA,QAAuD,CAA7CC,SAA6C,QAA7CA,SAA6C,gBAAlCC,EAAkC,CAA9BC,GAA8B,wBAAxB,GAAwB,WAAhBC,IAAgB;AACxD,6BAAqB,4CAArB,CAAQC,QAAR,wBAAQA,QAAR;;AAEA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,GAAD;AACE,MAAA,GAAG,EAAER,GADP;AAEE,kBAAUH,mBAAmB,CAACC,IAFhC;AAGE,MAAA,SAAS,EAAE;;AAENW,0BAAOX,IAAP,CAAYS,KAAZ,CAFM,IAEe,IAFf;AAGNE,0BAAOC,UAAP,CAAkBH,KAAlB,CAHM,IAGqBD,QAHrB;;AAKTJ,MAAAA,SALS,CAHb;;AAUMG,IAAAA,IAVN;;AAYGJ,IAAAA,QAZH,CADF;;;AAgBD,CAvBwB,CAApB,C","sourcesContent":["import React, { useContext } from 'react';\n\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { useResponsiveLayout } from '../../components/ResponsiveLayout';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps } from '../CommonWrapper';\n\nimport { styles } from './MenuMessage.styles';\n\nexport interface MenuMessageProps extends CommonProps {\n  children: React.ReactNode;\n  as?: React.ElementType;\n}\n\nexport const MenuMessageDataTids = {\n  root: 'MenuMessage__root',\n} as const;\n\nexport const MenuMessage = forwardRefAndName<HTMLOrSVGElement, MenuMessageProps>(\n  'MenuMessage',\n  ({ children, className, as: Tag = 'p', ...rest }, ref) => {\n    const { isMobile } = useResponsiveLayout();\n\n    const theme = useContext(ThemeContext);\n\n    return (\n      <Tag\n        ref={ref}\n        data-tid={MenuMessageDataTids.root}\n        className={cx(\n          {\n            [styles.root(theme)]: true,\n            [styles.rootMobile(theme)]: isMobile,\n          },\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </Tag>\n    );\n  },\n);\n"]}
+{"version":3,"sources":["MenuMessage.tsx"],"names":["MenuMessageDataTids","root","MenuMessage","ref","children","className","size","as","Tag","rest","isMobile","theme","ThemeContext","getMenuMessageSizeClassName","styles","rootLarge","rootMedium","rootSmall","rootMobile"],"mappings":"4eAAA;;AAEA;AACA;AACA;AACA;;;;AAIA,mD;;;;;;;;AAQO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B,EAA5B,C;;;AAIA,IAAMC,WAAW,GAAG;AACzB,aADyB;AAEzB,gBAAkEC,GAAlE,EAA0E,aAAvEC,QAAuE,QAAvEA,QAAuE,CAA7DC,SAA6D,QAA7DA,SAA6D,kBAAlDC,IAAkD,CAAlDA,IAAkD,0BAA3C,OAA2C,4BAAlCC,EAAkC,CAA9BC,GAA8B,wBAAxB,GAAwB,WAAhBC,IAAgB;AACxE,6BAAqB,4CAArB,CAAQC,QAAR,wBAAQA,QAAR;;AAEA,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA,MAAMC,2BAA2B,GAAG,SAA9BA,2BAA8B,GAAM;AACxC,YAAQP,IAAR;AACE,WAAK,OAAL;AACE,eAAO,iBAAGQ,oBAAOC,SAAP,CAAiBJ,KAAjB,CAAH,CAAP;AACF,WAAK,QAAL;AACE,eAAO,iBAAGG,oBAAOE,UAAP,CAAkBL,KAAlB,CAAH,CAAP;AACF,WAAK,OAAL;AACA;AACE,eAAO,iBAAGG,oBAAOG,SAAP,CAAiBN,KAAjB,CAAH,CAAP,CAPJ;;AASD,GAVD;;AAYA;AACE,iCAAC,GAAD;AACE,MAAA,GAAG,EAAER,GADP;AAEE,kBAAUH,mBAAmB,CAACC,IAFhC;AAGE,MAAA,SAAS,EAAE;AACTY,MAAAA,2BAA2B,EADlB;;AAGNC,0BAAOb,IAAP,CAAYU,KAAZ,CAHM,IAGe,IAHf;AAING,0BAAOI,UAAP,CAAkBP,KAAlB,CAJM,IAIqBD,QAJrB;;AAMTL,MAAAA,SANS,CAHb;;AAWMI,IAAAA,IAXN;;AAaGL,IAAAA,QAbH,CADF;;;AAiBD,CApCwB,CAApB,C","sourcesContent":["import React, { useContext } from 'react';\n\nimport { forwardRefAndName } from '../../lib/forwardRefAndName';\nimport { useResponsiveLayout } from '../../components/ResponsiveLayout';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps } from '../CommonWrapper';\nimport { SizeProp } from '../../lib/types/props';\n\nimport { styles } from './MenuMessage.styles';\n\nexport interface MenuMessageProps extends CommonProps {\n  children: React.ReactNode;\n  as?: React.ElementType;\n  size?: SizeProp;\n}\n\nexport const MenuMessageDataTids = {\n  root: 'MenuMessage__root',\n} as const;\n\nexport const MenuMessage = forwardRefAndName<HTMLOrSVGElement, MenuMessageProps>(\n  'MenuMessage',\n  ({ children, className, size = 'small', as: Tag = 'p', ...rest }, ref) => {\n    const { isMobile } = useResponsiveLayout();\n\n    const theme = useContext(ThemeContext);\n\n    const getMenuMessageSizeClassName = () => {\n      switch (size) {\n        case 'large':\n          return cx(styles.rootLarge(theme));\n        case 'medium':\n          return cx(styles.rootMedium(theme));\n        case 'small':\n        default:\n          return cx(styles.rootSmall(theme));\n      }\n    };\n\n    return (\n      <Tag\n        ref={ref}\n        data-tid={MenuMessageDataTids.root}\n        className={cx(\n          getMenuMessageSizeClassName(),\n          {\n            [styles.root(theme)]: true,\n            [styles.rootMobile(theme)]: isMobile,\n          },\n          className,\n        )}\n        {...rest}\n      >\n        {children}\n      </Tag>\n    );\n  },\n);\n"]}

package/cjs/internal/MenuMessage/MenuMessage.styles.d.ts

@@ -2,4 +2,7 @@ import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     root(t: Theme): string;
     rootMobile(t: Theme): string;
+    rootSmall(t: Theme): string;
+    rootMedium(t: Theme): string;
+    rootLarge(t: Theme): string;
 };

package/cjs/internal/MenuMessage/MenuMessage.styles.js

@@ -1,6 +1,6 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
 var _Emotion = require("../../lib/theming/Emotion");
-var _MenuItem = require("../../components/MenuItem/MenuItem.styles");var _templateObject, _templateObject2;
+var _MenuItem = require("../../components/MenuItem/MenuItem.styles");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 
 var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
@@ -11,13 +11,9 @@ var styles = (0, _Emotion.memoizeStyle)({
       menuItemPaddingY: t.menuMessagePaddingY }),paddingX = _getMenuItemPaddings.paddingX,paddingY = _getMenuItemPaddings.paddingY;
 
 
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: 0;\n      padding: 0;\n\n      display: ", ";\n      line-height: ", ";\n      font-size: ", ";\n      padding: ", " ", " ", " ", ";\n      color: ", ";\n      background: ", ";\n    "])),
-
-
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin: 0;\n      display: ", ";\n      padding: ", " ", " ", " ", ";\n      color: ", ";\n      background: ", ";\n    "])),
 
     t.menuMessageDisplay,
-    t.menuMessageLineHeight,
-    t.menuMessageFontSize,
     t.menuMessagePaddingY, paddingX, paddingY, t.menuMessagePaddingX,
     t.menuMessageTextColor,
     t.menuMessageBg);
@@ -30,4 +26,23 @@ var styles = (0, _Emotion.memoizeStyle)({
     t.menuMessageLineHeightMobile,
     t.menuMessagePaddingMobile);
 
+  },
+
+  rootSmall: function rootSmall(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n    "])),
+    t.menuMessageFontSizeSmall,
+    t.menuMessageLineHeightSmall);
+
+  },
+  rootMedium: function rootMedium(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n    "])),
+    t.menuMessageFontSizeMedium,
+    t.menuMessageLineHeightMedium);
+
+  },
+  rootLarge: function rootLarge(t) {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n    "])),
+    t.menuMessageFontSizeLarge,
+    t.menuMessageLineHeightLarge);
+
   } });exports.styles = styles;

package/cjs/internal/MenuMessage/MenuMessage.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MenuMessage.styles.ts"],"names":["styles","root","t","menuItemLegacyPaddingX","menuItemPaddingX","menuMessagePaddingX","menuItemLegacyPaddingY","menuItemPaddingY","menuMessagePaddingY","paddingX","paddingY","css","menuMessageDisplay","menuMessageLineHeight","menuMessageFontSize","menuMessageTextColor","menuMessageBg","rootMobile","menuMessageFontSizeMobile","menuMessageLineHeightMobile","menuMessagePaddingMobile"],"mappings":";AACA;AACA,qE;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,+BAA+B,mCAAoB;AACjDC,MAAAA,sBAAsB,EAAED,CAAC,CAACC,sBADuB;AAEjDC,MAAAA,gBAAgB,EAAEF,CAAC,CAACG,mBAF6B;AAGjDC,MAAAA,sBAAsB,EAAEJ,CAAC,CAACI,sBAHuB;AAIjDC,MAAAA,gBAAgB,EAAEL,CAAC,CAACM,mBAJ6B,EAApB,CAA/B,CAAQC,QAAR,wBAAQA,QAAR,CAAkBC,QAAlB,wBAAkBA,QAAlB;;;AAOA,eAAOC,YAAP;;;;AAIaT,IAAAA,CAAC,CAACU,kBAJf;AAKiBV,IAAAA,CAAC,CAACW,qBALnB;AAMeX,IAAAA,CAAC,CAACY,mBANjB;AAOaZ,IAAAA,CAAC,CAACM,mBAPf,EAOsCC,QAPtC,EAOkDC,QAPlD,EAO8DR,CAAC,CAACG,mBAPhE;AAQWH,IAAAA,CAAC,CAACa,oBARb;AASgBb,IAAAA,CAAC,CAACc,aATlB;;AAWD,GApBgC;;AAsBjCC,EAAAA,UAtBiC,sBAsBtBf,CAtBsB,EAsBZ;AACnB,eAAOS,YAAP;AACeT,IAAAA,CAAC,CAACgB,yBADjB;AAEiBhB,IAAAA,CAAC,CAACiB,2BAFnB;AAGajB,IAAAA,CAAC,CAACkB,wBAHf;;AAKD,GA5BgC,EAAb,CAAf,C","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { getMenuItemPaddings } from '../../components/MenuItem/MenuItem.styles';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const { paddingX, paddingY } = getMenuItemPaddings({\n      menuItemLegacyPaddingX: t.menuItemLegacyPaddingX,\n      menuItemPaddingX: t.menuMessagePaddingX,\n      menuItemLegacyPaddingY: t.menuItemLegacyPaddingY,\n      menuItemPaddingY: t.menuMessagePaddingY,\n    });\n\n    return css`\n      margin: 0;\n      padding: 0;\n\n      display: ${t.menuMessageDisplay};\n      line-height: ${t.menuMessageLineHeight};\n      font-size: ${t.menuMessageFontSize};\n      padding: ${t.menuMessagePaddingY} ${paddingX} ${paddingY} ${t.menuMessagePaddingX};\n      color: ${t.menuMessageTextColor};\n      background: ${t.menuMessageBg};\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.menuMessageFontSizeMobile};\n      line-height: ${t.menuMessageLineHeightMobile};\n      padding: ${t.menuMessagePaddingMobile};\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["MenuMessage.styles.ts"],"names":["styles","root","t","menuItemLegacyPaddingX","menuItemPaddingX","menuMessagePaddingX","menuItemLegacyPaddingY","menuItemPaddingY","menuMessagePaddingY","paddingX","paddingY","css","menuMessageDisplay","menuMessageTextColor","menuMessageBg","rootMobile","menuMessageFontSizeMobile","menuMessageLineHeightMobile","menuMessagePaddingMobile","rootSmall","menuMessageFontSizeSmall","menuMessageLineHeightSmall","rootMedium","menuMessageFontSizeMedium","menuMessageLineHeightMedium","rootLarge","menuMessageFontSizeLarge","menuMessageLineHeightLarge"],"mappings":";AACA;AACA,qE;;AAEO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,IADiC,gBAC5BC,CAD4B,EAClB;AACb,+BAA+B,mCAAoB;AACjDC,MAAAA,sBAAsB,EAAED,CAAC,CAACC,sBADuB;AAEjDC,MAAAA,gBAAgB,EAAEF,CAAC,CAACG,mBAF6B;AAGjDC,MAAAA,sBAAsB,EAAEJ,CAAC,CAACI,sBAHuB;AAIjDC,MAAAA,gBAAgB,EAAEL,CAAC,CAACM,mBAJ6B,EAApB,CAA/B,CAAQC,QAAR,wBAAQA,QAAR,CAAkBC,QAAlB,wBAAkBA,QAAlB;;;AAOA,eAAOC,YAAP;;AAEaT,IAAAA,CAAC,CAACU,kBAFf;AAGaV,IAAAA,CAAC,CAACM,mBAHf,EAGsCC,QAHtC,EAGkDC,QAHlD,EAG8DR,CAAC,CAACG,mBAHhE;AAIWH,IAAAA,CAAC,CAACW,oBAJb;AAKgBX,IAAAA,CAAC,CAACY,aALlB;;AAOD,GAhBgC;;AAkBjCC,EAAAA,UAlBiC,sBAkBtBb,CAlBsB,EAkBZ;AACnB,eAAOS,YAAP;AACeT,IAAAA,CAAC,CAACc,yBADjB;AAEiBd,IAAAA,CAAC,CAACe,2BAFnB;AAGaf,IAAAA,CAAC,CAACgB,wBAHf;;AAKD,GAxBgC;;AA0BjCC,EAAAA,SA1BiC,qBA0BvBjB,CA1BuB,EA0Bb;AAClB,eAAOS,YAAP;AACeT,IAAAA,CAAC,CAACkB,wBADjB;AAEiBlB,IAAAA,CAAC,CAACmB,0BAFnB;;AAID,GA/BgC;AAgCjCC,EAAAA,UAhCiC,sBAgCtBpB,CAhCsB,EAgCZ;AACnB,eAAOS,YAAP;AACeT,IAAAA,CAAC,CAACqB,yBADjB;AAEiBrB,IAAAA,CAAC,CAACsB,2BAFnB;;AAID,GArCgC;AAsCjCC,EAAAA,SAtCiC,qBAsCvBvB,CAtCuB,EAsCb;AAClB,eAAOS,YAAP;AACeT,IAAAA,CAAC,CAACwB,wBADjB;AAEiBxB,IAAAA,CAAC,CAACyB,0BAFnB;;AAID,GA3CgC,EAAb,CAAf,C","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { getMenuItemPaddings } from '../../components/MenuItem/MenuItem.styles';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const { paddingX, paddingY } = getMenuItemPaddings({\n      menuItemLegacyPaddingX: t.menuItemLegacyPaddingX,\n      menuItemPaddingX: t.menuMessagePaddingX,\n      menuItemLegacyPaddingY: t.menuItemLegacyPaddingY,\n      menuItemPaddingY: t.menuMessagePaddingY,\n    });\n\n    return css`\n      margin: 0;\n      display: ${t.menuMessageDisplay};\n      padding: ${t.menuMessagePaddingY} ${paddingX} ${paddingY} ${t.menuMessagePaddingX};\n      color: ${t.menuMessageTextColor};\n      background: ${t.menuMessageBg};\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.menuMessageFontSizeMobile};\n      line-height: ${t.menuMessageLineHeightMobile};\n      padding: ${t.menuMessagePaddingMobile};\n    `;\n  },\n\n  rootSmall(t: Theme) {\n    return css`\n      font-size: ${t.menuMessageFontSizeSmall};\n      line-height: ${t.menuMessageLineHeightSmall};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      font-size: ${t.menuMessageFontSizeMedium};\n      line-height: ${t.menuMessageLineHeightMedium};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      font-size: ${t.menuMessageFontSizeLarge};\n      line-height: ${t.menuMessageLineHeightLarge};\n    `;\n  },\n});\n"]}

package/cjs/internal/MobilePopup/MobilePopup.d.ts

@@ -12,6 +12,10 @@ interface MobilePopupProps extends Pick<HTMLAttributes<HTMLDivElement>, 'id'> {
      * Шапка всплывающего окна
      */
     headerChildComponent?: React.ReactNode;
+    /**
+     * Подвал всплывающего окна
+     */
+    footerChildComponent?: React.ReactNode;
     /**
      * Позволяет получить контент всплывающего окна без обёртки в виде `RenderContainer`
      */
@@ -31,7 +35,10 @@ export declare const MobilePopupDataTids: {
 };
 export declare class MobilePopup extends React.Component<MobilePopupProps> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    static readonly defaultRootNode: null;
     private theme;
+    private setRootNode;
     render(): JSX.Element;
     renderMain(): JSX.Element;
     close: () => void;

package/cjs/internal/MobilePopup/MobilePopup.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MobilePopupDataTids = exports.MobilePopup = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.MobilePopupDataTids = exports.MobilePopup = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _reactTransitionGroup = require("react-transition-group");
 
 
@@ -7,9 +7,15 @@ var _RenderContainer = require("../RenderContainer");
 var _HideBodyVerticalScroll = require("../HideBodyVerticalScroll");
 var _ZIndex = require("../ZIndex");
 var _RenderLayer = require("../RenderLayer");
+var _rootNode = require("../../lib/rootNode");
 
 var _MobilePopup = require("./MobilePopup.styles");
 var _MobilePopupHeader = require("./MobilePopupHeader");
+var _MobilePopupFooter = require("./MobilePopupFooter");var _class, _class2, _temp;
+
+
+
+
 
 
 
@@ -43,7 +49,18 @@ var MobilePopupDataTids = {
   container: 'MobilePopup__container' };exports.MobilePopupDataTids = MobilePopupDataTids;var
 
 
-MobilePopup = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(MobilePopup, _React$Component);function MobilePopup() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+MobilePopup = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(MobilePopup, _React$Component);function MobilePopup() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -91,4 +108,4 @@ MobilePopup = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.defa
       if (_this.props.onCloseRequest) {
         _this.props.onCloseRequest();
       }
-    };return _this;}var _proto = MobilePopup.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var content = /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { id: this.props.id, className: _MobilePopup.jsStyles.zIndex(), priority: 'MobilePopup' }, /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, { in: this.props.opened, onExited: this.props.onClose, mountOnEnter: true, unmountOnExit: true, timeout: 0 }, /*#__PURE__*/_react.default.createElement("div", { className: _MobilePopup.jsStyles.wrapper() }, /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: this.close }, /*#__PURE__*/_react.default.createElement("div", { "data-tid": MobilePopupDataTids.container, className: _MobilePopup.jsStyles.container(this.theme) }, /*#__PURE__*/_react.default.createElement("div", { "data-tid": MobilePopupDataTids.root, className: _MobilePopup.jsStyles.root(this.theme) }, /*#__PURE__*/_react.default.createElement(_MobilePopupHeader.MobilePopupHeader, { caption: this.props.caption }, this.props.headerChildComponent), /*#__PURE__*/_react.default.createElement("div", { className: _MobilePopup.jsStyles.content(this.theme) }, this.props.children)), /*#__PURE__*/_react.default.createElement("div", { onClick: this.close, className: _MobilePopup.jsStyles.bottomIndent() }))), /*#__PURE__*/_react.default.createElement("div", { className: _MobilePopup.jsStyles.bg() }), /*#__PURE__*/_react.default.createElement(_HideBodyVerticalScroll.HideBodyVerticalScroll, null))));if (this.props.withoutRenderContainer) {return content;}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, content);};return MobilePopup;}(_react.default.Component);exports.MobilePopup = MobilePopup;MobilePopup.__KONTUR_REACT_UI__ = 'MobileMenuHeader';
+    };return _this;}var _proto = MobilePopup.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var content = /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { id: this.props.id, className: _MobilePopup.jsStyles.zIndex(), priority: 'MobilePopup' }, /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, { in: this.props.opened, onExited: this.props.onClose, mountOnEnter: true, unmountOnExit: true, timeout: 0 }, /*#__PURE__*/_react.default.createElement("div", { className: _MobilePopup.jsStyles.wrapper() }, /*#__PURE__*/_react.default.createElement(_RenderLayer.RenderLayer, { onClickOutside: this.close }, /*#__PURE__*/_react.default.createElement("div", { ref: this.setRootNode, "data-tid": MobilePopupDataTids.container, className: _MobilePopup.jsStyles.container(this.theme) }, /*#__PURE__*/_react.default.createElement("div", { "data-tid": MobilePopupDataTids.root, className: _MobilePopup.jsStyles.root(this.theme) }, /*#__PURE__*/_react.default.createElement(_MobilePopupHeader.MobilePopupHeader, { caption: this.props.caption }, this.props.headerChildComponent), /*#__PURE__*/_react.default.createElement("div", { className: _MobilePopup.jsStyles.content(this.theme) }, this.props.children), /*#__PURE__*/_react.default.createElement(_MobilePopupFooter.MobilePopupFooter, null, this.props.footerChildComponent)), /*#__PURE__*/_react.default.createElement("div", { onClick: this.close, className: _MobilePopup.jsStyles.bottomIndent() }))), /*#__PURE__*/_react.default.createElement("div", { className: _MobilePopup.jsStyles.bg() }), /*#__PURE__*/_react.default.createElement(_HideBodyVerticalScroll.HideBodyVerticalScroll, null))));if (this.props.withoutRenderContainer) {return content;}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, content);};return MobilePopup;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'MobileMenuHeader', _class2.displayName = 'MobileMenuHeader', _class2.defaultRootNode = null, _temp)) || _class;exports.MobilePopup = MobilePopup;

package/cjs/internal/MobilePopup/MobilePopup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MobilePopup.tsx"],"names":["MobilePopupDataTids","root","container","MobilePopup","close","props","onCloseRequest","render","theme","renderMain","content","id","jsStyles","zIndex","opened","onClose","wrapper","caption","headerChildComponent","children","bottomIndent","bg","withoutRenderContainer","React","Component","__KONTUR_REACT_UI__"],"mappings":"qRAAA;AACA;;;AAGA;AACA;AACA;AACA;AACA;;AAEA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B;AAEjCC,EAAAA,SAAS,EAAE,wBAFsB,EAA5B,C;;;AAKMC,W;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CJC,IAAAA,K,GAAQ,YAAM;AACnB,UAAI,MAAKC,KAAL,CAAWC,cAAf,EAA+B;AAC7B,cAAKD,KAAL,CAAWC,cAAX;AACD;AACF,K,yDA3CMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACC,UAAL,EAAP,CACD,CAJH,CADF,CAQD,C,QAEMA,U,GAAP,sBAAoB,CAClB,IAAMC,OAAO,gBACX,6BAAC,cAAD,IAAQ,EAAE,EAAE,KAAKL,KAAL,CAAWM,EAAvB,EAA2B,SAAS,EAAEC,sBAASC,MAAT,EAAtC,EAAyD,QAAQ,EAAE,aAAnE,iBACE,6BAAC,gCAAD,IAAY,EAAE,EAAE,KAAKR,KAAL,CAAWS,MAA3B,EAAmC,QAAQ,EAAE,KAAKT,KAAL,CAAWU,OAAxD,EAAiE,YAAY,MAA7E,EAA8E,aAAa,MAA3F,EAA4F,OAAO,EAAE,CAArG,iBACE,sCAAK,SAAS,EAAEH,sBAASI,OAAT,EAAhB,iBACE,6BAAC,wBAAD,IAAa,cAAc,EAAE,KAAKZ,KAAlC,iBACE,sCAAK,YAAUJ,mBAAmB,CAACE,SAAnC,EAA8C,SAAS,EAAEU,sBAASV,SAAT,CAAmB,KAAKM,KAAxB,CAAzD,iBACE,sCAAK,YAAUR,mBAAmB,CAACC,IAAnC,EAAyC,SAAS,EAAEW,sBAASX,IAAT,CAAc,KAAKO,KAAnB,CAApD,iBACE,6BAAC,oCAAD,IAAmB,OAAO,EAAE,KAAKH,KAAL,CAAWY,OAAvC,IAAiD,KAAKZ,KAAL,CAAWa,oBAA5D,CADF,eAEE,sCAAK,SAAS,EAAEN,sBAASF,OAAT,CAAiB,KAAKF,KAAtB,CAAhB,IAA+C,KAAKH,KAAL,CAAWc,QAA1D,CAFF,CADF,eAKE,sCAAK,OAAO,EAAE,KAAKf,KAAnB,EAA0B,SAAS,EAAEQ,sBAASQ,YAAT,EAArC,GALF,CADF,CADF,eAUE,sCAAK,SAAS,EAAER,sBAASS,EAAT,EAAhB,GAVF,eAWE,6BAAC,8CAAD,OAXF,CADF,CADF,CADF,CAoBA,IAAI,KAAKhB,KAAL,CAAWiB,sBAAf,EAAuC,CACrC,OAAOZ,OAAP,CACD,CAED,oBAAO,6BAAC,gCAAD,QAAkBA,OAAlB,CAAP,CACD,C,sBA1C8Ba,eAAMC,S,oCAA1BrB,W,CACGsB,mB,GAAsB,kB","sourcesContent":["import React, { HTMLAttributes } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { RenderContainer } from '../RenderContainer';\nimport { HideBodyVerticalScroll } from '../HideBodyVerticalScroll';\nimport { ZIndex } from '../ZIndex';\nimport { RenderLayer } from '../RenderLayer';\n\nimport { jsStyles } from './MobilePopup.styles';\nimport { MobilePopupHeader } from './MobilePopupHeader';\n\ninterface MobilePopupProps extends Pick<HTMLAttributes<HTMLDivElement>, 'id'> {\n  /**\n   * Функция, вызываемая при закрытии всплывающего окна\n   */\n  onClose?: () => void;\n  /**\n   * Заголовок всплывающего окна, располагается в шапке\n   */\n  caption?: string;\n  /**\n   * Шапка всплывающего окна\n   */\n  headerChildComponent?: React.ReactNode;\n  /**\n   * Позволяет получить контент всплывающего окна без обёртки в виде `RenderContainer`\n   */\n  withoutRenderContainer?: boolean;\n  /**\n   * Функция, вызываемая при клике по вуали\n   */\n  onCloseRequest?: () => void;\n  /**\n   * Позволяет контролировать текущее состояние всплывающего окна\n   */\n  opened: boolean;\n}\n\nexport const MobilePopupDataTids = {\n  root: 'MobilePopup__root',\n  container: 'MobilePopup__container',\n} as const;\n\nexport class MobilePopup extends React.Component<MobilePopupProps> {\n  public static __KONTUR_REACT_UI__ = 'MobileMenuHeader';\n\n  private theme!: Theme;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    const content = (\n      <ZIndex id={this.props.id} className={jsStyles.zIndex()} priority={'MobilePopup'}>\n        <Transition in={this.props.opened} onExited={this.props.onClose} mountOnEnter unmountOnExit timeout={0}>\n          <div className={jsStyles.wrapper()}>\n            <RenderLayer onClickOutside={this.close}>\n              <div data-tid={MobilePopupDataTids.container} className={jsStyles.container(this.theme)}>\n                <div data-tid={MobilePopupDataTids.root} className={jsStyles.root(this.theme)}>\n                  <MobilePopupHeader caption={this.props.caption}>{this.props.headerChildComponent}</MobilePopupHeader>\n                  <div className={jsStyles.content(this.theme)}>{this.props.children}</div>\n                </div>\n                <div onClick={this.close} className={jsStyles.bottomIndent()} />\n              </div>\n            </RenderLayer>\n            <div className={jsStyles.bg()} />\n            <HideBodyVerticalScroll />\n          </div>\n        </Transition>\n      </ZIndex>\n    );\n\n    if (this.props.withoutRenderContainer) {\n      return content;\n    }\n\n    return <RenderContainer>{content}</RenderContainer>;\n  }\n\n  public close = () => {\n    if (this.props.onCloseRequest) {\n      this.props.onCloseRequest();\n    }\n  };\n}\n"]}
+{"version":3,"sources":["MobilePopup.tsx"],"names":["MobilePopupDataTids","root","container","MobilePopup","rootNode","close","props","onCloseRequest","render","theme","renderMain","content","id","jsStyles","zIndex","opened","onClose","wrapper","setRootNode","caption","headerChildComponent","children","footerChildComponent","bottomIndent","bg","withoutRenderContainer","React","Component","__KONTUR_REACT_UI__","displayName","defaultRootNode"],"mappings":"6RAAA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA,wD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiCO,IAAMA,mBAAmB,GAAG;AACjCC,EAAAA,IAAI,EAAE,mBAD2B;AAEjCC,EAAAA,SAAS,EAAE,wBAFsB,EAA5B,C;;;;AAMMC,W,OADZC,kB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDQC,IAAAA,K,GAAQ,YAAM;AACnB,UAAI,MAAKC,KAAL,CAAWC,cAAf,EAA+B;AAC7B,cAAKD,KAAL,CAAWC,cAAX;AACD;AACF,K,yDAhDMC,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACC,UAAL,EAAP,CACD,CAJH,CADF,CAQD,C,QAEMA,U,GAAP,sBAAoB,CAClB,IAAMC,OAAO,gBACX,6BAAC,cAAD,IAAQ,EAAE,EAAE,KAAKL,KAAL,CAAWM,EAAvB,EAA2B,SAAS,EAAEC,sBAASC,MAAT,EAAtC,EAAyD,QAAQ,EAAE,aAAnE,iBACE,6BAAC,gCAAD,IAAY,EAAE,EAAE,KAAKR,KAAL,CAAWS,MAA3B,EAAmC,QAAQ,EAAE,KAAKT,KAAL,CAAWU,OAAxD,EAAiE,YAAY,MAA7E,EAA8E,aAAa,MAA3F,EAA4F,OAAO,EAAE,CAArG,iBACE,sCAAK,SAAS,EAAEH,sBAASI,OAAT,EAAhB,iBACE,6BAAC,wBAAD,IAAa,cAAc,EAAE,KAAKZ,KAAlC,iBACE,sCACE,GAAG,EAAE,KAAKa,WADZ,EAEE,YAAUlB,mBAAmB,CAACE,SAFhC,EAGE,SAAS,EAAEW,sBAASX,SAAT,CAAmB,KAAKO,KAAxB,CAHb,iBAKE,sCAAK,YAAUT,mBAAmB,CAACC,IAAnC,EAAyC,SAAS,EAAEY,sBAASZ,IAAT,CAAc,KAAKQ,KAAnB,CAApD,iBACE,6BAAC,oCAAD,IAAmB,OAAO,EAAE,KAAKH,KAAL,CAAWa,OAAvC,IAAiD,KAAKb,KAAL,CAAWc,oBAA5D,CADF,eAEE,sCAAK,SAAS,EAAEP,sBAASF,OAAT,CAAiB,KAAKF,KAAtB,CAAhB,IAA+C,KAAKH,KAAL,CAAWe,QAA1D,CAFF,eAGE,6BAAC,oCAAD,QAAoB,KAAKf,KAAL,CAAWgB,oBAA/B,CAHF,CALF,eAUE,sCAAK,OAAO,EAAE,KAAKjB,KAAnB,EAA0B,SAAS,EAAEQ,sBAASU,YAAT,EAArC,GAVF,CADF,CADF,eAeE,sCAAK,SAAS,EAAEV,sBAASW,EAAT,EAAhB,GAfF,eAgBE,6BAAC,8CAAD,OAhBF,CADF,CADF,CADF,CAyBA,IAAI,KAAKlB,KAAL,CAAWmB,sBAAf,EAAuC,CACrC,OAAOd,OAAP,CACD,CAED,oBAAO,6BAAC,gCAAD,QAAkBA,OAAlB,CAAP,CACD,C,sBApD8Be,eAAMC,S,WACvBC,mB,GAAsB,kB,UACtBC,W,GAAc,kB,UAGLC,e,GAAkB,I","sourcesContent":["import React, { HTMLAttributes } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { RenderContainer } from '../RenderContainer';\nimport { HideBodyVerticalScroll } from '../HideBodyVerticalScroll';\nimport { ZIndex } from '../ZIndex';\nimport { RenderLayer } from '../RenderLayer';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { jsStyles } from './MobilePopup.styles';\nimport { MobilePopupHeader } from './MobilePopupHeader';\nimport { MobilePopupFooter } from './MobilePopupFooter';\n\ninterface MobilePopupProps extends Pick<HTMLAttributes<HTMLDivElement>, 'id'> {\n  /**\n   * Функция, вызываемая при закрытии всплывающего окна\n   */\n  onClose?: () => void;\n  /**\n   * Заголовок всплывающего окна, располагается в шапке\n   */\n  caption?: string;\n  /**\n   * Шапка всплывающего окна\n   */\n  headerChildComponent?: React.ReactNode;\n  /**\n   * Подвал всплывающего окна\n   */\n  footerChildComponent?: React.ReactNode;\n  /**\n   * Позволяет получить контент всплывающего окна без обёртки в виде `RenderContainer`\n   */\n  withoutRenderContainer?: boolean;\n  /**\n   * Функция, вызываемая при клике по вуали\n   */\n  onCloseRequest?: () => void;\n  /**\n   * Позволяет контролировать текущее состояние всплывающего окна\n   */\n  opened: boolean;\n}\n\nexport const MobilePopupDataTids = {\n  root: 'MobilePopup__root',\n  container: 'MobilePopup__container',\n} as const;\n\n@rootNode\nexport class MobilePopup extends React.Component<MobilePopupProps> {\n  public static __KONTUR_REACT_UI__ = 'MobileMenuHeader';\n  public static displayName = 'MobileMenuHeader';\n\n  // see #2873 and #2895\n  public static readonly defaultRootNode = null;\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  public render() {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain() {\n    const content = (\n      <ZIndex id={this.props.id} className={jsStyles.zIndex()} priority={'MobilePopup'}>\n        <Transition in={this.props.opened} onExited={this.props.onClose} mountOnEnter unmountOnExit timeout={0}>\n          <div className={jsStyles.wrapper()}>\n            <RenderLayer onClickOutside={this.close}>\n              <div\n                ref={this.setRootNode}\n                data-tid={MobilePopupDataTids.container}\n                className={jsStyles.container(this.theme)}\n              >\n                <div data-tid={MobilePopupDataTids.root} className={jsStyles.root(this.theme)}>\n                  <MobilePopupHeader caption={this.props.caption}>{this.props.headerChildComponent}</MobilePopupHeader>\n                  <div className={jsStyles.content(this.theme)}>{this.props.children}</div>\n                  <MobilePopupFooter>{this.props.footerChildComponent}</MobilePopupFooter>\n                </div>\n                <div onClick={this.close} className={jsStyles.bottomIndent()} />\n              </div>\n            </RenderLayer>\n            <div className={jsStyles.bg()} />\n            <HideBodyVerticalScroll />\n          </div>\n        </Transition>\n      </ZIndex>\n    );\n\n    if (this.props.withoutRenderContainer) {\n      return content;\n    }\n\n    return <RenderContainer>{content}</RenderContainer>;\n  }\n\n  public close = () => {\n    if (this.props.onCloseRequest) {\n      this.props.onCloseRequest();\n    }\n  };\n}\n"]}

package/cjs/internal/MobilePopup/MobilePopup.styles.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.jsStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 
 
 var styles = {

package/cjs/internal/MobilePopup/MobilePopup.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MobilePopup.styles.ts"],"names":["styles","root","t","css","mobilePopupContainerBorderRadius","mobilePopupContainerBottomPadding","menuBgDefault","wrapper","content","bgDefault","container","mobilePopupTopPadding","mobilePopupOuterIndentY","bg","bottomIndent","zIndex","jsStyles"],"mappings":"8QAAA,oD;;;AAGA,IAAMA,MAAM,GAAG;AACbC,EAAAA,IADa,gBACRC,CADQ,EACE;AACb,eAAOC,YAAP;;;;;;AAMmBD,IAAAA,CAAC,CAACE,gCANrB;;AAQoBF,IAAAA,CAAC,CAACG,iCARtB;AASgBH,IAAAA,CAAC,CAACI,aATlB;;AAWD,GAbY;;AAebC,EAAAA,OAfa,qBAeH;AACR,eAAOJ,YAAP;;;;;;;;AAQD,GAxBY;;AA0BbK,EAAAA,OA1Ba,mBA0BLN,CA1BK,EA0BK;AAChB,eAAOC,YAAP;AACsBD,IAAAA,CAAC,CAACO,SADxB;;AAGD,GA9BY;;AAgCbC,EAAAA,SAhCa,qBAgCHR,CAhCG,EAgCO;AAClB,eAAOC,YAAP;;AAESD,IAAAA,CAAC,CAACS,qBAFX;AAGUT,IAAAA,CAAC,CAACU,uBAHZ;AAIWV,IAAAA,CAAC,CAACU,uBAJb;;;AAOD,GAxCY;;AA0CbC,EAAAA,EA1Ca,gBA0CR;AACH,eAAOV,YAAP;;;;;;;;;;;AAWD,GAtDY;;AAwDbW,EAAAA,YAxDa,0BAwDE;AACb,eAAOX,YAAP;;;AAGD,GA5DY;;AA8DbY,EAAAA,MA9Da,oBA8DJ;AACP,eAAOZ,YAAP;;;AAGD,GAlEY,EAAf;;;AAqEO,IAAMa,QAAQ,GAAG,2BAAahB,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst styles = {\n  root(t: Theme) {\n    return css`\n      width: 100%;\n      height: 100%;\n      flex-direction: column;\n      display: flex;\n      justify-content: flex-end;\n      border-radius: ${t.mobilePopupContainerBorderRadius};\n      overflow: hidden;\n      padding-bottom: ${t.mobilePopupContainerBottomPadding};\n      background: ${t.menuBgDefault};\n    `;\n  },\n\n  wrapper() {\n    return css`\n      position: fixed;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      overflow: auto;\n    `;\n  },\n\n  content(t: Theme) {\n    return css`\n      background-color: ${t.bgDefault};\n    `;\n  },\n\n  container(t: Theme) {\n    return css`\n      position: absolute;\n      top: ${t.mobilePopupTopPadding};\n      left: ${t.mobilePopupOuterIndentY};\n      right: ${t.mobilePopupOuterIndentY};\n      z-index: 100000;\n    `;\n  },\n\n  bg() {\n    return css`\n      position: fixed;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      z-index: 9999;\n      background: #333333;\n      pointer-events: none;\n      opacity: 50%;\n    `;\n  },\n\n  bottomIndent() {\n    return css`\n      height: 80px;\n    `;\n  },\n\n  zIndex() {\n    return css`\n      position: relative;\n    `;\n  },\n};\n\nexport const jsStyles = memoizeStyle(styles);\n"]}
+{"version":3,"sources":["MobilePopup.styles.ts"],"names":["styles","root","t","css","mobilePopupContainerBorderRadius","mobilePopupContainerBottomPadding","menuBgDefault","wrapper","content","bgDefault","container","mobilePopupTopPadding","mobilePopupOuterIndentY","bg","bottomIndent","zIndex","jsStyles"],"mappings":"sRAAA,oD;;;AAGA,IAAMA,MAAM,GAAG;AACbC,EAAAA,IADa,gBACRC,CADQ,EACE;AACb,eAAOC,YAAP;;;;;;AAMmBD,IAAAA,CAAC,CAACE,gCANrB;;AAQoBF,IAAAA,CAAC,CAACG,iCARtB;AASgBH,IAAAA,CAAC,CAACI,aATlB;;AAWD,GAbY;;AAebC,EAAAA,OAfa,qBAeH;AACR,eAAOJ,YAAP;;;;;;;;AAQD,GAxBY;;AA0BbK,EAAAA,OA1Ba,mBA0BLN,CA1BK,EA0BK;AAChB,eAAOC,YAAP;AACsBD,IAAAA,CAAC,CAACO,SADxB;;AAGD,GA9BY;;AAgCbC,EAAAA,SAhCa,qBAgCHR,CAhCG,EAgCO;AAClB,eAAOC,YAAP;;AAESD,IAAAA,CAAC,CAACS,qBAFX;AAGUT,IAAAA,CAAC,CAACU,uBAHZ;AAIWV,IAAAA,CAAC,CAACU,uBAJb;;;AAOD,GAxCY;;AA0CbC,EAAAA,EA1Ca,gBA0CR;AACH,eAAOV,YAAP;;;;;;;;;;;AAWD,GAtDY;;AAwDbW,EAAAA,YAxDa,0BAwDE;AACb,eAAOX,YAAP;;;AAGD,GA5DY;;AA8DbY,EAAAA,MA9Da,oBA8DJ;AACP,eAAOZ,YAAP;;;AAGD,GAlEY,EAAf;;;AAqEO,IAAMa,QAAQ,GAAG,2BAAahB,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nconst styles = {\n  root(t: Theme) {\n    return css`\n      width: 100%;\n      height: 100%;\n      flex-direction: column;\n      display: flex;\n      justify-content: flex-end;\n      border-radius: ${t.mobilePopupContainerBorderRadius};\n      overflow: hidden;\n      padding-bottom: ${t.mobilePopupContainerBottomPadding};\n      background: ${t.menuBgDefault};\n    `;\n  },\n\n  wrapper() {\n    return css`\n      position: fixed;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      overflow: auto;\n    `;\n  },\n\n  content(t: Theme) {\n    return css`\n      background-color: ${t.bgDefault};\n    `;\n  },\n\n  container(t: Theme) {\n    return css`\n      position: absolute;\n      top: ${t.mobilePopupTopPadding};\n      left: ${t.mobilePopupOuterIndentY};\n      right: ${t.mobilePopupOuterIndentY};\n      z-index: 100000;\n    `;\n  },\n\n  bg() {\n    return css`\n      position: fixed;\n      top: 0;\n      bottom: 0;\n      right: 0;\n      left: 0;\n      z-index: 9999;\n      background: #333333;\n      pointer-events: none;\n      opacity: 50%;\n    `;\n  },\n\n  bottomIndent() {\n    return css`\n      height: 80px;\n    `;\n  },\n\n  zIndex() {\n    return css`\n      position: relative;\n    `;\n  },\n};\n\nexport const jsStyles = memoizeStyle(styles);\n"]}