From c05372fa321f056fb80dfbb40dc0b3a6eba520cf Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 25 Jun 2024 11:55:56 +0300
Subject: [PATCH] Menu components:  active state remains on outside click

---
 packages/primevue/src/megamenu/MegaMenu.vue     | 15 +++++++++++++--
 packages/primevue/src/megamenu/MegaMenuSub.vue  |  6 +++++-
 packages/primevue/src/menu/Menu.vue             |  2 +-
 packages/primevue/src/menubar/Menubar.vue       |  4 ++--
 packages/primevue/src/tieredmenu/TieredMenu.vue |  4 ++--
 5 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/packages/primevue/src/megamenu/MegaMenu.vue b/packages/primevue/src/megamenu/MegaMenu.vue
index 051317c53..4a6cbd49d 100755
--- a/packages/primevue/src/megamenu/MegaMenu.vue
+++ b/packages/primevue/src/megamenu/MegaMenu.vue
@@ -50,6 +50,7 @@
             @keydown="onKeyDown"
             @item-click="onItemClick"
             @item-mouseenter="onItemMouseEnter"
+            @item-mousemove="onItemMouseMove"
         />
         <div v-if="$slots.end" :class="cx('end')" v-bind="ptm('end')">
             <slot name="end"></slot>
@@ -184,8 +185,8 @@ export default {
             this.$emit('focus', event);
         },
         onBlur(event) {
-            this.focused = false;
-            this.focusedItemInfo = { index: -1, key: '', parentKey: '' };
+            // this.focused = false;
+            // this.focusedItemInfo = { index: -1, key: '', parentKey: '' };
             this.searchValue = '';
             this.dirty = false;
             this.$emit('blur', event);
@@ -289,7 +290,12 @@ export default {
                 if (grouped) {
                     this.onItemChange(event);
                 } else {
+                    const rootProcessedItem = root ? processedItem : this.activeItem;
+
                     this.hide(originalEvent);
+                    this.changeFocusedItemInfo(originalEvent, rootProcessedItem ? rootProcessedItem.index : -1);
+
+                    !this.mobile && DomHandler.focus(this.menubar);
                 }
             }
         },
@@ -298,6 +304,11 @@ export default {
                 this.onItemChange(event);
             }
         },
+        onItemMouseMove(event) {
+            if (this.focused) {
+                this.changeFocusedItemIndex(event, event.processedItem.index);
+            }
+        },
         menuButtonClick(event) {
             this.toggle(event);
         },
diff --git a/packages/primevue/src/megamenu/MegaMenuSub.vue b/packages/primevue/src/megamenu/MegaMenuSub.vue
index 7f527cd6d..21c2232f1 100644
--- a/packages/primevue/src/megamenu/MegaMenuSub.vue
+++ b/packages/primevue/src/megamenu/MegaMenuSub.vue
@@ -56,6 +56,7 @@
                                 :unstyled="unstyled"
                                 @item-click="$emit('item-click', $event)"
                                 @item-mouseenter="$emit('item-mouseenter', $event)"
+                                @item-mousemove="$emit('item-mousemove', $event)"
                             />
                         </div>
                     </div>
@@ -85,7 +86,7 @@ export default {
     name: 'MegaMenuSub',
     hostName: 'MegaMenu',
     extends: BaseComponent,
-    emits: ['item-click', 'item-mouseenter'],
+    emits: ['item-click', 'item-mouseenter', 'item-mousemove'],
     props: {
         menuId: {
             type: String,
@@ -180,6 +181,9 @@ export default {
         onItemMouseEnter(event, processedItem) {
             this.$emit('item-mouseenter', { originalEvent: event, processedItem });
         },
+        onItemMouseMove(event, processedItem) {
+            this.$emit('item-mousemove', { originalEvent: event, processedItem });
+        },
         getAriaSetSize() {
             return this.items.filter((processedItem) => this.isItemVisible(processedItem) && !this.getItemProp(processedItem, 'separator')).length;
         },
diff --git a/packages/primevue/src/menu/Menu.vue b/packages/primevue/src/menu/Menu.vue
index f6c36b28e..e8997be1b 100644
--- a/packages/primevue/src/menu/Menu.vue
+++ b/packages/primevue/src/menu/Menu.vue
@@ -309,7 +309,7 @@ export default {
                     if (this.overlayVisible && isOutsideContainer && isOutsideTarget) {
                         this.hide();
                     } else if (!this.popup && isOutsideContainer && isOutsideTarget) {
-                        this.focusedOptionIndex = -1;
+                        // this.focusedOptionIndex = -1;
                     }
                 };
 
diff --git a/packages/primevue/src/menubar/Menubar.vue b/packages/primevue/src/menubar/Menubar.vue
index 0208055e5..f2cb1976c 100755
--- a/packages/primevue/src/menubar/Menubar.vue
+++ b/packages/primevue/src/menubar/Menubar.vue
@@ -178,8 +178,8 @@ export default {
             this.$emit('focus', event);
         },
         onBlur(event) {
-            this.focused = false;
-            this.focusedItemInfo = { index: -1, level: 0, parentKey: '' };
+            // this.focused = false;
+            // this.focusedItemInfo = { index: -1, level: 0, parentKey: '' };
             this.searchValue = '';
             this.dirty = false;
             this.$emit('blur', event);
diff --git a/packages/primevue/src/tieredmenu/TieredMenu.vue b/packages/primevue/src/tieredmenu/TieredMenu.vue
index 4dc7a8c2f..59f1b63b9 100755
--- a/packages/primevue/src/tieredmenu/TieredMenu.vue
+++ b/packages/primevue/src/tieredmenu/TieredMenu.vue
@@ -165,8 +165,8 @@ export default {
             this.$emit('focus', event);
         },
         onBlur(event) {
-            this.focused = false;
-            this.focusedItemInfo = { index: -1, level: 0, parentKey: '' };
+            // this.focused = false;
+            // this.focusedItemInfo = { index: -1, level: 0, parentKey: '' };
             this.searchValue = '';
             this.dirty = false;
             this.$emit('blur', event);