Checkbox
The Checkbox component allows users to toggle between checked and unchecked states. Commonly used in forms, settings, and option selections, it provides a simple and intuitive way to enable or disable specific features or preferences.
Additional Examples
With text
You agree to our Terms of Service and Privacy Policy.
Disabled
As Form Field
Single Selection
Multiple Selection
Configurable Props
<Checkbox>
Prop | Type | Default/ Options | Description |
|---|---|---|---|
defaultChecked | boolean | The checked state of the checkbox when it is initially rendered. Use when you do not need to control its checked state. | |
checked | boolean | Event handler called when the checked state of the checkbox changes. | |
onCheckedChange | function (checked: boolean | 'indeterminate') => void | Event handler called when the checked state of the checkbox changes. | |
disabled | boolean | When true, prevents the user from interacting with the checkbox. | |
required | boolean | When true, indicates that the user must check the checkbox before the owning form can be submitted. | |
name | string | The name of the checkbox. Submitted with its owning form as part of a name/value pair. |