Shadcn Registry Manager

🚀 shadcn registry manager - MCP Server

このプロジェクトは、shadcn/ui コンポーネントレジストリとCLI用の MCP (Model Context Protocol) サーバー を提供します。通常はローカルで実行するshadcn CLIコマンド（init、add など）をリモート、プログラム、またはコンテナ化して実行できるようにし、自動化、統合、またはクラウド/開発環境での実行を容易にします。MCPサーバーは、ローカルとリモートの両方のshadcnレジストリに接続でき、AIまたはCLIエージェントを介してプロジェクト管理タスクを自動化するための安全で拡張可能な技術インターフェイスを提供します。

✨ 主な機能

このMCPサーバーは、shadcn CLI操作をMCPツールとして公開するため、あなた（またはAIエージェント）は以下のことができます。

• プロジェクトを初期化する
• shadcnレジストリからコンポーネントを追加する（ブロックコンポーネントを含む）
• レジストリアイテムをリストして取得する
• すべてのshadcn CLIワークフローをリモートで実行する
• 公式のshadcnレジストリ - https://ui.shadcn.com/r と カスタム/セルフホストレジストリ の両方をサポートします。このガイドに従ってください：https://ui.shadcn.com/docs/blocks

📦 インストール

Docker

コンテナ内でMCPサーバーを実行し、プロジェクトディレクトリをマウントします。

mcp.json ファイルに以下を追加します。

   "shadcn-registry-manager": {
      "command": "docker",
      "args": [
        "run",
        "--rm",
        "-i",
        "--mount",
        "type=bind,src=<your-project-path>,dst=/workspace",
        "-e", 
        "REGISTRY_URL=https://ui.shadcn.com/r",
        "-e", 
        "STYLE=new-york",
        "reuvenaor/shadcn-registry-manager"
      ],
    },

Dockerマウントの説明:

• <your-project-path> - プロジェクトディレクトリへのパスです。

  例: /Library/Projects/shadcn-registry-manager/www

• /workspace - コンテナ内のワークスペースディレクトリへのパスです。 （変更しないでください。変更した場合は、すべてのツール呼び出しで cwd パラメータとして同じパスを渡さなければなりません）

Docker環境変数:

• REGISTRY_URL
  • オプション1: https://ui.shadcn.com/r - shadcnレジストリのURL
  • オプション2: http://localhost:3000>/r - 独自のレジストリサーバーのURL（このガイドに従ってください: https://ui.shadcn.com/docs/blocks）
• STYLE - shadcnレジストリのスタイル - new-york

npx

npxを使用してMCPサーバーを実行することもできます。これは、ローカル開発やCI/CDパイプラインに便利です。

mcp.json ファイルに以下を追加します。

  "shadcn-registry-manager": {
    "command": "npx",
    "args": [
      "@reuvenorg/shadcn-registry-manager"
    ],
    "env": {
      "REGISTRY_URL": "https://ui.shadcn.com/r",
      "WORKSPACE_DIR": "/Library/Projects/mcp-docker/www",
      "STYLE": "new-york"
    }
  }

Claude

ClaudeでMCPサーバーを使用することもできます。以下は設定オプションです。

Claude CLIコマンド:

claude mcp add --scope project shadcn-registry-manager npx @reuvenorg/shadcn-registry-manager -e REGISTRY_URL=https://ui.shadcn.com/r -e WORKSPACE_DIR=/Library/Projects/resume -e STYLE=new-york

Claude .mcp.json設定:

{
  "shadcn-registry-manager": {
    "type": "stdio",
    "command": "npx",
    "args": [
      "@reuvenorg/shadcn-registry-manager"
    ],
    "env": {
      "REGISTRY_URL": "https://ui.shadcn.com/r",
      "WORKSPACE_DIR": "/Library/Projects/resume",
      "STYLE": "new-york"
    }
  }
}

npx環境変数:

• WORKSPACE_DIR - プロジェクトディレクトリへのパス（ワークスペースとしてマウントされます）
• REGISTRY_URL
  • オプション1: https://ui.shadcn.com/r - shadcnレジストリのURL
  • オプション2: http://localhost:3000/r - 独自のレジストリサーバーのURL（このガイドに従ってください: https://ui.shadcn.com/docs/blocks）
• STYLE - shadcnレジストリのスタイル - new-york

💻 使用例

基本的な使用法

use the tool `get_blocks` to get the blocks from the registry

use the tool `add_item` - dashboard-01 to your project

利用可能なMCPツールの例

• get_init_instructions: プロジェクトの初期化手順を取得する
• execute_init: プロジェクトの完全な初期化を実行する
• get_items: 利用可能なレジストリアイテムをリストする
• get_item: 特定のレジストリアイテムを取得する
• add_item: レジストリアイテムをプロジェクトに追加する
• execute_add: 複数のコンポーネントをプロジェクトに追加する
• get_blocks: レジストリから現在のブロックを取得する

🔗 ソース

• shadcn/ui
• Model Context Protocol

❤️ by Reuven Naor

📄 ライセンス

MITライセンス。詳細は LICENSE を参照してください。