feat(doc): validation update doc

packages/mosaic/core/validation/validation.md

@@ -1,106 +1,81 @@
-Хорошо спроектированный интерфейс помогает пользователю не совершать ошибок, а когда они возникают, валидация помогает верно исправить ошибку. В этом гайде разберем, что для этого нужно делать.
-
 <br>
 <div class="mc-alert mc-alert_warning">
     <i class="mc mc-icon mc-error_16 mc-alert__icon"></i>
     Все описанные ниже рекомендации не применяются к форме входа.
 </div>
 
-
-### Способы валидации
-От хорошего к более плохому:
-- защититься от ошибки,
-- показывать под полями,
-- показывать над формой.
-
-#### Как защититься от ошибки
-Примеры, когда интерфейс не даёт совершить ошибку
+Хорошая практика — сделать так, чтобы валидация вообще не понадобилась. Ниже примеры, когда интерфейс не позволяет пользователю совершить ошибку.
 
 | <span class="mc-error">Плохо<span> | <span class="mc-success">Хорошо<span> |
 |---------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| Сообщать «Название обязательно» | Блокировать кнопку, пока не задано название |
-| Сообщать «Название невалидно» | Автоматически заменить пробелы на _, чтобы все было валидно |
-| Сообщать «Введите число» | Использовать контролы ввода чисел |
+| Сообщать, что поле ввода обязательно для заполнения | Блокировать кнопку отправки формы до тех пор, пока поле не заполнено |
+| Сообщать, что в поле введены неподходящие данные | Преобразовать введенные данные в корректные. Например, автоматически заменить все пробелы на знак подчеркивания |
+| Заранее сообщать, какие данные нужно вводить в поле | Использовать контрол, которые не позволяет вводить неправильные данные. Например, специальное поле для ввода чисел |
 
 ### Когда проверять на ошибки
 Есть три способа проверить верность введенных значений:
 
 1. Во время ввода значения
-2. По уходу с поля (потере фокуса)
+2. По уходу с поля (по потере фокуса)
 3. После отправки формы
 
 #### Во время ввода значения
-Иногда можно предотвратить неверный ввод значений, в таких случаях нужно запрещать ввод определённых символов, например букв в IP-адрес или в другой числовой формат. В этом случае запрещенные символы не вводятся и показывается желтый тултип на 3 секунды, после этого скрывается.
+В тех случаях, когда заранее известно, какие символы точно не подходят для ввода в поле, мы можем предотвратить ввод некорректных значений. Для этого нужно запрещать ввод определенных символов, например букв в IP-адрес. При этом запрещенные символы не вводятся и показывается желтый тултип.
 
 <!-- example(validation-on-type) -->
 
-##### Диапазоны значений
-Делайте так, чтобы нельзя было задать неправильно. Например, при вводе периода можно менять местами значения «С» и «По», если значение в «По» будут указаны раньше значения в «С».
-
-#### По уходу с поля
-Проверка на верность введеных значений в поле выполняется по потере фокуса (onblur), поля получают состояние ошибки. Поля получают нормальное состояние по изменению значения (onchange).
+#### По уходу с поля (по потере фокуса)
+Если требования к значениям в поле относительно сложные (например, это IP-адрес или адрес эл. почты), то поле не должно получать состояние ошибки во время ввода, чтобы не сбивать пользователя с толку. Валидация в таких случаях выполняется по потере фокуса. Поле возвращается к нормальному состоянию после изменения значения.
 
 Если у поля есть подпись, то текст ошибки выводится под подписью
 
 <br>
 <div class="mc-alert mc-alert_warning">
     <i class="mc mc-icon mc-error_16 mc-alert__icon"></i>
-    Пустые обязательные поля по onblur не получают состояние ошибки
+    Пустые обязательные поля не получают состояние ошибки по потере фокуса.
 </div>
 
 <!-- example(validation-on-blur) -->
 
 ##### Составные поля
-Если поля нуждаются в валидации [во время ввода значения](/validation/overview#Во-время-ввода-значения) или [по уходу с поля](/validation/overview#По-уходу-с-поля), то сначала выполняются эти проверки. После того как все значения валидны, срабатывает валидация на все поля, поля выделятся фоном и внизу пишется сообщение об ошибке.
+Когда значения в нескольких полях тесно связаны между собой (например, края диапазонов), нужно проверять их все вместе. Для этого нужно сначала отдельно проверить все поля [во время ввода значения](/validation/overview#Во-время-ввода-значения) и [по уходу с поля](/validation/overview#По-уходу-с-поля). Если по-отдельности все значения валидны, срабатывает общая валидация на несколько полей: каждое поле не получает состояние ошибки, но все поля вместе выделяются фоном и внизу выводится общее сообщение.
 
 <!-- example(validation-composite) -->
 
 #### После отправки формы
 ##### Глобальная ошибка
-При самой аккуратной валидации отдельных полей всегда что-то может пойти не так: пропадет соединение с БД, другой пользователь изменит данные системы и т. д. Если ошибка возникла или выявилась после нажатия на терминальные кнопки и не связана с ошибками в полях, то такая ошибка показывается алертом над формой и страница прокручивается до алерта с ошибкой.
+При самой аккуратной валидации отдельных полей всегда что-то может пойти не так: пропадет соединение с БД, другой пользователь изменит данные системы и т. п. Если ошибка возникла после нажатия на терминальные кнопки и не связана со значениями в полях, то такая ошибка показывается алертом над формой и страница прокручивается до него.
 
-Такой алерт пропадает при повторной отправке или если ошибка исправлена. В остальных случаях он висит и не скрывается, давая пользователю информацию, что было не так.
+Такой алерт «висит» и не скрывается, давая пользователю понять, что было не так, — и пропадает при повторной отправке формы.
 
 <br>
 <div class="mc-alert mc-alert_info">
         <i class="mc mc-icon mc-info-o_16 mc-alert__icon"></i>
-    При повторной отправке формы все поля проверяются ещё раз. За время, пока пользователь дозаполнял форму, уникальность названия, например, могла пропасть.
+    При повторной отправке формы все поля проверяются еще раз. За время, пока пользователь дозаполнял форму, уникальность названия, например, могла пропасть.
 </div>
 
 <!-- example(validation-global) -->
 
 ##### Ошибки в полях
-Если не удалось сделать валидацию в полях во время ввода или по уходу с поля, то после отправки формы, страница прокручивается до первого поля с ошибкой и поле получает фокус.
+Если не удалось провести валидацию в полях во время ввода или по уходу с поля, то после отправки формы страница прокручивается до первого поля с ошибкой и оно получает фокус.
 
 <br>
 <div class="mc-alert mc-alert_warning">
     <i class="mc mc-icon mc-error_16 mc-alert__icon"></i>
-    Не блокируйте терминальную кнопку после отправки формы
+    Не блокируйте терминальные кнопки после отправки формы!
 </div>
 
 ### Обязательные поля
-По умолчанию подразумевается, что все поля обязательные, обязательность никак не помечается. А необязательные как раз подписываются (или в плейсхолдере, или в подписи под полем).
+Если большинство полей на форме — обязательные для заполнения, то эту обязательность не нужно помечать. Необязательные поля, наоборот, подписываются (или в плейсхолдере, или в подписи под полем).
 
 <br>
 <div class="mc-alert mc-alert_info">
         <i class="mc mc-icon mc-info-o_16 mc-alert__icon"></i>
-        Поля «комментарий», «описание» почти всегда необязательные, воспринимаются таковыми. Их можно не подписывать как необязательные.
+        Поля «Комментарий», «Описание» почти всегда необязательные и воспринимаются как необязательные. Их можно не подписывать.
 </div>
 <br>
 
-Состояние ошибки незаполненное обязательное поле получает только после отправки формы, в тексте ошибки сообщается (1), по каким причинам поле обязательно.
-
-*(1) Иногда текстом ошибки можно пренебречь, если из контекста формы понятно, что поле обязательно для заполнение или текст ошибки получается очень длинным.*
-
-Пустые обязательные поля не получают состояние ошибки при потере фокуса.
-
-<br>
- <div class="mc-alert mc-alert_dismissible">
-            <div>
-                <header>Совет</header>
-                Чтобы избежать проверки на незаполненность полей, можно использовать контролы с предустановленными значениями, которые нельзя оставить незаполненными (раскрывающийся список, радиокнопки)
-            </div>
-        </div>
+Незаполненное обязательное поле получает состояние ошибки только после отправки формы (пустые обязательные поля не получают состояние ошибки при потере фокуса). В тексте ошибки сообщается, по каким причинам поле обязательно. Иногда текстом можно пренебречь — если из контекста формы понятно, что поле обязательное, или если текст получается слишком длинным.
 
 <!-- example(validation-overview) -->
 
@@ -110,17 +85,15 @@
 <br>
 <div class="mc-alert mc-alert_warning">
     <i class="mc mc-icon mc-error_16 mc-alert__icon"></i>
-    В больших формах не рекомендуется блокировать терминальные кнопки, может быть неочевидно, почему кнопка отправки формы неактивна.
+    На больших формах не рекомендуется блокировать терминальные кнопки, потому что может быть совсем неочевидно, почему кнопка неактивна.
 </div>
 
 <!-- example(validation-small) -->
 
 #### Другие случаи
-Бывают случаи, когда нужно заполнить хотя бы одно из обязательных полей. В этом случае после отправки формы, обязательные поля не получают состояние ошибки, но выводится алерт.
-
-Текст алерта для каждого случая будет свой.
+Бывают случаи, когда нужно заполнить хотя бы одно из обязательных полей. В этом случае после отправки формы обязательные поля не получают состояние ошибки, но выводится алерт.
 
 <!-- example(validation-global-one-required) -->
 
 ### Показ сообщений об ошибках вне форм
-Иногда требуется показывать ошибки вне форм, например было запущено сканирование, но в процессе сервер вернул ошибку, в таком случае показывайте уведомление в центре уведомлений.
+Иногда требуется показывать ошибки вне форм, например если было запущено сканирование, но в процессе сервер вернул ошибку. В таких случаях лучше показывать уведомление в центре уведомлений.