From 0a96bae50b907b70a3cd712f98514ce77086496a Mon Sep 17 00:00:00 2001
From: xbsheng <xxbsheng@gmail.com>
Date: Thu, 13 Aug 2026 01:24:53 +0800
Subject: [PATCH] fix(theme): prevent scroll chaining in local nav outline
 dropdown (#5367)

---
 .../components/VPLocalNavOutlineDropdown.vue             | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/client/theme-default/components/VPLocalNavOutlineDropdown.vue b/src/client/theme-default/components/VPLocalNavOutlineDropdown.vue
index 1197ea10..307a22bd 100644
--- a/src/client/theme-default/components/VPLocalNavOutlineDropdown.vue
+++ b/src/client/theme-default/components/VPLocalNavOutlineDropdown.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { onKeyStroke } from '@vueuse/core'
-import { onContentUpdated } from 'vitepress'
+import { onKeyStroke, useScrollLock } from '@vueuse/core'
+import { inBrowser, onContentUpdated } from 'vitepress'
 import type { DefaultTheme } from 'vitepress/theme'
 import { nextTick, ref, watch } from 'vue'
 import { useData } from '../composables/data'
@@ -18,6 +18,9 @@ const vh = ref(0)
 const main = ref<HTMLDivElement>()
 const items = ref<HTMLDivElement>()
 
+// lock body scroll while the dropdown is open to prevent scroll chaining
+const isLocked = useScrollLock(inBrowser ? document.body : null)
+
 function closeOnClickOutside(e: Event) {
   if (!main.value?.contains(e.target as Node)) {
     open.value = false
@@ -25,6 +28,7 @@ function closeOnClickOutside(e: Event) {
 }
 
 watch(open, (value) => {
+  isLocked.value = value
   if (value) {
     document.addEventListener('click', closeOnClickOutside)
     return
@@ -148,6 +152,7 @@ function scrollToTop() {
   background-color: var(--vp-c-gutter);
   max-height: calc(var(--vp-vh, 100vh) - 5.375rem);
   overflow: hidden auto;
+  overscroll-behavior: contain;
   box-shadow: var(--vp-shadow-3);
 }