# InputMask

UI-buildercraft introduces an advanced InputMask component for Angular applications, enabling seamless integration of customizable text inputs with masking capabilities. This component supports various properties, including text box configurations, validations, and extensive styling options, allowing you to effortlessly tailor the appearance and behavior of masked input fields to meet your application's unique design and functional needs.

{% tabs %}
{% tab title="Preview" %}
<figure><img src="https://3853755219-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRZsE7PGMzORdJjMe0QqY%2Fuploads%2FecVCzWRAoLLGZozmGVTz%2Fimage.png?alt=media&#x26;token=85972040-fb0a-46a7-a3fa-53179fa2d328" alt=""><figcaption></figcaption></figure>


{% endtab %}

{% tab title="Html" %}
```
<UI-BuilderCraft-InputMask [mask]="'9999-9999999-9'" [required]="true" [label]="'CNIC'"></UI-BuilderCraft-InputMask>
```
{% endtab %}

{% tab title="Module" %}


```typescript

  imports: [InputMaskComponent]

```
{% endtab %}
{% endtabs %}

| Properties  | Type    | Default Value |
| ----------- | ------- | ------------- |
| Label       | String  | Empty         |
| Disable     | Boolean | False         |
| Placeholder | String  | Empty         |
| Required    | Boolean | False         |
| Mask        | String  | Empty         |



