// Copyright 1999-2023. Plesk International GmbH. All rights reserved.

import classNames from 'classnames';
import { CLS_PREFIX } from '../../constants';
import Icon from '../Icon';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
const MultiValue = _ref => {
  let {
    baseClassName = `${CLS_PREFIX}select-multi-value`,
    onRemove,
    children,
    ...props
  } = _ref;
  const onMouseDown = e => {
    e.preventDefault();
  };
  const onClick = e => {
    e.stopPropagation();
    onRemove();
  };
  return /*#__PURE__*/_jsx("div", {
    className: classNames(baseClassName),
    ...props,
    children: /*#__PURE__*/_jsxs("div", {
      className: `${baseClassName}__content`,
      children: [/*#__PURE__*/_jsx("span", {
        className: `${baseClassName}__label`,
        children: children
      }), /*#__PURE__*/_jsx(Icon, {
        className: `${baseClassName}__remove`,
        size: "12",
        onMouseDown: onMouseDown,
        onClick: onClick,
        children: /*#__PURE__*/_jsx("svg", {
          xmlns: "http://www.w3.org/2000/svg",
          viewBox: "0 0 12 12",
          focusable: "false",
          "aria-hidden": "true",
          children: /*#__PURE__*/_jsx("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 .704.704L6.704 6l2.15 2.15a.498.498 0 0 1-.704.704L6 6.704l-2.15 2.15z"
          })
        })
      })]
    })
  });
};
export default MultiValue;