Button

<Button variant="primary" size="md">Get started</Button>

import type * as React from 'react'
import Link from 'next/link'
import { cn } from '@/lib/utils'

interface ButtonProps {
  children: React.ReactNode
  variant?: 'primary' | 'secondary' | 'ghost'
  size?: 'sm' | 'md' | 'lg'
  href?: string
  onClick?: () => void
  type?: 'button' | 'submit' | 'reset'
  disabled?: boolean
  className?: string
}

const variantClass: Record<NonNullable<ButtonProps['variant']>, string> = {
  primary:   'emb-btn emb-btn-primary',
  secondary: 'emb-btn emb-btn-secondary',
  ghost:     'emb-btn emb-btn-ghost',
}

const sizeClass: Record<NonNullable<ButtonProps['size']>, string> = {
  sm: 'emb-btn-sm',
  md: '',
  lg: 'emb-btn-lg',
}

export function Button({
  children,
  variant = 'primary',
  size = 'md',
  href,
  onClick,
  type = 'button',
  disabled,
  className,
}: ButtonProps): React.JSX.Element {
  const classes = cn(variantClass[variant], sizeClass[size], className)

  if (href) {
    return (
      <Link href={href} className={classes}>
        {children}
      </Link>
    )
  }

  return (
    <button type={type} onClick={onClick} disabled={disabled} className={classes}>
      {children}
    </button>
  )
}