fix(VInput/VMessages): move aria attributes to details (#20420)

vuetifyjs · Jan 24, 2025 · d1ed47c · d1ed47c
1 parent 57047f6
commit d1ed47c
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/packages/vuetify/src/components/VInput/VInput.tsx b/packages/vuetify/src/components/VInput/VInput.tsx
@@ -209,9 +209,13 @@ export const VInput = genericComponent<new <T>(
           )}
 
           { hasDetails && (
-            <div class="v-input__details">
+            <div
+              id={ messagesId.value }
+              class="v-input__details"
+              role="alert"
+              aria-live="polite"
+            >
               <VMessages
-                id={ messagesId.value }
                 active={ hasMessages }
                 messages={ messages.value }
                 v-slots={{ message: slots.message }}

diff --git a/packages/vuetify/src/components/VMessages/VMessages.tsx b/packages/vuetify/src/components/VMessages/VMessages.tsx
@@ -64,8 +64,6 @@ export const VMessages = genericComponent<VMessagesSlots>()({
           textColorStyles.value,
           props.style,
         ]}
-        role="alert"
-        aria-live="polite"
       >
         { props.active && (
           messages.value.map((message, i) => (