React · SwiftUI · agent guides
LED and status badge
A 4–5 pt LED lit from the top left (green live, amber waiting, red failed, blue link, off), and the 24 tall status badge: an LED and the state in the label role, not pressable, with the fixing command as a tooltip.
Use it for
- Led: beside words that name a state (a badge, a readout, an engraving, a glass tag). Green live or ok, amber waiting or urgent, red failed, blue a link kind, off idle.
- StatusBadge: a system state in the corner: JEV LIVE, JEV OFFLINE · ADD KEY TO KEYCHAIN, JEV · NO CONNECTION, with the command that fixes it as its hint.
Don't use it for
- Buttons or toggles. A badge is not pressable; a latched tool has its own LED inside the tool button.
- Colour alone. An LED always sits beside words.
- Success or warning banners. Use a toast (success always carries a check) or a notice.
Read the LED and status badge agent guide · Copy registry source