@skbkontur/react-ui 0.0.0-3c309a601b → 0.0.0-3dbb8bef27

package/components/Kebab/Kebab.d.ts

@@ -5,29 +5,22 @@ import { PopupPositionsType } from '../../internal/Popup';
 import { CommonProps } from '../../internal/CommonWrapper';
 import { SizeProp } from '../../lib/types/props';
 export interface KebabProps extends Pick<AriaAttributes, 'aria-label'>, Pick<HTMLAttributes<HTMLElement>, 'id'>, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>, CommonProps {
+    /** Делает компонент недоступным. */
     disabled?: boolean;
+    /** Задает размер контрола. */
     size?: SizeProp;
-    /**
-     * Список позиций доступных для расположения выпадашки.
-     *
+    /** Определяет список позиций, доступных для расположения выпадашки относительно `kebab`.
      * Если во всех позициях выпадашка вылезает за пределы `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']
-     */
+     * @default ['bottom left', 'bottom right', 'top left', 'top right']. */
     positions?: PopupPositionsType[];
+    positions2?: string;
+    /** Задает максимальную высоту меню. */
     menuMaxHeight?: number | string;
-    /**
-     * Не показывать анимацию
-     */
+    /** Отключает анимацию. */
     disableAnimations?: boolean;
-    /**
-     * Кастомная иконка
-     */
+    /** Добавляет иконку слева. */
     icon?: React.ReactNode;
-    /**
-     * Атрибут для указания id элемента(-ов), описывающих его
-     */
+    /** @ignore */
     'aria-describedby'?: AriaAttributes['aria-describedby'];
 }
 export declare const KebabDataTids: {
@@ -38,6 +31,9 @@ export interface KebabState {
     focusedByTab: boolean;
 }
 type DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;
+/**
+ * Кебаб-меню `Kebab` содержит действия с объектом.
+ */
 export declare class Kebab extends React.Component<KebabProps, KebabState> {
     static __KONTUR_REACT_UI__: string;
     static displayName: string;

package/components/Kebab/Kebab.md

@@ -1,4 +1,4 @@
-Базовый пример кебаб-меню.
+### Базовый пример
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';
@@ -44,7 +44,7 @@ let Card = ({ name, post }) => (
 </Gapped>;
 ```
 
-Различные размеры кебаб-меню.
+### Размер
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';
@@ -84,7 +84,7 @@ let Card = ({ title, size }) => (
 </Gapped>
 ```
 
-Кебаб-меню с выпадашкой слева.
+### Кебаб-меню с выпадашкой слева
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';
@@ -121,7 +121,7 @@ let Card = ({ title }) => (
 <Card title="С выпадашкой слева" />
 ```
 
-С кастомным действием при открытии.
+### Кастомное действие при открытии
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';
@@ -160,7 +160,7 @@ let Card = ({ title }) => (
 <Card title="С кастомным действием" />
 ```
 
-С иконками и включенным по-умолчанию автоматическим выравниванием текста.
+### Иконка и автовыравнивание
 
 ```jsx harmony
 import { Button, MenuHeader, MenuItem, MenuSeparator, Kebab } from '@skbkontur/react-ui';
@@ -174,7 +174,7 @@ import OkIcon from '@skbkontur/react-icons/Ok';
 </Kebab>;
 ```
 
-С иконками и отключенным автоматическим выравниванием текста.
+### Иконка и отключенное автовыравнивание
 
 ```jsx harmony
 import { Button, MenuHeader, MenuItem, MenuSeparator, Kebab } from '@skbkontur/react-ui';
@@ -188,7 +188,7 @@ import OkIcon from '@skbkontur/react-icons/Ok';
 </Kebab>
 ```
 
-Отключенное кебаб-меню.
+### Отключенное кебаб-меню
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';
@@ -224,7 +224,7 @@ let Card = ({ title }) => (
 <Card title="Не нажимается :(" />
 ```
 
-Кебаб-меню с отключенной анимацией.
+### Отключенная анимация
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';
@@ -260,7 +260,7 @@ let Card = ({ title }) => (
 <Card title="Без анимации" />
 ```
 
-Кебаб-меню с заданной высотой.
+### Высота
 
 ```jsx harmony
 import EditIcon from '@skbkontur/react-icons/Edit';

package/components/Kebab/__creevey__/Kebab.creevey.mts

@@ -0,0 +1,147 @@
+import { story, kind, test } from 'creevey';
+import { Key } from 'selenium-webdriver';
+
+import { PopupMenuDataTids } from '../../../internal/PopupMenu/tids';
+import { delay } from '../../../lib/delay';
+const textAlignmentTests = () => {
+  test('opened', async (context) => {
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .click(context.webdriver.findElement({ css: `[data-tid~="${PopupMenuDataTids.caption}"]` }))
+      .perform();
+    await delay(1000);
+    await context.matchImage(await context.takeScreenshot(), 'opened');
+  });
+};
+
+const kebabTests = () => {
+  test('plain', async (context) => {
+    await context.matchImage(await context.takeScreenshot(), 'plain');
+  });
+
+  test('hovered', async (context) => {
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .move({
+        origin: context.webdriver.findElement({ css: '[data-comp-name~="Kebab"]' }),
+      })
+      .perform();
+    await context.matchImage(await context.takeScreenshot(), 'hovered');
+  });
+
+  test('clicked', async (context) => {
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .click(context.webdriver.findElement({ css: '[data-comp-name~="Kebab"]' }))
+      .perform();
+    await context.matchImage(await context.takeScreenshot(), 'clicked');
+  });
+
+  test('clickedOnButton2ndTime', async (context) => {
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .click(context.webdriver.findElement({ css: '[data-comp-name~="Kebab"]' }))
+      .click(context.webdriver.findElement({ css: '[data-comp-name~="Kebab"]' }))
+      .perform();
+    await context.matchImage(await context.takeScreenshot(), 'clickedOnButton2ndTime');
+  });
+
+  test('tabPress', async (context) => {
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .sendKeys(Key.TAB)
+      .perform();
+    await context.matchImage(await context.takeScreenshot(), 'tabPress');
+  });
+
+  test('enterPress', async (context) => {
+    await context.webdriver
+      .actions({
+        bridge: true,
+      })
+      .sendKeys(Key.TAB)
+      .sendKeys(Key.ENTER)
+      .perform();
+    await context.matchImage(await context.takeScreenshot(), 'enterPress');
+  });
+};
+
+kind('Kebab', () => {
+  story('Small', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        'hover does not work in chrome': {
+          in: ['chrome2022', 'chrome2022Dark'],
+          tests: ['hovered', 'clickedOnButton2ndTime'],
+        },
+      },
+    });
+
+    kebabTests();
+  });
+
+  story('Medium', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        'hover does not work in chrome': {
+          in: ['chrome2022', 'chrome2022Dark'],
+          tests: ['hovered', 'clickedOnButton2ndTime'],
+        },
+      },
+    });
+
+    kebabTests();
+  });
+
+  story('Large', ({ setStoryParameters }) => {
+    setStoryParameters({
+      skip: {
+        'hover does not work in chrome': {
+          in: ['chrome2022', 'chrome2022Dark'],
+          tests: ['hovered', 'clickedOnButton2ndTime'],
+        },
+      },
+    });
+
+    kebabTests();
+  });
+
+  story('MobileExampleWithHorizontalPadding', ({ setStoryParameters }) => {
+    setStoryParameters({ captureElement: null });
+
+    test('opened', async (context) => {
+      await context.webdriver
+        .actions({ bridge: true })
+        .click(context.webdriver.findElement({ css: '[data-comp-name~="Kebab"]' }))
+        .perform();
+      await delay(200);
+      await context.webdriver
+        .actions({ bridge: true })
+        .move({ origin: context.webdriver.findElement({ css: '[data-comp-name~="MenuItem"]' }) })
+        .perform();
+      await delay(1000);
+      await context.matchImage(await context.takeScreenshot(), 'opened');
+    });
+  });
+  story('WithItemsAndIcons', ({ setStoryParameters }) => {
+    setStoryParameters({ skip: { 'themes dont affect logic': { in: /^(?!\bchrome2022\b)/ } } });
+
+    textAlignmentTests();
+  });
+
+  story('WithItemsAndIconsWithoutTextAlignment', ({ setStoryParameters }) => {
+    setStoryParameters({ skip: { 'themes dont affect logic': { in: /^(?!\bchrome2022\b)/ } } });
+
+    textAlignmentTests();
+  });
+});

package/components/Kebab/__docs__/Kebab.mdx

@@ -0,0 +1,28 @@
+import * as KebabStories from './Kebab.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={KebabStories} />
+
+# Kebab
+
+[Компонент в Контур.Гайдах](https://guides.kontur.ru/components/actions/kebab-menu/)
+
+[Компонент в Figma](https://www.figma.com/file/87ScqxPzJpF9DcVBNYWOjM/%E2%9A%A1-Kontur-UI-Modern-Layout?node-id=230%3A2540)
+
+<Description />
+
+## Базовый пример
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+## Примеры использования
+
+<Stories title="" includePrimary={false} />

package/components/Link/Link/Link.js

@@ -91,15 +91,32 @@ export var Link = rootNode(_class = (_Link = /*#__PURE__*/function (_React$Compo
         position: "right"
       });
       var nonInteractive = disabled || loading;
-      var outlineNode = /*#__PURE__*/
-      React.createElement("div", {
-        style: {
-          zIndex: -1
-        },
-        className: cx(styles.outline(_this.theme), warning && styles.outlineWarning(_this.theme), error && styles.outlineError(_this.theme))
-      });
+      var getUseStyles = function getUseStyles() {
+        switch (use) {
+          case 'default':
+            return styles["default"](_this.theme);
+          case 'danger':
+            return styles.danger(_this.theme);
+          case 'success':
+            return styles.success(_this.theme);
+          case 'grayed':
+            return styles.grayed(_this.theme);
+        }
+      };
+      var getUseLineFocusStyles = function getUseLineFocusStyles() {
+        switch (use) {
+          case 'default':
+            return styles.lineFocus(_this.theme);
+          case 'danger':
+            return styles.lineFocusDanger(_this.theme);
+          case 'success':
+            return styles.lineFocusSuccess(_this.theme);
+          case 'grayed':
+            return styles.lineFocusGrayed(_this.theme);
+        }
+      };
       var rootProps = _extends({}, rest, {
-        className: cx((_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[resetButton()] = Root === 'button', _cx[styles.focus(_this.theme)] = isFocused, _cx[styles.disabled(_this.theme)] = disabled || loading, _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.button(_this.theme)] = !!_button, _cx[styles.buttonOpened(_this.theme)] = !!_buttonOpened, _cx[styles.lineFocus(_this.theme)] = isFocused && use === 'default', _cx[styles.lineFocusSuccess(_this.theme)] = isFocused && use === 'success', _cx[styles.lineFocusDanger(_this.theme)] = isFocused && use === 'danger', _cx[styles.lineFocusGrayed(_this.theme)] = isFocused && use === 'grayed', _cx)),
+        className: cx((_cx = {}, _cx[styles.root(_this.theme)] = true, _cx[resetButton()] = Root === 'button', _cx[styles.focus(_this.theme)] = isFocused, _cx[styles.disabled(_this.theme)] = disabled || loading, _cx[getUseStyles()] = true, _cx[styles.useGrayedFocus(_this.theme)] = use === 'grayed' && focused, _cx[styles.button(_this.theme)] = !!_button, _cx[styles.buttonOpened(_this.theme)] = !!_buttonOpened, _cx[styles.warning(_this.theme)] = warning, _cx[styles.error(_this.theme)] = error, _cx[getUseLineFocusStyles()] = isFocused, _cx)),
         onClick: _this.handleClick,
         onFocus: _this.handleFocus,
         onBlur: _this.handleBlur,
@@ -114,7 +131,7 @@ export var Link = rootNode(_class = (_Link = /*#__PURE__*/function (_React$Compo
           "data-tid": LinkDataTids.root
         }, rootProps, getVisualStateDataAttributes({
           disabled: disabled
-        })), leftIconElement, outlineNode, _this.props.children, rightIconElement, arrow)
+        })), leftIconElement, _this.props.children, rightIconElement, arrow)
       );
     };
     _this.handleFocus = function () {

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

@@ -1 +1 @@
-{"version":3,"names":["React","globalObject","resetButton","keyListener","ThemeContext","isExternalLink","CommonWrapper","cx","rootNode","createPropsGetter","ThemeFactory","getVisualStateDataAttributes","styles","LinkIcon","LINK_DEFAULT_COMPONENT","LinkDataTids","root","Link","_class","_Link","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","state","focusedByTab","getTabIndex","_ref","nonInteractive","_ref$tabIndex","tabIndex","getRel","isAnchorProps","props","_this$props","rel","href","undefined","renderMain","_cx","disabled","icon","rightIcon","use","loading","_button","_buttonOpened","Root","component","_props$focused","focused","error","warning","theme","rest","_objectWithoutPropertiesLoose","_excluded","arrow","createElement","className","isFocused","leftIconElement","position","rightIconElement","hasBothIcons","outlineNode","style","zIndex","outline","outlineWarning","outlineError","rootProps","_extends","focus","useDefault","useSuccess","useDanger","useGrayed","useGrayedFocus","button","buttonOpened","lineFocus","lineFocusSuccess","lineFocusDanger","lineFocusGrayed","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","children","requestAnimationFrame","isTabPressed","setState","event","_this$props2","_inheritsLoose","_proto","prototype","render","_this2","Consumer","create","rootNodeRef","setRootNode","Component","__KONTUR_REACT_UI__","displayName"],"sources":["Link.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { ButtonLinkAllowedValues } from '../../typings/button-link';\nimport { resetButton } from '../../lib/styles/Mixins';\nimport { PolymorphicPropsWithoutRef } from '../../typings/polymorphic-component';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes';\n\nimport { styles } from './Link.styles';\nimport { LinkIcon } from './LinkIcon';\n\nexport interface LinkInnerProps extends CommonProps {\n  /**\n   * Отключенное состояние.\n   */\n  disabled?: boolean;\n  /**\n   * Добавляет ссылке иконку слева.\n   */\n  icon?: React.ReactElement;\n  /**\n   * Добавляет ссылке иконку справа.\n   */\n  rightIcon?: React.ReactElement;\n  /**\n   * Тема ссылки.\n   */\n  use?: 'default' | 'success' | 'danger' | 'grayed';\n  /**\n   * @ignore\n   */\n  _button?: boolean;\n  /**\n   * @ignore\n   */\n  _buttonOpened?: boolean;\n  /**\n   * HTML-атрибут `tabindex`.\n   */\n  tabIndex?: number;\n  /**\n   * Переводит ссылку в состояние загрузки.\n   */\n  loading?: boolean;\n  /**\n   * Обычный объект с переменными темы.\n   * Он будет объединён с темой из контекста.\n   */\n  theme?: ThemeIn;\n  /**\n   * @ignore\n   */\n  focused?: boolean;\n  /**\n   * Состояние валидации при ошибке.\n   */\n  error?: boolean;\n  /**\n   * Состояние валидации при предупреждении.\n   */\n  warning?: boolean;\n}\n\nconst LINK_DEFAULT_COMPONENT: ButtonLinkAllowedValues = '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 * Элемент ссылки из HTML.\n */\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 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 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) ? ' 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={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\n    const outlineNode = (\n      <div\n        style={{ zIndex: -1 }}\n        className={cx(\n          styles.outline(this.theme),\n          warning && styles.outlineWarning(this.theme),\n          error && styles.outlineError(this.theme),\n        )}\n      />\n    );\n\n    const rootProps = {\n      ...rest,\n      className: cx({\n        [styles.root(this.theme)]: true,\n        [resetButton()]: Root === 'button',\n        [styles.focus(this.theme)]: isFocused,\n        [styles.disabled(this.theme)]: disabled || loading,\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.button(this.theme)]: !!_button,\n        [styles.buttonOpened(this.theme)]: !!_buttonOpened,\n        [styles.lineFocus(this.theme)]: isFocused && use === 'default',\n        [styles.lineFocusSuccess(this.theme)]: isFocused && use === 'success',\n        [styles.lineFocusDanger(this.theme)]: isFocused && use === 'danger',\n        [styles.lineFocusGrayed(this.theme)]: isFocused && use === 'grayed',\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    return (\n      <Root data-tid={LinkDataTids.root} {...rootProps} {...getVisualStateDataAttributes({ disabled })}>\n        {leftIconElement}\n        {outlineNode}\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      globalObject.requestAnimationFrame?.(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({ focusedByTab: false });\n  };\n\n  private handleClick = (event: React.MouseEvent) => {\n    const { onClick, disabled, loading } = this.props;\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"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","globalObject","resetButton","keyListener","ThemeContext","isExternalLink","CommonWrapper","cx","rootNode","createPropsGetter","ThemeFactory","getVisualStateDataAttributes","styles","LinkIcon","LINK_DEFAULT_COMPONENT","LinkDataTids","root","Link","_class","_Link","_React$Component","_this","_len","arguments","length","args","Array","_key","call","apply","concat","getProps","defaultProps","state","focusedByTab","getTabIndex","_ref","nonInteractive","_ref$tabIndex","tabIndex","getRel","isAnchorProps","props","_this$props","rel","href","undefined","renderMain","_cx","disabled","icon","rightIcon","use","loading","_button","_buttonOpened","Root","component","_props$focused","focused","error","warning","theme","rest","_objectWithoutPropertiesLoose","_excluded","arrow","createElement","className","isFocused","leftIconElement","position","rightIconElement","hasBothIcons","getUseStyles","danger","success","grayed","getUseLineFocusStyles","lineFocus","lineFocusDanger","lineFocusSuccess","lineFocusGrayed","rootProps","_extends","focus","useGrayedFocus","button","buttonOpened","onClick","handleClick","onFocus","handleFocus","onBlur","handleBlur","children","requestAnimationFrame","isTabPressed","setState","event","_this$props2","_inheritsLoose","_proto","prototype","render","_this2","Consumer","create","rootNodeRef","setRootNode","Component","__KONTUR_REACT_UI__","displayName"],"sources":["Link.tsx"],"sourcesContent":["import React from 'react';\nimport { globalObject } from '@skbkontur/global-object';\n\nimport { ButtonLinkAllowedValues } from '../../lib/types/button-link';\nimport { resetButton } from '../../lib/styles/Mixins';\nimport { PolymorphicPropsWithoutRef } from '../../lib/types/polymorphic-component';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { isExternalLink } from '../../lib/utils';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter, DefaultizedProps } from '../../lib/createPropsGetter';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes';\n\nimport { styles } from './Link.styles';\nimport { LinkIcon } from './LinkIcon';\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 * Элемент ссылки из HTML.\n */\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 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 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) ? ' 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={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 styles.default(this.theme);\n        case 'danger':\n          return styles.danger(this.theme);\n        case 'success':\n          return styles.success(this.theme);\n        case 'grayed':\n          return styles.grayed(this.theme);\n      }\n    };\n    const getUseLineFocusStyles = () => {\n      switch (use) {\n        case 'default':\n          return styles.lineFocus(this.theme);\n        case 'danger':\n          return styles.lineFocusDanger(this.theme);\n        case 'success':\n          return styles.lineFocusSuccess(this.theme);\n        case 'grayed':\n          return styles.lineFocusGrayed(this.theme);\n      }\n    };\n    const rootProps = {\n      ...rest,\n      className: cx({\n        [styles.root(this.theme)]: true,\n        [resetButton()]: Root === 'button',\n        [styles.focus(this.theme)]: isFocused,\n        [styles.disabled(this.theme)]: disabled || loading,\n        [getUseStyles()]: true,\n        [styles.useGrayedFocus(this.theme)]: use === 'grayed' && focused,\n        [styles.button(this.theme)]: !!_button,\n        [styles.buttonOpened(this.theme)]: !!_buttonOpened,\n        [styles.warning(this.theme)]: warning,\n        [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    return (\n      <Root data-tid={LinkDataTids.root} {...rootProps} {...getVisualStateDataAttributes({ disabled })}>\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      globalObject.requestAnimationFrame?.(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({ focusedByTab: false });\n  };\n\n  private handleClick = (event: React.MouseEvent) => {\n    const { onClick, disabled, loading } = this.props;\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"],"mappings":"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","ignoreList":[]}

package/components/Link/Link.d.ts

@@ -1,60 +1,36 @@
 import React from 'react';
-import { ButtonLinkAllowedValues } from '../../typings/button-link';
-import { PolymorphicPropsWithoutRef } from '../../typings/polymorphic-component';
+import { ButtonLinkAllowedValues } from '../../lib/types/button-link';
+import { PolymorphicPropsWithoutRef } from '../../lib/types/polymorphic-component';
 import { ThemeIn } from '../../lib/theming/Theme';
 import { CommonProps } from '../../internal/CommonWrapper';
 export interface LinkInnerProps extends CommonProps {
-    /**
-     * Отключенное состояние.
-     */
+    /** Делает компонент недоступным. */
     disabled?: boolean;
-    /**
-     * Добавляет ссылке иконку слева.
-     */
+    /** Добавляет иконку слева. */
     icon?: React.ReactElement;
-    /**
-     * Добавляет ссылке иконку справа.
-     */
+    /** Добавляет иконку справа. */
     rightIcon?: React.ReactElement;
-    /**
-     * Тема ссылки.
-     */
+    /** Задает тему ссылки. */
     use?: 'default' | 'success' | 'danger' | 'grayed';
-    /**
-     * @ignore
-     */
+    /** @ignore */
     _button?: boolean;
-    /**
-     * @ignore
-     */
+    /** @ignore */
     _buttonOpened?: boolean;
-    /**
-     * HTML-атрибут `tabindex`.
-     */
+    /** Задает HTML-атрибут `tabindex`. */
     tabIndex?: number;
-    /**
-     * Переводит ссылку в состояние загрузки.
-     */
+    /** Переводит кнопку в состояние загрузки. */
     loading?: boolean;
-    /**
-     * Обычный объект с переменными темы.
-     * Он будет объединён с темой из контекста.
-     */
+    /** Задает объект с переменными темы. Он будет объединён с темой из контекста. */
     theme?: ThemeIn;
-    /**
-     * @ignore
-     */
+    /** Задает состояние фокуса.
+     * @ignore */
     focused?: boolean;
-    /**
-     * Состояние валидации при ошибке.
-     */
+    /** Переводит контрол в состояние валидации "ошибка". */
     error?: boolean;
-    /**
-     * Состояние валидации при предупреждении.
-     */
+    /** Переводит контрол в состояние валидации "предупреждение". */
     warning?: boolean;
 }
-declare const LINK_DEFAULT_COMPONENT: ButtonLinkAllowedValues;
+declare const LINK_DEFAULT_COMPONENT = "a";
 export type LinkProps<C extends ButtonLinkAllowedValues = typeof LINK_DEFAULT_COMPONENT> = PolymorphicPropsWithoutRef<LinkInnerProps, C>;
 export interface LinkState {
     focusedByTab: boolean;

package/components/Link/Link.md

@@ -1,11 +1,11 @@
-По умолчанию, ссылка принимает все пропы `HTMLAnchorElement`.
+### Базовый пример
 
 ```jsx harmony
 <Link href="https://kontur.ru" target="_blank">Обычная ссылка</Link>
 ```
 
+### Корневой элемент
 Cсылка может рендерить кнопку в качестве корневого элемента, c помощью пропа `component`. Cсылка принимает все пропы переданного в `component` компонента.
-
 Рекомендуется к использованию вместо кнопки с `use=link`, если нужна кнопка с визуалом ссылки.
 
 ```jsx harmony
@@ -14,7 +14,8 @@ import { Link } from '@skbkontur/react-ui';
 <Link component='button'>Кнопка, но выглядит как ссылка</Link>
 ```
 
-Также, c помощью пропа `component`, ссылка может рендерить компонент `Link` из `react router` в качестве корневого элемента.
+### Проп `component`
+С помощью пропа `component`, ссылка может рендерить компонент `Link` из `react router` в качестве корневого элемента.
 
 ```jsx static
 import { Link } from '@skbkontur/react-ui';
@@ -25,7 +26,7 @@ import { Link as RouterLink, BrowserRouter } from 'react-router-dom';
 </BrowserRouter>
 ```
 
-Ссылка может иметь различные стили, а также быть отключенной.
+### Стили и disabled
 
 ```jsx harmony
 import { Gapped } from '@skbkontur/react-ui';
@@ -39,7 +40,7 @@ import { Gapped } from '@skbkontur/react-ui';
 </Gapped>;
 ```
 
-Пример ссылки с иконкой.
+### Иконка
 
 ```jsx harmony
 import { Gapped } from '@skbkontur/react-ui';
@@ -52,7 +53,7 @@ import { CheckAIcon16Light } from '@skbkontur/icons/CheckAIcon16Light';
 </Gapped>
 ```
 
-Пример ссылок ведущих на внешние ресурсы.
+### Ссылки, ведущие на внешние ресурсы
 
 _Примечание_:
 
@@ -73,7 +74,7 @@ import { Gapped } from '@skbkontur/react-ui';
 </Gapped>
 ```
 
-Ссылка в состоянии загрузки.
+### Состояние загрузки
 
 **Поведение**: если у ссылки есть иконка, она заменяется на спиннер, когда иконки две заменяется только левая.
 
@@ -94,7 +95,7 @@ const [isLoading, setIsLoading] = React.useState(false);
 </Gapped>
 ```
 
-Ссылка может иметь кастомное действие при нажатии.
+### Кастомное действие при нажатии
 
 ```jsx harmony
 import { Toast } from '@skbkontur/react-ui';
@@ -102,7 +103,7 @@ import { Toast } from '@skbkontur/react-ui';
 <Link onClick={() => Toast.push("Ты нажал на ссылку!")}>Ссылка с кастомным действием</Link>
 ```
 
-Пример ссылки с пропом `theme`
+### Проп `theme`
 
 ```jsx harmony
 import { Link, Gapped } from '@skbkontur/react-ui';
@@ -114,7 +115,7 @@ import { Link, Gapped } from '@skbkontur/react-ui';
 ```
 
 
-Пример кастомизации ссылки
+### Кастомизация ссылки
 
 ```jsx harmony
 import { Toast, Button } from "@skbkontur/react-ui";
@@ -153,7 +154,7 @@ const tdStyle = {
   padding: '8px',
 };
 
-const renderExampleRow = (title, styles, index) => {
+const renderExampleRow = (title, styles) => {
     return (
         <tr>
           <td style={tdStyle}>{title}</td>