diff --git a/dicom-viewer/src/App.tsx b/dicom-viewer/src/App.tsx index ba5e561..8be1810 100644 --- a/dicom-viewer/src/App.tsx +++ b/dicom-viewer/src/App.tsx @@ -3089,7 +3089,30 @@ function App({ container_id, imageStacks, autoCacheStack, annotationJson, viewer }} role="listbox" onMouseDown={e => e.stopPropagation()} - onWheel={e => { /* trap handled elsewhere */ }} + onWheel={(e) => { + // Prevent the wheel from bubbling up to the viewport (which listens for wheel + // to perform stack scrolling). Instead, scroll the dropdown itself so the + // user can use the mouse wheel to navigate the list. + try { + e.stopPropagation(); + } catch (err) { + // ignore + } + // Prevent page/parent default scrolling and manually adjust scrollTop so we + // don't rely on the parent's wheel handlers. + try { + e.preventDefault(); + } catch (err) { + // ignore + } + const el = e.currentTarget as HTMLElement | null; + if (el) { + // React's WheelEvent type differs from the DOM WheelEvent; safely + // read deltaY via any to avoid casting issues. + const delta = (e as any).deltaY ?? ((e.nativeEvent as any)?.deltaY ?? 0); + el.scrollTop += delta; + } + }} onBlur={e => { setTimeout(() => { if (!(e.currentTarget as HTMLElement).contains(document.activeElement)) {