Checkbox
MD3 checkbox with checked, indeterminate, and error states. Built on a
native <input type="checkbox"> — label association, keyboard, and form
submission behave natively.
States
<Checkbox checked={checked} onChange={(event, next) => setChecked(next)} />
Indeterminate
The mixed state is exposed to assistive technology via the native
indeterminate property and aria-checked="mixed". An indeterminate
checkbox submits nothing on form submission, matching the platform.
Error
Props
| Prop | Type | Default | Description |
|---|---|---|---|
checked | boolean | — | Controlled checked state. |
defaultChecked | boolean | false | Uncontrolled initial checked state. |
error | boolean | false | Error state. |
indeterminate | boolean | false | Indeterminate (mixed) state. |
inputRef | Ref<HTMLInputElement> | — | Ref to the native `<input>` element (the forwarded `ref` points at the root). |
onChange | ((event: ChangeEvent<HTMLInputElement, Element>, checked: boolean) => void) | — | Fires with the native event and the next checked state on toggle. |