multi select tooltip fix

nbrown-ScottLogic · May 1, 2024 · b84578a · b84578a
1 parent 0d43e64
commit b84578a
Showing 1 changed file with 16 additions and 1 deletion.
diff --git a/src/app/components/multiselect/multiselect.ts b/src/app/components/multiselect/multiselect.ts
@@ -170,7 +170,15 @@ export class MultiSelectItem {
                     [autofocus]="autofocus"
                 />
             </div>
-            <div class="p-multiselect-label-container" [pTooltip]="tooltip" [tooltipPosition]="tooltipPosition" [positionStyle]="tooltipPositionStyle" [tooltipStyleClass]="tooltipStyleClass">
+            <div
+                class="p-multiselect-label-container"
+                [pTooltip]="tooltip"
+                (mouseleave)="labelContainerMouseLeave()"
+                [tooltipDisabled]="_disableTooltip"
+                [tooltipPosition]="tooltipPosition"
+                [positionStyle]="tooltipPositionStyle"
+                [tooltipStyleClass]="tooltipStyleClass"
+            >
                 <div [ngClass]="labelClass">
                     <ng-container *ngIf="!selectedItemsTemplate">
                         <ng-container *ngIf="display === 'comma'">{{ label() || 'empty' }}</ng-container>
@@ -921,6 +929,8 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft
 
     _selectionLimit: number | undefined;
 
+    _disableTooltip = false;
+
     value: any[];
 
     public _filteredOptions: any[] | undefined | null;
@@ -2025,10 +2035,15 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft
         this.updateModel(null, event);
         this.selectedOptions = null;
         this.onClear.emit();
+        this._disableTooltip = true;
 
         event.stopPropagation();
     }
 
+    labelContainerMouseLeave() {
+        if (this._disableTooltip) this._disableTooltip = false;
+    }
+
     removeOption(optionValue, event) {
         let value = this.modelValue().filter((val) => !ObjectUtils.equals(val, optionValue, this.equalityKey()));