turbogui-angular 15.3.0 → 17.0.0

package/fesm2022/turbogui-angular.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Directive, Output, HostListener, NgModule, inject, Injectable, Component, Inject, HostBinding, ViewContainerRef, Input, ViewChild } from '@angular/core';
+import { EventEmitter, Output, Directive, HostListener, NgModule, inject, Injectable, Component, Inject, HostBinding, Input } from '@angular/core';
 import { Subject } from 'rxjs';
 import { ArrayUtils, NumericUtils, HTTPManager, StringUtils, HTTPManagerGetRequest, HTTPManagerPostRequest, BrowserManager, ConversionUtils } from 'turbocommons-ts';
 import * as i1 from '@angular/material/dialog';
@@ -8,18 +8,16 @@ import * as i3 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i1$2 from '@angular/animations';
-import { style, animate, transition, trigger } from '@angular/animations';
+import { trigger, transition, style, animate } from '@angular/animations';
 import { ComponentPortal, DomPortalOutlet } from '@angular/cdk/portal';
 import * as i2$1 from '@angular/material/datepicker';
 import { MatDatepickerModule } from '@angular/material/datepicker';
 import { MatNativeDateModule } from '@angular/material/core';
 import * as i1$1 from '@angular/material/snack-bar';
-import * as i5 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import * as i4 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import * as i6 from '@angular/forms';
+import * as i5 from '@angular/forms';
 import { FormsModule, Validators } from '@angular/forms';
 
 /**
@@ -49,13 +47,14 @@ class ElementCreatedDirective {
     ngOnInit() {
         this.elementCreated.next(this);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElementCreatedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElementCreatedDirective, selector: "[elementCreated]", outputs: { elementCreated: "elementCreated" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ElementCreatedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: ElementCreatedDirective, isStandalone: false, selector: "[elementCreated]", outputs: { elementCreated: "elementCreated" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElementCreatedDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ElementCreatedDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[elementCreated]'
+                    selector: '[elementCreated]',
+                    standalone: false
                 }]
         }], propDecorators: { elementCreated: [{
                 type: Output,
@@ -89,13 +88,14 @@ class ElementDestroyedDirective {
     ngOnDestroy() {
         this.elementDestroyed.next(this);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElementDestroyedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ElementDestroyedDirective, selector: "[elementDestroyed]", outputs: { elementDestroyed: "elementDestroyed" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ElementDestroyedDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: ElementDestroyedDirective, isStandalone: false, selector: "[elementDestroyed]", outputs: { elementDestroyed: "elementDestroyed" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ElementDestroyedDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ElementDestroyedDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[elementDestroyed]'
+                    selector: '[elementDestroyed]',
+                    standalone: false
                 }]
         }], propDecorators: { elementDestroyed: [{
                 type: Output,
@@ -129,13 +129,14 @@ class AutoFocusOnDisplayDirective {
             this.renderer.selectRootElement(this.el.nativeElement).focus();
         }, 0));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AutoFocusOnDisplayDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AutoFocusOnDisplayDirective, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: AutoFocusOnDisplayDirective, isStandalone: false, selector: "[autoFocusOnDisplay]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AutoFocusOnDisplayDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AutoFocusOnDisplayDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[autoFocusOnDisplay]'
+                    selector: '[autoFocusOnDisplay]',
+                    standalone: false
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.Renderer2 }] });
 
@@ -163,13 +164,14 @@ class AutoSelectTextOnFocusDirective {
     onFocus() {
         this.renderer.selectRootElement(this.el.nativeElement).select();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AutoSelectTextOnFocusDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: AutoSelectTextOnFocusDirective, selector: "[autoSelectTextOnFocus]", host: { listeners: { "focus": "onFocus($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AutoSelectTextOnFocusDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: AutoSelectTextOnFocusDirective, isStandalone: false, selector: "[autoSelectTextOnFocus]", host: { listeners: { "focus": "onFocus($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AutoSelectTextOnFocusDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AutoSelectTextOnFocusDirective, decorators: [{
             type: Directive,
             args: [{
-                    selector: '[autoSelectTextOnFocus]'
+                    selector: '[autoSelectTextOnFocus]',
+                    standalone: false
                 }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { onFocus: [{
                 type: HostListener,
@@ -188,17 +190,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
  * This file contains the root module that contains all the library declarations and exports.
  */
 class TurboGuiAngularModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TurboGuiAngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: TurboGuiAngularModule, declarations: [ElementCreatedDirective,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TurboGuiAngularModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: TurboGuiAngularModule, declarations: [ElementCreatedDirective,
             ElementDestroyedDirective,
             AutoFocusOnDisplayDirective,
             AutoSelectTextOnFocusDirective], exports: [ElementCreatedDirective,
             ElementDestroyedDirective,
             AutoFocusOnDisplayDirective,
             AutoSelectTextOnFocusDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TurboGuiAngularModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TurboGuiAngularModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TurboGuiAngularModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TurboGuiAngularModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [],
@@ -288,10 +290,10 @@ class NotificationService extends SingletoneStrictClass {
     unsubscribe(subscription) {
         return subscription.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: NotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: NotificationService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: NotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: NotificationService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: NotificationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: NotificationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -311,7 +313,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
  * It also contains multiple general error management features.
  *
  * To define this class as your application error handler, you must add the following to your
- * main app module providers:
+ * Application providers:
  *      {
  *          provide: ErrorHandler,
  *          useClass: GlobalErrorService
@@ -358,10 +360,10 @@ class GlobalErrorService extends SingletoneStrictClass {
         }
         throw error;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: GlobalErrorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: GlobalErrorService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: GlobalErrorService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: GlobalErrorService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: GlobalErrorService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: GlobalErrorService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -476,6 +478,8 @@ class LocalesService extends SingletoneStrictClass {
     }
     /**
      * Initializes the translation system by loading and parsing bundle files from the specified translations path.
+     * After the promise finishes, the class will contain all the translation data and will be ready to translate any
+     * provided key.
      *
      * @param translationsPath - Url where the translations Json structure of libraries/bundles/locales/keys is available.
      * @param locales An array of locale codes (e.g., ['en_US', 'es_ES', 'fr_FR']) to load. These will be added to the translation
@@ -573,8 +577,8 @@ class LocalesService extends SingletoneStrictClass {
      * @param string key The key we want to read from the specified resource bundle
      * @param string bundlePath A string with the format 'library_name/bundle_name' that is used to locate the bundle were the key to translate is found
      * @param array replaceWildcards A list of values that will replace wildcards that may be found on the translated text. Each wildcard
-     *        will be replaced with the element whose index on toReplace matches it. Check the documentation for this.wildCardsFormat
-     *        property to know more about how to setup wildcards.
+     *        will be replaced with the element whose index on replaceWildcards matches it. Check the documentation for this.wildCardsFormat
+     *        property to know more about how to setup wildcards on your translations.
      *
      * @see setWildCardsFormat()
      *
@@ -847,10 +851,10 @@ class LocalesService extends SingletoneStrictClass {
             throw new Error(valueName + ' ' + errorMessage);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalesService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: LocalesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: LocalesService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LocalesService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: LocalesService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -902,12 +906,15 @@ class DialogBaseComponent {
     closeDialog(index, value = null) {
         this.dialogRef.close({ index: index, value: value });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogBaseComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogBaseComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogBaseComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogBaseComponent, isStandalone: false, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogBaseComponent, decorators: [{
             type: Component,
-            args: [{ template: '' }]
+            args: [{
+                    template: '',
+                    standalone: false
+                }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }] });
 
 /**
@@ -938,12 +945,12 @@ class DialogErrorComponent extends DialogBaseComponent {
             data.texts[1] = data.texts[1].replace(/\n/g, "<br/>");
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogErrorComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogErrorComponent, isStandalone: true, selector: "tg-dialog-error", providers: [], usesInheritance: true, ngImport: i0, template: "<div class=\"titleAndIconContainer\">\r\n    <h3>\r\n        {{data.texts[0]}}\r\n    </h3>\r\n    \r\n    <!-- error icon -->\r\n    <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\">\r\n        <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\r\n        <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\" fill=\"#ff0000\" />\r\n    </svg>\r\n    \r\n</div>\r\n\r\n<div class=\"textContainer\">\r\n    <p *ngIf=\"data.texts.length > 1\" [innerHTML]=\"data.texts[1]\">\r\n    </p>\r\n</div>\r\n\r\n<button mat-raised-button color=\"warn\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{position:relative;min-height:300px}.titleAndIconContainer{display:flex;flex-direction:row;align-items:center;justify-content:space-between}svg{height:10vh;width:auto}.textContainer{margin-top:5px;max-height:70vh;overflow:auto}p{-webkit-user-select:text;-moz-user-select:text;user-select:text}h3{margin-top:0;margin-bottom:25px;width:82%}button{width:100%;margin-top:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogErrorComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogErrorComponent, isStandalone: true, selector: "tg-dialog-error", providers: [], usesInheritance: true, ngImport: i0, template: "<div class=\"titleAndIconContainer\">\r\n    <h3>\r\n        {{data.texts[0]}}\r\n    </h3>\r\n    \r\n    <!-- error icon -->\r\n    <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\">\r\n        <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\r\n        <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\" fill=\"#ff0000\" />\r\n    </svg>\r\n    \r\n</div>\r\n\r\n<div class=\"textContainer\">\r\n    <p *ngIf=\"data.texts.length > 1\" [innerHTML]=\"data.texts[1]\">\r\n    </p>\r\n</div>\r\n\r\n<button mat-raised-button color=\"warn\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{position:relative;min-height:300px}.titleAndIconContainer{display:flex;flex-direction:row;align-items:center;justify-content:space-between}svg{height:10vh;width:auto}.textContainer{margin-top:5px;max-height:70vh;overflow:auto}p{-webkit-user-select:text;user-select:text}h3{margin-top:0;margin-bottom:25px;width:82%}button{width:100%;margin-top:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogErrorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogErrorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-error', standalone: true, imports: [CommonModule, MatButtonModule], providers: [], template: "<div class=\"titleAndIconContainer\">\r\n    <h3>\r\n        {{data.texts[0]}}\r\n    </h3>\r\n    \r\n    <!-- error icon -->\r\n    <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\">\r\n        <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\r\n        <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\" fill=\"#ff0000\" />\r\n    </svg>\r\n    \r\n</div>\r\n\r\n<div class=\"textContainer\">\r\n    <p *ngIf=\"data.texts.length > 1\" [innerHTML]=\"data.texts[1]\">\r\n    </p>\r\n</div>\r\n\r\n<button mat-raised-button color=\"warn\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{position:relative;min-height:300px}.titleAndIconContainer{display:flex;flex-direction:row;align-items:center;justify-content:space-between}svg{height:10vh;width:auto}.textContainer{margin-top:5px;max-height:70vh;overflow:auto}p{-webkit-user-select:text;-moz-user-select:text;user-select:text}h3{margin-top:0;margin-bottom:25px;width:82%}button{width:100%;margin-top:5px}\n"] }]
+            args: [{ selector: 'tg-dialog-error', imports: [CommonModule, MatButtonModule], providers: [], template: "<div class=\"titleAndIconContainer\">\r\n    <h3>\r\n        {{data.texts[0]}}\r\n    </h3>\r\n    \r\n    <!-- error icon -->\r\n    <svg xmlns=\"http://www.w3.org/2000/svg\" height=\"24\" viewBox=\"0 0 24 24\" width=\"24\">\r\n        <path d=\"M0 0h24v24H0z\" fill=\"none\"/>\r\n        <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\" fill=\"#ff0000\" />\r\n    </svg>\r\n    \r\n</div>\r\n\r\n<div class=\"textContainer\">\r\n    <p *ngIf=\"data.texts.length > 1\" [innerHTML]=\"data.texts[1]\">\r\n    </p>\r\n</div>\r\n\r\n<button mat-raised-button color=\"warn\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{position:relative;min-height:300px}.titleAndIconContainer{display:flex;flex-direction:row;align-items:center;justify-content:space-between}svg{height:10vh;width:auto}.textContainer{margin-top:5px;max-height:70vh;overflow:auto}p{-webkit-user-select:text;user-select:text}h3{margin-top:0;margin-bottom:25px;width:82%}button{width:100%;margin-top:5px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -974,10 +981,10 @@ class FadeAnimationClass {
             transition('* => void', [animate(leave, style({ opacity: 0 }))])
         ]);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FadeAnimationClass, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FadeAnimationClass }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FadeAnimationClass, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FadeAnimationClass }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FadeAnimationClass, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: FadeAnimationClass, decorators: [{
             type: Injectable
         }] });
 
@@ -1005,12 +1012,12 @@ class BusyStateBaseComponent {
          */
         this.busyStateBaseFade = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BusyStateBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: BusyStateBaseComponent, isStandalone: true, selector: "tg-busy-state-base", host: { properties: { "@busyStateBaseFade": "this.busyStateBaseFade" } }, providers: [], ngImport: i0, template: "<div class=\"darkBg\">\r\n\r\n</div>\r\n\r\n<svg width=\"38\" height=\"38\" viewBox=\"0 0 38 38\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"#fff\">\r\n    <g fill=\"none\" fill-rule=\"evenodd\">\r\n        <g transform=\"translate(1 1)\" stroke-width=\"1\">\r\n            <circle stroke-opacity=\".2\" cx=\"18\" cy=\"18\" r=\"18\"/>\r\n            <path d=\"M36 18c0-9.94-8.06-18-18-18\">\r\n                <animateTransform\r\n                    attributeName=\"transform\"\r\n                    type=\"rotate\"\r\n                    from=\"0 18 18\"\r\n                    to=\"360 18 18\"\r\n                    dur=\"1s\"\r\n                    repeatCount=\"indefinite\"/>\r\n            </path>\r\n        </g>\r\n    </g>\r\n</svg>\r\n", styles: [":host{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;z-index:999999999}.darkBg{position:absolute;cursor:progress;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#00000096;animation-name:bgfadein;animation-duration:30s;animation-timing-function:ease}svg{z-index:5000;width:40%;height:40%;max-width:130px;max-height:130px;animation-name:loadingfadein;animation-duration:3s;animation-timing-function:ease-in}@keyframes loadingfadein{0%{opacity:0}25%{opacity:0}to{opacity:1}}@keyframes bgfadein{0%{opacity:0}4%{opacity:0}14%{opacity:.2}35%{opacity:.5}to{opacity:1}}\n"], animations: [FadeAnimationClass.getTrigger('busyStateBaseFade', '1s ease', '400ms ease')] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BusyStateBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: BusyStateBaseComponent, isStandalone: true, selector: "tg-busy-state-base", host: { properties: { "@busyStateBaseFade": "this.busyStateBaseFade" } }, providers: [], ngImport: i0, template: "<div class=\"darkBg\">\r\n\r\n</div>\r\n\r\n<svg width=\"38\" height=\"38\" viewBox=\"0 0 38 38\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"#fff\">\r\n    <g fill=\"none\" fill-rule=\"evenodd\">\r\n        <g transform=\"translate(1 1)\" stroke-width=\"1\">\r\n            <circle stroke-opacity=\".2\" cx=\"18\" cy=\"18\" r=\"18\"/>\r\n            <path d=\"M36 18c0-9.94-8.06-18-18-18\">\r\n                <animateTransform\r\n                    attributeName=\"transform\"\r\n                    type=\"rotate\"\r\n                    from=\"0 18 18\"\r\n                    to=\"360 18 18\"\r\n                    dur=\"1s\"\r\n                    repeatCount=\"indefinite\"/>\r\n            </path>\r\n        </g>\r\n    </g>\r\n</svg>\r\n", styles: [":host{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;z-index:999999999}.darkBg{position:absolute;cursor:progress;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#00000096;animation-name:bgfadein;animation-duration:30s;animation-timing-function:ease}svg{z-index:5000;width:40%;height:40%;max-width:130px;max-height:130px;animation-name:loadingfadein;animation-duration:3s;animation-timing-function:ease-in}@keyframes loadingfadein{0%{opacity:0}25%{opacity:0}to{opacity:1}}@keyframes bgfadein{0%{opacity:0}4%{opacity:0}14%{opacity:.2}35%{opacity:.5}to{opacity:1}}\n"], animations: [FadeAnimationClass.getTrigger('busyStateBaseFade', '1s ease', '400ms ease')] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BusyStateBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BusyStateBaseComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-busy-state-base', standalone: true, imports: [], providers: [], animations: [FadeAnimationClass.getTrigger('busyStateBaseFade', '1s ease', '400ms ease')], template: "<div class=\"darkBg\">\r\n\r\n</div>\r\n\r\n<svg width=\"38\" height=\"38\" viewBox=\"0 0 38 38\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"#fff\">\r\n    <g fill=\"none\" fill-rule=\"evenodd\">\r\n        <g transform=\"translate(1 1)\" stroke-width=\"1\">\r\n            <circle stroke-opacity=\".2\" cx=\"18\" cy=\"18\" r=\"18\"/>\r\n            <path d=\"M36 18c0-9.94-8.06-18-18-18\">\r\n                <animateTransform\r\n                    attributeName=\"transform\"\r\n                    type=\"rotate\"\r\n                    from=\"0 18 18\"\r\n                    to=\"360 18 18\"\r\n                    dur=\"1s\"\r\n                    repeatCount=\"indefinite\"/>\r\n            </path>\r\n        </g>\r\n    </g>\r\n</svg>\r\n", styles: [":host{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;z-index:999999999}.darkBg{position:absolute;cursor:progress;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#00000096;animation-name:bgfadein;animation-duration:30s;animation-timing-function:ease}svg{z-index:5000;width:40%;height:40%;max-width:130px;max-height:130px;animation-name:loadingfadein;animation-duration:3s;animation-timing-function:ease-in}@keyframes loadingfadein{0%{opacity:0}25%{opacity:0}to{opacity:1}}@keyframes bgfadein{0%{opacity:0}4%{opacity:0}14%{opacity:.2}35%{opacity:.5}to{opacity:1}}\n"] }]
+            args: [{ selector: 'tg-busy-state-base', imports: [], providers: [], animations: [FadeAnimationClass.getTrigger('busyStateBaseFade', '1s ease', '400ms ease')], template: "<div class=\"darkBg\">\r\n\r\n</div>\r\n\r\n<svg width=\"38\" height=\"38\" viewBox=\"0 0 38 38\" xmlns=\"http://www.w3.org/2000/svg\" stroke=\"#fff\">\r\n    <g fill=\"none\" fill-rule=\"evenodd\">\r\n        <g transform=\"translate(1 1)\" stroke-width=\"1\">\r\n            <circle stroke-opacity=\".2\" cx=\"18\" cy=\"18\" r=\"18\"/>\r\n            <path d=\"M36 18c0-9.94-8.06-18-18-18\">\r\n                <animateTransform\r\n                    attributeName=\"transform\"\r\n                    type=\"rotate\"\r\n                    from=\"0 18 18\"\r\n                    to=\"360 18 18\"\r\n                    dur=\"1s\"\r\n                    repeatCount=\"indefinite\"/>\r\n            </path>\r\n        </g>\r\n    </g>\r\n</svg>\r\n", styles: [":host{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;z-index:999999999}.darkBg{position:absolute;cursor:progress;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#00000096;animation-name:bgfadein;animation-duration:30s;animation-timing-function:ease}svg{z-index:5000;width:40%;height:40%;max-width:130px;max-height:130px;animation-name:loadingfadein;animation-duration:3s;animation-timing-function:ease-in}@keyframes loadingfadein{0%{opacity:0}25%{opacity:0}to{opacity:1}}@keyframes bgfadein{0%{opacity:0}4%{opacity:0}14%{opacity:.2}35%{opacity:.5}to{opacity:1}}\n"] }]
         }], propDecorators: { busyStateBaseFade: [{
                 type: HostBinding,
                 args: ['@busyStateBaseFade']
@@ -1035,12 +1042,12 @@ class DialogDateSelectionComponent extends DialogBaseComponent {
         this.dialogRef = dialogRef;
         this.data = data;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogDateSelectionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogDateSelectionComponent, isStandalone: true, selector: "tg-dialog-date-selection", providers: [], usesInheritance: true, ngImport: i0, template: "<h2>{{data.texts[0]}}</h2>\r\n\r\n<mat-calendar #calendar\r\n    (selectedChange)=\"closeDialog(0, $event)\">\r\n</mat-calendar>", styles: [":host{position:relative;min-height:300px}h1{margin-top:0;margin-bottom:25px;width:82%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "ngmodule", type: MatNativeDateModule }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogDateSelectionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogDateSelectionComponent, isStandalone: true, selector: "tg-dialog-date-selection", providers: [], usesInheritance: true, ngImport: i0, template: "<h2>{{data.texts[0]}}</h2>\r\n\r\n<mat-calendar #calendar\r\n    (selectedChange)=\"closeDialog(0, $event)\">\r\n</mat-calendar>", styles: [":host{position:relative;min-height:300px}h1{margin-top:0;margin-bottom:25px;width:82%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatCalendar, selector: "mat-calendar", inputs: ["headerComponent", "startAt", "startView", "selected", "minDate", "maxDate", "dateFilter", "dateClass", "comparisonStart", "comparisonEnd", "startDateAccessibleName", "endDateAccessibleName"], outputs: ["selectedChange", "yearSelected", "monthSelected", "viewChanged", "_userSelection", "_userDragDrop"], exportAs: ["matCalendar"] }, { kind: "ngmodule", type: MatNativeDateModule }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogDateSelectionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogDateSelectionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-date-selection', standalone: true, imports: [CommonModule, MatDatepickerModule, MatNativeDateModule], providers: [], template: "<h2>{{data.texts[0]}}</h2>\r\n\r\n<mat-calendar #calendar\r\n    (selectedChange)=\"closeDialog(0, $event)\">\r\n</mat-calendar>", styles: [":host{position:relative;min-height:300px}h1{margin-top:0;margin-bottom:25px;width:82%}\n"] }]
+            args: [{ selector: 'tg-dialog-date-selection', imports: [CommonModule, MatDatepickerModule, MatNativeDateModule], providers: [], template: "<h2>{{data.texts[0]}}</h2>\r\n\r\n<mat-calendar #calendar\r\n    (selectedChange)=\"closeDialog(0, $event)\">\r\n</mat-calendar>", styles: [":host{position:relative;min-height:300px}h1{margin-top:0;margin-bottom:25px;width:82%}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -1273,8 +1280,9 @@ class DialogService extends SingletoneStrictClass {
      *            - modal: True (default) if selecting an option is mandatory to close the dialog, false if the dialog can be closed
      *              by the user clicking outside it
      *            - texts: A list with strings containing the dialog texts, sorted by importance. When dialog has a title, this should
-     *              be placed first, subtitle second and so (Each dialog may accept different number of texts).
+     *              be placed first, subtitle second and so (Each dialog may accept a different custom number of texts).
      *            - options: A list of strings that will be used as button captions for each one of the accepted dialog options
+     *            - data: An object that we can use to pass any extra data that we want to the dialog
      *            - viewContainerRef: This is important if we want to propagate providers from a parent component to this dialog. We must specify
      *              this reference to make sure the same services injected on the parent are available too at the child dialog
      *
@@ -1289,6 +1297,7 @@ class DialogService extends SingletoneStrictClass {
         properties.modal = properties.modal ?? true;
         properties.texts = properties.texts ?? [];
         properties.options = properties.options ?? [];
+        properties.data = properties.data ?? {};
         // Generate a string to uniquely identify this dialog on the list of active dialogs
         // A dialog is considered as unique if the dialog id and texts are exactly the same. We do not take options into consideration
         // as there may be dialogs with a big amount of options available.
@@ -1308,7 +1317,7 @@ class DialogService extends SingletoneStrictClass {
             autoFocus: false,
             closeOnNavigation: !properties.modal,
             viewContainerRef: properties.viewContainerRef,
-            data: { texts: properties.texts, options: properties.options }
+            data: { texts: properties.texts, options: properties.options, data: properties.data }
         });
         // Assign the dialog ID only if specifically set on properties
         if (properties.id && properties.id !== undefined) {
@@ -1433,10 +1442,10 @@ class DialogService extends SingletoneStrictClass {
             this._documentMousedownUnlisten = null;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogService, deps: [{ token: i0.RendererFactory2 }, { token: i1$1.MatSnackBar }, { token: i1.MatDialog }, { token: i0.Injector }, { token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogService, deps: [{ token: i0.RendererFactory2 }, { token: i1$1.MatSnackBar }, { token: i1.MatDialog }, { token: i0.Injector }, { token: i0.ApplicationRef }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -1499,10 +1508,10 @@ class HTTPService extends HTTPManager {
             }
         }, progressCallback);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HTTPService, deps: [{ token: DialogService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HTTPService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: HTTPService, deps: [{ token: DialogService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: HTTPService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HTTPService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: HTTPService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -1574,10 +1583,10 @@ class BrowserService extends BrowserManager {
     subscribeToUrlChange(onNext) {
         return this.location.subscribe(onNext);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BrowserService, deps: [{ token: i2.Location }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BrowserService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BrowserService, deps: [{ token: i2.Location }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BrowserService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BrowserService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: BrowserService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -1604,6 +1613,10 @@ class TurboApiCallerService extends SingletoneStrictClass {
          * URI Path to the web service that performs the user login
          */
         this.loginServiceURI = 'users/login';
+        /**
+         * URI Path to the web service that allows us to create extra user tokens
+         */
+        this.tokenCreationServiceURI = 'users/user-token-create';
         /**
          * URI Path to the web service that performs the user log out
          */
@@ -1744,7 +1757,6 @@ class TurboApiCallerService extends SingletoneStrictClass {
      */
     getLastVerifiedMail() {
         return this._lastVerifiedMail;
-        ;
     }
     /**
      * Authenticates the userName and password that are currently defined at the respective properties of this service.
@@ -1796,6 +1808,18 @@ class TurboApiCallerService extends SingletoneStrictClass {
             this.httpManager.execute(request);
         });
     }
+    /**
+     * Perform a request to the API service to create a new token for the user that is currently logged in.
+     *
+     * @param options The parameters that will affect the token behaviour. To learn more about each option, please
+     *        refer to the turbodepot UsersManager class createToken method documentation
+     *
+     * @returns A promise that resolves with the created token string if the request is successful, or rejects
+     *          with an error (containing all the error response details) if the request fails.
+     */
+    createUserToken(options) {
+        return this.call(this.tokenCreationServiceURI, { options: options }, { resultFormat: 'STRING' });
+    }
     /**
      * Checks if the user and password credentials are filled and not empty.
      * If any of the two values is empty, false will be returned
@@ -1991,159 +2015,16 @@ class TurboApiCallerService extends SingletoneStrictClass {
         this._token = '';
         this.httpManager.setGlobalPostParam('token', '-');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TurboApiCallerService, deps: [{ token: DialogService }, { token: BrowserService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TurboApiCallerService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TurboApiCallerService, deps: [{ token: DialogService }, { token: BrowserService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TurboApiCallerService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TurboApiCallerService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: TurboApiCallerService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
         }], ctorParameters: () => [{ type: DialogService }, { type: BrowserService }] });
 
-/**
- * TurboGUI is A library that helps with the most common and generic UI elements and functionalities
- *
- * Website : -> http://www.turbogui.org
- * License : -> Licensed under the Apache License, Version 2.0. You may not use this file except in compliance with the License.
- * License Url : -> http://www.apache.org/licenses/LICENSE-2.0
- * CopyRight : -> Copyright 2018 Edertone Advanded Solutions. https://www.edertone.com
- */
-/**
- * Manages adding, removing and manipulating the application views
- */
-class ViewsService extends SingletoneStrictClass {
-    constructor(animationBuilder) {
-        super(ViewsService);
-        this.animationBuilder = animationBuilder;
-        /**
-         * See getter method for docs
-         */
-        this._loadedViewClass = null;
-        /**
-         * See setter method for docs
-         */
-        this._viewContainerRef = null;
-        /**
-         * Contains the reference to the currently loaded view component
-         */
-        this._currentComponentRef = null;
-        /**
-         * Flag that stores if any view is in the process of being loaded
-         */
-        this._isLoadingView = false;
-    }
-    /**
-     * Tells if there's any view currently loaded on the application views container
-     */
-    get isViewLoaded() {
-        return this._loadedViewClass !== null;
-    }
-    /**
-     * Stores a reference to the visual element that will be used as the container for all the views.
-     * This is automatically assigned by the tg-views-container component once it is created.
-     *
-     * @see ViewsContainerComponent for more information
-     */
-    set viewContainerRef(ref) {
-        if (ref !== null && this._viewContainerRef !== null) {
-            throw new Error('Views container already defined. Only one views container element can exist on an application');
-        }
-        this._viewContainerRef = ref;
-    }
-    /**
-     * Create a new view instance with the specified type and add it to the current application views container. Any currently loaded
-     * view will be removed.
-     *
-     * If we push a view while another one is in the process of being loaded, the new push will be ignored.
-     *
-     * Make sure this method is called when all the visual components of the application have been created (ngAfterViewInit)
-     *
-     * @param view The classname for the view that we want to create (must extend View base class). A new angular object
-     *        will be instantiated and loaded into the views container.
-     */
-    async pushView(view) {
-        // If the loaded view is the same as the specified one, we will do nothing
-        if (this._loadedViewClass === view) {
-            return;
-        }
-        // If a view is already being loaded, nothing to do
-        if (this._isLoadingView) {
-            return;
-        }
-        this._isLoadingView = true;
-        // If a view is already loaded, we will unload it first
-        if (this._loadedViewClass !== null) {
-            await this.removeCurrentView();
-        }
-        // Create the new view
-        const newComponentRef = this._viewContainerRef.createComponent(view);
-        newComponentRef.changeDetectorRef.detectChanges();
-        // Set initial opacity to 0
-        newComponentRef.location.nativeElement.style.opacity = '0';
-        // Fade in the new view
-        const fadeInPlayer = this.animationBuilder.build([
-            style({ opacity: 0 }),
-            animate('300ms ease', style({ opacity: 1 }))
-        ]).create(newComponentRef.location.nativeElement);
-        await new Promise((resolve) => {
-            fadeInPlayer.onDone(() => {
-                this._currentComponentRef = newComponentRef;
-                this._loadedViewClass = view;
-                this._isLoadingView = false;
-                resolve();
-            });
-            fadeInPlayer.play();
-        });
-    }
-    /**
-     * Delete the currently loaded view from the views container, and leave it empty.
-     * If no view is currently loaded, this method will do nothing
-     */
-    async popView() {
-        if (this._loadedViewClass !== null && this._currentComponentRef) {
-            await this.removeCurrentView();
-        }
-    }
-    /**
-     * Aux method to remove the currently loaded view from the views container using a promise
-     */
-    removeCurrentView() {
-        if (this._viewContainerRef === null) {
-            throw new Error('Views container not defined. Please declare a <views-container> element in your application');
-        }
-        return new Promise((resolve) => {
-            if (this._currentComponentRef) {
-                const element = this._currentComponentRef.location.nativeElement;
-                const fadeOutPlayer = this.animationBuilder.build([
-                    style({ opacity: 1 }),
-                    animate('300ms ease', style({ opacity: 0 }))
-                ]).create(element);
-                fadeOutPlayer.onDone(() => {
-                    if (this._viewContainerRef !== null) {
-                        this._viewContainerRef.clear();
-                    }
-                    this._currentComponentRef = null;
-                    this._loadedViewClass = null;
-                    resolve();
-                });
-                fadeOutPlayer.play();
-            }
-            else {
-                resolve();
-            }
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsService, deps: [{ token: i1$2.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: () => [{ type: i1$2.AnimationBuilder }] });
-
 /**
  * TurboGUI is A library that helps with the most common and generic UI elements and functionalities
  *
@@ -2169,12 +2050,12 @@ class DialogSingleOptionComponent extends DialogBaseComponent {
             throw new Error('DialogSingleOptionComponent expects only one option');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleOptionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogSingleOptionComponent, isStandalone: true, selector: "tg-dialog-single-option", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}button{float:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogSingleOptionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogSingleOptionComponent, isStandalone: true, selector: "tg-dialog-single-option", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}button{float:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogSingleOptionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-single-option', standalone: true, imports: [CommonModule, MatButtonModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}button{float:right}\n"] }]
+            args: [{ selector: 'tg-dialog-single-option', imports: [CommonModule, MatButtonModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    (click)=\"closeDialog(0)\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}button{float:right}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -2206,12 +2087,12 @@ class DialogTwoOptionComponent extends DialogBaseComponent {
             throw new Error('DialogTwoOptionComponent expects only two options');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogTwoOptionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogTwoOptionComponent, isStandalone: true, selector: "tg-dialog-two-option", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<div class=\"buttonsContainer\">\r\n\r\n    <button mat-raised-button color=\"primary\" class=\"primaryButton\"\r\n        (click)=\"closeDialog(0)\">\r\n        \r\n        {{data.options[0]}}\r\n        \r\n    </button>\r\n    \r\n    <button mat-button\r\n        (click)=\"closeDialog(1)\">\r\n        \r\n        {{data.options[1]}}\r\n        \r\n    </button>\r\n    \r\n</div>\r\n", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}.buttonsContainer{width:100%;max-width:530px;display:flex;flex-direction:row-reverse;float:right}button{width:50%;padding:0}.primaryButton{margin-left:2%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogTwoOptionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogTwoOptionComponent, isStandalone: true, selector: "tg-dialog-two-option", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<div class=\"buttonsContainer\">\r\n\r\n    <button mat-raised-button color=\"primary\" class=\"primaryButton\"\r\n        (click)=\"closeDialog(0)\">\r\n        \r\n        {{data.options[0]}}\r\n        \r\n    </button>\r\n    \r\n    <button mat-button\r\n        (click)=\"closeDialog(1)\">\r\n        \r\n        {{data.options[1]}}\r\n        \r\n    </button>\r\n    \r\n</div>\r\n", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}.buttonsContainer{width:100%;max-width:530px;display:flex;flex-direction:row-reverse;float:right}button{width:50%;padding:0}.primaryButton{margin-left:2%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogTwoOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogTwoOptionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-two-option', standalone: true, imports: [CommonModule, MatButtonModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<div class=\"buttonsContainer\">\r\n\r\n    <button mat-raised-button color=\"primary\" class=\"primaryButton\"\r\n        (click)=\"closeDialog(0)\">\r\n        \r\n        {{data.options[0]}}\r\n        \r\n    </button>\r\n    \r\n    <button mat-button\r\n        (click)=\"closeDialog(1)\">\r\n        \r\n        {{data.options[1]}}\r\n        \r\n    </button>\r\n    \r\n</div>\r\n", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}.buttonsContainer{width:100%;max-width:530px;display:flex;flex-direction:row-reverse;float:right}button{width:50%;padding:0}.primaryButton{margin-left:2%}\n"] }]
+            args: [{ selector: 'tg-dialog-two-option', imports: [CommonModule, MatButtonModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<div class=\"buttonsContainer\">\r\n\r\n    <button mat-raised-button color=\"primary\" class=\"primaryButton\"\r\n        (click)=\"closeDialog(0)\">\r\n        \r\n        {{data.options[0]}}\r\n        \r\n    </button>\r\n    \r\n    <button mat-button\r\n        (click)=\"closeDialog(1)\">\r\n        \r\n        {{data.options[1]}}\r\n        \r\n    </button>\r\n    \r\n</div>\r\n", styles: [":host{min-height:300px}h3{margin-bottom:25px}p{margin-bottom:52px}.buttonsContainer{width:100%;max-width:530px;display:flex;flex-direction:row-reverse;float:right}button{width:50%;padding:0}.primaryButton{margin-left:2%}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -2239,12 +2120,12 @@ class DialogMultipleOptionComponent extends DialogBaseComponent {
             throw new Error('DialogMultipleOptionComponent expects 2 texts: The title and optionally a description');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogMultipleOptionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogMultipleOptionComponent, isStandalone: true, selector: "tg-dialog-multiple-option", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    *ngFor=\"let option of data.options; let i = index\"\r\n    (click)=\"closeDialog(i)\">\r\n    \r\n    {{option}}\r\n    \r\n</button>", styles: [":host{display:flex;flex-direction:column;min-height:193px}h3{margin-bottom:45px}button{margin-bottom:25px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogMultipleOptionComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogMultipleOptionComponent, isStandalone: true, selector: "tg-dialog-multiple-option", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    *ngFor=\"let option of data.options; let i = index\"\r\n    (click)=\"closeDialog(i)\">\r\n    \r\n    {{option}}\r\n    \r\n</button>", styles: [":host{display:flex;flex-direction:column;min-height:193px}h3{margin-bottom:45px}button{margin-bottom:25px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogMultipleOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogMultipleOptionComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-multiple-option', standalone: true, imports: [CommonModule, MatButtonModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    *ngFor=\"let option of data.options; let i = index\"\r\n    (click)=\"closeDialog(i)\">\r\n    \r\n    {{option}}\r\n    \r\n</button>", styles: [":host{display:flex;flex-direction:column;min-height:193px}h3{margin-bottom:45px}button{margin-bottom:25px}\n"] }]
+            args: [{ selector: 'tg-dialog-multiple-option', imports: [CommonModule, MatButtonModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    *ngFor=\"let option of data.options; let i = index\"\r\n    (click)=\"closeDialog(i)\">\r\n    \r\n    {{option}}\r\n    \r\n</button>", styles: [":host{display:flex;flex-direction:column;min-height:193px}h3{margin-bottom:45px}button{margin-bottom:25px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -2362,12 +2243,12 @@ class DialogSingleSelectionListComponent extends DialogBaseComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleSelectionListComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: BrowserService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogSingleSelectionListComponent, isStandalone: true, selector: "tg-dialog-single-selection-list", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<!-- Here goes the dialog subtitle. Leave it blank if you don't need it -->\r\n<p *ngIf=\"data.texts.length > 1 &amp;&amp; !stringUtils.isEmpty(data.texts[1])\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field *ngIf=\"data.texts.length > 2 &amp;&amp; !stringUtils.isEmpty(data.texts[2])\"\r\n    class=\"searchItemInputContainer\">\r\n    \r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay\r\n        (keyup.enter)=\"onIntroKeyPress()\"\r\n        (input)=\"onSearchChange($event.target)\">\r\n        \r\n</mat-form-field>\r\n\r\n<!-- here goes the list of elements that will be shown to the user -->\r\n<div class=\"listItemsContainer\"\r\n    [style.max-height]=\"getListItemsContainerMaxheight()\">\r\n\r\n    <div class=\"listItemContainer\"\r\n        [style.background-color]=\"selectedItemIndex === i ? '#90d1ffad' : (i % 2 === 0 ? 'initial' : '#00000009')\"\r\n        *ngFor=\"let item of filteredOptions; let i = index; trackBy: trackByFn\"\r\n        (click)=\"data.texts.length < 4 ? closeDialog(i) : selectedItemIndex = i\">\r\n    \r\n        <p *ngIf=\"item !== ''\">\r\n            {{item}}\r\n        </p>\r\n    \r\n    </div>\r\n\r\n</div>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"selectedItemIndex < 0\"\r\n    (click)=\"closeDialog(selectedItemIndex)\"\r\n    *ngIf=\"data.texts.length > 3\">\r\n\r\n    {{data.texts[3]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:0;margin-bottom:10px}p{margin-top:0;margin-bottom:5px}.searchItemInputContainer{width:100%;margin-top:0;margin-bottom:0}.listItemsContainer{overflow-y:auto;border:1px solid rgba(0,0,0,.2);border-radius:4px;margin-bottom:5px}.listItemContainer p{line-height:36px;width:calc(100% - 12px);margin:0 0 0 6px}button{float:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: TurboGuiAngularModule }, { kind: "directive", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogSingleSelectionListComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: BrowserService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogSingleSelectionListComponent, isStandalone: true, selector: "tg-dialog-single-selection-list", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<!-- Here goes the dialog subtitle. Leave it blank if you don't need it -->\r\n<p *ngIf=\"data.texts.length > 1 &amp;&amp; !stringUtils.isEmpty(data.texts[1])\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field *ngIf=\"data.texts.length > 2 &amp;&amp; !stringUtils.isEmpty(data.texts[2])\"\r\n    class=\"searchItemInputContainer\">\r\n    \r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay\r\n        (keyup.enter)=\"onIntroKeyPress()\"\r\n        (input)=\"onSearchChange($event.target)\">\r\n        \r\n</mat-form-field>\r\n\r\n<!-- here goes the list of elements that will be shown to the user -->\r\n<div class=\"listItemsContainer\"\r\n    [style.max-height]=\"getListItemsContainerMaxheight()\">\r\n\r\n    <div class=\"listItemContainer\"\r\n        [style.background-color]=\"selectedItemIndex === i ? '#90d1ffad' : (i % 2 === 0 ? 'initial' : '#00000009')\"\r\n        *ngFor=\"let item of filteredOptions; let i = index; trackBy: trackByFn\"\r\n        (click)=\"data.texts.length < 4 ? closeDialog(i) : selectedItemIndex = i\">\r\n    \r\n        <p *ngIf=\"item !== ''\">\r\n            {{item}}\r\n        </p>\r\n    \r\n    </div>\r\n\r\n</div>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"selectedItemIndex < 0\"\r\n    (click)=\"closeDialog(selectedItemIndex)\"\r\n    *ngIf=\"data.texts.length > 3\">\r\n\r\n    {{data.texts[3]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:0;margin-bottom:10px}p{margin-top:0;margin-bottom:5px}.searchItemInputContainer{width:100%;margin-top:0;margin-bottom:0}.listItemsContainer{overflow-y:auto;border:1px solid rgba(0,0,0,.2);border-radius:4px;margin-bottom:5px}.listItemContainer p{line-height:36px;width:calc(100% - 12px);margin:0 0 0 6px}button{float:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: TurboGuiAngularModule }, { kind: "directive", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleSelectionListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogSingleSelectionListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-single-selection-list', standalone: true, imports: [CommonModule, MatInputModule, MatFormFieldModule, TurboGuiAngularModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<!-- Here goes the dialog subtitle. Leave it blank if you don't need it -->\r\n<p *ngIf=\"data.texts.length > 1 &amp;&amp; !stringUtils.isEmpty(data.texts[1])\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field *ngIf=\"data.texts.length > 2 &amp;&amp; !stringUtils.isEmpty(data.texts[2])\"\r\n    class=\"searchItemInputContainer\">\r\n    \r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay\r\n        (keyup.enter)=\"onIntroKeyPress()\"\r\n        (input)=\"onSearchChange($event.target)\">\r\n        \r\n</mat-form-field>\r\n\r\n<!-- here goes the list of elements that will be shown to the user -->\r\n<div class=\"listItemsContainer\"\r\n    [style.max-height]=\"getListItemsContainerMaxheight()\">\r\n\r\n    <div class=\"listItemContainer\"\r\n        [style.background-color]=\"selectedItemIndex === i ? '#90d1ffad' : (i % 2 === 0 ? 'initial' : '#00000009')\"\r\n        *ngFor=\"let item of filteredOptions; let i = index; trackBy: trackByFn\"\r\n        (click)=\"data.texts.length < 4 ? closeDialog(i) : selectedItemIndex = i\">\r\n    \r\n        <p *ngIf=\"item !== ''\">\r\n            {{item}}\r\n        </p>\r\n    \r\n    </div>\r\n\r\n</div>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"selectedItemIndex < 0\"\r\n    (click)=\"closeDialog(selectedItemIndex)\"\r\n    *ngIf=\"data.texts.length > 3\">\r\n\r\n    {{data.texts[3]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:0;margin-bottom:10px}p{margin-top:0;margin-bottom:5px}.searchItemInputContainer{width:100%;margin-top:0;margin-bottom:0}.listItemsContainer{overflow-y:auto;border:1px solid rgba(0,0,0,.2);border-radius:4px;margin-bottom:5px}.listItemContainer p{line-height:36px;width:calc(100% - 12px);margin:0 0 0 6px}button{float:right}\n"] }]
+            args: [{ selector: 'tg-dialog-single-selection-list', imports: [CommonModule, MatInputModule, MatFormFieldModule, TurboGuiAngularModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<!-- Here goes the dialog subtitle. Leave it blank if you don't need it -->\r\n<p *ngIf=\"data.texts.length > 1 &amp;&amp; !stringUtils.isEmpty(data.texts[1])\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field *ngIf=\"data.texts.length > 2 &amp;&amp; !stringUtils.isEmpty(data.texts[2])\"\r\n    class=\"searchItemInputContainer\">\r\n    \r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay\r\n        (keyup.enter)=\"onIntroKeyPress()\"\r\n        (input)=\"onSearchChange($event.target)\">\r\n        \r\n</mat-form-field>\r\n\r\n<!-- here goes the list of elements that will be shown to the user -->\r\n<div class=\"listItemsContainer\"\r\n    [style.max-height]=\"getListItemsContainerMaxheight()\">\r\n\r\n    <div class=\"listItemContainer\"\r\n        [style.background-color]=\"selectedItemIndex === i ? '#90d1ffad' : (i % 2 === 0 ? 'initial' : '#00000009')\"\r\n        *ngFor=\"let item of filteredOptions; let i = index; trackBy: trackByFn\"\r\n        (click)=\"data.texts.length < 4 ? closeDialog(i) : selectedItemIndex = i\">\r\n    \r\n        <p *ngIf=\"item !== ''\">\r\n            {{item}}\r\n        </p>\r\n    \r\n    </div>\r\n\r\n</div>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"selectedItemIndex < 0\"\r\n    (click)=\"closeDialog(selectedItemIndex)\"\r\n    *ngIf=\"data.texts.length > 3\">\r\n\r\n    {{data.texts[3]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:0;margin-bottom:10px}p{margin-top:0;margin-bottom:5px}.searchItemInputContainer{width:100%;margin-top:0;margin-bottom:0}.listItemsContainer{overflow-y:auto;border:1px solid rgba(0,0,0,.2);border-radius:4px;margin-bottom:5px}.listItemContainer p{line-height:36px;width:calc(100% - 12px);margin:0 0 0 6px}button{float:right}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: BrowserService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -2427,85 +2308,18 @@ class DialogSingleInputComponent extends DialogBaseComponent {
     closeDialog() {
         super.closeDialog(0, this.inputText);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleInputComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DialogSingleInputComponent, isStandalone: true, selector: "tg-dialog-single-input", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1 && data.texts[1] !== ''\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay autoSelectTextOnFocus\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isButtonDisabled()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:1vh;margin-bottom:3vh}p{margin-top:0;margin-bottom:5vh}button{min-height:5vh}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TurboGuiAngularModule }, { kind: "directive", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]" }, { kind: "directive", type: AutoSelectTextOnFocusDirective, selector: "[autoSelectTextOnFocus]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogSingleInputComponent, deps: [{ token: i0.ElementRef }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: DialogSingleInputComponent, isStandalone: true, selector: "tg-dialog-single-input", providers: [], usesInheritance: true, ngImport: i0, template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1 && data.texts[1] !== ''\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay autoSelectTextOnFocus\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isButtonDisabled()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:1vh;margin-bottom:3vh}p{margin-top:0;margin-bottom:5vh}button{min-height:5vh}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TurboGuiAngularModule }, { kind: "directive", type: AutoFocusOnDisplayDirective, selector: "[autoFocusOnDisplay]" }, { kind: "directive", type: AutoSelectTextOnFocusDirective, selector: "[autoSelectTextOnFocus]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DialogSingleInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: DialogSingleInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-dialog-single-input', standalone: true, imports: [CommonModule, MatButtonModule, MatInputModule, FormsModule,
+            args: [{ selector: 'tg-dialog-single-input', imports: [CommonModule, MatButtonModule, MatInputModule, FormsModule,
                         TurboGuiAngularModule], providers: [], template: "<h3>\r\n    {{data.texts[0]}}\r\n</h3>\r\n\r\n<p *ngIf=\"data.texts.length > 1 && data.texts[1] !== ''\">\r\n    {{data.texts[1]}}\r\n</p>\r\n\r\n<mat-form-field>\r\n\r\n    <mat-label>{{data.texts[2]}}</mat-label>\r\n    <input matInput autoFocusOnDisplay autoSelectTextOnFocus\r\n        (keyup.enter)=\"closeDialog()\"\r\n        [(ngModel)]=\"inputText\">\r\n        \r\n</mat-form-field>\r\n\r\n<button mat-raised-button color=\"primary\"\r\n    [disabled]=\"isButtonDisabled()\"\r\n    (click)=\"closeDialog()\">\r\n    \r\n    {{data.options[0]}}\r\n    \r\n</button>", styles: [":host{min-height:300px}h3{margin-top:1vh;margin-bottom:3vh}p{margin-top:0;margin-bottom:5vh}button{min-height:5vh}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }] });
 
-/**
- * TurboGUI is A library that helps with the most common and generic UI elements and functionalities
- *
- * Website : -> http://www.turbogui.org
- * License : -> Licensed under the Apache License, Version 2.0. You may not use this file except in compliance with the License.
- * License Url : -> http://www.apache.org/licenses/LICENSE-2.0
- * CopyRight : -> Copyright 2018 Edertone Advanded Solutions. https://www.edertone.com
- */
-/**
- * Component that is used as a container for application views.
- * We must create only one views container in our application and pass to it a reference to our main
- * viewsService instance. For example:
- *
- * <tg-views-container [viewsService]="viewsService" [initialView]="HomeViewComponent"></tg-views-container>
- */
-class ViewsContainerComponent {
-    constructor() {
-        /**
-         * If we want to load a view by default when this component is loaded for the first time, we can
-         * set here the respective class view and it will be automatically added.
-         */
-        this.initialView = null;
-        /**
-         * A reference to the views service that is used to operate with this views container.
-         * This must be specified when this component is added to the application
-         */
-        this.viewsService = null;
-    }
-    /**
-     * Check that the service reference has been correctly passed
-     */
-    ngOnInit() {
-        if (!(this.viewsService instanceof ViewsService)) {
-            throw new Error('ViewService instance must be referenced on a views container');
-        }
-        else {
-            this.viewsService.viewContainerRef = this.viewContainerRef;
-        }
-        // Set the initial view if defined
-        if (this.initialView !== null) {
-            this.viewsService.pushView(this.initialView);
-        }
-    }
-    /**
-     * Clear the current view from the service when this component is deleted
-     */
-    ngOnDestroy() {
-        if (this.viewsService instanceof ViewsService) {
-            this.viewsService.popView();
-            this.viewsService.viewContainerRef = null;
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ViewsContainerComponent, isStandalone: true, selector: "tg-views-container", inputs: { initialView: "initialView", viewsService: "viewsService" }, providers: [], viewQueries: [{ propertyName: "viewContainerRef", first: true, predicate: ["viewContainerRef"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<!--\r\n    This is a dummy template component that will be used as the anchor point where the views will be loaded\r\n-->\r\n<ng-template #viewContainerRef></ng-template>", styles: [""] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ViewsContainerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'tg-views-container', standalone: true, imports: [], providers: [], template: "<!--\r\n    This is a dummy template component that will be used as the anchor point where the views will be loaded\r\n-->\r\n<ng-template #viewContainerRef></ng-template>" }]
-        }], propDecorators: { initialView: [{
-                type: Input
-            }], viewsService: [{
-                type: Input
-            }], viewContainerRef: [{
-                type: ViewChild,
-                args: ['viewContainerRef', { read: ViewContainerRef, static: true }]
-            }] } });
-
 /**
  * TurboGUI is A library that helps with the most common and generic UI elements and functionalities
  *
@@ -2630,10 +2444,10 @@ class ButtonBaseComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ButtonBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.8", type: ButtonBaseComponent, inputs: { releaseOnMouseUp: "releaseOnMouseUp", vibrateOnClick: "vibrateOnClick", defaultOpacity: "defaultOpacity", defaultScale: "defaultScale", hoverOpacity: "hoverOpacity", hoverScale: "hoverScale", clickOpacity: "clickOpacity", clickScale: "clickScale", disabledOpacity: "disabledOpacity", enabled: "enabled" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()", "pointerout": "onMouseOut()", "pointerleave": "onMouseOut()", "pointerdown": "onMouseDown()", "pointerup": "onMouseUp()" }, properties: { "style.opacity": "this.currentOpacity", "style.transform": "this.currentScale", "style.pointer-events": "this.pointerEvents" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: ButtonBaseComponent, isStandalone: true, inputs: { releaseOnMouseUp: "releaseOnMouseUp", vibrateOnClick: "vibrateOnClick", defaultOpacity: "defaultOpacity", defaultScale: "defaultScale", hoverOpacity: "hoverOpacity", hoverScale: "hoverScale", clickOpacity: "clickOpacity", clickScale: "clickScale", disabledOpacity: "disabledOpacity", enabled: "enabled" }, host: { listeners: { "mouseover": "onMouseOver()", "mouseout": "onMouseOut()", "pointerout": "onMouseOut()", "pointerleave": "onMouseOut()", "pointerdown": "onMouseDown()", "pointerup": "onMouseUp()" }, properties: { "style.opacity": "this.currentOpacity", "style.transform": "this.currentScale", "style.pointer-events": "this.pointerEvents" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ButtonBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonBaseComponent, decorators: [{
             type: Directive
         }], propDecorators: { currentOpacity: [{
                 type: HostBinding,
@@ -2712,12 +2526,12 @@ class ButtonImageComponent extends ButtonBaseComponent {
          */
         this.percentSize = 100;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ButtonImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ButtonImageComponent, isStandalone: true, selector: "tg-button-image", inputs: { src: "src", percentSize: "percentSize" }, host: { properties: { "@buttonFade": "this.buttonFade" } }, providers: [], usesInheritance: true, ngImport: i0, template: "<img src=\"{{src}}\"\r\n    [style.width]=\"percentSize + '%'\"\r\n    [style.height]=\"percentSize + '%'\" />", styles: [":host{-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}img{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}\n"], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: ButtonImageComponent, isStandalone: true, selector: "tg-button-image", inputs: { src: "src", percentSize: "percentSize" }, host: { properties: { "@buttonFade": "this.buttonFade" } }, providers: [], usesInheritance: true, ngImport: i0, template: "<img src=\"{{src}}\"\r\n    [style.width]=\"percentSize + '%'\"\r\n    [style.height]=\"percentSize + '%'\" />", styles: [":host{-webkit-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}img{pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}\n"], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ButtonImageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonImageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-button-image', standalone: true, imports: [], providers: [], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')], template: "<img src=\"{{src}}\"\r\n    [style.width]=\"percentSize + '%'\"\r\n    [style.height]=\"percentSize + '%'\" />", styles: [":host{-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}img{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}\n"] }]
+            args: [{ selector: 'tg-button-image', imports: [], providers: [], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')], template: "<img src=\"{{src}}\"\r\n    [style.width]=\"percentSize + '%'\"\r\n    [style.height]=\"percentSize + '%'\" />", styles: [":host{-webkit-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}img{pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}\n"] }]
         }], propDecorators: { buttonFade: [{
                 type: HostBinding,
                 args: ['@buttonFade']
@@ -2746,12 +2560,12 @@ class ButtonContainerComponent extends ButtonBaseComponent {
          */
         this.buttonFade = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ButtonContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ButtonContainerComponent, isStandalone: true, selector: "tg-button-container", host: { properties: { "@buttonFade": "this.buttonFade" } }, providers: [], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}\n"], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: ButtonContainerComponent, isStandalone: true, selector: "tg-button-container", host: { properties: { "@buttonFade": "this.buttonFade" } }, providers: [], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>", styles: [":host{-webkit-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}\n"], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ButtonContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: ButtonContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'tg-button-container', standalone: true, imports: [], providers: [], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')], template: "<ng-content></ng-content>", styles: [":host{-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}\n"] }]
+            args: [{ selector: 'tg-button-container', imports: [], providers: [], animations: [FadeAnimationClass.getTrigger('buttonFade', '300ms ease', '300ms ease')], template: "<ng-content></ng-content>", styles: [":host{-webkit-user-select:none;user-select:none;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:opacity .3s ease,transform .2s cubic-bezier(.04,.62,.58,1);display:flex;justify-content:center;align-items:center}\n"] }]
         }], propDecorators: { buttonFade: [{
                 type: HostBinding,
                 args: ['@buttonFade']
@@ -2799,14 +2613,21 @@ class GUINotification {
  */
 /**
  * Defines an application view.
- * Our View components must extend this class so they can be manipulated via ViewsService and be correctly linked to a views-container.
+ * This is a base class that helps managing our application views. We should extend this class to create our views, as it forces us
+ * to set the viewContainerRef and the viewService, which are both used when working with views.
+ *
+ * When using view services, it is important to specify the view service as a provider for the view component to ensure that it will
+ * be created and destroyed when the view is created and destroyed.
  */
 class View {
     /**
      * This constructor is specifically designed to force the view to set the viewContainerRef which will be automatically assigned
-     * to the respective view service. If the view has no service, we can set it to null.
+     * to the respective view service. If the view has no service, we can set it to null, but it is recommended to always use a service with a view,
+     * to store the view state and global methods that can be used by other components loaded in the view.
      */
     constructor(viewContainerRef, viewService) {
+        this.viewContainerRef = viewContainerRef;
+        this.viewService = viewService;
         if (viewService !== null) {
             viewService.viewContainerRef = viewContainerRef;
         }
@@ -2943,5 +2764,5 @@ class ValidatorsPlus extends Validators {
  * Generated bundle index. Do not edit.
  */
 
-export { AutoFocusOnDisplayDirective, AutoSelectTextOnFocusDirective, BrowserService, BusyStateBaseComponent, ButtonContainerComponent, ButtonImageComponent, DelayedMethodCallManager, DialogBaseComponent, DialogDateSelectionComponent, DialogErrorComponent, DialogMultipleOptionComponent, DialogService, DialogSingleInputComponent, DialogSingleOptionComponent, DialogSingleSelectionListComponent, DialogTwoOptionComponent, ElementCreatedDirective, ElementDestroyedDirective, FadeAnimationClass, GUINotification, GlobalErrorService, HTTPService, HTTPServiceGetRequest, HTTPServicePostRequest, LocalesService, NotificationService, SingletoneStrictClass, TurboApiCallerService, TurboGuiAngularModule, ValidatorsPlus, View, ViewService, ViewsContainerComponent, ViewsService };
+export { AutoFocusOnDisplayDirective, AutoSelectTextOnFocusDirective, BrowserService, BusyStateBaseComponent, ButtonContainerComponent, ButtonImageComponent, DelayedMethodCallManager, DialogBaseComponent, DialogDateSelectionComponent, DialogErrorComponent, DialogMultipleOptionComponent, DialogService, DialogSingleInputComponent, DialogSingleOptionComponent, DialogSingleSelectionListComponent, DialogTwoOptionComponent, ElementCreatedDirective, ElementDestroyedDirective, FadeAnimationClass, GUINotification, GlobalErrorService, HTTPService, HTTPServiceGetRequest, HTTPServicePostRequest, LocalesService, NotificationService, SingletoneStrictClass, TurboApiCallerService, TurboGuiAngularModule, ValidatorsPlus, View, ViewService };
 //# sourceMappingURL=turbogui-angular.mjs.map