Checkbox

The Checkbox component implements an <input type="checkbox"/> replacement.

Examples

This is just an example Checkbox component, designed in the Plain Kit project. You have total freedom to design Plume components exactly as you'd want them to be, with your own unique variants and behaviors.

Switch to a different kit:

Plain Kit

Basic Checkbox with label

Indeterminate Checkbox

Checkbox Props

PropTypeDescription
childrenReact.ReactNodeLabel for the Checkbox
isSelectedbooleanWhether the Checkbox is checked (controlled)
defaultSelectedbooleanWhether the Checkbox is checked by default (uncontrolled)
isIndeterminatebooleanWhether the Checkbox is "indeterminately" checked; this is a presentational state that often reflects a group of checkboxes, only some of which are checked
isDisabledbooleanWhether the Checkbox is disabled
isReadOnlybooleanWhether the Checkbox is read-only
refPlumeCheckboxRefProgrammatic access to Checkbox

PlumeCheckboxRef

MethodDescription
focus()Focuses this checkbox
UNSAFE_getDOMNode()Returns the root label DOM element

Build your own!

Build your own Checkbox, designed in Plasmic, with the useCheckbox hook!