Checkbox Group

Флажки с общей подписью, подсказкой, ошибкой и обязательностью. Бесплатно, MIT · Формы и ввод › Флажки и ползунки

Установка

npx valyro-cli@latest add checkbox-group

npx shadcn@latest add https://valyro.xyz/r/checkbox-group.json

npm install valyro-ui

import 'valyro-ui/styles.css';
import { CheckboxGroup } from 'valyro-ui';

Пропсы

Prop	Type	Default
`options`	`CheckboxGroupOption[]`		Checkboxes in order, each with a label and an optional description. Or compose them as children: `CheckboxGroup.Item`.
`children`	`ReactNode`		The compound form instead of `options`: `CheckboxGroup.Item` elements.
`value`	`string[]`		Checked values, in the order they were checked.
`defaultValue`	`string[]`		Initial `value` when uncontrolled.
`onValueChange`	`(value: string[]) => void`		Called with the new `value` when it changes.
`name`	`string`		Name of the checkboxes: each checked one submits its value under it.
`label`	`ReactNode`		Visible name above the checkboxes, linked to the group. Outside a FormField a group needs a name (this, or an `aria-label` / `aria-labelledby`), or a screen reader reads the checkboxes with no question.
`description`	`ReactNode`		Helper text under the checkboxes, read with the group. Hidden while `error` is set.
`error`	`ReactNode`		Error message; any truthy value marks the group invalid and replaces the description.
`required`	`boolean`		At least one box must be checked: a required mark, the `labels.required` word, and the form does not submit without one.
`invalid`	`boolean`	`false`	Error colour and `aria-invalid` on every checkbox (set by `error` or a FormField too).
`disabled`	`boolean`	`false`	Disables every checkbox.
`readOnly`	`boolean`	`false`	The checks show but cannot change.
`orientation`	`'vertical' \| 'horizontal'`	`'vertical'`	Stack the checkboxes in a column or lay them out in a row.
`size`	`'sm' \| 'md' \| 'lg'`	`'md'`	Checkbox and text size.
`labels`	`Partial<CheckboxGroupLabels>`		Overrides for the built-in English text; keys left out keep their defaults.

Составные части

CheckboxGroup.Item (CheckboxGroupItem)

Checkbox Group

Установка

Пропсы

Составные части

Похожие компоненты