@ntragas/pouncejstest/dist/esm/components/Badge/Badge.js

A collection of UI components from Panther labs

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React from 'react';
import useBadgeStyles from './useBadgeStyles';
import Box from '../Box';

/** A badge is simply a visual label to accompany & characterize a certain text*/
var Badge = /*#__PURE__*/React.forwardRef(function Badge(_ref, ref) {
  var color = _ref.color,
      _ref$variant = _ref.variant,
      variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
      children = _ref.children,
      rest = _objectWithoutPropertiesLoose(_ref, ["color", "variant", "children"]);

  var variantStyles = useBadgeStyles({
    variant,
    color
  });
  return /*#__PURE__*/React.createElement(Box, _extends({
    display: "flex",
    role: "status",
    "aria-atomic": "true",
    ref: ref,
    cursor: "default",
    width: "fit-content",
    minWidth: "85px",
    textAlign: "center",
    fontWeight: "bold",
    borderRadius: "pill",
    alignItems: "center",
    justifyContent: "center",
    fontSize: "small",
    py: 1,
    px: 4
  }, variantStyles, rest), children);
});
export default /*#__PURE__*/React.memo(Badge);