title: How to create a union type with components?
body: <p>Let's say that I have a helper function that returns wrapper around a generic component with some constant </p>
  
  <pre><code>function fooBar(ComponentVariant: ComponentVariantType) {
    return (
      &lt;Foo&gt;
       &lt;ComponentVariant&gt;
         &lt;Bar /&gt;
       &lt;/ComponentVariant&gt;
      &lt;/Foo&gt;
    );
  }
  </code></pre>
  
  <p>where <code>ComponentVariantType</code> is something like <code>type ComponentVariantType = FunctionalComponentA | FunctionalComponentB | FunctionalComponentC</code>.</p>
  
  <p>Right now I get a build error saying:</p>
  
  <pre><code>FunctionalComponentA refers to a value, but is being used as a type here.
  FunctionalComponentB refers to a value, but is being used as a type here.
  FunctionalComponentC refers to a value, but is being used as a type here.
  </code></pre>