@@ -9,6 +9,7 @@ import type {
9
9
ErrorResponse ,
10
10
Navigation ,
11
11
} from "@remix-run/router" ;
12
+ import { createPath } from "@remix-run/router" ;
12
13
import type {
13
14
LinkProps ,
14
15
NavigationType ,
@@ -315,33 +316,35 @@ let NavLink = React.forwardRef<HTMLAnchorElement, RemixNavLinkProps>(
315
316
) ;
316
317
NavLink . displayName = "NavLink" ;
317
318
export { NavLink } ;
319
+
318
320
/**
319
321
* This component renders an anchor tag and is the primary way the user will
320
322
* navigate around your website.
321
323
*
322
324
* @see https://remix.run/api/remix#link
323
325
*/
324
326
let Link = React . forwardRef < HTMLAnchorElement , RemixLinkProps > (
325
- ( { to : inputTo , prefetch = "none" , children, ...props } , forwardedRef ) => {
326
- let to = inputTo . toString ( ) ;
327
- let isExternal = / ^ [ a - z ] + : / . test ( to ) ;
328
- let href = useHref ( to ) ;
327
+ ( { to, prefetch = "none" , children, ...props } , forwardedRef ) => {
328
+ let location = typeof to === "string" ? to : createPath ( to ) ;
329
+ let isAbsolute =
330
+ / ^ [ a - z + ] + : \/ \/ / i . test ( location ) || location . startsWith ( "//" ) ;
329
331
332
+ let href = useHref ( location ) ;
330
333
let [ shouldPrefetch , prefetchHandlers ] = usePrefetchBehavior (
331
334
prefetch ,
332
335
props
333
336
) ;
334
337
335
- if ( isExternal ) {
338
+ if ( isAbsolute ) {
336
339
return (
337
340
< >
338
- < a ref = { forwardedRef } href = { to } { ...props } { ...prefetchHandlers } >
341
+ < a ref = { forwardedRef } href = { href } { ...props } { ...prefetchHandlers } >
339
342
{ children }
340
343
</ a >
341
344
{ shouldPrefetch ? (
342
345
< >
343
- < link rel = "prerender" href = { to } />
344
- < link rel = "dns-prefetch" href = { to } />
346
+ < link rel = "prerender" href = { href } />
347
+ < link rel = "dns-prefetch" href = { href } />
345
348
</ >
346
349
) : null }
347
350
</ >
0 commit comments