@vuetify/nightly 3.6.13-3.7.0-beta.0.0-dev.2024-07-12 → 3.6.13-3.7.0-beta.0.0-dev.2024-07-25

package/dist/vuetify.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.6.13-3.7.0-beta.0.0-dev.2024-07-12
+* Vuetify v3.6.13-3.7.0-beta.0.0-dev.2024-07-25
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -502,6 +502,11 @@
     });
     return fn;
   }
+  function checkPrintable(e) {
+    const isPrintableChar = e.key.length === 1;
+    const noModifier = !e.ctrlKey && !e.metaKey && !e.altKey;
+    return isPrintableChar && noModifier;
+  }
 
   // Utilities
   const block = ['top', 'bottom'];
@@ -7054,7 +7059,10 @@
   const makeVInputProps = propsFactory({
     id: String,
     appendIcon: IconValue,
-    centerAffix: Boolean,
+    centerAffix: {
+      type: Boolean,
+      default: true
+    },
     prependIcon: IconValue,
     hideDetails: [Boolean, String],
     hideSpinButtons: Boolean,
@@ -8804,7 +8812,6 @@
             children.value.set(parent, list.filter(child => child !== id));
           }
           parents.value.delete(id);
-          opened.value.delete(id);
         },
         open: (id, value, event) => {
           vm.emit('click:open', {
@@ -9978,12 +9985,6 @@
     // el.style.removeProperty('max-width')
     // el.style.removeProperty('max-height')
 
-    if (isRtl) {
-      el.style.removeProperty('left');
-    } else {
-      el.style.removeProperty('right');
-    }
-
     /* eslint-disable-next-line sonarjs/prefer-immediate-return */
     const contentBox = nullifyTransforms(el);
     if (isRtl) {
@@ -11375,23 +11376,25 @@
       const id = vue.computed(() => props.id || `v-menu-${uid}`);
       const overlay = vue.ref();
       const parent = vue.inject(VMenuSymbol, null);
-      const openChildren = vue.shallowRef(0);
+      const openChildren = vue.shallowRef(new Set());
       vue.provide(VMenuSymbol, {
         register() {
-          ++openChildren.value;
+          openChildren.value.add(uid);
         },
         unregister() {
-          --openChildren.value;
+          openChildren.value.delete(uid);
         },
         closeParents(e) {
           setTimeout(() => {
-            if (!openChildren.value && !props.persistent && (e == null || e && !isClickInsideElement(e, overlay.value.contentEl))) {
+            if (!openChildren.value.size && !props.persistent && (e == null || e && !isClickInsideElement(e, overlay.value.contentEl))) {
               isActive.value = false;
               parent?.closeParents();
             }
           }, 40);
         }
       });
+      vue.onBeforeUnmount(() => parent?.unregister());
+      vue.onDeactivated(() => isActive.value = false);
       async function onFocusIn(e) {
         const before = e.relatedTarget;
         const after = e.target;
@@ -11574,7 +11577,10 @@
       default: '$clear'
     },
     active: Boolean,
-    centerAffix: Boolean,
+    centerAffix: {
+      type: Boolean,
+      default: undefined
+    },
     color: String,
     baseColor: String,
     dirty: Boolean,
@@ -11641,9 +11647,8 @@
       const {
         rtlClasses
       } = useRtl();
-      const isSingleLine = vue.computed(() => props.singleLine || props.centerAffix);
       const isActive = vue.computed(() => props.dirty || props.active);
-      const hasLabel = vue.computed(() => !isSingleLine.value && !!(props.label || slots.label));
+      const hasLabel = vue.computed(() => !props.singleLine && !!(props.label || slots.label));
       const uid = getUid();
       const id = vue.computed(() => props.id || `input-${uid}`);
       const messagesId = vue.computed(() => `${id.value}-messages`);
@@ -11732,7 +11737,7 @@
           "class": ['v-field', {
             'v-field--active': isActive.value,
             'v-field--appended': hasAppend,
-            'v-field--center-affix': props.centerAffix,
+            'v-field--center-affix': props.centerAffix ?? !isPlainOrUnderlined.value,
             'v-field--disabled': props.disabled,
             'v-field--dirty': props.dirty,
             'v-field--error': props.error,
@@ -11741,7 +11746,7 @@
             'v-field--persistent-clear': props.persistentClear,
             'v-field--prepended': hasPrepend,
             'v-field--reverse': props.reverse,
-            'v-field--single-line': isSingleLine.value,
+            'v-field--single-line': props.singleLine,
             'v-field--no-label': !label(),
             [`v-field--variant-${props.variant}`]: true
           }, themeClasses.value, backgroundColorClasses.value, focusClasses.value, loaderClasses.value, roundedClasses.value, rtlClasses.value, props.class],
@@ -11976,6 +11981,7 @@
           }, props.class],
           "style": props.style
         }, rootAttrs, inputProps, {
+          "centerAffix": !isPlainOrUnderlined.value,
           "focused": isFocused.value
         }), {
           ...slots,
@@ -12001,7 +12007,6 @@
               "dirty": isDirty.value || props.dirty,
               "disabled": isDisabled.value,
               "focused": isFocused.value,
-              "centerAffix": props.centerAffix,
               "error": isValid.value === false
             }), {
               ...slots,
@@ -12301,6 +12306,7 @@
       deep: true
     });
     return {
+      calculateVisibleItems,
       containerRef,
       markerRef,
       computedItems,
@@ -12364,6 +12370,7 @@
         dimensionStyles
       } = useDimension(props);
       const {
+        calculateVisibleItems,
         containerRef,
         markerRef,
         handleScroll,
@@ -12435,6 +12442,7 @@
         }, [children])]);
       });
       return {
+        calculateVisibleItems,
         scrollToIndex
       };
     }
@@ -12503,9 +12511,9 @@
       }
     }
     return {
-      onListScroll,
-      onListKeydown
-    };
+      onScrollPassive: onListScroll,
+      onKeydown: onListKeydown
+    }; // typescript doesn't know about vue's event merging
   }
 
   // Types
@@ -12580,7 +12588,7 @@
       const menu = vue.computed({
         get: () => _menu.value,
         set: v => {
-          if (_menu.value && !v && vMenuRef.value?.ΨopenChildren) return;
+          if (_menu.value && !v && vMenuRef.value?.ΨopenChildren.size) return;
           _menu.value = v;
         }
       });
@@ -12619,10 +12627,7 @@
         };
       });
       const listRef = vue.ref();
-      const {
-        onListScroll,
-        onListKeydown
-      } = useScrolling(listRef, vTextFieldRef);
+      const listEvents = useScrolling(listRef, vTextFieldRef);
       function onClear(e) {
         if (props.openOnClear) {
           menu.value = true;
@@ -12632,6 +12637,11 @@
         if (menuDisabled.value) return;
         menu.value = !menu.value;
       }
+      function onListKeydown(e) {
+        if (checkPrintable(e)) {
+          onKeydown(e);
+        }
+      }
       function onKeydown(e) {
         if (!e.key || props.readonly || form?.isReadonly.value) return;
         if (['Enter', ' ', 'ArrowDown', 'ArrowUp', 'Home', 'End'].includes(e.key)) {
@@ -12652,11 +12662,6 @@
         // html select hotkeys
         const KEYBOARD_LOOKUP_THRESHOLD = 1000; // milliseconds
 
-        function checkPrintable(e) {
-          const isPrintableChar = e.key.length === 1;
-          const noModifier = !e.ctrlKey && !e.metaKey && !e.altKey;
-          return isPrintableChar && noModifier;
-        }
         if (props.multiple || !checkPrintable(e)) return;
         const now = performance.now();
         if (now - keyboardLookupLastTime > KEYBOARD_LOOKUP_THRESHOLD) {
@@ -12701,6 +12706,11 @@
           menu.value = false;
         }
       }
+      function onAfterEnter() {
+        if (props.eager) {
+          vVirtualScrollRef.value?.calculateVisibleItems();
+        }
+      }
       function onAfterLeave() {
         if (isFocused.value) {
           vTextFieldRef.value?.focus();
@@ -12779,6 +12789,7 @@
             "openOnClick": false,
             "closeOnContentClick": false,
             "transition": props.transition,
+            "onAfterEnter": onAfterEnter,
             "onAfterLeave": onAfterLeave
           }, computedMenuProps.value), {
             default: () => [hasList && vue.createVNode(VList, vue.mergeProps({
@@ -12788,11 +12799,10 @@
               "onMousedown": e => e.preventDefault(),
               "onKeydown": onListKeydown,
               "onFocusin": onFocusin,
-              "onScrollPassive": onListScroll,
               "tabindex": "-1",
               "aria-live": "polite",
               "color": props.itemColor ?? props.color
-            }, props.listProps), {
+            }, listEvents, props.listProps), {
               default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? vue.createVNode(VListItem, {
                 "title": t(props.noDataText)
               }, null)), vue.createVNode(VVirtualScroll, {
@@ -13087,7 +13097,7 @@
       const menu = vue.computed({
         get: () => _menu.value,
         set: v => {
-          if (_menu.value && !v && vMenuRef.value?.ΨopenChildren) return;
+          if (_menu.value && !v && vMenuRef.value?.ΨopenChildren.size) return;
           _menu.value = v;
         }
       });
@@ -13131,10 +13141,7 @@
       });
       const menuDisabled = vue.computed(() => props.hideNoData && !displayItems.value.length || props.readonly || form?.isReadonly.value);
       const listRef = vue.ref();
-      const {
-        onListScroll,
-        onListKeydown
-      } = useScrolling(listRef, vTextFieldRef);
+      const listEvents = useScrolling(listRef, vTextFieldRef);
       function onClear(e) {
         if (props.openOnClear) {
           menu.value = true;
@@ -13153,6 +13160,11 @@
         }
         menu.value = !menu.value;
       }
+      function onListKeydown(e) {
+        if (checkPrintable(e)) {
+          vTextFieldRef.value?.focus();
+        }
+      }
       function onKeydown(e) {
         if (props.readonly || form?.isReadonly.value) return;
         const selectionStart = vTextFieldRef.value.selectionStart;
@@ -13217,6 +13229,11 @@
           }
         }
       }
+      function onAfterEnter() {
+        if (props.eager) {
+          vVirtualScrollRef.value?.calculateVisibleItems();
+        }
+      }
       function onAfterLeave() {
         if (isFocused.value) {
           isPristine.value = true;
@@ -13345,6 +13362,7 @@
             "openOnClick": false,
             "closeOnContentClick": false,
             "transition": props.transition,
+            "onAfterEnter": onAfterEnter,
             "onAfterLeave": onAfterLeave
           }, props.menuProps), {
             default: () => [hasList && vue.createVNode(VList, vue.mergeProps({
@@ -13355,11 +13373,10 @@
               "onKeydown": onListKeydown,
               "onFocusin": onFocusin,
               "onFocusout": onFocusout,
-              "onScrollPassive": onListScroll,
               "tabindex": "-1",
               "aria-live": "polite",
               "color": props.itemColor ?? props.color
-            }, props.listProps), {
+            }, listEvents, props.listProps), {
               default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? vue.createVNode(VListItem, {
                 "title": t(props.noDataText)
               }, null)), vue.createVNode(VVirtualScroll, {
@@ -16920,7 +16937,7 @@
       const menu = vue.computed({
         get: () => _menu.value,
         set: v => {
-          if (_menu.value && !v && vMenuRef.value?.ΨopenChildren) return;
+          if (_menu.value && !v && vMenuRef.value?.ΨopenChildren.size) return;
           _menu.value = v;
         }
       });
@@ -17003,10 +17020,7 @@
       });
       const menuDisabled = vue.computed(() => props.hideNoData && !displayItems.value.length || props.readonly || form?.isReadonly.value);
       const listRef = vue.ref();
-      const {
-        onListScroll,
-        onListKeydown
-      } = useScrolling(listRef, vTextFieldRef);
+      const listEvents = useScrolling(listRef, vTextFieldRef);
       function onClear(e) {
         cleared = true;
         if (props.openOnClear) {
@@ -17025,6 +17039,11 @@
         }
         menu.value = !menu.value;
       }
+      function onListKeydown(e) {
+        if (checkPrintable(e)) {
+          vTextFieldRef.value?.focus();
+        }
+      }
       // eslint-disable-next-line complexity
       function onKeydown(e) {
         if (isComposingIgnoreKey(e) || props.readonly || form?.isReadonly.value) return;
@@ -17089,6 +17108,11 @@
           }
         }
       }
+      function onAfterEnter() {
+        if (props.eager) {
+          vVirtualScrollRef.value?.calculateVisibleItems();
+        }
+      }
       function onAfterLeave() {
         if (isFocused.value) {
           isPristine.value = true;
@@ -17213,6 +17237,7 @@
             "openOnClick": false,
             "closeOnContentClick": false,
             "transition": props.transition,
+            "onAfterEnter": onAfterEnter,
             "onAfterLeave": onAfterLeave
           }, props.menuProps), {
             default: () => [hasList && vue.createVNode(VList, vue.mergeProps({
@@ -17223,11 +17248,10 @@
               "onKeydown": onListKeydown,
               "onFocusin": onFocusin,
               "onFocusout": onFocusout,
-              "onScrollPassive": onListScroll,
               "tabindex": "-1",
               "aria-live": "polite",
               "color": props.itemColor ?? props.color
-            }, props.listProps), {
+            }, listEvents, props.listProps), {
               default: () => [slots['prepend-item']?.(), !displayItems.value.length && !props.hideNoData && (slots['no-data']?.() ?? vue.createVNode(VListItem, {
                 "title": t(props.noDataText)
               }, null)), vue.createVNode(VVirtualScroll, {
@@ -18342,6 +18366,7 @@
   }
   function provideGroupBy(options) {
     const {
+      disableSort,
       groupBy,
       sortBy
     } = options;
@@ -18350,7 +18375,7 @@
       return groupBy.value.map(val => ({
         ...val,
         order: val.order ?? false
-      })).concat(sortBy.value);
+      })).concat(disableSort?.value ? [] : sortBy.value);
     });
     function isGroupOpen(group) {
       return opened.value.has(group.id);
@@ -18859,7 +18884,7 @@
   function useSortedItems(props, items, sortBy, options) {
     const locale = useLocale();
     const sortedItems = vue.computed(() => {
-      if (!sortBy.value.length || props.disableSort) return items.value;
+      if (!sortBy.value.length) return items.value;
       return sortItems(items.value, sortBy.value, locale.current.value, {
         transform: options?.transform,
         sortFunctions: {
@@ -18885,8 +18910,8 @@
         const sortKey = sortByItems[i].key;
         const sortOrder = sortByItems[i].order ?? 'asc';
         if (sortOrder === false) continue;
-        let sortA = a[1][sortKey];
-        let sortB = b[1][sortKey];
+        let sortA = getObjectValueByPath(a[1], sortKey);
+        let sortB = getObjectValueByPath(b[1], sortKey);
         let sortARaw = a[0].raw;
         let sortBRaw = b[0].raw;
         if (sortOrder === 'desc') {
@@ -20611,6 +20636,9 @@
         page,
         itemsPerPage
       } = createPagination(props);
+      const {
+        disableSort
+      } = vue.toRefs(props);
       const {
         columns,
         headers,
@@ -20648,12 +20676,16 @@
         toggleGroup
       } = provideGroupBy({
         groupBy,
-        sortBy
+        sortBy,
+        disableSort
       });
       const {
         sortedItems
       } = useSortedItems(props, filteredItems, sortByWithGroups, {
-        transform: item => item.columns,
+        transform: item => ({
+          ...item.raw,
+          ...item.columns
+        }),
         sortFunctions,
         sortRawFunctions
       });
@@ -20791,6 +20823,9 @@
         multiSort,
         mustSort
       } = createSort(props);
+      const {
+        disableSort
+      } = vue.toRefs(props);
       const {
         columns,
         headers,
@@ -20827,12 +20862,16 @@
         toggleGroup
       } = provideGroupBy({
         groupBy,
-        sortBy
+        sortBy,
+        disableSort
       });
       const {
         sortedItems
       } = useSortedItems(props, filteredItems, sortByWithGroups, {
-        transform: item => item.columns,
+        transform: item => ({
+          ...item.raw,
+          ...item.columns
+        }),
         sortFunctions,
         sortRawFunctions
       });
@@ -21016,6 +21055,9 @@
         page,
         itemsPerPage
       } = createPagination(props);
+      const {
+        disableSort
+      } = vue.toRefs(props);
       const itemsLength = vue.computed(() => parseInt(props.itemsLength, 10));
       const {
         columns,
@@ -21043,7 +21085,8 @@
         extractRows
       } = provideGroupBy({
         groupBy,
-        sortBy
+        sortBy,
+        disableSort
       });
       const {
         pageCount,
@@ -21807,6 +21850,9 @@
         const _value = adapter.startOfDay(value);
         if (model.value.length === 0) {
           rangeStart.value = undefined;
+        } else if (model.value.length === 1) {
+          rangeStart.value = model.value[0];
+          rangeStop.value = undefined;
         }
         if (!rangeStart.value) {
           rangeStart.value = _value;
@@ -24491,7 +24537,7 @@
       function onPaste(index, e) {
         e.preventDefault();
         e.stopPropagation();
-        const clipboardText = e?.clipboardData?.getData('Text') ?? '';
+        const clipboardText = e?.clipboardData?.getData('Text').slice(0, length.value) ?? '';
         if (isValidNumber(clipboardText)) return;
         model.value = clipboardText.split('');
         inputRef.value?.[index].blur();
@@ -27036,8 +27082,8 @@
     },
     suffix: String,
     modelModifiers: Object,
-    ...omit(makeVInputProps(), ['centerAffix']),
-    ...omit(makeVFieldProps(), ['centerAffix'])
+    ...makeVInputProps(),
+    ...makeVFieldProps()
   }, 'VTextarea');
   const VTextarea = genericComponent()({
     name: 'VTextarea',
@@ -27176,7 +27222,7 @@
           }, props.class],
           "style": props.style
         }, rootAttrs, inputProps, {
-          "centerAffix": false,
+          "centerAffix": rows.value === 1 && !isPlainOrUnderlined.value,
           "focused": isFocused.value
         }), {
           ...slots,
@@ -27201,7 +27247,7 @@
             }, fieldProps, {
               "id": id.value,
               "active": isActive.value || isDirty.value,
-              "centerAffix": false,
+              "centerAffix": rows.value === 1 && !isPlainOrUnderlined.value,
               "dirty": isDirty.value || props.dirty,
               "disabled": isDisabled.value,
               "focused": isFocused.value,
@@ -28133,7 +28179,7 @@
       goTo
     };
   }
-  const version$1 = "3.6.13-3.7.0-beta.0.0-dev.2024-07-12";
+  const version$1 = "3.6.13-3.7.0-beta.0.0-dev.2024-07-25";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -28158,7 +28204,7 @@
       ...options
     });
   };
-  const version = "3.6.13-3.7.0-beta.0.0-dev.2024-07-12";
+  const version = "3.6.13-3.7.0-beta.0.0-dev.2024-07-25";
   createVuetify.version = version;
 
   exports.blueprints = index;