vuetify 3.8.9 → 3.8.11

package/dist/vuetify-labs.cjs

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.8.9
+* Vuetify v3.8.11
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -613,6 +613,13 @@
     }
     return out;
   }
+  function onlyDefinedProps(props) {
+    const booleanAttributes = ['checked', 'disabled'];
+    return Object.fromEntries(Object.entries(props).filter(_ref => {
+      let [key, v] = _ref;
+      return booleanAttributes.includes(key) ? !!v : v !== undefined;
+    }));
+  }
 
   // Utilities
   const block = ['top', 'bottom'];
@@ -937,7 +944,7 @@
       // WoB should always return negative value.
 
       const SAPC = (Ybg ** revBG - Ytxt ** revTXT) * scaleWoB;
-      outputContrast = SAPC > -1e-3 ? 0.0 : SAPC > -0.078 ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;
+      outputContrast = SAPC > -loClip ? 0.0 : SAPC > -loConThresh ? SAPC - SAPC * loConFactor * loConOffset : SAPC + loConOffset;
     }
     return outputContrast * 100;
   }
@@ -3325,10 +3332,10 @@
     } = isObject(transition) ? transition : {};
     let transitionProps;
     if (isObject(transition)) {
-      transitionProps = vue.mergeProps(customProps, JSON.parse(JSON.stringify({
+      transitionProps = vue.mergeProps(customProps, onlyDefinedProps({
         disabled,
         group
-      })), rest);
+      }), rest);
     } else {
       transitionProps = vue.mergeProps({
         name: disabled || !transition ? '' : transition
@@ -4397,6 +4404,7 @@
       } else {
         const isSelected = selected.value.includes(id);
         if (props.mandatory && isSelected) return;
+        if (!isSelected && !value) return;
         selected.value = value ?? !isSelected ? [id] : [];
       }
     }
@@ -4831,7 +4839,7 @@
       const observer = new IntersectionObserver(entries => {
         isIntersecting.value = !!entries.find(entry => entry.isIntersecting);
       }, options);
-      vue.onBeforeUnmount(() => {
+      vue.onScopeDispose(() => {
         observer.disconnect();
       });
       vue.watch(intersectionRef, (newValue, oldValue) => {
@@ -5362,9 +5370,9 @@
 
   function useSelectLink(link, select) {
     vue.watch(() => link.isActive?.value, isActive => {
-      if (link.isLink.value && isActive && select) {
+      if (link.isLink.value && isActive != null && select) {
         vue.nextTick(() => {
-          select(true);
+          select(isActive);
         });
       }
     }, {
@@ -8978,6 +8986,7 @@
       type: IconValue,
       default: '$expand'
     },
+    rawId: [String, Number],
     prependIcon: IconValue,
     appendIcon: IconValue,
     fluid: Boolean,
@@ -8999,13 +9008,12 @@
         open,
         id: _id
       } = useNestedItem(() => props.value, true);
-      const id = vue.computed(() => `v-list-group--id-${String(_id.value)}`);
+      const id = vue.computed(() => `v-list-group--id-${String(props.rawId ?? _id.value)}`);
       const list = useList();
       const {
         isBooted
       } = useSsrBoot();
       function onClick(e) {
-        e.stopPropagation();
         if (['INPUT', 'TEXTAREA'].includes(e.target?.tagName)) return;
         open(!isOpen.value, e);
       }
@@ -9523,9 +9531,10 @@
           }) : undefined
         };
         const listGroupProps = VListGroup.filterProps(itemProps);
-        return children ? vue.createVNode(VListGroup, vue.mergeProps({
-          "value": itemProps?.value
-        }, listGroupProps), {
+        return children ? vue.createVNode(VListGroup, vue.mergeProps(listGroupProps, {
+          "value": props.returnObject ? item : itemProps?.value,
+          "rawId": itemProps?.value
+        }), {
           activator: _ref3 => {
             let {
               props: activatorProps
@@ -9704,7 +9713,7 @@
   function transformItem$2(props, item) {
     const type = getPropertyFromItem(item, props.itemType, 'item');
     const title = isPrimitive(item) ? item : getPropertyFromItem(item, props.itemTitle);
-    const value = getPropertyFromItem(item, props.itemValue, undefined);
+    const value = isPrimitive(item) ? item : getPropertyFromItem(item, props.itemValue, undefined);
     const children = getPropertyFromItem(item, props.itemChildren);
     const itemProps = props.itemProps === true ? omit(item, ['children']) : getPropertyFromItem(item, props.itemProps);
     const _props = {
@@ -12053,6 +12062,16 @@
     }
   });
 
+  function useAutofocus(props) {
+    function onIntersect(isIntersecting, entries) {
+      if (!props.autofocus || !isIntersecting) return;
+      entries[0].target?.focus?.();
+    }
+    return {
+      onIntersect
+    };
+  }
+
   // Types
 
   const activeTypes = ['color', 'file', 'time', 'date', 'datetime-local', 'week', 'month'];
@@ -12099,6 +12118,9 @@
         focus,
         blur
       } = useFocus(props);
+      const {
+        onIntersect
+      } = useAutofocus(props);
       const counterValue = vue.computed(() => {
         return typeof props.counterValue === 'function' ? props.counterValue(model.value) : typeof props.counterValue === 'number' ? props.counterValue : (model.value ?? '').toString().length;
       });
@@ -12108,10 +12130,6 @@
         return props.counter;
       });
       const isPlainOrUnderlined = vue.computed(() => ['plain', 'underlined'].includes(props.variant));
-      function onIntersect(isIntersecting, entries) {
-        if (!props.autofocus || !isIntersecting) return;
-        entries[0].target?.focus?.();
-      }
       const vInputRef = vue.ref();
       const vFieldRef = vue.ref();
       const inputRef = vue.ref();
@@ -15203,6 +15221,7 @@
                 }) : vue.createVNode(VBtn, vue.mergeProps(item, props), null);
               })]
             })]), props.progress && vue.createVNode(VProgressLinear, {
+              "absolute": true,
               "class": "v-carousel__progress",
               "color": typeof props.progress === 'string' ? props.progress : undefined,
               "modelValue": (group.getItemIndex(model.value) + 1) / group.items.value.length * 100
@@ -22083,8 +22102,11 @@
     }, v => adapter.getMonth(v));
     const weekDays = vue.computed(() => {
       const firstDayOfWeek = adapter.toJsDate(adapter.startOfWeek(adapter.date(), props.firstDayOfWeek)).getDay();
-      // Always generate all days, regardless of props.weekdays
-      return [0, 1, 2, 3, 4, 5, 6].map(day => (day + firstDayOfWeek) % 7);
+      return props.weekdays.map(day => (day + firstDayOfWeek) % 7);
+    });
+    const weekdayLabels = vue.computed(() => {
+      const labels = adapter.getWeekdays(props.firstDayOfWeek);
+      return weekDays.value.map(day => labels[day]);
     });
     const weeksInMonth = vue.computed(() => {
       const weeks = adapter.getWeekArray(month.value, props.firstDayOfWeek);
@@ -22165,7 +22187,7 @@
       if (typeof props.allowedDates === 'function') {
         return !props.allowedDates(date);
       }
-      return !props.weekdays.includes(adapter.toJsDate(date).getDay());
+      return false;
     }
     return {
       displayValue,
@@ -22175,6 +22197,7 @@
       model,
       weeksInMonth,
       weekDays,
+      weekdayLabels,
       weekNumbers
     };
   }
@@ -22213,7 +22236,9 @@
       const {
         daysInMonth,
         model,
-        weekNumbers
+        weekNumbers,
+        weekDays,
+        weekdayLabels
       } = useCalendar(props);
       const adapter = useDate();
       const rangeStart = vue.shallowRef();
@@ -22285,7 +22310,10 @@
         }
       }
       useRender(() => vue.createElementVNode("div", {
-        "class": "v-date-picker-month"
+        "class": "v-date-picker-month",
+        "style": {
+          '--v-date-picker-days-in-week': weekDays.value.length
+        }
       }, [props.showWeek && vue.createElementVNode("div", {
         "key": "weeks",
         "class": "v-date-picker-month__weeks"
@@ -22301,7 +22329,7 @@
           "ref": daysRef,
           "key": daysInMonth.value[0].date?.toString(),
           "class": "v-date-picker-month__days"
-        }, [!props.hideWeekdays && adapter.getWeekdays(props.firstDayOfWeek).map(weekDay => vue.createElementVNode("div", {
+        }, [!props.hideWeekdays && weekdayLabels.value.map(weekDay => vue.createElementVNode("div", {
           "class": vue.normalizeClass(['v-date-picker-month__day', 'v-date-picker-month__weekday'])
         }, [weekDay])), daysInMonth.value.map((item, i) => {
           const slotProps = {
@@ -22477,9 +22505,7 @@
       const yearRef = templateRef();
       vue.onMounted(async () => {
         await vue.nextTick();
-        yearRef.el?.scrollIntoView({
-          block: 'center'
-        });
+        yearRef.el?.focus();
       });
       function isYearAllowed(year) {
         if (Array.isArray(props.allowedYears) && props.allowedYears.length) {
@@ -22615,8 +22641,16 @@
         return value && adapter.isValid(value) ? value : today;
       });
       const headerColor = vue.toRef(() => props.headerColor ?? props.color);
-      const month = vue.ref(Number(props.month ?? adapter.getMonth(adapter.startOfMonth(internal.value))));
-      const year = vue.ref(Number(props.year ?? adapter.getYear(adapter.startOfYear(adapter.setMonth(internal.value, month.value)))));
+      const _month = useProxiedModel(props, 'month');
+      const month = vue.computed({
+        get: () => Number(_month.value ?? adapter.getMonth(adapter.startOfMonth(internal.value))),
+        set: v => _month.value = v
+      });
+      const _year = useProxiedModel(props, 'year');
+      const year = vue.computed({
+        get: () => Number(_year.value ?? adapter.getYear(adapter.startOfYear(adapter.setMonth(internal.value, month.value)))),
+        set: v => _year.value = v
+      });
       const isReversing = vue.shallowRef(false);
       const header = vue.computed(() => {
         if (props.multiple && model.value.length > 1) {
@@ -22700,9 +22734,9 @@
         } else {
           year.value++;
           month.value = 0;
-          onUpdateYear(year.value);
+          onUpdateYear();
         }
-        onUpdateMonth(month.value);
+        onUpdateMonth();
       }
       function onClickPrev() {
         if (month.value > 0) {
@@ -22710,9 +22744,9 @@
         } else {
           year.value--;
           month.value = 11;
-          onUpdateYear(year.value);
+          onUpdateYear();
         }
-        onUpdateMonth(month.value);
+        onUpdateMonth();
       }
       function onClickDate() {
         viewMode.value = 'month';
@@ -22723,13 +22757,11 @@
       function onClickYear() {
         viewMode.value = viewMode.value === 'year' ? 'month' : 'year';
       }
-      function onUpdateMonth(value) {
+      function onUpdateMonth() {
         if (viewMode.value === 'months') onClickMonth();
-        emit('update:month', value);
       }
-      function onUpdateYear(value) {
+      function onUpdateYear() {
         if (viewMode.value === 'year') onClickYear();
-        emit('update:year', value);
       }
       vue.watch(model, (val, oldVal) => {
         const arrBefore = wrapInArray(oldVal);
@@ -22741,11 +22773,11 @@
         const newYear = adapter.getYear(after);
         if (newMonth !== month.value) {
           month.value = newMonth;
-          onUpdateMonth(month.value);
+          onUpdateMonth();
         }
         if (newYear !== year.value) {
           year.value = newYear;
-          onUpdateYear(year.value);
+          onUpdateYear();
         }
         isReversing.value = adapter.isBefore(before, after);
       });
@@ -24899,6 +24931,8 @@
     function holdStart(value) {
       holdStop();
       tick(value);
+      window.addEventListener('pointerup', holdStop);
+      document.addEventListener('blur', holdStop);
       timeout = window.setTimeout(() => {
         interval = window.setInterval(() => tick(value), HOLD_REPEAT);
       }, HOLD_DELAY);
@@ -24906,6 +24940,8 @@
     function holdStop() {
       window.clearTimeout(timeout);
       window.clearInterval(interval);
+      window.removeEventListener('pointerup', holdStop);
+      document.removeEventListener('blur', holdStop);
     }
     function tick(value) {
       toggleUpDown(value === 'up');
@@ -25017,7 +25053,7 @@
           onClick: onControlClick,
           onPointerup: onControlMouseup,
           onPointerdown: onUpControlMousedown,
-          onPointercancel: onControlPointerCancel
+          onPointercancel: onControlMouseup
         }
       };
       const decrementSlotProps = {
@@ -25025,7 +25061,7 @@
           onClick: onControlClick,
           onPointerup: onControlMouseup,
           onPointerdown: onDownControlMousedown,
-          onPointercancel: onControlPointerCancel
+          onPointercancel: onControlMouseup
         }
       };
       vue.watch(() => props.precision, () => formatInputValue());
@@ -25105,7 +25141,6 @@
         const el = e.currentTarget;
         el?.releasePointerCapture(e.pointerId);
         e.preventDefault();
-        e.stopPropagation();
         holdStop();
       }
       function onUpControlMousedown(e) {
@@ -25122,11 +25157,6 @@
         e.stopPropagation();
         holdStart('down');
       }
-      function onControlPointerCancel(e) {
-        const el = e.currentTarget;
-        el?.releasePointerCapture(e.pointerId);
-        holdStop();
-      }
       function clampModel() {
         if (controlsDisabled.value) return;
         if (!vTextFieldRef.value) return;
@@ -25176,7 +25206,7 @@
             "onClick": onControlClick,
             "onPointerdown": onUpControlMousedown,
             "onPointerup": onControlMouseup,
-            "onPointercancel": onControlPointerCancel,
+            "onPointercancel": onControlMouseup,
             "size": controlNodeSize.value,
             "tabindex": "-1"
           }, null) : vue.createVNode(VDefaultsProvider, {
@@ -25206,7 +25236,7 @@
             "onClick": onControlClick,
             "onPointerdown": onDownControlMousedown,
             "onPointerup": onControlMouseup,
-            "onPointercancel": onControlPointerCancel,
+            "onPointercancel": onControlMouseup,
             "size": controlNodeSize.value,
             "tabindex": "-1"
           }, null) : vue.createVNode(VDefaultsProvider, {
@@ -25353,6 +25383,21 @@
       const contentRef = vue.ref();
       const inputRef = vue.ref([]);
       const current = vue.computed(() => inputRef.value[focusIndex.value]);
+      const intersectScope = vue.effectScope();
+      intersectScope.run(() => {
+        const {
+          intersectionRef,
+          isIntersecting
+        } = useIntersectionObserver();
+        vue.watch(isIntersecting, v => {
+          if (!v) return;
+          intersectionRef.value?.focus();
+          intersectScope.stop();
+        });
+        vue.watchEffect(() => {
+          intersectionRef.value = inputRef.value[0];
+        });
+      });
       function onInput() {
         // The maxlength attribute doesn't work for the number type input, so the text type is used.
         // The following logic simulates the behavior of a number input.
@@ -28099,6 +28144,9 @@
         focus,
         blur
       } = useFocus(props);
+      const {
+        onIntersect
+      } = useAutofocus(props);
       const counterValue = vue.computed(() => {
         return typeof props.counterValue === 'function' ? props.counterValue(model.value) : (model.value || '').toString().length;
       });
@@ -28107,10 +28155,6 @@
         if (!props.counter || typeof props.counter !== 'number' && typeof props.counter !== 'string') return undefined;
         return props.counter;
       });
-      function onIntersect(isIntersecting, entries) {
-        if (!props.autofocus || !isIntersecting) return;
-        entries[0].target?.focus?.();
-      }
       const vInputRef = vue.ref();
       const vFieldRef = vue.ref();
       const controlHeight = vue.shallowRef('');
@@ -29827,6 +29871,7 @@
           "class": "v-file-upload-item"
         }), {
           ...slots,
+          title: () => props?.title ?? props.file?.name,
           prepend: slotProps => vue.createElementVNode(vue.Fragment, null, [!slots.prepend ? vue.createVNode(VAvatar, {
             "icon": props.fileIcon,
             "image": preview.value,
@@ -30675,6 +30720,7 @@
       const isDragging = vue.ref(false);
       const valueOnMouseDown = vue.ref(null);
       const valueOnMouseUp = vue.ref(null);
+      const emitChangeDebounced = debounce(value => emit('change', value), 750);
       const {
         textColorClasses,
         textColorStyles
@@ -30720,6 +30766,7 @@
         if (value !== props.displayedValue) {
           update(value);
         }
+        emitChangeDebounced(value);
       }
       function isInner(value) {
         return props.double && value - props.min >= roundCount.value;
@@ -31320,6 +31367,7 @@
       }
       function onClickAction(e) {
         e.preventDefault();
+        e.stopPropagation();
         emit('toggleExpand', e);
       }
       useRender(() => {
@@ -31465,7 +31513,8 @@
         const treeviewGroupProps = VTreeviewGroup.filterProps(itemProps);
         const treeviewChildrenProps = VTreeviewChildren.filterProps(props);
         return children ? vue.createVNode(VTreeviewGroup, vue.mergeProps(treeviewGroupProps, {
-          "value": props.returnObject ? item.raw : treeviewGroupProps?.value
+          "value": props.returnObject ? item.raw : treeviewGroupProps?.value,
+          "rawId": treeviewGroupProps?.value
         }), {
           activator: _ref2 => {
             let {
@@ -32153,7 +32202,7 @@
       };
     });
   }
-  const version$1 = "3.8.9";
+  const version$1 = "3.8.11";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -32451,7 +32500,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.8.9";
+  const version = "3.8.11";
 
   /* eslint-disable local-rules/sort-imports */