ng-ipa-library 6.0.1 → 6.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/fesm2022/ng-ipa-library.mjs +264 -24
  2. package/fesm2022/ng-ipa-library.mjs.map +1 -1
  3. package/lib/generate-form/generate-form.component.d.ts +2 -1
  4. package/lib/ipa-form/dropdown-input/dropdown-input.component.d.ts +3 -1
  5. package/lib/ipa-form/text-input/text-input.component.d.ts +3 -2
  6. package/lib/ipa-form/textarea-input/textarea-input.component.d.ts +3 -2
  7. package/lib/services/breadcrumbsV2.service.d.ts +18 -0
  8. package/lib/share-button/share-button.component.d.ts +2 -1
  9. package/package.json +1 -1
  10. package/public-api.d.ts +1 -0
package/fesm2022/ng-ipa-library.mjs CHANGED
@@ -351,8 +351,8 @@ class TextInputComponent {
351
351
  this.validationService = validationService;
352
352
  this.controlDir = controlDir;
353
353
  this.cd = cd;
354
+ this.isPlatformCodeDesignSystem = false;
354
355
  this.type = 'text';
355
- this.placeholder = 'please enter text';
356
356
  this.label = 'text input';
357
357
  this.required = false;
358
358
  this.patternErrorMsg = 'invalid pattern';
@@ -371,6 +371,7 @@ class TextInputComponent {
371
371
  control?.setValidators(validators);
372
372
  control?.updateValueAndValidity();
373
373
  this.formControl = control;
374
+ this.placeholder = 'اكتب ' + this.label;
374
375
  }
375
376
  onChange(event) { }
376
377
  onTouched() { }
@@ -399,22 +400,22 @@ class TextInputComponent {
399
400
  return this.errorMsg;
400
401
  }
401
402
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TextInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
402
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TextInputComponent, isStandalone: false, selector: "ipa-text-input", inputs: { id: "id", type: "type", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", onlyNumber: "onlyNumber", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n <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()\" (input)=\"checkIsNumber($event)\"\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}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", 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]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
403
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TextInputComponent, isStandalone: false, selector: "ipa-text-input", inputs: { isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem", id: "id", type: "type", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", onlyNumber: "onlyNumber", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<!-- none platform code design system -->\r\n<div class=\"form-floating {{containerClasses}}\" [ngClass]=\"{'d-none': isPlatformCodeDesignSystem}\">\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()\" (input)=\"checkIsNumber($event)\"\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}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n<!-- platform code design system -->\r\n<div class=\"{{containerClasses}}\" [ngClass]=\"{'d-none': !isPlatformCodeDesignSystem}\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <input #input id=\"{{id}}\" class=\"form-control p-2 {{classes}}\" [type]=\"type\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" (input)=\"checkIsNumber($event)\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", 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]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
403
404
  }
404
405
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TextInputComponent, decorators: [{
405
406
  type: Component,
406
- args: [{ selector: 'ipa-text-input', standalone: false, 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()\" (input)=\"checkIsNumber($event)\"\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}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>" }]
407
+ args: [{ selector: 'ipa-text-input', standalone: false, template: "<!-- none platform code design system -->\r\n<div class=\"form-floating {{containerClasses}}\" [ngClass]=\"{'d-none': isPlatformCodeDesignSystem}\">\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()\" (input)=\"checkIsNumber($event)\"\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}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n<!-- platform code design system -->\r\n<div class=\"{{containerClasses}}\" [ngClass]=\"{'d-none': !isPlatformCodeDesignSystem}\">\r\n <label class=\"form-label\" for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <input #input id=\"{{id}}\" class=\"form-control p-2 {{classes}}\" [type]=\"type\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" (input)=\"checkIsNumber($event)\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>" }]
407
408
  }], ctorParameters: () => [{ type: IPAFormService }, { type: i2$1.NgControl, decorators: [{
408
409
  type: Self
409
410
  }] }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
410
411
  type: ViewChild,
411
412
  args: ['input', { static: true }]
413
+ }], isPlatformCodeDesignSystem: [{
414
+ type: Input
412
415
  }], id: [{
413
416
  type: Input
414
417
  }], type: [{
415
418
  type: Input
416
- }], placeholder: [{
417
- type: Input
418
419
  }], label: [{
419
420
  type: Input
420
421
  }], required: [{
@@ -439,8 +440,7 @@ class TextareaInputComponent {
439
440
  this.controlDir = controlDir;
440
441
  this.cd = cd;
441
442
  this.input = new ElementRef(null);
442
- this.placeholder = 'please enter text';
443
- this.label = 'textarea input';
443
+ this.isPlatformCodeDesignSystem = false;
444
444
  this.required = false;
445
445
  this.patternErrorMsg = 'invalid pattern';
446
446
  this.isArabicForm = true;
@@ -456,6 +456,7 @@ class TextareaInputComponent {
456
456
  control?.setValidators(validators);
457
457
  control?.updateValueAndValidity();
458
458
  this.formControl = control;
459
+ this.placeholder = 'اكتب ' + this.label;
459
460
  }
460
461
  onChange(event) { }
461
462
  onTouched() { }
@@ -473,19 +474,19 @@ class TextareaInputComponent {
473
474
  return this.errorMsg;
474
475
  }
475
476
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TextareaInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
476
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TextareaInputComponent, isStandalone: false, selector: "ipa-textarea-input", inputs: { id: "id", placeholder: "placeholder", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n [ngClass]=\"{\r\n 'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n 'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </textarea>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", 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]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
477
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: TextareaInputComponent, isStandalone: false, selector: "ipa-textarea-input", inputs: { isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem", id: "id", label: "label", required: "required", patternErrorMsg: "patternErrorMsg", pattern: "pattern", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<!-- none platform code design system -->\r\n<div class=\"form-floating {{containerClasses}}\" [ngClass]=\"{'d-none': isPlatformCodeDesignSystem}\">\r\n <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n [ngClass]=\"{\r\n 'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n 'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </textarea>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n<!-- platform code design system -->\r\n<div class=\"{{containerClasses}}\" [ngClass]=\"{'d-none': !isPlatformCodeDesignSystem}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n [ngClass]=\"{\r\n 'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n </textarea>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", 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]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
477
478
  }
478
479
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TextareaInputComponent, decorators: [{
479
480
  type: Component,
480
- args: [{ selector: 'ipa-textarea-input', standalone: false, template: "<div class=\"form-floating {{containerClasses}}\">\r\n <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n [ngClass]=\"{\r\n 'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n 'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </textarea>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"] }]
481
+ args: [{ selector: 'ipa-textarea-input', standalone: false, template: "<!-- none platform code design system -->\r\n<div class=\"form-floating {{containerClasses}}\" [ngClass]=\"{'d-none': isPlatformCodeDesignSystem}\">\r\n <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n [ngClass]=\"{\r\n 'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,\r\n 'is-valid is-valid:focus': (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </textarea>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n<!-- platform code design system -->\r\n<div class=\"{{containerClasses}}\" [ngClass]=\"{'d-none': !isPlatformCodeDesignSystem}\">\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n <textarea #input id=\"{{id}}\" class=\"form-control {{classes}}\" [required]=\"required\" pattern=\"{{pattern}}\"\r\n placeholder=\"{{placeholder}}\" [formControl]=\"formControl\" (input)=\"onChange(controlDir.control?.value)\"\r\n (blur)=\"onTouched()\" style=\"height: 135px;\"\r\n [ngClass]=\"{\r\n 'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n </textarea>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>", styles: [".form-floating label{min-width:100%}.form-floating label:before{content:\"\";position:absolute;top:.9em;z-index:-1;width:110%;height:2em;background-color:#fff;box-shadow:0 -1px #fff}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.form-select~label{opacity:.95;color:gray}@media (max-width: 1699px){.form-floating label:before{width:107%!important}}@media (max-width: 770px){.form-floating label:before{width:97%!important}}\n"] }]
481
482
  }], ctorParameters: () => [{ type: IPAFormService }, { type: i2$1.NgControl, decorators: [{
482
483
  type: Self
483
484
  }] }, { type: i0.ChangeDetectorRef }], propDecorators: { input: [{
484
485
  type: ViewChild,
485
486
  args: ['input', { static: true }]
486
- }], id: [{
487
+ }], isPlatformCodeDesignSystem: [{
487
488
  type: Input
488
- }], placeholder: [{
489
+ }], id: [{
489
490
  type: Input
490
491
  }], label: [{
491
492
  type: Input
@@ -507,6 +508,7 @@ class DropdownInputComponent {
507
508
  constructor(validationService, controlDir) {
508
509
  this.validationService = validationService;
509
510
  this.controlDir = controlDir;
511
+ this.isPlatformCodeDesignSystem = false;
510
512
  this.label = 'text input';
511
513
  this.items = [];
512
514
  this.required = false;
@@ -523,6 +525,10 @@ class DropdownInputComponent {
523
525
  control?.setValidators(validators);
524
526
  control?.updateValueAndValidity();
525
527
  this.formControl = control;
528
+ document.addEventListener('DOMContentLoaded', () => {
529
+ if (this.isPlatformCodeDesignSystem)
530
+ this.initCustomDropdowns();
531
+ });
526
532
  }
527
533
  onChange(event) { }
528
534
  onTouched() { }
@@ -540,12 +546,56 @@ class DropdownInputComponent {
540
546
  this.errorMsg = this.validationService.getErrorMessage(this.formControl, '', this.isArabicForm);
541
547
  return this.errorMsg;
542
548
  }
549
+ initCustomDropdowns() {
550
+ // Select all custom wrappers
551
+ const wrappers = document.querySelectorAll('.custom-dropdown-wrapper-' + this.id);
552
+ console.log(wrappers);
553
+ wrappers.forEach((wrapper) => {
554
+ // Find parent container
555
+ const parent = wrapper.closest('.form-group') || wrapper.parentElement;
556
+ if (!parent)
557
+ return;
558
+ // Locate Elements
559
+ const hiddenSelect = parent.querySelector('select');
560
+ const dropdownButton = wrapper.querySelector('.dropdown-toggle');
561
+ const dropdownButtonSpan = dropdownButton.querySelector('span') || dropdownButton;
562
+ const dropdownItems = wrapper.querySelectorAll('.dropdown-item');
563
+ if (!hiddenSelect || !dropdownButton)
564
+ return;
565
+ // Sync visual state with hidden select on load
566
+ if (hiddenSelect.selectedIndex > -1) {
567
+ const selectedOption = hiddenSelect.options[hiddenSelect.selectedIndex];
568
+ dropdownButtonSpan.textContent = selectedOption.text;
569
+ // Set active class
570
+ dropdownItems.forEach((item) => {
571
+ const isActive = item.getAttribute('data-value') === hiddenSelect.value;
572
+ item.classList.toggle('active', isActive);
573
+ });
574
+ }
575
+ // Handle Item Click
576
+ dropdownItems.forEach((item) => {
577
+ item.addEventListener('click', (e) => {
578
+ e.preventDefault();
579
+ const value = item.getAttribute('data-value');
580
+ const text = item.textContent.trim();
581
+ // Update UI
582
+ dropdownButtonSpan.textContent = text || `اختر ${this.label}`;
583
+ dropdownItems.forEach((i) => i.classList.remove('active'));
584
+ item.classList.add('active');
585
+ // Update Data
586
+ hiddenSelect.value = value;
587
+ // Trigger Change Event
588
+ hiddenSelect.dispatchEvent(new Event('change', { bubbles: true }));
589
+ });
590
+ });
591
+ });
592
+ }
543
593
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownInputComponent, deps: [{ token: IPAFormService }, { token: i2$1.NgControl, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
544
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DropdownInputComponent, isStandalone: false, selector: "ipa-dropdown-input", inputs: { id: "id", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", firstItemLabel: "firstItemLabel", searchable: "searchable", notFoundText: "notFoundText", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm", fromGenerateForm: "fromGenerateForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"form-floating {{containerClasses}}\">\r\n <!-- searchable is false -->\r\n <ng-container *ngIf=\"!searchable\">\r\n <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n <option *ngFor=\"let item of items\"\r\n [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}\r\n </option>\r\n </select>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n </ng-container>\r\n\r\n <!-- searchable is true -->\r\n <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </ng-select>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.ɵɵDir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }] }); }
594
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: DropdownInputComponent, isStandalone: false, selector: "ipa-dropdown-input", inputs: { id: "id", isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem", label: "label", items: "items", textField: "textField", valueField: "valueField", required: "required", firstItemLabel: "firstItemLabel", searchable: "searchable", notFoundText: "notFoundText", classes: "classes", containerClasses: "containerClasses", isArabicForm: "isArabicForm", fromGenerateForm: "fromGenerateForm" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["select"], descendants: true, static: true }], ngImport: i0, template: "<!-- none platform code design system -->\r\n<div class=\"form-floating {{containerClasses}}\" [ngClass]=\"{'d-none': isPlatformCodeDesignSystem}\">\r\n <!-- searchable is false -->\r\n <ng-container *ngIf=\"!searchable\">\r\n <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n <option *ngFor=\"let item of items\"\r\n [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}\r\n </option>\r\n </select>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n </ng-container>\r\n\r\n <!-- searchable is true -->\r\n <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </ng-select>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n<!-- platform code design system -->\r\n<div class=\"form-group w-100 position-relative {{containerClasses}}\" [ngClass]=\"{'d-none': !isPlatformCodeDesignSystem}\">\r\n <div class=\"d-flex gap-1 mb-2\">\r\n <label class=\"form-label mb-0\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n </div>\r\n <!-- Standard hidden select -->\r\n <select #select id=\"{{id}}\" class=\"form-select d-none\" [required]=\"required\" [formControl]=\"formControl\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n <option *ngFor=\"let item of items\"\r\n [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}\r\n </option>\r\n </select>\r\n <!-- Custom Dropdown Wrapper -->\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}} {{containerClasses}}\">\r\n <button class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center {{classes}}\" type=\"button\"\r\n data-bs-toggle=\"dropdown\" aria-expanded=\"false\" [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n <span class=\"selected-text\">\u0627\u062E\u062A\u0631 {{label}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-100\" style=\"max-height: 500px; overflow-y: auto;\">\r\n <li *ngFor=\"let item of items\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\"\r\n [attr.data-value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"invalid-feedback ms-3\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.ɵɵDir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i5.NgSelectComponent, selector: "ng-select", inputs: ["ariaLabelDropdown", "bindLabel", "bindValue", "ariaLabel", "markFirst", "placeholder", "fixedPlaceholder", "notFoundText", "typeToSearchText", "preventToggleOnRightClick", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "tabFocusOnClearButton", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "ngClass", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick", "keyDownFn"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }] }); }
545
595
  }
546
596
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownInputComponent, decorators: [{
547
597
  type: Component,
548
- args: [{ selector: 'ipa-dropdown-input', standalone: false, template: "<div class=\"form-floating {{containerClasses}}\">\r\n <!-- searchable is false -->\r\n <ng-container *ngIf=\"!searchable\">\r\n <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n <option *ngFor=\"let item of items\"\r\n [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}\r\n </option>\r\n </select>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n </ng-container>\r\n\r\n <!-- searchable is true -->\r\n <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </ng-select>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>" }]
598
+ args: [{ selector: 'ipa-dropdown-input', standalone: false, template: "<!-- none platform code design system -->\r\n<div class=\"form-floating {{containerClasses}}\" [ngClass]=\"{'d-none': isPlatformCodeDesignSystem}\">\r\n <!-- searchable is false -->\r\n <ng-container *ngIf=\"!searchable\">\r\n <select #select id=\"{{id}}\" class=\"form-select {{classes}}\" [required]=\"required\" [formControl]=\"formControl\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n <option *ngFor=\"let item of items\"\r\n [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}\r\n </option>\r\n </select>\r\n <label for=\"{{id}}\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n </ng-container>\r\n\r\n <!-- searchable is true -->\r\n <ng-select *ngIf=\"searchable\" #select dir=\"rtl\" class=\"{{classes}}\" [formControl]=\"formControl\" [items]=\"items\"\r\n [placeholder]=\"label\" [notFoundText]=\"notFoundText\" [required]=\"required\"\r\n [bindValue]=\"fromGenerateForm? textField : valueField\" [bindLabel]=\"textField\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg,'is-valid is-valid:focus': \r\n (controlDir.control?.valid && (controlDir.control?.dirty || controlDir.control?.touched) && (errorMsg || controlDir.value))}\">\r\n </ng-select>\r\n <div class=\"invalid-feedback\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>\r\n<!-- platform code design system -->\r\n<div class=\"form-group w-100 position-relative {{containerClasses}}\" [ngClass]=\"{'d-none': !isPlatformCodeDesignSystem}\">\r\n <div class=\"d-flex gap-1 mb-2\">\r\n <label class=\"form-label mb-0\"><span *ngIf=\"required\" class=\"text-danger\">*</span> {{label}}</label>\r\n </div>\r\n <!-- Standard hidden select -->\r\n <select #select id=\"{{id}}\" class=\"form-select d-none\" [required]=\"required\" [formControl]=\"formControl\"\r\n [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n <option *ngIf=\"firstItemLabel\" value=\"\">{{firstItemLabel}}</option>\r\n <option *ngFor=\"let item of items\"\r\n [value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}\r\n </option>\r\n </select>\r\n <!-- Custom Dropdown Wrapper -->\r\n <div class=\"dropdown custom-dropdown-wrapper-{{id}} {{containerClasses}}\">\r\n <button class=\"form-control dropdown-toggle w-100 text-end d-flex justify-content-between align-items-center {{classes}}\" type=\"button\"\r\n data-bs-toggle=\"dropdown\" aria-expanded=\"false\" [ngClass]=\"{'is-invalid is-invalid:focus': (controlDir.control?.invalid && (controlDir.control?.dirty || controlDir.control?.touched)) && errorMsg}\">\r\n <span class=\"selected-text\">\u0627\u062E\u062A\u0631 {{label}}</span>\r\n </button>\r\n <ul class=\"dropdown-menu dropdown-menu-end w-100\" style=\"max-height: 500px; overflow-y: auto;\">\r\n <li *ngFor=\"let item of items\">\r\n <span class=\"dropdown-item\" href=\"javascript:void(0);\"\r\n [attr.data-value]=\"valueField ? fromGenerateForm ? item[textField] : item[valueField] : item\">\r\n {{textField ? item[textField] : item}}</span>\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"invalid-feedback ms-3\" *ngIf=\"errorMessage !== null\">\r\n {{errorMsg}}\r\n </div>\r\n</div>" }]
549
599
  }], ctorParameters: () => [{ type: IPAFormService }, { type: i2$1.NgControl, decorators: [{
550
600
  type: Self
551
601
  }] }], propDecorators: { input: [{
@@ -553,6 +603,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
553
603
  args: ['select', { static: true }]
554
604
  }], id: [{
555
605
  type: Input
606
+ }], isPlatformCodeDesignSystem: [{
607
+ type: Input
556
608
  }], label: [{
557
609
  type: Input
558
610
  }], items: [{
@@ -822,6 +874,7 @@ class GenerateFormComponent {
822
874
  constructor(validationService) {
823
875
  this.validationService = validationService;
824
876
  this.isArabicForm = true;
877
+ this.isPlatformCodeDesignSystem = false;
825
878
  this.recaptchaSize = 'normal';
826
879
  this.lang = 'ar';
827
880
  this.recaptchaType = 'image';
@@ -928,17 +981,19 @@ class GenerateFormComponent {
928
981
  return selectedItems.length > 0 ? selectedItems : null;
929
982
  }
930
983
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: GenerateFormComponent, deps: [{ token: IPAFormService }], target: i0.ɵɵFactoryTarget.Component }); }
931
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: GenerateFormComponent, isStandalone: false, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", isArabicForm: "isArabicForm", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, ngImport: i0, template: "<form [formGroup]=\"generateForm\">\r\n <ng-container *ngFor=\"let column of form.columns\">\r\n <div [ngSwitch]=\"column.type\">\r\n <!-- TEXTAREA -->\r\n <div *ngSwitchCase=\"'textArea'\">\r\n <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-textarea-input>\r\n </div>\r\n\r\n <!-- DROP DOWN LIST -->\r\n <div *ngSwitchCase=\"'select'\">\r\n <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\" [classes]=\"column.inputClasses!\"\r\n [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n </ipa-dropdown-input>\r\n </div>\r\n\r\n <!-- CHECKBOX -->\r\n <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n type=\"checkbox\" formControlName=\"checkbox\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n {{control.value[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- RADIO -->\r\n <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\">\r\n <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\" type=\"radio\"\r\n [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n {{item[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- FILE UPLOAD -->\r\n <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n <ipa-file-upload [isArabicForm]=\"isArabicForm\" [required]=\"column.required\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [acceptedFiles]=\"column.acceptedFiles!\"\r\n [multiple]=\"column.multipleFile!\" [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\"\r\n [autoUpload]=\"column.autoUploadFile!\" [apiUrl]=\"column.apiUrl?? 'apiUrl' \"\r\n [authorization]=\"column.authorization!\" ngDefaultControl [formControlName]=\"column.formControlName\"\r\n (successUpload)=\"SuccessUpload($event)\" (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n </ipa-file-upload>\r\n </div>\r\n\r\n <!-- recaptcha -->\r\n <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"isArabicForm? 'ar':'en'\" [theme]=\"theme\"\r\n [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n formControlName=\"{{column.formControlName}}\">\r\n </ipa-recaptcha>\r\n </div>\r\n\r\n <!-- DEFAULT -->\r\n <div *ngSwitchDefault>\r\n <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\" [type]=\"column.type\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-text-input>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</form>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: TextInputComponent, selector: "ipa-text-input", inputs: ["id", "type", "placeholder", "label", "required", "patternErrorMsg", "onlyNumber", "pattern", "classes", "containerClasses", "isArabicForm"] }, { kind: "component", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: ["id", "placeholder", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses", "isArabicForm"] }, { kind: "component", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "label", "items", "textField", "valueField", "required", "firstItemLabel", "searchable", "notFoundText", "classes", "containerClasses", "isArabicForm", "fromGenerateForm"] }, { kind: "component", type: FileUploadComponent, selector: "ipa-file-upload", inputs: ["isArabicForm", "label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { kind: "component", type: RecaptchaComponent, selector: "ipa-recaptcha", inputs: ["siteKey", "recaptchaSize", "lang", "recaptchaType", "theme", "useGlobalDomain"] }] }); }
984
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: GenerateFormComponent, isStandalone: false, selector: "ipa-generate-form", inputs: { generateForm: "generateForm", form: "form", isArabicForm: "isArabicForm", isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem", siteKey: "siteKey", recaptchaSize: "recaptchaSize", lang: "lang", recaptchaType: "recaptchaType", theme: "theme", useGlobalDomain: "useGlobalDomain" }, outputs: { successUpload: "successUpload", fileAdded: "fileAdded", fileDeleted: "fileDeleted" }, ngImport: i0, template: "<form [formGroup]=\"generateForm\">\r\n <ng-container *ngFor=\"let column of form.columns\">\r\n <div [ngSwitch]=\"column.type\">\r\n <!-- TEXTAREA -->\r\n <div *ngSwitchCase=\"'textArea'\">\r\n <ipa-textarea-input [isPlatformCodeDesignSystem]=\"isPlatformCodeDesignSystem\" [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-textarea-input>\r\n </div>\r\n\r\n <!-- DROP DOWN LIST -->\r\n <div *ngSwitchCase=\"'select'\">\r\n <ipa-dropdown-input [isPlatformCodeDesignSystem]=\"isPlatformCodeDesignSystem\" [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\" [classes]=\"column.inputClasses!\"\r\n [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n </ipa-dropdown-input>\r\n </div>\r\n\r\n <!-- CHECKBOX -->\r\n <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n type=\"checkbox\" formControlName=\"checkbox\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n {{control.value[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- RADIO -->\r\n <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\">\r\n <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\" type=\"radio\"\r\n [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n {{item[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- FILE UPLOAD -->\r\n <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n <ipa-file-upload [isArabicForm]=\"isArabicForm\" [required]=\"column.required\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [acceptedFiles]=\"column.acceptedFiles!\"\r\n [multiple]=\"column.multipleFile!\" [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\"\r\n [autoUpload]=\"column.autoUploadFile!\" [apiUrl]=\"column.apiUrl?? 'apiUrl' \"\r\n [authorization]=\"column.authorization!\" ngDefaultControl [formControlName]=\"column.formControlName\"\r\n (successUpload)=\"SuccessUpload($event)\" (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n </ipa-file-upload>\r\n </div>\r\n\r\n <!-- recaptcha -->\r\n <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"isArabicForm? 'ar':'en'\" [theme]=\"theme\"\r\n [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n formControlName=\"{{column.formControlName}}\">\r\n </ipa-recaptcha>\r\n </div>\r\n\r\n <!-- DEFAULT -->\r\n <div *ngSwitchDefault>\r\n <ipa-text-input [isPlatformCodeDesignSystem]=\"isPlatformCodeDesignSystem\" [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\" [type]=\"column.type\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-text-input>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</form>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i2$2.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", 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]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: TextInputComponent, selector: "ipa-text-input", inputs: ["isPlatformCodeDesignSystem", "id", "type", "label", "required", "patternErrorMsg", "onlyNumber", "pattern", "classes", "containerClasses", "isArabicForm"] }, { kind: "component", type: TextareaInputComponent, selector: "ipa-textarea-input", inputs: ["isPlatformCodeDesignSystem", "id", "label", "required", "patternErrorMsg", "pattern", "classes", "containerClasses", "isArabicForm"] }, { kind: "component", type: DropdownInputComponent, selector: "ipa-dropdown-input", inputs: ["id", "isPlatformCodeDesignSystem", "label", "items", "textField", "valueField", "required", "firstItemLabel", "searchable", "notFoundText", "classes", "containerClasses", "isArabicForm", "fromGenerateForm"] }, { kind: "component", type: FileUploadComponent, selector: "ipa-file-upload", inputs: ["isArabicForm", "label", "required", "acceptedFiles", "multiple", "maxFileSize", "method", "autoUpload", "apiUrl", "authorization"], outputs: ["successUpload", "fileAdded", "fileDeleted"] }, { kind: "component", type: RecaptchaComponent, selector: "ipa-recaptcha", inputs: ["siteKey", "recaptchaSize", "lang", "recaptchaType", "theme", "useGlobalDomain"] }] }); }
932
985
  }
933
986
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: GenerateFormComponent, decorators: [{
934
987
  type: Component,
935
- args: [{ selector: 'ipa-generate-form', standalone: false, template: "<form [formGroup]=\"generateForm\">\r\n <ng-container *ngFor=\"let column of form.columns\">\r\n <div [ngSwitch]=\"column.type\">\r\n <!-- TEXTAREA -->\r\n <div *ngSwitchCase=\"'textArea'\">\r\n <ipa-textarea-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-textarea-input>\r\n </div>\r\n\r\n <!-- DROP DOWN LIST -->\r\n <div *ngSwitchCase=\"'select'\">\r\n <ipa-dropdown-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\" [classes]=\"column.inputClasses!\"\r\n [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n </ipa-dropdown-input>\r\n </div>\r\n\r\n <!-- CHECKBOX -->\r\n <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n type=\"checkbox\" formControlName=\"checkbox\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n {{control.value[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- RADIO -->\r\n <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\">\r\n <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\" type=\"radio\"\r\n [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n {{item[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- FILE UPLOAD -->\r\n <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n <ipa-file-upload [isArabicForm]=\"isArabicForm\" [required]=\"column.required\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [acceptedFiles]=\"column.acceptedFiles!\"\r\n [multiple]=\"column.multipleFile!\" [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\"\r\n [autoUpload]=\"column.autoUploadFile!\" [apiUrl]=\"column.apiUrl?? 'apiUrl' \"\r\n [authorization]=\"column.authorization!\" ngDefaultControl [formControlName]=\"column.formControlName\"\r\n (successUpload)=\"SuccessUpload($event)\" (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n </ipa-file-upload>\r\n </div>\r\n\r\n <!-- recaptcha -->\r\n <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"isArabicForm? 'ar':'en'\" [theme]=\"theme\"\r\n [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n formControlName=\"{{column.formControlName}}\">\r\n </ipa-recaptcha>\r\n </div>\r\n\r\n <!-- DEFAULT -->\r\n <div *ngSwitchDefault>\r\n <ipa-text-input [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\" [type]=\"column.type\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-text-input>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</form>\r\n" }]
988
+ args: [{ selector: 'ipa-generate-form', standalone: false, 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 [isPlatformCodeDesignSystem]=\"isPlatformCodeDesignSystem\" [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-textarea-input>\r\n </div>\r\n\r\n <!-- DROP DOWN LIST -->\r\n <div *ngSwitchCase=\"'select'\">\r\n <ipa-dropdown-input [isPlatformCodeDesignSystem]=\"isPlatformCodeDesignSystem\" [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [items]=\"column.data!\"\r\n [valueField]=\"column.valueField!\" [textField]=\"column.textField!\" [required]=\"column.required\"\r\n [searchable]=\"column.searchable!\" [notFoundText]=\"column.notFoundText!\" [classes]=\"column.inputClasses!\"\r\n [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\" [fromGenerateForm]=\"true\">\r\n </ipa-dropdown-input>\r\n </div>\r\n\r\n <!-- CHECKBOX -->\r\n <div *ngSwitchCase=\"'checkbox'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container [formArrayName]=\"'items'+ column.formControlName\"\r\n *ngFor=\"let control of getFormControls(column.formControlName).controls; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\" [formGroupName]=\"i\">\r\n <input [id]=\"column.formControlName+control.value[column.valueField!]\" class=\"form-check-input\"\r\n type=\"checkbox\" formControlName=\"checkbox\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+control.value[column.valueField!]\">\r\n {{control.value[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- RADIO -->\r\n <div *ngSwitchCase=\"'radio'\" [class]=\"column.containerClasses\">\r\n <label>\r\n <span *ngIf=\"column.required\" class=\"text-danger\">*</span>\r\n {{isArabicForm? column.arabicLabel : column.englishLabel}}\r\n </label>\r\n <ng-container *ngFor=\"let item of column.data; let i = index\">\r\n <div class=\"form-check {{column.inputClasses}}\">\r\n <input [id]=\"column.formControlName+item[column.valueField!]\" class=\"form-check-input\" type=\"radio\"\r\n [formControlName]=\"column.formControlName\" [value]=\"item[column.textField!]\">\r\n <label class=\"form-check-label\" [for]=\"column.formControlName+item[column.valueField!]\">\r\n {{item[column.textField!]}}\r\n </label>\r\n </div>\r\n </ng-container>\r\n <div class=\"invalid-feedback\" style=\"display: block !important;\"\r\n *ngIf=\"getErrorMessage(column.formControlName) !== null\">\r\n {{errorMsg}}\r\n </div>\r\n </div>\r\n\r\n <!-- FILE UPLOAD -->\r\n <div *ngSwitchCase=\"'file'\" [class]=\"column.containerClasses\">\r\n <ipa-file-upload [isArabicForm]=\"isArabicForm\" [required]=\"column.required\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [acceptedFiles]=\"column.acceptedFiles!\"\r\n [multiple]=\"column.multipleFile!\" [maxFileSize]=\"column.size!\" [method]=\"column.apiURlMethod!\"\r\n [autoUpload]=\"column.autoUploadFile!\" [apiUrl]=\"column.apiUrl?? 'apiUrl' \"\r\n [authorization]=\"column.authorization!\" ngDefaultControl [formControlName]=\"column.formControlName\"\r\n (successUpload)=\"SuccessUpload($event)\" (fileAdded)=\"FileAdded($event, column.formControlName)\"\r\n (fileDeleted)=\"FileDeleted($event, column.formControlName)\">\r\n </ipa-file-upload>\r\n </div>\r\n\r\n <!-- recaptcha -->\r\n <div *ngSwitchCase=\"'recaptcha'\" [class]=\"column.containerClasses\">\r\n <ipa-recaptcha [recaptchaSize]=\"recaptchaSize\" [lang]=\"isArabicForm? 'ar':'en'\" [theme]=\"theme\"\r\n [recaptchaType]=\"recaptchaType\" [useGlobalDomain]=\"useGlobalDomain\"\r\n formControlName=\"{{column.formControlName}}\">\r\n </ipa-recaptcha>\r\n </div>\r\n\r\n <!-- DEFAULT -->\r\n <div *ngSwitchDefault>\r\n <ipa-text-input [isPlatformCodeDesignSystem]=\"isPlatformCodeDesignSystem\" [formControlName]=\"column.formControlName\" [id]=\"column.formControlName\" [type]=\"column.type\"\r\n [label]=\"isArabicForm? column.arabicLabel : column.englishLabel\" [required]=\"column.required\"\r\n [patternErrorMsg]=\"isArabicForm? column.patternArErrorMsg! : column.patternEnErrorMsg!\"\r\n [classes]=\"column.inputClasses!\" [containerClasses]=\"column.containerClasses!\" [isArabicForm]=\"isArabicForm\">\r\n </ipa-text-input>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</form>\r\n" }]
936
989
  }], ctorParameters: () => [{ type: IPAFormService }], propDecorators: { generateForm: [{
937
990
  type: Input
938
991
  }], form: [{
939
992
  type: Input
940
993
  }], isArabicForm: [{
941
994
  type: Input
995
+ }], isPlatformCodeDesignSystem: [{
996
+ type: Input
942
997
  }], siteKey: [{
943
998
  type: Input
944
999
  }], recaptchaSize: [{
@@ -1188,21 +1243,34 @@ class ShareButtonComponent {
1188
1243
  this.title = '';
1189
1244
  this.description = '';
1190
1245
  this.btnLabel = '';
1246
+ this.isPlatformCodeDesignSystem = false;
1191
1247
  }
1192
1248
  ngAfterViewInit() {
1193
1249
  const elements = document.getElementsByClassName('sb-show-icon');
1194
1250
  if (!elements[0].getAttribute('id')) {
1195
- elements[0].setAttribute('type', 'button');
1196
- elements[0].setAttribute('id', 'IPAShareBtn');
1197
- const label = document.createElement('label');
1198
- label.innerHTML = this.btnLabel;
1199
- label.classList.add('sm-share-title');
1200
- label.classList.add('me-1');
1201
- elements[0].before(label);
1251
+ if (!this.isPlatformCodeDesignSystem) {
1252
+ elements[0].setAttribute('type', 'button');
1253
+ elements[0].setAttribute('id', 'IPAShareBtn');
1254
+ const label = document.createElement('label');
1255
+ label.innerHTML = this.btnLabel;
1256
+ label.classList.add('sm-share-title');
1257
+ label.classList.add('me-1');
1258
+ elements[0].before(label);
1259
+ }
1260
+ else {
1261
+ elements[0].setAttribute('type', 'button');
1262
+ elements[0].innerHTML = this.btnLabel;
1263
+ elements[0].classList.add('mb-2', 'tp-link');
1264
+ const img = document.createElement('img');
1265
+ img.src =
1266
+ '/_catalogs/masterpage/ar-sa/CPS/assets/img/internal/share-08.svg';
1267
+ img.classList.add('link-text-icon');
1268
+ elements[0].appendChild(img);
1269
+ }
1202
1270
  }
1203
1271
  }
1204
1272
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ShareButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1205
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ShareButtonComponent, isStandalone: false, selector: "ipa-share-button", inputs: { title: "title", description: "description", btnLabel: "btnLabel" }, ngImport: i0, template: "<share-popup-button [title]=\"title\" [description]=\"description\" [icon]=\"'share-alt'\"\r\n [include]=\"['facebook','twitter','linkedin','telegram','whatsapp','copy']\">\r\n</share-popup-button>", styles: [""], dependencies: [{ kind: "component", 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"] }] }); }
1273
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.15", type: ShareButtonComponent, isStandalone: false, selector: "ipa-share-button", inputs: { title: "title", description: "description", btnLabel: "btnLabel", isPlatformCodeDesignSystem: "isPlatformCodeDesignSystem" }, ngImport: i0, template: "<share-popup-button [title]=\"title\" [description]=\"description\" [icon]=\"'share-alt'\"\r\n [include]=\"['facebook','twitter','linkedin','telegram','whatsapp','copy']\">\r\n</share-popup-button>", styles: [""], dependencies: [{ kind: "component", 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"] }] }); }
1206
1274
  }
1207
1275
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ShareButtonComponent, decorators: [{
1208
1276
  type: Component,
@@ -1213,6 +1281,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
1213
1281
  type: Input
1214
1282
  }], btnLabel: [{
1215
1283
  type: Input
1284
+ }], isPlatformCodeDesignSystem: [{
1285
+ type: Input
1216
1286
  }] } });
1217
1287
 
1218
1288
  class ShareButtonModule {
@@ -1571,6 +1641,10 @@ class AuthService {
1571
1641
  }
1572
1642
  setCurrentUser() {
1573
1643
  const decodedToken = this.getDecodedToken();
1644
+ if (!decodedToken) {
1645
+ this.currentUser.next({ exp: 0 });
1646
+ return;
1647
+ }
1574
1648
  this.currentUser.next({
1575
1649
  nameid: decodedToken.nameid,
1576
1650
  email: decodedToken.email,
@@ -1586,6 +1660,10 @@ class AuthService {
1586
1660
  }
1587
1661
  setCurrentUserFromHidden() {
1588
1662
  const decodedToken = this.getDecodedTokenFromHidden();
1663
+ if (!decodedToken) {
1664
+ this.currentUser.next({ exp: 0 });
1665
+ return;
1666
+ }
1589
1667
  this.currentUser.next({
1590
1668
  nameid: decodedToken.nameid?.split('\\')[1],
1591
1669
  email: decodedToken.email,
@@ -1597,6 +1675,9 @@ class AuthService {
1597
1675
  this.currentUserUrl = url;
1598
1676
  }
1599
1677
  decodeJwt(token) {
1678
+ if (!token || token === 'null' || token === 'undefined') {
1679
+ return null;
1680
+ }
1600
1681
  const base64Url = token.split('.')[1];
1601
1682
  const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
1602
1683
  const jsonPayload = decodeURIComponent(atob(base64)
@@ -1893,6 +1974,165 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
1893
1974
  }]
1894
1975
  }], ctorParameters: () => [] });
1895
1976
 
1977
+ class BreadcrumbsV2Service {
1978
+ constructor() { }
1979
+ setPageTitle(text) {
1980
+ const titleEl = document.querySelector('.page-title .container');
1981
+ if (titleEl) {
1982
+ titleEl.textContent = text;
1983
+ }
1984
+ }
1985
+ addBreadcrumb(nodeName, imgClasses = 'path_arrow', linkClasses = 'path-item') {
1986
+ const elements = document
1987
+ .getElementById('path')
1988
+ ?.querySelector('.container')?.children;
1989
+ //get last child
1990
+ const lastIndex = elements?.item(elements.length - 1);
1991
+ const innerHTML = lastIndex.innerHTML;
1992
+ //add new link
1993
+ const link = this.createLink(innerHTML, location.pathname, linkClasses);
1994
+ //add arrow img
1995
+ const arrowImg = this.createImg(imgClasses);
1996
+ //add new span
1997
+ const newSpan = this.createSpan(nodeName);
1998
+ lastIndex.after(link, arrowImg, newSpan);
1999
+ lastIndex.remove();
2000
+ }
2001
+ addBreadcrumbList(nodeList, imgClasses = 'path_arrow', linkClasses = 'path-item') {
2002
+ const elements = document
2003
+ .getElementById('path')
2004
+ ?.querySelector('.container')?.children;
2005
+ //get last child
2006
+ const lastIndex = elements?.item(elements.length - 1);
2007
+ const innerHTML = lastIndex.innerHTML;
2008
+ lastIndex.innerHTML = '';
2009
+ //add new link
2010
+ const link = this.createLink(innerHTML, location.pathname, linkClasses);
2011
+ //add arrow img
2012
+ const arrowImg = this.createImg(imgClasses);
2013
+ lastIndex.after(link, arrowImg);
2014
+ lastIndex.remove();
2015
+ for (let i = 0; i < nodeList.length; i++) {
2016
+ const lastIndex = elements?.item(elements.length - 1);
2017
+ if (nodeList[i].nodeUrl) {
2018
+ const newSpan = document.createElement('span');
2019
+ //add new link
2020
+ const link = this.createLink(nodeList[i].nodeName, nodeList[i].nodeUrl, linkClasses);
2021
+ //add arrow img
2022
+ const arrowImg = this.createImg(imgClasses);
2023
+ lastIndex.after(link, arrowImg);
2024
+ }
2025
+ else {
2026
+ const newSpan = this.createSpan(nodeList[i].nodeName);
2027
+ lastIndex.after(newSpan);
2028
+ }
2029
+ }
2030
+ }
2031
+ createBreadcrumbs(nodeList, imgClasses = 'path_arrow', linkClasses = 'path-item') {
2032
+ const currentDiv = document.getElementById('path')?.querySelector('.container');
2033
+ currentDiv.innerHTML = '';
2034
+ //add first link
2035
+ const firstLink = this.createLink(nodeList[0].nodeName, nodeList[0].nodeUrl, linkClasses);
2036
+ currentDiv.appendChild(firstLink);
2037
+ //add arrow img
2038
+ const firstArrowImg = this.createImg(imgClasses);
2039
+ currentDiv.appendChild(firstArrowImg);
2040
+ //add rest of nodes
2041
+ for (let i = 1; i < nodeList.length; i++) {
2042
+ if (nodeList[i].nodeUrl) {
2043
+ //add new link
2044
+ const link = this.createLink(nodeList[i].nodeName, nodeList[i].nodeUrl, linkClasses);
2045
+ //add arrow img
2046
+ const arrowImg = this.createImg(imgClasses);
2047
+ currentDiv.appendChild(link);
2048
+ currentDiv.appendChild(arrowImg);
2049
+ }
2050
+ else {
2051
+ //add last span
2052
+ const span = this.createSpan(nodeList[i].nodeName);
2053
+ currentDiv.appendChild(span);
2054
+ }
2055
+ }
2056
+ }
2057
+ removeLastBreadcrumb() {
2058
+ const elements = document
2059
+ .getElementById('path')
2060
+ ?.querySelector('.container')?.children;
2061
+ elements?.item(elements.length - 1)?.remove();
2062
+ elements?.item(elements.length - 1)?.remove();
2063
+ this.setCurrentNode(elements);
2064
+ }
2065
+ removeBreadcrumbByNodeName(nodeName) {
2066
+ const elements = document
2067
+ .getElementById('path')
2068
+ ?.querySelector('.container')?.children;
2069
+ let index = -1;
2070
+ for (let i = 0; i < elements?.length; i++) {
2071
+ const span = elements?.item(i);
2072
+ if (span?.textContent?.trim() === nodeName) {
2073
+ index = i;
2074
+ break;
2075
+ }
2076
+ }
2077
+ const lastNode = elements?.length - 1 === index;
2078
+ if (index !== -1 && !lastNode) {
2079
+ elements?.item(index)?.remove();
2080
+ elements?.item(index)?.remove();
2081
+ }
2082
+ else {
2083
+ elements?.item(index)?.remove();
2084
+ elements?.item(index - 1)?.remove();
2085
+ }
2086
+ if (lastNode) {
2087
+ this.setCurrentNode(elements);
2088
+ }
2089
+ }
2090
+ removeLastBreadcrumbsByLength(length) {
2091
+ const elements = document
2092
+ .getElementById('path')
2093
+ ?.querySelector('.container')?.children;
2094
+ while (length > 0) {
2095
+ elements?.item(elements.length - 1)?.remove();
2096
+ elements?.item(elements.length - 1)?.remove();
2097
+ length--;
2098
+ }
2099
+ if (elements?.length > 0) {
2100
+ this.setCurrentNode(elements);
2101
+ }
2102
+ }
2103
+ createLink(innerHTML, href, classes) {
2104
+ const link = document.createElement('a');
2105
+ link.innerHTML = ' ' + innerHTML;
2106
+ link.href = href ?? '';
2107
+ link.classList.add(...[classes]);
2108
+ return link;
2109
+ }
2110
+ createSpan(innerHTML) {
2111
+ const span = document.createElement('span');
2112
+ span.innerHTML = ' ' + innerHTML;
2113
+ return span;
2114
+ }
2115
+ createImg(classes, src = 'https://newportal.ipa.edu.sa/_catalogs/masterpage/ar-sa/CPS/assets/img/internal/path.svg') {
2116
+ const img = document.createElement('img');
2117
+ img.src = src;
2118
+ img.classList.add(...[classes]);
2119
+ return img;
2120
+ }
2121
+ setCurrentNode(spans) {
2122
+ const lastSpan = spans?.item(spans.length - 1);
2123
+ const span = this.createSpan(lastSpan.innerHTML);
2124
+ lastSpan.replaceWith(span);
2125
+ }
2126
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbsV2Service, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
2127
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbsV2Service, providedIn: 'root' }); }
2128
+ }
2129
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: BreadcrumbsV2Service, decorators: [{
2130
+ type: Injectable,
2131
+ args: [{
2132
+ providedIn: 'root',
2133
+ }]
2134
+ }], ctorParameters: () => [] });
2135
+
1896
2136
  /*
1897
2137
  * Public API Surface of ipa-library
1898
2138
  */
@@ -1902,5 +2142,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
1902
2142
  * Generated bundle index. Do not edit.
1903
2143
  */
1904
2144
 
1905
- export { AuthService, BreadcrumbsService, CommonService, DropdownInputComponent, ErrorInterceptor, ErrorService, FileUploadComponent, GenerateFormComponent, GregorianDatepickerComponent, HijriDatePipe, HijriDatepickerComponent, IPAFormService, LoaderComponent, LoaderService, LoadingInterceptor, NgIPALibraryModule, PipesModule, RecaptchaComponent, ShareButtonComponent, ShareButtonModule, TextInputComponent, TextareaInputComponent, TokenInterceptor, TokenService, myIPATokenInterceptor };
2145
+ export { AuthService, BreadcrumbsService, BreadcrumbsV2Service, CommonService, DropdownInputComponent, ErrorInterceptor, ErrorService, FileUploadComponent, GenerateFormComponent, GregorianDatepickerComponent, HijriDatePipe, HijriDatepickerComponent, IPAFormService, LoaderComponent, LoaderService, LoadingInterceptor, NgIPALibraryModule, PipesModule, RecaptchaComponent, ShareButtonComponent, ShareButtonModule, TextInputComponent, TextareaInputComponent, TokenInterceptor, TokenService, myIPATokenInterceptor };
1906
2146
  //# sourceMappingURL=ng-ipa-library.mjs.map