@copilotkit/react-core 1.59.5 → 1.60.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@copilotkit/react-core",
-  "version": "1.59.5",
+  "version": "1.60.1",
   "private": false,
   "keywords": [
     "ai",
@@ -58,8 +58,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@ag-ui/client": "0.0.53",
-    "@ag-ui/core": "0.0.53",
+    "@ag-ui/client": "0.0.57",
+    "@ag-ui/core": "0.0.57",
     "@jetbrains/websandbox": "^1.1.3",
     "@lit-labs/react": "^2.0.2",
     "@radix-ui/react-dropdown-menu": "^2.1.15",
@@ -79,11 +79,11 @@
     "untruncate-json": "^0.0.1",
     "use-stick-to-bottom": "^1.1.1",
     "zod-to-json-schema": "^3.24.5",
-    "@copilotkit/a2ui-renderer": "1.59.5",
-    "@copilotkit/runtime-client-gql": "1.59.5",
-    "@copilotkit/shared": "1.59.5",
-    "@copilotkit/core": "1.59.5",
-    "@copilotkit/web-inspector": "1.59.5"
+    "@copilotkit/a2ui-renderer": "1.60.1",
+    "@copilotkit/runtime-client-gql": "1.60.1",
+    "@copilotkit/shared": "1.60.1",
+    "@copilotkit/core": "1.60.1",
+    "@copilotkit/web-inspector": "1.60.1"
   },
   "devDependencies": {
     "@tailwindcss/cli": "^4.1.11",

package/skills/react-core/SKILL.md

@@ -1,8 +1,8 @@
 ---
 name: react-core
 description: >
-  @copilotkit/react-core — mount CopilotKitProvider in a Next.js App Router / React Router
-  v7 / TanStack Start / SPA app, drop in CopilotChat/CopilotPopup/CopilotSidebar (v2 chat
+  @copilotkit/react-core — mount the CopilotKit provider (from @copilotkit/react-core/v2)
+  in a Next.js App Router / React Router v7 / TanStack Start / SPA app, drop in CopilotChat/CopilotPopup/CopilotSidebar (v2 chat
   components ship from react-core/v2 — NOT react-ui, which is CSS-only in v2), access and
   subscribe to agents with useAgent / useAgentContext / useCapabilities, switch between
   multiple agents, manage durable Intelligence threads with useThreads, register
@@ -48,7 +48,7 @@ sources:
 # CopilotKit React Core
 
 `@copilotkit/react-core` is the React frontend half of CopilotKit: it mounts a provider,
-speaks AG-UI over SSE to a runtime (or directly to CopilotKit Cloud in SPA mode), and
+speaks AG-UI over SSE to a runtime (or directly to CopilotKit Intelligence in SPA mode), and
 exposes hooks for every interaction surface.
 
 This SKILL.md is the **index**. Read the reference under `references/` that matches
@@ -56,7 +56,7 @@ your task — do not try to absorb the whole package from this file.
 
 ## Mental model — three shells you compose
 
-1. **Provider shell** — `CopilotKitProvider` at or near the root (inside `"use client"` for
+1. **Provider shell** — the `CopilotKit` provider (from `@copilotkit/react-core/v2`) at or near the root (inside `"use client"` for
    Next.js App Router). Carries `runtimeUrl` (or `publicLicenseKey` for SPA), `headers`,
    `credentials`, `properties`, `onError`, `debug`, `showDevConsole`.
 2. **Chat shell** — `CopilotChat` / `CopilotPopup` / `CopilotSidebar` or a composed
@@ -71,7 +71,7 @@ your task — do not try to absorb the whole package from this file.
 
 | Task                                                                                                      | Reference                                                                               |
 | --------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------- |
-| Mount `CopilotKitProvider`, pick `runtimeUrl` vs `publicLicenseKey`, RSC boundary rules                   | `references/provider-setup.md`                                                          |
+| Mount the `CopilotKit` provider, pick `runtimeUrl` vs `publicLicenseKey`, RSC boundary rules              | `references/provider-setup.md`                                                          |
 | Drop in `CopilotChat` / `CopilotPopup` / `CopilotSidebar`, compose `CopilotChatView` with slot primitives | `references/chat-components.md`                                                         |
 | File / image attachments via `useAttachments` — drag-drop, click, paste, custom upload                    | `references/attachments.md`                                                             |
 | Client-side debug tooling — `showDevConsole`, `debug` prop, lazy-loaded web inspector                     | `references/debug-mode.md`                                                              |

package/skills/react-core/references/chat-components.md

@@ -1,7 +1,8 @@
 # CopilotKit Chat Components (React)
 
 This skill builds on `copilotkit/provider-setup`. Read it first — every
-chat component must be inside `CopilotKitProvider`.
+chat component must be inside the `CopilotKit` provider (from
+`@copilotkit/react-core/v2`).
 
 All chat components live on `@copilotkit/react-core/v2`. The legacy
 `@copilotkit/react-ui` package is v1-only; its `/v2` subpath is a CSS-only
@@ -30,7 +31,7 @@ suggestions internally via `useAgent`. You do not pass `messages` or
 ```tsx
 import { CopilotPopup } from "@copilotkit/react-core/v2";
 
-<CopilotPopup agentId="default" isModalDefaultOpen={false} />;
+<CopilotPopup agentId="default" defaultOpen={false} />;
 ```
 
 ### Persistent sidebar
@@ -52,8 +53,6 @@ want to manage `messages`/`isRunning` yourself.
 ```tsx
 import {
   CopilotChatView,
-  CopilotChatInput,
-  CopilotChatMessageView,
   useAgent,
   useCopilotKit,
 } from "@copilotkit/react-core/v2";
@@ -66,7 +65,7 @@ export function HeadlessChat() {
     <CopilotChatView
       messages={agent.messages}
       isRunning={agent.isRunning}
-      onSubmitInput={async (text) => {
+      onSubmitMessage={async (text) => {
         agent.addMessage({
           id: crypto.randomUUID(),
           role: "user",
@@ -75,8 +74,12 @@ export function HeadlessChat() {
         await copilotkit.runAgent({ agent });
       }}
     >
-      <CopilotChatMessageView />
-      <CopilotChatInput />
+      {({ messageView, input }) => (
+        <>
+          {messageView}
+          {input}
+        </>
+      )}
     </CopilotChatView>
   );
 }
@@ -89,7 +92,7 @@ export function HeadlessChat() {
   agentId="default"
   labels={{
     chatInputPlaceholder: "Ask about the data…",
-    thinking: "Analyzing…",
+    welcomeMessageText: "What would you like to analyze?",
   }}
 />
 ```
@@ -157,14 +160,19 @@ Correct:
 // CopilotChat manages messages and isRunning internally.
 <CopilotChat agentId="default" />
 
-// For manual control, drop down to headless CopilotChatView:
+// For manual control, drop down to headless CopilotChatView. Its `children`
+// is a render prop that receives the bound slot elements:
 <CopilotChatView
   messages={myMessages}
   isRunning={busy}
-  onSubmitInput={handleSubmit}
+  onSubmitMessage={handleSubmit}
 >
-  <CopilotChatMessageView />
-  <CopilotChatInput />
+  {({ messageView, input }) => (
+    <>
+      {messageView}
+      {input}
+    </>
+  )}
 </CopilotChatView>
 ```
 

package/skills/react-core/references/client-side-tools.md

@@ -269,7 +269,7 @@ Wrong:
 
 ```bash
 pnpm install @copilotkit/react-core
-# zod missing — CopilotKitProvider fails to load
+# zod missing — the CopilotKit provider fails to load
 ```
 
 Correct:

package/skills/react-core/references/custom-message-renderers.md

@@ -6,7 +6,7 @@ internally by `<CopilotChat>` / `<CopilotChatView>`.
 
 Key rules:
 
-- Renderers are passed to `CopilotKitProvider` via `renderCustomMessages`.
+- Renderers are passed to the `CopilotKit` provider via `renderCustomMessages`.
 - The hook returns `null` when called outside `CopilotChatConfigurationProvider`.
 - First non-null result wins — agent-scoped renderers evaluated first.
 - `stateSnapshot` is `undefined` before the run's `runId` resolves.
@@ -15,7 +15,7 @@ Key rules:
 
 ```tsx
 "use client";
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 import type { ReactCustomMessageRenderer } from "@copilotkit/react-core/v2";
 import { useMemo } from "react";
 import { Button } from "@/components/ui/button";
@@ -41,12 +41,9 @@ const CopyButton: ReactCustomMessageRenderer = {
 export function Providers({ children }: { children: React.ReactNode }) {
   const renderers = useMemo(() => [CopyButton], []);
   return (
-    <CopilotKitProvider
-      runtimeUrl="/api/copilotkit"
-      renderCustomMessages={renderers}
-    >
+    <CopilotKit runtimeUrl="/api/copilotkit" renderCustomMessages={renderers}>
       {children}
-    </CopilotKitProvider>
+    </CopilotKit>
   );
 }
 ```
@@ -129,9 +126,9 @@ Correct:
 
 ```tsx
 // Option A — register renderers via the provider prop so <CopilotChat> picks them up:
-<CopilotKitProvider renderCustomMessages={renderers}>
+<CopilotKit renderCustomMessages={renderers}>
   <CopilotChat agentId="default" />
-</CopilotKitProvider>;
+</CopilotKit>;
 
 // Option B — call the hook only inside a chat-configured subtree:
 import { CopilotChatConfigurationProvider } from "@copilotkit/react-core/v2";
@@ -207,7 +204,7 @@ Source: `packages/react-core/src/v2/hooks/use-render-custom-messages.tsx:73-95`
 Wrong:
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   renderCustomMessages={[CopyButton, DebugBefore]} // fresh array every render
 />
 ```
@@ -216,7 +213,7 @@ Correct:
 
 ```tsx
 const renderers = useMemo(() => [CopyButton, DebugBefore], []);
-<CopilotKitProvider renderCustomMessages={renderers} />;
+<CopilotKit renderCustomMessages={renderers} />;
 ```
 
 The provider's stable-array-prop diff console-errors when a new array

package/skills/react-core/references/debug-mode.md

@@ -1,7 +1,7 @@
 # CopilotKit Debug Mode (React)
 
 This skill builds on `copilotkit/provider-setup`. Both debug surfaces are
-props on `CopilotKitProvider`.
+props on the `CopilotKit` provider (from `@copilotkit/react-core/v2`).
 
 Two independent knobs:
 
@@ -14,17 +14,17 @@ Both should be `'auto'` / off in production.
 
 ```tsx
 "use client";
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 
 export function Providers({ children }: { children: React.ReactNode }) {
   return (
-    <CopilotKitProvider
+    <CopilotKit
       runtimeUrl="/api/copilotkit"
       showDevConsole="auto"
       debug={{ events: true, lifecycle: true, verbose: false }}
     >
       {children}
-    </CopilotKitProvider>
+    </CopilotKit>
   );
 }
 ```
@@ -41,7 +41,7 @@ leaking PII by default. For a bug repro, explicitly set `verbose: true` to
 dump full message/tool-call payloads.
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   debug={{ events: true, lifecycle: true, verbose: true }}
 />
@@ -50,7 +50,7 @@ dump full message/tool-call payloads.
 ### Anchor the inspector on narrow viewports
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   showDevConsole="auto"
   inspectorDefaultAnchor="bottom-left"
@@ -60,7 +60,7 @@ dump full message/tool-call payloads.
 ### Env-gate the inspector
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   showDevConsole={process.env.NODE_ENV !== "production"}
 />
@@ -73,13 +73,13 @@ dump full message/tool-call payloads.
 Wrong:
 
 ```tsx
-<CopilotKitProvider runtimeUrl="/api/copilotkit" showDevConsole={true} />
+<CopilotKit runtimeUrl="/api/copilotkit" showDevConsole={true} />
 ```
 
 Correct:
 
 ```tsx
-<CopilotKitProvider runtimeUrl="/api/copilotkit" showDevConsole="auto" />
+<CopilotKit runtimeUrl="/api/copilotkit" showDevConsole="auto" />
 // "auto" enables only on localhost / 127.0.0.1
 ```
 
@@ -93,14 +93,14 @@ Source: `packages/react-core/src/v2/providers/CopilotKitProvider.tsx:301-321`
 Wrong:
 
 ```tsx
-<CopilotKitProvider debug={true} />
+<CopilotKit debug={true} />
 // Then wondering why message contents aren't in the console
 ```
 
 Correct:
 
 ```tsx
-<CopilotKitProvider debug={{ events: true, lifecycle: true, verbose: true }} />
+<CopilotKit debug={{ events: true, lifecycle: true, verbose: true }} />
 ```
 
 `debug: true` is shorthand for `{ events: true, lifecycle: true, verbose: false }`.
@@ -114,13 +114,13 @@ Source: `docs/snippets/shared/troubleshooting/debug-mode.mdx:85-93`
 Wrong:
 
 ```tsx
-<CopilotKitProvider debug={{ events: true, network: true, errors: true }} />
+<CopilotKit debug={{ events: true, network: true, errors: true }} />
 ```
 
 Correct:
 
 ```tsx
-<CopilotKitProvider debug={{ events: true, lifecycle: true, verbose: true }} />
+<CopilotKit debug={{ events: true, lifecycle: true, verbose: true }} />
 ```
 
 `DebugConfig` has exactly three fields: `events`, `lifecycle`, `verbose`.
@@ -134,13 +134,13 @@ Wrong:
 
 ```tsx
 // App embedded in a sandboxed iframe with showDevConsole on
-<CopilotKitProvider runtimeUrl="..." showDevConsole="auto" />
+<CopilotKit runtimeUrl="..." showDevConsole="auto" />
 ```
 
 Correct:
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="..."
   showDevConsole={typeof window !== "undefined" && window.self === window.top}
 />

package/skills/react-core/references/provider-setup.md

@@ -1,9 +1,12 @@
 # CopilotKit Provider Setup (React)
 
-Mount `CopilotKitProvider` once near the root of the React tree. Every
-CopilotKit hook (`useAgent`, `useFrontendTool`, `useRenderTool`, etc.) and
-every chat component (`CopilotChat`, `CopilotPopup`, `CopilotSidebar`) must
-be rendered inside this provider.
+Mount the `CopilotKit` provider (from `@copilotkit/react-core/v2`) once
+near the root of the React tree. Every CopilotKit hook (`useAgent`,
+`useFrontendTool`, `useRenderTool`, etc.) and every chat component
+(`CopilotChat`, `CopilotPopup`, `CopilotSidebar`) must be rendered inside
+this provider.
+
+> **Which provider component?** Always use `CopilotKit` imported from `@copilotkit/react-core/v2`. It is the compatibility bridge across v1 and v2 and a strict superset of the other provider APIs. Do **not** use `CopilotKit` from the package root (`@copilotkit/react-core`, legacy v1) or `CopilotKitProvider` from `/v2` (a subset of the functionality).
 
 All v2 imports use the `@copilotkit/react-core/v2` subpath. Imports from the
 package root are v1 and will not work with v2 hooks or components.
@@ -20,12 +23,12 @@ pattern is a dedicated client-only `providers.tsx`.
 // app/providers.tsx
 "use client";
 
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 import "@copilotkit/react-core/v2/styles.css";
 
 export function Providers({ children }: { children: React.ReactNode }) {
   return (
-    <CopilotKitProvider
+    <CopilotKit
       runtimeUrl="/api/copilotkit"
       credentials="include"
       onError={({ code, error, context }) => {
@@ -33,7 +36,7 @@ export function Providers({ children }: { children: React.ReactNode }) {
       }}
     >
       {children}
-    </CopilotKitProvider>
+    </CopilotKit>
   );
 }
 ```
@@ -66,28 +69,24 @@ export default function RootLayout({
 ### Vite / React Router v7 / SPA
 
 ```tsx
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 import "@copilotkit/react-core/v2/styles.css";
 
 export function App({ children }: { children: React.ReactNode }) {
-  return (
-    <CopilotKitProvider runtimeUrl="/api/copilotkit">
-      {children}
-    </CopilotKitProvider>
-  );
+  return <CopilotKit runtimeUrl="/api/copilotkit">{children}</CopilotKit>;
 }
 ```
 
-### SPA with CopilotKit Cloud (no self-hosted runtime)
+### SPA with CopilotKit Intelligence (no self-hosted runtime)
 
 ```tsx
-<CopilotKitProvider publicApiKey="ck_pub_..." />
+<CopilotKit publicLicenseKey="ck_pub_..." />
 ```
 
-`publicApiKey` is the canonical prop for running CopilotKit from a pure
-client bundle. `publicLicenseKey` is an alias that resolves to the same
-value (`publicApiKey ?? publicLicenseKey`) — accept in old code, but
-always write `publicApiKey` in new code.
+`publicLicenseKey` is the canonical prop for running CopilotKit from a
+pure client bundle. `publicApiKey` is a deprecated alias that resolves to
+the same value — accept it in old code, but always write
+`publicLicenseKey` in new code.
 
 ## Core Patterns
 
@@ -117,7 +116,7 @@ UI from getting stuck in "connecting..." when the runtime URL is wrong or
 CORS is misconfigured.
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   onError={({ code, error, context }) => {
     telemetry.capture({ code, message: error.message, context });
@@ -136,7 +135,7 @@ const properties = useMemo(
   [user.tenantId, user.locale],
 );
 
-<CopilotKitProvider runtimeUrl="/api/copilotkit" properties={properties} />;
+<CopilotKit runtimeUrl="/api/copilotkit" properties={properties} />;
 ```
 
 ## Common Mistakes
@@ -147,12 +146,10 @@ Wrong:
 
 ```tsx
 // app/page.tsx (server component — no "use client")
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 
 export default function Page() {
-  return (
-    <CopilotKitProvider runtimeUrl="/api/copilotkit">...</CopilotKitProvider>
-  );
+  return <CopilotKit runtimeUrl="/api/copilotkit">...</CopilotKit>;
 }
 ```
 
@@ -161,14 +158,10 @@ Correct:
 ```tsx
 // app/providers.tsx
 "use client";
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 
 export function Providers({ children }: { children: React.ReactNode }) {
-  return (
-    <CopilotKitProvider runtimeUrl="/api/copilotkit">
-      {children}
-    </CopilotKitProvider>
-  );
+  return <CopilotKit runtimeUrl="/api/copilotkit">{children}</CopilotKit>;
 }
 
 // app/layout.tsx imports <Providers>.
@@ -185,13 +178,13 @@ Source: `packages/react-core/src/v2/index.ts:1`
 Wrong:
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   agents__unsafe_dev_only={{
     default: new BuiltInAgent({ apiKey: process.env.OPENAI_KEY! }),
   }}
 />
 // or the alias (same thing):
-<CopilotKitProvider
+<CopilotKit
   selfManagedAgents={{ default: new BuiltInAgent({ apiKey: "..." }) }}
 />
 ```
@@ -200,10 +193,10 @@ Correct:
 
 ```tsx
 // Route through a runtime that keeps secrets server-side:
-<CopilotKitProvider runtimeUrl="/api/copilotkit" />
+<CopilotKit runtimeUrl="/api/copilotkit" />
 
-// Or for a pure SPA, use CopilotKit Cloud:
-<CopilotKitProvider publicApiKey="ck_pub_..." />
+// Or for a pure SPA, use CopilotKit Intelligence:
+<CopilotKit publicLicenseKey="ck_pub_..." />
 ```
 
 Both props are aliases for the same dev-only mechanism and ship any embedded
@@ -216,7 +209,7 @@ Source: `packages/react-core/src/v2/providers/CopilotKitProvider.tsx:136-138,393
 Wrong:
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   headers={{ Authorization: `Bearer ${token}` }}
   properties={{ tenantId: user.tenantId }}
@@ -232,7 +225,7 @@ const properties = useMemo(
   [user.tenantId],
 );
 
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   headers={headers}
   properties={properties}
@@ -251,13 +244,13 @@ Source: `packages/react-core/src/v2/providers/CopilotKitProvider.tsx:324-340,399
 Wrong:
 
 ```tsx
-<CopilotKitProvider runtimeUrl="/api/copilotkit" />
+<CopilotKit runtimeUrl="/api/copilotkit" />
 ```
 
 Correct:
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   onError={({ code, error, context }) => {
     telemetry.capture({ code, error, context });
@@ -272,26 +265,26 @@ forever and users never see the actual error.
 
 Source: `packages/react-core/src/v2/providers/CopilotKitProvider.tsx:638-660`
 
-### HIGH — Writing `publicLicenseKey` in new code
+### HIGH — Writing `publicApiKey` in new code
 
 Wrong:
 
 ```tsx
-<CopilotKitProvider publicLicenseKey="ck_pub_..." />
+<CopilotKit publicApiKey="ck_pub_..." />
 ```
 
 Correct:
 
 ```tsx
-<CopilotKitProvider publicApiKey="ck_pub_..." />
+<CopilotKit publicLicenseKey="ck_pub_..." />
 ```
 
-`publicLicenseKey` still works as an alias, but `publicApiKey` is the
-canonical name in v2. The provider resolves
-`publicApiKey ?? publicLicenseKey`. Always write the canonical form in
+`publicApiKey` still works as a deprecated alias, but `publicLicenseKey`
+is the canonical name. The `CopilotKit` provider resolves
+`publicLicenseKey || publicApiKey`. Always write the canonical form in
 new code.
 
-Source: `packages/react-core/src/v2/providers/CopilotKitProvider.tsx:122-128,391`
+Source: `packages/react-core/src/components/copilot-provider/copilotkit.tsx:172`
 
 ### MEDIUM — Putting the provider below a layout that uses CopilotKit
 
@@ -301,7 +294,7 @@ Wrong:
 <html>
   <body>
     <Header>{/* Header uses useFrontendTool internally */}</Header>
-    <CopilotKitProvider>{children}</CopilotKitProvider>
+    <CopilotKit>{children}</CopilotKit>
   </body>
 </html>
 ```
@@ -311,16 +304,16 @@ Correct:
 ```tsx
 <html>
   <body>
-    <CopilotKitProvider>
+    <CopilotKit>
       <Header />
       {children}
-    </CopilotKitProvider>
+    </CopilotKit>
   </body>
 </html>
 ```
 
 Any component that calls `useCopilotKit`, `useFrontendTool`, `useAgent`, or
-any other CopilotKit hook must be a descendant of `CopilotKitProvider`.
-Placing the provider beside or below a consumer throws at mount.
+any other CopilotKit hook must be a descendant of the `CopilotKit`
+provider. Placing the provider beside or below a consumer throws at mount.
 
 Source: `packages/react-core/src/v2/providers/CopilotKitProvider.tsx` (context)

package/skills/react-core/references/rendering-activity-messages.md

@@ -2,7 +2,7 @@
 
 This skill builds on `copilotkit/provider-setup`. Activity-message
 renderers are registered as entries in the `renderActivityMessages` array
-prop on `CopilotKitProvider` and resolved at render time by
+prop on the `CopilotKit` provider and resolved at render time by
 `useRenderActivityMessage` (consumed internally by chat components).
 
 User renderers are placed first in the array so they override the built-in
@@ -20,7 +20,7 @@ Resolver order:
 
 ```tsx
 "use client";
-import { CopilotKitProvider } from "@copilotkit/react-core/v2";
+import { CopilotKit } from "@copilotkit/react-core/v2";
 import type { ReactActivityMessageRenderer } from "@copilotkit/react-core/v2";
 import { z } from "zod";
 import { useMemo } from "react";
@@ -46,12 +46,9 @@ const progressRenderer: ReactActivityMessageRenderer<{
 export function Providers({ children }: { children: React.ReactNode }) {
   const renderers = useMemo(() => [progressRenderer], []);
   return (
-    <CopilotKitProvider
-      runtimeUrl="/api/copilotkit"
-      renderActivityMessages={renderers}
-    >
+    <CopilotKit runtimeUrl="/api/copilotkit" renderActivityMessages={renderers}>
       {children}
-    </CopilotKitProvider>
+    </CopilotKit>
   );
 }
 ```
@@ -184,7 +181,7 @@ Source: `packages/react-core/src/v2/hooks/use-render-activity-message.tsx`
 Wrong:
 
 ```tsx
-<CopilotKitProvider
+<CopilotKit
   runtimeUrl="/api/copilotkit"
   renderActivityMessages={[progressRenderer, customMcpRenderer]}
 />
@@ -194,10 +191,7 @@ Correct:
 
 ```tsx
 const renderers = useMemo(() => [progressRenderer, customMcpRenderer], []);
-<CopilotKitProvider
-  runtimeUrl="/api/copilotkit"
-  renderActivityMessages={renderers}
-/>;
+<CopilotKit runtimeUrl="/api/copilotkit" renderActivityMessages={renderers} />;
 ```
 
 The provider uses `useStableArrayProp` and console-errors when a new array