Tool call
Tells you what the assistant did, one short line per step.
Examples
Move $50 to Vacation fund.
Done: Moved $50 to Vacation fund
Running: Finding transactions1 of 2
Failed: Move failedLow balance
Status
- Running: Moving $50 to Vacation fund
running
- Done: Found 12 matching transactions
done
- Failed: Could not move moneyLow balance
failed
Detail
- Done: Split the bill three ways
unsetdefault
- Running: Splitting the billStep 2 of 3
a string
Usage
When to use it
- Use
- A step the assistant ran between a request and its answer: a search, a transfer, a lookup.
- Use
- A list of steps or checks in order, one line each, such as the checks before a payment.
- Use
- A failure the person can act on, with the reason.
- Not for
- The state of a job in a list, such as a payment in your activity. Use Status.
- Not for
- The assistant's answer. Use Message.
- Not for
- A notice or banner. Use an alert.
Rules
7 rules
- Must
- Name the real step; never "Thinking". Because Thinking gives the person nothing to check or stop before money moves.
- Must
- Put the failure reason in detail. Because without it the person cannot tell whether to top up, retry or give up.
- Must
- Use present tense while running and past tense after. Because a done check beside Moving reads as a transfer still in flight.
- Never
- Wrap each step in a card with a title bar or chevron; keep the single line. Because a card per step pushes the assistant's answer below a stack of panels.
- Must
- Put steps that appear while waiting in a container with aria-live="polite". Because each row is role="status", but a live region added after load is not announced.
- Should
- Keep the label short with the key words first; it truncates to one line with no tooltip.
- Should
- Add a position such as "Step 2 of 3" in detail on a step that runs long.
Accessibility
4 checks
- Each row is role status with a hidden state word (Running, Done, Failed) before the label.
- A change of state is announced politely.
- The spinner keeps turning under reduced motion; the marks swap at once.
- Failed is told by the warning shape and the word, not color alone.
Edge cases
6 edge cases
- Long label
- Truncates with an ellipsis; the full text is not reachable.
- Narrow container
- The detail truncates first so the label stays whole; the mark stays 16px.
- Right to left
- The mark sits at the start and the detail at the end.
- Reduced motion
- The spinner keeps turning by design.
- Empty label
- Only the mark draws; do not render it.
- Status swaps
- The mark changes at once with no layout shift.
API
3 props
status'running' | 'done' | 'failed'defaultrequiredlabelstringdefaultrequireddetailstring
Tokens
10 tokens
--surface- #f6f5f2
--radius-field- 12px
--text-sm- 14px
--fg- #0f0f0d
--weight-medium- 500
--danger-text- #b42323
--success-text- #17703a
--fg-2- #4a4943
--fg-3- #6b6a63
--dur-spin- 900ms