@vuetify/nightly 3.9.0-master.2025-07-10 → 3.9.0-master.2025-07-12

package/dist/vuetify.cjs

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.9.0-master.2025-07-10
+* Vuetify v3.9.0-master.2025-07-12
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -7527,7 +7527,6 @@
       } = useInputIcon(props);
       const uid = vue.useId();
       const id = vue.computed(() => props.id || `input-${uid}`);
-      const messagesId = vue.computed(() => `${id.value}-messages`);
       const {
         errorMessages,
         isDirty,
@@ -7541,6 +7540,18 @@
         validate,
         validationClasses
       } = useValidation(props, 'v-input', id);
+      const messages = vue.computed(() => {
+        if (props.errorMessages?.length || !isPristine.value && errorMessages.value.length) {
+          return errorMessages.value;
+        } else if (props.hint && (props.persistentHint || props.focused)) {
+          return props.hint;
+        } else {
+          return props.messages;
+        }
+      });
+      const hasMessages = vue.toRef(() => messages.value.length > 0);
+      const hasDetails = vue.toRef(() => !props.hideDetails || props.hideDetails === 'auto' && (hasMessages.value || !!slots.details));
+      const messagesId = vue.computed(() => hasDetails.value ? `${id.value}-messages` : undefined);
       const slotProps = vue.computed(() => ({
         id,
         messagesId,
@@ -7550,6 +7561,7 @@
         isPristine,
         isValid,
         isValidating,
+        hasDetails,
         reset,
         resetValidation,
         validate
@@ -7561,20 +7573,9 @@
         if (!props.iconColor) return undefined;
         return props.iconColor === true ? color.value : props.iconColor;
       });
-      const messages = vue.computed(() => {
-        if (props.errorMessages?.length || !isPristine.value && errorMessages.value.length) {
-          return errorMessages.value;
-        } else if (props.hint && (props.persistentHint || props.focused)) {
-          return props.hint;
-        } else {
-          return props.messages;
-        }
-      });
       useRender(() => {
         const hasPrepend = !!(slots.prepend || props.prependIcon);
         const hasAppend = !!(slots.append || props.appendIcon);
-        const hasMessages = messages.value.length > 0;
-        const hasDetails = !props.hideDetails || props.hideDetails === 'auto' && (hasMessages || !!slots.details);
         return vue.createElementVNode("div", {
           "class": vue.normalizeClass(['v-input', `v-input--${props.direction}`, {
             'v-input--center-affix': props.centerAffix,
@@ -7599,13 +7600,13 @@
           "key": "append-icon",
           "name": "append",
           "color": iconColor.value
-        }, null), slots.append?.(slotProps.value)]), hasDetails && vue.createElementVNode("div", {
+        }, null), slots.append?.(slotProps.value)]), hasDetails.value && vue.createElementVNode("div", {
           "id": messagesId.value,
           "class": "v-input__details",
           "role": "alert",
           "aria-live": "polite"
         }, [vue.createVNode(VMessages, {
-          "active": hasMessages,
+          "active": hasMessages.value,
           "messages": messages.value
         }, {
           message: slots.message
@@ -12269,8 +12270,7 @@
         "class": vue.normalizeClass(['v-field-label', {
           'v-field-label--floating': props.floating
         }, props.class]),
-        "style": vue.normalizeStyle(props.style),
-        "aria-hidden": props.floating || undefined
+        "style": vue.normalizeStyle(props.style)
       }, slots));
       return {};
     }
@@ -12294,6 +12294,7 @@
     },
     color: String,
     baseColor: String,
+    details: Boolean,
     dirty: Boolean,
     disabled: {
       type: Boolean,
@@ -12365,7 +12366,7 @@
       const hasFloatingLabel = vue.toRef(() => !props.singleLine && hasLabel.value);
       const uid = vue.useId();
       const id = vue.computed(() => props.id || `input-${uid}`);
-      const messagesId = vue.toRef(() => `${id.value}-messages`);
+      const messagesId = vue.toRef(() => !props.details ? undefined : `${id.value}-messages`);
       const labelRef = vue.ref();
       const floatingLabelRef = vue.ref();
       const controlRef = vue.ref();
@@ -12490,6 +12491,7 @@
           "class": vue.normalizeClass([textColorClasses.value]),
           "floating": true,
           "for": id.value,
+          "aria-hidden": !isActive.value,
           "style": vue.normalizeStyle(textColorStyles.value)
         }, {
           default: () => [label()]
@@ -12560,7 +12562,8 @@
         }, [vue.createVNode(VFieldLabel, {
           "ref": floatingLabelRef,
           "floating": true,
-          "for": id.value
+          "for": id.value,
+          "aria-hidden": !isActive.value
         }, {
           default: () => [label()]
         })]), vue.createElementVNode("div", {
@@ -12568,7 +12571,8 @@
         }, null)]), isPlainOrUnderlined.value && hasFloatingLabel.value && vue.createVNode(VFieldLabel, {
           "ref": floatingLabelRef,
           "floating": true,
-          "for": id.value
+          "for": id.value,
+          "aria-hidden": !isActive.value
         }, {
           default: () => [label()]
         })])]);
@@ -12720,6 +12724,7 @@
               isDirty,
               isReadonly,
               isValid,
+              hasDetails,
               reset
             } = _ref2;
             return vue.createVNode(VField, vue.mergeProps({
@@ -12736,6 +12741,7 @@
               "dirty": isDirty.value || props.dirty,
               "disabled": isDisabled.value,
               "focused": isFocused.value,
+              "details": hasDetails.value,
               "error": isValid.value === false
             }), {
               ...slots,
@@ -24557,7 +24563,8 @@
               isDisabled,
               isDirty,
               isReadonly,
-              isValid
+              isValid,
+              hasDetails
             } = _ref3;
             return vue.createVNode(VField, vue.mergeProps({
               "ref": vFieldRef,
@@ -24573,6 +24580,7 @@
               "dirty": isDirty.value || props.dirty,
               "disabled": isDisabled.value,
               "focused": isFocused.value,
+              "details": hasDetails.value,
               "error": isValid.value === false,
               "onDragover": onDragover,
               "onDrop": onDrop
@@ -29330,7 +29338,8 @@
               isDisabled,
               isDirty,
               isReadonly,
-              isValid
+              isValid,
+              hasDetails
             } = _ref2;
             return vue.createVNode(VField, vue.mergeProps({
               "ref": vFieldRef,
@@ -29349,6 +29358,7 @@
               "dirty": isDirty.value || props.dirty,
               "disabled": isDisabled.value,
               "focused": isFocused.value,
+              "details": hasDetails.value,
               "error": isValid.value === false
             }), {
               ...slots,
@@ -31396,7 +31406,7 @@
       };
     });
   }
-  const version$1 = "3.9.0-master.2025-07-10";
+  const version$1 = "3.9.0-master.2025-07-12";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -31421,7 +31431,7 @@
       ...options
     });
   };
-  const version = "3.9.0-master.2025-07-10";
+  const version = "3.9.0-master.2025-07-12";
   createVuetify.version = version;
 
   exports.blueprints = index;