@skbkontur/react-ui 0.0.0-b203c99d11 → 0.0.0-bb4cbfe9c6

package/components/Input/Input.styles.d.ts

@@ -1,33 +1,42 @@
-export declare const jsStyles: {
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
     wrapper(): string;
-    root(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+    root(t: Theme): string;
     borderless(): string;
-    useDefaultColor(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    focus(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    focusFallback(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    placeholder(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    input(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    warning(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    warningFallback(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    error(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    errorFallback(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    disabled(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    blink(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    sizeSmall(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    sizeSmallFallback(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    sizeMedium(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    sizeMediumFallback(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    sizeLarge(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    sizeLargeFallback(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    prefix(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    suffix(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+    useDefaultColor(t: Theme): string;
+    focus(t: Theme): string;
+    focusFallback(t: Theme): string;
+    placeholder(t: Theme): string;
+    placeholderFocus(t: Theme): string;
+    placeholderDisabled(t: Theme): string;
+    input(t: Theme): string;
+    inputFocus(t: Theme): string;
+    inputDisabled(t: Theme): string;
+    warning(t: Theme): string;
+    warningFallback(t: Theme): string;
+    error(t: Theme): string;
+    errorFallback(t: Theme): string;
+    disabled(t: Theme): string;
+    blink(t: Theme): string;
+    sizeSmall(t: Theme): string;
+    sizeSmallFallback(t: Theme): string;
+    sizeMedium(t: Theme): string;
+    sizeMediumFallback(t: Theme): string;
+    sizeLarge(t: Theme): string;
+    sizeLargeFallback(t: Theme): string;
+    prefix(t: Theme): string;
+    prefixDisabled(t: Theme): string;
+    suffix(t: Theme): string;
+    suffixDisabled(t: Theme): string;
     sideContainer(): string;
     rightContainer(): string;
     icon(): string;
-    leftIconSmall(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    rightIconSmall(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    leftIconMedium(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    rightIconMedium(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    leftIconLarge(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    rightIconLarge(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+    iconDisabled(): string;
+    leftIconSmall(t: Theme): string;
+    rightIconSmall(t: Theme): string;
+    leftIconMedium(t: Theme): string;
+    rightIconMedium(t: Theme): string;
+    leftIconLarge(t: Theme): string;
+    rightIconLarge(t: Theme): string;
+    hideBlinkingCursor(): string;
 };

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

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

package/components/Kebab/Kebab/Kebab.js

@@ -1,18 +1,23 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
 import React from 'react';
 import PropTypes from 'prop-types';
-import cn from 'classnames';
 import { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from "../../../lib/events/keyboard/identifiers";
 import * as LayoutEvents from "../../../lib/LayoutEvents";
-import { tabListener } from "../../../lib/events/tabListener";
+import { keyListener } from "../../../lib/events/keyListener";
 import { PopupMenu } from "../../../internal/PopupMenu";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { MenuKebabIcon } from "../../../internal/icons/16px";
 import { isTestEnv } from "../../../lib/currentEnvironment";
 import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { jsStyles } from "../Kebab.styles";
-export var Kebab = /*#__PURE__*/function (_React$Component) {
+import { cx } from "../../../lib/theming/Emotion";
+import { rootNode } from "../../../lib/rootNode";
+import { styles } from "../Kebab.styles";
+export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Kebab, _React$Component);
 
   function Kebab() {
@@ -28,7 +33,6 @@ export var Kebab = /*#__PURE__*/function (_React$Component) {
       focusedByTab: false,
       anchor: null
     };
-    _this.theme = void 0;
     _this.listener = {
       remove: function remove() {
         return undefined;
@@ -36,7 +40,7 @@ export var Kebab = /*#__PURE__*/function (_React$Component) {
     };
 
     _this.renderCaption = function (captionProps) {
-      var _cn;
+      var _cx;
 
       var disabled = _this.props.disabled;
 
@@ -58,7 +62,7 @@ export var Kebab = /*#__PURE__*/function (_React$Component) {
         onKeyDown: handleCaptionKeyDown,
         onFocus: _this.handleFocus,
         onBlur: _this.handleBlur,
-        className: cn((_cn = {}, _cn[jsStyles.kebab()] = true, _cn[jsStyles.opened()] = captionProps.opened, _cn[jsStyles.disabled()] = disabled, _cn[jsStyles.focused(_this.theme)] = _this.state.focusedByTab, _cn))
+        className: cx((_cx = {}, _cx[styles.kebab(_this.theme)] = true, _cx[styles.opened(_this.theme)] = captionProps.opened, _cx[styles.disabled()] = disabled, _cx[styles.focused(_this.theme)] = _this.state.focusedByTab, _cx))
       }, _this.renderIcon());
     };
 
@@ -90,8 +94,8 @@ export var Kebab = /*#__PURE__*/function (_React$Component) {
       if (!_this.props.disabled) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
-        process.nextTick(function () {
-          if (tabListener.isTabPressed) {
+        requestAnimationFrame(function () {
+          if (keyListener.isTabPressed) {
             _this.setState({
               focusedByTab: true
             });
@@ -129,8 +133,9 @@ export var Kebab = /*#__PURE__*/function (_React$Component) {
       _this2.theme = theme;
       return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
         value: ThemeFactory.create({
-          popupPinOffset: '15px',
-          popupMargin: '5px'
+          popupPinOffset: theme.kebabPinOffset,
+          popupMargin: theme.kebabMargin,
+          popupPinSize: theme.kebabPinSize
         }, theme)
       }, _this2.renderMain());
     });
@@ -140,54 +145,28 @@ export var Kebab = /*#__PURE__*/function (_React$Component) {
     var _this$props = this.props,
         disabled = _this$props.disabled,
         positions = _this$props.positions;
-    return /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement(PopupMenu, {
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), /*#__PURE__*/React.createElement(PopupMenu, {
       popupHasPin: true,
       positions: positions,
       onChangeMenuState: this.handleChangeMenuState,
       caption: this.renderCaption,
-      disableAnimations: this.props.disableAnimations
+      disableAnimations: this.props.disableAnimations,
+      menuMaxHeight: this.props.menuMaxHeight
     }, !disabled && this.props.children));
   };
 
   _proto.renderIcon = function renderIcon() {
-    switch (this.props.size) {
-      case 'small':
-        return /*#__PURE__*/React.createElement("div", {
-          className: jsStyles.iconsmall()
-        }, /*#__PURE__*/React.createElement(MenuKebabIcon, {
-          size: "14px",
-          color: "#757575"
-        }));
-
-      case 'medium':
-        return /*#__PURE__*/React.createElement("div", {
-          className: jsStyles.iconmedium()
-        }, /*#__PURE__*/React.createElement(MenuKebabIcon, {
-          size: "18px",
-          color: "#757575"
-        }));
-
-      case 'large':
-        return /*#__PURE__*/React.createElement("div", {
-          className: jsStyles.iconlarge()
-        }, /*#__PURE__*/React.createElement(MenuKebabIcon, {
-          size: "20px",
-          color: "#757575",
-          style: {
-            verticalAlign: -2
-          }
-        }));
+    var _cx2;
 
-      default:
-        throw new Error("Unexpected size '" + this.props.size + "'");
-    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: cx((_cx2 = {}, _cx2[styles.icon()] = true, _cx2[styles.iconsmall()] = this.props.size === 'small', _cx2[styles.iconmedium()] = this.props.size === 'medium', _cx2[styles.iconlarge()] = this.props.size === 'large', _cx2))
+    }, this.props.icon);
   };
 
   return Kebab;
-}(React.Component);
-Kebab.__KONTUR_REACT_UI__ = 'Kebab';
-Kebab.propTypes = {};
-Kebab.defaultProps = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Kebab', _class2.propTypes = {}, _class2.defaultProps = {
   onOpen: function onOpen() {
     return undefined;
   },
@@ -196,25 +175,26 @@ Kebab.defaultProps = {
   },
   positions: ['bottom left', 'bottom right', 'top left', 'top right'],
   size: 'small',
-  disableAnimations: isTestEnv
-};
+  disableAnimations: isTestEnv,
+  icon: /*#__PURE__*/React.createElement(MenuKebabIcon, null)
+}, _temp)) || _class;
 Kebab.propTypes = {
   children: PropTypes.node,
   disabled: PropTypes.bool,
   menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
 
-  /**
-   * Размер кебаба small 14px | large 20px
+  /**
+   * Размер кебаба small 14px | large 20px
    */
   size: PropTypes.string,
 
-  /**
-   * Коллбек, вызывающийся перед закрытием кебаба
+  /**
+   * Коллбек, вызывающийся перед закрытием кебаба
    */
   onClose: PropTypes.func,
 
-  /**
-   * Коллбек, вызывающийся перед открытием кебаба
+  /**
+   * Коллбек, вызывающийся перед открытием кебаба
    */
   onOpen: PropTypes.func
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","cn","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","tabListener","PopupMenu","ThemeContext","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","jsStyles","Kebab","state","opened","focusedByTab","anchor","theme","listener","remove","undefined","renderCaption","captionProps","disabled","props","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","kebab","focused","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","onOpen","onClose","process","nextTick","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","popupMargin","renderMain","positions","disableAnimations","children","size","iconsmall","iconmedium","iconlarge","verticalAlign","Error","Component","__KONTUR_REACT_UI__","propTypes","defaultProps","node","bool","menuMaxHeight","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport cn from 'classnames';\r\n\r\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { tabListener } from '../../lib/events/tabListener';\r\nimport { PopupMenu, PopupMenuCaptionProps } from '../../internal/PopupMenu';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { PopupPosition } from '../../internal/Popup';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { MenuKebabIcon } from '../../internal/icons/16px';\r\nimport { isTestEnv } from '../../lib/currentEnvironment';\r\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\r\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './Kebab.styles';\r\n\r\nexport interface KebabProps extends CommonProps {\r\n  disabled?: boolean;\r\n  /**\r\n   * Функция вызываемая при закрытии выпадашки\r\n   * @default () => undefined\r\n   */\r\n  onClose: () => void;\r\n  /**\r\n   * Функция вызываемая при открытии выпадашки\r\n   * @default () => undefined\r\n   */\r\n  onOpen: () => void;\r\n  size: 'small' | 'medium' | 'large';\r\n  /**\r\n   * Список позиций доступных для расположения выпадашки\r\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использоваться первая из этого списка\r\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\r\n   */\r\n  positions: PopupPosition[];\r\n  menuMaxHeight?: number | string;\r\n  /**\r\n   * Не показывать анимацию\r\n   */\r\n  disableAnimations: boolean;\r\n}\r\n\r\nexport interface KebabState {\r\n  anchor: Nullable<HTMLElement>;\r\n  focusedByTab: boolean;\r\n  opened: boolean;\r\n}\r\n\r\nexport class Kebab extends React.Component<KebabProps, KebabState> {\r\n  public static __KONTUR_REACT_UI__ = 'Kebab';\r\n\r\n  public static propTypes = {};\r\n\r\n  public static defaultProps = {\r\n    onOpen: () => undefined,\r\n    onClose: () => undefined,\r\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\r\n    size: 'small',\r\n    disableAnimations: isTestEnv,\r\n  };\r\n\r\n  public state = {\r\n    opened: false,\r\n    focusedByTab: false,\r\n    anchor: null,\r\n  };\r\n\r\n  private theme!: Theme;\r\n\r\n  private listener: {\r\n    remove: () => void;\r\n  } = {\r\n    remove: () => undefined,\r\n  };\r\n\r\n  public componentDidMount() {\r\n    /** addListener'у нужен колбэк в аргумент */\r\n    this.listener = LayoutEvents.addListener(() => undefined);\r\n  }\r\n\r\n  public componentWillUnmount() {\r\n    this.listener.remove();\r\n  }\r\n\r\n  public render(): JSX.Element {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return (\r\n            <ThemeContext.Provider\r\n              value={ThemeFactory.create(\r\n                {\r\n                  popupPinOffset: '15px',\r\n                  popupMargin: '5px',\r\n                },\r\n                theme,\r\n              )}\r\n            >\r\n              {this.renderMain()}\r\n            </ThemeContext.Provider>\r\n          );\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  private renderMain() {\r\n    const { disabled, positions } = this.props;\r\n    return (\r\n      <CommonWrapper {...this.props}>\r\n        <PopupMenu\r\n          popupHasPin\r\n          positions={positions}\r\n          onChangeMenuState={this.handleChangeMenuState}\r\n          caption={this.renderCaption}\r\n          disableAnimations={this.props.disableAnimations}\r\n        >\r\n          {!disabled && this.props.children}\r\n        </PopupMenu>\r\n      </CommonWrapper>\r\n    );\r\n  }\r\n\r\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\r\n    const { disabled } = this.props;\r\n    const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\r\n      if (!disabled) {\r\n        this.handleCaptionKeyDown(event, captionProps.openMenu);\r\n      }\r\n    };\r\n\r\n    const handleCaptionClick = () => {\r\n      if (!disabled) {\r\n        captionProps.toggleMenu();\r\n      }\r\n    };\r\n\r\n    return (\r\n      <span\r\n        tabIndex={disabled ? -1 : 0}\r\n        onClick={handleCaptionClick}\r\n        onKeyDown={handleCaptionKeyDown}\r\n        onFocus={this.handleFocus}\r\n        onBlur={this.handleBlur}\r\n        className={cn({\r\n          [jsStyles.kebab()]: true,\r\n          [jsStyles.opened()]: captionProps.opened,\r\n          [jsStyles.disabled()]: disabled,\r\n          [jsStyles.focused(this.theme)]: this.state.focusedByTab,\r\n        })}\r\n      >\r\n        {this.renderIcon()}\r\n      </span>\r\n    );\r\n  };\r\n\r\n  private handleCaptionKeyDown = (\r\n    e: React.KeyboardEvent<HTMLDivElement>,\r\n    openMenu: PopupMenuCaptionProps['openMenu'],\r\n  ) => {\r\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\r\n      e.preventDefault();\r\n      openMenu(true);\r\n    }\r\n  };\r\n\r\n  private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\r\n    this.setState(\r\n      {\r\n        opened: isOpened,\r\n        focusedByTab: !isOpened && restoreFocus,\r\n      },\r\n      () => {\r\n        if (this.props.disabled) {\r\n          return;\r\n        }\r\n\r\n        if (this.state.opened) {\r\n          this.props.onOpen();\r\n        } else {\r\n          this.props.onClose();\r\n        }\r\n      },\r\n    );\r\n  };\r\n\r\n  private handleFocus = () => {\r\n    if (!this.props.disabled) {\r\n      // focus event fires before keyDown eventlistener\r\n      // so we should check tabPressed in async way\r\n      process.nextTick(() => {\r\n        if (tabListener.isTabPressed) {\r\n          this.setState({ focusedByTab: true });\r\n        }\r\n      });\r\n    }\r\n  };\r\n\r\n  private handleBlur = () => {\r\n    this.setState({\r\n      focusedByTab: false,\r\n    });\r\n  };\r\n\r\n  private renderIcon() {\r\n    switch (this.props.size) {\r\n      case 'small':\r\n        return (\r\n          <div className={jsStyles.iconsmall()}>\r\n            <MenuKebabIcon size=\"14px\" color=\"#757575\" />\r\n          </div>\r\n        );\r\n      case 'medium':\r\n        return (\r\n          <div className={jsStyles.iconmedium()}>\r\n            <MenuKebabIcon size=\"18px\" color=\"#757575\" />\r\n          </div>\r\n        );\r\n      case 'large':\r\n        return (\r\n          <div className={jsStyles.iconlarge()}>\r\n            <MenuKebabIcon size=\"20px\" color=\"#757575\" style={{ verticalAlign: -2 }} />\r\n          </div>\r\n        );\r\n      default:\r\n        throw new Error(`Unexpected size '${this.props.size}'`);\r\n    }\r\n  }\r\n}\r\n\r\nKebab.propTypes = {\r\n  children: PropTypes.node,\r\n  disabled: PropTypes.bool,\r\n  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\r\n\r\n  /**\r\n   * Размер кебаба small 14px | large 20px\r\n   */\r\n  size: PropTypes.string,\r\n\r\n  /**\r\n   * Коллбек, вызывающийся перед закрытием кебаба\r\n   */\r\n  onClose: PropTypes.func,\r\n\r\n  /**\r\n   * Коллбек, вызывающийся перед открытием кебаба\r\n   */\r\n  onOpen: PropTypes.func,\r\n};\r\n"]}
+{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","keyListener","PopupMenu","ThemeContext","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","cx","rootNode","styles","Kebab","state","opened","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","props","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","kebab","theme","focused","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","onOpen","onClose","requestAnimationFrame","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","setRootNode","disableAnimations","menuMaxHeight","children","icon","iconsmall","size","iconmedium","iconlarge","Component","__KONTUR_REACT_UI__","propTypes","defaultProps","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { PopupMenu, PopupMenuCaptionProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPosition } from '../../internal/Popup';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles } from './Kebab.styles';\n\nexport interface KebabProps extends CommonProps {\n  disabled?: boolean;\n  /**\n   * Функция вызываемая при закрытии выпадашки\n   * @default () => undefined\n   */\n  onClose: () => void;\n  /**\n   * Функция вызываемая при открытии выпадашки\n   * @default () => undefined\n   */\n  onOpen: () => void;\n  size: 'small' | 'medium' | 'large';\n  /**\n   * Список позиций доступных для расположения выпадашки.\n   *\n   * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.\n   *\n   * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`\n   * @default ['bottom left', 'bottom right', 'top left', 'top right']\n   */\n  positions: PopupPosition[];\n  menuMaxHeight?: number | string;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations: boolean;\n  /**\n   * Кастомная иконка\n   */\n  icon?: React.ReactNode;\n}\n\nexport interface KebabState {\n  anchor: Nullable<HTMLElement>;\n  focusedByTab: boolean;\n  opened: boolean;\n}\n\n@rootNode\nexport class Kebab extends React.Component<KebabProps, KebabState> {\n  public static __KONTUR_REACT_UI__ = 'Kebab';\n\n  public static propTypes = {};\n\n  public static defaultProps = {\n    onOpen: () => undefined,\n    onClose: () => undefined,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n    size: 'small',\n    disableAnimations: isTestEnv,\n    icon: <MenuKebabIcon />,\n  };\n\n  public state = {\n    opened: false,\n    focusedByTab: false,\n    anchor: null,\n  };\n\n  private theme!: Theme;\n  private setRootNode!: TSetRootNode;\n\n  private listener: {\n    remove: () => void;\n  } = {\n    remove: () => undefined,\n  };\n\n  public componentDidMount() {\n    /** addListener'у нужен колбэк в аргумент */\n    this.listener = LayoutEvents.addListener(() => undefined);\n  }\n\n  public componentWillUnmount() {\n    this.listener.remove();\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return (\n            <ThemeContext.Provider\n              value={ThemeFactory.create(\n                {\n                  popupPinOffset: theme.kebabPinOffset,\n                  popupMargin: theme.kebabMargin,\n                  popupPinSize: theme.kebabPinSize,\n                },\n                theme,\n              )}\n            >\n              {this.renderMain()}\n            </ThemeContext.Provider>\n          );\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const { disabled, positions } = this.props;\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <PopupMenu\n          popupHasPin\n          positions={positions}\n          onChangeMenuState={this.handleChangeMenuState}\n          caption={this.renderCaption}\n          disableAnimations={this.props.disableAnimations}\n          menuMaxHeight={this.props.menuMaxHeight}\n        >\n          {!disabled && this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n    const { disabled } = this.props;\n    const handleCaptionKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (!disabled) {\n        this.handleCaptionKeyDown(event, captionProps.openMenu);\n      }\n    };\n\n    const handleCaptionClick = () => {\n      if (!disabled) {\n        captionProps.toggleMenu();\n      }\n    };\n\n    return (\n      <span\n        tabIndex={disabled ? -1 : 0}\n        onClick={handleCaptionClick}\n        onKeyDown={handleCaptionKeyDown}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        className={cx({\n          [styles.kebab(this.theme)]: true,\n          [styles.opened(this.theme)]: captionProps.opened,\n          [styles.disabled()]: disabled,\n          [styles.focused(this.theme)]: this.state.focusedByTab,\n        })}\n      >\n        {this.renderIcon()}\n      </span>\n    );\n  };\n\n  private handleCaptionKeyDown = (\n    e: React.KeyboardEvent<HTMLDivElement>,\n    openMenu: PopupMenuCaptionProps['openMenu'],\n  ) => {\n    if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {\n      e.preventDefault();\n      openMenu(true);\n    }\n  };\n\n  private handleChangeMenuState = (isOpened: boolean, restoreFocus: boolean): void => {\n    this.setState(\n      {\n        opened: isOpened,\n        focusedByTab: !isOpened && restoreFocus,\n      },\n      () => {\n        if (this.props.disabled) {\n          return;\n        }\n\n        if (this.state.opened) {\n          this.props.onOpen();\n        } else {\n          this.props.onClose();\n        }\n      },\n    );\n  };\n\n  private handleFocus = () => {\n    if (!this.props.disabled) {\n      // focus event fires before keyDown eventlistener\n      // so we should check tabPressed in async way\n      requestAnimationFrame(() => {\n        if (keyListener.isTabPressed) {\n          this.setState({ focusedByTab: true });\n        }\n      });\n    }\n  };\n\n  private handleBlur = () => {\n    this.setState({\n      focusedByTab: false,\n    });\n  };\n\n  private renderIcon() {\n    return (\n      <div\n        className={cx({\n          [styles.icon()]: true,\n          [styles.iconsmall()]: this.props.size === 'small',\n          [styles.iconmedium()]: this.props.size === 'medium',\n          [styles.iconlarge()]: this.props.size === 'large',\n        })}\n      >\n        {this.props.icon}\n      </div>\n    );\n  }\n}\n\nKebab.propTypes = {\n  children: PropTypes.node,\n  disabled: PropTypes.bool,\n  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n  /**\n   * Размер кебаба small 14px | large 20px\n   */\n  size: PropTypes.string,\n\n  /**\n   * Коллбек, вызывающийся перед закрытием кебаба\n   */\n  onClose: PropTypes.func,\n\n  /**\n   * Коллбек, вызывающийся перед открытием кебаба\n   */\n  onOpen: PropTypes.func,\n};\n"]}

package/components/Kebab/Kebab.d.ts

@@ -16,8 +16,11 @@ export interface KebabProps extends CommonProps {
     onOpen: () => void;
     size: 'small' | 'medium' | 'large';
     /**
-     * Список позиций доступных для расположения выпадашки
-     * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использоваться первая из этого списка
+     * Список позиций доступных для расположения выпадашки.
+     *
+     * Если во всех позициях выпадашка вылезает за пределы `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: PopupPosition[];
@@ -26,6 +29,10 @@ export interface KebabProps extends CommonProps {
      * Не показывать анимацию
      */
     disableAnimations: boolean;
+    /**
+     * Кастомная иконка
+     */
+    icon?: React.ReactNode;
 }
 export interface KebabState {
     anchor: Nullable<HTMLElement>;
@@ -41,6 +48,7 @@ export declare class Kebab extends React.Component<KebabProps, KebabState> {
         positions: string[];
         size: string;
         disableAnimations: boolean;
+        icon: JSX.Element;
     };
     state: {
         opened: boolean;
@@ -48,6 +56,7 @@ export declare class Kebab extends React.Component<KebabProps, KebabState> {
         anchor: null;
     };
     private theme;
+    private setRootNode;
     private listener;
     componentDidMount(): void;
     componentWillUnmount(): void;