feat(VMaskInput): Multiple and dynamic mask resolution

[ikushum]

Related to #21714

Description

Implemented dynamic resolution of the mask aka having more than 1 mask for the input

Markup:

<template>
  <v-app>
    <v-container class="py-8">
      <v-card class="mb-6 pa-4">
        <v-card-title>Dynamic Mask: Letters vs Numbers</v-card-title>
        <v-card-subtitle>
          Type letters for (AA)-### format, or numbers for (##)-AAA format
        </v-card-subtitle>
        <v-card-text>
          <v-mask-input
            v-model="alphaNumeric"
            :mask="['(AA)-###', '(##)-AAA']"
            hint="Try: AB123 or 12ABC"
            label="Type letters or numbers"
            persistent-hint
          />
        </v-card-text>
      </v-card>

      <v-card class="mb-6 pa-4">
        <v-card-title>Best Match Selection</v-card-title>
        <v-card-subtitle>
          The mask producing the longest output is automatically selected
        </v-card-subtitle>
        <v-card-text>
          <v-mask-input
            v-model="bestMatch"
            :mask="['####', '##-##-##']"
            hint="##-## or '##-##-##"
            label="Type digits"
            persistent-hint
          />
        </v-card-text>
      </v-card>
    </v-container>
  </v-app>
</template>

<script setup>
  import { ref } from 'vue'
  import { VMaskInput } from '@/labs/VMaskInput'

  const alphaNumeric = ref('')
  const bestMatch = ref('')
</script>