AI Agent Activity
A timeline component for tracking AI agent reasoning, tool calls, API queries, database fetches, and execution states with inspectable parameters and results.
Status:Running trace
Activity
Running
/
Analyze request
42ms
Resolve intent, dependencies, and token references.
Parameters
{
"query": "Build a minimal agent activity timeline"
}
Output Result
{
"status": "Verified",
"steps": 5
}
Search tokens
94ms
Resolve design tokens for border, surface, and motion.
Check registry
142ms
Verify component schema against local catalog.
Type check
310ms
Validate TypeScript types and strict null checks.
typescript
export interface AgentActivityItemData {
id: string;
title: string;
status: 'pending' | 'running' | 'success';
duration?: string;
}Output Result
{
"errors": 0,
"warnings": 0
}
Generate output
Active
Format output and render interactive view.
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/ai-agent-activity
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| activities | AgentActivityItemData[] | [] | Array of activity steps representing the agent execution plan and execution trace |
| isRunning | boolean | false | Indicates whether the agent is currently executing steps in the background |
| title | string | 'Activity' | Title displayed in the activity header |
| agentName | string | undefined | Optional agent or pipeline name displayed beside the title |
| defaultExpandedIds | string[] | [] | IDs of activity items that should start in an expanded state |
| className | string | undefined | Custom Tailwind class names for styling overrides |