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

package/.docs/raw/docs/primitives/composer.mdx

@@ -1,6 +1,7 @@
 ---
 title: Composer
 description: Build custom message input UIs with full control over layout and behavior.
+platforms: ["react"]
 ---
 
 import { ComposerPrimitiveSample } from "@/components/docs/samples/composer-primitive";
@@ -104,26 +105,31 @@ The primitive's behavior (keyboard handling, disabled state, form submission) is
 
 ### Unstable Trigger Popovers
 
-Composer includes an unstable **trigger popover** system for character-triggered popovers (e.g. `@` for mentions, `/` for slash commands). Multiple triggers can coexist on the same input.
-
-**Mentions** (`@` trigger) — insert directive text into the message:
+Composer includes an unstable **trigger popover** system for character-triggered popovers (e.g. `@` for mentions, `/` for slash commands). Multiple triggers coexist under a single `TriggerPopoverRoot`.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionRoot adapter={mentionAdapter}>
+<ComposerPrimitive.Unstable_TriggerPopoverRoot>
   <ComposerPrimitive.Root>
-    <ComposerPrimitive.Input placeholder="Type @ to mention..." />
-    <ComposerPrimitive.Unstable_MentionPopover />
-  </ComposerPrimitive.Root>
-</ComposerPrimitive.Unstable_MentionRoot>
-```
-
-**Slash commands** (`/` trigger) — execute an action and clear the command text:
+    <ComposerPrimitive.Input placeholder="Type @ to mention, / for commands..." />
 
-```tsx
-<ComposerPrimitive.Unstable_SlashCommandRoot adapter={slashAdapter}>
-  <ComposerPrimitive.Root>
-    <ComposerPrimitive.Input placeholder="Type / for commands..." />
-    <ComposerPrimitive.Unstable_TriggerPopoverPopover>
+    {/* @ mention — inserts directive text into the message */}
+    <ComposerPrimitive.Unstable_TriggerPopover
+      char="@"
+      adapter={mentionAdapter}
+    >
+      <ComposerPrimitive.Unstable_TriggerPopover.Directive formatter={formatter} />
+      {/* popover UI */}
+    </ComposerPrimitive.Unstable_TriggerPopover>
+
+    {/* / slash command — runs a handler on selection; leaves an audit-trail chip by default */}
+    <ComposerPrimitive.Unstable_TriggerPopover
+      char="/"
+      adapter={slashAdapter}
+    >
+      <ComposerPrimitive.Unstable_TriggerPopover.Action
+        formatter={formatter}
+        onExecute={(item) => commandHandlers[item.id]?.()}
+      />
       <ComposerPrimitive.Unstable_TriggerPopoverItems>
         {(items) => items.map(item => (
           <ComposerPrimitive.Unstable_TriggerPopoverItem key={item.id} item={item}>
@@ -131,9 +137,9 @@ Composer includes an unstable **trigger popover** system for character-triggered
           </ComposerPrimitive.Unstable_TriggerPopoverItem>
         ))}
       </ComposerPrimitive.Unstable_TriggerPopoverItems>
-    </ComposerPrimitive.Unstable_TriggerPopoverPopover>
+    </ComposerPrimitive.Unstable_TriggerPopover>
   </ComposerPrimitive.Root>
-</ComposerPrimitive.Unstable_SlashCommandRoot>
+</ComposerPrimitive.Unstable_TriggerPopoverRoot>
 ```
 
 See the [Mentions guide](/docs/guides/mentions) and [Slash Commands guide](/docs/guides/slash-commands) for full documentation.
@@ -313,103 +319,130 @@ Clears the active quote from the composer. Renders a `<button>` element unless `
 </ComposerPrimitive.QuoteDismiss>
 ```
 
-### Unstable_MentionRoot
+### Unstable_TriggerPopoverRoot
 
-Provider that manages mention state and `@` trigger detection.
+Root provider that groups one or more `TriggerPopover` declarations and owns the shared input plugin registry.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionRoot trigger="@" adapter={mentionAdapter}>
+<ComposerPrimitive.Unstable_TriggerPopoverRoot>
   <ComposerPrimitive.Root>
-    <LexicalComposerInput placeholder="Type @ to mention a tool..." />
-    <ComposerPrimitive.Unstable_MentionPopover />
+    <LexicalComposerInput placeholder="Type @ to mention, / for commands..." />
+    <ComposerPrimitive.Unstable_TriggerPopover char="@" adapter={mentionAdapter}>
+      <ComposerPrimitive.Unstable_TriggerPopover.Directive formatter={formatter} />
+      ...
+    </ComposerPrimitive.Unstable_TriggerPopover>
   </ComposerPrimitive.Root>
-</ComposerPrimitive.Unstable_MentionRoot>
+</ComposerPrimitive.Unstable_TriggerPopoverRoot>
 ```
 
-<PrimitivesTypeTable type="ComposerPrimitiveMentionRootProps" parameters={ComposerPrimitiveDocs.Unstable_MentionRoot.props} />
+### Unstable_TriggerPopover
 
-### Unstable_MentionPopover
-
-Container for the mention picker popover. It only renders while a trigger match is active.
+Declares a trigger (by `char`, `adapter`) and renders the popover container. Selection behavior is declared by rendering exactly one behavior sub-primitive inside — either `<Unstable_TriggerPopover.Directive>` (insert a directive on selection) or `<Unstable_TriggerPopover.Action>` (run `onExecute` on selection). Only renders its DOM (and children) while the trigger is active in the composer input.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionPopover className="rounded-lg border bg-popover p-1 shadow-md">
-  <ComposerPrimitive.Unstable_MentionCategories>
+<ComposerPrimitive.Unstable_TriggerPopover
+  char="@"
+  adapter={mentionAdapter}
+  className="rounded-lg border bg-popover p-1 shadow-md"
+>
+  <ComposerPrimitive.Unstable_TriggerPopover.Directive formatter={formatter} />
+  <ComposerPrimitive.Unstable_TriggerPopoverCategories>
     {(categories) => categories.map((category) => (
-      <ComposerPrimitive.Unstable_MentionCategoryItem
+      <ComposerPrimitive.Unstable_TriggerPopoverCategoryItem
         key={category.id}
         categoryId={category.id}
       >
         {category.label}
-      </ComposerPrimitive.Unstable_MentionCategoryItem>
+      </ComposerPrimitive.Unstable_TriggerPopoverCategoryItem>
     ))}
-  </ComposerPrimitive.Unstable_MentionCategories>
-</ComposerPrimitive.Unstable_MentionPopover>
+  </ComposerPrimitive.Unstable_TriggerPopoverCategories>
+</ComposerPrimitive.Unstable_TriggerPopover>
+```
+
+Behavior is supplied by exactly one of two sub-primitives:
+
+- `<Unstable_TriggerPopover.Directive formatter={...} onInserted={...} />` — writes `:type[label]{name=id}` into the composer text (mention behavior)
+- `<Unstable_TriggerPopover.Action onExecute={...} removeOnExecute={...} />` — runs a callback on selection; leaves a directive chip behind by default (slash-command behavior)
+
+### Unstable_TriggerPopover.Directive
+
+Behavior sub-primitive. Registers the directive-insert behavior with its parent `TriggerPopover`. Renders nothing.
+
+```tsx
+<ComposerPrimitive.Unstable_TriggerPopover.Directive
+  formatter={unstable_defaultDirectiveFormatter}
+  onInserted={(item) => track("mention", item.id)}
+/>
+```
+
+### Unstable_TriggerPopover.Action
+
+Behavior sub-primitive. Registers the action behavior with its parent `TriggerPopover`. Renders nothing. By default leaves a directive chip behind after executing (audit trail); pass `removeOnExecute` to strip the trigger text entirely.
+
+```tsx
+<ComposerPrimitive.Unstable_TriggerPopover.Action
+  onExecute={(item) => commandHandlers[item.id]?.()}
+  removeOnExecute={false}
+/>
 ```
 
-### Unstable_MentionCategories
+### Unstable_TriggerPopoverCategories
 
-Render-function primitive for the top-level mention categories.
+Render-function primitive for the top-level category list. Only renders while no category is active and search mode is off.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionCategories>
+<ComposerPrimitive.Unstable_TriggerPopoverCategories>
   {(categories) => categories.map((category) => (
-    <ComposerPrimitive.Unstable_MentionCategoryItem
+    <ComposerPrimitive.Unstable_TriggerPopoverCategoryItem
       key={category.id}
       categoryId={category.id}
     >
       {category.label}
-    </ComposerPrimitive.Unstable_MentionCategoryItem>
+    </ComposerPrimitive.Unstable_TriggerPopoverCategoryItem>
   ))}
-</ComposerPrimitive.Unstable_MentionCategories>
+</ComposerPrimitive.Unstable_TriggerPopoverCategories>
 ```
 
-<PrimitivesTypeTable type="ComposerPrimitiveMentionCategoriesProps" parameters={ComposerPrimitiveDocs.Unstable_MentionCategories.props} />
+### Unstable_TriggerPopoverCategoryItem
 
-### Unstable_MentionCategoryItem
-
-Button that selects a mention category and drills into its items.
+Button that selects a category and drills into its items.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionCategoryItem categoryId="tools">
+<ComposerPrimitive.Unstable_TriggerPopoverCategoryItem categoryId="tools">
   Tools
-</ComposerPrimitive.Unstable_MentionCategoryItem>
+</ComposerPrimitive.Unstable_TriggerPopoverCategoryItem>
 ```
 
-### Unstable_MentionItems
+### Unstable_TriggerPopoverItems
 
-Render-function primitive for the items inside the currently selected category.
+Render-function primitive for the items inside the currently selected category (or global search results).
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionItems>
+<ComposerPrimitive.Unstable_TriggerPopoverItems>
   {(items) => items.map((item) => (
-    <ComposerPrimitive.Unstable_MentionItem key={item.id} item={item} />
+    <ComposerPrimitive.Unstable_TriggerPopoverItem key={item.id} item={item} />
   ))}
-</ComposerPrimitive.Unstable_MentionItems>
+</ComposerPrimitive.Unstable_TriggerPopoverItems>
 ```
 
-<PrimitivesTypeTable type="ComposerPrimitiveMentionItemsProps" parameters={ComposerPrimitiveDocs.Unstable_MentionItems.props} />
-
-### Unstable_MentionItem
+### Unstable_TriggerPopoverItem
 
-Selectable mention item inside the popover.
+Selectable item inside the popover.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionItem item={item}>
+<ComposerPrimitive.Unstable_TriggerPopoverItem item={item}>
   {item.label}
-</ComposerPrimitive.Unstable_MentionItem>
+</ComposerPrimitive.Unstable_TriggerPopoverItem>
 ```
 
-<PrimitivesTypeTable type="ComposerPrimitiveMentionItemProps" parameters={ComposerPrimitiveDocs.Unstable_MentionItem.props} />
-
-### Unstable_MentionBack
+### Unstable_TriggerPopoverBack
 
 Back button used when drilling from categories into a specific item list.
 
 ```tsx
-<ComposerPrimitive.Unstable_MentionBack className="rounded-md px-2 py-1 text-sm hover:bg-accent">
+<ComposerPrimitive.Unstable_TriggerPopoverBack className="rounded-md px-2 py-1 text-sm hover:bg-accent">
   Back
-</ComposerPrimitive.Unstable_MentionBack>
+</ComposerPrimitive.Unstable_TriggerPopoverBack>
 ```
 
 ## Patterns
@@ -473,7 +506,7 @@ The dropzone sets `data-dragging` when a file is being dragged over it, so you c
 `DictationTranscript` renders a `<span>` showing the interim speech-to-text transcript while the user is speaking.
 
 <Callout type="info">
-Voice input requires a `DictationAdapter` configured in your runtime. See [Speech & Dictation](/docs/guides/speech) for setup.
+Voice input requires a `DictationAdapter` configured in your runtime. See [Dictation](/docs/guides/dictation) for setup.
 </Callout>
 
 ### Custom Submit Behavior

package/.docs/raw/docs/primitives/error.mdx

@@ -1,6 +1,7 @@
 ---
 title: Error
 description: Accessible error display for messages with automatic error text extraction.
+platforms: ["react"]
 ---
 
 import { ErrorPrimitiveSample } from "@/components/docs/samples/error-primitive";

package/.docs/raw/docs/primitives/index.mdx

@@ -1,6 +1,7 @@
 ---
 title: Overview
 description: Unstyled, accessible building blocks for AI chat interfaces.
+platforms: ["react"]
 ---
 
 Primitives are the foundation of assistant-ui. They are unstyled, accessible React components that handle all the wiring for AI chat, including state management, keyboard shortcuts, auto-scrolling, streaming, and tool calls, so you can focus entirely on your UI.
@@ -84,7 +85,7 @@ Additional primitive references:
 - [ThreadListItemPrimitive](/docs/api-reference/primitives/thread-list-item)
 - [ThreadListItemMorePrimitive](/docs/api-reference/primitives/thread-list-item-more)
 - [ActionBarMorePrimitive](/docs/api-reference/primitives/action-bar-more)
-- [AssistantIf (`AuiIf`)](/docs/api-reference/primitives/assistant-if)
+- [AuiIf](/docs/api-reference/primitives/assistant-if)
 
 ## Common Mistakes
 

package/.docs/raw/docs/primitives/message.mdx

@@ -1,6 +1,7 @@
 ---
 title: Message
 description: Build custom message rendering with content parts, attachments, and hover state.
+platforms: ["react"]
 ---
 
 import { MessagePrimitiveSample } from "@/components/docs/samples/message-primitive";
@@ -108,7 +109,7 @@ Runtime setup: primitives require runtime context. Wrap your UI in `AssistantRun
 ```
 
 <Callout type="info">
-For most new `MessagePrimitive.Parts` code, prefer the `children` render function. Grouped Chain of Thought is the current exception: it plugs into `MessagePrimitive.Parts` via `components.ChainOfThought`.
+For most new code, prefer `MessagePrimitive.Parts` with a `children` render function. When you need adjacent grouping, use `MessagePrimitive.GroupedParts`.
 </Callout>
 
 ### Tool Resolution
@@ -145,7 +146,7 @@ Returning `null` still allows registered tool UIs and data renderer UIs to rende
 
 - `ToolGroup` wraps consecutive tool-call parts
 - `ReasoningGroup` wraps consecutive reasoning parts
-- `components.ChainOfThought` takes over all reasoning and tool-call rendering (mutually exclusive with `ToolGroup`, `ReasoningGroup`, `tools`, and `Reasoning`). Despite the deprecation of `components` in general, this is still the current way to wire grouped Chain of Thought.
+- `components.ChainOfThought` takes over all reasoning and tool-call rendering (mutually exclusive with `ToolGroup`, `ReasoningGroup`, `tools`, and `Reasoning`). This legacy path is deprecated; use `MessagePrimitive.GroupedParts` for grouped Chain of Thought in new code.
 - `data.by_name` and `data.Fallback` let you route custom data part types
 - `Quote` renders quoted message references from metadata
 - `Empty` and `Unstable_Audio` are available for edge and experimental rendering paths
@@ -187,7 +188,7 @@ Returning `null` still allows registered tool UIs and data renderer UIs to rende
 />
 ```
 
-For new code, use the `children` render function instead.
+For new code, use the `children` render function or `GroupedParts` instead.
 
 ### Hover State
 
@@ -247,6 +248,45 @@ Renders each content part with type-based component resolution.
 
 <PrimitivesTypeTable type="MessagePrimitivePartsProps" parameters={MessagePrimitiveDocs.Parts.props} />
 
+### GroupedParts
+
+Groups adjacent message parts into a nested tree. Use `groupBy` to return group keys for parts that should be grouped, then switch on `part.type` in the render function. Group cases render `children`; leaf cases render their own UI.
+
+```tsx
+<MessagePrimitive.GroupedParts
+  groupBy={(part) => {
+    if (part.type === "reasoning")
+      return ["group-chainOfThought", "group-reasoning"];
+    if (part.type === "tool-call")
+      return ["group-chainOfThought", "group-tool"];
+    return null;
+  }}
+>
+  {({ part, children }) => {
+    switch (part.type) {
+      case "group-chainOfThought":
+        return <div>{children}</div>;
+      case "group-reasoning":
+        return <ReasoningRoot>{children}</ReasoningRoot>;
+      case "group-tool":
+        return <ToolGroupRoot>{children}</ToolGroupRoot>;
+      case "text":
+        return <MarkdownText />;
+      case "reasoning":
+        return <Reasoning {...part} />;
+      case "tool-call":
+        return part.toolUI ?? <ToolFallback {...part} />;
+      case "data":
+        return part.dataRendererUI;
+      default:
+        return null;
+    }
+  }}
+</MessagePrimitive.GroupedParts>
+```
+
+<PrimitivesTypeTable type="MessagePrimitiveGroupedPartsProps" parameters={MessagePrimitiveDocs.GroupedParts.props} />
+
 ### Content
 
 Legacy alias for `Parts`.
@@ -340,7 +380,7 @@ Renders quote metadata when the current message includes a quote. Place it above
 
 ### Unstable_PartsGrouped
 
-Groups consecutive parts by a custom grouping function *(unstable)*.
+Groups parts by a custom grouping function *(unstable; use `GroupedParts` for adjacent grouping)*.
 
 ```tsx
 <MessagePrimitive.Unstable_PartsGrouped
@@ -453,9 +493,32 @@ import { ErrorPrimitive, MessagePrimitive } from "@assistant-ui/react";
 
 `ErrorPrimitive.Root` renders a `<div>` container with `role="alert"` and `ErrorPrimitive.Message` renders a `<span>` that displays the error text. `Root` always renders. Only `Message` conditionally returns `null` when there is no error. Wrap in `<MessagePrimitive.Error>` if you want the entire block to be conditional. See the [ErrorPrimitive API Reference](/docs/api-reference/primitives/error) for full details.
 
+### Render After Stream Completes
+
+To render content only once the assistant message has finished streaming (a follow-up card, a feedback prompt, a generated component that should not flicker through partial states), gate it with [`AuiIf`](/docs/api-reference/primitives/assistant-if) on `s.message.status`:
+
+```tsx
+import { MessagePrimitive, AuiIf } from "@assistant-ui/react";
+
+<MessagePrimitive.Root>
+  <MessagePrimitive.Parts />
+
+  <AuiIf
+    condition={(s) =>
+      s.message.role === "assistant" &&
+      s.message.status?.type === "complete"
+    }
+  >
+    <FollowUpCard />
+  </AuiIf>
+</MessagePrimitive.Root>;
+```
+
+`s.message.status` is a discriminated union of `running | requires-action | complete | incomplete`, defined only on assistant messages. The `role === "assistant"` guard keeps the predicate type-safe. For tool-call-driven generative UI that defers rendering inside the part itself, see [Deferred Rendering](/docs/guides/tool-ui#deferred-rendering) in the Generative UI guide.
+
 ### Legacy and Unstable APIs
 
-- `MessagePrimitive.Unstable_PartsGrouped` and `MessagePrimitive.Unstable_PartsGroupedByParentId` are unstable APIs for custom grouping.
+- `MessagePrimitive.Unstable_PartsGrouped` and `MessagePrimitive.Unstable_PartsGroupedByParentId` are unstable APIs for non-adjacent custom grouping.
 - `Unstable_PartsGroupedByParentId` is deprecated in favor of `Unstable_PartsGrouped`.
 
 ### Role-Based Styling

package/.docs/raw/docs/primitives/selection-toolbar.mdx

@@ -1,6 +1,7 @@
 ---
 title: SelectionToolbar
 description: A floating toolbar that appears when text is selected within a message.
+platforms: ["react"]
 ---
 
 import { SelectionToolbarPrimitiveSample } from "@/components/docs/samples/selection-toolbar-primitive";

package/.docs/raw/docs/primitives/suggestion.mdx

@@ -1,6 +1,7 @@
 ---
 title: Suggestion
 description: Suggested prompts that users can click to quickly send or populate the composer.
+platforms: ["react"]
 ---
 
 import { SuggestionPrimitiveSample } from "@/components/docs/samples/suggestion-primitive";

package/.docs/raw/docs/primitives/thread-list.mdx

@@ -1,6 +1,7 @@
 ---
 title: ThreadList
 description: Multi-thread management for listing, creating, switching, archiving, and deleting conversations.
+platforms: ["react"]
 ---
 
 import { ThreadListPrimitiveSample } from "@/components/docs/samples/thread-list-primitive";
@@ -218,6 +219,44 @@ Renders a single thread at a specific index.
 
 <PrimitivesTypeTable type="ThreadListPrimitiveItemByIndexProps" parameters={ThreadListPrimitiveDocs.ItemByIndex.props} />
 
+#### LoadMore
+
+Button that appends the next page of threads. Renders a `<button>` element unless `asChild` is set, and is automatically disabled when the runtime is loading or when the adapter's last `list()` did not return a `nextCursor`. See [Threads concepts](/docs/runtimes/concepts/threads#paginating-the-thread-list) for the adapter contract.
+
+```tsx
+<ThreadListPrimitive.LoadMore className="rounded-lg border px-3 py-2 text-sm">
+  Load more
+</ThreadListPrimitive.LoadMore>
+```
+
+For scroll-driven loading, wrap `aui.threads().loadMore()` in your own `IntersectionObserver` at the application layer; assistant-ui ships the explicit button to keep the primitive surface predictable.
+
+```tsx
+import { useAui, useAuiState } from "@assistant-ui/react";
+import { useEffect, useRef } from "react";
+
+function LoadMoreSentinel() {
+  const aui = useAui();
+  const disabled = useAuiState(
+    (s) =>
+      !s.threads.hasMore || s.threads.isLoading || s.threads.isLoadingMore,
+  );
+  const ref = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    const el = ref.current;
+    if (!el || disabled) return;
+    const observer = new IntersectionObserver(([entry]) => {
+      if (entry?.isIntersecting) aui.threads().loadMore();
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [aui, disabled]);
+
+  return disabled ? null : <div ref={ref} className="h-9" />;
+}
+```
+
 ### ThreadListItemPrimitive
 
 #### Root

package/.docs/raw/docs/primitives/thread.mdx

@@ -1,6 +1,7 @@
 ---
 title: Thread
 description: Build custom scrollable message containers with auto-scroll, empty states, and message rendering.
+platforms: ["react"]
 ---
 
 import { ThreadPrimitiveSample } from "@/components/docs/samples/thread-primitive";
@@ -123,7 +124,18 @@ By default, new messages appear at the bottom and scroll down. With `turnAnchor=
 </ThreadPrimitive.Viewport>
 ```
 
-This is what the shadcn Thread component uses by default. For scroll anchoring to work correctly, `ViewportSlack` is needed on the last assistant message to provide enough min-height for the user message to anchor at the top. This is included automatically in the shadcn component.
+When `turnAnchor="top"` is set, `MessagePrimitive.Root` automatically registers the latest assistant message as the top-anchor target and the preceding user message as the anchor — no additional component is required. The viewport itself manages a stable reserve element that provides the missing scroll range while the assistant response grows. This is the behavior used by the [Thread](/docs/ui/thread) component by default.
+
+Use `topAnchorMessageClamp` to control how much of a long user message remains visible when `turnAnchor="top"`. Messages up to `tallerThan` stay fully visible. For messages taller than that, `visibleHeight` controls how much of the message's bottom edge remains visible above the assistant response:
+
+```tsx
+<ThreadPrimitive.Viewport
+  turnAnchor="top"
+  topAnchorMessageClamp={{ tallerThan: "10em", visibleHeight: "6em" }}
+>
+  {/* messages */}
+</ThreadPrimitive.Viewport>
+```
 
 ### Viewport Scroll Options
 
@@ -274,18 +286,9 @@ Provides viewport context without rendering a scrollable element. Use this when
 
 ### ViewportSlack
 
-Adds min-height for scroll anchoring with `turnAnchor="top"`. It wraps its child element via `Slot` and does not render a DOM element of its own.
-
-```tsx
-<MessagePrimitive.Root>
-  <MessagePrimitive.Parts />
-  <ThreadPrimitive.ViewportSlack>
-    <div className="min-h-[40vh]" />
-  </ThreadPrimitive.ViewportSlack>
-</MessagePrimitive.Root>
-```
-
-Props: `fillClampThreshold` and `fillClampOffset` control how the slack height is calculated. `children` is required.
+<Callout type="warn">
+  `ThreadPrimitive.ViewportSlack` has been removed from the public API. Top-anchor target registration is handled automatically by `MessagePrimitive.Root` when `turnAnchor="top"`. Remove `ViewportSlack` from your tree; if you customized `fillClampThreshold` or `fillClampOffset` on `ViewportSlack` or `MessagePrimitive.Root`, replace those props with `topAnchorMessageClamp` on `ThreadPrimitive.Viewport`.
+</Callout>
 
 ### Messages
 

package/.docs/raw/docs/react-native/index.mdx

@@ -49,9 +49,7 @@ If you prefer to add assistant-ui to an existing Expo project, follow these step
 
 ### Install dependencies
 
-```sh
-npx expo install @assistant-ui/react-native @assistant-ui/react-ai-sdk
-```
+<InstallCommand expo={["@assistant-ui/react-native", "@assistant-ui/react-ai-sdk"]} />
 
   </Step>
   <Step>

package/.docs/raw/docs/react-native/migration.mdx

@@ -29,9 +29,7 @@ If you already have an assistant-ui web app, most of your code transfers directl
 
 ### Install the React Native package
 
-```sh
-npx expo install @assistant-ui/react-native
-```
+<InstallCommand expo={["@assistant-ui/react-native"]} />
 
   </Step>
   <Step>