vercel-composition-patterns

Avoid boolean prop proliferation in React by enforcing explicit composition patterns. You replace conditional flags with explicit variant components, such as ThreadComposer or EditMessageComposer, ensuring a clean and maintainable component API.

The best way to share state across compound components in React is by lifting it into context providers. This approach avoids prop drilling and enables flexible composition while maintaining reusable UI across different state implementations.

Refactor a monolithic React component by extracting explicit variant components from boolean flags and sharing their state via context providers. This creates distinct elements like ForwardMessageComposer to ensure scalable composition.

You do not need forwardRef when building reusable React component libraries in many cases. Following React 19 API guidance, you can leverage the use() hook over useContext to design flexible APIs without relying on forwardRef.

You should not use boolean flags for React component variants when building reusable component libraries or flexible APIs. Boolean flags cause bloated components, so explicit composition patterns are preferred for scalable UI.