vuetify 3.6.7 → 3.6.9

package/dist/vuetify.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.6.7
+* Vuetify v3.6.9
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-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, createVNode, mergeProps, onBeforeUnmount, watch, nextTick, onDeactivated, onActivated, onScopeDispose, effectScope, toRaw, Suspense, TransitionGroup, Transition, 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, getCurrentInstance as getCurrentInstance$1, ref, provide, inject as inject$1, defineComponent as defineComponent$1, camelize, h, createVNode, mergeProps, onBeforeUnmount, watch, nextTick, onDeactivated, onActivated, onScopeDispose, effectScope, toRaw, Suspense, TransitionGroup, Transition, isRef, toRef, onBeforeMount, withDirectives, resolveDirective, vShow, onMounted, onUpdated, Text, resolveDynamicComponent, markRaw, Teleport, cloneVNode, createTextVNode, onUnmounted, onBeforeUpdate, withModifiers, toDisplayString, vModelText, resolveComponent, render } from 'vue';
 
 const IN_BROWSER = typeof window !== 'undefined';
 const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
@@ -1251,6 +1251,53 @@ const makeComponentProps = propsFactory({
 
 // Types
 
+function getCurrentInstance(name, message) {
+  const vm = getCurrentInstance$1();
+  if (!vm) {
+    throw new Error(`[Vuetify] ${name} ${message || 'must be called from inside a setup function'}`);
+  }
+  return vm;
+}
+function getCurrentInstanceName() {
+  let name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'composables';
+  const vm = getCurrentInstance(name).type;
+  return toKebabCase(vm?.aliasName || vm?.name);
+}
+let _uid = 0;
+let _map = new WeakMap();
+function getUid() {
+  const vm = getCurrentInstance('getUid');
+  if (_map.has(vm)) return _map.get(vm);else {
+    const uid = _uid++;
+    _map.set(vm, uid);
+    return uid;
+  }
+}
+getUid.reset = () => {
+  _uid = 0;
+  _map = new WeakMap();
+};
+
+// Utilities
+
+// Types
+
+function injectSelf(key) {
+  let vm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstance('injectSelf');
+  const {
+    provides
+  } = vm;
+  if (provides && key in provides) {
+    // TS doesn't allow symbol as index type
+    return provides[key];
+  }
+  return undefined;
+}
+
+// Utilities
+
+// Types
+
 const DefaultsSymbol = Symbol.for('vuetify:defaults');
 function createDefaults(options) {
   return ref(options);
@@ -1476,37 +1523,6 @@ function getPrefixedEventHandlers(attrs, suffix, getData) {
   }, {});
 }
 
-// Utilities
-
-// Types
-
-function getCurrentInstance(name, message) {
-  const vm = getCurrentInstance$1();
-  if (!vm) {
-    throw new Error(`[Vuetify] ${name} ${message || 'must be called from inside a setup function'}`);
-  }
-  return vm;
-}
-function getCurrentInstanceName() {
-  let name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'composables';
-  const vm = getCurrentInstance(name).type;
-  return toKebabCase(vm?.aliasName || vm?.name);
-}
-let _uid = 0;
-let _map = new WeakMap();
-function getUid() {
-  const vm = getCurrentInstance('getUid');
-  if (_map.has(vm)) return _map.get(vm);else {
-    const uid = _uid++;
-    _map.set(vm, uid);
-    return uid;
-  }
-}
-getUid.reset = () => {
-  _uid = 0;
-  _map = new WeakMap();
-};
-
 function getScrollParent(el) {
   let includeHidden = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
   while (el) {
@@ -1536,22 +1552,6 @@ function isPotentiallyScrollable(el) {
   return ['scroll', 'auto'].includes(style.overflowY);
 }
 
-// Utilities
-
-// Types
-
-function injectSelf(key) {
-  let vm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : getCurrentInstance('injectSelf');
-  const {
-    provides
-  } = vm;
-  if (provides && key in provides) {
-    // TS doesn't allow symbol as index type
-    return provides[key];
-  }
-  return undefined;
-}
-
 function isFixedPosition(el) {
   while (el) {
     if (window.getComputedStyle(el).position === 'fixed') {
@@ -4196,6 +4196,7 @@ function useScroll(props) {
     canScroll
   } = args;
   let previousScroll = 0;
+  let previousScrollHeight = 0;
   const target = ref(null);
   const currentScroll = shallowRef(0);
   const savedScroll = shallowRef(0);
@@ -4218,6 +4219,11 @@ function useScroll(props) {
     if (!targetEl || canScroll && !canScroll.value) return;
     previousScroll = currentScroll.value;
     currentScroll.value = 'window' in targetEl ? targetEl.pageYOffset : targetEl.scrollTop;
+    const currentScrollHeight = targetEl instanceof Window ? document.documentElement.scrollHeight : targetEl.scrollHeight;
+    if (previousScrollHeight !== currentScrollHeight) {
+      previousScrollHeight = currentScrollHeight;
+      return;
+    }
     isScrollingUp.value = currentScroll.value < previousScroll;
     currentThreshold.value = Math.abs(currentScroll.value - scrollThreshold.value);
   };
@@ -6482,7 +6488,15 @@ const VSelectionControl = genericComponent()({
       e.stopPropagation();
     }
     function onInput(e) {
-      if (!isInteractive.value) return;
+      if (!isInteractive.value) {
+        if (input.value) {
+          // model value is not updated when input is not interactive
+          // but the internal checked state of the input is still updated,
+          // so here it's value is restored
+          input.value.checked = model.value;
+        }
+        return;
+      }
       if (props.readonly && group) {
         nextTick(() => group.forceUpdate());
       }
@@ -8935,6 +8949,7 @@ const VListGroup = genericComponent()({
       isBooted
     } = useSsrBoot();
     function onClick(e) {
+      e.stopPropagation();
       open(!isOpen.value, e);
     }
     const activatorProps = computed(() => ({
@@ -9268,6 +9283,8 @@ const VListItem = genericComponent()({
       }), [[resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
     return {
+      activate,
+      isActivated,
       isGroupActivator,
       isSelected,
       list,
@@ -9343,7 +9360,7 @@ const VDivider = genericComponent()({
     const dividerStyles = computed(() => {
       const styles = {};
       if (props.length) {
-        styles[props.vertical ? 'maxHeight' : 'maxWidth'] = convertToUnit(props.length);
+        styles[props.vertical ? 'height' : 'width'] = convertToUnit(props.length);
       }
       if (props.thickness) {
         styles[props.vertical ? 'borderRightWidth' : 'borderTopWidth'] = convertToUnit(props.thickness);
@@ -9604,6 +9621,9 @@ const makeVListProps = propsFactory({
   },
   slim: Boolean,
   nav: Boolean,
+  'onClick:open': EventProp(),
+  'onClick:select': EventProp(),
+  'onUpdate:opened': EventProp(),
   ...makeNestedProps({
     selectStrategy: 'single-leaf',
     openStrategy: 'list'
@@ -11007,9 +11027,6 @@ const VOverlay = genericComponent()({
         if (!(v && props.disabled)) model.value = v;
       }
     });
-    const {
-      teleportTarget
-    } = useTeleport(computed(() => props.attach || props.contained));
     const {
       themeClasses
     } = provideTheme(props);
@@ -11042,6 +11059,10 @@ const VOverlay = genericComponent()({
       isActive,
       isTop: localTop
     });
+    const potentialShadowDomRoot = computed(() => activatorEl?.value?.getRootNode());
+    const {
+      teleportTarget
+    } = useTeleport(computed(() => props.attach || props.contained || potentialShadowDomRoot.value instanceof ShadowRoot ? potentialShadowDomRoot.value : false));
     const {
       dimensionStyles
     } = useDimension(props);
@@ -11384,7 +11405,7 @@ const VMenu = genericComponent()({
     function onKeydown(e) {
       if (props.disabled) return;
       if (e.key === 'Tab' || e.key === 'Enter' && !props.closeOnContentClick) {
-        if (e.key === 'Enter' && e.target instanceof HTMLTextAreaElement) return;
+        if (e.key === 'Enter' && (e.target instanceof HTMLTextAreaElement || e.target instanceof HTMLInputElement && !!e.target.closest('form'))) return;
         if (e.key === 'Enter') e.preventDefault();
         const nextElement = getNextElement(focusableChildren(overlay.value?.contentEl, false), e.shiftKey ? 'prev' : 'next', el => el.tabIndex >= 0);
         if (!nextElement) {
@@ -12915,7 +12936,7 @@ function filterItems(items, query, options) {
     const customMatches = {};
     const defaultMatches = {};
     let match = -1;
-    if (query && !options?.noFilter) {
+    if ((query || customFiltersLength > 0) && !options?.noFilter) {
       if (typeof item === 'object') {
         const filterKeys = keys || Object.keys(transformed);
         for (const key of filterKeys) {
@@ -13128,7 +13149,12 @@ const VAutocomplete = genericComponent()({
       if (['Escape'].includes(e.key)) {
         menu.value = false;
       }
-      if (highlightFirst.value && e.key === 'Enter') {
+      if (highlightFirst.value && ['Enter', 'Tab'].includes(e.key) && !model.value.some(_ref2 => {
+        let {
+          value
+        } = _ref2;
+        return value === displayItems.value[0].value;
+      })) {
         select(displayItems.value[0]);
       }
       if (e.key === 'ArrowDown' && highlightFirst.value) {
@@ -13231,16 +13257,14 @@ const VAutocomplete = genericComponent()({
         isPristine.value = true;
         nextTick(() => isSelecting.value = false);
       } else {
-        if (!props.multiple && search.value == null) model.value = [];else if (highlightFirst.value && !listHasFocus.value && !model.value.some(_ref2 => {
-          let {
-            value
-          } = _ref2;
-          return value === displayItems.value[0].value;
-        })) {
-          select(displayItems.value[0]);
-        }
+        if (!props.multiple && search.value == null) model.value = [];
         menu.value = false;
-        if (props.multiple || hasSelectionSlot.value) search.value = '';
+        if (!model.value.some(_ref3 => {
+          let {
+            title
+          } = _ref3;
+          return title === search.value;
+        })) search.value = '';
         selectionIndex.value = -1;
       }
     });
@@ -13326,12 +13350,12 @@ const VAutocomplete = genericComponent()({
               "renderless": true,
               "items": displayItems.value
             }, {
-              default: _ref3 => {
+              default: _ref4 => {
                 let {
                   item,
                   index,
                   itemRef
-                } = _ref3;
+                } = _ref4;
                 const itemProps = mergeProps(item.props, {
                   ref: itemRef,
                   key: index,
@@ -13345,10 +13369,10 @@ const VAutocomplete = genericComponent()({
                 }) ?? createVNode(VListItem, mergeProps(itemProps, {
                   "role": "option"
                 }), {
-                  prepend: _ref4 => {
+                  prepend: _ref5 => {
                     let {
                       isSelected
-                    } = _ref4;
+                    } = _ref5;
                     return createVNode(Fragment, null, [props.multiple && !props.hideSelected ? createVNode(VCheckboxBtn, {
                       "key": item.value,
                       "modelValue": isSelected,
@@ -15756,6 +15780,7 @@ const makeVSliderThumbProps = propsFactory({
     type: [Boolean, Object],
     default: true
   },
+  name: String,
   ...makeComponentProps()
 }, 'VSliderThumb');
 const VSliderThumb = genericComponent()({
@@ -15852,6 +15877,7 @@ const VSliderThumb = genericComponent()({
         }, props.style],
         "role": "slider",
         "tabindex": disabled.value ? -1 : 0,
+        "aria-label": props.name,
         "aria-valuemin": props.min,
         "aria-valuemax": props.max,
         "aria-valuenow": props.modelValue,
@@ -16128,7 +16154,8 @@ const VSlider = genericComponent()({
             "elevation": props.elevation,
             "onFocus": focus,
             "onBlur": blur,
-            "ripple": props.ripple
+            "ripple": props.ripple,
+            "name": props.name
           }, {
             'thumb-label': slots['thumb-label']
           })]);
@@ -16995,8 +17022,13 @@ const VCombobox = genericComponent()({
       if (['Escape'].includes(e.key)) {
         menu.value = false;
       }
-      if (['Enter', 'Escape'].includes(e.key)) {
-        if (highlightFirst.value && e.key === 'Enter') {
+      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;
@@ -17091,15 +17123,6 @@ const VCombobox = genericComponent()({
       if (val || val === oldVal) return;
       selectionIndex.value = -1;
       menu.value = false;
-      if (highlightFirst.value && !listHasFocus.value && !model.value.some(_ref2 => {
-        let {
-          value
-        } = _ref2;
-        return value === displayItems.value[0].value;
-      })) {
-        select(displayItems.value[0]);
-        return;
-      }
       if (search.value) {
         if (props.multiple) {
           select(transformItem$3(props, search.value));
@@ -21753,6 +21776,9 @@ const VDatePickerMonth = genericComponent()({
     });
     function onRangeClick(value) {
       const _value = adapter.startOfDay(value);
+      if (model.value.length === 0) {
+        rangeStart.value = undefined;
+      }
       if (!rangeStart.value) {
         rangeStart.value = _value;
         model.value = [rangeStart.value];
@@ -22460,7 +22486,7 @@ const VEmptyState = genericComponent()({
         "defaults": {
           VBtn: {
             class: 'v-empty-state__action-btn',
-            color: props.color,
+            color: props.color ?? 'surface-variant',
             text: props.actionText
           }
         }
@@ -22478,6 +22504,10 @@ const VEmptyState = genericComponent()({
   }
 });
 
+// Types
+
+const VExpansionPanelSymbol = Symbol.for('vuetify:v-expansion-panel');
+
 const makeVExpansionPanelTextProps = propsFactory({
   ...makeComponentProps(),
   ...makeLazyProps()
@@ -22658,7 +22688,6 @@ const VExpansionPanel = genericComponent()({
 
 // Types
 
-const VExpansionPanelSymbol = Symbol.for('vuetify:v-expansion-panel');
 const allowedVariants = ['default', 'accordion', 'inset', 'popout'];
 const makeVExpansionPanelsProps = propsFactory({
   flat: Boolean,
@@ -22724,15 +22753,13 @@ const VExpansionPanels = genericComponent()({
   }
 });
 
+// Types
+
 const makeVFabProps = propsFactory({
   app: Boolean,
   appear: Boolean,
   extended: Boolean,
   layout: Boolean,
-  location: {
-    type: String,
-    default: 'bottom end'
-  },
   offset: Boolean,
   modelValue: {
     type: Boolean,
@@ -22742,6 +22769,7 @@ const makeVFabProps = propsFactory({
     active: true
   }), ['location']),
   ...makeLayoutItemProps(),
+  ...makeLocationProps(),
   ...makeTransitionProps({
     transition: 'fab-transition'
   })
@@ -22768,11 +22796,11 @@ const VFab = genericComponent()({
     const hasPosition = computed(() => props.app || props.absolute);
     const position = computed(() => {
       if (!hasPosition.value) return false;
-      return props.location.split(' ').shift();
+      return props.location?.split(' ').shift() ?? 'bottom';
     });
     const orientation = computed(() => {
       if (!hasPosition.value) return false;
-      return props.location.split(' ')[1] ?? 'end';
+      return props.location?.split(' ')[1] ?? 'end';
     });
     useToggleScope(() => props.app, () => {
       const layout = useLayoutItem({
@@ -26002,6 +26030,10 @@ const VSpeedDial = genericComponent()({
 
 // Types
 
+const VStepperSymbol = Symbol.for('vuetify:v-stepper');
+
+// Types
+
 const makeVStepperActionsProps = propsFactory({
   color: String,
   disabled: {
@@ -26189,9 +26221,6 @@ const VStepperItem = genericComponent()({
   }
 });
 
-// Types
-
-const VStepperSymbol$1 = Symbol.for('vuetify:v-stepper');
 const makeVStepperWindowProps = propsFactory({
   ...omit(makeVWindowProps(), ['continuous', 'nextIcon', 'prevIcon', 'showArrows', 'touch', 'mandatory'])
 }, 'VStepperWindow');
@@ -26205,7 +26234,7 @@ const VStepperWindow = genericComponent()({
     let {
       slots
     } = _ref;
-    const group = inject$1(VStepperSymbol$1, null);
+    const group = inject$1(VStepperSymbol, null);
     const _model = useProxiedModel(props, 'modelValue');
     const model = computed({
       get() {
@@ -26263,11 +26292,13 @@ const VStepperWindowItem = genericComponent()({
 
 // Types
 
-const VStepperSymbol = Symbol.for('vuetify:v-stepper');
 const makeStepperProps = propsFactory({
   altLabels: Boolean,
   bgColor: String,
+  completeIcon: String,
+  editIcon: String,
   editable: Boolean,
+  errorIcon: String,
   hideActions: Boolean,
   items: {
     type: Array,
@@ -26281,9 +26312,9 @@ const makeStepperProps = propsFactory({
     type: String,
     default: 'value'
   },
-  mobile: Boolean,
   nonLinear: Boolean,
-  flat: Boolean
+  flat: Boolean,
+  ...makeDisplayProps()
 }, 'Stepper');
 const makeVStepperProps = propsFactory({
   ...makeStepperProps(),
@@ -26311,6 +26342,13 @@ const VStepper = genericComponent()({
       selected
     } = useGroup(props, VStepperSymbol);
     const {
+      displayClasses,
+      mobile
+    } = useDisplay(props);
+    const {
+      completeIcon,
+      editIcon,
+      errorIcon,
       color,
       editable,
       prevText,
@@ -26337,6 +26375,9 @@ const VStepper = genericComponent()({
     provideDefaults({
       VStepperItem: {
         editable,
+        errorIcon,
+        completeIcon,
+        editIcon,
         prevText,
         nextText
       },
@@ -26358,8 +26399,8 @@ const VStepper = genericComponent()({
           'v-stepper--alt-labels': props.altLabels,
           'v-stepper--flat': props.flat,
           'v-stepper--non-linear': props.nonLinear,
-          'v-stepper--mobile': props.mobile
-        }, props.class],
+          'v-stepper--mobile': mobile.value
+        }, displayClasses.value, props.class],
         "style": props.style
       }), {
         default: () => [hasHeader && createVNode(VStepperHeader, {
@@ -26889,9 +26930,9 @@ const VTabs = genericComponent()({
           "key": item.text,
           "value": item.value
         }), {
-          default: () => slots[`tab.${item.value}`]?.({
+          default: slots[`tab.${item.value}`] ? () => slots[`tab.${item.value}`]?.({
             item
-          })
+          }) : undefined
         }))]
       }), hasWindow && createVNode(VTabsWindow, mergeProps({
         "modelValue": model.value,
@@ -28033,7 +28074,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.6.7";
+const version$1 = "3.6.9";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -28058,7 +28099,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.6.7";
+const version = "3.6.9";
 createVuetify.version = version;
 
 export { index as blueprints, components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useLayout, useLocale, useRtl, useTheme, version };