ForwardedRef not assignable to ref type
jeremy-flusin opened this issue · comments
Issue description
Hi there,
When trying to use a forwarded ref with the component, I encountered the following TypeScript error:
TS2769: No overload matches this call.
Overload 1 of 2 , (props: Props | Readonly<Props>): ReactSVG , gave the following error.
Type ForwardedRef<HTMLDivElement> is not assignable to type
((string | ((instance: ReactSVG | null) => void) | RefObject<ReactSVG>) & ((string | ((instance: HTMLWrapperType | null) => void) | RefObject<...>) & (string | ... 1 more ... | RefObject<...>))) | null | undefined
Overload 2 of 2 , (props: Props, context: any): ReactSVG , gave the following error.
Type ForwardedRef<HTMLDivElement> is not assignable to type
((string | ((instance: ReactSVG | null) => void) | RefObject<ReactSVG>) & ((string | ((instance: HTMLWrapperType | null) => void) | RefObject<...>) & (string | ... 1 more ... | RefObject<...>))) | null | undefined
Reproducer
I've created a CodeSandbox demonstrating the issue.
Attemped workaround
I tried to change the ForwardedRef type to HTMLDivElement
, HTMLSpanElement
or SVGSVGElement
with no success.
With type assertion ref={ref as any}
compilation works fine, and the runtime behaviour is as expected.
Thank you for your time and attention to this matter.