@alifd/meet-react/lib/button/button.js

Fusion Mobile React UI System Component

"use strict";

exports.__esModule = true;
exports.default = void 0;
var _tslib = require("tslib");
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _meetReactComponentOne = require("@alifd/meet-react-component-one");
var _view = _interopRequireDefault(require("../view"));
var _icon = _interopRequireDefault(require("../icon"));
var _utils = require("../utils");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
var createChildren = function (children, classes, prefix, size) {
  var count = _react.Children.count(children);
  return _react.Children.map(children, function (child, index) {
    if ((0, _utils.isNil)(child) || (0, _utils.isBoolean)(child)) {
      return null;
    }
    var key = child.key || "mt-button-" + index;
    if ((0, _react.isValidElement)(child)) {
      if (child.type === _meetReactComponentOne.Text) {
        return (0, _react.cloneElement)(child, {
          key: key,
          className: (0, _classnames.default)(classes.textCls, child.props.className),
          style: child.props.style || {}
        });
      } else if (child.type === _icon.default) {
        var _classNames;
        return (0, _react.cloneElement)(child, {
          key: key,
          className: (0, _classnames.default)(classes.iconCls, child.props.className, (_classNames = {}, _classNames[prefix + "button-icon--" + size + "-first"] = index === 0, _classNames[prefix + "button-icon--" + size + "-last"] = index === count - 1, _classNames)),
          style: child.props.style || {}
        });
      } else {
        return (0, _react.cloneElement)(child, {
          key: key
        });
      }
    } else {
      return /*#__PURE__*/(0, _react.createElement)(_meetReactComponentOne.Text, {
        key: key,
        className: classes.textCls
      }, child);
    }
  });
};
var Button = function (props, ref) {
  var _classNames2;
  var _props$prefix = props.prefix,
    prefix = _props$prefix === void 0 ? 'mt-' : _props$prefix,
    _props$type = props.type,
    typeProp = _props$type === void 0 ? 'normal' : _props$type,
    _props$size = props.size,
    size = _props$size === void 0 ? 'medium' : _props$size,
    _props$fullWidth = props.fullWidth,
    fullWidth = _props$fullWidth === void 0 ? false : _props$fullWidth,
    _props$disabled = props.disabled,
    disabled = _props$disabled === void 0 ? false : _props$disabled,
    _props$loading = props.loading,
    loading = _props$loading === void 0 ? false : _props$loading,
    _props$text = props.text,
    text = _props$text === void 0 ? false : _props$text,
    _props$warning = props.warning,
    warning = _props$warning === void 0 ? false : _props$warning,
    children = props.children,
    _props$model = props.model,
    modelProp = _props$model === void 0 ? 'solid' : _props$model,
    className = props.className,
    _props$component = props.component,
    component = _props$component === void 0 ? _view.default : _props$component,
    _props$onClick = props.onClick,
    onClick = _props$onClick === void 0 ? function () {} : _props$onClick,
    onDisabledClick = props.onDisabledClick,
    others = (0, _tslib.__rest)(props, ["prefix", "type", "size", "fullWidth", "disabled", "loading", "text", "warning", "children", "model", "className", "component", "onClick", "onDisabledClick"]);
  var _useMemo = (0, _react.useMemo)(function () {
      var nType = typeProp;
      var nModel = modelProp;
      if (typeProp === 'secondary') {
        nType = 'primary';
        nModel = 'outline';
      }
      if (text) {
        nModel = 'text';
      }
      if (warning) {
        nType = 'warning';
      }
      return [nType, nModel];
    }, [typeProp, modelProp, warning, text]),
    type = _useMemo[0],
    model = _useMemo[1];
  var iconCls = prefix + "button-font--" + size;
  var handleClick = (0, _react.useCallback)(function (e) {
    if (disabled) {
      if ((0, _utils.isFunction)(onDisabledClick)) {
        onDisabledClick(e);
      }
      return;
    }
    onClick(e);
  }, [disabled, onDisabledClick, onClick]);
  return /*#__PURE__*/(0, _react.createElement)(component, Object.assign(Object.assign({
    ref: ref
  }, others), {
    className: (0, _classnames.default)(className, prefix + "button", prefix + "button--" + size, prefix + "button--" + type + "-" + model, (_classNames2 = {}, _classNames2[prefix + "button--fullwidth"] = fullWidth, _classNames2[prefix + "button--" + type + "-" + model + "-disabled"] = disabled, _classNames2)),
    onClick: handleClick
  }), /*#__PURE__*/(0, _react.createElement)(_react.Fragment, null, loading ? /*#__PURE__*/(0, _react.createElement)(_icon.default, {
    key: "prefix-icon",
    className: (0, _classnames.default)(iconCls, prefix + "button-icon--" + size + "-first"),
    name: "loading"
  }) : null, createChildren(children, {
    textCls: prefix + "button-font--" + size,
    iconCls: iconCls
  }, prefix, size)));
};
Button.displayName = 'Button';
var _default = exports.default = /*#__PURE__*/(0, _react.forwardRef)(Button);