CopilotKit

Overview

Reference documentation for the CopilotKit SDKs. Pick the SDK you're building with, then browse its components, hooks, classes, and types.

Choose your SDK

React

Hooks and components for building CopilotKit into a React app.

React Native

Headless provider, prebuilt UI, and hooks for building CopilotKit into a React Native app.

Vue

Composables and components for building CopilotKit into a Vue app.

Angular

Components, services, and functions for building CopilotKit into an Angular app.

Core (TypeScript)

The framework-agnostic @copilotkit/core client — runs anywhere JavaScript runs.

Bots

The bot stack — createBot, JSX message components, and the Slack adapter.

UI Components

<CopilotChat />

High-level chat component that connects an agent to a chat view

<CopilotChatAssistantMessage />

Component for displaying assistant messages with Markdown, tool calls, and an action toolbar

<CopilotChatInput />

Primary text input and control surface for chat interactions

<CopilotChatMessageView />

Component for rendering a list of chat messages

<CopilotChatUserMessage />

Component for displaying user-authored messages with branch navigation

<CopilotChatView />

Layout component that combines a scrollable transcript with the input area

<CopilotKit />

The CopilotKit provider component, wrapping your application.

<CopilotPopup />

Popup variant of CopilotChat that renders in a floating panel with a toggle button

<CopilotSidebar />

Sidebar variant of CopilotChat that renders in a fixed side panel

Hooks

useAgent()

React hook for accessing AG-UI agent instances

useAgentContext()

React hook for providing dynamic context to agents

useCapabilities()

React hook for reading an agent's declared capabilities

useComponent()

Register a React component as a frontend tool renderer in chat

useConfigureSuggestions()

React hook for configuring chat suggestions

useCopilotChatConfiguration()

React hook and provider for chat UI configuration and labels

useCopilotKit()

Low-level React hook for accessing the CopilotKit context

useDefaultRenderTool()

Register a wildcard default renderer for unhandled tool calls

useFrontendTool()

React hook for registering client-side tool handlers with optional UI rendering

useHumanInTheLoop()

React hook for interactive tools that pause agent execution and wait for user input

useInterrupt()

React hook for handling agent interrupt events and resuming execution with user input

useRenderTool()

Register typed renderers for tool calls, by tool name or wildcard

useRenderToolCall()

React hook that returns a renderer function for tool calls in the chat interface

useSuggestions()

React hook for accessing chat suggestions

useThreads()

React hook for listing, managing, and syncing conversation threads with useThreads — rename, archive, delete, and paginate threads with realtime updates via WebSocket.