@vuetify/nightly 3.7.1-master.2024-09-02 → 3.7.1-master.2024-09-04

package/dist/vuetify.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.7.1-master.2024-09-02
+* Vuetify v3.7.1-master.2024-09-04
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -5389,10 +5389,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
@@ -5404,18 +5408,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({
@@ -5890,7 +5900,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,
@@ -5907,11 +5917,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"
@@ -8174,7 +8183,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,
@@ -8185,11 +8194,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"
         }, {
@@ -9234,7 +9242,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,
@@ -9245,11 +9253,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"
@@ -14005,8 +14012,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
@@ -14137,12 +14143,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 {};
@@ -14518,7 +14522,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,
@@ -14526,10 +14530,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"
@@ -28067,7 +28070,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
@@ -28125,7 +28128,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
   };
 });
@@ -28231,7 +28234,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.7.1-master.2024-09-02";
+const version$1 = "3.7.1-master.2024-09-04";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -28256,7 +28259,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.7.1-master.2024-09-02";
+const version = "3.7.1-master.2024-09-04";
 createVuetify.version = version;
 
 export { index as blueprints, components, createVuetify, directives, useDate, useDefaults, useDisplay, useGoTo, useLayout, useLocale, useRtl, useTheme, version };