{"_id":"@ai-first-ds/mcp-server","name":"@ai-first-ds/mcp-server","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.1":{"name":"@ai-first-ds/mcp-server","version":"0.1.1","description":"Model Context Protocol server for AI-First Design System - enables AI tools to query design system components, tokens, and patterns","type":"module","main":"dist/index.js","types":"dist/index.d.ts","bin":{"ai-first-mcp":"dist/index.js"},"scripts":{"build":"tsc","dev":"tsc --watch","start":"node dist/index.js","type-check":"tsc --noEmit"},"keywords":["mcp","model-context-protocol","ai-tools","design-system","components","design-tokens"],"author":{"name":"AI First Design System Contributors"},"license":"MIT","dependencies":{"@modelcontextprotocol/sdk":"^0.5.0"},"devDependencies":{"@types/node":"^20.0.0","typescript":"^5.3.0"},"_id":"@ai-first-ds/mcp-server@0.1.1","gitHead":"bc242e5c3d7a8e867fbb934ef37bbd8d5d5659ba","_nodeVersion":"22.15.0","_npmVersion":"10.9.2","dist":{"integrity":"sha512-alESPZsIDkcBZBflifbPlt2/N179gL5zX8J/857EUVXYQVJFsWqnl3xlCzP6ZR293LHZC06c5Ma3au7RIhMjxA==","shasum":"b5c63bd3cbc79b1e342cbfdc645dd1d8dd0908a1","tarball":"https://registry.npmjs.org/@ai-first-ds/mcp-server/-/mcp-server-0.1.1.tgz","fileCount":4,"unpackedSize":72726,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQC6FEG7U2OTG7zDwLwOpJgVWynySkqFF0QSf26Y/bj9UwIgBHcHf1SHoxM0nTZsAL58qtyK1N/FbufKsPwMsnfNZJk="}]},"_npmUser":{"name":"aishwaryshrivastava","email":"aishwaryshrivastava@gmail.com"},"directories":{},"maintainers":[{"name":"aishwaryshrivastava","email":"aishwaryshrivastava@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/mcp-server_0.1.1_1764757587164_0.5744389588272989"},"_hasShrinkwrap":false}},"time":{"created":"2025-12-03T10:26:27.017Z","0.1.1":"2025-12-03T10:26:27.376Z","modified":"2025-12-03T10:26:27.716Z"},"maintainers":[{"name":"aishwaryshrivastava","email":"aishwaryshrivastava@gmail.com"}],"description":"Model Context Protocol server for AI-First Design System - enables AI tools to query design system components, tokens, and patterns","keywords":["mcp","model-context-protocol","ai-tools","design-system","components","design-tokens"],"author":{"name":"AI First Design System Contributors"},"license":"MIT","readme":"# AI-First Design System MCP Server\n\nModel Context Protocol (MCP) server that exposes the AI-First Design System's components, tokens, and patterns to AI coding tools.\n\n## What is MCP?\n\nModel Context Protocol is a standard for exposing structured data and tools to AI assistants. By running this MCP server, AI tools like Claude, Cursor, and other AI coding assistants can intelligently query and understand your design system.\n\n## Features\n\n- **Component Discovery**: AI tools can search and retrieve detailed component information\n- **Design Tokens**: Access to all design tokens (colors, typography, spacing, AI-specific)\n- **Usage Examples**: Get framework-specific code examples (Vanilla JS, React, Vue, Svelte)\n- **Research Citations**: Every component includes research backing and design rationale\n- **Design Principles**: Access to core AI-first design principles\n\n## Installation\n\n```bash\ncd packages/mcp-server\nnpm install\nnpm run build\n```\n\n## Usage with AI Tools\n\n### Claude Desktop\n\nAdd to your Claude Desktop configuration (`~/Library/Application Support/Claude/claude_desktop_config.json` on macOS):\n\n```json\n{\n  \"mcpServers\": {\n    \"ai-first-design-system\": {\n      \"command\": \"node\",\n      \"args\": [\"/path/to/AI-First-Design-System/packages/mcp-server/dist/index.js\"]\n    }\n  }\n}\n```\n\n### Cursor / Other Tools\n\nConfigure your AI tool to use this MCP server by pointing to the built server file.\n\n## Available Resources\n\n- `ai-first://components/list` - List all components\n- `ai-first://components/{name}` - Get specific component metadata\n- `ai-first://tokens/{category}` - Get design tokens by category\n- `ai-first://principles` - AI design principles\n- `ai-first://patterns` - Common UI patterns\n\n## Available Tools\n\n### search_components\n\nSearch for components by name, description, or tags.\n\n```json\n{\n  \"query\": \"chat\"\n}\n```\n\n### get_component\n\nGet detailed metadata for a specific component.\n\n```json\n{\n  \"name\": \"ai-button\"\n}\n```\n\n### get_usage_example\n\nGet usage examples for a component in different frameworks.\n\n```json\n{\n  \"component\": \"ai-chat-message\",\n  \"framework\": \"react\"\n}\n```\n\n## Development\n\n```bash\n# Watch mode for development\nnpm run dev\n\n# Build\nnpm run build\n\n# Type check\nnpm run type-check\n```\n\n## Research Foundation\n\nThis MCP server implementation is based on:\n\n- **Model Context Protocol Specification** (2024)\n- **Design Systems Collective**: \"Building AI-Ready Design Systems with Structured Data\" (2024)\n- **Supernova**: \"Making Design Systems AI-Ready\" (2024)\n\n## Architecture\n\n```\nsrc/\n├── index.ts              # Main MCP server\n├── types.ts              # MCP-specific types\n└── resources/\n    ├── components.ts     # Component resource handlers\n    └── tokens.ts         # Token resource handlers\n```\n\n## Benefits for AI Tools\n\nWhen AI coding tools have access to this MCP server, they can:\n\n1. **Discover Components**: Find the right component for the job\n2. **Understand Props**: Know all available properties and their types\n3. **Follow Best Practices**: Access research-backed usage guidelines\n4. **Generate Correct Code**: Use proper syntax for each framework\n5. **Maintain Consistency**: Apply design tokens correctly\n6. **Respect Accessibility**: Follow WCAG guidelines built into components\n\n## License\n\nMIT\n","readmeFilename":"README.md","_rev":"1-9f400591145579d0390c7287402160c2"}