From 9d1f0e07080c3b0d2860a5e2b1277d9192f388d9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kayla=20Aky=C3=BCz?= <kaylaakyuz@gmail.com>
Date: Wed, 30 Jul 2025 09:06:04 +0300
Subject: [PATCH] fix(menubar): clicking submenu header inside dropdown

---
 components/lib/menubar/Menubar.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/components/lib/menubar/Menubar.js b/components/lib/menubar/Menubar.js
index 060cd666f9..f664a37b5f 100644
--- a/components/lib/menubar/Menubar.js
+++ b/components/lib/menubar/Menubar.js
@@ -42,10 +42,12 @@ export const Menubar = React.memo(
         const [bindOutsideClickListener, unbindOutsideClickListener] = useEventListener({
             type: 'click',
             listener: (event) => {
-                const isOutsideButton = menuButtonRef.current && !menuButtonRef.current.contains(event.target);
+                if (isOutsideClicked(event)) {
+                    const isOutsideContainer = elementRef.current && !elementRef.current.contains(event.target);
 
-                if (isOutsideButton) {
-                    hide();
+                    if (isOutsideContainer) {
+                        hide();
+                    }
                 }
             },
             options: { capture: true }
@@ -98,6 +100,10 @@ export const Menubar = React.memo(
             (event.code === 'Enter' || event.code === 'NumpadEnter' || event.code === 'Space') && toggle(event);
         };
 
+        const isOutsideClicked = (event) => {
+            return rootMenuRef.current !== event.target && !rootMenuRef.current.contains(event.target) && menuButtonRef.current !== event.target && !menuButtonRef.current.contains(event.target);
+        };
+
         const getItemProp = (item, name) => {
             return item ? ObjectUtils.getItemValue(item[name]) : undefined;
         };