Switch

import { Switch } from '@/components/ui/switch'
import { Label } from '@/components/ui/label'

export default function Example() {
  const [enabled, setEnabled] = useState(false)

  return (
    <>
      {/* Basic switch */}
      <div className="flex items-center space-x-2">
        <Switch id="airplane-mode" />
        <Label htmlFor="airplane-mode">Airplane Mode</Label>
      </div>

      {/* Controlled switch */}
      <Switch
        checked={enabled}
        onCheckedChange={setEnabled}
      />

      {/* With description */}
      <div className="flex items-center justify-between">
        <div className="space-y-0.5">
          <Label htmlFor="notifications">Notifications</Label>
          <p className="text-sm text-slate-500">
            Receive push notifications
          </p>
        </div>
        <Switch id="notifications" />
      </div>

      {/* Disabled state */}
      <Switch disabled defaultChecked />
    </>
  )
}