useClaudeAgent
Free · MITWires a Claude Agent SDK server route to Candor: messages for <Thread>/<Message>, props for <Composer>, and the tool calls waiting on a person. The same shape as useCandorChat, so screens work with either.
const { messages, composer, approvals, respond } = useClaudeAgent({ api: "/api/agent", approveApi: "/api/agent/approve", agent }) <Thread footer={<Composer {...composer} />}>{messages.map((m) => <Message key={m.id} message={m} />)}</Thread>
Each message continues the same agent session (the SDK's resume). Mentions are sent as structured references, not pasted into the text.
Preview
It's types and helpers, listed below.
Install
First time? Get started sets up the registry and theme. Or with shadcn directly: npx shadcn@latest add @candor/use-claude-agent
Brings in: chat, claude-agent-sdk, composer
Functions
useClaudeAgent(options: UseClaudeAgentOptions)Wires a Claude Agent SDK server route to Candor: messages for <Thread>/<Message>, props for <Composer>, and the tool calls waiting on a person. The same shape as useCandorChat, so screens work with either.
const { messages, composer, approvals, respond } = useClaudeAgent({ api: "/api/agent", approveApi: "/api/agent/approve", agent }) <Thread footer={<Composer {...composer} />}>{messages.map((m) => <Message key={m.id} message={m} />)}</Thread>
Each message continues the same agent session (the SDK's resume). Mentions are sent as structured references, not pasted into the text.
Types
- UseClaudeAgentOptions
Omit<FromClaudeAgentOptions, "running"> & { /** Your route that runs the agent with streamClaudeAgent. It receives `{ prompt, promptId, references, sessionId, ...body }`. */ api: string /** * Your route that records an answer (answerClaudeApproval). It receives `{ id, approved, reason, updatedInput, * answers, alwaysAllow }` and returns `{ ok }`. Not needed with `onRespond`. */ approveApi?: string