GrTransfer

items даёт каталог, modelValue — ключи отобранного в порядке правой панели. Обе панели это одна раскладка одного каталога: два массива-модели дали бы два источника правды и вопрос «что делать, когда ключ в обоих».

Отсюда же следует, что перестановка правой панели и есть правка значения: потребитель хранит один массив, а не множество плюс сортировку.

Компонент не мутирует вход: каждая правка уезжает новым массивом, поэтому сравнение «было — стало» и история в сторе потребителя продолжают работать.

Каталог часто приезжает позже сохранённого выбора. Ключ из modelValue, которому в items ничего не соответствует, остаётся в значении и не рисуется — иначе первый же рендер уничтожил бы выбор, который на сервере цел. В dev об этом предупреждает консоль, и только когда items уже непуст.

Элемент без itemKey получает временный ключ, чтобы выбор одной строки не пометил все. Такой ключ не переживает перезагрузку данных — это тоже предупреждение, а не решение: задайте itemKey.

Отметить строку и перенести её — разные действия, и первое наружу не уходит. Клик выделяет одну строку, Ctrl/Cmd добавляет по одной, Shift берёт диапазон от якоря. Якорь Shift не двигает: иначе диапазон нельзя было бы растянуть повторным нажатием.

После переноса выделение не сбрасывается, а переезжает в панель-приёмник: Alt+стрелка сразу ставит перенесённое на место, а возврат — одно нажатие.

Фильтр в панели не трогает ни выделение, ни модель. Строка, отмеченная и затем скрытая запросом, остаётся отмеченной и переносится вместе со всеми — иначе ввод в поле поиска молча отменял бы уже сделанную работу.

Чтобы это не удивляло, счётчик в шапке считает по всей панели, а не по видимой её части, и перенос объявляется числом.

Диапазон по Shift считается по видимому порядку: «отсюда досюда» обязано значить то же самое, что человек видит.

Событие search отдаёт запрос и сторону, items подставляет потребитель — а loading говорит, что ответ ещё в пути:

<GrTransfer v-model="members" :items="items" :loading="pending" @search="fetch" />

Без флага пустая панель во время запроса утверждала «ничего не найдено» — хотя совпадений ещё не искали.

Показывается это в трёх местах, и каждое закрывает свой случай:

• пустая панель говорит «ищем» вместо «ничего не найдено». Состояния взаимоисключающи;
• панель со строками их не теряет: они настоящие, и подменять их «ищем» нельзя. Сигнал там даёт спиннер в поле поиска (aria-busy от GrInput);
• живой регион объявляет загрузку: смена одного пустого текста на другой сама себя не объявляет, и пользователь скринридера получил бы тишину.

Текст меняет loadingText, разметку — слот #loading (получает side).

Флаг общий на обе панели, а не свой у каждой: items — один каталог, и обе панели его виды, так что пока он едет, пусты обе.

Под загрузкой гаснет dev-предупреждение о ключах modelValue, которых нет в items: неполный каталог во время запроса — норма. Иначе серверный поиск, сужая каталог, ронял бы предупреждение на каждое нажатие клавиши.

Кнопки переноса не блокируются: они действуют на значение, а оно известно и во время запроса.

Alt+стрелка в отфильтрованной правой панели не работает и говорит об этом. «Сдвинуть вниз» над отфильтрованным списком либо перепрыгивает невидимые строки, либо даёт порядок, который пользователь не мог предсказать; и то и другое хуже отказа.

Это то же правило, по которому живёт весь пакет: Enter и Space не взаимозаменяемы. Отсюда и решение не встраивать GrSortableList в правую панель — там Space вводит режим «строка взята», и в списке с мультивыбором обе клавиши оказались бы заняты дважды.

Перестановка поэтому не режим, а команда: Alt+стрелка двигает всё текущее выделение сразу, чего «взять и положить» не умеет в принципе. Она же вынесена кнопками в шапку правой панели — сочетание её ускоряет, но само по себе неоткрываемо, а на macOS почти все мета-клавиши заняты системой.

Кнопки эти горизонтальные, а сочетание вертикальное, и расхождение намеренное. Порядок правой панели — последовательность, а не положение на экране: он задаёт колонки отчёта и поля выгрузки, которые читаются слева направо. Отдать сочетанию ту же ось нельзя: в Chrome и Firefox под Windows и Linux Alt+←/→ — это «назад/вперёд» в истории браузера. В Safari навигация висит на Cmd+стрелках, но пакет едет ко всем, и одной платформы тут мало. Расхождение с GrTree, где строку двигает Shift+стрелка, намеренное: здесь Shift занят диапазоном — это контракт списка с мультивыбором.

У жеста три состояния, и каждое имеет свой вид.

Взять. Строка предлагает себя курсором grab ещё до нажатия, а как только жест начался, курсор становится grabbing — и не только над строкой, а по всему компоненту: рука занята везде, а не в одной точке.

Нести. За курсором едет предпросмотр: подпись первой строки и число остальных. Он и есть ответ на вопрос «где сейчас элемент» — без него строка оставалась на месте с бледной подложкой, и жест выглядел так, будто ничего не происходит. Несколько строк не перечисляются: список из десяти имён под курсором закрыл бы то самое место, куда человек целится. На покинутом месте остаётся пунктирная рамка — видно, откуда взяли и куда можно вернуть.

На время жеста выделение текста гасится на всём документе, а не только на самом компоненте: выделение начинается внутри него, но тянется по всей странице, и человек, ведя строку, попутно подсвечивал бы чужие заголовки и абзацы. Прежнее значение возвращается по отпусканию — потребитель мог задать своё.

Положить. Панель-приёмник подсвечивается и рамкой, и подложкой: одной рамки мало, на широком экране она за пределами взгляда, занятого курсором. Место вставки показывает линия у края соседней строки.

Приехавшие строки коротко подсвечиваются. Статичный итог перенос и так показывает — счётчики меняются, — но само движение ничем не выдано: строки просто возникают. Под prefers-reduced-motion подсветку гасит глобальный кламп, и остаётся тот же статичный итог.

Список, который продолжается за краем, гасит свой край. Полоса прокрутки панели на части систем невидима, и без затухания обрезанная посередине строка читается как дефект отрисовки, а не как «прокрути».

virtual вместе с max-height держит в DOM только окно строк вокруг видимой части панели: справочник на тысячи прав — ровно тот случай, ради которого берут transfer, а не мультиселект.

Перенос от этого не страдает: он идёт по модели, а не по разметке, — кнопки переносят и то, что сейчас за краем окна. Ограничено только перетаскивание указателем: уронить строку можно на отрисованную, но навести указатель на то, чего нет на экране, всё равно нечем.

Клавиатура работает как прежде: перед переводом фокуса панель прокручивает нужную строку в окно и только следующим тиком отдаёт ей фокус — иначе фокус остался бы на месте, потому что элемента вне окна не существует. А если сфокусированную строку унесло колесом мыши, фокус уходит на сам список: обработчик клавиш висит там, и упади фокус на body, клавиатура панели умерла бы до клика мышью.

Размер набора и место в нём диктору сообщают aria-setsize и aria-posinset — без них он объявил бы «первая из двенадцати» посреди двухтысячного каталога.

Заголовок панели — это её доступное имя, и #header заменяет его целиком. Чтобы подмена не оставляла панель безымянной, имя при своей шапке приходит из sourceTitle/targetTitle напрямую, а не ссылкой на разметку, которой больше нет. Проверять это глазами бесполезно: на экране всё выглядит правильно, а теряется только то, что читает скринридер.

Когда переносить нечего, кнопка помечается aria-disabled и остаётся в таб-порядке. Нативный disabled уронил бы фокус в тело документа ровно после последнего клика — и заодно лишил бы скринридер возможности прочитать, что кнопка вообще есть.

• виртуализации панелей нет — цель переноса обязана быть отрисована. Панель на тысячу строк требует своего решения у потребителя;
• дерева внутри панели нет — элементы плоские;
• асинхронной подгрузки справочника нет: событие search отдаёт запрос, а что с ним делать, решает потребитель, меняя items.