Agent UI Kit

Overview

Agent UI Kit, now published as signoff-ui (formerly @dgesteves/agent-ui-kit), is an MIT-licensed set of React components for teams putting a coding agent inside their own app. Its core is sign-off: reviewing the agent's edits across files hunk by hunk, and approving or denying tool calls with rules the server route checks again.

The components render what the agent already streams and never call a model themselves, so any provider works. They are typed against AI SDK 6 and 7, tested on React 18 and 19 in CI, and also connect to AG-UI agents, the Agent Client Protocol and assistant-ui. The registry ships 13 components and hooks, and a reference app runs a full scripted agent session without an API key.

Features

• DiffReview: Multi-file, per-hunk review with unified or split views, comments and full keyboard control.
• ApprovalCard: Approve or deny a tool call once, for the session or always, with risk level and a reason the agent reads.
• useApprovalPolicy: Approval rules by tool and argument pattern, with an audit trail and server-side parsing.
• AgentMessage: Reasoning, streaming markdown, grouped tool calls, inline approvals and sources in one message.
• ToolCallTimeline: Every tool call with state, duration and a waterfall, with sub-agents nested under their parent call.
• RunMeter and AgentStatus: Tokens, estimated cost, time to first token, cache hit rate and a live status pill.
• Protocol adapters: useAgUiAgent for AG-UI integrations such as LangGraph and Mastra, plus ACP helpers.

Tech stack

• React 18 and 19
• AI SDK 6 and 7, AG-UI, ACP, assistant-ui
• Radix UI, react-markdown, diff
• Tailwind CSS

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @agent-ui-kit/component-name