Flow-like render types?

hmm I actually tried and it’s pretty cumbersome to redefine the return type of a JSX element in practice because mixing the return types of those JSX elements between custom and regular Jsx.element becomes a pain, I’d recommend to just use a regular a function here see playground:

module Header = {
  type t
  external fromElement: React.element => t = "%identity"
  external toElement: t => React.element = "%identity"
}

let s = React.string

module H1 = {
  let make = (~text: string) => {
    {<h1> {s(text)} </h1>}->Header.fromElement
  }
}

module Layout = {
  @react.component
  let make = (~children: Header.t) => <div> {children->Header.toElement} </div>
}

@react.component
let make = () => {
  <Layout> {H1.make(~text="hello")} </Layout>
}

There’s some work ongoing around making React components abstract, it could potentially allow this I think.