diff --git a/packages/docs/src/data/new-in.json b/packages/docs/src/data/new-in.json index 181584b3b39..0e7f0029d55 100644 --- a/packages/docs/src/data/new-in.json +++ b/packages/docs/src/data/new-in.json @@ -254,11 +254,14 @@ "VTreeview": { "props": { "hideActions": "3.9.0", + "hideNoData": "3.10.0", + "noDataText": "3.10.0", "separateRoots": "3.9.0", "indentLines": "3.9.0" }, "slots": { "header": "3.10.0", + "no-data": "3.10.0", "toggle": "3.10.0" } }, diff --git a/packages/vuetify/src/components/VTreeview/VTreeview.tsx b/packages/vuetify/src/components/VTreeview/VTreeview.tsx index d9d5c42f193..23e84de7c07 100644 --- a/packages/vuetify/src/components/VTreeview/VTreeview.tsx +++ b/packages/vuetify/src/components/VTreeview/VTreeview.tsx @@ -1,8 +1,10 @@ // Components import { makeVTreeviewChildrenProps, VTreeviewChildren } from './VTreeviewChildren' import { makeVListProps, useListItems, VList } from '@/components/VList/VList' +import { VListItem } from '@/components/VList/VListItem' // Composables +import { useLocale } from '@/composables' import { provideDefaults } from '@/composables/defaults' import { makeFilterProps, useFilter } from '@/composables/filter' import { useProxiedModel } from '@/composables/proxiedModel' @@ -31,6 +33,11 @@ export const makeVTreeviewProps = propsFactory({ openAll: Boolean, indentLines: [Boolean, String] as PropType, search: String, + hideNoData: Boolean, + noDataText: { + type: String, + default: '$vuetify.noDataText', + }, ...makeFilterProps({ filterKeys: ['title'] }), ...omit(makeVTreeviewChildrenProps(), [ @@ -53,7 +60,9 @@ export const VTreeview = genericComponent( props: { items?: T[] }, - slots: VTreeviewChildrenSlots + slots: VTreeviewChildrenSlots & { + 'no-data': never + } ) => GenericProps>()({ name: 'VTreeview', @@ -69,6 +78,7 @@ export const VTreeview = genericComponent( }, setup (props, { slots, emit }) { + const { t } = useLocale() const { items } = useListItems(props) const activeColor = toRef(() => props.activeColor) const baseColor = toRef(() => props.baseColor) @@ -175,6 +185,9 @@ export const VTreeview = genericComponent( v-model:activated={ activated.value } v-model:selected={ selected.value } > + { visibleIds.value?.size === 0 && !props.hideNoData && ( + slots['no-data']?.() ?? () + )}