Checkbox
Нативний чекбокс із mixed-станом, описом, помилкою та серіалізацією форми.
Приклад
Частину проєктів уже обрано.
Дайджест: увімкнено
API
Props
| Назва | Тип | Типово | Опис |
|---|---|---|---|
value | string | number | "on" | Значення, яке браузер серіалізує для checked checkbox. |
label | string | — | — |
description | string | — | Пояснення під міткою. Друкується дрібнішим і не замінює `label`. |
error | string | — | Текст помилки. Стан помилки вмикає САМА наявність тексту — булевого прапорця немає навмисно, щоб не було червоного поля без пояснення причини. |
hint | string | — | Підказка під полем. Ховається, коли показано помилку: `aria-describedby` має вказувати рівно на один опис. |
id | string | — | — |
name | string | — | — |
modelValue | boolean | false | Стан прапорця. Використовуйте через `v-model`. |
indeterminate | boolean | false | Візуальний і ARIA-стан часткового вибору. |
disabled | boolean | — | — |
required | boolean | — | — |
Події
| Назва | Payload | Опис |
|---|---|---|
update:modelValue | [value: boolean] | Новий булевий стан. |
change | [value: boolean] | Новий стан після дії користувача. |
Слоти
| Назва | Опис |
|---|---|
default | Власний підпис замість `label`. |
Доступно через ref
| Назва | Тип | Опис |
|---|---|---|
focus | () => void | — |
Коли використовувати
Для незалежного булевого параметра, підтвердження умови або множинного
вибору. indeterminate показує частково обрану групу, але значення форми
лишається булевим.
Коли НЕ використовувати
Не використовуйте для налаштування, яке спрацьовує одразу — для цього є
UiSwitch. Для одного вибору з кількох взаємовиключних варіантів беріть
UiRadioGroup.
Доступність
Компонент використовує один нативний <input type="checkbox">, тому Space,
форми та assistive technologies працюють без емуляції. Mixed-стан передається
одночасно через DOM-властивість indeterminate та aria-checked="mixed".
id і name розділені: перший звʼязує label, другий визначає ключ форми.