Combobox

Async-пошук без локальної фільтрації — компонент показує рівно те, що дійшло з сервера.

Відмінність від Select принципова: Select фільтрує свій статичний список локально, Combobox — НІ. Панель показує рівно те, що споживач поклав в options. Подвійна фільтрація (тут + сервером) ховала б валідні матчі, які сервер знайшов за іншим полем.

Приклад

Місто

Обрано: —

API

Props

Назва	Тип	Типово	Опис
`options`*	`ComboboxOption[]`	—	Поточні варіанти. Компонент їх НЕ фільтрує: список приходить із сервера у відповідь на подію `search`.
`modelValue`	`string \| number`	—	Обране значення. Використовуйте через `v-model`.
`label`	`string`	—	—
`placeholder`	`string`	`"Пошук…"`	—
`size`	`FieldSize`	`"md"`	Висота поля. На мобільному кожен розмір вищий за десктопний.
`error`	`string`	—	Текст помилки. Сама його наявність вмикає стан помилки.
`hint`	`string`	—	Підказка під полем. Ховається, коли показано помилку.
`name`	`string`	—	—
`minChars`	`number`	`0`	Не емітити `search`, доки запит коротший. 0 — емітити все.
`id`	`string`	—	Стабільний DOM id. `name` використовується лише для форми.
`disabled`	`boolean`	`false`	—
`required`	`boolean`	—	—
`loading`	`boolean`	`false`	Керований стан завантаження — панель показує «Завантаження…».
`clearable`	`boolean`	`true`	Дозволяє скинути вибір хрестиком.

Події

Назва	Payload	Опис
`update:modelValue`	`[value: string \| number]`	Обране значення або `null`, якщо вибір скинуто.
`search`	`[query: string]`	Введений текст. Споживач дебаунить і фетчить сам.

Слоти

Назва	Опис
`option`	Власний рендер пункту списку.

Доступно через ref

Назва	Тип	Опис
`focus`	`() => void`	Ставить фокус на поле.

Коли використовувати

Вибір з ВЕЛИКИХ або віддалених наборів: користувачі, групи, моделі, міста. minChars береже сервер від пошуку по одній букві.

Коли НЕ використовувати

Для статичного списку на 5–50 пунктів потрібен Select: локальна фільтрація миттєва й не коштує запитів.

Для мультивибору є MultiSelect.

Доступність

Той самий ARIA-комбобокс, що в Select: role="combobox", aria-autocomplete="list", панель — listbox, пункти — option з aria-selected. Escape закриває панель і не «протікає» в модалку навколо.

Стан завантаження замінює шеврон спінером і показує «Завантаження…» в панелі — користувач розуміє, що пошук живий, а не зламався.