vuetify 3.3.12 → 3.3.13

package/dist/vuetify.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.3.12
+* Vuetify v3.3.13
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -1645,6 +1645,7 @@
 
   var en = {
     badge: 'Badge',
+    open: 'Open',
     close: 'Close',
     dataIterator: {
       noResultsText: 'No matching records found',
@@ -5848,6 +5849,20 @@
           }
         }) : props.label;
         const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
+        const inputNode = vue.createVNode("input", vue.mergeProps({
+          "ref": input,
+          "checked": model.value,
+          "disabled": !!(props.readonly || props.disabled),
+          "id": id.value,
+          "onBlur": onBlur,
+          "onFocus": onFocus,
+          "onInput": onInput,
+          "aria-disabled": !!(props.readonly || props.disabled),
+          "type": props.type,
+          "value": trueValue.value,
+          "name": props.name,
+          "aria-checked": props.type === 'checkbox' ? model.value : undefined
+        }, inputAttrs), null);
         return vue.createVNode("div", vue.mergeProps({
           "class": ['v-selection-control', {
             'v-selection-control--dirty': model.value,
@@ -5864,32 +5879,21 @@
           "style": textColorStyles.value
         }, [slots.default?.(), vue.withDirectives(vue.createVNode("div", {
           "class": ['v-selection-control__input']
-        }, [icon.value && vue.createVNode(VIcon, {
-          "key": "icon",
-          "icon": icon.value
-        }, null), vue.createVNode("input", vue.mergeProps({
-          "ref": input,
-          "checked": model.value,
-          "disabled": !!(props.readonly || props.disabled),
-          "id": id.value,
-          "onBlur": onBlur,
-          "onFocus": onFocus,
-          "onInput": onInput,
-          "aria-disabled": !!(props.readonly || props.disabled),
-          "type": props.type,
-          "value": trueValue.value,
-          "name": props.name,
-          "aria-checked": props.type === 'checkbox' ? model.value : undefined
-        }, inputAttrs), null), slots.input?.({
+        }, [slots.input?.({
           model,
           textColorClasses,
           textColorStyles,
+          inputNode,
+          icon: icon.value,
           props: {
             onFocus,
             onBlur,
             id: id.value
           }
-        })]), [[vue.resolveDirective("ripple"), props.ripple && [!props.disabled && !props.readonly, null, ['center', 'circle']]]])]), label && vue.createVNode(VLabel, {
+        }) ?? vue.createVNode(vue.Fragment, null, [icon.value && vue.createVNode(VIcon, {
+          "key": "icon",
+          "icon": icon.value
+        }, null), inputNode])]), [[vue.resolveDirective("ripple"), props.ripple && [!props.disabled && !props.readonly, null, ['center', 'circle']]]])]), label && vue.createVNode(VLabel, {
           "for": id.value,
           "clickable": true
         }, {
@@ -7658,7 +7662,6 @@
           "style": [colorStyles.value, dimensionStyles.value, props.style],
           "href": link.href.value,
           "tabindex": isClickable.value ? list ? -2 : 0 : undefined,
-          "title": props.title,
           "onClick": onClick,
           "onKeydown": isClickable.value && !isLink.value && onKeyDown
         }, {
@@ -7691,7 +7694,9 @@
             }
           }, {
             default: () => [slots.prepend?.(slotProps.value)]
-          })]), vue.createVNode("div", {
+          }), vue.createVNode("div", {
+            "class": "v-list-item__spacer"
+          }, null)]), vue.createVNode("div", {
             "class": "v-list-item__content",
             "data-no-activator": ""
           }, [hasTitle && vue.createVNode(VListItemTitle, {
@@ -7735,7 +7740,9 @@
             }
           }, {
             default: () => [slots.append?.(slotProps.value)]
-          })])]
+          }), vue.createVNode("div", {
+            "class": "v-list-item__spacer"
+          }, null)])]
         }), [[vue.resolveDirective("ripple"), isClickable.value && props.ripple]]);
       });
       return {};
@@ -9846,10 +9853,11 @@
           }, 40);
         }
       });
-      function onFocusIn(e) {
+      async function onFocusIn(e) {
         const before = e.relatedTarget;
         const after = e.target;
-        if (before !== after && overlay.value?.contentEl &&
+        await vue.nextTick();
+        if (isActive.value && before !== after && overlay.value?.contentEl &&
         // We're the topmost menu
         overlay.value?.globalTop &&
         // It isn't the document or the menu body
@@ -10185,7 +10193,7 @@
             'v-field--no-label': !label,
             [`v-field--variant-${props.variant}`]: true
           }, themeClasses.value, backgroundColorClasses.value, focusClasses.value, loaderClasses.value, roundedClasses.value, rtlClasses.value, props.class],
-          "style": [backgroundColorStyles.value, textColorStyles.value, props.style],
+          "style": [backgroundColorStyles.value, props.style],
           "onClick": onClick
         }, attrs), [vue.createVNode("div", {
           "class": "v-field__overlay"
@@ -10209,7 +10217,8 @@
           "ref": floatingLabelRef,
           "class": [textColorClasses.value],
           "floating": true,
-          "for": id.value
+          "for": id.value,
+          "style": textColorStyles.value
         }, {
           default: () => [label]
         }), vue.createVNode(VFieldLabel, {
@@ -10245,7 +10254,8 @@
           "key": "append-icon",
           "name": "appendInner"
         }, null)]), vue.createVNode("div", {
-          "class": ['v-field__outline', textColorClasses.value]
+          "class": ['v-field__outline', textColorClasses.value],
+          "style": textColorStyles.value
         }, [isOutlined && vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
           "class": "v-field__outline__start"
         }, null), hasLabel.value && vue.createVNode("div", {
@@ -10289,6 +10299,7 @@
     persistentPlaceholder: Boolean,
     persistentCounter: Boolean,
     suffix: String,
+    role: String,
     type: {
       type: String,
       default: 'text'
@@ -10413,7 +10424,7 @@
               "onClick:clear": onClear,
               "onClick:prependInner": props['onClick:prependInner'],
               "onClick:appendInner": props['onClick:appendInner'],
-              "role": "textbox"
+              "role": props.role
             }, fieldProps, {
               "id": id.value,
               "active": isActive.value || isDirty.value,
@@ -10452,10 +10463,12 @@
                   "class": "v-text-field__prefix"
                 }, [vue.createVNode("span", {
                   "class": "v-text-field__prefix__text"
-                }, [props.prefix])]), vue.createVNode("div", {
+                }, [props.prefix])]), slots.default ? vue.createVNode("div", {
                   "class": fieldClass,
                   "data-no-activator": ""
-                }, [slots.default ? vue.createVNode(vue.Fragment, null, [slots.default(), inputNode]) : vue.cloneVNode(inputNode)]), props.suffix && vue.createVNode("span", {
+                }, [slots.default(), inputNode]) : vue.cloneVNode(inputNode, {
+                  class: fieldClass
+                }), props.suffix && vue.createVNode("span", {
                   "class": "v-text-field__suffix"
                 }, [vue.createVNode("span", {
                   "class": "v-text-field__suffix__text"
@@ -10774,6 +10787,14 @@
   const makeSelectProps = propsFactory({
     chips: Boolean,
     closableChips: Boolean,
+    closeText: {
+      type: String,
+      default: '$vuetify.close'
+    },
+    openText: {
+      type: String,
+      default: '$vuetify.open'
+    },
     eager: Boolean,
     hideNoData: Boolean,
     hideSelected: Boolean,
@@ -10803,7 +10824,8 @@
   const makeVSelectProps = propsFactory({
     ...makeSelectProps(),
     ...omit(makeVTextFieldProps({
-      modelValue: null
+      modelValue: null,
+      role: 'button'
     }), ['validationValue', 'dirty', 'appendInnerIcon']),
     ...makeTransitionProps({
       transition: {
@@ -10858,6 +10880,7 @@
       });
       const selected = vue.computed(() => selections.value.map(selection => selection.props.value));
       const isFocused = vue.shallowRef(false);
+      const label = vue.computed(() => menu.value ? props.closeText : props.openText);
       let keyboardLookupPrefix = '';
       let keyboardLookupLastTime;
       const displayItems = vue.computed(() => {
@@ -10984,7 +11007,9 @@
           "onClick:clear": onClear,
           "onMousedown:control": onMousedownControl,
           "onBlur": onBlur,
-          "onKeydown": onKeydown
+          "onKeydown": onKeydown,
+          "aria-label": t(label.value),
+          "title": t(label.value)
         }), {
           ...slots,
           default: () => vue.createVNode(vue.Fragment, null, [vue.createVNode(VMenu, vue.mergeProps({
@@ -11247,7 +11272,8 @@
     }),
     ...makeSelectProps(),
     ...omit(makeVTextFieldProps({
-      modelValue: null
+      modelValue: null,
+      role: 'combobox'
     }), ['validationValue', 'dirty', 'appendInnerIcon']),
     ...makeTransitionProps({
       transition: false
@@ -11284,6 +11310,7 @@
       });
       const selectionIndex = vue.shallowRef(-1);
       const color = vue.computed(() => vTextFieldRef.value?.color);
+      const label = vue.computed(() => menu.value ? props.closeText : props.openText);
       const {
         items,
         transformIn,
@@ -11631,7 +11658,9 @@
               "class": "v-autocomplete__menu-icon",
               "icon": props.menuIcon,
               "onMousedown": onMousedownMenuIcon,
-              "onClick": noop
+              "onClick": noop,
+              "aria-label": t(label.value),
+              "title": t(label.value)
             }, null) : undefined]);
           }
         });
@@ -14775,7 +14804,8 @@
       returnObject: true
     }),
     ...omit(makeVTextFieldProps({
-      modelValue: null
+      modelValue: null,
+      role: 'combobox'
     }), ['validationValue', 'dirty', 'appendInnerIcon']),
     ...makeTransitionProps({
       transition: false
@@ -14814,6 +14844,7 @@
       const selectionIndex = vue.shallowRef(-1);
       let cleared = false;
       const color = vue.computed(() => vTextFieldRef.value?.color);
+      const label = vue.computed(() => menu.value ? props.closeText : props.openText);
       const {
         items,
         transformIn,
@@ -15189,7 +15220,9 @@
               "class": "v-combobox__menu-icon",
               "icon": props.menuIcon,
               "onMousedown": onMousedownMenuIcon,
-              "onClick": noop
+              "onClick": noop,
+              "aria-label": t(label.value),
+              "title": t(label.value)
             }, null) : undefined]);
           }
         });
@@ -18532,25 +18565,32 @@
               }, null),
               input: _ref3 => {
                 let {
-                  textColorClasses,
-                  textColorStyles
+                  inputNode,
+                  icon
                 } = _ref3;
-                return vue.createVNode("div", {
-                  "class": ['v-switch__thumb', textColorClasses.value],
-                  "style": textColorStyles.value
-                }, [props.loading && vue.createVNode(LoaderSlot, {
-                  "name": "v-switch",
-                  "active": true,
-                  "color": isValid.value === false ? undefined : loaderColor.value
-                }, {
-                  default: slotProps => slots.loader ? slots.loader(slotProps) : vue.createVNode(VProgressCircular, {
-                    "active": slotProps.isActive,
-                    "color": slotProps.color,
-                    "indeterminate": true,
-                    "size": "16",
-                    "width": "2"
-                  }, null)
-                })]);
+                return vue.createVNode(vue.Fragment, null, [inputNode, vue.createVNode("div", {
+                  "class": ['v-switch__thumb', {
+                    'v-switch__thumb--filled': icon || props.loading
+                  }]
+                }, [vue.createVNode(VScaleTransition, null, {
+                  default: () => [!props.loading ? icon && vue.createVNode(VIcon, {
+                    "key": icon,
+                    "icon": icon,
+                    "size": "x-small"
+                  }, null) : vue.createVNode(LoaderSlot, {
+                    "name": "v-switch",
+                    "active": true,
+                    "color": isValid.value === false ? undefined : loaderColor.value
+                  }, {
+                    default: slotProps => slots.loader ? slots.loader(slotProps) : vue.createVNode(VProgressCircular, {
+                      "active": slotProps.isActive,
+                      "color": slotProps.color,
+                      "indeterminate": true,
+                      "size": "16",
+                      "width": "2"
+                    }, null)
+                  })]
+                })])]);
               }
             });
           }
@@ -19031,8 +19071,7 @@
               "onMousedown": onControlMousedown,
               "onClick:clear": onClear,
               "onClick:prependInner": props['onClick:prependInner'],
-              "onClick:appendInner": props['onClick:appendInner'],
-              "role": "textbox"
+              "onClick:appendInner": props['onClick:appendInner']
             }, fieldProps, {
               "active": isActive.value || isDirty.value,
               "centerAffix": rows.value === 1 && !isPlainOrUnderlined.value,
@@ -20293,7 +20332,7 @@
       date
     };
   }
-  const version$1 = "3.3.12";
+  const version$1 = "3.3.13";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -20318,7 +20357,7 @@
       ...options
     });
   };
-  const version = "3.3.12";
+  const version = "3.3.13";
   createVuetify.version = version;
 
   exports.components = components;