Components

StatusBadge

Shows a status from the shared status vocabulary, with a tone, an icon and text.

28 October 2026

Added

First version: StatusBadge, a badge built on Badge and driven by the status vocabulary.
statusVocabulary and StatusKey: twelve statuses (draft, pending, in-review, active, approved, completed, paused, cancelled, rejected, failed, expired, archived), each with a tone, an icon and text in both languages (ui.status.*).
size, variant (subtle, bold) and label.
An unknown status shows in the neutral tone with the raw code; it warns once in development.
When the status changes the badge is remounted and appears with motion.reveal.
announce: a hidden live region that announces a status change politely.