Components
Checkbox
A Checkbox is a form control that allows the user to select a value from a set of options
Basic Usage
A Checkbox is a form control that allows the user to select a value from a set of options
import { Checkbox, Label } from "@epilot/volt-ui"
<div>
<Checkbox id="agree-to-terms" />
<Label htmlFor="agree-to-terms">Accept terms and conditions.</Label>
</div>
<div>
<Checkbox id="enable-notifications" checked />
<Label htmlFor="enable-notifications">
Notifications enabled
</Label>
</div>
<div>
<Checkbox id="some-items-selected" checked="indeterminate" />
<Label htmlFor="some-items-selected">
Some items selected
</Label>
</div>API Reference
Checkbox
The checkbox component that allows users to select a value from a set of options.
| Prop | Type | Default | Description |
|---|---|---|---|
checked | boolean | "indeterminate" | - | Controlled checked state of the checkbox. |
defaultChecked | boolean | "indeterminate" | false | Uncontrolled default checked state. |
onCheckedChange | (checked: boolean | "indeterminate") => void | - | Callback fired when the checked state changes. |
disabled | boolean | false | When true, prevents the checkbox from being interacted with. |
required | boolean | false | When true, indicates that the checkbox must be checked before form submission. |
name | string | - | The name of the checkbox, used when submitting a form. |
value | string | number | readonly string[] | - | The value of the checkbox, used when submitting a form. |
id | string | - | The unique identifier for the checkbox element. |
className | string | - | Additional CSS classes to apply to the checkbox. |