fix(VGrid): fix breakpoints types

[yuwu9145]

fix #16604

Description

resolves #16604

Markup:

<template>
  <v-app>
    <v-main>
      <v-row
        alignSm="end"
        alignMd="end"
        align-lg="end"
        alignXl="end"
        alignXxl="end"
        alignContent="start"
        alignContentSm="start"
        align-content-md="start"
        align-content-lg="start"
        alignContentXl="start"
        alignContentXxl="start"
        justify-sm="space-between"
        justifyMd="space-between"
        justify-lg="space-between"
        justify-xl="space-between"
        justify-xxl="space-between"
      >
        <v-col 
          cols="12"
          sm="7"
          md="7"
          lg="7"
          xl="7"
          xxl="7"
          offset-sm="7"
          offsetMd="7"
          offset-lg="7"
          offsetXl="7"
          offsetXxl="7"
          orderSm="7"
          orderMd="7"
          orderLg="7"
          orderXl="7"
          orderXxl="7"
        ></v-col>
      </v-row>
    </v-main>
  </v-app>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
})
</script>

[johnleider]

I think the script should be a separate PR. @KaelWD needs to chime in on this as well.

[yuwu9145]

@KaelWD I can easily separate the script part into an independent PR if you want

[yuwu9145]

Script has been move to PR #16843

[johnleider]

we need to come up with a way to propagate this sizing information as part of the framework simply because of how many places it is used in.

[johnleider]

After thinking on this, I felt the most natural place would be within the display composable. What do you think @vuetifyjs/core-team ?

[yuwu9145]

What about this change in display composable?

[yuwu9145]

To make feedback process smooth, I moved breakpoints to display composable.

I also did a local testing via yarn build & yarn link against the repo in the issue, type errors from VGrid disappears.

[ferferga]

LGTM