File size: 1,131 Bytes
80bcac8 ffd0276 80bcac8 ffd0276 80bcac8 ffd0276 80bcac8 ffd0276 80bcac8 ffd0276 80bcac8 | 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 34 35 36 37 38 | 'use client'
import { forwardRef, HTMLAttributes } from 'react'
import { cn } from '@/utils/helpers'
export interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
variant?: 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'outline' | 'muted'
}
export const Badge = forwardRef<HTMLSpanElement, BadgeProps>(
({ className, variant = 'primary', children, ...props }, ref) => {
const variants = {
primary: 'badge-primary',
secondary: 'badge-secondary',
success: 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300',
warning: 'bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-300',
danger: 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300',
outline: 'badge-outline',
muted: 'badge-muted',
}
return (
<span
ref={ref}
className={cn(
'inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium badge',
variants[variant],
className
)}
{...props}
>
{children}
</span>
)
}
)
Badge.displayName = 'Badge' |