npm - nuxeo-development-framework - Versions diffs - 5.9.0 → 5.9.2 - Mend

nuxeo-development-framework 5.9.0 → 5.9.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

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

@@ -1,8 +1,8 @@
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/material/dialog'), require('@angular/router'), require('@ngx-translate/core'), require('rxjs/operators'), require('rxjs'), require('@angular/animations'), require('ngx-toastr'), require('crypto-js'), require('@angular/cdk/bidi'), require('@angular/common/http'), require('keycloak-angular'), require('ngx-cookie-service'), require('@angular/cdk/coercion'), require('@angular/material/icon'), require('@angular/material/progress-spinner'), require('@angular/material/tooltip'), require('lodash-es'), require('moment'), require('lodash/omit'), require('lodash/assign'), require('lodash/cloneDeep'), require('lodash'), require('@angular/platform-browser'), require('moment-es6'), require('moment-hijri'), require('ngx-infinite-scroll'), require('@angular/material/list'), require('@angular/material/menu'), require('angular-ng-autocomplete'), require('@angular/material/core'), require('@angular/cdk/clipboard'), require('ts-cacheable'), require('@ng-select/ng-select'), require('@angular/material/form-field'), require('@angular/material/chips'), require('@angular/material/expansion'), require('@angular/material/button'), require('@angular/material/checkbox'), require('@angular/material/datepicker'), require('@angular/material/input'), require('@angular/material/radio'), require('@angular/material/slide-toggle'), require('@busacca/ng-pick-datetime'), require('@mat-datetimepicker/core'), require('angular-formio'), require('ngx-treeview'), require('@ng-bootstrap/ng-bootstrap'), require('formiojs'), require('lodash/find'), require('lodash/isEqual'), require('@swimlane/ngx-datatable'), require('@angular/material/button-toggle'), require('@angular/cdk/collections'), require('@angular/cdk/drag-drop'), require('@angular/material/autocomplete'), require('ngx-mask'), require('moment/moment'), require('string-hash'), require('@angular/cdk/layout'), require('dwt'), require('@angular/material/progress-bar'), require('chart.js/auto'), require('chartjs-adapter-moment'), require('devextreme-angular'), require('file-saver'), require('devextreme-angular/ui/nested'), require('@pdftron/webviewer'), require('@angular/material/tabs'), require('@angular/material/divider'), require('@angular/common/locales/ar'), require('@angular/common/locales/en'), require('@rxweb/reactive-form-validators'), require('rete-angular-plugin'), require('rete'), require('rete-area-plugin'), require('rete-auto-arrange-plugin'), require('rete-connection-plugin'), require('rete-connection-reroute-plugin'), require('rete-readonly-plugin'), require('rete-minimap-plugin'), require('d3-shape'), require('rete-connection-path-plugin'), require('rete-render-utils'), require('@angular/material/badge'), require('@angular/material/toolbar'), require('@kurkle/color'), require('ngx-markdown'), require('@angular/cdk/accordion'), require('lodash/flatMap'), require('@angular/material/bottom-sheet')) :
   typeof define === 'function' && define.amd ? define('nuxeo-development-framework', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/material/dialog', '@angular/router', '@ngx-translate/core', 'rxjs/operators', 'rxjs', '@angular/animations', 'ngx-toastr', 'crypto-js', '@angular/cdk/bidi', '@angular/common/http', 'keycloak-angular', 'ngx-cookie-service', '@angular/cdk/coercion', '@angular/material/icon', '@angular/material/progress-spinner', '@angular/material/tooltip', 'lodash-es', 'moment', 'lodash/omit', 'lodash/assign', 'lodash/cloneDeep', 'lodash', '@angular/platform-browser', 'moment-es6', 'moment-hijri', 'ngx-infinite-scroll', '@angular/material/list', '@angular/material/menu', 'angular-ng-autocomplete', '@angular/material/core', '@angular/cdk/clipboard', 'ts-cacheable', '@ng-select/ng-select', '@angular/material/form-field', '@angular/material/chips', '@angular/material/expansion', '@angular/material/button', '@angular/material/checkbox', '@angular/material/datepicker', '@angular/material/input', '@angular/material/radio', '@angular/material/slide-toggle', '@busacca/ng-pick-datetime', '@mat-datetimepicker/core', 'angular-formio', 'ngx-treeview', '@ng-bootstrap/ng-bootstrap', 'formiojs', 'lodash/find', 'lodash/isEqual', '@swimlane/ngx-datatable', '@angular/material/button-toggle', '@angular/cdk/collections', '@angular/cdk/drag-drop', '@angular/material/autocomplete', 'ngx-mask', 'moment/moment', 'string-hash', '@angular/cdk/layout', 'dwt', '@angular/material/progress-bar', 'chart.js/auto', 'chartjs-adapter-moment', 'devextreme-angular', 'file-saver', 'devextreme-angular/ui/nested', '@pdftron/webviewer', '@angular/material/tabs', '@angular/material/divider', '@angular/common/locales/ar', '@angular/common/locales/en', '@rxweb/reactive-form-validators', 'rete-angular-plugin', 'rete', 'rete-area-plugin', 'rete-auto-arrange-plugin', 'rete-connection-plugin', 'rete-connection-reroute-plugin', 'rete-readonly-plugin', 'rete-minimap-plugin', 'd3-shape', 'rete-connection-path-plugin', 'rete-render-utils', '@angular/material/badge', '@angular/material/toolbar', '@kurkle/color', 'ngx-markdown', '@angular/cdk/accordion', 'lodash/flatMap', '@angular/material/bottom-sheet'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["nuxeo-development-framework"] = {}, global.ng.core, global.ng.common, global.ng.forms, global.ng.material.dialog, global.ng.router, global.i1, global.rxjs.operators, global.rxjs, global.ng.animations, global.i1$1, global.CryptoJS, global.ng.cdk.bidi, global.ng.common.http, global.i2$1, global.i3, global.ng.cdk.coercion, global.ng.material.icon, global.ng.material.progressSpinner, global.ng.material.tooltip, global.lodashEs, global.moment$6, global._omit, global._assign, global._cloneDeep, global._, global.ng.platformBrowser, global.moment$7, global.moment_, global.i9, global.ng.material.list, global.ng.material.menu, global.i6$1, global.ng.material.core, global.ng.cdk.clipboard, global.tsCacheable, global.i5, global.ng.material.formField, global.ng.material.chips, global.ng.material.expansion, global.ng.material.button, global.ng.material.checkbox, global.ng.material.datepicker, global.ng.material.input, global.ng.material.radio, global.ng.material.slideToggle, global.i6$3, global.core, global.i3$2, global.i1$9, global.i1$8, global.formiojs, global._find, global._isEqual, global.i4$2, global.ng.material.buttonToggle, global.ng.cdk.collections, global.ng.cdk.dragDrop, global.ng.material.autocomplete, global.i5$4, global.moment$8, global.stringHash, global.ng.cdk.layout, global.Dynamsoft, global.ng.material.progressBar, global.Chart, null, global.i4$4, global.FileSaver, global.i5$6, global.WebViewer, global.ng.material.tabs, global.ng.material.divider, global.ng.common.locales.ar, global.ng.common.locales.en, global.reactiveFormValidators, global.i2$7, global.rete, global.reteAreaPlugin, global.reteAutoArrangePlugin, global.reteConnectionPlugin, global.reteConnectionReroutePlugin, global.reteReadonlyPlugin, global.reteMinimapPlugin, global.d3Shape, global.reteConnectionPathPlugin, global.reteRenderUtils, global.ng.material.badge, global.ng.material.toolbar, global.colorLib, global.i2$8, global.ng.cdk.accordion, global._flatMap, global.ng.material.bottomSheet));
-})(this, (function (exports, i0, i4, i2, i1$4, i1$3, i1, operators, rxjs, animations, i1$1, CryptoJS, i4$1, i1$2, i2$1, i3, coercion, i2$2, i6, i7, lodashEs, moment$6, _omit, _assign, _cloneDeep, _, i1$5, moment$7, moment_, i9, i2$3, i3$1, i6$1, i2$4, i1$6, tsCacheable, i5, i1$7, i7$1, i6$2, i1$b, i5$1, i2$6, i5$2, i2$5, i1$a, i6$3, core, i3$2, i1$9, i1$8, formiojs, _find, _isEqual, i4$2, i1$c, collections, i7$2, i5$3, i5$4, moment$8, stringHash, i5$5, Dynamsoft, i4$3, Chart, chartjsAdapterMoment, i4$4, FileSaver, i5$6, WebViewer, i1$d, i9$1, localeAr, localeEn, reactiveFormValidators, i2$7, rete, reteAreaPlugin, reteAutoArrangePlugin, reteConnectionPlugin, reteConnectionReroutePlugin, reteReadonlyPlugin, reteMinimapPlugin, d3Shape, reteConnectionPathPlugin, reteRenderUtils, i7$3, toolbar, colorLib, i2$8, i6$4, _flatMap, i1$e) { 'use strict';
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["nuxeo-development-framework"] = {}, global.ng.core, global.ng.common, global.ng.forms, global.ng.material.dialog, global.ng.router, global.i1, global.rxjs.operators, global.rxjs, global.ng.animations, global.i1$1, global.CryptoJS, global.ng.cdk.bidi, global.ng.common.http, global.i2$1, global.i3, global.ng.cdk.coercion, global.ng.material.icon, global.ng.material.progressSpinner, global.ng.material.tooltip, global.lodashEs, global.moment$6, global._omit, global._assign, global._cloneDeep, global._, global.ng.platformBrowser, global.moment$7, global.moment_, global.i7$1, global.ng.material.list, global.ng.material.menu, global.i6$1, global.ng.material.core, global.ng.cdk.clipboard, global.tsCacheable, global.i5, global.ng.material.formField, global.ng.material.chips, global.ng.material.expansion, global.ng.material.button, global.ng.material.checkbox, global.ng.material.datepicker, global.ng.material.input, global.ng.material.radio, global.ng.material.slideToggle, global.i6$3, global.core, global.i3$2, global.i1$9, global.i1$8, global.formiojs, global._find, global._isEqual, global.i4$2, global.ng.material.buttonToggle, global.ng.cdk.collections, global.ng.cdk.dragDrop, global.ng.material.autocomplete, global.i5$4, global.moment$8, global.stringHash, global.ng.cdk.layout, global.Dynamsoft, global.ng.material.progressBar, global.Chart, null, global.i4$4, global.FileSaver, global.i5$6, global.WebViewer, global.ng.material.tabs, global.ng.material.divider, global.ng.common.locales.ar, global.ng.common.locales.en, global.reactiveFormValidators, global.i2$7, global.rete, global.reteAreaPlugin, global.reteAutoArrangePlugin, global.reteConnectionPlugin, global.reteConnectionReroutePlugin, global.reteReadonlyPlugin, global.reteMinimapPlugin, global.d3Shape, global.reteConnectionPathPlugin, global.reteRenderUtils, global.ng.material.badge, global.ng.material.toolbar, global.colorLib, global.i2$8, global.ng.cdk.accordion, global._flatMap, global.ng.material.bottomSheet));
+})(this, (function (exports, i0, i4, i2, i1$4, i1$3, i1, operators, rxjs, animations, i1$1, CryptoJS, i4$1, i1$2, i2$1, i3, coercion, i2$2, i6, i7, lodashEs, moment$6, _omit, _assign, _cloneDeep, _, i1$5, moment$7, moment_, i7$1, i2$3, i3$1, i6$1, i2$4, i1$6, tsCacheable, i5, i1$7, i7$2, i6$2, i1$b, i5$1, i2$6, i5$2, i2$5, i1$a, i6$3, core, i3$2, i1$9, i1$8, formiojs, _find, _isEqual, i4$2, i1$c, collections, i7$3, i5$3, i5$4, moment$8, stringHash, i5$5, Dynamsoft, i4$3, Chart, chartjsAdapterMoment, i4$4, FileSaver, i5$6, WebViewer, i1$d, i9, localeAr, localeEn, reactiveFormValidators, i2$7, rete, reteAreaPlugin, reteAutoArrangePlugin, reteConnectionPlugin, reteConnectionReroutePlugin, reteReadonlyPlugin, reteMinimapPlugin, d3Shape, reteConnectionPathPlugin, reteRenderUtils, i7$4, toolbar, colorLib, i2$8, i6$4, _flatMap, i1$e) { 'use strict';
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -50,7 +50,7 @@
   var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment$7);
   var moment___namespace = /*#__PURE__*/_interopNamespace(moment_);
   var moment___default = /*#__PURE__*/_interopDefaultLegacy(moment_);
-  var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
+  var i7__namespace$1 = /*#__PURE__*/_interopNamespace(i7$1);
   var i2__namespace$2 = /*#__PURE__*/_interopNamespace(i2$3);
   var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
   var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
@@ -58,7 +58,7 @@
   var i1__namespace$6 = /*#__PURE__*/_interopNamespace(i1$6);
   var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
   var i1__namespace$7 = /*#__PURE__*/_interopNamespace(i1$7);
-  var i7__namespace$1 = /*#__PURE__*/_interopNamespace(i7$1);
+  var i7__namespace$2 = /*#__PURE__*/_interopNamespace(i7$2);
   var i6__namespace$2 = /*#__PURE__*/_interopNamespace(i6$2);
   var i1__namespace$c = /*#__PURE__*/_interopNamespace(i1$b);
   var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
@@ -74,7 +74,7 @@
   var _isEqual__default = /*#__PURE__*/_interopDefaultLegacy(_isEqual);
   var i4__namespace$2 = /*#__PURE__*/_interopNamespace(i4$2);
   var i1__namespace$b = /*#__PURE__*/_interopNamespace(i1$c);
-  var i7__namespace$2 = /*#__PURE__*/_interopNamespace(i7$2);
+  var i7__namespace$3 = /*#__PURE__*/_interopNamespace(i7$3);
   var i5__namespace$3 = /*#__PURE__*/_interopNamespace(i5$3);
   var i5__namespace$4 = /*#__PURE__*/_interopNamespace(i5$4);
   var moment__namespace$1 = /*#__PURE__*/_interopNamespace(moment$8);
@@ -88,11 +88,11 @@
   var i5__namespace$6 = /*#__PURE__*/_interopNamespace(i5$6);
   var WebViewer__default = /*#__PURE__*/_interopDefaultLegacy(WebViewer);
   var i1__namespace$d = /*#__PURE__*/_interopNamespace(i1$d);
-  var i9__namespace$1 = /*#__PURE__*/_interopNamespace(i9$1);
+  var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
   var localeAr__default = /*#__PURE__*/_interopDefaultLegacy(localeAr);
   var localeEn__default = /*#__PURE__*/_interopDefaultLegacy(localeEn);
   var i2__namespace$7 = /*#__PURE__*/_interopNamespace(i2$7);
-  var i7__namespace$3 = /*#__PURE__*/_interopNamespace(i7$3);
+  var i7__namespace$4 = /*#__PURE__*/_interopNamespace(i7$4);
   var colorLib__default = /*#__PURE__*/_interopDefaultLegacy(colorLib);
   var i2__namespace$8 = /*#__PURE__*/_interopNamespace(i2$8);
   var i6__namespace$4 = /*#__PURE__*/_interopNamespace(i6$4);
@@ -5647,7 +5647,7 @@
       return CommentsListComponent;
   }());
   CommentsListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CommentsListComponent, deps: [{ token: CommentApiService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  CommentsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CommentsListComponent, selector: "app-comments-list", inputs: { entityId: "entityId", pageSize: "pageSize", loaderType: "loaderType", showCommentActions: "showCommentActions" }, viewQueries: [{ propertyName: "scrollDiv", first: true, predicate: ["scrollDiv"], descendants: true }], ngImport: i0__namespace, template: "<div *ngIf=\"comments.length !== 0\"\r\n  class=\"scroll-div overflow-auto dark-scroll\"\r\n  #scrollDiv\r\n  infinite-scroll\r\n  [scrollWindow]=\"false\"\r\n  [infiniteScrollDistance]=\"distance\"\r\n  [infiniteScrollDisabled]=\"infiniteScrollDisabled\"\r\n  [infiniteScrollThrottle]=\"throttle\"\r\n  (scrolled)=\"onScroll($event)\"\r\n>\r\n  <app-comment-item\r\n    [loaderType]=\"loaderType\"\r\n    class=\"mb-2\"\r\n    *ngFor=\"let comment of comments\"\r\n    [comment]=\"comment\"\r\n    [showCommentActions]=\"showCommentActions\"\r\n    (refreshCommentList)=\"refreshList()\"\r\n  >\r\n  </app-comment-item>\r\n  <div *ngIf=\"fetching && loaderType === 'scroll'\">\r\n    <mat-spinner [diameter]=\"30\"></mat-spinner>\r\n  </div>\r\n  <div\r\n    class=\"button-wrapper\"\r\n    *ngIf=\"!infiniteScrollDisabled && loaderType === 'button'\"\r\n  >\r\n    <cts-button\r\n      [theme]=\"'outline-dark'\"\r\n      [size]=\"'regular'\"\r\n      (onClick)=\"onScroll($event)\"\r\n      [loading]=\"fetching\"\r\n    >\r\n      {{ \"comment.loadMore\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"comments.length === 0 && !fetching\"\r\n  class=\"No-Items flex justify-center\"\r\n>\r\n  <cts-no-data img=\"assets/images/empty-state/empty-comments.png\" [message]=\"'comment.nocomment'\"></cts-no-data>\r\n</div>\r\n", styles: [".text-style{color:#fff}.containerHeight{min-height:400px;max-height:auto}.titleStyle{font-size:24px}.padding-50{padding:50px}.p-20px{padding:20px}.mt-33{margin-top:33px}.mt-24px{margin-top:24px}.mb-20px{margin-bottom:20px}.mb-30{margin-bottom:30px}.mt-30{margin-top:30px}.avatar{width:40px;height:40px;border-radius:50%}.btn{width:123px;height:40px}.submibtn{width:171px;height:40px}.btnText{font-size:14px;color:#fff}.CardFont{font-size:14px}.border{border-width:1px}.gridContainer{display:grid;grid-template-columns:40px auto;grid-column-gap:5px;column-gap:5px;margin-bottom:20px}.container{height:110px}.mat-grid-tile{background-color:#00f}.avatarContainer{height:40px;width:40px}.col .containerHeight{min-height:260px;max-height:auto}.gap-40px{grid-row-gap:40px;row-gap:40px}.scroll-div{max-height:100%;display:flex;flex-direction:column;flex:1}.button-wrapper{width:150px}.comment-spinner{width:100%;display:grid;place-items:center}\n"], components: [{ type: CommentItemComponent, selector: "app-comment-item", inputs: ["comment", "loaderType", "showCommentActions"], outputs: ["refreshCommentList"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }, { type: NoDataComponent, selector: "cts-no-data", inputs: ["message", "border", "img"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9__namespace.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  CommentsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CommentsListComponent, selector: "app-comments-list", inputs: { entityId: "entityId", pageSize: "pageSize", loaderType: "loaderType", showCommentActions: "showCommentActions" }, viewQueries: [{ propertyName: "scrollDiv", first: true, predicate: ["scrollDiv"], descendants: true }], ngImport: i0__namespace, template: "<div *ngIf=\"comments.length !== 0\"\r\n  class=\"scroll-div overflow-auto dark-scroll\"\r\n  #scrollDiv\r\n  infinite-scroll\r\n  [scrollWindow]=\"false\"\r\n  [infiniteScrollDistance]=\"distance\"\r\n  [infiniteScrollDisabled]=\"infiniteScrollDisabled\"\r\n  [infiniteScrollThrottle]=\"throttle\"\r\n  (scrolled)=\"onScroll($event)\"\r\n>\r\n  <app-comment-item\r\n    [loaderType]=\"loaderType\"\r\n    class=\"mb-2\"\r\n    *ngFor=\"let comment of comments\"\r\n    [comment]=\"comment\"\r\n    [showCommentActions]=\"showCommentActions\"\r\n    (refreshCommentList)=\"refreshList()\"\r\n  >\r\n  </app-comment-item>\r\n  <div *ngIf=\"fetching && loaderType === 'scroll'\">\r\n    <mat-spinner [diameter]=\"30\"></mat-spinner>\r\n  </div>\r\n  <div\r\n    class=\"button-wrapper\"\r\n    *ngIf=\"!infiniteScrollDisabled && loaderType === 'button'\"\r\n  >\r\n    <cts-button\r\n      [theme]=\"'outline-dark'\"\r\n      [size]=\"'regular'\"\r\n      (onClick)=\"onScroll($event)\"\r\n      [loading]=\"fetching\"\r\n    >\r\n      {{ \"comment.loadMore\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n\r\n<div\r\n  *ngIf=\"comments.length === 0 && !fetching\"\r\n  class=\"No-Items flex justify-center\"\r\n>\r\n  <cts-no-data img=\"assets/images/empty-state/empty-comments.png\" [message]=\"'comment.nocomment'\"></cts-no-data>\r\n</div>\r\n", styles: [".text-style{color:#fff}.containerHeight{min-height:400px;max-height:auto}.titleStyle{font-size:24px}.padding-50{padding:50px}.p-20px{padding:20px}.mt-33{margin-top:33px}.mt-24px{margin-top:24px}.mb-20px{margin-bottom:20px}.mb-30{margin-bottom:30px}.mt-30{margin-top:30px}.avatar{width:40px;height:40px;border-radius:50%}.btn{width:123px;height:40px}.submibtn{width:171px;height:40px}.btnText{font-size:14px;color:#fff}.CardFont{font-size:14px}.border{border-width:1px}.gridContainer{display:grid;grid-template-columns:40px auto;grid-column-gap:5px;column-gap:5px;margin-bottom:20px}.container{height:110px}.mat-grid-tile{background-color:#00f}.avatarContainer{height:40px;width:40px}.col .containerHeight{min-height:260px;max-height:auto}.gap-40px{grid-row-gap:40px;row-gap:40px}.scroll-div{max-height:100%;display:flex;flex-direction:column;flex:1}.button-wrapper{width:150px}.comment-spinner{width:100%;display:grid;place-items:center}\n"], components: [{ type: CommentItemComponent, selector: "app-comment-item", inputs: ["comment", "loaderType", "showCommentActions"], outputs: ["refreshCommentList"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }, { type: NoDataComponent, selector: "cts-no-data", inputs: ["message", "border", "img"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CommentsListComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -5757,7 +5757,7 @@
           CommentItemComponent,
           EditDeleteModalComponent], imports: [i4.CommonModule,
           LibrarySharedModule,
-          i9.InfiniteScrollModule,
+          i7$1.InfiniteScrollModule,
           i2.FormsModule,
           CardModule,
           PipesModule,
@@ -5771,7 +5771,7 @@
   CommentsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CommentsModule, providers: [], imports: [[
               i4.CommonModule,
               LibrarySharedModule,
-              i9.InfiniteScrollModule,
+              i7$1.InfiniteScrollModule,
               i2.FormsModule,
               CardModule,
               PipesModule,
@@ -5795,7 +5795,7 @@
                       imports: [
                           i4.CommonModule,
                           LibrarySharedModule,
-                          i9.InfiniteScrollModule,
+                          i7$1.InfiniteScrollModule,
                           i2.FormsModule,
                           CardModule,
                           PipesModule,
@@ -6478,7 +6478,15 @@
       };
       DynamicFormVocabularyItemComponent.prototype.writeValue = function (value) {
           // if (value) { removed to allow reseting ui when resetting form
-          this.selection = value;
+          if (this.data.some(function (item) { return item.id === value; })) {
+              this.selection = value;
+          }
+          else {
+              this.selection = null;
+              if (this.propagateChange) {
+                  this.propagateChange(null);
+              }
+          }
           // }
       };
       DynamicFormVocabularyItemComponent.prototype.registerOnChange = function (fn) {
@@ -6684,7 +6692,7 @@
       return CorrespondenceRelationCreateFormComponent;
   }());
   CorrespondenceRelationCreateFormComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CorrespondenceRelationCreateFormComponent, deps: [{ token: i2__namespace$4.FormBuilder }, { token: CorrespondenceRelationService }, { token: CustomToastrService }, { token: i1__namespace$3.MatDialogRef }, { token: i1$4.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  CorrespondenceRelationCreateFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CorrespondenceRelationCreateFormComponent, selector: "cts-correspondence-relation-create-form", viewQueries: [{ propertyName: "auto", first: true, predicate: ["auto"], descendants: true }], ngImport: i0__namespace, template: "<div\r\n  class=\"correspondence-relation-container\"\r\n  SetDirRtl\r\n  style=\"height: 80%; width: 100%\"\r\n>\r\n  <div class=\"correspondence-relation-title\">\r\n    {{ \"correspondence-relation.add\" | translate }}\r\n  </div>\r\n  <!-- <mat-divider></mat-divider> -->\r\n  <div mat-dialog-content [formGroup]=\"createform\">\r\n    <div class=\"vocabulary-list\">\r\n      <app-dynamic-form-vocabulary-item\r\n        [label]=\"'correspondence-relation.relation-type'\"\r\n        [bindLabel]=\"'label'\"\r\n        [bindValue]=\"'id'\"\r\n        placeholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n        [multiple]=\"false\"\r\n        [searchable]=\"false\"\r\n        [closeOnSelect]=\"true\"\r\n        [hideSelectedItems]=\"false\"\r\n        [vocabularyType]=\"'VOC_CorrespondenceRelationsNames'\"\r\n        formControlName=\"relationname\"\r\n        (onSelecting)=\"reset()\"\r\n      >\r\n      </app-dynamic-form-vocabulary-item>\r\n    </div>\r\n\r\n    <div class=\"search-container\" *ngIf=\"createform.value.relationname\">\r\n      <ng-autocomplete\r\n        #auto\r\n        [data]=\"documentList\"\r\n        [searchKeyword]=\"'filter'\"\r\n        (selected)=\"selectItem($event)\"\r\n        (inputChanged)=\"onSearchInputChange($event)\"\r\n        [customFilter]=\"disableFilter\"\r\n        (closed)=\"keep_Autocomplete_Results_Open()\"\r\n        [itemTemplate]=\"itemTemplate\"\r\n        [notFoundTemplate]=\"notFoundTemplate\"\r\n        [placeholder]=\"'correspondence-relation.searchby' | translate\"\r\n        [debounceTime]=\"1000\"\r\n        [isLoading]=\"isLoading\"\r\n        (inputCleared)=\"inputCleared()\"\r\n      >\r\n      </ng-autocomplete>\r\n\r\n      <ng-template #itemTemplate let-item>\r\n        <div class=\"item\">\r\n          <span>{{ item.title }}</span>\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #notFoundTemplate>\r\n        <div>{{ \"correspondence-relation.notfound\" | translate }}</div>\r\n      </ng-template>\r\n\r\n      <div class=\"chip-list\" *ngIf=\"related_corr.length > 0\">\r\n        <mat-chip-list #chipList aria-label=\"corr selection\">\r\n          <mat-chip\r\n            *ngFor=\"let corr of related_corr\"\r\n            [selectable]=\"selectable\"\r\n            [removable]=\"removable\"\r\n            (removed)=\"on_remove_relation_Chip(corr)\"\r\n          >\r\n            {{ corr.title }}\r\n            <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"exist-relation\" *ngIf=\"exist\">\r\n        <span> {{ \"correspondence-relation.exist\" | translate }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"button-group d-flex flex-row-reverse\">\r\n    <cts-button\r\n      [theme]=\"'danger'\"\r\n      size=\"'regular'\"\r\n      [loading]=\"saving\"\r\n      class=\"voc-form-close\"\r\n      mat-dialog-close\r\n    >\r\n      {{ \"BUTTONS.CLOSE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      (onClick)=\"onSaveClick()\"\r\n      [theme]=\"'primary'\"\r\n      size=\"'regular'\"\r\n      [disabled]=\"\r\n        !this.createform.controls.relationname.valid || related_corr.length == 0\r\n      \"\r\n    >\r\n      {{ \"correspondence-relation.save\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.correspondence-relation-container{padding:20px}.correspondence-relation-container .correspondence-relation-title{margin-bottom:8px;font-size:20px;color:#465573}.correspondence-relation-container .mat-dialog-content{height:100%;width:100%}.correspondence-relation-container .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.correspondence-relation-container .button-group cts-button{width:16%}@media (max-width: 992px){.correspondence-relation-container .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.correspondence-relation-container .button-group cts-button{width:28%}}.correspondence-relation-container .item{margin:1px;padding:8px 10px;font-size:.75rem}.correspondence-relation-container .dialog-actions button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:70px;border-radius:3px}.correspondence-relation-container .dialog-actions button:disabled{opacity:.4;cursor:not-allowed}.correspondence-relation-container .dialog-actions button:hover{opacity:.7}.correspondence-relation-container .autocomplete-container .suggestions-container ul{max-height:150px!important}.correspondence-relation-container .autocomplete-container .suggestions-container{height:150px!important;margin-top:10px;max-height:150px!important;border:1px lightgray solid!important;box-shadow:none!important}.correspondence-relation-container .search-container{position:relative}.correspondence-relation-container .chip-list{max-height:150px;border:1px lightgray solid;overflow:scroll;padding:10px;margin-bottom:10px;top:215px;position:absolute;width:100%}.correspondence-relation-container .chip-list .mat-standard-chip{border-radius:5px!important}.correspondence-relation-container .chip-list .mat-chip.mat-standard-chip{background-color:#8f98aa1a!important;height:auto}.correspondence-relation-container .autocomplete-container{box-shadow:none!important}.correspondence-relation-container .autocomplete-container .input-container input{background-color:#8f98aa1a!important;padding:10px!important}.correspondence-relation-container .exist-relation{background-color:#f8d7da!important;color:#842029!important;border-color:#f5c2c7!important;position:absolute;width:100%;top:300px}.correspondence-relation-container .autocomplete-container .suggestions-container .complete-selected,.correspondence-relation-container .autocomplete-container .suggestions-container ul li:hover{background-color:#8f98aa1a!important}.correspondence-relation-container .vocabulary-list{margin-bottom:10px}.correspondence-relation-container .vocabulary-list .mat-error{display:none!important}.correspondence-relation-container .mat-dialog-content{margin:3px 0 0!important;padding:0!important}[dir=rtl] .input-container input{direction:rtl}[dir=rtl] .x{left:10px;right:auto!important}\n"], components: [{ type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: i6__namespace$1.AutocompleteComponent, selector: "ng-autocomplete", inputs: ["data", "searchKeyword", "placeholder", "heading", "initialValue", "historyIdentifier", "historyHeading", "historyListMaxNumber", "notFoundText", "isLoading", "debounceTime", "disabled", "minQueryLength", "focusFirst", "customFilter", "selectedValueRender", "itemTemplate", "notFoundTemplate"], outputs: ["selected", "inputChanged", "inputFocused", "inputCleared", "opened", "closed", "scrolledToEnd"] }, { type: i7__namespace$1.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }], directives: [{ type: SetDirRtlDirective, selector: "[SetDirRtl]" }, { type: i1__namespace$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i7__namespace$1.MatChipRemove, selector: "[matChipRemove]" }, { type: i1__namespace$3.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
+  CorrespondenceRelationCreateFormComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CorrespondenceRelationCreateFormComponent, selector: "cts-correspondence-relation-create-form", viewQueries: [{ propertyName: "auto", first: true, predicate: ["auto"], descendants: true }], ngImport: i0__namespace, template: "<div\r\n  class=\"correspondence-relation-container\"\r\n  SetDirRtl\r\n  style=\"height: 80%; width: 100%\"\r\n>\r\n  <div class=\"correspondence-relation-title\">\r\n    {{ \"correspondence-relation.add\" | translate }}\r\n  </div>\r\n  <!-- <mat-divider></mat-divider> -->\r\n  <div mat-dialog-content [formGroup]=\"createform\">\r\n    <div class=\"vocabulary-list\">\r\n      <app-dynamic-form-vocabulary-item\r\n        [label]=\"'correspondence-relation.relation-type'\"\r\n        [bindLabel]=\"'label'\"\r\n        [bindValue]=\"'id'\"\r\n        placeholder=\"{{ 'VOCABULARY.SELECT_ITEM' | translate }}\"\r\n        [multiple]=\"false\"\r\n        [searchable]=\"false\"\r\n        [closeOnSelect]=\"true\"\r\n        [hideSelectedItems]=\"false\"\r\n        [vocabularyType]=\"'VOC_CorrespondenceRelationsNames'\"\r\n        formControlName=\"relationname\"\r\n        (onSelecting)=\"reset()\"\r\n      >\r\n      </app-dynamic-form-vocabulary-item>\r\n    </div>\r\n\r\n    <div class=\"search-container\" *ngIf=\"createform.value.relationname\">\r\n      <ng-autocomplete\r\n        #auto\r\n        [data]=\"documentList\"\r\n        [searchKeyword]=\"'filter'\"\r\n        (selected)=\"selectItem($event)\"\r\n        (inputChanged)=\"onSearchInputChange($event)\"\r\n        [customFilter]=\"disableFilter\"\r\n        (closed)=\"keep_Autocomplete_Results_Open()\"\r\n        [itemTemplate]=\"itemTemplate\"\r\n        [notFoundTemplate]=\"notFoundTemplate\"\r\n        [placeholder]=\"'correspondence-relation.searchby' | translate\"\r\n        [debounceTime]=\"1000\"\r\n        [isLoading]=\"isLoading\"\r\n        (inputCleared)=\"inputCleared()\"\r\n      >\r\n      </ng-autocomplete>\r\n\r\n      <ng-template #itemTemplate let-item>\r\n        <div class=\"item\">\r\n          <span>{{ item.title }}</span>\r\n        </div>\r\n      </ng-template>\r\n\r\n      <ng-template #notFoundTemplate>\r\n        <div>{{ \"correspondence-relation.notfound\" | translate }}</div>\r\n      </ng-template>\r\n\r\n      <div class=\"chip-list\" *ngIf=\"related_corr.length > 0\">\r\n        <mat-chip-list #chipList aria-label=\"corr selection\">\r\n          <mat-chip\r\n            *ngFor=\"let corr of related_corr\"\r\n            [selectable]=\"selectable\"\r\n            [removable]=\"removable\"\r\n            (removed)=\"on_remove_relation_Chip(corr)\"\r\n          >\r\n            {{ corr.title }}\r\n            <mat-icon matChipRemove *ngIf=\"removable\">cancel</mat-icon>\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n      <div class=\"exist-relation\" *ngIf=\"exist\">\r\n        <span> {{ \"correspondence-relation.exist\" | translate }}</span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"button-group d-flex flex-row-reverse\">\r\n    <cts-button\r\n      [theme]=\"'danger'\"\r\n      size=\"'regular'\"\r\n      [loading]=\"saving\"\r\n      class=\"voc-form-close\"\r\n      mat-dialog-close\r\n    >\r\n      {{ \"BUTTONS.CLOSE\" | translate }}\r\n    </cts-button>\r\n    <cts-button\r\n      (onClick)=\"onSaveClick()\"\r\n      [theme]=\"'primary'\"\r\n      size=\"'regular'\"\r\n      [disabled]=\"\r\n        !this.createform.controls.relationname.valid || related_corr.length == 0\r\n      \"\r\n    >\r\n      {{ \"correspondence-relation.save\" | translate }}\r\n    </cts-button>\r\n  </div>\r\n</div>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.correspondence-relation-container{padding:20px}.correspondence-relation-container .correspondence-relation-title{margin-bottom:8px;font-size:20px;color:#465573}.correspondence-relation-container .mat-dialog-content{height:100%;width:100%}.correspondence-relation-container .button-group{margin-top:12px;grid-column-gap:6px!important;column-gap:6px!important}.correspondence-relation-container .button-group cts-button{width:16%}@media (max-width: 992px){.correspondence-relation-container .button-group cts-button{width:20%}}@media only screen and (max-width: 768px){.correspondence-relation-container .button-group cts-button{width:28%}}.correspondence-relation-container .item{margin:1px;padding:8px 10px;font-size:.75rem}.correspondence-relation-container .dialog-actions button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:70px;border-radius:3px}.correspondence-relation-container .dialog-actions button:disabled{opacity:.4;cursor:not-allowed}.correspondence-relation-container .dialog-actions button:hover{opacity:.7}.correspondence-relation-container .autocomplete-container .suggestions-container ul{max-height:150px!important}.correspondence-relation-container .autocomplete-container .suggestions-container{height:150px!important;margin-top:10px;max-height:150px!important;border:1px lightgray solid!important;box-shadow:none!important}.correspondence-relation-container .search-container{position:relative}.correspondence-relation-container .chip-list{max-height:150px;border:1px lightgray solid;overflow:scroll;padding:10px;margin-bottom:10px;top:215px;position:absolute;width:100%}.correspondence-relation-container .chip-list .mat-standard-chip{border-radius:5px!important}.correspondence-relation-container .chip-list .mat-chip.mat-standard-chip{background-color:#8f98aa1a!important;height:auto}.correspondence-relation-container .autocomplete-container{box-shadow:none!important}.correspondence-relation-container .autocomplete-container .input-container input{background-color:#8f98aa1a!important;padding:10px!important}.correspondence-relation-container .exist-relation{background-color:#f8d7da!important;color:#842029!important;border-color:#f5c2c7!important;position:absolute;width:100%;top:300px}.correspondence-relation-container .autocomplete-container .suggestions-container .complete-selected,.correspondence-relation-container .autocomplete-container .suggestions-container ul li:hover{background-color:#8f98aa1a!important}.correspondence-relation-container .vocabulary-list{margin-bottom:10px}.correspondence-relation-container .vocabulary-list .mat-error{display:none!important}.correspondence-relation-container .mat-dialog-content{margin:3px 0 0!important;padding:0!important}[dir=rtl] .input-container input{direction:rtl}[dir=rtl] .x{left:10px;right:auto!important}\n"], components: [{ type: DynamicFormVocabularyItemComponent, selector: "app-dynamic-form-vocabulary-item", inputs: ["onlyIds", "bindValue", "bindLabel", "placeholder", "multiple", "searchable", "closeOnSelect", "hideSelectedItems", "disabled", "vocabularyType", "label", "cacheable", "shwoAllValues", "emitVocabulryRecordOnSelect"], outputs: ["onSelecting"] }, { type: i6__namespace$1.AutocompleteComponent, selector: "ng-autocomplete", inputs: ["data", "searchKeyword", "placeholder", "heading", "initialValue", "historyIdentifier", "historyHeading", "historyListMaxNumber", "notFoundText", "isLoading", "debounceTime", "disabled", "minQueryLength", "focusFirst", "customFilter", "selectedValueRender", "itemTemplate", "notFoundTemplate"], outputs: ["selected", "inputChanged", "inputFocused", "inputCleared", "opened", "closed", "scrolledToEnd"] }, { type: i7__namespace$2.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }], directives: [{ type: SetDirRtlDirective, selector: "[SetDirRtl]" }, { type: i1__namespace$3.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i7__namespace$2.MatChipRemove, selector: "[matChipRemove]" }, { type: i1__namespace$3.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["type", "mat-dialog-close", "aria-label", "matDialogClose"], exportAs: ["matDialogClose"] }], pipes: { "translate": i1__namespace.TranslatePipe }, encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CorrespondenceRelationCreateFormComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -15867,7 +15875,7 @@
       };
       TableColumnsTogglerComponent.prototype.drop = function (event) {
           if (this.enableSorting) {
-              i7$2.moveItemInArray(this.columns, event.previousIndex, event.currentIndex);
+              i7$3.moveItemInArray(this.columns, event.previousIndex, event.currentIndex);
           }
       };
       TableColumnsTogglerComponent.prototype.applySort = function () {
@@ -15902,7 +15910,7 @@
       return TableColumnsTogglerComponent;
   }(BaseComponent));
   TableColumnsTogglerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TableColumnsTogglerComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  TableColumnsTogglerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TableColumnsTogglerComponent, selector: "table-columns-toggler", inputs: { prefix: "prefix", sortable: "sortable", columns: "columns" }, outputs: { columnsChanged: "columnsChanged" }, host: { classAttribute: "columns-toggler" }, usesInheritance: true, usesOnChanges: true, ngImport: i0__namespace, template: "<button mat-stroked-button [matMenuTriggerFor]=\"menu\" class=\"columns-toggler__button\">\r\n\t<mat-icon inline> tune </mat-icon>\r\n\t{{ 'TABLE.toggleColumns' | translate }}\r\n</button>\r\n<mat-menu #menu=\"matMenu\" class=\"p-0\" xPosition=\"before\">\r\n\t<div\r\n\t\tclass=\"flex justify-between mb-2 columns-toggler__all top-0 pb-2 px-3\"\r\n\t\t(click)=\"$event.stopPropagation()\"\r\n\t>\r\n\t\t<mat-checkbox\r\n\t\t\t*ngIf=\"!!columns?.length && !enableSorting\"\r\n\t\t\t(change)=\"onCheckAllChange($event)\"\r\n\t\t\t[checked]=\"columnsSelection.selected.length > 0 && columnsSelection.selected.length === columns?.length\"\r\n\t\t\t[indeterminate]=\"columnsSelection.selected.length > 0 && columnsSelection.selected.length < columns?.length\"\r\n\t\t>\r\n\t\t\t{{ 'FILTERS.all' | translate }}\r\n\t\t</mat-checkbox>\r\n\r\n\t\t<button class=\"action-btn apply-sorting-btn\" *ngIf=\"enableSorting\" (click)=\"applySort()\">\r\n\t\t\t{{ 'TABLE.applySorting' | translate }}\r\n\t\t</button>\r\n\r\n\t\t<mat-icon\r\n\t\t\trole=\"button\"\r\n\t\t\t(click)=\"toggleSorting()\"\r\n\t\t\t*ngIf=\"sortEnabled\"\r\n\t\t\t[title]=\"(enableSorting ? 'TABLE.disableSorting' : 'TABLE.enableSorting') | translate\"\r\n\t\t\t[matTooltip]=\"(enableSorting ? 'TABLE.disableSorting' : 'TABLE.enableSorting') | translate\"\r\n\t\t\tclass=\"columns-toggler__sort-icon\"\r\n\t\t>\r\n\t\t\t{{ enableSorting ? 'playlist_remove' : 'format_line_spacing' }}\r\n\t\t</mat-icon>\r\n\t</div>\r\n\r\n\t<ul\r\n\t\tclass=\"columns-toggler__columns py-2 px-3\"\r\n\t\t(click)=\"$event.stopPropagation()\"\r\n\t\t[dir]=\"direction\"\r\n\t\tcdkDropList\r\n\t\t[cdkDropListDisabled]=\"!enableSorting && !sortEnabled\"\r\n\t\t(cdkDropListDropped)=\"drop($event)\"\r\n\t>\r\n\t\t<li\r\n\t\t\t*ngFor=\"let col of columns\"\r\n\t\t\tclass=\"mb-2 column-control\"\r\n\t\t\tcdkDrag\r\n\t\t\t[cdkDragDisabled]=\"!enableSorting\"\r\n\t\t\t[class.sorting-enabled]=\"enableSorting\"\r\n\t\t\t[class.column-control__hidden]=\"!columnsSelection.isSelected(col)\"\r\n\t\t>\r\n\t\t\t<mat-checkbox [checked]=\"columnsSelection.isSelected(col)\" (change)=\"columnsSelection.toggle(col)\">\r\n\t\t\t\t{{ prefix + col.name | translate }}\r\n\t\t\t</mat-checkbox>\r\n\t\t</li>\r\n\t</ul>\r\n\t<ul\r\n\t\tclass=\"columns-toggler__frozen-columns py-2 px-3\"\r\n\t\t(click)=\"$event.stopPropagation()\"\r\n\t\t*ngIf=\"sortEnabled && frozenColumns?.length\"\r\n\t>\r\n\t\t<li *ngFor=\"let col of frozenColumns\" class=\"column-control\">\r\n\t\t\t<mat-checkbox [checked]=\"columnsSelection.isSelected(col)\" (change)=\"columnsSelection.toggle(col)\">\r\n\t\t\t\t{{ prefix + col.name | translate }}\r\n\t\t\t</mat-checkbox>\r\n\t\t</li>\r\n\t</ul>\r\n</mat-menu>\r\n", styles: [".columns-toggler__all{border-bottom:var(--columns-toggler-border, solid #f0f0f0)}.columns-toggler__sort-icon{color:var(--sort-icon-color, #000)}.columns-toggler__columns{max-height:var(--cols-max-height, 275px);overflow-y:auto}.columns-toggler__columns .check-all-box{background:var(--check-background-color, #fff)}.columns-toggler__columns .column-control.sorting-enabled ::ng-deep,.columns-toggler__columns .column-control.sorting-enabled ::ng-deep .mat-checkbox-label{cursor:move}.columns-toggler__columns .column-control.sorting-enabled.cdk-drag-disabled{cursor:not-allowed;background:var(--drag-disabled-background, transparent);box-shadow:0 0 0 3px var(--drag-disabled-background, transparent)}.columns-toggler__columns .column-control__hidden{opacity:.7}.columns-toggler__columns .column-control.cdk-drag-preview{box-sizing:border-box;list-style:none;background:var(--secondary-color);box-shadow:var(--drag-preview-shadow, 0 0 0 3px var(--secondary-color), 0 1px 12px -4px #b8b8b8)}.columns-toggler__columns .cdk-drag-placeholder{opacity:0}.columns-toggler__frozen-columns{border-top:var(--frozen-cols-border-top, 2px solid #ccc);max-height:var(--frozen-cols--max-height, 150px);overflow-y:auto}::ng-deep .column-control.cdk-drag-preview{box-sizing:border-box;list-style:none;background:var(--secondary-color);box-shadow:var(--drag-preview-shadow, 0 0 0 3px var(--secondary-color), 0 1px 12px -4px #b8b8b8)}::ng-deep .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.columns-toggler__sort-icon{color:var(--icon-color)!important}.apply-sorting-btn{background-color:var(--logo-button-bg);color:var(--main-text)}\n"], components: [{ type: i1__namespace$c.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i5__namespace$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }], directives: [{ type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i7__namespace$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i4__namespace.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "translate": i1__namespace.TranslatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+  TableColumnsTogglerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TableColumnsTogglerComponent, selector: "table-columns-toggler", inputs: { prefix: "prefix", sortable: "sortable", columns: "columns" }, outputs: { columnsChanged: "columnsChanged" }, host: { classAttribute: "columns-toggler" }, usesInheritance: true, usesOnChanges: true, ngImport: i0__namespace, template: "<button mat-stroked-button [matMenuTriggerFor]=\"menu\" class=\"columns-toggler__button\">\r\n\t<mat-icon inline> tune </mat-icon>\r\n\t{{ 'TABLE.toggleColumns' | translate }}\r\n</button>\r\n<mat-menu #menu=\"matMenu\" class=\"p-0\" xPosition=\"before\">\r\n\t<div\r\n\t\tclass=\"flex justify-between mb-2 columns-toggler__all top-0 pb-2 px-3\"\r\n\t\t(click)=\"$event.stopPropagation()\"\r\n\t>\r\n\t\t<mat-checkbox\r\n\t\t\t*ngIf=\"!!columns?.length && !enableSorting\"\r\n\t\t\t(change)=\"onCheckAllChange($event)\"\r\n\t\t\t[checked]=\"columnsSelection.selected.length > 0 && columnsSelection.selected.length === columns?.length\"\r\n\t\t\t[indeterminate]=\"columnsSelection.selected.length > 0 && columnsSelection.selected.length < columns?.length\"\r\n\t\t>\r\n\t\t\t{{ 'FILTERS.all' | translate }}\r\n\t\t</mat-checkbox>\r\n\r\n\t\t<button class=\"action-btn apply-sorting-btn\" *ngIf=\"enableSorting\" (click)=\"applySort()\">\r\n\t\t\t{{ 'TABLE.applySorting' | translate }}\r\n\t\t</button>\r\n\r\n\t\t<mat-icon\r\n\t\t\trole=\"button\"\r\n\t\t\t(click)=\"toggleSorting()\"\r\n\t\t\t*ngIf=\"sortEnabled\"\r\n\t\t\t[title]=\"(enableSorting ? 'TABLE.disableSorting' : 'TABLE.enableSorting') | translate\"\r\n\t\t\t[matTooltip]=\"(enableSorting ? 'TABLE.disableSorting' : 'TABLE.enableSorting') | translate\"\r\n\t\t\tclass=\"columns-toggler__sort-icon\"\r\n\t\t>\r\n\t\t\t{{ enableSorting ? 'playlist_remove' : 'format_line_spacing' }}\r\n\t\t</mat-icon>\r\n\t</div>\r\n\r\n\t<ul\r\n\t\tclass=\"columns-toggler__columns py-2 px-3\"\r\n\t\t(click)=\"$event.stopPropagation()\"\r\n\t\t[dir]=\"direction\"\r\n\t\tcdkDropList\r\n\t\t[cdkDropListDisabled]=\"!enableSorting && !sortEnabled\"\r\n\t\t(cdkDropListDropped)=\"drop($event)\"\r\n\t>\r\n\t\t<li\r\n\t\t\t*ngFor=\"let col of columns\"\r\n\t\t\tclass=\"mb-2 column-control\"\r\n\t\t\tcdkDrag\r\n\t\t\t[cdkDragDisabled]=\"!enableSorting\"\r\n\t\t\t[class.sorting-enabled]=\"enableSorting\"\r\n\t\t\t[class.column-control__hidden]=\"!columnsSelection.isSelected(col)\"\r\n\t\t>\r\n\t\t\t<mat-checkbox [checked]=\"columnsSelection.isSelected(col)\" (change)=\"columnsSelection.toggle(col)\">\r\n\t\t\t\t{{ prefix + col.name | translate }}\r\n\t\t\t</mat-checkbox>\r\n\t\t</li>\r\n\t</ul>\r\n\t<ul\r\n\t\tclass=\"columns-toggler__frozen-columns py-2 px-3\"\r\n\t\t(click)=\"$event.stopPropagation()\"\r\n\t\t*ngIf=\"sortEnabled && frozenColumns?.length\"\r\n\t>\r\n\t\t<li *ngFor=\"let col of frozenColumns\" class=\"column-control\">\r\n\t\t\t<mat-checkbox [checked]=\"columnsSelection.isSelected(col)\" (change)=\"columnsSelection.toggle(col)\">\r\n\t\t\t\t{{ prefix + col.name | translate }}\r\n\t\t\t</mat-checkbox>\r\n\t\t</li>\r\n\t</ul>\r\n</mat-menu>\r\n", styles: [".columns-toggler__all{border-bottom:var(--columns-toggler-border, solid #f0f0f0)}.columns-toggler__sort-icon{color:var(--sort-icon-color, #000)}.columns-toggler__columns{max-height:var(--cols-max-height, 275px);overflow-y:auto}.columns-toggler__columns .check-all-box{background:var(--check-background-color, #fff)}.columns-toggler__columns .column-control.sorting-enabled ::ng-deep,.columns-toggler__columns .column-control.sorting-enabled ::ng-deep .mat-checkbox-label{cursor:move}.columns-toggler__columns .column-control.sorting-enabled.cdk-drag-disabled{cursor:not-allowed;background:var(--drag-disabled-background, transparent);box-shadow:0 0 0 3px var(--drag-disabled-background, transparent)}.columns-toggler__columns .column-control__hidden{opacity:.7}.columns-toggler__columns .column-control.cdk-drag-preview{box-sizing:border-box;list-style:none;background:var(--secondary-color);box-shadow:var(--drag-preview-shadow, 0 0 0 3px var(--secondary-color), 0 1px 12px -4px #b8b8b8)}.columns-toggler__columns .cdk-drag-placeholder{opacity:0}.columns-toggler__frozen-columns{border-top:var(--frozen-cols-border-top, 2px solid #ccc);max-height:var(--frozen-cols--max-height, 150px);overflow-y:auto}::ng-deep .column-control.cdk-drag-preview{box-sizing:border-box;list-style:none;background:var(--secondary-color);box-shadow:var(--drag-preview-shadow, 0 0 0 3px var(--secondary-color), 0 1px 12px -4px #b8b8b8)}::ng-deep .cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.columns-toggler__sort-icon{color:var(--icon-color)!important}.apply-sorting-btn{background-color:var(--logo-button-bg);color:var(--main-text)}\n"], components: [{ type: i1__namespace$c.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i5__namespace$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }], directives: [{ type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i7__namespace$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i4__namespace.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }], pipes: { "translate": i1__namespace.TranslatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TableColumnsTogglerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -23290,7 +23298,7 @@
           i6.MatProgressSpinnerModule,
           i7.MatTooltipModule,
           TableModule,
-          i7$2.DragDropModule,
+          i7$3.DragDropModule,
           NoDataModule,
           DirectiveModule,
           EditorNavigateButton,
@@ -23315,7 +23323,7 @@
               i6.MatProgressSpinnerModule,
               i7.MatTooltipModule,
               TableModule,
-              i7$2.DragDropModule,
+              i7$3.DragDropModule,
               NoDataModule,
               DirectiveModule,
               EditorNavigateButton,
@@ -23341,7 +23349,7 @@
                           i6.MatProgressSpinnerModule,
                           i7.MatTooltipModule,
                           TableModule,
-                          i7$2.DragDropModule,
+                          i7$3.DragDropModule,
                           NoDataModule,
                           DirectiveModule,
                           EditorNavigateButton,
@@ -23624,7 +23632,7 @@
       return DynamicSearchComponent;
   }());
   DynamicSearchComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DynamicSearchComponent, deps: [{ token: i1__namespace$5.ActivatedRoute }, { token: i1__namespace$5.Router }, { token: EvaluatorsService }, { token: NuxeoService }, { token: GlobalAdminService }, { token: 'environment' }, { token: i5__namespace$5.BreakpointObserver }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  DynamicSearchComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", 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", filter: "filter", higlightUnread: "higlightUnread", suggesterApi: "suggesterApi", onRowSelected: "onRowSelected", sortingArray: "sortingArray", customResponsiveStyle: "customResponsiveStyle", openCloseFilterFromOutside: "openCloseFilterFromOutside", theme: "theme" }, outputs: { actionOnRow: "actionOnRow" }, viewQueries: [{ propertyName: "dynamicTable", first: true, predicate: ["dynamicTable"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!customResponsiveStyle\">\r\n  <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</ng-container>\r\n\r\n<ng-container *ngIf=\"customResponsiveStyle\">\r\n  <div class=\"customStyle -mt-12 px-8 flex flex-col\"\r\n    [ngClass]=\"{'bg-accent-200': theme === 'dgda','bg-accent-100': theme === 'ksreleif' || theme === 'comptechco'}\"\r\n    [@collapse]=\"!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    <div class=\"flex gap-x-18 flex-row mt-5 pb-3 overflow-x-auto\">\r\n      <ng-container *ngIf=\"aggregations; else progressSpinner\">\r\n        <ng-container *ngIf=\"aggregations.length; else noAggregations\">\r\n          <ng-container *ngFor=\"let aggregation of aggregations\">\r\n            <ng-container *ngIf=\"aggregation.buckets.length > 0\">\r\n              <cts-dynamic-filter [entityType]=\"entityType\" [filters]=\"aggregation.buckets\" [id]=\"aggregation.id\"\r\n                [selections]=\"aggregation.selection\" [title]=\"aggregation.field\" [prefix]=\"'search'\" [department]=\"\r\n                    aggregation.field === 'corr:to' ||\r\n                    aggregation.field === 'corr:from'\r\n                  \" [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n                [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n                [config]=\"aggregation.config ? aggregation.config : {}\" (onFilterSelected)=\"FilterSelected($event)\">\r\n              </cts-dynamic-filter>\r\n            </ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</ng-container>\r\n\r\n<div class=\"row wrapper\">\r\n  <div class=\"wrapper-overlay\" *ngIf=\"loading\"></div>\r\n  \r\n  <ng-container *ngIf=\"!customResponsiveStyle\">\r\n    <div class=\"popup-filter px-3 d-flex d-xl-none\" *ngIf=\"openFilter\">\r\n      <form [formGroup]=\"searchForm\" class=\"search-form\" (ngSubmit)=\"submitForm()\">\r\n        <input class=\"search-input\" type=\"text\" formControlName=\"text\" [matAutocomplete]=\"matAutocomplete1\" [placeholder]=\"'search.search' | translate\" />\r\n        <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n      </form>\r\n      <mat-autocomplete\r\n      class=\"\r\n         auto-complete-iner-wrapper\r\n          auto-complete-wrapper\r\n      \"\r\n      [disableRipple]=\"true\"\r\n      #matAutocomplete1=\"matAutocomplete\"\r\n  >\r\n      <mat-option\r\n          class=\"no-text\"\r\n          *ngIf=\"resultSets && !resultSets.length\"\r\n      >\r\n          {{'no_result_found' | translate}}\r\n      </mat-option>\r\n      <ng-container *ngFor=\"let resultSet of resultSets\">\r\n          <mat-option  (click)=\"setOptionValue(resultSet.label)\">\r\n              <span\r\n                  class=\"option-iner-text\"\r\n                  >{{ resultSet.label }}</span\r\n              >\r\n          </mat-option >\r\n      </ng-container>\r\n      </mat-autocomplete>\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 [entityType]=\"entityType\" [filters]=\"aggregation.buckets\" [id]=\"aggregation.id\"\r\n                [selections]=\"aggregation.selection\" [title]=\"aggregation.field\" [prefix]=\"'search'\" [department]=\"\r\n                aggregation.field === 'corr:to' ||\r\n                aggregation.field === 'corr:from'\r\n              \" [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n                [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n                [config]=\"aggregation.config ? aggregation.config : {}\" (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  </ng-container>\r\n\r\n  <div class=\"col-xl-3 search-sideMenu d-none d-xl-block\">\r\n    <form [formGroup]=\"searchForm\" class=\"search-form\" (ngSubmit)=\"submitForm()\">\r\n      <input class=\"search-input\" type=\"text\" formControlName=\"text\" [matAutocomplete]=\"matAutocomplete2\"\r\n        [placeholder]=\"'search.search' | translate\" />\r\n      <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n    </form>\r\n    <mat-autocomplete class=\"\r\n       auto-complete-iner-wrapper\r\n        auto-complete-wrapper\r\n    \" [disableRipple]=\"true\" #matAutocomplete2=\"matAutocomplete\">\r\n      <mat-option class=\"no-text\" *ngIf=\"resultSets && !resultSets.length\">\r\n        {{'no_result_found' | translate}}\r\n      </mat-option>\r\n      <ng-container *ngFor=\"let resultSet of resultSets\">\r\n        <mat-option (click)=\"setOptionValue(resultSet.label)\">\r\n          <span class=\"option-iner-text\">{{ resultSet.label }}</span>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-autocomplete>\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 [entityType]=\"entityType\" [filters]=\"aggregation.buckets\" [id]=\"aggregation.id\"\r\n            [selections]=\"aggregation.selection\" [title]=\"aggregation.field\" [prefix]=\"'search'\" [department]=\"\r\n              aggregation.field === 'corr:to' ||\r\n              aggregation.field === 'corr:from'\r\n            \" [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n            [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n            [config]=\"aggregation.config ? aggregation.config : {}\" (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          <div>\r\n            <form class=\"d-flex justify-between\" [formGroup]=\"searchForm\" (ngSubmit)=\"submitForm()\">\r\n              <div *ngIf=\"useToggleFilters && !customResponsiveStyle\"></div>\r\n              <div *ngIf=\"customResponsiveStyle\">\r\n                <div class=\"search-form custom-responsive-search\">\r\n                  <input class=\"search-input\" type=\"text\" formControlName=\"text\" [matAutocomplete]=\"matAutocomplete\"\r\n                    [placeholder]=\"'search.search' | translate\" />\r\n                  <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n                </div>\r\n                <mat-autocomplete\r\n                class=\"\r\n                   auto-complete-iner-wrapper\r\n                    auto-complete-wrapper\r\n                \"\r\n                [disableRipple]=\"true\"\r\n                #matAutocomplete=\"matAutocomplete\"\r\n            >\r\n                <mat-option\r\n                    class=\"no-text\"\r\n                    *ngIf=\"resultSets && !resultSets.length\"\r\n                >\r\n                    {{no_result_found | translate}}\r\n                </mat-option>\r\n                <ng-container *ngFor=\"let resultSet of resultSets\">\r\n                    <mat-option  (click)=\"setOptionValue(resultSet.label)\">\r\n                        <span\r\n                            class=\"option-iner-text\"\r\n                            >{{ resultSet.label }}</span\r\n                        >\r\n                    </mat-option >\r\n                </ng-container>\r\n                </mat-autocomplete>\r\n              </div>\r\n              <div class=\"d-flex\" *ngIf=\"useToggleFilters\">\r\n                <cts-dynamic-form-slide-toggleitem class=\"mx-2 small-font\" [label]=\"'search.PERSONAL_FILES'\"\r\n                  (onToggle)=\"submitForm()\" formControlName=\"personalFiles\">\r\n                </cts-dynamic-form-slide-toggleitem>\r\n                <cts-dynamic-form-slide-toggleitem class=\"mx-2 small-font\" [label]=\"'search.DEP_FILES'\"\r\n                  formControlName=\"depFiles\" (onToggle)=\"submitForm()\">\r\n                </cts-dynamic-form-slide-toggleitem>\r\n                <cts-dynamic-form-slide-toggleitem class=\"mx-2 small-font\" [label]=\"'search.WORKSPACE_FILES'\"\r\n                formControlName=\"workSpaceFiles\" (onToggle)=\"submitForm()\">\r\n              </cts-dynamic-form-slide-toggleitem>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n        <cts-dynamic-table #dynamicTable [pageSize]=\"pageSize\" [columns]=\"columns\" [responsiveColumns]=\"responsiveColumns\"\r\n          [pageProvider]=\"pageProvider\" [quickFilter]=\"filter\" [entityType]=\"entityType\" [fields]=\"fields\"\r\n          [queryParam]=\"queryParams\" [higlightUnread]=\"higlightUnread\" [headers]=\"headers\" [prefix]=\"prefix\" [sortingBy]=\"sortingBy\" [isSearchPage]=\"true\"\r\n          (onRowSelected)=\"onRowSelected($event)\" (actionOnRow)=\"performAction($event)\"\r\n          (onGettingData)=\"getTableData($event)\"></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>", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.result-count{color:#8f98aa;font-size:14px}.search-sideMenu{background-color:#fff;padding-top:22px;padding-bottom:22px;border-radius:5px}.auto-complete-iner-wrapper{max-height:350px;border-radius:4px}.auto-complete-iner-wrapper .no-text{font-size:14px;color:#465573}.auto-complete-iner-wrapper .mat-option{text-align:start;color:#465573;font-weight:bold;font-size:14px}.auto-complete-iner-wrapper .mat-option .mat-option-text{text-align:flex-start}.search-form{display:flex;color:#6a768e;width:100%}.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-form .search-input::-webkit-input-placeholder{font-size:14px}.search-form .search-input:focus-visible{border:2px solid #465573;outline:transparent}.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}.small-font{font-size:14px}.custom-responsive-search{width:300px!important;margin:0 35px}.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:max-content}.wrapper .search-container .table-toolbar{display:flex;align-items:center;margin-bottom:8px;justify-content:space-between}.wrapper .wrapper-overlay{position:absolute;top:0;bottom:0;right:0;left:0;z-index:9}.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}@media (width: 1180px),(width: 820px){.customStyle cts-dynamic-filter .aggregation-container{width:176px!important}}.customStyle .search-form{display:flex;color:#6a768e;width:100%}.customStyle .search-form .search-input{width:288px;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}.customStyle .search-form .search-input::-webkit-input-placeholder{font-size:14px}.customStyle .search-form .search-input:focus-visible{border:2px solid #465573;outline:transparent}.customStyle .search-form .search-icon{background:#465573;color:#fff;width:40px;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}\n"], components: [{ type: DynamicFilterComponent, selector: "cts-dynamic-filter", inputs: ["title", "filters", "selections", "id", "entityType", "prefix", "department", "componentType", "customPageProvider", "config"], outputs: ["onFilterSelected"] }, { type: i5__namespace$3.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i2__namespace$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: CardComponent, selector: "app-card", inputs: ["noBody", "dark"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }, { type: DynamicTableComponent, selector: "cts-dynamic-table", inputs: ["columns", "responsiveColumns", "entityType", "prefix", "headers", "fields", "pageProvider", "pageSize", "higlightUnread", "isLegacyMode", "showTotalRecord", "pageNumber", "sortingBy", "queryParam", "customFilters", "quickFilter", "report", "rowCursor", "fullWidth", "tableMode", "componentName", "tableActions", "defultSort", "range", "isSearchPage", "multiSelectRows", "customFirstRow", "highlightSelectedCard", "showActionsAsMenu", "filterParams", "skipAggregation", "customUrl", "format", "requestActions", "pageSizes"], outputs: ["onRowSelected", "onRowIndexSelected", "actionOnRow", "onGettingData", "onMultiRowSelected", "onLoading", "sortChanged", "onPageChange", "onPage", "onLoad", "onInitialize"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.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: i5__namespace$3.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace.TranslatePipe }, animations: [
+  DynamicSearchComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", 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", filter: "filter", higlightUnread: "higlightUnread", suggesterApi: "suggesterApi", onRowSelected: "onRowSelected", sortingArray: "sortingArray", customResponsiveStyle: "customResponsiveStyle", openCloseFilterFromOutside: "openCloseFilterFromOutside", theme: "theme" }, outputs: { actionOnRow: "actionOnRow" }, viewQueries: [{ propertyName: "dynamicTable", first: true, predicate: ["dynamicTable"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"!customResponsiveStyle\">\r\n  <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</ng-container>\r\n\r\n<ng-container *ngIf=\"customResponsiveStyle\">\r\n  <div class=\"customStyle -mt-12 px-8 flex flex-col\"\r\n    [ngClass]=\"{'bg-accent-200': theme === 'dgda','bg-accent-100': theme === 'ksreleif' || theme === 'comptechco'}\"\r\n    [@collapse]=\"!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    <div class=\"flex gap-x-18 flex-row mt-5 pb-3 overflow-x-auto\">\r\n      <ng-container *ngIf=\"aggregations; else progressSpinner\">\r\n        <ng-container *ngIf=\"aggregations.length; else noAggregations\">\r\n          <ng-container *ngFor=\"let aggregation of aggregations\">\r\n            <ng-container *ngIf=\"aggregation.buckets.length > 0\">\r\n              <cts-dynamic-filter [entityType]=\"entityType\" [filters]=\"aggregation.buckets\" [id]=\"aggregation.id\"\r\n                [selections]=\"aggregation.selection\" [title]=\"aggregation.field\" [prefix]=\"'search'\" [department]=\"\r\n                    aggregation.field === 'corr:to' ||\r\n                    aggregation.field === 'corr:from'\r\n                  \" [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n                [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n                [config]=\"aggregation.config ? aggregation.config : {}\" (onFilterSelected)=\"FilterSelected($event)\">\r\n              </cts-dynamic-filter>\r\n            </ng-container>\r\n          </ng-container>\r\n        </ng-container>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</ng-container>\r\n\r\n<div class=\"row wrapper\">\r\n  <div class=\"wrapper-overlay\" *ngIf=\"loading\"></div>\r\n  \r\n  <ng-container *ngIf=\"!customResponsiveStyle\">\r\n    <div class=\"popup-filter px-3 d-flex d-xl-none\" *ngIf=\"openFilter\">\r\n      <form [formGroup]=\"searchForm\" class=\"search-form\" (ngSubmit)=\"submitForm()\">\r\n        <input class=\"search-input\" type=\"text\" formControlName=\"text\" [matAutocomplete]=\"matAutocomplete1\" [placeholder]=\"'search.search' | translate\" />\r\n        <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n      </form>\r\n      <mat-autocomplete\r\n      class=\"\r\n         auto-complete-iner-wrapper\r\n          auto-complete-wrapper\r\n      \"\r\n      [disableRipple]=\"true\"\r\n      #matAutocomplete1=\"matAutocomplete\"\r\n  >\r\n      <mat-option\r\n          class=\"no-text\"\r\n          *ngIf=\"resultSets && !resultSets.length\"\r\n      >\r\n          {{'no_result_found' | translate}}\r\n      </mat-option>\r\n      <ng-container *ngFor=\"let resultSet of resultSets\">\r\n          <mat-option  (click)=\"setOptionValue(resultSet.label)\">\r\n              <span\r\n                  class=\"option-iner-text\"\r\n                  >{{ resultSet.label }}</span\r\n              >\r\n          </mat-option >\r\n      </ng-container>\r\n      </mat-autocomplete>\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 [entityType]=\"entityType\" [filters]=\"aggregation.buckets\" [id]=\"aggregation.id\"\r\n                [selections]=\"aggregation.selection\" [title]=\"aggregation.field\" [prefix]=\"'search'\" [department]=\"\r\n                aggregation.field === 'corr:to' ||\r\n                aggregation.field === 'corr:from'\r\n              \" [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n                [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n                [config]=\"aggregation.config ? aggregation.config : {}\" (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  </ng-container>\r\n\r\n  <div class=\"col-xl-3 search-sideMenu d-none d-xl-block\">\r\n    <form [formGroup]=\"searchForm\" class=\"search-form\" (ngSubmit)=\"submitForm()\">\r\n      <input class=\"search-input\" type=\"text\" formControlName=\"text\" [matAutocomplete]=\"matAutocomplete2\"\r\n        [placeholder]=\"'search.search' | translate\" />\r\n      <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n    </form>\r\n    <mat-autocomplete class=\"\r\n       auto-complete-iner-wrapper\r\n        auto-complete-wrapper\r\n    \" [disableRipple]=\"true\" #matAutocomplete2=\"matAutocomplete\">\r\n      <mat-option class=\"no-text\" *ngIf=\"resultSets && !resultSets.length\">\r\n        {{'no_result_found' | translate}}\r\n      </mat-option>\r\n      <ng-container *ngFor=\"let resultSet of resultSets\">\r\n        <mat-option (click)=\"setOptionValue(resultSet.label)\">\r\n          <span class=\"option-iner-text\">{{ resultSet.label }}</span>\r\n        </mat-option>\r\n      </ng-container>\r\n    </mat-autocomplete>\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 [entityType]=\"entityType\" [filters]=\"aggregation.buckets\" [id]=\"aggregation.id\"\r\n            [selections]=\"aggregation.selection\" [title]=\"aggregation.field\" [prefix]=\"'search'\" [department]=\"\r\n              aggregation.field === 'corr:to' ||\r\n              aggregation.field === 'corr:from'\r\n            \" [componentType]=\"aggregation.componentType ? aggregation.componentType : 'defult'\"\r\n            [customPageProvider]=\"aggregation.customPageProvider ? aggregation.customPageProvider : ''\"\r\n            [config]=\"aggregation.config ? aggregation.config : {}\" (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          <div>\r\n            <form class=\"d-flex justify-between\" [formGroup]=\"searchForm\" (ngSubmit)=\"submitForm()\">\r\n              <div *ngIf=\"useToggleFilters && !customResponsiveStyle\"></div>\r\n              <div *ngIf=\"customResponsiveStyle\">\r\n                <div class=\"search-form custom-responsive-search\">\r\n                  <input class=\"search-input\" type=\"text\" formControlName=\"text\" [matAutocomplete]=\"matAutocomplete\"\r\n                    [placeholder]=\"'search.search' | translate\" />\r\n                  <div (click)=\"submitForm()\" class=\"search-icon bi bi-search\"></div>\r\n                </div>\r\n                <mat-autocomplete\r\n                class=\"\r\n                   auto-complete-iner-wrapper\r\n                    auto-complete-wrapper\r\n                \"\r\n                [disableRipple]=\"true\"\r\n                #matAutocomplete=\"matAutocomplete\"\r\n            >\r\n                <mat-option\r\n                    class=\"no-text\"\r\n                    *ngIf=\"resultSets && !resultSets.length\"\r\n                >\r\n                    {{no_result_found | translate}}\r\n                </mat-option>\r\n                <ng-container *ngFor=\"let resultSet of resultSets\">\r\n                    <mat-option  (click)=\"setOptionValue(resultSet.label)\">\r\n                        <span\r\n                            class=\"option-iner-text\"\r\n                            >{{ resultSet.label }}</span\r\n                        >\r\n                    </mat-option >\r\n                </ng-container>\r\n                </mat-autocomplete>\r\n              </div>\r\n              <div class=\"d-flex\" *ngIf=\"useToggleFilters\">\r\n                <cts-dynamic-form-slide-toggleitem class=\"mx-2 small-font\" [label]=\"'search.PERSONAL_FILES'\"\r\n                  (onToggle)=\"submitForm()\" formControlName=\"personalFiles\">\r\n                </cts-dynamic-form-slide-toggleitem>\r\n                <cts-dynamic-form-slide-toggleitem class=\"mx-2 small-font\" [label]=\"'search.DEP_FILES'\"\r\n                  formControlName=\"depFiles\" (onToggle)=\"submitForm()\">\r\n                </cts-dynamic-form-slide-toggleitem>\r\n                <cts-dynamic-form-slide-toggleitem class=\"mx-2 small-font\" [label]=\"'search.WORKSPACE_FILES'\"\r\n                formControlName=\"workSpaceFiles\" (onToggle)=\"submitForm()\">\r\n              </cts-dynamic-form-slide-toggleitem>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n        <cts-dynamic-table #dynamicTable [pageSize]=\"pageSize\" [columns]=\"columns\" [responsiveColumns]=\"responsiveColumns\"\r\n          [pageProvider]=\"pageProvider\" [quickFilter]=\"filter\" [entityType]=\"entityType\" [fields]=\"fields\"\r\n          [queryParam]=\"queryParams\" [skipAggregation]=\"'never'\" [higlightUnread]=\"higlightUnread\" [headers]=\"headers\" [prefix]=\"prefix\" [sortingBy]=\"sortingBy\" [isSearchPage]=\"true\"\r\n          (onRowSelected)=\"onRowSelected($event)\" (actionOnRow)=\"performAction($event)\"\r\n          (onGettingData)=\"getTableData($event)\"></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>", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.result-count{color:#8f98aa;font-size:14px}.search-sideMenu{background-color:#fff;padding-top:22px;padding-bottom:22px;border-radius:5px}.auto-complete-iner-wrapper{max-height:350px;border-radius:4px}.auto-complete-iner-wrapper .no-text{font-size:14px;color:#465573}.auto-complete-iner-wrapper .mat-option{text-align:start;color:#465573;font-weight:bold;font-size:14px}.auto-complete-iner-wrapper .mat-option .mat-option-text{text-align:flex-start}.search-form{display:flex;color:#6a768e;width:100%}.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-form .search-input::-webkit-input-placeholder{font-size:14px}.search-form .search-input:focus-visible{border:2px solid #465573;outline:transparent}.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}.small-font{font-size:14px}.custom-responsive-search{width:300px!important;margin:0 35px}.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:max-content}.wrapper .search-container .table-toolbar{display:flex;align-items:center;margin-bottom:8px;justify-content:space-between}.wrapper .wrapper-overlay{position:absolute;top:0;bottom:0;right:0;left:0;z-index:9}.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}@media (width: 1180px),(width: 820px){.customStyle cts-dynamic-filter .aggregation-container{width:176px!important}}.customStyle .search-form{display:flex;color:#6a768e;width:100%}.customStyle .search-form .search-input{width:288px;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}.customStyle .search-form .search-input::-webkit-input-placeholder{font-size:14px}.customStyle .search-form .search-input:focus-visible{border:2px solid #465573;outline:transparent}.customStyle .search-form .search-icon{background:#465573;color:#fff;width:40px;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}\n"], components: [{ type: DynamicFilterComponent, selector: "cts-dynamic-filter", inputs: ["title", "filters", "selections", "id", "entityType", "prefix", "department", "componentType", "customPageProvider", "config"], outputs: ["onFilterSelected"] }, { type: i5__namespace$3.MatAutocomplete, selector: "mat-autocomplete", inputs: ["disableRipple"], exportAs: ["matAutocomplete"] }, { type: i2__namespace$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: CardComponent, selector: "app-card", inputs: ["noBody", "dark"] }, { type: DynamicFormSlideToggleitemComponent, selector: "cts-dynamic-form-slide-toggleitem", inputs: ["label", "disabled", "checked", "theme"], outputs: ["onToggle"] }, { type: DynamicTableComponent, selector: "cts-dynamic-table", inputs: ["columns", "responsiveColumns", "entityType", "prefix", "headers", "fields", "pageProvider", "pageSize", "higlightUnread", "isLegacyMode", "showTotalRecord", "pageNumber", "sortingBy", "queryParam", "customFilters", "quickFilter", "report", "rowCursor", "fullWidth", "tableMode", "componentName", "tableActions", "defultSort", "range", "isSearchPage", "multiSelectRows", "customFirstRow", "highlightSelectedCard", "showActionsAsMenu", "filterParams", "skipAggregation", "customUrl", "format", "requestActions", "pageSizes"], outputs: ["onRowSelected", "onRowIndexSelected", "actionOnRow", "onGettingData", "onMultiRowSelected", "onLoading", "sortChanged", "onPageChange", "onPage", "onLoad", "onInitialize"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.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: i5__namespace$3.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", exportAs: ["matAutocompleteTrigger"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }], pipes: { "translate": i1__namespace.TranslatePipe }, animations: [
           animations.trigger('collapse', [
               animations.state('false', animations.style({ height: animations.AUTO_STYLE, visibility: animations.AUTO_STYLE })),
               animations.state('true', animations.style({ height: '0', visibility: 'hidden' })),
@@ -23930,7 +23938,7 @@
           SelectModule,
           i6$1.AutocompleteLibModule,
           i5$5.LayoutModule,
-          i7$1.MatChipsModule,
+          i7$2.MatChipsModule,
           i3$1.MatMenuModule,
           i2$3.MatListModule,
           i2$2.MatIconModule,
@@ -23953,7 +23961,7 @@
               SelectModule,
               i6$1.AutocompleteLibModule,
               i5$5.LayoutModule,
-              i7$1.MatChipsModule,
+              i7$2.MatChipsModule,
               i3$1.MatMenuModule,
               i2$3.MatListModule,
               i2$2.MatIconModule,
@@ -23987,7 +23995,7 @@
                           SelectModule,
                           i6$1.AutocompleteLibModule,
                           i5$5.LayoutModule,
-                          i7$1.MatChipsModule,
+                          i7$2.MatChipsModule,
                           i3$1.MatMenuModule,
                           i2$3.MatListModule,
                           i2$2.MatIconModule,
@@ -24215,7 +24223,7 @@
       return CorrespondenceTagsComponent;
   }());
   CorrespondenceTagsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CorrespondenceTagsComponent, deps: [{ token: TagsApiService }, { token: NuxeoService }, { token: EvaluatorsService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  CorrespondenceTagsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CorrespondenceTagsComponent, selector: "cts-correspondence-tags", inputs: { alwaysShowRemoveBtn: "alwaysShowRemoveBtn", correspondence: "correspondence", customClass: "customClass", addCustomApiName: "addCustomApiName", deleteCustomApiName: "deleteCustomApiName", useParams: "useParams", accordionMode: "accordionMode", systemTags: "systemTags", accordionOpen: "accordionOpen", title: "title", multiple: "multiple" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"{{customClass}}\">\r\n  <div class=\"tags-header\" [ngClass]=\"{'border-b': !open}\">\r\n    <div class=\"tag-header-title\">{{ title | translate }}</div>\r\n    <div class=\"flex gap-x-2\">\r\n      <ng-container *ngIf=\"!systemTags\">\r\n        <div\r\n      \r\n        class=\"allowEdit-tag-btn\"\r\n        *permission=\"{ name: 'addTag', entity: correspondence, user: nuxeoService.nuxeoClient.user }\"\r\n        (click)=\"removable = !removable\"\r\n        >\r\n          <span class=\"bi bi-plus-lg detailed-menu\" [matTooltip]=\"'Tags.toolTip' | translate\" *ngIf=\"!removable\"></span>\r\n          <span class=\"tags-close-icon bi bi-x detailed-menu\" [matTooltip]=\"'Tags.Close' | translate\" *ngIf=\"removable\"></span>\r\n        </div>\r\n      </ng-container>\r\n      <button (click)=\"toggleAccrdion()\" *ngIf=\"accordionMode\">\r\n        <mat-icon svgIcon=\"mat_solid:keyboard_arrow_up\" *ngIf=\"open\"></mat-icon>\r\n        <mat-icon svgIcon=\"mat_solid:keyboard_arrow_down\" *ngIf=\"!open\"></mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"tags-wrapper\" [@collapse]=\"!open\">\r\n    <ng-container *ngIf=\"removable && !systemTags\">\r\n      <div class=\"add-tag-container\">\r\n        <div class=\"tag-form-container\">\r\n          <form [formGroup]=\"tagsFrom\">\r\n            <cts-dynamic-form-select-tag\r\n             formControlName=\"tag\"\r\n             [multiple]=\"multiple\">\r\n            </cts-dynamic-form-select-tag>\r\n          </form>\r\n        </div>\r\n        <div class=\"add-tag-btn\">\r\n          <cts-button\r\n            [disabled]=\"this.tagsFrom.invalid\"\r\n            [loading]=\"loading\"\r\n            (onClick)=\"addTag()\"\r\n            class=\"detailed-menu\"\r\n            >{{ \"BUTTONS.ADD\" | translate }}</cts-button\r\n          >\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"tagsList.length > 0; else noEntry\">\r\n      <div class=\"tags-list-container row\">\r\n        <mat-chip-list *ngFor=\"let tag of tagsList\">\r\n          <mat-chip [removable]=\"removable || (canRemoveTag && alwaysShowRemoveBtn)\" (removed)=\"deleteTag(tag)\"\r\n            >{{ tag }} \r\n            <mat-icon matChipRemove class=\"cancelBtn\" *ngIf=\"(removable && !systemTags) || (canRemoveTag && alwaysShowRemoveBtn)\">cancel</mat-icon>\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n\r\n</div>\r\n\r\n<ng-template #noEntry>\r\n  <cts-no-data [message]=\"'Tags.noEntry'\" [border]=\"false\"></cts-no-data>\r\n</ng-template>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.tags-header{display:flex;justify-content:space-between;align-items:center;font-weight:bold;font-size:14px}.tags-header .allowEdit-tag-btn{cursor:pointer}.tags-header .allowEdit-tag-btn span{color:#1a96c6;font-size:18px}.tags-header .allowEdit-tag-btn .tags-close-icon{display:flex;font-size:30px}.tags-wrapper{padding:5px 16px;border:1px solid #d9dce2;display:flex;flex-direction:column;grid-row-gap:8px;row-gap:8px}.tags-wrapper .add-tag-container{display:flex;justify-content:space-between;grid-column-gap:6px;column-gap:6px}.tags-wrapper .add-tag-container .tag-form-container{width:80%}.tags-wrapper .add-tag-container .add-tag-btn{width:20%}.tags-wrapper .tags-list-container{display:flex;grid-column-gap:4px;column-gap:4px;grid-row-gap:8px;row-gap:8px;margin:0}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicFormSelectTagComponent, selector: "cts-dynamic-form-select-tag", inputs: ["label", "multiple", "selectedTagsCustomTemplate"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }, { type: i7__namespace$1.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: NoDataComponent, selector: "cts-no-data", inputs: ["message", "border", "img"] }], directives: [{ type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i7__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$1.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i7__namespace$1.MatChipRemove, selector: "[matChipRemove]" }], pipes: { "translate": i1__namespace.TranslatePipe }, animations: [
+  CorrespondenceTagsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CorrespondenceTagsComponent, selector: "cts-correspondence-tags", inputs: { alwaysShowRemoveBtn: "alwaysShowRemoveBtn", correspondence: "correspondence", customClass: "customClass", addCustomApiName: "addCustomApiName", deleteCustomApiName: "deleteCustomApiName", useParams: "useParams", accordionMode: "accordionMode", systemTags: "systemTags", accordionOpen: "accordionOpen", title: "title", multiple: "multiple" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"{{customClass}}\">\r\n  <div class=\"tags-header\" [ngClass]=\"{'border-b': !open}\">\r\n    <div class=\"tag-header-title\">{{ title | translate }}</div>\r\n    <div class=\"flex gap-x-2\">\r\n      <ng-container *ngIf=\"!systemTags\">\r\n        <div\r\n      \r\n        class=\"allowEdit-tag-btn\"\r\n        *permission=\"{ name: 'addTag', entity: correspondence, user: nuxeoService.nuxeoClient.user }\"\r\n        (click)=\"removable = !removable\"\r\n        >\r\n          <span class=\"bi bi-plus-lg detailed-menu\" [matTooltip]=\"'Tags.toolTip' | translate\" *ngIf=\"!removable\"></span>\r\n          <span class=\"tags-close-icon bi bi-x detailed-menu\" [matTooltip]=\"'Tags.Close' | translate\" *ngIf=\"removable\"></span>\r\n        </div>\r\n      </ng-container>\r\n      <button (click)=\"toggleAccrdion()\" *ngIf=\"accordionMode\">\r\n        <mat-icon svgIcon=\"mat_solid:keyboard_arrow_up\" *ngIf=\"open\"></mat-icon>\r\n        <mat-icon svgIcon=\"mat_solid:keyboard_arrow_down\" *ngIf=\"!open\"></mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"tags-wrapper\" [@collapse]=\"!open\">\r\n    <ng-container *ngIf=\"removable && !systemTags\">\r\n      <div class=\"add-tag-container\">\r\n        <div class=\"tag-form-container\">\r\n          <form [formGroup]=\"tagsFrom\">\r\n            <cts-dynamic-form-select-tag\r\n             formControlName=\"tag\"\r\n             [multiple]=\"multiple\">\r\n            </cts-dynamic-form-select-tag>\r\n          </form>\r\n        </div>\r\n        <div class=\"add-tag-btn\">\r\n          <cts-button\r\n            [disabled]=\"this.tagsFrom.invalid\"\r\n            [loading]=\"loading\"\r\n            (onClick)=\"addTag()\"\r\n            class=\"detailed-menu\"\r\n            >{{ \"BUTTONS.ADD\" | translate }}</cts-button\r\n          >\r\n        </div>\r\n      </div>\r\n    </ng-container>\r\n    <ng-container *ngIf=\"tagsList.length > 0; else noEntry\">\r\n      <div class=\"tags-list-container row\">\r\n        <mat-chip-list *ngFor=\"let tag of tagsList\">\r\n          <mat-chip [removable]=\"removable || (canRemoveTag && alwaysShowRemoveBtn)\" (removed)=\"deleteTag(tag)\"\r\n            >{{ tag }} \r\n            <mat-icon matChipRemove class=\"cancelBtn\" *ngIf=\"(removable && !systemTags) || (canRemoveTag && alwaysShowRemoveBtn)\">cancel</mat-icon>\r\n          </mat-chip>\r\n        </mat-chip-list>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n\r\n</div>\r\n\r\n<ng-template #noEntry>\r\n  <cts-no-data [message]=\"'Tags.noEntry'\" [border]=\"false\"></cts-no-data>\r\n</ng-template>\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.tags-header{display:flex;justify-content:space-between;align-items:center;font-weight:bold;font-size:14px}.tags-header .allowEdit-tag-btn{cursor:pointer}.tags-header .allowEdit-tag-btn span{color:#1a96c6;font-size:18px}.tags-header .allowEdit-tag-btn .tags-close-icon{display:flex;font-size:30px}.tags-wrapper{padding:5px 16px;border:1px solid #d9dce2;display:flex;flex-direction:column;grid-row-gap:8px;row-gap:8px}.tags-wrapper .add-tag-container{display:flex;justify-content:space-between;grid-column-gap:6px;column-gap:6px}.tags-wrapper .add-tag-container .tag-form-container{width:80%}.tags-wrapper .add-tag-container .add-tag-btn{width:20%}.tags-wrapper .tags-list-container{display:flex;grid-column-gap:4px;column-gap:4px;grid-row-gap:8px;row-gap:8px;margin:0}\n"], components: [{ type: i2__namespace$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: DynamicFormSelectTagComponent, selector: "cts-dynamic-form-select-tag", inputs: ["label", "multiple", "selectedTagsCustomTemplate"] }, { type: ButtonComponent, selector: "cts-button", inputs: ["disabled", "loading", "size", "theme", "spinnerTheming"], outputs: ["onClick"] }, { type: i7__namespace$2.MatChipList, selector: "mat-chip-list", inputs: ["aria-orientation", "multiple", "compareWith", "value", "required", "placeholder", "disabled", "selectable", "tabIndex", "errorStateMatcher"], outputs: ["change", "valueChange"], exportAs: ["matChipList"] }, { type: NoDataComponent, selector: "cts-no-data", inputs: ["message", "border", "img"] }], directives: [{ type: i4__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PermissionsDirective, selector: "[permission]", inputs: ["permission"] }, { type: i7__namespace.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltipPosition", "matTooltipDisabled", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { type: i2__namespace$4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace$4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace$4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace$4.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7__namespace$2.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["color", "disableRipple", "tabIndex", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"], exportAs: ["matChip"] }, { type: i7__namespace$2.MatChipRemove, selector: "[matChipRemove]" }], pipes: { "translate": i1__namespace.TranslatePipe }, animations: [
           animations.trigger('collapse', [
               animations.state('false', animations.style({ height: animations.AUTO_STYLE, visibility: animations.AUTO_STYLE })),
               animations.state('true', animations.style({ height: '0', visibility: 'hidden' })),
@@ -24275,7 +24283,7 @@
   CtsTagsModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CtsTagsModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
   CtsTagsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CtsTagsModule, declarations: [CorrespondenceTagsComponent], imports: [i4.CommonModule,
           i1.TranslateModule,
-          i7$1.MatChipsModule,
+          i7$2.MatChipsModule,
           i5.NgSelectModule,
           i2.FormsModule,
           i2.ReactiveFormsModule,
@@ -24287,7 +24295,7 @@
   CtsTagsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: CtsTagsModule, imports: [[
               i4.CommonModule,
               i1.TranslateModule,
-              i7$1.MatChipsModule,
+              i7$2.MatChipsModule,
               i5.NgSelectModule,
               i2.FormsModule,
               i2.ReactiveFormsModule,
@@ -24304,7 +24312,7 @@
                       imports: [
                           i4.CommonModule,
                           i1.TranslateModule,
-                          i7$1.MatChipsModule,
+                          i7$2.MatChipsModule,
                           i5.NgSelectModule,
                           i2.FormsModule,
                           i2.ReactiveFormsModule,
@@ -34590,7 +34598,7 @@
       return PermissionsComponent;
   }());
   PermissionsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PermissionsComponent, deps: [{ token: PermissionService }, { token: i1__namespace$3.MatDialog }, { token: CustomToastrService }, { token: TranslationService }, { token: NuxeoService }, { token: UserService }, { token: EvaluatorsService }, { token: NuxeoDialogService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  PermissionsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PermissionsComponent, selector: "app-permissions", inputs: { documentId: "documentId", document: "document", allowAddAndBlock: "allowAddAndBlock", sourcePage: "sourcePage" }, ngImport: i0__namespace, template: "<div class=\"h-auto mt-3 px-0 pb-4\" *ngIf=\"!loading; else loader\">\r\n    <!--LocalPermission List Items-->\r\n    <div *ngIf=\"sourcePage != 'myFiles'\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.local\" | translate\r\n            }}</span>\r\n            <span *ngIf=\"allowAdd_Block_DeletePermission && !inheritedPermissions.length\">\r\n                <button\r\n                    *ngIf=\"allowAddAndBlock\"\r\n                    class=\"hover:text-blue-700 text-blue-500 mb-1 text-base\"\r\n                    (click)=\"addNewLocalPermissions()\"\r\n                    [disabled]=\"!permissionsType\"\r\n                >\r\n                    {{ \"permission.new\" | translate }}\r\n                </button>\r\n            </span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [allowDeleteAndEdit]=\"allowAdd_Block_DeletePermission\"\r\n            [permissionsArray]=\"localPermissions\"\r\n            *ngIf=\"localPermissions.length > 0; else nolocalPermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <ng-template #nolocalPermissions>\r\n        <div class=\"single-permssion p-3 text-center\">\r\n            {{ \"permission.noLocal\" | translate }}\r\n        </div>\r\n    </ng-template>\r\n    <!--InheritedPermission List Items-->\r\n    <div>\r\n        <div class=\"flex flex-row justify-between mt-3\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.inherited\" | translate\r\n            }}</span>\r\n            <span *ngIf=\"allowAdd_Block_DeletePermission\">\r\n                <button\r\n                    class=\"hover:text-blue-700 text-blue-500 mb-1 text-base\"\r\n                    *ngIf=\"status != null && allowAddAndBlock\"\r\n                >\r\n                    <span\r\n                        *ngIf=\"status == 'block'; else unblock\"\r\n                        (click)=\"unblockPermissionInheritance()\"\r\n                    >\r\n                        {{ \"permission.unblock\" | translate }}\r\n                    </span>\r\n                    <ng-template #unblock>\r\n                        <span (click)=\"blockPermissionInheritance()\">\r\n                            {{ \"permission.block\" | translate }}\r\n                        </span>\r\n                    </ng-template>\r\n                </button>\r\n            </span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\" *ngIf=\"!blockOrUnblock\"></mat-divider>\r\n        <mat-progress-bar mode=\"indeterminate\" *ngIf=\"blockOrUnblock\"></mat-progress-bar>\r\n        <app-permissions-template\r\n            *ngIf=\"inheritedPermissions.length > 0; else noinheritedPermissions\"\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            [permissionsArray]=\"inheritedPermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <ng-template #noinheritedPermissions>\r\n        <div class=\"single-permssion p-3 text-center\">\r\n            {{\"permission.noInherited\" | translate }}</div>\r\n    </ng-template>\r\n    <!--departmentPermissions List Items-->\r\n    <div *ngIf=\"departmentPermissions.length > 0\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.departmentPermissions\" | translate\r\n            }}</span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [permissionsArray]=\"departmentPermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <!--sharePermissions List Items-->\r\n    <div *ngIf=\"sharePermissions.length > 0\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.sharePermissions\" | translate\r\n            }}</span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [permissionsArray]=\"sharePermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <!--workflowPermissions List Items-->\r\n    <div *ngIf=\"workflowPermissions.length > 0\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.workflowPermissions\" | translate\r\n            }}</span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [permissionsArray]=\"workflowPermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #loader>\r\n    <div class=\"flex items-center justify-center w-full h-full\">\r\n        <mat-spinner [value]=\"90\" [strokeWidth]=\"6\" overlay=\"true\" [diameter]=\"75\"></mat-spinner>\r\n    </div>\r\n</ng-template>\r\n", styles: [""], components: [{ type: i9__namespace$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: PermissionsTemplateComponent, selector: "app-permissions-template", inputs: ["allowDeleteAndEdit", "documentId", "userVisiblePermissions", "permissionsArray"], outputs: ["getPermissions"] }, { type: i4__namespace$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
+  PermissionsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PermissionsComponent, selector: "app-permissions", inputs: { documentId: "documentId", document: "document", allowAddAndBlock: "allowAddAndBlock", sourcePage: "sourcePage" }, ngImport: i0__namespace, template: "<div class=\"h-auto mt-3 px-0 pb-4\" *ngIf=\"!loading; else loader\">\r\n    <!--LocalPermission List Items-->\r\n    <div *ngIf=\"sourcePage != 'myFiles'\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.local\" | translate\r\n            }}</span>\r\n            <span *ngIf=\"allowAdd_Block_DeletePermission && !inheritedPermissions.length\">\r\n                <button\r\n                    *ngIf=\"allowAddAndBlock\"\r\n                    class=\"hover:text-blue-700 text-blue-500 mb-1 text-base\"\r\n                    (click)=\"addNewLocalPermissions()\"\r\n                    [disabled]=\"!permissionsType\"\r\n                >\r\n                    {{ \"permission.new\" | translate }}\r\n                </button>\r\n            </span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [allowDeleteAndEdit]=\"allowAdd_Block_DeletePermission\"\r\n            [permissionsArray]=\"localPermissions\"\r\n            *ngIf=\"localPermissions.length > 0; else nolocalPermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <ng-template #nolocalPermissions>\r\n        <div class=\"single-permssion p-3 text-center\">\r\n            {{ \"permission.noLocal\" | translate }}\r\n        </div>\r\n    </ng-template>\r\n    <!--InheritedPermission List Items-->\r\n    <div>\r\n        <div class=\"flex flex-row justify-between mt-3\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.inherited\" | translate\r\n            }}</span>\r\n            <span *ngIf=\"allowAdd_Block_DeletePermission\">\r\n                <button\r\n                    class=\"hover:text-blue-700 text-blue-500 mb-1 text-base\"\r\n                    *ngIf=\"status != null && allowAddAndBlock\"\r\n                >\r\n                    <span\r\n                        *ngIf=\"status == 'block'; else unblock\"\r\n                        (click)=\"unblockPermissionInheritance()\"\r\n                    >\r\n                        {{ \"permission.unblock\" | translate }}\r\n                    </span>\r\n                    <ng-template #unblock>\r\n                        <span (click)=\"blockPermissionInheritance()\">\r\n                            {{ \"permission.block\" | translate }}\r\n                        </span>\r\n                    </ng-template>\r\n                </button>\r\n            </span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\" *ngIf=\"!blockOrUnblock\"></mat-divider>\r\n        <mat-progress-bar mode=\"indeterminate\" *ngIf=\"blockOrUnblock\"></mat-progress-bar>\r\n        <app-permissions-template\r\n            *ngIf=\"inheritedPermissions.length > 0; else noinheritedPermissions\"\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            [permissionsArray]=\"inheritedPermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <ng-template #noinheritedPermissions>\r\n        <div class=\"single-permssion p-3 text-center\">\r\n            {{\"permission.noInherited\" | translate }}</div>\r\n    </ng-template>\r\n    <!--departmentPermissions List Items-->\r\n    <div *ngIf=\"departmentPermissions.length > 0\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.departmentPermissions\" | translate\r\n            }}</span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [permissionsArray]=\"departmentPermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <!--sharePermissions List Items-->\r\n    <div *ngIf=\"sharePermissions.length > 0\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.sharePermissions\" | translate\r\n            }}</span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [permissionsArray]=\"sharePermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n    <!--workflowPermissions List Items-->\r\n    <div *ngIf=\"workflowPermissions.length > 0\">\r\n        <div class=\"flex flex-row justify-between\">\r\n            <span class=\"font-bold text-gray-500 text-base\">{{\r\n                \"permission.workflowPermissions\" | translate\r\n            }}</span>\r\n        </div>\r\n        <mat-divider class=\"mat-divider\"></mat-divider>\r\n        <app-permissions-template\r\n            [documentId]=\"documentId\"\r\n            [userVisiblePermissions]=\"userVisiblePermissions\"\r\n            (getPermissions)=\"getPermissions()\"\r\n            [permissionsArray]=\"workflowPermissions\"\r\n        >\r\n        </app-permissions-template>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #loader>\r\n    <div class=\"flex items-center justify-center w-full h-full\">\r\n        <mat-spinner [value]=\"90\" [strokeWidth]=\"6\" overlay=\"true\" [diameter]=\"75\"></mat-spinner>\r\n    </div>\r\n</ng-template>\r\n", styles: [""], components: [{ type: i9__namespace.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: PermissionsTemplateComponent, selector: "app-permissions-template", inputs: ["allowDeleteAndEdit", "documentId", "userVisiblePermissions", "permissionsArray"], outputs: ["getPermissions"] }, { type: i4__namespace$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i1__namespace.TranslatePipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PermissionsComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -36554,7 +36562,7 @@
       return LatestActivityComponent;
   }());
   LatestActivityComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: LatestActivityComponent, deps: [{ token: ActivityLogService }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  LatestActivityComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: LatestActivityComponent, selector: "cts-latest-activity", inputs: { documentId: "documentId", documentTitle: "documentTitle", isArabic: "isArabic", newLogActor: "newLogActor", displayOpenedLogs: "displayOpenedLogs" }, outputs: { success: "success" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"logs-progress-bar\" *ngIf=\"isFetching\">\r\n  <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\r\n</div>\r\n\r\n<div\r\n  [scrollWindow]=\"false\"\r\n  infiniteScroll\r\n  [infiniteScrollDistance]=\"2\"\r\n  [infiniteScrollThrottle]=\"50\"\r\n  (scrolled)=\"onScroll()\"\r\n  class=\"activity-body\"\r\n>\r\n  <div class=\"activity-area\">\r\n    <div *ngFor=\"let item of activitylog; let i = index\">\r\n      <cts-single-activity [item]=\"item\" [documentTitle]=\"documentTitle\" [isArabic]=\"isArabic\" [newLogActor]=\"newLogActor\">\r\n      </cts-single-activity>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- <cts-single-activity [user]=\"item.creator\">\r\n      <div class=\"lineOne\">\r\n        <span class=\"\">\r\n            {{ item.creator.properties?.firstName }}\r\n            {{ item.creator.properties?.lastName }} // commented\r\n          </span>\r\n        <cts-activity-line [item]=\"item\" [documentTitle]=\"documentTitle\">\r\n        </cts-activity-line>\r\n      </div>\r\n      <div class=\"lineOnePart2\">\r\n          <span class=\"mx-2\">\r\n            {{item.eventName}} commented \r\n          </span>\r\n        </div>\r\n      <div class=\"lineTwo\">\r\n        <span class=\"\" style=\"width: fit-content\">\r\n          {{ item.eventDate | localizedDate: \"EEEE, MMMM d, y\" }}\r\n        </span>\r\n      </div>\r\n    </cts-single-activity> -->\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.activity-body{padding:14px 10px;overflow:auto;height:100%}.activity-body .activity-area{padding-inline-start:20px;padding-inline-end:12px;border-inline-start:2px solid #d9dce2}\n"], components: [{ type: i4__namespace$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: SingleActivityComponent, selector: "cts-single-activity", inputs: ["item", "documentTitle", "newLogActor", "isArabic"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9__namespace.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
+  LatestActivityComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: LatestActivityComponent, selector: "cts-latest-activity", inputs: { documentId: "documentId", documentTitle: "documentTitle", isArabic: "isArabic", newLogActor: "newLogActor", displayOpenedLogs: "displayOpenedLogs" }, outputs: { success: "success" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div class=\"logs-progress-bar\" *ngIf=\"isFetching\">\r\n  <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\r\n</div>\r\n\r\n<div\r\n  [scrollWindow]=\"false\"\r\n  infiniteScroll\r\n  [infiniteScrollDistance]=\"2\"\r\n  [infiniteScrollThrottle]=\"50\"\r\n  (scrolled)=\"onScroll()\"\r\n  class=\"activity-body\"\r\n>\r\n  <div class=\"activity-area\">\r\n    <div *ngFor=\"let item of activitylog; let i = index\">\r\n      <cts-single-activity [item]=\"item\" [documentTitle]=\"documentTitle\" [isArabic]=\"isArabic\" [newLogActor]=\"newLogActor\">\r\n      </cts-single-activity>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<!-- <cts-single-activity [user]=\"item.creator\">\r\n      <div class=\"lineOne\">\r\n        <span class=\"\">\r\n            {{ item.creator.properties?.firstName }}\r\n            {{ item.creator.properties?.lastName }} // commented\r\n          </span>\r\n        <cts-activity-line [item]=\"item\" [documentTitle]=\"documentTitle\">\r\n        </cts-activity-line>\r\n      </div>\r\n      <div class=\"lineOnePart2\">\r\n          <span class=\"mx-2\">\r\n            {{item.eventName}} commented \r\n          </span>\r\n        </div>\r\n      <div class=\"lineTwo\">\r\n        <span class=\"\" style=\"width: fit-content\">\r\n          {{ item.eventDate | localizedDate: \"EEEE, MMMM d, y\" }}\r\n        </span>\r\n      </div>\r\n    </cts-single-activity> -->\r\n", styles: [".bi{margin:0!important}.memo-sorting-wrapper{width:265px;margin:0 10px;height:100%;display:flex}.memo-sorting-wrapper .sorting-direction{width:65px;height:40px;background-color:#465573;color:#fff;font-size:20px;display:flex;justify-content:center;align-items:center;cursor:pointer}.memo-sorting-wrapper .memo-sorting-trigger{width:calc(100% - 65px);height:100%;background-color:transparent;border:1px solid lightgrey;display:flex;justify-content:space-between;align-items:center;padding:0 15px;font-size:14px}.memo-sorting-wrapper .memo-sorting-trigger i{font-size:16px;color:gray}.memo-sorting-menu{width:200px}.my-button{border:1px solid #465573;color:#465573;border-radius:5px;background-color:transparent;font-weight:bold;min-width:80px;height:40px}.my-button.reset{border:none}.my-button:hover{color:#fff;background-color:#465573}.my-button:hover.reset{color:#465573;border:1px solid #465573;background-color:#fff}.app-property-value .app-input-wrapper label{color:#646f85;font-size:13px;margin-bottom:5px}.app-property-value .app-input-wrapper label .text-danger{font-size:16px;line-height:14px;margin:0 5px!important}.app-property-value .app-input-wrapper .form-control{border:1px solid #ccc;border-radius:5px;background-color:#8f98aa1a;height:40px}.app-property-value .app-input-wrapper .form-control:disabled{background-color:#e9ecef!important}.app-property-value .app-input-wrapper .form-control:focus{border:1px solid #1a96c6;box-shadow:0 0 4px #79c3c26b!important}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers{list-style:none;padding:0;margin:0;font-size:14px}.app-property-value .app-input-wrapper .app-textitem-editable-error .error-containers .error{margin-top:5px}.autocomplete-container .input-container input:focus,hijri-gregorian-datepicker .form-group .input-group .form-control:focus,.ng-select.ng-select-focused .ng-select-container{border:1px solid #1a96c6!important;box-shadow:0 0 4px #79c3c26b!important}input::placeholder{font-size:12px}.form-control:focus{box-shadow:none!important}.mat-stepper-horizontal{margin-top:-25px}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header.cdk-program-focused{background-color:transparent}.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-icon-selected{background-color:transparent;color:#fff;background-image:linear-gradient(to right,#0dbab5,#1a96c6)}@media only screen and (max-width: 576px){.mat-stepper-horizontal .mat-horizontal-stepper-header-container .mat-step-header .mat-step-label .mat-step-text-label{white-space:pre-wrap;overflow:visible}}.mat-stepper-horizontal .mat-horizontal-content-container{overflow:visible}@media only screen and (max-width: 768px){.mat-stepper-horizontal .mat-horizontal-content-container{padding:0 0 24px}}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:after,.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:before{display:none}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:first-child:before{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);left:0}.mat-stepper-horizontal.rtl .mat-horizontal-stepper-header:last-child:after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px);right:0}.form-wrapper{padding:30px 15px;border:1px solid #dde0e2}.form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.form-wrapper .buttons-wrapper button:hover{opacity:.7}.form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.form-wrapper .upload-wrapper button span{margin:0 10px}.renameFileComponent .form-wrapper{padding:30px 15px;border:none!important}.renameFileComponent .form-wrapper .buttons-wrapper{display:flex;justify-content:space-between}.renameFileComponent .form-wrapper .buttons-wrapper .action-buttons-wrapper{display:flex}.renameFileComponent .form-wrapper .buttons-wrapper button{background-image:linear-gradient(to right,#0dbab5,#1a96c6);height:40px;color:#fff;border:none;width:125px;margin-top:20px;border-radius:5px}.renameFileComponent .form-wrapper .buttons-wrapper button:disabled{opacity:.4;cursor:not-allowed}.renameFileComponent .form-wrapper .buttons-wrapper button:hover{opacity:.7}.renameFileComponent .form-wrapper .upload-wrapper{display:flex;flex-direction:column;justify-content:flex-end}.renameFileComponent .form-wrapper .upload-wrapper label{color:#8f98aa;font-size:14px}.renameFileComponent .form-wrapper .upload-wrapper button{padding:10px;border:1px solid lightgray}.renameFileComponent .form-wrapper .upload-wrapper button span{margin:0 10px}.my-dynamic-viewer{display:flex;align-items:center;font-size:12px;min-height:30px}.my-dynamic-viewer .my-label{font-size:12px;font-weight:500;width:150px;word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-label{width:50%}}.my-dynamic-viewer .my-value{width:calc(100% - 150px);word-break:break-word}@media (max-width: 992px){.my-dynamic-viewer .my-value{width:50%}}.my-dynamic-viewer .direction-img{font-size:14px}.my-dynamic-viewer .direction-img .incoming{display:none}.my-dynamic-viewer .direction-img .outgoing{display:none}.my-dynamic-viewer .direction-img .internal{display:none}.my-dynamic-viewer.draft .my-value{color:#596973}.my-dynamic-viewer.inProgress .my-value{color:#3c3cf0}.my-dynamic-viewer.registered .my-value{color:#4f008c}.my-dynamic-viewer.archived .my-value{color:#fbb62c}.my-dynamic-viewer.closed .my-value{color:#00dca5}.my-dynamic-viewer.approved .my-value{color:#06a57e}.my-dynamic-viewer.assigned .my-value{color:#fd6670}.my-dynamic-viewer.sent .my-value{color:#3c3cf0}.my-dynamic-viewer.published .my-value{color:#00dca5}.my-dynamic-viewer.Outgoing .my-value{display:flex}.my-dynamic-viewer.Outgoing .my-value .direction-img .outgoing{color:#fbb62c;margin:1px 5px;display:flex}.my-dynamic-viewer.Outgoing .my-value .text{margin:0 5px}.my-dynamic-viewer.Internal .my-value{display:flex}.my-dynamic-viewer.Internal .my-value .direction-img .internal{color:#3c3cf0;margin:1px 5px;display:flex}.my-dynamic-viewer.Internal .my-value .text{margin:0 5px}.my-dynamic-viewer.Incoming .my-value{display:flex}.my-dynamic-viewer.Incoming .my-value .direction-img .incoming{color:#00dca5;display:flex}.my-dynamic-viewer.Incoming .my-value .text{margin:-3px 5px 0}.my-dynamic-viewer.vertical{display:block}.my-dynamic-viewer.vertical .my-label{width:auto}.my-dynamic-viewer.vertical .my-value{width:auto}.my-dynamic-viewer.with-out-label{width:100%!important}.activity-body{padding:14px 10px;overflow:auto;height:100%}.activity-body .activity-area{padding-inline-start:20px;padding-inline-end:12px;border-inline-start:2px solid #d9dce2}\n"], components: [{ type: i4__namespace$3.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "mode", "value", "bufferValue"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { type: SingleActivityComponent, selector: "cts-single-activity", inputs: ["item", "documentTitle", "newLogActor", "isArabic"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: LatestActivityComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -36592,7 +36600,7 @@
           ActivityModule,
           CardModule,
           PipesModule,
-          i9.InfiniteScrollModule,
+          i7$1.InfiniteScrollModule,
           i4$3.MatProgressBarModule], exports: [LatestActivityComponent,
           SingleActivityComponent,
           ActivityLineComponent] });
@@ -36603,7 +36611,7 @@
               ActivityModule,
               CardModule,
               PipesModule,
-              i9.InfiniteScrollModule,
+              i7$1.InfiniteScrollModule,
               i4$3.MatProgressBarModule
           ]] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: LatestActivityModule, decorators: [{
@@ -36617,7 +36625,7 @@
                           ActivityModule,
                           CardModule,
                           PipesModule,
-                          i9.InfiniteScrollModule,
+                          i7$1.InfiniteScrollModule,
                           i4$3.MatProgressBarModule
                       ],
                       exports: [
@@ -36975,7 +36983,7 @@
           AddPermissionsDialogComponent,
           PermissionsTemplateComponent], imports: [i4.CommonModule,
           i1.TranslateModule,
-          i9$1.MatDividerModule,
+          i9.MatDividerModule,
           i4$3.MatProgressBarModule,
           i6.MatProgressSpinnerModule,
           SharedServicesModule,
@@ -36992,7 +37000,7 @@
   PermissionsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PermissionsModule, imports: [[
               i4.CommonModule,
               i1.TranslateModule,
-              i9$1.MatDividerModule,
+              i9.MatDividerModule,
               i4$3.MatProgressBarModule,
               i6.MatProgressSpinnerModule,
               SharedServicesModule,
@@ -37016,7 +37024,7 @@
                       imports: [
                           i4.CommonModule,
                           i1.TranslateModule,
-                          i9$1.MatDividerModule,
+                          i9.MatDividerModule,
                           i4$3.MatProgressBarModule,
                           i6.MatProgressSpinnerModule,
                           SharedServicesModule,
@@ -41992,6 +42000,10 @@
           _this.trackByFn = function (_, item) { return item.uid; };
           _this.isLoadingResult = false;
           _this.direction$ = _this._translationService.isArabic$.pipe(operators.map(function (isArabic) { return (isArabic ? 'rtl' : 'ltr'); }));
+          _this._criteria = null;
+          _this._sortOrder = 'desc';
+          _this._payloadDate = {};
+          _this._notificationStatus = {};
           _this.paginationModeEnum = PAGINATION_MODE;
           _this._listenerService.onUpdate$
               .pipe(operators.switchMap(function (data) { return _this._updateList(); }), operators.takeUntil(_this.destroy$))
@@ -42031,7 +42043,7 @@
           this._responseService.setPage(page);
           this._paramsService.applyParams({
               override: true,
-              params: Object.assign(Object.assign({}, this._paramsService.activatedQuery.params), { currentPageIndex: this._responseService.selectedPage }),
+              params: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (this._criteria || {})), { sortBy: 'dc:created', sortOrder: this._sortOrder }), this._payloadDate), this._paramsService.activatedQuery.params), { currentPageIndex: this._responseService.selectedPage }),
           });
       };
       BaseListNotifications.prototype.onItemClick = function (notification) {
@@ -42281,7 +42293,7 @@
       return NotificationsListComponent;
   }(BaseListNotifications));
   NotificationsListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsListComponent, deps: [{ token: i0__namespace.Injector }, { token: NOTIFICATIONS_LIST_OPTIONS, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  NotificationsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationsListComponent, selector: "app-notifications-list", outputs: { openSettings: "openSettings", openNotifications: "openNotifications" }, providers: [ParamsService, ResponseService], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"notifications-list\">\r\n  <div class=\"notifications-list__header\">\r\n    <span *ngIf=\"options.title\">\r\n      <strong class=\"notifications-list__title\">{{ options.title | translate }}</strong>\r\n    </span>\r\n    <div class=\"notifications-list__actions\">\r\n      <ng-container *ngIf=\"options?.filters?.active\">\r\n        <app-notification-source-select\r\n          *ngIf=\"options?.filters?.type\"\r\n\r\n          (typeChanged)=\"typeChanged($event)\"\r\n        ></app-notification-source-select>\r\n        <app-notifications-date-select\r\n          *ngIf=\"options?.filters?.date\"\r\n\r\n          (dateChanged)=\"dateChanged($event)\"\r\n        ></app-notifications-date-select>\r\n        <app-notification-status-toggle\r\n          *ngIf=\"options?.filters?.state\"\r\n          (statusChanged)=\"statusChanged($event)\"\r\n        ></app-notification-status-toggle>\r\n      </ng-container>\r\n\r\n      <app-notifications-list-actions\r\n        [options]=\"options.actions\"\r\n        [direction]=\"direction$ | async\"\r\n        (markAllAsRead)=\"markAllAsRead($event)\"\r\n        (openNotifications)=\"openNotifications.emit($event)\"\r\n        (openSettings)=\"openSettings.emit($event)\"\r\n      ></app-notifications-list-actions>\r\n    </div>\r\n  </div>\r\n  <div\r\n    *ngIf=\"response$ | async as response; else loading\"\r\n    class=\"notifications-list__body\"\r\n    infiniteScroll\r\n    [scrollWindow]=\"false\"\r\n    [infiniteScrollDistance]=\"options.scroll?.distance || 2\"\r\n    [infiniteScrollThrottle]=\"options.scroll?.throttle || 300\"\r\n    (scrolled)=\"onScrollDown()\"\r\n  >\r\n    <ng-container *ngIf=\"response.data?.length; else noData\">\r\n      <app-notification-item\r\n        *ngFor=\"let item of response.data; trackBy: trackByFn\"\r\n        [iconOptions]=\"options?.icons\"\r\n        [notification]=\"item\"\r\n        [currentLang]=\"currentLang\"\r\n        [class.cursor-pointer]=\"item.properties?.['notf_nt:isClickable']\"\r\n        (click)=\"onItemClick(item)\"\r\n        (markAsUnread)=\"markAsUnread(item)\"\r\n        (markAsRead)=\"markAsRead(item)\"\r\n        (markAsDeleted)=\"markAsDeleted(item)\"\r\n      ></app-notification-item>\r\n    </ng-container>\r\n    <mat-spinner\r\n      *ngIf=\"isLoadingResult\"\r\n      class=\"notifications-list__loader mt-2 mx-auto\"\r\n      [diameter]=\"48\"\r\n    ></mat-spinner>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #filters>\r\n  <button\r\n    (click)=\"$event.stopPropagation()\"\r\n    class=\"type-filter-trigger\"\r\n    [matMenuTriggerFor]=\"filterTypeMenu\"\r\n    #filterTypeMenuTrigger=\"matMenuTrigger\"\r\n  >\r\n    {{ 'notifications.all' | translate }}\r\n    <span class=\"icon icon-chevron-down\"></span>\r\n  </button>\r\n  <mat-menu class=\"new-menu-design\" #filterTypeMenu=\"matMenu\">\r\n    <div (click)=\"$event.stopPropagation()\">\r\n      <div class=\"single-menu-action notification-filter-menu-item\">\r\n        {{ 'notifications.' + type.name | translate }}\r\n      </div>\r\n    </div>\r\n  </mat-menu>\r\n</ng-template>\r\n\r\n<ng-template #noData>\r\n  <div class=\"no-notifications text-center p-3\">\r\n    <p>\r\n      {{ 'notifications.noNotifications' | translate }}\r\n    </p>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #loading>\r\n  <div class=\"no-notifications text-center p-3\">\r\n    <p>{{ 'notifications.loading_notification' | translate }}</p>\r\n  </div>\r\n</ng-template>\r\n", styles: [".notifications-list{padding:var(--nto-list-padding, 0)}.notifications-list__header{padding:var(--nto-list-header-padding, .5rem);display:var(--nto-list-header-display, flex);justify-content:var(--nto-list-header-justify, space-between);align-items:var(--nto-list-header-align-items, center);box-sizing:border-box;background:var(--nto-list-header-background, transparent);color:var(--nto-list-header-color, currentColor)}.notifications-list__title{color:var(--nto-list-title-color, #234990);font-size:var(--nto-list-title-size, 1rem);font-weight:var(--nto-list-title-weight, 600)}.notifications-list__actions{display:var(--nto-container-filters-display, flex);grid-gap:var(--nto-container-filters-gap, .5rem);gap:var(--nto-container-filters-gap, .5rem)}.notifications-list__loader{display:grid;place-items:center}.notifications-list__body{height:var(--nto-list-height, 60vh);overflow-y:auto}.no-notifications{color:var(--no-notifications-color, #b4bac6);font-size:var(--no-notifications-size, 1rem)}\n"], components: [{ type: NotificationSourceSelectComponent, selector: "app-notification-source-select", outputs: ["typeChanged"] }, { type: NotificationsDateSelectComponent, selector: "app-notifications-date-select", outputs: ["dateChanged"] }, { type: NotificationStatusToggleComponent, selector: "app-notification-status-toggle", inputs: ["status"], outputs: ["statusChanged"] }, { type: NotificationsListActionsComponent, selector: "app-notifications-list-actions", inputs: ["options", "direction"], outputs: ["markAllAsRead", "openSettings", "openNotifications"] }, { type: NotificationItemComponent, selector: "app-notification-item", inputs: ["iconOptions", "currentLang", "notification"], outputs: ["markAsUnread", "markAsRead", "markAsDeleted"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9__namespace.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], pipes: { "translate": i1__namespace.TranslatePipe, "async": i4__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+  NotificationsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationsListComponent, selector: "app-notifications-list", outputs: { openSettings: "openSettings", openNotifications: "openNotifications" }, providers: [ParamsService, ResponseService], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"notifications-list\">\r\n  <div class=\"notifications-list__header\">\r\n    <span *ngIf=\"options.title\">\r\n      <strong class=\"notifications-list__title\">{{ options.title | translate }}</strong>\r\n    </span>\r\n    <div class=\"notifications-list__actions\">\r\n      <ng-container *ngIf=\"options?.filters?.active\">\r\n        <app-notification-source-select\r\n          *ngIf=\"options?.filters?.type\"\r\n\r\n          (typeChanged)=\"typeChanged($event)\"\r\n        ></app-notification-source-select>\r\n        <app-notifications-date-select\r\n          *ngIf=\"options?.filters?.date\"\r\n\r\n          (dateChanged)=\"dateChanged($event)\"\r\n        ></app-notifications-date-select>\r\n        <app-notification-status-toggle\r\n          *ngIf=\"options?.filters?.state\"\r\n          (statusChanged)=\"statusChanged($event)\"\r\n        ></app-notification-status-toggle>\r\n      </ng-container>\r\n\r\n      <app-notifications-list-actions\r\n        [options]=\"options.actions\"\r\n        [direction]=\"direction$ | async\"\r\n        (markAllAsRead)=\"markAllAsRead($event)\"\r\n        (openNotifications)=\"openNotifications.emit($event)\"\r\n        (openSettings)=\"openSettings.emit($event)\"\r\n      ></app-notifications-list-actions>\r\n    </div>\r\n  </div>\r\n  <div\r\n    *ngIf=\"response$ | async as response; else loading\"\r\n    class=\"notifications-list__body\"\r\n    infiniteScroll\r\n    [scrollWindow]=\"false\"\r\n    [infiniteScrollDistance]=\"options.scroll?.distance || 2\"\r\n    [infiniteScrollThrottle]=\"options.scroll?.throttle || 300\"\r\n    (scrolled)=\"onScrollDown()\"\r\n  >\r\n    <ng-container *ngIf=\"response.data?.length; else noData\">\r\n      <app-notification-item\r\n        *ngFor=\"let item of response.data; trackBy: trackByFn\"\r\n        [iconOptions]=\"options?.icons\"\r\n        [notification]=\"item\"\r\n        [currentLang]=\"currentLang\"\r\n        [class.cursor-pointer]=\"item.properties?.['notf_nt:isClickable']\"\r\n        (click)=\"onItemClick(item)\"\r\n        (markAsUnread)=\"markAsUnread(item)\"\r\n        (markAsRead)=\"markAsRead(item)\"\r\n        (markAsDeleted)=\"markAsDeleted(item)\"\r\n      ></app-notification-item>\r\n    </ng-container>\r\n    <mat-spinner\r\n      *ngIf=\"isLoadingResult\"\r\n      class=\"notifications-list__loader mt-2 mx-auto\"\r\n      [diameter]=\"48\"\r\n    ></mat-spinner>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #filters>\r\n  <button\r\n    (click)=\"$event.stopPropagation()\"\r\n    class=\"type-filter-trigger\"\r\n    [matMenuTriggerFor]=\"filterTypeMenu\"\r\n    #filterTypeMenuTrigger=\"matMenuTrigger\"\r\n  >\r\n    {{ 'notifications.all' | translate }}\r\n    <span class=\"icon icon-chevron-down\"></span>\r\n  </button>\r\n  <mat-menu class=\"new-menu-design\" #filterTypeMenu=\"matMenu\">\r\n    <div (click)=\"$event.stopPropagation()\">\r\n      <div class=\"single-menu-action notification-filter-menu-item\">\r\n        {{ 'notifications.' + type.name | translate }}\r\n      </div>\r\n    </div>\r\n  </mat-menu>\r\n</ng-template>\r\n\r\n<ng-template #noData>\r\n  <div class=\"no-notifications text-center p-3\">\r\n    <p>\r\n      {{ 'notifications.noNotifications' | translate }}\r\n    </p>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #loading>\r\n  <div class=\"no-notifications text-center p-3\">\r\n    <p>{{ 'notifications.loading_notification' | translate }}</p>\r\n  </div>\r\n</ng-template>\r\n", styles: [".notifications-list{padding:var(--nto-list-padding, 0)}.notifications-list__header{padding:var(--nto-list-header-padding, .5rem);display:var(--nto-list-header-display, flex);justify-content:var(--nto-list-header-justify, space-between);align-items:var(--nto-list-header-align-items, center);box-sizing:border-box;background:var(--nto-list-header-background, transparent);color:var(--nto-list-header-color, currentColor)}.notifications-list__title{color:var(--nto-list-title-color, #234990);font-size:var(--nto-list-title-size, 1rem);font-weight:var(--nto-list-title-weight, 600)}.notifications-list__actions{display:var(--nto-container-filters-display, flex);grid-gap:var(--nto-container-filters-gap, .5rem);gap:var(--nto-container-filters-gap, .5rem)}.notifications-list__loader{display:grid;place-items:center}.notifications-list__body{height:var(--nto-list-height, 60vh);overflow-y:auto}.no-notifications{color:var(--no-notifications-color, #b4bac6);font-size:var(--no-notifications-size, 1rem)}\n"], components: [{ type: NotificationSourceSelectComponent, selector: "app-notification-source-select", outputs: ["typeChanged"] }, { type: NotificationsDateSelectComponent, selector: "app-notifications-date-select", outputs: ["dateChanged"] }, { type: NotificationStatusToggleComponent, selector: "app-notification-status-toggle", inputs: ["status"], outputs: ["statusChanged"] }, { type: NotificationsListActionsComponent, selector: "app-notifications-list-actions", inputs: ["options", "direction"], outputs: ["markAllAsRead", "openSettings", "openNotifications"] }, { type: NotificationItemComponent, selector: "app-notification-item", inputs: ["iconOptions", "currentLang", "notification"], outputs: ["markAsUnread", "markAsRead", "markAsDeleted"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7__namespace$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], pipes: { "translate": i1__namespace.TranslatePipe, "async": i4__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsListComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -42598,7 +42610,7 @@
       return NotificationsButtonComponent;
   }(BaseNotification));
   NotificationsButtonComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsButtonComponent, deps: [{ token: i0__namespace.Injector }, { token: TranslationService }, { token: CustomToastrService }, { token: i0__namespace.ChangeDetectorRef }, { token: NOTIFICATIONS_LIST_OPTIONS, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  NotificationsButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationsButtonComponent, selector: "app-notifications-button", inputs: { styleClass: "styleClass", badgeOptions: "badgeOptions", shouldMarkAsUnread: "shouldMarkAsUnread", ignoredToastEvents: "ignoredToastEvents" }, outputs: { listItemClick: "listItemClick", openSettings: "openSettings", openNotifications: "openNotifications", onNotification: "onNotification" }, host: { classAttribute: "inline-flex justify-center items-center notification-button" }, queries: [{ propertyName: "customIconTemplate", first: true, predicate: NOTIFICATION_ICON, descendants: true, read: i0.TemplateRef, static: true }], usesInheritance: true, ngImport: i0__namespace, template: "<button\r\n\t*ngIf=\"panelMode === panelModeEnum.panel\"\r\n\t[matMenuTriggerFor]=\"notifications\"\r\n\t[matBadge]=\"newNotificationCount$ | async\"\r\n\t[matBadgeHidden]=\"!(showBadge$ | async)\"\r\n\t[matBadgeSize]=\"badgeOptions.size\"\r\n\t[matBadgeColor]=\"badgeOptions.color\"\r\n\t[matBadgePosition]=\"badgeOptions.position\"\r\n\t[class]=\"styleClass\"\r\n>\r\n\t<ng-container [ngTemplateOutlet]=\"customIconTemplate || defaultIconTemplate\"> </ng-container>\r\n</button>\r\n\r\n<mat-menu #notifications=\"matMenu\" class=\"notification-list-panel\">\r\n\t<ng-template matMenuContent>\r\n\t\t<app-notifications-list\r\n\t\t\t(itemClicked)=\"listItemClick.emit($event); notifications.closed.emit()\"\r\n\t\t\t(openSettings)=\"openSettings.emit($event); notifications.closed.emit()\"\r\n\t\t\t(openNotifications)=\"openNotifications.emit($event); notifications.closed.emit()\"\r\n\t\t\t(markAllRead)=\"refreshUnreadCount()\"\r\n\t\t></app-notifications-list>\r\n\t</ng-template>\r\n\t<div class=\"notification-list-panel__footer flex justify-center\">\r\n\t\t<ng-content select=\"[notifications-footer]\"></ng-content>\r\n\t</div>\r\n</mat-menu>\r\n\r\n<ng-container *ngIf=\"panelMode === panelModeEnum.sidebar\">\r\n\t<button\r\n\t\t[matBadge]=\"newNotificationCount$ | async\"\r\n\t\t[matBadgeHidden]=\"!(showBadge$ | async)\"\r\n\t\t[matBadgeSize]=\"badgeOptions.size\"\r\n\t\t[matBadgeColor]=\"badgeOptions.color\"\r\n\t\t[matBadgePosition]=\"badgeOptions.position\"\r\n\t\t[class]=\"styleClass\"\r\n\t\t(click)=\"toggleSideBar()\"\r\n\t>\r\n\t\t<ng-container [ngTemplateOutlet]=\"customIconTemplate || defaultIconTemplate\"> </ng-container>\r\n\t</button>\r\n\t<app-notifications-sidebar\r\n\t\t[(visible)]=\"isSidebarOpened\"\r\n\t\t(visibleChange)=\"refreshUnreadCount()\"\r\n\t\t[position]=\"sidebarPosition$ | async\"\r\n\t>\r\n\t\t<ng-template appNotificationSidebarContent>\r\n\t\t\t<app-notifications-list\r\n\t\t\t\tclass=\"notifications-sidebar\"\r\n\t\t\t\t(itemClicked)=\"listItemClick.emit($event); toggleSideBar(false); refreshUnreadCount()\"\r\n\t\t\t\t(openSettings)=\"openSettings.emit($event); toggleSideBar(false)\"\r\n\t\t\t\t(openNotifications)=\"openNotifications.emit($event); toggleSideBar(false)\"\r\n\t\t\t\t(markAllRead)=\"refreshUnreadCount()\"\r\n\t\t\t></app-notifications-list>\r\n\t\t</ng-template>\r\n\t</app-notifications-sidebar>\r\n</ng-container>\r\n\r\n<ng-template #defaultIconTemplate>\r\n\t<i class=\"bi bi-bell bell\"></i>\r\n</ng-template>\r\n", styles: [".notification-button{font-size:var(--not-btn-font-size, 1.5rem);width:var(--not-btn-width, 40px)}.notification-button .mat-badge-content{text-overflow:unset;width:18px;height:18px;line-height:18px}.notification-list-panel{--width: var(--nos-panel-width, min(80vw, 450px));width:var(--width);border-radius:var(--nos-panel-radius, 5px);overflow:hidden;-webkit-overflow-scrolling:touch;outline:0;background:var(--nos-panel-background, #fff)}.notification-list-panel.mat-menu-panel{max-width:var(--width);max-height:var(--nos-panel-max-height, var(--height))}.notification-list-panel__navigate-btn{background:var(--not-btn-background, transparent);border-radius:var(--not-btn-radius, 5px);padding:var(--not-btn-padding, .5rem 1rem);margin:var(--not-btn-margin, .5rem 0);color:var(--not-btn-color, currentColor);width:var(--not-btn-width, 90%)}.notification-list-panel__navigate-btn:hover{--not-btn-background: var(--not-btn-hover-background, #f0f0f0);--not-btn-color: var(--not-btn-hover-color);-webkit-text-decoration:var(--not-btn-decoration, none);text-decoration:var(--not-btn-decoration, none)}.notification-list-panel__navigate-btn:active{--not-btn-background: var(--not-btn-active-background, #e2e2e2);--not-btn-color: var(--not-btn-active-color)}.notifications-sidebar{--nto-list-header-padding: var(--sidebar-list-header-padding, 1rem);--nto-list-height: var(--sidebar-list-height, calc(100vh - 100px))}\n"], components: [{ type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: NotificationsListComponent, selector: "app-notifications-list", outputs: ["openSettings", "openNotifications"] }, { type: NotificationsSidebarComponent, selector: "app-notifications-sidebar", inputs: ["appendToBody", "clearOnCLose", "visible", "position"], outputs: ["visibleChange", "onShow", "onHide"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { type: i7__namespace$3.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgePosition", "matBadgeSize", "matBadgeColor", "matBadgeOverlap", "matBadgeDescription", "matBadgeHidden", "matBadge"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { type: NotificationSidebarContentDirective, selector: "[appNotificationSidebarContent]" }], pipes: { "async": i4__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
+  NotificationsButtonComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationsButtonComponent, selector: "app-notifications-button", inputs: { styleClass: "styleClass", badgeOptions: "badgeOptions", shouldMarkAsUnread: "shouldMarkAsUnread", ignoredToastEvents: "ignoredToastEvents" }, outputs: { listItemClick: "listItemClick", openSettings: "openSettings", openNotifications: "openNotifications", onNotification: "onNotification" }, host: { classAttribute: "inline-flex justify-center items-center notification-button" }, queries: [{ propertyName: "customIconTemplate", first: true, predicate: NOTIFICATION_ICON, descendants: true, read: i0.TemplateRef, static: true }], usesInheritance: true, ngImport: i0__namespace, template: "<button\r\n\t*ngIf=\"panelMode === panelModeEnum.panel\"\r\n\t[matMenuTriggerFor]=\"notifications\"\r\n\t[matBadge]=\"newNotificationCount$ | async\"\r\n\t[matBadgeHidden]=\"!(showBadge$ | async)\"\r\n\t[matBadgeSize]=\"badgeOptions.size\"\r\n\t[matBadgeColor]=\"badgeOptions.color\"\r\n\t[matBadgePosition]=\"badgeOptions.position\"\r\n\t[class]=\"styleClass\"\r\n>\r\n\t<ng-container [ngTemplateOutlet]=\"customIconTemplate || defaultIconTemplate\"> </ng-container>\r\n</button>\r\n\r\n<mat-menu #notifications=\"matMenu\" class=\"notification-list-panel\">\r\n\t<ng-template matMenuContent>\r\n\t\t<app-notifications-list\r\n\t\t\t(itemClicked)=\"listItemClick.emit($event); notifications.closed.emit()\"\r\n\t\t\t(openSettings)=\"openSettings.emit($event); notifications.closed.emit()\"\r\n\t\t\t(openNotifications)=\"openNotifications.emit($event); notifications.closed.emit()\"\r\n\t\t\t(markAllRead)=\"refreshUnreadCount()\"\r\n\t\t></app-notifications-list>\r\n\t</ng-template>\r\n\t<div class=\"notification-list-panel__footer flex justify-center\">\r\n\t\t<ng-content select=\"[notifications-footer]\"></ng-content>\r\n\t</div>\r\n</mat-menu>\r\n\r\n<ng-container *ngIf=\"panelMode === panelModeEnum.sidebar\">\r\n\t<button\r\n\t\t[matBadge]=\"newNotificationCount$ | async\"\r\n\t\t[matBadgeHidden]=\"!(showBadge$ | async)\"\r\n\t\t[matBadgeSize]=\"badgeOptions.size\"\r\n\t\t[matBadgeColor]=\"badgeOptions.color\"\r\n\t\t[matBadgePosition]=\"badgeOptions.position\"\r\n\t\t[class]=\"styleClass\"\r\n\t\t(click)=\"toggleSideBar()\"\r\n\t>\r\n\t\t<ng-container [ngTemplateOutlet]=\"customIconTemplate || defaultIconTemplate\"> </ng-container>\r\n\t</button>\r\n\t<app-notifications-sidebar\r\n\t\t[(visible)]=\"isSidebarOpened\"\r\n\t\t(visibleChange)=\"refreshUnreadCount()\"\r\n\t\t[position]=\"sidebarPosition$ | async\"\r\n\t>\r\n\t\t<ng-template appNotificationSidebarContent>\r\n\t\t\t<app-notifications-list\r\n\t\t\t\tclass=\"notifications-sidebar\"\r\n\t\t\t\t(itemClicked)=\"listItemClick.emit($event); toggleSideBar(false); refreshUnreadCount()\"\r\n\t\t\t\t(openSettings)=\"openSettings.emit($event); toggleSideBar(false)\"\r\n\t\t\t\t(openNotifications)=\"openNotifications.emit($event); toggleSideBar(false)\"\r\n\t\t\t\t(markAllRead)=\"refreshUnreadCount()\"\r\n\t\t\t></app-notifications-list>\r\n\t\t</ng-template>\r\n\t</app-notifications-sidebar>\r\n</ng-container>\r\n\r\n<ng-template #defaultIconTemplate>\r\n\t<i class=\"bi bi-bell bell\"></i>\r\n</ng-template>\r\n", styles: [".notification-button{font-size:var(--not-btn-font-size, 1.5rem);width:var(--not-btn-width, 40px)}.notification-button .mat-badge-content{text-overflow:unset;width:18px;height:18px;line-height:18px}.notification-list-panel{--width: var(--nos-panel-width, min(80vw, 450px));width:var(--width);border-radius:var(--nos-panel-radius, 5px);overflow:hidden;-webkit-overflow-scrolling:touch;outline:0;background:var(--nos-panel-background, #fff)}.notification-list-panel.mat-menu-panel{max-width:var(--width);max-height:var(--nos-panel-max-height, var(--height))}.notification-list-panel__navigate-btn{background:var(--not-btn-background, transparent);border-radius:var(--not-btn-radius, 5px);padding:var(--not-btn-padding, .5rem 1rem);margin:var(--not-btn-margin, .5rem 0);color:var(--not-btn-color, currentColor);width:var(--not-btn-width, 90%)}.notification-list-panel__navigate-btn:hover{--not-btn-background: var(--not-btn-hover-background, #f0f0f0);--not-btn-color: var(--not-btn-hover-color);-webkit-text-decoration:var(--not-btn-decoration, none);text-decoration:var(--not-btn-decoration, none)}.notification-list-panel__navigate-btn:active{--not-btn-background: var(--not-btn-active-background, #e2e2e2);--not-btn-color: var(--not-btn-active-color)}.notifications-sidebar{--nto-list-header-padding: var(--sidebar-list-header-padding, 1rem);--nto-list-height: var(--sidebar-list-height, calc(100vh - 100px))}\n"], components: [{ type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: NotificationsListComponent, selector: "app-notifications-list", outputs: ["openSettings", "openNotifications"] }, { type: NotificationsSidebarComponent, selector: "app-notifications-sidebar", inputs: ["appendToBody", "clearOnCLose", "visible", "position"], outputs: ["visibleChange", "onShow", "onHide"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { type: i7__namespace$4.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgePosition", "matBadgeSize", "matBadgeColor", "matBadgeOverlap", "matBadgeDescription", "matBadgeHidden", "matBadge"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3__namespace$1.MatMenuContent, selector: "ng-template[matMenuContent]" }, { type: NotificationSidebarContentDirective, selector: "[appNotificationSidebarContent]" }], pipes: { "async": i4__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush, encapsulation: i0__namespace.ViewEncapsulation.None });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsButtonComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -42656,6 +42668,29 @@
       },
   };
+  var NotificationSortbyToggleComponent = /** @class */ (function () {
+      function NotificationSortbyToggleComponent() {
+          this.status = true;
+          this.newestFirstChanged = new i0.EventEmitter();
+      }
+      return NotificationSortbyToggleComponent;
+  }());
+  NotificationSortbyToggleComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationSortbyToggleComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
+  NotificationSortbyToggleComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationSortbyToggleComponent, selector: "app-notification-sortby-toggle", inputs: { status: "status" }, outputs: { newestFirstChanged: "newestFirstChanged" }, ngImport: i0__namespace, template: "<div class=\"notification-toggle\" (click)=\"$event.stopPropagation()\">\r\n    <mat-slide-toggle [checked]=\"status\" (change)=\"newestFirstChanged.emit($event)\">\r\n      <small class=\"px-2\">{{ 'notifications.newest' | translate }}</small>\r\n    </mat-slide-toggle>\r\n  </div>", styles: [":host{display:var(--n-status-toggle-display, flex);flex-direction:var(--n-status-toggle-direction, column);justify-content:var(--n-status-toggle-content, center)}:host ::ng-deep .mat-slide-toggle-label{margin-bottom:0}\n"], components: [{ type: i1__namespace$9.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "required", "checked"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }], pipes: { "translate": i1__namespace.TranslatePipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationSortbyToggleComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: 'app-notification-sortby-toggle',
+                      templateUrl: './notification-sortby-toggle.component.html',
+                      styleUrls: ['./notification-sortby-toggle.component.scss'],
+                      changeDetection: i0.ChangeDetectionStrategy.OnPush,
+                  }]
+          }], propDecorators: { status: [{
+                  type: i0.Input
+              }], newestFirstChanged: [{
+                  type: i0.Output
+              }] } });
   var NotificationsListContainerComponent = /** @class */ (function (_super) {
       __extends(NotificationsListContainerComponent, _super);
       function NotificationsListContainerComponent(inject, _options) {
@@ -42664,6 +42699,8 @@
           _this = _super.call(this, inject) || this;
           _this.inject = inject;
           _this.styleClass = '';
+          _this.showNewestToggle = false;
+          _this._hasCriteria = false;
           _this.paginationMode = PAGINATION_MODE.navigator;
           _this.options = ___default["default"].merge(DEFAULT_CONTAINER_OPTIONS, _options ? _options : {});
           _this.paginationMode = ((_a = _this.options) === null || _a === void 0 ? void 0 : _a.paginationMode) || 'navigator';
@@ -42690,7 +42727,15 @@
       });
       Object.defineProperty(NotificationsListContainerComponent.prototype, "criteria", {
           set: function (query) {
+              // if (query) {
+              //   this._applyFilter({
+              //     currentPageIndex: 0,
+              //     ...query,
+              //   });
+              // }
               if (query) {
+                  this._hasCriteria = true;
+                  this._criteria = query;
                   this._applyFilter(Object.assign({ currentPageIndex: 0 }, query));
               }
           },
@@ -42707,25 +42752,36 @@
       NotificationsListContainerComponent.prototype.ngOnInit = function () {
           this._prepareLanguage();
           this._prepareData();
-          this._paramsService.applyParams();
+          if (!this._hasCriteria) {
+              this._paramsService.applyParams();
+          }
       };
       NotificationsListContainerComponent.prototype.typeChanged = function (event) {
           this._applyFilter(Object.assign(Object.assign({ currentPageIndex: 0 }, (event ? { notf_notification_sourceTypee: event } : {})), (this.criteria ? this.criteria : {})));
       };
       NotificationsListContainerComponent.prototype.statusChanged = function (_c) {
           var checked = _c.checked;
-          this._applyFilter(Object.assign(Object.assign({ currentPageIndex: 0 }, (checked ? { notfnotificationcontent_status: NOTIFICATION_STATUS.read } : {})), (this.criteria ? this.criteria : {})));
+          this._notificationStatus = checked ? { notfnotificationcontent_status: NOTIFICATION_STATUS.read } : {};
+          this._applyFilter(Object.assign(Object.assign(Object.assign({ sortBy: 'dc:created', sortOrder: this._sortOrder, currentPageIndex: 0 }, this._payloadDate), (checked ? { notfnotificationcontent_status: NOTIFICATION_STATUS.read } : {})), (this.criteria ? this.criteria : {})));
+      };
+      NotificationsListContainerComponent.prototype.newestFirstChanged = function (_c) {
+          var checked = _c.checked;
+          this._sortOrder = checked ? 'desc' : 'asc',
+              this._applyFilter(Object.assign(Object.assign(Object.assign({ currentPageIndex: 0, sortBy: 'dc:created', sortOrder: this._sortOrder }, this._payloadDate), this._notificationStatus), (this.criteria ? this.criteria : {})));
       };
       NotificationsListContainerComponent.prototype.dateChanged = function (date) {
+          this._payloadDate = date
+              ? { dublincore_created_min: date.min, dublincore_created_max: date.max }
+              : {};
           var payload_date = date
               ? { dublincore_created_min: date.min, dublincore_created_max: date.max }
               : {};
-          this._applyFilter(Object.assign(Object.assign({ currentPageIndex: 0 }, payload_date), (this.criteria ? this.criteria : {})));
+          this._applyFilter(Object.assign(Object.assign(Object.assign({ sortBy: 'dc:created', sortOrder: this._sortOrder, currentPageIndex: 0 }, payload_date), this._notificationStatus), (this.criteria ? this.criteria : {})));
       };
       return NotificationsListContainerComponent;
   }(BaseListNotifications));
   NotificationsListContainerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsListContainerComponent, deps: [{ token: i0__namespace.Injector }, { token: NOTIFICATIONS_LIST_OPTIONS, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  NotificationsListContainerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationsListContainerComponent, selector: "app-notifications-list-container", inputs: { styleClass: "styleClass", showFilters: "showFilters", criteria: "criteria" }, providers: [ParamsService, ResponseService], queries: [{ propertyName: "customItemTemplate", first: true, predicate: NOTIFICATION_ITEM, descendants: true, read: i0.TemplateRef, static: true }], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"notifications-container {{ styleClass }}\">\r\n  <div class=\"notifications-container__header\">\r\n    <span class=\"notifications-container__title\">\r\n      <span *ngIf=\"options.title\"> {{ options.title | translate }}</span>\r\n    </span>\r\n    <div class=\"notifications-container__filters\" *ngIf=\"showFilters\">\r\n      <app-notification-source-select\r\n        *ngIf=\"options?.filters?.type\"\r\n        (typeChanged)=\"typeChanged($event)\"\r\n      ></app-notification-source-select>\r\n      <app-notifications-date-select\r\n        *ngIf=\"options?.filters?.date\"\r\n        (dateChanged)=\"dateChanged($event)\"\r\n      ></app-notifications-date-select>\r\n      <app-notification-status-toggle\r\n        *ngIf=\"options?.filters?.state\"\r\n        (statusChanged)=\"statusChanged($event)\"\r\n      ></app-notification-status-toggle>\r\n    </div>\r\n  </div>\r\n\r\n  <ng-container *ngIf=\"response$ | async as response\">\r\n    <ng-container\r\n      [ngTemplateOutlet]=\"\r\n        paginationMode == paginationModeEnum.scroll\r\n          ? scrollModeTemplate\r\n          : paginationModeTemplate\r\n      \"\r\n      [ngTemplateOutletContext]=\"{ $implicit: response }\"\r\n    ></ng-container>\r\n  </ng-container>\r\n\r\n  <ng-template #scrollModeTemplate let-response>\r\n    <div\r\n      class=\"notifications-container__body\"\r\n      infiniteScroll\r\n      [scrollWindow]=\"options.scroll?.scrollWindow\"\r\n      [infiniteScrollDistance]=\"options.scroll?.distance || 2\"\r\n      [infiniteScrollThrottle]=\"options.scroll?.throttle || 300\"\r\n      (scrolled)=\"onScrollDown()\"\r\n    >\r\n      <ng-container *ngIf=\"response.data?.length; else noData\">\r\n        <ng-container\r\n          *ngFor=\"let item of response.data; trackBy: trackByFn\"\r\n          [ngTemplateOutlet]=\"customItemTemplate || defaultItemTemplate\"\r\n          [ngTemplateOutletContext]=\"{\r\n            $implicit: item,\r\n            markAsUnread: markAsUnread,\r\n            markAsRead: markAsRead,\r\n            markAsDeleted: markAsDeleted\r\n          }\"\r\n        >\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <mat-spinner\r\n        [diameter]=\"48\"\r\n        class=\"notifications-container__loader mt-2 mx-auto\"\r\n        *ngIf=\"isLoadingResult\"\r\n      ></mat-spinner>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-template #paginationModeTemplate let-response>\r\n    <div\r\n      class=\"notifications-container__body--pagination mb-3\"\r\n      *ngIf=\"response.data?.length; else noData\"\r\n    >\r\n      <ng-container\r\n        *ngFor=\"let item of response.data; trackBy: trackByFn\"\r\n        [ngTemplateOutlet]=\"customItemTemplate || defaultItemTemplate\"\r\n        [ngTemplateOutletContext]=\"{\r\n          $implicit: item,\r\n          markAsUnread: markAsUnread,\r\n          markAsRead: markAsRead,\r\n          markAsDeleted: markAsDeleted\r\n        }\"\r\n      >\r\n      </ng-container>\r\n      <div class=\"notifications-container__pagination-loader\" *ngIf=\"isLoadingResult\">\r\n        <mat-spinner [diameter]=\"48\"></mat-spinner>\r\n      </div>\r\n    </div>\r\n\r\n    <cts-pagination\r\n      [page]=\"selectedPage + 1\"\r\n      (change)=\"changePage($event - 1)\"\r\n      [size]=\"options.pageSize\"\r\n      [count]=\"response.totalItems\"\r\n    >\r\n    </cts-pagination>\r\n  </ng-template>\r\n</div>\r\n\r\n<ng-template #filters>\r\n  <button\r\n    (click)=\"$event.stopPropagation()\"\r\n    class=\"type-filter-trigger\"\r\n    [matMenuTriggerFor]=\"filterTypeMenu\"\r\n    #filterTypeMenuTrigger=\"matMenuTrigger\"\r\n  >\r\n    {{ 'notifications.all' | translate }}\r\n    <span class=\"icon icon-chevron-down\"></span>\r\n  </button>\r\n  <mat-menu class=\"new-menu-design\" #filterTypeMenu=\"matMenu\">\r\n    <div (click)=\"$event.stopPropagation()\">\r\n      <div class=\"single-menu-action notification-filter-menu-item\">\r\n        {{ 'notifications.' + type.name | translate }}\r\n      </div>\r\n    </div>\r\n  </mat-menu>\r\n</ng-template>\r\n\r\n<ng-template #noData>\r\n  <div class=\"no-notifications text-center p-3\">\r\n    <p>\r\n      {{ 'notifications.noNotifications' | translate }}\r\n    </p>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #defaultItemTemplate let-item>\r\n  <app-notification-item\r\n    [iconOptions]=\"options?.icons\"\r\n    [notification]=\"item\"\r\n    [currentLang]=\"currentLang\"\r\n    [class.cursor-pointer]=\"item.properties?.['notf_nt:isClickable']\"\r\n    (click)=\"onItemClick(item)\"\r\n    (markAsUnread)=\"markAsUnread(item)\"\r\n    (markAsRead)=\"markAsRead(item)\"\r\n    (markAsDeleted)=\"markAsDeleted(item)\"\r\n  ></app-notification-item>\r\n</ng-template>\r\n", styles: [".notifications-container{padding:var(--nto-container-padding, 0)}.notifications-container__header{padding:var(--nto-container-header-padding, .5rem);display:var(--nto-container-header-display, flex);justify-content:var(--nto-container-header-justify, space-between);align-items:var(--nto-container-header-align-items, center);box-sizing:border-box}.notifications-container__title{color:var(--nto-container-title-color, #2f258a);font-size:var(--nto-container-title-size, 1.1rem);font-weight:var(--nto-container-title-weight, normal)}.notifications-container__filters{display:var(--nto-container-filters-display, flex);grid-gap:var(--nto-container-filters-gap, .5rem);gap:var(--nto-container-filters-gap, .5rem)}.notifications-container__body{position:relative;height:var(--nto-container-height, 74vh);overflow-y:auto}.notifications-container__body--pagination{--nto-container-height: var(--nto-container-pagination-height, auto)}.notifications-container__loader{display:grid;place-items:center}.notifications-container__pagination-loader{display:grid;place-items:center;position:absolute;inset:0 0;width:100%;height:100%;background:var(--nto-pagination-background, rgba(255, 255, 255, .4))}.no-notifications{min-height:var(--no-notifications-min-height, 0);display:var(--no-notifications-display, flex);flex-direction:var(--no-notifications-direction, column);justify-content:var(--no-notifications-justify, center);align-items:var(--no-notifications-items, center);color:var(--no-notifications-color, #b4bac6);font-size:var(--no-notifications-size, 1rem)}\n"], components: [{ type: NotificationSourceSelectComponent, selector: "app-notification-source-select", outputs: ["typeChanged"] }, { type: NotificationsDateSelectComponent, selector: "app-notifications-date-select", outputs: ["dateChanged"] }, { type: NotificationStatusToggleComponent, selector: "app-notification-status-toggle", inputs: ["status"], outputs: ["statusChanged"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: PaginationComponent, selector: "cts-pagination", inputs: ["size", "count", "page"], outputs: ["change"] }, { type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: NotificationItemComponent, selector: "app-notification-item", inputs: ["iconOptions", "currentLang", "notification"], outputs: ["markAsUnread", "markAsRead", "markAsDeleted"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i9__namespace.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], pipes: { "translate": i1__namespace.TranslatePipe, "async": i4__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
+  NotificationsListContainerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotificationsListContainerComponent, selector: "app-notifications-list-container", inputs: { styleClass: "styleClass", showFilters: "showFilters", showNewestToggle: "showNewestToggle", criteria: "criteria" }, providers: [ParamsService, ResponseService], queries: [{ propertyName: "customItemTemplate", first: true, predicate: NOTIFICATION_ITEM, descendants: true, read: i0.TemplateRef, static: true }], usesInheritance: true, ngImport: i0__namespace, template: "<div class=\"notifications-container {{ styleClass }}\">\r\n  <div class=\"notifications-container__header\">\r\n    <span class=\"notifications-container__title\">\r\n      <span *ngIf=\"options.title\"> {{ options.title | translate }}</span>\r\n    </span>\r\n    <div class=\"notifications-container__filters\" *ngIf=\"showFilters\">\r\n      <app-notification-source-select\r\n        *ngIf=\"options?.filters?.type\"\r\n        (typeChanged)=\"typeChanged($event)\"\r\n      ></app-notification-source-select>\r\n      <app-notifications-date-select\r\n        *ngIf=\"options?.filters?.date\"\r\n        (dateChanged)=\"dateChanged($event)\"\r\n      ></app-notifications-date-select>\r\n      <app-notification-status-toggle\r\n        *ngIf=\"options?.filters?.state\"\r\n        (statusChanged)=\"statusChanged($event)\"\r\n      ></app-notification-status-toggle>\r\n      <app-notification-sortby-toggle \r\n      *ngIf=\"showNewestToggle\"\r\n      (newestFirstChanged)=\"newestFirstChanged($event)\"\r\n      ></app-notification-sortby-toggle>\r\n    </div>\r\n  </div>\r\n\r\n  <ng-container *ngIf=\"response$ | async as response\">\r\n    <ng-container\r\n      [ngTemplateOutlet]=\"\r\n        paginationMode == paginationModeEnum.scroll\r\n          ? scrollModeTemplate\r\n          : paginationModeTemplate\r\n      \"\r\n      [ngTemplateOutletContext]=\"{ $implicit: response }\"\r\n    ></ng-container>\r\n  </ng-container>\r\n\r\n  <ng-template #scrollModeTemplate let-response>\r\n    <div\r\n      class=\"notifications-container__body\"\r\n      infiniteScroll\r\n      [scrollWindow]=\"options.scroll?.scrollWindow\"\r\n      [infiniteScrollDistance]=\"options.scroll?.distance || 2\"\r\n      [infiniteScrollThrottle]=\"options.scroll?.throttle || 300\"\r\n      (scrolled)=\"onScrollDown()\"\r\n    >\r\n      <ng-container *ngIf=\"response.data?.length; else noData\">\r\n        <ng-container\r\n          *ngFor=\"let item of response.data; trackBy: trackByFn\"\r\n          [ngTemplateOutlet]=\"customItemTemplate || defaultItemTemplate\"\r\n          [ngTemplateOutletContext]=\"{\r\n            $implicit: item,\r\n            markAsUnread: markAsUnread,\r\n            markAsRead: markAsRead,\r\n            markAsDeleted: markAsDeleted\r\n          }\"\r\n        >\r\n        </ng-container>\r\n      </ng-container>\r\n\r\n      <mat-spinner\r\n        [diameter]=\"48\"\r\n        class=\"notifications-container__loader mt-2 mx-auto\"\r\n        *ngIf=\"isLoadingResult\"\r\n      ></mat-spinner>\r\n    </div>\r\n  </ng-template>\r\n\r\n  <ng-template #paginationModeTemplate let-response>\r\n    <div\r\n      class=\"notifications-container__body--pagination mb-3\"\r\n      *ngIf=\"response.data?.length; else noData\"\r\n    >\r\n      <ng-container\r\n        *ngFor=\"let item of response.data; trackBy: trackByFn\"\r\n        [ngTemplateOutlet]=\"customItemTemplate || defaultItemTemplate\"\r\n        [ngTemplateOutletContext]=\"{\r\n          $implicit: item,\r\n          markAsUnread: markAsUnread,\r\n          markAsRead: markAsRead,\r\n          markAsDeleted: markAsDeleted\r\n        }\"\r\n      >\r\n      </ng-container>\r\n      <div class=\"notifications-container__pagination-loader\" *ngIf=\"isLoadingResult\">\r\n        <mat-spinner [diameter]=\"48\"></mat-spinner>\r\n      </div>\r\n    </div>\r\n\r\n    <cts-pagination\r\n      [page]=\"selectedPage + 1\"\r\n      (change)=\"changePage($event - 1)\"\r\n      [size]=\"options.pageSize\"\r\n      [count]=\"response.totalItems\"\r\n    >\r\n    </cts-pagination>\r\n  </ng-template>\r\n</div>\r\n\r\n<ng-template #filters>\r\n  <button\r\n    (click)=\"$event.stopPropagation()\"\r\n    class=\"type-filter-trigger\"\r\n    [matMenuTriggerFor]=\"filterTypeMenu\"\r\n    #filterTypeMenuTrigger=\"matMenuTrigger\"\r\n  >\r\n    {{ 'notifications.all' | translate }}\r\n    <span class=\"icon icon-chevron-down\"></span>\r\n  </button>\r\n  <mat-menu class=\"new-menu-design\" #filterTypeMenu=\"matMenu\">\r\n    <div (click)=\"$event.stopPropagation()\">\r\n      <div class=\"single-menu-action notification-filter-menu-item\">\r\n        {{ 'notifications.' + type.name | translate }}\r\n      </div>\r\n    </div>\r\n  </mat-menu>\r\n</ng-template>\r\n\r\n<ng-template #noData>\r\n  <div class=\"no-notifications text-center p-3\">\r\n    <p>\r\n      {{ 'notifications.noNotifications' | translate }}\r\n    </p>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #defaultItemTemplate let-item>\r\n  <app-notification-item\r\n    [iconOptions]=\"options?.icons\"\r\n    [notification]=\"item\"\r\n    [currentLang]=\"currentLang\"\r\n    [class.cursor-pointer]=\"item.properties?.['notf_nt:isClickable']\"\r\n    (click)=\"onItemClick(item)\"\r\n    (markAsUnread)=\"markAsUnread(item)\"\r\n    (markAsRead)=\"markAsRead(item)\"\r\n    (markAsDeleted)=\"markAsDeleted(item)\"\r\n  ></app-notification-item>\r\n</ng-template>\r\n", styles: [".notifications-container{padding:var(--nto-container-padding, 0)}.notifications-container__header{padding:var(--nto-container-header-padding, .5rem);display:var(--nto-container-header-display, flex);justify-content:var(--nto-container-header-justify, space-between);align-items:var(--nto-container-header-align-items, center);box-sizing:border-box}.notifications-container__title{color:var(--nto-container-title-color, #2f258a);font-size:var(--nto-container-title-size, 1.1rem);font-weight:var(--nto-container-title-weight, normal)}.notifications-container__filters{display:var(--nto-container-filters-display, flex);grid-gap:var(--nto-container-filters-gap, .5rem);gap:var(--nto-container-filters-gap, .5rem)}.notifications-container__body{position:relative;height:var(--nto-container-height, 74vh);overflow-y:auto}.notifications-container__body--pagination{--nto-container-height: var(--nto-container-pagination-height, auto)}.notifications-container__loader{display:grid;place-items:center}.notifications-container__pagination-loader{display:grid;place-items:center;position:absolute;inset:0 0;width:100%;height:100%;background:var(--nto-pagination-background, rgba(255, 255, 255, .4))}.no-notifications{min-height:var(--no-notifications-min-height, 0);display:var(--no-notifications-display, flex);flex-direction:var(--no-notifications-direction, column);justify-content:var(--no-notifications-justify, center);align-items:var(--no-notifications-items, center);color:var(--no-notifications-color, #b4bac6);font-size:var(--no-notifications-size, 1rem)}\n"], components: [{ type: NotificationSourceSelectComponent, selector: "app-notification-source-select", outputs: ["typeChanged"] }, { type: NotificationsDateSelectComponent, selector: "app-notifications-date-select", outputs: ["dateChanged"] }, { type: NotificationStatusToggleComponent, selector: "app-notification-status-toggle", inputs: ["status"], outputs: ["statusChanged"] }, { type: NotificationSortbyToggleComponent, selector: "app-notification-sortby-toggle", inputs: ["status"], outputs: ["newestFirstChanged"] }, { type: i6__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }, { type: PaginationComponent, selector: "cts-pagination", inputs: ["size", "count", "page"], outputs: ["change"] }, { type: i3__namespace$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: NotificationItemComponent, selector: "app-notification-item", inputs: ["iconOptions", "currentLang", "notification"], outputs: ["markAsUnread", "markAsRead", "markAsDeleted"] }], directives: [{ type: i4__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7__namespace$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { type: i4__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["matMenuTriggerRestoreFocus", "mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], pipes: { "translate": i1__namespace.TranslatePipe, "async": i4__namespace$1.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsListContainerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -42746,6 +42802,8 @@
                   type: i0.Input
               }], showFilters: [{
                   type: i0.Input
+              }], showNewestToggle: [{
+                  type: i0.Input
               }], criteria: [{
                   type: i0.Input
               }], customItemTemplate: [{
@@ -43073,9 +43131,10 @@
           CheckIfSubscribedPipe,
           GetIconPipe,
           NotificationsSidebarComponent,
-          NotificationSidebarContentDirective], imports: [i4.CommonModule,
+          NotificationSidebarContentDirective,
+          NotificationSortbyToggleComponent], imports: [i4.CommonModule,
           i1$3.RouterModule,
-          i9.InfiniteScrollModule,
+          i7$1.InfiniteScrollModule,
           i2$3.MatListModule,
           PipesModule,
           i3$1.MatMenuModule,
@@ -43083,8 +43142,8 @@
           i1.TranslateModule,
           i6.MatProgressSpinnerModule,
           i7.MatTooltipModule,
-          i9.InfiniteScrollModule,
-          i7$3.MatBadgeModule,
+          i7$1.InfiniteScrollModule,
+          i7$4.MatBadgeModule,
           i1.TranslateModule,
           toolbar.MatToolbarModule,
           i1$a.MatSlideToggleModule,
@@ -43103,7 +43162,7 @@
   NotificationsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: NotificationsModule, providers: [i4.DatePipe, NotificationsService], imports: [[
               i4.CommonModule,
               i1$3.RouterModule,
-              i9.InfiniteScrollModule,
+              i7$1.InfiniteScrollModule,
               i2$3.MatListModule,
               PipesModule,
               i3$1.MatMenuModule,
@@ -43111,8 +43170,8 @@
               i1.TranslateModule,
               i6.MatProgressSpinnerModule,
               i7.MatTooltipModule,
-              i9.InfiniteScrollModule,
-              i7$3.MatBadgeModule,
+              i7$1.InfiniteScrollModule,
+              i7$4.MatBadgeModule,
               i1.TranslateModule,
               toolbar.MatToolbarModule,
               i1$a.MatSlideToggleModule,
@@ -43128,7 +43187,7 @@
                       imports: [
                           i4.CommonModule,
                           i1$3.RouterModule,
-                          i9.InfiniteScrollModule,
+                          i7$1.InfiniteScrollModule,
                           i2$3.MatListModule,
                           PipesModule,
                           i3$1.MatMenuModule,
@@ -43136,8 +43195,8 @@
                           i1.TranslateModule,
                           i6.MatProgressSpinnerModule,
                           i7.MatTooltipModule,
-                          i9.InfiniteScrollModule,
-                          i7$3.MatBadgeModule,
+                          i7$1.InfiniteScrollModule,
+                          i7$4.MatBadgeModule,
                           i1.TranslateModule,
                           toolbar.MatToolbarModule,
                           i1$a.MatSlideToggleModule,
@@ -43156,6 +43215,7 @@
                           GetIconPipe,
                           NotificationsSidebarComponent,
                           NotificationSidebarContentDirective,
+                          NotificationSortbyToggleComponent,
                       ],
                       exports: [COMPONENTS$2, DIRECTIVES$1],
                       providers: [i4.DatePipe, NotificationsService],