title: Using React functional component as a Type
body: <p>I am able to use a React class component (i.e. <code>React.Component</code>) as a Type but unable to use functional/stateless components. Here is an example:</p>
  
  <pre><code>import Footer from 'path/to/component/Footer';
  
  interface ComponentProps {
      customFooter: (Footer)
  }
  
  class MyComponent extends React.Component&lt;ComponentProps&gt; {
      render() {
          return (
              &lt;div&gt;
                  {this.props.customFooter}
              &lt;/div&gt;
          );
      }
  }
  </code></pre>
  
  <p><strong>Footer.tsx</strong></p>
  
  <pre><code>const Footer: React.StatelessComponent&lt;{ children?: any }&gt; = ({ children }) =&gt; (
      &lt;footer&gt;
          &lt;div&gt;
              {children}
          &lt;/div&gt;
      &lt;/footer&gt;
  );
  
  export default Footer;
  </code></pre>
  
  <p>The red underline is under the <code>(Footer)</code> and reads: <code>Cannot find name 'Footer'</code>. </p>
  
  <p>I've discovered that if I use a React class component instead of a functional component, my issue goes away.  Why is it that I cannot use a functional component  and is there a way for me to do so?</p>