@semantic-components/mcp-server 0.70.0
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 +79 -0
- package/index.mjs +31269 -0
- package/package.json +25 -0
package/README.md
ADDED
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
# MCP Server
|
|
2
|
+
|
|
3
|
+
The `@semantic-components/mcp-server` package provides an [MCP (Model Context Protocol)](https://modelcontextprotocol.io/) server that exposes component documentation to AI coding assistants like Claude Code.
|
|
4
|
+
|
|
5
|
+
When working in a project that consumes `@semantic-components/*`, Claude Code can query the MCP server to discover components, read their documentation, and understand usage patterns — without needing the source code.
|
|
6
|
+
|
|
7
|
+
## Setup
|
|
8
|
+
|
|
9
|
+
Add the following to your project's `.claude/settings.json`:
|
|
10
|
+
|
|
11
|
+
```json
|
|
12
|
+
{
|
|
13
|
+
"mcpServers": {
|
|
14
|
+
"semantic-components": {
|
|
15
|
+
"command": "npx",
|
|
16
|
+
"args": ["-y", "@semantic-components/mcp-server"]
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
No installation is required. `npx -y` downloads the package from npm on first use and caches it.
|
|
23
|
+
|
|
24
|
+
## Available Tools
|
|
25
|
+
|
|
26
|
+
The server exposes 4 tools:
|
|
27
|
+
|
|
28
|
+
### `list_components`
|
|
29
|
+
|
|
30
|
+
Lists all available components across libraries. Optionally filter by library name.
|
|
31
|
+
|
|
32
|
+
**Input:** `library?` — e.g. `"ui"`, `"ui-lab"`, `"carousel"`
|
|
33
|
+
|
|
34
|
+
**Example output:**
|
|
35
|
+
|
|
36
|
+
```
|
|
37
|
+
## @semantic-components/ui (57 components)
|
|
38
|
+
|
|
39
|
+
- 📄 **button** — `button[scButton]`
|
|
40
|
+
- 📄 **dialog** — `sc-dialog`
|
|
41
|
+
- 📄 **calendar** — `sc-calendar`
|
|
42
|
+
...
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### `get_component`
|
|
46
|
+
|
|
47
|
+
Returns the full README documentation for a specific component, including selector, inputs table, usage examples, and accessibility notes.
|
|
48
|
+
|
|
49
|
+
**Input:** `name` — e.g. `"button"`, `"dialog"`, `"date-picker"`
|
|
50
|
+
|
|
51
|
+
### `search_components`
|
|
52
|
+
|
|
53
|
+
Searches components by keyword across names, exports, and README content. Results are ranked by relevance.
|
|
54
|
+
|
|
55
|
+
**Input:** `query` — e.g. `"form"`, `"date"`, `"toggle"`
|
|
56
|
+
|
|
57
|
+
### `get_guide`
|
|
58
|
+
|
|
59
|
+
Returns a full architectural guide by topic.
|
|
60
|
+
|
|
61
|
+
**Input:** `topic` — e.g. `"datatable"`
|
|
62
|
+
|
|
63
|
+
## How It Works
|
|
64
|
+
|
|
65
|
+
At build time, a manifest generator scans all component directories and `docs/guides/`, collecting README content and export names into a single `manifest.json`. The MCP server bundles this manifest and serves it over stdio using JSON-RPC, which is the standard transport for Claude Code MCP servers.
|
|
66
|
+
|
|
67
|
+
## Building
|
|
68
|
+
|
|
69
|
+
The Nx project has two targets:
|
|
70
|
+
|
|
71
|
+
```bash
|
|
72
|
+
# Generate the manifest from component READMEs and docs
|
|
73
|
+
npx nx run mcp-server:generate-manifest
|
|
74
|
+
|
|
75
|
+
# Bundle the server (depends on generate-manifest)
|
|
76
|
+
npx nx run mcp-server:build
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
The `build` target automatically runs `generate-manifest` first.
|