Status Bar
The uptime bar — one thin column per slice of time, coloured by what happened.
Loading documentation…
Powered by heyo
StatusBar is the uptime strip from a status page: one column per slice of
time, oldest on the left, coloured by what happened.
The columns flex rather than sitting at a fixed width, so ninety days fit a sidebar and a phone without a horizontal scrollbar or a media query. The gaps stay 2px, which is what keeps it readable as ninety things rather than one smear.
Everything worked.
Slow, retried, partially failing.
Some components down, others fine.
Not serving.
Planned, and therefore not a failure.
No data for that slice — not the same as "fine".
StatusBar.Dot is the current state, on its own. pulse adds a slow halo —
only ever for now, never for history: a pulsing dot in a list of past events
suggests something is still happening.
Oldest first, newest last — the same direction as the time axis. Each tick
is { status, label? }, where label becomes the native tooltip.
The row above the bar.
Right of the label — usually an uptime percentage.
Captions under the two ends, for example "90 days ago" and "Today".
Column height. It defaults to base.
What it is reporting.
Adds a slow halo. Only for the current state.
What the dot means, rendered beside it.