ng-ipa-library 1.3.4 → 1.3.7

package/esm2020/lib/generate-form/generate-form.component.mjs

@@ -90,7 +90,7 @@ export class GenerateFormComponent {
     }
 }
 GenerateFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: GenerateFormComponent, deps: [{ token: i1.IPAFormService }], target: i0.ɵɵFactoryTarget.Component });
-GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: GenerateFormComponent, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", isArabicForm: "isArabicForm", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, ngImport: i0, template: "<form [formGroup]=\"generateForm\">\r\n    <ng-container *ngFor=\"let column of form.columns\">\r\n        <div [ngSwitch]=\"column.type\">\r\n            <!-- TEXTAREA -->\r\n            <div *ngSwitchCase=\"'textArea'\">\r\n                <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n                    [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-textarea-input>\r\n            </div>\r\n\r\n            <!-- DROP DOWN LIST -->\r\n            <div *ngSwitchCase=\"'select'\">\r\n                <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n                    [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n                    [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n                    *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n                        <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"checkbox\" formControlName=\"checkbox\">\r\n                        <label class=\"form-check-label\"\r\n                            [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n                            {{control.value[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\">\r\n                        <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"radio\" [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n                        <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n                            {{item[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n                <ipa-file-upload [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [acceptedFiles]=\"column.acceptedFiles!\" [multiple]=\"column.multipleFile!\"\r\n                    [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\" [autoUpload]=\"column.autoUploadFile!\"\r\n                    [apiUrl]=\"column.apiUrl?? 'apiUrl' \" [authorization]=\"column.authorization!\" ngDefaultControl\r\n                    [formControlName]=\"column.formControlName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n                </ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- recaptcha -->\r\n            <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n                <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"lang\" [theme]=\"theme\"\r\n                    [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n                    formControlName=\"{{column.formControlName}}\">\r\n                </ipa-recaptcha>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [type]=\"column.type\" [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [required]=\"column.required\" [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-text-input>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</form>", styles: [""], components: [{ type: i2.TextareaInputComponent, selector: "ipa-textarea-input", inputs: ["id", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses", "isArabicForm"] }, { type: i3.DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "searchable", "notFoundText", "classes", "containerClasses", "isArabicForm", "fromGenerateForm"] }, { type: i4.FileUploadComponent, selector: "ipa-file-upload", inputs: ["label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { type: i5.RecaptchaComponent, selector: "ipa-recaptcha", inputs: ["siteKey", "recaptchaSize", "lang", "recaptchaType", "theme", "useGlobalDomain"] }, { type: i6.TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "onlyNumber", "pattern", "classes", "containerClasses", "isArabicForm"] }], directives: [{ type: i7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i8.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i7.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i7.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i7.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i7.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i8.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: GenerateFormComponent, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", isArabicForm: "isArabicForm", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, ngImport: i0, template: "<form [formGroup]=\"generateForm\">\r\n    <ng-container *ngFor=\"let column of form.columns\">\r\n        <div [ngSwitch]=\"column.type\">\r\n            <!-- TEXTAREA -->\r\n            <div *ngSwitchCase=\"'textArea'\">\r\n                <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n                    [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-textarea-input>\r\n            </div>\r\n\r\n            <!-- DROP DOWN LIST -->\r\n            <div *ngSwitchCase=\"'select'\">\r\n                <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n                    [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n                    [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n                    *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n                        <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"checkbox\" formControlName=\"checkbox\">\r\n                        <label class=\"form-check-label\"\r\n                            [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n                            {{control.value[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\">\r\n                        <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"radio\" [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n                        <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n                            {{item[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n                <ipa-file-upload [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [acceptedFiles]=\"column.acceptedFiles!\" [multiple]=\"column.multipleFile!\"\r\n                    [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\" [autoUpload]=\"column.autoUploadFile!\"\r\n                    [apiUrl]=\"column.apiUrl?? 'apiUrl' \" [authorization]=\"column.authorization!\" ngDefaultControl\r\n                    [formControlName]=\"column.formControlName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n                </ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- recaptcha -->\r\n            <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n                <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"lang\" [theme]=\"theme\"\r\n                    [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n                    formControlName=\"{{column.formControlName}}\">\r\n                </ipa-recaptcha>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [type]=\"column.type\" [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [required]=\"column.required\" [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-text-input>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</form>", styles: [""], components: [{ type: i2.TextareaInputComponent, selector: "ipa-textarea-input", inputs: ["id", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses", "isArabicForm"] }, { type: i3.DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "firstItemLabel", "searchable", "notFoundText", "classes", "containerClasses", "isArabicForm", "fromGenerateForm"] }, { type: i4.FileUploadComponent, selector: "ipa-file-upload", inputs: ["label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { type: i5.RecaptchaComponent, selector: "ipa-recaptcha", inputs: ["siteKey", "recaptchaSize", "lang", "recaptchaType", "theme", "useGlobalDomain"] }, { type: i6.TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "onlyNumber", "pattern", "classes", "containerClasses", "isArabicForm"] }], directives: [{ type: i7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i7.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i8.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i7.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i7.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i7.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i7.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { type: i7.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i8.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: GenerateFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ipa-generate-form', template: "<form [formGroup]=\"generateForm\">\r\n    <ng-container *ngFor=\"let column of form.columns\">\r\n        <div [ngSwitch]=\"column.type\">\r\n            <!-- TEXTAREA -->\r\n            <div *ngSwitchCase=\"'textArea'\">\r\n                <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n                    [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-textarea-input>\r\n            </div>\r\n\r\n            <!-- DROP DOWN LIST -->\r\n            <div *ngSwitchCase=\"'select'\">\r\n                <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n                    [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n                    [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n                    *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n                        <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"checkbox\" formControlName=\"checkbox\">\r\n                        <label class=\"form-check-label\"\r\n                            [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n                            {{control.value[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\">\r\n                        <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"radio\" [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n                        <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n                            {{item[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n                <ipa-file-upload [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [acceptedFiles]=\"column.acceptedFiles!\" [multiple]=\"column.multipleFile!\"\r\n                    [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\" [autoUpload]=\"column.autoUploadFile!\"\r\n                    [apiUrl]=\"column.apiUrl?? 'apiUrl' \" [authorization]=\"column.authorization!\" ngDefaultControl\r\n                    [formControlName]=\"column.formControlName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n                </ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- recaptcha -->\r\n            <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n                <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"lang\" [theme]=\"theme\"\r\n                    [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n                    formControlName=\"{{column.formControlName}}\">\r\n                </ipa-recaptcha>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [type]=\"column.type\" [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [required]=\"column.required\" [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-text-input>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</form>", styles: [""] }]

package/esm2020/lib/ipa-form/dropdown-input/dropdown-input.component.mjs

@@ -26,7 +26,7 @@ export class DropdownInputComponent {
         control?.setValidators(validators);
         control?.updateValueAndValidity();
         this.formControl = control;
-        this.formControl.patchValue(null);
+        this.formControl.patchValue('');
     }
     onChange(event) { }
     onTouched() { }
@@ -46,10 +46,10 @@ export class DropdownInputComponent {
     }
 }
 DropdownInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: DropdownInputComponent, deps: [{ token: i1.IPAFormService }, { token: i2.NgControl, self: true }], target: i0.ɵɵFactoryTarget.Component });
-DropdownInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", searchable: "searchable", notFoundText: "notFoundText", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm", fromGenerateForm: "fromGenerateForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}</option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""], components: [{ type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i5.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }] });
+DropdownInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", firstItemLabel: "firstItemLabel", searchable: "searchable", notFoundText: "notFoundText", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm", fromGenerateForm: "fromGenerateForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}\r\n      </option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""], components: [{ type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: DropdownInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipa-dropdown-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}</option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""] }]
+            args: [{ selector: 'ipa-dropdown-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}\r\n      </option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""] }]
         }], ctorParameters: function () { return [{ type: i1.IPAFormService }, { type: i2.NgControl, decorators: [{
                     type: Self
                 }] }]; }, propDecorators: { input: [{
@@ -67,6 +67,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImpor
                 type: Input
             }], required: [{
                 type: Input
+            }], firstItemLabel: [{
+                type: Input
             }], searchable: [{
                 type: Input
             }], notFoundText: [{
@@ -80,4 +82,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImpor
             }], fromGenerateForm: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24taW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctaXBhLWxpYnJhcnkvc3JjL2xpYi9pcGEtZm9ybS9kcm9wZG93bi1pbnB1dC9kcm9wZG93bi1pbnB1dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1pcGEtbGlicmFyeS9zcmMvbGliL2lwYS1mb3JtL2Ryb3Bkb3duLWlucHV0L2Ryb3Bkb3duLWlucHV0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBRVQsS0FBSyxFQUVMLElBQUksRUFDSixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFdBQVcsRUFBYSxNQUFNLGdCQUFnQixDQUFDOzs7Ozs7O0FBUXhELE1BQU0sT0FBTyxzQkFBc0I7SUFpQmpDLFlBQ1UsaUJBQWlDLEVBQzFCLFVBQXFCO1FBRDVCLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBZ0I7UUFDMUIsZUFBVSxHQUFWLFVBQVUsQ0FBVztRQWhCN0IsVUFBSyxHQUFXLFlBQVksQ0FBQztRQUM3QixVQUFLLEdBQVUsRUFBRSxDQUFDO1FBR2xCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFDakIsZUFBVSxHQUFHLEtBQUssQ0FBQztRQUNuQixpQkFBWSxHQUFHLGdCQUFnQixDQUFDO1FBR2hDLGlCQUFZLEdBQUcsSUFBSSxDQUFDO1FBQ3BCLHFCQUFnQixHQUFHLEtBQUssQ0FBQztRQUNsQyxnQkFBVyxHQUFnQixJQUFJLFdBQVcsQ0FBQyxFQUFFLENBQUMsQ0FBQztRQU83QyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUM7SUFDdkMsQ0FBQztJQUVELFFBQVE7UUFDTixNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQztRQUN4QyxNQUFNLFVBQVUsR0FBRyxPQUFPLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBRWpFLE9BQU8sRUFBRSxhQUFhLENBQUMsVUFBVSxDQUFDLENBQUM7UUFDbkMsT0FBTyxFQUFFLHNCQUFzQixFQUFFLENBQUM7UUFDbEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxPQUFzQixDQUFDO1FBQzFDLElBQUksQ0FBQyxXQUFXLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ3BDLENBQUM7SUFFRCxRQUFRLENBQUMsS0FBVSxJQUFTLENBQUM7SUFFN0IsU0FBUyxLQUFVLENBQUM7SUFDcEIsVUFBVSxDQUFDLEdBQVE7UUFDakIsSUFBSSxJQUFJLENBQUMsS0FBSztZQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFHLEdBQUcsSUFBSSxFQUFFLENBQUM7SUFDL0MsQ0FBQztJQUVELGdCQUFnQixDQUFDLEVBQU87UUFDdEIsSUFBSSxDQUFDLFFBQVEsR0FBRyxFQUFFLENBQUM7SUFDckIsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELElBQUksWUFBWTtRQUNkLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGVBQWUsQ0FDcEQsSUFBSSxDQUFDLFdBQVcsRUFDaEIsRUFBRSxFQUNGLElBQUksQ0FBQyxZQUFZLENBQ2xCLENBQUM7UUFDRixPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQzs7bUhBeERVLHNCQUFzQjt1R0FBdEIsc0JBQXNCLDZkQ2hCbkMsNHNEQXVCTTsyRkRQTyxzQkFBc0I7a0JBTGxDLFNBQVM7K0JBQ0Usb0JBQW9COzswQkF1QjNCLElBQUk7NENBbEJnQyxLQUFLO3NCQUEzQyxTQUFTO3VCQUFDLFFBQVEsRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7Z0JBQzVCLEVBQUU7c0JBQVYsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csZ0JBQWdCO3NCQUF4QixLQUFLO2dCQUNHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csZ0JBQWdCO3NCQUF4QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICBDb21wb25lbnQsXHJcbiAgRWxlbWVudFJlZixcclxuICBJbnB1dCxcclxuICBPbkluaXQsXHJcbiAgU2VsZixcclxuICBWaWV3Q2hpbGQsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEZvcm1Db250cm9sLCBOZ0NvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcbmltcG9ydCB7IElQQUZvcm1TZXJ2aWNlIH0gZnJvbSAnLi4vaXBhLWZvcm0uc2VydmljZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2lwYS1kcm9wZG93bi1pbnB1dCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2Ryb3Bkb3duLWlucHV0LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9kcm9wZG93bi1pbnB1dC5jb21wb25lbnQuc2NzcyddLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgRHJvcGRvd25JbnB1dENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgQFZpZXdDaGlsZCgnc2VsZWN0JywgeyBzdGF0aWM6IHRydWUgfSkgaW5wdXQhOiBIVE1MU2VsZWN0RWxlbWVudDtcclxuICBASW5wdXQoKSBpZCE6IHN0cmluZztcclxuICBASW5wdXQoKSBsYWJlbDogc3RyaW5nID0gJ3RleHQgaW5wdXQnO1xyXG4gIEBJbnB1dCgpIGl0ZW1zOiBhbnlbXSA9IFtdO1xyXG4gIEBJbnB1dCgpIHRleHRGaWVsZCE6IHN0cmluZztcclxuICBASW5wdXQoKSB2YWx1ZUZpZWxkITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIHJlcXVpcmVkID0gZmFsc2U7XHJcbiAgQElucHV0KCkgc2VhcmNoYWJsZSA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIG5vdEZvdW5kVGV4dCA9ICfZhNinINmK2YjYrNivINio2YrYp9mG2KfYqic7XHJcbiAgQElucHV0KCkgY2xhc3NlcyE6IHN0cmluZztcclxuICBASW5wdXQoKSBjb250YWluZXJDbGFzc2VzITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGlzQXJhYmljRm9ybSA9IHRydWU7XHJcbiAgQElucHV0KCkgZnJvbUdlbmVyYXRlRm9ybSA9IGZhbHNlO1xyXG4gIGZvcm1Db250cm9sOiBGb3JtQ29udHJvbCA9IG5ldyBGb3JtQ29udHJvbCgnJyk7XHJcbiAgZXJyb3JNc2chOiBzdHJpbmcgfCBudWxsO1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIHByaXZhdGUgdmFsaWRhdGlvblNlcnZpY2U6IElQQUZvcm1TZXJ2aWNlLFxyXG4gICAgQFNlbGYoKSBwdWJsaWMgY29udHJvbERpcjogTmdDb250cm9sXHJcbiAgKSB7XHJcbiAgICB0aGlzLmNvbnRyb2xEaXIudmFsdWVBY2Nlc3NvciA9IHRoaXM7XHJcbiAgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICAgIGNvbnN0IGNvbnRyb2wgPSB0aGlzLmNvbnRyb2xEaXIuY29udHJvbDtcclxuICAgIGNvbnN0IHZhbGlkYXRvcnMgPSBjb250cm9sPy52YWxpZGF0b3IgPyBbY29udHJvbC52YWxpZGF0b3JdIDogW107XHJcblxyXG4gICAgY29udHJvbD8uc2V0VmFsaWRhdG9ycyh2YWxpZGF0b3JzKTtcclxuICAgIGNvbnRyb2w/LnVwZGF0ZVZhbHVlQW5kVmFsaWRpdHkoKTtcclxuICAgIHRoaXMuZm9ybUNvbnRyb2wgPSBjb250cm9sIGFzIEZvcm1Db250cm9sO1xyXG4gICAgdGhpcy5mb3JtQ29udHJvbC5wYXRjaFZhbHVlKG51bGwpO1xyXG4gIH1cclxuXHJcbiAgb25DaGFuZ2UoZXZlbnQ6IGFueSk6IHZvaWQge31cclxuXHJcbiAgb25Ub3VjaGVkKCk6IHZvaWQge31cclxuICB3cml0ZVZhbHVlKG9iajogYW55KTogdm9pZCB7XHJcbiAgICBpZiAodGhpcy5pbnB1dCkgdGhpcy5pbnB1dC52YWx1ZSA9IG9iaiB8fCAnJztcclxuICB9XHJcblxyXG4gIHJlZ2lzdGVyT25DaGFuZ2UoZm46IGFueSk6IHZvaWQge1xyXG4gICAgdGhpcy5vbkNoYW5nZSA9IGZuO1xyXG4gIH1cclxuXHJcbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46IGFueSk6IHZvaWQge1xyXG4gICAgdGhpcy5vblRvdWNoZWQgPSBmbjtcclxuICB9XHJcblxyXG4gIGdldCBlcnJvck1lc3NhZ2UoKTogc3RyaW5nIHwgbnVsbCB7XHJcbiAgICB0aGlzLmVycm9yTXNnID0gdGhpcy52YWxpZGF0aW9uU2VydmljZS5nZXRFcnJvck1lc3NhZ2UoXHJcbiAgICAgIHRoaXMuZm9ybUNvbnRyb2wsXHJcbiAgICAgICcnLFxyXG4gICAgICB0aGlzLmlzQXJhYmljRm9ybVxyXG4gICAgKTtcclxuICAgIHJldHVybiB0aGlzLmVycm9yTXNnO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwiZm9ybS1mbG9hdGluZyB7e2NvbnRhaW5lckNsYXNzZXN9fVwiPlxyXG4gIDwhLS0gc2VhcmNoYWJsZSBpcyBmYWxzZSAtLT5cclxuICA8bmctY29udGFpbmVyICpuZ0lmPVwiIXNlYXJjaGFibGVcIj5cclxuICAgIDxzZWxlY3QgI3NlbGVjdCBpZD1cInt7aWR9fVwiIGNsYXNzPVwiZm9ybS1zZWxlY3Qge3tjbGFzc2VzfX1cIiBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIiBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIlxyXG4gICAgICBbbmdDbGFzc109XCJ7J2lzLWludmFsaWQgaXMtaW52YWxpZDpmb2N1cyc6IChjb250cm9sRGlyLmNvbnRyb2w/LmludmFsaWQgJiYgKGNvbnRyb2xEaXIuY29udHJvbD8uZGlydHkgfHwgY29udHJvbERpci5jb250cm9sPy50b3VjaGVkKSkgJiYgZXJyb3JNc2csJ2lzLXZhbGlkIGlzLXZhbGlkOmZvY3VzJzogXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAoY29udHJvbERpci5jb250cm9sPy52YWxpZCAmJiAoY29udHJvbERpci5jb250cm9sPy5kaXJ0eSB8fCBjb250cm9sRGlyLmNvbnRyb2w/LnRvdWNoZWQpICAmJiAoZXJyb3JNc2cgfHwgY29udHJvbERpci52YWx1ZSkpfVwiPlxyXG4gICAgICA8b3B0aW9uICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zXCJcclxuICAgICAgICBbdmFsdWVdPVwidmFsdWVGaWVsZCA/IGZyb21HZW5lcmF0ZUZvcm0gPyBpdGVtW3RleHRGaWVsZF0gOiBpdGVtW3ZhbHVlRmllbGRdIDogaXRlbVwiPlxyXG4gICAgICAgIHt7dGV4dEZpZWxkID8gaXRlbVt0ZXh0RmllbGRdIDogaXRlbX19PC9vcHRpb24+XHJcbiAgICA8L3NlbGVjdD5cclxuICAgIDxsYWJlbCBmb3I9XCJ7e2lkfX1cIj57e2xhYmVsfX08L2xhYmVsPlxyXG4gIDwvbmctY29udGFpbmVyPlxyXG5cclxuICA8IS0tIHNlYXJjaGFibGUgaXMgdHJ1ZSAtLT5cclxuICA8bmctc2VsZWN0ICpuZ0lmPVwic2VhcmNoYWJsZVwiICNzZWxlY3QgZGlyPVwicnRsXCIgY2xhc3M9XCJ7e2NsYXNzZXN9fVwiIFtmb3JtQ29udHJvbF09XCJmb3JtQ29udHJvbFwiIFtpdGVtc109XCJpdGVtc1wiXHJcbiAgICBbcGxhY2Vob2xkZXJdPVwibGFiZWxcIiBbbm90Rm91bmRUZXh0XT1cIm5vdEZvdW5kVGV4dFwiIFtyZXF1aXJlZF09XCJyZXF1aXJlZFwiXHJcbiAgICBbYmluZFZhbHVlXT1cImZyb21HZW5lcmF0ZUZvcm0/IHRleHRGaWVsZCA6IHZhbHVlRmllbGRcIiBbYmluZExhYmVsXT1cInRleHRGaWVsZFwiXHJcbiAgICBbbmdDbGFzc109XCJ7J2lzLWludmFsaWQgaXMtaW52YWxpZDpmb2N1cyc6IChjb250cm9sRGlyLmNvbnRyb2w/LmludmFsaWQgJiYgKGNvbnRyb2xEaXIuY29udHJvbD8uZGlydHkgfHwgY29udHJvbERpci5jb250cm9sPy50b3VjaGVkKSkgJiYgZXJyb3JNc2csJ2lzLXZhbGlkIGlzLXZhbGlkOmZvY3VzJzogXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgKGNvbnRyb2xEaXIuY29udHJvbD8udmFsaWQgJiYgKGNvbnRyb2xEaXIuY29udHJvbD8uZGlydHkgfHwgY29udHJvbERpci5jb250cm9sPy50b3VjaGVkKSAgJiYgKGVycm9yTXNnIHx8IGNvbnRyb2xEaXIudmFsdWUpKX1cIj5cclxuICA8L25nLXNlbGVjdD5cclxuICA8ZGl2IGNsYXNzPVwiaW52YWxpZC1mZWVkYmFja1wiICpuZ0lmPVwiZXJyb3JNZXNzYWdlICE9PSBudWxsXCI+XHJcbiAgICB7e2Vycm9yTXNnfX1cclxuICA8L2Rpdj5cclxuPC9kaXY+Il19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24taW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmctaXBhLWxpYnJhcnkvc3JjL2xpYi9pcGEtZm9ybS9kcm9wZG93bi1pbnB1dC9kcm9wZG93bi1pbnB1dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1pcGEtbGlicmFyeS9zcmMvbGliL2lwYS1mb3JtL2Ryb3Bkb3duLWlucHV0L2Ryb3Bkb3duLWlucHV0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBRVQsS0FBSyxFQUVMLElBQUksRUFDSixTQUFTLEdBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFdBQVcsRUFBYSxNQUFNLGdCQUFnQixDQUFDOzs7Ozs7O0FBUXhELE1BQU0sT0FBTyxzQkFBc0I7SUFrQmpDLFlBQ1UsaUJBQWlDLEVBQzFCLFVBQXFCO1FBRDVCLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBZ0I7UUFDMUIsZUFBVSxHQUFWLFVBQVUsQ0FBVztRQWpCN0IsVUFBSyxHQUFXLFlBQVksQ0FBQztRQUM3QixVQUFLLEdBQVUsRUFBRSxDQUFDO1FBR2xCLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFakIsZUFBVSxHQUFHLEtBQUssQ0FBQztRQUNuQixpQkFBWSxHQUFHLGdCQUFnQixDQUFDO1FBR2hDLGlCQUFZLEdBQUcsSUFBSSxDQUFDO1FBQ3BCLHFCQUFnQixHQUFHLEtBQUssQ0FBQztRQUNsQyxnQkFBVyxHQUFnQixJQUFJLFdBQVcsQ0FBQyxFQUFFLENBQUMsQ0FBQztRQU83QyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUM7SUFDdkMsQ0FBQztJQUVELFFBQVE7UUFDTixNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQztRQUN4QyxNQUFNLFVBQVUsR0FBRyxPQUFPLEVBQUUsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1FBRWpFLE9BQU8sRUFBRSxhQUFhLENBQUMsVUFBVSxDQUFDLENBQUM7UUFDbkMsT0FBTyxFQUFFLHNCQUFzQixFQUFFLENBQUM7UUFDbEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxPQUFzQixDQUFDO1FBQzFDLElBQUksQ0FBQyxXQUFXLENBQUMsVUFBVSxDQUFDLEVBQUUsQ0FBQyxDQUFDO0lBQ2xDLENBQUM7SUFFRCxRQUFRLENBQUMsS0FBVSxJQUFTLENBQUM7SUFFN0IsU0FBUyxLQUFVLENBQUM7SUFDcEIsVUFBVSxDQUFDLEdBQVE7UUFDakIsSUFBSSxJQUFJLENBQUMsS0FBSztZQUFFLElBQUksQ0FBQyxLQUFLLENBQUMsS0FBSyxHQUFHLEdBQUcsSUFBSSxFQUFFLENBQUM7SUFDL0MsQ0FBQztJQUVELGdCQUFnQixDQUFDLEVBQU87UUFDdEIsSUFBSSxDQUFDLFFBQVEsR0FBRyxFQUFFLENBQUM7SUFDckIsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELElBQUksWUFBWTtRQUNkLElBQUksQ0FBQyxRQUFRLEdBQUcsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGVBQWUsQ0FDcEQsSUFBSSxDQUFDLFdBQVcsRUFDaEIsRUFBRSxFQUNGLElBQUksQ0FBQyxZQUFZLENBQ2xCLENBQUM7UUFDRixPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQzs7bUhBekRVLHNCQUFzQjt1R0FBdEIsc0JBQXNCLCtmQ2hCbkMsdXlEQXlCTTsyRkRUTyxzQkFBc0I7a0JBTGxDLFNBQVM7K0JBQ0Usb0JBQW9COzswQkF3QjNCLElBQUk7NENBbkJnQyxLQUFLO3NCQUEzQyxTQUFTO3VCQUFDLFFBQVEsRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7Z0JBQzVCLEVBQUU7c0JBQVYsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxZQUFZO3NCQUFwQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxnQkFBZ0I7c0JBQXhCLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSztnQkFDRyxnQkFBZ0I7c0JBQXhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xyXG4gIENvbXBvbmVudCxcclxuICBFbGVtZW50UmVmLFxyXG4gIElucHV0LFxyXG4gIE9uSW5pdCxcclxuICBTZWxmLFxyXG4gIFZpZXdDaGlsZCxcclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgRm9ybUNvbnRyb2wsIE5nQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgSVBBRm9ybVNlcnZpY2UgfSBmcm9tICcuLi9pcGEtZm9ybS5zZXJ2aWNlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnaXBhLWRyb3Bkb3duLWlucHV0JyxcclxuICB0ZW1wbGF0ZVVybDogJy4vZHJvcGRvd24taW5wdXQuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL2Ryb3Bkb3duLWlucHV0LmNvbXBvbmVudC5zY3NzJ10sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBEcm9wZG93bklucHV0Q29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICBAVmlld0NoaWxkKCdzZWxlY3QnLCB7IHN0YXRpYzogdHJ1ZSB9KSBpbnB1dCE6IEhUTUxTZWxlY3RFbGVtZW50O1xyXG4gIEBJbnB1dCgpIGlkITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGxhYmVsOiBzdHJpbmcgPSAndGV4dCBpbnB1dCc7XHJcbiAgQElucHV0KCkgaXRlbXM6IGFueVtdID0gW107XHJcbiAgQElucHV0KCkgdGV4dEZpZWxkITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIHZhbHVlRmllbGQhOiBzdHJpbmc7XHJcbiAgQElucHV0KCkgcmVxdWlyZWQgPSBmYWxzZTtcclxuICBASW5wdXQoKSBmaXJzdEl0ZW1MYWJlbCE6IHN0cmluZztcclxuICBASW5wdXQoKSBzZWFyY2hhYmxlID0gZmFsc2U7XHJcbiAgQElucHV0KCkgbm90Rm91bmRUZXh0ID0gJ9mE2Kcg2YrZiNis2K8g2KjZitin2YbYp9iqJztcclxuICBASW5wdXQoKSBjbGFzc2VzITogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGNvbnRhaW5lckNsYXNzZXMhOiBzdHJpbmc7XHJcbiAgQElucHV0KCkgaXNBcmFiaWNGb3JtID0gdHJ1ZTtcclxuICBASW5wdXQoKSBmcm9tR2VuZXJhdGVGb3JtID0gZmFsc2U7XHJcbiAgZm9ybUNvbnRyb2w6IEZvcm1Db250cm9sID0gbmV3IEZvcm1Db250cm9sKCcnKTtcclxuICBlcnJvck1zZyE6IHN0cmluZyB8IG51bGw7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSB2YWxpZGF0aW9uU2VydmljZTogSVBBRm9ybVNlcnZpY2UsXHJcbiAgICBAU2VsZigpIHB1YmxpYyBjb250cm9sRGlyOiBOZ0NvbnRyb2xcclxuICApIHtcclxuICAgIHRoaXMuY29udHJvbERpci52YWx1ZUFjY2Vzc29yID0gdGhpcztcclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgY29uc3QgY29udHJvbCA9IHRoaXMuY29udHJvbERpci5jb250cm9sO1xyXG4gICAgY29uc3QgdmFsaWRhdG9ycyA9IGNvbnRyb2w/LnZhbGlkYXRvciA/IFtjb250cm9sLnZhbGlkYXRvcl0gOiBbXTtcclxuXHJcbiAgICBjb250cm9sPy5zZXRWYWxpZGF0b3JzKHZhbGlkYXRvcnMpO1xyXG4gICAgY29udHJvbD8udXBkYXRlVmFsdWVBbmRWYWxpZGl0eSgpO1xyXG4gICAgdGhpcy5mb3JtQ29udHJvbCA9IGNvbnRyb2wgYXMgRm9ybUNvbnRyb2w7XHJcbiAgICB0aGlzLmZvcm1Db250cm9sLnBhdGNoVmFsdWUoJycpO1xyXG4gIH1cclxuXHJcbiAgb25DaGFuZ2UoZXZlbnQ6IGFueSk6IHZvaWQge31cclxuXHJcbiAgb25Ub3VjaGVkKCk6IHZvaWQge31cclxuICB3cml0ZVZhbHVlKG9iajogYW55KTogdm9pZCB7XHJcbiAgICBpZiAodGhpcy5pbnB1dCkgdGhpcy5pbnB1dC52YWx1ZSA9IG9iaiB8fCAnJztcclxuICB9XHJcblxyXG4gIHJlZ2lzdGVyT25DaGFuZ2UoZm46IGFueSk6IHZvaWQge1xyXG4gICAgdGhpcy5vbkNoYW5nZSA9IGZuO1xyXG4gIH1cclxuXHJcbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46IGFueSk6IHZvaWQge1xyXG4gICAgdGhpcy5vblRvdWNoZWQgPSBmbjtcclxuICB9XHJcblxyXG4gIGdldCBlcnJvck1lc3NhZ2UoKTogc3RyaW5nIHwgbnVsbCB7XHJcbiAgICB0aGlzLmVycm9yTXNnID0gdGhpcy52YWxpZGF0aW9uU2VydmljZS5nZXRFcnJvck1lc3NhZ2UoXHJcbiAgICAgIHRoaXMuZm9ybUNvbnRyb2wsXHJcbiAgICAgICcnLFxyXG4gICAgICB0aGlzLmlzQXJhYmljRm9ybVxyXG4gICAgKTtcclxuICAgIHJldHVybiB0aGlzLmVycm9yTXNnO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwiZm9ybS1mbG9hdGluZyB7e2NvbnRhaW5lckNsYXNzZXN9fVwiPlxyXG4gIDwhLS0gc2VhcmNoYWJsZSBpcyBmYWxzZSAtLT5cclxuICA8bmctY29udGFpbmVyICpuZ0lmPVwiIXNlYXJjaGFibGVcIj5cclxuICAgIDxzZWxlY3QgI3NlbGVjdCBpZD1cInt7aWR9fVwiIGNsYXNzPVwiZm9ybS1zZWxlY3Qge3tjbGFzc2VzfX1cIiBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIiBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIlxyXG4gICAgICBbbmdDbGFzc109XCJ7J2lzLWludmFsaWQgaXMtaW52YWxpZDpmb2N1cyc6IChjb250cm9sRGlyLmNvbnRyb2w/LmludmFsaWQgJiYgKGNvbnRyb2xEaXIuY29udHJvbD8uZGlydHkgfHwgY29udHJvbERpci5jb250cm9sPy50b3VjaGVkKSkgJiYgZXJyb3JNc2csJ2lzLXZhbGlkIGlzLXZhbGlkOmZvY3VzJzogXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAoY29udHJvbERpci5jb250cm9sPy52YWxpZCAmJiAoY29udHJvbERpci5jb250cm9sPy5kaXJ0eSB8fCBjb250cm9sRGlyLmNvbnRyb2w/LnRvdWNoZWQpICAmJiAoZXJyb3JNc2cgfHwgY29udHJvbERpci52YWx1ZSkpfVwiPlxyXG4gICAgICA8b3B0aW9uICpuZ0lmPVwiZmlyc3RJdGVtTGFiZWxcIiB2YWx1ZT1cIlwiPnt7Zmlyc3RJdGVtTGFiZWx9fTwvb3B0aW9uPlxyXG4gICAgICA8b3B0aW9uICpuZ0Zvcj1cImxldCBpdGVtIG9mIGl0ZW1zXCJcclxuICAgICAgICBbdmFsdWVdPVwidmFsdWVGaWVsZCA/IGZyb21HZW5lcmF0ZUZvcm0gPyBpdGVtW3RleHRGaWVsZF0gOiBpdGVtW3ZhbHVlRmllbGRdIDogaXRlbVwiPlxyXG4gICAgICAgIHt7dGV4dEZpZWxkID8gaXRlbVt0ZXh0RmllbGRdIDogaXRlbX19XHJcbiAgICAgIDwvb3B0aW9uPlxyXG4gICAgPC9zZWxlY3Q+XHJcbiAgICA8bGFiZWwgZm9yPVwie3tpZH19XCI+e3tsYWJlbH19PC9sYWJlbD5cclxuICA8L25nLWNvbnRhaW5lcj5cclxuXHJcbiAgPCEtLSBzZWFyY2hhYmxlIGlzIHRydWUgLS0+XHJcbiAgPG5nLXNlbGVjdCAqbmdJZj1cInNlYXJjaGFibGVcIiAjc2VsZWN0IGRpcj1cInJ0bFwiIGNsYXNzPVwie3tjbGFzc2VzfX1cIiBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIiBbaXRlbXNdPVwiaXRlbXNcIlxyXG4gICAgW3BsYWNlaG9sZGVyXT1cImxhYmVsXCIgW25vdEZvdW5kVGV4dF09XCJub3RGb3VuZFRleHRcIiBbcmVxdWlyZWRdPVwicmVxdWlyZWRcIlxyXG4gICAgW2JpbmRWYWx1ZV09XCJmcm9tR2VuZXJhdGVGb3JtPyB0ZXh0RmllbGQgOiB2YWx1ZUZpZWxkXCIgW2JpbmRMYWJlbF09XCJ0ZXh0RmllbGRcIlxyXG4gICAgW25nQ2xhc3NdPVwieydpcy1pbnZhbGlkIGlzLWludmFsaWQ6Zm9jdXMnOiAoY29udHJvbERpci5jb250cm9sPy5pbnZhbGlkICYmIChjb250cm9sRGlyLmNvbnRyb2w/LmRpcnR5IHx8IGNvbnRyb2xEaXIuY29udHJvbD8udG91Y2hlZCkpICYmIGVycm9yTXNnLCdpcy12YWxpZCBpcy12YWxpZDpmb2N1cyc6IFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIChjb250cm9sRGlyLmNvbnRyb2w/LnZhbGlkICYmIChjb250cm9sRGlyLmNvbnRyb2w/LmRpcnR5IHx8IGNvbnRyb2xEaXIuY29udHJvbD8udG91Y2hlZCkgICYmIChlcnJvck1zZyB8fCBjb250cm9sRGlyLnZhbHVlKSl9XCI+XHJcbiAgPC9uZy1zZWxlY3Q+XHJcbiAgPGRpdiBjbGFzcz1cImludmFsaWQtZmVlZGJhY2tcIiAqbmdJZj1cImVycm9yTWVzc2FnZSAhPT0gbnVsbFwiPlxyXG4gICAge3tlcnJvck1zZ319XHJcbiAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==

package/esm2020/lib/ipa-form/textarea-input/textarea-input.component.mjs

@@ -45,10 +45,10 @@ export class TextareaInputComponent {
     }
 }
 TextareaInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TextareaInputComponent, deps: [{ token: i1.IPAFormService }, { token: i2.NgControl, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TextareaInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}\n"], directives: [{ type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TextareaInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"], directives: [{ type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TextareaInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipa-textarea-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}\n"] }]
+            args: [{ selector: 'ipa-textarea-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.IPAFormService }, { type: i2.NgControl, decorators: [{
                     type: Self
                 }] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { input: [{

package/fesm2015/ng-ipa-library.mjs

@@ -435,10 +435,10 @@ class TextareaInputComponent {
     }
 }
 TextareaInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TextareaInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TextareaInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}\n"], directives: [{ type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TextareaInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"], directives: [{ type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: TextareaInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipa-textarea-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}\n"] }]
+            args: [{ selector: 'ipa-textarea-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n        [ngClass]=\"{\r\n        'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n        'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n    </textarea>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"] }]
         }], ctorParameters: function () {
         return [{ type: IPAFormService }, { type: i2$1.NgControl, decorators: [{
                         type: Self
@@ -486,7 +486,7 @@ class DropdownInputComponent {
         control === null || control === void 0 ? void 0 : control.setValidators(validators);
         control === null || control === void 0 ? void 0 : control.updateValueAndValidity();
         this.formControl = control;
-        this.formControl.patchValue(null);
+        this.formControl.patchValue('');
     }
     onChange(event) { }
     onTouched() { }
@@ -506,10 +506,10 @@ class DropdownInputComponent {
     }
 }
 DropdownInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: DropdownInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }], target: i0.ɵɵFactoryTarget.Component });
-DropdownInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", searchable: "searchable", notFoundText: "notFoundText", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm", fromGenerateForm: "fromGenerateForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}</option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""], components: [{ type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i5.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }] });
+DropdownInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", firstItemLabel: "firstItemLabel", searchable: "searchable", notFoundText: "notFoundText", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm", fromGenerateForm: "fromGenerateForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}\r\n      </option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""], components: [{ type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: DropdownInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ipa-dropdown-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}</option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""] }]
+            args: [{ selector: 'ipa-dropdown-input', template: "<div class=\"form-floating {{containerClasses}}\">\r\n  <!-- searchable is false -->\r\n  <ng-container *ngIf=\"!searchable\">\r\n    <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n      [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                                 (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n      <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n      <option *ngFor=\"let item of items\"\r\n        [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n        {{textField ? item[textField] : item}}\r\n      </option>\r\n    </select>\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n  </ng-container>\r\n\r\n  <!-- searchable is true -->\r\n  <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n    [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n    [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n    [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n                                               (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\r\n  </ng-select>\r\n  <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n    {{errorMsg}}\r\n  </div>\r\n</div>", styles: [""] }]
         }], ctorParameters: function () {
         return [{ type: IPAFormService }, { type: i2$1.NgControl, decorators: [{
                         type: Self
@@ -529,6 +529,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImpor
                 type: Input
             }], required: [{
                 type: Input
+            }], firstItemLabel: [{
+                type: Input
             }], searchable: [{
                 type: Input
             }], notFoundText: [{
@@ -848,7 +850,7 @@ class GenerateFormComponent {
     }
 }
 GenerateFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: GenerateFormComponent, deps: [{ token: IPAFormService }], target: i0.ɵɵFactoryTarget.Component });
-GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: GenerateFormComponent, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", isArabicForm: "isArabicForm", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, ngImport: i0, template: "<form [formGroup]=\"generateForm\">\r\n    <ng-container *ngFor=\"let column of form.columns\">\r\n        <div [ngSwitch]=\"column.type\">\r\n            <!-- TEXTAREA -->\r\n            <div *ngSwitchCase=\"'textArea'\">\r\n                <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n                    [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-textarea-input>\r\n            </div>\r\n\r\n            <!-- DROP DOWN LIST -->\r\n            <div *ngSwitchCase=\"'select'\">\r\n                <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n                    [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n                    [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n                    *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n                        <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"checkbox\" formControlName=\"checkbox\">\r\n                        <label class=\"form-check-label\"\r\n                            [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n                            {{control.value[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\">\r\n                        <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"radio\" [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n                        <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n                            {{item[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n                <ipa-file-upload [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [acceptedFiles]=\"column.acceptedFiles!\" [multiple]=\"column.multipleFile!\"\r\n                    [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\" [autoUpload]=\"column.autoUploadFile!\"\r\n                    [apiUrl]=\"column.apiUrl?? 'apiUrl' \" [authorization]=\"column.authorization!\" ngDefaultControl\r\n                    [formControlName]=\"column.formControlName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n                </ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- recaptcha -->\r\n            <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n                <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"lang\" [theme]=\"theme\"\r\n                    [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n                    formControlName=\"{{column.formControlName}}\">\r\n                </ipa-recaptcha>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [type]=\"column.type\" [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [required]=\"column.required\" [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-text-input>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</form>", styles: [""], components: [{ type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: ["id", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses", "isArabicForm"] }, { type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "searchable", "notFoundText", "classes", "containerClasses", "isArabicForm", "fromGenerateForm"] }, { type: FileUploadComponent, selector: "ipa-file-upload", inputs: ["label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { type: RecaptchaComponent, selector: "ipa-recaptcha", inputs: ["siteKey", "recaptchaSize", "lang", "recaptchaType", "theme", "useGlobalDomain"] }, { type: TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "onlyNumber", "pattern", "classes", "containerClasses", "isArabicForm"] }], directives: [{ type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i2$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i2$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: GenerateFormComponent, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", isArabicForm: "isArabicForm", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, ngImport: i0, template: "<form [formGroup]=\"generateForm\">\r\n    <ng-container *ngFor=\"let column of form.columns\">\r\n        <div [ngSwitch]=\"column.type\">\r\n            <!-- TEXTAREA -->\r\n            <div *ngSwitchCase=\"'textArea'\">\r\n                <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n                    [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-textarea-input>\r\n            </div>\r\n\r\n            <!-- DROP DOWN LIST -->\r\n            <div *ngSwitchCase=\"'select'\">\r\n                <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n                    [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n                    [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n                    *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n                        <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"checkbox\" formControlName=\"checkbox\">\r\n                        <label class=\"form-check-label\"\r\n                            [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n                            {{control.value[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\">\r\n                        <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"radio\" [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n                        <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n                            {{item[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n                <ipa-file-upload [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [acceptedFiles]=\"column.acceptedFiles!\" [multiple]=\"column.multipleFile!\"\r\n                    [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\" [autoUpload]=\"column.autoUploadFile!\"\r\n                    [apiUrl]=\"column.apiUrl?? 'apiUrl' \" [authorization]=\"column.authorization!\" ngDefaultControl\r\n                    [formControlName]=\"column.formControlName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n                </ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- recaptcha -->\r\n            <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n                <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"lang\" [theme]=\"theme\"\r\n                    [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n                    formControlName=\"{{column.formControlName}}\">\r\n                </ipa-recaptcha>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [type]=\"column.type\" [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [required]=\"column.required\" [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-text-input>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</form>", styles: [""], components: [{ type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: ["id", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses", "isArabicForm"] }, { type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "firstItemLabel", "searchable", "notFoundText", "classes", "containerClasses", "isArabicForm", "fromGenerateForm"] }, { type: FileUploadComponent, selector: "ipa-file-upload", inputs: ["label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { type: RecaptchaComponent, selector: "ipa-recaptcha", inputs: ["siteKey", "recaptchaSize", "lang", "recaptchaType", "theme", "useGlobalDomain"] }, { type: TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "onlyNumber", "pattern", "classes", "containerClasses", "isArabicForm"] }], directives: [{ type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { type: i2$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i2$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: GenerateFormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ipa-generate-form', template: "<form [formGroup]=\"generateForm\">\r\n    <ng-container *ngFor=\"let column of form.columns\">\r\n        <div [ngSwitch]=\"column.type\">\r\n            <!-- TEXTAREA -->\r\n            <div *ngSwitchCase=\"'textArea'\">\r\n                <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n                    [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-textarea-input>\r\n            </div>\r\n\r\n            <!-- DROP DOWN LIST -->\r\n            <div *ngSwitchCase=\"'select'\">\r\n                <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n                    [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n                    [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n                    *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n                        <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"checkbox\" formControlName=\"checkbox\">\r\n                        <label class=\"form-check-label\"\r\n                            [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n                            {{control.value[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n                <label>{{isArabicForm? column.arabicLabel : column.englishLabel}}</label>\r\n                <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n                    <div class=\"form-check {{column.inputClasses}}\">\r\n                        <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\"\r\n                            type=\"radio\" [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n                        <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n                            {{item[column.textField!]}}\r\n                        </label>\r\n                    </div>\r\n                </ng-container>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n                <ipa-file-upload [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [acceptedFiles]=\"column.acceptedFiles!\" [multiple]=\"column.multipleFile!\"\r\n                    [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\" [autoUpload]=\"column.autoUploadFile!\"\r\n                    [apiUrl]=\"column.apiUrl?? 'apiUrl' \" [authorization]=\"column.authorization!\" ngDefaultControl\r\n                    [formControlName]=\"column.formControlName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n                </ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- recaptcha -->\r\n            <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n                <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"lang\" [theme]=\"theme\"\r\n                    [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n                    formControlName=\"{{column.formControlName}}\">\r\n                </ipa-recaptcha>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n                    [type]=\"column.type\" [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\"\r\n                    [required]=\"column.required\" [pattern]=\"column.validationPattern!\"\r\n                    [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n                    [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\"\r\n                    [isArabicForm]=\"isArabicForm\">\r\n                </ipa-text-input>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</form>", styles: [""] }]