@skbkontur/react-ui 1.12.2 → 2.0.0-beta.4

package/components/Kebab/Kebab.styles.js

@@ -1,15 +1,36 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var Emotion_1 = require("../../lib/theming/Emotion");
-var Kebab_module_less_1 = tslib_1.__importDefault(require("./Kebab.module.css"));
-var jsStyles = {
-  focused: function focused(t) {
-    return Emotion_1.css(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n      .", "& {\n        border-color: ", ";\n      }\n    "], ["\n      .", "& {\n        border-color: ", ";\n      }\n    "])), Kebab_module_less_1["default"].kebab, t.borderColorFocus);
-  },
-  menu: function menu(t) {
-    return Emotion_1.css(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n      border-radius: ", ";\n    "], ["\n      border-radius: ", ";\n    "])), t.popupBorderRadius);
-  } };
-
-exports["default"] = jsStyles;
-var templateObject_1, templateObject_2;
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        kebab: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\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    "], ["\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\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, t.kebabBorderRadius, t.kebabBackground, t.kebabBackgroundHover, t.kebabBackgroundActive);
+        },
+        kebabSmall: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      width: ", ";\n      height: ", ";\n    "], ["\n      width: ", ";\n      height: ", ";\n    "])), t.kebabSizeSmall, t.kebabSizeSmall);
+        },
+        kebabMedium: function (t) {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      width: ", ";\n      height: ", ";\n    "], ["\n      width: ", ";\n      height: ", ";\n    "])), t.kebabSizeMedium, t.kebabSizeMedium);
+        },
+        kebabLarge: function (t) {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      width: ", ";\n      height: ", ";\n    "], ["\n      width: ", ";\n      height: ", ";\n    "])), t.kebabSizeLarge, t.kebabSizeLarge);
+        },
+        focused: function (t) {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      background: ", ";\n      border-color: ", ";\n    "], ["\n      background: ", ";\n      border-color: ", ";\n    "])), t.kebabBackgroundHover, t.borderColorFocus);
+        },
+        opened: function (t) {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      background: ", " !important; // override kebab:hover style\n      cursor: default;\n    "], ["\n      background: ", " !important; // override kebab:hover style\n      cursor: default;\n    "])), t.kebabBackgroundActive);
+        },
+        disabled: function () {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      cursor: default;\n\n      &:hover {\n        background: none;\n      }\n    "], ["\n      cursor: default;\n\n      &:hover {\n        background: none;\n      }\n    "])));
+        },
+        menu: function (t) {
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      overflow: hidden;\n      border-radius: ", ";\n    "], ["\n      overflow: hidden;\n      border-radius: ", ";\n    "])), t.popupBorderRadius);
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
+//# sourceMappingURL=Kebab.styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Kebab.styles.js","sourceRoot":"","sources":["Kebab.styles.ts"],"names":[],"mappings":";;;AAAA,qDAAgD;AAChD,kFAAyC;AAGzC,IAAM,QAAQ,GAAG;IACf,OAAO,YAAC,CAAS;QACf,OAAO,aAAG,yIAAA,WACL,EAAY,6BACG,EAAkB,kBAErC,KAHI,2BAAM,CAAC,KAAK,EACG,CAAC,CAAC,gBAAgB,EAEpC;IACJ,CAAC;IAED,IAAI,YAAC,CAAS;QACZ,OAAO,aAAG,+GAAA,yBACS,EAAmB,SACrC,KADkB,CAAC,CAAC,iBAAiB,EACpC;IACJ,CAAC;CACF,CAAC;AAEF,kBAAe,QAAQ,CAAC"}
+{"version":3,"file":"Kebab.styles.js","sourceRoot":"","sources":["../../../components/Kebab/Kebab.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,KAAK,YAAC,CAAQ;YACZ,OAAO,GAAG,0gBAAA,sIAKE,EAAa,yDAEN,EAAmB,0IAKtB,EAAiB,4CAGf,EAAsB,sDAItB,EAAuB,kBAExC,KAhBW,CAAC,CAAC,WAAW,EAEN,CAAC,CAAC,iBAAiB,EAKtB,CAAC,CAAC,eAAe,EAGf,CAAC,CAAC,oBAAoB,EAItB,CAAC,CAAC,qBAAqB,EAEvC;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,oHAAA,iBACC,EAAgB,mBACf,EAAgB,SAC3B,KAFU,CAAC,CAAC,cAAc,EACf,CAAC,CAAC,cAAc,EAC1B;QACJ,CAAC;QAED,WAAW,YAAC,CAAQ;YAClB,OAAO,GAAG,oHAAA,iBACC,EAAiB,mBAChB,EAAiB,SAC5B,KAFU,CAAC,CAAC,eAAe,EAChB,CAAC,CAAC,eAAe,EAC3B;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,oHAAA,iBACC,EAAgB,mBACf,EAAgB,SAC3B,KAFU,CAAC,CAAC,cAAc,EACf,CAAC,CAAC,cAAc,EAC1B;QACJ,CAAC;QAED,OAAO,YAAC,CAAQ;YACd,OAAO,GAAG,+HAAA,sBACM,EAAsB,yBACpB,EAAkB,SACnC,KAFe,CAAC,CAAC,oBAAoB,EACpB,CAAC,CAAC,gBAAgB,EAClC;QACJ,CAAC;QAED,MAAM,YAAC,CAAQ;YACb,OAAO,GAAG,qKAAA,sBACM,EAAuB,0EAEtC,KAFe,CAAC,CAAC,qBAAqB,EAErC;QACJ,CAAC;QAED,QAAQ;YACN,OAAO,GAAG,0JAAA,uFAMT,KAAC;QACJ,CAAC;QAED,IAAI,YAAC,CAAQ;YACX,OAAO,GAAG,gIAAA,kDAES,EAAmB,SACrC,KADkB,CAAC,CAAC,iBAAiB,EACpC;QACJ,CAAC;KACF,CAAC;AA7E8D,CA6E9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  kebab(t: Theme) {\n    return css`\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\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  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  menu(t: Theme) {\n    return css`\n      overflow: hidden;\n      border-radius: ${t.popupBorderRadius};\n    `;\n  },\n}));\n"]}

package/components/Kebab/KebabIcon.d.ts

@@ -0,0 +1,3 @@
+export declare const KebabIcon: import("../../lib/forwardRefAndName.js").ReactUIIconWithRef<SVGSVGElement, Omit<import("../../internal/icons2022/BaseIcon.js").IconProps, "size"> & {
+    size?: import("../../internal/icons2022/BaseIcon.js").IconProps["size"] | import("../../internal/icons2022/iconConstants.js").IconSizeAliases;
+}>;

package/components/Kebab/KebabIcon.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { iconSizer } from '../../internal/icons2022/iconSizer.js';
+import { UiMenuDotsThreeVIcon16Light } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon16Light.js';
+import { UiMenuDotsThreeVIcon20Regular } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon20Regular.js';
+import { UiMenuDotsThreeVIcon24Regular } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon24Regular.js';
+export var KebabIcon = iconSizer({
+    small: function () { return React.createElement(UiMenuDotsThreeVIcon16Light, null); },
+    medium: function () { return React.createElement(UiMenuDotsThreeVIcon20Regular, null); },
+    large: function () { return React.createElement(UiMenuDotsThreeVIcon24Regular, null); },
+}, 'KebabIcon');
+//# sourceMappingURL=KebabIcon.js.map

package/components/Kebab/KebabIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KebabIcon.js","sourceRoot":"","sources":["../../../components/Kebab/KebabIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAAE,2BAA2B,EAAE,MAAM,8EAA8E,CAAC;AAC3H,OAAO,EAAE,6BAA6B,EAAE,MAAM,gFAAgF,CAAC;AAC/H,OAAO,EAAE,6BAA6B,EAAE,MAAM,gFAAgF,CAAC;AAE/H,MAAM,CAAC,IAAM,SAAS,GAAG,SAAS,CAChC;IACE,KAAK,EAAE,cAAM,OAAA,oBAAC,2BAA2B,OAAG,EAA/B,CAA+B;IAC5C,MAAM,EAAE,cAAM,OAAA,oBAAC,6BAA6B,OAAG,EAAjC,CAAiC;IAC/C,KAAK,EAAE,cAAM,OAAA,oBAAC,6BAA6B,OAAG,EAAjC,CAAiC;CAC/C,EACD,WAAW,CACZ,CAAC","sourcesContent":["import React from 'react';\n\nimport { iconSizer } from '../../internal/icons2022/iconSizer.js';\nimport { UiMenuDotsThreeVIcon16Light } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon16Light.js';\nimport { UiMenuDotsThreeVIcon20Regular } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon20Regular.js';\nimport { UiMenuDotsThreeVIcon24Regular } from '../../internal/icons2022/UiMenuDotsThreeVIcon/UiMenuDotsThreeVIcon24Regular.js';\n\nexport const KebabIcon = iconSizer(\n  {\n    small: () => <UiMenuDotsThreeVIcon16Light />,\n    medium: () => <UiMenuDotsThreeVIcon20Regular />,\n    large: () => <UiMenuDotsThreeVIcon24Regular />,\n  },\n  'KebabIcon',\n);\n"]}

package/components/Kebab/index.d.ts

@@ -1 +1 @@
-export { default, KebabProps, KebabState } from './Kebab';
+export * from './Kebab.js';

package/components/Kebab/index.js

@@ -1,4 +1,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var Kebab_1 = require("./Kebab");
-exports["default"] = Kebab_1["default"];
+export * from './Kebab.js';
+//# sourceMappingURL=index.js.map

package/components/Kebab/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":";;AAAA,iCAA0D;AAAjD,0BAAA,OAAO,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/Kebab/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC","sourcesContent":["export * from './Kebab.js';\n"]}

package/components/Link/Link.d.ts

@@ -1,52 +1,69 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { Override } from '../../typings/utility-types';
-export declare type LinkProps = Override<React.AnchorHTMLAttributes<HTMLAnchorElement>, {
-    /** Неактивное состояние */
-    disabled?: boolean;
-    /** href */
-    href?: string;
-    /** Иконка */
-    icon?: React.ReactElement<any>;
-    /** Тип */
-    use?: 'default' | 'success' | 'danger' | 'grayed';
-    _button?: boolean;
-    _buttonOpened?: boolean;
-    tabIndex?: number;
-    /** onClick */
-    onClick?: (event?: React.MouseEvent<HTMLAnchorElement>) => void;
-}>;
-export interface LinkState {
-    focusedByTab: boolean;
-}
-/**
- * Стандартная ссылка.
- * Интерфес пропсов наследуется от `React.AnchorHTMLAttributes<HTMLAnchorElement>`.
- * Все свойства передаются в элемент `<a>`.
- * `className` и `style` не поддерживаются
- */
-declare class Link extends React.Component<LinkProps, LinkState> {
-    static __KONTUR_REACT_UI__: string;
-    static __ADAPTER__: any;
-    static propTypes: {
-        disabled: PropTypes.Requireable<boolean>;
-        href: PropTypes.Requireable<string>;
-        icon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        use: PropTypes.Requireable<string>;
-    };
-    static defaultProps: {
-        href: string;
-        use: string;
-    };
-    state: {
-        focusedByTab: boolean;
-    };
-    private theme;
-    private getProps;
-    render(): JSX.Element;
-    private renderMain;
-    private _handleFocus;
-    private _handleBlur;
-    private _handleClick;
-}
-export default Link;
+import React, { type JSX } from 'react';
+import type { ButtonLinkAllowedValues } from '../../lib/types/button-link.js';
+import type { PolymorphicPropsWithoutRef } from '../../lib/types/polymorphic-component.js';
+import type { ThemeIn } from '../../lib/theming/Theme.js';
+import type { CommonProps } from '../../internal/CommonWrapper/index.js';
+import type { TGetRootNode } from '../../lib/rootNode/index.js';
+export interface LinkInnerProps extends CommonProps {
+    /** Ссылка меняет цвет на серый и становится недоступна для нажатия. */
+    disabled?: boolean;
+    /** Добавляет иконку слева от ссылки. */
+    icon?: React.ReactElement;
+    /** Добавляет иконку справа от ссылки. */
+    rightIcon?: React.ReactElement;
+    /** Стиль ссылки. */
+    use?: 'default' | 'success' | 'danger' | 'grayed';
+    /** @ignore */
+    _button?: boolean;
+    /** @ignore */
+    _buttonOpened?: boolean;
+    /** HTML-атрибут `tabindex`. */
+    tabIndex?: number;
+    /** Переводит ссылку в состояние загрузки. */
+    loading?: boolean;
+    /** Объект с переменными темы. */
+    theme?: ThemeIn;
+    /** Задает состояние фокуса.
+     * @ignore */
+    focused?: boolean;
+    /** Переводит ссылку в состояние валидации "Ошибка". */
+    error?: boolean;
+    /** Переводит ссылку в состояние валидации "Предупреждение". */
+    warning?: boolean;
+}
+declare const LINK_DEFAULT_COMPONENT = "a";
+export type LinkProps<C extends ButtonLinkAllowedValues = typeof LINK_DEFAULT_COMPONENT> = PolymorphicPropsWithoutRef<LinkInnerProps, C>;
+export interface LinkState {
+    focusedByTab: boolean;
+}
+export declare const LinkDataTids: {
+    readonly root: "Link__root";
+};
+type DefaultProps = Required<Pick<LinkProps<ButtonLinkAllowedValues>, 'use' | 'component'>>;
+/**
+ * С помощью ссылки пользователь может перейти на другую страницу, раздел приложения или внешний URL.
+ */
+export declare class Link<C extends ButtonLinkAllowedValues = typeof LINK_DEFAULT_COMPONENT> extends React.Component<LinkProps<C>, LinkState> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    static defaultProps: DefaultProps;
+    private getProps;
+    state: LinkState;
+    private globalObject;
+    private emotion;
+    private cx;
+    private styles;
+    private theme;
+    getRootNode: TGetRootNode;
+    private setRootNode;
+    private keyListener;
+    componentDidMount(): void;
+    render(): JSX.Element;
+    private getTabIndex;
+    private getRel;
+    private renderMain;
+    private handleFocus;
+    private handleBlur;
+    private handleClick;
+}
+export {};

package/components/Link/Link.js

@@ -1,109 +1,196 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var React = tslib_1.__importStar(require("react"));
-var PropTypes = tslib_1.__importStar(require("prop-types"));
-var createPropsGetter_1 = require("../internal/createPropsGetter");
-var tabListener_1 = tslib_1.__importDefault(require("../../lib/events/tabListener"));
-var Link_module_less_1 = tslib_1.__importDefault(require("./Link.module.css"));
-var Emotion_1 = require("../../lib/theming/Emotion");
-var Link_styles_1 = tslib_1.__importDefault(require("./Link.styles"));
-var ThemeConsumer_1 = require("../ThemeConsumer");
-function getUseClasses(t) {
-  return {
-    "default": Emotion_1.cx(Link_module_less_1["default"].useDefault, Link_styles_1["default"].useDefault(t)),
-    success: Emotion_1.cx(Link_module_less_1["default"].useSuccess),
-    danger: Emotion_1.cx(Link_module_less_1["default"].useDanger),
-    grayed: Emotion_1.cx(Link_module_less_1["default"].useGrayed, Link_styles_1["default"].useGrayed(t)) };
-
-}
-/**
- * Стандартная ссылка.
- * Интерфес пропсов наследуется от `React.AnchorHTMLAttributes<HTMLAnchorElement>`.
- * Все свойства передаются в элемент `<a>`.
- * `className` и `style` не поддерживаются
- */
-var Link = /** @class */function (_super) {
-  tslib_1.__extends(Link, _super);
-  function Link() {
-    var _this = _super !== null && _super.apply(this, arguments) || this;
-    _this.state = {
-      focusedByTab: false };
-
-    _this.getProps = createPropsGetter_1.createPropsGetter(Link.defaultProps);
-    _this._handleFocus = function (event) {
-      if (!_this.props.disabled) {
-        // focus event fires before keyDown eventlistener
-        // so we should check tabPressed in async way
-        process.nextTick(function () {
-          if (tabListener_1["default"].isTabPressed) {
-            _this.setState({ focusedByTab: true });
-          }
-        });
-      }
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
     };
-    _this._handleBlur = function () {
-      _this.setState({ focusedByTab: false });
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
-    _this._handleClick = function (event) {
-      if (_this.props.onClick && !_this.props.disabled) {
-        _this.props.onClick(event);
-      }
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
     };
-    return _this;
-  }
-  Link.prototype.render = function () {
-    var _this = this;
-    return React.createElement(ThemeConsumer_1.ThemeConsumer, null, function (theme) {
-      _this.theme = theme;
-      return _this.renderMain();
-    });
-  };
-  Link.prototype.renderMain = function () {
-    var _a;
-    var _b = this.getProps(),disabled = _b.disabled,href = _b.href,icon = _b.icon,use = _b.use,_button = _b._button,_buttonOpened = _b._buttonOpened,className = _b.className,style = _b.style,rest = tslib_1.__rest(_b, ["disabled", "href", "icon", "use", "_button", "_buttonOpened", "className", "style"]);
-    var iconElement = null;
-    if (icon) {
-      iconElement = React.createElement("span", { className: Link_module_less_1["default"].icon }, icon);
-    }
-    var arrow = null;
-    if (_button) {
-      arrow = React.createElement("span", { className: Link_module_less_1["default"].arrow });
-    }
-    var props = {
-      className: Emotion_1.cx((_a = {},
-      _a[Link_module_less_1["default"].disabled] = !!disabled,
-      _a[Link_styles_1["default"].disabled(this.theme)] = !!disabled,
-      _a[Link_module_less_1["default"].button] = !!_button,
-      _a[Link_module_less_1["default"].buttonOpened] = !!_buttonOpened,
-      _a[Link_styles_1["default"].focus(this.theme)] = !disabled && this.state.focusedByTab,
-      _a[getUseClasses(this.theme)[use]] = !!use,
-      _a)),
-      href: href,
-      onClick: this._handleClick,
-      onFocus: this._handleFocus,
-      onBlur: this._handleBlur,
-      tabIndex: this.props.tabIndex };
-
-    if (disabled) {
-      props.tabIndex = -1;
+    return __assign.apply(this, arguments);
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { KeyListener } from '../../lib/events/keyListener.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { isExternalLink } from '../../lib/utils.js';
+import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { rootNode } from '../../lib/rootNode/index.js';
+import { createPropsGetter } from '../../lib/createPropsGetter.js';
+import { ThemeFactory } from '../../lib/theming/ThemeFactory.js';
+import { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes.js';
+import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { getStyles } from './Link.styles.js';
+import { LinkIcon } from './LinkIcon.js';
+var LINK_DEFAULT_COMPONENT = 'a';
+export var LinkDataTids = {
+    root: 'Link__root',
+};
+/**
+ * С помощью ссылки пользователь может перейти на другую страницу, раздел приложения или внешний URL.
+ */
+var Link = /** @class */ (function (_super) {
+    __extends(Link, _super);
+    function Link() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.getProps = createPropsGetter(Link_1.defaultProps);
+        _this.state = {
+            focusedByTab: false,
+        };
+        _this.getTabIndex = function (_a) {
+            var nonInteractive = _a.nonInteractive, _b = _a.tabIndex, tabIndex = _b === void 0 ? 0 : _b;
+            return nonInteractive ? -1 : tabIndex;
+        };
+        _this.getRel = function () {
+            if (isAnchorProps(_this.props)) {
+                var _a = _this.props, rel = _a.rel, href = _a.href;
+                if (!rel && href) {
+                    return "noopener".concat(isExternalLink(href, _this.globalObject) ? ' noreferrer' : '');
+                }
+                return rel;
+            }
+            return undefined;
+        };
+        _this.renderMain = function (props) {
+            var _a;
+            var disabled = props.disabled, icon = props.icon, rightIcon = props.rightIcon, use = props.use, loading = props.loading, _button = props._button, _buttonOpened = props._buttonOpened, Root = props.component, _b = props.focused, focused = _b === void 0 ? false : _b, error = props.error, warning = props.warning, tabIndex = props.tabIndex, theme = props.theme, rest = __rest(props, ["disabled", "icon", "rightIcon", "use", "loading", "_button", "_buttonOpened", "component", "focused", "error", "warning", "tabIndex", "theme"]);
+            var arrow = null;
+            if (_button) {
+                arrow = React.createElement("span", { className: _this.styles.arrow() });
+            }
+            var isFocused = !disabled && (_this.state.focusedByTab || focused);
+            var leftIconElement = icon && React.createElement(LinkIcon, { icon: icon, loading: loading, position: "left" });
+            var rightIconElement = rightIcon && (React.createElement(LinkIcon, { hasBothIcons: !!icon && !!rightIcon, icon: rightIcon, loading: loading, position: "right" }));
+            var nonInteractive = disabled || loading;
+            var getUseStyles = function () {
+                switch (use) {
+                    case 'default':
+                        return _this.styles.default(_this.theme);
+                    case 'danger':
+                        return _this.styles.danger(_this.theme);
+                    case 'success':
+                        return _this.styles.success(_this.theme);
+                    case 'grayed':
+                        return _this.styles.grayed(_this.theme);
+                }
+            };
+            var getUseLineFocusStyles = function () {
+                switch (use) {
+                    case 'default':
+                        return _this.styles.lineFocus(_this.theme);
+                    case 'danger':
+                        return _this.styles.lineFocusDanger(_this.theme);
+                    case 'success':
+                        return _this.styles.lineFocusSuccess(_this.theme);
+                    case 'grayed':
+                        return _this.styles.lineFocusGrayed(_this.theme);
+                }
+            };
+            var rootProps = __assign(__assign({}, rest), { className: _this.cx((_a = {},
+                    _a[_this.styles.root(_this.theme)] = true,
+                    _a[_this.styles.reserButton()] = Root === 'button',
+                    _a[_this.styles.focus(_this.theme)] = isFocused,
+                    _a[_this.styles.disabled(_this.theme)] = disabled || loading,
+                    _a[getUseStyles()] = true,
+                    _a[_this.styles.useGrayedFocus(_this.theme)] = use === 'grayed' && focused,
+                    _a[_this.styles.button(_this.theme)] = !!_button,
+                    _a[_this.styles.buttonOpened(_this.theme)] = !!_buttonOpened,
+                    _a[_this.styles.warning(_this.theme)] = warning,
+                    _a[_this.styles.error(_this.theme)] = error,
+                    _a[getUseLineFocusStyles()] = isFocused,
+                    _a)), onClick: _this.handleClick, onFocus: _this.handleFocus, onBlur: _this.handleBlur, tabIndex: _this.getTabIndex({ nonInteractive: nonInteractive, tabIndex: tabIndex }), rel: _this.getRel() });
+            var buttonOnlyProps = Root === 'button' ? { disabled: nonInteractive } : {};
+            return (React.createElement(Root, __assign({ "data-tid": LinkDataTids.root }, rootProps, buttonOnlyProps, getVisualStateDataAttributes({ disabled: disabled })),
+                leftIconElement,
+                _this.props.children,
+                rightIconElement,
+                arrow));
+        };
+        _this.handleFocus = function () {
+            var _a, _b;
+            if (!_this.props.disabled) {
+                // focus event fires before keyDown eventlistener
+                // so we should check tabPressed in async way
+                (_b = (_a = _this.globalObject).requestAnimationFrame) === null || _b === void 0 ? void 0 : _b.call(_a, function () {
+                    if (_this.keyListener.isTabPressed) {
+                        _this.setState({ focusedByTab: true });
+                    }
+                });
+            }
+        };
+        _this.handleBlur = function () {
+            _this.setState({ focusedByTab: false });
+        };
+        _this.handleClick = function (event) {
+            var _a = _this.props, onClick = _a.onClick, disabled = _a.disabled, loading = _a.loading;
+            if (disabled) {
+                event.preventDefault();
+                event.stopPropagation();
+            }
+            if (onClick && !disabled && !loading) {
+                onClick(event);
+            }
+        };
+        return _this;
     }
-    return React.createElement("a", tslib_1.__assign({}, rest, props),
-    iconElement,
-    this.props.children,
-    arrow);
-  };
-  Link.__KONTUR_REACT_UI__ = 'Link';
-  Link.propTypes = {
-    disabled: PropTypes.bool,
-    href: PropTypes.string,
-    icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-    use: PropTypes.oneOf(['default', 'success', 'danger', 'grayed']) };
-
-  Link.defaultProps = {
-    href: 'javascript:',
-    use: 'default' };
-
-  return Link;
-}(React.Component);
-exports["default"] = Link;
+    Link_1 = Link;
+    Link.prototype.componentDidMount = function () {
+        this.keyListener = new KeyListener(this.globalObject);
+    };
+    Link.prototype.render = function () {
+        var _this = this;
+        this.styles = getStyles(this.emotion);
+        return (React.createElement(ThemeContext.Consumer, null, function (theme) {
+            _this.theme = _this.props.theme ? ThemeFactory.create(_this.props.theme, theme) : theme;
+            return (React.createElement(CommonWrapper, __assign({ rootNodeRef: _this.setRootNode }, _this.getProps()), _this.renderMain));
+        }));
+    };
+    var Link_1;
+    Link.__KONTUR_REACT_UI__ = 'Link';
+    Link.displayName = 'Link';
+    Link.defaultProps = {
+        use: 'default',
+        component: LINK_DEFAULT_COMPONENT,
+    };
+    Link = Link_1 = __decorate([
+        withRenderEnvironment,
+        rootNode
+    ], Link);
+    return Link;
+}(React.Component));
+export { Link };
+var isAnchorProps = function (props) {
+    return props.component === 'a';
+};
+//# sourceMappingURL=Link.js.map

package/components/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sourceRoot":"","sources":["Link.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../../components/Link/Link.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { type JSX } from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport type { ButtonLinkAllowedValues } from '../../lib/types/button-link.js';\nimport type { PolymorphicPropsWithoutRef } from '../../lib/types/polymorphic-component.js';\nimport { KeyListener } from '../../lib/events/keyListener.js';\nimport type { Theme, ThemeIn } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { isExternalLink } from '../../lib/utils.js';\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { DefaultizedProps } from '../../lib/createPropsGetter.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\n\nimport { getStyles } from './Link.styles.js';\nimport { LinkIcon } from './LinkIcon.js';\n\nexport interface LinkInnerProps extends CommonProps {\n  /** Ссылка меняет цвет на серый и становится недоступна для нажатия. */\n  disabled?: boolean;\n\n  /** Добавляет иконку слева от ссылки. */\n  icon?: React.ReactElement;\n\n  /** Добавляет иконку справа от ссылки. */\n  rightIcon?: React.ReactElement;\n\n  /** Стиль ссылки. */\n  use?: 'default' | 'success' | 'danger' | 'grayed';\n\n  /** @ignore */\n  _button?: boolean;\n\n  /** @ignore */\n  _buttonOpened?: boolean;\n\n  /** HTML-атрибут `tabindex`. */\n  tabIndex?: number;\n\n  /** Переводит ссылку в состояние загрузки. */\n  loading?: boolean;\n\n  /** Объект с переменными темы. */\n  theme?: ThemeIn;\n\n  /** Задает состояние фокуса.\n   * @ignore */\n  focused?: boolean;\n\n  /** Переводит ссылку в состояние валидации \"Ошибка\". */\n  error?: boolean;\n\n  /** Переводит ссылку в состояние валидации \"Предупреждение\". */\n  warning?: boolean;\n}\n\nconst LINK_DEFAULT_COMPONENT = 'a';\n\nexport type LinkProps<C extends ButtonLinkAllowedValues = typeof LINK_DEFAULT_COMPONENT> = PolymorphicPropsWithoutRef<\n  LinkInnerProps,\n  C\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<ButtonLinkAllowedValues>, 'use' | 'component'>>;\ntype DefaultizedLinkProps = DefaultizedProps<LinkProps<ButtonLinkAllowedValues>, DefaultProps>;\n\n/**\n * С помощью ссылки пользователь может перейти на другую страницу, раздел приложения или внешний URL.\n */\n@withRenderEnvironment\n@rootNode\nexport class Link<C extends ButtonLinkAllowedValues = typeof LINK_DEFAULT_COMPONENT> extends React.Component<\n  LinkProps<C>,\n  LinkState\n> {\n  public static __KONTUR_REACT_UI__ = 'Link';\n  public static displayName = 'Link';\n\n  public static defaultProps: DefaultProps = {\n    use: 'default',\n    component: LINK_DEFAULT_COMPONENT,\n  };\n\n  private getProps = createPropsGetter(Link.defaultProps);\n\n  public state: LinkState = {\n    focusedByTab: false,\n  };\n\n  private globalObject!: GlobalObject;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n  private theme!: Theme;\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private keyListener!: KeyListener;\n\n  public componentDidMount() {\n    this.keyListener = new KeyListener(this.globalObject);\n  }\n\n  public render(): JSX.Element {\n    this.styles = getStyles(this.emotion);\n\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 getTabIndex = ({\n    nonInteractive,\n    tabIndex = 0,\n  }: {\n    nonInteractive: boolean | undefined;\n    tabIndex: number | undefined;\n  }) => {\n    return nonInteractive ? -1 : tabIndex;\n  };\n\n  private getRel = () => {\n    if (isAnchorProps(this.props)) {\n      const { rel, href } = this.props;\n      if (!rel && href) {\n        return `noopener${isExternalLink(href, this.globalObject) ? ' noreferrer' : ''}`;\n      }\n      return rel;\n    }\n\n    return undefined;\n  };\n\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedLinkProps>) => {\n    const {\n      disabled,\n      icon,\n      rightIcon,\n      use,\n      loading,\n      _button,\n      _buttonOpened,\n      component: Root,\n      focused = false,\n      error,\n      warning,\n      tabIndex,\n      theme,\n      ...rest\n    } = props;\n\n    let arrow = null;\n    if (_button) {\n      arrow = <span className={this.styles.arrow()} />;\n    }\n\n    const isFocused = !disabled && (this.state.focusedByTab || focused);\n\n    const leftIconElement = icon && <LinkIcon icon={icon} loading={loading} position=\"left\" />;\n    const rightIconElement = rightIcon && (\n      <LinkIcon hasBothIcons={!!icon && !!rightIcon} icon={rightIcon} loading={loading} position=\"right\" />\n    );\n    const nonInteractive = disabled || loading;\n    const getUseStyles = () => {\n      switch (use) {\n        case 'default':\n          return this.styles.default(this.theme);\n        case 'danger':\n          return this.styles.danger(this.theme);\n        case 'success':\n          return this.styles.success(this.theme);\n        case 'grayed':\n          return this.styles.grayed(this.theme);\n      }\n    };\n    const getUseLineFocusStyles = () => {\n      switch (use) {\n        case 'default':\n          return this.styles.lineFocus(this.theme);\n        case 'danger':\n          return this.styles.lineFocusDanger(this.theme);\n        case 'success':\n          return this.styles.lineFocusSuccess(this.theme);\n        case 'grayed':\n          return this.styles.lineFocusGrayed(this.theme);\n      }\n    };\n\n    const rootProps = {\n      ...rest,\n      className: this.cx({\n        [this.styles.root(this.theme)]: true,\n        [this.styles.reserButton()]: Root === 'button',\n        [this.styles.focus(this.theme)]: isFocused,\n        [this.styles.disabled(this.theme)]: disabled || loading,\n        [getUseStyles()]: true,\n        [this.styles.useGrayedFocus(this.theme)]: use === 'grayed' && focused,\n        [this.styles.button(this.theme)]: !!_button,\n        [this.styles.buttonOpened(this.theme)]: !!_buttonOpened,\n        [this.styles.warning(this.theme)]: warning,\n        [this.styles.error(this.theme)]: error,\n        [getUseLineFocusStyles()]: isFocused,\n      }),\n      onClick: this.handleClick,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      tabIndex: this.getTabIndex({ nonInteractive, tabIndex }),\n      rel: this.getRel(),\n    };\n\n    const buttonOnlyProps = Root === 'button' ? { disabled: nonInteractive } : {};\n\n    return (\n      <Root\n        data-tid={LinkDataTids.root}\n        {...rootProps}\n        {...buttonOnlyProps}\n        {...getVisualStateDataAttributes({ disabled })}\n      >\n        {leftIconElement}\n        {this.props.children}\n        {rightIconElement}\n        {arrow}\n      </Root>\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      this.globalObject.requestAnimationFrame?.(() => {\n        if (this.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) => {\n    const { onClick, disabled, loading } = this.props;\n\n    if (disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n    }\n\n    if (onClick && !disabled && !loading) {\n      onClick(event);\n    }\n  };\n}\n\nconst isAnchorProps = (props: LinkProps<any>): props is LinkProps<'a'> => {\n  return props.component === 'a';\n};\n"]}

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

@@ -0,0 +1,2 @@
+export declare const linkDisabledMixin: () => string;
+export declare const linkUseColorsMixin: (mainColor: string, hoverColor: string, activeColor: string) => string;

package/components/Link/Link.mixins.js

@@ -0,0 +1,7 @@
+export var linkDisabledMixin = function () {
+    return "\n    box-shadow: none;\n    cursor: default;\n  ";
+};
+export var linkUseColorsMixin = function (mainColor, hoverColor, activeColor) {
+    return "\n    color: ".concat(mainColor, ";\n\n    &:hover {\n      color: ").concat(hoverColor, ";\n    }\n\n    &:active {\n      color: ").concat(activeColor, ";\n    }\n  ");
+};
+//# sourceMappingURL=Link.mixins.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Link.mixins.js","sourceRoot":"","sources":["../../../components/Link/Link.mixins.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,iBAAiB,GAAG;IAC/B,OAAO,mDAGN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,kBAAkB,GAAG,UAAC,SAAiB,EAAE,UAAkB,EAAE,WAAmB;IAC3F,OAAO,uBACI,SAAS,8CAGP,UAAU,sDAIV,WAAW,iBAEvB,CAAC;AACJ,CAAC,CAAC","sourcesContent":["export const linkDisabledMixin = (): string => {\n  return `\n    box-shadow: none;\n    cursor: default;\n  `;\n};\n\nexport const linkUseColorsMixin = (mainColor: string, hoverColor: string, activeColor: string): string => {\n  return `\n    color: ${mainColor};\n\n    &:hover {\n      color: ${hoverColor};\n    }\n\n    &:active {\n      color: ${activeColor};\n    }\n  `;\n};\n"]}