feat(VTreeview): add no-data slot

[J-Sek]

Description

• introduces no-data slot along with hide-no-data and no-data-text props

uses VListItem instead of VTreeviewItem because the latter injects visibleIds and hides itself. VTreeviewItem was also my first pick for an element inside the custom slot - it my be confusing to many devs.

• [TBD] VTreeviewItem might benefit from an additional filterable prop that could be passed down using VDefaultsProvider, so the same component outside of VTreeviewChildren would ignore visibleIds

resolves #21954

Markup:

<template>
  <v-app>
    <v-container max-width="500">
      <v-text-field v-model="search" prepend-inner-icon="mdi-magnify" clearable />
      <v-treeview
        v-model="model"
        :items="items"
        :search="search"
        item-value="id"
        open-all
      >
        <template #no-data>
          <v-list-item :title="`There are no results matching '${search}'`" />
        </template>
      </v-treeview>
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref } from 'vue'

  const model = ref()
  const search = ref('')

  const items = [
    {
      id: 115,
      title: 'Documents',
      children: [
        {
          id: 116,
          title: 'Financial',
          children: [
            { id: 17, title: 'November.pdf' },
          ],
        },
        {
          id: 117,
          title: 'Taxes',
          children: [
            { id: 118, title: 'December.pdf' },
            { id: 119, title: 'January.pdf' },
          ],
        },
        {
          id: 120,
          title: 'Later',
          children: [
            { id: 121, title: 'Company logo.png' },
          ],
        },
      ],
    },
  ]
</script>