React Children 재귀 순회 - 가능하지만 비추천 (496.md에 코드)

문제점:

  • 암묵적 의존성: 중첩된 Tab이 동작하는지 사용자가 예측 불가
  • 타입 안전성 부족: required prop 누락이 컴파일 타임에 안 잡힘
  • 성능: 매 렌더마다 전체 트리 순회
// ❌ 마법처럼 동작 (예측 불가)
<Tabs>{/* 어디에 넣든 Tab 찾아줌 */}</Tabs>

// ✅ Compound Component
<Tabs.Root>
  <Tabs.List><Tabs.Trigger value="a">A</Tabs.Trigger></Tabs.List>
  <Tabs.Content value="a">Content</Tabs.Content>
</Tabs.Root>

React 팀도 2021년부터 Children API 사용 권장하지 않음: “Using Children is uncommon and can lead to fragile code”

라이브러리: react-children-utilities - deepMap, deepFind, deepFilter

React의 이중성: “선언형”이라면서 Children API로 명령형 트리 순회 제공. 역사적 이유 (2013년엔 Context API도 없었음).

#502