nuxeo-development-framework 0.9.5 → 0.9.8

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

@@ -7894,6 +7894,7 @@
             /** is tree searchable */
             this.searchable = true;
             this.defaultSelect = false;
+            this.returnItemUid = false;
             /** emitted when item is selected */
             this.onSelecting = new i0.EventEmitter();
             /** emitted when action is clicked */
@@ -7975,7 +7976,7 @@
                                                         : item.properties
                                                             ? item.properties[this.customPrefix ? (this.customPrefix + ':englishName') : 'dept:englishName']
                                                             : '--',
-                                                    value: this.multiple ? item.uid : item.title,
+                                                    value: this.returnItemUid ? item.uid : (this.multiple ? item.uid : item.title),
                                                 };
                                             treeItem = new i1$2.TreeviewItem(Object.assign(Object.assign(Object.assign({}, treeViewObj), { collapsed: level >= 2 && this.treeview ? true : false }), (this.multiple && { checked: false })));
                                             if (!(item.contextParameters &&
@@ -8067,7 +8068,7 @@
         return DynamicFormDepartmentComponent;
     }());
     DynamicFormDepartmentComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicFormDepartmentComponent, deps: [{ token: TranslationService$1 }, { token: DepartmentApiService }, { token: i3__namespace.NgControl, optional: true, self: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    DynamicFormDepartmentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: { treeview: "treeview", treeViewAsFormControl: "treeViewAsFormControl", placeholder: "placeholder", multiple: "multiple", searchable: "searchable", label: "label", defaultSelect: "defaultSelect", pp_departmentNestedTree: "pp_departmentNestedTree", pp_departmentTree: "pp_departmentTree", customPrefix: "customPrefix", useCustomAddEditAction: "useCustomAddEditAction", customParentProperty: "customParentProperty" }, outputs: { onSelecting: "onSelecting", actionClicked: "actionClicked" }, 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 m-1\">*</span></label\r\n    >\r\n  </div>\r\n</ng-container>\r\n<app-dynamic-form-treeview-select\r\n  [treeview]=\"treeview\"\r\n  [treeViewAsFormControl]=\"treeViewAsFormControl\"\r\n  [defaultSelect]=\"defaultSelect\"\r\n  [multiple]=\"multiple\"\r\n  [items]=\"data\"\r\n  [pp_departmentNestedTree]=\"pp_departmentNestedTree\"\r\n  [useCustomAddEditAction]=\"useCustomAddEditAction\"\r\n  [customPrefix]=\"customPrefix\"\r\n  [customParentProperty]=\"customParentProperty\"\r\n  (valueChange)=\"getSelecteditems($event)\"\r\n  [(value)]=\"selection\"\r\n  (actionClicked)=\"onAction($event)\"\r\n  class=\"dropdown-wrapper\"\r\n  [ngClass]=\"{'input-filled' : selection && selection.length > 0 }\"\r\n>\r\n</app-dynamic-form-treeview-select>\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      {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n    </li>\r\n  </ul>\r\n</mat-error>\r\n", styles: ["app-dynamic-form-department .dropdown{border:1px solid #ccc!important;border-radius:5px!important}app-dynamic-form-department .input-filled .dropdown{border-color:#1a96c6!important}\n"], components: [{ type: TreeviewSelectComponent, selector: "app-dynamic-form-treeview-select", inputs: ["treeview", "treeViewAsFormControl", "config", "items", "value", "multiple", "defaultSelect", "pp_departmentNestedTree", "useCustomAddEditAction", "customPrefix", "customParentProperty"], outputs: ["valueChange", "plusClicked", "actionClicked"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace$1.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    DynamicFormDepartmentComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: { treeview: "treeview", treeViewAsFormControl: "treeViewAsFormControl", placeholder: "placeholder", multiple: "multiple", searchable: "searchable", label: "label", defaultSelect: "defaultSelect", pp_departmentNestedTree: "pp_departmentNestedTree", pp_departmentTree: "pp_departmentTree", customPrefix: "customPrefix", useCustomAddEditAction: "useCustomAddEditAction", customParentProperty: "customParentProperty", returnItemUid: "returnItemUid" }, outputs: { onSelecting: "onSelecting", actionClicked: "actionClicked" }, 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 m-1\">*</span></label\r\n    >\r\n  </div>\r\n</ng-container>\r\n<app-dynamic-form-treeview-select\r\n  [treeview]=\"treeview\"\r\n  [treeViewAsFormControl]=\"treeViewAsFormControl\"\r\n  [defaultSelect]=\"defaultSelect\"\r\n  [multiple]=\"multiple\"\r\n  [items]=\"data\"\r\n  [pp_departmentNestedTree]=\"pp_departmentNestedTree\"\r\n  [useCustomAddEditAction]=\"useCustomAddEditAction\"\r\n  [customPrefix]=\"customPrefix\"\r\n  [customParentProperty]=\"customParentProperty\"\r\n  (valueChange)=\"getSelecteditems($event)\"\r\n  [(value)]=\"selection\"\r\n  (actionClicked)=\"onAction($event)\"\r\n  class=\"dropdown-wrapper\"\r\n  [ngClass]=\"{'input-filled' : selection && selection.length > 0 }\"\r\n>\r\n</app-dynamic-form-treeview-select>\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      {{ \"VALIDATORS.REQUIRED\" | translate }}\r\n    </li>\r\n  </ul>\r\n</mat-error>\r\n", styles: ["app-dynamic-form-department .dropdown{border:1px solid #ccc!important;border-radius:5px!important}app-dynamic-form-department .input-filled .dropdown{border-color:#1a96c6!important}\n"], components: [{ type: TreeviewSelectComponent, selector: "app-dynamic-form-treeview-select", inputs: ["treeview", "treeViewAsFormControl", "config", "items", "value", "multiple", "defaultSelect", "pp_departmentNestedTree", "useCustomAddEditAction", "customPrefix", "customParentProperty"], outputs: ["valueChange", "plusClicked", "actionClicked"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i6__namespace$1.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicFormDepartmentComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -8106,6 +8107,8 @@
                     type: i0.Input
                 }], customParentProperty: [{
                     type: i0.Input
+                }], returnItemUid: [{
+                    type: i0.Input
                 }], onSelecting: [{
                     type: i0.Output
                 }], actionClicked: [{
@@ -10158,7 +10161,7 @@
         return UserSelectorWrapperComponent;
     }());
     UserSelectorWrapperComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: UserSelectorWrapperComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
-    UserSelectorWrapperComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: UserSelectorWrapperComponent, selector: "lib-user-selector-wrapper", inputs: { value: "value", multipleMode: "multipleMode", customOptions: "customOptions" }, outputs: { valueChange: "valueChange" }, ngImport: i0__namespace, template: "<cts-dynamic-form-select-users placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{'CREATE.USER' | translate}}\"\r\n  [multiple]=\"multipleMode\"\r\n  [searchable]=\"true\"\r\n  [bindLabel]=\"'fullName'\"\r\n  [closeOnSelect]=\"!multipleMode\"\r\n  [searchable]=\"true\"\r\n  [deptTitle]=\"'all'\"\r\n  [preSelectedValues]=\"[]\"\r\n  [usePreSelectedValue]=\"true\"\r\n  (onSelectItems)=\"executeFunction($event)\"\r\n  (ngModelChange)=\"checkChange($event)\"\r\n  [(ngModel)]=\"bindedValue\" >\r\n</cts-dynamic-form-select-users>\r\n  <!--  -->\r\n\r\n<!-- <div>{{customOptions | json}}</div>\r\n<div>{{multipleMode}}</div> -->", styles: [""], components: [{ type: DynamicFormSelectUsersComponent, selector: "cts-dynamic-form-select-users", inputs: ["deptTitle", "label", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "preSelectedValues", "usePreSelectedValue", "disabled", "filter"], outputs: ["onSelectItems"] }], directives: [{ type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    UserSelectorWrapperComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: UserSelectorWrapperComponent, selector: "lib-user-selector-wrapper", inputs: { value: "value", multipleMode: "multipleMode", customOptions: "customOptions" }, outputs: { valueChange: "valueChange" }, ngImport: i0__namespace, template: "<cts-dynamic-form-select-users placeholder=\"{{ 'CREATE.PLACE_HOLDER' | translate }} {{'CREATE.USER' | translate}}\"\n  [multiple]=\"multipleMode\"\n  [searchable]=\"true\"\n  [bindLabel]=\"'fullName'\"\n  [closeOnSelect]=\"!multipleMode\"\n  [searchable]=\"true\"\n  [deptTitle]=\"'all'\"\n  [preSelectedValues]=\"[]\"\n  [usePreSelectedValue]=\"true\"\n  (onSelectItems)=\"executeFunction($event)\"\n  (ngModelChange)=\"checkChange($event)\"\n  [(ngModel)]=\"bindedValue\" >\n</cts-dynamic-form-select-users>\n  <!--  -->\n\n<!-- <div>{{customOptions | json}}</div>\n<div>{{multipleMode}}</div> -->", styles: [""], components: [{ type: DynamicFormSelectUsersComponent, selector: "cts-dynamic-form-select-users", inputs: ["deptTitle", "label", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "preSelectedValues", "usePreSelectedValue", "disabled", "filter"], outputs: ["onSelectItems"] }], directives: [{ type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: UserSelectorWrapperComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -13271,7 +13274,7 @@
         return CutomeVocViewerComponent;
     }());
     CutomeVocViewerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CutomeVocViewerComponent, deps: [{ token: TranslationService$1 }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CutomeVocViewerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CutomeVocViewerComponent, selector: "lib-cutome-voc-viewer", inputs: { type: "type", group: "group" }, ngImport: i0__namespace, template: "<span *ngIf=\"group\">\r\n    <span *ngIf=\"type === 'vocabulary'\">\r\n        {{\r\n          \"vocabulary.\" + group.fetchedKey.directoryName + \".\" + group.key | translate\r\n        }}\r\n      </span>\r\n      <span  *ngIf=\"type === 'custom-voc'\">\r\n        {{\r\n          isArabic\r\n            ? group.fetchedKey.properties.label_ar\r\n            : group.fetchedKey.properties.label_en\r\n        }}\r\n      </span>\r\n</span>\r\n", styles: [""], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    CutomeVocViewerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CutomeVocViewerComponent, selector: "lib-cutome-voc-viewer", inputs: { type: "type", group: "group" }, ngImport: i0__namespace, template: "<span *ngIf=\"group\">\n    <span *ngIf=\"type === 'vocabulary'\">\n        {{\n          \"vocabulary.\" + group.fetchedKey.directoryName + \".\" + group.key | translate\n        }}\n      </span>\n      <span  *ngIf=\"type === 'custom-voc'\">\n        {{\n          isArabic\n            ? group.fetchedKey.properties.label_ar\n            : group.fetchedKey.properties.label_en\n        }}\n      </span>\n</span>\n", styles: [""], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CutomeVocViewerComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -13296,7 +13299,6 @@
                 propertyEn: 'dc:title',
                 filterParam: 'category_code'
             };
-            this.config = Object.assign(Object.assign({}, this.config), this.defaultConfig);
         }
         CustomPpViewerComponent.prototype.ngOnInit = function () {
             var _this = this;
@@ -13310,13 +13312,14 @@
         CustomPpViewerComponent.prototype.getData = function () {
             var _c;
             var _this = this;
+            var _a, _b;
             if (this.dynamicViewService.getDataFromStoredAggregation(this.group.key)) {
                 var storedAggreg = this.dynamicViewService.getDataFromStoredAggregation(this.group.key);
                 this.data = storedAggreg ? storedAggreg['data'] : null;
             }
             else {
                 var params = (_c = {},
-                    _c[this.config.filterParam] = this.group.key,
+                    _c[((_a = this.config) === null || _a === void 0 ? void 0 : _a.filterParam) ? (_b = this.config) === null || _b === void 0 ? void 0 : _b.filterParam : this.defaultConfig.filterParam] = this.group.key,
                     _c);
                 this.callApi.query(Object.assign({ pageProvider: this.pageProvider }, params), {
                     headers: {
@@ -13335,7 +13338,7 @@
         return CustomPpViewerComponent;
     }());
     CustomPpViewerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CustomPpViewerComponent, deps: [{ token: DynamicVieweService }, { token: CallApiService }, { token: TranslationService$1 }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CustomPpViewerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CustomPpViewerComponent, selector: "lib-custom-pp-viewer", inputs: { pageProvider: "pageProvider", group: "group", config: "config" }, ngImport: i0__namespace, template: "<span *ngIf=\"data\">\r\n    {{isArabic ? data[config.propertyAr] : data[config.propertyEn]}}\r\n</span>", styles: [""], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    CustomPpViewerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CustomPpViewerComponent, selector: "lib-custom-pp-viewer", inputs: { pageProvider: "pageProvider", group: "group", config: "config" }, ngImport: i0__namespace, template: "<span *ngIf=\"data\">\r\n    {{isArabic ? data[config.propertyAr ? config.propertyAr : defaultConfig.propertyAr] : data[config.propertyEn ? config.propertyEn : defaultConfig.propertyEn]}}\r\n</span>", styles: [""], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CustomPpViewerComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -13393,7 +13396,7 @@
         return CustomDocumentViewerComponent;
     }());
     CustomDocumentViewerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CustomDocumentViewerComponent, deps: [{ token: CallApiService }, { token: DynamicVieweService }, { token: TranslationService$1 }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CustomDocumentViewerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CustomDocumentViewerComponent, selector: "lib-custom-document-viewer", inputs: { pageProvider: "pageProvider", group: "group" }, ngImport: i0__namespace, template: "<span *ngIf=\"data\">\r\n    {{isArabic ? data['documenttypee:arabicTitle'] : data['dc:title']}}\r\n</span>", styles: [""], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    CustomDocumentViewerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CustomDocumentViewerComponent, selector: "lib-custom-document-viewer", inputs: { pageProvider: "pageProvider", group: "group" }, ngImport: i0__namespace, template: "<span *ngIf=\"data\">\n    {{isArabic ? data['documenttypee:arabicTitle'] : data['dc:title']}}\n</span>", styles: [""], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CustomDocumentViewerComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -14791,7 +14794,8 @@
                         aggreg['componentType'] = sortType.compoenentType;
                         // in case of custom component need to call page provider to get data 
                         if (sortType.compoenentType === 'custom-pp' || sortType.compoenentType === 'custom-document') {
-                            aggreg['customPageProvider'] = sortType.pageProvider;
+                            aggreg['customPageProvider'] = sortType.pageProvider,
+                                aggreg['config'] = sortType.config;
                         }
                         updatedAggregation.push(aggreg);
                     }
@@ -14833,7 +14837,7 @@
         return DynamicSearchComponent;
     }());
     DynamicSearchComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicSearchComponent, deps: [{ token: i1__namespace$5.ActivatedRoute }, { token: i1__namespace$5.Router }, { token: i2__namespace$7.BreakpointObserver }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    DynamicSearchComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicSearchComponent, selector: "cts-dynamic-search", inputs: { columns: "columns", responsiveColumns: "responsiveColumns", entityType: "entityType", prefix: "prefix", headers: "headers", fields: "fields", pageProvider: "pageProvider", pageSize: "pageSize", sortingBy: "sortingBy", fullTextParamName: "fullTextParamName", onRowSelected: "onRowSelected", sortingArray: "sortingArray" }, ngImport: i0__namespace, template: "<div class=\"search-toolbar d-md-flex d-xl-none mx-3\">\r\n  <button (click)=\"onOpenFilter()\" class=\"my-button\">\r\n    <span> {{ \"FILTER\" | translate }}</span>\r\n    <i class=\"bi bi-filter\" *ngIf=\"!openFilter\"></i>\r\n    <i class=\"bi bi-x\" *ngIf=\"openFilter\"></i>\r\n  </button>\r\n  <div *ngIf=\"openFilter\">\r\n    <i class=\"bi bi-caret-up-fill arrow-up\"></i>\r\n  </div>\r\n</div>\r\n<div class=\"row wrapper\">\r\n  <div class=\"popup-filter px-3 d-flex d-xl-none\" *ngIf=\"openFilter\">\r\n    <form\r\n      [formGroup]=\"searchForm\"\r\n      class=\"search-form\"\r\n      (ngSubmit)=\"submitForm()\"\r\n    >\r\n      <input\r\n        class=\"search-input\"\r\n        type=\"text\"\r\n        formControlName=\"text\"\r\n        [placeholder]=\"'search.search' | translate\"\r\n      />\r\n      <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n    </form>\r\n    <ng-container *ngIf=\"aggregations; else progressSpinner\">\r\n      <ng-container *ngIf=\"aggregations.length; else noAggregations\">\r\n      <div *ngFor=\"let aggregation of aggregations\">\r\n        <ng-container *ngIf=\"aggregation.buckets.length > 0\">\r\n          <cts-dynamic-filter\r\n            [entityType]=\"entityType\"\r\n            [filters]=\"aggregation.buckets\"\r\n            [id]=\"aggregation.id\"\r\n            [selections]=\"aggregation.selection\"\r\n            [title]=\"aggregation.field\"\r\n            [prefix]=\"'search'\"\r\n            [department]=\"\r\n              aggregation.field === 'corr:to' ||\r\n              aggregation.field === 'corr:from'\r\n            \"\r\n            [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n            [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n            [config]=\"aggregation.config ? aggregation.config : {}\"\r\n            (onFilterSelected)=\"FilterSelected($event)\"\r\n          ></cts-dynamic-filter>\r\n        </ng-container>\r\n      </div>\r\n    </ng-container>\r\n  </ng-container>\r\n</div>\r\n\r\n  <div class=\"col-xl-3 search-sideMenu d-none d-xl-block\">\r\n    <form\r\n      [formGroup]=\"searchForm\"\r\n      class=\"search-form\"\r\n      (ngSubmit)=\"submitForm()\"\r\n    >\r\n      <input\r\n        class=\"search-input\"\r\n        type=\"text\"\r\n        formControlName=\"text\"\r\n        [placeholder]=\"'search.search' | translate\"\r\n      />\r\n      <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n    </form>\r\n    <ng-container *ngIf=\"aggregations; else progressSpinner\">\r\n      <div *ngFor=\"let aggregation of aggregations\">\r\n        <ng-container *ngIf=\"aggregation.buckets.length > 0\">\r\n          <cts-dynamic-filter\r\n            [entityType]=\"entityType\"\r\n            [filters]=\"aggregation.buckets\"\r\n            [id]=\"aggregation.id\"\r\n            [selections]=\"aggregation.selection\"\r\n            [title]=\"aggregation.field\"\r\n            [prefix]=\"'search'\"\r\n            [department]=\"\r\n              aggregation.field === 'corr:to' ||\r\n              aggregation.field === 'corr:from'\r\n            \"\r\n            [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n            [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n            (onFilterSelected)=\"FilterSelected($event)\"\r\n          ></cts-dynamic-filter>\r\n        </ng-container>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n\r\n  <div class=\"col-12 col-xl-9\">\r\n    <app-card>\r\n      <div class=\"title\">\r\n        <h3>\r\n          {{ \"search.header\" | translate }}\r\n        </h3>\r\n      </div>\r\n      <div class=\"body\">\r\n        <div *ngIf=\"aggregations\" class=\"table-toolbar\">\r\n          <div class=\"result-count\">\r\n            <span>\r\n              {{\r\n                \"search.\" + \"resultsNumber\"\r\n                  | translate: { value: totalRecords ? totalRecords : 0 }\r\n              }}\r\n            </span>\r\n          </div>\r\n          <!-- <form\r\n          [formGroup]=\"searchForm\"\r\n          class=\"search-form\"\r\n          (ngSubmit)=\"submitForm()\"\r\n        >\r\n          <input\r\n            class=\"search-input\"\r\n            type=\"text\"\r\n            formControlName=\"text\"\r\n            [placeholder]=\"'search.search' | translate\"\r\n          />\r\n          <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n        </form> -->\r\n        </div>\r\n        <cts-dynamic-table\r\n          [pageSize]=\"pageSize\"\r\n          [columns]=\"columns\"\r\n          [responsiveColumns]=\"responsiveColumns\"\r\n          [pageProvider]=\"pageProvider\"\r\n          [quickFilter]=\"filter\"\r\n          [entityType]=\"entityType\"\r\n          [fields]=\"fields\"\r\n          [queryParam]=\"queryParams\"\r\n          [headers]=\"headers\"\r\n          [prefix]=\"prefix\"\r\n          [sortingBy]=\"sortingBy\"\r\n          [isSearchPage]=\"true\"\r\n          (onRowSelected)=\"onRowSelected($event)\"\r\n          (onGettingData)=\"getTableData($event)\"\r\n        ></cts-dynamic-table>\r\n      </div>\r\n    </app-card>\r\n  </div>\r\n\r\n  <ng-template #progressSpinner>\r\n    <div class=\"progress-spinner\">\r\n      <mat-spinner color=\"warn\" [diameter]=\"25\"></mat-spinner>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template #noAggregations>\r\n    <div class=\"progress-spinner\">\r\n      {{ \"search.noAggregations\" | translate }}\r\n    </div>\r\n  </ng-template>\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}.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.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.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}.result-count{color:#8f98aa;font-size:14px}.search-sideMenu{background-color:#fff;padding-top:22px;padding-bottom:22px;border-radius:5px}.search-sideMenu .search-form{display:flex;color:#6a768e;width:100%}.search-sideMenu .search-form .search-input{width:100%;border:1px solid #d9dce2;border-inline-end:0;border-start-start-radius:5px;border-end-start-radius:5px;border:1px solid #ccc;height:32px;font-size:16px;padding-inline-start:4px}.search-sideMenu .search-form .search-input::-webkit-input-placeholder{font-size:14px}.search-sideMenu .search-form .search-input:focus-visible{border:2px solid #465573;outline:transparent}.search-sideMenu .search-form .search-icon{background:#465573;color:#fff;width:12%;display:flex;align-items:center;justify-content:center;border-radius:0;cursor:pointer;border:1px solid #d9dce2;border-start-end-radius:6px;border-end-end-radius:6px;border-inline-start:0}.search-toolbar{position:relative;display:flex;justify-content:flex-end;margin-bottom:16px}.search-toolbar .my-button{width:90px}.search-toolbar .arrow-up{position:absolute;top:26px;right:28px;font-size:25px;color:#8f98aab3}.wrapper{position:relative}.wrapper .popup-filter{flex-direction:column;position:absolute;right:0;z-index:9999;max-height:70vh;max-width:400px;background-color:#fff;overflow:scroll;box-shadow:0 1px 10px 2px #00000054;top:-4px;border-radius:5px}.wrapper .popup-filter .search-form{margin-top:10px!important}.wrapper .popup-filter .search-input{width:100%!important}.wrapper .search-container{background-color:#fff;border-radius:5px;border:0px;padding:16px;height:-webkit-max-content;height:max-content}.wrapper .search-container .table-toolbar{display:flex;align-items:center;margin-bottom:8px;justify-content:space-between}.progress-spinner{margin-top:10px;margin-block-end:0;display:grid;place-items:center;width:100%}.rtl .popup-filter{left:0px;right:unset!important}.rtl .arrow-up{position:absolute;top:33px;left:28px;right:unset!important}\n"], components: [{ type: DynamicFilterComponent, selector: "cts-dynamic-filter", inputs: ["title", "filters", "selections", "id", "entityType", "prefix", "department", "componentType", "customPageProvider", "config"], outputs: ["onFilterSelected"] }, { type: CardComponent, selector: "app-card", inputs: ["noBody", "dark"] }, { type: DynamicTableComponent, selector: "cts-dynamic-table", inputs: ["columns", "responsiveColumns", "entityType", "prefix", "headers", "fields", "pageProvider", "pageSize", "sortingBy", "queryParam", "quickFilter", "report", "rowCursor", "fullWidth", "tableMode", "tableActions", "defultSort", "range", "isSearchPage"], outputs: ["onRowSelected", "actionOnRow", "onGettingData"] }, { type: i1__namespace$6.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+    DynamicSearchComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: DynamicSearchComponent, selector: "cts-dynamic-search", inputs: { columns: "columns", responsiveColumns: "responsiveColumns", entityType: "entityType", prefix: "prefix", headers: "headers", fields: "fields", pageProvider: "pageProvider", pageSize: "pageSize", sortingBy: "sortingBy", fullTextParamName: "fullTextParamName", onRowSelected: "onRowSelected", sortingArray: "sortingArray" }, ngImport: i0__namespace, template: "<div class=\"search-toolbar d-md-flex d-xl-none mx-3\">\r\n  <button (click)=\"onOpenFilter()\" class=\"my-button\">\r\n    <span> {{ \"FILTER\" | translate }}</span>\r\n    <i class=\"bi bi-filter\" *ngIf=\"!openFilter\"></i>\r\n    <i class=\"bi bi-x\" *ngIf=\"openFilter\"></i>\r\n  </button>\r\n  <div *ngIf=\"openFilter\">\r\n    <i class=\"bi bi-caret-up-fill arrow-up\"></i>\r\n  </div>\r\n</div>\r\n<div class=\"row wrapper\">\r\n  <div class=\"popup-filter px-3 d-flex d-xl-none\" *ngIf=\"openFilter\">\r\n    <form\r\n      [formGroup]=\"searchForm\"\r\n      class=\"search-form\"\r\n      (ngSubmit)=\"submitForm()\"\r\n    >\r\n      <input\r\n        class=\"search-input\"\r\n        type=\"text\"\r\n        formControlName=\"text\"\r\n        [placeholder]=\"'search.search' | translate\"\r\n      />\r\n      <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n    </form>\r\n    <ng-container *ngIf=\"aggregations; else progressSpinner\">\r\n      <ng-container *ngIf=\"aggregations.length; else noAggregations\">\r\n      <div *ngFor=\"let aggregation of aggregations\">\r\n        <ng-container *ngIf=\"aggregation.buckets.length > 0\">\r\n          <cts-dynamic-filter\r\n            [entityType]=\"entityType\"\r\n            [filters]=\"aggregation.buckets\"\r\n            [id]=\"aggregation.id\"\r\n            [selections]=\"aggregation.selection\"\r\n            [title]=\"aggregation.field\"\r\n            [prefix]=\"'search'\"\r\n            [department]=\"\r\n              aggregation.field === 'corr:to' ||\r\n              aggregation.field === 'corr:from'\r\n            \"\r\n            [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n            [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n            [config]=\"aggregation.config ? aggregation.config : {}\"\r\n            (onFilterSelected)=\"FilterSelected($event)\"\r\n          ></cts-dynamic-filter>\r\n        </ng-container>\r\n      </div>\r\n    </ng-container>\r\n  </ng-container>\r\n</div>\r\n\r\n  <div class=\"col-xl-3 search-sideMenu d-none d-xl-block\">\r\n    <form\r\n      [formGroup]=\"searchForm\"\r\n      class=\"search-form\"\r\n      (ngSubmit)=\"submitForm()\"\r\n    >\r\n      <input\r\n        class=\"search-input\"\r\n        type=\"text\"\r\n        formControlName=\"text\"\r\n        [placeholder]=\"'search.search' | translate\"\r\n      />\r\n      <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n    </form>\r\n    <ng-container *ngIf=\"aggregations; else progressSpinner\">\r\n      <div *ngFor=\"let aggregation of aggregations\">\r\n        <ng-container *ngIf=\"aggregation.buckets.length > 0\">\r\n          <cts-dynamic-filter\r\n            [entityType]=\"entityType\"\r\n            [filters]=\"aggregation.buckets\"\r\n            [id]=\"aggregation.id\"\r\n            [selections]=\"aggregation.selection\"\r\n            [title]=\"aggregation.field\"\r\n            [prefix]=\"'search'\"\r\n            [department]=\"\r\n              aggregation.field === 'corr:to' ||\r\n              aggregation.field === 'corr:from'\r\n            \"\r\n            [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n            [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n            [config]=\"aggregation.config ? aggregation.config : {}\"\r\n            (onFilterSelected)=\"FilterSelected($event)\"\r\n          ></cts-dynamic-filter>\r\n        </ng-container>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n\r\n  <div class=\"col-12 col-xl-9\">\r\n    <app-card>\r\n      <div class=\"title\">\r\n        <h3>\r\n          {{ \"search.header\" | translate }}\r\n        </h3>\r\n      </div>\r\n      <div class=\"body\">\r\n        <div *ngIf=\"aggregations\" class=\"table-toolbar\">\r\n          <div class=\"result-count\">\r\n            <span>\r\n              {{\r\n                \"search.\" + \"resultsNumber\"\r\n                  | translate: { value: totalRecords ? totalRecords : 0 }\r\n              }}\r\n            </span>\r\n          </div>\r\n          <!-- <form\r\n          [formGroup]=\"searchForm\"\r\n          class=\"search-form\"\r\n          (ngSubmit)=\"submitForm()\"\r\n        >\r\n          <input\r\n            class=\"search-input\"\r\n            type=\"text\"\r\n            formControlName=\"text\"\r\n            [placeholder]=\"'search.search' | translate\"\r\n          />\r\n          <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n        </form> -->\r\n        </div>\r\n        <cts-dynamic-table\r\n          [pageSize]=\"pageSize\"\r\n          [columns]=\"columns\"\r\n          [responsiveColumns]=\"responsiveColumns\"\r\n          [pageProvider]=\"pageProvider\"\r\n          [quickFilter]=\"filter\"\r\n          [entityType]=\"entityType\"\r\n          [fields]=\"fields\"\r\n          [queryParam]=\"queryParams\"\r\n          [headers]=\"headers\"\r\n          [prefix]=\"prefix\"\r\n          [sortingBy]=\"sortingBy\"\r\n          [isSearchPage]=\"true\"\r\n          (onRowSelected)=\"onRowSelected($event)\"\r\n          (onGettingData)=\"getTableData($event)\"\r\n        ></cts-dynamic-table>\r\n      </div>\r\n    </app-card>\r\n  </div>\r\n\r\n  <ng-template #progressSpinner>\r\n    <div class=\"progress-spinner\">\r\n      <mat-spinner color=\"warn\" [diameter]=\"25\"></mat-spinner>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template #noAggregations>\r\n    <div class=\"progress-spinner\">\r\n      {{ \"search.noAggregations\" | translate }}\r\n    </div>\r\n  </ng-template>\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}.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.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.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}.result-count{color:#8f98aa;font-size:14px}.search-sideMenu{background-color:#fff;padding-top:22px;padding-bottom:22px;border-radius:5px}.search-sideMenu .search-form{display:flex;color:#6a768e;width:100%}.search-sideMenu .search-form .search-input{width:100%;border:1px solid #d9dce2;border-inline-end:0;border-start-start-radius:5px;border-end-start-radius:5px;border:1px solid #ccc;height:32px;font-size:16px;padding-inline-start:4px}.search-sideMenu .search-form .search-input::-webkit-input-placeholder{font-size:14px}.search-sideMenu .search-form .search-input:focus-visible{border:2px solid #465573;outline:transparent}.search-sideMenu .search-form .search-icon{background:#465573;color:#fff;width:12%;display:flex;align-items:center;justify-content:center;border-radius:0;cursor:pointer;border:1px solid #d9dce2;border-start-end-radius:6px;border-end-end-radius:6px;border-inline-start:0}.search-toolbar{position:relative;display:flex;justify-content:flex-end;margin-bottom:16px}.search-toolbar .my-button{width:90px}.search-toolbar .arrow-up{position:absolute;top:26px;right:28px;font-size:25px;color:#8f98aab3}.wrapper{position:relative}.wrapper .popup-filter{flex-direction:column;position:absolute;right:0;z-index:9999;max-height:70vh;max-width:400px;background-color:#fff;overflow:scroll;box-shadow:0 1px 10px 2px #00000054;top:-4px;border-radius:5px}.wrapper .popup-filter .search-form{margin-top:10px!important}.wrapper .popup-filter .search-input{width:100%!important}.wrapper .search-container{background-color:#fff;border-radius:5px;border:0px;padding:16px;height:-webkit-max-content;height:max-content}.wrapper .search-container .table-toolbar{display:flex;align-items:center;margin-bottom:8px;justify-content:space-between}.progress-spinner{margin-top:10px;margin-block-end:0;display:grid;place-items:center;width:100%}.rtl .popup-filter{left:0px;right:unset!important}.rtl .arrow-up{position:absolute;top:33px;left:28px;right:unset!important}\n"], components: [{ type: DynamicFilterComponent, selector: "cts-dynamic-filter", inputs: ["title", "filters", "selections", "id", "entityType", "prefix", "department", "componentType", "customPageProvider", "config"], outputs: ["onFilterSelected"] }, { type: CardComponent, selector: "app-card", inputs: ["noBody", "dark"] }, { type: DynamicTableComponent, selector: "cts-dynamic-table", inputs: ["columns", "responsiveColumns", "entityType", "prefix", "headers", "fields", "pageProvider", "pageSize", "sortingBy", "queryParam", "quickFilter", "report", "rowCursor", "fullWidth", "tableMode", "tableActions", "defultSort", "range", "isSearchPage"], outputs: ["onRowSelected", "actionOnRow", "onGettingData"] }, { type: i1__namespace$6.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace$1.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: DynamicSearchComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -17337,7 +17341,7 @@
         return FilterComponent;
     }());
     FilterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: FilterComponent, deps: [{ token: i3__namespace.FormBuilder }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    FilterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", 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]=\"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}.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.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.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", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["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"], outputs: ["valueChanged"] }, { type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty"], outputs: ["onSelecting", "actionClicked"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    FilterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", 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]=\"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}.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.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.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", "autoComplete_pageProvider", "autoComplete_propertyName", "autoComplete_propertyKey", "autoCompleteValueKey", "type", "property", "label", "editable", "placeholder", "disabled", "displayEmpty", "preventSpace", "id"] }, { type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["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"], outputs: ["valueChanged"] }, { type: DynamicFormDepartmentComponent, selector: "app-dynamic-form-department", inputs: ["treeview", "treeViewAsFormControl", "placeholder", "multiple", "searchable", "label", "defaultSelect", "pp_departmentNestedTree", "pp_departmentTree", "customPrefix", "useCustomAddEditAction", "customParentProperty", "returnItemUid"], outputs: ["onSelecting", "actionClicked"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: FilterComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -17533,7 +17537,7 @@
         return EditDeleteModalComponent;
     }());
     EditDeleteModalComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: EditDeleteModalComponent, deps: [{ token: i1$7.MAT_DIALOG_DATA }, { token: i1__namespace$3.ToastrService }, { token: CommentApiService }, { token: NuxeoService$1 }, { token: i1__namespace$7.MatDialogRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    EditDeleteModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: EditDeleteModalComponent, selector: "lib-edit-delete-modal", ngImport: i0__namespace, template: "<div class=\"comment-control\">\r\n    <div class=\"delete-modal\" *ngIf=\"operationType === 'delete'\">\r\n        <div class=\"delete-message\">{{ \"comment.are-you-sure\" | translate }}</div>\r\n        <div class=\"delete-buttons\">\r\n            <button class=\"submission-button\" (click)=\"delete()\">{{ \"BUTTONS.Delete\" | translate }}</button>\r\n            <button class=\"cancelation-button\"(click)=\"cancel()\">{{ \"BUTTONS.Cancel\" | translate }}</button>\r\n        </div>\r\n    </div>\r\n\r\n    <div class=\"update-modal\" *ngIf=\"operationType === 'edit'\">\r\n        <div class=\"text-update\">\r\n            <textarea placeholder=\"Comment ...\" [(ngModel)]=\"comment.text\" rows=\"3\"></textarea>\r\n            <div class=\"error\" *ngIf=\"(comment.text.trim()).length === 0\">\r\n                {{ \"comment.comment-required\" | translate }}\r\n            </div>\r\n        </div>\r\n        <div class=\"delete-buttons\">\r\n            <button class=\"submission-button -mx-1\" [disabled]=\"(comment.text.trim()).length === 0\" (click)=\"update()\">{{ \"BUTTONS.UPDATE\" | translate }}</button>\r\n            <button class=\"cancelation-button\"  (click)=\"cancel()\">{{ \"BUTTONS.Cancel\" | translate }}</button>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".comment-control{height:100%}.comment-control .delete-modal{display:flex;height:100%;flex-direction:column;justify-content:center;align-items:center}.comment-control .delete-modal .delete-message{text-align:center;font-size:16px;color:#000;margin-bottom:20px}.comment-control .delete-modal .delete-buttons{display:flex;align-items:center;justify-content:center}.comment-control .update-modal{height:100%;display:flex;justify-content:space-between;flex-direction:column}.comment-control .update-modal .text-update .error{font-size:14px;color:red}.comment-control .update-modal textarea{margin-bottom:0;border-radius:5px;padding:8px;width:100%;color:#465573;outline:none;border:1px solid #d9dce2;background-color:#8f98aa1a;resize:none}.comment-control .update-modal .delete-buttons{display:flex;justify-content:space-between}\n"], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    EditDeleteModalComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: EditDeleteModalComponent, selector: "lib-edit-delete-modal", ngImport: i0__namespace, template: "<div class=\"comment-control\">\n    <div class=\"delete-modal\" *ngIf=\"operationType === 'delete'\">\n        <div class=\"delete-message\">{{ \"comment.are-you-sure\" | translate }}</div>\n        <div class=\"delete-buttons\">\n            <button class=\"submission-button\" (click)=\"delete()\">{{ \"BUTTONS.Delete\" | translate }}</button>\n            <button class=\"cancelation-button\"(click)=\"cancel()\">{{ \"BUTTONS.Cancel\" | translate }}</button>\n        </div>\n    </div>\n\n    <div class=\"update-modal\" *ngIf=\"operationType === 'edit'\">\n        <div class=\"text-update\">\n            <textarea placeholder=\"Comment ...\" [(ngModel)]=\"comment.text\" rows=\"3\"></textarea>\n            <div class=\"error\" *ngIf=\"(comment.text.trim()).length === 0\">\n                {{ \"comment.comment-required\" | translate }}\n            </div>\n        </div>\n        <div class=\"delete-buttons\">\n            <button class=\"submission-button -mx-1\" [disabled]=\"(comment.text.trim()).length === 0\" (click)=\"update()\">{{ \"BUTTONS.UPDATE\" | translate }}</button>\n            <button class=\"cancelation-button\"  (click)=\"cancel()\">{{ \"BUTTONS.Cancel\" | translate }}</button>\n        </div>\n    </div>\n</div>", styles: [".comment-control{height:100%}.comment-control .delete-modal{display:flex;height:100%;flex-direction:column;justify-content:center;align-items:center}.comment-control .delete-modal .delete-message{text-align:center;font-size:16px;color:#000;margin-bottom:20px}.comment-control .delete-modal .delete-buttons{display:flex;align-items:center;justify-content:center}.comment-control .update-modal{height:100%;display:flex;justify-content:space-between;flex-direction:column}.comment-control .update-modal .text-update .error{font-size:14px;color:red}.comment-control .update-modal textarea{margin-bottom:0;border-radius:5px;padding:8px;width:100%;color:#465573;outline:none;border:1px solid #d9dce2;background-color:#8f98aa1a;resize:none}.comment-control .update-modal .delete-buttons{display:flex;justify-content:space-between}\n"], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: EditDeleteModalComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -17703,6 +17707,9 @@
             this.row = true;
             /** disable/enable add comment section */
             this.showaddcomment = true;
+            /** reverse sections order (addcomment , comments list) */
+            this.reverseSections = false;
+            this.showExtraActions = false;
             this.comments = [];
             this.throttle = 0;
             this.distance = 2;
@@ -17729,7 +17736,7 @@
         return CommentsDashletComponent;
     }());
     CommentsDashletComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CommentsDashletComponent, deps: [{ token: i1__namespace$1.TranslateService }, { token: CommentApiService }, { token: NuxeoService$1 }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    CommentsDashletComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CommentsDashletComponent, selector: "app-comments-dashlet", inputs: { entityId: "entityId", correspondence: "correspondence", row: "row", showaddcomment: "showaddcomment" }, viewQueries: [{ propertyName: "commentsList", first: true, predicate: CommentsListComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"comments-container\">\r\n  <div class=\"comments-title\">\r\n    {{ \"comment.comment\" | translate }} ({{ commentsList?.totalRecords }})\r\n  </div>\r\n  <div class=\"body\">\r\n    <div class=\"comments-list-container\">\r\n      <div *ngIf=\"showaddcomment\">\r\n        <div class=\"comment-box\" *permission=\"{\r\n          name: 'comments',\r\n          entity: correspondence , user: nuxeoService.nuxeoClient.user\r\n        }\">\r\n          <div class=\"comment-input\">\r\n            <textarea\r\n              class=\"comment-area\"\r\n              name=\"description\"\r\n              id=\"description\"\r\n              type=\"text\"\r\n              rows=\"3\"\r\n              required\r\n              matTextareaAutosize\r\n              matAutosizeMinRows=\"5\"\r\n              matAutosizeMaxRows=\"10\"\r\n              [(ngModel)]=\"comment\"\r\n              [placeholder]=\"'comment.placeHolder' | translate\"\r\n              #commentText=\"ngModel\"\r\n            ></textarea>\r\n          </div>\r\n          <div class=\"add-container\">\r\n            <div class=\"button-wrapper\">\r\n              <cts-button\r\n                [disabled]=\"!comment?.length\"\r\n                [loading]=\"saving\"\r\n                [theme]=\"'green'\"\r\n                [size]=\"'regular'\"\r\n                (click)=\"onPost()\"\r\n              >\r\n                {{ \"comment.add\" | translate }}\r\n              </cts-button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div\r\n        class=\"comment-list\"\r\n        [ngClass]=\"{ 'fix-height col-6': row, 'col-12': !row }\"\r\n      >\r\n        <app-comments-list\r\n          [loaderType]=\"row ? 'scroll' : 'button'\"\r\n          [pageSize]=\"row ? 4 : 9\"\r\n          [entityId]=\"entityId\"\r\n        >\r\n        </app-comments-list>\r\n      </div>\r\n    </div>\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}.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.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.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}.comments-container{padding:16px}.comments-container .comments-title{font-size:16px;font-weight:500;padding:12px;border-bottom:1px solid #d9dce2}.comments-container .comments-list-container .comment-box{display:flex;flex-direction:column}.comments-container .comments-list-container .comment-box .comment-input{padding:8px 15px 0}.comments-container .comments-list-container .comment-box .comment-area{border-radius:5px;padding:8px;width:100%;color:#465573;outline:none;border:1px solid #d9dce2;background-color:#8f98aa1a;resize:none}.comments-container .comments-list-container .comment-box .add-container{margin-inline-start:15px;display:flex;justify-content:flex-start;border-bottom:1px solid #d9dce2;padding-bottom:15px;padding-inline-end:15px}.comments-container .comments-list-container .comment-box .button-wrapper{align-items:flex-end;width:18%}.comments-container .comments-list-container .comment-list{margin-top:8px}.comments-container .comments-list-container .comment-list .fix-height{height:200px}\n"], components: [{ type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme"], outputs: ["onClick"] }, { type: CommentsListComponent, selector: "app-comments-list", inputs: ["entityId", "pageSize", "loaderType"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i3__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
+    CommentsDashletComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.4", type: CommentsDashletComponent, selector: "app-comments-dashlet", inputs: { entityId: "entityId", correspondence: "correspondence", row: "row", showaddcomment: "showaddcomment", reverseSections: "reverseSections", showExtraActions: "showExtraActions" }, viewQueries: [{ propertyName: "commentsList", first: true, predicate: CommentsListComponent, descendants: true }], ngImport: i0__namespace, template: "<div class=\"comments-container\">\r\n  <div class=\"comments-title\">\r\n    {{ \"comment.comment\" | translate }} ({{ commentsList?.totalRecords }})\r\n  </div>\r\n  <div class=\"body\">\r\n    <div class=\"comments-list-container\" [ngClass]=\"{'revers-sections' : reverseSections}\">\r\n      <div class=\"adding-comment-section\" *ngIf=\"showaddcomment\">\r\n        <div class=\"comment-box\" *permission=\"{\r\n          name: 'comments',\r\n          entity: correspondence , user: nuxeoService.nuxeoClient.user\r\n        }\">\r\n          <div class=\"comment-input\">\r\n            <textarea\r\n              class=\"comment-area\"\r\n              name=\"description\"\r\n              id=\"description\"\r\n              type=\"text\"\r\n              rows=\"3\"\r\n              required\r\n              matTextareaAutosize\r\n              matAutosizeMinRows=\"5\"\r\n              matAutosizeMaxRows=\"10\"\r\n              [(ngModel)]=\"comment\"\r\n              [placeholder]=\"'comment.placeHolder' | translate\"\r\n              #commentText=\"ngModel\"\r\n            ></textarea>\r\n          </div>\r\n          <div class=\"add-container\" [ngClass]=\"{'extra-actions-container' : showExtraActions}\">\r\n            <div class=\"button-wrapper\" *ngIf=\"!showExtraActions\">\r\n              <cts-button\r\n                [disabled]=\"!comment?.length\"\r\n                [loading]=\"saving\"\r\n                [theme]=\"'green'\"\r\n                [size]=\"'regular'\"\r\n                (click)=\"onPost()\"\r\n              >\r\n                {{ \"comment.add\" | translate }}\r\n              </cts-button>\r\n            </div>\r\n            <div class=\"extra-actions\" *ngIf=\"showExtraActions\">\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.answer\" | translate }}</button>\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.cancel_request\" | translate }}</button>\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.need_update\" | translate }}</button>\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.accept_content\" | translate }}</button>\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.close_assign\" | translate }}</button>\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.assign_internally\" | translate }}</button>\r\n              <button class=\"submission-button rounded-lg\">{{ \"comment.show_internal_assign\" | translate }}</button>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div\r\n        class=\"comment-list\"\r\n        [ngClass]=\"{ 'fix-height col-6': row, 'col-12': !row }\"\r\n      >\r\n        <app-comments-list\r\n          [loaderType]=\"row ? 'scroll' : 'button'\"\r\n          [pageSize]=\"row ? 4 : 9\"\r\n          [entityId]=\"entityId\"\r\n        >\r\n        </app-comments-list>\r\n      </div>\r\n    </div>\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}.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.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.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}.comments-container{padding:16px}.comments-container .comments-title{font-size:16px;font-weight:500;padding:12px;border-bottom:1px solid #d9dce2}.comments-container .comments-list-container .comment-box{display:flex;flex-direction:column}.comments-container .comments-list-container .comment-box .comment-input{padding:8px 15px 0}.comments-container .comments-list-container .comment-box .comment-area{border-radius:5px;padding:8px;width:100%;color:#465573;outline:none;border:1px solid #d9dce2;background-color:#8f98aa1a;resize:none}.comments-container .comments-list-container .comment-box .add-container{margin-inline-start:15px;display:flex;justify-content:flex-start;border-bottom:1px solid #d9dce2;padding-bottom:15px;padding-inline-end:15px}.comments-container .comments-list-container .comment-box .extra-actions-container{display:flex;justify-content:space-between!important;flex-wrap:wrap}.comments-container .comments-list-container .comment-box .extra-actions-container .button-wrapper{margin-bottom:10px}.comments-container .comments-list-container .comment-box .extra-actions-container .extra-actions{display:flex}.comments-container .comments-list-container .comment-box .extra-actions-container .submission-button{width:auto!important;padding:0 10px;min-width:80px}.comments-container .comments-list-container .comment-box .button-wrapper{align-items:flex-end;width:18%}.comments-container .comments-list-container .comment-list{margin-top:8px}.comments-container .comments-list-container .comment-list .fix-height{height:200px}.comments-container .revers-sections{display:flex;flex-direction:column-reverse}\n"], components: [{ type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme"], outputs: ["onClick"] }, { type: CommentsListComponent, selector: "app-comments-list", inputs: ["entityId", "pageSize", "loaderType"] }], directives: [{ type: i4__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i3__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3__namespace.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "translate": i1__namespace$1.TranslatePipe } });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.4", ngImport: i0__namespace, type: CommentsDashletComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -17745,6 +17752,10 @@
                     type: i0.Input
                 }], showaddcomment: [{
                     type: i0.Input
+                }], reverseSections: [{
+                    type: i0.Input
+                }], showExtraActions: [{
+                    type: i0.Input
                 }], commentsList: [{
                     type: i0.ViewChild,
                     args: [CommentsListComponent, { static: false }]