Component gallery

PageSkeleton

The shape of the page that is coming, drawn while it loads: a toolbar over rows, or cards at heights you measured, so nothing jumps when data lands.

An index route

layout='list': a toolbar over table rows, the shape of a jobs or files page. Rows cascade rather than pulsing in lockstep, so a long list does not strobe.

A detail route, measured

layout='cards' with heights taken off the live page. Speedway's files route resolves to three cards; its modules route to one of 190px and one of 872px. A generic card would promise a shape that never arrives.

The header that does not move

Pass the page's REAL header from both sides. A static title drawn as grey bars is a worse version of something already in hand, and the top of the page redraws the moment data lands.
WorkspaceSupplier filesEvery file this workspace has ingested.

Chrome held open

headroom reserves the space a dropzone or filter bar occupies above the first card. At 32px and up it draws a soft stand-in where the real control lives, so the gap reads as loading rather than neglect.
@versable-git/ui · all states, both themes