nuxeo-development-framework 5.4.6 → 5.4.8

package/bundles/nuxeo-development-framework.umd.js

@@ -2477,11 +2477,12 @@
           }
       };
       NdfNuxeoDialog.prototype.isArrowFunction = function (fn) {
-          var strFn = fn.toString();
-          var firstIndex = strFn.indexOf(')');
-          var lastIndex = strFn.indexOf('{') + 1;
-          var target = strFn.substring(firstIndex, lastIndex).replace(' ', '');
-          return lastIndex == 0 || target.includes('=>');
+          // const strFn = fn.toString();
+          // const firstIndex = strFn.indexOf(')');
+          // const lastIndex = strFn.indexOf('{') + 1;
+          // const target = strFn.substring(firstIndex, lastIndex).replace(' ', '');
+          // return lastIndex == 0 || target.includes('=>');
+          return true;
       };
       NdfNuxeoDialog.prototype.onClose = function () {
           this.dialogRef.close();
@@ -6322,6 +6323,7 @@
           this.vocabularyType = '';
           this.cacheable = true;
           this.shwoAllValues = true;
+          this.emitVocabulryRecordOnSelect = false;
           /** Event emitted on value is selected */
           this.onSelecting = new i0.EventEmitter();
           this.loading = false;
@@ -6380,7 +6382,8 @@
       };
       DynamicFormVocabularyItemComponent.prototype.getSelecteditems = function (selectedItems) {
           this.propagateChange(this.selection);
-          this.onSelecting.emit(this.selection);
+          var value = this.emitVocabulryRecordOnSelect ? selectedItems : this.selection;
+          this.onSelecting.emit(value);
       };
       DynamicFormVocabularyItemComponent.prototype.writeValue = function (value) {
           // if (value) { removed to allow reseting ui when resetting form
@@ -6412,7 +6415,7 @@
       return DynamicFormVocabularyItemComponent;
   }());
   DynamicFormVocabularyItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DynamicFormVocabularyItemComponent, deps: [{ token: VocabularyApiService }, { token: i0__namespace.ChangeDetectorRef }, { token: i2__namespace$4.NgControl, optional: true, self: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  DynamicFormVocabularyItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: { onlyIds: "onlyIds", bindValue: "bindValue", bindLabel: "bindLabel", placeholder: "placeholder", multiple: "multiple", searchable: "searchable", closeOnSelect: "closeOnSelect", hideSelectedItems: "hideSelectedItems", disabled: "disabled", vocabularyType: "vocabularyType", label: "label", cacheable: "cacheable", shwoAllValues: "shwoAllValues" }, outputs: { onSelecting: "onSelecting" }, viewQueries: [{ propertyName: "DynamicFormSelectItemComponent", first: true, predicate: DynamicFormSelectItemComponent, descendants: true }], ngImport: i0__namespace, template: "<ng-container *ngIf=\"label\">\r\n  <div>\r\n    <label class=\"select-label\"\r\n      >{{ label | translate\r\n      }}<span *ngIf=\"isRequired()\" class=\"text-danger mx-1\">*</span></label\r\n    >\r\n  </div>\r\n</ng-container>\r\n<app-dynamic-form-selectitem\r\n  [voc]=\"true\"\r\n  [vocId]=\"vocabularyType\"\r\n  [data]=\"data\"\r\n  [bindLabel]=\"bindLabel\"\r\n  [bindValue]=\"bindValue\"\r\n  [placeholder]=\"placeholder\"\r\n  [multiple]=\"multiple\"\r\n  [searchable]=\"searchable\"\r\n  [closeOnSelect]=\"closeOnSelect\"\r\n  [disabled]=\"disabled\"\r\n  [hideSelectedItems]=\"hideSelectedItems\"\r\n  [loading]=\"loading\"\r\n  (onSelectItems)=\"getSelecteditems($event)\"\r\n  [(ngModel)]=\"selection\"\r\n></app-dynamic-form-selectitem>\r\n<mat-error\r\n  [attr.data-automation-id]=\"'card-textitem-error-'\"\r\n  class=\"app-textitem-editable-error\"\r\n  *ngIf=\"hasErrors()\"\r\n>\r\n  <ul>\r\n    <li *ngIf=\"control.errors.required\">\r\n      {{ label | translate }} {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n    </li>\r\n  </ul>\r\n</mat-error>\r\n", styles: [""], components: [{ type: DynamicFormSelectItemComponent, selector: "app-dynamic-form-selectitem", inputs: ["label", "bindValue", "bindLabel", "data", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "clear", "voc", "vocId", "loading"], outputs: ["onSelectItems"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$7.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  DynamicFormVocabularyItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: { onlyIds: "onlyIds", bindValue: "bindValue", bindLabel: "bindLabel", placeholder: "placeholder", multiple: "multiple", searchable: "searchable", closeOnSelect: "closeOnSelect", hideSelectedItems: "hideSelectedItems", disabled: "disabled", vocabularyType: "vocabularyType", label: "label", cacheable: "cacheable", shwoAllValues: "shwoAllValues", emitVocabulryRecordOnSelect: "emitVocabulryRecordOnSelect" }, outputs: { onSelecting: "onSelecting" }, viewQueries: [{ propertyName: "DynamicFormSelectItemComponent", first: true, predicate: DynamicFormSelectItemComponent, descendants: true }], ngImport: i0__namespace, template: "<ng-container *ngIf=\"label\">\r\n  <div>\r\n    <label class=\"select-label\"\r\n      >{{ label | translate\r\n      }}<span *ngIf=\"isRequired()\" class=\"text-danger mx-1\">*</span></label\r\n    >\r\n  </div>\r\n</ng-container>\r\n<app-dynamic-form-selectitem\r\n  [voc]=\"true\"\r\n  [vocId]=\"vocabularyType\"\r\n  [data]=\"data\"\r\n  [bindLabel]=\"bindLabel\"\r\n  [bindValue]=\"bindValue\"\r\n  [placeholder]=\"placeholder\"\r\n  [multiple]=\"multiple\"\r\n  [searchable]=\"searchable\"\r\n  [closeOnSelect]=\"closeOnSelect\"\r\n  [disabled]=\"disabled\"\r\n  [hideSelectedItems]=\"hideSelectedItems\"\r\n  [loading]=\"loading\"\r\n  (onSelectItems)=\"getSelecteditems($event)\"\r\n  [(ngModel)]=\"selection\"\r\n></app-dynamic-form-selectitem>\r\n<mat-error\r\n  [attr.data-automation-id]=\"'card-textitem-error-'\"\r\n  class=\"app-textitem-editable-error\"\r\n  *ngIf=\"hasErrors()\"\r\n>\r\n  <ul>\r\n    <li *ngIf=\"control.errors.required\">\r\n      {{ label | translate }} {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n    </li>\r\n  </ul>\r\n</mat-error>\r\n", styles: [""], components: [{ type: DynamicFormSelectItemComponent, selector: "app-dynamic-form-selectitem", inputs: ["label", "bindValue", "bindLabel", "data", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "clear", "voc", "vocId", "loading"], outputs: ["onSelectItems"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$7.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
   __decorate([
       tsCacheable.Cacheable({
           maxCacheCount: 1000,
@@ -6463,6 +6466,8 @@
                   type: i0.Input
               }], shwoAllValues: [{
                   type: i0.Input
+              }], emitVocabulryRecordOnSelect: [{
+                  type: i0.Input
               }], onSelecting: [{
                   type: i0.Output
               }], getCacheableVocabularyList: [] } });
@@ -6588,7 +6593,7 @@
       return CorrespondenceRelationCreateFormComponent;
   }());
   CorrespondenceRelationCreateFormComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CorrespondenceRelationCreateFormComponent, deps: [{ token: i2__namespace$4.FormBuilder }, { token: CorrespondenceRelationService }, { token: CustomToastrService }, { token: i1__namespace$3.MatDialogRef }, { token: i1$4.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  CorrespondenceRelationCreateFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CorrespondenceRelationCreateFormComponent, selector: "cts-correspondence-relation-create-form", viewQueries: [{ propertyName: "auto", first: true, predicate: ["auto"], descendants: true }], ngImport: i0__namespace, template: "<div\r\n  class=\"correspondence-relation-container\"\r\n  SetDirRtl\r\n  style=\"height: 80%; width: 100%\"\r\n>\r\n  <div class=\"correspondence-relation-title\">\r\n    {{ \"correspondence-relation.add\" | translate }}\r\n  </div>\r\n  <!-- <mat-divider></mat-divider> -->\r\n  <div mat-dialog-content [formGroup]=\"createform\">\r\n    <div class=\"vocabulary-list\">\r\n      <app-dynamic-form-vocabulary-item\r\n        [label]=\"'correspondence-relation.relation-type'\"\r\n        [bindLabel]=\"'label'\"\r\n        [bindValue]=\"'id'\"\r\n        placeholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n        [multiple]=\"false\"\r\n        [searchable]=\"false\"\r\n        [closeOnSelect]=\"true\"\r\n        [hideSelectedItems]=\"false\"\r\n        [vocabularyType]=\"'VOC_CorrespondenceRelationsNames'\"\r\n        formControlName=\"relationname\"\r\n        (onSelecting)=\"reset()\"\r\n      >\r\n      </app-dynamic-form-vocabulary-item>\r\n    </div>\r\n\r\n    <div class=\"search-container\" *ngIf=\"createform.value.relationname\">\r\n      <ng-autocomplete\r\n        #auto\r\n        [data]=\"documentList\"\r\n        [searchKeyword]=\"'filter'\"\r\n        (selected)=\"selectItem($event)\"\r\n        (inputChanged)=\"onSearchInputChange($event)\"\r\n        [customFilter]=\"disableFilter\"\r\n        (closed)=\"keep_Autocomplete_Results_Open()\"\r\n        [itemTemplate]=\"itemTemplate\"\r\n        [notFoundTemplate]=\"notFoundTemplate\"\r\n        [placeholder]=\"'correspondence-relation.searchby' | translate\"\r\n        [debounceTime]=\"1000\"\r\n        [isLoading]=\"isLoading\"\r\n        (inputCleared)=\"inputCleared()\"\r\n      >\r\n      </ng-autocomplete>\r\n\r\n      <ng-template #itemTemplate let-item>\r\n        <div class=\"item\">\r\n          <span>{{ item.title }}</span>\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #notFoundTemplate>\r\n        <div>{{ \"correspondence-relation.notfound\" | translate }}</div>\r\n      </ng-template>\r\n\r\n      <div class=\"chip-list\" *ngIf=\"related_corr.length > 0\">\r\n        <mat-chip-list #chipList aria-label=\"corr selection\">\r\n          <mat-chip\r\n            *ngFor=\"let corr of related_corr\"\r\n            [selectable]=\"selectable\"\r\n            [removable]=\"removable\"\r\n            (removed)=\"on_remove_relation_Chip(corr)\"\r\n          >\r\n            {{ corr.title }}\r\n            <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"exist-relation\" *ngIf=\"exist\">\r\n        <span> {{ \"correspondence-relation.exist\" | translate }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"button-group d-flex flex-row-reverse\">\r\n    <cts-button\r\n      [theme]=\"'danger'\"\r\n      size=\"'regular'\"\r\n      [loading]=\"saving\"\r\n      class=\"voc-form-close\"\r\n      mat-dialog-close\r\n    >\r\n      {{ \"BUTTONS.CLOSE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      (onClick)=\"onSaveClick()\"\r\n      [theme]=\"'primary'\"\r\n      size=\"'regular'\"\r\n      [disabled]=\"\r\n        !this.createform.controls.relationname.valid || related_corr.length == 0\r\n      \"\r\n    >\r\n      {{ \"correspondence-relation.save\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.correspondence-relation-container{padding:20px}.correspondence-relation-container .correspondence-relation-title{margin-bottom:8px;font-size:20px;color:#465573}.correspondence-relation-container .mat-dialog-content{height:100%;width:100%}.correspondence-relation-container .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.correspondence-relation-container .button-group cts-button{width:16%}@media (max-width: 992px){.correspondence-relation-container .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.correspondence-relation-container .button-group cts-button{width:28%}}.correspondence-relation-container .item{margin:1px;padding:8px 10px;font-size:.75rem}.correspondence-relation-container .dialog-actions button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:70px;border-radius:3px}.correspondence-relation-container .dialog-actions button:disabled{opacity:.4;cursor:not-allowed}.correspondence-relation-container .dialog-actions button:hover{opacity:.7}.correspondence-relation-container .autocomplete-container .suggestions-container ul{max-height:150px!important}.correspondence-relation-container .autocomplete-container .suggestions-container{height:150px!important;margin-top:10px;max-height:150px!important;border:1px lightgray solid!important;box-shadow:none!important}.correspondence-relation-container .search-container{position:relative}.correspondence-relation-container .chip-list{max-height:150px;border:1px lightgray solid;overflow:scroll;padding:10px;margin-bottom:10px;top:215px;position:absolute;width:100%}.correspondence-relation-container .chip-list .mat-standard-chip{border-radius:5px!important}.correspondence-relation-container .chip-list .mat-chip.mat-standard-chip{background-color:#8f98aa1a!important;height:auto}.correspondence-relation-container .autocomplete-container{box-shadow:none!important}.correspondence-relation-container .autocomplete-container .input-container input{background-color:#8f98aa1a!important;padding:10px!important}.correspondence-relation-container .exist-relation{background-color:#f8d7da!important;color:#842029!important;border-color:#f5c2c7!important;position:absolute;width:100%;top:300px}.correspondence-relation-container .autocomplete-container .suggestions-container .complete-selected,.correspondence-relation-container .autocomplete-container .suggestions-container ul li:hover{background-color:#8f98aa1a!important}.correspondence-relation-container .vocabulary-list{margin-bottom:10px}.correspondence-relation-container .vocabulary-list .mat-error{display:none!important}.correspondence-relation-container .mat-dialog-content{margin:3px 0 0!important;padding:0!important}[dir=rtl] .input-container input{direction:rtl}[dir=rtl] .x{left:10px;right:auto!important}\n"], components: [{ type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: i6__namespace.AutocompleteComponent, selector: "ng-autocomplete", inputs: ["data", "searchKeyword", "placeholder", "heading", "initialValue", "historyIdentifier", "historyHeading", "historyListMaxNumber", "notFoundText", "isLoading", "debounceTime", "disabled", "minQueryLength", "focusFirst", "customFilter", "selectedValueRender", "itemTemplate", "notFoundTemplate"], outputs: ["selected", "inputChanged", "inputFocused", "inputCleared", "opened", "closed", "scrolledToEnd"] }, { type: i7__namespace$1.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }], directives: [{ type: SetDirRtlDirective, selector: "[SetDirRtl]" }, { type: i1__namespace$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i7__namespace$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i1__namespace$3.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  CorrespondenceRelationCreateFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CorrespondenceRelationCreateFormComponent, selector: "cts-correspondence-relation-create-form", viewQueries: [{ propertyName: "auto", first: true, predicate: ["auto"], descendants: true }], ngImport: i0__namespace, template: "<div\r\n  class=\"correspondence-relation-container\"\r\n  SetDirRtl\r\n  style=\"height: 80%; width: 100%\"\r\n>\r\n  <div class=\"correspondence-relation-title\">\r\n    {{ \"correspondence-relation.add\" | translate }}\r\n  </div>\r\n  <!-- <mat-divider></mat-divider> -->\r\n  <div mat-dialog-content [formGroup]=\"createform\">\r\n    <div class=\"vocabulary-list\">\r\n      <app-dynamic-form-vocabulary-item\r\n        [label]=\"'correspondence-relation.relation-type'\"\r\n        [bindLabel]=\"'label'\"\r\n        [bindValue]=\"'id'\"\r\n        placeholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n        [multiple]=\"false\"\r\n        [searchable]=\"false\"\r\n        [closeOnSelect]=\"true\"\r\n        [hideSelectedItems]=\"false\"\r\n        [vocabularyType]=\"'VOC_CorrespondenceRelationsNames'\"\r\n        formControlName=\"relationname\"\r\n        (onSelecting)=\"reset()\"\r\n      >\r\n      </app-dynamic-form-vocabulary-item>\r\n    </div>\r\n\r\n    <div class=\"search-container\" *ngIf=\"createform.value.relationname\">\r\n      <ng-autocomplete\r\n        #auto\r\n        [data]=\"documentList\"\r\n        [searchKeyword]=\"'filter'\"\r\n        (selected)=\"selectItem($event)\"\r\n        (inputChanged)=\"onSearchInputChange($event)\"\r\n        [customFilter]=\"disableFilter\"\r\n        (closed)=\"keep_Autocomplete_Results_Open()\"\r\n        [itemTemplate]=\"itemTemplate\"\r\n        [notFoundTemplate]=\"notFoundTemplate\"\r\n        [placeholder]=\"'correspondence-relation.searchby' | translate\"\r\n        [debounceTime]=\"1000\"\r\n        [isLoading]=\"isLoading\"\r\n        (inputCleared)=\"inputCleared()\"\r\n      >\r\n      </ng-autocomplete>\r\n\r\n      <ng-template #itemTemplate let-item>\r\n        <div class=\"item\">\r\n          <span>{{ item.title }}</span>\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #notFoundTemplate>\r\n        <div>{{ \"correspondence-relation.notfound\" | translate }}</div>\r\n      </ng-template>\r\n\r\n      <div class=\"chip-list\" *ngIf=\"related_corr.length > 0\">\r\n        <mat-chip-list #chipList aria-label=\"corr selection\">\r\n          <mat-chip\r\n            *ngFor=\"let corr of related_corr\"\r\n            [selectable]=\"selectable\"\r\n            [removable]=\"removable\"\r\n            (removed)=\"on_remove_relation_Chip(corr)\"\r\n          >\r\n            {{ corr.title }}\r\n            <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"exist-relation\" *ngIf=\"exist\">\r\n        <span> {{ \"correspondence-relation.exist\" | translate }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"button-group d-flex flex-row-reverse\">\r\n    <cts-button\r\n      [theme]=\"'danger'\"\r\n      size=\"'regular'\"\r\n      [loading]=\"saving\"\r\n      class=\"voc-form-close\"\r\n      mat-dialog-close\r\n    >\r\n      {{ \"BUTTONS.CLOSE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      (onClick)=\"onSaveClick()\"\r\n      [theme]=\"'primary'\"\r\n      size=\"'regular'\"\r\n      [disabled]=\"\r\n        !this.createform.controls.relationname.valid || related_corr.length == 0\r\n      \"\r\n    >\r\n      {{ \"correspondence-relation.save\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.correspondence-relation-container{padding:20px}.correspondence-relation-container .correspondence-relation-title{margin-bottom:8px;font-size:20px;color:#465573}.correspondence-relation-container .mat-dialog-content{height:100%;width:100%}.correspondence-relation-container .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.correspondence-relation-container .button-group cts-button{width:16%}@media (max-width: 992px){.correspondence-relation-container .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.correspondence-relation-container .button-group cts-button{width:28%}}.correspondence-relation-container .item{margin:1px;padding:8px 10px;font-size:.75rem}.correspondence-relation-container .dialog-actions button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:70px;border-radius:3px}.correspondence-relation-container .dialog-actions button:disabled{opacity:.4;cursor:not-allowed}.correspondence-relation-container .dialog-actions button:hover{opacity:.7}.correspondence-relation-container .autocomplete-container .suggestions-container ul{max-height:150px!important}.correspondence-relation-container .autocomplete-container .suggestions-container{height:150px!important;margin-top:10px;max-height:150px!important;border:1px lightgray solid!important;box-shadow:none!important}.correspondence-relation-container .search-container{position:relative}.correspondence-relation-container .chip-list{max-height:150px;border:1px lightgray solid;overflow:scroll;padding:10px;margin-bottom:10px;top:215px;position:absolute;width:100%}.correspondence-relation-container .chip-list .mat-standard-chip{border-radius:5px!important}.correspondence-relation-container .chip-list .mat-chip.mat-standard-chip{background-color:#8f98aa1a!important;height:auto}.correspondence-relation-container .autocomplete-container{box-shadow:none!important}.correspondence-relation-container .autocomplete-container .input-container input{background-color:#8f98aa1a!important;padding:10px!important}.correspondence-relation-container .exist-relation{background-color:#f8d7da!important;color:#842029!important;border-color:#f5c2c7!important;position:absolute;width:100%;top:300px}.correspondence-relation-container .autocomplete-container .suggestions-container .complete-selected,.correspondence-relation-container .autocomplete-container .suggestions-container ul li:hover{background-color:#8f98aa1a!important}.correspondence-relation-container .vocabulary-list{margin-bottom:10px}.correspondence-relation-container .vocabulary-list .mat-error{display:none!important}.correspondence-relation-container .mat-dialog-content{margin:3px 0 0!important;padding:0!important}[dir=rtl] .input-container input{direction:rtl}[dir=rtl] .x{left:10px;right:auto!important}\n"], components: [{ type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: i6__namespace.AutocompleteComponent, selector: "ng-autocomplete", inputs: ["data", "searchKeyword", "placeholder", "heading", "initialValue", "historyIdentifier", "historyHeading", "historyListMaxNumber", "notFoundText", "isLoading", "debounceTime", "disabled", "minQueryLength", "focusFirst", "customFilter", "selectedValueRender", "itemTemplate", "notFoundTemplate"], outputs: ["selected", "inputChanged", "inputFocused", "inputCleared", "opened", "closed", "scrolledToEnd"] }, { type: i7__namespace$1.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }], directives: [{ type: SetDirRtlDirective, selector: "[SetDirRtl]" }, { type: i1__namespace$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i7__namespace$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i1__namespace$3.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CorrespondenceRelationCreateFormComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -6863,11 +6868,35 @@
               throw err;
           }));
       };
-      DocumentsService.prototype.uploadBatch = function (files) {
+      DocumentsService.prototype.uploadBatch = function (files, extraHeaders) {
           var _this = this;
+          if (extraHeaders === void 0) { extraHeaders = {}; }
           return rxjs.combineLatest(__spreadArray([], __read(files.map(function (file) {
               var nuxeoBlob = _this.nuxeoService.createBlob(file);
-              return rxjs.from(_this.nuxeoService.nuxeoClient.batchUpload().upload(nuxeoBlob));
+              var fileName = file.name;
+              var batch = _this.nuxeoService.nuxeoClient.batchUpload();
+              if (Object.keys(extraHeaders).length != 0) {
+                  return rxjs.from(batch.upload(nuxeoBlob).then(function (uploaded) {
+                      // Custom reupload with headers
+                      var formData = new FormData();
+                      var namedFile = new File([nuxeoBlob.content], fileName, {
+                          type: nuxeoBlob.content.type,
+                      });
+                      formData.append('file', namedFile);
+                      return _this.nuxeoService.nuxeoClient._http({
+                          method: 'POST',
+                          url: _this.environment.nuxeo + "/api/v1/upload/" + uploaded.batch._batchId + "/" + uploaded.blob.fileIdx,
+                          body: formData,
+                          headers: Object.assign(Object.assign({}, extraHeaders), { 'X-File-Name': file.name, 'X-File-Type': file.type, 'X-Batch-No-Drop': true }),
+                      }).then(function () { return ({
+                          batchId: uploaded.batch._batchId,
+                          fileIdx: uploaded.blob.fileIdx,
+                      }); });
+                  }));
+              }
+              else {
+                  return rxjs.from(_this.nuxeoService.nuxeoClient.batchUpload().upload(nuxeoBlob));
+              }
           })))).pipe(operators.map(function (uploadedFiles) {
               files.forEach(function (file, i) {
                   uploadedFiles[i].title = file.name;
@@ -10455,7 +10484,7 @@
       return DepartmentFormComponent;
   }(BaseDialogComponent));
   DepartmentFormComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DepartmentFormComponent, deps: [{ token: i1$4.MAT_DIALOG_DATA }, { token: i1__namespace$3.MatDialogRef }, { token: CustomToastrService }, { token: DepartmentApiService }, { token: i0__namespace.Injector }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  DepartmentFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DepartmentFormComponent, selector: "cts-department-form", usesInheritance: true, ngImport: i0__namespace, template: "<ndf-nuxeo-dialog\r\n\tdialogTitle=\"{{\r\n\t\t'department_management.form.' + (updateMode ? 'updateHeader' : 'header')\r\n\t\t\t| translate\r\n\t}}\"\r\n\tpanelClass=\"voc-form\"\r\n>\r\n\t<ng-template #contentTemplate>\r\n\t\t<form [formGroup]=\"departmentForm\" class=\"row voc-form-body\">\r\n\t\t\t<div class=\"col-lg-6 col-12\">\r\n\t\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\t\tformControlName=\"title\"\r\n\t\t\t\t\t[label]=\"'department_management.form.title'\"\r\n\t\t\t\t\t[disabled]=\"updateMode\"\r\n\t\t\t\t\t[preventSpace]=\"true\"\r\n\t\t\t\t></app-dynamic-form-textitem>\r\n\t\t\t\t<div class=\"hint-msg\">\r\n\t\t\t\t\t{{ 'department_management.form.hintMsg' | translate }}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\tformControlName=\"arabicName\"\r\n\t\t\t\t[label]=\"'department_management.form.ArabicName'\"\r\n\t\t\t></app-dynamic-form-textitem>\r\n\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\tformControlName=\"englishName\"\r\n\t\t\t\t[label]=\"'department_management.form.EnglishName'\"\r\n\t\t\t></app-dynamic-form-textitem>\r\n\t\t\t<app-dynamic-form-vocabulary-item\r\n\t\t\t\t*ngIf=\"data.displayDepTypee\"\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\t[label]=\"'department_management.form.deptTypee'\"\r\n\t\t\t\t[bindLabel]=\"'label'\"\r\n\t\t\t\t[bindValue]=\"'id'\"\r\n\t\t\t\tplaceholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n\t\t\t\t[multiple]=\"false\"\r\n\t\t\t\t[searchable]=\"false\"\r\n\t\t\t\t[closeOnSelect]=\"true\"\r\n\t\t\t\t[hideSelectedItems]=\"false\"\r\n\t\t\t\t[vocabularyType]=\"'VOC_DepartmentType'\"\r\n\t\t\t\tformControlName=\"deptTypee\"\r\n\t\t\t>\r\n\t\t\t</app-dynamic-form-vocabulary-item>\r\n\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\tformControlName=\"description\"\r\n\t\t\t\t[label]=\"'department_management.form.Description'\"\r\n\t\t\t></app-dynamic-form-textitem>\r\n\r\n\t\t\t<cts-dynamic-form-slide-toggleitem\r\n\t\t\t\t*ngIf=\"data.displayIsAllowRecExternal\"\r\n\t\t\t\tclass=\"col-lg-6 col-12 isAllowRecExternal\"\r\n\t\t\t\tformControlName=\"isAllowRecExternal\"\r\n\t\t\t\t[label]=\"'department_management.form.isAllowRecExternal'\"\r\n\t\t\t></cts-dynamic-form-slide-toggleitem>\r\n\t\t</form>\r\n\t</ng-template>\r\n\r\n\t<ng-template #actionsTemplate let-dialog=\"dialog\">\r\n\t\t<button\r\n\t\t\t(click)=\"dialog.executeAction(createDocument)\"\r\n\t\t\t[disabled]=\"\r\n\t\t\t\tscannerUploadButton?.disabled ||\r\n\t\t\t\t!selectedFile?.dynamicData.valid ||\r\n\t\t\t\tfileForm.invalid\r\n\t\t\t\"\r\n\t\t\t[ngClass]=\"{\r\n\t\t\t\t'opacity-30 cursor-not-allowed':\r\n\t\t\t\t\tscannerUploadButton?.disabled ||\r\n\t\t\t\t\t!selectedFile?.dynamicData.valid ||\r\n\t\t\t\t\tfileForm.invalid\r\n\t\t\t}\"\r\n\t\t\tclass=\"submission-button\"\r\n\t\t>\r\n\t\t\t{{\r\n\t\t\t\tuploadMangmentService?.scanCreationFailed\r\n\t\t\t\t\t? ('BUTTONS.TRY_AGAIN' | translate)\r\n\t\t\t\t\t: ('BUTTONS.CREATE' | translate)\r\n\t\t\t}}\r\n\t\t</button>\r\n\r\n\t\t<button\r\n\t\t\t*ngIf=\"!updateMode\"\r\n\t\t\t(click)=\"dialog.executeAction(save)\"\r\n\t\t\t[disabled]=\"departmentForm.invalid\"\r\n\t\t\tclass=\"voc-form-submit\"\r\n\t\t>\r\n\t\t\t{{ 'BUTTONS.SAVE' | translate }}\r\n\t\t</button>\r\n\r\n\t\t<button\r\n\t\t\t*ngIf=\"updateMode\"\r\n\t\t\t(click)=\"dialog.executeAction(update)\"\r\n\t\t\t[disabled]=\"departmentForm.invalid\"\r\n\t\t\tclass=\"voc-form-submit\"\r\n\t\t>\r\n\t\t\t{{ 'BUTTONS.UPDATE' | translate }}\r\n\t\t</button>\r\n\t</ng-template>\r\n</ndf-nuxeo-dialog>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.voc-form{padding:20px}.voc-form .hint-msg{font-size:12px;font-style:italic;margin-top:2px;color:#6a768e}.voc-form .voc-form-hedaer{margin-bottom:8px;font-size:20px;color:#465573}.voc-form .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.voc-form .button-group cts-button{width:16%}@media (max-width: 992px){.voc-form .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.voc-form .button-group cts-button{width:28%}}.voc-form .isAllowRecExternal{display:flex;align-items:center;margin-top:26px;overflow:hidden}@media only screen and (max-width: 768px){.voc-form .isAllowRecExternal{font-size:12px}}\n"], components: [{ type: NdfNuxeoDialog, selector: "ndf-nuxeo-dialog", inputs: ["dialogTitle", "subTitle", "panelClass", "loaderMode"] }, { type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }], directives: [{ type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
+  DepartmentFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DepartmentFormComponent, selector: "cts-department-form", usesInheritance: true, ngImport: i0__namespace, template: "<ndf-nuxeo-dialog\r\n\tdialogTitle=\"{{\r\n\t\t'department_management.form.' + (updateMode ? 'updateHeader' : 'header')\r\n\t\t\t| translate\r\n\t}}\"\r\n\tpanelClass=\"voc-form\"\r\n>\r\n\t<ng-template #contentTemplate>\r\n\t\t<form [formGroup]=\"departmentForm\" class=\"row voc-form-body\">\r\n\t\t\t<div class=\"col-lg-6 col-12\">\r\n\t\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\t\tformControlName=\"title\"\r\n\t\t\t\t\t[label]=\"'department_management.form.title'\"\r\n\t\t\t\t\t[disabled]=\"updateMode\"\r\n\t\t\t\t\t[preventSpace]=\"true\"\r\n\t\t\t\t></app-dynamic-form-textitem>\r\n\t\t\t\t<div class=\"hint-msg\">\r\n\t\t\t\t\t{{ 'department_management.form.hintMsg' | translate }}\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\tformControlName=\"arabicName\"\r\n\t\t\t\t[label]=\"'department_management.form.ArabicName'\"\r\n\t\t\t></app-dynamic-form-textitem>\r\n\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\tformControlName=\"englishName\"\r\n\t\t\t\t[label]=\"'department_management.form.EnglishName'\"\r\n\t\t\t></app-dynamic-form-textitem>\r\n\t\t\t<app-dynamic-form-vocabulary-item\r\n\t\t\t\t*ngIf=\"data.displayDepTypee\"\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\t[label]=\"'department_management.form.deptTypee'\"\r\n\t\t\t\t[bindLabel]=\"'label'\"\r\n\t\t\t\t[bindValue]=\"'id'\"\r\n\t\t\t\tplaceholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n\t\t\t\t[multiple]=\"false\"\r\n\t\t\t\t[searchable]=\"false\"\r\n\t\t\t\t[closeOnSelect]=\"true\"\r\n\t\t\t\t[hideSelectedItems]=\"false\"\r\n\t\t\t\t[vocabularyType]=\"'VOC_DepartmentType'\"\r\n\t\t\t\tformControlName=\"deptTypee\"\r\n\t\t\t>\r\n\t\t\t</app-dynamic-form-vocabulary-item>\r\n\t\t\t<app-dynamic-form-textitem\r\n\t\t\t\tclass=\"col-lg-6 col-12\"\r\n\t\t\t\tformControlName=\"description\"\r\n\t\t\t\t[label]=\"'department_management.form.Description'\"\r\n\t\t\t></app-dynamic-form-textitem>\r\n\r\n\t\t\t<cts-dynamic-form-slide-toggleitem\r\n\t\t\t\t*ngIf=\"data.displayIsAllowRecExternal\"\r\n\t\t\t\tclass=\"col-lg-6 col-12 isAllowRecExternal\"\r\n\t\t\t\tformControlName=\"isAllowRecExternal\"\r\n\t\t\t\t[label]=\"'department_management.form.isAllowRecExternal'\"\r\n\t\t\t></cts-dynamic-form-slide-toggleitem>\r\n\t\t</form>\r\n\t</ng-template>\r\n\r\n\t<ng-template #actionsTemplate let-dialog=\"dialog\">\r\n\t\t<button\r\n\t\t\t(click)=\"dialog.executeAction(createDocument)\"\r\n\t\t\t[disabled]=\"\r\n\t\t\t\tscannerUploadButton?.disabled ||\r\n\t\t\t\t!selectedFile?.dynamicData.valid ||\r\n\t\t\t\tfileForm.invalid\r\n\t\t\t\"\r\n\t\t\t[ngClass]=\"{\r\n\t\t\t\t'opacity-30 cursor-not-allowed':\r\n\t\t\t\t\tscannerUploadButton?.disabled ||\r\n\t\t\t\t\t!selectedFile?.dynamicData.valid ||\r\n\t\t\t\t\tfileForm.invalid\r\n\t\t\t}\"\r\n\t\t\tclass=\"submission-button\"\r\n\t\t>\r\n\t\t\t{{\r\n\t\t\t\tuploadMangmentService?.scanCreationFailed\r\n\t\t\t\t\t? ('BUTTONS.TRY_AGAIN' | translate)\r\n\t\t\t\t\t: ('BUTTONS.CREATE' | translate)\r\n\t\t\t}}\r\n\t\t</button>\r\n\r\n\t\t<button\r\n\t\t\t*ngIf=\"!updateMode\"\r\n\t\t\t(click)=\"dialog.executeAction(save)\"\r\n\t\t\t[disabled]=\"departmentForm.invalid\"\r\n\t\t\tclass=\"voc-form-submit\"\r\n\t\t>\r\n\t\t\t{{ 'BUTTONS.SAVE' | translate }}\r\n\t\t</button>\r\n\r\n\t\t<button\r\n\t\t\t*ngIf=\"updateMode\"\r\n\t\t\t(click)=\"dialog.executeAction(update)\"\r\n\t\t\t[disabled]=\"departmentForm.invalid\"\r\n\t\t\tclass=\"voc-form-submit\"\r\n\t\t>\r\n\t\t\t{{ 'BUTTONS.UPDATE' | translate }}\r\n\t\t</button>\r\n\t</ng-template>\r\n</ndf-nuxeo-dialog>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.voc-form{padding:20px}.voc-form .hint-msg{font-size:12px;font-style:italic;margin-top:2px;color:#6a768e}.voc-form .voc-form-hedaer{margin-bottom:8px;font-size:20px;color:#465573}.voc-form .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.voc-form .button-group cts-button{width:16%}@media (max-width: 992px){.voc-form .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.voc-form .button-group cts-button{width:28%}}.voc-form .isAllowRecExternal{display:flex;align-items:center;margin-top:26px;overflow:hidden}@media only screen and (max-width: 768px){.voc-form .isAllowRecExternal{font-size:12px}}\n"], components: [{ type: NdfNuxeoDialog, selector: "ndf-nuxeo-dialog", inputs: ["dialogTitle", "subTitle", "panelClass", "loaderMode"] }, { type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }], directives: [{ type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DepartmentFormComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -13048,7 +13077,7 @@
       return VocabularyWrapperComponent;
   }());
   VocabularyWrapperComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: VocabularyWrapperComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-  VocabularyWrapperComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: VocabularyWrapperComponent, selector: "app-vocabulary-wrapper", inputs: { value: "value", vocId: "vocId", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0__namespace, template: "<app-dynamic-form-vocabulary-item *ngIf=\"vocId\"\r\n[bindLabel]=\"'displayLabel'\"\r\n[bindValue]=\"'id'\"\r\n[(ngModel)]=\"value\"\r\n(onSelecting)=\"executeFunction($event)\"\r\n[vocabularyType]=\"vocId\">\r\n</app-dynamic-form-vocabulary-item>\r\n<!-- <div>\r\n    {{vocId | json}}\r\n</div> -->\r\n", styles: [""], components: [{ type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+  VocabularyWrapperComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: VocabularyWrapperComponent, selector: "app-vocabulary-wrapper", inputs: { value: "value", vocId: "vocId", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0__namespace, template: "<app-dynamic-form-vocabulary-item *ngIf=\"vocId\"\r\n[bindLabel]=\"'displayLabel'\"\r\n[bindValue]=\"'id'\"\r\n[(ngModel)]=\"value\"\r\n(onSelecting)=\"executeFunction($event)\"\r\n[vocabularyType]=\"vocId\">\r\n</app-dynamic-form-vocabulary-item>\r\n<!-- <div>\r\n    {{vocId | json}}\r\n</div> -->\r\n", styles: [""], components: [{ type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: VocabularyWrapperComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -19896,312 +19925,6 @@
                   type: i0.Input
               }] } });
 
-  var BaseField = /** @class */ (function (_super) {
-      __extends(BaseField, _super);
-      function BaseField() {
-          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
-          _this.dynamicComponent = _this.injector.get(DynamicComponentLoaderService);
-          return _this;
-      }
-      BaseField.prototype.writeValue = function (obj) {
-          var _a, _b, _c, _d;
-          this.internalValue = obj;
-          if ((_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.writeValue) {
-              (_d = (_c = this._componentRef) === null || _c === void 0 ? void 0 : _c.instance) === null || _d === void 0 ? void 0 : _d.writeValue(obj);
-          }
-      };
-      BaseField.prototype.validate = function (control) {
-          var _a, _b;
-          if ((_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.validate) {
-              return this._componentRef.instance.validate(control);
-          }
-          else {
-              return null;
-          }
-      };
-      BaseField.prototype.registerOnValidatorChange = function (fn) {
-          var _a, _b;
-          if ((_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.registerOnValidatorChange) {
-              this._componentRef.instance.registerOnValidatorChange(fn);
-          }
-      };
-      BaseField.prototype.ngOnChanges = function (changes) {
-          var _this = this;
-          if (!this._componentRef) {
-              return;
-          }
-          Object.keys(changes).forEach(function (key) {
-              _this._componentRef.instance[key] = changes[key].currentValue;
-          });
-          this._componentRef.changeDetectorRef.markForCheck();
-      };
-      BaseField.prototype.ngOnDestroy = function () {
-          if (this._componentRef) {
-              this._componentRef.destroy();
-          }
-      };
-      BaseField.prototype._prepareValueAccessor = function () {
-          var ngControl = this.injector.get(i2.NgControl);
-          ngControl.valueAccessor = this._componentRef.instance;
-      };
-      return BaseField;
-  }(BaseCustomValueAccessor));
-  BaseField.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BaseField, deps: null, target: i0__namespace.ɵɵFactoryTarget.Directive });
-  BaseField.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: BaseField, inputs: { fieldConfig: "fieldConfig" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["dynamicContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0__namespace });
-  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BaseField, decorators: [{
-              type: i0.Directive
-          }], propDecorators: { container: [{
-                  type: i0.ViewChild,
-                  args: ['dynamicContainer', { read: i0.ViewContainerRef, static: true }]
-              }], fieldConfig: [{
-                  type: i0.Input
-              }] } });
-
-  var PredicateFieldComponent = /** @class */ (function (_super) {
-      __extends(PredicateFieldComponent, _super);
-      function PredicateFieldComponent() {
-          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
-          _this.handlers = {
-              input: _this._prepareField.bind(_this),
-              date: _this._prepareField.bind(_this)
-          };
-          return _this;
-      }
-      PredicateFieldComponent.prototype.ngOnInit = function () {
-          var _a, _b;
-          var componentType = (_b = (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.type;
-          if (componentType) {
-              this._componentRef = this.dynamicComponent.renderComponent(componentType, this.container);
-              this._prepareValueAccessor();
-              this._prepareComponent(componentType);
-          }
-      };
-      PredicateFieldComponent.prototype._prepareComponent = function (type) {
-          var _a, _b;
-          (_b = (_a = this.handlers)[type]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      };
-      PredicateFieldComponent.prototype._prepareField = function () {
-          var instance = this._componentRef.instance;
-          instance.field = this.fieldConfig;
-      };
-      return PredicateFieldComponent;
-  }(BaseField));
-  PredicateFieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PredicateFieldComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  PredicateFieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PredicateFieldComponent, selector: "app-predicate-field", host: { properties: { "class": "'predicate-field' + '  predicate-field__fieldConfig?.render?.type' " } }, providers: [
-          {
-              provide: i2.NG_VALUE_ACCESSOR,
-              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
-              multi: true
-          },
-          {
-              provide: i2.NG_VALIDATORS,
-              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
-              multi: true
-          }
-      ], usesInheritance: true, ngImport: i0__namespace, template: "<field-header *ngIf=\"fieldConfig.label && !fieldConfig.render?.options?.hideLabel\" class=\"predicate-field__label\">{{\r\n\tfieldConfig.label | translate\r\n}}</field-header>\r\n\r\n<ng-container #dynamicContainer></ng-container>\r\n", styles: [".predicate-field{display:var(--pf-display, block);padding-inline:var(--pf-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--pf-padding-block, var(--ff-padding-block, 0));max-width:100%}\n"], components: [{ type: FieldHeaderComponent, selector: "field-header" }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
-  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PredicateFieldComponent, decorators: [{
-              type: i0.Component,
-              args: [{
-                      selector: 'app-predicate-field',
-                      templateUrl: './predicate-field.component.html',
-                      styleUrls: ['./predicate-field.component.scss'],
-                      encapsulation: i0.ViewEncapsulation.None,
-                      providers: [
-                          {
-                              provide: i2.NG_VALUE_ACCESSOR,
-                              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
-                              multi: true
-                          },
-                          {
-                              provide: i2.NG_VALIDATORS,
-                              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
-                              multi: true
-                          }
-                      ],
-                      host: {
-                          '[class]': "'predicate-field' + '  predicate-field__fieldConfig?.render?.type' "
-                      }
-                  }]
-          }] });
-
-  var AggregationFieldComponent = /** @class */ (function (_super) {
-      __extends(AggregationFieldComponent, _super);
-      function AggregationFieldComponent() {
-          var _e;
-          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
-          _this.handlers = (_e = {},
-              _e[AGGREGATION_FIELD_TYPES.dropdown] = _this._prepareField.bind(_this),
-              _e[AGGREGATION_FIELD_TYPES.checkbox] = _this._prepareField.bind(_this),
-              _e[AGGREGATION_FIELD_TYPES.radio] = _this._prepareField.bind(_this),
-              _e[AGGREGATION_FIELD_TYPES.switch] = _this._prepareField.bind(_this),
-              _e[AGGREGATION_FIELD_TYPES.autocomplete] = _this._prepareField.bind(_this),
-              _e[AGGREGATION_FIELD_TYPES.dateList] = _this._prepareField.bind(_this),
-              _e[AGGREGATION_FIELD_TYPES.custom] = _this._prepareField.bind(_this),
-              _e);
-          return _this;
-      }
-      AggregationFieldComponent.prototype.ngOnInit = function () {
-          var _a, _b, _c, _d;
-          var componentType = (_b = (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.type;
-          if (componentType) {
-              this._componentRef = this.dynamicComponent.renderComponent(componentType, this.container);
-              this._prepareValueAccessor();
-              (_d = (_c = this.handlers)[componentType]) === null || _d === void 0 ? void 0 : _d.call(_c);
-          }
-      };
-      AggregationFieldComponent.prototype._prepareField = function () {
-          var instance = this._componentRef
-              .instance;
-          instance.aggregation = this.aggregation;
-          instance.fieldConfig = this.fieldConfig;
-          if (this.contentTemplate) {
-              instance.contentTemplate = this.contentTemplate;
-          }
-      };
-      return AggregationFieldComponent;
-  }(BaseField));
-  AggregationFieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AggregationFieldComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  AggregationFieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AggregationFieldComponent, selector: "app-aggregation-field", inputs: { aggregation: "aggregation", contentTemplate: "contentTemplate" }, host: { properties: { "class": "'aggregation-field' + '  aggregation-field__fieldConfig?.render?.type' " } }, providers: [
-          {
-              provide: i2.NG_VALUE_ACCESSOR,
-              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
-              multi: true,
-          },
-          {
-              provide: i2.NG_VALIDATORS,
-              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
-              multi: true,
-          },
-      ], usesInheritance: true, ngImport: i0__namespace, template: '<ng-container #dynamicContainer></ng-container>', isInline: true, styles: [""], encapsulation: i0__namespace.ViewEncapsulation.None });
-  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AggregationFieldComponent, decorators: [{
-              type: i0.Component,
-              args: [{
-                      selector: 'app-aggregation-field',
-                      template: '<ng-container #dynamicContainer></ng-container>',
-                      styles: [''],
-                      encapsulation: i0.ViewEncapsulation.None,
-                      providers: [
-                          {
-                              provide: i2.NG_VALUE_ACCESSOR,
-                              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
-                              multi: true,
-                          },
-                          {
-                              provide: i2.NG_VALIDATORS,
-                              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
-                              multi: true,
-                          },
-                      ],
-                      host: {
-                          '[class]': "'aggregation-field' + '  aggregation-field__fieldConfig?.render?.type' ",
-                      },
-                  }]
-          }], propDecorators: { aggregation: [{
-                  type: i0.Input
-              }], contentTemplate: [{
-                  type: i0.Input
-              }] } });
-
-  var CustomFieldComponent = /** @class */ (function (_super) {
-      __extends(CustomFieldComponent, _super);
-      function CustomFieldComponent() {
-          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
-          _this.handlers = {
-              activeUser: _this._prepareField.bind(_this),
-              aggregationGroup: _this._prepareField.bind(_this)
-          };
-          return _this;
-      }
-      CustomFieldComponent.prototype.ngOnInit = function () {
-          var _a, _b;
-          var componentType = (_b = (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.type;
-          if (componentType) {
-              this._componentRef = this.dynamicComponent.renderComponent(componentType, this.container);
-              this._prepareValueAccessor();
-              this._prepareComponent(componentType);
-          }
-      };
-      CustomFieldComponent.prototype._prepareComponent = function (type) {
-          var _a, _b;
-          (_b = (_a = this.handlers)[type]) === null || _b === void 0 ? void 0 : _b.call(_a);
-      };
-      CustomFieldComponent.prototype._prepareField = function () {
-          var instance = this._componentRef.instance;
-          instance.field = this.fieldConfig;
-          instance.aggregations = this.aggregations;
-      };
-      return CustomFieldComponent;
-  }(BaseField));
-  CustomFieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomFieldComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  CustomFieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CustomFieldComponent, selector: "app-custom-field", inputs: { aggregations: "aggregations" }, host: { properties: { "class": "'custom-field' + '  custom-field__fieldConfig?.render?.type' " } }, providers: [
-          {
-              provide: i2.NG_VALUE_ACCESSOR,
-              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
-              multi: true
-          },
-          {
-              provide: i2.NG_VALIDATORS,
-              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
-              multi: true
-          }
-      ], usesInheritance: true, ngImport: i0__namespace, template: "<field-header *ngIf=\"fieldConfig.label && !fieldConfig.render?.options?.hideLabel\" class=\"predicate-field__label\">{{\r\n\tfieldConfig.label | translate\r\n}}</field-header>\r\n\r\n<ng-container #dynamicContainer></ng-container>\r\n", styles: [".custom-field{display:var(--cf-display, block);padding-inline:var(--cf-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--cf-padding-block, var(--ff-padding-block, 0));max-width:100%}\n"], components: [{ type: FieldHeaderComponent, selector: "field-header" }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
-  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomFieldComponent, decorators: [{
-              type: i0.Component,
-              args: [{
-                      selector: 'app-custom-field',
-                      templateUrl: './custom-field.component.html',
-                      styleUrls: ['./custom-field.component.scss'],
-                      encapsulation: i0.ViewEncapsulation.None,
-                      providers: [
-                          {
-                              provide: i2.NG_VALUE_ACCESSOR,
-                              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
-                              multi: true
-                          },
-                          {
-                              provide: i2.NG_VALIDATORS,
-                              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
-                              multi: true
-                          }
-                      ],
-                      host: {
-                          '[class]': "'custom-field' + '  custom-field__fieldConfig?.render?.type' "
-                      }
-                  }]
-          }], propDecorators: { aggregations: [{
-                  type: i0.Input
-              }] } });
-
-  var FiltersByRolesPipe = /** @class */ (function () {
-      function FiltersByRolesPipe(_nuxeoService, _rolesService) {
-          this._nuxeoService = _nuxeoService;
-          this._rolesService = _rolesService;
-      }
-      FiltersByRolesPipe.prototype.transform = function (items) {
-          var _this = this;
-          if (!items) {
-              return items;
-          }
-          return items.filter(function (item) {
-              var _a, _b, _c, _d, _e;
-              if (!Array.isArray((_a = item.config) === null || _a === void 0 ? void 0 : _a.roles) || ((_b = item.config) === null || _b === void 0 ? void 0 : _b.roles.length) === 0) {
-                  return true;
-              }
-              var user = (_d = (_c = _this._nuxeoService) === null || _c === void 0 ? void 0 : _c.nuxeoClient) === null || _d === void 0 ? void 0 : _d.user;
-              return _this._rolesService.isUserInRole(user, (_e = item.config) === null || _e === void 0 ? void 0 : _e.roles);
-          });
-      };
-      return FiltersByRolesPipe;
-  }());
-  FiltersByRolesPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersByRolesPipe, deps: [{ token: NuxeoService }, { token: RolesService }], target: i0__namespace.ɵɵFactoryTarget.Pipe });
-  FiltersByRolesPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersByRolesPipe, name: "filterByRoles" });
-  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersByRolesPipe, decorators: [{
-              type: i0.Pipe,
-              args: [{
-                      name: 'filterByRoles'
-                  }]
-          }], ctorParameters: function () { return [{ type: NuxeoService }, { type: RolesService }]; } });
-
   /**
    * Creates a secure context for function evaluation that prevents access to the window object.
    * @returns {Record<string, any>} A secure context object with safe properties.
@@ -20227,7 +19950,8 @@
           // Prevent access to window
           window: undefined,
           self: undefined,
-          globalThis: undefined
+          globalThis: undefined,
+          _: ___default["default"] // Include lodash if needed, but ensure it's used safely
       };
   }
   /**
@@ -20543,39 +20267,318 @@
       escape: /\{\{\{([\s\S]+?)\}\}\}/g
   };
 
-  var CheckConditionPipe = /** @class */ (function () {
-      function CheckConditionPipe(nuxeoService) {
-          this.nuxeoService = nuxeoService;
-          this.user = nuxeoService.nuxeoClient.user;
+  var BaseField = /** @class */ (function (_super) {
+      __extends(BaseField, _super);
+      function BaseField() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+          _this.dynamicComponent = _this.injector.get(DynamicComponentLoaderService);
+          return _this;
       }
-      CheckConditionPipe.prototype.transform = function (condition, aggregations, language) {
-          if (!condition) {
-              return true;
+      BaseField.prototype.writeValue = function (obj) {
+          var _a, _b, _c, _d;
+          this.internalValue = obj;
+          if ((_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.writeValue) {
+              (_d = (_c = this._componentRef) === null || _c === void 0 ? void 0 : _c.instance) === null || _d === void 0 ? void 0 : _d.writeValue(obj);
           }
-          try {
-              return Evaluator.evaluate(condition, ___default["default"].cloneDeep({ aggregations: aggregations, language: language, user: this.user }));
+      };
+      BaseField.prototype.validate = function (control) {
+          var _a, _b;
+          if ((_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.validate) {
+              return this._componentRef.instance.validate(control);
           }
-          catch (error) {
-              console.error({ error: error });
-              return false;
+          else {
+              return null;
           }
       };
-      return CheckConditionPipe;
+      BaseField.prototype.registerOnValidatorChange = function (fn) {
+          var _a, _b;
+          if ((_b = (_a = this._componentRef) === null || _a === void 0 ? void 0 : _a.instance) === null || _b === void 0 ? void 0 : _b.registerOnValidatorChange) {
+              this._componentRef.instance.registerOnValidatorChange(fn);
+          }
+      };
+      BaseField.prototype.ngOnChanges = function (changes) {
+          var _this = this;
+          if (!this._componentRef) {
+              return;
+          }
+          Object.keys(changes).forEach(function (key) {
+              _this._componentRef.instance[key] = changes[key].currentValue;
+          });
+          this._componentRef.changeDetectorRef.markForCheck();
+      };
+      BaseField.prototype.ngOnDestroy = function () {
+          if (this._componentRef) {
+              this._componentRef.destroy();
+          }
+      };
+      BaseField.prototype._prepareValueAccessor = function () {
+          var ngControl = this.injector.get(i2.NgControl);
+          ngControl.valueAccessor = this._componentRef.instance;
+      };
+      return BaseField;
+  }(BaseCustomValueAccessor));
+  BaseField.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BaseField, deps: null, target: i0__namespace.ɵɵFactoryTarget.Directive });
+  BaseField.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: BaseField, inputs: { fieldConfig: "fieldConfig" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["dynamicContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0__namespace });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BaseField, decorators: [{
+              type: i0.Directive
+          }], propDecorators: { container: [{
+                  type: i0.ViewChild,
+                  args: ['dynamicContainer', { read: i0.ViewContainerRef, static: true }]
+              }], fieldConfig: [{
+                  type: i0.Input
+              }] } });
+
+  var PredicateFieldComponent = /** @class */ (function (_super) {
+      __extends(PredicateFieldComponent, _super);
+      function PredicateFieldComponent() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+          _this.handlers = {
+              input: _this._prepareField.bind(_this),
+              date: _this._prepareField.bind(_this)
+          };
+          return _this;
+      }
+      PredicateFieldComponent.prototype.ngOnInit = function () {
+          var _a, _b;
+          var componentType = (_b = (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.type;
+          if (componentType) {
+              this._componentRef = this.dynamicComponent.renderComponent(componentType, this.container);
+              this._prepareValueAccessor();
+              this._prepareComponent(componentType);
+          }
+      };
+      PredicateFieldComponent.prototype._prepareComponent = function (type) {
+          var _a, _b;
+          (_b = (_a = this.handlers)[type]) === null || _b === void 0 ? void 0 : _b.call(_a);
+      };
+      PredicateFieldComponent.prototype._prepareField = function () {
+          var instance = this._componentRef.instance;
+          instance.field = this.fieldConfig;
+      };
+      return PredicateFieldComponent;
+  }(BaseField));
+  PredicateFieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PredicateFieldComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+  PredicateFieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PredicateFieldComponent, selector: "app-predicate-field", host: { properties: { "class": "'predicate-field' + '  predicate-field__fieldConfig?.render?.type' " } }, providers: [
+          {
+              provide: i2.NG_VALUE_ACCESSOR,
+              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
+              multi: true
+          },
+          {
+              provide: i2.NG_VALIDATORS,
+              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
+              multi: true
+          }
+      ], usesInheritance: true, ngImport: i0__namespace, template: "<field-header *ngIf=\"fieldConfig.label && !fieldConfig.render?.options?.hideLabel\" class=\"predicate-field__label\">{{\r\n\tfieldConfig.label | translate\r\n}}</field-header>\r\n\r\n<ng-container #dynamicContainer></ng-container>\r\n", styles: [".predicate-field{display:var(--pf-display, block);padding-inline:var(--pf-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--pf-padding-block, var(--ff-padding-block, 0));max-width:100%}\n"], components: [{ type: FieldHeaderComponent, selector: "field-header" }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PredicateFieldComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: 'app-predicate-field',
+                      templateUrl: './predicate-field.component.html',
+                      styleUrls: ['./predicate-field.component.scss'],
+                      encapsulation: i0.ViewEncapsulation.None,
+                      providers: [
+                          {
+                              provide: i2.NG_VALUE_ACCESSOR,
+                              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
+                              multi: true
+                          },
+                          {
+                              provide: i2.NG_VALIDATORS,
+                              useExisting: i0.forwardRef(function () { return PredicateFieldComponent; }),
+                              multi: true
+                          }
+                      ],
+                      host: {
+                          '[class]': "'predicate-field' + '  predicate-field__fieldConfig?.render?.type' "
+                      }
+                  }]
+          }] });
+
+  var AggregationFieldComponent = /** @class */ (function (_super) {
+      __extends(AggregationFieldComponent, _super);
+      function AggregationFieldComponent() {
+          var _e;
+          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+          _this.handlers = (_e = {},
+              _e[AGGREGATION_FIELD_TYPES.dropdown] = _this._prepareField.bind(_this),
+              _e[AGGREGATION_FIELD_TYPES.checkbox] = _this._prepareField.bind(_this),
+              _e[AGGREGATION_FIELD_TYPES.radio] = _this._prepareField.bind(_this),
+              _e[AGGREGATION_FIELD_TYPES.switch] = _this._prepareField.bind(_this),
+              _e[AGGREGATION_FIELD_TYPES.autocomplete] = _this._prepareField.bind(_this),
+              _e[AGGREGATION_FIELD_TYPES.dateList] = _this._prepareField.bind(_this),
+              _e[AGGREGATION_FIELD_TYPES.custom] = _this._prepareField.bind(_this),
+              _e);
+          return _this;
+      }
+      AggregationFieldComponent.prototype.ngOnInit = function () {
+          var _a, _b, _c, _d;
+          var componentType = (_b = (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.type;
+          if (componentType) {
+              this._componentRef = this.dynamicComponent.renderComponent(componentType, this.container);
+              this._prepareValueAccessor();
+              (_d = (_c = this.handlers)[componentType]) === null || _d === void 0 ? void 0 : _d.call(_c);
+          }
+      };
+      AggregationFieldComponent.prototype._prepareField = function () {
+          var instance = this._componentRef
+              .instance;
+          instance.aggregation = this.aggregation;
+          instance.fieldConfig = this.fieldConfig;
+          if (this.contentTemplate) {
+              instance.contentTemplate = this.contentTemplate;
+          }
+      };
+      return AggregationFieldComponent;
+  }(BaseField));
+  AggregationFieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AggregationFieldComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+  AggregationFieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AggregationFieldComponent, selector: "app-aggregation-field", inputs: { aggregation: "aggregation", contentTemplate: "contentTemplate" }, host: { properties: { "class": "'aggregation-field' + '  aggregation-field__fieldConfig?.render?.type' " } }, providers: [
+          {
+              provide: i2.NG_VALUE_ACCESSOR,
+              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
+              multi: true,
+          },
+          {
+              provide: i2.NG_VALIDATORS,
+              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
+              multi: true,
+          },
+      ], usesInheritance: true, ngImport: i0__namespace, template: '<ng-container #dynamicContainer></ng-container>', isInline: true, styles: [""], encapsulation: i0__namespace.ViewEncapsulation.None });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AggregationFieldComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: 'app-aggregation-field',
+                      template: '<ng-container #dynamicContainer></ng-container>',
+                      styles: [''],
+                      encapsulation: i0.ViewEncapsulation.None,
+                      providers: [
+                          {
+                              provide: i2.NG_VALUE_ACCESSOR,
+                              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
+                              multi: true,
+                          },
+                          {
+                              provide: i2.NG_VALIDATORS,
+                              useExisting: i0.forwardRef(function () { return AggregationFieldComponent; }),
+                              multi: true,
+                          },
+                      ],
+                      host: {
+                          '[class]': "'aggregation-field' + '  aggregation-field__fieldConfig?.render?.type' ",
+                      },
+                  }]
+          }], propDecorators: { aggregation: [{
+                  type: i0.Input
+              }], contentTemplate: [{
+                  type: i0.Input
+              }] } });
+
+  var CustomFieldComponent = /** @class */ (function (_super) {
+      __extends(CustomFieldComponent, _super);
+      function CustomFieldComponent() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+          _this.handlers = {
+              activeUser: _this._prepareField.bind(_this),
+              aggregationGroup: _this._prepareField.bind(_this)
+          };
+          return _this;
+      }
+      CustomFieldComponent.prototype.ngOnInit = function () {
+          var _a, _b;
+          var componentType = (_b = (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.render) === null || _b === void 0 ? void 0 : _b.type;
+          if (componentType) {
+              this._componentRef = this.dynamicComponent.renderComponent(componentType, this.container);
+              this._prepareValueAccessor();
+              this._prepareComponent(componentType);
+          }
+      };
+      CustomFieldComponent.prototype._prepareComponent = function (type) {
+          var _a, _b;
+          (_b = (_a = this.handlers)[type]) === null || _b === void 0 ? void 0 : _b.call(_a);
+      };
+      CustomFieldComponent.prototype._prepareField = function () {
+          var instance = this._componentRef.instance;
+          instance.field = this.fieldConfig;
+          instance.aggregations = this.aggregations;
+      };
+      return CustomFieldComponent;
+  }(BaseField));
+  CustomFieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomFieldComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+  CustomFieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CustomFieldComponent, selector: "app-custom-field", inputs: { aggregations: "aggregations" }, host: { properties: { "class": "'custom-field' + '  custom-field__fieldConfig?.render?.type' " } }, providers: [
+          {
+              provide: i2.NG_VALUE_ACCESSOR,
+              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
+              multi: true
+          },
+          {
+              provide: i2.NG_VALIDATORS,
+              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
+              multi: true
+          }
+      ], usesInheritance: true, ngImport: i0__namespace, template: "<field-header *ngIf=\"fieldConfig.label && !fieldConfig.render?.options?.hideLabel\" class=\"predicate-field__label\">{{\r\n\tfieldConfig.label | translate\r\n}}</field-header>\r\n\r\n<ng-container #dynamicContainer></ng-container>\r\n", styles: [".custom-field{display:var(--cf-display, block);padding-inline:var(--cf-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--cf-padding-block, var(--ff-padding-block, 0));max-width:100%}\n"], components: [{ type: FieldHeaderComponent, selector: "field-header" }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomFieldComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: 'app-custom-field',
+                      templateUrl: './custom-field.component.html',
+                      styleUrls: ['./custom-field.component.scss'],
+                      encapsulation: i0.ViewEncapsulation.None,
+                      providers: [
+                          {
+                              provide: i2.NG_VALUE_ACCESSOR,
+                              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
+                              multi: true
+                          },
+                          {
+                              provide: i2.NG_VALIDATORS,
+                              useExisting: i0.forwardRef(function () { return CustomFieldComponent; }),
+                              multi: true
+                          }
+                      ],
+                      host: {
+                          '[class]': "'custom-field' + '  custom-field__fieldConfig?.render?.type' "
+                      }
+                  }]
+          }], propDecorators: { aggregations: [{
+                  type: i0.Input
+              }] } });
+
+  var FiltersByRolesPipe = /** @class */ (function () {
+      function FiltersByRolesPipe(_nuxeoService, _rolesService) {
+          this._nuxeoService = _nuxeoService;
+          this._rolesService = _rolesService;
+      }
+      FiltersByRolesPipe.prototype.transform = function (items) {
+          var _this = this;
+          if (!items) {
+              return items;
+          }
+          return items.filter(function (item) {
+              var _a, _b, _c, _d, _e;
+              if (!Array.isArray((_a = item.config) === null || _a === void 0 ? void 0 : _a.roles) || ((_b = item.config) === null || _b === void 0 ? void 0 : _b.roles.length) === 0) {
+                  return true;
+              }
+              var user = (_d = (_c = _this._nuxeoService) === null || _c === void 0 ? void 0 : _c.nuxeoClient) === null || _d === void 0 ? void 0 : _d.user;
+              return _this._rolesService.isUserInRole(user, (_e = item.config) === null || _e === void 0 ? void 0 : _e.roles);
+          });
+      };
+      return FiltersByRolesPipe;
   }());
-  CheckConditionPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CheckConditionPipe, deps: [{ token: NuxeoService }], target: i0__namespace.ɵɵFactoryTarget.Pipe });
-  CheckConditionPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CheckConditionPipe, name: "checkCondition" });
-  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CheckConditionPipe, decorators: [{
+  FiltersByRolesPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersByRolesPipe, deps: [{ token: NuxeoService }, { token: RolesService }], target: i0__namespace.ɵɵFactoryTarget.Pipe });
+  FiltersByRolesPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersByRolesPipe, name: "filterByRoles" });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersByRolesPipe, decorators: [{
               type: i0.Pipe,
               args: [{
-                      name: 'checkCondition'
+                      name: 'filterByRoles'
                   }]
-          }], ctorParameters: function () { return [{ type: NuxeoService }]; } });
+          }], ctorParameters: function () { return [{ type: NuxeoService }, { type: RolesService }]; } });
 
   var FiltersPanelComponent = /** @class */ (function (_super) {
       __extends(FiltersPanelComponent, _super);
-      function FiltersPanelComponent(_translateService) {
+      function FiltersPanelComponent(_translateService, nuxeoService) {
           var _this = _super.call(this) || this;
           _this._translateService = _translateService;
+          _this.nuxeoService = nuxeoService;
           _this.currentLang = _this._translateService.currentLang;
           _this.direction$ = _this._translateService.onLangChange.pipe(operators.startWith({ lang: _this._translateService.currentLang }), operators.map(function (lang) {
               _this.currentLang = lang.lang;
@@ -20586,6 +20589,7 @@
           _this.filterChanged = new i0.EventEmitter();
           _this.fieldTypes = FIELD_TYPE;
           _this.FieldRenderType = AGGREGATION_FIELD_TYPES;
+          _this.visibleFields = {};
           _this.formGroup = new i2.FormGroup({});
           return _this;
       }
@@ -20605,6 +20609,9 @@
       Object.defineProperty(FiltersPanelComponent.prototype, "activeQuery", {
           set: function (obj) {
               this._activeQuerySub.next(obj);
+              if (obj) {
+                  this._evaluateConditions();
+              }
           },
           enumerable: false,
           configurable: true
@@ -20624,19 +20631,27 @@
       FiltersPanelComponent.prototype.ngOnInit = function () {
           this._handleFormGroupChanges();
           this._handelActiveQueryChange();
+          this._evaluateConditions();
+      };
+      FiltersPanelComponent.prototype.ngOnChanges = function (changes) {
+          var _a, _b;
+          if (!((_a = changes === null || changes === void 0 ? void 0 : changes.fields) === null || _a === void 0 ? void 0 : _a.firstChange) || !((_b = changes === null || changes === void 0 ? void 0 : changes.aggregations) === null || _b === void 0 ? void 0 : _b.firstChange)) {
+              this._evaluateConditions();
+          }
       };
       FiltersPanelComponent.prototype.resetFilters = function () {
           this.formGroup.reset({});
       };
       FiltersPanelComponent.prototype._sortItems = function (items) {
           var _defaultOrder = 0;
-          return items.sort(function (_b, _c) {
-              var o1 = _b.config.order;
-              var o2 = _c.config.order;
+          return items.sort(function (_c, _d) {
+              var o1 = _c.config.order;
+              var o2 = _d.config.order;
               return (o1 !== null && o1 !== void 0 ? o1 : _defaultOrder) - (o2 !== null && o2 !== void 0 ? o2 : _defaultOrder);
           });
       };
       FiltersPanelComponent.prototype._initFormGroup = function () {
+          this.visibleFields = {};
           this._removeControls();
           this._prepareFiltersForm();
       };
@@ -20648,13 +20663,13 @@
           });
       };
       FiltersPanelComponent.prototype._prepareFiltersForm = function () {
-          var e_1, _b;
+          var e_1, _c;
           if (!this.fields) {
               return;
           }
           try {
-              for (var _c = __values(this.fields), _d = _c.next(); !_d.done; _d = _c.next()) {
-                  var field = _d.value;
+              for (var _d = __values(this.fields), _e = _d.next(); !_e.done; _e = _d.next()) {
+                  var field = _e.value;
                   var key = field.config.fieldKey;
                   if (!this.formGroup.contains(key)) {
                       this.formGroup.addControl(key, new i2.FormControl(field.config.values));
@@ -20664,7 +20679,7 @@
           catch (e_1_1) { e_1 = { error: e_1_1 }; }
           finally {
               try {
-                  if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
+                  if (_e && !_e.done && (_c = _d.return)) _c.call(_d);
               }
               finally { if (e_1) throw e_1.error; }
           }
@@ -20672,7 +20687,10 @@
       FiltersPanelComponent.prototype._handleFormGroupChanges = function () {
           var _this = this;
           this.formGroup.valueChanges
-              .pipe(operators.debounceTime(300), operators.map(function (data) { return removeEmptyKeys(data); }), operators.distinctUntilChanged(function (a, b) { return ___default["default"].isEqual(a, b); }), operators.takeUntil(this.destroy$))
+              .pipe(operators.debounceTime(300), operators.map(function (formValue) {
+              var data = _this._evaluateConditions(formValue);
+              return removeEmptyKeys(data);
+          }), operators.distinctUntilChanged(function (a, b) { return ___default["default"].isEqual(a, b); }), operators.takeUntil(this.destroy$))
               .subscribe(function (res) {
               _this.filterChanged.emit(res);
           });
@@ -20691,10 +20709,41 @@
               _this._patchActiveQuery(res);
           });
       };
+      FiltersPanelComponent.prototype._evaluateConditions = function (values) {
+          var _this = this;
+          if (values === void 0) { values = this.formGroup.getRawValue(); }
+          this.visibleFields = {};
+          this.fields.forEach(function (field) {
+              var _a;
+              var fieldKey = field.config.fieldKey;
+              var condition = (_a = field.config) === null || _a === void 0 ? void 0 : _a.condition;
+              try {
+                  var isVisible = !condition ||
+                      Evaluator.evaluate(condition, ___default["default"].cloneDeep({
+                          aggregations: _this.aggregations,
+                          language: _this.currentLang,
+                          user: _this.nuxeoService.nuxeoClient.user,
+                          values: _this.formGroup.getRawValue()
+                      }));
+                  _this.visibleFields[fieldKey] = isVisible;
+                  if (!isVisible) {
+                      var control = _this.formGroup.get(fieldKey);
+                      if (!!(control === null || control === void 0 ? void 0 : control.value)) {
+                          control.reset();
+                          control.updateValueAndValidity({ emitEvent: false });
+                      }
+                  }
+              }
+              catch (e) {
+                  console.error("Error evaluating condition for field " + field.config.fieldKey + ":", e);
+              }
+          });
+          return this.formGroup.value;
+      };
       return FiltersPanelComponent;
   }(BaseFiltersPanel));
-  FiltersPanelComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersPanelComponent, deps: [{ token: i1__namespace.TranslateService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  FiltersPanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FiltersPanelComponent, selector: "app-filters-panel", inputs: { aggregations: "aggregations", fields: "fields", activeQuery: "activeQuery" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0__namespace, template: "<div [formGroup]=\"formGroup\" class=\"filters-panel\" [dir]=\"direction$ | async\">\r\n\t<div class=\"reset-filter flex reset-container\">\r\n\t\t<button mat-stroked-button class=\"w-full\" (click)=\"resetFilters()\" [disabled]=\"!hasValues\">\r\n\t\t\t{{ 'BUTTONS.clearFilter' | translate }}\r\n\t\t</button>\r\n\t</div>\r\n\t<ng-container *ngFor=\"let field of fields | filterByRoles; trackBy: trackByFieldKey\">\r\n\t\t<ng-container *permission=\"{ name: field.config?.permission }\">\r\n\t\t\t<ng-container *ngIf=\"field.config?.condition | checkCondition: aggregations : currentLang \">\r\n\t\t\t\t<app-predicate-field\r\n\t\t\t\t\t*ngIf=\"field.type == fieldTypes.predicate\"\r\n\t\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t></app-predicate-field>\r\n\t\t\t\t<app-aggregation-field\r\n\t\t\t\t\t*ngIf=\"field.type == fieldTypes.aggregation && !!aggregations\"\r\n\t\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t\t[aggregation]=\"aggregations[field.config.aggregation]\"\r\n\t\t\t\t\t[contentTemplate]=\"getContentTemplate(field.config.render.type)\"\r\n\t\t\t\t></app-aggregation-field>\r\n\t\t\t\t<app-custom-field\r\n\t\t\t\t\t*ngIf=\"field.type == fieldTypes.custom\"\r\n\t\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t\t[aggregations]=\"aggregations\"\r\n\t\t\t\t></app-custom-field>\r\n\t\t\t</ng-container>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</div>\r\n", styles: [".filters-panel{display:var(--filters-panel-display, flex);flex-direction:var(--filters-panel-direction, column);grid-gap:var(--filters-panel-gap, .5rem);gap:var(--filters-panel-gap, .5rem);flex-wrap:var(--filters-panel-wrap, wrap);max-width:100%;box-sizing:border-box}.aggregation-field{padding-inline:var(--af-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--af-padding-block, var(--ff-padding-block, 0));max-width:100%}.reset-container{padding:.5rem;position:sticky;top:-8px;z-index:4;background:var(--reset-filter-panel-bg, #fff)}.reset-container button.mat-button-base{background-color:var(--reset-filter-panel-btn-bg, transparent);border-color:var(--reset-filter-panel-btn-bg, #e2e8f0);color:var(--reset-filter-panel-btn-color, currentColor)}\n"], components: [{ type: i1__namespace$c.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: PredicateFieldComponent, selector: "app-predicate-field" }, { type: AggregationFieldComponent, selector: "app-aggregation-field", inputs: ["aggregation", "contentTemplate"] }, { type: CustomFieldComponent, selector: "app-custom-field", inputs: ["aggregations"] }], directives: [{ type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "async": i4__namespace$1.AsyncPipe, "translate": i1__namespace.TranslatePipe, "filterByRoles": FiltersByRolesPipe, "checkCondition": CheckConditionPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+  FiltersPanelComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersPanelComponent, deps: [{ token: i1__namespace.TranslateService }, { token: NuxeoService }], target: i0__namespace.ɵɵFactoryTarget.Component });
+  FiltersPanelComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FiltersPanelComponent, selector: "app-filters-panel", inputs: { aggregations: "aggregations", fields: "fields", activeQuery: "activeQuery" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, usesOnChanges: true, ngImport: i0__namespace, template: "<div [formGroup]=\"formGroup\" class=\"filters-panel\" [dir]=\"direction$ | async\">\r\n\t<div class=\"reset-filter flex reset-container\">\r\n\t\t<button mat-stroked-button class=\"w-full\" (click)=\"resetFilters()\" [disabled]=\"!hasValues\">\r\n\t\t\t{{ 'BUTTONS.clearFilter' | translate }}\r\n\t\t</button>\r\n\t</div>\r\n\t<ng-container *ngFor=\"let field of fields | filterByRoles; trackBy: trackByFieldKey\">\r\n\t\t<ng-container *permission=\"{ name: field.config?.permission }\">\r\n\t\t\t<ng-container *ngIf=\"visibleFields[field.config.fieldKey]\">\r\n\t\t\t\t<app-predicate-field\r\n\t\t\t\t\t*ngIf=\"field.type == fieldTypes.predicate\"\r\n\t\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t></app-predicate-field>\r\n\t\t\t\t<app-aggregation-field\r\n\t\t\t\t\t*ngIf=\"field.type == fieldTypes.aggregation && !!aggregations\"\r\n\t\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t\t[aggregation]=\"aggregations[field.config.aggregation]\"\r\n\t\t\t\t\t[contentTemplate]=\"getContentTemplate(field.config.render.type)\"\r\n\t\t\t\t></app-aggregation-field>\r\n\t\t\t\t<app-custom-field\r\n\t\t\t\t\t*ngIf=\"field.type == fieldTypes.custom\"\r\n\t\t\t\t\t[fieldConfig]=\"field.config\"\r\n\t\t\t\t\t[formControlName]=\"field.config.fieldKey\"\r\n\t\t\t\t\t[aggregations]=\"aggregations\"\r\n\t\t\t\t></app-custom-field>\r\n\t\t\t</ng-container>\r\n\t\t</ng-container>\r\n\t</ng-container>\r\n</div>\r\n", styles: [".filters-panel{display:var(--filters-panel-display, flex);flex-direction:var(--filters-panel-direction, column);grid-gap:var(--filters-panel-gap, .5rem);gap:var(--filters-panel-gap, .5rem);flex-wrap:var(--filters-panel-wrap, wrap);max-width:100%;box-sizing:border-box}.aggregation-field{padding-inline:var(--af-padding-inline, var(--ff-padding-inline, .5rem));padding-block:var(--af-padding-block, var(--ff-padding-block, 0));max-width:100%}.reset-container{padding:.5rem;position:sticky;top:-8px;z-index:4;background:var(--reset-filter-panel-bg, #fff)}.reset-container button.mat-button-base{background-color:var(--reset-filter-panel-btn-bg, transparent);border-color:var(--reset-filter-panel-btn-bg, #e2e8f0);color:var(--reset-filter-panel-btn-color, currentColor)}\n"], components: [{ type: i1__namespace$c.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: PredicateFieldComponent, selector: "app-predicate-field" }, { type: AggregationFieldComponent, selector: "app-aggregation-field", inputs: ["aggregation", "contentTemplate"] }, { type: CustomFieldComponent, selector: "app-custom-field", inputs: ["aggregations"] }], directives: [{ type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "async": i4__namespace$1.AsyncPipe, "translate": i1__namespace.TranslatePipe, "filterByRoles": FiltersByRolesPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FiltersPanelComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -20703,7 +20752,7 @@
                       styleUrls: ['./filters-panel.component.scss'],
                       changeDetection: i0.ChangeDetectionStrategy.OnPush
                   }]
-          }], ctorParameters: function () { return [{ type: i1__namespace.TranslateService }]; }, propDecorators: { aggregations: [{
+          }], ctorParameters: function () { return [{ type: i1__namespace.TranslateService }, { type: NuxeoService }]; }, propDecorators: { aggregations: [{
                   type: i0.Input
               }], fields: [{
                   type: i0.Input
@@ -20803,6 +20852,34 @@
                   }]
           }] });
 
+  var CheckConditionPipe = /** @class */ (function () {
+      function CheckConditionPipe(nuxeoService) {
+          this.nuxeoService = nuxeoService;
+          this.user = nuxeoService.nuxeoClient.user;
+      }
+      CheckConditionPipe.prototype.transform = function (condition, aggregations, language, filterValues) {
+          if (!condition) {
+              return true;
+          }
+          try {
+              return Evaluator.evaluate(condition, ___default["default"].cloneDeep({ aggregations: aggregations, language: language, user: this.user, values: filterValues }));
+          }
+          catch (error) {
+              console.error({ error: error });
+              return false;
+          }
+      };
+      return CheckConditionPipe;
+  }());
+  CheckConditionPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CheckConditionPipe, deps: [{ token: NuxeoService }], target: i0__namespace.ɵɵFactoryTarget.Pipe });
+  CheckConditionPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CheckConditionPipe, name: "checkCondition" });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CheckConditionPipe, decorators: [{
+              type: i0.Pipe,
+              args: [{
+                      name: 'checkCondition'
+                  }]
+          }], ctorParameters: function () { return [{ type: NuxeoService }]; } });
+
   var AggregationGroupComponent = /** @class */ (function (_super) {
       __extends(AggregationGroupComponent, _super);
       function AggregationGroupComponent() {
@@ -23977,8 +24054,8 @@
               // isObject: new FormControl(false),
               extension: new i2.FormControl(item.title.split('.').pop()),
               content: new i2.FormControl({
-                  'upload-batch': item.blob['upload-batch'],
-                  'upload-fileId': item.blob['upload-fileId'],
+                  'upload-batch': item.blob ? item.blob['upload-batch'] : item.batchId,
+                  'upload-fileId': item.blob ? item.blob['upload-fileId'] : item.fileIdx,
                   'mime-type': 'application/pdf',
               }),
           });
@@ -24002,7 +24079,7 @@
       return AttachmentsListComponent;
   }());
   AttachmentsListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AttachmentsListComponent, deps: [{ token: NuxeoService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  AttachmentsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AttachmentsListComponent, selector: "cts-attachments-list", inputs: { ancestorId: "ancestorId", provider: "provider", items: "items", batchList: "batchList", dontDelete: "dontDelete", canDelete: "canDelete", item: "item", keepFileExtension: "keepFileExtension" }, outputs: { deleteSuccess: "deleteSuccess", documentsCount: "documentsCount", documentSelect: "documentSelect" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container>\r\n  <div class=\"doc-list\">\r\n    <ng-container>\r\n      <form [formGroup]=\"attachmentForm\">\r\n        <div formArrayName=\"attachmentCard\">\r\n          <div\r\n            class=\"doc-item\"\r\n            *ngFor=\"\r\n              let attachmentCardControl of attachmentForm.get('attachmentCard')[\r\n                'controls'\r\n              ];\r\n              let i = index\r\n            \"\r\n          >\r\n            <!-- (click)=\"preview(item.uid)\" -->\r\n            <div class=\"file-icon\">\r\n              <mat-icon>file_copy</mat-icon>\r\n            </div>\r\n            <div\r\n              [formGroupName]=\"i\"\r\n              class=\"attachmentForm-container row no-gutters\"\r\n            >\r\n              <div class=\"formControl-wrapper col-12 col-xl-6\">\r\n                <app-dynamic-form-textitem\r\n                  placeholder=\"{{ 'Title' | translate }}\"\r\n                  class=\"textitem\"\r\n                  formControlName=\"title\"\r\n                  \r\n                >\r\n                </app-dynamic-form-textitem>\r\n                <app-dynamic-form-textitem\r\n                  placeholder=\"{{\r\n                    'CREATE.ATTACHMENTS.REMARKS_PLACE_HOLDER' | translate\r\n                  }}\"\r\n                  class=\"textitem\"\r\n                  formControlName=\"remarks\"\r\n                >\r\n                </app-dynamic-form-textitem>\r\n              </div>\r\n              <div class=\"formControl-wrapper col-12 col-xl-6\">\r\n                <app-dynamic-form-vocabulary-item\r\n                  class=\"voc-form-control\"\r\n                  [bindLabel]=\"'label'\"\r\n                  [bindValue]=\"'id'\"\r\n                  placeholder=\"{{ 'VOCABULARY.TYPE' | translate }}\"\r\n                  [multiple]=\"false\"\r\n                  [searchable]=\"false\"\r\n                  [closeOnSelect]=\"true\"\r\n                  [hideSelectedItems]=\"false\"\r\n                  [vocabularyType]=\"'VOC_CorrespondenceAttachmentType'\"\r\n                  formControlName=\"category\"\r\n                >\r\n                </app-dynamic-form-vocabulary-item>\r\n                <app-dynamic-form-vocabulary-item\r\n                  class=\"voc-form-control\"\r\n                  [bindLabel]=\"'label'\"\r\n                  [bindValue]=\"'id'\"\r\n                  placeholder=\"{{ 'VOCABULARY.CLASSIFICATION' | translate }}\"\r\n                  [multiple]=\"false\"\r\n                  [searchable]=\"false\"\r\n                  [closeOnSelect]=\"true\"\r\n                  [hideSelectedItems]=\"false\"\r\n                  [vocabularyType]=\"'VOC_CorrespondenceAttachClassification'\"\r\n                  formControlName=\"classification\"\r\n                >\r\n                </app-dynamic-form-vocabulary-item>\r\n              </div>\r\n              <!-- <div class=\"formControl-toggleitem col-2 col-xl-2\">\r\n                <cts-dynamic-form-slide-toggleitem\r\n                  label=\"{{ 'CREATE.ATTACHMENTS.ISOBJECT' | translate }}\"\r\n                  formControlName=\"isObject\"\r\n                ></cts-dynamic-form-slide-toggleitem>\r\n              </div> -->\r\n            </div>\r\n            <div class=\"btn-wrapper\">\r\n              <button\r\n                (click)=\"delInput(i)\"\r\n                class=\"btn btn-outline-danger btn-no-border\"\r\n              >\r\n                <!-- deleteDocument($event, attachmentCardControl.value.item) -->\r\n                <mat-icon>delete</mat-icon>\r\n              </button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </form>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n<ng-template #spinner>\r\n  <mat-spinner class=\"centered-spinner\"></mat-spinner>\r\n</ng-template>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.doc-item{display:flex;flex:1;padding-top:6px;padding-bottom:6px;justify-content:space-between;align-items:center;padding-inline-end:4px;cursor:pointer;border:1px solid;border-color:#d9dce2}.doc-item .item-content{display:flex;align-items:center;justify-content:space-between}.doc-item .file-icon{margin:4px;color:#465573;display:flex;align-items:center}.attachmentForm-container{width:100%;grid-row-gap:6px;row-gap:6px}.attachmentForm-container .formControl-wrapper{display:flex;align-items:center;justify-content:space-between;grid-column-gap:10px;column-gap:10px;padding-inline-end:5px;padding-inline-start:5px}.attachmentForm-container .formControl-wrapper .voc-form-control{width:50%}.attachmentForm-container .formControl-wrapper .textitem{width:100%}.attachmentForm-container .formControl-toggleitem{display:flex;align-items:center;justify-content:center}.btn-wrapper{display:flex;justify-content:flex-end}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: i3__namespace$1.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
+  AttachmentsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AttachmentsListComponent, selector: "cts-attachments-list", inputs: { ancestorId: "ancestorId", provider: "provider", items: "items", batchList: "batchList", dontDelete: "dontDelete", canDelete: "canDelete", item: "item", keepFileExtension: "keepFileExtension" }, outputs: { deleteSuccess: "deleteSuccess", documentsCount: "documentsCount", documentSelect: "documentSelect" }, usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container>\r\n  <div class=\"doc-list\">\r\n    <ng-container>\r\n      <form [formGroup]=\"attachmentForm\">\r\n        <div formArrayName=\"attachmentCard\">\r\n          <div\r\n            class=\"doc-item\"\r\n            *ngFor=\"\r\n              let attachmentCardControl of attachmentForm.get('attachmentCard')[\r\n                'controls'\r\n              ];\r\n              let i = index\r\n            \"\r\n          >\r\n            <!-- (click)=\"preview(item.uid)\" -->\r\n            <div class=\"file-icon\">\r\n              <mat-icon>file_copy</mat-icon>\r\n            </div>\r\n            <div\r\n              [formGroupName]=\"i\"\r\n              class=\"attachmentForm-container row no-gutters\"\r\n            >\r\n              <div class=\"formControl-wrapper col-12 col-xl-6\">\r\n                <app-dynamic-form-textitem\r\n                  placeholder=\"{{ 'Title' | translate }}\"\r\n                  class=\"textitem\"\r\n                  formControlName=\"title\"\r\n                  \r\n                >\r\n                </app-dynamic-form-textitem>\r\n                <app-dynamic-form-textitem\r\n                  placeholder=\"{{\r\n                    'CREATE.ATTACHMENTS.REMARKS_PLACE_HOLDER' | translate\r\n                  }}\"\r\n                  class=\"textitem\"\r\n                  formControlName=\"remarks\"\r\n                >\r\n                </app-dynamic-form-textitem>\r\n              </div>\r\n              <div class=\"formControl-wrapper col-12 col-xl-6\">\r\n                <app-dynamic-form-vocabulary-item\r\n                  class=\"voc-form-control\"\r\n                  [bindLabel]=\"'label'\"\r\n                  [bindValue]=\"'id'\"\r\n                  placeholder=\"{{ 'VOCABULARY.TYPE' | translate }}\"\r\n                  [multiple]=\"false\"\r\n                  [searchable]=\"false\"\r\n                  [closeOnSelect]=\"true\"\r\n                  [hideSelectedItems]=\"false\"\r\n                  [vocabularyType]=\"'VOC_CorrespondenceAttachmentType'\"\r\n                  formControlName=\"category\"\r\n                >\r\n                </app-dynamic-form-vocabulary-item>\r\n                <app-dynamic-form-vocabulary-item\r\n                  class=\"voc-form-control\"\r\n                  [bindLabel]=\"'label'\"\r\n                  [bindValue]=\"'id'\"\r\n                  placeholder=\"{{ 'VOCABULARY.CLASSIFICATION' | translate }}\"\r\n                  [multiple]=\"false\"\r\n                  [searchable]=\"false\"\r\n                  [closeOnSelect]=\"true\"\r\n                  [hideSelectedItems]=\"false\"\r\n                  [vocabularyType]=\"'VOC_CorrespondenceAttachClassification'\"\r\n                  formControlName=\"classification\"\r\n                >\r\n                </app-dynamic-form-vocabulary-item>\r\n              </div>\r\n              <!-- <div class=\"formControl-toggleitem col-2 col-xl-2\">\r\n                <cts-dynamic-form-slide-toggleitem\r\n                  label=\"{{ 'CREATE.ATTACHMENTS.ISOBJECT' | translate }}\"\r\n                  formControlName=\"isObject\"\r\n                ></cts-dynamic-form-slide-toggleitem>\r\n              </div> -->\r\n            </div>\r\n            <div class=\"btn-wrapper\">\r\n              <button\r\n                (click)=\"delInput(i)\"\r\n                class=\"btn btn-outline-danger btn-no-border\"\r\n              >\r\n                <!-- deleteDocument($event, attachmentCardControl.value.item) -->\r\n                <mat-icon>delete</mat-icon>\r\n              </button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </form>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n<ng-template #spinner>\r\n  <mat-spinner class=\"centered-spinner\"></mat-spinner>\r\n</ng-template>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.doc-item{display:flex;flex:1;padding-top:6px;padding-bottom:6px;justify-content:space-between;align-items:center;padding-inline-end:4px;cursor:pointer;border:1px solid;border-color:#d9dce2}.doc-item .item-content{display:flex;align-items:center;justify-content:space-between}.doc-item .file-icon{margin:4px;color:#465573;display:flex;align-items:center}.attachmentForm-container{width:100%;grid-row-gap:6px;row-gap:6px}.attachmentForm-container .formControl-wrapper{display:flex;align-items:center;justify-content:space-between;grid-column-gap:10px;column-gap:10px;padding-inline-end:5px;padding-inline-start:5px}.attachmentForm-container .formControl-wrapper .voc-form-control{width:50%}.attachmentForm-container .formControl-wrapper .textitem{width:100%}.attachmentForm-container .formControl-toggleitem{display:flex;align-items:center;justify-content:center}.btn-wrapper{display:flex;justify-content:flex-end}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: i3__namespace$1.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AttachmentsListComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -25395,6 +25472,7 @@
           /** Max allowed number of files size */
           this.allowedMaxNumberOfFiles = 10;
           this.showAllowedTypesInErrorMess = true;
+          this.extraHeaders = {};
           /** Event emitted on document upload success, it will have document or batch object based on configuration */
           this.uploadSuccess = new i0.EventEmitter();
           /** Event emitted when an error occurs while attempting upload */
@@ -25499,7 +25577,7 @@
           var _this = this;
           if (selectedFiles.length) {
               this.uploading = true;
-              this.documentsApi.uploadBatch(selectedFiles)
+              this.documentsApi.uploadBatch(selectedFiles, this.extraHeaders)
                   .subscribe(function (files) {
                   if (_this.createDocument) {
                       rxjs.combineLatest(__spreadArray([], __read(files.map(function (file) { return _this.documentsApi.createDoc(file, _this.path, _this.params, _this.docParams); })))).subscribe(function (docs) {
@@ -25531,7 +25609,7 @@
       return DocumentUploadComponent;
   }());
   DocumentUploadComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DocumentUploadComponent, deps: [{ token: DocumentsService }, { token: CustomToastrService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  DocumentUploadComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DocumentUploadComponent, selector: "app-document-upload", inputs: { allowedTypes: "allowedTypes", params: "params", path: "path", maxSize: "maxSize", minSize: "minSize", docParams: "docParams", checkPdfContent: "checkPdfContent", multiple: "multiple", createDocument: "createDocument", allowedMaxNumberOfFiles: "allowedMaxNumberOfFiles", showAllowedTypesInErrorMess: "showAllowedTypesInErrorMess" }, outputs: { uploadSuccess: "uploadSuccess", uploadError: "uploadError" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0__namespace, template: "<input type=\"file\" class=\"hidden\" #fileInput [accept]=\"allowedTypes\" [multiple]=\"multiple\"\r\n  (change)=\"uploadDocument($event.target.files)\">\r\n<div #template [ngClass]=\"{'hidden': template.childNodes.length == 0}\" (click)=\"triggerUpload()\"\r\n  class=\"upload-container\">\r\n  <ng-content></ng-content>\r\n</div>\r\n<div *ngIf=\"template.childNodes.length == 0\" class=\"default-upload\" (click)=\"triggerUpload()\">\r\n  <div class=\"upload-section\" style=\"color:#465573;\">\r\n    <mat-icon class=\"upload-icon\">upload</mat-icon>\r\n    <h3 class=\"upload-title\">\r\n      {{'documents.uploadDocuments'| translate }}</h3>\r\n    <p class=\"upload-desc\">\r\n      {{'documents.maxSize'| translate }} {{maxSize | FileSize}}</p>\r\n  </div>\r\n  <div>\r\n    <mat-icon class=\"m-2\" style=\"color:#465573;\">file_copy</mat-icon>\r\n  </div>\r\n</div>\r\n<mat-progress-bar mode=\"indeterminate\" *ngIf=\"uploading\"></mat-progress-bar>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.upload-container{display:flex;flex:1;justify-content:space-between;cursor:pointer;width:100%;height:100%}.default-upload{display:flex;padding:8px 16px;flex:1;justify-content:space-between;background:#d8d8fc;cursor:pointer}.upload-section{display:flex;align-items:center;justify-content:center;justify-content:space-between}.upload-icon{margin:0 8px}.upload-title{font-size:16px;border-color:#465573;border-left:1px solid;padding-left:8px;margin:0}.rtl .upload-title{border-left:0px;border-right:1px solid;padding-left:0;padding-right:8px}.upload-desc{font-size:12px;padding-left:8px;opacity:.6;margin:0}.rtl .upload-desc{padding-left:0;padding-right:8px}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], directives: [{ type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe, "FileSize": FileSizePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  DocumentUploadComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DocumentUploadComponent, selector: "app-document-upload", inputs: { allowedTypes: "allowedTypes", params: "params", path: "path", maxSize: "maxSize", minSize: "minSize", docParams: "docParams", checkPdfContent: "checkPdfContent", multiple: "multiple", createDocument: "createDocument", allowedMaxNumberOfFiles: "allowedMaxNumberOfFiles", showAllowedTypesInErrorMess: "showAllowedTypesInErrorMess", extraHeaders: "extraHeaders" }, outputs: { uploadSuccess: "uploadSuccess", uploadError: "uploadError" }, viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0__namespace, template: "<input type=\"file\" class=\"hidden\" #fileInput [accept]=\"allowedTypes\" [multiple]=\"multiple\"\r\n  (change)=\"uploadDocument($event.target.files)\">\r\n<div #template [ngClass]=\"{'hidden': template.childNodes.length == 0}\" (click)=\"triggerUpload()\"\r\n  class=\"upload-container\">\r\n  <ng-content></ng-content>\r\n</div>\r\n<div *ngIf=\"template.childNodes.length == 0\" class=\"default-upload\" (click)=\"triggerUpload()\">\r\n  <div class=\"upload-section\" style=\"color:#465573;\">\r\n    <mat-icon class=\"upload-icon\">upload</mat-icon>\r\n    <h3 class=\"upload-title\">\r\n      {{'documents.uploadDocuments'| translate }}</h3>\r\n    <p class=\"upload-desc\">\r\n      {{'documents.maxSize'| translate }} {{maxSize | FileSize}}</p>\r\n  </div>\r\n  <div>\r\n    <mat-icon class=\"m-2\" style=\"color:#465573;\">file_copy</mat-icon>\r\n  </div>\r\n</div>\r\n<mat-progress-bar mode=\"indeterminate\" *ngIf=\"uploading\"></mat-progress-bar>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.upload-container{display:flex;flex:1;justify-content:space-between;cursor:pointer;width:100%;height:100%}.default-upload{display:flex;padding:8px 16px;flex:1;justify-content:space-between;background:#d8d8fc;cursor:pointer}.upload-section{display:flex;align-items:center;justify-content:center;justify-content:space-between}.upload-icon{margin:0 8px}.upload-title{font-size:16px;border-color:#465573;border-left:1px solid;padding-left:8px;margin:0}.rtl .upload-title{border-left:0px;border-right:1px solid;padding-left:0;padding-right:8px}.upload-desc{font-size:12px;padding-left:8px;opacity:.6;margin:0}.rtl .upload-desc{padding-left:0;padding-right:8px}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4__namespace$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], directives: [{ type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe, "FileSize": FileSizePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DocumentUploadComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -25562,6 +25640,8 @@
                   type: i0.Input
               }], showAllowedTypesInErrorMess: [{
                   type: i0.Input
+              }], extraHeaders: [{
+                  type: i0.Input
               }], uploadSuccess: [{
                   type: i0.Output
               }], uploadError: [{
@@ -25600,7 +25680,7 @@
       return DocumentsComponent;
   }());
   DocumentsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DocumentsComponent, deps: [{ token: CustomToastrService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  DocumentsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DocumentsComponent, selector: "app-documents", inputs: { ancestorId: "ancestorId", quickFilters: "quickFilters", params: "params", provider: "provider", path: "path", canUploadRoles: "canUploadRoles", multiple: "multiple", maxSize: "maxSize" }, ngImport: i0__namespace, template: "<app-card>\r\n  <h3 class=\"title text-lg font-bold\">\r\n    {{ \"documents.title\" | translate }}\r\n  </h3>\r\n\r\n\r\n  <div class=\"body\">\r\n    <app-document-upload [multiple]=\"multiple\" *appHasRole=\"canUploadRoles\" [docParams]=\"{type:documentConstants.documentTypes.attachment}\"\r\n      [path]=\"this.path\" [params]=\"this.params\" (uploadSuccess)=\"onSuccess($event)\" (uploadError)=\"onError($event)\">\r\n    </app-document-upload>\r\n    <app-documents-list [quickFilters]=\"quickFilters\" [notifier]=\"notifier\" [ancestorId]=\"ancestorId\"\r\n      [provider]=\"provider\" (deleteSuccess)=\"onDelete($event)\">\r\n    </app-documents-list>\r\n\r\n  </div>\r\n</app-card>\r\n", styles: [""], components: [{ type: CardComponent, selector: "app-card", inputs: ["noBody", "dark"] }, { type: DocumentUploadComponent, selector: "app-document-upload", inputs: ["allowedTypes", "params", "path", "maxSize", "minSize", "docParams", "checkPdfContent", "multiple", "createDocument", "allowedMaxNumberOfFiles", "showAllowedTypesInErrorMess"], outputs: ["uploadSuccess", "uploadError"] }, { type: DocumentsListComponent, selector: "app-documents-list", inputs: ["ancestorId", "provider", "disablePagination", "containerClasses", "itemsClasses", "items", "notifier", "canPreview", "batchList", "dontDelete", "canDelete", "quickFilters", "memoView"], outputs: ["deleteSuccess", "documentsCount", "documentSelect"] }], directives: [{ type: AppHasRoleDirective, selector: "[appHasRole]", inputs: ["appHasRole"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
+  DocumentsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DocumentsComponent, selector: "app-documents", inputs: { ancestorId: "ancestorId", quickFilters: "quickFilters", params: "params", provider: "provider", path: "path", canUploadRoles: "canUploadRoles", multiple: "multiple", maxSize: "maxSize" }, ngImport: i0__namespace, template: "<app-card>\r\n  <h3 class=\"title text-lg font-bold\">\r\n    {{ \"documents.title\" | translate }}\r\n  </h3>\r\n\r\n\r\n  <div class=\"body\">\r\n    <app-document-upload [multiple]=\"multiple\" *appHasRole=\"canUploadRoles\" [docParams]=\"{type:documentConstants.documentTypes.attachment}\"\r\n      [path]=\"this.path\" [params]=\"this.params\" (uploadSuccess)=\"onSuccess($event)\" (uploadError)=\"onError($event)\">\r\n    </app-document-upload>\r\n    <app-documents-list [quickFilters]=\"quickFilters\" [notifier]=\"notifier\" [ancestorId]=\"ancestorId\"\r\n      [provider]=\"provider\" (deleteSuccess)=\"onDelete($event)\">\r\n    </app-documents-list>\r\n\r\n  </div>\r\n</app-card>\r\n", styles: [""], components: [{ type: CardComponent, selector: "app-card", inputs: ["noBody", "dark"] }, { type: DocumentUploadComponent, selector: "app-document-upload", inputs: ["allowedTypes", "params", "path", "maxSize", "minSize", "docParams", "checkPdfContent", "multiple", "createDocument", "allowedMaxNumberOfFiles", "showAllowedTypesInErrorMess", "extraHeaders"], outputs: ["uploadSuccess", "uploadError"] }, { type: DocumentsListComponent, selector: "app-documents-list", inputs: ["ancestorId", "provider", "disablePagination", "containerClasses", "itemsClasses", "items", "notifier", "canPreview", "batchList", "dontDelete", "canDelete", "quickFilters", "memoView"], outputs: ["deleteSuccess", "documentsCount", "documentSelect"] }], directives: [{ type: AppHasRoleDirective, selector: "[appHasRole]", inputs: ["appHasRole"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DocumentsComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -30196,7 +30276,7 @@
       return DynamicFieldsRendererComponent;
   }());
   DynamicFieldsRendererComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DynamicFieldsRendererComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-  DynamicFieldsRendererComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DynamicFieldsRendererComponent, selector: "app-dynamic-fields-renderer", inputs: { form: "form", agencyNameFilter: "agencyNameFilter", countryNameFilter: "countryNameFilter", orgNameFilter: "orgNameFilter", ngoNameFilter: "ngoNameFilter", disableInitSecrecyLevel: "disableInitSecrecyLevel", mode: "mode", fields: "fields" }, outputs: { checkTextSpellCheckerField: "checkTextSpellCheckerField" }, ngImport: i0__namespace, template: "<div [formGroup]=\"form\" *ngIf=\"form\">\r\n\t<div class=\"renderer-container\">\r\n\t\t<div class=\"field-container\" *ngFor=\"let field of fields\">\r\n\t\t\t<div class=\"flex gap-x-2 items-center\" *permission=\"{ name: field.permission, entity: field.formControlName }\">\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'text'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel; else showLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<ng-template #showLabel>\r\n\t\t\t\t\t\t<div class=\"label-style\">\r\n\t\t\t\t\t\t\t{{ field.label | translate }}\r\n\t\t\t\t\t\t\t<span class=\"text-red-500\" *ngIf=\"field.required\">*</span>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</ng-template>\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\tclass=\"field-style\"\r\n\t\t\t\t\t\tid=\"{{ field.formControlName }}\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\tplaceholder=\" {{ field.placeholder | translate }}\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'number'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel; else showLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<ng-template #showLabel>\r\n\t\t\t\t\t\t<div class=\"label-style\">\r\n\t\t\t\t\t\t\t{{ field.label | translate }}\r\n\t\t\t\t\t\t\t<span class=\"text-red-500\" *ngIf=\"field.required\">*</span>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</ng-template>\r\n\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\tmin=\"1\"\r\n\t\t\t\t\t\ttype=\"number\"\r\n\t\t\t\t\t\tclass=\"field-style\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\tplaceholder=\" {{ field.placeholder | translate }}\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'textarea'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<app-dynamic-form-textarea\r\n\t\t\t\t\t\t[id]=\"field.formControlName\"\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\tplaceholder=\"{{ field.placeholder | translate }}\"\r\n\t\t\t\t\t\t[disabled]=\"field.disabled\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</app-dynamic-form-textarea>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'date'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<cts-dynamic-form-hijri-dateitem\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t[minHijri]=\"field.minHijri\"\r\n\t\t\t\t\t\t[maxHijri]=\"field.maxHijri\"\r\n\t\t\t\t\t\t[minGreg]=\"field.minGreg\"\r\n\t\t\t\t\t\t[maxGreg]=\"field.maxGreg\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</cts-dynamic-form-hijri-dateitem>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'spellCheckerField'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<ndf-spell-checker-text-field\r\n\t\t\t\t\t\t[id]=\"field.formControlName\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\t[placeholder]=\"field.placeholder\"\r\n\t\t\t\t\t\t[fieldType]=\"field.fieldType\"\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t(checkFromText)=\"checkTextOfSpellCheckField(field.formControlName)\"\r\n\t\t\t\t\t></ndf-spell-checker-text-field>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'dynamic-vocabulary'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<app-dynamic-form-vocabulary-item\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t[bindLabel]=\"field.bindLabel\"\r\n\t\t\t\t\t\t[bindValue]=\"field.bindValue\"\r\n\t\t\t\t\t\tplaceholder=\"{{ field.placeholder | translate }}\"\r\n\t\t\t\t\t\t[multiple]=\"field.multiple\"\r\n\t\t\t\t\t\t[searchable]=\"field.searchable\"\r\n\t\t\t\t\t\t[closeOnSelect]=\"field.closeOnSelect\"\r\n\t\t\t\t\t\t[disabled]=\"field.disabled\"\r\n\t\t\t\t\t\t[hideSelectedItems]=\"field.hideSelectedItems\"\r\n\t\t\t\t\t\t[vocabularyType]=\"field.vocabularyType\"\r\n\t\t\t\t\t\t[onlyIds]=\"field.onlyIds\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</app-dynamic-form-vocabulary-item>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<!-- <div class=\"single-field mb-3\" *ngIf=\"field.type === 'department-selector'\">\r\n                    <div class=\"label-style\">\r\n                        {{ field.label | translate }}\r\n                        <span class=\"text-red-500\" *ngIf=\"field.required\">*</span>\r\n                    </div>\r\n                    <app-dynamic-form-department\r\n                    [formControlName]=\"field.formControlName\"\r\n                    [placeholder]=\"field.placeholder\"\r\n                    [pp_departmentNestedTree]=\"field.pp_departmentNestedTree\"\r\n                    [pp_departmentTree]=\"field.pp_departmentTree\"\r\n                    [customPrefix]=\"field.customPrefix\"\r\n                    [customParentProperty]=\"field.customParentProperty\"\r\n                    [useCustomAddEditAction]=\"field.useCustomAddEditAction\"\r\n                  >\r\n                  </app-dynamic-form-department>\r\n                </div> -->\r\n\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'translated-vocabulary'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<app-translated-vocabulary-select\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t[arbBindLabel]=\"field.arbBindLabel\"\r\n\t\t\t\t\t\t[engBindLabel]=\"field.engBindLabel\"\r\n\t\t\t\t\t\t[bindValue]=\"field.bindValue\"\r\n\t\t\t\t\t\tplaceholder=\"{{ field.placeholder | translate }}\"\r\n\t\t\t\t\t\t[multiple]=\"field.multiple\"\r\n\t\t\t\t\t\t[searchable]=\"field.searchable\"\r\n\t\t\t\t\t\t[closeOnSelect]=\"field.closeOnSelect\"\r\n\t\t\t\t\t\t[hideSelectedItems]=\"field.hideSelectedItems\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\t[vocbularyId]=\"field.vocbularyId\"\r\n\t\t\t\t\t\t[useFilter]=\"field.useFilter\"\r\n\t\t\t\t\t\t[filter]=\"\r\n\t\t\t\t\t\t\tfield.filter === 'agencyName'\r\n\t\t\t\t\t\t\t\t? agencyNameFilter\r\n\t\t\t\t\t\t\t\t: field.filter === 'countryName'\r\n\t\t\t\t\t\t\t\t? countryNameFilter\r\n\t\t\t\t\t\t\t\t: field.filter === 'orgName'\r\n\t\t\t\t\t\t\t\t? orgNameFilter\r\n\t\t\t\t\t\t\t\t: field.filter === 'ngoName'\r\n\t\t\t\t\t\t\t\t? ngoNameFilter\r\n\t\t\t\t\t\t\t\t: {}\r\n\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t[params]=\"field.params || {}\"\r\n\t\t\t\t\t\t[getByDirectorySuggestion]=\"field.getByDirectorySuggestion\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</app-translated-vocabulary-select>\r\n\t\t\t\t</div>\r\n\t\t\t\t<ng-container *ngIf=\"field.selectable\">\r\n\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\tfieldsCheckBox;\r\n\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\tcheckBoxTemplate: field.template,\r\n\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\"\r\n\t\t\t\t\t></ng-container>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</div>\r\n\r\n\t\t\t<!-- template in client -->\r\n\t\t\t<ng-container *ngIf=\"field.suggest\">\r\n\t\t\t\t<ng-container\r\n\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\tsuggest;\r\n\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\tfield: field.label,\r\n\t\t\t\t\t\t\tsuggestName: field.suggest,\r\n\t\t\t\t\t\t\tcontrolName: field.formControlName,\r\n\t\t\t\t\t\t\ttemplate: field.suggestTemplate\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\"\r\n\t\t\t\t></ng-container>\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #fieldsCheckBox let-checkBoxTemplate=\"checkBoxTemplate\" let-controlName=\"controlName\">\r\n\t<ng-container *ngTemplateOutlet=\"checkBoxTemplate; context: { controlName: controlName }\"> </ng-container>\r\n</ng-template>\r\n\r\n<!-- suggest -->\r\n<ng-template\r\n\t#suggest\r\n\tlet-field=\"field\"\r\n\tlet-suggestName=\"suggestName\"\r\n\tlet-controlName=\"controlName\"\r\n\tlet-template=\"template\"\r\n>\r\n\t<ng-container\r\n\t\t*ngTemplateOutlet=\"\r\n\t\t\ttemplate;\r\n\t\t\tcontext: {\r\n\t\t\t\tfield: field,\r\n\t\t\t\tsuggestName: suggestName,\r\n\t\t\t\tcontrolName: controlName\r\n\t\t\t}\r\n\t\t\"\r\n\t>\r\n\t</ng-container>\r\n</ng-template>\r\n<!-- suggest -->\r\n\r\n<!-- custom label -->\r\n<ng-template #customlabel let-controlName=\"controlName\" let-label=\"label\" let-template=\"template\">\r\n\t<ng-container\r\n\t\t*ngTemplateOutlet=\"\r\n\t\t\ttemplate;\r\n\t\t\tcontext: {\r\n\t\t\t\tlabel: label,\r\n\t\t\t\tcontrolName: controlName\r\n\t\t\t}\r\n\t\t\"\r\n\t>\r\n\t</ng-container>\r\n</ng-template>\r\n<!-- custom label -->\r\n", styles: [".single-field{width:100%}\n"], components: [{ type: DynamicFormTextareaComponent, selector: "app-dynamic-form-textarea", inputs: ["property", "label", "editable", "disabled", "id", "placeholder", "displayEmpty", "horizontalAlign"] }, { type: DynamicFormHijriDateitemComponent, selector: "cts-dynamic-form-hijri-dateitem", inputs: ["minHijri", "maxHijri", "minGreg", "maxGreg", "label", "isDisabled", "range", "vertical", "isReadOnly", "placeholder", "emitOnBlur"], outputs: ["valueChanged"] }, { type: SpellCheckerTextFieldComponent, selector: "ndf-spell-checker-text-field", inputs: ["id", "placeholder", "fieldType", "label"], outputs: ["checkFromText"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: TranslatedVocabularySelectComponent, selector: "app-translated-vocabulary-select", inputs: ["label", "bindValue", "arbBindLabel", "engBindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "clear", "filter", "useFilter", "vocbularyId", "mapingResponse", "params", "getByDirectorySuggestion"], outputs: ["onSelectItems"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2__namespace$4.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__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace$4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i2__namespace$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  DynamicFieldsRendererComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DynamicFieldsRendererComponent, selector: "app-dynamic-fields-renderer", inputs: { form: "form", agencyNameFilter: "agencyNameFilter", countryNameFilter: "countryNameFilter", orgNameFilter: "orgNameFilter", ngoNameFilter: "ngoNameFilter", disableInitSecrecyLevel: "disableInitSecrecyLevel", mode: "mode", fields: "fields" }, outputs: { checkTextSpellCheckerField: "checkTextSpellCheckerField" }, ngImport: i0__namespace, template: "<div [formGroup]=\"form\" *ngIf=\"form\">\r\n\t<div class=\"renderer-container\">\r\n\t\t<div class=\"field-container\" *ngFor=\"let field of fields\">\r\n\t\t\t<div class=\"flex gap-x-2 items-center\" *permission=\"{ name: field.permission, entity: field.formControlName }\">\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'text'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel; else showLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<ng-template #showLabel>\r\n\t\t\t\t\t\t<div class=\"label-style\">\r\n\t\t\t\t\t\t\t{{ field.label | translate }}\r\n\t\t\t\t\t\t\t<span class=\"text-red-500\" *ngIf=\"field.required\">*</span>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</ng-template>\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\tclass=\"field-style\"\r\n\t\t\t\t\t\tid=\"{{ field.formControlName }}\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\tplaceholder=\" {{ field.placeholder | translate }}\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'number'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel; else showLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<ng-template #showLabel>\r\n\t\t\t\t\t\t<div class=\"label-style\">\r\n\t\t\t\t\t\t\t{{ field.label | translate }}\r\n\t\t\t\t\t\t\t<span class=\"text-red-500\" *ngIf=\"field.required\">*</span>\r\n\t\t\t\t\t\t</div>\r\n\t\t\t\t\t</ng-template>\r\n\r\n\t\t\t\t\t<input\r\n\t\t\t\t\t\tmin=\"1\"\r\n\t\t\t\t\t\ttype=\"number\"\r\n\t\t\t\t\t\tclass=\"field-style\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\tplaceholder=\" {{ field.placeholder | translate }}\"\r\n\t\t\t\t\t/>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'textarea'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<app-dynamic-form-textarea\r\n\t\t\t\t\t\t[id]=\"field.formControlName\"\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\tplaceholder=\"{{ field.placeholder | translate }}\"\r\n\t\t\t\t\t\t[disabled]=\"field.disabled\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</app-dynamic-form-textarea>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'date'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<cts-dynamic-form-hijri-dateitem\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t[minHijri]=\"field.minHijri\"\r\n\t\t\t\t\t\t[maxHijri]=\"field.maxHijri\"\r\n\t\t\t\t\t\t[minGreg]=\"field.minGreg\"\r\n\t\t\t\t\t\t[maxGreg]=\"field.maxGreg\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</cts-dynamic-form-hijri-dateitem>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'spellCheckerField'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<ndf-spell-checker-text-field\r\n\t\t\t\t\t\t[id]=\"field.formControlName\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\t[placeholder]=\"field.placeholder\"\r\n\t\t\t\t\t\t[fieldType]=\"field.fieldType\"\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t(checkFromText)=\"checkTextOfSpellCheckField(field.formControlName)\"\r\n\t\t\t\t\t></ndf-spell-checker-text-field>\r\n\t\t\t\t</div>\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'dynamic-vocabulary'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<app-dynamic-form-vocabulary-item\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t[bindLabel]=\"field.bindLabel\"\r\n\t\t\t\t\t\t[bindValue]=\"field.bindValue\"\r\n\t\t\t\t\t\tplaceholder=\"{{ field.placeholder | translate }}\"\r\n\t\t\t\t\t\t[multiple]=\"field.multiple\"\r\n\t\t\t\t\t\t[searchable]=\"field.searchable\"\r\n\t\t\t\t\t\t[closeOnSelect]=\"field.closeOnSelect\"\r\n\t\t\t\t\t\t[disabled]=\"field.disabled\"\r\n\t\t\t\t\t\t[hideSelectedItems]=\"field.hideSelectedItems\"\r\n\t\t\t\t\t\t[vocabularyType]=\"field.vocabularyType\"\r\n\t\t\t\t\t\t[onlyIds]=\"field.onlyIds\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</app-dynamic-form-vocabulary-item>\r\n\t\t\t\t</div>\r\n\r\n\t\t\t\t<!-- <div class=\"single-field mb-3\" *ngIf=\"field.type === 'department-selector'\">\r\n                    <div class=\"label-style\">\r\n                        {{ field.label | translate }}\r\n                        <span class=\"text-red-500\" *ngIf=\"field.required\">*</span>\r\n                    </div>\r\n                    <app-dynamic-form-department\r\n                    [formControlName]=\"field.formControlName\"\r\n                    [placeholder]=\"field.placeholder\"\r\n                    [pp_departmentNestedTree]=\"field.pp_departmentNestedTree\"\r\n                    [pp_departmentTree]=\"field.pp_departmentTree\"\r\n                    [customPrefix]=\"field.customPrefix\"\r\n                    [customParentProperty]=\"field.customParentProperty\"\r\n                    [useCustomAddEditAction]=\"field.useCustomAddEditAction\"\r\n                  >\r\n                  </app-dynamic-form-department>\r\n                </div> -->\r\n\r\n\t\t\t\t<div class=\"single-field mb-3\" *ngIf=\"field.type === 'translated-vocabulary'\">\r\n\t\t\t\t\t<ng-container *ngIf=\"field.customLabel\">\r\n\t\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\t\tcustomlabel;\r\n\t\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\t\tlabel: field.customLabel,\r\n\t\t\t\t\t\t\t\t\ttemplate: field.customLabelTemplate,\r\n\t\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t></ng-container>\r\n\t\t\t\t\t</ng-container>\r\n\t\t\t\t\t<app-translated-vocabulary-select\r\n\t\t\t\t\t\t[label]=\"field.label\"\r\n\t\t\t\t\t\t[arbBindLabel]=\"field.arbBindLabel\"\r\n\t\t\t\t\t\t[engBindLabel]=\"field.engBindLabel\"\r\n\t\t\t\t\t\t[bindValue]=\"field.bindValue\"\r\n\t\t\t\t\t\tplaceholder=\"{{ field.placeholder | translate }}\"\r\n\t\t\t\t\t\t[multiple]=\"field.multiple\"\r\n\t\t\t\t\t\t[searchable]=\"field.searchable\"\r\n\t\t\t\t\t\t[closeOnSelect]=\"field.closeOnSelect\"\r\n\t\t\t\t\t\t[hideSelectedItems]=\"field.hideSelectedItems\"\r\n\t\t\t\t\t\t[formControlName]=\"field.formControlName\"\r\n\t\t\t\t\t\t[vocbularyId]=\"field.vocbularyId\"\r\n\t\t\t\t\t\t[useFilter]=\"field.useFilter\"\r\n\t\t\t\t\t\t[filter]=\"\r\n\t\t\t\t\t\t\tfield.filter === 'agencyName'\r\n\t\t\t\t\t\t\t\t? agencyNameFilter\r\n\t\t\t\t\t\t\t\t: field.filter === 'countryName'\r\n\t\t\t\t\t\t\t\t? countryNameFilter\r\n\t\t\t\t\t\t\t\t: field.filter === 'orgName'\r\n\t\t\t\t\t\t\t\t? orgNameFilter\r\n\t\t\t\t\t\t\t\t: field.filter === 'ngoName'\r\n\t\t\t\t\t\t\t\t? ngoNameFilter\r\n\t\t\t\t\t\t\t\t: {}\r\n\t\t\t\t\t\t\"\r\n\t\t\t\t\t\t[params]=\"field.params || {}\"\r\n\t\t\t\t\t\t[getByDirectorySuggestion]=\"field.getByDirectorySuggestion\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t</app-translated-vocabulary-select>\r\n\t\t\t\t</div>\r\n\t\t\t\t<ng-container *ngIf=\"field.selectable\">\r\n\t\t\t\t\t<ng-container\r\n\t\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\t\tfieldsCheckBox;\r\n\t\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\t\tcheckBoxTemplate: field.template,\r\n\t\t\t\t\t\t\t\tcontrolName: field.formControlName\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\"\r\n\t\t\t\t\t></ng-container>\r\n\t\t\t\t</ng-container>\r\n\t\t\t</div>\r\n\r\n\t\t\t<!-- template in client -->\r\n\t\t\t<ng-container *ngIf=\"field.suggest\">\r\n\t\t\t\t<ng-container\r\n\t\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t\tsuggest;\r\n\t\t\t\t\t\tcontext: {\r\n\t\t\t\t\t\t\tfield: field.label,\r\n\t\t\t\t\t\t\tsuggestName: field.suggest,\r\n\t\t\t\t\t\t\tcontrolName: field.formControlName,\r\n\t\t\t\t\t\t\ttemplate: field.suggestTemplate\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t\"\r\n\t\t\t\t></ng-container>\r\n\t\t\t</ng-container>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #fieldsCheckBox let-checkBoxTemplate=\"checkBoxTemplate\" let-controlName=\"controlName\">\r\n\t<ng-container *ngTemplateOutlet=\"checkBoxTemplate; context: { controlName: controlName }\"> </ng-container>\r\n</ng-template>\r\n\r\n<!-- suggest -->\r\n<ng-template\r\n\t#suggest\r\n\tlet-field=\"field\"\r\n\tlet-suggestName=\"suggestName\"\r\n\tlet-controlName=\"controlName\"\r\n\tlet-template=\"template\"\r\n>\r\n\t<ng-container\r\n\t\t*ngTemplateOutlet=\"\r\n\t\t\ttemplate;\r\n\t\t\tcontext: {\r\n\t\t\t\tfield: field,\r\n\t\t\t\tsuggestName: suggestName,\r\n\t\t\t\tcontrolName: controlName\r\n\t\t\t}\r\n\t\t\"\r\n\t>\r\n\t</ng-container>\r\n</ng-template>\r\n<!-- suggest -->\r\n\r\n<!-- custom label -->\r\n<ng-template #customlabel let-controlName=\"controlName\" let-label=\"label\" let-template=\"template\">\r\n\t<ng-container\r\n\t\t*ngTemplateOutlet=\"\r\n\t\t\ttemplate;\r\n\t\t\tcontext: {\r\n\t\t\t\tlabel: label,\r\n\t\t\t\tcontrolName: controlName\r\n\t\t\t}\r\n\t\t\"\r\n\t>\r\n\t</ng-container>\r\n</ng-template>\r\n<!-- custom label -->\r\n", styles: [".single-field{width:100%}\n"], components: [{ type: DynamicFormTextareaComponent, selector: "app-dynamic-form-textarea", inputs: ["property", "label", "editable", "disabled", "id", "placeholder", "displayEmpty", "horizontalAlign"] }, { type: DynamicFormHijriDateitemComponent, selector: "cts-dynamic-form-hijri-dateitem", inputs: ["minHijri", "maxHijri", "minGreg", "maxGreg", "label", "isDisabled", "range", "vertical", "isReadOnly", "placeholder", "emitOnBlur"], outputs: ["valueChanged"] }, { type: SpellCheckerTextFieldComponent, selector: "ndf-spell-checker-text-field", inputs: ["id", "placeholder", "fieldType", "label"], outputs: ["checkFromText"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: TranslatedVocabularySelectComponent, selector: "app-translated-vocabulary-select", inputs: ["label", "bindValue", "arbBindLabel", "engBindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "clear", "filter", "useFilter", "vocbularyId", "mapingResponse", "params", "getByDirectorySuggestion"], outputs: ["onSelectItems"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2__namespace$4.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__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace$4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i2__namespace$4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DynamicFieldsRendererComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -37100,7 +37180,7 @@
       return FilterComponent;
   }());
   FilterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FilterComponent, deps: [{ token: i2__namespace$4.FormBuilder }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  FilterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FilterComponent, selector: "cts-filter", inputs: { fields: "fields", filterTitle: "filterTitle" }, outputs: { onFiltering: "onFiltering" }, ngImport: i0__namespace, template: "<div class=\"filter-wrapper\">\r\n    <div class=\"filter-title\">\r\n        <!-- {{filterTitle | translate}} -->\r\n    </div>\r\n    <div class=\"iner-filter-wrapper\" *ngIf=\"filterForm\">\r\n        <form [formGroup]=\"filterForm\">\r\n            <div class=\"single-control-wrapper\" *ngFor=\"let field of fields\">\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'text'\">\r\n                    <app-dynamic-form-textitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                      }}\"\r\n                  >\r\n                  </app-dynamic-form-textitem>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'dropdown'\">\r\n                    <app-dynamic-form-vocabulary-item\r\n                    [shwoAllValues]=\"field.shwoAllValues ? field.shwoAllValues : false\"\r\n                    [label]=\"field.label\"\r\n                    [bindLabel]=\"field.bindLabel\"\r\n                    [bindValue]=\"field.bindValue\"\r\n                    [placeholder]=\"field.placeholder | translate\"\r\n                    [multiple]=\"field.multiple\"\r\n                    [searchable]=\"field.searchable\"\r\n                    [closeOnSelect]=\"field.closeOnSelect\"\r\n                    [hideSelectedItems]=\"field.hideSelectedItems\"\r\n                    [vocabularyType]=\"field.vocabularyType\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-vocabulary-item>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'rang'\">\r\n                    <cts-dynamic-form-hijri-dateitem [label]=\"field.label\" [formControlName]=\"field.formControlName\"[range]=\"true\" [vertical]=\"false\" >\r\n                    </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'department'\">\r\n                    <app-dynamic-form-department\r\n                    [label]=\"field.label\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                    }}\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-department>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'toggle'\">\r\n                    <cts-dynamic-form-slide-toggleitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  ></cts-dynamic-form-slide-toggleitem>\r\n                </div>\r\n\r\n                <div   class=\"control\" *ngIf=\"field.type === 'date'\">\r\n                    <cts-dynamic-form-hijri-dateitem\r\n                    [formControlName]=\"field.formControlName\"\r\n                    [label]=\"field.label\"\r\n                  >\r\n                  </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n  \r\n\r\n            </div>\r\n\r\n        </form>\r\n           \r\n    </div>\r\n    <div class=\"form-actions\">\r\n        <button class=\"my-button mx-2\" type=\"button\" (click)=\"filter()\"> {{'FILTER' | translate}}</button>\r\n        <button class=\"my-button reset mx-2\" type=\"button\" (click)=\"reset()\"> {{'reset' | translate}}</button>\r\n    </div>\r\n</div>\r\n\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.filter-wrapper .filter-title{font-size:18px;font-weight:bold;margin-bottom:15px}.filter-wrapper .iner-filter-wrapper{height:320px;overflow:auto;scrollbar-color:#b4bac6 transparent!important;scrollbar-width:thin!important;padding:15px 15px 0}.filter-wrapper .iner-filter-wrapper .single-control-wrapper{margin-bottom:15px}.filter-wrapper .form-actions{display:flex;justify-content:flex-start;align-content:center;padding:10px 15px}.filter-wrapper .form-actions .filter{border:none;background-color:transparent;font-weight:bold;width:80px;height:40px;background-image:linear-gradient(to bottom,#0dbab5,#2e62df);color:#fff;border-radius:5px}\n"], components: [{ type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues"], outputs: ["onSelecting"] }, { type: DynamicFormHijriDateitemComponent, selector: "cts-dynamic-form-hijri-dateitem", inputs: ["minHijri", "maxHijri", "minGreg", "maxGreg", "label", "isDisabled", "range", "vertical", "isReadOnly", "placeholder", "emitOnBlur"], outputs: ["valueChanged"] }, { type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "displayDepTypee", "displayIsAllowRecExternal", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "customParams", "disabled", "nodesExpandedByDefault", "fixedParentNode", "showTreeActions"], outputs: ["onSelecting", "actionClicked", "onDataLoad"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
+  FilterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FilterComponent, selector: "cts-filter", inputs: { fields: "fields", filterTitle: "filterTitle" }, outputs: { onFiltering: "onFiltering" }, ngImport: i0__namespace, template: "<div class=\"filter-wrapper\">\r\n    <div class=\"filter-title\">\r\n        <!-- {{filterTitle | translate}} -->\r\n    </div>\r\n    <div class=\"iner-filter-wrapper\" *ngIf=\"filterForm\">\r\n        <form [formGroup]=\"filterForm\">\r\n            <div class=\"single-control-wrapper\" *ngFor=\"let field of fields\">\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'text'\">\r\n                    <app-dynamic-form-textitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                      }}\"\r\n                  >\r\n                  </app-dynamic-form-textitem>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'dropdown'\">\r\n                    <app-dynamic-form-vocabulary-item\r\n                    [shwoAllValues]=\"field.shwoAllValues ? field.shwoAllValues : false\"\r\n                    [label]=\"field.label\"\r\n                    [bindLabel]=\"field.bindLabel\"\r\n                    [bindValue]=\"field.bindValue\"\r\n                    [placeholder]=\"field.placeholder | translate\"\r\n                    [multiple]=\"field.multiple\"\r\n                    [searchable]=\"field.searchable\"\r\n                    [closeOnSelect]=\"field.closeOnSelect\"\r\n                    [hideSelectedItems]=\"field.hideSelectedItems\"\r\n                    [vocabularyType]=\"field.vocabularyType\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-vocabulary-item>\r\n                </div>\r\n\r\n                <div class=\"control\" *ngIf=\"field.type === 'rang'\">\r\n                    <cts-dynamic-form-hijri-dateitem [label]=\"field.label\" [formControlName]=\"field.formControlName\"[range]=\"true\" [vertical]=\"false\" >\r\n                    </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'department'\">\r\n                    <app-dynamic-form-department\r\n                    [label]=\"field.label\"\r\n                    placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{\r\n                        field.placeholder | translate\r\n                    }}\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  >\r\n                  </app-dynamic-form-department>\r\n                </div>\r\n\r\n                <div  class=\"control\" *ngIf=\"field.type === 'toggle'\">\r\n                    <cts-dynamic-form-slide-toggleitem\r\n                    [label]=\"field.label\"\r\n                    [formControlName]=\"field.formControlName\"\r\n                  ></cts-dynamic-form-slide-toggleitem>\r\n                </div>\r\n\r\n                <div   class=\"control\" *ngIf=\"field.type === 'date'\">\r\n                    <cts-dynamic-form-hijri-dateitem\r\n                    [formControlName]=\"field.formControlName\"\r\n                    [label]=\"field.label\"\r\n                  >\r\n                  </cts-dynamic-form-hijri-dateitem>\r\n                </div>\r\n  \r\n\r\n            </div>\r\n\r\n        </form>\r\n           \r\n    </div>\r\n    <div class=\"form-actions\">\r\n        <button class=\"my-button mx-2\" type=\"button\" (click)=\"filter()\"> {{'FILTER' | translate}}</button>\r\n        <button class=\"my-button reset mx-2\" type=\"button\" (click)=\"reset()\"> {{'reset' | translate}}</button>\r\n    </div>\r\n</div>\r\n\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.filter-wrapper .filter-title{font-size:18px;font-weight:bold;margin-bottom:15px}.filter-wrapper .iner-filter-wrapper{height:320px;overflow:auto;scrollbar-color:#b4bac6 transparent!important;scrollbar-width:thin!important;padding:15px 15px 0}.filter-wrapper .iner-filter-wrapper .single-control-wrapper{margin-bottom:15px}.filter-wrapper .form-actions{display:flex;justify-content:flex-start;align-content:center;padding:10px 15px}.filter-wrapper .form-actions .filter{border:none;background-color:transparent;font-weight:bold;width:80px;height:40px;background-image:linear-gradient(to bottom,#0dbab5,#2e62df);color:#fff;border-radius:5px}\n"], components: [{ type: DynamicFormTextItemComponent, selector: "app-dynamic-form-textitem", inputs: ["autoComplete", "nativeAutoComplete", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "autoCompleteType", "tenantId", "emitFullObject", "outsideParams", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id", "maxCharsNum"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: DynamicFormHijriDateitemComponent, selector: "cts-dynamic-form-hijri-dateitem", inputs: ["minHijri", "maxHijri", "minGreg", "maxGreg", "label", "isDisabled", "range", "vertical", "isReadOnly", "placeholder", "emitOnBlur"], outputs: ["valueChanged"] }, { type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "displayDepTypee", "displayIsAllowRecExternal", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "customParams", "disabled", "nodesExpandedByDefault", "fixedParentNode", "showTreeActions"], outputs: ["onSelecting", "actionClicked", "onDataLoad"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: FilterComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -45137,6 +45217,13 @@
           var _colors = __spreadArray(__spreadArray([], __read(((config === null || config === void 0 ? void 0 : config.colors) || []))), __read(getColors()));
           return Object.assign(Object.assign({}, config), { colors: _colors, chart: chart });
       };
+      /**
+       * Prepares a custom chart configuration
+       * @param config
+       */
+      ReportConfigMapperService.prototype.prepareCustomConfig = function (config) {
+          return config;
+      };
       /**
        * Prepares a digit chart configuration
        * @param config The digit chart definition
@@ -45184,6 +45271,138 @@
                   }]
           }], ctorParameters: function () { return [{ type: ChartPluginsRegistry }]; } });
 
+  var CustomReportsRegistry = /** @class */ (function () {
+      function CustomReportsRegistry(_factoryResolver) {
+          this._factoryResolver = _factoryResolver;
+          this._components = new Map();
+      }
+      /**
+       * Register a component with the registry
+       * @param config Component configuration
+       */
+      CustomReportsRegistry.prototype.registerComponent = function (config) {
+          if (!config.type || !config.component) {
+              throw new Error('Invalid component configuration: type and component are required');
+          }
+          if (this._components.has(config.type)) {
+              console.warn("Component with type '" + config.type + "' is already registered. Overwriting...");
+          }
+          this._components.set(config.type, config);
+      };
+      /**
+       * Register multiple components at once
+       * @param configs Array of component configurations
+       */
+      CustomReportsRegistry.prototype.registerComponents = function (configs) {
+          var _this = this;
+          configs.forEach(function (config) { return _this.registerComponent(config); });
+      };
+      /**
+       * Render a component by type into a ViewContainerRef
+       * @param type Component type identifier
+       * @param vcr ViewContainerRef to render into
+       */
+      CustomReportsRegistry.prototype.renderComponent = function (type, vcr) {
+          if (!this._components.has(type)) {
+              throw new Error("Unknown component with type: '" + type + "'");
+          }
+          var config = this._components.get(type);
+          return this.loadComponent(config, vcr);
+      };
+      /**
+       * Load a component into a ViewContainerRef
+       * @param config Component configuration
+       * @param vcr ViewContainerRef to render into
+       */
+      CustomReportsRegistry.prototype.loadComponent = function (config, vcr) {
+          var componentFactory = this._factoryResolver.resolveComponentFactory(config.component);
+          return vcr.createComponent(componentFactory);
+      };
+      /**
+       * Check if a component is registered
+       * @param type Component type identifier
+       */
+      CustomReportsRegistry.prototype.hasComponent = function (type) {
+          return this._components.has(type);
+      };
+      /**
+       * Get component configuration by type
+       * @param type Component type identifier
+       */
+      CustomReportsRegistry.prototype.getComponent = function (type) {
+          return this._components.get(type);
+      };
+      /**
+       * Get all registered component types
+       */
+      CustomReportsRegistry.prototype.getComponentTypes = function () {
+          return Array.from(this._components.keys());
+      };
+      /**
+       * Get all registered components
+       */
+      CustomReportsRegistry.prototype.getAllComponents = function () {
+          return Array.from(this._components.values());
+      };
+      /**
+       * Get components by category
+       * @param category Category to filter by
+       */
+      CustomReportsRegistry.prototype.getComponentsByCategory = function (category) {
+          return Array.from(this._components.values()).filter(function (config) { return config.category === category; });
+      };
+      /**
+       * Get all unique categories
+       */
+      CustomReportsRegistry.prototype.getCategories = function () {
+          var categories = Array.from(this._components.values())
+              .map(function (config) { return config.category; })
+              .filter(function (category) { return !!category; });
+          return __spreadArray([], __read(new Set(categories)));
+      };
+      /**
+       * Unregister a component
+       * @param type Component type identifier
+       */
+      CustomReportsRegistry.prototype.unregisterComponent = function (type) {
+          return this._components.delete(type);
+      };
+      /**
+       * Clear all registered components
+       */
+      CustomReportsRegistry.prototype.clearComponents = function () {
+          this._components.clear();
+      };
+      /**
+       * Get the total number of registered components
+       */
+      CustomReportsRegistry.prototype.getComponentCount = function () {
+          return this._components.size;
+      };
+      /**
+       * Search components by name or type
+       * @param searchTerm Search term
+       */
+      CustomReportsRegistry.prototype.searchComponents = function (searchTerm) {
+          var term = searchTerm.toLowerCase();
+          return Array.from(this._components.values()).filter(function (config) {
+              var _a, _b;
+              return config.type.toLowerCase().includes(term) ||
+                  ((_a = config.name) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(term)) ||
+                  ((_b = config.description) === null || _b === void 0 ? void 0 : _b.toLowerCase().includes(term));
+          });
+      };
+      return CustomReportsRegistry;
+  }());
+  CustomReportsRegistry.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomReportsRegistry, deps: [{ token: i0__namespace.ComponentFactoryResolver }], target: i0__namespace.ɵɵFactoryTarget.Injectable });
+  CustomReportsRegistry.ɵprov = i0__namespace.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomReportsRegistry, providedIn: 'root' });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomReportsRegistry, decorators: [{
+              type: i0.Injectable,
+              args: [{
+                      providedIn: 'root'
+                  }]
+          }], ctorParameters: function () { return [{ type: i0__namespace.ComponentFactoryResolver }]; } });
+
   var DigitChartComponent = /** @class */ (function (_super) {
       __extends(DigitChartComponent, _super);
       function DigitChartComponent() {
@@ -45288,7 +45507,7 @@
       return GraphChartComponent;
   }(BaseChart));
   GraphChartComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: GraphChartComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  GraphChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: GraphChartComponent, selector: "app-graph-chart", usesInheritance: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"report$ | async as report\">\r\n\t<div class=\"chart-legends\"></div>\r\n\t<app-chart\r\n\t\t[type]=\"report.config.type\"\r\n\t\t[data]=\"report.data\"\r\n\t\t[options]=\"report.config?.options\"\r\n\t\t[plugins]=\"report.config?.plugins\"\r\n\t\t[responsive]=\"true\"\r\n\t\t(onReady)=\"chartReady($event)\"\r\n\t\tclass=\"app-chart\"\r\n\t></app-chart>\r\n</ng-container>\r\n", styles: [":host{--chart-height: var(--graph-chart-height, 300px);display:var(--graph-chart-display, flex);flex-direction:var(--graph-chart-direction, row);justify-content:var(--graph-chart-justify-content, between);align-items:var(--graph-chart-align-items, center);grid-gap:var(--graph-chart-gap, .5rem);gap:var(--graph-chart-gap, .5rem)}.app-chart{min-width:var(--app-chart-min-width, 0);min-height:var(--app-chart-min-height, 0);height:var(--app-chart-height, auto);width:var(--app-chart-width, 100%);padding:var(--app-chart-padding, 1rem);display:flex;align-items:center;justify-content:center;align-self:stretch}@media print{.app-chart ::ng-deep canvas{max-width:100%!important}}::ng-deep .chart-legends{max-height:var(--chart-legends-height, var(--chart-height));min-width:var(--chart-legends-width, 0);overflow:auto;font-size:1rem;text-align:start;display:flex;flex-direction:column;grid-gap:.2rem;gap:.2rem;padding-block:.5rem}::ng-deep .chart-legends:empty{--chart-legends-width: 0;display:none}::ng-deep .chart-legends.has-items{--chart-legends-width: 200px}::ng-deep .chart-legends__legend{display:flex;align-items:baseline;-webkit-user-select:none;user-select:none;cursor:default}::ng-deep .chart-legends__box{width:var(--chart-legends-box-width, 8px);height:var(--chart-legends-box-height, 8px);border-radius:var(--chart-legends-radius, 50%);margin-inline:var(--chart-legends-box-inline, 0 .5rem);display:inline-block;flex-shrink:0}\n"], components: [{ type: ChartComponent, selector: "app-chart", inputs: ["data", "options"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4__namespace$1.AsyncPipe } });
+  GraphChartComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: GraphChartComponent, selector: "app-graph-chart", usesInheritance: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"report$ | async as report\">\r\n\t<div class=\"chart-legends\"></div>\r\n\t<app-chart\r\n\t\t[type]=\"report.config.type\"\r\n\t\t[data]=\"report.data\"\r\n\t\t[options]=\"report.config?.options\"\r\n\t\t[plugins]=\"report.config?.plugins\"\r\n\t\t[responsive]=\"true\"\r\n\t\t(onReady)=\"chartReady($event)\"\r\n\t\tclass=\"app-chart\"\r\n\t></app-chart>\r\n</ng-container>\r\n", styles: [":host{--chart-height: var(--graph-chart-height, 330px);display:var(--graph-chart-display, flex);flex-direction:var(--graph-chart-direction, row);justify-content:var(--graph-chart-justify-content, between);align-items:var(--graph-chart-align-items, center);grid-gap:var(--graph-chart-gap, .5rem);gap:var(--graph-chart-gap, .5rem)}.app-chart{min-width:var(--app-chart-min-width, 0);min-height:var(--app-chart-min-height, 0);height:var(--app-chart-height, auto);width:var(--app-chart-width, 100%);padding:var(--app-chart-padding, 1rem);display:flex;align-items:center;justify-content:center;align-self:stretch}@media print{.app-chart ::ng-deep canvas{max-width:100%!important}}::ng-deep .chart-legends{max-height:var(--chart-legends-height, var(--chart-height));min-width:var(--chart-legends-width, 0);overflow:auto;font-size:1rem;text-align:start;display:flex;flex-direction:column;grid-gap:.2rem;gap:.2rem;padding-block:.5rem}::ng-deep .chart-legends:empty{--chart-legends-width: 0;display:none}::ng-deep .chart-legends.has-items{--chart-legends-width: 200px}::ng-deep .chart-legends__legend{display:flex;align-items:baseline;-webkit-user-select:none;user-select:none;cursor:default}::ng-deep .chart-legends__box{width:var(--chart-legends-box-width, 8px);height:var(--chart-legends-box-height, 8px);border-radius:var(--chart-legends-radius, 50%);margin-inline:var(--chart-legends-box-inline, 0 .5rem);display:inline-block;flex-shrink:0}\n"], components: [{ type: ChartComponent, selector: "app-chart", inputs: ["data", "options"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4__namespace$1.AsyncPipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: GraphChartComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -45309,6 +45528,7 @@
       graph: 'graph',
       digit: 'digit',
       dynamicLine: 'dynamicLine',
+      custom: 'custom',
   };
 
   var TIME_GROUPS = {
@@ -45372,6 +45592,7 @@
               _a[REPORT_MODE.graph] = this._configMapperService.prepareGraphConfig,
               _a[REPORT_MODE.digit] = this._configMapperService.prepareDigitConfig,
               _a[REPORT_MODE.dynamicLine] = this._configMapperService.prepareGraphLineConfig,
+              _a[REPORT_MODE.custom] = this._configMapperService.prepareCustomConfig,
               _a);
           return mappers[obj.mode].call(this._configMapperService, obj);
       };
@@ -45922,6 +46143,125 @@
                   args: ['graphChart']
               }] } });
 
+  var BaseCustomReport = /** @class */ (function (_super) {
+      __extends(BaseCustomReport, _super);
+      function BaseCustomReport(injector) {
+          var _this = _super.call(this) || this;
+          _this.injector = injector;
+          _this._chartHelperService = _this.injector.get(ChartManagerService);
+          _this.direction = 'rtl';
+          _this._criteriaSub = new rxjs.ReplaySubject(null);
+          _this.criteria$ = _this._criteriaSub.asObservable();
+          _this._configSub = new rxjs.BehaviorSubject(null);
+          _this.config$ = _this._configSub.asObservable();
+          return _this;
+      }
+      Object.defineProperty(BaseCustomReport.prototype, "criteria", {
+          set: function (value) {
+              this._criteria = ___default["default"].cloneDeep(value);
+              this._criteriaSub.next(this._criteria);
+          },
+          enumerable: false,
+          configurable: true
+      });
+      Object.defineProperty(BaseCustomReport.prototype, "config", {
+          get: function () {
+              return this._configSub.getValue();
+          },
+          set: function (obj) {
+              if (obj) {
+                  this._configSub.next(obj);
+              }
+          },
+          enumerable: false,
+          configurable: true
+      });
+      BaseCustomReport.prototype.chartReady = function (chart) {
+          var _this = this;
+          this.chart = chart;
+          this._chartHelperService.setChart(chart);
+          this._printListener = function (event) {
+              _this.chart.resize();
+          };
+          window.addEventListener('beforeprint', this._printListener);
+          queueMicrotask(function () {
+              _this.chart.resize();
+          });
+      };
+      return BaseCustomReport;
+  }(DestroySubject));
+  BaseCustomReport.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BaseCustomReport, deps: [{ token: i0__namespace.Injector }], target: i0__namespace.ɵɵFactoryTarget.Directive });
+  BaseCustomReport.ɵdir = i0__namespace.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: BaseCustomReport, inputs: { direction: "direction", data: "data", criteria: "criteria", config: "config" }, usesInheritance: true, ngImport: i0__namespace });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BaseCustomReport, decorators: [{
+              type: i0.Directive
+          }], ctorParameters: function () { return [{ type: i0__namespace.Injector }]; }, propDecorators: { direction: [{
+                  type: i0.Input
+              }], data: [{
+                  type: i0.Input
+              }], criteria: [{
+                  type: i0.Input
+              }], config: [{
+                  type: i0.Input
+              }] } });
+
+  var CustomReportComponent = /** @class */ (function (_super) {
+      __extends(CustomReportComponent, _super);
+      function CustomReportComponent() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+          _this._registeredComponents = _this.injector.get(CustomReportsRegistry);
+          return _this;
+      }
+      CustomReportComponent.prototype.ngOnInit = function () {
+          var _a, _b;
+          var componentType = this._registeredComponents.getComponent((_a = this.config) === null || _a === void 0 ? void 0 : _a.type);
+          if (!componentType) {
+              console.warn("No component registered for type: " + ((_b = this.config) === null || _b === void 0 ? void 0 : _b.type));
+              return;
+          }
+          this._componentRef = this._registeredComponents.renderComponent(componentType.type, this.container);
+          this._prepareComponent();
+      };
+      CustomReportComponent.prototype.ngOnChanges = function (changes) {
+          var _this = this;
+          if (!this._componentRef) {
+              return;
+          }
+          Object.keys(changes).forEach(function (key) {
+              _this._componentRef.instance[key] = changes[key].currentValue;
+          });
+          this._componentRef.changeDetectorRef.markForCheck();
+      };
+      CustomReportComponent.prototype.ngOnDestroy = function () {
+          if (this._componentRef) {
+              this._componentRef.destroy();
+          }
+      };
+      CustomReportComponent.prototype._prepareComponent = function () {
+          var instance = this._componentRef.instance;
+          instance.config = this.config;
+          instance.criteria = this.criteria;
+          instance.data = this.data;
+          instance.direction = this.direction;
+      };
+      return CustomReportComponent;
+  }(BaseReport));
+  CustomReportComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomReportComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+  CustomReportComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CustomReportComponent, selector: "app-custom-report", host: { classAttribute: "custom-report flex flex-col flex-grow" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["dynamicContainer"], descendants: true, read: i0.ViewContainerRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0__namespace, template: "<chart-panel *ngIf=\"config$ | async as config\" class=\"ndf-report chart-report\">\r\n\t<chart-panel-header class=\"ndf-report__header mb-3\">\r\n\t\t<span>\r\n\t\t\t{{ config.label | translate }}\r\n\t\t</span>\r\n\t\t<!--<button\r\n      *ngIf=\"config?.dialog?.active\"\r\n      class=\"dialog-button print:hidden\"\r\n      (click)=\"openGraphDialog()\"\r\n      [matTooltip]=\"'REPORTS.fullscreen' | translate\"\r\n    >\r\n      <mat-icon>fullscreen</mat-icon>\r\n    </button>-->\r\n\t</chart-panel-header>\r\n\r\n\t<ng-container #dynamicContainer></ng-container>\r\n\r\n\t<chart-panel-footer class=\"ndf-report__footer flex-wrap\">\r\n\t\t<app-report-actions\r\n\t\t\t[config]=\"config\"\r\n\t\t\t(print)=\"printChart()\"\r\n\t\t\t(navigate)=\"navigate()\"\r\n\t\t\t(open)=\"onOpen.emit(null)\"\r\n\t\t></app-report-actions>\r\n\t</chart-panel-footer>\r\n</chart-panel>\r\n", styles: [""], components: [{ type: ChartPanel, selector: "chart-panel" }, { type: ChartPanelHeaderComponent, selector: "chart-panel-header" }, { type: ChartPanelFooterComponent, selector: "chart-panel-footer" }, { type: ReportActionsComponent, selector: "app-report-actions", inputs: ["config"], outputs: ["navigate", "open", "print"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i4__namespace$1.AsyncPipe, "translate": i1__namespace.TranslatePipe } });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CustomReportComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: 'app-custom-report',
+                      templateUrl: './custom-report.component.html',
+                      styleUrls: ['./custom-report.component.scss'],
+                      host: {
+                          class: 'custom-report flex flex-col flex-grow'
+                      }
+                  }]
+          }], propDecorators: { container: [{
+                  type: i0.ViewChild,
+                  args: ['dynamicContainer', { read: i0.ViewContainerRef, static: true }]
+              }] } });
+
   function mapToNdfTableConfig(report, details) {
       var _a, _b, _c, _d, _e;
       var _request = report.request;
@@ -46338,7 +46678,7 @@
           DynamicTimelineReportComponent,
           TimeGroupSelectorComponent,
           GraphDialogComponent,
-          TimelineDialogComponent, ScrollableDivDirective, GraphChartComponent, DigitChartComponent, ReportActionsComponent], imports: [i4.CommonModule,
+          TimelineDialogComponent, ScrollableDivDirective, GraphChartComponent, DigitChartComponent, ReportActionsComponent, CustomReportComponent], imports: [i4.CommonModule,
           i1.TranslateModule,
           i3$2.MatMenuModule,
           i2$2.MatIconModule,
@@ -46383,7 +46723,7 @@
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NdfReportsModule, decorators: [{
               type: i0.NgModule,
               args: [{
-                      declarations: [CONTAINERS, COMPONENTS, DIRECTIVES, CHARTS, ReportActionsComponent],
+                      declarations: [CONTAINERS, COMPONENTS, DIRECTIVES, CHARTS, ReportActionsComponent, CustomReportComponent],
                       imports: [
                           i4.CommonModule,
                           i1.TranslateModule,
@@ -47676,7 +48016,7 @@
                       {
                           aggregation: 'RetentionInfo_activeRetentionExpireDate_agg',
                           propertyPath: 'aggregations.RetentionInfo_activeRetentionExpireDate_agg.buckets',
-                          transformer: 'removeTime',
+                          transformer: 'timeFormat',
                       },
                   ],
                   chart: {
@@ -48600,6 +48940,7 @@
   exports.CustomFieldComponent = CustomFieldComponent;
   exports.CustomMomentDateAdapter = CustomMomentDateAdapter;
   exports.CustomPpViewerComponent = CustomPpViewerComponent;
+  exports.CustomReportsRegistry = CustomReportsRegistry;
   exports.CustomSocketComponent = CustomSocketComponent;
   exports.CustomTemplateDirective = CustomTemplateDirective;
   exports.CustomToastrModule = CustomToastrModule;