@monoharada/wcf-mcp 0.1.1 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +57 -11
- package/core.mjs +765 -70
- package/data/custom-elements.json +18 -0
- package/data/design-tokens.json +1 -1
- package/data/guidelines-index.json +1 -1
- package/package.json +1 -1
- package/validator.mjs +174 -5
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @
|
|
1
|
+
# @monoharada/wcf-mcp
|
|
2
2
|
|
|
3
3
|
web-components-factory デザインシステム用の MCP (Model Context Protocol) サーバー。
|
|
4
4
|
|
|
@@ -9,7 +9,7 @@ web-components-factory デザインシステム用の MCP (Model Context Protoco
|
|
|
9
9
|
### npx で起動(クローン不要)
|
|
10
10
|
|
|
11
11
|
```bash
|
|
12
|
-
npx @
|
|
12
|
+
npx @monoharada/wcf-mcp
|
|
13
13
|
```
|
|
14
14
|
|
|
15
15
|
### Claude Desktop で使う
|
|
@@ -21,7 +21,7 @@ npx @anthropic/wcf-mcp
|
|
|
21
21
|
"mcpServers": {
|
|
22
22
|
"wcf": {
|
|
23
23
|
"command": "npx",
|
|
24
|
-
"args": ["@
|
|
24
|
+
"args": ["@monoharada/wcf-mcp"]
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
}
|
|
@@ -30,23 +30,39 @@ npx @anthropic/wcf-mcp
|
|
|
30
30
|
### Claude Code で使う
|
|
31
31
|
|
|
32
32
|
```bash
|
|
33
|
-
claude mcp add wcf -- npx @
|
|
33
|
+
claude mcp add wcf -- npx @monoharada/wcf-mcp
|
|
34
34
|
```
|
|
35
35
|
|
|
36
|
-
|
|
36
|
+
### Cursor で使う
|
|
37
|
+
|
|
38
|
+
`.cursor/mcp.json` に追加:
|
|
39
|
+
|
|
40
|
+
```json
|
|
41
|
+
{
|
|
42
|
+
"mcpServers": {
|
|
43
|
+
"wcf": {
|
|
44
|
+
"command": "npx",
|
|
45
|
+
"args": ["@monoharada/wcf-mcp"]
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
```
|
|
50
|
+
|
|
51
|
+
## 提供ツール(13個)
|
|
37
52
|
|
|
38
53
|
### ガードレール
|
|
39
54
|
|
|
40
55
|
| ツール | 説明 |
|
|
41
56
|
|--------|------|
|
|
42
|
-
| `get_design_system_overview` |
|
|
57
|
+
| `get_design_system_overview` | 最初に呼ぶ前提情報(カテゴリ別コンポーネント数、利用可能パターン、推奨ワークフロー、IDE設定テンプレート)を返す |
|
|
43
58
|
|
|
44
59
|
### コンポーネント検索・API
|
|
45
60
|
|
|
46
61
|
| ツール | 説明 |
|
|
47
62
|
|--------|------|
|
|
48
|
-
| `list_components` |
|
|
49
|
-
| `
|
|
63
|
+
| `list_components` | カテゴリ/クエリ/limit/offset でコンポーネントを段階的に取得(互換維持のため limit 未指定時は全件) |
|
|
64
|
+
| `search_icons` | アイコン名をキーワード検索し、usage example を返す |
|
|
65
|
+
| `get_component_api` | tagName or className で属性・スロット・イベント・CSS Parts・CSS Custom Properties を取得(`relatedComponents` を含む) |
|
|
50
66
|
| `generate_usage_snippet` | コンポーネントの最小限 HTML スニペットを生成 |
|
|
51
67
|
| `get_install_recipe` | componentId・依存関係・define関数・インストールコマンドを取得 |
|
|
52
68
|
|
|
@@ -54,7 +70,7 @@ claude mcp add wcf -- npx @anthropic/wcf-mcp
|
|
|
54
70
|
|
|
55
71
|
| ツール | 説明 |
|
|
56
72
|
|--------|------|
|
|
57
|
-
| `validate_markup` | HTML
|
|
73
|
+
| `validate_markup` | HTML スニペットを検証し、未知要素(error)・未知属性(warning)・禁止属性/トークン誤用/`aria-live`・`role="alert"` の誤用(warning)を検出し、可能な場合は `suggestion` を返す |
|
|
58
74
|
|
|
59
75
|
### UI パターン
|
|
60
76
|
|
|
@@ -69,6 +85,7 @@ claude mcp add wcf -- npx @anthropic/wcf-mcp
|
|
|
69
85
|
| ツール | 説明 |
|
|
70
86
|
|--------|------|
|
|
71
87
|
| `get_design_tokens` | デザイントークンを type/category/query で検索 |
|
|
88
|
+
| `get_accessibility_docs` | component/topic/wcagLevel で A11y チェックリストとガイドライン要点を検索(`topic=all` では両ソースを混在返却) |
|
|
72
89
|
| `search_guidelines` | ガイドライン(topic/query)をスコア付きで検索 |
|
|
73
90
|
|
|
74
91
|
## transport
|
|
@@ -76,15 +93,45 @@ claude mcp add wcf -- npx @anthropic/wcf-mcp
|
|
|
76
93
|
標準は stdio です。HTTP transport も利用できます(localhost のみ)。
|
|
77
94
|
|
|
78
95
|
```bash
|
|
79
|
-
npx @
|
|
96
|
+
npx @monoharada/wcf-mcp --transport=http --port=3100
|
|
80
97
|
```
|
|
81
98
|
|
|
82
99
|
- bind: `127.0.0.1`
|
|
83
100
|
- endpoint: `http://127.0.0.1:3100/mcp`
|
|
84
101
|
|
|
102
|
+
## structuredContent rollback
|
|
103
|
+
|
|
104
|
+
`get_component_api` / `get_design_tokens` / `get_accessibility_docs` / `search_guidelines` は通常 `structuredContent` を返します。
|
|
105
|
+
|
|
106
|
+
- 100KB 制限を超える場合は自動的に `structuredContent` を省略し、`content` のみ返します
|
|
107
|
+
- 緊急切り戻し時は環境変数 `WCF_MCP_DISABLE_STRUCTURED_CONTENT=1` を設定してください
|
|
108
|
+
|
|
109
|
+
例:
|
|
110
|
+
|
|
111
|
+
```bash
|
|
112
|
+
WCF_MCP_DISABLE_STRUCTURED_CONTENT=1 npx @monoharada/wcf-mcp
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
Claude Desktop 設定例:
|
|
116
|
+
|
|
117
|
+
```json
|
|
118
|
+
{
|
|
119
|
+
"mcpServers": {
|
|
120
|
+
"wcf": {
|
|
121
|
+
"command": "npx",
|
|
122
|
+
"args": ["@monoharada/wcf-mcp"],
|
|
123
|
+
"env": {
|
|
124
|
+
"WCF_MCP_DISABLE_STRUCTURED_CONTENT": "1"
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
```
|
|
130
|
+
|
|
85
131
|
## prefix パラメータ
|
|
86
132
|
|
|
87
133
|
全ツールで `prefix` パラメータをサポート。デフォルトは `dads`(例: `dads-button`)。
|
|
134
|
+
`prefix` は最大64文字まで使用され、超過分は切り詰められます(例: 200文字指定 -> 先頭64文字を採用)。
|
|
88
135
|
|
|
89
136
|
カスタム prefix を指定すると、出力のタグ名が自動変換されます:
|
|
90
137
|
|
|
@@ -139,7 +186,6 @@ prefix: "myui" → dads-button → myui-button
|
|
|
139
186
|
"severity": "warning",
|
|
140
187
|
"code": "unknownAttribute",
|
|
141
188
|
"message": "Unknown attribute on <dads-button>: foo",
|
|
142
|
-
"tagName": "dads-button",
|
|
143
189
|
"attrName": "foo"
|
|
144
190
|
}
|
|
145
191
|
]
|