Skip to content

components/bits/StatusChip#

StatusChip()#

function StatusChip(props): Element;

The generic status pill, driven by the same statusToToken() as StatusDot.

Deliberately not a MUI <Chip>: Chip's own padding, height and delete-icon slots are more machinery than a read-only status badge needs, and its color="success" prop was one of the sources of the drift this replaces.

Note there is also a ScheduleStatusChip in components/schedule/. That one is domain-specific — it derives a schedule's state from executions, jobs and the dirty flag, and owns its own six-state copy. It is a consumer of this vocabulary, not a duplicate of it: this component is the generic renderer.

Parameters#

Parameter Type
props StatusChipProps

Returns#

Element


StatusChipProps#

Properties#

dot?#

optional dot?: boolean;

Leading status dot. On by default; the dot is what carries the meaning.

icon?#

optional icon?: ReactNode;

Leading glyph, replacing the dot.

label?#

optional label?: ReactNode;

Chip copy. Defaults to the status word itself, title-cased.

pulse?#

optional pulse?: boolean;

Pulse the dot, for in-flight states.

status#

status: string;

A tone, or a raw backend status word normalised by statusToToken.

sx?#

optional sx?: any;

variant?#

optional variant?: "soft" | "solid" | "outline";

soft (default) is a tinted pill — quiet enough to sit in a list row. solid is the loud one; reserve it for the single most important status on a surface. outline is for dense tables where a fill would stripe.