Fix primefaces#6123: Dropdown scroll into view on focus

melloware · Apr 23, 2024 · a46c533 · a46c533
1 parent 6ef3a90
commit a46c533
Showing 1 changed file with 11 additions and 5 deletions.
diff --git a/components/lib/dropdown/Dropdown.js b/components/lib/dropdown/Dropdown.js
@@ -844,10 +844,16 @@ export const Dropdown = React.memo(
         };
 
         const scrollInView = () => {
-            const highlightItem = DomHandler.findSingle(overlayRef.current, 'li[data-p-highlight="true"]');
+            const focusedItem = DomHandler.findSingle(overlayRef.current, 'li[data-p-focused="true"]');
 
-            if (highlightItem && highlightItem.scrollIntoView) {
-                highlightItem.scrollIntoView({ block: 'nearest', inline: 'nearest' });
+            if (focusedItem && focusedItem.scrollIntoView) {
+                focusedItem.scrollIntoView({ block: 'nearest', inline: 'nearest' });
+            } else {
+                const highlightItem = DomHandler.findSingle(overlayRef.current, 'li[data-p-highlight="true"]');
+
+                if (highlightItem && highlightItem.scrollIntoView) {
+                    highlightItem.scrollIntoView({ block: 'nearest', inline: 'nearest' });
+                }
             }
         };
 
@@ -945,10 +951,10 @@ export const Dropdown = React.memo(
         });
 
         useUpdateEffect(() => {
-            if (overlayVisibleState && props.value) {
+            if (overlayVisibleState && (props.value || focusedOptionIndex >= 0)) {
                 scrollInView();
             }
-        }, [overlayVisibleState, props.value]);
+        }, [overlayVisibleState, props.value, focusedOptionIndex]);
 
         useUpdateEffect(() => {
             if (overlayVisibleState && filterState && props.filter) {