feat(VTextField): port to v3

[KaelWD]

fixes #7872
fixes #12989

Markup:

<template>
  <v-app>
    <v-container>
      <input v-model="density" type="radio" name="density" value="default">
      <input v-model="density" type="radio" name="density" value="comfortable">
      <input v-model="density" type="radio" name="density" value="compact">

      <v-defaults-provider :defaults="{ global: { density }}">
        <template v-for="variant in variants">
          <v-text-field
            v-model="model"
            label="LTR"
            :variant="variant"
          />

          <div class="my-6" />

          <v-text-field
            v-model="model"
            reverse
            label="LTR Reversed"
            append-inner-icon="mdi-clock-alert"
            prepend-inner-icon="mdi-clock-alert"
            :variant="variant"
          />

          <div class="my-6" />

          <v-locale-provider rtl>
            <v-text-field
              v-model="model"
              label="RTL"
              append-inner-icon="mdi-clock-alert"
              prepend-inner-icon="mdi-clock-alert"
              :variant="variant"
            />

            <div class="my-6" />

            <v-text-field
              v-model="model"
              reverse
              label="RTL Reversed"
              append-inner-icon="mdi-clock-alert"
              prepend-inner-icon="mdi-clock-alert"
              :variant="variant"
            />

            <div class="my-12" />
          </v-locale-provider>
        </template>
      </v-defaults-provider>
    </v-container>
  </v-app>
</template>

<script>
  export default {
    data: () => ({
      model: '',
      density: 'default',
      variants: ['plain', 'underlined', 'filled', 'outlined', 'contained'],
    }),
  }
</script>

• prefix/suffix
• events
• counter
• clearable
• placeholder
• disabled
• ref methods ($refs.textField.focus() etc.)
• ARIA roles