TypeScript and React - children type?
In order to use <Aux> in your JSX, it needs to be a function that returns ReactElement<any> | null. That's the definition of a function component.
However, it's currently defined as a function that returns React.ReactNode, which is a much wider type. As React typings say:
type ReactNode = ReactChild | ReactFragment | ReactPortal | boolean | null | undefined;Make sure the unwanted types are neutralized by wrapping the returned value into React Fragment (<></>):
const aux: React.FC<AuxProps> = props => <>{props.children}</>;
You can use ReactChildren and ReactChild:
import React, { ReactChildren, ReactChild } from 'react'; interface AuxProps { children: ReactChild | ReactChildren;}const Aux = ({ children }: AuxProps) => (<div>{children}</div>);export default Aux;If you need to pass flat arrays of elements:
interface AuxProps { children: ReactChild | ReactChild[] | ReactChildren | ReactChildren[];}