Typescript return a function which return a component that has type constraint

Question

Here is my code, but it won't pass typescript validation

import * as React from "react";

export function makeWrapperFn<P, C extends React.ComponentType >(Comp: C, baseProps = {}  ) {
  return (props: Partial<P> = {} ) => {
    // I want this returned function can override the props
    return (<Comp {...baseProps} {...(props)} />);
    // Comp is problem here
  };
}

The error message is:

Type 'Partial<P>' is not assignable to type 'IntrinsicAttributes & LibraryManagedAttributes<C, { children?: ReactNode; }>'.
  Type 'Partial<P>' is not assignable to type 'LibraryManagedAttributes<C, { children?: ReactNode; }>'.ts(2322)

So how do I make this wrapper function maker that with typescript constraint?

Answer 1

Answer in my comment is pretty similar.

But, there is one difference - there is no Partial props.

So I decided to answer, feel free to mark it is as a dublicate.

import * as React from "react";

// If You want to use Partial, please use Partial also in type of Comp

export function makeWrapperFn<P extends object>(Comp: React.ComponentType<Partial<P>>, baseProps = {}  ) {
  return (props: Partial<P>) => {
    // I want this returned function can override the props
    return (<Comp {...baseProps} {...(props)} />);
    // Comp is problem here
  };
}