problems with useRef

[njavilas2015]

good I am using react and preact in a component which is a simple input when using useRef it generates errors

import { Ref, useEffect, useRef, useState } from "preact/hooks";
import { styled } from "goober";

const Video = styled('video')`

`

const App = () => {

  const elementRef: Ref<HTMLVideoElement | null> = useRef<HTMLVideoElement | null>(null)

  useEffect(() => {

    const element: HTMLVideoElement | null = elementRef.current // DOM Ref

    console.log(element)
  }, [])

  return (
    <div>

      <Video ref={elementRef} >

    </div >
  )
}

export default App

if I don't use goober it works, but when I incorporate it as in the example, there is no reference

more info
I made a comparison between goober and style in line and I observed differences that perhaps the error occurred

with goober

without goober

[jjjtoikka]

I got it working like this

export const StyledContainer = styled(
  'div',
  React.forwardRef
)<Props>((props) => {...styles});

in your case just

const Video = styled('video', React.forwardRef)``

Cheers, J