community-react-composition

What problem does it solve?

This Skill addresses the challenge of managing complex React component architectures by promoting clear, maintainable patterns that avoid prop proliferation and enable scalable composition.

Core Features & Use Cases

• Component Architecture: Guides on avoiding boolean props and creating explicit variant components.
• Composition with Context: Demonstrates use of compound components with shared context for flexible assembly.
• State Management: Shows how to decouple and lift state into providers for reusable UI.
• Implementation Patterns: Offers techniques like prefer children over render props and explicit variants.
• React 19 API Changes: Covers updates in React 19 for cleaner ref and context handling.
• Use Cases: Ideal for developers refactoring large React codebases, designing reusable component libraries, or implementing scalable UI patterns.

Quick Start

Refer to the example files to incorporate compound components, define explicit variants, and organize shared state with context providers for React projects.