feat(theme): allow specifying rel and target in logoLink

closes #3264 closes #3271
vuejs · Dec 31, 2023 · 6c89943 · 6c89943
1 parent 2c4f271
commit 6c89943
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 3 deletions.
diff --git a/src/client/theme-default/components/VPNavBarTitle.vue b/src/client/theme-default/components/VPNavBarTitle.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { computed } from 'vue'
 import { useData } from '../composables/data'
 import { useLangs } from '../composables/langs'
 import { useSidebar } from '../composables/sidebar'
@@ -8,11 +9,34 @@ import VPImage from './VPImage.vue'
 const { site, theme } = useData()
 const { hasSidebar } = useSidebar()
 const { currentLang } = useLangs()
+
+const link = computed(() =>
+  typeof theme.value.logoLink === 'string'
+    ? theme.value.logoLink
+    : theme.value.logoLink?.link
+)
+
+const rel = computed(() =>
+  typeof theme.value.logoLink === 'string'
+    ? undefined
+    : theme.value.logoLink?.rel
+)
+
+const target = computed(() =>
+  typeof theme.value.logoLink === 'string'
+    ? undefined
+    : theme.value.logoLink?.target
+)
 </script>
 
 <template>
   <div class="VPNavBarTitle" :class="{ 'has-sidebar': hasSidebar }">
-    <a class="title" :href="theme.logoLink ?? normalizeLink(currentLang.link)">
+    <a
+      class="title"
+      :href="link ?? normalizeLink(currentLang.link)"
+      :rel="rel"
+      :target="target"
+    >
       <slot name="nav-bar-title-before" />
       <VPImage v-if="theme.logo" class="logo" :image="theme.logo" />
       <template v-if="theme.siteTitle">{{ theme.siteTitle }}</template>

diff --git a/types/default-theme.d.ts b/types/default-theme.d.ts
@@ -20,7 +20,7 @@ export namespace DefaultTheme {
     /**
      * Overrides the link of the site logo.
      */
-    logoLink?: string
+    logoLink?: string | { link?: string; rel?: string; target?: string }
 
     /**
      * Custom site title in navbar. If the value is undefined,
@@ -174,8 +174,8 @@ export namespace DefaultTheme {
      * RegExp object here because it isn't serializable
      */
     activeMatch?: string
-    target?: string
     rel?: string
+    target?: string
   }
 
   export interface NavItemChildren {