ng-ipa-library 0.5.1 → 0.5.5

package/fesm2015/ng-ipa-library.js

@@ -32,9 +32,9 @@ class HijriDatePipe {
         return momentHijri(date).format(format);
     }
 }
-HijriDatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: HijriDatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-HijriDatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: HijriDatePipe, name: "hijriDate" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: HijriDatePipe, decorators: [{
+HijriDatePipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: HijriDatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+HijriDatePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: HijriDatePipe, name: "hijriDate" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: HijriDatePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'hijriDate',
@@ -43,10 +43,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
 
 class PipesModule {
 }
-PipesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PipesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PipesModule, declarations: [HijriDatePipe], exports: [HijriDatePipe] });
-PipesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PipesModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: PipesModule, decorators: [{
+PipesModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: PipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PipesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: PipesModule, declarations: [HijriDatePipe], exports: [HijriDatePipe] });
+PipesModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: PipesModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: PipesModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [HijriDatePipe],
@@ -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,14 +139,17 @@ 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)',
         };
-        console.log(validatorValue);
         return config[validatorName];
     }
     addPatternMsg(validatorValue, patternErrorMsg) {
@@ -113,32 +169,132 @@ 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.5", ngImport: i0, type: IPAFormService, deps: [{ token: i2.NgbDateParserFormatter }], target: i0.ɵɵFactoryTarget.Injectable });
-IPAFormService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: IPAFormService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: IPAFormService, decorators: [{
+IPAFormService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IPAFormService, deps: [{ token: i2.NgbDateParserFormatter }], target: i0.ɵɵFactoryTarget.Injectable });
+IPAFormService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IPAFormService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IPAFormService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -152,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,9 +337,9 @@ class TextInputComponent {
         return this.errorMsg;
     }
 }
-TextInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", 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.5", 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"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TextInputComponent, decorators: [{
+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    <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: [{
                     selector: 'ipa-text-input',
@@ -222,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,9 +406,9 @@ class TextareaInputComponent {
         return this.errorMsg;
     }
 }
-TextareaInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", 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.5", 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"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TextareaInputComponent, decorators: [{
+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    <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: [{
                     selector: 'ipa-textarea-input',
@@ -318,9 +474,9 @@ class DropdownInputComponent {
         return this.errorMsg;
     }
 }
-DropdownInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", 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: "12.2.5", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", disabled: "disabled", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], 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  <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n    [formControl]=\"formControl\">\r\n    <option *ngFor=\"let item of items\" [value]=\"valueField ? item[valueField] : item\">\r\n      {{textField ? item[textField] : item}}</option>\r\n  </select>\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.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.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.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: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: DropdownInputComponent, decorators: [{
+DropdownInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", 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: "12.2.9", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", disabled: "disabled", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], 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  <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n    [formControl]=\"formControl\">\r\n    <option *ngFor=\"let item of items\" [value]=\"valueField ? item[valueField] : item\">\r\n      {{textField ? item[textField] : item}}</option>\r\n  </select>\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.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.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.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: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: DropdownInputComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ipa-dropdown-input',
@@ -368,9 +524,9 @@ class LoaderService {
         this.urls.push(url);
     }
 }
-LoaderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-LoaderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoaderService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoaderService, decorators: [{
+LoaderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+LoaderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoaderService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoaderService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -389,9 +545,9 @@ class LoaderComponent {
         });
     }
 }
-LoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoaderComponent, deps: [{ token: LoaderService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-LoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: LoaderComponent, selector: "ipa-loader", ngImport: i0, template: "<div id=\"cover-spin\" [class.d-none]=\"!loading\">\r\n  <div class=\"spinner\"></div>\r\n</div>\r\n", styles: ["#cover-spin{position:fixed;width:100%;left:0;height:100%;right:0;top:0;bottom:0;background-color:#fff;z-index:99999;display:flex;justify-content:center;align-items:center}#cover-spin:after{content:\"\";display:block;background-size:46px;position:absolute;left:48%;top:40%;width:46px;height:46px;-webkit-animation:spin .8s linear infinite;animation:spin .8s linear infinite}@-webkit-keyframes spin7{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}@keyframes spin7{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}.spinner{display:block;position:fixed;top:50%;left:50%;height:80px;width:80px;margin-top:-50px;margin-left:-50px;border:2px solid transparent;border-top-color:#2d557e;border-radius:50%;-webkit-animation:spin7 1s ease infinite;animation:spin7 1s ease infinite}.spinner:before{content:\"\";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border-radius:50%;border:2px solid transparent;border-top-color:#2aa7c5;-webkit-animation:spin7 3s linear infinite;animation:spin7 3s linear infinite}.spinner:after{content:\"\";position:absolute;top:15px;right:15px;bottom:15px;left:15px;border-radius:50%;border:2px solid transparent;border-top-color:#cfe79d;-webkit-animation:spin7 1.5s ease infinite;animation:spin7 1.5s ease infinite}"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoaderComponent, decorators: [{
+LoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoaderComponent, deps: [{ token: LoaderService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+LoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: LoaderComponent, selector: "ipa-loader", ngImport: i0, template: "<div id=\"cover-spin\" [class.d-none]=\"!loading\">\r\n  <div class=\"spinner\"></div>\r\n</div>\r\n", styles: ["#cover-spin{position:fixed;width:100%;left:0;height:100%;right:0;top:0;bottom:0;background-color:#fff;z-index:99999;display:flex;justify-content:center;align-items:center}#cover-spin:after{content:\"\";display:block;background-size:46px;position:absolute;left:48%;top:40%;width:46px;height:46px;-webkit-animation:spin .8s linear infinite;animation:spin .8s linear infinite}@-webkit-keyframes spin7{0%{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes spin7{0%{transform:rotate(0)}to{transform:rotate(359deg)}}.spinner{display:block;position:fixed;top:50%;left:50%;height:80px;width:80px;margin-top:-50px;margin-left:-50px;border:2px solid transparent;border-top-color:#2d557e;border-radius:50%;-webkit-animation:spin7 1s ease infinite;animation:spin7 1s ease infinite}.spinner:before{content:\"\";position:absolute;top:7px;right:7px;bottom:7px;left:7px;border:2px solid transparent;border-radius:50%;border-top-color:#2aa7c5;-webkit-animation:spin7 3s linear infinite;animation:spin7 3s linear infinite}.spinner:after{content:\"\";position:absolute;top:15px;right:15px;bottom:15px;left:15px;border:2px solid transparent;border-radius:50%;border-top-color:#cfe79d;-webkit-animation:spin7 1.5s ease infinite;animation:spin7 1.5s ease infinite}\n"] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoaderComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ipa-loader',
@@ -406,6 +562,7 @@ class FileUploadComponent {
     toastrService) {
         this.toastrService = toastrService;
         this.label = '';
+        this.required = false;
         this.acceptedFiles = '';
         this.multiple = 1; // set maxFiles (NOT uploadMultiple)in the config object,
         this.maxFileSize = 2;
@@ -483,9 +640,9 @@ class FileUploadComponent {
         this.fileDeleted.emit();
     }
 }
-FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
-FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: FileUploadComponent, selector: "ipa-file-upload", inputs: { label: "label", acceptedFiles: "acceptedFiles", multiple: "multiple", maxFileSize: "maxFileSize", method: "method", autoUpload: "autoUpload", apiUrl: "apiUrl", authorization: "authorization" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, viewQueries: [{ propertyName: "dropzoneDir", first: true, predicate: DropzoneDirective, descendants: true }], ngImport: i0, template: "<div class=\"file-upload\">\n    <div class=\"upload-overlay\" [dropzone]=\"config\" (error)=\"onUploadError($event)\"\n        (queueComplete)=\"operationCompleted($event)\" (success)=\"onUploadSuccess($event)\" (dragenter)=\"dragEnter = true\"\n        (dragLeave)=\"dragEnter = false\" (drop)=\"dragEnter = false\" (dragEnd)=\"dragEnter = false\"\n        [class.active-border]=\"dragEnter\" (sending)=\"sending($event)\" (reset)=\"reset($event)\"\n        (addedFile)=\"fileWasAdded($event)\">\n    </div>\n    <div class=\"upload-btn-wrapper\">\n        <div>\n            <div class=\"subtitle mb-2\">\n                {{label}}\n            </div>\n            <hr>\n            <span style=\"font-size: 12px;\">\u0642\u0645 \u0628\u0633\u062D\u0628 \u0627\u0644\u0645\u0644\u0641 \u0623\u0648 \u0627\u0636\u063A\u0637 \u0647\u0646\u0627</span>\n            <i class=\"fas fa-upload upload-icon mr-2\"></i>\n        </div>\n        <div *ngIf=\"acceptedFiles.length > 0\" class=\"allowed-extensions\">\n            \u0627\u0644\u0635\u064A\u063A\u0629 \u0627\u0644\u0645\u0633\u0645\u0648\u062D \u0628\u0647\u0627:\n            <span class=\"extensions\">{{ acceptedFiles }}</span>\n        </div>\n        <div class=\"allowed-extensions\">\n            \u0627\u0642\u0635\u0649 \u062D\u062C\u0645 \u0644\u0644\u0645\u0631\u0641\u0642:\n            <span class=\"extensions\">{{ maxFileSize }} MB</span>\n        </div>\n    </div>\n</div>\n<div id=\"attachment-status\" style=\"text-align: center; margin-top:10px;\">\n    <span style=\"font-size: 14px; margin: auto; font-weight:bold;\" *ngFor=\"let file of currentFiles\">\n        {{ file.name }} <i (click)=\"deleteFile(file)\" class=\"fas fa-trash\"\n            style=\"color:firebrick; cursor: pointer;\"></i>\n        <br>\n    </span>\n    <ul class=\"list-unstyled\">\n        <li class=\"text-danger\" style=\"font-size: 12px;\" *ngFor=\"let error of errors\">{{error}}</li>\n    </ul>\n</div>", styles: [".subtitle{border-bottom:none;display:block;line-height:2}.file-upload{border:1px dashed #ccc;display:block;min-height:150px;border-radius:15px;width:350px;cursor:pointer;z-index:9999;position:relative;margin:auto}.upload-overlay{position:absolute;width:100%;height:100%}.upload-btn-wrapper{text-align:center}.upload-icon{margin-right:5px}.list-unstyled{margin:10px!important;padding:14px!important;list-style:none}"], directives: [{ type: i2$2.DropzoneDirective, selector: "[dropzone]", inputs: ["disabled", "dropzone"], outputs: ["init", "error", "success", "sending", "canceled", "complete", "processing", "drop", "dragStart", "dragEnd", "dragEnter", "dragOver", "dragLeave", "thumbnail", "addedFile", "addedFiles", "removedFile", "uploadProgress", "maxFilesReached", "maxFilesExceeded", "errorMultiple", "successMultiple", "sendingMultiple", "canceledMultiple", "completeMultiple", "processingMultiple", "reset", "queueComplete", "totalUploadProgress"], exportAs: ["ngxDropzone"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: FileUploadComponent, decorators: [{
+FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: FileUploadComponent, deps: [{ token: i1.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
+FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: FileUploadComponent, selector: "ipa-file-upload", inputs: { label: "label", required: "required", acceptedFiles: "acceptedFiles", multiple: "multiple", maxFileSize: "maxFileSize", method: "method", autoUpload: "autoUpload", apiUrl: "apiUrl", authorization: "authorization" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, viewQueries: [{ propertyName: "dropzoneDir", first: true, predicate: DropzoneDirective, descendants: true }], ngImport: i0, template: "<div class=\"file-upload\">\r\n    <div class=\"upload-overlay\" [dropzone]=\"config\" (error)=\"onUploadError($event)\"\r\n        (queueComplete)=\"operationCompleted($event)\" (success)=\"onUploadSuccess($event)\" (dragenter)=\"dragEnter = true\"\r\n        (dragLeave)=\"dragEnter = false\" (drop)=\"dragEnter = false\" (dragEnd)=\"dragEnter = false\"\r\n        [class.active-border]=\"dragEnter\" (sending)=\"sending($event)\" (reset)=\"reset($event)\"\r\n        (addedFile)=\"fileWasAdded($event)\">\r\n    </div>\r\n    <div class=\"upload-btn-wrapper\">\r\n        <div>\r\n            <div class=\"subtitle mb-2\">\r\n                {{label}}\r\n                <span *ngIf=\"required\" class=\"required\">*</span>\r\n            </div>\r\n            <hr>\r\n            <span style=\"font-size: 12px;\">\u0642\u0645 \u0628\u0633\u062D\u0628 \u0627\u0644\u0645\u0644\u0641 \u0623\u0648 \u0627\u0636\u063A\u0637 \u0647\u0646\u0627</span>\r\n            <i class=\"fas fa-upload upload-icon mr-2\"></i>\r\n        </div>\r\n        <div *ngIf=\"acceptedFiles.length > 0\" class=\"allowed-extensions\">\r\n            \u0627\u0644\u0635\u064A\u063A\u0629 \u0627\u0644\u0645\u0633\u0645\u0648\u062D \u0628\u0647\u0627:\r\n            <span class=\"extensions\">{{ acceptedFiles }}</span>\r\n        </div>\r\n        <div class=\"allowed-extensions\">\r\n            \u0627\u0642\u0635\u0649 \u062D\u062C\u0645 \u0644\u0644\u0645\u0631\u0641\u0642:\r\n            <span class=\"extensions\">{{ maxFileSize }} MB</span>\r\n        </div>\r\n    </div>\r\n</div>\r\n<div id=\"attachment-status\" style=\"text-align: center; margin-top:10px;\">\r\n    <span style=\"font-size: 14px; margin: auto; font-weight:bold;\" *ngFor=\"let file of currentFiles\">\r\n        {{ file.name }} <i (click)=\"deleteFile(file)\" class=\"fas fa-trash\"\r\n            style=\"color:firebrick; cursor: pointer;\"></i>\r\n        <br>\r\n    </span>\r\n    <ul class=\"list-unstyled\">\r\n        <li class=\"text-danger\" style=\"font-size: 12px;\" *ngFor=\"let error of errors\">{{error}}</li>\r\n    </ul>\r\n</div>", styles: [".subtitle{border-bottom:none;display:block;line-height:2}.file-upload{border:dashed 1px #ccc;display:block;min-height:150px;border-radius:15px;width:350px;cursor:pointer;position:relative;margin:auto}.upload-overlay{position:absolute;width:100%;height:100%}.upload-btn-wrapper{text-align:center}.upload-icon{margin-right:5px}.list-unstyled{margin:10px!important;padding:14px!important;list-style:none}.allowed-extensions{color:#4d7297}.required{color:#dc3545;font-size:20px}\n"], directives: [{ type: i2$2.DropzoneDirective, selector: "[dropzone]", inputs: ["disabled", "dropzone"], outputs: ["init", "error", "success", "sending", "canceled", "complete", "processing", "drop", "dragStart", "dragEnd", "dragEnter", "dragOver", "dragLeave", "thumbnail", "addedFile", "addedFiles", "removedFile", "uploadProgress", "maxFilesReached", "maxFilesExceeded", "errorMultiple", "successMultiple", "sendingMultiple", "canceledMultiple", "completeMultiple", "processingMultiple", "reset", "queueComplete", "totalUploadProgress"], exportAs: ["ngxDropzone"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: FileUploadComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ipa-file-upload',
@@ -497,6 +654,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
                 args: [DropzoneDirective, { static: false }]
             }], label: [{
                 type: Input
+            }], required: [{
+                type: Input
             }], acceptedFiles: [{
                 type: Input
             }], multiple: [{
@@ -556,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);
@@ -629,9 +792,9 @@ class GenerateFormComponent {
         this.useGlobalDomain = (_c = col.useGlobalDomain) !== null && _c !== void 0 ? _c : this.useGlobalDomain;
     }
 }
-GenerateFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: GenerateFormComponent, deps: [{ token: IPAFormService }], target: i0.ɵɵFactoryTarget.Component });
-GenerateFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", 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", "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.5", ngImport: i0, type: GenerateFormComponent, decorators: [{
+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(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: [{
                     selector: 'ipa-generate-form',
@@ -700,9 +863,9 @@ class DatepickerComponent {
         return this.errorMsg;
     }
 }
-DatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", 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.5", 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}}\">\n    <input id=\"{{id}}\"\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)}\"\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\n    <label for=\"{{id}}\">{{label}}</label>\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\n        {{errorMsg}}\n    </div>\n    <ng-template #footerTemplate style=\"text-align: center;\">\n        <hr>\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\n    </ng-template>\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.5", ngImport: i0, type: DatepickerComponent, decorators: [{
+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)) && 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: [{
                     selector: 'ipa-datepicker',
@@ -758,20 +921,20 @@ class IslamicI18n extends NgbDatepickerI18n {
         return `${date.day}-${date.month}-${date.year}`;
     }
 }
-IslamicI18n.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: IslamicI18n, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-IslamicI18n.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: IslamicI18n });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: IslamicI18n, decorators: [{
+IslamicI18n.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IslamicI18n, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+IslamicI18n.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IslamicI18n });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: IslamicI18n, decorators: [{
             type: Injectable
         }] });
 
 class HijriDatepickerComponent extends DatepickerComponent {
 }
-HijriDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: HijriDatepickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-HijriDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: HijriDatepickerComponent, selector: "ipa-hijri-datepicker", providers: [
+HijriDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: HijriDatepickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+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}}\">\n    <input id=\"{{id}}\"\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)}\"\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\n    <label for=\"{{id}}\">{{label}}</label>\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\n        {{errorMsg}}\n    </div>\n    <ng-template #footerTemplate style=\"text-align: center;\">\n        <hr>\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\n    </ng-template>\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.5", ngImport: i0, type: HijriDatepickerComponent, decorators: [{
+    ], 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: [{
                     selector: 'ipa-hijri-datepicker',
@@ -813,20 +976,20 @@ class Gregorian18n extends NgbDatepickerI18n {
         return `${date.day}-${date.month}-${date.year}`;
     }
 }
-Gregorian18n.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Gregorian18n, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-Gregorian18n.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Gregorian18n });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: Gregorian18n, decorators: [{
+Gregorian18n.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: Gregorian18n, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+Gregorian18n.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: Gregorian18n });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: Gregorian18n, decorators: [{
             type: Injectable
         }] });
 
 class GregorianDatepickerComponent extends DatepickerComponent {
 }
-GregorianDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: GregorianDatepickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-GregorianDatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: GregorianDatepickerComponent, selector: "ipa-gregorian-datepicker", providers: [
+GregorianDatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: GregorianDatepickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+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}}\">\n    <input id=\"{{id}}\"\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)}\"\n        class=\"form-control {{classes}}\" [formControl]=\"formControl\" (click)=\"d.toggle()\" [firstDayOfWeek]=\"7\"\n        ngbDatepicker #d=\"ngbDatepicker\" [maxDate]=\"maxDate\" [minDate]=\"minDate\" [footerTemplate]=\"footerTemplate\"\n        [required]=\"required\" style=\"outline: unset;\" autocomplete=\"off\" (blur)=\"onTouched()\">\n    <label for=\"{{id}}\">{{label}}</label>\n    <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\n        {{errorMsg}}\n    </div>\n    <ng-template #footerTemplate style=\"text-align: center;\">\n        <hr>\n        <button type=\"button\" class=\"btn btn-primary btn-sm m-2 \" style=\"width: auto; float: right;\"\n            (click)=\"formControl.patchValue(today);d.navigateTo(today);\">\u0627\u0644\u064A\u0648\u0645</button>\n        <button type=\"button\" class=\"btn btn-secondary btn-sm m-2\" style=\"width: auto; float: left;\"\n            (click)=\"formControl.patchValue(null);d.close()\">\u0645\u0633\u062D</button>\n    </ng-template>\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.5", ngImport: i0, type: GregorianDatepickerComponent, decorators: [{
+    ], 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: [{
                     selector: 'ipa-gregorian-datepicker',
@@ -840,30 +1003,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
         }] });
 
 class ShareButtonComponent {
-    constructor() { }
+    constructor() {
+        this.title = '';
+        this.description = '';
+    }
     ngAfterViewInit() {
         const elements = document.getElementsByClassName('sb-show-icon');
         elements[0].setAttribute('type', 'button');
     }
 }
-ShareButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ShareButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ShareButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.5", type: ShareButtonComponent, selector: "ipa-share-button", ngImport: i0, template: "<share-popup-button [icon]=\"''\" [include]=\"['facebook','twitter','linkedin','telegram','whatsapp','email','copy']\" >\u0645\u0634\u0627\u0631\u0643\u0629</share-popup-button>", styles: [""], components: [{ type: i1$1.SharePopupComponent, selector: "share-popup-button", inputs: ["theme", "icon", "text", "include", "exclude", "closeIcon", "url", "title", "description", "image", "tags", "autoSetMeta", "show", "showIcon", "showText", "disabled", "hasBackdrop", "backdropClass"], outputs: ["opened", "closed", "popupClosed"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ShareButtonComponent, decorators: [{
+ShareButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ShareButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+ShareButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.9", type: ShareButtonComponent, selector: "ipa-share-button", inputs: { title: "title", description: "description" }, ngImport: i0, template: "<share-popup-button [title]=\"title\" [description]=\"description\" [icon]=\"'share'\"\r\n    [include]=\"['facebook','twitter','linkedin','telegram','whatsapp','email','copy']\">\r\n</share-popup-button>", styles: [""], components: [{ type: i1$1.SharePopupComponent, selector: "share-popup-button", inputs: ["theme", "icon", "text", "include", "exclude", "closeIcon", "url", "title", "description", "image", "tags", "autoSetMeta", "show", "showIcon", "showText", "disabled", "hasBackdrop", "backdropClass"], outputs: ["opened", "closed", "popupClosed"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ShareButtonComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ipa-share-button',
                     templateUrl: './share-button.component.html',
                     styleUrls: ['./share-button.component.scss'],
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: function () { return []; }, propDecorators: { title: [{
+                type: Input
+            }], description: [{
+                type: Input
+            }] } });
 
 class ShareButtonModule {
     constructor(library) {
         library.addIconPacks(fas);
     }
 }
-ShareButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ShareButtonModule, deps: [{ token: i1$2.FaIconLibrary }], target: i0.ɵɵFactoryTarget.NgModule });
-ShareButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ShareButtonModule, declarations: [ShareButtonComponent], imports: [ShareIconsModule,
+ShareButtonModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ShareButtonModule, deps: [{ token: i1$2.FaIconLibrary }], target: i0.ɵɵFactoryTarget.NgModule });
+ShareButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ShareButtonModule, declarations: [ShareButtonComponent], imports: [ShareIconsModule,
         ShareButtonsPopupModule,
         OverlayModule,
         FontAwesomeModule], exports: [ShareButtonComponent,
@@ -871,7 +1041,7 @@ ShareButtonModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", versi
         ShareButtonsPopupModule,
         OverlayModule,
         FontAwesomeModule] });
-ShareButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ShareButtonModule, imports: [[
+ShareButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ShareButtonModule, imports: [[
             ShareIconsModule,
             ShareButtonsPopupModule,
             OverlayModule,
@@ -880,7 +1050,7 @@ ShareButtonModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", versi
         ShareButtonsPopupModule,
         OverlayModule,
         FontAwesomeModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ShareButtonModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ShareButtonModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ShareButtonComponent],
@@ -902,8 +1072,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImpor
 
 class NgIPALibraryModule {
 }
-NgIPALibraryModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NgIPALibraryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgIPALibraryModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NgIPALibraryModule, declarations: [TextInputComponent,
+NgIPALibraryModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: NgIPALibraryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgIPALibraryModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: NgIPALibraryModule, declarations: [TextInputComponent,
         TextareaInputComponent,
         DropdownInputComponent,
         LoaderComponent,
@@ -929,7 +1099,7 @@ NgIPALibraryModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", vers
         HijriDatepickerComponent,
         GregorianDatepickerComponent,
         ShareButtonModule] });
-NgIPALibraryModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NgIPALibraryModule, imports: [[
+NgIPALibraryModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: NgIPALibraryModule, imports: [[
             CommonModule,
             FormsModule,
             ReactiveFormsModule,
@@ -941,7 +1111,7 @@ NgIPALibraryModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", vers
             ShareButtonModule,
         ], PipesModule,
         ShareButtonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: NgIPALibraryModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: NgIPALibraryModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -1028,9 +1198,9 @@ class LoadingInterceptor {
         return false;
     }
 }
-LoadingInterceptor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoadingInterceptor, deps: [{ token: LoaderService }], target: i0.ɵɵFactoryTarget.Injectable });
-LoadingInterceptor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoadingInterceptor });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: LoadingInterceptor, decorators: [{
+LoadingInterceptor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoadingInterceptor, deps: [{ token: LoaderService }], target: i0.ɵɵFactoryTarget.Injectable });
+LoadingInterceptor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoadingInterceptor });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: LoadingInterceptor, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: LoaderService }]; } });
 
@@ -1045,9 +1215,9 @@ class ErrorService {
         this.urls.push(url);
     }
 }
-ErrorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ErrorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-ErrorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ErrorService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ErrorService, decorators: [{
+ErrorService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ErrorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+ErrorService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ErrorService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ErrorService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -1088,9 +1258,9 @@ class ErrorInterceptor {
         return false;
     }
 }
-ErrorInterceptor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ErrorInterceptor, deps: [{ token: ErrorService }, { token: i1.ToastrService }], target: i0.ɵɵFactoryTarget.Injectable });
-ErrorInterceptor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ErrorInterceptor });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: ErrorInterceptor, decorators: [{
+ErrorInterceptor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ErrorInterceptor, deps: [{ token: ErrorService }, { token: i1.ToastrService }], target: i0.ɵɵFactoryTarget.Injectable });
+ErrorInterceptor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ErrorInterceptor });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: ErrorInterceptor, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: ErrorService }, { type: i1.ToastrService }]; } });
 
@@ -1130,9 +1300,9 @@ class AuthService {
         return JSON.parse(jsonPayload);
     }
 }
-AuthService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AuthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-AuthService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AuthService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: AuthService, decorators: [{
+AuthService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: AuthService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+AuthService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: AuthService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: AuthService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -1198,9 +1368,9 @@ class TokenInterceptor {
         return false;
     }
 }
-TokenInterceptor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TokenInterceptor, deps: [{ token: AuthService }, { token: i2$3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-TokenInterceptor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TokenInterceptor });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: TokenInterceptor, decorators: [{
+TokenInterceptor.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: TokenInterceptor, deps: [{ token: AuthService }, { token: i2$3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+TokenInterceptor.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: TokenInterceptor });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: TokenInterceptor, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: AuthService }, { type: i2$3.HttpClient }]; } });
 
@@ -1338,9 +1508,9 @@ class BreadcrumbsService {
         lastSpan.innerHTML = lastSpanLink.innerHTML;
     }
 }
-BreadcrumbsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: BreadcrumbsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-BreadcrumbsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: BreadcrumbsService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: BreadcrumbsService, decorators: [{
+BreadcrumbsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: BreadcrumbsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+BreadcrumbsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: BreadcrumbsService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: BreadcrumbsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -1402,9 +1572,9 @@ class CommonService {
         return html.join('\r\n');
     }
 }
-CommonService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: CommonService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-CommonService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: CommonService, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.5", ngImport: i0, type: CommonService, decorators: [{
+CommonService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: CommonService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+CommonService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: CommonService, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.9", ngImport: i0, type: CommonService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',