Vendure UI 是一套面向 Vendure 前端界面的构建与审查技能，适用于 @vendure/dashboard 或 @vendure-io/ui 的消费方。它的核心目标是在应用 Vendure 的组件决策与强默认屏幕配方时，让领域数据与应用状态仍由消费方掌控。
用途 该技能用于创建或修改 Vendure Dashboard 扩展、页面，以及审查前端界面。它帮助开发者判断当前代码属于 Dashboard 扩展还是独立消费方，并据此选择正确的导入路径与组合方式。
主要能力 技能提供了一套明确的决策流程。首先对宿主进行分类：若代码从 @vendure/dashboard 导入或调用 defineDashboardExtension，或 VendurePlugin 声明了 dashboard 入口，则视为 Dashboard 扩展；此时应从 @vendure/dashboard 导入设计系统 UI 与仪表盘布局/表单 API，不应混入直接的 @vendure-io/ui 导入，除非仓库有明确例外。独立消费方则从 @vendure-io/ui/components/atoms/* 或 components/molecules/* 子路径精确导入每个组件，不创建桶式导入。技能强调在假设导出或属性前，先检查已安装包的源码与类型，源码是 API 的权威。
组合选择遵循固定顺序：先搜索是否已有表达该行为的 molecule，有则直接使用而非从 atoms 重建；若无合适 molecule，则在消费方组合现有 atoms，不复制或修改设计系统源码；领域含义、数据获取、路由、授权、持久化与应用状态保持消费方所有，除非组件明确拥有该行为；当第二个消费方需要相同本地组合时，标记为可升级到 @vendure-io/ui 的候选。
对于整页界面，需阅读 screen-recipes.md 中匹配的章节，将配方层级、操作位置、响应式结构与状态处理视为强默认。独立消费方从自有的独立骨架开始；Dashboard 扩展则遵循集成意图，检查已安装的 @vendure/dashboard 源码与类型以获取当前 API，不重建独立页面外壳或臆造 Dashboard 导入。偏离仅在有具体产品需求时允许，并需报告原因。组件决策需按组件或决策名称搜索 component-decisions.md，阅读所有相关章节后再实现，不加载无关章节。
跨切面规则包括：每个视图组合一个主 Button，支持性操作按权重降级为 secondary、outline、ghost 或 overflow；使用状态字典与 StatusBadge 处理领域状态，不在调用点选择状态颜色；分别用 LoadingState、EmptyState、ErrorState 呈现等待、成功空态与失败；空态或错误媒体参考 illustrations.md，整个区域使用一个场景匹配的插图，不在已填充的行或卡片中重复；表单需有可见标签、稳定描述、可操作错误、匹配的可访问无效状态与清晰的提交层级；Dashboard 扩展使用 @vendure/dashboard 导出的表单 API，独立消费方保留应用现有表单状态库；破坏性操作置于常规保存路径之外，仅对不可逆、批量或对外可见的后果进行确认；自定义样式、主题、颜色、排版、表面或动效使用 vendure-tokens 技能，不在此重复令牌决策。
处理冲突的本地代码时，对于新增或大幅修改的 UI，即使邻近消费方代码不一致也遵循本技能，不复制现有违规作为先例，不趁机重构无关屏幕，而是在交接中把不一致标记为迁移债务。
审查 UI 时，除非用户同时要求修改，否则保持只读。审查项包括：宿主适配的导入；molecule 选择与 atom 组合；屏幕配方层级；操作强调与位置；表单结构与校验；加载、空、错误、未找到与权限状态；插图选择与重复；状态字典使用；可访问性语义；应升级的本地组合。报告需给出文件与行号证据、影响与适用规则，不将风格偏好报告为违规。
使用方式 在实现前，先检查任务与仓库以分类宿主，确认导入面。然后按顺序选择组合：搜索现有 molecule、组合 atoms、保持消费方所有权、标记升级候选。整页界面阅读 screen-recipes.md，组件决策查阅 component-decisions.md，跨切面规则逐项应用。完成前需验证每个导入对应活动宿主包，确认未重新实现已有 molecule，确认应用了最接近的屏幕配方或解释了偏离，确认操作、表单、状态与插图决策遵循引用规则，并运行消费方相关的类型、lint 与测试命令。最后报告有意偏离、遇到的迁移债务与升级候选。
适用场景 适用于 Vendure Dashboard 扩展开发、Vendure 前端页面创建与修改、以及基于 @vendure-io/ui 的独立消费方界面构建与审查。
限制 技能本身不提供具体组件清单或 API 细节，需查阅已安装包源码与类型、screen-recipes.md、component-decisions.md、illustrations.md 等文件。关于收费、价格、平台支持范围等信息暂未提供。