CheckboxGroup

Groups multiple related checkboxes with shared state management and semantic form structure.

Install Dependencies

npx quickcode-ui add CheckboxGroup

pnpm dlx quickcode-ui add CheckboxGroup

yarn dlx quickcode-ui add CheckboxGroup

bunx quickcode-ui add CheckboxGroup

Notifications

Email notifications

SMS notifications

Push notifications

User Permissions

Select the permissions you want to grant to this user

Read access

Write access

Delete access

Admin privileges

Prop	Type	Default	Description
`value`	`string[]`	`undefined`	Controlled array of selected checkbox values.
`onValueChange`	`(value: string[]) => void`	`undefined`	Callback when selection changes.
`defaultValue`	`string[]`	`[]`	Initial selected values for uncontrolled usage.
`disabled`	`boolean`	`false`	Disables all checkboxes in the group.
`label`	`string`	`undefined`	Label for the checkbox group.
`description`	`string`	`undefined`	Helper text displayed below the label.
`error`	`string`	`undefined`	Error message displayed below the group.
`className`	`string`	`undefined`	Additional CSS classes for the fieldset wrapper.
`children`	`React.ReactNode`	—	CheckboxGroup.Item components.

Prop	Type	Default	Description
`value`	`string`	—	Unique identifier for this checkbox.
`label`	`string`	`undefined`	Label text for the checkbox.
`size`	`"sm" \| "md" \| "lg"`	`"md"`	Size of the checkbox.
`disabled`	`boolean`	`false`	Disables this specific checkbox.
`className`	`string`	`undefined`	Additional CSS classes for the checkbox wrapper.