Fix scrollLock causing nested popovers to be unable to scroll in Ki…

…bana

- using a workaround recommended by `react-focus-on`'s author

package.json

@@ -80,6 +80,7 @@
     "react-focus-on": "^3.7.0",
     "react-input-autosize": "^3.0.0",
     "react-is": "^17.0.2",
+    "react-remove-scroll-bar": "^2.3.4",
     "react-virtualized-auto-sizer": "^1.0.6",
     "react-window": "^1.8.6",
     "refractor": "^3.5.0",

src/components/focus_trap/focus_trap.tsx

@@ -9,6 +9,7 @@
 import React, { Component, CSSProperties } from 'react';
 import { FocusOn } from 'react-focus-on';
 import { ReactFocusOnProps } from 'react-focus-on/dist/es5/types';
+import { RemoveScrollBar } from 'react-remove-scroll-bar';
 
 import { CommonProps } from '../common';
 import { findElementBySelectorOrRef, ElementTarget } from '../../services';
@@ -124,11 +125,21 @@ export class EuiFocusTrap extends Component<EuiFocusTrapProps, State> {
     const focusOnProps = {
       returnFocus,
       noIsolation,
-      scrollLock,
       enabled: !isDisabled,
       ...rest,
       onClickOutside: this.handleOutsideClick,
+      /**
+       * `scrollLock` should always be unset on FocusOn, as it can prevent scrolling on
+       * portals (i.e. popovers, comboboxes, dropdown menus, etc.) within modals & flyouts
+       * @see https://github.com/theKashey/react-focus-on/issues/49
+       */
+      scrollLock: false,
     };
-    return <FocusOn {...focusOnProps}>{children}</FocusOn>;
+    return (
+      <FocusOn {...focusOnProps}>
+        {children}
+        {scrollLock && <RemoveScrollBar />}
+      </FocusOn>
+    );
   }
 }

yarn.lock

@@ -14450,7 +14450,7 @@ react-refresh@^0.11.0:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
   integrity sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==
 
-react-remove-scroll-bar@^2.3.3:
+react-remove-scroll-bar@^2.3.3, react-remove-scroll-bar@^2.3.4:
   version "2.3.4"
   resolved "https://registry.yarnpkg.com/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.4.tgz#53e272d7a5cb8242990c7f144c44d8bd8ab5afd9"
   integrity sha512-63C4YQBUt0m6ALadE9XV56hV8BgJWDmmTPY758iIJjfQKt2nYwoUrPk0LXRXcB/yIj82T1/Ixfdpdk68LwIB0A==