I am trying to pass a ref to my div via a callback function

 const inputRefs: React.MutableRefObject<HTMLDivElement[]> = React.useRef<HTMLDivElement[]>([]);
<div
  tabIndex={index}
  ref={el => (inputRefs.current[index] = el!)}
>
  <CgNotes className="self-center" />
  {note.title}
</div>

I keep getting the following error in typescript

Type ‘(el: HTMLDivElement | null) => HTMLDivElement’ is not assignable to type ‘LegacyRef | undefined’.
Type ‘(el: HTMLDivElement | null) => HTMLDivElement’ is not assignable to type ‘(instance: HTMLDivElement | null) => void | (() => VoidOrUndefinedOnly)’.
Type ‘HTMLDivElement’ is not assignable to type ‘void | (() => VoidOrUndefinedOnly)’.ts(2322)
index.d.ts(303, 9): The expected type comes from property ‘ref’ which is declared here on type ‘DetailedHTMLProps<HTMLAttributes, HTMLDivElement>’