title: Typescript Higher Order Component as Decorator
body: <p>I am trying to use Typescript in my React project but am getting stuck at getting the types for my HOC's to function. Here is a minimal example to showcase what I am having trouble with:</p>
  
  <pre><code>const withDecorator =
      (Wrapped: React.ComponentType): React.ComponentClass =&gt;
          class withDecorator extends Component {
              render() {
                  return &lt;Wrapped {...this.props} /&gt;
              }
          }
  
  @withDecorator
  class Link extends Component&lt;object, object&gt; {
      render() { return &lt;a href="/"&gt;Link&lt;/a&gt; }
  }
  </code></pre>
  
  <p>This returns the error:</p>
  
  <pre><code>'Unable to resolve signature of class decorator when called as an expression.
  Type 'ComponentClass&lt;{}&gt;' is not assignable to type 'typeof Link'.
      Type 'Component&lt;{}, ComponentState&gt;' is not assignable to type 'Link'.
      Types of property 'render' are incompatible.
          Type '() =&gt; string | number | false | Element | Element[] | ReactPortal | null' is not assignable to type '() =&gt; Element'.
          Type 'string | number | false | Element | Element[] | ReactPortal | null' is not assignable to type 'Element'.
              Type 'null' is not assignable to type 'Element'.'
  </code></pre>
  
  <p>I really don't understand why this error occurs. I must be doing something wrong. Things get even more hairy once I introduce props.</p>
  
  <p>I would greatly appreciate the right solution, but I am also very interested in understanding why this error occurs in the first place.</p>
  
  <p>Thanks!</p>