TreeSelect

Одиночный выбор

Значение: —

Множественный выбор

Выбрано: —

В триггере показываются первые три значения, дальше — «и ещё N».

Поиск и раскрытие всех веток

Поиск ищет по всем уровням: если совпал потомок, его ветка тоже остаётся видимой.

Очистка, ошибка и отключение

Размеры и ограничение высоты

Входные параметры

Имя	Тип	По умолчанию	Описание
`nodes`	`TreeNode[]`	`[]`	Корневые узлы дерева. Поля узла: `label`, `value?` (по умолчанию равен `label`), `icon?`, `disabled?`, `children?`.
`modelValue`	`string \| number \| Array<string \| number>`	`undefined`	Выбранные значения (через `v-model`). Массив при `multiple`.
`placeholder`	`string`	`'Выберите значение'`	Подсказка в триггере, когда ничего не выбрано.
`searchable`	`boolean`	`false`	Показывать поле поиска по узлам. Заодно раскрывает все ветки.
`searchPlaceholder`	`string`	`'Поиск...'`	Подсказка в поле поиска.
`multiple`	`boolean`	`false`	Множественный выбор. Меню после выбора остаётся открытым.
`clearable`	`boolean`	`false`	Показывать крестик очистки выбора.
`expandAll`	`boolean`	`false`	Раскрыть все ветки сразу.
`size`	`'sm' \| 'md' \| 'lg'`	`undefined`	Размер поля. Если не задан, берётся из `C3FormField`, иначе `md`. Высота триггера совпадает с остальными полями.
`maxHeight`	`string`	`'20rem'`	Максимальная высота прокручиваемого списка узлов.
`disabled`	`boolean`	`false`	Отключает поле: меню не открывается, крестик очистки скрыт.
`error`	`boolean`	`false`	Признак ошибки — красная рамка и `aria-invalid`.
`name`	`string`	`undefined`	Имя поля для отправки в формах.

События

Имя	Аргументы	Когда срабатывает
`update:modelValue`	`value: string \| number \| Array<string \| number>`	При выборе или очистке узла.
`select`	`node: TreeNode`	При выборе узла — вместе с `update:modelValue`, чтобы можно было отреагировать на сам узел.

Описание

TreeSelect — выбор значения из иерархии. Это C3Tree (раскрытие веток, выбор узлов) внутри поля-триггера с поповером: снаружи он выглядит и ведёт себя как обычное поле формы, внутри — как дерево.

Триггер повторяет поведение остальных полей: значение или подсказка, шеврон, состояния disabled/error, размер из C3FormField и та же высота, что у остальных полей того же размера. Внутри поповера — C3Tree, поэтому отступы вложенности, иконки и подсветка выбранного узла работают точно так же, как в отдельном компоненте Tree.

Дополнительная информация

Слотов нет: состав выбранного значения задаётся деревом узлов.
Значение узла — node.value, а если его нет — node.label. Поэтому в v-model попадает строка, если у узла нет явного value.
Поиск фильтрует все уровни: если совпал потомок, его ветка остаётся в списке вместе с ним. При пустом результате показывается «Ничего не найдено». Поиск сбрасывается при каждом открытии меню.
При multiple меню после выбора не закрывается, а в триггере первые три значения перечисляются через запятую, остальные сворачиваются в «и ещё N».
Крестик очистки не открывает меню: клик по нему останавливает всплытие. В disabled он скрыт.
Клавиатура: ArrowDown, Enter и Space открывают меню, Escape закрывает и возвращает фокус на триггер, клик вне закрывает.
Доступность: триггер — настоящий <button> с aria-haspopup="tree" и aria-expanded, поповер — role="tree". Без searchable фокус сразу уходит в меню, с ним — в поле поиска.
Поповер телепортится в body и позиционируется под триггером, поэтому не обрезается родителями с overflow: hidden.
Компонент интегрируется с C3FormField: наследует size и error и регистрирует значение для валидации.
Рамка поля лежит на контейнере __control, а триггер и крестик очистки — соседние кнопки внутри него. Вложенные <button> недопустимы: браузер выносит внутреннюю кнопку из внешней при разборе HTML, что ломает гидрацию.