RadioGroup
Група нативних radio з roving tabindex і навігацією Arrow, Home та End.
Приклад
Обрано: team
API
Props
| Назва | Тип | Типово | Опис |
|---|---|---|---|
options* | RadioOption[] | — | Варіанти вибору. Група розрахована на 2–7 видимих варіантів; більше — це вже `UiSelect`. |
modelValue | string | number | null | Обране значення. Використовуйте через `v-model`. |
label | string | — | — |
orientation | verticalhorizontal | "vertical" | Напрям розкладки. Впливає і на стрілки: у вертикальній групі працюють ↑/↓, у горизонтальній — ←/→. |
error | string | — | Текст помилки. Стан помилки вмикає САМА наявність тексту. |
hint | string | — | Підказка під групою. Ховається, коли показано помилку. |
id | string | — | — |
name | string | — | — |
disabled | boolean | — | — |
required | boolean | — | — |
Події
| Назва | Payload | Опис |
|---|---|---|
update:modelValue | [value: string | number] | Значення обраного варіанта. |
change | [value: string | number] | Варіант, обраний дією користувача. |
Слоти
| Назва | Опис |
|---|---|
option | — |
Коли використовувати
Коли користувач має бачити всі 2–7 взаємовиключних варіантів одразу — тариф,
режим доставки або рівень доступу. Нативний name забезпечує коректну
серіалізацію форми.
Коли НЕ використовувати
Для довгого чи динамічного списку краще UiSelect. Для незалежних варіантів,
де можна обрати кілька, використовуйте UiCheckbox.
Доступність
Arrow-клавіші змінюють вибір у межах групи, Home та End переходять до першого й останнього доступного варіанта. Disabled-елементи завжди пропускаються. Візуальні картки не замінюють нативні radio — вони лишаються єдиними семантичними контролами.