用途
canvas-component-definition 是一个用于强制执行标准 Canvas 组件契约的技能。任何 React 组件任务都应从此开始，包括创建、修改、重构、审查、迁移或验证组件。
主要能力
该技能定义了 Canvas 组件的规范构成。一个 Canvas 组件是一个包含以下四部分的包：
- React 实现（index.jsx）
- Canvas 元数据/模式（component.yml）
- 命名与结构兼容性（machineName、文件夹路径、story 路径）
- Canvas 兼容的 props/slots 建模
以上四部分全部具备，组件才能在 Drupal Canvas 中使用。
最低契约（MUST）
每个 Canvas 组件必须满足以下所有检查：
- 组件文件夹存在于
<components-root>/<machine-name>/（使用仓库配置的 components root，可能定义在 .env 中） - React 实现存在于
<components-root>/<machine-name>/index.jsx - 元数据存在于
<components-root>/<machine-name>/component.yml - component.yml 包含必需的顶层键（name、machineName、status、required、props、slots）
- 文件夹名称与 component.yml 中的 machineName 完全匹配（kebab-case）
- 匹配的 story 存在于
<stories-root>/<machine-name>.stories.jsx（使用仓库配置的 stories root） - props/slots 遵循 Canvas 规则（例如，避免不支持的 array-of-object prop 形状；对可重复的复杂内容使用 slots）
如果缺少任何一项，该组件对 Canvas 使用而言就是不完整的。
命名指引
命名规则和示例参见 references/naming.md。
技能协调
按以下顺序评估配套技能：
- canvas-component-metadata：在创建/更改 component.yml、props/slots、枚举，或修复 prop 验证错误时使用。
- canvas-component-composability：在设计 prop/slot 结构、分解大型组件、决定 props 与 slots、建模可重复的列表/网格内容时使用。
- canvas-styling-conventions：用于所有样式工作，包括新组件、样式 props、Tailwind token 使用、CVA 变体、类更改以及影响样式的 prop 更改。
- canvas-component-utils：在通过 FormattedText 和 Image 渲染格式化 HTML 文本或媒体时使用。
- canvas-data-fetching：在使用 JSON:API、SWR、includes 和 filter 模式获取/渲染 Drupal 内容时使用。
- canvas-component-upload：在实现完成并验证后，上传以及从上传失败中恢复时使用。
适用场景
适用于所有涉及 Canvas React 组件的开发任务，尤其是需要确保组件符合 Drupal Canvas 使用规范的场景。
限制
资料未提供该技能的具体安装方式、依赖版本、收费信息或平台限制。