acud/es/button/button.js

acg react 组件库

import _extends from "@babel/runtime/helpers/esm/extends";
import _typeof from "@babel/runtime/helpers/esm/typeof";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
/**
 * @file
 * @author dailin01
 */
var __rest = this && this.__rest || function (s, e) {
  var t = {};
  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  }
  return t;
};
import React from 'react';
import classNames from 'classnames';
import omit from "rc-util/es/omit";
import { tuple } from '../_util/type';
import LoadingIcon from './LoadingIcon';
import ButtonGroup from './button-group';
import { ConfigContext } from '../config-provider';
import SizeContext from '../config-provider/SizeContext';
var ButtonTypes = tuple('default', 'primary', 'text', 'highlight', 'enhance', 'actiontext');
var ButtonShapes = tuple('circle', 'round');
var ButtonHTMLTypes = tuple('submit', 'button', 'reset');
var InternalButton = function InternalButton(props, ref) {
  var _props$type = props.type,
    type = _props$type === void 0 ? 'default' : _props$type,
    customizePrefixCls = props.prefixCls,
    _props$loading = props.loading,
    loading = _props$loading === void 0 ? false : _props$loading,
    _props$icon = props.icon,
    icon = _props$icon === void 0 ? null : _props$icon,
    customizeSize = props.size,
    children = props.children,
    _props$htmlType = props.htmlType,
    htmlType = _props$htmlType === void 0 ? 'button' : _props$htmlType,
    className = props.className,
    rest = __rest(props, ["type", "prefixCls", "loading", "icon", "size", "children", "htmlType", "className"]);
  var characterLen = function characterLen(s) {
    var result = 0;
    for (var i = 0; i < s.length; i++) {
      if (s.charCodeAt(i) > 255) {
        result += 2;
      } else {
        result++;
      }
    }
    return result;
  };
  var textLimited = children && typeof children === 'string' && characterLen(children) < 8;
  var hasIcon = loading || !!icon;
  var onlyIcon = !!icon && (children === null || children === undefined);
  var _React$useState = React.useState(!!loading),
    _React$useState2 = _slicedToArray(_React$useState, 2),
    innerLoading = _React$useState2[0],
    setLoading = _React$useState2[1];
  var buttonRef = ref || /*#__PURE__*/React.createRef();
  var size = React.useContext(SizeContext);
  var sizeClassNameMap = {
    large: 'lg',
    small: 'sm',
    middle: undefined
  };
  var sizeFullname = customizeSize || size;
  var sizeCls = sizeFullname && sizeClassNameMap[sizeFullname] || '';
  var _React$useContext = React.useContext(ConfigContext),
    getPrefixCls = _React$useContext.getPrefixCls;
  var prefixCls = getPrefixCls('btn', customizePrefixCls);
  var classes = classNames(prefixCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-").concat(type), type), "".concat(prefixCls, "-").concat(sizeCls), sizeCls), "".concat(prefixCls, "-loading"), loading), "".concat(prefixCls).concat(sizeCls ? '-' + sizeCls : '', "-text-limited"), textLimited), "".concat(prefixCls).concat(sizeCls ? '-' + sizeCls : '', "-has-icon"), hasIcon), "".concat(prefixCls).concat(sizeCls ? '-' + sizeCls : '', "-only-icon"), onlyIcon), "".concat(className), className));
  // loading
  var loadingOrDelay;
  if (_typeof(loading) === 'object' && loading.delay) {
    loadingOrDelay = loading.delay || true;
  } else {
    loadingOrDelay = !!loading;
  }
  React.useEffect(function () {
    var delayTimer = null;
    if (typeof loadingOrDelay === 'number') {
      delayTimer = window.setTimeout(function () {
        delayTimer = null;
        setLoading(loadingOrDelay);
      }, loadingOrDelay);
    } else {
      setLoading(loadingOrDelay);
    }
    return function () {
      if (delayTimer) {
        window.clearTimeout(delayTimer);
        delayTimer = null;
      }
    };
  }, [loadingOrDelay]);
  var linkButtonRestProps = omit(rest, ['navigate']);
  // Icon
  var iconNode = innerLoading ? /*#__PURE__*/React.createElement(LoadingIcon, null) : icon;
  // 不需要给汉字中间加空格
  var kids = typeof children === 'number' || typeof children === 'string' ? /*#__PURE__*/React.createElement("span", null, children) : children;
  if (linkButtonRestProps.href !== undefined) {
    return /*#__PURE__*/React.createElement("a", _extends({}, linkButtonRestProps, {
      className: classes,
      ref: buttonRef
    }), iconNode, kids);
  }
  return /*#__PURE__*/React.createElement("button", _extends({}, rest, {
    ref: buttonRef,
    type: htmlType,
    className: classes
  }), iconNode, kids);
};
var Button = /*#__PURE__*/React.forwardRef(InternalButton);
Button.displayName = 'Button';
Button.Group = ButtonGroup;
Button.__ACUD_BUTTON = true;
export default Button;