Checkbox

A box the user can check or uncheck, with an indeterminate state.

Preview

Loading Preview...

bun add xiod-ui

1import { Checkbox, CheckboxGroup } from "xiod-ui/checkbox";

Detailed documentation of properties and options.

alias: CheckboxGroupItem

Accepts className, style and render, plus every native attribute of the element it renders.

Prop	Type	Default	Description
`checked`	`boolean`	`undefined`	Whether the checkbox is currently ticked. To render an uncontrolled checkbox, use the `defaultChecked` prop instead.
`defaultChecked`

Accepts className, style and render, plus every native attribute of the element it renders.

Prop	Type	Default	Description
`allValues`	`string[]`	–	Names of all checkboxes in the group. Use this when creating a parent checkbox.
`defaultValue`	`string[]`	–	Names of the checkboxes in the group that should be initially ticked. To render a controlled checkbox group, use the `value` prop instead.
`disabled`	`boolean`	`false`	Whether the component should ignore user interaction.
`onValueChange`	`((value: string[], eventDetails: CheckboxGroupChangeEventDetails) => void)`	–	Event handler called when a checkbox in the group is ticked or unticked. Provides the new value as an argument.
`value`	`string[]`	–	Names of the checkboxes in the group that should be ticked. To render an uncontrolled checkbox group, use the `defaultValue` prop instead.