function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React, { Fragment } from 'react';
import getClearNode from "./getClearNode";
import Tag from "./Tag";

// 内库使用-start
import DOMUtil from "./../../../../utils/DOMUtil";
import LocaleUtil from "./../../../../utils/LocaleUtil";
// 内库使用-end

/* 测试使用-start
import { DOMUtil, LocaleUtil } from 'seedsui-react'
测试使用-end */

// 标签模式
var Tags = function Tags(_ref) {
  var separator = _ref.separator,
    leftIcon = _ref.leftIcon,
    rightIcon = _ref.rightIcon,
    clear = _ref.clear,
    className = _ref.className,
    style = _ref.style,
    contentProps = _ref.contentProps,
    placeholder = _ref.placeholder,
    readOnly = _ref.readOnly,
    disabled = _ref.disabled,
    allowClear = _ref.allowClear,
    value = _ref.value,
    onAdd = _ref.onAdd,
    _onEdit = _ref.onEdit,
    onChange = _ref.onChange;
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: DOMUtil.classNames('select-combo-tags', className, readOnly ? 'readOnly' : '', disabled ? ' disabled' : ''),
    style: style,
    onClick: onAdd
  }, typeof leftIcon === 'function' ? leftIcon({
    value: value
  }) : leftIcon, /*#__PURE__*/React.createElement("div", _extends({}, contentProps, {
    className: "select-combo-tags-content".concat(contentProps !== null && contentProps !== void 0 && contentProps.className ? ' ' + contentProps.className : '')
  }), Array.isArray(value) ? value.map(function (item, index) {
    return /*#__PURE__*/React.createElement(Fragment, {
      key: item.id || index
    }, /*#__PURE__*/React.createElement(Tag, {
      className: item.className,
      style: item.style,
      name: item.name,
      readOnly: item.readOnly,
      disabled: item.disabled,
      allowClear: item.allowClear,
      onEdit: function onEdit() {
        _onEdit && _onEdit(item);
      },
      onDelete: function onDelete() {
        var currentValue = value.filter(function (valueItem) {
          return valueItem.id !== item.id;
        });
        onChange && onChange(currentValue, {
          action: 'clickDelete'
        });
      }
    }), index < value.length - 1 && separator ? separator : null);
  }) : null, (!Array.isArray(value) || !(value !== null && value !== void 0 && value.length)) && /*#__PURE__*/React.createElement("div", {
    className: "select-combo-tags-placeholder"
  }, placeholder || LocaleUtil.locale('Please Select', 'SeedsUI_select_placeholder'))), getClearNode({
    clear: clear,
    allowClear: allowClear,
    disabled: disabled,
    readOnly: readOnly,
    value: value,
    onClear: function onClear(e) {
      var _e$stopPropagation;
      e && (e === null || e === void 0 || (_e$stopPropagation = e.stopPropagation) === null || _e$stopPropagation === void 0 ? void 0 : _e$stopPropagation.call(e));
      typeof onChange === 'function' && onChange('', {
        action: 'clickClear'
      });
    }
  }), typeof rightIcon === 'function' ? rightIcon({
    value: value
  }) : rightIcon));
};
export default Tags;