Checkbox
A control for selecting one or more independent options.
A control for selecting one or more independent options.
Import
import { Checkbox } from 'bmates-ui';Basic usage
The example below mirrors the primary Storybook composition and can be used as a starting point.
<Checkbox defaultChecked>Send me product updates</Checkbox>Preview
<Checkbox defaultChecked>Send me product updates</Checkbox>Prop previews
The examples below isolate the props that change visual output or interaction.
Checked and disabled states
<Checkbox defaultChecked label="Checked" />Component API
checked
Controlled checked state.
defaultChecked
Initial uncontrolled checked state.
onCheckedChange
Called whenever the checked state changes.
label
Text rendered next to the control.
align
Vertical alignment of the box and label.
iconEl
Custom checkmark content.
disabled
Prevents interaction.
Usage notes
- Every component in the table is exported from
bmates-ui. - Unless noted otherwise, a component also accepts the standard props of its underlying HTML element.
- For application-owned state, use a controlled value and its change handler instead of only a
default*prop.