@assistant-ui/mcp-docs-server 0.1.30 → 0.1.31

package/.docs/raw/docs/runtimes/helicone.mdx

@@ -1,61 +0,0 @@
----
-title: Helicone
-description: Configure Helicone proxy for OpenAI API logging and monitoring.
----
-
-Helicone acts as a proxy for your OpenAI API calls, enabling detailed logging and monitoring. To integrate, update your API base URL and add the Helicone-Auth header.
-
-## AI SDK by vercel
-
-1. **Set Environment Variables:**
-
-   - `HELICONE_API_KEY`
-   - `OPENAI_API_KEY`
-
-2. **Configure the OpenAI client:**
-
-```ts
-import { createOpenAI } from "@ai-sdk/openai";
-import { streamText } from "ai";
-
-const openai = createOpenAI({
-  baseURL: "https://oai.helicone.ai/v1",
-  headers: {
-    "Helicone-Auth": `Bearer ${process.env.HELICONE_API_KEY}`,
-  },
-});
-
-export async function POST(req: Request) {
-  const { prompt } = await req.json();
-  return streamText({
-    model: openai("gpt-4o"),
-    prompt,
-  }).toUIMessageStreamResponse();
-}
-```
-
-## LangChain Integration (Python)
-
-1. **Set Environment Variables:**
-
-   - `HELICONE_API_KEY`
-   - `OPENAI_API_KEY`
-
-2. **Configure ChatOpenAI:**
-
-```python
-from langchain_openai import ChatOpenAI
-import os
-
-llm = ChatOpenAI(
-    model_name="gpt-4o",
-    temperature=0,
-    base_url="https://oai.helicone.ai/v1",
-    api_key=os.environ["OPENAI_API_KEY"],
-    default_headers={"Helicone-Auth": f"Bearer {os.environ['HELICONE_API_KEY']}"}
-)
-```
-
-## Summary
-
-Update your API base URL to `https://oai.helicone.ai/v1` and add the `Helicone-Auth` header with your API key either in your Vercel AI SDK or LangChain configuration.

package/.docs/raw/docs/runtimes/langchain/comparison.mdx

@@ -1,60 +0,0 @@
----
-title: Comparison with `react-langgraph`
-description: How `@assistant-ui/react-langchain` differs from `@assistant-ui/react-langgraph`.
----
-
-Both packages connect assistant-ui to LangGraph backends. They are **independent adapters for different upstream libraries** — one is not a successor to the other.
-
-| Aspect                         | `@assistant-ui/react-langgraph`                              | `@assistant-ui/react-langchain`                       |
-| ------------------------------ | ------------------------------------------------------------ | ----------------------------------------------------- |
-| Wraps                          | `@langchain/langgraph-sdk` (raw SDK)                         | `@langchain/react` (`useStream` hook)                 |
-| Age                            | Sept 2024 onward                                             | April 2026 onward                                     |
-| Version                        | `0.13.x`                                                     | `0.0.x`                                               |
-| Lines of source                | ~7,500                                                       | ~600                                                  |
-| Built on                       | `useExternalStoreRuntime`                                    | `useExternalStoreRuntime`                             |
-| `create-assistant-ui` template | `-t langgraph` ships this package                            | No template yet                                       |
-
-## Feature coverage
-
-| Feature                                 | `react-langgraph`                | `react-langchain`                   |
-| --------------------------------------- | -------------------------------- | ----------------------------------- |
-| Stream messages                         | ✅ `useLangGraphRuntime`          | ✅ `useStreamRuntime`                |
-| Interrupt state                         | ✅ `useLangGraphInterruptState`   | ✅ `useLangChainInterruptState`      |
-| Send raw state update / resume command  | ✅ `useLangGraphSendCommand`      | ✅ `useLangChainSubmit`              |
-| Read arbitrary custom state key         | ❌                                | ✅ `useLangChainState<T>(key)`       |
-| Per-message metadata (`messages-tuple`) | ✅ `useLangGraphMessageMetadata`  | ❌ not exposed                       |
-| Generative UI messages (LangSmith)      | ✅ `useLangGraphUIMessages`       | ❌ not exposed                       |
-| Subgraph / namespaced stream events     | ✅ via `eventHandlers`            | ❌ not exposed                       |
-| End-to-end cancellation primitive       | ✅ `unstable_createLangGraphStream` | ❌ not exposed                     |
-| Message accumulator utility             | ✅ `LangGraphMessageAccumulator`  | ❌ not exposed                       |
-| Cloud thread persistence                | ✅ `cloud` option                 | ✅ `cloud` option                    |
-
-`react-langchain` is the newer, thinner wrapper — it delegates to the upstream `useStream` hook rather than re-implementing the stream plumbing. That is why its footprint is smaller and its surface area is narrower today. Features that exist in `react-langgraph` but not `react-langchain` are absent because they have not yet been ported, not because they are deprecated.
-
-## Choosing between them
-
-Use `@assistant-ui/react-langgraph` when:
-
-- You are scaffolding via `npx create-assistant-ui -t langgraph`.
-- You want the broader feature set today (subgraph events, UI messages, message metadata, cancellation).
-- You prefer integrating with `@langchain/langgraph-sdk` directly.
-
-Use `@assistant-ui/react-langchain` when:
-
-- Your app already depends on `@langchain/react` and uses `useStream` elsewhere.
-- You want to read custom state keys (`todos`, `files`, plans, ...) with `useLangChainState<T>(key)` without reconstructing them from tool-call streams.
-- You prefer a thin wrapper that stays pinned to upstream behavior.
-
-## Hook name mapping
-
-If you are moving code between the two adapters, most hooks have a counterpart — but note the feature gaps above.
-
-| `react-langgraph`                  | `react-langchain`                   | Notes                                                       |
-| ---------------------------------- | ----------------------------------- | ----------------------------------------------------------- |
-| `useLangGraphRuntime`              | `useStreamRuntime`                  | Options extend upstream `UseStreamOptions`; no `stream` / `create` / `load` to write. |
-| `useLangGraphInterruptState`       | `useLangChainInterruptState`        | Same return shape: `{ value?: unknown } \| undefined`.      |
-| `useLangGraphSendCommand`          | `useLangChainSubmit`                | `submit(values, { command })` replaces the dedicated hook.  |
-| `useLangGraphSend`                 | _(use `runtime.thread.append`)_     | No direct equivalent; send turns through the runtime.       |
-| `useLangGraphMessageMetadata`      | _(not available)_                   | Open an issue if you rely on this.                          |
-| `useLangGraphUIMessages`           | _(not available)_                   | Open an issue if you rely on this.                          |
-| _(none)_                           | `useLangChainState<T>(key)`         | New — reads any custom state key reactively.                |

package/.docs/raw/docs/runtimes/langchain/index.mdx

@@ -1,210 +0,0 @@
----
-title: Getting Started
-description: Adapter for LangChain's `useStream` hook, exposed as an assistant-ui runtime.
----
-
-`@assistant-ui/react-langchain` wraps [`useStream`](https://docs.langchain.com/oss/javascript/langgraph-sdk/react-stream) from `@langchain/react` and exposes it as an assistant-ui runtime. Use this package if you are already integrating your app with `@langchain/react` and want assistant-ui on top of the upstream hook.
-
-<Callout type="info">
-  assistant-ui ships two adapters for LangGraph backends:
-  - **[`@assistant-ui/react-langgraph`](/docs/runtimes/langgraph)** integrates with `@langchain/langgraph-sdk` directly and exposes features like subgraph events, UI messages, message metadata, and end-to-end cancellation.
-  - **`@assistant-ui/react-langchain`** (this page) wraps `@langchain/react`'s `useStream`. It is lighter-weight and stays aligned with upstream, but currently does not expose every `react-langgraph` feature.
-
-  See [the comparison doc](/docs/runtimes/langchain/comparison) for a feature gap table.
-</Callout>
-
-## Requirements
-
-You need a LangGraph Cloud API server. You can start a server locally via [LangGraph Studio](https://github.com/langchain-ai/langgraph-studio) or use [LangSmith](https://www.langchain.com/langsmith) for a hosted version.
-
-The state of the graph you are using must have a `messages` key with a list of LangChain-alike messages (or pass a custom `messagesKey`).
-
-## Installation
-
-<Steps>
-  <Step>
-
-### Install dependencies
-
-<InstallCommand npm={["@assistant-ui/react", "@assistant-ui/react-langchain", "@langchain/react", "@langchain/langgraph-sdk"]} />
-
-  </Step>
-  <Step>
-
-### Define a `MyAssistant` component
-
-```tsx title="@/components/MyAssistant.tsx"
-"use client";
-
-import { Thread } from "@/components/assistant-ui/thread";
-import { AssistantRuntimeProvider } from "@assistant-ui/react";
-import { useStreamRuntime } from "@assistant-ui/react-langchain";
-
-export function MyAssistant() {
-  const runtime = useStreamRuntime({
-    assistantId: process.env["NEXT_PUBLIC_LANGGRAPH_ASSISTANT_ID"]!,
-    apiUrl: process.env["NEXT_PUBLIC_LANGGRAPH_API_URL"],
-  });
-
-  return (
-    <AssistantRuntimeProvider runtime={runtime}>
-      <Thread />
-    </AssistantRuntimeProvider>
-  );
-}
-```
-
-  </Step>
-  <Step>
-
-### Use the `MyAssistant` component
-
-```tsx title="@/app/page.tsx"
-import { MyAssistant } from "@/components/MyAssistant";
-
-export default function Home() {
-  return (
-    <main className="h-dvh">
-      <MyAssistant />
-    </main>
-  );
-}
-```
-
-  </Step>
-  <Step>
-
-### Set environment variables
-
-Create a `.env.local` file in your project with the following variables:
-
-```sh
-NEXT_PUBLIC_LANGGRAPH_API_URL=http://localhost:2024
-NEXT_PUBLIC_LANGGRAPH_ASSISTANT_ID=your_graph_id
-```
-
-  </Step>
-  <Step>
-
-### Set up UI components
-
-Follow the [UI Components](/docs/ui/thread) guide to set up the UI components.
-
-  </Step>
-</Steps>
-
-## `useStreamRuntime` options
-
-`useStreamRuntime` accepts every option [`useStream`](https://docs.langchain.com/oss/javascript/langgraph-sdk/react-stream) from `@langchain/react` does, plus three assistant-ui-specific fields:
-
-| Option        | Type                                           | Description                                                              |
-| ------------- | ---------------------------------------------- | ------------------------------------------------------------------------ |
-| `cloud`       | `AssistantCloud`                               | Optional — persists threads via assistant-cloud.                         |
-| `adapters`    | `{ attachments?, speech?, feedback? }`         | Optional — attachment, speech, and feedback adapters.                    |
-| `messagesKey` | `string`                                       | The state key that holds messages. Defaults to `"messages"`.             |
-
-## Reading custom state keys
-
-LangGraph agents often expose structured state beyond messages (plans, todos, scratch files, generative-UI artifacts). Read them directly with `useLangChainState`. It mirrors `useStream().values[key]` upstream and updates when the stream emits new state.
-
-```tsx
-import { useLangChainState } from "@assistant-ui/react-langchain";
-
-type Todo = { id: string; title: string; done: boolean };
-
-function TodoList() {
-  const todos = useLangChainState<Todo[]>("todos", []);
-
-  return (
-    <ul>
-      {todos.map((t) => (
-        <li key={t.id}>
-          {t.done ? "✓" : "○"} {t.title}
-        </li>
-      ))}
-    </ul>
-  );
-}
-```
-
-Signatures:
-
-```ts
-useLangChainState<T>(key: string): T | undefined;
-useLangChainState<T>(key: string, defaultValue: T): T;
-```
-
-This hook is especially useful with the [`deepagents`](https://docs.langchain.com/oss/python/deepagents) middleware, whose `write_todos` step updates `state.todos` alongside the tool-call stream. Reading the state key directly avoids reconstructing the list from partial tool-call args.
-
-<Callout type="info">
-  Added in v0.0.2 — see issue [#3862](https://github.com/assistant-ui/assistant-ui/issues/3862) for motivation.
-</Callout>
-
-## Interrupts
-
-LangGraph interrupts pause the graph and wait for client input. `useLangChainInterruptState` exposes the current interrupt; `useLangChainSubmit` resumes the graph with a raw state update.
-
-```tsx
-import {
-  useLangChainInterruptState,
-  useLangChainSubmit,
-} from "@assistant-ui/react-langchain";
-import { Command } from "@langchain/langgraph-sdk";
-
-function InterruptPrompt() {
-  const interrupt = useLangChainInterruptState();
-  const submit = useLangChainSubmit();
-
-  if (!interrupt) return null;
-
-  return (
-    <div>
-      <pre>{JSON.stringify(interrupt.value, null, 2)}</pre>
-      <button
-        onClick={() =>
-          submit(null, { command: new Command({ resume: "approved" }) })
-        }
-      >
-        Approve
-      </button>
-    </div>
-  );
-}
-```
-
-## Message conversion
-
-`convertLangChainBaseMessage` transforms a LangChain `BaseMessage` into an assistant-ui message. Use it when building a custom `ExternalStoreAdapter` that needs to consume LangChain messages outside of `useStreamRuntime`.
-
-```ts
-import { convertLangChainBaseMessage } from "@assistant-ui/react-langchain";
-```
-
-## Cloud persistence
-
-Pass an `AssistantCloud` instance to persist threads across sessions. The runtime automatically wires thread list management and resumes state from the cloud.
-
-```tsx
-import { AssistantCloud } from "assistant-cloud";
-import { useStreamRuntime } from "@assistant-ui/react-langchain";
-
-const cloud = new AssistantCloud({ baseUrl: "/api/cloud" });
-
-const runtime = useStreamRuntime({
-  cloud,
-  assistantId: "agent",
-  apiUrl: "http://localhost:2024",
-});
-```
-
-## Custom `messagesKey`
-
-If your graph stores messages under a non-default key, pass `messagesKey` so the runtime submits tool results and human turns to the correct state slot:
-
-```tsx
-const runtime = useStreamRuntime({
-  assistantId: "agent",
-  apiUrl: "http://localhost:2024",
-  messagesKey: "chat_messages",
-});
-```