Paragon MCP服务器
MCP服务器 Open edX Paragon 设计系统（v23.x）。为AI助手提供对组件文档（道具、事件、代码示例和CSS设计标记）的结构化访问，这样他们就可以编写基于Paragon的UI代码而无需猜测。
安装
使用此服务器的最快方法是通过npx（不需要克隆）：
claude mcp add paragon -- npx -y @romkask/paragon-mcp-server或者手动将其添加到MCP配置中(~/.claude/settings.json 或项目 .claude/settings.local.json):
{
"mcpServers": {
"paragon": {
"command": "npx",
"args": ["-y", "@romkask/paragon-mcp-server"]
}
}
}可用工具
| 工具 | 说明 |
|---|---|
list_components | 列出所有63个Paragon组件，包括类别、状态和计数 |
get_component | 获取组件或子组件的完整详细信息（描述、道具、事件、子组件） |
get_component_props | 获取所有带有类型和描述的道具 |
get_component_events | 获取所有回调事件（onClose、onToggle等） |
list_examples | 列出组件的可用代码示例 |
get_example | 获取特定示例的完整JSX代码 |
get_components_variables | 获取CSS自定义属性/设计标记 |
子组件查找
所有73个子部件（例如。， CardGrid, AlertHeading, FormControl, TableRow)自动解析为其父组件。询问 get_component("CardGrid") 返回完整 Card 组件信息，带有指示子组件匹配的注释。
数据覆盖
- 63个组件 （按钮、警报、卡片、DataTable、表单、模态等）
- 73个子组件 具有自动父分辨率
- 410道具 带有类型和描述
- 69个事件/回调
- 295个实时代码示例
- 443个CSS设计标记变量
发展
git clone https://github.com/RomkaSk/paragon-mcp-server.git
cd paragon-mcp-server
npm install
npm run build # generates data + bundles with tsup
npm start # run server
npm run dev # dev mode with tsx
npm test # run tests (348 tests covering all components & subcomponents)许可证
麻省理工学院