Badge

<Badge variant="red">Featured</Badge>

import { cn } from '@/lib/utils'

type BadgeVariant = 'ink' | 'red' | 'parchment' | 'ghost'

interface BadgeProps {
  variant?:   BadgeVariant
  className?: string
  children:   React.ReactNode
}

const VARIANT_CLASSES: Record<BadgeVariant, string> = {
  ink:      'haiku-badge-ink',
  red:      'haiku-badge-red',
  parchment: 'haiku-badge-parchment',
  ghost:    'haiku-badge-ghost',
}

export function Badge({
  variant   = 'ink',
  className,
  children,
}: BadgeProps): React.JSX.Element {
  return (
    <span className={cn('haiku-badge', VARIANT_CLASSES[variant], className)}>
      {children}
    </span>
  )
}