Toggle Sidebar B
AppearanceLight & dark mode D

Call Chip

Inline tool-call chip whose fill wipes across while a live ms counter ticks, completing with a green wash on success or stopping short and shaking red with a retry glyph on error.

Default

The chip runs, then resolves. Replay it from the corner button, or pick a status by hand. A failed chip with a retry listener is a button.

Dark previewReplay previewOpen in new tab

Customize

Status
Icon
Ink
Surface
Progress
Done
Error
Size34px
Radius10px
Progress Opacity0.08
Expected Time2500ms
Wash0.14
Shake6px

API Reference

CallChip

PropTypeDefaultDescription
icon'terminal' | 'file' | 'search' | 'edit''terminal'The tool glyph. It rolls out when the call resolves. Use the icon slot for a custom one.
namestring'bash'The tool name.
argumentstring'npm test'The argument.
status'idle' | 'running' | 'done' | 'error''running'Running wipes the fill across and ticks the counter. Done completes it with a wash. Error stops it, tints and shakes.
expectedMsnumber2500Milliseconds the fill takes to reach its 90% park, the time you expect the call to take.
sizenumber34Chip height in pixels. Font, padding and glyph follow.
radiusnumber10Corner radius in pixels. Half the height is a pill.
colorstring'currentColor'Ink for the text and the tool glyph.
surfaceColorstring'#27272a'The chip surface.
progressColorstring'currentColor'The fill that wipes across while running.
progressOpacitynumber0.08How strong that fill is.
doneColorstring'#22c55e'The success wash and the check.
errorColorstring'#ef4444'The stopped fill and the retry glyph on error.
washOpacitynumber0.14Strength of the success wash and of the error tint.
shakenumber6Error shake amplitude in pixels. 0 tints only.
showTimerbooleantrueShows the millisecond counter.
EventDescription
retryWhen a listener is set, the failed chip becomes a retry button that emits this.
SlotDescription
iconReplaces the tool glyph.

Accessibility

Keyboard shortcuts and ARIA behavior.

  • The chip is a status region. A hidden line announces the call and its outcome, with the time it took.
  • The visible text is hidden from screen readers so the announcement is not read twice.
  • With prefers-reduced-motion the glyph swaps without rolling, the wash fades instead of wiping and the counter updates ten times a second.