Migrate to V2

Overview

CopilotKit V2 consolidates the frontend into a single package. Both hooks and UI components are now exported from @copilotkit/react-core/v2. Your backend does not need any changes.

What's changing:

BeforeAfter
@copilotkit/react-core@copilotkit/react-core/v2
@copilotkit/react-ui@copilotkit/react-core/v2
@copilotkit/react-ui/styles.css@copilotkit/react-core/v2/styles.css

What's NOT changing:

  • Backend packages (@copilotkit/runtime, etc.) — no changes needed
  • Your CopilotRuntime configuration — stays the same
  • Agent definitions and backend setup — stays the same

Migration Steps

Update @copilotkit/react-core imports

Replace imports from @copilotkit/react-core with @copilotkit/react-core/v2.

Before



After



Replace @copilotkit/react-ui imports

UI components like CopilotChat, CopilotSidebar, and CopilotPopup are now exported from @copilotkit/react-core/v2.

Before




After




Update your styles import

Before

After

Upgrade @ag-ui/client (if using directly)

If you import from @ag-ui/client directly, upgrade to the latest version:

npm install @ag-ui/client@latest

Note: If you only use CopilotKit's React packages, @ag-ui/client types are already re-exported from @copilotkit/react-core/v2 and you don't need a separate install.

Full Example

Before





export function App() {
  return (
    <CopilotKit runtimeUrl="/api/copilotkit">
      <YourApp />
      <CopilotPopup />
    </CopilotKit>
  );
}

After




export function App() {
  return (
    <CopilotKitProvider runtimeUrl="/api/copilotkit">
      <YourApp />
      <CopilotPopup />
    </CopilotKitProvider>
  );
}
2087950ee