smarthr-ui-mcp-server

kgsi/smarthr-ui-mcp-server

3.2

If you are the rightful owner of smarthr-ui-mcp-server and would like to certify it and/or have it hosted online, please leave a comment on the right or send an email to henry@mcphub.com.

The SmartHR UI MCP Server provides a Model Context Protocol server for SmartHR UI components, enabling AI tools and Claude Code to access component information and generate code.

Tools
4
Resources
0
Prompts
0

SmartHR UI MCP Server

  • SmartHR UIコンポーネント用のModel Context Protocol (MCP) サーバーです。AIツールやClaude CodeがSmartHR UIコンポーネントの情報とコード生成機能に直接アクセスできるようになります。
  • このサーバーは個人で作成したものです。利用については自己責任でお願いします。

機能

  • コンポーネント発見: SmartHR UIの全コンポーネントを自動的に発見・一覧表示
  • コンポーネント検索: 名前、カテゴリ、説明によるコンポーネント検索
  • コード生成: 指定されたpropsでコンポーネントの使用コードを生成
  • カテゴリフィルタリング: カテゴリ別(Button、Form、Layoutなど)でのコンポーネント閲覧

インストール

# 依存パッケージをインストール
npm install

# サーバーをビルド
 npm run build

# MCPサーバーを起動
npm run start

使用方法

  • MCPクライアントでこのサーバーを使用するように設定してください。
  • {username}を実際のMCPサーバーのパスに置き換えてください。

Cursor

{
  "mcpServers": {
    "smarthr-ui-mcp": {
      "command": "node",
      "args": ["/Users/{username}/smarthr-ui-mcp/lib/index.js"],
      "cwd": "/Users/{username}/smarthr-ui-mcp"
    }
  }
}

Claude Code

claude mcp add smarthr-ui-mcp -s local -- node /Users/{username}/works/smarthr-ui-mcp-server/lib/index.js

Codex

[mcp_servers.smarthr-ui-mcp]
args = ["/Users/{username}/works/smarthr-ui-mcp-server/lib/index.js"]
command = "node"

MCPリソース

  • smarthr-ui://components - SmartHR UIの全コンポーネント一覧
  • smarthr-ui://components/{name} - 特定のコンポーネントの詳細情報

MCPツール

search_components

名前、カテゴリ、説明によるコンポーネント検索

get_component

特定のコンポーネントの詳細情報を取得

list_components_by_category

特定のカテゴリの全コンポーネントを一覧表示

generate_component_code

指定されたpropsでコンポーネントの使用コードを生成

コンポーネントカテゴリ

  • Button: ボタンコンポーネントと関連するアクション
  • Form: フォームコントロールとバリデーション
  • Layout: レイアウトとスペーシングコンポーネント
  • Navigation: ナビゲーションとルーティングコンポーネント
  • Display: テキスト、バッジ、コンテンツ表示
  • Feedback: 通知、ツールチップ、ユーザーフィードバック
  • Dialog: モーダルとダイアログコンポーネント
  • Table: データテーブルコンポーネント
  • Input: 入力フィールドとフォーム要素
  • Experimental: ベータ版と実験的コンポーネント

アーキテクチャ

src/
├── index.ts              # MCPサーバーのエントリーポイント
├── handlers/
│   └── components.ts     # コンポーネント関連のハンドラー
├── types/
│   └── index.ts         # TypeScript型定義
└── utils/
    └── componentDiscovery.ts  # コンポーネント発見ロジック