feat(VTreeview): add footer slot (#22130)

resolves #22100

Author: J-Sek

packages/api-generator/src/locale/en/VTreeview.json

@@ -41,7 +41,8 @@
   "slots": {
     "append": "Appends content after label.",
     "prepend": "Prepends content before label.",
-    "header": "Slot for custom header.",
+    "header": "Slot for expandable nodes (all items that are not leafs).",
+    "footer": "Slot for footer below expanded children.",
     "subheader": "Slot for custom subheader.",
     "divider": "Slot for custom divider."
   },

packages/docs/src/data/new-in.json

@@ -264,6 +264,7 @@
     },
     "slots": {
       "header": "3.10.0",
+      "footer": "3.11.0",
       "toggle": "3.10.0"
     }
   },

packages/vuetify/src/components/VTreeview/VTreeviewChildren.tsx

@@ -38,6 +38,11 @@ export type VTreeviewChildrenSlots<T> = {
     internalItem: InternalListItem<T>
     loading: boolean
   }
+  footer: {
+    item: T
+    internalItem: InternalListItem<T>
+    loading: boolean
+  }
   divider: { props: InternalListItem['props'] }
   subheader: { props: InternalListItem['props'] }
 }
@@ -224,15 +229,18 @@ export const VTreeviewChildren = genericComponent<new <T extends InternalListIte
               )
             },
             default: () => (
-              <VTreeviewChildren
-                { ...treeviewChildrenProps }
-                items={ children }
-                indentLinesVariant={ props.indentLinesVariant }
-                parentIndentLines={ indentLines.children }
-                isLastGroup={ nextItemHasChildren }
-                returnObject={ props.returnObject }
-                v-slots={ slots }
-              />
+              <>
+                <VTreeviewChildren
+                  { ...treeviewChildrenProps }
+                  items={ children }
+                  indentLinesVariant={ props.indentLinesVariant }
+                  parentIndentLines={ indentLines.children }
+                  isLastGroup={ nextItemHasChildren }
+                  returnObject={ props.returnObject }
+                  v-slots={ slots }
+                />
+                { slots.footer?.({ item: item.raw, internalItem: item, loading }) }
+              </>
             ),
           }}
         </VTreeviewGroup>