assistant-ui/tool-ui

解決的問題

大多數 AI 聊天介面會以原始 JSON 顯示工具呼叫，這對使用者來說難以閱讀和互動。Tool UI 提供了一組 React 組件，可將這些原始工具資料轉換為直覺且可互動的視覺元素，例如圖表、表單和地圖。

如何運作

採用類似 shadcn/ui 的方式，這些組件設計為可直接複製貼上至專案程式碼庫中，而非作為依賴項安裝。每個組件都搭配一個 Zod 模式來驗證工具輸出；只有當資料有效時才會渲染 UI，確保應用程式能安全失敗。

適用對象

希望為工具呼叫模型提供更精緻、可互動體驗，又不被鎖定於特定設計系統的開發者。

主要特色

• 複製貼上架構：組件位於您的程式碼庫中，避免依賴項鎖定。
• 模式驗證：使用 Zod 模式確保工具輸出能正確解析與渲染。
• 互動收據：使用者在組件中所做的選擇會回傳給助理，並以收據形式持續保留。
• 基於 shadcn/ui：利用 Radix 原語和 Tailwind CSS，方便樣式設定與主題整合。
• 豐富的組件庫：包含進度追蹤器、資料表格、地理地圖以及社群媒體貼文預覽等各種元件。

這是一個真正能讓 AI 工具呼叫變得直覺且可互動的解決方案 — @jxnblk