title: Forwarding Props to React Component flow
body: <p>The basic idea of forwarding props is that I want to enhance an element,
  by composing it. E.g.</p>
  
  <pre><code>class MyButton extends Component {
      render() {
          const { busy, children, ...props } = this.props
          return &lt;button { ...props }&gt;
              { busy ? "busy" : children }
          &lt;/button&gt;
      }
  }
  </code></pre>
  
  <p>Here I can add an extra property (busy) to the button element,
  but still have all the properties of the button element passed to the
  "real" button.
  This saves me a lot of writing, since I don't have to write every
  property again. Also if the button interface gets changed my button wrapper
  will adapt automatically.</p>
  
  <p>Now I want to do the same thing with flow type annotations.</p>
  
  <pre><code>class Button extends Component&lt;props_t, state_t&gt; {
      render() { ... }
  }
  </code></pre>
  
  <p>But how should I define the props_t.
  If I write</p>
  
  <pre><code>type props_t = { busy: boolean }
  </code></pre>
  
  <p>this would only accept a busy property.</p>
  
  <p>My idea was to use a union type and do something like this:</p>
  
  <pre><code>import type { ElementProps } from "react"
  
  const button = props =&gt; &lt;button { ...props } /&gt;
  type props_t = {
      busy: boolean
  } | ElementProps&lt;(typeof button)&gt;
  </code></pre>
  
  <p>Actually this seams to work, but looks more like a hack because the
  props must first be inferred.</p>
  
  <p>Does anybody know a better approach, or how it is typically done?</p>
  
  <p>EDIT:</p>
  
  <p>After some tests I came to the conclusion that the solution above does not work.</p>