import _extends from "@babel/runtime/helpers/extends";
// Copyright 1999-2019. Plesk International GmbH. All rights reserved.
import classNames from 'classnames';
import React from 'react';
import { CLS_PREFIX } from '../../constants';
import Icon from '../Icon';

const MultiValue = ({
  baseClassName = "".concat(CLS_PREFIX, "select-multi-value"),
  onRemove,
  children,
  ...props
}) => {
  const onMouseDown = e => {
    e.preventDefault();
  };

  const onClick = e => {
    e.stopPropagation();
    onRemove();
  };

  return /*#__PURE__*/React.createElement("div", _extends({
    className: classNames(baseClassName)
  }, props), /*#__PURE__*/React.createElement("div", {
    className: "".concat(baseClassName, "__content")
  }, /*#__PURE__*/React.createElement("span", {
    className: "".concat(baseClassName, "__label")
  }, children), /*#__PURE__*/React.createElement(Icon, {
    className: "".concat(baseClassName, "__remove"),
    size: "12",
    onMouseDown: onMouseDown,
    onClick: onClick
  }, /*#__PURE__*/React.createElement("svg", {
    xmlns: "http://www.w3.org/2000/svg",
    viewBox: "0 0 12 12",
    focusable: "false",
    "aria-hidden": "true"
  }, /*#__PURE__*/React.createElement("path", {
    d: "M3.85 8.854a.498.498 0 1 1-.704-.704L5.296 6l-2.15-2.15a.498.498 0 0 1 .704-.704L6 5.296l2.15-2.15a.498.498 0 1 1\r .704.704L6.704 6l2.15 2.15a.498.498 0 0 1-.704.704L6 6.704l-2.15 2.15z"
  })))));
};

export default MultiValue;