@agent-native/core 0.84.35 → 0.84.37

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 (205) hide show
  1. package/README.md +15 -51
  2. package/corpus/core/CHANGELOG.md +18 -0
  3. package/corpus/core/docs/content/actions.mdx +17 -24
  4. package/corpus/core/docs/content/agent-surfaces.mdx +59 -56
  5. package/corpus/core/docs/content/cloneable-saas.mdx +3 -3
  6. package/corpus/core/docs/content/faq.mdx +4 -4
  7. package/corpus/core/docs/content/getting-started.mdx +246 -204
  8. package/corpus/core/docs/content/key-concepts.mdx +9 -9
  9. package/corpus/core/docs/content/locales/ar-SA/cloneable-saas.mdx +3 -3
  10. package/corpus/core/docs/content/locales/ar-SA/faq.mdx +4 -4
  11. package/corpus/core/docs/content/locales/ar-SA/getting-started.mdx +148 -214
  12. package/corpus/core/docs/content/locales/ar-SA/pure-agent-apps.mdx +4 -9
  13. package/corpus/core/docs/content/locales/ar-SA/template-chat.mdx +2 -2
  14. package/corpus/core/docs/content/locales/ar-SA/using-your-agent.mdx +2 -2
  15. package/corpus/core/docs/content/locales/de-DE/cloneable-saas.mdx +3 -3
  16. package/corpus/core/docs/content/locales/de-DE/faq.mdx +4 -4
  17. package/corpus/core/docs/content/locales/de-DE/getting-started.mdx +145 -211
  18. package/corpus/core/docs/content/locales/de-DE/pure-agent-apps.mdx +4 -9
  19. package/corpus/core/docs/content/locales/de-DE/template-chat.mdx +2 -2
  20. package/corpus/core/docs/content/locales/de-DE/using-your-agent.mdx +2 -2
  21. package/corpus/core/docs/content/locales/es-ES/cloneable-saas.mdx +3 -3
  22. package/corpus/core/docs/content/locales/es-ES/faq.mdx +4 -4
  23. package/corpus/core/docs/content/locales/es-ES/getting-started.mdx +148 -214
  24. package/corpus/core/docs/content/locales/es-ES/pure-agent-apps.mdx +4 -9
  25. package/corpus/core/docs/content/locales/es-ES/template-chat.mdx +2 -2
  26. package/corpus/core/docs/content/locales/es-ES/using-your-agent.mdx +2 -2
  27. package/corpus/core/docs/content/locales/fr-FR/cloneable-saas.mdx +2 -2
  28. package/corpus/core/docs/content/locales/fr-FR/faq.mdx +4 -4
  29. package/corpus/core/docs/content/locales/fr-FR/getting-started.mdx +146 -212
  30. package/corpus/core/docs/content/locales/fr-FR/pure-agent-apps.mdx +4 -9
  31. package/corpus/core/docs/content/locales/fr-FR/template-chat.mdx +2 -2
  32. package/corpus/core/docs/content/locales/fr-FR/using-your-agent.mdx +2 -2
  33. package/corpus/core/docs/content/locales/hi-IN/cloneable-saas.mdx +3 -3
  34. package/corpus/core/docs/content/locales/hi-IN/faq.mdx +4 -4
  35. package/corpus/core/docs/content/locales/hi-IN/getting-started.mdx +149 -215
  36. package/corpus/core/docs/content/locales/hi-IN/pure-agent-apps.mdx +8 -13
  37. package/corpus/core/docs/content/locales/hi-IN/template-chat.mdx +2 -2
  38. package/corpus/core/docs/content/locales/hi-IN/using-your-agent.mdx +2 -2
  39. package/corpus/core/docs/content/locales/ja-JP/cloneable-saas.mdx +2 -2
  40. package/corpus/core/docs/content/locales/ja-JP/faq.mdx +4 -4
  41. package/corpus/core/docs/content/locales/ja-JP/getting-started.mdx +144 -210
  42. package/corpus/core/docs/content/locales/ja-JP/pure-agent-apps.mdx +8 -13
  43. package/corpus/core/docs/content/locales/ja-JP/template-chat.mdx +2 -2
  44. package/corpus/core/docs/content/locales/ja-JP/using-your-agent.mdx +2 -2
  45. package/corpus/core/docs/content/locales/ko-KR/cloneable-saas.mdx +3 -3
  46. package/corpus/core/docs/content/locales/ko-KR/faq.mdx +4 -4
  47. package/corpus/core/docs/content/locales/ko-KR/getting-started.mdx +146 -212
  48. package/corpus/core/docs/content/locales/ko-KR/pure-agent-apps.mdx +8 -13
  49. package/corpus/core/docs/content/locales/ko-KR/template-chat.mdx +2 -2
  50. package/corpus/core/docs/content/locales/ko-KR/using-your-agent.mdx +2 -2
  51. package/corpus/core/docs/content/locales/pt-BR/cloneable-saas.mdx +3 -3
  52. package/corpus/core/docs/content/locales/pt-BR/faq.mdx +4 -4
  53. package/corpus/core/docs/content/locales/pt-BR/getting-started.mdx +145 -211
  54. package/corpus/core/docs/content/locales/pt-BR/pure-agent-apps.mdx +4 -9
  55. package/corpus/core/docs/content/locales/pt-BR/template-chat.mdx +2 -2
  56. package/corpus/core/docs/content/locales/pt-BR/using-your-agent.mdx +2 -2
  57. package/corpus/core/docs/content/locales/zh-CN/cloneable-saas.mdx +3 -3
  58. package/corpus/core/docs/content/locales/zh-CN/faq.mdx +4 -4
  59. package/corpus/core/docs/content/locales/zh-CN/getting-started.mdx +158 -209
  60. package/corpus/core/docs/content/locales/zh-CN/pure-agent-apps.mdx +4 -9
  61. package/corpus/core/docs/content/locales/zh-CN/template-chat.mdx +2 -2
  62. package/corpus/core/docs/content/locales/zh-CN/using-your-agent.mdx +2 -2
  63. package/corpus/core/docs/content/locales/zh-TW/cloneable-saas.mdx +3 -3
  64. package/corpus/core/docs/content/locales/zh-TW/faq.mdx +4 -4
  65. package/corpus/core/docs/content/locales/zh-TW/getting-started.mdx +158 -212
  66. package/corpus/core/docs/content/locales/zh-TW/pure-agent-apps.mdx +4 -9
  67. package/corpus/core/docs/content/locales/zh-TW/template-chat.mdx +2 -2
  68. package/corpus/core/docs/content/locales/zh-TW/using-your-agent.mdx +2 -2
  69. package/corpus/core/docs/content/native-chat-ui.mdx +17 -32
  70. package/corpus/core/docs/content/pure-agent-apps.mdx +46 -26
  71. package/corpus/core/docs/content/template-chat.mdx +8 -8
  72. package/corpus/core/docs/content/using-your-agent.mdx +2 -2
  73. package/corpus/core/docs/content/what-is-agent-native.mdx +6 -6
  74. package/corpus/core/package.json +1 -1
  75. package/corpus/core/src/cli/skills.ts +7 -9
  76. package/corpus/core/src/client/AssistantChat.tsx +27 -13
  77. package/corpus/core/src/client/MultiTabAssistantChat.tsx +2 -0
  78. package/corpus/core/src/client/RunStuckBanner.tsx +195 -21
  79. package/corpus/core/src/client/blocks/library/wireframe-kit.tsx +57 -9
  80. package/corpus/core/src/client/blocks/library/wireframe.tsx +3 -18
  81. package/corpus/core/src/client/chat/widgets/builtin-tool-renderers.tsx +28 -32
  82. package/corpus/core/src/client/use-run-stuck-detection.ts +14 -1
  83. package/corpus/core/src/db/schema.ts +5 -0
  84. package/corpus/core/src/server/agent-chat-plugin.ts +5 -2
  85. package/corpus/core/src/styles/blocks.css +27 -6
  86. package/corpus/templates/analytics/app/components/layout/Sidebar.tsx +1 -4
  87. package/corpus/templates/content/actions/list-trashed-content-databases.ts +1 -1
  88. package/corpus/templates/plan/.agents/skills/visual-plan/references/wireframe.md +7 -9
  89. package/corpus/templates/plan/.agents/skills/visual-recap/references/wireframe.md +7 -9
  90. package/dist/cli/skills.d.ts +1 -1
  91. package/dist/cli/skills.d.ts.map +1 -1
  92. package/dist/cli/skills.js +7 -9
  93. package/dist/cli/skills.js.map +1 -1
  94. package/dist/client/AssistantChat.d.ts +6 -0
  95. package/dist/client/AssistantChat.d.ts.map +1 -1
  96. package/dist/client/AssistantChat.js +19 -13
  97. package/dist/client/AssistantChat.js.map +1 -1
  98. package/dist/client/MultiTabAssistantChat.d.ts.map +1 -1
  99. package/dist/client/MultiTabAssistantChat.js +1 -1
  100. package/dist/client/MultiTabAssistantChat.js.map +1 -1
  101. package/dist/client/RunStuckBanner.d.ts +13 -1
  102. package/dist/client/RunStuckBanner.d.ts.map +1 -1
  103. package/dist/client/RunStuckBanner.js +138 -16
  104. package/dist/client/RunStuckBanner.js.map +1 -1
  105. package/dist/client/blocks/library/wireframe-kit.d.ts +6 -6
  106. package/dist/client/blocks/library/wireframe-kit.d.ts.map +1 -1
  107. package/dist/client/blocks/library/wireframe-kit.js +52 -5
  108. package/dist/client/blocks/library/wireframe-kit.js.map +1 -1
  109. package/dist/client/blocks/library/wireframe.d.ts.map +1 -1
  110. package/dist/client/blocks/library/wireframe.js +1 -11
  111. package/dist/client/blocks/library/wireframe.js.map +1 -1
  112. package/dist/client/chat/widgets/builtin-tool-renderers.d.ts.map +1 -1
  113. package/dist/client/chat/widgets/builtin-tool-renderers.js +27 -31
  114. package/dist/client/chat/widgets/builtin-tool-renderers.js.map +1 -1
  115. package/dist/client/use-run-stuck-detection.d.ts +4 -0
  116. package/dist/client/use-run-stuck-detection.d.ts.map +1 -1
  117. package/dist/client/use-run-stuck-detection.js +7 -1
  118. package/dist/client/use-run-stuck-detection.js.map +1 -1
  119. package/dist/collab/awareness.d.ts +2 -2
  120. package/dist/collab/awareness.d.ts.map +1 -1
  121. package/dist/collab/routes.d.ts +1 -1
  122. package/dist/db/schema.d.ts +2 -1
  123. package/dist/db/schema.d.ts.map +1 -1
  124. package/dist/db/schema.js +3 -2
  125. package/dist/db/schema.js.map +1 -1
  126. package/dist/notifications/routes.d.ts +3 -3
  127. package/dist/progress/routes.d.ts +1 -1
  128. package/dist/resources/handlers.d.ts +3 -3
  129. package/dist/server/agent-chat-plugin.d.ts.map +1 -1
  130. package/dist/server/agent-chat-plugin.js +3 -2
  131. package/dist/server/agent-chat-plugin.js.map +1 -1
  132. package/dist/server/transcribe-voice.d.ts +1 -1
  133. package/dist/styles/blocks.css +27 -6
  134. package/docs/content/actions.mdx +17 -24
  135. package/docs/content/agent-surfaces.mdx +59 -56
  136. package/docs/content/cloneable-saas.mdx +3 -3
  137. package/docs/content/faq.mdx +4 -4
  138. package/docs/content/getting-started.mdx +246 -204
  139. package/docs/content/key-concepts.mdx +9 -9
  140. package/docs/content/locales/ar-SA/cloneable-saas.mdx +3 -3
  141. package/docs/content/locales/ar-SA/faq.mdx +4 -4
  142. package/docs/content/locales/ar-SA/getting-started.mdx +148 -214
  143. package/docs/content/locales/ar-SA/pure-agent-apps.mdx +4 -9
  144. package/docs/content/locales/ar-SA/template-chat.mdx +2 -2
  145. package/docs/content/locales/ar-SA/using-your-agent.mdx +2 -2
  146. package/docs/content/locales/de-DE/cloneable-saas.mdx +3 -3
  147. package/docs/content/locales/de-DE/faq.mdx +4 -4
  148. package/docs/content/locales/de-DE/getting-started.mdx +145 -211
  149. package/docs/content/locales/de-DE/pure-agent-apps.mdx +4 -9
  150. package/docs/content/locales/de-DE/template-chat.mdx +2 -2
  151. package/docs/content/locales/de-DE/using-your-agent.mdx +2 -2
  152. package/docs/content/locales/es-ES/cloneable-saas.mdx +3 -3
  153. package/docs/content/locales/es-ES/faq.mdx +4 -4
  154. package/docs/content/locales/es-ES/getting-started.mdx +148 -214
  155. package/docs/content/locales/es-ES/pure-agent-apps.mdx +4 -9
  156. package/docs/content/locales/es-ES/template-chat.mdx +2 -2
  157. package/docs/content/locales/es-ES/using-your-agent.mdx +2 -2
  158. package/docs/content/locales/fr-FR/cloneable-saas.mdx +2 -2
  159. package/docs/content/locales/fr-FR/faq.mdx +4 -4
  160. package/docs/content/locales/fr-FR/getting-started.mdx +146 -212
  161. package/docs/content/locales/fr-FR/pure-agent-apps.mdx +4 -9
  162. package/docs/content/locales/fr-FR/template-chat.mdx +2 -2
  163. package/docs/content/locales/fr-FR/using-your-agent.mdx +2 -2
  164. package/docs/content/locales/hi-IN/cloneable-saas.mdx +3 -3
  165. package/docs/content/locales/hi-IN/faq.mdx +4 -4
  166. package/docs/content/locales/hi-IN/getting-started.mdx +149 -215
  167. package/docs/content/locales/hi-IN/pure-agent-apps.mdx +8 -13
  168. package/docs/content/locales/hi-IN/template-chat.mdx +2 -2
  169. package/docs/content/locales/hi-IN/using-your-agent.mdx +2 -2
  170. package/docs/content/locales/ja-JP/cloneable-saas.mdx +2 -2
  171. package/docs/content/locales/ja-JP/faq.mdx +4 -4
  172. package/docs/content/locales/ja-JP/getting-started.mdx +144 -210
  173. package/docs/content/locales/ja-JP/pure-agent-apps.mdx +8 -13
  174. package/docs/content/locales/ja-JP/template-chat.mdx +2 -2
  175. package/docs/content/locales/ja-JP/using-your-agent.mdx +2 -2
  176. package/docs/content/locales/ko-KR/cloneable-saas.mdx +3 -3
  177. package/docs/content/locales/ko-KR/faq.mdx +4 -4
  178. package/docs/content/locales/ko-KR/getting-started.mdx +146 -212
  179. package/docs/content/locales/ko-KR/pure-agent-apps.mdx +8 -13
  180. package/docs/content/locales/ko-KR/template-chat.mdx +2 -2
  181. package/docs/content/locales/ko-KR/using-your-agent.mdx +2 -2
  182. package/docs/content/locales/pt-BR/cloneable-saas.mdx +3 -3
  183. package/docs/content/locales/pt-BR/faq.mdx +4 -4
  184. package/docs/content/locales/pt-BR/getting-started.mdx +145 -211
  185. package/docs/content/locales/pt-BR/pure-agent-apps.mdx +4 -9
  186. package/docs/content/locales/pt-BR/template-chat.mdx +2 -2
  187. package/docs/content/locales/pt-BR/using-your-agent.mdx +2 -2
  188. package/docs/content/locales/zh-CN/cloneable-saas.mdx +3 -3
  189. package/docs/content/locales/zh-CN/faq.mdx +4 -4
  190. package/docs/content/locales/zh-CN/getting-started.mdx +158 -209
  191. package/docs/content/locales/zh-CN/pure-agent-apps.mdx +4 -9
  192. package/docs/content/locales/zh-CN/template-chat.mdx +2 -2
  193. package/docs/content/locales/zh-CN/using-your-agent.mdx +2 -2
  194. package/docs/content/locales/zh-TW/cloneable-saas.mdx +3 -3
  195. package/docs/content/locales/zh-TW/faq.mdx +4 -4
  196. package/docs/content/locales/zh-TW/getting-started.mdx +158 -212
  197. package/docs/content/locales/zh-TW/pure-agent-apps.mdx +4 -9
  198. package/docs/content/locales/zh-TW/template-chat.mdx +2 -2
  199. package/docs/content/locales/zh-TW/using-your-agent.mdx +2 -2
  200. package/docs/content/native-chat-ui.mdx +17 -32
  201. package/docs/content/pure-agent-apps.mdx +46 -26
  202. package/docs/content/template-chat.mdx +8 -8
  203. package/docs/content/using-your-agent.mdx +2 -2
  204. package/docs/content/what-is-agent-native.mdx +6 -6
  205. package/package.json +1 -1
@@ -1,259 +1,205 @@
1
1
  ---
2
- title: "開始使用"
3
- description: "建立代理應用,了解說明、skills actions,然後觀看代理呼叫其第一個操作。"
2
+ title: "入門"
3
+ description: "建立聊天優先的 agentic app,新增 action,內嵌渲染結構化結果,然後擴展成 agent 可以開啟的持久頁面。"
4
4
  ---
5
5
 
6
- # 開始使用
7
-
8
- Agent-Native 應用程式為 AI 代理和您的 UI 提供相同的 actions、資料和
9
- 狀態。基本代理是由指導它的指令(skills 進行教學)組成的
10
- 可重複的行為,以及讓它做實際工作的 actions。
11
-
12
- **想要一個完整的應用程式開始嗎?**克隆我們豐富的範本之一 -
13
- [Chat](/docs/template-chat), [Mail](/docs/template-mail),
14
- [Calendar](/docs/template-calendar), [Content](/docs/template-content),
15
- [Analytics](/docs/template-analytics) 和 [many more](/docs/cloneable-saas) —
16
- 每個都是您自訂的全功能應用程式。
17
-
18
- 從頭開始建置?唯一的選取是您是否想要 UI —
19
- 之後的一切(編寫指令、新增 skills、定義 actions、執行
20
- 代理)無論哪種方式都是相同的。
21
-
22
- <FileTree
23
- id="doc-block-15hdkha"
24
- title={"一個基礎 Agent-Native 代理"}
25
- entries={[
26
- {
27
- path: "AGENTS.md",
28
- note: "始終生效的指令:目的、規則、語氣以及代理能力地圖",
29
- },
30
- {
31
- path: ".agents/skills/customer-research/SKILL.md",
32
- note: "工作匹配時代理會載入的可複用 playbook",
33
- },
34
- {
35
- path: "actions/summarize-week.ts",
36
- note: "代理、UI、CLI、HTTP、MCP、A2A、jobs 和 webhooks 都能執行的型別化程式碼",
37
- },
38
- ]}
39
- />
40
-
41
- 無論您是從聊天 UI、無頭代理還是完整應用程式開始,都是如此。
42
- UI 改變表面;指令、skills 和 actions 為代理提供
43
- 指導和行為。
44
-
45
- ## 1。建立您的應用
46
-
47
- 您需要 [Node.js 22+](https://nodejs.org) 和 [pnpm](https://pnpm.io)。
48
-
49
- 在沒有標誌的情況下執行 `create`,它會詢問您要如何開始(完整的範本,
50
- 聊天,或無頭)先於其他:
6
+ # 入門
51
7
 
52
- ```bash
53
- npx @agent-native/core@latest create my-app
54
- ```
8
+ Agent-Native 用來建置 agentic applications:AI agent 和 UI 共享同一組
9
+ [actions](/docs/actions)、SQL 資料與 application state。預設路徑不是先做
10
+ headless agent,而是先有一個使用者能立即對話的 Chat app,然後逐步增加應用介面。
55
11
 
56
- 或者傳遞一個標誌來跳過提示:
12
+ 建議流程:
57
13
 
58
- **想要 UI?** 從聊天範本開始。您將獲得一名工作代理以及
59
- 可自訂的聊天 UI,您新增的每個操作都會自動顯示在其中:
14
+ 1. 建立 Chat app。
15
+ 2. 新增一個 action。
16
+ 3. 在聊天中用原生 inline UI 渲染 action 結果。
17
+ 4. 將資料持久化到 SQL。
18
+ 5. 新增一個頁面,讓 agent 在需要視覺化檢查時開啟。
60
19
 
61
- ```bash
62
- npx @agent-native/core@latest create my-app --template chat
63
- ```
20
+ ## 1. 建立 Chat app {#create-your-app}
64
21
 
65
- **只是無頭原語?**開始無頭 - 相同的 actions 和代理
66
- 迴圈,無 UI shell:
22
+ 需要 [Node.js 22+](https://nodejs.org) [pnpm](https://pnpm.io)。
67
23
 
68
24
  ```bash
69
- npx @agent-native/core@latest create my-agent --headless
25
+ npx @agent-native/core@latest create my-app --template chat
26
+ cd my-app
27
+ pnpm install
28
+ pnpm dev
70
29
  ```
71
30
 
72
- 然後從您建立的資料夾安裝:
31
+ 這個模板已包含 durable chat threads、auth、live sync、`actions/` 目錄、標準的 `view-screen` 與 `navigate` actions,以及可繼續擴充的 React app。
32
+
33
+ 若想使用完整模板選擇器,也可以執行:
73
34
 
74
35
  ```bash
75
- cd my-agent # my-app(如果您選取聊天範本)
76
- pnpm install
36
+ npx @agent-native/core@latest create my-app
77
37
  ```
78
38
 
79
- 從現在開始,兩者是相同的。
80
-
81
- ## 2。新增操作
82
-
83
- 操作是您的代理(以及您的 UI)可以呼叫的一項操作。兩個腳手架
84
- 附帶此範例:
85
-
86
- <AnnotatedCode
87
- id="doc-block-qfy4rq"
88
- title={"你的第一個 action"}
89
- filename="actions/hello.ts"
90
- language="ts"
91
- code={
92
- 'import { defineAction } from "@agent-native/core/action";\nimport { z } from "zod";\n\nexport default defineAction({\n description: "從本機代理問好。",\n schema: z.object({\n name: z.string().default("world"),\n }),\n http: { method: "GET" },\n readOnly: true,\n run: async ({ name }) => {\n return { message: `Hello, ${name}!` };\n },\n});'
93
- }
94
- annotations={[
95
- {
96
- lines: "5",
97
- label: "工具描述",
98
- note: "代理會讀取 `description`,判斷何時把它作為工具呼叫。",
99
- },
100
- {
101
- lines: "6-8",
102
- label: "型別化契約",
103
- note: "一個 zod `schema` 會校驗來自每個入口的輸入:代理、UI、HTTP、MCP 和 A2A。",
104
- },
105
- {
106
- lines: "9",
107
- label: "HTTP 動詞",
108
- note: "將此操作接入自動掛載的 HTTP 端點。",
109
- },
110
- {
111
- lines: "10",
112
- label: "唯讀",
113
- note: "`readOnly` 表示該操作無需核准即可安全呼叫,並且可作為查詢快取。",
114
- },
115
- {
116
- lines: "11-13",
117
- label: "單一實現",
118
- note: "`run` 主體是所有介面都會執行的唯一真實來源。",
119
- },
120
- ]}
121
- />
122
-
123
- 將 `hello` 替換為您域中的第一個實際操作。您定義一次;
124
- 每個表面都會吸收它。
125
-
126
- 使用 `AGENTS.md` 作為每回合都適用的指導。使用技能時
127
- 代理需要可重用的工作流程或域過程。在以下情況下使用操作
128
- 代理需要一種型別化、可測試的方式來讀取資料、寫入資料、呼叫 API 或
129
- 執行核准。
130
-
131
- ## 3。執行它
132
-
133
- 直接呼叫操作:
134
-
135
- ```bash
136
- pnpm action hello --name Steve
39
+ ## 2. 新增 action {#add-an-action}
40
+
41
+ Action 是 agent 與 UI 共同呼叫的一個 typed operation。可將入門範例換成 `actions/analyze-responses.ts`:它分析表單回覆並返回自訂聊天圖表的已驗證資料形狀。
42
+
43
+ <!-- prettier-ignore -->
44
+ ```ts
45
+ // actions/analyze-responses.ts
46
+ import { defineAction } from "@agent-native/core/action";
47
+ import { z } from "zod";
48
+
49
+ const responseChartResultSchema = z.object({
50
+ title: z.string(),
51
+ points: z.array(z.object({ day: z.string(), responses: z.number() })),
52
+ });
53
+
54
+ export default defineAction({
55
+ description: "Analyze recent form responses and render a custom chart.",
56
+ schema: z.object({
57
+ formId: z.string().default("demo")
58
+ }),
59
+ outputSchema: responseChartResultSchema,
60
+ chatUI: {
61
+ renderer: "responses.response-chart",
62
+ title: "回覆圖表"
63
+ },
64
+ readOnly: true,
65
+ run: async ({ formId }) => ({
66
+ title: `Responses for ${formId}`,
67
+ points: [{ day: "Mon", responses: 12 }, { day: "Tue", responses: 18 }, { day: "Wed", responses: 24 }, { day: "Thu", responses: 21 }],
68
+ }),
69
+ });
137
70
  ```
138
71
 
139
- 或請代理為您致電:
72
+ 直接執行:
140
73
 
141
74
  ```bash
142
- pnpm agent "Call the hello action for Steve and explain what happened."
75
+ pnpm action analyze-responses --formId demo
143
76
  ```
144
77
 
145
- 如果您從聊天範本開始,請執行該應用並在
146
- 瀏覽器 - 它已經可以呼叫您定義的每個操作:
78
+ 或在瀏覽器中詢問 agent:
147
79
 
148
- ```bash
149
- pnpm dev
150
- ```
80
+ > 分析示範表單的最新回覆。
151
81
 
152
- 現在可以透過聊天 UI、CLI、HTTP、MCP、A2A 存取該操作
153
- 計畫作業和 webhooks。定義一次,從任何地方呼叫。
154
-
155
- <Diagram id="doc-block-15mxp3c" title={"一個動作,每個表面"} summary={"單一 defineAction 檔案扇出到每個消費者,無需額外接線。"}>
156
-
157
- ```html
158
- <div class="diagram-fan">
159
- <div class="diagram-box" data-rough>defineAction</div>
160
- <div class="diagram-arrow diagram-muted" aria-hidden="true">&rarr;</div>
161
- <div class="diagram-surfaces">
162
- <span class="diagram-pill">聊天介面</span
163
- ><span class="diagram-pill">CLI</span><span class="diagram-pill">HTTP</span
164
- ><span class="diagram-pill">MCP</span><span class="diagram-pill">A2A</span
165
- ><span class="diagram-pill">計畫工作</span
166
- ><span class="diagram-pill">Webhooks</span>
167
- </div>
168
- </div>
169
- ```
82
+ ## 3. 內嵌渲染結果 {#render-inline}
170
83
 
171
- ```css
172
- .diagram-fan {
173
- display: flex;
174
- align-items: center;
175
- gap: 14px;
176
- flex-wrap: wrap;
177
- }
178
- .diagram-fan .diagram-surfaces {
179
- display: flex;
180
- flex-wrap: wrap;
181
- gap: 8px;
182
- max-width: 420px;
183
- }
184
- .diagram-fan .diagram-arrow {
185
- font-size: 22px;
186
- line-height: 1;
84
+ 因為 action 宣告了 `outputSchema` 與產品專屬的 `chatUI.renderer`,聊天紀錄不必把結構化資料壓成文字。然後在 app 啟動時為這個完全相同的 renderer id 註冊 React 元件,例如從 `app/root.tsx` 匯入一次 `app/chat-renderers.tsx`:
85
+
86
+ <!-- prettier-ignore -->
87
+ ```tsx
88
+ import { registerActionChatRenderer, type ToolRendererProps,} from "@agent-native/core/client/chat";
89
+
90
+ type ResponseChartResult = {
91
+ title: string;
92
+ points: Array<{ day: string; responses: number }>;
93
+ };
94
+
95
+ function ResponseChart({ context }: ToolRendererProps) {
96
+ const result = context.resultJson as ResponseChartResult;
97
+ const max = Math.max(...result.points.map((point) => point.responses), 1);
98
+ return (
99
+ <section className="rounded-lg border bg-card p-4">
100
+ <h3 className="text-sm font-medium">{result.title}</h3>
101
+ <div className="mt-4 flex h-32 items-end gap-2">
102
+ {result.points.map((point) => (
103
+ <div key={point.day} className="flex flex-1 flex-col items-center gap-2">
104
+ <div className="w-full rounded-t bg-primary" style={{ height: `${(point.responses / max) * 100}%` }} />
105
+ <span className="text-xs text-muted-foreground">{point.day}</span>
106
+ </div>
107
+ ))}
108
+ </div>
109
+ </section>
110
+ );
187
111
  }
112
+
113
+ registerActionChatRenderer({
114
+ id: "responses.response-chart",
115
+ renderer: "responses.response-chart",
116
+ Component: ResponseChart,
117
+ });
188
118
  ```
189
119
 
190
- </Diagram>
120
+ 對於可重用的通用輸出,framework 也提供內建 `data-chart` 與 `data-table` renderers,以及用於組合摘要/圖表/表格卡片的 `data-insights`。更多模式請見 [Native Chat UI](/docs/native-chat-ui)。
191
121
 
192
- ## 狀態是內建的
122
+ <WireframeBlock id="doc-block-inline-result-wireframe-zh-tw">
123
+ <Screen
124
+ surface="desktop"
125
+ html={
126
+ "<div style='min-height:340px;box-sizing:border-box;padding:24px;display:flex;justify-content:center;align-items:center;background:var(--wf-bg)'><div style='width:min(530px,100%);display:flex;flex-direction:column;gap:14px'><div class='wf-card' data-rough style='align-self:flex-end;max-width:70%;padding:12px 14px'><strong>User</strong><p style='margin:6px 0 0'>分析示範回覆。</p></div><div class='wf-card' data-rough style='align-self:flex-start;width:min(370px,100%);padding:14px'><strong>Agent</strong><p class='wf-muted' style='margin:6px 0 12px'>由 responses.response-chart 渲染。</p><section class='wf-card' data-rough style='padding:14px'><h3 style='margin:0 0 12px;font-size:14px'>回覆圖表</h3><div data-rough='line:bottom' style='height:104px;display:flex;align-items:end;gap:8px;border-bottom:1.4px solid var(--wf-line);padding-bottom:4px'><div style='flex:1;display:flex;flex-direction:column;align-items:center;gap:6px'><div data-rough style='height:38px;width:100%;background:color-mix(in srgb, var(--wf-accent) 24%, transparent);border:1.4px solid var(--wf-accent);border-radius:8px 8px 3px 3px'></div><span class='wf-muted'>週一</span></div><div style='flex:1;display:flex;flex-direction:column;align-items:center;gap:6px'><div data-rough style='height:62px;width:100%;background:color-mix(in srgb, var(--wf-accent) 30%, transparent);border:1.4px solid var(--wf-accent);border-radius:8px 8px 3px 3px'></div><span class='wf-muted'>週二</span></div><div style='flex:1;display:flex;flex-direction:column;align-items:center;gap:6px'><div data-rough style='height:86px;width:100%;background:color-mix(in srgb, var(--wf-accent) 36%, transparent);border:1.4px solid var(--wf-accent);border-radius:8px 8px 3px 3px'></div><span class='wf-muted'>週三</span></div><div style='flex:1;display:flex;flex-direction:column;align-items:center;gap:6px'><div data-rough style='height:54px;width:100%;background:color-mix(in srgb, var(--wf-accent) 42%, transparent);border:1.4px solid var(--wf-accent);border-radius:8px 8px 3px 3px'></div><span class='wf-muted'>週四</span></div></div></section></div></div></div>"
127
+ }
128
+ />
129
+ </WireframeBlock>
193
130
 
194
- 無頭並不意味著無狀態。 Actions,工作階段,應用程式狀態,對話串,
195
- 執行歷史紀錄和憑證均位於 SQL 中。本機地址為 SQLite
196
- `data/app.db`;在正式環境中您設定 `DATABASE_URL`。請參閱
197
- [Deployment](/docs/deployment).
131
+ ## 4. 持久化資料 {#persist-data}
198
132
 
199
- <Callout id="doc-block-18zpg29" tone="info">
133
+ 當結果需要回看、比較或更新時,將資料寫入 SQL。為 回覆洞察 新增 schema,並把讀寫都放在 actions 後面:
200
134
 
201
- **Headless 仍然是一個真正的應用程式。**應用程式代理迴圈在 SQL 中保留工作階段、對話串、執行、設定和憑證 - 它不是無狀態提示。您可以稍後新增 UI,而無需更改操作或狀態。
135
+ framework 的可移植 helpers 定義資料表,不要直接從 `drizzle-orm/sqlite-core` `drizzle-orm/pg-core` 匯入:
202
136
 
203
- </Callout>
137
+ ```ts
138
+ // server/db/schema.ts
139
+ import { integer, now, table, text } from "@agent-native/core/db/schema";
204
140
 
205
- ## 自訂 UI
141
+ export const responseInsights = table("response_insights", {
142
+ id: text("id").primaryKey(),
143
+ formId: text("form_id").notNull(),
144
+ title: text("title").notNull(),
145
+ summary: text("summary").notNull(),
146
+ responseCount: integer("response_count").notNull(),
147
+ createdAt: text("created_at").notNull().default(now()),
148
+ updatedAt: text("updated_at").notNull().default(now()),
149
+ });
150
+ ```
206
151
 
207
- 如果您從聊天範本開始,則可以編輯 UI。聊天本身
208
- 是基於 `<AgentChatSurface>` 元件建置的一條小路由:
152
+ 這些 helpers 會選擇目前設定的 SQL backend,因此同一份 schema 可以在本機 SQLite 上執行,也可以在 production 的 Postgres、Turso/libSQL、D1 或其他支援的 SQL provider 上執行。
209
153
 
210
- ```tsx
211
- // app/routes/_index.tsx
212
- import { AgentChatSurface } from "@agent-native/core/client";
154
+ - `create-response-insight` 寫入新的 insight。
155
+ - `list-response-insights` 為頁面讀取資料。
156
+ - `update-response-insight` agent 學到更多後更新記錄。
157
+ - `analyze-responses` 繼續返回聊天中的原生 widget。
213
158
 
214
- export default function ChatRoute() {
215
- return <AgentChatSurface mode="page" className="h-full" />;
216
- }
217
- ```
159
+ 不要為瀏覽器另外寫一條重複的 REST route;UI agent 應共享 actions。
160
+
161
+ ## 5. 新增 agent 可以開啟的頁面 {#add-a-page}
162
+
163
+ 新增 `/response-insights` route,用 `useActionQuery("list-response-insights")` 讀取資料,用 `useActionMutation("create-response-insight")` 觸發分析。這個頁面只是 SQL state 的投影;資料仍由同一組 actions 寫入。
218
164
 
219
- - **`app/routes/_index.tsx`** — 聊天頁面。更改建議,空
220
- 狀態和布局。
221
- - **`app/root.tsx`** — 應用程式外殼。在週圍新增您自己的路由和螢幕
222
- 代理。
223
- - 使用 `<AgentSidebar>` 將代理放入任何螢幕,從 a 手動操作它
224
- 使用 `sendToAgentChat()` 按鈕,或直接使用
225
- `useActionMutation()`.
165
+ <WireframeBlock id="doc-block-response-insights-page-wireframe-zh-tw">
166
+ <Screen
167
+ surface="desktop"
168
+ html={
169
+ "<main style='min-height:440px;box-sizing:border-box;padding:28px;background:var(--wf-bg)'><section style='max-width:960px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:16px;align-items:stretch'><section class='wf-card' data-rough style='display:flex;flex-direction:column;gap:16px'><header><h2 style='margin:0 0 4px;font-size:28px'>回覆洞察</h2><p class='wf-muted' style='margin:0'>Agent 從表單回覆建立的洞察。</p></header><button class='primary' data-rough style='align-self:flex-start'>分析示範表單</button><section style='display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px'><article class='wf-box' data-rough style='padding:12px'><strong>定價主題</strong><p class='wf-muted' style='margin:8px 0 0'>使用者想要團隊方案。</p></article><article class='wf-box' data-rough style='padding:12px'><strong>導入流程流失</strong><p class='wf-muted' style='margin:8px 0 0'>三個步驟需要更清楚的文案。</p></article></section><section class='wf-card' data-rough style='display:flex;flex-direction:column;gap:10px'><div class='wf-row wf-box' data-rough style='padding:10px 12px;gap:12px;justify-content:space-between'><strong>示範表單</strong><span class='wf-muted'>已分析 42 則回覆</span></div><div class='wf-row wf-box' data-rough style='padding:10px 12px;gap:12px;justify-content:space-between'><strong>下一步</strong><span class='wf-muted'>檢視兩個洞察草稿</span></div></section></section><aside class='wf-card' data-rough style='height:100%;box-sizing:border-box;display:flex;flex-direction:column;gap:12px'><strong>聊天</strong><div class='wf-box' data-rough style='align-self:flex-end;max-width:210px;padding:10px 12px'><span class='wf-muted'>你</span><p style='margin:4px 0 0'>開啟回覆洞察。</p></div><div class='wf-box' data-rough style='align-self:flex-start;max-width:210px;padding:10px 12px'><span class='wf-muted'>Agent</span><p style='margin:4px 0 0'>已開啟回覆洞察。</p></div></aside></section></main>"
170
+ }
171
+ />
172
+ </WireframeBlock>
226
173
 
227
- 請參閱 [Drop-in Agent](/docs/drop-in-agent) 了解完整的元件集,並且
228
- [Native 聊天介面](/docs/native-chat-ui) 將操作結果呈現為表格,
229
- 圖表和打字卡片而不是純文字。
174
+ 擴充 `view-screen` `navigate`:
230
175
 
231
- **開始無頭,稍後想要 UI?** 聊天範本*是* UI 入口 -
232
- 它的`app/`層(React Router + Vite)正是無頭腳手架
233
- 省略。最幹淨的舉動是從聊天開始(或重新搭建支架)
234
- 範本;您的 `actions/`、代理和 SQL 狀態保持不變。請參閱
235
- [Agent Surfaces](/docs/agent-surfaces) 代表其間的每個表面。
176
+ - `view-screen` 返回目前 route、選中的 insight 和頁面上下文。
177
+ - `navigate` 寫入 `/response-insights` 這類同源 path。
178
+ - action 結果可以包含 `href: "/response-insights"`,讓聊天顯示「開啟回覆洞察」按鈕。
236
179
 
237
- ## 專案結構
180
+ 當完整聊天頁開啟 app 頁面時,使用 [Agent Surfaces](/docs/agent-surfaces#rich-chat) 中的 `AgentChatSurface`、`AgentSidebar`、`useAgentChatHomeHandoff`、`useAgentChatHomeHandoffLinks` 和 `chatViewTransition`,讓聊天滑到側邊欄並保留同一個 thread。
181
+
182
+ ## 專案結構 {#project-structure}
238
183
 
239
184
  ```text
240
185
  my-app/
241
- actions/ # 代理可呼叫的操作
242
- app/ # React 前端(僅 UI 範本;無頭模式會省略)
243
- server/ # Nitro API 伺服器(路由、外掛)
244
- AGENTS.md # 始終生效的代理指令
245
- .agents/ # 代理可按需引入的技能
186
+ actions/ # Agent 和介面都可呼叫的操作
187
+ app/ # React 路由、頁面與聊天介面
188
+ server/ # Nitro 伺服器與 SQL 架構
189
+ AGENTS.md # 應用 Agent 的常駐指令
190
+ .agents/ # Agent 在相關情境載入的技能
246
191
  data/app.db # 未設定 DATABASE_URL 時的本機 SQLite 狀態
247
192
  ```
248
193
 
249
- ## 下一步去哪裡
250
-
251
- - **[Key Concepts](/docs/key-concepts)** 核心架構:SQL、actions
252
- 同步和脈絡感知。
253
- - **[Actions](/docs/actions)** — 完整操作 API:架構、HTTP、驗證和
254
- 核准。
255
- - **[Agent Surfaces](/docs/agent-surfaces)** — 無頭、聊天、嵌入式 sidecar,
256
- 和完整的應用程式。
257
- - **[Drop-in Agent](/docs/drop-in-agent)** — 將代理聊天新增到任何 React 應用程式。
258
- - **[Deployment](/docs/deployment)** — 將您的應用放在您自己的域中。
259
- - **[FAQ](/docs/faq)** — 設定和產品問題。
194
+ ## 想要完整的 Analytics 起點? {#analytics-starting-point}
195
+
196
+ 上面的 回覆洞察 範例刻意保持很小,方便你看清框架部件。如果你要建置真正的 analytics 產品,請從 [Analytics](/docs/template-analytics) 開始。它是更強健的起點:連接 providers,使用現有 dashboards 與 agent actions,然後繼續自訂。
197
+
198
+ ## 下一步 {#next}
199
+
200
+ - **[Actions](/docs/actions)** — schemas、auth、approvals、hooks 與 transport。
201
+ - **[Native Chat UI](/docs/native-chat-ui)** — 將 action 結果渲染成表格、圖表與 typed cards。
202
+ - **[Chat Template](/docs/template-chat)** — 最小聊天優先 app。
203
+ - **[Analytics Template](/docs/template-analytics)** — 強健的 analytics app 起點;連接 providers 後繼續自訂。
204
+ - **[Context Awareness](/docs/context-awareness)** — `view-screen`、`navigate`、route state 與選中物件。
205
+ - **[Agent Surfaces](/docs/agent-surfaces)** — chat、inline UI、app pages、embedded sidecars、automation 與外部 agent。
@@ -1,16 +1,11 @@
1
1
  ---
2
- title: "純代理應用"
3
- description: "代理是整個產品的應用程式:應用程式代理迴圈是前門,僅在人們需要時才新增 UI。"
2
+ title: "Automation-First Apps"
3
+ description: "用於 scheduled jobs、queues、scripts、integration workers 和外部 agents 的無瀏覽器 Agent-Native apps。"
4
4
  ---
5
5
 
6
- # 純代理應用
6
+ # Automation-First Apps
7
7
 
8
- 純代理應用程式是 Agent-Native 的最小端:應用程式代理迴圈是
9
- 產品,而不是儀表板。您從終端、Slack、電子郵件、
10
- 預定的工作、另一個代理或聊天 - “總結我未讀的電子郵件”、“發布
11
- 每日指標為 Slack” - 代理會在任何地方執行操作並返回結果
12
- 屬於。它仍然是一個真實的應用程式:actions、工作階段、應用程式狀態、歷史紀錄,
13
- 設定、憑證和共用紀錄均位於 SQL 中。
8
+ Automation-first app 是無瀏覽器的 Agent-Native app,用於 scheduled jobs、queues、scripts、integration workers 和外部 agents。它不是預設入門路徑,但在工作流程暫時不需要頁面時很有用。它仍然是一個真實的應用程式:actions、sessions、application state、run history、settings、credentials 和共享紀錄均位於 SQL 中。
14
9
 
15
10
  <Diagram id="doc-block-1yekfb" title={"應用程式代理迴圈是前門"} summary={"許多入口點透過 SQL-backed 操作和狀態到達一個代理迴圈;結果返回到請求來自的地方。僅當需要人類監督時才新增 UI。"}>
16
11
 
@@ -7,7 +7,7 @@ description: "一個最小的聊天優先 Agent-Native 應用程式:持久的
7
7
 
8
8
  聊天是基本的 Agent-Native 應用程式起點。它為您提供了一個幹淨的 ChatGPT 風格的 shell,聊天位於中心,對話串清單位於左側,標準應用程式導覽、驗證、即時同步、actions 和一個範例操作。當您想要一個無需提交域範本即可建置的真正的瀏覽器應用程式時,請從這裡開始。
9
9
 
10
- 如果您想要最小的僅操作執行時且沒有瀏覽器 UI,請從 [Pure-Agent Apps](/docs/pure-agent-apps) 開始。如果您想要成品域產品形狀,請從 [Calendar](/docs/template-calendar)、[Mail](/docs/template-mail)、[Content](/docs/template-content)、[Forms](/docs/template-forms)、[Analytics](/docs/template-analytics) 或其他域範本開始。
10
+ 如果您想要沒有瀏覽器 UI 的 automation-first runtime,請從 [Automation-First Apps](/docs/pure-agent-apps) 開始。如果您想要成品域產品形狀,請從 [Calendar](/docs/template-calendar)、[Mail](/docs/template-mail)、[Content](/docs/template-content)、[Forms](/docs/template-forms)、[Analytics](/docs/template-analytics) 或其他域範本開始。
11
11
 
12
12
  <WireframeBlock id="doc-block-osxhcg">
13
13
  <Screen
@@ -198,4 +198,4 @@ export default function ChatRoute() {
198
198
  - [**Agent Surfaces**](/docs/agent-surfaces) — 無頭、聊天、嵌入式和完整應用模式
199
199
  - [**Actions**](/docs/actions) - 操作系統聊天和 UI 都呼叫
200
200
  - [**Native 聊天介面**](/docs/native-chat-ui) — 聊天介面基元和執行時選項
201
- - [**Pure-Agent Apps**](/docs/pure-agent-apps) - 僅限操作的應用程式,稍後可以發展為聊天
201
+ - [**Automation-First Apps**](/docs/pure-agent-apps) - 沒有瀏覽器 UI 的自動化、佇列、腳本和外部 agent 工作流程
@@ -99,7 +99,7 @@ agent-native 背後的定義思想是,agent 和 UI 是**平等的伙伴** -
99
99
 
100
100
  並非每個應用程式都需要完整的儀表板。當代理*是*產品時,您可以跳過大部分自訂 UI:開啟應用程式,詢問您想要的內容,然後讓代理完成其餘的工作。代理仍然有其管理介面——歷史紀錄、工作區、設定——但主要互動是對話而不是點選。
101
101
 
102
- → [**Pure-Agent Apps**](/docs/pure-agent-apps) — 代理是整個產品的應用。
102
+ → [**Automation-First Apps**](/docs/pure-agent-apps) — 用於 jobs、queues、scripts 和外部 agents 的無瀏覽器應用。
103
103
 
104
104
  ## 您與它共同編輯 {#you-co-edit}
105
105
 
@@ -113,5 +113,5 @@ agent-native 背後的定義思想是,agent 和 UI 是**平等的伙伴** -
113
113
  - [**Agent Mentions**](/docs/agent-mentions) — 使用 `@` 提及來引導
114
114
  - [**Voice Input**](/docs/voice-input) — 透過說話進行指導
115
115
  - [**Drop-in Agent**](/docs/drop-in-agent) — 將其嵌入任何 React 應用
116
- - [**Pure-Agent Apps**](/docs/pure-agent-apps) — 當代理是產品時,采用 UI
116
+ - [**Automation-First Apps**](/docs/pure-agent-apps) — 用於 jobs、queues、scripts 和外部 agents 的無瀏覽器應用
117
117
  - [**Real-Time Collaboration**](/docs/real-time-collaboration) — 共同編輯同一檔案
@@ -45,7 +45,7 @@ Copilot, or Cursor should render an inline route from your app.
45
45
  <div class="diagram-card col">
46
46
  <div class="diagram-pill ok">DataTable</div>
47
47
  <div class="diagram-pill ok">DataChart</div>
48
- <div class="diagram-pill ok">DataInsights</div>
48
+ <div class="diagram-pill ok">Combined card</div>
49
49
  </div>
50
50
  </div>
51
51
  ```
@@ -90,9 +90,9 @@ matching payload:
90
90
 
91
91
  | Widget | Required payload | Renders as |
92
92
  | ----------------- | ---------------------------- | ----------------------------------------------- |
93
- | `"data-table"` | `table` | A native, reusable data table |
94
93
  | `"data-chart"` | `chartSeries` | A native bar, line, or area chart |
95
- | `"data-insights"` | `table` and/or `chartSeries` | A combined insight card with chart/table output |
94
+ | `"data-table"` | `table` | A native, reusable data table for SQL/list rows |
95
+ | `"data-insights"` | `table` and/or `chartSeries` | A combined insight card for summary dashboards |
96
96
 
97
97
  Server actions should import the server-safe helpers and schemas from
98
98
  `@agent-native/core/data-widgets`; client code can import the same types from
@@ -100,31 +100,22 @@ Server actions should import the server-safe helpers and schemas from
100
100
 
101
101
  ```ts
102
102
  import { defineAction } from "@agent-native/core/action";
103
- import { ACTION_CHAT_UI_DATA_INSIGHTS_RENDERER } from "@agent-native/core/action-ui";
103
+ import { ACTION_CHAT_UI_DATA_CHART_RENDERER } from "@agent-native/core/action-ui";
104
104
  import {
105
- createDataInsightsWidgetResult,
106
- dataInsightsWidgetResultSchema,
105
+ createDataChartWidgetResult,
106
+ dataChartWidgetResultSchema,
107
107
  } from "@agent-native/core/data-widgets";
108
108
 
109
109
  export default defineAction({
110
- description: "Analyze form responses.",
110
+ description: "Chart form responses.",
111
111
  readOnly: true,
112
- outputSchema: dataInsightsWidgetResultSchema,
112
+ outputSchema: dataChartWidgetResultSchema,
113
113
  chatUI: {
114
- renderer: ACTION_CHAT_UI_DATA_INSIGHTS_RENDERER,
115
- title: "Response insights",
114
+ renderer: ACTION_CHAT_UI_DATA_CHART_RENDERER,
115
+ title: "Response chart",
116
116
  },
117
117
  run: async () =>
118
- createDataInsightsWidgetResult({
119
- title: "Response insights",
120
- display: {
121
- title: "42 responses",
122
- description: "Completion rate rose this week.",
123
- primaryAction: {
124
- label: "Open response insights",
125
- href: "/response-insights",
126
- },
127
- },
118
+ createDataChartWidgetResult({
128
119
  chartSeries: {
129
120
  type: "bar",
130
121
  title: "Responses by day",
@@ -135,22 +126,16 @@ export default defineAction({
135
126
  { day: "Tue", responses: 13 },
136
127
  ],
137
128
  },
138
- table: {
139
- title: "Top answers",
140
- columns: [
141
- { key: "answer", label: "Answer" },
142
- { key: "count", label: "Count", align: "right" },
143
- ],
144
- rows: [
145
- { answer: "Yes", count: 31 },
146
- { answer: "No", count: 11 },
147
- ],
148
- totalRows: 2,
149
- },
150
129
  }),
151
130
  });
152
131
  ```
153
132
 
133
+ Use the same pattern with `ACTION_CHAT_UI_DATA_TABLE_RENDERER`,
134
+ `createDataTableWidgetResult`, and `dataTableWidgetResultSchema` when an action
135
+ returns SQL or list rows. Use `ACTION_CHAT_UI_DATA_INSIGHTS_RENDERER` and
136
+ `createDataInsightsWidgetResult` for a deliberate combined summary card that may
137
+ include scalar `summary` values, a chart, a table, and `display.primaryAction`.
138
+
154
139
  <Callout id="doc-block-1f4si4a" tone="success">
155
140
 
156
141
  The renderer only takes over when the action declares `chatUI` **or** the result carries an explicit known `widget` discriminant. It never shape-infers arbitrary objects and never executes HTML or JavaScript from tool results — so a native widget can't become an injection vector.