InputMask is used as a controlled input with v-model property.

Mask format can be a combination of the following definitions; a for alphabetic characters, 9 for numeric characters and * for alphanumberic characters. In addition, formatting characters like (, ) , - are also accepted.

When the input does not complete the mask definition, it is cleared by default. Use autoClear property to control this behavior. In addition, ? is used to mark anything after the question mark optional.

Default placeholder for a mask is underscore that can be customized using slotChar property.

Specify the variant property as filled to display the component with a higher visual emphasis than the default outlined style.

FloatLabel visually integrates a label with its form element. Visit FloatLabel documentation for more information.

IftaLabel is used to create infield top aligned labels. Visit IftaLabel documentation for more information.

InputMask provides small and large sizes as alternatives to the base.

The fluid prop makes the component take up the full width of its container when set to true.

When disabled is present, the element cannot be edited and focused.

The invalid state is applied using the invalid property to indicate failed validation, which can be integrated with form validation.

InputMask integrates seamlessly with the PrimeVue Forms library.

Screen Reader

InputMask component renders a native input element that implicitly includes any passed prop. Value to describe the component can either be provided via label tag combined with id prop or using aria-labelledby, aria-label props.

Keyboard Support