vuetify 3.3.19 → 3.3.21

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.3.19
+* Vuetify v3.3.21
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -267,6 +267,10 @@
     let char = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '0';
     return str + char.repeat(Math.max(0, length - 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;
+  }
   function chunk(str) {
     let size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
     const chunked = [];
@@ -6293,7 +6297,7 @@
     const isDisabled = vue.computed(() => !!(props.disabled ?? form?.isDisabled.value));
     const isReadonly = vue.computed(() => !!(props.readonly ?? form?.isReadonly.value));
     const errorMessages = vue.computed(() => {
-      return props.errorMessages.length ? wrapInArray(props.errorMessages).slice(0, Math.max(0, +props.maxErrors)) : internalErrorMessages.value;
+      return props.errorMessages?.length ? wrapInArray(props.errorMessages).slice(0, Math.max(0, +props.maxErrors)) : internalErrorMessages.value;
     });
     const validateOn = vue.computed(() => {
       let value = (props.validateOn ?? form?.validateOn.value) || 'input';
@@ -6307,7 +6311,7 @@
       };
     });
     const isValid = vue.computed(() => {
-      if (props.error || props.errorMessages.length) return false;
+      if (props.error || props.errorMessages?.length) return false;
       if (!props.rules.length) return true;
       if (isPristine.value) {
         return internalErrorMessages.value.length || validateOn.value.lazy ? null : true;
@@ -9803,7 +9807,7 @@
         }
 
         // Skip internal properties
-        if (typeof key === 'symbol' || key.startsWith('__')) return;
+        if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return;
         for (const ref of refs) {
           if (ref.value && Reflect.has(ref.value, key)) {
             const val = Reflect.get(ref.value, key);
@@ -9817,7 +9821,7 @@
         }
 
         // Skip internal properties
-        if (typeof key === 'symbol' || key.startsWith('__')) return false;
+        if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return false;
         for (const ref of refs) {
           if (ref.value && Reflect.has(ref.value, key)) {
             return true;
@@ -9831,7 +9835,7 @@
         }
 
         // Skip internal properties
-        if (typeof key === 'symbol' || key.startsWith('__')) return false;
+        if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return false;
         for (const ref of refs) {
           if (ref.value && Reflect.has(ref.value, key)) {
             return Reflect.set(ref.value, key, value);
@@ -9844,7 +9848,7 @@
         if (descriptor) return descriptor;
 
         // Skip internal properties
-        if (typeof key === 'symbol' || key.startsWith('__')) return;
+        if (typeof key === 'symbol' || key.startsWith('$') || key.startsWith('__')) return;
 
         // Check each ref's own properties
         for (const ref of refs) {
@@ -10457,7 +10461,7 @@
         }
       }
       useRender(() => {
-        const hasCounter = !!(slots.counter || props.counter || props.counterValue);
+        const hasCounter = !!(slots.counter || props.counter !== false && props.counter != null);
         const hasDetails = !!(hasCounter || slots.details);
         const [rootAttrs, inputAttrs] = filterInputAttrs(attrs);
         const [{
@@ -13130,6 +13134,7 @@
             x,
             y
           } = val;
+          _dotPosition.value = val;
           emit('update:color', {
             h: props.color?.h ?? 0,
             s: clamp(x, 0, canvasWidth.value) / canvasWidth.value,
@@ -13624,13 +13629,8 @@
       isRtl
     } = useRtl();
     const isReversed = vue.toRef(props, 'reverse');
-    const horizontalDirection = vue.computed(() => {
-      let hd = isRtl.value ? 'rtl' : 'ltr';
-      if (props.reverse) {
-        hd = hd === 'rtl' ? 'ltr' : 'rtl';
-      }
-      return hd;
-    });
+    const vertical = vue.computed(() => props.direction === 'vertical');
+    const indexFromEnd = vue.computed(() => vertical.value !== isReversed.value);
     const {
       min,
       max,
@@ -13643,7 +13643,6 @@
     const trackSize = vue.computed(() => parseInt(props.trackSize, 10));
     const numTicks = vue.computed(() => (max.value - min.value) / step.value);
     const disabled = vue.toRef(props, 'disabled');
-    const vertical = vue.computed(() => props.direction === 'vertical');
     const thumbColor = vue.computed(() => props.error || props.disabled ? undefined : props.thumbColor ?? props.color);
     const trackColor = vue.computed(() => props.error || props.disabled ? undefined : props.trackColor ?? props.color);
     const trackFillColor = vue.computed(() => props.error || props.disabled ? undefined : props.trackFillColor ?? props.color);
@@ -13664,7 +13663,7 @@
 
       // It is possible for left to be NaN, force to number
       let clickPos = Math.min(Math.max((clickOffset - trackStart - startOffset.value) / trackLength, 0), 1) || 0;
-      if (vertical || horizontalDirection.value === 'rtl') clickPos = 1 - clickPos;
+      if (vertical ? indexFromEnd.value : indexFromEnd.value !== isRtl.value) clickPos = 1 - clickPos;
       return roundValue(min.value + clickPos * (max.value - min.value));
     }
     const handleStop = e => {
@@ -13768,8 +13767,8 @@
       direction: vue.toRef(props, 'direction'),
       elevation: vue.toRef(props, 'elevation'),
       hasLabels,
-      horizontalDirection,
       isReversed,
+      indexFromEnd,
       min,
       max,
       mousePressed,
@@ -13842,23 +13841,24 @@
       } = _ref;
       const slider = vue.inject(VSliderSymbol);
       const {
+        isRtl,
         rtlClasses
       } = useRtl();
       if (!slider) throw new Error('[Vuetify] v-slider-thumb must be used inside v-slider or v-range-slider');
       const {
         thumbColor,
         step,
-        vertical,
         disabled,
         thumbSize,
         thumbLabel,
         direction,
+        isReversed,
+        vertical,
         readonly,
         elevation,
-        isReversed,
-        horizontalDirection,
         mousePressed,
-        decimals
+        decimals,
+        indexFromEnd
       } = slider;
       const {
         textColorClasses,
@@ -13884,7 +13884,7 @@
         const _step = step.value || 0.1;
         const steps = (props.max - props.min) / _step;
         if ([left, right, down, up].includes(e.key)) {
-          const increase = horizontalDirection.value === 'rtl' ? [left, up] : [right, up];
+          const increase = vertical.value ? [isRtl.value ? left : right, isReversed.value ? down : up] : indexFromEnd.value !== isRtl.value ? [left, up] : [right, up];
           const direction = increase.includes(e.key) ? 1 : -1;
           const multiplier = e.shiftKey ? 2 : e.ctrlKey ? 1 : 0;
           value = value + direction * _step * multipliers.value[multiplier];
@@ -13903,7 +13903,7 @@
         newValue != null && emit('update:modelValue', newValue);
       }
       useRender(() => {
-        const positionPercentage = convertToUnit(vertical.value || isReversed.value ? 100 - props.position : props.position, '%');
+        const positionPercentage = convertToUnit(indexFromEnd.value ? 100 - props.position : props.position, '%');
         const {
           elevationClasses
         } = useElevation(vue.computed(() => !disabled.value ? elevation.value : undefined));
@@ -13976,7 +13976,6 @@
       if (!slider) throw new Error('[Vuetify] v-slider-track must be inside v-slider or v-range-slider');
       const {
         color,
-        horizontalDirection,
         parsedTicks,
         rounded,
         showTicks,
@@ -13986,7 +13985,8 @@
         trackSize,
         vertical,
         min,
-        max
+        max,
+        indexFromEnd
       } = slider;
       const {
         roundedClasses
@@ -13999,7 +13999,7 @@
         backgroundColorClasses: trackColorClasses,
         backgroundColorStyles: trackColorStyles
       } = useBackgroundColor(trackColor);
-      const startDir = vue.computed(() => `inset-${vertical.value ? 'block-end' : 'inline-start'}`);
+      const startDir = vue.computed(() => `inset-${vertical.value ? 'block' : 'inline'}-${indexFromEnd.value ? 'end' : 'start'}`);
       const endDir = vue.computed(() => vertical.value ? 'height' : 'width');
       const backgroundStyles = vue.computed(() => {
         return {
@@ -14018,7 +14018,6 @@
         if (!showTicks.value) return [];
         const ticks = vertical.value ? parsedTicks.value.slice().reverse() : parsedTicks.value;
         return ticks.map((tick, index) => {
-          const directionProperty = vertical.value ? 'bottom' : 'margin-inline-start';
           const directionValue = tick.value !== min.value && tick.value !== max.value ? convertToUnit(tick.position, '%') : undefined;
           return vue.createVNode("div", {
             "key": tick.value,
@@ -14028,7 +14027,7 @@
               'v-slider-track__tick--last': tick.value === max.value
             }],
             "style": {
-              [directionProperty]: directionValue
+              [startDir.value]: directionValue
             }
           }, [(tick.label || slots['tick-label']) && vue.createVNode("div", {
             "class": "v-slider-track__tick-label"
@@ -14043,8 +14042,7 @@
           "class": ['v-slider-track', roundedClasses.value, props.class],
           "style": [{
             '--v-slider-track-size': convertToUnit(trackSize.value),
-            '--v-slider-tick-size': convertToUnit(tickSize.value),
-            direction: !vertical.value ? horizontalDirection.value : undefined
+            '--v-slider-tick-size': convertToUnit(tickSize.value)
           }, props.style]
         }, [vue.createVNode("div", {
           "class": ['v-slider-track__background', trackColorClasses.value, {
@@ -14931,7 +14929,7 @@
           return _search.value;
         },
         set: val => {
-          _search.value = val;
+          _search.value = val ?? '';
           if (!props.multiple) {
             model.value = [transformItem$3(props, val)];
           }
@@ -16965,15 +16963,15 @@
       });
       const isTemporary = vue.computed(() => !props.permanent && (mobile.value || props.temporary));
       const isSticky = vue.computed(() => props.sticky && !isTemporary.value && location.value !== 'bottom');
-      if (props.expandOnHover && props.rail != null) {
+      useToggleScope(() => props.expandOnHover && props.rail != null, () => {
         vue.watch(isHovering, val => emit('update:rail', !val));
-      }
-      if (!props.disableResizeWatcher) {
+      });
+      useToggleScope(() => !props.disableResizeWatcher, () => {
         vue.watch(isTemporary, val => !props.permanent && vue.nextTick(() => isActive.value = !val));
-      }
-      if (!props.disableRouteWatcher && router) {
+      });
+      useToggleScope(() => !props.disableRouteWatcher && !!router, () => {
         vue.watch(router.currentRoute, () => isTemporary.value && (isActive.value = false));
-      }
+      });
       vue.watch(() => props.permanent, val => {
         if (val) isActive.value = true;
       });
@@ -20014,7 +20012,7 @@
         items,
         value
       } = _ref;
-      return new Set(value ? [vue.toRaw(items[0]?.value)] : []);
+      return new Set(value ? [items[0]?.value] : []);
     },
     selectAll: _ref2 => {
       let {
@@ -20038,7 +20036,7 @@
         selected
       } = _ref4;
       for (const item of items) {
-        if (value) selected.add(vue.toRaw(item.value));else selected.delete(vue.toRaw(item.value));
+        if (value) selected.add(item.value);else selected.delete(item.value);
       }
       return selected;
     },
@@ -20070,7 +20068,7 @@
         selected
       } = _ref7;
       for (const item of items) {
-        if (value) selected.add(vue.toRaw(item.value));else selected.delete(vue.toRaw(item.value));
+        if (value) selected.add(item.value);else selected.delete(item.value);
       }
       return selected;
     },
@@ -20130,10 +20128,10 @@
       }
     });
     function isSelected(items) {
-      return wrapInArray(items).every(item => selected.value.has(vue.toRaw(item.value)));
+      return wrapInArray(items).every(item => selected.value.has(item.value));
     }
     function isSomeSelected(items) {
-      return wrapInArray(items).some(item => selected.value.has(vue.toRaw(item.value)));
+      return wrapInArray(items).some(item => selected.value.has(item.value));
     }
     function select(items, value) {
       const newSelected = selectStrategy.value.select({
@@ -20536,10 +20534,18 @@
         itemsPerPage,
         setItemsPerPage
       } = usePagination();
-      const itemsPerPageOptions = vue.computed(() => props.itemsPerPageOptions.map(option => ({
-        ...option,
-        title: t(option.title)
-      })));
+      const itemsPerPageOptions = vue.computed(() => props.itemsPerPageOptions.map(option => {
+        if (typeof option === 'number') {
+          return {
+            value: option,
+            title: option === -1 ? t('$vuetify.dataFooter.itemsPerPageAll') : String(option)
+          };
+        }
+        return {
+          ...option,
+          title: t(option.title)
+        };
+      }));
       return () => vue.createVNode("div", {
         "class": "v-data-table-footer"
       }, [slots.prepend?.(), vue.createVNode("div", {
@@ -21587,7 +21593,7 @@
           }, [vue.createVNode("td", {
             "colspan": columns.value.length,
             "style": {
-              height: convertToUnit(paddingTop.value),
+              height: 0,
               border: 0
             }
           }, null)]), vue.createVNode(VDataTableRows, vue.mergeProps(dataTableRowsProps, {
@@ -21595,9 +21601,9 @@
           }), {
             ...slots,
             item: itemSlotProps => vue.createVNode(VVirtualScrollItem, {
-              "key": itemSlotProps.item.index,
+              "key": itemSlotProps.internalItem.index,
               "renderless": true,
-              "onUpdate:height": height => handleItemResize(itemSlotProps.item.index, height)
+              "onUpdate:height": height => handleItemResize(itemSlotProps.internalItem.index, height)
             }, {
               default: _ref2 => {
                 let {
@@ -21608,7 +21614,7 @@
                   itemRef
                 }) ?? vue.createVNode(VDataTableRow, vue.mergeProps(itemSlotProps.props, {
                   "ref": itemRef,
-                  "key": itemSlotProps.item.index
+                  "key": itemSlotProps.internalItem.index
                 }), slots);
               }
             })
@@ -21620,7 +21626,7 @@
           }, [vue.createVNode("td", {
             "colspan": columns.value.length,
             "style": {
-              height: convertToUnit(paddingBottom.value),
+              height: 0,
               border: 0
             }
           }, null)])])])]),
@@ -22170,6 +22176,17 @@
     }
     return new Intl.DateTimeFormat(locale, options).format(date);
   }
+  function toISO(adapter, value) {
+    const date = adapter.toJsDate(value);
+    const year = date.getFullYear();
+    const month = padStart(String(date.getMonth() + 1), 2, '0');
+    const day = padStart(String(date.getDate()), 2, '0');
+    return `${year}-${month}-${day}`;
+  }
+  function parseISO(value) {
+    const [year, month, day] = value.split('-').map(Number);
+    return new Date(year, month - 1, day);
+  }
   function addDays(date, amount) {
     const d = new Date(date);
     d.setDate(d.getDate() + amount);
@@ -22244,6 +22261,12 @@
     toJsDate(date) {
       return date;
     }
+    toISO(date) {
+      return toISO(this, date);
+    }
+    parseISO(date) {
+      return parseISO(date);
+    }
     addDays(date, amount) {
       return addDays(date, amount);
     }
@@ -22345,7 +22368,7 @@
         lv: 'lv-LV',
         lt: 'lt-LT',
         nl: 'nl-NL',
-        no: 'nn-NO',
+        no: 'no-NO',
         pl: 'pl-PL',
         pt: 'pt-PT',
         ro: 'ro-RO',
@@ -22524,6 +22547,7 @@
   }
 
   const makeVDatePickerMonthProps = propsFactory({
+    allowedDates: [Array, Function],
     color: String,
     showAdjacentMonths: Boolean,
     hideWeekdays: Boolean,
@@ -22610,7 +22634,6 @@
         const startDate = validDates[0];
         const endDate = validDates[1];
         return days.map((date, index) => {
-          const isDisabled = !!(props.min && adapter.isAfter(props.min, date) || props.max && adapter.isAfter(date, props.max));
           const isStart = startDate && adapter.isSameDay(date, startDate);
           const isEnd = endDate && adapter.isSameDay(date, endDate);
           const isAdjacent = !adapter.isSameMonth(date, month.value);
@@ -22621,7 +22644,7 @@
             formatted: adapter.format(date, 'keyboardDate'),
             year: adapter.getYear(date),
             month: adapter.getMonth(date),
-            isDisabled,
+            isDisabled: isDisabled(date),
             isWeekStart: index % 7 === 0,
             isWeekEnd: index % 7 === 6,
             isSelected: isStart || isEnd,
@@ -22648,6 +22671,18 @@
         backgroundColorClasses,
         backgroundColorStyles
       } = useBackgroundColor(props, 'color');
+      function isDisabled(value) {
+        const date = adapter.date(value);
+        if (props.min && adapter.isAfter(props.min, date)) return true;
+        if (props.max && adapter.isAfter(date, props.max)) return true;
+        if (Array.isArray(props.allowedDates)) {
+          return !props.allowedDates.some(d => adapter.isSameDay(adapter.date(d), date));
+        }
+        if (typeof props.allowedDates === 'function') {
+          return !props.allowedDates(date);
+        }
+        return false;
+      }
       function selectDate(date) {
         let newModel = props.modelValue.slice();
         if (props.multiple) {
@@ -23552,7 +23587,7 @@
     placeholder: String,
     type: {
       type: String,
-      default: 'text'
+      default: 'number'
     },
     ...makeDimensionProps(),
     ...makeFocusProps(),
@@ -23598,7 +23633,7 @@
         model.value = array;
         let target = null;
         if (focusIndex.value > model.value.length) {
-          target = model.value.length + 1;
+          target = model.value.length;
         } else if (focusIndex.value + 1 !== Number(props.length)) {
           target = 'next';
         } else {
@@ -23623,7 +23658,7 @@
             target = 'prev';
           } else {
             requestAnimationFrame(() => {
-              inputRef.value[index].select();
+              inputRef.value[index]?.select();
             });
           }
         }
@@ -23652,6 +23687,9 @@
       }
       provideDefaults({
         VField: {
+          color: vue.computed(() => props.color),
+          bgColor: vue.computed(() => props.color),
+          baseColor: vue.computed(() => props.baseColor),
           disabled: vue.computed(() => props.disabled),
           error: vue.computed(() => props.error),
           variant: vue.computed(() => props.variant)
@@ -23667,7 +23705,7 @@
       vue.watch(focusIndex, val => {
         if (val < 0) return;
         IN_BROWSER && window.requestAnimationFrame(() => {
-          inputRef.value[val].select();
+          inputRef.value[val]?.select();
         });
       });
       useRender(() => {
@@ -23762,6 +23800,7 @@
     'list-item-avatar-two-line': 'avatar, sentences',
     'list-item-three-line': 'paragraph',
     'list-item-avatar-three-line': 'avatar, paragraph',
+    ossein: 'ossein',
     paragraph: 'text@3',
     sentences: 'text@2',
     subtitle: 'text',
@@ -23826,7 +23865,7 @@
     },
     type: {
       type: [String, Array],
-      default: 'image'
+      default: 'ossein'
     },
     ...makeDimensionProps(),
     ...makeElevationProps(),
@@ -24618,7 +24657,7 @@
       date
     };
   }
-  const version$1 = "3.3.19";
+  const version$1 = "3.3.21";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -24632,7 +24671,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.3.19";
+  const version = "3.3.21";
 
   /* eslint-disable local-rules/sort-imports */