@beisen-phoenix/lookup/lib/components/advancedCmpt/Tag.js

---

import "core-js/modules/es6.function.name";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
import React from 'react';
import Circle from '@beisen-phoenix/icon/lib/circle';
import ToolTip from '@beisen-phoenix/tooltip';
import { $M4, $M5 } from '@beisen-phoenix/style-token';
import utils from '@beisen-phoenix/common-utils';
var classes = utils.BEMClass('lookup');
import './tag.css';

var Tag =
/*#__PURE__*/
function (_React$PureComponent) {
  _inherits(Tag, _React$PureComponent);

  function Tag() {
    var _getPrototypeOf2;

    var _this;

    _classCallCheck(this, Tag);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(Tag)).call.apply(_getPrototypeOf2, [this].concat(args)));
    _this.tagSpanRef = React.createRef();
    _this.state = {
      hover: false
    };

    _this.onMouseEnter = function () {
      _this.setState({
        hover: true
      });
    };

    _this.onMouseLeave = function () {
      _this.setState({
        hover: false
      });
    };

    return _this;
  }

  _createClass(Tag, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          onClear = _this$props.onClear,
          item = _this$props.item,
          extraCls = _this$props.extraCls;
      var hover = this.state.hover;
      var label = item.label,
          name = item.name,
          text = item.text;
      var TempCommponent = React.createElement("span", {
        className: classes({
          element: 'tagLabel'
        }),
        ref: this.tagSpanRef
      }, label || name || text || '--');
      var cls = classes({
        element: 'tag',
        extra: extraCls
      });
      var clearCls = classes({
        element: 'tagClear'
      });
      return React.createElement("div", {
        className: cls
      }, React.createElement(ToolTip, {
        title: label,
        showOverflowTooltip: true
      }, TempCommponent), React.createElement("span", {
        className: clearCls
      }, React.createElement(Circle, {
        color: hover ? $M4 : $M5,
        onClick: function onClick(e) {
          onClear && onClear(item);
          "";
          e.stopPropagation && e.stopPropagation();
        },
        onMouseEnter: this.onMouseEnter,
        onMouseLeave: this.onMouseLeave
      })));
    }
  }]);

  return Tag;
}(React.PureComponent);

export { Tag as default };