@skbkontur/react-ui 1.12.1 → 2.0.0-beta.4

package/components/MenuHeader/MenuHeader.js

@@ -1,45 +1,82 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var React = tslib_1.__importStar(require("react"));
-var MenuHeader_module_less_1 = tslib_1.__importDefault(require("./MenuHeader.module.css"));
-var createPropsGetter_1 = require("../internal/createPropsGetter");
-var Emotion_1 = require("../../lib/theming/Emotion");
-var MenuHeader_styles_1 = tslib_1.__importDefault(require("./MenuHeader.styles"));
-var ThemeConsumer_1 = require("../ThemeConsumer");
-/**
- * Заголовок в меню.
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useContext } from 'react';
+import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { MenuContext } from '../../internal/Menu/MenuContext.js';
+import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
+import { getStyles } from './MenuHeader.styles.js';
+export var MenuHeaderDataTids = {
+    root: 'MenuHeader__root',
+};
+/**
+ * Заголовок меню `MenuHeader` используется для того, чтобы разделить элементы меню на категории в рамках одного меню.
+ *
+ * `MenuHeader`, в отличие от `MenuItem` нельзя затаргетить с клавиатуры.
+ *
+ * Сущности в которых может быть использован `MenuHeader`: DropdownMenu, Kebab, TooltipMenu и Select.
  */
-var MenuHeader = /** @class */function (_super) {
-  tslib_1.__extends(MenuHeader, _super);
-  function MenuHeader() {
-    var _this = _super !== null && _super.apply(this, arguments) || this;
-    _this.getProps = createPropsGetter_1.createPropsGetter(MenuHeader.defaultProps);
-    return _this;
-  }
-  MenuHeader.prototype.render = function () {
-    var _this = this;
-    return React.createElement(ThemeConsumer_1.ThemeConsumer, null, function (theme) {
-      _this.theme = theme;
-      return _this.renderMain();
-    });
-  };
-  MenuHeader.prototype.renderMain = function () {
-    var _a;
-    var classnames = Emotion_1.cx((_a = {},
-    _a[MenuHeader_module_less_1["default"].root] = true,
-    _a[MenuHeader_styles_1["default"].withLeftPadding(this.theme)] = this.getProps()._enableIconPadding,
-    _a));
-    return React.createElement("div", { className: classnames }, this.props.children);
-  };
-  MenuHeader.__KONTUR_REACT_UI__ = 'MenuHeader';
-  MenuHeader.__MENU_HEADER__ = true;
-  MenuHeader.defaultProps = {
-    _enableIconPadding: false };
-
-  return MenuHeader;
-}(React.Component);
-exports["default"] = MenuHeader;
-exports.isMenuHeader = function (child) {
-  return React.isValidElement(child) ? child.type.hasOwnProperty('__MENU_HEADER__') : false;
-};
+var MenuHeader = forwardRefAndName('MenuHeader', function MenuHeader(_a, ref) {
+    var _b;
+    var id = _a.id, _c = _a._enableIconPadding, _enableIconPadding = _c === void 0 ? false : _c, children = _a.children, _d = _a.size, size = _d === void 0 ? 'small' : _d, rest = __rest(_a, ["id", "_enableIconPadding", "children", "size"]);
+    var theme = useContext(ThemeContext);
+    var cx = useEmotion().cx;
+    var styles = useStyles(getStyles);
+    var menuContext = useContext(MenuContext);
+    function getRootSizeClassName() {
+        switch (size) {
+            case 'large':
+                return styles.rootLarge(theme);
+            case 'medium':
+                return styles.rootMedium(theme);
+            case 'small':
+            default:
+                return styles.rootSmall(theme);
+        }
+    }
+    function getWithLeftPaddingSizeClassName() {
+        switch (size) {
+            case 'large':
+                return styles.withLeftPaddingSmall(theme);
+            case 'medium':
+                return styles.withLeftPaddingMedium(theme);
+            case 'small':
+            default:
+                return styles.withLeftPaddingSmall(theme);
+        }
+    }
+    return (React.createElement(CommonWrapper, __assign({}, rest),
+        React.createElement("div", { ref: ref, id: id, "data-tid": MenuHeaderDataTids.root, className: cx(getRootSizeClassName(), (_b = {},
+                _b[styles.root(theme)] = true,
+                _b[getWithLeftPaddingSizeClassName()] = menuContext.enableIconPadding || _enableIconPadding,
+                _b)) }, children)));
+});
+MenuHeader.__MENU_HEADER__ = true;
+export { MenuHeader };
+export var isMenuHeader = function (child) {
+    return React.isValidElement(child)
+        ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_HEADER__')
+        : false;
+};
+//# sourceMappingURL=MenuHeader.js.map

package/components/MenuHeader/MenuHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuHeader.js","sourceRoot":"","sources":["MenuHeader.tsx"],"names":[],"mappings":";;;AAAA,mDAA+B;AAC/B,4FAA8C;AAC9C,mEAAkE;AAElE,qDAA+C;AAC/C,kFAA2C;AAC3C,kDAAiD;AAQjD;;GAEG;AACH;IAAwC,sCAAgC;IAAxE;QAAA,qEA6BC;QApBS,cAAQ,GAAG,qCAAiB,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;;IAoBhE,CAAC;IAlBQ,2BAAM,GAAb;QAAA,iBASC;QARC,OAAO,CACL,oBAAC,6BAAa,QACX,UAAA,KAAK;YACJ,KAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,OAAO,KAAI,CAAC,UAAU,EAAE,CAAC;QAC3B,CAAC,CACa,CACjB,CAAC;IACJ,CAAC;IAEO,+BAAU,GAAlB;;QACE,IAAM,UAAU,GAAW,YAAE;YAC3B,GAAC,gCAAM,CAAC,IAAI,IAAG,IAAI;YACnB,GAAC,2BAAQ,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,IAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,kBAAkB;gBAC1E,CAAC;QACH,OAAO,6BAAK,SAAS,EAAE,UAAU,IAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAO,CAAC;IACjE,CAAC;IA3Ba,8BAAmB,GAAG,YAAY,CAAC;IACnC,0BAAe,GAAG,IAAI,CAAC;IAEvB,uBAAY,GAAG;QAC3B,kBAAkB,EAAE,KAAK;KAC1B,CAAC;IAuBJ,iBAAC;CAAA,AA7BD,CAAwC,KAAK,CAAC,SAAS,GA6BtD;kBA7BoB,UAAU;AA+BlB,QAAA,YAAY,GAAG,UAAC,KAAuB;IAClD,OAAO,KAAK,CAAC,cAAc,CAAkB,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;AAC7G,CAAC,CAAC"}
+{"version":3,"file":"MenuHeader.js","sourceRoot":"","sources":["../../../components/MenuHeader/MenuHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAEnE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAanD,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,IAAI,EAAE,kBAAkB;CAChB,CAAC;AAEX;;;;;;GAMG;AAEH,IAAM,UAAU,GAAG,iBAAiB,CAClC,YAAY,EACZ,SAAS,UAAU,CACjB,EAAsF,EACtF,GAA8B;;IAD5B,IAAA,EAAE,QAAA,EAAE,0BAA0B,EAA1B,kBAAkB,mBAAG,KAAK,KAAA,EAAE,QAAQ,cAAA,EAAE,YAAc,EAAd,IAAI,mBAAG,OAAO,KAAA,EAAK,IAAI,cAAnE,gDAAqE,CAAF;IAGnE,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC/B,IAAA,EAAE,GAAK,UAAU,EAAE,GAAjB,CAAkB;IAC5B,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;IACpC,IAAM,WAAW,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAE5C,SAAS,oBAAoB;QAC3B,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;YACjC,KAAK,QAAQ;gBACX,OAAO,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;YAClC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;QACnC,CAAC;IACH,CAAC;IACD,SAAS,+BAA+B;QACtC,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;YAC5C,KAAK,QAAQ;gBACX,OAAO,MAAM,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC;YAC7C,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,MAAM,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;QAC9C,CAAC;IACH,CAAC;IAED,OAAO,CACL,oBAAC,aAAa,eAAK,IAAI;QACrB,6BACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,EAAE,cACI,kBAAkB,CAAC,IAAI,EACjC,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE;gBAClC,GAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAG,IAAI;gBAC1B,GAAC,+BAA+B,EAAE,IAAG,WAAW,CAAC,iBAAiB,IAAI,kBAAkB;oBACxF,IAED,QAAQ,CACL,CACQ,CACjB,CAAC;AACJ,CAAC,CACF,CAAC;AAED,UAAkB,CAAC,eAAe,GAAG,IAAI,CAAC;AAE3C,OAAO,EAAE,UAAU,EAAE,CAAC;AAEtB,MAAM,CAAC,IAAM,YAAY,GAAG,UAAC,KAAsB;IACjD,OAAO,KAAK,CAAC,cAAc,CAAkB,KAAK,CAAC;QACjD,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,iBAAiB,CAAC;QACrE,CAAC,CAAC,KAAK,CAAC;AACZ,CAAC,CAAC","sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\nimport React, { useContext } from 'react';\n\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { MenuContext } from '../../internal/Menu/MenuContext.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\n\nimport { getStyles } from './MenuHeader.styles.js';\n\nexport interface MenuHeaderProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /** Добавляет отступ иконке. */\n  _enableIconPadding?: boolean;\n\n  /** @ignore */\n  children: ReactNode;\n\n  /** Задает размер. */\n  size?: SizeProp;\n}\n\nexport const MenuHeaderDataTids = {\n  root: 'MenuHeader__root',\n} as const;\n\n/**\n * Заголовок меню `MenuHeader` используется для того, чтобы разделить элементы меню на категории в рамках одного меню.\n *\n * `MenuHeader`, в отличие от `MenuItem` нельзя затаргетить с клавиатуры.\n *\n * Сущности в которых может быть использован `MenuHeader`: DropdownMenu, Kebab, TooltipMenu и Select.\n */\n\nconst MenuHeader = forwardRefAndName(\n  'MenuHeader',\n  function MenuHeader(\n    { id, _enableIconPadding = false, children, size = 'small', ...rest }: MenuHeaderProps,\n    ref: React.Ref<HTMLDivElement>,\n  ) {\n    const theme = useContext(ThemeContext);\n    const { cx } = useEmotion();\n    const styles = useStyles(getStyles);\n    const menuContext = useContext(MenuContext);\n\n    function getRootSizeClassName() {\n      switch (size) {\n        case 'large':\n          return styles.rootLarge(theme);\n        case 'medium':\n          return styles.rootMedium(theme);\n        case 'small':\n        default:\n          return styles.rootSmall(theme);\n      }\n    }\n    function getWithLeftPaddingSizeClassName() {\n      switch (size) {\n        case 'large':\n          return styles.withLeftPaddingSmall(theme);\n        case 'medium':\n          return styles.withLeftPaddingMedium(theme);\n        case 'small':\n        default:\n          return styles.withLeftPaddingSmall(theme);\n      }\n    }\n\n    return (\n      <CommonWrapper {...rest}>\n        <div\n          ref={ref}\n          id={id}\n          data-tid={MenuHeaderDataTids.root}\n          className={cx(getRootSizeClassName(), {\n            [styles.root(theme)]: true,\n            [getWithLeftPaddingSizeClassName()]: menuContext.enableIconPadding || _enableIconPadding,\n          })}\n        >\n          {children}\n        </div>\n      </CommonWrapper>\n    );\n  },\n);\n\n(MenuHeader as any).__MENU_HEADER__ = true;\n\nexport { MenuHeader };\n\nexport const isMenuHeader = (child: React.ReactNode): child is React.ReactElement<MenuHeaderProps> => {\n  return React.isValidElement<MenuHeaderProps>(child)\n    ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_HEADER__')\n    : false;\n};\n"]}

package/components/MenuHeader/MenuHeader.mixins.d.ts

@@ -0,0 +1,2 @@
+export declare const menuHeaderSizeMixin: (menuHeaderPaddingX: string, menuHeaderFontSize: string, menuHeaderLineHeight: string, menuHeaderPaddingTop: string, menuHeaderPaddingBottom: string) => string;
+export declare const withIconSizeMixin: (menuItemPaddingForIcon: string) => string;

package/components/MenuHeader/MenuHeader.mixins.js

@@ -0,0 +1,8 @@
+export var menuHeaderSizeMixin = function (menuHeaderPaddingX, menuHeaderFontSize, menuHeaderLineHeight, menuHeaderPaddingTop, menuHeaderPaddingBottom) {
+    var paddingRight = menuHeaderPaddingX;
+    return "\n    font-size: ".concat(menuHeaderFontSize, ";\n    line-height: ").concat(menuHeaderLineHeight, ";\n    padding: ").concat(menuHeaderPaddingTop, " ").concat(paddingRight, " ").concat(menuHeaderPaddingBottom, " ").concat(menuHeaderPaddingX, ";\n  ");
+};
+export var withIconSizeMixin = function (menuItemPaddingForIcon) {
+    return "\n    padding-left: ".concat(menuItemPaddingForIcon, ";\n  ");
+};
+//# sourceMappingURL=MenuHeader.mixins.js.map

package/components/MenuHeader/MenuHeader.mixins.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuHeader.mixins.js","sourceRoot":"","sources":["../../../components/MenuHeader/MenuHeader.mixins.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,mBAAmB,GAAG,UACjC,kBAA0B,EAC1B,kBAA0B,EAC1B,oBAA4B,EAC5B,oBAA4B,EAC5B,uBAA+B;IAE/B,IAAM,YAAY,GAAG,kBAAkB,CAAC;IAExC,OAAO,2BACQ,kBAAkB,iCAChB,oBAAoB,6BACxB,oBAAoB,cAAI,YAAY,cAAI,uBAAuB,cAAI,kBAAkB,UACjG,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,iBAAiB,GAAG,UAAC,sBAA8B;IAC9D,OAAO,8BACW,sBAAsB,UACvC,CAAC;AACJ,CAAC,CAAC","sourcesContent":["export const menuHeaderSizeMixin = (\n  menuHeaderPaddingX: string,\n  menuHeaderFontSize: string,\n  menuHeaderLineHeight: string,\n  menuHeaderPaddingTop: string,\n  menuHeaderPaddingBottom: string,\n): string => {\n  const paddingRight = menuHeaderPaddingX;\n\n  return `\n    font-size: ${menuHeaderFontSize};\n    line-height: ${menuHeaderLineHeight};\n    padding: ${menuHeaderPaddingTop} ${paddingRight} ${menuHeaderPaddingBottom} ${menuHeaderPaddingX};\n  `;\n};\n\nexport const withIconSizeMixin = (menuItemPaddingForIcon: string): string => {\n  return `\n    padding-left: ${menuItemPaddingForIcon};\n  `;\n};\n"]}

package/components/MenuHeader/MenuHeader.styles.d.ts

@@ -1,5 +1,10 @@
-import { ITheme } from '../../lib/theming/Theme';
-declare const jsStyles: {
-    withLeftPadding(t: ITheme): string;
-};
-export default jsStyles;
+import type { Theme } from '../../lib/theming/Theme.js';
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
+    root(t: Theme): string;
+    rootSmall(t: Theme): string;
+    rootMedium(t: Theme): string;
+    rootLarge(t: Theme): string;
+    withLeftPaddingSmall(t: Theme): string;
+    withLeftPaddingMedium(t: Theme): string;
+    withLeftPaddingLarge(t: Theme): string;
+}>;

package/components/MenuHeader/MenuHeader.styles.js

@@ -1,12 +1,34 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var Emotion_1 = require("../../lib/theming/Emotion");
-var MenuHeader_module_less_1 = tslib_1.__importDefault(require("./MenuHeader.module.css"));
-var jsStyles = {
-  withLeftPadding: function withLeftPadding(t) {
-    return Emotion_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      .", "& {\n        padding-left: ", ";\n      }\n    "], ["\n      .", "& {\n        padding-left: ", ";\n      }\n    "])), MenuHeader_module_less_1["default"].root, t.menuItemPaddingForIcon);
-  } };
-
-exports["default"] = jsStyles;
-var templateObject_1;
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+import { menuHeaderSizeMixin, withIconSizeMixin } from './MenuHeader.mixins.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        root: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      color: ", ";\n      cursor: default;\n    "], ["\n      color: ", ";\n      cursor: default;\n    "])), t.menuHeaderColor);
+        },
+        rootSmall: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), menuHeaderSizeMixin(t.menuHeaderPaddingXSmall, t.menuHeaderFontSizeSmall, t.menuHeaderLineHeightSmall, t.menuHeaderPaddingTopSmall, t.menuHeaderPaddingBottomSmall));
+        },
+        rootMedium: function (t) {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), menuHeaderSizeMixin(t.menuHeaderPaddingXMedium, t.menuHeaderFontSizeMedium, t.menuHeaderLineHeightMedium, t.menuHeaderPaddingTopMedium, t.menuHeaderPaddingBottomMedium));
+        },
+        rootLarge: function (t) {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      ", ";\n    "], ["\n      ", ";\n    "])), menuHeaderSizeMixin(t.menuHeaderPaddingXLarge, t.menuHeaderFontSizeLarge, t.menuHeaderLineHeightLarge, t.menuHeaderPaddingTopLarge, t.menuHeaderPaddingBottomLarge));
+        },
+        withLeftPaddingSmall: function (t) {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconSmall));
+        },
+        withLeftPaddingMedium: function (t) {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconMedium));
+        },
+        withLeftPaddingLarge: function (t) {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      ", "\n    "], ["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconLarge));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
+//# sourceMappingURL=MenuHeader.styles.js.map

package/components/MenuHeader/MenuHeader.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuHeader.styles.js","sourceRoot":"","sources":["MenuHeader.styles.ts"],"names":[],"mappings":";;;AAAA,qDAAgD;AAChD,4FAA8C;AAG9C,IAAM,QAAQ,GAAG;IACf,eAAe,YAAC,CAAS;QACvB,OAAO,aAAG,yIAAA,WACL,EAAW,6BACI,EAAwB,kBAE3C,KAHI,gCAAM,CAAC,IAAI,EACI,CAAC,CAAC,sBAAsB,EAE1C;IACJ,CAAC;CACF,CAAC;AAEF,kBAAe,QAAQ,CAAC"}
+{"version":3,"file":"MenuHeader.styles.js","sourceRoot":"","sources":["../../../components/MenuHeader/MenuHeader.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAEhF,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI,YAAC,CAAQ;YACX,OAAO,GAAG,uHAAA,iBACC,EAAiB,iCAE3B,KAFU,CAAC,CAAC,eAAe,EAE1B;QACJ,CAAC;QAED,SAAS,YAAC,CAAQ;YAChB,OAAO,GAAG,wFAAA,UACN,EAMD,SACF,KAPG,mBAAmB,CACnB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,4BAA4B,CAC/B,EACD;QACJ,CAAC;QACD,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,wFAAA,UACN,EAMD,SACF,KAPG,mBAAmB,CACnB,CAAC,CAAC,wBAAwB,EAC1B,CAAC,CAAC,wBAAwB,EAC1B,CAAC,CAAC,0BAA0B,EAC5B,CAAC,CAAC,0BAA0B,EAC5B,CAAC,CAAC,6BAA6B,CAChC,EACD;QACJ,CAAC;QACD,SAAS,YAAC,CAAQ;YAChB,OAAO,GAAG,wFAAA,UACN,EAMD,SACF,KAPG,mBAAmB,CACnB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,4BAA4B,CAC/B,EACD;QACJ,CAAC;QAED,oBAAoB,YAAC,CAAQ;YAC3B,OAAO,GAAG,uFAAA,UACN,EAAgD,QACnD,KADG,iBAAiB,CAAC,CAAC,CAAC,2BAA2B,CAAC,EAClD;QACJ,CAAC;QACD,qBAAqB,YAAC,CAAQ;YAC5B,OAAO,GAAG,uFAAA,UACN,EAAiD,QACpD,KADG,iBAAiB,CAAC,CAAC,CAAC,4BAA4B,CAAC,EACnD;QACJ,CAAC;QACD,oBAAoB,YAAC,CAAQ;YAC3B,OAAO,GAAG,uFAAA,UACN,EAAgD,QACnD,KADG,iBAAiB,CAAC,CAAC,CAAC,2BAA2B,CAAC,EAClD;QACJ,CAAC;KACF,CAAC;AAzD8D,CAyD9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nimport { menuHeaderSizeMixin, withIconSizeMixin } from './MenuHeader.mixins.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  root(t: Theme) {\n    return css`\n      color: ${t.menuHeaderColor};\n      cursor: default;\n    `;\n  },\n\n  rootSmall(t: Theme) {\n    return css`\n      ${menuHeaderSizeMixin(\n        t.menuHeaderPaddingXSmall,\n        t.menuHeaderFontSizeSmall,\n        t.menuHeaderLineHeightSmall,\n        t.menuHeaderPaddingTopSmall,\n        t.menuHeaderPaddingBottomSmall,\n      )};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${menuHeaderSizeMixin(\n        t.menuHeaderPaddingXMedium,\n        t.menuHeaderFontSizeMedium,\n        t.menuHeaderLineHeightMedium,\n        t.menuHeaderPaddingTopMedium,\n        t.menuHeaderPaddingBottomMedium,\n      )};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${menuHeaderSizeMixin(\n        t.menuHeaderPaddingXLarge,\n        t.menuHeaderFontSizeLarge,\n        t.menuHeaderLineHeightLarge,\n        t.menuHeaderPaddingTopLarge,\n        t.menuHeaderPaddingBottomLarge,\n      )};\n    `;\n  },\n\n  withLeftPaddingSmall(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconSmall)}\n    `;\n  },\n  withLeftPaddingMedium(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconMedium)}\n    `;\n  },\n  withLeftPaddingLarge(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconLarge)}\n    `;\n  },\n}));\n"]}

package/components/MenuHeader/index.d.ts

@@ -1 +1 @@
-export { default, MenuHeaderProps, isMenuHeader } from './MenuHeader';
+export * from './MenuHeader.js';

package/components/MenuHeader/index.js

@@ -1,5 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var MenuHeader_1 = require("./MenuHeader");
-exports["default"] = MenuHeader_1["default"];
-exports.isMenuHeader = MenuHeader_1.isMenuHeader;
+export * from './MenuHeader.js';
+//# sourceMappingURL=index.js.map

package/components/MenuHeader/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":";;AAAA,2CAAsE;AAA7D,+BAAA,OAAO,CAAA;AAAmB,oCAAA,YAAY,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/MenuHeader/index.tsx"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC","sourcesContent":["export * from './MenuHeader.js';\n"]}

package/components/MenuItem/MenuItem.d.ts

@@ -1,52 +1,103 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-export declare type MenuItemState = null | 'hover' | 'selected' | void;
-export declare type MenuItemElement = HTMLAnchorElement | HTMLSpanElement;
-export interface MenuItemProps {
-    /** @ignore */
-    _enableIconPadding?: boolean;
-    /** @ignore */
-    alkoLink?: boolean;
-    comment?: React.ReactNode;
-    disabled?: boolean;
-    icon?: React.ReactElement<any>;
-    link?: boolean;
-    /** @ignore */
-    loose?: boolean;
-    /** @ignore */
-    state?: MenuItemState;
-    onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
-    children?: React.ReactNode | ((state: MenuItemState) => React.ReactNode);
-    target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
-    title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];
-    href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];
-    onMouseEnter?: React.MouseEventHandler;
-    onMouseLeave?: React.MouseEventHandler;
-    component?: React.ComponentType<any>;
-}
-/**
- * Элемент меню.
- */
-export default class MenuItem extends React.Component<MenuItemProps> {
-    static __KONTUR_REACT_UI__: string;
-    static __MENU_ITEM__: boolean;
-    static propTypes: {
-        alkoLink: PropTypes.Requireable<boolean>;
-        comment: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        disabled: PropTypes.Requireable<boolean>;
-        href: PropTypes.Requireable<string>;
-        icon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        loose: PropTypes.Requireable<boolean>;
-        state: PropTypes.Requireable<string>;
-        target: PropTypes.Requireable<string>;
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    private theme;
-    private mouseEntered;
-    render(): JSX.Element;
-    private renderMain;
-    private handleMouseEnterFix;
-    private handleMouseLeave;
-    private getComponent;
-}
-export declare const isMenuItem: (child: React.ReactChild) => child is React.ReactElement<MenuItemProps>;
+import type { AriaAttributes, HTMLAttributes } from 'react';
+import React from 'react';
+import type { CommonProps } from '../../internal/CommonWrapper/index.js';
+import type { TGetRootNode } from '../../lib/rootNode/index.js';
+import type { SizeProp } from '../../lib/types/props.js';
+import type { MenuContextType } from '../../internal/Menu/MenuContext.js';
+export type MenuItemState = null | 'hover' | 'selected' | void;
+export interface MenuItemProps extends Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>, Pick<HTMLAttributes<HTMLElement>, 'id'>, Omit<CommonProps, 'children'> {
+    /** Добавляет отступ иконке.
+     * @ignore */
+    _enableIconPadding?: boolean;
+    /** Добавляет описание для элемента меню. */
+    comment?: React.ReactNode;
+    /** Делает компонент недоступным. */
+    disabled?: boolean;
+    /** Добавляет иконку элементу меню. */
+    icon?: React.ReactElement;
+    /** Задает размер контрола. */
+    size?: SizeProp;
+    /** @ignore */
+    loose?: boolean;
+    /** @ignore */
+    state?: MenuItemState;
+    /** Задает функцию, которая вызывается при клике. */
+    onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
+    /** Задает функцию, которая вызывается при наведении мышкой (событие `onmouseenter`). */
+    onMouseEnter?: React.MouseEventHandler;
+    /** Задает функцию, которая вызывается при уходе мышки с объекта (событие `onmouseleave`). */
+    onMouseLeave?: React.MouseEventHandler;
+    /** @ignore */
+    children?: React.ReactNode | ((state: MenuItemState) => React.ReactNode);
+    /** Задает HTML-атрибут `target`. */
+    target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
+    /** Задает HTML-атрибут `title`. */
+    title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];
+    /** Задает HTML-атрибут `href` - адрес, на который следует перейти. */
+    href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];
+    /** Задает HTML-атрибут `rel`. Для внешних ссылок аттрибут rel по умолчанию равен "noopener noreferrer". */
+    rel?: React.AnchorHTMLAttributes<HTMLAnchorElement>['rel'];
+    /** Заменяет корневой элемент, на компонент переданный в проп.
+     * По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`. */
+    component?: React.ComponentType<any>;
+    /** Запрещает выделение и выбор данного пункта меню. */
+    isNotSelectable?: boolean;
+    /** Устанавливает стиль для отображения в мобильной версии. */
+    isMobile?: boolean;
+    /** @ignore */
+    scrollIntoView?: boolean;
+}
+export declare const MenuItemDataTids: {
+    readonly root: "MenuItem__root";
+    readonly content: "MenuItem__content";
+    readonly comment: "MenuItem__comment";
+};
+/**
+ * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.
+ *
+ * Сущности в которых может быть использован `MenuItem`: DropdownMenu, Kebab, TooltipMenu и Select.
+ */
+export declare class MenuItem extends React.Component<MenuItemProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    static __MENU_ITEM__: boolean;
+    state: {
+        iconOffsetTop: number;
+        highlighted: boolean;
+    };
+    private globalObject;
+    private emotion;
+    private cx;
+    private styles;
+    private theme;
+    private mouseEntered;
+    getRootNode: TGetRootNode;
+    private setRootNode;
+    private rootRef;
+    private contentRef;
+    static contextType: React.Context<MenuContextType>;
+    context: MenuContextType;
+    render(): React.JSX.Element;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    componentDidUpdate(prevProps: Readonly<MenuItemProps>): void;
+    highlight: () => void;
+    unhighlight: () => void;
+    select: (event: React.SyntheticEvent<HTMLElement>) => void;
+    isEnabled: () => boolean;
+    navigate: () => void;
+    private getRootSizeClassName;
+    private getIconSizeClassName;
+    private getWithIconSizeClassName;
+    private renderMain;
+    private get activeState();
+    private get isHover();
+    private get isSelected();
+    private handleMouseEnterFix;
+    private handleMouseLeave;
+    private handleClick;
+    private setRootRef;
+    private getComponent;
+    private hasIconAmongItems;
+}
+export declare const isMenuItem: (child: React.ReactNode) => child is React.ReactElement<any, string | React.JSXElementConstructor<any>>;