Checkbox

Root · Label · Control · Indicator

#Control

A styled part — no props of its own; it takes the anatomy's shared styling.

Prop	Type	Default	Description
`value`	`UnwrapRef<UseCheckboxGroupReturn>`		—

Prop	Type	Description
`defaultValue`	`string[]`	The initial value of `value` when uncontrolled
`disabled`	`boolean`	If `true`, the checkbox group is disabled
`invalid`	`boolean`	If `true`, the checkbox group is invalid
`maxSelectedValues`	`number`	The maximum number of selected values
`modelValue`	`string[]`	The controlled value of the checkbox group
`name`	`string`	The name of the input fields in the checkbox group (Useful for form submission).
`readOnly`	`boolean`	If `true`, the checkbox group is read-only

Event	Payload
`valueChange`	`value: string[]`
`update:modelValue`	`value: string[]`

A styled part — no props of its own; it takes the anatomy's shared styling.

Prop	Type	Default	Description
`indeterminate`	`boolean`		—

A styled part — no props of its own; it takes the anatomy's shared styling.

Prop	Type	Default	Description
`size`	`String as PropType<"sm" \| "md" \| "lg">`	`"md"`	One rung for the control's box: the tick scales with it.
`checked`	`checkbox.CheckedState`		The controlled checked state of the checkbox
`defaultChecked`	`checkbox.CheckedState`		The initial checked state of the checkbox when rendered. Use when you don't need to control the checked state of the checkbox.
`disabled`	`boolean`		Whether the checkbox is disabled
`form`	`string`		The id of the form that the checkbox belongs to.
`id`	`string`		The unique identifier of the machine.
`ids`	`Partial<{ root: string; hiddenInput: string; control: string; label: string; }>`		The ids of the elements in the checkbox. Useful for composition.
`invalid`	`boolean`		Whether the checkbox is invalid
`name`	`string`		The name of the input field in a checkbox. Useful for form submission.
`readOnly`	`boolean`		Whether the checkbox is read-only
`required`	`boolean`		Whether the checkbox is required
`value`	`string`	`"on"`	The value of checkbox input. Useful for form submission.

Event	Payload
`checkedChange`	`details: CheckedChangeDetails`
`update:checked`	`checked: CheckedState`