From edde57938d475b0d746025654102194821d80eb9 Mon Sep 17 00:00:00 2001
From: Akshat Patel <38994122+Akshat55@users.noreply.github.com>
Date: Tue, 22 Apr 2025 11:31:58 -0400
Subject: [PATCH 1/3] fix: add aria-describedby attribute to read out tooltip
 on focus

Signed-off-by: Akshat Patel <38994122+Akshat55@users.noreply.github.com>
---
 src/tooltip/definition-tooptip.component.ts | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/tooltip/definition-tooptip.component.ts b/src/tooltip/definition-tooptip.component.ts
index 04286d063e..fcd7822b6d 100644
--- a/src/tooltip/definition-tooptip.component.ts
+++ b/src/tooltip/definition-tooptip.component.ts
@@ -28,7 +28,10 @@ import { PopoverContainer } from "carbon-components-angular/popover";
 			class="cds--definition-term"
 			[attr.aria-controls]="id"
 			[attr.aria-expanded]="isOpen"
+			[attr.aria-describedby]="isOpen ? id : null"
 			(blur)="onBlur($event)"
+			(focus)="onClick($event)"
+			(mouseover)="onClick($event)"
 			(click)="onClick($event)"
 			type="button">
 			<ng-content></ng-content>
@@ -37,9 +40,9 @@ import { PopoverContainer } from "carbon-components-angular/popover";
 			*ngIf="description"
 			class="cds--popover"
 			[id]="id"
-			[attr.aria-hidden]="isOpen"
+			[attr.aria-hidden]="!isOpen"
 			role="tooltip">
-			<span class="cds--popover-content cds--definition-tooltip">
+			<span class="cds--popover-content cds--definition-tooltip" aria-live="polite">
 				<ng-container *ngIf="!isTemplate(description)">{{description}}</ng-container>
 				<ng-template *ngIf="isTemplate(description)" [ngTemplateOutlet]="description" [ngTemplateOutletContext]="{ $implicit: templateContext }"></ng-template>
 				<span *ngIf="autoAlign" class="cds--popover-caret cds--popover--auto-align"></span>

From 5bd35f29b2ec81766b9c30b420358edec17635eb Mon Sep 17 00:00:00 2001
From: Akshat Patel <38994122+Akshat55@users.noreply.github.com>
Date: Tue, 22 Apr 2025 12:13:22 -0400
Subject: [PATCH 2/3] feat: allow definition tooltip to be opened on hover

Signed-off-by: Akshat Patel <38994122+Akshat55@users.noreply.github.com>
---
 src/tooltip/definition-tooptip.component.ts | 18 +++++++++++++++---
 src/tooltip/definition-tooptip.stories.ts   |  2 ++
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/tooltip/definition-tooptip.component.ts b/src/tooltip/definition-tooptip.component.ts
index fcd7822b6d..7d01cb60a7 100644
--- a/src/tooltip/definition-tooptip.component.ts
+++ b/src/tooltip/definition-tooptip.component.ts
@@ -30,9 +30,7 @@ import { PopoverContainer } from "carbon-components-angular/popover";
 			[attr.aria-expanded]="isOpen"
 			[attr.aria-describedby]="isOpen ? id : null"
 			(blur)="onBlur($event)"
-			(focus)="onClick($event)"
-			(mouseover)="onClick($event)"
-			(click)="onClick($event)"
+			(mousedown)="onClick($event)"
 			type="button">
 			<ng-content></ng-content>
 		</button>
@@ -65,6 +63,8 @@ export class TooltipDefinition extends PopoverContainer {
 	 */
 	@Input() templateContext: any;
 
+	@Input() openOnHover = false;
+
 	constructor(
 		protected elementRef: ElementRef,
 		protected ngZone: NgZone,
@@ -97,6 +97,18 @@ export class TooltipDefinition extends PopoverContainer {
 		this.handleChange(false, event);
 	}
 
+	@HostListener("mouseenter", ["$event"])
+	mouseenter(event) {
+		if (this.openOnHover) {
+			this.handleChange(true, event);
+		}
+	}
+
+	@HostListener("focusin", ["$event"])
+	onFocus(event) {
+		this.handleChange(true, event);
+	}
+
 	public isTemplate(value) {
 		return value instanceof TemplateRef;
 	}
diff --git a/src/tooltip/definition-tooptip.stories.ts b/src/tooltip/definition-tooptip.stories.ts
index 55603faa4a..db117b5469 100644
--- a/src/tooltip/definition-tooptip.stories.ts
+++ b/src/tooltip/definition-tooptip.stories.ts
@@ -62,6 +62,7 @@ const Template = (args) => ({
 				<p>Custom domains direct requests for your apps in this Cloud Foundry organization to a
 				<cds-tooltip-definition
 					[isOpen]="isOpen"
+					[openOnHover]="openOnHover"
 					[caret]="caret"
 					[align]="align"
 					(onOpen)="onOpen($event)"
@@ -101,6 +102,7 @@ const AutoAlignTemplate = (args) => ({
 				<p>Custom domains direct requests for your apps in this Cloud Foundry organization to a
 				<cds-tooltip-definition
 					[isOpen]="isOpen"
+					[openOnHover]="openOnHover"
 					[caret]="caret"
 					[align]="align"
 					[autoAlign]="true"

From 0141c5a2bee28fc51687aff3068b2474ba6e8a96 Mon Sep 17 00:00:00 2001
From: Akshat Patel <38994122+Akshat55@users.noreply.github.com>
Date: Tue, 22 Apr 2025 12:42:13 -0400
Subject: [PATCH 3/3] fix: use click instead of mousedown

Signed-off-by: Akshat Patel <38994122+Akshat55@users.noreply.github.com>
---
 src/tooltip/definition-tooptip.component.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/tooltip/definition-tooptip.component.ts b/src/tooltip/definition-tooptip.component.ts
index 7d01cb60a7..4921c4ee2d 100644
--- a/src/tooltip/definition-tooptip.component.ts
+++ b/src/tooltip/definition-tooptip.component.ts
@@ -30,7 +30,7 @@ import { PopoverContainer } from "carbon-components-angular/popover";
 			[attr.aria-expanded]="isOpen"
 			[attr.aria-describedby]="isOpen ? id : null"
 			(blur)="onBlur($event)"
-			(mousedown)="onClick($event)"
+			(click)="onClick($event)"
 			type="button">
 			<ng-content></ng-content>
 		</button>