@assistant-ui/mcp-docs-server 0.2.1 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.docs/organized/code-examples/waterfall.md +1 -1
- package/.docs/organized/code-examples/with-a2a.md +2 -2
- package/.docs/organized/code-examples/with-ag-ui.md +3 -3
- package/.docs/organized/code-examples/with-ai-sdk-v7.md +5 -5
- package/.docs/organized/code-examples/with-artifacts.md +5 -5
- package/.docs/organized/code-examples/with-assistant-transport.md +3 -3
- package/.docs/organized/code-examples/with-browser-extension.md +4 -4
- package/.docs/organized/code-examples/with-chain-of-thought.md +5 -5
- package/.docs/organized/code-examples/with-cloud-standalone.md +5 -5
- package/.docs/organized/code-examples/with-cloud.md +5 -5
- package/.docs/organized/code-examples/with-custom-thread-list.md +6 -6
- package/.docs/organized/code-examples/with-elevenlabs-conversational.md +7 -7
- package/.docs/organized/code-examples/with-elevenlabs-scribe.md +8 -8
- package/.docs/organized/code-examples/with-eve.md +3 -3
- package/.docs/organized/code-examples/with-expo.md +13 -19
- package/.docs/organized/code-examples/with-external-store.md +3 -3
- package/.docs/organized/code-examples/with-ffmpeg.md +5 -5
- package/.docs/organized/code-examples/with-generative-ui.md +259 -23
- package/.docs/organized/code-examples/with-google-adk.md +2 -2
- package/.docs/organized/code-examples/with-heat-graph.md +1 -1
- package/.docs/organized/code-examples/with-image-generation.md +4 -4
- package/.docs/organized/code-examples/with-interactables.md +5 -5
- package/.docs/organized/code-examples/with-langchain.md +7 -7
- package/.docs/organized/code-examples/with-langgraph.md +4 -4
- package/.docs/organized/code-examples/with-livekit.md +7 -7
- package/.docs/organized/code-examples/with-mcp.md +6 -6
- package/.docs/organized/code-examples/with-nuxt.md +500 -564
- package/.docs/organized/code-examples/with-opencode.md +2 -2
- package/.docs/organized/code-examples/with-openui.md +449 -0
- package/.docs/organized/code-examples/with-pi.md +2 -2
- package/.docs/organized/code-examples/with-react-hook-form.md +7 -7
- package/.docs/organized/code-examples/with-react-ink-web.md +4 -4
- package/.docs/organized/code-examples/with-react-ink.md +2 -2
- package/.docs/organized/code-examples/with-react-router.md +4 -4
- package/.docs/organized/code-examples/with-resumable-stream.md +7 -7
- package/.docs/organized/code-examples/with-store.md +1 -1
- package/.docs/organized/code-examples/with-svelte.md +415 -0
- package/.docs/organized/code-examples/with-sveltekit.md +1061 -0
- package/.docs/organized/code-examples/with-tanstack.md +5 -5
- package/.docs/organized/code-examples/with-tap-runtime.md +2 -2
- package/.docs/organized/code-examples/with-virtualized-thread.md +2 -2
- package/.docs/organized/code-examples/with-vue.md +1 -1
- package/.docs/raw/docs/(docs)/cli.mdx +6 -1
- package/.docs/raw/docs/(docs)/installation.mdx +2 -2
- package/.docs/raw/docs/(reference)/api-reference/generative-ui/slack.mdx +5 -1
- package/.docs/raw/docs/(reference)/api-reference/generative-ui/teams.mdx +9 -2
- package/.docs/raw/docs/(reference)/api-reference/hooks/primitives.mdx +2 -2
- package/.docs/raw/docs/(reference)/api-reference/integrations/eve.mdx +39 -1
- package/.docs/raw/docs/(reference)/api-reference/integrations/react-ai-sdk.mdx +29 -4
- package/.docs/raw/docs/(reference)/api-reference/tools/status.mdx +1 -1
- package/.docs/raw/docs/(reference)/api-reference/utilities/miscellaneous.mdx +29 -1
- package/.docs/raw/docs/(reference)/api-reference/voice/session.mdx +1 -1
- package/.docs/raw/docs/cloud/ai-sdk-assistant-ui.mdx +1 -1
- package/.docs/raw/docs/cloud/ai-sdk.mdx +2 -2
- package/.docs/raw/docs/cloud/index.mdx +1 -1
- package/.docs/raw/docs/guides/attachments.mdx +2 -2
- package/.docs/raw/docs/guides/context-api.mdx +15 -17
- package/.docs/raw/docs/guides/dictation.mdx +1 -1
- package/.docs/raw/docs/guides/mentions.mdx +2 -0
- package/.docs/raw/docs/guides/suggestions.mdx +6 -3
- package/.docs/raw/docs/ink/primitives.mdx +1 -1
- package/.docs/raw/docs/integrations/persistence/custom-adapter.mdx +146 -128
- package/.docs/raw/docs/migrations/v0-15.mdx +34 -0
- package/.docs/raw/docs/primitives/suggestion.mdx +3 -1
- package/.docs/raw/docs/primitives/thread.mdx +1 -1
- package/.docs/raw/docs/runtimes/ag-ui/runtime-options.mdx +35 -5
- package/.docs/raw/docs/runtimes/claude-managed-agents.mdx +118 -0
- package/.docs/raw/docs/runtimes/concepts/stability.mdx +2 -1
- package/.docs/raw/docs/runtimes/concepts/threads.mdx +68 -28
- package/.docs/raw/docs/runtimes/custom/assistant-transport.mdx +1 -1
- package/.docs/raw/docs/runtimes/custom/external-store.mdx +6 -2
- package/.docs/raw/docs/runtimes/langchain.mdx +1 -1
- package/.docs/raw/docs/runtimes/langgraph/streaming.mdx +4 -0
- package/.docs/raw/docs/runtimes/pick-a-runtime.mdx +8 -1
- package/.docs/raw/docs/tools/defining-tools.mdx +19 -0
- package/.docs/raw/docs/tools/generative-ui-primitive.mdx +180 -0
- package/.docs/raw/docs/tools/generative-ui-slack.mdx +167 -0
- package/.docs/raw/docs/tools/generative-ui-teams.mdx +160 -0
- package/.docs/raw/docs/tools/generative-ui.mdx +224 -211
- package/.docs/raw/docs/tools/index.mdx +2 -1
- package/.docs/raw/docs/tools/interactables.mdx +5 -4
- package/.docs/raw/docs/tools/openui.mdx +175 -0
- package/.docs/raw/docs/tools/tool-ui.mdx +1 -2
- package/.docs/raw/docs/tools/user-managed-mcp.mdx +5 -1
- package/.docs/raw/docs/ui/attachment.mdx +27 -0
- package/.docs/raw/docs/ui/file.mdx +1 -1
- package/.docs/raw/docs/ui/image.mdx +1 -1
- package/package.json +4 -4
- package/.docs/raw/docs/tools/interactables-legacy.mdx +0 -423
|
@@ -45,7 +45,7 @@ export async function POST(req: Request) {
|
|
|
45
45
|
});
|
|
46
46
|
|
|
47
47
|
const result = streamText({
|
|
48
|
-
model: openai("gpt-5.
|
|
48
|
+
model: openai("gpt-5.6-luna"),
|
|
49
49
|
messages: await convertToModelMessages(messages),
|
|
50
50
|
stopWhen: stepCountIs(10),
|
|
51
51
|
...(system ? { system } : {}),
|
|
@@ -112,6 +112,50 @@ export async function POST(req: Request) {
|
|
|
112
112
|
|
|
113
113
|
```
|
|
114
114
|
|
|
115
|
+
## app/api/present/route.ts
|
|
116
|
+
|
|
117
|
+
```typescript
|
|
118
|
+
import { openai } from "@ai-sdk/openai";
|
|
119
|
+
import { streamText, convertToModelMessages, stepCountIs } from "ai";
|
|
120
|
+
import type { UIMessage } from "ai";
|
|
121
|
+
import {
|
|
122
|
+
AISDKToolkit,
|
|
123
|
+
type AISDKToolkitToolsOptions,
|
|
124
|
+
} from "@assistant-ui/react-ai-sdk";
|
|
125
|
+
import presentToolkit from "../../present-toolkit";
|
|
126
|
+
|
|
127
|
+
export const maxDuration = 30;
|
|
128
|
+
|
|
129
|
+
const aiToolkit = new AISDKToolkit({ toolkit: presentToolkit });
|
|
130
|
+
|
|
131
|
+
type FrontendToolDefs = NonNullable<AISDKToolkitToolsOptions["frontend"]>;
|
|
132
|
+
|
|
133
|
+
export async function POST(req: Request) {
|
|
134
|
+
const {
|
|
135
|
+
messages,
|
|
136
|
+
system,
|
|
137
|
+
tools: clientTools,
|
|
138
|
+
}: {
|
|
139
|
+
messages: UIMessage[];
|
|
140
|
+
system?: string;
|
|
141
|
+
tools?: FrontendToolDefs;
|
|
142
|
+
} = await req.json();
|
|
143
|
+
|
|
144
|
+
const result = streamText({
|
|
145
|
+
model: openai("gpt-5.6-luna"),
|
|
146
|
+
messages: await convertToModelMessages(messages),
|
|
147
|
+
stopWhen: stepCountIs(10),
|
|
148
|
+
...(system ? { system } : {}),
|
|
149
|
+
tools: await aiToolkit.tools({
|
|
150
|
+
...(clientTools && { frontend: clientTools }),
|
|
151
|
+
}),
|
|
152
|
+
});
|
|
153
|
+
|
|
154
|
+
return result.toUIMessageStreamResponse();
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
```
|
|
158
|
+
|
|
115
159
|
## app/globals.css
|
|
116
160
|
|
|
117
161
|
```css
|
|
@@ -325,12 +369,13 @@ export default function GuiChatPage() {
|
|
|
325
369
|
|
|
326
370
|
```tsx
|
|
327
371
|
import type { Metadata } from "next";
|
|
372
|
+
import { GenerativeUIStyle } from "@/components/generative-ui-style";
|
|
328
373
|
import "./globals.css";
|
|
329
374
|
|
|
330
375
|
export const metadata: Metadata = {
|
|
331
376
|
title: "assistant-ui Generative UI Example",
|
|
332
377
|
description:
|
|
333
|
-
"Example showcasing
|
|
378
|
+
"Example showcasing model-composed interfaces with the present tool and a custom component vocabulary",
|
|
334
379
|
};
|
|
335
380
|
|
|
336
381
|
export default function RootLayout({
|
|
@@ -340,6 +385,9 @@ export default function RootLayout({
|
|
|
340
385
|
}>) {
|
|
341
386
|
return (
|
|
342
387
|
<html lang="en">
|
|
388
|
+
<head>
|
|
389
|
+
<GenerativeUIStyle />
|
|
390
|
+
</head>
|
|
343
391
|
<body className="h-dvh">{children}</body>
|
|
344
392
|
</html>
|
|
345
393
|
);
|
|
@@ -359,13 +407,17 @@ import {
|
|
|
359
407
|
Suggestions,
|
|
360
408
|
Tools,
|
|
361
409
|
} from "@assistant-ui/react";
|
|
362
|
-
import {
|
|
410
|
+
import {
|
|
411
|
+
AssistantChatTransport,
|
|
412
|
+
useChatRuntime,
|
|
413
|
+
} from "@assistant-ui/react-ai-sdk";
|
|
363
414
|
import { lastAssistantMessageIsCompleteWithToolCalls } from "ai";
|
|
364
415
|
import { ExampleNav } from "@/components/example-nav";
|
|
365
|
-
import toolkit from "./toolkit";
|
|
416
|
+
import toolkit from "./present-toolkit";
|
|
366
417
|
|
|
367
418
|
export default function Home() {
|
|
368
419
|
const runtime = useChatRuntime({
|
|
420
|
+
transport: new AssistantChatTransport({ api: "/api/present" }),
|
|
369
421
|
sendAutomaticallyWhen: lastAssistantMessageIsCompleteWithToolCalls,
|
|
370
422
|
});
|
|
371
423
|
|
|
@@ -373,26 +425,28 @@ export default function Home() {
|
|
|
373
425
|
tools: Tools({ toolkit }),
|
|
374
426
|
suggestions: Suggestions([
|
|
375
427
|
{
|
|
376
|
-
title: "
|
|
377
|
-
label: "
|
|
428
|
+
title: "Sales dashboard",
|
|
429
|
+
label: "for last quarter",
|
|
378
430
|
prompt:
|
|
379
|
-
"
|
|
431
|
+
"Show me a Q2 2026 sales dashboard. Revenue was $412k in April, $488k in May and $551k in June, on 1,284 orders, at a 3.4% conversion rate.",
|
|
380
432
|
},
|
|
381
433
|
{
|
|
382
|
-
title: "
|
|
383
|
-
label: "
|
|
384
|
-
prompt:
|
|
434
|
+
title: "Product analytics",
|
|
435
|
+
label: "activation and retention",
|
|
436
|
+
prompt:
|
|
437
|
+
"How did we trend over the last six weeks? Activation went 41%, 44%, 43%, 48%, 52%, 55%, and week-4 retention went 22%, 24%, 23%, 27%, 29%, 31%.",
|
|
385
438
|
},
|
|
386
439
|
{
|
|
387
|
-
title: "
|
|
388
|
-
label: "
|
|
440
|
+
title: "Support overview",
|
|
441
|
+
label: "tickets and response time",
|
|
389
442
|
prompt:
|
|
390
|
-
"
|
|
443
|
+
"Give me a support overview. Open tickets: 12 urgent, 38 high, 91 normal, 24 low. Median first response is 47 minutes, down from 62 last week.",
|
|
391
444
|
},
|
|
392
445
|
{
|
|
393
|
-
title: "
|
|
394
|
-
label: "
|
|
395
|
-
prompt:
|
|
446
|
+
title: "Channel performance",
|
|
447
|
+
label: "compare acquisition sources",
|
|
448
|
+
prompt:
|
|
449
|
+
"Compare our acquisition channels. Search: $18k spend, 420 conversions. Social: $11k, 260. Email: $3k, 190. Referral: $6k, 150.",
|
|
396
450
|
},
|
|
397
451
|
]),
|
|
398
452
|
});
|
|
@@ -411,6 +465,60 @@ export default function Home() {
|
|
|
411
465
|
|
|
412
466
|
```
|
|
413
467
|
|
|
468
|
+
## app/present-toolkit.tsx
|
|
469
|
+
|
|
470
|
+
```tsx
|
|
471
|
+
"use generative";
|
|
472
|
+
|
|
473
|
+
import { defineToolkit } from "@assistant-ui/react";
|
|
474
|
+
import {
|
|
475
|
+
JSONGenerativeUI,
|
|
476
|
+
defaultGenerativeUILibrary,
|
|
477
|
+
defineGenerativeComponents,
|
|
478
|
+
} from "@assistant-ui/react-generative-ui";
|
|
479
|
+
import { styledGenerativeUILibrary } from "@/components/assistant-ui/generative-ui";
|
|
480
|
+
import { DashboardHeader } from "@/components/dashboard-header";
|
|
481
|
+
import { z } from "zod";
|
|
482
|
+
|
|
483
|
+
const markdown = defaultGenerativeUILibrary.Markdown!;
|
|
484
|
+
|
|
485
|
+
const generative = new JSONGenerativeUI({
|
|
486
|
+
library: {
|
|
487
|
+
...defaultGenerativeUILibrary,
|
|
488
|
+
...defineGenerativeComponents({
|
|
489
|
+
Markdown: {
|
|
490
|
+
properties: markdown.properties,
|
|
491
|
+
streamProperties: markdown.streamProperties,
|
|
492
|
+
description:
|
|
493
|
+
"A markdown string, rendered with GitHub-flavored markdown.",
|
|
494
|
+
render: styledGenerativeUILibrary.Markdown!.render,
|
|
495
|
+
},
|
|
496
|
+
DashboardHeader: {
|
|
497
|
+
description:
|
|
498
|
+
"A heading for a dashboard, with an optional description and reporting period.",
|
|
499
|
+
properties: z.object({
|
|
500
|
+
title: z.string().describe("The dashboard title."),
|
|
501
|
+
description: z
|
|
502
|
+
.string()
|
|
503
|
+
.optional()
|
|
504
|
+
.describe("A short description of the dashboard."),
|
|
505
|
+
period: z
|
|
506
|
+
.string()
|
|
507
|
+
.optional()
|
|
508
|
+
.describe("The reporting period shown beside the title."),
|
|
509
|
+
}),
|
|
510
|
+
render: (props) => <DashboardHeader {...props} />,
|
|
511
|
+
},
|
|
512
|
+
}),
|
|
513
|
+
},
|
|
514
|
+
});
|
|
515
|
+
|
|
516
|
+
export default defineToolkit({
|
|
517
|
+
present: generative.present({ display: "standalone" }),
|
|
518
|
+
});
|
|
519
|
+
|
|
520
|
+
```
|
|
521
|
+
|
|
414
522
|
## app/primitive/page.tsx
|
|
415
523
|
|
|
416
524
|
```tsx
|
|
@@ -512,6 +620,70 @@ export default function GenerativeUIPrimitivePage() {
|
|
|
512
620
|
|
|
513
621
|
```
|
|
514
622
|
|
|
623
|
+
## app/tool-ui/page.tsx
|
|
624
|
+
|
|
625
|
+
```tsx
|
|
626
|
+
"use client";
|
|
627
|
+
|
|
628
|
+
import { Thread } from "@/components/assistant-ui/thread";
|
|
629
|
+
import {
|
|
630
|
+
AssistantRuntimeProvider,
|
|
631
|
+
AuiConfig,
|
|
632
|
+
Suggestions,
|
|
633
|
+
Tools,
|
|
634
|
+
} from "@assistant-ui/react";
|
|
635
|
+
import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
|
|
636
|
+
import { lastAssistantMessageIsCompleteWithToolCalls } from "ai";
|
|
637
|
+
import { ExampleNav } from "@/components/example-nav";
|
|
638
|
+
import toolkit from "../toolkit";
|
|
639
|
+
|
|
640
|
+
export default function Home() {
|
|
641
|
+
const runtime = useChatRuntime({
|
|
642
|
+
sendAutomaticallyWhen: lastAssistantMessageIsCompleteWithToolCalls,
|
|
643
|
+
});
|
|
644
|
+
|
|
645
|
+
const config = AuiConfig({
|
|
646
|
+
tools: Tools({ toolkit }),
|
|
647
|
+
suggestions: Suggestions([
|
|
648
|
+
{
|
|
649
|
+
title: "Show a bar chart",
|
|
650
|
+
label: "of quarterly revenue",
|
|
651
|
+
prompt:
|
|
652
|
+
"Create a bar chart showing quarterly revenue: Q1 $45k, Q2 $52k, Q3 $61k, Q4 $58k",
|
|
653
|
+
},
|
|
654
|
+
{
|
|
655
|
+
title: "Pick a date",
|
|
656
|
+
label: "for a meeting",
|
|
657
|
+
prompt: "I need to schedule a meeting. Ask me to pick a date.",
|
|
658
|
+
},
|
|
659
|
+
{
|
|
660
|
+
title: "Collect my contact info",
|
|
661
|
+
label: "name, email, phone",
|
|
662
|
+
prompt:
|
|
663
|
+
"I want to sign up for the newsletter. Ask for my name, email, and phone number.",
|
|
664
|
+
},
|
|
665
|
+
{
|
|
666
|
+
title: "Show me on the map",
|
|
667
|
+
label: "the Eiffel Tower",
|
|
668
|
+
prompt: "Show me the Eiffel Tower on a map",
|
|
669
|
+
},
|
|
670
|
+
]),
|
|
671
|
+
});
|
|
672
|
+
|
|
673
|
+
return (
|
|
674
|
+
<AssistantRuntimeProvider config={config} runtime={runtime}>
|
|
675
|
+
<div className="flex h-full flex-col">
|
|
676
|
+
<ExampleNav />
|
|
677
|
+
<main className="min-h-0 flex-1">
|
|
678
|
+
<Thread />
|
|
679
|
+
</main>
|
|
680
|
+
</div>
|
|
681
|
+
</AssistantRuntimeProvider>
|
|
682
|
+
);
|
|
683
|
+
}
|
|
684
|
+
|
|
685
|
+
```
|
|
686
|
+
|
|
515
687
|
## app/toolkit.tsx
|
|
516
688
|
|
|
517
689
|
```tsx
|
|
@@ -1069,6 +1241,41 @@ export const ContactFormToolUI: ToolCallMessagePartComponent<
|
|
|
1069
1241
|
|
|
1070
1242
|
```
|
|
1071
1243
|
|
|
1244
|
+
## components/dashboard-header.tsx
|
|
1245
|
+
|
|
1246
|
+
```tsx
|
|
1247
|
+
"use client";
|
|
1248
|
+
|
|
1249
|
+
type DashboardHeaderProps = {
|
|
1250
|
+
title: string;
|
|
1251
|
+
description?: string;
|
|
1252
|
+
period?: string;
|
|
1253
|
+
};
|
|
1254
|
+
|
|
1255
|
+
export function DashboardHeader({
|
|
1256
|
+
title,
|
|
1257
|
+
description,
|
|
1258
|
+
period,
|
|
1259
|
+
}: DashboardHeaderProps) {
|
|
1260
|
+
return (
|
|
1261
|
+
<header className="flex flex-wrap items-start justify-between gap-3">
|
|
1262
|
+
<div className="min-w-0">
|
|
1263
|
+
<h2 className="text-lg font-semibold tracking-tight">{title}</h2>
|
|
1264
|
+
{description ? (
|
|
1265
|
+
<p className="text-muted-foreground mt-1 text-sm">{description}</p>
|
|
1266
|
+
) : null}
|
|
1267
|
+
</div>
|
|
1268
|
+
{period ? (
|
|
1269
|
+
<span className="bg-muted text-muted-foreground rounded-full px-2.5 py-1 text-xs font-medium">
|
|
1270
|
+
{period}
|
|
1271
|
+
</span>
|
|
1272
|
+
) : null}
|
|
1273
|
+
</header>
|
|
1274
|
+
);
|
|
1275
|
+
}
|
|
1276
|
+
|
|
1277
|
+
```
|
|
1278
|
+
|
|
1072
1279
|
## components/date-picker-tool-ui.tsx
|
|
1073
1280
|
|
|
1074
1281
|
```tsx
|
|
@@ -1141,9 +1348,10 @@ export const DatePickerToolUI: ToolCallMessagePartComponent<
|
|
|
1141
1348
|
import Link from "next/link";
|
|
1142
1349
|
|
|
1143
1350
|
const links = [
|
|
1144
|
-
{ href: "/", label: "
|
|
1145
|
-
{ href: "/
|
|
1146
|
-
{ href: "/
|
|
1351
|
+
{ href: "/", label: "Generative UI" },
|
|
1352
|
+
{ href: "/tool-ui", label: "Tool UI" },
|
|
1353
|
+
{ href: "/primitive", label: "Static primitive (legacy)" },
|
|
1354
|
+
{ href: "/gui-chat", label: "GUI chat (legacy)" },
|
|
1147
1355
|
] as const;
|
|
1148
1356
|
|
|
1149
1357
|
export function ExampleNav() {
|
|
@@ -1165,6 +1373,33 @@ export function ExampleNav() {
|
|
|
1165
1373
|
|
|
1166
1374
|
```
|
|
1167
1375
|
|
|
1376
|
+
## components/generative-ui-style.tsx
|
|
1377
|
+
|
|
1378
|
+
```tsx
|
|
1379
|
+
import {
|
|
1380
|
+
generativeUiCssText,
|
|
1381
|
+
generativeUiThemeVars,
|
|
1382
|
+
} from "@assistant-ui/ui/lib/generative-ui-vocabulary-css";
|
|
1383
|
+
|
|
1384
|
+
function themeVarsBlock(selector: string, vars: Record<string, string>) {
|
|
1385
|
+
const body = Object.entries(vars)
|
|
1386
|
+
.map(([name, value]) => ` ${name}: ${value};`)
|
|
1387
|
+
.join("\n");
|
|
1388
|
+
return `${selector} {\n${body}\n}`;
|
|
1389
|
+
}
|
|
1390
|
+
|
|
1391
|
+
export function GenerativeUIStyle() {
|
|
1392
|
+
const css = [
|
|
1393
|
+
themeVarsBlock(":root", generativeUiThemeVars.light),
|
|
1394
|
+
themeVarsBlock(".dark", generativeUiThemeVars.dark),
|
|
1395
|
+
generativeUiCssText(),
|
|
1396
|
+
].join("\n\n");
|
|
1397
|
+
|
|
1398
|
+
return <style>{css}</style>;
|
|
1399
|
+
}
|
|
1400
|
+
|
|
1401
|
+
```
|
|
1402
|
+
|
|
1168
1403
|
## components/gui/index.tsx
|
|
1169
1404
|
|
|
1170
1405
|
```tsx
|
|
@@ -1500,14 +1735,15 @@ export default withAui(nextConfig);
|
|
|
1500
1735
|
"test": "vitest run"
|
|
1501
1736
|
},
|
|
1502
1737
|
"dependencies": {
|
|
1503
|
-
"@ai-sdk/openai": "^4.0.
|
|
1738
|
+
"@ai-sdk/openai": "^4.0.40",
|
|
1504
1739
|
"@assistant-ui/react": "workspace:*",
|
|
1505
1740
|
"@assistant-ui/react-ai-sdk": "workspace:*",
|
|
1741
|
+
"@assistant-ui/react-generative-ui": "workspace:*",
|
|
1506
1742
|
"@assistant-ui/ui": "workspace:*",
|
|
1507
|
-
"ai": "^7.0.
|
|
1743
|
+
"ai": "^7.0.62",
|
|
1508
1744
|
"class-variance-authority": "^0.7.1",
|
|
1509
1745
|
"clsx": "^2.1.1",
|
|
1510
|
-
"lucide-react": "^1.
|
|
1746
|
+
"lucide-react": "^1.31.0",
|
|
1511
1747
|
"next": "^16.3.0",
|
|
1512
1748
|
"react": "^19.2.8",
|
|
1513
1749
|
"react-dom": "^19.2.8",
|
|
@@ -1519,7 +1755,7 @@ export default withAui(nextConfig);
|
|
|
1519
1755
|
"@assistant-ui/next": "workspace:*",
|
|
1520
1756
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
1521
1757
|
"@tailwindcss/postcss": "^4.3.3",
|
|
1522
|
-
"@types/node": "^26.
|
|
1758
|
+
"@types/node": "^26.2.0",
|
|
1523
1759
|
"@types/react": "^19.2.18",
|
|
1524
1760
|
"@types/react-dom": "^19.2.4",
|
|
1525
1761
|
"postcss": "^8.5.26",
|
|
@@ -314,7 +314,7 @@ export default withAui(nextConfig);
|
|
|
314
314
|
"@google/adk": "^1.6.0",
|
|
315
315
|
"class-variance-authority": "^0.7.1",
|
|
316
316
|
"clsx": "^2.1.1",
|
|
317
|
-
"lucide-react": "^1.
|
|
317
|
+
"lucide-react": "^1.31.0",
|
|
318
318
|
"next": "^16.3.0",
|
|
319
319
|
"react": "^19.2.8",
|
|
320
320
|
"react-dom": "^19.2.8",
|
|
@@ -325,7 +325,7 @@ export default withAui(nextConfig);
|
|
|
325
325
|
"@assistant-ui/next": "workspace:*",
|
|
326
326
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
327
327
|
"@tailwindcss/postcss": "^4.3.3",
|
|
328
|
-
"@types/node": "^26.
|
|
328
|
+
"@types/node": "^26.2.0",
|
|
329
329
|
"@types/react": "^19.2.18",
|
|
330
330
|
"@types/react-dom": "^19.2.4",
|
|
331
331
|
"postcss": "^8.5.26",
|
|
@@ -277,7 +277,7 @@ export default withAui(nextConfig);
|
|
|
277
277
|
"@assistant-ui/next": "workspace:*",
|
|
278
278
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
279
279
|
"@tailwindcss/postcss": "^4.3.3",
|
|
280
|
-
"@types/node": "^26.
|
|
280
|
+
"@types/node": "^26.2.0",
|
|
281
281
|
"@types/react": "^19.2.18",
|
|
282
282
|
"@types/react-dom": "^19.2.4",
|
|
283
283
|
"postcss": "^8.5.26",
|
|
@@ -380,13 +380,13 @@ export default withAui(nextConfig);
|
|
|
380
380
|
"start": "next start"
|
|
381
381
|
},
|
|
382
382
|
"dependencies": {
|
|
383
|
-
"@ai-sdk/openai": "^4.0.
|
|
383
|
+
"@ai-sdk/openai": "^4.0.40",
|
|
384
384
|
"@assistant-ui/react": "workspace:*",
|
|
385
385
|
"@assistant-ui/ui": "workspace:*",
|
|
386
|
-
"ai": "^7.0.
|
|
386
|
+
"ai": "^7.0.62",
|
|
387
387
|
"class-variance-authority": "^0.7.1",
|
|
388
388
|
"clsx": "^2.1.1",
|
|
389
|
-
"lucide-react": "^1.
|
|
389
|
+
"lucide-react": "^1.31.0",
|
|
390
390
|
"next": "^16.3.0",
|
|
391
391
|
"react": "^19.2.8",
|
|
392
392
|
"react-dom": "^19.2.8",
|
|
@@ -396,7 +396,7 @@ export default withAui(nextConfig);
|
|
|
396
396
|
"@assistant-ui/next": "workspace:*",
|
|
397
397
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
398
398
|
"@tailwindcss/postcss": "^4.3.3",
|
|
399
|
-
"@types/node": "^26.
|
|
399
|
+
"@types/node": "^26.2.0",
|
|
400
400
|
"@types/react": "^19.2.18",
|
|
401
401
|
"@types/react-dom": "^19.2.4",
|
|
402
402
|
"postcss": "^8.5.26",
|
|
@@ -30,7 +30,7 @@ export async function POST(req: Request) {
|
|
|
30
30
|
);
|
|
31
31
|
|
|
32
32
|
const result = streamText({
|
|
33
|
-
model: openai("gpt-5.
|
|
33
|
+
model: openai("gpt-5.6-luna"),
|
|
34
34
|
messages: modelMessages,
|
|
35
35
|
stopWhen: stepCountIs(10),
|
|
36
36
|
...(system ? { system } : {}),
|
|
@@ -626,14 +626,14 @@ export default nextConfig;
|
|
|
626
626
|
"start": "next start"
|
|
627
627
|
},
|
|
628
628
|
"dependencies": {
|
|
629
|
-
"@ai-sdk/openai": "^4.0.
|
|
629
|
+
"@ai-sdk/openai": "^4.0.40",
|
|
630
630
|
"@assistant-ui/react": "workspace:*",
|
|
631
631
|
"@assistant-ui/react-ai-sdk": "workspace:*",
|
|
632
632
|
"@assistant-ui/ui": "workspace:*",
|
|
633
|
-
"ai": "^7.0.
|
|
633
|
+
"ai": "^7.0.62",
|
|
634
634
|
"class-variance-authority": "^0.7.1",
|
|
635
635
|
"clsx": "^2.1.1",
|
|
636
|
-
"lucide-react": "^1.
|
|
636
|
+
"lucide-react": "^1.31.0",
|
|
637
637
|
"next": "^16.3.0",
|
|
638
638
|
"react": "^19.2.8",
|
|
639
639
|
"react-dom": "^19.2.8",
|
|
@@ -643,7 +643,7 @@ export default nextConfig;
|
|
|
643
643
|
"devDependencies": {
|
|
644
644
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
645
645
|
"@tailwindcss/postcss": "^4.3.3",
|
|
646
|
-
"@types/node": "^26.
|
|
646
|
+
"@types/node": "^26.2.0",
|
|
647
647
|
"@types/react": "^19.2.18",
|
|
648
648
|
"@types/react-dom": "^19.2.4",
|
|
649
649
|
"postcss": "^8.5.26",
|
|
@@ -336,11 +336,11 @@ export default withAui(nextConfig);
|
|
|
336
336
|
"@assistant-ui/react-langchain": "workspace:*",
|
|
337
337
|
"@assistant-ui/react-markdown": "workspace:*",
|
|
338
338
|
"@assistant-ui/ui": "workspace:*",
|
|
339
|
-
"@langchain/langgraph-sdk": "^1.9.
|
|
340
|
-
"@langchain/react": "^1.0.
|
|
339
|
+
"@langchain/langgraph-sdk": "^1.9.29",
|
|
340
|
+
"@langchain/react": "^1.0.30",
|
|
341
341
|
"class-variance-authority": "^0.7.1",
|
|
342
342
|
"clsx": "^2.1.1",
|
|
343
|
-
"lucide-react": "^1.
|
|
343
|
+
"lucide-react": "^1.31.0",
|
|
344
344
|
"next": "^16.3.0",
|
|
345
345
|
"react": "^19.2.8",
|
|
346
346
|
"react-dom": "^19.2.8",
|
|
@@ -350,7 +350,7 @@ export default withAui(nextConfig);
|
|
|
350
350
|
"@assistant-ui/next": "workspace:*",
|
|
351
351
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
352
352
|
"@tailwindcss/postcss": "^4.3.3",
|
|
353
|
-
"@types/node": "^26.
|
|
353
|
+
"@types/node": "^26.2.0",
|
|
354
354
|
"@types/react": "^19.2.18",
|
|
355
355
|
"@types/react-dom": "^19.2.4",
|
|
356
356
|
"postcss": "^8.5.26",
|
|
@@ -369,7 +369,7 @@ export default withAui(nextConfig);
|
|
|
369
369
|
|
|
370
370
|
Demonstrates `@assistant-ui/react-langchain`, which wraps `useStream` from `@langchain/react` and exposes it as an assistant-ui runtime.
|
|
371
371
|
|
|
372
|
-
> assistant-ui also ships `@assistant-ui/react-langgraph`, which integrates with `@langchain/langgraph-sdk` directly and currently has a broader feature set. Pick the adapter that matches your upstream choice. See [the comparison](https://www.assistant-ui.com/docs/runtimes/langchain
|
|
372
|
+
> assistant-ui also ships `@assistant-ui/react-langgraph`, which integrates with `@langchain/langgraph-sdk` directly and currently has a broader feature set. Pick the adapter that matches your upstream choice. See [the comparison](https://www.assistant-ui.com/docs/runtimes/langchain#comparison-with-react-langgraph).
|
|
373
373
|
|
|
374
374
|
## Quick Start
|
|
375
375
|
|
|
@@ -386,7 +386,7 @@ NEXT_PUBLIC_LANGGRAPH_API_URL=http://localhost:2024
|
|
|
386
386
|
NEXT_PUBLIC_LANGGRAPH_ASSISTANT_ID=your_graph_id
|
|
387
387
|
```
|
|
388
388
|
|
|
389
|
-
Start a local LangGraph server
|
|
389
|
+
Start a local LangGraph server with [`npx @langchain/langgraph-cli dev`](https://docs.langchain.com/oss/javascript/langgraph/local-server), then inspect it in [LangSmith Studio](https://docs.langchain.com/langsmith/quick-start-studio). For a hosted deployment, use [LangSmith](https://www.langchain.com/langsmith).
|
|
390
390
|
|
|
391
391
|
### Run
|
|
392
392
|
|
|
@@ -411,7 +411,7 @@ Open [http://localhost:3000](http://localhost:3000).
|
|
|
411
411
|
|
|
412
412
|
- [assistant-ui Documentation](https://www.assistant-ui.com/docs)
|
|
413
413
|
- [LangChain useStream Integration](https://www.assistant-ui.com/docs/runtimes/langchain)
|
|
414
|
-
- [react-langgraph vs react-langchain](https://www.assistant-ui.com/docs/runtimes/langchain
|
|
414
|
+
- [react-langgraph vs react-langchain](https://www.assistant-ui.com/docs/runtimes/langchain#comparison-with-react-langgraph)
|
|
415
415
|
|
|
416
416
|
```
|
|
417
417
|
|
|
@@ -747,11 +747,11 @@ export default withAui(nextConfig);
|
|
|
747
747
|
"@assistant-ui/react-langchain": "workspace:*",
|
|
748
748
|
"@assistant-ui/react-markdown": "workspace:*",
|
|
749
749
|
"@assistant-ui/ui": "workspace:*",
|
|
750
|
-
"@langchain/langgraph-sdk": "^1.9.
|
|
751
|
-
"@langchain/react": "^1.0.
|
|
750
|
+
"@langchain/langgraph-sdk": "^1.9.29",
|
|
751
|
+
"@langchain/react": "^1.0.30",
|
|
752
752
|
"class-variance-authority": "^0.7.1",
|
|
753
753
|
"clsx": "^2.1.1",
|
|
754
|
-
"lucide-react": "^1.
|
|
754
|
+
"lucide-react": "^1.31.0",
|
|
755
755
|
"next": "^16.3.0",
|
|
756
756
|
"react": "^19.2.8",
|
|
757
757
|
"react-dom": "^19.2.8",
|
|
@@ -761,7 +761,7 @@ export default withAui(nextConfig);
|
|
|
761
761
|
"@assistant-ui/next": "workspace:*",
|
|
762
762
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
763
763
|
"@tailwindcss/postcss": "^4.3.3",
|
|
764
|
-
"@types/node": "^26.
|
|
764
|
+
"@types/node": "^26.2.0",
|
|
765
765
|
"@types/react": "^19.2.18",
|
|
766
766
|
"@types/react-dom": "^19.2.4",
|
|
767
767
|
"postcss": "^8.5.26",
|
|
@@ -17,7 +17,7 @@ export async function POST(req: Request) {
|
|
|
17
17
|
const { messages }: { messages: UIMessage[] } = await req.json();
|
|
18
18
|
|
|
19
19
|
const result = streamText({
|
|
20
|
-
model: openai("gpt-5.
|
|
20
|
+
model: openai("gpt-5.6-luna"),
|
|
21
21
|
messages: await convertToModelMessages(messages),
|
|
22
22
|
stopWhen: stepCountIs(10),
|
|
23
23
|
});
|
|
@@ -554,20 +554,20 @@ export default withAui(nextConfig);
|
|
|
554
554
|
"version": "0.0.0",
|
|
555
555
|
"type": "module",
|
|
556
556
|
"dependencies": {
|
|
557
|
-
"@ai-sdk/openai": "^4.0.
|
|
558
|
-
"@ai-sdk/react": "^4.0.
|
|
557
|
+
"@ai-sdk/openai": "^4.0.40",
|
|
558
|
+
"@ai-sdk/react": "^4.0.65",
|
|
559
559
|
"@assistant-ui/react": "workspace:^",
|
|
560
560
|
"@assistant-ui/react-ai-sdk": "workspace:*",
|
|
561
561
|
"@assistant-ui/react-markdown": "workspace:^",
|
|
562
562
|
"@assistant-ui/ui": "workspace:*",
|
|
563
563
|
"@tailwindcss/postcss": "^4.3.3",
|
|
564
|
-
"ai": "^7.0.
|
|
564
|
+
"ai": "^7.0.62",
|
|
565
565
|
"class-variance-authority": "^0.7.1",
|
|
566
566
|
"clsx": "^2.1.1",
|
|
567
567
|
"livekit-client": "^2.21.0",
|
|
568
568
|
"livekit-server-sdk": "^2.17.0",
|
|
569
|
-
"lucide-react": "^1.
|
|
570
|
-
"motion": "^13.
|
|
569
|
+
"lucide-react": "^1.31.0",
|
|
570
|
+
"motion": "^13.1.0",
|
|
571
571
|
"next": "^16.3.0",
|
|
572
572
|
"postcss": "^8.5.26",
|
|
573
573
|
"react": "^19.2.8",
|
|
@@ -579,7 +579,7 @@ export default withAui(nextConfig);
|
|
|
579
579
|
"devDependencies": {
|
|
580
580
|
"@assistant-ui/next": "workspace:*",
|
|
581
581
|
"@assistant-ui/x-buildutils": "workspace:*",
|
|
582
|
-
"@types/node": "^26.
|
|
582
|
+
"@types/node": "^26.2.0",
|
|
583
583
|
"@types/react": "^19.2.18",
|
|
584
584
|
"@types/react-dom": "^19.2.4",
|
|
585
585
|
"tw-animate-css": "^1.4.0",
|
|
@@ -12,7 +12,7 @@ export const maxDuration = 30;
|
|
|
12
12
|
export async function POST(req: Request) {
|
|
13
13
|
const { messages, system, tools } = await req.json();
|
|
14
14
|
const result = streamText({
|
|
15
|
-
model: openai("gpt-5.
|
|
15
|
+
model: openai("gpt-5.6-luna"),
|
|
16
16
|
messages: await convertToModelMessages(messages),
|
|
17
17
|
system,
|
|
18
18
|
tools: { ...frontendTools(tools) },
|
|
@@ -382,7 +382,7 @@ export default nextConfig;
|
|
|
382
382
|
"start:server": "tsx server/server.ts"
|
|
383
383
|
},
|
|
384
384
|
"dependencies": {
|
|
385
|
-
"@ai-sdk/openai": "^4.0.
|
|
385
|
+
"@ai-sdk/openai": "^4.0.40",
|
|
386
386
|
"@assistant-ui/react": "workspace:*",
|
|
387
387
|
"@assistant-ui/react-ai-sdk": "workspace:*",
|
|
388
388
|
"@assistant-ui/react-markdown": "workspace:*",
|
|
@@ -394,13 +394,13 @@ export default nextConfig;
|
|
|
394
394
|
"@modelcontextprotocol/node": "^2.0.0",
|
|
395
395
|
"@modelcontextprotocol/server": "^2.0.0",
|
|
396
396
|
"@modelcontextprotocol/server-legacy": "^2.0.0",
|
|
397
|
-
"ai": "^7.0.
|
|
397
|
+
"ai": "^7.0.62",
|
|
398
398
|
"assistant-stream": "workspace:*",
|
|
399
399
|
"class-variance-authority": "^0.7.1",
|
|
400
400
|
"clsx": "^2.1.1",
|
|
401
401
|
"cors": "^2.8.6",
|
|
402
402
|
"express": "^5.2.1",
|
|
403
|
-
"lucide-react": "^1.
|
|
403
|
+
"lucide-react": "^1.31.0",
|
|
404
404
|
"next": "^16.3.0",
|
|
405
405
|
"react": "^19.2.8",
|
|
406
406
|
"react-dom": "^19.2.8",
|
|
@@ -412,13 +412,13 @@ export default nextConfig;
|
|
|
412
412
|
"@tailwindcss/postcss": "^4.3.3",
|
|
413
413
|
"@types/cors": "^2.8.19",
|
|
414
414
|
"@types/express": "^5.0.6",
|
|
415
|
-
"@types/node": "^26.
|
|
415
|
+
"@types/node": "^26.2.0",
|
|
416
416
|
"@types/react": "^19.2.18",
|
|
417
417
|
"@types/react-dom": "^19.2.4",
|
|
418
418
|
"concurrently": "^10.0.4",
|
|
419
419
|
"postcss": "^8.5.26",
|
|
420
420
|
"tailwindcss": "^4.3.3",
|
|
421
|
-
"tsx": "^4.23.
|
|
421
|
+
"tsx": "^4.23.12",
|
|
422
422
|
"tw-animate-css": "^1.4.0",
|
|
423
423
|
"typescript": "^7.0.2"
|
|
424
424
|
}
|