@skbkontur/react-ui 0.0.0-1b188ff0e7 → 0.0.0-1da9bba033

package/components/Input/InputLayout/InputLayoutAsideIcon/InputLayoutAsideIcon.js

@@ -6,7 +6,8 @@ import { ThemeContext } from "../../../../lib/theming/ThemeContext";
 import { InputLayoutContext } from "../InputLayoutContext";
 import { stylesLayout } from "../InputLayout.styles";
 export var InputLayoutAsideIcon = function InputLayoutAsideIcon(_ref) {
-  var icon = _ref.icon,
+  var _ref$icon = _ref.icon,
+      icon = _ref$icon === void 0 ? null : _ref$icon,
       side = _ref.side;
   var theme = React.useContext(ThemeContext);
 
@@ -25,14 +26,15 @@ export var InputLayoutAsideIcon = function InputLayoutAsideIcon(_ref) {
     medium: parseInt(theme.inputIconGapMedium),
     large: parseInt(theme.inputIconGapLarge)
   };
-  var _icon = null;
 
-  if (icon && isElement(icon)) {
+  var _icon = icon instanceof Function ? icon() : icon;
+
+  if (isElement(icon) && isKonturIcon(icon)) {
     var _icon$props$size;
 
-    _icon = isKonturIcon(icon) ? /*#__PURE__*/React.cloneElement(icon, {
+    _icon = /*#__PURE__*/React.cloneElement(icon, {
       size: (_icon$props$size = icon.props.size) != null ? _icon$props$size : sizes[size]
-    }) : icon;
+    });
   }
 
   var style = {};

package/components/Input/InputLayout/InputLayoutAsideIcon/InputLayoutAsideIcon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["InputLayoutAsideIcon.tsx"],"names":["React","isElement","isKonturIcon","cx","ThemeContext","InputLayoutContext","stylesLayout","InputLayoutAsideIcon","icon","side","theme","useContext","focused","disabled","size","sizes","small","parseInt","inputIconSizeSmall","medium","inputIconSizeMedium","large","inputIconSizeLarge","gaps","inputIconGapSmall","inputIconGapMedium","inputIconGapLarge","_icon","cloneElement","props","style","marginLeft","marginRight","aside","iconFocus","iconDisabled"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,UAA1B;;AAEA,SAASC,YAAT,QAA6B,oBAA7B;;AAEA,SAASC,EAAT,QAAmB,8BAAnB;AACA,SAASC,YAAT,QAA6B,mCAA7B;;AAEA,SAASC,kBAAT,QAAmC,sBAAnC;AACA,SAASC,YAAT,QAA6B,sBAA7B;;;;;;AAMA,OAAO,IAAMC,oBAAwE,GAAG,SAA3EA,oBAA2E,OAAoB,KAAjBC,IAAiB,QAAjBA,IAAiB,CAAXC,IAAW,QAAXA,IAAW;AAC1G,MAAMC,KAAK,GAAGV,KAAK,CAACW,UAAN,CAAiBP,YAAjB,CAAd;AACA,0BAAoCJ,KAAK,CAACW,UAAN,CAAiBN,kBAAjB,CAApC,CAAQO,OAAR,qBAAQA,OAAR,CAAiBC,QAAjB,qBAAiBA,QAAjB,CAA2BC,IAA3B,qBAA2BA,IAA3B;;AAEA,MAAMC,KAAgC,GAAG;AACvCC,IAAAA,KAAK,EAAEC,QAAQ,CAACP,KAAK,CAACQ,kBAAP,CADwB;AAEvCC,IAAAA,MAAM,EAAEF,QAAQ,CAACP,KAAK,CAACU,mBAAP,CAFuB;AAGvCC,IAAAA,KAAK,EAAEJ,QAAQ,CAACP,KAAK,CAACY,kBAAP,CAHwB,EAAzC;;AAKA,MAAMC,IAA+B,GAAG;AACtCP,IAAAA,KAAK,EAAEC,QAAQ,CAACP,KAAK,CAACc,iBAAP,CADuB;AAEtCL,IAAAA,MAAM,EAAEF,QAAQ,CAACP,KAAK,CAACe,kBAAP,CAFsB;AAGtCJ,IAAAA,KAAK,EAAEJ,QAAQ,CAACP,KAAK,CAACgB,iBAAP,CAHuB,EAAxC;;;AAMA,MAAIC,KAAK,GAAG,IAAZ;AACA,MAAInB,IAAI,IAAIP,SAAS,CAACO,IAAD,CAArB,EAA6B;AAC3BmB,IAAAA,KAAK,GAAGzB,YAAY,CAACM,IAAD,CAAZ,gBAAqBR,KAAK,CAAC4B,YAAN,CAAmBpB,IAAnB,EAAyB,EAAEM,IAAI,sBAAEN,IAAI,CAACqB,KAAL,CAAWf,IAAb,+BAAqBC,KAAK,CAACD,IAAD,CAAhC,EAAzB,CAArB,GAA0FN,IAAlG;AACD;;AAED,MAAMsB,KAA0B,GAAG,EAAnC;AACA,MAAIrB,IAAJ,EAAU;AACR,QAAIA,IAAI,KAAK,OAAb,EAAsB;AACpBqB,MAAAA,KAAK,CAACC,UAAN,GAAmBR,IAAI,CAACT,IAAD,CAAvB;AACD,KAFD,MAEO;AACLgB,MAAAA,KAAK,CAACE,WAAN,GAAoBT,IAAI,CAACT,IAAD,CAAxB;AACD;AACF;;AAED;AACEa,IAAAA,KAAK;AACH;AACE,MAAA,KAAK,EAAEG,KADT;AAEE,MAAA,SAAS,EAAE3B,EAAE;AACXG,MAAAA,YAAY,CAAC2B,KAAb,EADW;AAEX3B,MAAAA,YAAY,CAACE,IAAb,CAAkBE,KAAlB,CAFW;AAGXE,MAAAA,OAAO,IAAIN,YAAY,CAAC4B,SAAb,CAAuBxB,KAAvB,CAHA;AAIXG,MAAAA,QAAQ,IAAIP,YAAY,CAAC6B,YAAb,EAJD,CAFf;;;AASGR,IAAAA,KATH,CAFJ;;;;AAeD,CA5CM","sourcesContent":["import React from 'react';\nimport { isElement } from 'react-is';\n\nimport { isKonturIcon } from '../../../lib/utils';\nimport { InputProps, InputSize } from '../Input';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\n\nimport { InputLayoutContext } from './InputLayoutContext';\nimport { stylesLayout } from './InputLayout.styles';\nexport interface InputLayoutAsideIconProps {\n  icon: InputProps['leftIcon'] | InputProps['rightIcon'];\n  side: 'left' | 'right';\n}\n\nexport const InputLayoutAsideIcon: React.FunctionComponent<InputLayoutAsideIconProps> = ({ icon, side }) => {\n  const theme = React.useContext(ThemeContext);\n  const { focused, disabled, size } = React.useContext(InputLayoutContext);\n\n  const sizes: Record<InputSize, number> = {\n    small: parseInt(theme.inputIconSizeSmall),\n    medium: parseInt(theme.inputIconSizeMedium),\n    large: parseInt(theme.inputIconSizeLarge),\n  };\n  const gaps: Record<InputSize, number> = {\n    small: parseInt(theme.inputIconGapSmall),\n    medium: parseInt(theme.inputIconGapMedium),\n    large: parseInt(theme.inputIconGapLarge),\n  };\n\n  let _icon = null;\n  if (icon && isElement(icon)) {\n    _icon = isKonturIcon(icon) ? React.cloneElement(icon, { size: icon.props.size ?? sizes[size] }) : icon;\n  }\n\n  const style: React.CSSProperties = {};\n  if (side) {\n    if (side === 'right') {\n      style.marginLeft = gaps[size];\n    } else {\n      style.marginRight = gaps[size];\n    }\n  }\n\n  return (\n    _icon && (\n      <span\n        style={style}\n        className={cx(\n          stylesLayout.aside(),\n          stylesLayout.icon(theme),\n          focused && stylesLayout.iconFocus(theme),\n          disabled && stylesLayout.iconDisabled(),\n        )}\n      >\n        {_icon}\n      </span>\n    )\n  );\n};\n"]}
+{"version":3,"sources":["InputLayoutAsideIcon.tsx"],"names":["React","isElement","isKonturIcon","cx","ThemeContext","InputLayoutContext","stylesLayout","InputLayoutAsideIcon","icon","side","theme","useContext","focused","disabled","size","sizes","small","parseInt","inputIconSizeSmall","medium","inputIconSizeMedium","large","inputIconSizeLarge","gaps","inputIconGapSmall","inputIconGapMedium","inputIconGapLarge","_icon","Function","cloneElement","props","style","marginLeft","marginRight","aside","iconFocus","iconDisabled"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,QAA0B,UAA1B;;AAEA,SAASC,YAAT,QAA6B,oBAA7B;;AAEA,SAASC,EAAT,QAAmB,8BAAnB;AACA,SAASC,YAAT,QAA6B,mCAA7B;;;AAGA,SAASC,kBAAT,QAAmC,sBAAnC;AACA,SAASC,YAAT,QAA6B,sBAA7B;;;;;;AAMA,OAAO,IAAMC,oBAAwE,GAAG,SAA3EA,oBAA2E,OAA2B,sBAAxBC,IAAwB,CAAxBA,IAAwB,0BAAjB,IAAiB,aAAXC,IAAW,QAAXA,IAAW;AACjH,MAAMC,KAAK,GAAGV,KAAK,CAACW,UAAN,CAAiBP,YAAjB,CAAd;AACA,0BAAoCJ,KAAK,CAACW,UAAN,CAAiBN,kBAAjB,CAApC,CAAQO,OAAR,qBAAQA,OAAR,CAAiBC,QAAjB,qBAAiBA,QAAjB,CAA2BC,IAA3B,qBAA2BA,IAA3B;;AAEA,MAAMC,KAA+B,GAAG;AACtCC,IAAAA,KAAK,EAAEC,QAAQ,CAACP,KAAK,CAACQ,kBAAP,CADuB;AAEtCC,IAAAA,MAAM,EAAEF,QAAQ,CAACP,KAAK,CAACU,mBAAP,CAFsB;AAGtCC,IAAAA,KAAK,EAAEJ,QAAQ,CAACP,KAAK,CAACY,kBAAP,CAHuB,EAAxC;;AAKA,MAAMC,IAA8B,GAAG;AACrCP,IAAAA,KAAK,EAAEC,QAAQ,CAACP,KAAK,CAACc,iBAAP,CADsB;AAErCL,IAAAA,MAAM,EAAEF,QAAQ,CAACP,KAAK,CAACe,kBAAP,CAFqB;AAGrCJ,IAAAA,KAAK,EAAEJ,QAAQ,CAACP,KAAK,CAACgB,iBAAP,CAHsB,EAAvC;;;AAMA,MAAIC,KAAK,GAAGnB,IAAI,YAAYoB,QAAhB,GAA2BpB,IAAI,EAA/B,GAAoCA,IAAhD;AACA,MAAIP,SAAS,CAACO,IAAD,CAAT,IAAmBN,YAAY,CAACM,IAAD,CAAnC,EAA2C;AACzCmB,IAAAA,KAAK,gBAAG3B,KAAK,CAAC6B,YAAN,CAAmBrB,IAAnB,EAAyB,EAAEM,IAAI,sBAAEN,IAAI,CAACsB,KAAL,CAAWhB,IAAb,+BAAqBC,KAAK,CAACD,IAAD,CAAhC,EAAzB,CAAR;AACD;;AAED,MAAMiB,KAA0B,GAAG,EAAnC;AACA,MAAItB,IAAJ,EAAU;AACR,QAAIA,IAAI,KAAK,OAAb,EAAsB;AACpBsB,MAAAA,KAAK,CAACC,UAAN,GAAmBT,IAAI,CAACT,IAAD,CAAvB;AACD,KAFD,MAEO;AACLiB,MAAAA,KAAK,CAACE,WAAN,GAAoBV,IAAI,CAACT,IAAD,CAAxB;AACD;AACF;;AAED;AACEa,IAAAA,KAAK;AACH;AACE,MAAA,KAAK,EAAEI,KADT;AAEE,MAAA,SAAS,EAAE5B,EAAE;AACXG,MAAAA,YAAY,CAAC4B,KAAb,EADW;AAEX5B,MAAAA,YAAY,CAACE,IAAb,CAAkBE,KAAlB,CAFW;AAGXE,MAAAA,OAAO,IAAIN,YAAY,CAAC6B,SAAb,CAAuBzB,KAAvB,CAHA;AAIXG,MAAAA,QAAQ,IAAIP,YAAY,CAAC8B,YAAb,EAJD,CAFf;;;AASGT,IAAAA,KATH,CAFJ;;;;AAeD,CA5CM","sourcesContent":["import React from 'react';\nimport { isElement } from 'react-is';\n\nimport { isKonturIcon } from '../../../lib/utils';\nimport { InputProps } from '../Input';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { SizeProp } from '../../../lib/types/props';\n\nimport { InputLayoutContext } from './InputLayoutContext';\nimport { stylesLayout } from './InputLayout.styles';\nexport interface InputLayoutAsideIconProps {\n  icon: InputProps['leftIcon'] | InputProps['rightIcon'];\n  side: 'left' | 'right';\n}\n\nexport const InputLayoutAsideIcon: React.FunctionComponent<InputLayoutAsideIconProps> = ({ icon = null, side }) => {\n  const theme = React.useContext(ThemeContext);\n  const { focused, disabled, size } = React.useContext(InputLayoutContext);\n\n  const sizes: Record<SizeProp, number> = {\n    small: parseInt(theme.inputIconSizeSmall),\n    medium: parseInt(theme.inputIconSizeMedium),\n    large: parseInt(theme.inputIconSizeLarge),\n  };\n  const gaps: Record<SizeProp, number> = {\n    small: parseInt(theme.inputIconGapSmall),\n    medium: parseInt(theme.inputIconGapMedium),\n    large: parseInt(theme.inputIconGapLarge),\n  };\n\n  let _icon = icon instanceof Function ? icon() : icon;\n  if (isElement(icon) && isKonturIcon(icon)) {\n    _icon = React.cloneElement(icon, { size: icon.props.size ?? sizes[size] });\n  }\n\n  const style: React.CSSProperties = {};\n  if (side) {\n    if (side === 'right') {\n      style.marginLeft = gaps[size];\n    } else {\n      style.marginRight = gaps[size];\n    }\n  }\n\n  return (\n    _icon && (\n      <span\n        style={style}\n        className={cx(\n          stylesLayout.aside(),\n          stylesLayout.icon(theme),\n          focused && stylesLayout.iconFocus(theme),\n          disabled && stylesLayout.iconDisabled(),\n        )}\n      >\n        {_icon}\n      </span>\n    )\n  );\n};\n"]}

package/components/Input/InputLayout/InputLayoutContext/InputLayoutContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["InputLayoutContext.tsx"],"names":["React","InputLayoutContextDefault","focused","disabled","size","InputLayoutContext","createContext"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;;;;;;;;AAUA,OAAO,IAAMC,yBAAkD,GAAG;AAChEC,EAAAA,OAAO,EAAE,KADuD;AAEhEC,EAAAA,QAAQ,EAAE,KAFsD;AAGhEC,EAAAA,IAAI,EAAE,OAH0D,EAA3D;;;AAMP,OAAO,IAAMC,kBAAkB,gBAAGL,KAAK,CAACM,aAAN,CAA6CL,yBAA7C,CAA3B","sourcesContent":["import React from 'react';\n\nimport { InputSize } from '../Input';\n\nexport interface InputLayoutContextProps {\n  focused: boolean;\n  disabled: boolean;\n  size: InputSize;\n}\n\nexport const InputLayoutContextDefault: InputLayoutContextProps = {\n  focused: false,\n  disabled: false,\n  size: 'small',\n};\n\nexport const InputLayoutContext = React.createContext<InputLayoutContextProps>(InputLayoutContextDefault);\n"]}
+{"version":3,"sources":["InputLayoutContext.tsx"],"names":["React","InputLayoutContextDefault","focused","disabled","size","InputLayoutContext","createContext"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;;;;;;;;AAUA,OAAO,IAAMC,yBAAkD,GAAG;AAChEC,EAAAA,OAAO,EAAE,KADuD;AAEhEC,EAAAA,QAAQ,EAAE,KAFsD;AAGhEC,EAAAA,IAAI,EAAE,OAH0D,EAA3D;;;AAMP,OAAO,IAAMC,kBAAkB,gBAAGL,KAAK,CAACM,aAAN,CAA6CL,yBAA7C,CAA3B","sourcesContent":["import React from 'react';\n\nimport { SizeProp } from '../../../lib/types/props';\n\nexport interface InputLayoutContextProps {\n  focused: boolean;\n  disabled: boolean;\n  size: SizeProp;\n}\n\nexport const InputLayoutContextDefault: InputLayoutContextProps = {\n  focused: false,\n  disabled: false,\n  size: 'small',\n};\n\nexport const InputLayoutContext = React.createContext<InputLayoutContextProps>(InputLayoutContextDefault);\n"]}

package/components/Input/InputLayout/InputLayoutContext.d.ts

@@ -1,9 +1,9 @@
 import React from 'react';
-import { InputSize } from '../Input';
+import { SizeProp } from '../../../lib/types/props';
 export interface InputLayoutContextProps {
     focused: boolean;
     disabled: boolean;
-    size: InputSize;
+    size: SizeProp;
 }
 export declare const InputLayoutContextDefault: InputLayoutContextProps;
 export declare const InputLayoutContext: React.Context<InputLayoutContextProps>;

package/components/Input/index/index.js

@@ -1 +1,2 @@
-export * from "../Input";
+export * from "../Input";
+export * from "../Input.typings";

package/components/Input/index/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd","sourcesContent":["export * from './Input';\n"]}
+{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAd;AACA,cAAc,iBAAd","sourcesContent":["export * from './Input';\nexport * from './Input.typings';\n"]}

package/components/Input/index.d.ts

@@ -1 +1,2 @@
 export * from './Input';
+export * from './Input.typings';

package/components/Kebab/Kebab/Kebab.js

@@ -6,6 +6,7 @@ var _class, _class2, _temp;
 import React from 'react';
 import PropTypes from 'prop-types';
 import { isElement } from 'react-is';
+import { globalObject } from '@skbkontur/global-object';
 import { isKonturIcon } from "../../../lib/utils";
 import { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from "../../../lib/events/keyboard/identifiers";
 import * as LayoutEvents from "../../../lib/LayoutEvents";
@@ -20,6 +21,7 @@ import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from "../../../lib/featureFlagsContext";
 import { styles } from "../Kebab.styles";
 import { KebabIcon } from "../KebabIcon";
 export var KebabDataTids = {
@@ -65,6 +67,7 @@ export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_
       };
 
       return /*#__PURE__*/React.createElement("span", {
+        role: "button",
         "data-tid": KebabDataTids.caption,
         tabIndex: disabled ? -1 : 0,
         onClick: handleCaptionClick,
@@ -93,7 +96,7 @@ export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
-        requestAnimationFrame(function () {
+        globalObject.requestAnimationFrame == null ? void 0 : globalObject.requestAnimationFrame(function () {
           if (keyListener.isTabPressed) {
             _this.setState({
               focusedByTab: true
@@ -134,13 +137,16 @@ export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_
         value: ThemeFactory.create({
           popupPinOffset: theme.kebabPinOffset,
           popupMargin: theme.kebabMargin,
-          popupPinSize: theme.kebabPinSize
+          popupPinSize: theme.kebabPinSize,
+          menuScrollContainerContentWrapperPaddingY: theme.menuLegacyPaddingY
         }, theme)
       }, _this2.renderMain());
     });
   };
 
   _proto.renderMain = function renderMain() {
+    var _this3 = this;
+
     var disabled = this.props.disabled;
 
     var _this$getProps2 = this.getProps(),
@@ -149,19 +155,24 @@ export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_
         onOpen = _this$getProps2.onOpen,
         onClose = _this$getProps2.onClose;
 
-    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-      rootNodeRef: this.setRootNode
-    }, this.props), /*#__PURE__*/React.createElement(PopupMenu, {
-      popupHasPin: true,
-      positions: positions,
-      onChangeMenuState: this.handleChangeMenuState,
-      caption: this.renderCaption,
-      disableAnimations: disableAnimations,
-      menuMaxHeight: this.props.menuMaxHeight,
-      onOpen: onOpen,
-      onClose: onClose,
-      popupMenuId: this.props.popupMenuId
-    }, !disabled && this.props.children));
+    return /*#__PURE__*/React.createElement(ReactUIFeatureFlagsContext.Consumer, null, function (flags) {
+      var hasPin = !getFullReactUIFlagsContext(flags).kebabHintRemovePin || !isTheme2022(_this3.theme);
+      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+        rootNodeRef: _this3.setRootNode
+      }, _this3.props), /*#__PURE__*/React.createElement(PopupMenu, {
+        popupHasPin: hasPin,
+        preventIconsOffset: _this3.props.preventIconsOffset,
+        positions: positions,
+        onChangeMenuState: _this3.handleChangeMenuState,
+        caption: _this3.renderCaption,
+        disableAnimations: disableAnimations,
+        menuMaxHeight: _this3.props.menuMaxHeight,
+        onOpen: onOpen,
+        onClose: onClose,
+        popupMenuId: _this3.props.popupMenuId,
+        "aria-label": _this3.props['aria-label']
+      }, !disabled && _this3.props.children));
+    });
   };
 
   _proto.renderIcon = function renderIcon() {
@@ -201,7 +212,7 @@ export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_
   };
 
   return Kebab;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Kebab', _class2.propTypes = {}, _class2.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Kebab', _class2.displayName = 'Kebab', _class2.propTypes = {}, _class2.defaultProps = {
   onOpen: function onOpen() {
     return undefined;
   },

package/components/Kebab/Kebab/Kebab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","isElement","isKonturIcon","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","keyListener","PopupMenu","ThemeContext","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","cx","rootNode","createPropsGetter","isTheme2022","styles","KebabIcon","KebabDataTids","caption","Kebab","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","size","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","kebab","theme","kebabSmall","kebabMedium","kebabLarge","kebab2022","opened","focused","props","renderIcon2022","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","disableAnimations","onOpen","onClose","setRootNode","menuMaxHeight","popupMenuId","children","icon","iconsmall","iconmedium","iconlarge","sizes","small","parseInt","kebabIconSizeSmall","medium","kebabIconSizeMedium","large","kebabIconSizeLarge","cloneElement","color","kebabIconColor","Component","__KONTUR_REACT_UI__","propTypes","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { isElement } from 'react-is';\n\nimport { isKonturIcon } from '../../lib/utils';\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps, PopupMenuProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { ButtonSize } from '../Button';\n\nimport { styles } from './Kebab.styles';\nimport { KebabIcon } from './KebabIcon';\n\nexport interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {\n  disabled?: boolean;\n  size?: 'small' | 'medium' | 'large';\n  /**\n   * Список позиций доступных для расположения выпадашки.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions?: PopupPositionsType[];\n  menuMaxHeight?: number | string;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n  /**\n   * Кастомная иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Атрибут для указания id элемента(-ов), описывающих его\n   */\n  'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const KebabDataTids = {\n  caption: 'Kebab__caption',\n} as const;\n\nexport interface KebabState {\n  anchor: Nullable<HTMLElement>;\n  focusedByTab: boolean;\n}\n\ntype DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n  public static __KONTUR_REACT_UI__ = 'Kebab';\n\n  public static propTypes = {};\n\n  public static defaultProps: DefaultProps = {\n    onOpen: () => undefined,\n    onClose: () => undefined,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n    size: 'small',\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(Kebab.defaultProps);\n\n  public state: KebabState = {\n    focusedByTab: false,\n    anchor: null,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  private listener: {\n    remove: () => void;\n  } = {\n    remove: () => undefined,\n  };\n\n  public componentDidMount() {\n    /** addListener'у нужен колбэк в аргумент */\n    this.listener = LayoutEvents.addListener(() => undefined);\n  }\n\n  public componentWillUnmount() {\n    this.listener.remove();\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.kebabPinOffset,\n                  popupMargin: theme.kebabMargin,\n                  popupPinSize: theme.kebabPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { disabled } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          popupHasPin\n          positions={positions}\n          onChangeMenuState={this.handleChangeMenuState}\n          caption={this.renderCaption}\n          disableAnimations={disableAnimations}\n          menuMaxHeight={this.props.menuMaxHeight}\n          onOpen={onOpen}\n          onClose={onClose}\n          popupMenuId={this.props.popupMenuId}\n        >\n          {!disabled && this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n    const { disabled, size } = this.getProps();\n    const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!disabled) {\n        this.handleCaptionKeyDown(event, captionProps.openMenu);\n      }\n    };\n\n    const handleCaptionClick = () => {\n      if (!disabled) {\n        captionProps.toggleMenu();\n      }\n    };\n\n    return (\n      <span\n        data-tid={KebabDataTids.caption}\n        tabIndex={disabled ? -1 : 0}\n        onClick={handleCaptionClick}\n        onKeyDown={handleCaptionKeyDown}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        className={cx(\n          styles.kebab(this.theme),\n          size === 'small' && styles.kebabSmall(this.theme),\n          size === 'medium' && styles.kebabMedium(this.theme),\n          size === 'large' && styles.kebabLarge(this.theme),\n          isTheme2022(this.theme) && styles.kebab2022(),\n          captionProps.opened && styles.opened(this.theme),\n          disabled && styles.disabled(),\n          this.state.focusedByTab && styles.focused(this.theme),\n        )}\n        aria-describedby={this.props['aria-describedby']}\n      >\n        {isTheme2022(this.theme) ? this.renderIcon2022() : this.renderIcon()}\n      </span>\n    );\n  };\n\n  private handleCaptionKeyDown = (\n    e: React.KeyboardEvent<HTMLDivElement>,\n    openMenu: PopupMenuCaptionProps['openMenu'],\n  ) => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      openMenu(true);\n    }\n  };\n\n  private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n    this.setState({\n      focusedByTab: !isOpened && restoreFocus,\n    });\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      requestAnimationFrame(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({\n      focusedByTab: false,\n    });\n  };\n\n  private renderIcon() {\n    const { size, icon = <MenuKebabIcon /> } = this.getProps();\n    return (\n      <div\n        className={cx({\n          [styles.icon(this.theme)]: true,\n          [styles.iconsmall(this.theme)]: size === 'small',\n          [styles.iconmedium(this.theme)]: size === 'medium',\n          [styles.iconlarge(this.theme)]: size === 'large',\n        })}\n      >\n        {icon}\n      </div>\n    );\n  }\n\n  private renderIcon2022() {\n    const { size, icon = <KebabIcon /> } = this.getProps();\n\n    if (isElement(icon) && isKonturIcon(icon)) {\n      const sizes: Record<ButtonSize, number> = {\n        small: parseInt(this.theme.kebabIconSizeSmall),\n        medium: parseInt(this.theme.kebabIconSizeMedium),\n        large: parseInt(this.theme.kebabIconSizeLarge),\n      };\n\n      return React.cloneElement(icon, {\n        size: icon.props.size ?? sizes[size],\n        color: icon.props.color ?? this.theme.kebabIconColor,\n      });\n    }\n\n    return icon;\n  }\n}\n\nKebab.propTypes = {\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n  /**\n   * Размер кебаба small 14px | large 20px\n   */\n  size: PropTypes.string,\n\n  /**\n   * Коллбек, вызывающийся перед закрытием кебаба\n   */\n  onClose: PropTypes.func,\n\n  /**\n   * Коллбек, вызывающийся перед открытием кебаба\n   */\n  onOpen: PropTypes.func,\n};\n"]}
+{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","isElement","globalObject","isKonturIcon","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","keyListener","PopupMenu","ThemeContext","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","cx","rootNode","createPropsGetter","isTheme2022","getFullReactUIFlagsContext","ReactUIFeatureFlagsContext","styles","KebabIcon","KebabDataTids","caption","Kebab","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","size","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","kebab","theme","kebabSmall","kebabMedium","kebabLarge","kebab2022","opened","focused","props","renderIcon2022","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","menuScrollContainerContentWrapperPaddingY","menuLegacyPaddingY","renderMain","positions","disableAnimations","onOpen","onClose","flags","hasPin","kebabHintRemovePin","setRootNode","preventIconsOffset","menuMaxHeight","popupMenuId","children","icon","iconsmall","iconmedium","iconlarge","sizes","small","parseInt","kebabIconSizeSmall","medium","kebabIconSizeMedium","large","kebabIconSizeLarge","cloneElement","color","kebabIconColor","Component","__KONTUR_REACT_UI__","displayName","propTypes","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { isElement } from 'react-is';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { isKonturIcon } from '../../lib/utils';\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps, PopupMenuProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { SizeProp } from '../../lib/types/props';\nimport { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from '../../lib/featureFlagsContext';\n\nimport { styles } from './Kebab.styles';\nimport { KebabIcon } from './KebabIcon';\n\nexport interface KebabProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>,\n    CommonProps {\n  disabled?: boolean;\n  size?: SizeProp;\n  /**\n   * Список позиций доступных для расположения выпадашки.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions?: PopupPositionsType[];\n  menuMaxHeight?: number | string;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n  /**\n   * Кастомная иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Атрибут для указания id элемента(-ов), описывающих его\n   */\n  'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const KebabDataTids = {\n  caption: 'Kebab__caption',\n} as const;\n\nexport interface KebabState {\n  anchor: Nullable<HTMLElement>;\n  focusedByTab: boolean;\n}\n\ntype DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n  public static __KONTUR_REACT_UI__ = 'Kebab';\n  public static displayName = 'Kebab';\n\n  public static propTypes = {};\n\n  public static defaultProps: DefaultProps = {\n    onOpen: () => undefined,\n    onClose: () => undefined,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n    size: 'small',\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(Kebab.defaultProps);\n\n  public state: KebabState = {\n    focusedByTab: false,\n    anchor: null,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  private listener: {\n    remove: () => void;\n  } = {\n    remove: () => undefined,\n  };\n\n  public componentDidMount() {\n    /** addListener'у нужен колбэк в аргумент */\n    this.listener = LayoutEvents.addListener(() => undefined);\n  }\n\n  public componentWillUnmount() {\n    this.listener.remove();\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.kebabPinOffset,\n                  popupMargin: theme.kebabMargin,\n                  popupPinSize: theme.kebabPinSize,\n                  menuScrollContainerContentWrapperPaddingY: theme.menuLegacyPaddingY,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { disabled } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\n    return (\n      <ReactUIFeatureFlagsContext.Consumer>\n        {(flags) => {\n          const hasPin = !getFullReactUIFlagsContext(flags).kebabHintRemovePin || !isTheme2022(this.theme);\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n              <PopupMenu\n                popupHasPin={hasPin}\n                preventIconsOffset={this.props.preventIconsOffset}\n                positions={positions}\n                onChangeMenuState={this.handleChangeMenuState}\n                caption={this.renderCaption}\n                disableAnimations={disableAnimations}\n                menuMaxHeight={this.props.menuMaxHeight}\n                onOpen={onOpen}\n                onClose={onClose}\n                popupMenuId={this.props.popupMenuId}\n                aria-label={this.props['aria-label']}\n              >\n                {!disabled && this.props.children}\n              </PopupMenu>\n            </CommonWrapper>\n          );\n        }}\n      </ReactUIFeatureFlagsContext.Consumer>\n    );\n  }\n\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n    const { disabled, size } = this.getProps();\n    const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!disabled) {\n        this.handleCaptionKeyDown(event, captionProps.openMenu);\n      }\n    };\n\n    const handleCaptionClick = () => {\n      if (!disabled) {\n        captionProps.toggleMenu();\n      }\n    };\n\n    return (\n      <span\n        role=\"button\"\n        data-tid={KebabDataTids.caption}\n        tabIndex={disabled ? -1 : 0}\n        onClick={handleCaptionClick}\n        onKeyDown={handleCaptionKeyDown}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        className={cx(\n          styles.kebab(this.theme),\n          size === 'small' && styles.kebabSmall(this.theme),\n          size === 'medium' && styles.kebabMedium(this.theme),\n          size === 'large' && styles.kebabLarge(this.theme),\n          isTheme2022(this.theme) && styles.kebab2022(),\n          captionProps.opened && styles.opened(this.theme),\n          disabled && styles.disabled(),\n          this.state.focusedByTab && styles.focused(this.theme),\n        )}\n        aria-describedby={this.props['aria-describedby']}\n      >\n        {isTheme2022(this.theme) ? this.renderIcon2022() : this.renderIcon()}\n      </span>\n    );\n  };\n\n  private handleCaptionKeyDown = (\n    e: React.KeyboardEvent<HTMLDivElement>,\n    openMenu: PopupMenuCaptionProps['openMenu'],\n  ) => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      openMenu(true);\n    }\n  };\n\n  private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n    this.setState({\n      focusedByTab: !isOpened && restoreFocus,\n    });\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      globalObject.requestAnimationFrame?.(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({\n      focusedByTab: false,\n    });\n  };\n\n  private renderIcon() {\n    const { size, icon = <MenuKebabIcon /> } = this.getProps();\n    return (\n      <div\n        className={cx({\n          [styles.icon(this.theme)]: true,\n          [styles.iconsmall(this.theme)]: size === 'small',\n          [styles.iconmedium(this.theme)]: size === 'medium',\n          [styles.iconlarge(this.theme)]: size === 'large',\n        })}\n      >\n        {icon}\n      </div>\n    );\n  }\n\n  private renderIcon2022() {\n    const { size, icon = <KebabIcon /> } = this.getProps();\n\n    if (isElement(icon) && isKonturIcon(icon)) {\n      const sizes: Record<SizeProp, number> = {\n        small: parseInt(this.theme.kebabIconSizeSmall),\n        medium: parseInt(this.theme.kebabIconSizeMedium),\n        large: parseInt(this.theme.kebabIconSizeLarge),\n      };\n\n      return React.cloneElement(icon, {\n        size: icon.props.size ?? sizes[size],\n        color: icon.props.color ?? this.theme.kebabIconColor,\n      });\n    }\n\n    return icon;\n  }\n}\n\nKebab.propTypes = {\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n  /**\n   * Размер кебаба small 14px | large 20px\n   */\n  size: PropTypes.string,\n\n  /**\n   * Коллбек, вызывающийся перед закрытием кебаба\n   */\n  onClose: PropTypes.func,\n\n  /**\n   * Коллбек, вызывающийся перед открытием кебаба\n   */\n  onOpen: PropTypes.func,\n};\n"]}

package/components/Kebab/Kebab.d.ts

@@ -3,9 +3,10 @@ import { PopupMenuProps } from '../../internal/PopupMenu';
 import { Nullable } from '../../typings/utility-types';
 import { PopupPositionsType } from '../../internal/Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {
+import { SizeProp } from '../../lib/types/props';
+export interface KebabProps extends Pick<AriaAttributes, 'aria-label'>, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>, CommonProps {
     disabled?: boolean;
-    size?: 'small' | 'medium' | 'large';
+    size?: SizeProp;
     /**
      * Список позиций доступных для расположения выпадашки.
      *
@@ -39,6 +40,7 @@ export interface KebabState {
 declare type DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;
 export declare class Kebab extends React.Component<KebabProps, KebabState> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static propTypes: {};
     static defaultProps: DefaultProps;
     private getProps;

package/components/Kebab/Kebab.md

@@ -160,6 +160,34 @@ let Card = ({ title }) => (
 <Card title="С кастомным действием" />
 ```
 
+С иконками и включенным по-умолчанию автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, Kebab } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<Kebab>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</Kebab>;
+```
+
+С иконками и отключенным автоматическим выравниванием текста.
+
+```jsx harmony
+import { Button, MenuHeader, MenuItem, MenuSeparator, Kebab } from '@skbkontur/react-ui';
+import OkIcon from '@skbkontur/react-icons/Ok';
+
+<Kebab preventIconsOffset>
+  <MenuHeader>MenuHeader</MenuHeader>
+  <MenuItem icon={<OkIcon />}>MenuItem1</MenuItem>
+  <MenuItem icon={<OkIcon />}>MenuItem2</MenuItem>
+  <MenuItem>MenuItem3</MenuItem>
+</Kebab>
+```
+
 Отключенное кебаб-меню.
 
 ```jsx harmony

package/components/Link/Link/Link.js

@@ -1,23 +1,26 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
-var _excluded = ["disabled", "href", "icon", "use", "loading", "_button", "_buttonOpened", "rel", "as", "focused"];
+var _excluded = ["disabled", "href", "icon", "rightIcon", "use", "loading", "_button", "_buttonOpened", "rel", "as", "focused"];
 
 var _class, _class2, _temp;
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import { globalObject } from '@skbkontur/global-object';
 import { keyListener } from "../../../lib/events/keyListener";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { isExternalLink } from "../../../lib/utils";
-import { Spinner } from "../../Spinner";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { cx } from "../../../lib/theming/Emotion";
 import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
 import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
-import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { isDarkTheme, isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { isIE11 } from "../../../lib/client";
+import { ReactUIFeatureFlagsContext, getFullReactUIFlagsContext } from "../../../lib/featureFlagsContext";
 import { globalClasses, styles } from "../Link.styles";
+import { LinkIcon } from "../LinkIcon";
 export var LinkDataTids = {
   root: 'Link__root'
 };
@@ -45,6 +48,7 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
       var disabled = props.disabled,
           href = props.href,
           icon = props.icon,
+          rightIcon = props.rightIcon,
           use = props.use,
           loading = props.loading,
           _button = props._button,
@@ -57,18 +61,6 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
 
       var _isTheme2022 = isTheme2022(_this.theme);
 
-      var iconElement = null;
-
-      if (icon) {
-        iconElement = /*#__PURE__*/React.createElement("span", {
-          className: styles.icon(_this.theme)
-        }, loading ? /*#__PURE__*/React.createElement(Spinner, {
-          caption: null,
-          dimmed: true,
-          inline: true
-        }) : icon);
-      }
-
       var arrow = null;
 
       if (_button) {
@@ -84,8 +76,19 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
       }
 
       var isFocused = !disabled && (_this.state.focusedByTab || focused);
+      var leftIconElement = icon && /*#__PURE__*/React.createElement(LinkIcon, {
+        icon: icon,
+        loading: loading,
+        position: "left"
+      });
+      var rightIconElement = rightIcon && /*#__PURE__*/React.createElement(LinkIcon, {
+        hasBothIcons: !!icon && !!rightIcon,
+        icon: rightIcon,
+        loading: loading,
+        position: "right"
+      });
       var linkProps = {
-        className: cx(use === 'default' && styles.useDefault(_this.theme), use === 'success' && styles.useSuccess(_this.theme), use === 'danger' && styles.useDanger(_this.theme), use === 'grayed' && styles.useGrayed(_this.theme), !!_button && styles.button(_this.theme), !!_buttonOpened && styles.buttonOpened(_this.theme), _this.getLinkClassName(isFocused, Boolean(disabled || loading))),
+        className: cx(styles.useRoot(), use === 'default' && styles.useDefault(_this.theme), use === 'success' && styles.useSuccess(_this.theme), use === 'danger' && styles.useDanger(_this.theme), use === 'grayed' && styles.useGrayed(_this.theme), !!_button && styles.button(_this.theme), !!_buttonOpened && styles.buttonOpened(_this.theme), _this.getLinkClassName(isFocused, Boolean(disabled || loading), _isTheme2022)),
         href: href,
         rel: rel,
         onClick: _this.handleClick,
@@ -96,21 +99,26 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
       var child = _this.props.children;
 
       if (_isTheme2022) {
+        var _cx, _cx2; // lineTextWrapper нужен для реализации transition у подчеркивания
+
+
         child = /*#__PURE__*/React.createElement("span", {
-          className: cx(globalClasses.text, styles.lineText(_this.theme))
-        }, _this.props.children);
+          className: cx(globalClasses.textWrapper, styles.lineTextWrapper(_this.theme), (_cx = {}, _cx[styles.lineTextWrapperFocused(_this.theme)] = isFocused, _cx))
+        }, /*#__PURE__*/React.createElement("span", {
+          className: cx(globalClasses.text, (_cx2 = {}, _cx2[styles.lineText(_this.theme)] = !isIE11, _cx2[styles.lineTextIE11(_this.theme)] = isIE11, _cx2))
+        }, _this.props.children));
       }
 
       return /*#__PURE__*/React.createElement(Component, _extends({
         "data-tid": LinkDataTids.root
-      }, rest, linkProps), iconElement, child, arrow);
+      }, rest, linkProps), leftIconElement, child, rightIconElement, arrow);
     };
 
     _this.handleFocus = function () {
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
-        requestAnimationFrame(function () {
+        globalObject.requestAnimationFrame == null ? void 0 : globalObject.requestAnimationFrame(function () {
           if (keyListener.isTabPressed) {
             _this.setState({
               focusedByTab: true
@@ -151,25 +159,28 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
   _proto.render = function render() {
     var _this2 = this;
 
-    return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
-      _this2.theme = _this2.props.theme ? ThemeFactory.create(_this2.props.theme, theme) : theme;
-      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
-        rootNodeRef: _this2.setRootNode
-      }, _this2.getProps()), _this2.renderMain);
+    return /*#__PURE__*/React.createElement(ReactUIFeatureFlagsContext.Consumer, null, function (flags) {
+      _this2.linkFocusOutline = getFullReactUIFlagsContext(flags).linkFocusOutline;
+      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+        _this2.theme = _this2.props.theme ? ThemeFactory.create(_this2.props.theme, theme) : theme;
+        return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+          rootNodeRef: _this2.setRootNode
+        }, _this2.getProps()), _this2.renderMain);
+      });
     });
   };
 
-  _proto.getLinkClassName = function getLinkClassName(focused, disabled) {
+  _proto.getLinkClassName = function getLinkClassName(focused, disabled, _isTheme2022) {
     var _this$getProps = this.getProps(),
         use = _this$getProps.use;
 
     var isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;
     var isFocused = focused && !disabled;
-    return !isBorderBottom ? cx(styles.root(this.theme), isFocused && styles.focus(this.theme), disabled && styles.disabled(this.theme), use === 'grayed' && focused && styles.useGrayedFocus(this.theme)) : cx(styles.lineRoot(), disabled && styles.disabled(this.theme), isFocused && use === 'default' && styles.lineFocus(this.theme), isFocused && use === 'success' && styles.lineFocusSuccess(this.theme), isFocused && use === 'danger' && styles.lineFocusDanger(this.theme), isFocused && use === 'grayed' && styles.lineFocusGrayed(this.theme));
+    return !isBorderBottom ? cx(styles.root(this.theme), isFocused && styles.focus(this.theme), disabled && styles.disabled(this.theme), use === 'grayed' && focused && styles.useGrayedFocus(this.theme)) : cx(styles.lineRoot(), disabled && styles.disabled(this.theme), disabled && _isTheme2022 && isDarkTheme(this.theme) && styles.disabledDark22Theme(this.theme), isFocused && use === 'default' && styles.lineFocus(this.theme), isFocused && use === 'success' && styles.lineFocusSuccess(this.theme), isFocused && use === 'danger' && styles.lineFocusDanger(this.theme), isFocused && use === 'grayed' && styles.lineFocusGrayed(this.theme), isFocused && _isTheme2022 && this.linkFocusOutline && styles.focus2022(this.theme));
   };
 
   return Link;
-}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Link', _class2.propTypes = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Link', _class2.displayName = 'Link', _class2.propTypes = {
   disabled: PropTypes.bool,
   href: PropTypes.string,
   icon: PropTypes.node,

package/components/Link/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Link.tsx"],"names":["React","PropTypes","keyListener","ThemeContext","isExternalLink","Spinner","CommonWrapper","cx","rootNode","createPropsGetter","ThemeFactory","isTheme2022","globalClasses","styles","LinkDataTids","root","Link","getProps","defaultProps","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","Component","as","focused","rest","_isTheme2022","theme","iconElement","arrow","isFocused","linkProps","className","useDefault","useSuccess","useDanger","useGrayed","button","buttonOpened","getLinkClassName","Boolean","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","tabIndex","child","children","text","lineText","requestAnimationFrame","isTabPressed","setState","event","preventDefault","render","create","setRootNode","isBorderBottom","parseInt","linkLineBorderBottomWidth","focus","useGrayedFocus","lineRoot","lineFocus","lineFocusSuccess","lineFocusDanger","lineFocusGrayed","__KONTUR_REACT_UI__","propTypes","bool","string","node","oneOf"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Override } from '../../typings/utility-types';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { Spinner } from '../Spinner';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\n\nimport { globalClasses, styles } from './Link.styles';\n\nexport interface LinkProps\n  extends CommonProps,\n    Override<\n      React.AnchorHTMLAttributes<HTMLAnchorElement>,\n      {\n        /**\n         * Отключенное состояние.\n         */\n        disabled?: boolean;\n        /**\n         * HTML-атрибут `href`.\n         */\n        href?: string;\n        /**\n         * Добавляет ссылке иконку.\n         */\n        icon?: React.ReactElement<any>;\n        /**\n         * Тема ссылки.\n         */\n        use?: 'default' | 'success' | 'danger' | 'grayed';\n        /**\n         * @ignore\n         */\n        _button?: boolean;\n        /**\n         * @ignore\n         */\n        _buttonOpened?: boolean;\n        /**\n         * HTML-атрибут `tabindex`.\n         */\n        tabIndex?: number;\n        /**\n         * Переводит ссылку в состояние загрузки.\n         */\n        loading?: boolean;\n        /**\n         * HTML-событие `onclick`.\n         */\n        onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;\n\n        /**\n         * Обычный объект с переменными темы.\n         * Он будет объединён с темой из контекста.\n         */\n        theme?: ThemeIn;\n        /**\n         * Компонент, используемый в качестве корневого узла.\n         * @ignore\n         */\n        as?: React.ElementType | keyof React.ReactHTML;\n        /**\n         * @ignore\n         */\n        focused?: boolean;\n      }\n    > {}\n\nexport interface LinkState {\n  focusedByTab: boolean;\n}\n\nexport const LinkDataTids = {\n  root: 'Link__root',\n} as const;\n\ntype DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;\ntype DefaultizedLinkProps = DefaultizedProps<LinkProps, DefaultProps>;\n\n/**\n * Элемент ссылки из HTML.\n */\n@rootNode\nexport class Link extends React.Component<LinkProps, LinkState> {\n  public static __KONTUR_REACT_UI__ = 'Link';\n\n  public static propTypes = {\n    disabled: PropTypes.bool,\n\n    href: PropTypes.string,\n\n    icon: PropTypes.node,\n\n    use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']),\n  };\n\n  public static defaultProps: DefaultProps = {\n    href: '',\n    use: 'default',\n    as: 'a',\n  };\n\n  private getProps = createPropsGetter(Link.defaultProps);\n\n  public state: LinkState = {\n    focusedByTab: false,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n              {this.renderMain}\n            </CommonWrapper>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedLinkProps>) => {\n    const {\n      disabled,\n      href,\n      icon,\n      use,\n      loading,\n      _button,\n      _buttonOpened,\n      rel: relOrigin,\n      as: Component,\n      focused = false,\n      ...rest\n    } = props;\n    const _isTheme2022 = isTheme2022(this.theme);\n\n    let iconElement = null;\n    if (icon) {\n      iconElement = (\n        <span className={styles.icon(this.theme)}>{loading ? <Spinner caption={null} dimmed inline /> : icon}</span>\n      );\n    }\n\n    let arrow = null;\n    if (_button) {\n      arrow = <span className={styles.arrow()} />;\n    }\n\n    let rel = relOrigin;\n    if (typeof rel === 'undefined' && href) {\n      rel = `noopener${isExternalLink(href) ? ' noreferrer' : ''}`;\n    }\n\n    const isFocused = !disabled && (this.state.focusedByTab || focused);\n\n    const linkProps = {\n      className: cx(\n        use === 'default' && styles.useDefault(this.theme),\n        use === 'success' && styles.useSuccess(this.theme),\n        use === 'danger' && styles.useDanger(this.theme),\n        use === 'grayed' && styles.useGrayed(this.theme),\n        !!_button && styles.button(this.theme),\n        !!_buttonOpened && styles.buttonOpened(this.theme),\n        this.getLinkClassName(isFocused, Boolean(disabled || loading)),\n      ),\n      href,\n      rel,\n      onClick: this.handleClick,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      tabIndex: disabled || loading ? -1 : this.props.tabIndex,\n    };\n\n    let child = this.props.children;\n    if (_isTheme2022) {\n      child = <span className={cx(globalClasses.text, styles.lineText(this.theme))}>{this.props.children}</span>;\n    }\n\n    return (\n      <Component data-tid={LinkDataTids.root} {...rest} {...linkProps}>\n        {iconElement}\n        {child}\n        {arrow}\n      </Component>\n    );\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      requestAnimationFrame(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({ focusedByTab: false });\n  };\n\n  private handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n    const { onClick, disabled, loading } = this.props;\n    const href = this.getProps().href;\n    if (!href) {\n      event.preventDefault();\n    }\n    if (onClick && !disabled && !loading) {\n      onClick(event);\n    }\n  };\n\n  private getLinkClassName(focused: boolean, disabled: boolean): string {\n    const { use } = this.getProps();\n    const isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;\n    const isFocused = focused && !disabled;\n\n    return !isBorderBottom\n      ? cx(\n          styles.root(this.theme),\n          isFocused && styles.focus(this.theme),\n          disabled && styles.disabled(this.theme),\n          use === 'grayed' && focused && styles.useGrayedFocus(this.theme),\n        )\n      : cx(\n          styles.lineRoot(),\n          disabled && styles.disabled(this.theme),\n          isFocused && use === 'default' && styles.lineFocus(this.theme),\n          isFocused && use === 'success' && styles.lineFocusSuccess(this.theme),\n          isFocused && use === 'danger' && styles.lineFocusDanger(this.theme),\n          isFocused && use === 'grayed' && styles.lineFocusGrayed(this.theme),\n        );\n  }\n}\n"]}
+{"version":3,"sources":["Link.tsx"],"names":["React","PropTypes","globalObject","keyListener","ThemeContext","isExternalLink","CommonWrapper","cx","rootNode","createPropsGetter","ThemeFactory","isDarkTheme","isTheme2022","isIE11","ReactUIFeatureFlagsContext","getFullReactUIFlagsContext","globalClasses","styles","LinkIcon","LinkDataTids","root","Link","getProps","defaultProps","state","focusedByTab","renderMain","props","disabled","href","icon","rightIcon","use","loading","_button","_buttonOpened","relOrigin","rel","Component","as","focused","rest","_isTheme2022","theme","arrow","isFocused","leftIconElement","rightIconElement","linkProps","className","useRoot","useDefault","useSuccess","useDanger","useGrayed","button","buttonOpened","getLinkClassName","Boolean","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","tabIndex","child","children","textWrapper","lineTextWrapper","lineTextWrapperFocused","text","lineText","lineTextIE11","requestAnimationFrame","isTabPressed","setState","event","preventDefault","render","flags","linkFocusOutline","create","setRootNode","isBorderBottom","parseInt","linkLineBorderBottomWidth","focus","useGrayedFocus","lineRoot","disabledDark22Theme","lineFocus","lineFocusSuccess","lineFocusDanger","lineFocusGrayed","focus2022","__KONTUR_REACT_UI__","displayName","propTypes","bool","string","node","oneOf"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { Override } from '../../typings/utility-types';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { isDarkTheme, isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { isIE11 } from '../../lib/client';\nimport { ReactUIFeatureFlagsContext, getFullReactUIFlagsContext } from '../../lib/featureFlagsContext';\n\nimport { globalClasses, styles } from './Link.styles';\nimport { LinkIcon } from './LinkIcon';\n\nexport interface LinkProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    CommonProps,\n    Override<\n      React.AnchorHTMLAttributes<HTMLAnchorElement>,\n      {\n        /**\n         * Отключенное состояние.\n         */\n        disabled?: boolean;\n        /**\n         * HTML-атрибут `href`.\n         */\n        href?: string;\n        /**\n         * Добавляет ссылке иконку слева.\n         */\n        icon?: React.ReactElement;\n        /**\n         * Добавляет ссылке иконку справа.\n         */\n        rightIcon?: React.ReactElement;\n        /**\n         * Тема ссылки.\n         */\n        use?: 'default' | 'success' | 'danger' | 'grayed';\n        /**\n         * @ignore\n         */\n        _button?: boolean;\n        /**\n         * @ignore\n         */\n        _buttonOpened?: boolean;\n        /**\n         * HTML-атрибут `tabindex`.\n         */\n        tabIndex?: number;\n        /**\n         * Переводит ссылку в состояние загрузки.\n         */\n        loading?: boolean;\n        /**\n         * HTML-событие `onclick`.\n         */\n        onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;\n\n        /**\n         * Обычный объект с переменными темы.\n         * Он будет объединён с темой из контекста.\n         */\n        theme?: ThemeIn;\n        /**\n         * Компонент, используемый в качестве корневого узла.\n         * @ignore\n         */\n        as?: React.ElementType | keyof React.ReactHTML;\n        /**\n         * @ignore\n         */\n        focused?: boolean;\n      }\n    > {}\n\nexport interface LinkState {\n  focusedByTab: boolean;\n}\n\nexport const LinkDataTids = {\n  root: 'Link__root',\n} as const;\n\ntype DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;\ntype DefaultizedLinkProps = DefaultizedProps<LinkProps, DefaultProps>;\n\n/**\n * Элемент ссылки из HTML.\n */\n@rootNode\nexport class Link extends React.Component<LinkProps, LinkState> {\n  public static __KONTUR_REACT_UI__ = 'Link';\n  public static displayName = 'Link';\n\n  public static propTypes = {\n    disabled: PropTypes.bool,\n\n    href: PropTypes.string,\n\n    icon: PropTypes.node,\n\n    use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']),\n  };\n\n  public static defaultProps: DefaultProps = {\n    href: '',\n    use: 'default',\n    as: 'a',\n  };\n\n  private getProps = createPropsGetter(Link.defaultProps);\n\n  public state: LinkState = {\n    focusedByTab: false,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n  private linkFocusOutline?: boolean;\n\n  public render(): JSX.Element {\n    return (\n      <ReactUIFeatureFlagsContext.Consumer>\n        {(flags) => {\n          this.linkFocusOutline = getFullReactUIFlagsContext(flags).linkFocusOutline;\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n                return (\n                  <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n                    {this.renderMain}\n                  </CommonWrapper>\n                );\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </ReactUIFeatureFlagsContext.Consumer>\n    );\n  }\n\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedLinkProps>) => {\n    const {\n      disabled,\n      href,\n      icon,\n      rightIcon,\n      use,\n      loading,\n      _button,\n      _buttonOpened,\n      rel: relOrigin,\n      as: Component,\n      focused = false,\n      ...rest\n    } = props;\n    const _isTheme2022 = isTheme2022(this.theme);\n\n    let arrow = null;\n    if (_button) {\n      arrow = <span className={styles.arrow()} />;\n    }\n\n    let rel = relOrigin;\n    if (typeof rel === 'undefined' && href) {\n      rel = `noopener${isExternalLink(href) ? ' noreferrer' : ''}`;\n    }\n\n    const isFocused = !disabled && (this.state.focusedByTab || focused);\n\n    const leftIconElement = icon && <LinkIcon icon={icon} loading={loading} position=\"left\" />;\n    const rightIconElement = rightIcon && (\n      <LinkIcon hasBothIcons={!!icon && !!rightIcon} icon={rightIcon} loading={loading} position=\"right\" />\n    );\n\n    const linkProps = {\n      className: cx(\n        styles.useRoot(),\n        use === 'default' && styles.useDefault(this.theme),\n        use === 'success' && styles.useSuccess(this.theme),\n        use === 'danger' && styles.useDanger(this.theme),\n        use === 'grayed' && styles.useGrayed(this.theme),\n        !!_button && styles.button(this.theme),\n        !!_buttonOpened && styles.buttonOpened(this.theme),\n        this.getLinkClassName(isFocused, Boolean(disabled || loading), _isTheme2022),\n      ),\n      href,\n      rel,\n      onClick: this.handleClick,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      tabIndex: disabled || loading ? -1 : this.props.tabIndex,\n    };\n\n    let child = this.props.children;\n    if (_isTheme2022) {\n      // lineTextWrapper нужен для реализации transition у подчеркивания\n      child = (\n        <span\n          className={cx(globalClasses.textWrapper, styles.lineTextWrapper(this.theme), {\n            [styles.lineTextWrapperFocused(this.theme)]: isFocused,\n          })}\n        >\n          <span\n            className={cx(globalClasses.text, {\n              [styles.lineText(this.theme)]: !isIE11,\n              [styles.lineTextIE11(this.theme)]: isIE11,\n            })}\n          >\n            {this.props.children}\n          </span>\n        </span>\n      );\n    }\n\n    return (\n      <Component data-tid={LinkDataTids.root} {...rest} {...linkProps}>\n        {leftIconElement}\n        {child}\n        {rightIconElement}\n        {arrow}\n      </Component>\n    );\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      globalObject.requestAnimationFrame?.(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({ focusedByTab: false });\n  };\n\n  private handleClick = (event: React.MouseEvent<HTMLAnchorElement>) => {\n    const { onClick, disabled, loading } = this.props;\n    const href = this.getProps().href;\n    if (!href) {\n      event.preventDefault();\n    }\n    if (onClick && !disabled && !loading) {\n      onClick(event);\n    }\n  };\n\n  private getLinkClassName(focused: boolean, disabled: boolean, _isTheme2022: boolean): string {\n    const { use } = this.getProps();\n    const isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;\n    const isFocused = focused && !disabled;\n\n    return !isBorderBottom\n      ? cx(\n          styles.root(this.theme),\n          isFocused && styles.focus(this.theme),\n          disabled && styles.disabled(this.theme),\n          use === 'grayed' && focused && styles.useGrayedFocus(this.theme),\n        )\n      : cx(\n          styles.lineRoot(),\n          disabled && styles.disabled(this.theme),\n          disabled && _isTheme2022 && isDarkTheme(this.theme) && styles.disabledDark22Theme(this.theme),\n          isFocused && use === 'default' && styles.lineFocus(this.theme),\n          isFocused && use === 'success' && styles.lineFocusSuccess(this.theme),\n          isFocused && use === 'danger' && styles.lineFocusDanger(this.theme),\n          isFocused && use === 'grayed' && styles.lineFocusGrayed(this.theme),\n          isFocused && _isTheme2022 && this.linkFocusOutline && styles.focus2022(this.theme),\n        );\n  }\n}\n"]}

package/components/Link/Link.d.ts

@@ -1,9 +1,9 @@
-import React from 'react';
+import React, { AriaAttributes } from 'react';
 import PropTypes from 'prop-types';
 import { Override } from '../../typings/utility-types';
 import { ThemeIn } from '../../lib/theming/Theme';
 import { CommonProps } from '../../internal/CommonWrapper';
-export interface LinkProps extends CommonProps, Override<React.AnchorHTMLAttributes<HTMLAnchorElement>, {
+export interface LinkProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps, Override<React.AnchorHTMLAttributes<HTMLAnchorElement>, {
     /**
      * Отключенное состояние.
      */
@@ -13,9 +13,13 @@ export interface LinkProps extends CommonProps, Override<React.AnchorHTMLAttribu
      */
     href?: string;
     /**
-     * Добавляет ссылке иконку.
+     * Добавляет ссылке иконку слева.
      */
-    icon?: React.ReactElement<any>;
+    icon?: React.ReactElement;
+    /**
+     * Добавляет ссылке иконку справа.
+     */
+    rightIcon?: React.ReactElement;
     /**
      * Тема ссылки.
      */
@@ -68,6 +72,7 @@ declare type DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;
  */
 export declare class Link extends React.Component<LinkProps, LinkState> {
     static __KONTUR_REACT_UI__: string;
+    static displayName: string;
     static propTypes: {
         disabled: PropTypes.Requireable<boolean>;
         href: PropTypes.Requireable<string>;
@@ -79,6 +84,7 @@ export declare class Link extends React.Component<LinkProps, LinkState> {
     state: LinkState;
     private theme;
     private setRootNode;
+    private linkFocusOutline?;
     render(): JSX.Element;
     private renderMain;
     private handleFocus;