## Summary
- Extract `CopilotKitContext` and `useCopilotKit` into standalone
`context.ts` in react-core, enabling cross-platform reuse without web
dependencies
- Add new `@copilotkit/react-native` package with lightweight provider,
polyfills, and streaming fetch
- All hooks (`useAgent`, `useFrontendTool`, `useHumanInTheLoop`, etc.)
are re-exported directly from react-core — no reimplementation
## Motivation
CopilotKit's React hooks are platform-agnostic, but the barrel import in
`@copilotkit/react-core` pulls in web-only dependencies (Radix UI, Lit,
A2UI renderer, react-dom, CSS). This makes the package unusable in React
Native without extensive Metro shimming.
By extracting the React context into a standalone entry point
(`@copilotkit/react-core/v2/context`), the new
`@copilotkit/react-native` package can provide its own lightweight
provider while reusing all existing hooks.
## What's in `@copilotkit/react-native`
| Export | Description |
|--------|-------------|
| `CopilotKitProvider` | Lightweight provider — no DOM, CSS, Radix, Lit,
or A2UI deps |
| `installStreamingFetch()` | XHR-based streaming fetch for
`response.body.getReader()` support |
| `@copilotkit/react-native/polyfills` | All polyfills at once
(ReadableStream, TextEncoder, crypto, DOMException, window.location) |
| `@copilotkit/react-native/polyfills/*` | Granular per-polyfill imports
(`/streams`, `/encoding`, `/crypto`, `/dom`, `/location`) for users who
need to avoid overriding their own shims |
| `useAgent`, `useFrontendTool`, etc. | Re-exported from react-core
(shared context) |
## Usage
```tsx
// index.js (entry point, before other imports)
import "@copilotkit/react-native/polyfills";
import { installStreamingFetch } from "@copilotkit/react-native";
installStreamingFetch();
// App.tsx
import { CopilotKitProvider, useAgent, useCopilotKit } from "@copilotkit/react-native";
function App() {
return (
<CopilotKitProvider runtimeUrl="https://your-server/api/copilotkit">
<ChatScreen />
</CopilotKitProvider>
);
}
```
## Test plan
- [x] `nx run react-core:build` passes
- [x] `nx run @copilotkit/react-native:build` passes
- [x] `nx run react-core:test` — all 1153 tests pass
- [x] Manual test in React Native app (tested during development with
bare RN 0.84 project)
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Several shared snippets linked to paths that no longer exist:
- /generative-ui/specs/* → /learn/generative-ui/specs/* (specs moved)
- /premium/threads → /threads (page is at root, not under /premium)
- /premium/inspector → /inspector (page is at root, not under /premium)
Because these snippets are inlined into many integration pages,
each broken link multiplied across the site and accounted for the
majority of internal-referrer 404s on docs.copilotkit.ai.
Threads pages: drop @copilotkit/cli-vnext alias for the canonical
@copilotkit/cli, bump react-core minimum from v1.50 to v1.56, and trim
the redundant "(via Copilot Cloud or self-hosted)" parenthetical from
the Prerequisites bullets.
Self-hosting snippet: restructure the "What is this?" intro into a
labeled "What you bring" / "What the chart deploys" pair (with a
component table for ports), tighten the kubeconfig-check sentence, and
collapse the local-validation Callout into two parallel options (bundled
overlay vs one-shot script). Drop the "If none of these apply, use
Copilot Cloud" line — readers who land on /premium/self-hosting have
already opted in.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The self-hosting pages are heavy on helm install, kubectl apply, and
shell-script invocations — without these in KNOWN_INSTALL_TYPES they
all bucket as "code" and the self-hosting funnel goes blind to install
method. Skips sudo deliberately: it's a wrapper that would swallow the
real installer in the funnel.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The Threads, Intelligence Platform explainer, multi-conversation
tutorial, useThreads reference, and the shared threads snippet were
restored at their pre-rollout state, so they carried no OpsPlatformCTA
while peer pages picked one up earlier on this branch. Wires each
restored page to the new try_for_free_clicked event with snake_case
surface identifiers, and fixes the "a Enterprise" → "an Enterprise"
article mismatch the rebrand left in both self-hosting pages.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Renames the platform name across docs prose, CTA copy, frontmatter
descriptions, and the Learn landing card. Three patterns were collapsed
into one canonical form:
- "CopilotKit platform" → "Enterprise Intelligence Platform"
- "CopilotKit Intelligence Platform" → "Enterprise Intelligence Platform"
- "Intelligence Platform" → "Enterprise Intelligence Platform"
URL slugs (/learn/intelligence-platform, /premium/intelligence-platform)
are intentionally unchanged. The CTA component button label
("Get Intelligence free") is also unchanged.
The ThreadsEarlyAccess wrapper hid Threads, the multi-conversation
tutorial, useThreads, and the shared snippet behind a client-side
password splash. Threads is now generally available, so remove the
wrapper from the five MDX entry points, drop the component, and unwire
the MDX registry entries in the home and integrations route handlers.
This restores the Threads management surface (useThreads hook, the
multi-conversation tutorial, per-integration Threads how-tos, the
shared snippet), the Intelligence Platform / self-hosting pages, and
the sidebar entries that were dropped in b08da7970.
This reverts commit b08da79700.
## What does this PR do?
Makes `/learn` behave like `/reference` in the docs site: when a user is
under `/learn`, the framework picker disappears and the sidebar shows
only learn content.
### Changes
- **Add `learn` to root `meta.json`** — the learn folder was missing
from the root navigation, so `ConditionalSidebar` couldn't find it in
the page tree and was falling through to the default sidebar (with the
framework picker still visible). Adding it to the pages list mirrors how
`reference` is wired up.
- **New `LearnHeader` component** — static header with a book icon and
"Learn" label, styled to match the Reference version selector. Wired in
via `Sidebar`'s existing `headerSlot` prop on `/learn` routes.
- **Rename learn index title to "Overview"** — the landing page that
shows when you click the Learn tab now reads "Overview" in both the page
heading and the sidebar.
- **Drop the redundant `h-6` spacer in `Sidebar`** — every header
component (`IntegrationSelector`, `VersionSelector`, `LearnHeader`)
already has its own `mb-3`. The extra spacer was producing a 24px
phantom gap on `/learn` while collapsing to 0 on `/reference` under flex
shrink, so the two sidebars looked inconsistent.
### Verification
Tested locally on the docs dev server:
| Route | Sidebar header | Sidebar contents | Framework picker |
|-------|---------------|------------------|------------------|
| `/` | Integration selector | Full docs tree | shown |
| `/reference/v2` | API version selector | Reference v2 tree | hidden |
| `/learn` | New "Learn" header | Learn-only tree | hidden |
| `/learn/architecture` | New "Learn" header | Learn-only tree
(Architecture active) | hidden |
Spacing between the header and first sidebar item is now equal across
`/learn` and `/reference`.
## Related PRs and Issues
- N/A
## Checklist
- [x] I have read the [Contribution
Guide](https://github.com/copilotkit/copilotkit/blob/master/CONTRIBUTING.md)
- [x] If the PR changes or adds functionality, I have updated the
relevant documentation
- [x] "Allow edits by maintainers" is checked
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Add a Learn-only sidebar mode that mirrors how /reference works: when a user
is under /learn, the framework picker is hidden and the sidebar shows only
learn content (What's New, Agentic Protocols, Generative UI, Specs,
Architecture, Tutorials).
- Add `learn` to the root meta.json so the learn folder is discoverable in
the page tree (was missing, which is why ConditionalSidebar previously
fell through to the default sidebar on /learn routes)
- Add a static LearnHeader (book icon + "Learn") visually matching the
Reference version selector, wired in via Sidebar's headerSlot
- Rename the learn index page title to "Overview" so the landing page reads
cleanly under the new header
- Drop the redundant `h-6` spacer in Sidebar — every header component
(IntegrationSelector, VersionSelector, LearnHeader) already supplies its
own `mb-3`, and the spacer was producing a 24px phantom gap on /learn
while collapsing to 0 on /reference under flex shrink
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Address review feedback on #4643: install_type and location already answer
the funnel questions, so persisting raw clipboard contents adds privacy
surface without analytic value (the global writeText hook fires on every
programmatic copy, not just CLI buttons). Also remove the never-passed
product param.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- PostHog: capture_dead_clicks=false to skip dead-clicks-autocapture.js
- Drop duplicate reb2b loader (NEXT_PUBLIC_RB2B_ID); the <Script>
in app/layout.tsx using NEXT_PUBLIC_REB2B_KEY is the canonical one
and matches the website's reb2b key
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
CopyTracker monkey-patches navigator.clipboard.writeText once at app
boot to fire PostHog cli_command_copied for every programmatic copy —
covering Fumadocs' built-in code-block button, custom-code-block,
code-showcase, framework-overview, and any future copy widget without
per-component instrumentation. Reo's own writeText patch continues to
function alongside this one.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
<!--
Thank you for sending the PR! We appreciate you spending the time to
work on these changes.
Help us understand your motivation by explaining why you decided to make
this change.
**Please PLEASE reach out to us first before starting any significant
work on new or existing features.**
By the time you've gotten here, you're looking at creating a pull
request so hopefully we're not too late.
We love community contributions! That said, we want to make sure we're
all on the same page before you start.
Investing a lot of time and effort just to find out it doesn't align
with the upstream project feels awful, and we don't want that to happen.
It also helps to make sure the work you're planning isn't already in
progress.
As described in our contributing guide, please file an issue first:
https://github.com/ag-ui-protocol/ag-ui/issues
Or, reach out to us on Discord: https://discord.com/invite/6dffbvGU3D
You can learn more about contributing to copilotkit here:
https://github.com/copilotkit/copilotkit/blob/master/CONTRIBUTING.md
Happy contributing!
-->
## What does this PR do?
(Describe the changes introduced in this PR)
- Logo component: "Logo" → "CopilotKit" (both light/dark variants)
- Examples carousel: empty alt → example.title
- Scarf tracking pixel: add aria-hidden so SR/audit tools skip it
## Related PRs and Issues
- (Direct link to related PR or issue, if relevant)
## Checklist
- [ ] I have read the [Contribution
Guide](https://github.com/copilotkit/copilotkit/blob/master/CONTRIBUTING.md)
- [ ] If the PR changes or adds functionality, I have updated the
relevant documentation
- [ ] "Allow edits by maintainers" is checked (lets us help iterate on
your PR directly — faster turnaround for everyone)
Renames the docs CTA tracking event from `cta_clicked` to
`try_for_free_clicked` to match the per-event custom event names used
on the marketing website, and uses a single `location` string property
in place of the previous `surface` / `variant` / `target` / `page_path`
shape. Surface identifiers are normalized to underscored snake_case to
match the location values already used on the website.
Same change applies to the docs navbar handler that fires when a
visitor clicks the Free Developer Access link.
Adds a sign-up CTA to the shared `prebuilt-components` snippet so it
appears on all twelve per-integration `/{framework}/prebuilt-components`
pages that consume it, and adds a matching CTA to the LangGraph
prebuilt-components page (which uses custom content rather than the
shared snippet).
Moves the Built-in Agent overview CTA from below the features grid to
above the first H2 so it lands above the fold on standard viewports.
Replaces the framework-specific `npx copilotkit@latest create -f <fw>`
command with the interactive `npx copilotkit@latest create` flow on the
eight framework quickstarts that have a CLI scaffold (ADK, Agno, AWS
Strands, LangGraph, LlamaIndex, Mastra, Microsoft Agent Framework,
Pydantic AI).
Each quickstart's "Run our CLI" step now describes the three prompts
the CLI walks the user through — project name, the platform Yes/No
question (with a sign-up link to the dashboard), and the framework
choice. Framework labels match the strings rendered by the CLI's
interactive select-input so the docs stay aligned with the runtime
prompt.
Drops the per-language Tabs blocks on LangGraph and Microsoft Agent
Framework since the language variant is now picked through the CLI
prompt rather than encoded as a flag.
Places dashboard sign-up CTAs on topical pages, threads guides,
reference pages, and integration overview pages. Each CTA is tagged
with a stable surface identifier for PostHog attribution and routes to
the dashboard with matching UTM parameters.
Placements include:
- Home and quickstart landing pages
- Prebuilt-components, shared-state, and chat-related reference pages
- Threads how-to, tutorial, reference, and per-integration threads pages
(via the shared snippet)
- Inspector, event-inspector, and learning explainer pages
- Premium overview, observability, headless-ui, and self-hosting pages
(via the shared snippets)
- Integration overview pages — placed via the new afterFeatures slot on
the four FrameworkOverview-based pages (LangGraph, ADK, AWS Strands,
Microsoft Agent Framework) and below the features grid on Built-in
Agent
- Manual-setup quickstart pages (a2a, ag2, agent-spec, built-in-agent,
crewai-flows, deepagents)
Also normalizes platform copy across the affected pages.
Adds an optional `afterFeatures` ReactNode prop to the FrameworkOverview
landing-page component, rendered as a section between the supported
features grid and the architecture section. Lets the hosting MDX page
inject contextual content (links, callouts, sign-up cards) below the
final feature without needing to modify the component for each
integration.
Introduces a reusable OpsPlatformCTA component with four visual variants
(card, info, inline, tile) for placing dashboard sign-up calls-to-action
across the docs. Each click captures a `cta_clicked` PostHog event tagged
with surface, variant, and page path, and navigates to the dashboard with
UTM parameters identifying the source surface.
Registers the component in both MDX provider maps (home and integrations
slug routes) so it can be used in any MDX file.
Repoints the navbar "Free Developer Access" link to the dashboard and
wires the same PostHog tracking to its left and right placements.
## Summary
- Adds a **Talk to Our Engineers** CTA button to the right side of the
docs navbar, mirroring the new website's nav button.
- Wires the same PostHog `talk_to_us_clicked` event the website fires,
with `{ location: "docs_nav" }` so docs-originated clicks can be
segmented from website clicks (`"nav"`) in PostHog.
- Fixes a pre-existing layout bug where the navbar's slanted SVG borders
were sized in fixed pixels (`w-[24px] h-[60px]` / `xl:w-[29px]
xl:h-[72px]`) and didn't follow the nav's actual height once Chrome's
default font size was scaled above 16px — the wedge of page background
that leaked through the join is now sealed.
## Behavior
| Viewport | Button |
|---|---|
| `>= 1400px` | Visible |
| `1024–1399px` | Hidden (button text would otherwise force the left
links to wrap) |
| `< 1024px` | Hidden — mobile burger menu surfaces the link |
The button uses `text-muted-foreground` for the resting state to match
the existing nav links and an indigo `#7076D5` hover accent that matches
the active-link underline color. Target is
`https://copilotkit.ai/contact-us` (absolute since docs runs on the
`docs.` subdomain).
## Test plan
- [ ] Click the button on a wide viewport — navigates to
`https://copilotkit.ai/contact-us` and fires `talk_to_us_clicked` with
`{ location: "docs_nav" }` in PostHog.
- [ ] Resize from > 1400px down through 1024px and below — button shows
/ hides at the right thresholds with no left-link wrapping.
- [ ] Toggle dark mode — button border and text stay legible, hover
accent still indigo.
- [ ] Set Chrome's default font size to 20px and reload — no wedge gap
at the slanted-border join between the left and right pill containers.
Removes the unreleased Threads management surface (useThreads hook,
multi-conversation tutorial, the per-integration Threads how-to, the
shared snippet) and the Intelligence Platform / self-hosting pages
introduced alongside them, plus the ThreadsEarlyAccess gate that wrapped
them. The Learn landing page stays; just drops the Threads card and the
Intelligence Platform card. Sidebars (root, learn, reference/v2/hooks,
12 integrations + their premium subsections) are pruned to match.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Adds a CTA button to the right side of the docs navbar mirroring the
website's nav button, including matching PostHog instrumentation. Fires
talk_to_us_clicked with { location: "docs_nav" } so docs-originated
clicks can be segmented separately from website clicks (which use
"nav"). Visible at viewports >= 1400px to avoid forcing the left
links to wrap; hidden below that breakpoint where the mobile burger
menu surfaces the link instead. Styled with text-muted-foreground to
match the existing nav links and an indigo #7076D5 hover accent that
matches the active-link underline.
The slanted SVG borders bridging the navbar's left and right pill
containers were sized with fixed pixels (w-[24px] h-[60px] /
xl:w-[29px] xl:h-[72px]). When users scale Chrome's default font size
above 16px, rem-based content inside the nav grows but the SVGs stay
fixed, leaving a visible wedge of page background at the top of the
join. Switch to h-full w-auto so the SVGs follow the container's
actual height while preserving their viewBox aspect ratio.
Routes PostHog analytics through docs.copilotkit.ai/ingest/* (rewrites to
eu.i.posthog.com) so requests bypass ad blockers and tracking-protection
that target the PostHog hostname directly. Mirrors the existing setup in
the marketing website.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Restructure /threads using TailoredContent so users pick between
bootstrapping a new project with the v-next CLI or wiring threads
into an existing CopilotKit app. The CLI path walks through
`npx -y @copilotkit/cli-vnext@latest create`, enabling Intelligence
when prompted, cd-ing into the project, installing deps, adding the
OpenAI key, and `npm run dev` (which boots the local Intelligence
Platform, BFF, and web app at localhost:3000). The manual path
preserves the original 4-step flow (runtime config, useThreads,
thread switching, pagination).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The Vite + Direct Connection alternative and the matching Step 7
"LangGraph with custom route" tab walked users through a path that
doesn't actually run end-to-end. Verified via test drive: three stacked
failures in the Python SDK (missing v2 JSON-RPC envelope handler in
`add_fastapi_endpoint`; broken `LangGraphAGUIAgent.dict_repr` calling a
`super().dict_repr` that doesn't exist; `LangGraphAGUIAgent` missing
the `.execute` method that `CopilotKitRemoteEndpoint.execute_agent`
dispatches to, since its parent `ag_ui_langgraph.LangGraphAgent` only
exposes `.run(RunAgentInput)`).
Rather than ship docs that walk through a broken path, delete it:
- Remove the `<Tab value="LangGraph with custom route">` from Step 7
and Step 10; both Tabs go back to `['Deep Agent', 'FastAPI']`.
- Remove the entire "Alternative: Vite + Direct Connection" section.
- Rewrite Step 7's "Using Next.js is optional" callout so it no longer
references the (now deleted) in-page anchor; it now points only at
LangChain's CopilotKit integration guide, which is where Christian
Bromann's original feedback pointed as the canonical reference for
the custom-route path.
Net effect: Christian's feedback is still addressed — Next.js is
explicitly flagged as optional and users are pointed at the working
upstream guide — without us becoming the maintainer of a parallel
path that doesn't currently work. Direct-connect can be re-added to
the docs once the Python SDK gains a v2 envelope handler and the
`LangGraphAGUIAgent.execute` adapter.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Two small fixes from E2E test-driving the quickstart:
- Step 9's `useDefaultRenderTool` render callback destructured `args`,
but the SDK exposes `parameters`. The TS example didn't typecheck
as written. Swap to the correct prop name.
- Step 10 ("Start your agent") now has a short callout telling users
what to do if port 8123 is already taken (change `--port` and update
`LANGGRAPH_DEPLOYMENT_URL` in Step 7).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The feature-viewer dojo doesn't currently serve /deepagents/feature/*
routes, so every IframeSwitcher in the Deep Agents docs was rendering
a 404 and the landing page 'Features' link broke.
Swap all 25 references across 10 files from /deepagents/feature/ to
/langgraph/feature/. The rendered demos are content-equivalent since
Deep Agents is LangChain-based, so the user experience is unchanged
from what we'd eventually serve under /deepagents/.
Also drops a TODO comment above each IframeSwitcher / FrameworkOverview
so the swap is easy to reverse once the dojo supports the correct path.
Files touched: index, frontend-tools, generative-ui/{state-rendering,
tool-rendering, your-components/{interrupt-based, interactive}},
shared-state/{predictive-state-updates, in-app-agent-write,
in-app-agent-read}, human-in-the-loop/interrupt-flow.
The TypeScript 'Create your Deep Agent' example in the quickstart was
passing a bare `function getWeather(...)` into `tools: [getWeather]`,
which does not type-check against createDeepAgent — from
libs/deepagents/src/types.ts in deepagentsjs:
tools?: TTools | StructuredTool[];
// TTools extends readonly (ClientTool | ServerTool)[]
Bare functions aren't in the union. (Python auto-wraps via type hints +
reflection; TS doesn't.) A copy-paster would hit a type error at best and
a non-functional tool at worst.
Wrap the example with tool(handler, { name, description, schema }) from
langchain plus a zod schema — the same pattern used everywhere else in
this PR and in the official deepagentsjs examples/research/research-agent.ts.
Copy-paste-hygiene pass on the Python code blocks — eight unused imports
and one broken-typing reference removed across four files.
- quickstart.mdx (FastAPI tab): drop unused `import os` and
`CopilotKitState` from the copilotkit import tuple.
- shared-state/predictive-state-updates.mdx: drop unused `typing.Literal`
from the "Define the state" block, drop unused `CopilotKitState` from
the predictive-config block and from the prebuilt-agent copilotkit
import tuple.
- shared-state/state-inputs-outputs.mdx: drop unused `typing.Literal`
from both Python blocks, and swap `List[str]` (which was never
imported) for `list[str]` now that the target is Python 3.12.
- shared-state/workflow-execution.mdx: same fixes as state-inputs-outputs.
Users copy-pasting any of these into a fresh project no longer hit
ruff/pylint unused-import warnings or a NameError on `List`.
Step 7 "Setup Copilot Runtime" now offers three tabs (Deep Agent, FastAPI,
LangGraph with custom route) but Step 9 "Start your agent" still only
declared two. Because both steps share groupId="deployment_method",
selecting the new tab in Step 7 would carry into Step 9 where it
doesn't exist, causing the tab state to fall back. Adds the matching
third tab to Step 9 — command is the same langgraph-cli invocation
as the Deep Agent tab, since the custom-route path still runs a
LangGraph deployment.
Two Christian-facing nudges to make the re-review easier:
1. Step 7 ("Setup Copilot Runtime") now has a third tab alongside
Deep Agent and FastAPI: "LangGraph with custom route". It shows
the minimal frontend-only snippet (no app/api/copilotkit/route.ts),
and links to the Vite + Direct Connection section below for the
full Python + frontend walkthrough. This promotes Christian's
preferred path (custom route per the LangChain CopilotKit guide)
to peer billing with the Next.js options, rather than only
surfacing it through a callout. The callout is retained and now
points explicitly at the new tab.
2. a2ui/{dynamic-schema, fixed-schema} "Register the tool" snippets
now use create_deep_agent from deepagents instead of create_agent
from langchain. These sit inside the Deep Agents integration tree
so the LangGraph prebuilt import was off-brand; not flagged by
Christian but worth pre-empting.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Follow-up to the TS rewrite: the Python tabs on the same feature pages
still showed a custom-graph-style chat_node(state, config) function,
which is not the idiomatic Deep Agents pattern. Users of create_deep_agent
don't define their own chat_node; they use AgentMiddleware classes with
hooks like before_model.
Pages updated:
- human-in-the-loop/interrupt-flow, generative-ui/your-components/
interrupt-based: rewrote Python to an AgentMiddleware subclass with
a before_model hook that calls langgraph.types.interrupt. Now
symmetric with the TS middleware pattern.
- shared-state/in-app-agent-read: dropped the illustrative chat_node
from the Python tab; a short comment now notes the agent reads state
from tools or middleware hooks as it runs.
- generative-ui/state-rendering: renamed Python chat_node to
emit_research_progress and removed the ChatOpenAI invocation so the
snippet illustrates copilotkit_emit_state usage without implying a
custom graph node structure.
Custom-graph-labeled branches in predictive-state-updates and the two
input/output schema pages (state-inputs-outputs, workflow-execution)
still show chat_node / answer_node functions — intentional, since
those sections document LangGraph custom-graph usage explicitly.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- tool-rendering: switch groupId from "language_langgraph_agent" to
"agent_language" so tab selection persists alongside the other
Deep Agents pages.
- tool-rendering: rewrite both Python and TS tabs to use
create_deep_agent / createDeepAgent with `tools: [...]` instead of
the custom-graph `chat_node + bind_tools` pattern that didn't match
the rest of the docs.
- predictive-state-updates "Prebuilt agent": switch the Python tab to
`create_deep_agent` from `deepagents` so it matches the TS tab
(was using `create_agent` from `langchain.agents`). Update the
TailoredContentOption description to reference both `createDeepAgent`
and `create_agent` instead of only the LangGraph name.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Christian Bromann flagged that Deep Agents feature pages still used the
legacy `Annotation.Root` state-schema pattern in their TypeScript
examples, which doesn't compose with `createDeepAgent` (no `stateSchema`
field).
Rather than strip the TS tabs, rewrite them using the canonical
LangChain v1 idiom: `createMiddleware` with a zod `stateSchema`, composed
alongside `copilotkitMiddleware`. Pattern typecheck-verified end-to-end
against deepagents@^1.9.0 and the current @copilotkit/sdk-js.
Pages rewritten with TS tabs (9):
- frontend-tools
- shared-state/{in-app-agent-read, in-app-agent-write,
predictive-state-updates}
- human-in-the-loop/interrupt-flow
- generative-ui/state-rendering
- generative-ui/your-components/{display-only, interactive,
interrupt-based}
Interrupts use a `beforeModel` middleware hook rather than a custom
graph node — the idiomatic Deep Agents pattern, since users don't
define their own chat_node functions.
Pages left Python-only with a callout (2):
- shared-state/{workflow-execution, state-inputs-outputs}: these
document LangGraph's input/output schema split, which is not a
first-class feature of createDeepAgent's middleware model. Callout
explains the gap and points to the shared-state guides.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
LangGraph now recommends the `StateSchema` API over `Annotation.Root` for
defining TypeScript agent state. Expose a `CopilotKitStateSchema` (and
`CopilotKitPropertiesSchema`) built on that API so TypeScript users can
compose CopilotKit state with the modern pattern:
import { StateSchema } from "@langchain/langgraph";
import { CopilotKitStateSchema } from "@copilotkit/sdk-js/langgraph";
import { z } from "zod";
export const AgentStateSchema = new StateSchema({
language: z.enum(["english", "spanish"]).default("english"),
...CopilotKitStateSchema.fields,
});
The existing `CopilotKitStateAnnotation` export continues to work; this
change is purely additive.
Docs under `docs/content/docs/integrations/langgraph/**` are migrated to
the new pattern. The `deepagents` docs pages are introduced in PR #3707;
the deprecation callout added there can be removed once both land.
The shell-docs copy of ag-ui-middleware.mdx had been authored with full
content while the upstream file remained a 10-line TODO stub. Port the
70-line authored version up so the docs-sync pipeline stops threatening
to overwrite it.
Jordan Ritter