From ba407ae795328aba31f2f0f110ee5b88b8842069 Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Wed, 26 Nov 2025 11:06:51 +0100
Subject: [PATCH] feat(Link): automatically use `localePath` from
 `@nuxtjs/i18n`

---
 src/runtime/components/Link.vue | 22 ++++++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/runtime/components/Link.vue b/src/runtime/components/Link.vue
index a07f8f44c2..f6da111b4c 100644
--- a/src/runtime/components/Link.vue
+++ b/src/runtime/components/Link.vue
@@ -96,8 +96,9 @@ import { computed } from 'vue'
 import { isEqual } from 'ohash/utils'
 import { useForwardProps } from 'reka-ui'
 import { defu } from 'defu'
+import { hasProtocol } from 'ufo'
 import { reactiveOmit } from '@vueuse/core'
-import { useRoute, useAppConfig } from '#imports'
+import { useRoute, useAppConfig, useNuxtApp } from '#imports'
 import { mergeClasses } from '../utils'
 import { tv } from '../utils/tv'
 import { isPartiallyEqual } from '../utils/link'
@@ -115,6 +116,7 @@ defineSlots<LinkSlots>()
 
 const route = useRoute()
 const appConfig = useAppConfig() as Link['AppConfig']
+const nuxtApp = useNuxtApp()
 
 const nuxtLinkProps = useForwardProps(reactiveOmit(props, 'as', 'type', 'disabled', 'active', 'exact', 'exactQuery', 'exactHash', 'activeClass', 'inactiveClass', 'to', 'href', 'raw', 'custom', 'class'))
 
@@ -130,7 +132,23 @@ const ui = computed(() => tv({
   }, appConfig.ui?.link || {})
 }))
 
-const to = computed(() => props.to ?? props.href)
+const to = computed(() => {
+  const path = props.to ?? props.href
+  if (!path) return path
+
+  // Skip external links and absolute URLs
+  if (props.external || (typeof path === 'string' && hasProtocol(path, { acceptRelative: true }))) {
+    return path
+  }
+
+  // Use localePath from `@nuxtjs/i18n` if available
+  const localePath = nuxtApp.$localePath as ((route: RouteLocationRaw) => RouteLocationRaw) | undefined
+  if (localePath) {
+    return localePath(path)
+  }
+
+  return path
+})
 
 function isLinkActive({ route: linkRoute, isActive, isExactActive }: any) {
   if (props.active !== undefined) {