@skbkontur/react-ui 0.0.0-cb54865bf2 → 0.0.0-ccbe7cf017

package/cjs/internal/Menu/Menu.js

@@ -1,16 +1,28 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Menu = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _classnames = _interopRequireDefault(require("classnames"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MenuDataTids = exports.Menu = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 
+var _decorator = require("../../components/ResponsiveLayout/decorator");
+var _utils = require("../../lib/utils");
 var _ScrollContainer = require("../../components/ScrollContainer");
-var _MenuItem = require("../../components/MenuItem");
-var _MenuHeader = require("../../components/MenuHeader");
+
 
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 
+var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode2 = require("../../lib/rootNode");
+var _addIconPaddingIfPartOfMenu = require("../InternalMenu/addIconPaddingIfPartOfMenu");
+var _client = require("../../lib/client");
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
 
 var _Menu = require("./Menu.styles");
-var _isActiveElement = require("./isActiveElement");var
+var _isActiveElement = require("./isActiveElement");var _class, _class2, _temp;
+
+
+
+
+
+
+
 
 
 
@@ -23,30 +35,39 @@ var _isActiveElement = require("./isActiveElement");var
 
 
 
+var MenuDataTids = {
+  root: 'Menu__root' };exports.MenuDataTids = MenuDataTids;var
 
 
-Menu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Menu, _React$Component);function Menu() {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.
 
 
 
 
+Menu = (0, _decorator.responsiveLayout)(_class = (0, _rootNode2.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Menu, _React$Component);function Menu() {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.
 
 
 
 
 
+
+
+
+
+
+    getProps = (0, _createPropsGetter.createPropsGetter)(Menu.defaultProps);_this.
+
     state = {
       highlightedIndex: -1 };_this.
 
 
-    theme = void 0;_this.
-    scrollContainer = void 0;_this.
-    highlighted = void 0;_this.
-    unmounted = false;_this.
 
 
 
 
+    unmounted = false;_this.
+
+
+
 
 
 
@@ -146,15 +167,42 @@ Menu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Me
 
 
 
+    getChildList = function () {
+      var enableIconPadding = _react.default.Children.toArray(_this.props.children).some(
+      function (x) {return /*#__PURE__*/_react.default.isValidElement(x) && x.props.icon;});
 
 
+      return _react.default.Children.map(_this.props.children, function (child, index) {
+        if (!child) {
+          return child;
+        }
 
+        if (typeof child === 'string' || typeof child === 'number') {
+          return child;
+        }
 
+        var modifiedChild = (0, _addIconPaddingIfPartOfMenu.addIconPaddingIfPartOfMenu)(child, enableIconPadding);
 
+        if ((0, _isActiveElement.isActiveElement)(modifiedChild)) {
+          var highlight = _this.state.highlightedIndex === index;
 
+          var ref = modifiedChild.ref;
+          if (highlight && typeof modifiedChild.ref !== 'string') {
+            ref = _this.refHighlighted.bind((0, _assertThisInitialized2.default)(_this), modifiedChild.ref);
+          }
 
+          return /*#__PURE__*/_react.default.cloneElement(modifiedChild, {
+            ref: ref,
+            state: highlight ? 'hover' : modifiedChild.props.state,
+            onClick: _this.select.bind((0, _assertThisInitialized2.default)(_this), index, false),
+            onMouseEnter: _this.highlight.bind((0, _assertThisInitialized2.default)(_this), index),
+            onMouseLeave: _this.unhighlight });
 
+        }
 
+        return modifiedChild;
+      });
+    };_this.
 
     refScrollContainer = function (scrollContainer) {
       _this.scrollContainer = scrollContainer;
@@ -173,7 +221,11 @@ Menu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Me
 
     scrollToSelected = function () {
       if (_this.scrollContainer && _this.highlighted) {
-        _this.scrollContainer.scrollTo(_reactDom.default.findDOMNode(_this.highlighted));
+        var _rootNode = (0, _rootNode2.getRootNode)(_this.highlighted);
+        // TODO: Remove this check once IF-647 is resolved
+        if (_rootNode instanceof HTMLElement) {
+          _this.scrollContainer.scrollTo(_rootNode);
+        }
       }
     };_this.
 
@@ -216,17 +268,17 @@ Menu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Me
 
     unhighlight = function () {
       _this.setState({ highlightedIndex: -1 });
-    };return _this;}var _proto = Menu.prototype;_proto.componentWillUnmount = function componentWillUnmount() {this.unmounted = true;};_proto.render = function render() {var _this2 = this;return _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});} /**
-                                                                                                                                                                                                                                                                                                                                                   * @public
-                                                                                                                                                                                                                                                                                                                                                   */;_proto.up = function up() {this.move(-1);} /**
-                                                                                                                                                                                                                                                                                                                                                                                                  * @public
-                                                                                                                                                                                                                                                                                                                                                                                                  */;_proto.down = function down() {this.move(1);} /**
-                                                                                                                                                                                                                                                                                                                                                                                                                                                    * @public
-                                                                                                                                                                                                                                                                                                                                                                                                                                                    */;_proto.enter = function enter(event) {return this.select(this.state.highlightedIndex, true, event);} /**
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             * @public
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             */;_proto.reset = function reset() {this.setState({ highlightedIndex: -1 });} /**
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            * @public
-                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                            */;_proto.hasHighlightedItem = function hasHighlightedItem() {return this.state.highlightedIndex !== -1;};_proto.highlightItem = function highlightItem(index) {this.highlight(index);};_proto.renderMain = function renderMain() {var _cn,_this3 = this;var enableIconPadding = _react.default.Children.toArray(this.props.children).some(function (x) {return _react.default.isValidElement(x) && x.props.icon;});if (this.isEmpty()) {return null;}return _react.default.createElement("div", { className: (0, _classnames.default)((_cn = {}, _cn[_Menu.jsStyles.root(this.theme)] = true, _cn[_Menu.jsStyles.shadow(this.theme)] = this.props.hasShadow, _cn)), style: { width: this.props.width, maxHeight: this.props.maxHeight } }, _react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: this.props.maxHeight, preventWindowScroll: this.props.preventWindowScroll }, _react.default.Children.map(this.props.children, function (child, index) {if (!child) {return child;}if (typeof child === 'string' || typeof child === 'number') {return child;}if (enableIconPadding && ((0, _MenuItem.isMenuItem)(child) || (0, _MenuHeader.isMenuHeader)(child))) {child = _react.default.cloneElement(child, { _enableIconPadding: true });}if ((0, _isActiveElement.isActiveElement)(child)) {var highlight = _this3.state.highlightedIndex === index;var ref = child.ref;if (highlight && typeof child.ref !== 'string') {ref = _this3.refHighlighted.bind(_this3, child.ref);}return _react.default.cloneElement(child, { ref: ref, state: highlight ? 'hover' : child.props.state, onClick: _this3.select.bind(_this3, index, false), onMouseEnter: _this3.highlight.bind(_this3, index), onMouseLeave: _this3.unhighlight });}return child;})));};_proto.refHighlighted = function refHighlighted(originalRef, menuItem) {this.highlighted = menuItem;if (typeof originalRef === 'function') {originalRef(menuItem);}};_proto.select = function select(index, shouldHandleHref, event) {var item = childrenToArray(this.props.children)[index];if ((0, _isActiveElement.isActiveElement)(item)) {if (shouldHandleHref && item.props.href) {if (item.props.target) {window.open(item.props.href, item.props.target);} else {location.href = item.props.href;}}if (item.props.onClick) {item.props.onClick(event);}if (this.props.onItemClick) {this.props.onItemClick();}return true;}return false;};_proto.move = function move(step) {var _this4 = this;if (this.unmounted) {// NOTE workaround, because `ComboBox` call `process.nextTick` in reducer
+    };return _this;}var _proto = Menu.prototype;_proto.componentWillUnmount = function componentWillUnmount() {this.unmounted = true;};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});} /**
+   * @public
+   */;_proto.up = function up() {this.move(-1);} /**
+   * @public
+   */;_proto.down = function down() {this.move(1);} /**
+   * @public
+   */;_proto.enter = function enter(event) {return this.select(this.state.highlightedIndex, true, event);} /**
+   * @public
+   */;_proto.reset = function reset() {this.setState({ highlightedIndex: -1 });} /**
+   * @public
+   */;_proto.hasHighlightedItem = function hasHighlightedItem() {return this.state.highlightedIndex !== -1;};_proto.highlightItem = function highlightItem(index) {this.highlight(index);};_proto.renderMain = function renderMain() {var _cx, _cx2;if (this.isEmpty()) {return null;}var _this$getProps = this.getProps(),hasShadow = _this$getProps.hasShadow,maxHeight = _this$getProps.maxHeight,preventWindowScroll = _this$getProps.preventWindowScroll;var offsetY = (0, _ThemeHelpers.isTheme2022)(this.theme) ? { top: 4, right: 0, bottom: 4 } : {};var isMobile = this.isMobileLayout;return /*#__PURE__*/_react.default.createElement("div", { "data-tid": MenuDataTids.root, className: (0, _Emotion.cx)(getAlignRightClass(this.props), (_cx = {}, _cx[_Menu.styles.root(this.theme)] = true, _cx[_Menu.styles.rootMobile(this.theme)] = isMobile, _cx[_Menu.styles.shadow(this.theme)] = hasShadow && !isMobile, _cx)), style: getStyle(this.props), ref: this.setRootNode }, /*#__PURE__*/_react.default.createElement(_ScrollContainer.ScrollContainer, { ref: this.refScrollContainer, maxHeight: maxHeight, preventWindowScroll: preventWindowScroll, disabled: this.props.disableScrollContainer, offsetY: offsetY }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Menu.styles.scrollContainer(this.theme)] = true, _cx2[_Menu.styles.scrollContainerMobile(this.theme)] = isMobile, _cx2)) }, this.getChildList())));};_proto.refHighlighted = function refHighlighted(originalRef, menuItem) {this.highlighted = menuItem;if (typeof originalRef === 'function') {originalRef(menuItem);}};_proto.select = function select(index, shouldHandleHref, event) {var item = childrenToArray(this.props.children)[index];if ((0, _isActiveElement.isActiveElement)(item)) {if (shouldHandleHref && item.props.href) {if (item.props.target) {window.open(item.props.href, item.props.target);} else {location.href = item.props.href;}}if (item.props.onClick) {item.props.onClick(event);}if (this.props.onItemClick) {this.props.onItemClick();}return true;}return false;};_proto.move = function move(step) {var _this3 = this;if (this.unmounted) {// NOTE workaround, because `ComboBox` call `process.nextTick` in reducer
       return;}var children = childrenToArray(this.props.children);var activeElements = children.filter(_isActiveElement.isActiveElement);if (!activeElements.length) {return;
     }
     var index = this.state.highlightedIndex;var _loop = function _loop() {
@@ -240,16 +292,16 @@ Menu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Me
 
       var child = children[index];
       if ((0, _isActiveElement.isActiveElement)(child)) {
-        _this4.setState({ highlightedIndex: index }, function () {
+        _this3.setState({ highlightedIndex: index }, function () {
           switch (activeElements.indexOf(child)) {
             case 0:
-              _this4.scrollToTop();
+              _this3.scrollToTop();
               break;
             case activeElements.length - 1:
-              _this4.scrollToBottom();
+              _this3.scrollToBottom();
               break;
             default:
-              _this4.scrollToSelected();}
+              _this3.scrollToSelected();}
 
         });
         return { v: void 0 };
@@ -257,15 +309,11 @@ Menu = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Me
     } while (index !== this.state.highlightedIndex);
   };_proto.
 
-  isEmpty = function isEmpty() {var
-    children = this.props.children;
-    return !children || !childrenToArray(children).filter(isExist).length;
-  };return Menu;}(_react.default.Component);exports.Menu = Menu;Menu.__KONTUR_REACT_UI__ = 'Menu';Menu.defaultProps = { width: 'auto', maxHeight: 300, hasShadow: true, preventWindowScroll: true };
-
+  isEmpty = function isEmpty() {
+    var children = this.props.children;
+    return !children || !childrenToArray(children).filter(_utils.isNonNullable).length;
+  };return Menu;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Menu', _class2.defaultProps = { align: 'left', width: 'auto', maxHeight: 300, hasShadow: true, preventWindowScroll: true }, _temp)) || _class) || _class;exports.Menu = Menu;
 
-function isExist(value) {
-  return value !== null && value !== undefined;
-}
 
 function childrenToArray(children) {
   var ret = [];
@@ -274,4 +322,31 @@ function childrenToArray(children) {
     ret.push(child);
   });
   return ret;
-}
+}
+
+var getStyle = function getStyle(props) {
+  if (props.align === 'right') {
+    return {
+      maxWidth: props.width,
+      minWidth: props.width,
+      maxHeight: props.maxHeight };
+
+  }
+
+  return {
+    width: props.width,
+    maxHeight: props.maxHeight };
+
+};
+
+var getAlignRightClass = function getAlignRightClass(props) {
+  if (props.align === 'right') {var _cx3;
+    return (0, _Emotion.cx)((_cx3 = {}, _cx3[
+    _Menu.styles.alignRight()] = !_client.isIE11, _cx3[
+    _Menu.styles.alignRightIE11()] = _client.isIE11, _cx3[
+    _Menu.styles.alignRightIE11FixAutoWidth()] = _client.isIE11 && props.width === 'auto', _cx3));
+
+  }
+
+  return null;
+};

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

@@ -1 +1 @@
-{"version":3,"sources":["Menu.tsx"],"names":["Menu","state","highlightedIndex","theme","scrollContainer","highlighted","unmounted","refScrollContainer","scrollToSelected","scrollTo","ReactDOM","findDOMNode","scrollToTop","scrollToBottom","highlight","index","setState","unhighlight","componentWillUnmount","render","renderMain","up","move","down","enter","event","select","reset","hasHighlightedItem","highlightItem","enableIconPadding","React","Children","toArray","props","children","some","x","isValidElement","icon","isEmpty","jsStyles","root","shadow","hasShadow","width","maxHeight","preventWindowScroll","map","child","cloneElement","_enableIconPadding","ref","refHighlighted","bind","onClick","onMouseEnter","onMouseLeave","originalRef","menuItem","shouldHandleHref","item","childrenToArray","href","target","window","open","location","onItemClick","step","activeElements","filter","isActiveElement","length","indexOf","isExist","Component","__KONTUR_REACT_UI__","defaultProps","value","undefined","ret","forEach","push"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport cn from 'classnames';\r\n\r\nimport { ScrollContainer } from '../../components/ScrollContainer';\r\nimport { isMenuItem, MenuItem, MenuItemProps } from '../../components/MenuItem';\r\nimport { isMenuHeader } from '../../components/MenuHeader';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nimport { jsStyles } from './Menu.styles';\r\nimport { isActiveElement } from './isActiveElement';\r\n\r\nexport interface MenuProps {\r\n  children: React.ReactNode;\r\n  hasShadow?: boolean;\r\n  maxHeight?: number | string;\r\n  onItemClick?: () => void;\r\n  width?: number | string;\r\n  preventWindowScroll?: boolean;\r\n}\r\n\r\nexport interface MenuState {\r\n  highlightedIndex: number;\r\n}\r\n\r\nexport class Menu extends React.Component<MenuProps, MenuState> {\r\n  public static __KONTUR_REACT_UI__ = 'Menu';\r\n\r\n  public static defaultProps = {\r\n    width: 'auto',\r\n    maxHeight: 300,\r\n    hasShadow: true,\r\n    preventWindowScroll: true,\r\n  };\r\n\r\n  public state = {\r\n    highlightedIndex: -1,\r\n  };\r\n\r\n  private theme!: Theme;\r\n  private scrollContainer: Nullable<ScrollContainer>;\r\n  private highlighted: Nullable<MenuItem>;\r\n  private unmounted = false;\r\n\r\n  public componentWillUnmount() {\r\n    this.unmounted = true;\r\n  }\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return this.renderMain();\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public up() {\r\n    this.move(-1);\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public down() {\r\n    this.move(1);\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public enter(event: React.SyntheticEvent<HTMLElement>) {\r\n    return this.select(this.state.highlightedIndex, true, event);\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public reset() {\r\n    this.setState({ highlightedIndex: -1 });\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public hasHighlightedItem() {\r\n    return this.state.highlightedIndex !== -1;\r\n  }\r\n\r\n  public highlightItem(index: number) {\r\n    this.highlight(index);\r\n  }\r\n\r\n  private renderMain() {\r\n    const enableIconPadding = React.Children.toArray(this.props.children).some(\r\n      x => React.isValidElement(x) && x.props.icon,\r\n    );\r\n\r\n    if (this.isEmpty()) {\r\n      return null;\r\n    }\r\n\r\n    return (\r\n      <div\r\n        className={cn({\r\n          [jsStyles.root(this.theme)]: true,\r\n          [jsStyles.shadow(this.theme)]: this.props.hasShadow,\r\n        })}\r\n        style={{ width: this.props.width, maxHeight: this.props.maxHeight }}\r\n      >\r\n        <ScrollContainer\r\n          ref={this.refScrollContainer}\r\n          maxHeight={this.props.maxHeight}\r\n          preventWindowScroll={this.props.preventWindowScroll}\r\n        >\r\n          {React.Children.map(this.props.children, (child, index) => {\r\n            if (!child) {\r\n              return child;\r\n            }\r\n            if (typeof child === 'string' || typeof child === 'number') {\r\n              return child;\r\n            }\r\n\r\n            if (enableIconPadding && (isMenuItem(child) || isMenuHeader(child))) {\r\n              child = React.cloneElement(child, {\r\n                _enableIconPadding: true,\r\n              });\r\n            }\r\n            if (isActiveElement(child)) {\r\n              const highlight = this.state.highlightedIndex === index;\r\n\r\n              let ref = child.ref;\r\n              if (highlight && typeof child.ref !== 'string') {\r\n                ref = this.refHighlighted.bind(this, child.ref);\r\n              }\r\n\r\n              return React.cloneElement<MenuItemProps, MenuItem>(child, {\r\n                ref,\r\n                state: highlight ? 'hover' : child.props.state,\r\n                onClick: this.select.bind(this, index, false),\r\n                onMouseEnter: this.highlight.bind(this, index),\r\n                onMouseLeave: this.unhighlight,\r\n              });\r\n            }\r\n            return child;\r\n          })}\r\n        </ScrollContainer>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\r\n    this.scrollContainer = scrollContainer;\r\n  };\r\n\r\n  private refHighlighted(\r\n    originalRef: ((menuItem: MenuItem | null) => any) | React.RefObject<MenuItem> | null | undefined,\r\n    menuItem: MenuItem | null,\r\n  ) {\r\n    this.highlighted = menuItem;\r\n\r\n    if (typeof originalRef === 'function') {\r\n      originalRef(menuItem);\r\n    }\r\n  }\r\n\r\n  private scrollToSelected = () => {\r\n    if (this.scrollContainer && this.highlighted) {\r\n      this.scrollContainer.scrollTo(ReactDOM.findDOMNode(this.highlighted) as HTMLElement);\r\n    }\r\n  };\r\n\r\n  private scrollToTop = () => {\r\n    if (this.scrollContainer) {\r\n      this.scrollContainer.scrollToTop();\r\n    }\r\n  };\r\n\r\n  private scrollToBottom = () => {\r\n    if (this.scrollContainer) {\r\n      this.scrollContainer.scrollToBottom();\r\n    }\r\n  };\r\n\r\n  private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\r\n    const item = childrenToArray(this.props.children)[index];\r\n    if (isActiveElement(item)) {\r\n      if (shouldHandleHref && item.props.href) {\r\n        if (item.props.target) {\r\n          window.open(item.props.href, item.props.target);\r\n        } else {\r\n          location.href = item.props.href;\r\n        }\r\n      }\r\n      if (item.props.onClick) {\r\n        item.props.onClick(event);\r\n      }\r\n      if (this.props.onItemClick) {\r\n        this.props.onItemClick();\r\n      }\r\n      return true;\r\n    }\r\n    return false;\r\n  }\r\n\r\n  private highlight = (index: number) => {\r\n    this.setState({ highlightedIndex: index });\r\n  };\r\n\r\n  private unhighlight = () => {\r\n    this.setState({ highlightedIndex: -1 });\r\n  };\r\n\r\n  private move(step: number) {\r\n    if (this.unmounted) {\r\n      // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\r\n      return;\r\n    }\r\n\r\n    const children = childrenToArray(this.props.children);\r\n    const activeElements = children.filter(isActiveElement);\r\n    if (!activeElements.length) {\r\n      return;\r\n    }\r\n    let index = this.state.highlightedIndex;\r\n    do {\r\n      index += step;\r\n      if (index < 0) {\r\n        index = children.length - 1;\r\n      } else if (index > children.length) {\r\n        index = 0;\r\n      }\r\n\r\n      const child = children[index];\r\n      if (isActiveElement(child)) {\r\n        this.setState({ highlightedIndex: index }, () => {\r\n          switch (activeElements.indexOf(child)) {\r\n            case 0:\r\n              this.scrollToTop();\r\n              break;\r\n            case activeElements.length - 1:\r\n              this.scrollToBottom();\r\n              break;\r\n            default:\r\n              this.scrollToSelected();\r\n          }\r\n        });\r\n        return;\r\n      }\r\n    } while (index !== this.state.highlightedIndex);\r\n  }\r\n\r\n  private isEmpty() {\r\n    const { children } = this.props;\r\n    return !children || !childrenToArray(children).filter(isExist).length;\r\n  }\r\n}\r\n\r\nfunction isExist(value: any): value is any {\r\n  return value !== null && value !== undefined;\r\n}\r\n\r\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\r\n  const ret: React.ReactNode[] = [];\r\n  // Use forEach instead of map to avoid cloning for key unifying.\r\n  React.Children.forEach(children, child => {\r\n    ret.push(child);\r\n  });\r\n  return ret;\r\n}\r\n"]}
+{"version":3,"sources":["Menu.tsx"],"names":["MenuDataTids","root","Menu","responsiveLayout","rootNode","getProps","defaultProps","state","highlightedIndex","unmounted","getChildList","enableIconPadding","React","Children","toArray","props","children","some","x","isValidElement","icon","map","child","index","modifiedChild","highlight","ref","refHighlighted","bind","cloneElement","onClick","select","onMouseEnter","onMouseLeave","unhighlight","refScrollContainer","scrollContainer","scrollToSelected","highlighted","HTMLElement","scrollTo","scrollToTop","scrollToBottom","setState","componentWillUnmount","render","theme","renderMain","up","move","down","enter","event","reset","hasHighlightedItem","highlightItem","isEmpty","hasShadow","maxHeight","preventWindowScroll","offsetY","top","right","bottom","isMobile","isMobileLayout","getAlignRightClass","styles","rootMobile","shadow","getStyle","setRootNode","disableScrollContainer","scrollContainerMobile","originalRef","menuItem","shouldHandleHref","item","childrenToArray","href","target","window","open","location","onItemClick","step","activeElements","filter","isActiveElement","length","indexOf","isNonNullable","Component","__KONTUR_REACT_UI__","align","width","ret","forEach","push","maxWidth","minWidth","alignRight","isIE11","alignRightIE11","alignRightIE11FixAutoWidth"],"mappings":"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","sourcesContent":["import React, { CSSProperties } from 'react';\n\nimport { responsiveLayout } from '../../components/ResponsiveLayout/decorator';\nimport { isNonNullable } from '../../lib/utils';\nimport { ScrollContainer } from '../../components/ScrollContainer';\nimport { MenuItem, MenuItemProps } from '../../components/MenuItem';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { cx } from '../../lib/theming/Emotion';\nimport { getRootNode, rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { addIconPaddingIfPartOfMenu } from '../InternalMenu/addIconPaddingIfPartOfMenu';\nimport { isIE11 } from '../../lib/client';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { styles } from './Menu.styles';\nimport { isActiveElement } from './isActiveElement';\n\nexport interface MenuProps {\n  children: React.ReactNode;\n  hasShadow?: boolean;\n  maxHeight?: number | string;\n  onItemClick?: () => void;\n  width?: number | string;\n  preventWindowScroll?: boolean;\n  /**\n   * Отключение кастомного скролла контейнера\n   */\n  disableScrollContainer?: boolean;\n  align?: 'left' | 'right';\n}\n\nexport interface MenuState {\n  highlightedIndex: number;\n}\n\nexport const MenuDataTids = {\n  root: 'Menu__root',\n} as const;\n\ntype DefaultProps = Required<Pick<MenuProps, 'align' | 'width' | 'maxHeight' | 'hasShadow' | 'preventWindowScroll'>>;\n\n@responsiveLayout\n@rootNode\nexport class Menu extends React.Component<MenuProps, MenuState> {\n  public static __KONTUR_REACT_UI__ = 'Menu';\n\n  public static defaultProps: DefaultProps = {\n    align: 'left',\n    width: 'auto',\n    maxHeight: 300,\n    hasShadow: true,\n    preventWindowScroll: true,\n  };\n\n  private getProps = createPropsGetter(Menu.defaultProps);\n\n  public state = {\n    highlightedIndex: -1,\n  };\n\n  private theme!: Theme;\n  private scrollContainer: Nullable<ScrollContainer>;\n  private isMobileLayout!: boolean;\n  private highlighted: Nullable<MenuItem>;\n  private unmounted = false;\n  private setRootNode!: TSetRootNode;\n\n  public componentWillUnmount() {\n    this.unmounted = true;\n  }\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  /**\n   * @public\n   */\n  public up() {\n    this.move(-1);\n  }\n\n  /**\n   * @public\n   */\n  public down() {\n    this.move(1);\n  }\n\n  /**\n   * @public\n   */\n  public enter(event: React.SyntheticEvent<HTMLElement>) {\n    return this.select(this.state.highlightedIndex, true, event);\n  }\n\n  /**\n   * @public\n   */\n  public reset() {\n    this.setState({ highlightedIndex: -1 });\n  }\n\n  /**\n   * @public\n   */\n  public hasHighlightedItem() {\n    return this.state.highlightedIndex !== -1;\n  }\n\n  public highlightItem(index: number) {\n    this.highlight(index);\n  }\n\n  private renderMain() {\n    if (this.isEmpty()) {\n      return null;\n    }\n    const { hasShadow, maxHeight, preventWindowScroll } = this.getProps();\n\n    const offsetY = isTheme2022(this.theme)\n      ? {\n          top: 4,\n          right: 0,\n          bottom: 4,\n        }\n      : {};\n\n    const isMobile = this.isMobileLayout;\n    return (\n      <div\n        data-tid={MenuDataTids.root}\n        className={cx(getAlignRightClass(this.props), {\n          [styles.root(this.theme)]: true,\n          [styles.rootMobile(this.theme)]: isMobile,\n          [styles.shadow(this.theme)]: hasShadow && !isMobile,\n        })}\n        style={getStyle(this.props)}\n        ref={this.setRootNode}\n      >\n        <ScrollContainer\n          ref={this.refScrollContainer}\n          maxHeight={maxHeight}\n          preventWindowScroll={preventWindowScroll}\n          disabled={this.props.disableScrollContainer}\n          offsetY={offsetY}\n        >\n          <div\n            className={cx({\n              [styles.scrollContainer(this.theme)]: true,\n              [styles.scrollContainerMobile(this.theme)]: isMobile,\n            })}\n          >\n            {this.getChildList()}\n          </div>\n        </ScrollContainer>\n      </div>\n    );\n  }\n\n  private getChildList = () => {\n    const enableIconPadding = React.Children.toArray(this.props.children).some(\n      (x) => React.isValidElement(x) && x.props.icon,\n    );\n\n    return React.Children.map(this.props.children, (child, index) => {\n      if (!child) {\n        return child;\n      }\n\n      if (typeof child === 'string' || typeof child === 'number') {\n        return child;\n      }\n\n      const modifiedChild = addIconPaddingIfPartOfMenu(child, enableIconPadding);\n\n      if (isActiveElement(modifiedChild)) {\n        const highlight = this.state.highlightedIndex === index;\n\n        let ref = modifiedChild.ref;\n        if (highlight && typeof modifiedChild.ref !== 'string') {\n          ref = this.refHighlighted.bind(this, modifiedChild.ref);\n        }\n\n        return React.cloneElement<MenuItemProps, MenuItem>(modifiedChild, {\n          ref,\n          state: highlight ? 'hover' : modifiedChild.props.state,\n          onClick: this.select.bind(this, index, false),\n          onMouseEnter: this.highlight.bind(this, index),\n          onMouseLeave: this.unhighlight,\n        });\n      }\n\n      return modifiedChild;\n    });\n  };\n\n  private refScrollContainer = (scrollContainer: Nullable<ScrollContainer>) => {\n    this.scrollContainer = scrollContainer;\n  };\n\n  private refHighlighted(\n    originalRef: ((menuItem: MenuItem | null) => any) | React.RefObject<MenuItem> | null | undefined,\n    menuItem: MenuItem | null,\n  ) {\n    this.highlighted = menuItem;\n\n    if (typeof originalRef === 'function') {\n      originalRef(menuItem);\n    }\n  }\n\n  private scrollToSelected = () => {\n    if (this.scrollContainer && this.highlighted) {\n      const rootNode = getRootNode(this.highlighted);\n      // TODO: Remove this check once IF-647 is resolved\n      if (rootNode instanceof HTMLElement) {\n        this.scrollContainer.scrollTo(rootNode);\n      }\n    }\n  };\n\n  private scrollToTop = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToTop();\n    }\n  };\n\n  private scrollToBottom = () => {\n    if (this.scrollContainer) {\n      this.scrollContainer.scrollToBottom();\n    }\n  };\n\n  private select(index: number, shouldHandleHref: boolean, event: React.SyntheticEvent<HTMLElement>): boolean {\n    const item = childrenToArray(this.props.children)[index];\n    if (isActiveElement(item)) {\n      if (shouldHandleHref && item.props.href) {\n        if (item.props.target) {\n          window.open(item.props.href, item.props.target);\n        } else {\n          location.href = item.props.href;\n        }\n      }\n      if (item.props.onClick) {\n        item.props.onClick(event);\n      }\n      if (this.props.onItemClick) {\n        this.props.onItemClick();\n      }\n      return true;\n    }\n    return false;\n  }\n\n  private highlight = (index: number) => {\n    this.setState({ highlightedIndex: index });\n  };\n\n  private unhighlight = () => {\n    this.setState({ highlightedIndex: -1 });\n  };\n\n  private move(step: number) {\n    if (this.unmounted) {\n      // NOTE workaround, because `ComboBox` call `process.nextTick` in reducer\n      return;\n    }\n\n    const children = childrenToArray(this.props.children);\n    const activeElements = children.filter(isActiveElement);\n    if (!activeElements.length) {\n      return;\n    }\n    let index = this.state.highlightedIndex;\n    do {\n      index += step;\n      if (index < 0) {\n        index = children.length - 1;\n      } else if (index > children.length) {\n        index = 0;\n      }\n\n      const child = children[index];\n      if (isActiveElement(child)) {\n        this.setState({ highlightedIndex: index }, () => {\n          switch (activeElements.indexOf(child)) {\n            case 0:\n              this.scrollToTop();\n              break;\n            case activeElements.length - 1:\n              this.scrollToBottom();\n              break;\n            default:\n              this.scrollToSelected();\n          }\n        });\n        return;\n      }\n    } while (index !== this.state.highlightedIndex);\n  }\n\n  private isEmpty() {\n    const { children } = this.props;\n    return !children || !childrenToArray(children).filter(isNonNullable).length;\n  }\n}\n\nfunction childrenToArray(children: React.ReactNode): React.ReactNode[] {\n  const ret: React.ReactNode[] = [];\n  // Use forEach instead of map to avoid cloning for key unifying.\n  React.Children.forEach(children, (child) => {\n    ret.push(child);\n  });\n  return ret;\n}\n\nconst getStyle = (props: MenuProps): CSSProperties => {\n  if (props.align === 'right') {\n    return {\n      maxWidth: props.width,\n      minWidth: props.width,\n      maxHeight: props.maxHeight,\n    };\n  }\n\n  return {\n    width: props.width,\n    maxHeight: props.maxHeight,\n  };\n};\n\nconst getAlignRightClass = (props: MenuProps) => {\n  if (props.align === 'right') {\n    return cx({\n      [styles.alignRight()]: !isIE11,\n      [styles.alignRightIE11()]: isIE11,\n      [styles.alignRightIE11FixAutoWidth()]: isIE11 && props.width === 'auto',\n    });\n  }\n\n  return null;\n};\n"]}

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

@@ -1,4 +1,11 @@
-export declare const jsStyles: {
-    root(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
-    shadow(t: Readonly<typeof import("../themes/DefaultTheme").DefaultTheme>): string;
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    rootMobile(t: Theme): string;
+    alignRight(): string;
+    alignRightIE11(): string;
+    alignRightIE11FixAutoWidth(): string;
+    scrollContainer(t: Theme): string;
+    scrollContainerMobile(t: Theme): string;
+    shadow(t: Theme): string;
 };

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

@@ -1,22 +1,62 @@
-"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");function _templateObject2() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", ";\n      box-shadow: ", ";\n    "]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      box-sizing: content-box;\n      overflow: auto;\n      padding: 5px 0;\n    "]);_templateObject = function _templateObject() {return data;};return data;}
+"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;
 
 
-var styles = {
+var styles = (0, _Emotion.memoizeStyle)({
   root: function root(t) {
-    return (0, _Emotion.css)(_templateObject(),
-    t.bgDefault);
+    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    "])),
+    t.menuBgDefault,
+    t.menuBorderRadius,
+    t.menuBoxSizing,
 
+    t.menuPaddingX,
+    t.menuOffsetY,
+    t.menuBorderRadius);
 
+  },
+
+  rootMobile: function rootMobile(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border-radius: 0;\n      margin: 0;\n      padding: 0 ", ";\n    "])),
+
+
+    t.mobileMenuPaddingX);
+
+  },
+
+  alignRight: function alignRight() {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      flex: 1 1 100%;\n    "])));
 
 
   },
 
+  alignRightIE11: function alignRightIE11() {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      float: right;\n      width: 100%;\n    "])));
+
+
+
+  },
+
+  alignRightIE11FixAutoWidth: function alignRightIE11FixAutoWidth() {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      box-sizing: border-box !important; // override root styles\n      overflow: hidden !important; // override root styles\n    "])));
+
+
+
+  },
+
+  scrollContainer: function scrollContainer(t) {
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " 0;\n    "])),
+    t.menuPaddingY);
+
+  },
+
+  scrollContainerMobile: function scrollContainerMobile(t) {
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      padding: ", " 0;\n    "])),
+    t.mobileMenuPaddingY);
+
+  },
+
   shadow: function shadow(t) {
-    return (0, _Emotion.css)(_templateObject2(),
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      border: ", ";\n      box-shadow: ", ";\n    "])),
     t.menuBorder,
     t.menuShadow);
 
-  } };
-
-
-var jsStyles = (0, _Emotion.memoizeStyle)(styles);exports.jsStyles = jsStyles;
+  } });exports.styles = styles;

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

@@ -1 +1 @@
-{"version":3,"sources":["Menu.styles.ts"],"names":["styles","root","t","css","bgDefault","shadow","menuBorder","menuShadow","jsStyles"],"mappings":"8QAAA,oD;;;AAGA,IAAMA,MAAM,GAAG;AACbC,EAAAA,IADa,gBACRC,CADQ,EACE;AACb,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACE,SADlB;;;;;AAMD,GARY;;AAUbC,EAAAA,MAVa,kBAUNH,CAVM,EAUI;AACf,eAAOC,YAAP;AACYD,IAAAA,CAAC,CAACI,UADd;AAEgBJ,IAAAA,CAAC,CAACK,UAFlB;;AAID,GAfY,EAAf;;;AAkBO,IAAMC,QAAQ,GAAG,2BAAaR,MAAb,CAAjB,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\n\r\nconst styles = {\r\n  root(t: Theme) {\r\n    return css`\r\n      background: ${t.bgDefault};\r\n      box-sizing: content-box;\r\n      overflow: auto;\r\n      padding: 5px 0;\r\n    `;\r\n  },\r\n\r\n  shadow(t: Theme) {\r\n    return css`\r\n      border: ${t.menuBorder};\r\n      box-shadow: ${t.menuShadow};\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"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"]}

package/cjs/internal/Menu/index.js

@@ -1 +1 @@
-"use strict";exports.__esModule = true;var _Menu = require("./Menu");Object.keys(_Menu).forEach(function (key) {if (key === "default" || key === "__esModule") return;exports[key] = _Menu[key];});
+"use strict";exports.__esModule = true;var _Menu = require("./Menu");Object.keys(_Menu).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _Menu[key]) return;exports[key] = _Menu[key];});

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Menu';\r\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './Menu';\n"]}

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';\r\n\r\nimport { MenuItem, MenuItemProps, isMenuItem } from '../../components/MenuItem';\r\n\r\nexport function isActiveElement(element: any): element is React.ComponentElement<MenuItemProps, MenuItem> {\r\n  return isMenuItem(element) && !element.props.disabled;\r\n}\r\n"]}
+{"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"]}

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

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

package/cjs/internal/MenuMessage/MenuMessage.js

@@ -0,0 +1,43 @@
+"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"));
+
+var _forwardRefAndName = require("../../lib/forwardRefAndName");
+var _ResponsiveLayout = require("../../components/ResponsiveLayout");
+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 MenuMessageDataTids = {
+  root: 'MenuMessage__root' };exports.MenuMessageDataTids = 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);
+  var _useResponsiveLayout = (0, _ResponsiveLayout.useResponsiveLayout)(),isMobile = _useResponsiveLayout.isMobile;
+
+  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
+
+  return /*#__PURE__*/(
+    _react.default.createElement(Tag, (0, _extends2.default)({
+      ref: ref,
+      "data-tid": MenuMessageDataTids.root,
+      className: (0, _Emotion.cx)((_cx = {}, _cx[
+
+      _MenuMessage.styles.root(theme)] = true, _cx[
+      _MenuMessage.styles.rootMobile(theme)] = isMobile, _cx),
+
+      className) },
+
+    rest),
+
+    children));
+
+
+});exports.MenuMessage = MenuMessage;

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

@@ -0,0 +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"]}

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

@@ -0,0 +1,5 @@
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    rootMobile(t: Theme): string;
+};

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

@@ -0,0 +1,33 @@
+"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 _MenuItem = require("../../components/MenuItem/MenuItem.styles");var _templateObject, _templateObject2;
+
+var styles = (0, _Emotion.memoizeStyle)({
+  root: function root(t) {
+    var _getMenuItemPaddings = (0, _MenuItem.getMenuItemPaddings)({
+      menuItemLegacyPaddingX: t.menuItemLegacyPaddingX,
+      menuItemPaddingX: t.menuMessagePaddingX,
+      menuItemLegacyPaddingY: t.menuItemLegacyPaddingY,
+      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    "])),
+
+
+
+    t.menuMessageDisplay,
+    t.menuMessageLineHeight,
+    t.menuMessageFontSize,
+    t.menuMessagePaddingY, paddingX, paddingY, t.menuMessagePaddingX,
+    t.menuMessageTextColor,
+    t.menuMessageBg);
+
+  },
+
+  rootMobile: function rootMobile(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])),
+    t.menuMessageFontSizeMobile,
+    t.menuMessageLineHeightMobile,
+    t.menuMessagePaddingMobile);
+
+  } });exports.styles = styles;

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

@@ -0,0 +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"]}

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

@@ -0,0 +1 @@
+export * from './MenuMessage';

package/cjs/internal/MenuMessage/index.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;var _MenuMessage = require("./MenuMessage");Object.keys(_MenuMessage).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _MenuMessage[key]) return;exports[key] = _MenuMessage[key];});

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"uCAAA","sourcesContent":["export * from './MenuMessage';\n"]}

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

@@ -0,0 +1,39 @@
+import React from 'react';
+interface MobilePopupProps {
+    /**
+     * Функция, вызываемая при закрытии всплывающего окна
+     */
+    onClose?: () => void;
+    /**
+     * Заголовок всплывающего окна, располагается в шапке
+     */
+    caption?: string;
+    /**
+     * Шапка всплывающего окна
+     */
+    headerChildComponent?: React.ReactNode;
+    /**
+     * Позволяет получить контент всплывающего окна без обёртки в виде `RenderContainer`
+     */
+    withoutRenderContainer?: boolean;
+    /**
+     * Функция, вызываемая при клике по вуали
+     */
+    onCloseRequest?: () => void;
+    /**
+     * Позволяет контролировать текущее состояние всплывающего окна
+     */
+    opened: boolean;
+}
+export declare const MobilePopupDataTids: {
+    readonly root: "MobilePopup__root";
+    readonly container: "MobilePopup__container";
+};
+export declare class MobilePopup extends React.Component<MobilePopupProps> {
+    static __KONTUR_REACT_UI__: string;
+    private theme;
+    render(): JSX.Element;
+    renderMain(): JSX.Element;
+    close: () => void;
+}
+export {};