@assistant-ui/mcp-docs-server 0.1.2 → 0.1.4

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

@@ -15,6 +15,7 @@ import { Card, Cards } from "fumadocs-ui/components/card";
   <Step>
 
 ### Initialize assistant-ui
+
 **Create a new project:**
 
 ```sh
@@ -349,7 +350,7 @@ const UserMessage: FC = () => {
       <UserActionBar />
 
       <div className="aui-user-message-content">
-        <MessagePrimitive.Content />
+        <MessagePrimitive.Parts />
       </div>
 
       <BranchPicker className="aui-user-branch-picker" />
@@ -394,7 +395,7 @@ const AssistantMessage: FC = () => {
   return (
     <MessagePrimitive.Root className="aui-assistant-message-root">
       <div className="aui-assistant-message-content">
-        <MessagePrimitive.Content components={{ Text: MarkdownText }} />
+        <MessagePrimitive.Parts components={{ Text: MarkdownText }} />
       </div>
 
       <AssistantActionBar />
@@ -1110,23 +1111,23 @@ const MyApp = () => {
 ## What's Next?
 
 <Cards>
-  <Card 
-    title="Pick a Runtime" 
+  <Card
+    title="Pick a Runtime"
     description="Choose the right runtime for your needs"
     href="/docs/runtimes/pick-a-runtime"
   />
-  <Card 
-    title="Generative UI" 
+  <Card
+    title="Generative UI"
     description="Create rich UI components for tool executions"
     href="/docs/guides/ToolUI"
   />
-  <Card 
-    title="Add Persistence" 
+  <Card
+    title="Add Persistence"
     description="Save and restore chat conversations"
     href="/docs/cloud/overview"
   />
-  <Card 
-    title="Examples" 
+  <Card
+    title="Examples"
     description="Explore full implementations and demos"
     href="https://github.com/assistant-ui/assistant-ui/tree/main/examples"
   />

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

@@ -34,7 +34,8 @@ npx shadcn@latest add "https://r.assistant-ui.com/attachment"
 This adds `/components/assistant-ui/attachment.tsx` to your project.
 
 <Callout type="tip">
-**Next steps:** Feel free to adjust these auto-generated components (styling, layout, behavior) to match your application's design system.
+  **Next steps:** Feel free to adjust these auto-generated components (styling,
+  layout, behavior) to match your application's design system.
 </Callout>
 
   </Step>
@@ -94,7 +95,7 @@ const UserMessage = () => {
   return (
     <MessagePrimitive.Root>
       <UserMessageAttachments />
-      <MessagePrimitive.Content />
+      <MessagePrimitive.Parts />
     </MessagePrimitive.Root>
   );
 };
@@ -242,7 +243,7 @@ class PDFAttachmentAdapter implements AttachmentAdapter {
   async send(attachment: PendingAttachment): Promise<CompleteAttachment> {
     // Option 1: Extract text from PDF (requires pdf parsing library)
     // const text = await this.extractTextFromPDF(attachment.file);
-    
+
     // Option 2: Convert to base64 for API processing
     const base64Data = await this.fileToBase64(attachment.file);
 
@@ -253,8 +254,8 @@ class PDFAttachmentAdapter implements AttachmentAdapter {
       content: [
         {
           type: "text",
-          text: `[PDF Document: ${attachment.name}]\nBase64 data: ${base64Data.substring(0, 50)}...`
-        }
+          text: `[PDF Document: ${attachment.name}]\nBase64 data: ${base64Data.substring(0, 50)}...`,
+        },
       ],
       status: { type: "complete" },
     };
@@ -268,12 +269,12 @@ class PDFAttachmentAdapter implements AttachmentAdapter {
     const arrayBuffer = await file.arrayBuffer();
     const bytes = new Uint8Array(arrayBuffer);
     let binary = "";
-    bytes.forEach(byte => {
+    bytes.forEach((byte) => {
       binary += String.fromCharCode(byte);
     });
     return btoa(binary);
   }
-  
+
   // Optional: Extract text from PDF using a library like pdf.js
   private async extractTextFromPDF(file: File): Promise<string> {
     // Implementation would use pdf.js or similar
@@ -296,33 +297,36 @@ import { useLocalRuntime, ChatModelAdapter } from "@assistant-ui/react";
 const MyModelAdapter: ChatModelAdapter = {
   async run({ messages, abortSignal }) {
     // Convert messages to format expected by your vision-capable API
-    const formattedMessages = messages.map(msg => {
-      if (msg.role === "user" && msg.content.some(part => part.type === "image")) {
+    const formattedMessages = messages.map((msg) => {
+      if (
+        msg.role === "user" &&
+        msg.content.some((part) => part.type === "image")
+      ) {
         // Format for GPT-4V or similar vision models
         return {
           role: "user",
-          content: msg.content.map(part => {
+          content: msg.content.map((part) => {
             if (part.type === "text") {
               return { type: "text", text: part.text };
             }
             if (part.type === "image") {
               return {
                 type: "image_url",
-                image_url: { url: part.image }
+                image_url: { url: part.image },
               };
             }
             return part;
-          })
+          }),
         };
       }
-      
+
       // Regular text messages
       return {
         role: msg.role,
         content: msg.content
-          .filter(c => c.type === "text")
-          .map(c => c.text)
-          .join("\n")
+          .filter((c) => c.type === "text")
+          .map((c) => c.text)
+          .join("\n"),
       };
     });
 
@@ -343,8 +347,8 @@ const MyModelAdapter: ChatModelAdapter = {
 
 // Create runtime with vision image adapter
 const runtime = useLocalRuntime(MyModelAdapter, {
-  adapters: { 
-    attachments: new VisionImageAdapter() 
+  adapters: {
+    attachments: new VisionImageAdapter(),
   },
 });
 ```
@@ -363,12 +367,12 @@ export async function POST(req: Request) {
 
   const result = streamText({
     model: openai("gpt-4-vision-preview"),
-    messages: messages.map(msg => {
+    messages: messages.map((msg) => {
       if (msg.experimental_attachments?.length) {
         // Images are automatically formatted for the model
         return {
           ...msg,
-          experimental_attachments: msg.experimental_attachments
+          experimental_attachments: msg.experimental_attachments,
         };
       }
       return msg;
@@ -637,4 +641,3 @@ Attachments work with all assistant-ui runtimes:
 
 - [Attachment UI Components](/docs/ui/Attachment) - UI implementation details
 - [API Reference](/docs/api-reference) - Detailed type definitions
-

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

@@ -43,11 +43,14 @@ const weatherTool = tool({
   execute: async ({ location, unit }) => {
     const weather = await fetchWeatherAPI(location, unit);
     return weather;
-  }
+  },
 });
 
 // Register the tool
-const WeatherTool = makeAssistantTool(weatherTool);
+const WeatherTool = makeAssistantTool({
+  ...weatherTool,
+  toolName: "getWeather",
+});
 
 // Create the UI
 const WeatherToolUI = makeAssistantToolUI<
@@ -74,7 +77,8 @@ const WeatherToolUI = makeAssistantToolUI<
 ```
 
 <Callout type="tip">
-  Tools defined with `makeAssistantTool` can be passed to your backend using the `frontendTools` utility
+  Tools defined with `makeAssistantTool` can be passed to your backend using the
+  `frontendTools` utility
 </Callout>
 
 Learn more about creating tools in the [Tools Guide](/docs/guides/Tools).
@@ -302,8 +306,9 @@ function DynamicToolUI() {
 For tools that need access to parent component props:
 
 <Callout type="tip">
-**Why `useInlineRender`?**
-By default, a tool UI's `render` function is static. Use `useInlineRender` when your UI needs access to dynamic component props (for example, to pass in an `id` or other contextual data).
+  **Why `useInlineRender`?** By default, a tool UI's `render` function is
+  static. Use `useInlineRender` when your UI needs access to dynamic component
+  props (for example, to pass in an `id` or other contextual data).
 </Callout>
 
 ```tsx
@@ -337,7 +342,9 @@ function ProductPage({ productId, productName }) {
 Create tools that collect user input during execution:
 
 <Callout type="tip">
-**Pro tip:** Call `addResult(...)` exactly once to complete the tool call. After it's invoked, the assistant will resume the conversation with your provided data.
+  **Pro tip:** Call `addResult(...)` exactly once to complete the tool call.
+  After it's invoked, the assistant will resume the conversation with your
+  provided data.
 </Callout>
 
 ```tsx
@@ -572,7 +579,7 @@ type ToolUIRenderProps<TArgs, TResult> = {
   argsText: string; // JSON stringified args
 
   // Execution status
-  status: ToolCallContentPartStatus;
+  status: ToolCallMessagePartStatus;
   isError?: boolean;
 
   // Tool result (may be partial during streaming)
@@ -656,8 +663,41 @@ useAssistantToolUI({
   server.
 </Callout>
 
+### Collapsible Tool Groups
+
+Create collapsible sections for consecutive tool calls:
+
+```tsx
+
+```
+
+### Advanced Tool Group UI
+
+Add progress indicators and enhanced styling:
+
+```tsx
+const ToolGroup = ({ startIndex, endIndex, children }) => {
+  return (
+    <details className="tool-group my-4">
+      <summary className="cursor-pointer rounded bg-gray-50 p-3 hover:bg-gray-100">
+        <span className="font-medium">
+          {endIndex - startIndex + 1} tool calls executed
+        </span>
+        <span className="ml-2 text-sm text-gray-500">
+          (#{startIndex + 1}-{endIndex + 1})
+        </span>
+      </summary>
+      <div className="mt-2 space-y-2 pl-4">{children}</div>
+    </details>
+  );
+};
+
+<Thread components={{ ToolGroup }} />;
+```
+
 ## Related Guides
 
 - [Tools Guide](/docs/guides/Tools) - Learn how to create and use tools with AI models
 - [Tool Fallback](/docs/ui/ToolFallback) - Default UI for tools without custom components
-- [API Reference](/docs/api-reference/primitives/ContentPart) - Detailed type definitions and component APIs
+- [API Reference](/docs/api-reference/primitives/MessagePart) - Detailed type definitions and component APIs
+- [Message Primitive](/docs/api-reference/primitives/Message) - Complete Message component documentation

package/.docs/raw/docs/guides/Tools.mdx

@@ -52,7 +52,10 @@ const weatherTool = tool({
 });
 
 // Create the component
-const WeatherTool = makeAssistantTool(weatherTool);
+const WeatherTool = makeAssistantTool({
+  ...weatherTool,
+  toolName: "getWeather"
+});
 
 // Place the tool component inside AssistantRuntimeProvider
 function App() {
@@ -214,7 +217,10 @@ const screenshotTool = tool({
   }
 });
 
-const ScreenshotTool = makeAssistantTool(screenshotTool);
+const ScreenshotTool = makeAssistantTool({
+  ...screenshotTool,
+  toolName: "screenshot"
+});
 ```
 
 ### Backend Tools
@@ -267,7 +273,10 @@ const calculateTool = tool({
   }
 });
 
-const CalculateTool = makeAssistantTool(calculateTool);
+const CalculateTool = makeAssistantTool({
+  ...calculateTool,
+  toolName: "calculate"
+});
 
 // Backend: Use frontendTools to receive client tools
 import { frontendTools } from "@assistant-ui/react-ai-sdk";
@@ -329,7 +338,10 @@ const refundTool = tool({
   }
 });
 
-const RefundTool = makeAssistantTool(refundTool);
+const RefundTool = makeAssistantTool({
+  ...refundTool,
+  toolName: "requestRefund"
+});
 ```
 
 ### MCP (Model Context Protocol) Tools
@@ -393,7 +405,10 @@ const travelPlannerTool = tool({
   }
 });
 
-const TravelPlannerTool = makeAssistantTool(travelPlannerTool);
+const TravelPlannerTool = makeAssistantTool({
+  ...travelPlannerTool,
+  toolName: "planTrip"
+});
 ```
 
 ### Conditional Tool Availability
@@ -461,7 +476,10 @@ const resilientTool = tool({
   }
 });
 
-const ResilientTool = makeAssistantTool(resilientTool);
+const ResilientTool = makeAssistantTool({
+  ...resilientTool,
+  toolName: "fetchWithRetries"
+});
 ```
 
 ## Best Practices

package/.docs/raw/docs/mcp-docs-server.mdx

@@ -7,9 +7,7 @@ import { Tabs, Tab } from "fumadocs-ui/components/tabs";
 
 `@assistant-ui/mcp-docs-server` provides direct access to assistant-ui's documentation and examples in Cursor, Windsurf, VSCode, Zed, Claude Code, or any other IDE or tool that supports MCP.
 
-It has access to comprehensive documentation and complete code examples which your IDE can read to help you build conversational UI components with assistant-ui.
-
-The MCP server tools have been designed to allow an agent to query the specific information it needs to complete an assistant-ui related task - for example: implementing chat components, integrating with different runtimes, or understanding component architecture.
+The MCP server tools have been designed to allow an agent to query the specific information it needs to complete an assistant-ui related task - for example: implementing chat components, integrating with different runtimes, understanding component architecture, and troubleshooting issues.
 
 ## How it works
 

package/.docs/raw/docs/migrations/v0-11.mdx

@@ -0,0 +1,169 @@
+---
+title: Migration to v0.11
+---
+
+## ContentPart renamed to MessagePart
+
+All ContentPart-related types, hooks, and components have been renamed to MessagePart for better semantic clarity and consistency.
+
+### What changed
+
+The following types and components have been renamed:
+
+#### Core Types
+
+- `TextContentPart` → `TextMessagePart`
+- `ReasoningContentPart` → `ReasoningMessagePart`
+- `SourceContentPart` → `SourceMessagePart`
+- `ImageContentPart` → `ImageMessagePart`
+- `FileContentPart` → `FileMessagePart`
+- `Unstable_AudioContentPart` → `Unstable_AudioMessagePart`
+- `ToolCallContentPart` → `ToolCallMessagePart`
+- `ContentPartStatus` → `MessagePartStatus`
+- `ToolCallContentPartStatus` → `ToolCallMessagePartStatus`
+
+#### Thread Message Parts
+
+- `ThreadUserContentPart` → `ThreadUserMessagePart`
+- `ThreadAssistantContentPart` → `ThreadAssistantMessagePart`
+
+#### Runtime and State Types
+
+- `ContentPartRuntime` → `MessagePartRuntime`
+- `ContentPartState` → `MessagePartState`
+
+#### Hooks
+
+- `useContentPart` → `useMessagePart`
+- `useContentPartRuntime` → `useMessagePartRuntime`
+- `useContentPartText` → `useMessagePartText`
+- `useContentPartReasoning` → `useMessagePartReasoning`
+- `useContentPartSource` → `useMessagePartSource`
+- `useContentPartFile` → `useMessagePartFile`
+- `useContentPartImage` → `useMessagePartImage`
+- `useTextContentPart` → `useTextMessagePart`
+
+#### Component Types
+
+- `EmptyContentPartComponent` → `EmptyMessagePartComponent`
+- `TextContentPartComponent` → `TextMessagePartComponent`
+- `ReasoningContentPartComponent` → `ReasoningMessagePartComponent`
+- `SourceContentPartComponent` → `SourceMessagePartComponent`
+- `ImageContentPartComponent` → `ImageMessagePartComponent`
+- `FileContentPartComponent` → `FileMessagePartComponent`
+- `Unstable_AudioContentPartComponent` → `Unstable_AudioMessagePartComponent`
+- `ToolCallContentPartComponent` → `ToolCallMessagePartComponent`
+
+#### Props Types
+
+- `EmptyContentPartProps` → `EmptyMessagePartProps`
+- `TextContentPartProps` → `TextMessagePartProps`
+- `ReasoningContentPartProps` → `ReasoningMessagePartProps`
+- `SourceContentPartProps` → `SourceMessagePartProps`
+- `ImageContentPartProps` → `ImageMessagePartProps`
+- `FileContentPartProps` → `FileMessagePartProps`
+- `Unstable_AudioContentPartProps` → `Unstable_AudioMessagePartProps`
+- `ToolCallContentPartProps` → `ToolCallMessagePartProps`
+
+#### Providers and Context
+
+- `TextContentPartProvider` → `TextMessagePartProvider`
+- `TextContentPartProviderProps` → `TextMessagePartProviderProps`
+- `ContentPartRuntimeProvider` → `MessagePartRuntimeProvider`
+- `ContentPartContext` → `MessagePartContext`
+- `ContentPartContextValue` → `MessagePartContextValue`
+
+#### Primitives
+
+- `ContentPartPrimitive` → `MessagePartPrimitive`
+- `ContentPartPrimitiveText` → `MessagePartPrimitiveText`
+- `ContentPartPrimitiveImage` → `MessagePartPrimitiveImage`
+- `ContentPartPrimitiveInProgress` → `MessagePartPrimitiveInProgress`
+
+### MessagePrimitive.Content renamed to MessagePrimitive.Parts
+
+The `MessagePrimitive.Content` component has been renamed to `MessagePrimitive.Parts` to better reflect its purpose of rendering message parts.
+
+```diff
+-<MessagePrimitive.Content components={{ Text: MyText }} />
++<MessagePrimitive.Parts components={{ Text: MyText }} />
+```
+
+### Migration
+
+To migrate your codebase automatically, use the migration codemod:
+
+```sh
+# IMPORTANT: make sure to commit all changes to git / create a backup before running the codemod
+npx @assistant-ui/cli upgrade
+```
+
+Or run the specific migration:
+
+```sh
+npx @assistant-ui/cli codemod v0-11/content-part-to-message-part .
+```
+
+#### Manual Migration Examples
+
+If you prefer to migrate manually, here are some examples:
+
+**Imports:**
+
+```diff
+-import { TextContentPart, useContentPart, ToolCallContentPartComponent } from "@assistant-ui/react";
++import { TextMessagePart, useMessagePart, ToolCallMessagePartComponent } from "@assistant-ui/react";
+```
+
+**Type annotations:**
+
+```diff
+-function processContent(part: TextContentPart): void {
++function processContent(part: TextMessagePart): void {
+   console.log(part.text);
+ }
+
+-const MyTool: ToolCallContentPartComponent = ({ toolName }) => {
++const MyTool: ToolCallMessagePartComponent = ({ toolName }) => {
+   return <div>{toolName}</div>;
+ };
+```
+
+**Hooks:**
+
+```diff
+ function MyComponent() {
+-  const part = useContentPart();
+-  const text = useContentPartText();
+-  const runtime = useContentPartRuntime();
++  const part = useMessagePart();
++  const text = useMessagePartText();
++  const runtime = useMessagePartRuntime();
+   return null;
+ }
+```
+
+**JSX Components:**
+
+```diff
+-<ContentPartPrimitive.Text />
+-<ContentPartPrimitive.Image />
++<MessagePartPrimitive.Text />
++<MessagePartPrimitive.Image />
+```
+
+**Providers:**
+
+```diff
+-<TextContentPartProvider text="Hello" isRunning={false}>
++<TextMessagePartProvider text="Hello" isRunning={false}>
+   <div>Content</div>
+-</TextContentPartProvider>
++</TextMessagePartProvider>
+```
+
+### Why this change?
+
+The ContentPart naming was inconsistent with the rest of the codebase, where "message parts" are used throughout. This change improves semantic clarity and makes the API more intuitive by aligning terminology across the entire library.
+
+The old ContentPart APIs continue to work but are now deprecated and will be removed in a future major version.

package/.docs/raw/docs/migrations/v0-7.mdx

@@ -24,7 +24,7 @@ Component property types are now neatly organized under the component itself.
 
 ### `useThreadContext`, `useMessageContext`, ... replaced with direct imports of stores
 
-`useAssistantContext`, `useThreadContext`, `useMessageContext` and `useContentPartContext` have been removed in favor of direct exports from `@assistant-ui/react`;
+`useAssistantContext`, `useThreadContext`, `useMessageContext` and `useMessagePartContext` have been removed in favor of direct exports from `@assistant-ui/react`;
 
 ```diff
 -const { useThread } = useThreadContext();
@@ -56,7 +56,7 @@ Component property types are now neatly organized under the component itself.
 ```diff
 -useSwitchToNewThread();
 +const runtime = useAssistantRuntime()
-+runtime.switchToNewThread(); 
++runtime.switchToNewThread();
 ```
 
 ### `runtime.subscribe` removed, `subscribeToMainThread` removed
@@ -106,7 +106,7 @@ The branch IDs are an internal implementation detail. The new Message Runtime AP
 A few methods from `useThreadRuntime` have been moved to `useMessageRuntime()`.
 
 - `threadRuntime.switchToBranch()` has been removed in favor of `useThreadRuntime().getMessageByIndex(idx).switchToBranch()`.
-- `threadRuntime.addToolResult()` has been removed in favor of `useThreadRuntime().getMessageByIndex(idx).getContentPartByToolCallId(toolCallId).addToolResult()`.
+- `threadRuntime.addToolResult()` has been removed in favor of `useThreadRuntime().getMessageByIndex(idx).getMessagePartByToolCallId(toolCallId).addToolResult()`.
 - `threadRuntime.speak()` has been removed in favor of `useThreadRuntime().getMessageByIndex(idx).speak()`.
 - `threadRuntime.submitFeedback()` has been removed in favor of `useThreadRuntime().getMessageByIndex(idx).submitFeedback()`.
 - `threadRuntime.getEditComposer()` has been removed in favor of `useThreadRuntime().getMessageById(id).getMessageByIndex(idx).composer`.
@@ -149,15 +149,15 @@ These methods have been removed.
 
 `useMessageStore` has been removed in favor of `useMessageRuntime().getState()`.
 
-## Content Part Context API simplifications
+## Message part Context API simplifications
 
-### Flattened context values `useContentPart().part` -> `useContentPart()`
+### Flattened context values `useMessagePart().part` -> `useMessagePart()`
 
-`ContentPartState` is now itself a content part, so you no longer need to access the nested `useContentPart().part` field.
+`MessagePartState` is now itself a message part, so you no longer need to access the nested `useMessagePart().part` field.
 
 ```diff
--useContentPart(c => c.part.type);
-+useContentPart(c => c.type);
+-useMessagePart(c => c.part.type);
++useMessagePart(c => c.type);
 ```
 
 This also applies to tool UI render functions:

package/.docs/raw/docs/migrations/v0-8.mdx

@@ -27,10 +27,10 @@ import { RSCDisplay } from "@assistant-ui/react-ai-sdk";
 
 
 // if you are using unstyled primitives, update MyThread.tsx
-<MessagePrimitive.Content components={{ Text: RSCDisplay }} />
+<MessagePrimitive.Parts components={{ Text: RSCDisplay }} />
 ```
 
-## Migrate away from UIContentPart
+## Migrate away from UIMessagePart
 
 For instructions on migrating for Vercel AI SDK RSC, see section above.
 This migration guide is for users of `useExternalStoreRuntime`.
@@ -40,13 +40,13 @@ This migration guide is for users of `useExternalStoreRuntime`.
 First, reconsider your approach.
 
 Creating UI components in the `convertMessage` callback is considered an anti-pattern.
-The recommended alternative approach is to pass tool-call content parts, and use `makeAssistantToolUI` to map these tool calls to UI components.
+The recommended alternative approach is to pass tool-call message parts, and use `makeAssistantToolUI` to map these tool calls to UI components.
 
 This ensures that the data layer is separate and decoupled from the UI layer.
 
 #### Example
 
-Consider the following example, where you are using a UIContentPart to show a loading indicator.
+Consider the following example, where you are using a UIMessagePart to show a loading indicator.
 
 ```ts title="bad.ts"
 // THIS IS BAD
@@ -66,11 +66,11 @@ const convertMessage = (message: MyMessage): ThreadMessageLike => {
   // ...
 };
 
-// use the empty content part to show the loading indicator
+// use the empty message part to show the loading indicator
 <Thread assistantMessage={{ components: { Empty: MyLoader } }} />;
 ```
 
-(if you are using unstyled primitives, update MyThread.tsx, and pass the component to MessagePrimitive.Content)
+(if you are using unstyled primitives, update MyThread.tsx, and pass the component to MessagePrimitive.Parts)
 
 #### Example 2
 
@@ -107,13 +107,13 @@ const ChartToolUI = makeAssistantToolUI({
 
 (if you are using unstyled primitives, render the `<ChartToolUI />` component anywhere inside your AssistantRuntimeProvider)
 
-### Fallback Approach: Override ContentPartText
+### Fallback Approach: Override MessagePartText
 
 However, sometimes you receive UI components from an external source.
 
 The example below assumes that your custom `MyMessage` type has a `display` field.
 
-First, we define a dummy `UI_PLACEHOLDER` content part, which we will replace with the UI component later:
+First, we define a dummy `UI_PLACEHOLDER` message part, which we will replace with the UI component later:
 
 ```ts
 const UI_PLACEHOLDER = Object.freeze({
@@ -122,17 +122,17 @@ const UI_PLACEHOLDER = Object.freeze({
 });
 const convertMessage = (message: MyMessage): ThreadMessageLike => ({
   content: [
-    // other content parts,
+    // other message parts,
     UI_PLACEHOLDER,
   ],
 });
 ```
 
-Then, we define a custom `TextContentPartComponent`:
+Then, we define a custom `TextMessagePartComponent`:
 
 ```tsx
-const MyText: TextContentPartComponent = () => {
-  const isUIPlaceholder = useContentPart((p) => p === UI_PLACEHOLDER);
+const MyText: TextMessagePartComponent = () => {
+  const isUIPlaceholder = useMessagePart((p) => p === UI_PLACEHOLDER);
 
   // this assumes that you have a `display` field on your original message objects before conversion.
   const ui = useMessage((m) =>
@@ -155,6 +155,6 @@ We pass this component to our Thread:
 />
 ```
 
-(if you are using unstyled primitives, update MyThread.tsx, and pass the component to MessagePrimitive.Content)
+(if you are using unstyled primitives, update MyThread.tsx, and pass the component to MessagePrimitive.Parts)
 
-Now, the `UI_PLACEHOLDER` content part is replaced with the UI component we defined earlier.
+Now, the `UI_PLACEHOLDER` message part is replaced with the UI component we defined earlier.