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

package/cjs/components/Button/Button.d.ts

@@ -1,61 +1,119 @@
 import React from 'react';
+import { CommonProps } from '../../internal/CommonWrapper';
 export declare type ButtonSize = 'small' | 'medium' | 'large';
 export declare type ButtonType = 'button' | 'submit' | 'reset';
 export declare type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';
-export interface ButtonProps {
+export interface ButtonProps extends CommonProps {
     /** @ignore */
     _noPadding?: boolean;
     /** @ignore */
     _noRightPadding?: boolean;
     /**
-     * Визуально нажатое состояние.
+     * Применяет к кнопке стили псевдокласса `:active`.
      */
     active?: boolean;
-    /** `type TextAlignProperty = "inherit" | "initial" | "unset" | "center" | "end" | "justify" | "left" | "match-parent" | "right" | "start"` */
+    /**
+     * CSS-свойство `text-align`.
+     */
     align?: React.CSSProperties['textAlign'];
     /**
-     * Кнопка со стрелкой.
-     *
-     * `type ButtonArrow = boolean | "left"`
+     * Превращает обычную кнопку в кнопку со стрелкой.
      */
     arrow?: boolean | 'left';
+    /**
+     * Даёт кнопке фокус после окончания загрузки страницы.
+     */
     autoFocus?: boolean;
+    /**
+     * Убирает обводку у кнопки.
+     */
     borderless?: boolean;
+    /**
+     * @ignore
+     */
     checked?: boolean;
     children?: React.ReactNode;
     /** @ignore */
     corners?: number;
+    /**
+     * Отключенное состояние кнопки.
+     */
     disabled?: boolean;
     /** @ignore */
     disableFocus?: boolean;
+    /**
+     * Cостояние валидации при ошибке.
+     */
     error?: boolean;
-    focused?: boolean;
     /**
      * Иконка слева от текста кнопки.
      */
     icon?: React.ReactElement<any>;
+    /**
+     * Переводит кнопку в состояние загрузки.
+     */
     loading?: boolean;
+    /**
+     * Сужает кнопку.
+     */
     narrow?: boolean;
+    /**
+     * HTML-событие `onblur`.
+     */
     onBlur?: React.FocusEventHandler<HTMLButtonElement>;
+    /**
+     * HTML-событие `onclick`.
+     */
     onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    /**
+     * HTML-событие `onfocus`.
+     */
     onFocus?: React.FocusEventHandler<HTMLButtonElement>;
+    /**
+     * HTML-событие `keydown`.
+     */
     onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;
+    /**
+     * HTML-событие `onmouseenter`.
+     */
     onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;
+    /**
+     * HTML-событие `mouseleave`.
+     */
     onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;
+    /**
+     * HTML-событие `onmouseover`.
+     */
     onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;
-    /** `type ButtonSize = "small" | "medium" | "large"` */
+    /**
+     * Задаёт размер кнопки.
+     *
+     * **Допустимые значения**: `"small"`, `"medium"`, `"large"`.
+     */
     size?: ButtonSize;
-    /** `type ButtonType = "button" | "submit" | "reset"` */
+    /**
+     * HTML-атрибут `type`.
+     */
     type?: ButtonType;
     /**
-     * Вариант использования. Влияет на цвет кнопки.
+     * HTML-атрибут `title`.
+     */
+    title?: string;
+    /**
+     * Стиль кнопки.
      *
-     * `type ButtonUse = "default" | "primary" | "success" | "danger" | "pay" | "link"`
+     * **Допустимые значения**: `"default"`, `"primary"`, `"success"`, `"danger"`, `"pay"`, `"link"`.
      */
     use?: ButtonUse;
     /** @ignore */
     visuallyFocused?: boolean;
+    /**
+     * Cостояние валидации при предупреждении.
+     */
     warning?: boolean;
+    /**
+     * CSS-свойство `width`.
+     */
     width?: number | string;
 }
 export interface ButtonState {
@@ -69,16 +127,20 @@ export declare class Button extends React.Component<ButtonProps, ButtonState> {
     static BOTTOM_RIGHT: number;
     static BOTTOM_LEFT: number;
     static defaultProps: {
-        use: string;
-        size: string;
-        type: string;
+        use: ButtonUse;
+        size: ButtonSize;
+        type: ButtonType;
     };
     state: {
         focusedByTab: boolean;
     };
     private theme;
     private node;
+    private setRootNode;
     componentDidMount(): void;
+    static getDerivedStateFromProps(props: ButtonProps): {
+        focusedByTab: boolean;
+    } | null;
     /**
      * @public
      */
@@ -89,9 +151,12 @@ export declare class Button extends React.Component<ButtonProps, ButtonState> {
     blur(): void;
     render(): JSX.Element;
     private renderMain;
+    private getLoadingSpinner;
     private getSizeClassName;
+    private getSizeIconClassName;
+    private getSizeWrapClassName;
     private handleFocus;
     private handleBlur;
     private _ref;
 }
-export declare const isButton: (child: React.ReactChild) => child is React.ReactElement<ButtonProps, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)>;
+export declare const isButton: (child: React.ReactChild) => child is React.ReactElement<ButtonProps, string | React.JSXElementConstructor<any>>;

package/cjs/components/Button/Button.js

@@ -1,13 +1,16 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.isButton = exports.Button = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
 
-var _utils = require("../../lib/utils");
-var _tabListener = require("../../lib/events/tabListener");
+var _client = require("../../lib/client");
+var _keyListener = require("../../lib/events/keyListener");
 
 var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _Spinner = require("../Spinner");
+var _CommonWrapper = require("../../internal/CommonWrapper");
+var _Emotion = require("../../lib/theming/Emotion");
+var _rootNode = require("../../lib/rootNode");
 
 var _Button = require("./Button.styles");
-var _Corners = require("./Corners");var
+var _Corners = require("./Corners");var _class, _class2, _temp;var
 
 
 
@@ -103,7 +106,65 @@ var _Corners = require("./Corners");var
 
 
 
-Button = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Button, _React$Component);function Button() {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.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+Button = (0, _rootNode.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Button, _React$Component);function Button() {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.
 
 
 
@@ -121,7 +182,7 @@ Button = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
       focusedByTab: false };_this.
 
 
-    theme = void 0;_this.
+
     node = null;_this.
 
 
@@ -278,6 +339,87 @@ Button = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
 
 
 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
@@ -303,8 +445,8 @@ Button = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
       if (!_this.props.disabled && !_this.props.disableFocus) {
         // focus event fires before keyDown eventlistener
         // so we should check tabPressed in async way
-        process.nextTick(function () {
-          if (_tabListener.tabListener.isTabPressed) {
+        requestAnimationFrame(function () {
+          if (_keyListener.keyListener.isTabPressed) {
             _this.setState({ focusedByTab: true });
           }
         });
@@ -321,12 +463,13 @@ Button = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(
 
     _ref = function (node) {
       _this.node = node;
-    };return _this;}var _proto = Button.prototype;_proto.componentDidMount = function componentDidMount() {if (this.props.autoFocus) {_tabListener.tabListener.isTabPressed = true;this.focus();}} /**
-                                                                                                                                                                                                    * @public
-                                                                                                                                                                                                    */;_proto.focus = function focus() {var _this$node;(_this$node = this.node) == null ? void 0 : _this$node.focus();} /**
-                                                                                                                                                                                                                                                                                                                         * @public
-                                                                                                                                                                                                                                                                                                                         */;_proto.blur = function blur() {var _this$node2;(_this$node2 = this.node) == null ? void 0 : _this$node2.blur();};_proto.render = function render() {var _this2 = this;return _react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cn, _cn2;var _this$props$corners = this.props.corners,corners = _this$props$corners === void 0 ? 0 : _this$props$corners;var sizeClass = this.getSizeClassName();var isError = !!this.props.error;var isWarning = !!this.props.warning;var rootProps = { // By default the type attribute is 'submit'. IE8 will fire a click event
+    };return _this;}var _proto = Button.prototype;_proto.componentDidMount = function componentDidMount() {if (this.props.autoFocus) {_keyListener.keyListener.isTabPressed = true;this.focus();}};Button.getDerivedStateFromProps = function getDerivedStateFromProps(props) {if (props.loading || props.disabled) {return { focusedByTab: false };}return null;} /**
+   * @public
+   */;_proto.focus = function focus() {var _this$node;(_this$node = this.node) == null ? void 0 : _this$node.focus();} /**
+   * @public
+   */;_proto.blur = function blur() {var _this$node2;(_this$node2 = this.node) == null ? void 0 : _this$node2.blur();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _cx, _cx2, _cx7, _cx8;var _this$props = this.props,_this$props$corners = _this$props.corners,corners = _this$props$corners === void 0 ? 0 : _this$props$corners,active = _this$props.active,disabled = _this$props.disabled,borderless = _this$props.borderless,checked = _this$props.checked,error = _this$props.error,warning = _this$props.warning,loading = _this$props.loading,arrow = _this$props.arrow,narrow = _this$props.narrow,icon = _this$props.icon,_noPadding = _this$props._noPadding,_noRightPadding = _this$props._noRightPadding,_this$props$use = _this$props.use,use = _this$props$use === void 0 ? Button.defaultProps.use : _this$props$use,visuallyFocused = _this$props.visuallyFocused,align = _this$props.align,disableFocus = _this$props.disableFocus,onMouseEnter = _this$props.onMouseEnter,onMouseLeave = _this$props.onMouseLeave,onMouseOver = _this$props.onMouseOver,onKeyDown = _this$props.onKeyDown,onClick = _this$props.onClick,width = _this$props.width,children = _this$props.children;var sizeClass = this.getSizeClassName();var isFocused = this.state.focusedByTab || visuallyFocused;var isLink = use === 'link';var rootProps = { // By default the type attribute is 'submit'. IE8 will fire a click event
       // on this button if somewhere on the page user presses Enter while some
       // input is focused. So we set type to 'button' by default.
-      type: this.props.type, className: (0, _classnames.default)((_cn = {}, _cn[_Button.jsStyles.root(this.theme)] = true, _cn[_Button.jsStyles[this.props.use] && _Button.jsStyles[this.props.use](this.theme) || _Button.jsStyles.default(this.theme)] = true, _cn[_Button.jsStyles.active(this.theme)] = !!this.props.active, _cn[_Button.jsStyles.validationRoot(this.theme)] = isError || isWarning, _cn[_Button.jsStyles.error(this.theme)] = isError, _cn[_Button.jsStyles.warning(this.theme)] = isWarning, _cn[_Button.jsStyles.narrow()] = !!this.props.narrow, _cn[_Button.jsStyles.noPadding()] = !!this.props._noPadding, _cn[_Button.jsStyles.noRightPadding()] = !!this.props._noRightPadding, _cn[_Button.jsStyles.buttonWithIcon()] = !!this.props.icon, _cn[sizeClass] = true, _cn[_Button.jsStyles.borderless(this.theme)] = !!this.props.borderless, _cn[_Button.jsStyles.focus(this.theme)] = this.state.focusedByTab || !!this.props.visuallyFocused, _cn[_Button.jsStyles.checked(this.theme)] = !!this.props.checked && !this.props.disabled, _cn[_Button.jsStyles.disabled(this.theme)] = !!this.props.disabled || !!this.props.loading, _cn[_Button.jsStyles.fallback(this.theme)] = _utils.isIE11 || _utils.isEdge, _cn)), style: { borderTopLeftRadius: corners & _Corners.Corners.TOP_LEFT ? 0 : undefined, borderTopRightRadius: corners & _Corners.Corners.TOP_RIGHT ? 0 : undefined, borderBottomRightRadius: corners & _Corners.Corners.BOTTOM_RIGHT ? 0 : undefined, borderBottomLeftRadius: corners & _Corners.Corners.BOTTOM_LEFT ? 0 : undefined, textAlign: this.props.align }, disabled: this.props.disabled || this.props.loading, onClick: this.props.onClick, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.props.onKeyDown, onMouseEnter: this.props.onMouseEnter, onMouseLeave: this.props.onMouseLeave, onMouseOver: this.props.onMouseOver, tabIndex: this.props.disableFocus ? -1 : 0 };var wrapProps = { className: (0, _classnames.default)((_cn2 = {}, _cn2[_Button.jsStyles.wrap(this.theme)] = true, _cn2[_Button.jsStyles.wrapArrow()] = this.props.arrow === true, _cn2[_Button.jsStyles.wrapArrowLeft()] = this.props.arrow === 'left', _cn2)), style: { width: this.props.width } };var error = null;if (this.props.error) {error = _react.default.createElement("div", { className: _Button.jsStyles.error(this.theme) });} else if (this.props.warning) {error = _react.default.createElement("div", { className: _Button.jsStyles.warning(this.theme) });}var loading = null;if (this.props.loading) {loading = _react.default.createElement("div", { className: _Button.jsStyles.loading() });}var icon = this.props.icon;if (this.props.icon) {icon = _react.default.createElement("span", { className: _Button.jsStyles.icon() }, this.props.icon);}var arrow = null;if (this.props.arrow) {var _cn3;arrow = _react.default.createElement("div", { className: (0, _classnames.default)((_cn3 = {}, _cn3[_Button.jsStyles.arrowWarning(this.theme)] = isWarning, _cn3[_Button.jsStyles.arrowError(this.theme)] = isError, _cn3[_Button.jsStyles.arrow()] = true, _cn3[_Button.jsStyles.arrowLeft(this.theme)] = this.props.arrow === 'left', _cn3)) });} // Force disable all props and features, that cannot be use with Link
-    if (this.props.use === 'link') {var _cn4, _cn5;rootProps.className = (0, _classnames.default)((_cn4 = {}, _cn4[_Button.jsStyles.root(this.theme)] = true, _cn4[_Button.jsStyles.buttonWithIcon()] = !!this.props.icon, _cn4[sizeClass] = true, _cn4[_Button.jsStyles.focus(this.theme)] = this.state.focusedByTab || !!this.props.visuallyFocused, _cn4[_Button.jsStyles.link(this.theme)] = true, _cn4[_Button.jsStyles.disabled(this.theme)] = !!this.props.disabled, _cn4));Object.assign(wrapProps, { className: (0, _classnames.default)(_Button.jsStyles.wrap(this.theme), (_cn5 = {}, _cn5[_Button.jsStyles.wrapLink(this.theme)] = this.props.use === 'link', _cn5)), style: { width: wrapProps.style.width } });rootProps.style.textAlign = undefined;loading = null;arrow = null;}return _react.default.createElement("span", wrapProps, _react.default.createElement("button", (0, _extends2.default)({ ref: this._ref }, rootProps), error, loading, arrow, _react.default.createElement("div", { className: _Button.jsStyles.caption() }, icon, this.props.children)));};_proto.getSizeClassName = function getSizeClassName() {var _cn6, _cn7, _cn8;switch (this.props.size) {case 'large':return (0, _classnames.default)(_Button.jsStyles.sizeLarge(this.theme), (_cn6 = {}, _cn6[_Button.jsStyles.sizeLargeLoading(this.theme)] = this.props.loading, _cn6));case 'medium':return (0, _classnames.default)(_Button.jsStyles.sizeMedium(this.theme), (_cn7 = {}, _cn7[_Button.jsStyles.sizeMediumLoading(this.theme)] = this.props.loading, _cn7));case 'small':default:return (0, _classnames.default)(_Button.jsStyles.sizeSmall(this.theme), (_cn8 = {}, _cn8[_Button.jsStyles.sizeSmallLoading(this.theme)] = this.props.loading, _cn8));}};return Button;}(_react.default.Component);exports.Button = Button;Button.__KONTUR_REACT_UI__ = 'Button';Button.__BUTTON__ = true;Button.TOP_LEFT = _Corners.Corners.TOP_LEFT;Button.TOP_RIGHT = _Corners.Corners.TOP_RIGHT;Button.BOTTOM_RIGHT = _Corners.Corners.BOTTOM_RIGHT;Button.BOTTOM_LEFT = _Corners.Corners.BOTTOM_LEFT;Button.defaultProps = { use: 'default', size: 'small', type: 'button' };var isButton = function isButton(child) {return _react.default.isValidElement(child) ? Object.prototype.hasOwnProperty.call(child.type, '__BUTTON__') : false;};exports.isButton = isButton;
+      type: this.props.type, className: (0, _Emotion.cx)((_cx = {}, _cx[_Button.styles.root(this.theme)] = true, _cx[_Button.styles[use](this.theme)] = true, _cx[_Button.activeStyles[use](this.theme)] = active, _cx[sizeClass] = true, _cx[_Button.styles.focus(this.theme)] = isFocused && !checked, _cx[_Button.styles.checked(this.theme)] = checked, _cx[_Button.styles.disabled(this.theme)] = disabled || loading, _cx[_Button.styles.checkedDisabled(this.theme)] = checked && disabled, _cx[_Button.styles.borderless()] = borderless && !disabled && !loading && !checked && !isFocused && !active, _cx[_Button.styles.narrow()] = narrow, _cx[_Button.styles.noPadding()] = _noPadding, _cx[_Button.styles.noRightPadding()] = _noRightPadding, _cx)), style: { borderTopLeftRadius: corners & _Corners.Corners.TOP_LEFT ? 0 : undefined, borderTopRightRadius: corners & _Corners.Corners.TOP_RIGHT ? 0 : undefined, borderBottomRightRadius: corners & _Corners.Corners.BOTTOM_RIGHT ? 0 : undefined, borderBottomLeftRadius: corners & _Corners.Corners.BOTTOM_LEFT ? 0 : undefined, textAlign: align }, disabled: disabled || loading, onClick: onClick, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: onKeyDown, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onMouseOver: onMouseOver, tabIndex: disableFocus ? -1 : 0, title: this.props.title };var wrapProps = { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Button.styles.wrap(this.theme)] = true, _cx2[_Button.styles.wrapArrow()] = arrow === true, _cx2[_Button.styles.wrapArrowLeft()] = arrow === 'left', _cx2[this.getSizeWrapClassName()] = true, _cx2)), style: { width: width } };var innerShadowNode = /*#__PURE__*/_react.default.createElement("div", { className: _Button.globalClasses.innerShadow });var outlineNode = null;if (!isFocused || isLink) {var _cx3;outlineNode = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.styles.outline(), (_cx3 = {}, _cx3[_Button.styles.outlineWarning(this.theme)] = warning, _cx3[_Button.styles.outlineError(this.theme)] = error, _cx3[_Button.styles.outlineLink()] = isLink, _cx3[_Button.styles.outlineLinkWarning(this.theme)] = isLink && warning, _cx3[_Button.styles.outlineLinkError(this.theme)] = isLink && error, _cx3)) });}var loadingNode = null;if (loading && !icon) {loadingNode = /*#__PURE__*/_react.default.createElement("div", { className: _Button.styles.loading() }, this.getLoadingSpinner());}var iconNode = null;if (icon) {var _cx4;iconNode = /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)(_Button.styles.icon(), this.getSizeIconClassName(), (_cx4 = {}, _cx4[_Button.styles.iconNoRightPadding()] = !children, _cx4[_Button.styles.iconLink(this.theme)] = isLink, _cx4)) }, loading ? this.getLoadingSpinner() : icon);}var arrowNode = null;if (arrow) {var _cx5;arrowNode = /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Button.styles.arrow()] = true, _cx5[_Button.styles.arrowWarning(this.theme)] = !checked && warning, _cx5[_Button.styles.arrowError(this.theme)] = !checked && error, _cx5[_Button.styles.arrowFocus(this.theme)] = !checked && isFocused, _cx5[_Button.styles.arrowLeft()] = arrow === 'left', _cx5)) }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.globalClasses.arrowHelper, _Button.globalClasses.arrowHelperTop) }), /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.globalClasses.arrowHelper, _Button.globalClasses.arrowHelperBottom) }));} // Force disable all props and features, that cannot be use with Link
+    if (isLink) {var _cx6;rootProps.className = (0, _Emotion.cx)((_cx6 = {}, _cx6[_Button.styles.root(this.theme)] = true, _cx6[sizeClass] = true, _cx6[_Button.styles.link(this.theme)] = true, _cx6[_Button.styles.linkFocus(this.theme)] = isFocused, _cx6[_Button.styles.linkDisabled(this.theme)] = disabled || loading, _cx6));Object.assign(wrapProps, { className: (0, _Emotion.cx)(_Button.styles.wrap(this.theme), _Button.styles.wrapLink()), style: { width: wrapProps.style.width } });rootProps.style.textAlign = undefined;arrowNode = null;}return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", wrapProps, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({ ref: this._ref }, rootProps), innerShadowNode, outlineNode, loadingNode, arrowNode, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)(_Button.styles.caption(), _Button.globalClasses.caption, (_cx7 = {}, _cx7[_Button.styles.captionTranslated()] = active || checked, _cx7[_Button.styles.captionLink()] = isLink, _cx7[_Button.styles.captionDisabled()] = !checked && disabled, _cx7)) }, iconNode, /*#__PURE__*/_react.default.createElement("span", { className: (0, _Emotion.cx)((_cx8 = {}, _cx8[_Button.styles.visibilityHidden()] = !!loadingNode, _cx8)) }, children)))));};_proto.getLoadingSpinner = function getLoadingSpinner() {return /*#__PURE__*/_react.default.createElement(_Spinner.Spinner, { caption: null, dimmed: true, type: "mini" });};_proto.getSizeClassName = function getSizeClassName() {var _cx9, _cx10, _cx11;switch (this.props.size) {case 'large':return (0, _Emotion.cx)(_Button.styles.sizeLarge(this.theme), (_cx9 = {}, _cx9[_Button.styles.sizeLargeIE11(this.theme)] = _client.isIE11 || _client.isEdge, _cx9));case 'medium':return (0, _Emotion.cx)(_Button.styles.sizeMedium(this.theme), (_cx10 = {}, _cx10[_Button.styles.sizeMediumIE11(this.theme)] = _client.isIE11 || _client.isEdge, _cx10));case 'small':default:return (0, _Emotion.cx)(_Button.styles.sizeSmall(this.theme), (_cx11 = {}, _cx11[_Button.styles.sizeSmallIE11(this.theme)] = _client.isIE11 || _client.isEdge, _cx11));}};_proto.getSizeIconClassName = function getSizeIconClassName() {switch (this.props.size) {case 'large':return _Button.styles.iconLarge(this.theme);case 'medium':return _Button.styles.iconMedium(this.theme);case 'small':default:return _Button.styles.iconSmall(this.theme);}};_proto.getSizeWrapClassName = function getSizeWrapClassName() {switch (this.props.size) {case 'large':return _Button.styles.wrapLarge(this.theme);case 'medium':return _Button.styles.wrapMedium(this.theme);case 'small':default:return _Button.styles.wrapSmall(this.theme);}};return Button;}(_react.default.Component), _class2.__KONTUR_REACT_UI__ = 'Button', _class2.__BUTTON__ = true, _class2.TOP_LEFT = _Corners.Corners.TOP_LEFT, _class2.TOP_RIGHT = _Corners.Corners.TOP_RIGHT, _class2.BOTTOM_RIGHT = _Corners.Corners.BOTTOM_RIGHT, _class2.BOTTOM_LEFT = _Corners.Corners.BOTTOM_LEFT, _class2.defaultProps = { use: 'default', size: 'small', type: 'button' }, _temp)) || _class;exports.Button = Button;var isButton = function isButton(child) {var _child$type; // @ts-ignore
+  return (child == null ? void 0 : (_child$type = child.type) == null ? void 0 : _child$type.__KONTUR_REACT_UI__) === 'Button';};exports.isButton = isButton;

package/cjs/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Button.tsx"],"names":["Button","state","focusedByTab","theme","node","handleFocus","e","props","disabled","disableFocus","process","nextTick","tabListener","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","blur","render","renderMain","corners","sizeClass","getSizeClassName","isError","error","isWarning","warning","rootProps","type","className","jsStyles","root","use","default","active","validationRoot","narrow","noPadding","_noPadding","noRightPadding","_noRightPadding","buttonWithIcon","icon","borderless","visuallyFocused","checked","loading","fallback","isIE11","isEdge","style","borderTopLeftRadius","Corners","TOP_LEFT","undefined","borderTopRightRadius","TOP_RIGHT","borderBottomRightRadius","BOTTOM_RIGHT","borderBottomLeftRadius","BOTTOM_LEFT","textAlign","align","onClick","onKeyDown","onMouseEnter","onMouseLeave","onMouseOver","tabIndex","wrapProps","wrap","wrapArrow","arrow","wrapArrowLeft","width","arrowWarning","arrowError","arrowLeft","link","Object","assign","wrapLink","caption","children","size","sizeLarge","sizeLargeLoading","sizeMedium","sizeMediumLoading","sizeSmall","sizeSmallLoading","React","Component","__KONTUR_REACT_UI__","__BUTTON__","defaultProps","isButton","child","isValidElement","prototype","hasOwnProperty","call"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\n\r\nimport { isIE11, isEdge } from '../../lib/utils';\r\nimport { tabListener } from '../../lib/events/tabListener';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\n\r\nimport { jsStyles } from './Button.styles';\r\nimport { Corners } from './Corners';\r\n\r\nexport type ButtonSize = 'small' | 'medium' | 'large';\r\nexport type ButtonType = 'button' | 'submit' | 'reset';\r\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';\r\n\r\nexport interface ButtonProps {\r\n  /** @ignore */\r\n  _noPadding?: boolean;\r\n\r\n  /** @ignore */\r\n  _noRightPadding?: boolean;\r\n\r\n  /**\r\n   * Визуально нажатое состояние.\r\n   */\r\n  active?: boolean;\r\n\r\n  /** `type TextAlignProperty = \"inherit\" | \"initial\" | \"unset\" | \"center\" | \"end\" | \"justify\" | \"left\" | \"match-parent\" | \"right\" | \"start\"` */\r\n  align?: React.CSSProperties['textAlign'];\r\n\r\n  /**\r\n   * Кнопка со стрелкой.\r\n   *\r\n   * `type ButtonArrow = boolean | \"left\"`\r\n   */\r\n  arrow?: boolean | 'left';\r\n\r\n  autoFocus?: boolean;\r\n\r\n  borderless?: boolean;\r\n\r\n  checked?: boolean;\r\n\r\n  children?: React.ReactNode;\r\n\r\n  /** @ignore */\r\n  corners?: number;\r\n\r\n  disabled?: boolean;\r\n\r\n  /** @ignore */\r\n  disableFocus?: boolean;\r\n\r\n  error?: boolean;\r\n\r\n  focused?: boolean;\r\n\r\n  /**\r\n   * Иконка слева от текста кнопки.\r\n   */\r\n  icon?: React.ReactElement<any>;\r\n\r\n  loading?: boolean;\r\n\r\n  narrow?: boolean;\r\n\r\n  onBlur?: React.FocusEventHandler<HTMLButtonElement>;\r\n\r\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\r\n\r\n  onFocus?: React.FocusEventHandler<HTMLButtonElement>;\r\n\r\n  onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\r\n\r\n  onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\r\n\r\n  onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\r\n\r\n  onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;\r\n\r\n  /** `type ButtonSize = \"small\" | \"medium\" | \"large\"` */\r\n  size?: ButtonSize;\r\n\r\n  /** `type ButtonType = \"button\" | \"submit\" | \"reset\"` */\r\n  type?: ButtonType;\r\n\r\n  /**\r\n   * Вариант использования. Влияет на цвет кнопки.\r\n   *\r\n   * `type ButtonUse = \"default\" | \"primary\" | \"success\" | \"danger\" | \"pay\" | \"link\"`\r\n   */\r\n  use?: ButtonUse;\r\n\r\n  /** @ignore */\r\n  visuallyFocused?: boolean;\r\n\r\n  warning?: boolean;\r\n\r\n  width?: number | string;\r\n}\r\n\r\nexport interface ButtonState {\r\n  focusedByTab: boolean;\r\n}\r\n\r\nexport class Button extends React.Component<ButtonProps, ButtonState> {\r\n  public static __KONTUR_REACT_UI__ = 'Button';\r\n  public static __BUTTON__ = true;\r\n  public static TOP_LEFT = Corners.TOP_LEFT;\r\n  public static TOP_RIGHT = Corners.TOP_RIGHT;\r\n  public static BOTTOM_RIGHT = Corners.BOTTOM_RIGHT;\r\n  public static BOTTOM_LEFT = Corners.BOTTOM_LEFT;\r\n\r\n  public static defaultProps = {\r\n    use: 'default',\r\n    size: 'small',\r\n    type: 'button',\r\n  };\r\n\r\n  public state = {\r\n    focusedByTab: false,\r\n  };\r\n\r\n  private theme!: Theme;\r\n  private node: HTMLButtonElement | null = null;\r\n\r\n  public componentDidMount() {\r\n    if (this.props.autoFocus) {\r\n      tabListener.isTabPressed = true;\r\n      this.focus();\r\n    }\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public focus() {\r\n    this.node?.focus();\r\n  }\r\n\r\n  /**\r\n   * @public\r\n   */\r\n  public blur() {\r\n    this.node?.blur();\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 this.renderMain();\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  private renderMain() {\r\n    const { corners = 0 } = this.props;\r\n    const sizeClass = this.getSizeClassName();\r\n\r\n    const isError = !!this.props.error;\r\n    const isWarning = !!this.props.warning;\r\n    const rootProps = {\r\n      // By default the type attribute is 'submit'. IE8 will fire a click event\r\n      // on this button if somewhere on the page user presses Enter while some\r\n      // input is focused. So we set type to 'button' by default.\r\n      type: this.props.type,\r\n      className: cn({\r\n        [jsStyles.root(this.theme)]: true,\r\n        [(jsStyles[this.props.use!] && jsStyles[this.props.use!](this.theme)) || jsStyles.default(this.theme)]: true,\r\n        [jsStyles.active(this.theme)]: !!this.props.active,\r\n        [jsStyles.validationRoot(this.theme)]: isError || isWarning,\r\n        [jsStyles.error(this.theme)]: isError,\r\n        [jsStyles.warning(this.theme)]: isWarning,\r\n        [jsStyles.narrow()]: !!this.props.narrow,\r\n        [jsStyles.noPadding()]: !!this.props._noPadding,\r\n        [jsStyles.noRightPadding()]: !!this.props._noRightPadding,\r\n        [jsStyles.buttonWithIcon()]: !!this.props.icon,\r\n        [sizeClass]: true,\r\n        [jsStyles.borderless(this.theme)]: !!this.props.borderless,\r\n        [jsStyles.focus(this.theme)]: this.state.focusedByTab || !!this.props.visuallyFocused,\r\n        [jsStyles.checked(this.theme)]: !!this.props.checked && !this.props.disabled,\r\n        [jsStyles.disabled(this.theme)]: !!this.props.disabled || !!this.props.loading,\r\n        [jsStyles.fallback(this.theme)]: isIE11 || isEdge,\r\n      }),\r\n      style: {\r\n        borderTopLeftRadius: corners & Corners.TOP_LEFT ? 0 : undefined,\r\n        borderTopRightRadius: corners & Corners.TOP_RIGHT ? 0 : undefined,\r\n        borderBottomRightRadius: corners & Corners.BOTTOM_RIGHT ? 0 : undefined,\r\n        borderBottomLeftRadius: corners & Corners.BOTTOM_LEFT ? 0 : undefined,\r\n        textAlign: this.props.align,\r\n      },\r\n      disabled: this.props.disabled || this.props.loading,\r\n      onClick: this.props.onClick,\r\n      onFocus: this.handleFocus,\r\n      onBlur: this.handleBlur,\r\n      onKeyDown: this.props.onKeyDown,\r\n      onMouseEnter: this.props.onMouseEnter,\r\n      onMouseLeave: this.props.onMouseLeave,\r\n      onMouseOver: this.props.onMouseOver,\r\n      tabIndex: this.props.disableFocus ? -1 : 0,\r\n    };\r\n\r\n    const wrapProps = {\r\n      className: cn({\r\n        [jsStyles.wrap(this.theme)]: true,\r\n        [jsStyles.wrapArrow()]: this.props.arrow === true,\r\n        [jsStyles.wrapArrowLeft()]: this.props.arrow === 'left',\r\n      }),\r\n      style: {\r\n        width: this.props.width,\r\n      },\r\n    };\r\n\r\n    let error = null;\r\n    if (this.props.error) {\r\n      error = <div className={jsStyles.error(this.theme)} />;\r\n    } else if (this.props.warning) {\r\n      error = <div className={jsStyles.warning(this.theme)} />;\r\n    }\r\n\r\n    let loading = null;\r\n    if (this.props.loading) {\r\n      loading = <div className={jsStyles.loading()} />;\r\n    }\r\n\r\n    let icon = this.props.icon;\r\n    if (this.props.icon) {\r\n      icon = <span className={jsStyles.icon()}>{this.props.icon}</span>;\r\n    }\r\n\r\n    let arrow = null;\r\n    if (this.props.arrow) {\r\n      arrow = (\r\n        <div\r\n          className={cn({\r\n            [jsStyles.arrowWarning(this.theme)]: isWarning,\r\n            [jsStyles.arrowError(this.theme)]: isError,\r\n            [jsStyles.arrow()]: true,\r\n            [jsStyles.arrowLeft(this.theme)]: this.props.arrow === 'left',\r\n          })}\r\n        />\r\n      );\r\n    }\r\n\r\n    // Force disable all props and features, that cannot be use with Link\r\n    if (this.props.use === 'link') {\r\n      rootProps.className = cn({\r\n        [jsStyles.root(this.theme)]: true,\r\n        [jsStyles.buttonWithIcon()]: !!this.props.icon,\r\n        [sizeClass]: true,\r\n        [jsStyles.focus(this.theme)]: this.state.focusedByTab || !!this.props.visuallyFocused,\r\n        [jsStyles.link(this.theme)]: true,\r\n        [jsStyles.disabled(this.theme)]: !!this.props.disabled,\r\n      });\r\n      Object.assign(wrapProps, {\r\n        className: cn(jsStyles.wrap(this.theme), {\r\n          [jsStyles.wrapLink(this.theme)]: this.props.use === 'link',\r\n        }),\r\n        style: { width: wrapProps.style.width },\r\n      });\r\n      rootProps.style.textAlign = undefined;\r\n      loading = null;\r\n      arrow = null;\r\n    }\r\n\r\n    return (\r\n      <span {...wrapProps}>\r\n        <button ref={this._ref} {...rootProps}>\r\n          {error}\r\n          {loading}\r\n          {arrow}\r\n          <div className={jsStyles.caption()}>\r\n            {icon}\r\n            {this.props.children}\r\n          </div>\r\n        </button>\r\n      </span>\r\n    );\r\n  }\r\n\r\n  private getSizeClassName() {\r\n    switch (this.props.size) {\r\n      case 'large':\r\n        return cn(jsStyles.sizeLarge(this.theme), {\r\n          [jsStyles.sizeLargeLoading(this.theme)]: this.props.loading,\r\n        });\r\n      case 'medium':\r\n        return cn(jsStyles.sizeMedium(this.theme), {\r\n          [jsStyles.sizeMediumLoading(this.theme)]: this.props.loading,\r\n        });\r\n      case 'small':\r\n      default:\r\n        return cn(jsStyles.sizeSmall(this.theme), {\r\n          [jsStyles.sizeSmallLoading(this.theme)]: this.props.loading,\r\n        });\r\n    }\r\n  }\r\n\r\n  private handleFocus = (e: React.FocusEvent<HTMLButtonElement>) => {\r\n    if (!this.props.disabled && !this.props.disableFocus) {\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      this.props.onFocus?.(e);\r\n    }\r\n  };\r\n\r\n  private handleBlur = (e: React.FocusEvent<HTMLButtonElement>) => {\r\n    this.setState({ focusedByTab: false });\r\n    if (!this.props.disabled && !this.props.disableFocus) {\r\n      this.props.onBlur?.(e);\r\n    }\r\n  };\r\n\r\n  private _ref = (node: HTMLButtonElement | null) => {\r\n    this.node = node;\r\n  };\r\n}\r\n\r\nexport const isButton = (child: React.ReactChild): child is React.ReactElement<ButtonProps> => {\r\n  return React.isValidElement<ButtonProps>(child)\r\n    ? Object.prototype.hasOwnProperty.call(child.type, '__BUTTON__')\r\n    : false;\r\n};\r\n"]}
+{"version":3,"sources":["Button.tsx"],"names":["Button","rootNode","state","focusedByTab","node","handleFocus","e","props","disabled","disableFocus","requestAnimationFrame","keyListener","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","getDerivedStateFromProps","loading","blur","render","theme","renderMain","corners","active","borderless","checked","error","warning","arrow","narrow","icon","_noPadding","_noRightPadding","use","defaultProps","visuallyFocused","align","onMouseEnter","onMouseLeave","onMouseOver","onKeyDown","onClick","width","children","sizeClass","getSizeClassName","isFocused","isLink","rootProps","type","className","styles","root","activeStyles","checkedDisabled","noPadding","noRightPadding","style","borderTopLeftRadius","Corners","TOP_LEFT","undefined","borderTopRightRadius","TOP_RIGHT","borderBottomRightRadius","BOTTOM_RIGHT","borderBottomLeftRadius","BOTTOM_LEFT","textAlign","tabIndex","title","wrapProps","wrap","wrapArrow","wrapArrowLeft","getSizeWrapClassName","innerShadowNode","globalClasses","innerShadow","outlineNode","outline","outlineWarning","outlineError","outlineLink","outlineLinkWarning","outlineLinkError","loadingNode","getLoadingSpinner","iconNode","getSizeIconClassName","iconNoRightPadding","iconLink","arrowNode","arrowWarning","arrowError","arrowFocus","arrowLeft","arrowHelper","arrowHelperTop","arrowHelperBottom","link","linkFocus","linkDisabled","Object","assign","wrapLink","setRootNode","caption","captionTranslated","captionLink","captionDisabled","visibilityHidden","size","sizeLarge","sizeLargeIE11","isIE11","isEdge","sizeMedium","sizeMediumIE11","sizeSmall","sizeSmallIE11","iconLarge","iconMedium","iconSmall","wrapLarge","wrapMedium","wrapSmall","React","Component","__KONTUR_REACT_UI__","__BUTTON__","isButton","child"],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport { isIE11, isEdge } from '../../lib/client';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Spinner } from '../Spinner';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\n\nimport { styles, activeStyles, globalClasses } from './Button.styles';\nimport { Corners } from './Corners';\n\nexport type ButtonSize = 'small' | 'medium' | 'large';\nexport type ButtonType = 'button' | 'submit' | 'reset';\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link';\n\nexport interface ButtonProps extends CommonProps {\n  /** @ignore */\n  _noPadding?: boolean;\n\n  /** @ignore */\n  _noRightPadding?: boolean;\n\n  /**\n   * Применяет к кнопке стили псевдокласса `:active`.\n   */\n  active?: boolean;\n\n  /**\n   * CSS-свойство `text-align`.\n   */\n  align?: React.CSSProperties['textAlign'];\n\n  /**\n   * Превращает обычную кнопку в кнопку со стрелкой.\n   */\n  arrow?: boolean | 'left';\n\n  /**\n   * Даёт кнопке фокус после окончания загрузки страницы.\n   */\n  autoFocus?: boolean;\n\n  /**\n   * Убирает обводку у кнопки.\n   */\n  borderless?: boolean;\n\n  /**\n   * @ignore\n   */\n  checked?: boolean;\n\n  children?: React.ReactNode;\n\n  /** @ignore */\n  corners?: number;\n\n  /**\n   * Отключенное состояние кнопки.\n   */\n  disabled?: boolean;\n\n  /** @ignore */\n  disableFocus?: boolean;\n\n  /**\n   * Cостояние валидации при ошибке.\n   */\n  error?: boolean;\n\n  /**\n   * Иконка слева от текста кнопки.\n   */\n  icon?: React.ReactElement<any>;\n\n  /**\n   * Переводит кнопку в состояние загрузки.\n   */\n  loading?: boolean;\n\n  /**\n   * Сужает кнопку.\n   */\n  narrow?: boolean;\n\n  /**\n   * HTML-событие `onblur`.\n   */\n  onBlur?: React.FocusEventHandler<HTMLButtonElement>;\n\n  /**\n   * HTML-событие `onclick`.\n   */\n  onClick?: React.MouseEventHandler<HTMLButtonElement>;\n\n  /**\n   * HTML-событие `onfocus`.\n   */\n  onFocus?: React.FocusEventHandler<HTMLButtonElement>;\n\n  /**\n   * HTML-событие `keydown`.\n   */\n  onKeyDown?: React.KeyboardEventHandler<HTMLButtonElement>;\n\n  /**\n   * HTML-событие `onmouseenter`.\n   */\n  onMouseEnter?: React.MouseEventHandler<HTMLButtonElement>;\n\n  /**\n   * HTML-событие `mouseleave`.\n   */\n  onMouseLeave?: React.MouseEventHandler<HTMLButtonElement>;\n\n  /**\n   * HTML-событие `onmouseover`.\n   */\n  onMouseOver?: React.MouseEventHandler<HTMLButtonElement>;\n\n  /**\n   * Задаёт размер кнопки.\n   *\n   * **Допустимые значения**: `\"small\"`, `\"medium\"`, `\"large\"`.\n   */\n  size?: ButtonSize;\n\n  /**\n   * HTML-атрибут `type`.\n   */\n  type?: ButtonType;\n\n  /**\n   * HTML-атрибут `title`.\n   */\n  title?: string;\n\n  /**\n   * Стиль кнопки.\n   *\n   * **Допустимые значения**: `\"default\"`, `\"primary\"`, `\"success\"`, `\"danger\"`, `\"pay\"`, `\"link\"`.\n   */\n  use?: ButtonUse;\n\n  /** @ignore */\n  visuallyFocused?: boolean;\n\n  /**\n   * Cостояние валидации при предупреждении.\n   */\n  warning?: boolean;\n\n  /**\n   * CSS-свойство `width`.\n   */\n  width?: number | string;\n}\n\nexport interface ButtonState {\n  focusedByTab: boolean;\n}\n\n@rootNode\nexport class Button extends React.Component<ButtonProps, ButtonState> {\n  public static __KONTUR_REACT_UI__ = 'Button';\n  public static __BUTTON__ = true;\n  public static TOP_LEFT = Corners.TOP_LEFT;\n  public static TOP_RIGHT = Corners.TOP_RIGHT;\n  public static BOTTOM_RIGHT = Corners.BOTTOM_RIGHT;\n  public static BOTTOM_LEFT = Corners.BOTTOM_LEFT;\n\n  public static defaultProps = {\n    use: 'default' as ButtonUse,\n    size: 'small' as ButtonSize,\n    type: 'button' as ButtonType,\n  };\n\n  public state = {\n    focusedByTab: false,\n  };\n\n  private theme!: Theme;\n  private node: HTMLButtonElement | null = null;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    if (this.props.autoFocus) {\n      keyListener.isTabPressed = true;\n      this.focus();\n    }\n  }\n\n  public static getDerivedStateFromProps(props: ButtonProps) {\n    if (props.loading || props.disabled) {\n      return { focusedByTab: false };\n    }\n    return null;\n  }\n\n  /**\n   * @public\n   */\n  public focus() {\n    this.node?.focus();\n  }\n\n  /**\n   * @public\n   */\n  public blur() {\n    this.node?.blur();\n  }\n\n  public render(): JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  private renderMain() {\n    const {\n      corners = 0,\n      active,\n      disabled,\n      borderless,\n      checked,\n      error,\n      warning,\n      loading,\n      arrow,\n      narrow,\n      icon,\n      _noPadding,\n      _noRightPadding,\n      use = Button.defaultProps.use,\n      visuallyFocused,\n      align,\n      disableFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onKeyDown,\n      onClick,\n      width,\n      children,\n    } = this.props;\n    const sizeClass = this.getSizeClassName();\n\n    const isFocused = this.state.focusedByTab || visuallyFocused;\n    const isLink = use === 'link';\n    const rootProps = {\n      // By default the type attribute is 'submit'. IE8 will fire a click event\n      // on this button if somewhere on the page user presses Enter while some\n      // input is focused. So we set type to 'button' by default.\n      type: this.props.type,\n      className: cx({\n        [styles.root(this.theme)]: true,\n        [styles[use](this.theme)]: true,\n        [activeStyles[use](this.theme)]: active,\n        [sizeClass]: true,\n        [styles.focus(this.theme)]: isFocused && !checked,\n        [styles.checked(this.theme)]: checked,\n        [styles.disabled(this.theme)]: disabled || loading,\n        [styles.checkedDisabled(this.theme)]: checked && disabled,\n        [styles.borderless()]: borderless && !disabled && !loading && !checked && !isFocused && !active,\n        [styles.narrow()]: narrow,\n        [styles.noPadding()]: _noPadding,\n        [styles.noRightPadding()]: _noRightPadding,\n      }),\n      style: {\n        borderTopLeftRadius: corners & Corners.TOP_LEFT ? 0 : undefined,\n        borderTopRightRadius: corners & Corners.TOP_RIGHT ? 0 : undefined,\n        borderBottomRightRadius: corners & Corners.BOTTOM_RIGHT ? 0 : undefined,\n        borderBottomLeftRadius: corners & Corners.BOTTOM_LEFT ? 0 : undefined,\n        textAlign: align,\n      },\n      disabled: disabled || loading,\n      onClick: onClick,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      onKeyDown: onKeyDown,\n      onMouseEnter: onMouseEnter,\n      onMouseLeave: onMouseLeave,\n      onMouseOver: onMouseOver,\n      tabIndex: disableFocus ? -1 : 0,\n      title: this.props.title,\n    };\n\n    const wrapProps = {\n      className: cx({\n        [styles.wrap(this.theme)]: true,\n        [styles.wrapArrow()]: arrow === true,\n        [styles.wrapArrowLeft()]: arrow === 'left',\n        [this.getSizeWrapClassName()]: true,\n      }),\n      style: {\n        width: width,\n      },\n    };\n\n    const innerShadowNode = <div className={globalClasses.innerShadow} />;\n\n    let outlineNode = null;\n    if (!isFocused || isLink) {\n      outlineNode = (\n        <div\n          className={cx(styles.outline(), {\n            [styles.outlineWarning(this.theme)]: warning,\n            [styles.outlineError(this.theme)]: error,\n            [styles.outlineLink()]: isLink,\n            [styles.outlineLinkWarning(this.theme)]: isLink && warning,\n            [styles.outlineLinkError(this.theme)]: isLink && error,\n          })}\n        />\n      );\n    }\n\n    let loadingNode = null;\n    if (loading && !icon) {\n      loadingNode = <div className={styles.loading()}>{this.getLoadingSpinner()}</div>;\n    }\n\n    let iconNode = null;\n    if (icon) {\n      iconNode = (\n        <span\n          className={cx(styles.icon(), this.getSizeIconClassName(), {\n            [styles.iconNoRightPadding()]: !children,\n            [styles.iconLink(this.theme)]: isLink,\n          })}\n        >\n          {loading ? this.getLoadingSpinner() : icon}\n        </span>\n      );\n    }\n\n    let arrowNode = null;\n    if (arrow) {\n      arrowNode = (\n        <div\n          className={cx({\n            [styles.arrow()]: true,\n            [styles.arrowWarning(this.theme)]: !checked && warning,\n            [styles.arrowError(this.theme)]: !checked && error,\n            [styles.arrowFocus(this.theme)]: !checked && isFocused,\n            [styles.arrowLeft()]: arrow === 'left',\n          })}\n        >\n          <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperTop)} />\n          <div className={cx(globalClasses.arrowHelper, globalClasses.arrowHelperBottom)} />\n        </div>\n      );\n    }\n\n    // Force disable all props and features, that cannot be use with Link\n    if (isLink) {\n      rootProps.className = cx({\n        [styles.root(this.theme)]: true,\n        [sizeClass]: true,\n        [styles.link(this.theme)]: true,\n        [styles.linkFocus(this.theme)]: isFocused,\n        [styles.linkDisabled(this.theme)]: disabled || loading,\n      });\n      Object.assign(wrapProps, {\n        className: cx(styles.wrap(this.theme), styles.wrapLink()),\n        style: { width: wrapProps.style.width },\n      });\n      rootProps.style.textAlign = undefined;\n      arrowNode = null;\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <span {...wrapProps}>\n          <button ref={this._ref} {...rootProps}>\n            {innerShadowNode}\n            {outlineNode}\n            {loadingNode}\n            {arrowNode}\n            <div\n              className={cx(styles.caption(), globalClasses.caption, {\n                [styles.captionTranslated()]: active || checked,\n                [styles.captionLink()]: isLink,\n                [styles.captionDisabled()]: !checked && disabled,\n              })}\n            >\n              {iconNode}\n              <span className={cx({ [styles.visibilityHidden()]: !!loadingNode })}>{children}</span>\n            </div>\n          </button>\n        </span>\n      </CommonWrapper>\n    );\n  }\n\n  private getLoadingSpinner() {\n    return <Spinner caption={null} dimmed type=\"mini\" />;\n  }\n\n  private getSizeClassName() {\n    switch (this.props.size) {\n      case 'large':\n        return cx(styles.sizeLarge(this.theme), { [styles.sizeLargeIE11(this.theme)]: isIE11 || isEdge });\n      case 'medium':\n        return cx(styles.sizeMedium(this.theme), { [styles.sizeMediumIE11(this.theme)]: isIE11 || isEdge });\n      case 'small':\n      default:\n        return cx(styles.sizeSmall(this.theme), { [styles.sizeSmallIE11(this.theme)]: isIE11 || isEdge });\n    }\n  }\n\n  private getSizeIconClassName() {\n    switch (this.props.size) {\n      case 'large':\n        return styles.iconLarge(this.theme);\n      case 'medium':\n        return styles.iconMedium(this.theme);\n      case 'small':\n      default:\n        return styles.iconSmall(this.theme);\n    }\n  }\n\n  private getSizeWrapClassName() {\n    switch (this.props.size) {\n      case 'large':\n        return styles.wrapLarge(this.theme);\n      case 'medium':\n        return styles.wrapMedium(this.theme);\n      case 'small':\n      default:\n        return styles.wrapSmall(this.theme);\n    }\n  }\n\n  private handleFocus = (e: React.FocusEvent<HTMLButtonElement>) => {\n    if (!this.props.disabled && !this.props.disableFocus) {\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      this.props.onFocus?.(e);\n    }\n  };\n\n  private handleBlur = (e: React.FocusEvent<HTMLButtonElement>) => {\n    this.setState({ focusedByTab: false });\n    if (!this.props.disabled && !this.props.disableFocus) {\n      this.props.onBlur?.(e);\n    }\n  };\n\n  private _ref = (node: HTMLButtonElement | null) => {\n    this.node = node;\n  };\n}\n\nexport const isButton = (child: React.ReactChild): child is React.ReactElement<ButtonProps> => {\n  // @ts-ignore\n  return child?.type?.__KONTUR_REACT_UI__ === 'Button';\n};\n"]}