Skip to content

Состояния и скелетоны

ts
import { StateBlock, Callout, EmptyState, BusyOverlay, FullscreenDimmer, LoadingState, OverlayWaitPanel, ProgressBar, Skeleton, SkeletonText, SkeletonAvatar, SkeletonListRow, SkeletonEntityCard, SkeletonGrid, SkeletonFeedPost } from '@rynt/sdk';

Состояния

КомпонентОписание
StateBlockБлок-заглушка для любого состояния
CalloutИнформационный блок. variant: 'info' | 'warning' | 'error'
EmptyStateПустое состояние с иконкой, текстом и действием
BusyOverlayОверлей загрузки
FullscreenDimmerЗатемнение на весь экран
LoadingStateКомпактное состояние загрузки
OverlayWaitPanelПанель с индикацией ожидания
ProgressBarИндикатор прогресса

Скелетоны

Скелетоны — пульсирующие заглушки, которые показываются, пока данные загружаются.

КомпонентОписание
SkeletonБазовый блок. width?: string, height?: string
SkeletonTextСтроки текста (1–3), последняя короче
SkeletonAvatarКружок аватара. size: 'sm' | 'md' | 'lg'
SkeletonListRowСтрока: аватар + два блока текста
SkeletonEntityCardКарточка сущности: миниатюра + текст
SkeletonGridСетка карточек. count (default 8), cols (default 3)
SkeletonFeedPostПост в ленте: баннер + текст