Text area
Figma
Text area — текстовое поле ввода в несколько строк.
Из чего состоит
  1. Поле ввода
  2. Скроллбар
  3. Внешний лейбл
  4. Внутренний лейбл
  5. Основной текст
  6. Подсказка
  7. Описание под полем
  8. Ошибка
Основные
Отключаемые
Редактируемые
Основные свойства
Тема (Theme)
Состояние (State)
Размер (Size)
Вид (View)
Форма (Form)
Отключаемые элементы
👁 Внешний лейбл (Outside Label)
👁 Внутренний лейбл (Inside Label)
👁 Текст (Text)
👁 Подсказка (Placeholder)
👁 Описание (Description)
👁 Ошибка (Error)
👁 Скроллбар (Scrollbar)
Редактируемые элементы
✏️ Внешний лейбл (Outside Label)
✏️ Внутренний лейбл (Inside Label)
✏️ Текст (Text)
✏️ Подсказка (Placeholder)
✏️ Описание (Description)
✏️ Ошибка (Error)
Поле ввода и подсказка
Подсказка исчезает при нажатии на поле ввода и заполняется основным текстом.
Ошибка
Сообщение об ошибке появляется, когда нарушается валидация. Текст сообщения устанавливается для каждого нарушения. Одновременно может быть выведено несколько сообщений об ошибке. Каждое новое сообщение начинается с новой строки. Состояние инпута меняется на “State = Error”.
Минимальная ширина
Минимальная ширина Text Area - 296px.
Скроллбар
Отсутствует по умолчанию и появляется, когда высота введенного текста превышает высоту поля ввода.
По ширине контейнера
Text Area можно растягивать в ширину под внешний контейнер.
Внутренние горизонтальные отступы (View = Underline)
Можно отключать внутренний отступ в поле при выборе view “underline”