Checkbox

Checkboxes are most commonly used to give users a way to make a range of selections (zero, one, or multiple). They may also be used as a way to have users indicate they agree to specific terms and services.

Installation

To install @igloo-ui/checkbox in your project, you will need to run the following command using npm:

npm install @igloo-ui/checkbox

If you prefer Yarn, use the following command instead:

yarn add @igloo-ui/checkbox

Usage

Then to use the component in your code just import it!

import Checkbox from '@igloo-ui/checkbox';

<Checkbox htmlFor="checkbox-id">Label</Checkbox>;

API

PropTypeDescription
childrenReactNodeThe content to display inside the label
classNamestringAdd a specific class to the checkbox
dataTeststringAdd a data-test tag for automated tests
htmlForstringIndicates the ID of the element that is controlled by the checkbox
checkedbooleanModifies true/false value of the native checkbox
disabledbooleanModifies the native disabled state of the native checkbox
indeterminatebooleanApplies an indeterminate state to the checkbox
onChange(e: ChangeEvent<HTMLInputElement>) => voidFunction called when the value changes.