@skbkontur/react-ui 0.0.0-0d47d85432 → 0.0.0-0dca6f33be

package/cjs/components/Kebab/Kebab.js

@@ -1,6 +1,8 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Kebab = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.KebabDataTids = exports.Kebab = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIs = require("react-is");
 
+var _utils = require("../../lib/utils");
 var _identifiers = require("../../lib/events/keyboard/identifiers");
 var LayoutEvents = _interopRequireWildcard(require("../../lib/LayoutEvents"));
 var _keyListener = require("../../lib/events/keyListener");
@@ -16,9 +18,11 @@ var _CommonWrapper = require("../../internal/CommonWrapper");
 var _Emotion = require("../../lib/theming/Emotion");
 var _rootNode = require("../../lib/rootNode");
 var _createPropsGetter = require("../../lib/createPropsGetter");
+var _ThemeHelpers = require("../../lib/theming/ThemeHelpers");
 
-var _Kebab = require("./Kebab.styles");var _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}var
 
+var _Kebab = require("./Kebab.styles");
+var _KebabIcon = require("./KebabIcon");var _class, _class2, _temp;function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 
 
 
@@ -46,17 +50,23 @@ var _Kebab = require("./Kebab.styles");var _class, _class2, _temp;function _getR
 
 
 
+
+var KebabDataTids = {
+  caption: 'Kebab__caption' };exports.KebabDataTids = KebabDataTids;var
 
 
 
 
 
 
-Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Kebab, _React$Component);function Kebab() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
 
 
 
 
+Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Kebab, _React$Component);function Kebab() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+
+
 
 
 
@@ -136,8 +146,9 @@ Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
 
 
-    renderCaption = function (captionProps) {var _cx;
-      var disabled = _this.props.disabled;
+
+    renderCaption = function (captionProps) {
+      var _this$getProps = _this.getProps(),disabled = _this$getProps.disabled,size = _this$getProps.size;
       var handleCaptionKeyDown = function handleCaptionKeyDown(event) {
         if (!disabled) {
           _this.handleCaptionKeyDown(event, captionProps.openMenu);
@@ -152,19 +163,25 @@ Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
 
       return /*#__PURE__*/(
         _react.default.createElement("span", {
+          "data-tid": KebabDataTids.caption,
           tabIndex: disabled ? -1 : 0,
           onClick: handleCaptionClick,
           onKeyDown: handleCaptionKeyDown,
           onFocus: _this.handleFocus,
           onBlur: _this.handleBlur,
-          className: (0, _Emotion.cx)((_cx = {}, _cx[
-          _Kebab.styles.kebab(_this.theme)] = true, _cx[
-          _Kebab.styles.opened(_this.theme)] = captionProps.opened, _cx[
-          _Kebab.styles.disabled()] = disabled, _cx[
-          _Kebab.styles.focused(_this.theme)] = _this.state.focusedByTab, _cx)) },
+          className: (0, _Emotion.cx)(
+          _Kebab.styles.kebab(_this.theme),
+          size === 'small' && _Kebab.styles.kebabSmall(_this.theme),
+          size === 'medium' && _Kebab.styles.kebabMedium(_this.theme),
+          size === 'large' && _Kebab.styles.kebabLarge(_this.theme),
+          (0, _ThemeHelpers.isTheme2022)(_this.theme) && _Kebab.styles.kebab2022(),
+          captionProps.opened && _Kebab.styles.opened(_this.theme),
+          disabled && _Kebab.styles.disabled(),
+          _this.state.focusedByTab && _Kebab.styles.focused(_this.theme)),
 
+          "aria-describedby": _this.props['aria-describedby'] },
 
-        _this.renderIcon()));
+        (0, _ThemeHelpers.isTheme2022)(_this.theme) ? _this.renderIcon2022() : _this.renderIcon()));
 
 
     };_this.
@@ -201,23 +218,42 @@ Kebab = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/functio
       _this.setState({
         focusedByTab: false });
 
-    };return _this;}var _proto = Kebab.prototype;_proto.componentDidMount = function componentDidMount() {/** addListener'у нужен колбэк в аргумент */this.listener = LayoutEvents.addListener(function () {return undefined;});};_proto.componentWillUnmount = function componentWillUnmount() {this.listener.remove();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupPinOffset: theme.kebabPinOffset, popupMargin: theme.kebabMargin, popupPinSize: theme.kebabPinSize }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var disabled = this.props.disabled;var _this$getProps = this.getProps(),positions = _this$getProps.positions,disableAnimations = _this$getProps.disableAnimations,onOpen = _this$getProps.onOpen,onClose = _this$getProps.onClose;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { popupHasPin: true, positions: positions, onChangeMenuState: this.handleChangeMenuState, caption: this.renderCaption, disableAnimations: disableAnimations, menuMaxHeight: this.props.menuMaxHeight, onOpen: onOpen, onClose: onClose }, !disabled && this.props.children));};_proto.
+    };return _this;}var _proto = Kebab.prototype;_proto.componentDidMount = function componentDidMount() {/** addListener'у нужен колбэк в аргумент */this.listener = LayoutEvents.addListener(function () {return undefined;});};_proto.componentWillUnmount = function componentWillUnmount() {this.listener.remove();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: _ThemeFactory.ThemeFactory.create({ popupPinOffset: theme.kebabPinOffset, popupMargin: theme.kebabMargin, popupPinSize: theme.kebabPinSize }, theme) }, _this2.renderMain());});};_proto.renderMain = function renderMain() {var disabled = this.props.disabled;var _this$getProps2 = this.getProps(),positions = _this$getProps2.positions,disableAnimations = _this$getProps2.disableAnimations,onOpen = _this$getProps2.onOpen,onClose = _this$getProps2.onClose;return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement(_PopupMenu.PopupMenu, { popupHasPin: true, positions: positions, onChangeMenuState: this.handleChangeMenuState, caption: this.renderCaption, disableAnimations: disableAnimations, menuMaxHeight: this.props.menuMaxHeight, onOpen: onOpen, onClose: onClose, popupMenuId: this.props.popupMenuId }, !disabled && this.props.children));};_proto.
 
-  renderIcon = function renderIcon() {var _cx2;
-    var _this$getProps2 = this.getProps(),size = _this$getProps2.size,icon = _this$getProps2.icon;
+  renderIcon = function renderIcon() {var _cx;
+    var _this$getProps3 = this.getProps(),size = _this$getProps3.size,_this$getProps3$icon = _this$getProps3.icon,icon = _this$getProps3$icon === void 0 ? /*#__PURE__*/_react.default.createElement(_px.MenuKebabIcon, null) : _this$getProps3$icon;
     return /*#__PURE__*/(
       _react.default.createElement("div", {
-        className: (0, _Emotion.cx)((_cx2 = {}, _cx2[
-        _Kebab.styles.icon()] = true, _cx2[
-        _Kebab.styles.iconsmall()] = size === 'small', _cx2[
-        _Kebab.styles.iconmedium()] = size === 'medium', _cx2[
-        _Kebab.styles.iconlarge()] = size === 'large', _cx2)) },
+        className: (0, _Emotion.cx)((_cx = {}, _cx[
+        _Kebab.styles.icon(this.theme)] = true, _cx[
+        _Kebab.styles.iconsmall(this.theme)] = size === 'small', _cx[
+        _Kebab.styles.iconmedium(this.theme)] = size === 'medium', _cx[
+        _Kebab.styles.iconlarge(this.theme)] = size === 'large', _cx)) },
 
 
       icon));
 
 
-  };return Kebab;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Kebab', _class2.propTypes = {}, _class2.defaultProps = { onOpen: function onOpen() {return undefined;}, onClose: function onClose() {return undefined;}, positions: ['bottom left', 'bottom right', 'top left', 'top right'], size: 'small', disableAnimations: _currentEnvironment.isTestEnv, icon: /*#__PURE__*/_react.default.createElement(_px.MenuKebabIcon, null) }, _temp)) || _class;exports.Kebab = Kebab;
+  };_proto.
+
+  renderIcon2022 = function renderIcon2022() {
+    var _this$getProps4 = this.getProps(),size = _this$getProps4.size,_this$getProps4$icon = _this$getProps4.icon,icon = _this$getProps4$icon === void 0 ? /*#__PURE__*/_react.default.createElement(_KebabIcon.KebabIcon, null) : _this$getProps4$icon;
+
+    if ((0, _reactIs.isElement)(icon) && (0, _utils.isKonturIcon)(icon)) {var _icon$props$size, _icon$props$color;
+      var sizes = {
+        small: parseInt(this.theme.kebabIconSizeSmall),
+        medium: parseInt(this.theme.kebabIconSizeMedium),
+        large: parseInt(this.theme.kebabIconSizeLarge) };
+
+
+      return /*#__PURE__*/_react.default.cloneElement(icon, {
+        size: (_icon$props$size = icon.props.size) != null ? _icon$props$size : sizes[size],
+        color: (_icon$props$color = icon.props.color) != null ? _icon$props$color : this.theme.kebabIconColor });
+
+    }
+
+    return icon;
+  };return Kebab;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Kebab', _class2.propTypes = {}, _class2.defaultProps = { onOpen: function onOpen() {return undefined;}, onClose: function onClose() {return undefined;}, positions: ['bottom left', 'bottom right', 'top left', 'top right'], size: 'small', disableAnimations: _currentEnvironment.isTestEnv }, _temp)) || _class;exports.Kebab = Kebab;
 
 
 Kebab.propTypes = {

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

@@ -1 +1 @@
-{"version":3,"sources":["Kebab.tsx"],"names":["Kebab","rootNode","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","props","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","styles","kebab","theme","opened","focused","renderIcon","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","keyListener","isTabPressed","componentDidMount","LayoutEvents","addListener","componentWillUnmount","render","ThemeFactory","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","disableAnimations","onOpen","onClose","setRootNode","menuMaxHeight","children","size","icon","iconsmall","iconmedium","iconlarge","React","Component","__KONTUR_REACT_UI__","propTypes","isTestEnv","PropTypes","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, PopupMenuProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } 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';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './Kebab.styles';\n\nexport interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose'> {\n  disabled?: boolean;\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?: PopupPositionsType[];\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}\n\ntype DefaultProps = Required<\n  Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations' | 'icon'>\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: 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  private getProps = createPropsGetter(Kebab.defaultProps);\n\n  public state: KebabState = {\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 } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\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={disableAnimations}\n          menuMaxHeight={this.props.menuMaxHeight}\n          onOpen={onOpen}\n          onClose={onClose}\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      focusedByTab: !isOpened && restoreFocus,\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    const { size, icon } = this.getProps();\n    return (\n      <div\n        className={cx({\n          [styles.icon()]: true,\n          [styles.iconsmall()]: size === 'small',\n          [styles.iconmedium()]: size === 'medium',\n          [styles.iconlarge()]: size === 'large',\n        })}\n      >\n        {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"]}
+{"version":3,"sources":["Kebab.tsx"],"names":["KebabDataTids","caption","Kebab","rootNode","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","size","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","handleFocus","handleBlur","styles","kebab","theme","kebabSmall","kebabMedium","kebabLarge","kebab2022","opened","focused","props","renderIcon2022","renderIcon","e","isKeyEnter","isKeySpace","isKeyArrowVertical","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","keyListener","isTabPressed","componentDidMount","LayoutEvents","addListener","componentWillUnmount","render","ThemeFactory","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","renderMain","positions","disableAnimations","onOpen","onClose","setRootNode","menuMaxHeight","popupMenuId","children","icon","iconsmall","iconmedium","iconlarge","sizes","small","parseInt","kebabIconSizeSmall","medium","kebabIconSizeMedium","large","kebabIconSizeLarge","React","cloneElement","color","kebabIconColor","Component","__KONTUR_REACT_UI__","propTypes","isTestEnv","PropTypes","node","bool","oneOfType","string","number","func"],"mappings":"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","sourcesContent":["import React, { AriaAttributes } from 'react';\nimport PropTypes from 'prop-types';\nimport { isElement } from 'react-is';\n\nimport { isKonturIcon } from '../../lib/utils';\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, PopupMenuProps } from '../../internal/PopupMenu';\nimport { Nullable } from '../../typings/utility-types';\nimport { PopupPositionsType } 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';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { ButtonSize } from '../Button';\n\nimport { styles } from './Kebab.styles';\nimport { KebabIcon } from './KebabIcon';\n\nexport interface KebabProps extends CommonProps, Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId'> {\n  disabled?: boolean;\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?: PopupPositionsType[];\n  menuMaxHeight?: number | string;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n  /**\n   * Кастомная иконка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Атрибут для указания id элемента(-ов), описывающих его\n   */\n  'aria-describedby'?: AriaAttributes['aria-describedby'];\n}\n\nexport const KebabDataTids = {\n  caption: 'Kebab__caption',\n} as const;\n\nexport interface KebabState {\n  anchor: Nullable<HTMLElement>;\n  focusedByTab: boolean;\n}\n\ntype DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;\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: DefaultProps = {\n    onOpen: () => undefined,\n    onClose: () => undefined,\n    positions: ['bottom left', 'bottom right', 'top left', 'top right'],\n    size: 'small',\n    disableAnimations: isTestEnv,\n  };\n\n  private getProps = createPropsGetter(Kebab.defaultProps);\n\n  public state: KebabState = {\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 } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\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={disableAnimations}\n          menuMaxHeight={this.props.menuMaxHeight}\n          onOpen={onOpen}\n          onClose={onClose}\n          popupMenuId={this.props.popupMenuId}\n        >\n          {!disabled && this.props.children}\n        </PopupMenu>\n      </CommonWrapper>\n    );\n  }\n\n  private renderCaption = (captionProps: PopupMenuCaptionProps) => {\n    const { disabled, size } = this.getProps();\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        data-tid={KebabDataTids.caption}\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),\n          size === 'small' && styles.kebabSmall(this.theme),\n          size === 'medium' && styles.kebabMedium(this.theme),\n          size === 'large' && styles.kebabLarge(this.theme),\n          isTheme2022(this.theme) && styles.kebab2022(),\n          captionProps.opened && styles.opened(this.theme),\n          disabled && styles.disabled(),\n          this.state.focusedByTab && styles.focused(this.theme),\n        )}\n        aria-describedby={this.props['aria-describedby']}\n      >\n        {isTheme2022(this.theme) ? this.renderIcon2022() : 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      focusedByTab: !isOpened && restoreFocus,\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    const { size, icon = <MenuKebabIcon /> } = this.getProps();\n    return (\n      <div\n        className={cx({\n          [styles.icon(this.theme)]: true,\n          [styles.iconsmall(this.theme)]: size === 'small',\n          [styles.iconmedium(this.theme)]: size === 'medium',\n          [styles.iconlarge(this.theme)]: size === 'large',\n        })}\n      >\n        {icon}\n      </div>\n    );\n  }\n\n  private renderIcon2022() {\n    const { size, icon = <KebabIcon /> } = this.getProps();\n\n    if (isElement(icon) && isKonturIcon(icon)) {\n      const sizes: Record<ButtonSize, number> = {\n        small: parseInt(this.theme.kebabIconSizeSmall),\n        medium: parseInt(this.theme.kebabIconSizeMedium),\n        large: parseInt(this.theme.kebabIconSizeLarge),\n      };\n\n      return React.cloneElement(icon, {\n        size: icon.props.size ?? sizes[size],\n        color: icon.props.color ?? this.theme.kebabIconColor,\n      });\n    }\n\n    return icon;\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/cjs/components/Kebab/Kebab.styles.d.ts

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

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

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

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

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

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

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

package/cjs/components/Kebab/KebabIcon.js

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

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

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

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Override } from '../../typings/utility-types';
+import { ThemeIn } from '../../lib/theming/Theme';
 import { CommonProps } from '../../internal/CommonWrapper';
 export interface LinkProps extends CommonProps, Override<React.AnchorHTMLAttributes<HTMLAnchorElement>, {
     /**
@@ -39,6 +40,20 @@ export interface LinkProps extends CommonProps, Override<React.AnchorHTMLAttribu
      * HTML-событие `onclick`.
      */
     onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+    /**
+     * Обычный объект с переменными темы.
+     * Он будет объединён с темой из контекста.
+     */
+    theme?: ThemeIn;
+    /**
+     * Компонент, используемый в качестве корневого узла.
+     * @ignore
+     */
+    as?: React.ElementType | keyof React.ReactHTML;
+    /**
+     * @ignore
+     */
+    focused?: boolean;
 }> {
 }
 export interface LinkState {
@@ -47,7 +62,7 @@ export interface LinkState {
 export declare const LinkDataTids: {
     readonly root: "Link__root";
 };
-declare type DefaultProps = Required<Pick<LinkProps, 'href' | 'use'>>;
+declare type DefaultProps = Required<Pick<LinkProps, 'href' | 'use' | 'as'>>;
 /**
  * Элемент ссылки из HTML.
  */
@@ -66,8 +81,9 @@ export declare class Link extends React.Component<LinkProps, LinkState> {
     private setRootNode;
     render(): JSX.Element;
     private renderMain;
-    private _handleFocus;
-    private _handleBlur;
-    private _handleClick;
+    private handleFocus;
+    private handleBlur;
+    private handleClick;
+    private getLinkClassName;
 }
 export {};