fix(VTreeview): allow expansion of nodes when disabled

fixes #20832
vuetifyjs · Jan 20, 2025 · e9e5625 · e9e5625
1 parent 28ed40b
commit e9e5625
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/packages/vuetify/src/labs/VTreeview/VTreeviewChildren.tsx b/packages/vuetify/src/labs/VTreeview/VTreeviewChildren.tsx
@@ -32,6 +32,7 @@ export type VTreeviewChildrenSlots<T> = {
 }
 
 export const makeVTreeviewChildrenProps = propsFactory({
+  disabled: Boolean,
   loadChildren: Function as PropType<(item: unknown) => Promise<void>>,
   loadingIcon: {
     type: String,
@@ -67,7 +68,7 @@ export const VTreeviewChildren = genericComponent<new <T extends InternalListIte
   setup (props, { slots }) {
     const isLoading = reactive(new Set<unknown>())
 
-    const isClickOnOpen = computed(() => props.openOnClick != null ? props.openOnClick : props.selectable)
+    const isClickOnOpen = computed(() => !props.disabled && (props.openOnClick != null ? props.openOnClick : props.selectable))
 
     async function checkChildren (item: InternalListItem) {
       try {
@@ -99,6 +100,7 @@ export const VTreeviewChildren = genericComponent<new <T extends InternalListIte
                 <VCheckboxBtn
                   key={ item.value }
                   modelValue={ slotProps.isSelected }
+                  disabled={ props.disabled }
                   loading={ loading }
                   color={ props.selectedColor }
                   indeterminate={ slotProps.isIndeterminate }

diff --git a/packages/vuetify/src/labs/VTreeview/VTreeviewItem.sass b/packages/vuetify/src/labs/VTreeview/VTreeviewItem.sass
@@ -8,6 +8,9 @@
   .v-treeview
     --indent-padding: 0px
 
+    &.v-list--disabled .v-list-item__prepend
+      pointer-events: auto
+
   .v-treeview-group.v-list-group
     --list-indent-size: #{$treeview-group-list-indent-size}