Skip to content
AI & AgentsPro

Agent Lane

One parallel worker: its status, queue, throughput and the tasks it holds.

Usage

Docs audit

Active

3 queued · 42/min

  • Checking page 38 of 122Running
  • Screenshot dark modeQueued

Figma sync

Saturated

18 queued · 96/min

  • Binding 214 variablesRunning
  • Rebuild the icon setsQueued
  • +16 more waiting

Releases

Idle

0 queued · —

Waiting for a free slot

Installation

bash
npm install @wunderui/react

Then import what you need:

tsx
import { AgentLane, AgentLaneStatus, AgentLaneTask } from "@wunderui/react"

In context

How the component is used inside real screens — the same compositions as the Usage section of the Figma page.

Scale across parallel workers

Agent lanes with their queues, the latest activity and how long each step took against its estimate.

Docs audit

Active

3 queued · 42/min

  • Checking page 38 of 122Running
  • Screenshot dark modeQueued

Figma sync

Saturated

18 queued · 96/min

  • Binding 214 variablesRunning
  • Rebuild the icon setsQueued
  • +16 more waiting

Releases

Idle

0 queued · —

Waiting for a free slot

Running: Comparing Figma and code tokenstokens.diff6.3s
Done: Read 214 variables from Figmafigma.read3.6s
Build the docs
8.3s
Check the stroke widths
12.4s

API Reference

PropTypeDefault
nameReactNode—
status"active" | "idle" | "saturated"—
queuenumber—
throughputnumber"—"
tasks{ id?: string; title: ReactNode; state?: ReactNode }[]—
morenumber—
emptyLabelReactNode"Waiting for a free slot"