vuetify 3.3.17 → 3.3.19

package/dist/vuetify-labs.esm.js

@@ -1,10 +1,10 @@
 /*!
-* Vuetify v3.3.17
+* Vuetify v3.3.19
 * Forged by John Leider
 * Released under the MIT License.
 */
 
-import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, watch, readonly, onDeactivated, onActivated, onMounted, onScopeDispose, effectScope, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onBeforeUpdate, vModelText, withModifiers } from 'vue';
+import { Fragment, reactive, computed, watchEffect, toRefs, capitalize, warn, ref, unref, provide, shallowRef, inject as inject$1, defineComponent as defineComponent$1, camelize, h, getCurrentInstance as getCurrentInstance$1, onBeforeUnmount, watch, readonly, onDeactivated, onActivated, onMounted, onScopeDispose, effectScope, toRaw, createVNode, TransitionGroup, Transition, mergeProps, onBeforeMount, nextTick, withDirectives, resolveDirective, vShow, isRef, toRef, Text, resolveDynamicComponent, Teleport, cloneVNode, createTextVNode, onBeforeUpdate, vModelText, withModifiers, toDisplayString } from 'vue';
 
 // Types
 // eslint-disable-line vue/prefer-import-from-vue
@@ -123,7 +123,8 @@ function getObjectValueByPath(obj, path, fallback) {
   return getNestedValue(obj, path.split('.'), fallback);
 }
 function getPropertyFromItem(item, property, fallback) {
-  if (property == null) return item === undefined ? fallback : item;
+  if (property === true) return item === undefined ? fallback : item;
+  if (property == null || typeof property === 'boolean') return fallback;
   if (item !== Object(item)) {
     if (typeof property !== 'function') return fallback;
     const value = property(item, fallback);
@@ -7887,7 +7888,8 @@ const VDivider = genericComponent()({
 // Types
 
 const makeVListChildrenProps = propsFactory({
-  items: Array
+  items: Array,
+  returnObject: Boolean
 }, 'VListChildren');
 const VListChildren = genericComponent()({
   name: 'VListChildren',
@@ -7940,19 +7942,23 @@ const VListChildren = genericComponent()({
           let {
             props: activatorProps
           } = _ref3;
+          const listItemProps = {
+            ...itemProps,
+            ...activatorProps,
+            value: props.returnObject ? item : itemProps.value
+          };
           return slots.header ? slots.header({
-            props: {
-              ...itemProps,
-              ...activatorProps
-            }
-          }) : createVNode(VListItem, mergeProps(itemProps, activatorProps), slotsWithItem);
+            props: listItemProps
+          }) : createVNode(VListItem, listItemProps, slotsWithItem);
         },
         default: () => createVNode(VListChildren, {
           "items": children
         }, slots)
       }) : slots.item ? slots.item({
         props: itemProps
-      }) : createVNode(VListItem, itemProps, slotsWithItem);
+      }) : createVNode(VListItem, mergeProps(itemProps, {
+        "value": props.returnObject ? item : itemProps.value
+      }), slotsWithItem);
     });
   }
 });
@@ -8236,7 +8242,8 @@ const VList = genericComponent()({
         "onKeydown": onKeydown
       }, {
         default: () => [createVNode(VListChildren, {
-          "items": items.value
+          "items": items.value,
+          "returnObject": props.returnObject
         }, slots)]
       });
     });
@@ -10353,7 +10360,7 @@ const activeTypes = ['color', 'file', 'time', 'date', 'datetime-local', 'week',
 const makeVTextFieldProps = propsFactory({
   autofocus: Boolean,
   counter: [Boolean, Number, String],
-  counterValue: Function,
+  counterValue: [Number, Function],
   prefix: String,
   placeholder: String,
   persistentPlaceholder: Boolean,
@@ -10394,7 +10401,7 @@ const VTextField = genericComponent()({
       blur
     } = useFocus(props);
     const counterValue = computed(() => {
-      return typeof props.counterValue === 'function' ? props.counterValue(model.value) : (model.value ?? '').toString().length;
+      return typeof props.counterValue === 'function' ? props.counterValue(model.value) : typeof props.counterValue === 'number' ? props.counterValue : (model.value ?? '').toString().length;
     });
     const max = computed(() => {
       if (attrs.maxlength) return attrs.maxlength;
@@ -11048,6 +11055,7 @@ const VSelect = genericComponent()({
         "focused": isFocused.value,
         "onUpdate:focused": $event => isFocused.value = $event,
         "validationValue": model.externalValue,
+        "counterValue": model.value.length,
         "dirty": isDirty,
         "class": ['v-select', {
           'v-select--active-menu': menu.value,
@@ -11154,7 +11162,8 @@ const VSelect = genericComponent()({
             "key": "chip",
             "closable": props.closableChips,
             "size": "small",
-            "text": item.title
+            "text": item.title,
+            "disabled": item.props.disabled
           }, slotProps), null) : createVNode(VDefaultsProvider, {
             "key": "chip-defaults",
             "defaults": {
@@ -11451,7 +11460,7 @@ const VAutocomplete = genericComponent()({
         }
         const originalSelectionIndex = selectionIndex.value;
         const selectedItem = model.value[selectionIndex.value];
-        if (selectedItem) select(selectedItem);
+        if (selectedItem && !selectedItem.props.disabled) select(selectedItem);
         selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
       }
       if (e.key === 'ArrowLeft') {
@@ -11571,6 +11580,7 @@ const VAutocomplete = genericComponent()({
         "focused": isFocused.value,
         "onUpdate:focused": $event => isFocused.value = $event,
         "validationValue": model.externalValue,
+        "counterValue": model.value.length,
         "dirty": isDirty,
         "onInput": onInput,
         "onChange": onChange,
@@ -11681,7 +11691,8 @@ const VAutocomplete = genericComponent()({
             "key": "chip",
             "closable": props.closableChips,
             "size": "small",
-            "text": item.title
+            "text": item.title,
+            "disabled": item.props.disabled
           }, slotProps), null) : createVNode(VDefaultsProvider, {
             "key": "chip-defaults",
             "defaults": {
@@ -15020,7 +15031,7 @@ const VCombobox = genericComponent()({
         }
         const originalSelectionIndex = selectionIndex.value;
         const selectedItem = model.value[selectionIndex.value];
-        if (selectedItem) select(selectedItem);
+        if (selectedItem && !selectedItem.props.disabled) select(selectedItem);
         selectionIndex.value = originalSelectionIndex >= length - 1 ? length - 2 : originalSelectionIndex;
       }
       if (e.key === 'ArrowLeft') {
@@ -15128,6 +15139,7 @@ const VCombobox = genericComponent()({
         "focused": isFocused.value,
         "onUpdate:focused": $event => isFocused.value = $event,
         "validationValue": model.externalValue,
+        "counterValue": props.multiple ? model.value.length : search.value.length,
         "dirty": isDirty,
         "class": ['v-combobox', {
           'v-combobox--active-menu': menu.value,
@@ -15237,7 +15249,8 @@ const VCombobox = genericComponent()({
             "key": "chip",
             "closable": props.closableChips,
             "size": "small",
-            "text": item.title
+            "text": item.title,
+            "disabled": item.props.disabled
           }, slotProps), null) : createVNode(VDefaultsProvider, {
             "key": "chip-defaults",
             "defaults": {
@@ -19609,7 +19622,8 @@ const VBottomSheet = genericComponent()({
         "onUpdate:modelValue": $event => isActive.value = $event,
         "class": ['v-bottom-sheet', {
           'v-bottom-sheet--inset': props.inset
-        }]
+        }, props.class],
+        "style": props.style
       }), slots);
     });
     return {};
@@ -19996,7 +20010,7 @@ const singleSelectStrategy = {
       items,
       value
     } = _ref;
-    return new Set(value ? [items[0]?.value] : []);
+    return new Set(value ? [toRaw(items[0]?.value)] : []);
   },
   selectAll: _ref2 => {
     let {
@@ -20020,7 +20034,7 @@ const pageSelectStrategy = {
       selected
     } = _ref4;
     for (const item of items) {
-      if (value) selected.add(item.value);else selected.delete(item.value);
+      if (value) selected.add(toRaw(item.value));else selected.delete(toRaw(item.value));
     }
     return selected;
   },
@@ -20052,7 +20066,7 @@ const allSelectStrategy = {
       selected
     } = _ref7;
     for (const item of items) {
-      if (value) selected.add(item.value);else selected.delete(item.value);
+      if (value) selected.add(toRaw(item.value));else selected.delete(toRaw(item.value));
     }
     return selected;
   },
@@ -20078,6 +20092,10 @@ const makeDataTableSelectProps = propsFactory({
   modelValue: {
     type: Array,
     default: () => []
+  },
+  valueComparator: {
+    type: Function,
+    default: deepEqual
   }
 }, 'DataTable-select');
 const VDataTableSelectionSymbol = Symbol.for('vuetify:data-table-selection');
@@ -20087,7 +20105,9 @@ function provideSelection(props, _ref9) {
     currentPage
   } = _ref9;
   const selected = useProxiedModel(props, 'modelValue', props.modelValue, v => {
-    return new Set(v);
+    return new Set(wrapInArray(v).map(v => {
+      return allItems.value.find(item => props.valueComparator(v, item.value))?.value ?? v;
+    }));
   }, v => {
     return [...v.values()];
   });
@@ -20106,10 +20126,10 @@ function provideSelection(props, _ref9) {
     }
   });
   function isSelected(items) {
-    return wrapInArray(items).every(item => selected.value.has(item.value));
+    return wrapInArray(items).every(item => selected.value.has(toRaw(item.value)));
   }
   function isSomeSelected(items) {
-    return wrapInArray(items).some(item => selected.value.has(item.value));
+    return wrapInArray(items).some(item => selected.value.has(toRaw(item.value)));
   }
   function select(items, value) {
     const newSelected = selectStrategy.value.select({
@@ -20190,6 +20210,7 @@ function provideSort(options) {
     page
   } = options;
   const toggleSort = column => {
+    if (column.key == null) return;
     let newSortBy = sortBy.value.map(x => ({
       ...x
     })) ?? [];
@@ -20700,17 +20721,15 @@ function createHeaders(props, options) {
         column,
         row
       } = _ref4;
-      let key = column.key;
-      if (key == null) {
-        consoleWarn('The header key value must not be null or undefined');
-        key = '';
-      }
+      const key = column.key ?? (typeof column.value === 'string' ? column.value : null);
+      const value = column.value ?? column.key ?? null;
       for (let i = row; i <= row + (column.rowspan ?? 1) - 1; i++) {
         fixedRows[i].push({
           ...column,
           key,
+          value,
           fixedOffset: fixedOffsets[i],
-          sortable: column.sortable ?? !!column.key
+          sortable: column.sortable ?? key != null
         });
         fixedOffsets[i] += Number(column.width ?? 0);
       }
@@ -20989,7 +21008,7 @@ const makeVDataTableRowProps = propsFactory({
   item: Object,
   onClick: Function
 }, 'VDataTableRow');
-const VDataTableRow = defineComponent({
+const VDataTableRow = genericComponent()({
   name: 'VDataTableRow',
   props: makeVDataTableRowProps(),
   setup(props, _ref) {
@@ -21025,8 +21044,10 @@ const VDataTableRow = defineComponent({
         const slotName = `item.${column.key}`;
         const slotProps = {
           index: props.index,
-          item: props.item,
-          columns: columns.value,
+          item: item.raw,
+          internalItem: item,
+          value: getObjectValueByPath(item.columns, column.key),
+          column,
           isSelected,
           toggleSelect,
           isExpanded,
@@ -21048,7 +21069,7 @@ const VDataTableRow = defineComponent({
             "onClick": withModifiers(() => toggleExpand(item), ['stop'])
           }, null);
         }
-        return getPropertyFromItem(item.columns, column.key);
+        return toDisplayString(slotProps.value);
       }
     }))]));
   }
@@ -21102,13 +21123,13 @@ const VDataTableRows = genericComponent()({
       t
     } = useLocale();
     useRender(() => {
-      if (props.loading && slots.loading) {
+      if (props.loading) {
         return createVNode("tr", {
           "class": "v-data-table-rows-loading",
           "key": "loading"
         }, [createVNode("td", {
           "colspan": columns.value.length
-        }, [slots.loading()])]);
+        }, [slots.loading?.() ?? t(props.loadingText)])]);
       }
       if (!props.loading && !props.items.length && !props.hideNoData) {
         return createVNode("tr", {
@@ -21137,7 +21158,8 @@ const VDataTableRows = genericComponent()({
         }
         const slotProps = {
           index,
-          item,
+          item: item.raw,
+          internalItem: item,
           columns: columns.value,
           isExpanded,
           toggleExpand,
@@ -21153,7 +21175,8 @@ const VDataTableRows = genericComponent()({
                 toggleExpand(item);
               }
               props['onClick:row']?.(event, {
-                item
+                item: item.raw,
+                internalItem: item
               });
             } : undefined,
             index,
@@ -21191,7 +21214,7 @@ function transformItem(props, item, index, columns) {
   const value = props.returnObject ? item : getPropertyFromItem(item, props.itemValue);
   const selectable = getPropertyFromItem(item, props.itemSelectable, true);
   const itemColumns = columns.reduce((obj, column) => {
-    obj[column.key] = getPropertyFromItem(item, column.value ?? column.key);
+    if (column.key != null) obj[column.key] = getPropertyFromItem(item, column.value);
     return obj;
   }, {});
   return {
@@ -21418,8 +21441,7 @@ const VDataTableVirtual = genericComponent()({
     'update:sortBy': value => true,
     'update:options': value => true,
     'update:groupBy': value => true,
-    'update:expanded': value => true,
-    'click:row': (e, value) => true
+    'update:expanded': value => true
   },
   setup(props, _ref) {
     let {
@@ -21625,8 +21647,7 @@ const VDataTableServer = genericComponent()({
     'update:sortBy': sortBy => true,
     'update:options': options => true,
     'update:expanded': options => true,
-    'update:groupBy': value => true,
-    'click:row': (e, value) => true
+    'update:groupBy': value => true
   },
   setup(props, _ref) {
     let {
@@ -22028,8 +22049,8 @@ function getWeekArray(date, locale) {
   let currentWeek = [];
   const firstDayOfMonth = startOfMonth(date);
   const lastDayOfMonth = endOfMonth(date);
-  const firstDayWeekIndex = firstDayOfMonth.getDay() - firstDay[locale.slice(-2).toUpperCase()];
-  const lastDayWeekIndex = lastDayOfMonth.getDay() - firstDay[locale.slice(-2).toUpperCase()];
+  const firstDayWeekIndex = (firstDayOfMonth.getDay() - firstDay[locale.slice(-2).toUpperCase()] + 7) % 7;
+  const lastDayWeekIndex = (lastDayOfMonth.getDay() - firstDay[locale.slice(-2).toUpperCase()] + 7) % 7;
   for (let i = 0; i < firstDayWeekIndex; i++) {
     const adjacentDay = new Date(firstDayOfMonth);
     adjacentDay.setDate(adjacentDay.getDate() - (firstDayWeekIndex - i));
@@ -23260,7 +23281,7 @@ const VDatePicker = genericComponent()({
           "label": t(props.inputText),
           "placeholder": props.inputPlaceholder
         }, null)]),
-        actions: () => !props.hideActions ? createVNode("div", null, [createVNode(VBtn, {
+        actions: () => !props.hideActions ? slots.actions?.() ?? createVNode("div", null, [createVNode(VBtn, {
           "variant": "text",
           "color": props.color,
           "onClick": onClickCancel,
@@ -23635,7 +23656,7 @@ const VOtpInput = genericComponent()({
       scoped: true
     });
     watch(model, val => {
-      if (val.length === props.length) emit('finish', val.join(''));
+      if (val.length === Number(props.length)) emit('finish', val.join(''));
     }, {
       deep: true
     });
@@ -24593,7 +24614,7 @@ function createVuetify$1() {
     date
   };
 }
-const version$1 = "3.3.17";
+const version$1 = "3.3.19";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -24607,7 +24628,7 @@ function inject(key) {
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.3.17";
+const version = "3.3.19";
 
 /* eslint-disable local-rules/sort-imports */