@skbkontur/react-ui 4.9.1 → 4.9.2-theme2022.2

package/components/Input/InputLayout/InputLayoutAsideIcon/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/Input/InputLayout/InputLayoutAsideIcon.js",
+  "module": "InputLayoutAsideIcon",
+  "types": "../InputLayoutAsideIcon.d.ts",
+  "sideEffects": false
+}

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

@@ -0,0 +1,7 @@
+import React from 'react';
+import { InputProps } from '../Input';
+export interface InputLayoutAsideIconProps {
+    icon: InputProps['leftIcon'] | InputProps['rightIcon'];
+    side: 'left' | 'right';
+}
+export declare const InputLayoutAsideIcon: React.FunctionComponent<InputLayoutAsideIconProps>;

package/components/Input/InputLayout/InputLayoutAsideText/InputLayoutAsideText.js

@@ -0,0 +1,18 @@
+import React from 'react';
+import { cx } from "../../../../lib/theming/Emotion";
+import { ThemeContext } from "../../../../lib/theming/ThemeContext";
+import { InputLayoutContext } from "../InputLayoutContext";
+import { stylesLayout } from "../InputLayout.styles";
+export var InputLayoutAsideText = function InputLayoutAsideText(_ref) {
+  var _ref$text = _ref.text,
+      text = _ref$text === void 0 ? null : _ref$text;
+  var theme = React.useContext(ThemeContext);
+
+  var _React$useContext = React.useContext(InputLayoutContext),
+      disabled = _React$useContext.disabled;
+
+  var asideClassName = stylesLayout.aside();
+  return text && /*#__PURE__*/React.createElement("span", {
+    className: cx(asideClassName, stylesLayout.text(theme), disabled && stylesLayout.textDisabled(theme))
+  }, text);
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["InputLayoutAsideText.tsx"],"names":["React","cx","ThemeContext","InputLayoutContext","stylesLayout","InputLayoutAsideText","text","theme","useContext","disabled","asideClassName","aside","textDisabled"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,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,OAAqB,sBAAlBC,IAAkB,CAAlBA,IAAkB,0BAAX,IAAW;AAC3G,MAAMC,KAAK,GAAGP,KAAK,CAACQ,UAAN,CAAiBN,YAAjB,CAAd;AACA,0BAAqBF,KAAK,CAACQ,UAAN,CAAiBL,kBAAjB,CAArB,CAAQM,QAAR,qBAAQA,QAAR;;AAEA,MAAMC,cAAc,GAAGN,YAAY,CAACO,KAAb,EAAvB;;AAEA;AACEL,IAAAA,IAAI;AACF,kCAAM,SAAS,EAAEL,EAAE,CAACS,cAAD,EAAiBN,YAAY,CAACE,IAAb,CAAkBC,KAAlB,CAAjB,EAA2CE,QAAQ,IAAIL,YAAY,CAACQ,YAAb,CAA0BL,KAA1B,CAAvD,CAAnB;AACGD,IAAAA,IADH,CAFJ;;;;AAOD,CAbM","sourcesContent":["import React from 'react';\n\nimport { InputProps } from '../Input';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\n\nimport { InputLayoutContext } from './InputLayoutContext';\nimport { stylesLayout } from './InputLayout.styles';\n\nexport interface InputLayoutAsideTextProps {\n  text: InputProps['prefix'] | InputProps['suffix'];\n}\n\nexport const InputLayoutAsideText: React.FunctionComponent<InputLayoutAsideTextProps> = ({ text = null }) => {\n  const theme = React.useContext(ThemeContext);\n  const { disabled } = React.useContext(InputLayoutContext);\n\n  const asideClassName = stylesLayout.aside();\n\n  return (\n    text && (\n      <span className={cx(asideClassName, stylesLayout.text(theme), disabled && stylesLayout.textDisabled(theme))}>\n        {text}\n      </span>\n    )\n  );\n};\n"]}

package/components/Input/InputLayout/InputLayoutAsideText/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/Input/InputLayout/InputLayoutAsideText.js",
+  "module": "InputLayoutAsideText",
+  "types": "../InputLayoutAsideText.d.ts",
+  "sideEffects": false
+}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+import { InputProps } from '../Input';
+export interface InputLayoutAsideTextProps {
+    text: InputProps['prefix'] | InputProps['suffix'];
+}
+export declare const InputLayoutAsideText: React.FunctionComponent<InputLayoutAsideTextProps>;

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

@@ -0,0 +1,7 @@
+import React from 'react';
+export var InputLayoutContextDefault = {
+  focused: false,
+  disabled: false,
+  size: 'small'
+};
+export var InputLayoutContext = /*#__PURE__*/React.createContext(InputLayoutContextDefault);

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

@@ -0,0 +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"]}

package/components/Input/InputLayout/InputLayoutContext/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/Input/InputLayout/InputLayoutContext.js",
+  "module": "InputLayoutContext",
+  "types": "../InputLayoutContext.d.ts",
+  "sideEffects": false
+}

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

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

package/components/Input/InputLayout/PolyfillPlaceholder/PolyfillPlaceholder.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { cx } from "../../../../lib/theming/Emotion";
+import { ThemeContext } from "../../../../lib/theming/ThemeContext";
+import { styles } from "../../Input.styles";
+import { needsPolyfillPlaceholder } from "../../../../lib/needsPolyfillPlaceholder";
+import { InputLayoutContext } from "../InputLayoutContext";
+export var PolyfillPlaceholder = function PolyfillPlaceholder(_ref) {
+  var placeholder = _ref.placeholder,
+      align = _ref.align,
+      value = _ref.value,
+      defaultValue = _ref.defaultValue,
+      isMaskVisible = _ref.isMaskVisible;
+  var theme = React.useContext(ThemeContext);
+
+  var _React$useContext = React.useContext(InputLayoutContext),
+      focused = _React$useContext.focused,
+      disabled = _React$useContext.disabled;
+
+  var _placeholder = null;
+
+  if (needsPolyfillPlaceholder && placeholder && !isMaskVisible && !value && !defaultValue) {
+    var _cx;
+
+    _placeholder = /*#__PURE__*/React.createElement("div", {
+      className: cx(styles.placeholder(theme), (_cx = {}, _cx[styles.placeholderDisabled(theme)] = disabled, _cx[styles.placeholderFocus(theme)] = focused, _cx)),
+      style: {
+        textAlign: align || 'inherit'
+      }
+    }, placeholder);
+  }
+
+  return _placeholder;
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["PolyfillPlaceholder.tsx"],"names":["React","cx","ThemeContext","styles","needsPolyfillPlaceholder","InputLayoutContext","PolyfillPlaceholder","placeholder","align","value","defaultValue","isMaskVisible","theme","useContext","focused","disabled","_placeholder","placeholderDisabled","placeholderFocus","textAlign"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,SAASC,EAAT,QAAmB,8BAAnB;AACA,SAASC,YAAT,QAA6B,mCAA7B;AACA,SAASC,MAAT,QAAuB,iBAAvB;AACA,SAASC,wBAAT,QAAyC,uCAAzC;;AAEA,SAASC,kBAAT,QAAmC,sBAAnC;;;;;;;;;;AAUA,OAAO,IAAMC,mBAAyE,GAAG,SAA5EA,mBAA4E;;;;;;AAMnF,KALJC,WAKI,QALJA,WAKI,CAJJC,KAII,QAJJA,KAII,CAHJC,KAGI,QAHJA,KAGI,CAFJC,YAEI,QAFJA,YAEI,CADJC,aACI,QADJA,aACI;AACJ,MAAMC,KAAK,GAAGZ,KAAK,CAACa,UAAN,CAAiBX,YAAjB,CAAd;AACA,0BAA8BF,KAAK,CAACa,UAAN,CAAiBR,kBAAjB,CAA9B,CAAQS,OAAR,qBAAQA,OAAR,CAAiBC,QAAjB,qBAAiBA,QAAjB;;AAEA,MAAIC,YAAY,GAAG,IAAnB;;AAEA,MAAIZ,wBAAwB,IAAIG,WAA5B,IAA2C,CAACI,aAA5C,IAA6D,CAACF,KAA9D,IAAuE,CAACC,YAA5E,EAA0F;AACxFM,IAAAA,YAAY;AACV;AACE,MAAA,SAAS,EAAEf,EAAE,CAACE,MAAM,CAACI,WAAP,CAAmBK,KAAnB,CAAD;AACVT,MAAAA,MAAM,CAACc,mBAAP,CAA2BL,KAA3B,CADU,IAC0BG,QAD1B;AAEVZ,MAAAA,MAAM,CAACe,gBAAP,CAAwBN,KAAxB,CAFU,IAEuBE,OAFvB,OADf;;AAKE,MAAA,KAAK,EAAE,EAAEK,SAAS,EAAEX,KAAK,IAAI,SAAtB,EALT;;AAOGD,IAAAA,WAPH,CADF;;;AAWD;;AAED,SAAOS,YAAP;AACD,CA3BM","sourcesContent":["import React from 'react';\n\nimport { InputProps } from '../Input';\nimport { cx } from '../../../lib/theming/Emotion';\nimport { ThemeContext } from '../../../lib/theming/ThemeContext';\nimport { styles } from '../Input.styles';\nimport { needsPolyfillPlaceholder } from '../../../lib/needsPolyfillPlaceholder';\n\nimport { InputLayoutContext } from './InputLayoutContext';\n\ntype PolyfillPlaceholder = Pick<InputProps, 'placeholder' | 'value' | 'defaultValue' | 'align'> & {\n  isMaskVisible: boolean;\n};\n\nexport interface InputLayoutPlaceholderProps extends PolyfillPlaceholder {\n  children: InputProps['placeholder'];\n}\n\nexport const PolyfillPlaceholder: React.FunctionComponent<InputLayoutPlaceholderProps> = ({\n  placeholder,\n  align,\n  value,\n  defaultValue,\n  isMaskVisible,\n}) => {\n  const theme = React.useContext(ThemeContext);\n  const { focused, disabled } = React.useContext(InputLayoutContext);\n\n  let _placeholder = null;\n\n  if (needsPolyfillPlaceholder && placeholder && !isMaskVisible && !value && !defaultValue) {\n    _placeholder = (\n      <div\n        className={cx(styles.placeholder(theme), {\n          [styles.placeholderDisabled(theme)]: disabled,\n          [styles.placeholderFocus(theme)]: focused,\n        })}\n        style={{ textAlign: align || 'inherit' }}\n      >\n        {placeholder}\n      </div>\n    );\n  }\n\n  return _placeholder;\n};\n"]}

package/components/Input/InputLayout/PolyfillPlaceholder/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../../cjs/components/Input/InputLayout/PolyfillPlaceholder.js",
+  "module": "PolyfillPlaceholder",
+  "types": "../PolyfillPlaceholder.d.ts",
+  "sideEffects": false
+}

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import { InputProps } from '../Input';
+declare type PolyfillPlaceholder = Pick<InputProps, 'placeholder' | 'value' | 'defaultValue' | 'align'> & {
+    isMaskVisible: boolean;
+};
+export interface InputLayoutPlaceholderProps extends PolyfillPlaceholder {
+    children: InputProps['placeholder'];
+}
+export declare const PolyfillPlaceholder: React.FunctionComponent<InputLayoutPlaceholderProps>;
+export {};

package/components/Input/index.d.ts

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

package/components/Kebab/Kebab.d.ts

@@ -1,53 +1,53 @@
-import React from 'react';
-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'> {
-    disabled?: boolean;
-    size?: 'small' | 'medium' | 'large';
-    /**
-     * Список позиций доступных для расположения выпадашки.
-     *
-     * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.
-     *
-     * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`
-     * @default ['bottom left', 'bottom right', 'top left', 'top right']
-     */
-    positions?: PopupPositionsType[];
-    menuMaxHeight?: number | string;
-    /**
-     * Не показывать анимацию
-     */
-    disableAnimations?: boolean;
-    /**
-     * Кастомная иконка
-     */
-    icon?: React.ReactNode;
-}
-export interface KebabState {
-    anchor: Nullable<HTMLElement>;
-    focusedByTab: boolean;
-}
-declare type DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations' | 'icon'>>;
-export declare class Kebab extends React.Component<KebabProps, KebabState> {
-    static __KONTUR_REACT_UI__: string;
-    static propTypes: {};
-    static defaultProps: DefaultProps;
-    private getProps;
-    state: KebabState;
-    private theme;
-    private setRootNode;
-    private listener;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): JSX.Element;
-    private renderMain;
-    private renderCaption;
-    private handleCaptionKeyDown;
-    private handleChangeMenuState;
-    private handleFocus;
-    private handleBlur;
-    private renderIcon;
-}
-export {};
+import React from 'react';
+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'> {
+    disabled?: boolean;
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * Список позиций доступных для расположения выпадашки.
+     *
+     * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.
+     *
+     * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`
+     * @default ['bottom left', 'bottom right', 'top left', 'top right']
+     */
+    positions?: PopupPositionsType[];
+    menuMaxHeight?: number | string;
+    /**
+     * Не показывать анимацию
+     */
+    disableAnimations?: boolean;
+    /**
+     * Кастомная иконка
+     */
+    icon?: React.ReactNode;
+}
+export interface KebabState {
+    anchor: Nullable<HTMLElement>;
+    focusedByTab: boolean;
+}
+declare type DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations' | 'icon'>>;
+export declare class Kebab extends React.Component<KebabProps, KebabState> {
+    static __KONTUR_REACT_UI__: string;
+    static propTypes: {};
+    static defaultProps: DefaultProps;
+    private getProps;
+    state: KebabState;
+    private theme;
+    private setRootNode;
+    private listener;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private renderMain;
+    private renderCaption;
+    private handleCaptionKeyDown;
+    private handleChangeMenuState;
+    private handleFocus;
+    private handleBlur;
+    private renderIcon;
+}
+export {};

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

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

package/components/Kebab/index.d.ts

@@ -1 +1 @@
-export * from './Kebab';
+export * from './Kebab';

package/components/Link/Link/Link.js

@@ -1,7 +1,7 @@
 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"];
+var _excluded = ["disabled", "href", "icon", "use", "loading", "_button", "_buttonOpened", "rel", "component", "focused"];
 
 var _class, _class2, _temp;
 
@@ -13,9 +13,11 @@ 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/rootNodeDecorator";
+import { rootNode } from "../../../lib/rootNode";
 import { createPropsGetter } from "../../../lib/createPropsGetter";
-import { styles } from "../Link.styles";
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { globalClasses, styles } from "../Link.styles";
 export var LinkDataTids = {
   root: 'Link__root'
 };
@@ -40,8 +42,6 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
     };
 
     _this.renderMain = function (props) {
-      var _cx;
-
       var disabled = props.disabled,
           href = props.href,
           icon = props.icon,
@@ -50,8 +50,13 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
           _button = props._button,
           _buttonOpened = props._buttonOpened,
           relOrigin = props.rel,
+          Component = props.component,
+          _props$focused = props.focused,
+          focused = _props$focused === void 0 ? false : _props$focused,
           rest = _objectWithoutPropertiesLoose(props, _excluded);
 
+      var _isTheme2022 = isTheme2022(_this.theme);
+
       var iconElement = null;
 
       if (icon) {
@@ -78,22 +83,30 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
         rel = "noopener" + (isExternalLink(href) ? ' noreferrer' : '');
       }
 
-      var focused = !disabled && _this.state.focusedByTab;
+      var isFocused = !disabled && (_this.state.focusedByTab || focused);
       var linkProps = {
-        className: cx((_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[styles.button(_this.theme)] = !!_button, _cx[styles.buttonOpened(_this.theme)] = !!_buttonOpened, _cx[styles.useDefault(_this.theme)] = use === 'default', _cx[styles.useSuccess(_this.theme)] = use === 'success', _cx[styles.useDanger(_this.theme)] = use === 'danger', _cx[styles.useGrayed(_this.theme)] = use === 'grayed', _cx[styles.useGrayedFocus(_this.theme)] = use === 'grayed' && focused, _cx[styles.focus(_this.theme)] = focused, _cx[styles.disabled(_this.theme)] = !!disabled || !!loading, _cx)),
+        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))),
         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
       };
-      return /*#__PURE__*/React.createElement("a", _extends({
+      var child = _this.props.children;
+
+      if (_isTheme2022) {
+        child = /*#__PURE__*/React.createElement("span", {
+          className: cx(globalClasses.text, styles.lineText(_this.theme))
+        }, _this.props.children);
+      }
+
+      return /*#__PURE__*/React.createElement(Component, _extends({
         "data-tid": LinkDataTids.root
-      }, rest, linkProps), iconElement, _this.props.children, arrow);
+      }, rest, linkProps), iconElement, child, arrow);
     };
 
-    _this._handleFocus = function () {
+    _this.handleFocus = function () {
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
@@ -107,13 +120,13 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
       }
     };
 
-    _this._handleBlur = function () {
+    _this.handleBlur = function () {
       _this.setState({
         focusedByTab: false
       });
     };
 
-    _this._handleClick = function (event) {
+    _this.handleClick = function (event) {
       var _this$props = _this.props,
           onClick = _this$props.onClick,
           disabled = _this$props.disabled,
@@ -139,13 +152,22 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
     var _this2 = this;
 
     return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
-      _this2.theme = 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) {
+    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 Link;
 }(React.Component), _class2.__KONTUR_REACT_UI__ = 'Link', _class2.propTypes = {
   disabled: PropTypes.bool,
@@ -154,5 +176,6 @@ var Link = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Co
   use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed'])
 }, _class2.defaultProps = {
   href: '',
-  use: 'default'
+  use: 'default',
+  component: 'a'
 }, _temp)) || _class;

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","styles","LinkDataTids","root","Link","getProps","defaultProps","state","focusedByTab","renderMain","props","disabled","href","icon","use","loading","_button","_buttonOpened","relOrigin","rel","rest","iconElement","theme","arrow","focused","linkProps","className","button","buttonOpened","useDefault","useSuccess","useDanger","useGrayed","useGrayedFocus","focus","onClick","_handleClick","onFocus","_handleFocus","onBlur","_handleBlur","tabIndex","children","requestAnimationFrame","isTabPressed","setState","event","preventDefault","render","setRootNode","Component","__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 } 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';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode/rootNodeDecorator';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\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\nexport const LinkDataTids = {\n  root: 'Link__root',\n} as const;\n\ntype DefaultProps = Required<Pick<LinkProps, 'href' | 'use'>>;\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  };\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 = 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 { 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(this.theme)]: !!_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 data-tid={LinkDataTids.root} {...rest} {...linkProps}>\n        {iconElement}\n        {this.props.children}\n        {arrow}\n      </a>\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"]}
+{"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","component","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        theme?: ThemeIn;\n        /**\n         * Компонент, используемый в качестве корневого узла.\n         */\n        component?: 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' | 'component'>>;\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    component: '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      component: 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"]}