How to correctly use HOC with two kinds of props

I'm having trouble figuring out how to apply HOCs to this situation. I want to wrap existing components, since they all do very similar things. Here's a simplified version my current setup:

function CreateComponentHere(props: BaseProps): JSX.Element {    return <ComponentWithComponentProps />;}export const NewComponent = withBaseProps<BaseProps>(CreateComponentHere);

-

export function withBaseProps<T extends BaseProps>(WrappedComponent: ComponentType<ComponentProps>) {    return (props: T): JSX.Element => {        return (<WrappedComponent componentprop={props.valueForComponentProp}/>        );    }}

With this I finally have the componentprop pointing to the right type (ComponentProps) while the standard props are of type BaseProps.However, right now typescript complains about:export const NewComponent = withBaseProps<BaseProps>(CreateComponentHere); with the error:

Argument of type '(props: BaseProps) => Element' is not assignable to parameter of type 'ComponentType'.

What am I missing?