What problem does it solve? React components often grow unwieldy as they accumulate boolean and variant props, or when sibling components need to share implicit state without prop drilling. This Skill provides concrete patterns for designing flexible component APIs that stay maintainable as requirements grow. ## Core Features & Use Cases - Composition over inheritance: Split large components into small pieces like Card, CardHeader, and CardBody instead of one component with many flags. - Compound components: Coordinate siblings like Tabs and Tab through React Context so they share state without prop drilling. - Render props: Let a component own async or derived state while the caller controls how each phase (loading, error, data) renders. - Use Case: When a Button component has grown to accept ten boolean props like isPrimary, isLarge, and hasIcon, refactor it into composable sub-components, or when building a Tabs interface where Tab items must read and update the active tab. ## Quick Start Refactor this React component that has too many boolean props into composable sub-components using composition patterns.
