Placeholder

Компонент для отображения заглушек при отсутствии контента или ошибках. Обеспечивает единый стиль для пустых состояний интерфейса.

Загружается...

Используется когда:

  • Нет других элементов на экране;
  • Нужно акцентировать внимание на состоянии;
  • Требуется центральное позиционирование.

Чтобы отобразить несколько кнопок, в свойство action можно прокинуть несколько кнопок обернутых в ButtonGroup:

Загружается...
  • Используйте outline иконки (иконки с префиксом Outline в @vkontakte/icons).
  • Используйте кнопки размера l.
  • Режимы кнопок primary или tertiary.
  • Не используйте вместе с другим контентом при stretched=true.
  • Избегайте небольших иконок (меньше 56px).
  • Не размещайте интерактивные элементы нигде, кроме action.

Компонент можно использовать в подкомпонентном подходе:

Загружается...
СвойствоОписание
actionReactNode

Кнопка действия.

По умолчанию: -
getRootRefRef<HTMLDivElement>
По умолчанию: -
iconReactNode

Иконка.

По умолчанию: -
noPaddingboolean

Убирает отступы у компонента.

По умолчанию: false
stretchedboolean

Растягивает плейсхолдер на весь экран, но в таком случае на экране должен быть только плейсхолдер.

По умолчанию: -
titleReactNode

Заголовок плейсхолдера.

По умолчанию: -
СвойствоОписание
getRootRefRef<HTMLDivElement>
По умолчанию: -
noPaddingboolean

Убирает отступы у компонента.

По умолчанию: false
stretchedboolean

Растягивает плейсхолдер на весь экран, но в таком случае на экране должен быть только плейсхолдер.

По умолчанию: -
СвойствоОписание
getRootRefRef<HTMLDivElement>
По умолчанию: -
СвойствоОписание
ComponentElementType<any, keyof IntrinsicElements>
По умолчанию: -
getRootRefRef<HTMLElement>
По умолчанию: -
СвойствоОписание
ComponentElementType<any, keyof IntrinsicElements>
По умолчанию: -
getRootRefRef<HTMLElement>
По умолчанию: -
СвойствоОписание
getRootRefRef<HTMLDivElement>
По умолчанию: -