Checkbox

The Checkbox allows the user to toggle/select multiple values between checked and not checked.

import { Checkbox, CheckboxGroup } from '@backyard-ui/core';

To add a label or status message to your fields use the FormControl utility.

• size
  Description The Checkbox size

  Type

  "xs" | "sm"

  Default

  sm
• value
  Description The Checkbox value

  Type

  string | number
• isChecked
  Description If `true`, the checkbox will be checked. You'll need to pass `onChange` to update its value (since it is now controlled)

  Type

  boolean
• isIndeterminate
  Description If `true`, the checkbox will be indeterminate.

  Type

  boolean
• isDisabled
  Description Set the form element to disabled

  Type

  boolean
• isInvalid
  Description Set the form element `aria-invalid` to `true`

  Type

  boolean
• isReadOnly
  Description Set the form element to readonly

  Type

  boolean
• isRequired
  Description Set the form element `aria-required` to `true`

  Type

  boolean

• value
  Description The value of selected checkboxes

  Type

  string[]
• defaultValue
  Description The initial value

  Type

  string[]
• onChange
  Description The callback fired when any children Checkbox is checked or unchecked

  Type

  ((value: string[]) => void)
• children required
  Description The children nodes

  Type

  ReactNode
• size
  Description The Checkbox size

  Type

  "xs" | "sm"

  Default

  sm