@assistant-ui/mcp-docs-server 0.1.35 → 0.1.36

package/.docs/raw/docs/(reference)/api-reference/integrations/react-ai-sdk.mdx

@@ -3,7 +3,7 @@ title: "@assistant-ui/react-ai-sdk"
 description: Vercel AI SDK runtime hooks, chat transports, and message conversion utilities for assistant-ui React applications.
 ---
 
-import { reactAiSdk_AISDKToolkit, reactAiSdk_AssistantChatTransport, reactAiSdk_createResumableSessionStorage, reactAiSdk_getThreadMessageTokenUsage, reactAiSdk_injectQuoteContext, reactAiSdk_useAISDKRuntime, reactAiSdk_useChatRuntime } from "@/generated/integrationTypeDocs";
+import { reactAiSdk_AISDKToolkit, reactAiSdk_AssistantChatTransport, reactAiSdk_createResumableSessionStorage, reactAiSdk_getThreadMessageTokenUsage, reactAiSdk_injectQuoteContext, reactAiSdk_unstable_injectInteractableContext, reactAiSdk_useAISDKRuntime, reactAiSdk_useChatRuntime } from "@/generated/integrationTypeDocs";
 
 {/* AUTO-GENERATED PAGE by scripts/generate-api-reference.mts */}
 {/* Do not edit manually. */}
@@ -34,43 +34,6 @@ import { reactAiSdk_AISDKToolkit, reactAiSdk_AssistantChatTransport, reactAiSdk_
 const frontendTools: (tools: Record<string, ToolJSONSchema>) => ToolSet;
 ```
 
-### generativeTools
-
-<Callout type="warn">
-<strong>Deprecated.</strong> Use [AISDKToolkit](/docs/api-reference/integrations/react-ai-sdk#aisdktoolkit) instead:
-`new AISDKToolkit({ toolkit }).tools({ frontend })`. It is a strict superset
-(it also opens MCP server connections), so it replaces `generativeTools`
-everywhere. The `frontendTools` option is named `frontend` on `.tools()`, and
-`.tools()` is async. `generativeTools` will be removed in a future version.
-</Callout>
-
-Builds an AI SDK `ToolSet` for server-side use with `streamText` /
-`generateText` from a generative `toolkit` and the frontend-uploaded tools.
-
-Each toolkit tool's `execute` runs on the server. Pair this with the
-`"use generative"` compiler: import the toolkit in a server route (where it
-resolves to the server build — schema + `execute`, with `render` stripped) and
-pass it here. Tools without an `execute` are still exposed to the model but
-left for the client to fulfill. `frontendTools` lets the client contribute
-tools that aren't in the static toolkit.
-
-```ts
-// Define once at module scope so any MCP connections pool across requests.
-const aiToolkit = new AISDKToolkit({ toolkit: docsToolkit });
-
-// In your route handler:
-const { tools } = await req.json();
-streamText({
-  model,
-  messages,
-  tools: await aiToolkit.tools({ frontend: tools }),
-});
-```
-
-```ts
-const generativeTools: (options: GenerativeToolsOptions) => ToolSet;
-```
-
 ### getThreadMessageTokenUsage
 
 <ParametersTable {...reactAiSdk_getThreadMessageTokenUsage} />
@@ -104,6 +67,38 @@ export async function POST(req: Request) {
 const RESUMABLE_STREAM_ID_HEADER: "x-resumable-stream-id";
 ```
 
+### unstable_injectInteractableContext
+
+Injects interactable state snapshots into messages as model-visible text.
+
+Mirrors [injectQuoteContext](/docs/api-reference/integrations/react-ai-sdk#injectquotecontext): reads the frozen snapshot stamped on a user
+message's `metadata.custom.interactables` (by the interactables scope at send
+time) and prepends a text part. Run this in your route handler before
+`convertToModelMessages`, which otherwise ignores `metadata.custom`.
+
+Wording is consumer-owned — pass `format` to control how each snapshot reads.
+A snapshot may originate from a user edit or an agent `update_*` call, so the
+default phrasing is neutral. Keep the instance id visible in custom wording:
+the model needs it to address the `update_*` tool's `id` parameter. A custom
+`format` must also handle entries with `partial: true`, whose `state` carries
+only the fields that changed since the model's last known state.
+
+```ts
+import { convertToModelMessages, streamText } from "ai";
+import { unstable_injectInteractableContext } from "@assistant-ui/react-ai-sdk";
+
+export async function POST(req: Request) {
+  const { messages } = await req.json();
+  const result = streamText({
+    model: myModel,
+    messages: await convertToModelMessages(unstable_injectInteractableContext(messages)),
+  });
+  return result.toUIMessageStreamResponse();
+}
+```
+
+<ParametersTable {...reactAiSdk_unstable_injectInteractableContext} />
+
 ### useAISDKRuntime
 
 <ParametersTable {...reactAiSdk_useAISDKRuntime} />
@@ -117,4 +112,41 @@ const RESUMABLE_STREAM_ID_HEADER: "x-resumable-stream-id";
 ```ts
 function useThreadTokenUsage(): ThreadTokenUsage;
 ```
+
+### generativeTools
+
+<Callout type="warn">
+<strong>Deprecated.</strong> Use [AISDKToolkit](/docs/api-reference/integrations/react-ai-sdk#aisdktoolkit) instead:
+`new AISDKToolkit({ toolkit }).tools({ frontend })`. It is a strict superset
+(it also opens MCP server connections), so it replaces `generativeTools`
+everywhere. The `frontendTools` option is named `frontend` on `.tools()`, and
+`.tools()` is async. `generativeTools` will be removed in a future version.
+</Callout>
+
+Builds an AI SDK `ToolSet` for server-side use with `streamText` /
+`generateText` from a generative `toolkit` and the frontend-uploaded tools.
+
+Each toolkit tool's `execute` runs on the server. Pair this with the
+`"use generative"` compiler: import the toolkit in a server route (where it
+resolves to the server build — schema + `execute`, with `render` stripped) and
+pass it here. Tools without an `execute` are still exposed to the model but
+left for the client to fulfill. `frontendTools` lets the client contribute
+tools that aren't in the static toolkit.
+
+```ts
+// Define once at module scope so any MCP connections pool across requests.
+const aiToolkit = new AISDKToolkit({ toolkit: docsToolkit });
+
+// In your route handler:
+const { tools } = await req.json();
+streamText({
+  model,
+  messages,
+  tools: await aiToolkit.tools({ frontend: tools }),
+});
+```
+
+```ts
+const generativeTools: (options: GenerativeToolsOptions) => ToolSet;
+```
 {/* api-reference:end */}

package/.docs/raw/docs/(reference)/api-reference/primitives/action-bar.mdx

@@ -53,6 +53,18 @@ const AssistantMessageBar = () => (
   <p>This primitive renders a <code>{`<${ActionBarPrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ActionBarPrimitive.Root
+  hideWhenRunning={true}
+  autohide="not-last"
+  autohideFloat="single-branch"
+>
+  <ActionBarPrimitive.Copy />
+  <ActionBarPrimitive.Edit />
+  <ActionBarPrimitive.Reload />
+</ActionBarPrimitive.Root>
+```
+
 <ParametersTable {...ActionBarPrimitiveRootProps} />
 
 {/* api-manual:ActionBarPrimitive.Root:start */}
@@ -75,6 +87,12 @@ const AssistantMessageBar = () => (
   <p>This primitive renders a <code>{`<${ActionBarPrimitiveDocs.Copy?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ActionBarPrimitive.Copy copiedDuration={2000}>
+  Copy Message
+</ActionBarPrimitive.Copy>
+```
+
 <ParametersTable {...ActionBarPrimitiveCopyProps} />
 
 {/* api-manual:ActionBarPrimitive.Copy:start */}
@@ -97,6 +115,12 @@ const AssistantMessageBar = () => (
   <p>This primitive renders a <code>{`<${ActionBarPrimitiveDocs.Reload?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ActionBarPrimitive.Reload>
+  Reload Message
+</ActionBarPrimitive.Reload>
+```
+
 <ParametersTable {...ActionBarPrimitiveReloadProps} />
 
 ### Edit
@@ -113,6 +137,12 @@ const AssistantMessageBar = () => (
   <p>This primitive renders a <code>{`<${ActionBarPrimitiveDocs.Edit?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ActionBarPrimitive.Edit>
+  Edit Message
+</ActionBarPrimitive.Edit>
+```
+
 <ParametersTable {...ActionBarPrimitiveEditProps} />
 
 ### Speak

package/.docs/raw/docs/(reference)/api-reference/primitives/attachment.mdx

@@ -54,6 +54,13 @@ const MyComposerAttachment = () => (
   <p>This primitive renders a <code>{`<${AttachmentPrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<AttachmentPrimitive.Root>
+  <AttachmentPrimitive.Name />
+  <AttachmentPrimitive.Remove />
+</AttachmentPrimitive.Root>
+```
+
 <ParametersTable {...AttachmentPrimitiveRootProps} />
 
 ### Name

package/.docs/raw/docs/(reference)/api-reference/primitives/branch-picker.mdx

@@ -47,6 +47,14 @@ const BranchPicker = () => (
   <p>This primitive renders a <code>{`<${BranchPickerPrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<BranchPickerPrimitive.Root hideWhenSingleBranch={true}>
+  <BranchPickerPrimitive.Previous />
+  <BranchPickerPrimitive.Count />
+  <BranchPickerPrimitive.Next />
+</BranchPickerPrimitive.Root>
+```
+
 <ParametersTable {...BranchPickerPrimitiveRootProps} />
 
 ### Next
@@ -63,6 +71,12 @@ const BranchPicker = () => (
   <p>This primitive renders a <code>{`<${BranchPickerPrimitiveDocs.Next?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<BranchPickerPrimitive.Next>
+  Next →
+</BranchPickerPrimitive.Next>
+```
+
 <ParametersTable {...BranchPickerPrimitiveNextProps} />
 
 ### Previous
@@ -79,6 +93,12 @@ const BranchPicker = () => (
   <p>This primitive renders a <code>{`<${BranchPickerPrimitiveDocs.Previous?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<BranchPickerPrimitive.Previous>
+  ← Previous
+</BranchPickerPrimitive.Previous>
+```
+
 <ParametersTable {...BranchPickerPrimitivePreviousProps} />
 
 ### Count
@@ -95,6 +115,12 @@ const BranchPicker = () => (
   <p>This primitive renders a <code>{`<${BranchPickerPrimitiveDocs.Count?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<div>
+  Branch <BranchPickerPrimitive.Count /> of {totalBranches}
+</div>
+```
+
 {BranchPickerPrimitiveDocs.Count?.props && (
   <ParametersTable type={BranchPickerPrimitiveDocs.Count?.element} parameters={BranchPickerPrimitiveDocs.Count.props} />
 )}

package/.docs/raw/docs/(reference)/api-reference/primitives/chain-of-thought.mdx

@@ -31,6 +31,15 @@ For examples and usage patterns, see [ChainOfThought](/docs/primitives/chain-of-
   <p>This primitive renders a <code>{`<${ChainOfThoughtPrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ChainOfThoughtPrimitive.Root>
+  <ChainOfThoughtPrimitive.AccordionTrigger>
+    Toggle reasoning
+  </ChainOfThoughtPrimitive.AccordionTrigger>
+  <ChainOfThoughtPrimitive.Parts />
+</ChainOfThoughtPrimitive.Root>
+```
+
 <ParametersTable {...ChainOfThoughtPrimitiveRootProps} />
 
 ### AccordionTrigger
@@ -47,6 +56,12 @@ For examples and usage patterns, see [ChainOfThought](/docs/primitives/chain-of-
   <p>This primitive renders a <code>{`<${ChainOfThoughtPrimitiveDocs.AccordionTrigger?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ChainOfThoughtPrimitive.AccordionTrigger>
+  Toggle Reasoning
+</ChainOfThoughtPrimitive.AccordionTrigger>
+```
+
 <ParametersTable {...ChainOfThoughtPrimitiveAccordionTriggerProps} />
 
 ### Parts

package/.docs/raw/docs/(reference)/api-reference/primitives/composer.mdx

@@ -78,6 +78,13 @@ const ComposerWithDictation = () => (
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Root>
+  <ComposerPrimitive.Input placeholder="Type your message..." />
+  <ComposerPrimitive.Send>Send</ComposerPrimitive.Send>
+</ComposerPrimitive.Root>
+```
+
 <ParametersTable {...ComposerPrimitiveRootProps} />
 
 ### Input
@@ -94,6 +101,26 @@ const ComposerWithDictation = () => (
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Input?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+// Ctrl/Cmd+Enter to submit (plain Enter inserts newline)
+<ComposerPrimitive.Input
+  placeholder="Type your message..."
+  submitMode="ctrlEnter"
+/>
+
+// Insert a newline on Enter on touch-primary devices.
+<ComposerPrimitive.Input
+  placeholder="Type your message..."
+  unstable_insertNewlineOnTouchEnter
+/>
+
+// Old API (deprecated, still supported)
+<ComposerPrimitive.Input
+  placeholder="Type your message..."
+  submitOnEnter={true}
+/>
+```
+
 <ParametersTable {...ComposerPrimitiveInputProps} />
 
 {/* api-manual:ComposerPrimitive.Input:start */}
@@ -150,6 +177,12 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Send?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Send>
+  Send Message
+</ComposerPrimitive.Send>
+```
+
 <ParametersTable {...ComposerPrimitiveSendProps} />
 
 ### Cancel
@@ -166,6 +199,12 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Cancel?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Cancel>
+  Cancel
+</ComposerPrimitive.Cancel>
+```
+
 <ParametersTable {...ComposerPrimitiveCancelProps} />
 
 ### AddAttachment
@@ -252,6 +291,12 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Dictate?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Dictate>
+  <MicIcon />
+</ComposerPrimitive.Dictate>
+```
+
 <ParametersTable {...ComposerPrimitiveDictateProps} />
 
 ### StopDictation
@@ -268,6 +313,12 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.StopDictation?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.StopDictation>
+  <StopIcon />
+</ComposerPrimitive.StopDictation>
+```
+
 <ParametersTable {...ComposerPrimitiveStopDictationProps} />
 
 ### DictationTranscript
@@ -284,6 +335,14 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.DictationTranscript?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.If dictation>
+  <div className="dictation-preview">
+    <ComposerPrimitive.DictationTranscript />
+  </div>
+</ComposerPrimitive.If>
+```
+
 <ParametersTable {...ComposerPrimitiveDictationTranscriptProps} />
 
 ### If
@@ -316,6 +375,13 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Quote?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Quote>
+  <ComposerPrimitive.QuoteText />
+  <ComposerPrimitive.QuoteDismiss>×</ComposerPrimitive.QuoteDismiss>
+</ComposerPrimitive.Quote>
+```
+
 <ParametersTable {...ComposerPrimitiveQuoteProps} />
 
 ### QuoteText
@@ -332,6 +398,10 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.QuoteText?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.QuoteText />
+```
+
 <ParametersTable {...ComposerPrimitiveQuoteTextProps} />
 
 ### QuoteDismiss
@@ -348,6 +418,10 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.QuoteDismiss?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.QuoteDismiss>×</ComposerPrimitive.QuoteDismiss>
+```
+
 <ParametersTable {...ComposerPrimitiveQuoteDismissProps} />
 
 ### Queue
@@ -364,6 +438,17 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Queue?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Queue>
+  {({ queueItem }) => (
+    <div>
+      <QueueItemPrimitive.Text />
+      <QueueItemPrimitive.Steer>Run Now</QueueItemPrimitive.Steer>
+    </div>
+  )}
+</ComposerPrimitive.Queue>
+```
+
 <ParametersTable {...ComposerPrimitiveQueueProps} />
 
 ### Unstable_TriggerPopover
@@ -402,6 +487,24 @@ Only takes effect when `submitMode` resolves to `"enter"` (the default); `"ctrlE
   <p>This primitive renders a <code>{`<${ComposerPrimitiveDocs.Unstable_TriggerPopoverRoot?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<ComposerPrimitive.Unstable_TriggerPopoverRoot>
+  <ComposerPrimitive.Unstable_TriggerPopover char="@" adapter={mentionAdapter}>
+    <ComposerPrimitive.Unstable_TriggerPopover.Directive formatter={formatter} />
+    ...
+  </ComposerPrimitive.Unstable_TriggerPopover>
+
+  <ComposerPrimitive.Unstable_TriggerPopover char="/" adapter={slashAdapter}>
+    <ComposerPrimitive.Unstable_TriggerPopover.Action onExecute={handler} />
+    ...
+  </ComposerPrimitive.Unstable_TriggerPopover>
+
+  <ComposerPrimitive.Root>
+    <ComposerPrimitive.Input />
+  </ComposerPrimitive.Root>
+</ComposerPrimitive.Unstable_TriggerPopoverRoot>
+```
+
 <ParametersTable {...ComposerPrimitiveUnstable_TriggerPopoverRootProps} />
 
 ### Unstable_TriggerPopoverCategories

package/.docs/raw/docs/(reference)/api-reference/primitives/message-part.mdx

@@ -41,6 +41,14 @@ const TextMessagePart = () => {
   <p>This primitive renders a <code>{`<${MessagePartPrimitiveDocs.Text?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<MessagePartPrimitive.Text
+  smooth={true}
+  component="p"
+  className="message-text"
+/>
+```
+
 <ParametersTable {...MessagePartPrimitiveTextProps} />
 
 {/* api-manual:MessagePartPrimitive.Text:start */}
@@ -63,6 +71,14 @@ const TextMessagePart = () => {
   <p>This primitive renders a <code>{`<${MessagePartPrimitiveDocs.Image?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<MessagePartPrimitive.Image
+  alt="Generated image"
+  className="message-image"
+  style={{ maxWidth: '100%' }}
+/>
+```
+
 <ParametersTable {...MessagePartPrimitiveImageProps} />
 
 ### InProgress

package/.docs/raw/docs/(reference)/api-reference/primitives/message.mdx

@@ -55,6 +55,16 @@ const AssistantMessage = () => (
   <p>This primitive renders a <code>{`<${MessagePrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<MessagePrimitive.Root>
+  <MessagePrimitive.Content />
+  <ActionBarPrimitive.Root>
+    <ActionBarPrimitive.Copy />
+    <ActionBarPrimitive.Edit />
+  </ActionBarPrimitive.Root>
+</MessagePrimitive.Root>
+```
+
 <ParametersTable {...MessagePrimitiveRootProps} />
 
 ### Parts
@@ -201,6 +211,27 @@ const AssistantMessage = () => (
   <p>This primitive renders a <code>{`<${MessagePrimitiveDocs.GroupedParts?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<MessagePrimitive.GroupedParts
+  groupBy={groupPartByType({
+    reasoning: ["group-thought", "group-reasoning"],
+    "tool-call": ["group-thought", "group-tool"],
+  })}
+>
+  {({ part, children }) => {
+    switch (part.type) {
+      case "group-thought":   return <Thought>{children}</Thought>;
+      case "group-reasoning": return <Reasoning>{children}</Reasoning>;
+      case "group-tool":      return <ToolStack>{children}</ToolStack>;
+      case "text":            return <MarkdownText />;
+      case "tool-call":       return part.toolUI ?? <ToolFallback {...part} />;
+      case "indicator":       return <LoadingDots />;
+      default:                return null;
+    }
+  }}
+</MessagePrimitive.GroupedParts>
+```
+
 <ParametersTable {...MessagePrimitiveGroupedPartsProps} />
 
 ### GenerativeUI
@@ -217,6 +248,12 @@ const AssistantMessage = () => (
   <p>This primitive renders a <code>{`<${MessagePrimitiveDocs.GenerativeUI?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<MessagePrimitive.GenerativeUI
+  components={{ Card: MyCard, Button: MyButton }}
+/>
+```
+
 <ParametersTable {...MessagePrimitiveGenerativeUIProps} />
 
 ### Unstable_PartsGrouped
@@ -233,6 +270,25 @@ const AssistantMessage = () => (
   <p>This primitive renders a <code>{`<${MessagePrimitiveDocs.Unstable_PartsGrouped?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+// Group by parent ID (default behavior)
+<MessagePrimitive.Unstable_PartsGrouped
+  components={{
+    Text: ({ text }) => <p className="message-text">{text}</p>,
+    Image: ({ image }) => <img src={image} alt="Message image" />,
+    Group: ({ groupKey, indices, children }) => {
+      if (!groupKey) return <>{children}</>;
+      return (
+        <div className="parent-group border rounded p-4">
+          <h4>Parent ID: {groupKey}</h4>
+          {children}
+        </div>
+      );
+    }
+  }}
+/>
+```
+
 <ParametersTable {...MessagePrimitiveUnstable_PartsGroupedProps} />
 
 ### Unstable_PartsGroupedByParentId

package/.docs/raw/docs/(reference)/api-reference/primitives/queue-item.mdx

@@ -29,6 +29,10 @@ import { QueueItemPrimitive as QueueItemPrimitiveDocs } from "@/generated/primit
   <p>This primitive renders a <code>{`<${QueueItemPrimitiveDocs.Text?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<QueueItemPrimitive.Text />
+```
+
 <ParametersTable {...QueueItemPrimitiveTextProps} />
 
 ### Steer
@@ -45,6 +49,10 @@ import { QueueItemPrimitive as QueueItemPrimitiveDocs } from "@/generated/primit
   <p>This primitive renders a <code>{`<${QueueItemPrimitiveDocs.Steer?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<QueueItemPrimitive.Steer>Run Now</QueueItemPrimitive.Steer>
+```
+
 <ParametersTable {...QueueItemPrimitiveSteerProps} />
 
 ### Remove
@@ -61,5 +69,9 @@ import { QueueItemPrimitive as QueueItemPrimitiveDocs } from "@/generated/primit
   <p>This primitive renders a <code>{`<${QueueItemPrimitiveDocs.Remove?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<QueueItemPrimitive.Remove>×</QueueItemPrimitive.Remove>
+```
+
 <ParametersTable {...QueueItemPrimitiveRemoveProps} />
 {/* api-reference:end */}

package/.docs/raw/docs/(reference)/api-reference/primitives/selection-toolbar.mdx

@@ -54,6 +54,12 @@ Place this component inside `ThreadPrimitive.Root`:
   <p>This primitive renders a <code>{`<${SelectionToolbarPrimitiveDocs.Root?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<SelectionToolbarPrimitive.Root>
+  <SelectionToolbarPrimitive.Quote>Quote</SelectionToolbarPrimitive.Quote>
+</SelectionToolbarPrimitive.Root>
+```
+
 <ParametersTable {...SelectionToolbarPrimitiveRootProps} />
 
 ### Quote
@@ -70,5 +76,11 @@ Place this component inside `ThreadPrimitive.Root`:
   <p>This primitive renders a <code>{`<${SelectionToolbarPrimitiveDocs.Quote?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<SelectionToolbarPrimitive.Quote>
+  <QuoteIcon /> Quote
+</SelectionToolbarPrimitive.Quote>
+```
+
 <ParametersTable {...SelectionToolbarPrimitiveQuoteProps} />
 {/* api-reference:end */}

package/.docs/raw/docs/(reference)/api-reference/primitives/suggestion.mdx

@@ -31,6 +31,10 @@ For examples and usage patterns, see [Suggestion](/docs/primitives/suggestion).
   <p>This primitive renders a <code>{`<${SuggestionPrimitiveDocs.Title?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<SuggestionPrimitive.Title />
+```
+
 <ParametersTable {...SuggestionPrimitiveTitleProps} />
 
 ### Description
@@ -47,6 +51,10 @@ For examples and usage patterns, see [Suggestion](/docs/primitives/suggestion).
   <p>This primitive renders a <code>{`<${SuggestionPrimitiveDocs.Description?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<SuggestionPrimitive.Description />
+```
+
 <ParametersTable {...SuggestionPrimitiveDescriptionProps} />
 
 ### Trigger
@@ -63,5 +71,11 @@ For examples and usage patterns, see [Suggestion](/docs/primitives/suggestion).
   <p>This primitive renders a <code>{`<${SuggestionPrimitiveDocs.Trigger?.element}>`}</code> element unless <code>asChild</code> is set.</p>
 )}
 
+```tsx
+<SuggestionPrimitive.Trigger send>
+  Click me
+</SuggestionPrimitive.Trigger>
+```
+
 <ParametersTable {...SuggestionPrimitiveTriggerProps} />
 {/* api-reference:end */}