@skbkontur/react-ui 0.0.0-ecefada396 → 0.0.0-ee57da3e1e

package/cjs/components/Kebab/Kebab.md

@@ -7,9 +7,7 @@ import { Gapped, MenuItem, Toast } from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',
@@ -55,9 +53,7 @@ import { Gapped, MenuItem, Toast} from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',
@@ -97,15 +93,14 @@ import { MenuItem, Toast } from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',
   width: 250,
 };
 
+
 let Card = ({ title }) => (
   <div style={style}>
     <div>
@@ -135,9 +130,7 @@ import { MenuItem, Toast } from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',
@@ -176,9 +169,7 @@ import { MenuItem, Toast } from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',
@@ -214,9 +205,7 @@ import { MenuItem, Toast } from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',
@@ -252,9 +241,7 @@ import { MenuItem, Toast } from '@skbkontur/react-ui';
 
 let style = {
   alignItems: 'center',
-  background: 'white',
   border: '1px solid #dfdede',
-  color: '#333',
   display: 'flex',
   justifyContent: 'space-between',
   padding: '0 20px',

package/cjs/components/Kebab/Kebab.styles.d.ts

@@ -1,12 +1,16 @@
 import { Theme } from '../../lib/theming/Theme';
 export declare const styles: {
     kebab(t: Theme): string;
+    kebabSmall(t: Theme): string;
+    kebabMedium(t: Theme): string;
+    kebabLarge(t: Theme): string;
+    kebab2022(): string;
     focused(t: Theme): string;
     opened(t: Theme): string;
     disabled(): string;
-    icon(): string;
-    iconsmall(): string;
-    iconmedium(): string;
-    iconlarge(): string;
+    icon(t: Theme): string;
+    iconsmall(t: Theme): string;
+    iconmedium(t: Theme): string;
+    iconlarge(t: Theme): string;
     menu(t: Theme): string;
 };

package/cjs/components/Kebab/Kebab.styles.js

@@ -1,9 +1,9 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
 
 
 var styles = (0, _Emotion.memoizeStyle)({
   kebab: function kebab(t) {
-    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      text-align: center;\n      border: ", ";\n      box-sizing: border-box;\n      border-radius: ", ";\n      user-select: none;\n      cursor: pointer;\n      outline: 0;\n      transition: background 0.12s ease-out;\n      width: 26px;\n      height: 26px;\n      background: ", ";\n\n      &:hover {\n        background: ", ";\n      }\n    "])),
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      text-align: center;\n      border: ", ";\n      box-sizing: border-box;\n      border-radius: ", ";\n      user-select: none;\n      cursor: pointer;\n      outline: 0;\n      transition: background 0.12s ease-out;\n      background: ", ";\n\n      &:hover {\n        background: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])),
 
 
     t.kebabBorder,
@@ -13,32 +13,63 @@ var styles = (0, _Emotion.memoizeStyle)({
 
 
 
+    t.kebabBackground,
 
 
-    t.kebabBackground,
+    t.kebabBackgroundHover,
+
+
+
+    t.kebabBackgroundActive);
+
+
+  },
+
+  kebabSmall: function kebabSmall(t) {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n    "])),
+    t.kebabSizeSmall,
+    t.kebabSizeSmall);
+
+  },
+
+  kebabMedium: function kebabMedium(t) {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n    "])),
+    t.kebabSizeMedium,
+    t.kebabSizeMedium);
+
+  },
+
+  kebabLarge: function kebabLarge(t) {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n    "])),
+    t.kebabSizeLarge,
+    t.kebabSizeLarge);
+
+  },
+
+  kebab2022: function kebab2022() {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n    "])));
 
 
-    t.kebabBackgroundHover);
 
 
   },
 
   focused: function focused(t) {
-    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-color: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", ";\n      border-color: ", ";\n    "])),
     t.kebabBackgroundHover,
     t.borderColorFocus);
 
   },
 
   opened: function opened(t) {
-    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", " !important; // override kebab:hover style\n      cursor: default;\n    "])),
-    t.kebabBackgroundHover);
+    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background: ", " !important; // override kebab:hover style\n      cursor: default;\n    "])),
+    t.kebabBackgroundActive);
 
 
   },
 
   disabled: function disabled() {
-    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: default;\n\n      &:hover {\n        background: none;\n      }\n    "])));
+    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      cursor: default;\n\n      &:hover {\n        background: none;\n      }\n    "])));
 
 
 
@@ -47,38 +78,38 @@ var styles = (0, _Emotion.memoizeStyle)({
 
   },
 
-  icon: function icon() {
-    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: #757575;\n      line-height: 1;\n    "])));
-
+  icon: function icon(t) {
+    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      color: ", ";\n      line-height: 1;\n    "])),
+    t.kebabIconColor);
 
 
   },
 
-  iconsmall: function iconsmall() {
-    return (0, _Emotion.css)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: 2px;\n      font-size: 14px;\n    "])));
-
+  iconsmall: function iconsmall(t) {
+    return (0, _Emotion.css)(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: 2px;\n      font-size: ", ";\n    "])),
 
+    t.kebabIconSizeSmall);
 
   },
 
-  iconmedium: function iconmedium() {
-    return (0, _Emotion.css)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: -1px;\n      margin-left: 0.5px;\n      font-size: 18px;\n    "])));
-
+  iconmedium: function iconmedium(t) {
+    return (0, _Emotion.css)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: -1px;\n      margin-left: 0.5px;\n      font-size: ", ";\n    "])),
 
 
+    t.kebabIconSizeMedium);
 
   },
 
-  iconlarge: function iconlarge() {
-    return (0, _Emotion.css)(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: -2px;\n      margin-left: 1px;\n      font-size: 20px;\n    "])));
-
+  iconlarge: function iconlarge(t) {
+    return (0, _Emotion.css)(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: -2px;\n      margin-left: 1px;\n      font-size: ", ";\n    "])),
 
 
+    t.kebabIconSizeLarge);
 
   },
 
   menu: function menu(t) {
-    return (0, _Emotion.css)(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n      overflow: hidden;\n      border-radius: ", ";\n    "])),
+    return (0, _Emotion.css)(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      overflow: hidden;\n      border-radius: ", ";\n    "])),
 
     t.popupBorderRadius);
 

package/cjs/components/Kebab/Kebab.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Kebab.styles.ts"],"names":["styles","kebab","t","css","kebabBorder","kebabBorderRadius","kebabBackground","kebabBackgroundHover","focused","borderColorFocus","opened","disabled","icon","iconsmall","iconmedium","iconlarge","menu","popupBorderRadius"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,iBAC3BC,CAD2B,EACjB;AACd,eAAOC,YAAP;;;AAGYD,IAAAA,CAAC,CAACE,WAHd;;AAKmBF,IAAAA,CAAC,CAACG,iBALrB;;;;;;;AAYgBH,IAAAA,CAAC,CAACI,eAZlB;;;AAekBJ,IAAAA,CAAC,CAACK,oBAfpB;;;AAkBD,GApBgC;;AAsBjCC,EAAAA,OAtBiC,mBAsBzBN,CAtByB,EAsBf;AAChB,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACK,oBADlB;AAEkBL,IAAAA,CAAC,CAACO,gBAFpB;;AAID,GA3BgC;;AA6BjCC,EAAAA,MA7BiC,kBA6B1BR,CA7B0B,EA6BhB;AACf,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACK,oBADlB;;;AAID,GAlCgC;;AAoCjCI,EAAAA,QApCiC,sBAoCtB;AACT,eAAOR,YAAP;;;;;;;AAOD,GA5CgC;;AA8CjCS,EAAAA,IA9CiC,kBA8C1B;AACL,eAAOT,YAAP;;;;AAID,GAnDgC;;AAqDjCU,EAAAA,SArDiC,uBAqDrB;AACV,eAAOV,YAAP;;;;AAID,GA1DgC;;AA4DjCW,EAAAA,UA5DiC,wBA4DpB;AACX,eAAOX,YAAP;;;;;AAKD,GAlEgC;;AAoEjCY,EAAAA,SApEiC,uBAoErB;AACV,eAAOZ,YAAP;;;;;AAKD,GA1EgC;;AA4EjCa,EAAAA,IA5EiC,gBA4E5Bd,CA5E4B,EA4ElB;AACb,eAAOC,YAAP;;AAEmBD,IAAAA,CAAC,CAACe,iBAFrB;;AAID,GAjFgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  kebab(t: Theme) {\n    return css`\n      display: inline-block;\n      text-align: center;\n      border: ${t.kebabBorder};\n      box-sizing: border-box;\n      border-radius: ${t.kebabBorderRadius};\n      user-select: none;\n      cursor: pointer;\n      outline: 0;\n      transition: background 0.12s ease-out;\n      width: 26px;\n      height: 26px;\n      background: ${t.kebabBackground};\n\n      &:hover {\n        background: ${t.kebabBackgroundHover};\n      }\n    `;\n  },\n\n  focused(t: Theme) {\n    return css`\n      background: ${t.kebabBackgroundHover};\n      border-color: ${t.borderColorFocus};\n    `;\n  },\n\n  opened(t: Theme) {\n    return css`\n      background: ${t.kebabBackgroundHover} !important; // override kebab:hover style\n      cursor: default;\n    `;\n  },\n\n  disabled() {\n    return css`\n      cursor: default;\n\n      &:hover {\n        background: none;\n      }\n    `;\n  },\n\n  icon() {\n    return css`\n      color: #757575;\n      line-height: 1;\n    `;\n  },\n\n  iconsmall() {\n    return css`\n      margin-top: 2px;\n      font-size: 14px;\n    `;\n  },\n\n  iconmedium() {\n    return css`\n      margin-top: -1px;\n      margin-left: 0.5px;\n      font-size: 18px;\n    `;\n  },\n\n  iconlarge() {\n    return css`\n      margin-top: -2px;\n      margin-left: 1px;\n      font-size: 20px;\n    `;\n  },\n\n  menu(t: Theme) {\n    return css`\n      overflow: hidden;\n      border-radius: ${t.popupBorderRadius};\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["Kebab.styles.ts"],"names":["styles","kebab","t","css","kebabBorder","kebabBorderRadius","kebabBackground","kebabBackgroundHover","kebabBackgroundActive","kebabSmall","kebabSizeSmall","kebabMedium","kebabSizeMedium","kebabLarge","kebabSizeLarge","kebab2022","focused","borderColorFocus","opened","disabled","icon","kebabIconColor","iconsmall","kebabIconSizeSmall","iconmedium","kebabIconSizeMedium","iconlarge","kebabIconSizeLarge","menu","popupBorderRadius"],"mappings":"4QAAA,oD;;;AAGO,IAAMA,MAAM,GAAG,2BAAa;AACjCC,EAAAA,KADiC,iBAC3BC,CAD2B,EACjB;AACd,eAAOC,YAAP;;;AAGYD,IAAAA,CAAC,CAACE,WAHd;;AAKmBF,IAAAA,CAAC,CAACG,iBALrB;;;;;AAUgBH,IAAAA,CAAC,CAACI,eAVlB;;;AAakBJ,IAAAA,CAAC,CAACK,oBAbpB;;;;AAiBkBL,IAAAA,CAAC,CAACM,qBAjBpB;;;AAoBD,GAtBgC;;AAwBjCC,EAAAA,UAxBiC,sBAwBtBP,CAxBsB,EAwBZ;AACnB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACQ,cADb;AAEYR,IAAAA,CAAC,CAACQ,cAFd;;AAID,GA7BgC;;AA+BjCC,EAAAA,WA/BiC,uBA+BrBT,CA/BqB,EA+BX;AACpB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACU,eADb;AAEYV,IAAAA,CAAC,CAACU,eAFd;;AAID,GApCgC;;AAsCjCC,EAAAA,UAtCiC,sBAsCtBX,CAtCsB,EAsCZ;AACnB,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACY,cADb;AAEYZ,IAAAA,CAAC,CAACY,cAFd;;AAID,GA3CgC;;AA6CjCC,EAAAA,SA7CiC,uBA6CrB;AACV,eAAOZ,YAAP;;;;;AAKD,GAnDgC;;AAqDjCa,EAAAA,OArDiC,mBAqDzBd,CArDyB,EAqDf;AAChB,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACK,oBADlB;AAEkBL,IAAAA,CAAC,CAACe,gBAFpB;;AAID,GA1DgC;;AA4DjCC,EAAAA,MA5DiC,kBA4D1BhB,CA5D0B,EA4DhB;AACf,eAAOC,YAAP;AACgBD,IAAAA,CAAC,CAACM,qBADlB;;;AAID,GAjEgC;;AAmEjCW,EAAAA,QAnEiC,sBAmEtB;AACT,eAAOhB,YAAP;;;;;;;AAOD,GA3EgC;;AA6EjCiB,EAAAA,IA7EiC,gBA6E5BlB,CA7E4B,EA6ElB;AACb,eAAOC,YAAP;AACWD,IAAAA,CAAC,CAACmB,cADb;;;AAID,GAlFgC;;AAoFjCC,EAAAA,SApFiC,qBAoFvBpB,CApFuB,EAoFb;AAClB,eAAOC,YAAP;;AAEeD,IAAAA,CAAC,CAACqB,kBAFjB;;AAID,GAzFgC;;AA2FjCC,EAAAA,UA3FiC,sBA2FtBtB,CA3FsB,EA2FZ;AACnB,eAAOC,YAAP;;;AAGeD,IAAAA,CAAC,CAACuB,mBAHjB;;AAKD,GAjGgC;;AAmGjCC,EAAAA,SAnGiC,qBAmGvBxB,CAnGuB,EAmGb;AAClB,eAAOC,YAAP;;;AAGeD,IAAAA,CAAC,CAACyB,kBAHjB;;AAKD,GAzGgC;;AA2GjCC,EAAAA,IA3GiC,gBA2G5B1B,CA3G4B,EA2GlB;AACb,eAAOC,YAAP;;AAEmBD,IAAAA,CAAC,CAAC2B,iBAFrB;;AAID,GAhHgC,EAAb,CAAf,C","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  kebab(t: Theme) {\n    return css`\n      display: inline-block;\n      text-align: center;\n      border: ${t.kebabBorder};\n      box-sizing: border-box;\n      border-radius: ${t.kebabBorderRadius};\n      user-select: none;\n      cursor: pointer;\n      outline: 0;\n      transition: background 0.12s ease-out;\n      background: ${t.kebabBackground};\n\n      &:hover {\n        background: ${t.kebabBackgroundHover};\n      }\n\n      &:active {\n        background: ${t.kebabBackgroundActive};\n      }\n    `;\n  },\n\n  kebabSmall(t: Theme) {\n    return css`\n      width: ${t.kebabSizeSmall};\n      height: ${t.kebabSizeSmall};\n    `;\n  },\n\n  kebabMedium(t: Theme) {\n    return css`\n      width: ${t.kebabSizeMedium};\n      height: ${t.kebabSizeMedium};\n    `;\n  },\n\n  kebabLarge(t: Theme) {\n    return css`\n      width: ${t.kebabSizeLarge};\n      height: ${t.kebabSizeLarge};\n    `;\n  },\n\n  kebab2022() {\n    return css`\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n    `;\n  },\n\n  focused(t: Theme) {\n    return css`\n      background: ${t.kebabBackgroundHover};\n      border-color: ${t.borderColorFocus};\n    `;\n  },\n\n  opened(t: Theme) {\n    return css`\n      background: ${t.kebabBackgroundActive} !important; // override kebab:hover style\n      cursor: default;\n    `;\n  },\n\n  disabled() {\n    return css`\n      cursor: default;\n\n      &:hover {\n        background: none;\n      }\n    `;\n  },\n\n  icon(t: Theme) {\n    return css`\n      color: ${t.kebabIconColor};\n      line-height: 1;\n    `;\n  },\n\n  iconsmall(t: Theme) {\n    return css`\n      margin-top: 2px;\n      font-size: ${t.kebabIconSizeSmall};\n    `;\n  },\n\n  iconmedium(t: Theme) {\n    return css`\n      margin-top: -1px;\n      margin-left: 0.5px;\n      font-size: ${t.kebabIconSizeMedium};\n    `;\n  },\n\n  iconlarge(t: Theme) {\n    return css`\n      margin-top: -2px;\n      margin-left: 1px;\n      font-size: ${t.kebabIconSizeLarge};\n    `;\n  },\n\n  menu(t: Theme) {\n    return css`\n      overflow: hidden;\n      border-radius: ${t.popupBorderRadius};\n    `;\n  },\n});\n"]}

package/cjs/components/Kebab/KebabIcon.d.ts

@@ -0,0 +1,3 @@
+export declare const KebabIcon: import("../../lib/forwardRefAndName").ReactUIIconWithRef<SVGSVGElement, Omit<import("../../internal/icons2022/BaseIcon").IconProps, "size"> & {
+    size?: number | "small" | "medium" | "large" | undefined;
+}>;

package/cjs/components/Kebab/KebabIcon.js

@@ -0,0 +1,15 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.KebabIcon = void 0;
+var _react = _interopRequireDefault(require("react"));
+
+var _iconSizer = require("../../internal/icons2022/iconSizer");
+var _UiMenuDotsThreeVIcon16Light = require("../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon16Light");
+var _UiMenuDotsThreeVIcon20Regular = require("../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon20Regular");
+var _UiMenuDotsThreeVIcon24Regular = require("../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon24Regular"); /* eslint-disable react/display-name */
+
+var KebabIcon = (0, _iconSizer.iconSizer)(
+{
+  small: function small() {return /*#__PURE__*/_react.default.createElement(_UiMenuDotsThreeVIcon16Light.UiMenuDotsThreeVIcon16Light, null);},
+  medium: function medium() {return /*#__PURE__*/_react.default.createElement(_UiMenuDotsThreeVIcon20Regular.UiMenuDotsThreeVIcon20Regular, null);},
+  large: function large() {return /*#__PURE__*/_react.default.createElement(_UiMenuDotsThreeVIcon24Regular.UiMenuDotsThreeVIcon24Regular, null);} },
+
+'KebabIcon');exports.KebabIcon = KebabIcon;

package/cjs/components/Kebab/KebabIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["KebabIcon.tsx"],"names":["KebabIcon","small","medium","large"],"mappings":";AACA;;AAEA;AACA;AACA;AACA,4H,CANA;;AAQO,IAAMA,SAAS,GAAG;AACvB;AACEC,EAAAA,KAAK,EAAE,sCAAM,6BAAC,wDAAD,OAAN,EADT;AAEEC,EAAAA,MAAM,EAAE,uCAAM,6BAAC,4DAAD,OAAN,EAFV;AAGEC,EAAAA,KAAK,EAAE,sCAAM,6BAAC,4DAAD,OAAN,EAHT,EADuB;;AAMvB,WANuB,CAAlB,C","sourcesContent":["/* eslint-disable react/display-name */\nimport React from 'react';\n\nimport { iconSizer } from '../../internal/icons2022/iconSizer';\nimport { UiMenuDotsThreeVIcon16Light } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon16Light';\nimport { UiMenuDotsThreeVIcon20Regular } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon20Regular';\nimport { UiMenuDotsThreeVIcon24Regular } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon24Regular';\n\nexport const KebabIcon = iconSizer(\n  {\n    small: () => <UiMenuDotsThreeVIcon16Light />,\n    medium: () => <UiMenuDotsThreeVIcon20Regular />,\n    large: () => <UiMenuDotsThreeVIcon24Regular />,\n  },\n  'KebabIcon',\n);\n"]}

package/cjs/components/Link/Link.d.ts

@@ -1,6 +1,7 @@
 import React 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>, {
     /**
@@ -39,11 +40,29 @@ export interface LinkProps extends CommonProps, Override<React.AnchorHTMLAttribu
      * HTML-событие `onclick`.
      */
     onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * Обычный объект с переменными темы.
+     * Он будет объединён с темой из контекста.
+     */
+    theme?: ThemeIn;
+    /**
+     * Компонент, используемый в качестве корневого узла.
+     * @ignore
+     */
+    as?: React.ElementType | keyof React.ReactHTML;
+    /**
+     * @ignore
+     */
+    focused?: boolean;
 }> {
 }
 export interface LinkState {
     focusedByTab: boolean;
 }
+export declare const LinkDataTids: {
+    readonly root: "Link__root";
+};
+declare type DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;
 /**
  * Элемент ссылки из HTML.
  */
@@ -52,20 +71,19 @@ export declare class Link extends React.Component<LinkProps, LinkState> {
     static propTypes: {
         disabled: PropTypes.Requireable<boolean>;
         href: PropTypes.Requireable<string>;
-        icon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
+        icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
         use: PropTypes.Requireable<string>;
     };
-    static defaultProps: {
-        href: string;
-        use: string;
-    };
-    state: {
-        focusedByTab: boolean;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
+    state: LinkState;
     private theme;
+    private setRootNode;
     render(): JSX.Element;
     private renderMain;
-    private _handleFocus;
-    private _handleBlur;
-    private _handleClick;
+    private handleFocus;
+    private handleBlur;
+    private handleClick;
+    private getLinkClassName;
 }
+export {};

package/cjs/components/Link/Link.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Link = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.LinkDataTids = exports.Link = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 
@@ -9,8 +9,12 @@ var _utils = require("../../lib/utils");
 var _Spinner = require("../Spinner");
 var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode = require("../../lib/rootNode");
+var _createPropsGetter = require("../../lib/createPropsGetter");
+var _ThemeFactory = require("../../lib/theming/ThemeFactory");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
 
-var _Link = require("./Link.styles");
+var _Link = require("./Link.styles");var _excluded = ["disabled", "href", "icon", "use", "loading", "_button", "_buttonOpened", "rel", "as", "focused"];var _class, _class2, _temp;
 
 
 
@@ -55,6 +59,28 @@ var _Link = require("./Link.styles");
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var LinkDataTids = {
+  root: 'Link__root' };exports.LinkDataTids = LinkDataTids;
 
 
 
@@ -63,7 +89,8 @@ var _Link = require("./Link.styles");
 /**
  * Элемент ссылки из HTML.
  */var
-Link = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Link, _React$Component);function Link() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+Link = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Link, _React$Component);function Link() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
 
@@ -81,11 +108,13 @@ Link = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Li
 
 
 
+
+    getProps = (0, _createPropsGetter.createPropsGetter)(Link.defaultProps);_this.
+
     state = {
       focusedByTab: false };_this.
 
 
-    theme = void 0;_this.
 
 
 
@@ -97,8 +126,28 @@ Link = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Li
 
 
 
-    renderMain = function (props) {var _cx;var
-      disabled = props.disabled,href = props.href,icon = props.icon,use = props.use,loading = props.loading,_button = props._button,_buttonOpened = props._buttonOpened,relOrigin = props.rel,rest = (0, _objectWithoutPropertiesLoose2.default)(props, ["disabled", "href", "icon", "use", "loading", "_button", "_buttonOpened", "rel"]);
+
+
+
+
+
+
+
+    renderMain = function (props) {
+      var
+      disabled =
+
+
+
+
+
+
+
+
+
+
+      props.disabled,href = props.href,icon = props.icon,use = props.use,loading = props.loading,_button = props._button,_buttonOpened = props._buttonOpened,relOrigin = props.rel,Component = props.as,_props$focused = props.focused,focused = _props$focused === void 0 ? false : _props$focused,rest = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+      var _isTheme2022 = (0, _ThemeHelpers.isTheme2022)(_this.theme);
 
       var iconElement = null;
       if (icon) {
@@ -117,39 +166,41 @@ Link = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Li
         rel = "noopener" + ((0, _utils.isExternalLink)(href) ? ' noreferrer' : '');
       }
 
-      var focused = !disabled && _this.state.focusedByTab;
+      var isFocused = !disabled && (_this.state.focusedByTab || focused);
 
       var linkProps = {
-        className: (0, _Emotion.cx)((_cx = {}, _cx[
-        _Link.styles.root(_this.theme)] = true, _cx[
-        _Link.styles.button(_this.theme)] = !!_button, _cx[
-        _Link.styles.buttonOpened()] = !!_buttonOpened, _cx[
-        _Link.styles.useDefault(_this.theme)] = use === 'default', _cx[
-        _Link.styles.useSuccess(_this.theme)] = use === 'success', _cx[
-        _Link.styles.useDanger(_this.theme)] = use === 'danger', _cx[
-        _Link.styles.useGrayed(_this.theme)] = use === 'grayed', _cx[
-        _Link.styles.useGrayedFocus(_this.theme)] = use === 'grayed' && focused, _cx[
-        _Link.styles.focus(_this.theme)] = focused, _cx[
-        _Link.styles.disabled(_this.theme)] = !!disabled || !!loading, _cx)),
+        className: (0, _Emotion.cx)(
+        use === 'default' && _Link.styles.useDefault(_this.theme),
+        use === 'success' && _Link.styles.useSuccess(_this.theme),
+        use === 'danger' && _Link.styles.useDanger(_this.theme),
+        use === 'grayed' && _Link.styles.useGrayed(_this.theme),
+        !!_button && _Link.styles.button(_this.theme),
+        !!_buttonOpened && _Link.styles.buttonOpened(_this.theme),
+        _this.getLinkClassName(isFocused, Boolean(disabled || loading))),
 
         href: href,
         rel: rel,
-        onClick: _this._handleClick,
-        onFocus: _this._handleFocus,
-        onBlur: _this._handleBlur,
+        onClick: _this.handleClick,
+        onFocus: _this.handleFocus,
+        onBlur: _this.handleBlur,
         tabIndex: disabled || loading ? -1 : _this.props.tabIndex };
 
 
+      var child = _this.props.children;
+      if (_isTheme2022) {
+        child = /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_Link.globalClasses.text, _Link.styles.lineText(_this.theme)) }, _this.props.children);
+      }
+
       return /*#__PURE__*/(
-        _react.default.createElement("a", (0, _extends2.default)({}, rest, linkProps),
+        _react.default.createElement(Component, (0, _extends2.default)({ "data-tid": LinkDataTids.root }, rest, linkProps),
         iconElement,
-        _this.props.children,
+        child,
         arrow));
 
 
     };_this.
 
-    _handleFocus = function (event) {
+    handleFocus = function () {
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
@@ -161,16 +212,39 @@ Link = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Li
       }
     };_this.
 
-    _handleBlur = function () {
+    handleBlur = function () {
       _this.setState({ focusedByTab: false });
     };_this.
 
-    _handleClick = function (event) {var _this$props =
-      _this.props,href = _this$props.href,onClick = _this$props.onClick,disabled = _this$props.disabled,loading = _this$props.loading;
+    handleClick = function (event) {
+      var _this$props = _this.props,onClick = _this$props.onClick,disabled = _this$props.disabled,loading = _this$props.loading;
+      var href = _this.getProps().href;
       if (!href) {
         event.preventDefault();
       }
       if (onClick && !disabled && !loading) {
         onClick(event);
       }
-    };return _this;}var _proto = Link.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, _this2.props, _this2.renderMain);});};return Link;}(_react.default.Component);exports.Link = Link;Link.__KONTUR_REACT_UI__ = 'Link';Link.propTypes = { disabled: _propTypes.default.bool, href: _propTypes.default.string, icon: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]), use: _propTypes.default.oneOf(['default', 'success', 'danger', 'grayed']) };Link.defaultProps = { href: '', use: 'default' };
+    };return _this;}var _proto = Link.prototype;_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = _this2.props.theme ? _ThemeFactory.ThemeFactory.create(_this2.props.theme, theme) : theme;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: _this2.setRootNode }, _this2.getProps()), _this2.renderMain);});};_proto.
+
+  getLinkClassName = function getLinkClassName(focused, disabled) {
+    var _this$getProps = this.getProps(),use = _this$getProps.use;
+    var isBorderBottom = parseInt(this.theme.linkLineBorderBottomWidth) > 0;
+    var isFocused = focused && !disabled;
+
+    return !isBorderBottom ?
+    (0, _Emotion.cx)(
+    _Link.styles.root(this.theme),
+    isFocused && _Link.styles.focus(this.theme),
+    disabled && _Link.styles.disabled(this.theme),
+    use === 'grayed' && focused && _Link.styles.useGrayedFocus(this.theme)) :
+
+    (0, _Emotion.cx)(
+    _Link.styles.lineRoot(),
+    disabled && _Link.styles.disabled(this.theme),
+    isFocused && use === 'default' && _Link.styles.lineFocus(this.theme),
+    isFocused && use === 'success' && _Link.styles.lineFocusSuccess(this.theme),
+    isFocused && use === 'danger' && _Link.styles.lineFocusDanger(this.theme),
+    isFocused && use === 'grayed' && _Link.styles.lineFocusGrayed(this.theme));
+
+  };return Link;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Link', _class2.propTypes = { disabled: _propTypes.default.bool, href: _propTypes.default.string, icon: _propTypes.default.node, use: _propTypes.default.oneOf(['default', 'success', 'danger', 'grayed']) }, _class2.defaultProps = { href: '', use: 'default', as: 'a' }, _temp)) || _class;exports.Link = Link;

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

@@ -1 +1 @@
-{"version":3,"sources":["Link.tsx"],"names":["Link","state","focusedByTab","theme","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","rest","iconElement","styles","arrow","focused","linkProps","className","root","button","buttonOpened","useDefault","useSuccess","useDanger","useGrayed","useGrayedFocus","focus","onClick","_handleClick","onFocus","_handleFocus","onBlur","_handleBlur","tabIndex","children","event","requestAnimationFrame","keyListener","isTabPressed","setState","preventDefault","render","React","Component","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","string","oneOfType","node","oneOf","defaultProps"],"mappings":"8bAAA;AACA;;;AAGA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkDA;AACA;AACA,G;AACaA,I;;;;;;;;;;;;;;;;;;AAkBJC,IAAAA,K,GAAQ;AACbC,MAAAA,YAAY,EAAE,KADD,E;;;AAIPC,IAAAA,K;;;;;;;;;;;;AAYAC,IAAAA,U,GAAa,UAACC,KAAD,EAA8C;AACzDC,MAAAA,QADyD,GAC+BD,KAD/B,CACzDC,QADyD,CAC/CC,IAD+C,GAC+BF,KAD/B,CAC/CE,IAD+C,CACzCC,IADyC,GAC+BH,KAD/B,CACzCG,IADyC,CACnCC,GADmC,GAC+BJ,KAD/B,CACnCI,GADmC,CAC9BC,OAD8B,GAC+BL,KAD/B,CAC9BK,OAD8B,CACrBC,OADqB,GAC+BN,KAD/B,CACrBM,OADqB,CACZC,aADY,GAC+BP,KAD/B,CACZO,aADY,CACQC,SADR,GAC+BR,KAD/B,CACGS,GADH,CACsBC,IADtB,+CAC+BV,KAD/B;;AAGjE,UAAIW,WAAW,GAAG,IAAlB;AACA,UAAIR,IAAJ,EAAU;AACRQ,QAAAA,WAAW;AACT,+CAAM,SAAS,EAAEC,aAAOT,IAAP,CAAY,MAAKL,KAAjB,CAAjB,IAA2CO,OAAO,gBAAG,6BAAC,gBAAD,IAAS,OAAO,EAAE,IAAlB,EAAwB,MAAM,MAA9B,EAA+B,MAAM,MAArC,GAAH,GAA8CF,IAAhG,CADF;;AAGD;;AAED,UAAIU,KAAK,GAAG,IAAZ;AACA,UAAIP,OAAJ,EAAa;AACXO,QAAAA,KAAK,gBAAG,uCAAM,SAAS,EAAED,aAAOC,KAAP,EAAjB,GAAR;AACD;;AAED,UAAIJ,GAAG,GAAGD,SAAV;AACA,UAAI,OAAOC,GAAP,KAAe,WAAf,IAA8BP,IAAlC,EAAwC;AACtCO,QAAAA,GAAG,iBAAc,2BAAeP,IAAf,IAAuB,aAAvB,GAAuC,EAArD,CAAH;AACD;;AAED,UAAMY,OAAO,GAAG,CAACb,QAAD,IAAa,MAAKL,KAAL,CAAWC,YAAxC;;AAEA,UAAMkB,SAAS,GAAG;AAChBC,QAAAA,SAAS,EAAE;AACRJ,qBAAOK,IAAP,CAAY,MAAKnB,KAAjB,CADQ,IACkB,IADlB;AAERc,qBAAOM,MAAP,CAAc,MAAKpB,KAAnB,CAFQ,IAEoB,CAAC,CAACQ,OAFtB;AAGRM,qBAAOO,YAAP,EAHQ,IAGgB,CAAC,CAACZ,aAHlB;AAIRK,qBAAOQ,UAAP,CAAkB,MAAKtB,KAAvB,CAJQ,IAIwBM,GAAG,KAAK,SAJhC;AAKRQ,qBAAOS,UAAP,CAAkB,MAAKvB,KAAvB,CALQ,IAKwBM,GAAG,KAAK,SALhC;AAMRQ,qBAAOU,SAAP,CAAiB,MAAKxB,KAAtB,CANQ,IAMuBM,GAAG,KAAK,QAN/B;AAORQ,qBAAOW,SAAP,CAAiB,MAAKzB,KAAtB,CAPQ,IAOuBM,GAAG,KAAK,QAP/B;AAQRQ,qBAAOY,cAAP,CAAsB,MAAK1B,KAA3B,CARQ,IAQ4BM,GAAG,KAAK,QAAR,IAAoBU,OARhD;AASRF,qBAAOa,KAAP,CAAa,MAAK3B,KAAlB,CATQ,IASmBgB,OATnB;AAURF,qBAAOX,QAAP,CAAgB,MAAKH,KAArB,CAVQ,IAUsB,CAAC,CAACG,QAAF,IAAc,CAAC,CAACI,OAVtC,OADK;;AAahBH,QAAAA,IAAI,EAAJA,IAbgB;AAchBO,QAAAA,GAAG,EAAHA,GAdgB;AAehBiB,QAAAA,OAAO,EAAE,MAAKC,YAfE;AAgBhBC,QAAAA,OAAO,EAAE,MAAKC,YAhBE;AAiBhBC,QAAAA,MAAM,EAAE,MAAKC,WAjBG;AAkBhBC,QAAAA,QAAQ,EAAE/B,QAAQ,IAAII,OAAZ,GAAsB,CAAC,CAAvB,GAA2B,MAAKL,KAAL,CAAWgC,QAlBhC,EAAlB;;;AAqBA;AACE,qEAAOtB,IAAP,EAAiBK,SAAjB;AACGJ,QAAAA,WADH;AAEG,cAAKX,KAAL,CAAWiC,QAFd;AAGGpB,QAAAA,KAHH,CADF;;;AAOD,K;;AAEOgB,IAAAA,Y,GAAe,UAACK,KAAD,EAAgD;AACrE,UAAI,CAAC,MAAKlC,KAAL,CAAWC,QAAhB,EAA0B;AACxB;AACA;AACAkC,QAAAA,qBAAqB,CAAC,YAAM;AAC1B,cAAIC,yBAAYC,YAAhB,EAA8B;AAC5B,kBAAKC,QAAL,CAAc,EAAEzC,YAAY,EAAE,IAAhB,EAAd;AACD;AACF,SAJoB,CAArB;AAKD;AACF,K;;AAEOkC,IAAAA,W,GAAc,YAAM;AAC1B,YAAKO,QAAL,CAAc,EAAEzC,YAAY,EAAE,KAAhB,EAAd;AACD,K;;AAEO8B,IAAAA,Y,GAAe,UAACO,KAAD,EAAgD;AACxB,YAAKlC,KADmB,CAC7DE,IAD6D,eAC7DA,IAD6D,CACvDwB,OADuD,eACvDA,OADuD,CAC9CzB,QAD8C,eAC9CA,QAD8C,CACpCI,OADoC,eACpCA,OADoC;AAErE,UAAI,CAACH,IAAL,EAAW;AACTgC,QAAAA,KAAK,CAACK,cAAN;AACD;AACD,UAAIb,OAAO,IAAI,CAACzB,QAAZ,IAAwB,CAACI,OAA7B,EAAsC;AACpCqB,QAAAA,OAAO,CAACQ,KAAD,CAAP;AACD;AACF,K,kDAvFMM,M,GAAP,kBAA6B,mBAC3B,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAAC1C,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,oBAAO,6BAAC,4BAAD,EAAmB,MAAI,CAACE,KAAxB,EAAgC,MAAI,CAACD,UAArC,CAAP,CACD,CAJH,CADF,CAQD,C,eAhCuB0C,eAAMC,S,sBAAnB/C,I,CACGgD,mB,GAAsB,M,CADzBhD,I,CAGGiD,S,GAAY,EACxB3C,QAAQ,EAAE4C,mBAAUC,IADI,EAGxB5C,IAAI,EAAE2C,mBAAUE,MAHQ,EAKxB5C,IAAI,EAAE0C,mBAAUG,SAAV,CAAoB,CAACH,mBAAUE,MAAX,EAAmBF,mBAAUI,IAA7B,CAApB,CALkB,EAOxB7C,GAAG,EAAEyC,mBAAUK,KAAV,CAAgB,CAAC,SAAD,EAAY,SAAZ,EAAuB,QAAvB,EAAiC,QAAjC,CAAhB,CAPmB,E,CAHfvD,I,CAaGwD,Y,GAAe,EAC3BjD,IAAI,EAAE,EADqB,EAE3BE,GAAG,EAAE,SAFsB,E","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 } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { 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\nexport interface LinkState {\n  focusedByTab: boolean;\n}\n\n/**\n * Элемент ссылки из HTML.\n */\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.oneOfType([PropTypes.string, PropTypes.node]),\n\n    use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']),\n  };\n\n  public static defaultProps = {\n    href: '',\n    use: 'default',\n  };\n\n  public state = {\n    focusedByTab: false,\n  };\n\n  private theme!: Theme;\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return <CommonWrapper {...this.props}>{this.renderMain}</CommonWrapper>;\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain = (props: CommonWrapperRestProps<LinkProps>) => {\n    const { disabled, href, icon, use, loading, _button, _buttonOpened, rel: relOrigin, ...rest } = props;\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 focused = !disabled && this.state.focusedByTab;\n\n    const linkProps = {\n      className: cx({\n        [styles.root(this.theme)]: true,\n        [styles.button(this.theme)]: !!_button,\n        [styles.buttonOpened()]: !!_buttonOpened,\n        [styles.useDefault(this.theme)]: use === 'default',\n        [styles.useSuccess(this.theme)]: use === 'success',\n        [styles.useDanger(this.theme)]: use === 'danger',\n        [styles.useGrayed(this.theme)]: use === 'grayed',\n        [styles.useGrayedFocus(this.theme)]: use === 'grayed' && focused,\n        [styles.focus(this.theme)]: focused,\n        [styles.disabled(this.theme)]: !!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    return (\n      <a {...rest} {...linkProps}>\n        {iconElement}\n        {this.props.children}\n        {arrow}\n      </a>\n    );\n  };\n\n  private _handleFocus = (event: React.FocusEvent<HTMLAnchorElement>) => {\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 { href, onClick, disabled, loading } = this.props;\n    if (!href) {\n      event.preventDefault();\n    }\n    if (onClick && !disabled && !loading) {\n      onClick(event);\n    }\n  };\n}\n"]}
+{"version":3,"sources":["Link.tsx"],"names":["LinkDataTids","root","Link","rootNode","getProps","defaultProps","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","Component","as","focused","rest","_isTheme2022","theme","iconElement","styles","arrow","isFocused","linkProps","className","useDefault","useSuccess","useDanger","useGrayed","button","buttonOpened","getLinkClassName","Boolean","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","tabIndex","child","children","globalClasses","text","lineText","requestAnimationFrame","keyListener","isTabPressed","setState","event","preventDefault","render","ThemeFactory","create","setRootNode","isBorderBottom","parseInt","linkLineBorderBottomWidth","focus","useGrayedFocus","lineRoot","lineFocus","lineFocusSuccess","lineFocusDanger","lineFocusGrayed","React","__KONTUR_REACT_UI__","propTypes","PropTypes","bool","string","node","oneOf"],"mappings":"qdAAA;AACA;;;AAGA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,qC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEO,IAAMA,YAAY,GAAG;AAC1BC,EAAAA,IAAI,EAAE,YADoB,EAArB,C;;;;;;AAOP;AACA;AACA,G;;AAEaC,I,OADZC,kB;;;;;;;;;;;;;;;;;;;AAoBSC,IAAAA,Q,GAAW,0CAAkBF,IAAI,CAACG,YAAvB,C;;AAEZC,IAAAA,K,GAAmB;AACxBC,MAAAA,YAAY,EAAE,KADU,E;;;;;;;;;;;;;;;;;;;;;AAsBlBC,IAAAA,U,GAAa,UAACC,KAAD,EAAyD;AAC5E;AACEC,MAAAA,QADF;;;;;;;;;;;AAYID,MAAAA,KAZJ,CACEC,QADF,CAEEC,IAFF,GAYIF,KAZJ,CAEEE,IAFF,CAGEC,IAHF,GAYIH,KAZJ,CAGEG,IAHF,CAIEC,GAJF,GAYIJ,KAZJ,CAIEI,GAJF,CAKEC,OALF,GAYIL,KAZJ,CAKEK,OALF,CAMEC,OANF,GAYIN,KAZJ,CAMEM,OANF,CAOEC,aAPF,GAYIP,KAZJ,CAOEO,aAPF,CAQOC,SARP,GAYIR,KAZJ,CAQES,GARF,CASMC,SATN,GAYIV,KAZJ,CASEW,EATF,kBAYIX,KAZJ,CAUEY,OAVF,CAUEA,OAVF,+BAUY,KAVZ,kBAWKC,IAXL,+CAYIb,KAZJ;AAaA,UAAMc,YAAY,GAAG,+BAAY,MAAKC,KAAjB,CAArB;;AAEA,UAAIC,WAAW,GAAG,IAAlB;AACA,UAAIb,IAAJ,EAAU;AACRa,QAAAA,WAAW;AACT,+CAAM,SAAS,EAAEC,aAAOd,IAAP,CAAY,MAAKY,KAAjB,CAAjB,IAA2CV,OAAO,gBAAG,6BAAC,gBAAD,IAAS,OAAO,EAAE,IAAlB,EAAwB,MAAM,MAA9B,EAA+B,MAAM,MAArC,GAAH,GAA8CF,IAAhG,CADF;;AAGD;;AAED,UAAIe,KAAK,GAAG,IAAZ;AACA,UAAIZ,OAAJ,EAAa;AACXY,QAAAA,KAAK,gBAAG,uCAAM,SAAS,EAAED,aAAOC,KAAP,EAAjB,GAAR;AACD;;AAED,UAAIT,GAAG,GAAGD,SAAV;AACA,UAAI,OAAOC,GAAP,KAAe,WAAf,IAA8BP,IAAlC,EAAwC;AACtCO,QAAAA,GAAG,iBAAc,2BAAeP,IAAf,IAAuB,aAAvB,GAAuC,EAArD,CAAH;AACD;;AAED,UAAMiB,SAAS,GAAG,CAAClB,QAAD,KAAc,MAAKJ,KAAL,CAAWC,YAAX,IAA2Bc,OAAzC,CAAlB;;AAEA,UAAMQ,SAAS,GAAG;AAChBC,QAAAA,SAAS,EAAE;AACTjB,QAAAA,GAAG,KAAK,SAAR,IAAqBa,aAAOK,UAAP,CAAkB,MAAKP,KAAvB,CADZ;AAETX,QAAAA,GAAG,KAAK,SAAR,IAAqBa,aAAOM,UAAP,CAAkB,MAAKR,KAAvB,CAFZ;AAGTX,QAAAA,GAAG,KAAK,QAAR,IAAoBa,aAAOO,SAAP,CAAiB,MAAKT,KAAtB,CAHX;AAITX,QAAAA,GAAG,KAAK,QAAR,IAAoBa,aAAOQ,SAAP,CAAiB,MAAKV,KAAtB,CAJX;AAKT,SAAC,CAACT,OAAF,IAAaW,aAAOS,MAAP,CAAc,MAAKX,KAAnB,CALJ;AAMT,SAAC,CAACR,aAAF,IAAmBU,aAAOU,YAAP,CAAoB,MAAKZ,KAAzB,CANV;AAOT,cAAKa,gBAAL,CAAsBT,SAAtB,EAAiCU,OAAO,CAAC5B,QAAQ,IAAII,OAAb,CAAxC,CAPS,CADK;;AAUhBH,QAAAA,IAAI,EAAJA,IAVgB;AAWhBO,QAAAA,GAAG,EAAHA,GAXgB;AAYhBqB,QAAAA,OAAO,EAAE,MAAKC,WAZE;AAahBC,QAAAA,OAAO,EAAE,MAAKC,WAbE;AAchBC,QAAAA,MAAM,EAAE,MAAKC,UAdG;AAehBC,QAAAA,QAAQ,EAAEnC,QAAQ,IAAII,OAAZ,GAAsB,CAAC,CAAvB,GAA2B,MAAKL,KAAL,CAAWoC,QAfhC,EAAlB;;;AAkBA,UAAIC,KAAK,GAAG,MAAKrC,KAAL,CAAWsC,QAAvB;AACA,UAAIxB,YAAJ,EAAkB;AAChBuB,QAAAA,KAAK,gBAAG,uCAAM,SAAS,EAAE,iBAAGE,oBAAcC,IAAjB,EAAuBvB,aAAOwB,QAAP,CAAgB,MAAK1B,KAArB,CAAvB,CAAjB,IAAuE,MAAKf,KAAL,CAAWsC,QAAlF,CAAR;AACD;;AAED;AACE,qCAAC,SAAD,2BAAW,YAAU/C,YAAY,CAACC,IAAlC,IAA4CqB,IAA5C,EAAsDO,SAAtD;AACGJ,QAAAA,WADH;AAEGqB,QAAAA,KAFH;AAGGnB,QAAAA,KAHH,CADF;;;AAOD,K;;AAEOe,IAAAA,W,GAAc,YAAM;AAC1B,UAAI,CAAC,MAAKjC,KAAL,CAAWC,QAAhB,EAA0B;AACxB;AACA;AACAyC,QAAAA,qBAAqB,CAAC,YAAM;AAC1B,cAAIC,yBAAYC,YAAhB,EAA8B;AAC5B,kBAAKC,QAAL,CAAc,EAAE/C,YAAY,EAAE,IAAhB,EAAd;AACD;AACF,SAJoB,CAArB;AAKD;AACF,K;;AAEOqC,IAAAA,U,GAAa,YAAM;AACzB,YAAKU,QAAL,CAAc,EAAE/C,YAAY,EAAE,KAAhB,EAAd;AACD,K;;AAEOiC,IAAAA,W,GAAc,UAACe,KAAD,EAAgD;AACpE,wBAAuC,MAAK9C,KAA5C,CAAQ8B,OAAR,eAAQA,OAAR,CAAiB7B,QAAjB,eAAiBA,QAAjB,CAA2BI,OAA3B,eAA2BA,OAA3B;AACA,UAAMH,IAAI,GAAG,MAAKP,QAAL,GAAgBO,IAA7B;AACA,UAAI,CAACA,IAAL,EAAW;AACT4C,QAAAA,KAAK,CAACC,cAAN;AACD;AACD,UAAIjB,OAAO,IAAI,CAAC7B,QAAZ,IAAwB,CAACI,OAA7B,EAAsC;AACpCyB,QAAAA,OAAO,CAACgB,KAAD,CAAP;AACD;AACF,K,kDA3GME,M,GAAP,kBAA6B,mBAC3B,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACjC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAa,MAAI,CAACf,KAAL,CAAWe,KAAX,GAAmBkC,2BAAaC,MAAb,CAAoB,MAAI,CAAClD,KAAL,CAAWe,KAA/B,EAA+CA,KAA/C,CAAnB,GAA2EA,KAAxF,CACA,oBACE,6BAAC,4BAAD,2BAAe,WAAW,EAAE,MAAI,CAACoC,WAAjC,IAAkD,MAAI,CAACxD,QAAL,EAAlD,GACG,MAAI,CAACI,UADR,CADF,CAKD,CARH,CADF,CAYD,C;;AAgGO6B,EAAAA,gB,GAAR,0BAAyBhB,OAAzB,EAA2CX,QAA3C,EAAsE;AACpE,yBAAgB,KAAKN,QAAL,EAAhB,CAAQS,GAAR,kBAAQA,GAAR;AACA,QAAMgD,cAAc,GAAGC,QAAQ,CAAC,KAAKtC,KAAL,CAAWuC,yBAAZ,CAAR,GAAiD,CAAxE;AACA,QAAMnC,SAAS,GAAGP,OAAO,IAAI,CAACX,QAA9B;;AAEA,WAAO,CAACmD,cAAD;AACH;AACEnC,iBAAOzB,IAAP,CAAY,KAAKuB,KAAjB,CADF;AAEEI,IAAAA,SAAS,IAAIF,aAAOsC,KAAP,CAAa,KAAKxC,KAAlB,CAFf;AAGEd,IAAAA,QAAQ,IAAIgB,aAAOhB,QAAP,CAAgB,KAAKc,KAArB,CAHd;AAIEX,IAAAA,GAAG,KAAK,QAAR,IAAoBQ,OAApB,IAA+BK,aAAOuC,cAAP,CAAsB,KAAKzC,KAA3B,CAJjC,CADG;;AAOH;AACEE,iBAAOwC,QAAP,EADF;AAEExD,IAAAA,QAAQ,IAAIgB,aAAOhB,QAAP,CAAgB,KAAKc,KAArB,CAFd;AAGEI,IAAAA,SAAS,IAAIf,GAAG,KAAK,SAArB,IAAkCa,aAAOyC,SAAP,CAAiB,KAAK3C,KAAtB,CAHpC;AAIEI,IAAAA,SAAS,IAAIf,GAAG,KAAK,SAArB,IAAkCa,aAAO0C,gBAAP,CAAwB,KAAK5C,KAA7B,CAJpC;AAKEI,IAAAA,SAAS,IAAIf,GAAG,KAAK,QAArB,IAAiCa,aAAO2C,eAAP,CAAuB,KAAK7C,KAA5B,CALnC;AAMEI,IAAAA,SAAS,IAAIf,GAAG,KAAK,QAArB,IAAiCa,aAAO4C,eAAP,CAAuB,KAAK9C,KAA5B,CANnC,CAPJ;;AAeD,G,eA7JuB+C,eAAMpD,S,WAChBqD,mB,GAAsB,M,UAEtBC,S,GAAY,EACxB/D,QAAQ,EAAEgE,mBAAUC,IADI,EAGxBhE,IAAI,EAAE+D,mBAAUE,MAHQ,EAKxBhE,IAAI,EAAE8D,mBAAUG,IALQ,EAOxBhE,GAAG,EAAE6D,mBAAUI,KAAV,CAAgB,CAAC,SAAD,EAAY,SAAZ,EAAuB,QAAvB,EAAiC,QAAjC,CAAhB,CAPmB,E,UAUZzE,Y,GAA6B,EACzCM,IAAI,EAAE,EADmC,EAEzCE,GAAG,EAAE,SAFoC,EAGzCO,EAAE,EAAE,GAHqC,E","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"]}

package/cjs/components/Link/Link.md

@@ -75,3 +75,14 @@ import { Toast } from '@skbkontur/react-ui';
 
 <Link onClick={() => Toast.push("Ты нажал на ссылку!")}>Ссылка с кастомным действием</Link>
 ```
+
+Пример ссылки с пропом `theme`
+
+```jsx harmony
+import { Link, Gapped } from '@skbkontur/react-ui';
+
+<Gapped>
+  <Link theme={{linkColor: '#C00000'}}>Ok</Link>
+  <Link>Ok</Link>
+</Gapped>
+```

package/cjs/components/Link/Link.mixins.d.ts

@@ -1,3 +1,5 @@
 export declare const linkMixin: (hoverTextDecoration: string) => string;
 export declare const linkDisabledMixin: () => string;
 export declare const linkUseColorsMixin: (mainColor: string, hoverColor: string, activeColor: string) => string;
+export declare const linkUseLineColorsMixin: (mainColor: string, activeColor: string) => string;
+export declare const linkUseLineColorsHoverMixin: (hoverColor: string, nestedSelector: string) => string;