@paprika/checkbox
v1.1.0
Published
Checkbox component displays a checkbox and label text beside it. When clicked it displays a checkmark. It can also have an indeterminate state which can be used to group checkboxes.
Readme
@paprika/checkbox
Description
Checkbox component displays a checkbox and label text beside it. When clicked it displays a checkmark. It can also have an indeterminate state which can be used to group checkboxes.
Installation
yarn add @paprika/checkboxor with npm:
npm install @paprika/checkboxProps
Checkbox
| Prop | Type | required | default | Description | |-------|-------| -------- | --------- | ----------- | |a11yText|string|false|null| Used for aria-label on the checkbox input| |checkedState|[ Checkbox.types.state.CHECKED, Checkbox.types.state.UNCHECKED, Checkbox.types.state.INDETERMINATE]|false|Checkbox.types.state.UNCHECKED| The checkbox state| |children|node|false|null| Used for label contents| |isDisabled|bool|false|false| Describe if the checkbox is disabled or not| |onChange|func|false|() => {}| Callback triggered when the input state is changed| |size|[ Checkbox.types.size.SMALL, Checkbox.types.size.MEDIUM, Checkbox.types.size.LARGE]|false|Checkbox.types.size.MEDIUM| Size provided by parent Group component| |tabIndex|[number,string]|false|0| Value for tabindex attribute to override the default of 0.|
Usage
import Checkbox from "@paprika/checkbox";
<Checkbox onChange={handleChange} checkState={checkedStateValue>
Checkbox 1
</Checkbox>;