vuetify 3.6.13 → 3.7.0-beta.1

package/dist/vuetify-labs.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.6.13
+* Vuetify v3.7.0-beta.1
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -575,6 +575,11 @@ function templateRef() {
   });
   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'];
@@ -3248,6 +3253,7 @@ const Intersect = {
 // not intended for public use, this is passed in by vuetify-loader
 
 const makeVImgProps = propsFactory({
+  absolute: Boolean,
   alt: String,
   cover: Boolean,
   color: String,
@@ -3504,6 +3510,7 @@ const VImg = genericComponent()({
       const responsiveProps = VResponsive.filterProps(props);
       return withDirectives(createVNode(VResponsive, mergeProps({
         "class": ['v-img', {
+          'v-img--absolute': props.absolute,
           'v-img--booting': !isBooted.value
         }, backgroundColorClasses.value, roundedClasses.value, props.class],
         "style": [{
@@ -5511,6 +5518,7 @@ const makeVBtnProps = propsFactory({
     type: Boolean,
     default: undefined
   },
+  activeColor: String,
   baseColor: String,
   symbol: {
     type: null,
@@ -5602,10 +5610,11 @@ const VBtn = genericComponent()({
       }
       return group?.isSelected.value;
     });
+    const color = computed(() => isActive.value ? props.activeColor ?? props.color : props.color);
     const variantProps = computed(() => {
       const showColor = group?.isSelected.value && (!link.isLink.value || link.isActive?.value) || !group || link.isActive?.value;
       return {
-        color: showColor ? props.color ?? props.baseColor : props.baseColor,
+        color: showColor ? color.value ?? props.baseColor : props.baseColor,
         variant: props.variant
       };
     });
@@ -5946,6 +5955,7 @@ const makeVAvatarProps = propsFactory({
   icon: IconValue,
   image: String,
   text: String,
+  ...makeBorderProps(),
   ...makeComponentProps(),
   ...makeDensityProps(),
   ...makeRoundedProps(),
@@ -5966,6 +5976,9 @@ const VAvatar = genericComponent()({
     const {
       themeClasses
     } = provideTheme(props);
+    const {
+      borderClasses
+    } = useBorder(props);
     const {
       colorClasses,
       colorStyles,
@@ -5985,7 +5998,7 @@ const VAvatar = genericComponent()({
       "class": ['v-avatar', {
         'v-avatar--start': props.start,
         'v-avatar--end': props.end
-      }, themeClasses.value, colorClasses.value, densityClasses.value, roundedClasses.value, sizeClasses.value, variantClasses.value, props.class],
+      }, themeClasses.value, borderClasses.value, colorClasses.value, densityClasses.value, roundedClasses.value, sizeClasses.value, variantClasses.value, props.class],
       "style": [colorStyles.value, sizeStyles.value, props.style]
     }, {
       default: () => [!slots.default ? props.image ? createVNode(VImg, {
@@ -6685,12 +6698,14 @@ function useValidation(props) {
   const validateOn = computed(() => {
     let value = (props.validateOn ?? form?.validateOn.value) || 'input';
     if (value === 'lazy') value = 'input lazy';
+    if (value === 'eager') value = 'input eager';
     const set = new Set(value?.split(' ') ?? []);
     return {
-      blur: set.has('blur') || set.has('input'),
       input: set.has('input'),
-      submit: set.has('submit'),
-      lazy: set.has('lazy')
+      blur: set.has('blur') || set.has('input') || set.has('invalid-input'),
+      invalidInput: set.has('invalid-input'),
+      lazy: set.has('lazy'),
+      eager: set.has('eager')
     };
   });
   const isValid = computed(() => {
@@ -6727,11 +6742,11 @@ function useValidation(props) {
   });
   onMounted(async () => {
     if (!validateOn.value.lazy) {
-      await validate(true);
+      await validate(!validateOn.value.eager);
     }
     form?.update(uid.value, isValid.value, errorMessages.value);
   });
-  useToggleScope(() => validateOn.value.input, () => {
+  useToggleScope(() => validateOn.value.input || validateOn.value.invalidInput && isValid.value === false, () => {
     watch(validationModel, () => {
       if (validationModel.value != null) {
         validate();
@@ -6759,7 +6774,7 @@ function useValidation(props) {
   async function resetValidation() {
     isPristine.value = true;
     if (!validateOn.value.lazy) {
-      await validate(true);
+      await validate(!validateOn.value.eager);
     } else {
       internalErrorMessages.value = [];
     }
@@ -7699,7 +7714,9 @@ const VSlideGroup = genericComponent()({
       selected: group.selected,
       scrollTo,
       scrollOffset,
-      focus
+      focus,
+      hasPrev,
+      hasNext
     };
   }
 });
@@ -8169,6 +8186,7 @@ const leafSingleActiveStrategy = mandatory => {
   return strategy;
 };
 
+// Utilities
 const singleOpenStrategy = {
   open: _ref => {
     let {
@@ -8202,11 +8220,11 @@ const multipleOpenStrategy = {
       parents
     } = _ref2;
     if (value) {
-      let parent = parents.get(id);
+      let parent = toRaw(parents.get(id));
       opened.add(id);
       while (parent != null && parent !== id) {
         opened.add(parent);
-        parent = parents.get(parent);
+        parent = toRaw(parents.get(parent));
       }
       return opened;
     } else {
@@ -8377,18 +8395,18 @@ const classicSelectStrategy = mandatory => {
       const items = [id];
       while (items.length) {
         const item = items.shift();
-        selected.set(item, value ? 'on' : 'off');
+        selected.set(toRaw(item), value ? 'on' : 'off');
         if (children.has(item)) {
           items.push(...children.get(item));
         }
       }
-      let parent = parents.get(id);
+      let parent = toRaw(parents.get(id));
       while (parent) {
         const childrenIds = children.get(parent);
-        const everySelected = childrenIds.every(cid => selected.get(cid) === 'on');
-        const noneSelected = childrenIds.every(cid => !selected.has(cid) || selected.get(cid) === 'off');
+        const everySelected = childrenIds.every(cid => selected.get(toRaw(cid)) === 'on');
+        const noneSelected = childrenIds.every(cid => !selected.has(toRaw(cid)) || selected.get(toRaw(cid)) === 'off');
         selected.set(parent, everySelected ? 'on' : noneSelected ? 'off' : 'indeterminate');
-        parent = parents.get(parent);
+        parent = toRaw(parents.get(parent));
       }
 
       // If mandatory and planned deselect results in no selected
@@ -8466,7 +8484,7 @@ const useNested = props => {
   let isUnmounted = false;
   const children = ref(new Map());
   const parents = ref(new Map());
-  const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(v), v => [...v.values()]);
+  const opened = useProxiedModel(props, 'opened', props.opened, v => new Set(toRaw(v)), v => [...v.values()]);
   const activeStrategy = computed(() => {
     if (typeof props.activeStrategy === 'object') return props.activeStrategy;
     if (typeof props.activeStrategy === 'function') return props.activeStrategy(props.mandatory);
@@ -8557,7 +8575,6 @@ const useNested = props => {
           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', {
@@ -8640,9 +8657,9 @@ const useNestedItem = (id, isGroup) => {
   const item = {
     ...parent,
     id: computedId,
-    open: (open, e) => parent.root.open(computedId.value, open, e),
+    open: (open, e) => parent.root.open(toRaw(computedId.value), open, e),
     openOnSelect: (open, e) => parent.root.openOnSelect(computedId.value, open, e),
-    isOpen: computed(() => parent.root.opened.value.has(computedId.value)),
+    isOpen: computed(() => parent.root.opened.value.has(toRaw(computedId.value))),
     parent: computed(() => parent.root.parents.value.get(computedId.value)),
     activate: (activated, e) => parent.root.activate(computedId.value, activated, e),
     isActivated: computed(() => parent.root.activated.value.has(toRaw(computedId.value))),
@@ -8866,6 +8883,7 @@ const VListItem = genericComponent()({
       activate,
       isActivated,
       select,
+      isOpen,
       isSelected,
       isIndeterminate,
       isGroupActivator,
@@ -8920,6 +8938,7 @@ const VListItem = genericComponent()({
     const slotProps = computed(() => ({
       isActive: isActive.value,
       select,
+      isOpen: isOpen.value,
       isSelected: isSelected.value,
       isIndeterminate: isIndeterminate.value
     }));
@@ -9729,12 +9748,6 @@ function getIntrinsicSize(el, isRtl) {
   // 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) {
@@ -11126,23 +11139,25 @@ const VMenu = genericComponent()({
     const id = computed(() => props.id || `v-menu-${uid}`);
     const overlay = ref();
     const parent = inject$1(VMenuSymbol, null);
-    const openChildren = shallowRef(0);
+    const openChildren = shallowRef(new Set());
     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);
       }
     });
+    onBeforeUnmount(() => parent?.unregister());
+    onDeactivated(() => isActive.value = false);
     async function onFocusIn(e) {
       const before = e.relatedTarget;
       const after = e.target;
@@ -12054,6 +12069,7 @@ function useVirtual(props, items) {
     deep: true
   });
   return {
+    calculateVisibleItems,
     containerRef,
     markerRef,
     computedItems,
@@ -12117,6 +12133,7 @@ const VVirtualScroll = genericComponent()({
       dimensionStyles
     } = useDimension(props);
     const {
+      calculateVisibleItems,
       containerRef,
       markerRef,
       handleScroll,
@@ -12188,6 +12205,7 @@ const VVirtualScroll = genericComponent()({
       }, [children])]);
     });
     return {
+      calculateVisibleItems,
       scrollToIndex
     };
   }
@@ -12256,9 +12274,9 @@ function useScrolling(listRef, textFieldRef) {
     }
   }
   return {
-    onListScroll,
-    onListKeydown
-  };
+    onScrollPassive: onListScroll,
+    onKeydown: onListKeydown
+  }; // typescript doesn't know about vue's event merging
 }
 
 // Types
@@ -12333,7 +12351,7 @@ const VSelect = genericComponent()({
     const menu = 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;
       }
     });
@@ -12372,10 +12390,7 @@ const VSelect = genericComponent()({
       };
     });
     const listRef = ref();
-    const {
-      onListScroll,
-      onListKeydown
-    } = useScrolling(listRef, vTextFieldRef);
+    const listEvents = useScrolling(listRef, vTextFieldRef);
     function onClear(e) {
       if (props.openOnClear) {
         menu.value = true;
@@ -12385,6 +12400,11 @@ const VSelect = genericComponent()({
       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)) {
@@ -12405,11 +12425,6 @@ const VSelect = genericComponent()({
       // 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) {
@@ -12454,6 +12469,11 @@ const VSelect = genericComponent()({
         menu.value = false;
       }
     }
+    function onAfterEnter() {
+      if (props.eager) {
+        vVirtualScrollRef.value?.calculateVisibleItems();
+      }
+    }
     function onAfterLeave() {
       if (isFocused.value) {
         vTextFieldRef.value?.focus();
@@ -12532,6 +12552,7 @@ const VSelect = genericComponent()({
           "openOnClick": false,
           "closeOnContentClick": false,
           "transition": props.transition,
+          "onAfterEnter": onAfterEnter,
           "onAfterLeave": onAfterLeave
         }, computedMenuProps.value), {
           default: () => [hasList && createVNode(VList, mergeProps({
@@ -12541,11 +12562,10 @@ const VSelect = genericComponent()({
             "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']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
             }, null)), createVNode(VVirtualScroll, {
@@ -12840,7 +12860,7 @@ const VAutocomplete = genericComponent()({
     const menu = 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;
       }
     });
@@ -12884,10 +12904,7 @@ const VAutocomplete = genericComponent()({
     });
     const menuDisabled = computed(() => props.hideNoData && !displayItems.value.length || props.readonly || form?.isReadonly.value);
     const listRef = ref();
-    const {
-      onListScroll,
-      onListKeydown
-    } = useScrolling(listRef, vTextFieldRef);
+    const listEvents = useScrolling(listRef, vTextFieldRef);
     function onClear(e) {
       if (props.openOnClear) {
         menu.value = true;
@@ -12906,6 +12923,11 @@ const VAutocomplete = genericComponent()({
       }
       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;
@@ -12970,6 +12992,11 @@ const VAutocomplete = genericComponent()({
         }
       }
     }
+    function onAfterEnter() {
+      if (props.eager) {
+        vVirtualScrollRef.value?.calculateVisibleItems();
+      }
+    }
     function onAfterLeave() {
       if (isFocused.value) {
         isPristine.value = true;
@@ -13098,6 +13125,7 @@ const VAutocomplete = genericComponent()({
           "openOnClick": false,
           "closeOnContentClick": false,
           "transition": props.transition,
+          "onAfterEnter": onAfterEnter,
           "onAfterLeave": onAfterLeave
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, mergeProps({
@@ -13108,11 +13136,10 @@ const VAutocomplete = genericComponent()({
             "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']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
             }, null)), createVNode(VVirtualScroll, {
@@ -16673,7 +16700,7 @@ const VCombobox = genericComponent()({
     const menu = 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;
       }
     });
@@ -16756,10 +16783,7 @@ const VCombobox = genericComponent()({
     });
     const menuDisabled = computed(() => props.hideNoData && !displayItems.value.length || props.readonly || form?.isReadonly.value);
     const listRef = ref();
-    const {
-      onListScroll,
-      onListKeydown
-    } = useScrolling(listRef, vTextFieldRef);
+    const listEvents = useScrolling(listRef, vTextFieldRef);
     function onClear(e) {
       cleared = true;
       if (props.openOnClear) {
@@ -16778,6 +16802,11 @@ const VCombobox = genericComponent()({
       }
       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;
@@ -16842,6 +16871,11 @@ const VCombobox = genericComponent()({
         }
       }
     }
+    function onAfterEnter() {
+      if (props.eager) {
+        vVirtualScrollRef.value?.calculateVisibleItems();
+      }
+    }
     function onAfterLeave() {
       if (isFocused.value) {
         isPristine.value = true;
@@ -16966,6 +17000,7 @@ const VCombobox = genericComponent()({
           "openOnClick": false,
           "closeOnContentClick": false,
           "transition": props.transition,
+          "onAfterEnter": onAfterEnter,
           "onAfterLeave": onAfterLeave
         }, props.menuProps), {
           default: () => [hasList && createVNode(VList, mergeProps({
@@ -16976,11 +17011,10 @@ const VCombobox = genericComponent()({
             "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']?.() ?? createVNode(VListItem, {
               "title": t(props.noDataText)
             }, null)), createVNode(VVirtualScroll, {
@@ -20924,6 +20958,7 @@ const makeVContainerProps = propsFactory({
     default: false
   },
   ...makeComponentProps(),
+  ...makeDimensionProps(),
   ...makeTagProps()
 }, 'VContainer');
 const VContainer = genericComponent()({
@@ -20936,11 +20971,14 @@ const VContainer = genericComponent()({
     const {
       rtlClasses
     } = useRtl();
+    const {
+      dimensionStyles
+    } = useDimension(props);
     useRender(() => createVNode(props.tag, {
       "class": ['v-container', {
         'v-container--fluid': props.fluid
       }, rtlClasses.value, props.class],
-      "style": props.style
+      "style": [dimensionStyles.value, props.style]
     }, slots));
     return {};
   }
@@ -22362,7 +22400,8 @@ const makeVExpansionPanelTitleProps = propsFactory({
     default: false
   },
   readonly: Boolean,
-  ...makeComponentProps()
+  ...makeComponentProps(),
+  ...makeDimensionProps()
 }, 'VExpansionPanelTitle');
 const VExpansionPanelTitle = genericComponent()({
   name: 'VExpansionPanelTitle',
@@ -22380,6 +22419,9 @@ const VExpansionPanelTitle = genericComponent()({
       backgroundColorClasses,
       backgroundColorStyles
     } = useBackgroundColor(props, 'color');
+    const {
+      dimensionStyles
+    } = useDimension(props);
     const slotProps = computed(() => ({
       collapseIcon: props.collapseIcon,
       disabled: expansionPanel.disabled.value,
@@ -22394,7 +22436,7 @@ const VExpansionPanelTitle = genericComponent()({
         'v-expansion-panel-title--focusable': props.focusable,
         'v-expansion-panel-title--static': props.static
       }, backgroundColorClasses.value, props.class],
-      "style": [backgroundColorStyles.value, props.style],
+      "style": [backgroundColorStyles.value, dimensionStyles.value, props.style],
       "type": "button",
       "tabindex": expansionPanel.disabled.value ? -1 : undefined,
       "disabled": expansionPanel.disabled.value,
@@ -29431,6 +29473,7 @@ const VTreeviewSymbol = Symbol.for('vuetify:v-treeview');
 
 const makeVTreeviewItemProps = propsFactory({
   loading: Boolean,
+  onToggleExpand: EventProp(),
   toggleIcon: IconValue,
   ...makeVListItemProps({
     slim: true
@@ -29451,24 +29494,12 @@ const VTreeviewItem = genericComponent()({
     const {
       activate,
       isActivated,
-      select,
-      isSelected,
-      isIndeterminate,
       isGroupActivator,
       root,
       id
     } = useNestedItem(rawId, false);
     const isActivatableGroupActivator = computed(() => root.activatable.value && isGroupActivator);
-    const {
-      densityClasses
-    } = useDensity(props, 'v-list-item');
-    const slotProps = computed(() => ({
-      isActive: isActivated.value,
-      select,
-      isSelected: isSelected.value,
-      isIndeterminate: isIndeterminate.value
-    }));
-    const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || props.value != null && !!vListItemRef.value?.list));
+    const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || props.value != null && !!vListItemRef.value?.list || isActivatableGroupActivator.value));
     function activateItem(e) {
       if (!isClickable.value || !isActivatableGroupActivator.value && isGroupActivator) return;
       if (root.activatable.value) {
@@ -29479,68 +29510,20 @@ const VTreeviewItem = genericComponent()({
         }
       }
     }
-    function onKeyDown(e) {
-      if (e.key === 'Enter' || e.key === ' ') {
-        e.preventDefault();
-        activateItem(e);
-      }
-    }
     const visibleIds = inject$1(VTreeviewSymbol, {
       visibleIds: ref()
     }).visibleIds;
     useRender(() => {
-      const hasTitle = slots.title || props.title != null;
-      const hasSubtitle = slots.subtitle || props.subtitle != null;
-      const listItemProps = VListItem.filterProps(props);
+      const listItemProps = omit(VListItem.filterProps(props), ['onClick']);
       const hasPrepend = slots.prepend || props.toggleIcon;
-      return isActivatableGroupActivator.value ? withDirectives(createVNode("div", {
-        "class": ['v-list-item', 'v-list-item--one-line', 'v-treeview-item', 'v-treeview-item--activetable-group-activator', {
-          'v-list-item--active': isActivated.value || isSelected.value,
-          'v-treeview-item--filtered': visibleIds.value && !visibleIds.value.has(id.value)
-        }, densityClasses.value, props.class],
-        "onClick": activateItem
-      }, [createVNode(Fragment, null, [genOverlays(isActivated.value || isSelected.value, 'v-list-item'), props.toggleIcon && createVNode(VListItemAction, {
-        "start": false
-      }, {
-        default: () => [createVNode(VBtn, {
-          "density": "compact",
-          "icon": props.toggleIcon,
-          "loading": props.loading,
-          "variant": "text",
-          "onClick": props.onClick
-        }, {
-          loader() {
-            return createVNode(VProgressCircular, {
-              "indeterminate": "disable-shrink",
-              "size": "20",
-              "width": "2"
-            }, null);
-          }
-        })]
-      })]), createVNode("div", {
-        "class": "v-list-item__content",
-        "data-no-activator": ""
-      }, [hasTitle && createVNode(VListItemTitle, {
-        "key": "title"
-      }, {
-        default: () => [slots.title?.({
-          title: props.title
-        }) ?? props.title]
-      }), hasSubtitle && createVNode(VListItemSubtitle, {
-        "key": "subtitle"
-      }, {
-        default: () => [slots.subtitle?.({
-          subtitle: props.subtitle
-        }) ?? props.subtitle]
-      }), slots.default?.(slotProps.value)])]), [[resolveDirective("ripple"), isClickable.value && props.ripple]]) : createVNode(VListItem, mergeProps({
-        "ref": vListItemRef
-      }, listItemProps, {
+      return createVNode(VListItem, mergeProps(listItemProps, {
+        "active": isActivated.value,
         "class": ['v-treeview-item', {
+          'v-treeview-item--activatable-group-activator': isActivatableGroupActivator.value,
           'v-treeview-item--filtered': visibleIds.value && !visibleIds.value.has(id.value)
         }, props.class],
-        "value": id.value,
-        "onClick": activateItem,
-        "onKeydown": isClickable.value && onKeyDown
+        "ripple": false,
+        "onClick": props.onClick ?? activateItem
       }), {
         ...slots,
         prepend: hasPrepend ? slotProps => {
@@ -29551,7 +29534,8 @@ const VTreeviewItem = genericComponent()({
               "density": "compact",
               "icon": props.toggleIcon,
               "loading": props.loading,
-              "variant": "text"
+              "variant": "text",
+              "onClick": props.onToggleExpand
             }, {
               loader() {
                 return createVNode(VProgressCircular, {
@@ -29578,7 +29562,19 @@ const makeVTreeviewChildrenProps = propsFactory({
     default: '$loading'
   },
   items: Array,
+  openOnClick: {
+    type: Boolean,
+    default: undefined
+  },
+  indeterminateIcon: {
+    type: IconValue,
+    default: '$checkboxIndeterminate'
+  },
+  falseIcon: IconValue,
+  trueIcon: IconValue,
+  returnObject: Boolean,
   selectable: Boolean,
+  selectedColor: String,
   selectStrategy: [String, Function, Object]
 }, 'VTreeviewChildren');
 const VTreeviewChildren = genericComponent()({
@@ -29590,6 +29586,7 @@ const VTreeviewChildren = genericComponent()({
       slots
     } = _ref;
     const isLoading = shallowRef(null);
+    const isClickOnOpen = computed(() => props.openOnClick != null ? props.openOnClick : props.selectable);
     function checkChildren(item) {
       return new Promise(resolve => {
         if (!props.items?.length || !props.loadChildren) return resolve();
@@ -29620,7 +29617,11 @@ const VTreeviewChildren = genericComponent()({
           "key": item.value,
           "modelValue": slotProps.isSelected,
           "loading": loading,
+          "color": props.selectedColor,
           "indeterminate": slotProps.isIndeterminate,
+          "indeterminateIcon": props.indeterminateIcon,
+          "falseIcon": props.falseIcon,
+          "trueIcon": props.trueIcon,
           "onClick": withModifiers(() => selectItem(slotProps.select, slotProps.isSelected), ['stop']),
           "onKeydown": e => {
             if (!['Enter', 'Space'].includes(e.key)) return;
@@ -29642,9 +29643,9 @@ const VTreeviewChildren = genericComponent()({
       };
       const treeviewGroupProps = VTreeviewGroup.filterProps(itemProps);
       const treeviewChildrenProps = VTreeviewChildren.filterProps(props);
-      return children ? createVNode(VTreeviewGroup, mergeProps({
-        "value": itemProps?.value
-      }, treeviewGroupProps), {
+      return children ? createVNode(VTreeviewGroup, mergeProps(treeviewGroupProps, {
+        "value": props.returnObject ? item : treeviewGroupProps?.value
+      }), {
         activator: _ref3 => {
           let {
             props: activatorProps
@@ -29652,19 +29653,24 @@ const VTreeviewChildren = genericComponent()({
           const listItemProps = {
             ...itemProps,
             ...activatorProps,
-            value: itemProps?.value
+            value: itemProps?.value,
+            onToggleExpand: activatorProps.onClick,
+            onClick: isClickOnOpen.value ? [() => checkChildren(item), activatorProps.onClick] : undefined
           };
           return createVNode(VTreeviewItem, mergeProps(listItemProps, {
-            "loading": loading,
-            "onClick": () => checkChildren(item)
+            "value": props.returnObject ? toRaw(item) : itemProps.value,
+            "loading": loading
           }), slotsWithItem);
         },
         default: () => createVNode(VTreeviewChildren, mergeProps(treeviewChildrenProps, {
-          "items": children
+          "items": children,
+          "returnObject": props.returnObject
         }), slots)
       }) : slots.item?.({
         props: itemProps
-      }) ?? createVNode(VTreeviewItem, itemProps, slotsWithItem);
+      }) ?? createVNode(VTreeviewItem, mergeProps(itemProps, {
+        "value": props.returnObject ? toRaw(item) : itemProps.value
+      }), slotsWithItem);
     });
   }
 });
@@ -29688,7 +29694,7 @@ const makeVTreeviewProps = propsFactory({
     collapseIcon: '$treeviewCollapse',
     expandIcon: '$treeviewExpand',
     slim: true
-  }), ['nav'])
+  }), ['nav', 'openStrategy'])
 }, 'VTreeview');
 const VTreeview = genericComponent()({
   name: 'VTreeview',
@@ -29747,11 +29753,11 @@ const VTreeview = genericComponent()({
       }
       return arr;
     }
-    function openAll(item) {
+    function openAll(items) {
       let ids = [];
-      for (const i of item) {
+      for (const i of items) {
         if (!i.children) continue;
-        ids.push(i.value);
+        ids.push(props.returnObject ? toRaw(i.raw) : i.value);
         if (i.children) {
           ids = ids.concat(openAll(i.children));
         }
@@ -29787,6 +29793,7 @@ const VTreeview = genericComponent()({
         "ref": vListRef
       }, listProps, {
         "class": ['v-treeview', props.class],
+        "open-strategy": "multiple",
         "style": props.style,
         "opened": opened.value,
         "activated": activated.value,
@@ -29795,6 +29802,7 @@ const VTreeview = genericComponent()({
         "onUpdate:selected": $event => selected.value = $event
       }), {
         default: () => [createVNode(VTreeviewChildren, mergeProps(treeviewChildrenProps, {
+          "returnObject": props.returnObject,
           "items": items.value
         }), slots)]
       });
@@ -30300,7 +30308,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.6.13";
+const version$1 = "3.7.0-beta.1";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -30553,7 +30561,7 @@ var index = /*#__PURE__*/Object.freeze({
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.6.13";
+const version = "3.7.0-beta.1";
 
 /* eslint-disable local-rules/sort-imports */