fix(common): clicking Menu close button should only close current menu

- 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
ghiscoding · Oct 29, 2023 · 01dea9e · 01dea9e
1 parent 634441c
commit 01dea9e
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git 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
@@ -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
@@ -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();
       }
     }