fix: clientOnly marker lost during `addBase()`

src/client/theme-default/components/VPSidebar.vue

@@ -4,9 +4,8 @@ import { inBrowser } from 'vitepress'
 import { ref, watch } from 'vue'
 import { useLayout } from '../composables/layout'
 import VPSidebarGroup from './VPSidebarGroup.vue'
-import { isClientOnly } from '../../shared'
 
-const { sidebarGroups, hasSidebar } = useLayout()
+const { sidebarGroups, hasSidebar, isSidebarClientOnly } = useLayout()
 
 const props = defineProps<{
   open: boolean
@@ -48,7 +47,7 @@ watch(
       </span>
 
       <slot name="sidebar-nav-before" />
-      <ClientOnly :is-client-only="isSidebarClientOnly || isClientOnly(sidebar) || isClientOnly(sidebarGroups)">
+      <ClientOnly :is-client-only="isSidebarClientOnly">
         <VPSidebarGroup :items="sidebarGroups" :key />
       </ClientOnly>
       <slot name="sidebar-nav-after" />

src/client/theme-default/composables/layout.ts

@@ -6,6 +6,7 @@ import { getSidebar, getSidebarGroups } from '../support/sidebar'
 import { useData } from './data'
 import { getHeaders } from './outline'
 import { useCloseSidebarOnEscape } from './sidebar'
+import { isClientOnly } from '../../shared'
 
 const headers = shallowRef<DefaultTheme.OutlineItem[]>([])
 
@@ -33,6 +34,10 @@ export function useLayout() {
 
   const isSidebarEnabled = computed(() => hasSidebar.value && is960.value)
 
+  const isSidebarClientOnly = computed(
+    () => isClientOnly(theme.value.sidebar) || isClientOnly(sidebar.value)
+  )
+
   const sidebarGroups = computed(() => {
     return hasSidebar.value ? getSidebarGroups(sidebar.value) : []
   })
@@ -60,6 +65,7 @@ export function useLayout() {
     sidebarGroups,
     hasSidebar,
     isSidebarEnabled,
+    isSidebarClientOnly,
     hasAside,
     leftAside,
     headers,

src/client/theme-default/support/sidebar.ts

@@ -1,5 +1,5 @@
 import type { DefaultTheme } from 'vitepress/theme'
-import { isActive } from '../../shared'
+import { isActive, propagateClientOnly } from '../../shared'
 import { ensureStartingSlash } from './utils'
 
 export interface SidebarLink {
@@ -108,12 +108,13 @@ export function hasActiveLink(
       : false
 }
 
-function addBase(items: SidebarItem[], _base?: string): SidebarItem[] {
+function addBase(items: SidebarItem[], _base?: string) {
-  return [...items].map((_item) => {
+  const result = [...items].map((_item) => {
     const item = { ..._item }
     const base = item.base || _base
     if (base && item.link) item.link = base + item.link
     if (item.items) item.items = addBase(item.items, base)
-    return item
+    return propagateClientOnly(item, _item)
   })
+  return propagateClientOnly(items, result)
 }

src/shared/shared.ts

@@ -231,13 +231,20 @@ export function escapeHtml(str: string): string {
     .replace(/&(?![\w#]+;)/g, '&')
 }
 
-const CLIENT_ONLY = '[VP_CLIENT_ONLY]'
+const ClientOnlyMarker = Symbol.for('vitepress:client-only')
 
-export function clientOnly<T extends object>(obj: T): T {
+export function clientOnly<T extends object>(object: T) {
-  ;(obj as any)[CLIENT_ONLY] = true
+  ;(object as any)[ClientOnlyMarker] = true
-  return obj
+  return object
 }
 
-export function isClientOnly<T = any>(obj: T) {
+export function isClientOnly<T extends object>(object?: T): boolean {
-  return Boolean((obj as any)?.[CLIENT_ONLY])
+  return (object as any)?.[ClientOnlyMarker] ?? false
+}
+
+export function propagateClientOnly<T extends object>(src: T, dst: T): T {
+  if (isClientOnly(src)) {
+    clientOnly(dst)
+  }
+  return dst
 }