saha-ui 1.15.0 → 1.16.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 +100 -0
- package/bin/mcp.js +33 -0
- package/dist/node_modules/es-toolkit/dist/compat/object/cloneDeep.js +1 -1
- package/dist/node_modules/es-toolkit/dist/object/cloneDeep.js +1 -1
- package/mcp/server.ts +1641 -0
- package/mcp/test-dynamic-features.js +366 -0
- package/mcp/tsconfig.json +31 -0
- package/package.json +18 -5
package/README.md
CHANGED
|
@@ -5562,6 +5562,106 @@ Saha UI is optimized for minimal bundle impact:
|
|
|
5562
5562
|
- [NPM Package Summary](./NPM_PACKAGE_SUMMARY.md) - Package details
|
|
5563
5563
|
- [Type Safety Guide](./TYPE_SAFETY_GUIDE.md) - TypeScript best practices
|
|
5564
5564
|
- [Component Modernization](./ULTRA_MODERN_SUMMARY.md) - Architecture details
|
|
5565
|
+
- **[🤖 MCP Server](./docs/MCP_SERVER.md)** - AI Assistant Integration (Built-in!)
|
|
5566
|
+
|
|
5567
|
+
---
|
|
5568
|
+
|
|
5569
|
+
## 🤖 MCP Server - AI-Powered Development (v2.0 - Dynamic & Context-Aware)
|
|
5570
|
+
|
|
5571
|
+
Saha UI includes a **built-in Model Context Protocol (MCP) server** that provides AI assistants with intelligent, human-like access to the component library.
|
|
5572
|
+
|
|
5573
|
+
### 🧠 Intelligence Features
|
|
5574
|
+
|
|
5575
|
+
- 🎯 **Context Awareness**: Remembers your session and adapts responses based on what you've viewed
|
|
5576
|
+
- 💡 **Intent Detection**: Automatically understands if you need tutorials, examples, styling help, or troubleshooting
|
|
5577
|
+
- 🔍 **Fuzzy Matching**: Handles typos gracefully - "Buton" → Button, "inpt" → Input
|
|
5578
|
+
- 🤝 **Smart Suggestions**: Proactive recommendations for related components, hooks, and next steps
|
|
5579
|
+
- 📊 **Progressive Disclosure**: Shows summaries first, details on request - no information overload
|
|
5580
|
+
- 🗣️ **Natural Language**: Ask questions naturally - "How do I customize colors?" works perfectly
|
|
5581
|
+
|
|
5582
|
+
### Core Features
|
|
5583
|
+
|
|
5584
|
+
- 📦 **73 Components**: Complete source code, types, variants, and styles
|
|
5585
|
+
- 🪝 **40+ Hooks**: Full implementation with usage examples and best practices
|
|
5586
|
+
- 🎨 **Theme System**: OKLCH colors, Tailwind config, CSS variables
|
|
5587
|
+
- 🔎 **Smart Search**: Context-aware code search with intelligent filtering
|
|
5588
|
+
- 💬 **Conversational**: Ask questions naturally, get personalized answers
|
|
5589
|
+
- ⚡ **Recommendations**: Get component suggestions based on your project type
|
|
5590
|
+
|
|
5591
|
+
### Quick Setup
|
|
5592
|
+
|
|
5593
|
+
The MCP server is included with Saha UI - no separate installation needed!
|
|
5594
|
+
|
|
5595
|
+
```bash
|
|
5596
|
+
# Install Saha UI
|
|
5597
|
+
npm install saha-ui
|
|
5598
|
+
|
|
5599
|
+
# Configure your AI client (e.g., Claude Desktop)
|
|
5600
|
+
# Add to claude_desktop_config.json:
|
|
5601
|
+
```
|
|
5602
|
+
|
|
5603
|
+
```json
|
|
5604
|
+
{
|
|
5605
|
+
"mcpServers": {
|
|
5606
|
+
"saha-ui": {
|
|
5607
|
+
"command": "npx",
|
|
5608
|
+
"args": ["saha-ui-mcp"]
|
|
5609
|
+
}
|
|
5610
|
+
}
|
|
5611
|
+
}
|
|
5612
|
+
```
|
|
5613
|
+
|
|
5614
|
+
That's it! The MCP server runs directly from your `node_modules`.
|
|
5615
|
+
|
|
5616
|
+
### Example Interactions
|
|
5617
|
+
|
|
5618
|
+
The MCP server understands natural language and adapts to your needs:
|
|
5619
|
+
|
|
5620
|
+
**Beginner-Friendly:**
|
|
5621
|
+
> "How do I get started with Saha UI?"
|
|
5622
|
+
>
|
|
5623
|
+
> "Show me simple form components"
|
|
5624
|
+
>
|
|
5625
|
+
> "What's the easiest way to add a button?"
|
|
5626
|
+
|
|
5627
|
+
**Discovery & Exploration:**
|
|
5628
|
+
> "What components work well for a dashboard?"
|
|
5629
|
+
>
|
|
5630
|
+
> "Show me components similar to Card"
|
|
5631
|
+
>
|
|
5632
|
+
> "Find components with glass morphism"
|
|
5633
|
+
|
|
5634
|
+
**Advanced Usage:**
|
|
5635
|
+
> "Customize Button theme colors using OKLCH"
|
|
5636
|
+
>
|
|
5637
|
+
> "Integrate DataTable with Next.js 15 App Router"
|
|
5638
|
+
>
|
|
5639
|
+
> "Search for all components using CVA variants"
|
|
5640
|
+
|
|
5641
|
+
**The server handles typos too:** "Show me the Botton component" → Automatically suggests Button ✓
|
|
5642
|
+
|
|
5643
|
+
### Smart Features in Action
|
|
5644
|
+
|
|
5645
|
+
```typescript
|
|
5646
|
+
// Fuzzy matching - typos are okay!
|
|
5647
|
+
"Buton" → Button ✓
|
|
5648
|
+
"inpt" → Input ✓
|
|
5649
|
+
"useDebonc" → useDebounce ✓
|
|
5650
|
+
|
|
5651
|
+
// Context awareness - remembers what you've viewed
|
|
5652
|
+
// Viewing Input → Suggests useDebounce hook
|
|
5653
|
+
// Viewing Card → Suggests related components
|
|
5654
|
+
|
|
5655
|
+
// Intent detection - understands what you need
|
|
5656
|
+
"How to style..." → Styling mode (variants, theme)
|
|
5657
|
+
"Show example..." → Example mode (code samples)
|
|
5658
|
+
"Fix error..." → Troubleshooting mode (solutions)
|
|
5659
|
+
```
|
|
5660
|
+
|
|
5661
|
+
📚 **Documentation:**
|
|
5662
|
+
- **[Full MCP Server Guide](./docs/MCP_SERVER.md)** - Complete documentation
|
|
5663
|
+
- **[Dynamic Features](./docs/MCP_DYNAMIC_FEATURES.md)** - Smart features quick reference
|
|
5664
|
+
- **[Quick Reference](./docs/MCP_QUICK_REFERENCE.md)** - Tool & command reference
|
|
5565
5665
|
|
|
5566
5666
|
---
|
|
5567
5667
|
|
package/bin/mcp.js
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Saha UI MCP Server Launcher
|
|
5
|
+
* This script launches the MCP server from the installed package
|
|
6
|
+
*/
|
|
7
|
+
|
|
8
|
+
import { fileURLToPath } from 'url';
|
|
9
|
+
import { dirname, join } from 'path';
|
|
10
|
+
import { spawn } from 'child_process';
|
|
11
|
+
|
|
12
|
+
const __filename = fileURLToPath(import.meta.url);
|
|
13
|
+
const __dirname = dirname(__filename);
|
|
14
|
+
|
|
15
|
+
// Path to the MCP server in dist
|
|
16
|
+
const serverPath = join(__dirname, '..', 'dist', 'mcp', 'server.js');
|
|
17
|
+
|
|
18
|
+
// Spawn the MCP server
|
|
19
|
+
const server = spawn('node', [serverPath], {
|
|
20
|
+
stdio: 'inherit',
|
|
21
|
+
env: process.env,
|
|
22
|
+
});
|
|
23
|
+
|
|
24
|
+
// Handle exit
|
|
25
|
+
server.on('exit', (code) => {
|
|
26
|
+
process.exit(code || 0);
|
|
27
|
+
});
|
|
28
|
+
|
|
29
|
+
// Handle errors
|
|
30
|
+
server.on('error', (error) => {
|
|
31
|
+
console.error('Failed to start Saha UI MCP server:', error);
|
|
32
|
+
process.exit(1);
|
|
33
|
+
});
|