Skip to main content

Pivotal UI

v19.0.0
Components / Checkboxes

Checkboxes

Checkboxes can be either checked, unchecked or indeterminate.

Checkboxes
ReferenceError: React is not defined
Using indeterminate state
ReferenceError: React is not defined

Props

PropertyRequiredTypeDefaultDescription
checkedfalsebooleanWhether the checkbox is checked, when controlled
childrenfalsenodeContent to place within label to the right of the checkbox
classNamefalsestringClass name to put on outer div element
defaultCheckedfalsebooleanWhether the checkbox is checked, when uncontrolled
disabledfalsebooleanWhether the checkbox is disabled
idfalsestringAuto-generated unique ID with prefix "checkbox"ID to put on the inner input[type="checkbox"]
indeterminatefalsebooleanPuts checkbox into an indeterminate state
labelClassNamefalsestringClass name to put on the checkbox label
namefalsestringName to set on inner input[type="checkbox"]
noSelectfalsebooleanWhen true, prevents the label text from being selectable
onChangefalsefunconChange callback to set on inner input[type="checkbox"]
stylefalseobjectStyle to put on outer div element

All other props will be put onto the inner input[type="checkbox"].

Imports

Import React components (including CSS):

import {Checkbox} from 'pivotal-ui/react/checkbox';

Import CSS only:

import 'pivotal-ui/css/checkbox';