Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | 1x 1x 1x 1x 1x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 1x 1x 1x | import React from 'react';
import classNames from 'classnames';
import './Badge.css';
interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
variant?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning';
size?: 'sm' | 'md' | 'lg';
children: React.ReactNode;
}
const Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(
({ variant = 'primary', size = 'md', className, children, ...props }, ref) => {
return (
<span
ref={ref}
className={classNames(
'badge',
`badge-${variant}`,
`badge-${size}`,
className
)}
{...props}
>
{children}
</span>
);
}
);
Badge.displayName = 'Badge';
export default Badge;
|