@skbkontur/react-ui 0.0.0-044e274f2c → 0.0.0-07d08325b0

package/components/MenuItem/MenuItem.d.ts

@@ -5,81 +5,50 @@ import { SizeProp } from '../../lib/types/props';
 import { MenuContextType } from '../../internal/Menu/MenuContext';
 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
-     */
+    /** Добавляет отступ иконке.
+     * @ignore */
     _enableIconPadding?: boolean;
-    /**
-     * Добавляет описание для элемента меню.
-     */
+    /** Добавляет описание для элемента меню. */
     comment?: React.ReactNode;
-    /**
-     * Отключенное состояние.
-     */
+    /** Делает компонент недоступным. */
     disabled?: boolean;
-    /**
-     * Добавляет элементу меню иконку.
-     */
+    /** Добавляет иконку элементу меню. */
     icon?: React.ReactElement<any>;
     /**
      * Меняет цвет текста на синий.
+     * @deprecated
      */
     link?: boolean;
-    /**
-     * Размер
-     */
+    /** Задает размер контрола. */
     size?: SizeProp;
-    /**
-     * @ignore
-     */
+    /** @ignore */
     loose?: boolean;
-    /**
-     * @ignore
-     */
+    /** @ignore */
     state?: MenuItemState;
-    /**
-     * HTML-событие `onclick`.
-     */
+    /** Задает функцию, которая вызывается при клике. */
     onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
-    /**
-     * HTML-событие `mouseenter`.
-     */
+    /** Задает функцию, которая вызывается при наведении мышкой (событие `onmouseenter`). */
     onMouseEnter?: React.MouseEventHandler;
-    /**
-     * HTML-событие `mouseleave`.
-     */
+    /** Задает функцию, которая вызывается при уходе мышки с объекта (событие `onmouseleave`). */
     onMouseLeave?: React.MouseEventHandler;
+    /** @ignore */
     children?: React.ReactNode | ((state: MenuItemState) => React.ReactNode);
-    /**
-     * HTML-атрибут `target`.
-     */
+    /** Задает HTML-атрибут `target`. */
     target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
-    /**
-     * HTML-атрибут `title`.
-     */
+    /** Задает HTML-атрибут `title`. */
     title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];
-    /**
-     * HTML-атрибут `href`.
-     */
+    /** Задает HTML-атрибут `href` - адрес, на который следует перейти. */
     href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];
-    /**
-     * HTML-атрибут `rel`.
-     *
-     * Для внешних ссылок аттрибут rel по умолчанию равен "noopener noreferrer"
-     */
+    /** Задает HTML-атрибут `rel`. Для внешних ссылок аттрибут rel по умолчанию равен "noopener noreferrer". */
     rel?: React.AnchorHTMLAttributes<HTMLAnchorElement>['rel'];
-    /**
-     * Заменяет корневой элемент, на компонент переданный в проп.
-     *
-     * По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.
-     */
+    /** Заменяет корневой элемент, на компонент переданный в проп.
+     * По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`. */
     component?: React.ComponentType<any>;
-    /**
-     * Запрещает выделение и выбор данного пункта меню
-     *
-     */
+    /** Запрещает выделение и выбор данного пункта меню. */
     isNotSelectable?: boolean;
+    /** Устанавливает стиль для отображения в мобильной версии. */
     isMobile?: boolean;
+    /** @ignore */
     scrollIntoView?: boolean;
 }
 export declare const MenuItemDataTids: {
@@ -88,10 +57,9 @@ export declare const MenuItemDataTids: {
     readonly comment: "MenuItem__comment";
 };
 /**
- *
  * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.
  *
- * Сущности в которых может быть использован `MenuItem`: [DropdownMenu](#/Components/DropdownMenu), [Kebab](#/Components/Kebab), [TooltipMenu](#/Components/TooltipMenu) и [Select](#/Components/Select).
+ * Сущности в которых может быть использован `MenuItem`: DropdownMenu, Kebab, TooltipMenu и Select.
  */
 export declare class MenuItem extends React.Component<MenuItemProps> {
     static __KONTUR_REACT_UI__: string;
@@ -113,8 +81,6 @@ export declare class MenuItem extends React.Component<MenuItemProps> {
         highlighted: boolean;
     };
     private theme;
-    private emotion;
-    private styles;
     private mouseEntered;
     private setRootNode;
     private rootRef;

package/components/MenuItem/MenuItem.md

@@ -1,4 +1,4 @@
-Меню с базовыми элементами меню.
+### Меню с базовыми элементами меню
 
 ```jsx harmony
 import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
@@ -12,7 +12,7 @@ import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
 </DropdownMenu>
 ```
 
-Меню с заблокированными и базовыми элементами меню.
+### Disabled
 
 ```jsx harmony
 import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
@@ -28,6 +28,7 @@ import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
 </DropdownMenu>
 ```
 
+### Запрет выделения
 В пункты меню можно передать проп `isNotSelectable`, чтобы запретить выделение и выбор этого пункта меню
 
 ```jsx harmony
@@ -44,7 +45,7 @@ import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
 </DropdownMenu>
 ```
 
-Меню с элементами меню содержащими описание.
+### Описание элементов
 
 ```jsx harmony
 import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
@@ -60,7 +61,7 @@ import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
 </DropdownMenu>
 ```
 
-Меню с элементами меню содержащими иконки.
+### Иконки в элементах
 
 ```jsx harmony
 import { Button, MenuItem, DropdownMenu } from '@skbkontur/react-ui';
@@ -88,41 +89,44 @@ import ThumbDownIcon from '@skbkontur/react-icons/ThumbDown';
 </DropdownMenu>
 ```
 
-Меню с элементами меню обёрнутыми в контрол ссылки.
+### Проп href
+
+В элементы меню можно передавать проп `href`, чтобы превратить их в ссылку. Лучше выделять такие элементы иконками.
 
 ```jsx harmony
-import { Button, MenuItem, DropdownMenu, Link } from '@skbkontur/react-ui';
-
-const LinkMenuItem = ({link, title}) => {
-  return <MenuItem
-    href={link}
-    component={({ href, ...rest }) => {
-      return <Link target="_blank" rel="noopener noreferrer" href={href} {...rest} />
-    }}
-    >
-    {title}
-  </MenuItem>
-}
+import { Button, MenuItem, DropdownMenu, MenuSeparator } from '@skbkontur/react-ui';
+import { ArrowUiCornerOutUpRightIcon } from '@skbkontur/icons/icons/ArrowUiCornerOutUpRightIcon';
 
 <DropdownMenu
   caption={<Button use="primary">Открыть меню с ссылками</Button>}
   >
-  <LinkMenuItem
-    link="http://tech.skbkontur.ru/react-ui/"
-    title="Начало документации"
-    />
-  <LinkMenuItem
-    link="https://guides.kontur.ru/"
-    title="Контур Гайды"
-    />
-  <LinkMenuItem
-    link="https://github.com/skbkontur/retail-ui/graphs/contributors"
-    title="Список прекрасных людей"
-    />
+  <MenuItem
+    href="http://tech.skbkontur.ru/react-ui/"
+    target="_blank"
+    rel="noopener noreferrer"
+  >
+    Начало документации
+  </MenuItem>
+  <MenuItem
+    href="https://github.com/skbkontur/retail-ui/graphs/contributors"
+    target="_blank"
+    rel="noopener noreferrer"
+  >
+    Список прекрасных людей
+  </MenuItem>
+  <MenuSeparator />
+  <MenuItem
+    icon={< ArrowUiCornerOutUpRightIcon />}
+    href="https://guides.kontur.ru/"
+    target="_blank"
+    rel="noopener noreferrer"
+  >
+    Подробнее в Контур Гайдах
+  </MenuItem>
 </DropdownMenu>
 ```
 
-У MenuItem есть 3 стандартных размера.
+### Размер
 
 ```jsx harmony
 import { Gapped } from '@skbkontur/react-ui';

package/components/MenuItem/MenuItem.mixins/MenuItem.mixins.js

@@ -1,24 +1,19 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3;
+import { css } from "../../../lib/theming/Emotion";
 import { getMenuItemPaddings } from "../MenuItem.styles";
-export var menuItemSizeMixin = function menuItemSizeMixin(emotion) {
-  return function (menuItemPaddingX, menuItemPaddingY, menuItemLineHeight, menuItemFontSize) {
-    var _getMenuItemPaddings = getMenuItemPaddings({
-        menuItemPaddingX: menuItemPaddingX,
-        menuItemPaddingY: menuItemPaddingY
-      }),
-      paddingX = _getMenuItemPaddings.paddingX,
-      paddingY = _getMenuItemPaddings.paddingY;
-    return emotion.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      line-height: ", ";\n      font-size: ", ";\n      padding: ", " ", " ", " ", ";\n    "])), menuItemLineHeight, menuItemFontSize, menuItemPaddingY, paddingX, paddingY, menuItemPaddingX);
-  };
+export var menuItemSizeMixin = function menuItemSizeMixin(menuItemPaddingX, menuItemPaddingY, menuItemLineHeight, menuItemFontSize) {
+  var _getMenuItemPaddings = getMenuItemPaddings({
+      menuItemPaddingX: menuItemPaddingX,
+      menuItemPaddingY: menuItemPaddingY
+    }),
+    paddingX = _getMenuItemPaddings.paddingX,
+    paddingY = _getMenuItemPaddings.paddingY;
+  return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    line-height: ", ";\n    font-size: ", ";\n    padding: ", " ", " ", " ", ";\n  "])), menuItemLineHeight, menuItemFontSize, menuItemPaddingY, paddingX, paddingY, menuItemPaddingX);
 };
-export var iconSizeMixin = function iconSizeMixin(emotion) {
-  return function (menuItemIconWidth, menuItemPaddingX) {
-    return emotion.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      width: ", ";\n      left: ", "px;\n    "])), menuItemIconWidth, parseInt(menuItemPaddingX));
-  };
+export var iconSizeMixin = function iconSizeMixin(menuItemIconWidth, menuItemPaddingX) {
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    width: ", ";\n    left: ", "px;\n  "])), menuItemIconWidth, parseInt(menuItemPaddingX));
 };
-export var withIconSizeMixin = function withIconSizeMixin(emotion) {
-  return function (menuItemPaddingForIcon) {
-    return emotion.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    padding-left: ", ";\n  "])), menuItemPaddingForIcon);
-  };
+export var withIconSizeMixin = function withIconSizeMixin(menuItemPaddingForIcon) {
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n    padding-left: ", ";\n  "])), menuItemPaddingForIcon);
 };

package/components/MenuItem/MenuItem.mixins/MenuItem.mixins.js.map

@@ -1 +1 @@
-{"version":3,"names":["getMenuItemPaddings","menuItemSizeMixin","emotion","menuItemPaddingX","menuItemPaddingY","menuItemLineHeight","menuItemFontSize","_getMenuItemPaddings","paddingX","paddingY","css","_templateObject","_taggedTemplateLiteralLoose","iconSizeMixin","menuItemIconWidth","_templateObject2","parseInt","withIconSizeMixin","menuItemPaddingForIcon","_templateObject3"],"sources":["MenuItem.mixins.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { getMenuItemPaddings } from './MenuItem.styles';\n\nexport const menuItemSizeMixin =\n  (emotion: Emotion) =>\n  (menuItemPaddingX: string, menuItemPaddingY: string, menuItemLineHeight: string, menuItemFontSize: string) => {\n    const { paddingX, paddingY } = getMenuItemPaddings({\n      menuItemPaddingX,\n      menuItemPaddingY,\n    });\n\n    return emotion.css`\n      line-height: ${menuItemLineHeight};\n      font-size: ${menuItemFontSize};\n      padding: ${menuItemPaddingY} ${paddingX} ${paddingY} ${menuItemPaddingX};\n    `;\n  };\n\nexport const iconSizeMixin = (emotion: Emotion) => (menuItemIconWidth: string, menuItemPaddingX: string) => {\n  return emotion.css`\n      width: ${menuItemIconWidth};\n      left: ${parseInt(menuItemPaddingX)}px;\n    `;\n};\n\nexport const withIconSizeMixin = (emotion: Emotion) => (menuItemPaddingForIcon: string) => {\n  return emotion.css`\n    padding-left: ${menuItemPaddingForIcon};\n  `;\n};\n"],"mappings":";;AAEA,SAASA,mBAAmB,QAAQ,mBAAmB;;AAEvD,OAAO,IAAMC,iBAAiB;AAC5B,SADWA,iBAAiBA,CAC3BC,OAAgB;IACjB,UAACC,gBAAwB,EAAEC,gBAAwB,EAAEC,kBAA0B,EAAEC,gBAAwB,EAAK;MAC5G,IAAAC,oBAAA,GAA+BP,mBAAmB,CAAC;UACjDG,gBAAgB,EAAhBA,gBAAgB;UAChBC,gBAAgB,EAAhBA;QACF,CAAC,CAAC,CAHMI,QAAQ,GAAAD,oBAAA,CAARC,QAAQ,CAAEC,QAAQ,GAAAF,oBAAA,CAARE,QAAQ;;MAK1B,OAAOP,OAAO,CAACQ,GAAG,CAAAC,eAAA,KAAAA,eAAA,GAAAC,2BAAA;MACDP,kBAAkB;MACpBC,gBAAgB;MAClBF,gBAAgB,EAAII,QAAQ,EAAIC,QAAQ,EAAIN,gBAAgB;;IAE3E,CAAC;;AAEH,OAAO,IAAMU,aAAa,GAAG,SAAhBA,aAAaA,CAAIX,OAAgB,UAAK,UAACY,iBAAyB,EAAEX,gBAAwB,EAAK;IAC1G,OAAOD,OAAO,CAACQ,GAAG,CAAAK,gBAAA,KAAAA,gBAAA,GAAAH,2BAAA;IACLE,iBAAiB;IAClBE,QAAQ,CAACb,gBAAgB,CAAC;;EAExC,CAAC;;AAED,OAAO,IAAMc,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIf,OAAgB,UAAK,UAACgB,sBAA8B,EAAK;IACzF,OAAOhB,OAAO,CAACQ,GAAG,CAAAS,gBAAA,KAAAA,gBAAA,GAAAP,2BAAA;IACAM,sBAAsB;;EAE1C,CAAC","ignoreList":[]}
+{"version":3,"names":["css","getMenuItemPaddings","menuItemSizeMixin","menuItemPaddingX","menuItemPaddingY","menuItemLineHeight","menuItemFontSize","_getMenuItemPaddings","paddingX","paddingY","_templateObject","_taggedTemplateLiteralLoose","iconSizeMixin","menuItemIconWidth","_templateObject2","parseInt","withIconSizeMixin","menuItemPaddingForIcon","_templateObject3"],"sources":["MenuItem.mixins.ts"],"sourcesContent":["import { css } from '../../lib/theming/Emotion';\n\nimport { getMenuItemPaddings } from './MenuItem.styles';\n\nexport const menuItemSizeMixin = (\n  menuItemPaddingX: string,\n  menuItemPaddingY: string,\n  menuItemLineHeight: string,\n  menuItemFontSize: string,\n) => {\n  const { paddingX, paddingY } = getMenuItemPaddings({\n    menuItemPaddingX,\n    menuItemPaddingY,\n  });\n\n  return css`\n    line-height: ${menuItemLineHeight};\n    font-size: ${menuItemFontSize};\n    padding: ${menuItemPaddingY} ${paddingX} ${paddingY} ${menuItemPaddingX};\n  `;\n};\n\nexport const iconSizeMixin = (menuItemIconWidth: string, menuItemPaddingX: string) => {\n  return css`\n    width: ${menuItemIconWidth};\n    left: ${parseInt(menuItemPaddingX)}px;\n  `;\n};\n\nexport const withIconSizeMixin = (menuItemPaddingForIcon: string) => {\n  return css`\n    padding-left: ${menuItemPaddingForIcon};\n  `;\n};\n"],"mappings":"wJAAA,SAASA,GAAG,QAAQ,2BAA2B;;AAE/C,SAASC,mBAAmB,QAAQ,mBAAmB;;AAEvD,OAAO,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiBA;AAC5BC,gBAAwB;AACxBC,gBAAwB;AACxBC,kBAA0B;AAC1BC,gBAAwB;AACrB;EACH,IAAAC,oBAAA,GAA+BN,mBAAmB,CAAC;MACjDE,gBAAgB,EAAhBA,gBAAgB;MAChBC,gBAAgB,EAAhBA;IACF,CAAC,CAAC,CAHMI,QAAQ,GAAAD,oBAAA,CAARC,QAAQ,CAAEC,QAAQ,GAAAF,oBAAA,CAARE,QAAQ;;EAK1B,OAAOT,GAAG,CAAAU,eAAA,KAAAA,eAAA,GAAAC,2BAAA;EACON,kBAAkB;EACpBC,gBAAgB;EAClBF,gBAAgB,EAAII,QAAQ,EAAIC,QAAQ,EAAIN,gBAAgB;;AAE3E,CAAC;;AAED,OAAO,IAAMS,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,iBAAyB,EAAEV,gBAAwB,EAAK;EACpF,OAAOH,GAAG,CAAAc,gBAAA,KAAAA,gBAAA,GAAAH,2BAAA;EACCE,iBAAiB;EAClBE,QAAQ,CAACZ,gBAAgB,CAAC;;AAEtC,CAAC;;AAED,OAAO,IAAMa,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,sBAA8B,EAAK;EACnE,OAAOjB,GAAG,CAAAkB,gBAAA,KAAAA,gBAAA,GAAAP,2BAAA;EACQM,sBAAsB;;AAE1C,CAAC","ignoreList":[]}

package/components/MenuItem/MenuItem.mixins.d.ts

@@ -1,4 +1,3 @@
-import type { Emotion } from '@emotion/css/create-instance';
-export declare const menuItemSizeMixin: (emotion: Emotion) => (menuItemPaddingX: string, menuItemPaddingY: string, menuItemLineHeight: string, menuItemFontSize: string) => string;
-export declare const iconSizeMixin: (emotion: Emotion) => (menuItemIconWidth: string, menuItemPaddingX: string) => string;
-export declare const withIconSizeMixin: (emotion: Emotion) => (menuItemPaddingForIcon: string) => string;
+export declare const menuItemSizeMixin: (menuItemPaddingX: string, menuItemPaddingY: string, menuItemLineHeight: string, menuItemFontSize: string) => string;
+export declare const iconSizeMixin: (menuItemIconWidth: string, menuItemPaddingX: string) => string;
+export declare const withIconSizeMixin: (menuItemPaddingForIcon: string) => string;

package/components/MenuItem/MenuItem.styles/MenuItem.styles.js

@@ -1,6 +1,6 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20;
-import { memoizeStyle } from "../../../lib/theming/Emotion";
+import { css, memoizeStyle } from "../../../lib/theming/Emotion";
 import { resetButton } from "../../../lib/styles/Mixins";
 import { iconSizeMixin, menuItemSizeMixin, withIconSizeMixin } from "../MenuItem.mixins";
 export var getMenuItemPaddings = function getMenuItemPaddings(_ref) {
@@ -13,68 +13,66 @@ export var getMenuItemPaddings = function getMenuItemPaddings(_ref) {
     paddingY: paddingY
   };
 };
-export var getStyles = function getStyles(emotion) {
-  return memoizeStyle({
-    root: function root(t) {
-      return emotion.css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n        ", ";\n\n        cursor: pointer;\n        display: ", ";\n        position: relative;\n        text-decoration: none;\n        color: ", ";\n        border-radius: ", ";\n\n        button& {\n          min-width: 100%;\n        }\n\n        &:nth-last-of-type(n + 2) {\n          margin-bottom: ", ";\n        }\n      "])), resetButton(emotion), t.menuItemDisplay, t.menuItemTextColor, t.menuItemBorderRadius, t.menuItemGap);
-    },
-    rootSmall: function rootSmall(t) {
-      return emotion.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n        ", ";\n      "])), menuItemSizeMixin(emotion)(t.menuItemPaddingXSmall, t.menuItemPaddingYSmall, t.menuItemLineHeightSmall, t.menuItemFontSizeSmall));
-    },
-    rootMedium: function rootMedium(t) {
-      return emotion.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n        ", ";\n      "])), menuItemSizeMixin(emotion)(t.menuItemPaddingXMedium, t.menuItemPaddingYMedium, t.menuItemLineHeightMedium, t.menuItemFontSizeMedium));
-    },
-    rootLarge: function rootLarge(t) {
-      return emotion.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        ", ";\n      "])), menuItemSizeMixin(emotion)(t.menuItemPaddingXLarge, t.menuItemPaddingYLarge, t.menuItemLineHeightLarge, t.menuItemFontSizeLarge));
-    },
-    rootMobile: function rootMobile(t) {
-      return emotion.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n        font-size: ", ";\n        line-height: ", ";\n        padding: ", ";\n      "])), t.menuItemFontSizeMobile, t.menuItemLineHeightMobile, t.menuItemPaddingMobile);
-    },
-    hover: function hover(t) {
-      // Color with !important in purpose to override `a:hover`
-      return emotion.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n        background: ", " !important;\n        color: ", " !important;\n      "])), t.menuItemHoverBg, t.menuItemHoverColor);
-    },
-    selected: function selected(t) {
-      return emotion.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n        background: ", " !important;\n      "])), t.menuItemSelectedBg);
-    },
-    disabled: function disabled(t) {
-      return emotion.css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n        background: ", ";\n        color: ", ";\n        cursor: default;\n      "])), t.menuItemDisabledBg, t.menuItemDisabledColor);
-    },
-    link: function link(t) {
-      return emotion.css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n      "])), t.menuItemLinkColor);
-    },
-    loose: function loose() {
-      return emotion.css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n        padding-left: 15px;\n      "])));
-    },
-    withIconSmall: function withIconSmall(t) {
-      return emotion.css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n        ", "\n      "])), withIconSizeMixin(emotion)(t.menuItemPaddingForIconSmall));
-    },
-    withIconMedium: function withIconMedium(t) {
-      return emotion.css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n        ", "\n      "])), withIconSizeMixin(emotion)(t.menuItemPaddingForIconMedium));
-    },
-    withIconLarge: function withIconLarge(t) {
-      return emotion.css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n        ", "\n      "])), withIconSizeMixin(emotion)(t.menuItemPaddingForIconLarge));
-    },
-    comment: function comment(t) {
-      return emotion.css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n        opacity: ", ";\n        white-space: normal;\n        padding-top: 4px;\n      "])), t.menuItemCommentColor, t.menuItemCommentOpacity);
-    },
-    commentHover: function commentHover(t) {
-      return emotion.css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n        opacity: 0.6;\n      "])), t.menuItemCommentColorHover);
-    },
-    icon: function icon() {
-      return emotion.css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\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      "])));
-    },
-    iconSmall: function iconSmall(t) {
-      return emotion.css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n        ", ";\n      "])), iconSizeMixin(emotion)(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall));
-    },
-    iconMedium: function iconMedium(t) {
-      return emotion.css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n        ", ";\n      "])), iconSizeMixin(emotion)(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium));
-    },
-    iconLarge: function iconLarge(t) {
-      return emotion.css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n        ", ";\n      "])), iconSizeMixin(emotion)(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge));
-    },
-    mobileContentWithIcon: function mobileContentWithIcon() {
-      return emotion.css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n        margin-left: 8px;\n      "])));
-    }
-  });
-};
+export var styles = memoizeStyle({
+  root: function root(t) {
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      cursor: pointer;\n      display: ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n      border-radius: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ", ";\n      }\n    "])), resetButton(), t.menuItemDisplay, t.menuItemTextColor, t.menuItemBorderRadius, t.menuItemGap);
+  },
+  rootSmall: function rootSmall(t) {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), menuItemSizeMixin(t.menuItemPaddingXSmall, t.menuItemPaddingYSmall, t.menuItemLineHeightSmall, t.menuItemFontSizeSmall));
+  },
+  rootMedium: function rootMedium(t) {
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), menuItemSizeMixin(t.menuItemPaddingXMedium, t.menuItemPaddingYMedium, t.menuItemLineHeightMedium, t.menuItemFontSizeMedium));
+  },
+  rootLarge: function rootLarge(t) {
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), menuItemSizeMixin(t.menuItemPaddingXLarge, t.menuItemPaddingYLarge, t.menuItemLineHeightLarge, t.menuItemFontSizeLarge));
+  },
+  rootMobile: function rootMobile(t) {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])), t.menuItemFontSizeMobile, t.menuItemLineHeightMobile, t.menuItemPaddingMobile);
+  },
+  hover: function hover(t) {
+    // Color with !important in purpose to override `a:hover`
+    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      background: ", " !important;\n      color: ", " !important;\n    "])), t.menuItemHoverBg, t.menuItemHoverColor);
+  },
+  selected: function selected(t) {
+    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      background: ", " !important;\n    "])), t.menuItemSelectedBg);
+  },
+  disabled: function disabled(t) {
+    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      background: ", ";\n      color: ", ";\n      cursor: default;\n    "])), t.menuItemDisabledBg, t.menuItemDisabledColor);
+  },
+  link: function link(t) {
+    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.menuItemLinkColor);
+  },
+  loose: function loose() {
+    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      padding-left: 15px;\n    "])));
+  },
+  withIconSmall: function withIconSmall(t) {
+    return css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconSmall));
+  },
+  withIconMedium: function withIconMedium(t) {
+    return css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconMedium));
+  },
+  withIconLarge: function withIconLarge(t) {
+    return css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), withIconSizeMixin(t.menuItemPaddingForIconLarge));
+  },
+  comment: function comment(t) {
+    return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      opacity: ", ";\n      white-space: normal;\n      padding-top: 4px;\n    "])), t.menuItemCommentColor, t.menuItemCommentOpacity);
+  },
+  commentHover: function commentHover(t) {
+    return css(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n      opacity: 0.6;\n    "])), t.menuItemCommentColorHover);
+  },
+  icon: function icon() {
+    return css(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\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    "])));
+  },
+  iconSmall: function iconSmall(t) {
+    return css(_templateObject17 || (_templateObject17 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), iconSizeMixin(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall));
+  },
+  iconMedium: function iconMedium(t) {
+    return css(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), iconSizeMixin(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium));
+  },
+  iconLarge: function iconLarge(t) {
+    return css(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n      ", ";\n    "])), iconSizeMixin(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge));
+  },
+  mobileContentWithIcon: function mobileContentWithIcon() {
+    return css(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n      margin-left: 8px;\n    "])));
+  }
+});

package/components/MenuItem/MenuItem.styles/MenuItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["memoizeStyle","resetButton","iconSizeMixin","menuItemSizeMixin","withIconSizeMixin","getMenuItemPaddings","_ref","menuItemPaddingX","menuItemPaddingY","paddingX","paddingY","getStyles","emotion","root","t","css","_templateObject","_taggedTemplateLiteralLoose","menuItemDisplay","menuItemTextColor","menuItemBorderRadius","menuItemGap","rootSmall","_templateObject2","menuItemPaddingXSmall","menuItemPaddingYSmall","menuItemLineHeightSmall","menuItemFontSizeSmall","rootMedium","_templateObject3","menuItemPaddingXMedium","menuItemPaddingYMedium","menuItemLineHeightMedium","menuItemFontSizeMedium","rootLarge","_templateObject4","menuItemPaddingXLarge","menuItemPaddingYLarge","menuItemLineHeightLarge","menuItemFontSizeLarge","rootMobile","_templateObject5","menuItemFontSizeMobile","menuItemLineHeightMobile","menuItemPaddingMobile","hover","_templateObject6","menuItemHoverBg","menuItemHoverColor","selected","_templateObject7","menuItemSelectedBg","disabled","_templateObject8","menuItemDisabledBg","menuItemDisabledColor","link","_templateObject9","menuItemLinkColor","loose","_templateObject10","withIconSmall","_templateObject11","menuItemPaddingForIconSmall","withIconMedium","_templateObject12","menuItemPaddingForIconMedium","withIconLarge","_templateObject13","menuItemPaddingForIconLarge","comment","_templateObject14","menuItemCommentColor","menuItemCommentOpacity","commentHover","_templateObject15","menuItemCommentColorHover","icon","_templateObject16","iconSmall","_templateObject17","menuItemIconWidthSmall","iconMedium","_templateObject18","menuItemIconWidthMedium","iconLarge","_templateObject19","menuItemIconWidthLarge","mobileContentWithIcon","_templateObject20"],"sources":["MenuItem.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { Theme } from '../../lib/theming/Theme';\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nimport { iconSizeMixin, menuItemSizeMixin, withIconSizeMixin } from './MenuItem.mixins';\n\nexport const getMenuItemPaddings = ({\n  menuItemPaddingX,\n  menuItemPaddingY,\n}: Record<'menuItemPaddingX' | 'menuItemPaddingY', string>) => {\n  const paddingX = menuItemPaddingX;\n  const paddingY = menuItemPaddingY;\n\n  return { paddingX, paddingY };\n};\n\nexport const getStyles = (emotion: Emotion) => {\n  return memoizeStyle({\n    root(t: Theme) {\n      return emotion.css`\n        ${resetButton(emotion)};\n\n        cursor: pointer;\n        display: ${t.menuItemDisplay};\n        position: relative;\n        text-decoration: none;\n        color: ${t.menuItemTextColor};\n        border-radius: ${t.menuItemBorderRadius};\n\n        button& {\n          min-width: 100%;\n        }\n\n        &:nth-last-of-type(n + 2) {\n          margin-bottom: ${t.menuItemGap};\n        }\n      `;\n    },\n\n    rootSmall(t: Theme) {\n      return emotion.css`\n        ${menuItemSizeMixin(emotion)(\n          t.menuItemPaddingXSmall,\n          t.menuItemPaddingYSmall,\n          t.menuItemLineHeightSmall,\n          t.menuItemFontSizeSmall,\n        )};\n      `;\n    },\n    rootMedium(t: Theme) {\n      return emotion.css`\n        ${menuItemSizeMixin(emotion)(\n          t.menuItemPaddingXMedium,\n          t.menuItemPaddingYMedium,\n          t.menuItemLineHeightMedium,\n          t.menuItemFontSizeMedium,\n        )};\n      `;\n    },\n    rootLarge(t: Theme) {\n      return emotion.css`\n        ${menuItemSizeMixin(emotion)(\n          t.menuItemPaddingXLarge,\n          t.menuItemPaddingYLarge,\n          t.menuItemLineHeightLarge,\n          t.menuItemFontSizeLarge,\n        )};\n      `;\n    },\n\n    rootMobile(t: Theme) {\n      return emotion.css`\n        font-size: ${t.menuItemFontSizeMobile};\n        line-height: ${t.menuItemLineHeightMobile};\n        padding: ${t.menuItemPaddingMobile};\n      `;\n    },\n\n    hover(t: Theme) {\n      // Color with !important in purpose to override `a:hover`\n      return emotion.css`\n        background: ${t.menuItemHoverBg} !important;\n        color: ${t.menuItemHoverColor} !important;\n      `;\n    },\n    selected(t: Theme) {\n      return emotion.css`\n        background: ${t.menuItemSelectedBg} !important;\n      `;\n    },\n    disabled(t: Theme) {\n      return emotion.css`\n        background: ${t.menuItemDisabledBg};\n        color: ${t.menuItemDisabledColor};\n        cursor: default;\n      `;\n    },\n    link(t: Theme) {\n      return emotion.css`\n        color: ${t.menuItemLinkColor};\n      `;\n    },\n    loose() {\n      return emotion.css`\n        padding-left: 15px;\n      `;\n    },\n    withIconSmall(t: Theme) {\n      return emotion.css`\n        ${withIconSizeMixin(emotion)(t.menuItemPaddingForIconSmall)}\n      `;\n    },\n    withIconMedium(t: Theme) {\n      return emotion.css`\n        ${withIconSizeMixin(emotion)(t.menuItemPaddingForIconMedium)}\n      `;\n    },\n    withIconLarge(t: Theme) {\n      return emotion.css`\n        ${withIconSizeMixin(emotion)(t.menuItemPaddingForIconLarge)}\n      `;\n    },\n    comment(t: Theme) {\n      return emotion.css`\n        color: ${t.menuItemCommentColor};\n        opacity: ${t.menuItemCommentOpacity};\n        white-space: normal;\n        padding-top: 4px;\n      `;\n    },\n    commentHover(t: Theme) {\n      return emotion.css`\n        color: ${t.menuItemCommentColorHover};\n        opacity: 0.6;\n      `;\n    },\n    icon() {\n      return emotion.css`\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      `;\n    },\n    iconSmall(t: Theme) {\n      return emotion.css`\n        ${iconSizeMixin(emotion)(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall)};\n      `;\n    },\n    iconMedium(t: Theme) {\n      return emotion.css`\n        ${iconSizeMixin(emotion)(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium)};\n      `;\n    },\n    iconLarge(t: Theme) {\n      return emotion.css`\n        ${iconSizeMixin(emotion)(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge)};\n      `;\n    },\n    mobileContentWithIcon() {\n      return emotion.css`\n        margin-left: 8px;\n      `;\n    },\n  });\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["css","memoizeStyle","resetButton","iconSizeMixin","menuItemSizeMixin","withIconSizeMixin","getMenuItemPaddings","_ref","menuItemPaddingX","menuItemPaddingY","paddingX","paddingY","styles","root","t","_templateObject","_taggedTemplateLiteralLoose","menuItemDisplay","menuItemTextColor","menuItemBorderRadius","menuItemGap","rootSmall","_templateObject2","menuItemPaddingXSmall","menuItemPaddingYSmall","menuItemLineHeightSmall","menuItemFontSizeSmall","rootMedium","_templateObject3","menuItemPaddingXMedium","menuItemPaddingYMedium","menuItemLineHeightMedium","menuItemFontSizeMedium","rootLarge","_templateObject4","menuItemPaddingXLarge","menuItemPaddingYLarge","menuItemLineHeightLarge","menuItemFontSizeLarge","rootMobile","_templateObject5","menuItemFontSizeMobile","menuItemLineHeightMobile","menuItemPaddingMobile","hover","_templateObject6","menuItemHoverBg","menuItemHoverColor","selected","_templateObject7","menuItemSelectedBg","disabled","_templateObject8","menuItemDisabledBg","menuItemDisabledColor","link","_templateObject9","menuItemLinkColor","loose","_templateObject10","withIconSmall","_templateObject11","menuItemPaddingForIconSmall","withIconMedium","_templateObject12","menuItemPaddingForIconMedium","withIconLarge","_templateObject13","menuItemPaddingForIconLarge","comment","_templateObject14","menuItemCommentColor","menuItemCommentOpacity","commentHover","_templateObject15","menuItemCommentColorHover","icon","_templateObject16","iconSmall","_templateObject17","menuItemIconWidthSmall","iconMedium","_templateObject18","menuItemIconWidthMedium","iconLarge","_templateObject19","menuItemIconWidthLarge","mobileContentWithIcon","_templateObject20"],"sources":["MenuItem.styles.ts"],"sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nimport { iconSizeMixin, menuItemSizeMixin, withIconSizeMixin } from './MenuItem.mixins';\n\nexport const getMenuItemPaddings = ({\n  menuItemPaddingX,\n  menuItemPaddingY,\n}: Record<'menuItemPaddingX' | 'menuItemPaddingY', string>) => {\n  const paddingX = menuItemPaddingX;\n  const paddingY = menuItemPaddingY;\n\n  return { paddingX, paddingY };\n};\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    return css`\n      ${resetButton()};\n\n      cursor: pointer;\n      display: ${t.menuItemDisplay};\n      position: relative;\n      text-decoration: none;\n      color: ${t.menuItemTextColor};\n      border-radius: ${t.menuItemBorderRadius};\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ${t.menuItemGap};\n      }\n    `;\n  },\n\n  rootSmall(t: Theme) {\n    return css`\n      ${menuItemSizeMixin(\n        t.menuItemPaddingXSmall,\n        t.menuItemPaddingYSmall,\n        t.menuItemLineHeightSmall,\n        t.menuItemFontSizeSmall,\n      )};\n    `;\n  },\n  rootMedium(t: Theme) {\n    return css`\n      ${menuItemSizeMixin(\n        t.menuItemPaddingXMedium,\n        t.menuItemPaddingYMedium,\n        t.menuItemLineHeightMedium,\n        t.menuItemFontSizeMedium,\n      )};\n    `;\n  },\n  rootLarge(t: Theme) {\n    return css`\n      ${menuItemSizeMixin(\n        t.menuItemPaddingXLarge,\n        t.menuItemPaddingYLarge,\n        t.menuItemLineHeightLarge,\n        t.menuItemFontSizeLarge,\n      )};\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.menuItemFontSizeMobile};\n      line-height: ${t.menuItemLineHeightMobile};\n      padding: ${t.menuItemPaddingMobile};\n    `;\n  },\n\n  hover(t: Theme) {\n    // Color with !important in purpose to override `a:hover`\n    return css`\n      background: ${t.menuItemHoverBg} !important;\n      color: ${t.menuItemHoverColor} !important;\n    `;\n  },\n  selected(t: Theme) {\n    return css`\n      background: ${t.menuItemSelectedBg} !important;\n    `;\n  },\n  disabled(t: Theme) {\n    return css`\n      background: ${t.menuItemDisabledBg};\n      color: ${t.menuItemDisabledColor};\n      cursor: default;\n    `;\n  },\n  link(t: Theme) {\n    return css`\n      color: ${t.menuItemLinkColor};\n    `;\n  },\n  loose() {\n    return css`\n      padding-left: 15px;\n    `;\n  },\n  withIconSmall(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconSmall)}\n    `;\n  },\n  withIconMedium(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconMedium)}\n    `;\n  },\n  withIconLarge(t: Theme) {\n    return css`\n      ${withIconSizeMixin(t.menuItemPaddingForIconLarge)}\n    `;\n  },\n  comment(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColor};\n      opacity: ${t.menuItemCommentOpacity};\n      white-space: normal;\n      padding-top: 4px;\n    `;\n  },\n  commentHover(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColorHover};\n      opacity: 0.6;\n    `;\n  },\n  icon() {\n    return css`\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    `;\n  },\n  iconSmall(t: Theme) {\n    return css`\n      ${iconSizeMixin(t.menuItemIconWidthSmall, t.menuItemPaddingXSmall)};\n    `;\n  },\n  iconMedium(t: Theme) {\n    return css`\n      ${iconSizeMixin(t.menuItemIconWidthMedium, t.menuItemPaddingXMedium)};\n    `;\n  },\n  iconLarge(t: Theme) {\n    return css`\n      ${iconSizeMixin(t.menuItemIconWidthLarge, t.menuItemPaddingXLarge)};\n    `;\n  },\n  mobileContentWithIcon() {\n    return css`\n      margin-left: 8px;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/components/MenuItem/MenuItem.styles.d.ts

@@ -1,10 +1,9 @@
-import type { Emotion } from '@emotion/css/create-instance';
 import { Theme } from '../../lib/theming/Theme';
 export declare const getMenuItemPaddings: ({ menuItemPaddingX, menuItemPaddingY, }: Record<'menuItemPaddingX' | 'menuItemPaddingY', string>) => {
     paddingX: string;
     paddingY: string;
 };
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     root(t: Theme): string;
     rootSmall(t: Theme): string;
     rootMedium(t: Theme): string;

package/components/MenuItem/__docs__/MenuItem.mdx

@@ -0,0 +1,24 @@
+import * as MenuItemStories from './MenuItem.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={MenuItemStories} />
+
+# MenuItem
+
+<Description />
+
+## Базовый пример
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+## Примеры использования
+
+<Stories title="" includePrimary={false} />

package/components/MenuSeparator/MenuSeparator/MenuSeparator.js

@@ -1,30 +1,29 @@
 import React, { useContext } from 'react';
+import { cx } from "../../../lib/theming/Emotion";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { ResponsiveLayout } from "../../ResponsiveLayout";
-import { EmotionContext } from "../../../lib/theming/Emotion";
-import { ThemeContext } from "../../../lib/theming/ThemeContext";
-import { getStyles } from "../MenuSeparator.styles";
+import { styles } from "../MenuSeparator.styles";
 export var MenuSeparatorDataTids = {
   root: 'MenuSeparator__root'
 };
+
 /**
- * Добавляет разделительную линию между элементами меню.
+ * `MenuSeparator` добавляет разделительную линию между элементами меню.
  *
- * Сущности в которых может быть использован `MenuSeparator`: [DropdownMenu](#/Components/DropdownMenu), [Kebab](#/Components/Kebab), [TooltipMenu](#/Components/TooltipMenu) и [Select](#/Components/Select).
+ * Сущности в которых может быть использован `MenuSeparator`: DropdownMenu, Kebab, TooltipMenu и Select.
  */
 function MenuSeparator(props) {
   var theme = useContext(ThemeContext);
-  var emotion = useContext(EmotionContext);
-  var styles = getStyles(emotion);
   return /*#__PURE__*/(
     React.createElement(CommonWrapper, props, /*#__PURE__*/
     React.createElement(ResponsiveLayout, null, function (_ref) {
-      var _emotion$cx;
+      var _cx;
       var isMobile = _ref.isMobile;
       return /*#__PURE__*/(
         React.createElement("div", {
           "data-tid": MenuSeparatorDataTids.root,
-          className: emotion.cx((_emotion$cx = {}, _emotion$cx[styles.root(theme)] = true, _emotion$cx[styles.rootMobile(theme)] = isMobile, _emotion$cx))
+          className: cx((_cx = {}, _cx[styles.root(theme)] = true, _cx[styles.rootMobile(theme)] = isMobile, _cx))
         })
       );
     }))

package/components/MenuSeparator/MenuSeparator/MenuSeparator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useContext","CommonWrapper","ResponsiveLayout","EmotionContext","ThemeContext","getStyles","MenuSeparatorDataTids","root","MenuSeparator","props","theme","emotion","styles","createElement","_ref","_emotion$cx","isMobile","className","cx","rootMobile","__KONTUR_REACT_UI__","displayName"],"sources":["MenuSeparator.tsx"],"sourcesContent":["import React, { useContext } from 'react';\n\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\nimport { EmotionContext } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { getStyles } from './MenuSeparator.styles';\n\nexport type MenuSeparatorProps = CommonProps;\n\nexport const MenuSeparatorDataTids = {\n  root: 'MenuSeparator__root',\n} as const;\n/**\n * Добавляет разделительную линию между элементами меню.\n *\n * Сущности в которых может быть использован `MenuSeparator`: [DropdownMenu](#/Components/DropdownMenu), [Kebab](#/Components/Kebab), [TooltipMenu](#/Components/TooltipMenu) и [Select](#/Components/Select).\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n  const theme = useContext(ThemeContext);\n  const emotion = useContext(EmotionContext);\n  const styles = getStyles(emotion);\n\n  return (\n    <CommonWrapper {...props}>\n      <ResponsiveLayout>\n        {({ isMobile }) => {\n          return (\n            <div\n              data-tid={MenuSeparatorDataTids.root}\n              className={emotion.cx({ [styles.root(theme)]: true, [styles.rootMobile(theme)]: isMobile })}\n            />\n          );\n        }}\n      </ResponsiveLayout>\n    </CommonWrapper>\n  );\n}\n\nMenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';\nMenuSeparator.displayName = 'MenuSeparator';\n\nexport { MenuSeparator };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;;AAEzC,SAAsBC,aAAa,QAAQ,8BAA8B;AACzE,SAASC,gBAAgB,QAAQ,qBAAqB;AACtD,SAASC,cAAc,QAAQ,2BAA2B;AAC1D,SAASC,YAAY,QAAQ,gCAAgC;;AAE7D,SAASC,SAAS,QAAQ,wBAAwB;;;;AAIlD,OAAO,IAAMC,qBAAqB,GAAG;EACnCC,IAAI,EAAE;AACR,CAAU;AACV;AACA;AACA;AACA;AACA;AACA,SAASC,aAAaA,CAACC,KAAyB,EAAE;EAChD,IAAMC,KAAK,GAAGV,UAAU,CAACI,YAAY,CAAC;EACtC,IAAMO,OAAO,GAAGX,UAAU,CAACG,cAAc,CAAC;EAC1C,IAAMS,MAAM,GAAGP,SAAS,CAACM,OAAO,CAAC;;EAEjC;IACEZ,KAAA,CAAAc,aAAA,CAACZ,aAAa,EAAKQ,KAAK;IACtBV,KAAA,CAAAc,aAAA,CAACX,gBAAgB;IACd,UAAAY,IAAA,EAAkB,KAAAC,WAAA,KAAfC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;MACV;QACEjB,KAAA,CAAAc,aAAA;UACE,YAAUP,qBAAqB,CAACC,IAAK;UACrCU,SAAS,EAAEN,OAAO,CAACO,EAAE,EAAAH,WAAA,OAAAA,WAAA,CAAIH,MAAM,CAACL,IAAI,CAACG,KAAK,CAAC,IAAG,IAAI,EAAAK,WAAA,CAAGH,MAAM,CAACO,UAAU,CAACT,KAAK,CAAC,IAAGM,QAAQ,EAAAD,WAAA,CAAE,CAAE;QAC7F,CAAC;;IAEN;IACgB;IACL,CAAC;;AAEpB;;AAEAP,aAAa,CAACY,mBAAmB,GAAG,eAAe;AACnDZ,aAAa,CAACa,WAAW,GAAG,eAAe;;AAE3C,SAASb,aAAa","ignoreList":[]}
+{"version":3,"names":["React","useContext","cx","ThemeContext","CommonWrapper","ResponsiveLayout","styles","MenuSeparatorDataTids","root","MenuSeparator","props","theme","createElement","_ref","_cx","isMobile","className","rootMobile","__KONTUR_REACT_UI__","displayName"],"sources":["MenuSeparator.tsx"],"sourcesContent":["import React, { useContext } from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\n\nimport { styles } from './MenuSeparator.styles';\n\nexport type MenuSeparatorProps = CommonProps;\n\nexport const MenuSeparatorDataTids = {\n  root: 'MenuSeparator__root',\n} as const;\n\n/**\n * `MenuSeparator` добавляет разделительную линию между элементами меню.\n *\n * Сущности в которых может быть использован `MenuSeparator`: DropdownMenu, Kebab, TooltipMenu и Select.\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n  const theme = useContext(ThemeContext);\n\n  return (\n    <CommonWrapper {...props}>\n      <ResponsiveLayout>\n        {({ isMobile }) => {\n          return (\n            <div\n              data-tid={MenuSeparatorDataTids.root}\n              className={cx({ [styles.root(theme)]: true, [styles.rootMobile(theme)]: isMobile })}\n            />\n          );\n        }}\n      </ResponsiveLayout>\n    </CommonWrapper>\n  );\n}\n\nMenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';\nMenuSeparator.displayName = 'MenuSeparator';\n\nexport { MenuSeparator };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;;AAEzC,SAASC,EAAE,QAAQ,2BAA2B;AAC9C,SAASC,YAAY,QAAQ,gCAAgC;AAC7D,SAAsBC,aAAa,QAAQ,8BAA8B;AACzE,SAASC,gBAAgB,QAAQ,qBAAqB;;AAEtD,SAASC,MAAM,QAAQ,wBAAwB;;;;AAI/C,OAAO,IAAMC,qBAAqB,GAAG;EACnCC,IAAI,EAAE;AACR,CAAU;;AAEV;AACA;AACA;AACA;AACA;AACA,SAASC,aAAaA,CAACC,KAAyB,EAAE;EAChD,IAAMC,KAAK,GAAGV,UAAU,CAACE,YAAY,CAAC;;EAEtC;IACEH,KAAA,CAAAY,aAAA,CAACR,aAAa,EAAKM,KAAK;IACtBV,KAAA,CAAAY,aAAA,CAACP,gBAAgB;IACd,UAAAQ,IAAA,EAAkB,KAAAC,GAAA,KAAfC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;MACV;QACEf,KAAA,CAAAY,aAAA;UACE,YAAUL,qBAAqB,CAACC,IAAK;UACrCQ,SAAS,EAAEd,EAAE,EAAAY,GAAA,OAAAA,GAAA,CAAIR,MAAM,CAACE,IAAI,CAACG,KAAK,CAAC,IAAG,IAAI,EAAAG,GAAA,CAAGR,MAAM,CAACW,UAAU,CAACN,KAAK,CAAC,IAAGI,QAAQ,EAAAD,GAAA,CAAE,CAAE;QACrF,CAAC;;IAEN;IACgB;IACL,CAAC;;AAEpB;;AAEAL,aAAa,CAACS,mBAAmB,GAAG,eAAe;AACnDT,aAAa,CAACU,WAAW,GAAG,eAAe;;AAE3C,SAASV,aAAa","ignoreList":[]}

package/components/MenuSeparator/MenuSeparator.d.ts

@@ -5,9 +5,9 @@ export declare const MenuSeparatorDataTids: {
     readonly root: "MenuSeparator__root";
 };
 /**
- * Добавляет разделительную линию между элементами меню.
+ * `MenuSeparator` добавляет разделительную линию между элементами меню.
  *
- * Сущности в которых может быть использован `MenuSeparator`: [DropdownMenu](#/Components/DropdownMenu), [Kebab](#/Components/Kebab), [TooltipMenu](#/Components/TooltipMenu) и [Select](#/Components/Select).
+ * Сущности в которых может быть использован `MenuSeparator`: DropdownMenu, Kebab, TooltipMenu и Select.
  */
 declare function MenuSeparator(props: MenuSeparatorProps): React.JSX.Element;
 declare namespace MenuSeparator {