@skbkontur/react-ui 0.0.0-e66a3400ba → 0.0.0-ea6161656e

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

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

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

@@ -0,0 +1 @@
+{"version":3,"sources":["InputLayoutContext.tsx"],"names":["React","InputLayoutContextDefault","focused","disabled","size","InputLayoutContext","createContext"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;;;;;;;;AAUA,OAAO,IAAMC,yBAAkD,GAAG;AAChEC,EAAAA,OAAO,EAAE,KADuD;AAEhEC,EAAAA,QAAQ,EAAE,KAFsD;AAGhEC,EAAAA,IAAI,EAAE,OAH0D,EAA3D;;;AAMP,OAAO,IAAMC,kBAAkB,gBAAGL,KAAK,CAACM,aAAN,CAA6CL,yBAA7C,CAA3B","sourcesContent":["import React from 'react';\n\nimport { SizeProp } from '../../../lib/types/props';\n\nexport interface InputLayoutContextProps {\n  focused: boolean;\n  disabled: boolean;\n  size: SizeProp;\n}\n\nexport const InputLayoutContextDefault: InputLayoutContextProps = {\n  focused: false,\n  disabled: false,\n  size: 'small',\n};\n\nexport const InputLayoutContext = React.createContext<InputLayoutContextProps>(InputLayoutContextDefault);\n"]}

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

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

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

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"sources":["PolyfillPlaceholder.tsx"],"names":["React","useEmotion","getStyles","needsPolyfillPlaceholder","useTheme","InputLayoutContext","PolyfillPlaceholder","placeholder","children","align","value","defaultValue","isMaskVisible","emotion","theme","useContext","focused","disabled","_placeholder","styles","cx","placeholderDisabled","placeholderFocus","textAlign"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;;AAGA,SAASC,UAAT,QAA2B,8BAA3B;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,wBAAT,QAAyC,uCAAzC;AACA,SAASC,QAAT,QAAyB,+BAAzB;;AAEA,SAASC,kBAAT,QAAmC,sBAAnC;;;;;;;;;;AAUA,OAAO,IAAMC,mBAAyE,GAAG,SAA5EA,mBAA4E;;;;;;AAMnF,KALMC,WAKN,QALJC,QAKI,CAJJC,KAII,QAJJA,KAII,CAHJC,KAGI,QAHJA,KAGI,CAFJC,YAEI,QAFJA,YAEI,CADJC,aACI,QADJA,aACI;AACJ,MAAMC,OAAO,GAAGZ,UAAU,EAA1B;AACA,MAAMa,KAAK,GAAGV,QAAQ,EAAtB;AACA,0BAA8BJ,KAAK,CAACe,UAAN,CAAiBV,kBAAjB,CAA9B,CAAQW,OAAR,qBAAQA,OAAR,CAAiBC,QAAjB,qBAAiBA,QAAjB;;AAEA,MAAIC,YAAY,GAAG,IAAnB;AACA,MAAMC,MAAM,GAAGjB,SAAS,CAACW,OAAD,CAAxB;;AAEA,MAAIV,wBAAwB,IAAII,WAA5B,IAA2C,CAACK,aAA5C,IAA6D,CAACF,KAA9D,IAAuE,CAACC,YAA5E,EAA0F;AACxFO,IAAAA,YAAY;AACV;AACE,MAAA,SAAS,EAAEL,OAAO,CAACO,EAAR,CAAWD,MAAM,CAACZ,WAAP,CAAmBO,KAAnB,CAAX;AACRK,MAAAA,MAAM,CAACE,mBAAP,CAA2BP,KAA3B,CADQ,IAC4BG,QAD5B;AAERE,MAAAA,MAAM,CAACG,gBAAP,CAAwBR,KAAxB,CAFQ,IAEyBE,OAFzB,eADb;;AAKE,MAAA,KAAK,EAAE,EAAEO,SAAS,EAAEd,KAAK,IAAI,SAAtB,EALT;;AAOGF,IAAAA,WAPH,CADF;;;AAWD;;AAED,SAAOW,YAAP;AACD,CA7BM","sourcesContent":["import React from 'react';\n\nimport { InputProps } from '../Input';\nimport { useEmotion } from '../../../lib/theming/Emotion';\nimport { getStyles } from '../Input.styles';\nimport { needsPolyfillPlaceholder } from '../../../lib/needsPolyfillPlaceholder';\nimport { useTheme } from '../../../lib/theming/useTheme';\n\nimport { InputLayoutContext } from './InputLayoutContext';\n\ntype PolyfillPlaceholder = Pick<InputProps, 'placeholder' | 'value' | 'defaultValue' | 'align'> & {\n  isMaskVisible: boolean;\n};\n\nexport interface InputLayoutPlaceholderProps extends PolyfillPlaceholder {\n  children: InputProps['placeholder'];\n}\n\nexport const PolyfillPlaceholder: React.FunctionComponent<InputLayoutPlaceholderProps> = ({\n  children: placeholder,\n  align,\n  value,\n  defaultValue,\n  isMaskVisible,\n}) => {\n  const emotion = useEmotion();\n  const theme = useTheme();\n  const { focused, disabled } = React.useContext(InputLayoutContext);\n\n  let _placeholder = null;\n  const styles = getStyles(emotion);\n\n  if (needsPolyfillPlaceholder && placeholder && !isMaskVisible && !value && !defaultValue) {\n    _placeholder = (\n      <div\n        className={emotion.cx(styles.placeholder(theme), {\n          [styles.placeholderDisabled(theme)]: disabled,\n          [styles.placeholderFocus(theme)]: focused,\n        })}\n        style={{ textAlign: align || 'inherit' }}\n      >\n        {placeholder}\n      </div>\n    );\n  }\n\n  return _placeholder;\n};\n"]}

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

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

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

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

package/components/Input/index/index.js

@@ -0,0 +1,2 @@
+export * from "../Input";
+export * from "../Input.typings";

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

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

package/components/Input/index/package.json

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

package/components/Input/index.d.ts

@@ -1 +1,2 @@
-export { default, InputProps, InputState, InputAlign, InputSize } from './Input';
+export * from './Input';
+export * from './Input.typings';

package/components/Input/package.json

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

package/components/Kebab/Kebab/Kebab.js

@@ -0,0 +1,250 @@
+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 { isElement } from 'react-is';
+import { globalObject } from '@skbkontur/global-object';
+import { isKonturIcon } from "../../../lib/utils";
+import { isKeyArrowVertical, isKeyEnter, isKeySpace, someKeys } from "../../../lib/events/keyboard/identifiers";
+import * as LayoutEvents from "../../../lib/LayoutEvents";
+import { keyListener } from "../../../lib/events/keyListener";
+import { PopupMenu } from "../../../internal/PopupMenu";
+import { MenuKebabIcon } from "../../../internal/icons/16px";
+import { isTestEnv } from "../../../lib/currentEnvironment";
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
+import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from "../../../lib/featureFlagsContext";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { getStyles } from "../Kebab.styles";
+import { KebabIcon } from "../KebabIcon";
+export var KebabDataTids = {
+  caption: 'Kebab__caption'
+};
+export var Kebab = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(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.getProps = createPropsGetter(Kebab.defaultProps);
+    _this.state = {
+      focusedByTab: false,
+      anchor: null
+    };
+    _this.listener = {
+      remove: function remove() {
+        return undefined;
+      }
+    };
+
+    _this.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);
+        }
+      };
+
+      var handleCaptionClick = function handleCaptionClick() {
+        if (!disabled) {
+          captionProps.toggleMenu();
+        }
+      };
+
+      var styles = getStyles(_this.emotion);
+      return /*#__PURE__*/React.createElement("span", {
+        role: "button",
+        "data-tid": KebabDataTids.caption,
+        tabIndex: disabled ? -1 : 0,
+        onClick: handleCaptionClick,
+        onKeyDown: handleCaptionKeyDown,
+        onFocus: _this.handleFocus,
+        onBlur: _this.handleBlur,
+        className: _this.emotion.cx(styles.kebab(_this.theme), size === 'small' && styles.kebabSmall(_this.theme), size === 'medium' && styles.kebabMedium(_this.theme), size === 'large' && styles.kebabLarge(_this.theme), isTheme2022(_this.theme) && styles.kebab2022(), captionProps.opened && styles.opened(_this.theme), disabled && styles.disabled(), _this.state.focusedByTab && styles.focused(_this.theme)),
+        "aria-describedby": _this.props['aria-describedby']
+      }, isTheme2022(_this.theme) ? _this.renderIcon2022() : _this.renderIcon());
+    };
+
+    _this.handleCaptionKeyDown = function (e, openMenu) {
+      if (someKeys(isKeyEnter, isKeySpace, isKeyArrowVertical)(e)) {
+        e.preventDefault();
+        openMenu(true);
+      }
+    };
+
+    _this.handleChangeMenuState = function (isOpened, restoreFocus) {
+      _this.setState({
+        focusedByTab: !isOpened && restoreFocus
+      });
+    };
+
+    _this.handleFocus = function () {
+      if (!_this.props.disabled) {
+        // focus event fires before keyDown eventlistener
+        // so we should check tabPressed in async way
+        globalObject.requestAnimationFrame == null ? void 0 : globalObject.requestAnimationFrame(function () {
+          if (keyListener.isTabPressed) {
+            _this.setState({
+              focusedByTab: true
+            });
+          }
+        });
+      }
+    };
+
+    _this.handleBlur = function () {
+      _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.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+        _this2.theme = theme;
+        return /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+          value: ThemeFactory.create({
+            popupPinOffset: theme.kebabPinOffset,
+            popupMargin: theme.kebabMargin,
+            popupPinSize: theme.kebabPinSize,
+            menuScrollContainerContentWrapperPaddingY: theme.menuLegacyPaddingY
+          }, theme)
+        }, _this2.renderMain());
+      });
+    });
+  };
+
+  _proto.renderMain = function renderMain() {
+    var _this3 = this;
+
+    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.createElement(ReactUIFeatureFlagsContext.Consumer, null, function (flags) {
+      var hasPin = !getFullReactUIFlagsContext(flags).kebabHintRemovePin || !isTheme2022(_this3.theme);
+      return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+        rootNodeRef: _this3.setRootNode
+      }, _this3.props), /*#__PURE__*/React.createElement(PopupMenu, {
+        popupHasPin: hasPin,
+        preventIconsOffset: _this3.props.preventIconsOffset,
+        positions: positions,
+        onChangeMenuState: _this3.handleChangeMenuState,
+        caption: _this3.renderCaption,
+        disableAnimations: disableAnimations,
+        menuMaxHeight: _this3.props.menuMaxHeight,
+        onOpen: onOpen,
+        onClose: onClose,
+        popupMenuId: _this3.props.popupMenuId,
+        "aria-label": _this3.props['aria-label']
+      }, !disabled && _this3.props.children));
+    });
+  };
+
+  _proto.renderIcon = function renderIcon() {
+    var _this$emotion$cx;
+
+    var _this$getProps3 = this.getProps(),
+        size = _this$getProps3.size,
+        _this$getProps3$icon = _this$getProps3.icon,
+        icon = _this$getProps3$icon === void 0 ? /*#__PURE__*/React.createElement(MenuKebabIcon, null) : _this$getProps3$icon;
+
+    var styles = getStyles(this.emotion);
+    return /*#__PURE__*/React.createElement("div", {
+      className: this.emotion.cx((_this$emotion$cx = {}, _this$emotion$cx[styles.icon(this.theme)] = true, _this$emotion$cx[styles.iconsmall(this.theme)] = size === 'small', _this$emotion$cx[styles.iconmedium(this.theme)] = size === 'medium', _this$emotion$cx[styles.iconlarge(this.theme)] = size === 'large', _this$emotion$cx))
+    }, icon);
+  };
+
+  _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.createElement(KebabIcon, null) : _this$getProps4$icon;
+
+    if (isElement(icon) && 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.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.Component), _class2.__KONTUR_REACT_UI__ = 'Kebab', _class2.displayName = '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: isTestEnv
+}, _temp)) || _class;
+Kebab.propTypes = {
+  children: PropTypes.node,
+  disabled: PropTypes.bool,
+  menuMaxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+
+  /**
+   * Размер кебаба small 14px | large 20px
+   */
+  size: PropTypes.string,
+
+  /**
+   * Коллбек, вызывающийся перед закрытием кебаба
+   */
+  onClose: PropTypes.func,
+
+  /**
+   * Коллбек, вызывающийся перед открытием кебаба
+   */
+  onOpen: PropTypes.func
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["Kebab.tsx"],"names":["React","PropTypes","isElement","globalObject","isKonturIcon","isKeyArrowVertical","isKeyEnter","isKeySpace","someKeys","LayoutEvents","keyListener","PopupMenu","MenuKebabIcon","isTestEnv","ThemeFactory","CommonWrapper","EmotionConsumer","rootNode","createPropsGetter","isTheme2022","getFullReactUIFlagsContext","ReactUIFeatureFlagsContext","ThemeContext","getStyles","KebabIcon","KebabDataTids","caption","Kebab","getProps","defaultProps","state","focusedByTab","anchor","listener","remove","undefined","renderCaption","captionProps","disabled","size","handleCaptionKeyDown","event","openMenu","handleCaptionClick","toggleMenu","styles","emotion","handleFocus","handleBlur","cx","kebab","theme","kebabSmall","kebabMedium","kebabLarge","kebab2022","opened","focused","props","renderIcon2022","renderIcon","e","preventDefault","handleChangeMenuState","isOpened","restoreFocus","setState","requestAnimationFrame","isTabPressed","componentDidMount","addListener","componentWillUnmount","render","create","popupPinOffset","kebabPinOffset","popupMargin","kebabMargin","popupPinSize","kebabPinSize","menuScrollContainerContentWrapperPaddingY","menuLegacyPaddingY","renderMain","positions","disableAnimations","onOpen","onClose","flags","hasPin","kebabHintRemovePin","setRootNode","preventIconsOffset","menuMaxHeight","popupMenuId","children","icon","iconsmall","iconmedium","iconlarge","sizes","small","parseInt","kebabIconSizeSmall","medium","kebabIconSizeMedium","large","kebabIconSizeLarge","cloneElement","color","kebabIconColor","Component","__KONTUR_REACT_UI__","displayName","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';\nimport { globalObject } from '@skbkontur/global-object';\nimport type { Emotion } from '@emotion/css/create-instance';\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 { Theme } from '../../lib/theming/Theme';\nimport { MenuKebabIcon } from '../../internal/icons/16px';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { SizeProp } from '../../lib/types/props';\nimport { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from '../../lib/featureFlagsContext';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport { getStyles } from './Kebab.styles';\nimport { KebabIcon } from './KebabIcon';\n\nexport interface KebabProps\n  extends Pick<AriaAttributes, 'aria-label'>,\n    Pick<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>,\n    CommonProps {\n  disabled?: boolean;\n  size?: SizeProp;\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  public static displayName = '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 emotion!: Emotion;\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      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\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                        menuScrollContainerContentWrapperPaddingY: theme.menuLegacyPaddingY,\n                      },\n                      theme,\n                    )}\n                  >\n                    {this.renderMain()}\n                  </ThemeContext.Provider>\n                );\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  private renderMain() {\n    const { disabled } = this.props;\n    const { positions, disableAnimations, onOpen, onClose } = this.getProps();\n    return (\n      <ReactUIFeatureFlagsContext.Consumer>\n        {(flags) => {\n          const hasPin = !getFullReactUIFlagsContext(flags).kebabHintRemovePin || !isTheme2022(this.theme);\n          return (\n            <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n              <PopupMenu\n                popupHasPin={hasPin}\n                preventIconsOffset={this.props.preventIconsOffset}\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                aria-label={this.props['aria-label']}\n              >\n                {!disabled && this.props.children}\n              </PopupMenu>\n            </CommonWrapper>\n          );\n        }}\n      </ReactUIFeatureFlagsContext.Consumer>\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    const styles = getStyles(this.emotion);\n\n    return (\n      <span\n        role=\"button\"\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={this.emotion.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      globalObject.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    const styles = getStyles(this.emotion);\n    return (\n      <div\n        className={this.emotion.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<SizeProp, 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/components/Kebab/Kebab/package.json

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

package/components/Kebab/Kebab.d.ts

@@ -1,58 +1,64 @@
-import * as React from 'react';
-import { Nullable } from '../../typings/utility-types';
-import { PopupPosition } from '../Popup';
-export interface KebabProps {
-    disabled?: boolean;
-    /**
-     * Функция вызываемая при закрытии выпадашки
-     * @default () => undefined
-     */
-    onClose: () => void;
-    /**
-     * Функция вызываемая при открытии выпадашки
-     * @default () => undefined
-     */
-    onOpen: () => void;
-    size: 'small' | 'medium' | 'large';
-    /**
-     * Список позиций доступных для расположения выпадашки
-     * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использоваться первая из этого списка
-     * @default ['bottom left', 'bottom right', 'top left', 'top right']
-     */
-    positions: PopupPosition[];
-    menuMaxHeight?: number | string;
-    /**
-     * Не показывать анимацию
-     */
-    disableAnimations: boolean;
-}
-export interface KebabState {
-    anchor: Nullable<HTMLElement>;
-    focusedByTab: boolean;
-    opened: boolean;
-}
-export default class Kebab extends React.Component<KebabProps, KebabState> {
-    static propTypes: {};
-    static defaultProps: {
-        onOpen: () => undefined;
-        onClose: () => undefined;
-        positions: string[];
-        size: string;
-        disableAnimations: boolean;
-    };
-    state: {
-        opened: boolean;
-        focusedByTab: boolean;
-        anchor: null;
-    };
-    private listener;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    render(): JSX.Element;
-    private renderCaption;
-    private handleCaptionKeyDown;
-    private handleChangeMenuState;
-    private handleFocus;
-    private handleBlur;
-    private renderIcon;
-}
+import React, { AriaAttributes } from 'react';
+import { PopupMenuProps } from '../../internal/PopupMenu';
+import { Nullable } from '../../typings/utility-types';
+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<PopupMenuProps, 'onOpen' | 'onClose' | 'popupMenuId' | 'preventIconsOffset'>, CommonProps {
+    disabled?: boolean;
+    size?: SizeProp;
+    /**
+     * Список позиций доступных для расположения выпадашки.
+     *
+     * Если во всех позициях выпадашка вылезает за пределы `viewport`, будет использована первая из этого списка.
+     *
+     * **Возможные значения**: `top left`, `top center`, `top right`, `right top`, `right middle`, `right bottom`, `bottom left`, `bottom center`, `bottom right`, `left top`, `left middle`, `left bottom`
+     * @default ['bottom left', 'bottom right', 'top left', 'top right']
+     */
+    positions?: PopupPositionsType[];
+    menuMaxHeight?: number | string;
+    /**
+     * Не показывать анимацию
+     */
+    disableAnimations?: boolean;
+    /**
+     * Кастомная иконка
+     */
+    icon?: React.ReactNode;
+    /**
+     * Атрибут для указания id элемента(-ов), описывающих его
+     */
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
+}
+export declare const KebabDataTids: {
+    readonly caption: "Kebab__caption";
+};
+export interface KebabState {
+    anchor: Nullable<HTMLElement>;
+    focusedByTab: boolean;
+}
+declare type DefaultProps = Required<Pick<KebabProps, 'onOpen' | 'onClose' | 'positions' | 'size' | 'disableAnimations'>>;
+export declare class Kebab extends React.Component<KebabProps, KebabState> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    static propTypes: {};
+    static defaultProps: DefaultProps;
+    private getProps;
+    state: KebabState;
+    private theme;
+    private emotion;
+    private setRootNode;
+    private listener;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    private renderMain;
+    private renderCaption;
+    private handleCaptionKeyDown;
+    private handleChangeMenuState;
+    private handleFocus;
+    private handleBlur;
+    private renderIcon;
+    private renderIcon2022;
+}
+export {};