21 lines
567 B
TypeScript
21 lines
567 B
TypeScript
type Props = {
|
|
children: React.ReactNode
|
|
className?: string
|
|
tone?: 'lavender' | 'deep' | 'outline'
|
|
}
|
|
|
|
export function Badge({ children, className = '', tone = 'lavender' }: Props) {
|
|
const tones = {
|
|
lavender: 'bg-purple-lavender text-purple-deep',
|
|
deep: 'bg-purple-deep text-white',
|
|
outline: 'border border-purple-deep text-purple-deep',
|
|
}
|
|
return (
|
|
<span
|
|
className={`inline-flex items-center font-mono text-[11px] tracking-widest uppercase rounded-full px-3 py-1 ${tones[tone]} ${className}`}
|
|
>
|
|
{children}
|
|
</span>
|
|
)
|
|
}
|