用途：帮助在编写 React 组件时选择合适的模式。资料给出 13 种模式并按 2025 年流行度排序，核心原则是先使用自定义 Hook，只有在需要结构共享时才升级为复合组件。
主要能力与决策指南：可复用逻辑且不涉及 UI 用 Custom Hook；需要受控与非受控行为用 Control Props；Tabs、Modal、Accordion 等紧密耦合子组件用 Compound Components；只要逻辑不要样式用 Headless Component；数据获取与渲染分离用 Container/Presentational；全局稳定状态（认证、主题）用 Provider（Context）；反向数据流（子到父）用 Render Props；通过 children 完全控制渲染用 Children as Function；提供预构建 props 的灵活 API 用 Props Getters；崩溃隔离用 Error Boundary；渲染到 DOM 父节点之外（模态、提示）用 Portal；设计系统层级用 Atomic Design。
资料还给出各模式的星级与示例：Custom Hook 五星，示例为 useLocalStorage；Control Props 四星，示例 EditableTitle 同时支持受控与非受控；Compound Components 四星，父组件持有状态并通过局部 context 提供，子组件以点命名消费，useTabs 守卫 Hook 在子组件渲染于 Tabs 之外时抛错，完整实现位于 react-usecontext 技能；Headless Component 四星，示例 useAccordion 只返回逻辑；Container/Presentational 三星，示例 UserCard 与 UserCardContainer；Provider 四星；Render Props 两星，示例 WindowSize；Children as Function 两星，示例 Toggle；Props Getters 两星，示例 useToggle 的 getTogglerProps；Error Boundary 两星，可用类组件或 react-error-boundary；Portal 三星，示例 createPortal 渲染 Modal；HOC 一星，属遗留模式，已被自定义 Hook 取代；Atomic Design 三星，层级为 Atoms→Molecules→Organisms→Templates→Pages。
使用方式：按决策指南匹配需求后参考对应示例实现。限制：资料未提供安装命令、版本要求、性能数据或收费信息；部分示例为片段，完整可运行实现需查阅所引用的其他技能或外部参考。