Simply doesnt seem to want to work with a simple component. Crashes even in the simplest usage.

[davesargrad]

My code is quite simple.. and yet I can't seem to even get useResizeObserver working in the simplest scenario.

import React from "react";
import useResizeObserver from "use-resize-observer";
import AnnotatedPlayer from 'components/annotated_player/AnnotatedPlayer'

export default function Home() {
    const { ref, width, height } = useResizeObserver<HTMLDivElement>();
    return <>
        <AnnotatedPlayer />
    </>;

}

Crash:

I've also tried to pass in a ref (that i create using useref).. then i see a different failure (the call to useResizeObserver then just returns false.

My package.json has the following entry "use-resize-observer": "^7.0.0",

Here is the actual div that i was going to resize..

export default function Home() {
    const { ref, width, height } = useResizeObserver<HTMLDivElement>();
    return <>
        <div 
        ref={ref}  
        style={{ width: 100, height: 400, resize: "both", background: "red", display: "inline-block", border: "2px solid", overflow: "hidden"}} >
              Size: {width}x{height}
        </div>
    </>;
}