@shakthillc/components/es/MultiSelector/Badge.js

React generic components for shakthi products

import _slicedToArray from "babel-runtime/helpers/slicedToArray";
import React, { useState } from "react";
import Icon from "@material-ui/core/Icon";
import style from "./Badge.module.css";

var Badge = function Badge(_ref) {
  var text = _ref.text,
      color = _ref.color,
      avatar = _ref.avatar,
      onClick = _ref.onClick;

  var _useState = useState(color),
      _useState2 = _slicedToArray(_useState, 2),
      chover = _useState2[0],
      setChover = _useState2[1];

  var hoverBadge = function hoverBadge() {
    setChover(color = "#ffcccb");
  };
  var closeBadge = function closeBadge(text) {
    onClick && onClick(text);
  };
  var leaveBadge = function leaveBadge() {
    setChover(color);
  };
  return React.createElement(
    "div",
    { style: { background: chover }, className: style.container },
    React.createElement(
      "p",
      { className: style.text },
      text
    ),
    React.createElement(
      "span",
      {
        onClick: function onClick() {
          return closeBadge(text);
        },
        onMouseOver: hoverBadge,
        onMouseOut: leaveBadge,
        className: style.close
      },
      React.createElement(
        Icon,
        { style: { fontSize: "12px" } },
        "close"
      )
    )
  );
};

export default Badge;