vuetify 3.7.1 → 3.7.2

package/dist/vuetify-labs.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.7.1
+* Vuetify v3.7.2
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -315,7 +315,7 @@ function padEnd(str, length) {
   let char = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '0';
   return str + char.repeat(Math.max(0, length - str.length));
 }
-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;
 }
@@ -5156,10 +5156,14 @@ function useLink(props, attrs) {
     return isLink?.value || hasEvent(attrs, 'click') || hasEvent(props, 'click');
   });
   if (typeof RouterLink === 'string' || !('useLink' in RouterLink)) {
+    const href = toRef(props, 'href');
     return {
       isLink,
       isClickable,
-      href: toRef(props, 'href')
+      href,
+      linkProps: reactive({
+        href
+      })
     };
   }
   // vue-router useLink `to` prop needs to be reactive and useLink will crash if undefined
@@ -5171,18 +5175,24 @@ function useLink(props, attrs) {
   // Actual link needs to be undefined when to prop is not used
   const link = computed(() => props.to ? routerLink : undefined);
   const route = useRoute();
+  const isActive = 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 = computed(() => props.to ? link.value?.route.value.href : props.href);
   return {
     isLink,
     isClickable,
+    isActive,
     route: link.value?.route,
     navigate: link.value?.navigate,
-    isActive: 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: computed(() => props.to ? link.value?.route.value.href : props.href)
+    href,
+    linkProps: reactive({
+      href,
+      'aria-current': computed(() => isActive.value ? 'page' : undefined)
+    })
   };
 }
 const makeRouterProps = propsFactory({
@@ -5657,7 +5667,7 @@ const VBtn = genericComponent()({
       const hasPrepend = !!(props.prependIcon || slots.prepend);
       const hasAppend = !!(props.appendIcon || slots.append);
       const hasIcon = !!(props.icon && props.icon !== true);
-      return withDirectives(createVNode(Tag, {
+      return withDirectives(createVNode(Tag, mergeProps({
         "type": Tag === 'a' ? undefined : 'button',
         "class": ['v-btn', group?.selectedClass.value, {
           'v-btn--active': isActive.value,
@@ -5674,11 +5684,10 @@ const VBtn = genericComponent()({
         "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 && createVNode("span", {
           "key": "prepend",
           "class": "v-btn__prepend"
@@ -7941,7 +7950,7 @@ const VChip = genericComponent()({
       const hasPrependMedia = !!(props.prependIcon || props.prependAvatar);
       const hasPrepend = !!(hasPrependMedia || slots.prepend);
       const hasColor = !group || group.isSelected.value;
-      return isActive.value && withDirectives(createVNode(Tag, {
+      return isActive.value && withDirectives(createVNode(Tag, mergeProps({
         "class": ['v-chip', {
           'v-chip--disabled': props.disabled,
           'v-chip--label': props.label,
@@ -7952,11 +7961,10 @@ const VChip = genericComponent()({
         "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 && createVNode(VExpandXTransition, {
           "key": "filter"
         }, {
@@ -8201,7 +8209,6 @@ const leafSingleActiveStrategy = mandatory => {
   return strategy;
 };
 
-// Utilities
 const singleOpenStrategy = {
   open: _ref => {
     let {
@@ -8235,11 +8242,11 @@ const multipleOpenStrategy = {
       parents
     } = _ref2;
     if (value) {
-      let parent = toRaw(parents.get(id));
+      let parent = parents.get(id);
       opened.add(id);
       while (parent != null && parent !== id) {
         opened.add(parent);
-        parent = toRaw(parents.get(parent));
+        parent = parents.get(parent);
       }
       return opened;
     } else {
@@ -8481,7 +8488,8 @@ const emptyNested = {
     opened: ref(new Set()),
     activated: ref(new Set()),
     selected: ref(new Map()),
-    selectedValues: ref([])
+    selectedValues: ref([]),
+    getPath: () => []
   }
 };
 const makeNestedProps = propsFactory({
@@ -8499,7 +8507,7 @@ const useNested = props => {
   let isUnmounted = false;
   const children = ref(new Map());
   const parents = ref(new Map());
-  const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(toRaw(v)), v => [...v.values()]);
+  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);
@@ -8559,6 +8567,7 @@ const useNested = props => {
     return path;
   }
   const vm = getCurrentInstance('nested');
+  const nodeIds = new Set();
   const nested = {
     id: shallowRef(),
     root: {
@@ -8575,6 +8584,14 @@ const useNested = props => {
         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 +8600,7 @@ const useNested = props => {
       },
       unregister: id => {
         if (isUnmounted) return;
+        nodeIds.delete(id);
         children.value.delete(id);
         const parent = parents.value.get(id);
         if (parent) {
@@ -8659,7 +8677,8 @@ const useNested = props => {
         newActivated && (activated.value = newActivated);
       },
       children,
-      parents
+      parents,
+      getPath
     }
   };
   provide(VNestedSymbol, nested);
@@ -8672,9 +8691,9 @@ const useNestedItem = (id, isGroup) => {
   const item = {
     ...parent,
     id: computedId,
-    open: (open, e) => parent.root.open(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: computed(() => parent.root.opened.value.has(toRaw(computedId.value))),
+    isOpen: computed(() => parent.root.opened.value.has(computedId.value)),
     parent: computed(() => parent.root.parents.value.get(computedId.value)),
     activate: (activated, e) => parent.root.activate(computedId.value, activated, e),
     isActivated: computed(() => parent.root.activated.value.has(toRaw(computedId.value))),
@@ -8904,7 +8923,8 @@ const VListItem = genericComponent()({
       isGroupActivator,
       root,
       parent,
-      openOnSelect
+      openOnSelect,
+      id: uid
     } = useNestedItem(id, false);
     const list = useList();
     const isActive = computed(() => props.active !== false && (props.active || link.isActive?.value || (root.activatable.value ? isActivated.value : isSelected.value)));
@@ -8988,7 +9008,7 @@ const VListItem = genericComponent()({
       if (props.activeColor) {
         deprecate('active-color', ['color', 'base-color']);
       }
-      return withDirectives(createVNode(Tag, {
+      return withDirectives(createVNode(Tag, mergeProps({
         "class": ['v-list-item', {
           'v-list-item--active': isActive.value,
           'v-list-item--disabled': props.disabled,
@@ -8999,11 +9019,10 @@ const VListItem = genericComponent()({
           [`${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 && createVNode("div", {
           "key": "prepend",
           "class": "v-list-item__prepend"
@@ -9090,7 +9109,9 @@ const VListItem = genericComponent()({
       isGroupActivator,
       isSelected,
       list,
-      select
+      select,
+      root,
+      id: uid
     };
   }
 });
@@ -9491,7 +9512,8 @@ const VList = genericComponent()({
       children,
       open,
       parents,
-      select
+      select,
+      getPath
     } = useNested(props);
     const lineClasses = computed(() => props.lines ? `v-list--${props.lines}-line` : undefined);
     const activeColor = toRef(props, 'activeColor');
@@ -9583,7 +9605,8 @@ const VList = genericComponent()({
       select,
       focus,
       children,
-      parents
+      parents,
+      getPath
     };
   }
 });
@@ -13755,8 +13778,7 @@ const VDialog = genericComponent()({
     useRender(() => {
       const overlayProps = VOverlay.filterProps(props);
       const activatorProps = mergeProps({
-        'aria-haspopup': 'dialog',
-        'aria-expanded': String(isActive.value)
+        'aria-haspopup': 'dialog'
       }, props.activatorProps);
       const contentProps = mergeProps({
         tabindex: -1
@@ -13887,12 +13909,10 @@ const VBreadcrumbsItem = genericComponent()({
         "style": [textColorStyles.value, props.style],
         "aria-current": isActive.value ? 'page' : undefined
       }, {
-        default: () => [!link.isLink.value ? slots.default?.() ?? props.title : createVNode("a", {
+        default: () => [!link.isLink.value ? slots.default?.() ?? props.title : createVNode("a", 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 {};
@@ -14268,7 +14288,7 @@ const VCard = genericComponent()({
       const hasImage = !!(slots.image || props.image);
       const hasCardItem = hasHeader || hasPrepend || hasAppend;
       const hasText = !!(slots.text || props.text != null);
-      return withDirectives(createVNode(Tag, {
+      return withDirectives(createVNode(Tag, mergeProps({
         "class": ['v-card', {
           'v-card--disabled': props.disabled,
           'v-card--flat': props.flat,
@@ -14276,10 +14296,9 @@ const VCard = genericComponent()({
           '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 && createVNode("div", {
           "key": "image",
           "class": "v-card__image"
@@ -17645,8 +17664,8 @@ function format(value, formatString, locale, formats) {
 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) {
@@ -28852,6 +28871,11 @@ const VSnackbarQueue = genericComponent()({
   }
 });
 
+function pad(n) {
+  let length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
+  return String(n).padStart(length, '0');
+}
+
 // Types
 
 const makeVTimePickerClockProps = propsFactory({
@@ -29092,27 +29116,6 @@ const VTimePickerClock = genericComponent()({
   }
 });
 
-// @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) {
@@ -29560,25 +29563,13 @@ const VTreeviewItem = genericComponent()({
       emit
     } = _ref;
     const link = useLink(props, attrs);
-    const rawId = computed(() => props.value === undefined ? link.href.value : props.value);
     const vListItemRef = ref();
-    const {
-      activate,
-      isActivated,
-      isGroupActivator,
-      root,
-      id
-    } = useNestedItem(rawId, false);
-    const isActivatableGroupActivator = computed(() => root.activatable.value && isGroupActivator);
+    const isActivatableGroupActivator = computed(() => vListItemRef.value?.root.activatable.value && vListItemRef.value?.isGroupActivator);
     const isClickable = 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 = inject$1(VTreeviewSymbol, {
@@ -29587,11 +29578,13 @@ const VTreeviewItem = genericComponent()({
     useRender(() => {
       const listItemProps = omit(VListItem.filterProps(props), ['onClick']);
       const hasPrepend = slots.prepend || props.toggleIcon;
-      return createVNode(VListItem, mergeProps(listItemProps, {
-        "active": isActivated.value,
+      return createVNode(VListItem, 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
@@ -29725,7 +29718,7 @@ const VTreeviewChildren = genericComponent()({
             ...itemProps,
             ...activatorProps,
             value: itemProps?.value,
-            onToggleExpand: activatorProps.onClick,
+            onToggleExpand: [() => checkChildren(item), activatorProps.onClick],
             onClick: isClickOnOpen.value ? [() => checkChildren(item), activatorProps.onClick] : undefined
           };
           return createVNode(VTreeviewItem, mergeProps(listItemProps, {
@@ -29810,22 +29803,13 @@ const VTreeview = genericComponent()({
       filteredItems
     } = useFilter(props, flatItems, search);
     const visibleIds = 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();
@@ -30226,7 +30210,7 @@ function mountComponent(component, props) {
     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
@@ -30284,7 +30268,7 @@ function findComponentParent(vnode, root) {
 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
   };
 });
@@ -30390,7 +30374,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.7.1";
+const version$1 = "3.7.2";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -30643,7 +30627,7 @@ var index = /*#__PURE__*/Object.freeze({
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.7.1";
+const version = "3.7.2";
 
 /* eslint-disable local-rules/sort-imports */