vercel-composition-patterns

What problem does it solve? React components often accumulate boolean props like isThread or isEditing, creating exponential state combinations and unmaintainable conditional logic. This Skill provides structured composition patterns to refactor such components into flexible, maintainable architectures. ## Core Features & Use Cases - Compound Component Patterns: Replace monolithic components and boolean props with compound components sharing context, so consumers compose exactly the pieces they need. - State Management Guidelines: Lift state into provider components and define generic context interfaces (state, actions, meta) for dependency injection across different state implementations. - React 19 API Guidance: Covers React 19 changes including ref as a regular prop and use() replacing useContext(). - Use Case: When refactoring a chat composer component overloaded with isThread, isEditing, and isForwarding flags, apply these rules to split it into explicit ThreadComposer, EditComposer, and ForwardComposer variants sharing a common context interface. ## Quick Start Ask the AI to refactor a React component that has too many boolean props using these composition patterns.