Checkbox

npx radk add checkbox

import { Checkbox } from "@/components/ui/checkbox"

<Checkbox id="terms" />

import { Checkbox } from "@/components/ui/checkbox"
import { Label } from "@/components/ui/label"

<div className="flex items-center space-x-2">
  <Checkbox id="terms" />
  <Label htmlFor="terms">Accept terms and conditions</Label>
</div>

<div className="flex items-center space-x-2">
  <Checkbox id="disabled" disabled />
  <Label htmlFor="disabled" className="text-muted-foreground">
    Disabled
  </Label>
</div>

"use client"

import { useState } from "react"

export function CheckboxControlled() {
  const [checked, setChecked] = useState(false)

  return (
    <div className="flex items-center space-x-2">
      <Checkbox
        id="controlled"
        checked={checked}
        onCheckedChange={setChecked}
      />
      <Label htmlFor="controlled">
        {checked ? "Checked" : "Unchecked"}
      </Label>
    </div>
  )
}