@smarthr/design-system-mcp-server

SmartHR Design System MCP サーバー

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

概要

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

機能

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

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

• 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）」を使うと実装精度が上がる可能性があります。

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