Acp Components

acp-components

Production-ready React components and a framework-agnostic core for building Agent Client Protocol (ACP) clients.

Try the live demo · Quick start · Architecture · 中文

Build a complete agent workbench instead of assembling another chat box. The library includes multi-agent and multi-session orchestration, streaming, tool calls, permissions, plans, file browsing, diffs, skills, settings, and desktop-ready transports.

- Complete workbench — Start with WorkbenchShell, then replace or extend individual views as your product grows.
- Real ACP lifecycle — Handle sessions, streaming updates, tool calls, permissions, authentication, and usage through one typed data layer.
- Host and framework independent — Use the React UI on the web or in Tauri, or use @acp-components/core with Vue, Svelte, Solid, or vanilla TypeScript.

Run the interactive browser demo with the default local ACP agent:

Open http://localhost:5173. This starts both the WebSocket bridge and the Vite demo; see Web Demo to use Codex, Claude, or another ACP agent.

Features

- Multi-Agent — Connect to multiple ACP agents simultaneously, each with independent transport, capabilities, and session management. User-added agents are persisted to storage('agents') and restored on next launch; built-in (host-supplied) agents are never user-removable
- Multi-Workspace — Organize sessions by working directory (cwd); switch between workspaces seamlessly. Workspace list is persisted to storage('workspaces') via the built-in  driver
- Multi-Session — Run and view multiple sessions side-by-side in resizable split panes; each session has fully isolated state (messages, streaming, tool calls, permissions). Per-session chunk batching keeps concurrent streams independent
- Framework-Agnostic Core — Zustand…