Typing children recursively


#1

Ported from https://github.com/reasonml/reason-react/issues/478

I was wondering if something similar to https://github.com/facebook/flow/issues/6611 would be possible with ReasonReact.

In short, would it be possible to type component that accepts only children of a specific type, fragments containing only that specific type, or components that return the same specific type?

For example, a List component that should only render Item components:

<List>
  <Item />
  <ComponentThatRendersASingleItem />
  <>
    <Item />
    <Item />
  <>
  <ComponentThatRendersSeveralItemsInAFragment />
<List>

#2

I wonder how you plan to distinguish your children elements. Components mostly return some VDom values, don’t they? The Flow example uses React.ChildrenArray<React.Element<'div'>>, but a lot of components return <div>, so that particular example doesn’t provide a lot of safety. I can see some value in only accepting <li> as children, but maybe wrapping React.element in some phantom type would cover more cases.

But speaking of cases, what is your use case?