qt-public-ui/es/CompatibleAntd3/tag/index.js

新设计规范下业务组件库

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 = ["children"];
/* eslint-disable */
import * as React from 'react';
import classNames from 'classnames';
import omit from 'omit.js';
import { polyfill } from 'react-lifecycles-compat';
import Icon from '../../Icon';
import CheckableTag from './CheckableTag';
import { ConfigConsumer } from '../config-provider/context';
import { PresetColorTypes } from '../_util/colors';
import warning from '../_util/warning';
import Wave from '../_util/wave';

// export  from './CheckableTag';

var PresetColorRegex = new RegExp("^(" + PresetColorTypes.join('|') + ")(-inverse)?$");
var Tag = /*#__PURE__*/function (_React$Component) {
  function Tag(props) {
    var _this;
    _this = _React$Component.call(this, props) || this;
    _this.state = {
      visible: true
    };
    _this.handleIconClick = function (e) {
      e.stopPropagation();
      _this.setVisible(false, e);
    };
    _this.renderTag = function (configProps) {
      var _this$props = _this.props,
        children = _this$props.children,
        otherProps = _objectWithoutPropertiesLoose(_this$props, _excluded);
      var isNeedWave = 'onClick' in otherProps || children && children.type === 'a';
      var tagProps = omit(otherProps, ['onClose', 'afterClose', 'color', 'visible', 'closable', 'prefixCls']);
      return isNeedWave ? /*#__PURE__*/React.createElement(Wave, null, /*#__PURE__*/React.createElement("span", _extends({}, tagProps, {
        className: _this.getTagClassName(configProps),
        style: _this.getTagStyle()
      }), children, _this.renderCloseIcon())) : /*#__PURE__*/React.createElement("span", _extends({}, tagProps, {
        className: _this.getTagClassName(configProps),
        style: _this.getTagStyle()
      }), children, _this.renderCloseIcon());
    };
    warning(!('afterClose' in props), 'Tag', "'afterClose' will be deprecated, please use 'onClose', we will remove this in the next version.");
    return _this;
  }
  _inheritsLoose(Tag, _React$Component);
  Tag.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
    if ('visible' in nextProps) {
      return {
        visible: nextProps.visible
      };
    }
    return null;
  };
  var _proto = Tag.prototype;
  _proto.getTagStyle = function getTagStyle() {
    var _this$props2 = this.props,
      color = _this$props2.color,
      style = _this$props2.style;
    var isPresetColor = this.isPresetColor();
    return _extends({
      backgroundColor: color && !isPresetColor ? color : undefined
    }, style);
  };
  _proto.getTagClassName = function getTagClassName(_ref) {
    var _classNames;
    var getPrefixCls = _ref.getPrefixCls;
    var _this$props3 = this.props,
      customizePrefixCls = _this$props3.prefixCls,
      className = _this$props3.className,
      color = _this$props3.color;
    var visible = this.state.visible;
    var isPresetColor = this.isPresetColor();
    var prefixCls = getPrefixCls('tag', customizePrefixCls);
    return classNames(prefixCls, (_classNames = {}, _classNames[prefixCls + "-" + color] = isPresetColor, _classNames[prefixCls + "-has-color"] = color && !isPresetColor, _classNames[prefixCls + "-hidden"] = !visible, _classNames), className);
  };
  _proto.setVisible = function setVisible(visible, e) {
    var _this$props4 = this.props,
      onClose = _this$props4.onClose,
      afterClose = _this$props4.afterClose;
    if (onClose) {
      onClose(e);
    }
    if (afterClose && !onClose) {
      // next version remove.
      afterClose();
    }
    if (e.defaultPrevented) {
      return;
    }
    if (!('visible' in this.props)) {
      this.setState({
        visible: visible
      });
    }
  };
  _proto.isPresetColor = function isPresetColor() {
    var color = this.props.color;
    if (!color) {
      return false;
    }
    return PresetColorRegex.test(color);
  };
  _proto.renderCloseIcon = function renderCloseIcon() {
    var closable = this.props.closable;
    return closable ? /*#__PURE__*/React.createElement(Icon, {
      type: "close",
      onClick: this.handleIconClick
    }) : null;
  };
  _proto.render = function render() {
    return /*#__PURE__*/React.createElement(ConfigConsumer, null, this.renderTag);
  };
  return Tag;
}(React.Component);
Tag.CheckableTag = CheckableTag;
Tag.defaultProps = {
  closable: false
};
polyfill(Tag);
export default Tag;