Select: Block scroll on select instead of trying to hide the menu (#36783)

packages/grafana-ui/src/components/Select/SelectBase.tsx

@@ -177,8 +177,6 @@ export function SelectBase<T>({
     closeMenuOnSelect,
     // We don't want to close if we're actually scrolling the menu
     // So only close if none of the parents are the select menu itself
-    closeMenuOnScroll: (scrollEvent: Event) =>
-      !scrollEvent.composedPath().some((pathItem) => (pathItem as Element).classList?.value.includes(styles.menu)),
     defaultValue,
     // Also passing disabled, as this is the new Select API, and I want to use this prop instead of react-select's one
     disabled,
@@ -203,6 +201,7 @@ export function SelectBase<T>({
     menuPlacement,
     menuPortalTarget: document.body,
     menuPosition,
+    menuShouldBlockScroll: true,
     menuShouldScrollIntoView: false,
     onBlur,
     onChange: onChangeWithEmpty,