@rtsee/ngx 0.0.51 → 0.0.53

package/dist/ngx/fesm2022/rtsee-ngx.mjs

@@ -31,15 +31,15 @@ class NgxService {
     constructor() {
         this.lol = 'lol';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgxService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgxService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: NgxService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NgxService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: () => [] });
 
 class RTSeeControlsComponent {
     onPresentClicked() {
@@ -47,10 +47,10 @@ class RTSeeControlsComponent {
             ? this.rtsee.stopScreenShare()
             : this.rtsee.startScreenShare();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeControlsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RTSeeControlsComponent, selector: "ngx-rtsee-controls", inputs: { rtsee: "rtsee", fullScreenMode: "fullScreenMode" }, ngImport: i0, template: "<div class=\"rtsee-controls\" [ngClass]=\"{'rtsee-full-screen-controls' : fullScreenMode }\">\n  <div class=\"rtsee-bottom-panel\">\n    <div class=\"mic rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"rtsee.microphone\"\n              type=\"button\"\n              (click)=\"this.rtsee.disableMicrophone()\"\n      >\n        <span class=\"material-icons-outlined\">mic_none</span>\n      </button>\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"!rtsee.microphone\"\n              type=\"button\" (click)=\"this.rtsee.enableMicrophone()\"\n      >\n        <span class=\"material-icons-outlined\">mic_off</span>\n      </button>\n    </div>\n\n    <div class=\"video-camera rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"rtsee.camera\"\n              type=\"button\"\n              (click)=\"rtsee.disableCamera()\"\n      >\n        <span class=\"material-icons-outlined\">videocam</span>\n      </button>\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"!rtsee.camera\"\n              type=\"button\"\n              (click)=\"rtsee.enableCamera()\"\n      >\n        <span class=\"material-icons-outlined\">videocam_off</span>\n      </button>\n    </div>\n    <div class=\"present rtsee-buttons-container\" [ngClass]=\"{'rtsee-present-button-container': rtsee.isPresenter}\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              type=\"button\"\n              (click)=\"onPresentClicked()\"\n      >\n        <span class=\"material-icons-outlined\">present_to_all</span>\n      </button>\n    </div>\n    <div class=\"call-end rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              type=\"button\"\n              (click)=\"rtsee.end()\"\n      >\n        <span class=\"material-icons-outlined\">call_end</span>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-controls{display:inline-block;height:100%}.rtsee-controls .rtsee-buttons-container{height:35px;width:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 9px;cursor:pointer}.rtsee-controls .rtsee-buttons-container:last-child{margin-right:0}.rtsee-controls .rtsee-buttons-container:first-child{margin-left:0}.rtsee-controls .rtsee-buttons-container .mdc-icon-button{background-color:#333;color:#fff}.rtsee-controls .rtsee-buttons-container.call-end .mdc-icon-button{background-color:red}.rtsee-controls .rtsee-buttons-container.rtsee-present-button-container .mdc-icon-button{background-color:#090}.rtsee-controls .full-screen{align-self:flex-end;padding:12px;cursor:pointer}.rtsee-controls .rtsee-bottom-panel{padding:12px;display:flex;justify-content:center;align-items:center;border-radius:45px;background-color:#000000b3}.rtsee-controls.rtsee-full-screen-controls .rtsee-buttons-container{height:60px;width:60px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeControlsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RTSeeControlsComponent, selector: "ngx-rtsee-controls", inputs: { rtsee: "rtsee", fullScreenMode: "fullScreenMode" }, ngImport: i0, template: "<div class=\"rtsee-controls\" [ngClass]=\"{'rtsee-full-screen-controls' : fullScreenMode }\">\n  <div class=\"rtsee-bottom-panel\">\n    <div class=\"mic rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"rtsee.microphone\"\n              type=\"button\"\n              (click)=\"this.rtsee.disableMicrophone()\"\n      >\n        <span class=\"material-icons-outlined\">mic_none</span>\n      </button>\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"!rtsee.microphone\"\n              type=\"button\" (click)=\"this.rtsee.enableMicrophone()\"\n      >\n        <span class=\"material-icons-outlined\">mic_off</span>\n      </button>\n    </div>\n\n    <div class=\"video-camera rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"rtsee.camera\"\n              type=\"button\"\n              (click)=\"rtsee.disableCamera()\"\n      >\n        <span class=\"material-icons-outlined\">videocam</span>\n      </button>\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"!rtsee.camera\"\n              type=\"button\"\n              (click)=\"rtsee.enableCamera()\"\n      >\n        <span class=\"material-icons-outlined\">videocam_off</span>\n      </button>\n    </div>\n    <div class=\"present rtsee-buttons-container\" [ngClass]=\"{'rtsee-present-button-container': rtsee.isPresenter}\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              type=\"button\"\n              (click)=\"onPresentClicked()\"\n      >\n        <span class=\"material-icons-outlined\">present_to_all</span>\n      </button>\n    </div>\n    <div class=\"call-end rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              type=\"button\"\n              (click)=\"rtsee.end()\"\n      >\n        <span class=\"material-icons-outlined\">call_end</span>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-controls{display:inline-block;height:100%}.rtsee-controls .rtsee-buttons-container{height:35px;width:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 9px;cursor:pointer}.rtsee-controls .rtsee-buttons-container:last-child{margin-right:0}.rtsee-controls .rtsee-buttons-container:first-child{margin-left:0}.rtsee-controls .rtsee-buttons-container .mdc-icon-button{background-color:#333;color:#fff}.rtsee-controls .rtsee-buttons-container.call-end .mdc-icon-button{background-color:red}.rtsee-controls .rtsee-buttons-container.rtsee-present-button-container .mdc-icon-button{background-color:#090}.rtsee-controls .full-screen{align-self:flex-end;padding:12px;cursor:pointer}.rtsee-controls .rtsee-bottom-panel{padding:12px;display:flex;justify-content:center;align-items:center;border-radius:45px;background-color:#000000b3}.rtsee-controls.rtsee-full-screen-controls .rtsee-buttons-container{height:60px;width:60px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeControlsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeControlsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-controls', template: "<div class=\"rtsee-controls\" [ngClass]=\"{'rtsee-full-screen-controls' : fullScreenMode }\">\n  <div class=\"rtsee-bottom-panel\">\n    <div class=\"mic rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"rtsee.microphone\"\n              type=\"button\"\n              (click)=\"this.rtsee.disableMicrophone()\"\n      >\n        <span class=\"material-icons-outlined\">mic_none</span>\n      </button>\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"!rtsee.microphone\"\n              type=\"button\" (click)=\"this.rtsee.enableMicrophone()\"\n      >\n        <span class=\"material-icons-outlined\">mic_off</span>\n      </button>\n    </div>\n\n    <div class=\"video-camera rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"rtsee.camera\"\n              type=\"button\"\n              (click)=\"rtsee.disableCamera()\"\n      >\n        <span class=\"material-icons-outlined\">videocam</span>\n      </button>\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              *ngIf=\"!rtsee.camera\"\n              type=\"button\"\n              (click)=\"rtsee.enableCamera()\"\n      >\n        <span class=\"material-icons-outlined\">videocam_off</span>\n      </button>\n    </div>\n    <div class=\"present rtsee-buttons-container\" [ngClass]=\"{'rtsee-present-button-container': rtsee.isPresenter}\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              type=\"button\"\n              (click)=\"onPresentClicked()\"\n      >\n        <span class=\"material-icons-outlined\">present_to_all</span>\n      </button>\n    </div>\n    <div class=\"call-end rtsee-buttons-container\">\n      <button mat-icon-button matSuffix\n              class=\"rtsee-ripple-button\"\n              type=\"button\"\n              (click)=\"rtsee.end()\"\n      >\n        <span class=\"material-icons-outlined\">call_end</span>\n      </button>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-controls{display:inline-block;height:100%}.rtsee-controls .rtsee-buttons-container{height:35px;width:35px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 9px;cursor:pointer}.rtsee-controls .rtsee-buttons-container:last-child{margin-right:0}.rtsee-controls .rtsee-buttons-container:first-child{margin-left:0}.rtsee-controls .rtsee-buttons-container .mdc-icon-button{background-color:#333;color:#fff}.rtsee-controls .rtsee-buttons-container.call-end .mdc-icon-button{background-color:red}.rtsee-controls .rtsee-buttons-container.rtsee-present-button-container .mdc-icon-button{background-color:#090}.rtsee-controls .full-screen{align-self:flex-end;padding:12px;cursor:pointer}.rtsee-controls .rtsee-bottom-panel{padding:12px;display:flex;justify-content:center;align-items:center;border-radius:45px;background-color:#000000b3}.rtsee-controls.rtsee-full-screen-controls .rtsee-buttons-container{height:60px;width:60px}\n"] }]
         }], propDecorators: { rtsee: [{
@@ -99,13 +99,13 @@ class RtseeSoundbarComponent {
         this.scaleTwoLevel = scaleTwoValue > 0 ? scaleTwoValue : 0;
         this.scaleThreeLevel = scaleThreeValue > 0 ? scaleTwoValue : 0;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeSoundbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeSoundbarComponent, selector: "ngx-rtsee-soundbar", inputs: { peer: "peer" }, ngImport: i0, template: "<div class=\"rtsee-soundbar\">\n  <div class=\"rtsee-soundbar-scale\">\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-one\"\n           [style.height.%]=\"scaleOneLevel\"\n      ></div>\n    </div>\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-two\"\n           [style.height.%]=\"scaleTwoLevel\"\n      ></div>\n    </div>\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-three\"\n           [style.height.%]=\"scaleThreeLevel\"\n      ></div>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-soundbar{height:19px;width:23px;padding:2px 0 0}.rtsee-soundbar .rtsee-soundbar-scale{height:100%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item{float:left;height:15px;width:5px;margin-left:2px;position:relative;border-radius:4px}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item:last-child:after{content:\"\";display:block;clear:both}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level{position:absolute;bottom:0;left:0;height:10%;width:100%;transition:height .05s;background-color:#00ce00;min-height:25%;border-radius:1px}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-one{max-height:33.3%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-two{max-height:66.6%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-three{max-height:100%}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeSoundbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeSoundbarComponent, selector: "ngx-rtsee-soundbar", inputs: { peer: "peer" }, ngImport: i0, template: "<div class=\"rtsee-soundbar\">\n  <div class=\"rtsee-soundbar-scale\">\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-one\"\n           [style.height.%]=\"scaleOneLevel\"\n      ></div>\n    </div>\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-two\"\n           [style.height.%]=\"scaleTwoLevel\"\n      ></div>\n    </div>\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-three\"\n           [style.height.%]=\"scaleThreeLevel\"\n      ></div>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-soundbar{height:19px;width:23px;padding:2px 0 0}.rtsee-soundbar .rtsee-soundbar-scale{height:100%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item{float:left;height:15px;width:5px;margin-left:2px;position:relative;border-radius:4px}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item:last-child:after{content:\"\";display:block;clear:both}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level{position:absolute;bottom:0;left:0;height:10%;width:100%;transition:height .05s;background-color:#00ce00;min-height:25%;border-radius:1px}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-one{max-height:33.3%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-two{max-height:66.6%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-three{max-height:100%}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeSoundbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeSoundbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-soundbar', template: "<div class=\"rtsee-soundbar\">\n  <div class=\"rtsee-soundbar-scale\">\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-one\"\n           [style.height.%]=\"scaleOneLevel\"\n      ></div>\n    </div>\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-two\"\n           [style.height.%]=\"scaleTwoLevel\"\n      ></div>\n    </div>\n    <div class=\"rtsee-soundbar-scale-item\">\n      <div class=\"rtsee-soundbar-scale-item-level rtsee-soundbar-scale-item-level-three\"\n           [style.height.%]=\"scaleThreeLevel\"\n      ></div>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-soundbar{height:19px;width:23px;padding:2px 0 0}.rtsee-soundbar .rtsee-soundbar-scale{height:100%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item{float:left;height:15px;width:5px;margin-left:2px;position:relative;border-radius:4px}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item:last-child:after{content:\"\";display:block;clear:both}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level{position:absolute;bottom:0;left:0;height:10%;width:100%;transition:height .05s;background-color:#00ce00;min-height:25%;border-radius:1px}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-one{max-height:33.3%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-two{max-height:66.6%}.rtsee-soundbar .rtsee-soundbar-scale .rtsee-soundbar-scale-item .rtsee-soundbar-scale-item-level.rtsee-soundbar-scale-item-level-three{max-height:100%}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { peer: [{
+        }], ctorParameters: () => [], propDecorators: { peer: [{
                 type: Input
             }] } });
 
@@ -120,13 +120,13 @@ class RtseePeerComponent {
         }
         this.peer.setAudioOutputElement(this.audioOutput.nativeElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseePeerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseePeerComponent, selector: "ngx-rtsee-peer", inputs: { peer: "peer" }, viewQueries: [{ propertyName: "audioOutput", first: true, predicate: ["audioOutput"], descendants: true }, { propertyName: "videoOutput", first: true, predicate: ["videoOutput"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-peer\" [ngClass]=\"{\n'rtsee-peer-video-disabled': !peer.remoteVideoStream || !peer.camera\n}\">\n  <div class=\"rtsee-peer-content\">\n    <div class=\"rtsee-peer-photo\" *ngIf=\"!peer.camera\">\n      <div class=\"rtsee-peer-photo-wrapper\">\n        <div  *ngIf=\"peer.imageUrl\"\n              [style.background-image]=\"'url(' + peer.imageUrl + ')'\"\n              class=\"rtsee-peer-photo-image\"\n        ></div>\n        <img *ngIf=\"!peer.imageUrl\" [src]=\"\" alt=\"peer_photo\" class=\"rtsee-peer-photo-image\">\n      </div>\n      <div class=\"rtsee-peer-info\">\n        <p class=\"rtsee-peer-name\" *ngIf=\"peer.name\">{{peer.name}}</p>\n      </div>\n    </div>\n      <video #videoOutput\n             class=\"rtsee-peer-video\"\n             [autoplay]=\"true\"\n             [srcObject]=\"peer.remoteVideoStream\"\n             playsinline=\"true\"\n      >\n      </video>\n    <div class=\"rtsee-peer-soundbar\">\n      <ngx-rtsee-soundbar [peer]=\"peer\"></ngx-rtsee-soundbar>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: RtseeSoundbarComponent, selector: "ngx-rtsee-soundbar", inputs: ["peer"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseePeerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseePeerComponent, selector: "ngx-rtsee-peer", inputs: { peer: "peer" }, viewQueries: [{ propertyName: "audioOutput", first: true, predicate: ["audioOutput"], descendants: true }, { propertyName: "videoOutput", first: true, predicate: ["videoOutput"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-peer\" [ngClass]=\"{\n'rtsee-peer-video-disabled': !peer.remoteVideoStream || !peer.camera\n}\">\n  <div class=\"rtsee-peer-content\">\n    <div class=\"rtsee-peer-photo\" *ngIf=\"!peer.camera\">\n      <div class=\"rtsee-peer-photo-wrapper\">\n        <div  *ngIf=\"peer.imageUrl\"\n              [style.background-image]=\"'url(' + peer.imageUrl + ')'\"\n              class=\"rtsee-peer-photo-image\"\n        ></div>\n        <img *ngIf=\"!peer.imageUrl\" [src]=\"\" alt=\"peer_photo\" class=\"rtsee-peer-photo-image\">\n      </div>\n      <div class=\"rtsee-peer-info\">\n        <p class=\"rtsee-peer-name\" *ngIf=\"peer.name\">{{peer.name}}</p>\n      </div>\n    </div>\n      <video #videoOutput\n             class=\"rtsee-peer-video\"\n             [autoplay]=\"true\"\n             [srcObject]=\"peer.remoteVideoStream\"\n             playsinline=\"true\"\n      >\n      </video>\n    <div class=\"rtsee-peer-soundbar\">\n      <ngx-rtsee-soundbar [peer]=\"peer\"></ngx-rtsee-soundbar>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: RtseeSoundbarComponent, selector: "ngx-rtsee-soundbar", inputs: ["peer"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseePeerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseePeerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-peer', template: "<div class=\"rtsee-peer\" [ngClass]=\"{\n'rtsee-peer-video-disabled': !peer.remoteVideoStream || !peer.camera\n}\">\n  <div class=\"rtsee-peer-content\">\n    <div class=\"rtsee-peer-photo\" *ngIf=\"!peer.camera\">\n      <div class=\"rtsee-peer-photo-wrapper\">\n        <div  *ngIf=\"peer.imageUrl\"\n              [style.background-image]=\"'url(' + peer.imageUrl + ')'\"\n              class=\"rtsee-peer-photo-image\"\n        ></div>\n        <img *ngIf=\"!peer.imageUrl\" [src]=\"\" alt=\"peer_photo\" class=\"rtsee-peer-photo-image\">\n      </div>\n      <div class=\"rtsee-peer-info\">\n        <p class=\"rtsee-peer-name\" *ngIf=\"peer.name\">{{peer.name}}</p>\n      </div>\n    </div>\n      <video #videoOutput\n             class=\"rtsee-peer-video\"\n             [autoplay]=\"true\"\n             [srcObject]=\"peer.remoteVideoStream\"\n             playsinline=\"true\"\n      >\n      </video>\n    <div class=\"rtsee-peer-soundbar\">\n      <ngx-rtsee-soundbar [peer]=\"peer\"></ngx-rtsee-soundbar>\n    </div>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { audioOutput: [{
+        }], ctorParameters: () => [], propDecorators: { audioOutput: [{
                 type: ViewChild,
                 args: ['audioOutput']
             }], videoOutput: [{
@@ -167,13 +167,13 @@ class RtseeSettingsComponent {
         }
         this.rtSee.setVideoInputDevice(this.videoInputDeviceId);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeSettingsComponent, selector: "ngx-rtsee-settings", inputs: { rtSee: "rtSee", fullScreenMode: "fullScreenMode" }, ngImport: i0, template: "<div class=\"rtsee-settings\" [ngClass]=\"{'rtsee-full-screen-settings' : fullScreenMode}\">\n  <div class=\"rtsee-devices\">\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"audio-input\">Audio Input:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"audioInputChanged()\"\n              [(ngModel)]=\"audioInputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"audio-input\"\n      >\n        <option *ngFor=\"let device of rtSee.audioInputDevices\"\n                [value]=\"device.deviceId\">\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"audio-output\">Audio Output:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"audioOutputChanged()\"\n              [(ngModel)]=\"audioOutputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"audio-output\"\n      >\n        <option *ngFor=\"let device of rtSee.audioOutputDevices\" [value]=\"device.deviceId\" >\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"video-input\">Video Input:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"videoInputChanged()\"\n              [(ngModel)]=\"videoInputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"video-input\"\n      >\n        <option *ngFor=\"let device of rtSee.videoInputDevices\" [value]=\"device.deviceId\">\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-settings{box-sizing:border-box;background-color:#404040;border-bottom:1px solid;max-height:180px;padding:16px 0;overflow:auto;color:#fff}.rtsee-settings .rtsee-device-select-wrapper{padding:0 10px}.rtsee-settings .rtsee-device-select-wrapper .rtsee-select-label{font-family:monospace;display:inline-block;margin:8px}.rtsee-settings.rtsee-full-screen-settings{max-height:unset;overflow:unset}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeSettingsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeSettingsComponent, selector: "ngx-rtsee-settings", inputs: { rtSee: "rtSee", fullScreenMode: "fullScreenMode" }, ngImport: i0, template: "<div class=\"rtsee-settings\" [ngClass]=\"{'rtsee-full-screen-settings' : fullScreenMode}\">\n  <div class=\"rtsee-devices\">\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"audio-input\">Audio Input:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"audioInputChanged()\"\n              [(ngModel)]=\"audioInputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"audio-input\"\n      >\n        <option *ngFor=\"let device of rtSee.audioInputDevices\"\n                [value]=\"device.deviceId\">\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"audio-output\">Audio Output:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"audioOutputChanged()\"\n              [(ngModel)]=\"audioOutputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"audio-output\"\n      >\n        <option *ngFor=\"let device of rtSee.audioOutputDevices\" [value]=\"device.deviceId\" >\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"video-input\">Video Input:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"videoInputChanged()\"\n              [(ngModel)]=\"videoInputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"video-input\"\n      >\n        <option *ngFor=\"let device of rtSee.videoInputDevices\" [value]=\"device.deviceId\">\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-settings{box-sizing:border-box;background-color:#404040;border-bottom:1px solid;max-height:180px;padding:16px 0;overflow:auto;color:#fff}.rtsee-settings .rtsee-device-select-wrapper{padding:0 10px}.rtsee-settings .rtsee-device-select-wrapper .rtsee-select-label{font-family:monospace;display:inline-block;margin:8px}.rtsee-settings.rtsee-full-screen-settings{max-height:unset;overflow:unset}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeSettingsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeSettingsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-settings', template: "<div class=\"rtsee-settings\" [ngClass]=\"{'rtsee-full-screen-settings' : fullScreenMode}\">\n  <div class=\"rtsee-devices\">\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"audio-input\">Audio Input:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"audioInputChanged()\"\n              [(ngModel)]=\"audioInputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"audio-input\"\n      >\n        <option *ngFor=\"let device of rtSee.audioInputDevices\"\n                [value]=\"device.deviceId\">\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"audio-output\">Audio Output:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"audioOutputChanged()\"\n              [(ngModel)]=\"audioOutputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"audio-output\"\n      >\n        <option *ngFor=\"let device of rtSee.audioOutputDevices\" [value]=\"device.deviceId\" >\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n    <div class=\"rtsee-device-select-wrapper\">\n      <label class=\"rtsee-select-label\" for=\"video-input\">Video Input:</label>\n      <select (click)=\"refreshSelectOptions()\"\n              (ngModelChange)=\"videoInputChanged()\"\n              [(ngModel)]=\"videoInputDeviceId\"\n              class=\"rtsee-select\"\n              id=\"video-input\"\n      >\n        <option *ngFor=\"let device of rtSee.videoInputDevices\" [value]=\"device.deviceId\">\n          {{device.label}}\n        </option>\n      </select>\n    </div>\n  </div>\n</div>\n", styles: [".rtsee-settings{box-sizing:border-box;background-color:#404040;border-bottom:1px solid;max-height:180px;padding:16px 0;overflow:auto;color:#fff}.rtsee-settings .rtsee-device-select-wrapper{padding:0 10px}.rtsee-settings .rtsee-device-select-wrapper .rtsee-select-label{font-family:monospace;display:inline-block;margin:8px}.rtsee-settings.rtsee-full-screen-settings{max-height:unset;overflow:unset}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { rtSee: [{
+        }], ctorParameters: () => [], propDecorators: { rtSee: [{
                 type: Input
             }], fullScreenMode: [{
                 type: Input
@@ -189,13 +189,13 @@ class RTSeeConferenceComponent {
     toggleFullScreenMode() {
         this.rtSee.uiControls.toggle();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeConferenceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: { rtSee: "rtSee" }, ngImport: i0, template: "<div class=\"rtsee-conference-shell\" [ngClass]=\"{\n'rtsee-conference-shell-expanded': rtSee.uiControls.isExpanded,\n'rtsee-conference-shell-no-companions': !rtSee.rtcPeerConnections.connections?.length\n}\">\n  <div class=\"rtsee-local-peer\" *ngIf=\"rtSee.localStream && rtSee.camera\">\n    <video class=\"rtsee-local-video\"\n           [autoplay]=\"true\"\n           [muted]=\"true\"\n           [srcObject]=\"rtSee.localStream\"\n           playsinline=\"true\"\n    ></video>\n  </div>\n  <div class=\"rtsee-window-controls\">\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleSettings()\"\n            class=\"rtsee-window-controls-button rtsee-ripple-button\"\n    >\n      <span class=\"material-icons-outlined\">settings</span>\n    </button>\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleFullScreenMode()\"\n            class=\"rtsee-window-controls-button rtsee-ripple-button\"\n    >\n      <span class=\"material-icons-outlined\">open_in_full</span>\n    </button>\n  </div>\n  <div class=\"rtsee-settings-container\" *ngIf=\"settingsViewEnabled\">\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleSettings()\"\n            class=\"rtsee-close-settings-button\"\n    >\n      <span class=\"material-icons-outlined\">close</span>\n    </button>\n    <ngx-rtsee-settings [rtSee]=\"rtSee\" [fullScreenMode]=\"rtSee.uiControls.isExpanded\"></ngx-rtsee-settings>\n  </div>\n  <div class=\"rtsee-screen-share\" *ngIf=\"rtSee.screenSharePeer\" >\n    <video [autoplay]=\"true\"\n           [muted]=\"true\"\n           [srcObject]=\"rtSee.screenSharePeer.remoteVideoStream\"\n           playsinline=\"true\"\n           class=\"rtsee-screen-share-video\"\n    ></video>\n  </div>\n  <div class=\"rtsee-peers\" [ngClass]=\"{\n    'rtsee-peers-alone': !rtSee.rtcPeerConnections.connections?.length,\n    'rtsee-peers-one': rtSee.rtcPeerConnections.connections?.length === 1,\n    'rtsee-peers-three-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length > 1\n      && rtSee.rtcPeerConnections.connections.length < 4,\n    'rtsee-peers-six-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length > 3\n      && rtSee.rtcPeerConnections.connections.length < 7,\n    'rtsee-peers-nine-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length >= 7\n  }\">\n    <div class=\"rtsee-peer-wrapper\"\n         *ngFor=\"let peer of rtSee.rtcPeerConnections.connections\"\n    >\n      <ngx-rtsee-peer [peer]=\"peer\"></ngx-rtsee-peer>\n    </div>\n  </div>\n  <div class=\"rtsee-peers-list\"></div>\n  <div class=\"rtsee-controls-wrapper\">\n    <ngx-rtsee-controls [rtsee]=\"rtSee\" [fullScreenMode]=\"rtSee.uiControls.isExpanded\"></ngx-rtsee-controls>\n  </div>\n</div>\n\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: RTSeeControlsComponent, selector: "ngx-rtsee-controls", inputs: ["rtsee", "fullScreenMode"] }, { kind: "component", type: RtseePeerComponent, selector: "ngx-rtsee-peer", inputs: ["peer"] }, { kind: "component", type: RtseeSettingsComponent, selector: "ngx-rtsee-settings", inputs: ["rtSee", "fullScreenMode"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeConferenceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: { rtSee: "rtSee" }, ngImport: i0, template: "<div class=\"rtsee-conference-shell\" [ngClass]=\"{\n'rtsee-conference-shell-expanded': rtSee.uiControls.isExpanded,\n'rtsee-conference-shell-no-companions': !rtSee.rtcPeerConnections.connections?.length\n}\">\n  <div class=\"rtsee-local-peer\" *ngIf=\"rtSee.localStream && rtSee.camera\">\n    <video class=\"rtsee-local-video\"\n           [autoplay]=\"true\"\n           [muted]=\"true\"\n           [srcObject]=\"rtSee.localStream\"\n           playsinline=\"true\"\n    ></video>\n  </div>\n  <div class=\"rtsee-window-controls\">\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleSettings()\"\n            class=\"rtsee-window-controls-button rtsee-ripple-button\"\n    >\n      <span class=\"material-icons-outlined\">settings</span>\n    </button>\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleFullScreenMode()\"\n            class=\"rtsee-window-controls-button rtsee-ripple-button\"\n    >\n      <span class=\"material-icons-outlined\">open_in_full</span>\n    </button>\n  </div>\n  <div class=\"rtsee-settings-container\" *ngIf=\"settingsViewEnabled\">\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleSettings()\"\n            class=\"rtsee-close-settings-button\"\n    >\n      <span class=\"material-icons-outlined\">close</span>\n    </button>\n    <ngx-rtsee-settings [rtSee]=\"rtSee\" [fullScreenMode]=\"rtSee.uiControls.isExpanded\"></ngx-rtsee-settings>\n  </div>\n  <div class=\"rtsee-screen-share\" *ngIf=\"rtSee.screenSharePeer\" >\n    <video [autoplay]=\"true\"\n           [muted]=\"true\"\n           [srcObject]=\"rtSee.screenSharePeer.remoteVideoStream\"\n           playsinline=\"true\"\n           class=\"rtsee-screen-share-video\"\n    ></video>\n  </div>\n  <div class=\"rtsee-peers\" [ngClass]=\"{\n    'rtsee-peers-alone': !rtSee.rtcPeerConnections.connections?.length,\n    'rtsee-peers-one': rtSee.rtcPeerConnections.connections?.length === 1,\n    'rtsee-peers-three-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length > 1\n      && rtSee.rtcPeerConnections.connections.length < 4,\n    'rtsee-peers-six-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length > 3\n      && rtSee.rtcPeerConnections.connections.length < 7,\n    'rtsee-peers-nine-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length >= 7\n  }\">\n    <div class=\"rtsee-peer-wrapper\"\n         *ngFor=\"let peer of rtSee.rtcPeerConnections.connections\"\n    >\n      <ngx-rtsee-peer [peer]=\"peer\"></ngx-rtsee-peer>\n    </div>\n  </div>\n  <div class=\"rtsee-peers-list\"></div>\n  <div class=\"rtsee-controls-wrapper\">\n    <ngx-rtsee-controls [rtsee]=\"rtSee\" [fullScreenMode]=\"rtSee.uiControls.isExpanded\"></ngx-rtsee-controls>\n  </div>\n</div>\n\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: RTSeeControlsComponent, selector: "ngx-rtsee-controls", inputs: ["rtsee", "fullScreenMode"] }, { kind: "component", type: RtseePeerComponent, selector: "ngx-rtsee-peer", inputs: ["peer"] }, { kind: "component", type: RtseeSettingsComponent, selector: "ngx-rtsee-settings", inputs: ["rtSee", "fullScreenMode"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeConferenceComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeConferenceComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-conference', template: "<div class=\"rtsee-conference-shell\" [ngClass]=\"{\n'rtsee-conference-shell-expanded': rtSee.uiControls.isExpanded,\n'rtsee-conference-shell-no-companions': !rtSee.rtcPeerConnections.connections?.length\n}\">\n  <div class=\"rtsee-local-peer\" *ngIf=\"rtSee.localStream && rtSee.camera\">\n    <video class=\"rtsee-local-video\"\n           [autoplay]=\"true\"\n           [muted]=\"true\"\n           [srcObject]=\"rtSee.localStream\"\n           playsinline=\"true\"\n    ></video>\n  </div>\n  <div class=\"rtsee-window-controls\">\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleSettings()\"\n            class=\"rtsee-window-controls-button rtsee-ripple-button\"\n    >\n      <span class=\"material-icons-outlined\">settings</span>\n    </button>\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleFullScreenMode()\"\n            class=\"rtsee-window-controls-button rtsee-ripple-button\"\n    >\n      <span class=\"material-icons-outlined\">open_in_full</span>\n    </button>\n  </div>\n  <div class=\"rtsee-settings-container\" *ngIf=\"settingsViewEnabled\">\n    <button mat-icon-button matSuffix\n            type=\"button\"\n            (click)=\"this.toggleSettings()\"\n            class=\"rtsee-close-settings-button\"\n    >\n      <span class=\"material-icons-outlined\">close</span>\n    </button>\n    <ngx-rtsee-settings [rtSee]=\"rtSee\" [fullScreenMode]=\"rtSee.uiControls.isExpanded\"></ngx-rtsee-settings>\n  </div>\n  <div class=\"rtsee-screen-share\" *ngIf=\"rtSee.screenSharePeer\" >\n    <video [autoplay]=\"true\"\n           [muted]=\"true\"\n           [srcObject]=\"rtSee.screenSharePeer.remoteVideoStream\"\n           playsinline=\"true\"\n           class=\"rtsee-screen-share-video\"\n    ></video>\n  </div>\n  <div class=\"rtsee-peers\" [ngClass]=\"{\n    'rtsee-peers-alone': !rtSee.rtcPeerConnections.connections?.length,\n    'rtsee-peers-one': rtSee.rtcPeerConnections.connections?.length === 1,\n    'rtsee-peers-three-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length > 1\n      && rtSee.rtcPeerConnections.connections.length < 4,\n    'rtsee-peers-six-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length > 3\n      && rtSee.rtcPeerConnections.connections.length < 7,\n    'rtsee-peers-nine-grid': rtSee.rtcPeerConnections.connections?.length\n      && rtSee.rtcPeerConnections.connections.length >= 7\n  }\">\n    <div class=\"rtsee-peer-wrapper\"\n         *ngFor=\"let peer of rtSee.rtcPeerConnections.connections\"\n    >\n      <ngx-rtsee-peer [peer]=\"peer\"></ngx-rtsee-peer>\n    </div>\n  </div>\n  <div class=\"rtsee-peers-list\"></div>\n  <div class=\"rtsee-controls-wrapper\">\n    <ngx-rtsee-controls [rtsee]=\"rtSee\" [fullScreenMode]=\"rtSee.uiControls.isExpanded\"></ngx-rtsee-controls>\n  </div>\n</div>\n\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { rtSee: [{
+        }], ctorParameters: () => [], propDecorators: { rtSee: [{
                 type: Input
             }] } });
 
@@ -277,10 +277,10 @@ class TimeFormatHelperService {
         }
         return this.toDateNumeralWithYear(time);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: TimeFormatHelperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: TimeFormatHelperService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TimeFormatHelperService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TimeFormatHelperService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: TimeFormatHelperService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TimeFormatHelperService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -291,15 +291,15 @@ class WidgetDirective {
     constructor(viewContainerRef) {
         this.viewContainerRef = viewContainerRef;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: WidgetDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.3", type: WidgetDirective, selector: "[widgetHost]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: WidgetDirective, selector: "[widgetHost]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: WidgetDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WidgetDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[widgetHost]',
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
+        }], ctorParameters: () => [{ type: i0.ViewContainerRef }] });
 
 class CallWidgetComponent {
     ngOnInit() {
@@ -317,10 +317,10 @@ class CallWidgetComponent {
         }
         void this.messenger.joinCall(this.message.data.roomId);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: CallWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: CallWidgetComponent, selector: "ngx-call-widget", inputs: { message: "message", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-call-widget\">\n  <p *ngIf=\"callerName && callerName !== 'You'\"> {{ callerName }} has started a call</p>\n  <p *ngIf=\"callerName && callerName === 'You'\"> You have started a call</p>\n  <p *ngIf=\"!callerName\"> The call has started</p>\n  <button class=\"rtsee-join-call-btn\"\n          [ngClass]=\"{'rtsee-join-your-call-btn': callerName && callerName === 'You'}\"\n          (click)=\"joinCall()\">\n    Join Call\n  </button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CallWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CallWidgetComponent, selector: "ngx-call-widget", inputs: { message: "message", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-call-widget\">\n  <p *ngIf=\"callerName && callerName !== 'You'\"> {{ callerName }} has started a call</p>\n  <p *ngIf=\"callerName && callerName === 'You'\"> You have started a call</p>\n  <p *ngIf=\"!callerName\"> The call has started</p>\n  <button class=\"rtsee-join-call-btn\"\n          [ngClass]=\"{'rtsee-join-your-call-btn': callerName && callerName === 'You'}\"\n          (click)=\"joinCall()\">\n    Join Call\n  </button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: CallWidgetComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CallWidgetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-call-widget', template: "<div class=\"rtsee-call-widget\">\n  <p *ngIf=\"callerName && callerName !== 'You'\"> {{ callerName }} has started a call</p>\n  <p *ngIf=\"callerName && callerName === 'You'\"> You have started a call</p>\n  <p *ngIf=\"!callerName\"> The call has started</p>\n  <button class=\"rtsee-join-call-btn\"\n          [ngClass]=\"{'rtsee-join-your-call-btn': callerName && callerName === 'You'}\"\n          (click)=\"joinCall()\">\n    Join Call\n  </button>\n</div>\n" }]
         }], propDecorators: { message: [{
@@ -344,10 +344,10 @@ class MessageWidgetsService {
         return mapping.component;
         /* eslint-enable */
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageWidgetsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageWidgetsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageWidgetsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageWidgetsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageWidgetsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageWidgetsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -368,13 +368,13 @@ class PreloaderComponent {
         //viewBox="0 0 100 100"
         //d="M 50 96 a 46 46 0 0 1 0 -92 46 46 0 0 1 0 92"
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: PreloaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: PreloaderComponent, selector: "rtsee-preloader", inputs: { diameter: "diameter", color: "color" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-preloader\">\n  <svg [style.max-width.px]=\"diameter\" #canvas [attr.viewBox]=\"viewBox\">\n    <path [attr.d]=\"d\" [attr.stroke]=\"color\"/>\n  </svg>\n</div>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PreloaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PreloaderComponent, selector: "rtsee-preloader", inputs: { diameter: "diameter", color: "color" }, viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-preloader\">\n  <svg [style.max-width.px]=\"diameter\" #canvas [attr.viewBox]=\"viewBox\">\n    <path [attr.d]=\"d\" [attr.stroke]=\"color\"/>\n  </svg>\n</div>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: PreloaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PreloaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-preloader', template: "<div class=\"rtsee-preloader\">\n  <svg [style.max-width.px]=\"diameter\" #canvas [attr.viewBox]=\"viewBox\">\n    <path [attr.d]=\"d\" [attr.stroke]=\"color\"/>\n  </svg>\n</div>\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { canvas: [{
+        }], ctorParameters: () => [], propDecorators: { canvas: [{
                 type: ViewChild,
                 args: ['canvas']
             }], diameter: [{
@@ -387,13 +387,13 @@ class MessageTimeAndStatusComponent {
     constructor(timeFormatService) {
         this.timeFormatService = timeFormatService;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageTimeAndStatusComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: MessageTimeAndStatusComponent, selector: "rtsee-message-time-and-status", inputs: { message: "message", hideStatus: "hideStatus", inChat: "inChat" }, ngImport: i0, template: "<div class=\"rtsee-messenger-message-time-and-status\">\n  <span class=\"rtsee-messenger-message-status\" *ngIf=\"!hideStatus\" [ngClass]=\"{'showing-status-inside-chat': inChat }\">\n    <span *ngIf=\"message.status === 'pending'\"><rtsee-preloader [diameter]=\"5\"></rtsee-preloader></span>\n    <span *ngIf=\"message.status === 'sent'\" class=\"material-icons-outlined rtsee-message-sent-status\">check</span>\n    <span *ngIf=\"message.status === 'delivered'\" class=\"material-icons-outlined rtsee-message-delivered-status\">check</span>\n    <span *ngIf=\"message.status === 'seen'\" class=\"material-icons-outlined rtsee-message-seen-status\">done_all</span>\n  </span>\n  <span class=\"rtsee-messenger-message-time\">{{timeFormatService.formatTimeOrDate(message.createdAt)}}</span>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageTimeAndStatusComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MessageTimeAndStatusComponent, selector: "rtsee-message-time-and-status", inputs: { message: "message", hideStatus: "hideStatus", inChat: "inChat" }, ngImport: i0, template: "<div class=\"rtsee-messenger-message-time-and-status\">\n  <span class=\"rtsee-messenger-message-status\" *ngIf=\"!hideStatus\" [ngClass]=\"{'showing-status-inside-chat': inChat }\">\n    <span *ngIf=\"message.status === 'pending'\"><rtsee-preloader [diameter]=\"5\"></rtsee-preloader></span>\n    <span *ngIf=\"message.status === 'sent'\" class=\"material-icons-outlined rtsee-message-sent-status\">check</span>\n    <span *ngIf=\"message.status === 'delivered'\" class=\"material-icons-outlined rtsee-message-delivered-status\">check</span>\n    <span *ngIf=\"message.status === 'seen'\" class=\"material-icons-outlined rtsee-message-seen-status\">done_all</span>\n  </span>\n  <span class=\"rtsee-messenger-message-time\">{{timeFormatService.formatTimeOrDate(message.createdAt)}}</span>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageTimeAndStatusComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageTimeAndStatusComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-message-time-and-status', template: "<div class=\"rtsee-messenger-message-time-and-status\">\n  <span class=\"rtsee-messenger-message-status\" *ngIf=\"!hideStatus\" [ngClass]=\"{'showing-status-inside-chat': inChat }\">\n    <span *ngIf=\"message.status === 'pending'\"><rtsee-preloader [diameter]=\"5\"></rtsee-preloader></span>\n    <span *ngIf=\"message.status === 'sent'\" class=\"material-icons-outlined rtsee-message-sent-status\">check</span>\n    <span *ngIf=\"message.status === 'delivered'\" class=\"material-icons-outlined rtsee-message-delivered-status\">check</span>\n    <span *ngIf=\"message.status === 'seen'\" class=\"material-icons-outlined rtsee-message-seen-status\">done_all</span>\n  </span>\n  <span class=\"rtsee-messenger-message-time\">{{timeFormatService.formatTimeOrDate(message.createdAt)}}</span>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: TimeFormatHelperService }]; }, propDecorators: { message: [{
+        }], ctorParameters: () => [{ type: TimeFormatHelperService }], propDecorators: { message: [{
                 type: Input
             }], hideStatus: [{
                 type: Input
@@ -424,13 +424,13 @@ class MessageComponent {
         }
         /* eslint-enable */
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageComponent, deps: [{ token: MessageWidgetsService }, { token: i0.ComponentFactoryResolver }, { token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: MessageComponent, selector: "rtsee-message", inputs: { chat: "chat", message: "message", member: "member", messenger: "messenger" }, viewQueries: [{ propertyName: "widgetHost", first: true, predicate: WidgetDirective, descendants: true }], ngImport: i0, template: "<div class=\"rtsee-messenger-message-container\" #rtsMessageContainer\n     [ngClass]=\"{'rtsee-message-from-me': message.from.id === messenger.clientId}\"\n>\n  <div class=\"rtsee-messenger-message\">\n    <ng-template *ngIf=\"message.widget\" widgetHost></ng-template>\n    <p *ngIf=\"!message.widget\"\n       class=\"rtsee-messenger-message-text\"\n    >{{ message.text }}</p>\n    <div class=\"rtsee-messenger-message-info\" #rtsMessageInfo>\n     <rtsee-message-time-and-status [message]=\"message\"\n                                    [inChat]=\"true\"\n                                    [hideStatus]=\"message.from.id !== messenger.clientId\"\n     ></rtsee-message-time-and-status>\n    </div>\n  </div>\n  <div class=\"message-tail\"></div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }, { kind: "component", type: MessageTimeAndStatusComponent, selector: "rtsee-message-time-and-status", inputs: ["message", "hideStatus", "inChat"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageComponent, deps: [{ token: MessageWidgetsService }, { token: i0.ComponentFactoryResolver }, { token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MessageComponent, selector: "rtsee-message", inputs: { chat: "chat", message: "message", member: "member", messenger: "messenger" }, viewQueries: [{ propertyName: "widgetHost", first: true, predicate: WidgetDirective, descendants: true }], ngImport: i0, template: "<div class=\"rtsee-messenger-message-container\" #rtsMessageContainer\n     [ngClass]=\"{'rtsee-message-from-me': message.from.id === messenger.clientId}\"\n>\n  <div class=\"rtsee-messenger-message\">\n    <ng-template *ngIf=\"message.widget\" widgetHost></ng-template>\n    <p *ngIf=\"!message.widget\"\n       class=\"rtsee-messenger-message-text\"\n    >{{ message.text }}</p>\n    <div class=\"rtsee-messenger-message-info\" #rtsMessageInfo>\n     <rtsee-message-time-and-status [message]=\"message\"\n                                    [inChat]=\"true\"\n                                    [hideStatus]=\"message.from.id !== messenger.clientId\"\n     ></rtsee-message-time-and-status>\n    </div>\n  </div>\n  <div class=\"message-tail\"></div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }, { kind: "component", type: MessageTimeAndStatusComponent, selector: "rtsee-message-time-and-status", inputs: ["message", "hideStatus", "inChat"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-message', template: "<div class=\"rtsee-messenger-message-container\" #rtsMessageContainer\n     [ngClass]=\"{'rtsee-message-from-me': message.from.id === messenger.clientId}\"\n>\n  <div class=\"rtsee-messenger-message\">\n    <ng-template *ngIf=\"message.widget\" widgetHost></ng-template>\n    <p *ngIf=\"!message.widget\"\n       class=\"rtsee-messenger-message-text\"\n    >{{ message.text }}</p>\n    <div class=\"rtsee-messenger-message-info\" #rtsMessageInfo>\n     <rtsee-message-time-and-status [message]=\"message\"\n                                    [inChat]=\"true\"\n                                    [hideStatus]=\"message.from.id !== messenger.clientId\"\n     ></rtsee-message-time-and-status>\n    </div>\n  </div>\n  <div class=\"message-tail\"></div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: MessageWidgetsService }, { type: i0.ComponentFactoryResolver }, { type: TimeFormatHelperService }]; }, propDecorators: { chat: [{
+        }], ctorParameters: () => [{ type: MessageWidgetsService }, { type: i0.ComponentFactoryResolver }, { type: TimeFormatHelperService }], propDecorators: { chat: [{
                 type: Input
             }], message: [{
                 type: Input
@@ -490,13 +490,13 @@ class MessagesListComponent {
     formatDate(message) {
         return this.timeFormatService.formatDate(message.createdAt);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessagesListComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: MessagesListComponent, selector: "rtsee-messages-list", inputs: { chat: "chat", messenger: "messenger" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollBlock"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-messenger-messages-list\"\n     #scrollBlock\n     infiniteScroll\n     [infiniteScrollUpDistance]=\"2\"\n     [infiniteScrollDistance]=\"2\"\n     [infiniteScrollThrottle]=\"50\"\n     [scrollWindow]=\"false\"\n     (scrolledUp)=\"onScrolledToTop()\"\n     (scroll)=\"onScroll()\"\n>\n  <div *ngFor=\"let message of chat.messages; let i = index;\"\n       [ngClass]=\"{'rtsee-messenger-message-wrapper-consecutive': message.from === chat.messages[i+1]?.from}\"\n       class=\"rtsee-messenger-message-wrapper\"\n  >\n    <rtsee-message [message]=\"message\" [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-message>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: MessageComponent, selector: "rtsee-message", inputs: ["chat", "message", "member", "messenger"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessagesListComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MessagesListComponent, selector: "rtsee-messages-list", inputs: { chat: "chat", messenger: "messenger" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollBlock"], descendants: true }], ngImport: i0, template: "<div class=\"rtsee-messenger-messages-list\"\n     #scrollBlock\n     infiniteScroll\n     [infiniteScrollUpDistance]=\"2\"\n     [infiniteScrollDistance]=\"2\"\n     [infiniteScrollThrottle]=\"50\"\n     [scrollWindow]=\"false\"\n     (scrolledUp)=\"onScrolledToTop()\"\n     (scroll)=\"onScroll()\"\n>\n  <div *ngFor=\"let message of chat.messages; let i = index;\"\n       [ngClass]=\"{'rtsee-messenger-message-wrapper-consecutive': message.from === chat.messages[i+1]?.from}\"\n       class=\"rtsee-messenger-message-wrapper\"\n  >\n    <rtsee-message [message]=\"message\" [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-message>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: MessageComponent, selector: "rtsee-message", inputs: ["chat", "message", "member", "messenger"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessagesListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessagesListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-messages-list', template: "<div class=\"rtsee-messenger-messages-list\"\n     #scrollBlock\n     infiniteScroll\n     [infiniteScrollUpDistance]=\"2\"\n     [infiniteScrollDistance]=\"2\"\n     [infiniteScrollThrottle]=\"50\"\n     [scrollWindow]=\"false\"\n     (scrolledUp)=\"onScrolledToTop()\"\n     (scroll)=\"onScroll()\"\n>\n  <div *ngFor=\"let message of chat.messages; let i = index;\"\n       [ngClass]=\"{'rtsee-messenger-message-wrapper-consecutive': message.from === chat.messages[i+1]?.from}\"\n       class=\"rtsee-messenger-message-wrapper\"\n  >\n    <rtsee-message [message]=\"message\" [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-message>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: TimeFormatHelperService }]; }, propDecorators: { chat: [{
+        }], ctorParameters: () => [{ type: TimeFormatHelperService }], propDecorators: { chat: [{
                 type: Input
             }], messenger: [{
                 type: Input
@@ -521,10 +521,10 @@ class ChatInputComponent {
         this.chat.sendMessage(text);
         this.sendMessageForm.get('message')?.setValue('');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ChatInputComponent, selector: "rtsee-chat-input", inputs: { messenger: "messenger", chat: "chat" }, ngImport: i0, template: "<div class=\"rtsee-chat-input\" xmlns=\"http://www.w3.org/1999/html\">\n  <div class=\"rtsee-send-message\">\n    <form [formGroup]=\"sendMessageForm\" class=\"rtsee-chat-input-form\">\n      <textarea\n        placeholder=\"Type message...\"\n        type=\"text\"\n        formControlName=\"message\"\n        class=\"rtsee-chat-input-field\"\n        autosize\n        required\n        (keyup.enter)=\"sendMessage()\"\n      ></textarea>\n    </form>\n  </div>\n  <button (click)=\"sendMessage()\"\n          class=\"rtsee-send-message-button\"\n          type=\"submit\">\n    <span class=\"material-icons-outlined\">send</span>\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.AutosizeDirective, selector: "[autosize]", inputs: ["minRows", "autosize", "maxRows", "onlyGrow", "useImportant"], outputs: ["resized"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChatInputComponent, selector: "rtsee-chat-input", inputs: { messenger: "messenger", chat: "chat" }, ngImport: i0, template: "<div class=\"rtsee-chat-input\" xmlns=\"http://www.w3.org/1999/html\">\n  <div class=\"rtsee-send-message\">\n    <form [formGroup]=\"sendMessageForm\" class=\"rtsee-chat-input-form\">\n      <textarea\n        placeholder=\"Type message...\"\n        type=\"text\"\n        formControlName=\"message\"\n        class=\"rtsee-chat-input-field\"\n        autosize\n        required\n        (keyup.enter)=\"sendMessage()\"\n      ></textarea>\n    </form>\n  </div>\n  <button (click)=\"sendMessage()\"\n          class=\"rtsee-send-message-button\"\n          type=\"submit\">\n    <span class=\"material-icons-outlined\">send</span>\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2$1.AutosizeDirective, selector: "[autosize]", inputs: ["minRows", "autosize", "maxRows", "onlyGrow", "useImportant"], outputs: ["resized"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-chat-input', template: "<div class=\"rtsee-chat-input\" xmlns=\"http://www.w3.org/1999/html\">\n  <div class=\"rtsee-send-message\">\n    <form [formGroup]=\"sendMessageForm\" class=\"rtsee-chat-input-form\">\n      <textarea\n        placeholder=\"Type message...\"\n        type=\"text\"\n        formControlName=\"message\"\n        class=\"rtsee-chat-input-field\"\n        autosize\n        required\n        (keyup.enter)=\"sendMessage()\"\n      ></textarea>\n    </form>\n  </div>\n  <button (click)=\"sendMessage()\"\n          class=\"rtsee-send-message-button\"\n          type=\"submit\">\n    <span class=\"material-icons-outlined\">send</span>\n  </button>\n</div>\n" }]
         }], propDecorators: { messenger: [{
@@ -534,10 +534,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
             }] } });
 
 class ChatComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ChatComponent, selector: "rtsee-chat", inputs: { chat: "chat", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-chat\">\n  <div class=\"rtsee-chat-body-container\">\n    <rtsee-messages-list [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-messages-list>\n  </div>\n  <div class=\"rtsee-chat-footer-container\">\n    <div class=\"rtsee-chat-footer-container-inner\">\n      <rtsee-chat-input [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-chat-input>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: MessagesListComponent, selector: "rtsee-messages-list", inputs: ["chat", "messenger"] }, { kind: "component", type: ChatInputComponent, selector: "rtsee-chat-input", inputs: ["messenger", "chat"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChatComponent, selector: "rtsee-chat", inputs: { chat: "chat", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-chat\">\n  <div class=\"rtsee-chat-body-container\">\n    <rtsee-messages-list [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-messages-list>\n  </div>\n  <div class=\"rtsee-chat-footer-container\">\n    <div class=\"rtsee-chat-footer-container-inner\">\n      <rtsee-chat-input [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-chat-input>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: MessagesListComponent, selector: "rtsee-messages-list", inputs: ["chat", "messenger"] }, { kind: "component", type: ChatInputComponent, selector: "rtsee-chat-input", inputs: ["messenger", "chat"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-chat', template: "<div class=\"rtsee-chat\">\n  <div class=\"rtsee-chat-body-container\">\n    <rtsee-messages-list [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-messages-list>\n  </div>\n  <div class=\"rtsee-chat-footer-container\">\n    <div class=\"rtsee-chat-footer-container-inner\">\n      <rtsee-chat-input [messenger]=\"messenger\" [chat]=\"chat\"></rtsee-chat-input>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { chat: [{
@@ -554,28 +554,28 @@ class ShaveDirective {
         const height = this.elem.nativeElement?.offsetHeight;
         shave(this.elem.nativeElement, height);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ShaveDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.3", type: ShaveDirective, selector: "[rtseeShave]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShaveDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: ShaveDirective, selector: "[rtseeShave]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ShaveDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ShaveDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[rtseeShave]',
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
+        }], ctorParameters: () => [{ type: i0.ElementRef }] });
 
 class ChatThumbnailComponent {
     constructor(timeFormatService) {
         this.timeFormatService = timeFormatService;
         this.RTSeeChatTypes = RTSeeChatTypes;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatThumbnailComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ChatThumbnailComponent, selector: "rtsee-chat-thumbnail", inputs: { chat: "chat", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-chat-thumbnail\" (click)=\"messenger.openChatById(chat.chatId)\">\n  <div class=\"rtsee-chat-thumbnail-image\">\n    <img [src]=\"chat.chatImageUrl\" alt=\"chat-img\">\n  </div>\n  <div class=\"rtsee-chat-thumbnail-left\">\n    <div class=\"rtsee-chat-thumbnail-name\">\n      <span>{{ chat.chatName }}</span>\n      <div class=\"rtsee-chat-thumbnail-status\">\n        <rtsee-message-time-and-status [message]=\"chat\"\n                                       [hideStatus]=\"chat && !!(chat.unreadMessagesCount)\">\n        </rtsee-message-time-and-status>\n      </div>\n    </div>\n    <div class=\"rtsee-chat-thumbnail-last-message\"\n         [ngClass]=\"{'rtsee-has-unread': chat.unreadMessagesCount}\"\n         rtseeShave>\n      <span class=\"rtsee-chat-thumbnail-last-message-sender\"\n            *ngIf=\"chat.chatType !== RTSeeChatTypes.INDIVIDUAL && chat.senderName\"\n      >{{chat.senderName}}</span>\n      <span class=\"rtsee-chat-thumbnail-last-message-text\"\n            *ngIf=\"chat.text\"\n      >{{chat.text}}</span>\n      <div class=\"rtsee-messenger-thumbnail-unread\" *ngIf=\"chat.unreadMessagesCount\">\n        <span class=\"rtsee-messenger-thumbnail-unread-count\">{{chat.unreadMessagesCount}}</span>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MessageTimeAndStatusComponent, selector: "rtsee-message-time-and-status", inputs: ["message", "hideStatus", "inChat"] }, { kind: "directive", type: ShaveDirective, selector: "[rtseeShave]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatThumbnailComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChatThumbnailComponent, selector: "rtsee-chat-thumbnail", inputs: { chat: "chat", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-chat-thumbnail\" (click)=\"messenger.openChatById(chat.chatId)\">\n  <div class=\"rtsee-chat-thumbnail-image\">\n    <img [src]=\"chat.chatImageUrl\" alt=\"chat-img\">\n  </div>\n  <div class=\"rtsee-chat-thumbnail-left\">\n    <div class=\"rtsee-chat-thumbnail-name\">\n      <span>{{ chat.chatName }}</span>\n      <div class=\"rtsee-chat-thumbnail-status\">\n        <rtsee-message-time-and-status [message]=\"chat\"\n                                       [hideStatus]=\"chat && !!(chat.unreadMessagesCount)\">\n        </rtsee-message-time-and-status>\n      </div>\n    </div>\n    <div class=\"rtsee-chat-thumbnail-last-message\"\n         [ngClass]=\"{'rtsee-has-unread': chat.unreadMessagesCount}\"\n         rtseeShave>\n      <span class=\"rtsee-chat-thumbnail-last-message-sender\"\n            *ngIf=\"chat.chatType !== RTSeeChatTypes.INDIVIDUAL && chat.senderName\"\n      >{{chat.senderName}}</span>\n      <span class=\"rtsee-chat-thumbnail-last-message-text\"\n            *ngIf=\"chat.text\"\n      >{{chat.text}}</span>\n      <div class=\"rtsee-messenger-thumbnail-unread\" *ngIf=\"chat.unreadMessagesCount\">\n        <span class=\"rtsee-messenger-thumbnail-unread-count\">{{chat.unreadMessagesCount}}</span>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MessageTimeAndStatusComponent, selector: "rtsee-message-time-and-status", inputs: ["message", "hideStatus", "inChat"] }, { kind: "directive", type: ShaveDirective, selector: "[rtseeShave]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatThumbnailComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatThumbnailComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-chat-thumbnail', template: "<div class=\"rtsee-chat-thumbnail\" (click)=\"messenger.openChatById(chat.chatId)\">\n  <div class=\"rtsee-chat-thumbnail-image\">\n    <img [src]=\"chat.chatImageUrl\" alt=\"chat-img\">\n  </div>\n  <div class=\"rtsee-chat-thumbnail-left\">\n    <div class=\"rtsee-chat-thumbnail-name\">\n      <span>{{ chat.chatName }}</span>\n      <div class=\"rtsee-chat-thumbnail-status\">\n        <rtsee-message-time-and-status [message]=\"chat\"\n                                       [hideStatus]=\"chat && !!(chat.unreadMessagesCount)\">\n        </rtsee-message-time-and-status>\n      </div>\n    </div>\n    <div class=\"rtsee-chat-thumbnail-last-message\"\n         [ngClass]=\"{'rtsee-has-unread': chat.unreadMessagesCount}\"\n         rtseeShave>\n      <span class=\"rtsee-chat-thumbnail-last-message-sender\"\n            *ngIf=\"chat.chatType !== RTSeeChatTypes.INDIVIDUAL && chat.senderName\"\n      >{{chat.senderName}}</span>\n      <span class=\"rtsee-chat-thumbnail-last-message-text\"\n            *ngIf=\"chat.text\"\n      >{{chat.text}}</span>\n      <div class=\"rtsee-messenger-thumbnail-unread\" *ngIf=\"chat.unreadMessagesCount\">\n        <span class=\"rtsee-messenger-thumbnail-unread-count\">{{chat.unreadMessagesCount}}</span>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: TimeFormatHelperService }]; }, propDecorators: { chat: [{
+        }], ctorParameters: () => [{ type: TimeFormatHelperService }], propDecorators: { chat: [{
                 type: Input
             }], messenger: [{
                 type: Input
@@ -585,10 +585,10 @@ class ChatsListComponent {
     ngOnInit() {
         // console.log(this.chats);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: { messenger: "messenger", chats: "chats" }, ngImport: i0, template: "<div class=\"rtsee-chats-list\">\n  <div class=\"rtsee-chat-thumbnail-container\" *ngFor=\"let chat of chats; let last = last;\">\n    <rtsee-chat-thumbnail [chat]=\"chat.thumbnail\" [messenger]=\"messenger\"></rtsee-chat-thumbnail>\n<!--    <div class=\"rtsee-chat-thumbnail-separator\" *ngIf=\"!last\"></div>-->\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ChatThumbnailComponent, selector: "rtsee-chat-thumbnail", inputs: ["chat", "messenger"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: { messenger: "messenger", chats: "chats" }, ngImport: i0, template: "<div class=\"rtsee-chats-list\">\n  <div class=\"rtsee-chat-thumbnail-container\" *ngFor=\"let chat of chats; let last = last;\">\n    <rtsee-chat-thumbnail [chat]=\"chat.thumbnail\" [messenger]=\"messenger\"></rtsee-chat-thumbnail>\n<!--    <div class=\"rtsee-chat-thumbnail-separator\" *ngIf=\"!last\"></div>-->\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ChatThumbnailComponent, selector: "rtsee-chat-thumbnail", inputs: ["chat", "messenger"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ChatsListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChatsListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-chats-list', template: "<div class=\"rtsee-chats-list\">\n  <div class=\"rtsee-chat-thumbnail-container\" *ngFor=\"let chat of chats; let last = last;\">\n    <rtsee-chat-thumbnail [chat]=\"chat.thumbnail\" [messenger]=\"messenger\"></rtsee-chat-thumbnail>\n<!--    <div class=\"rtsee-chat-thumbnail-separator\" *ngIf=\"!last\"></div>-->\n  </div>\n</div>\n" }]
         }], propDecorators: { messenger: [{
@@ -601,10 +601,10 @@ class DefaultImagesService {
     constructor() {
         this.PROFILE = 'https://werf-assets.s3.amazonaws.com/default-profile-logo.png';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: DefaultImagesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: DefaultImagesService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultImagesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultImagesService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: DefaultImagesService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DefaultImagesService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -624,10 +624,10 @@ class ProfileComponent {
         }
         void this.messenger.initializeVideoCall(this.messenger.openedChat);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ProfileComponent, selector: "rtsee-profile", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger-profile\">\n  <ul class=\"rtsee-messenger-profile-controls\">\n    <li class=\"rtsee-messenger-profile-control\">\n      <div class=\"rtsee-messenger-control-item\" (click)=\"call()\">\n        <div class=\"rtsee-messenger-control-icon\">\n          <span class=\"material-icons-outlined\">call</span>\n        </div>\n        <span>Call</span>\n      </div>\n    </li>\n    <li class=\"rtsee-messenger-profile-control\">\n      <div class=\"rtsee-messenger-control-item\" (click)=\"videoCall()\">\n        <div class=\"rtsee-messenger-control-icon\">\n          <span class=\"material-icons-outlined\">videocam</span>\n        </div>\n        <span>Video</span>\n      </div>\n    </li>\n  </ul>\n</div>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ProfileComponent, selector: "rtsee-profile", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger-profile\">\n  <ul class=\"rtsee-messenger-profile-controls\">\n    <li class=\"rtsee-messenger-profile-control\">\n      <div class=\"rtsee-messenger-control-item\" (click)=\"call()\">\n        <div class=\"rtsee-messenger-control-icon\">\n          <span class=\"material-icons-outlined\">call</span>\n        </div>\n        <span>Call</span>\n      </div>\n    </li>\n    <li class=\"rtsee-messenger-profile-control\">\n      <div class=\"rtsee-messenger-control-item\" (click)=\"videoCall()\">\n        <div class=\"rtsee-messenger-control-icon\">\n          <span class=\"material-icons-outlined\">videocam</span>\n        </div>\n        <span>Video</span>\n      </div>\n    </li>\n  </ul>\n</div>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ProfileComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProfileComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-profile', template: "<div class=\"rtsee-messenger-profile\">\n  <ul class=\"rtsee-messenger-profile-controls\">\n    <li class=\"rtsee-messenger-profile-control\">\n      <div class=\"rtsee-messenger-control-item\" (click)=\"call()\">\n        <div class=\"rtsee-messenger-control-icon\">\n          <span class=\"material-icons-outlined\">call</span>\n        </div>\n        <span>Call</span>\n      </div>\n    </li>\n    <li class=\"rtsee-messenger-profile-control\">\n      <div class=\"rtsee-messenger-control-item\" (click)=\"videoCall()\">\n        <div class=\"rtsee-messenger-control-icon\">\n          <span class=\"material-icons-outlined\">videocam</span>\n        </div>\n        <span>Video</span>\n      </div>\n    </li>\n  </ul>\n</div>\n" }]
         }], propDecorators: { messenger: [{
@@ -645,13 +645,13 @@ class MessengerHeaderComponent {
         this.isExpanded = !this.isExpanded;
         this.expandToggled.emit(this.isExpanded);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessengerHeaderComponent, deps: [{ token: DefaultImagesService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: { isExpanded: "isExpanded", messenger: "messenger" }, outputs: { expandToggled: "expandToggled" }, ngImport: i0, template: "<div class=\"rtsee-messenger-header\"\n     [ngClass]=\"{\n     'rtsee-messenger-header-chat-opened': messenger.openedChat,\n     'rtsee-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n     'rtsee-messenger-header-expanded': isExpanded\n      }\"\n>\n  <div class=\"rtsee-messenger-profile-image-container \">\n    <div *ngIf=\"!messenger.openedChat\"\n         [style.background-image]=\"'url(' + messenger.myPeer?.imageUrl || defaultImagesService.PROFILE + ')'\"\n         class=\"rtsee-messenger-profile-image\">\n    </div>\n  </div>\n\n  <button class=\"rtsee-messenger-close-chat\"\n          *ngIf=\"messenger.openedChat\"\n          (click)=\"messenger.closeChat()\"\n  >\n    <span class=\"material-icons-outlined\">arrow_back</span>\n    <span class=\"unread-count\" *ngIf=\"messenger.unreadMessagesCount\">{{messenger.unreadMessagesCount}}</span>\n  </button>\n\n  <button class=\"rtsee-messenger-menu-toggle\"\n          *ngIf=\"!messenger.openedChat && false\"\n          (click)=\"messenger.openMainMenu(true)\"\n  >\n    <span class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">menu</span>\n  </button>\n  <button class=\"rtsee-messenger-fold-toggle\"\n          (click)=\"messenger.changeChatFoldState(!messenger.folded)\"\n  >\n    <span *ngIf=\"!messenger.folded\" class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">expand_more</span>\n    <span *ngIf=\"messenger.folded\" class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">expand_less</span>\n  </button>\n\n  <div *ngIf=\"messenger.openedChat\"\n       [ngClass]=\"{'rtsee-messenger-header-opened-chat-info-expanded': isExpanded}\"\n       class=\"rtsee-messenger-header-opened-chat-info\">\n    <div class=\"rtsee-messenger-profile-header-placeholder\">\n      <p *ngIf=\"messenger.openedChat\"\n         class=\"rtsee-messenger-header-chat-title\"\n      >{{ messenger.openedChat.name }}</p>\n      <div class=\"rtsee-messenger-profile-image-container\" (click)=\"toggleExpand()\">\n        <div class=\"rtsee-messenger-profile-image\"\n             [style.background-image]=\"'url(' + messenger.openedChat.imageUrl || defaultImagesService.PROFILE + ')'\"\n        ></div>\n      </div>\n    </div>\n    <div class=\"rtsee-messenger-profile-data-container\">\n      <rtsee-profile *ngIf=\"isExpanded\" [messenger]=\"messenger\"></rtsee-profile>\n    </div>\n  </div>\n\n  <p *ngIf=\"!messenger.openedChat\"\n     class=\"rtsee-messenger-header-title\"\n  >Messaging</p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessengerHeaderComponent, deps: [{ token: DefaultImagesService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: { isExpanded: "isExpanded", messenger: "messenger" }, outputs: { expandToggled: "expandToggled" }, ngImport: i0, template: "<div class=\"rtsee-messenger-header\"\n     [ngClass]=\"{\n     'rtsee-messenger-header-chat-opened': messenger.openedChat,\n     'rtsee-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n     'rtsee-messenger-header-expanded': isExpanded\n      }\"\n>\n  <div class=\"rtsee-messenger-profile-image-container \">\n    <div *ngIf=\"!messenger.openedChat\"\n         [style.background-image]=\"'url(' + messenger.myPeer?.imageUrl || defaultImagesService.PROFILE + ')'\"\n         class=\"rtsee-messenger-profile-image\">\n    </div>\n  </div>\n\n  <button class=\"rtsee-messenger-close-chat\"\n          *ngIf=\"messenger.openedChat\"\n          (click)=\"messenger.closeChat()\"\n  >\n    <span class=\"material-icons-outlined\">arrow_back</span>\n    <span class=\"unread-count\" *ngIf=\"messenger.unreadMessagesCount\">{{messenger.unreadMessagesCount}}</span>\n  </button>\n\n  <button class=\"rtsee-messenger-menu-toggle\"\n          *ngIf=\"!messenger.openedChat && false\"\n          (click)=\"messenger.openMainMenu(true)\"\n  >\n    <span class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">menu</span>\n  </button>\n  <button class=\"rtsee-messenger-fold-toggle\"\n          (click)=\"messenger.changeChatFoldState(!messenger.folded)\"\n  >\n    <span *ngIf=\"!messenger.folded\" class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">expand_more</span>\n    <span *ngIf=\"messenger.folded\" class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">expand_less</span>\n  </button>\n\n  <div *ngIf=\"messenger.openedChat\"\n       [ngClass]=\"{'rtsee-messenger-header-opened-chat-info-expanded': isExpanded}\"\n       class=\"rtsee-messenger-header-opened-chat-info\">\n    <div class=\"rtsee-messenger-profile-header-placeholder\">\n      <p *ngIf=\"messenger.openedChat\"\n         class=\"rtsee-messenger-header-chat-title\"\n      >{{ messenger.openedChat.name }}</p>\n      <div class=\"rtsee-messenger-profile-image-container\" (click)=\"toggleExpand()\">\n        <div class=\"rtsee-messenger-profile-image\"\n             [style.background-image]=\"'url(' + messenger.openedChat.imageUrl || defaultImagesService.PROFILE + ')'\"\n        ></div>\n      </div>\n    </div>\n    <div class=\"rtsee-messenger-profile-data-container\">\n      <rtsee-profile *ngIf=\"isExpanded\" [messenger]=\"messenger\"></rtsee-profile>\n    </div>\n  </div>\n\n  <p *ngIf=\"!messenger.openedChat\"\n     class=\"rtsee-messenger-header-title\"\n  >Messaging</p>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ProfileComponent, selector: "rtsee-profile", inputs: ["messenger"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessengerHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessengerHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-messenger-header', template: "<div class=\"rtsee-messenger-header\"\n     [ngClass]=\"{\n     'rtsee-messenger-header-chat-opened': messenger.openedChat,\n     'rtsee-chat-header-unread': messenger.openedChat && !messenger.unreadMessagesCount,\n     'rtsee-messenger-header-expanded': isExpanded\n      }\"\n>\n  <div class=\"rtsee-messenger-profile-image-container \">\n    <div *ngIf=\"!messenger.openedChat\"\n         [style.background-image]=\"'url(' + messenger.myPeer?.imageUrl || defaultImagesService.PROFILE + ')'\"\n         class=\"rtsee-messenger-profile-image\">\n    </div>\n  </div>\n\n  <button class=\"rtsee-messenger-close-chat\"\n          *ngIf=\"messenger.openedChat\"\n          (click)=\"messenger.closeChat()\"\n  >\n    <span class=\"material-icons-outlined\">arrow_back</span>\n    <span class=\"unread-count\" *ngIf=\"messenger.unreadMessagesCount\">{{messenger.unreadMessagesCount}}</span>\n  </button>\n\n  <button class=\"rtsee-messenger-menu-toggle\"\n          *ngIf=\"!messenger.openedChat && false\"\n          (click)=\"messenger.openMainMenu(true)\"\n  >\n    <span class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">menu</span>\n  </button>\n  <button class=\"rtsee-messenger-fold-toggle\"\n          (click)=\"messenger.changeChatFoldState(!messenger.folded)\"\n  >\n    <span *ngIf=\"!messenger.folded\" class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">expand_more</span>\n    <span *ngIf=\"messenger.folded\" class=\"material-icons-outlined rtsee-messenger-menu-toggle-icon\">expand_less</span>\n  </button>\n\n  <div *ngIf=\"messenger.openedChat\"\n       [ngClass]=\"{'rtsee-messenger-header-opened-chat-info-expanded': isExpanded}\"\n       class=\"rtsee-messenger-header-opened-chat-info\">\n    <div class=\"rtsee-messenger-profile-header-placeholder\">\n      <p *ngIf=\"messenger.openedChat\"\n         class=\"rtsee-messenger-header-chat-title\"\n      >{{ messenger.openedChat.name }}</p>\n      <div class=\"rtsee-messenger-profile-image-container\" (click)=\"toggleExpand()\">\n        <div class=\"rtsee-messenger-profile-image\"\n             [style.background-image]=\"'url(' + messenger.openedChat.imageUrl || defaultImagesService.PROFILE + ')'\"\n        ></div>\n      </div>\n    </div>\n    <div class=\"rtsee-messenger-profile-data-container\">\n      <rtsee-profile *ngIf=\"isExpanded\" [messenger]=\"messenger\"></rtsee-profile>\n    </div>\n  </div>\n\n  <p *ngIf=\"!messenger.openedChat\"\n     class=\"rtsee-messenger-header-title\"\n  >Messaging</p>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: DefaultImagesService }]; }, propDecorators: { expandToggled: [{
+        }], ctorParameters: () => [{ type: DefaultImagesService }], propDecorators: { expandToggled: [{
                 type: Output
             }], isExpanded: [{
                 type: Input
@@ -681,10 +681,10 @@ class SearchComponent {
             this.queryCtrlSub.unsubscribe();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SearchComponent, selector: "rtsee-search", inputs: { search: "search" }, ngImport: i0, template: "<div class=\"rtsee-messenger-search\">\n  <input type=\"text\"\n         [formControl]=\"queryControl\"\n         class=\"rtsee-messenger-search-input\"\n         placeholder=\"Search\"/>\n</div>\n\n<div class=\"rtsee-messenger-search-results\">\n  <rtsee-preloader [diameter]=\"50\" *ngIf=\"search.searchInProgress\"></rtsee-preloader>\n  <p>Chats</p>\n  <div class=\"rtsee-messenger-search-results-chats\">\n    <div *ngFor=\"let chat of search.results.chats\" class=\"rtsee-messenger-search-results-chat-wrapper\">\n      <p>{{chat.name}}</p>\n    </div>\n  </div>\n  <p>Messages</p>\n  <div class=\"rtsee-messenger-search-results-messages\">\n    <div *ngFor=\"let message of search.results.messages\" class=\"rtsee-messenger-search-results-message-wrapper\">\n      <p>{{message.chatName || message.senderName }}</p>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SearchComponent, selector: "rtsee-search", inputs: { search: "search" }, ngImport: i0, template: "<div class=\"rtsee-messenger-search\">\n  <input type=\"text\"\n         [formControl]=\"queryControl\"\n         class=\"rtsee-messenger-search-input\"\n         placeholder=\"Search\"/>\n</div>\n\n<div class=\"rtsee-messenger-search-results\">\n  <rtsee-preloader [diameter]=\"50\" *ngIf=\"search.searchInProgress\"></rtsee-preloader>\n  <p>Chats</p>\n  <div class=\"rtsee-messenger-search-results-chats\">\n    <div *ngFor=\"let chat of search.results.chats\" class=\"rtsee-messenger-search-results-chat-wrapper\">\n      <p>{{chat.name}}</p>\n    </div>\n  </div>\n  <p>Messages</p>\n  <div class=\"rtsee-messenger-search-results-messages\">\n    <div *ngFor=\"let message of search.results.messages\" class=\"rtsee-messenger-search-results-message-wrapper\">\n      <p>{{message.chatName || message.senderName }}</p>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SearchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-search', template: "<div class=\"rtsee-messenger-search\">\n  <input type=\"text\"\n         [formControl]=\"queryControl\"\n         class=\"rtsee-messenger-search-input\"\n         placeholder=\"Search\"/>\n</div>\n\n<div class=\"rtsee-messenger-search-results\">\n  <rtsee-preloader [diameter]=\"50\" *ngIf=\"search.searchInProgress\"></rtsee-preloader>\n  <p>Chats</p>\n  <div class=\"rtsee-messenger-search-results-chats\">\n    <div *ngFor=\"let chat of search.results.chats\" class=\"rtsee-messenger-search-results-chat-wrapper\">\n      <p>{{chat.name}}</p>\n    </div>\n  </div>\n  <p>Messages</p>\n  <div class=\"rtsee-messenger-search-results-messages\">\n    <div *ngFor=\"let message of search.results.messages\" class=\"rtsee-messenger-search-results-message-wrapper\">\n      <p>{{message.chatName || message.senderName }}</p>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { search: [{
@@ -695,10 +695,10 @@ class ManageChatComponent {
     onInviteContactsClicked() {
         this.menuState.activePanel = MainMenuPanels.CONTACTS_SELECT;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ManageChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ManageChatComponent, selector: "rtsee-manage-chat", inputs: { messenger: "messenger", menuState: "menuState" }, ngImport: i0, template: "<div class=\"rtsee-messenger-manage-chat\">\n  <p>We are going to manage chat here</p>\n  <button (click)=\"onInviteContactsClicked()\">Invite Contacts</button>\n</div>\n", styles: [""] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ManageChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ManageChatComponent, selector: "rtsee-manage-chat", inputs: { messenger: "messenger", menuState: "menuState" }, ngImport: i0, template: "<div class=\"rtsee-messenger-manage-chat\">\n  <p>We are going to manage chat here</p>\n  <button (click)=\"onInviteContactsClicked()\">Invite Contacts</button>\n</div>\n", styles: [""] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ManageChatComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ManageChatComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-manage-chat', template: "<div class=\"rtsee-messenger-manage-chat\">\n  <p>We are going to manage chat here</p>\n  <button (click)=\"onInviteContactsClicked()\">Invite Contacts</button>\n</div>\n" }]
         }], propDecorators: { messenger: [{
@@ -708,10 +708,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
             }] } });
 
 class ContactsMultiselectComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ContactsMultiselectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ContactsMultiselectComponent, selector: "rtsee-contacts-multiselect", inputs: { menuState: "menuState", search: "search" }, ngImport: i0, template: "<div class=\"rtsee-messenger-contacts-multiselect\">\n  <rtsee-search [search]=\"search\"></rtsee-search>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: SearchComponent, selector: "rtsee-search", inputs: ["search"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ContactsMultiselectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ContactsMultiselectComponent, selector: "rtsee-contacts-multiselect", inputs: { menuState: "menuState", search: "search" }, ngImport: i0, template: "<div class=\"rtsee-messenger-contacts-multiselect\">\n  <rtsee-search [search]=\"search\"></rtsee-search>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: SearchComponent, selector: "rtsee-search", inputs: ["search"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ContactsMultiselectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ContactsMultiselectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-contacts-multiselect', template: "<div class=\"rtsee-messenger-contacts-multiselect\">\n  <rtsee-search [search]=\"search\"></rtsee-search>\n</div>\n" }]
         }], propDecorators: { menuState: [{
@@ -733,10 +733,10 @@ class MainMenuComponent {
     onNewChannelClicked() {
         this.state.activePanel = MainMenuPanels.MANAGE_CHAT;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MainMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: MainMenuComponent, selector: "rtsee-main-menu", inputs: { search: "search", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger-main-menu\">\n  <div class=\"rtsee-messenger-main-menu-home\" *ngIf=\"state.activePanel === MainMenuPanels.HOME\">\n    <ul class=\"rtsee-messenger-controls\">\n      <li>\n        <div class=\"rtsee-messenger-control-item\" (click)=\"onNewGroupClicked()\">\n          <div class=\"rtsee-messenger-control-icon\">\n            <span class=\"material-icons-outlined\">people</span>\n          </div>\n          <span>New Group</span>\n        </div>\n      </li>\n      <li>\n        <div class=\"rtsee-messenger-control-item\" (click)=\"onNewChannelClicked()\">\n          <div class=\"rtsee-messenger-control-icon\">\n            <span class=\"material-icons-outlined\">campaign</span>\n          </div>\n          <span>New Channel</span>\n        </div>\n      </li>\n    </ul>\n    <rtsee-search [search]=\"search\" ></rtsee-search>\n  </div>\n\n  <rtsee-manage-chat *ngIf=\"state.activePanel === MainMenuPanels.MANAGE_CHAT\"\n                     [messenger]=\"messenger\"\n                     [menuState]=\"state\"\n  ></rtsee-manage-chat>\n  <rtsee-contacts-multiselect [search]=\"search\"\n                              [menuState]=\"state\"\n                              *ngIf=\"state.activePanel === MainMenuPanels.CONTACTS_SELECT\"\n  ></rtsee-contacts-multiselect>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchComponent, selector: "rtsee-search", inputs: ["search"] }, { kind: "component", type: ManageChatComponent, selector: "rtsee-manage-chat", inputs: ["messenger", "menuState"] }, { kind: "component", type: ContactsMultiselectComponent, selector: "rtsee-contacts-multiselect", inputs: ["menuState", "search"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MainMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MainMenuComponent, selector: "rtsee-main-menu", inputs: { search: "search", messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger-main-menu\">\n  <div class=\"rtsee-messenger-main-menu-home\" *ngIf=\"state.activePanel === MainMenuPanels.HOME\">\n    <ul class=\"rtsee-messenger-controls\">\n      <li>\n        <div class=\"rtsee-messenger-control-item\" (click)=\"onNewGroupClicked()\">\n          <div class=\"rtsee-messenger-control-icon\">\n            <span class=\"material-icons-outlined\">people</span>\n          </div>\n          <span>New Group</span>\n        </div>\n      </li>\n      <li>\n        <div class=\"rtsee-messenger-control-item\" (click)=\"onNewChannelClicked()\">\n          <div class=\"rtsee-messenger-control-icon\">\n            <span class=\"material-icons-outlined\">campaign</span>\n          </div>\n          <span>New Channel</span>\n        </div>\n      </li>\n    </ul>\n    <rtsee-search [search]=\"search\" ></rtsee-search>\n  </div>\n\n  <rtsee-manage-chat *ngIf=\"state.activePanel === MainMenuPanels.MANAGE_CHAT\"\n                     [messenger]=\"messenger\"\n                     [menuState]=\"state\"\n  ></rtsee-manage-chat>\n  <rtsee-contacts-multiselect [search]=\"search\"\n                              [menuState]=\"state\"\n                              *ngIf=\"state.activePanel === MainMenuPanels.CONTACTS_SELECT\"\n  ></rtsee-contacts-multiselect>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchComponent, selector: "rtsee-search", inputs: ["search"] }, { kind: "component", type: ManageChatComponent, selector: "rtsee-manage-chat", inputs: ["messenger", "menuState"] }, { kind: "component", type: ContactsMultiselectComponent, selector: "rtsee-contacts-multiselect", inputs: ["menuState", "search"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MainMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MainMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-main-menu', template: "<div class=\"rtsee-messenger-main-menu\">\n  <div class=\"rtsee-messenger-main-menu-home\" *ngIf=\"state.activePanel === MainMenuPanels.HOME\">\n    <ul class=\"rtsee-messenger-controls\">\n      <li>\n        <div class=\"rtsee-messenger-control-item\" (click)=\"onNewGroupClicked()\">\n          <div class=\"rtsee-messenger-control-icon\">\n            <span class=\"material-icons-outlined\">people</span>\n          </div>\n          <span>New Group</span>\n        </div>\n      </li>\n      <li>\n        <div class=\"rtsee-messenger-control-item\" (click)=\"onNewChannelClicked()\">\n          <div class=\"rtsee-messenger-control-icon\">\n            <span class=\"material-icons-outlined\">campaign</span>\n          </div>\n          <span>New Channel</span>\n        </div>\n      </li>\n    </ul>\n    <rtsee-search [search]=\"search\" ></rtsee-search>\n  </div>\n\n  <rtsee-manage-chat *ngIf=\"state.activePanel === MainMenuPanels.MANAGE_CHAT\"\n                     [messenger]=\"messenger\"\n                     [menuState]=\"state\"\n  ></rtsee-manage-chat>\n  <rtsee-contacts-multiselect [search]=\"search\"\n                              [menuState]=\"state\"\n                              *ngIf=\"state.activePanel === MainMenuPanels.CONTACTS_SELECT\"\n  ></rtsee-contacts-multiselect>\n</div>\n" }]
         }], propDecorators: { search: [{
@@ -758,13 +758,13 @@ class MessengerComponent {
     onHeaderExpandToggled(value) {
         this.isHeaderExpanded = value;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessengerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: MessengerComponent, selector: "rtsee-messenger", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n  'rtsee-messenger-main-menu-opened': messenger.mainMenuOpened,\n  'rtsee-messenger-header-expanded': isHeaderExpanded,\n  'rtsee-messenger-folded': messenger.folded\n}\">\n  <div class=\"rtsee-messenger-header-container\">\n    <rtsee-messenger-header [messenger]=\"messenger\" (expandToggled)=\"onHeaderExpandToggled($event)\"></rtsee-messenger-header>\n  </div>\n  <div class=\"rtsee-messenger-body-container\"\n       infiniteScroll\n       [infiniteScrollDistance]=\"2\"\n       [infiniteScrollThrottle]=\"50\"\n       [scrollWindow]=\"false\"\n       (scrolled)=\"onScroll()\"\n  >\n    <rtsee-chats-list *ngIf=\"!messenger.openedChat\" [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n    <rtsee-chat *ngIf=\"messenger.openedChat\" [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n    <rtsee-preloader [diameter]=\"50\" *ngIf=\"messenger.loadingChatsInProgress\" ></rtsee-preloader>\n  </div>\n  <div class=\"rtsee-messenger-main-menu-container\">\n    <rtsee-main-menu\n      *ngIf=\"messenger.mainMenuOpened\"\n      [search]=\"messenger.search\"\n      [messenger]=\"messenger\"></rtsee-main-menu>\n  </div>\n  <div class=\"rtsee-messenger-overlay\" (click)=\"messenger.openMainMenu(false)\"></div>\n</div>\n\n\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "messenger"] }, { kind: "component", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: ["messenger", "chats"] }, { kind: "component", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: ["isExpanded", "messenger"], outputs: ["expandToggled"] }, { kind: "component", type: MainMenuComponent, selector: "rtsee-main-menu", inputs: ["search", "messenger"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessengerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: MessengerComponent, selector: "rtsee-messenger", inputs: { messenger: "messenger" }, ngImport: i0, template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n  'rtsee-messenger-main-menu-opened': messenger.mainMenuOpened,\n  'rtsee-messenger-header-expanded': isHeaderExpanded,\n  'rtsee-messenger-folded': messenger.folded\n}\">\n  <div class=\"rtsee-messenger-header-container\">\n    <rtsee-messenger-header [messenger]=\"messenger\" (expandToggled)=\"onHeaderExpandToggled($event)\"></rtsee-messenger-header>\n  </div>\n  <div class=\"rtsee-messenger-body-container\"\n       infiniteScroll\n       [infiniteScrollDistance]=\"2\"\n       [infiniteScrollThrottle]=\"50\"\n       [scrollWindow]=\"false\"\n       (scrolled)=\"onScroll()\"\n  >\n    <rtsee-chats-list *ngIf=\"!messenger.openedChat\" [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n    <rtsee-chat *ngIf=\"messenger.openedChat\" [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n    <rtsee-preloader [diameter]=\"50\" *ngIf=\"messenger.loadingChatsInProgress\" ></rtsee-preloader>\n  </div>\n  <div class=\"rtsee-messenger-main-menu-container\">\n    <rtsee-main-menu\n      *ngIf=\"messenger.mainMenuOpened\"\n      [search]=\"messenger.search\"\n      [messenger]=\"messenger\"></rtsee-main-menu>\n  </div>\n  <div class=\"rtsee-messenger-overlay\" (click)=\"messenger.openMainMenu(false)\"></div>\n</div>\n\n\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "component", type: ChatComponent, selector: "rtsee-chat", inputs: ["chat", "messenger"] }, { kind: "component", type: ChatsListComponent, selector: "rtsee-chats-list", inputs: ["messenger", "chats"] }, { kind: "component", type: MessengerHeaderComponent, selector: "rtsee-messenger-header", inputs: ["isExpanded", "messenger"], outputs: ["expandToggled"] }, { kind: "component", type: MainMenuComponent, selector: "rtsee-main-menu", inputs: ["search", "messenger"] }, { kind: "component", type: PreloaderComponent, selector: "rtsee-preloader", inputs: ["diameter", "color"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: MessengerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MessengerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-messenger', template: "<div class=\"rtsee-messenger\" [ngClass]=\"{\n  'rtsee-messenger-main-menu-opened': messenger.mainMenuOpened,\n  'rtsee-messenger-header-expanded': isHeaderExpanded,\n  'rtsee-messenger-folded': messenger.folded\n}\">\n  <div class=\"rtsee-messenger-header-container\">\n    <rtsee-messenger-header [messenger]=\"messenger\" (expandToggled)=\"onHeaderExpandToggled($event)\"></rtsee-messenger-header>\n  </div>\n  <div class=\"rtsee-messenger-body-container\"\n       infiniteScroll\n       [infiniteScrollDistance]=\"2\"\n       [infiniteScrollThrottle]=\"50\"\n       [scrollWindow]=\"false\"\n       (scrolled)=\"onScroll()\"\n  >\n    <rtsee-chats-list *ngIf=\"!messenger.openedChat\" [chats]=\"messenger.chats\" [messenger]=\"messenger\"></rtsee-chats-list>\n    <rtsee-chat *ngIf=\"messenger.openedChat\" [messenger]=\"messenger\" [chat]=\"messenger.openedChat\"></rtsee-chat>\n    <rtsee-preloader [diameter]=\"50\" *ngIf=\"messenger.loadingChatsInProgress\" ></rtsee-preloader>\n  </div>\n  <div class=\"rtsee-messenger-main-menu-container\">\n    <rtsee-main-menu\n      *ngIf=\"messenger.mainMenuOpened\"\n      [search]=\"messenger.search\"\n      [messenger]=\"messenger\"></rtsee-main-menu>\n  </div>\n  <div class=\"rtsee-messenger-overlay\" (click)=\"messenger.openMainMenu(false)\"></div>\n</div>\n\n\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { messenger: [{
+        }], ctorParameters: () => [], propDecorators: { messenger: [{
                 type: Input
             }] } });
 
@@ -781,10 +781,10 @@ class EventsWidgetsService {
         return mapping.component;
         /* eslint-enable */
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: EventsWidgetsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: EventsWidgetsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EventsWidgetsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EventsWidgetsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: EventsWidgetsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EventsWidgetsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
@@ -843,13 +843,13 @@ class EventThumbnailComponent {
         }
         /* eslint-enable */
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: EventThumbnailComponent, deps: [{ token: EventsWidgetsService }, { token: i0.ComponentFactoryResolver }, { token: TimeFormatHelperService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: EventThumbnailComponent, selector: "rtsee-event-thumbnail", inputs: { event: "event" }, viewQueries: [{ propertyName: "widgetHost", first: true, predicate: WidgetDirective, descendants: true }], ngImport: i0, template: "<div class=\"rtsee-events-dashboard-event-thumbnail\">\n  <ng-template *ngIf=\"event.widget\" widgetHost></ng-template>\n  <div *ngIf=\"!event.widget\" class=\"rtsee-events-dashboard-default-event-thumbnail\"\n       [ngClass]=\"{'rtsee-events-dashboard-default-event-thumbnail-with-data': event.data}\"\n  >\n    <div class=\"rtsee-events-dashboard-default-event-thumbnail-name\">{{event.name}}</div>\n    <div class=\"rtsee-events-dashboard-default-event-thumbnail-info\">\n      <div *ngIf=\"event.data\" class=\"rtsee-events-dashboard-default-event-thumbnail-details\"\n           [title]=\"tooltip\"\n      >\n      <span class=\"rtsee-events-dashboard-default-event-thumbnail-details-icon material-icons-outlined\"\n      >info</span>\n      </div>\n      <div class=\"rtsee-events-dashboard-default-event-thumbnail-time\">\n        <span>{{ timeFormatService.toAgo(event.createdAt) }}</span>\n      </div>\n    </div>\n\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EventThumbnailComponent, deps: [{ token: EventsWidgetsService }, { token: i0.ComponentFactoryResolver }, { token: TimeFormatHelperService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: EventThumbnailComponent, selector: "rtsee-event-thumbnail", inputs: { event: "event" }, viewQueries: [{ propertyName: "widgetHost", first: true, predicate: WidgetDirective, descendants: true }], ngImport: i0, template: "<div class=\"rtsee-events-dashboard-event-thumbnail\">\n  <ng-template *ngIf=\"event.widget\" widgetHost></ng-template>\n  <div *ngIf=\"!event.widget\" class=\"rtsee-events-dashboard-default-event-thumbnail\"\n       [ngClass]=\"{'rtsee-events-dashboard-default-event-thumbnail-with-data': event.data}\"\n  >\n    <div class=\"rtsee-events-dashboard-default-event-thumbnail-name\">{{event.name}}</div>\n    <div class=\"rtsee-events-dashboard-default-event-thumbnail-info\">\n      <div *ngIf=\"event.data\" class=\"rtsee-events-dashboard-default-event-thumbnail-details\"\n           [title]=\"tooltip\"\n      >\n      <span class=\"rtsee-events-dashboard-default-event-thumbnail-details-icon material-icons-outlined\"\n      >info</span>\n      </div>\n      <div class=\"rtsee-events-dashboard-default-event-thumbnail-time\">\n        <span>{{ timeFormatService.toAgo(event.createdAt) }}</span>\n      </div>\n    </div>\n\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: EventThumbnailComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EventThumbnailComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-event-thumbnail', template: "<div class=\"rtsee-events-dashboard-event-thumbnail\">\n  <ng-template *ngIf=\"event.widget\" widgetHost></ng-template>\n  <div *ngIf=\"!event.widget\" class=\"rtsee-events-dashboard-default-event-thumbnail\"\n       [ngClass]=\"{'rtsee-events-dashboard-default-event-thumbnail-with-data': event.data}\"\n  >\n    <div class=\"rtsee-events-dashboard-default-event-thumbnail-name\">{{event.name}}</div>\n    <div class=\"rtsee-events-dashboard-default-event-thumbnail-info\">\n      <div *ngIf=\"event.data\" class=\"rtsee-events-dashboard-default-event-thumbnail-details\"\n           [title]=\"tooltip\"\n      >\n      <span class=\"rtsee-events-dashboard-default-event-thumbnail-details-icon material-icons-outlined\"\n      >info</span>\n      </div>\n      <div class=\"rtsee-events-dashboard-default-event-thumbnail-time\">\n        <span>{{ timeFormatService.toAgo(event.createdAt) }}</span>\n      </div>\n    </div>\n\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: EventsWidgetsService }, { type: i0.ComponentFactoryResolver }, { type: TimeFormatHelperService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { event: [{
+        }], ctorParameters: () => [{ type: EventsWidgetsService }, { type: i0.ComponentFactoryResolver }, { type: TimeFormatHelperService }, { type: i0.ChangeDetectorRef }], propDecorators: { event: [{
                 type: Input
             }], widgetHost: [{
                 type: ViewChild,
@@ -860,13 +860,13 @@ class RtseeEventsDashboardSessionComponent {
     constructor(timeFormatService) {
         this.timeFormatService = timeFormatService;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardSessionComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeEventsDashboardSessionComponent, selector: "rtsee-rtsee-events-dashboard-session", inputs: { session: "session" }, ngImport: i0, template: "<div class=\"rtsee-events-dashboard-session\">\n  <div class=\"rtsee-events-dashboard-session-header\" *ngIf=\"session.info\">\n    <p class=\"rtsee-events-dashboard-session-client-info\">{{session.info.clientThumbnail}}</p>\n    <p class=\"rtsee-events-dashboard-session-os-info\">{{session.info.osThumbnail}}</p>\n    <div class=\"rtsee-events-dashboard-session-device-info\" [title]=\"session.info.deviceThumbnail\">\n      <span *ngIf=\"session.info.deviceType === 'smartphone' && !session.info.botName\"\n        class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n      >phone_iphone</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.deviceType === 'tablet' && !session.info.botName\"\n      >tablet_mac</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.deviceType === 'desktop' && !session.info.botName\"\n      >computer</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.botName\"\n      >smart_toy</span>\n    </div>\n  </div>\n  <ul *ngIf=\"session.events && session.events.length\"\n      class=\"rtsee-events-dashboard-session-events-list\"\n  >\n    <li *ngFor=\"let event of session.events | slice:0:5;\" class=\"rtsee-events-dashboard-session-event\">\n      <rtsee-event-thumbnail [event]=\"event\"></rtsee-event-thumbnail>\n    </li>\n  </ul>\n  <div class=\"rtsee-events-dashboard-session-footer\">\n    <button *ngIf=\"session.events.length > 5\">{{session.events.length - 5}} more</button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EventThumbnailComponent, selector: "rtsee-event-thumbnail", inputs: ["event"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardSessionComponent, deps: [{ token: TimeFormatHelperService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeEventsDashboardSessionComponent, selector: "rtsee-rtsee-events-dashboard-session", inputs: { session: "session" }, ngImport: i0, template: "<div class=\"rtsee-events-dashboard-session\">\n  <div class=\"rtsee-events-dashboard-session-header\" *ngIf=\"session.info\">\n    <p class=\"rtsee-events-dashboard-session-client-info\">{{session.info.clientThumbnail}}</p>\n    <p class=\"rtsee-events-dashboard-session-os-info\">{{session.info.osThumbnail}}</p>\n    <div class=\"rtsee-events-dashboard-session-device-info\" [title]=\"session.info.deviceThumbnail\">\n      <span *ngIf=\"session.info.deviceType === 'smartphone' && !session.info.botName\"\n        class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n      >phone_iphone</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.deviceType === 'tablet' && !session.info.botName\"\n      >tablet_mac</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.deviceType === 'desktop' && !session.info.botName\"\n      >computer</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.botName\"\n      >smart_toy</span>\n    </div>\n  </div>\n  <ul *ngIf=\"session.events && session.events.length\"\n      class=\"rtsee-events-dashboard-session-events-list\"\n  >\n    <li *ngFor=\"let event of session.events | slice:0:5;\" class=\"rtsee-events-dashboard-session-event\">\n      <rtsee-event-thumbnail [event]=\"event\"></rtsee-event-thumbnail>\n    </li>\n  </ul>\n  <div class=\"rtsee-events-dashboard-session-footer\">\n    <button *ngIf=\"session.events.length > 5\">{{session.events.length - 5}} more</button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EventThumbnailComponent, selector: "rtsee-event-thumbnail", inputs: ["event"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardSessionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardSessionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-rtsee-events-dashboard-session', template: "<div class=\"rtsee-events-dashboard-session\">\n  <div class=\"rtsee-events-dashboard-session-header\" *ngIf=\"session.info\">\n    <p class=\"rtsee-events-dashboard-session-client-info\">{{session.info.clientThumbnail}}</p>\n    <p class=\"rtsee-events-dashboard-session-os-info\">{{session.info.osThumbnail}}</p>\n    <div class=\"rtsee-events-dashboard-session-device-info\" [title]=\"session.info.deviceThumbnail\">\n      <span *ngIf=\"session.info.deviceType === 'smartphone' && !session.info.botName\"\n        class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n      >phone_iphone</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.deviceType === 'tablet' && !session.info.botName\"\n      >tablet_mac</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.deviceType === 'desktop' && !session.info.botName\"\n      >computer</span>\n      <span class=\"material-icons-outlined rtsee-events-dashboard-session-device-info-icon\"\n            *ngIf=\"session.info.botName\"\n      >smart_toy</span>\n    </div>\n  </div>\n  <ul *ngIf=\"session.events && session.events.length\"\n      class=\"rtsee-events-dashboard-session-events-list\"\n  >\n    <li *ngFor=\"let event of session.events | slice:0:5;\" class=\"rtsee-events-dashboard-session-event\">\n      <rtsee-event-thumbnail [event]=\"event\"></rtsee-event-thumbnail>\n    </li>\n  </ul>\n  <div class=\"rtsee-events-dashboard-session-footer\">\n    <button *ngIf=\"session.events.length > 5\">{{session.events.length - 5}} more</button>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: TimeFormatHelperService }]; }, propDecorators: { session: [{
+        }], ctorParameters: () => [{ type: TimeFormatHelperService }], propDecorators: { session: [{
                 type: Input
             }] } });
 
@@ -882,23 +882,23 @@ class RtseeEventsDashboardClientThumbnailComponent {
         console.log('Open Chat Clicked! Client ID #', this.client.id);
         this.dashboard.openChat(this.client);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardClientThumbnailComponent, deps: [{ token: TimeFormatHelperService }, { token: DefaultImagesService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeEventsDashboardClientThumbnailComponent, selector: "ngx-rtsee-events-dashboard-client-thumbnail", inputs: { dashboard: "dashboard", client: "client" }, ngImport: i0, template: "<div class=\"rtsee-dashboard-client-thumbnail\">\n  <div class=\"rtsee-dashboard-client-header\">\n    <div class=\"rtsee-dashboard-client-header-photo\">\n      <div class=\"rtsee-dashboard-client-header-image\"\n           [style.background-image]=\"'url(' + client.imageUrl || defaultImagesService.PROFILE + ')'\"\n      ></div>\n      <div class=\"rtsee-dashboard-client-live-indicator\" *ngIf=\"client.isConnected\"></div>\n    </div>\n    <p class=\"rtsee-dashboard-client-name\">\n      <span class=\"rtsee-dashboard-client-name-text\">{{ client.name || client.id }}</span>\n      <button (click)=\"openChat()\" class=\"rtsee-dashboard-client-engage\">\n        <span class=\"rtsee-dashboard-client-engage-icon material-icons-outlined\">chat_bubble</span>\n      </button>\n    </p>\n  </div>\n  <div class=\"rtsee-dashboard-sessions\">\n    <div *ngFor=\"let session of client.sessions\"\n         class=\"rtsee-dashboard-sessions-container\">\n      <rtsee-rtsee-events-dashboard-session [session]=\"session\"></rtsee-rtsee-events-dashboard-session>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: RtseeEventsDashboardSessionComponent, selector: "rtsee-rtsee-events-dashboard-session", inputs: ["session"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardClientThumbnailComponent, deps: [{ token: TimeFormatHelperService }, { token: DefaultImagesService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeEventsDashboardClientThumbnailComponent, selector: "ngx-rtsee-events-dashboard-client-thumbnail", inputs: { dashboard: "dashboard", client: "client" }, ngImport: i0, template: "<div class=\"rtsee-dashboard-client-thumbnail\">\n  <div class=\"rtsee-dashboard-client-header\">\n    <div class=\"rtsee-dashboard-client-header-photo\">\n      <div class=\"rtsee-dashboard-client-header-image\"\n           [style.background-image]=\"'url(' + client.imageUrl || defaultImagesService.PROFILE + ')'\"\n      ></div>\n      <div class=\"rtsee-dashboard-client-live-indicator\" *ngIf=\"client.isConnected\"></div>\n    </div>\n    <p class=\"rtsee-dashboard-client-name\">\n      <span class=\"rtsee-dashboard-client-name-text\">{{ client.name || client.id }}</span>\n      <button (click)=\"openChat()\" class=\"rtsee-dashboard-client-engage\">\n        <span class=\"rtsee-dashboard-client-engage-icon material-icons-outlined\">chat_bubble</span>\n      </button>\n    </p>\n  </div>\n  <div class=\"rtsee-dashboard-sessions\">\n    <div *ngFor=\"let session of client.sessions\"\n         class=\"rtsee-dashboard-sessions-container\">\n      <rtsee-rtsee-events-dashboard-session [session]=\"session\"></rtsee-rtsee-events-dashboard-session>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: RtseeEventsDashboardSessionComponent, selector: "rtsee-rtsee-events-dashboard-session", inputs: ["session"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardClientThumbnailComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardClientThumbnailComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-events-dashboard-client-thumbnail', template: "<div class=\"rtsee-dashboard-client-thumbnail\">\n  <div class=\"rtsee-dashboard-client-header\">\n    <div class=\"rtsee-dashboard-client-header-photo\">\n      <div class=\"rtsee-dashboard-client-header-image\"\n           [style.background-image]=\"'url(' + client.imageUrl || defaultImagesService.PROFILE + ')'\"\n      ></div>\n      <div class=\"rtsee-dashboard-client-live-indicator\" *ngIf=\"client.isConnected\"></div>\n    </div>\n    <p class=\"rtsee-dashboard-client-name\">\n      <span class=\"rtsee-dashboard-client-name-text\">{{ client.name || client.id }}</span>\n      <button (click)=\"openChat()\" class=\"rtsee-dashboard-client-engage\">\n        <span class=\"rtsee-dashboard-client-engage-icon material-icons-outlined\">chat_bubble</span>\n      </button>\n    </p>\n  </div>\n  <div class=\"rtsee-dashboard-sessions\">\n    <div *ngFor=\"let session of client.sessions\"\n         class=\"rtsee-dashboard-sessions-container\">\n      <rtsee-rtsee-events-dashboard-session [session]=\"session\"></rtsee-rtsee-events-dashboard-session>\n    </div>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: TimeFormatHelperService }, { type: DefaultImagesService }]; }, propDecorators: { dashboard: [{
+        }], ctorParameters: () => [{ type: TimeFormatHelperService }, { type: DefaultImagesService }], propDecorators: { dashboard: [{
                 type: Input
             }], client: [{
                 type: Input
             }] } });
 
 class RtseeEventsDashboardComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: { eventsDashboard: "eventsDashboard" }, ngImport: i0, template: "<div class=\"rtsee-events-dashboard\">\n  <div class=\"rtsee-events-dashboard-client-thumbnails\">\n    <div class=\"rtsee-events-dashboard-client-thumbnail-wrapper\"\n         *ngFor=\"let client of eventsDashboard.clients\">\n      <ngx-rtsee-events-dashboard-client-thumbnail\n        [client]=\"client\"\n        [dashboard]=\"eventsDashboard\"\n      ></ngx-rtsee-events-dashboard-client-thumbnail>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: RtseeEventsDashboardClientThumbnailComponent, selector: "ngx-rtsee-events-dashboard-client-thumbnail", inputs: ["dashboard", "client"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: { eventsDashboard: "eventsDashboard" }, ngImport: i0, template: "<div class=\"rtsee-events-dashboard\">\n  <div class=\"rtsee-events-dashboard-client-thumbnails\">\n    <div class=\"rtsee-events-dashboard-client-thumbnail-wrapper\"\n         *ngFor=\"let client of eventsDashboard.clients\">\n      <ngx-rtsee-events-dashboard-client-thumbnail\n        [client]=\"client\"\n        [dashboard]=\"eventsDashboard\"\n      ></ngx-rtsee-events-dashboard-client-thumbnail>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: RtseeEventsDashboardClientThumbnailComponent, selector: "ngx-rtsee-events-dashboard-client-thumbnail", inputs: ["dashboard", "client"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-events-dashboard', template: "<div class=\"rtsee-events-dashboard\">\n  <div class=\"rtsee-events-dashboard-client-thumbnails\">\n    <div class=\"rtsee-events-dashboard-client-thumbnail-wrapper\"\n         *ngFor=\"let client of eventsDashboard.clients\">\n      <ngx-rtsee-events-dashboard-client-thumbnail\n        [client]=\"client\"\n        [dashboard]=\"eventsDashboard\"\n      ></ngx-rtsee-events-dashboard-client-thumbnail>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { eventsDashboard: [{
@@ -914,10 +914,10 @@ class SlideComponent {
             this.story.previousSlide();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SlideComponent, selector: "rtsee-slide", inputs: { story: "story", slide: "slide" }, ngImport: i0, template: "<div class=\"rtsee-presentation-slide\">\n  <ng-template *ngIf=\"slide.widget\" widgetHost></ng-template>\n  <div class=\"rtsee-presentation-slide-default\">\n    <div class=\"rtsee-presentation-slide-image-container\"\n         [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n         *ngIf=\"slide.imageUrl\"\n    >\n    </div>\n    <div class=\"rtsee-presentation-slide-text\">\n      <p>{{slide.text}}</p>\n    </div>\n    <div class=\"rtsee-presentation-slide-controls\">\n      <button class=\"slide-navigation-btn navigation-prev\"\n              (click)=\"slideRewindClicked(false)\"\n              *ngIf=\"story.activeSlideNumber !== 1\"\n      >\n        <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n        >arrow_back_ios</span>\n      </button>\n      <button class=\"slide-navigation-btn navigation-next\"\n              (click)=\"slideRewindClicked(true)\"\n              *ngIf=\"story.activeSlideNumber !== this.story.totalSlides\"\n      >\n        <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n        >arrow_forward_ios</span>\n      </button>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SlideComponent, selector: "rtsee-slide", inputs: { story: "story", slide: "slide" }, ngImport: i0, template: "<div class=\"rtsee-presentation-slide\">\n  <ng-template *ngIf=\"slide.widget\" widgetHost></ng-template>\n  <div class=\"rtsee-presentation-slide-default\">\n    <div class=\"rtsee-presentation-slide-image-container\"\n         [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n         *ngIf=\"slide.imageUrl\"\n    >\n    </div>\n    <div class=\"rtsee-presentation-slide-text\">\n      <p>{{slide.text}}</p>\n    </div>\n    <div class=\"rtsee-presentation-slide-controls\">\n      <button class=\"slide-navigation-btn navigation-prev\"\n              (click)=\"slideRewindClicked(false)\"\n              *ngIf=\"story.activeSlideNumber !== 1\"\n      >\n        <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n        >arrow_back_ios</span>\n      </button>\n      <button class=\"slide-navigation-btn navigation-next\"\n              (click)=\"slideRewindClicked(true)\"\n              *ngIf=\"story.activeSlideNumber !== this.story.totalSlides\"\n      >\n        <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n        >arrow_forward_ios</span>\n      </button>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: WidgetDirective, selector: "[widgetHost]" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SlideComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SlideComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-slide', template: "<div class=\"rtsee-presentation-slide\">\n  <ng-template *ngIf=\"slide.widget\" widgetHost></ng-template>\n  <div class=\"rtsee-presentation-slide-default\">\n    <div class=\"rtsee-presentation-slide-image-container\"\n         [ngStyle]=\"{'background-image': 'url(' + slide.imageUrl + ')'}\"\n         *ngIf=\"slide.imageUrl\"\n    >\n    </div>\n    <div class=\"rtsee-presentation-slide-text\">\n      <p>{{slide.text}}</p>\n    </div>\n    <div class=\"rtsee-presentation-slide-controls\">\n      <button class=\"slide-navigation-btn navigation-prev\"\n              (click)=\"slideRewindClicked(false)\"\n              *ngIf=\"story.activeSlideNumber !== 1\"\n      >\n        <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n        >arrow_back_ios</span>\n      </button>\n      <button class=\"slide-navigation-btn navigation-next\"\n              (click)=\"slideRewindClicked(true)\"\n              *ngIf=\"story.activeSlideNumber !== this.story.totalSlides\"\n      >\n        <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n        >arrow_forward_ios</span>\n      </button>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { story: [{
@@ -930,10 +930,10 @@ class StoryPlayerComponent {
     ngOnInit() {
         console.log('Story Player: Story = ', this.story);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: StoryPlayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: { story: "story" }, ngImport: i0, template: "<div class=\"rtsee-story-player\">\n  <div class=\"rtsee-story-player-slider\">\n    <div class=\"story-player-slide-container\"\n         *ngFor=\"let slide of story.slides\"\n         [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n    >\n      <rtsee-slide [slide]=\"slide\" [story]=\"story\"></rtsee-slide>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SlideComponent, selector: "rtsee-slide", inputs: ["story", "slide"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StoryPlayerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: { story: "story" }, ngImport: i0, template: "<div class=\"rtsee-story-player\">\n  <div class=\"rtsee-story-player-slider\">\n    <div class=\"story-player-slide-container\"\n         *ngFor=\"let slide of story.slides\"\n         [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n    >\n      <rtsee-slide [slide]=\"slide\" [story]=\"story\"></rtsee-slide>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SlideComponent, selector: "rtsee-slide", inputs: ["story", "slide"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: StoryPlayerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StoryPlayerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-story-player', template: "<div class=\"rtsee-story-player\">\n  <div class=\"rtsee-story-player-slider\">\n    <div class=\"story-player-slide-container\"\n         *ngFor=\"let slide of story.slides\"\n         [ngClass]=\"{'story-player-slide-active': slide.isActive}\"\n    >\n      <rtsee-slide [slide]=\"slide\" [story]=\"story\"></rtsee-slide>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { story: [{
@@ -944,10 +944,10 @@ class StoryThumbnailComponent {
     constructor() {
         this.Math = Math;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: StoryThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: { story: "story" }, ngImport: i0, template: "<div class=\"rtsee-story-thumbnail\">\n  <div class=\"rtsee-story-thumbnail-image-container\"\n       [ngStyle]=\"{'background-image': 'url(' + story.imageUrl + ')'}\"\n  >\n  </div>\n  <div class=\"rtsee-story-thumbnail-body-container\">\n    <div class=\"rtsee-story-thumbnail-title-container\">\n      <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n    </div>\n    <div class=\"rtsee-story-thumbnail-info-container\" *ngIf=\"story.averageReadTime\">\n      <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n      <span class=\"rtsee-story-thumbnail-info-read-time\">{{ Math.ceil(story.averageReadTime / 60) }} \u0445\u0432</span>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StoryThumbnailComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: { story: "story" }, ngImport: i0, template: "<div class=\"rtsee-story-thumbnail\">\n  <div class=\"rtsee-story-thumbnail-image-container\"\n       [ngStyle]=\"{'background-image': 'url(' + story.imageUrl + ')'}\"\n  >\n  </div>\n  <div class=\"rtsee-story-thumbnail-body-container\">\n    <div class=\"rtsee-story-thumbnail-title-container\">\n      <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n    </div>\n    <div class=\"rtsee-story-thumbnail-info-container\" *ngIf=\"story.averageReadTime\">\n      <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n      <span class=\"rtsee-story-thumbnail-info-read-time\">{{ Math.ceil(story.averageReadTime / 60) }} \u0445\u0432</span>\n    </div>\n  </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: StoryThumbnailComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StoryThumbnailComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-story-thumbnail', template: "<div class=\"rtsee-story-thumbnail\">\n  <div class=\"rtsee-story-thumbnail-image-container\"\n       [ngStyle]=\"{'background-image': 'url(' + story.imageUrl + ')'}\"\n  >\n  </div>\n  <div class=\"rtsee-story-thumbnail-body-container\">\n    <div class=\"rtsee-story-thumbnail-title-container\">\n      <h4 class=\"rtsee-story-thumbnail-title\">{{story.name}}</h4>\n    </div>\n    <div class=\"rtsee-story-thumbnail-info-container\" *ngIf=\"story.averageReadTime\">\n      <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\">schedule</span>\n      <span class=\"rtsee-story-thumbnail-info-read-time\">{{ Math.ceil(story.averageReadTime / 60) }} \u0445\u0432</span>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { story: [{
@@ -955,10 +955,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
             }] } });
 
 class PresentationHeaderComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: PresentationHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: { presentation: "presentation" }, ngImport: i0, template: "<div class=\"rtsee-presentation-header\">\n  <div class=\"rtsee-presentation-room-block\">\n    <div class=\"rtsee-presentation-active-room\" *ngIf=\"presentation.activeRoom\">\n      <p>{{presentation.activeRoom.id}}</p>\n      <button (click)=\"presentation.emitJoinRoomCallEvent()\">Join Video Call</button>\n    </div>\n  </div>\n  <div class=\"rtsee-story-info\" *ngIf=\"presentation.activeStory\">\n    <p>{{presentation.activeStory.name}}</p>\n    <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n          (click)=\"presentation.disableActiveStory()\"\n    >close</span>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PresentationHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: { presentation: "presentation" }, ngImport: i0, template: "<div class=\"rtsee-presentation-header\">\n  <div class=\"rtsee-presentation-room-block\">\n    <div class=\"rtsee-presentation-active-room\" *ngIf=\"presentation.activeRoom\">\n      <p>{{presentation.activeRoom.id}}</p>\n      <button (click)=\"presentation.emitJoinRoomCallEvent()\">Join Video Call</button>\n    </div>\n  </div>\n  <div class=\"rtsee-story-info\" *ngIf=\"presentation.activeStory\">\n    <p>{{presentation.activeStory.name}}</p>\n    <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n          (click)=\"presentation.disableActiveStory()\"\n    >close</span>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: PresentationHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PresentationHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-presentation-header', template: "<div class=\"rtsee-presentation-header\">\n  <div class=\"rtsee-presentation-room-block\">\n    <div class=\"rtsee-presentation-active-room\" *ngIf=\"presentation.activeRoom\">\n      <p>{{presentation.activeRoom.id}}</p>\n      <button (click)=\"presentation.emitJoinRoomCallEvent()\">Join Video Call</button>\n    </div>\n  </div>\n  <div class=\"rtsee-story-info\" *ngIf=\"presentation.activeStory\">\n    <p>{{presentation.activeStory.name}}</p>\n    <span class=\"rtsee-story-thumbnail-info-time-icon material-icons-outlined\"\n          (click)=\"presentation.disableActiveStory()\"\n    >close</span>\n  </div>\n</div>\n" }]
         }], propDecorators: { presentation: [{
@@ -967,13 +967,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
 
 class PresentationComponent {
     constructor() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: PresentationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: PresentationComponent, selector: "rtsee-presentation", inputs: { presentation: "presentation" }, ngImport: i0, template: "<div class=\"rtsee-presentation\">\n  <div class=\"rtsee-presentation-header-block\">\n    <rtsee-presentation-header [presentation]=\"presentation\"\n    ></rtsee-presentation-header>\n  </div>\n  <div class=\"rtsee-presentation-stories-list\"\n       *ngIf=\"!presentation.activeStory\"\n  >\n    <div class=\"rtsee-presentation-story-thumbnail-container\"\n         *ngFor=\"let story of presentation.stories\"\n         (click)=\"presentation.setActiveStory(story)\"\n    >\n      <rtsee-story-thumbnail\n        [story]=\"story\"\n      ></rtsee-story-thumbnail>\n    </div>\n  </div>\n  <div class=\"rtsee-presentation-story-viewer-container\"\n       *ngIf=\"presentation.activeStory\"\n  >\n    <rtsee-story-player [story]=\"presentation.activeStory\"\n    ></rtsee-story-player>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: ["story"] }, { kind: "component", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: ["story"] }, { kind: "component", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: ["presentation"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PresentationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: PresentationComponent, selector: "rtsee-presentation", inputs: { presentation: "presentation" }, ngImport: i0, template: "<div class=\"rtsee-presentation\">\n  <div class=\"rtsee-presentation-header-block\">\n    <rtsee-presentation-header [presentation]=\"presentation\"\n    ></rtsee-presentation-header>\n  </div>\n  <div class=\"rtsee-presentation-stories-list\"\n       *ngIf=\"!presentation.activeStory\"\n  >\n    <div class=\"rtsee-presentation-story-thumbnail-container\"\n         *ngFor=\"let story of presentation.stories\"\n         (click)=\"presentation.setActiveStory(story)\"\n    >\n      <rtsee-story-thumbnail\n        [story]=\"story\"\n      ></rtsee-story-thumbnail>\n    </div>\n  </div>\n  <div class=\"rtsee-presentation-story-viewer-container\"\n       *ngIf=\"presentation.activeStory\"\n  >\n    <rtsee-story-player [story]=\"presentation.activeStory\"\n    ></rtsee-story-player>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: StoryPlayerComponent, selector: "rtsee-story-player", inputs: ["story"] }, { kind: "component", type: StoryThumbnailComponent, selector: "rtsee-story-thumbnail", inputs: ["story"] }, { kind: "component", type: PresentationHeaderComponent, selector: "rtsee-presentation-header", inputs: ["presentation"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: PresentationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PresentationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-presentation', template: "<div class=\"rtsee-presentation\">\n  <div class=\"rtsee-presentation-header-block\">\n    <rtsee-presentation-header [presentation]=\"presentation\"\n    ></rtsee-presentation-header>\n  </div>\n  <div class=\"rtsee-presentation-stories-list\"\n       *ngIf=\"!presentation.activeStory\"\n  >\n    <div class=\"rtsee-presentation-story-thumbnail-container\"\n         *ngFor=\"let story of presentation.stories\"\n         (click)=\"presentation.setActiveStory(story)\"\n    >\n      <rtsee-story-thumbnail\n        [story]=\"story\"\n      ></rtsee-story-thumbnail>\n    </div>\n  </div>\n  <div class=\"rtsee-presentation-story-viewer-container\"\n       *ngIf=\"presentation.activeStory\"\n  >\n    <rtsee-story-player [story]=\"presentation.activeStory\"\n    ></rtsee-story-player>\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return []; }, propDecorators: { presentation: [{
+        }], ctorParameters: () => [], propDecorators: { presentation: [{
                 type: Input
             }] } });
 
@@ -984,10 +984,10 @@ class RtseeSidenavComponent {
     toggleButtonClicked() {
         this.toggleClicked.emit(true);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeSidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeSidenavComponent, selector: "rtsee-sidenav", inputs: { config: "config", isExpanded: "isExpanded" }, outputs: { toggleClicked: "toggleClicked" }, ngImport: i0, template: "<div class=\"rtsee-sidenav\"\n     [ngClass]=\"{'rtsee-sidenav-expanded': isExpanded}\">\n  <div class=\"rtsee-sidenav-header\">\n    <div class=\"rtsee-site-logo\">\n      <a [routerLink]=\"['/']\" class=\"rtsee-home-link\">\n        <span class=\"rtsee-site-logo-wrapper\" *ngIf=\"config.siteLogo\">\n          <img [src]=\"config.siteLogo.src\" [ngClass]=\"config.siteLogo.classNames\" [alt]=\"config.siteLogo.alt\">\n        </span>\n        <span class=\"rtsee-site-name\">{{config.siteName}}</span>\n      </a>\n    </div>\n  </div>\n  <div class=\"rtsee-sidenav-body\">\n    <div id=\"rtsee-nav-items-container\">\n      <ul class=\"rtsee-nav-items\">\n        <li *ngFor=\"let route of config.routes\"\n            [ngClass]=\"{'rtsee-nav-item-hidden': !route.isEnabled}\">\n          <a [routerLink]=\"route.link\"\n             routerLinkActive=\"active\"\n             class=\"rtsee-nav-item\">\n            <span class=\"rtsee-nav-item-icon\" [ngClass]=\"route.iconClassName\"></span>\n            <span class=\"rtsee-nav-item-name\">{{route.name}}</span>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n  <div class=\"rtsee-sidenav-toggle\" (click)=\"toggleButtonClicked()\">\n    <i class=\"fa fa-angle-right sidenav-toggle-button\" *ngIf=\"!isExpanded\"></i>\n    <i class=\"fa fa-angle-left sidenav-toggle-button\" *ngIf=\"isExpanded\"></i>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeSidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeSidenavComponent, selector: "rtsee-sidenav", inputs: { config: "config", isExpanded: "isExpanded" }, outputs: { toggleClicked: "toggleClicked" }, ngImport: i0, template: "<div class=\"rtsee-sidenav\"\n     [ngClass]=\"{'rtsee-sidenav-expanded': isExpanded}\">\n  <div class=\"rtsee-sidenav-header\">\n    <div class=\"rtsee-site-logo\">\n      <a [routerLink]=\"['/']\" class=\"rtsee-home-link\">\n        <span class=\"rtsee-site-logo-wrapper\" *ngIf=\"config.siteLogo\">\n          <img [src]=\"config.siteLogo.src\" [ngClass]=\"config.siteLogo.classNames\" [alt]=\"config.siteLogo.alt\">\n        </span>\n        <span class=\"rtsee-site-name\">{{config.siteName}}</span>\n      </a>\n    </div>\n  </div>\n  <div class=\"rtsee-sidenav-body\">\n    <div id=\"rtsee-nav-items-container\">\n      <ul class=\"rtsee-nav-items\">\n        <li *ngFor=\"let route of config.routes\"\n            [ngClass]=\"{'rtsee-nav-item-hidden': !route.isEnabled}\">\n          <a [routerLink]=\"route.link\"\n             routerLinkActive=\"active\"\n             class=\"rtsee-nav-item\">\n            <span class=\"rtsee-nav-item-icon\" [ngClass]=\"route.iconClassName\"></span>\n            <span class=\"rtsee-nav-item-name\">{{route.name}}</span>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n  <div class=\"rtsee-sidenav-toggle\" (click)=\"toggleButtonClicked()\">\n    <i class=\"fa fa-angle-right sidenav-toggle-button\" *ngIf=\"!isExpanded\"></i>\n    <i class=\"fa fa-angle-left sidenav-toggle-button\" *ngIf=\"isExpanded\"></i>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeSidenavComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeSidenavComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-sidenav', template: "<div class=\"rtsee-sidenav\"\n     [ngClass]=\"{'rtsee-sidenav-expanded': isExpanded}\">\n  <div class=\"rtsee-sidenav-header\">\n    <div class=\"rtsee-site-logo\">\n      <a [routerLink]=\"['/']\" class=\"rtsee-home-link\">\n        <span class=\"rtsee-site-logo-wrapper\" *ngIf=\"config.siteLogo\">\n          <img [src]=\"config.siteLogo.src\" [ngClass]=\"config.siteLogo.classNames\" [alt]=\"config.siteLogo.alt\">\n        </span>\n        <span class=\"rtsee-site-name\">{{config.siteName}}</span>\n      </a>\n    </div>\n  </div>\n  <div class=\"rtsee-sidenav-body\">\n    <div id=\"rtsee-nav-items-container\">\n      <ul class=\"rtsee-nav-items\">\n        <li *ngFor=\"let route of config.routes\"\n            [ngClass]=\"{'rtsee-nav-item-hidden': !route.isEnabled}\">\n          <a [routerLink]=\"route.link\"\n             routerLinkActive=\"active\"\n             class=\"rtsee-nav-item\">\n            <span class=\"rtsee-nav-item-icon\" [ngClass]=\"route.iconClassName\"></span>\n            <span class=\"rtsee-nav-item-name\">{{route.name}}</span>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n  <div class=\"rtsee-sidenav-toggle\" (click)=\"toggleButtonClicked()\">\n    <i class=\"fa fa-angle-right sidenav-toggle-button\" *ngIf=\"!isExpanded\"></i>\n    <i class=\"fa fa-angle-left sidenav-toggle-button\" *ngIf=\"isExpanded\"></i>\n  </div>\n</div>\n" }]
         }], propDecorators: { config: [{
@@ -999,10 +999,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImpor
             }] } });
 
 class RtseeBottomNavComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeBottomNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeBottomNavComponent, selector: "rtsee-bottom-nav", inputs: { config: "config", tabPanel: "tabPanel" }, ngImport: i0, template: "<div class=\"rtsee-bottom-nav\">\n  <nav mat-tab-nav-bar [tabPanel]=\"tabPanel\" class=\"rtsee-nav-bar\">\n    <a *ngFor=\"let route of config.routes\"\n       mat-tab-link\n       [routerLink]=\"route.link\"\n       routerLinkActive #rlaPosSearch=\"routerLinkActive\"\n       [ngClass]=\"{'rtsee-nav-item-hidden': !route.isEnabled}\"\n       [routerLinkActiveOptions]=\"{exact:true}\"\n       [active]=\"rlaPosSearch.isActive\"\n       class=\"rtsee-nav-bar-link rtsee-bottom-nav-bar-link\"\n    >\n      <span class=\"rtsee-nav-bar-link-icon\">\n        <span class=\"rtsee-nav-item-icon\" [ngClass]=\"route.iconClassName\"></span>\n      </span>\n    </a>\n  </nav>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i3$2.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "animationDuration"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i3$2.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["disabled", "disableRipple", "tabIndex", "active", "id"], exportAs: ["matTabLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeBottomNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeBottomNavComponent, selector: "rtsee-bottom-nav", inputs: { config: "config", tabPanel: "tabPanel" }, ngImport: i0, template: "<div class=\"rtsee-bottom-nav\">\n  <nav mat-tab-nav-bar [tabPanel]=\"tabPanel\" class=\"rtsee-nav-bar\">\n    <a *ngFor=\"let route of config.routes\"\n       mat-tab-link\n       [routerLink]=\"route.link\"\n       routerLinkActive #rlaPosSearch=\"routerLinkActive\"\n       [ngClass]=\"{'rtsee-nav-item-hidden': !route.isEnabled}\"\n       [routerLinkActiveOptions]=\"{exact:true}\"\n       [active]=\"rlaPosSearch.isActive\"\n       class=\"rtsee-nav-bar-link rtsee-bottom-nav-bar-link\"\n    >\n      <span class=\"rtsee-nav-bar-link-icon\">\n        <span class=\"rtsee-nav-item-icon\" [ngClass]=\"route.iconClassName\"></span>\n      </span>\n    </a>\n  </nav>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i3$2.MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "animationDuration"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: i3$2.MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["disabled", "disableRipple", "tabIndex", "active", "id"], exportAs: ["matTabLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeBottomNavComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeBottomNavComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-bottom-nav', template: "<div class=\"rtsee-bottom-nav\">\n  <nav mat-tab-nav-bar [tabPanel]=\"tabPanel\" class=\"rtsee-nav-bar\">\n    <a *ngFor=\"let route of config.routes\"\n       mat-tab-link\n       [routerLink]=\"route.link\"\n       routerLinkActive #rlaPosSearch=\"routerLinkActive\"\n       [ngClass]=\"{'rtsee-nav-item-hidden': !route.isEnabled}\"\n       [routerLinkActiveOptions]=\"{exact:true}\"\n       [active]=\"rlaPosSearch.isActive\"\n       class=\"rtsee-nav-bar-link rtsee-bottom-nav-bar-link\"\n    >\n      <span class=\"rtsee-nav-bar-link-icon\">\n        <span class=\"rtsee-nav-item-icon\" [ngClass]=\"route.iconClassName\"></span>\n      </span>\n    </a>\n  </nav>\n</div>\n" }]
         }], propDecorators: { config: [{
@@ -1018,10 +1018,10 @@ class RTSeeContainerComponent {
     onSidenavToggleClicked() {
         this.isSidenavExpanded = !this.isSidenavExpanded;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RTSeeContainerComponent, selector: "rtsee-container", inputs: { rtsee: "rtsee", navigationConfig: "navigationConfig" }, ngImport: i0, template: "<div class=\"rtsee-shell\"\n     [ngClass]=\"{\n     'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n     'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n     'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n     'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n     'rtsee-shell-side-nav-expanded': isSidenavExpanded\n     }\"\n>\n  <div class=\"rtsee-sidenav-block\">\n    <rtsee-sidenav [config]=\"navigationConfig\" [isExpanded]=\"isSidenavExpanded\" (toggleClicked)=\"onSidenavToggleClicked()\"></rtsee-sidenav>\n  </div>\n\n  <div class=\"rtsee-shell-panel\">\n    <div class=\"rtsee-conference-container\"\n         *ngIf=\"rtsee.conference && rtsee.conference.isInActiveCall\"\n    >\n      <rtsee-conference [rtSee]=\"rtsee.conference\"\n      ></rtsee-conference>\n    </div>\n\n    <div class=\"rtsee-messenger-container\"\n         *ngIf=\"rtsee.messenger\"\n    >\n      <rtsee-messenger [messenger]=\"rtsee.messenger\"\n      ></rtsee-messenger>\n    </div>\n\n    <div class=\"rtsee-events-dashboard-container\"\n         *ngIf=\"rtsee.eventsDashboard && rtsee.eventsDashboard.isReady\"\n    >\n      <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n      ></rtsee-events-dashboard>\n    </div>\n\n    <div class=\"rtsee-presentation-container\" *ngIf=\"rtsee.presentation && rtsee.presentation.isActive\">\n      <rtsee-presentation [presentation]=\"rtsee.presentation\"></rtsee-presentation>\n    </div>\n  </div>\n\n  <div class=\"rtsee-content\">\n    <mat-tab-nav-panel #tabPanel>\n      <ng-content></ng-content>\n    </mat-tab-nav-panel>\n  </div>\n  <div class=\"rtsee-bottom-nav-block\" *ngIf=\"tabPanel\">\n    <rtsee-bottom-nav [config]=\"navigationConfig\" [tabPanel]=\"tabPanel\"></rtsee-bottom-nav>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: ["rtSee"] }, { kind: "component", type: MessengerComponent, selector: "rtsee-messenger", inputs: ["messenger"] }, { kind: "component", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: ["eventsDashboard"] }, { kind: "component", type: PresentationComponent, selector: "rtsee-presentation", inputs: ["presentation"] }, { kind: "component", type: RtseeSidenavComponent, selector: "rtsee-sidenav", inputs: ["config", "isExpanded"], outputs: ["toggleClicked"] }, { kind: "component", type: RtseeBottomNavComponent, selector: "rtsee-bottom-nav", inputs: ["config", "tabPanel"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeContainerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RTSeeContainerComponent, selector: "rtsee-container", inputs: { rtsee: "rtsee", navigationConfig: "navigationConfig" }, ngImport: i0, template: "<div class=\"rtsee-shell\"\n     [ngClass]=\"{\n     'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n     'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n     'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n     'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n     'rtsee-shell-side-nav-expanded': isSidenavExpanded\n     }\"\n>\n  <div class=\"rtsee-sidenav-block\">\n    <rtsee-sidenav [config]=\"navigationConfig\" [isExpanded]=\"isSidenavExpanded\" (toggleClicked)=\"onSidenavToggleClicked()\"></rtsee-sidenav>\n  </div>\n\n  <div class=\"rtsee-shell-panel\">\n    <div class=\"rtsee-conference-container\"\n         *ngIf=\"rtsee.conference && rtsee.conference.isInActiveCall\"\n    >\n      <rtsee-conference [rtSee]=\"rtsee.conference\"\n      ></rtsee-conference>\n    </div>\n\n    <div class=\"rtsee-messenger-container\"\n         *ngIf=\"rtsee.messenger\"\n    >\n      <rtsee-messenger [messenger]=\"rtsee.messenger\"\n      ></rtsee-messenger>\n    </div>\n\n    <div class=\"rtsee-events-dashboard-container\"\n         *ngIf=\"rtsee.eventsDashboard && rtsee.eventsDashboard.isReady\"\n    >\n      <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n      ></rtsee-events-dashboard>\n    </div>\n\n    <div class=\"rtsee-presentation-container\" *ngIf=\"rtsee.presentation && rtsee.presentation.isActive\">\n      <rtsee-presentation [presentation]=\"rtsee.presentation\"></rtsee-presentation>\n    </div>\n  </div>\n\n  <div class=\"rtsee-content\">\n    <mat-tab-nav-panel #tabPanel>\n      <ng-content></ng-content>\n    </mat-tab-nav-panel>\n  </div>\n  <div class=\"rtsee-bottom-nav-block\" *ngIf=\"tabPanel\">\n    <rtsee-bottom-nav [config]=\"navigationConfig\" [tabPanel]=\"tabPanel\"></rtsee-bottom-nav>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: RTSeeConferenceComponent, selector: "rtsee-conference", inputs: ["rtSee"] }, { kind: "component", type: MessengerComponent, selector: "rtsee-messenger", inputs: ["messenger"] }, { kind: "component", type: RtseeEventsDashboardComponent, selector: "rtsee-events-dashboard", inputs: ["eventsDashboard"] }, { kind: "component", type: PresentationComponent, selector: "rtsee-presentation", inputs: ["presentation"] }, { kind: "component", type: RtseeSidenavComponent, selector: "rtsee-sidenav", inputs: ["config", "isExpanded"], outputs: ["toggleClicked"] }, { kind: "component", type: RtseeBottomNavComponent, selector: "rtsee-bottom-nav", inputs: ["config", "tabPanel"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeContainerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-container', template: "<div class=\"rtsee-shell\"\n     [ngClass]=\"{\n     'rtsee-shell-conference-mode': rtsee.conference && rtsee.conference.isInActiveCall,\n     'rtsee-shell-messenger-active': rtsee.messenger && rtsee.activeTab === 'messenger',\n     'rtsee-shell-dashboard-active': rtsee.eventsDashboard && rtsee.activeTab === 'events-dashboard',\n     'rtsee-shell-presentation-active': rtsee.presentation && rtsee.activeTab === 'presentation',\n     'rtsee-shell-side-nav-expanded': isSidenavExpanded\n     }\"\n>\n  <div class=\"rtsee-sidenav-block\">\n    <rtsee-sidenav [config]=\"navigationConfig\" [isExpanded]=\"isSidenavExpanded\" (toggleClicked)=\"onSidenavToggleClicked()\"></rtsee-sidenav>\n  </div>\n\n  <div class=\"rtsee-shell-panel\">\n    <div class=\"rtsee-conference-container\"\n         *ngIf=\"rtsee.conference && rtsee.conference.isInActiveCall\"\n    >\n      <rtsee-conference [rtSee]=\"rtsee.conference\"\n      ></rtsee-conference>\n    </div>\n\n    <div class=\"rtsee-messenger-container\"\n         *ngIf=\"rtsee.messenger\"\n    >\n      <rtsee-messenger [messenger]=\"rtsee.messenger\"\n      ></rtsee-messenger>\n    </div>\n\n    <div class=\"rtsee-events-dashboard-container\"\n         *ngIf=\"rtsee.eventsDashboard && rtsee.eventsDashboard.isReady\"\n    >\n      <rtsee-events-dashboard [eventsDashboard]=\"rtsee.eventsDashboard\"\n      ></rtsee-events-dashboard>\n    </div>\n\n    <div class=\"rtsee-presentation-container\" *ngIf=\"rtsee.presentation && rtsee.presentation.isActive\">\n      <rtsee-presentation [presentation]=\"rtsee.presentation\"></rtsee-presentation>\n    </div>\n  </div>\n\n  <div class=\"rtsee-content\">\n    <mat-tab-nav-panel #tabPanel>\n      <ng-content></ng-content>\n    </mat-tab-nav-panel>\n  </div>\n  <div class=\"rtsee-bottom-nav-block\" *ngIf=\"tabPanel\">\n    <rtsee-bottom-nav [config]=\"navigationConfig\" [tabPanel]=\"tabPanel\"></rtsee-bottom-nav>\n  </div>\n</div>\n" }]
         }], propDecorators: { rtsee: [{
@@ -1042,15 +1042,15 @@ class UtilsService {
         }
         return {};
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: UtilsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: UtilsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UtilsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UtilsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: UtilsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UtilsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: function () { return []; } });
+        }], ctorParameters: () => [] });
 
 class SignUpComponent {
     constructor(formBuilder) {
@@ -1080,13 +1080,13 @@ class SignUpComponent {
             // this.authService.signUp(formValue);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SignUpComponent, deps: [{ token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SignUpComponent, selector: "rtsee-sign-up", ngImport: i0, template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"logo\" height=\"38\" width=\"37\"/>\n  <h2 class=\"auth-title\">\u0420\u0435\u0454\u0441\u0442\u0440\u0430\u0446\u0456\u044F \u0432 \u041E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u041A\u0430\u0431\u0456\u043D\u0435\u0442</h2>\n  <p class=\"auth-title-description\">\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C \u0441\u0432\u0456\u0439 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u043A\u0430\u0431\u0456\u043D\u0435\u0442, \u0449\u043E\u0431 \u043F\u0435\u0440\u0435\u0433\u043B\u044F\u0434\u0430\u0442\u0438 \u043A\u0430\u0437\u043A\u0438</p>\n\n  <form class=\"auth-form\" [formGroup]=\"signUpForm\" (ngSubmit)=\"signUp()\">\n    <!-- Email Field -->\n    <label for=\"sign-up-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input [formControlName]=\"signUpFormKeys.email\" type=\"email\" id=\"sign-up-email\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\" class=\"auth-input-container email-input\" />\n\n    <!-- Password Field -->\n    <label for=\"sign-up-password\" class=\"auth-sm-medium\">\u041F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signUpFormKeys.password\" type=\"password\" id=\"sign-up-password\" placeholder=\"\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Confirm Password Field -->\n    <label for=\"confirm-password\" class=\"auth-sm-medium\">\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u044C\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signUpFormKeys.newPassword\" type=\"password\" id=\"confirm-password\" placeholder=\"\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u044C\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Terms and Conditions -->\n    <div class=\"auth-options\">\n      <label class=\"auth-checkbox-label\">\n        <input type=\"checkbox\" class=\"auth-deep-blue-sm-medium\" [formControlName]=\"signUpFormKeys.terms\" />\n        \u042F \u043F\u043E\u0433\u043E\u0434\u0436\u0443\u044E\u0441\u044C \u0437&nbsp;<a href=\"#\" class=\"auth-deep-blue-sm-medium\">\u0443\u043C\u043E\u0432\u0430\u043C\u0438 \u0432\u0438\u043A\u043E\u0440\u0438\u0441\u0442\u0430\u043D\u043D\u044F</a>\n      </label>\n    </div>\n\n    <!-- Sign-Up Button -->\n    <button type=\"submit\" class=\"auth-btn-container\">\u0417\u0430\u0440\u0435\u0454\u0441\u0442\u0440\u0443\u0432\u0430\u0442\u0438\u0441\u044C</button>\n  </form>\n\n  <!-- Redirect to Sign-In -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u0412\u0436\u0435 \u043C\u0430\u0454\u0442\u0435 \u0430\u043A\u0430\u0443\u043D\u0442? <a href=\"#\" [routerLink]=\"['/', 'sign-in']\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "src", "srcset"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignUpComponent, deps: [{ token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SignUpComponent, selector: "rtsee-sign-up", ngImport: i0, template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"logo\" height=\"38\" width=\"37\"/>\n  <h2 class=\"auth-title\">\u0420\u0435\u0454\u0441\u0442\u0440\u0430\u0446\u0456\u044F \u0432 \u041E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u041A\u0430\u0431\u0456\u043D\u0435\u0442</h2>\n  <p class=\"auth-title-description\">\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C \u0441\u0432\u0456\u0439 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u043A\u0430\u0431\u0456\u043D\u0435\u0442, \u0449\u043E\u0431 \u043F\u0435\u0440\u0435\u0433\u043B\u044F\u0434\u0430\u0442\u0438 \u043A\u0430\u0437\u043A\u0438</p>\n\n  <form class=\"auth-form\" [formGroup]=\"signUpForm\" (ngSubmit)=\"signUp()\">\n    <!-- Email Field -->\n    <label for=\"sign-up-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input [formControlName]=\"signUpFormKeys.email\" type=\"email\" id=\"sign-up-email\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\" class=\"auth-input-container email-input\" />\n\n    <!-- Password Field -->\n    <label for=\"sign-up-password\" class=\"auth-sm-medium\">\u041F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signUpFormKeys.password\" type=\"password\" id=\"sign-up-password\" placeholder=\"\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Confirm Password Field -->\n    <label for=\"confirm-password\" class=\"auth-sm-medium\">\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u044C\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signUpFormKeys.newPassword\" type=\"password\" id=\"confirm-password\" placeholder=\"\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u044C\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Terms and Conditions -->\n    <div class=\"auth-options\">\n      <label class=\"auth-checkbox-label\">\n        <input type=\"checkbox\" class=\"auth-deep-blue-sm-medium\" [formControlName]=\"signUpFormKeys.terms\" />\n        \u042F \u043F\u043E\u0433\u043E\u0434\u0436\u0443\u044E\u0441\u044C \u0437&nbsp;<a href=\"#\" class=\"auth-deep-blue-sm-medium\">\u0443\u043C\u043E\u0432\u0430\u043C\u0438 \u0432\u0438\u043A\u043E\u0440\u0438\u0441\u0442\u0430\u043D\u043D\u044F</a>\n      </label>\n    </div>\n\n    <!-- Sign-Up Button -->\n    <button type=\"submit\" class=\"auth-btn-container\">\u0417\u0430\u0440\u0435\u0454\u0441\u0442\u0440\u0443\u0432\u0430\u0442\u0438\u0441\u044C</button>\n  </form>\n\n  <!-- Redirect to Sign-In -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u0412\u0436\u0435 \u043C\u0430\u0454\u0442\u0435 \u0430\u043A\u0430\u0443\u043D\u0442? <a href=\"#\" [routerLink]=\"['/', 'sign-in']\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SignUpComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignUpComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-sign-up', template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"logo\" height=\"38\" width=\"37\"/>\n  <h2 class=\"auth-title\">\u0420\u0435\u0454\u0441\u0442\u0440\u0430\u0446\u0456\u044F \u0432 \u041E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u041A\u0430\u0431\u0456\u043D\u0435\u0442</h2>\n  <p class=\"auth-title-description\">\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C \u0441\u0432\u0456\u0439 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u043A\u0430\u0431\u0456\u043D\u0435\u0442, \u0449\u043E\u0431 \u043F\u0435\u0440\u0435\u0433\u043B\u044F\u0434\u0430\u0442\u0438 \u043A\u0430\u0437\u043A\u0438</p>\n\n  <form class=\"auth-form\" [formGroup]=\"signUpForm\" (ngSubmit)=\"signUp()\">\n    <!-- Email Field -->\n    <label for=\"sign-up-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input [formControlName]=\"signUpFormKeys.email\" type=\"email\" id=\"sign-up-email\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\" class=\"auth-input-container email-input\" />\n\n    <!-- Password Field -->\n    <label for=\"sign-up-password\" class=\"auth-sm-medium\">\u041F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signUpFormKeys.password\" type=\"password\" id=\"sign-up-password\" placeholder=\"\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Confirm Password Field -->\n    <label for=\"confirm-password\" class=\"auth-sm-medium\">\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u044C\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signUpFormKeys.newPassword\" type=\"password\" id=\"confirm-password\" placeholder=\"\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u044C\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Terms and Conditions -->\n    <div class=\"auth-options\">\n      <label class=\"auth-checkbox-label\">\n        <input type=\"checkbox\" class=\"auth-deep-blue-sm-medium\" [formControlName]=\"signUpFormKeys.terms\" />\n        \u042F \u043F\u043E\u0433\u043E\u0434\u0436\u0443\u044E\u0441\u044C \u0437&nbsp;<a href=\"#\" class=\"auth-deep-blue-sm-medium\">\u0443\u043C\u043E\u0432\u0430\u043C\u0438 \u0432\u0438\u043A\u043E\u0440\u0438\u0441\u0442\u0430\u043D\u043D\u044F</a>\n      </label>\n    </div>\n\n    <!-- Sign-Up Button -->\n    <button type=\"submit\" class=\"auth-btn-container\">\u0417\u0430\u0440\u0435\u0454\u0441\u0442\u0440\u0443\u0432\u0430\u0442\u0438\u0441\u044C</button>\n  </form>\n\n  <!-- Redirect to Sign-In -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u0412\u0436\u0435 \u043C\u0430\u0454\u0442\u0435 \u0430\u043A\u0430\u0443\u043D\u0442? <a href=\"#\" [routerLink]=\"['/', 'sign-in']\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }]; } });
+        }], ctorParameters: () => [{ type: i1$1.FormBuilder }] });
 
 class SignInComponent {
     constructor(formBuilder, router) {
@@ -1109,13 +1109,13 @@ class SignInComponent {
             //   });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SignInComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: SignInComponent, selector: "rtsee-sign-in", ngImport: i0, template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"auth-logo\" height=\"38\" width=\"37\"/>\n  <h2 class=\"auth-title\">\u0412\u0445\u0456\u0434 \u0432 \u041E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u041A\u0430\u0431\u0456\u043D\u0435\u0442</h2>\n  <p class=\"auth-title-description\">\u0410\u0431\u0438 \u043F\u0435\u0440\u0435\u0433\u043B\u044F\u0434\u0430\u0442\u0438 \u043A\u0430\u0437\u043A\u0438, \u0443\u0432\u0456\u0439\u0434\u0456\u0442\u044C \u0432 \u0441\u0432\u0456\u0439 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u043A\u0430\u0431\u0456\u043D\u0435\u0442</p>\n\n  <form class=\"auth-form\" [formGroup]=\"signInForm\" (ngSubmit)=\"login()\">\n    <label for=\"sign-in-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input [formControlName]=\"signInFormKeys.username\" type=\"email\" id=\"sign-in-email\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\" class=\"auth-input-container email-input\" />\n\n    <label for=\"password\" class=\"auth-sm-medium\">\u041F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signInFormKeys.password\" type=\"password\" id=\"password\" placeholder=\"\u041F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <div class=\"auth-options\">\n      <label class=\"auth-checkbox-label\">\n        <input type=\"checkbox\" class=\"auth-deep-blue-sm-medium auth-remember-checkbox\" />\n        \u0417\u0430\u043F\u0430\u043C\u2019\u044F\u0442\u0430\u0442\u0438\n      </label>\n      <a href=\"#\" [routerLink]=\"['/', 'forgot-password']\" class=\"auth-deep-blue-sm-medium\">\u0417\u0430\u0431\u0443\u043B\u0438 \u043F\u0430\u0440\u043E\u043B\u044C?</a>\n    </div>\n\n    <button type=\"submit\" class=\"auth-btn-container\">\u0423\u0432\u0456\u0439\u0442\u0438</button>\n  </form>\n\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u041D\u0435\u043C\u0430\u0454 \u0430\u043A\u0430\u0443\u043D\u0442\u0443? <a href=\"#\" [routerLink]=\"['/', 'sign-up']\" class=\"auth-deep-blue-sm-medium\">\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C!</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "src", "srcset"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignInComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: SignInComponent, selector: "rtsee-sign-in", ngImport: i0, template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"auth-logo\" height=\"38\" width=\"37\"/>\n  <h2 class=\"auth-title\">\u0412\u0445\u0456\u0434 \u0432 \u041E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u041A\u0430\u0431\u0456\u043D\u0435\u0442</h2>\n  <p class=\"auth-title-description\">\u0410\u0431\u0438 \u043F\u0435\u0440\u0435\u0433\u043B\u044F\u0434\u0430\u0442\u0438 \u043A\u0430\u0437\u043A\u0438, \u0443\u0432\u0456\u0439\u0434\u0456\u0442\u044C \u0432 \u0441\u0432\u0456\u0439 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u043A\u0430\u0431\u0456\u043D\u0435\u0442</p>\n\n  <form class=\"auth-form\" [formGroup]=\"signInForm\" (ngSubmit)=\"login()\">\n    <label for=\"sign-in-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input [formControlName]=\"signInFormKeys.username\" type=\"email\" id=\"sign-in-email\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\" class=\"auth-input-container email-input\" />\n\n    <label for=\"password\" class=\"auth-sm-medium\">\u041F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signInFormKeys.password\" type=\"password\" id=\"password\" placeholder=\"\u041F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <div class=\"auth-options\">\n      <label class=\"auth-checkbox-label\">\n        <input type=\"checkbox\" class=\"auth-deep-blue-sm-medium auth-remember-checkbox\" />\n        \u0417\u0430\u043F\u0430\u043C\u2019\u044F\u0442\u0430\u0442\u0438\n      </label>\n      <a href=\"#\" [routerLink]=\"['/', 'forgot-password']\" class=\"auth-deep-blue-sm-medium\">\u0417\u0430\u0431\u0443\u043B\u0438 \u043F\u0430\u0440\u043E\u043B\u044C?</a>\n    </div>\n\n    <button type=\"submit\" class=\"auth-btn-container\">\u0423\u0432\u0456\u0439\u0442\u0438</button>\n  </form>\n\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u041D\u0435\u043C\u0430\u0454 \u0430\u043A\u0430\u0443\u043D\u0442\u0443? <a href=\"#\" [routerLink]=\"['/', 'sign-up']\" class=\"auth-deep-blue-sm-medium\">\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C!</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: SignInComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SignInComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-sign-in', template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"auth-logo\" height=\"38\" width=\"37\"/>\n  <h2 class=\"auth-title\">\u0412\u0445\u0456\u0434 \u0432 \u041E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u041A\u0430\u0431\u0456\u043D\u0435\u0442</h2>\n  <p class=\"auth-title-description\">\u0410\u0431\u0438 \u043F\u0435\u0440\u0435\u0433\u043B\u044F\u0434\u0430\u0442\u0438 \u043A\u0430\u0437\u043A\u0438, \u0443\u0432\u0456\u0439\u0434\u0456\u0442\u044C \u0432 \u0441\u0432\u0456\u0439 \u043E\u0441\u043E\u0431\u0438\u0441\u0442\u0438\u0439 \u043A\u0430\u0431\u0456\u043D\u0435\u0442</p>\n\n  <form class=\"auth-form\" [formGroup]=\"signInForm\" (ngSubmit)=\"login()\">\n    <label for=\"sign-in-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input [formControlName]=\"signInFormKeys.username\" type=\"email\" id=\"sign-in-email\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\" class=\"auth-input-container email-input\" />\n\n    <label for=\"password\" class=\"auth-sm-medium\">\u041F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"signInFormKeys.password\" type=\"password\" id=\"password\" placeholder=\"\u041F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <div class=\"auth-options\">\n      <label class=\"auth-checkbox-label\">\n        <input type=\"checkbox\" class=\"auth-deep-blue-sm-medium auth-remember-checkbox\" />\n        \u0417\u0430\u043F\u0430\u043C\u2019\u044F\u0442\u0430\u0442\u0438\n      </label>\n      <a href=\"#\" [routerLink]=\"['/', 'forgot-password']\" class=\"auth-deep-blue-sm-medium\">\u0417\u0430\u0431\u0443\u043B\u0438 \u043F\u0430\u0440\u043E\u043B\u044C?</a>\n    </div>\n\n    <button type=\"submit\" class=\"auth-btn-container\">\u0423\u0432\u0456\u0439\u0442\u0438</button>\n  </form>\n\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u041D\u0435\u043C\u0430\u0454 \u0430\u043A\u0430\u0443\u043D\u0442\u0443? <a href=\"#\" [routerLink]=\"['/', 'sign-up']\" class=\"auth-deep-blue-sm-medium\">\u0421\u0442\u0432\u043E\u0440\u0456\u0442\u044C!</a>\n  </p>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2$2.Router }]; } });
+        }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: i2$2.Router }] });
 
 class ForgotPasswordComponent {
     constructor(formBuilder) {
@@ -1130,13 +1130,13 @@ class ForgotPasswordComponent {
         if (this.emailForm.valid) {
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ForgotPasswordComponent, deps: [{ token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ForgotPasswordComponent, selector: "rtsee-forgot-password", ngImport: i0, template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"auth-logo\" height=\"38\" width=\"37\" />\n  <h2 class=\"auth-title\">\u0412\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044E</h2>\n  <p class=\"auth-title-description\">\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0432\u0430\u0448\u0443 \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443, \u0449\u043E\u0431 \u043E\u0442\u0440\u0438\u043C\u0430\u0442\u0438 \u0456\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0456\u0457 \u0437 \u0432\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044E</p>\n\n  <form class=\"auth-form\" [formGroup]=\"emailForm\" (ngSubmit)=\"submitEmail()\">\n    <!-- Email Field -->\n    <label for=\"forgot-password-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input\n      [formControlName]=\"forgotPasswordFormKeys.email\"\n      type=\"email\"\n      id=\"forgot-password-email\"\n      placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\"\n      class=\"auth-input-container email-input\"\n    />\n\n    <!-- Submit Button -->\n    <button type=\"submit\" class=\"auth-btn-container\" [disabled]=\"isLoading\">\n      <span> {{isLoading ? '\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F...' : '\u0412\u0456\u0434\u043F\u0440\u0430\u0432\u0438\u0442\u0438'}}</span>\n    </button>\n  </form>\n\n  <!-- Redirect to Sign-In -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u041F\u0430\u043C'\u044F\u0442\u0430\u0454\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C? <a [routerLink]=\"['/', 'sign-in']\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "src", "srcset"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ForgotPasswordComponent, deps: [{ token: i1$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ForgotPasswordComponent, selector: "rtsee-forgot-password", ngImport: i0, template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"auth-logo\" height=\"38\" width=\"37\" />\n  <h2 class=\"auth-title\">\u0412\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044E</h2>\n  <p class=\"auth-title-description\">\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0432\u0430\u0448\u0443 \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443, \u0449\u043E\u0431 \u043E\u0442\u0440\u0438\u043C\u0430\u0442\u0438 \u0456\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0456\u0457 \u0437 \u0432\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044E</p>\n\n  <form class=\"auth-form\" [formGroup]=\"emailForm\" (ngSubmit)=\"submitEmail()\">\n    <!-- Email Field -->\n    <label for=\"forgot-password-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input\n      [formControlName]=\"forgotPasswordFormKeys.email\"\n      type=\"email\"\n      id=\"forgot-password-email\"\n      placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\"\n      class=\"auth-input-container email-input\"\n    />\n\n    <!-- Submit Button -->\n    <button type=\"submit\" class=\"auth-btn-container\" [disabled]=\"isLoading\">\n      <span> {{isLoading ? '\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F...' : '\u0412\u0456\u0434\u043F\u0440\u0430\u0432\u0438\u0442\u0438'}}</span>\n    </button>\n  </form>\n\n  <!-- Redirect to Sign-In -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u041F\u0430\u043C'\u044F\u0442\u0430\u0454\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C? <a [routerLink]=\"['/', 'sign-in']\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1.NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ForgotPasswordComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ForgotPasswordComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-forgot-password', template: "<div class=\"auth-container\">\n  <img ngSrc=\"/assets/img.png\" alt=\"Company Logo\" class=\"auth-logo\" height=\"38\" width=\"37\" />\n  <h2 class=\"auth-title\">\u0412\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044E</h2>\n  <p class=\"auth-title-description\">\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0432\u0430\u0448\u0443 \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443, \u0449\u043E\u0431 \u043E\u0442\u0440\u0438\u043C\u0430\u0442\u0438 \u0456\u043D\u0441\u0442\u0440\u0443\u043A\u0446\u0456\u0457 \u0437 \u0432\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044E</p>\n\n  <form class=\"auth-form\" [formGroup]=\"emailForm\" (ngSubmit)=\"submitEmail()\">\n    <!-- Email Field -->\n    <label for=\"forgot-password-email\" class=\"auth-sm-medium\">\u0415\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0430 \u043F\u043E\u0448\u0442\u0430</label>\n    <input\n      [formControlName]=\"forgotPasswordFormKeys.email\"\n      type=\"email\"\n      id=\"forgot-password-email\"\n      placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u0435\u043B\u0435\u043A\u0442\u0440\u043E\u043D\u043D\u0443 \u043F\u043E\u0448\u0442\u0443\"\n      class=\"auth-input-container email-input\"\n    />\n\n    <!-- Submit Button -->\n    <button type=\"submit\" class=\"auth-btn-container\" [disabled]=\"isLoading\">\n      <span> {{isLoading ? '\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F...' : '\u0412\u0456\u0434\u043F\u0440\u0430\u0432\u0438\u0442\u0438'}}</span>\n    </button>\n  </form>\n\n  <!-- Redirect to Sign-In -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u041F\u0430\u043C'\u044F\u0442\u0430\u0454\u0442\u0435 \u043F\u0430\u0440\u043E\u043B\u044C? <a [routerLink]=\"['/', 'sign-in']\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }]; } });
+        }], ctorParameters: () => [{ type: i1$1.FormBuilder }] });
 
 var FormErrorKey;
 (function (FormErrorKey) {
@@ -1211,56 +1211,56 @@ class ResetPasswordComponent {
             return null;
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ResetPasswordComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$2.ActivatedRoute }, { token: i2$2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: ResetPasswordComponent, selector: "rtsee-reset-password", ngImport: i0, template: "<div class=\"auth-container\">\n  <img src=\"assets/img.png\" alt=\"Company Logo\" class=\"logo\" height=\"38\" width=\"37\" />\n  <h2 class=\"auth-title\">\u0412\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u041F\u0430\u0440\u043E\u043B\u044F</h2>\n  <p class=\"auth-title-description\">\n    \u0411\u0443\u0434\u044C \u043B\u0430\u0441\u043A\u0430, \u0432\u0432\u0435\u0434\u0456\u0442\u044C \u043D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C \u0434\u043B\u044F \u0432\u0430\u0448\u043E\u0433\u043E \u0430\u043A\u0430\u0443\u043D\u0442\u0443.\n  </p>\n\n  <form class=\"auth-form\" [formGroup]=\"resetPasswordForm\" (ngSubmit)=\"resetPassword()\">\n    <!-- New Password Field -->\n    <label for=\"new-password\" class=\"auth-sm-medium\">\u041D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"passwordFormKeys.password\" type=\"password\" id=\"new-password\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u043D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Confirm Password Field -->\n    <label for=\"confirm-password\" class=\"auth-sm-medium\">\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u0436\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044F</label>\n    <input [formControlName]=\"passwordFormKeys.passwordConfirm\" type=\"password\" id=\"confirm-password\" placeholder=\"\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u0456\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Reset Password Button -->\n    <button type=\"submit\" class=\"auth-btn-container\">\u0412\u0456\u0434\u043D\u043E\u0432\u0438\u0442\u0438 \u041F\u0430\u0440\u043E\u043B\u044C</button>\n  </form>\n\n  <!-- Redirect to Login -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u0417\u0433\u0430\u0434\u0430\u043B\u0438 \u043F\u0430\u0440\u043E\u043B\u044C? <a href=\"#\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResetPasswordComponent, deps: [{ token: i1$1.FormBuilder }, { token: i2$2.ActivatedRoute }, { token: i2$2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ResetPasswordComponent, selector: "rtsee-reset-password", ngImport: i0, template: "<div class=\"auth-container\">\n  <img src=\"assets/img.png\" alt=\"Company Logo\" class=\"logo\" height=\"38\" width=\"37\" />\n  <h2 class=\"auth-title\">\u0412\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u041F\u0430\u0440\u043E\u043B\u044F</h2>\n  <p class=\"auth-title-description\">\n    \u0411\u0443\u0434\u044C \u043B\u0430\u0441\u043A\u0430, \u0432\u0432\u0435\u0434\u0456\u0442\u044C \u043D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C \u0434\u043B\u044F \u0432\u0430\u0448\u043E\u0433\u043E \u0430\u043A\u0430\u0443\u043D\u0442\u0443.\n  </p>\n\n  <form class=\"auth-form\" [formGroup]=\"resetPasswordForm\" (ngSubmit)=\"resetPassword()\">\n    <!-- New Password Field -->\n    <label for=\"new-password\" class=\"auth-sm-medium\">\u041D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"passwordFormKeys.password\" type=\"password\" id=\"new-password\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u043D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Confirm Password Field -->\n    <label for=\"confirm-password\" class=\"auth-sm-medium\">\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u0436\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044F</label>\n    <input [formControlName]=\"passwordFormKeys.passwordConfirm\" type=\"password\" id=\"confirm-password\" placeholder=\"\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u0456\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Reset Password Button -->\n    <button type=\"submit\" class=\"auth-btn-container\">\u0412\u0456\u0434\u043D\u043E\u0432\u0438\u0442\u0438 \u041F\u0430\u0440\u043E\u043B\u044C</button>\n  </form>\n\n  <!-- Redirect to Login -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u0417\u0433\u0430\u0434\u0430\u043B\u0438 \u043F\u0430\u0440\u043E\u043B\u044C? <a href=\"#\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: ResetPasswordComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ResetPasswordComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-reset-password', template: "<div class=\"auth-container\">\n  <img src=\"assets/img.png\" alt=\"Company Logo\" class=\"logo\" height=\"38\" width=\"37\" />\n  <h2 class=\"auth-title\">\u0412\u0456\u0434\u043D\u043E\u0432\u043B\u0435\u043D\u043D\u044F \u041F\u0430\u0440\u043E\u043B\u044F</h2>\n  <p class=\"auth-title-description\">\n    \u0411\u0443\u0434\u044C \u043B\u0430\u0441\u043A\u0430, \u0432\u0432\u0435\u0434\u0456\u0442\u044C \u043D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C \u0434\u043B\u044F \u0432\u0430\u0448\u043E\u0433\u043E \u0430\u043A\u0430\u0443\u043D\u0442\u0443.\n  </p>\n\n  <form class=\"auth-form\" [formGroup]=\"resetPasswordForm\" (ngSubmit)=\"resetPassword()\">\n    <!-- New Password Field -->\n    <label for=\"new-password\" class=\"auth-sm-medium\">\u041D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C</label>\n    <input [formControlName]=\"passwordFormKeys.password\" type=\"password\" id=\"new-password\" placeholder=\"\u0412\u0432\u0435\u0434\u0456\u0442\u044C \u043D\u043E\u0432\u0438\u0439 \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Confirm Password Field -->\n    <label for=\"confirm-password\" class=\"auth-sm-medium\">\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u0436\u0435\u043D\u043D\u044F \u043F\u0430\u0440\u043E\u043B\u044F</label>\n    <input [formControlName]=\"passwordFormKeys.passwordConfirm\" type=\"password\" id=\"confirm-password\" placeholder=\"\u041F\u0456\u0434\u0442\u0432\u0435\u0440\u0434\u0456\u0442\u044C \u043F\u0430\u0440\u043E\u043B\u044C\" class=\"auth-input-container password-input\" />\n\n    <!-- Reset Password Button -->\n    <button type=\"submit\" class=\"auth-btn-container\">\u0412\u0456\u0434\u043D\u043E\u0432\u0438\u0442\u0438 \u041F\u0430\u0440\u043E\u043B\u044C</button>\n  </form>\n\n  <!-- Redirect to Login -->\n  <p class=\"auth-media-blue-gray-sm-normal\">\n    \u0417\u0433\u0430\u0434\u0430\u043B\u0438 \u043F\u0430\u0440\u043E\u043B\u044C? <a href=\"#\" class=\"auth-deep-blue-sm-medium\">\u0423\u0432\u0456\u0439\u0434\u0456\u0442\u044C</a>\n  </p>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.FormBuilder }, { type: i2$2.ActivatedRoute }, { type: i2$2.Router }]; } });
+        }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: i2$2.ActivatedRoute }, { type: i2$2.Router }] });
 
 class AuthComponent {
     constructor() {
         this.activeComponent = 'sign-in';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: AuthComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: AuthComponent, selector: "rtsee-auth", ngImport: i0, template: "<div class=\"rtsee-auth\">\n  <button (click)=\"activeComponent = 'sign-in'\">Sing In</button>\n  <button (click)=\"activeComponent = 'sign-up'\">Sing Up</button>\n  <button (click)=\"activeComponent = 'forgot-password'\">Forgot Password</button>\n  <button (click)=\"activeComponent = 'reset-password'\">Reset Password</button>\n\n\n  <rtsee-sign-in *ngIf=\"activeComponent === 'sign-in'\"></rtsee-sign-in>\n  <rtsee-sign-up *ngIf=\"activeComponent === 'sign-up'\"></rtsee-sign-up>\n  <rtsee-forgot-password *ngIf=\"activeComponent === 'forgot-password'\"></rtsee-forgot-password>\n  <rtsee-reset-password *ngIf=\"activeComponent === 'reset-password'\"></rtsee-reset-password>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SignUpComponent, selector: "rtsee-sign-up" }, { kind: "component", type: SignInComponent, selector: "rtsee-sign-in" }, { kind: "component", type: ForgotPasswordComponent, selector: "rtsee-forgot-password" }, { kind: "component", type: ResetPasswordComponent, selector: "rtsee-reset-password" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AuthComponent, selector: "rtsee-auth", ngImport: i0, template: "<div class=\"rtsee-auth\">\n  <button (click)=\"activeComponent = 'sign-in'\">Sing In</button>\n  <button (click)=\"activeComponent = 'sign-up'\">Sing Up</button>\n  <button (click)=\"activeComponent = 'forgot-password'\">Forgot Password</button>\n  <button (click)=\"activeComponent = 'reset-password'\">Reset Password</button>\n\n\n  <rtsee-sign-in *ngIf=\"activeComponent === 'sign-in'\"></rtsee-sign-in>\n  <rtsee-sign-up *ngIf=\"activeComponent === 'sign-up'\"></rtsee-sign-up>\n  <rtsee-forgot-password *ngIf=\"activeComponent === 'forgot-password'\"></rtsee-forgot-password>\n  <rtsee-reset-password *ngIf=\"activeComponent === 'reset-password'\"></rtsee-reset-password>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SignUpComponent, selector: "rtsee-sign-up" }, { kind: "component", type: SignInComponent, selector: "rtsee-sign-in" }, { kind: "component", type: ForgotPasswordComponent, selector: "rtsee-forgot-password" }, { kind: "component", type: ResetPasswordComponent, selector: "rtsee-reset-password" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: AuthComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AuthComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-auth', template: "<div class=\"rtsee-auth\">\n  <button (click)=\"activeComponent = 'sign-in'\">Sing In</button>\n  <button (click)=\"activeComponent = 'sign-up'\">Sing Up</button>\n  <button (click)=\"activeComponent = 'forgot-password'\">Forgot Password</button>\n  <button (click)=\"activeComponent = 'reset-password'\">Reset Password</button>\n\n\n  <rtsee-sign-in *ngIf=\"activeComponent === 'sign-in'\"></rtsee-sign-in>\n  <rtsee-sign-up *ngIf=\"activeComponent === 'sign-up'\"></rtsee-sign-up>\n  <rtsee-forgot-password *ngIf=\"activeComponent === 'forgot-password'\"></rtsee-forgot-password>\n  <rtsee-reset-password *ngIf=\"activeComponent === 'reset-password'\"></rtsee-reset-password>\n</div>\n" }]
         }] });
 
 class RtseePeersListComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseePeersListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseePeersListComponent, selector: "ngx-rtsee-peers-list", ngImport: i0, template: "<p>rtsee-peers-list works!</p>\n", styles: [""] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseePeersListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseePeersListComponent, selector: "ngx-rtsee-peers-list", ngImport: i0, template: "<p>rtsee-peers-list works!</p>\n", styles: [""] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseePeersListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseePeersListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-peers-list', template: "<p>rtsee-peers-list works!</p>\n" }]
         }] });
 
 class RtseeEventsDashboardClientComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardClientComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: RtseeEventsDashboardClientComponent, selector: "ngx-rtsee-events-dashboard-client", ngImport: i0, template: "<p>rtsee-events-dashboard-client works!</p>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardClientComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RtseeEventsDashboardClientComponent, selector: "ngx-rtsee-events-dashboard-client", ngImport: i0, template: "<p>rtsee-events-dashboard-client works!</p>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RtseeEventsDashboardClientComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RtseeEventsDashboardClientComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-rtsee-events-dashboard-client', template: "<p>rtsee-events-dashboard-client works!</p>\n" }]
         }] });
 
 class VendorsComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: VendorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.3", type: VendorsComponent, selector: "rtsee-vendors", ngImport: i0, template: "<p>vendors works!</p>\n" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: VendorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: VendorsComponent, selector: "rtsee-vendors", ngImport: i0, template: "<p>vendors works!</p>\n" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: VendorsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: VendorsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rtsee-vendors', template: "<p>vendors works!</p>\n" }]
         }] });
 
 class RTSeeModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.3", ngImport: i0, type: RTSeeModule, declarations: [RTSeeConferenceComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: RTSeeModule, declarations: [RTSeeConferenceComponent,
             RTSeeControlsComponent,
             RtseePeerComponent,
             RtseeSoundbarComponent,
@@ -1321,7 +1321,7 @@ class RTSeeModule {
             RTSeeContainerComponent,
             PresentationComponent,
             AuthComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeModule, imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeModule, imports: [CommonModule,
             MatIconModule,
             MatButtonModule,
             MatSelectModule,
@@ -1333,7 +1333,7 @@ class RTSeeModule {
             FormsModule,
             MatTabsModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.3", ngImport: i0, type: RTSeeModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RTSeeModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [