VKUI icon indicating copy to clipboard operation
VKUI copied to clipboard

[Feature] Добавить поле `status` для FormField

Open SevereCloud opened this issue 1 year ago • 3 comments

Для компонентов ввода задать статус можно только через FormItem, но нельзя задать отдельно(например когда поля сгруппированы)

SevereCloud avatar Jul 29 '22 11:07 SevereCloud

Думаю стоит удалить возможность передавать status в FormItem, пусть FormField умеет.

Кажется status появился у FormItem как раз для того, чтобы избежать проброса status в каждый компонент, который использует FormField внутри себя.


Если оставить так, то пользователь будет сталкиваться с проблемой

<FormItem top="Введите ФИО" status="valid">
  <InputGroup>
    <Input defaultValue="Иванов" status="error" /> // "valid" на FormItem перекроет этот статус
    <Input defaultValue="Иван" />
    <Input defaultValue="Иванович" />
  </InputGroup>
</FormItem>

по идее он сам догадается как поправить, но всё же не очень хорошо, что такое возможно

inomdzhon avatar Aug 01 '22 07:08 inomdzhon

Думаю стоит удалить возможность передавать status в FormItem, пусть FormField умеет.

Кажется status появился у FormItem как раз для того, чтобы избежать проброса status в каждый компонент, который использует FormField внутри себя.

status в FormItem не только влияет на FormField, но и изменяет цвет у bottom текста

image image

SevereCloud avatar Aug 01 '22 07:08 SevereCloud

Думаю стоит удалить возможность передавать status в FormItem, пусть FormField умеет. Кажется status появился у FormItem как раз для того, чтобы избежать проброса status в каждый компонент, который использует FormField внутри себя.

status в FormItem не только влияет на FormField, но и изменяет цвет у bottom текста

image image

Я чуть не написал параметр caption у FormField, НО! Меня осенило...

По идее у нас не должно быть отдельных компонентов InputGroup, SelectGroup и подобных. У нас есть FormLayoutGroup, который умеет группировать FormItem. Вот он пусть продолжает всем этим заниматься.

Создавая компоненты такие как InputGroup (#2869) мы куда-то не туда идём. Вот пример UI из PR:

image
  1. В блоке Введите ФИО, если я захочу показать текст ошибки, то мне надо будет динамически менять <FormItem bottom="<текст_ошибки>">. Надо будет также динамически менять aria-describedby, чтобы скринридер понимал к какому полю относится ошибка.
  2. В блоке Выберите дату рождения тоже самое. Но если использовать на FormLayoutForm с FormItem, то будет отдельная ошибка для каждого поля ввода.

Это "слипание" можно только для горизонтального режима включить в FormLayoutGroup.

В общем вкину всё выше написаное на созвоне дизайнерам.

inomdzhon avatar Aug 01 '22 08:08 inomdzhon