Checkbox

The Checkbox is used in forms when a user needs to select multiple values from several options.
Checkbox composes reakit's checkbox component.

Imports#

• Checkbox - main checkbox component
• CheckboxInput - checkbox's input component
• CheckboxLabel - label for checkbox
  • CheckboxIcon - renders checkbox's icon
  • FormHelperText - text for the checkbox label

Usage#

All the form elements of renderlesskit are compatible with FormField, thus you can directly use any of the elements inside of FormField and it will automatically handle all the accessibility & props.

Basic usage.

Checkbox sizes#

Checkbox comes with 3 sizes sm md lg

Controlled Checkbox#

Checkbox Groups#

We can keep track of multiple checkbox states and use them as a group.

Indeterminate checkboxes#

Customizing Checkboxes#

To customize the checkbox we can use render props api to access the internal state of the checkbox & change it's appearance as we like with composing CheckboxInput, CheckboxLabel etc etc components like so:

Integrations#

// TBD

API Reference#

Checkbox#

Checkbox composes reakit's checkbox component