This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @langchain/langgraph-api@1.2.5 ### Patch Changes - [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(langgraph): forward named custom stream channels consistently Forward remote `StreamChannel` emissions as `custom:<name>` protocol events and normalize them back to custom-channel payloads in the API session. This aligns JavaScript stream-channel forwarding with the protocol subscription shape used by remote clients, so `custom:<name>` subscriptions receive extension channel data consistently. - Updated dependencies \[]: - @langchain/langgraph-ui@1.2.5 ## @langchain/langgraph-cli@1.2.5 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f)]: - @langchain/langgraph-api@1.2.5 ## @langchain/langgraph@1.3.6 ### Patch Changes - [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(langgraph): forward named custom stream channels consistently Forward remote `StreamChannel` emissions as `custom:<name>` protocol events and normalize them back to custom-channel payloads in the API session. This aligns JavaScript stream-channel forwarding with the protocol subscription shape used by remote clients, so `custom:<name>` subscriptions receive extension channel data consistently. - Updated dependencies \[[`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph-sdk@1.9.17 ## @langchain/langgraph-sdk@1.9.17 ### Patch Changes - [#2494](https://github.com/langchain-ai/langgraphjs/pull/2494) [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): revive automatic optimistic submit echo Echo `submit()` input into `values` / `messages` immediately with client-side id minting and id-based reconciliation as the server streams back. Expose per-message `optimisticStatus` via message metadata (`pending` → `sent` / `failed`), shallow-merge non-message keys with rollback when no `values` arrive, and add an `optimistic: false` hook opt-out. Plumb through React, Vue, Svelte, and Angular with browser e2e coverage. - [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): coalesce duplicate thread read requests Coalesce concurrent identical `threads.getState()` and `threads.getHistory()` reads within the SDK client so transient remounts do not issue duplicate hydrate requests. Request identity includes the prepared URL, body, method, and headers, and coalescing is skipped for caller-provided abort signals, raw response reads, and `onRequest` hooks to preserve auth and cancellation isolation. - [#2497](https://github.com/langchain-ai/langgraphjs/pull/2497) [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): reconcile subagents and subgraphs on thread reconnect Seed deep-agent subagent cards from checkpoint messages and subgraph hosts from a single bounded `getHistory` read during `hydrate()`, so parallel fan-out discovery reappears immediately on refresh instead of waiting for SSE replay. Subagent execution namespaces are promoted through the existing guarded discovery state machine (bulk at hydrate, lazily per opened card via the selector layer). The getHistory cost is O(1) in requests regardless of fan-out width. ## @langchain/angular@1.0.17 ### Patch Changes - [#2494](https://github.com/langchain-ai/langgraphjs/pull/2494) [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): revive automatic optimistic submit echo Echo `submit()` input into `values` / `messages` immediately with client-side id minting and id-based reconciliation as the server streams back. Expose per-message `optimisticStatus` via message metadata (`pending` → `sent` / `failed`), shallow-merge non-message keys with rollback when no `values` arrive, and add an `optimistic: false` hook opt-out. Plumb through React, Vue, Svelte, and Angular with browser e2e coverage. - [#2497](https://github.com/langchain-ai/langgraphjs/pull/2497) [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): reconcile subagents and subgraphs on thread reconnect Seed deep-agent subagent cards from checkpoint messages and subgraph hosts from a single bounded `getHistory` read during `hydrate()`, so parallel fan-out discovery reappears immediately on refresh instead of waiting for SSE replay. Subagent execution namespaces are promoted through the existing guarded discovery state machine (bulk at hydrate, lazily per opened card via the selector layer). The getHistory cost is O(1) in requests regardless of fan-out width. - Updated dependencies \[[`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph-sdk@1.9.17 ## @langchain/react@1.0.17 ### Patch Changes - [#2494](https://github.com/langchain-ai/langgraphjs/pull/2494) [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): revive automatic optimistic submit echo Echo `submit()` input into `values` / `messages` immediately with client-side id minting and id-based reconciliation as the server streams back. Expose per-message `optimisticStatus` via message metadata (`pending` → `sent` / `failed`), shallow-merge non-message keys with rollback when no `values` arrive, and add an `optimistic: false` hook opt-out. Plumb through React, Vue, Svelte, and Angular with browser e2e coverage. - [#2497](https://github.com/langchain-ai/langgraphjs/pull/2497) [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): reconcile subagents and subgraphs on thread reconnect Seed deep-agent subagent cards from checkpoint messages and subgraph hosts from a single bounded `getHistory` read during `hydrate()`, so parallel fan-out discovery reappears immediately on refresh instead of waiting for SSE replay. Subagent execution namespaces are promoted through the existing guarded discovery state machine (bulk at hydrate, lazily per opened card via the selector layer). The getHistory cost is O(1) in requests regardless of fan-out width. - Updated dependencies \[[`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph-sdk@1.9.17 ## @langchain/svelte@1.0.17 ### Patch Changes - [#2494](https://github.com/langchain-ai/langgraphjs/pull/2494) [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): revive automatic optimistic submit echo Echo `submit()` input into `values` / `messages` immediately with client-side id minting and id-based reconciliation as the server streams back. Expose per-message `optimisticStatus` via message metadata (`pending` → `sent` / `failed`), shallow-merge non-message keys with rollback when no `values` arrive, and add an `optimistic: false` hook opt-out. Plumb through React, Vue, Svelte, and Angular with browser e2e coverage. - [#2497](https://github.com/langchain-ai/langgraphjs/pull/2497) [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): reconcile subagents and subgraphs on thread reconnect Seed deep-agent subagent cards from checkpoint messages and subgraph hosts from a single bounded `getHistory` read during `hydrate()`, so parallel fan-out discovery reappears immediately on refresh instead of waiting for SSE replay. Subagent execution namespaces are promoted through the existing guarded discovery state machine (bulk at hydrate, lazily per opened card via the selector layer). The getHistory cost is O(1) in requests regardless of fan-out width. - Updated dependencies \[[`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph-sdk@1.9.17 ## @langchain/vue@1.0.17 ### Patch Changes - [#2494](https://github.com/langchain-ai/langgraphjs/pull/2494) [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): revive automatic optimistic submit echo Echo `submit()` input into `values` / `messages` immediately with client-side id minting and id-based reconciliation as the server streams back. Expose per-message `optimisticStatus` via message metadata (`pending` → `sent` / `failed`), shallow-merge non-message keys with rollback when no `values` arrive, and add an `optimistic: false` hook opt-out. Plumb through React, Vue, Svelte, and Angular with browser e2e coverage. - [#2497](https://github.com/langchain-ai/langgraphjs/pull/2497) [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31) Thanks [@christian-bromann](https://github.com/christian-bromann)! - fix(sdk): reconcile subagents and subgraphs on thread reconnect Seed deep-agent subagent cards from checkpoint messages and subgraph hosts from a single bounded `getHistory` read during `hydrate()`, so parallel fan-out discovery reappears immediately on refresh instead of waiting for SSE replay. Subagent execution namespaces are promoted through the existing guarded discovery state machine (bulk at hydrate, lazily per opened card via the selector layer). The getHistory cost is O(1) in requests regardless of fan-out width. - Updated dependencies \[[`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph-sdk@1.9.17 ## @langchain/langgraph-ui@1.2.5 ## @example/ai-elements@0.1.32 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph@1.3.6 - @langchain/react@1.0.17 ## @examples/assistant-ui-claude@0.1.32 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph@1.3.6 - @langchain/react@1.0.17 ## @examples/ui-angular@0.0.42 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph@1.3.6 - @langchain/langgraph-sdk@1.9.17 - @langchain/angular@1.0.17 ## @examples/ui-multimodal@0.0.18 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph@1.3.6 - @langchain/react@1.0.17 ## @examples/ui-react@0.0.18 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`0a0e04e`](https://github.com/langchain-ai/langgraphjs/commit/0a0e04e9ff7e82fd08411cc0094e1f94729a1e1e), [`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f), [`a9aa8d6`](https://github.com/langchain-ai/langgraphjs/commit/a9aa8d6a9b23f5f7d4c56889fa68697b1e076b31)]: - @langchain/langgraph@1.3.6 - @langchain/langgraph-sdk@1.9.17 - @langchain/react@1.0.17 ## langgraph@1.0.38 ### Patch Changes - Updated dependencies \[[`658a076`](https://github.com/langchain-ai/langgraphjs/commit/658a076d5b50af9f5b96ab99f26ed629da6e182f)]: - @langchain/langgraph@1.3.6 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
AI Elements — Tool-Calling Agent Example
A self-contained chat interface built with AI Elements components and @langchain/react. It demonstrates how to build a production-quality agentic UI using AI Elements' composable component library.
What it shows
- Tool call rendering — each tool invocation is displayed with
Tool+ToolHeader+ToolContent+ToolInput+ToolOutput, updating live as the agent streams tool input and then the result. - Reasoning display — when the model emits reasoning tokens, a collapsible
Reasoningblock auto-opens during streaming and collapses when done. - Streaming messages —
Message+MessageContent+MessageResponserenders streaming markdown via Streamdown with full GFM support. - Loading skeleton — a
Shimmerplaceholder appears between the user's message and the first assistant token. - Conversation scroll —
Conversation+ConversationContent+ConversationScrollButtonauto-scrolls and shows a jump-to-bottom button when you scroll up. - Message actions —
MessageActions+MessageActionwith a copy button appears below the last assistant message once streaming completes. - Prompt input —
PromptInput+PromptInputBody+PromptInputTextarea+PromptInputFooter+PromptInputSubmitprovides a full-featured input bar. - Suggestions —
Suggestions+Suggestionshows preset prompts before the first message.
Agent
The backing LangGraph agent (packages/agents/src/agents/ai-elements.ts) is a createReactAgent with two simulated tools:
| Tool | Description |
|---|---|
get_weather |
Returns deterministic simulated weather data for any city |
web_search |
Returns three simulated search result objects for any query |
No external API keys are required for the tools.
Setup
Create a .env file in this folder (optional — defaults are provided):
VITE_LANGGRAPH_API_URL=http://localhost:2024 # default when running locally
VITE_LANGGRAPH_ASSISTANT_ID=ai_elements # matches langgraph.json
Run
Start the LangGraph agent server first:
bun run dev --filter=@langchain/playground-agents
Then start this preview app:
bun run dev --filter=@langchain/playground-preview-ai-elements
Open http://localhost:4600.
AI Elements components used
| Component | Source file |
|---|---|
Conversation, ConversationContent, ConversationScrollButton |
src/components/ai-elements/conversation.tsx |
Message, MessageContent, MessageResponse, MessageActions, MessageAction |
src/components/ai-elements/message.tsx |
PromptInput, PromptInputBody, PromptInputTextarea, PromptInputFooter, PromptInputSubmit |
src/components/ai-elements/prompt-input.tsx |
Tool, ToolHeader, ToolContent, ToolInput, ToolOutput |
src/components/ai-elements/tool.tsx |
Reasoning, ReasoningTrigger, ReasoningContent |
src/components/ai-elements/reasoning.tsx |
Suggestions, Suggestion |
src/components/ai-elements/suggestion.tsx |
Shimmer |
src/components/ai-elements/shimmer.tsx |
Components live in src/components/ai-elements/ and are owned by this package (shadcn/AI Elements registry style — copy-paste, not a node_modules import).
Vite path alias
AI Elements components use bare src/ imports (e.g. import { cn } from "src/lib/utils"). The vite.config.ts maps src → ./src to resolve these correctly in both dev and production builds.