vuetify 3.10.4 → 3.10.6

package/dist/vuetify-labs.cjs

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.10.4
+* Vuetify v3.10.6
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -472,8 +472,10 @@
   }
   function focusableChildren(el) {
     let filterByTabIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
-    const targets = ['button', '[href]', 'input:not([type="hidden"])', 'select', 'textarea', '[tabindex]'].map(s => `${s}${filterByTabIndex ? ':not([tabindex="-1"])' : ''}:not([disabled])`).join(', ');
-    return [...el.querySelectorAll(targets)];
+    const targets = ['button', '[href]', 'input:not([type="hidden"])', 'select', 'textarea', 'details:not(:has(> summary))', 'details > summary', '[tabindex]', '[contenteditable]:not([contenteditable="false"])', 'audio[controls]', 'video[controls]'].map(s => `${s}${filterByTabIndex ? ':not([tabindex="-1"])' : ''}:not([disabled], [inert])`).join(', ');
+    return [...el.querySelectorAll(targets)].filter(x => !x.closest('[inert]')) // does not have inert parent
+    .filter(x => !!x.offsetParent || x.getClientRects().length > 0) // is rendered
+    .filter(x => !x.parentElement?.closest('details:not([open])') || x.tagName === 'SUMMARY' && x.parentElement?.tagName === 'DETAILS');
   }
   function getNextElement(elements, location, condition) {
     let _el;
@@ -4547,7 +4549,7 @@
     function unregister() {
       group?.unregister(id);
     }
-    vue.onMounted(() => register());
+    register();
     vue.onBeforeUnmount(() => unregister());
     const isSelected = vue.computed(() => {
       return group.isSelected(id);
@@ -8097,6 +8099,10 @@
   const VSlideGroupSymbol = Symbol.for('vuetify:v-slide-group');
   const makeVSlideGroupProps = propsFactory({
     centerActive: Boolean,
+    scrollToActive: {
+      type: Boolean,
+      default: true
+    },
     contentClass: null,
     direction: {
       type: String,
@@ -8185,7 +8191,7 @@
               contentSize.value = contentRect.value[sizeProperty];
               isOverflowing.value = containerSize.value + 1 < contentSize.value;
             }
-            if (firstSelectedIndex.value >= 0 && contentRef.el) {
+            if (props.scrollToActive && firstSelectedIndex.value >= 0 && contentRef.el) {
               // TODO: Is this too naive? Should we store element references in group composable?
               const selectedElement = contentRef.el.children[lastSelectedIndex.value];
               scrollToChildren(selectedElement, props.centerActive);
@@ -8454,7 +8460,9 @@
       type: Function,
       default: deepEqual
     },
-    ...makeVSlideGroupProps(),
+    ...makeVSlideGroupProps({
+      scrollToActive: false
+    }),
     ...makeComponentProps(),
     ...makeGroupProps({
       selectedClass: 'v-chip--selected'
@@ -9553,7 +9561,9 @@
     };
     vue.onBeforeMount(() => {
       if (!parent.isGroupActivator) {
-        parent.root.register(computedId.value, parent.id.value, vue.toValue(isDisabled), isGroup);
+        vue.nextTick(() => {
+          parent.root.register(computedId.value, parent.id.value, vue.toValue(isDisabled), isGroup);
+        });
       }
     });
     vue.onBeforeUnmount(() => {
@@ -9561,6 +9571,14 @@
         parent.root.unregister(computedId.value);
       }
     });
+    vue.watch(computedId, (val, oldVal) => {
+      if (!parent.isGroupActivator) {
+        parent.root.unregister(oldVal);
+        vue.nextTick(() => {
+          parent.root.register(val, parent.id.value, vue.toValue(isDisabled), isGroup);
+        });
+      }
+    });
     isGroup && vue.provide(VNestedSymbol, item);
     return item;
   };
@@ -9792,7 +9810,7 @@
       const isLink = vue.toRef(() => props.link !== false && link.isLink.value);
       const isSelectable = vue.computed(() => !!list && (root.selectable.value || root.activatable.value || props.value != null));
       const isClickable = vue.computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || isSelectable.value));
-      const role = vue.computed(() => list ? isSelectable.value ? 'option' : 'listitem' : undefined);
+      const role = vue.computed(() => list ? isLink.value ? 'link' : isSelectable.value ? 'option' : 'listitem' : undefined);
       const ariaSelected = vue.computed(() => {
         if (!isSelectable.value) return undefined;
         return root.activatable.value ? isActivated.value : root.selectable.value ? isSelected.value : isActive.value;
@@ -9811,7 +9829,9 @@
         handleActiveLink();
       });
       vue.onBeforeMount(() => {
-        if (link.isActive?.value) handleActiveLink();
+        if (link.isActive?.value) {
+          vue.nextTick(() => handleActiveLink());
+        }
       });
       function handleActiveLink() {
         if (parent.value != null) {
@@ -12059,25 +12079,41 @@
         document.removeEventListener('focusin', onFocusIn);
       });
       vue.onDeactivated(() => isActive.value = false);
+      let focusTrapSuppressed = false;
+      let focusTrapSuppressionTimeout = -1;
+      async function onPointerdown() {
+        focusTrapSuppressed = true;
+        focusTrapSuppressionTimeout = window.setTimeout(() => {
+          focusTrapSuppressed = false;
+        }, 100);
+      }
       async function onFocusIn(e) {
         const before = e.relatedTarget;
         const after = e.target;
         await vue.nextTick();
         if (isActive.value && before !== after && overlay.value?.contentEl &&
-        // We're the topmost menu
-        overlay.value?.globalTop &&
+        // We're the menu without open submenus or overlays
+        overlay.value?.localTop &&
         // It isn't the document or the menu body
         ![document, overlay.value.contentEl].includes(after) &&
         // It isn't inside the menu body
         !overlay.value.contentEl.contains(after)) {
-          const focusable = focusableChildren(overlay.value.contentEl);
-          focusable[0]?.focus();
+          if (focusTrapSuppressed) {
+            if (!props.openOnHover || !overlay.value.activatorEl?.contains(after)) {
+              isActive.value = false;
+            }
+          } else {
+            const focusable = focusableChildren(overlay.value.contentEl);
+            focusable[0]?.focus();
+            document.removeEventListener('pointerdown', onPointerdown);
+          }
         }
       }
       vue.watch(isActive, val => {
         if (val) {
           parent?.register();
           if (IN_BROWSER && !props.disableInitialFocus) {
+            document.addEventListener('pointerdown', onPointerdown);
             document.addEventListener('focusin', onFocusIn, {
               once: true
             });
@@ -12085,6 +12121,8 @@
         } else {
           parent?.unregister();
           if (IN_BROWSER) {
+            clearTimeout(focusTrapSuppressionTimeout);
+            document.removeEventListener('pointerdown', onPointerdown);
             document.removeEventListener('focusin', onFocusIn);
           }
         }
@@ -12678,7 +12716,6 @@
         e.stopPropagation();
         onFocus();
         vue.nextTick(() => {
-          model.value = null;
           reset();
           callEvent(props['onClick:clear'], e);
         });
@@ -12733,8 +12770,6 @@
               "onMousedown": onControlMousedown,
               "onClick": onControlClick,
               "onClick:clear": e => onClear(e, reset),
-              "onClick:prependInner": props['onClick:prependInner'],
-              "onClick:appendInner": props['onClick:appendInner'],
               "role": props.role
             }, omit(fieldProps, ['onClick:clear']), {
               "id": id.value,
@@ -12910,7 +12945,7 @@
       const start = performance.now();
       offsets[0] = 0;
       const length = items.value.length;
-      for (let i = 1; i <= length - 1; i++) {
+      for (let i = 1; i <= length; i++) {
         offsets[i] = (offsets[i - 1] || 0) + getSize(i - 1);
       }
       updateTime.value = Math.max(updateTime.value, performance.now() - start);
@@ -12945,7 +12980,7 @@
       }
     }
     function calculateOffset(index) {
-      index = clamp(index, 0, items.value.length - 1);
+      index = clamp(index, 0, items.value.length);
       const whole = Math.floor(index);
       const fraction = index % 1;
       const next = whole + 1;
@@ -13950,10 +13985,7 @@
     ...omit(makeVTextFieldProps({
       modelValue: null,
       role: 'combobox'
-    }), ['validationValue', 'dirty', 'appendInnerIcon']),
-    ...makeTransitionProps({
-      transition: false
-    })
+    }), ['validationValue', 'dirty', 'appendInnerIcon'])
   }, 'VAutocomplete');
   const VAutocomplete = genericComponent()({
     name: 'VAutocomplete',
@@ -13978,6 +14010,7 @@
       const vMenuRef = vue.ref();
       const vVirtualScrollRef = vue.ref();
       const selectionIndex = vue.shallowRef(-1);
+      const _searchLock = vue.shallowRef(null);
       const {
         items,
         transformIn,
@@ -13999,9 +14032,9 @@
       const {
         filteredItems,
         getMatches
-      } = useFilter(props, items, () => isPristine.value ? '' : search.value);
+      } = useFilter(props, items, () => _searchLock.value ?? (isPristine.value ? '' : search.value));
       const displayItems = vue.computed(() => {
-        if (props.hideSelected) {
+        if (props.hideSelected && _searchLock.value === null) {
           return filteredItems.value.filter(filteredItem => !model.value.some(s => s.value === filteredItem.value));
         }
         return filteredItems.value;
@@ -14132,6 +14165,7 @@
           isPristine.value = true;
           vTextFieldRef.value?.focus();
         }
+        _searchLock.value = null;
       }
       function onFocusin(e) {
         isFocused.value = true;
@@ -14167,6 +14201,7 @@
         } else {
           const add = set !== false;
           model.value = add ? [item] : [];
+          _searchLock.value = isPristine.value ? '' : search.value ?? '';
           search.value = add && !hasSelectionSlot.value ? item.title : '';
 
           // watch for search watcher to trigger
@@ -14186,6 +14221,9 @@
         } else {
           if (!props.multiple && search.value == null) model.value = [];
           menu.value = false;
+          if (!isPristine.value && search.value) {
+            _searchLock.value = search.value;
+          }
           search.value = '';
           selectionIndex.value = -1;
         }
@@ -14195,13 +14233,14 @@
         if (val) menu.value = true;
         isPristine.value = !val;
       });
-      vue.watch(menu, () => {
-        if (!props.hideSelected && menu.value && model.value.length) {
+      vue.watch(menu, val => {
+        if (!props.hideSelected && val && model.value.length && isPristine.value) {
           const index = displayItems.value.findIndex(item => model.value.some(s => item.value === s.value));
           IN_BROWSER && window.requestAnimationFrame(() => {
             index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
           });
         }
+        if (val) _searchLock.value = null;
       });
       vue.watch(items, (newVal, oldVal) => {
         if (menu.value) return;
@@ -14252,7 +14291,6 @@
             "maxHeight": 310,
             "openOnClick": false,
             "closeOnContentClick": false,
-            "transition": props.transition,
             "onAfterEnter": onAfterEnter,
             "onAfterLeave": onAfterLeave
           }, props.menuProps), {
@@ -15680,7 +15718,21 @@
       const activeIndex = vue.computed(() => {
         return group.items.value.findIndex(item => group.selected.value.includes(item.id));
       });
+
+      // Fix for https://github.com/vuetifyjs/vuetify/issues/18447
       vue.watch(activeIndex, (newVal, oldVal) => {
+        let scrollableParent;
+        const savedScrollPosition = {
+          x: 0,
+          y: 0
+        };
+        if (IN_BROWSER && oldVal >= 0) {
+          scrollableParent = getScrollParent(rootRef.value);
+
+          // Save current scroll position
+          savedScrollPosition.x = scrollableParent.scrollLeft;
+          savedScrollPosition.y = scrollableParent.scrollTop;
+        }
         const itemsLength = group.items.value.length;
         const lastIndex = itemsLength - 1;
         if (itemsLength <= 2) {
@@ -15692,7 +15744,32 @@
         } else {
           isReversed.value = newVal < oldVal;
         }
-      });
+        vue.nextTick(() => {
+          if (!IN_BROWSER || !scrollableParent) return;
+          const currentScrollY = scrollableParent.scrollTop;
+          if (currentScrollY !== savedScrollPosition.y) {
+            scrollableParent.scrollTo({
+              left: savedScrollPosition.x,
+              top: savedScrollPosition.y,
+              behavior: 'instant'
+            });
+          }
+          requestAnimationFrame(() => {
+            if (!scrollableParent) return;
+            const rafScrollY = scrollableParent.scrollTop;
+            if (rafScrollY !== savedScrollPosition.y) {
+              scrollableParent.scrollTo({
+                left: savedScrollPosition.x,
+                top: savedScrollPosition.y,
+                behavior: 'instant'
+              });
+            }
+          });
+        });
+      }, {
+        flush: 'sync'
+      }); // Run synchronously before DOM updates
+
       vue.provide(VWindowSymbol, {
         transition,
         isReversed,
@@ -18597,7 +18674,7 @@
     };
   }
   function createDateRange(adapter, start, stop) {
-    const diff = adapter.getDiff(adapter.endOfDay(stop ?? start), adapter.startOfDay(start), 'days');
+    const diff = adapter.getDiff(new Date(`${adapter.toISO(stop ?? start)}T00:00:00Z`), new Date(`${adapter.toISO(start)}T00:00:00Z`), 'days');
     const datesInRange = [start];
     for (let i = 1; i < diff; i++) {
       const nextDate = adapter.addDays(start, i);
@@ -19280,10 +19357,7 @@
     ...omit(makeVTextFieldProps({
       modelValue: null,
       role: 'combobox'
-    }), ['validationValue', 'dirty', 'appendInnerIcon']),
-    ...makeTransitionProps({
-      transition: false
-    })
+    }), ['validationValue', 'dirty', 'appendInnerIcon'])
   }, 'VCombobox');
   const VCombobox = genericComponent()({
     name: 'VCombobox',
@@ -19327,13 +19401,16 @@
       const hasChips = vue.computed(() => !!(props.chips || slots.chip));
       const hasSelectionSlot = vue.computed(() => hasChips.value || !!slots.selection);
       const _search = vue.shallowRef(!props.multiple && !hasSelectionSlot.value ? model.value[0]?.title ?? '' : '');
+      const _searchLock = vue.shallowRef(null);
       const search = vue.computed({
         get: () => {
           return _search.value;
         },
         set: async val => {
           _search.value = val ?? '';
-          if (!props.multiple && !hasSelectionSlot.value) {
+          if (val === null || val === '' && !props.multiple && !hasSelectionSlot.value) {
+            model.value = [];
+          } else if (!props.multiple && !hasSelectionSlot.value) {
             model.value = [transformItem$3(props, val)];
             vue.nextTick(() => vVirtualScrollRef.value?.scrollToIndex(0));
           }
@@ -19361,9 +19438,9 @@
       const {
         filteredItems,
         getMatches
-      } = useFilter(props, items, () => props.alwaysFilter || !isPristine.value ? search.value : '');
+      } = useFilter(props, items, () => _searchLock.value ?? (props.alwaysFilter || !isPristine.value ? search.value : ''));
       const displayItems = vue.computed(() => {
-        if (props.hideSelected) {
+        if (props.hideSelected && _searchLock.value === null) {
           return filteredItems.value.filter(filteredItem => !model.value.some(s => s.value === filteredItem.value));
         }
         return filteredItems.value;
@@ -19444,22 +19521,19 @@
         if (['Escape'].includes(e.key)) {
           menu.value = false;
         }
-        if (['Enter', 'Escape', 'Tab'].includes(e.key)) {
-          if (highlightFirst.value && ['Enter', 'Tab'].includes(e.key) && !model.value.some(_ref2 => {
-            let {
-              value
-            } = _ref2;
-            return value === displayItems.value[0].value;
-          })) {
-            select(filteredItems.value[0]);
-          }
-          isPristine.value = true;
+        if (highlightFirst.value && ['Enter', 'Tab'].includes(e.key) && !model.value.some(_ref2 => {
+          let {
+            value
+          } = _ref2;
+          return value === displayItems.value[0].value;
+        })) {
+          select(filteredItems.value[0]);
         }
         if (e.key === 'ArrowDown' && highlightFirst.value) {
           listRef.value?.focus('next');
         }
         if (e.key === 'Enter' && search.value) {
-          select(transformItem$3(props, search.value));
+          select(transformItem$3(props, search.value), true, true);
           if (hasSelectionSlot.value) _search.value = '';
         }
         if (['Backspace', 'Delete'].includes(e.key)) {
@@ -19507,10 +19581,12 @@
           isPristine.value = true;
           vTextFieldRef.value?.focus();
         }
+        _searchLock.value = null;
       }
       /** @param set - null means toggle */
       function select(item) {
         let set = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+        let keepMenu = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
         if (!item || item.props.disabled) return;
         if (props.multiple) {
           const index = model.value.findIndex(selection => (props.valueComparator || deepEqual)(selection.value, item.value));
@@ -19528,11 +19604,14 @@
         } else {
           const add = set !== false;
           model.value = add ? [item] : [];
+          if ((!isPristine.value || props.alwaysFilter) && _search.value) {
+            _searchLock.value = _search.value;
+          }
           _search.value = add && !hasSelectionSlot.value ? item.title : '';
 
           // watch for search watcher to trigger
           vue.nextTick(() => {
-            menu.value = false;
+            menu.value = keepMenu;
             isPristine.value = true;
           });
         }
@@ -19546,9 +19625,6 @@
       function onFocusout(e) {
         listHasFocus.value = false;
       }
-      function onUpdateModelValue(v) {
-        if (v == null || v === '' && !props.multiple && !hasSelectionSlot.value) model.value = [];
-      }
       vue.watch(isFocused, (val, oldVal) => {
         if (val || val === oldVal) return;
         selectionIndex.value = -1;
@@ -19571,13 +19647,14 @@
           }
         }
       });
-      vue.watch(menu, () => {
-        if (!props.hideSelected && menu.value && model.value.length) {
+      vue.watch(menu, val => {
+        if (!props.hideSelected && val && model.value.length && isPristine.value) {
           const index = displayItems.value.findIndex(item => model.value.some(s => (props.valueComparator || deepEqual)(s.value, item.value)));
           IN_BROWSER && window.requestAnimationFrame(() => {
             index >= 0 && vVirtualScrollRef.value?.scrollToIndex(index);
           });
         }
+        if (val) _searchLock.value = null;
       });
       vue.watch(items, (newVal, oldVal) => {
         if (menu.value) return;
@@ -19593,7 +19670,7 @@
           "ref": vTextFieldRef
         }, textFieldProps, {
           "modelValue": search.value,
-          "onUpdate:modelValue": [$event => search.value = $event, onUpdateModelValue],
+          "onUpdate:modelValue": $event => search.value = $event,
           "focused": isFocused.value,
           "onUpdate:focused": $event => isFocused.value = $event,
           "validationValue": model.externalValue,
@@ -19628,7 +19705,6 @@
             "maxHeight": 310,
             "openOnClick": false,
             "closeOnContentClick": false,
-            "transition": props.transition,
             "onAfterEnter": onAfterEnter,
             "onAfterLeave": onAfterLeave
           }, props.menuProps), {
@@ -21642,6 +21718,7 @@
     },
     /** @deprecated */
     sticky: Boolean,
+    ...makeDensityProps(),
     ...makeDisplayProps(),
     ...makeLoaderProps()
   }, 'VDataTableHeaders');
@@ -21766,6 +21843,7 @@
             if (isEmpty) return '';
             if (column.key === 'data-table-select') {
               return slots['header.data-table-select']?.(columnSlotProps) ?? (showSelectAll.value && vue.createVNode(VCheckboxBtn, {
+                "density": props.density,
                 "modelValue": allSelected.value,
                 "indeterminate": someSelected.value && !allSelected.value,
                 "onUpdate:modelValue": selectAll
@@ -21866,7 +21944,8 @@
     groupExpandIcon: {
       type: IconValue,
       default: '$tableGroupExpand'
-    }
+    },
+    ...makeDensityProps()
   }, 'VDataTableGroupHeaderRow');
   const VDataTableGroupHeaderRow = genericComponent()({
     name: 'VDataTableGroupHeaderRow',
@@ -21934,6 +22013,7 @@
             "noPadding": true
           }, {
             default: () => [vue.createVNode(VCheckboxBtn, {
+              "density": props.density,
               "modelValue": modelValue,
               "indeterminate": indeterminate,
               "onUpdate:modelValue": selectGroup
@@ -21962,6 +22042,7 @@
     onClick: EventProp(),
     onContextmenu: EventProp(),
     onDblclick: EventProp(),
+    ...makeDensityProps(),
     ...makeDisplayProps()
   }, 'VDataTableRow');
   const VDataTableRow = genericComponent()({
@@ -22070,6 +22151,7 @@
                 }
               }) ?? vue.createVNode(VCheckboxBtn, {
                 "disabled": !item.selectable,
+                "density": props.density,
                 "modelValue": isSelected([item]),
                 "onClick": vue.withModifiers(event => toggleSelect(item, props.index, event), ['stop'])
               }, null);
@@ -22122,8 +22204,8 @@
     },
     rowProps: [Object, Function],
     cellProps: [Object, Function],
-    ...pick(makeVDataTableRowProps(), ['collapseIcon', 'expandIcon']),
-    ...pick(makeVDataTableGroupHeaderRowProps(), ['groupCollapseIcon', 'groupExpandIcon']),
+    ...pick(makeVDataTableRowProps(), ['collapseIcon', 'expandIcon', 'density']),
+    ...pick(makeVDataTableGroupHeaderRowProps(), ['groupCollapseIcon', 'groupExpandIcon', 'density']),
     ...makeDisplayProps()
   }, 'VDataTableRows');
   const VDataTableRows = genericComponent()({
@@ -22158,7 +22240,7 @@
         mobile
       } = useDisplay(props);
       useRender(() => {
-        const groupHeaderRowProps = pick(props, ['groupCollapseIcon', 'groupExpandIcon']);
+        const groupHeaderRowProps = pick(props, ['groupCollapseIcon', 'groupExpandIcon', 'density']);
         if (props.loading && (!props.items.length || slots.loading)) {
           return vue.createElementVNode("tr", {
             "class": "v-data-table-rows-loading",
@@ -22224,6 +22306,7 @@
               cellProps: props.cellProps,
               collapseIcon: props.collapseIcon,
               expandIcon: props.expandIcon,
+              density: props.density,
               mobile: mobile.value
             }, getPrefixedEventHandlers(attrs, ':row', () => slotProps), typeof props.rowProps === 'function' ? props.rowProps({
               item: slotProps.item,
@@ -22240,6 +22323,8 @@
     }
   });
 
+  // Types
+
   const makeVTableProps = propsFactory({
     fixedHeader: Boolean,
     fixedFooter: Boolean,
@@ -22269,37 +22354,26 @@
       const {
         densityClasses
       } = useDensity(props);
-      useRender(() => {
-        const tableContentDefaults = {
-          VCheckboxBtn: {
-            density: props.density
+      useRender(() => vue.createVNode(props.tag, {
+        "class": vue.normalizeClass(['v-table', {
+          'v-table--fixed-height': !!props.height,
+          'v-table--fixed-header': props.fixedHeader,
+          'v-table--fixed-footer': props.fixedFooter,
+          'v-table--has-top': !!slots.top,
+          'v-table--has-bottom': !!slots.bottom,
+          'v-table--hover': props.hover,
+          'v-table--striped-even': props.striped === 'even',
+          'v-table--striped-odd': props.striped === 'odd'
+        }, themeClasses.value, densityClasses.value, props.class]),
+        "style": vue.normalizeStyle(props.style)
+      }, {
+        default: () => [slots.top?.(), slots.default ? vue.createElementVNode("div", {
+          "class": "v-table__wrapper",
+          "style": {
+            height: convertToUnit(props.height)
           }
-        };
-        return vue.createVNode(props.tag, {
-          "class": vue.normalizeClass(['v-table', {
-            'v-table--fixed-height': !!props.height,
-            'v-table--fixed-header': props.fixedHeader,
-            'v-table--fixed-footer': props.fixedFooter,
-            'v-table--has-top': !!slots.top,
-            'v-table--has-bottom': !!slots.bottom,
-            'v-table--hover': props.hover,
-            'v-table--striped-even': props.striped === 'even',
-            'v-table--striped-odd': props.striped === 'odd'
-          }, themeClasses.value, densityClasses.value, props.class]),
-          "style": vue.normalizeStyle(props.style)
-        }, {
-          default: () => [slots.top?.(), vue.createVNode(VDefaultsProvider, {
-            "defaults": tableContentDefaults
-          }, {
-            default: () => [slots.default ? vue.createElementVNode("div", {
-              "class": "v-table__wrapper",
-              "style": {
-                height: convertToUnit(props.height)
-              }
-            }, [vue.createElementVNode("table", null, [slots.default()])]) : slots.wrapper?.()]
-          }), slots.bottom?.()]
-        });
-      });
+        }, [vue.createElementVNode("table", null, [slots.default()])]) : slots.wrapper?.(), slots.bottom?.()]
+      }));
       return {};
     }
   });
@@ -24110,7 +24184,7 @@
       function isAllowedInRange(start, end) {
         const allowedDates = props.allowedDates;
         if (typeof allowedDates !== 'function') return true;
-        const days = adapter.getDiff(end, start, 'days');
+        const days = 1 + adapter.getDiff(new Date(`${adapter.toISO(end)}T00:00:00Z`), new Date(`${adapter.toISO(start)}T00:00:00Z`), 'days');
         for (let i = 0; i < days; i++) {
           if (allowedDates(adapter.addDays(start, i))) return true;
         }
@@ -26613,7 +26687,7 @@
       const model = useProxiedModel(props, 'modelValue', null, val => val ?? null, val => val == null ? val ?? null : clamp(Number(val), props.min, props.max));
       const _inputText = vue.shallowRef(null);
       vue.watchEffect(() => {
-        if (isFocused.value && !controlsDisabled.value && Number(_inputText.value) === model.value) ; else if (model.value == null) {
+        if (isFocused.value && !controlsDisabled.value && Number(_inputText.value?.replace(decimalSeparator.value, '.')) === model.value) ; else if (model.value == null) {
           _inputText.value = null;
         } else if (!isNaN(model.value)) {
           _inputText.value = correctPrecision(model.value);
@@ -26708,6 +26782,7 @@
         if (!new RegExp(`^-?\\d*${escapeForRegex(decimalSeparator.value)}?\\d*$`).test(potentialNewInputVal)) {
           e.preventDefault();
           inputElement.value = potentialNewNumber;
+          vue.nextTick(() => inputText.value = potentialNewNumber);
         }
         if (props.precision == null) return;
 
@@ -26715,13 +26790,15 @@
         if (potentialNewInputVal.split(decimalSeparator.value)[1]?.length > props.precision) {
           e.preventDefault();
           inputElement.value = potentialNewNumber;
+          vue.nextTick(() => inputText.value = potentialNewNumber);
           const cursorPosition = (selectionStart ?? 0) + e.data.length;
           inputElement.setSelectionRange(cursorPosition, cursorPosition);
         }
         // Ignore decimal separator when precision = 0
-        if (props.precision === 0 && potentialNewInputVal.includes(decimalSeparator.value)) {
+        if (props.precision === 0 && potentialNewInputVal.endsWith(decimalSeparator.value)) {
           e.preventDefault();
           inputElement.value = potentialNewNumber;
+          vue.nextTick(() => inputText.value = potentialNewNumber);
         }
       }
       async function onKeydown(e) {
@@ -27917,12 +27994,12 @@
           ariaLabel: t(props.loadingText),
           role: 'alert'
         };
-        return vue.createElementVNode(vue.Fragment, null, [isLoading ? vue.createElementVNode("div", vue.mergeProps({
+        return isLoading ? vue.createElementVNode("div", vue.mergeProps({
           "class": ['v-skeleton-loader', {
             'v-skeleton-loader--boilerplate': props.boilerplate
           }, themeClasses.value, backgroundColorClasses.value, elevationClasses.value],
           "style": [backgroundColorStyles.value, dimensionStyles.value]
-        }, loadingProps, attrs), [items.value]) : slots.default?.()]);
+        }, loadingProps, attrs), [items.value]) : vue.createElementVNode(vue.Fragment, null, [slots.default?.()]);
       });
       return {};
     }
@@ -29787,6 +29864,10 @@
       const vFieldRef = vue.ref();
       const controlHeight = vue.shallowRef('');
       const textareaRef = vue.ref();
+      const scrollbarWidth = vue.ref(0);
+      const {
+        platform
+      } = useDisplay();
       const autocomplete = useAutocomplete(props);
       const isActive = vue.computed(() => props.persistentPlaceholder || isFocused.value || props.active);
       function onFocus() {
@@ -29831,6 +29912,18 @@
         if (!props.autoGrow) rows.value = Number(props.rows);
       });
       function calculateInputHeight() {
+        vue.nextTick(() => {
+          if (!textareaRef.value) return;
+          if (platform.value.firefox) {
+            scrollbarWidth.value = 12;
+            return;
+          }
+          const {
+            offsetWidth,
+            clientWidth
+          } = textareaRef.value;
+          scrollbarWidth.value = Math.max(0, offsetWidth - clientWidth);
+        });
         if (!props.autoGrow) return;
         vue.nextTick(() => {
           if (!sizerRef.value || !vFieldRef.value) return;
@@ -29891,7 +29984,9 @@
             'v-textarea--no-resize': props.noResize || props.autoGrow,
             'v-input--plain-underlined': isPlainOrUnderlined.value
           }, props.class],
-          "style": props.style
+          "style": [{
+            '--v-textarea-scroll-bar-width': convertToUnit(scrollbarWidth.value)
+          }, props.style]
         }, rootAttrs, inputProps, {
           "centerAffix": rows.value === 1 && !isPlainOrUnderlined.value,
           "focused": isFocused.value
@@ -34319,7 +34414,7 @@
     ...makeFocusProps(),
     ...makeVConfirmEditProps(),
     ...makeVTextFieldProps(),
-    ...omit(makeVColorPickerProps(), ['width'])
+    ...omit(makeVColorPickerProps(), ['location', 'height', 'minHeight', 'maxHeight'])
   }, 'VColorInput');
   const VColorInput = genericComponent()({
     name: 'VColorInput',
@@ -34358,7 +34453,7 @@
       }
       useRender(() => {
         const confirmEditProps = VConfirmEdit.filterProps(props);
-        const colorPickerProps = VColorPicker.filterProps(omit(props, ['active', 'color']));
+        const colorPickerProps = VColorPicker.filterProps(omit(props, ['active', 'bgColor', 'color', 'rounded', 'maxWidth', 'minWidth', 'width']));
         const textFieldProps = VTextField.filterProps(props);
         const slotWithPip = props.hidePip ? undefined : {
           [props.pipLocation]: arg => vue.createElementVNode(vue.Fragment, null, [vue.createVNode(VAvatar, {
@@ -34576,7 +34671,7 @@
     ...omit(makeVDatePickerProps({
       hideHeader: true,
       showAdjacentMonths: true
-    }), ['active', 'location', 'rounded'])
+    }), ['active', 'location', 'rounded', 'height', 'minHeight', 'maxHeight'])
   }, 'VDateInput');
   const VDateInput = genericComponent()({
     name: 'VDateInput',
@@ -34607,6 +34702,15 @@
       const {
         mobile
       } = useDisplay(props);
+      const clamp = date => {
+        if (props.max && adapter.isAfter(date, props.max)) {
+          return props.max;
+        }
+        if (props.min && adapter.isBefore(date, props.min)) {
+          return props.min;
+        }
+        return date;
+      };
       const emptyModelValue = () => props.multiple ? [] : null;
       const model = useProxiedModel(props, 'modelValue', emptyModelValue(), val => Array.isArray(val) ? val.map(item => adapter.toJsDate(item)) : val ? adapter.toJsDate(val) : val, val => Array.isArray(val) ? val.map(item => adapter.date(item)) : val ? adapter.date(val) : val);
       const menu = useProxiedModel(props, 'menu');
@@ -34657,7 +34761,7 @@
         if (!menu.value || !isFocused.value) {
           menu.value = true;
         }
-        if (props.updateOn.includes('enter')) {
+        if (props.updateOn.includes('enter') && !props.readonly) {
           onUserInput(e.target);
         }
       }
@@ -34684,7 +34788,7 @@
         model.value = emptyModelValue();
       }
       function onBlur(e) {
-        if (props.updateOn.includes('blur')) {
+        if (props.updateOn.includes('blur') && !props.readonly) {
           onUserInput(e.target);
         }
 
@@ -34702,23 +34806,23 @@
           model.value = emptyModelValue();
         } else if (!props.multiple) {
           if (isValid(value)) {
-            model.value = parseDate(value);
+            model.value = clamp(parseDate(value));
           }
         } else {
           const parts = value.trim().split(/\D+-\D+|[^\d\-/.]+/);
           if (parts.every(isValid)) {
             if (props.multiple === 'range') {
-              const [start, stop] = parts.map(parseDate).toSorted((a, b) => adapter.isAfter(a, b) ? 1 : -1);
+              const [start, stop] = parts.map(parseDate).map(clamp).toSorted((a, b) => adapter.isAfter(a, b) ? 1 : -1);
               model.value = createDateRange(adapter, start, stop);
             } else {
-              model.value = parts.map(parseDate);
+              model.value = parts.map(parseDate).map(clamp);
             }
           }
         }
       }
       useRender(() => {
         const confirmEditProps = VConfirmEdit.filterProps(props);
-        const datePickerProps = VDatePicker.filterProps(omit(props, ['active', 'location', 'rounded']));
+        const datePickerProps = VDatePicker.filterProps(omit(props, ['active', 'bgColor', 'color', 'location', 'rounded', 'maxWidth', 'minWidth', 'width']));
         const datePickerSlots = pick(slots, ['title', 'header', 'day', 'month', 'year']);
         const textFieldProps = VTextField.filterProps(omit(props, ['placeholder']));
         return vue.createVNode(VTextField, vue.mergeProps({
@@ -35163,7 +35267,7 @@
       // Always display masked value in input when mask is applied
       val => props.mask ? mask.mask(mask.unmask(val)) : val, val => {
         if (props.mask) {
-          const valueWithoutDelimiters = removeMaskDelimiters(val);
+          const valueWithoutDelimiters = val ? removeMaskDelimiters(val) : '';
 
           // E.g. mask is #-# and the input value is '2-23'
           // model-value should be enforced to '2-2'
@@ -37909,7 +38013,7 @@
       };
     });
   }
-  const version$1 = "3.10.4";
+  const version$1 = "3.10.6";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -38207,7 +38311,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.10.4";
+  const version = "3.10.6";
 
   /* eslint-disable local-rules/sort-imports */