`scrollableTarget` throws error `Type 'HTMLElement' is not assignable to type 'ReactNode'` in React 18

[na2793]

https://codesandbox.io/s/young-frost-ujmz14?file=/src/index.tsx

I recently upgraded my project to React 18, then the following error started to occur :

With React 17, there was no problem at all.

I think HTMLElement has changed to no longer be part of ReactNode.

I knew it was possible to pass id value in form of a string to scrollableTarget, but I couldn't because the node I was trying to pass it to didn't have id.

What's the best way to handle this?

[na2793]

The type of scrollableTarget does not have to be ReactNode, it needs to be HTMLElement.

The value of scrollableTarget is usually a DOM element obtained using useRef(), but useRef() cannot provide a ReactNode other than HTMLElement.

[bauerbach]

This library seems to have been abandoned unfortunately. :(

[ashwary23]

I upgraded from react 17 to react 18 and following issue started

'InfiniteScroll' cannot be used as a JSX component.
  Its instance type 'InfiniteScroll' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'Element' is not assignable to type 'ReactNode'.