fix(OverflowMenu): fix <ClickOutside> not covering floating menu (car…

…bon-design-system#906) Fixes carbon-design-system#628.
joshblack · May 21, 2018 · dddd7f6 · dddd7f6
1 parent 37acad3
commit dddd7f6
Showing 1 changed file with 10 additions and 4 deletions.
diff --git a/src/components/OverflowMenu/OverflowMenu.js b/src/components/OverflowMenu/OverflowMenu.js
@@ -257,8 +257,10 @@ export default class OverflowMenu extends Component {
     }
   };
 
-  handleClickOutside = () => {
-    this.closeMenu();
+  handleClickOutside = evt => {
+    if (!this._menuBody || !this._menuBody.contains(evt.target)) {
+      this.closeMenu();
+    }
   };
 
   closeMenu = () => {
@@ -275,8 +277,11 @@ export default class OverflowMenu extends Component {
    * @private
    */
   _bindMenuBody = menuBody => {
-    if (!menuBody && this._hFocusIn) {
-      this._hFocusIn = this._hFocusIn.release();
+    if (!menuBody) {
+      this._menuBody = menuBody;
+      if (this._hFocusIn) {
+        this._hFocusIn = this._hFocusIn.release();
+      }
     }
   };
 
@@ -287,6 +292,7 @@ export default class OverflowMenu extends Component {
    */
   _handlePlace = menuBody => {
     if (menuBody) {
+      this._menuBody = menuBody;
       (
         menuBody.querySelector('[data-floating-menu-primary-focus]') || menuBody
       ).focus();