import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

/**
 * TagGroup.jsx
 *
 * @Author: zhangce
 * @Date: 18/8/7 下午5:35
 */
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import Tag from './Tag';
/**
 * TagGroup
 * */

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

  _createClass(TagGroup, null, [{
    key: "getDerivedStateFromProps",
    value: function getDerivedStateFromProps(props, state) {
      if (props.defaultValue !== state.prevDefaultValue) {
        return {
          tags: props.defaultValue,
          prevDefaultValue: props.defaultValue
        };
      }

      return null;
    }
  }]);

  function TagGroup(props, context) {
    var _this;

    _classCallCheck(this, TagGroup);

    _this = _possibleConstructorReturn(this, _getPrototypeOf(TagGroup).call(this, props, context));

    _defineProperty(_assertThisInitialized(_this), "handleClose", function (tagRemove) {
      var onChange = _this.props.onChange;
      var tags = _this.state.tags;
      var newTags = tags.filter(function (tag) {
        return tag !== tagRemove;
      });

      _this.setState({
        tags: newTags
      });

      onChange && onChange(newTags);
    });

    _defineProperty(_assertThisInitialized(_this), "createNewTag", function (inputValue) {
      var onChange = _this.props.onChange;
      var tags = _this.state.tags;

      if (!tags.includes(inputValue)) {
        var newTags = [].concat(_toConsumableArray(tags), [inputValue]);
        onChange && onChange(newTags);

        _this.setState({
          tags: newTags
        });
      }

      return true;
    });

    _defineProperty(_assertThisInitialized(_this), "triggerAddTagClick", function (e) {
      var autoTriggerAdd = _this.props.autoTriggerAdd;

      if (autoTriggerAdd && _this.addTag) {
        _this.addTag.setInput(e);
      }
    });

    _defineProperty(_assertThisInitialized(_this), "getContainer", function (el) {
      _this.tagContainer = el;
    });

    var defaultValue = props.defaultValue;
    _this.state = {
      tags: defaultValue,
      prevDefaultValue: defaultValue
    };
    return _this;
  }

  _createClass(TagGroup, [{
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$props = this.props,
          tagType = _this$props.tagType,
          addText = _this$props.addText,
          className = _this$props.className,
          children = _this$props.children,
          hasAddableTag = _this$props.hasAddableTag,
          enterKey = _this$props.enterKey,
          prefixCls = _this$props.prefixCls,
          size = _this$props.size,
          onChange = _this$props.onChange,
          autoTriggerAdd = _this$props.autoTriggerAdd,
          other = _objectWithoutProperties(_this$props, ["tagType", "addText", "className", "children", "hasAddableTag", "enterKey", "prefixCls", "size", "onChange", "autoTriggerAdd"]);

      var tags = this.state.tags;
      return React.createElement("div", _extends({
        className: classNames("".concat(prefixCls), className, "".concat(prefixCls, "-").concat(size)),
        onClick: this.triggerAddTagClick
      }, other), tags.map(function (tag) {
        return React.createElement(Tag, {
          key: tag,
          closable: true,
          onClose: _this2.handleClose
        }, tag);
      }), hasAddableTag && React.createElement(Tag, {
        isAddableTag: true,
        onCreate: this.createNewTag,
        enterKey: enterKey
      }, addText));
    }
  }]);

  return TagGroup;
}(React.PureComponent);

_defineProperty(TagGroup, "propTypes", {
  /**
   * 类前缀
   * */
  prefixCls: PropTypes.string,

  /**
   * 类名
   * */
  className: PropTypes.string,

  /**
   * 默认值
   * */
  defaultValue: PropTypes.array,

  /**
   * 标签样式类型
   * */
  tagType: PropTypes.oneOf(['primary', 'secondary', 'success', 'warning', 'error', 'info']),

  /**
   * 添加新标签按钮的文案说明
   * */
  addText: PropTypes.string,

  /**
   * 值改变时回调函数
   * */
  onChange: PropTypes.func,

  /**
   * 是否显示添加按钮
   * */
  hasAddableTag: PropTypes.bool,

  /**
   * 创建新标签的键值
   * */
  enterKey: PropTypes.array,

  /**
   * 自动聚焦input框
   * */
  autoTriggerAdd: PropTypes.bool,
  size: PropTypes.oneOf(['small', 'medium', 'large'])
});

_defineProperty(TagGroup, "defaultProps", {
  prefixCls: 'ne-tag-group',
  defaultValue: [],
  tagType: 'error',
  addText: '+ new Tag',
  hasAddableTag: true,
  autoTriggerAdd: false,
  size: 'medium'
});

export default TagGroup;