@vuetify/nightly 3.0.0-beta.6 → 3.0.0-beta.9

package/dist/vuetify.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.0.0-beta.6
+* Vuetify v3.0.0-beta.9
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { readonly, ref, onBeforeUnmount, watch, Fragment, computed, toRef, unref, provide, inject, defineComponent as defineComponent$1, getCurrentInstance as getCurrentInstance$1, shallowRef, shallowReactive, toRaw, watchEffect, effectScope, capitalize, camelize, h, onDeactivated, onActivated, reactive, onMounted, createVNode, toRefs, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, vShow, resolveDirective, isRef, resolveDynamicComponent, onScopeDispose, vModelDynamic, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
+import { readonly, ref, onBeforeUnmount, watch, Fragment, computed, toRef, getCurrentInstance as getCurrentInstance$1, unref, provide, inject, defineComponent as defineComponent$1, shallowRef, shallowReactive, toRaw, watchEffect, effectScope, capitalize, camelize, h, onDeactivated, onActivated, reactive, onMounted, createVNode, toRefs, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, vShow, resolveDirective, isRef, resolveDynamicComponent, onScopeDispose, warn, toHandlers, Teleport, vModelDynamic, cloneVNode, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
 
 const IN_BROWSER = typeof window !== 'undefined';
 const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
@@ -347,7 +347,8 @@ function getEventCoordinates(e) {
     clientX: e.clientX,
     clientY: e.clientY
   };
-}
+} // Only allow a single return type
+
 function destructComputed(getter) {
   const refs = {};
   const base = computed(getter);
@@ -365,6 +366,8 @@ function destructComputed(getter) {
   });
   return refs;
 }
+/** Array.includes but value can be any type */
+
 function includes(arr, val) {
   return arr.includes(val);
 }
@@ -385,13 +388,11 @@ function parseAnchor(anchor, isRtl) {
     align: toPhysical(align, isRtl)
   };
 }
-
 function toPhysical(str, isRtl) {
   if (str === 'start') return isRtl ? 'right' : 'left';
   if (str === 'end') return isRtl ? 'left' : 'right';
   return str;
 }
-
 function flipSide(anchor) {
   return {
     side: {
@@ -667,7 +668,7 @@ function colorToInt(color) {
       c = c.split('').map(char => char + char).join('');
     }
 
-    if (c.length !== 6) {
+    if (c.length !== 6 && c.length !== 8) {
       consoleWarn(`'${color}' is not a valid rgb color`);
     }
 
@@ -679,7 +680,7 @@ function colorToInt(color) {
   if (rgb < 0) {
     consoleWarn(`Colors cannot be negative: '${color}'`);
     rgb = 0;
-  } else if (rgb > 0xffffff || isNaN(rgb)) {
+  } else if (rgb > 0xffffffff || isNaN(rgb)) {
     consoleWarn(`'${color}' is not a valid rgb color`);
     rgb = 0xffffff;
   }
@@ -881,6 +882,53 @@ function getContrast(first, second) {
   return (light + 0.05) / (dark + 0.05);
 }
 
+// Utilities
+function getCurrentInstance(name, message) {
+  const vm = getCurrentInstance$1();
+
+  if (!vm) {
+    throw new Error(`[Vuetify] ${name} ${message || 'must be called from inside a setup function'}`);
+  }
+
+  return vm;
+}
+function getCurrentInstanceName() {
+  var _getCurrentInstance$t;
+
+  let name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'composables';
+  return toKebabCase((_getCurrentInstance$t = getCurrentInstance(name).type) == null ? void 0 : _getCurrentInstance$t.name);
+}
+let _uid = 0;
+
+let _map = new WeakMap();
+
+function getUid() {
+  const vm = getCurrentInstance('getUid');
+  if (_map.has(vm)) return _map.get(vm);else {
+    const uid = _uid++;
+
+    _map.set(vm, uid);
+
+    return uid;
+  }
+}
+
+getUid.reset = () => {
+  _uid = 0;
+  _map = new WeakMap();
+};
+
+function injectSelf(key) {
+  const {
+    provides
+  } = getCurrentInstance('injectSelf');
+
+  if (provides && key in provides) {
+    // TS doesn't allow symbol as index type
+    return provides[key];
+  }
+}
+
 // Utilities
 
 const DefaultsSymbol = Symbol.for('vuetify:defaults');
@@ -992,7 +1040,9 @@ const defineComponent = function defineComponent(options) {
         if (!val && scope) scope.stop();else if (val && !oldVal) {
           scope = effectScope();
           scope.run(() => {
-            provideDefaults(val);
+            var _injectSelf$value, _injectSelf;
+
+            provideDefaults(mergeDeep((_injectSelf$value = (_injectSelf = injectSelf(DefaultsSymbol)) == null ? void 0 : _injectSelf.value) != null ? _injectSelf$value : {}, val));
           });
         }
       }, {
@@ -1066,42 +1116,6 @@ const deceleratedEasing = 'cubic-bezier(0.0, 0, 0.2, 1)'; // Entering
 
 const acceleratedEasing = 'cubic-bezier(0.4, 0, 1, 1)'; // Leaving
 
-// Utilities
-function getCurrentInstance(name, message) {
-  const vm = getCurrentInstance$1();
-
-  if (!vm) {
-    throw new Error(`[Vuetify] ${name} ${message || 'must be called from inside a setup function'}`);
-  }
-
-  return vm;
-}
-function getCurrentInstanceName() {
-  var _getCurrentInstance$t;
-
-  let name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'composables';
-  return toKebabCase((_getCurrentInstance$t = getCurrentInstance(name).type) == null ? void 0 : _getCurrentInstance$t.name);
-}
-let _uid = 0;
-
-let _map = new WeakMap();
-
-function getUid() {
-  const vm = getCurrentInstance('getUid');
-  if (_map.has(vm)) return _map.get(vm);else {
-    const uid = _uid++;
-
-    _map.set(vm, uid);
-
-    return uid;
-  }
-}
-
-getUid.reset = () => {
-  _uid = 0;
-  _map = new WeakMap();
-};
-
 function getScrollParent(el) {
   while (el) {
     if (hasScrollbar(el)) return el;
@@ -1342,11 +1356,10 @@ function createLayout(props) {
   const mainStyles = computed(() => {
     const layer = layers.value[layers.value.length - 1].layer;
     return {
-      position: 'relative',
-      paddingLeft: convertToUnit(layer.left),
-      paddingRight: convertToUnit(layer.right),
-      paddingTop: convertToUnit(layer.top),
-      paddingBottom: convertToUnit(layer.bottom),
+      '--v-layout-left': convertToUnit(layer.left),
+      '--v-layout-right': convertToUnit(layer.right),
+      '--v-layout-top': convertToUnit(layer.top),
+      '--v-layout-bottom': convertToUnit(layer.bottom),
       ...(transitionsEnabled.value ? undefined : {
         transition: 'none'
       })
@@ -1425,16 +1438,15 @@ function createLayout(props) {
 
         return { ...styles,
           height: isHorizontal ? `calc(100% - ${item.top}px - ${item.bottom}px)` : elementSize.value ? `${elementSize.value}px` : undefined,
-          marginLeft: isOppositeHorizontal ? undefined : `${item.left}px`,
-          marginRight: isOppositeHorizontal ? `${item.right}px` : undefined,
-          marginTop: position.value !== 'bottom' ? `${item.top}px` : undefined,
-          marginBottom: position.value !== 'top' ? `${item.bottom}px` : undefined,
+          left: isOppositeHorizontal ? undefined : `${item.left}px`,
+          right: isOppositeHorizontal ? `${item.right}px` : undefined,
+          top: position.value !== 'bottom' ? `${item.top}px` : undefined,
+          bottom: position.value !== 'top' ? `${item.bottom}px` : undefined,
           width: !isHorizontal ? `calc(100% - ${item.left}px - ${item.right}px)` : elementSize.value ? `${elementSize.value}px` : undefined
         };
       });
       const layoutItemScrimStyles = computed(() => ({
-        zIndex: zIndex.value - 1,
-        position: rootZIndex.value === ROOT_ZINDEX ? 'fixed' : 'absolute'
+        zIndex: zIndex.value - 1
       }));
       return {
         layoutItemStyles,
@@ -1460,7 +1472,9 @@ function createLayout(props) {
     'v-layout--full-height': props.fullHeight
   }]);
   const layoutStyles = computed(() => ({
-    zIndex: rootZIndex.value
+    zIndex: rootZIndex.value,
+    position: parentLayout ? 'relative' : undefined,
+    overflow: parentLayout ? 'hidden' : undefined
   }));
   return {
     layoutClasses,
@@ -1691,7 +1705,7 @@ function createTheme(app, options) {
       }
 
       for (const color of Object.keys(theme.colors)) {
-        if (/on-[a-z]/.test(color) || theme.colors[`on-${color}`]) continue;
+        if (/^on-[a-z]/.test(color) || theme.colors[`on-${color}`]) continue;
         const onColor = `on-${color}`;
         const colorVal = colorToInt(theme.colors[color]);
         const blackContrast = Math.abs(APCAcontrast(0, colorVal));
@@ -1732,18 +1746,21 @@ function createTheme(app, options) {
       })]);
     }
 
+    const bgLines = [];
+    const fgLines = [];
     const colors = new Set(Object.values(computedThemes.value).flatMap(theme => Object.keys(theme.colors)));
 
     for (const key of colors) {
-      if (/on-[a-z]/.test(key)) {
-        createCssClass(lines, `.${key}`, [`color: rgb(var(--v-theme-${key})) !important`]);
+      if (/^on-[a-z]/.test(key)) {
+        createCssClass(fgLines, `.${key}`, [`color: rgb(var(--v-theme-${key})) !important`]);
       } else {
-        createCssClass(lines, `.bg-${key}`, [`--v-theme-overlay-multiplier: var(--v-theme-${key}-overlay-multiplier)`, `background: rgb(var(--v-theme-${key})) !important`, `color: rgb(var(--v-theme-on-${key})) !important`]);
-        createCssClass(lines, `.text-${key}`, [`color: rgb(var(--v-theme-${key})) !important`]);
-        createCssClass(lines, `.border-${key}`, [`--v-border-color: var(--v-theme-${key})`]);
+        createCssClass(bgLines, `.bg-${key}`, [`--v-theme-overlay-multiplier: var(--v-theme-${key}-overlay-multiplier)`, `background: rgb(var(--v-theme-${key})) !important`, `color: rgb(var(--v-theme-on-${key})) !important`]);
+        createCssClass(fgLines, `.text-${key}`, [`color: rgb(var(--v-theme-${key})) !important`]);
+        createCssClass(fgLines, `.border-${key}`, [`--v-border-color: var(--v-theme-${key})`]);
       }
     }
 
+    lines.push(...bgLines, ...fgLines);
     return lines.map((str, i) => i === 0 ? str : `    ${str}`).join('');
   });
 
@@ -1963,13 +1980,13 @@ const rtl = {
 
 const RtlSymbol = Symbol.for('vuetify:rtl');
 function createRtl(localeScope, options) {
-  var _options$rtl, _options$defaultRtl;
+  var _options$rtl;
 
   return createRtlScope({
     rtl: { ...rtl,
       ...((_options$rtl = options == null ? void 0 : options.rtl) != null ? _options$rtl : {})
     },
-    isRtl: ref((_options$defaultRtl = options == null ? void 0 : options.defaultRtl) != null ? _options$defaultRtl : false),
+    isRtl: ref(false),
     rtlClasses: ref('')
   }, localeScope);
 }
@@ -2751,6 +2768,7 @@ const VImg = defineComponent({
         class: ['v-img__img', containClasses.value],
         src: normalisedSrc.value.src,
         srcset: normalisedSrc.value.srcset,
+        alt: '',
         sizes: props.sizes,
         ref: image,
         onLoad,
@@ -2983,39 +3001,32 @@ function useRounded(props) {
 
 // Composables
 function useColor(colors) {
-  const backgroundIsCssColor = computed(() => isCssColor(colors.value.background));
-  const textIsCssColor = computed(() => isCssColor(colors.value.text));
-  const colorClasses = computed(() => {
+  return destructComputed(() => {
     const classes = [];
-
-    if (colors.value.background && !backgroundIsCssColor.value) {
-      classes.push(`bg-${colors.value.background}`);
-    }
-
-    if (colors.value.text && !textIsCssColor.value) {
-      classes.push(`text-${colors.value.text}`);
-    }
-
-    return classes;
-  });
-  const colorStyles = computed(() => {
     const styles = {};
 
-    if (colors.value.background && backgroundIsCssColor.value) {
-      styles.backgroundColor = colors.value.background;
+    if (colors.value.background) {
+      if (isCssColor(colors.value.background)) {
+        styles.backgroundColor = colors.value.background;
+      } else {
+        classes.push(`bg-${colors.value.background}`);
+      }
     }
 
-    if (colors.value.text && textIsCssColor.value) {
-      styles.color = colors.value.text;
-      styles.caretColor = colors.value.text;
+    if (colors.value.text) {
+      if (isCssColor(colors.value.text)) {
+        styles.color = colors.value.text;
+        styles.caretColor = colors.value.text;
+      } else {
+        classes.push(`text-${colors.value.text}`);
+      }
     }
 
-    return styles;
+    return {
+      colorClasses: classes,
+      colorStyles: styles
+    };
   });
-  return {
-    colorClasses,
-    colorStyles
-  };
 }
 function useTextColor(props, name) {
   const colors = computed(() => ({
@@ -3044,52 +3055,6 @@ function useBackgroundColor(props, name) {
   };
 }
 
-function useForwardRef(target) {
-  for (var _len = arguments.length, refs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-    refs[_key - 1] = arguments[_key];
-  }
-
-  return new Proxy(target, {
-    get(target, key) {
-      if (Reflect.has(target, key)) {
-        return Reflect.get(target, key);
-      }
-
-      for (const ref of refs) {
-        if (ref.value && Reflect.has(ref.value, key)) {
-          const val = Reflect.get(ref.value, key);
-          return typeof val === 'function' ? val.bind(ref.value) : val;
-        }
-      }
-    },
-
-    getOwnPropertyDescriptor(target, key) {
-      const descriptor = Reflect.getOwnPropertyDescriptor(target, key);
-      if (descriptor) return descriptor; // Check each ref's own properties
-
-      for (const ref of refs) {
-        if (!ref.value) continue;
-        const descriptor = Reflect.getOwnPropertyDescriptor(ref.value, key);
-        if (descriptor) return descriptor;
-      } // Recursive search up each ref's prototype
-
-
-      for (const ref of refs) {
-        let obj = ref.value && Object.getPrototypeOf(ref.value);
-
-        while (obj) {
-          const descriptor = Reflect.getOwnPropertyDescriptor(obj, key);
-          if (descriptor) return descriptor;
-          obj = Object.getPrototypeOf(obj);
-        }
-      }
-
-      return undefined;
-    }
-
-  });
-}
-
 const allowedDensities$1 = [null, 'prominent', 'default', 'comfortable', 'compact'];
 const makeVToolbarProps = propsFactory({
   absolute: Boolean,
@@ -3208,10 +3173,10 @@ const VToolbar = genericComponent()({
         })]
       });
     });
-    return useForwardRef({
+    return {
       contentHeight,
       extensionHeight
-    });
+    };
   }
 
 });
@@ -3902,19 +3867,24 @@ const makeSizeProps = propsFactory({
 }, 'size');
 function useSize(props) {
   let name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstanceName();
-  const sizeClasses = computed(() => {
-    return predefinedSizes.includes(props.size) ? `${name}--size-${props.size}` : undefined;
-  });
-  const sizeStyles = computed(() => {
-    return !predefinedSizes.includes(props.size) && props.size ? {
-      width: convertToUnit(props.size),
-      height: convertToUnit(props.size)
-    } : undefined;
+  return destructComputed(() => {
+    let sizeClasses;
+    let sizeStyles;
+
+    if (includes(predefinedSizes, props.size)) {
+      sizeClasses = `${name}--size-${props.size}`;
+    } else if (props.size) {
+      sizeStyles = {
+        width: convertToUnit(props.size),
+        height: convertToUnit(props.size)
+      };
+    }
+
+    return {
+      sizeClasses,
+      sizeStyles
+    };
   });
-  return {
-    sizeClasses,
-    sizeStyles
-  };
 }
 
 const makeVIconProps = propsFactory({
@@ -5083,6 +5053,141 @@ const VAppBarTitle = defineComponent({
 // Utilities
 const VAlertTitle = createSimpleFunctional('v-alert-title');
 
+// Locales
+
+const LocaleAdapterSymbol = Symbol.for('vuetify:locale-adapter');
+const VuetifyLocaleSymbol = Symbol.for('vuetify:locale');
+function provideLocale(props) {
+  const adapter = inject(LocaleAdapterSymbol);
+  if (!adapter) throw new Error('[Vuetify] Could not find injected locale adapter');
+  return adapter.createScope(props);
+}
+function useLocale() {
+  const adapter = inject(LocaleAdapterSymbol);
+  if (!adapter) throw new Error('[Vuetify] Could not find injected locale adapter');
+  return adapter.getScope();
+}
+
+function isLocaleAdapter(x) {
+  return !!x && x.hasOwnProperty('getScope') && x.hasOwnProperty('createScope') && x.hasOwnProperty('createRoot');
+}
+
+function createLocale(app, options) {
+  const adapter = isLocaleAdapter(options) ? options : createDefaultLocaleAdapter(options);
+  const instance = adapter.createRoot(app);
+  app == null ? void 0 : app.provide(RtlSymbol, createRtl(instance, options));
+  return adapter;
+}
+const LANG_PREFIX = '$vuetify.';
+
+const replace = (str, params) => {
+  return str.replace(/\{(\d+)\}/g, (match, index) => {
+    /* istanbul ignore next */
+    return String(params[+index]);
+  });
+};
+
+const createTranslateFunction = (current, fallback, messages) => {
+  return function (key) {
+    for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+      params[_key - 1] = arguments[_key];
+    }
+
+    if (!key.startsWith(LANG_PREFIX)) {
+      return replace(key, params);
+    }
+
+    const shortKey = key.replace(LANG_PREFIX, '');
+    const currentLocale = current.value && messages.value[current.value];
+    const fallbackLocale = fallback.value && messages.value[fallback.value];
+    let str = getObjectValueByPath(currentLocale, shortKey, null);
+
+    if (!str) {
+      consoleWarn(`Translation key "${key}" not found in "${current.value}", trying fallback locale`);
+      str = getObjectValueByPath(fallbackLocale, shortKey, null);
+    }
+
+    if (!str) {
+      consoleError(`Translation key "${key}" not found in fallback`);
+      str = key;
+    }
+
+    if (typeof str !== 'string') {
+      consoleError(`Translation key "${key}" has a non-string value`);
+      str = key;
+    }
+
+    return replace(str, params);
+  };
+};
+
+function createNumberFunction(current, fallback) {
+  return (value, options) => {
+    const numberFormat = new Intl.NumberFormat([current.value, fallback.value], options);
+    return numberFormat.format(value);
+  };
+}
+
+function createDefaultLocaleAdapter(options) {
+  const createScope = options => {
+    const current = ref(options.current);
+    const fallback = ref(options.fallback);
+    const messages = ref(options.messages);
+    return {
+      current,
+      fallback,
+      messages,
+      t: createTranslateFunction(current, fallback, messages),
+      n: createNumberFunction(current, fallback)
+    };
+  };
+
+  return {
+    createRoot: app => {
+      var _options$defaultLocal, _options$fallbackLoca, _options$messages;
+
+      const rootScope = createScope({
+        current: (_options$defaultLocal = options == null ? void 0 : options.defaultLocale) != null ? _options$defaultLocal : 'en',
+        fallback: (_options$fallbackLoca = options == null ? void 0 : options.fallbackLocale) != null ? _options$fallbackLoca : 'en',
+        messages: (_options$messages = options == null ? void 0 : options.messages) != null ? _options$messages : {
+          en
+        }
+      });
+      if (!app) throw new Error('[Vuetify] Could not find default app instance');
+      app.provide(VuetifyLocaleSymbol, rootScope);
+      return rootScope;
+    },
+    getScope: () => {
+      const currentScope = inject(VuetifyLocaleSymbol);
+      if (!currentScope) throw new Error('[Vuetify] Could not find injected locale instance');
+      return currentScope;
+    },
+    createScope: options => {
+      const currentScope = inject(VuetifyLocaleSymbol);
+      if (!currentScope) throw new Error('[Vuetify] Could not find injected locale instance');
+      const newScope = createScope({
+        current: computed(() => {
+          var _options$locale;
+
+          return (_options$locale = options == null ? void 0 : options.locale) != null ? _options$locale : currentScope.current.value;
+        }),
+        fallback: computed(() => {
+          var _options$locale2;
+
+          return (_options$locale2 = options == null ? void 0 : options.locale) != null ? _options$locale2 : currentScope.fallback.value;
+        }),
+        messages: computed(() => {
+          var _options$messages2;
+
+          return (_options$messages2 = options == null ? void 0 : options.messages) != null ? _options$messages2 : currentScope.messages.value;
+        })
+      });
+      provide(VuetifyLocaleSymbol, newScope);
+      return newScope;
+    }
+  };
+}
+
 const allowedTypes = ['success', 'info', 'warning', 'error'];
 const VAlert = defineComponent({
   name: 'VAlert',
@@ -5184,13 +5289,19 @@ const VAlert = defineComponent({
       textColorClasses,
       textColorStyles
     } = useTextColor(toRef(props, 'borderColor'));
+    const {
+      t
+    } = useLocale();
+    const closeProps = computed(() => ({
+      'aria-label': t(props.closeLabel),
 
-    function onCloseClick(e) {
-      isActive.value = false;
-    }
+      onClick(e) {
+        isActive.value = false;
+      }
 
+    }));
     return () => {
-      var _slots$default;
+      var _slots$default, _slots$close, _slots$close2;
 
       const hasPrepend = !!(slots.prepend || icon.value);
       const hasTitle = !!(slots.title || props.title);
@@ -5216,7 +5327,7 @@ const VAlert = defineComponent({
             VIcon: {
               density: props.density,
               icon: icon.value,
-              size: props.prominent ? 44 : 'default'
+              size: props.prominent ? 44 : 28
             }
           }
         }, {
@@ -5235,16 +5346,18 @@ const VAlert = defineComponent({
         }, [slots.append()]), hasClose && createVNode(VDefaultsProvider, {
           "key": "close",
           "defaults": {
-            VIcon: {
+            VBtn: {
               icon: props.closeIcon,
-              size: 'small'
+              size: 'x-small',
+              variant: 'text'
             }
           }
         }, {
           default: () => [createVNode("div", {
-            "class": "v-alert__close",
-            "onClick": onCloseClick
-          }, [slots.close ? slots.close() : createVNode(VIcon, null, null)])]
+            "class": "v-alert__close"
+          }, [(_slots$close = (_slots$close2 = slots.close) == null ? void 0 : _slots$close2.call(slots, {
+            props: closeProps.value
+          })) != null ? _slots$close : createVNode(VBtn, closeProps.value, null)])]
         })]
       });
     };
@@ -5358,20 +5471,34 @@ function createForm(props) {
   }
 
   watch(items, () => {
-    let valid = null;
+    let valid = 0;
+    let invalid = 0;
+    const results = [];
 
-    if (items.value.some(item => item.isValid === false)) {
-      valid = false;
-    } else if (items.value.every(item => item.isValid === true)) {
-      valid = true;
+    for (const item of items.value) {
+      if (item.isValid === false) {
+        invalid++;
+        results.push({
+          id: item.id,
+          errorMessages: item.errorMessages
+        });
+      } else if (item.isValid === true) valid++;
     }
 
-    model.value = valid;
+    errors.value = results;
+    model.value = invalid > 0 ? false : valid === items.value.length ? true : null;
   }, {
     deep: true
   });
   provide(FormKey, {
-    register: (id, validate, reset, resetValidation, isValid) => {
+    register: _ref => {
+      let {
+        id,
+        validate,
+        reset,
+        resetValidation
+      } = _ref;
+
       if (items.value.some(item => item.id === id)) {
         consoleWarn(`Duplicate input name "${id}"`);
       }
@@ -5381,8 +5508,8 @@ function createForm(props) {
         validate,
         reset,
         resetValidation,
-        isValid: isValid // TODO: Better way to type this unwrapping?
-
+        isValid: null,
+        errorMessages: []
       });
     },
     unregister: id => {
@@ -5390,6 +5517,12 @@ function createForm(props) {
         return item.id !== id;
       });
     },
+    update: (id, isValid, errorMessages) => {
+      const found = items.value.find(item => item.id === id);
+      if (!found) return;
+      found.isValid = isValid;
+      found.errorMessages = errorMessages;
+    },
     isDisabled,
     isReadonly,
     isValidating,
@@ -5470,14 +5603,24 @@ function useValidation(props) {
     return (_props$name = props.name) != null ? _props$name : unref(id);
   });
   onBeforeMount(() => {
-    form == null ? void 0 : form.register(uid.value, validate, reset, resetValidation, isValid);
+    form == null ? void 0 : form.register({
+      id: uid.value,
+      validate,
+      reset,
+      resetValidation
+    });
   });
   onBeforeUnmount(() => {
     form == null ? void 0 : form.unregister(uid.value);
-  });
+  }); // Set initial valid state, for inputs that might not have rules
+
+  onMounted(() => form == null ? void 0 : form.update(uid.value, isValid.value, errorMessages.value));
   watch(validationModel, () => {
     if (validationModel.value != null) validate();
   });
+  watch(isValid, () => {
+    form == null ? void 0 : form.update(uid.value, isValid.value, errorMessages.value);
+  });
 
   function reset() {
     resetValidation();
@@ -5846,6 +5989,10 @@ const VSelectionControl = genericComponent()({
       isFocusVisible.value = false;
     }
 
+    function onInput(e) {
+      model.value = e.target.checked;
+    }
+
     useRender(() => {
       var _group$type$value, _slots$default, _group$name$value, _slots$input;
 
@@ -5874,19 +6021,20 @@ const VSelectionControl = genericComponent()({
       }, [icon.value && createVNode(VIcon, {
         "key": "icon",
         "icon": icon.value
-      }, null), withDirectives(createVNode("input", mergeProps({
-        "onUpdate:modelValue": $event => model.value = $event,
+      }, null), createVNode("input", mergeProps({
         "ref": input,
+        "checked": model.value,
         "disabled": props.disabled,
         "id": id.value,
         "onBlur": onBlur,
         "onFocus": onFocus,
+        "onInput": onInput,
         "aria-readonly": props.readonly,
         "type": type,
         "value": trueValue.value,
         "name": (_group$name$value = group == null ? void 0 : group.name.value) != null ? _group$name$value : props.name,
         "aria-checked": type === 'checkbox' ? model.value : undefined
-      }, inputAttrs), null), [[vModelDynamic, model.value]]), (_slots$input = slots.input) == null ? void 0 : _slots$input.call(slots, {
+      }, inputAttrs), null), (_slots$input = slots.input) == null ? void 0 : _slots$input.call(slots, {
         model,
         textColorClasses,
         props: {
@@ -6991,20 +7139,26 @@ const VListItem = genericComponent()({
     Ripple
   },
   props: {
-    active: Boolean,
-    activeColor: String,
+    active: {
+      type: Boolean,
+      default: undefined
+    },
     activeClass: String,
+    activeColor: String,
     appendAvatar: String,
     appendIcon: IconValue,
     disabled: Boolean,
     lines: String,
+    link: {
+      type: Boolean,
+      default: undefined
+    },
     nav: Boolean,
     prependAvatar: String,
     prependIcon: IconValue,
     subtitle: [String, Number, Boolean],
     title: [String, Number, Boolean],
     value: null,
-    link: Boolean,
     ...makeBorderProps(),
     ...makeDensityProps(),
     ...makeDimensionProps(),
@@ -7041,8 +7195,10 @@ const VListItem = genericComponent()({
     const isActive = computed(() => {
       var _link$isExactActive;
 
-      return props.active || ((_link$isExactActive = link.isExactActive) == null ? void 0 : _link$isExactActive.value) || isSelected.value;
+      return props.active !== false && (props.active || ((_link$isExactActive = link.isExactActive) == null ? void 0 : _link$isExactActive.value) || isSelected.value);
     });
+    const isLink = computed(() => props.link !== false && link.isLink.value);
+    const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || props.value != null && !!list));
     const roundedProps = computed(() => props.rounded || props.nav);
     const variantProps = computed(() => {
       var _props$activeColor;
@@ -7096,27 +7252,26 @@ const VListItem = genericComponent()({
     useRender(() => {
       var _slots$prepend, _slots$title, _slots$title2, _slots$subtitle, _slots$subtitle2, _slots$default, _slots$append;
 
-      const Tag = link.isLink.value ? 'a' : props.tag;
+      const Tag = isLink.value ? 'a' : props.tag;
       const hasColor = !list || isSelected.value || isActive.value;
       const hasTitle = slots.title || props.title;
       const hasSubtitle = slots.subtitle || props.subtitle;
       const hasAppend = !!(slots.append || props.appendAvatar || props.appendIcon);
       const hasPrepend = !!(slots.prepend || props.prependAvatar || props.prependIcon);
-      const isClickable = !props.disabled && (props.link || link.isClickable.value || props.value != null && !!list);
       list == null ? void 0 : list.updateHasPrepend(hasPrepend);
       return withDirectives(createVNode(Tag, {
         "class": ['v-list-item', {
           'v-list-item--active': isActive.value,
           'v-list-item--disabled': props.disabled,
-          'v-list-item--link': isClickable,
+          'v-list-item--link': isClickable.value,
           'v-list-item--nav': props.nav,
           'v-list-item--prepend': !hasPrepend && (list == null ? void 0 : list.hasPrepend.value),
           [`${props.activeClass}`]: isActive.value
         }, themeClasses.value, borderClasses.value, hasColor ? colorClasses.value : undefined, densityClasses.value, elevationClasses.value, lineClasses.value, roundedClasses.value, variantClasses.value],
         "style": [hasColor ? colorStyles.value : undefined, dimensionStyles.value],
         "href": link.href.value,
-        "tabindex": isClickable ? 0 : undefined,
-        "onClick": isClickable && (e => {
+        "tabindex": isClickable.value ? 0 : undefined,
+        "onClick": isClickable.value && (e => {
           var _link$navigate;
 
           if (isGroupActivator) return;
@@ -7124,7 +7279,7 @@ const VListItem = genericComponent()({
           props.value != null && select(!isSelected.value, e);
         })
       }, {
-        default: () => [genOverlays(isClickable || isActive.value, 'v-list-item'), hasPrepend && createVNode(VDefaultsProvider, {
+        default: () => [genOverlays(isClickable.value || isActive.value, 'v-list-item'), hasPrepend && createVNode(VDefaultsProvider, {
           "key": "prepend",
           "defaults": {
             VAvatar: {
@@ -7185,7 +7340,7 @@ const VListItem = genericComponent()({
             "key": "append-avatar"
           }, null)])]
         })]
-      }), [[resolveDirective("ripple"), isClickable]]);
+      }), [[resolveDirective("ripple"), isClickable.value]]);
     });
     return {};
   }
@@ -7254,8 +7409,25 @@ const VListChildren = genericComponent()({
           type,
           raw: item
         } = _ref2;
-        if (type === 'divider') return createVNode(VDivider, itemProps, null);
-        if (type === 'subheader') return createVNode(VListSubheader, itemProps, slots);
+
+        if (type === 'divider') {
+          var _slots$divider, _slots$divider2;
+
+          return (_slots$divider = (_slots$divider2 = slots.divider) == null ? void 0 : _slots$divider2.call(slots, {
+            props: itemProps
+          })) != null ? _slots$divider : createVNode(VDivider, itemProps, null);
+        }
+
+        if (type === 'subheader') {
+          var _slots$subheader, _slots$subheader2;
+
+          return (_slots$subheader = (_slots$subheader2 = slots.subheader) == null ? void 0 : _slots$subheader2.call(slots, {
+            props: itemProps
+          })) != null ? _slots$subheader : createVNode(VListSubheader, itemProps, {
+            default: slots.subheader
+          });
+        }
+
         const slotsWithItem = {
           subtitle: slots.subtitle ? slotProps => {
             var _slots$subtitle;
@@ -7745,7 +7917,7 @@ function useActivator(props, _ref) {
     return events;
   });
   watch(isTop, val => {
-    if (val && props.openOnHover && !isHovered) {
+    if (val && (props.openOnHover && !isHovered && (!openOnFocus.value || !isFocused) || openOnFocus.value && !isFocused && (!props.openOnHover || !isHovered))) {
       isActive.value = false;
     }
   });
@@ -8514,33 +8686,43 @@ function useToggleScope(source, cb) {
   });
 }
 
-const stack = reactive([]);
+const StackSymbol = Symbol.for('vuetify:stack');
+const globalStack = reactive([]);
 function useStack(isActive, zIndex) {
   const vm = getCurrentInstance('useStack');
+  const parent = inject(StackSymbol, undefined);
+  const stack = reactive({
+    activeChildren: new Set()
+  });
+  provide(StackSymbol, stack);
 
   const _zIndex = ref(+zIndex.value);
 
   useToggleScope(isActive, () => {
-    var _stack$at;
+    var _globalStack$at;
 
-    const lastZIndex = (_stack$at = stack.at(-1)) == null ? void 0 : _stack$at[1];
+    const lastZIndex = (_globalStack$at = globalStack.at(-1)) == null ? void 0 : _globalStack$at[1];
     _zIndex.value = lastZIndex ? lastZIndex + 10 : +zIndex.value;
-    stack.push([vm.uid, _zIndex.value]);
+    globalStack.push([vm.uid, _zIndex.value]);
+    parent == null ? void 0 : parent.activeChildren.add(vm.uid);
     onScopeDispose(() => {
-      const idx = stack.findIndex(v => v[0] === vm.uid);
-      stack.splice(idx, 1);
+      const idx = globalStack.findIndex(v => v[0] === vm.uid);
+      globalStack.splice(idx, 1);
+      parent == null ? void 0 : parent.activeChildren.delete(vm.uid);
     });
   });
-  const isTop = ref(true);
+  const globalTop = ref(true);
   watchEffect(() => {
-    var _stack$at2;
+    var _globalStack$at2;
 
-    const _isTop = ((_stack$at2 = stack.at(-1)) == null ? void 0 : _stack$at2[0]) === vm.uid;
+    const _isTop = ((_globalStack$at2 = globalStack.at(-1)) == null ? void 0 : _globalStack$at2[0]) === vm.uid;
 
-    setTimeout(() => isTop.value = _isTop);
+    setTimeout(() => globalTop.value = _isTop);
   });
+  const localTop = computed(() => !stack.activeChildren.size);
   return {
-    isTop: readonly(isTop),
+    globalTop: readonly(globalTop),
+    localTop,
     stackStyles: computed(() => ({
       zIndex: _zIndex.value
     }))
@@ -8763,7 +8945,8 @@ const VOverlay = genericComponent()({
       return typeof props.scrim === 'string' ? props.scrim : null;
     }));
     const {
-      isTop,
+      globalTop,
+      localTop,
       stackStyles
     } = useStack(isActive, toRef(props, 'zIndex'));
     const {
@@ -8773,7 +8956,7 @@ const VOverlay = genericComponent()({
       contentEvents
     } = useActivator(props, {
       isActive,
-      isTop
+      isTop: localTop
     });
     const {
       dimensionStyles
@@ -8806,7 +8989,7 @@ const VOverlay = genericComponent()({
     }
 
     function closeConditional() {
-      return isActive.value && isTop.value;
+      return isActive.value && globalTop.value;
     }
 
     IN_BROWSER && watch(isActive, val => {
@@ -8820,7 +9003,7 @@ const VOverlay = genericComponent()({
     });
 
     function onKeydown(e) {
-      if (e.key === 'Escape' && isTop.value) {
+      if (e.key === 'Escape' && globalTop.value) {
         if (!props.persistent) {
           isActive.value = false;
         } else animateClick();
@@ -8830,7 +9013,7 @@ const VOverlay = genericComponent()({
     const router = useRouter();
     useToggleScope(() => props.closeOnBack, () => {
       useBackButton(router, next => {
-        if (isTop.value && isActive.value) {
+        if (globalTop.value && isActive.value) {
           next(false);
           if (!props.persistent) isActive.value = false;else animateClick();
         } else {
@@ -8918,13 +9101,86 @@ const VOverlay = genericComponent()({
       activatorEl,
       animateClick,
       contentEl,
-      isTop,
+      globalTop,
+      localTop,
       updateLocation
     };
   }
 
 });
 
+const Refs = Symbol('Forwarded refs');
+/** Omit properties starting with P */
+
+function forwardRefs(target) {
+  for (var _len = arguments.length, refs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    refs[_key - 1] = arguments[_key];
+  }
+
+  target[Refs] = refs;
+  return new Proxy(target, {
+    get(target, key) {
+      if (Reflect.has(target, key)) {
+        return Reflect.get(target, key);
+      }
+
+      for (const ref of refs) {
+        if (ref.value && Reflect.has(ref.value, key)) {
+          const val = Reflect.get(ref.value, key);
+          return typeof val === 'function' ? val.bind(ref.value) : val;
+        }
+      }
+    },
+
+    getOwnPropertyDescriptor(target, key) {
+      const descriptor = Reflect.getOwnPropertyDescriptor(target, key);
+      if (descriptor) return descriptor; // Skip internal properties
+
+      if (typeof key === 'symbol' || key.startsWith('__')) return; // Check each ref's own properties
+
+      for (const ref of refs) {
+        if (!ref.value) continue;
+        const descriptor = Reflect.getOwnPropertyDescriptor(ref.value, key);
+        if (descriptor) return descriptor;
+
+        if ('_' in ref.value && 'setupState' in ref.value._) {
+          const descriptor = Reflect.getOwnPropertyDescriptor(ref.value._.setupState, key);
+          if (descriptor) return descriptor;
+        }
+      } // Recursive search up each ref's prototype
+
+
+      for (const ref of refs) {
+        let obj = ref.value && Object.getPrototypeOf(ref.value);
+
+        while (obj) {
+          const descriptor = Reflect.getOwnPropertyDescriptor(obj, key);
+          if (descriptor) return descriptor;
+          obj = Object.getPrototypeOf(obj);
+        }
+      } // Call forwarded refs' proxies
+
+
+      for (const ref of refs) {
+        const childRefs = ref.value && ref.value[Refs];
+        if (!childRefs) continue;
+        const queue = childRefs.slice();
+
+        while (queue.length) {
+          const ref = queue.shift();
+          const descriptor = Reflect.getOwnPropertyDescriptor(ref.value, key);
+          if (descriptor) return descriptor;
+          const childRefs = ref.value && ref.value[Refs];
+          if (childRefs) queue.push(...childRefs);
+        }
+      }
+
+      return undefined;
+    }
+
+  });
+}
+
 function useScopeId() {
   const vm = getCurrentInstance('useScopeId');
   const scopeId = vm.vnode.scopeId;
@@ -9017,7 +9273,7 @@ const VMenu = genericComponent()({
       default: slots.default,
       activator: slots.activator
     }));
-    return useForwardRef({
+    return forwardRefs({
       id
     }, overlay);
   }
@@ -9165,7 +9421,7 @@ const VField = genericComponent()({
         const width = Math.abs(targetWidth - rect.width) > 1 ? {
           maxWidth: convertToUnit(targetWidth)
         } : undefined;
-        const duration = parseFloat(getComputedStyle(el).transitionDuration) * 1000;
+        const duration = parseFloat(getComputedStyle(el).transitionDuration) * 1000 || 150;
         const scale = parseFloat(getComputedStyle(targetEl).getPropertyValue('--v-field-label-scale'));
         el.style.visibility = 'visible';
         targetEl.style.visibility = 'hidden';
@@ -9446,10 +9702,6 @@ const VTextField = genericComponent()({
       });
     }
 
-    function onInput(e) {
-      model.value = e.target.value;
-    }
-
     useRender(() => {
       const hasCounter = !!(slots.counter || props.counter || props.counterValue);
       const hasDetails = !!(hasCounter || slots.details);
@@ -9500,24 +9752,16 @@ const VTextField = genericComponent()({
             "error": isValid.value === false
           }), { ...slots,
             default: _ref3 => {
-              var _slots$default;
-
               let {
                 props: {
                   class: fieldClass,
                   ...slotProps
                 }
               } = _ref3;
-              return createVNode(Fragment, null, [props.prefix && createVNode("span", {
-                "class": "v-text-field__prefix"
-              }, [props.prefix]), createVNode("div", {
-                "class": fieldClass,
-                "onClick": e => emit('click:input', e),
-                "data-no-activator": ""
-              }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), withDirectives(createVNode("input", mergeProps({
+
+              const inputNode = withDirectives(createVNode("input", mergeProps({
                 "ref": inputRef,
-                "value": model.value,
-                "onInput": onInput,
+                "onUpdate:modelValue": $event => model.value = $event,
                 "autofocus": props.autofocus,
                 "readonly": isReadonly.value,
                 "disabled": isDisabled.value,
@@ -9527,11 +9771,21 @@ const VTextField = genericComponent()({
                 "type": props.type,
                 "onFocus": onFocus,
                 "onBlur": () => isFocused.value = false
-              }, slotProps, inputAttrs), null), [[resolveDirective("intersect"), {
+              }, slotProps, inputAttrs), null), [[vModelDynamic, model.value], [resolveDirective("intersect"), {
                 handler: onIntersect
               }, null, {
                 once: true
-              }]])]), props.suffix && createVNode("span", {
+              }]]);
+
+              return createVNode(Fragment, null, [props.prefix && createVNode("span", {
+                "class": "v-text-field__prefix"
+              }, [props.prefix]), slots.default ? createVNode("div", {
+                "class": fieldClass,
+                "onClick": e => emit('click:input', e),
+                "data-no-activator": ""
+              }, [slots.default(), inputNode]) : cloneVNode(inputNode, {
+                class: fieldClass
+              }), props.suffix && createVNode("span", {
                 "class": "v-text-field__suffix"
               }, [props.suffix])]);
             }
@@ -9548,146 +9802,11 @@ const VTextField = genericComponent()({
         } : undefined
       });
     });
-    return useForwardRef({}, vInputRef, vFieldRef, inputRef);
+    return forwardRefs({}, vInputRef, vFieldRef, inputRef);
   }
 
 });
 
-// Locales
-
-const LocaleAdapterSymbol = Symbol.for('vuetify:locale-adapter');
-const VuetifyLocaleSymbol = Symbol.for('vuetify:locale');
-function provideLocale(props) {
-  const adapter = inject(LocaleAdapterSymbol);
-  if (!adapter) throw new Error('[Vuetify] Could not find injected locale adapter');
-  return adapter.createScope(props);
-}
-function useLocale() {
-  const adapter = inject(LocaleAdapterSymbol);
-  if (!adapter) throw new Error('[Vuetify] Could not find injected locale adapter');
-  return adapter.getScope();
-}
-
-function isLocaleAdapter(x) {
-  return !!x && x.hasOwnProperty('getScope') && x.hasOwnProperty('createScope') && x.hasOwnProperty('createRoot');
-}
-
-function createLocale(app, options) {
-  const adapter = isLocaleAdapter(options) ? options : createDefaultLocaleAdapter(options);
-  const instance = adapter.createRoot(app);
-  app == null ? void 0 : app.provide(RtlSymbol, createRtl(instance, options));
-  return adapter;
-}
-const LANG_PREFIX = '$vuetify.';
-
-const replace = (str, params) => {
-  return str.replace(/\{(\d+)\}/g, (match, index) => {
-    /* istanbul ignore next */
-    return String(params[+index]);
-  });
-};
-
-const createTranslateFunction = (current, fallback, messages) => {
-  return function (key) {
-    for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-      params[_key - 1] = arguments[_key];
-    }
-
-    if (!key.startsWith(LANG_PREFIX)) {
-      return replace(key, params);
-    }
-
-    const shortKey = key.replace(LANG_PREFIX, '');
-    const currentLocale = current.value && messages.value[current.value];
-    const fallbackLocale = fallback.value && messages.value[fallback.value];
-    let str = getObjectValueByPath(currentLocale, shortKey, null);
-
-    if (!str) {
-      consoleWarn(`Translation key "${key}" not found in "${current.value}", trying fallback locale`);
-      str = getObjectValueByPath(fallbackLocale, shortKey, null);
-    }
-
-    if (!str) {
-      consoleError(`Translation key "${key}" not found in fallback`);
-      str = key;
-    }
-
-    if (typeof str !== 'string') {
-      consoleError(`Translation key "${key}" has a non-string value`);
-      str = key;
-    }
-
-    return replace(str, params);
-  };
-};
-
-function createNumberFunction(current, fallback) {
-  return (value, options) => {
-    const numberFormat = new Intl.NumberFormat([current.value, fallback.value], options);
-    return numberFormat.format(value);
-  };
-}
-
-function createDefaultLocaleAdapter(options) {
-  const createScope = options => {
-    const current = ref(options.current);
-    const fallback = ref(options.fallback);
-    const messages = ref(options.messages);
-    return {
-      current,
-      fallback,
-      messages,
-      t: createTranslateFunction(current, fallback, messages),
-      n: createNumberFunction(current, fallback)
-    };
-  };
-
-  return {
-    createRoot: app => {
-      var _options$defaultLocal, _options$fallbackLoca, _options$messages;
-
-      const rootScope = createScope({
-        current: (_options$defaultLocal = options == null ? void 0 : options.defaultLocale) != null ? _options$defaultLocal : 'en',
-        fallback: (_options$fallbackLoca = options == null ? void 0 : options.fallbackLocale) != null ? _options$fallbackLoca : 'en',
-        messages: (_options$messages = options == null ? void 0 : options.messages) != null ? _options$messages : {
-          en
-        }
-      });
-      if (!app) throw new Error('[Vuetify] Could not find default app instance');
-      app.provide(VuetifyLocaleSymbol, rootScope);
-      return rootScope;
-    },
-    getScope: () => {
-      const currentScope = inject(VuetifyLocaleSymbol);
-      if (!currentScope) throw new Error('[Vuetify] Could not find injected locale instance');
-      return currentScope;
-    },
-    createScope: options => {
-      const currentScope = inject(VuetifyLocaleSymbol);
-      if (!currentScope) throw new Error('[Vuetify] Could not find injected locale instance');
-      const newScope = createScope({
-        current: computed(() => {
-          var _options$locale;
-
-          return (_options$locale = options == null ? void 0 : options.locale) != null ? _options$locale : currentScope.current.value;
-        }),
-        fallback: computed(() => {
-          var _options$locale2;
-
-          return (_options$locale2 = options == null ? void 0 : options.locale) != null ? _options$locale2 : currentScope.fallback.value;
-        }),
-        messages: computed(() => {
-          var _options$messages2;
-
-          return (_options$messages2 = options == null ? void 0 : options.messages) != null ? _options$messages2 : currentScope.messages.value;
-        })
-      });
-      provide(VuetifyLocaleSymbol, newScope);
-      return newScope;
-    }
-  };
-}
-
 const makeSelectProps = propsFactory({
   chips: Boolean,
   closableChips: Boolean,
@@ -9767,7 +9886,7 @@ const VSelect = genericComponent()({
 
     function onClickControl() {
       if (props.hideNoData && !items.value.length) return;
-      menu.value = true;
+      menu.value = !menu.value;
     }
 
     function onKeydown(e) {
@@ -9814,7 +9933,6 @@ const VSelect = genericComponent()({
         "appendInnerIcon": props.menuIcon,
         "readonly": true,
         "onClick:clear": onClear,
-        "onClick:input": onClickControl,
         "onClick:control": onClickControl,
         "onBlur": () => menu.value = false,
         "onKeydown": onKeydown
@@ -9905,7 +10023,7 @@ const VSelect = genericComponent()({
         }
       });
     });
-    return useForwardRef({
+    return forwardRefs({
       menu,
       select
     }, vTextFieldRef);
@@ -10041,7 +10159,6 @@ const VAutocomplete = genericComponent()({
     })
   },
   emits: {
-    'click:clear': e => true,
     'update:search': val => true,
     'update:modelValue': val => true,
     'update:menu': val => true
@@ -10278,7 +10395,7 @@ const VAutocomplete = genericComponent()({
         }
       });
     });
-    return useForwardRef({
+    return forwardRefs({
       isFocused,
       isPristine,
       menu,
@@ -11028,7 +11145,10 @@ const VCard = defineComponent({
     flat: Boolean,
     hover: Boolean,
     image: String,
-    link: Boolean,
+    link: {
+      type: Boolean,
+      default: undefined
+    },
     prependAvatar: String,
     prependIcon: IconValue,
     ripple: Boolean,
@@ -11089,10 +11209,12 @@ const VCard = defineComponent({
       roundedClasses
     } = useRounded(props);
     const link = useLink(props, attrs);
+    const isLink = computed(() => props.link !== false && link.isLink.value);
+    const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value));
     useRender(() => {
       var _slots$image, _slots$image2, _slots$text, _slots$text2, _slots$default;
 
-      const Tag = link.isLink.value ? 'a' : props.tag;
+      const Tag = isLink.value ? 'a' : props.tag;
       const hasTitle = !!(slots.title || props.title);
       const hasSubtitle = !!(slots.subtitle || props.subtitle);
       const hasHeader = hasTitle || hasSubtitle;
@@ -11101,17 +11223,16 @@ const VCard = defineComponent({
       const hasImage = !!(slots.image || props.image);
       const hasCardItem = hasHeader || hasPrepend || hasAppend;
       const hasText = !!(slots.text || props.text);
-      const isClickable = !props.disabled && (link.isClickable.value || props.link);
       return withDirectives(createVNode(Tag, {
         "class": ['v-card', {
           'v-card--disabled': props.disabled,
           'v-card--flat': props.flat,
           'v-card--hover': props.hover && !(props.disabled || props.flat),
-          'v-card--link': isClickable
+          'v-card--link': isClickable.value
         }, themeClasses.value, borderClasses.value, colorClasses.value, densityClasses.value, elevationClasses.value, loaderClasses.value, positionClasses.value, roundedClasses.value, variantClasses.value],
         "style": [colorStyles.value, dimensionStyles.value, locationStyles.value],
         "href": link.href.value,
-        "onClick": isClickable && link.navigate
+        "onClick": isClickable.value && link.navigate
       }, {
         default: () => [hasImage && createVNode(VDefaultsProvider, {
           "key": "image",
@@ -11151,8 +11272,8 @@ const VCard = defineComponent({
           default: () => [(_slots$text = (_slots$text2 = slots.text) == null ? void 0 : _slots$text2.call(slots)) != null ? _slots$text : props.text]
         }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), slots.actions && createVNode(VCardActions, null, {
           default: slots.actions
-        }), genOverlays(isClickable, 'v-card')]
-      }), [[resolveDirective("ripple"), isClickable]]);
+        }), genOverlays(isClickable.value, 'v-card')]
+      }), [[resolveDirective("ripple"), isClickable.value]]);
     });
     return {};
   }
@@ -13240,7 +13361,7 @@ const grey = Object.freeze({
 const shades = Object.freeze({
   black: '#000000',
   white: '#ffffff',
-  transparent: 'transparent'
+  transparent: '#ffffff00'
 });
 var colors = Object.freeze({
   red,
@@ -13849,7 +13970,7 @@ const VCombobox = genericComponent()({
         }
       });
     });
-    return useForwardRef({
+    return forwardRefs({
       isFocused,
       isPristine,
       menu,
@@ -13911,7 +14032,7 @@ const VDialog = genericComponent()({
       const after = e.target;
 
       if (before !== after && (_overlay$value = overlay.value) != null && _overlay$value.contentEl && // We're the topmost dialog
-      (_overlay$value2 = overlay.value) != null && _overlay$value2.isTop && // It isn't the document or the dialog body
+      (_overlay$value2 = overlay.value) != null && _overlay$value2.globalTop && // It isn't the document or the dialog body
       ![document, overlay.value.contentEl].includes(after) && // It isn't inside the dialog body
       !overlay.value.contentEl.contains(after)) {
         const focusable = [...overlay.value.contentEl.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')].filter(el => !el.hasAttribute('disabled'));
@@ -13973,7 +14094,7 @@ const VDialog = genericComponent()({
       default: slots.default,
       activator: slots.activator
     }));
-    return useForwardRef({}, overlay);
+    return forwardRefs({}, overlay);
   }
 
 });
@@ -14425,7 +14546,7 @@ const VFileInput = defineComponent({
         } : undefined
       });
     });
-    return useForwardRef({}, vInputRef, vFieldRef, inputRef);
+    return forwardRefs({}, vInputRef, vFieldRef, inputRef);
   }
 
 });
@@ -14556,7 +14677,7 @@ const VForm = defineComponent({
         "onSubmit": onSubmit
       }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots, form)]);
     });
-    return useForwardRef(form, formRef);
+    return forwardRefs(form, formRef);
   }
 
 });
@@ -14654,6 +14775,7 @@ function breakpointClass$1(type, prop, val) {
   return className.toLowerCase();
 }
 
+const ALIGN_SELF_VALUES = ['auto', 'start', 'end', 'center', 'baseline', 'stretch'];
 const VCol = defineComponent({
   name: 'VCol',
   props: {
@@ -14675,7 +14797,7 @@ const VCol = defineComponent({
     alignSelf: {
       type: String,
       default: null,
-      validator: str => ['auto', 'start', 'end', 'center', 'baseline', 'stretch'].includes(str)
+      validator: str => ALIGN_SELF_VALUES.includes(str)
     },
     ...makeTagProps()
   },
@@ -14724,6 +14846,7 @@ const VCol = defineComponent({
 const breakpoints = ['sm', 'md', 'lg', 'xl', 'xxl']; // no xs
 
 const ALIGNMENT = ['start', 'end', 'center'];
+const SPACE = ['space-between', 'space-around', 'space-evenly'];
 
 function makeRowProps(prefix, def) {
   return breakpoints.reduce((props, val) => {
@@ -14732,23 +14855,27 @@ function makeRowProps(prefix, def) {
   }, {});
 }
 
-const alignValidator = str => [...ALIGNMENT, 'baseline', 'stretch'].includes(str);
+const ALIGN_VALUES = [...ALIGNMENT, 'baseline', 'stretch'];
+
+const alignValidator = str => ALIGN_VALUES.includes(str);
 
 const alignProps = makeRowProps('align', () => ({
   type: String,
   default: null,
   validator: alignValidator
 }));
+const JUSTIFY_VALUES = [...ALIGNMENT, ...SPACE];
 
-const justifyValidator = str => [...ALIGNMENT, 'space-between', 'space-around'].includes(str);
+const justifyValidator = str => JUSTIFY_VALUES.includes(str);
 
 const justifyProps = makeRowProps('justify', () => ({
   type: String,
   default: null,
   validator: justifyValidator
 }));
+const ALIGN_CONTENT_VALUES = [...ALIGNMENT, ...SPACE, 'stretch'];
 
-const alignContentValidator = str => [...ALIGNMENT, 'space-between', 'space-around', 'stretch'].includes(str);
+const alignContentValidator = str => ALIGN_CONTENT_VALUES.includes(str);
 
 const alignContentProps = makeRowProps('alignContent', () => ({
   type: String,
@@ -15141,9 +15268,12 @@ const VLocaleProvider = defineComponent({
 
 const VMain = defineComponent({
   name: 'VMain',
-  props: makeTagProps({
-    tag: 'main'
-  }),
+  props: {
+    scrollable: Boolean,
+    ...makeTagProps({
+      tag: 'main'
+    })
+  },
 
   setup(props, _ref) {
     let {
@@ -15156,15 +15286,17 @@ const VMain = defineComponent({
       ssrBootStyles
     } = useSsrBoot();
     useRender(() => {
-      var _slots$default;
+      var _slots$default, _slots$default2;
 
       return createVNode(props.tag, {
-        "class": "v-main",
+        "class": ['v-main', {
+          'v-main--scrollable': props.scrollable
+        }],
         "style": [mainStyles.value, ssrBootStyles.value]
       }, {
-        default: () => [createVNode("div", {
-          "class": "v-main__wrap"
-        }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)])]
+        default: () => [props.scrollable ? createVNode("div", {
+          "class": "v-main__scroller"
+        }, [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]) : (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)]
       });
     });
     return {};
@@ -15172,6 +15304,76 @@ const VMain = defineComponent({
 
 });
 
+function useSticky(_ref) {
+  let {
+    rootEl,
+    isSticky,
+    layoutItemStyles
+  } = _ref;
+  const isStuck = ref(false);
+  const stuckPosition = ref(0);
+  const stickyStyles = computed(() => {
+    const side = typeof isStuck.value === 'boolean' ? 'top' : isStuck.value;
+    return [isSticky.value ? {
+      top: 'auto',
+      bottom: 'auto',
+      height: undefined
+    } : undefined, isStuck.value ? {
+      [side]: convertToUnit(stuckPosition.value)
+    } : {
+      top: layoutItemStyles.value.top
+    }];
+  });
+  onMounted(() => {
+    watch(isSticky, val => {
+      if (val) {
+        window.addEventListener('scroll', onScroll, {
+          passive: true
+        });
+      } else {
+        window.removeEventListener('scroll', onScroll);
+      }
+    }, {
+      immediate: true
+    });
+  });
+  onBeforeUnmount(() => {
+    document.removeEventListener('scroll', onScroll);
+  });
+  let lastScrollTop = 0;
+
+  function onScroll() {
+    var _layoutItemStyles$val;
+
+    const direction = lastScrollTop > window.scrollY ? 'up' : 'down';
+    const rect = rootEl.value.getBoundingClientRect();
+    const layoutTop = parseFloat((_layoutItemStyles$val = layoutItemStyles.value.top) != null ? _layoutItemStyles$val : 0);
+    const top = window.scrollY - Math.max(0, stuckPosition.value - layoutTop);
+    const bottom = rect.height + Math.max(stuckPosition.value, layoutTop) - window.scrollY - window.innerHeight;
+
+    if (rect.height < window.innerHeight - layoutTop) {
+      isStuck.value = 'top';
+      stuckPosition.value = layoutTop;
+    } else if (direction === 'up' && isStuck.value === 'bottom' || direction === 'down' && isStuck.value === 'top') {
+      stuckPosition.value = window.scrollY + rect.top;
+      isStuck.value = true;
+    } else if (direction === 'down' && bottom <= 0) {
+      stuckPosition.value = 0;
+      isStuck.value = 'bottom';
+    } else if (direction === 'up' && top <= 0) {
+      stuckPosition.value = rect.top + top;
+      isStuck.value = 'top';
+    }
+
+    lastScrollTop = window.scrollY;
+  }
+
+  return {
+    isStuck,
+    stickyStyles
+  };
+}
+
 const HORIZON = 100; // ms
 
 const HISTORY = 20; // number of samples to keep
@@ -15439,6 +15641,7 @@ function oops() {
   throw new Error();
 }
 
+const locations = ['start', 'end', 'left', 'right', 'bottom'];
 const VNavigationDrawer = defineComponent({
   name: 'VNavigationDrawer',
   props: {
@@ -15455,7 +15658,11 @@ const VNavigationDrawer = defineComponent({
     rail: Boolean,
     railWidth: {
       type: [Number, String],
-      default: 72
+      default: 56
+    },
+    scrim: {
+      type: [String, Boolean],
+      default: true
     },
     image: String,
     temporary: Boolean,
@@ -15466,9 +15673,10 @@ const VNavigationDrawer = defineComponent({
     },
     location: {
       type: String,
-      default: 'left',
-      validator: value => ['left', 'right', 'bottom'].includes(value)
+      default: 'start',
+      validator: value => locations.includes(value)
     },
+    sticky: Boolean,
     ...makeBorderProps(),
     ...makeElevationProps(),
     ...makeLayoutItemProps(),
@@ -15487,6 +15695,9 @@ const VNavigationDrawer = defineComponent({
       attrs,
       slots
     } = _ref;
+    const {
+      isRtl
+    } = useRtl();
     const {
       themeClasses
     } = provideTheme(props);
@@ -15508,14 +15719,19 @@ const VNavigationDrawer = defineComponent({
     } = useRounded(props);
     const router = useRouter();
     const isActive = useProxiedModel(props, 'modelValue', null, v => !!v);
-    const isHovering = ref(false);
     const {
       ssrBootStyles
     } = useSsrBoot();
+    const rootEl = ref();
+    const isHovering = ref(false);
     const width = computed(() => {
       return props.rail && props.expandOnHover && isHovering.value ? Number(props.width) : Number(props.rail ? props.railWidth : props.width);
     });
+    const location = computed(() => {
+      return toPhysical(props.location, isRtl.value);
+    });
     const isTemporary = computed(() => !props.permanent && (mobile.value || props.temporary));
+    const isSticky = computed(() => props.sticky && !isTemporary.value && location.value !== 'bottom');
 
     if (!props.disableResizeWatcher) {
       watch(isTemporary, val => !props.permanent && (isActive.value = !val));
@@ -15532,7 +15748,6 @@ const VNavigationDrawer = defineComponent({
       if (props.modelValue != null || isTemporary.value) return;
       isActive.value = props.permanent || !mobile.value;
     });
-    const rootEl = ref();
     const {
       isDragging,
       dragProgress,
@@ -15542,7 +15757,7 @@ const VNavigationDrawer = defineComponent({
       isTemporary,
       width,
       touchless: toRef(props, 'touchless'),
-      position: toRef(props, 'location')
+      position: location
     });
     const layoutSize = computed(() => {
       const size = isTemporary.value ? 0 : props.rail && props.expandOnHover ? Number(props.railWidth) : width.value;
@@ -15555,13 +15770,25 @@ const VNavigationDrawer = defineComponent({
     } = useLayoutItem({
       id: props.name,
       order: computed(() => parseInt(props.order, 10)),
-      position: toRef(props, 'location'),
+      position: location,
       layoutSize,
       elementSize: width,
       active: computed(() => isActive.value || isDragging.value),
       disableTransitions: computed(() => isDragging.value),
-      absolute: toRef(props, 'absolute')
+      absolute: computed(() => // eslint-disable-next-line @typescript-eslint/no-use-before-define
+      props.absolute || isSticky.value && typeof isStuck.value !== 'string')
+    });
+    const {
+      isStuck,
+      stickyStyles
+    } = useSticky({
+      rootEl,
+      isSticky,
+      layoutItemStyles
     });
+    const scrimColor = useBackgroundColor(computed(() => {
+      return typeof props.scrim === 'string' ? props.scrim : null;
+    }));
     const scrimStyles = computed(() => ({ ...(isDragging.value ? {
         opacity: dragProgress.value * 0.2,
         transition: 'none'
@@ -15574,6 +15801,11 @@ const VNavigationDrawer = defineComponent({
       } : undefined),
       ...layoutItemScrimStyles.value
     }));
+    provideDefaults({
+      VList: {
+        bgColor: 'transparent'
+      }
+    });
     useRender(() => {
       var _slots$image, _slots$prepend, _slots$default, _slots$append;
 
@@ -15582,18 +15814,16 @@ const VNavigationDrawer = defineComponent({
         "ref": rootEl,
         "onMouseenter": () => isHovering.value = true,
         "onMouseleave": () => isHovering.value = false,
-        "class": ['v-navigation-drawer', {
-          'v-navigation-drawer--bottom': props.location === 'bottom',
-          'v-navigation-drawer--end': props.location === 'right',
+        "class": ['v-navigation-drawer', `v-navigation-drawer--${location.value}`, {
           'v-navigation-drawer--expand-on-hover': props.expandOnHover,
           'v-navigation-drawer--floating': props.floating,
           'v-navigation-drawer--is-hovering': isHovering.value,
           'v-navigation-drawer--rail': props.rail,
-          'v-navigation-drawer--start': props.location === 'left',
           'v-navigation-drawer--temporary': isTemporary.value,
-          'v-navigation-drawer--active': isActive.value
+          'v-navigation-drawer--active': isActive.value,
+          'v-navigation-drawer--sticky': isSticky.value
         }, themeClasses.value, backgroundColorClasses.value, borderClasses.value, elevationClasses.value, roundedClasses.value],
-        "style": [backgroundColorStyles.value, layoutItemStyles.value, dragStyles.value, ssrBootStyles.value]
+        "style": [backgroundColorStyles.value, layoutItemStyles.value, dragStyles.value, ssrBootStyles.value, stickyStyles.value]
       }, attrs), {
         default: () => [hasImage && createVNode("div", {
           "key": "image",
@@ -15613,14 +15843,16 @@ const VNavigationDrawer = defineComponent({
       }), createVNode(Transition, {
         "name": "fade-transition"
       }, {
-        default: () => [isTemporary.value && (isDragging.value || isActive.value) && createVNode("div", {
-          "class": "v-navigation-drawer__scrim",
-          "style": scrimStyles.value,
+        default: () => [isTemporary.value && (isDragging.value || isActive.value) && !!props.scrim && createVNode("div", {
+          "class": ['v-navigation-drawer__scrim', scrimColor.backgroundColorClasses.value],
+          "style": [scrimStyles.value, scrimColor.backgroundColorStyles.value],
           "onClick": () => isActive.value = false
         }, null)]
       })]);
     });
-    return {};
+    return {
+      isStuck
+    };
   }
 
 });
@@ -15801,7 +16033,7 @@ const VPagination = defineComponent({
       return length.value;
     });
     const range = computed(() => {
-      if (length.value <= 0) return [];
+      if (length.value <= 0 || isNaN(length.value) || length.value > Number.MAX_SAFE_INTEGER) return [];
       if (totalVisible.value <= 2) return [page.value];
 
       if (length.value <= totalVisible.value) {
@@ -16065,27 +16297,20 @@ const VParallax = defineComponent({
 
 const VRadio = defineComponent({
   name: 'VRadio',
-  props: {
-    falseIcon: {
-      type: IconValue,
-      default: '$radioOff'
-    },
-    trueIcon: {
-      type: IconValue,
-      default: '$radioOn'
-    }
+  props: { ...makeSelectionControlProps({
+      falseIcon: '$radioOff',
+      trueIcon: '$radioOn'
+    })
   },
 
   setup(props, _ref) {
     let {
       slots
     } = _ref;
-    useRender(() => createVNode(VSelectionControl, {
+    useRender(() => createVNode(VSelectionControl, mergeProps(props, {
       "class": "v-radio",
-      "trueIcon": props.trueIcon,
-      "falseIcon": props.falseIcon,
       "type": "radio"
-    }, slots));
+    }), slots));
     return {};
   }
 
@@ -16114,6 +16339,9 @@ const VRadioGroup = defineComponent({
       default: 'radio'
     }
   },
+  emits: {
+    'update:modelValue': val => true
+  },
 
   setup(props, _ref) {
     let {
@@ -16122,6 +16350,13 @@ const VRadioGroup = defineComponent({
     } = _ref;
     const uid = getUid();
     const id = computed(() => props.id || `radio-group-${uid}`);
+    const model = useProxiedModel(props, 'modelValue');
+    provideDefaults({
+      VRadio: {
+        color: toRef(props, 'color'),
+        density: toRef(props, 'density')
+      }
+    });
     useRender(() => {
       const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = filterInputProps(props);
@@ -16135,6 +16370,8 @@ const VRadioGroup = defineComponent({
       return createVNode(VInput, mergeProps({
         "class": "v-radio-group"
       }, inputAttrs, inputProps, {
+        "modelValue": model.value,
+        "onUpdate:modelValue": $event => model.value = $event,
         "id": id.value
       }), { ...slots,
         default: _ref2 => {
@@ -16154,7 +16391,10 @@ const VRadioGroup = defineComponent({
             "type": props.type,
             "disabled": isDisabled.value,
             "readonly": isReadonly.value
-          }, controlAttrs), slots)]);
+          }, controlAttrs, {
+            "modelValue": model.value,
+            "onUpdate:modelValue": $event => model.value = $event
+          }), slots)]);
         }
       });
     });
@@ -17031,7 +17271,6 @@ const VSlideGroupItem = defineComponent({
 const VSnackbar = defineComponent({
   name: 'VSnackbar',
   props: {
-    app: Boolean,
     contentClass: {
       type: String,
       default: ''
@@ -17113,6 +17352,7 @@ const VSnackbar = defineComponent({
       "contentProps": {
         style: locationStyles.value
       },
+      "contentClass": props.contentClass,
       "persistent": true,
       "noClickAnimation": true,
       "scrim": false,
@@ -17124,7 +17364,7 @@ const VSnackbar = defineComponent({
         "onPointerenter": onPointerenter,
         "onPointerleave": startTimeout
       }, [genOverlays(false, 'v-snackbar'), slots.default && createVNode("div", {
-        "class": ['v-snackbar__content', props.contentClass],
+        "class": "v-snackbar__content",
         "role": "status",
         "aria-live": "polite"
       }, [slots.default()]), slots.actions && createVNode(VDefaultsProvider, {
@@ -17141,7 +17381,7 @@ const VSnackbar = defineComponent({
       })])],
       activator: slots.activator
     }));
-    return useForwardRef({}, overlay);
+    return forwardRefs({}, overlay);
   }
 
 });
@@ -17627,7 +17867,7 @@ const VTextarea = defineComponent({
     const vInputRef = ref();
     const vFieldRef = ref();
     const isFocused = ref(false);
-    const controlHeight = ref('auto');
+    const controlHeight = ref('');
     const textareaRef = ref();
     const isActive = computed(() => isFocused.value || props.persistentPlaceholder);
     const messages = computed(() => {
@@ -17667,14 +17907,15 @@ const VTextarea = defineComponent({
     function calculateInputHeight() {
       if (!props.autoGrow) return;
       nextTick(() => {
-        if (!sizerRef.value) return;
+        if (!sizerRef.value || !vFieldRef.value) return;
         const style = getComputedStyle(sizerRef.value);
-        const padding = parseFloat(style.getPropertyValue('--v-field-padding-top')) + parseFloat(style.getPropertyValue('--v-field-padding-bottom'));
+        const fieldStyle = getComputedStyle(vFieldRef.value.$el);
+        const padding = parseFloat(style.getPropertyValue('--v-field-padding-top')) + parseFloat(style.getPropertyValue('--v-input-padding-top')) + parseFloat(style.getPropertyValue('--v-field-padding-bottom'));
         const height = sizerRef.value.scrollHeight;
         const lineHeight = parseFloat(style.lineHeight);
-        const minHeight = parseFloat(props.rows) * lineHeight + padding;
+        const minHeight = Math.max(parseFloat(props.rows) * lineHeight + padding, parseFloat(fieldStyle.getPropertyValue('--v-input-control-height')));
         const maxHeight = parseFloat(props.maxRows) * lineHeight + padding || Infinity;
-        controlHeight.value = convertToUnit(Math.min(maxHeight, Math.max(minHeight, height != null ? height : 0)));
+        controlHeight.value = convertToUnit(clamp(height != null ? height : 0, minHeight, maxHeight));
       });
     }
 
@@ -17682,6 +17923,7 @@ const VTextarea = defineComponent({
     watch(model, calculateInputHeight);
     watch(() => props.rows, calculateInputHeight);
     watch(() => props.maxRows, calculateInputHeight);
+    watch(() => props.density, calculateInputHeight);
     let observer;
     watch(sizerRef, val => {
       if (val) {
@@ -17708,11 +17950,14 @@ const VTextarea = defineComponent({
       }] = filterInputProps(props);
       const [fieldProps] = filterFieldProps(props);
       return createVNode(VInput, mergeProps({
+        "ref": vInputRef,
         "modelValue": model.value,
         "onUpdate:modelValue": $event => model.value = $event,
-        "class": ['v-textarea', {
+        "class": ['v-textarea v-text-field', {
           'v-textarea--prefixed': props.prefix,
           'v-textarea--suffixed': props.suffix,
+          'v-text-field--prefixed': props.prefix,
+          'v-text-field--suffixed': props.suffix,
           'v-textarea--auto-grow': props.autoGrow,
           'v-textarea--no-resize': props.noResize || props.autoGrow
         }]
@@ -17727,8 +17972,9 @@ const VTextarea = defineComponent({
             isValid
           } = _ref2;
           return createVNode(VField, mergeProps({
+            "ref": vFieldRef,
             "style": {
-              '--v-input-control-height': controlHeight.value
+              '--v-textarea-control-height': controlHeight.value
             },
             "onClick:control": onControlClick,
             "onClick:clear": onClear,
@@ -17788,7 +18034,7 @@ const VTextarea = defineComponent({
         } : undefined
       });
     });
-    return useForwardRef({}, vInputRef, vFieldRef, textareaRef);
+    return forwardRefs({}, vInputRef, vFieldRef, textareaRef);
   }
 
 });
@@ -17872,7 +18118,8 @@ const VTimeline = defineComponent({
         lineColor: toRef(props, 'lineColor')
       },
       VTimelineItem: {
-        density: toRef(props, 'density')
+        density: toRef(props, 'density'),
+        lineInset: toRef(props, 'lineInset')
       }
     });
     const sideClasses = computed(() => {
@@ -17897,12 +18144,11 @@ const VTimeline = defineComponent({
       }
     });
     useRender(() => createVNode(props.tag, {
-      "class": ['v-timeline', `v-timeline--${props.direction}`, `v-timeline--align-${props.align}`, !props.lineInset && truncateClasses.value, {
+      "class": ['v-timeline', `v-timeline--${props.direction}`, `v-timeline--align-${props.align}`, truncateClasses.value, {
         'v-timeline--inset-line': !!props.lineInset
       }, themeClasses.value, densityClasses.value, sideClasses.value],
       "style": {
-        '--v-timeline-line-thickness': convertToUnit(props.lineThickness),
-        '--v-timeline-line-inset': convertToUnit(props.lineInset)
+        '--v-timeline-line-thickness': convertToUnit(props.lineThickness)
       }
     }, slots));
     return {};
@@ -17960,7 +18206,10 @@ const VTimelineDivider = defineComponent({
         "class": ['v-timeline-divider', {
           'v-timeline-divider--fill-dot': props.fillDot
         }]
-      }, [!props.hideDot && createVNode("div", {
+      }, [createVNode("div", {
+        "class": ['v-timeline-divider__before', lineColorClasses.value],
+        "style": lineColorStyles.value
+      }, null), !props.hideDot && createVNode("div", {
         "key": "dot",
         "class": ['v-timeline-divider__dot', elevationClasses.value, roundedClasses.value, sizeClasses.value],
         "style": sizeStyles.value
@@ -17968,7 +18217,7 @@ const VTimelineDivider = defineComponent({
         "class": ['v-timeline-divider__inner-dot', backgroundColorClasses.value, roundedClasses.value],
         "style": backgroundColorStyles.value
       }, [(_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots)) != null ? _slots$default : props.icon ? createVNode(VIcon, null, null) : undefined])]), createVNode("div", {
-        "class": ['v-timeline-divider__line', lineColorClasses.value],
+        "class": ['v-timeline-divider__after', lineColorClasses.value],
         "style": lineColorStyles.value
       }, null)]);
     });
@@ -17990,6 +18239,7 @@ const VTimelineItem = defineComponent({
     },
     icon: IconValue,
     iconColor: String,
+    lineInset: [Number, String],
     ...makeRoundedProps(),
     ...makeElevationProps(),
     ...makeSizeProps(),
@@ -18022,7 +18272,8 @@ const VTimelineItem = defineComponent({
           'v-timeline-item--fill-dot': props.fillDot
         }],
         "style": {
-          '--v-timeline-dot-size': convertToUnit(dotSize.value)
+          '--v-timeline-dot-size': convertToUnit(dotSize.value),
+          '--v-timeline-line-inset': props.lineInset ? `calc(var(--v-timeline-dot-size) / 2 + ${convertToUnit(props.lineInset)})` : convertToUnit(0)
         }
       }, [createVNode("div", {
         "class": "v-timeline-item__body",
@@ -18129,7 +18380,7 @@ const VTooltip = genericComponent()({
         return (_slots$default = (_slots$default2 = slots.default) == null ? void 0 : _slots$default2.call(slots, ...args)) != null ? _slots$default : props.text;
       }
     }));
-    return useForwardRef({}, overlay);
+    return forwardRefs({}, overlay);
   }
 
 });
@@ -18535,7 +18786,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.0.0-beta.6";
+const version = "3.0.0-beta.9";
 
-export { components, createVuetify, directives, provideRtl, useDisplay, useLayout, useRtl, useTheme, version };
+export { components, createVuetify, directives, provideRtl, useDisplay, useLayout, useLocale, useRtl, useTheme, version };
 //# sourceMappingURL=vuetify.esm.js.map