Agent Progress
A collapsible progress block for multi-step AI work. It introduces steps with a soft stagger, advances the active task with synchronized circular progress, preserves progress while minimized, and exposes completion timing for handing the UI back to an agent response.
Installation
Agent Progress is part of BoardUI Pro.
Dark mode ready — this component follows BoardUI semantic tokens automatically. Set up theme switching.
Custom steps
Pass any ordered list through steps. The block calculates its expanded height, countdown, active state, and overall progress from that list.
<AgentProgress steps={[ "Analyze the request", "Generate the component", "Run accessibility checks", "Prepare the response", ]}/>Timing and completion
Set the time per task with stepDuration. After the final checkmark, completionDelay controls how long the completed state remains before onFinished fires.
<AgentProgress steps={steps} stepDuration={2400} completionDelay={1000} onFinished={() => { sendAgentResponse(); }}/>