03-listed

可复用 UI 组件实现规范（按钮 / 表单控件 / 图表 / 弹窗 / 状态标签 / Tab 等基础组件，服务 web / 移动端 / 小程序 / 公开前台）。Use when: 创建跨项目可复用组件、确保同类组件在不同项目实现一致、跨平台组件统一时触发。SKIP: 管理后台组件 → 11（11 是该组件家族在 admin 的完整实现，做 admin 直接用 11 别从本 skill 读 web 部分）/ 前台 UI 设计风格 → 02 / 设计 Token 系统 → 02。vs 15-playbook：03 是可复用 UI 组件(代码层)，15 是可复用指令模板(prompt 层)，词同实异。
xcodethink/open-claude-code-skills · ★ 2 · AI & Automation · score 68

Install: claude install-skill xcodethink/open-claude-code-skills

# 组件规范创建组件时，读取对应平台目录下的文档： ## 🔴 管理后台开发 → 转到 `11-管理后台标准` **管理后台已独立为专属技能文件夹 `~/.claude/skills/11-管理后台标准/`** 开发管理后台时，直接读取 `11-管理后台标准/SKILL.md`，那里包含： - 完整模板代码（可直接复制的骨架、UI 组件、通用 Tab） - 所有规范文档（架构/后端/数据库/API层/国际化） - UI 组件规范（数据表格/统计卡片/图表/弹窗/状态标签/表单/侧边栏） - 新项目 CLAUDE.md 模板（跨机器可移植） - 验收清单 --- ## Web 端组件 (`web/`) > 管理后台相关文档仍保留在 `web/` 目录作为备份，但开发时应优先使用 `11-管理后台标准/`。 ### 非管理后台组件 - `Safari兼容规范.md` — Flex 布局踩坑、CJK 文本、viewport 高度 ## 移动端 (`移动端/`) - 待沉淀 ## 小程序 (`小程序/`) - 待沉淀 --- ## MCP 数据源组件 - `MCP数据源封装规范.md` — 将外部 API 封装为 MCP Server 的标准模式（目录结构、Tool 定义、限流/缓存/重试、Elicitation、跨项目复用策略） --- 如果某个组件还没有规范文档，开发完成后建议沉淀： "把这个组件的实现沉淀到组件规范里"