[BUG] Compatibility with React v19

[CHE1RON]

Describe the bug

Currently, when using React v19 (currently RC), it gives an error regarding ref objects being passed to hooks, see here:

To Reproduce

Simply follow the upgrade guide and install React v19 RC, then try to build the project using usehooks-ts.

Expected behavior

build step succeeds

Additional context

No response

[fstaffa]

@CHE1RON I was trying to replicate the problem but I was unable to. Can you confirm it is not caused by https://react.dev/blog/2024/04/25/react-19-upgrade-guide#ref-cleanup-required ?

[CHE1RON]

thanks for letting me know, I'll confirm that and get back to you!

[aaronmw]

Same problem here. Had to cast :(

const containerElementRef = useRef<HTMLDivElement>(null)
const isHovering = useHover(containerElementRef as RefObject<HTMLDivElement>)
//                                              ^ 😭 

[CHE1RON]

Yeah, me too, casting always feels like you were given typesafety candy and then having to give it back ..

[rshackleton]

Same problem here. Had to cast :(

const containerElementRef = useRef<HTMLDivElement>(null)
const isHovering = useHover(containerElementRef as RefObject<HTMLDivElement>)
//                                              ^ 😭 

I'd sooner annotate with @ts-expect-error so the cast can be removed once the type error is resolved.

const containerElementRef = useRef<HTMLDivElement>(null)
// @ts-expect-error React 19 type compatibility, nullable ref can be ignored.
const isHovering = useHover(containerElementRef)

[rtrembecky]

encountered the same problem with useResizeObserver. also outlined e.g. here: ZeeCoder/use-resize-observer#108

[thany]

Same happens for useOnClickOutside.

[iwan-uschka]

I created a PR: #665. Probably solves #650, too.

[juliencrn]

I’m closing this issue as usehooks now supports React 19. Feel free to reopen it if any issues persist or new ones arise.
Apologies for the delay!