import styled from '@emotion/styled';
import {Tooltip} from 'sentry/components/tooltip';
import {tct} from 'sentry/locale';
import type {Level} from 'sentry/types/event';
import {capitalize} from 'sentry/utils/string/capitalize';
const DEFAULT_SIZE = '13px';
type Props = {
className?: string;
level?: Level;
size?: string;
};
function ErrorLevel({className, level = 'unknown', size = '11px'}: Props) {
const levelLabel = tct('Level: [level]', {level: capitalize(level)});
return (
{levelLabel}
);
}
const ColoredCircle = styled('span')`
padding: 0;
position: relative;
width: ${p => p.size || DEFAULT_SIZE};
height: ${p => p.size || DEFAULT_SIZE};
text-indent: -9999em;
display: inline-block;
border-radius: 50%;
flex-shrink: 0;
background-color: ${p => (p.level ? p.theme.level[p.level] : p.theme.level.error)};
`;
export default ErrorLevel;