Si tengo lo siguiente:

 interface TestProps { test: string } const TestComponent = (props: TestProps) => <>{props.test}</>; interface OtherProps { test2: number } const OtherComponent = (props: OtherProps) => <>{props.test2}</>;

¿Cómo puedo asegurarme de que una variable es un elemento JSX derivado de TestComponent , pero no OtherComponent ?

Por ejemplo, lo siguiente debería funcionar bien:

 const testElement: ReactElement<TestProps> = <TestComponent test="hi"/>; // OK

Pero esto no debería funcionar:

 const testElement: ReactElement<TestProps> = <OtherComponent test2={6}/>; // Warning

Ayuda muy apreciada