Компонент Skeleton Loader для Angular | ng-hub-ui-skeleton

Skeleton-заглушки загрузки для Angular с переиспользуемыми пресетами, инлайн-шаблонами DSL, адаптивными значениями и CSS-переменными для состояний shimmer.

Интерактивные примеры

Изучите живые примеры, показывающие, как библиотека ведёт себя в типичных сценариях использования Angular.

Встроенный preset card

Галерея каталога presets

card

Content card with media, title and body lines.

list-item

Compact row with avatar and text.

table-row

Tabular data row placeholder.

detail-view

Detail screen with media and metadata.

form-section

Form group with responsive fields.

dashboard-widget

Panel with chart or metric content.

stat-card

Quick KPI summary card.

chart-panel

Large chart region with legend rows.

profile-summary

Profile hero with avatar and stats.

master-detail

List and detail layout together.

kanban-card

Small board card loading state.

feed-item

Activity or timeline row.

search-result

Search result with metadata lines.

table-toolbar

Toolbar with title, filters and actions.

filter-bar

Row of filter controls.

empty-state-skeleton

Illustrative empty or onboarding state.

card

Dense card variant for tighter layouts.

Inline-шаблон в стиле Emmet

Паттерны компактного DSL

Structure

`+` creates siblings and `>` nests children.

Params & repeats

Use {{param}} placeholders and *N repeaters to scale rows quickly.

Responsive values

Switch spacing or columns inline with compact breakpoint tokens.

Программный пользовательский preset

Адаптивная раскладка таблицы

Компактный вариант

Композиция dashboard