Loading states (skeletons, nav progress)
Generated from
pattern-library/registry.json— do not edit by hand; change the registry and runbun run patterns:build.
Index card — the docs below are the canonical explanation; deep-tier pattern pages additionally carry invariants and emulation notes.
Category: App Shell & Navigation · Tier: light · Maturity: proven (verified 2026-08-20 @ 1a130d67) · Risk: low — structural pattern, no external services
Defines visual feedback for initial load, navigation, data fetch, action, and streaming states using skeleton screens and a navigation progress bar.
When to use: Reach for it when a page or component needs perceived-performance feedback while data or a route is loading.
Docs
Code
src/lib/components/primitives/skeleton/(GitHub · GitLab)src/lib/components/shell/NavigationProgress.svelte(GitHub · GitLab)
Proof
/showcases/ui/components/primitives— Skeleton variants in the data-display section
Machine-readable record: app-shell-loading-states in pattern-library/registry.json.