@tilde-nlp/ngx-common 6.1.93 → 7.0.1

package/fesm2022/tilde-nlp-ngx-common.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Component, Output, Input, ViewChild, NgModule, Optional, Inject, Pipe, inject, Directive, HostListener, HostBinding, ViewChildren, input, effect, ElementRef, ContentChildren, ContentChild, InjectionToken, signal, output, computed } from '@angular/core';
+import { Injectable, EventEmitter, Component, Input, ViewChild, Output, NgModule, Optional, Inject, Pipe, inject, Directive, HostListener, HostBinding, ViewChildren, input, effect, ElementRef, ContentChild, ContentChildren, InjectionToken, signal, output, computed } from '@angular/core';
 import * as i1 from '@angular/material/icon';
 import { MatIconModule, MatIcon } from '@angular/material/icon';
 import * as i2 from '@angular/platform-browser';
@@ -22,7 +22,7 @@ import * as i1$3 from '@angular/common/http';
 import { HttpErrorResponse, provideHttpClient, withInterceptorsFromDi, HttpClient } from '@angular/common/http';
 import * as i15 from '@angular/material/paginator';
 import { MatPaginatorIntl, MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
-import * as i11 from '@angular/material/progress-spinner';
+import * as i2$5 from '@angular/material/progress-spinner';
 import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import * as i1$4 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule, MatDialog, MatDialogRef } from '@angular/material/dialog';
@@ -32,20 +32,18 @@ import * as i4$1 from '@angular/forms';
 import { FormGroup, FormControl, FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import * as i4 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
-import * as i5 from '@angular/material/core';
 import * as i9 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import * as i10 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { SelectionModel } from '@angular/cdk/collections';
 import { MatSort, MatSortModule } from '@angular/material/sort';
 import * as i4$2 from '@angular/material/table';
-import { MatTableDataSource, MatNoDataRow, MatHeaderRowDef, MatRowDef, MatColumnDef, MatTable, MatTableModule } from '@angular/material/table';
+import { MatTableDataSource, MatTable, MatNoDataRow, MatHeaderRowDef, MatRowDef, MatColumnDef, MatTableModule } from '@angular/material/table';
 import * as i6$1 from '@angular/material/menu';
 import { MatMenuModule } from '@angular/material/menu';
 import * as i7 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i5$1 from '@angular/material/radio';
+import * as i5 from '@angular/material/radio';
 import { MatRadioModule } from '@angular/material/radio';
 import * as i1$5 from '@tilde-nlp/ngx-services';
 import { QuotaType, LLMRephraseUseCase, LLMSummaryUseCase } from '@tilde-nlp/ngx-services';
@@ -119,7 +117,7 @@ class CloseButtonComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.clearButton = _t.first);
-        } }, inputs: { ariaCode: "ariaCode", disabled: "disabled", tooltip: "tooltip" }, outputs: { tldClick: "tldClick" }, decls: 6, vars: 7, consts: [["clearButton", ""], ["mat-icon-button", "", 3, "click", "matTooltip", "disabled"], [1, "material-icons"]], template: function CloseButtonComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { ariaCode: "ariaCode", disabled: "disabled", tooltip: "tooltip" }, outputs: { tldClick: "tldClick" }, standalone: false, decls: 6, vars: 7, consts: [["clearButton", ""], ["mat-icon-button", "", 3, "click", "matTooltip", "disabled"], [1, "material-icons"]], template: function CloseButtonComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "button", 1, 0);
             i0.ɵɵpipe(2, "translate");
@@ -135,7 +133,7 @@ class CloseButtonComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CloseButtonComponent, [{
         type: Component,
-        args: [{ selector: 'tld-close-button', template: "<button [matTooltip]=\"tooltip | translate\"\r\n#clearButton mat-icon-button (click)=\"clicked()\" [attr.aria-label]=\"'ARIA_LABELS.'+ariaCode | translate\"\r\n    [disabled]=\"disabled\">\r\n    <span class=\"material-icons\">\r\n        close\r\n    </span>\r\n</button>" }]
+        args: [{ selector: 'tld-close-button', standalone: false, template: "<button [matTooltip]=\"tooltip | translate\"\r\n#clearButton mat-icon-button (click)=\"clicked()\" [attr.aria-label]=\"'ARIA_LABELS.'+ariaCode | translate\"\r\n    [disabled]=\"disabled\">\r\n    <span class=\"material-icons\">\r\n        close\r\n    </span>\r\n</button>" }]
     }], null, { tldClick: [{
             type: Output
         }], ariaCode: [{
@@ -148,7 +146,7 @@ class CloseButtonComponent {
         }], tooltip: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CloseButtonComponent, { className: "CloseButtonComponent", filePath: "lib\\close-button\\close-button.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CloseButtonComponent, { className: "CloseButtonComponent", filePath: "lib/close-button/close-button.component.ts", lineNumber: 10 }); })();
 
 class CloseButtonModule {
     static { this.ɵfac = function CloseButtonModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CloseButtonModule)(); }; }
@@ -318,7 +316,7 @@ class NotificationMessageComponent {
         this.linkClicked.next(null);
     }
     static { this.ɵfac = function NotificationMessageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NotificationMessageComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NotificationMessageComponent, selectors: [["lib-tld-notification-message"]], inputs: { message: "message", inline: "inline" }, outputs: { buttonClicked: "buttonClicked", closeClicked: "closeClicked", linkClicked: "linkClicked" }, decls: 12, vars: 13, consts: [["fxLayout", "row", "fxLayoutAlign", "start start", "aria-live", "polite", "fxLayout", "row", 1, "notification-message-container", "tld-default-border", 3, "ngClass.lt-md"], [1, "material-icons-outlined", "message-icon"], ["fxFlex", "", 1, "items-container"], ["fxLayout", "row"], ["fxFlex", "", 1, "text-container"], ["class", "message-title", 3, "innerHtml", 4, "ngIf"], ["class", "message-body", 4, "ngIf"], ["color", "accent", "mat-stroked-button", "", "class", "callback-button", 3, "click", 4, "ngIf"], ["class", "close-button", 3, "no-top-margin", "tldClick", 4, "ngIf"], ["fxLayout", "row", "fxLayoutGap", "16px", "fxLayoutAlign", "start center", 4, "ngIf"], [1, "message-title", 3, "innerHtml"], [1, "message-body"], [3, "innerHtml"], [3, "innerHtml", 4, "ngIf"], ["color", "accent", "mat-stroked-button", "", 1, "callback-button", 3, "click"], [4, "ngIf"], [1, "close-button", 3, "tldClick"], ["fxLayout", "row", "fxLayoutGap", "16px", "fxLayoutAlign", "start center"], ["class", "message-action-button", "color", "accent", "mat-flat-button", "", 3, "click", 4, "ngIf"], ["class", "message-action-link", 3, "click", 4, "ngIf"], ["class", "message-action-link", 3, "routerLink", "click", 4, "ngIf"], ["color", "accent", "mat-flat-button", "", 1, "message-action-button", 3, "click"], [1, "message-action-link", 3, "click"], [1, "message-action-link", 3, "click", "routerLink"]], template: function NotificationMessageComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NotificationMessageComponent, selectors: [["lib-tld-notification-message"]], inputs: { message: "message", inline: "inline" }, outputs: { buttonClicked: "buttonClicked", closeClicked: "closeClicked", linkClicked: "linkClicked" }, standalone: false, decls: 12, vars: 13, consts: [["fxLayout", "row", "fxLayoutAlign", "start start", "aria-live", "polite", "fxLayout", "row", 1, "notification-message-container", "tld-default-border", 3, "ngClass.lt-md"], [1, "material-icons-outlined", "message-icon"], ["fxFlex", "", 1, "items-container"], ["fxLayout", "row"], ["fxFlex", "", 1, "text-container"], ["class", "message-title", 3, "innerHtml", 4, "ngIf"], ["class", "message-body", 4, "ngIf"], ["color", "accent", "mat-stroked-button", "", "class", "callback-button", 3, "click", 4, "ngIf"], ["class", "close-button", 3, "no-top-margin", "tldClick", 4, "ngIf"], ["fxLayout", "row", "fxLayoutGap", "16px", "fxLayoutAlign", "start center", 4, "ngIf"], [1, "message-title", 3, "innerHtml"], [1, "message-body"], [3, "innerHtml"], [3, "innerHtml", 4, "ngIf"], ["color", "accent", "mat-stroked-button", "", 1, "callback-button", 3, "click"], [4, "ngIf"], [1, "close-button", 3, "tldClick"], ["fxLayout", "row", "fxLayoutGap", "16px", "fxLayoutAlign", "start center"], ["class", "message-action-button", "color", "accent", "mat-flat-button", "", 3, "click", 4, "ngIf"], ["class", "message-action-link", 3, "click", 4, "ngIf"], ["class", "message-action-link", 3, "routerLink", "click", 4, "ngIf"], ["color", "accent", "mat-flat-button", "", 1, "message-action-button", 3, "click"], [1, "message-action-link", 3, "click"], [1, "message-action-link", 3, "click", "routerLink"]], template: function NotificationMessageComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div")(1, "div", 0)(2, "span", 1);
             i0.ɵɵtext(3);
             i0.ɵɵelementEnd();
@@ -347,11 +345,11 @@ class NotificationMessageComponent {
             i0.ɵɵproperty("ngIf", !ctx.message.hideClose && !ctx.message.callbackButtonText);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.message.buttonText || ctx.message.linkHref || ctx.message.routerLink);
-        } }, dependencies: [i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i2$3.DefaultFlexDirective, i3.DefaultClassDirective, CloseButtonComponent, i2$1.MatButton, i6.RouterLink, i1.MatIcon, i1$1.TranslatePipe], styles: ["[_nghost-%COMP%]{display:inline-block;width:100%}.close-button[_ngcontent-%COMP%]{position:absolute;top:.2em!important;right:.2em!important}.no-top-margin[_ngcontent-%COMP%]{top:0}.text-container[_ngcontent-%COMP%]{margin-right:45px}.notification-message[_ngcontent-%COMP%]{position:relative}.notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--base-100)}.notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--base-40)}.notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--info-light)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]{color:var(--info-dark)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--info-primary)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%]{color:var(--info-dark)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--error-light)}.notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%], .notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--error-dark)}.notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--warning-light)}.notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%], .notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--warning-dark)}.notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--success-light)}.notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%], .notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--success-dark)}.notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{border-radius:4px}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]:has(.message-title + .message-body)[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%]{font-weight:600}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]{padding:.6em .4em!important;border-radius:0}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]{margin-left:.4em!important}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   div[_ngcontent-%COMP%] + div[_ngcontent-%COMP%]{margin-top:.2em!important}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%] + .message-body[_ngcontent-%COMP%]{margin-top:0!important}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]:first-child{line-height:1.5em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%]{margin:0;font-size:16px;line-height:24px}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]   .message-body[_ngcontent-%COMP%]{margin:0}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline){padding:1em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline)   .items-container[_ngcontent-%COMP%]{margin-left:1em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline)   .message-title[_ngcontent-%COMP%]{font-size:1.25em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline)   .message-body[_ngcontent-%COMP%]{line-height:1.5em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]{padding:.75em 1em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]{margin-left:.75em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   div[_ngcontent-%COMP%] + div[_ngcontent-%COMP%]{margin-top:.5em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%] + .message-body[_ngcontent-%COMP%]{margin-top:.2em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%]{font-size:1em}"] }); }
+        } }, dependencies: [i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i2$3.DefaultFlexDirective, i3.DefaultClassDirective, CloseButtonComponent, i2$1.MatButton, i6.RouterLink, i1.MatIcon, i1$1.TranslatePipe], styles: ["[_nghost-%COMP%]{display:inline-block;width:100%}.close-button[_ngcontent-%COMP%]{position:absolute;top:.2em!important;right:.2em!important}.no-top-margin[_ngcontent-%COMP%]{top:0}.text-container[_ngcontent-%COMP%]{margin-right:45px}.notification-message[_ngcontent-%COMP%]{position:relative}.notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--base-100)}.notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--base-40)}.notification-message.basic[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--info-light)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]{color:var(--info-dark)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--info-primary)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%]{color:var(--info-dark)}.notification-message.info[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--error-light)}.notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%], .notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--error-dark)}.notification-message.error[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--warning-light)}.notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%], .notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--warning-dark)}.notification-message.warning[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{background-color:var(--success-light)}.notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .close-button[_ngcontent-%COMP%], .notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%], .notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-icon[_ngcontent-%COMP%]{color:var(--success-dark)}.notification-message.success[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .message-action-button[_ngcontent-%COMP%]{background-color:var(--base-40)}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]{border-radius:4px}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]:has(.message-title+.message-body)   .message-title[_ngcontent-%COMP%]{font-weight:600}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]{padding:.6em .4em!important;border-radius:0}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]{margin-left:.4em!important}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   div[_ngcontent-%COMP%] + div[_ngcontent-%COMP%]{margin-top:.2em!important}.notification-message[_ngcontent-%COMP%]   .notification-message-container.mobile[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%] + .message-body[_ngcontent-%COMP%]{margin-top:0!important}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]:first-child{line-height:1.5em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%]{margin:0;font-size:16px;line-height:24px}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]   .text-container[_ngcontent-%COMP%]   .message-body[_ngcontent-%COMP%]{margin:0}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline){padding:1em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline)   .items-container[_ngcontent-%COMP%]{margin-left:1em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline)   .message-title[_ngcontent-%COMP%]{font-size:1.25em}.notification-message[_ngcontent-%COMP%]   .notification-message-container[_ngcontent-%COMP%]:not(.inline)   .message-body[_ngcontent-%COMP%]{line-height:1.5em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]{padding:.75em 1em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]{margin-left:.75em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   div[_ngcontent-%COMP%] + div[_ngcontent-%COMP%]{margin-top:.5em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .items-container[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%] + .message-body[_ngcontent-%COMP%]{margin-top:.2em}.notification-message[_ngcontent-%COMP%]   .notification-message-container.inline[_ngcontent-%COMP%]   .message-title[_ngcontent-%COMP%]{font-size:1em}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NotificationMessageComponent, [{
         type: Component,
-        args: [{ selector: 'lib-tld-notification-message', template: "<div class=\"notification-message {{className}}\">\r\n  <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n    fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n    <span class=\"material-icons-outlined message-icon\">\r\n      {{iconNames[message.type]}}\r\n    </span>\r\n    <div class=\"items-container\" fxFlex>\r\n      <div fxLayout=\"row\">\r\n        <div class=\"text-container\" fxFlex>\r\n          <p *ngIf=\"message.title\" class=\"message-title\"\r\n            [innerHtml]=\"message.title | translate: message.localizationParams\"></p>\r\n          <p *ngIf=\"message.body\" class=\"message-body\">\r\n            <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n            <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n          </p>\r\n        </div>\r\n        <button\r\n          *ngIf=\"message.callbackButtonText\"\r\n          color=\"accent\"\r\n          mat-stroked-button\r\n          class=\"callback-button\"\r\n          (click)=\"message?.callbackButtonClick()\"\r\n        >\r\n          <mat-icon *ngIf=\"message.callbackButtonIcon\">{{message.callbackButtonIcon}}</mat-icon>\r\n          {{ message.callbackButtonText | translate }}\r\n        </button>\r\n        <tld-close-button *ngIf=\"!message.hideClose && !message.callbackButtonText\" class=\"close-button\" [class.no-top-margin]=\"!message.title || !message.body\" (tldClick)=\"closeClick()\">\r\n        </tld-close-button>\r\n      </div>\r\n      <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n        *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n        <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n          (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n        <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n          [attr.href]=\"message.linkHref\">{{message.linkText |\r\n          translate}}</a>\r\n        <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n          [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n          translate}}</a>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{display:inline-block;width:100%}.close-button{position:absolute;top:.2em!important;right:.2em!important}.no-top-margin{top:0}.text-container{margin-right:45px}.notification-message{position:relative}.notification-message.basic .notification-message-container{background-color:var(--base-100)}.notification-message.basic .notification-message-container .close-button,.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.info .notification-message-container{background-color:var(--info-light)}.notification-message.info .notification-message-container .text-container{color:var(--info-dark)}.notification-message.info .notification-message-container .message-icon{color:var(--info-primary)}.notification-message.info .notification-message-container .close-button{color:var(--info-dark)}.notification-message.info .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light)}.notification-message.error .notification-message-container .close-button,.notification-message.error .notification-message-container .text-container,.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light)}.notification-message.warning .notification-message-container .close-button,.notification-message.warning .notification-message-container .text-container,.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light)}.notification-message.success .notification-message-container .close-button,.notification-message.success .notification-message-container .text-container,.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border-radius:4px}.notification-message .notification-message-container .text-container:has(.message-title+.message-body) .message-title{font-weight:600}.notification-message .notification-message-container.mobile{padding:.6em .4em!important;border-radius:0}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{margin:0;font-size:16px;line-height:24px}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"] }]
+        args: [{ selector: 'lib-tld-notification-message', standalone: false, template: "<div class=\"notification-message {{className}}\">\r\n  <div class=\"notification-message-container tld-default-border\" [ngClass.lt-md]=\"'mobile'\" [class.inline]=\"inline\"\r\n    fxLayout=\"row\" fxLayoutAlign=\"start start\" [attr.id]=\"message.id\" aria-live=\"polite\" fxLayout=\"row\">\r\n    <span class=\"material-icons-outlined message-icon\">\r\n      {{iconNames[message.type]}}\r\n    </span>\r\n    <div class=\"items-container\" fxFlex>\r\n      <div fxLayout=\"row\">\r\n        <div class=\"text-container\" fxFlex>\r\n          <p *ngIf=\"message.title\" class=\"message-title\"\r\n            [innerHtml]=\"message.title | translate: message.localizationParams\"></p>\r\n          <p *ngIf=\"message.body\" class=\"message-body\">\r\n            <span [innerHtml]=\"message.body | translate: message.localizationParams\"></span>\r\n            <span *ngIf=\"message.support\" [innerHtml]=\"message.support | translate: message.localizationParams\"></span>\r\n          </p>\r\n        </div>\r\n        <button\r\n          *ngIf=\"message.callbackButtonText\"\r\n          color=\"accent\"\r\n          mat-stroked-button\r\n          class=\"callback-button\"\r\n          (click)=\"message?.callbackButtonClick()\"\r\n        >\r\n          <mat-icon *ngIf=\"message.callbackButtonIcon\">{{message.callbackButtonIcon}}</mat-icon>\r\n          {{ message.callbackButtonText | translate }}\r\n        </button>\r\n        <tld-close-button *ngIf=\"!message.hideClose && !message.callbackButtonText\" class=\"close-button\" [class.no-top-margin]=\"!message.title || !message.body\" (tldClick)=\"closeClick()\">\r\n        </tld-close-button>\r\n      </div>\r\n      <div fxLayout=\"row\" fxLayoutGap=\"16px\" fxLayoutAlign=\"start center\"\r\n        *ngIf=\"message.buttonText || message.linkHref || message.routerLink\">\r\n        <button class=\"message-action-button\" color=\"accent\" mat-flat-button *ngIf=\"message.buttonText\"\r\n          (click)=\"buttonClick()\">{{message.buttonText | translate}} </button>\r\n        <a class=\"message-action-link\" *ngIf=\"message.linkHref && message.linkText\" (click)=\"linkClick()\"\r\n          [attr.href]=\"message.linkHref\">{{message.linkText |\r\n          translate}}</a>\r\n        <a class=\"message-action-link\" *ngIf=\"message.routerLink && message.linkText\" (click)=\"linkClick()\"\r\n          [routerLink]=\"[message.routerLink]\">{{message.linkText |\r\n          translate}}</a>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [":host{display:inline-block;width:100%}.close-button{position:absolute;top:.2em!important;right:.2em!important}.no-top-margin{top:0}.text-container{margin-right:45px}.notification-message{position:relative}.notification-message.basic .notification-message-container{background-color:var(--base-100)}.notification-message.basic .notification-message-container .close-button,.notification-message.basic .notification-message-container .message-icon{color:var(--base-40)}.notification-message.basic .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.info .notification-message-container{background-color:var(--info-light)}.notification-message.info .notification-message-container .text-container{color:var(--info-dark)}.notification-message.info .notification-message-container .message-icon{color:var(--info-primary)}.notification-message.info .notification-message-container .close-button{color:var(--info-dark)}.notification-message.info .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.error .notification-message-container{background-color:var(--error-light)}.notification-message.error .notification-message-container .close-button,.notification-message.error .notification-message-container .text-container,.notification-message.error .notification-message-container .message-icon{color:var(--error-dark)}.notification-message.error .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.warning .notification-message-container{background-color:var(--warning-light)}.notification-message.warning .notification-message-container .close-button,.notification-message.warning .notification-message-container .text-container,.notification-message.warning .notification-message-container .message-icon{color:var(--warning-dark)}.notification-message.warning .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message.success .notification-message-container{background-color:var(--success-light)}.notification-message.success .notification-message-container .close-button,.notification-message.success .notification-message-container .text-container,.notification-message.success .notification-message-container .message-icon{color:var(--success-dark)}.notification-message.success .notification-message-container .message-action-button{background-color:var(--base-40)}.notification-message .notification-message-container{border-radius:4px}.notification-message .notification-message-container .text-container:has(.message-title+.message-body) .message-title{font-weight:600}.notification-message .notification-message-container.mobile{padding:.6em .4em!important;border-radius:0}.notification-message .notification-message-container.mobile .items-container{margin-left:.4em!important}.notification-message .notification-message-container.mobile .items-container div+div{margin-top:.2em!important}.notification-message .notification-message-container.mobile .items-container .message-title+.message-body{margin-top:0!important}.notification-message .notification-message-container .text-container:first-child{line-height:1.5em}.notification-message .notification-message-container .text-container .message-title{margin:0;font-size:16px;line-height:24px}.notification-message .notification-message-container .text-container .message-body{margin:0}.notification-message .notification-message-container:not(.inline){padding:1em}.notification-message .notification-message-container:not(.inline) .items-container{margin-left:1em}.notification-message .notification-message-container:not(.inline) .message-title{font-size:1.25em}.notification-message .notification-message-container:not(.inline) .message-body{line-height:1.5em}.notification-message .notification-message-container.inline{padding:.75em 1em}.notification-message .notification-message-container.inline .items-container{margin-left:.75em}.notification-message .notification-message-container.inline .items-container div+div{margin-top:.5em}.notification-message .notification-message-container.inline .items-container .message-title+.message-body{margin-top:.2em}.notification-message .notification-message-container.inline .message-title{font-size:1em}\n"] }]
     }], null, { message: [{
             type: Input
         }], buttonClicked: [{
@@ -363,7 +361,7 @@ class NotificationMessageComponent {
         }], inline: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NotificationMessageComponent, { className: "NotificationMessageComponent", filePath: "lib\\notification-message\\notification-message.component.ts", lineNumber: 10 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NotificationMessageComponent, { className: "NotificationMessageComponent", filePath: "lib/notification-message/notification-message.component.ts", lineNumber: 11 }); })();
 
 class NotificationMessageModule {
     static { this.ɵfac = function NotificationMessageModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NotificationMessageModule)(); }; }
@@ -827,7 +825,7 @@ class FileSizeLabelPipe {
         return getFileSizeLabel(value, decimalPlaces, unit);
     }
     static { this.ɵfac = function FileSizeLabelPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FileSizeLabelPipe)(); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "fileSizeLabel", type: FileSizeLabelPipe, pure: true, standalone: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "fileSizeLabel", type: FileSizeLabelPipe, pure: true }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FileSizeLabelPipe, [{
         type: Pipe,
@@ -1155,12 +1153,13 @@ class FilterWithHighlightPipe {
         return filteredArr;
     }
     static { this.ɵfac = function FilterWithHighlightPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FilterWithHighlightPipe)(); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "filterWithHighlight", type: FilterWithHighlightPipe, pure: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "filterWithHighlight", type: FilterWithHighlightPipe, pure: true, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FilterWithHighlightPipe, [{
         type: Pipe,
         args: [{
-                name: 'filterWithHighlight'
+                name: 'filterWithHighlight',
+                standalone: false
             }]
     }], null, null); })();
 
@@ -1232,12 +1231,13 @@ class SortTranslationsPipe {
         });
     }
     static { this.ɵfac = function SortTranslationsPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SortTranslationsPipe)(i0.ɵɵdirectiveInject(i1$1.TranslateService, 16)); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortTranslations", type: SortTranslationsPipe, pure: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortTranslations", type: SortTranslationsPipe, pure: true, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SortTranslationsPipe, [{
         type: Pipe,
         args: [{
-                name: 'sortTranslations'
+                name: 'sortTranslations',
+                standalone: false
             }]
     }], () => [{ type: i1$1.TranslateService }], null); })();
 
@@ -1291,12 +1291,13 @@ class SortTranslationsByPropertyPipe {
         return values;
     }
     static { this.ɵfac = function SortTranslationsByPropertyPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SortTranslationsByPropertyPipe)(i0.ɵɵdirectiveInject(i1$1.TranslateService, 16)); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortTranslationsByProperty", type: SortTranslationsByPropertyPipe, pure: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortTranslationsByProperty", type: SortTranslationsByPropertyPipe, pure: true, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SortTranslationsByPropertyPipe, [{
         type: Pipe,
         args: [{
                 name: 'sortTranslationsByProperty',
+                standalone: false
             }]
     }], () => [{ type: i1$1.TranslateService }], null); })();
 
@@ -1427,7 +1428,7 @@ class LanguageTranslatePipe {
         return text.charAt(0).toUpperCase() + text.slice(1);
     }
     static { this.ɵfac = function LanguageTranslatePipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LanguageTranslatePipe)(i0.ɵɵdirectiveInject(i1$1.TranslateService, 16)); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "languageTranslate", type: LanguageTranslatePipe, pure: false, standalone: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "languageTranslate", type: LanguageTranslatePipe, pure: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LanguageTranslatePipe, [{
         type: Pipe,
@@ -1521,7 +1522,7 @@ class DateAgoPipe {
         if (!dateAgo) {
             return "";
         }
-        const translatePipe = new TranslatePipe(this.translate, this._ref);
+        const translatePipe = new TranslatePipe();
         return translatePipe.transform(`${this.localizationPrefix}.${dateAgo.key}`, { value: dateAgo.howMany });
     }
     calculateDateAgo(value, enableMultiplePostfix) {
@@ -1549,13 +1550,14 @@ class DateAgoPipe {
         return null;
     }
     static { this.ɵfac = function DateAgoPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DateAgoPipe)(i0.ɵɵdirectiveInject(i1$1.TranslateService, 16), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef, 16), i0.ɵɵdirectiveInject(DateAgoSettingsToken, 24)); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "dateAgo", type: DateAgoPipe, pure: false }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "dateAgo", type: DateAgoPipe, pure: false, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DateAgoPipe, [{
         type: Pipe,
         args: [{
                 name: 'dateAgo',
-                pure: false
+                pure: false,
+                standalone: false
             }]
     }], () => [{ type: i1$1.TranslateService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                 type: Inject,
@@ -1600,12 +1602,13 @@ class ObjectLengthPipe {
         return Object.keys(value).length;
     }
     static { this.ɵfac = function ObjectLengthPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ObjectLengthPipe)(); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "objectLength", type: ObjectLengthPipe, pure: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "objectLength", type: ObjectLengthPipe, pure: true, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ObjectLengthPipe, [{
         type: Pipe,
         args: [{
-                name: 'objectLength'
+                name: 'objectLength',
+                standalone: false
             }]
     }], null, null); })();
 
@@ -1633,7 +1636,7 @@ class SortByNumberPipe {
         return SortHelper.sortByNumber(values, sortingValueKey, desc);
     }
     static { this.ɵfac = function SortByNumberPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SortByNumberPipe)(); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortByNumber", type: SortByNumberPipe, pure: false, standalone: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortByNumber", type: SortByNumberPipe, pure: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SortByNumberPipe, [{
         type: Pipe,
@@ -1653,12 +1656,13 @@ class SortAlphabeticallyPipe {
         return SortHelper.sortAlphabetically(values, sortingValueKey);
     }
     static { this.ɵfac = function SortAlphabeticallyPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SortAlphabeticallyPipe)(); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortAlphabetically", type: SortAlphabeticallyPipe, pure: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortAlphabetically", type: SortAlphabeticallyPipe, pure: true, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SortAlphabeticallyPipe, [{
         type: Pipe,
         args: [{
-                name: 'sortAlphabetically'
+                name: 'sortAlphabetically',
+                standalone: false
             }]
     }], null, null); })();
 
@@ -1720,7 +1724,7 @@ class SortLanguageListPipe {
         }));
     }
     static { this.ɵfac = function SortLanguageListPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SortLanguageListPipe)(); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortLanguageList", type: SortLanguageListPipe, pure: true, standalone: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortLanguageList", type: SortLanguageListPipe, pure: true }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SortLanguageListPipe, [{
         type: Pipe,
@@ -1744,7 +1748,7 @@ class DomainTranslatePipe {
         return domains[domainLocalizationKey] ?? titleCasePipe.transform(value);
     }
     static { this.ɵfac = function DomainTranslatePipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || DomainTranslatePipe)(i0.ɵɵdirectiveInject(i1$1.TranslateService, 16)); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "domainTranslate", type: DomainTranslatePipe, pure: false, standalone: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "domainTranslate", type: DomainTranslatePipe, pure: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DomainTranslatePipe, [{
         type: Pipe,
@@ -1792,7 +1796,7 @@ class SortDomainsPipe {
         });
     }
     static { this.ɵfac = function SortDomainsPipe_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SortDomainsPipe)(i0.ɵɵdirectiveInject(i1$1.TranslateService, 16)); }; }
-    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortDomains", type: SortDomainsPipe, pure: true, standalone: true }); }
+    static { this.ɵpipe = /*@__PURE__*/ i0.ɵɵdefinePipe({ name: "sortDomains", type: SortDomainsPipe, pure: true }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SortDomainsPipe, [{
         type: Pipe,
@@ -1921,12 +1925,13 @@ class PlausibleEventDirective {
     static { this.ɵfac = function PlausibleEventDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PlausibleEventDirective)(); }; }
     static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: PlausibleEventDirective, selectors: [["", "libPlausibleEvent", ""]], hostBindings: function PlausibleEventDirective_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("click", function PlausibleEventDirective_click_HostBindingHandler() { return ctx.onClick(); });
-        } }, inputs: { libPlausibleEvent: "libPlausibleEvent" } }); }
+        } }, inputs: { libPlausibleEvent: "libPlausibleEvent" }, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PlausibleEventDirective, [{
         type: Directive,
         args: [{
-                selector: '[libPlausibleEvent]'
+                selector: '[libPlausibleEvent]',
+                standalone: false
             }]
     }], null, { libPlausibleEvent: [{
             type: Input
@@ -2005,7 +2010,7 @@ class InlineMessageComponent {
         this.iconName = "info";
     }
     static { this.ɵfac = function InlineMessageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || InlineMessageComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InlineMessageComponent, selectors: [["lib-inline-message"]], inputs: { iconName: "iconName", message: "message" }, decls: 3, vars: 5, consts: [["class", "material-icons", 3, "order-end", "matTooltip", 4, "ngIf"], [4, "ngIf"], [1, "material-icons", 3, "matTooltip"], ["class", "text-s-semi-bold title", 3, "innerHtml", 4, "ngIf"], ["class", "text-s description", 3, "innerHtml", 4, "ngIf"], [1, "text-s-semi-bold", "title", 3, "innerHtml"], [1, "text-s", "description", 3, "innerHtml"]], template: function InlineMessageComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InlineMessageComponent, selectors: [["lib-inline-message"]], inputs: { iconName: "iconName", message: "message" }, standalone: false, decls: 3, vars: 5, consts: [["class", "material-icons", 3, "order-end", "matTooltip", 4, "ngIf"], [4, "ngIf"], [1, "material-icons", 3, "matTooltip"], ["class", "text-s-semi-bold title", 3, "innerHtml", 4, "ngIf"], ["class", "text-s description", 3, "innerHtml", 4, "ngIf"], [1, "text-s-semi-bold", "title", 3, "innerHtml"], [1, "text-s", "description", 3, "innerHtml"]], template: function InlineMessageComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div");
             i0.ɵɵtemplate(1, InlineMessageComponent_span_1_Template, 3, 7, "span", 0)(2, InlineMessageComponent_section_2_Template, 3, 2, "section", 1);
             i0.ɵɵelementEnd();
@@ -2019,13 +2024,13 @@ class InlineMessageComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(InlineMessageComponent, [{
         type: Component,
-        args: [{ selector: 'lib-inline-message', template: "<div class=\"tld-inline-message {{message.type}}\">\r\n  <span class=\"material-icons\" [class.order-end]=\"message.iconPosition === END_ICON_POSITION\"\r\n    [matTooltip]=\"message.iconTooltip? (message.iconTooltip | translate: message.localizationParams) : ''\" *ngIf=\"iconName\">{{iconName}}</span>\r\n  <section *ngIf=\"message\">\r\n    <div class=\"text-s-semi-bold title\" *ngIf=\"message.title\"\r\n      [innerHtml]=\"message.title | translate: message.localizationParams\">\r\n    </div>\r\n    <p class=\"text-s description\" *ngIf=\"message.description\" [innerHtml]=\"message.description | translate:\r\n    message.localizationParams\"></p>\r\n  </section>\r\n</div>", styles: [":host{display:block}.tld-inline-message{display:flex;flex-direction:row}.tld-inline-message.error .material-icons{color:var(--error-dark)}.tld-inline-message.info .material-icons{color:var(--base-40)}.tld-inline-message.warning .material-icons{color:var(--warning-dark)}.tld-inline-message .material-icons{font-size:16px;margin-right:.5rem;display:inline-block}.tld-inline-message .material-icons.order-end{order:2}.tld-inline-message .title,.tld-inline-message .description{margin:0}.tld-inline-message .title+.description{margin-top:.5rem}\n"] }]
+        args: [{ selector: 'lib-inline-message', standalone: false, template: "<div class=\"tld-inline-message {{message.type}}\">\r\n  <span class=\"material-icons\" [class.order-end]=\"message.iconPosition === END_ICON_POSITION\"\r\n    [matTooltip]=\"message.iconTooltip? (message.iconTooltip | translate: message.localizationParams) : ''\" *ngIf=\"iconName\">{{iconName}}</span>\r\n  <section *ngIf=\"message\">\r\n    <div class=\"text-s-semi-bold title\" *ngIf=\"message.title\"\r\n      [innerHtml]=\"message.title | translate: message.localizationParams\">\r\n    </div>\r\n    <p class=\"text-s description\" *ngIf=\"message.description\" [innerHtml]=\"message.description | translate:\r\n    message.localizationParams\"></p>\r\n  </section>\r\n</div>", styles: [":host{display:block}.tld-inline-message{display:flex;flex-direction:row}.tld-inline-message.error .material-icons{color:var(--error-dark)}.tld-inline-message.info .material-icons{color:var(--base-40)}.tld-inline-message.warning .material-icons{color:var(--warning-dark)}.tld-inline-message .material-icons{font-size:16px;margin-right:.5rem;display:inline-block}.tld-inline-message .material-icons.order-end{order:2}.tld-inline-message .title,.tld-inline-message .description{margin:0}.tld-inline-message .title+.description{margin-top:.5rem}\n"] }]
     }], null, { iconName: [{
             type: Input
         }], message: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InlineMessageComponent, { className: "InlineMessageComponent", filePath: "lib\\inline-message\\inline-message.component.ts", lineNumber: 10 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InlineMessageComponent, { className: "InlineMessageComponent", filePath: "lib/inline-message/inline-message.component.ts", lineNumber: 11 }); })();
 
 class InlineMessageModule {
     static { this.ɵfac = function InlineMessageModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || InlineMessageModule)(); }; }
@@ -2075,13 +2080,14 @@ class ClickOutsideDirective {
     static { this.ɵfac = function ClickOutsideDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ClickOutsideDirective)(i0.ɵɵdirectiveInject(i0.ElementRef)); }; }
     static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: ClickOutsideDirective, selectors: [["", "clickOutside", ""]], hostBindings: function ClickOutsideDirective_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("click", function ClickOutsideDirective_click_HostBindingHandler($event) { return ctx.onClick($event.target); }, false, i0.ɵɵresolveDocument);
-        } }, outputs: { clickOutside: "clickOutside" } }); }
+        } }, outputs: { clickOutside: "clickOutside" }, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ClickOutsideDirective, [{
         type: Directive,
         args: [{
                 // eslint-disable-next-line @angular-eslint/directive-selector
-                selector: '[clickOutside]'
+                selector: '[clickOutside]',
+                standalone: false
             }]
     }], () => [{ type: i0.ElementRef }], { clickOutside: [{
             type: Output
@@ -2151,13 +2157,14 @@ class DragAndDropDirective {
             i0.ɵɵlistener("dragover", function DragAndDropDirective_dragover_HostBindingHandler($event) { return ctx.onDragOver($event); })("dragleave", function DragAndDropDirective_dragleave_HostBindingHandler($event) { return ctx.onDragLeave($event); })("drop", function DragAndDropDirective_drop_HostBindingHandler($event) { return ctx.ondrop($event); });
         } if (rf & 2) {
             i0.ɵɵclassProp("tld-file-over", ctx.active);
-        } }, outputs: { fileDropped: "fileDropped" } }); }
+        } }, outputs: { fileDropped: "fileDropped" }, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DragAndDropDirective, [{
         type: Directive,
         args: [{
                 // eslint-disable-next-line @angular-eslint/directive-selector
-                selector: '[tldDragAndDrop]'
+                selector: '[tldDragAndDrop]',
+                standalone: false
             }]
     }], () => [{ type: i0.ElementRef }], { active: [{
             type: HostBinding,
@@ -2239,7 +2246,7 @@ class MatButtonLoadingDirective {
         }
     }
     static { this.ɵfac = function MatButtonLoadingDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MatButtonLoadingDirective)(i0.ɵɵdirectiveInject(i2$1.MatButton), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(i0.Renderer2)); }; }
-    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: MatButtonLoadingDirective, selectors: [["button", "mat-button", "", "loading", ""], ["button", "mat-raised-button", "", "loading", ""], ["button", "mat-icon-button", "", "loading", ""], ["button", "mat-fab", "", "loading", ""], ["button", "mat-mini-fab", "", "loading", ""], ["button", "mat-stroked-button", "", "loading", ""], ["button", "mat-flat-button", "", "loading", ""]], inputs: { loading: "loading" } }); }
+    static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: MatButtonLoadingDirective, selectors: [["button", "mat-button", "", "loading", ""], ["button", "mat-raised-button", "", "loading", ""], ["button", "mat-icon-button", "", "loading", ""], ["button", "mat-fab", "", "loading", ""], ["button", "mat-mini-fab", "", "loading", ""], ["button", "mat-stroked-button", "", "loading", ""], ["button", "mat-flat-button", "", "loading", ""]], inputs: { loading: "loading" }, standalone: false }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MatButtonLoadingDirective, [{
         type: Directive,
@@ -2251,7 +2258,8 @@ class MatButtonLoadingDirective {
   button[mat-fab][loading],
   button[mat-mini-fab][loading],
   button[mat-stroked-button][loading],
-  button[mat-flat-button][loading]`
+  button[mat-flat-button][loading]`,
+                standalone: false
             }]
     }], () => [{ type: i2$1.MatButton }, { type: i0.ViewContainerRef }, { type: i0.Renderer2 }], { loading: [{
             type: Input
@@ -2276,7 +2284,7 @@ class MatButtonLoadingModule {
 
 class TldLoaderComponent {
     static { this.ɵfac = function TldLoaderComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TldLoaderComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TldLoaderComponent, selectors: [["lib-tld-loader"]], decls: 4, vars: 0, consts: [["fxLayout", "row", "fxLayoutGap", "10px", 1, "tld-loader", "accent-color"], [1, "accent-bg-color", "tld-loader-element", "element-1"], [1, "accent-bg-color", "tld-loader-element", "element-2"], [1, "accent-bg-color", "tld-loader-element", "element-3"]], template: function TldLoaderComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TldLoaderComponent, selectors: [["lib-tld-loader"]], standalone: false, decls: 4, vars: 0, consts: [["fxLayout", "row", "fxLayoutGap", "10px", 1, "tld-loader", "accent-color"], [1, "accent-bg-color", "tld-loader-element", "element-1"], [1, "accent-bg-color", "tld-loader-element", "element-2"], [1, "accent-bg-color", "tld-loader-element", "element-3"]], template: function TldLoaderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵelement(1, "div", 1)(2, "div", 2)(3, "div", 3);
             i0.ɵɵelementEnd();
@@ -2284,9 +2292,9 @@ class TldLoaderComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TldLoaderComponent, [{
         type: Component,
-        args: [{ selector: 'lib-tld-loader', template: "<div class=\"tld-loader accent-color\" fxLayout=\"row\" fxLayoutGap=\"10px\">\r\n  <div class=\"accent-bg-color tld-loader-element element-1\"></div>\r\n  <div class=\"accent-bg-color tld-loader-element element-2\"></div>\r\n  <div class=\"accent-bg-color tld-loader-element element-3\"></div>\r\n</div>\r\n", styles: [".tld-loader .tld-loader-element{will-change:transform;border-radius:50%;animation:grow .6s ease-in-out infinite alternate;width:24px;height:24px}.tld-loader .tld-loader-element.element-2{animation-delay:.2s}.tld-loader .tld-loader-element.element-3{animation-delay:.4s}@keyframes grow{to{transform:translate(-50%) scale(0)}}\n"] }]
+        args: [{ selector: 'lib-tld-loader', standalone: false, template: "<div class=\"tld-loader accent-color\" fxLayout=\"row\" fxLayoutGap=\"10px\">\r\n  <div class=\"accent-bg-color tld-loader-element element-1\"></div>\r\n  <div class=\"accent-bg-color tld-loader-element element-2\"></div>\r\n  <div class=\"accent-bg-color tld-loader-element element-3\"></div>\r\n</div>\r\n", styles: [".tld-loader .tld-loader-element{will-change:transform;border-radius:50%;animation:grow .6s ease-in-out infinite alternate;width:24px;height:24px}.tld-loader .tld-loader-element.element-2{animation-delay:.2s}.tld-loader .tld-loader-element.element-3{animation-delay:.4s}@keyframes grow{to{transform:translate(-50%) scale(0)}}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TldLoaderComponent, { className: "TldLoaderComponent", filePath: "lib\\tld-loader\\tld-loader.component.ts", lineNumber: 8 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TldLoaderComponent, { className: "TldLoaderComponent", filePath: "lib/tld-loader/tld-loader.component.ts", lineNumber: 9 }); })();
 
 class TldLoaderModule {
     static { this.ɵfac = function TldLoaderModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TldLoaderModule)(); }; }
@@ -2312,7 +2320,7 @@ class CompanyProductComponent {
         this.product = "";
     }
     static { this.ɵfac = function CompanyProductComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CompanyProductComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CompanyProductComponent, selectors: [["lib-company-product"]], inputs: { company: "company", product: "product" }, decls: 6, vars: 4, consts: [["fxHide.lt-md", "", 1, "tilde-product-title"], [1, "company"], [1, "product"]], template: function CompanyProductComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CompanyProductComponent, selectors: [["lib-company-product"]], inputs: { company: "company", product: "product" }, standalone: false, decls: 6, vars: 4, consts: [["fxHide.lt-md", "", 1, "tilde-product-title"], [1, "company"], [1, "product"]], template: function CompanyProductComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "span", 1);
             i0.ɵɵtext(2);
             i0.ɵɵpipe(3, "uppercase");
@@ -2329,13 +2337,13 @@ class CompanyProductComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CompanyProductComponent, [{
         type: Component,
-        args: [{ selector: 'lib-company-product', template: "<div fxHide.lt-md class=\"tilde-product-title\">\r\n    <span class=\"company\">\r\n        {{company | uppercase}}\r\n    </span>\r\n    <span class=\"product\">\r\n        {{product}}\r\n    </span>\r\n</div>", styles: [".tilde-product-title{font-family:Roboto;text-decoration:none!important}.tilde-product-title .company{font-weight:700;font-size:.75rem;line-height:1rem;color:#616e7c;letter-spacing:1px;display:block}.tilde-product-title .product{font-weight:500;font-size:1.25rem;line-height:1.5rem;color:#1f2933;display:block}\n"] }]
+        args: [{ selector: 'lib-company-product', standalone: false, template: "<div fxHide.lt-md class=\"tilde-product-title\">\r\n    <span class=\"company\">\r\n        {{company | uppercase}}\r\n    </span>\r\n    <span class=\"product\">\r\n        {{product}}\r\n    </span>\r\n</div>", styles: [".tilde-product-title{font-family:Roboto;text-decoration:none!important}.tilde-product-title .company{font-weight:700;font-size:.75rem;line-height:1rem;color:#616e7c;letter-spacing:1px;display:block}.tilde-product-title .product{font-weight:500;font-size:1.25rem;line-height:1.5rem;color:#1f2933;display:block}\n"] }]
     }], null, { company: [{
             type: Input
         }], product: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CompanyProductComponent, { className: "CompanyProductComponent", filePath: "lib\\company-product\\company-product.component.ts", lineNumber: 8 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CompanyProductComponent, { className: "CompanyProductComponent", filePath: "lib/company-product/company-product.component.ts", lineNumber: 9 }); })();
 
 class CompanyProductModule {
     static { this.ɵfac = function CompanyProductModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CompanyProductModule)(); }; }
@@ -2463,7 +2471,7 @@ class FooterComponent {
         }
     }
     static { this.ɵfac = function FooterComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FooterComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FooterComponent, selectors: [["tld-footer"]], inputs: { privacyRoute: "privacyRoute", termsOfUseRoute: "termsOfUseRoute", contactUsRoute: "contactUsRoute", baseUrl: "baseUrl" }, decls: 9, vars: 8, consts: [["localRoutes", ""], ["fxLayout", "row", 1, "text-m"], ["fxFlex", "", "fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutAlign.xs", "center center", "fxLayout.xs", "column", "fxLayoutGap", "16px"], ["fxLayoutGap", "1rem"], [4, "ngIf", "ngIfElse"], ["class", "semi-bold", "target", "_blank", 4, "ngIf"], ["class", "semi-bold", 3, "routerLink", 4, "ngIf"], ["target", "_blank", 1, "semi-bold"], [1, "semi-bold", 3, "routerLink"]], template: function FooterComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FooterComponent, selectors: [["tld-footer"]], inputs: { privacyRoute: "privacyRoute", termsOfUseRoute: "termsOfUseRoute", contactUsRoute: "contactUsRoute", baseUrl: "baseUrl" }, standalone: false, decls: 9, vars: 8, consts: [["localRoutes", ""], ["fxLayout", "row", 1, "text-m"], ["fxFlex", "", "fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutAlign.xs", "center center", "fxLayout.xs", "column", "fxLayoutGap", "16px"], ["fxLayoutGap", "1rem"], [4, "ngIf", "ngIfElse"], ["class", "semi-bold", "target", "_blank", 4, "ngIf"], ["class", "semi-bold", 3, "routerLink", 4, "ngIf"], ["target", "_blank", 1, "semi-bold"], [1, "semi-bold", 3, "routerLink"]], template: function FooterComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "footer", 1)(1, "div", 2)(2, "div");
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "translate");
@@ -2481,7 +2489,7 @@ class FooterComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FooterComponent, [{
         type: Component,
-        args: [{ selector: 'tld-footer', template: "<footer fxLayout=\"row\" class=\"text-m\">\r\n  <div fxFlex fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutAlign.xs=\"center center\" fxLayout.xs=\"column\"\r\n    fxLayoutGap=\"16px\">\r\n    <div>\r\n      {{ 'FOOTER.TITLE' | translate: {currentYear: currentYear} }}\r\n    </div>\r\n    <div fxLayoutGap=\"1rem\">\r\n      <ng-container *ngIf=\"baseUrl; else localRoutes\">\r\n        <a class=\"semi-bold\" *ngIf=\"termsOfUseRoute\" [attr.href]=\"termsOfUseRoute\" target=\"_blank\"> {{\r\n          'FOOTER.TERMS_OF_USE' |\r\n          translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"privacyRoute\" [attr.href]=\"privacyRoute\" target=\"_blank\"> {{ 'FOOTER.PRIVACY'\r\n          | translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"contactUsRoute\" [routerLink]=\"[contactUsRoute]\"> {{ 'FOOTER.CONTACT_US'| translate\r\n          }}</a>\r\n\r\n      </ng-container>\r\n      <ng-template #localRoutes>\r\n        <a class=\"semi-bold\" *ngIf=\"termsOfUseRoute\" [routerLink]=\"[termsOfUseRoute]\"> {{ 'FOOTER.TERMS_OF_USE' |\r\n          translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"privacyRoute\" [routerLink]=\"[privacyRoute]\"> {{ 'FOOTER.PRIVACY'| translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"contactUsRoute\" [routerLink]=\"[contactUsRoute]\"> {{ 'FOOTER.CONTACT_US'| translate\r\n          }}</a>\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n</footer>\r\n", styles: [":host footer{color:var(--base-30);padding:1rem 2rem;margin-bottom:0;border-top:1px solid var(--base-70);margin-top:1rem}:host footer a{color:var(--base-30);text-decoration:none}:host footer a:hover{color:var(--base-30);text-decoration:underline}\n"] }]
+        args: [{ selector: 'tld-footer', standalone: false, template: "<footer fxLayout=\"row\" class=\"text-m\">\r\n  <div fxFlex fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutAlign.xs=\"center center\" fxLayout.xs=\"column\"\r\n    fxLayoutGap=\"16px\">\r\n    <div>\r\n      {{ 'FOOTER.TITLE' | translate: {currentYear: currentYear} }}\r\n    </div>\r\n    <div fxLayoutGap=\"1rem\">\r\n      <ng-container *ngIf=\"baseUrl; else localRoutes\">\r\n        <a class=\"semi-bold\" *ngIf=\"termsOfUseRoute\" [attr.href]=\"termsOfUseRoute\" target=\"_blank\"> {{\r\n          'FOOTER.TERMS_OF_USE' |\r\n          translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"privacyRoute\" [attr.href]=\"privacyRoute\" target=\"_blank\"> {{ 'FOOTER.PRIVACY'\r\n          | translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"contactUsRoute\" [routerLink]=\"[contactUsRoute]\"> {{ 'FOOTER.CONTACT_US'| translate\r\n          }}</a>\r\n\r\n      </ng-container>\r\n      <ng-template #localRoutes>\r\n        <a class=\"semi-bold\" *ngIf=\"termsOfUseRoute\" [routerLink]=\"[termsOfUseRoute]\"> {{ 'FOOTER.TERMS_OF_USE' |\r\n          translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"privacyRoute\" [routerLink]=\"[privacyRoute]\"> {{ 'FOOTER.PRIVACY'| translate }}</a>\r\n        <a class=\"semi-bold\" *ngIf=\"contactUsRoute\" [routerLink]=\"[contactUsRoute]\"> {{ 'FOOTER.CONTACT_US'| translate\r\n          }}</a>\r\n      </ng-template>\r\n    </div>\r\n  </div>\r\n</footer>\r\n", styles: [":host footer{color:var(--base-30);padding:1rem 2rem;margin-bottom:0;border-top:1px solid var(--base-70);margin-top:1rem}:host footer a{color:var(--base-30);text-decoration:none}:host footer a:hover{color:var(--base-30);text-decoration:underline}\n"] }]
     }], () => [], { privacyRoute: [{
             type: Input
         }], termsOfUseRoute: [{
@@ -2491,7 +2499,7 @@ class FooterComponent {
         }], baseUrl: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FooterComponent, { className: "FooterComponent", filePath: "lib\\footer\\footer.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FooterComponent, { className: "FooterComponent", filePath: "lib/footer/footer.component.ts", lineNumber: 10 }); })();
 
 class FooterModule {
     static { this.ɵfac = function FooterModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FooterModule)(); }; }
@@ -2883,7 +2891,7 @@ class ExtensionDialogComponent {
         this.undescribedExtensions = extensions;
     }
     static { this.ɵfac = function ExtensionDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ExtensionDialogComponent)(i0.ɵɵdirectiveInject(MAT_DIALOG_DATA), i0.ɵɵdirectiveInject(IconService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ExtensionDialogComponent, selectors: [["lib-extension-dialog"]], decls: 10, vars: 8, consts: [["mat-dialog-close", "", 1, "close"], ["mat-dialog-title", "", 1, "text-2-xl"], [1, "description"], ["mat-dialog-content", ""], ["fxLayout", "row", "fxLayout.lt-md", "column", 3, "ngClass.lt-md"], [4, "ngFor", "ngForOf"], ["class", "category", 4, "ngIf"], [1, "category"], [1, "category-title"], ["fxLayout", "row"], ["class", "extension-column", 4, "ngFor", "ngForOf"], [1, "extension-column"], [4, "ngIf"], ["fxLayoutAlign", "start center", 4, "ngIf"], ["fxLayoutAlign", "start center"], ["aria-hidden", "false", 3, "svgIcon"]], template: function ExtensionDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ExtensionDialogComponent, selectors: [["lib-extension-dialog"]], standalone: false, decls: 10, vars: 8, consts: [["mat-dialog-close", "", 1, "close"], ["mat-dialog-title", "", 1, "text-2-xl"], [1, "description"], ["mat-dialog-content", ""], ["fxLayout", "row", "fxLayout.lt-md", "column", 3, "ngClass.lt-md"], [4, "ngFor", "ngForOf"], ["class", "category", 4, "ngIf"], [1, "category"], [1, "category-title"], ["fxLayout", "row"], ["class", "extension-column", 4, "ngFor", "ngForOf"], [1, "extension-column"], [4, "ngIf"], ["fxLayoutAlign", "start center", 4, "ngIf"], ["fxLayoutAlign", "start center"], ["aria-hidden", "false", 3, "svgIcon"]], template: function ExtensionDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelement(0, "tld-close-button", 0);
             i0.ɵɵelementStart(1, "h1", 1);
             i0.ɵɵtext(2);
@@ -2909,12 +2917,12 @@ class ExtensionDialogComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ExtensionDialogComponent, [{
         type: Component,
-        args: [{ selector: 'lib-extension-dialog', template: "<tld-close-button class=\"close\" mat-dialog-close></tld-close-button>\r\n<h1 mat-dialog-title class=\"text-2-xl\">{{'EXTENSION_POPUP.TITLE' | translate}}</h1>\r\n<p class=\"description\">{{'EXTENSION_POPUP.DESCRIPTION' | translate}}</p>\r\n\r\n<div mat-dialog-content>\r\n    <div fxLayout=\"row\" fxLayout.lt-md=\"column\"  [ngClass.lt-md]=\"'small-screen'\">\r\n      <ng-container *ngFor=\"let category of config.elements\">\r\n        <div *ngIf=\"category.anyVisible\" class=\"category\">\r\n          <h2 class=\"category-title\">\r\n            {{ 'EXTENSION_POPUP.' + category.category | translate }}\r\n          </h2>\r\n          <div fxLayout=\"row\">\r\n            <div *ngFor=\"let column of category.columns\" class=\"extension-column\">\r\n              <ul *ngIf=\"column.anyVisible\">\r\n                <ng-container *ngFor=\"let extension of column.extensions\">\r\n                  <li *ngIf=\"extension.visible\" fxLayoutAlign=\"start center\">\r\n                    <mat-icon svgIcon=\"{{ extension.icon }}\" aria-hidden=\"false\"[attr.aria-label]=\"extension.extension\"></mat-icon>\r\n                    <span>{{ extension.extension }}</span>\r\n                  </li>\r\n                </ng-container>\r\n              </ul>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n    </div>\r\n</div>\r\n", styles: [".description{color:var(--base-40);margin:6px 24px 12px}[mat-dialog-content]{position:relative}[mat-dialog-content] ul{list-style-type:none;margin:0;padding:0}[mat-dialog-content] ul li+li{margin-top:.5em}[mat-dialog-content] .category-title{border-bottom:1px solid var(--base-70);font-size:.875em;font-weight:600;text-align:center;white-space:nowrap;margin-bottom:12px}[mat-dialog-content] .extension-column{font-size:.875em;line-height:1.25em}[mat-dialog-content] .extension-column+.extension-column{margin-left:1em}[mat-dialog-content] :not(.small-screen) .category+.category{margin-left:3em}[mat-dialog-content] mat-icon{width:20px;height:20px}\n"] }]
+        args: [{ selector: 'lib-extension-dialog', standalone: false, template: "<tld-close-button class=\"close\" mat-dialog-close></tld-close-button>\r\n<h1 mat-dialog-title class=\"text-2-xl\">{{'EXTENSION_POPUP.TITLE' | translate}}</h1>\r\n<p class=\"description\">{{'EXTENSION_POPUP.DESCRIPTION' | translate}}</p>\r\n\r\n<div mat-dialog-content>\r\n    <div fxLayout=\"row\" fxLayout.lt-md=\"column\"  [ngClass.lt-md]=\"'small-screen'\">\r\n      <ng-container *ngFor=\"let category of config.elements\">\r\n        <div *ngIf=\"category.anyVisible\" class=\"category\">\r\n          <h2 class=\"category-title\">\r\n            {{ 'EXTENSION_POPUP.' + category.category | translate }}\r\n          </h2>\r\n          <div fxLayout=\"row\">\r\n            <div *ngFor=\"let column of category.columns\" class=\"extension-column\">\r\n              <ul *ngIf=\"column.anyVisible\">\r\n                <ng-container *ngFor=\"let extension of column.extensions\">\r\n                  <li *ngIf=\"extension.visible\" fxLayoutAlign=\"start center\">\r\n                    <mat-icon svgIcon=\"{{ extension.icon }}\" aria-hidden=\"false\"[attr.aria-label]=\"extension.extension\"></mat-icon>\r\n                    <span>{{ extension.extension }}</span>\r\n                  </li>\r\n                </ng-container>\r\n              </ul>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </ng-container>\r\n    </div>\r\n</div>\r\n", styles: [".description{color:var(--base-40);margin:6px 24px 12px}[mat-dialog-content]{position:relative}[mat-dialog-content] ul{list-style-type:none;margin:0;padding:0}[mat-dialog-content] ul li+li{margin-top:.5em}[mat-dialog-content] .category-title{border-bottom:1px solid var(--base-70);font-size:.875em;font-weight:600;text-align:center;white-space:nowrap;margin-bottom:12px}[mat-dialog-content] .extension-column{font-size:.875em;line-height:1.25em}[mat-dialog-content] .extension-column+.extension-column{margin-left:1em}[mat-dialog-content] :not(.small-screen) .category+.category{margin-left:3em}[mat-dialog-content] mat-icon{width:20px;height:20px}\n"] }]
     }], () => [{ type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
             }] }, { type: IconService }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ExtensionDialogComponent, { className: "ExtensionDialogComponent", filePath: "lib\\extension-dialog\\extension-dialog.component.ts", lineNumber: 17 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ExtensionDialogComponent, { className: "ExtensionDialogComponent", filePath: "lib/extension-dialog/extension-dialog.component.ts", lineNumber: 18 }); })();
 
 class ExtensionDialogService {
     constructor(dialog) {
@@ -2943,7 +2951,7 @@ class OpenExtensionDialogComponent {
         this.service.open(this.extensions);
     }
     static { this.ɵfac = function OpenExtensionDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OpenExtensionDialogComponent)(i0.ɵɵdirectiveInject(ExtensionDialogService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OpenExtensionDialogComponent, selectors: [["lib-open-extension-dialog"]], inputs: { extensions: "extensions" }, decls: 3, vars: 3, consts: [["type", "button", 1, "open-extension-popup", "btn-as-link", 3, "click"]], template: function OpenExtensionDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: OpenExtensionDialogComponent, selectors: [["lib-open-extension-dialog"]], inputs: { extensions: "extensions" }, standalone: false, decls: 3, vars: 3, consts: [["type", "button", 1, "open-extension-popup", "btn-as-link", 3, "click"]], template: function OpenExtensionDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "button", 0);
             i0.ɵɵlistener("click", function OpenExtensionDialogComponent_Template_button_click_0_listener() { return ctx.open(); });
             i0.ɵɵtext(1);
@@ -2956,11 +2964,11 @@ class OpenExtensionDialogComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OpenExtensionDialogComponent, [{
         type: Component,
-        args: [{ selector: 'lib-open-extension-dialog', template: "<button type=\"button\" class=\"open-extension-popup btn-as-link\" (click)=\"open()\">\r\n    {{'EXTENSION_POPUP.OPEN' | translate}}\r\n</button>", styles: ["button.open-extension-popup{font-size:.875em}\n"] }]
+        args: [{ selector: 'lib-open-extension-dialog', standalone: false, template: "<button type=\"button\" class=\"open-extension-popup btn-as-link\" (click)=\"open()\">\r\n    {{'EXTENSION_POPUP.OPEN' | translate}}\r\n</button>", styles: ["button.open-extension-popup{font-size:.875em}\n"] }]
     }], () => [{ type: ExtensionDialogService }], { extensions: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OpenExtensionDialogComponent, { className: "OpenExtensionDialogComponent", filePath: "lib\\extension-dialog\\components\\open-extension-dialog\\open-extension-dialog.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OpenExtensionDialogComponent, { className: "OpenExtensionDialogComponent", filePath: "lib/extension-dialog/components/open-extension-dialog/open-extension-dialog.component.ts", lineNumber: 10 }); })();
 
 class ExtensionDialogModule {
     static { this.ɵfac = function ExtensionDialogModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ExtensionDialogModule)(); }; }
@@ -3185,7 +3193,7 @@ class FileUploadComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.fileInput = _t.first);
-        } }, inputs: { accept: "accept", useCompactUpload: "useCompactUpload", maxSize: "maxSize", multiple: "multiple", filePreviewProgress: "filePreviewProgress", allowEmpty: "allowEmpty", disabled: "disabled", dragZoneLabel: "dragZoneLabel", uploadIconName: "uploadIconName", uploadButtonLabel: "uploadButtonLabel", openExtensionPopupLabel: "openExtensionPopupLabel", minSupportedFormatCount: "minSupportedFormatCount", extendedAcceptList: "extendedAcceptList" }, outputs: { fileChange: "fileChange", errorEvent: "errorEvent" }, ngContentSelectors: _c1$5, decls: 7, vars: 9, consts: [["regularUpload", ""], ["fileInput", ""], ["inputButton", ""], [1, "file-upload", 3, "ngClass.lt-sm"], ["color", "primary", "class", "tld-file-upload-progress", 3, "value", 4, "ngIf"], [4, "ngIf", "ngIfElse"], ["type", "file", "name", "files", 1, "native-file-input", 3, "change", "accept", "multiple", "disabled"], ["color", "primary", 1, "tld-file-upload-progress", 3, "value"], ["tldDragAndDrop", "", "mat-button", "", "type", "button", 1, "upload-button", "text-l", 3, "fileDropped", "click", "disabled"], [4, "ngIf"], ["tldDragAndDrop", "", 1, "upload-zone", 3, "fileDropped"], ["svgIcon", "file_upload_icon"], [1, "upload-zone-labels"], ["color", "accent", 1, "file-upload--btn", 3, "click"], ["fxHide.lt-sm", "", 1, "upload-label", 3, "innerHTML"], [1, "upload-zone-formats"], [4, "ngFor", "ngForOf"], [3, "innerHTML", 4, "ngIf"], [1, "supported-formats-btn"], [3, "innerHTML"], [1, "supported-formats-btn", 3, "click"]], template: function FileUploadComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { accept: "accept", useCompactUpload: "useCompactUpload", maxSize: "maxSize", multiple: "multiple", filePreviewProgress: "filePreviewProgress", allowEmpty: "allowEmpty", disabled: "disabled", dragZoneLabel: "dragZoneLabel", uploadIconName: "uploadIconName", uploadButtonLabel: "uploadButtonLabel", openExtensionPopupLabel: "openExtensionPopupLabel", minSupportedFormatCount: "minSupportedFormatCount", extendedAcceptList: "extendedAcceptList" }, outputs: { fileChange: "fileChange", errorEvent: "errorEvent" }, standalone: false, ngContentSelectors: _c1$5, decls: 7, vars: 9, consts: [["regularUpload", ""], ["fileInput", ""], ["inputButton", ""], [1, "file-upload", 3, "ngClass.lt-sm"], ["color", "primary", "class", "tld-file-upload-progress", 3, "value", 4, "ngIf"], [4, "ngIf", "ngIfElse"], ["type", "file", "name", "files", 1, "native-file-input", 3, "change", "accept", "multiple", "disabled"], ["color", "primary", 1, "tld-file-upload-progress", 3, "value"], ["tldDragAndDrop", "", "mat-button", "", "type", "button", 1, "upload-button", "text-l", 3, "fileDropped", "click", "disabled"], [4, "ngIf"], ["tldDragAndDrop", "", 1, "upload-zone", 3, "fileDropped"], ["svgIcon", "file_upload_icon"], [1, "upload-zone-labels"], ["color", "accent", 1, "file-upload--btn", 3, "click"], ["fxHide.lt-sm", "", 1, "upload-label", 3, "innerHTML"], [1, "upload-zone-formats"], [4, "ngFor", "ngForOf"], [3, "innerHTML", 4, "ngIf"], [1, "supported-formats-btn"], [3, "innerHTML"], [1, "supported-formats-btn", 3, "click"]], template: function FileUploadComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 3);
@@ -3207,7 +3215,7 @@ class FileUploadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FileUploadComponent, [{
         type: Component,
-        args: [{ selector: 'lib-file-upload', template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\" [class.disabled]=\"disabled\">\r\n  <mat-progress-bar \r\n    *ngIf=\"filePreviewProgress\"\r\n    color=\"primary\" \r\n    class=\"tld-file-upload-progress\" \r\n    [value]=\"filePreviewProgress\"\r\n    >\r\n  </mat-progress-bar>\r\n\r\n  <ng-container *ngIf=\"useCompactUpload; else regularUpload\">\r\n    <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n      (click)=\"fileInput.click()\" class=\"upload-button text-l\"\r\n    >\r\n      <mat-icon *ngIf=\"uploadIconName\">{{uploadIconName}}</mat-icon>\r\n      <ng-content></ng-content>\r\n    </button>\r\n  </ng-container>\r\n\r\n  <ng-template #regularUpload>\r\n    <div class=\"upload-zone\" tldDragAndDrop (fileDropped)=\"onFileDrop($event)\" [class.disabled-upload-zone]=\"disabled\">\r\n      <mat-icon svgIcon=\"file_upload_icon\"></mat-icon>\r\n\r\n  \r\n      <div class=\"upload-zone-labels\">\r\n        <a color=\"accent\" class=\"file-upload--btn\" (click)=\"fileInput.click()\">{{ uploadButtonLabel }}</a>\r\n        \r\n        <span fxHide.lt-sm class=\"upload-label\" [innerHTML]=\"dragZoneLabel\"></span>\r\n  \r\n        <p class=\"upload-zone-formats\">\r\n          (<span *ngFor=\"let format of accept; let i = index\"\r\n            >{{ format\r\n            }}{{ accept.length - 1 === i ? \".\" : \", \" }}</span\r\n          >\r\n\r\n          <span *ngIf=\"maxSize\" [innerHTML]=\"'FILE_UPLOAD.LIMITS_MB' | translate: { maxSize: maxSizeLabel }\"></span>)\r\n        </p>\r\n  \r\n        @if (accept.length > minSupportedFormatCount) {\r\n          <a class=\"supported-formats-btn\" (click)=\"openSupportedFormatModal()\">{{openExtensionPopupLabel}}</a>\r\n        }\r\n      </div>\r\n    </div>\r\n</ng-template>\r\n\r\n<input \r\n  #fileInput \r\n  type=\"file\" \r\n  name=\"files\" \r\n  class=\"native-file-input\"\r\n  [accept]=\"allowedExtensions\" \r\n  [multiple]=\"multiple\" \r\n  [disabled]=\"disabled\"\r\n  (change)=\"handleFileInput($event)\" \r\n/>\r\n", styles: [":host{width:100%}.file-upload{display:flex;flex-direction:column;justify-content:center;text-align:center}.file-upload .upload-button,.file-upload .upload-zone{display:flex;border-radius:16px;border:1px dashed var(--base-65)}.file-upload .upload-button{justify-content:start;min-height:52px;overflow:hidden;padding:16px!important}.file-upload .upload-zone{flex-direction:column;justify-content:center;align-items:center;width:100%;padding:42px 0}.file-upload .upload-zone-labels{margin-top:10px;font-size:16px;font-weight:600;line-height:24px;text-align:center}.file-upload .upload-zone-labels .upload-zone-formats{font-weight:400}.file-upload .supported-formats-btn{cursor:pointer;color:var(--accent);font-weight:400}.file-upload .disabled-upload-zone{cursor:not-allowed}.file-upload .file-upload--btn,.file-upload .upload-label:not(.file-upload-mobile){margin-top:10px}.file-upload .file-upload--btn{cursor:pointer;align-self:center;max-width:fit-content;color:var(--accent)}.file-upload .file-upload--btn:hover{text-decoration:underline}.file-upload .upload-zone-formats{margin:10px 0 4px;color:var(--base-40)}.disabled .file-upload--btn{pointer-events:none!important;text-decoration:none!important;color:var(--base-40)}.native-file-input{display:none}\n"] }]
+        args: [{ selector: 'lib-file-upload', standalone: false, template: "<div class=\"file-upload\" [ngClass.lt-sm]=\"'file-upload-mobile'\" [class.disabled]=\"disabled\">\r\n  <mat-progress-bar \r\n    *ngIf=\"filePreviewProgress\"\r\n    color=\"primary\" \r\n    class=\"tld-file-upload-progress\" \r\n    [value]=\"filePreviewProgress\"\r\n    >\r\n  </mat-progress-bar>\r\n\r\n  <ng-container *ngIf=\"useCompactUpload; else regularUpload\">\r\n    <button tldDragAndDrop #inputButton mat-button (fileDropped)=\"onFileDrop($event)\" [disabled]=\"disabled\" type=\"button\"\r\n      (click)=\"fileInput.click()\" class=\"upload-button text-l\"\r\n    >\r\n      <mat-icon *ngIf=\"uploadIconName\">{{uploadIconName}}</mat-icon>\r\n      <ng-content></ng-content>\r\n    </button>\r\n  </ng-container>\r\n\r\n  <ng-template #regularUpload>\r\n    <div class=\"upload-zone\" tldDragAndDrop (fileDropped)=\"onFileDrop($event)\" [class.disabled-upload-zone]=\"disabled\">\r\n      <mat-icon svgIcon=\"file_upload_icon\"></mat-icon>\r\n\r\n  \r\n      <div class=\"upload-zone-labels\">\r\n        <a color=\"accent\" class=\"file-upload--btn\" (click)=\"fileInput.click()\">{{ uploadButtonLabel }}</a>\r\n        \r\n        <span fxHide.lt-sm class=\"upload-label\" [innerHTML]=\"dragZoneLabel\"></span>\r\n  \r\n        <p class=\"upload-zone-formats\">\r\n          (<span *ngFor=\"let format of accept; let i = index\"\r\n            >{{ format\r\n            }}{{ accept.length - 1 === i ? \".\" : \", \" }}</span\r\n          >\r\n\r\n          <span *ngIf=\"maxSize\" [innerHTML]=\"'FILE_UPLOAD.LIMITS_MB' | translate: { maxSize: maxSizeLabel }\"></span>)\r\n        </p>\r\n  \r\n        @if (accept.length > minSupportedFormatCount) {\r\n          <a class=\"supported-formats-btn\" (click)=\"openSupportedFormatModal()\">{{openExtensionPopupLabel}}</a>\r\n        }\r\n      </div>\r\n    </div>\r\n</ng-template>\r\n\r\n<input \r\n  #fileInput \r\n  type=\"file\" \r\n  name=\"files\" \r\n  class=\"native-file-input\"\r\n  [accept]=\"allowedExtensions\" \r\n  [multiple]=\"multiple\" \r\n  [disabled]=\"disabled\"\r\n  (change)=\"handleFileInput($event)\" \r\n/>\r\n", styles: [":host{width:100%}.file-upload{display:flex;flex-direction:column;justify-content:center;text-align:center}.file-upload .upload-button,.file-upload .upload-zone{display:flex;border-radius:16px;border:1px dashed var(--base-65)}.file-upload .upload-button{justify-content:start;min-height:52px;overflow:hidden;padding:16px!important}.file-upload .upload-zone{flex-direction:column;justify-content:center;align-items:center;width:100%;padding:42px 0}.file-upload .upload-zone-labels{margin-top:10px;font-size:16px;font-weight:600;line-height:24px;text-align:center}.file-upload .upload-zone-labels .upload-zone-formats{font-weight:400}.file-upload .supported-formats-btn{cursor:pointer;color:var(--accent);font-weight:400}.file-upload .disabled-upload-zone{cursor:not-allowed}.file-upload .file-upload--btn,.file-upload .upload-label:not(.file-upload-mobile){margin-top:10px}.file-upload .file-upload--btn{cursor:pointer;align-self:center;max-width:fit-content;color:var(--accent)}.file-upload .file-upload--btn:hover{text-decoration:underline}.file-upload .upload-zone-formats{margin:10px 0 4px;color:var(--base-40)}.disabled .file-upload--btn{pointer-events:none!important;text-decoration:none!important;color:var(--base-40)}.native-file-input{display:none}\n"] }]
     }], () => [], { fileInput: [{
             type: ViewChild,
             args: ['fileInput']
@@ -3242,7 +3250,7 @@ class FileUploadComponent {
         }], extendedAcceptList: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FileUploadComponent, { className: "FileUploadComponent", filePath: "lib\\file-upload\\file-upload.component.ts", lineNumber: 15 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FileUploadComponent, { className: "FileUploadComponent", filePath: "lib/file-upload/file-upload.component.ts", lineNumber: 16 }); })();
 
 class FileUploadModule {
     static { this.ɵfac = function FileUploadModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FileUploadModule)(); }; }
@@ -3286,10 +3294,10 @@ class FileUploadModule {
 
 const _c0$a = ["filterWrapper"];
 const _c1$4 = ["optionSearchInput"];
+const _c2$2 = a0 => ({ default: a0 });
 const _forTrack0$1 = ($index, $item) => $item.fieldName;
 const _forTrack1 = ($index, $item) => $item.key;
 const _forTrack2 = ($index, $item) => $item.value;
-const _c2$2 = a0 => ({ default: a0 });
 function FilterBarComponent_div_0_For_5_span_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 15);
     i0.ɵɵtext(1);
@@ -3653,15 +3661,15 @@ class FilterBarComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.optionSearchInputs = _t);
         } }, hostBindings: function FilterBarComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("resize", function FilterBarComponent_resize_HostBindingHandler() { return ctx.onResize(); }, false, i0.ɵɵresolveWindow);
-        } }, inputs: { settings: "settings", filterRowVisible: "filterRowVisible" }, outputs: { filterBarChange: "filterBarChange" }, decls: 1, vars: 1, consts: [["filterWrapper", ""], ["select", ""], ["optionSearchInput", ""], ["sortedValuesByProperty", ""], ["defaultCase", ""], ["class", "filter-row", 4, "ngIf"], [1, "filter-row"], ["fxLayout", "row", 1, "filter-wrapper", 3, "formGroup"], [3, "formGroup"], ["mat-stroked-button", "", "color", "accent", 1, "select-trigger-btn", 3, "filter-active"], [4, "ngIf"], ["mat-stroked-button", "", "color", "accent", 1, "select-trigger-btn", 3, "click"], [1, "select-trigger-btn-label"], ["class", "selected-count", 4, "ngIf"], ["multiple", "", 3, "openedChange", "selectionChange", "panelClass", "panelWidth", "formControlName"], [1, "selected-count"], ["type", "text", 1, "option-search-input", 3, "keyup", "keydown", "placeholder"], [4, "ngIf", "ngIfElse"], [1, "filter-option", 3, "hidden", "disabled", "value"], [1, "filter-option", 3, "disabled", "value"], [1, "filter-arrows"], ["mat-icon-button", "", 3, "click"], [1, "material-icons-outlined"]], template: function FilterBarComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { settings: "settings", filterRowVisible: "filterRowVisible" }, outputs: { filterBarChange: "filterBarChange" }, standalone: false, decls: 1, vars: 1, consts: [["filterWrapper", ""], ["select", ""], ["optionSearchInput", ""], ["sortedValuesByProperty", ""], ["defaultCase", ""], ["class", "filter-row", 4, "ngIf"], [1, "filter-row"], ["fxLayout", "row", 1, "filter-wrapper", 3, "formGroup"], [3, "formGroup"], ["mat-stroked-button", "", "color", "accent", 1, "select-trigger-btn", 3, "filter-active"], [4, "ngIf"], ["mat-stroked-button", "", "color", "accent", 1, "select-trigger-btn", 3, "click"], [1, "select-trigger-btn-label"], ["class", "selected-count", 4, "ngIf"], ["multiple", "", 3, "openedChange", "selectionChange", "panelClass", "panelWidth", "formControlName"], [1, "selected-count"], ["type", "text", 1, "option-search-input", 3, "keyup", "keydown", "placeholder"], [4, "ngIf", "ngIfElse"], [1, "filter-option", 3, "hidden", "disabled", "value"], [1, "filter-option", 3, "disabled", "value"], [1, "filter-arrows"], ["mat-icon-button", "", 3, "click"], [1, "material-icons-outlined"]], template: function FilterBarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, FilterBarComponent_div_0_Template, 7, 3, "div", 5);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.filterRowVisible);
-        } }, dependencies: [i1$2.NgIf, i2$3.DefaultLayoutDirective, i4.MatSelect, i5.MatOption, i4$1.NgControlStatus, i4$1.NgControlStatusGroup, i2$1.MatButton, i2$1.MatIconButton, i1.MatIcon, i4$1.FormGroupDirective, i4$1.FormControlName, i1$2.TitleCasePipe, i1$1.TranslatePipe, SortTranslationsByPropertyPipe, SortAlphabeticallyPipe], styles: ["[_nghost-%COMP%]{display:inline-block}.select-trigger-btn[_ngcontent-%COMP%]{position:relative}.select-trigger-btn[_ngcontent-%COMP%]   mat-select[_ngcontent-%COMP%]{width:100%;height:100%;opacity:0;position:absolute;top:0;left:0}.select-trigger-btn-label[_ngcontent-%COMP%]{display:flex;align-items:center;white-space:nowrap}.selected-count[_ngcontent-%COMP%]{margin-left:3px}.filter-row[_ngcontent-%COMP%]{display:flex;min-height:40px;min-width:100%;border-radius:.5rem;max-width:100%;align-items:center;margin-bottom:.5rem}.option-search-input[_ngcontent-%COMP%]{font-size:14px;width:100%;padding:.5rem 1rem;margin-bottom:.5rem}.material-icons-outlined[_ngcontent-%COMP%]{color:var(--base-40)}.filter-wrapper[_ngcontent-%COMP%]{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;gap:8px;flex:1}.hidden[_ngcontent-%COMP%]{display:none}  .cdk-overlay-pane:has(.filter-panel){margin:15px 0 0 -15px}  .filter-panel{border-radius:4px!important}[_nghost-%COMP%]     .mat-mdc-form-field-flex{background-color:var(--base-100);max-height:36px}[_nghost-%COMP%]     .mat-mdc-form-field-infix{padding-top:6px!important}[_nghost-%COMP%]     .mat-mdc-form-field-focus-overlay, [_nghost-%COMP%]     .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--base-95)}[_nghost-%COMP%]     .mdc-text-field--focused{background-color:var(--base-70)!important}[_nghost-%COMP%]     .mat-mdc-select-placeholder, [_nghost-%COMP%]     .mat-mdc-select-value-text, [_nghost-%COMP%]     .mdc-floating-label{font-size:14px!important}[_nghost-%COMP%]     .mdc-text-field--filled{--mdc-filled-text-field-active-indicator-height: 0;--mdc-filled-text-field-focus-active-indicator-height: 0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}[_nghost-%COMP%]     .mat-mdc-text-field-wrapper:hover{background-color:var(--base-70)!important;transition:.1s}[_nghost-%COMP%]     .mat-mdc-form-field-subscript-wrapper{display:none}[_nghost-%COMP%]     .mdc-floating-label--float-above{margin-top:3px}"] }); }
+        } }, dependencies: [i1$2.NgIf, i2$3.DefaultLayoutDirective, i4.MatSelect, i4.MatOption, i4$1.NgControlStatus, i4$1.NgControlStatusGroup, i2$1.MatButton, i2$1.MatIconButton, i1.MatIcon, i4$1.FormGroupDirective, i4$1.FormControlName, i1$2.TitleCasePipe, i1$1.TranslatePipe, SortTranslationsByPropertyPipe, SortAlphabeticallyPipe], styles: ["[_nghost-%COMP%]{display:inline-block}.select-trigger-btn[_ngcontent-%COMP%]{position:relative}.select-trigger-btn[_ngcontent-%COMP%]   mat-select[_ngcontent-%COMP%]{width:100%;height:100%;opacity:0;position:absolute;top:0;left:0}.select-trigger-btn-label[_ngcontent-%COMP%]{display:flex;align-items:center;white-space:nowrap}.selected-count[_ngcontent-%COMP%]{margin-left:3px}.filter-row[_ngcontent-%COMP%]{display:flex;min-height:40px;min-width:100%;border-radius:.5rem;max-width:100%;align-items:center;margin-bottom:.5rem}.option-search-input[_ngcontent-%COMP%]{font-size:14px;width:100%;padding:.5rem 1rem;margin-bottom:.5rem}.material-icons-outlined[_ngcontent-%COMP%]{color:var(--base-40)}.filter-wrapper[_ngcontent-%COMP%]{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;gap:8px;flex:1}.hidden[_ngcontent-%COMP%]{display:none}  .cdk-overlay-pane:has(.filter-panel){margin:15px 0 0 -15px}  .filter-panel{border-radius:4px!important}[_nghost-%COMP%]     .mat-mdc-form-field-flex{background-color:var(--base-100);max-height:36px}[_nghost-%COMP%]     .mat-mdc-form-field-infix{padding-top:6px!important}[_nghost-%COMP%]     .mat-mdc-form-field-focus-overlay, [_nghost-%COMP%]     .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--base-95)}[_nghost-%COMP%]     .mdc-text-field--focused{background-color:var(--base-70)!important}[_nghost-%COMP%]     .mat-mdc-select-placeholder, [_nghost-%COMP%]     .mat-mdc-select-value-text, [_nghost-%COMP%]     .mdc-floating-label{font-size:14px!important}[_nghost-%COMP%]     .mdc-text-field--filled{--mdc-filled-text-field-active-indicator-height: 0;--mdc-filled-text-field-focus-active-indicator-height: 0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}[_nghost-%COMP%]     .mat-mdc-text-field-wrapper:hover{background-color:var(--base-70)!important;transition:.1s}[_nghost-%COMP%]     .mat-mdc-form-field-subscript-wrapper{display:none}[_nghost-%COMP%]     .mdc-floating-label--float-above{margin-top:3px}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FilterBarComponent, [{
         type: Component,
-        args: [{ selector: 'tld-filter-bar', template: "<div class=\"filter-row\" *ngIf=\"filterRowVisible\">\r\n  <div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper [formGroup]=\"form\">\r\n    <ng-container [formGroup]=\"filterFormGroup\">\r\n      @for (filter of currentFilters; track filter.fieldName; let i = $index) {\r\n        <button [class.filter-active]=\"filter.selectedValues?.length\" class=\"select-trigger-btn\" mat-stroked-button color=\"accent\" (click)=\"select.open()\">\r\n          <div class=\"select-trigger-btn-label\">\r\n            <span>{{filter.title | translate}}</span>\r\n            <span *ngIf=\"filter.selectedValues?.length\" class=\"selected-count\">({{filter.selectedValues?.length}})</span>\r\n            <mat-icon>{{ select.panelOpen ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\" }}</mat-icon>\r\n          </div>\r\n\r\n          <mat-select\r\n            multiple \r\n            #select\r\n            [panelClass]=\"'filter-panel'\"\r\n            [panelWidth]=\"filter?.maxPanelWidth ?? 'auto'\" \r\n            [formControlName]=\"filter.fieldName\" \r\n            (openedChange)=\"$event === true ? focusOptionSearchInput(filter, i) : clearOptionSearchInput(filter, i)\"\r\n            (selectionChange)=\"selectEvent($event, filter)\" \r\n          >\r\n            <ng-container *ngIf=\"filter?.search?.placeholder\">\r\n              <input #optionSearchInput class=\"option-search-input\" [class.hidden]=\"filter.values!.length < 10\" type=\"text\" [placeholder]=\"filter.search?.placeholder ?? '' | translate\" (keyup)=\"filterOptions($event, filter)\" (keydown)=\"$event.stopPropagation()\">\r\n            </ng-container>\r\n          \r\n            <ng-container *ngIf=\"filter.values.length\">\r\n              <ng-container *ngIf=\"filter.translated; else sortedValuesByProperty\">\r\n                  @for (value of (filter.search?.filteredValues ?? filter.values) | sortAlphabetically:'key'; track value.key) {\r\n                    <mat-option [class.hidden]=\"filter.search?.searchCriteria && value.isSelected && !value.matchesSearchCriteria\" class=\"filter-option\" [disabled]=\"filter.singleSelection?.selected && filter.singleSelection?.value !== value.value\" [value]=\"value\">\r\n                      {{ filter.disableTitleCase ? value.key : (value.key | titlecase) }}\r\n                    </mat-option>\r\n                  }\r\n              </ng-container>\r\n              \r\n              <ng-template #sortedValuesByProperty>\r\n                  @for (value of (filter.search?.filteredValues ?? filter.values) | sortTranslationsByProperty:'key':'value'; track value.value) {\r\n                    <mat-option [class.hidden]=\"filter.search?.searchCriteria && value.isSelected && !value.matchesSearchCriteria\" class=\"filter-option\" [disabled]=\"filter.singleSelection?.selected && filter.singleSelection?.value !== value.value\" [value]=\"value\">\r\n                      <ng-container *ngIf=\"!filter.disableTitleCase; else defaultCase\">\r\n                      {{ value.key | translate : { default: value.value | titlecase } }}\r\n                      </ng-container>\r\n      \r\n                      <ng-template #defaultCase>\r\n                        {{ value.key | translate : { default: value.value } }} \r\n                      </ng-template>\r\n                    </mat-option>\r\n                  }\r\n              </ng-template>\r\n            </ng-container>\r\n          </mat-select>\r\n        </button>\r\n      }\r\n    </ng-container>\r\n  </div>\r\n  <ng-container *ngIf=\"filterOverflow\">\r\n    <div class=\"filter-arrows\">\r\n      <button mat-icon-button (click)=\"switchLeft()\">\r\n        <span class=\"material-icons-outlined\">\r\n          chevron_left\r\n        </span>\r\n      </button>\r\n      <button mat-icon-button (click)=\"switchRight()\">\r\n        <span class=\"material-icons-outlined\">\r\n          chevron_right\r\n        </span>\r\n      </button>\r\n    </div>\r\n  </ng-container>\r\n</div>\r\n", styles: [":host{display:inline-block}.select-trigger-btn{position:relative}.select-trigger-btn mat-select{width:100%;height:100%;opacity:0;position:absolute;top:0;left:0}.select-trigger-btn-label{display:flex;align-items:center;white-space:nowrap}.selected-count{margin-left:3px}.filter-row{display:flex;min-height:40px;min-width:100%;border-radius:.5rem;max-width:100%;align-items:center;margin-bottom:.5rem}.option-search-input{font-size:14px;width:100%;padding:.5rem 1rem;margin-bottom:.5rem}.material-icons-outlined{color:var(--base-40)}.filter-wrapper{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;gap:8px;flex:1}.hidden{display:none}::ng-deep .cdk-overlay-pane:has(.filter-panel){margin:15px 0 0 -15px}::ng-deep .filter-panel{border-radius:4px!important}:host ::ng-deep .mat-mdc-form-field-flex{background-color:var(--base-100);max-height:36px}:host ::ng-deep .mat-mdc-form-field-infix{padding-top:6px!important}:host ::ng-deep .mat-mdc-form-field-focus-overlay,:host ::ng-deep .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--base-95)}:host ::ng-deep .mdc-text-field--focused{background-color:var(--base-70)!important}:host ::ng-deep .mat-mdc-select-placeholder,:host ::ng-deep .mat-mdc-select-value-text,:host ::ng-deep .mdc-floating-label{font-size:14px!important}:host ::ng-deep .mdc-text-field--filled{--mdc-filled-text-field-active-indicator-height: 0;--mdc-filled-text-field-focus-active-indicator-height: 0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}:host ::ng-deep .mat-mdc-text-field-wrapper:hover{background-color:var(--base-70)!important;transition:.1s}:host ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none}:host ::ng-deep .mdc-floating-label--float-above{margin-top:3px}\n"] }]
+        args: [{ selector: 'tld-filter-bar', standalone: false, template: "<div class=\"filter-row\" *ngIf=\"filterRowVisible\">\r\n  <div fxLayout=\"row\" class=\"filter-wrapper\" #filterWrapper [formGroup]=\"form\">\r\n    <ng-container [formGroup]=\"filterFormGroup\">\r\n      @for (filter of currentFilters; track filter.fieldName; let i = $index) {\r\n        <button [class.filter-active]=\"filter.selectedValues?.length\" class=\"select-trigger-btn\" mat-stroked-button color=\"accent\" (click)=\"select.open()\">\r\n          <div class=\"select-trigger-btn-label\">\r\n            <span>{{filter.title | translate}}</span>\r\n            <span *ngIf=\"filter.selectedValues?.length\" class=\"selected-count\">({{filter.selectedValues?.length}})</span>\r\n            <mat-icon>{{ select.panelOpen ? \"keyboard_arrow_up\" : \"keyboard_arrow_down\" }}</mat-icon>\r\n          </div>\r\n\r\n          <mat-select\r\n            multiple \r\n            #select\r\n            [panelClass]=\"'filter-panel'\"\r\n            [panelWidth]=\"filter?.maxPanelWidth ?? 'auto'\" \r\n            [formControlName]=\"filter.fieldName\" \r\n            (openedChange)=\"$event === true ? focusOptionSearchInput(filter, i) : clearOptionSearchInput(filter, i)\"\r\n            (selectionChange)=\"selectEvent($event, filter)\" \r\n          >\r\n            <ng-container *ngIf=\"filter?.search?.placeholder\">\r\n              <input #optionSearchInput class=\"option-search-input\" [class.hidden]=\"filter.values!.length < 10\" type=\"text\" [placeholder]=\"filter.search?.placeholder ?? '' | translate\" (keyup)=\"filterOptions($event, filter)\" (keydown)=\"$event.stopPropagation()\">\r\n            </ng-container>\r\n          \r\n            <ng-container *ngIf=\"filter.values.length\">\r\n              <ng-container *ngIf=\"filter.translated; else sortedValuesByProperty\">\r\n                  @for (value of (filter.search?.filteredValues ?? filter.values) | sortAlphabetically:'key'; track value.key) {\r\n                    <mat-option [class.hidden]=\"filter.search?.searchCriteria && value.isSelected && !value.matchesSearchCriteria\" class=\"filter-option\" [disabled]=\"filter.singleSelection?.selected && filter.singleSelection?.value !== value.value\" [value]=\"value\">\r\n                      {{ filter.disableTitleCase ? value.key : (value.key | titlecase) }}\r\n                    </mat-option>\r\n                  }\r\n              </ng-container>\r\n              \r\n              <ng-template #sortedValuesByProperty>\r\n                  @for (value of (filter.search?.filteredValues ?? filter.values) | sortTranslationsByProperty:'key':'value'; track value.value) {\r\n                    <mat-option [class.hidden]=\"filter.search?.searchCriteria && value.isSelected && !value.matchesSearchCriteria\" class=\"filter-option\" [disabled]=\"filter.singleSelection?.selected && filter.singleSelection?.value !== value.value\" [value]=\"value\">\r\n                      <ng-container *ngIf=\"!filter.disableTitleCase; else defaultCase\">\r\n                      {{ value.key | translate : { default: value.value | titlecase } }}\r\n                      </ng-container>\r\n      \r\n                      <ng-template #defaultCase>\r\n                        {{ value.key | translate : { default: value.value } }} \r\n                      </ng-template>\r\n                    </mat-option>\r\n                  }\r\n              </ng-template>\r\n            </ng-container>\r\n          </mat-select>\r\n        </button>\r\n      }\r\n    </ng-container>\r\n  </div>\r\n  <ng-container *ngIf=\"filterOverflow\">\r\n    <div class=\"filter-arrows\">\r\n      <button mat-icon-button (click)=\"switchLeft()\">\r\n        <span class=\"material-icons-outlined\">\r\n          chevron_left\r\n        </span>\r\n      </button>\r\n      <button mat-icon-button (click)=\"switchRight()\">\r\n        <span class=\"material-icons-outlined\">\r\n          chevron_right\r\n        </span>\r\n      </button>\r\n    </div>\r\n  </ng-container>\r\n</div>\r\n", styles: [":host{display:inline-block}.select-trigger-btn{position:relative}.select-trigger-btn mat-select{width:100%;height:100%;opacity:0;position:absolute;top:0;left:0}.select-trigger-btn-label{display:flex;align-items:center;white-space:nowrap}.selected-count{margin-left:3px}.filter-row{display:flex;min-height:40px;min-width:100%;border-radius:.5rem;max-width:100%;align-items:center;margin-bottom:.5rem}.option-search-input{font-size:14px;width:100%;padding:.5rem 1rem;margin-bottom:.5rem}.material-icons-outlined{color:var(--base-40)}.filter-wrapper{max-width:100%;overflow-x:hidden;overflow-y:hidden;display:flex;gap:8px;flex:1}.hidden{display:none}::ng-deep .cdk-overlay-pane:has(.filter-panel){margin:15px 0 0 -15px}::ng-deep .filter-panel{border-radius:4px!important}:host ::ng-deep .mat-mdc-form-field-flex{background-color:var(--base-100);max-height:36px}:host ::ng-deep .mat-mdc-form-field-infix{padding-top:6px!important}:host ::ng-deep .mat-mdc-form-field-focus-overlay,:host ::ng-deep .mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:var(--base-95)}:host ::ng-deep .mdc-text-field--focused{background-color:var(--base-70)!important}:host ::ng-deep .mat-mdc-select-placeholder,:host ::ng-deep .mat-mdc-select-value-text,:host ::ng-deep .mdc-floating-label{font-size:14px!important}:host ::ng-deep .mdc-text-field--filled{--mdc-filled-text-field-active-indicator-height: 0;--mdc-filled-text-field-focus-active-indicator-height: 0;border-bottom-right-radius:4px;border-bottom-left-radius:4px}:host ::ng-deep .mat-mdc-text-field-wrapper:hover{background-color:var(--base-70)!important;transition:.1s}:host ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none}:host ::ng-deep .mdc-floating-label--float-above{margin-top:3px}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], { filterWrapper: [{
             type: ViewChild,
             args: ["filterWrapper"]
@@ -3678,7 +3686,7 @@ class FilterBarComponent {
         }], filterBarChange: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FilterBarComponent, { className: "FilterBarComponent", filePath: "lib\\filter-bar\\filter-bar.component.ts", lineNumber: 16 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FilterBarComponent, { className: "FilterBarComponent", filePath: "lib/filter-bar/filter-bar.component.ts", lineNumber: 17 }); })();
 
 class FilterBarModule {
     static { this.ɵfac = function FilterBarModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FilterBarModule)(); }; }
@@ -3790,7 +3798,7 @@ function StatusDisplayComponent_ng_template_2_Template(rf, ctx) { if (rf & 1) {
 } }
 class StatusDisplayComponent {
     static { this.ɵfac = function StatusDisplayComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || StatusDisplayComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: StatusDisplayComponent, selectors: [["lib-status-display"]], inputs: { config: "config" }, ngContentSelectors: _c0$9, decls: 4, vars: 2, consts: [["loading", ""], [1, "status-display-wrapper"], [4, "ngIf", "ngIfElse"], [1, "material-icons-outlined"], ["class", "text-xl-semi-bold status-display-row-title", 3, "innerHtml", 4, "ngIf"], ["class", "text-l status-display-row-description", 3, "innerHtml", 4, "ngIf"], ["class", "text-l status-display-row-extra", 3, "innerHtml", 4, "ngIf"], [1, "text-xl-semi-bold", "status-display-row-title", 3, "innerHtml"], [1, "text-l", "status-display-row-description", 3, "innerHtml"], [1, "text-l", "status-display-row-extra", 3, "innerHtml"], ["color", "accent"]], template: function StatusDisplayComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: StatusDisplayComponent, selectors: [["lib-status-display"]], inputs: { config: "config" }, standalone: false, ngContentSelectors: _c0$9, decls: 4, vars: 2, consts: [["loading", ""], [1, "status-display-wrapper"], [4, "ngIf", "ngIfElse"], [1, "material-icons-outlined"], ["class", "text-xl-semi-bold status-display-row-title", 3, "innerHtml", 4, "ngIf"], ["class", "text-l status-display-row-description", 3, "innerHtml", 4, "ngIf"], ["class", "text-l status-display-row-extra", 3, "innerHtml", 4, "ngIf"], [1, "text-xl-semi-bold", "status-display-row-title", 3, "innerHtml"], [1, "text-l", "status-display-row-description", 3, "innerHtml"], [1, "text-l", "status-display-row-extra", 3, "innerHtml"], ["color", "accent"]], template: function StatusDisplayComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵelementStart(0, "div", 1);
             i0.ɵɵtemplate(1, StatusDisplayComponent_ng_container_1_Template, 8, 4, "ng-container", 2)(2, StatusDisplayComponent_ng_template_2_Template, 1, 0, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
@@ -3799,16 +3807,16 @@ class StatusDisplayComponent {
             const loading_r2 = i0.ɵɵreference(3);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", !ctx.config.loading)("ngIfElse", loading_r2);
-        } }, dependencies: [i1$2.NgIf, i11.MatProgressSpinner, i1$1.TranslatePipe], styles: [".status-display-wrapper[_ngcontent-%COMP%]{margin:4rem 0;display:flex;flex-direction:column;align-items:center}.status-display-row-title[_ngcontent-%COMP%], .status-display-row-description[_ngcontent-%COMP%], .status-display-row-extra[_ngcontent-%COMP%]{text-align:center}.status-display-row-description[_ngcontent-%COMP%]{max-width:500px;white-space:wrap}.status-display-row-extra[_ngcontent-%COMP%]{margin-top:1rem}.material-icons-outlined[_ngcontent-%COMP%]{font-size:4rem;color:var(--base-70)}mat-spinner[_ngcontent-%COMP%]{margin:auto}.material-icons[_ngcontent-%COMP%], .material-icons-outlined[_ngcontent-%COMP%]{margin-right:.5rem}"] }); }
+        } }, dependencies: [i1$2.NgIf, i2$5.MatProgressSpinner, i1$1.TranslatePipe], styles: [".status-display-wrapper[_ngcontent-%COMP%]{margin:4rem 0;display:flex;flex-direction:column;align-items:center}.status-display-row-title[_ngcontent-%COMP%], .status-display-row-description[_ngcontent-%COMP%], .status-display-row-extra[_ngcontent-%COMP%]{text-align:center}.status-display-row-description[_ngcontent-%COMP%]{max-width:500px;white-space:wrap}.status-display-row-extra[_ngcontent-%COMP%]{margin-top:1rem}.material-icons-outlined[_ngcontent-%COMP%]{font-size:4rem;color:var(--base-70)}mat-spinner[_ngcontent-%COMP%]{margin:auto}.material-icons[_ngcontent-%COMP%], .material-icons-outlined[_ngcontent-%COMP%]{margin-right:.5rem}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(StatusDisplayComponent, [{
         type: Component,
-        args: [{ selector: 'lib-status-display', template: "<div class=\"status-display-wrapper\">\r\n  <ng-container *ngIf=\"!config.loading; else loading\">\r\n    <div>\r\n      <span class=\"material-icons-outlined\">\r\n        {{ config.icon }}\r\n      </span>\r\n    </div>\r\n    <div\r\n      class=\"text-xl-semi-bold status-display-row-title\"\r\n      *ngIf=\"config.title\"\r\n      [innerHtml]=\"config.title | translate : config.titleParams\"\r\n    ></div>\r\n    <div\r\n      *ngIf=\"config.description\"\r\n      class=\"text-l status-display-row-description\"\r\n      [innerHtml]=\"config.description | translate : config.descriptionParams\"\r\n    ></div>\r\n    <div\r\n      *ngIf=\"config.extraDescription\"\r\n      class=\"text-l status-display-row-extra\"\r\n      [innerHtml]=\"config.extraDescription | translate : config.extraDescriptionParams\"\r\n    ></div>\r\n    <ng-content></ng-content>\r\n  </ng-container>\r\n  <ng-template #loading>\r\n    <mat-spinner color=\"accent\"></mat-spinner>\r\n  </ng-template>\r\n</div>\r\n", styles: [".status-display-wrapper{margin:4rem 0;display:flex;flex-direction:column;align-items:center}.status-display-row-title,.status-display-row-description,.status-display-row-extra{text-align:center}.status-display-row-description{max-width:500px;white-space:wrap}.status-display-row-extra{margin-top:1rem}.material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}.material-icons,.material-icons-outlined{margin-right:.5rem}\n"] }]
+        args: [{ selector: 'lib-status-display', standalone: false, template: "<div class=\"status-display-wrapper\">\r\n  <ng-container *ngIf=\"!config.loading; else loading\">\r\n    <div>\r\n      <span class=\"material-icons-outlined\">\r\n        {{ config.icon }}\r\n      </span>\r\n    </div>\r\n    <div\r\n      class=\"text-xl-semi-bold status-display-row-title\"\r\n      *ngIf=\"config.title\"\r\n      [innerHtml]=\"config.title | translate : config.titleParams\"\r\n    ></div>\r\n    <div\r\n      *ngIf=\"config.description\"\r\n      class=\"text-l status-display-row-description\"\r\n      [innerHtml]=\"config.description | translate : config.descriptionParams\"\r\n    ></div>\r\n    <div\r\n      *ngIf=\"config.extraDescription\"\r\n      class=\"text-l status-display-row-extra\"\r\n      [innerHtml]=\"config.extraDescription | translate : config.extraDescriptionParams\"\r\n    ></div>\r\n    <ng-content></ng-content>\r\n  </ng-container>\r\n  <ng-template #loading>\r\n    <mat-spinner color=\"accent\"></mat-spinner>\r\n  </ng-template>\r\n</div>\r\n", styles: [".status-display-wrapper{margin:4rem 0;display:flex;flex-direction:column;align-items:center}.status-display-row-title,.status-display-row-description,.status-display-row-extra{text-align:center}.status-display-row-description{max-width:500px;white-space:wrap}.status-display-row-extra{margin-top:1rem}.material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}.material-icons,.material-icons-outlined{margin-right:.5rem}\n"] }]
     }], null, { config: [{
             type: Input,
             args: [{ required: true }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(StatusDisplayComponent, { className: "StatusDisplayComponent", filePath: "lib\\status-display\\status-display.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(StatusDisplayComponent, { className: "StatusDisplayComponent", filePath: "lib/status-display/status-display.component.ts", lineNumber: 10 }); })();
 
 const _c0$8 = ["tableContainer"];
 const _c1$3 = ["filterBar"];
@@ -4351,7 +4359,7 @@ class MultiFunctionalTableComponent {
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.filterBar = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.paginator = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tableElementRef = _t.first);
-        } }, inputs: { config: "config", highlightedElements: "highlightedElements", trackByFn: "trackByFn", highlightedErrorElements: "highlightedErrorElements", selection: "selection", isRowCheckboxAlwaysVisible: "isRowCheckboxAlwaysVisible", disablePreselectedItems: "disablePreselectedItems", data: [1, "data"] }, outputs: { filterBarChange: "filterBarChange", paginatorUpdate: "paginatorUpdate", exported: "exported", selectionChange: "selectionChange" }, ngContentSelectors: _c3, decls: 32, vars: 22, consts: [["tableContainer", ""], ["table", ""], ["columnMenu", "matMenu"], ["wildSearch", ""], ["filterBar", ""], ["fxLayout", "column", "fxLayoutGap", "0.75rem", 3, "ngClass.lt-md"], ["fxLayout", "row", "fxLayout.lt-md", "column", "fxLayoutGap.lt-md", "0.75rem"], ["fxFlex", "", "fxLayout.lt-md", "column", "fxLayoutGap", "0.75rem", "fxLayoutAlign", "start center", "fxLayoutAlign.lt-md", "start start", 1, "action-row"], ["class", "export-data", "mat-stroked-button", "", "color", "accent", 3, "click", 4, "ngIf"], ["fxFlex", "", "fxLayoutGap", "0.5rem", "fxLayoutAlign", "start center", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "class", "wild-search-wrapper", 4, "ngIf"], [3, "filterRowVisible", "settings", "filterBarChange", 4, "ngIf"], [3, "hidePageSize", "showFirstLastButtons", "pageSizeOptions"], [1, "table-overflow", 3, "mousedown", "mouseup", "mouseleave", "mousemove"], ["mat-table", "", 3, "dataSource", "trackBy"], [3, "matColumnDef"], ["class", "row-select", "mat-header-cell", "", "disable-export", "", 4, "matHeaderCellDef"], ["class", "row-select", "mat-cell", "", "disable-export", "", 4, "matCellDef"], ["mat-header-row", "", 4, "matHeaderRowDef", "matHeaderRowDefSticky"], ["mat-row", "", 3, "row-clickable", "highlight-error", "highlight", "click", "mouseover", "mouseleave", 4, "matRowDef", "matRowDefColumns"], [4, "ngIf"], [1, "column-select-menu", 3, "click"], [4, "ngFor", "ngForOf"], [1, "column-select-save"], ["mat-flat-button", "", "color", "accent", 3, "click"], ["mat-stroked-button", "", "color", "accent", 1, "export-data", 3, "click"], [1, "material-icons-outlined"], ["fxFlex", "", "fxLayoutGap", "0.5rem", "fxLayoutAlign", "start center"], ["mat-stroked-button", "", "color", "accent", 3, "click"], [1, "material-icons"], ["class", "clear-filters-wrapper", 4, "ngIf"], [1, "clear-filters-wrapper"], ["mat-icon-button", "", 3, "click"], ["fxLayout", "row", "fxLayoutAlign", "start center", 1, "wild-search-wrapper"], [1, "search-icon", 3, "matTooltip"], ["type", "text", 3, "keyup", "value", "placeholder"], ["mat-icon-button", "", "class", "wild-search-clear-btn", 3, "click", 4, "ngIf"], ["mat-icon-button", "", 1, "wild-search-clear-btn", 3, "click"], [3, "filterBarChange", "filterRowVisible", "settings"], [3, "page", "hidePageSize", "showFirstLastButtons", "pageSizeOptions"], ["mat-header-cell", "", "disable-export", "", 1, "row-select"], [3, "change", "matTooltip", "disabled", "checked", "indeterminate"], ["mat-cell", "", "disable-export", "", 1, "row-select"], [3, "matTooltip", "disabled", "checked", "click", "change", 4, "ngIf"], [3, "click", "change", "matTooltip", "disabled", "checked"], ["mat-header-row", ""], ["mat-row", "", 3, "click", "mouseover", "mouseleave"], [1, "column-selector-wrapper"], ["mat-icon-button", "", "color", "accent", 1, "column-selector", 3, "matMenuTriggerFor"], [4, "matNoDataRow"], ["colspan", "99"], [3, "config"], [3, "ngModelChange", "ngModel"]], template: function MultiFunctionalTableComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { config: "config", highlightedElements: "highlightedElements", trackByFn: "trackByFn", highlightedErrorElements: "highlightedErrorElements", selection: "selection", isRowCheckboxAlwaysVisible: "isRowCheckboxAlwaysVisible", disablePreselectedItems: "disablePreselectedItems", data: [1, "data"] }, outputs: { filterBarChange: "filterBarChange", paginatorUpdate: "paginatorUpdate", exported: "exported", selectionChange: "selectionChange" }, standalone: false, ngContentSelectors: _c3, decls: 32, vars: 22, consts: [["tableContainer", ""], ["table", ""], ["columnMenu", "matMenu"], ["wildSearch", ""], ["filterBar", ""], ["fxLayout", "column", "fxLayoutGap", "0.75rem", 3, "ngClass.lt-md"], ["fxLayout", "row", "fxLayout.lt-md", "column", "fxLayoutGap.lt-md", "0.75rem"], ["fxFlex", "", "fxLayout.lt-md", "column", "fxLayoutGap", "0.75rem", "fxLayoutAlign", "start center", "fxLayoutAlign.lt-md", "start start", 1, "action-row"], ["class", "export-data", "mat-stroked-button", "", "color", "accent", 3, "click", 4, "ngIf"], ["fxFlex", "", "fxLayoutGap", "0.5rem", "fxLayoutAlign", "start center", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "class", "wild-search-wrapper", 4, "ngIf"], [3, "filterRowVisible", "settings", "filterBarChange", 4, "ngIf"], [3, "hidePageSize", "showFirstLastButtons", "pageSizeOptions"], [1, "table-overflow", 3, "mousedown", "mouseup", "mouseleave", "mousemove"], ["mat-table", "", 3, "dataSource", "trackBy"], [3, "matColumnDef"], ["class", "row-select", "mat-header-cell", "", "disable-export", "", 4, "matHeaderCellDef"], ["class", "row-select", "mat-cell", "", "disable-export", "", 4, "matCellDef"], ["mat-header-row", "", 4, "matHeaderRowDef", "matHeaderRowDefSticky"], ["mat-row", "", 3, "row-clickable", "highlight-error", "highlight", "click", "mouseover", "mouseleave", 4, "matRowDef", "matRowDefColumns"], [4, "ngIf"], [1, "column-select-menu", 3, "click"], [4, "ngFor", "ngForOf"], [1, "column-select-save"], ["mat-flat-button", "", "color", "accent", 3, "click"], ["mat-stroked-button", "", "color", "accent", 1, "export-data", 3, "click"], [1, "material-icons-outlined"], ["fxFlex", "", "fxLayoutGap", "0.5rem", "fxLayoutAlign", "start center"], ["mat-stroked-button", "", "color", "accent", 3, "click"], [1, "material-icons"], ["class", "clear-filters-wrapper", 4, "ngIf"], [1, "clear-filters-wrapper"], ["mat-icon-button", "", 3, "click"], ["fxLayout", "row", "fxLayoutAlign", "start center", 1, "wild-search-wrapper"], [1, "search-icon", 3, "matTooltip"], ["type", "text", 3, "keyup", "value", "placeholder"], ["mat-icon-button", "", "class", "wild-search-clear-btn", 3, "click", 4, "ngIf"], ["mat-icon-button", "", 1, "wild-search-clear-btn", 3, "click"], [3, "filterBarChange", "filterRowVisible", "settings"], [3, "page", "hidePageSize", "showFirstLastButtons", "pageSizeOptions"], ["mat-header-cell", "", "disable-export", "", 1, "row-select"], [3, "change", "matTooltip", "disabled", "checked", "indeterminate"], ["mat-cell", "", "disable-export", "", 1, "row-select"], [3, "matTooltip", "disabled", "checked", "click", "change", 4, "ngIf"], [3, "click", "change", "matTooltip", "disabled", "checked"], ["mat-header-row", ""], ["mat-row", "", 3, "click", "mouseover", "mouseleave"], [1, "column-selector-wrapper"], ["mat-icon-button", "", "color", "accent", 1, "column-selector", 3, "matMenuTriggerFor"], [4, "matNoDataRow"], ["colspan", "99"], [3, "config"], [3, "ngModelChange", "ngModel"]], template: function MultiFunctionalTableComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵprojectionDef(_c2$1);
             i0.ɵɵelementStart(0, "div", 5)(1, "div", 6)(2, "div", 7);
@@ -4419,7 +4427,7 @@ class MultiFunctionalTableComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MultiFunctionalTableComponent, [{
         type: Component,
-        args: [{ selector: 'tld-multi-functional-table', template: "<div [ngClass.lt-md]=\"'mobile'\" fxLayout=\"column\" fxLayoutGap=\"0.75rem\">\r\n  <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap.lt-md=\"0.75rem\">\r\n    <div\r\n      fxFlex\r\n      fxLayout.lt-md=\"column\"\r\n      fxLayoutGap=\"0.75rem\"\r\n      fxLayoutAlign=\"start center\"\r\n      fxLayoutAlign.lt-md=\"start start\"\r\n      class=\"action-row\"\r\n    >\r\n      <button\r\n        class=\"export-data\"\r\n        mat-stroked-button\r\n        color=\"accent\"\r\n        *ngIf=\"exportActive\"\r\n        (click)=\"export()\"\r\n      >\r\n        <span class=\"material-icons-outlined\">cloud_download</span>\r\n        <span>{{ \"MULTI_FUNCTIONAL_TABLE.EXPORT\" | translate }}</span>\r\n      </button>\r\n\r\n      <div\r\n        *ngIf=\"filterActive && showFilterToggle\"\r\n        fxFlex\r\n        fxLayoutGap=\"0.5rem\"\r\n        fxLayoutAlign=\"start center\"\r\n      >\r\n        <button\r\n          [class.filter-active]=\"filterBarVisible\"\r\n          mat-stroked-button\r\n          color=\"accent\"\r\n          (click)=\"toggleFilterBar()\"\r\n        >\r\n          <span class=\"material-icons\">filter_list</span>\r\n          <span>{{ \"MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE\" | translate }}</span>\r\n        </button>\r\n\r\n        <div *ngIf=\"showFilterReset\" class=\"clear-filters-wrapper\">\r\n          <button mat-icon-button (click)=\"clearFilters()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      *ngIf=\"showSearch\"\r\n      fxLayout=\"row\"\r\n      fxLayoutAlign=\"start center\"\r\n      class=\"wild-search-wrapper\"\r\n    >\r\n      <mat-icon\r\n        class=\"search-icon\"\r\n        [matTooltip]=\"hideSearchTooltip ? '' : (searchTooltip | translate)\"\r\n        >search</mat-icon\r\n      >\r\n      <input\r\n        [value]=\"config.filter?.settings?.searchValue ?? ''\"\r\n        #wildSearch\r\n        type=\"text\"\r\n        [placeholder]=\"searchTitle | translate\"\r\n        (keyup)=\"search($event)\"\r\n      />\r\n      <button\r\n        *ngIf=\"showSearchClearButton && wildSearch.value\"\r\n        mat-icon-button\r\n        class=\"wild-search-clear-btn\"\r\n        (click)=\"wildSearch.value = ''; search({ target: { value: '' } })\"\r\n      >\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <ng-content select=\"[additionalActions]\"></ng-content>\r\n  </div>\r\n\r\n  <tld-filter-bar\r\n    *ngIf=\"config.filter && config.filter.enabled\"\r\n    #filterBar\r\n    [filterRowVisible]=\"filterBarVisible\"\r\n    [settings]=\"config.filter.settings\"\r\n    (filterBarChange)=\"filtersChanged($event)\"\r\n  >\r\n  </tld-filter-bar>\r\n\r\n  <ng-content select=\"[batchActions]\"></ng-content>\r\n\r\n  @if(config.paginator?.enabled){\r\n    @let paginatorConfig = config.paginator!;\r\n\r\n    <mat-paginator [hidePageSize]=\"!paginatorConfig.showPageSize\" [showFirstLastButtons]=\"paginatorConfig.showFirstLastButtons\"\r\n    [attr.aria-label]=\"'MULTI_FUNCTIONAL_TABLE.PAGINATOR_LABEL' | translate\" [pageSizeOptions]=\"paginatorConfig.pageSizeOptions ?? [10]\" (page)=\"paginatorChange($event)\">\r\n    </mat-paginator>\r\n  }\r\n  <div\r\n    #tableContainer\r\n    class=\"table-overflow\"\r\n    [class.table-sticky-header]=\"config?.stickyHeader\"\r\n    [class.table-dragable]=\"tableOverflow && !config?.disableMouseDragging\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n    (mouseup)=\"onMouseUp()\"\r\n    (mouseleave)=\"onMouseUp()\"\r\n    (mousemove)=\"onMouseMove($event)\"\r\n  >\r\n    <table\r\n      #table\r\n      mat-table\r\n      [dataSource]=\"dataSource!\"\r\n      [trackBy]=\"trackByFn\"\r\n    >\r\n      <ng-content></ng-content>\r\n      <ng-container [matColumnDef]=\"batchColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT_ALL' | translate\"\r\n            [disabled]=\"config.batchConfig!.checkBoxesDisabled\"\r\n            (change)=\"toggleAllRowSelection()\"\r\n            [checked]=\"matSelection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"matSelection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        >\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT' | translate\"\r\n            *ngIf=\"\r\n              isRowCheckboxAlwaysVisible ||\r\n              hoveredRow === element ||\r\n              matSelection.isSelected(element)\r\n            \"\r\n            [disabled]=\"\r\n              config.batchConfig!.checkBoxesDisabled ||\r\n              (preselectedItems.includes(element) && disablePreselectedItems)\r\n            \"\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleElementSelection(element)\"\r\n            [checked]=\"matSelection.isSelected(element)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n      <tr\r\n        mat-header-row\r\n        *matHeaderRowDef=\"displayColumns; sticky: config?.stickyHeader ?? false\"\r\n      ></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; let index = index; columns: displayColumns\"\r\n        (click)=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n            ? config?.rowClickCallback(row)\r\n            : null\r\n        \"\r\n        (mouseover)=\"rowHovered(index,row)\"\r\n        (mouseleave)=\"rowHoverLeave()\"\r\n        [class.row-clickable]=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n        \"\r\n        [class.highlight-error]=\"highlightErrorElement(index, row)\"\r\n        [class.highlight]=\"isElementHighlighted(index,row)\"\r\n      ></tr>\r\n\r\n      <ng-container [matColumnDef]=\"columnSelectColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <div class=\"column-selector-wrapper\">\r\n            <button\r\n              class=\"column-selector\"\r\n              mat-icon-button\r\n              color=\"accent\"\r\n              [matMenuTriggerFor]=\"columnMenu\"\r\n            >\r\n              <span class=\"material-icons\">more_vert</span>\r\n            </button>\r\n          </div>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        ></td>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"noDataRowActive\">\r\n        <tr *matNoDataRow>\r\n          <!-- add random number to make sure it takes full width -->\r\n          <td colspan=\"99\">\r\n            <lib-status-display [config]=\"noDataRowConfig\"></lib-status-display>\r\n          </td>\r\n        </tr>\r\n      </ng-container>\r\n    </table>\r\n  </div>\r\n</div>\r\n\r\n<mat-menu #columnMenu=\"matMenu\">\r\n  <div class=\"column-select-menu\" (click)=\"$event.stopPropagation()\">\r\n    <div *ngFor=\"let column of configurableColumns\">\r\n      <mat-checkbox [(ngModel)]=\"column.selected\">\r\n        {{ column.displayName | translate }}\r\n      </mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"column-select-save\">\r\n      <button\r\n        mat-flat-button\r\n        color=\"accent\"\r\n        (click)=\"updateDisplayColumns()\"\r\n      >\r\n        {{ \"MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE\" | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep th,:host ::ng-deep tr{white-space:nowrap}:host ::ng-deep td:not(:first-of-type){padding-right:10px!important}:host ::ng-deep tr.mat-mdc-row:hover,:host ::ng-deep tr.mat-mdc-row.highlight{background-color:var(--base-95)}:host ::ng-deep tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}:host ::ng-deep .export-data .mdc-button__label{display:flex;align-items:center}:host ::ng-deep .mat-mdc-cell,:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}:host ::ng-deep .mdc-data-table__cell:nth-child(2),:host ::ng-deep .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}:host ::ng-deep td+.cdk-column-columnSelect{display:none}:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button,:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}:host ::ng-deep .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}:host ::ng-deep .filter-active{background-color:var(--neutral-95)}:host ::ng-deep .row-actions{opacity:0}:host ::ng-deep .mobile .row-actions,:host ::ng-deep .highlight .row-actions{opacity:1}:host ::ng-deep .mat-mdc-paginator-range-actions button{padding:8px}table{width:100%}.wild-search-wrapper{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper input{margin-right:30px}.wild-search-wrapper .search-icon{color:var(--base-40)}.wild-search-wrapper .wild-search-clear-btn{position:absolute;right:3px}.wild-search-wrapper .mat-mdc-icon-button,.wild-search-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:33px!important;width:33px!important}.wild-search-wrapper .mat-mdc-icon-button mat-icon,.wild-search-wrapper .mat-mdc-icon-button .material-icons,.wild-search-wrapper .mat-mdc-icon-button .material-icons-outlined{top:5px!important;left:5px!important}.mobile .wild-search-wrapper{margin:0}.column-selector-wrapper{display:flex;justify-content:end}.column-select-menu{padding:8px 18px 8px 8px}.column-select-save{padding-left:8px;padding-top:8px}.column-select-save button{width:100%}.row-clickable{cursor:pointer}.row-clickable:active{background-color:var(--base-70)!important}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}th.mat-mdc-header-cell:first-of-type,td.mat-mdc-cell:first-of-type,td.mat-mdc-footer-cell:first-of-type{padding:0 0 0 10px}.row-select{width:0}.table-overflow{overflow-x:auto}.table-dragable{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable:active{cursor:grabbing}.table-sticky-header{max-height:70vh}\n"] }]
+        args: [{ selector: 'tld-multi-functional-table', standalone: false, template: "<div [ngClass.lt-md]=\"'mobile'\" fxLayout=\"column\" fxLayoutGap=\"0.75rem\">\r\n  <div fxLayout=\"row\" fxLayout.lt-md=\"column\" fxLayoutGap.lt-md=\"0.75rem\">\r\n    <div\r\n      fxFlex\r\n      fxLayout.lt-md=\"column\"\r\n      fxLayoutGap=\"0.75rem\"\r\n      fxLayoutAlign=\"start center\"\r\n      fxLayoutAlign.lt-md=\"start start\"\r\n      class=\"action-row\"\r\n    >\r\n      <button\r\n        class=\"export-data\"\r\n        mat-stroked-button\r\n        color=\"accent\"\r\n        *ngIf=\"exportActive\"\r\n        (click)=\"export()\"\r\n      >\r\n        <span class=\"material-icons-outlined\">cloud_download</span>\r\n        <span>{{ \"MULTI_FUNCTIONAL_TABLE.EXPORT\" | translate }}</span>\r\n      </button>\r\n\r\n      <div\r\n        *ngIf=\"filterActive && showFilterToggle\"\r\n        fxFlex\r\n        fxLayoutGap=\"0.5rem\"\r\n        fxLayoutAlign=\"start center\"\r\n      >\r\n        <button\r\n          [class.filter-active]=\"filterBarVisible\"\r\n          mat-stroked-button\r\n          color=\"accent\"\r\n          (click)=\"toggleFilterBar()\"\r\n        >\r\n          <span class=\"material-icons\">filter_list</span>\r\n          <span>{{ \"MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE\" | translate }}</span>\r\n        </button>\r\n\r\n        <div *ngIf=\"showFilterReset\" class=\"clear-filters-wrapper\">\r\n          <button mat-icon-button (click)=\"clearFilters()\">\r\n            <mat-icon>close</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div\r\n      *ngIf=\"showSearch\"\r\n      fxLayout=\"row\"\r\n      fxLayoutAlign=\"start center\"\r\n      class=\"wild-search-wrapper\"\r\n    >\r\n      <mat-icon\r\n        class=\"search-icon\"\r\n        [matTooltip]=\"hideSearchTooltip ? '' : (searchTooltip | translate)\"\r\n        >search</mat-icon\r\n      >\r\n      <input\r\n        [value]=\"config.filter?.settings?.searchValue ?? ''\"\r\n        #wildSearch\r\n        type=\"text\"\r\n        [placeholder]=\"searchTitle | translate\"\r\n        (keyup)=\"search($event)\"\r\n      />\r\n      <button\r\n        *ngIf=\"showSearchClearButton && wildSearch.value\"\r\n        mat-icon-button\r\n        class=\"wild-search-clear-btn\"\r\n        (click)=\"wildSearch.value = ''; search({ target: { value: '' } })\"\r\n      >\r\n        <mat-icon>close</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <ng-content select=\"[additionalActions]\"></ng-content>\r\n  </div>\r\n\r\n  <tld-filter-bar\r\n    *ngIf=\"config.filter && config.filter.enabled\"\r\n    #filterBar\r\n    [filterRowVisible]=\"filterBarVisible\"\r\n    [settings]=\"config.filter.settings\"\r\n    (filterBarChange)=\"filtersChanged($event)\"\r\n  >\r\n  </tld-filter-bar>\r\n\r\n  <ng-content select=\"[batchActions]\"></ng-content>\r\n\r\n  @if(config.paginator?.enabled){\r\n    @let paginatorConfig = config.paginator!;\r\n\r\n    <mat-paginator [hidePageSize]=\"!paginatorConfig.showPageSize\" [showFirstLastButtons]=\"paginatorConfig.showFirstLastButtons\"\r\n    [attr.aria-label]=\"'MULTI_FUNCTIONAL_TABLE.PAGINATOR_LABEL' | translate\" [pageSizeOptions]=\"paginatorConfig.pageSizeOptions ?? [10]\" (page)=\"paginatorChange($event)\">\r\n    </mat-paginator>\r\n  }\r\n  <div\r\n    #tableContainer\r\n    class=\"table-overflow\"\r\n    [class.table-sticky-header]=\"config?.stickyHeader\"\r\n    [class.table-dragable]=\"tableOverflow && !config?.disableMouseDragging\"\r\n    (mousedown)=\"onMouseDown($event)\"\r\n    (mouseup)=\"onMouseUp()\"\r\n    (mouseleave)=\"onMouseUp()\"\r\n    (mousemove)=\"onMouseMove($event)\"\r\n  >\r\n    <table\r\n      #table\r\n      mat-table\r\n      [dataSource]=\"dataSource!\"\r\n      [trackBy]=\"trackByFn\"\r\n    >\r\n      <ng-content></ng-content>\r\n      <ng-container [matColumnDef]=\"batchColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT_ALL' | translate\"\r\n            [disabled]=\"config.batchConfig!.checkBoxesDisabled\"\r\n            (change)=\"toggleAllRowSelection()\"\r\n            [checked]=\"matSelection.hasValue() && isAllSelected()\"\r\n            [indeterminate]=\"matSelection.hasValue() && !isAllSelected()\"\r\n          >\r\n          </mat-checkbox>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        >\r\n          <mat-checkbox\r\n            [matTooltip]=\"'MULTI_FUNCTIONAL_TABLE.SELECT' | translate\"\r\n            *ngIf=\"\r\n              isRowCheckboxAlwaysVisible ||\r\n              hoveredRow === element ||\r\n              matSelection.isSelected(element)\r\n            \"\r\n            [disabled]=\"\r\n              config.batchConfig!.checkBoxesDisabled ||\r\n              (preselectedItems.includes(element) && disablePreselectedItems)\r\n            \"\r\n            (click)=\"$event.stopPropagation()\"\r\n            (change)=\"toggleElementSelection(element)\"\r\n            [checked]=\"matSelection.isSelected(element)\"\r\n          >\r\n          </mat-checkbox>\r\n        </td>\r\n      </ng-container>\r\n      <tr\r\n        mat-header-row\r\n        *matHeaderRowDef=\"displayColumns; sticky: config?.stickyHeader ?? false\"\r\n      ></tr>\r\n      <tr\r\n        mat-row\r\n        *matRowDef=\"let row; let index = index; columns: displayColumns\"\r\n        (click)=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n            ? config?.rowClickCallback(row)\r\n            : null\r\n        \"\r\n        (mouseover)=\"rowHovered(index,row)\"\r\n        (mouseleave)=\"rowHoverLeave()\"\r\n        [class.row-clickable]=\"\r\n          config?.rowClickCallback && (!config.disableRowClick || !config?.disableRowClick(row))\r\n        \"\r\n        [class.highlight-error]=\"highlightErrorElement(index, row)\"\r\n        [class.highlight]=\"isElementHighlighted(index,row)\"\r\n      ></tr>\r\n\r\n      <ng-container [matColumnDef]=\"columnSelectColumnName\">\r\n        <th class=\"row-select\" mat-header-cell *matHeaderCellDef disable-export>\r\n          <div class=\"column-selector-wrapper\">\r\n            <button\r\n              class=\"column-selector\"\r\n              mat-icon-button\r\n              color=\"accent\"\r\n              [matMenuTriggerFor]=\"columnMenu\"\r\n            >\r\n              <span class=\"material-icons\">more_vert</span>\r\n            </button>\r\n          </div>\r\n        </th>\r\n        <td\r\n          class=\"row-select\"\r\n          mat-cell\r\n          *matCellDef=\"let element\"\r\n          disable-export\r\n        ></td>\r\n      </ng-container>\r\n      <ng-container *ngIf=\"noDataRowActive\">\r\n        <tr *matNoDataRow>\r\n          <!-- add random number to make sure it takes full width -->\r\n          <td colspan=\"99\">\r\n            <lib-status-display [config]=\"noDataRowConfig\"></lib-status-display>\r\n          </td>\r\n        </tr>\r\n      </ng-container>\r\n    </table>\r\n  </div>\r\n</div>\r\n\r\n<mat-menu #columnMenu=\"matMenu\">\r\n  <div class=\"column-select-menu\" (click)=\"$event.stopPropagation()\">\r\n    <div *ngFor=\"let column of configurableColumns\">\r\n      <mat-checkbox [(ngModel)]=\"column.selected\">\r\n        {{ column.displayName | translate }}\r\n      </mat-checkbox>\r\n    </div>\r\n\r\n    <div class=\"column-select-save\">\r\n      <button\r\n        mat-flat-button\r\n        color=\"accent\"\r\n        (click)=\"updateDisplayColumns()\"\r\n      >\r\n        {{ \"MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT_SAVE\" | translate }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep th,:host ::ng-deep tr{white-space:nowrap}:host ::ng-deep td:not(:first-of-type){padding-right:10px!important}:host ::ng-deep tr.mat-mdc-row:hover,:host ::ng-deep tr.mat-mdc-row.highlight{background-color:var(--base-95)}:host ::ng-deep tr.mat-mdc-row.highlight-error{background-color:var(--warning-light)}:host ::ng-deep .export-data .mdc-button__label{display:flex;align-items:center}:host ::ng-deep .mat-mdc-cell,:host ::ng-deep .mat-mdc-header-cell,:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-color:var(--base-70)}:host ::ng-deep .mdc-data-table__row:last-child{border-bottom-width:1px;border-bottom-style:solid}:host ::ng-deep .mdc-data-table__cell:nth-child(2),:host ::ng-deep .mdc-data-table__header-cell:nth-child(2){padding:0 16px 0 10px}:host ::ng-deep td+.cdk-column-columnSelect{display:none}:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button,:host ::ng-deep .clear-filters-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:36px!important;width:36px!important}:host ::ng-deep .clear-filters-wrapper mat-icon{margin-top:-2px;margin-left:-2px}:host ::ng-deep .filter-active{background-color:var(--neutral-95)}:host ::ng-deep .row-actions{opacity:0}:host ::ng-deep .mobile .row-actions,:host ::ng-deep .highlight .row-actions{opacity:1}:host ::ng-deep .mat-mdc-paginator-range-actions button{padding:8px}table{width:100%}.wild-search-wrapper{position:relative;padding:5px 10px;border-radius:4px;border:1px solid var(--neutral-50);margin:0 8px}.wild-search-wrapper input{margin-right:30px}.wild-search-wrapper .search-icon{color:var(--base-40)}.wild-search-wrapper .wild-search-clear-btn{position:absolute;right:3px}.wild-search-wrapper .mat-mdc-icon-button,.wild-search-wrapper .mat-mdc-icon-button .mat-mdc-button-touch-target{height:33px!important;width:33px!important}.wild-search-wrapper .mat-mdc-icon-button mat-icon,.wild-search-wrapper .mat-mdc-icon-button .material-icons,.wild-search-wrapper .mat-mdc-icon-button .material-icons-outlined{top:5px!important;left:5px!important}.mobile .wild-search-wrapper{margin:0}.column-selector-wrapper{display:flex;justify-content:end}.column-select-menu{padding:8px 18px 8px 8px}.column-select-save{padding-left:8px;padding-top:8px}.column-select-save button{width:100%}.row-clickable{cursor:pointer}.row-clickable:active{background-color:var(--base-70)!important}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}th.mat-mdc-header-cell:first-of-type,td.mat-mdc-cell:first-of-type,td.mat-mdc-footer-cell:first-of-type{padding:0 0 0 10px}.row-select{width:0}.table-overflow{overflow-x:auto}.table-dragable{cursor:grab;-webkit-user-select:none;user-select:none}.table-dragable:active{cursor:grabbing}.table-sticky-header{max-height:70vh}\n"] }]
     }], () => [{ type: DOMService }, { type: i1$1.TranslateService }], { config: [{
             type: Input
         }], highlightedElements: [{
@@ -4473,7 +4481,7 @@ class MultiFunctionalTableComponent {
             type: ViewChild,
             args: [MatTable, { read: ElementRef }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MultiFunctionalTableComponent, { className: "MultiFunctionalTableComponent", filePath: "lib\\multi-functional-table\\multi-functional-table.component.ts", lineNumber: 26 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MultiFunctionalTableComponent, { className: "MultiFunctionalTableComponent", filePath: "lib/multi-functional-table/multi-functional-table.component.ts", lineNumber: 27 }); })();
 
 class StatusDisplayModule {
     static { this.ɵfac = function StatusDisplayModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || StatusDisplayModule)(); }; }
@@ -4595,7 +4603,7 @@ class ConfirmationModalComponent {
         this.confirmation = Confirmation;
     }
     static { this.ɵfac = function ConfirmationModalComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ConfirmationModalComponent)(i0.ɵɵdirectiveInject(i1$4.MatDialogRef), i0.ɵɵdirectiveInject(MAT_DIALOG_DATA)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConfirmationModalComponent, selectors: [["lib-confirmation-modal"]], decls: 15, vars: 15, consts: [["mat-dialog-title", ""], ["mat-dialog-content", ""], [1, "confirmation-description"], [4, "ngIf"], ["align", "end"], ["mat-button", "", 3, "mat-dialog-close"], ["mat-flat-button", "", "color", "accent", 3, "mat-dialog-close"], [4, "ngFor", "ngForOf"]], template: function ConfirmationModalComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConfirmationModalComponent, selectors: [["lib-confirmation-modal"]], standalone: false, decls: 15, vars: 15, consts: [["mat-dialog-title", ""], ["mat-dialog-content", ""], [1, "confirmation-description"], [4, "ngIf"], ["align", "end"], ["mat-button", "", 3, "mat-dialog-close"], ["mat-flat-button", "", "color", "accent", 3, "mat-dialog-close"], [4, "ngFor", "ngForOf"]], template: function ConfirmationModalComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "h1", 0);
             i0.ɵɵtext(1);
             i0.ɵɵpipe(2, "translate");
@@ -4633,12 +4641,12 @@ class ConfirmationModalComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConfirmationModalComponent, [{
         type: Component,
-        args: [{ selector: 'lib-confirmation-modal', template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\r\n<div mat-dialog-content>\r\n  <p class=\"confirmation-description\">{{ data.descriptioon | translate }}</p>\r\n  \r\n  <ul *ngIf=\"data.details\">\r\n    <li *ngFor=\"let extraData of data.details\">\r\n      {{ extraData }}\r\n    </li>\r\n  </ul>\r\n</div>\r\n<mat-dialog-actions align=\"end\">\r\n  <button mat-button [mat-dialog-close]=\"confirmation.SECONDARY\">\r\n    {{ data.rejectionText | translate }}\r\n  </button>\r\n  <button mat-flat-button color=\"accent\" [mat-dialog-close]=\"confirmation.PRIMARY\">\r\n    {{ data.confirmationText | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [".confirmation-description{color:var(--base-40)}.confirmation-description{margin-top:4px}\n"] }]
+        args: [{ selector: 'lib-confirmation-modal', standalone: false, template: "<h1 mat-dialog-title>{{ data.title | translate }}</h1>\r\n<div mat-dialog-content>\r\n  <p class=\"confirmation-description\">{{ data.descriptioon | translate }}</p>\r\n  \r\n  <ul *ngIf=\"data.details\">\r\n    <li *ngFor=\"let extraData of data.details\">\r\n      {{ extraData }}\r\n    </li>\r\n  </ul>\r\n</div>\r\n<mat-dialog-actions align=\"end\">\r\n  <button mat-button [mat-dialog-close]=\"confirmation.SECONDARY\">\r\n    {{ data.rejectionText | translate }}\r\n  </button>\r\n  <button mat-flat-button color=\"accent\" [mat-dialog-close]=\"confirmation.PRIMARY\">\r\n    {{ data.confirmationText | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [".confirmation-description{color:var(--base-40)}.confirmation-description{margin-top:4px}\n"] }]
     }], () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
             }] }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConfirmationModalComponent, { className: "ConfirmationModalComponent", filePath: "lib\\confirmation-modal\\confirmation-modal.component.ts", lineNumber: 11 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConfirmationModalComponent, { className: "ConfirmationModalComponent", filePath: "lib/confirmation-modal/confirmation-modal.component.ts", lineNumber: 12 }); })();
 
 class ConfirmationModalModule {
     static { this.ɵfac = function ConfirmationModalModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ConfirmationModalModule)(); }; }
@@ -4709,7 +4717,7 @@ function OpenCloseButtonComponent_button_0_Template(rf, ctx) { if (rf & 1) {
     const closed_r2 = i0.ɵɵreference(7);
     const ctx_r0 = i0.ɵɵnextContext();
     i0.ɵɵproperty("disabled", ctx_r0.disabled)("disableRipple", true)("ngClass.lt-md", "open-close-button-tablet");
-    i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 6, ctx_r0.ariaLabelCode));
+    i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 7, ctx_r0.ariaLabelCode))("aria-expanded", ctx_r0.isOpened);
     i0.ɵɵadvance(5);
     i0.ɵɵproperty("ngIf", ctx_r0.isOpened)("ngIfElse", closed_r2);
 } }
@@ -4750,9 +4758,9 @@ class OpenCloseButtonComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.button = _t.first);
-        } }, inputs: { disableFocusOnAction: "disableFocusOnAction", disabled: "disabled", isIcon: "isIcon", ariaLabelCode: "ariaLabelCode", isOpened: "isOpened" }, ngContentSelectors: _c0$7, decls: 2, vars: 2, consts: [["closed", ""], ["mat-button", "", 3, "disabled", "disableRipple", "ngClass.lt-md", 4, "ngIf"], ["mat-icon-button", "", "fxLayoutAlign", "center center", 3, "disabled", 4, "ngIf"], ["mat-button", "", 3, "disabled", "disableRipple", "ngClass.lt-md"], ["fxLayout", "row", "fxLayoutAlign", "center center"], ["fxLayoutAlign", "center center", 1, "open-close-button-content", "text-l"], ["class", "material-icons spin", 4, "ngIf", "ngIfElse"], [1, "material-icons", "spin"], ["mat-icon-button", "", "fxLayoutAlign", "center center", 3, "disabled"], [1, "material-icons"]], template: function OpenCloseButtonComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { disableFocusOnAction: "disableFocusOnAction", disabled: "disabled", isIcon: "isIcon", ariaLabelCode: "ariaLabelCode", isOpened: "isOpened" }, standalone: false, ngContentSelectors: _c0$7, decls: 2, vars: 2, consts: [["closed", ""], ["mat-button", "", 3, "disabled", "disableRipple", "ngClass.lt-md", 4, "ngIf"], ["mat-icon-button", "", "fxLayoutAlign", "center center", 3, "disabled", 4, "ngIf"], ["mat-button", "", 3, "disabled", "disableRipple", "ngClass.lt-md"], ["fxLayout", "row", "fxLayoutAlign", "center center"], ["fxLayoutAlign", "center center", 1, "open-close-button-content", "text-l"], ["class", "material-icons spin", 4, "ngIf", "ngIfElse"], [1, "material-icons", "spin"], ["mat-icon-button", "", "fxLayoutAlign", "center center", 3, "disabled"], [1, "material-icons"]], template: function OpenCloseButtonComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
-            i0.ɵɵtemplate(0, OpenCloseButtonComponent_button_0_Template, 8, 8, "button", 1)(1, OpenCloseButtonComponent_button_1_Template, 4, 5, "button", 2);
+            i0.ɵɵtemplate(0, OpenCloseButtonComponent_button_0_Template, 8, 9, "button", 1)(1, OpenCloseButtonComponent_button_1_Template, 4, 5, "button", 2);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", !ctx.isIcon);
             i0.ɵɵadvance();
@@ -4761,7 +4769,7 @@ class OpenCloseButtonComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(OpenCloseButtonComponent, [{
         type: Component,
-        args: [{ selector: 'lib-open-close-button', template: "<button\r\n  mat-button\r\n  *ngIf=\"!isIcon\"\r\n  [disabled]=\"disabled\"\r\n  [disableRipple]=\"true\"\r\n  [ngClass.lt-md]=\"'open-close-button-tablet'\"\r\n  [attr.aria-label]=\"ariaLabelCode | translate\">\r\n  <span fxLayout=\"row\" fxLayoutAlign=\"center center\">\r\n    <span class=\"open-close-button-content text-l\" fxLayoutAlign=\"center center\">\r\n      <ng-content></ng-content>\r\n    </span>\r\n\r\n    <span *ngIf=\"isOpened; else closed\" class=\"material-icons spin\">\r\n      {{ icons.open }}\r\n    </span>\r\n\r\n    <ng-template #closed>\r\n      <span class=\"material-icons spin\">\r\n        {{ icons.close }}\r\n      </span>\r\n    </ng-template>\r\n  </span>\r\n</button>\r\n<button\r\n  mat-icon-button\r\n  fxLayoutAlign=\"center center\"\r\n  *ngIf=\"isIcon\"\r\n  [disabled]=\"disabled\"\r\n  [attr.aria-label]=\"ariaLabelCode | translate\">\r\n  <span class=\"material-icons\">\r\n    {{ isOpened ? icons.open : icons.close }}\r\n  </span>\r\n</button>\r\n", styles: [".spin{animation:spinArrow .3s forwards}@keyframes spinArrow{to{transform:rotate(180deg)}}.material-icons{color:var(--base-30)}\n"] }]
+        args: [{ selector: 'lib-open-close-button', standalone: false, template: "<button\r\n  mat-button\r\n  *ngIf=\"!isIcon\"\r\n  [disabled]=\"disabled\"\r\n  [disableRipple]=\"true\"\r\n  [ngClass.lt-md]=\"'open-close-button-tablet'\"\r\n  [attr.aria-label]=\"ariaLabelCode | translate\"\r\n  [attr.aria-expanded]=\"isOpened\"  \r\n>\r\n  <span fxLayout=\"row\" fxLayoutAlign=\"center center\">\r\n    <span class=\"open-close-button-content text-l\" fxLayoutAlign=\"center center\">\r\n      <ng-content></ng-content>\r\n    </span>\r\n\r\n    <span *ngIf=\"isOpened; else closed\" class=\"material-icons spin\">\r\n      {{ icons.open }}\r\n    </span>\r\n\r\n    <ng-template #closed>\r\n      <span class=\"material-icons spin\">\r\n        {{ icons.close }}\r\n      </span>\r\n    </ng-template>\r\n  </span>\r\n</button>\r\n<button\r\n  mat-icon-button\r\n  fxLayoutAlign=\"center center\"\r\n  *ngIf=\"isIcon\"\r\n  [disabled]=\"disabled\"\r\n  [attr.aria-label]=\"ariaLabelCode | translate\">\r\n  <span class=\"material-icons\">\r\n    {{ isOpened ? icons.open : icons.close }}\r\n  </span>\r\n</button>\r\n", styles: [".spin{animation:spinArrow .3s forwards}@keyframes spinArrow{to{transform:rotate(180deg)}}.material-icons{color:var(--base-30)}\n"] }]
     }], () => [{ type: undefined, decorators: [{
                 type: Optional
             }, {
@@ -4781,7 +4789,7 @@ class OpenCloseButtonComponent {
             type: ViewChild,
             args: [MatButton]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OpenCloseButtonComponent, { className: "OpenCloseButtonComponent", filePath: "lib\\open-close-button\\open-close-button.component.ts", lineNumber: 11 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(OpenCloseButtonComponent, { className: "OpenCloseButtonComponent", filePath: "lib/open-close-button/open-close-button.component.ts", lineNumber: 12 }); })();
 
 class OpenCloseButtonModule {
     static { this.ɵfac = function OpenCloseButtonModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || OpenCloseButtonModule)(); }; }
@@ -5748,15 +5756,15 @@ class TerminologyCollectionCardComponent {
         return collection.termId !== null && collection.termEntries <= 0 || collection.default;
     }
     static { this.ɵfac = function TerminologyCollectionCardComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyCollectionCardComponent)(i0.ɵɵdirectiveInject(TerminologyService), i0.ɵɵdirectiveInject(TerminologyCollectionService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCollectionCardComponent, selectors: [["lib-terminology-collection-card"]], inputs: { collection: "collection", selected: "selected", localizationKey: "localizationKey", tooltipLocalizationKey: "tooltipLocalizationKey", sourceLanguageCode: "sourceLanguageCode", engineId: "engineId", targetLanguageCode: "targetLanguageCode", hasEditPermissions: "hasEditPermissions" }, outputs: { glossarySelectEvent: "glossarySelectEvent" }, decls: 1, vars: 1, consts: [["currentDirection", ""], [4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center"], ["fxFlex", "", "fxLayoutAlign", "center center", 3, "click", "disabled", "matTooltip"], [1, "collection-label"], ["class", "text-m-semi-bold", 3, "matTooltip", 4, "ngIf"], ["class", "text-m-semi-bold", 4, "ngIf"], ["class", "default-badge", 4, "ngIf"], [1, "collection-languages"], [4, "ngIf", "ngIfElse"], ["class", "collection-label-block text-s", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.5rem", 1, "collection-label-block", "collection-status-labels", "text-s"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.25rem", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.5rem", 4, "ngIf"], ["mat-button", "", "color", "primary", 3, "matTooltip", "click", 4, "ngIf"], [1, "text-m-semi-bold", 3, "matTooltip"], [1, "text-m-semi-bold"], [1, "default-badge"], [4, "ngFor", "ngForOf"], [1, "collection-label-block", "text-s"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.25rem"], ["color", "accent", 1, "material-icons", "collection-list-error"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.5rem"], ["color", "accent", "diameter", "20"], ["mat-button", "", "color", "primary", 3, "click", "matTooltip"], ["fxLayout", "row", "fxLayoutAlign", "start center", 1, "text-s"], [1, "pt-1"], ["class", "collection-list-edit", "mat-icon-button", "", "target", "_blank", 3, "matTooltip", 4, "ngIf"], ["mat-icon-button", "", "target", "_blank", 1, "collection-list-edit", 3, "matTooltip"], [1, "material-icons", "material-icons-outlined"]], template: function TerminologyCollectionCardComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCollectionCardComponent, selectors: [["lib-terminology-collection-card"]], inputs: { collection: "collection", selected: "selected", localizationKey: "localizationKey", tooltipLocalizationKey: "tooltipLocalizationKey", sourceLanguageCode: "sourceLanguageCode", engineId: "engineId", targetLanguageCode: "targetLanguageCode", hasEditPermissions: "hasEditPermissions" }, outputs: { glossarySelectEvent: "glossarySelectEvent" }, standalone: false, decls: 1, vars: 1, consts: [["currentDirection", ""], [4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center"], ["fxFlex", "", "fxLayoutAlign", "center center", 3, "click", "disabled", "matTooltip"], [1, "collection-label"], ["class", "text-m-semi-bold", 3, "matTooltip", 4, "ngIf"], ["class", "text-m-semi-bold", 4, "ngIf"], ["class", "default-badge", 4, "ngIf"], [1, "collection-languages"], [4, "ngIf", "ngIfElse"], ["class", "collection-label-block text-s", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.5rem", 1, "collection-label-block", "collection-status-labels", "text-s"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.25rem", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.5rem", 4, "ngIf"], ["mat-button", "", "color", "primary", 3, "matTooltip", "click", 4, "ngIf"], [1, "text-m-semi-bold", 3, "matTooltip"], [1, "text-m-semi-bold"], [1, "default-badge"], [4, "ngFor", "ngForOf"], [1, "collection-label-block", "text-s"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.25rem"], ["color", "accent", 1, "material-icons", "collection-list-error"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "0.5rem"], ["color", "accent", "diameter", "20"], ["mat-button", "", "color", "primary", 3, "click", "matTooltip"], ["fxLayout", "row", "fxLayoutAlign", "start center", 1, "text-s"], [1, "pt-1"], ["class", "collection-list-edit", "mat-icon-button", "", "target", "_blank", 3, "matTooltip", 4, "ngIf"], ["mat-icon-button", "", "target", "_blank", 1, "collection-list-edit", 3, "matTooltip"], [1, "material-icons", "material-icons-outlined"]], template: function TerminologyCollectionCardComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, TerminologyCollectionCardComponent_ng_container_0_Template, 20, 17, "ng-container", 1);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.collection);
-        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i2$3.DefaultFlexDirective, i2$1.MatButton, i2$1.MatIconAnchor, i1.MatIcon, i11.MatProgressSpinner, i5$1.MatRadioButton, i2$2.MatTooltip, i1$2.UpperCasePipe, i1$1.TranslatePipe, DateAgoPipe], styles: [".collection-languages[_ngcontent-%COMP%]{display:flex;gap:2px}.collection-languages[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px;border-radius:100px;padding-right:8px;padding-left:8px;color:var(--base-40);background-color:var(--base-70)}"] }); }
+        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i2$3.DefaultFlexDirective, i2$1.MatButton, i2$1.MatIconAnchor, i1.MatIcon, i2$5.MatProgressSpinner, i5.MatRadioButton, i2$2.MatTooltip, i1$2.UpperCasePipe, i1$1.TranslatePipe, DateAgoPipe], styles: [".collection-languages[_ngcontent-%COMP%]{display:flex;gap:2px}.collection-languages[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]{font-size:12px;border-radius:100px;padding-right:8px;padding-left:8px;color:var(--base-40);background-color:var(--base-70)}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TerminologyCollectionCardComponent, [{
         type: Component,
-        args: [{ selector: 'lib-terminology-collection-card', template: "<ng-container *ngIf=\"collection\">\r\n  <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\r\n    <mat-radio-button\r\n      fxFlex\r\n      fxLayoutAlign=\"center center\"\r\n      [class.mat-mdc-radio-checked]=\"collection.default || collection === selected\"\r\n      [disabled]=\"isSelectionDisabled\"\r\n      [matTooltip]=\"collection.termTooltipKey ? (tooltipLocalizationKey + collection.termTooltipKey | translate) : ''\"\r\n      (click)=\"selectGlossary(collection)\"\r\n    >\r\n      <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\r\n        <div class=\"collection-label\">\r\n          <span *ngIf=\"!collection.termTooltipKey\" class=\"text-m-semi-bold\" [matTooltip]=\"collection.name ?? ''\">\r\n            {{ collection.name }}\r\n          </span>\r\n\r\n          <span *ngIf=\"collection.termTooltipKey\" class=\"text-m-semi-bold\">\r\n            {{ collection.name }}\r\n          </span>\r\n        </div>\r\n  \r\n        <span *ngIf=\"collection.default\" class=\"default-badge\" >{{ localizationKey + \"DEFAULT\" | translate }}</span>\r\n      </div>\r\n\r\n      <div class=\"collection-languages\">\r\n        <ng-container *ngIf=\"collection.termCollection; else currentDirection\">\r\n          <span *ngFor=\"let lang of collection.termCollection.languages\">{{lang.id}}</span>\r\n        </ng-container>\r\n\r\n        <ng-template #currentDirection>\r\n          <span>{{sourceLanguageCode}}</span>\r\n          <span>{{targetLanguageCode}}</span>\r\n        </ng-template>\r\n      </div>\r\n  \r\n      <span *ngIf=\"collection.termCount\" class=\"collection-label-block text-s\">\r\n        {{ localizationKey + \"TERMS_IN_USE\" | translate : { termCount: collection.termCount } }}\r\n      </span>\r\n      <span *ngIf=\"collection.lastUpdated\" class=\"collection-label-block text-s\">\r\n        {{ localizationKey + \"LAST_UPDATED\" | translate : { date: collection.lastUpdated | dateAgo } }}\r\n      </span>\r\n  \r\n      <div class=\"collection-label-block collection-status-labels text-s\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"0.5rem\">\r\n        <div *ngIf=\"collection.mtStatus && collection.mtStatus === collectionErrorStatus\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"0.25rem\">\r\n          <span color=\"accent\" class=\"material-icons collection-list-error\"> error </span>\r\n  \r\n          <span *ngIf=\"collection.mtCollection?.subStatus === collectionImportingErrorSubStatus\">\r\n            {{ localizationKey + \"ERRORS.\" + (collection.mtCollection?.subStatus | uppercase) | translate }}\r\n          </span>\r\n        </div>\r\n  \r\n        <span *ngIf=\"collection.isImporting\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"0.5rem\">\r\n          <mat-spinner color=\"accent\" diameter=\"20\"> </mat-spinner>\r\n          <span>\r\n            {{ tooltipLocalizationKey + \"IMPORTING\" | translate }}\r\n          </span>\r\n        </span>\r\n  \r\n        <button *ngIf=\"collection.syncButtonVisible\" mat-button color=\"primary\" (click)=\"attach(collection); $event.stopPropagation()\" [matTooltip]=\"tooltipLocalizationKey + 'SYNC' | translate\">\r\n          <span fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"text-s\">\r\n            <mat-icon class=\"pt-1\">sync</mat-icon>\r\n            {{ localizationKey + \"SYNC\" | translate }}\r\n          </span>\r\n        </button>\r\n      </div>\r\n    </mat-radio-button>\r\n\r\n    <ng-container *ngIf=\"hasEditPermissions\">\r\n      <a\r\n        class=\"collection-list-edit\"\r\n        mat-icon-button\r\n        target=\"_blank\"\r\n        [matTooltip]=\"tooltipLocalizationKey + 'EDIT' | translate\"\r\n        [attr.href]=\"getEditLink(collection)\"\r\n        *ngIf=\"collection.termCollection\"\r\n      >\r\n        <mat-icon class=\"material-icons material-icons-outlined\">edit</mat-icon>\r\n      </a>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n", styles: [".collection-languages{display:flex;gap:2px}.collection-languages span{font-size:12px;border-radius:100px;padding-right:8px;padding-left:8px;color:var(--base-40);background-color:var(--base-70)}\n"] }]
+        args: [{ selector: 'lib-terminology-collection-card', standalone: false, template: "<ng-container *ngIf=\"collection\">\r\n  <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\r\n    <mat-radio-button\r\n      fxFlex\r\n      fxLayoutAlign=\"center center\"\r\n      [class.mat-mdc-radio-checked]=\"collection.default || collection === selected\"\r\n      [disabled]=\"isSelectionDisabled\"\r\n      [matTooltip]=\"collection.termTooltipKey ? (tooltipLocalizationKey + collection.termTooltipKey | translate) : ''\"\r\n      (click)=\"selectGlossary(collection)\"\r\n    >\r\n      <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\r\n        <div class=\"collection-label\">\r\n          <span *ngIf=\"!collection.termTooltipKey\" class=\"text-m-semi-bold\" [matTooltip]=\"collection.name ?? ''\">\r\n            {{ collection.name }}\r\n          </span>\r\n\r\n          <span *ngIf=\"collection.termTooltipKey\" class=\"text-m-semi-bold\">\r\n            {{ collection.name }}\r\n          </span>\r\n        </div>\r\n  \r\n        <span *ngIf=\"collection.default\" class=\"default-badge\" >{{ localizationKey + \"DEFAULT\" | translate }}</span>\r\n      </div>\r\n\r\n      <div class=\"collection-languages\">\r\n        <ng-container *ngIf=\"collection.termCollection; else currentDirection\">\r\n          <span *ngFor=\"let lang of collection.termCollection.languages\">{{lang.id}}</span>\r\n        </ng-container>\r\n\r\n        <ng-template #currentDirection>\r\n          <span>{{sourceLanguageCode}}</span>\r\n          <span>{{targetLanguageCode}}</span>\r\n        </ng-template>\r\n      </div>\r\n  \r\n      <span *ngIf=\"collection.termCount\" class=\"collection-label-block text-s\">\r\n        {{ localizationKey + \"TERMS_IN_USE\" | translate : { termCount: collection.termCount } }}\r\n      </span>\r\n      <span *ngIf=\"collection.lastUpdated\" class=\"collection-label-block text-s\">\r\n        {{ localizationKey + \"LAST_UPDATED\" | translate : { date: collection.lastUpdated | dateAgo } }}\r\n      </span>\r\n  \r\n      <div class=\"collection-label-block collection-status-labels text-s\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"0.5rem\">\r\n        <div *ngIf=\"collection.mtStatus && collection.mtStatus === collectionErrorStatus\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"0.25rem\">\r\n          <span color=\"accent\" class=\"material-icons collection-list-error\"> error </span>\r\n  \r\n          <span *ngIf=\"collection.mtCollection?.subStatus === collectionImportingErrorSubStatus\">\r\n            {{ localizationKey + \"ERRORS.\" + (collection.mtCollection?.subStatus | uppercase) | translate }}\r\n          </span>\r\n        </div>\r\n  \r\n        <span *ngIf=\"collection.isImporting\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"0.5rem\">\r\n          <mat-spinner color=\"accent\" diameter=\"20\"> </mat-spinner>\r\n          <span>\r\n            {{ tooltipLocalizationKey + \"IMPORTING\" | translate }}\r\n          </span>\r\n        </span>\r\n  \r\n        <button *ngIf=\"collection.syncButtonVisible\" mat-button color=\"primary\" (click)=\"attach(collection); $event.stopPropagation()\" [matTooltip]=\"tooltipLocalizationKey + 'SYNC' | translate\">\r\n          <span fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"text-s\">\r\n            <mat-icon class=\"pt-1\">sync</mat-icon>\r\n            {{ localizationKey + \"SYNC\" | translate }}\r\n          </span>\r\n        </button>\r\n      </div>\r\n    </mat-radio-button>\r\n\r\n    <ng-container *ngIf=\"hasEditPermissions\">\r\n      <a\r\n        class=\"collection-list-edit\"\r\n        mat-icon-button\r\n        target=\"_blank\"\r\n        [matTooltip]=\"tooltipLocalizationKey + 'EDIT' | translate\"\r\n        [attr.href]=\"getEditLink(collection)\"\r\n        *ngIf=\"collection.termCollection\"\r\n      >\r\n        <mat-icon class=\"material-icons material-icons-outlined\">edit</mat-icon>\r\n      </a>\r\n    </ng-container>\r\n  </div>\r\n</ng-container>\r\n", styles: [".collection-languages{display:flex;gap:2px}.collection-languages span{font-size:12px;border-radius:100px;padding-right:8px;padding-left:8px;color:var(--base-40);background-color:var(--base-70)}\n"] }]
     }], () => [{ type: TerminologyService }, { type: TerminologyCollectionService }], { collection: [{
             type: Input
         }], selected: [{
@@ -5776,7 +5784,7 @@ class TerminologyCollectionCardComponent {
         }], glossarySelectEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCollectionCardComponent, { className: "TerminologyCollectionCardComponent", filePath: "lib\\terminology\\components\\terminology-panel\\terminology-collection-list\\terminology-collection-card\\terminology-collection-card.component.ts", lineNumber: 11 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCollectionCardComponent, { className: "TerminologyCollectionCardComponent", filePath: "lib/terminology/components/terminology-panel/terminology-collection-list/terminology-collection-card/terminology-collection-card.component.ts", lineNumber: 12 }); })();
 
 const _c0$5 = (a0, a1) => ({ srcLang: a0, trgLang: a1 });
 function TerminologyCollectionListComponent_ng_container_5_Template(rf, ctx) { if (rf & 1) {
@@ -5896,7 +5904,7 @@ class TerminologyCollectionListComponent {
         this.destroy.complete();
     }
     static { this.ɵfac = function TerminologyCollectionListComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyCollectionListComponent)(i0.ɵɵdirectiveInject(TerminologyService), i0.ɵɵdirectiveInject(TerminologyConfigService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCollectionListComponent, selectors: [["lib-terminology-collection-list"]], inputs: { system: "system", selectedCollection: "selectedCollection" }, outputs: { glossarySelectEvent: "glossarySelectEvent" }, decls: 8, vars: 6, consts: [[1, "tld-collection-list-header"], [1, "term-window-title", "text-l-semi-bold"], [4, "ngIf"], ["class", "tld-collection-list-body", 4, "ngIf"], [1, "term-window-description", "text-s"], [1, "term-window-unavailable", "text-xl-semi-bold"], [1, "term-window-description", "text-m", 3, "innerHtml"], [1, "tld-collection-list-body"], ["fxLayout", "row", "fxLayoutAlign", "start center", 1, "none-option"], [3, "click"], [1, "text-m-semi-bold"], ["class", "collection", 4, "ngFor", "ngForOf"], [1, "collection"], ["class", "collection-card", 3, "collection", "engineId", "selected", "localizationKey", "tooltipLocalizationKey", "hasEditPermissions", "sourceLanguageCode", "targetLanguageCode", "glossarySelectEvent", 4, "ngIf"], [1, "collection-card", 3, "glossarySelectEvent", "collection", "engineId", "selected", "localizationKey", "tooltipLocalizationKey", "hasEditPermissions", "sourceLanguageCode", "targetLanguageCode"]], template: function TerminologyCollectionListComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCollectionListComponent, selectors: [["lib-terminology-collection-list"]], inputs: { system: "system", selectedCollection: "selectedCollection" }, outputs: { glossarySelectEvent: "glossarySelectEvent" }, standalone: false, decls: 8, vars: 6, consts: [[1, "tld-collection-list-header"], [1, "term-window-title", "text-l-semi-bold"], [4, "ngIf"], ["class", "tld-collection-list-body", 4, "ngIf"], [1, "term-window-description", "text-s"], [1, "term-window-unavailable", "text-xl-semi-bold"], [1, "term-window-description", "text-m", 3, "innerHtml"], [1, "tld-collection-list-body"], ["fxLayout", "row", "fxLayoutAlign", "start center", 1, "none-option"], [3, "click"], [1, "text-m-semi-bold"], ["class", "collection", 4, "ngFor", "ngForOf"], [1, "collection"], ["class", "collection-card", 3, "collection", "engineId", "selected", "localizationKey", "tooltipLocalizationKey", "hasEditPermissions", "sourceLanguageCode", "targetLanguageCode", "glossarySelectEvent", 4, "ngIf"], [1, "collection-card", 3, "glossarySelectEvent", "collection", "engineId", "selected", "localizationKey", "tooltipLocalizationKey", "hasEditPermissions", "sourceLanguageCode", "targetLanguageCode"]], template: function TerminologyCollectionListComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "header", 0)(1, "h1", 1)(2, "span");
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "translate");
@@ -5913,11 +5921,11 @@ class TerminologyCollectionListComponent {
             i0.ɵɵproperty("ngIf", !ctx.hasAnyCollections);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.hasAnyCollections);
-        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutAlignDirective, i5$1.MatRadioGroup, i5$1.MatRadioButton, TerminologyCollectionCardComponent, i1$1.TranslatePipe, LanguageTranslatePipe], styles: ["[_nghost-%COMP%]     .tld-collection-list-body, [_nghost-%COMP%]     .tld-collection-list-header{padding:.5em .75em}[_nghost-%COMP%]     .term-window-unavailable{font-style:italic}[_nghost-%COMP%]     .term-window-unavailable, [_nghost-%COMP%]     .term-window-description span{font-weight:500}[_nghost-%COMP%]     .collection-label{max-width:280px;overflow:hidden;text-overflow:ellipsis}[_nghost-%COMP%]     .collection-label-block{display:block}[_nghost-%COMP%]     .collection-status-labels .mat-icon, [_nghost-%COMP%]     .collection-status-labels .material-icons{font-size:18px}[_nghost-%COMP%]     .default-badge{background-color:#9aa5b1;color:var(--base-100);font-size:10px;border-radius:12px;padding:4px 8px;line-height:16px;display:inline-block;margin-left:5px}[_nghost-%COMP%]     .mat-mdc-radio-button{overflow:hidden;padding:5px 0;place-content:start!important}[_nghost-%COMP%]     .mat-mdc-radio-button .mat-radio-ripple{display:none}[_nghost-%COMP%]     .mat-mdc-radio-button .mat-mdc-button{padding:0!important}[_nghost-%COMP%]     .collection{min-height:70px}[_nghost-%COMP%]     .collection-card{width:100%}[_nghost-%COMP%]     .collection, [_nghost-%COMP%]     .none-option{border-bottom:1px solid var(--base-70)}[_nghost-%COMP%]     mat-spinner{display:inline-block}[_nghost-%COMP%]     .mdc-radio__inner-circle{transform:scale(0)!important}[_nghost-%COMP%]     .mdc-radio__outer-circle{border-color:inherit!important}[_nghost-%COMP%]     .mat-mdc-radio-checked .mdc-radio__inner-circle{transform:scale(.5)!important}[_nghost-%COMP%]     .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--accent)!important}[_nghost-%COMP%]     .mat-mdc-radio-checked .mdc-radio--disabled .mdc-radio__outer-circle{border-color:inherit!important}"] }); }
+        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutAlignDirective, i5.MatRadioGroup, i5.MatRadioButton, TerminologyCollectionCardComponent, i1$1.TranslatePipe, LanguageTranslatePipe], styles: ["[_nghost-%COMP%]     .tld-collection-list-body, [_nghost-%COMP%]     .tld-collection-list-header{padding:.5em .75em}[_nghost-%COMP%]     .term-window-unavailable{font-style:italic}[_nghost-%COMP%]     .term-window-unavailable, [_nghost-%COMP%]     .term-window-description span{font-weight:500}[_nghost-%COMP%]     .collection-label{max-width:280px;overflow:hidden;text-overflow:ellipsis}[_nghost-%COMP%]     .collection-label-block{display:block}[_nghost-%COMP%]     .collection-status-labels .mat-icon, [_nghost-%COMP%]     .collection-status-labels .material-icons{font-size:18px}[_nghost-%COMP%]     .default-badge{background-color:#9aa5b1;color:var(--base-100);font-size:10px;border-radius:12px;padding:4px 8px;line-height:16px;display:inline-block;margin-left:5px}[_nghost-%COMP%]     .mat-mdc-radio-button{overflow:hidden;padding:5px 0;place-content:start!important}[_nghost-%COMP%]     .mat-mdc-radio-button .mat-radio-ripple{display:none}[_nghost-%COMP%]     .mat-mdc-radio-button .mat-mdc-button{padding:0!important}[_nghost-%COMP%]     .collection{min-height:70px}[_nghost-%COMP%]     .collection-card{width:100%}[_nghost-%COMP%]     .collection, [_nghost-%COMP%]     .none-option{border-bottom:1px solid var(--base-70)}[_nghost-%COMP%]     mat-spinner{display:inline-block}[_nghost-%COMP%]     .mdc-radio__inner-circle{transform:scale(0)!important}[_nghost-%COMP%]     .mdc-radio__outer-circle{border-color:inherit!important}[_nghost-%COMP%]     .mat-mdc-radio-checked .mdc-radio__inner-circle{transform:scale(.5)!important}[_nghost-%COMP%]     .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--accent)!important}[_nghost-%COMP%]     .mat-mdc-radio-checked .mdc-radio--disabled .mdc-radio__outer-circle{border-color:inherit!important}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TerminologyCollectionListComponent, [{
         type: Component,
-        args: [{ selector: "lib-terminology-collection-list", template: "<header class=\"tld-collection-list-header\">\r\n  <h1 class=\"term-window-title text-l-semi-bold\">\r\n    <span>{{ localizationKey + \"TITLE\" | translate }}</span>\r\n  </h1>\r\n  <ng-container *ngIf=\"hasAnyCollections\">\r\n    <p class=\"term-window-description text-s\">\r\n      <span>{{ localizationKey + \"DESCRIPTION\" | translate }}</span>\r\n    </p>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!hasAnyCollections\">\r\n    <p class=\"term-window-unavailable text-xl-semi-bold\">\r\n      {{ localizationKey + \"UNAVAILABLE_GLOSSARIES\" | translate }}\r\n    </p>\r\n\r\n    <p [innerHtml]=\"localizationKey + 'DESCRIPTION_EMPTY' | translate : {\r\n      srcLang: system.sourceLanguageCode | languageTranslate,\r\n      trgLang: system.targetLanguageCode | languageTranslate\r\n    }\" class=\"term-window-description text-m\"></p>\r\n  </ng-container>\r\n</header>\r\n<div *ngIf=\"hasAnyCollections\" class=\"tld-collection-list-body\">\r\n  <mat-radio-group [attr.aria-label]=\"localizationKey + 'ARIA_LABELS.RADIO_GROUP' | translate\">\r\n    <div fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"none-option\">\r\n      <mat-radio-button [class.mat-mdc-radio-checked]=\"!selectedCollection\" (click)=\"selectGlossary(null)\">\r\n        <span class=\"text-m-semi-bold\">\r\n          {{ localizationKey + \"SELECTED_NONE\" | translate }}\r\n        </span>\r\n      </mat-radio-button>\r\n    </div>\r\n    <div class=\"collection\" *ngFor=\"let collection of collections\">\r\n      <lib-terminology-collection-card\r\n        *ngIf=\"collection.status\"\r\n        class=\"collection-card\"\r\n        [collection]=\"collection\"\r\n        [engineId]=\"system.systemId\"\r\n        [selected]=\"selectedCollection\"\r\n        [localizationKey]=\"localizationKey\"\r\n        [tooltipLocalizationKey]=\"tooltipLocalizationKey\"\r\n        [hasEditPermissions]=\"hasEditPermissions\"\r\n        [sourceLanguageCode]=\"system.sourceLanguageCode\"\r\n        [targetLanguageCode]=\"system.targetLanguageCode\"\r\n        (glossarySelectEvent)=\"selectGlossary($event)\"\r\n      ></lib-terminology-collection-card>\r\n    </div>\r\n  </mat-radio-group>\r\n</div>\r\n", styles: [":host ::ng-deep .tld-collection-list-body,:host ::ng-deep .tld-collection-list-header{padding:.5em .75em}:host ::ng-deep .term-window-unavailable{font-style:italic}:host ::ng-deep .term-window-unavailable,:host ::ng-deep .term-window-description span{font-weight:500}:host ::ng-deep .collection-label{max-width:280px;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .collection-label-block{display:block}:host ::ng-deep .collection-status-labels .mat-icon,:host ::ng-deep .collection-status-labels .material-icons{font-size:18px}:host ::ng-deep .default-badge{background-color:#9aa5b1;color:var(--base-100);font-size:10px;border-radius:12px;padding:4px 8px;line-height:16px;display:inline-block;margin-left:5px}:host ::ng-deep .mat-mdc-radio-button{overflow:hidden;padding:5px 0;place-content:start!important}:host ::ng-deep .mat-mdc-radio-button .mat-radio-ripple{display:none}:host ::ng-deep .mat-mdc-radio-button .mat-mdc-button{padding:0!important}:host ::ng-deep .collection{min-height:70px}:host ::ng-deep .collection-card{width:100%}:host ::ng-deep .collection,:host ::ng-deep .none-option{border-bottom:1px solid var(--base-70)}:host ::ng-deep mat-spinner{display:inline-block}:host ::ng-deep .mdc-radio__inner-circle{transform:scale(0)!important}:host ::ng-deep .mdc-radio__outer-circle{border-color:inherit!important}:host ::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{transform:scale(.5)!important}:host ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--accent)!important}:host ::ng-deep .mat-mdc-radio-checked .mdc-radio--disabled .mdc-radio__outer-circle{border-color:inherit!important}\n"] }]
+        args: [{ selector: "lib-terminology-collection-list", standalone: false, template: "<header class=\"tld-collection-list-header\">\r\n  <h1 class=\"term-window-title text-l-semi-bold\">\r\n    <span>{{ localizationKey + \"TITLE\" | translate }}</span>\r\n  </h1>\r\n  <ng-container *ngIf=\"hasAnyCollections\">\r\n    <p class=\"term-window-description text-s\">\r\n      <span>{{ localizationKey + \"DESCRIPTION\" | translate }}</span>\r\n    </p>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"!hasAnyCollections\">\r\n    <p class=\"term-window-unavailable text-xl-semi-bold\">\r\n      {{ localizationKey + \"UNAVAILABLE_GLOSSARIES\" | translate }}\r\n    </p>\r\n\r\n    <p [innerHtml]=\"localizationKey + 'DESCRIPTION_EMPTY' | translate : {\r\n      srcLang: system.sourceLanguageCode | languageTranslate,\r\n      trgLang: system.targetLanguageCode | languageTranslate\r\n    }\" class=\"term-window-description text-m\"></p>\r\n  </ng-container>\r\n</header>\r\n<div *ngIf=\"hasAnyCollections\" class=\"tld-collection-list-body\">\r\n  <mat-radio-group [attr.aria-label]=\"localizationKey + 'ARIA_LABELS.RADIO_GROUP' | translate\">\r\n    <div fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"none-option\">\r\n      <mat-radio-button [class.mat-mdc-radio-checked]=\"!selectedCollection\" (click)=\"selectGlossary(null)\">\r\n        <span class=\"text-m-semi-bold\">\r\n          {{ localizationKey + \"SELECTED_NONE\" | translate }}\r\n        </span>\r\n      </mat-radio-button>\r\n    </div>\r\n    <div class=\"collection\" *ngFor=\"let collection of collections\">\r\n      <lib-terminology-collection-card\r\n        *ngIf=\"collection.status\"\r\n        class=\"collection-card\"\r\n        [collection]=\"collection\"\r\n        [engineId]=\"system.systemId\"\r\n        [selected]=\"selectedCollection\"\r\n        [localizationKey]=\"localizationKey\"\r\n        [tooltipLocalizationKey]=\"tooltipLocalizationKey\"\r\n        [hasEditPermissions]=\"hasEditPermissions\"\r\n        [sourceLanguageCode]=\"system.sourceLanguageCode\"\r\n        [targetLanguageCode]=\"system.targetLanguageCode\"\r\n        (glossarySelectEvent)=\"selectGlossary($event)\"\r\n      ></lib-terminology-collection-card>\r\n    </div>\r\n  </mat-radio-group>\r\n</div>\r\n", styles: [":host ::ng-deep .tld-collection-list-body,:host ::ng-deep .tld-collection-list-header{padding:.5em .75em}:host ::ng-deep .term-window-unavailable{font-style:italic}:host ::ng-deep .term-window-unavailable,:host ::ng-deep .term-window-description span{font-weight:500}:host ::ng-deep .collection-label{max-width:280px;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .collection-label-block{display:block}:host ::ng-deep .collection-status-labels .mat-icon,:host ::ng-deep .collection-status-labels .material-icons{font-size:18px}:host ::ng-deep .default-badge{background-color:#9aa5b1;color:var(--base-100);font-size:10px;border-radius:12px;padding:4px 8px;line-height:16px;display:inline-block;margin-left:5px}:host ::ng-deep .mat-mdc-radio-button{overflow:hidden;padding:5px 0;place-content:start!important}:host ::ng-deep .mat-mdc-radio-button .mat-radio-ripple{display:none}:host ::ng-deep .mat-mdc-radio-button .mat-mdc-button{padding:0!important}:host ::ng-deep .collection{min-height:70px}:host ::ng-deep .collection-card{width:100%}:host ::ng-deep .collection,:host ::ng-deep .none-option{border-bottom:1px solid var(--base-70)}:host ::ng-deep mat-spinner{display:inline-block}:host ::ng-deep .mdc-radio__inner-circle{transform:scale(0)!important}:host ::ng-deep .mdc-radio__outer-circle{border-color:inherit!important}:host ::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{transform:scale(.5)!important}:host ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--accent)!important}:host ::ng-deep .mat-mdc-radio-checked .mdc-radio--disabled .mdc-radio__outer-circle{border-color:inherit!important}\n"] }]
     }], () => [{ type: TerminologyService }, { type: TerminologyConfigService }], { system: [{
             type: Input,
             args: [{ required: true }]
@@ -5926,7 +5934,7 @@ class TerminologyCollectionListComponent {
         }], glossarySelectEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCollectionListComponent, { className: "TerminologyCollectionListComponent", filePath: "lib\\terminology\\components\\terminology-panel\\terminology-collection-list\\terminology-collection-list.component.ts", lineNumber: 12 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCollectionListComponent, { className: "TerminologyCollectionListComponent", filePath: "lib/terminology/components/terminology-panel/terminology-collection-list/terminology-collection-list.component.ts", lineNumber: 13 }); })();
 
 const _c0$4 = (a0, a1) => ({ appName: a0, termPortalName: a1 });
 const _c1$1 = (a0, a1) => ({ minLength: a0, maxLength: a1 });
@@ -5976,7 +5984,7 @@ class TerminologyCreateCollectionDialogComponent {
         this.subscription.unsubscribe();
     }
     static { this.ɵfac = function TerminologyCreateCollectionDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyCreateCollectionDialogComponent)(i0.ɵɵdirectiveInject(i1$4.MatDialogRef), i0.ɵɵdirectiveInject(TerminologyConfigService), i0.ɵɵdirectiveInject(i1$1.TranslateService), i0.ɵɵdirectiveInject(i4$1.FormBuilder), i0.ɵɵdirectiveInject(MAT_DIALOG_DATA)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCreateCollectionDialogComponent, selectors: [["lib-terminology-create-collection-dialog"]], decls: 23, vars: 25, consts: [["mat-dialog-title", ""], ["mat-dialog-close", "", 1, "close-button"], ["mat-dialog-content", ""], [1, "main-description", 3, "innerHtml"], [1, "text-s", 3, "innerHtml"], [3, "formGroup"], ["appearance", "outline", 1, "collection-name-form-field"], ["matInput", "", "formControlName", "collectionName", 3, "keyup.enter"], [4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "end center", 1, "glossary-create-actions"], ["mat-stroked-button", "", "mat-dialog-close", "", "color", "accent"], ["mat-flat-button", "", "cdkFocusInitial", "", "color", "accent", 3, "click", "disabled"]], template: function TerminologyCreateCollectionDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCreateCollectionDialogComponent, selectors: [["lib-terminology-create-collection-dialog"]], standalone: false, decls: 23, vars: 25, consts: [["mat-dialog-title", ""], ["mat-dialog-close", "", 1, "close-button"], ["mat-dialog-content", ""], [1, "main-description", 3, "innerHtml"], [1, "text-s", 3, "innerHtml"], [3, "formGroup"], ["appearance", "outline", 1, "collection-name-form-field"], ["matInput", "", "formControlName", "collectionName", 3, "keyup.enter"], [4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "end center", 1, "glossary-create-actions"], ["mat-stroked-button", "", "mat-dialog-close", "", "color", "accent"], ["mat-flat-button", "", "cdkFocusInitial", "", "color", "accent", 3, "click", "disabled"]], template: function TerminologyCreateCollectionDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "h1", 0);
             i0.ɵɵtext(1);
             i0.ɵɵpipe(2, "translate");
@@ -6024,16 +6032,16 @@ class TerminologyCreateCollectionDialogComponent {
             i0.ɵɵproperty("disabled", ctx.form.invalid);
             i0.ɵɵadvance();
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(22, 20, "TERM_COLLECTIONS.CREATE_DIALOG.CREATE"));
-        } }, dependencies: [i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutAlignDirective, i4$1.ɵNgNoValidate, i4$1.DefaultValueAccessor, i4$1.NgControlStatus, i4$1.NgControlStatusGroup, i4$1.FormGroupDirective, i4$1.FormControlName, CloseButtonComponent, i2$1.MatButton, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, i9.MatInput, i10.MatFormField, i10.MatLabel, i10.MatError, i1$1.TranslatePipe], styles: ["input[_ngcontent-%COMP%]{outline:none!important}.create-dialog-wrapper[_ngcontent-%COMP%]{position:relative}.close-button[_ngcontent-%COMP%]{position:absolute;right:1em;top:1em}.main-description[_ngcontent-%COMP%]{margin-bottom:.25em}.collection-name-form-field[_ngcontent-%COMP%]{margin-top:2em}.mdc-dialog__content[_ngcontent-%COMP%]{padding:0 24px!important}"] }); }
+        } }, dependencies: [i1$2.NgIf, i2$3.DefaultLayoutDirective, i2$3.DefaultLayoutAlignDirective, i4$1.ɵNgNoValidate, i4$1.DefaultValueAccessor, i4$1.NgControlStatus, i4$1.NgControlStatusGroup, i4$1.FormGroupDirective, i4$1.FormControlName, CloseButtonComponent, i2$1.MatButton, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, i9.MatInput, i9.MatFormField, i9.MatLabel, i9.MatError, i1$1.TranslatePipe], styles: ["input[_ngcontent-%COMP%]{outline:none!important}.create-dialog-wrapper[_ngcontent-%COMP%]{position:relative}.close-button[_ngcontent-%COMP%]{position:absolute;right:1em;top:1em}.main-description[_ngcontent-%COMP%]{margin-bottom:.25em}.collection-name-form-field[_ngcontent-%COMP%]{margin-top:2em}.mdc-dialog__content[_ngcontent-%COMP%]{padding:0 24px!important}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TerminologyCreateCollectionDialogComponent, [{
         type: Component,
-        args: [{ selector: "lib-terminology-create-collection-dialog", template: "<h1 mat-dialog-title>{{ \"TERM_COLLECTIONS.CREATE_DIALOG.TITLE\" | translate }}</h1>\r\n<tld-close-button class=\"close-button\" mat-dialog-close> </tld-close-button>\r\n<div mat-dialog-content>\r\n  <p class=\"main-description\" [innerHtml]=\"'TERM_COLLECTIONS.CREATE_DIALOG.DESCRIPTION_1' | translate : { appName, termPortalName }\"></p>\r\n  <p class=\"text-s\" [innerHtml]=\"'TERM_COLLECTIONS.CREATE_DIALOG.DESCRIPTION_2' | translate\"></p>\r\n  <form [formGroup]=\"form\">\r\n    <mat-form-field appearance=\"outline\" class=\"collection-name-form-field\">\r\n      <mat-label>{{ \"TERM_COLLECTIONS.CREATE_DIALOG.COLLECTION_NAME_LABEL\" | translate }} </mat-label>\r\n      <input matInput formControlName=\"collectionName\" (keyup.enter)=\"create()\" />\r\n      <mat-error *ngIf=\"form.controls['collectionName'].errors\">{{ \"TERM_COLLECTIONS.CREATE_DIALOG.COLLECTION_NAME_ERROR\" | translate : { minLength: minLength, maxLength: maxLength } }}</mat-error>\r\n    </mat-form-field>\r\n</form>\r\n</div>\r\n<mat-dialog-actions fxLayout=\"row\" fxLayoutAlign=\"end center\" class=\"glossary-create-actions\">\r\n  <button mat-stroked-button mat-dialog-close color=\"accent\">{{ \"TERM_COLLECTIONS.CREATE_DIALOG.CANCEL\" | translate }}</button>\r\n  <button mat-flat-button (click)=\"create()\" cdkFocusInitial color=\"accent\" [disabled]=\"form.invalid\">{{ \"TERM_COLLECTIONS.CREATE_DIALOG.CREATE\" | translate }}</button>\r\n</mat-dialog-actions>\r\n", styles: ["input{outline:none!important}.create-dialog-wrapper{position:relative}.close-button{position:absolute;right:1em;top:1em}.main-description{margin-bottom:.25em}.collection-name-form-field{margin-top:2em}.mdc-dialog__content{padding:0 24px!important}\n"] }]
+        args: [{ selector: "lib-terminology-create-collection-dialog", standalone: false, template: "<h1 mat-dialog-title>{{ \"TERM_COLLECTIONS.CREATE_DIALOG.TITLE\" | translate }}</h1>\r\n<tld-close-button class=\"close-button\" mat-dialog-close> </tld-close-button>\r\n<div mat-dialog-content>\r\n  <p class=\"main-description\" [innerHtml]=\"'TERM_COLLECTIONS.CREATE_DIALOG.DESCRIPTION_1' | translate : { appName, termPortalName }\"></p>\r\n  <p class=\"text-s\" [innerHtml]=\"'TERM_COLLECTIONS.CREATE_DIALOG.DESCRIPTION_2' | translate\"></p>\r\n  <form [formGroup]=\"form\">\r\n    <mat-form-field appearance=\"outline\" class=\"collection-name-form-field\">\r\n      <mat-label>{{ \"TERM_COLLECTIONS.CREATE_DIALOG.COLLECTION_NAME_LABEL\" | translate }} </mat-label>\r\n      <input matInput formControlName=\"collectionName\" (keyup.enter)=\"create()\" />\r\n      <mat-error *ngIf=\"form.controls['collectionName'].errors\">{{ \"TERM_COLLECTIONS.CREATE_DIALOG.COLLECTION_NAME_ERROR\" | translate : { minLength: minLength, maxLength: maxLength } }}</mat-error>\r\n    </mat-form-field>\r\n</form>\r\n</div>\r\n<mat-dialog-actions fxLayout=\"row\" fxLayoutAlign=\"end center\" class=\"glossary-create-actions\">\r\n  <button mat-stroked-button mat-dialog-close color=\"accent\">{{ \"TERM_COLLECTIONS.CREATE_DIALOG.CANCEL\" | translate }}</button>\r\n  <button mat-flat-button (click)=\"create()\" cdkFocusInitial color=\"accent\" [disabled]=\"form.invalid\">{{ \"TERM_COLLECTIONS.CREATE_DIALOG.CREATE\" | translate }}</button>\r\n</mat-dialog-actions>\r\n", styles: ["input{outline:none!important}.create-dialog-wrapper{position:relative}.close-button{position:absolute;right:1em;top:1em}.main-description{margin-bottom:.25em}.collection-name-form-field{margin-top:2em}.mdc-dialog__content{padding:0 24px!important}\n"] }]
     }], () => [{ type: i1$4.MatDialogRef }, { type: TerminologyConfigService }, { type: i1$1.TranslateService }, { type: i4$1.FormBuilder }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
             }] }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCreateCollectionDialogComponent, { className: "TerminologyCreateCollectionDialogComponent", filePath: "lib\\terminology\\components\\terminology-panel\\terminology-create-collection\\terminology-create-collection-dialog\\terminology-create-collection-dialog.component.ts", lineNumber: 13 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCreateCollectionDialogComponent, { className: "TerminologyCreateCollectionDialogComponent", filePath: "lib/terminology/components/terminology-panel/terminology-create-collection/terminology-create-collection-dialog/terminology-create-collection-dialog.component.ts", lineNumber: 14 }); })();
 
 function TerminologyCreateCollectionComponent_button_0_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
@@ -6081,7 +6089,7 @@ class TerminologyCreateCollectionComponent {
         });
     }
     static { this.ɵfac = function TerminologyCreateCollectionComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyCreateCollectionComponent)(i0.ɵɵdirectiveInject(i1$1.TranslateService), i0.ɵɵdirectiveInject(i1$4.MatDialog), i0.ɵɵdirectiveInject(TerminologyService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCreateCollectionComponent, selectors: [["lib-terminology-create-collection"]], inputs: { sourceLanguageCode: "sourceLanguageCode", targetLanguageCode: "targetLanguageCode" }, outputs: { collectionCreated: "collectionCreated" }, decls: 1, vars: 1, consts: [["mat-flat-button", "", "color", "accent", "class", "term-create-btn", 3, "click", 4, "ngIf"], ["mat-flat-button", "", "color", "accent", 1, "term-create-btn", 3, "click"]], template: function TerminologyCreateCollectionComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyCreateCollectionComponent, selectors: [["lib-terminology-create-collection"]], inputs: { sourceLanguageCode: "sourceLanguageCode", targetLanguageCode: "targetLanguageCode" }, outputs: { collectionCreated: "collectionCreated" }, standalone: false, decls: 1, vars: 1, consts: [["mat-flat-button", "", "color", "accent", "class", "term-create-btn", 3, "click", 4, "ngIf"], ["mat-flat-button", "", "color", "accent", 1, "term-create-btn", 3, "click"]], template: function TerminologyCreateCollectionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, TerminologyCreateCollectionComponent_button_0_Template, 3, 3, "button", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.canCreateCollections);
@@ -6089,7 +6097,7 @@ class TerminologyCreateCollectionComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TerminologyCreateCollectionComponent, [{
         type: Component,
-        args: [{ selector: 'lib-terminology-create-collection', template: "<button *ngIf=\"canCreateCollections\" mat-flat-button color=\"accent\" (click)=\"create()\" class=\"term-create-btn\">\r\n  {{ \"TERM_COLLECTIONS.CREATE\" | translate }}\r\n</button>\r\n", styles: [".term-create-btn{white-space:nowrap}\n"] }]
+        args: [{ selector: 'lib-terminology-create-collection', standalone: false, template: "<button *ngIf=\"canCreateCollections\" mat-flat-button color=\"accent\" (click)=\"create()\" class=\"term-create-btn\">\r\n  {{ \"TERM_COLLECTIONS.CREATE\" | translate }}\r\n</button>\r\n", styles: [".term-create-btn{white-space:nowrap}\n"] }]
     }], () => [{ type: i1$1.TranslateService }, { type: i1$4.MatDialog }, { type: TerminologyService }], { sourceLanguageCode: [{
             type: Input
         }], targetLanguageCode: [{
@@ -6097,7 +6105,7 @@ class TerminologyCreateCollectionComponent {
         }], collectionCreated: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCreateCollectionComponent, { className: "TerminologyCreateCollectionComponent", filePath: "lib\\terminology\\components\\terminology-panel\\terminology-create-collection\\terminology-create-collection.component.ts", lineNumber: 13 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyCreateCollectionComponent, { className: "TerminologyCreateCollectionComponent", filePath: "lib/terminology/components/terminology-panel/terminology-create-collection/terminology-create-collection.component.ts", lineNumber: 14 }); })();
 
 const _c0$3 = (a0, a1) => ({ signInUrl: a0, startTrialUrl: a1 });
 function TerminologyPanelComponent_ng_container_1_footer_2_a_2_Template(rf, ctx) { if (rf & 1) {
@@ -6215,7 +6223,7 @@ class TerminologyPanelComponent {
         }
     }
     static { this.ɵfac = function TerminologyPanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyPanelComponent)(i0.ɵɵdirectiveInject(TerminologyService), i0.ɵɵdirectiveInject(TerminologyConfigService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyPanelComponent, selectors: [["lib-terminology-panel"]], inputs: { system: "system", setSelectedFromLocalStorage: "setSelectedFromLocalStorage", selectedCollection: "selectedCollection" }, outputs: { glossarySelectEvent: "glossarySelectEvent" }, features: [i0.ɵɵNgOnChangesFeature], decls: 4, vars: 2, consts: [["emptyView", ""], ["authEmptyView", ""], [1, "tld-collection-list-wrapper"], [4, "ngIf", "ngIfElse"], [3, "glossarySelectEvent", "system", "selectedCollection"], ["class", "tld-collection-list-footer", "fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "1rem", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "1rem", 1, "tld-collection-list-footer"], [3, "sourceLanguageCode", "targetLanguageCode"], ["class", "default-glossary-management text-m", "target", "_blank", 4, "ngIf"], ["target", "_blank", 1, "default-glossary-management", "text-m"], ["fxLayout", "column", "fxLayoutGap", "16px", 1, "term-reader-wrapper"], [1, "text-l-semi-bold"], [1, "text-xl-semi-bold", "glossary-unavailable"], [3, "innerHtml", 4, "ngIf", "ngIfElse"], [3, "innerHtml"]], template: function TerminologyPanelComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyPanelComponent, selectors: [["lib-terminology-panel"]], inputs: { system: "system", setSelectedFromLocalStorage: "setSelectedFromLocalStorage", selectedCollection: "selectedCollection" }, outputs: { glossarySelectEvent: "glossarySelectEvent" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 4, vars: 2, consts: [["emptyView", ""], ["authEmptyView", ""], [1, "tld-collection-list-wrapper"], [4, "ngIf", "ngIfElse"], [3, "glossarySelectEvent", "system", "selectedCollection"], ["class", "tld-collection-list-footer", "fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "1rem", 4, "ngIf"], ["fxLayout", "row", "fxLayoutAlign", "start center", "fxLayoutGap", "1rem", 1, "tld-collection-list-footer"], [3, "sourceLanguageCode", "targetLanguageCode"], ["class", "default-glossary-management text-m", "target", "_blank", 4, "ngIf"], ["target", "_blank", 1, "default-glossary-management", "text-m"], ["fxLayout", "column", "fxLayoutGap", "16px", 1, "term-reader-wrapper"], [1, "text-l-semi-bold"], [1, "text-xl-semi-bold", "glossary-unavailable"], [3, "innerHtml", 4, "ngIf", "ngIfElse"], [3, "innerHtml"]], template: function TerminologyPanelComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "section", 2);
             i0.ɵɵtemplate(1, TerminologyPanelComponent_ng_container_1_Template, 3, 3, "ng-container", 3)(2, TerminologyPanelComponent_ng_template_2_Template, 11, 8, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
             i0.ɵɵelementEnd();
@@ -6227,7 +6235,7 @@ class TerminologyPanelComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TerminologyPanelComponent, [{
         type: Component,
-        args: [{ selector: "lib-terminology-panel", template: "<section class=\"tld-collection-list-wrapper\">\r\n  <ng-container *ngIf=\"showGlossaryList; else emptyView\">\r\n    <lib-terminology-collection-list (glossarySelectEvent)=\"selectGlossary($event)\" [system]=\"system\" [selectedCollection]=\"selectedCollection\"></lib-terminology-collection-list>\r\n\r\n    <footer *ngIf=\"hasEditPermissions\" class=\"tld-collection-list-footer\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"1rem\">\r\n      <lib-terminology-create-collection [sourceLanguageCode]=\"sourceLanguageCode\" [targetLanguageCode]=\"targetLanguageCode\"></lib-terminology-create-collection>\r\n    \r\n      <a *ngIf=\"defaultGlossaryManagementLink\" [attr.href]=\"defaultGlossaryManagementLink\" class=\"default-glossary-management text-m\" target=\"_blank\">\r\n        {{ \"TERM_COLLECTIONS.DEFAULT_GLOSSARY_MANAGEMENT\" | translate }}\r\n      </a>\r\n    </footer>\r\n  </ng-container>\r\n  <ng-template #emptyView>\r\n    <section class=\"term-reader-wrapper\" fxLayout=\"column\" fxLayoutGap=\"16px\">\r\n      <div>\r\n        <h1 class=\"text-l-semi-bold\">{{ readerLocalizationKey + \"TITLE\" | translate }}</h1>\r\n        <p class=\"text-xl-semi-bold glossary-unavailable\">{{ readerLocalizationKey + \"UNAVAILABLE\" | translate }}</p>\r\n        <p *ngIf=\"!isAuthenticated; else authEmptyView\" [innerHtml]=\"readerLocalizationKey + 'TEXT' | translate: { signInUrl: signInUrl, startTrialUrl: startTrialUrl }\"></p>\r\n\r\n        <ng-template #authEmptyView>\r\n          <p>{{ readerLocalizationKey + \"AUTH_UNAVAILABLE\" | translate }}</p>\r\n        </ng-template>\r\n      </div>\r\n    </section>\r\n  </ng-template>\r\n</section>\r\n", styles: [".tld-collection-list-footer{margin-top:1rem;padding:0 .75em 1em}.default-glossary-management{display:block;color:var(--base-30)}.term-reader-wrapper{margin:1em}.glossary-unavailable{font-weight:500;font-style:italic}.hint-title{margin-bottom:0}\n"] }]
+        args: [{ selector: "lib-terminology-panel", standalone: false, template: "<section class=\"tld-collection-list-wrapper\">\r\n  <ng-container *ngIf=\"showGlossaryList; else emptyView\">\r\n    <lib-terminology-collection-list (glossarySelectEvent)=\"selectGlossary($event)\" [system]=\"system\" [selectedCollection]=\"selectedCollection\"></lib-terminology-collection-list>\r\n\r\n    <footer *ngIf=\"hasEditPermissions\" class=\"tld-collection-list-footer\" fxLayout=\"row\" fxLayoutAlign=\"start center\" fxLayoutGap=\"1rem\">\r\n      <lib-terminology-create-collection [sourceLanguageCode]=\"sourceLanguageCode\" [targetLanguageCode]=\"targetLanguageCode\"></lib-terminology-create-collection>\r\n    \r\n      <a *ngIf=\"defaultGlossaryManagementLink\" [attr.href]=\"defaultGlossaryManagementLink\" class=\"default-glossary-management text-m\" target=\"_blank\">\r\n        {{ \"TERM_COLLECTIONS.DEFAULT_GLOSSARY_MANAGEMENT\" | translate }}\r\n      </a>\r\n    </footer>\r\n  </ng-container>\r\n  <ng-template #emptyView>\r\n    <section class=\"term-reader-wrapper\" fxLayout=\"column\" fxLayoutGap=\"16px\">\r\n      <div>\r\n        <h1 class=\"text-l-semi-bold\">{{ readerLocalizationKey + \"TITLE\" | translate }}</h1>\r\n        <p class=\"text-xl-semi-bold glossary-unavailable\">{{ readerLocalizationKey + \"UNAVAILABLE\" | translate }}</p>\r\n        <p *ngIf=\"!isAuthenticated; else authEmptyView\" [innerHtml]=\"readerLocalizationKey + 'TEXT' | translate: { signInUrl: signInUrl, startTrialUrl: startTrialUrl }\"></p>\r\n\r\n        <ng-template #authEmptyView>\r\n          <p>{{ readerLocalizationKey + \"AUTH_UNAVAILABLE\" | translate }}</p>\r\n        </ng-template>\r\n      </div>\r\n    </section>\r\n  </ng-template>\r\n</section>\r\n", styles: [".tld-collection-list-footer{margin-top:1rem;padding:0 .75em 1em}.default-glossary-management{display:block;color:var(--base-30)}.term-reader-wrapper{margin:1em}.glossary-unavailable{font-weight:500;font-style:italic}.hint-title{margin-bottom:0}\n"] }]
     }], () => [{ type: TerminologyService }, { type: TerminologyConfigService }], { system: [{
             type: Input,
             args: [{ required: true }]
@@ -6239,7 +6247,7 @@ class TerminologyPanelComponent {
         }], glossarySelectEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyPanelComponent, { className: "TerminologyPanelComponent", filePath: "lib\\terminology\\components\\terminology-panel\\terminology-panel.component.ts", lineNumber: 11 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyPanelComponent, { className: "TerminologyPanelComponent", filePath: "lib/terminology/components/terminology-panel/terminology-panel.component.ts", lineNumber: 12 }); })();
 
 const COLLECTIONS_MENU = `
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
@@ -6447,7 +6455,7 @@ class TerminologyComponent {
         });
     }
     static { this.ɵfac = function TerminologyComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyComponent)(i0.ɵɵdirectiveInject(TerminologyConfigService), i0.ɵɵdirectiveInject(TerminologyService), i0.ɵɵdirectiveInject(IconService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyComponent, selectors: [["lib-terminology"]], inputs: { selectedCollectionId: "selectedCollectionId", system: "system", disabled: "disabled", storeSelectedInLocalStorage: "storeSelectedInLocalStorage", setSelectedFromLocalStorage: "setSelectedFromLocalStorage", showMenuIconOnMobile: "showMenuIconOnMobile" }, outputs: { glossarySelectEvent: "glossarySelectEvent", menuToggleEvent: "menuToggleEvent" }, features: [i0.ɵɵNgOnChangesFeature], decls: 6, vars: 4, consts: [["menu", "matMenu"], ["defaultLayout", ""], ["state", "matMenuTrigger"], ["class", "glossary-menu", "fxLayoutAlign", "center center", "fxLayoutGap", "8px", 3, "ngClass.lt-sm", 4, "ngIf"], [1, "tld-collection-menu"], ["fxHide.gt-xs", ""], [1, "tld-term-collection", 3, "click", "keydown"], [3, "glossarySelectEvent", "system", "selectedCollection", "setSelectedFromLocalStorage"], ["fxLayoutAlign", "center center", "fxLayoutGap", "8px", 1, "glossary-menu", 3, "ngClass.lt-sm"], ["fxHide.lt-md", "", 1, "glossary-label"], ["class", "tld-collection-menu-button", 3, "isOpened", "matMenuTriggerFor", "matTooltip", "disabled", "menuOpened", "menuClosed", 4, "ngIf", "ngIfElse"], [1, "tld-collection-menu-button", 3, "menuOpened", "menuClosed", "isOpened", "matMenuTriggerFor", "matTooltip", "disabled"], [1, "selected-collection"], ["class", "selected-col-spinner", "color", "accent", "diameter", "16", 4, "ngIf"], ["color", "accent", "diameter", "16", 1, "selected-col-spinner"], ["fxHide.lt-sm", "", 1, "tld-collection-menu-button", 3, "menuOpened", "menuClosed", "isOpened", "matMenuTriggerFor", "matTooltip", "disabled"], ["mat-icon-button", "", "fxHide.gt-xs", "", 3, "menuOpened", "menuClosed", "matMenuTriggerFor"], ["svgIcon", "collections_menu"]], template: function TerminologyComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TerminologyComponent, selectors: [["lib-terminology"]], inputs: { selectedCollectionId: "selectedCollectionId", system: "system", disabled: "disabled", storeSelectedInLocalStorage: "storeSelectedInLocalStorage", setSelectedFromLocalStorage: "setSelectedFromLocalStorage", showMenuIconOnMobile: "showMenuIconOnMobile" }, outputs: { glossarySelectEvent: "glossarySelectEvent", menuToggleEvent: "menuToggleEvent" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 6, vars: 4, consts: [["menu", "matMenu"], ["defaultLayout", ""], ["state", "matMenuTrigger"], ["class", "glossary-menu", "fxLayoutAlign", "center center", "fxLayoutGap", "8px", 3, "ngClass.lt-sm", 4, "ngIf"], [1, "tld-collection-menu"], ["fxHide.gt-xs", ""], [1, "tld-term-collection", 3, "click", "keydown"], [3, "glossarySelectEvent", "system", "selectedCollection", "setSelectedFromLocalStorage"], ["fxLayoutAlign", "center center", "fxLayoutGap", "8px", 1, "glossary-menu", 3, "ngClass.lt-sm"], ["fxHide.lt-md", "", 1, "glossary-label"], ["class", "tld-collection-menu-button", 3, "isOpened", "matMenuTriggerFor", "matTooltip", "disabled", "menuOpened", "menuClosed", 4, "ngIf", "ngIfElse"], [1, "tld-collection-menu-button", 3, "menuOpened", "menuClosed", "isOpened", "matMenuTriggerFor", "matTooltip", "disabled"], [1, "selected-collection"], ["class", "selected-col-spinner", "color", "accent", "diameter", "16", 4, "ngIf"], ["color", "accent", "diameter", "16", 1, "selected-col-spinner"], ["fxHide.lt-sm", "", 1, "tld-collection-menu-button", 3, "menuOpened", "menuClosed", "isOpened", "matMenuTriggerFor", "matTooltip", "disabled"], ["mat-icon-button", "", "fxHide.gt-xs", "", 3, "menuOpened", "menuClosed", "matMenuTriggerFor"], ["svgIcon", "collections_menu"]], template: function TerminologyComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵtemplate(0, TerminologyComponent_div_0_Template, 7, 6, "div", 3);
             i0.ɵɵelementStart(1, "mat-menu", 4, 0);
@@ -6461,11 +6469,11 @@ class TerminologyComponent {
             i0.ɵɵproperty("ngIf", !ctx.hideGlossaryMenuWithoutCollections || ctx.hideGlossaryMenuWithoutCollections && ctx.hasAnyCollections);
             i0.ɵɵadvance(5);
             i0.ɵɵproperty("system", ctx.system)("selectedCollection", ctx.selected)("setSelectedFromLocalStorage", ctx.setSelectedFromLocalStorage);
-        } }, dependencies: [i1$2.NgIf, OpenCloseButtonComponent, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i3.DefaultShowHideDirective, i3.DefaultClassDirective, CloseButtonComponent, i2$1.MatIconButton, i1.MatIcon, i11.MatProgressSpinner, i6$1.MatMenu, i6$1.MatMenuTrigger, i2$2.MatTooltip, TerminologyPanelComponent, i1$1.TranslatePipe], styles: ["[_nghost-%COMP%]     .mdc-circular-progress__circle-clipper, [_nghost-%COMP%]     .mdc-circular-progress__indeterminate-circle-graphic{width:100%!important}.selected-col-spinner[_ngcontent-%COMP%]{margin-left:5px}.tld-collection-menu-button[_ngcontent-%COMP%]   .selected-collection[_ngcontent-%COMP%]{overflow:hidden;text-overflow:ellipsis;max-width:140px;display:inline-block;white-space:nowrap}"] }); }
+        } }, dependencies: [i1$2.NgIf, OpenCloseButtonComponent, i2$3.DefaultLayoutGapDirective, i2$3.DefaultLayoutAlignDirective, i3.DefaultShowHideDirective, i3.DefaultClassDirective, CloseButtonComponent, i2$1.MatIconButton, i1.MatIcon, i2$5.MatProgressSpinner, i6$1.MatMenu, i6$1.MatMenuTrigger, i2$2.MatTooltip, TerminologyPanelComponent, i1$1.TranslatePipe], styles: ["[_nghost-%COMP%]     .mdc-circular-progress__circle-clipper, [_nghost-%COMP%]     .mdc-circular-progress__indeterminate-circle-graphic{width:100%!important}.selected-col-spinner[_ngcontent-%COMP%]{margin-left:5px}.tld-collection-menu-button[_ngcontent-%COMP%]   .selected-collection[_ngcontent-%COMP%]{overflow:hidden;text-overflow:ellipsis;max-width:140px;display:inline-block;white-space:nowrap}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TerminologyComponent, [{
         type: Component,
-        args: [{ selector: 'lib-terminology', template: "<div *ngIf=\"!hideGlossaryMenuWithoutCollections || (hideGlossaryMenuWithoutCollections && hasAnyCollections)\" class=\"glossary-menu\" fxLayoutAlign=\"center center\" [ngClass.lt-sm]=\"'tld-term-collection-wrapper-mobile'\" fxLayoutGap=\"8px\">\r\n  <span class=\"glossary-label\" fxHide.lt-md>\r\n    {{ \"TERM_COLLECTIONS.GLOSSARY\" | translate }}\r\n  </span>\r\n\r\n  <lib-open-close-button\r\n    *ngIf=\"!showMenuIconOnMobile; else defaultLayout\"\r\n    class=\"tld-collection-menu-button\"\r\n    #state=\"matMenuTrigger\"\r\n    [isOpened]=\"state.menuOpen\"\r\n    (menuOpened)=\"openMenu()\"\r\n    (menuClosed)=\"closeMenu()\"\r\n    [matMenuTriggerFor]=\"menu\"\r\n    [attr.aria-label]=\"'TERM_COLLECTIONS.ARIA_LABELS.OTHER_COLLECTIONS' | translate\"\r\n    [matTooltip]=\"selected?.mtCollection?.name ?? selected?.termCollection?.name ?? ''\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n    <span class=\"selected-collection\">\r\n      {{ selected?.mtCollection?.name ?? selected?.termCollection?.name ?? (\"TERM_COLLECTIONS.SELECTED_NONE\" | translate) }}\r\n    </span>\r\n    <mat-spinner *ngIf=\"selected?.isImporting\" class=\"selected-col-spinner\" color=\"accent\" diameter=\"16\"></mat-spinner>\r\n  </lib-open-close-button>\r\n\r\n  <ng-template #defaultLayout>\r\n    <lib-open-close-button\r\n      fxHide.lt-sm\r\n      class=\"tld-collection-menu-button\"\r\n      #state=\"matMenuTrigger\"\r\n      [isOpened]=\"state.menuOpen\"\r\n      (menuOpened)=\"openMenu()\"\r\n      (menuClosed)=\"closeMenu()\"\r\n      [matMenuTriggerFor]=\"menu\"\r\n      [attr.aria-label]=\"'TERM_COLLECTIONS.ARIA_LABELS.OTHER_COLLECTIONS' | translate\"\r\n      [matTooltip]=\"selected?.mtCollection?.name ?? selected?.termCollection?.name ?? ''\"\r\n      [disabled]=\"disabled\"\r\n    >\r\n      <span class=\"selected-collection\">\r\n        {{ selected?.mtCollection?.name ?? selected?.termCollection?.name ?? (\"TERM_COLLECTIONS.SELECTED_NONE\" | translate) }}\r\n      </span>\r\n      <mat-spinner *ngIf=\"selected?.isImporting\" class=\"selected-col-spinner\" color=\"accent\" diameter=\"16\"></mat-spinner>\r\n    </lib-open-close-button>\r\n\r\n    <button (menuOpened)=\"openMenu()\" (menuClosed)=\"closeMenu()\" mat-icon-button fxHide.gt-xs #state=\"matMenuTrigger\" [matMenuTriggerFor]=\"menu\">\r\n      <mat-icon svgIcon=\"collections_menu\" [attr.color]=\"selected ? 'accent' : ''\"></mat-icon>\r\n    </button>\r\n  </ng-template>\r\n</div>\r\n\r\n<mat-menu #menu=\"matMenu\" class=\"tld-collection-menu\">\r\n  <tld-close-button fxHide.gt-xs></tld-close-button>\r\n  <div class=\"tld-term-collection\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\r\n    <lib-terminology-panel (glossarySelectEvent)=\"selectGlossary($event)\" [system]=\"system\" [selectedCollection]=\"selected\" [setSelectedFromLocalStorage]=\"setSelectedFromLocalStorage\"></lib-terminology-panel>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep .mdc-circular-progress__circle-clipper,:host ::ng-deep .mdc-circular-progress__indeterminate-circle-graphic{width:100%!important}.selected-col-spinner{margin-left:5px}.tld-collection-menu-button .selected-collection{overflow:hidden;text-overflow:ellipsis;max-width:140px;display:inline-block;white-space:nowrap}\n"] }]
+        args: [{ selector: 'lib-terminology', standalone: false, template: "<div *ngIf=\"!hideGlossaryMenuWithoutCollections || (hideGlossaryMenuWithoutCollections && hasAnyCollections)\" class=\"glossary-menu\" fxLayoutAlign=\"center center\" [ngClass.lt-sm]=\"'tld-term-collection-wrapper-mobile'\" fxLayoutGap=\"8px\">\r\n  <span class=\"glossary-label\" fxHide.lt-md>\r\n    {{ \"TERM_COLLECTIONS.GLOSSARY\" | translate }}\r\n  </span>\r\n\r\n  <lib-open-close-button\r\n    *ngIf=\"!showMenuIconOnMobile; else defaultLayout\"\r\n    class=\"tld-collection-menu-button\"\r\n    #state=\"matMenuTrigger\"\r\n    [isOpened]=\"state.menuOpen\"\r\n    (menuOpened)=\"openMenu()\"\r\n    (menuClosed)=\"closeMenu()\"\r\n    [matMenuTriggerFor]=\"menu\"\r\n    [attr.aria-label]=\"'TERM_COLLECTIONS.ARIA_LABELS.OTHER_COLLECTIONS' | translate\"\r\n    [matTooltip]=\"selected?.mtCollection?.name ?? selected?.termCollection?.name ?? ''\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n    <span class=\"selected-collection\">\r\n      {{ selected?.mtCollection?.name ?? selected?.termCollection?.name ?? (\"TERM_COLLECTIONS.SELECTED_NONE\" | translate) }}\r\n    </span>\r\n    <mat-spinner *ngIf=\"selected?.isImporting\" class=\"selected-col-spinner\" color=\"accent\" diameter=\"16\"></mat-spinner>\r\n  </lib-open-close-button>\r\n\r\n  <ng-template #defaultLayout>\r\n    <lib-open-close-button\r\n      fxHide.lt-sm\r\n      class=\"tld-collection-menu-button\"\r\n      #state=\"matMenuTrigger\"\r\n      [isOpened]=\"state.menuOpen\"\r\n      (menuOpened)=\"openMenu()\"\r\n      (menuClosed)=\"closeMenu()\"\r\n      [matMenuTriggerFor]=\"menu\"\r\n      [attr.aria-label]=\"'TERM_COLLECTIONS.ARIA_LABELS.OTHER_COLLECTIONS' | translate\"\r\n      [matTooltip]=\"selected?.mtCollection?.name ?? selected?.termCollection?.name ?? ''\"\r\n      [disabled]=\"disabled\"\r\n    >\r\n      <span class=\"selected-collection\">\r\n        {{ selected?.mtCollection?.name ?? selected?.termCollection?.name ?? (\"TERM_COLLECTIONS.SELECTED_NONE\" | translate) }}\r\n      </span>\r\n      <mat-spinner *ngIf=\"selected?.isImporting\" class=\"selected-col-spinner\" color=\"accent\" diameter=\"16\"></mat-spinner>\r\n    </lib-open-close-button>\r\n\r\n    <button (menuOpened)=\"openMenu()\" (menuClosed)=\"closeMenu()\" mat-icon-button fxHide.gt-xs #state=\"matMenuTrigger\" [matMenuTriggerFor]=\"menu\">\r\n      <mat-icon svgIcon=\"collections_menu\" [attr.color]=\"selected ? 'accent' : ''\"></mat-icon>\r\n    </button>\r\n  </ng-template>\r\n</div>\r\n\r\n<mat-menu #menu=\"matMenu\" class=\"tld-collection-menu\">\r\n  <tld-close-button fxHide.gt-xs></tld-close-button>\r\n  <div class=\"tld-term-collection\" (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\r\n    <lib-terminology-panel (glossarySelectEvent)=\"selectGlossary($event)\" [system]=\"system\" [selectedCollection]=\"selected\" [setSelectedFromLocalStorage]=\"setSelectedFromLocalStorage\"></lib-terminology-panel>\r\n  </div>\r\n</mat-menu>\r\n", styles: [":host ::ng-deep .mdc-circular-progress__circle-clipper,:host ::ng-deep .mdc-circular-progress__indeterminate-circle-graphic{width:100%!important}.selected-col-spinner{margin-left:5px}.tld-collection-menu-button .selected-collection{overflow:hidden;text-overflow:ellipsis;max-width:140px;display:inline-block;white-space:nowrap}\n"] }]
     }], () => [{ type: TerminologyConfigService }, { type: TerminologyService }, { type: IconService }], { selectedCollectionId: [{
             type: Input
         }], system: [{
@@ -6484,7 +6492,7 @@ class TerminologyComponent {
         }], menuToggleEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyComponent, { className: "TerminologyComponent", filePath: "lib\\terminology\\terminology.component.ts", lineNumber: 14 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TerminologyComponent, { className: "TerminologyComponent", filePath: "lib/terminology/terminology.component.ts", lineNumber: 15 }); })();
 
 class TerminologyModule {
     static { this.ɵfac = function TerminologyModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TerminologyModule)(); }; }
@@ -6655,7 +6663,7 @@ class TextToSpeechComponent {
         }
     }
     static { this.ɵfac = function TextToSpeechComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TextToSpeechComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TextToSpeechComponent, selectors: [["lib-text-to-speech"]], inputs: { maxCharLength: "maxCharLength", voices: "voices" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 19, vars: 23, consts: [[1, "text-to-speech-wrapper", 3, "ngClass.lt-md"], ["appearance", "outline", "color", "accent"], [3, "valueChange", "value"], [3, "value", 4, "ngFor", "ngForOf"], [1, "text-to-speech-textarea-wrapper"], [1, "text-to-speech-textarea", 3, "ngModelChange", "ngModel", "placeholder"], [1, "text-to-speech-characters"], [1, "text-to-speech-actions"], [3, "matTooltip"], ["mat-icon-button", "", 3, "click", "matTooltip", "disabled"], [4, "ngIf"], [3, "diameter", 4, "ngIf"], [3, "value"], [3, "diameter"]], template: function TextToSpeechComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TextToSpeechComponent, selectors: [["lib-text-to-speech"]], inputs: { maxCharLength: "maxCharLength", voices: "voices" }, decls: 19, vars: 23, consts: [[1, "text-to-speech-wrapper", 3, "ngClass.lt-md"], ["appearance", "outline", "color", "accent"], [3, "valueChange", "value"], [3, "value", 4, "ngFor", "ngForOf"], [1, "text-to-speech-textarea-wrapper"], [1, "text-to-speech-textarea", 3, "ngModelChange", "ngModel", "placeholder"], [1, "text-to-speech-characters"], [1, "text-to-speech-actions"], [3, "matTooltip"], ["mat-icon-button", "", 3, "click", "matTooltip", "disabled"], [4, "ngIf"], [3, "diameter", 4, "ngIf"], [3, "value"], [3, "diameter"]], template: function TextToSpeechComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "mat-form-field", 1)(2, "mat-label");
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "translate");
@@ -6705,11 +6713,11 @@ class TextToSpeechComponent {
         } }, dependencies: [CommonModule, i1$2.NgForOf, i1$2.NgIf, MatIconButton,
             MatIcon,
             FormsModule, i4$1.DefaultValueAccessor, i4$1.NgControlStatus, i4$1.NgModel, MatProgressSpinner,
-            MatTooltipModule, i2$2.MatTooltip, MatFormFieldModule, i10.MatFormField, i10.MatLabel, MatSelectModule, i4.MatSelect, i5.MatOption, FlexLayoutModule, i3.DefaultClassDirective, TranslateModule, i1$1.TranslatePipe], styles: [".text-to-speech-wrapper[_ngcontent-%COMP%]{margin-top:5px;position:relative;display:flex;flex-direction:column;align-items:center}.text-to-speech-wrapper[_ngcontent-%COMP%]   mat-form-field[_ngcontent-%COMP%]{max-width:900px!important;width:100%}.text-to-speech-textarea-wrapper[_ngcontent-%COMP%], .text-to-speech-textarea[_ngcontent-%COMP%]{position:relative;width:100%;max-width:900px}.text-to-speech-textarea-wrapper[_ngcontent-%COMP%]{border:1px solid var(--base-70);padding:5px;border-radius:8px;box-shadow:0 0 16px #0000001a}.text-to-speech-textarea[_ngcontent-%COMP%]{margin:15px 0;padding:0 10px;min-height:120px;resize:none;outline:none;border:none}.text-to-speech-actions[_ngcontent-%COMP%]{position:absolute;bottom:-20px}.text-to-speech-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{display:flex;justify-content:center;color:var(--base-100)!important;background-color:var(--accent)}.text-to-speech-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:disabled{background-color:var(--base-70)}.text-to-speech-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   mat-spinner[_ngcontent-%COMP%]{scale:1.2}.text-to-speech-characters[_ngcontent-%COMP%]{position:absolute;right:10px;bottom:0;margin:5px;font-size:13px;color:var(--base-65)}.text-overflow[_ngcontent-%COMP%]{right:30px}.mobile[_ngcontent-%COMP%]   .text-overflow[_ngcontent-%COMP%]{right:15px}"] }); }
+            MatTooltipModule, i2$2.MatTooltip, MatFormFieldModule, i9.MatFormField, i9.MatLabel, MatSelectModule, i4.MatSelect, i4.MatOption, FlexLayoutModule, i3.DefaultClassDirective, TranslateModule, i1$1.TranslatePipe], styles: [".text-to-speech-wrapper[_ngcontent-%COMP%]{margin-top:5px;position:relative;display:flex;flex-direction:column;align-items:center}.text-to-speech-wrapper[_ngcontent-%COMP%]   mat-form-field[_ngcontent-%COMP%]{max-width:900px!important;width:100%}.text-to-speech-textarea-wrapper[_ngcontent-%COMP%], .text-to-speech-textarea[_ngcontent-%COMP%]{position:relative;width:100%;max-width:900px}.text-to-speech-textarea-wrapper[_ngcontent-%COMP%]{border:1px solid var(--base-70);padding:5px;border-radius:8px;box-shadow:0 0 16px #0000001a}.text-to-speech-textarea[_ngcontent-%COMP%]{margin:15px 0;padding:0 10px;min-height:120px;resize:none;outline:none;border:none}.text-to-speech-actions[_ngcontent-%COMP%]{position:absolute;bottom:-20px}.text-to-speech-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{display:flex;justify-content:center;color:var(--base-100)!important;background-color:var(--accent)}.text-to-speech-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:disabled{background-color:var(--base-70)}.text-to-speech-actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   mat-spinner[_ngcontent-%COMP%]{scale:1.2}.text-to-speech-characters[_ngcontent-%COMP%]{position:absolute;right:10px;bottom:0;margin:5px;font-size:13px;color:var(--base-65)}.text-overflow[_ngcontent-%COMP%]{right:30px}.mobile[_ngcontent-%COMP%]   .text-overflow[_ngcontent-%COMP%]{right:15px}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TextToSpeechComponent, [{
         type: Component,
-        args: [{ selector: 'lib-text-to-speech', standalone: true, imports: [
+        args: [{ selector: 'lib-text-to-speech', imports: [
                     CommonModule,
                     MatButton,
                     MatIconButton,
@@ -6727,7 +6735,7 @@ class TextToSpeechComponent {
         }], voices: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TextToSpeechComponent, { className: "TextToSpeechComponent", filePath: "lib\\text-to-speech\\text-to-speech.component.ts", lineNumber: 35 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TextToSpeechComponent, { className: "TextToSpeechComponent", filePath: "lib/text-to-speech/text-to-speech.component.ts", lineNumber: 34 }); })();
 
 var LLMActions;
 (function (LLMActions) {
@@ -6885,7 +6893,7 @@ class LLMTextareaComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.textarea = _t.first);
-        } }, inputs: { text: "text", disabled: "disabled", actionButtonsDisabled: "actionButtonsDisabled" }, outputs: { textEditEvent: "textEditEvent", dislikeEvent: "dislikeEvent", copyEvent: "copyEvent" }, features: [i0.ɵɵNgOnChangesFeature], decls: 18, vars: 13, consts: [["textarea", ""], [1, "llm-wrapper", 3, "ngClass.gt-lg"], [1, "llm-textarea-wrapper"], [1, "llm-textarea", 3, "formControl"], [1, "llm-textarea-actions"], [1, "material-icons-outlined", "llm-eu-data-tooltip", 3, "matTooltip"], ["mat-icon-button", "", 3, "click", "matTooltip", "disabled"], [1, "material-icons-outlined", "copy"], ["mat-icon-button", "", 3, "click", "disabled", "matTooltip"], [1, "material-icons-outlined", "dislike"]], template: function LLMTextareaComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { text: "text", disabled: "disabled", actionButtonsDisabled: "actionButtonsDisabled" }, outputs: { textEditEvent: "textEditEvent", dislikeEvent: "dislikeEvent", copyEvent: "copyEvent" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 18, vars: 13, consts: [["textarea", ""], [1, "llm-wrapper", 3, "ngClass.gt-lg"], [1, "llm-textarea-wrapper"], [1, "llm-textarea", 3, "formControl"], [1, "llm-textarea-actions"], [1, "material-icons-outlined", "llm-eu-data-tooltip", 3, "matTooltip"], ["mat-icon-button", "", 3, "click", "matTooltip", "disabled"], [1, "material-icons-outlined", "copy"], ["mat-icon-button", "", 3, "click", "disabled", "matTooltip"], [1, "material-icons-outlined", "dislike"]], template: function LLMTextareaComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div", 1)(1, "div", 2)(2, "textarea", 3, 0);
             i0.ɵɵtext(4, "    ");
@@ -6920,7 +6928,7 @@ class LLMTextareaComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMTextareaComponent, [{
         type: Component,
-        args: [{ selector: 'lib-llm-textarea', template: "<div [ngClass.gt-lg]=\"'desktop'\" class=\"llm-wrapper\">\r\n  <div class=\"llm-textarea-wrapper\">\r\n    <textarea\r\n      #textarea\r\n      class=\"llm-textarea\"\r\n      [formControl]=\"textareaControl\"\r\n    >\r\n    </textarea>\r\n\r\n    <div class=\"llm-textarea-actions\">\r\n      <mat-icon [matTooltip]=\"'LLM.EU_DATA_TOOLTIP' | translate\" class=\"material-icons-outlined llm-eu-data-tooltip\"> gpp_maybe </mat-icon>\r\n\r\n      <div>\r\n        <button [matTooltip]=\"'TOOLTIPS.DISLIKE' | translate\" (click)=\"dislike()\" mat-icon-button [disabled]=\"actionButtonsDisabled || !textareaControl.value\">\r\n          <mat-icon class=\"material-icons-outlined copy\"> thumb_down </mat-icon>\r\n        </button>\r\n  \r\n        <button\r\n          mat-icon-button\r\n          [disabled]=\"actionButtonsDisabled || !textareaControl.value\"\r\n          [matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n          (click)=\"copy()\"\r\n        >\r\n          <mat-icon class=\"material-icons-outlined dislike\"> content_copy </mat-icon>\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".llm-wrapper{position:relative;border:1px solid var(--base-65);border-radius:8px;overflow-y:auto}.llm-textarea-wrapper{position:relative}.llm-textarea{min-width:100%;min-height:310px;padding:8px 16px;resize:none;background:none;border-radius:8px;margin-bottom:46px}.desktop .llm-textarea{min-height:490px}.llm-textarea-actions{position:absolute;display:flex;justify-content:space-between;align-items:center;width:100%;bottom:4px}.llm-eu-data-tooltip{margin-left:16px}\n"] }]
+        args: [{ selector: 'lib-llm-textarea', standalone: false, template: "<div [ngClass.gt-lg]=\"'desktop'\" class=\"llm-wrapper\">\r\n  <div class=\"llm-textarea-wrapper\">\r\n    <textarea\r\n      #textarea\r\n      class=\"llm-textarea\"\r\n      [formControl]=\"textareaControl\"\r\n    >\r\n    </textarea>\r\n\r\n    <div class=\"llm-textarea-actions\">\r\n      <mat-icon [matTooltip]=\"'LLM.EU_DATA_TOOLTIP' | translate\" class=\"material-icons-outlined llm-eu-data-tooltip\"> gpp_maybe </mat-icon>\r\n\r\n      <div>\r\n        <button [matTooltip]=\"'TOOLTIPS.DISLIKE' | translate\" (click)=\"dislike()\" mat-icon-button [disabled]=\"actionButtonsDisabled || !textareaControl.value\">\r\n          <mat-icon class=\"material-icons-outlined copy\"> thumb_down </mat-icon>\r\n        </button>\r\n  \r\n        <button\r\n          mat-icon-button\r\n          [disabled]=\"actionButtonsDisabled || !textareaControl.value\"\r\n          [matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n          (click)=\"copy()\"\r\n        >\r\n          <mat-icon class=\"material-icons-outlined dislike\"> content_copy </mat-icon>\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".llm-wrapper{position:relative;border:1px solid var(--base-65);border-radius:8px;overflow-y:auto}.llm-textarea-wrapper{position:relative}.llm-textarea{min-width:100%;min-height:310px;padding:8px 16px;resize:none;background:none;border-radius:8px;margin-bottom:46px}.desktop .llm-textarea{min-height:490px}.llm-textarea-actions{position:absolute;display:flex;justify-content:space-between;align-items:center;width:100%;bottom:4px}.llm-eu-data-tooltip{margin-left:16px}\n"] }]
     }], () => [{ type: i1$6.Clipboard }], { textarea: [{
             type: ViewChild,
             args: ['textarea']
@@ -6937,7 +6945,7 @@ class LLMTextareaComponent {
         }], copyEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMTextareaComponent, { className: "LLMTextareaComponent", filePath: "lib\\llm\\shared\\llm-textarea\\llm-textarea.component.ts", lineNumber: 11 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMTextareaComponent, { className: "LLMTextareaComponent", filePath: "lib/llm/shared/llm-textarea/llm-textarea.component.ts", lineNumber: 12 }); })();
 
 const _c0$1 = (a0, a1) => ({ limit: a0, subscriptionUrl: a1 });
 function LLMTextareaWithActionsComponent_lib_tld_notification_message_6_Template(rf, ctx) { if (rf & 1) {
@@ -7196,7 +7204,7 @@ class LLMTextareaWithActionsComponent {
         };
     }
     static { this.ɵfac = function LLMTextareaWithActionsComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMTextareaWithActionsComponent)(i0.ɵɵdirectiveInject(i1$5.LLMService), i0.ɵɵdirectiveInject(LLMHelperService), i0.ɵɵdirectiveInject(MAT_DIALOG_DATA)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMTextareaWithActionsComponent, selectors: [["lib-llm-textarea-with-actions"]], decls: 20, vars: 22, consts: [["closeButton", ""], ["rephraseAction", ""], ["mat-dialog-title", ""], ["mat-dialog-content", ""], [3, "innerHTML"], [3, "message", "closeClicked", 4, "ngFor", "ngForOf"], ["color", "accent", "class", "w-full llm-writing-style-select", "appearance", "outline", 4, "ngIf"], [3, "textEditEvent", "copyEvent", "dislikeEvent", "text", "disabled", "actionButtonsDisabled"], ["mat-dialog-actions", "", 1, "llm-actions-wrapper"], ["class", "quota-left-message", 3, "innerHTML", 4, "ngIf"], [1, "llm-actions"], ["mat-button", "", "color", "accent", 3, "click", 4, "ngIf", "ngIfElse"], ["mat-flat-button", "", "color", "accent", 3, "click", "disabled"], [4, "ngIf", "ngIfElse"], ["color", "primary-accent-darker", 3, "diameter", 4, "ngIf"], [3, "closeClicked", "message"], ["color", "accent", "appearance", "outline", 1, "w-full", "llm-writing-style-select"], [3, "ngModelChange", "disabled", "ngModel"], [3, "value"], [1, "quota-left-message", 3, "innerHTML"], ["mat-button", "", "color", "accent", 3, "click"], ["mat-button", "", "color", "accent", 3, "mat-dialog-close"], ["color", "primary-accent-darker", 3, "diameter"]], template: function LLMTextareaWithActionsComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMTextareaWithActionsComponent, selectors: [["lib-llm-textarea-with-actions"]], standalone: false, decls: 20, vars: 22, consts: [["closeButton", ""], ["rephraseAction", ""], ["mat-dialog-title", ""], ["mat-dialog-content", ""], [3, "innerHTML"], [3, "message", "closeClicked", 4, "ngFor", "ngForOf"], ["color", "accent", "class", "w-full llm-writing-style-select", "appearance", "outline", 4, "ngIf"], [3, "textEditEvent", "copyEvent", "dislikeEvent", "text", "disabled", "actionButtonsDisabled"], ["mat-dialog-actions", "", 1, "llm-actions-wrapper"], ["class", "quota-left-message", 3, "innerHTML", 4, "ngIf"], [1, "llm-actions"], ["mat-button", "", "color", "accent", 3, "click", 4, "ngIf", "ngIfElse"], ["mat-flat-button", "", "color", "accent", 3, "click", "disabled"], [4, "ngIf", "ngIfElse"], ["color", "primary-accent-darker", 3, "diameter", 4, "ngIf"], [3, "closeClicked", "message"], ["color", "accent", "appearance", "outline", 1, "w-full", "llm-writing-style-select"], [3, "ngModelChange", "disabled", "ngModel"], [3, "value"], [1, "quota-left-message", 3, "innerHTML"], ["mat-button", "", "color", "accent", 3, "click"], ["mat-button", "", "color", "accent", 3, "mat-dialog-close"], ["color", "primary-accent-darker", 3, "diameter"]], template: function LLMTextareaWithActionsComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "h1", 2);
             i0.ɵɵtext(1);
@@ -7243,16 +7251,16 @@ class LLMTextareaWithActionsComponent {
             i0.ɵɵproperty("ngIf", ctx.llmActionType === ctx.llmActions.SUMMARY)("ngIfElse", rephraseAction_r9);
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("ngIf", ctx.isLoading);
-        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i2$1.MatButton, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, i4$1.NgControlStatus, i4$1.NgModel, i10.MatFormField, i10.MatLabel, i4.MatSelect, i5.MatOption, NotificationMessageComponent, i11.MatProgressSpinner, LLMTextareaComponent, i1$2.UpperCasePipe, i1$1.TranslatePipe], styles: [".info-icon[_ngcontent-%COMP%]{font-size:1rem;margin-left:5px}[_nghost-%COMP%]     .message-body{margin:0 2.25rem 0 0!important;font-size:14px}[_nghost-%COMP%]     .notification-message-container{margin:0 0 16px;padding:.9em 1em!important;align-items:center!important}[_nghost-%COMP%]     .text-container{margin-right:0!important}[_nghost-%COMP%]     tld-close-button{top:1px!important}  .multiline-tooltip{white-space:pre;min-width:fit-content}  .multiline-tooltip .mdc-tooltip__surface{max-width:none!important}[_nghost-%COMP%]     .llm-textarea{min-height:240px!important}[_nghost-%COMP%]     .rephrase .llm-textarea{min-height:100px!important}[_nghost-%COMP%]     .desktop .llm-textarea{min-height:460px!important}[_nghost-%COMP%]     .rephrase .desktop .llm-textarea{min-height:330px!important}.llm-writing-style-select[_ngcontent-%COMP%]{margin-top:1.25rem}.llm-writing-style[_ngcontent-%COMP%]{display:flex;align-items:center;margin-bottom:.25rem}.llm-actions-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:space-between;margin:0 1rem .5rem}.llm-actions[_ngcontent-%COMP%]{display:flex;justify-content:end}.w-full[_ngcontent-%COMP%]{width:100%}[_nghost-%COMP%]     .mdc-button__label{display:flex!important;align-items:center!important}mat-spinner[_ngcontent-%COMP%]{margin-left:.5rem}.quota-left-message[_ngcontent-%COMP%]{margin-bottom:12px}"] }); }
+        } }, dependencies: [i1$2.NgForOf, i1$2.NgIf, i2$1.MatButton, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, i4$1.NgControlStatus, i4$1.NgModel, i9.MatFormField, i9.MatLabel, i4.MatSelect, i4.MatOption, NotificationMessageComponent, i2$5.MatProgressSpinner, LLMTextareaComponent, i1$2.UpperCasePipe, i1$1.TranslatePipe], styles: [".info-icon[_ngcontent-%COMP%]{font-size:1rem;margin-left:5px}[_nghost-%COMP%]     .message-body{margin:0 2.25rem 0 0!important;font-size:14px}[_nghost-%COMP%]     .notification-message-container{margin:0 0 16px;padding:.9em 1em!important;align-items:center!important}[_nghost-%COMP%]     .text-container{margin-right:0!important}[_nghost-%COMP%]     tld-close-button{top:1px!important}  .multiline-tooltip{white-space:pre;min-width:fit-content}  .multiline-tooltip .mdc-tooltip__surface{max-width:none!important}[_nghost-%COMP%]     .llm-textarea{min-height:240px!important}[_nghost-%COMP%]     .rephrase .llm-textarea{min-height:100px!important}[_nghost-%COMP%]     .desktop .llm-textarea{min-height:460px!important}[_nghost-%COMP%]     .rephrase .desktop .llm-textarea{min-height:330px!important}.llm-writing-style-select[_ngcontent-%COMP%]{margin-top:1.25rem}.llm-writing-style[_ngcontent-%COMP%]{display:flex;align-items:center;margin-bottom:.25rem}.llm-actions-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:space-between;margin:0 1rem .5rem}.llm-actions[_ngcontent-%COMP%]{display:flex;justify-content:end}.w-full[_ngcontent-%COMP%]{width:100%}[_nghost-%COMP%]     .mdc-button__label{display:flex!important;align-items:center!important}mat-spinner[_ngcontent-%COMP%]{margin-left:.5rem}.quota-left-message[_ngcontent-%COMP%]{margin-bottom:12px}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMTextareaWithActionsComponent, [{
         type: Component,
-        args: [{ selector: 'lib-llm-textarea-with-actions', template: "<h1 mat-dialog-title>{{ localizationKey + \"TITLE\" | translate }}</h1>\r\n<div mat-dialog-content>\r\n  <p [innerHTML]=\"localizationKey + 'DESCRIPTION' | translate\"></p>\r\n\r\n  <lib-tld-notification-message *ngFor=\"let message of messages\" [message]=\"message\" (closeClicked)=\"closeMessage(message)\"></lib-tld-notification-message>\r\n\r\n  <mat-form-field *ngIf=\"showUseCase\" color=\"accent\" class=\"w-full llm-writing-style-select\" appearance=\"outline\">\r\n    <mat-label>{{ 'LLM.USE_CASES_LABEL' | translate }}</mat-label>\r\n    <mat-select [disabled]=\"isLoading\" [(ngModel)]=\"selectedUseCase\">\r\n      @for (useCase of useCases; track $index) {\r\n\r\n        <mat-option [value]=\"useCase\">\r\n          {{ 'LLM.USE_CASE.' + (useCase | uppercase) | translate }}\r\n        </mat-option>\r\n      }\r\n    </mat-select>\r\n  </mat-form-field>\r\n\r\n\r\n\r\n  <lib-llm-textarea [class.rephrase]=\"llmActionType === llmActions.REPHRASE\" [text]=\"editedText !== '' ? editedText : initialText\" [disabled]=\"isLoading || !quotaLeft\" [actionButtonsDisabled]=\"!isEdited\" (textEditEvent)=\"textEditEvent($event)\" (copyEvent)=\"copyPlausibleEvent()\" (dislikeEvent)=\"dislikePlausibleEvent()\"></lib-llm-textarea>\r\n</div>\r\n<div class=\"llm-actions-wrapper\" mat-dialog-actions>\r\n  <div *ngIf=\"remainingQuotaMessageVisible\" class=\"quota-left-message\" [innerHTML]=\"localizationKey + 'LIMIT' | translate: { limit: quotaLeft, subscriptionUrl: subscriptionUrl }\"></div>\r\n\r\n  <div [class.w-full]=\"!remainingQuotaMessageVisible\" class=\"llm-actions\">\r\n    <button *ngIf=\"isLoading; else closeButton\" mat-button color=\"accent\" (click)=\"cancel()\">\r\n      {{ localizationKey + \"CANCEL\" | translate }}\r\n    </button>\r\n\r\n    <ng-template #closeButton>\r\n      <button mat-button color=\"accent\" [mat-dialog-close]=\"null\">\r\n        {{ localizationKey + \"CLOSE\" | translate }}\r\n      </button>\r\n    </ng-template>\r\n\r\n    <button\r\n      mat-flat-button\r\n      color=\"accent\"\r\n      (click)=\"getEditedText()\"\r\n      [disabled]=\"isDisabled\"\r\n    >\r\n      <span *ngIf=\"llmActionType === llmActions.SUMMARY; else rephraseAction\">\r\n        {{\r\n          (!isSummarized\r\n            ? \"LLM.SUMMARY_MODAL.ACTION\"\r\n            : \"LLM.SUMMARY_MODAL.REGENERATE\"\r\n          ) | translate\r\n        }}\r\n      </span>\r\n\r\n      <ng-template #rephraseAction>\r\n        {{ localizationKey + \"ACTION\" | translate }}\r\n      </ng-template>\r\n      <mat-spinner *ngIf=\"isLoading\" [diameter]=\"20\" color=\"primary-accent-darker\"></mat-spinner>\r\n    </button>\r\n  </div>\r\n</div>\r\n", styles: [".info-icon{font-size:1rem;margin-left:5px}:host ::ng-deep .message-body{margin:0 2.25rem 0 0!important;font-size:14px}:host ::ng-deep .notification-message-container{margin:0 0 16px;padding:.9em 1em!important;align-items:center!important}:host ::ng-deep .text-container{margin-right:0!important}:host ::ng-deep tld-close-button{top:1px!important}::ng-deep .multiline-tooltip{white-space:pre;min-width:fit-content}::ng-deep .multiline-tooltip .mdc-tooltip__surface{max-width:none!important}:host ::ng-deep .llm-textarea{min-height:240px!important}:host ::ng-deep .rephrase .llm-textarea{min-height:100px!important}:host ::ng-deep .desktop .llm-textarea{min-height:460px!important}:host ::ng-deep .rephrase .desktop .llm-textarea{min-height:330px!important}.llm-writing-style-select{margin-top:1.25rem}.llm-writing-style{display:flex;align-items:center;margin-bottom:.25rem}.llm-actions-wrapper{display:flex;justify-content:space-between;margin:0 1rem .5rem}.llm-actions{display:flex;justify-content:end}.w-full{width:100%}:host ::ng-deep .mdc-button__label{display:flex!important;align-items:center!important}mat-spinner{margin-left:.5rem}.quota-left-message{margin-bottom:12px}\n"] }]
+        args: [{ selector: 'lib-llm-textarea-with-actions', standalone: false, template: "<h1 mat-dialog-title>{{ localizationKey + \"TITLE\" | translate }}</h1>\r\n<div mat-dialog-content>\r\n  <p [innerHTML]=\"localizationKey + 'DESCRIPTION' | translate\"></p>\r\n\r\n  <lib-tld-notification-message *ngFor=\"let message of messages\" [message]=\"message\" (closeClicked)=\"closeMessage(message)\"></lib-tld-notification-message>\r\n\r\n  <mat-form-field *ngIf=\"showUseCase\" color=\"accent\" class=\"w-full llm-writing-style-select\" appearance=\"outline\">\r\n    <mat-label>{{ 'LLM.USE_CASES_LABEL' | translate }}</mat-label>\r\n    <mat-select [disabled]=\"isLoading\" [(ngModel)]=\"selectedUseCase\">\r\n      @for (useCase of useCases; track $index) {\r\n\r\n        <mat-option [value]=\"useCase\">\r\n          {{ 'LLM.USE_CASE.' + (useCase | uppercase) | translate }}\r\n        </mat-option>\r\n      }\r\n    </mat-select>\r\n  </mat-form-field>\r\n\r\n\r\n\r\n  <lib-llm-textarea [class.rephrase]=\"llmActionType === llmActions.REPHRASE\" [text]=\"editedText !== '' ? editedText : initialText\" [disabled]=\"isLoading || !quotaLeft\" [actionButtonsDisabled]=\"!isEdited\" (textEditEvent)=\"textEditEvent($event)\" (copyEvent)=\"copyPlausibleEvent()\" (dislikeEvent)=\"dislikePlausibleEvent()\"></lib-llm-textarea>\r\n</div>\r\n<div class=\"llm-actions-wrapper\" mat-dialog-actions>\r\n  <div *ngIf=\"remainingQuotaMessageVisible\" class=\"quota-left-message\" [innerHTML]=\"localizationKey + 'LIMIT' | translate: { limit: quotaLeft, subscriptionUrl: subscriptionUrl }\"></div>\r\n\r\n  <div [class.w-full]=\"!remainingQuotaMessageVisible\" class=\"llm-actions\">\r\n    <button *ngIf=\"isLoading; else closeButton\" mat-button color=\"accent\" (click)=\"cancel()\">\r\n      {{ localizationKey + \"CANCEL\" | translate }}\r\n    </button>\r\n\r\n    <ng-template #closeButton>\r\n      <button mat-button color=\"accent\" [mat-dialog-close]=\"null\">\r\n        {{ localizationKey + \"CLOSE\" | translate }}\r\n      </button>\r\n    </ng-template>\r\n\r\n    <button\r\n      mat-flat-button\r\n      color=\"accent\"\r\n      (click)=\"getEditedText()\"\r\n      [disabled]=\"isDisabled\"\r\n    >\r\n      <span *ngIf=\"llmActionType === llmActions.SUMMARY; else rephraseAction\">\r\n        {{\r\n          (!isSummarized\r\n            ? \"LLM.SUMMARY_MODAL.ACTION\"\r\n            : \"LLM.SUMMARY_MODAL.REGENERATE\"\r\n          ) | translate\r\n        }}\r\n      </span>\r\n\r\n      <ng-template #rephraseAction>\r\n        {{ localizationKey + \"ACTION\" | translate }}\r\n      </ng-template>\r\n      <mat-spinner *ngIf=\"isLoading\" [diameter]=\"20\" color=\"primary-accent-darker\"></mat-spinner>\r\n    </button>\r\n  </div>\r\n</div>\r\n", styles: [".info-icon{font-size:1rem;margin-left:5px}:host ::ng-deep .message-body{margin:0 2.25rem 0 0!important;font-size:14px}:host ::ng-deep .notification-message-container{margin:0 0 16px;padding:.9em 1em!important;align-items:center!important}:host ::ng-deep .text-container{margin-right:0!important}:host ::ng-deep tld-close-button{top:1px!important}::ng-deep .multiline-tooltip{white-space:pre;min-width:fit-content}::ng-deep .multiline-tooltip .mdc-tooltip__surface{max-width:none!important}:host ::ng-deep .llm-textarea{min-height:240px!important}:host ::ng-deep .rephrase .llm-textarea{min-height:100px!important}:host ::ng-deep .desktop .llm-textarea{min-height:460px!important}:host ::ng-deep .rephrase .desktop .llm-textarea{min-height:330px!important}.llm-writing-style-select{margin-top:1.25rem}.llm-writing-style{display:flex;align-items:center;margin-bottom:.25rem}.llm-actions-wrapper{display:flex;justify-content:space-between;margin:0 1rem .5rem}.llm-actions{display:flex;justify-content:end}.w-full{width:100%}:host ::ng-deep .mdc-button__label{display:flex!important;align-items:center!important}mat-spinner{margin-left:.5rem}.quota-left-message{margin-bottom:12px}\n"] }]
     }], () => [{ type: i1$5.LLMService }, { type: LLMHelperService }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]
             }] }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMTextareaWithActionsComponent, { className: "LLMTextareaWithActionsComponent", filePath: "lib\\llm\\components\\llm-textarea-with-actions\\llm-textarea-with-actions.component.ts", lineNumber: 20 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMTextareaWithActionsComponent, { className: "LLMTextareaWithActionsComponent", filePath: "lib/llm/components/llm-textarea-with-actions/llm-textarea-with-actions.component.ts", lineNumber: 21 }); })();
 
 const SUMMARIZE = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M4 5H18.6286V6.82857H4V5ZM4 10.4857H18.6286V8.65714H4V10.4857ZM4 14.1429H10.4V12.3143H4V14.1429ZM4 17.8H10.4V15.9714H4V17.8Z" fill="currentColor"/>
@@ -7279,7 +7287,7 @@ class NewFeatureDialogComponent {
         this.data = inject(MAT_DIALOG_DATA);
     }
     static { this.ɵfac = function NewFeatureDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogComponent, selectors: [["lib-new-feature-dialog"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 10, vars: 9, consts: [["mat-dialog-title", ""], [1, "description", 3, "innerHTML"], ["mat-button", "", "mat-dialog-close", "", "color", "accent"]], template: function NewFeatureDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogComponent, selectors: [["lib-new-feature-dialog"]], decls: 10, vars: 9, consts: [["mat-dialog-title", ""], [1, "description", 3, "innerHTML"], ["mat-button", "", "mat-dialog-close", "", "color", "accent"]], template: function NewFeatureDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "h2", 0);
             i0.ɵɵtext(1);
             i0.ɵɵpipe(2, "translate");
@@ -7303,9 +7311,9 @@ class NewFeatureDialogComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogComponent, [{
         type: Component,
-        args: [{ selector: 'lib-new-feature-dialog', standalone: true, imports: [MatDialogModule, MatButtonModule, TranslatePipe], template: "<h2 mat-dialog-title>{{ data.title | translate }}</h2>\r\n<mat-dialog-content>\r\n  <p class=\"description\" [innerHTML]=\"data.description | translate\"></p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button mat-dialog-close color=\"accent\">\r\n    {{ data.close | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [":host ::ng-deep{display:inline-block;padding:12px 16px}:host ::ng-deep .mat-mdc-dialog-title,:host ::ng-deep mat-dialog-actions,:host ::ng-deep mat-dialog-content{padding:0!important;margin:0!important}\n"] }]
+        args: [{ selector: 'lib-new-feature-dialog', imports: [MatDialogModule, MatButtonModule, TranslatePipe], template: "<h2 mat-dialog-title>{{ data.title | translate }}</h2>\r\n<mat-dialog-content>\r\n  <p class=\"description\" [innerHTML]=\"data.description | translate\"></p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button mat-dialog-close color=\"accent\">\r\n    {{ data.close | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [":host ::ng-deep{display:inline-block;padding:12px 16px}:host ::ng-deep .mat-mdc-dialog-title,:host ::ng-deep mat-dialog-actions,:host ::ng-deep mat-dialog-content{padding:0!important;margin:0!important}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogComponent, { className: "NewFeatureDialogComponent", filePath: "lib\\new-feature-dialog\\new-feature-dialog.component.ts", lineNumber: 13 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogComponent, { className: "NewFeatureDialogComponent", filePath: "lib/new-feature-dialog/new-feature-dialog.component.ts", lineNumber: 12 }); })();
 
 class NewFeatureDialogService {
     constructor() {
@@ -7410,15 +7418,14 @@ class NewFeatureDialogWrapperComponent {
         }
     }
     static { this.ɵfac = function NewFeatureDialogWrapperComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogWrapperComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogWrapperComponent, selectors: [["lib-new-feature-dialog-wrapper"]], inputs: { titleLocalizationKey: "titleLocalizationKey", descriptionLocalizationKey: "descriptionLocalizationKey", closeLocalizationKey: "closeLocalizationKey", featureClassName: "featureClassName", featureLocalStorageKey: "featureLocalStorageKey", timeout: "timeout", maxWidth: "maxWidth", mobileScreenCustomPosition: "mobileScreenCustomPosition" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 0, vars: 0, template: function NewFeatureDialogWrapperComponent_Template(rf, ctx) { }, dependencies: [CommonModule, MatDialogModule], encapsulation: 2 }); }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogWrapperComponent, selectors: [["lib-new-feature-dialog-wrapper"]], inputs: { titleLocalizationKey: "titleLocalizationKey", descriptionLocalizationKey: "descriptionLocalizationKey", closeLocalizationKey: "closeLocalizationKey", featureClassName: "featureClassName", featureLocalStorageKey: "featureLocalStorageKey", timeout: "timeout", maxWidth: "maxWidth", mobileScreenCustomPosition: "mobileScreenCustomPosition" }, decls: 0, vars: 0, template: function NewFeatureDialogWrapperComponent_Template(rf, ctx) { }, dependencies: [CommonModule, MatDialogModule], encapsulation: 2 }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogWrapperComponent, [{
         type: Component,
         args: [{
                 selector: 'lib-new-feature-dialog-wrapper',
-                standalone: true,
                 imports: [CommonModule, MatDialogModule, NewFeatureDialogComponent],
-                template: '',
+                template: ''
             }]
     }], null, { titleLocalizationKey: [{
             type: Input
@@ -7437,7 +7444,7 @@ class NewFeatureDialogWrapperComponent {
         }], mobileScreenCustomPosition: [{
             type: Input
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogWrapperComponent, { className: "NewFeatureDialogWrapperComponent", filePath: "lib\\new-feature-dialog\\new-feature-dialog-wrapper\\new-feature-dialog-wrapper.component.ts", lineNumber: 16 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogWrapperComponent, { className: "NewFeatureDialogWrapperComponent", filePath: "lib/new-feature-dialog/new-feature-dialog-wrapper/new-feature-dialog-wrapper.component.ts", lineNumber: 15 }); })();
 
 class LLMSummaryComponent {
     constructor() {
@@ -7447,7 +7454,7 @@ class LLMSummaryComponent {
         this.openModalEvent.emit(LLMActions.SUMMARY);
     }
     static { this.ɵfac = function LLMSummaryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMSummaryComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMSummaryComponent, selectors: [["lib-llm-summary"]], inputs: { isTextSummarizable: "isTextSummarizable", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { openModalEvent: "openModalEvent" }, decls: 6, vars: 12, consts: [["summarizeFeature", ""], ["mat-stroked-button", "", "color", "accent", 1, "llm-summary", 3, "click", "disabled"], [3, "svgIcon"], [3, "titleLocalizationKey", "descriptionLocalizationKey", "closeLocalizationKey", "featureClassName", "featureLocalStorageKey"]], template: function LLMSummaryComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMSummaryComponent, selectors: [["lib-llm-summary"]], inputs: { isTextSummarizable: "isTextSummarizable", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { openModalEvent: "openModalEvent" }, standalone: false, decls: 6, vars: 12, consts: [["summarizeFeature", ""], ["mat-stroked-button", "", "color", "accent", 1, "llm-summary", 3, "click", "disabled"], [3, "svgIcon"], [3, "titleLocalizationKey", "descriptionLocalizationKey", "closeLocalizationKey", "featureClassName", "featureLocalStorageKey"]], template: function LLMSummaryComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "button", 1);
             i0.ɵɵlistener("click", function LLMSummaryComponent_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.openModal()); });
@@ -7470,7 +7477,7 @@ class LLMSummaryComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMSummaryComponent, [{
         type: Component,
-        args: [{ selector: 'lib-llm-summary', template: "<button\r\n\tmat-stroked-button\r\n\tclass=\"llm-summary\"\r\n\tcolor=\"accent\"\r\n\t[disabled]=\"!isTextSummarizable\"\r\n\t[class.summarize-feature-active]=\"summarizeFeature?.featureActive()\"\r\n\t(click)=\"openModal()\"\r\n>\r\n\t<mat-icon [svgIcon]=\"'summarize'\"></mat-icon>\r\n\t{{ \"LLM.SUMMARY\" | translate }}\r\n</button>\r\n\r\n<lib-new-feature-dialog-wrapper\r\n\t#summarizeFeature\r\n\t[titleLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.TITLE'\"\r\n\t[descriptionLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.DESCRIPTION'\"\r\n\t[closeLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.CLOSE'\"\r\n\t[featureClassName]=\"'llm-summary'\"\r\n\t[featureLocalStorageKey]=\"'summary' + newFeatureLocalStorageKey\"\r\n></lib-new-feature-dialog-wrapper>\r\n", styles: ["::ng-deep .summarize-feature-active{z-index:1001!important;background-color:#fff!important}\n"] }]
+        args: [{ selector: 'lib-llm-summary', standalone: false, template: "<button\r\n\tmat-stroked-button\r\n\tclass=\"llm-summary\"\r\n\tcolor=\"accent\"\r\n\t[disabled]=\"!isTextSummarizable\"\r\n\t[class.summarize-feature-active]=\"summarizeFeature?.featureActive()\"\r\n\t(click)=\"openModal()\"\r\n>\r\n\t<mat-icon [svgIcon]=\"'summarize'\"></mat-icon>\r\n\t{{ \"LLM.SUMMARY\" | translate }}\r\n</button>\r\n\r\n<lib-new-feature-dialog-wrapper\r\n\t#summarizeFeature\r\n\t[titleLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.TITLE'\"\r\n\t[descriptionLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.DESCRIPTION'\"\r\n\t[closeLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.CLOSE'\"\r\n\t[featureClassName]=\"'llm-summary'\"\r\n\t[featureLocalStorageKey]=\"'summary' + newFeatureLocalStorageKey\"\r\n></lib-new-feature-dialog-wrapper>\r\n", styles: ["::ng-deep .summarize-feature-active{z-index:1001!important;background-color:#fff!important}\n"] }]
     }], null, { isTextSummarizable: [{
             type: Input
         }], newFeatureLocalStorageKey: [{
@@ -7478,7 +7485,7 @@ class LLMSummaryComponent {
         }], openModalEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMSummaryComponent, { className: "LLMSummaryComponent", filePath: "lib\\llm\\components\\llm-summary\\llm-summary.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMSummaryComponent, { className: "LLMSummaryComponent", filePath: "lib/llm/components/llm-summary/llm-summary.component.ts", lineNumber: 10 }); })();
 
 class LLMRephraseComponent {
     constructor() {
@@ -7488,7 +7495,7 @@ class LLMRephraseComponent {
         this.openModalEvent.emit(LLMActions.REPHRASE);
     }
     static { this.ɵfac = function LLMRephraseComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMRephraseComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMRephraseComponent, selectors: [["lib-llm-rephrase"]], inputs: { isTargetLanguageRephrasable: "isTargetLanguageRephrasable", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { openModalEvent: "openModalEvent" }, decls: 6, vars: 13, consts: [["rephraseFeature", ""], ["mat-stroked-button", "", "color", "accent", 1, "llm-rephrase", 3, "click", "disabled"], [3, "svgIcon"], [3, "titleLocalizationKey", "descriptionLocalizationKey", "closeLocalizationKey", "featureClassName", "featureLocalStorageKey", "maxWidth"]], template: function LLMRephraseComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMRephraseComponent, selectors: [["lib-llm-rephrase"]], inputs: { isTargetLanguageRephrasable: "isTargetLanguageRephrasable", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { openModalEvent: "openModalEvent" }, standalone: false, decls: 6, vars: 13, consts: [["rephraseFeature", ""], ["mat-stroked-button", "", "color", "accent", 1, "llm-rephrase", 3, "click", "disabled"], [3, "svgIcon"], [3, "titleLocalizationKey", "descriptionLocalizationKey", "closeLocalizationKey", "featureClassName", "featureLocalStorageKey", "maxWidth"]], template: function LLMRephraseComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "button", 1);
             i0.ɵɵlistener("click", function LLMRephraseComponent_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.openModal()); });
@@ -7511,7 +7518,7 @@ class LLMRephraseComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMRephraseComponent, [{
         type: Component,
-        args: [{ selector: 'lib-llm-rephrase', template: "<button\r\n\tmat-stroked-button\r\n\tclass=\"llm-rephrase\"\r\n\tcolor=\"accent\"\r\n\t[disabled]=\"!isTargetLanguageRephrasable\"\r\n\t[class.rephrase-feature-active]=\"rephraseFeature?.featureActive()\"\r\n\t(click)=\"openModal()\"\r\n>\r\n\t<mat-icon [svgIcon]=\"'rephrase'\"></mat-icon>\r\n\t{{ \"LLM.REPHRASE\" | translate }}\r\n</button>\r\n\r\n<lib-new-feature-dialog-wrapper\r\n\t#rephraseFeature\r\n\t[titleLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.TITLE'\"\r\n\t[descriptionLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.DESCRIPTION'\"\r\n\t[closeLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.CLOSE'\"\r\n\t[featureClassName]=\"'llm-rephrase'\"\r\n\t[featureLocalStorageKey]=\"'rephrase' + newFeatureLocalStorageKey\"\r\n\t[maxWidth]=\"400\"\r\n></lib-new-feature-dialog-wrapper>\r\n", styles: ["::ng-deep .rephrase-feature-active{z-index:1001!important;background-color:#fff!important}\n"] }]
+        args: [{ selector: 'lib-llm-rephrase', standalone: false, template: "<button\r\n\tmat-stroked-button\r\n\tclass=\"llm-rephrase\"\r\n\tcolor=\"accent\"\r\n\t[disabled]=\"!isTargetLanguageRephrasable\"\r\n\t[class.rephrase-feature-active]=\"rephraseFeature?.featureActive()\"\r\n\t(click)=\"openModal()\"\r\n>\r\n\t<mat-icon [svgIcon]=\"'rephrase'\"></mat-icon>\r\n\t{{ \"LLM.REPHRASE\" | translate }}\r\n</button>\r\n\r\n<lib-new-feature-dialog-wrapper\r\n\t#rephraseFeature\r\n\t[titleLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.TITLE'\"\r\n\t[descriptionLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.DESCRIPTION'\"\r\n\t[closeLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.CLOSE'\"\r\n\t[featureClassName]=\"'llm-rephrase'\"\r\n\t[featureLocalStorageKey]=\"'rephrase' + newFeatureLocalStorageKey\"\r\n\t[maxWidth]=\"400\"\r\n></lib-new-feature-dialog-wrapper>\r\n", styles: ["::ng-deep .rephrase-feature-active{z-index:1001!important;background-color:#fff!important}\n"] }]
     }], null, { isTargetLanguageRephrasable: [{
             type: Input
         }], newFeatureLocalStorageKey: [{
@@ -7519,7 +7526,7 @@ class LLMRephraseComponent {
         }], openModalEvent: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMRephraseComponent, { className: "LLMRephraseComponent", filePath: "lib\\llm\\components\\llm-rephrase\\llm-rephrase.component.ts", lineNumber: 9 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMRephraseComponent, { className: "LLMRephraseComponent", filePath: "lib/llm/components/llm-rephrase/llm-rephrase.component.ts", lineNumber: 10 }); })();
 
 function LLMComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
@@ -7591,7 +7598,7 @@ class LLMComponent {
         });
     }
     static { this.ɵfac = function LLMComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMComponent)(i0.ɵɵdirectiveInject(i1$4.MatDialog), i0.ɵɵdirectiveInject(IconService), i0.ɵɵdirectiveInject(LanguageTranslateService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMComponent, selectors: [["lib-llm"]], inputs: { text: "text", language: "language", rephrasableLanguagesCodeList: "rephrasableLanguagesCodeList", summaryEnabled: "summaryEnabled", rephraseEnabled: "rephraseEnabled", showUseCaseSummary: "showUseCaseSummary", showUseCaseRephrase: "showUseCaseRephrase", newFeatureLocalStorageKey: "newFeatureLocalStorageKey", rephraseUseCases: "rephraseUseCases", summaryUseCases: "summaryUseCases" }, outputs: { menuTriggerClick: "menuTriggerClick" }, decls: 3, vars: 2, consts: [[1, "llm-wrapper"], [3, "matTooltipPosition", "matTooltip", 4, "ngIf"], [3, "matTooltipPosition", "matTooltip"], [3, "openModalEvent", "isTextSummarizable", "newFeatureLocalStorageKey"], [3, "openModalEvent", "isTargetLanguageRephrasable", "newFeatureLocalStorageKey"]], template: function LLMComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMComponent, selectors: [["lib-llm"]], inputs: { text: "text", language: "language", rephrasableLanguagesCodeList: "rephrasableLanguagesCodeList", summaryEnabled: "summaryEnabled", rephraseEnabled: "rephraseEnabled", showUseCaseSummary: "showUseCaseSummary", showUseCaseRephrase: "showUseCaseRephrase", newFeatureLocalStorageKey: "newFeatureLocalStorageKey", rephraseUseCases: "rephraseUseCases", summaryUseCases: "summaryUseCases" }, outputs: { menuTriggerClick: "menuTriggerClick" }, standalone: false, decls: 3, vars: 2, consts: [[1, "llm-wrapper"], [3, "matTooltipPosition", "matTooltip", 4, "ngIf"], [3, "matTooltipPosition", "matTooltip"], [3, "openModalEvent", "isTextSummarizable", "newFeatureLocalStorageKey"], [3, "openModalEvent", "isTargetLanguageRephrasable", "newFeatureLocalStorageKey"]], template: function LLMComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵtemplate(1, LLMComponent_div_1_Template, 3, 6, "div", 1)(2, LLMComponent_div_2_Template, 3, 6, "div", 1);
             i0.ɵɵelementEnd();
@@ -7604,7 +7611,7 @@ class LLMComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMComponent, [{
         type: Component,
-        args: [{ selector: 'lib-llm', template: "<div class=\"llm-wrapper\">\r\n\t<div *ngIf=\"summaryEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTextSummarizable ? ('LLM.MENU_SUMMARY_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<lib-llm-summary [isTextSummarizable]=\"!!isTextSummarizable\" [newFeatureLocalStorageKey]=\"newFeatureLocalStorageKey\" (openModalEvent)=\"openLLMModal($event)\"></lib-llm-summary>\r\n\t</div>\r\n\r\n\t<div *ngIf=\"rephraseEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTargetLanguageRephrasable ? ('LLM.MENU_REPHRASE_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<lib-llm-rephrase\r\n\t\t\t[isTargetLanguageRephrasable]=\"!!isTargetLanguageRephrasable\"\r\n\t\t\t[newFeatureLocalStorageKey]=\"newFeatureLocalStorageKey\"\r\n\t\t\t(openModalEvent)=\"openLLMModal($event)\"\r\n\t\t></lib-llm-rephrase>\r\n\t</div>\r\n</div>\r\n", styles: [".llm-wrapper{display:flex;gap:8px}\n"] }]
+        args: [{ selector: 'lib-llm', standalone: false, template: "<div class=\"llm-wrapper\">\r\n\t<div *ngIf=\"summaryEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTextSummarizable ? ('LLM.MENU_SUMMARY_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<lib-llm-summary [isTextSummarizable]=\"!!isTextSummarizable\" [newFeatureLocalStorageKey]=\"newFeatureLocalStorageKey\" (openModalEvent)=\"openLLMModal($event)\"></lib-llm-summary>\r\n\t</div>\r\n\r\n\t<div *ngIf=\"rephraseEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTargetLanguageRephrasable ? ('LLM.MENU_REPHRASE_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<lib-llm-rephrase\r\n\t\t\t[isTargetLanguageRephrasable]=\"!!isTargetLanguageRephrasable\"\r\n\t\t\t[newFeatureLocalStorageKey]=\"newFeatureLocalStorageKey\"\r\n\t\t\t(openModalEvent)=\"openLLMModal($event)\"\r\n\t\t></lib-llm-rephrase>\r\n\t</div>\r\n</div>\r\n", styles: [".llm-wrapper{display:flex;gap:8px}\n"] }]
     }], () => [{ type: i1$4.MatDialog }, { type: IconService }, { type: LanguageTranslateService }], { text: [{
             type: Input
         }], language: [{
@@ -7628,7 +7635,7 @@ class LLMComponent {
         }], menuTriggerClick: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMComponent, { className: "LLMComponent", filePath: "lib\\llm\\llm.component.ts", lineNumber: 16 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMComponent, { className: "LLMComponent", filePath: "lib/llm/llm.component.ts", lineNumber: 17 }); })();
 
 class LLMModule {
     static { this.ɵfac = function LLMModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMModule)(); }; }
@@ -7727,7 +7734,7 @@ class SidebarComponent {
         return this.#sidebarService.contentTemplate;
     }
     static { this.ɵfac = function SidebarComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SidebarComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SidebarComponent, selectors: [["lib-sidebar"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 2, vars: 3, consts: [[1, "sidebar-wrapper"], [3, "ngTemplateOutlet"]], template: function SidebarComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SidebarComponent, selectors: [["lib-sidebar"]], decls: 2, vars: 3, consts: [[1, "sidebar-wrapper"], [3, "ngTemplateOutlet"]], template: function SidebarComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "section", 0);
             i0.ɵɵelementContainer(1, 1);
             i0.ɵɵelementEnd();
@@ -7739,9 +7746,9 @@ class SidebarComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SidebarComponent, [{
         type: Component,
-        args: [{ selector: 'lib-sidebar', standalone: true, imports: [CommonModule], template: "<section [class.expanded]=\"isOpen\" class=\"sidebar-wrapper\">\r\n  <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\r\n</section>\r\n", styles: [".sidebar-wrapper{padding:0;max-height:100vh;height:100%;overflow-y:auto;width:0;border-left:2px solid var(--base-95);transition:width .2s ease}.sidebar-wrapper.expanded{width:300px;padding:28px 26px}@media (max-width: 640px){.sidebar-wrapper.expanded{position:absolute;right:0;top:0;width:100%;background-color:var(--base-100)}}\n"] }]
+        args: [{ selector: 'lib-sidebar', imports: [CommonModule], template: "<section [class.expanded]=\"isOpen\" class=\"sidebar-wrapper\">\r\n  <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\r\n</section>\r\n", styles: [".sidebar-wrapper{padding:0;max-height:100vh;height:100%;overflow-y:auto;width:0;border-left:2px solid var(--base-95);transition:width .2s ease}.sidebar-wrapper.expanded{width:300px;padding:28px 26px}@media (max-width: 640px){.sidebar-wrapper.expanded{position:absolute;right:0;top:0;width:100%;background-color:var(--base-100)}}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SidebarComponent, { className: "SidebarComponent", filePath: "lib\\sidebar\\sidebar.component.ts", lineNumber: 12 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SidebarComponent, { className: "SidebarComponent", filePath: "lib/sidebar/sidebar.component.ts", lineNumber: 11 }); })();
 
 class ToastService {
     constructor() {
@@ -7814,7 +7821,7 @@ class ToastComponent {
         this.#toast.closeToast(id);
     }
     static { this.ɵfac = function ToastComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ToastComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ToastComponent, selectors: [["lib-toast"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 3, vars: 0, consts: [[1, "toast-container"], [1, "toast"], ["mat-icon-button", "", 3, "click"]], template: function ToastComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ToastComponent, selectors: [["lib-toast"]], decls: 3, vars: 0, consts: [[1, "toast-container"], [1, "toast"], ["mat-icon-button", "", 3, "click"]], template: function ToastComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵrepeaterCreate(1, ToastComponent_For_2_Template, 7, 4, "div", 1, _forTrack0);
             i0.ɵɵelementEnd();
@@ -7825,9 +7832,9 @@ class ToastComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ToastComponent, [{
         type: Component,
-        args: [{ selector: 'lib-toast', standalone: true, imports: [CommonModule, MatIconModule, MatButtonModule, TranslateModule], template: "<div class=\"toast-container\">\r\n  @for (toast of toasts; track toast.id) {\r\n  <div class=\"toast\">\r\n    <span>{{ toast.message | translate: toast?.localizationParams }}</span>\r\n    <button mat-icon-button (click)=\"closeToast(toast.id)\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".toast-container{display:flex;flex-direction:column;align-items:center;width:100%;position:fixed;bottom:50px}.toast{max-width:fit-content;position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:slide-in .5s forwards}.toast:not(:first-of-type){margin-top:10px}.fade-out{animation:fade-out .5s forwards}:host ::ng-deep .mat-icon{color:#feedee}@keyframes slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}\n"] }]
+        args: [{ selector: 'lib-toast', imports: [CommonModule, MatIconModule, MatButtonModule, TranslateModule], template: "<div class=\"toast-container\">\r\n  @for (toast of toasts; track toast.id) {\r\n  <div class=\"toast\">\r\n    <span>{{ toast.message | translate: toast?.localizationParams }}</span>\r\n    <button mat-icon-button (click)=\"closeToast(toast.id)\">\r\n      <mat-icon>close</mat-icon>\r\n    </button>\r\n  </div>\r\n  }\r\n</div>\r\n", styles: [".toast-container{display:flex;flex-direction:column;align-items:center;width:100%;position:fixed;bottom:50px}.toast{max-width:fit-content;position:relative;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:400;min-width:350px;padding:4px 4px 4px 16px;letter-spacing:.25px;line-height:20px;border-radius:4px;box-shadow:0 1px 3px #0000004d;box-shadow:0 4px 8px 3px #00000026;color:#feedee;background-color:#382e2f;animation:slide-in .5s forwards}.toast:not(:first-of-type){margin-top:10px}.fade-out{animation:fade-out .5s forwards}:host ::ng-deep .mat-icon{color:#feedee}@keyframes slide-in{0%{margin-bottom:-50px;opacity:0}to{margin-bottom:0;opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ToastComponent, { className: "ToastComponent", filePath: "lib\\toast\\toast.component.ts", lineNumber: 16 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ToastComponent, { className: "ToastComponent", filePath: "lib/toast/toast.component.ts", lineNumber: 15 }); })();
 
 var SubscriptionPlan;
 (function (SubscriptionPlan) {
@@ -7941,7 +7948,7 @@ class SelectLanguageDialogComponent {
         this.#dialogRef.close(this.selectedLanguage);
     }
     static { this.ɵfac = function SelectLanguageDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SelectLanguageDialogComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SelectLanguageDialogComponent, selectors: [["lib-extension-dialog"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 23, vars: 20, consts: [["mat-dialog-title", ""], ["mat-dialog-content", ""], [1, "description"], ["appearance", "outline", 1, "w-full", "mt-4", "mb-9"], [3, "ngModelChange", "ngModel"], [3, "value"], ["align", "end"], ["mat-stroked-button", "", "color", "accent", "mat-dialog-close", ""], ["mat-flat-button", "", "color", "accent", 3, "click"], [1, "language-name"]], template: function SelectLanguageDialogComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SelectLanguageDialogComponent, selectors: [["lib-extension-dialog"]], decls: 23, vars: 20, consts: [["mat-dialog-title", ""], ["mat-dialog-content", ""], [1, "description"], ["appearance", "outline", 1, "w-full", "mt-4", "mb-9"], [3, "ngModelChange", "ngModel"], [3, "value"], ["align", "end"], ["mat-stroked-button", "", "color", "accent", "mat-dialog-close", ""], ["mat-flat-button", "", "color", "accent", 3, "click"], [1, "language-name"]], template: function SelectLanguageDialogComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "h1", 0);
             i0.ɵɵtext(1);
             i0.ɵɵpipe(2, "translate");
@@ -7987,11 +7994,11 @@ class SelectLanguageDialogComponent {
         } }, dependencies: [SortLanguageListPipe,
             AsyncPipe,
             TranslatePipe,
-            MatDialogModule, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, MatButtonModule, i2$1.MatButton, MatSelectModule, i10.MatFormField, i10.MatLabel, i4.MatSelect, i5.MatOption, FormsModule, i4$1.NgControlStatus, i4$1.NgModel], styles: [".description[_ngcontent-%COMP%]{color:var(--base-40)}.w-full[_ngcontent-%COMP%]{width:100%}.mt-4[_ngcontent-%COMP%]{margin-top:1.5rem!important}"] }); }
+            MatDialogModule, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, MatButtonModule, i2$1.MatButton, MatSelectModule, i9.MatFormField, i9.MatLabel, i4.MatSelect, i4.MatOption, FormsModule, i4$1.NgControlStatus, i4$1.NgModel], styles: [".description[_ngcontent-%COMP%]{color:var(--base-40)}.w-full[_ngcontent-%COMP%]{width:100%}.mt-4[_ngcontent-%COMP%]{margin-top:1.5rem!important}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SelectLanguageDialogComponent, [{
         type: Component,
-        args: [{ selector: 'lib-extension-dialog', standalone: true, imports: [
+        args: [{ selector: 'lib-extension-dialog', imports: [
                     SortLanguageListPipe,
                     AsyncPipe,
                     TranslatePipe,
@@ -8001,7 +8008,7 @@ class SelectLanguageDialogComponent {
                     FormsModule
                 ], template: "<h1 mat-dialog-title>{{ \"SELECT_LANGUAGE.TITLE\" | translate }}</h1>\r\n<div mat-dialog-content>\r\n  <p class=\"description\">{{ \"SELECT_LANGUAGE.DESCRIPTION\" | translate }}</p>\r\n\r\n  <mat-form-field appearance=\"outline\" class=\"w-full mt-4 mb-9\">\r\n    <mat-label>{{ \"SELECT_LANGUAGE.INPUT_LABEL\" | translate }}</mat-label>\r\n    <mat-select [(ngModel)]=\"selectedLanguage\">\r\n      @for (language of languages | sortLanguageList | async; track $index) {\r\n      <mat-option [value]=\"language.value\">\r\n        <span class=\"language-name\">\r\n          {{language.translation}}\r\n        </span>\r\n      </mat-option>\r\n      }\r\n    </mat-select>\r\n  </mat-form-field>\r\n</div>\r\n\r\n<mat-dialog-actions align=\"end\">\r\n  <button mat-stroked-button color=\"accent\" mat-dialog-close>\r\n    {{ \"SELECT_LANGUAGE.CANCEL\" | translate }}\r\n  </button>\r\n  <button mat-flat-button color=\"accent\" (click)=\"save()\">\r\n    {{ \"SELECT_LANGUAGE.SAVE\" | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n\r\n\r\n\r\n", styles: [".description{color:var(--base-40)}.w-full{width:100%}.mt-4{margin-top:1.5rem!important}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SelectLanguageDialogComponent, { className: "SelectLanguageDialogComponent", filePath: "lib\\core\\localization\\select-language-dialog-component\\select-language-dialog.component.ts", lineNumber: 28 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SelectLanguageDialogComponent, { className: "SelectLanguageDialogComponent", filePath: "lib/core/localization/select-language-dialog-component/select-language-dialog.component.ts", lineNumber: 27 }); })();
 
 function GlobalMessageComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
@@ -8020,7 +8027,7 @@ class GlobalMessageComponent {
         this.closeClick.emit();
     }
     static { this.ɵfac = function GlobalMessageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || GlobalMessageComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: GlobalMessageComponent, selectors: [["lib-global-message"]], inputs: { text: "text", showCloseButton: "showCloseButton" }, outputs: { closeClick: "closeClick" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 4, vars: 4, consts: [[1, "tld-global-message"], [3, "innerHTML"], ["mat-icon-button", "", 1, "tld-global-message-close"], ["mat-icon-button", "", 1, "tld-global-message-close", 3, "click"]], template: function GlobalMessageComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: GlobalMessageComponent, selectors: [["lib-global-message"]], inputs: { text: "text", showCloseButton: "showCloseButton" }, outputs: { closeClick: "closeClick" }, decls: 4, vars: 4, consts: [[1, "tld-global-message"], [3, "innerHTML"], ["mat-icon-button", "", 1, "tld-global-message-close"], ["mat-icon-button", "", 1, "tld-global-message-close", 3, "click"]], template: function GlobalMessageComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵelement(1, "p", 1);
             i0.ɵɵpipe(2, "translate");
@@ -8035,7 +8042,7 @@ class GlobalMessageComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(GlobalMessageComponent, [{
         type: Component,
-        args: [{ selector: 'lib-global-message', standalone: true, imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule], template: "<div class=\"tld-global-message\">\r\n  <p [innerHTML]=\"text | translate\"></p>\r\n\r\n  @if (showCloseButton) {\r\n  <button class=\"tld-global-message-close\" mat-icon-button (click)=\"close()\">\r\n    <mat-icon>close</mat-icon>\r\n  </button>\r\n  }\r\n</div>\r\n", styles: [".tld-global-message{position:relative;background-color:#ffdad6;display:flex;justify-content:center;align-items:center;width:100%;padding:22px}.tld-global-message-close{position:absolute;right:5px}\n"] }]
+        args: [{ selector: 'lib-global-message', imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule], template: "<div class=\"tld-global-message\">\r\n  <p [innerHTML]=\"text | translate\"></p>\r\n\r\n  @if (showCloseButton) {\r\n  <button class=\"tld-global-message-close\" mat-icon-button (click)=\"close()\">\r\n    <mat-icon>close</mat-icon>\r\n  </button>\r\n  }\r\n</div>\r\n", styles: [".tld-global-message{position:relative;background-color:#ffdad6;display:flex;justify-content:center;align-items:center;width:100%;padding:22px}.tld-global-message-close{position:absolute;right:5px}\n"] }]
     }], null, { text: [{
             type: Input
         }], showCloseButton: [{
@@ -8043,7 +8050,7 @@ class GlobalMessageComponent {
         }], closeClick: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(GlobalMessageComponent, { className: "GlobalMessageComponent", filePath: "lib\\global-message\\global-message.component.ts", lineNumber: 14 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(GlobalMessageComponent, { className: "GlobalMessageComponent", filePath: "lib/global-message/global-message.component.ts", lineNumber: 13 }); })();
 
 var SUBSCRIPTION_STATE;
 (function (SUBSCRIPTION_STATE) {
@@ -8414,7 +8421,7 @@ class SubscriptionComponent {
         return `${parseFloat((bytes / Math.pow(k, i)).toFixed(dm))} ${sizes[i]}`;
     }
     static { this.ɵfac = function SubscriptionComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SubscriptionComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SubscriptionComponent, selectors: [["lib-subscription"]], inputs: { token: [1, "token"], subscription: [1, "subscription"], quota: [1, "quota"], visibleQuotaTypes: [1, "visibleQuotaTypes"], contactUsUrl: [1, "contactUsUrl"], chargebeeSettings: [1, "chargebeeSettings"] }, outputs: { manageClick: "manageClick", contactUsClick: "contactUsClick" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c0, decls: 7, vars: 5, consts: [[1, "subscription-actions-wrapper"], ["mat-flat-button", "", "color", "accent", "href", "javascript:void(0)", "data-cb-type", "portal", 1, "manage-sub-btn", "button-row-element"], ["mat-stroked-button", "", "target", "_blank", "color", "accent"], [1, "subscription-section-title", "text-l-semi-bold"], [1, "subscription-data-row"], [1, "subscription-label"], [1, "label"], [1, "subscription-data"], ["fxLayout", "row", 1, "subscription-data-row"], [1, "subscription-limit-wrapper"], [3, "value"], [1, "subscription-limit"], [1, "text-l-semi-bold"], ["mat-flat-button", "", "color", "accent", "href", "javascript:void(0)", "data-cb-type", "portal", 1, "manage-sub-btn", "button-row-element", 3, "click"], ["mat-stroked-button", "", "target", "_blank", "color", "accent", 3, "click"]], template: function SubscriptionComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SubscriptionComponent, selectors: [["lib-subscription"]], inputs: { token: [1, "token"], subscription: [1, "subscription"], quota: [1, "quota"], visibleQuotaTypes: [1, "visibleQuotaTypes"], contactUsUrl: [1, "contactUsUrl"], chargebeeSettings: [1, "chargebeeSettings"] }, outputs: { manageClick: "manageClick", contactUsClick: "contactUsClick" }, ngContentSelectors: _c0, decls: 7, vars: 5, consts: [[1, "subscription-actions-wrapper"], ["mat-flat-button", "", "color", "accent", "href", "javascript:void(0)", "data-cb-type", "portal", 1, "manage-sub-btn", "button-row-element"], ["mat-stroked-button", "", "target", "_blank", "color", "accent"], [1, "subscription-section-title", "text-l-semi-bold"], [1, "subscription-data-row"], [1, "subscription-label"], [1, "label"], [1, "subscription-data"], ["fxLayout", "row", 1, "subscription-data-row"], [1, "subscription-limit-wrapper"], [3, "value"], [1, "subscription-limit"], [1, "text-l-semi-bold"], ["mat-flat-button", "", "color", "accent", "href", "javascript:void(0)", "data-cb-type", "portal", 1, "manage-sub-btn", "button-row-element", 3, "click"], ["mat-stroked-button", "", "target", "_blank", "color", "accent", 3, "click"]], template: function SubscriptionComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef();
             i0.ɵɵtemplate(0, SubscriptionComponent_Conditional_0_Template, 20, 11)(1, SubscriptionComponent_Conditional_1_Template, 15, 8)(2, SubscriptionComponent_Conditional_2_Template, 5, 3);
             i0.ɵɵprojection(3);
@@ -8433,11 +8440,11 @@ class SubscriptionComponent {
             i0.ɵɵconditional(ctx.contactUsUrl() ? 6 : -1);
         } }, dependencies: [TranslatePipe,
             DatePipe,
-            MatProgressBarModule, i2$4.MatProgressBar, CommonModule, i1$2.UpperCasePipe, MatButtonModule, i2$1.MatAnchor], styles: ["[_nghost-%COMP%]{display:block}mat-card[_ngcontent-%COMP%]{margin:1.5rem}.subscription-container[_ngcontent-%COMP%]:not(.mobile){margin:16px 32px}.subscription-section-title[_ngcontent-%COMP%]{margin:32px 0 18px}.subscription-data-row[_ngcontent-%COMP%]{border-bottom:2px solid var(--base-70);margin-bottom:18px;flex-direction:row;display:flex}.subscription-data[_ngcontent-%COMP%]{color:var(--base-30);word-wrap:break-word;margin-left:.5rem}.subscription-limit-wrapper[_ngcontent-%COMP%], .subscription-limit[_ngcontent-%COMP%]{margin-top:16px}.subscription-actions-wrapper[_ngcontent-%COMP%]{padding:32px 0 18px;display:flex;flex-direction:row;gap:24px}.subscription-manage-link[_ngcontent-%COMP%]{text-decoration:none}.subscription-container[_ngcontent-%COMP%]:not(.mobile, .empty)[_ngcontent-%COMP%]{width:75%}.subscription-label[_ngcontent-%COMP%]:not(.mobile, .empty)[_ngcontent-%COMP%]{width:35%}.subscription-data[_ngcontent-%COMP%]:not(.mobile, .empty)[_ngcontent-%COMP%]{width:65%}.untranslated-files-disclaimer[_ngcontent-%COMP%]{margin-top:16px;margin-bottom:10px;color:var(--base-40)}.no-subscription-message[_ngcontent-%COMP%]{margin-top:32px;color:var(--base-40)}.contact-sales-btn[_ngcontent-%COMP%]{text-align:center}.contact-sales-btn[_ngcontent-%COMP%]:hover{text-decoration:none}"] }); }
+            MatProgressBarModule, i2$4.MatProgressBar, CommonModule, i1$2.UpperCasePipe, MatButtonModule, i2$1.MatAnchor], styles: ["[_nghost-%COMP%]{display:block}mat-card[_ngcontent-%COMP%]{margin:1.5rem}.subscription-container[_ngcontent-%COMP%]:not(.mobile){margin:16px 32px}.subscription-section-title[_ngcontent-%COMP%]{margin:32px 0 18px}.subscription-data-row[_ngcontent-%COMP%]{border-bottom:2px solid var(--base-70);margin-bottom:18px;flex-direction:row;display:flex}.subscription-data[_ngcontent-%COMP%]{color:var(--base-30);word-wrap:break-word;margin-left:.5rem}.subscription-limit-wrapper[_ngcontent-%COMP%], .subscription-limit[_ngcontent-%COMP%]{margin-top:16px}.subscription-actions-wrapper[_ngcontent-%COMP%]{padding:32px 0 18px;display:flex;flex-direction:row;gap:24px}.subscription-manage-link[_ngcontent-%COMP%]{text-decoration:none}.subscription-container[_ngcontent-%COMP%]:not(.mobile,.empty){width:75%}.subscription-label[_ngcontent-%COMP%]:not(.mobile,.empty){width:35%}.subscription-data[_ngcontent-%COMP%]:not(.mobile,.empty){width:65%}.untranslated-files-disclaimer[_ngcontent-%COMP%]{margin-top:16px;margin-bottom:10px;color:var(--base-40)}.no-subscription-message[_ngcontent-%COMP%]{margin-top:32px;color:var(--base-40)}.contact-sales-btn[_ngcontent-%COMP%]{text-align:center}.contact-sales-btn[_ngcontent-%COMP%]:hover{text-decoration:none}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SubscriptionComponent, [{
         type: Component,
-        args: [{ selector: 'lib-subscription', standalone: true, imports: [
+        args: [{ selector: 'lib-subscription', imports: [
                     TranslatePipe,
                     DatePipe,
                     MatProgressBarModule,
@@ -8445,7 +8452,7 @@ class SubscriptionComponent {
                     MatButtonModule
                 ], template: "@if(token()){\r\n  <!-- narrow type to non null property -->\r\n  @let userToken = token()!;\r\n\r\n    <h3 class=\"subscription-section-title text-l-semi-bold\">{{ \"SUBSCRIPTION.USER_INFO\" | translate }}</h3>\r\n\r\n    <div class=\"subscription-data-row\">\r\n      <div class=\"subscription-label\">\r\n        <span class=\"label\">{{ \"SUBSCRIPTION.LABEL_NAME\" | translate }}</span>\r\n      </div>\r\n\r\n      <div class=\"subscription-data\">\r\n        <span>{{ userToken.name }}</span>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"subscription-data-row\">\r\n      <div class=\"subscription-label\">\r\n        <span class=\"label\">{{ \"SUBSCRIPTION.LABEL_EMAIL\" | translate }}</span>\r\n      </div>\r\n\r\n      <div class=\"subscription-data\">\r\n        <span>{{ userToken.email }}</span>\r\n      </div>\r\n    </div>\r\n}\r\n\r\n@if(subscription()){\r\n  @let currentSubscription = subscription()!;\r\n\r\n  <div fxLayout=\"row\" class=\"subscription-data-row\">\r\n    <div class=\"subscription-label\">\r\n      <span class=\"label\">{{ \"SUBSCRIPTION.LABEL_SUBSCRIPTION_PLAN_ID\" | translate }}</span>\r\n    </div>\r\n\r\n    <div class=\"subscription-data\">\r\n      <ng-container>\r\n        <span>\r\n          {{ currentSubscription.Label ? currentSubscription.Label : currentSubscription.PlanId }}\r\n\r\n          @switch (subscriptionState()) {\r\n            @case(subscriptionStates.TRIAL){\r\n              <span> ({{ \"SUBSCRIPTION.TRIAL_END_DATE\" | translate: { date: currentSubscription.EndDate | date: \"dd.MM.yyyy.\" } }}) </span>\r\n            }\r\n            @case (subscriptionStates.ACTIVE) {\r\n              @if(currentSubscription.EndDate){\r\n                <span> ({{ \"SUBSCRIPTION.END_DATE\" | translate: { date: currentSubscription.EndDate | date: \"dd.MM.yyyy.\" } }}) </span>\r\n              }\r\n            }\r\n            @case (subscriptionStates.ENDED) {\r\n            ({{ \"SUBSCRIPTION.END_DATE\" | translate: { date: currentSubscription.EndDate | date: \"dd.MM.yyyy.\" } }})\r\n            }\r\n          }\r\n        </span>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n\r\n  @if(currentSubscription.EndDate){\r\n  <div class=\"subscription-data-row\">\r\n    <div class=\"subscription-label\">\r\n      <span class=\"label\">{{ \"SUBSCRIPTION.LABEL_SUBSCRIPTION_END_DATE\" | translate }}</span>\r\n    </div>\r\n\r\n    <div class=\"subscription-data\">\r\n      <ng-container>\r\n        <span>{{currentSubscription.EndDate | date: \"dd.MM.yyyy\"}}</span>\r\n      </ng-container>\r\n    </div>\r\n    </div>\r\n  }\r\n\r\n  @if(currentSubscription.Addons?.length){\r\n    <div fxLayout=\"row\" class=\"subscription-data-row\">\r\n      <div class=\"subscription-label\">\r\n        <span class=\"label\">{{ \"SUBSCRIPTION.ADDITIONS_PLUGINS\" | translate }}</span>\r\n      </div>\r\n\r\n      <div class=\"subscription-data\">\r\n        @for (item of currentSubscription.Addons; track $index; let i = $index) {\r\n            <span>{{ item.id }}</span>\r\n            @if(item.qt>1){\r\n              <span> ({{item.qt}})</span>\r\n            }\r\n            <span> {{ currentSubscription.Addons!.length - 1 > i ? \",\" : \"\" }} </span>\r\n        }\r\n      </div>\r\n    </div>\r\n  }\r\n}\r\n\r\n@if(visibleQuotas().length){\r\n  <h3 class=\"subscription-section-title text-l-semi-bold\">{{ \"SUBSCRIPTION.LIMITS\" | translate }}</h3>\r\n\r\n  @for (currentQuota of visibleQuotas(); track $index) {\r\n    <div class=\"subscription-limit-wrapper\">\r\n      <mat-progress-bar [value]=\"currentQuota.percentUsed\"></mat-progress-bar>\r\n      <div class=\"subscription-limit\">\r\n        <span class=\"text-l-semi-bold\">\r\n          {{ (\"QUOTA.\" + (currentQuota.quotaType.toString() | uppercase) + (currentQuota.isUnlimited? \"_UNLIMITED\": \"\")) | translate: { used: currentQuota.convertedUsed, limit: currentQuota.convertedLimit, percent: currentQuota.percentUsed} }}\r\n        </span>\r\n      </div>\r\n    </div>\r\n  }\r\n}\r\n\r\n<!-- Add some extra info, such as disclaimer etc -->\r\n  <ng-content></ng-content>\r\n\r\n<div class=\"subscription-actions-wrapper\">\r\n  @if(chargebeeSettings()){\r\n    <a mat-flat-button color=\"accent\" class=\"manage-sub-btn button-row-element\" href=\"javascript:void(0)\" data-cb-type=\"portal\" (click)=\"manageClicked()\">\r\n      {{ \"SUBSCRIPTION.MANAGE\" | translate }}\r\n    </a>\r\n  }\r\n  @if(contactUsUrl()){\r\n    <a mat-stroked-button [attr.href]=\"contactUsUrl()\" target=\"_blank\" color=\"accent\" (click)=\"contactUsClicked()\">{{\"SUBSCRIPTION.CONTACT\" | translate}}</a>\r\n  }\r\n</div>\r\n", styles: [":host{display:block}mat-card{margin:1.5rem}.subscription-container:not(.mobile){margin:16px 32px}.subscription-section-title{margin:32px 0 18px}.subscription-data-row{border-bottom:2px solid var(--base-70);margin-bottom:18px;flex-direction:row;display:flex}.subscription-data{color:var(--base-30);word-wrap:break-word;margin-left:.5rem}.subscription-limit-wrapper,.subscription-limit{margin-top:16px}.subscription-actions-wrapper{padding:32px 0 18px;display:flex;flex-direction:row;gap:24px}.subscription-manage-link{text-decoration:none}.subscription-container:not(.mobile,.empty){width:75%}.subscription-label:not(.mobile,.empty){width:35%}.subscription-data:not(.mobile,.empty){width:65%}.untranslated-files-disclaimer{margin-top:16px;margin-bottom:10px;color:var(--base-40)}.no-subscription-message{margin-top:32px;color:var(--base-40)}.contact-sales-btn{text-align:center}.contact-sales-btn:hover{text-decoration:none}\n"] }]
     }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SubscriptionComponent, { className: "SubscriptionComponent", filePath: "lib\\subscription\\subscription.component.ts", lineNumber: 27 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SubscriptionComponent, { className: "SubscriptionComponent", filePath: "lib/subscription/subscription.component.ts", lineNumber: 26 }); })();
 
 /*
  * Public API Surface of ngx-common