Skeletons

All skeletons live in src/lib/ui/skeletons/. They are used in Next.js loading.tsx files and Suspense boundaries to show structural placeholders while data is fetched. None accept props except GridSkeleton.

Component	File	Matches
ActivitySkeleton	activitySkeleton.tsx	Full activity detail page — centred card with a header block and several content rows.
Art30DeclarationSkeleton	art30DeclarationSkeleton.tsx	Article 30 GDPR declaration document — page header, subtitle, divider, and multiple body sections.
ChipSkeleton	chipSkeleton.tsx	Single chip — 80 × 20 px rounded rectangle. Used inline wherever a chip is expected while loading.
DocumentSkeleton	documentSkeleton.tsx	Generic document/article layout — max-width container with multiple text lines and section dividers.
GridSkeleton	gridSkeleton.tsx	Card grid — repeats a Paper + Card skeleton block number times. Pass number to match the expected item count.
TemplateEditorSkeleton	templateEditorSkeleton.tsx	Template editor — two-column layout with a title, a left-side editor area, and a right-side preview/info panel.