🎯 Usage

The checkbox component has two use cases. Use it to select one or multiple items from a list, or use it to turn on or off an attribute.

🎭 Behaviours

Multi-select vs. On and Off: Checkboxes used in making multiple selections are submitted only after user confirmation (e.g. via a button). Checkboxes as a toggle between on and off states are handled immediately after checking or unchecking the box.
Checkbox Group & Hierarchy: A checkbox group consists of multiple checkboxes. Checking off a parent checkbox will automatically check off its nested child checkboxes. If not all child checkbox is selected under a parent checkbox, the parent checkbox will appear as dashed (instead checked). Unchecking a parent checkbox will uncheck all its child checkboxes.
Spacing: Grouped checkboxes are evenly spaced from each other, this is passed down from the checkboxGroup. Child checkboxes are indented by 8px.

Property	Type	Default Value	Description
`isChecked`	`boolean`	`false`	Sets checkbox to checked or unchecked state
`isDashed`	`boolean`	`false`	Sets checkbox to dashed or un-dashed state, only applicable under checkboxGroup
`disabled`	`boolean`	`false`	Sets checkbox to disabled state
`label`	`ReactNode`	`-`	Displays label beside the checkbox

Checkbox