feat(VMaskInput): Create new component

[ikushum]

fixes #10890
fixes #3618
fixes #9028
fixes #4484

Description

Created a new component v-mask-input.
This PR has been continued from #19207

Markup:

<template>
  <v-app>
    <v-container>
      <v-card>
        <v-card-title>
          <h1>Mask</h1>
        </v-card-title>

        <v-card-text>
          <v-text-field v-model="mask" label="Mask"></v-text-field>
        </v-card-text>
      </v-card>

      <br />
      <br />

      <v-card>
        <v-card-title>
          <h1>prop: returnMaskedValue = false</h1>
          <h3>v-model: {{ value }}</h3>
        </v-card-title>

        <v-card-text>
          <VMaskInput
            v-model="value"
            :mask="mask"
            label="Value"
          />
        </v-card-text>
      </v-card>

      <br />
      <br />

      <v-card>
        <v-card-title>
        <h1>prop: returnMaskedValue = true</h1>
        <h3>v-model: {{ value1 }}</h3>
        </v-card-title>

        <v-card-text>
          <VMaskInput
            returnMaskedValue
            v-model="value1"
            :mask="mask"
            label="Value"
          />
        </v-card-text>
      </v-card>
    </v-container>
  </v-app>
</template>

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

  const mask = ref('(###) ### - ####')
  const value = ref('4443331111')
  const value1 = ref('4443331111')
</script>

The base branch was changed.

[J-Sek]

Nice to have (maybe follow-up, possible in user-land):

Quick draft: 8d46f5e
Note: I think it would make sense to move it inside composable and replace all tokens (default and custom) with _

[johnleider]

This looks amazing. Great spread of information, unit tests, and clean code. I think the only area that could use some love would be more examples, like a lot. Maybe @MajesticPotatoe or @eesayas could chip in.

[johnleider]

Pending the unit tests being fixed (if any of them are even related to this P.R.)