FixedSizeList react 18 typescript problem

[vladimir-palocko-myob]

Hello, not sure where the problem lies, could not find any reasonable explanation and the typing looks good to me, however, I'm not a typescript expert.

When I try to upgrade to the @types/react@18.0.0 and @types/react-dom@18.0.0 I'm getting this error:

Its instance type 'FixedSizeList<any>' is not a valid JSX element.
The types returned by 'render()' are incompatible between these types.
Type 'import("/node_modules/@types/react-dom/node_modules/@types/react/index").ReactNode' is not assignable to type 'React.ReactNode'.
Type '{}' is not assignable to type 'ReactNode'.

If I downgrade back to React/React-dom 17, the error disappears.

Any help or hint will be highly appreciated.

[15373313512]

I also have this problem. React17 is installed in the main project. When using @types/react-window, you will be prompted: Its instance type 'FixedSizeList<any>' is not a valid JSX element. The types returned by 'render()' are incompatible between these types. Type 'import("/node_modules/@types/react-dom/node_modules/@types/react/index").ReactNode' is not assignable to type 'React.ReactNode'. Type '{}' is not assignable to type 'ReactNode'.

[danizord]

Fixed it with some type coercion:

import { ComponentType } from "react";
import { FixedSizeList as _FixedSizeList, FixedSizeListProps } from "react-window";

const FixedSizeList = _FixedSizeList as ComponentType<FixedSizeListProps>;

[glenne]

You might be able to fix it by specifying a resolution in package.json so a mix of 17 and 18 types isn't present:

"resolutions": { "@types/react": "18.0.9", "@types/react-dom": "18.0.4" }

Also in scripts section: "preinstall": "npx npm-force-resolutions"

Remove and reinstall react-window. See https://www.npmjs.com/package/npm-force-resolutions