pudge-ui

@pudge-ui/mcp-server

pudge-ui デザインシステム用の MCP サーバーです。コーディングエージェントがコンポーネント仕様をプログラムから照会できます。

インストール

MCP クライアントの設定に追加します（例：Claude Desktop、Claude Code）。

{
  "mcpServers": {
    "pudge-ui": {
      "command": "npx",
      "args": ["-y", "@pudge-ui/mcp-server"]
    }
  }
}

ローカル開発の場合：

{
  "mcpServers": {
    "pudge-ui": {
      "command": "npx",
      "args": ["tsx", "src/index.ts"],
      "cwd": "/path/to/pudge-ui/packages/mcp-server"
    }
  }
}

利用可能なツール

ツール	説明
list_components	すべてのコンポーネントを一覧表示します。カテゴリでの絞り込みも可能です
search_components	名前、説明、タグからコンポーネントをあいまい検索します
get_foundation	基盤仕様のドキュメント（コア 5 件または拡張 9 件）を取得します
get_component	単一のコンポーネントの仕様全体（基盤 + 仕様）を取得します
get_components	複数のコンポーネントの仕様を取得します（基盤は 1 回のみ含まれます）
get_composition	参照されているすべてのコンポーネントの仕様を含む、コンポジション仕様を取得します

使用例

list_components({ category: "buttons" })
search_components({ query: "volume slider audio" })
get_component({ name: "push-button" })
get_components({ names: ["rotary-encoder", "vu-meter", "vertical-fader"] })
get_composition({ name: "audio-mixer-strip" })
get_foundation({ extended: true })

すべてのツールは読み取り専用（readOnlyHint で注釈されています）です。このサーバーがファイルシステムに書き込んだり、ネットワーク呼び出しを行ったりすることはありません。仕様はパッケージにバンドルされています。

開発

npm install
npm run dev        # run with tsx
npm run build      # compile + copy spec
npm run typecheck  # type-check only
npm test           # run the test suite

バージョン管理と安定性

このサーバーは pudge-ui のバージョン管理に準拠しており、バージョン 1.0 より前です。コンポーネントカタログはリリースごとに拡充されますが、ツールの名前と入力形式は安定しています。ツールのシグネチャを変更する場合は、マイナーまたはメジャーのバージョンを上げ、CHANGELOG に記載します。バイト単位で完全に再現できることが必要な場合は、バージョンを固定してください。