vercel-composition-patterns

Refactor React components by adopting compound component architecture and explicit variant components to eliminate boolean prop proliferation. Replace ambiguous boolean flags with self-documenting variants like ThreadComposer, lifting shared state into context providers.

State lifting in React 19 involves moving management into provider components so UI pieces consume a stable context interface. Sibling and external UI can read actions and state directly using the new use() hook for context consumption.

Remove render props by refactoring tangled conditional logic into composition-based architectures. Build reusable component pieces that share state via context instead of prop drilling, making composition predictable for both humans and AI agents.

Yes, React 19+ conventions treat ref as a regular prop instead of relying on forwardRef. This ref-as-prop pattern simplifies component architecture when building dependency-injectable context interfaces for state, actions, and meta.

Replace boolean flags like isThread or isEditing with explicit component variants when ambiguous combinations create tangled logic. Self-documenting variants such as EditComposer maintain predictability as features grow in complex React component architectures.