fix(VColorPicker): support dynamic width

[KaelWD]

Description

Fixes #7151
Fixes #16668

Markup:

<template>
  <v-app>
    <v-main class="ps-12">
      <v-color-picker v-model="pickerValueTop" width="100%" />
      <br>
      Top picker value: {{ pickerValueTop }}
      <br>
      <br>
      <v-color-picker v-model="pickerValueBottom" width="300" />
      <br>
      Bottom picker value: {{ pickerValueBottom }}
    </v-main>
  </v-app>
</template>

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

  const pickerValueTop = ref('#f00')
  const pickerValueBottom = ref('#f00')
</script>

[nekosaur]

<template>
  <v-app>
    <v-main class="pa-12">
      <v-window
        v-model="window"
        show-arrows
      >
        <v-window-item
          v-for="n in length"
          :key="n"
        >
          <v-card class="d-flex justify-center align-center">
            <v-color-picker width="100%" />
          </v-card>
        </v-window-item>
      </v-window>
    </v-main>
  </v-app>
</template>

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

  const length = ref(2)
  const window = ref()
</script>

go to next slide, then go back