From b524ef1af6c662bc4ebcd87ad95aa99dd077a119 Mon Sep 17 00:00:00 2001
From: Ghislain B <gbeaulac@gmail.com>
Date: Sat, 28 Oct 2023 22:45:26 -0400
Subject: [PATCH] fix(common): clicking Menu close button should only close
 current menu (#1160)

- prior to this PR, clicking a close button would close all type of menus but in theory it should only close the targeted Menu instead of all menus
---
 packages/common/src/extensions/menuFromCellBaseClass.ts | 2 +-
 packages/common/src/extensions/slickColumnPicker.ts     | 2 +-
 packages/common/src/extensions/slickHeaderMenu.ts       | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/common/src/extensions/menuFromCellBaseClass.ts b/packages/common/src/extensions/menuFromCellBaseClass.ts
index c26a61924..46595d72a 100644
--- a/packages/common/src/extensions/menuFromCellBaseClass.ts
+++ b/packages/common/src/extensions/menuFromCellBaseClass.ts
@@ -247,7 +247,7 @@ export class MenuFromCellBaseClass<M extends CellMenu | ContextMenu> extends Men
         isMenuClicked = true;
       }
 
-      if (this.menuElement !== e.target && !isMenuClicked && !e.defaultPrevented || e.target.className === 'close' && parentMenuElm) {
+      if (this.menuElement !== e.target && !isMenuClicked && !e.defaultPrevented || (e.target.className === 'close' && parentMenuElm)) {
         this.closeMenu(e, { cell: this._currentCell, row: this._currentRow, grid: this.grid });
       }
     }
diff --git a/packages/common/src/extensions/slickColumnPicker.ts b/packages/common/src/extensions/slickColumnPicker.ts
index e20cf5f71..5507025f4 100644
--- a/packages/common/src/extensions/slickColumnPicker.ts
+++ b/packages/common/src/extensions/slickColumnPicker.ts
@@ -175,7 +175,7 @@ export class SlickColumnPicker {
 
   /** Mouse down handler when clicking anywhere in the DOM body */
   protected handleBodyMouseDown(e: DOMMouseOrTouchEvent<HTMLDivElement>) {
-    if ((this._menuElm !== e.target && !this._menuElm.contains(e.target)) || e.target.className === 'close') {
+    if ((this._menuElm !== e.target && !this._menuElm.contains(e.target)) || (e.target.className === 'close' && e.target.closest('.slick-column-picker'))) {
       this._menuElm.setAttribute('aria-expanded', 'false');
       this._menuElm.style.display = 'none';
     }
diff --git a/packages/common/src/extensions/slickHeaderMenu.ts b/packages/common/src/extensions/slickHeaderMenu.ts
index 684bcb24b..24f53cba6 100644
--- a/packages/common/src/extensions/slickHeaderMenu.ts
+++ b/packages/common/src/extensions/slickHeaderMenu.ts
@@ -275,7 +275,7 @@ export class SlickHeaderMenu extends MenuBaseClass<HeaderMenu> {
         isMenuClicked = true;
       }
 
-      if (this._menuElm !== e.target && !isMenuClicked && !e.defaultPrevented || e.target.className === 'close') {
+      if (this._menuElm !== e.target && !isMenuClicked && !e.defaultPrevented || (e.target.className === 'close' && parentMenuElm)) {
         this.hideMenu();
       }
     }