import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["title", "subtitle", "color", "onClick", "className", "Icon"];
import React from "react";
import PropTypes from "prop-types";
import cx from "classnames";
import CssFlex from "../../CssFlex";
import Lock from "../../Icon/Lock";
import Typography from "../../Typography";
import getClasses from "./styles";

var ProBadge = function ProBadge(_ref) {
  var _cx;

  var title = _ref.title,
      subtitle = _ref.subtitle,
      color = _ref.color,
      onClick = _ref.onClick,
      className = _ref.className,
      Icon = _ref.Icon,
      restProps = _objectWithoutProperties(_ref, _excluded);

  var classes = getClasses({
    color: color,
    onClick: !!onClick
  });
  var SidebarIcon = Icon || Lock;
  var contentClassName = cx(classes.root, (_cx = {}, _defineProperty(_cx, classes.greenBadge, color === "green"), _defineProperty(_cx, classes.blueBadge, color === "blue"), _defineProperty(_cx, classes.yellowBadge, color === "yellow"), _defineProperty(_cx, classes.orangeBadge, color === "orange"), _defineProperty(_cx, classes.neutralBadge, color === "neutral"), _cx), className);
  var content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: classes.circle
  }), /*#__PURE__*/React.createElement(CssFlex, {
    flexDirection: "column",
    justifyContent: "center",
    className: classes.content
  }, /*#__PURE__*/React.createElement(Typography, {
    variant: "small",
    align: "left",
    weight: "semibold",
    className: classes.caption
  }, title), /*#__PURE__*/React.createElement(Typography, {
    variant: "inputText",
    align: "left",
    weight: "bold",
    className: classes.title
  }, subtitle)), /*#__PURE__*/React.createElement(CssFlex, {
    alignItems: "center",
    className: classes.iconContainer
  }, /*#__PURE__*/React.createElement(CssFlex, {
    alignItems: "center",
    justifyContent: "center",
    className: classes.iconCircle
  }, /*#__PURE__*/React.createElement(SidebarIcon, {
    color: color,
    size: 24,
    shade: 500
  }))));
  return onClick ? /*#__PURE__*/React.createElement("button", _extends({
    type: "button",
    className: contentClassName,
    onClick: onClick
  }, restProps), content) : /*#__PURE__*/React.createElement("div", _extends({
    className: contentClassName
  }, restProps), content);
};

ProBadge.propTypes = {
  title: PropTypes.string,
  subtitle: PropTypes.string,
  color: PropTypes.oneOf(["green", "blue", "yellow", "neutral", "orange"]),
  onClick: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),
  Icon: PropTypes.oneOfType([PropTypes.element, PropTypes.func])
};
ProBadge.defaultProps = {
  title: "",
  subtitle: "",
  color: "green",
  onClick: false
};
export default ProBadge;