@skbkontur/react-ui 6.4.6-b246a.0 → 6.4.7-25ce4.0

package/components/MaskedInputV2/react-imask/input.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { type IMaskInputProps } from './mixin.js';
 declare const IMaskInput: React.ForwardRefExoticComponent<Omit<import("./mixin.js").ReactElementProps<HTMLInputElement> & Omit<import("./mixin.js").ReactMaskProps<HTMLInputElement, {
     [x: string]: unknown;
-}>, "ref"> & Partial<Pick<import("./imask/index.js").MaskedPattern<string>, "mask" | "parent" | "format" | "prepare" | "prepareChar" | "validate" | "commit" | "parse" | "overwrite" | "eager" | "skipInvalid" | "autofix" | "definitions" | "blocks" | "placeholderChar" | "displayChar" | "lazy">> & {
+}>, "ref"> & Partial<Pick<import("./imask/index.js").MaskedPattern<string>, "mask" | "format" | "parent" | "prepare" | "prepareChar" | "validate" | "commit" | "parse" | "overwrite" | "eager" | "skipInvalid" | "autofix" | "definitions" | "blocks" | "placeholderChar" | "displayChar" | "lazy">> & {
     ref?: React.Ref<React.ComponentType<IMaskInputProps<HTMLInputElement>>> | undefined;
 }, "ref"> & React.RefAttributes<unknown>>;
 export { IMaskInput };

package/components/MenuFooter/MenuFooter.css.d.ts

@@ -0,0 +1,16 @@
+export declare const root: string;
+export declare const rootSmall: string;
+export declare const rootMedium: string;
+export declare const rootLarge: string;
+export declare const withLeftPaddingSmall: string;
+export declare const withLeftPaddingMedium: string;
+export declare const withLeftPaddingLarge: string;
+export declare const styles: {
+    root: string;
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+    withLeftPaddingSmall: string;
+    withLeftPaddingMedium: string;
+    withLeftPaddingLarge: string;
+};

package/components/MenuFooter/MenuFooter.css.js

@@ -0,0 +1,9 @@
+
+export var root = 'react-ui-MenuFooter__root';
+export var rootLarge = 'react-ui-MenuFooter__rootLarge';
+export var rootMedium = 'react-ui-MenuFooter__rootMedium';
+export var rootSmall = 'react-ui-MenuFooter__rootSmall';
+export var styles = {root:'react-ui-MenuFooter__root',rootSmall:'react-ui-MenuFooter__rootSmall',rootMedium:'react-ui-MenuFooter__rootMedium',rootLarge:'react-ui-MenuFooter__rootLarge',withLeftPaddingSmall:'react-ui-MenuFooter__withLeftPaddingSmall',withLeftPaddingMedium:'react-ui-MenuFooter__withLeftPaddingMedium',withLeftPaddingLarge:'react-ui-MenuFooter__withLeftPaddingLarge'};
+export var withLeftPaddingLarge = 'react-ui-MenuFooter__withLeftPaddingLarge';
+export var withLeftPaddingMedium = 'react-ui-MenuFooter__withLeftPaddingMedium';
+export var withLeftPaddingSmall = 'react-ui-MenuFooter__withLeftPaddingSmall';

package/components/MenuFooter/MenuFooter.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuFooter.css.js","sourceRoot":"","sources":["MenuFooter.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAEhF,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,KAAK,EAAE,CAAC,CAAC,eAAe;IACxB,MAAM,EAAE,SAAS;CAClB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAC5B,mBAAmB,CACjB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,4BAA4B,CAC/B,CACF,CAAC;AACF,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAC7B,mBAAmB,CACjB,CAAC,CAAC,wBAAwB,EAC1B,CAAC,CAAC,wBAAwB,EAC1B,CAAC,CAAC,0BAA0B,EAC5B,CAAC,CAAC,0BAA0B,EAC5B,CAAC,CAAC,6BAA6B,CAChC,CACF,CAAC;AACF,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAC5B,mBAAmB,CACjB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,4BAA4B,CAC/B,CACF,CAAC;AAEF,MAAM,CAAC,IAAM,oBAAoB,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC;AAC5F,MAAM,CAAC,IAAM,qBAAqB,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC;AAC9F,MAAM,CAAC,IAAM,oBAAoB,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC;AAE5F,MAAM,CAAC,IAAM,MAAM,GAAG;IACpB,IAAI,MAAA;IACJ,SAAS,WAAA;IACT,UAAU,YAAA;IACV,SAAS,WAAA;IACT,oBAAoB,sBAAA;IACpB,qBAAqB,uBAAA;IACrB,oBAAoB,sBAAA;CACrB,CAAC","sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\nimport { menuFooterSizeMixin, withIconSizeMixin } from './MenuFooter.mixins.js';\n\nexport const root = style({\n  color: t.menuFooterColor,\n  cursor: 'default',\n});\n\nexport const rootSmall = style(\n  menuFooterSizeMixin(\n    t.menuFooterPaddingXSmall,\n    t.menuFooterFontSizeSmall,\n    t.menuFooterLineHeightSmall,\n    t.menuFooterPaddingTopSmall,\n    t.menuFooterPaddingBottomSmall,\n  ),\n);\nexport const rootMedium = style(\n  menuFooterSizeMixin(\n    t.menuFooterPaddingXMedium,\n    t.menuFooterFontSizeMedium,\n    t.menuFooterLineHeightMedium,\n    t.menuFooterPaddingTopMedium,\n    t.menuFooterPaddingBottomMedium,\n  ),\n);\nexport const rootLarge = style(\n  menuFooterSizeMixin(\n    t.menuFooterPaddingXLarge,\n    t.menuFooterFontSizeLarge,\n    t.menuFooterLineHeightLarge,\n    t.menuFooterPaddingTopLarge,\n    t.menuFooterPaddingBottomLarge,\n  ),\n);\n\nexport const withLeftPaddingSmall = style(withIconSizeMixin(t.menuItemPaddingForIconSmall));\nexport const withLeftPaddingMedium = style(withIconSizeMixin(t.menuItemPaddingForIconMedium));\nexport const withLeftPaddingLarge = style(withIconSizeMixin(t.menuItemPaddingForIconLarge));\n\nexport const styles = {\n  root,\n  rootSmall,\n  rootMedium,\n  rootLarge,\n  withLeftPaddingSmall,\n  withLeftPaddingMedium,\n  withLeftPaddingLarge,\n};\n"]}

package/components/MenuFooter/MenuFooter.js

@@ -20,13 +20,12 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { useContext } from 'react';
+import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { cx } from '../../lib/cx.js';
 import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
-import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
 import { useSizeControl } from '../../lib/size/useSizeControl.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
-import { getStyles } from './MenuFooter.styles.js';
+import { styles } from './MenuFooter.css.js';
 export var MenuFooterDataTids = {
     root: 'MenuFooter__root',
 };
@@ -36,35 +35,32 @@ export var MenuFooterDataTids = {
 var MenuFooter = forwardRefAndName('MenuFooter', function MenuFooter(_a, ref) {
     var _b;
     var id = _a.id, _c = _a._enableIconPadding, _enableIconPadding = _c === void 0 ? false : _c, children = _a.children, sizeProp = _a.size, rest = __rest(_a, ["id", "_enableIconPadding", "children", "size"]);
-    var theme = useContext(ThemeContext);
-    var cx = useEmotion().cx;
-    var styles = useStyles(getStyles);
     var size = useSizeControl(sizeProp);
     function getRootSizeClassName() {
         switch (size) {
             case 'large':
-                return styles.rootLarge(theme);
+                return styles.rootLarge;
             case 'medium':
-                return styles.rootMedium(theme);
+                return styles.rootMedium;
             case 'small':
             default:
-                return styles.rootSmall(theme);
+                return styles.rootSmall;
         }
     }
     function getWithLeftPaddingSizeClassName() {
         switch (size) {
             case 'large':
-                return styles.withLeftPaddingSmall(theme);
+                return styles.withLeftPaddingLarge;
             case 'medium':
-                return styles.withLeftPaddingMedium(theme);
+                return styles.withLeftPaddingMedium;
             case 'small':
             default:
-                return styles.withLeftPaddingSmall(theme);
+                return styles.withLeftPaddingSmall;
         }
     }
     return (React.createElement(CommonWrapper, __assign({}, rest),
         React.createElement("div", { id: id, ref: ref, "data-tid": MenuFooterDataTids.root, className: cx(getRootSizeClassName(), (_b = {},
-                _b[styles.root(theme)] = true,
+                _b[styles.root] = true,
                 _b[getWithLeftPaddingSizeClassName()] = _enableIconPadding,
                 _b)) }, children)));
 });

package/components/MenuFooter/MenuFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuFooter.js","sourceRoot":"","sources":["MenuFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,OAAO,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAanD,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,IAAI,EAAE,kBAAkB;CAChB,CAAC;AAEX;;GAEG;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,EAAQ,QAAQ,UAAA,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,IAAI,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC;IACtC,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,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,cACE,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,kBAAkB;oBACvD,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 type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { useSizeControl } from '../../lib/size/useSizeControl.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { getStyles } from './MenuFooter.styles.js';\n\nexport interface MenuFooterProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /** Размер надписи. */\n  size?: SizeProp;\n\n  /** Добавляет отступ слева для выравнивания текста по иконкам MenuItem */\n  _enableIconPadding?: boolean;\n\n  /** @ignore */\n  children: ReactNode;\n}\n\nexport const MenuFooterDataTids = {\n  root: 'MenuFooter__root',\n} as const;\n\n/**\n * Футер меню — надпись в нижней части меню.\n */\n\nconst MenuFooter = forwardRefAndName(\n  'MenuFooter',\n  function MenuFooter(\n    { id, _enableIconPadding = false, children, size: sizeProp, ...rest }: MenuFooterProps,\n    ref: React.Ref<HTMLDivElement>,\n  ) {\n    const theme = useContext(ThemeContext);\n    const { cx } = useEmotion();\n    const styles = useStyles(getStyles);\n    const size = useSizeControl(sizeProp);\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          id={id}\n          ref={ref}\n          data-tid={MenuFooterDataTids.root}\n          className={cx(getRootSizeClassName(), {\n            [styles.root(theme)]: true,\n            [getWithLeftPaddingSizeClassName()]: _enableIconPadding,\n          })}\n        >\n          {children}\n        </div>\n      </CommonWrapper>\n    );\n  },\n);\n\n(MenuFooter as any).__MENU_FOOTER__ = true;\n\nexport { MenuFooter };\n\nexport const isMenuFooter = (child: React.ReactNode): child is React.ReactElement<MenuFooterProps> => {\n  return React.isValidElement<MenuFooterProps>(child)\n    ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_FOOTER__')\n    : false;\n};\n"]}
+{"version":3,"file":"MenuFooter.js","sourceRoot":"","sources":["MenuFooter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAa7C,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,IAAI,EAAE,kBAAkB;CAChB,CAAC;AAEX;;GAEG;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,EAAQ,QAAQ,UAAA,EAAK,IAAI,cAAnE,gDAAqE,CAAF;IAGnE,IAAM,IAAI,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC;IACtC,SAAS,oBAAoB;QAC3B,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,SAAS,CAAC;YAC1B,KAAK,QAAQ;gBACX,OAAO,MAAM,CAAC,UAAU,CAAC;YAC3B,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,MAAM,CAAC,SAAS,CAAC;QAC5B,CAAC;IACH,CAAC;IACD,SAAS,+BAA+B;QACtC,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,oBAAoB,CAAC;YACrC,KAAK,QAAQ;gBACX,OAAO,MAAM,CAAC,qBAAqB,CAAC;YACtC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,MAAM,CAAC,oBAAoB,CAAC;QACvC,CAAC;IACH,CAAC;IAED,OAAO,CACL,oBAAC,aAAa,eAAK,IAAI;QACrB,6BACE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,GAAG,cACE,kBAAkB,CAAC,IAAI,EACjC,SAAS,EAAE,EAAE,CAAC,oBAAoB,EAAE;gBAClC,GAAC,MAAM,CAAC,IAAI,IAAG,IAAI;gBACnB,GAAC,+BAA+B,EAAE,IAAG,kBAAkB;oBACvD,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 from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { cx } from '../../lib/cx.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport { useSizeControl } from '../../lib/size/useSizeControl.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { styles } from './MenuFooter.css.js';\n\nexport interface MenuFooterProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /** Размер надписи. */\n  size?: SizeProp;\n\n  /** Добавляет отступ слева для выравнивания текста по иконкам MenuItem */\n  _enableIconPadding?: boolean;\n\n  /** @ignore */\n  children: ReactNode;\n}\n\nexport const MenuFooterDataTids = {\n  root: 'MenuFooter__root',\n} as const;\n\n/**\n * Футер меню — надпись в нижней части меню.\n */\n\nconst MenuFooter = forwardRefAndName(\n  'MenuFooter',\n  function MenuFooter(\n    { id, _enableIconPadding = false, children, size: sizeProp, ...rest }: MenuFooterProps,\n    ref: React.Ref<HTMLDivElement>,\n  ) {\n    const size = useSizeControl(sizeProp);\n    function getRootSizeClassName() {\n      switch (size) {\n        case 'large':\n          return styles.rootLarge;\n        case 'medium':\n          return styles.rootMedium;\n        case 'small':\n        default:\n          return styles.rootSmall;\n      }\n    }\n    function getWithLeftPaddingSizeClassName() {\n      switch (size) {\n        case 'large':\n          return styles.withLeftPaddingLarge;\n        case 'medium':\n          return styles.withLeftPaddingMedium;\n        case 'small':\n        default:\n          return styles.withLeftPaddingSmall;\n      }\n    }\n\n    return (\n      <CommonWrapper {...rest}>\n        <div\n          id={id}\n          ref={ref}\n          data-tid={MenuFooterDataTids.root}\n          className={cx(getRootSizeClassName(), {\n            [styles.root]: true,\n            [getWithLeftPaddingSizeClassName()]: _enableIconPadding,\n          })}\n        >\n          {children}\n        </div>\n      </CommonWrapper>\n    );\n  },\n);\n\n(MenuFooter as any).__MENU_FOOTER__ = true;\n\nexport { MenuFooter };\n\nexport const isMenuFooter = (child: React.ReactNode): child is React.ReactElement<MenuFooterProps> => {\n  return React.isValidElement<MenuFooterProps>(child)\n    ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_FOOTER__')\n    : false;\n};\n"]}

package/components/MenuFooter/MenuFooter.mixins.d.ts

@@ -1,2 +1,8 @@
-export declare const menuFooterSizeMixin: (menuFooterPaddingX: string, menuFooterFontSize: string, menuFooterLineHeight: string, menuFooterPaddingTop: string, menuFooterPaddingBottom: string) => string;
-export declare const withIconSizeMixin: (menuItemPaddingForIcon: string) => string;
+export declare const menuFooterSizeMixin: (menuFooterPaddingX: string, menuFooterFontSize: string, menuFooterLineHeight: string, menuFooterPaddingTop: string, menuFooterPaddingBottom: string) => {
+    fontSize: string;
+    lineHeight: string;
+    padding: string;
+};
+export declare const withIconSizeMixin: (menuItemPaddingForIcon: string) => {
+    paddingLeft: string;
+};

package/components/MenuFooter/MenuFooter.mixins.js

@@ -1,8 +1,12 @@
 export var menuFooterSizeMixin = function (menuFooterPaddingX, menuFooterFontSize, menuFooterLineHeight, menuFooterPaddingTop, menuFooterPaddingBottom) {
     var paddingRight = menuFooterPaddingX;
-    return "\n    font-size: ".concat(menuFooterFontSize, ";\n    line-height: ").concat(menuFooterLineHeight, ";\n    padding: ").concat(menuFooterPaddingTop, " ").concat(paddingRight, " ").concat(menuFooterPaddingBottom, " ").concat(menuFooterPaddingX, ";\n  ");
-};
-export var withIconSizeMixin = function (menuItemPaddingForIcon) {
-    return "\n    padding-left: ".concat(menuItemPaddingForIcon, ";\n  ");
+    return {
+        fontSize: menuFooterFontSize,
+        lineHeight: menuFooterLineHeight,
+        padding: "".concat(menuFooterPaddingTop, " ").concat(paddingRight, " ").concat(menuFooterPaddingBottom, " ").concat(menuFooterPaddingX),
+    };
 };
+export var withIconSizeMixin = function (menuItemPaddingForIcon) { return ({
+    paddingLeft: menuItemPaddingForIcon,
+}); };
 //# sourceMappingURL=MenuFooter.mixins.js.map

package/components/MenuFooter/MenuFooter.mixins.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuFooter.mixins.js","sourceRoot":"","sources":["MenuFooter.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 menuFooterSizeMixin = (\n  menuFooterPaddingX: string,\n  menuFooterFontSize: string,\n  menuFooterLineHeight: string,\n  menuFooterPaddingTop: string,\n  menuFooterPaddingBottom: string,\n): string => {\n  const paddingRight = menuFooterPaddingX;\n\n  return `\n    font-size: ${menuFooterFontSize};\n    line-height: ${menuFooterLineHeight};\n    padding: ${menuFooterPaddingTop} ${paddingRight} ${menuFooterPaddingBottom} ${menuFooterPaddingX};\n  `;\n};\n\nexport const withIconSizeMixin = (menuItemPaddingForIcon: string): string => {\n  return `\n    padding-left: ${menuItemPaddingForIcon};\n  `;\n};\n"]}
+{"version":3,"file":"MenuFooter.mixins.js","sourceRoot":"","sources":["MenuFooter.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;QACL,QAAQ,EAAE,kBAAkB;QAC5B,UAAU,EAAE,oBAAoB;QAChC,OAAO,EAAE,UAAG,oBAAoB,cAAI,YAAY,cAAI,uBAAuB,cAAI,kBAAkB,CAAE;KACpG,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,iBAAiB,GAAG,UAAC,sBAA8B,IAAK,OAAA,CAAC;IACpE,WAAW,EAAE,sBAAsB;CACpC,CAAC,EAFmE,CAEnE,CAAC","sourcesContent":["export const menuFooterSizeMixin = (\n  menuFooterPaddingX: string,\n  menuFooterFontSize: string,\n  menuFooterLineHeight: string,\n  menuFooterPaddingTop: string,\n  menuFooterPaddingBottom: string,\n) => {\n  const paddingRight = menuFooterPaddingX;\n\n  return {\n    fontSize: menuFooterFontSize,\n    lineHeight: menuFooterLineHeight,\n    padding: `${menuFooterPaddingTop} ${paddingRight} ${menuFooterPaddingBottom} ${menuFooterPaddingX}`,\n  };\n};\n\nexport const withIconSizeMixin = (menuItemPaddingForIcon: string) => ({\n  paddingLeft: menuItemPaddingForIcon,\n});\n"]}

package/components/MenuHeader/MenuHeader.css.d.ts

@@ -0,0 +1,16 @@
+export declare const root: string;
+export declare const rootSmall: string;
+export declare const rootMedium: string;
+export declare const rootLarge: string;
+export declare const withLeftPaddingSmall: string;
+export declare const withLeftPaddingMedium: string;
+export declare const withLeftPaddingLarge: string;
+export declare const styles: {
+    root: string;
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+    withLeftPaddingSmall: string;
+    withLeftPaddingMedium: string;
+    withLeftPaddingLarge: string;
+};

package/components/MenuHeader/MenuHeader.css.js

@@ -0,0 +1,9 @@
+
+export var root = 'react-ui-MenuHeader__root';
+export var rootLarge = 'react-ui-MenuHeader__rootLarge';
+export var rootMedium = 'react-ui-MenuHeader__rootMedium';
+export var rootSmall = 'react-ui-MenuHeader__rootSmall';
+export var styles = {root:'react-ui-MenuHeader__root',rootSmall:'react-ui-MenuHeader__rootSmall',rootMedium:'react-ui-MenuHeader__rootMedium',rootLarge:'react-ui-MenuHeader__rootLarge',withLeftPaddingSmall:'react-ui-MenuHeader__withLeftPaddingSmall',withLeftPaddingMedium:'react-ui-MenuHeader__withLeftPaddingMedium',withLeftPaddingLarge:'react-ui-MenuHeader__withLeftPaddingLarge'};
+export var withLeftPaddingLarge = 'react-ui-MenuHeader__withLeftPaddingLarge';
+export var withLeftPaddingMedium = 'react-ui-MenuHeader__withLeftPaddingMedium';
+export var withLeftPaddingSmall = 'react-ui-MenuHeader__withLeftPaddingSmall';

package/components/MenuHeader/MenuHeader.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuHeader.css.js","sourceRoot":"","sources":["MenuHeader.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,OAAO,EAAE,CAAC,EAAE,MAAM,8BAA8B,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAEhF,MAAM,CAAC,IAAM,IAAI,GAAG,KAAK,CAAC;IACxB,KAAK,EAAE,CAAC,CAAC,eAAe;IACxB,MAAM,EAAE,SAAS;CAClB,CAAC,CAAC;AAEH,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAC5B,mBAAmB,CACjB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,4BAA4B,CAC/B,CACF,CAAC;AACF,MAAM,CAAC,IAAM,UAAU,GAAG,KAAK,CAC7B,mBAAmB,CACjB,CAAC,CAAC,wBAAwB,EAC1B,CAAC,CAAC,wBAAwB,EAC1B,CAAC,CAAC,0BAA0B,EAC5B,CAAC,CAAC,0BAA0B,EAC5B,CAAC,CAAC,6BAA6B,CAChC,CACF,CAAC;AACF,MAAM,CAAC,IAAM,SAAS,GAAG,KAAK,CAC5B,mBAAmB,CACjB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,uBAAuB,EACzB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,4BAA4B,CAC/B,CACF,CAAC;AAEF,MAAM,CAAC,IAAM,oBAAoB,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC;AAC5F,MAAM,CAAC,IAAM,qBAAqB,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,4BAA4B,CAAC,CAAC,CAAC;AAC9F,MAAM,CAAC,IAAM,oBAAoB,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC;AAE5F,MAAM,CAAC,IAAM,MAAM,GAAG;IACpB,IAAI,MAAA;IACJ,SAAS,WAAA;IACT,UAAU,YAAA;IACV,SAAS,WAAA;IACT,oBAAoB,sBAAA;IACpB,qBAAqB,uBAAA;IACrB,oBAAoB,sBAAA;CACrB,CAAC","sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { t } from '../../lib/theming/vanilla.js';\nimport { menuHeaderSizeMixin, withIconSizeMixin } from './MenuHeader.mixins.js';\n\nexport const root = style({\n  color: t.menuHeaderColor,\n  cursor: 'default',\n});\n\nexport const rootSmall = style(\n  menuHeaderSizeMixin(\n    t.menuHeaderPaddingXSmall,\n    t.menuHeaderFontSizeSmall,\n    t.menuHeaderLineHeightSmall,\n    t.menuHeaderPaddingTopSmall,\n    t.menuHeaderPaddingBottomSmall,\n  ),\n);\nexport const rootMedium = style(\n  menuHeaderSizeMixin(\n    t.menuHeaderPaddingXMedium,\n    t.menuHeaderFontSizeMedium,\n    t.menuHeaderLineHeightMedium,\n    t.menuHeaderPaddingTopMedium,\n    t.menuHeaderPaddingBottomMedium,\n  ),\n);\nexport const rootLarge = style(\n  menuHeaderSizeMixin(\n    t.menuHeaderPaddingXLarge,\n    t.menuHeaderFontSizeLarge,\n    t.menuHeaderLineHeightLarge,\n    t.menuHeaderPaddingTopLarge,\n    t.menuHeaderPaddingBottomLarge,\n  ),\n);\n\nexport const withLeftPaddingSmall = style(withIconSizeMixin(t.menuItemPaddingForIconSmall));\nexport const withLeftPaddingMedium = style(withIconSizeMixin(t.menuItemPaddingForIconMedium));\nexport const withLeftPaddingLarge = style(withIconSizeMixin(t.menuItemPaddingForIconLarge));\n\nexport const styles = {\n  root,\n  rootSmall,\n  rootMedium,\n  rootLarge,\n  withLeftPaddingSmall,\n  withLeftPaddingMedium,\n  withLeftPaddingLarge,\n};\n"]}

package/components/MenuHeader/MenuHeader.js

@@ -23,11 +23,10 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React, { useContext } from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
 import { MenuContext } from '../../internal/Menu/MenuContext.js';
+import { cx } from '../../lib/cx.js';
 import { forwardRefAndName } from '../../lib/forwardRefAndName.js';
-import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
 import { useSizeControl } from '../../lib/size/useSizeControl.js';
-import { ThemeContext } from '../../lib/theming/ThemeContext.js';
-import { getStyles } from './MenuHeader.styles.js';
+import { styles } from './MenuHeader.css.js';
 export var MenuHeaderDataTids = {
     root: 'MenuHeader__root',
 };
@@ -37,36 +36,33 @@ export var MenuHeaderDataTids = {
 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, sizeProp = _a.size, rest = __rest(_a, ["id", "_enableIconPadding", "children", "size"]);
-    var theme = useContext(ThemeContext);
-    var cx = useEmotion().cx;
-    var styles = useStyles(getStyles);
     var menuContext = useContext(MenuContext);
     var size = useSizeControl(sizeProp);
     function getRootSizeClassName() {
         switch (size) {
             case 'large':
-                return styles.rootLarge(theme);
+                return styles.rootLarge;
             case 'medium':
-                return styles.rootMedium(theme);
+                return styles.rootMedium;
             case 'small':
             default:
-                return styles.rootSmall(theme);
+                return styles.rootSmall;
         }
     }
     function getWithLeftPaddingSizeClassName() {
         switch (size) {
             case 'large':
-                return styles.withLeftPaddingSmall(theme);
+                return styles.withLeftPaddingLarge;
             case 'medium':
-                return styles.withLeftPaddingMedium(theme);
+                return styles.withLeftPaddingMedium;
             case 'small':
             default:
-                return styles.withLeftPaddingSmall(theme);
+                return styles.withLeftPaddingSmall;
         }
     }
     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[styles.root] = true,
                 _b[getWithLeftPaddingSizeClassName()] = menuContext.enableIconPadding || _enableIconPadding,
                 _b)) }, children)));
 });

package/components/MenuHeader/MenuHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuHeader.js","sourceRoot":"","sources":["MenuHeader.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { HTMLAttributes, ReactNode } from 'react';\nimport React, { useContext } from 'react';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { MenuContext } from '../../internal/Menu/MenuContext.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { useSizeControl } from '../../lib/size/useSizeControl.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { getStyles } from './MenuHeader.styles.js';\n\nexport interface MenuHeaderProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /** Размер заголовка. */\n  size?: SizeProp;\n\n  /** Добавляет отступ слева для выравнивания текста по иконкам MenuItem */\n  _enableIconPadding?: boolean;\n\n  /** @ignore */\n  children: ReactNode;\n}\n\nexport const MenuHeaderDataTids = {\n  root: 'MenuHeader__root',\n} as const;\n\n/**\n * Заголовок меню используется для того, чтобы разграничивать элементы меню на категории.\n */\n\nconst MenuHeader = forwardRefAndName(\n  'MenuHeader',\n  function MenuHeader(\n    { id, _enableIconPadding = false, children, size: sizeProp, ...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    const size = useSizeControl(sizeProp);\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"]}
+{"version":3,"file":"MenuHeader.js","sourceRoot":"","sources":["MenuHeader.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,kCAAkC,CAAC;AAElE,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAa7C,MAAM,CAAC,IAAM,kBAAkB,GAAG;IAChC,IAAI,EAAE,kBAAkB;CAChB,CAAC;AAEX;;GAEG;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,EAAQ,QAAQ,UAAA,EAAK,IAAI,cAAnE,gDAAqE,CAAF;IAGnE,IAAM,WAAW,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAC5C,IAAM,IAAI,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAC;IAEtC,SAAS,oBAAoB;QAC3B,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,SAAS,CAAC;YAC1B,KAAK,QAAQ;gBACX,OAAO,MAAM,CAAC,UAAU,CAAC;YAC3B,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,MAAM,CAAC,SAAS,CAAC;QAC5B,CAAC;IACH,CAAC;IACD,SAAS,+BAA+B;QACtC,QAAQ,IAAI,EAAE,CAAC;YACb,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,oBAAoB,CAAC;YACrC,KAAK,QAAQ;gBACX,OAAO,MAAM,CAAC,qBAAqB,CAAC;YACtC,KAAK,OAAO,CAAC;YACb;gBACE,OAAO,MAAM,CAAC,oBAAoB,CAAC;QACvC,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,IAAG,IAAI;gBACnB,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 type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { MenuContext } from '../../internal/Menu/MenuContext.js';\nimport { cx } from '../../lib/cx.js';\nimport { forwardRefAndName } from '../../lib/forwardRefAndName.js';\nimport { useSizeControl } from '../../lib/size/useSizeControl.js';\nimport type { SizeProp } from '../../lib/types/props.js';\nimport { styles } from './MenuHeader.css.js';\n\nexport interface MenuHeaderProps extends CommonProps, Pick<HTMLAttributes<HTMLElement>, 'id'> {\n  /** Размер заголовка. */\n  size?: SizeProp;\n\n  /** Добавляет отступ слева для выравнивания текста по иконкам MenuItem */\n  _enableIconPadding?: boolean;\n\n  /** @ignore */\n  children: ReactNode;\n}\n\nexport const MenuHeaderDataTids = {\n  root: 'MenuHeader__root',\n} as const;\n\n/**\n * Заголовок меню используется для того, чтобы разграничивать элементы меню на категории.\n */\n\nconst MenuHeader = forwardRefAndName(\n  'MenuHeader',\n  function MenuHeader(\n    { id, _enableIconPadding = false, children, size: sizeProp, ...rest }: MenuHeaderProps,\n    ref: React.Ref<HTMLDivElement>,\n  ) {\n    const menuContext = useContext(MenuContext);\n    const size = useSizeControl(sizeProp);\n\n    function getRootSizeClassName() {\n      switch (size) {\n        case 'large':\n          return styles.rootLarge;\n        case 'medium':\n          return styles.rootMedium;\n        case 'small':\n        default:\n          return styles.rootSmall;\n      }\n    }\n    function getWithLeftPaddingSizeClassName() {\n      switch (size) {\n        case 'large':\n          return styles.withLeftPaddingLarge;\n        case 'medium':\n          return styles.withLeftPaddingMedium;\n        case 'small':\n        default:\n          return styles.withLeftPaddingSmall;\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]: 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

@@ -1,2 +1,8 @@
-export declare const menuHeaderSizeMixin: (menuHeaderPaddingX: string, menuHeaderFontSize: string, menuHeaderLineHeight: string, menuHeaderPaddingTop: string, menuHeaderPaddingBottom: string) => string;
-export declare const withIconSizeMixin: (menuItemPaddingForIcon: string) => string;
+export declare const menuHeaderSizeMixin: (menuHeaderPaddingX: string, menuHeaderFontSize: string, menuHeaderLineHeight: string, menuHeaderPaddingTop: string, menuHeaderPaddingBottom: string) => {
+    fontSize: string;
+    lineHeight: string;
+    padding: string;
+};
+export declare const withIconSizeMixin: (menuItemPaddingForIcon: string) => {
+    paddingLeft: string;
+};

package/components/MenuHeader/MenuHeader.mixins.js

@@ -1,8 +1,12 @@
 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  ");
+    return {
+        fontSize: menuHeaderFontSize,
+        lineHeight: menuHeaderLineHeight,
+        padding: "".concat(menuHeaderPaddingTop, " ").concat(paddingRight, " ").concat(menuHeaderPaddingBottom, " ").concat(menuHeaderPaddingX),
+    };
 };
+export var withIconSizeMixin = function (menuItemPaddingForIcon) { return ({
+    paddingLeft: menuItemPaddingForIcon,
+}); };
 //# sourceMappingURL=MenuHeader.mixins.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MenuHeader.mixins.js","sourceRoot":"","sources":["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"]}
+{"version":3,"file":"MenuHeader.mixins.js","sourceRoot":"","sources":["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;QACL,QAAQ,EAAE,kBAAkB;QAC5B,UAAU,EAAE,oBAAoB;QAChC,OAAO,EAAE,UAAG,oBAAoB,cAAI,YAAY,cAAI,uBAAuB,cAAI,kBAAkB,CAAE;KACpG,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,iBAAiB,GAAG,UAAC,sBAA8B,IAAK,OAAA,CAAC;IACpE,WAAW,EAAE,sBAAsB;CACpC,CAAC,EAFmE,CAEnE,CAAC","sourcesContent":["export const menuHeaderSizeMixin = (\n  menuHeaderPaddingX: string,\n  menuHeaderFontSize: string,\n  menuHeaderLineHeight: string,\n  menuHeaderPaddingTop: string,\n  menuHeaderPaddingBottom: string,\n) => {\n  const paddingRight = menuHeaderPaddingX;\n\n  return {\n    fontSize: menuHeaderFontSize,\n    lineHeight: menuHeaderLineHeight,\n    padding: `${menuHeaderPaddingTop} ${paddingRight} ${menuHeaderPaddingBottom} ${menuHeaderPaddingX}`,\n  };\n};\n\nexport const withIconSizeMixin = (menuItemPaddingForIcon: string) => ({\n  paddingLeft: menuItemPaddingForIcon,\n});\n"]}

package/components/MenuItem/MenuItem.css.d.ts

@@ -0,0 +1,50 @@
+export declare const root: string;
+export declare const rootSmall: string;
+export declare const rootMedium: string;
+export declare const rootLarge: string;
+export declare const rootMobile: string;
+export declare const rootMobileLarge: string;
+export declare const rootMobileMedium: string;
+export declare const rootMobileSmall: string;
+export declare const hover: string;
+export declare const selected: string;
+export declare const disabled: string;
+export declare const nonSelectable: string;
+export declare const loose: string;
+export declare const withIconSmall: string;
+export declare const withIconMedium: string;
+export declare const withIconLarge: string;
+export declare const comment: string;
+export declare const commentHover: string;
+export declare const commentDisabled: string;
+export declare const icon: string;
+export declare const iconSmall: string;
+export declare const iconMedium: string;
+export declare const iconLarge: string;
+export declare const mobileContentWithIcon: string;
+export declare const styles: {
+    root: string;
+    rootSmall: string;
+    rootMedium: string;
+    rootLarge: string;
+    rootMobile: string;
+    rootMobileLarge: string;
+    rootMobileMedium: string;
+    rootMobileSmall: string;
+    hover: string;
+    selected: string;
+    disabled: string;
+    nonSelectable: string;
+    loose: string;
+    withIconSmall: string;
+    withIconMedium: string;
+    withIconLarge: string;
+    comment: string;
+    commentHover: string;
+    commentDisabled: string;
+    icon: string;
+    iconSmall: string;
+    iconMedium: string;
+    iconLarge: string;
+    mobileContentWithIcon: string;
+};

package/components/MenuItem/MenuItem.css.js

@@ -0,0 +1,26 @@
+
+export var comment = 'react-ui-MenuItem__comment';
+export var commentDisabled = 'react-ui-MenuItem__commentDisabled';
+export var commentHover = 'react-ui-MenuItem__commentHover';
+export var disabled = 'react-ui-MenuItem__disabled';
+export var hover = 'react-ui-MenuItem__hover';
+export var icon = 'react-ui-MenuItem__icon';
+export var iconLarge = 'react-ui-MenuItem__iconLarge';
+export var iconMedium = 'react-ui-MenuItem__iconMedium';
+export var iconSmall = 'react-ui-MenuItem__iconSmall';
+export var loose = 'react-ui-MenuItem__loose';
+export var mobileContentWithIcon = 'react-ui-MenuItem__mobileContentWithIcon';
+export var nonSelectable = 'react-ui-MenuItem__nonSelectable';
+export var root = 'react-ui-MenuItem__root';
+export var rootLarge = 'react-ui-MenuItem__rootLarge';
+export var rootMedium = 'react-ui-MenuItem__rootMedium';
+export var rootMobile = 'react-ui-MenuItem__rootMobile';
+export var rootMobileLarge = 'react-ui-MenuItem__rootMobileLarge';
+export var rootMobileMedium = 'react-ui-MenuItem__rootMobileMedium';
+export var rootMobileSmall = 'react-ui-MenuItem__rootMobileSmall';
+export var rootSmall = 'react-ui-MenuItem__rootSmall';
+export var selected = 'react-ui-MenuItem__selected';
+export var styles = {root:'react-ui-MenuItem__root',rootSmall:'react-ui-MenuItem__rootSmall',rootMedium:'react-ui-MenuItem__rootMedium',rootLarge:'react-ui-MenuItem__rootLarge',rootMobile:'react-ui-MenuItem__rootMobile',rootMobileLarge:'react-ui-MenuItem__rootMobileLarge',rootMobileMedium:'react-ui-MenuItem__rootMobileMedium',rootMobileSmall:'react-ui-MenuItem__rootMobileSmall',hover:'react-ui-MenuItem__hover',selected:'react-ui-MenuItem__selected',disabled:'react-ui-MenuItem__disabled',nonSelectable:'react-ui-MenuItem__nonSelectable',loose:'react-ui-MenuItem__loose',withIconSmall:'react-ui-MenuItem__withIconSmall',withIconMedium:'react-ui-MenuItem__withIconMedium',withIconLarge:'react-ui-MenuItem__withIconLarge',comment:'react-ui-MenuItem__comment',commentHover:'react-ui-MenuItem__commentHover',commentDisabled:'react-ui-MenuItem__commentDisabled',icon:'react-ui-MenuItem__icon',iconSmall:'react-ui-MenuItem__iconSmall',iconMedium:'react-ui-MenuItem__iconMedium',iconLarge:'react-ui-MenuItem__iconLarge',mobileContentWithIcon:'react-ui-MenuItem__mobileContentWithIcon'};
+export var withIconLarge = 'react-ui-MenuItem__withIconLarge';
+export var withIconMedium = 'react-ui-MenuItem__withIconMedium';
+export var withIconSmall = 'react-ui-MenuItem__withIconSmall';

package/components/MenuItem/MenuItem.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.css.js","sourceRoot":"","sources":["MenuItem.css.ts"],"names":[],"mappings":"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","sourcesContent":["import { globalStyle, style } from '@vanilla-extract/css';\n\nimport { resetButtonRule } from '../../lib/styles/Mixins.js';\nimport { resetButtonFocusInner } from '../../lib/styles/resetButtonFocusInner.js';\nimport { t } from '../../lib/theming/vanilla.js';\nimport { iconSizeMixin, menuItemSizeMixin, withIconSizeMixin } from './MenuItem.mixins.js';\n\n// color из resetButtonRule переопределяется ниже, но остаётся объявлением на месте последнего вхождения\nconst { color: resetColor, ...resetButtonWithoutColor } = resetButtonRule;\n\nexport const root = style({\n  ...resetButtonWithoutColor,\n  cursor: 'pointer',\n  display: t.menuItemDisplay,\n  position: 'relative',\n  textDecoration: 'none',\n  color: [resetColor, t.menuItemTextColor],\n  borderRadius: t.menuItemBorderRadius,\n});\n\nexport const rootSmall = style(\n  menuItemSizeMixin(\n    t.menuItemPaddingXSmall,\n    t.menuItemPaddingYSmall,\n    t.menuItemLineHeightSmall,\n    t.menuItemFontSizeSmall,\n  ),\n);\nexport const rootMedium = style(\n  menuItemSizeMixin(\n    t.menuItemPaddingXMedium,\n    t.menuItemPaddingYMedium,\n    t.menuItemLineHeightMedium,\n    t.menuItemFontSizeMedium,\n  ),\n);\nexport const rootLarge = style(\n  menuItemSizeMixin(\n    t.menuItemPaddingXLarge,\n    t.menuItemPaddingYLarge,\n    t.menuItemLineHeightLarge,\n    t.menuItemFontSizeLarge,\n  ),\n);\n\nexport const rootMobile = style({\n  fontSize: t.menuItemFontSizeMobile,\n  lineHeight: t.menuItemLineHeightMobile,\n  padding: t.menuItemPaddingMobile,\n});\n\nexport const rootMobileLarge = style({\n  fontSize: t.mobileMenuItemFontSizeLarge,\n  lineHeight: t.mobileMenuItemLineHeightLarge,\n  padding: t.mobileMenuItemPaddingLarge,\n});\nexport const rootMobileMedium = style({\n  fontSize: t.mobileMenuItemFontSizeMedium,\n  lineHeight: t.mobileMenuItemLineHeightMedium,\n  padding: t.mobileMenuItemPaddingMedium,\n});\nexport const rootMobileSmall = style({\n  fontSize: t.mobileMenuItemFontSizeSmall,\n  lineHeight: t.mobileMenuItemLineHeightSmall,\n  padding: t.mobileMenuItemPaddingSmall,\n});\n\n// Color with !important in purpose to override `a:hover`\nexport const hover = style({\n  background: `${t.menuItemHoverBg} !important`,\n  color: `${t.menuItemHoverColor} !important`,\n});\nexport const selected = style({ background: `${t.menuItemSelectedBg} !important` });\nexport const disabled = style({\n  background: t.menuItemDisabledBg,\n  color: t.menuItemDisabledColor,\n  cursor: 'default',\n});\nexport const nonSelectable = style({ cursor: 'default' });\nexport const loose = style({ paddingLeft: 15 });\nexport const withIconSmall = style(withIconSizeMixin(t.menuItemPaddingForIconSmall));\nexport const withIconMedium = style(withIconSizeMixin(t.menuItemPaddingForIconMedium));\nexport const withIconLarge = style(withIconSizeMixin(t.menuItemPaddingForIconLarge));\nexport const comment = style({\n  color: t.menuItemCommentColor,\n  opacity: t.menuItemCommentOpacity,\n  whiteSpace: 'normal',\n  paddingTop: 4,\n});\nexport const commentHover = style({\n  color: t.menuItemCommentColorHover,\n  opacity: t.menuItemCommentOpacityHover,\n});\nexport const commentDisabled = style({ color: t.menuItemDisabledColor });\nexport const icon = style({\n  display: 'inline-block',\n  position: 'absolute',\n  transform: 'translateY(0px)', // icon shifts one pixel up in firefox on medium size without this property\n});\nexport const iconSmall = style(iconSizeMixin(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall));\nexport const iconMedium = style(iconSizeMixin(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium));\nexport const iconLarge = style(iconSizeMixin(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge));\nexport const mobileContentWithIcon = style({ marginLeft: 8 });\n\n// вложенные правила — после баз всех классов файла\nresetButtonFocusInner(root);\nglobalStyle(`button${root}`, { minWidth: '100%' });\nglobalStyle(`${root}:nth-last-of-type(n + 2)`, { marginBottom: t.menuItemGap });\n\nexport const styles = {\n  root,\n  rootSmall,\n  rootMedium,\n  rootLarge,\n  rootMobile,\n  rootMobileLarge,\n  rootMobileMedium,\n  rootMobileSmall,\n  hover,\n  selected,\n  disabled,\n  nonSelectable,\n  loose,\n  withIconSmall,\n  withIconMedium,\n  withIconLarge,\n  comment,\n  commentHover,\n  commentDisabled,\n  icon,\n  iconSmall,\n  iconMedium,\n  iconLarge,\n  mobileContentWithIcon,\n};\n"]}

package/components/MenuItem/MenuItem.d.ts

@@ -65,9 +65,6 @@ export declare class MenuItem extends React.Component<MenuItemProps> {
     };
     private size;
     private globalObject;
-    private emotion;
-    private cx;
-    private styles;
     private theme;
     private mouseEntered;
     getRootNode: TGetRootNode;

package/components/MenuItem/MenuItem.js

@@ -45,6 +45,7 @@ import React from 'react';
 import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
 import { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes.js';
 import { MenuContext } from '../../internal/Menu/MenuContext.js';
+import { cx } from '../../lib/cx.js';
 import { scrollYCenterIntoNearestScrollable } from '../../lib/dom/scrollYCenterIntoNearestScrollable.js';
 import { isBrowser } from '../../lib/globalObject.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
@@ -53,7 +54,7 @@ import { withSize } from '../../lib/size/SizeDecorator.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
 import { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';
 import { isExternalLink, isFunction, isNonNullable, isReactUIComponent } from '../../lib/utils.js';
-import { getStyles } from './MenuItem.styles.js';
+import { styles } from './MenuItem.css.js';
 export var MenuItemDataTids = {
     root: 'MenuItem__root',
     content: 'MenuItem__content',
@@ -102,21 +103,21 @@ var MenuItem = /** @class */ (function (_super) {
             var _e = _this.props, comment = _e.comment, icon = _e.icon, loose = _e.loose, state = _e.state, sizeProp = _e.size, _enableIconPadding = _e._enableIconPadding, component = _e.component, onMouseEnter = _e.onMouseEnter, onMouseLeave = _e.onMouseLeave, isMobile = _e.isMobile, href = _e.href, disabled = _e.disabled, scrollIntoView = _e.scrollIntoView, _f = _e.rel, rel = _f === void 0 ? href && isExternalLink(href, _this.globalObject) ? 'noopener noreferrer' : _this.props.rel : _f, isNotSelectable = _e.isNotSelectable, children = _e.children, unusedClasses = _e.className, style = _e.style, dataTid = _e["data-tid"], rest = __rest(_e, ["comment", "icon", "loose", "state", "size", "_enableIconPadding", "component", "onMouseEnter", "onMouseLeave", "isMobile", "href", "disabled", "scrollIntoView", "rel", "isNotSelectable", "children", "className", "style", 'data-tid']);
             var iconElement = null;
             if (icon) {
-                iconElement = (React.createElement("div", { style: { top: _this.state.iconOffsetTop }, className: _this.cx((_a = {},
-                        _a[_this.styles.icon()] = true,
+                iconElement = (React.createElement("div", { style: { top: _this.state.iconOffsetTop }, className: cx((_a = {},
+                        _a[styles.icon] = true,
                         _a[_this.getIconSizeClassName()] = true,
                         _a)) }, icon));
             }
-            var className = _this.cx((_b = {},
-                _b[_this.styles.root(_this.theme)] = true,
+            var className = cx((_b = {},
+                _b[styles.root] = true,
                 _b[_this.getRootSizeClassName()] = true,
                 _b[_this.getRootMobileSizeClassName()] = isMobile,
-                _b[_this.styles.loose()] = !!loose,
-                _b[_this.styles.hover(_this.theme)] = _this.isHover,
-                _b[_this.styles.selected(_this.theme)] = _this.isSelected,
+                _b[styles.loose] = !!loose,
+                _b[styles.hover] = _this.isHover,
+                _b[styles.selected] = _this.isSelected,
                 _b[_this.getWithIconSizeClassName()] = Boolean(iconElement) || !!_enableIconPadding || _this.context.enableIconPadding,
-                _b[_this.styles.nonSelectable()] = !!isNotSelectable,
-                _b[_this.styles.disabled(_this.theme)] = !!disabled,
+                _b[styles.nonSelectable] = !!isNotSelectable,
+                _b[styles.disabled] = !!disabled,
                 _b));
             var content = children;
             if (isFunction(children)) {
@@ -129,13 +130,13 @@ var MenuItem = /** @class */ (function (_super) {
             }), _this.props),
                 React.createElement(Component, __assign({ ref: _this.setRootRef, "data-tid": MenuItemDataTids.root }, rest, { disabled: disabled, state: _this.activeState, onMouseOver: _this.handleMouseEnterFix, onMouseLeave: _this.handleMouseLeave, onClick: _this.handleClick, className: className, href: href, rel: href ? rel : undefined, tabIndex: -1 }),
                     iconElement,
-                    React.createElement("span", { className: _this.cx((_c = {},
-                            _c[_this.styles.mobileContentWithIcon()] = isMobile && isNonNullable(icon),
+                    React.createElement("span", { className: cx((_c = {},
+                            _c[styles.mobileContentWithIcon] = isMobile && isNonNullable(icon),
                             _c)), ref: _this.contentRef, "data-tid": MenuItemDataTids.content }, typeof content === 'function' ? content() : content),
-                    comment && (React.createElement("div", { "data-tid": MenuItemDataTids.comment, className: _this.cx((_d = {},
-                            _d[_this.styles.comment(_this.theme)] = true,
-                            _d[_this.styles.commentHover(_this.theme)] = _this.isHover,
-                            _d[_this.styles.commentDisabled(_this.theme)] = !!disabled,
+                    comment && (React.createElement("div", { "data-tid": MenuItemDataTids.comment, className: cx((_d = {},
+                            _d[styles.comment] = true,
+                            _d[styles.commentHover] = _this.isHover,
+                            _d[styles.commentDisabled] = !!disabled,
                             _d)) }, comment)))));
         };
         // https://github.com/facebook/react/issues/10109
@@ -193,7 +194,6 @@ var MenuItem = /** @class */ (function (_super) {
     }
     MenuItem.prototype.render = function () {
         var _this = this;
-        this.styles = getStyles(this.emotion);
         return (React.createElement(ThemeContext.Consumer, null, function (theme) {
             _this.theme = theme;
             return _this.renderMain();
@@ -242,49 +242,49 @@ var MenuItem = /** @class */ (function (_super) {
     MenuItem.prototype.getRootMobileSizeClassName = function () {
         var themeGTE6_1 = isThemeGTE(this.theme, '6.1');
         if (!themeGTE6_1) {
-            return this.styles.rootMobile(this.theme);
+            return styles.rootMobile;
         }
         switch (this.props.size) {
             case 'large':
-                return this.styles.rootMobileLarge(this.theme);
+                return styles.rootMobileLarge;
             case 'medium':
-                return this.styles.rootMobileMedium(this.theme);
+                return styles.rootMobileMedium;
             case 'small':
             default:
-                return this.styles.rootMobileSmall(this.theme);
+                return styles.rootMobileSmall;
         }
     };
     MenuItem.prototype.getRootSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.rootLarge(this.theme);
+                return styles.rootLarge;
             case 'medium':
-                return this.styles.rootMedium(this.theme);
+                return styles.rootMedium;
             case 'small':
             default:
-                return this.styles.rootSmall(this.theme);
+                return styles.rootSmall;
         }
     };
     MenuItem.prototype.getIconSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.iconLarge(this.theme);
+                return styles.iconLarge;
             case 'medium':
-                return this.styles.iconMedium(this.theme);
+                return styles.iconMedium;
             case 'small':
             default:
-                return this.styles.iconSmall(this.theme);
+                return styles.iconSmall;
         }
     };
     MenuItem.prototype.getWithIconSizeClassName = function () {
         switch (this.size) {
             case 'large':
-                return this.styles.withIconLarge(this.theme);
+                return styles.withIconLarge;
             case 'medium':
-                return this.styles.withIconMedium(this.theme);
+                return styles.withIconMedium;
             case 'small':
             default:
-                return this.styles.withIconSmall(this.theme);
+                return styles.withIconSmall;
         }
     };
     Object.defineProperty(MenuItem.prototype, "activeState", {