From 88d90b7f797b5935b197c9202d4cc20139074fb9 Mon Sep 17 00:00:00 2001
From: Mike O'Donnell <mikerodonnell89@users.noreply.github.com>
Date: Tue, 24 Sep 2024 12:18:01 -0400
Subject: [PATCH] fix(core): more customization of aria attributes for
 multi-input (#12437)

* fix(core): more customization of aria attributes for multi-input

* fix: focusable element should not be aria-hidden
---
 libs/core/multi-input/multi-input.component.html | 3 ++-
 libs/core/multi-input/multi-input.component.ts   | 6 +++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/libs/core/multi-input/multi-input.component.html b/libs/core/multi-input/multi-input.component.html
index 5e27ab46f2c..4208eaac7d3 100644
--- a/libs/core/multi-input/multi-input.component.html
+++ b/libs/core/multi-input/multi-input.component.html
@@ -48,8 +48,8 @@
             [isControl]="true"
             [glyph]="showAddonButton ? glyph : ''"
             [glyphFont]="glyphFont"
-            [addonButtonAriaHidden]="!!title"
             (addOnButtonClicked)="_addOnButtonClicked($event)"
+            [glyphAriaLabel]="addOnButtonAriaLabel"
             [iconTitle]="addonIconTitle"
         >
             <span [attr.id]="tokenHiddenId" aria-hidden="true" class="fd-multi-input__invisible-text">{{
@@ -102,6 +102,7 @@
                     [attr.id]="inputId"
                     (focus)="tokenizer._showAllTokens()"
                     (blur)="tokenizer._hideTokens()"
+                    [attr.title]="title"
                 />
             </fd-tokenizer>
         </fd-input-group>
diff --git a/libs/core/multi-input/multi-input.component.ts b/libs/core/multi-input/multi-input.component.ts
index 8073de6598d..12ac9fb3bf5 100644
--- a/libs/core/multi-input/multi-input.component.ts
+++ b/libs/core/multi-input/multi-input.component.ts
@@ -373,10 +373,14 @@ export class MultiInputComponent<ItemType = any, ValueType = any>
     @Input()
     open = false;
 
-    /** Whether or not to display the addon button. */
+    /** Whether to display the addon button. */
     @Input()
     displayAddonButton = true;
 
+    /** Aria-label for the addon button. */
+    @Input()
+    addOnButtonAriaLabel: Nullable<string>;
+
     /** @hidden */
     private _tokenCountHiddenLabel = `fd-multi-input-token-count-id-${uniqueHiddenLabel++}`;