title: React & Typescript passing HTML types into custom hook
body: <p>How would I pass the type annotation using the <code>as SVGElement</code> or <code>as HTMLDivElement</code> etc...
  into a hook</p>
  <pre class="lang-js prettyprint-override"><code>function AppSVG(){
      const ref = useResizeObserver((entry) =&gt; {
          ...
      }) as SVGElement;// &lt;- how do I pass SVGElement to the hook
  
      return &lt;svg ref={ref} /&gt;
  }
  
  function AppDiv(){
      const ref = useResizeObserver((entry) =&gt; {
          ...
      }) as HTMLDivElement;// &lt;- how do I pass HTMLDivElement to the hook
  
      return &lt;div ref={ref} /&gt;
  }
  </code></pre>
  <p>The hook</p>
  <pre class="lang-js prettyprint-override"><code>
  function useResizeObserver(observerCallback: ResizeObserverCallback) {
      const ref = React.useRef&lt;any&gt;(null);//&lt;- into the ref
  
      React.useEffect(() =&gt; {
          if (!!ref &amp;&amp; !!ref.current)
              new ResizeObserver(observerCallback).observe(ref.current);
      }, []);
  
      return ref;
  }
  </code></pre>