@assistant-ui/mcp-docs-server 0.2.2 → 0.3.0

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 (459) hide show
  1. package/README.md +16 -43
  2. package/dist/index.d.ts +2 -3
  3. package/dist/index.d.ts.map +1 -1
  4. package/dist/index.js +3 -91
  5. package/dist/index.js.map +1 -1
  6. package/dist/proxy.d.ts +9 -0
  7. package/dist/proxy.d.ts.map +1 -0
  8. package/dist/proxy.js +76 -0
  9. package/dist/proxy.js.map +1 -0
  10. package/package.json +9 -13
  11. package/src/index.ts +3 -115
  12. package/src/proxy.test.ts +250 -0
  13. package/src/proxy.ts +111 -0
  14. package/.docs/organized/code-examples/waterfall.md +0 -807
  15. package/.docs/organized/code-examples/with-a2a.md +0 -674
  16. package/.docs/organized/code-examples/with-ag-ui.md +0 -552
  17. package/.docs/organized/code-examples/with-ai-sdk-v7.md +0 -465
  18. package/.docs/organized/code-examples/with-artifacts.md +0 -814
  19. package/.docs/organized/code-examples/with-assistant-transport.md +0 -575
  20. package/.docs/organized/code-examples/with-browser-extension.md +0 -371
  21. package/.docs/organized/code-examples/with-chain-of-thought.md +0 -960
  22. package/.docs/organized/code-examples/with-cloud-standalone.md +0 -681
  23. package/.docs/organized/code-examples/with-cloud.md +0 -438
  24. package/.docs/organized/code-examples/with-custom-thread-list.md +0 -568
  25. package/.docs/organized/code-examples/with-elevenlabs-conversational.md +0 -526
  26. package/.docs/organized/code-examples/with-elevenlabs-scribe.md +0 -696
  27. package/.docs/organized/code-examples/with-eve.md +0 -404
  28. package/.docs/organized/code-examples/with-expo.md +0 -2063
  29. package/.docs/organized/code-examples/with-external-store.md +0 -420
  30. package/.docs/organized/code-examples/with-ffmpeg.md +0 -828
  31. package/.docs/organized/code-examples/with-generative-ui.md +0 -1812
  32. package/.docs/organized/code-examples/with-google-adk.md +0 -367
  33. package/.docs/organized/code-examples/with-heat-graph.md +0 -304
  34. package/.docs/organized/code-examples/with-image-generation.md +0 -462
  35. package/.docs/organized/code-examples/with-interactables.md +0 -732
  36. package/.docs/organized/code-examples/with-langchain.md +0 -445
  37. package/.docs/organized/code-examples/with-langgraph.md +0 -854
  38. package/.docs/organized/code-examples/with-livekit.md +0 -642
  39. package/.docs/organized/code-examples/with-mcp.md +0 -780
  40. package/.docs/organized/code-examples/with-nuxt.md +0 -2428
  41. package/.docs/organized/code-examples/with-opencode.md +0 -1974
  42. package/.docs/organized/code-examples/with-openui.md +0 -449
  43. package/.docs/organized/code-examples/with-pi.md +0 -2083
  44. package/.docs/organized/code-examples/with-react-hook-form.md +0 -724
  45. package/.docs/organized/code-examples/with-react-ink-web.md +0 -690
  46. package/.docs/organized/code-examples/with-react-ink.md +0 -472
  47. package/.docs/organized/code-examples/with-react-router.md +0 -935
  48. package/.docs/organized/code-examples/with-resumable-stream.md +0 -667
  49. package/.docs/organized/code-examples/with-store.md +0 -679
  50. package/.docs/organized/code-examples/with-svelte.md +0 -415
  51. package/.docs/organized/code-examples/with-sveltekit.md +0 -1061
  52. package/.docs/organized/code-examples/with-tanstack.md +0 -811
  53. package/.docs/organized/code-examples/with-tap-runtime.md +0 -812
  54. package/.docs/organized/code-examples/with-virtualized-thread.md +0 -680
  55. package/.docs/organized/code-examples/with-vue.md +0 -408
  56. package/.docs/raw/docs/(docs)/architecture.mdx +0 -146
  57. package/.docs/raw/docs/(docs)/base-ui.mdx +0 -39
  58. package/.docs/raw/docs/(docs)/cli.mdx +0 -542
  59. package/.docs/raw/docs/(docs)/devtools.mdx +0 -79
  60. package/.docs/raw/docs/(docs)/index.mdx +0 -21
  61. package/.docs/raw/docs/(docs)/installation.mdx +0 -483
  62. package/.docs/raw/docs/(docs)/llm.mdx +0 -211
  63. package/.docs/raw/docs/(docs)/rtl.mdx +0 -78
  64. package/.docs/raw/docs/(reference)/api-reference/adapters/attachments.mdx +0 -36
  65. package/.docs/raw/docs/(reference)/api-reference/adapters/feedback.mdx +0 -20
  66. package/.docs/raw/docs/(reference)/api-reference/adapters/index.mdx +0 -34
  67. package/.docs/raw/docs/(reference)/api-reference/adapters/model.mdx +0 -44
  68. package/.docs/raw/docs/(reference)/api-reference/adapters/persistence.mdx +0 -59
  69. package/.docs/raw/docs/(reference)/api-reference/adapters/runtime.mdx +0 -20
  70. package/.docs/raw/docs/(reference)/api-reference/adapters/suggestions.mdx +0 -20
  71. package/.docs/raw/docs/(reference)/api-reference/context-providers/assistant-runtime-provider.mdx +0 -84
  72. package/.docs/raw/docs/(reference)/api-reference/context-providers/index.mdx +0 -22
  73. package/.docs/raw/docs/(reference)/api-reference/context-providers/scoped-providers.mdx +0 -64
  74. package/.docs/raw/docs/(reference)/api-reference/external-store/index.mdx +0 -22
  75. package/.docs/raw/docs/(reference)/api-reference/external-store/message-conversion.mdx +0 -52
  76. package/.docs/raw/docs/(reference)/api-reference/external-store/runtime.mdx +0 -49
  77. package/.docs/raw/docs/(reference)/api-reference/generative-ui/a2ui.mdx +0 -40
  78. package/.docs/raw/docs/(reference)/api-reference/generative-ui/actions.mdx +0 -56
  79. package/.docs/raw/docs/(reference)/api-reference/generative-ui/components.mdx +0 -86
  80. package/.docs/raw/docs/(reference)/api-reference/generative-ui/index.mdx +0 -39
  81. package/.docs/raw/docs/(reference)/api-reference/generative-ui/json-generative-ui.mdx +0 -42
  82. package/.docs/raw/docs/(reference)/api-reference/generative-ui/rendering.mdx +0 -84
  83. package/.docs/raw/docs/(reference)/api-reference/generative-ui/slack.mdx +0 -85
  84. package/.docs/raw/docs/(reference)/api-reference/generative-ui/spec.mdx +0 -45
  85. package/.docs/raw/docs/(reference)/api-reference/generative-ui/teams.mdx +0 -93
  86. package/.docs/raw/docs/(reference)/api-reference/generative-ui/tokens.mdx +0 -62
  87. package/.docs/raw/docs/(reference)/api-reference/hooks/composer-triggers.mdx +0 -129
  88. package/.docs/raw/docs/(reference)/api-reference/hooks/index.mdx +0 -31
  89. package/.docs/raw/docs/(reference)/api-reference/hooks/model-context.mdx +0 -34
  90. package/.docs/raw/docs/(reference)/api-reference/hooks/primitives.mdx +0 -350
  91. package/.docs/raw/docs/(reference)/api-reference/hooks/runtimes.mdx +0 -28
  92. package/.docs/raw/docs/(reference)/api-reference/hooks/state.mdx +0 -97
  93. package/.docs/raw/docs/(reference)/api-reference/integrations/cloud-ai-sdk.mdx +0 -24
  94. package/.docs/raw/docs/(reference)/api-reference/integrations/eve.mdx +0 -97
  95. package/.docs/raw/docs/(reference)/api-reference/integrations/index.mdx +0 -28
  96. package/.docs/raw/docs/(reference)/api-reference/integrations/react-ai-sdk.mdx +0 -200
  97. package/.docs/raw/docs/(reference)/api-reference/integrations/react-data-stream.mdx +0 -37
  98. package/.docs/raw/docs/(reference)/api-reference/model-context/context.mdx +0 -50
  99. package/.docs/raw/docs/(reference)/api-reference/model-context/index.mdx +0 -22
  100. package/.docs/raw/docs/(reference)/api-reference/model-context/registry.mdx +0 -20
  101. package/.docs/raw/docs/(reference)/api-reference/overview.mdx +0 -566
  102. package/.docs/raw/docs/(reference)/api-reference/primitives/action-bar-more.mdx +0 -152
  103. package/.docs/raw/docs/(reference)/api-reference/primitives/action-bar.mdx +0 -239
  104. package/.docs/raw/docs/(reference)/api-reference/primitives/assistant-if.mdx +0 -208
  105. package/.docs/raw/docs/(reference)/api-reference/primitives/assistant-modal.mdx +0 -108
  106. package/.docs/raw/docs/(reference)/api-reference/primitives/attachment.mdx +0 -99
  107. package/.docs/raw/docs/(reference)/api-reference/primitives/branch-picker.mdx +0 -145
  108. package/.docs/raw/docs/(reference)/api-reference/primitives/chain-of-thought.mdx +0 -82
  109. package/.docs/raw/docs/(reference)/api-reference/primitives/composer.mdx +0 -619
  110. package/.docs/raw/docs/(reference)/api-reference/primitives/composition.mdx +0 -22
  111. package/.docs/raw/docs/(reference)/api-reference/primitives/error.mdx +0 -65
  112. package/.docs/raw/docs/(reference)/api-reference/primitives/index.mdx +0 -73
  113. package/.docs/raw/docs/(reference)/api-reference/primitives/message-part.mdx +0 -117
  114. package/.docs/raw/docs/(reference)/api-reference/primitives/message.mdx +0 -339
  115. package/.docs/raw/docs/(reference)/api-reference/primitives/queue-item.mdx +0 -77
  116. package/.docs/raw/docs/(reference)/api-reference/primitives/selection-toolbar.mdx +0 -88
  117. package/.docs/raw/docs/(reference)/api-reference/primitives/suggestion.mdx +0 -81
  118. package/.docs/raw/docs/(reference)/api-reference/primitives/thread-list-item-more.mdx +0 -129
  119. package/.docs/raw/docs/(reference)/api-reference/primitives/thread-list-item.mdx +0 -138
  120. package/.docs/raw/docs/(reference)/api-reference/primitives/thread-list.mdx +0 -122
  121. package/.docs/raw/docs/(reference)/api-reference/primitives/thread.mdx +0 -289
  122. package/.docs/raw/docs/(reference)/api-reference/runtimes/assistant-runtime.mdx +0 -20
  123. package/.docs/raw/docs/(reference)/api-reference/runtimes/attachment-runtime.mdx +0 -24
  124. package/.docs/raw/docs/(reference)/api-reference/runtimes/composer-runtime.mdx +0 -32
  125. package/.docs/raw/docs/(reference)/api-reference/runtimes/index.mdx +0 -43
  126. package/.docs/raw/docs/(reference)/api-reference/runtimes/message-part-runtime.mdx +0 -43
  127. package/.docs/raw/docs/(reference)/api-reference/runtimes/message-runtime.mdx +0 -24
  128. package/.docs/raw/docs/(reference)/api-reference/runtimes/queue-state.mdx +0 -20
  129. package/.docs/raw/docs/(reference)/api-reference/runtimes/thread-list-item-runtime.mdx +0 -24
  130. package/.docs/raw/docs/(reference)/api-reference/runtimes/thread-list-runtime.mdx +0 -24
  131. package/.docs/raw/docs/(reference)/api-reference/runtimes/thread-runtime.mdx +0 -36
  132. package/.docs/raw/docs/(reference)/api-reference/tools/component-tools.mdx +0 -85
  133. package/.docs/raw/docs/(reference)/api-reference/tools/index.mdx +0 -45
  134. package/.docs/raw/docs/(reference)/api-reference/tools/interactables-legacy.mdx +0 -55
  135. package/.docs/raw/docs/(reference)/api-reference/tools/interactables.mdx +0 -151
  136. package/.docs/raw/docs/(reference)/api-reference/tools/rendering.mdx +0 -106
  137. package/.docs/raw/docs/(reference)/api-reference/tools/status.mdx +0 -62
  138. package/.docs/raw/docs/(reference)/api-reference/tools/toolkits.mdx +0 -178
  139. package/.docs/raw/docs/(reference)/api-reference/transport/assistant-transport.mdx +0 -48
  140. package/.docs/raw/docs/(reference)/api-reference/transport/frame.mdx +0 -62
  141. package/.docs/raw/docs/(reference)/api-reference/transport/index.mdx +0 -22
  142. package/.docs/raw/docs/(reference)/api-reference/utilities/index.mdx +0 -19
  143. package/.docs/raw/docs/(reference)/api-reference/utilities/miscellaneous.mdx +0 -149
  144. package/.docs/raw/docs/(reference)/api-reference/voice/index.mdx +0 -22
  145. package/.docs/raw/docs/(reference)/api-reference/voice/session.mdx +0 -54
  146. package/.docs/raw/docs/(reference)/api-reference/voice/speech-dictation.mdx +0 -36
  147. package/.docs/raw/docs/cloud/ai-sdk-assistant-ui.mdx +0 -527
  148. package/.docs/raw/docs/cloud/ai-sdk.mdx +0 -602
  149. package/.docs/raw/docs/cloud/authorization.mdx +0 -252
  150. package/.docs/raw/docs/cloud/index.mdx +0 -46
  151. package/.docs/raw/docs/cloud/langgraph.mdx +0 -554
  152. package/.docs/raw/docs/copilots/assistant-frame.mdx +0 -400
  153. package/.docs/raw/docs/copilots/make-assistant-visible.mdx +0 -82
  154. package/.docs/raw/docs/copilots/model-context.mdx +0 -156
  155. package/.docs/raw/docs/copilots/motivation.mdx +0 -202
  156. package/.docs/raw/docs/copilots/use-assistant-instructions.mdx +0 -64
  157. package/.docs/raw/docs/guides/attachments.mdx +0 -619
  158. package/.docs/raw/docs/guides/branching.mdx +0 -76
  159. package/.docs/raw/docs/guides/chain-of-thought.mdx +0 -164
  160. package/.docs/raw/docs/guides/chatgpt-subscription.mdx +0 -108
  161. package/.docs/raw/docs/guides/context-api.mdx +0 -619
  162. package/.docs/raw/docs/guides/dictation.mdx +0 -298
  163. package/.docs/raw/docs/guides/editing.mdx +0 -102
  164. package/.docs/raw/docs/guides/electron.mdx +0 -369
  165. package/.docs/raw/docs/guides/headless-composer-input.mdx +0 -113
  166. package/.docs/raw/docs/guides/image-generation.mdx +0 -74
  167. package/.docs/raw/docs/guides/index.mdx +0 -117
  168. package/.docs/raw/docs/guides/input-history.mdx +0 -55
  169. package/.docs/raw/docs/guides/latex.mdx +0 -158
  170. package/.docs/raw/docs/guides/mentions.mdx +0 -575
  171. package/.docs/raw/docs/guides/message-timing.mdx +0 -209
  172. package/.docs/raw/docs/guides/quoting.mdx +0 -169
  173. package/.docs/raw/docs/guides/resumable-stream-deployment.mdx +0 -212
  174. package/.docs/raw/docs/guides/resumable-stream-stores.mdx +0 -152
  175. package/.docs/raw/docs/guides/resumable-streams.mdx +0 -292
  176. package/.docs/raw/docs/guides/slash-commands.mdx +0 -358
  177. package/.docs/raw/docs/guides/speech.mdx +0 -172
  178. package/.docs/raw/docs/guides/suggestions.mdx +0 -384
  179. package/.docs/raw/docs/guides/virtualization.mdx +0 -133
  180. package/.docs/raw/docs/guides/voice.mdx +0 -310
  181. package/.docs/raw/docs/ink/adapters.mdx +0 -99
  182. package/.docs/raw/docs/ink/custom-backend.mdx +0 -254
  183. package/.docs/raw/docs/ink/hooks.mdx +0 -469
  184. package/.docs/raw/docs/ink/index.mdx +0 -236
  185. package/.docs/raw/docs/ink/migration.mdx +0 -138
  186. package/.docs/raw/docs/ink/primitives.mdx +0 -1259
  187. package/.docs/raw/docs/integrations/attachments/custom-adapter.mdx +0 -528
  188. package/.docs/raw/docs/integrations/auth/better-auth.mdx +0 -188
  189. package/.docs/raw/docs/integrations/auth/clerk.mdx +0 -166
  190. package/.docs/raw/docs/integrations/auth/next-auth.mdx +0 -191
  191. package/.docs/raw/docs/integrations/frameworks/ai-sdk.mdx +0 -88
  192. package/.docs/raw/docs/integrations/frameworks/cloudflare-agents/overview.mdx +0 -282
  193. package/.docs/raw/docs/integrations/frameworks/mastra/full-stack.mdx +0 -188
  194. package/.docs/raw/docs/integrations/frameworks/mastra/overview.mdx +0 -57
  195. package/.docs/raw/docs/integrations/frameworks/mastra/separate-server.mdx +0 -201
  196. package/.docs/raw/docs/integrations/gateways/index.mdx +0 -162
  197. package/.docs/raw/docs/integrations/index.mdx +0 -178
  198. package/.docs/raw/docs/integrations/observability/helicone.mdx +0 -129
  199. package/.docs/raw/docs/integrations/observability/langfuse.mdx +0 -161
  200. package/.docs/raw/docs/integrations/observability/langsmith.mdx +0 -151
  201. package/.docs/raw/docs/integrations/persistence/custom-adapter.mdx +0 -773
  202. package/.docs/raw/docs/migrations/deprecation-policy.mdx +0 -42
  203. package/.docs/raw/docs/migrations/index.mdx +0 -50
  204. package/.docs/raw/docs/migrations/react-compatibility.mdx +0 -74
  205. package/.docs/raw/docs/migrations/react-langgraph-v0-7.mdx +0 -328
  206. package/.docs/raw/docs/migrations/toolkit-tools.mdx +0 -236
  207. package/.docs/raw/docs/migrations/v0-11.mdx +0 -172
  208. package/.docs/raw/docs/migrations/v0-12.mdx +0 -302
  209. package/.docs/raw/docs/migrations/v0-14.mdx +0 -297
  210. package/.docs/raw/docs/migrations/v0-15.mdx +0 -270
  211. package/.docs/raw/docs/primitives/action-bar.mdx +0 -352
  212. package/.docs/raw/docs/primitives/assistant-modal.mdx +0 -216
  213. package/.docs/raw/docs/primitives/attachment.mdx +0 -217
  214. package/.docs/raw/docs/primitives/branch-picker.mdx +0 -222
  215. package/.docs/raw/docs/primitives/chain-of-thought.mdx +0 -315
  216. package/.docs/raw/docs/primitives/composer.mdx +0 -659
  217. package/.docs/raw/docs/primitives/error.mdx +0 -142
  218. package/.docs/raw/docs/primitives/index.mdx +0 -99
  219. package/.docs/raw/docs/primitives/message.mdx +0 -618
  220. package/.docs/raw/docs/primitives/selection-toolbar.mdx +0 -191
  221. package/.docs/raw/docs/primitives/suggestion.mdx +0 -254
  222. package/.docs/raw/docs/primitives/thread-list.mdx +0 -467
  223. package/.docs/raw/docs/primitives/thread.mdx +0 -509
  224. package/.docs/raw/docs/react-native/adapters.mdx +0 -94
  225. package/.docs/raw/docs/react-native/custom-backend.mdx +0 -207
  226. package/.docs/raw/docs/react-native/hooks.mdx +0 -339
  227. package/.docs/raw/docs/react-native/index.mdx +0 -289
  228. package/.docs/raw/docs/react-native/migration.mdx +0 -142
  229. package/.docs/raw/docs/react-native/primitives.mdx +0 -839
  230. package/.docs/raw/docs/runtimes/a2a/client-and-hooks.mdx +0 -399
  231. package/.docs/raw/docs/runtimes/a2a/overview.mdx +0 -60
  232. package/.docs/raw/docs/runtimes/a2a/quickstart.mdx +0 -216
  233. package/.docs/raw/docs/runtimes/ag-ui/agent-state.mdx +0 -124
  234. package/.docs/raw/docs/runtimes/ag-ui/overview.mdx +0 -70
  235. package/.docs/raw/docs/runtimes/ag-ui/quickstart.mdx +0 -243
  236. package/.docs/raw/docs/runtimes/ag-ui/runtime-options.mdx +0 -255
  237. package/.docs/raw/docs/runtimes/ai-sdk/overview.mdx +0 -61
  238. package/.docs/raw/docs/runtimes/ai-sdk/v4-legacy.mdx +0 -122
  239. package/.docs/raw/docs/runtimes/ai-sdk/v5-legacy.mdx +0 -135
  240. package/.docs/raw/docs/runtimes/ai-sdk/v6-legacy.mdx +0 -636
  241. package/.docs/raw/docs/runtimes/ai-sdk/v7.mdx +0 -716
  242. package/.docs/raw/docs/runtimes/claude-managed-agents.mdx +0 -118
  243. package/.docs/raw/docs/runtimes/concepts/adapters.mdx +0 -265
  244. package/.docs/raw/docs/runtimes/concepts/architecture.mdx +0 -167
  245. package/.docs/raw/docs/runtimes/concepts/stability.mdx +0 -68
  246. package/.docs/raw/docs/runtimes/concepts/threads.mdx +0 -513
  247. package/.docs/raw/docs/runtimes/custom/assistant-transport.mdx +0 -763
  248. package/.docs/raw/docs/runtimes/custom/data-stream.mdx +0 -339
  249. package/.docs/raw/docs/runtimes/custom/external-store.mdx +0 -957
  250. package/.docs/raw/docs/runtimes/custom/local-runtime.mdx +0 -902
  251. package/.docs/raw/docs/runtimes/custom/overview.mdx +0 -71
  252. package/.docs/raw/docs/runtimes/eve/overview.mdx +0 -151
  253. package/.docs/raw/docs/runtimes/eve/quickstart.mdx +0 -192
  254. package/.docs/raw/docs/runtimes/google-adk/api.mdx +0 -256
  255. package/.docs/raw/docs/runtimes/google-adk/hooks.mdx +0 -784
  256. package/.docs/raw/docs/runtimes/google-adk/overview.mdx +0 -69
  257. package/.docs/raw/docs/runtimes/google-adk/quickstart.mdx +0 -229
  258. package/.docs/raw/docs/runtimes/langchain.mdx +0 -901
  259. package/.docs/raw/docs/runtimes/langgraph/agent-state.mdx +0 -181
  260. package/.docs/raw/docs/runtimes/langgraph/generative-ui.mdx +0 -305
  261. package/.docs/raw/docs/runtimes/langgraph/interrupts.mdx +0 -104
  262. package/.docs/raw/docs/runtimes/langgraph/overview.mdx +0 -84
  263. package/.docs/raw/docs/runtimes/langgraph/quickstart.mdx +0 -496
  264. package/.docs/raw/docs/runtimes/langgraph/streaming.mdx +0 -144
  265. package/.docs/raw/docs/runtimes/langgraph/threads.mdx +0 -113
  266. package/.docs/raw/docs/runtimes/langgraph/tutorial/introduction.mdx +0 -29
  267. package/.docs/raw/docs/runtimes/langgraph/tutorial/part-1.mdx +0 -93
  268. package/.docs/raw/docs/runtimes/langgraph/tutorial/part-2.mdx +0 -347
  269. package/.docs/raw/docs/runtimes/langgraph/tutorial/part-3.mdx +0 -393
  270. package/.docs/raw/docs/runtimes/opencode/hooks.mdx +0 -194
  271. package/.docs/raw/docs/runtimes/opencode/overview.mdx +0 -58
  272. package/.docs/raw/docs/runtimes/opencode/quickstart.mdx +0 -119
  273. package/.docs/raw/docs/runtimes/pick-a-runtime.mdx +0 -133
  274. package/.docs/raw/docs/tools/a2ui.mdx +0 -107
  275. package/.docs/raw/docs/tools/backend.mdx +0 -147
  276. package/.docs/raw/docs/tools/defining-tools.mdx +0 -574
  277. package/.docs/raw/docs/tools/dynamic-tools.mdx +0 -112
  278. package/.docs/raw/docs/tools/generative-ui-primitive.mdx +0 -180
  279. package/.docs/raw/docs/tools/generative-ui-slack.mdx +0 -167
  280. package/.docs/raw/docs/tools/generative-ui-teams.mdx +0 -160
  281. package/.docs/raw/docs/tools/generative-ui.mdx +0 -322
  282. package/.docs/raw/docs/tools/index.mdx +0 -72
  283. package/.docs/raw/docs/tools/interactables.mdx +0 -1084
  284. package/.docs/raw/docs/tools/mcp-apps.mdx +0 -346
  285. package/.docs/raw/docs/tools/mcp.mdx +0 -466
  286. package/.docs/raw/docs/tools/multi-agent.mdx +0 -237
  287. package/.docs/raw/docs/tools/openui.mdx +0 -175
  288. package/.docs/raw/docs/tools/tool-ui.mdx +0 -1008
  289. package/.docs/raw/docs/tools/user-managed-mcp.mdx +0 -428
  290. package/.docs/raw/docs/ui/accordion.mdx +0 -266
  291. package/.docs/raw/docs/ui/assistant-modal.mdx +0 -166
  292. package/.docs/raw/docs/ui/assistant-sidebar.mdx +0 -89
  293. package/.docs/raw/docs/ui/attachment.mdx +0 -259
  294. package/.docs/raw/docs/ui/badge.mdx +0 -150
  295. package/.docs/raw/docs/ui/composer-trigger-popover.mdx +0 -212
  296. package/.docs/raw/docs/ui/context-display.mdx +0 -148
  297. package/.docs/raw/docs/ui/diff-viewer.mdx +0 -280
  298. package/.docs/raw/docs/ui/directive-text.mdx +0 -114
  299. package/.docs/raw/docs/ui/dot-matrix.mdx +0 -133
  300. package/.docs/raw/docs/ui/file.mdx +0 -159
  301. package/.docs/raw/docs/ui/follow-up-suggestions.mdx +0 -82
  302. package/.docs/raw/docs/ui/image.mdx +0 -102
  303. package/.docs/raw/docs/ui/markdown.mdx +0 -64
  304. package/.docs/raw/docs/ui/mcp-config.mdx +0 -107
  305. package/.docs/raw/docs/ui/mermaid.mdx +0 -92
  306. package/.docs/raw/docs/ui/message-timing.mdx +0 -93
  307. package/.docs/raw/docs/ui/model-selector.mdx +0 -455
  308. package/.docs/raw/docs/ui/number-roll.mdx +0 -154
  309. package/.docs/raw/docs/ui/part-grouping.mdx +0 -614
  310. package/.docs/raw/docs/ui/quote.mdx +0 -211
  311. package/.docs/raw/docs/ui/reasoning.mdx +0 -186
  312. package/.docs/raw/docs/ui/scrollbar.mdx +0 -77
  313. package/.docs/raw/docs/ui/select.mdx +0 -254
  314. package/.docs/raw/docs/ui/sources.mdx +0 -177
  315. package/.docs/raw/docs/ui/streamdown.mdx +0 -392
  316. package/.docs/raw/docs/ui/syntax-highlighting.mdx +0 -205
  317. package/.docs/raw/docs/ui/tabs.mdx +0 -271
  318. package/.docs/raw/docs/ui/thread-list.mdx +0 -372
  319. package/.docs/raw/docs/ui/thread.mdx +0 -512
  320. package/.docs/raw/docs/ui/tool-fallback.mdx +0 -127
  321. package/.docs/raw/docs/ui/tool-group.mdx +0 -240
  322. package/.docs/raw/docs/ui/voice.mdx +0 -173
  323. package/.docs/raw/docs/utilities/heat-graph.mdx +0 -237
  324. package/.docs/raw/docs/utilities/react-o11y.mdx +0 -362
  325. package/.docs/raw/docs/utilities/tw-shimmer.mdx +0 -212
  326. package/dist/constants.d.ts +0 -14
  327. package/dist/constants.d.ts.map +0 -1
  328. package/dist/constants.js +0 -19
  329. package/dist/constants.js.map +0 -1
  330. package/dist/prepare-docs/code-examples.d.ts +0 -5
  331. package/dist/prepare-docs/code-examples.d.ts.map +0 -1
  332. package/dist/prepare-docs/code-examples.js +0 -117
  333. package/dist/prepare-docs/code-examples.js.map +0 -1
  334. package/dist/prepare-docs/copy-raw.d.ts +0 -5
  335. package/dist/prepare-docs/copy-raw.d.ts.map +0 -1
  336. package/dist/prepare-docs/copy-raw.js +0 -49
  337. package/dist/prepare-docs/copy-raw.js.map +0 -1
  338. package/dist/prepare-docs/prepare.d.ts +0 -1
  339. package/dist/prepare-docs/prepare.js +0 -22
  340. package/dist/prepare-docs/prepare.js.map +0 -1
  341. package/dist/prompts/xulux-playground.d.ts +0 -12
  342. package/dist/prompts/xulux-playground.d.ts.map +0 -1
  343. package/dist/prompts/xulux-playground.js +0 -33
  344. package/dist/prompts/xulux-playground.js.map +0 -1
  345. package/dist/tools/docs.d.ts +0 -22
  346. package/dist/tools/docs.d.ts.map +0 -1
  347. package/dist/tools/docs.js +0 -177
  348. package/dist/tools/docs.js.map +0 -1
  349. package/dist/tools/examples.d.ts +0 -24
  350. package/dist/tools/examples.d.ts.map +0 -1
  351. package/dist/tools/examples.js +0 -87
  352. package/dist/tools/examples.js.map +0 -1
  353. package/dist/tools/resources.d.ts +0 -6
  354. package/dist/tools/resources.d.ts.map +0 -1
  355. package/dist/tools/resources.js +0 -75
  356. package/dist/tools/resources.js.map +0 -1
  357. package/dist/tools/search.d.ts +0 -24
  358. package/dist/tools/search.d.ts.map +0 -1
  359. package/dist/tools/search.js +0 -39
  360. package/dist/tools/search.js.map +0 -1
  361. package/dist/tools/tests/mcp-test-client.d.ts +0 -15
  362. package/dist/tools/tests/mcp-test-client.d.ts.map +0 -1
  363. package/dist/tools/tests/mcp-test-client.js +0 -68
  364. package/dist/tools/tests/mcp-test-client.js.map +0 -1
  365. package/dist/tools/tests/test-setup.d.ts +0 -7
  366. package/dist/tools/tests/test-setup.d.ts.map +0 -1
  367. package/dist/tools/tests/test-setup.js +0 -36
  368. package/dist/tools/tests/test-setup.js.map +0 -1
  369. package/dist/tools/xulux-templates.d.ts +0 -58
  370. package/dist/tools/xulux-templates.d.ts.map +0 -1
  371. package/dist/tools/xulux-templates.js +0 -84
  372. package/dist/tools/xulux-templates.js.map +0 -1
  373. package/dist/utils/cache.d.ts +0 -5
  374. package/dist/utils/cache.d.ts.map +0 -1
  375. package/dist/utils/cache.js +0 -18
  376. package/dist/utils/cache.js.map +0 -1
  377. package/dist/utils/logger.d.ts +0 -10
  378. package/dist/utils/logger.d.ts.map +0 -1
  379. package/dist/utils/logger.js +0 -20
  380. package/dist/utils/logger.js.map +0 -1
  381. package/dist/utils/mcp-format.d.ts +0 -11
  382. package/dist/utils/mcp-format.d.ts.map +0 -1
  383. package/dist/utils/mcp-format.js +0 -14
  384. package/dist/utils/mcp-format.js.map +0 -1
  385. package/dist/utils/mdx.d.ts +0 -12
  386. package/dist/utils/mdx.d.ts.map +0 -1
  387. package/dist/utils/mdx.js +0 -45
  388. package/dist/utils/mdx.js.map +0 -1
  389. package/dist/utils/paths.d.ts +0 -12
  390. package/dist/utils/paths.d.ts.map +0 -1
  391. package/dist/utils/paths.js +0 -93
  392. package/dist/utils/paths.js.map +0 -1
  393. package/dist/utils/search.d.ts +0 -10
  394. package/dist/utils/search.d.ts.map +0 -1
  395. package/dist/utils/search.js +0 -97
  396. package/dist/utils/search.js.map +0 -1
  397. package/dist/utils/security.d.ts +0 -5
  398. package/dist/utils/security.d.ts.map +0 -1
  399. package/dist/utils/security.js +0 -22
  400. package/dist/utils/security.js.map +0 -1
  401. package/dist/xulux/catalog-client.d.ts +0 -14
  402. package/dist/xulux/catalog-client.d.ts.map +0 -1
  403. package/dist/xulux/catalog-client.js +0 -67
  404. package/dist/xulux/catalog-client.js.map +0 -1
  405. package/dist/xulux/fallback-catalog.d.ts +0 -7
  406. package/dist/xulux/fallback-catalog.d.ts.map +0 -1
  407. package/dist/xulux/fallback-catalog.js +0 -47
  408. package/dist/xulux/fallback-catalog.js.map +0 -1
  409. package/dist/xulux/fetch-sandbox.d.ts +0 -5
  410. package/dist/xulux/fetch-sandbox.d.ts.map +0 -1
  411. package/dist/xulux/fetch-sandbox.js +0 -40
  412. package/dist/xulux/fetch-sandbox.js.map +0 -1
  413. package/dist/xulux/template-service.d.ts +0 -84
  414. package/dist/xulux/template-service.d.ts.map +0 -1
  415. package/dist/xulux/template-service.js +0 -223
  416. package/dist/xulux/template-service.js.map +0 -1
  417. package/dist/xulux/types.d.ts +0 -55
  418. package/dist/xulux/types.d.ts.map +0 -1
  419. package/dist/xulux/types.js +0 -6
  420. package/dist/xulux/types.js.map +0 -1
  421. package/src/constants.ts +0 -24
  422. package/src/prepare-docs/code-examples.ts +0 -158
  423. package/src/prepare-docs/copy-raw.ts +0 -50
  424. package/src/prepare-docs/prepare.ts +0 -24
  425. package/src/prompts/xulux-playground.ts +0 -36
  426. package/src/tools/docs.ts +0 -255
  427. package/src/tools/examples.ts +0 -114
  428. package/src/tools/resources.ts +0 -111
  429. package/src/tools/search.ts +0 -46
  430. package/src/tools/tests/completions.test.ts +0 -60
  431. package/src/tools/tests/directory-size-cap.test.ts +0 -50
  432. package/src/tools/tests/docs.test.ts +0 -144
  433. package/src/tools/tests/examples.test.ts +0 -94
  434. package/src/tools/tests/integration.test.ts +0 -45
  435. package/src/tools/tests/json-parsing.test.ts +0 -23
  436. package/src/tools/tests/listings-cache.test.ts +0 -19
  437. package/src/tools/tests/mcp-protocol.test.ts +0 -216
  438. package/src/tools/tests/mcp-test-client.ts +0 -111
  439. package/src/tools/tests/path-traversal.test.ts +0 -81
  440. package/src/tools/tests/resources.test.ts +0 -133
  441. package/src/tools/tests/search.test.ts +0 -37
  442. package/src/tools/tests/test-setup.ts +0 -50
  443. package/src/tools/tests/xulux-templates.test.ts +0 -262
  444. package/src/tools/xulux-templates.ts +0 -141
  445. package/src/utils/cache.ts +0 -20
  446. package/src/utils/logger.ts +0 -20
  447. package/src/utils/mcp-format.ts +0 -14
  448. package/src/utils/mdx.ts +0 -59
  449. package/src/utils/paths.ts +0 -139
  450. package/src/utils/search.ts +0 -131
  451. package/src/utils/security.ts +0 -52
  452. package/src/utils/tests/cache.test.ts +0 -51
  453. package/src/utils/tests/mcp-format.test.ts +0 -22
  454. package/src/utils/tests/security.test.ts +0 -119
  455. package/src/xulux/catalog-client.ts +0 -105
  456. package/src/xulux/fallback-catalog.ts +0 -63
  457. package/src/xulux/fetch-sandbox.ts +0 -56
  458. package/src/xulux/template-service.ts +0 -406
  459. package/src/xulux/types.ts +0 -60
@@ -1,807 +0,0 @@
1
- # Example: waterfall
2
-
3
- ## app/globals.css
4
-
5
- ```css
6
- @import "tailwindcss";
7
-
8
- :root {
9
- --background: #ffffff;
10
- --foreground: #171717;
11
- --muted-foreground: #737373;
12
- --border: #e5e5e5;
13
- --accent: #f5f5f5;
14
- }
15
-
16
- @theme inline {
17
- --color-background: var(--background);
18
- --color-foreground: var(--foreground);
19
- --color-muted-foreground: var(--muted-foreground);
20
- --color-border: var(--border);
21
- --color-accent: var(--accent);
22
- --font-sans: var(--font-geist-sans);
23
- --font-mono: var(--font-geist-mono);
24
- }
25
-
26
- @media (prefers-color-scheme: dark) {
27
- :root {
28
- --background: #0a0a0a;
29
- --foreground: #ededed;
30
- --muted-foreground: #a3a3a3;
31
- --border: #2e2e2e;
32
- --accent: #1a1a1a;
33
- }
34
- }
35
-
36
- body {
37
- background: var(--background);
38
- color: var(--foreground);
39
- font-family: Arial, Helvetica, sans-serif;
40
- }
41
-
42
- ```
43
-
44
- ## app/layout.tsx
45
-
46
- ```tsx
47
- import type { Metadata } from "next";
48
- import { Geist, Geist_Mono } from "next/font/google";
49
- import "./globals.css";
50
-
51
- const geistSans = Geist({
52
- variable: "--font-geist-sans",
53
- subsets: ["latin"],
54
- });
55
-
56
- const geistMono = Geist_Mono({
57
- variable: "--font-geist-mono",
58
- subsets: ["latin"],
59
- });
60
-
61
- export const metadata: Metadata = {
62
- title: "Waterfall Example",
63
- description: "Span waterfall visualization with @assistant-ui/react-o11y",
64
- };
65
-
66
- export default function RootLayout({
67
- children,
68
- }: Readonly<{
69
- children: React.ReactNode;
70
- }>) {
71
- return (
72
- <html lang="en">
73
- <body
74
- className={`${geistSans.variable} ${geistMono.variable} antialiased`}
75
- >
76
- {children}
77
- </body>
78
- </html>
79
- );
80
- }
81
-
82
- ```
83
-
84
- ## app/page.tsx
85
-
86
- ```tsx
87
- import { WaterfallPage } from "@/lib/waterfall-page";
88
-
89
- export default function Home() {
90
- return (
91
- <div className="bg-background min-h-screen p-8">
92
- <div className="mx-auto max-w-6xl">
93
- <div className="mb-8">
94
- <h1 className="text-foreground mb-2 text-4xl font-bold">
95
- Waterfall Timeline
96
- </h1>
97
- <p className="text-muted-foreground text-lg">
98
- Span visualization powered by @assistant-ui/react-o11y
99
- </p>
100
- </div>
101
-
102
- <WaterfallPage />
103
- </div>
104
- </div>
105
- );
106
- }
107
-
108
- ```
109
-
110
- ## lib/mock-data.ts
111
-
112
- ```typescript
113
- import type { SpanData } from "@assistant-ui/react-o11y";
114
-
115
- const BASE = Date.now() - 5000;
116
-
117
- export const mockSpans: SpanData[] = [
118
- {
119
- id: "span-1",
120
- parentSpanId: null,
121
- name: "POST /api/chat",
122
- type: "api",
123
- status: "completed",
124
- startedAt: BASE,
125
- endedAt: BASE + 4200,
126
- latencyMs: 4200,
127
- },
128
- {
129
- id: "span-2",
130
- parentSpanId: "span-1",
131
- name: "authenticate",
132
- type: "action",
133
- status: "completed",
134
- startedAt: BASE + 50,
135
- endedAt: BASE + 200,
136
- latencyMs: 150,
137
- },
138
- {
139
- id: "span-3",
140
- parentSpanId: "span-1",
141
- name: "agent-pipeline",
142
- type: "pipeline",
143
- status: "completed",
144
- startedAt: BASE + 220,
145
- endedAt: BASE + 4100,
146
- latencyMs: 3880,
147
- },
148
- {
149
- id: "span-4",
150
- parentSpanId: "span-3",
151
- name: "retrieve-context",
152
- type: "tool",
153
- status: "completed",
154
- startedAt: BASE + 250,
155
- endedAt: BASE + 900,
156
- latencyMs: 650,
157
- },
158
- {
159
- id: "span-5",
160
- parentSpanId: "span-3",
161
- name: "llm-generate",
162
- type: "action",
163
- status: "completed",
164
- startedAt: BASE + 920,
165
- endedAt: BASE + 2800,
166
- latencyMs: 1880,
167
- },
168
- {
169
- id: "span-6",
170
- parentSpanId: "span-3",
171
- name: "web-search",
172
- type: "tool",
173
- status: "completed",
174
- startedAt: BASE + 2850,
175
- endedAt: BASE + 3500,
176
- latencyMs: 650,
177
- },
178
- {
179
- id: "span-7",
180
- parentSpanId: "span-3",
181
- name: "llm-summarize",
182
- type: "action",
183
- status: "completed",
184
- startedAt: BASE + 3520,
185
- endedAt: BASE + 4050,
186
- latencyMs: 530,
187
- },
188
- {
189
- id: "span-8",
190
- parentSpanId: "span-1",
191
- name: "log-response",
192
- type: "action",
193
- status: "completed",
194
- startedAt: BASE + 4110,
195
- endedAt: BASE + 4180,
196
- latencyMs: 70,
197
- },
198
- {
199
- id: "span-9",
200
- parentSpanId: null,
201
- name: "POST /api/feedback",
202
- type: "api",
203
- status: "completed",
204
- startedAt: BASE + 4500,
205
- endedAt: BASE + 4700,
206
- latencyMs: 200,
207
- },
208
- {
209
- id: "span-10",
210
- parentSpanId: "span-9",
211
- name: "validate-input",
212
- type: "action",
213
- status: "completed",
214
- startedAt: BASE + 4520,
215
- endedAt: BASE + 4560,
216
- latencyMs: 40,
217
- },
218
- {
219
- id: "span-11",
220
- parentSpanId: "span-9",
221
- name: "store-feedback",
222
- type: "action",
223
- status: "failed",
224
- startedAt: BASE + 4570,
225
- endedAt: BASE + 4680,
226
- latencyMs: 110,
227
- },
228
- {
229
- id: "span-12",
230
- parentSpanId: null,
231
- name: "GET /api/status",
232
- type: "api",
233
- status: "running",
234
- startedAt: BASE + 4800,
235
- endedAt: null,
236
- latencyMs: null,
237
- },
238
- {
239
- id: "span-13",
240
- parentSpanId: "span-12",
241
- name: "health-check",
242
- type: "flow",
243
- status: "running",
244
- startedAt: BASE + 4830,
245
- endedAt: null,
246
- latencyMs: null,
247
- },
248
- {
249
- id: "span-14",
250
- parentSpanId: "span-4",
251
- name: "vector-search",
252
- type: "tool",
253
- status: "completed",
254
- startedAt: BASE + 280,
255
- endedAt: BASE + 700,
256
- latencyMs: 420,
257
- },
258
- {
259
- id: "span-15",
260
- parentSpanId: "span-4",
261
- name: "rerank",
262
- type: "action",
263
- status: "completed",
264
- startedAt: BASE + 710,
265
- endedAt: BASE + 880,
266
- latencyMs: 170,
267
- },
268
- ];
269
-
270
- ```
271
-
272
- ## lib/waterfall-bar.tsx
273
-
274
- ```tsx
275
- "use client";
276
-
277
- import { useCallback, useEffect, useRef } from "react";
278
- import { useAuiState } from "@assistant-ui/store";
279
- import type { SpanItemState } from "@assistant-ui/react-o11y";
280
- import { useWaterfallLayout } from "./waterfall-timeline";
281
-
282
- const TYPE_COLORS: Record<string, string> = {
283
- action: "hsl(221 83% 53%)",
284
- api: "hsl(262 83% 58%)",
285
- tool: "hsl(142 71% 45%)",
286
- flow: "hsl(25 95% 53%)",
287
- pipeline: "hsl(340 75% 55%)",
288
- };
289
-
290
- const FALLBACK_COLOR = "hsl(220 9% 46%)";
291
-
292
- const STATUS_OPACITY: Record<SpanItemState["status"], number> = {
293
- running: 0.7,
294
- completed: 1,
295
- failed: 1,
296
- skipped: 0.5,
297
- };
298
-
299
- export function WaterfallBar() {
300
- const { barWidth, timeRange, barHeight } = useWaterfallLayout();
301
- const startedAt = useAuiState((s) => s.span.startedAt);
302
- const endedAt = useAuiState((s) => s.span.endedAt) as number | null;
303
- const status = useAuiState((s) => s.span.status) as SpanItemState["status"];
304
- const type = useAuiState((s) => s.span.type);
305
-
306
- const barRef = useRef<SVGRectElement>(null);
307
-
308
- const scale = useCallback(
309
- (t: number) => {
310
- const range = timeRange.max - timeRange.min || 1;
311
- return ((t - timeRange.min) / range) * barWidth;
312
- },
313
- [timeRange, barWidth],
314
- );
315
-
316
- const x = scale(startedAt);
317
-
318
- useEffect(() => {
319
- if (status !== "running") return;
320
-
321
- let frameId: number;
322
- const tick = () => {
323
- const width = scale(Date.now()) - x;
324
- barRef.current?.setAttribute("width", String(Math.max(0, width)));
325
- frameId = requestAnimationFrame(tick);
326
- };
327
- frameId = requestAnimationFrame(tick);
328
- return () => cancelAnimationFrame(frameId);
329
- }, [status, x, scale]);
330
-
331
- const rawWidth = endedAt ? scale(endedAt) - x : 0;
332
- const width = Math.max(rawWidth, 4);
333
- const fill = TYPE_COLORS[type] ?? FALLBACK_COLOR;
334
- const opacity = STATUS_OPACITY[status];
335
-
336
- return (
337
- <g>
338
- <rect
339
- ref={barRef}
340
- x={x}
341
- y={4}
342
- width={width}
343
- height={barHeight - 8}
344
- rx={3}
345
- fill={fill}
346
- opacity={opacity}
347
- className={status === "running" ? "animate-pulse" : ""}
348
- />
349
- {status === "failed" && (
350
- <rect
351
- x={x}
352
- y={4}
353
- width={width}
354
- height={barHeight - 8}
355
- rx={3}
356
- fill="none"
357
- stroke="hsl(0 84% 60%)"
358
- strokeWidth={2}
359
- />
360
- )}
361
- </g>
362
- );
363
- }
364
-
365
- ```
366
-
367
- ## lib/waterfall-page.tsx
368
-
369
- ```tsx
370
- "use client";
371
-
372
- import { AuiProvider, AuiConfig } from "@assistant-ui/store";
373
- import { SpanResource } from "@assistant-ui/react-o11y";
374
- import { mockSpans } from "./mock-data";
375
- import { WaterfallTimeline } from "./waterfall-timeline";
376
-
377
- const config = AuiConfig({
378
- span: SpanResource({ spans: mockSpans }),
379
- });
380
-
381
- export function WaterfallPage() {
382
- return (
383
- <AuiProvider config={config}>
384
- <WaterfallTimeline />
385
- </AuiProvider>
386
- );
387
- }
388
-
389
- ```
390
-
391
- ## lib/waterfall-row.tsx
392
-
393
- ```tsx
394
- "use client";
395
-
396
- import { SpanPrimitive } from "@assistant-ui/react-o11y";
397
- import { AuiIf } from "@assistant-ui/store";
398
- import { WaterfallBar } from "./waterfall-bar";
399
- import { useWaterfallLayout } from "./waterfall-timeline";
400
-
401
- const LABEL_WIDTH = 200;
402
-
403
- export function WaterfallRow() {
404
- const { barWidth, contentWidth, barHeight } = useWaterfallLayout();
405
-
406
- return (
407
- <SpanPrimitive.Root
408
- className="group flex cursor-pointer items-center"
409
- style={{ width: contentWidth, height: barHeight }}
410
- >
411
- <SpanPrimitive.Indent
412
- baseIndent={8}
413
- indentPerLevel={12}
414
- className="border-border bg-background group-hover:bg-accent/50 sticky left-0 z-10 flex shrink-0 items-center gap-1 overflow-hidden border-r px-2"
415
- style={{ width: LABEL_WIDTH, height: barHeight }}
416
- >
417
- <AuiIf condition={(s) => s.span.hasChildren}>
418
- <SpanPrimitive.CollapseToggle className="text-muted-foreground hover:text-foreground flex shrink-0 items-center justify-center rounded p-0.5">
419
- <svg
420
- aria-hidden="true"
421
- className="size-3.5 transition-transform group-data-[collapsed=true]:-rotate-90"
422
- viewBox="0 0 16 16"
423
- fill="currentColor"
424
- >
425
- <path d="M4 6l4 4 4-4H4z" />
426
- </svg>
427
- </SpanPrimitive.CollapseToggle>
428
- </AuiIf>
429
- <AuiIf condition={(s) => !s.span.hasChildren}>
430
- <span className="w-4.5 shrink-0" />
431
- </AuiIf>
432
- <SpanPrimitive.StatusIndicator className="size-1.5 shrink-0 rounded-full bg-current" />
433
- <SpanPrimitive.TypeBadge className="border-border text-muted-foreground shrink-0 rounded border px-1 text-[10px]" />
434
- <SpanPrimitive.Name className="truncate text-sm" />
435
- </SpanPrimitive.Indent>
436
-
437
- {/* Timeline bar */}
438
- <div
439
- className="group-hover:bg-accent/30"
440
- style={{ width: barWidth, height: barHeight }}
441
- >
442
- <svg aria-hidden="true" width={barWidth} height={barHeight}>
443
- <WaterfallBar />
444
- </svg>
445
- </div>
446
- </SpanPrimitive.Root>
447
- );
448
- }
449
-
450
- ```
451
-
452
- ## lib/waterfall-timeline.tsx
453
-
454
- ```tsx
455
- "use client";
456
-
457
- import {
458
- createContext,
459
- useContext,
460
- useEffect,
461
- useLayoutEffect,
462
- useMemo,
463
- useRef,
464
- useState,
465
- } from "react";
466
- import { useAuiState } from "@assistant-ui/store";
467
- import { SpanPrimitive, type SpanState } from "@assistant-ui/react-o11y";
468
- import { WaterfallRow } from "./waterfall-row";
469
-
470
- const LABEL_WIDTH = 200;
471
- const MAX_LIST_HEIGHT = 400;
472
- const MIN_ZOOM = 1;
473
- const MAX_ZOOM = 20;
474
- const RIGHT_PADDING_RATIO = 0.08;
475
-
476
- export type WaterfallLayoutContextValue = {
477
- barWidth: number;
478
- timeRange: { min: number; max: number };
479
- barHeight: number;
480
- contentWidth: number;
481
- selectedSpanId: string | null;
482
- onSelectSpan: (spanId: string) => void;
483
- };
484
-
485
- export const WaterfallLayoutContext =
486
- createContext<WaterfallLayoutContextValue | null>(null);
487
-
488
- export function useWaterfallLayout(): WaterfallLayoutContextValue {
489
- const ctx = useContext(WaterfallLayoutContext);
490
- if (!ctx) {
491
- throw new Error(
492
- "useWaterfallLayout must be used within WaterfallLayoutContext",
493
- );
494
- }
495
- return ctx;
496
- }
497
-
498
- function formatTime(ms: number): string {
499
- if (ms < 1000) return `${Math.round(ms)} ms`;
500
- return `${(ms / 1000).toFixed(1)} s`;
501
- }
502
-
503
- function TimeAxisTicks({
504
- timeRange,
505
- barWidth,
506
- }: {
507
- timeRange: { min: number; max: number };
508
- barWidth: number;
509
- }) {
510
- const duration = timeRange.max - timeRange.min;
511
- const tickCount = Math.min(5, Math.max(2, Math.floor(barWidth / 100)));
512
- const ticks = Array.from({ length: tickCount + 1 }, (_, i) => {
513
- const t = (i / tickCount) * duration;
514
- const x = (i / tickCount) * barWidth;
515
- return { t, x };
516
- });
517
-
518
- return (
519
- <svg
520
- aria-hidden="true"
521
- width={barWidth}
522
- height={28}
523
- className="overflow-visible"
524
- >
525
- {ticks.map(({ t, x }) => (
526
- <g key={x}>
527
- <line
528
- x1={x}
529
- y1={20}
530
- x2={x}
531
- y2={28}
532
- stroke="currentColor"
533
- className="text-border"
534
- />
535
- <text
536
- x={x}
537
- y={14}
538
- textAnchor="middle"
539
- className="fill-muted-foreground text-[10px]"
540
- >
541
- {formatTime(t)}
542
- </text>
543
- </g>
544
- ))}
545
- </svg>
546
- );
547
- }
548
-
549
- export function WaterfallTimeline() {
550
- const outerRef = useRef<HTMLDivElement>(null);
551
- const scrollRef = useRef<HTMLDivElement>(null);
552
-
553
- const [baseBarWidth, setBaseBarWidth] = useState(400);
554
- const [zoom, setZoom] = useState(1);
555
- const zoomRef = useRef(1);
556
- const baseBarWidthRef = useRef(400);
557
- const scrollAdjustRef = useRef<{
558
- mouseX: number;
559
- ratio: number;
560
- } | null>(null);
561
-
562
- const [selectedSpanId, setSelectedSpanId] = useState<string | null>(null);
563
-
564
- const barWidth = Math.max(200, Math.round(baseBarWidth * zoom));
565
-
566
- const hasSpans = useAuiState((s) => s.span.hasChildren);
567
- const timeRange = useAuiState(
568
- (s) => s.span.timeRange,
569
- ) as SpanState["timeRange"];
570
-
571
- // Measure outer container width — re-attach when scroll container mounts
572
- useEffect(() => {
573
- const el = outerRef.current;
574
- if (!el) return;
575
-
576
- const observer = new ResizeObserver((entries) => {
577
- const entry = entries[0];
578
- if (entry) {
579
- const w = Math.max(200, entry.contentRect.width - LABEL_WIDTH);
580
- baseBarWidthRef.current = w;
581
- setBaseBarWidth(w);
582
- }
583
- });
584
-
585
- observer.observe(el);
586
- return () => observer.disconnect();
587
- }, [hasSpans]);
588
-
589
- // Cmd + scroll wheel zoom — re-attach when scroll container mounts
590
- useEffect(() => {
591
- const el = scrollRef.current;
592
- if (!el) return;
593
-
594
- const handleWheel = (e: WheelEvent) => {
595
- if (!e.metaKey) return;
596
- e.preventDefault();
597
-
598
- const rect = el.getBoundingClientRect();
599
- const mouseXInView = e.clientX - rect.left - LABEL_WIDTH;
600
- const mouseXInContent = el.scrollLeft + mouseXInView;
601
- const currentBarWidth = baseBarWidthRef.current * zoomRef.current;
602
- const ratio = currentBarWidth > 0 ? mouseXInContent / currentBarWidth : 0;
603
-
604
- const newZoom = Math.max(
605
- MIN_ZOOM,
606
- Math.min(MAX_ZOOM, zoomRef.current * 2 ** (-e.deltaY * 0.003)),
607
- );
608
-
609
- scrollAdjustRef.current = { mouseX: mouseXInView, ratio };
610
- zoomRef.current = newZoom;
611
- setZoom(newZoom);
612
- };
613
-
614
- el.addEventListener("wheel", handleWheel, { passive: false });
615
- return () => el.removeEventListener("wheel", handleWheel);
616
- }, [hasSpans]);
617
-
618
- // Adjust scroll after zoom
619
- useLayoutEffect(() => {
620
- const adj = scrollAdjustRef.current;
621
- const el = scrollRef.current;
622
- if (!adj || !el) return;
623
- scrollAdjustRef.current = null;
624
-
625
- const newBarX = adj.ratio * barWidth;
626
- el.scrollLeft = newBarX - adj.mouseX;
627
- }, [barWidth]);
628
-
629
- const renderTimeRange = useMemo(() => {
630
- const duration = timeRange.max - timeRange.min;
631
- return {
632
- min: timeRange.min,
633
- max: timeRange.max + duration * RIGHT_PADDING_RATIO,
634
- };
635
- }, [timeRange]);
636
-
637
- const contentWidth = LABEL_WIDTH + barWidth;
638
- const scrollMaxHeight = MAX_LIST_HEIGHT + 28;
639
-
640
- const layoutValue = useMemo(
641
- () => ({
642
- barWidth,
643
- timeRange: renderTimeRange,
644
- barHeight: 32,
645
- contentWidth,
646
- selectedSpanId,
647
- onSelectSpan: setSelectedSpanId,
648
- }),
649
- [barWidth, renderTimeRange, contentWidth, selectedSpanId],
650
- );
651
-
652
- if (!hasSpans) {
653
- return (
654
- <div className="border-border text-muted-foreground rounded-lg border py-12 text-center text-sm">
655
- No spans recorded.
656
- </div>
657
- );
658
- }
659
-
660
- return (
661
- <div ref={outerRef} className="border-border rounded-lg border">
662
- <div
663
- ref={scrollRef}
664
- className="overflow-auto"
665
- style={{ maxHeight: scrollMaxHeight }}
666
- >
667
- {/* Time axis */}
668
- <div
669
- className="border-border bg-background sticky top-0 z-20 flex border-b"
670
- style={{ width: contentWidth }}
671
- >
672
- <div
673
- className="border-border bg-background text-muted-foreground sticky left-0 z-30 shrink-0 border-r px-2 py-1.5 text-xs"
674
- style={{ width: LABEL_WIDTH }}
675
- >
676
- Span
677
- </div>
678
- <div style={{ width: barWidth, height: 28 }}>
679
- <TimeAxisTicks timeRange={renderTimeRange} barWidth={barWidth} />
680
- </div>
681
- </div>
682
-
683
- {/* Span rows */}
684
- <WaterfallLayoutContext.Provider value={layoutValue}>
685
- <div
686
- style={{ width: contentWidth }}
687
- onClick={(e) => {
688
- const target = e.target as HTMLElement;
689
- const el = target.closest("[data-span-id]") as HTMLElement | null;
690
- if (el?.dataset.spanId) {
691
- setSelectedSpanId(el.dataset.spanId);
692
- }
693
- }}
694
- >
695
- <SpanPrimitive.Children>
696
- {() => <WaterfallRow />}
697
- </SpanPrimitive.Children>
698
- </div>
699
- </WaterfallLayoutContext.Provider>
700
- </div>
701
-
702
- {/* Legend */}
703
- <div className="border-border text-muted-foreground flex items-center gap-4 border-t px-3 py-2 text-xs">
704
- <div className="flex items-center gap-1.5">
705
- <span
706
- className="size-2.5 rounded-sm"
707
- style={{ background: "hsl(221 83% 53%)" }}
708
- />
709
- <span>action</span>
710
- </div>
711
- <div className="flex items-center gap-1.5">
712
- <span
713
- className="size-2.5 rounded-sm"
714
- style={{ background: "hsl(262 83% 58%)" }}
715
- />
716
- <span>api</span>
717
- </div>
718
- <div className="flex items-center gap-1.5">
719
- <span
720
- className="size-2.5 rounded-sm"
721
- style={{ background: "hsl(142 71% 45%)" }}
722
- />
723
- <span>tool</span>
724
- </div>
725
- <div className="flex items-center gap-1.5">
726
- <span
727
- className="size-2.5 rounded-sm"
728
- style={{ background: "hsl(25 95% 53%)" }}
729
- />
730
- <span>flow</span>
731
- </div>
732
- <div className="flex items-center gap-1.5">
733
- <span
734
- className="size-2.5 rounded-sm"
735
- style={{ background: "hsl(340 75% 55%)" }}
736
- />
737
- <span>pipeline</span>
738
- </div>
739
- </div>
740
- </div>
741
- );
742
- }
743
-
744
- ```
745
-
746
- ## next.config.ts
747
-
748
- ```typescript
749
- import { withAui } from "@assistant-ui/next";
750
- import type { NextConfig } from "next";
751
-
752
- const nextConfig: NextConfig = {/* config options here */};
753
-
754
- export default withAui(nextConfig);
755
-
756
- ```
757
-
758
- ## package.json
759
-
760
- ```json
761
- {
762
- "name": "waterfall",
763
- "version": "0.0.0",
764
- "private": true,
765
- "type": "module",
766
- "scripts": {
767
- "dev": "next dev",
768
- "build": "next build",
769
- "start": "next start"
770
- },
771
- "dependencies": {
772
- "@assistant-ui/react-o11y": "workspace:*",
773
- "@assistant-ui/store": "workspace:*",
774
- "@assistant-ui/tap": "workspace:*",
775
- "next": "^16.3.0",
776
- "react": "^19.2.8",
777
- "react-dom": "^19.2.8"
778
- },
779
- "devDependencies": {
780
- "@assistant-ui/next": "workspace:*",
781
- "@assistant-ui/x-buildutils": "workspace:*",
782
- "@tailwindcss/postcss": "^4.3.3",
783
- "@types/node": "^26.2.0",
784
- "@types/react": "^19.2.18",
785
- "@types/react-dom": "^19.2.4",
786
- "postcss": "^8.5.26",
787
- "tailwindcss": "^4.3.3",
788
- "typescript": "^7.0.2"
789
- }
790
- }
791
-
792
- ```
793
-
794
- ## tsconfig.json
795
-
796
- ```json
797
- {
798
- "extends": "@assistant-ui/x-buildutils/ts/next",
799
- "compilerOptions": {
800
- "paths": { "@/*": ["./*"] }
801
- },
802
- "include": ["**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
803
- "exclude": ["node_modules"]
804
- }
805
-
806
- ```
807
-