BoardUI/boardui

解決的問題

BoardUI 提供一個專為建構 AI 代理介面而量身打造的 React 設計系統。它彌合了標準儀表板元件（如表格和圖表）與 AI 特有的 UI 元件（如思考指示器和代理日誌）之間的差距，為 AI 產品提供統一的視覺語言。

如何運作

與傳統元件庫作為相依性安裝不同，BoardUI 將元件以原始碼形式提供，透過 CLI（npx boardui add）直接複製到專案中。它基於 React Aria Components 與 Tailwind CSS v4 建構，確保可存取性且無執行時 CSS。同時也包含一個 MCP 伺服器，讓 AI 程式碼代理（如 Claude Code 或 Cursor）能瀏覽目錄並自動安裝元件。

適用對象

需要專業、可存取且可自訂的設計系統，專為代理工作流程與 AI 儀表板設計的前端開發人員與 AI 產品建構者。

主要特色

• 代理原生元件：包含 Agent Chat、Agent Log 與 Agent Thinking 指示器等專用模組。
• 原始碼分發：元件以原始碼形式加入，讓開發者完全掌控與自訂。
• AI 代理整合：提供 MCP 伺服器與特定代理規則（AGENTS.md），協助 AI 程式碼工具使用此系統開發。
• 廣泛提供者支援：包含支援多個提供者（包括 OpenAI、Anthropic、Google、OpenRouter、Groq 與 xAI）的串流聊天執行時。
• 完整的元件庫：提供超過 60 個免費元件，涵蓋從基礎建構模組到複雜應用模組的各類元件。