vercel-composition-patterns

Compound components in React scale component APIs by lifting shared state into context providers, preventing prop drilling across UI boundaries and allowing independent subcomponents to access state cleanly.

Refactor React components into composition patterns by identifying boolean switches and replacing them with explicit variants, then applying compound components and shared context interfaces to manage state across boundaries.

React 19 changes context usage by introducing the use() API, allowing you to transition from useContext to use() for cleaner context consumption and safer composition patterns within your component library.

Yes, you can use context providers to avoid prop drilling in React by establishing a shared context interface that lifts state management across UI boundaries, enabling compound components to access data directly.

Use explicit variants instead of boolean props in React when your component API becomes fragile and unreadable, replacing multiple conditional switches with distinct components like ForwardMessageComposer for better code maintenance.