title: Property does not exist on type 'IntrinsicAttributes & { children?: ReactNode; }'
body: <p>I have react project created by <code>Create-React-App</code> having following packages (mentioning packages related to my issue) :</p>
  
  <pre><code>"react": "^16.13.1",
  "react-dom": "^16.13.1",
  "react-router-dom": "^5.1.2",
  "react-scripts": "3.4.1",
  "typescript": "^3.9.2",
  "@typescript-eslint/eslint-plugin": "^2.33.0",
  "@typescript-eslint/parser": "^2.33.0"
  </code></pre>
  
  <p>i have created a simple HOC (which does nothing as of now, but i'll add my logic later) like this :</p>
  
  <pre><code>type Props = {
      [key: string]: any;
  };
  
  
  const connect = function (Component: FunctionComponent): FunctionComponent {
      const ComponentWrapper = function (props: Props): ReactElement {
          return &lt;Component {...props} /&gt;;
      };
  
      return ComponentWrapper;
  };
  </code></pre>
  
  <p>and exported my component like this :</p>
  
  <pre><code>    const Test: FunctionComponent&lt;Props&gt; = function ({ message }: Props) {
          return (
              &lt;div&gt;{message}&lt;/div&gt;
          );
      };
  
  
  export default connect(Test);
  </code></pre>
  
  <p>and using this component like this :</p>
  
  <pre><code>&lt;Test message="Testing message" /&gt;
  </code></pre>
  
  <p>But getting error in compiler :</p>
  
  <pre><code>Type '{ message: string; }' is not assignable to type 'IntrinsicAttributes &amp; { children?: ReactNode; }'.
    Property 'message' does not exist on type 'IntrinsicAttributes &amp; { children?: ReactNode; }'.  TS2322
  </code></pre>
  
  <p>I have tried what people have suggested in other similar Stack Overflow questions and article found on Google, but nothing worked till yet. </p>