From 20c33920d005332db3c83f33a8c54c7c227ce0a0 Mon Sep 17 00:00:00 2001
From: Romain Hamel <rom.hml@gmail.com>
Date: Wed, 26 Mar 2025 13:47:38 +0100
Subject: [PATCH] fix(FormField): add `help` to `aria-describedby` attribute
 (#3691)

---
 src/runtime/components/FormField.vue    | 1 +
 src/runtime/composables/useFormField.ts | 2 +-
 src/runtime/types/form.ts               | 1 +
 3 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/runtime/components/FormField.vue b/src/runtime/components/FormField.vue
index 7fd32a7e..bfb0e443 100644
--- a/src/runtime/components/FormField.vue
+++ b/src/runtime/components/FormField.vue
@@ -86,6 +86,7 @@ provide(formFieldInjectionKey, computed(() => ({
   errorPattern: props.errorPattern,
   hint: props.hint,
   description: props.description,
+  help: props.help,
   ariaId
 }) as FormFieldInjectedOptions<FormFieldProps>))
 </script>
diff --git a/src/runtime/composables/useFormField.ts b/src/runtime/composables/useFormField.ts
index ea95edc8..2645545f 100644
--- a/src/runtime/composables/useFormField.ts
+++ b/src/runtime/composables/useFormField.ts
@@ -80,7 +80,7 @@ export function useFormField<T>(props?: Props<T>, opts?: { bind?: boolean, defer
     ariaAttrs: computed(() => {
       if (!formField?.value) return
 
-      const descriptiveAttrs = ['error' as const, 'hint' as const, 'description' as const]
+      const descriptiveAttrs = ['error' as const, 'hint' as const, 'description' as const, 'help' as const]
         .filter(type => formField?.value?.[type])
         .map(type => `${formField?.value.ariaId}-${type}`) || []
 
diff --git a/src/runtime/types/form.ts b/src/runtime/types/form.ts
index ae080593..520d738d 100644
--- a/src/runtime/types/form.ts
+++ b/src/runtime/types/form.ts
@@ -84,6 +84,7 @@ export interface FormFieldInjectedOptions<T> {
   errorPattern?: RegExp
   hint?: string
   description?: string
+  help?: string
   ariaId: string
 }