@primer/components/lib/CircleBadge.js

Primer react components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _constants = require("./constants");

var _StyledOcticon = _interopRequireDefault(require("./StyledOcticon"));

var _sx = _interopRequireDefault(require("./sx"));

var _isNumeric = _interopRequireDefault(require("./utils/isNumeric"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const variantSizes = {
  small: 56,
  medium: 96,
  large: 128
};

const sizeStyles = ({
  size,
  variant = 'medium'
}) => {
  const calc = (0, _isNumeric.default)(size) ? size : variantSizes[variant];
  return {
    width: calc,
    height: calc
  };
};

const CircleBadge = _styledComponents.default.div.withConfig({
  displayName: "CircleBadge",
  componentId: "sc-1lho816-0"
})(["display:", ";align-items:center;justify-content:center;background-color:", ";border-radius:50%;box-shadow:", ";", ";", ";"], props => props.inline ? 'inline-flex' : 'flex', (0, _constants.get)('colors.canvas.default'), (0, _constants.get)('shadows.shadow.medium'), sizeStyles, _sx.default);

const CircleBadgeIcon = (0, _styledComponents.default)(_StyledOcticon.default).withConfig({
  displayName: "CircleBadge__CircleBadgeIcon",
  componentId: "sc-1lho816-1"
})(["height:auto;max-width:60%;max-height:55%;"]);
CircleBadge.defaultProps = {
  inline: false
};
CircleBadgeIcon.displayName = 'CircleBadge.Icon';

var _default = Object.assign(CircleBadge, {
  Icon: CircleBadgeIcon
});

exports.default = _default;