ng-ipa-library 0.5.4 → 0.5.5

package/fesm2015/ng-ipa-library.js

@@ -58,17 +58,48 @@ class IPAFormService {
     constructor(parserFormatter) {
         this.parserFormatter = parserFormatter;
     }
+    /**
+     * check link is valid.
+     */
     static linkValidation(control) {
         const isValidLink = /^((https?:\/\/)[\w-]+(\.[a-z-]+)+\.?(:\d+)?(\/\S*)?)$/.test(control.value);
-        return isValidLink || !control.value
-            ? { pattern: { required: false } }
-            : { pattern: { required: true } };
+        return isValidLink || !control.value ? null : { link: true };
     }
+    /**
+     * check mp4 link is valid.
+     */
     static mp4LinkValidation(control) {
         const isValidLink = /^((https?:\/\/)[\w-]+(\.[a-z-]+)+\.?(:\d+)?(\/\S*)?(\/[\w\u0600-\u06FF]+\.mp4))$/.test(control.value);
-        return isValidLink || !control.value
-            ? { pattern: { required: false } }
-            : { pattern: { required: true } };
+        return isValidLink || !control.value ? null : { linkMP4: true };
+    }
+    /**
+     * check mobile number is valid.
+     */
+    static mobileNo(control) {
+        const isValidLink = /^05\d{8}$/.test(control.value);
+        return isValidLink || !control.value ? null : { mobileNo: true };
+    }
+    /**
+     * check email is valid.
+     */
+    static email(control) {
+        const isValidLink = /^(([^<>()[\]\.,;:\s@\"]+(\.[^<>()[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/.test(control.value);
+        return isValidLink || !control.value ? null : { Email: true };
+    }
+    /**
+     * check national ID or iqama ID is valid.
+     */
+    static checkID(control) {
+        let isValid = false;
+        const value = control.value;
+        if (IPAFormService.nationalIdValidate(value) ||
+            IPAFormService.iqamaIdValidate(value)) {
+            isValid = true;
+        }
+        else {
+            isValid = false;
+        }
+        return isValid || !value ? null : { checkId: true };
     }
     getErrorMessage(control, patternErrorMsg = '') {
         for (const propertyName in control === null || control === void 0 ? void 0 : control.errors) {
@@ -79,6 +110,28 @@ class IPAFormService {
         }
         return null;
     }
+    /**
+     * convert gregorian date to hijri date (Based on Umm al-Qura calculations).
+     * @param date: gregorian date
+     * @param format: iDD => day: ١٥, iMM => month: ٠٤, iMMM => month: ربيع ٢,
+     *               iMMMM => ربيع الثاني,  iYY => year: ٤٢, iYYYY => year: ١٤٤٢,
+     *               dd => ن, ddd => إثنين, dddd => الإثنين
+     * @example 'iYYYY/iM/iDهـ الموافق YYYY/M/Dم'
+     *           '١٤٤٢/٠٤/١٥هـ الموافق ٢٠٢٠/١١/٣٠'
+     */
+    convertToHijriDate(date, format = 'iYYYY-iMM-iDD', lang = 'ar-SA') {
+        momentHijri.locale(lang);
+        return momentHijri(date).format(format);
+    }
+    convertToGregorianDate(date, format = 'YYYY-MM-DD', lang = 'en') {
+        momentHijri.locale(lang);
+        const m = momentHijri.iConvert.toGregorian(date.year(), date.month(), date.date());
+        return momentHijri(new Date(m.gy, m.gm, m.gd)).format(format);
+    }
+    getCurrentHijriDate() {
+        momentHijri.locale('en');
+        return momentHijri().format('iYYYY/iMM/iDD');
+    }
     getValidatorErrorMessage(validatorName, validatorValue, patternErrorMsg) {
         if (validatorName === 'pattern') {
             validatorValue = this.addPatternMsg(validatorValue, patternErrorMsg);
@@ -86,12 +139,16 @@ class IPAFormService {
         const config = {
             required: 'هذا الحقل مطلوب',
             pattern: `${validatorValue.message}`,
-            email: 'خطأ في البريد الالكتروني مثال (example@ipa.edu.sa)',
+            Email: 'خطأ في البريد الالكتروني (example@ipa.edu.sa)',
             maxlength: `تجاوز عدد الحقل المسموح بها (${validatorValue.requiredLength}) حرف`,
             minlength: `على الأقل عدد ${validatorValue.requiredLength} حرف.`,
             min: `رقم اكبر من أو يساوي ${validatorValue.min}`,
             max: `رقم اصغر من أو يساوي ${validatorValue.max}`,
             ngbDate: this.getNgbDatepickerErrorMsg(validatorValue),
+            checkId: 'رقم الهوية أو الاقامة غير صحيح',
+            link: 'الرابط غير صحيح (http://google.com)',
+            linkMP4: 'الرابط غير صحيح (http://example.com/a.mp4)',
+            mobileNo: 'خطأ في رقم الجوال (05xxxxxxxx)',
         };
         return config[validatorName];
     }
@@ -112,27 +169,127 @@ class IPAFormService {
         }
         return msg;
     }
-    /**
-     * convert gregorian date to hijri date (Based on Umm al-Qura calculations).
-     * @param date: gregorian date
-     * @param format: iDD => day: ١٥, iMM => month: ٠٤, iMMM => month: ربيع ٢,
-     *               iMMMM => ربيع الثاني,  iYY => year: ٤٢, iYYYY => year: ١٤٤٢,
-     *               dd => ن, ddd => إثنين, dddd => الإثنين
-     * @example 'iYYYY/iM/iDهـ الموافق YYYY/M/Dم'
-     *           '١٤٤٢/٠٤/١٥هـ الموافق ٢٠٢٠/١١/٣٠'
-     */
-    convertToHijriDate(date, format = 'iYYYY-iMM-iDD', lang = 'ar-SA') {
-        momentHijri.locale(lang);
-        return momentHijri(date).format(format);
-    }
-    convertToGregorianDate(date, format = 'YYYY-MM-DD', lang = 'en') {
-        momentHijri.locale(lang);
-        const m = momentHijri.iConvert.toGregorian(date.year(), date.month(), date.date());
-        return momentHijri(new Date(m.gy, m.gm, m.gd)).format(format);
+    static convertToEn(value) {
+        let newValue = '';
+        for (let i = 0; i < value.length; i++) {
+            let ch = value.charCodeAt(i);
+            if (ch >= 1584 && ch <= 1650) {
+                let newChar = ch - 1584;
+                newValue = newValue + String.fromCharCode(newChar);
+            }
+            else {
+                newValue = newValue + String.fromCharCode(ch);
+            }
+        }
+        return newValue;
+    }
+    static nationalIdValidate(civilId) {
+        if (civilId) {
+            let strID = this.convertToEn(civilId);
+            let digits = '';
+            let counter = 0;
+            while (counter < 9) {
+                if ((counter + 1) % 2 == 0) {
+                    digits = digits + strID.substring(counter, counter + 1);
+                }
+                else {
+                    digits =
+                        digits + (+strID.substring(counter, counter + 1) * 2).toString();
+                }
+                counter++;
+            }
+            let intSum = 0;
+            let intSumTemp = 0;
+            let strSum;
+            let intOddSumDigit;
+            let CheckDigit;
+            counter = 0;
+            while (counter < digits.length) {
+                intSumTemp = +digits.charAt(counter) * 1;
+                intSum += intSumTemp;
+                counter++;
+            }
+            strSum = intSum.toString();
+            if (strSum.length == 1) {
+                intOddSumDigit = intSum;
+            }
+            else {
+                intOddSumDigit = strSum.substring(strSum.length, strSum.length - 1);
+            }
+            if (intOddSumDigit == 0) {
+                CheckDigit = 0;
+            }
+            else {
+                CheckDigit = (10 - +intOddSumDigit).toString();
+            }
+            let PublicID = this.convertToEn(civilId);
+            if (CheckDigit ==
+                PublicID.substring(PublicID.length - 1, PublicID.length) &&
+                strID.length == 10 &&
+                strID.substring(0, 1) == '1') {
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        else {
+            return false;
+        }
     }
-    getCurrentHijriDate() {
-        momentHijri.locale('en');
-        return momentHijri().format('iYYYY/iMM/iDD');
+    static iqamaIdValidate(civilId) {
+        if (civilId) {
+            let strID = this.convertToEn(civilId);
+            let digits = '';
+            let counter = 0;
+            while (counter < 9) {
+                if ((counter + 1) % 2 == 0) {
+                    digits = digits + strID.substring(counter, counter + 1);
+                }
+                else {
+                    digits =
+                        digits + (+strID.substring(counter, counter + 1) * 2).toString();
+                }
+                counter++;
+            }
+            let intSum = 0;
+            let intSumTemp = 0;
+            let strSum;
+            let intOddSumDigit;
+            let CheckDigit;
+            counter = 0;
+            while (counter < digits.length) {
+                intSumTemp = +digits.charAt(counter) * 1;
+                intSum += intSumTemp;
+                counter++;
+            }
+            strSum = intSum.toString();
+            if (strSum.length == 1) {
+                intOddSumDigit = intSum;
+            }
+            else {
+                intOddSumDigit = strSum.substring(strSum.length, strSum.length - 1);
+            }
+            if (intOddSumDigit == 0) {
+                CheckDigit = 0;
+            }
+            else {
+                CheckDigit = (10 - +intOddSumDigit).toString();
+            }
+            let PublicID = this.convertToEn(civilId);
+            if (CheckDigit ==
+                PublicID.substring(PublicID.length - 1, PublicID.length) &&
+                strID.length == 10 &&
+                strID.substring(0, 1) == '2') {
+                return true;
+            }
+            else {
+                return false;
+            }
+        }
+        else {
+            return false;
+        }
     }
 }
 IPAFormService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IPAFormService, deps: [{ token: i2.NgbDateParserFormatter }], target: i0.ɵɵFactoryTarget.Injectable });
@@ -151,7 +308,7 @@ class TextInputComponent {
         this.type = 'text';
         this.placeholder = 'please enter text';
         this.label = 'text input';
-        this.required = true;
+        this.required = false;
         this.patternErrorMsg = 'invalid pattern';
         this.pattern = '';
         this.formControl = new FormControl('');
@@ -181,7 +338,7 @@ class TextInputComponent {
     }
 }
 TextInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: TextInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }], target: i0.ɵɵFactoryTarget.Component });
-TextInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: TextInputComponent, selector: "ipa-text-input", inputs: { id: "id", type: "type", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\"\r\n    [ngClass]=\"{'was-validated': (controlDir.control?.dirty || controlDir.control?.touched) && required}\">\r\n    <input #input id=\"{{id}}\" class=\"form-control {{classes}}\" [type]=\"type\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\">\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: [""], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TextInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: TextInputComponent, selector: "ipa-text-input", inputs: { id: "id", type: "type", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input #input id=\"{{id}}\" class=\"form-control {{classes}}\" [type]=\"type\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n        placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n        (blur)=\"onTouched()\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && (errorMsg || controlDir.value))}\">\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: [""], 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: ["disabled", "formControl", "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: "12.2.9", ngImport: i0, type: TextInputComponent, decorators: [{
             type: Component,
             args: [{
@@ -221,7 +378,7 @@ class TextareaInputComponent {
         this.input = new ElementRef(null);
         this.placeholder = 'please enter text';
         this.label = 'textarea input';
-        this.required = true;
+        this.required = false;
         this.patternErrorMsg = 'invalid pattern';
         this.formControl = new FormControl('');
         this.controlDir.valueAccessor = this;
@@ -250,7 +407,7 @@ class TextareaInputComponent {
     }
 }
 TextareaInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: TextareaInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }], target: i0.ɵɵFactoryTarget.Component });
-TextareaInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\"\r\n    [ngClass]=\"{'was-validated': (controlDir.control?.dirty || controlDir.control?.touched) && required}\">\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()\">\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: [""], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TextareaInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses" }, 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()\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'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: [""], 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: ["disabled", "formControl", "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: "12.2.9", ngImport: i0, type: TextareaInputComponent, decorators: [{
             type: Component,
             args: [{
@@ -558,8 +715,12 @@ class GenerateFormComponent {
         this.generateForm.controls[formControlName].patchValue(null);
         this.fileDeleted.emit(event);
     }
-    handleReset() { }
-    handleExpire() { }
+    handleReset(formControlName) {
+        this.generateForm.controls[formControlName].patchValue(null);
+    }
+    handleExpire(formControlName) {
+        this.generateForm.controls[formControlName].patchValue(null);
+    }
     handleLoad() { }
     handleSuccess(event, formControlName) {
         this.generateForm.controls[formControlName].patchValue(event);
@@ -632,7 +793,7 @@ class GenerateFormComponent {
     }
 }
 GenerateFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: GenerateFormComponent, deps: [{ token: IPAFormService }], target: i0.ɵɵFactoryTarget.Component });
-GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: GenerateFormComponent, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain", authorization: "authorization" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted", recaptchaOutput: "recaptchaOutput" }, 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.englishName\" [id]=\"column.englishName\"\r\n                    [label]=\"column.arabicLabel\" [required]=\"column.required\" [pattern]=\"column.pattern\"\r\n                    [patternErrorMsg]=\"column.patternErrorMsg\" [classes]=\"column.classes\"\r\n                    [containerClasses]=\"column.containerClasses\"></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.englishName\" [id]=\"column.englishName\"\r\n                    [label]=\"column.arabicLabel\" [items]=\"column.data\" [valueField]=\"column.valueField\"\r\n                    [textField]=\"column.textField\" [required]=\"column.required\" [pattern]=\"column.pattern\"\r\n                    [patternErrorMsg]=\"column.patternErrorMsg\" [classes]=\"column.classes\"\r\n                    [containerClasses]=\"column.containerClasses\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\">\r\n                <label [for]=\"column.englishName\">{{column.arabicLabel}}</label>\r\n                <div [formArrayName]=\"'items'\" *ngFor=\"let control of formControls.controls; let i = index\">\r\n                    <div [formGroupName]=\"i\" [id]=\"column.englishName\">\r\n                        <div class=\"form-check\">\r\n                            <input [id]=\"column.englishName+control.value.id\" class=\"form-check-input\" type=\"checkbox\"\r\n                                formControlName=\"checkbox\">\r\n                            <label class=\"form-check-label\" [for]=\"column.englishName+control.value.id\">\r\n                                {{control.value.description}}\r\n                            </label>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.englishName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\">\r\n                <label [for]=\"column.englishName\">{{column.arabicLabel}}</label>\r\n                <div *ngFor=\"let item of column.data; let i = index\" [id]=\"column.englishName\">\r\n                    <div class=\"form-check\">\r\n                        <input [id]=\"column.englishName+item.id\" class=\"form-check-input\" type=\"radio\"\r\n                            [formControlName]=\"column.englishName\" [value]=\"item.id\">\r\n                        <label class=\"form-check-label\" [for]=\"column.englishName+item.id\">\r\n                            {{item.description}}\r\n                        </label>\r\n                    </div>\r\n                </div>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.englishName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\">\r\n                <ipa-file-upload [label]=\"column.arabicLabel\" [acceptedFiles]=\"column.acceptedFiles\"\r\n                    [multiple]=\"column.multipleFile\" [maxFileSize]=\"column.size\" [method]=\"column.apiURlMethod\"\r\n                    [autoUpload]=\"column.autoUploadFile\" [apiUrl]=\"column.apiUrl\" [authorization]=\"authorization\"\r\n                    ngDefaultControl [formControlName]=\"column.englishName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.englishName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.englishName)\"></ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'recaptcha'\">\r\n                <ngx-recaptcha2 [siteKey]=\"siteKey\" [size]=\"recaptchaSize\" [hl]=\"lang\" [theme]=\"theme\"\r\n                    [type]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\" (reset)=\"handleReset()\"\r\n                    (expire)=\"handleExpire()\" (load)=\"handleLoad()\"\r\n                    (success)=\"handleSuccess($event, column.englishName)\" formControlName=\"{{column.englishName}}\">\r\n                </ngx-recaptcha2>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.englishName\" [id]=\"column.englishName\" [type]=\"column.type\"\r\n                    [label]=\"column.arabicLabel\" [required]=\"column.required\" [pattern]=\"column.pattern\"\r\n                    [patternErrorMsg]=\"column.patternErrorMsg\" [classes]=\"column.classes\"\r\n                    [containerClasses]=\"column.containerClasses\"></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"] }, { type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "disabled", "patternErrorMsg", "pattern", "classes", "containerClasses"] }, { type: FileUploadComponent, selector: "ipa-file-upload", inputs: ["label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { type: i5.ReCaptcha2Component, selector: "ngx-recaptcha2", inputs: ["theme", "size", "hl"] }, { type: TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses"] }], 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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "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.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.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
+GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: GenerateFormComponent, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain", authorization: "authorization" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted", recaptchaOutput: "recaptchaOutput" }, 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.englishName\" [id]=\"column.englishName\"\r\n                    [label]=\"column.arabicLabel\" [required]=\"column.required\" [pattern]=\"column.pattern\"\r\n                    [patternErrorMsg]=\"column.patternErrorMsg\" [classes]=\"column.classes\"\r\n                    [containerClasses]=\"column.containerClasses\"></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.englishName\" [id]=\"column.englishName\"\r\n                    [label]=\"column.arabicLabel\" [items]=\"column.data\" [valueField]=\"column.valueField\"\r\n                    [textField]=\"column.textField\" [required]=\"column.required\" [pattern]=\"column.pattern\"\r\n                    [patternErrorMsg]=\"column.patternErrorMsg\" [classes]=\"column.classes\"\r\n                    [containerClasses]=\"column.containerClasses\">\r\n                </ipa-dropdown-input>\r\n            </div>\r\n\r\n            <!-- CHECKBOX -->\r\n            <div *ngSwitchCase=\"'checkbox'\">\r\n                <label [for]=\"column.englishName\">{{column.arabicLabel}}</label>\r\n                <div [formArrayName]=\"'items'\" *ngFor=\"let control of formControls.controls; let i = index\">\r\n                    <div [formGroupName]=\"i\" [id]=\"column.englishName\">\r\n                        <div class=\"form-check\">\r\n                            <input [id]=\"column.englishName+control.value.id\" class=\"form-check-input\" type=\"checkbox\"\r\n                                formControlName=\"checkbox\">\r\n                            <label class=\"form-check-label\" [for]=\"column.englishName+control.value.id\">\r\n                                {{control.value.description}}\r\n                            </label>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.englishName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- RADIO -->\r\n            <div *ngSwitchCase=\"'radio'\">\r\n                <label [for]=\"column.englishName\">{{column.arabicLabel}}</label>\r\n                <div *ngFor=\"let item of column.data; let i = index\" [id]=\"column.englishName\">\r\n                    <div class=\"form-check\">\r\n                        <input [id]=\"column.englishName+item.id\" class=\"form-check-input\" type=\"radio\"\r\n                            [formControlName]=\"column.englishName\" [value]=\"item.id\">\r\n                        <label class=\"form-check-label\" [for]=\"column.englishName+item.id\">\r\n                            {{item.description}}\r\n                        </label>\r\n                    </div>\r\n                </div>\r\n                <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n                    *ngIf=\"getErrorMessage(column.englishName) !== null\">\r\n                    {{errorMsg}}\r\n                </div>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'file'\">\r\n                <ipa-file-upload [label]=\"column.arabicLabel\" [acceptedFiles]=\"column.acceptedFiles\"\r\n                    [multiple]=\"column.multipleFile\" [maxFileSize]=\"column.size\" [method]=\"column.apiURlMethod\"\r\n                    [autoUpload]=\"column.autoUploadFile\" [apiUrl]=\"column.apiUrl\" [authorization]=\"authorization\"\r\n                    ngDefaultControl [formControlName]=\"column.englishName\" (successUpload)=\"SuccessUpload($event)\"\r\n                    (fileAdded)=\"FileAdded($event, column.englishName)\"\r\n                    (fileDeleted)=\"FileDeleted($event, column.englishName)\"></ipa-file-upload>\r\n            </div>\r\n\r\n            <!-- FILE UPLOAD -->\r\n            <div *ngSwitchCase=\"'recaptcha'\">\r\n                <ngx-recaptcha2 [siteKey]=\"siteKey\" [size]=\"recaptchaSize\" [hl]=\"lang\" [theme]=\"theme\"\r\n                    [type]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\" (reset)=\"handleReset(column.englishName)\"\r\n                    (expire)=\"handleExpire(column.englishName)\" (load)=\"handleLoad()\"\r\n                    (success)=\"handleSuccess($event, column.englishName)\" formControlName=\"{{column.englishName}}\">\r\n                </ngx-recaptcha2>\r\n            </div>\r\n\r\n            <!-- DEFAULT -->\r\n            <div *ngSwitchDefault>\r\n                <ipa-text-input [formControlName]=\"column.englishName\" [id]=\"column.englishName\" [type]=\"column.type\"\r\n                    [label]=\"column.arabicLabel\" [required]=\"column.required\" [pattern]=\"column.pattern\"\r\n                    [patternErrorMsg]=\"column.patternErrorMsg\" [classes]=\"column.classes\"\r\n                    [containerClasses]=\"column.containerClasses\"></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"] }, { type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "disabled", "patternErrorMsg", "pattern", "classes", "containerClasses"] }, { type: FileUploadComponent, selector: "ipa-file-upload", inputs: ["label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { type: i5.ReCaptcha2Component, selector: "ngx-recaptcha2", inputs: ["theme", "size", "hl"] }, { type: TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses"] }], 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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "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.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.NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: GenerateFormComponent, decorators: [{
             type: Component,
             args: [{
@@ -703,7 +864,7 @@ class DatepickerComponent {
     }
 }
 DatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: DatepickerComponent, deps: [{ token: IPAFormService }, { token: i2.NgbCalendar }, { token: i2$1.NgControl, self: true }, { token: i2.NgbInputDatepickerConfig }], target: i0.ɵɵFactoryTarget.Component });
-DatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: DatepickerComponent, selector: "ipa-datepicker", inputs: { id: "id", label: "label", patternErrorMsg: "patternErrorMsg", required: "required", maxDate: "maxDate", minDate: "minDate", classes: "classes", containerClasses: "containerClasses" }, ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input id=\"{{id}}\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && required,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && required)}\"\r\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\r\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\r\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n    <ng-template #footerTemplate style=\"text-align: center;\">\r\n        <hr>\r\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\r\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\r\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\r\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n    </ng-template>\r\n</div>", styles: [""], directives: [{ type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["disabled", "autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { 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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+DatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: DatepickerComponent, selector: "ipa-datepicker", inputs: { id: "id", label: "label", patternErrorMsg: "patternErrorMsg", required: "required", maxDate: "maxDate", minDate: "minDate", classes: "classes", containerClasses: "containerClasses" }, ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input id=\"{{id}}\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  || errorMsg)}\"\r\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\r\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\r\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n    <ng-template #footerTemplate style=\"text-align: center;\">\r\n        <hr>\r\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\r\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\r\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\r\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n    </ng-template>\r\n</div>", styles: [""], directives: [{ type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["disabled", "autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { 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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: DatepickerComponent, decorators: [{
             type: Component,
             args: [{
@@ -772,7 +933,7 @@ HijriDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0",
 HijriDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: HijriDatepickerComponent, selector: "ipa-hijri-datepicker", providers: [
         { provide: NgbCalendar, useClass: NgbCalendarIslamicUmalqura },
         { provide: NgbDatepickerI18n, useClass: IslamicI18n },
-    ], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input id=\"{{id}}\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && required,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && required)}\"\r\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\r\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\r\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n    <ng-template #footerTemplate style=\"text-align: center;\">\r\n        <hr>\r\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\r\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\r\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\r\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n    </ng-template>\r\n</div>", styles: [""], directives: [{ type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["disabled", "autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { 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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    ], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input id=\"{{id}}\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  || errorMsg)}\"\r\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\r\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\r\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n    <ng-template #footerTemplate style=\"text-align: center;\">\r\n        <hr>\r\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\r\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\r\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\r\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n    </ng-template>\r\n</div>", styles: [""], directives: [{ type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["disabled", "autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { 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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: HijriDatepickerComponent, decorators: [{
             type: Component,
             args: [{
@@ -827,7 +988,7 @@ GregorianDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0
 GregorianDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: GregorianDatepickerComponent, selector: "ipa-gregorian-datepicker", providers: [
         { provide: NgbCalendar, useClass: NgbCalendarGregorian },
         { provide: NgbDatepickerI18n, useClass: Gregorian18n },
-    ], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input id=\"{{id}}\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && required,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  && required)}\"\r\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\r\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\r\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n    <ng-template #footerTemplate style=\"text-align: center;\">\r\n        <hr>\r\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\r\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\r\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\r\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n    </ng-template>\r\n</div>", styles: [""], directives: [{ type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["disabled", "autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { 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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    ], usesInheritance: true, ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n    <input id=\"{{id}}\"\r\n        [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched)  || errorMsg)}\"\r\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\r\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\r\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\r\n    <label for=\"{{id}}\">{{label}}</label>\r\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n        {{errorMsg}}\r\n    </div>\r\n    <ng-template #footerTemplate style=\"text-align: center;\">\r\n        <hr>\r\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\r\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\r\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\r\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\r\n    </ng-template>\r\n</div>", styles: [""], directives: [{ type: i2.NgbInputDatepicker, selector: "input[ngbDatepicker]", inputs: ["disabled", "autoClose", "datepickerClass", "dayTemplate", "dayTemplateData", "displayMonths", "firstDayOfWeek", "footerTemplate", "markDisabled", "minDate", "maxDate", "navigation", "outsideDays", "placement", "restoreFocus", "showWeekNumbers", "startDate", "container", "positionTarget", "weekdays"], outputs: ["dateSelect", "navigate", "closed"], exportAs: ["ngbDatepicker"] }, { 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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: GregorianDatepickerComponent, decorators: [{
             type: Component,
             args: [{