You're Using React Compound Components Wrong

Most React compound component tutorials use a `<Select>/<Option>` example that is actually the wrong use case for the pattern. Compound components are designed for layout flexibility with heterogeneous, mostly-static content (tabs, cards, toolbars), not for rendering data-driven lists. When options come from data, a plain props API is simpler, more type-safe, and easier to sort/filter/virtualize. The post also addresses the TypeScript trap of trying to restrict children via `ReactElement` types — which is leaky and unreliable — and instead advocates putting type safety in shared context, optionally using a generic factory function like `createTabs<T extends string>()` to enforce valid tab values at compile time. A quick decision rule is offered: layout → compound components; data → props; need internal state exposed → render props or hooks.