From 708498c8fbdaf1320c6ebd271311d39daea32f27 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Tue, 7 May 2024 11:48:29 +0300 Subject: [PATCH 1/2] Fixed #15468 - Tooltip | tooltipEvent - focus | hover combined --- src/app/components/tooltip/tooltip.ts | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/src/app/components/tooltip/tooltip.ts b/src/app/components/tooltip/tooltip.ts index 043a70a7bc1..1b9dd59b08e 100755 --- a/src/app/components/tooltip/tooltip.ts +++ b/src/app/components/tooltip/tooltip.ts @@ -25,7 +25,7 @@ export class Tooltip implements AfterViewInit, OnDestroy { * Event to show the tooltip. * @group Props */ - @Input() tooltipEvent: 'hover' | 'focus' | string | any = 'hover'; + @Input() tooltipEvent: 'hover' | 'focus' | 'combined' | string | any = 'hover'; /** * Target element to attach the overlay, valid values are "body", "target" or a local ng-F variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name). * @group Props @@ -169,14 +169,17 @@ export class Tooltip implements AfterViewInit, OnDestroy { ngAfterViewInit() { if (isPlatformBrowser(this.platformId)) { this.zone.runOutsideAngular(() => { - if (this.getOption('tooltipEvent') === 'hover') { + const tooltipEvent = this.getOption('tooltipEvent'); + + if (tooltipEvent === 'hover' || tooltipEvent === 'combined') { this.mouseEnterListener = this.onMouseEnter.bind(this); this.mouseLeaveListener = this.onMouseLeave.bind(this); this.clickListener = this.onInputClick.bind(this); this.el.nativeElement.addEventListener('mouseenter', this.mouseEnterListener); this.el.nativeElement.addEventListener('click', this.clickListener); this.el.nativeElement.addEventListener('mouseleave', this.mouseLeaveListener); - } else if (this.getOption('tooltipEvent') === 'focus') { + } + if (tooltipEvent === 'focus' || tooltipEvent === 'combined') { this.focusListener = this.onFocus.bind(this); this.blurListener = this.onBlur.bind(this); @@ -633,11 +636,14 @@ export class Tooltip implements AfterViewInit, OnDestroy { } unbindEvents() { - if (this.getOption('tooltipEvent') === 'hover') { + const tooltipEvent = this.getOption('tooltipEvent'); + + if (tooltipEvent === 'hover' || tooltipEvent === 'combined') { this.el.nativeElement.removeEventListener('mouseenter', this.mouseEnterListener); this.el.nativeElement.removeEventListener('mouseleave', this.mouseLeaveListener); this.el.nativeElement.removeEventListener('click', this.clickListener); - } else if (this.getOption('tooltipEvent') === 'focus') { + } + if (tooltipEvent === 'focus' || tooltipEvent === 'combined') { let target = this.getTarget(this.el.nativeElement); target.removeEventListener('focus', this.focusListener); From 7ce0541217e406ba4d034512706ee63e074c11f8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mehmet=20=C3=87etin?= <92744169+mehmetcetin01140@users.noreply.github.com> Date: Wed, 8 May 2024 17:46:55 +0300 Subject: [PATCH 2/2] fix typo --- src/app/components/tooltip/tooltip.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/app/components/tooltip/tooltip.ts b/src/app/components/tooltip/tooltip.ts index 1b9dd59b08e..95ab90f6a28 100755 --- a/src/app/components/tooltip/tooltip.ts +++ b/src/app/components/tooltip/tooltip.ts @@ -25,7 +25,7 @@ export class Tooltip implements AfterViewInit, OnDestroy { * Event to show the tooltip. * @group Props */ - @Input() tooltipEvent: 'hover' | 'focus' | 'combined' | string | any = 'hover'; + @Input() tooltipEvent: 'hover' | 'focus' | 'both' | string | any = 'hover'; /** * Target element to attach the overlay, valid values are "body", "target" or a local ng-F variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name). * @group Props @@ -171,7 +171,7 @@ export class Tooltip implements AfterViewInit, OnDestroy { this.zone.runOutsideAngular(() => { const tooltipEvent = this.getOption('tooltipEvent'); - if (tooltipEvent === 'hover' || tooltipEvent === 'combined') { + if (tooltipEvent === 'hover' || tooltipEvent === 'both') { this.mouseEnterListener = this.onMouseEnter.bind(this); this.mouseLeaveListener = this.onMouseLeave.bind(this); this.clickListener = this.onInputClick.bind(this); @@ -179,7 +179,7 @@ export class Tooltip implements AfterViewInit, OnDestroy { this.el.nativeElement.addEventListener('click', this.clickListener); this.el.nativeElement.addEventListener('mouseleave', this.mouseLeaveListener); } - if (tooltipEvent === 'focus' || tooltipEvent === 'combined') { + if (tooltipEvent === 'focus' || tooltipEvent === 'both') { this.focusListener = this.onFocus.bind(this); this.blurListener = this.onBlur.bind(this); @@ -638,12 +638,12 @@ export class Tooltip implements AfterViewInit, OnDestroy { unbindEvents() { const tooltipEvent = this.getOption('tooltipEvent'); - if (tooltipEvent === 'hover' || tooltipEvent === 'combined') { + if (tooltipEvent === 'hover' || tooltipEvent === 'both') { this.el.nativeElement.removeEventListener('mouseenter', this.mouseEnterListener); this.el.nativeElement.removeEventListener('mouseleave', this.mouseLeaveListener); this.el.nativeElement.removeEventListener('click', this.clickListener); } - if (tooltipEvent === 'focus' || tooltipEvent === 'combined') { + if (tooltipEvent === 'focus' || tooltipEvent === 'both') { let target = this.getTarget(this.el.nativeElement); target.removeEventListener('focus', this.focusListener);