弹窗有太多布尔模式
对话框存在大量布尔模式时，行为容易隐藏在属性组合中。检查确认、编辑等调用方及必须保留的模式，将难以理解的组合改为调用位置可见的具名组合。提供迁移样例，并核对原有模式，再决定如何替换旧接口。
Vercel Composition Patterns by Vercel Labs
使用 Vercel Labs 的 Vercel Composition Patterns，梳理 React 组件 API 与共享状态。针对不断增加的布尔属性、复杂变体和组件库扩展需求，探索复合组件、Provider 与明确变体，让组件结构更贴近实际调用方式。
理清复杂组件的接口
从已有控件和调用方出发组织组合审阅，将问题限定到布尔属性、状态归属及真实布局需求。请求中的迁移建议需要对照现有行为，说明哪些接口可以收敛、哪些约束必须保留。
带入 Floatboat 的请求
请求可预览和复制，不会从此处自动发送。
参考来源: Vercel Composition Patterns https://github.com/vercel-labs/agent-skills/blob/main/skills/composition-patterns/SKILL.md 先阅读原始说明并核对当前环境与依赖。需要安装或连接新工具时，先提出方案。 我的任务: 把这个带六个布尔属性的 Modal 重构成能支持确认和编辑流程、又不会出现意外组合的 API。 期望交付: 组件接口方案、调用迁移示例，以及原有行为的检查项。
关于 Vercel Composition Patterns
Vercel Composition Patterns 是 Vercel Labs 发布的 React 组件设计与重构 Skill，重点处理属性和行为模式不断增加后难以理解的组件 API。它介绍复合组件、由 Provider 管理的共享状态、明确变体，以及通过 children 组织结构的方式，帮助 Agent 从真实调用出发，区分共享行为与界面表现，提出更清晰的接口。原始规则还包含 React 19 专属 API 建议，使用时需要对应项目版本。它适合组件库设计和已有复杂组件的整理；实施时应检查代表性调用，逐步迁移并验证交互，避免只为采用某种模式而增加抽象。
Vercel Composition Patterns Skill的使用场景
布尔属性、共享状态和布局扩展对应不同接口问题。了解 Vercel Composition Patterns 如何通过具名组合及明确变体收敛接口，并保留已有行为。
兄弟控件需要共享状态
兄弟控件共享状态和事件时，过长的属性传递链可能增加理解成本。先梳理现有路径，再将相关状态与动作放入合适的 provider 边界，围绕明确接口更新调用方。共享行为得以保留，也不需要每个中间组件都代传数据。
组件库使用者需要可控的灵活性
组件库应满足真实使用方的布局需求，同时避免让它们重写内部逻辑。结合复合部件和明确变体，设计有边界的组合接口，并给出正确与错误样例。使用方可以据此区分受支持的拼装方式和无意中绕过组件约定的用法。
核对组合模式的 React 版本要求
组合建议可能依赖与当前项目不同的 React API。采用特定版本指引前，确认 React 和框架版本，再比较受影响调用方与受支持接口。将兼容模式和需要升级的提案分开，先验证行为，避免在迁移中静默增加版本前提。
如何设计 React 组件 API
新的组合接口能否成立，需要由真实调用方验证。找出模糊属性和状态归属后，先迁移常见及边缘用法，确认原有交互仍然正确，再决定扩大迁移范围。
检查组件与调用方
提供组件与代表性调用。找出含义不清的属性组合，并列出调用方真正需要的变化。
设计组合方式
让 Agent 提议复合部件、明确变体或共享状态 Provider。选择具体 API 前先核对 React 版本要求。
迁移并验证调用
将常见和边缘用法迁移到新接口。验证交互，并在迁移期间保持其余调用正常工作。
探索更多 Agent Skills
查看其他 Skill 指南，并在使用前核对原始来源。
Vercel Composition Patterns 常见问题
什么是复合组件？
它把相关部件放在同一套组件 API 下，通常通过上下文协调状态，让调用方按需要组合结构。
所有布尔属性都要删除吗？
不用。问题在于行为模式膨胀和组合含义不清；如果一个简单开关依然清楚，就无需强行移除。
这个 Skill 会提升运行性能吗？
它主要解决组件架构的可维护性。如果重构目的是性能提升，仍需单独测量。
React 18 项目可以用吗？
通用模式可以使用；原文单独标记了 React 19 专属建议，旧版本不应套用。
已有组件如何逐步迁移？
先挑一个难以理解的属性组合，提供语义清楚的组合方式，并保持旧调用仍可工作。验证新接口后再扩大范围，不必一次重写整个组件库。
什么时候不需要引入共享 Context？
如果某个值只传给一个直接子组件，普通属性通常更清晰。只有多个相关组件确实需要共享状态契约时，才有必要引入 Provider。
组件 API 审查应提供哪些文件？
提供组件、已有状态 Provider 和几个真实调用方，并注明 React 版本及难以维护的属性组合，让 Agent 围绕实际用途设计接口。