vuetify 3.1.10 → 3.1.12

package/dist/vuetify-labs.esm.js

@@ -1,15 +1,15 @@
 /*!
-* Vuetify v3.1.10
+* Vuetify v3.1.12
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { ref, onBeforeUnmount, watch, readonly, reactive, computed, watchEffect, toRefs, capitalize, getCurrentInstance as getCurrentInstance$1, unref, provide, inject as inject$1, onScopeDispose, effectScope, shallowRef, defineComponent as defineComponent$1, camelize, h, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, Fragment, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, cloneVNode, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText, onUpdated } from 'vue';
+import { ref, onBeforeUnmount, watch, readonly, reactive, computed, watchEffect, toRefs, capitalize, getCurrentInstance as getCurrentInstance$1, unref, provide, inject as inject$1, onScopeDispose, effectScope, shallowRef, defineComponent as defineComponent$1, camelize, h, onDeactivated, onActivated, onMounted, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, Fragment, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, cloneVNode, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText, withModifiers, onUpdated } from 'vue';
 
 const IN_BROWSER = typeof window !== 'undefined';
 const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
 const SUPPORTS_TOUCH = IN_BROWSER && ('ontouchstart' in window || window.navigator.maxTouchPoints > 0);
-const SUPPORTS_FOCUS_VISIBLE = IN_BROWSER && typeof CSS !== 'undefined' && CSS.supports('selector(:focus-visible)');
+const SUPPORTS_FOCUS_VISIBLE = IN_BROWSER && typeof CSS !== 'undefined' && typeof CSS.supports !== 'undefined' && CSS.supports('selector(:focus-visible)');
 
 // Utilities
 function useResizeObserver(callback) {
@@ -203,6 +203,10 @@ function clamp(value) {
   let max = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
   return Math.max(min, Math.min(max, value));
 }
+function getDecimals(value) {
+  const trimmedStr = value.toString().trim();
+  return trimmedStr.includes('.') ? trimmedStr.length - trimmedStr.indexOf('.') - 1 : 0;
+}
 function padEnd(str, length) {
   let char = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '0';
   return str + char.repeat(Math.max(0, length - str.length));
@@ -485,7 +489,14 @@ function animate(el, keyframes, options) {
   if (typeof el.animate === 'undefined') return {
     finished: Promise.resolve()
   };
-  const animation = el.animate(keyframes, options);
+  let animation;
+  try {
+    animation = el.animate(keyframes, options);
+  } catch (err) {
+    return {
+      finished: Promise.resolve()
+    };
+  }
   if (typeof animation.finished === 'undefined') {
     animation.finished = new Promise(resolve => {
       animation.onfinish = () => {
@@ -1005,15 +1016,22 @@ function useToggleScope(source, fn) {
 function propIsDefined(vnode, prop) {
   return typeof vnode.props?.[prop] !== 'undefined' || typeof vnode.props?.[toKebabCase(prop)] !== 'undefined';
 }
-const defineComponent = function defineComponent(options) {
+
+// No props
+
+// Implementation
+function defineComponent(options) {
   options._setup = options._setup ?? options.setup;
   if (!options.name) {
     consoleWarn('The component is missing an explicit name, unable to generate default prop value');
     return options;
   }
   if (options._setup) {
-    options.props = options.props ?? {};
-    options.props = propsFactory(options.props, toKebabCase(options.name))();
+    options.props = propsFactory(options.props ?? {}, toKebabCase(options.name))();
+    const propKeys = Object.keys(options.props);
+    options.filterProps = function filterProps(props) {
+      return pick(props, propKeys);
+    };
     options.props._as = String;
     options.setup = function setup(props, ctx) {
       const defaults = useDefaults();
@@ -1053,7 +1071,7 @@ const defineComponent = function defineComponent(options) {
     };
   }
   return options;
-};
+}
 // Implementation
 function genericComponent() {
   let exposeDefaults = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
@@ -3221,9 +3239,6 @@ const VToolbar = genericComponent()({
     };
   }
 });
-function filterToolbarProps(props) {
-  return pick(props, Object.keys(VToolbar?.props ?? {}));
-}
 
 // Utilities
 
@@ -3301,7 +3316,7 @@ const VAppBar = genericComponent()({
       absolute: toRef(props, 'absolute')
     });
     useRender(() => {
-      const [toolbarProps] = filterToolbarProps(props);
+      const [toolbarProps] = VToolbar.filterProps(props);
       return createVNode(VToolbar, mergeProps({
         "ref": vToolbarRef,
         "class": ['v-app-bar', {
@@ -3392,8 +3407,6 @@ function useVariant(props) {
   };
 }
 
-// Types
-
 const makeVBtnGroupProps = propsFactory({
   divided: Boolean,
   ...makeBorderProps(),
@@ -3444,9 +3457,6 @@ const VBtnGroup = genericComponent()({
     });
   }
 });
-function filterVBtnGroupProps(props) {
-  return pick(props, Object.keys(VBtnGroup.props));
-}
 
 // Composables
 
@@ -3673,7 +3683,7 @@ const VBtnToggle = genericComponent()({
       selected
     } = useGroup(props, VBtnToggleSymbol);
     useRender(() => {
-      const [btnGroupProps] = filterVBtnGroupProps(props);
+      const [btnGroupProps] = VBtnGroup.filterProps(props);
       return createVNode(VBtnGroup, mergeProps({
         "class": "v-btn-toggle"
       }, btnGroupProps), {
@@ -4761,49 +4771,50 @@ function useSelectLink(link, select) {
 
 // Types
 
+const makeVBtnProps = propsFactory({
+  active: {
+    type: Boolean,
+    default: undefined
+  },
+  symbol: {
+    type: null,
+    default: VBtnToggleSymbol
+  },
+  flat: Boolean,
+  icon: [Boolean, String, Function, Object],
+  prependIcon: IconValue,
+  appendIcon: IconValue,
+  block: Boolean,
+  stacked: Boolean,
+  ripple: {
+    type: Boolean,
+    default: true
+  },
+  ...makeBorderProps(),
+  ...makeRoundedProps(),
+  ...makeDensityProps(),
+  ...makeDimensionProps(),
+  ...makeElevationProps(),
+  ...makeGroupItemProps(),
+  ...makeLoaderProps(),
+  ...makeLocationProps(),
+  ...makePositionProps(),
+  ...makeRouterProps(),
+  ...makeSizeProps(),
+  ...makeTagProps({
+    tag: 'button'
+  }),
+  ...makeThemeProps(),
+  ...makeVariantProps({
+    variant: 'elevated'
+  })
+}, 'VBtn');
 const VBtn = genericComponent()({
   name: 'VBtn',
   directives: {
     Ripple
   },
-  props: {
-    active: {
-      type: Boolean,
-      default: undefined
-    },
-    symbol: {
-      type: null,
-      default: VBtnToggleSymbol
-    },
-    flat: Boolean,
-    icon: [Boolean, String, Function, Object],
-    prependIcon: IconValue,
-    appendIcon: IconValue,
-    block: Boolean,
-    stacked: Boolean,
-    ripple: {
-      type: Boolean,
-      default: true
-    },
-    ...makeBorderProps(),
-    ...makeRoundedProps(),
-    ...makeDensityProps(),
-    ...makeDimensionProps(),
-    ...makeElevationProps(),
-    ...makeGroupItemProps(),
-    ...makeLoaderProps(),
-    ...makeLocationProps(),
-    ...makePositionProps(),
-    ...makeRouterProps(),
-    ...makeSizeProps(),
-    ...makeTagProps({
-      tag: 'button'
-    }),
-    ...makeThemeProps(),
-    ...makeVariantProps({
-      variant: 'elevated'
-    })
-  },
+  props: makeVBtnProps(),
   emits: {
     'group:selected': val => true
   },
@@ -5498,7 +5509,11 @@ const VField = genericComponent()({
         "key": "clear"
       }, {
         default: () => [withDirectives(createVNode("div", {
-          "class": "v-field__clearable"
+          "class": "v-field__clearable",
+          "onMousedown": e => {
+            e.preventDefault();
+            e.stopPropagation();
+          }
         }, [slots.clear ? slots.clear() : createVNode(InputIcon, {
           "name": "clear"
         }, null)]), [[vShow, props.dirty]])]
@@ -6004,6 +6019,15 @@ const Refs = Symbol('Forwarded refs');
 
 /** Omit properties starting with P */
 
+function getDescriptor(obj, key) {
+  let currentObj = obj;
+  while (currentObj) {
+    const descriptor = Reflect.getOwnPropertyDescriptor(currentObj, key);
+    if (descriptor) return descriptor;
+    currentObj = Object.getPrototypeOf(currentObj);
+  }
+  return undefined;
+}
 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];
@@ -6031,30 +6055,18 @@ function forwardRefs(target) {
       // Check each ref's own properties
       for (const ref of refs) {
         if (!ref.value) continue;
-        const descriptor = Reflect.getOwnPropertyDescriptor(ref.value, key);
+        const descriptor = getDescriptor(ref.value, key) ?? ('_' in ref.value ? getDescriptor(ref.value._?.setupState, key) : undefined);
         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);
+          const descriptor = getDescriptor(ref.value, key);
           if (descriptor) return descriptor;
           const childRefs = ref.value && ref.value[Refs];
           if (childRefs) queue.push(...childRefs);
@@ -6155,7 +6167,15 @@ const VTextField = genericComponent()({
       });
     }
     function onInput(e) {
-      model.value = e.target.value;
+      const el = e.target;
+      model.value = el.value;
+      if (['text', 'search', 'password', 'tel', 'url'].includes(props.type)) {
+        const caretPosition = [el.selectionStart, el.selectionEnd];
+        nextTick(() => {
+          el.selectionStart = caretPosition[0];
+          el.selectionEnd = caretPosition[1];
+        });
+      }
     }
     useRender(() => {
       const hasCounter = !!(slots.counter || props.counter || props.counterValue);
@@ -6214,6 +6234,9 @@ const VTextField = genericComponent()({
                   ...slotProps
                 }
               } = _ref3;
+              const placeholder = computed(() => {
+                return (props.persistentPlaceholder || isFocused.value) && !isDirty.value ? props.placeholder : '';
+              });
               const inputNode = withDirectives(createVNode("input", mergeProps({
                 "ref": inputRef,
                 "value": model.value,
@@ -6222,7 +6245,7 @@ const VTextField = genericComponent()({
                 "readonly": isReadonly.value,
                 "disabled": isDisabled.value,
                 "name": props.name,
-                "placeholder": props.placeholder,
+                "placeholder": placeholder.value,
                 "size": 1,
                 "type": props.type,
                 "onFocus": onFocus,
@@ -6255,9 +6278,6 @@ const VTextField = genericComponent()({
     return forwardRefs({}, vInputRef, vFieldRef, inputRef);
   }
 });
-function filterVTextFieldProps(props) {
-  return pick(props, Object.keys(VTextField.props));
-}
 
 // Types
 
@@ -6515,11 +6535,6 @@ const VSelectionControl = genericComponent()({
     };
   }
 });
-function filterControlProps(props) {
-  return pick(props, Object.keys(VSelectionControl.props));
-}
-
-// Types
 
 const makeVCheckboxBtnProps = propsFactory({
   indeterminate: Boolean,
@@ -6569,9 +6584,6 @@ const VCheckboxBtn = genericComponent()({
     return {};
   }
 });
-function filterCheckboxBtnProps(props) {
-  return pick(props, Object.keys(VCheckboxBtn.props));
-}
 
 // Types
 
@@ -6580,7 +6592,7 @@ const VCheckbox = genericComponent()({
   inheritAttrs: false,
   props: {
     ...makeVInputProps(),
-    ...makeVCheckboxBtnProps()
+    ...omit(makeVCheckboxBtnProps(), ['inline'])
   },
   emits: {
     'update:focused': focused => true
@@ -6600,7 +6612,7 @@ const VCheckbox = genericComponent()({
     useRender(() => {
       const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = filterInputProps(props);
-      const [checkboxProps, _2] = filterCheckboxBtnProps(props);
+      const [checkboxProps, _2] = VCheckboxBtn.filterProps(props);
       return createVNode(VInput, mergeProps({
         "class": "v-checkbox"
       }, inputAttrs, inputProps, {
@@ -7504,8 +7516,6 @@ const useNestedGroupActivator = () => {
   });
 };
 
-// Types
-
 const VListGroupActivator = defineComponent({
   name: 'VListGroupActivator',
   setup(_, _ref) {
@@ -7598,9 +7608,6 @@ const VListGroup = genericComponent()({
     return {};
   }
 });
-function filterListGroupProps(props) {
-  return pick(props, Object.keys(VListGroup.props));
-}
 
 const VListItemSubtitle = createSimpleFunctional('v-list-item-subtitle');
 
@@ -7928,7 +7935,7 @@ const VListChildren = genericComponent()({
           item
         }) : undefined
       };
-      const [listGroupProps, _1] = filterListGroupProps(itemProps);
+      const [listGroupProps, _1] = VListGroup.filterProps(itemProps);
       return children ? createVNode(VListGroup, mergeProps({
         "value": itemProps?.value
       }, listGroupProps), {
@@ -9155,6 +9162,8 @@ function bindScroll(el, onScroll) {
 
 // Types
 
+const breakpoints = ['sm', 'md', 'lg', 'xl', 'xxl']; // no xs
+
 const DisplaySymbol = Symbol.for('vuetify:display');
 const defaultDisplayOptions = {
   mobileBreakpoint: 'lg',
@@ -9710,9 +9719,6 @@ const VOverlay = genericComponent()({
     };
   }
 });
-function filterVOverlayProps(props) {
-  return pick(props, Object.keys(VOverlay.props));
-}
 
 // Types
 
@@ -9778,7 +9784,7 @@ const VMenu = genericComponent()({
       'aria-owns': id.value
     }, props.activatorProps));
     useRender(() => {
-      const [overlayProps] = filterVOverlayProps(props);
+      const [overlayProps] = VOverlay.filterProps(props);
       return createVNode(VOverlay, mergeProps({
         "ref": overlay,
         "class": ['v-menu']
@@ -9954,7 +9960,7 @@ const VSelect = genericComponent()({
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
-      const [textFieldProps] = filterVTextFieldProps(props);
+      const [textFieldProps] = VTextField.filterProps(props);
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
       }, textFieldProps, {
@@ -10347,7 +10353,7 @@ const VAutocomplete = genericComponent()({
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
-      const [textFieldProps] = filterVTextFieldProps(props);
+      const [textFieldProps] = VTextField.filterProps(props);
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
       }, textFieldProps, {
@@ -12295,10 +12301,7 @@ const useSlider = _ref => {
   const min = computed(() => parseFloat(props.min));
   const max = computed(() => parseFloat(props.max));
   const step = computed(() => props.step > 0 ? parseFloat(props.step) : 0);
-  const decimals = computed(() => {
-    const trimmedStep = step.value.toString().trim();
-    return trimmedStep.includes('.') ? trimmedStep.length - trimmedStep.indexOf('.') - 1 : 0;
-  });
+  const decimals = computed(() => Math.max(getDecimals(step.value), getDecimals(min.value)));
   const thumbSize = computed(() => parseInt(props.thumbSize, 10));
   const tickSize = computed(() => parseInt(props.tickSize, 10));
   const trackSize = computed(() => parseInt(props.trackSize, 10));
@@ -13276,8 +13279,6 @@ const VColorPickerSwatches = defineComponent({
   }
 });
 
-// Types
-
 const makeVSheetProps = propsFactory({
   color: String,
   ...makeBorderProps(),
@@ -13521,6 +13522,7 @@ const VCombobox = genericComponent()({
       }
     });
     const selectionIndex = ref(-1);
+    let cleared = false;
     const color = computed(() => vTextFieldRef.value?.color);
     const {
       items,
@@ -13557,11 +13559,17 @@ const VCombobox = genericComponent()({
           }
         }
         if (!val) selectionIndex.value = -1;
-        if (isFocused.value) menu.value = true;
         isPristine.value = !val;
       }
     });
     watch(_search, value => {
+      if (cleared) {
+        // wait for clear to finish, VTextField sets _search to null
+        // then search computed triggers and updates _search to ''
+        nextTick(() => cleared = false);
+      } else if (isFocused.value && !menu.value) {
+        menu.value = true;
+      }
       emit('update:search', value);
     });
     watch(model, value => {
@@ -13588,6 +13596,7 @@ const VCombobox = genericComponent()({
     const selection = computed(() => selections.value[selectionIndex.value]);
     const listRef = ref();
     function onClear(e) {
+      cleared = true;
       if (props.openOnClear) {
         menu.value = true;
       }
@@ -13702,7 +13711,7 @@ const VCombobox = genericComponent()({
     useRender(() => {
       const hasChips = !!(props.chips || slots.chip);
       const hasList = !!(!props.hideNoData || displayItems.value.length || slots.prepend || slots.append || slots['no-data']);
-      const [textFieldProps] = filterVTextFieldProps(props);
+      const [textFieldProps] = VTextField.filterProps(props);
       return createVNode(VTextField, mergeProps({
         "ref": vTextFieldRef
       }, textFieldProps, {
@@ -13910,7 +13919,7 @@ const VDialog = genericComponent()({
       'aria-expanded': String(isActive.value)
     }, props.activatorProps));
     useRender(() => {
-      const [overlayProps] = filterVOverlayProps(props);
+      const [overlayProps] = VOverlay.filterProps(props);
       return createVNode(VOverlay, mergeProps({
         "ref": overlay,
         "class": ['v-dialog', {
@@ -13920,9 +13929,9 @@ const VDialog = genericComponent()({
       }, overlayProps, {
         "modelValue": isActive.value,
         "onUpdate:modelValue": $event => isActive.value = $event,
-        "aria-role": "dialog",
         "aria-modal": "true",
-        "activatorProps": activatorProps.value
+        "activatorProps": activatorProps.value,
+        "role": "dialog"
       }, scopeId), {
         activator: slots.activator,
         default: function () {
@@ -14514,10 +14523,8 @@ const VContainer = genericComponent()({
 
 // Types
 
-const breakpoints$1 = ['sm', 'md', 'lg', 'xl', 'xxl']; // no xs
-
 const breakpointProps = (() => {
-  return breakpoints$1.reduce((props, val) => {
+  return breakpoints.reduce((props, val) => {
     props[val] = {
       type: [Boolean, String, Number],
       default: false
@@ -14526,8 +14533,9 @@ const breakpointProps = (() => {
   }, {});
 })();
 const offsetProps = (() => {
-  return breakpoints$1.reduce((props, val) => {
-    props['offset' + capitalize(val)] = {
+  return breakpoints.reduce((props, val) => {
+    const offsetKey = 'offset' + capitalize(val);
+    props[offsetKey] = {
       type: [String, Number],
       default: null
     };
@@ -14535,8 +14543,9 @@ const offsetProps = (() => {
   }, {});
 })();
 const orderProps = (() => {
-  return breakpoints$1.reduce((props, val) => {
-    props['order' + capitalize(val)] = {
+  return breakpoints.reduce((props, val) => {
+    const orderKey = 'order' + capitalize(val);
+    props[orderKey] = {
       type: [String, Number],
       default: null
     };
@@ -14634,13 +14643,12 @@ const VCol = genericComponent()({
 
 // Types
 
-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) => {
-    props[prefix + capitalize(val)] = def();
+    const prefixKey = prefix + capitalize(val);
+    props[prefixKey] = def();
     return props;
   }, {});
 }
@@ -14970,7 +14978,10 @@ const VLazy = genericComponent()({
       }, {
         default: () => [slots.default?.()]
       })]
-    }), [[resolveDirective("intersect"), onIntersect, props.options]]));
+    }), [[resolveDirective("intersect"), {
+      handler: onIntersect,
+      options: props.options
+    }, null]]));
     return {};
   }
 });
@@ -15947,9 +15958,9 @@ const VParallax = genericComponent()({
       frame = requestAnimationFrame(() => {
         const el = (root.value?.$el).querySelector('.v-img__img');
         if (!el) return;
-        const scrollHeight = scrollParent.clientHeight ?? document.documentElement.clientHeight;
-        const scrollPos = scrollParent.scrollTop ?? window.scrollY;
-        const top = intersectionRef.value.offsetTop;
+        const scrollHeight = scrollParent instanceof Document ? document.documentElement.clientHeight : scrollParent.clientHeight;
+        const scrollPos = scrollParent instanceof Document ? window.scrollY : scrollParent.scrollTop;
+        const top = intersectionRef.value.getBoundingClientRect().top + scrollPos;
         const height = contentRect.value.height;
         const center = top + (height - scrollHeight) / 2;
         const translate = floor((scrollPos - center) * scale.value);
@@ -16031,10 +16042,7 @@ const VRadioGroup = genericComponent()({
     useRender(() => {
       const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = filterInputProps(props);
-      const [controlProps, _2] = filterControlProps({
-        ...props,
-        multiple: false
-      });
+      const [controlProps, _2] = VSelectionControl.filterProps(props);
       const label = slots.label ? slots.label({
         label: props.label,
         props: {
@@ -16069,7 +16077,8 @@ const VRadioGroup = genericComponent()({
             "type": props.type,
             "disabled": isDisabled.value,
             "readonly": isReadonly.value,
-            "aria-labelledby": label ? id.value : undefined
+            "aria-labelledby": label ? id.value : undefined,
+            "multiple": false
           }, controlAttrs, {
             "modelValue": model.value,
             "onUpdate:modelValue": $event => model.value = $event
@@ -16939,7 +16948,7 @@ const VSnackbar = genericComponent()({
       window.clearTimeout(activeTimeout);
     }
     useRender(() => {
-      const [overlayProps] = filterVOverlayProps(props);
+      const [overlayProps] = VOverlay.filterProps(props);
       return createVNode(VOverlay, mergeProps({
         "ref": overlay,
         "class": ['v-snackbar', {
@@ -17034,7 +17043,7 @@ const VSwitch = genericComponent()({
     useRender(() => {
       const [inputAttrs, controlAttrs] = filterInputAttrs(attrs);
       const [inputProps, _1] = filterInputProps(props);
-      const [controlProps, _2] = filterControlProps(props);
+      const [controlProps, _2] = VSelectionControl.filterProps(props);
       const control = ref();
       function onClick() {
         control.value?.input?.click();
@@ -17167,28 +17176,17 @@ const VTab = genericComponent()({
   name: 'VTab',
   props: {
     fixed: Boolean,
-    icon: [Boolean, String, Function, Object],
-    prependIcon: IconValue,
-    appendIcon: IconValue,
-    stacked: Boolean,
     title: String,
-    ripple: {
-      type: Boolean,
-      default: true
-    },
-    color: String,
     sliderColor: String,
     hideSlider: Boolean,
     direction: {
       type: String,
       default: 'horizontal'
     },
-    ...makeTagProps(),
-    ...makeRouterProps(),
-    ...makeGroupItemProps({
-      selectedClass: 'v-tab--selected'
-    }),
-    ...makeThemeProps()
+    ...omit(makeVBtnProps({
+      selectedClass: 'v-tab--selected',
+      variant: 'text'
+    }), ['active', 'block', 'flat', 'location', 'position', 'symbol'])
   },
   setup(props, _ref) {
     let {
@@ -17238,7 +17236,7 @@ const VTab = genericComponent()({
       }
     }
     useRender(() => {
-      const [btnProps] = pick(props, ['href', 'to', 'replace', 'icon', 'stacked', 'prependIcon', 'appendIcon', 'ripple', 'theme', 'disabled', 'selectedClass', 'value', 'color']);
+      const [btnProps] = VBtn.filterProps(props);
       return createVNode(VBtn, mergeProps({
         "_as": "VTab",
         "symbol": VTabsSymbol,
@@ -17250,7 +17248,6 @@ const VTab = genericComponent()({
         "active": false,
         "block": props.fixed,
         "maxWidth": props.fixed ? 300 : undefined,
-        "variant": "text",
         "rounded": 0
       }, btnProps, attrs, {
         "onGroup:selected": updateSlider
@@ -17495,7 +17492,13 @@ const VTextarea = genericComponent()({
       });
     }
     function onInput(e) {
-      model.value = e.target.value;
+      const el = e.target;
+      const caretPosition = [el.selectionStart, el.selectionEnd];
+      model.value = el.value;
+      nextTick(() => {
+        el.selectionStart = caretPosition[0];
+        el.selectionEnd = caretPosition[1];
+      });
     }
     const sizerRef = ref();
     function calculateInputHeight() {
@@ -17935,7 +17938,7 @@ const VTooltip = genericComponent()({
       'aria-describedby': id.value
     }, props.activatorProps));
     useRender(() => {
-      const [overlayProps] = filterVOverlayProps(props);
+      const [overlayProps] = VOverlay.filterProps(props);
       return createVNode(VOverlay, mergeProps({
         "ref": overlay,
         "class": ['v-tooltip'],
@@ -18753,6 +18756,7 @@ function useExpanded() {
 const VDataTableRow = defineComponent({
   name: 'VDataTableRow',
   props: {
+    index: Number,
     item: Object,
     onClick: Function
   },
@@ -18790,6 +18794,7 @@ const VDataTableRow = defineComponent({
         const item = props.item;
         const slotName = `item.${column.key}`;
         const slotProps = {
+          index: props.index,
           item: props.item,
           columns: columns.value,
           isSelected,
@@ -18801,7 +18806,7 @@ const VDataTableRow = defineComponent({
         if (column.key === 'data-table-select') {
           return slots['item.data-table-select']?.(slotProps) ?? createVNode(VCheckboxBtn, {
             "modelValue": isSelected([item]),
-            "onClick": () => toggleSelect(item)
+            "onClick": withModifiers(() => toggleSelect(item), ['stop'])
           }, null);
         }
         if (column.key === 'data-table-expand') {
@@ -18809,10 +18814,10 @@ const VDataTableRow = defineComponent({
             "icon": isExpanded(item) ? '$collapse' : '$expand',
             "size": "small",
             "variant": "text",
-            "onClick": () => toggleExpand(item)
+            "onClick": withModifiers(() => toggleExpand(item), ['stop'])
           }, null);
         }
-        return item.columns[column.key];
+        return getPropertyFromItem(item.columns, column.key);
       }
     }))]));
   }
@@ -18912,6 +18917,7 @@ const VDataTableRows = genericComponent()({
             item
           });
         },
+        "index": index,
         "item": item
       }, slots), isExpanded(item) && slots['expanded-row']?.(slotProps)]);
     })]));
@@ -19140,6 +19146,19 @@ const makeDataTableItemProps = propsFactory({
     itemValue: 'id'
   })
 }, 'v-data-table-item');
+function add(obj, key, value) {
+  const path = key.split('.');
+  while (path.length > 1) {
+    const part = path.shift();
+    if (obj[part] == null) {
+      obj[part] = {};
+    }
+    if (typeof obj[part] === 'object') {
+      obj = obj[part];
+    }
+  }
+  obj[path[0]] = value;
+}
 function useDataTableItems(props, columns) {
   const {
     items
@@ -19149,7 +19168,7 @@ function useDataTableItems(props, columns) {
       ...item,
       type: 'item',
       columns: columns.value.reduce((obj, column) => {
-        obj[column.key] = getPropertyFromItem(item.raw, column.value ?? column.key);
+        add(obj, column.key, getPropertyFromItem(item.raw, column.value ?? column.key));
         return obj;
       }, {})
     };
@@ -19687,7 +19706,9 @@ const VDataTableServer = genericComponent()({
       "height": props.height
     }, {
       top: slots.top,
-      default: slots.default ?? (() => createVNode(Fragment, null, [createVNode("thead", {
+      default: slots.default ?? (() => createVNode(Fragment, null, [slots.colgroup?.({
+        columns
+      }), createVNode("thead", {
         "class": "v-data-table__thead",
         "role": "rowgroup"
       }, [slots.headers ? slots.headers() : createVNode(VDataTableHeaders, {
@@ -20230,7 +20251,7 @@ function createVuetify$1() {
     locale
   };
 }
-const version$1 = "3.1.10";
+const version$1 = "3.1.12";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -20242,7 +20263,7 @@ function inject(key) {
   }
 }
 
-const version = "3.1.10";
+const version = "3.1.12";
 
 const createVuetify = function () {
   let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};