copilotkit-develop

Wrap your app in CopilotKitProvider with a runtimeUrl pointing to your endpoint, then render CopilotChat, CopilotPopup, or CopilotSidebar with an agentId. The provider handles the connection to the runtime and agent.

Use the useFrontendTool hook with a name, description, a Zod parameters schema, and a handler function. The agent can then invoke the tool in the browser, and the hook re-registers when the name, availability, or dependencies change.

Create app/api/copilotkit/[[...path]]/route.ts, instantiate CopilotRuntime with your agents, call createCopilotEndpoint with basePath /api/copilotkit, and export app.fetch as the GET, POST, PATCH, and DELETE handlers.

Yes, createCopilotEndpointExpress returns an Express router with all CopilotKit routes mounted under your basePath. Mount it with app.use() after creating a CopilotRuntime with your agents.

Use useInterrupt with a render function that receives the interrupt event and a resolve callback, or useHumanInTheLoop for a tool that pauses execution until the user responds via a rendered UI with a respond callback.

Yes, pass a labels prop to CopilotChat with keys like chatInputPlaceholder, welcomeMessageText, and modalHeaderTitle. Slot-based props also let you replace sub-components such as the input, message view, and welcome screen.