Compound Pattern

Table of Contents

• When to Use
• When NOT to Use
• Instructions
• Details
• Source

In our application, we often have components that belong to each other. They're dependent on each other through the shared state, and share logic together. You often see this with components like select, dropdown components, or menu items. The compound component pattern allows you to create components that all work together to perform a task.

When to Use

• Use this when building components like dropdowns, tabs, or menus with related sub-components
• This is helpful when you want to provide a clean component API without exposing internal state management

When NOT to Use