Text

<Text variant="body">The bounty board for serious security researchers.</Text>

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

interface TextProps {
  children: React.ReactNode
  variant?: 'body' | 'caption' | 'label' | 'code'
  as?: 'p' | 'span' | 'div'
  className?: string
}

export function Text({
  children,
  variant = 'body',
  as: Tag = 'p',
  className,
}: TextProps): React.JSX.Element {
  return (
    <Tag
      className={cn(
        variant === 'body' && 'text-body',
        variant === 'caption' && 'text-caption',
        variant === 'label' && 'text-label',
        variant === 'code' && 'text-code',
        className,
      )}
    >
      {children}
    </Tag>
  )
}