@smarthr/design-system-mcp-server

SmartHR Design System MCP サーバー

このプロジェクトは、SmartHR Design System の情報を提供するための Model Context Protocol（MCP）サーバーです。

概要

主に SmartHR Design System のコンポーネント情報にアクセスするためのインターフェースを提供します。MCP クライアントが SmartHR のデザインシステムに関する情報を取得し、適切なコンポーネントの使い方を促します。

機能

1. getComponentsMeta
   すべてのコンポーネントのメタ情報を取得します。

2. getComponentDetails
   特定コンポーネントの詳細情報を取得します。

3. getScreenImplementationInstruction
   画面実装プロセスの各ステップで実行すべき手順を返します。

使い方

GitHub の Personal access tokens でトークンを生成し、以下のように設定してください。

{
  "mcpServers": {
    "SmartHR Design System MCP": {
      "command": "npx",
      "args": ["-y", "@smarthr/design-system-mcp-server"],
      "env": {
        "GITHUB_TOKEN": "<YOUR_PERSONAL_ACCESS_TOKEN>"
      }
    }
  }
}

Figma を読み込んで実装したい場合

Figma データの取得には対応していません。Framelink Figma MCP サーバー などを合わせて使ってください。

また、実装時に「画面実装指示（getScreenImplementationInstruction）」を使うと実装精度が上がる可能性があります。

プロンプトで「画面の実装指示に従って実装してください。」などと伝えると機能します。