@krowdy-ui/core/esm/Dot/Dot.js

React components that implement Google's Material Design.

import React from 'react';
import PropTypes from 'prop-types';
import { makeStyles } from '@material-ui/styles';
import Tooltip from '@material-ui/core/Tooltip';
var useStyles = makeStyles(function (theme) {
  return {
    root: {
      backgroundColor: function backgroundColor(_ref) {
        var color = _ref.color;

        switch (color) {
          case 'success':
            {
              return theme.palette.success.main;
            }

          case 'error':
            {
              return theme.palette.error.main;
            }

          case 'primary':
            {
              return theme.palette.primary.main;
            }

          default:
            {
              return theme.palette.grey[500];
            }
        }
      },
      borderRadius: '50%',
      display: 'inline-block',
      height: 8,
      width: 8
    }
  };
});

var Dot = function Dot(_ref2) {
  var _ref2$color = _ref2.color,
      color = _ref2$color === void 0 ? 'default' : _ref2$color,
      title = _ref2.title;
  var classes = useStyles({
    color: color
  });
  if (title) return /*#__PURE__*/React.createElement(Tooltip, {
    title: title
  }, /*#__PURE__*/React.createElement("div", {
    className: classes.root
  }));
  return /*#__PURE__*/React.createElement("div", {
    className: classes.root
  });
};

process.env.NODE_ENV !== "production" ? Dot.propTypes = {
  color: PropTypes.string,
  title: PropTypes.string
} : void 0;
export default Dot;