vercel-composition-patterns

To refactor a React component with boolean prop proliferation, break it down into explicit component variants and leverage compound components. This pattern replaces complex conditional rendering paths with smaller, composable UI elements for better maintainability.

The best way to decouple state management from React components is by lifting state into providers and defining generic context interfaces. This approach separates state logic from UI rendering, making components more scalable and easier to test.

Compound components improve React component architecture by allowing flexible composition without deep prop drilling. They enable you to build explicit component variants and prefer children over render props, resulting in cleaner and more maintainable code.

Yes, these React composition patterns support React 19 API changes. They provide specific implementation guidelines for the new `use()` hook and updated ref handling techniques to ensure your component architecture remains compatible.

You should prefer children over render props in React component design when building explicit component variants. This composition pattern avoids complex conditional rendering and simplifies the component API, making the codebase easier to understand and maintain.