Agent status

Six states. The three working states are deliberately monochrome and colour is held back for the states where it means something: waiting on a person, finished, failed. The terminal states fill the matrix solid, so the shape reads as done before the colour does.

Named choreographies over one 4×3 grid. Each dot is told which of the cycle's twelve slots it lights in, and the dots a pattern never lights opt out entirely, so a pattern is a sequence of numbers rather than its own animation. One grid and one cycle length means switching pattern never changes the indicator's footprint or its rhythm.

AgentStatusMark is the same dots at icon size, for a slot where a glyph would sit: a button’s icon, a tab, a list row. The grid is a 4×4 square sized by the icon scale and inset to a Material Symbol’s live area, so it swaps with a glyph without moving or reading larger than it. Every pattern above is redrawn for the square on the same twelve-slot cycle, and the states and colours are AgentStatus’s. Orbit is the default, and the one AI button shows while it works; waiting defaults to breathe, a still pulse that says it is the person’s turn.

While the agent is active a highlight sweeps the label left to right. It is the same treatment Reasoning uses on its summary, so “the model is working” looks the same wherever it appears. Turn it off with shimmer for a quieter row.

The bar variant is a full-width row for the top of a panel, where the status belongs to the whole surface rather than to a line of content.

The pill variant is a glass status for a run that goes on while the person keeps working: it floats over the page and reports each step. Once the run ends the dots fill solid in the status colour, and the label says what happened. An action after the text opens the run. The pill does not position itself; the host seats it.

The agent ring marks whatever the agent is working on: a section, a whole table, a row, a card, a field. It is a class and an attribute rather than a component, so it goes on any element, and agentRingProps(state) returns both. Working turns the AI gradient around the element, waiting breathes in the warning colour on the dots’ own cycle, and done and error show their status colour for a beat, then fade. It overlays the element’s edge, so nothing moves, and it takes the element’s corners. --ds-agent-ring-radius gives a square surface corners and --ds-agent-ring-offset stands the ring clear of a borderless one. A field takes it on its wrapper, since an input cannot draw one itself.

The working colours are deliberately quiet, and the status colours are spoken for. Every colour on the component routes through a custom property, though, so when several agents share a surface each row can take its identity from one of the core accent ramps: set --ds-agent-color and its label and sweep companions on the row, and the dots, the label, and the sweep all follow the accent.

The root is a polite live region and the matrix is hidden from assistive technology, so a state change is announced once as text rather than as twelve dots. Under reduced-motion preferences the matrix parks at a static, legible opacity and the sweep resolves to flat text. The meaning has to survive the animation being switched off, because for some readers it always is.