用途
vercel-composition-patterns 用于指导 React 组件的组合式设计，帮助开发者构建灵活、可维护且可扩展的组件。它重点解决组件随着需求增长而出现的问题，例如 boolean prop 泛滥、组件 API 难以扩展、可复用组件库难以维护等。
何时适用
在以下情形可参考该指南：
- 重构包含大量 boolean prop 的组件
- 构建可复用的组件库
- 设计灵活的组件 API
- 审查组件架构
- 处理复合组件或 context provider 相关任务
规则分类与优先级
指南按优先级将规则分为四个类别：
- 组件架构（HIGH，前缀 architecture-）：不通过添加 boolean prop 来定制行为，而是使用组合；用共享 context 构建复杂组件。
- 状态管理（MEDIUM，前缀 state-）：Provider 是唯一知道状态如何管理的地方；定义包含 state、actions、meta 的通用接口以支持依赖注入；将状态提升到 provider 组件以便兄弟组件访问。
- 实现模式（MEDIUM，前缀 patterns-）：创建显式的变体组件，而不是使用 boolean 模式；使用 children 进行组合，而不是 renderX props。
- React 19 API（MEDIUM，前缀 react19-）：仅适用于 React 19 及以上版本。不使用 forwardRef；使用 use() 代替 useContext()。若使用 React 18 或更早版本，可跳过此部分。
快速参考
组件架构（HIGH）：
- architecture-avoid-boolean-props：不要添加 boolean prop 来自定义行为；使用组合。
- architecture-compound-components：使用共享 context 构建复杂组件。
状态管理（MEDIUM）：
- state-decouple-implementation：Provider 是唯一知道状态如何管理的地方。
- state-context-interface：定义包含 state、actions、meta 的通用接口以支持依赖注入。
- state-lift-state：将状态移动到 provider 组件中，以便兄弟组件访问。
实现模式（MEDIUM）：
- patterns-explicit-variants：创建显式的变体组件，而不是使用 boolean 模式。
- patterns-children-over-render-props：使用 children 进行组合，而不是 renderX props。
React 19 API（MEDIUM）：
- 仅限 React 19+。若使用 React 18 或更早版本，请跳过本节。
- react19-no-forwardref：不要使用 forwardRef；使用 use() 代替 useContext()。
使用方式
阅读各个规则文件以获取详细说明和代码示例，例如：
- rules/architecture-avoid-boolean-props.md
- rules/state-context-interface.md
每个规则文件包含：
- 规则重要性的简要说明
- 错误代码示例及解释
- 正确代码示例及解释
- 额外背景和参考
完整指南（包含所有规则展开）见 AGENTS.md。
限制
资料未提供该技能的安装命令、依赖环境、收费或价格信息、具体支持的 React 版本范围之外的兼容性说明，以及除上述规则外的其他功能细节。