vuetify 3.7.0 → 3.7.2

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.7.0
+* Vuetify v3.7.2
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -166,6 +166,10 @@
   function isObject(obj) {
     return obj !== null && typeof obj === 'object' && !Array.isArray(obj);
   }
+  function isPlainObject(obj) {
+    let proto;
+    return obj !== null && typeof obj === 'object' && ((proto = Object.getPrototypeOf(obj)) === Object.prototype || proto === null);
+  }
   function refElement(obj) {
     if (obj && '$el' in obj) {
       const el = obj.$el;
@@ -315,7 +319,7 @@
     let char = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '0';
     return str + char.repeat(Math.max(0, length - str.length));
   }
-  function padStart$1(str, length) {
+  function padStart(str, length) {
     let char = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '0';
     return char.repeat(Math.max(0, length - str.length)) + str;
   }
@@ -361,12 +365,12 @@
       const targetProperty = target[key];
 
       // Only continue deep merging if
-      // both properties are objects
-      if (isObject(sourceProperty) && isObject(targetProperty)) {
+      // both properties are plain objects
+      if (isPlainObject(sourceProperty) && isPlainObject(targetProperty)) {
         out[key] = mergeDeep(sourceProperty, targetProperty, arrayFn);
         continue;
       }
-      if (Array.isArray(sourceProperty) && Array.isArray(targetProperty) && arrayFn) {
+      if (arrayFn && Array.isArray(sourceProperty) && Array.isArray(targetProperty)) {
         out[key] = arrayFn(sourceProperty, targetProperty);
         continue;
       }
@@ -5156,10 +5160,14 @@
       return isLink?.value || hasEvent(attrs, 'click') || hasEvent(props, 'click');
     });
     if (typeof RouterLink === 'string' || !('useLink' in RouterLink)) {
+      const href = vue.toRef(props, 'href');
       return {
         isLink,
         isClickable,
-        href: vue.toRef(props, 'href')
+        href,
+        linkProps: vue.reactive({
+          href
+        })
       };
     }
     // vue-router useLink `to` prop needs to be reactive and useLink will crash if undefined
@@ -5171,18 +5179,24 @@
     // Actual link needs to be undefined when to prop is not used
     const link = vue.computed(() => props.to ? routerLink : undefined);
     const route = useRoute();
+    const isActive = vue.computed(() => {
+      if (!link.value) return false;
+      if (!props.exact) return link.value.isActive?.value ?? false;
+      if (!route.value) return link.value.isExactActive?.value ?? false;
+      return link.value.isExactActive?.value && deepEqual(link.value.route.value.query, route.value.query);
+    });
+    const href = vue.computed(() => props.to ? link.value?.route.value.href : props.href);
     return {
       isLink,
       isClickable,
+      isActive,
       route: link.value?.route,
       navigate: link.value?.navigate,
-      isActive: vue.computed(() => {
-        if (!link.value) return false;
-        if (!props.exact) return link.value.isActive?.value ?? false;
-        if (!route.value) return link.value.isExactActive?.value ?? false;
-        return link.value.isExactActive?.value && deepEqual(link.value.route.value.query, route.value.query);
-      }),
-      href: vue.computed(() => props.to ? link.value?.route.value.href : props.href)
+      href,
+      linkProps: vue.reactive({
+        href,
+        'aria-current': vue.computed(() => isActive.value ? 'page' : undefined)
+      })
     };
   }
   const makeRouterProps = propsFactory({
@@ -5657,7 +5671,7 @@
         const hasPrepend = !!(props.prependIcon || slots.prepend);
         const hasAppend = !!(props.appendIcon || slots.append);
         const hasIcon = !!(props.icon && props.icon !== true);
-        return vue.withDirectives(vue.createVNode(Tag, {
+        return vue.withDirectives(vue.createVNode(Tag, vue.mergeProps({
           "type": Tag === 'a' ? undefined : 'button',
           "class": ['v-btn', group?.selectedClass.value, {
             'v-btn--active': isActive.value,
@@ -5674,11 +5688,10 @@
           "style": [colorStyles.value, dimensionStyles.value, locationStyles.value, sizeStyles.value, props.style],
           "aria-busy": props.loading ? true : undefined,
           "disabled": isDisabled.value || undefined,
-          "href": link.href.value,
           "tabindex": props.loading || props.readonly ? -1 : undefined,
           "onClick": onClick,
           "value": valueAttr.value
-        }, {
+        }, link.linkProps), {
           default: () => [genOverlays(true, 'v-btn'), !props.icon && hasPrepend && vue.createVNode("span", {
             "key": "prepend",
             "class": "v-btn__prepend"
@@ -7941,7 +7954,7 @@
         const hasPrependMedia = !!(props.prependIcon || props.prependAvatar);
         const hasPrepend = !!(hasPrependMedia || slots.prepend);
         const hasColor = !group || group.isSelected.value;
-        return isActive.value && vue.withDirectives(vue.createVNode(Tag, {
+        return isActive.value && vue.withDirectives(vue.createVNode(Tag, vue.mergeProps({
           "class": ['v-chip', {
             'v-chip--disabled': props.disabled,
             'v-chip--label': props.label,
@@ -7952,11 +7965,10 @@
           "style": [hasColor ? colorStyles.value : undefined, props.style],
           "disabled": props.disabled || undefined,
           "draggable": props.draggable,
-          "href": link.href.value,
           "tabindex": isClickable.value ? 0 : undefined,
           "onClick": onClick,
           "onKeydown": isClickable.value && !isLink.value && onKeyDown
-        }, {
+        }, link.linkProps), {
           default: () => [genOverlays(isClickable.value, 'v-chip'), hasFilter && vue.createVNode(VExpandXTransition, {
             "key": "filter"
           }, {
@@ -8201,7 +8213,6 @@
     return strategy;
   };
 
-  // Utilities
   const singleOpenStrategy = {
     open: _ref => {
       let {
@@ -8235,11 +8246,11 @@
         parents
       } = _ref2;
       if (value) {
-        let parent = vue.toRaw(parents.get(id));
+        let parent = parents.get(id);
         opened.add(id);
         while (parent != null && parent !== id) {
           opened.add(parent);
-          parent = vue.toRaw(parents.get(parent));
+          parent = parents.get(parent);
         }
         return opened;
       } else {
@@ -8481,7 +8492,8 @@
       opened: vue.ref(new Set()),
       activated: vue.ref(new Set()),
       selected: vue.ref(new Map()),
-      selectedValues: vue.ref([])
+      selectedValues: vue.ref([]),
+      getPath: () => []
     }
   };
   const makeNestedProps = propsFactory({
@@ -8499,7 +8511,7 @@
     let isUnmounted = false;
     const children = vue.ref(new Map());
     const parents = vue.ref(new Map());
-    const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(vue.toRaw(v)), v => [...v.values()]);
+    const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(v), v => [...v.values()]);
     const activeStrategy = vue.computed(() => {
       if (typeof props.activeStrategy === 'object') return props.activeStrategy;
       if (typeof props.activeStrategy === 'function') return props.activeStrategy(props.mandatory);
@@ -8559,6 +8571,7 @@
       return path;
     }
     const vm = getCurrentInstance('nested');
+    const nodeIds = new Set();
     const nested = {
       id: vue.shallowRef(),
       root: {
@@ -8575,6 +8588,14 @@
           return arr;
         }),
         register: (id, parentId, isGroup) => {
+          if (nodeIds.has(id)) {
+            const path = getPath(id).join(' -> ');
+            const newPath = getPath(parentId).concat(id).join(' -> ');
+            consoleError(`Multiple nodes with the same ID\n\t${path}\n\t${newPath}`);
+            return;
+          } else {
+            nodeIds.add(id);
+          }
           parentId && id !== parentId && parents.value.set(id, parentId);
           isGroup && children.value.set(id, []);
           if (parentId != null) {
@@ -8583,6 +8604,7 @@
         },
         unregister: id => {
           if (isUnmounted) return;
+          nodeIds.delete(id);
           children.value.delete(id);
           const parent = parents.value.get(id);
           if (parent) {
@@ -8659,7 +8681,8 @@
           newActivated && (activated.value = newActivated);
         },
         children,
-        parents
+        parents,
+        getPath
       }
     };
     vue.provide(VNestedSymbol, nested);
@@ -8672,9 +8695,9 @@
     const item = {
       ...parent,
       id: computedId,
-      open: (open, e) => parent.root.open(vue.toRaw(computedId.value), open, e),
+      open: (open, e) => parent.root.open(computedId.value, open, e),
       openOnSelect: (open, e) => parent.root.openOnSelect(computedId.value, open, e),
-      isOpen: vue.computed(() => parent.root.opened.value.has(vue.toRaw(computedId.value))),
+      isOpen: vue.computed(() => parent.root.opened.value.has(computedId.value)),
       parent: vue.computed(() => parent.root.parents.value.get(computedId.value)),
       activate: (activated, e) => parent.root.activate(computedId.value, activated, e),
       isActivated: vue.computed(() => parent.root.activated.value.has(vue.toRaw(computedId.value))),
@@ -8904,7 +8927,8 @@
         isGroupActivator,
         root,
         parent,
-        openOnSelect
+        openOnSelect,
+        id: uid
       } = useNestedItem(id, false);
       const list = useList();
       const isActive = vue.computed(() => props.active !== false && (props.active || link.isActive?.value || (root.activatable.value ? isActivated.value : isSelected.value)));
@@ -8988,7 +9012,7 @@
         if (props.activeColor) {
           deprecate('active-color', ['color', 'base-color']);
         }
-        return vue.withDirectives(vue.createVNode(Tag, {
+        return vue.withDirectives(vue.createVNode(Tag, vue.mergeProps({
           "class": ['v-list-item', {
             'v-list-item--active': isActive.value,
             'v-list-item--disabled': props.disabled,
@@ -8999,11 +9023,10 @@
             [`${props.activeClass}`]: props.activeClass && isActive.value
           }, themeClasses.value, borderClasses.value, colorClasses.value, densityClasses.value, elevationClasses.value, lineClasses.value, roundedClasses.value, variantClasses.value, props.class],
           "style": [colorStyles.value, dimensionStyles.value, props.style],
-          "href": link.href.value,
           "tabindex": isClickable.value ? list ? -2 : 0 : undefined,
           "onClick": onClick,
           "onKeydown": isClickable.value && !isLink.value && onKeyDown
-        }, {
+        }, link.linkProps), {
           default: () => [genOverlays(isClickable.value || isActive.value, 'v-list-item'), hasPrepend && vue.createVNode("div", {
             "key": "prepend",
             "class": "v-list-item__prepend"
@@ -9090,7 +9113,9 @@
         isGroupActivator,
         isSelected,
         list,
-        select
+        select,
+        root,
+        id: uid
       };
     }
   });
@@ -9491,7 +9516,8 @@
         children,
         open,
         parents,
-        select
+        select,
+        getPath
       } = useNested(props);
       const lineClasses = vue.computed(() => props.lines ? `v-list--${props.lines}-line` : undefined);
       const activeColor = vue.toRef(props, 'activeColor');
@@ -9583,7 +9609,8 @@
         select,
         focus,
         children,
-        parents
+        parents,
+        getPath
       };
     }
   });
@@ -11035,6 +11062,8 @@
 
   /** Omit properties starting with P */
 
+  /** Omit keyof $props from T */
+
   function getDescriptor(obj, key) {
     let currentObj = obj;
     while (currentObj) {
@@ -13690,6 +13719,7 @@
     props: makeVDialogProps(),
     emits: {
       'update:modelValue': value => true,
+      afterEnter: () => true,
       afterLeave: () => true
     },
     setup(props, _ref) {
@@ -13731,6 +13761,7 @@
         });
       }
       function onAfterEnter() {
+        emit('afterEnter');
         if (overlay.value?.contentEl && !overlay.value.contentEl.contains(document.activeElement)) {
           overlay.value.contentEl.focus({
             preventScroll: true
@@ -13751,8 +13782,7 @@
       useRender(() => {
         const overlayProps = VOverlay.filterProps(props);
         const activatorProps = vue.mergeProps({
-          'aria-haspopup': 'dialog',
-          'aria-expanded': String(isActive.value)
+          'aria-haspopup': 'dialog'
         }, props.activatorProps);
         const contentProps = vue.mergeProps({
           tabindex: -1
@@ -13883,12 +13913,10 @@
           "style": [textColorStyles.value, props.style],
           "aria-current": isActive.value ? 'page' : undefined
         }, {
-          default: () => [!link.isLink.value ? slots.default?.() ?? props.title : vue.createVNode("a", {
+          default: () => [!link.isLink.value ? slots.default?.() ?? props.title : vue.createVNode("a", vue.mergeProps({
             "class": "v-breadcrumbs-item--link",
-            "href": link.href.value,
-            "aria-current": isActive.value ? 'page' : undefined,
             "onClick": link.navigate
-          }, [slots.default?.() ?? props.title])]
+          }, link.linkProps), [slots.default?.() ?? props.title])]
         });
       });
       return {};
@@ -14264,7 +14292,7 @@
         const hasImage = !!(slots.image || props.image);
         const hasCardItem = hasHeader || hasPrepend || hasAppend;
         const hasText = !!(slots.text || props.text != null);
-        return vue.withDirectives(vue.createVNode(Tag, {
+        return vue.withDirectives(vue.createVNode(Tag, vue.mergeProps({
           "class": ['v-card', {
             'v-card--disabled': props.disabled,
             'v-card--flat': props.flat,
@@ -14272,10 +14300,9 @@
             'v-card--link': isClickable.value
           }, themeClasses.value, borderClasses.value, colorClasses.value, densityClasses.value, elevationClasses.value, loaderClasses.value, positionClasses.value, roundedClasses.value, variantClasses.value, props.class],
           "style": [colorStyles.value, dimensionStyles.value, locationStyles.value, props.style],
-          "href": link.href.value,
           "onClick": isClickable.value && link.navigate,
           "tabindex": props.disabled ? -1 : undefined
-        }, {
+        }, link.linkProps), {
           default: () => [hasImage && vue.createVNode("div", {
             "key": "image",
             "class": "v-card__image"
@@ -17641,8 +17668,8 @@
   function toISO(adapter, value) {
     const date = adapter.toJsDate(value);
     const year = date.getFullYear();
-    const month = padStart$1(String(date.getMonth() + 1), 2, '0');
-    const day = padStart$1(String(date.getDate()), 2, '0');
+    const month = padStart(String(date.getMonth() + 1), 2, '0');
+    const day = padStart(String(date.getDate()), 2, '0');
     return `${year}-${month}-${day}`;
   }
   function parseISO(value) {
@@ -23170,7 +23197,6 @@
         type: String,
         required: true
       },
-      rootRef: null,
       rootMargin: String
     },
     emits: {
@@ -23183,14 +23209,15 @@
       const {
         intersectionRef,
         isIntersecting
-      } = useIntersectionObserver(entries => {}, props.rootMargin ? {
-        rootMargin: props.rootMargin
-      } : undefined);
+      } = useIntersectionObserver();
       vue.watch(isIntersecting, async val => {
         emit('intersect', props.side, val);
       });
       useRender(() => vue.createVNode("div", {
         "class": "v-infinite-scroll-intersect",
+        "style": {
+          '--v-infinite-margin-size': props.rootMargin
+        },
         "ref": intersectionRef
       }, [vue.createTextVNode("\xA0")]));
       return {};
@@ -23341,17 +23368,15 @@
         }, {
           default: () => [vue.createVNode("div", {
             "class": "v-infinite-scroll__side"
-          }, [renderSide('start', startStatus.value)]), rootEl.value && hasStartIntersect && intersectMode && vue.createVNode(VInfiniteScrollIntersect, {
+          }, [renderSide('start', startStatus.value)]), hasStartIntersect && intersectMode && vue.createVNode(VInfiniteScrollIntersect, {
             "key": "start",
             "side": "start",
             "onIntersect": handleIntersect,
-            "rootRef": rootEl.value,
             "rootMargin": margin.value
-          }, null), slots.default?.(), rootEl.value && hasEndIntersect && intersectMode && vue.createVNode(VInfiniteScrollIntersect, {
+          }, null), slots.default?.(), hasEndIntersect && intersectMode && vue.createVNode(VInfiniteScrollIntersect, {
             "key": "end",
             "side": "end",
             "onIntersect": handleIntersect,
-            "rootRef": rootEl.value,
             "rootMargin": margin.value
           }, null), vue.createVNode("div", {
             "class": "v-infinite-scroll__side"
@@ -28154,7 +28179,13 @@
       const model = vue.computed({
         get: () => _model.value,
         set(val) {
-          if (typeof val !== 'string') _model.value = val;
+          if (val === null) {
+            _model.value = null;
+            return;
+          }
+          if (!isNaN(+val) && +val <= props.max && +val >= props.min) {
+            _model.value = +val;
+          }
         }
       });
       const vTextFieldRef = vue.ref();
@@ -28844,6 +28875,11 @@
     }
   });
 
+  function pad(n) {
+    let length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
+    return String(n).padStart(length, '0');
+  }
+
   // Types
 
   const makeVTimePickerClockProps = propsFactory({
@@ -29084,27 +29120,6 @@
     }
   });
 
-  // @ts-nocheck
-  /* eslint-disable */
-
-  const padStart = (string, targetLength, padString) => {
-    targetLength = targetLength >> 0;
-    string = String(string);
-    padString = String(padString);
-    if (string.length > targetLength) {
-      return String(string);
-    }
-    targetLength = targetLength - string.length;
-    if (targetLength > padString.length) {
-      padString += padString.repeat(targetLength / padString.length);
-    }
-    return padString.slice(0, targetLength) + String(string);
-  };
-  var pad = (function (n) {
-    let length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
-    return padStart(n, length, '0');
-  });
-
   // @ts-nocheck
   /* eslint-disable */
   var SelectingTimes = /*#__PURE__*/function (SelectingTimes) {
@@ -29552,25 +29567,13 @@
         emit
       } = _ref;
       const link = useLink(props, attrs);
-      const rawId = vue.computed(() => props.value === undefined ? link.href.value : props.value);
       const vListItemRef = vue.ref();
-      const {
-        activate,
-        isActivated,
-        isGroupActivator,
-        root,
-        id
-      } = useNestedItem(rawId, false);
-      const isActivatableGroupActivator = vue.computed(() => root.activatable.value && isGroupActivator);
+      const isActivatableGroupActivator = vue.computed(() => vListItemRef.value?.root.activatable.value && vListItemRef.value?.isGroupActivator);
       const isClickable = vue.computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || props.value != null && !!vListItemRef.value?.list || isActivatableGroupActivator.value));
       function activateItem(e) {
-        if (!isClickable.value || !isActivatableGroupActivator.value && isGroupActivator) return;
-        if (root.activatable.value) {
-          if (isActivatableGroupActivator.value) {
-            activate(!isActivated.value, e);
-          } else {
-            vListItemRef.value?.activate(!vListItemRef.value?.isActivated, e);
-          }
+        if (!isClickable.value || !isActivatableGroupActivator.value && vListItemRef.value?.isGroupActivator) return;
+        if (vListItemRef.value?.root.activatable.value) {
+          vListItemRef.value?.activate(!vListItemRef.value?.isActivated, e);
         }
       }
       const visibleIds = vue.inject(VTreeviewSymbol, {
@@ -29579,11 +29582,13 @@
       useRender(() => {
         const listItemProps = omit(VListItem.filterProps(props), ['onClick']);
         const hasPrepend = slots.prepend || props.toggleIcon;
-        return vue.createVNode(VListItem, vue.mergeProps(listItemProps, {
-          "active": isActivated.value,
+        return vue.createVNode(VListItem, vue.mergeProps({
+          "ref": vListItemRef
+        }, listItemProps, {
+          "active": vListItemRef.value?.isActivated,
           "class": ['v-treeview-item', {
             'v-treeview-item--activatable-group-activator': isActivatableGroupActivator.value,
-            'v-treeview-item--filtered': visibleIds.value && !visibleIds.value.has(id.value)
+            'v-treeview-item--filtered': visibleIds.value && !visibleIds.value.has(vListItemRef.value?.id)
           }, props.class],
           "ripple": false,
           "onClick": props.onClick ?? activateItem
@@ -29717,7 +29722,7 @@
               ...itemProps,
               ...activatorProps,
               value: itemProps?.value,
-              onToggleExpand: activatorProps.onClick,
+              onToggleExpand: [() => checkChildren(item), activatorProps.onClick],
               onClick: isClickOnOpen.value ? [() => checkChildren(item), activatorProps.onClick] : undefined
             };
             return vue.createVNode(VTreeviewItem, vue.mergeProps(listItemProps, {
@@ -29802,22 +29807,13 @@
         filteredItems
       } = useFilter(props, flatItems, search);
       const visibleIds = vue.computed(() => {
-        if (!search.value) {
-          return null;
-        }
+        if (!search.value) return null;
+        const getPath = vListRef.value?.getPath;
+        if (!getPath) return null;
         return new Set(filteredItems.value.flatMap(item => {
           return [...getPath(item.props.value), ...getChildren(item.props.value)];
         }));
       });
-      function getPath(id) {
-        const path = [];
-        let parent = id;
-        while (parent != null) {
-          path.unshift(parent);
-          parent = vListRef.value?.parents.get(parent);
-        }
-        return path;
-      }
       function getChildren(id) {
         const arr = [];
         const queue = (vListRef.value?.children.get(id) ?? []).slice();
@@ -30218,7 +30214,7 @@
       const value = isObject(binding.value) ? binding.value : {};
 
       // Get the children from the props or directive value, or the element's children
-      const children = () => text ?? el.innerHTML;
+      const children = () => text ?? el.textContent;
 
       // If vnode.ctx is the same as the instance, then we're bound to a plain element
       // and need to find the nearest parent component instance to inherit provides from
@@ -30276,7 +30272,7 @@
   const Tooltip = useDirectiveComponent(VTooltip, binding => {
     return {
       activator: 'parent',
-      location: binding.arg?.replace('-', ' ') ?? 'top',
+      location: binding.arg?.replace('-', ' '),
       text: typeof binding.value === 'boolean' ? undefined : binding.value
     };
   });
@@ -30382,7 +30378,7 @@
       goTo
     };
   }
-  const version$1 = "3.7.0";
+  const version$1 = "3.7.2";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -30635,7 +30631,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.7.0";
+  const version = "3.7.2";
 
   /* eslint-disable local-rules/sort-imports */