diff --git a/docs/content/3.components/tree.md b/docs/content/3.components/tree.md
index 93452397c3..ef7383ec60 100644
--- a/docs/content/3.components/tree.md
+++ b/docs/content/3.components/tree.md
@@ -411,6 +411,7 @@ Use the `slot` property to customize a specific item.
You will have access to the following slots:
+- `#{{ item.slot }}-wrapper`{lang="ts-type"}
- `#{{ item.slot }}`{lang="ts-type"}
- `#{{ item.slot }}-leading`{lang="ts-type"}
- `#{{ item.slot }}-label`{lang="ts-type"}
diff --git a/src/runtime/components/Tree.vue b/src/runtime/components/Tree.vue
index 9677f59b90..ebef2f61a7 100644
--- a/src/runtime/components/Tree.vue
+++ b/src/runtime/components/Tree.vue
@@ -90,6 +90,7 @@ export type TreeSlots<
A extends TreeItem[] = TreeItem[],
T extends NestedItem = NestedItem
> = {
+ 'item-wrapper': SlotProps
'item': SlotProps
'item-leading': SlotProps
'item-label': SlotProps
@@ -163,35 +164,37 @@ const defaultExpanded = computed(() =>
@toggle="item.onToggle"
@select="item.onSelect"
>
-
+
+
+ {{ getItemLabel(item) }}
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/test/components/Tree.spec.ts b/test/components/Tree.spec.ts
index 9339c282ec..d17365560f 100644
--- a/test/components/Tree.spec.ts
+++ b/test/components/Tree.spec.ts
@@ -60,6 +60,7 @@ describe('Tree', () => {
['with ui', { props: { ...props, ui: { link: 'font-bold' } } }],
// Slots
['with default slot', { props, slots: { default: () => 'default slot' } }],
+ ['with item-wrapper slot', { props, slots: { 'item-wrapper': () => 'wrapper slot' } }],
['with item slot', { props, slots: { item: () => 'item slot' } }],
['with item-leading slot', { props, slots: { 'item-leading': () => 'leading slot' } }],
['with item-trailing slot', { props, slots: { 'item-trailing': () => 'trailing slot' } }],
diff --git a/test/components/__snapshots__/Tree-vue.spec.ts.snap b/test/components/__snapshots__/Tree-vue.spec.ts.snap
index a8da856c18..83c03b4162 100644
--- a/test/components/__snapshots__/Tree-vue.spec.ts.snap
+++ b/test/components/__snapshots__/Tree-vue.spec.ts.snap
@@ -250,6 +250,20 @@ exports[`Tree > renders with item-trailing slot correctly 1`] = `
"
`;
+exports[`Tree > renders with item-wrapper slot correctly 1`] = `
+"
+ - app
+
+
+ - wrapper slot
+
+
+ - wrapper slot
+
+
+
"
+`;
+
exports[`Tree > renders with items correctly 1`] = `
"
- app
diff --git a/test/components/__snapshots__/Tree.spec.ts.snap b/test/components/__snapshots__/Tree.spec.ts.snap
index d02a6dd671..4c44d639d7 100644
--- a/test/components/__snapshots__/Tree.spec.ts.snap
+++ b/test/components/__snapshots__/Tree.spec.ts.snap
@@ -250,6 +250,20 @@ exports[`Tree > renders with item-trailing slot correctly 1`] = `
"
`;
+exports[`Tree > renders with item-wrapper slot correctly 1`] = `
+"
+ - app
+
+
+ - wrapper slot
+
+
+ - wrapper slot
+
+
+
"
+`;
+
exports[`Tree > renders with items correctly 1`] = `
"