What problem does it solve?
Eliminates brittle, hard-to-maintain React component APIs caused by boolean prop proliferation by guiding teams to use composition, compound components, and dependency-injected context.
Core Features & Use Cases
- Avoid boolean prop proliferation: Replace sprawling prop combinations with explicit component variants that make rendered states unambiguous.
- Use compound components with shared context: Build composable subcomponents that consume a provider-supplied interface (state/actions/meta) rather than relying on prop drilling.
- Lift and decouple state management: Centralize state logic in provider components so UI pieces remain implementation-agnostic and reusable.
- Prefer children over render props: Improve readability and composability by using
children for structure while reserving render props for cases that require data passing.
- React 19 API guidance: Apply React 19 conventions such as using
use() instead of useContext() and treating ref as a regular prop.
Quick Start
Ask the AI to refactor a specific component that uses multiple boolean props into explicit variants that share a compound-component/context architecture, ensuring state is lifted into providers and React 19 conventions are followed.
