From 2e5c0d54c2abb20878ff4c08bd40df2e139b5008 Mon Sep 17 00:00:00 2001
From: carsonmccue <68160575+carsonmccue@users.noreply.github.com>
Date: Sun, 19 Feb 2023 11:19:58 -0800
Subject: [PATCH] Aria-describedby

Resolves base aria-describedby attribute from #1633.
---
 src/TextInput/TextInput.svelte | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/TextInput/TextInput.svelte b/src/TextInput/TextInput.svelte
index f50ea61e..bf1ac1db 100644
--- a/src/TextInput/TextInput.svelte
+++ b/src/TextInput/TextInput.svelte
@@ -95,6 +95,7 @@
   };
 
   $: isFluid = !!ctx && ctx.isFluid;
+  $: helperId = `helper-${id}`;
   $: errorId = `error-${id}`;
   $: warnId = `warn-${id}`;
 </script>
@@ -182,7 +183,13 @@
         data-invalid="{invalid || undefined}"
         aria-invalid="{invalid || undefined}"
         data-warn="{warn || undefined}"
-        aria-describedby="{invalid ? errorId : warn ? warnId : undefined}"
+        aria-describedby="{invalid
+          ? errorId
+          : warn
+          ? warnId
+          : helperText
+          ? helperId
+          : undefined}"
         disabled="{disabled}"
         id="{id}"
         name="{name}"
@@ -219,6 +226,7 @@
     </div>
     {#if !invalid && !warn && !isFluid && !inline && helperText}
       <div
+        id="{helperId}"
         class:bx--form__helper-text="{true}"
         class:bx--form__helper-text--disabled="{disabled}"
         class:bx--form__helper-text--inline="{inline}"