refactor(group/layout/helpers): remove findChildrenWithProvide reliance

[johnleider]

Apparently this will break Vue vapor mode. I removed it's usage in layout and group and everything seems to still work fine. Docs are a bit jacked up but that could be something we're doing wrong. Needs more investigation but this is at least a start. There are obviously some issues and 2 unit tests fail.

This is to get the conversation going.

Markup:

<template>
  <v-card>
    <v-layout>
      <v-app-bar color="primary">
        <v-app-bar-nav-icon variant="text" @click.stop="drawer = !drawer" />

        <v-toolbar-title>My files</v-toolbar-title>

        <v-spacer />

        <template v-if="$vuetify.display.mdAndUp">
          <v-btn icon="mdi-magnify" variant="text" />

          <v-btn icon="mdi-filter" variant="text" />
        </template>

        <v-btn icon="mdi-dots-vertical" variant="text" />
      </v-app-bar>

      <v-navigation-drawer
        v-model="drawer"
        :location="$vuetify.display.mobile ? 'bottom' : undefined"
        temporary
      >
        <v-list
          :items="items"
        />
      </v-navigation-drawer>

      <v-main style="height: 500px;">
        <v-card-text>
          The navigation drawer will appear from the bottom on smaller size screens.
        </v-card-text>
      </v-main>
    </v-layout>
  </v-card>
</template>
<script setup>
  import { ref, watch } from 'vue'

  const items = [
    {
      title: 'Foo',
      value: 'foo',
    },
    {
      title: 'Bar',
      value: 'bar',
    },
    {
      title: 'Fizz',
      value: 'fizz',
    },
    {
      title: 'Buzz',
      value: 'buzz',
    },
  ]

  const drawer = ref(false)
  const group = ref(null)

  watch(group, () => {
    drawer.value = false
  })
</script>

[KaelWD]

This will break when render order != template order.

<template>
  <v-app>
    <v-container>
      <v-tabs v-model="tab">
        <v-tab>0</v-tab>
        <v-tab v-if="showOne">1</v-tab>
        <v-tab>2</v-tab>
      </v-tabs>

      <pre>{{ tab }}</pre>
      <v-switch v-model="showOne" />
    </v-container>
  </v-app>
</template>

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

  const tab = ref()
  const showOne = ref(true)
</script>

Yeah you can see the tests for this case are failing too. It might be possible to do something similar with vapor, I haven't explored it at all yet.