vuetify 3.0.1 → 3.0.3

package/dist/vuetify.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.0.1
+* Vuetify v3.0.3
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { ref, onBeforeUnmount, watch, readonly, Fragment, reactive, computed, watchEffect, toRefs, capitalize, getCurrentInstance as getCurrentInstance$1, unref, provide, inject as inject$1, shallowRef, shallowReactive, toRaw, effectScope, defineComponent as defineComponent$1, camelize, h, onDeactivated, onActivated, onMounted, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, resolveDynamicComponent, onScopeDispose, cloneVNode, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
+import { ref, onBeforeUnmount, watch, readonly, Fragment, reactive, computed, watchEffect, toRefs, capitalize, getCurrentInstance as getCurrentInstance$1, unref, provide, inject as inject$1, effectScope, onScopeDispose, shallowRef, shallowReactive, toRaw, defineComponent as defineComponent$1, camelize, h, onDeactivated, onActivated, onMounted, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, resolveDynamicComponent, cloneVNode, warn, toHandlers, Teleport, createTextVNode, onBeforeUpdate, vModelText } from 'vue';
 
 const IN_BROWSER = typeof window !== 'undefined';
 const SUPPORTS_INTERSECTION = IN_BROWSER && 'IntersectionObserver' in window;
@@ -927,6 +927,26 @@ function provideDefaults(defaults, options) {
   return newDefaults;
 }
 
+function useToggleScope(source, cb) {
+  let scope;
+  watch(source, active => {
+    if (active && !scope) {
+      scope = effectScope();
+      scope.run(cb);
+    } else if (!active) {
+      var _scope;
+      (_scope = scope) == null ? void 0 : _scope.stop();
+      scope = undefined;
+    }
+  }, {
+    immediate: true
+  });
+  onScopeDispose(() => {
+    var _scope2;
+    (_scope2 = scope) == null ? void 0 : _scope2.stop();
+  });
+}
+
 /**
  * Creates a factory function for props definitions.
  * This is used to define props in a composable then override
@@ -1019,17 +1039,9 @@ const defineComponent = function defineComponent(options) {
         }
       });
       const setupBindings = options._setup(_props, ctx);
-      let scope;
-      watch(_subcomponentDefaults, (val, oldVal) => {
-        if (!val && scope) scope.stop();else if (val && !oldVal) {
-          scope = effectScope();
-          scope.run(() => {
-            var _injectSelf;
-            provideDefaults(mergeDeep(((_injectSelf = injectSelf(DefaultsSymbol)) == null ? void 0 : _injectSelf.value) ?? {}, val));
-          });
-        }
-      }, {
-        immediate: true
+      useToggleScope(_subcomponentDefaults, () => {
+        var _injectSelf;
+        provideDefaults(mergeDeep(((_injectSelf = injectSelf(DefaultsSymbol)) == null ? void 0 : _injectSelf.value) ?? {}, _subcomponentDefaults.value));
       });
       return setupBindings;
     };
@@ -1776,22 +1788,6 @@ function genCssVariables(theme) {
   return variables;
 }
 
-function useToggleScope(source, cb) {
-  let scope;
-  watch(source, active => {
-    if (active && !scope) {
-      scope = effectScope();
-      scope.run(cb);
-    } else {
-      var _scope;
-      (_scope = scope) == null ? void 0 : _scope.stop();
-      scope = undefined;
-    }
-  }, {
-    immediate: true
-  });
-}
-
 // Utilities
 
 // Types
@@ -2480,8 +2476,8 @@ function getDimensions(target, el) {
   const tsx = targetBox.width / elBox.width;
   const tsy = targetBox.height / elBox.height;
   const maxs = Math.max(1, tsx, tsy);
-  const sx = tsx / maxs;
-  const sy = tsy / maxs;
+  const sx = tsx / maxs || 0;
+  const sy = tsy / maxs || 0;
 
   // Animate elements larger than 12% of the screen area up to 1.5x slower
   const asa = elBox.width * elBox.height / (window.innerWidth * window.innerHeight);
@@ -3216,7 +3212,7 @@ function filterToolbarProps(props) {
 
 // Types
 
-const VAppBar = defineComponent({
+const VAppBar = genericComponent()({
   name: 'VAppBar',
   props: {
     // TODO: Implement scrolling techniques
@@ -4466,6 +4462,7 @@ const VProgressLinear = defineComponent({
         '--v-progress-linear-height': convertToUnit(height.value)
       },
       "role": "progressbar",
+      "aria-hidden": props.active ? 'false' : 'true',
       "aria-valuemin": "0",
       "aria-valuemax": props.max,
       "aria-valuenow": props.indeterminate ? undefined : normalizedValue.value,
@@ -7204,7 +7201,7 @@ const emptyNested = {
 };
 const makeNestedProps = propsFactory({
   selectStrategy: [String, Function],
-  openStrategy: [String, Function],
+  openStrategy: [String, Object],
   opened: Array,
   selected: Array,
   mandatory: Boolean
@@ -7231,7 +7228,7 @@ const useNested = props => {
     }
   });
   const openStrategy = computed(() => {
-    if (typeof props.openStrategy === 'function') return props.openStrategy;
+    if (typeof props.openStrategy === 'object') return props.openStrategy;
     switch (props.openStrategy) {
       case 'list':
         return listOpenStrategy;
@@ -8346,6 +8343,10 @@ function useActivator(props, _ref) {
     flush: 'post',
     immediate: true
   });
+  onScopeDispose(() => {
+    var _scope;
+    (_scope = scope) == null ? void 0 : _scope.stop();
+  });
   return {
     activatorEl,
     activatorRef,
@@ -8535,7 +8536,9 @@ function useLocationStrategies(props, data) {
     updateLocation.value = undefined;
     if (!(IN_BROWSER && data.isActive.value && props.locationStrategy)) return;
     scope = effectScope();
-    await nextTick();
+    if (!(props.locationStrategy === 'connected')) {
+      await nextTick();
+    }
     scope.run(() => {
       if (typeof props.locationStrategy === 'function') {
         var _props$locationStrate;
@@ -8929,6 +8932,10 @@ function useScrollStrategies(props, data) {
       }
     });
   });
+  onScopeDispose(() => {
+    var _scope2;
+    (_scope2 = scope) == null ? void 0 : _scope2.stop();
+  });
 }
 function closeScrollStrategy(data) {
   function onScroll(e) {
@@ -10783,7 +10790,7 @@ const VCardSubtitle = createSimpleFunctional('v-card-subtitle');
 
 const VCardTitle = createSimpleFunctional('v-card-title');
 
-const VCardItem = defineComponent$1({
+const VCardItem = defineComponent({
   name: 'VCardItem',
   props: {
     appendAvatar: String,
@@ -10955,7 +10962,8 @@ const VCard = defineComponent({
         }, themeClasses.value, borderClasses.value, colorClasses.value, densityClasses.value, elevationClasses.value, loaderClasses.value, positionClasses.value, roundedClasses.value, variantClasses.value],
         "style": [colorStyles.value, dimensionStyles.value, locationStyles.value],
         "href": link.href.value,
-        "onClick": isClickable.value && link.navigate
+        "onClick": isClickable.value && link.navigate,
+        "tabindex": props.disabled ? -1 : undefined
       }, {
         default: () => [hasImage && createVNode(VDefaultsProvider, {
           "key": "image",
@@ -14212,7 +14220,7 @@ const VFooter = defineComponent({
     useRender(() => createVNode(props.tag, {
       "ref": resizeRef,
       "class": ['v-footer', themeClasses.value, backgroundColorClasses.value, borderClasses.value, elevationClasses.value, roundedClasses.value],
-      "style": [backgroundColorStyles, props.app ? layoutItemStyles.value : undefined]
+      "style": [backgroundColorStyles.value, props.app ? layoutItemStyles.value : undefined]
     }, slots));
     return {};
   }
@@ -14774,7 +14782,8 @@ const VLazy = defineComponent({
         "style": dimensionStyles.value
       }, {
         default: () => [isActive.value && createVNode(MaybeTransition, {
-          "transition": props.transition
+          "transition": props.transition,
+          "appear": true
         }, {
           default: () => [(_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots)]
         })]
@@ -15234,7 +15243,7 @@ const VNavigationDrawer = defineComponent({
     const isTemporary = computed(() => !props.permanent && (mobile.value || props.temporary));
     const isSticky = computed(() => props.sticky && !isTemporary.value && location.value !== 'bottom');
     if (!props.disableResizeWatcher) {
-      watch(isTemporary, val => !props.permanent && (isActive.value = !val));
+      watch(isTemporary, val => !props.permanent && nextTick(() => isActive.value = !val));
     }
     if (!props.disableRouteWatcher && router) {
       watch(router.currentRoute, () => isTemporary.value && (isActive.value = false));
@@ -16112,7 +16121,7 @@ const VRating = genericComponent()({
     },
     readonly: Boolean,
     modelValue: {
-      type: Number,
+      type: [Number, String],
       default: 0
     },
     itemLabels: Array,
@@ -16141,6 +16150,7 @@ const VRating = genericComponent()({
       themeClasses
     } = provideTheme(props);
     const rating = useProxiedModel(props, 'modelValue');
+    const normalizedValue = computed(() => clamp(parseFloat(rating.value), 0, +props.length));
     const range = computed(() => createRange(Number(props.length), 1));
     const increments = computed(() => range.value.flatMap(v => props.halfIncrements ? [v - 0.5, v] : [v]));
     const hoverIndex = ref(-1);
@@ -16149,7 +16159,7 @@ const VRating = genericComponent()({
     let isClicking = false;
     const itemState = computed(() => increments.value.map(value => {
       const isHovering = props.hover && hoverIndex.value > -1;
-      const isFilled = rating.value >= value;
+      const isFilled = normalizedValue.value >= value;
       const isHovered = hoverIndex.value >= value;
       const isFullIcon = isHovering ? isHovered : isFilled;
       const icon = isFullIcon ? props.fullIcon : props.emptyIcon;
@@ -16170,7 +16180,7 @@ const VRating = genericComponent()({
         hoverIndex.value = -1;
       }
       function onFocus() {
-        if (value === 0 && rating.value === 0) {
+        if (value === 0 && normalizedValue.value === 0) {
           var _firstRef$value;
           (_firstRef$value = firstRef.value) == null ? void 0 : _firstRef$value.focus();
         } else {
@@ -16182,7 +16192,7 @@ const VRating = genericComponent()({
       }
       function onClick() {
         if (props.disabled || props.readonly) return;
-        rating.value = rating.value === value && props.clearable ? 0 : value;
+        rating.value = normalizedValue.value === value && props.clearable ? 0 : value;
       }
       return {
         onMouseenter: props.hover ? onMouseenter : undefined,
@@ -16247,7 +16257,7 @@ const VRating = genericComponent()({
         "id": id,
         "type": "radio",
         "value": value,
-        "checked": rating.value === value,
+        "checked": normalizedValue.value === value,
         "onClick": onClick,
         "onFocus": onFocus,
         "onBlur": onBlur,
@@ -18156,7 +18166,7 @@ function createVuetify$1() {
     locale
   };
 }
-const version$1 = "3.0.1";
+const version$1 = "3.0.3";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -18177,7 +18187,7 @@ const createVuetify = function () {
     ...options
   });
 };
-const version = "3.0.1";
+const version = "3.0.3";
 createVuetify.version = version;
 
 export { components, createVuetify, directives, useDisplay, useLayout, useLocale, useRtl, useTheme, version };