@webspire/mcp 0.1.0 → 0.3.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 +92 -0
- package/data/registry.json +1097 -2
- package/dist/index.js +1 -1
- package/dist/registration.js +159 -0
- package/dist/search.d.ts +1 -1
- package/dist/search.js +77 -12
- package/dist/types.d.ts +35 -0
- package/package.json +6 -6
package/README.md
ADDED
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
# @webspire/mcp
|
|
2
|
+
|
|
3
|
+
MCP server for [Webspire](https://webspire.de) CSS snippets — AI-native snippet discovery and matching.
|
|
4
|
+
|
|
5
|
+
49 production-ready CSS snippets across 7 categories: glass, animations, easing, scroll, decorative, interactions, text.
|
|
6
|
+
|
|
7
|
+
## Quick Start
|
|
8
|
+
|
|
9
|
+
### Claude Code / Claude Desktop
|
|
10
|
+
|
|
11
|
+
Add to your MCP settings (`~/.claude/settings.json` or Claude Desktop config):
|
|
12
|
+
|
|
13
|
+
```json
|
|
14
|
+
{
|
|
15
|
+
"mcpServers": {
|
|
16
|
+
"webspire": {
|
|
17
|
+
"command": "npx",
|
|
18
|
+
"args": ["-y", "@webspire/mcp"]
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
### Custom Registry
|
|
25
|
+
|
|
26
|
+
```json
|
|
27
|
+
{
|
|
28
|
+
"mcpServers": {
|
|
29
|
+
"webspire": {
|
|
30
|
+
"command": "npx",
|
|
31
|
+
"args": ["-y", "@webspire/mcp", "--registry-url", "https://your-domain.com/registry.json"]
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
## Available Tools
|
|
38
|
+
|
|
39
|
+
| Tool | Description |
|
|
40
|
+
|------|-------------|
|
|
41
|
+
| `list_categories` | List all snippet categories with counts |
|
|
42
|
+
| `search_snippets` | Search by keyword, use case, or CSS technique |
|
|
43
|
+
| `get_snippet` | Get full CSS source, metadata, and usage example |
|
|
44
|
+
| `recommend_snippet` | Describe a UI problem, get best matching snippets |
|
|
45
|
+
| `list_pattern_families` | List all UI pattern families |
|
|
46
|
+
| `search_patterns` | Search UI patterns by intent |
|
|
47
|
+
| `get_pattern` | Get full pattern HTML/CSS/JS |
|
|
48
|
+
|
|
49
|
+
## Available Resources
|
|
50
|
+
|
|
51
|
+
| URI | Description |
|
|
52
|
+
|-----|-------------|
|
|
53
|
+
| `webspire://categories` | All categories with counts (JSON) |
|
|
54
|
+
| `webspire://category/{name}` | Snippets in a category (JSON) |
|
|
55
|
+
| `webspire://snippet/{id}` | Full snippet data including CSS (JSON) |
|
|
56
|
+
| `webspire://patterns` | All patterns (JSON) |
|
|
57
|
+
| `webspire://pattern/{id}` | Full pattern data (JSON) |
|
|
58
|
+
|
|
59
|
+
## Snippet Categories
|
|
60
|
+
|
|
61
|
+
- **glass** — Frosted, subtle, bold, colored, dark glassmorphism effects
|
|
62
|
+
- **animations** — Fade, slide, scale, blur, stagger, pulse, infinite scroll
|
|
63
|
+
- **easing** — Spring, bounce, snap easing tokens
|
|
64
|
+
- **scroll** — Parallax, reveal, progress bar, snap, sticky header
|
|
65
|
+
- **decorative** — Aurora, gradient mesh, neon glow, noise, orbs, shimmer
|
|
66
|
+
- **interactions** — Hover lift, ripple, flip card, tilt, magnetic, focus ring
|
|
67
|
+
- **text** — Fluid size, gradient text, typewriter, truncate, balance
|
|
68
|
+
|
|
69
|
+
## Search Features
|
|
70
|
+
|
|
71
|
+
- **Synonym expansion**: "blur" also finds glass/frosted snippets
|
|
72
|
+
- **Stemming**: "animations" matches "animated", "animate"
|
|
73
|
+
- **Multi-field scoring**: Matches in title, description, use cases, tags, classes
|
|
74
|
+
- **Filters**: Category, tags, dark mode support, responsive support
|
|
75
|
+
|
|
76
|
+
## Programmatic Usage
|
|
77
|
+
|
|
78
|
+
```typescript
|
|
79
|
+
import { loadRegistry, searchSnippets } from '@webspire/mcp/registry';
|
|
80
|
+
|
|
81
|
+
const registry = await loadRegistry();
|
|
82
|
+
const results = searchSnippets(registry, {
|
|
83
|
+
query: 'glass card hover',
|
|
84
|
+
category: 'glass',
|
|
85
|
+
darkMode: true,
|
|
86
|
+
limit: 5,
|
|
87
|
+
});
|
|
88
|
+
```
|
|
89
|
+
|
|
90
|
+
## License
|
|
91
|
+
|
|
92
|
+
MIT
|