fix(core): link component ref type is too restrictive (#6464) Resolves …

…#6463

.changeset/three-cameras-hope.md

@@ -0,0 +1,17 @@
+---
+"@refinedev/core": patch
+---
+
+fix: Added more flexibility to the [`<Link />`](https://refine.dev/docs/routing/components/link/) component's `ref` type by changing it from `HTMLAnchorElement` to `Element`.
+From now on, we can pass any type of `ref` to the [`<Link />`](https://refine.dev/docs/routing/components/link/) component.
+
+```tsx
+// Before fix - Only worked with HTMLAnchorElement
+const ref = useRef<HTMLAnchorElement>(null);
+
+// After fix - Works with any Element type
+const ref = useRef<HTMLDivElement>(null);
+const ref = useRef<HTMLSpanElement>(null);
+```
+
+Resolves [#6463](https://github.com/refinedev/refine/issues/6463)

documentation/docs/routing/components/link/index.md

@@ -1,5 +1,6 @@
 ---
 title: <Link />
+source: packages/core/src/components/link/index.tsx
 ---
 
 `<Link />` is a component that is used to navigate to different pages in your application.

packages/core/src/components/link/index.tsx

@@ -13,9 +13,7 @@ type LinkPropsWithTo = {
 };
 
 export type LinkProps<TProps = {}> = React.PropsWithChildren<
-  (LinkPropsWithGo | LinkPropsWithTo) &
-    React.AnchorHTMLAttributes<HTMLAnchorElement> &
-    TProps
+  (LinkPropsWithGo | LinkPropsWithTo) & TProps
 >;
 
 /**
@@ -25,7 +23,7 @@ export type LinkProps<TProps = {}> = React.PropsWithChildren<
  */
 const LinkComponent = <TProps = {}>(
   props: LinkProps<TProps>,
-  ref: Ref<HTMLAnchorElement>,
+  ref: Ref<Element>,
 ) => {
   const routerContext = useContext(RouterContext);
   const LinkFromContext = routerContext?.Link;
@@ -70,5 +68,5 @@ const LinkComponent = <TProps = {}>(
 };
 
 export const Link = forwardRef(LinkComponent) as <T = {}>(
-  props: LinkProps<T> & { ref?: Ref<HTMLAnchorElement> },
+  props: LinkProps<T> & { ref?: Ref<Element> },
 ) => ReturnType<typeof LinkComponent>;