No values reported when using React StrictMode

Hi,

I am using this hook in one of my projects in conjunction with React 18 and Strict Mode. However, it appears that the hook does not report any values when used together with React Strict Mode.

See the following CodeSandbox for a demonstration of this issue.

This issue is caused by the fact that React Strict Mode renders components twice in development mode in order to detect problems. In particular, this behavior causes problems with the following logic (for tracking unmounts):

https://github.com/ZeeCoder/use-resize-observer/blob/653b0b98d5614b083835880736555b79536326aa/src/index.ts#L196-L200

Because the component is rendered twice, the component is marked as unmounted and no further size updates are reported by the hook.

I believe the following patch should resolve this issue:

  const didUnmount = useRef(false);
  useEffect(() => {
+   didUnmount.current = false;
    return () => {
      didUnmount.current = true;
    };
  }, []);

[github-actions[bot]]

🎉 This issue has been resolved in version 9.0.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[ZeeCoder]

Hopefully I’ll have some time this weekend to wrap things up 🤞