From c3c5eca87c909381f17209bfd40c2f9e2f27944b Mon Sep 17 00:00:00 2001
From: MartinBraquet <martin.braquet@gmail.com>
Date: Thu, 30 Jul 2026 19:29:49 +0200
Subject: [PATCH] Allow scroll chaining in short scroll panels by disabling
 `overscroll-behavior` containment

---
 web/components/widgets/scroll-panel.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/web/components/widgets/scroll-panel.tsx b/web/components/widgets/scroll-panel.tsx
index 565dd392..68dbbc44 100644
--- a/web/components/widgets/scroll-panel.tsx
+++ b/web/components/widgets/scroll-panel.tsx
@@ -83,7 +83,16 @@ export function ScrollPanel(props: {
 
   return (
     <div className={clsx('relative', className)}>
-      <div ref={scrollRef} className={clsx('scrollbar-visible', scrollClassName)}>
+      {/* `!overscroll-y-auto`: `.scrollbar-visible` sets `overscroll-behavior: contain`, which is right
+          while the panel has somewhere to go — the page shouldn't lurch once the rail hits its end — but
+          wrong when the content fits. There, containment swallows the wheel entirely and the pointer sits
+          over a dead zone; releasing it lets the gesture chain to the page, so a short rail scrolls the
+          document just like the prose column beside it. `!` because both are single-class selectors and
+          the utility would otherwise lose on source order. */}
+      <div
+        ref={scrollRef}
+        className={clsx('scrollbar-visible', !scrollable && '!overscroll-y-auto', scrollClassName)}
+      >
         {children}
       </div>