@assistant-ui/mcp-docs-server 0.1.6 → 0.1.8

package/.docs/raw/docs/getting-started.mdx

@@ -22,7 +22,10 @@ import { Card, Cards } from "fumadocs-ui/components/card";
 # Create a new project with the default template
 npx assistant-ui@latest create
 
-# Or start with a template:
+# Or choose one of the following templates:
+# Assistant Cloud for baked in persistence and thread management
+npx assistant-ui@latest create -t cloud
+
 # LangGraph
 npx assistant-ui@latest create -t langgraph
 
@@ -686,11 +689,11 @@ import { ComponentPropsWithoutRef, forwardRef } from "react";
 import {
   Tooltip,
   TooltipContent,
-  TooltipProvider,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
+import { Slottable } from "@radix-ui/react-slot";
 
 export type TooltipIconButtonProps = ComponentPropsWithoutRef<typeof Button> & {
   tooltip: string;
@@ -702,23 +705,21 @@ export const TooltipIconButton = forwardRef<
   TooltipIconButtonProps
 >(({ children, tooltip, side = "bottom", className, ...rest }, ref) => {
   return (
-    <TooltipProvider>
-      <Tooltip>
-        <TooltipTrigger asChild>
-          <Button
-            variant="ghost"
-            size="icon"
-            {...rest}
-            className={cn("", className)}
-            ref={ref}
-          >
-            {children}
-            <span className="aui-sr-only">{tooltip}</span>
-          </Button>
-        </TooltipTrigger>
-        <TooltipContent side={side}>{tooltip}</TooltipContent>
-      </Tooltip>
-    </TooltipProvider>
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <Button
+          variant="ghost"
+          size="icon"
+          {...rest}
+          className={cn("aui-button-icon", className)}
+          ref={ref}
+        >
+          <Slottable>{children}</Slottable>
+          <span className="aui-sr-only">{tooltip}</span>
+        </Button>
+      </TooltipTrigger>
+      <TooltipContent side={side}>{tooltip}</TooltipContent>
+    </Tooltip>
   );
 });
 
@@ -810,7 +811,7 @@ Add an API endpoint:
 <Tabs id="provider" items={["OpenAI", "Anthropic", "Azure", "AWS", "Gemini", "GCP", "Groq", "Fireworks", "Cohere", "Ollama", "Chrome AI"]}>
 ```ts title="/app/api/chat/route.ts" tab="OpenAI"
 import { openai } from "@ai-sdk/openai";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -818,15 +819,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: openai("gpt-4o-mini"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Anthropic"
 import { anthropic } from "@ai-sdk/anthropic";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -834,15 +835,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: anthropic("claude-3-5-sonnet-20240620"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Azure"
 import { azure } from "@ai-sdk/azure";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -850,15 +851,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: azure("your-deployment-name"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="AWS"
 import { bedrock } from "@ai-sdk/amazon-bedrock";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -866,15 +867,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: bedrock("anthropic.claude-3-5-sonnet-20240620-v1:0"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Gemini"
 import { google } from "@ai-sdk/google";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -882,15 +883,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: google("gemini-2.0-flash"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="GCP"
 import { vertex } from "@ai-sdk/google-vertex";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -898,15 +899,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: vertex("gemini-1.5-pro"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Groq"
 import { createOpenAI } from "@ai-sdk/openai";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -919,15 +920,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: groq("llama3-70b-8192"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Fireworks"
 import { createOpenAI } from "@ai-sdk/openai";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -940,15 +941,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: fireworks("accounts/fireworks/models/firefunction-v2"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Cohere"
 import { cohere } from "@ai-sdk/cohere";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -956,15 +957,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: cohere("command-r-plus"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Ollama"
 import { ollama } from "ollama-ai-provider";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -972,15 +973,15 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: ollama("llama3"),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 
 ```ts title="/app/api/chat/route.ts" tab="Chrome AI"
 import { chromeai } from "chrome-ai";
-import { streamText } from "ai";
+import { convertToModelMessages, streamText } from "ai";
 
 export const maxDuration = 30;
 
@@ -988,9 +989,9 @@ export async function POST(req: Request) {
   const { messages } = await req.json();
   const result = streamText({
     model: chromeai(),
-    messages,
+    messages: convertToModelMessages(messages),
   });
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```
 

package/.docs/raw/docs/guides/Attachments.mdx

@@ -41,29 +41,22 @@ This adds `/components/assistant-ui/attachment.tsx` to your project.
   </Step>
   <Step>
 
-### Configure Attachment Adapter
+### Set up Runtime (No Configuration Required)
 
-Set up an attachment adapter in your runtime provider:
+For `useChatRuntime`, attachments work automatically without additional configuration:
 
 ```tsx title="/app/MyRuntimeProvider.tsx"
 import { useChatRuntime } from "@assistant-ui/react-ai-sdk";
-import {
-  CompositeAttachmentAdapter,
-  SimpleImageAttachmentAdapter,
-  SimpleTextAttachmentAdapter,
-} from "@assistant-ui/react";
 
 const runtime = useChatRuntime({
   api: "/api/chat",
-  adapters: {
-    attachments: new CompositeAttachmentAdapter([
-      new SimpleImageAttachmentAdapter(),
-      new SimpleTextAttachmentAdapter(),
-    ]),
-  },
 });
 ```
 
+<Callout type="info">
+  **Note:** The AI SDK runtime handles attachments automatically. For other runtimes like `useLocalRuntime`, you may still need to configure attachment adapters as shown in the [Creating Custom Attachment Adapters](#creating-custom-attachment-adapters) section below.
+</Callout>
+
   </Step>
   <Step>
 
@@ -353,36 +346,6 @@ const runtime = useLocalRuntime(MyModelAdapter, {
 });
 ```
 
-### With Vercel AI SDK
-
-If you're using the Vercel AI SDK, images are handled automatically through experimental attachments:
-
-```tsx
-// In your API route
-import { streamText } from "ai";
-import { openai } from "@ai-sdk/openai";
-
-export async function POST(req: Request) {
-  const { messages } = await req.json();
-
-  const result = streamText({
-    model: openai("gpt-4-vision-preview"),
-    messages: messages.map((msg) => {
-      if (msg.experimental_attachments?.length) {
-        // Images are automatically formatted for the model
-        return {
-          ...msg,
-          experimental_attachments: msg.experimental_attachments,
-        };
-      }
-      return msg;
-    }),
-  });
-
-  return result.toDataStreamResponse();
-}
-```
-
 ## Advanced Features
 
 ### Progress Updates
@@ -540,78 +503,7 @@ const handleMultipleFiles = async (files: FileList) => {
 
 ### With Vercel AI SDK
 
-Process attachments in your API route:
-
-```tsx title="/app/api/chat/route.ts"
-import { streamText } from "ai";
-import { openai } from "@ai-sdk/openai";
-
-export async function POST(req: Request) {
-  const { messages } = await req.json();
-
-  // Process messages with attachments
-  const processedMessages = messages.map((msg) => {
-    if (msg.role === "user" && msg.experimental_attachments) {
-      // Handle attachments
-      const attachmentContent = msg.experimental_attachments
-        .map((att) => {
-          if (att.contentType.startsWith("image/")) {
-            return `[Image: ${att.name}]`;
-          }
-          return att.content;
-        })
-        .join("\n");
-
-      return {
-        ...msg,
-        content: `${msg.content}\n\nAttachments:\n${attachmentContent}`,
-      };
-    }
-    return msg;
-  });
-
-  const result = streamText({
-    model: openai("gpt-4o"),
-    messages: processedMessages,
-  });
-
-  return result.toDataStreamResponse();
-}
-```
-
-### Custom Backend Handling
-
-Implement your own attachment processing:
-
-```tsx
-// In your attachment adapter
-class ServerUploadAdapter implements AttachmentAdapter {
-  async send(attachment: PendingAttachment): Promise<CompleteAttachment> {
-    const formData = new FormData();
-    formData.append("file", attachment.file);
-
-    const response = await fetch("/api/upload", {
-      method: "POST",
-      body: formData,
-    });
-
-    const { url, id } = await response.json();
-
-    return {
-      id,
-      type: attachment.type,
-      name: attachment.name,
-      content: [
-        {
-          type: "image",
-          url,
-        },
-      ],
-      status: { type: "complete" },
-    };
-  }
-}
-```
+Attachments are sent to the backend as file content parts.
 
 ## Runtime Support
 

package/.docs/raw/docs/guides/ToolUI.mdx

@@ -201,11 +201,11 @@ export async function POST(req: Request) {
 
   const result = streamText({
     model: openai("gpt-4o"),
-    messages,
+    messages: convertToModelMessages(messages),
     tools: {
       getWeather: tool({
         description: "Get current weather for a location",
-        parameters: z.object({
+        inputSchema: z.object({
           location: z.string(),
           unit: z.enum(["celsius", "fahrenheit"]),
         }),
@@ -222,7 +222,7 @@ export async function POST(req: Request) {
     },
   });
 
-  return result.toDataStreamResponse();
+  return result.toUIMessageStreamResponse();
 }
 ```