SuperAPI AI 工具集

stitch-shadcn-ui

前端与建站

查看项目

更新于 10-16 08:07

技能介绍

用途:当需要把 Stitch 设计实现为 shadcn/ui 组件时使用本技能,适用于涉及 Google Stitch 项目 ID、.stitch/ 产物、DESIGN.md、Stitch 导出或 Stitch 专属验证的任务。

主要能力:检查 components.json、Tailwind 配置、路径别名与现有 components/ui 模式;将 Stitch 组件映射到 Button、Card、Dialog、Sheet、Tabs、Table、Command、Form、Select 等 shadcn 原语;按 DESIGN.md 更新 CSS 变量与 Tailwind 令牌;验证明暗主题、键盘行为、ARIA 属性与响应式布局。

使用方式:优先使用 npx shadcn@latest init 或 npx shadcn@latest add <component>,除非存在已验证的 shadcn MCP 工具。components/ui 应贴近生成源码,项目专属包装放在其他位置。生成的 .stitch/ 文件默认不提交,除非用户明确要求保留。跨客户端可在 GitHub Copilot、Claude Code、Codex 中使用;Codex 需同步到 $CODEX_HOME/skills/stitch-shadcn-ui 并重启。

限制:本工作区已验证的 Stitch MCP 面为 create_project、upload_design_md、create_design_system_from_design_md、list_design_systems、apply_design_system;不得声称使用了未在当前宿主工具列表中暴露的屏幕查询、生成、编辑或变体工具。无 MCP 时可回退到本地 .stitch/ 产物、导出 HTML 或截图、脚本及 Stitch Web UI。禁止上传文件或设计资产到 Stitch 而未经用户批准,禁止读取、打印、存储或提交 API 密钥、MCP 配置密钥、Cookie 等凭据。未经验证不得将生成的设计或代码视为最终结果。