Text

<Text variant="body">Single-origin beans sourced from small farms.</Text>

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

type Variant = 'body' | 'caption' | 'label' | 'code'
type As      = 'p' | 'span' | 'div' | 'h2' | 'h3' | 'h4'

interface TextProps {
  variant?:   Variant
  as?:        As
  className?: string
  children:   React.ReactNode
}

const variantClass: Record<Variant, string> = {
  body:    'text-body',
  caption: 'text-caption',
  label:   'text-label',
  code:    'text-code',
}

export function Text({
  variant = 'body',
  as: Tag = 'p',
  className,
  children,
}: TextProps): React.JSX.Element {
  return (
    <Tag className={cn(variantClass[variant], className)}>
      {children}
    </Tag>
  )
}