vuetify 3.3.13 → 3.3.15

package/dist/vuetify.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.3.13
+* Vuetify v3.3.15
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, watch, onScopeDispose, effectScope, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, readonly, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
+import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, watch, readonly, onDeactivated, onActivated, onMounted, onScopeDispose, effectScope, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
 
 // Types
 // eslint-disable-line vue/prefer-import-from-vue
@@ -224,14 +224,22 @@ function omit(obj, exclude) {
   exclude.forEach(prop => delete clone[prop]);
   return clone;
 }
+const onRE = /^on[^a-z]/;
+const isOn = key => onRE.test(key);
+const bubblingEvents = ['onAfterscriptexecute', 'onAnimationcancel', 'onAnimationend', 'onAnimationiteration', 'onAnimationstart', 'onAuxclick', 'onBeforeinput', 'onBeforescriptexecute', 'onChange', 'onClick', 'onCompositionend', 'onCompositionstart', 'onCompositionupdate', 'onContextmenu', 'onCopy', 'onCut', 'onDblclick', 'onFocusin', 'onFocusout', 'onFullscreenchange', 'onFullscreenerror', 'onGesturechange', 'onGestureend', 'onGesturestart', 'onGotpointercapture', 'onInput', 'onKeydown', 'onKeypress', 'onKeyup', 'onLostpointercapture', 'onMousedown', 'onMousemove', 'onMouseout', 'onMouseover', 'onMouseup', 'onMousewheel', 'onPaste', 'onPointercancel', 'onPointerdown', 'onPointerenter', 'onPointerleave', 'onPointermove', 'onPointerout', 'onPointerover', 'onPointerup', 'onReset', 'onSelect', 'onSubmit', 'onTouchcancel', 'onTouchend', 'onTouchmove', 'onTouchstart', 'onTransitioncancel', 'onTransitionend', 'onTransitionrun', 'onTransitionstart', 'onWheel'];
 
 /**
  * Filter attributes that should be applied to
- * the root element of a an input component. Remaining
+ * the root element of an input component. Remaining
  * attributes should be passed to the <input> element inside.
  */
 function filterInputAttrs(attrs) {
-  return pick(attrs, ['class', 'style', 'id', /^data-/]);
+  const [events, props] = pick(attrs, [onRE]);
+  const inputEvents = omit(events, bubblingEvents);
+  const [rootAttrs, inputAttrs] = pick(props, ['class', 'style', 'id', /^data-/]);
+  Object.assign(rootAttrs, events);
+  Object.assign(inputAttrs, inputEvents);
+  return [rootAttrs, inputAttrs];
 }
 function wrapInArray(v) {
   return v == null ? [] : Array.isArray(v) ? v : [v];
@@ -384,8 +392,6 @@ function destructComputed(getter) {
 function includes(arr, val) {
   return arr.includes(val);
 }
-const onRE = /^on[^a-z]/;
-const isOn = key => onRE.test(key);
 function eventName(propName) {
   return propName[2].toLowerCase() + propName.slice(3);
 }
@@ -652,6 +658,94 @@ function unbindProps(el, props) {
   });
 }
 
+/**
+ * WCAG 3.0 APCA perceptual contrast algorithm from https://github.com/Myndex/SAPC-APCA
+ * @licence https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
+ * @see https://www.w3.org/WAI/GL/task-forces/silver/wiki/Visual_Contrast_of_Text_Subgroup
+ */
+// Types
+
+// MAGICAL NUMBERS
+
+// sRGB Conversion to Relative Luminance (Y)
+
+// Transfer Curve (aka "Gamma") for sRGB linearization
+// Simple power curve vs piecewise described in docs
+// Essentially, 2.4 best models actual display
+// characteristics in combination with the total method
+const mainTRC = 2.4;
+const Rco = 0.2126729; // sRGB Red Coefficient (from matrix)
+const Gco = 0.7151522; // sRGB Green Coefficient (from matrix)
+const Bco = 0.0721750; // sRGB Blue Coefficient (from matrix)
+
+// For Finding Raw SAPC Contrast from Relative Luminance (Y)
+
+// Constants for SAPC Power Curve Exponents
+// One pair for normal text, and one for reverse
+// These are the "beating heart" of SAPC
+const normBG = 0.55;
+const normTXT = 0.58;
+const revTXT = 0.57;
+const revBG = 0.62;
+
+// For Clamping and Scaling Values
+
+const blkThrs = 0.03; // Level that triggers the soft black clamp
+const blkClmp = 1.45; // Exponent for the soft black clamp curve
+const deltaYmin = 0.0005; // Lint trap
+const scaleBoW = 1.25; // Scaling for dark text on light
+const scaleWoB = 1.25; // Scaling for light text on dark
+const loConThresh = 0.078; // Threshold for new simple offset scale
+const loConFactor = 12.82051282051282; // = 1/0.078,
+const loConOffset = 0.06; // The simple offset
+const loClip = 0.001; // Output clip (lint trap #2)
+
+function APCAcontrast(text, background) {
+  // Linearize sRGB
+  const Rtxt = (text.r / 255) ** mainTRC;
+  const Gtxt = (text.g / 255) ** mainTRC;
+  const Btxt = (text.b / 255) ** mainTRC;
+  const Rbg = (background.r / 255) ** mainTRC;
+  const Gbg = (background.g / 255) ** mainTRC;
+  const Bbg = (background.b / 255) ** mainTRC;
+
+  // Apply the standard coefficients and sum to Y
+  let Ytxt = Rtxt * Rco + Gtxt * Gco + Btxt * Bco;
+  let Ybg = Rbg * Rco + Gbg * Gco + Bbg * Bco;
+
+  // Soft clamp Y when near black.
+  // Now clamping all colors to prevent crossover errors
+  if (Ytxt <= blkThrs) Ytxt += (blkThrs - Ytxt) ** blkClmp;
+  if (Ybg <= blkThrs) Ybg += (blkThrs - Ybg) ** blkClmp;
+
+  // Return 0 Early for extremely low ∆Y (lint trap #1)
+  if (Math.abs(Ybg - Ytxt) < deltaYmin) return 0.0;
+
+  // SAPC CONTRAST
+
+  let outputContrast; // For weighted final values
+  if (Ybg > Ytxt) {
+    // For normal polarity, black text on white
+    // Calculate the SAPC contrast value and scale
+
+    const SAPC = (Ybg ** normBG - Ytxt ** normTXT) * scaleBoW;
+
+    // NEW! SAPC SmoothScale™
+    // Low Contrast Smooth Scale Rollout to prevent polarity reversal
+    // and also a low clip for very low contrasts (lint trap #2)
+    // much of this is for very low contrasts, less than 10
+    // therefore for most reversing needs, only loConOffset is important
+    outputContrast = SAPC < loClip ? 0.0 : SAPC < loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC - loConOffset;
+  } else {
+    // For reverse polarity, light text on dark
+    // WoB should always return negative value.
+
+    const SAPC = (Ybg ** revBG - Ytxt ** revTXT) * scaleWoB;
+    outputContrast = SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;
+  }
+  return outputContrast * 100;
+}
+
 /* eslint-disable no-console */
 
 function consoleWarn(message) {
@@ -1008,36 +1102,13 @@ function getContrast(first, second) {
   const dark = Math.min(l1, l2);
   return (light + 0.05) / (dark + 0.05);
 }
-
-// Utilities
-
-// Types
-
-function useToggleScope(source, fn) {
-  let scope;
-  function start() {
-    scope = effectScope();
-    scope.run(() => fn.length ? fn(() => {
-      scope?.stop();
-      start();
-    }) : fn());
-  }
-  watch(source, active => {
-    if (active && !scope) {
-      start();
-    } else if (!active) {
-      scope?.stop();
-      scope = undefined;
-    }
-  }, {
-    immediate: true
-  });
-  onScopeDispose(() => {
-    scope?.stop();
-  });
+function getForeground(color) {
+  const blackContrast = Math.abs(APCAcontrast(parseColor(0), parseColor(color)));
+  const whiteContrast = Math.abs(APCAcontrast(parseColor(0xffffff), parseColor(color)));
+  return whiteContrast > Math.min(blackContrast, 50) ? '#fff' : '#000';
 }
 
-// Composables
+// Utilities
 
 // Types
 
@@ -1059,6 +1130,7 @@ function provideDefaults(defaults, options) {
     const scoped = unref(options?.scoped);
     const reset = unref(options?.reset);
     const root = unref(options?.root);
+    if (providedDefaults.value == null && !(scoped || reset || root)) return injectedDefaults.value;
     let properties = mergeDeep(providedDefaults.value, {
       prev: injectedDefaults.value
     });
@@ -1114,16 +1186,16 @@ function internalUseDefaults() {
         let [key] = _ref;
         return key.startsWith(key[0].toUpperCase());
       });
-      if (subComponents.length) _subcomponentDefaults.value = Object.fromEntries(subComponents);
+      _subcomponentDefaults.value = subComponents.length ? Object.fromEntries(subComponents) : undefined;
+    } else {
+      _subcomponentDefaults.value = undefined;
     }
   });
   function provideSubDefaults() {
-    // If subcomponent defaults are provided, override any
-    // subcomponents provided by the component's setup function.
-    // This uses injectSelf so must be done after the original setup to work.
-    useToggleScope(_subcomponentDefaults, () => {
-      provideDefaults(mergeDeep(injectSelf(DefaultsSymbol)?.value ?? {}, _subcomponentDefaults.value));
-    });
+    const injected = injectSelf(DefaultsSymbol, vm);
+    provide(DefaultsSymbol, computed(() => {
+      return _subcomponentDefaults.value ? mergeDeep(injected?.value ?? {}, _subcomponentDefaults.value) : injected?.value;
+    }));
   }
   return {
     props: _props,
@@ -1301,9 +1373,10 @@ function isPotentiallyScrollable(el) {
 // Types
 
 function injectSelf(key) {
+  let vm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstance('injectSelf');
   const {
     provides
-  } = getCurrentInstance('injectSelf');
+  } = vm;
   if (provides && key in provides) {
     // TS doesn't allow symbol as index type
     return provides[key];
@@ -1780,6 +1853,34 @@ const defaultRtl = {
   zhHant: false
 };
 
+// Utilities
+
+// Types
+
+function useToggleScope(source, fn) {
+  let scope;
+  function start() {
+    scope = effectScope();
+    scope.run(() => fn.length ? fn(() => {
+      scope?.stop();
+      start();
+    }) : fn());
+  }
+  watch(source, active => {
+    if (active && !scope) {
+      start();
+    } else if (!active) {
+      scope?.stop();
+      scope = undefined;
+    }
+  }, {
+    immediate: true
+  });
+  onScopeDispose(() => {
+    scope?.stop();
+  });
+}
+
 // Composables
 
 // Types
@@ -1981,94 +2082,6 @@ function useRtl() {
   };
 }
 
-/**
- * WCAG 3.0 APCA perceptual contrast algorithm from https://github.com/Myndex/SAPC-APCA
- * @licence https://www.w3.org/Consortium/Legal/2015/copyright-software-and-document
- * @see https://www.w3.org/WAI/GL/task-forces/silver/wiki/Visual_Contrast_of_Text_Subgroup
- */
-// Types
-
-// MAGICAL NUMBERS
-
-// sRGB Conversion to Relative Luminance (Y)
-
-// Transfer Curve (aka "Gamma") for sRGB linearization
-// Simple power curve vs piecewise described in docs
-// Essentially, 2.4 best models actual display
-// characteristics in combination with the total method
-const mainTRC = 2.4;
-const Rco = 0.2126729; // sRGB Red Coefficient (from matrix)
-const Gco = 0.7151522; // sRGB Green Coefficient (from matrix)
-const Bco = 0.0721750; // sRGB Blue Coefficient (from matrix)
-
-// For Finding Raw SAPC Contrast from Relative Luminance (Y)
-
-// Constants for SAPC Power Curve Exponents
-// One pair for normal text, and one for reverse
-// These are the "beating heart" of SAPC
-const normBG = 0.55;
-const normTXT = 0.58;
-const revTXT = 0.57;
-const revBG = 0.62;
-
-// For Clamping and Scaling Values
-
-const blkThrs = 0.03; // Level that triggers the soft black clamp
-const blkClmp = 1.45; // Exponent for the soft black clamp curve
-const deltaYmin = 0.0005; // Lint trap
-const scaleBoW = 1.25; // Scaling for dark text on light
-const scaleWoB = 1.25; // Scaling for light text on dark
-const loConThresh = 0.078; // Threshold for new simple offset scale
-const loConFactor = 12.82051282051282; // = 1/0.078,
-const loConOffset = 0.06; // The simple offset
-const loClip = 0.001; // Output clip (lint trap #2)
-
-function APCAcontrast(text, background) {
-  // Linearize sRGB
-  const Rtxt = (text.r / 255) ** mainTRC;
-  const Gtxt = (text.g / 255) ** mainTRC;
-  const Btxt = (text.b / 255) ** mainTRC;
-  const Rbg = (background.r / 255) ** mainTRC;
-  const Gbg = (background.g / 255) ** mainTRC;
-  const Bbg = (background.b / 255) ** mainTRC;
-
-  // Apply the standard coefficients and sum to Y
-  let Ytxt = Rtxt * Rco + Gtxt * Gco + Btxt * Bco;
-  let Ybg = Rbg * Rco + Gbg * Gco + Bbg * Bco;
-
-  // Soft clamp Y when near black.
-  // Now clamping all colors to prevent crossover errors
-  if (Ytxt <= blkThrs) Ytxt += (blkThrs - Ytxt) ** blkClmp;
-  if (Ybg <= blkThrs) Ybg += (blkThrs - Ybg) ** blkClmp;
-
-  // Return 0 Early for extremely low ∆Y (lint trap #1)
-  if (Math.abs(Ybg - Ytxt) < deltaYmin) return 0.0;
-
-  // SAPC CONTRAST
-
-  let outputContrast; // For weighted final values
-  if (Ybg > Ytxt) {
-    // For normal polarity, black text on white
-    // Calculate the SAPC contrast value and scale
-
-    const SAPC = (Ybg ** normBG - Ytxt ** normTXT) * scaleBoW;
-
-    // NEW! SAPC SmoothScale™
-    // Low Contrast Smooth Scale Rollout to prevent polarity reversal
-    // and also a low clip for very low contrasts (lint trap #2)
-    // much of this is for very low contrasts, less than 10
-    // therefore for most reversing needs, only loConOffset is important
-    outputContrast = SAPC < loClip ? 0.0 : SAPC < loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC - loConOffset;
-  } else {
-    // For reverse polarity, light text on dark
-    // WoB should always return negative value.
-
-    const SAPC = (Ybg ** revBG - Ytxt ** revTXT) * scaleWoB;
-    outputContrast = SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;
-  }
-  return outputContrast * 100;
-}
-
 // Utilities
 
 // Types
@@ -2090,6 +2103,7 @@ const defaultThemeOptions = {
       colors: {
         background: '#FFFFFF',
         surface: '#FFFFFF',
+        'surface-bright': '#FFFFFF',
         'surface-variant': '#424242',
         'on-surface-variant': '#EEEEEE',
         primary: '#6200EE',
@@ -2125,7 +2139,8 @@ const defaultThemeOptions = {
       colors: {
         background: '#121212',
         surface: '#212121',
-        'surface-variant': '#BDBDBD',
+        'surface-bright': '#ccbfd6',
+        'surface-variant': '#a3a3a3',
         'on-surface-variant': '#424242',
         primary: '#BB86FC',
         'primary-darken-1': '#3700B3',
@@ -2204,8 +2219,6 @@ function createTheme(options) {
         if (/^on-[a-z]/.test(color) || theme.colors[`on-${color}`]) continue;
         const onColor = `on-${color}`;
         const colorVal = parseColor(theme.colors[color]);
-        const blackContrast = Math.abs(APCAcontrast(parseColor(0), colorVal));
-        const whiteContrast = Math.abs(APCAcontrast(parseColor(0xffffff), colorVal));
 
         // TODO: warn about poor color selections
         // const contrastAsText = Math.abs(APCAcontrast(colorVal, colorToInt(theme.colors.background)))
@@ -2217,7 +2230,7 @@ function createTheme(options) {
         // }
 
         // Prefer white text if both have an acceptable contrast ratio
-        theme.colors[onColor] = whiteContrast > Math.min(blackContrast, 50) ? '#fff' : '#000';
+        theme.colors[onColor] = getForeground(colorVal);
       }
     }
     return acc;
@@ -2318,12 +2331,14 @@ function provideTheme(props) {
   const theme = inject$1(ThemeSymbol, null);
   if (!theme) throw new Error('Could not find Vuetify theme injection');
   const name = computed(() => {
-    return props.theme ?? theme?.name.value;
+    return props.theme ?? theme.name.value;
   });
+  const current = computed(() => theme.themes.value[name.value]);
   const themeClasses = computed(() => theme.isDisabled ? undefined : `v-theme--${name.value}`);
   const newTheme = {
     ...theme,
     name,
+    current,
     themeClasses
   };
   provide(ThemeSymbol, newTheme);
@@ -3246,6 +3261,11 @@ function useColor(colors) {
     if (colors.value.background) {
       if (isCssColor(colors.value.background)) {
         styles.backgroundColor = colors.value.background;
+        if (!colors.value.text) {
+          const textColor = getForeground(styles.backgroundColor);
+          styles.color = textColor;
+          styles.caretColor = textColor;
+        }
       } else {
         classes.push(`bg-${colors.value.background}`);
       }
@@ -5775,6 +5795,12 @@ function useSelectionControl(props) {
   } = useTextColor(computed(() => {
     return model.value && !props.error && !props.disabled ? props.color : undefined;
   }));
+  const {
+    backgroundColorClasses,
+    backgroundColorStyles
+  } = useBackgroundColor(computed(() => {
+    return model.value && !props.error && !props.disabled ? props.color : undefined;
+  }));
   const icon = computed(() => model.value ? props.trueIcon : props.falseIcon);
   return {
     group,
@@ -5784,6 +5810,8 @@ function useSelectionControl(props) {
     model,
     textColorClasses,
     textColorStyles,
+    backgroundColorClasses,
+    backgroundColorStyles,
     icon
   };
 }
@@ -5809,6 +5837,8 @@ const VSelectionControl = genericComponent()({
       model,
       textColorClasses,
       textColorStyles,
+      backgroundColorClasses,
+      backgroundColorStyles,
       trueValue
     } = useSelectionControl(props);
     const uid = getUid();
@@ -5873,12 +5903,17 @@ const VSelectionControl = genericComponent()({
       }), [createVNode("div", {
         "class": ['v-selection-control__wrapper', textColorClasses.value],
         "style": textColorStyles.value
-      }, [slots.default?.(), withDirectives(createVNode("div", {
+      }, [slots.default?.({
+        backgroundColorClasses,
+        backgroundColorStyles
+      }), withDirectives(createVNode("div", {
         "class": ['v-selection-control__input']
       }, [slots.input?.({
         model,
         textColorClasses,
         textColorStyles,
+        backgroundColorClasses,
+        backgroundColorStyles,
         inputNode,
         icon: icon.value,
         props: {
@@ -5891,7 +5926,8 @@ const VSelectionControl = genericComponent()({
         "icon": icon.value
       }, null), inputNode])]), [[resolveDirective("ripple"), props.ripple && [!props.disabled && !props.readonly, null, ['center', 'circle']]]])]), label && createVNode(VLabel, {
         "for": id.value,
-        "clickable": true
+        "clickable": true,
+        "onClick": e => e.stopPropagation()
       }, {
         default: () => [label]
       })]);
@@ -5940,16 +5976,19 @@ const VCheckboxBtn = genericComponent()({
     const trueIcon = computed(() => {
       return indeterminate.value ? props.indeterminateIcon : props.trueIcon;
     });
-    useRender(() => createVNode(VSelectionControl, mergeProps(props, {
-      "modelValue": model.value,
-      "onUpdate:modelValue": [$event => model.value = $event, onChange],
-      "class": ['v-checkbox-btn', props.class],
-      "style": props.style,
-      "type": "checkbox",
-      "falseIcon": falseIcon.value,
-      "trueIcon": trueIcon.value,
-      "aria-checked": indeterminate.value ? 'mixed' : undefined
-    }), slots));
+    useRender(() => {
+      const controlProps = omit(VSelectionControl.filterProps(props)[0], ['modelValue']);
+      return createVNode(VSelectionControl, mergeProps(controlProps, {
+        "modelValue": model.value,
+        "onUpdate:modelValue": [$event => model.value = $event, onChange],
+        "class": ['v-checkbox-btn', props.class],
+        "style": props.style,
+        "type": "checkbox",
+        "falseIcon": falseIcon.value,
+        "trueIcon": trueIcon.value,
+        "aria-checked": indeterminate.value ? 'mixed' : undefined
+      }), slots);
+    });
     return {};
   }
 });
@@ -6513,12 +6552,12 @@ const VCheckbox = genericComponent()({
     const uid = getUid();
     const id = computed(() => props.id || `checkbox-${uid}`);
     useRender(() => {
-      const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
+      const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = VInput.filterProps(props);
       const [checkboxProps, _2] = VCheckboxBtn.filterProps(props);
       return createVNode(VInput, mergeProps({
         "class": ['v-checkbox', props.class]
-      }, inputAttrs, inputProps, {
+      }, rootAttrs, inputProps, {
         "modelValue": model.value,
         "onUpdate:modelValue": $event => model.value = $event,
         "id": id.value,
@@ -9085,7 +9124,7 @@ function _useActivator(props, vm, _ref2) {
     if (selector) {
       if (selector === 'parent') {
         let el = vm?.proxy?.$el?.parentNode;
-        while (el.hasAttribute('data-no-activator')) {
+        while (el?.hasAttribute('data-no-activator')) {
           el = el.parentNode;
         }
         activator = el;
@@ -10846,6 +10885,7 @@ const VSelect = genericComponent()({
     } = useLocale();
     const vTextFieldRef = ref();
     const vMenuRef = ref();
+    const vVirtualScrollRef = ref();
     const _menu = useProxiedModel(props, 'menu');
     const menu = computed({
       get: () => _menu.value,
@@ -10975,6 +11015,14 @@ const VSelect = genericComponent()({
         vTextFieldRef.value.value = '';
       }
     }
+    watch(menu, () => {
+      if (!props.hideSelected && menu.value && selections.value.length) {
+        const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
+        IN_BROWSER && window.requestAnimationFrame(() => {
+          index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
+        });
+      }
+    });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
@@ -11036,6 +11084,7 @@ const VSelect = genericComponent()({
             default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
             }, null)), createVNode(VVirtualScroll, {
+              "ref": vVirtualScrollRef,
               "renderless": true,
               "items": displayItems.value
             }, {
@@ -11296,6 +11345,7 @@ const VAutocomplete = genericComponent()({
     const isPristine = shallowRef(true);
     const listHasFocus = shallowRef(false);
     const vMenuRef = ref();
+    const vVirtualScrollRef = ref();
     const _menu = useProxiedModel(props, 'menu');
     const menu = computed({
       get: () => _menu.value,
@@ -11386,7 +11436,7 @@ const VAutocomplete = genericComponent()({
         menu.value = false;
       }
       if (highlightFirst.value && ['Enter', 'Tab'].includes(e.key)) {
-        select(filteredItems.value[0]);
+        select(displayItems.value[0]);
       }
       if (e.key === 'ArrowDown' && highlightFirst.value) {
         listRef.value?.focus('next');
@@ -11499,6 +11549,14 @@ const VAutocomplete = genericComponent()({
       if (val) menu.value = true;
       isPristine.value = !val;
     });
+    watch(menu, () => {
+      if (!props.hideSelected && menu.value && selections.value.length) {
+        const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
+        IN_BROWSER && window.requestAnimationFrame(() => {
+          index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
+        });
+      }
+    });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
@@ -11558,6 +11616,7 @@ const VAutocomplete = genericComponent()({
             default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
             }, null)), createVNode(VVirtualScroll, {
+              "ref": vVirtualScrollRef,
               "renderless": true,
               "items": displayItems.value
             }, {
@@ -14829,6 +14888,7 @@ const VCombobox = genericComponent()({
     const isPristine = shallowRef(true);
     const listHasFocus = shallowRef(false);
     const vMenuRef = ref();
+    const vVirtualScrollRef = ref();
     const _menu = useProxiedModel(props, 'menu');
     const menu = computed({
       get: () => _menu.value,
@@ -15062,6 +15122,14 @@ const VCombobox = genericComponent()({
         search.value = '';
       }
     });
+    watch(menu, () => {
+      if (!props.hideSelected && menu.value && selections.value.length) {
+        const index = displayItems.value.findIndex(item => selections.value.some(s => item.value === s.value));
+        IN_BROWSER && window.requestAnimationFrame(() => {
+          index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
+        });
+      }
+    });
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots['prepend-item'] || slots['append-item'] || slots['no-data']);
@@ -15120,6 +15188,7 @@ const VCombobox = genericComponent()({
             default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
             }, null)), createVNode(VVirtualScroll, {
+              "ref": vVirtualScrollRef,
               "renderless": true,
               "items": displayItems.value
             }, {
@@ -17511,7 +17580,7 @@ const VRadioGroup = genericComponent()({
     const id = computed(() => props.id || `radio-group-${uid}`);
     const model = useProxiedModel(props, 'modelValue');
     useRender(() => {
-      const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
+      const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = VInput.filterProps(props);
       const [controlProps, _2] = VSelectionControl.filterProps(props);
       const label = slots.label ? slots.label({
@@ -17523,7 +17592,7 @@ const VRadioGroup = genericComponent()({
       return createVNode(VInput, mergeProps({
         "class": ['v-radio-group', props.class],
         "style": props.style
-      }, inputAttrs, inputProps, {
+      }, rootAttrs, inputProps, {
         "modelValue": model.value,
         "onUpdate:modelValue": $event => model.value = $event,
         "id": id.value
@@ -18500,6 +18569,7 @@ const VSwitch = genericComponent()({
       focus,
       blur
     } = useFocus(props);
+    const control = ref();
     const loaderColor = computed(() => {
       return typeof props.loading === 'string' && props.loading !== '' ? props.loading : props.color;
     });
@@ -18510,16 +18580,15 @@ const VSwitch = genericComponent()({
         indeterminate.value = false;
       }
     }
+    function onTrackClick(e) {
+      e.stopPropagation();
+      e.preventDefault();
+      control.value?.input?.click();
+    }
     useRender(() => {
-      const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
+      const [rootAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = VInput.filterProps(props);
       const [controlProps, _2] = VSelectionControl.filterProps(props);
-      const control = ref();
-      function onClick(e) {
-        e.stopPropagation();
-        e.preventDefault();
-        control.value?.input?.click();
-      }
       return createVNode(VInput, mergeProps({
         "class": ['v-switch', {
           'v-switch--inset': props.inset
@@ -18527,7 +18596,7 @@ const VSwitch = genericComponent()({
           'v-switch--indeterminate': indeterminate.value
         }, loaderClasses.value, props.class],
         "style": props.style
-      }, inputAttrs, inputProps, {
+      }, rootAttrs, inputProps, {
         "id": id.value,
         "focused": isFocused.value
       }), {
@@ -18555,19 +18624,29 @@ const VSwitch = genericComponent()({
             "onBlur": blur
           }, controlAttrs), {
             ...slots,
-            default: () => createVNode("div", {
-              "class": "v-switch__track",
-              "onClick": onClick
-            }, null),
-            input: _ref3 => {
+            default: _ref3 => {
               let {
-                inputNode,
-                icon
+                backgroundColorClasses,
+                backgroundColorStyles
               } = _ref3;
+              return createVNode("div", {
+                "class": ['v-switch__track', ...backgroundColorClasses.value],
+                "style": backgroundColorStyles.value,
+                "onClick": onTrackClick
+              }, null);
+            },
+            input: _ref4 => {
+              let {
+                inputNode,
+                icon,
+                backgroundColorClasses,
+                backgroundColorStyles
+              } = _ref4;
               return createVNode(Fragment, null, [inputNode, createVNode("div", {
                 "class": ['v-switch__thumb', {
                   'v-switch__thumb--filled': icon || props.loading
-                }]
+                }, props.inset ? undefined : backgroundColorClasses.value],
+                "style": props.inset ? undefined : backgroundColorStyles.value
               }, [createVNode(VScaleTransition, null, {
                 default: () => [!props.loading ? icon && createVNode(VIcon, {
                   "key": icon,
@@ -18708,8 +18787,8 @@ const VTab = genericComponent()({
         const delta = prevPos > nextPos ? prevBox[rightBottom] - nextBox[rightBottom] : prevBox[xy] - nextBox[xy];
         const origin = Math.sign(delta) > 0 ? isHorizontal.value ? 'right' : 'bottom' : Math.sign(delta) < 0 ? isHorizontal.value ? 'left' : 'top' : 'center';
         const size = Math.abs(delta) + (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight]);
-        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight]);
-        const initialScale = prevBox[widthHeight] / nextBox[widthHeight];
+        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight]) || 0;
+        const initialScale = prevBox[widthHeight] / nextBox[widthHeight] || 0;
         const sigma = 1.5;
         animate(nextEl, {
           backgroundColor: [color, 'currentcolor'],
@@ -19105,6 +19184,7 @@ const VTextarea = genericComponent()({
                 once: true
               }]]), props.autoGrow && withDirectives(createVNode("textarea", {
                 "class": [fieldClass, 'v-textarea__sizer'],
+                "id": `${slotProps.id}-sizer`,
                 "onUpdate:modelValue": $event => model.value = $event,
                 "ref": sizerRef,
                 "readonly": true,
@@ -20328,7 +20408,7 @@ function createVuetify$1() {
     date
   };
 }
-const version$1 = "3.3.13";
+const version$1 = "3.3.15";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -20353,7 +20433,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.3.13";
+const version = "3.3.15";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDefaults, useDisplay, useLayout, useLocale, useRtl, useTheme, version };