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

/** The On/Off pill. Sage when on, neutral when off. */
export function Toggle({
  on,
  onChange,
  disabled,
  label,
  onLabel = 'On',
  offLabel = 'Off',
  className,
}: {
  on: boolean
  onChange?: (next: boolean) => void
  disabled?: boolean
  /** Accessible name for the switch. */
  label: string
  onLabel?: string
  offLabel?: string
  className?: string
}) {
  return (
    <button
      type="button"
      role="switch"
      aria-checked={on}
      aria-pressed={on}
      aria-label={label}
      disabled={disabled}
      className={cn('toggle', className)}
      onClick={() => onChange?.(!on)}
    >
      {on ? onLabel : offLabel}
    </button>
  )
}