Box Kite

io.github.box-kite由 GitHub 帳號 box-kite 發布v2.4.0更新於 Nov 7, 2026

Box Kite's React styling engine as tools: props, components, and whether a value writes CSS.

發布方自己的服務：Kite

已驗證STDIO僅桌面知識與記憶開發者工具

服務詳細資訊

識別碼: io.github.box-kite/mcp
傳輸: STDIO
執行環境: Desktop only
信任: Verified
發布於: Oct 13, 2026

安全提示

MCP 服務會接收對話中的工具呼叫請求，並可能執行外部操作。啟用前請先了解該服務能做什麼，並只授予它所需的權限。

註冊中心已驗證此條目所屬的 GitHub 帳號 box-kite。這並不表明該帳號就是產品方。

SourceWeft 的檢查只涵蓋條目是否完整、端點是否回應；不審查伺服器的程式碼，也不審查其工具的行為。

在 README 中新增徽章

向讀者展示該 MCP 服務已收錄於 SourceWeft，徽章連結到本頁。

[![Listed on SourceWeft](https://sourceweft.com/badge/mcp/io.github.box-kite%2Fmcp.svg)](https://sourceweft.com/mcp/io.github.box-kite%2Fmcp?utm_source=readme&utm_medium=badge)

概覽

AI 產生的概覽

本機 MCP 伺服器，為助理提供 Box Kite React 樣式知識，並用真實引擎驗證某個樣式值是否真的會產生 CSS。

可以做什麼: 依建置目標檢索對應的 prop、元件、巢狀鍵或規則文件
查詢樣式 prop 的完整記錄：產生的 CSS、可接受的值、實測的數值刻度
查詢元件的契約：props 與預設值、子部件、鍵盤對應、ARIA
把一組 props 交給真實引擎，查看每個 prop 產生的 CSS 或未產生的原因
以索引或全文方式讀取該函式庫的撰寫規則
取得 shadcn 安裝的整段區塊，例如資料表格頁、設定表單、儀表板外殼
適用情境: 適合在助理撰寫或審查 Box Kite React 程式碼時使用，於渲染前確認哪些 props 與取值有效；正式建置中無效取值不會產生任何 CSS，也不會報錯。
執行需求: 透過 npx 從 npm 套件 @box-kite/mcp 以 stdio 在本機執行，需要 Node 22 或更新版本。不需 API 金鑰、網路存取或狀態，所有答案都來自所安裝的函式庫版本。

安裝前請注意

不涉及憑證或網路。答案僅反映所安裝的函式庫版本，與其他 Box Kite 版本可能不同；此伺服器為唯讀，不會修改程式碼。

安裝

在 SourceWeft 中

開啟儀表板中的 Box Kite，將其新增到工作區。
為需要使用其工具的對話啟用該服務。

Desktop only，透過 STDIO。 STDIO 服務會啟動本機處理程序，因此需要 SourceWeft 桌面主機。

其他 MCP 客戶端

參照儲存庫中的啟動說明。

README

@box-kite/mcp

The Box Kite MCP server: the retrieval channel for an agent writing Box Kite code. Six tools, at capability level — what may I write, what does this component take, and the one no documentation mirror can answer: does this value actually work.

No key, no network, no state. Everything it answers with was built into it from the library's own repository at the version you install, including the styling engine itself. Node 22 or newer.

Install

Claude Code

Cursor, VS Code, Codex, Zed — anything that speaks stdio:

The tools

tool	what it answers
`search_docs`	The prop, component, nesting key or rule for what you are trying to build — ranked across all four, so a goal finds the answer without its name.
`get_props`	A style prop's whole record: the CSS it writes, every value it accepts, a measured example, and for a numeric prop its scale measured at 1/2/4/8.
`get_component`	One component's contract: props and defaults, sub-parts, the keyboard map and the ARIA it writes.
`check_styles`	A prop bag through the real engine: the CSS each prop writes, or why it wrote none.
`get_rules`	The rules the library is written by, as an index or in full.
`get_blocks`	Whole sections the `shadcn` CLI installs — a data-grid page, a settings form, a dashboard shell.

Why `check_styles` exists

Box Kite accepts a closed set of values per prop, and a value it does not accept produces no rule and no class name, by design, because a typo must not emit a broken declaration. A development build warns in the console once the page renders; a production one says nothing at all. The way to answer "does bgColor="blue-550" work" before anything renders is to hand it to the engine:

check_styles { "props": { "p": 4, "bgColor": "blue-550", "fontSize": 14, "lineHeight": 1.5, "href": "/about" } }
✅ `p` → `.p-4{padding:1rem}`❌ `bgColor` does not accept "blue-550" — no rule and no class name were written.✅ `fontSize` → `.fontSize-14{font-size:0.875rem}`⚠️ `lineHeight` → `.lineHeight-1\.5{line-height:1.5px}` — lineHeight={1.5} is a 1.5px line: lineHeight is direct pixels, …⚠️ `href` an HTML attribute, not a style prop. It goes in `props={{ "href": … }}`.

check_styles { "props": { "p": 4, "bgColor": "blue-550", "fontSize": 14, "lineHeight": 1.5, "href": "/about" } }
✅ `p` → `.p-4{padding:1rem}`❌ `bgColor` does not accept "blue-550" — no rule and no class name were written.✅ `fontSize` → `.fontSize-14{font-size:0.875rem}`⚠️ `lineHeight` → `.lineHeight-1\.5{line-height:1.5px}` — lineHeight={1.5} is a 1.5px line: lineHeight is direct pixels, …⚠️ `href` an HTML attribute, not a style prop. It goes in `props={{ "href": … }}`.

The dividers differ per prop — spacing is ÷4, fontSize is ÷16, border width is direct px — which is why get_props measures a scale rather than describing one.

What else the library ships for agents

AGENTS.md and docs/ inside the published @box-kite/react package
The skill and rules file: npx skills add box-kite/box-kite
Every documentation page as markdown at https://www.box-kite.dev/<route>.md, indexed by llms.txt

MIT © Box Kite

來源：mcp/README.md，提交 d901f9d