@vuetify/nightly 3.7.0-beta.1-dev.2024-07-30 → 3.7.0-beta.1-dev.2024-08-01

package/dist/vuetify.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.7.0-beta.1-dev.2024-07-30
+* Vuetify v3.7.0-beta.1-dev.2024-08-01
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -5953,7 +5953,7 @@
             "indeterminate": true,
             "width": "2"
           }, null)])]
-        }), [[Ripple, !isDisabled.value && !!props.ripple, '', {
+        }), [[Ripple, !isDisabled.value && props.ripple, '', {
           center: !!props.icon
         }]]);
       });
@@ -6251,7 +6251,7 @@
           "defaults": {
             VImg: {
               cover: true,
-              image: props.image
+              src: props.image
             },
             VIcon: {
               icon: props.icon
@@ -11393,7 +11393,7 @@
         },
         closeParents(e) {
           setTimeout(() => {
-            if (!openChildren.value.size && !props.persistent && (e == null || e && !isClickInsideElement(e, overlay.value.contentEl))) {
+            if (!openChildren.value.size && !props.persistent && (e == null || overlay.value?.contentEl && !isClickInsideElement(e, overlay.value.contentEl))) {
               isActive.value = false;
               parent?.closeParents();
             }
@@ -23212,6 +23212,8 @@
       let {
         slots
       } = _ref;
+      const layoutItemStyles = vue.ref();
+      const layoutIsReady = vue.shallowRef();
       const {
         themeClasses
       } = provideTheme(props);
@@ -23236,17 +23238,20 @@
         autoHeight.value = entries[0].target.clientHeight;
       });
       const height = vue.computed(() => props.height === 'auto' ? autoHeight.value : parseInt(props.height, 10));
-      const {
-        layoutItemStyles,
-        layoutIsReady
-      } = useLayoutItem({
-        id: props.name,
-        order: vue.computed(() => parseInt(props.order, 10)),
-        position: vue.computed(() => 'bottom'),
-        layoutSize: height,
-        elementSize: vue.computed(() => props.height === 'auto' ? undefined : height.value),
-        active: vue.computed(() => props.app),
-        absolute: vue.toRef(props, 'absolute')
+      useToggleScope(() => props.app, () => {
+        const layout = useLayoutItem({
+          id: props.name,
+          order: vue.computed(() => parseInt(props.order, 10)),
+          position: vue.computed(() => 'bottom'),
+          layoutSize: height,
+          elementSize: vue.computed(() => props.height === 'auto' ? undefined : height.value),
+          active: vue.computed(() => props.app),
+          absolute: vue.toRef(props, 'absolute')
+        });
+        vue.watchEffect(() => {
+          layoutItemStyles.value = layout.layoutItemStyles.value;
+          layoutIsReady.value = layout.layoutIsReady;
+        });
       });
       useRender(() => vue.createVNode(props.tag, {
         "ref": resizeRef,
@@ -23255,7 +23260,7 @@
           height: convertToUnit(props.height)
         }, props.style]
       }, slots));
-      return props.app ? layoutIsReady : {};
+      return props.app ? layoutIsReady.value : {};
     }
   });
 
@@ -25396,16 +25401,17 @@
       const items = vue.computed(() => genStructure(wrapInArray(props.type).join(',')));
       useRender(() => {
         const isLoading = !slots.default || props.loading;
-        return vue.createVNode("div", {
+        const loadingProps = props.boilerplate || !isLoading ? {} : {
+          ariaLive: 'polite',
+          ariaLabel: t(props.loadingText),
+          role: 'alert'
+        };
+        return vue.createVNode("div", vue.mergeProps({
           "class": ['v-skeleton-loader', {
             'v-skeleton-loader--boilerplate': props.boilerplate
           }, themeClasses.value, backgroundColorClasses.value, elevationClasses.value],
-          "style": [backgroundColorStyles.value, isLoading ? dimensionStyles.value : {}],
-          "aria-busy": !props.boilerplate ? isLoading : undefined,
-          "aria-live": !props.boilerplate ? 'polite' : undefined,
-          "aria-label": !props.boilerplate ? t(props.loadingText) : undefined,
-          "role": !props.boilerplate ? 'alert' : undefined
-        }, [isLoading ? items.value : slots.default?.()]);
+          "style": [backgroundColorStyles.value, isLoading ? dimensionStyles.value : {}]
+        }, loadingProps), [isLoading ? items.value : slots.default?.()]);
       });
       return {};
     }
@@ -25438,14 +25444,14 @@
   // Types
 
   function useCountdown(milliseconds) {
-    const time = vue.shallowRef(milliseconds);
+    const time = vue.shallowRef(milliseconds());
     let timer = -1;
     function clear() {
       clearInterval(timer);
     }
     function reset() {
       clear();
-      vue.nextTick(() => time.value = milliseconds);
+      vue.nextTick(() => time.value = milliseconds());
     }
     function start(el) {
       const style = el ? getComputedStyle(el) : {
@@ -25457,7 +25463,7 @@
       const startTime = performance.now();
       timer = window.setInterval(() => {
         const elapsed = performance.now() - startTime + interval;
-        time.value = Math.max(milliseconds - elapsed, 0);
+        time.value = Math.max(milliseconds() - elapsed, 0);
         if (time.value <= 0) clear();
       }, interval);
     }
@@ -25517,7 +25523,7 @@
       const {
         roundedClasses
       } = useRounded(props);
-      const countdown = useCountdown(Number(props.timeout));
+      const countdown = useCountdown(() => Number(props.timeout));
       const overlay = vue.ref();
       const timerRef = vue.ref();
       const isHovering = vue.shallowRef(false);
@@ -28196,7 +28202,7 @@
       goTo
     };
   }
-  const version$1 = "3.7.0-beta.1-dev.2024-07-30";
+  const version$1 = "3.7.0-beta.1-dev.2024-08-01";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -28221,7 +28227,7 @@
       ...options
     });
   };
-  const version = "3.7.0-beta.1-dev.2024-07-30";
+  const version = "3.7.0-beta.1-dev.2024-08-01";
   createVuetify.version = version;
 
   exports.blueprints = index;