x-phone multiple mask

[Artessan]

Describe the bug x-phone component: when a multiple mask the array is handle as one string

To Reproduce

<div class="col-span-2 lg:col-span-1">
    <x-phone id="multiple-mask" label="{{__('Phone')}}" mask="['(+##) ### ## ## ##, ### ## ## ##']"
             wire:model="contactForm.phone"/>
</div>

produce: ['(+12) 345 67 89 12, 345 67 89 12']

Expected behavior (+12) 345 67 89 12

Dependencies

• WireUI Version: 2-beta
• Laravel Version: 10.X.X
• Alpine.js Version: 3.X.X
• Livewire Version: 3.X.X

[django-wong]

Did you try ['(+12) 345 67 89 12', '345 67 89 12'] ?

[Artessan]

Hey, tested, the result is the same.

after checking some parts of the code I think the problem is this:

this is the render data on the div

wireui_inputs_maskable({isBlur:false,model:null,emitFormatted:false,mask:'[\'(+##) ### ## ## ##\', \'### ## ## ##\']',})

the mask is echoing as string and in

ts/utils/masker/index.ts

export const applyMask: ApplyMask = (mask, value, masked = true): string | null => {
  return Array.isArray(mask)
    ? dynamicMasker(mask, str(value), masked)
    : singleMasker(mask, str(value), masked)
}

before this The mask is never checked, parse or split as array; So the isArray method is always false using single mask