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 patterns to replace prop proliferation with composition, making component codebases easier to maintain and extend. ## Core Features & Use Cases - Compound Component Architecture: Structure complex components with shared context so subcomponents access state without prop drilling. - State Lifting and Dependency Injection: Move state into provider components with generic state/actions/meta interfaces, letting the same UI work with different state implementations. - Explicit Variants and React 19 APIs: Create self-documenting variant components instead of boolean modes, and apply React 19 changes like ref-as-prop and use() instead of useContext(). - Use Case: When refactoring a message composer that has grown to accept isThread, isEditing, and isDMThread props, apply these rules to split it into ThreadComposer, EditComposer, and ChannelComposer variants sharing compound internals. ## Quick Start Ask the AI to refactor a React component with many boolean props into compound components with a shared context provider.
