WordPress 设计系统（WPDS）
前提条件
本技能最好与 WPDS MCP 服务器 配合使用。该 MCP 提供对 WordPress 设计系统文档和资源的访问，例如组件和 DS 令牌列表。
以下术语应视为同义词：
- “WordPress” 和 “WP”；
- “Design System” 和 “DS”；
- “WordPress Design System” 和 “WPDS”。
使用时机
当用户提到以下内容时，请使用本技能：
- 在 WordPress 相关上下文中构建和/或审查任何 UI（例如 Gutenberg、WooCommerce、WordPress.com、Jetpack 等）；
- WordPress 设计系统、WPDS、设计系统；
- UI 组件、设计令牌、颜色原色、间距比例、排版变量和预设；
- 特定组件包，例如 @wordpress/components 或 @wordpress/ui；
规则
使用 WPDS MCP 服务器访问 WPDS 相关文档
- 使用 WPDS MCP 服务器检索权威、规范的文档：
- 参考站点（
wpds://pages） - 可用组件列表（
wpds://components）和特定组件信息（wpds://components/:name） - 可用令牌列表（
wpds://design-tokens）
- 参考站点（
- 不要在网络上搜索关于 WordPress 设计系统的规范文档。如果用户提出此类要求，请拒绝并请求确认，同时提醒用户 MCP 服务器是提供信息的最佳场所。
必需文档
在处理任何 WPDS 相关任务之前，请确保阅读参考站点上的相关文档。在评估任何给定任务的最佳行动方案时，此文档应具有绝对优先权。
边界
- 跳过回答中与 UI 无关的部分（例如，从存储中获取数据或本地化文本字符串）。
- 专注于构建尽可能符合 WPDS 最佳实践的 UI，并使用最合适的 WPDS 组件/令牌/模式。
技术栈
- 除非另有说明（或从请求的本地上下文中收集到特定信息），否则假定技术栈为：TypeScript、React、CSS。
验证
- 如果任务运行的本地上下文提供了 lint 脚本，在可能的情况下使用它们来验证提议的代码输出。
输出
- 在回答的最后，作为回顾，提供清晰简洁的解决方案说明，并为每个决策添加上下文解释。
- 明确指出边界，即因不相关而明确排除在任务之外的内容（例如非 UI 相关内容）。
- 提供可工作的代码片段。