React 18 typescript problem

React has recently released version 18 and along with it also a tightened type checking. This results in many error related to the children property on components.

 TS2769: No overload matches this call.
 Overload 1 of 2, '(props: ReflexElementProps | Readonly<ReflexElementProps>): ReflexElement', gave the following error.
<e>     Type '{ children: never[]; key: string; direction: -1; ref: MutableRefObject<ReflexElement | null>; className: any; size: number; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexElement> & Readonly<ReflexElementProps>'.
<e>       Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexElement> & Readonly<ReflexElementProps>'.
<e>   Overload 2 of 2, '(props: ReflexElementProps, context: any): ReflexElement', gave the following error.
<e>     Type '{ children: never[]; key: string; direction: -1; ref: MutableRefObject<ReflexElement | null>; className: any; size: number; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexElement> & Readonly<ReflexElementProps>'.
<e>       Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexElement> & Readonly<ReflexElementProps>'.

 TS2769: No overload matches this call.
<e>   Overload 1 of 2, '(props: ReflexContainerProps | Readonly<ReflexContainerProps>): ReflexContainer', gave the following error.
<e>     Type '{ children: Element[]; key: string; orientation: "horizontal"; style: { height: number; }; windowResizeAware: true; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexContainer> & Readonly<ReflexContainerProps>'.
<e>       Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexContainer> & Readonly<ReflexContainerProps>'.
<e>   Overload 2 of 2, '(props: ReflexContainerProps, context: any): ReflexContainer', gave the following error.
<e>     Type '{ children: Element[]; key: string; orientation: "horizontal"; style: { height: number; }; windowResizeAware: true; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexContainer> & Readonly<ReflexContainerProps>'.
<e>       Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<ReflexContainer> & Readonly<ReflexContainerProps>'.

I’m not a typescript expert but seems to me like children now has to be explicitly defined as a prop type.

[leefsmp]

I will take a look at this asap …

[leefsmp]

@akphi check version 4.0.8 please. ts definition should now be up-to-date. @AnabelSalomone, renderOnResizeRate was removed from the code as it caused problems, sorry for the bad news. I would need to look into it again at some point. If you have troubles with resizing, log an issue pls.