advanced

Compound components

Координируйте связанные дочерние компоненты через context и общий state, сохраняя декларативные API.

Compound-компоненты делят один UI-паттерн на именованные части — `Tabs`, `Tabs.List`, `Tabs.Panel` — которые делят неявный state через context. Потребитель гибко собирает разметку, а родитель координирует выбор, id и клавиатурное поведение.

API остаётся декларативным: пользователь компонует части, а не настраивает каждую деталь через props. Реализация обычно использует context плюс явные подкомпоненты. Доступность (roles, roving tabindex) часто сосредоточена в координирующей оболочке.

На интервью объясняйте концепцию на конкретном примере и называйте поведение, которое проверяют.

Типовые ошибки: скрывать поток данных, дробить компоненты чрезмерно и выполнять побочные эффекты в render.

Компромисс часто между ясностью и переиспользованием или между явными props и удобством.

Чеклист:

  • Общий state между частями через context.
  • Декларативная вёрстка для потребителя.
  • Централизуйте a11y в координаторе.