From c3de52688d97cf1e1da13c54d6a951cf23dbdc6f Mon Sep 17 00:00:00 2001
From: Aleksey Novikov <novikov82@gmail.com>
Date: Sun, 27 Oct 2024 21:20:24 +0300
Subject: [PATCH] fixed item group event bindings #5980

---
 .../src/toolbox/toolbox-item-group.component.html            | 3 ++-
 .../src/toolbox/toolbox-item-group.html                      | 2 +-
 packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue | 5 ++++-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html b/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html
index d30bb42d8e..565354ef48 100644
--- a/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html
+++ b/packages/survey-creator-angular/src/toolbox/toolbox-item-group.component.html
@@ -1,6 +1,7 @@
 <ng-template #template>
   <svc-toolbox-item [model]="item" [viewModel]="viewModel" [creator]="creator" [isCompact]="isCompact"></svc-toolbox-item>
-  <div class="svc-toolbox__item-submenu-button" (mouseover)="viewModel.onMouseOver(item, $event)">
+  <div class="svc-toolbox__item-submenu-button" (mouseover)="viewModel.onMouseOver(item, $event)"
+    (mouseleave)="viewModel.onMouseLeave(item, $event)">
     <svg [iconName]="item.subitemsButtonIcon" [size]="16" sv-ng-svg-icon></svg>
     <sv-ng-popup [popupModel]="model.popupModel" [getArea]="model.getArea"></sv-ng-popup>
   </div>
diff --git a/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html b/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html
index ab385169f5..784daafc46 100644
--- a/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html
+++ b/packages/survey-creator-knockout/src/toolbox/toolbox-item-group.html
@@ -1,7 +1,7 @@
 <!-- ko component: { name: 'svc-toolbox-item', params: { model: $data.model, item: $data.item, creator: $data.creator, isCompact: $data.isCompact } } -->
 <!-- /ko -->
 <div class="svc-toolbox__item-submenu-button"
-  data-bind="event: { mouseover: onMouseOver }">
+  data-bind="event: { mouseover: onMouseOver, mouseleave: onMouseLeave }">
   <!-- ko component: { name: 'sv-svg-icon', params: { iconName: item.subitemsButtonIcon, size: 16 } } --><!-- /ko -->
   <sv-popup params="{ model: $data.item.popupModel, getArea: $data.item.getArea }"></sv-popup>
 </div>
\ No newline at end of file
diff --git a/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue b/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue
index f275dd39ce..eadcaf4cee 100644
--- a/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue
+++ b/packages/survey-creator-vue/src/toolbox/ToolboxItemGroup.vue
@@ -6,7 +6,7 @@
     :creator="creator"
     :isCompact="isCompact"
   ></SvComponent>
-  <div class="svc-toolbox__item-submenu-button" @mouseover="hover">
+  <div class="svc-toolbox__item-submenu-button" @mouseover="hover" @mouseleave="leave">
     <SvComponent :is="'sv-svg-icon'" :iconName="item.subitemsButtonIcon" :size="item.iconSize"></SvComponent>
     <SvComponent
       :is="'sv-popup'"
@@ -32,4 +32,7 @@ const props = defineProps<{
 const hover = (event: MouseEvent) => {
   props.viewModel.onMouseOver(props.item as QuestionToolboxItem, event);
 };
+const leave = (event: MouseEvent) => {
+  props.viewModel.onMouseLeave(props.item as QuestionToolboxItem, event);
+};
 </script>