@vuetify/nightly 3.6.3-master.2024-05-06 → 3.6.4-master.2024-05-08

package/dist/vuetify-labs.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.6.3-master.2024-05-06
+* Vuetify v3.6.4-master.2024-05-08
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, isVNode, Comment, shallowRef, readonly, unref, warn, ref, provide, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, watch, nextTick, onDeactivated, onActivated, onScopeDispose, effectScope, toRaw, createVNode, Suspense, TransitionGroup, Transition, mergeProps, isRef, toRef, onBeforeMount, withDirectives, resolveDirective, vShow, onMounted, onUpdated, Text, resolveDynamicComponent, markRaw, Teleport, cloneVNode, createTextVNode, onUnmounted, onBeforeUpdate, withModifiers, toDisplayString, vModelText, resolveComponent, render } from 'vue';
+import { shallowRef, Fragment, reactive, computed, watchEffect, toRefs, capitalize, isVNode, Comment, readonly, unref, warn, ref, provide, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, watch, nextTick, onDeactivated, onActivated, onScopeDispose, effectScope, toRaw, createVNode, Suspense, TransitionGroup, Transition, mergeProps, isRef, toRef, onBeforeMount, withDirectives, resolveDirective, vShow, onMounted, onUpdated, Text, resolveDynamicComponent, markRaw, Teleport, cloneVNode, createTextVNode, onUnmounted, onBeforeUpdate, withModifiers, toDisplayString, vModelText, resolveComponent, render } from 'vue';
 
 // Types
 // eslint-disable-line vue/prefer-import-from-vue
@@ -70,7 +70,7 @@ function propsFactory(props, source) {
 
 // Composables
 const makeComponentProps = propsFactory({
-  class: [String, Array],
+  class: [String, Array, Object],
   style: {
     type: [String, Array, Object],
     default: null
@@ -557,6 +557,22 @@ function isClickInsideElement(event, targetDiv) {
   const divBottom = divRect.bottom;
   return mouseX >= divLeft && mouseX <= divRight && mouseY >= divTop && mouseY <= divBottom;
 }
+function templateRef() {
+  const el = shallowRef();
+  const fn = target => {
+    el.value = target;
+  };
+  Object.defineProperty(fn, 'value', {
+    enumerable: true,
+    get: () => el.value,
+    set: val => el.value = val
+  });
+  Object.defineProperty(fn, 'el', {
+    enumerable: true,
+    get: () => refElement(el.value)
+  });
+  return fn;
+}
 
 // Utilities
 const block = ['top', 'bottom'];
@@ -1565,7 +1581,7 @@ function useRender(render) {
 
 function useResizeObserver(callback) {
   let box = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'content';
-  const resizeRef = ref();
+  const resizeRef = templateRef();
   const contentRect = ref();
   if (IN_BROWSER) {
     const observer = new ResizeObserver(entries => {
@@ -1580,12 +1596,12 @@ function useResizeObserver(callback) {
     onBeforeUnmount(() => {
       observer.disconnect();
     });
-    watch(resizeRef, (newValue, oldValue) => {
+    watch(() => resizeRef.el, (newValue, oldValue) => {
       if (oldValue) {
-        observer.unobserve(refElement(oldValue));
+        observer.unobserve(oldValue);
         contentRect.value = undefined;
       }
-      if (newValue) observer.observe(refElement(newValue));
+      if (newValue) observer.observe(newValue);
     }, {
       flush: 'post'
     });
@@ -3001,7 +3017,7 @@ function useAspectStyles(props) {
 }
 const makeVResponsiveProps = propsFactory({
   aspectRatio: [String, Number],
-  contentClass: String,
+  contentClass: null,
   inline: Boolean,
   ...makeComponentProps(),
   ...makeDimensionProps()
@@ -7384,7 +7400,7 @@ const VSlideGroup = genericComponent()({
     const goTo = useGoTo();
     const goToOptions = computed(() => {
       return {
-        container: containerRef.value,
+        container: containerRef.el,
         duration: 200,
         easing: 'easeOutQuart'
       };
@@ -7408,9 +7424,9 @@ const VSlideGroup = genericComponent()({
             contentSize.value = contentRect.value[sizeProperty];
             isOverflowing.value = containerSize.value + 1 < contentSize.value;
           }
-          if (firstSelectedIndex.value >= 0 && contentRef.value) {
+          if (firstSelectedIndex.value >= 0 && contentRef.el) {
             // TODO: Is this too naive? Should we store element references in group composable?
-            const selectedElement = contentRef.value.children[lastSelectedIndex.value];
+            const selectedElement = contentRef.el.children[lastSelectedIndex.value];
             scrollToChildren(selectedElement, props.centerActive);
           }
         });
@@ -7421,13 +7437,13 @@ const VSlideGroup = genericComponent()({
       let target = 0;
       if (center) {
         target = calculateCenteredTarget({
-          containerElement: containerRef.value,
+          containerElement: containerRef.el,
           isHorizontal: isHorizontal.value,
           selectedElement: children
         });
       } else {
         target = calculateUpdatedTarget({
-          containerElement: containerRef.value,
+          containerElement: containerRef.el,
           isHorizontal: isHorizontal.value,
           isRtl: isRtl.value,
           selectedElement: children
@@ -7436,18 +7452,18 @@ const VSlideGroup = genericComponent()({
       scrollToPosition(target);
     }
     function scrollToPosition(newPosition) {
-      if (!IN_BROWSER || !containerRef.value) return;
-      const offsetSize = getOffsetSize(isHorizontal.value, containerRef.value);
-      const scrollPosition = getScrollPosition(isHorizontal.value, isRtl.value, containerRef.value);
-      const scrollSize = getScrollSize(isHorizontal.value, containerRef.value);
+      if (!IN_BROWSER || !containerRef.el) return;
+      const offsetSize = getOffsetSize(isHorizontal.value, containerRef.el);
+      const scrollPosition = getScrollPosition(isHorizontal.value, isRtl.value, containerRef.el);
+      const scrollSize = getScrollSize(isHorizontal.value, containerRef.el);
       if (scrollSize <= offsetSize ||
       // Prevent scrolling by only a couple of pixels, which doesn't look smooth
       Math.abs(newPosition - scrollPosition) < 16) return;
-      if (isHorizontal.value && isRtl.value && containerRef.value) {
+      if (isHorizontal.value && isRtl.value && containerRef.el) {
         const {
           scrollWidth,
           offsetWidth: containerWidth
-        } = containerRef.value;
+        } = containerRef.el;
         newPosition = scrollWidth - containerWidth - newPosition;
       }
       if (isHorizontal.value) {
@@ -7465,12 +7481,12 @@ const VSlideGroup = genericComponent()({
     }
     function onFocusin(e) {
       isFocused.value = true;
-      if (!isOverflowing.value || !contentRef.value) return;
+      if (!isOverflowing.value || !contentRef.el) return;
 
       // Focused element is likely to be the root of an item, so a
       // breadth-first search will probably find it in the first iteration
       for (const el of e.composedPath()) {
-        for (const item of contentRef.value.children) {
+        for (const item of contentRef.el.children) {
           if (item === el) {
             scrollToChildren(item);
             return;
@@ -7485,14 +7501,14 @@ const VSlideGroup = genericComponent()({
     // Affix clicks produce onFocus that we have to ignore to avoid extra scrollToChildren
     let ignoreFocusEvent = false;
     function onFocus(e) {
-      if (!ignoreFocusEvent && !isFocused.value && !(e.relatedTarget && contentRef.value?.contains(e.relatedTarget))) focus();
+      if (!ignoreFocusEvent && !isFocused.value && !(e.relatedTarget && contentRef.el?.contains(e.relatedTarget))) focus();
       ignoreFocusEvent = false;
     }
     function onFocusAffixes() {
       ignoreFocusEvent = true;
     }
     function onKeydown(e) {
-      if (!contentRef.value) return;
+      if (!contentRef.el) return;
       function toFocus(location) {
         e.preventDefault();
         focus(location);
@@ -7517,21 +7533,21 @@ const VSlideGroup = genericComponent()({
       }
     }
     function focus(location) {
-      if (!contentRef.value) return;
+      if (!contentRef.el) return;
       let el;
       if (!location) {
-        const focusable = focusableChildren(contentRef.value);
+        const focusable = focusableChildren(contentRef.el);
         el = focusable[0];
       } else if (location === 'next') {
-        el = contentRef.value.querySelector(':focus')?.nextElementSibling;
+        el = contentRef.el.querySelector(':focus')?.nextElementSibling;
         if (!el) return focus('first');
       } else if (location === 'prev') {
-        el = contentRef.value.querySelector(':focus')?.previousElementSibling;
+        el = contentRef.el.querySelector(':focus')?.previousElementSibling;
         if (!el) return focus('last');
       } else if (location === 'first') {
-        el = contentRef.value.firstElementChild;
+        el = contentRef.el.firstElementChild;
       } else if (location === 'last') {
-        el = contentRef.value.lastElementChild;
+        el = contentRef.el.lastElementChild;
       }
       if (el) {
         el.focus({
@@ -7545,11 +7561,11 @@ const VSlideGroup = genericComponent()({
       let newPosition = scrollOffset.value + offsetStep;
 
       // TODO: improve it
-      if (isHorizontal.value && isRtl.value && containerRef.value) {
+      if (isHorizontal.value && isRtl.value && containerRef.el) {
         const {
           scrollWidth,
           offsetWidth: containerWidth
-        } = containerRef.value;
+        } = containerRef.el;
         newPosition += scrollWidth - containerWidth;
       }
       scrollToPosition(newPosition);
@@ -7592,8 +7608,8 @@ const VSlideGroup = genericComponent()({
     });
     const hasNext = computed(() => {
       if (!containerRef.value) return false;
-      const scrollSize = getScrollSize(isHorizontal.value, containerRef.value);
-      const clientSize = getClientSize(isHorizontal.value, containerRef.value);
+      const scrollSize = getScrollSize(isHorizontal.value, containerRef.el);
+      const clientSize = getClientSize(isHorizontal.value, containerRef.el);
       const scrollSizeMax = scrollSize - clientSize;
 
       // 1 pixel in reserve, may be lost after rounding
@@ -8017,14 +8033,16 @@ const independentActiveStrategy = mandatory => {
     },
     in: (v, children, parents) => {
       let set = new Set();
-      for (const id of v || []) {
-        set = strategy.activate({
-          id,
-          value: true,
-          activated: new Set(set),
-          children,
-          parents
-        });
+      if (v != null) {
+        for (const id of wrapInArray(v)) {
+          set = strategy.activate({
+            id,
+            value: true,
+            activated: new Set(set),
+            children,
+            parents
+          });
+        }
       }
       return set;
     },
@@ -8053,8 +8071,11 @@ const independentSingleActiveStrategy = mandatory => {
     },
     in: (v, children, parents) => {
       let set = new Set();
-      if (v?.length) {
-        set = parentStrategy.in(v.slice(0, 1), children, parents);
+      if (v != null) {
+        const arr = wrapInArray(v);
+        if (arr.length) {
+          set = parentStrategy.in(arr.slice(0, 1), children, parents);
+        }
       }
       return set;
     },
@@ -8398,12 +8419,12 @@ const emptyNested = {
 const makeNestedProps = propsFactory({
   activatable: Boolean,
   selectable: Boolean,
-  activeStrategy: [String, Function],
-  selectStrategy: [String, Function],
+  activeStrategy: [String, Function, Object],
+  selectStrategy: [String, Function, Object],
   openStrategy: [String, Object],
-  opened: Array,
-  activated: Array,
-  selected: Array,
+  opened: null,
+  activated: null,
+  selected: null,
   mandatory: Boolean
 }, 'nested');
 const useNested = props => {
@@ -8413,6 +8434,7 @@ const useNested = props => {
   const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(v), v => [...v.values()]);
   const activeStrategy = computed(() => {
     if (typeof props.activeStrategy === 'object') return props.activeStrategy;
+    if (typeof props.activeStrategy === 'function') return props.activeStrategy(props.mandatory);
     switch (props.activeStrategy) {
       case 'leaf':
         return leafActiveStrategy(props.mandatory);
@@ -8427,6 +8449,7 @@ const useNested = props => {
   });
   const selectStrategy = computed(() => {
     if (typeof props.selectStrategy === 'object') return props.selectStrategy;
+    if (typeof props.selectStrategy === 'function') return props.selectStrategy(props.mandatory);
     switch (props.selectStrategy) {
       case 'single-leaf':
         return leafSingleSelectStrategy(props.mandatory);
@@ -8755,7 +8778,7 @@ const makeVListItemProps = propsFactory({
   appendIcon: IconValue,
   baseColor: String,
   disabled: Boolean,
-  lines: String,
+  lines: [Boolean, String],
   link: {
     type: Boolean,
     default: undefined
@@ -8866,8 +8889,9 @@ const VListItem = genericComponent()({
     }));
     function onClick(e) {
       emit('click', e);
-      if (isGroupActivator || !isClickable.value) return;
+      if (!isClickable.value) return;
       link.navigate?.(e);
+      if (isGroupActivator) return;
       if (root.activatable.value) {
         activate(!isActivated.value, e);
       } else if (root.selectable.value) {
@@ -10326,17 +10350,17 @@ function useActivator(props, _ref) {
   }, {
     flush: 'post'
   });
-  const activatorRef = ref();
+  const activatorRef = templateRef();
   watchEffect(() => {
     if (!activatorRef.value) return;
     nextTick(() => {
-      activatorEl.value = refElement(activatorRef.value);
+      activatorEl.value = activatorRef.el;
     });
   });
-  const targetRef = ref();
+  const targetRef = templateRef();
   const target = computed(() => {
     if (props.target === 'cursor' && cursorTarget.value) return cursorTarget.value;
-    if (targetRef.value) return refElement(targetRef.value);
+    if (targetRef.value) return targetRef.el;
     return getTarget(props.target, vm) || activatorEl.value;
   });
   const targetEl = computed(() => {
@@ -10681,10 +10705,7 @@ const makeVOverlayProps = propsFactory({
   disabled: Boolean,
   opacity: [Number, String],
   noClickAnimation: Boolean,
-  modelValue: {
-    type: Boolean,
-    default: null
-  },
+  modelValue: Boolean,
   persistent: Boolean,
   scrim: {
     type: [Boolean, String],
@@ -10727,7 +10748,7 @@ const VOverlay = genericComponent()({
     } = _ref;
     const model = useProxiedModel(props, 'modelValue');
     const isActive = computed({
-      get: () => Boolean(model.value),
+      get: () => model.value,
       set: v => {
         if (!(v && props.disabled)) model.value = v;
       }
@@ -12964,7 +12985,7 @@ const VAutocomplete = genericComponent()({
           select(displayItems.value[0]);
         }
         menu.value = false;
-        search.value = '';
+        if (props.multiple || hasSelectionSlot.value) search.value = '';
         selectionIndex.value = -1;
       }
     });
@@ -14808,7 +14829,7 @@ const VColorPickerCanvas = defineComponent({
     const {
       resizeRef
     } = useResizeObserver(entries => {
-      if (!resizeRef.value?.offsetParent) return;
+      if (!resizeRef.el?.offsetParent) return;
       const {
         width,
         height
@@ -18431,6 +18452,7 @@ function provideSelection(props, _ref9) {
     });
     return !!items.length && isSelected(items);
   });
+  const showSelectAll = computed(() => selectStrategy.value.showSelectAll);
   const data = {
     toggleSelect,
     select,
@@ -18439,7 +18461,7 @@ function provideSelection(props, _ref9) {
     isSomeSelected,
     someSelected,
     allSelected,
-    showSelectAll: selectStrategy.value.showSelectAll
+    showSelectAll
   };
   provide(VDataTableSelectionSymbol, data);
   return data;
@@ -19710,7 +19732,7 @@ const VDataTableHeaders = genericComponent()({
           };
           if (slots[columnSlotName]) return slots[columnSlotName](columnSlotProps);
           if (column.key === 'data-table-select') {
-            return slots['header.data-table-select']?.(columnSlotProps) ?? (showSelectAll && createVNode(VCheckboxBtn, {
+            return slots['header.data-table-select']?.(columnSlotProps) ?? (showSelectAll.value && createVNode(VCheckboxBtn, {
               "modelValue": allSelected.value,
               "indeterminate": someSelected.value && !allSelected.value,
               "onUpdate:modelValue": selectAll
@@ -21679,10 +21701,10 @@ const VDatePickerYears = genericComponent()({
     watchEffect(() => {
       model.value = model.value ?? adapter.getYear(adapter.date());
     });
-    const yearRef = ref();
+    const yearRef = templateRef();
     onMounted(async () => {
       await nextTick();
-      yearRef.value?.$el.scrollIntoView({
+      yearRef.el?.scrollIntoView({
         block: 'center'
       });
     });
@@ -22559,7 +22581,7 @@ const VFileInput = genericComponent()({
     const {
       t
     } = useLocale();
-    const model = useProxiedModel(props, 'modelValue', props.modelValue, val => wrapInArray(val), val => props.multiple || Array.isArray(props.modelValue) ? val : val[0]);
+    const model = useProxiedModel(props, 'modelValue', props.modelValue, val => wrapInArray(val), val => props.multiple || Array.isArray(props.modelValue) ? val : val[0] ?? null);
     const {
       isFocused,
       focus,
@@ -23008,7 +23030,7 @@ const VInfiniteScroll = genericComponent()({
     function intersecting(side) {
       if (props.mode !== 'manual' && !isIntersecting.value) return;
       const status = getStatus(side);
-      if (!rootEl.value || status === 'loading') return;
+      if (!rootEl.value || ['empty', 'loading'].includes(status)) return;
       previousScrollSize = getScrollSize();
       setStatus(side, 'loading');
       function done(status) {
@@ -25903,7 +25925,8 @@ const VStepperWindow = genericComponent()({
       }, windowProps, {
         "modelValue": model.value,
         "onUpdate:modelValue": $event => model.value = $event,
-        "class": "v-stepper-window",
+        "class": ['v-stepper-window', props.class],
+        "style": props.style,
         "mandatory": false,
         "touch": false
       }), slots);
@@ -25927,7 +25950,8 @@ const VStepperWindowItem = genericComponent()({
       return createVNode(VWindowItem, mergeProps({
         "_as": "VStepperWindowItem"
       }, windowItemProps, {
-        "class": "v-stepper-window-item"
+        "class": ['v-stepper-window-item', props.class],
+        "style": props.style
       }), slots);
     });
     return {};
@@ -26426,7 +26450,8 @@ const VTabsWindow = genericComponent()({
       }, windowProps, {
         "modelValue": model.value,
         "onUpdate:modelValue": $event => model.value = $event,
-        "class": "v-tabs-window",
+        "class": ['v-tabs-window', props.class],
+        "style": props.style,
         "mandatory": false,
         "touch": false
       }), slots);
@@ -27844,19 +27869,13 @@ const makeVNumberInputProps = propsFactory({
     type: Number,
     default: 1
   },
-  ...only(makeVInputProps(), ['density', 'disabled', 'focused', 'hideDetails', 'hint', 'label', 'persistentHint', 'readonly']),
-  ...only(makeVFieldProps(), ['baseColor', 'bgColor', 'class', 'color', 'disabled', 'error', 'loading', 'reverse', 'rounded', 'style', 'theme', 'variant']),
-  ...makeFocusProps()
+  ...omit(makeVTextFieldProps(), ['appendInnerIcon', 'prependInnerIcon'])
 }, 'VNumberInput');
 const VNumberInput = genericComponent()({
   name: 'VNumberInput',
   inheritAttrs: false,
   props: {
-    ...makeVNumberInputProps(),
-    modelValue: {
-      type: Number,
-      default: undefined
-    }
+    ...makeVNumberInputProps()
   },
   emits: {
     'update:modelValue': val => true
@@ -27868,12 +27887,6 @@ const VNumberInput = genericComponent()({
       slots
     } = _ref;
     const model = useProxiedModel(props, 'modelValue');
-    const {
-      isFocused,
-      focus,
-      blur
-    } = useFocus(props);
-    const inputRef = ref();
     const stepDecimals = computed(() => getDecimals(props.step));
     const modelDecimals = computed(() => model.value != null ? getDecimals(model.value) : 0);
     const canIncrease = computed(() => {
@@ -27889,9 +27902,6 @@ const VNumberInput = genericComponent()({
         model.value = clamp(model.value, props.min, props.max);
       }
     });
-    function onFocus() {
-      if (!isFocused.value) focus();
-    }
     const controlVariant = computed(() => {
       return props.hideInput ? 'stacked' : props.controlVariant;
     });
@@ -27921,7 +27931,7 @@ const VNumberInput = genericComponent()({
       toggleUpDown(false);
     }
     function onKeydown(e) {
-      if (['Enter', 'ArrowLeft', 'ArrowRight', 'Backspace'].includes(e.key) || e.ctrlKey) return;
+      if (['Enter', 'ArrowLeft', 'ArrowRight', 'Backspace', 'Tab'].includes(e.key) || e.ctrlKey) return;
       if (['ArrowDown'].includes(e.key)) {
         e.preventDefault();
         toggleUpDown(false);
@@ -27938,17 +27948,14 @@ const VNumberInput = genericComponent()({
         e.preventDefault();
       }
     }
-    function onInput(e) {
-      const el = e.target;
-      model.value = el.value ? +el.value : undefined;
+    function onModelUpdate(v) {
+      model.value = v ? +v : undefined;
     }
     useRender(() => {
-      const fieldProps = filterFieldProps(props);
-      const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
       const {
         modelValue: _,
-        ...inputProps
-      } = VInput.filterProps(props);
+        ...textFieldProps
+      } = VTextField.filterProps(props);
       function controlNode() {
         const defaultHeight = controlVariant.value === 'stacked' ? 'auto' : '100%';
         return createVNode("div", {
@@ -27961,6 +27968,7 @@ const VNumberInput = genericComponent()({
           "name": "decrement-btn",
           "icon": "$expand",
           "size": "small",
+          "tabindex": "-1",
           "onClick": onClickDown
         }, null) : createVNode(VDefaultsProvider, {
           "key": "decrement-defaults",
@@ -27985,7 +27993,8 @@ const VNumberInput = genericComponent()({
           "name": "increment-btn",
           "icon": "$collapse",
           "onClick": onClickUp,
-          "size": "small"
+          "size": "small",
+          "tabindex": "-1"
         }, null) : createVNode(VDefaultsProvider, {
           "key": "increment-defaults",
           "defaults": {
@@ -28006,7 +28015,36 @@ const VNumberInput = genericComponent()({
           "vertical": true
         }, null) : undefined;
       }
-      return createVNode(VInput, mergeProps({
+      const appendInnerControl = controlVariant.value === 'split' ? createVNode("div", {
+        "class": "v-number-input__control"
+      }, [createVNode(VDivider, {
+        "vertical": true
+      }, null), createVNode(VBtn, {
+        "flat": true,
+        "height": "100%",
+        "icon": "$plus",
+        "tile": true,
+        "tabindex": "-1",
+        "onClick": onClickUp
+      }, null)]) : !props.reverse ? createVNode(Fragment, null, [dividerNode(), controlNode()]) : undefined;
+      const hasAppendInner = slots['append-inner'] || appendInnerControl;
+      const prependInnerControl = controlVariant.value === 'split' ? createVNode("div", {
+        "class": "v-number-input__control"
+      }, [createVNode(VBtn, {
+        "flat": true,
+        "height": "100%",
+        "icon": "$minus",
+        "tile": true,
+        "tabindex": "-1",
+        "onClick": onClickDown
+      }, null), createVNode(VDivider, {
+        "vertical": true
+      }, null)]) : props.reverse ? createVNode(Fragment, null, [controlNode(), dividerNode()]) : undefined;
+      const hasPrependInner = slots['prepend-inner'] || prependInnerControl;
+      return createVNode(VTextField, mergeProps({
+        "modelValue": model.value,
+        "onUpdate:modelValue": onModelUpdate,
+        "onKeydown": onKeydown,
         "class": ['v-number-input', {
           'v-number-input--default': controlVariant.value === 'default',
           'v-number-input--hide-input': props.hideInput,
@@ -28015,57 +28053,22 @@ const VNumberInput = genericComponent()({
           'v-number-input--split': controlVariant.value === 'split',
           'v-number-input--stacked': controlVariant.value === 'stacked'
         }, props.class]
-      }, rootAttrs, inputProps, {
-        "focused": isFocused.value,
+      }, textFieldProps, {
         "style": props.style
       }), {
         ...slots,
-        default: () => createVNode(VField, mergeProps(fieldProps, {
-          "active": true,
-          "focused": isFocused.value
-        }), {
-          ...slots,
-          default: _ref2 => {
-            let {
-              props: {
-                class: fieldClass,
-                ...slotProps
-              }
-            } = _ref2;
-            return createVNode("input", mergeProps({
-              "ref": inputRef,
-              "type": "text",
-              "value": model.value,
-              "onInput": onInput,
-              "onKeydown": onKeydown,
-              "class": fieldClass,
-              "onFocus": onFocus,
-              "onBlur": blur
-            }, inputAttrs), null);
-          },
-          'append-inner': controlVariant.value === 'split' ? () => createVNode("div", {
-            "class": "v-number-input__control"
-          }, [createVNode(VDivider, {
-            "vertical": true
-          }, null), createVNode(VBtn, {
-            "flat": true,
-            "height": "100%",
-            "icon": "$plus",
-            "tile": true,
-            "onClick": onClickUp
-          }, null)]) : !props.reverse ? () => createVNode(Fragment, null, [dividerNode(), controlNode()]) : undefined,
-          'prepend-inner': controlVariant.value === 'split' ? () => createVNode("div", {
-            "class": "v-number-input__control"
-          }, [createVNode(VBtn, {
-            "flat": true,
-            "height": "100%",
-            "icon": "$minus",
-            "tile": true,
-            "onClick": onClickDown
-          }, null), createVNode(VDivider, {
-            "vertical": true
-          }, null)]) : props.reverse ? () => createVNode(Fragment, null, [controlNode(), dividerNode()]) : undefined
-        })
+        'append-inner': hasAppendInner ? function () {
+          for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+            args[_key] = arguments[_key];
+          }
+          return createVNode(Fragment, null, [slots['append-inner']?.(...args), appendInnerControl]);
+        } : undefined,
+        'prepend-inner': hasPrependInner ? function () {
+          for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+            args[_key2] = arguments[_key2];
+          }
+          return createVNode(Fragment, null, [prependInnerControl, slots['prepend-inner']?.(...args)]);
+        } : undefined
       });
     });
   }
@@ -29768,7 +29771,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.6.3-master.2024-05-06";
+const version$1 = "3.6.4-master.2024-05-08";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -30021,7 +30024,7 @@ var index = /*#__PURE__*/Object.freeze({
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.6.3-master.2024-05-06";
+const version = "3.6.4-master.2024-05-08";
 
 /* eslint-disable local-rules/sort-imports */