Enhance dropdown scrolling behavior to prevent wheel event propagation and allow smooth navigation

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)) {