@asoftwareworld/form-builder-pro/fesm2022/asoftwareworld-form-builder-pro-form-control-textfield.mjs.map

ASW Form Builder Pro helps you with rapid development and designed web forms which includes several controls. The key feature of Form Builder is to make your content attractive and effective. We can customize our control at run time and preview the same b

{"version":3,"file":"asoftwareworld-form-builder-pro-form-control-textfield.mjs","sources":["../../src/components/form-control/textfield/textfield.ts","../../src/components/form-control/textfield/textfield.html","../../src/components/form-control/textfield/textfield.module.ts","../../src/components/form-control/textfield/public_api.ts","../../src/components/form-control/textfield/asoftwareworld-form-builder-pro-form-control-textfield.ts"],"sourcesContent":["/**\n * @license\n * Copyright ASW (A Software World) All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file\n */\n\nimport { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { MatDialog } from '@angular/material/dialog';\nimport { ControlOption, CSSFrameworkEnum } from '@asoftwareworld/form-builder-pro/api';\nimport { Constants, Icons } from '@asoftwareworld/form-builder-pro/common';\nimport { AswConfirmDialog } from '@asoftwareworld/form-builder-pro/form-control/confirm-dialog';\nimport { AswTextDialog } from '@asoftwareworld/form-builder-pro/form-control/shared';\nimport { TextFieldControl } from './textfield-control';\n\n@Component({\n    selector: 'asw-textfield',\n    templateUrl: './textfield.html'\n})\nexport class AswTextField {\n    constants: any = Constants;\n    icons = Icons;\n    /**\n     * TextField control\n     */\n    @Input() control: TextFieldControl | null = null;\n    @Input() propertyPersonalization: string[] = [];\n    @Input() isPreviewTemplate = false;\n    @Input() CSSFramework = CSSFrameworkEnum.Material;\n    @Input() patterns: ControlOption[] = [];\n\n    @Output() textFieldUpdateEvent = new EventEmitter<any>();\n    @Output() textFieldDeleteEvent = new EventEmitter<any>();\n    @Output() aswModelChange = new EventEmitter<TextFieldControl>();\n    @Output() duplicateControl = new EventEmitter<TextFieldControl>();\n\n    constructor(public dialog: MatDialog) {}\n\n    deleteTextFieldDialog(control: TextFieldControl): void {\n        const dialogRef = this.dialog.open(AswConfirmDialog, {\n            width: '350px',\n            data: { name: control.controlType, message: this.constants.messages.waringMessage }\n        });\n        dialogRef.afterClosed().subscribe((result) => {\n            if (result !== undefined) {\n                this.textFieldDeleteEvent.emit(control);\n            }\n        });\n    }\n\n    editTextFieldDialog(control: TextFieldControl): void {\n        const dialogRef = this.dialog.open(AswTextDialog, {\n            width: '80%',\n            minWidth: '70vw',\n            disableClose: true,\n            data: { control, CSSFramework: this.CSSFramework, propertyPersonalization: this.propertyPersonalization, patterns: this.patterns }\n        });\n        dialogRef.afterClosed().subscribe((result) => {\n            if (result !== undefined) {\n                this.textFieldUpdateEvent.emit(result);\n            }\n        });\n    }\n\n    onChange(control: TextFieldControl): void {\n        this.aswModelChange.emit(control);\n    }\n\n    duplicateTextFieldControl(control: TextFieldControl): void {\n        this.duplicateControl.emit(control);\n    }\n}\n","<ng-container *ngIf=\"control as control\">\r\n    <ng-container *ngIf=\"CSSFramework === 'material'; else bootstrap\">\r\n        <ng-container [ngSwitch]=\"control.controlType\">\r\n            <ng-container *ngSwitchCase=\"'textfield'\">\r\n                <mat-form-field [appearance]=\"control.style\" class=\"asw-width-100 {{control.customClass}}\">\r\n                    <mat-label>{{control.label | aswTranslate}}</mat-label>\r\n                    <input matInput type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        pattern=\"{{control.pattern}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #textfield=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                        <mat-icon *ngIf=\"textfield.invalid && (textfield.dirty || textfield.touched)\"\r\n                            class=\"asw-error\" matSuffix>error\r\n                        </mat-icon>\r\n                    <mat-error *ngIf=\"textfield.invalid && (textfield.dirty || textfield.touched)\">\r\n                        <ng-container *ngIf=\"textfield?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"textfield?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"textfield?.errors?.pattern\">\r\n                            {{control.customErrorMsg}}\r\n                        </ng-container>\r\n                    </mat-error>\r\n                </mat-form-field>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'textarea'\">\r\n                <mat-form-field [appearance]=\"control.style\" class=\"asw-width-100 {{control.customClass}}\">\r\n                    <mat-label>{{control.label | aswTranslate}}</mat-label>\r\n                    <textarea matInput type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        pattern=\"{{control.pattern}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #input=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [disabled]=\"control.isDisabled ? true : false\"></textarea>\r\n                        <mat-icon *ngIf=\"input.invalid && (input.dirty || input.touched)\"\r\n                            class=\"asw-error\" matSuffix>error\r\n                        </mat-icon>\r\n                    <mat-error *ngIf=\"input.invalid && (input.dirty || input.touched)\">\r\n                        <ng-container *ngIf=\"input?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"input?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"input?.errors?.pattern\">\r\n                            {{control.customErrorMsg}}\r\n                        </ng-container>\r\n                    </mat-error>\r\n                </mat-form-field>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'email'\">\r\n                <mat-form-field [appearance]=\"control.style\" class=\"asw-width-100 {{control.customClass}}\">\r\n                    <mat-label>{{control.label | aswTranslate}}</mat-label>\r\n                    <input matInput type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        pattern=\"{{control.pattern ? control.pattern : '^[A-Za-z0-9_\\+-]+(\\.[A-Za-z0-9_\\+-]+)*@[A-Za-z0-9-]+(\\.[A-Za-z0-9-]+)*\\.([A-Za-z]{2,4})$'}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #input=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                        <mat-icon *ngIf=\"input.invalid && (input.dirty || input.touched)\"\r\n                            class=\"asw-error\" matSuffix>error\r\n                        </mat-icon>\r\n                    <mat-error *ngIf=\"input.invalid && (input.dirty || input.touched)\">\r\n                        <ng-container *ngIf=\"input?.errors?.required\">\r\n                            {{'Please enter a valid email address' | aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"input?.errors?.pattern\">\r\n                            {{(control.customErrorMsg ? control.customErrorMsg : 'Email format should be xyz@example.com') | aswTranslate}}.\r\n                        </ng-container>\r\n                    </mat-error>\r\n                </mat-form-field>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'url'\">\r\n                <mat-form-field [appearance]=\"control.style\" class=\"asw-width-100 {{control.customClass}}\">\r\n                    <mat-label>{{control.label | aswTranslate}}</mat-label>\r\n                    <input matInput type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        pattern=\"{{control.pattern ? control.pattern : '^(http:\\/\\/www\\.|https:\\/\\/www\\.|http:\\/\\/|https:\\/\\/)?[a-z0-9]+([\\-\\.]{1}[a-z0-9]+)*\\.[a-z]{2,5}(:[0-9]{1,5})?(\\/.*)?$'}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #url=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                        <mat-icon *ngIf=\"url.invalid && (url.dirty || url.touched)\"\r\n                            class=\"asw-error\" matSuffix>error\r\n                        </mat-icon>\r\n                    <mat-error *ngIf=\"url.invalid && (url.dirty || url.touched)\">\r\n                        <ng-container *ngIf=\"url?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"url?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"url?.errors?.pattern\">\r\n                            {{(control.customErrorMsg ? control.customErrorMsg : 'Yikes! That\\'s not a valid URL') | aswTranslate}}\r\n                        </ng-container>\r\n                    </mat-error>\r\n                </mat-form-field>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'phone-number'\">\r\n                <mat-form-field [appearance]=\"control.style\" class=\"asw-width-100 {{control.customClass}}\">\r\n                    <mat-label>{{control.label | aswTranslate}}</mat-label>\r\n                    <input matInput type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        pattern=\"{{control.pattern}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #phoneNumber=\"ngModel\"\r\n                        aswMask=\"(000) 000-0000\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                        <mat-icon *ngIf=\"phoneNumber.invalid && (phoneNumber.dirty || phoneNumber.touched)\"\r\n                            class=\"asw-error\" matSuffix>error\r\n                        </mat-icon>\r\n                    <mat-error *ngIf=\"phoneNumber.invalid && (phoneNumber.dirty || phoneNumber.touched)\">\r\n                        <ng-container *ngIf=\"phoneNumber?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"phoneNumber?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"phoneNumber?.errors?.pattern\">\r\n                            {{(control.customErrorMsg ? control.customErrorMsg : 'Not a valid Phone Number') | aswTranslate}}\r\n                        </ng-container>\r\n                    </mat-error>\r\n                </mat-form-field>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-container>\r\n    <ng-template #bootstrap>\r\n        <ng-container [ngSwitch]=\"control.controlType\">\r\n            <ng-container *ngSwitchCase=\"'textfield'\">\r\n                <div class=\"asw-mb-3\">\r\n                    <label for=\"{{control.id}}\" \r\n                    class=\"asw-input-label {{(textfield.invalid && (textfield.dirty || textfield.touched)) ? 'asw-red-color' : ''}}\"\r\n                    [class.asw-invalid-label]=\"control.isRequired\">{{control.label | aswTranslate}}</label>\r\n                    <input type=\"text\" \r\n                        class=\"asw-input-control {{control.customClass}}\" \r\n                        id=\"{{control.id}}\" \r\n                        pattern=\"{{control.pattern}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #textfield=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [class.asw-is-invalid]=\"textfield.invalid && (textfield.dirty || textfield.touched)\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                    <div *ngIf=\"textfield.invalid && (textfield.dirty || textfield.touched)\" class=\"invalid-feedback\">\r\n                        <ng-container *ngIf=\"textfield?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"textfield?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"textfield?.errors?.pattern\">\r\n                            {{control.customErrorMsg}}\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'textarea'\">\r\n                <div class=\"asw-mb-3\">\r\n                    <label for=\"{{control.id}}\" \r\n                    class=\"asw-input-label {{(input.invalid && (input.dirty || input.touched)) ? 'asw-red-color' : ''}}\"\r\n                    [class.asw-invalid-label]=\"control.isRequired\">{{control.label | aswTranslate}}</label>\r\n                    <textarea type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        class=\"asw-input-control {{control.customClass}}\" \r\n                        pattern=\"{{control.pattern}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #input=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [class.asw-is-invalid]=\"input.invalid && (input.dirty || input.touched)\"\r\n                        [disabled]=\"control.isDisabled ? true : false\"></textarea>\r\n                    <div *ngIf=\"input.invalid && (input.dirty || input.touched)\" class=\"invalid-feedback\">\r\n                        <ng-container *ngIf=\"input?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"input?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"input?.errors?.pattern\">\r\n                            {{control.customErrorMsg}}\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'email'\">\r\n                <div class=\"asw-mb-3\">\r\n                    <label for=\"{{control.id}}\" \r\n                    class=\"asw-input-label {{(input.invalid && (input.dirty || input.touched)) ? 'asw-red-color' : ''}}\"\r\n                    [class.asw-invalid-label]=\"control.isRequired\">{{control.label | aswTranslate}}</label>\r\n                    <input type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        pattern=\"{{control.pattern ? control.pattern : '^[A-Za-z0-9_\\+-]+(\\.[A-Za-z0-9_\\+-]+)*@[A-Za-z0-9-]+(\\.[A-Za-z0-9-]+)*\\.([A-Za-z]{2,4})$'}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        class=\"asw-input-control {{control.customClass}}\" \r\n                        [(ngModel)]=\"control.value\"\r\n                        #input=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [class.asw-is-invalid]=\"input.invalid && (input.dirty || input.touched)\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                    <div *ngIf=\"input.invalid && (input.dirty || input.touched)\" class=\"invalid-feedback\">\r\n                        <ng-container *ngIf=\"input?.errors?.required\">\r\n                            {{'Please enter a valid email address'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"input?.errors?.pattern\">\r\n                            {{(control.customErrorMsg ? control.customErrorMsg : 'Email format should be xyz@example.com')| aswTranslate}}.\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'url'\">\r\n                <div class=\"asw-mb-3\">\r\n                    <label for=\"{{control.id}}\" \r\n                    class=\"asw-input-label {{(url.invalid && (url.dirty || url.touched)) ? 'asw-red-color' : ''}}\"\r\n                    [class.asw-invalid-label]=\"control.isRequired\">{{control.label | aswTranslate}}</label>\r\n                    <input type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        class=\"asw-input-control {{control.customClass}}\" \r\n                        pattern=\"{{control.pattern ? control.pattern : '^(http:\\/\\/www\\.|https:\\/\\/www\\.|http:\\/\\/|https:\\/\\/)?[a-z0-9]+([\\-\\.]{1}[a-z0-9]+)*\\.[a-z]{2,5}(:[0-9]{1,5})?(\\/.*)?$'}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #url=\"ngModel\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [required]=\"control.isRequired\"\r\n                        [class.asw-is-invalid]=\"url.invalid && (url.dirty || url.touched)\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                    <div *ngIf=\"url.invalid && (url.dirty || url.touched)\" class=\"invalid-feedback\">\r\n                        <ng-container *ngIf=\"url?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"url?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"url?.errors?.pattern\">\r\n                            {{(control.customErrorMsg ? control.customErrorMsg : 'Yikes! That\\'s not a valid URL') | aswTranslate}}\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n            <ng-container *ngSwitchCase=\"'phone-number'\">\r\n                <div class=\"asw-mb-3\">\r\n                    <label for=\"{{control.id}}\" \r\n                    class=\"asw-input-label {{(phoneNumber.invalid && (phoneNumber.dirty || phoneNumber.touched)) ? 'asw-red-color' : ''}}\"\r\n                    [class.asw-invalid-label]=\"control.isRequired\">{{control.label | aswTranslate}}</label>\r\n                    <input type=\"text\"\r\n                        [id]=\"control.id\"\r\n                        class=\"asw-input-control {{control.customClass}}\" \r\n                        pattern=\"{{control.pattern}}\"\r\n                        [placeholder]=\"control.label | aswTranslate\"\r\n                        [(ngModel)]=\"control.value\"\r\n                        #phoneNumber=\"ngModel\"\r\n                        aswMask=\"(000) 000-0000\"\r\n                        (change)=\"onChange(control)\"\r\n                        [matTooltip]=\"control.tooltip | aswTranslate\"\r\n                        [maxlength]=\"control.maxlength\"\r\n                        [minlength]=\"control.minlength\"\r\n                        [class.asw-is-invalid]=\"phoneNumber.invalid && (phoneNumber.dirty || phoneNumber.touched)\"\r\n                        [required]=\"control.isRequired\"\r\n                        [disabled]=\"control.isDisabled ? true : false\">\r\n                    <div *ngIf=\"phoneNumber.invalid && (phoneNumber.dirty || phoneNumber.touched)\" class=\"invalid-feedback\">\r\n                        <ng-container *ngIf=\"phoneNumber?.errors?.required\">\r\n                            {{control.label | aswTranslate}} {{'FormControl.IsRequired' | aswTranslate}}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"phoneNumber?.errors?.minlength\">\r\n                            {{'Sorry' | aswTranslate }}, {{control.label | aswTranslate}} {{'must be at least' | aswTranslate}} {{control.minlength}} {{'characters long'| aswTranslate}}.\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"phoneNumber?.errors?.pattern\">\r\n                            {{(control.customErrorMsg ? control.customErrorMsg : 'Not a valid Phone Number') | aswTranslate}}\r\n                        </ng-container>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </ng-container>\r\n    </ng-template>    \r\n    <div class=\"asw-row\" *ngIf=\"isPreviewTemplate\">\r\n        <div class=\"asw-col-md-12\" align=\"right\">\r\n            <button mat-icon-button \r\n                    type=\"button\" \r\n                    matTooltip=\"{{'FormControl.Duplicate' | aswTranslate}}\" \r\n                    [matTooltipPosition]=\"'below'\" \r\n                    (click)=\"duplicateTextFieldControl(control)\">\r\n                <div [innerHTML]=\"icons.contentCopy | aswSafeHtml\"></div>\r\n            </button>\r\n            <button mat-icon-button \r\n                    type=\"button\" \r\n                    matTooltip=\"{{'FormControl.Edit' | aswTranslate}}\" \r\n                    [matTooltipPosition]=\"'below'\" \r\n                    (click)=\"editTextFieldDialog(control)\">\r\n                <div [innerHTML]=\"icons.edit | aswSafeHtml\"></div>\r\n            </button>\r\n            <button mat-icon-button \r\n                    type=\"button\" \r\n                    matTooltip=\"{{'FormControl.Delete' | aswTranslate}}\" \r\n                    [matTooltipPosition]=\"'below'\" \r\n                    (click)=\"deleteTextFieldDialog(control)\">\r\n                <div [innerHTML]=\"icons.delete2 | aswSafeHtml\"></div>\r\n            </button>\r\n        </div>\r\n    </div>\r\n</ng-container>","/**\n * @license\n * Copyright ASW (A Software World) All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file\n */\n\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { AswMaskModule, AswPipeModule, MaterialModule } from '@asoftwareworld/form-builder-pro/common';\nimport { AswTranslateModule } from '@asoftwareworld/form-builder-pro/core';\nimport { AswConfirmDialogModule } from '@asoftwareworld/form-builder-pro/form-control/confirm-dialog';\nimport { AswSharedDialogModule } from '@asoftwareworld/form-builder-pro/form-control/shared';\n\nimport { AswTextField } from './textfield';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, ReactiveFormsModule, MaterialModule, AswConfirmDialogModule, AswSharedDialogModule, AswTranslateModule, AswPipeModule, AswMaskModule.forRoot()],\n    declarations: [AswTextField],\n    exports: [AswTextField]\n})\nexport class AswTextFieldModule {}\n","/**\n * @license\n * Copyright ASW (A Software World) All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file\n */\n\nexport * from './textfield';\nexport * from './textfield-control';\nexport * from './textfield.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}