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

package/components/Button/Button/Button.js

@@ -0,0 +1,388 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+var _excluded = ["onClick", "onFocus", "onBlur", "children"];
+
+var _class, _class2, _temp;
+
+import React from 'react';
+import { globalObject } from '@skbkontur/global-object';
+import { isKonturIcon, isReactUIComponent } from "../../../lib/utils";
+import { isEdge, isIE11, isSafari } from "../../../lib/client";
+import { keyListener } from "../../../lib/events/keyListener";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { rootNode } from "../../../lib/rootNode";
+import { ThemeFactory } from "../../../lib/theming/ThemeFactory";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { isTheme2022 } from "../../../lib/theming/ThemeHelpers";
+import { Link } from "../../Link";
+import { EmotionConsumer } from "../../../lib/theming/Emotion";
+import { getActiveStyles, getStyles, globalClasses } from "../Button.styles";
+import { ButtonIcon, getButtonIconSizes } from "../ButtonIcon";
+import { useButtonArrow } from "../ButtonArrow";
+import { getInnerLinkTheme } from "../getInnerLinkTheme";
+import { LoadingButtonIcon } from "../LoadingButtonIcon";
+/**
+ * @deprecated use SizeProp
+ */
+
+export var ButtonDataTids = {
+  rootElement: 'Button__rootElement',
+  root: 'Button__root',
+  spinner: 'Button__spinner'
+};
+export var Button = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(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.getProps = createPropsGetter(Button.defaultProps);
+    _this.state = {
+      focusedByTab: false
+    };
+    _this.node = null;
+
+    _this.handleFocus = function (e) {
+      if (!_this.props.disabled && !_this.props.disableFocus) {
+        // 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.props.onFocus == null ? void 0 : _this.props.onFocus(e);
+      }
+    };
+
+    _this.handleBlur = function (e) {
+      _this.setState({
+        focusedByTab: false
+      });
+
+      if (!_this.props.disabled && !_this.props.disableFocus) {
+        _this.props.onBlur == null ? void 0 : _this.props.onBlur(e);
+      }
+    };
+
+    _this._ref = function (node) {
+      _this.node = node;
+    };
+
+    return _this;
+  }
+
+  var _proto = Button.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    if (this.props.autoFocus) {
+      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.createElement(EmotionConsumer, null, function (emotion) {
+      _this2.emotion = emotion;
+      return /*#__PURE__*/React.createElement(ThemeContext.Consumer, null, function (theme) {
+        _this2.theme = _this2.props.theme ? ThemeFactory.create(_this2.props.theme, theme) : theme;
+        return _this2.renderMain();
+      });
+    });
+  };
+
+  _proto.renderLinkRootWithoutHandlers = function renderLinkRootWithoutHandlers(props) {
+    var onClick = props.onClick,
+        onFocus = props.onFocus,
+        onBlur = props.onBlur,
+        children = props.children,
+        rest = _objectWithoutPropertiesLoose(props, _excluded);
+
+    return /*#__PURE__*/React.createElement("span", rest, children);
+  };
+
+  _proto.renderMain = function renderMain() {
+    var _this$emotion$cx2, _this$emotion$cx5, _this$emotion$cx6;
+
+    var _this$props = this.props,
+        corners = _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,
+        narrow = _this$props.narrow,
+        icon = _this$props.icon,
+        rightIcon = _this$props.rightIcon,
+        _noPadding = _this$props._noPadding,
+        _noRightPadding = _this$props._noRightPadding,
+        visuallyFocused = _this$props.visuallyFocused,
+        align = _this$props.align,
+        disableFocus = _this$props.disableFocus,
+        onMouseEnter = _this$props.onMouseEnter,
+        onMouseLeave = _this$props.onMouseLeave,
+        onMouseOver = _this$props.onMouseOver,
+        onMouseDown = _this$props.onMouseDown,
+        onMouseUp = _this$props.onMouseUp,
+        onKeyDown = _this$props.onKeyDown,
+        onClick = _this$props.onClick,
+        onClickCapture = _this$props.onClickCapture,
+        width = _this$props.width,
+        children = _this$props.children,
+        ariaDescribedby = _this$props['aria-describedby'],
+        ariaHasPopup = _this$props['aria-haspopup'],
+        ariaControls = _this$props['aria-controls'],
+        ariaLabel = _this$props['aria-label'],
+        ariaChecked = _this$props['aria-checked'],
+        ariaExpanded = _this$props['aria-expanded'],
+        role = _this$props.role;
+
+    var _this$getProps = this.getProps(),
+        use = _this$getProps.use,
+        type = _this$getProps.type,
+        size = _this$getProps.size;
+
+    var sizeClass = this.getSizeClassName();
+    var isFocused = this.state.focusedByTab || visuallyFocused;
+    var isLink = use === 'link';
+
+    var _isTheme2022 = isTheme2022(this.theme); // eslint-disable-next-line react-hooks/rules-of-hooks
+
+
+    var _useButtonArrow = useButtonArrow(_extends({}, this.props, {
+      isFocused: Boolean(isFocused)
+    }), this.theme, this.emotion),
+        wrapClassNameWithArrow = _useButtonArrow[0],
+        rootClassNameWithArrow = _useButtonArrow[1],
+        arrowNode = _useButtonArrow[2];
+
+    var isUseStateWithoutOutlineInDisabledState = !['default', 'backless'].includes(use);
+    var rootClassName = '';
+    var styles = getStyles(this.emotion);
+    var activeStyles = getActiveStyles(this.emotion);
+
+    if (_isTheme2022) {
+      var _this$emotion;
+
+      var trueDisabled = disabled || loading;
+      rootClassName = (_this$emotion = this.emotion).cx.apply(_this$emotion, [styles.root(this.theme), styles[use](this.theme), sizeClass, narrow && styles.narrow(), _noPadding && styles.noPadding(), _noRightPadding && styles.noRightPadding(), rootClassNameWithArrow].concat(trueDisabled ? [styles.disabled(this.theme), isUseStateWithoutOutlineInDisabledState && styles.disabledWithoutOutline(this.theme), checked && styles.checkedDisabled(this.theme), checked && styles.checkedDisabled2022(this.theme), borderless && styles.borderless2022(), use === 'backless' && !checked && styles.backlessDisabled2022(this.theme), use === 'text' && styles.textDisabled2022()] : [active && !checked && activeStyles[use](this.theme), isFocused && styles.focus(this.theme), checked && styles.checked2022(this.theme), checked && isFocused && styles.checkedFocused(this.theme), borderless && !checked && !isFocused && styles.borderless2022()]));
+    } else {
+      var _this$emotion$cx;
+
+      rootClassName = this.emotion.cx((_this$emotion$cx = {}, _this$emotion$cx[styles.root(this.theme)] = true, _this$emotion$cx[styles.simulatedPress()] = true, _this$emotion$cx[styles[use](this.theme)] = true, _this$emotion$cx[activeStyles[use](this.theme)] = active, _this$emotion$cx[sizeClass] = true, _this$emotion$cx[styles.focus(this.theme)] = isFocused, _this$emotion$cx[styles.checked(this.theme)] = checked, _this$emotion$cx[styles.checkedFocused(this.theme)] = checked && isFocused, _this$emotion$cx[styles.disabled(this.theme)] = disabled || loading, _this$emotion$cx[styles.checkedDisabled(this.theme)] = checked && disabled, _this$emotion$cx[styles.borderless()] = borderless && !disabled && !loading && !checked && !isFocused && !active, _this$emotion$cx[styles.narrow()] = narrow, _this$emotion$cx[styles.noPadding()] = _noPadding, _this$emotion$cx[styles.noRightPadding()] = _noRightPadding, _this$emotion$cx));
+    }
+
+    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: type,
+      role: role,
+      'aria-describedby': ariaDescribedby,
+      'aria-haspopup': ariaHasPopup,
+      'aria-controls': ariaControls,
+      'aria-label': ariaLabel,
+      'aria-checked': ariaChecked,
+      'aria-expanded': ariaExpanded,
+      className: rootClassName,
+      style: _extends({
+        textAlign: align
+      }, corners),
+      disabled: disabled || loading,
+      onClick: onClick,
+      onFocus: this.handleFocus,
+      onBlur: this.handleBlur,
+      onKeyDown: onKeyDown,
+      onMouseEnter: onMouseEnter,
+      onMouseLeave: onMouseLeave,
+      onMouseOver: onMouseOver,
+      onMouseDown: onMouseDown,
+      onMouseUp: onMouseUp,
+      onClickCapture: onClickCapture,
+      tabIndex: disableFocus ? -1 : 0,
+      title: this.props.title
+    };
+    var wrapProps = {
+      className: this.emotion.cx(globalClasses.root, (_this$emotion$cx2 = {}, _this$emotion$cx2[styles.wrap(this.theme)] = true, _this$emotion$cx2[wrapClassNameWithArrow] = true, _this$emotion$cx2[this.getSizeWrapClassName()] = true, _this$emotion$cx2)),
+      style: {
+        width: width
+      }
+    };
+    var innerShadowNode = _isTheme2022 ? null : /*#__PURE__*/React.createElement("div", {
+      className: globalClasses.innerShadow
+    });
+    var outlineNode = null;
+    var isDisabled2022 = _isTheme2022 && (disabled || loading);
+
+    if ((!isFocused || isLink) && !isDisabled2022) {
+      var _this$emotion$cx3;
+
+      outlineNode = /*#__PURE__*/React.createElement("div", {
+        style: {
+          zIndex: _isTheme2022 && isLink ? -1 : undefined
+        },
+        className: this.emotion.cx(styles.outline(), (_this$emotion$cx3 = {}, _this$emotion$cx3[styles.outlineWarning(this.theme)] = warning, _this$emotion$cx3[styles.outlineError(this.theme)] = error, _this$emotion$cx3[styles.outlineLink()] = isLink, _this$emotion$cx3[styles.outlineLinkWarning(this.theme)] = isLink && warning, _this$emotion$cx3[styles.outlineLinkError(this.theme)] = isLink && error, _this$emotion$cx3))
+      });
+    }
+
+    var iconProps = {
+      use: use,
+      size: this.getProps().size,
+      hasChildren: !!children,
+      loading: loading || false
+    };
+    var leftIconNode = icon && /*#__PURE__*/React.createElement(ButtonIcon, _extends({}, iconProps, {
+      position: "left",
+      icon: icon
+    }));
+    var rightIconNode = rightIcon && /*#__PURE__*/React.createElement(ButtonIcon, _extends({}, iconProps, {
+      hasBothIcons: !!icon && !!rightIcon,
+      position: "right",
+      icon: rightIcon
+    })); // Force disable all props and features, that cannot be use with Link
+
+    if (isLink) {
+      var _this$emotion$cx4;
+
+      rootProps.className = this.emotion.cx((_this$emotion$cx4 = {}, _this$emotion$cx4[styles.root(this.theme)] = true, _this$emotion$cx4[sizeClass] = true, _this$emotion$cx4[styles.link(this.theme)] = true, _this$emotion$cx4[styles.linkLineHeight()] = !isSafari || isSafari && !_isTheme2022, _this$emotion$cx4[styles.linkLineHeightSafariFallback()] = isSafari && _isTheme2022, _this$emotion$cx4[styles.linkFocus(this.theme)] = isFocused, _this$emotion$cx4[styles.linkDisabled(this.theme)] = disabled || loading, _this$emotion$cx4));
+      Object.assign(wrapProps, {
+        className: this.emotion.cx(styles.wrap(this.theme), styles.wrapLink()),
+        style: {
+          width: wrapProps.style.width
+        }
+      });
+      rootProps.style.textAlign = undefined;
+    }
+
+    var hasLoadingNode = loading && !icon && !rightIcon;
+    var loadingNode = hasLoadingNode && /*#__PURE__*/React.createElement(LoadingButtonIcon, {
+      size: size
+    });
+    var captionNode = /*#__PURE__*/React.createElement("div", {
+      className: this.emotion.cx(styles.caption(), globalClasses.caption, (_this$emotion$cx5 = {}, _this$emotion$cx5[styles.captionTranslated()] = (active || checked) && !loading && !_isTheme2022, _this$emotion$cx5[styles.captionLink()] = isLink, _this$emotion$cx5[styles.captionDisabled()] = !checked && disabled, _this$emotion$cx5))
+    }, loadingNode, leftIconNode, /*#__PURE__*/React.createElement("span", {
+      className: this.emotion.cx(globalClasses.text, (_this$emotion$cx6 = {}, _this$emotion$cx6[styles.visibilityHidden()] = hasLoadingNode, _this$emotion$cx6))
+    }, children), rightIconNode);
+
+    if (_isTheme2022 && isLink && !loading) {
+      captionNode = /*#__PURE__*/React.createElement(ThemeContext.Provider, {
+        value: getInnerLinkTheme(this.theme)
+      }, /*#__PURE__*/React.createElement(Link, {
+        focused: isFocused,
+        disabled: disabled,
+        icon: this.renderIcon2022(icon),
+        rightIcon: this.renderIcon2022(rightIcon),
+        as: this.renderLinkRootWithoutHandlers,
+        tabIndex: -1
+      }, children));
+    }
+
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), /*#__PURE__*/React.createElement("span", _extends({}, wrapProps, {
+      "data-tid": ButtonDataTids.rootElement
+    }), /*#__PURE__*/React.createElement("button", _extends({
+      "data-tid": ButtonDataTids.root,
+      ref: this._ref
+    }, rootProps), innerShadowNode, outlineNode, arrowNode, captionNode)));
+  };
+
+  _proto.renderIcon2022 = function renderIcon2022(icon) {
+    if (icon && isKonturIcon(icon)) {
+      var _icon$props$size;
+
+      var sizes = getButtonIconSizes(this.theme);
+      return /*#__PURE__*/React.cloneElement(icon, {
+        size: (_icon$props$size = icon.props.size) != null ? _icon$props$size : sizes[this.getProps().size]
+      });
+    }
+
+    return icon;
+  };
+
+  _proto.getSizeClassName = function getSizeClassName() {
+    var _this$emotion$cx7, _this$emotion$cx8, _this$emotion$cx9;
+
+    var styles = getStyles(this.emotion);
+
+    var _isTheme2022 = isTheme2022(this.theme);
+
+    switch (this.getProps().size) {
+      case 'large':
+        return this.emotion.cx(styles.sizeLarge(this.theme), (_this$emotion$cx7 = {}, _this$emotion$cx7[styles.sizeLargeIE11(this.theme)] = isIE11 || isEdge, _this$emotion$cx7[styles.sizeLargeWithIcon(this.theme)] = !!this.props.icon, _this$emotion$cx7[styles.sizeLargeWithIconWithoutText(this.theme)] = _isTheme2022 && !!this.props.icon && !this.props.children, _this$emotion$cx7));
+
+      case 'medium':
+        return this.emotion.cx(styles.sizeMedium(this.theme), (_this$emotion$cx8 = {}, _this$emotion$cx8[styles.sizeMediumIE11(this.theme)] = isIE11 || isEdge, _this$emotion$cx8[styles.sizeMediumWithIcon(this.theme)] = !!this.props.icon, _this$emotion$cx8[styles.sizeMediumWithIconWithoutText(this.theme)] = _isTheme2022 && !!this.props.icon && !this.props.children, _this$emotion$cx8));
+
+      case 'small':
+      default:
+        return this.emotion.cx(styles.sizeSmall(this.theme), (_this$emotion$cx9 = {}, _this$emotion$cx9[styles.sizeSmallIE11(this.theme)] = isIE11 || isEdge, _this$emotion$cx9[styles.sizeSmallWithIcon(this.theme)] = !!this.props.icon, _this$emotion$cx9[styles.sizeSmallWithIconWithoutText(this.theme)] = _isTheme2022 && !!this.props.icon && !this.props.children, _this$emotion$cx9));
+    }
+  };
+
+  _proto.getSizeWrapClassName = function getSizeWrapClassName() {
+    var styles = getStyles(this.emotion);
+
+    switch (this.getProps().size) {
+      case 'large':
+        return styles.wrapLarge(this.theme);
+
+      case 'medium':
+        return styles.wrapMedium(this.theme);
+
+      case 'small':
+      default:
+        return styles.wrapSmall(this.theme);
+    }
+  };
+
+  return Button;
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Button', _class2.displayName = 'Button', _class2.__BUTTON__ = true, _class2.defaultProps = {
+  use: 'default',
+  size: 'small',
+  type: 'button'
+}, _temp)) || _class;
+export var isButton = isReactUIComponent('Button');

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

@@ -0,0 +1 @@
+{"version":3,"sources":["Button.tsx"],"names":["React","globalObject","isKonturIcon","isReactUIComponent","isEdge","isIE11","isSafari","keyListener","ThemeContext","CommonWrapper","rootNode","ThemeFactory","createPropsGetter","isTheme2022","Link","EmotionConsumer","getActiveStyles","getStyles","globalClasses","ButtonIcon","getButtonIconSizes","useButtonArrow","getInnerLinkTheme","LoadingButtonIcon","ButtonDataTids","rootElement","root","spinner","Button","getProps","defaultProps","state","focusedByTab","node","handleFocus","e","props","disabled","disableFocus","requestAnimationFrame","isTabPressed","setState","onFocus","handleBlur","onBlur","_ref","componentDidMount","autoFocus","focus","getDerivedStateFromProps","loading","blur","render","emotion","theme","create","renderMain","renderLinkRootWithoutHandlers","onClick","children","rest","corners","active","borderless","checked","error","warning","narrow","icon","rightIcon","_noPadding","_noRightPadding","visuallyFocused","align","onMouseEnter","onMouseLeave","onMouseOver","onMouseDown","onMouseUp","onKeyDown","onClickCapture","width","ariaDescribedby","ariaHasPopup","ariaControls","ariaLabel","ariaChecked","ariaExpanded","role","use","type","size","sizeClass","getSizeClassName","isFocused","isLink","_isTheme2022","Boolean","wrapClassNameWithArrow","rootClassNameWithArrow","arrowNode","isUseStateWithoutOutlineInDisabledState","includes","rootClassName","styles","activeStyles","trueDisabled","cx","noPadding","noRightPadding","disabledWithoutOutline","checkedDisabled","checkedDisabled2022","borderless2022","backlessDisabled2022","textDisabled2022","checked2022","checkedFocused","simulatedPress","rootProps","className","style","textAlign","tabIndex","title","wrapProps","wrap","getSizeWrapClassName","innerShadowNode","innerShadow","outlineNode","isDisabled2022","zIndex","undefined","outline","outlineWarning","outlineError","outlineLink","outlineLinkWarning","outlineLinkError","iconProps","hasChildren","leftIconNode","rightIconNode","link","linkLineHeight","linkLineHeightSafariFallback","linkFocus","linkDisabled","Object","assign","wrapLink","hasLoadingNode","loadingNode","captionNode","caption","captionTranslated","captionLink","captionDisabled","text","visibilityHidden","renderIcon2022","setRootNode","sizes","cloneElement","sizeLarge","sizeLargeIE11","sizeLargeWithIcon","sizeLargeWithIconWithoutText","sizeMedium","sizeMediumIE11","sizeMediumWithIcon","sizeMediumWithIconWithoutText","sizeSmall","sizeSmallIE11","sizeSmallWithIcon","sizeSmallWithIconWithoutText","wrapLarge","wrapMedium","wrapSmall","Component","__KONTUR_REACT_UI__","displayName","__BUTTON__","isButton"],"mappings":"4TAAA,OAAOA,KAAP,MAAsD,OAAtD;AACA,SAASC,YAAT,QAA6B,0BAA7B;;;;AAIA,SAASC,YAAT,EAAuBC,kBAAvB,QAAiD,iBAAjD;AACA,SAASC,MAAT,EAAiBC,MAAjB,EAAyBC,QAAzB,QAAyC,kBAAzC;AACA,SAASC,WAAT,QAA4B,8BAA5B;;AAEA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAAsBC,aAAtB,QAA2C,8BAA3C;AACA,SAASC,QAAT,QAAuC,oBAAvC;AACA,SAASC,YAAT,QAA6B,gCAA7B;AACA,SAASC,iBAAT,QAAkC,6BAAlC;AACA,SAASC,WAAT,QAA4B,gCAA5B;AACA,SAASC,IAAT,QAAgC,SAAhC;;AAEA,SAASC,eAAT,QAAgC,2BAAhC;;AAEA,SAASC,eAAT,EAA0BC,SAA1B,EAAqCC,aAArC,QAA0D,iBAA1D;AACA,SAASC,UAAT,EAAsCC,kBAAtC,QAAgE,cAAhE;AACA,SAASC,cAAT,QAA+B,eAA/B;AACA,SAASC,iBAAT,QAAkC,qBAAlC;AACA,SAASC,iBAAT,QAAkC,qBAAlC;;AAEA;AACA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0KA,OAAO,IAAMC,cAAc,GAAG;AAC5BC,EAAAA,WAAW,EAAE,qBADe;AAE5BC,EAAAA,IAAI,EAAE,cAFsB;AAG5BC,EAAAA,OAAO,EAAE,iBAHmB,EAAvB;;;;;;AASP,WAAaC,MAAb,GADClB,QACD;;;;;;;;;;;AAWUmB,IAAAA,QAXV,GAWqBjB,iBAAiB,CAACgB,MAAM,CAACE,YAAR,CAXtC;;AAaSC,IAAAA,KAbT,GAaiB;AACbC,MAAAA,YAAY,EAAE,KADD,EAbjB;;;;;AAmBUC,IAAAA,IAnBV,GAmB2C,IAnB3C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+WUC,IAAAA,WA/WV,GA+WwB,UAACC,CAAD,EAA4C;AAChE,UAAI,CAAC,MAAKC,KAAL,CAAWC,QAAZ,IAAwB,CAAC,MAAKD,KAAL,CAAWE,YAAxC,EAAsD;AACpD;AACA;AACArC,QAAAA,YAAY,CAACsC,qBAAb,oBAAAtC,YAAY,CAACsC,qBAAb,CAAqC,YAAM;AACzC,cAAIhC,WAAW,CAACiC,YAAhB,EAA8B;AAC5B,kBAAKC,QAAL,CAAc,EAAET,YAAY,EAAE,IAAhB,EAAd;AACD;AACF,SAJD;AAKA,cAAKI,KAAL,CAAWM,OAAX,0BAAKN,KAAL,CAAWM,OAAX,CAAqBP,CAArB;AACD;AACF,KA1XH;;AA4XUQ,IAAAA,UA5XV,GA4XuB,UAACR,CAAD,EAA4C;AAC/D,YAAKM,QAAL,CAAc,EAAET,YAAY,EAAE,KAAhB,EAAd;AACA,UAAI,CAAC,MAAKI,KAAL,CAAWC,QAAZ,IAAwB,CAAC,MAAKD,KAAL,CAAWE,YAAxC,EAAsD;AACpD,cAAKF,KAAL,CAAWQ,MAAX,0BAAKR,KAAL,CAAWQ,MAAX,CAAoBT,CAApB;AACD;AACF,KAjYH;;AAmYUU,IAAAA,IAnYV,GAmYiB,UAACZ,IAAD,EAAoC;AACjD,YAAKA,IAAL,GAAYA,IAAZ;AACD,KArYH,oDAsBSa,iBAtBT,GAsBE,6BAA2B,CACzB,IAAI,KAAKV,KAAL,CAAWW,SAAf,EAA0B,CACxBxC,WAAW,CAACiC,YAAZ,GAA2B,IAA3B,CACA,KAAKQ,KAAL,GACD,CACF,CA3BH,QA6BgBC,wBA7BhB,GA6BE,kCAAuCb,KAAvC,EAA2D,CACzD,IAAIA,KAAK,CAACc,OAAN,IAAiBd,KAAK,CAACC,QAA3B,EAAqC,CACnC,OAAO,EAAEL,YAAY,EAAE,KAAhB,EAAP,CACD,CACD,OAAO,IAAP,CACD,CAlCH,CAoCE;AACF;AACA,KAtCA,QAuCSgB,KAvCT,GAuCE,iBAAe,gBACb,mBAAKf,IAAL,gCAAWe,KAAX,GACD,CAzCH,CA2CE;AACF;AACA,KA7CA,QA8CSG,IA9CT,GA8CE,gBAAc,iBACZ,oBAAKlB,IAAL,iCAAWkB,IAAX,GACD,CAhDH,QAkDSC,MAlDT,GAkDE,kBAA6B,mBAC3B,oBACE,oBAAC,eAAD,QACG,UAACC,OAAD,EAAa,CACZ,MAAI,CAACA,OAAL,GAAeA,OAAf,CACA,oBACE,oBAAC,YAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAa,MAAI,CAAClB,KAAL,CAAWkB,KAAX,GAAmB3C,YAAY,CAAC4C,MAAb,CAAoB,MAAI,CAACnB,KAAL,CAAWkB,KAA/B,EAA+CA,KAA/C,CAAnB,GAA2EA,KAAxF,CACA,OAAO,MAAI,CAACE,UAAL,EAAP,CACD,CAJH,CADF,CAQD,CAXH,CADF,CAeD,CAlEH,QAoEUC,6BApEV,GAoEE,uCAAsCrB,KAAtC,EAAwD,CACtD,IAAQsB,OAAR,GAAwDtB,KAAxD,CAAQsB,OAAR,CAAiBhB,OAAjB,GAAwDN,KAAxD,CAAiBM,OAAjB,CAA0BE,MAA1B,GAAwDR,KAAxD,CAA0BQ,MAA1B,CAAkCe,QAAlC,GAAwDvB,KAAxD,CAAkCuB,QAAlC,CAA+CC,IAA/C,iCAAwDxB,KAAxD,aACA,oBAAO,4BAAUwB,IAAV,EAAiBD,QAAjB,CAAP,CACD,CAvEH,QAyEUH,UAzEV,GAyEE,sBAAqB,6DACnB,kBAkCI,KAAKpB,KAlCT,CACEyB,OADF,eACEA,OADF,CAEEC,MAFF,eAEEA,MAFF,CAGEzB,QAHF,eAGEA,QAHF,CAIE0B,UAJF,eAIEA,UAJF,CAKEC,OALF,eAKEA,OALF,CAMEC,KANF,eAMEA,KANF,CAOEC,OAPF,eAOEA,OAPF,CAQEhB,OARF,eAQEA,OARF,CASEiB,MATF,eASEA,MATF,CAUEC,IAVF,eAUEA,IAVF,CAWEC,SAXF,eAWEA,SAXF,CAYEC,UAZF,eAYEA,UAZF,CAaEC,eAbF,eAaEA,eAbF,CAcEC,eAdF,eAcEA,eAdF,CAeEC,KAfF,eAeEA,KAfF,CAgBEnC,YAhBF,eAgBEA,YAhBF,CAiBEoC,YAjBF,eAiBEA,YAjBF,CAkBEC,YAlBF,eAkBEA,YAlBF,CAmBEC,WAnBF,eAmBEA,WAnBF,CAoBEC,WApBF,eAoBEA,WApBF,CAqBEC,SArBF,eAqBEA,SArBF,CAsBEC,SAtBF,eAsBEA,SAtBF,CAuBErB,OAvBF,eAuBEA,OAvBF,CAwBEsB,cAxBF,eAwBEA,cAxBF,CAyBEC,KAzBF,eAyBEA,KAzBF,CA0BEtB,QA1BF,eA0BEA,QA1BF,CA2BsBuB,eA3BtB,eA2BE,kBA3BF,EA4BmBC,YA5BnB,eA4BE,eA5BF,EA6BmBC,YA7BnB,eA6BE,eA7BF,EA8BgBC,SA9BhB,eA8BE,YA9BF,EA+BkBC,WA/BlB,eA+BE,cA/BF,EAgCmBC,YAhCnB,eAgCE,eAhCF,EAiCEC,IAjCF,eAiCEA,IAjCF,CAmCA,qBAA4B,KAAK3D,QAAL,EAA5B,CAAQ4D,GAAR,kBAAQA,GAAR,CAAaC,IAAb,kBAAaA,IAAb,CAAmBC,IAAnB,kBAAmBA,IAAnB,CACA,IAAMC,SAAS,GAAG,KAAKC,gBAAL,EAAlB,CAEA,IAAMC,SAAS,GAAG,KAAK/D,KAAL,CAAWC,YAAX,IAA2BwC,eAA7C,CACA,IAAMuB,MAAM,GAAGN,GAAG,KAAK,MAAvB,CACA,IAAMO,YAAY,GAAGnF,WAAW,CAAC,KAAKyC,KAAN,CAAhC,CAzCmB,CA2CnB;AACA,0BAAoEjC,cAAc,cAC3E,KAAKe,KADsE,IAC/D0D,SAAS,EAAEG,OAAO,CAACH,SAAD,CAD6C,KAEhF,KAAKxC,KAF2E,EAGhF,KAAKD,OAH2E,CAAlF,CAAO6C,sBAAP,sBAA+BC,sBAA/B,sBAAuDC,SAAvD,sBAKA,IAAMC,uCAAuC,GAAG,CAAC,CAAC,SAAD,EAAY,UAAZ,EAAwBC,QAAxB,CAAiCb,GAAjC,CAAjD,CACA,IAAIc,aAAa,GAAG,EAApB,CACA,IAAMC,MAAM,GAAGvF,SAAS,CAAC,KAAKoC,OAAN,CAAxB,CACA,IAAMoD,YAAY,GAAGzF,eAAe,CAAC,KAAKqC,OAAN,CAApC,CACA,IAAI2C,YAAJ,EAAkB,mBAChB,IAAMU,YAAY,GAAGrE,QAAQ,IAAIa,OAAjC,CACAqD,aAAa,GAAG,sBAAKlD,OAAL,EAAasD,EAAb,uBACdH,MAAM,CAAC9E,IAAP,CAAY,KAAK4B,KAAjB,CADc,EAEdkD,MAAM,CAACf,GAAD,CAAN,CAAY,KAAKnC,KAAjB,CAFc,EAGdsC,SAHc,EAIdzB,MAAM,IAAIqC,MAAM,CAACrC,MAAP,EAJI,EAKdG,UAAU,IAAIkC,MAAM,CAACI,SAAP,EALA,EAMdrC,eAAe,IAAIiC,MAAM,CAACK,cAAP,EANL,EAOdV,sBAPc,SAQVO,YAAY,GACZ,CACEF,MAAM,CAACnE,QAAP,CAAgB,KAAKiB,KAArB,CADF,EAEE+C,uCAAuC,IAAIG,MAAM,CAACM,sBAAP,CAA8B,KAAKxD,KAAnC,CAF7C,EAGEU,OAAO,IAAIwC,MAAM,CAACO,eAAP,CAAuB,KAAKzD,KAA5B,CAHb,EAIEU,OAAO,IAAIwC,MAAM,CAACQ,mBAAP,CAA2B,KAAK1D,KAAhC,CAJb,EAKES,UAAU,IAAIyC,MAAM,CAACS,cAAP,EALhB,EAMExB,GAAG,KAAK,UAAR,IAAsB,CAACzB,OAAvB,IAAkCwC,MAAM,CAACU,oBAAP,CAA4B,KAAK5D,KAAjC,CANpC,EAOEmC,GAAG,KAAK,MAAR,IAAkBe,MAAM,CAACW,gBAAP,EAPpB,CADY,GAUZ,CACErD,MAAM,IAAI,CAACE,OAAX,IAAsByC,YAAY,CAAChB,GAAD,CAAZ,CAAkB,KAAKnC,KAAvB,CADxB,EAEEwC,SAAS,IAAIU,MAAM,CAACxD,KAAP,CAAa,KAAKM,KAAlB,CAFf,EAGEU,OAAO,IAAIwC,MAAM,CAACY,WAAP,CAAmB,KAAK9D,KAAxB,CAHb,EAIEU,OAAO,IAAI8B,SAAX,IAAwBU,MAAM,CAACa,cAAP,CAAsB,KAAK/D,KAA3B,CAJ1B,EAKES,UAAU,IAAI,CAACC,OAAf,IAA0B,CAAC8B,SAA3B,IAAwCU,MAAM,CAACS,cAAP,EAL1C,CAlBU,EAAhB,CA0BD,CA5BD,MA4BO,sBACLV,aAAa,GAAG,KAAKlD,OAAL,CAAasD,EAAb,0CACbH,MAAM,CAAC9E,IAAP,CAAY,KAAK4B,KAAjB,CADa,IACa,IADb,mBAEbkD,MAAM,CAACc,cAAP,EAFa,IAEa,IAFb,mBAGbd,MAAM,CAACf,GAAD,CAAN,CAAY,KAAKnC,KAAjB,CAHa,IAGa,IAHb,mBAIbmD,YAAY,CAAChB,GAAD,CAAZ,CAAkB,KAAKnC,KAAvB,CAJa,IAImBQ,MAJnB,mBAKb8B,SALa,IAKD,IALC,mBAMbY,MAAM,CAACxD,KAAP,CAAa,KAAKM,KAAlB,CANa,IAMcwC,SANd,mBAObU,MAAM,CAACxC,OAAP,CAAe,KAAKV,KAApB,CAPa,IAOgBU,OAPhB,mBAQbwC,MAAM,CAACa,cAAP,CAAsB,KAAK/D,KAA3B,CARa,IAQuBU,OAAO,IAAI8B,SARlC,mBASbU,MAAM,CAACnE,QAAP,CAAgB,KAAKiB,KAArB,CATa,IASiBjB,QAAQ,IAAIa,OAT7B,mBAUbsD,MAAM,CAACO,eAAP,CAAuB,KAAKzD,KAA5B,CAVa,IAUwBU,OAAO,IAAI3B,QAVnC,mBAWbmE,MAAM,CAACzC,UAAP,EAXa,IAWSA,UAAU,IAAI,CAAC1B,QAAf,IAA2B,CAACa,OAA5B,IAAuC,CAACc,OAAxC,IAAmD,CAAC8B,SAApD,IAAiE,CAAChC,MAX3E,mBAYb0C,MAAM,CAACrC,MAAP,EAZa,IAYKA,MAZL,mBAabqC,MAAM,CAACI,SAAP,EAba,IAaQtC,UAbR,mBAcbkC,MAAM,CAACK,cAAP,EAda,IAcatC,eAdb,oBAAhB,CAgBD,CAED,IAAMgD,SAAS,GAAG,EAChB;AACA;AACA;AACA7B,MAAAA,IAAI,EAAJA,IAJgB,EAKhBF,IAAI,EAAJA,IALgB,EAMhB,oBAAoBN,eANJ,EAOhB,iBAAiBC,YAPD,EAQhB,iBAAiBC,YARD,EAShB,cAAcC,SATE,EAUhB,gBAAgBC,WAVA,EAWhB,iBAAiBC,YAXD,EAYhBiC,SAAS,EAAEjB,aAZK,EAahBkB,KAAK,aACHC,SAAS,EAAEjD,KADR,IAEAZ,OAFA,CAbW,EAiBhBxB,QAAQ,EAAEA,QAAQ,IAAIa,OAjBN,EAkBhBQ,OAAO,EAAPA,OAlBgB,EAmBhBhB,OAAO,EAAE,KAAKR,WAnBE,EAoBhBU,MAAM,EAAE,KAAKD,UApBG,EAqBhBoC,SAAS,EAATA,SArBgB,EAsBhBL,YAAY,EAAZA,YAtBgB,EAuBhBC,YAAY,EAAZA,YAvBgB,EAwBhBC,WAAW,EAAXA,WAxBgB,EAyBhBC,WAAW,EAAXA,WAzBgB,EA0BhBC,SAAS,EAATA,SA1BgB,EA2BhBE,cAAc,EAAdA,cA3BgB,EA4BhB2C,QAAQ,EAAErF,YAAY,GAAG,CAAC,CAAJ,GAAQ,CA5Bd,EA6BhBsF,KAAK,EAAE,KAAKxF,KAAL,CAAWwF,KA7BF,EAAlB,CAgCA,IAAMC,SAAS,GAAG,EAChBL,SAAS,EAAE,KAAKnE,OAAL,CAAasD,EAAb,CAAgBzF,aAAa,CAACQ,IAA9B,6CACR8E,MAAM,CAACsB,IAAP,CAAY,KAAKxE,KAAjB,CADQ,IACkB,IADlB,oBAER4C,sBAFQ,IAEiB,IAFjB,oBAGR,KAAK6B,oBAAL,EAHQ,IAGsB,IAHtB,qBADK,EAMhBN,KAAK,EAAE,EACLxC,KAAK,EAALA,KADK,EANS,EAAlB,CAWA,IAAM+C,eAAe,GAAGhC,YAAY,GAAG,IAAH,gBAAU,6BAAK,SAAS,EAAE9E,aAAa,CAAC+G,WAA9B,GAA9C,CAEA,IAAIC,WAAW,GAAG,IAAlB,CACA,IAAMC,cAAc,GAAGnC,YAAY,KAAK3D,QAAQ,IAAIa,OAAjB,CAAnC,CACA,IAAI,CAAC,CAAC4C,SAAD,IAAcC,MAAf,KAA0B,CAACoC,cAA/B,EAA+C,uBAC7CD,WAAW,gBACT,6BACE,KAAK,EAAE,EAAEE,MAAM,EAAEpC,YAAY,IAAID,MAAhB,GAAyB,CAAC,CAA1B,GAA8BsC,SAAxC,EADT,EAEE,SAAS,EAAE,KAAKhF,OAAL,CAAasD,EAAb,CAAgBH,MAAM,CAAC8B,OAAP,EAAhB,6CACR9B,MAAM,CAAC+B,cAAP,CAAsB,KAAKjF,KAA3B,CADQ,IAC4BY,OAD5B,oBAERsC,MAAM,CAACgC,YAAP,CAAoB,KAAKlF,KAAzB,CAFQ,IAE0BW,KAF1B,oBAGRuC,MAAM,CAACiC,WAAP,EAHQ,IAGe1C,MAHf,oBAIRS,MAAM,CAACkC,kBAAP,CAA0B,KAAKpF,KAA/B,CAJQ,IAIgCyC,MAAM,IAAI7B,OAJ1C,oBAKRsC,MAAM,CAACmC,gBAAP,CAAwB,KAAKrF,KAA7B,CALQ,IAK8ByC,MAAM,IAAI9B,KALxC,qBAFb,GADF,CAYD,CAED,IAAM2E,SAA4C,GAAG,EACnDnD,GAAG,EAAHA,GADmD,EAEnDE,IAAI,EAAE,KAAK9D,QAAL,GAAgB8D,IAF6B,EAGnDkD,WAAW,EAAE,CAAC,CAAClF,QAHoC,EAInDT,OAAO,EAAEA,OAAO,IAAI,KAJ+B,EAArD,CAMA,IAAM4F,YAAY,GAAG1E,IAAI,iBAAI,oBAAC,UAAD,eAAgBwE,SAAhB,IAA2B,QAAQ,EAAC,MAApC,EAA2C,IAAI,EAAExE,IAAjD,IAA7B,CACA,IAAM2E,aAAa,GAAG1E,SAAS,iBAC7B,oBAAC,UAAD,eAAgBuE,SAAhB,IAA2B,YAAY,EAAE,CAAC,CAACxE,IAAF,IAAU,CAAC,CAACC,SAArD,EAAgE,QAAQ,EAAC,OAAzE,EAAiF,IAAI,EAAEA,SAAvF,IADF,CAzKmB,CA6KnB;AACA,QAAI0B,MAAJ,EAAY,uBACVwB,SAAS,CAACC,SAAV,GAAsB,KAAKnE,OAAL,CAAasD,EAAb,4CACnBH,MAAM,CAAC9E,IAAP,CAAY,KAAK4B,KAAjB,CADmB,IACO,IADP,oBAEnBsC,SAFmB,IAEP,IAFO,oBAGnBY,MAAM,CAACwC,IAAP,CAAY,KAAK1F,KAAjB,CAHmB,IAGO,IAHP,oBAInBkD,MAAM,CAACyC,cAAP,EAJmB,IAIO,CAAC3I,QAAD,IAAcA,QAAQ,IAAI,CAAC0F,YAJlC,oBAKnBQ,MAAM,CAAC0C,4BAAP,EALmB,IAKqB5I,QAAQ,IAAI0F,YALjC,oBAMnBQ,MAAM,CAAC2C,SAAP,CAAiB,KAAK7F,KAAtB,CANmB,IAMYwC,SANZ,oBAOnBU,MAAM,CAAC4C,YAAP,CAAoB,KAAK9F,KAAzB,CAPmB,IAOejB,QAAQ,IAAIa,OAP3B,qBAAtB,CASAmG,MAAM,CAACC,MAAP,CAAczB,SAAd,EAAyB,EACvBL,SAAS,EAAE,KAAKnE,OAAL,CAAasD,EAAb,CAAgBH,MAAM,CAACsB,IAAP,CAAY,KAAKxE,KAAjB,CAAhB,EAAyCkD,MAAM,CAAC+C,QAAP,EAAzC,CADY,EAEvB9B,KAAK,EAAE,EAAExC,KAAK,EAAE4C,SAAS,CAACJ,KAAV,CAAgBxC,KAAzB,EAFgB,EAAzB,EAIAsC,SAAS,CAACE,KAAV,CAAgBC,SAAhB,GAA4BW,SAA5B,CACD,CAED,IAAMmB,cAAc,GAAGtG,OAAO,IAAI,CAACkB,IAAZ,IAAoB,CAACC,SAA5C,CACA,IAAMoF,WAAW,GAAGD,cAAc,iBAAI,oBAAC,iBAAD,IAAmB,IAAI,EAAE7D,IAAzB,GAAtC,CAEA,IAAI+D,WAAW,gBACb,6BACE,SAAS,EAAE,KAAKrG,OAAL,CAAasD,EAAb,CAAgBH,MAAM,CAACmD,OAAP,EAAhB,EAAkCzI,aAAa,CAACyI,OAAhD,6CACRnD,MAAM,CAACoD,iBAAP,EADQ,IACqB,CAAC9F,MAAM,IAAIE,OAAX,KAAuB,CAACd,OAAxB,IAAmC,CAAC8C,YADzD,oBAERQ,MAAM,CAACqD,WAAP,EAFQ,IAEe9D,MAFf,oBAGRS,MAAM,CAACsD,eAAP,EAHQ,IAGmB,CAAC9F,OAAD,IAAY3B,QAH/B,qBADb,IAOGoH,WAPH,EAQGX,YARH,eASE,8BACE,SAAS,EAAE,KAAKzF,OAAL,CAAasD,EAAb,CAAgBzF,aAAa,CAAC6I,IAA9B,6CACRvD,MAAM,CAACwD,gBAAP,EADQ,IACoBR,cADpB,qBADb,IAKG7F,QALH,CATF,EAgBGoF,aAhBH,CADF,CAoBA,IAAI/C,YAAY,IAAID,MAAhB,IAA0B,CAAC7C,OAA/B,EAAwC,CACtCwG,WAAW,gBACT,oBAAC,YAAD,CAAc,QAAd,IAAuB,KAAK,EAAEpI,iBAAiB,CAAC,KAAKgC,KAAN,CAA/C,iBACE,oBAAC,IAAD,IACE,OAAO,EAAEwC,SADX,EAEE,QAAQ,EAAEzD,QAFZ,EAGE,IAAI,EAAE,KAAK4H,cAAL,CAAoB7F,IAApB,CAHR,EAIE,SAAS,EAAE,KAAK6F,cAAL,CAAoB5F,SAApB,CAJb,EAKE,EAAE,EAAE,KAAKZ,6BALX,EAME,QAAQ,EAAE,CAAC,CANb,IAQGE,QARH,CADF,CADF,CAcD,CAED,oBACE,oBAAC,aAAD,aAAe,WAAW,EAAE,KAAKuG,WAAjC,IAAkD,KAAK9H,KAAvD,gBACE,yCAAUyF,SAAV,IAAqB,YAAUrG,cAAc,CAACC,WAA9C,kBACE,yCAAQ,YAAUD,cAAc,CAACE,IAAjC,EAAuC,GAAG,EAAE,KAAKmB,IAAjD,IAA2D0E,SAA3D,GACGS,eADH,EAEGE,WAFH,EAGG9B,SAHH,EAIGsD,WAJH,CADF,CADF,CADF,CAYD,CA5TH,QA8TUO,cA9TV,GA8TE,wBAAuB7F,IAAvB,EAA6D,CAC3D,IAAIA,IAAI,IAAIlE,YAAY,CAACkE,IAAD,CAAxB,EAAgC,sBAC9B,IAAM+F,KAAK,GAAG/I,kBAAkB,CAAC,KAAKkC,KAAN,CAAhC,CACA,oBAAOtD,KAAK,CAACoK,YAAN,CAAmBhG,IAAnB,EAAyB,EAAEuB,IAAI,sBAAEvB,IAAI,CAAChC,KAAL,CAAWuD,IAAb,+BAAqBwE,KAAK,CAAC,KAAKtI,QAAL,GAAgB8D,IAAjB,CAAhC,EAAzB,CAAP,CACD,CAED,OAAOvB,IAAP,CACD,CArUH,QAuUUyB,gBAvUV,GAuUE,4BAA2B,6DACzB,IAAMW,MAAM,GAAGvF,SAAS,CAAC,KAAKoC,OAAN,CAAxB,CACA,IAAM2C,YAAY,GAAGnF,WAAW,CAAC,KAAKyC,KAAN,CAAhC,CACA,QAAQ,KAAKzB,QAAL,GAAgB8D,IAAxB,GACE,KAAK,OAAL,CACE,OAAO,KAAKtC,OAAL,CAAasD,EAAb,CAAgBH,MAAM,CAAC6D,SAAP,CAAiB,KAAK/G,KAAtB,CAAhB,6CACJkD,MAAM,CAAC8D,aAAP,CAAqB,KAAKhH,KAA1B,CADI,IAC+BjD,MAAM,IAAID,MADzC,oBAEJoG,MAAM,CAAC+D,iBAAP,CAAyB,KAAKjH,KAA9B,CAFI,IAEmC,CAAC,CAAC,KAAKlB,KAAL,CAAWgC,IAFhD,oBAGJoC,MAAM,CAACgE,4BAAP,CAAoC,KAAKlH,KAAzC,CAHI,IAG8C0C,YAAY,IAAI,CAAC,CAAC,KAAK5D,KAAL,CAAWgC,IAA7B,IAAqC,CAAC,KAAKhC,KAAL,CAAWuB,QAH/F,qBAAP,CAKF,KAAK,QAAL,CACE,OAAO,KAAKN,OAAL,CAAasD,EAAb,CAAgBH,MAAM,CAACiE,UAAP,CAAkB,KAAKnH,KAAvB,CAAhB,6CACJkD,MAAM,CAACkE,cAAP,CAAsB,KAAKpH,KAA3B,CADI,IACgCjD,MAAM,IAAID,MAD1C,oBAEJoG,MAAM,CAACmE,kBAAP,CAA0B,KAAKrH,KAA/B,CAFI,IAEoC,CAAC,CAAC,KAAKlB,KAAL,CAAWgC,IAFjD,oBAGJoC,MAAM,CAACoE,6BAAP,CAAqC,KAAKtH,KAA1C,CAHI,IAG+C0C,YAAY,IAAI,CAAC,CAAC,KAAK5D,KAAL,CAAWgC,IAA7B,IAAqC,CAAC,KAAKhC,KAAL,CAAWuB,QAHhG,qBAAP,CAKF,KAAK,OAAL,CACA,QACE,OAAO,KAAKN,OAAL,CAAasD,EAAb,CAAgBH,MAAM,CAACqE,SAAP,CAAiB,KAAKvH,KAAtB,CAAhB,6CACJkD,MAAM,CAACsE,aAAP,CAAqB,KAAKxH,KAA1B,CADI,IAC+BjD,MAAM,IAAID,MADzC,oBAEJoG,MAAM,CAACuE,iBAAP,CAAyB,KAAKzH,KAA9B,CAFI,IAEmC,CAAC,CAAC,KAAKlB,KAAL,CAAWgC,IAFhD,oBAGJoC,MAAM,CAACwE,4BAAP,CAAoC,KAAK1H,KAAzC,CAHI,IAG8C0C,YAAY,IAAI,CAAC,CAAC,KAAK5D,KAAL,CAAWgC,IAA7B,IAAqC,CAAC,KAAKhC,KAAL,CAAWuB,QAH/F,qBAAP,CAfJ,CAqBD,CA/VH,QAiWUoE,oBAjWV,GAiWE,gCAA+B,CAC7B,IAAMvB,MAAM,GAAGvF,SAAS,CAAC,KAAKoC,OAAN,CAAxB,CAEA,QAAQ,KAAKxB,QAAL,GAAgB8D,IAAxB,GACE,KAAK,OAAL,CACE,OAAOa,MAAM,CAACyE,SAAP,CAAiB,KAAK3H,KAAtB,CAAP,CACF,KAAK,QAAL,CACE,OAAOkD,MAAM,CAAC0E,UAAP,CAAkB,KAAK5H,KAAvB,CAAP,CACF,KAAK,OAAL,CACA,QACE,OAAOkD,MAAM,CAAC2E,SAAP,CAAiB,KAAK7H,KAAtB,CAAP,CAPJ,CASD,CA7WH,iBAA4BtD,KAAK,CAACoL,SAAlC,WACgBC,mBADhB,GACsC,QADtC,UAEgBC,WAFhB,GAE8B,QAF9B,UAGgBC,UAHhB,GAG6B,IAH7B,UAKgBzJ,YALhB,GAK6C,EACzC2D,GAAG,EAAE,SADoC,EAEzCE,IAAI,EAAE,OAFmC,EAGzCD,IAAI,EAAE,QAHmC,EAL7C,oBAwYA,OAAO,IAAM8F,QAAQ,GAAGrL,kBAAkB,CAAc,QAAd,CAAnC","sourcesContent":["import React, { AriaAttributes, HTMLAttributes } from 'react';\nimport { globalObject } from '@skbkontur/global-object';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { HTMLProps } from '../../typings/html';\nimport { isKonturIcon, isReactUIComponent } from '../../lib/utils';\nimport { isEdge, isIE11, isSafari } from '../../lib/client';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { Theme, ThemeIn } from '../../lib/theming/Theme';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport { isTheme2022 } from '../../lib/theming/ThemeHelpers';\nimport { Link, LinkProps } from '../Link';\nimport { SizeProp } from '../../lib/types/props';\nimport { EmotionConsumer } from '../../lib/theming/Emotion';\n\nimport { getActiveStyles, getStyles, globalClasses } from './Button.styles';\nimport { ButtonIcon, ButtonIconProps, getButtonIconSizes } from './ButtonIcon';\nimport { useButtonArrow } from './ButtonArrow';\nimport { getInnerLinkTheme } from './getInnerLinkTheme';\nimport { LoadingButtonIcon } from './LoadingButtonIcon';\n\n/**\n * @deprecated use SizeProp\n */\nexport type ButtonSize = SizeProp;\nexport type ButtonType = 'button' | 'submit' | 'reset';\nexport type ButtonUse = 'default' | 'primary' | 'success' | 'danger' | 'pay' | 'link' | 'text' | 'backless';\n\nexport interface ButtonProps\n  extends CommonProps,\n    Pick<\n      AriaAttributes,\n      'aria-haspopup' | 'aria-describedby' | 'aria-controls' | 'aria-label' | 'aria-checked' | 'aria-expanded'\n    >,\n    Pick<HTMLAttributes<unknown>, 'role'>,\n    Pick<HTMLProps['button'], 'onClickCapture' | 'onMouseUp' | 'onMouseDown'> {\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?: React.CSSProperties;\n\n  /**\n   * Отключенное состояние кнопки.\n   */\n  disabled?: boolean;\n\n  /** @ignore */\n  disableFocus?: boolean;\n\n  /**\n   * Состояние валидации при ошибке.\n   */\n  error?: boolean;\n\n  /**\n   * Иконка слева от текста кнопки.\n   */\n  icon?: React.ReactElement;\n\n  /**\n   * Иконка справа от текста кнопки.\n   */\n  rightIcon?: React.ReactElement;\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?: SizeProp;\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\"`, `\"text\"`, `\"backless\"`.\n   */\n  use?: ButtonUse;\n\n  /** @ignore */\n  visuallyFocused?: boolean;\n\n  /**\n   * Состояние валидации при предупреждении.\n   */\n  warning?: boolean;\n\n  /**\n   * CSS-свойство `width`.\n   */\n  width?: number | string;\n\n  /**\n   * Обычный объект с переменными темы.\n   * Он будет объединён с темой из контекста.\n   */\n  theme?: ThemeIn;\n}\n\nexport interface ButtonState {\n  focusedByTab: boolean;\n}\n\nexport const ButtonDataTids = {\n  rootElement: 'Button__rootElement',\n  root: 'Button__root',\n  spinner: 'Button__spinner',\n} as const;\n\ntype DefaultProps = Required<Pick<ButtonProps, 'use' | 'size' | 'type'>>;\n\n@rootNode\nexport class Button extends React.Component<ButtonProps, ButtonState> {\n  public static __KONTUR_REACT_UI__ = 'Button';\n  public static displayName = 'Button';\n  public static __BUTTON__ = true;\n\n  public static defaultProps: DefaultProps = {\n    use: 'default',\n    size: 'small',\n    type: 'button',\n  };\n\n  private getProps = createPropsGetter(Button.defaultProps);\n\n  public state = {\n    focusedByTab: false,\n  };\n\n  private theme!: Theme;\n  private emotion!: Emotion;\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      <EmotionConsumer>\n        {(emotion) => {\n          this.emotion = emotion;\n          return (\n            <ThemeContext.Consumer>\n              {(theme) => {\n                this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n                return this.renderMain();\n              }}\n            </ThemeContext.Consumer>\n          );\n        }}\n      </EmotionConsumer>\n    );\n  }\n\n  private renderLinkRootWithoutHandlers(props: LinkProps) {\n    const { onClick, onFocus, onBlur, children, ...rest } = props;\n    return <span {...rest}>{children}</span>;\n  }\n\n  private renderMain() {\n    const {\n      corners,\n      active,\n      disabled,\n      borderless,\n      checked,\n      error,\n      warning,\n      loading,\n      narrow,\n      icon,\n      rightIcon,\n      _noPadding,\n      _noRightPadding,\n      visuallyFocused,\n      align,\n      disableFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onMouseDown,\n      onMouseUp,\n      onKeyDown,\n      onClick,\n      onClickCapture,\n      width,\n      children,\n      'aria-describedby': ariaDescribedby,\n      'aria-haspopup': ariaHasPopup,\n      'aria-controls': ariaControls,\n      'aria-label': ariaLabel,\n      'aria-checked': ariaChecked,\n      'aria-expanded': ariaExpanded,\n      role,\n    } = this.props;\n    const { use, type, size } = this.getProps();\n    const sizeClass = this.getSizeClassName();\n\n    const isFocused = this.state.focusedByTab || visuallyFocused;\n    const isLink = use === 'link';\n    const _isTheme2022 = isTheme2022(this.theme);\n\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const [wrapClassNameWithArrow, rootClassNameWithArrow, arrowNode] = useButtonArrow(\n      { ...this.props, isFocused: Boolean(isFocused) },\n      this.theme,\n      this.emotion,\n    );\n    const isUseStateWithoutOutlineInDisabledState = !['default', 'backless'].includes(use);\n    let rootClassName = '';\n    const styles = getStyles(this.emotion);\n    const activeStyles = getActiveStyles(this.emotion);\n    if (_isTheme2022) {\n      const trueDisabled = disabled || loading;\n      rootClassName = this.emotion.cx(\n        styles.root(this.theme),\n        styles[use](this.theme),\n        sizeClass,\n        narrow && styles.narrow(),\n        _noPadding && styles.noPadding(),\n        _noRightPadding && styles.noRightPadding(),\n        rootClassNameWithArrow,\n        ...(trueDisabled\n          ? [\n              styles.disabled(this.theme),\n              isUseStateWithoutOutlineInDisabledState && styles.disabledWithoutOutline(this.theme),\n              checked && styles.checkedDisabled(this.theme),\n              checked && styles.checkedDisabled2022(this.theme),\n              borderless && styles.borderless2022(),\n              use === 'backless' && !checked && styles.backlessDisabled2022(this.theme),\n              use === 'text' && styles.textDisabled2022(),\n            ]\n          : [\n              active && !checked && activeStyles[use](this.theme),\n              isFocused && styles.focus(this.theme),\n              checked && styles.checked2022(this.theme),\n              checked && isFocused && styles.checkedFocused(this.theme),\n              borderless && !checked && !isFocused && styles.borderless2022(),\n            ]),\n      );\n    } else {\n      rootClassName = this.emotion.cx({\n        [styles.root(this.theme)]: true,\n        [styles.simulatedPress()]: true,\n        [styles[use](this.theme)]: true,\n        [activeStyles[use](this.theme)]: active,\n        [sizeClass]: true,\n        [styles.focus(this.theme)]: isFocused,\n        [styles.checked(this.theme)]: checked,\n        [styles.checkedFocused(this.theme)]: checked && isFocused,\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    }\n\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,\n      role,\n      'aria-describedby': ariaDescribedby,\n      'aria-haspopup': ariaHasPopup,\n      'aria-controls': ariaControls,\n      'aria-label': ariaLabel,\n      'aria-checked': ariaChecked,\n      'aria-expanded': ariaExpanded,\n      className: rootClassName,\n      style: {\n        textAlign: align,\n        ...corners,\n      },\n      disabled: disabled || loading,\n      onClick,\n      onFocus: this.handleFocus,\n      onBlur: this.handleBlur,\n      onKeyDown,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseOver,\n      onMouseDown,\n      onMouseUp,\n      onClickCapture,\n      tabIndex: disableFocus ? -1 : 0,\n      title: this.props.title,\n    };\n\n    const wrapProps = {\n      className: this.emotion.cx(globalClasses.root, {\n        [styles.wrap(this.theme)]: true,\n        [wrapClassNameWithArrow]: true,\n        [this.getSizeWrapClassName()]: true,\n      }),\n      style: {\n        width,\n      },\n    };\n\n    const innerShadowNode = _isTheme2022 ? null : <div className={globalClasses.innerShadow} />;\n\n    let outlineNode = null;\n    const isDisabled2022 = _isTheme2022 && (disabled || loading);\n    if ((!isFocused || isLink) && !isDisabled2022) {\n      outlineNode = (\n        <div\n          style={{ zIndex: _isTheme2022 && isLink ? -1 : undefined }}\n          className={this.emotion.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    const iconProps: Omit<ButtonIconProps, 'position'> = {\n      use,\n      size: this.getProps().size,\n      hasChildren: !!children,\n      loading: loading || false,\n    };\n    const leftIconNode = icon && <ButtonIcon {...iconProps} position=\"left\" icon={icon} />;\n    const rightIconNode = rightIcon && (\n      <ButtonIcon {...iconProps} hasBothIcons={!!icon && !!rightIcon} position=\"right\" icon={rightIcon} />\n    );\n\n    // Force disable all props and features, that cannot be use with Link\n    if (isLink) {\n      rootProps.className = this.emotion.cx({\n        [styles.root(this.theme)]: true,\n        [sizeClass]: true,\n        [styles.link(this.theme)]: true,\n        [styles.linkLineHeight()]: !isSafari || (isSafari && !_isTheme2022),\n        [styles.linkLineHeightSafariFallback()]: isSafari && _isTheme2022,\n        [styles.linkFocus(this.theme)]: isFocused,\n        [styles.linkDisabled(this.theme)]: disabled || loading,\n      });\n      Object.assign(wrapProps, {\n        className: this.emotion.cx(styles.wrap(this.theme), styles.wrapLink()),\n        style: { width: wrapProps.style.width },\n      });\n      rootProps.style.textAlign = undefined;\n    }\n\n    const hasLoadingNode = loading && !icon && !rightIcon;\n    const loadingNode = hasLoadingNode && <LoadingButtonIcon size={size} />;\n\n    let captionNode = (\n      <div\n        className={this.emotion.cx(styles.caption(), globalClasses.caption, {\n          [styles.captionTranslated()]: (active || checked) && !loading && !_isTheme2022,\n          [styles.captionLink()]: isLink,\n          [styles.captionDisabled()]: !checked && disabled,\n        })}\n      >\n        {loadingNode}\n        {leftIconNode}\n        <span\n          className={this.emotion.cx(globalClasses.text, {\n            [styles.visibilityHidden()]: hasLoadingNode,\n          })}\n        >\n          {children}\n        </span>\n        {rightIconNode}\n      </div>\n    );\n    if (_isTheme2022 && isLink && !loading) {\n      captionNode = (\n        <ThemeContext.Provider value={getInnerLinkTheme(this.theme)}>\n          <Link\n            focused={isFocused}\n            disabled={disabled}\n            icon={this.renderIcon2022(icon)}\n            rightIcon={this.renderIcon2022(rightIcon)}\n            as={this.renderLinkRootWithoutHandlers}\n            tabIndex={-1}\n          >\n            {children}\n          </Link>\n        </ThemeContext.Provider>\n      );\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <span {...wrapProps} data-tid={ButtonDataTids.rootElement}>\n          <button data-tid={ButtonDataTids.root} ref={this._ref} {...rootProps}>\n            {innerShadowNode}\n            {outlineNode}\n            {arrowNode}\n            {captionNode}\n          </button>\n        </span>\n      </CommonWrapper>\n    );\n  }\n\n  private renderIcon2022(icon: React.ReactElement | undefined) {\n    if (icon && isKonturIcon(icon)) {\n      const sizes = getButtonIconSizes(this.theme);\n      return React.cloneElement(icon, { size: icon.props.size ?? sizes[this.getProps().size] });\n    }\n\n    return icon;\n  }\n\n  private getSizeClassName() {\n    const styles = getStyles(this.emotion);\n    const _isTheme2022 = isTheme2022(this.theme);\n    switch (this.getProps().size) {\n      case 'large':\n        return this.emotion.cx(styles.sizeLarge(this.theme), {\n          [styles.sizeLargeIE11(this.theme)]: isIE11 || isEdge,\n          [styles.sizeLargeWithIcon(this.theme)]: !!this.props.icon,\n          [styles.sizeLargeWithIconWithoutText(this.theme)]: _isTheme2022 && !!this.props.icon && !this.props.children,\n        });\n      case 'medium':\n        return this.emotion.cx(styles.sizeMedium(this.theme), {\n          [styles.sizeMediumIE11(this.theme)]: isIE11 || isEdge,\n          [styles.sizeMediumWithIcon(this.theme)]: !!this.props.icon,\n          [styles.sizeMediumWithIconWithoutText(this.theme)]: _isTheme2022 && !!this.props.icon && !this.props.children,\n        });\n      case 'small':\n      default:\n        return this.emotion.cx(styles.sizeSmall(this.theme), {\n          [styles.sizeSmallIE11(this.theme)]: isIE11 || isEdge,\n          [styles.sizeSmallWithIcon(this.theme)]: !!this.props.icon,\n          [styles.sizeSmallWithIconWithoutText(this.theme)]: _isTheme2022 && !!this.props.icon && !this.props.children,\n        });\n    }\n  }\n\n  private getSizeWrapClassName() {\n    const styles = getStyles(this.emotion);\n\n    switch (this.getProps().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      globalObject.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 = isReactUIComponent<ButtonProps>('Button');\n"]}

package/components/Button/Button/package.json

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