typescript Общий тип для функциональных и классовых компонентов React

Универсальным типом одновремено подходящим для классовых и функциональных компонентов , судя по всему, является React.ComponentType (далее его сигнатура из исходников React):

type ComponentType<P = {}>
     = ComponentClass<P> | FunctionComponent<P>;

-- подходит в т.ч. для случая когда вы получаете переменную, а потом делаете из неё JSX-элемент (добавляя к имени угловые скобки и выставляя пропсы)

Например:



export interface MyPropsType {
    id: 'A' | 'B' | "C";
    label: string;
}
export interface ConfigElement extends MyPropsType {
component:
    React.ComponentType<MyPropsType>;
}

export interface SomeMainComponentProps {
    elements: ConfigElement[];
}

// отрендерит массив классовых или функциональных компонентов
// render array of functional or class components
export function SomeMainComponent(
      { elements }: SomeMainComponentProps) {

return (
    <>
    {elements.map(({ id, label, component: ComponentElement}) => {
        return (
        <ComponentElement
            id={id}
            key={Array.isArray(id) ? (id[0] as string) : (id as string)}
            label={label}
        />
        );
    })}
    </>
);
}

Что ещё почитать: