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

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.
Files changed (214) hide show
  1. package/.docs/organized/code-examples/waterfall.md +15 -7
  2. package/.docs/organized/code-examples/with-a2a.md +9 -21
  3. package/.docs/organized/code-examples/with-ag-ui.md +11 -8
  4. package/.docs/organized/code-examples/with-ai-sdk-v6.md +10 -10
  5. package/.docs/organized/code-examples/with-artifacts.md +12 -10
  6. package/.docs/organized/code-examples/with-assistant-transport.md +11 -12
  7. package/.docs/organized/code-examples/with-chain-of-thought.md +83 -54
  8. package/.docs/organized/code-examples/with-cloud-standalone.md +14 -11
  9. package/.docs/organized/code-examples/with-cloud.md +9 -10
  10. package/.docs/organized/code-examples/with-custom-thread-list.md +61 -16
  11. package/.docs/organized/code-examples/with-elevenlabs-conversational.md +17 -12
  12. package/.docs/organized/code-examples/with-elevenlabs-scribe.md +13 -13
  13. package/.docs/organized/code-examples/with-expo.md +25 -21
  14. package/.docs/organized/code-examples/with-external-store.md +8 -8
  15. package/.docs/organized/code-examples/with-ffmpeg.md +17 -12
  16. package/.docs/organized/code-examples/with-generative-ui.md +9 -9
  17. package/.docs/organized/code-examples/with-google-adk.md +8 -8
  18. package/.docs/organized/code-examples/with-heat-graph.md +5 -5
  19. package/.docs/organized/code-examples/with-interactables.md +10 -25
  20. package/.docs/organized/code-examples/with-langchain.md +437 -0
  21. package/.docs/organized/code-examples/with-langgraph.md +16 -16
  22. package/.docs/organized/code-examples/with-livekit.md +18 -13
  23. package/.docs/organized/code-examples/with-opencode.md +105 -62
  24. package/.docs/organized/code-examples/with-parent-id-grouping.md +10 -10
  25. package/.docs/organized/code-examples/with-react-hook-form.md +220 -148
  26. package/.docs/organized/code-examples/with-react-ink.md +2 -2
  27. package/.docs/organized/code-examples/with-react-router.md +12 -12
  28. package/.docs/organized/code-examples/with-store.md +8 -5
  29. package/.docs/organized/code-examples/with-tanstack.md +10 -10
  30. package/.docs/organized/code-examples/with-tap-runtime.md +10 -6
  31. package/.docs/raw/docs/(docs)/cli.mdx +2 -1
  32. package/.docs/raw/docs/(docs)/copilots/assistant-frame.mdx +1 -0
  33. package/.docs/raw/docs/(docs)/copilots/make-assistant-tool-ui.mdx +10 -3
  34. package/.docs/raw/docs/(docs)/copilots/make-assistant-tool.mdx +8 -3
  35. package/.docs/raw/docs/(docs)/copilots/make-assistant-visible.mdx +1 -0
  36. package/.docs/raw/docs/(docs)/copilots/model-context.mdx +1 -0
  37. package/.docs/raw/docs/(docs)/copilots/motivation.mdx +1 -0
  38. package/.docs/raw/docs/(docs)/copilots/use-assistant-instructions.mdx +1 -0
  39. package/.docs/raw/docs/(docs)/devtools.mdx +1 -0
  40. package/.docs/raw/docs/(docs)/index.mdx +1 -0
  41. package/.docs/raw/docs/(docs)/installation.mdx +1 -0
  42. package/.docs/raw/docs/(docs)/rtl.mdx +80 -0
  43. package/.docs/raw/docs/(reference)/api-reference/adapters/attachments.mdx +34 -0
  44. package/.docs/raw/docs/(reference)/api-reference/adapters/feedback-speech.mdx +41 -0
  45. package/.docs/raw/docs/(reference)/api-reference/adapters/index.mdx +26 -0
  46. package/.docs/raw/docs/(reference)/api-reference/adapters/persistence.mdx +34 -0
  47. package/.docs/raw/docs/(reference)/api-reference/adapters/runtime.mdx +31 -0
  48. package/.docs/raw/docs/(reference)/api-reference/context-providers/index.mdx +20 -0
  49. package/.docs/raw/docs/(reference)/api-reference/hooks/index.mdx +26 -0
  50. package/.docs/raw/docs/(reference)/api-reference/hooks/model-context.mdx +72 -0
  51. package/.docs/raw/docs/(reference)/api-reference/hooks/runtimes.mdx +41 -0
  52. package/.docs/raw/docs/(reference)/api-reference/hooks/state.mdx +48 -0
  53. package/.docs/raw/docs/(reference)/api-reference/hooks/utilities.mdx +30 -0
  54. package/.docs/raw/docs/(reference)/api-reference/integrations/index.mdx +23 -0
  55. package/.docs/raw/docs/(reference)/api-reference/overview.mdx +21 -0
  56. package/.docs/raw/docs/(reference)/api-reference/primitives/assistant-if.mdx +7 -0
  57. package/.docs/raw/docs/(reference)/api-reference/primitives/composer.mdx +149 -40
  58. package/.docs/raw/docs/(reference)/api-reference/primitives/index.mdx +65 -0
  59. package/.docs/raw/docs/(reference)/api-reference/primitives/message-part.mdx +2 -0
  60. package/.docs/raw/docs/(reference)/api-reference/primitives/message.mdx +50 -6
  61. package/.docs/raw/docs/(reference)/api-reference/primitives/thread-list.mdx +15 -0
  62. package/.docs/raw/docs/(reference)/api-reference/primitives/thread.mdx +36 -1
  63. package/.docs/raw/docs/(reference)/api-reference/runtimes/index.mdx +38 -0
  64. package/.docs/raw/docs/(reference)/api-reference/runtimes/thread-list-runtime.mdx +9 -0
  65. package/.docs/raw/docs/(reference)/migrations/v0-14.mdx +144 -6
  66. package/.docs/raw/docs/cloud/ai-sdk-assistant-ui.mdx +231 -3
  67. package/.docs/raw/docs/cloud/ai-sdk.mdx +221 -3
  68. package/.docs/raw/docs/cloud/langgraph.mdx +274 -2
  69. package/.docs/raw/docs/{(docs)/guides → guides}/attachments.mdx +41 -36
  70. package/.docs/raw/docs/guides/branching.mdx +76 -0
  71. package/.docs/raw/docs/guides/chain-of-thought.mdx +166 -0
  72. package/.docs/raw/docs/{(docs)/guides → guides}/context-api.mdx +50 -22
  73. package/.docs/raw/docs/{(docs)/guides → guides}/dictation.mdx +2 -0
  74. package/.docs/raw/docs/guides/editing.mdx +102 -0
  75. package/.docs/raw/docs/guides/index.mdx +103 -0
  76. package/.docs/raw/docs/{(docs)/guides → guides}/interactables.mdx +49 -0
  77. package/.docs/raw/docs/{(docs)/guides → guides}/latex.mdx +51 -8
  78. package/.docs/raw/docs/guides/mentions.mdx +520 -0
  79. package/.docs/raw/docs/{(docs)/guides → guides}/message-timing.mdx +8 -2
  80. package/.docs/raw/docs/{(docs)/guides → guides}/multi-agent.mdx +64 -4
  81. package/.docs/raw/docs/{(docs)/guides → guides}/quoting.mdx +10 -17
  82. package/.docs/raw/docs/guides/slash-commands.mdx +361 -0
  83. package/.docs/raw/docs/guides/speech.mdx +156 -0
  84. package/.docs/raw/docs/{(docs)/guides → guides}/suggestions.mdx +21 -83
  85. package/.docs/raw/docs/{(docs)/guides → guides}/tool-ui.mdx +108 -36
  86. package/.docs/raw/docs/{(docs)/guides → guides}/tools.mdx +131 -35
  87. package/.docs/raw/docs/{(docs)/guides → guides}/voice.mdx +39 -0
  88. package/.docs/raw/docs/ink/index.mdx +1 -3
  89. package/.docs/raw/docs/ink/migration.mdx +1 -3
  90. package/.docs/raw/docs/ink/primitives.mdx +37 -1
  91. package/.docs/raw/docs/integrations/attachments/custom-adapter.mdx +520 -0
  92. package/.docs/raw/docs/integrations/auth/better-auth.mdx +191 -0
  93. package/.docs/raw/docs/integrations/auth/clerk.mdx +172 -0
  94. package/.docs/raw/docs/integrations/auth/next-auth.mdx +196 -0
  95. package/.docs/raw/docs/integrations/frameworks/ai-sdk.mdx +79 -0
  96. package/.docs/raw/docs/integrations/frameworks/mastra/full-stack.mdx +188 -0
  97. package/.docs/raw/docs/integrations/frameworks/mastra/overview.mdx +57 -0
  98. package/.docs/raw/docs/integrations/frameworks/mastra/separate-server.mdx +201 -0
  99. package/.docs/raw/docs/integrations/gateways/index.mdx +157 -0
  100. package/.docs/raw/docs/integrations/index.mdx +173 -0
  101. package/.docs/raw/docs/integrations/observability/helicone.mdx +130 -0
  102. package/.docs/raw/docs/integrations/observability/langfuse.mdx +156 -0
  103. package/.docs/raw/docs/integrations/observability/langsmith.mdx +146 -0
  104. package/.docs/raw/docs/integrations/persistence/custom-adapter.mdx +712 -0
  105. package/.docs/raw/docs/integrations/tools/mcp.mdx +267 -0
  106. package/.docs/raw/docs/primitives/action-bar.mdx +1 -0
  107. package/.docs/raw/docs/primitives/assistant-modal.mdx +1 -0
  108. package/.docs/raw/docs/primitives/attachment.mdx +1 -0
  109. package/.docs/raw/docs/primitives/branch-picker.mdx +1 -0
  110. package/.docs/raw/docs/primitives/chain-of-thought.mdx +90 -85
  111. package/.docs/raw/docs/primitives/composer.mdx +96 -63
  112. package/.docs/raw/docs/primitives/error.mdx +1 -0
  113. package/.docs/raw/docs/primitives/index.mdx +2 -1
  114. package/.docs/raw/docs/primitives/message.mdx +68 -5
  115. package/.docs/raw/docs/primitives/selection-toolbar.mdx +1 -0
  116. package/.docs/raw/docs/primitives/suggestion.mdx +1 -0
  117. package/.docs/raw/docs/primitives/thread-list.mdx +39 -0
  118. package/.docs/raw/docs/primitives/thread.mdx +16 -13
  119. package/.docs/raw/docs/react-native/index.mdx +1 -3
  120. package/.docs/raw/docs/react-native/migration.mdx +1 -3
  121. package/.docs/raw/docs/runtimes/a2a/client-and-hooks.mdx +396 -0
  122. package/.docs/raw/docs/runtimes/a2a/overview.mdx +60 -0
  123. package/.docs/raw/docs/runtimes/a2a/quickstart.mdx +216 -0
  124. package/.docs/raw/docs/runtimes/ag-ui/overview.mdx +70 -0
  125. package/.docs/raw/docs/runtimes/ag-ui/quickstart.mdx +243 -0
  126. package/.docs/raw/docs/runtimes/ag-ui/runtime-options.mdx +123 -0
  127. package/.docs/raw/docs/runtimes/ai-sdk/overview.mdx +52 -0
  128. package/.docs/raw/docs/runtimes/ai-sdk/v4-legacy.mdx +71 -131
  129. package/.docs/raw/docs/runtimes/ai-sdk/v5-legacy.mdx +69 -63
  130. package/.docs/raw/docs/runtimes/ai-sdk/v6.mdx +365 -101
  131. package/.docs/raw/docs/runtimes/concepts/adapters.mdx +265 -0
  132. package/.docs/raw/docs/runtimes/concepts/architecture.mdx +125 -0
  133. package/.docs/raw/docs/runtimes/concepts/stability.mdx +67 -0
  134. package/.docs/raw/docs/runtimes/concepts/threads.mdx +428 -0
  135. package/.docs/raw/docs/runtimes/custom/assistant-transport.mdx +703 -0
  136. package/.docs/raw/docs/runtimes/custom/data-stream.mdx +323 -0
  137. package/.docs/raw/docs/runtimes/custom/external-store.mdx +253 -1236
  138. package/.docs/raw/docs/runtimes/custom/local-runtime.mdx +746 -0
  139. package/.docs/raw/docs/runtimes/custom/overview.mdx +71 -0
  140. package/.docs/raw/docs/runtimes/google-adk/api.mdx +256 -0
  141. package/.docs/raw/docs/runtimes/google-adk/hooks.mdx +717 -0
  142. package/.docs/raw/docs/runtimes/google-adk/overview.mdx +69 -0
  143. package/.docs/raw/docs/runtimes/google-adk/quickstart.mdx +229 -0
  144. package/.docs/raw/docs/runtimes/langchain.mdx +533 -0
  145. package/.docs/raw/docs/runtimes/langgraph/generative-ui.mdx +305 -0
  146. package/.docs/raw/docs/runtimes/langgraph/interrupts.mdx +104 -0
  147. package/.docs/raw/docs/runtimes/langgraph/overview.mdx +84 -0
  148. package/.docs/raw/docs/runtimes/langgraph/quickstart.mdx +496 -0
  149. package/.docs/raw/docs/runtimes/langgraph/streaming.mdx +127 -0
  150. package/.docs/raw/docs/runtimes/langgraph/threads.mdx +113 -0
  151. package/.docs/raw/docs/runtimes/langgraph/tutorial/introduction.mdx +3 -3
  152. package/.docs/raw/docs/runtimes/langgraph/tutorial/part-1.mdx +0 -23
  153. package/.docs/raw/docs/runtimes/langgraph/tutorial/part-2.mdx +1 -1
  154. package/.docs/raw/docs/runtimes/opencode/hooks.mdx +191 -0
  155. package/.docs/raw/docs/runtimes/opencode/overview.mdx +48 -0
  156. package/.docs/raw/docs/runtimes/opencode/quickstart.mdx +119 -0
  157. package/.docs/raw/docs/runtimes/pick-a-runtime.mdx +74 -198
  158. package/.docs/raw/docs/ui/accordion.mdx +1 -0
  159. package/.docs/raw/docs/ui/assistant-modal.mdx +1 -0
  160. package/.docs/raw/docs/ui/assistant-sidebar.mdx +1 -0
  161. package/.docs/raw/docs/ui/attachment.mdx +1 -0
  162. package/.docs/raw/docs/ui/badge.mdx +1 -0
  163. package/.docs/raw/docs/ui/composer-trigger-popover.mdx +200 -0
  164. package/.docs/raw/docs/ui/context-display.mdx +1 -0
  165. package/.docs/raw/docs/ui/diff-viewer.mdx +1 -0
  166. package/.docs/raw/docs/ui/directive-text.mdx +114 -0
  167. package/.docs/raw/docs/ui/file.mdx +1 -0
  168. package/.docs/raw/docs/ui/image.mdx +1 -0
  169. package/.docs/raw/docs/ui/markdown.mdx +2 -14
  170. package/.docs/raw/docs/ui/mermaid.mdx +1 -0
  171. package/.docs/raw/docs/ui/message-timing.mdx +3 -2
  172. package/.docs/raw/docs/ui/model-selector.mdx +1 -0
  173. package/.docs/raw/docs/ui/part-grouping.mdx +325 -313
  174. package/.docs/raw/docs/ui/quote.mdx +1 -0
  175. package/.docs/raw/docs/ui/reasoning.mdx +69 -32
  176. package/.docs/raw/docs/ui/scrollbar.mdx +1 -0
  177. package/.docs/raw/docs/ui/select.mdx +1 -0
  178. package/.docs/raw/docs/ui/sources.mdx +1 -0
  179. package/.docs/raw/docs/ui/streamdown.mdx +1 -0
  180. package/.docs/raw/docs/ui/syntax-highlighting.mdx +1 -0
  181. package/.docs/raw/docs/ui/tabs.mdx +1 -0
  182. package/.docs/raw/docs/ui/thread-list.mdx +17 -0
  183. package/.docs/raw/docs/ui/thread.mdx +56 -1
  184. package/.docs/raw/docs/ui/tool-fallback.mdx +1 -0
  185. package/.docs/raw/docs/ui/tool-group.mdx +39 -11
  186. package/.docs/raw/docs/ui/voice.mdx +1 -0
  187. package/.docs/raw/docs/utilities/heat-graph.mdx +1 -0
  188. package/.docs/raw/docs/utilities/react-o11y.mdx +278 -0
  189. package/.docs/raw/docs/utilities/tw-shimmer.mdx +1 -0
  190. package/dist/utils/logger.js +1 -1
  191. package/dist/utils/logger.js.map +1 -1
  192. package/package.json +4 -4
  193. package/src/tools/tests/path-traversal.test.ts +1 -1
  194. package/src/utils/logger.ts +1 -1
  195. package/.docs/raw/docs/(docs)/guides/branching.mdx +0 -65
  196. package/.docs/raw/docs/(docs)/guides/chain-of-thought.mdx +0 -164
  197. package/.docs/raw/docs/(docs)/guides/editing.mdx +0 -66
  198. package/.docs/raw/docs/(docs)/guides/mentions.mdx +0 -406
  199. package/.docs/raw/docs/(docs)/guides/slash-commands.mdx +0 -275
  200. package/.docs/raw/docs/(docs)/guides/speech.mdx +0 -38
  201. package/.docs/raw/docs/runtimes/a2a/index.mdx +0 -298
  202. package/.docs/raw/docs/runtimes/assistant-transport.mdx +0 -1033
  203. package/.docs/raw/docs/runtimes/custom/custom-thread-list.mdx +0 -268
  204. package/.docs/raw/docs/runtimes/custom/local.mdx +0 -1464
  205. package/.docs/raw/docs/runtimes/data-stream.mdx +0 -422
  206. package/.docs/raw/docs/runtimes/google-adk/index.mdx +0 -686
  207. package/.docs/raw/docs/runtimes/helicone.mdx +0 -61
  208. package/.docs/raw/docs/runtimes/langgraph/index.mdx +0 -607
  209. package/.docs/raw/docs/runtimes/langgraph/tutorial/index.mdx +0 -12
  210. package/.docs/raw/docs/runtimes/langserve.mdx +0 -116
  211. package/.docs/raw/docs/runtimes/mastra/full-stack-integration.mdx +0 -218
  212. package/.docs/raw/docs/runtimes/mastra/overview.mdx +0 -18
  213. package/.docs/raw/docs/runtimes/mastra/separate-server-integration.mdx +0 -217
  214. package/.docs/raw/docs/ui/mention.mdx +0 -168
@@ -0,0 +1,30 @@
1
+ ---
2
+ title: Utility Hooks
3
+ description: Focused helpers for message parts, quotes, timing, and viewport behavior.
4
+ ---
5
+
6
+ Utility hooks expose commonly needed slices of assistant-ui behavior without requiring a full primitive.
7
+
8
+ ## Message Helpers
9
+
10
+ - `useMessageQuote` reads the quote state for the current message.
11
+ - `useMessageTiming` reads timing metadata for the current message.
12
+
13
+ ## Message Part Helpers
14
+
15
+ - `useMessagePartText`
16
+ - `useMessagePartReasoning`
17
+ - `useMessagePartSource`
18
+ - `useMessagePartFile`
19
+ - `useMessagePartImage`
20
+ - `useMessagePartData`
21
+
22
+ These hooks are intended for custom message part renderers. They read the nearest message part context established by `MessagePrimitive.Parts`, `MessagePartPrimitive`, or the lower-level providers.
23
+
24
+ ## Viewport Helpers
25
+
26
+ - `useThreadViewport` reads and controls the thread viewport.
27
+ - `useThreadViewportAutoScroll` wires auto-scroll behavior for custom viewport compositions.
28
+ - `useScrollLock` helps reasoning and grouped-part UIs preserve scroll behavior while content changes.
29
+
30
+ For primitive-specific prop APIs, see [Primitives](/docs/api-reference/primitives).
@@ -0,0 +1,23 @@
1
+ ---
2
+ title: Overview
3
+ description: Package-level API reference for assistant-ui React integrations.
4
+ ---
5
+
6
+ {/* AUTO-GENERATED by scripts/generate-api-reference-overviews.mts */}
7
+ {/* Do not edit manually. */}
8
+
9
+ Integration packages adapt assistant-ui to framework libraries and adjacent React ecosystems. Use these pages when you need package-specific hook names, options, and helper exports.
10
+
11
+ ## Pages
12
+
13
+ <Cards>
14
+ <Card title={"@assistant-ui/react-ai-sdk"} href={"/docs/api-reference/integrations/vercel-ai-sdk"}>
15
+ {"Vercel AI SDK integration with chat runtime hooks and transport utilities."}
16
+ </Card>
17
+ <Card title={"@assistant-ui/react-data-stream"} href={"/docs/api-reference/integrations/react-data-stream"}>
18
+ {"Hooks for connecting to data stream protocol endpoints and Assistant Cloud."}
19
+ </Card>
20
+ <Card title={"@assistant-ui/react-hook-form"} href={"/docs/api-reference/integrations/react-hook-form"}>
21
+ {"React Hook Form integration for AI-assisted form filling."}
22
+ </Card>
23
+ </Cards>
@@ -16,6 +16,27 @@ export const contextColors = {
16
16
  "ThreadListItem Context": "#c678dd",
17
17
  };
18
18
 
19
+ ## Start Here
20
+
21
+ The React API reference is organized by how you build with assistant-ui:
22
+
23
+ <Cards>
24
+ <Card title="Primitives" href="/docs/api-reference/primitives">
25
+ Composable React components such as `ThreadPrimitive`, `MessagePrimitive`, and `ComposerPrimitive`. These pages are generated from the package source where possible.
26
+ </Card>
27
+ <Card title="Hooks" href="/docs/api-reference/hooks">
28
+ Reactive state hooks, runtime hooks, model context hooks, and utility hooks.
29
+ </Card>
30
+ <Card title="Adapters" href="/docs/api-reference/adapters">
31
+ Runtime extension points for attachments, persistence, feedback, speech, dictation, and suggestions.
32
+ </Card>
33
+ <Card title="Runtime State" href="/docs/api-reference/runtimes/assistant-runtime">
34
+ Runtime action and state shapes used by `useAui` and `useAuiState`.
35
+ </Card>
36
+ </Cards>
37
+
38
+ The lower sections on this page show how the contexts nest and where each primitive, hook, and runtime object is available.
39
+
19
40
  ## Cloud
20
41
 
21
42
  - [`AssistantCloud`](#assistant-cloud)
@@ -111,6 +111,13 @@ The condition function receives an `AssistantState` object with the following pr
111
111
  <Disclaimer />
112
112
  </AuiIf>
113
113
 
114
+ // Render content only after the assistant finishes streaming
115
+ <AuiIf condition={(s) =>
116
+ s.message.role === "assistant" && s.message.status?.type === "complete"
117
+ }>
118
+ <FollowUpCard />
119
+ </AuiIf>
120
+
114
121
  // Toggle copy icon based on copied state
115
122
  <ActionBarPrimitive.Copy>
116
123
  <AuiIf condition={(s) => !s.message.isCopied}>
@@ -416,76 +416,124 @@ import { AuiIf } from "@assistant-ui/react";
416
416
  </AuiIf>
417
417
  ```
418
418
 
419
- ## Mention Primitives (Unstable)
419
+ ## Trigger Popover Primitives (Unstable)
420
420
 
421
421
  <Callout type="warn">
422
422
  These primitives are under the `Unstable_` prefix and may change without notice.
423
423
  </Callout>
424
424
 
425
- Primitives for an @-mention picker in the composer. See the [Mention component guide](/docs/ui/mention) for a pre-built implementation.
425
+ Unified primitives for any character-triggered popover (`@` mentions, `/` slash commands, `:` emoji, etc.). Multiple triggers coexist under a single `TriggerPopoverRoot`. See the [Mentions guide](/docs/guides/mentions) and [Slash Commands guide](/docs/guides/slash-commands) for full documentation and the [ComposerTriggerPopover component](/docs/ui/composer-trigger-popover) for a pre-built implementation.
426
426
 
427
427
  ### Anatomy
428
428
 
429
429
  ```tsx
430
430
  import { ComposerPrimitive } from "@assistant-ui/react";
431
+ import { unstable_defaultDirectiveFormatter } from "@assistant-ui/core";
431
432
 
432
433
  const Composer = () => (
433
- <ComposerPrimitive.Unstable_MentionRoot adapter={mentionAdapter}>
434
+ <ComposerPrimitive.Unstable_TriggerPopoverRoot>
434
435
  <ComposerPrimitive.Root>
435
436
  <ComposerPrimitive.Input />
436
- <ComposerPrimitive.Unstable_MentionPopover>
437
- <ComposerPrimitive.Unstable_MentionCategories>
437
+
438
+ <ComposerPrimitive.Unstable_TriggerPopover
439
+ char="@"
440
+ adapter={mention.adapter}
441
+ >
442
+ <ComposerPrimitive.Unstable_TriggerPopover.Directive
443
+ {...mention.directive}
444
+ />
445
+ <ComposerPrimitive.Unstable_TriggerPopoverCategories>
438
446
  {(categories) =>
439
447
  categories.map((cat) => (
440
- <ComposerPrimitive.Unstable_MentionCategoryItem
448
+ <ComposerPrimitive.Unstable_TriggerPopoverCategoryItem
441
449
  key={cat.id}
442
450
  categoryId={cat.id}
443
451
  >
444
452
  {cat.label}
445
- </ComposerPrimitive.Unstable_MentionCategoryItem>
453
+ </ComposerPrimitive.Unstable_TriggerPopoverCategoryItem>
446
454
  ))
447
455
  }
448
- </ComposerPrimitive.Unstable_MentionCategories>
449
- <ComposerPrimitive.Unstable_MentionItems>
456
+ </ComposerPrimitive.Unstable_TriggerPopoverCategories>
457
+ <ComposerPrimitive.Unstable_TriggerPopoverItems>
450
458
  {(items) =>
451
459
  items.map((item) => (
452
- <ComposerPrimitive.Unstable_MentionItem
460
+ <ComposerPrimitive.Unstable_TriggerPopoverItem
453
461
  key={item.id}
454
462
  item={item}
455
463
  >
456
464
  {item.label}
457
- </ComposerPrimitive.Unstable_MentionItem>
465
+ </ComposerPrimitive.Unstable_TriggerPopoverItem>
458
466
  ))
459
467
  }
460
- </ComposerPrimitive.Unstable_MentionItems>
461
- <ComposerPrimitive.Unstable_MentionBack>
468
+ </ComposerPrimitive.Unstable_TriggerPopoverItems>
469
+ <ComposerPrimitive.Unstable_TriggerPopoverBack>
462
470
  Back
463
- </ComposerPrimitive.Unstable_MentionBack>
464
- </ComposerPrimitive.Unstable_MentionPopover>
471
+ </ComposerPrimitive.Unstable_TriggerPopoverBack>
472
+ </ComposerPrimitive.Unstable_TriggerPopover>
465
473
  </ComposerPrimitive.Root>
466
- </ComposerPrimitive.Unstable_MentionRoot>
474
+ </ComposerPrimitive.Unstable_TriggerPopoverRoot>
467
475
  );
468
476
  ```
469
477
 
470
- ### Unstable_MentionRoot
478
+ ### Unstable_TriggerPopoverRoot
479
+
480
+ Root provider that groups one or more `TriggerPopover` declarations. Owns the shared `ComposerInputPluginRegistry` that routes cursor and keyboard events to each registered trigger.
481
+
482
+ No props.
483
+
484
+ ### Unstable_TriggerPopover
485
+
486
+ Declares a trigger and renders its popover container. Only renders its DOM (and children) while this trigger is active in the composer input. Each declaration has an isolated scope — sub-primitives placed inside read state from this declaration only.
487
+
488
+ | Prop | Type | Default | Description |
489
+ | --- | --- | --- | --- |
490
+ | `char` | `string` | — | Character(s) that activate the trigger (e.g. `"@"`, `"/"`) — unique within the root |
491
+ | `adapter` | `Unstable_TriggerAdapter` | — | Provides categories, items, and search |
492
+
493
+ Selection behavior is declared by rendering **exactly one** behavior sub-primitive inside the `TriggerPopover`:
494
+
495
+ - [`Unstable_TriggerPopover.Directive`](#unstable_triggerpopoverdirective) — inserts `:type[label]{name=id}` into the composer on selection (mention behavior).
496
+ - [`Unstable_TriggerPopover.Action`](#unstable_triggerpopoveraction) — fires `onExecute` on selection; leaves a directive chip as an audit trail by default.
497
+
498
+ Renders a `<div>` with `role="listbox"` when open.
499
+
500
+ ### Unstable_TriggerPopover.Directive
501
+
502
+ Behavior sub-primitive. Placed inside a `<Unstable_TriggerPopover>`. Renders nothing — registers an `"directive"` behavior with its parent. Exactly one behavior sub-primitive is allowed per `TriggerPopover`.
503
+
504
+ | Prop | Type | Default | Description |
505
+ | --- | --- | --- | --- |
506
+ | `formatter` | `Unstable_DirectiveFormatter` | `unstable_defaultDirectiveFormatter` | Serializes the selected item into composer text (and parses it back). |
507
+ | `onInserted` | `(item) => void` | — | Fires after the directive text has been inserted. |
508
+
509
+ ### Unstable_TriggerPopover.Action
471
510
 
472
- Provider that wraps the composer with mention trigger detection, keyboard navigation, and popover state.
511
+ Behavior sub-primitive. Placed inside a `<Unstable_TriggerPopover>`. Renders nothing — registers an `"action"` behavior with its parent. Exactly one behavior sub-primitive is allowed per `TriggerPopover`.
473
512
 
474
513
  | Prop | Type | Default | Description |
475
514
  | --- | --- | --- | --- |
476
- | `adapter` | `Unstable_MentionAdapter` | — | Provides categories, items, and search |
477
- | `trigger` | `string` | `"@"` | Character(s) that activate the popover |
478
- | `formatter` | `Unstable_DirectiveFormatter` | Default | Serializer/parser for mention directives |
515
+ | `formatter` | `Unstable_DirectiveFormatter` | `unstable_defaultDirectiveFormatter` | Serializes the audit-trail chip (unused when `removeOnExecute` is true). |
516
+ | `onExecute` | `(item) => void` | — | Called the moment an item is selected — typically routes to a handler map. Required. |
517
+ | `removeOnExecute` | `boolean` | `false` | When `true`, strips the trigger text from the composer instead of leaving a chip. |
479
518
 
480
- ### Unstable_MentionPopover
519
+ ### Unstable_TriggerBehavior
481
520
 
482
- Container that only renders when a mention trigger is active. Renders a `<div>` with `role="listbox"`.
521
+ Union type returned by the two behavior sub-primitives and consumed internally by the popover resources. Exported for advanced use cases (e.g. custom sub-primitives).
483
522
 
484
- ### Unstable_MentionCategories
523
+ ```ts
524
+ import type { Unstable_TriggerBehavior } from "@assistant-ui/react";
525
+
526
+ // Equivalent shape:
527
+ // Unstable_TriggerBehavior =
528
+ // | { kind: "directive"; formatter: Unstable_DirectiveFormatter; onInserted?: (item) => void }
529
+ // | { kind: "action"; formatter: Unstable_DirectiveFormatter; onExecute: (item) => void; removeOnExecute?: boolean }
530
+ ```
531
+
532
+ ### Unstable_TriggerPopoverCategories
485
533
 
486
534
  Renders the top-level category list. Accepts a render function `(categories) => ReactNode`. Hidden when a category is selected or when in search mode.
487
535
 
488
- ### Unstable_MentionCategoryItem
536
+ ### Unstable_TriggerPopoverCategoryItem
489
537
 
490
538
  A button that drills into a category. Renders `role="option"` with automatic `data-highlighted` and `aria-selected` when keyboard-navigated.
491
539
 
@@ -493,25 +541,26 @@ A button that drills into a category. Renders `role="option"` with automatic `da
493
541
  | --- | --- | --- |
494
542
  | `categoryId` | `string` | The category to select on click |
495
543
 
496
- ### Unstable_MentionItems
544
+ ### Unstable_TriggerPopoverItems
497
545
 
498
546
  Renders the item list for the active category or search results. Accepts a render function `(items) => ReactNode`. Hidden when no category is selected and not in search mode.
499
547
 
500
- ### Unstable_MentionItem
548
+ ### Unstable_TriggerPopoverItem
501
549
 
502
- A button that inserts a mention into the composer. Renders `role="option"` with automatic `data-highlighted` and `aria-selected` when keyboard-navigated.
550
+ A button that selects an item. Renders `role="option"` with automatic `data-highlighted` and `aria-selected` when keyboard-navigated.
503
551
 
504
552
  | Prop | Type | Description |
505
553
  | --- | --- | --- |
506
- | `item` | `Unstable_MentionItem` | The item to insert on click |
554
+ | `item` | `Unstable_TriggerItem` | The item to select on click |
555
+ | `index` | `number` | Optional index override for highlight matching |
507
556
 
508
- ### Unstable_MentionBack
557
+ ### Unstable_TriggerPopoverBack
509
558
 
510
559
  A button that navigates back from items to the category list. Only renders when a category is active.
511
560
 
512
- ### unstable_useMentionContext
561
+ ### unstable_useTriggerPopoverScopeContext
513
562
 
514
- Hook to access the mention popover state and actions from within `Unstable_MentionRoot`.
563
+ Hook to access the popover state and actions for the nearest enclosing `Unstable_TriggerPopover`.
515
564
 
516
565
  ```tsx
517
566
  const {
@@ -527,19 +576,79 @@ const {
527
576
  goBack,
528
577
  close,
529
578
  handleKeyDown,
530
- formatter,
531
- } = unstable_useMentionContext();
579
+ } = unstable_useTriggerPopoverScopeContext();
532
580
  ```
533
581
 
534
- ### unstable_useToolMentionAdapter
582
+ ### unstable_useTriggerPopoverTriggers
583
+
584
+ Hook to iterate every trigger registered under the current `Unstable_TriggerPopoverRoot`. Intended for input-level integrations (e.g. Lexical `DirectivePlugin`). Returns `ReadonlyMap<string, Unstable_RegisteredTrigger>`.
585
+
586
+ ### unstable_useMentionAdapter
535
587
 
536
- Hook that creates a `Unstable_MentionAdapter` from registered tools (via `useAssistantTool`).
588
+ Returns a spreadable `{ adapter, directive }` bundle for `@` mentions. Reads tools registered via `useAssistantTool`, accepts explicit `items`, and supports multi-category drill-down.
537
589
 
538
590
  ```tsx
539
- import { unstable_useToolMentionAdapter } from "@assistant-ui/react";
591
+ import {
592
+ unstable_useMentionAdapter,
593
+ type Unstable_Mention,
594
+ } from "@assistant-ui/react";
595
+
596
+ function MyComposer() {
597
+ // Default: tools from model context as a single "Tools" category
598
+ const mention = unstable_useMentionAdapter();
599
+
600
+ return (
601
+ <ComposerTriggerPopover char="@" {...mention} />
602
+ );
603
+ }
604
+ ```
540
605
 
541
- const adapter = unstable_useToolMentionAdapter({
542
- formatLabel: (name) => name.replaceAll("_", " "),
543
- categoryLabel: "Tools",
606
+ ```tsx
607
+ // Multi-category + tools appended as their own category
608
+ const mention = unstable_useMentionAdapter({
609
+ categories: [
610
+ { id: "users", label: "Users", items: [/* ... */] },
611
+ { id: "files", label: "Files", items: [/* ... */] },
612
+ ],
613
+ includeModelContextTools: true,
544
614
  });
545
615
  ```
616
+
617
+ Options:
618
+
619
+ | Option | Type | Description |
620
+ | --- | --- | --- |
621
+ | `items` | `Unstable_Mention[]` | Flat list; ignored when `categories` is set. |
622
+ | `categories` | `{ id, label, items: Unstable_Mention[] }[]` | Drill-down groups. |
623
+ | `includeModelContextTools` | `boolean \| { category?, formatLabel?, icon? }` | Tools integration. Defaults to `true` iff neither `items` nor `categories`. |
624
+ | `formatter` | `Unstable_DirectiveFormatter` | Override directive serialization. |
625
+ | `onInserted` | `(item) => void` | Fires after the directive is inserted. |
626
+ | `iconMap` | `Record<string, Unstable_IconComponent>` | `metadata.icon` / category id → React component. |
627
+ | `fallbackIcon` | `Unstable_IconComponent` | Fallback when no `iconMap` entry matches. |
628
+
629
+ Returns `{ adapter, directive, iconMap?, fallbackIcon? }`.
630
+
631
+ ### unstable_useSlashCommandAdapter
632
+
633
+ Returns a spreadable `{ adapter, action }` bundle for slash commands. Commands are declared as data + inline `execute` callbacks; `execute` lives in the hook closure and is never attached to the returned `Unstable_TriggerItem`, keeping items JSON-serializable.
634
+
635
+ ```tsx
636
+ import {
637
+ unstable_useSlashCommandAdapter,
638
+ type Unstable_SlashCommand,
639
+ } from "@assistant-ui/react";
640
+
641
+ const SLASH_COMMANDS: readonly Unstable_SlashCommand[] = [
642
+ { id: "summarize", execute: () => runSummarize(), icon: "FileText" },
643
+ { id: "translate", execute: () => runTranslate(), icon: "Languages" },
644
+ ];
645
+
646
+ function MyComposer() {
647
+ const slash = unstable_useSlashCommandAdapter({ commands: SLASH_COMMANDS });
648
+ return (
649
+ <ComposerTriggerPopover char="/" {...slash} />
650
+ );
651
+ }
652
+ ```
653
+
654
+ Pass `removeOnExecute: true` on the hook options to strip the trigger text from the composer after executing. The hook also accepts `iconMap` / `fallbackIcon` options that flow into the returned bundle — `{...slash}` spreads them into `ComposerTriggerPopover`.
@@ -0,0 +1,65 @@
1
+ ---
2
+ title: Overview
3
+ description: Generated API reference for assistant-ui React primitive namespaces and parts.
4
+ ---
5
+
6
+ {/* AUTO-GENERATED by scripts/generate-api-reference-overviews.mts */}
7
+ {/* Do not edit manually. */}
8
+
9
+ Primitives are the composable React components exported from `@assistant-ui/react`. These pages focus on parts, props, rendered elements, and composition behavior.
10
+
11
+ ## Pages
12
+
13
+ <Cards>
14
+ <Card title={"ActionBarPrimitive"} href={"/docs/api-reference/primitives/action-bar"}>
15
+ {"Buttons for message actions like copy, edit, reload, speak, and feedback."}
16
+ </Card>
17
+ <Card title={"ActionBarMorePrimitive"} href={"/docs/api-reference/primitives/action-bar-more"}>
18
+ {"API reference for ActionBarMorePrimitive."}
19
+ </Card>
20
+ <Card title={"AuiIf"} href={"/docs/api-reference/primitives/assistant-if"}>
21
+ {"Conditional rendering component based on thread, message, or composer state."}
22
+ </Card>
23
+ <Card title={"AssistantModalPrimitive"} href={"/docs/api-reference/primitives/assistant-modal"}>
24
+ {"A popover chat interface for floating assistant UI in the corner of the screen."}
25
+ </Card>
26
+ <Card title={"AttachmentPrimitive"} href={"/docs/api-reference/primitives/attachment"}>
27
+ {"Components for displaying and managing file attachments in messages and composer."}
28
+ </Card>
29
+ <Card title={"BranchPickerPrimitive"} href={"/docs/api-reference/primitives/branch-picker"}>
30
+ {"Navigate between conversation branches with previous/next controls."}
31
+ </Card>
32
+ <Card title={"ComposerPrimitive"} href={"/docs/api-reference/primitives/composer"}>
33
+ {"Primitives for the text input, send button, and attachments."}
34
+ </Card>
35
+ <Card title={"ErrorPrimitive"} href={"/docs/api-reference/primitives/error"}>
36
+ {"Components for displaying error messages in the chat interface."}
37
+ </Card>
38
+ <Card title={"MessagePrimitive"} href={"/docs/api-reference/primitives/message"}>
39
+ {"Components for rendering message content, parts, and attachments."}
40
+ </Card>
41
+ <Card title={"MessagePartPrimitive"} href={"/docs/api-reference/primitives/message-part"}>
42
+ {"Primitives for text, images, tool calls, and other message content."}
43
+ </Card>
44
+ <Card title={"SelectionToolbarPrimitive"} href={"/docs/api-reference/primitives/selection-toolbar"}>
45
+ {"A floating toolbar that appears when text is selected within a message."}
46
+ </Card>
47
+ <Card title={"SuggestionPrimitive"} href={"/docs/api-reference/primitives/suggestion"}>
48
+ {"API reference for SuggestionPrimitive."}
49
+ </Card>
50
+ <Card title={"ThreadPrimitive"} href={"/docs/api-reference/primitives/thread"}>
51
+ {"Primitives for the message list, viewport, and welcome screen."}
52
+ </Card>
53
+ <Card title={"ThreadListPrimitive"} href={"/docs/api-reference/primitives/thread-list"}>
54
+ {"Display and manage multiple conversation threads with create and archive actions."}
55
+ </Card>
56
+ <Card title={"ThreadListItemPrimitive"} href={"/docs/api-reference/primitives/thread-list-item"}>
57
+ {"Individual thread item with title, archive, and delete controls."}
58
+ </Card>
59
+ <Card title={"ThreadListItemMorePrimitive"} href={"/docs/api-reference/primitives/thread-list-item-more"}>
60
+ {"Dropdown menu for additional thread actions like archive and delete."}
61
+ </Card>
62
+ <Card title={"Composition"} href={"/docs/api-reference/primitives/composition"}>
63
+ {"How to compose primitives with custom components using asChild."}
64
+ </Card>
65
+ </Cards>
@@ -187,6 +187,8 @@ function MyComponent() {
187
187
 
188
188
  Each data component receives the full data part as props: `{ type: "data", name: string, data: T, status: MessagePartStatus }`.
189
189
 
190
+ For a catch-all renderer (e.g. LangSmith's [`LoadExternalComponent`](/docs/runtimes/langgraph#dynamic-loading-with-fallback) loaded at runtime), pass `Fallback` via the inline `data` config on `MessagePrimitive.Parts`, or use the LangGraph adapter's [`uiComponents.fallback`](/docs/runtimes/langgraph#dynamic-loading-with-fallback) option.
191
+
190
192
  ### Messages (Sub-Agent)
191
193
 
192
194
  Renders nested messages from a tool call part's `messages` field. This is used in multi-agent setups where a sub-agent's conversation is embedded inside a tool call.
@@ -3,6 +3,8 @@ title: MessagePrimitive
3
3
  description: Components for rendering message content, parts, and attachments.
4
4
  ---
5
5
 
6
+ import { MessagePrimitive as MessagePrimitiveDocs } from "@/generated/primitiveDocs";
7
+
6
8
  A single message in a conversation. Messages may consist of multiple parts.
7
9
 
8
10
 
@@ -95,13 +97,13 @@ The content of the message. This renders a separate component for each message p
95
97
  name: "Reasoning",
96
98
  type: "ReasoningMessagePartComponent",
97
99
  description:
98
- "The component to render for each reasoning message part. Cannot be used alongside ChainOfThought.",
100
+ "Deprecated components-map renderer for each reasoning message part. Prefer the children render function or MessagePrimitive.GroupedParts.",
99
101
  },
100
102
  {
101
103
  name: "tools",
102
104
  type: "object",
103
105
  description:
104
- "Configuration for tool call rendering. Cannot be used alongside ChainOfThought.",
106
+ "Deprecated components-map configuration for tool call rendering. Prefer part.toolUI in the children render function or MessagePrimitive.GroupedParts.",
105
107
  children: [
106
108
  {
107
109
  parameters: [
@@ -155,7 +157,7 @@ The content of the message. This renders a separate component for each message p
155
157
  name: "ToolGroup",
156
158
  type: "ComponentType<PropsWithChildren<{ startIndex: number; endIndex: number }>>",
157
159
  description:
158
- "Deprecated: This feature is still experimental and subject to change. Component for rendering grouped consecutive tool calls. When provided, consecutive tool-call message parts will be automatically grouped and wrapped with this component. Cannot be used alongside ChainOfThought.",
160
+ "Deprecated legacy wrapper for grouped consecutive tool calls. Prefer MessagePrimitive.GroupedParts with groupBy returning \"group-tool\".",
159
161
  children: [
160
162
  {
161
163
  type: "ToolGroupProps",
@@ -187,7 +189,7 @@ The content of the message. This renders a separate component for each message p
187
189
  name: "ReasoningGroup",
188
190
  type: "ReasoningGroupComponent",
189
191
  description:
190
- "Component for rendering grouped consecutive reasoning parts. Cannot be used alongside ChainOfThought.",
192
+ "Deprecated legacy wrapper for grouped consecutive reasoning parts. Prefer MessagePrimitive.GroupedParts with groupBy returning \"group-reasoning\".",
191
193
  children: [
192
194
  {
193
195
  type: "ReasoningGroupProps",
@@ -219,7 +221,7 @@ The content of the message. This renders a separate component for each message p
219
221
  name: "ChainOfThought",
220
222
  type: "ComponentType",
221
223
  description:
222
- "When set, groups all consecutive reasoning and tool-call parts into a single collapsible component. Mutually exclusive with Reasoning, tools, ToolGroup, and ReasoningGroup.",
224
+ "Deprecated legacy grouping path. Prefer MessagePrimitive.GroupedParts for grouped reasoning and tool calls.",
223
225
  },
224
226
  {
225
227
  name: "Empty",
@@ -400,9 +402,51 @@ type QuoteInfo = {
400
402
  See the [Quoting guide](/docs/guides/quoting) for a complete walkthrough.
401
403
  </Callout>
402
404
 
405
+ ### GroupedParts
406
+
407
+ Renders adjacent message parts through a hierarchical grouping tree. Use this for grouped Chain of Thought, consecutive tool calls, or any other adjacent grouping where each part stays in chronological order.
408
+
409
+ ```tsx
410
+ <MessagePrimitive.GroupedParts
411
+ groupBy={(part) => {
412
+ if (part.type === "reasoning")
413
+ return ["group-chainOfThought", "group-reasoning"];
414
+ if (part.type === "tool-call")
415
+ return ["group-chainOfThought", "group-tool"];
416
+ return null;
417
+ }}
418
+ >
419
+ {({ part, children }) => {
420
+ switch (part.type) {
421
+ case "group-chainOfThought":
422
+ return <div>{children}</div>;
423
+ case "group-reasoning":
424
+ return <ReasoningRoot>{children}</ReasoningRoot>;
425
+ case "group-tool":
426
+ return <ToolGroupRoot>{children}</ToolGroupRoot>;
427
+ case "text":
428
+ return <MarkdownText />;
429
+ case "reasoning":
430
+ return <Reasoning {...part} />;
431
+ case "tool-call":
432
+ return part.toolUI ?? <ToolFallback {...part} />;
433
+ case "data":
434
+ return part.dataRendererUI;
435
+ default:
436
+ return null;
437
+ }
438
+ }}
439
+ </MessagePrimitive.GroupedParts>
440
+ ```
441
+
442
+ <ParametersTable
443
+ type="MessagePrimitiveGroupedPartsProps"
444
+ parameters={MessagePrimitiveDocs.GroupedParts.props}
445
+ />
446
+
403
447
  ### Unstable_PartsGrouped
404
448
 
405
- Renders the parts of a message grouped by a custom grouping function. Use this component when you need to visually group related message parts together — for example, grouping parts that share a common parent ID, or collecting consecutive tool calls under a single header.
449
+ Renders the parts of a message grouped by a custom grouping function. Use this unstable API only when you need non-adjacent clustering, such as collecting parts that share a common parent ID across different positions. For adjacent grouping, prefer `MessagePrimitive.GroupedParts`.
406
450
 
407
451
  The `groupingFunction` prop controls how parts are grouped. It receives the full array of message parts and must return an array of group descriptors, each with a `groupKey` (or `undefined` for ungrouped parts) and an array of `indices` into the message parts array. The optional `components.Group` component is then rendered once per group and receives the `groupKey`, `indices`, and the rendered part children.
408
452
 
@@ -124,3 +124,18 @@ Renders a single thread list item at the specified index.
124
124
  },
125
125
  ]}
126
126
  />
127
+
128
+ ### LoadMore
129
+
130
+ A button that calls `aui.threads().loadMore()` to append the next page. See the [LoadMore primitive reference](/docs/primitives/thread-list#loadmore) for usage and [Threads concepts](/docs/runtimes/concepts/threads#paginating-the-thread-list) for the adapter contract.
131
+
132
+ This primitive renders a `<button>` element unless `asChild` is set.
133
+
134
+ <ParametersTable
135
+ type="ThreadListPrimitiveLoadMoreProps"
136
+ parameters={[
137
+ {
138
+ name: "asChild",
139
+ },
140
+ ]}
141
+ />
@@ -67,6 +67,33 @@ This primitive renders a `<div>` element unless `asChild` is set.
67
67
  description:
68
68
  'Controls scroll anchoring behavior for new messages. "bottom" is the classic chat behavior where messages anchor at the bottom. "top" anchors new user messages at the top of the viewport for a focused reading experience.',
69
69
  },
70
+ {
71
+ name: "topAnchorMessageClamp",
72
+ type: '{ tallerThan?: string; visibleHeight?: string }',
73
+ default: '{ tallerThan: "10em", visibleHeight: "6em" }',
74
+ description:
75
+ 'Clamps tall user messages so the assistant response stays in view when turnAnchor is "top". Messages up to `tallerThan` stay fully visible; taller messages show only `visibleHeight` of their bottom edge above the assistant response.',
76
+ children: [
77
+ {
78
+ type: '{ tallerThan?: string; visibleHeight?: string }',
79
+ parameters: [
80
+ {
81
+ name: "tallerThan",
82
+ type: "string",
83
+ default: '"10em"',
84
+ description: "Clamp messages taller than this CSS length.",
85
+ },
86
+ {
87
+ name: "visibleHeight",
88
+ type: "string",
89
+ default: '"6em"',
90
+ description:
91
+ "Visible portion of a clamped message's bottom edge.",
92
+ },
93
+ ],
94
+ },
95
+ ],
96
+ },
70
97
  {
71
98
  name: "scrollToBottomOnRunStart",
72
99
  type: "boolean",
@@ -90,9 +117,17 @@ This primitive renders a `<div>` element unless `asChild` is set.
90
117
  ]}
91
118
  />
92
119
 
120
+ <Callout type="info">
121
+ `ThreadPrimitive.ViewportSlack` has been removed. When `turnAnchor="top"` is
122
+ set, `MessagePrimitive.Root` handles top-anchor registration automatically. If
123
+ you previously customized `fillClampThreshold` or `fillClampOffset` on
124
+ `ViewportSlack` or `MessagePrimitive.Root`, use `topAnchorMessageClamp`
125
+ instead.
126
+ </Callout>
127
+
93
128
  ### ViewportFooter
94
129
 
95
- A footer container placed inside `ThreadPrimitive.Viewport` that measures its own height (including top margin) and reports it to the viewport context. The viewport uses this measurement in scroll calculations — for example, as the minimum height for `ViewportSlack` — so that the scroll-to-bottom behaviour accounts for any sticky footer overlapping the message list.
130
+ A footer container placed inside `ThreadPrimitive.Viewport` that measures its own height (including top margin) and reports it to the viewport context. The viewport uses this measurement in scroll calculations so the scroll-to-bottom behaviour accounts for any sticky footer overlapping the message list.
96
131
 
97
132
  Multiple `ViewportFooter` components may be used; their heights are summed.
98
133