01
这个 skill 做什么
在创建或重构 React compound component、数据驱动 Part、多态宿主元素或其私有文件布局时使用此 skill。它明确规定调用方数量不影响契约质量:即使当前只有一个生产调用方,公共 Part 仍必须可达,原生 props 与 ref 必须透明,事件与样式必须可组合,状态所有权必须清晰,而组件拥有重复数据时必须提供真实的渲染边界。
02
什么时候使用
- 01设计带受控状态、语义 Part、asChild、焦点、键盘和 ARIA 契约的 Radix 风格 primitive。
- 02构建视觉 Part 不依赖具体 store 或同步实现的产品 compound component。
- 03让集合 Item、空状态、Trigger 与 Content 区域无需复制内部行为即可替换。
- 04用职责明确的下划线目录组织组件本地私有文件。
03
如何工作
- 01
先判断 primitive 与 product 行为,再决定重复数据迭代归消费者还是组件所有。
- 02
根据状态、数据、语义、内容、样式、交互和集成职责确定公共接缝,而不是根据当前调用方数量。
- 03
定义会在缺失 owner 时抛错的 Context 边界,以及合适的受控或 Provider 驱动状态契约。
- 04
让每个公共宿主 Part 透明传递 props 与 ref,明确组合事件和样式,并暴露稳定状态属性。
- 05
移除 child type 发现、静默丢弃 children,以及让导出 Part 无法触达的固定嵌套默认实现。
- 06
应用私有目录分类,并在完成前验证至少一种有意义的替代排列或渲染器。
04
你会得到什么
- 01一个所声明 Part 均可直接使用或通过显式边界替换的 compound namespace。
- 02类型化的状态、Item 渲染、宿主 props、无障碍和元素替换契约。
- 03最小私有目录布局,以及所声明组合接缝确实可用的证据。
05
重要边界
- 01不要因为只有一个生产调用方就降低 API 质量,也不要为了显得可复用而臆造配置。
- 02不要导出会被便利 facade 永久替换为内部副本的装饰性 Part。
- 03不要把 child.type 身份扫描、只取第一个匹配项或静默丢弃 children 当作组合协议。
- 04不要让样式 hooks 取代语义 HTML、键盘行为、焦点管理或 ARIA。
- 05保持 skill 自包含;它的组合决策不能要求预先安装其他 skills。
06