GrFormFile

v-model:errors — двусторонний канал: туда пишет внутренняя валидация, и туда же потребитель кладёт ошибки, пришедшие с сервера. Пока проп задан, он сильнее внутреннего списка (та же схема, что sortKey у GrDataTable).

<GrFormFile v-model="files" v-model:errors="errors" accept="application/pdf" multiple :limit="3" />

Канал один: эмит validation дублировал update:errors той же нагрузкой и снят.

Список ошибок объявляется role="alert" и связан с кнопкой выбора через aria-describedby — вместе с aria-describedby от GrFormField, если поле внутри него. Пока ошибки есть, кнопка несёт aria-invalid. До этого «уронил файл не того типа» выглядело для скринридера как «ничего не произошло».

Набор валидаторов собирается в одном месте и уходит и в выбор через диалог, и в v-dropzone: две копии этой сборки разъезжаются при первой же правке, и перетаскивание начинает вести себя не так, как диалог.

Порядок: accept → limit → validators потребителя → validate. limit — сахар к maxCountValidator: лишние файлы не обрезаются молча, набор отбивается ошибкой, как любым другим правилом.

Новый выбор — диалогом или перетаскиванием — дописывается к уже выбранным: галерея и список вложений растут, а не теряют выбранное при каждом диалоге. Повтор уже выбранного файла (то же имя, размер и время изменения) отбрасывается. Кнопка у непустого набора — «Add files» (gr.formFile.add, свой текст — addText), начать заново — «Clear all».

Валидаторы видят набор целиком: limit, maxTotalSizeBytesValidator и validate проверяют то, что получится после добавления, а не последний выбор. Отбитый выбор набор не трогает — остаётся прежний и ошибка.

Заменять набор при каждом выборе — старое поведение — можно явно: replace. Кнопка тогда снова «Change file».

В multiple каждая строка показывает имя и размер, а кнопка удаления называет свой файл (aria-label) — три подряд кнопки «Удалить» для скринридера неразличимы. Строка — во всю ширину колонки: длинное имя усекается многоточием (полное — в title), размер и «Удалить» стоят у общего правого края, и в узком контейнере кнопку не выталкивает.

Disabled гасится курсором и состоянием самих кнопок: opacity на контейнере разбавляла бы и подписи, и имена файлов.

Порядок задаёт пользователь

reorderable добавляет строке ручку переноса. Нужно там, где последовательность файлов что-то значит: галерея, страницы документа, очередь вложений. Осмысленно только с multiple.

Механика берётся у GrSortableList, а не пишется заново: перенос указателем, клавиатура (Space берёт строку, стрелки двигают, Esc отменяет), автопрокрутка и объявления у него уже есть. Цена честная — его стили приезжают каждому, кто берёт GrFormFile.

Тянется ручка, а не строка: в строке стоит кнопка удаления, и перетаскивание всей строки отняло бы у неё клик.

Перестановка отдаёт update:modelValue и change — как удаление и добавление. Без второго порядок остался бы только на экране, а в форму ушёл бы прежний. При readonly и disabled перенос запрещён.

preview включает миниатюры: они появляются у файлов image/*, файл любого другого типа остаётся обычной строкой. Миниатюра квадратная и обрезается по object-cover — иначе строки списка скакали бы по высоте вслед за пропорциями снимков.

<GrFormFile v-model="gallery" multiple preview accept="image/*" />

alt у миниатюры пустой: имя файла стоит вплотную, и озвучивать его дважды незачем. object URL живёт ровно столько, сколько файл в наборе, — он отзывается, как только файл из набора ушёл, чем бы его ни убрало.

Набор виден и уходит в форму, но не меняется ничем: ни диалогом выбора, ни перетаскиванием, ни кнопками — они в этом состоянии не рендерятся. Кнопка выбора остаётся в таб-порядке и объявляет aria-readonly: поле должно быть достижимо с клавиатуры и уметь объяснить, почему не поддаётся.

Отличие от disabled: тот выключает и саму кнопку, то есть поле выпадает из обхода целиком.

Те же ограничения можно объявить правилом формы — рядом с остальными:

const rules: GrFormRules = {
  contract: [{ required: true, file: { accept: '.pdf', maxSizeMb: 1 } }],
}

Проверку ведут те же валидаторы, поэтому текст ошибки не меняется — меняется момент: правило поля не пускает плохой файл в модель сразу, правило формы отбивает submit и попадает в invalid и в скролл к первой ошибке. Подробности и полный список ключей — GrForm.md.

Типичное разделение: ограничения в rules, а на поле accept как фильтр диалога выбора.

Загрузки на сервер: GrFormFile — поле формы, файлы уходят вместе с ней. Прогресс и отмену закрывает GrFileUpload.