Temporary — a placeholder page. Alpha does not publish what it describes, so read it as a sketch rather than a reference.
Patterns / Data display
Data display
How Alpha surfaces carry tabular and summary content — a card wrapping a table, a value with its delta, a row of tags. The components are published; the arrangements shown here are markup this site owns.
Illustration — not a published component
| Package | Version | Status | |
|---|---|---|---|
| @growth-protocol-ai/alpha | 0.1.0 | Published | |
| @growth-protocol-ai/alpha-docs | private | Never published |
The table, its badges and the row grid belong to this site. Everything around them is the package: the container is a real Card at variant="table", the filter and the page-size selector are Dropdown, and the row actions are Button.
The badges are the interesting exception, because the package now does ship something badge-shaped. A status cell like this one is exactly what Tag is for — an informative xsmall, outlined, no glyph — except that these two carry a dot and a colour that means something, and Tag has neither: its semantic types are specified and deferred. So they stay local, and when Success, Warning and Alert arrive the right change is to delete them rather than to extend them.
A table needs an outline and must not draw one of its own, or the page ends up with two outline languages side by side. So it goes in the container the system already has. The card drops its padding to zero so the row separators run edge to edge, and the filter lives inside it, because a control that filters a table is part of that table rather than an unrelated block floating above it.
Row actions are outlined at the default regular height, which is the height the dropdown trigger shares — so a filter bar and an action column line up without anyone measuring. It also keeps the data the loudest thing on the row. The page-size selector is ghost for the same reason in reverse: a bordered control in a table footer competes with the table.