Unexpected behavior when using v-maska:[options] with Vuetify 3 text field

[Oga]

Describe the bug

I copied the options for the 'reversed number format with thousand separators' from the documentation. However, it seems that Vuetify's v-text-field component does not pass the v-maska, data-maska, etc., to the input element. I tried using v-maska:[options], but it does not function in the same way as demonstrated in the live demo of the documentation..

Steps to reproduce

<v-text-field v-maska:[options]></v-text-field>

const { createApp, reactive } = Vue;
const { createVuetify } = Vuetify;
const { Mask, MaskInput, vMaska } = Maska;

const vuetify = createVuetify();

const app = createApp({
  directives: {
    maska: vMaska,
  },
  setup() {
    const options = reactive({
      mask: '9 99#',
      tokens: '9:[0-9]:repeated',
      reversed: true,
    });
    return {
      options,
    };
  },
})
.use(vuetify)
.mount('#app');

Reproduction link

https://stackblitz.com/edit/web-platform-r4hfnu?file=index.html

[ChaStPierre]

I'm also having the same issue. Can someone help?

[Alexander Shabunevich]

Simplified tokens format 9:[0-9]:repeated should be used only with data-maska-tokens attribute. With options object you need to use full form, like this:

const options = reactive({
  mask: '9 99#',
  tokens: {
    9: { pattern: /[0-9]/, repeated: true }
  },
  reversed: true,
});