@muraai/mnl-chat 0.0.1 → 0.2.0-alpha-11e96eb

package/fesm2022/muraai-mnl-chat.mjs

@@ -0,0 +1,1507 @@
+import * as i1$2 from '@angular/common/http';
+import { HttpClientModule } from '@angular/common/http';
+import * as i3 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import * as i0 from '@angular/core';
+import { NgModule, Injectable, Pipe, EventEmitter, Output, Input, ViewEncapsulation, Component, ViewChild, HostListener, ViewChildren, APP_INITIALIZER } from '@angular/core';
+import { AppConfigService } from '@muraai/mnl-commons';
+import { MatButtonModule } from '@angular/material/button';
+import { MatListModule } from '@angular/material/list';
+import { MatIconModule } from '@angular/material/icon';
+import { MatInputModule } from '@angular/material/input';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatCardModule } from '@angular/material/card';
+import * as i1$1 from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatMenuModule } from '@angular/material/menu';
+import * as i2 from '@angular/material/tooltip';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { map } from 'rxjs/operators';
+import { Subject, debounceTime, takeUntil } from 'rxjs';
+import * as i1 from '@angular/platform-browser';
+
+function modules() {
+    return [
+        MatButtonModule,
+        MatFormFieldModule,
+        MatIconModule,
+        MatInputModule,
+        FormsModule,
+        ReactiveFormsModule,
+        MatMenuModule,
+        MatListModule,
+        MatCardModule,
+        MatTooltipModule
+    ];
+}
+class ChatMaterialModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatMaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: ChatMaterialModule, imports: [MatButtonModule,
+            MatFormFieldModule,
+            MatIconModule,
+            MatInputModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatMenuModule,
+            MatListModule,
+            MatCardModule,
+            MatTooltipModule], exports: [MatButtonModule,
+            MatFormFieldModule,
+            MatIconModule,
+            MatInputModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatMenuModule,
+            MatListModule,
+            MatCardModule,
+            MatTooltipModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatMaterialModule, imports: [modules(), MatButtonModule,
+            MatFormFieldModule,
+            MatIconModule,
+            MatInputModule,
+            FormsModule,
+            ReactiveFormsModule,
+            MatMenuModule,
+            MatListModule,
+            MatCardModule,
+            MatTooltipModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatMaterialModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: modules(),
+                    exports: modules()
+                }]
+        }] });
+
+class ChatService {
+    constructor() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [] });
+
+var MessageType;
+(function (MessageType) {
+    MessageType[MessageType["Text"] = 1] = "Text";
+    MessageType[MessageType["File"] = 2] = "File";
+    MessageType[MessageType["Image"] = 3] = "Image";
+})(MessageType || (MessageType = {}));
+
+class Window {
+    constructor(participant, isLoadingHistory, isCollapsed) {
+        this.messages = [];
+        this.newMessage = "";
+        // UI Behavior properties
+        this.isCollapsed = false;
+        this.isLoadingHistory = false;
+        this.hasFocus = false;
+        this.hasMoreMessages = true;
+        this.historyPage = 0;
+        this.participant = participant;
+        this.messages = [];
+        this.isLoadingHistory = isLoadingHistory;
+        this.hasFocus = false; // This will be triggered when the 'newMessage' input gets the current focus
+        this.isCollapsed = isCollapsed;
+        this.hasMoreMessages = false;
+        this.historyPage = 0;
+    }
+}
+
+var ChatParticipantStatus;
+(function (ChatParticipantStatus) {
+    ChatParticipantStatus[ChatParticipantStatus["Online"] = 0] = "Online";
+    ChatParticipantStatus[ChatParticipantStatus["Busy"] = 1] = "Busy";
+    ChatParticipantStatus[ChatParticipantStatus["Away"] = 2] = "Away";
+    ChatParticipantStatus[ChatParticipantStatus["Offline"] = 3] = "Offline";
+})(ChatParticipantStatus || (ChatParticipantStatus = {}));
+
+var ScrollDirection;
+(function (ScrollDirection) {
+    ScrollDirection[ScrollDirection["Top"] = 0] = "Top";
+    ScrollDirection[ScrollDirection["Bottom"] = 1] = "Bottom";
+})(ScrollDirection || (ScrollDirection = {}));
+
+class ChatAdapter {
+    constructor() {
+        // ### Abstract adapter methods ###
+        // Event handlers
+        /** @internal */
+        this.friendsListChangedHandler = (participantsResponse) => { };
+        /** @internal */
+        this.messageReceivedHandler = (participant, message) => { };
+    }
+    // ### Adapter/Chat income/ingress events ###
+    onFriendsListChanged(participantsResponse) {
+        this.friendsListChangedHandler(participantsResponse);
+    }
+    onMessageReceived(participant, message) {
+        this.messageReceivedHandler(participant, message);
+    }
+}
+
+// import { User } from "./user";
+/**
+ * @description Chat Adapter decorator class that adds pagination to load the history of messagesr.
+ * You will need an existing @see ChatAdapter implementation
+ */
+class PagedHistoryChatAdapter extends ChatAdapter {
+}
+
+/*import { IFileUploadAdapter } from './file-upload-adapter';
+import { HttpClient, HttpRequest, HttpEventType, HttpResponse, HttpHeaders } from '@angular/common/http';
+import { Observable, Subject } from 'rxjs';
+import { User } from './user';
+import { Message } from './message';*/
+class DefaultFileUploadAdapter {
+    /**
+     * @summary Basic file upload adapter implementation for HTTP request form file consumption
+     * @param _serverEndpointUrl The API endpoint full qualified address that will receive a form file to process and return the metadata.
+     */
+    constructor(_serverEndpointUrl, _http) {
+        this._serverEndpointUrl = _serverEndpointUrl;
+        this._http = _http;
+    }
+    uploadFile(file, participantId) {
+        const formData = new FormData();
+        //formData.append('ng-chat-sender-userid', currentUserId);
+        formData.append('ng-chat-participant-id', participantId);
+        formData.append('file', file, file.name);
+        return this._http.post(this._serverEndpointUrl, formData);
+        // TODO: Leaving this if we want to track upload progress in detail in the future. Might need a different Subject generic type wrapper
+        // const fileRequest = new HttpRequest('POST', this._serverEndpointUrl, formData, {
+        //     reportProgress: true
+        // });
+        // const uploadProgress = new Subject<number>();
+        // const uploadStatus = uploadProgress.asObservable();
+        //const responsePromise = new Subject<Message>();
+        // this._http
+        //     .request(fileRequest)
+        //     .subscribe(event => {
+        //         // if (event.type == HttpEventType.UploadProgress)
+        //         // {
+        //         //     const percentDone = Math.round(100 * event.loaded / event.total);
+        //         //     uploadProgress.next(percentDone);
+        //         // }
+        //         // else if (event instanceof HttpResponse)
+        //         // {
+        //         //     uploadProgress.complete();
+        //         // }
+        //     });
+    }
+}
+
+var Theme;
+(function (Theme) {
+    Theme["Custom"] = "custom-theme";
+    Theme["Light"] = "light-theme";
+    Theme["Dark"] = "dark-theme";
+})(Theme || (Theme = {}));
+
+// Poached from: https://github.com/Steve-Fenton/TypeScriptUtilities
+// @dynamic
+class Guid {
+    static newGuid() {
+        return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+            var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
+            return v.toString(16);
+        });
+    }
+}
+
+var ChatParticipantType;
+(function (ChatParticipantType) {
+    ChatParticipantType[ChatParticipantType["User"] = 0] = "User";
+    ChatParticipantType[ChatParticipantType["Group"] = 1] = "Group";
+})(ChatParticipantType || (ChatParticipantType = {}));
+
+class Group {
+    constructor(participants) {
+        this.id = Guid.newGuid();
+        this.participantType = ChatParticipantType.Group;
+        this.chattingTo = participants;
+        this.status = ChatParticipantStatus.Online;
+        // TODO: Add some customization for this in future releases
+        this.displayName = participants.map((p) => p.displayName).sort((first, second) => second > first ? -1 : 1).join(", ");
+    }
+}
+
+class MessageCounter {
+    static formatUnreadMessagesTotal(totalUnreadMessages) {
+        if (totalUnreadMessages > 0) {
+            if (totalUnreadMessages > 99)
+                return "99+";
+            else
+                return String(totalUnreadMessages);
+        }
+        // Empty fallback.
+        return "";
+    }
+    /**
+     * Returns a formatted string containing the total unread messages of a chat window.
+     * @param window The window instance to count the unread total messages.
+     * @param currentUserId The current chat instance user id. In this context it would be the sender.
+     */
+    static unreadMessagesTotal(window, currentUserId) {
+        let totalUnreadMessages = 0;
+        if (window) {
+            totalUnreadMessages = window.messages.filter(x => x.fromId != currentUserId && !x.dateSeen).length;
+        }
+        return MessageCounter.formatUnreadMessagesTotal(totalUnreadMessages);
+    }
+}
+
+function chatParticipantStatusDescriptor(status, localization) {
+    const currentStatus = ChatParticipantStatus[status].toString().toLowerCase();
+    return localization.statusDescription[currentStatus];
+}
+
+/*
+ * Sanitizes an URL resource
+*/
+class SanitizePipe {
+    constructor(sanitizer) {
+        this.sanitizer = sanitizer;
+    }
+    transform(url) {
+        return this.sanitizer.bypassSecurityTrustResourceUrl(url);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SanitizePipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: SanitizePipe, isStandalone: false, name: "sanitize" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SanitizePipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'sanitize', standalone: false }]
+        }], ctorParameters: () => [{ type: i1.DomSanitizer }] });
+
+class FirstLetterPipe {
+    transform(value) {
+        // const parts = value.split(" ");
+        // const firstLetter = parts[0][0];
+        // const secondLetters = parts.length > 1 ? parts[1].slice(0, 2) : '';
+        let parts = value?.split(" ");
+        let firstLetter = parts[0].slice(0, 1);
+        let secondLetters = parts.length > 1 ? parts[1].slice(0, 1) : '';
+        return (firstLetter.toUpperCase() + secondLetters.toUpperCase());
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FirstLetterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: FirstLetterPipe, isStandalone: false, name: "firstLetterPipe" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: FirstLetterPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'firstLetterPipe', standalone: false }]
+        }] });
+
+/* eslint-disable */
+class NgChatFriendsListComponent {
+    constructor() {
+        this.participantsInteractedWith = [];
+        this.onParticipantClicked = new EventEmitter();
+        this.onOptionPromptCanceled = new EventEmitter();
+        this.onOptionPromptConfirmed = new EventEmitter();
+        this.hideFriendsList = false;
+        this.onCloseWindowClick = new EventEmitter();
+        this.searchInputChanged = new EventEmitter();
+        this.searchInputSubject = new Subject();
+        this.selectedUsersFromFriendsList = [];
+        this.searchInput = '';
+        this.destroy$ = new Subject();
+        // Exposes enums and functions for the ng-template
+        this.ChatParticipantStatus = ChatParticipantStatus;
+        this.chatParticipantStatusDescriptor = chatParticipantStatusDescriptor;
+        this.cleanUpUserSelection = () => this.selectedUsersFromFriendsList = [];
+    }
+    ngOnInit() {
+        this.initializeSearchInputListener();
+    }
+    ngOnChanges(changes) {
+        if (this.currentActiveOption) {
+            const currentOptionTriggeredBy = this.currentActiveOption && this.currentActiveOption.chattingTo.participant.id;
+            const isActivatedUserInSelectedList = (this.selectedUsersFromFriendsList.filter(item => item.id == currentOptionTriggeredBy)).length > 0;
+            if (!isActivatedUserInSelectedList) {
+                this.selectedUsersFromFriendsList = this.selectedUsersFromFriendsList.concat(this.currentActiveOption.chattingTo.participant);
+            }
+        }
+    }
+    get filteredParticipants() {
+        const query = (this.searchInput || '').trim().toLowerCase();
+        if (!query)
+            return this.participants;
+        return this.participants.filter(participant => {
+            const name = participant.displayName?.toLowerCase() || '';
+            if (name.includes(query))
+                return true;
+            const metadata = participant.metadata;
+            if (!metadata)
+                return false;
+            const fieldsToSearch = [
+                metadata.primary,
+                metadata.secondary,
+                metadata.tertiary
+            ];
+            return fieldsToSearch.some(field => typeof field === 'string' && field.toLowerCase().includes(query));
+        });
+    }
+    isUserSelectedFromFriendsList(user) {
+        return (this.selectedUsersFromFriendsList.filter(item => item.id == user.id)).length > 0;
+    }
+    unreadMessagesTotalByParticipant(participant) {
+        let openedWindow = this.windows.find(x => x.participant.id == participant.id);
+        if (openedWindow) {
+            return MessageCounter.unreadMessagesTotal(openedWindow, this.userId);
+        }
+        else {
+            let totalUnreadMessages = this.participantsResponse
+                .filter(x => x.participant.id == participant.id && !this.participantsInteractedWith.find(u => u.id == participant.id) && x.metadata && x.metadata.totalUnreadMessages > 0)
+                .map((participantResponse) => {
+                return participantResponse.metadata.totalUnreadMessages;
+            })[0];
+            return MessageCounter.formatUnreadMessagesTotal(totalUnreadMessages);
+        }
+    }
+    // Toggle friends list visibility
+    onChatTitleClicked() {
+        this.isCollapsed = !this.isCollapsed;
+    }
+    onFriendsListCheckboxChange(selectedUser, isChecked) {
+        if (isChecked) {
+            this.selectedUsersFromFriendsList.push(selectedUser);
+        }
+        else {
+            this.selectedUsersFromFriendsList.splice(this.selectedUsersFromFriendsList.indexOf(selectedUser), 1);
+        }
+    }
+    onUserClick(clickedUser) {
+        this.onParticipantClicked.emit(clickedUser);
+    }
+    onFriendsListActionCancelClicked() {
+        this.onOptionPromptCanceled.emit();
+        this.cleanUpUserSelection();
+    }
+    onFriendsListActionConfirmClicked() {
+        this.onOptionPromptConfirmed.emit(this.selectedUsersFromFriendsList);
+        this.cleanUpUserSelection();
+    }
+    onCloseWindow() {
+        this.searchInput = '';
+        this.onCloseWindowClick.emit(true);
+    }
+    onSearchInputChange(value) {
+        this.searchInput = value;
+        this.searchInputSubject.next(value);
+    }
+    initializeSearchInputListener() {
+        this.searchInputSubject.pipe(debounceTime(300), takeUntil(this.destroy$)).subscribe(value => {
+            this.searchInputChanged.emit(value);
+        });
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    getParticipantTooltip(participant) {
+        const { metadata, displayName } = participant;
+        if (!metadata)
+            return displayName;
+        const { primary, secondary, tertiary } = metadata;
+        const parts = [primary, secondary, tertiary].filter(Boolean);
+        return parts.length > 0 ? parts.join(' | ') : displayName;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChatFriendsListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: NgChatFriendsListComponent, isStandalone: false, selector: "ng-chat-friends-list", inputs: { participants: "participants", participantsResponse: "participantsResponse", participantsInteractedWith: "participantsInteractedWith", windows: "windows", userId: "userId", localization: "localization", shouldDisplay: "shouldDisplay", isCollapsed: "isCollapsed", searchEnabled: "searchEnabled", currentActiveOption: "currentActiveOption", hideFriendsList: "hideFriendsList" }, outputs: { onParticipantClicked: "onParticipantClicked", onOptionPromptCanceled: "onOptionPromptCanceled", onOptionPromptConfirmed: "onOptionPromptConfirmed", onCloseWindowClick: "onCloseWindowClick", searchInputChanged: "searchInputChanged" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"shouldDisplay\" id=\"ng-chat-people\" [ngClass]=\"{'primary-outline-color': true, 'primary-background': true, 'ng-chat-people-collapsed': isCollapsed}\">\n\t<a href=\"javascript:void(0);\" class=\"ng-chat-title secondary-background shadowed\" (click)=\"onChatTitleClicked()\">\n\t\t<span>\n\t\t\t{{localization.title}}\n\t\t</span>\n\t<a  href=\"javascript:void(0);\" class=\" ng-chat-close \" (click)=\"onCloseWindow()\" >&#x2715;</a>\n\t</a>\n\t<div *ngIf=\"currentActiveOption\" class=\"ng-chat-people-actions\" (click)=\"onFriendsListActionCancelClicked()\">\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-people-action\">\n\t\t\t<i class=\"remove-icon\"></i>\n\t\t</a>\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-people-action\" (click)=\"onFriendsListActionConfirmClicked()\">\n\t\t\t<i class=\"check-icon\"></i>\n\t\t</a>\n\t</div>\n\t<input *ngIf=\"searchEnabled\" id=\"ng-chat-search_friend\" class=\"friends-search-bar\" type=\"search\" [placeholder]=\"localization.searchPlaceholder\" [(ngModel)]=\"searchInput\" \n\t(ngModelChange)=\"onSearchInputChange($event)\"/>\n\t<ul id=\"ng-chat-users\" *ngIf=\"!isCollapsed\" [ngClass]=\"{'offset-search': searchEnabled}\">\n\t\t<li *ngFor=\"let user of filteredParticipants\">\n\t\t\t<input \n\t\t\t\t*ngIf=\"currentActiveOption && currentActiveOption.validateContext(user)\" \n\t\t\t\ttype=\"checkbox\" \n\t\t\t\tclass=\"ng-chat-users-checkbox\" \n\t\t\t\t(change)=\"onFriendsListCheckboxChange(user, $event.target.checked)\" \n\t\t\t\t[checked]=\"isUserSelectedFromFriendsList(user)\"/>\n\t\t\t<div [ngClass]=\"{'ng-chat-friends-list-selectable-offset': currentActiveOption, 'ng-chat-friends-list-container': true}\" (click)=\"onUserClick(user)\">\n\t\t\t\t<!-- <div *ngIf=\"!user.avatar\" class=\"icon-wrapper\">\n\t\t\t\t\t<i class=\"user-icon\"></i>\n\t\t\t\t</div> -->\n\t\t\t\t<div class=\"user\" *ngIf=\"!user.avatar\">\n\t\t\t\t\t{{user.displayName|firstLetterPipe}}\n\n\t\t\t\t</div>\n\n\t\t\t\t<img *ngIf=\"user.avatar\" alt=\"\" class=\"avatar\" height=\"30\" width=\"30\"  [src]=\"user.avatar | sanitize\"/>\n\t\t\t\t<div class=\"\"></div>\n\t\t\t\t<strong [matTooltip]=\"getParticipantTooltip(user)\">{{user.displayName}}</strong>\n\t\t\t\t<span [ngClass]=\"{'ng-chat-participant-status': true, 'online': user.status === ChatParticipantStatus.Online, 'busy': user.status === ChatParticipantStatus.Busy, 'away': user.status === ChatParticipantStatus.Away, 'offline': user.status === ChatParticipantStatus.Offline}\" [matTooltip]=\"chatParticipantStatusDescriptor(user.status, localization)\"></span>\n\t\t\t\t<span *ngIf=\"unreadMessagesTotalByParticipant(user).length > 0\" class=\"ng-chat-unread-messages-count unread-messages-counter-container primary-text\">{{unreadMessagesTotalByParticipant(user)}}</span>\n\t\t\t</div>\n\t\t</li>\n\t</ul>\n</div>", styles: ["#ng-chat-people{position:relative;width:240px;height:360px;border-width:1px;border-style:solid;margin-right:20px;box-shadow:0 4px 8px #00000040;border-bottom:0;border-radius:10px!important;box-sizing:border-box!important;overflow:hidden!important;margin-bottom:10px!important;border:1px solid grey!important}#ng-chat-people.ng-chat-people-collapsed{height:30px}#ng-chat-search_friend{display:block;padding:7px 10px;margin:10px auto 0;width:calc(100% - 20px);font-size:.9em;border-radius:20px!important;border:.5px solid grey!important}#ng-chat-users{padding:0 10px;list-style:none;margin:0;overflow:auto;position:absolute;top:42px;bottom:0;width:100%;box-sizing:border-box}#ng-chat-users.offset-search{top:84px}#ng-chat-users .ng-chat-users-checkbox{float:left;margin-right:5px;margin-top:8px}#ng-chat-users li{clear:both;margin-bottom:10px;overflow:hidden;cursor:pointer;max-height:30px}#ng-chat-users li>.ng-chat-friends-list-selectable-offset{margin-left:22px}#ng-chat-users li .ng-chat-friends-list-container{display:inline-block;width:100%}#ng-chat-users li>.ng-chat-friends-list-selectable-offset.ng-chat-friends-list-container{display:block;width:auto}#ng-chat-users li .ng-chat-friends-list-container>img.avatar,#ng-chat-users li .ng-chat-friends-list-container>.user{float:left;display:flex;justify-content:center;margin-right:5px}#ng-chat-users li .ng-chat-friends-list-container>.user{overflow:hidden;width:30px;height:30px}#ng-chat-users li .ng-chat-friends-list-container>.user>i{color:#fff;transform:scale(.7)}#ng-chat-users li .ng-chat-friends-list-container>strong{float:left;line-height:30px;font-size:.8em;max-width:57%;max-height:30px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#ng-chat-users li .ng-chat-friends-list-container>.ng-chat-participant-status{float:right}.ng-chat-people-actions{position:absolute;top:4px;right:5px;margin:0;padding:0;z-index:2}.ng-chat-people-actions>a.ng-chat-people-action{display:inline-block;width:21px;height:21px;margin-right:8px;text-decoration:none;border:none;border-radius:25px;padding:1px}@media only screen and (max-width: 581px){#ng-chat-people{width:300px;height:360px;margin-right:0}}.user{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background-color:#00b04c;color:#fff;font-size:12px;font-family:inherit}\n"], dependencies: [{ 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: SanitizePipe, name: "sanitize" }, { kind: "pipe", type: FirstLetterPipe, name: "firstLetterPipe" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChatFriendsListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng-chat-friends-list', encapsulation: ViewEncapsulation.None, standalone: false, template: "<div *ngIf=\"shouldDisplay\" id=\"ng-chat-people\" [ngClass]=\"{'primary-outline-color': true, 'primary-background': true, 'ng-chat-people-collapsed': isCollapsed}\">\n\t<a href=\"javascript:void(0);\" class=\"ng-chat-title secondary-background shadowed\" (click)=\"onChatTitleClicked()\">\n\t\t<span>\n\t\t\t{{localization.title}}\n\t\t</span>\n\t<a  href=\"javascript:void(0);\" class=\" ng-chat-close \" (click)=\"onCloseWindow()\" >&#x2715;</a>\n\t</a>\n\t<div *ngIf=\"currentActiveOption\" class=\"ng-chat-people-actions\" (click)=\"onFriendsListActionCancelClicked()\">\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-people-action\">\n\t\t\t<i class=\"remove-icon\"></i>\n\t\t</a>\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-people-action\" (click)=\"onFriendsListActionConfirmClicked()\">\n\t\t\t<i class=\"check-icon\"></i>\n\t\t</a>\n\t</div>\n\t<input *ngIf=\"searchEnabled\" id=\"ng-chat-search_friend\" class=\"friends-search-bar\" type=\"search\" [placeholder]=\"localization.searchPlaceholder\" [(ngModel)]=\"searchInput\" \n\t(ngModelChange)=\"onSearchInputChange($event)\"/>\n\t<ul id=\"ng-chat-users\" *ngIf=\"!isCollapsed\" [ngClass]=\"{'offset-search': searchEnabled}\">\n\t\t<li *ngFor=\"let user of filteredParticipants\">\n\t\t\t<input \n\t\t\t\t*ngIf=\"currentActiveOption && currentActiveOption.validateContext(user)\" \n\t\t\t\ttype=\"checkbox\" \n\t\t\t\tclass=\"ng-chat-users-checkbox\" \n\t\t\t\t(change)=\"onFriendsListCheckboxChange(user, $event.target.checked)\" \n\t\t\t\t[checked]=\"isUserSelectedFromFriendsList(user)\"/>\n\t\t\t<div [ngClass]=\"{'ng-chat-friends-list-selectable-offset': currentActiveOption, 'ng-chat-friends-list-container': true}\" (click)=\"onUserClick(user)\">\n\t\t\t\t<!-- <div *ngIf=\"!user.avatar\" class=\"icon-wrapper\">\n\t\t\t\t\t<i class=\"user-icon\"></i>\n\t\t\t\t</div> -->\n\t\t\t\t<div class=\"user\" *ngIf=\"!user.avatar\">\n\t\t\t\t\t{{user.displayName|firstLetterPipe}}\n\n\t\t\t\t</div>\n\n\t\t\t\t<img *ngIf=\"user.avatar\" alt=\"\" class=\"avatar\" height=\"30\" width=\"30\"  [src]=\"user.avatar | sanitize\"/>\n\t\t\t\t<div class=\"\"></div>\n\t\t\t\t<strong [matTooltip]=\"getParticipantTooltip(user)\">{{user.displayName}}</strong>\n\t\t\t\t<span [ngClass]=\"{'ng-chat-participant-status': true, 'online': user.status === ChatParticipantStatus.Online, 'busy': user.status === ChatParticipantStatus.Busy, 'away': user.status === ChatParticipantStatus.Away, 'offline': user.status === ChatParticipantStatus.Offline}\" [matTooltip]=\"chatParticipantStatusDescriptor(user.status, localization)\"></span>\n\t\t\t\t<span *ngIf=\"unreadMessagesTotalByParticipant(user).length > 0\" class=\"ng-chat-unread-messages-count unread-messages-counter-container primary-text\">{{unreadMessagesTotalByParticipant(user)}}</span>\n\t\t\t</div>\n\t\t</li>\n\t</ul>\n</div>", styles: ["#ng-chat-people{position:relative;width:240px;height:360px;border-width:1px;border-style:solid;margin-right:20px;box-shadow:0 4px 8px #00000040;border-bottom:0;border-radius:10px!important;box-sizing:border-box!important;overflow:hidden!important;margin-bottom:10px!important;border:1px solid grey!important}#ng-chat-people.ng-chat-people-collapsed{height:30px}#ng-chat-search_friend{display:block;padding:7px 10px;margin:10px auto 0;width:calc(100% - 20px);font-size:.9em;border-radius:20px!important;border:.5px solid grey!important}#ng-chat-users{padding:0 10px;list-style:none;margin:0;overflow:auto;position:absolute;top:42px;bottom:0;width:100%;box-sizing:border-box}#ng-chat-users.offset-search{top:84px}#ng-chat-users .ng-chat-users-checkbox{float:left;margin-right:5px;margin-top:8px}#ng-chat-users li{clear:both;margin-bottom:10px;overflow:hidden;cursor:pointer;max-height:30px}#ng-chat-users li>.ng-chat-friends-list-selectable-offset{margin-left:22px}#ng-chat-users li .ng-chat-friends-list-container{display:inline-block;width:100%}#ng-chat-users li>.ng-chat-friends-list-selectable-offset.ng-chat-friends-list-container{display:block;width:auto}#ng-chat-users li .ng-chat-friends-list-container>img.avatar,#ng-chat-users li .ng-chat-friends-list-container>.user{float:left;display:flex;justify-content:center;margin-right:5px}#ng-chat-users li .ng-chat-friends-list-container>.user{overflow:hidden;width:30px;height:30px}#ng-chat-users li .ng-chat-friends-list-container>.user>i{color:#fff;transform:scale(.7)}#ng-chat-users li .ng-chat-friends-list-container>strong{float:left;line-height:30px;font-size:.8em;max-width:57%;max-height:30px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#ng-chat-users li .ng-chat-friends-list-container>.ng-chat-participant-status{float:right}.ng-chat-people-actions{position:absolute;top:4px;right:5px;margin:0;padding:0;z-index:2}.ng-chat-people-actions>a.ng-chat-people-action{display:inline-block;width:21px;height:21px;margin-right:8px;text-decoration:none;border:none;border-radius:25px;padding:1px}@media only screen and (max-width: 581px){#ng-chat-people{width:300px;height:360px;margin-right:0}}.user{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background-color:#00b04c;color:#fff;font-size:12px;font-family:inherit}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { participants: [{
+                type: Input
+            }], participantsResponse: [{
+                type: Input
+            }], participantsInteractedWith: [{
+                type: Input
+            }], windows: [{
+                type: Input
+            }], userId: [{
+                type: Input
+            }], localization: [{
+                type: Input
+            }], shouldDisplay: [{
+                type: Input
+            }], isCollapsed: [{
+                type: Input
+            }], searchEnabled: [{
+                type: Input
+            }], currentActiveOption: [{
+                type: Input
+            }], onParticipantClicked: [{
+                type: Output
+            }], onOptionPromptCanceled: [{
+                type: Output
+            }], onOptionPromptConfirmed: [{
+                type: Output
+            }], hideFriendsList: [{
+                type: Input
+            }], onCloseWindowClick: [{
+                type: Output
+            }], searchInputChanged: [{
+                type: Output
+            }] } });
+
+class Message {
+    constructor() {
+        this.type = MessageType.Text;
+    }
+}
+
+let emojiDictionary = [
+    { patterns: [':)', ':-)', '=)'], unicode: '😃' },
+    { patterns: [':D', ':-D', '=D'], unicode: '😀' },
+    { patterns: [':(', ':-(', '=('], unicode: '🙁' },
+    { patterns: [':|', ':-|', '=|'], unicode: '😐' },
+    { patterns: [':*', ':-*', '=*'], unicode: '😙' },
+    { patterns: ['T_T', 'T.T'], unicode: '😭' },
+    { patterns: [':O', ':-O', '=O', ':o', ':-o', '=o'], unicode: '😮' },
+    { patterns: [':P', ':-P', '=P', ':p', ':-p', '=p'], unicode: '😋' },
+    { patterns: ['>.<'], unicode: '😣' },
+    { patterns: ['@.@'], unicode: '😵' },
+    { patterns: ['*.*'], unicode: '😍' },
+    { patterns: ['<3'], unicode: '❤️' },
+    { patterns: ['^.^'], unicode: '😊' },
+    { patterns: [':+1'], unicode: '👍' },
+    { patterns: [':-1'], unicode: '👎' }
+];
+/*
+ * Transforms common emoji text to UTF encoded emojis
+*/
+class EmojifyPipe {
+    transform(message, pipeEnabled) {
+        if (pipeEnabled && message && message.length > 1) {
+            emojiDictionary.forEach(emoji => {
+                emoji.patterns.forEach(pattern => {
+                    message = message.replace(pattern, emoji.unicode);
+                });
+            });
+        }
+        return message;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EmojifyPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: EmojifyPipe, isStandalone: false, name: "emojify" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: EmojifyPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'emojify', standalone: false }]
+        }] });
+
+/*
+ * Transforms text containing URLs or E-mails to valid links/mailtos
+*/
+class LinkfyPipe {
+    transform(message, pipeEnabled) {
+        if (pipeEnabled && message && message.length > 1) {
+            let replacedText;
+            let replacePatternProtocol;
+            let replacePatternWWW;
+            let replacePatternMailTo;
+            // URLs starting with http://, https://, or ftp://
+            replacePatternProtocol = /(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;
+            replacedText = message.replace(replacePatternProtocol, '<a href="$1" target="_blank">$1</a>');
+            // URLs starting with "www." (ignoring // before it).
+            replacePatternWWW = /(^|[^\/])(www\.[\S]+(\b|$))/gim;
+            replacedText = replacedText.replace(replacePatternWWW, '$1<a href="http://$2" target="_blank">$2</a>');
+            // Change email addresses to mailto:: links.
+            replacePatternMailTo = /(([a-zA-Z0-9\-\_\.])+@[a-zA-Z\_]+?(\.[a-zA-Z]{2,6})+)/gim;
+            replacedText = replacedText.replace(replacePatternMailTo, '<a href="mailto:$1">$1</a>');
+            return replacedText;
+        }
+        else
+            return message;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LinkfyPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: LinkfyPipe, isStandalone: false, name: "linkfy" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LinkfyPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'linkfy', standalone: false }]
+        }] });
+
+/*
+ * Renders the display name of a participant in a group based on who's sent the message
+*/
+class GroupMessageDisplayNamePipe {
+    transform(participant, message) {
+        if (participant && participant.participantType == ChatParticipantType.Group) {
+            let group = participant;
+            let userIndex = group.chattingTo.findIndex(x => x.id == message.fromId);
+            return group.chattingTo[userIndex >= 0 ? userIndex : 0].displayName;
+        }
+        else
+            return "";
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: GroupMessageDisplayNamePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: GroupMessageDisplayNamePipe, isStandalone: false, name: "groupMessageDisplayName" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: GroupMessageDisplayNamePipe, decorators: [{
+            type: Pipe,
+            args: [{ name: 'groupMessageDisplayName', standalone: false }]
+        }] });
+
+/* eslint-disable */
+class NgChatWindowComponent {
+    constructor() {
+        this.emojisEnabled = true;
+        this.linkfyEnabled = true;
+        this.showMessageDate = true;
+        this.messageDatePipeFormat = "short";
+        this.hasPagedHistory = true;
+        this.onChatWindowClosed = new EventEmitter();
+        this.onMessagesSeen = new EventEmitter();
+        this.onMessageSent = new EventEmitter();
+        this.onTabTriggered = new EventEmitter();
+        this.onOptionTriggered = new EventEmitter();
+        this.onLoadHistoryTriggered = new EventEmitter();
+        // File upload state
+        this.fileUploadersInUse = []; // Id bucket of uploaders in use
+        // Exposes enums and functions for the ng-template
+        this.ChatParticipantType = ChatParticipantType;
+        this.ChatParticipantStatus = ChatParticipantStatus;
+        this.MessageType = MessageType;
+        this.chatParticipantStatusDescriptor = chatParticipantStatusDescriptor;
+    }
+    defaultWindowOptions(currentWindow) {
+        if (this.showOptions && currentWindow.participant.participantType == ChatParticipantType.User) {
+            return [{
+                    isActive: false,
+                    chattingTo: currentWindow,
+                    validateContext: (participant) => {
+                        return participant.participantType == ChatParticipantType.User;
+                    },
+                    displayLabel: 'Add People' // TODO: Localize this
+                }];
+        }
+        return [];
+    }
+    // Asserts if a user avatar is visible in a chat cluster
+    isAvatarVisible(window, message, index) {
+        if (message.fromId != this.userId) {
+            if (index == 0) {
+                return true; // First message, good to show the thumbnail
+            }
+            else {
+                // Check if the previous message belongs to the same user, if it belongs there is no need to show the avatar again to form the message cluster
+                if (window.messages[index - 1].fromId != message.fromId) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
+    getChatWindowAvatar(participant, message) {
+        if (participant.participantType == ChatParticipantType.User) {
+            return participant.avatar;
+        }
+        else if (participant.participantType == ChatParticipantType.Group) {
+            let group = participant;
+            let userIndex = group.chattingTo.findIndex(x => x.id == message.fromId);
+            return group.chattingTo[userIndex >= 0 ? userIndex : 0].avatar;
+        }
+        return null;
+    }
+    isUploadingFile(window) {
+        const fileUploadInstanceId = this.getUniqueFileUploadInstanceId(window);
+        return this.fileUploadersInUse.indexOf(fileUploadInstanceId) > -1;
+    }
+    // Generates a unique file uploader id for each participant
+    getUniqueFileUploadInstanceId(window) {
+        if (window && window.participant) {
+            return `ng-chat-file-upload-${window.participant.id}`;
+        }
+        return 'ng-chat-file-upload';
+    }
+    unreadMessagesTotal(window) {
+        return MessageCounter.unreadMessagesTotal(window, this.userId);
+    }
+    // Scrolls a chat window message flow to the bottom
+    scrollChatWindow(window, direction) {
+        if (!window.isCollapsed) {
+            setTimeout(() => {
+                if (this.chatMessages) {
+                    let element = this.chatMessages.nativeElement;
+                    let position = (direction === ScrollDirection.Top) ? 0 : element.scrollHeight;
+                    element.scrollTop = position;
+                }
+            });
+        }
+    }
+    activeOptionTrackerChange(option) {
+        this.onOptionTriggered.emit(option);
+    }
+    // Triggers native file upload for file selection from the user
+    triggerNativeFileUpload(window) {
+        if (window) {
+            if (this.nativeFileInput)
+                this.nativeFileInput.nativeElement.click();
+        }
+    }
+    // Toggles a window focus on the focus/blur of a 'newMessage' input
+    toggleWindowFocus(window) {
+        window.hasFocus = !window.hasFocus;
+        if (window.hasFocus) {
+            const unreadMessages = window.messages
+                .filter(message => message.dateSeen == null
+                && (message.toId == this.userId || window.participant.participantType === ChatParticipantType.Group));
+            if (unreadMessages && unreadMessages.length > 0) {
+                this.onMessagesSeen.emit(unreadMessages);
+            }
+        }
+    }
+    markMessagesAsRead(messages) {
+        this.onMessagesSeen.emit(messages);
+    }
+    fetchMessageHistory(window) {
+        this.onLoadHistoryTriggered.emit(window);
+    }
+    // Closes a chat window via the close 'X' button
+    onCloseChatWindow() {
+        this.onChatWindowClosed.emit({ closedWindow: this.window, closedViaEscapeKey: false });
+    }
+    /*  Monitors pressed keys on a chat window
+        - Dispatches a message when the ENTER key is pressed
+        - Tabs between windows on TAB or SHIFT + TAB
+        - Closes the current focused window on ESC
+    */
+    onChatInputTyped(event, window) {
+        switch (event.keyCode) {
+            case 13:
+                if (window.newMessage && window.newMessage.trim() != "") {
+                    let message = new Message();
+                    message.fromId = this.userId;
+                    message.toId = window.participant.id;
+                    message.message = window.newMessage;
+                    message.dateSent = new Date();
+                    window.messages.push(message);
+                    this.onMessageSent.emit(message);
+                    window.newMessage = ""; // Resets the new message input
+                    this.scrollChatWindow(window, ScrollDirection.Bottom);
+                }
+                break;
+            case 9:
+                event.preventDefault();
+                this.onTabTriggered.emit({ triggeringWindow: window, shiftKeyPressed: event.shiftKey });
+                break;
+            case 27:
+                this.onChatWindowClosed.emit({ closedWindow: window, closedViaEscapeKey: true });
+                break;
+        }
+    }
+    // Toggles a chat window visibility between maximized/minimized
+    onChatWindowClicked(window) {
+        window.isCollapsed = !window.isCollapsed;
+        this.scrollChatWindow(window, ScrollDirection.Bottom);
+    }
+    clearInUseFileUploader(fileUploadInstanceId) {
+        const uploaderInstanceIdIndex = this.fileUploadersInUse.indexOf(fileUploadInstanceId);
+        if (uploaderInstanceIdIndex > -1) {
+            this.fileUploadersInUse.splice(uploaderInstanceIdIndex, 1);
+        }
+    }
+    // Handles file selection and uploads the selected file using the file upload adapter
+    onFileChosen(window) {
+        const fileUploadInstanceId = this.getUniqueFileUploadInstanceId(window);
+        const uploadElementRef = this.nativeFileInput;
+        if (uploadElementRef) {
+            const file = uploadElementRef.nativeElement.files[0];
+            this.fileUploadersInUse.push(fileUploadInstanceId);
+            this.fileUploadAdapter.uploadFile(file, window.participant.id)
+                .subscribe(fileMessage => {
+                this.clearInUseFileUploader(fileUploadInstanceId);
+                fileMessage.fromId = this.userId;
+                // Push file message to current user window
+                window.messages.push(fileMessage);
+                this.onMessageSent.emit(fileMessage);
+                this.scrollChatWindow(window, ScrollDirection.Bottom);
+                // Resets the file upload element
+                uploadElementRef.nativeElement.value = '';
+            }, (error) => {
+                this.clearInUseFileUploader(fileUploadInstanceId);
+                // Resets the file upload element
+                uploadElementRef.nativeElement.value = '';
+                // TODO: Invoke a file upload adapter error here
+            });
+        }
+    }
+    getParticipantTooltip(participant) {
+        const { metadata, displayName } = participant;
+        if (!metadata)
+            return displayName;
+        const { primary, secondary, tertiary } = metadata;
+        const parts = [primary, secondary, tertiary].filter(Boolean);
+        return parts.length > 0 ? parts.join(' | ') : displayName;
+    }
+    getMetadataDisplay(participant) {
+        if (!participant.metadata || !participant.showMetadataInTitle) {
+            return '';
+        }
+        const parts = [];
+        if (participant.showMetadataInTitle.primary && participant.metadata.primary) {
+            parts.push(participant.metadata.primary);
+        }
+        if (participant.showMetadataInTitle.secondary && participant.metadata.secondary) {
+            parts.push(participant.metadata.secondary);
+        }
+        if (participant.showMetadataInTitle.tertiary && participant.metadata.tertiary) {
+            parts.push(participant.metadata.tertiary);
+        }
+        return parts.join(' | ');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChatWindowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: NgChatWindowComponent, isStandalone: false, selector: "ng-chat-window", inputs: { fileUploadAdapter: "fileUploadAdapter", window: "window", userId: "userId", localization: "localization", showOptions: "showOptions", emojisEnabled: "emojisEnabled", linkfyEnabled: "linkfyEnabled", showMessageDate: "showMessageDate", messageDatePipeFormat: "messageDatePipeFormat", hasPagedHistory: "hasPagedHistory" }, outputs: { onChatWindowClosed: "onChatWindowClosed", onMessagesSeen: "onMessagesSeen", onMessageSent: "onMessageSent", onTabTriggered: "onTabTriggered", onOptionTriggered: "onOptionTriggered", onLoadHistoryTriggered: "onLoadHistoryTriggered" }, viewQueries: [{ propertyName: "chatMessages", first: true, predicate: ["chatMessages"], descendants: true }, { propertyName: "nativeFileInput", first: true, predicate: ["nativeFileInput"], descendants: true }, { propertyName: "chatWindowInput", first: true, predicate: ["chatWindowInput"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"window && window.isCollapsed\">\n\t<div class=\"ng-chat-title secondary-background\">\n\t\t<div class=\"ng-chat-title-visibility-toggle-area\" (click)=\"onChatWindowClicked(window)\">\n\t\t\t<strong [matTooltip]=\"getParticipantTooltip(window.participant)\">\n\t\t\t\t{{window.participant.displayName}} <span *ngIf=\"getMetadataDisplay(window.participant)\">({{ getMetadataDisplay(window.participant) }})</span>\n\t\t\t</strong>\n\t\t\t<span [ngClass]=\"{'ng-chat-participant-status': true, 'online': window.participant.status === ChatParticipantStatus.Online, 'busy': window.participant.status === ChatParticipantStatus.Busy, 'away': window.participant.status === ChatParticipantStatus.Away, 'offline': window.participant.status === ChatParticipantStatus.Offline}\" [matTooltip]=\"chatParticipantStatusDescriptor(window.participant.status, localization)\"></span>\n\t\t\t<span *ngIf=\"unreadMessagesTotal(window).length > 0\" class=\"ng-chat-unread-messages-count unread-messages-counter-container primary-text\">{{unreadMessagesTotal(window)}}</span>\n\t\t</div>\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-close primary-text\" (click)=\"onCloseChatWindow()\">&#x2715;</a>\n\t</div>\n</ng-container>\n<ng-container *ngIf=\"window && !window.isCollapsed\">  \n\t<div class=\"ng-chat-title secondary-background\">\n\t\t<div class=\"ng-chat-title-visibility-toggle-area\" (click)=\"onChatWindowClicked(window)\">\n\t\t\t<strong [matTooltip]=\"getParticipantTooltip(window.participant)\">\n\t\t\t\t{{window.participant.displayName}} <span *ngIf=\"getMetadataDisplay(window.participant)\">({{ getMetadataDisplay(window.participant) }})</span>\n\t\t\t</strong>\n\t\t\t<span [ngClass]=\"{'ng-chat-participant-status': true, 'online': window.participant.status === ChatParticipantStatus.Online, 'busy': window.participant.status === ChatParticipantStatus.Busy, 'away': window.participant.status === ChatParticipantStatus.Away, 'offline': window.participant.status === ChatParticipantStatus.Offline}\" [matTooltip]=\"chatParticipantStatusDescriptor(window.participant.status, localization)\"></span>\n\t\t\t<span *ngIf=\"unreadMessagesTotal(window).length > 0\" class=\"ng-chat-unread-messages-count unread-messages-counter-container primary-text\">{{unreadMessagesTotal(window)}}</span>\n\t\t</div>\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-close primary-text\" (click)=\"onCloseChatWindow()\">&#x2715;</a>\n\t\t<!-- <ng-chat-options [ngClass]=\"'ng-chat-options-container'\" [options]=\"defaultWindowOptions(window)\" (activeOptionTrackerChange)=\"activeOptionTrackerChange($event)\"></ng-chat-options> -->\n\t</div>\n\t\t<div #chatMessages class=\"ng-chat-messages primary-background\">\n\t\t\t<div *ngIf=\"window.isLoadingHistory\" class=\"ng-chat-loading-wrapper\">\n\t\t\t\t<div class=\"loader\">Loading history...</div>\n\t\t\t</div>\n\t\t\t<div *ngIf=\"hasPagedHistory && window.hasMoreMessages && !window.isLoadingHistory\" class=\"ng-chat-load-history\">\n\t\t\t\t<a class=\"load-history-action\" (click)=\"fetchMessageHistory(window)\">{{localization.loadMessageHistoryPlaceholder}}</a>\n\t\t\t</div>\n\n\t\t\t<div *ngFor=\"let message of window.messages; let i = index\" [ngClass]=\"{'ng-chat-message': true, 'ng-chat-message-received': message.fromId !== userId}\">\n\t\t\t\t<ng-container *ngIf=\"isAvatarVisible(window, message, i)\">\n\t\t\t\t\t<div *ngIf=\"!getChatWindowAvatar(window.participant, message)\" class=\"icon-wrapper\">\n\t\t\t\t\t\t<i class=\"user-icon\"></i>\n\t\t\t\t\t</div>\n\t\t\t\t\t<!-- <img *ngIf=\"getChatWindowAvatar(window.participant, message)\" alt=\"\" class=\"avatar\" height=\"30\" width=\"30\" [src]=\"getChatWindowAvatar(window.participant, message) | sanitize\" /> -->\n\t\t\t\t\t<span *ngIf=\"window.participant.participantType === ChatParticipantType.Group\" class=\"ng-chat-participant-name\">{{window.participant | groupMessageDisplayName:message}}</span>\n\t\t\t\t</ng-container>\n\t\t\t\t<ng-container [ngSwitch]=\"message.type\">\n\t\t\t\t\t<div *ngSwitchCase=\"MessageType.Text\" [ngClass]=\"{'sent-chat-message-container': message.fromId === userId, 'received-chat-message-container': message.fromId !== userId}\">\n\t\t\t  \t\t\t<span [innerHtml]=\"message.message | emojify:emojisEnabled | linkfy:linkfyEnabled\"></span>\n\t\t\t\t\t\t<span *ngIf=\"showMessageDate && message.dateSent\" class=\"message-sent-date\">{{message.dateSent | date:'dd'}}/{{message.dateSent | date:'MM'}}/{{message.dateSent | date:'y'}} {{message.dateSent | date:'h:mm a '}}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div *ngSwitchCase=\"MessageType.Image\" [ngClass]=\"{'sent-chat-message-container': message.fromId === userId, 'received-chat-message-container': message.fromId !== userId}\">\n\t\n\t\t\t  \t\t\t<img src=\"{{message.message}}\" class=\"image-message\" />\n\t\n\t\t\t\t\t\t<span *ngIf=\"showMessageDate && message.dateSent\" class=\"message-sent-date\">{{message.dateSent | date:'dd'}}/{{message.dateSent | date:'MM'}}/{{message.dateSent | date:'y'}} {{message.dateSent | date:'h:mm a '}}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div *ngSwitchCase=\"MessageType.File\" [ngClass]=\"{'file-message-container': true, 'received': message.fromId !== userId}\">\n\t\t\t\t\t\t<div class=\"file-message-icon-container\">\n\t\t\t\t\t\t\t<i class=\"paperclip-icon\"></i>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<!-- <a class=\"file-details\" [attr.href]=\"message.downloadUrl\" target=\"_blank\" rel=\"noopener noreferrer\" (click)=\"this.markMessagesAsRead([message])\" download>\n\t\t\t\t\t\t\t<span class=\"file-message-title\" [attr.title]=\"message.message\">{{message.message}}</span>\n\t\t\t\t\t\t\t<span *ngIf=\"message.fileSizeInBytes\"  class=\"file-message-size\">{{message.fileSizeInBytes}} Bytes</span>\n\t\t\t\t\t\t</a> -->\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t</div>\n\n\t<div class=\"ng-chat-footer primary-outline-color primary-background\">\n\t\t<input #chatWindowInput\n\t\t\ttype=\"text\"\n\t\t\t[ngModel]=\"window.newMessage | emojify:emojisEnabled\"\n\t\t\t(ngModelChange)=\"window.newMessage=$event\"\n\t\t\t[placeholder]=\"localization.messagePlaceholder\"\n\t\t\t[ngClass]=\"{'chat-window-input': true, 'has-side-action': fileUploadAdapter}\"\n\t\t\t(keydown)=\"onChatInputTyped($event, window)\"\n\t\t\t(blur)=\"toggleWindowFocus(window)\"\n\t\t\t(focus)=\"toggleWindowFocus(window)\"/>\n\n\t\t<!-- File Upload -->\n\t\t<ng-container *ngIf=\"fileUploadAdapter\">\n\t\t\t<a *ngIf=\"!isUploadingFile(window)\" class=\"btn-add-file\" (click)=\"triggerNativeFileUpload(window)\">\n\t\t\t\t<i class=\"upload-icon\"></i>\n\t\t\t</a>\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\t#nativeFileInput\n\t\t\t\tstyle=\"display: none;\"\n\t\t\t\t[attr.id]=\"getUniqueFileUploadInstanceId(window)\"\n\t\t\t\t(change)=\"onFileChosen(window)\" />\n\t\t\t<div *ngIf=\"isUploadingFile(window)\" class=\"loader\"></div>\n\t\t</ng-container>\n\t</div>\n</ng-container>", styles: [".ng-chat-window{right:260px;height:360px;z-index:999;bottom:0;width:300px;position:fixed;border-width:1px;border-style:solid;border-bottom:0;box-shadow:0 4px 8px #00000040;margin-bottom:10px!important;border:1px solid grey!important;border-radius:10px!important;box-sizing:border-box!important;overflow:hidden!important;background-color:#fff}.ng-chat-window ::-webkit-scrollbar{width:8px!important}.ng-chat-window ::-webkit-scrollbar-thumb{background:#1b1b70!important;border-radius:5px!important}.ng-chat-window-collapsed{height:30px!important}.ng-chat-window .ng-chat-footer{box-sizing:border-box!important;padding-bottom:10px!important;display:block;height:10%;width:95%!important;margin:auto!important;background-color:inherit!important}.ng-chat-window .ng-chat-footer>input{font-size:.8em;box-sizing:border-box!important;padding:15px!important;height:100%;width:100%;border-radius:20px!important;border:1px solid grey!important}.ng-chat-window .ng-chat-footer>input.has-side-action{width:calc(100% - 30px)}.ng-chat-window .ng-chat-footer .btn-add-file{position:absolute;right:5px;bottom:7px;height:20px;width:20px;cursor:pointer}.ng-chat-window .ng-chat-footer .loader{position:absolute;right:14px;bottom:8px}.ng-chat-window .ng-chat-load-history{height:30px;text-align:center;font-size:.8em}.ng-chat-window .ng-chat-load-history>a{border-radius:15px;cursor:pointer;padding:5px 10px}.ng-chat-window .ng-chat-messages{padding:10px;width:100%;height:calc(90% - 30px);box-sizing:border-box;position:relative;overflow:auto}.ng-chat-window .ng-chat-messages .ng-chat-message{clear:both}.ng-chat-window .ng-chat-messages .ng-chat-message>img.avatar,.ng-chat-window .ng-chat-messages .ng-chat-message>.icon-wrapper{position:absolute;left:10px;border-radius:25px}.ng-chat-window .ng-chat-messages .ng-chat-message .ng-chat-participant-name{display:inline-block;margin-left:40px;padding-bottom:5px;font-weight:700;font-size:.8em;text-overflow:ellipsis;max-width:180px}.ng-chat-window .ng-chat-messages .ng-chat-message>.icon-wrapper{background-color:#bababa;overflow:hidden;width:30px;height:30px;padding:0}.ng-chat-window .ng-chat-messages .ng-chat-message>.icon-wrapper>i{color:#fff;transform:scale(.7)}.ng-chat-window .ng-chat-messages .ng-chat-message .message-sent-date{font-size:.5em!important;display:block;text-align:right;margin-top:5px;color:#a1a0a0!important;font-style:italic!important}.ng-chat-window .ng-chat-messages .ng-chat-message>div{float:right;width:182px;border-radius:15px 15px 0!important;padding:10px;margin-top:0;margin-bottom:5px;font-size:.9em;word-wrap:break-word;background-color:#93d4f0!important}.ng-chat-window .ng-chat-message-received>div.received-chat-message-container{float:left;margin-left:40px;padding-top:7px;padding-bottom:7px;margin-top:0;margin-bottom:5px;background-color:#daf2fc!important;border-radius:15px 15px 15px 0!important}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container{float:right;width:202px;border-style:solid;border-width:3px;border-radius:5px;overflow:hidden;margin-bottom:5px;display:block;text-decoration:none;font-size:.9em;padding:0;box-sizing:border-box}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container.received{float:left;margin-left:40px;width:208px}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-message-icon-container{width:20px;height:35px;padding:10px 5px;float:left}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-message-icon-container i{margin-top:8px}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details{float:left;padding:10px;width:calc(100% - 60px);color:currentColor;text-decoration:none}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details:hover{text-decoration:underline}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details span{display:block;width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details .file-message-title{font-weight:700}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details .file-message-size{font-size:.8em;margin-top:5px}.ng-chat-window .image-message{width:100%;height:auto}@media only screen and (max-width: 581px){.ng-chat-window{position:initial}}\n"], dependencies: [{ 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.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: EmojifyPipe, name: "emojify" }, { kind: "pipe", type: LinkfyPipe, name: "linkfy" }, { kind: "pipe", type: GroupMessageDisplayNamePipe, name: "groupMessageDisplayName" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChatWindowComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng-chat-window', encapsulation: ViewEncapsulation.None, standalone: false, template: "<ng-container *ngIf=\"window && window.isCollapsed\">\n\t<div class=\"ng-chat-title secondary-background\">\n\t\t<div class=\"ng-chat-title-visibility-toggle-area\" (click)=\"onChatWindowClicked(window)\">\n\t\t\t<strong [matTooltip]=\"getParticipantTooltip(window.participant)\">\n\t\t\t\t{{window.participant.displayName}} <span *ngIf=\"getMetadataDisplay(window.participant)\">({{ getMetadataDisplay(window.participant) }})</span>\n\t\t\t</strong>\n\t\t\t<span [ngClass]=\"{'ng-chat-participant-status': true, 'online': window.participant.status === ChatParticipantStatus.Online, 'busy': window.participant.status === ChatParticipantStatus.Busy, 'away': window.participant.status === ChatParticipantStatus.Away, 'offline': window.participant.status === ChatParticipantStatus.Offline}\" [matTooltip]=\"chatParticipantStatusDescriptor(window.participant.status, localization)\"></span>\n\t\t\t<span *ngIf=\"unreadMessagesTotal(window).length > 0\" class=\"ng-chat-unread-messages-count unread-messages-counter-container primary-text\">{{unreadMessagesTotal(window)}}</span>\n\t\t</div>\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-close primary-text\" (click)=\"onCloseChatWindow()\">&#x2715;</a>\n\t</div>\n</ng-container>\n<ng-container *ngIf=\"window && !window.isCollapsed\">  \n\t<div class=\"ng-chat-title secondary-background\">\n\t\t<div class=\"ng-chat-title-visibility-toggle-area\" (click)=\"onChatWindowClicked(window)\">\n\t\t\t<strong [matTooltip]=\"getParticipantTooltip(window.participant)\">\n\t\t\t\t{{window.participant.displayName}} <span *ngIf=\"getMetadataDisplay(window.participant)\">({{ getMetadataDisplay(window.participant) }})</span>\n\t\t\t</strong>\n\t\t\t<span [ngClass]=\"{'ng-chat-participant-status': true, 'online': window.participant.status === ChatParticipantStatus.Online, 'busy': window.participant.status === ChatParticipantStatus.Busy, 'away': window.participant.status === ChatParticipantStatus.Away, 'offline': window.participant.status === ChatParticipantStatus.Offline}\" [matTooltip]=\"chatParticipantStatusDescriptor(window.participant.status, localization)\"></span>\n\t\t\t<span *ngIf=\"unreadMessagesTotal(window).length > 0\" class=\"ng-chat-unread-messages-count unread-messages-counter-container primary-text\">{{unreadMessagesTotal(window)}}</span>\n\t\t</div>\n\t\t<a href=\"javascript:void(0);\" class=\"ng-chat-close primary-text\" (click)=\"onCloseChatWindow()\">&#x2715;</a>\n\t\t<!-- <ng-chat-options [ngClass]=\"'ng-chat-options-container'\" [options]=\"defaultWindowOptions(window)\" (activeOptionTrackerChange)=\"activeOptionTrackerChange($event)\"></ng-chat-options> -->\n\t</div>\n\t\t<div #chatMessages class=\"ng-chat-messages primary-background\">\n\t\t\t<div *ngIf=\"window.isLoadingHistory\" class=\"ng-chat-loading-wrapper\">\n\t\t\t\t<div class=\"loader\">Loading history...</div>\n\t\t\t</div>\n\t\t\t<div *ngIf=\"hasPagedHistory && window.hasMoreMessages && !window.isLoadingHistory\" class=\"ng-chat-load-history\">\n\t\t\t\t<a class=\"load-history-action\" (click)=\"fetchMessageHistory(window)\">{{localization.loadMessageHistoryPlaceholder}}</a>\n\t\t\t</div>\n\n\t\t\t<div *ngFor=\"let message of window.messages; let i = index\" [ngClass]=\"{'ng-chat-message': true, 'ng-chat-message-received': message.fromId !== userId}\">\n\t\t\t\t<ng-container *ngIf=\"isAvatarVisible(window, message, i)\">\n\t\t\t\t\t<div *ngIf=\"!getChatWindowAvatar(window.participant, message)\" class=\"icon-wrapper\">\n\t\t\t\t\t\t<i class=\"user-icon\"></i>\n\t\t\t\t\t</div>\n\t\t\t\t\t<!-- <img *ngIf=\"getChatWindowAvatar(window.participant, message)\" alt=\"\" class=\"avatar\" height=\"30\" width=\"30\" [src]=\"getChatWindowAvatar(window.participant, message) | sanitize\" /> -->\n\t\t\t\t\t<span *ngIf=\"window.participant.participantType === ChatParticipantType.Group\" class=\"ng-chat-participant-name\">{{window.participant | groupMessageDisplayName:message}}</span>\n\t\t\t\t</ng-container>\n\t\t\t\t<ng-container [ngSwitch]=\"message.type\">\n\t\t\t\t\t<div *ngSwitchCase=\"MessageType.Text\" [ngClass]=\"{'sent-chat-message-container': message.fromId === userId, 'received-chat-message-container': message.fromId !== userId}\">\n\t\t\t  \t\t\t<span [innerHtml]=\"message.message | emojify:emojisEnabled | linkfy:linkfyEnabled\"></span>\n\t\t\t\t\t\t<span *ngIf=\"showMessageDate && message.dateSent\" class=\"message-sent-date\">{{message.dateSent | date:'dd'}}/{{message.dateSent | date:'MM'}}/{{message.dateSent | date:'y'}} {{message.dateSent | date:'h:mm a '}}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div *ngSwitchCase=\"MessageType.Image\" [ngClass]=\"{'sent-chat-message-container': message.fromId === userId, 'received-chat-message-container': message.fromId !== userId}\">\n\t\n\t\t\t  \t\t\t<img src=\"{{message.message}}\" class=\"image-message\" />\n\t\n\t\t\t\t\t\t<span *ngIf=\"showMessageDate && message.dateSent\" class=\"message-sent-date\">{{message.dateSent | date:'dd'}}/{{message.dateSent | date:'MM'}}/{{message.dateSent | date:'y'}} {{message.dateSent | date:'h:mm a '}}</span>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div *ngSwitchCase=\"MessageType.File\" [ngClass]=\"{'file-message-container': true, 'received': message.fromId !== userId}\">\n\t\t\t\t\t\t<div class=\"file-message-icon-container\">\n\t\t\t\t\t\t\t<i class=\"paperclip-icon\"></i>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<!-- <a class=\"file-details\" [attr.href]=\"message.downloadUrl\" target=\"_blank\" rel=\"noopener noreferrer\" (click)=\"this.markMessagesAsRead([message])\" download>\n\t\t\t\t\t\t\t<span class=\"file-message-title\" [attr.title]=\"message.message\">{{message.message}}</span>\n\t\t\t\t\t\t\t<span *ngIf=\"message.fileSizeInBytes\"  class=\"file-message-size\">{{message.fileSizeInBytes}} Bytes</span>\n\t\t\t\t\t\t</a> -->\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t</div>\n\n\t<div class=\"ng-chat-footer primary-outline-color primary-background\">\n\t\t<input #chatWindowInput\n\t\t\ttype=\"text\"\n\t\t\t[ngModel]=\"window.newMessage | emojify:emojisEnabled\"\n\t\t\t(ngModelChange)=\"window.newMessage=$event\"\n\t\t\t[placeholder]=\"localization.messagePlaceholder\"\n\t\t\t[ngClass]=\"{'chat-window-input': true, 'has-side-action': fileUploadAdapter}\"\n\t\t\t(keydown)=\"onChatInputTyped($event, window)\"\n\t\t\t(blur)=\"toggleWindowFocus(window)\"\n\t\t\t(focus)=\"toggleWindowFocus(window)\"/>\n\n\t\t<!-- File Upload -->\n\t\t<ng-container *ngIf=\"fileUploadAdapter\">\n\t\t\t<a *ngIf=\"!isUploadingFile(window)\" class=\"btn-add-file\" (click)=\"triggerNativeFileUpload(window)\">\n\t\t\t\t<i class=\"upload-icon\"></i>\n\t\t\t</a>\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\t#nativeFileInput\n\t\t\t\tstyle=\"display: none;\"\n\t\t\t\t[attr.id]=\"getUniqueFileUploadInstanceId(window)\"\n\t\t\t\t(change)=\"onFileChosen(window)\" />\n\t\t\t<div *ngIf=\"isUploadingFile(window)\" class=\"loader\"></div>\n\t\t</ng-container>\n\t</div>\n</ng-container>", styles: [".ng-chat-window{right:260px;height:360px;z-index:999;bottom:0;width:300px;position:fixed;border-width:1px;border-style:solid;border-bottom:0;box-shadow:0 4px 8px #00000040;margin-bottom:10px!important;border:1px solid grey!important;border-radius:10px!important;box-sizing:border-box!important;overflow:hidden!important;background-color:#fff}.ng-chat-window ::-webkit-scrollbar{width:8px!important}.ng-chat-window ::-webkit-scrollbar-thumb{background:#1b1b70!important;border-radius:5px!important}.ng-chat-window-collapsed{height:30px!important}.ng-chat-window .ng-chat-footer{box-sizing:border-box!important;padding-bottom:10px!important;display:block;height:10%;width:95%!important;margin:auto!important;background-color:inherit!important}.ng-chat-window .ng-chat-footer>input{font-size:.8em;box-sizing:border-box!important;padding:15px!important;height:100%;width:100%;border-radius:20px!important;border:1px solid grey!important}.ng-chat-window .ng-chat-footer>input.has-side-action{width:calc(100% - 30px)}.ng-chat-window .ng-chat-footer .btn-add-file{position:absolute;right:5px;bottom:7px;height:20px;width:20px;cursor:pointer}.ng-chat-window .ng-chat-footer .loader{position:absolute;right:14px;bottom:8px}.ng-chat-window .ng-chat-load-history{height:30px;text-align:center;font-size:.8em}.ng-chat-window .ng-chat-load-history>a{border-radius:15px;cursor:pointer;padding:5px 10px}.ng-chat-window .ng-chat-messages{padding:10px;width:100%;height:calc(90% - 30px);box-sizing:border-box;position:relative;overflow:auto}.ng-chat-window .ng-chat-messages .ng-chat-message{clear:both}.ng-chat-window .ng-chat-messages .ng-chat-message>img.avatar,.ng-chat-window .ng-chat-messages .ng-chat-message>.icon-wrapper{position:absolute;left:10px;border-radius:25px}.ng-chat-window .ng-chat-messages .ng-chat-message .ng-chat-participant-name{display:inline-block;margin-left:40px;padding-bottom:5px;font-weight:700;font-size:.8em;text-overflow:ellipsis;max-width:180px}.ng-chat-window .ng-chat-messages .ng-chat-message>.icon-wrapper{background-color:#bababa;overflow:hidden;width:30px;height:30px;padding:0}.ng-chat-window .ng-chat-messages .ng-chat-message>.icon-wrapper>i{color:#fff;transform:scale(.7)}.ng-chat-window .ng-chat-messages .ng-chat-message .message-sent-date{font-size:.5em!important;display:block;text-align:right;margin-top:5px;color:#a1a0a0!important;font-style:italic!important}.ng-chat-window .ng-chat-messages .ng-chat-message>div{float:right;width:182px;border-radius:15px 15px 0!important;padding:10px;margin-top:0;margin-bottom:5px;font-size:.9em;word-wrap:break-word;background-color:#93d4f0!important}.ng-chat-window .ng-chat-message-received>div.received-chat-message-container{float:left;margin-left:40px;padding-top:7px;padding-bottom:7px;margin-top:0;margin-bottom:5px;background-color:#daf2fc!important;border-radius:15px 15px 15px 0!important}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container{float:right;width:202px;border-style:solid;border-width:3px;border-radius:5px;overflow:hidden;margin-bottom:5px;display:block;text-decoration:none;font-size:.9em;padding:0;box-sizing:border-box}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container.received{float:left;margin-left:40px;width:208px}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-message-icon-container{width:20px;height:35px;padding:10px 5px;float:left}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-message-icon-container i{margin-top:8px}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details{float:left;padding:10px;width:calc(100% - 60px);color:currentColor;text-decoration:none}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details:hover{text-decoration:underline}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details span{display:block;width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details .file-message-title{font-weight:700}.ng-chat-window .ng-chat-messages .ng-chat-message .file-message-container>.file-details .file-message-size{font-size:.8em;margin-top:5px}.ng-chat-window .image-message{width:100%;height:auto}@media only screen and (max-width: 581px){.ng-chat-window{position:initial}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { fileUploadAdapter: [{
+                type: Input
+            }], window: [{
+                type: Input
+            }], userId: [{
+                type: Input
+            }], localization: [{
+                type: Input
+            }], showOptions: [{
+                type: Input
+            }], emojisEnabled: [{
+                type: Input
+            }], linkfyEnabled: [{
+                type: Input
+            }], showMessageDate: [{
+                type: Input
+            }], messageDatePipeFormat: [{
+                type: Input
+            }], hasPagedHistory: [{
+                type: Input
+            }], onChatWindowClosed: [{
+                type: Output
+            }], onMessagesSeen: [{
+                type: Output
+            }], onMessageSent: [{
+                type: Output
+            }], onTabTriggered: [{
+                type: Output
+            }], onOptionTriggered: [{
+                type: Output
+            }], onLoadHistoryTriggered: [{
+                type: Output
+            }], chatMessages: [{
+                type: ViewChild,
+                args: ['chatMessages']
+            }], nativeFileInput: [{
+                type: ViewChild,
+                args: ['nativeFileInput']
+            }], chatWindowInput: [{
+                type: ViewChild,
+                args: ['chatWindowInput']
+            }] } });
+
+/* eslint-disable */
+class NgChat {
+    constructor(_httpClient) {
+        this._httpClient = _httpClient;
+        // Exposes enums for the ng-template
+        this.ChatParticipantType = ChatParticipantType;
+        this.ChatParticipantStatus = ChatParticipantStatus;
+        this.MessageType = MessageType;
+        this._isDisabled = false;
+        this.isCollapsed = false;
+        this.maximizeWindowOnNewMessage = true;
+        this.pollFriendsList = false;
+        this.pollingInterval = 5000;
+        this.historyEnabled = true;
+        this.emojisEnabled = true;
+        this.linkfyEnabled = true;
+        this.audioEnabled = true;
+        this.searchEnabled = true;
+        this.audioSource = '../../../assets/notification.wav';
+        this.persistWindowsState = true;
+        this.title = "Quick chat";
+        this.messagePlaceholder = "Type a message";
+        this.searchPlaceholder = "Search";
+        this.browserNotificationsEnabled = true;
+        this.browserNotificationIconSource = '../../../assets/notification.png';
+        this.browserNotificationTitle = "New message from";
+        this.historyPageSize = 10;
+        this.hideFriendsList = false;
+        this.hideFriendsListOnUnsupportedViewport = true;
+        this.theme = Theme.Light;
+        this.messageDatePipeFormat = "short";
+        this.showMessageDate = true;
+        this.isViewportOnMobileEnabled = false;
+        this.onParticipantClicked = new EventEmitter();
+        this.onParticipantChatOpened = new EventEmitter();
+        this.onParticipantChatClosed = new EventEmitter();
+        this.onMessagesSeen = new EventEmitter();
+        this.onCloseWindowClicked = new EventEmitter();
+        this.searchInputChanged = new EventEmitter();
+        this.browserNotificationsBootstrapped = false;
+        this.hasPagedHistory = false;
+        // Don't want to add this as a setting to simplify usage. Previous placeholder and title settings available to be used, or use full Localization object.
+        this.statusDescription = {
+            online: 'Online',
+            busy: 'Busy',
+            away: 'Away',
+            offline: 'Offline'
+        };
+        this.participantsInteractedWith = [];
+        // Defines the size of each opened window to calculate how many windows can be opened on the viewport at the same time.
+        this.windowSizeFactor = 320;
+        // Total width size of the friends list section
+        this.friendsListWidth = 262;
+        // Set to true if there is no space to display at least one chat window and 'hideFriendsListOnUnsupportedViewport' is true
+        this.unsupportedViewport = false;
+        this.windows = [];
+        this.isBootstrapped = false;
+    }
+    get isDisabled() {
+        return this._isDisabled;
+    }
+    set isDisabled(value) {
+        this._isDisabled = value;
+        if (value) {
+            window.clearInterval(this.pollingIntervalWindowInstance);
+        }
+        else {
+            this.activateFriendListFetch();
+        }
+    }
+    get localStorageKey() {
+        return `ng-chat-users-${this.userId}`; // Appending the user id so the state is unique per user in a computer.
+    }
+    ;
+    ngOnInit() {
+        this.bootstrapChat();
+    }
+    onResize(event) {
+        this.viewPortTotalArea = event.target.innerWidth;
+        this.NormalizeWindows();
+    }
+    // Checks if there are more opened windows than the view port can display
+    NormalizeWindows() {
+        const maxSupportedOpenedWindows = Math.floor((this.viewPortTotalArea - (!this.hideFriendsList ? this.friendsListWidth : 0)) / this.windowSizeFactor);
+        const difference = this.windows.length - maxSupportedOpenedWindows;
+        if (difference >= 0) {
+            this.windows.splice(this.windows.length - difference);
+        }
+        this.updateWindowsState(this.windows);
+        // Viewport should have space for at least one chat window but should show in mobile if option is enabled.
+        this.unsupportedViewport = this.isViewportOnMobileEnabled ? false : this.hideFriendsListOnUnsupportedViewport && maxSupportedOpenedWindows < 1;
+    }
+    // Initializes the chat plugin and the messaging adapter
+    bootstrapChat() {
+        let initializationException = null;
+        if (this.adapter != null && this.userId != null) {
+            try {
+                this.viewPortTotalArea = window.innerWidth;
+                this.initializeTheme();
+                this.initializeDefaultText();
+                this.initializeBrowserNotifications();
+                // Binding event listeners
+                this.adapter.messageReceivedHandler = (participant, msg) => this.onMessageReceived(participant, msg);
+                this.adapter.friendsListChangedHandler = (participantsResponse) => this.onFriendsListChanged(participantsResponse);
+                this.activateFriendListFetch();
+                this.bufferAudioFile();
+                this.hasPagedHistory = this.adapter instanceof PagedHistoryChatAdapter;
+                if (this.fileUploadUrl && this.fileUploadUrl !== "") {
+                    this.fileUploadAdapter = new DefaultFileUploadAdapter(this.fileUploadUrl, this._httpClient);
+                }
+                this.NormalizeWindows();
+                this.isBootstrapped = true;
+            }
+            catch (ex) {
+                initializationException = ex;
+            }
+        }
+        if (!this.isBootstrapped) {
+            console.error("ng-chat component couldn't be bootstrapped.");
+            if (this.userId == null) {
+                console.error("ng-chat can't be initialized without an user id. Please make sure you've provided an userId as a parameter of the ng-chat component.");
+            }
+            if (this.adapter == null) {
+                console.error("ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component.");
+            }
+            if (initializationException) {
+                console.error(`An exception has occurred while initializing ng-chat. Details: ${initializationException.message}`);
+                console.error(initializationException);
+            }
+        }
+    }
+    activateFriendListFetch() {
+        if (this.adapter) {
+            // Loading current users list
+            if (this.pollFriendsList) {
+                // Setting a long poll interval to update the friends list
+                this.fetchFriendsList(true);
+                this.pollingIntervalWindowInstance = window.setInterval(() => this.fetchFriendsList(false), this.pollingInterval);
+            }
+            else {
+                // Since polling was disabled, a friends list update mechanism will have to be implemented in the ChatAdapter.
+                this.fetchFriendsList(true);
+            }
+        }
+    }
+    // Initializes browser notifications
+    async initializeBrowserNotifications() {
+        if (this.browserNotificationsEnabled && ("Notification" in window)) {
+            if (await Notification.requestPermission() === "granted") {
+                this.browserNotificationsBootstrapped = true;
+            }
+        }
+    }
+    // Initializes default text
+    initializeDefaultText() {
+        if (!this.localization) {
+            this.localization = {
+                messagePlaceholder: this.messagePlaceholder,
+                searchPlaceholder: this.searchPlaceholder,
+                title: this.title,
+                statusDescription: this.statusDescription,
+                browserNotificationTitle: this.browserNotificationTitle,
+                loadMessageHistoryPlaceholder: "Load older messages"
+            };
+        }
+    }
+    initializeTheme() {
+        if (this.customTheme) {
+            this.theme = Theme.Custom;
+        }
+        else if (this.theme != Theme.Light && this.theme != Theme.Dark) {
+            // TODO: Use es2017 in future with Object.values(Theme).includes(this.theme) to do this check
+            throw new Error(`Invalid theme configuration for ng-chat. "${this.theme}" is not a valid theme value.`);
+        }
+    }
+    // Sends a request to load the friends list
+    fetchFriendsList(isBootstrapping) {
+        this.adapter.listFriends()
+            .pipe(map((participantsResponse) => {
+            this.participantsResponse = participantsResponse;
+            this.participants = participantsResponse.map((response) => {
+                return response.participant;
+            });
+        })).subscribe(() => {
+            if (isBootstrapping) {
+                this.restoreWindowsState();
+            }
+        });
+    }
+    fetchMessageHistory(window) {
+        // Not ideal but will keep this until we decide if we are shipping pagination with the default adapter
+        if (this.adapter instanceof PagedHistoryChatAdapter) {
+            window.isLoadingHistory = true;
+            this.adapter.getMessageHistoryByPage(window.participant.id, this.historyPageSize, ++window.historyPage)
+                .pipe(map((result) => {
+                result.forEach((message) => this.assertMessageType(message));
+                window.messages = result.concat(window.messages);
+                window.isLoadingHistory = false;
+                const direction = (window.historyPage == 1) ? ScrollDirection.Bottom : ScrollDirection.Top;
+                window.hasMoreMessages = result.length == this.historyPageSize;
+                setTimeout(() => this.onFetchMessageHistoryLoaded(result, window, direction, true));
+            })).subscribe();
+        }
+        else {
+            this.adapter.getMessageHistory(window.participant.id)
+                .pipe(map((result) => {
+                result.forEach((message) => this.assertMessageType(message));
+                window.messages = result.concat(window.messages);
+                window.isLoadingHistory = false;
+                setTimeout(() => this.onFetchMessageHistoryLoaded(result, window, ScrollDirection.Bottom));
+            })).subscribe();
+        }
+    }
+    onFetchMessageHistoryLoaded(messages, window, direction, forceMarkMessagesAsSeen = false) {
+        this.scrollChatWindow(window, direction);
+        if (window.hasFocus || forceMarkMessagesAsSeen) {
+            const unseenMessages = messages.filter(m => !m.dateSeen);
+            this.markMessagesAsRead(unseenMessages);
+        }
+    }
+    // Updates the friends list via the event handler
+    onFriendsListChanged(participantsResponse) {
+        if (participantsResponse) {
+            this.participantsResponse = participantsResponse;
+            this.participants = participantsResponse.map((response) => {
+                return response.participant;
+            });
+            this.participantsInteractedWith = [];
+        }
+    }
+    // Handles received messages by the adapter
+    onMessageReceived(participant, message) {
+        if (participant && message) {
+            const chatWindow = this.openChatWindow(participant);
+            this.assertMessageType(message);
+            if (!chatWindow[1] || !this.historyEnabled) {
+                chatWindow[0].messages.push(message);
+                this.scrollChatWindow(chatWindow[0], ScrollDirection.Bottom);
+                if (chatWindow[0].hasFocus) {
+                    this.markMessagesAsRead([message]);
+                }
+            }
+            this.emitMessageSound(chatWindow[0]);
+            // Do not push browser notifications with message content for privacy purposes if the 'maximizeWindowOnNewMessage' setting is off and this is a new chat window.
+            if (this.maximizeWindowOnNewMessage || (!chatWindow[1] && !chatWindow[0].isCollapsed)) {
+                // Some messages are not pushed because they are loaded by fetching the history hence why we supply the message here
+                this.emitBrowserNotification(chatWindow[0], message);
+            }
+        }
+    }
+    onParticipantClickedFromFriendsList(participant) {
+        this.openChatWindow(participant, true, true);
+    }
+    cancelOptionPrompt() {
+        if (this.currentActiveOption) {
+            this.currentActiveOption.isActive = false;
+            this.currentActiveOption = null;
+        }
+    }
+    onOptionPromptCanceled() {
+        this.cancelOptionPrompt();
+    }
+    onOptionPromptConfirmed(event) {
+        // For now this is fine as there is only one option available. Introduce option types and type checking if a new option is added.
+        this.confirmNewGroup(event);
+        // Canceling current state
+        this.cancelOptionPrompt();
+    }
+    confirmNewGroup(users) {
+        const newGroup = new Group(users);
+        this.openChatWindow(newGroup);
+        if (this.groupAdapter) {
+            this.groupAdapter.groupCreated(newGroup);
+        }
+    }
+    // Opens a new chat whindow. Takes care of available viewport
+    // Works for opening a chat window for an user or for a group
+    // Returns => [Window: Window object reference, boolean: Indicates if this window is a new chat window]
+    openChatWindow(participant, focusOnNewWindow = false, invokedByUserClick = false) {
+        // Is this window opened?
+        const openedWindow = this.windows.find(x => x.participant.id == participant.id);
+        if (!openedWindow) {
+            if (invokedByUserClick) {
+                this.onParticipantClicked.emit(participant);
+            }
+            // Refer to issue #58 on Github
+            const collapseWindow = invokedByUserClick ? false : !this.maximizeWindowOnNewMessage;
+            const newChatWindow = new Window(participant, this.historyEnabled, collapseWindow);
+            // Loads the chat history via an RxJs Observable
+            if (this.historyEnabled) {
+                this.fetchMessageHistory(newChatWindow);
+            }
+            this.windows.unshift(newChatWindow);
+            // Is there enough space left in the view port ? but should be displayed in mobile if option is enabled
+            if (!this.isViewportOnMobileEnabled) {
+                if (this.windows.length * this.windowSizeFactor >= this.viewPortTotalArea - (!this.hideFriendsList ? this.friendsListWidth : 0)) {
+                    this.windows.pop();
+                }
+            }
+            this.updateWindowsState(this.windows);
+            if (focusOnNewWindow && !collapseWindow) {
+                this.focusOnWindow(newChatWindow);
+            }
+            this.participantsInteractedWith.push(participant);
+            this.onParticipantChatOpened.emit(participant);
+            return [newChatWindow, true];
+        }
+        else {
+            // Returns the existing chat window
+            return [openedWindow, false];
+        }
+    }
+    // Focus on the input element of the supplied window
+    focusOnWindow(window, callback = () => { }) {
+        const windowIndex = this.windows.indexOf(window);
+        if (windowIndex >= 0) {
+            setTimeout(() => {
+                if (this.chatWindows) {
+                    const chatWindowToFocus = this.chatWindows.toArray()[windowIndex];
+                    chatWindowToFocus.chatWindowInput.nativeElement.focus();
+                }
+                callback();
+            });
+        }
+    }
+    assertMessageType(message) {
+        // Always fallback to "Text" messages to avoid rendenring issues
+        if (!message.type) {
+            message.type = MessageType.Text;
+        }
+    }
+    // Marks all messages provided as read with the current time.
+    markMessagesAsRead(messages) {
+        const currentDate = new Date();
+        messages.forEach((msg) => {
+            msg.dateSeen = currentDate;
+        });
+        this.onMessagesSeen.emit(messages);
+    }
+    // Buffers audio file (For component's bootstrapping)
+    bufferAudioFile() {
+        if (this.audioSource && this.audioSource.length > 0) {
+            this.audioFile = new Audio();
+            this.audioFile.src = this.audioSource;
+            this.audioFile.load();
+        }
+    }
+    // Emits a message notification audio if enabled after every message received
+    emitMessageSound(window) {
+        if (this.audioEnabled && !window.hasFocus && this.audioFile) {
+            this.audioFile.play();
+        }
+    }
+    // Emits a browser notification
+    emitBrowserNotification(window, message) {
+        // if (this.browserNotificationsBootstrapped && !window.hasFocus && message) {
+        if (this.browserNotificationsBootstrapped && message) {
+            const notification = new Notification(`${this.localization.browserNotificationTitle} ${window.participant.displayName}`, {
+                'body': message.message,
+                'icon': this.browserNotificationIconSource
+            });
+            setTimeout(() => {
+                notification.close();
+            }, message.message.length <= 50 ? 5000 : 7000); // More time to read longer messages
+        }
+    }
+    // Saves current windows state into local storage if persistence is enabled
+    updateWindowsState(windows) {
+        if (this.persistWindowsState) {
+            const participantIds = windows.map((w) => {
+                return w.participant.id;
+            });
+            localStorage.setItem(this.localStorageKey, JSON.stringify(participantIds));
+        }
+    }
+    restoreWindowsState() {
+        try {
+            if (this.persistWindowsState) {
+                const stringfiedParticipantIds = localStorage.getItem(this.localStorageKey);
+                if (stringfiedParticipantIds && stringfiedParticipantIds.length > 0) {
+                    const participantIds = JSON.parse(stringfiedParticipantIds);
+                    const participantsToRestore = this.participants.filter(u => participantIds.indexOf(u.id) >= 0);
+                    participantsToRestore.forEach((participant) => {
+                        this.openChatWindow(participant);
+                    });
+                }
+            }
+        }
+        catch (ex) {
+            console.error(`An error occurred while restoring ng-chat windows state. Details: ${ex}`);
+        }
+    }
+    // Gets closest open window if any. Most recent opened has priority (Right)
+    getClosestWindow(window) {
+        const index = this.windows.indexOf(window);
+        if (index > 0) {
+            return this.windows[index - 1];
+        }
+        else if (index == 0 && this.windows.length > 1) {
+            return this.windows[index + 1];
+        }
+    }
+    closeWindow(window) {
+        const index = this.windows.indexOf(window);
+        this.windows.splice(index, 1);
+        this.updateWindowsState(this.windows);
+        this.onParticipantChatClosed.emit(window.participant);
+    }
+    getChatWindowComponentInstance(targetWindow) {
+        const windowIndex = this.windows.indexOf(targetWindow);
+        if (this.chatWindows) {
+            let targetWindow = this.chatWindows.toArray()[windowIndex];
+            return targetWindow;
+        }
+        return null;
+    }
+    // Scrolls a chat window message flow to the bottom
+    scrollChatWindow(window, direction) {
+        const chatWindow = this.getChatWindowComponentInstance(window);
+        if (chatWindow) {
+            chatWindow.scrollChatWindow(window, direction);
+        }
+    }
+    onWindowMessagesSeen(messagesSeen) {
+        this.markMessagesAsRead(messagesSeen);
+    }
+    onWindowChatClosed(payload) {
+        const { closedWindow, closedViaEscapeKey } = payload;
+        if (closedViaEscapeKey) {
+            let closestWindow = this.getClosestWindow(closedWindow);
+            if (closestWindow) {
+                this.focusOnWindow(closestWindow, () => { this.closeWindow(closedWindow); });
+            }
+            else {
+                this.closeWindow(closedWindow);
+            }
+        }
+        else {
+            this.closeWindow(closedWindow);
+        }
+    }
+    onWindowTabTriggered(payload) {
+        const { triggeringWindow, shiftKeyPressed } = payload;
+        const currentWindowIndex = this.windows.indexOf(triggeringWindow);
+        let windowToFocus = this.windows[currentWindowIndex + (shiftKeyPressed ? 1 : -1)]; // Goes back on shift + tab
+        if (!windowToFocus) {
+            // Edge windows, go to start or end
+            windowToFocus = this.windows[currentWindowIndex > 0 ? 0 : this.chatWindows.length - 1];
+        }
+        this.focusOnWindow(windowToFocus);
+    }
+    onWindowMessageSent(messageSent) {
+        this.adapter.sendMessage(messageSent);
+    }
+    onWindowOptionTriggered(option) {
+        this.currentActiveOption = option;
+    }
+    triggerOpenChatWindow(user) {
+        if (user) {
+            this.openChatWindow(user);
+        }
+    }
+    triggerCloseChatWindow(userId) {
+        const openedWindow = this.windows.find(x => x.participant.id == userId);
+        if (openedWindow) {
+            this.closeWindow(openedWindow);
+        }
+    }
+    triggerToggleChatWindowVisibility(userId) {
+        const openedWindow = this.windows.find(x => x.participant.id == userId);
+        if (openedWindow) {
+            const chatWindow = this.getChatWindowComponentInstance(openedWindow);
+            if (chatWindow) {
+                chatWindow.onChatWindowClicked(openedWindow);
+            }
+        }
+    }
+    // closeFriendList(){
+    //     this.hideFriendsList = !this.hideFriendsList
+    //     this.hideFriendsListChange.emit(this.hideFriendsList)
+    // }
+    onCloseWindowClick(click) {
+        this.onCloseWindowClicked.emit(click);
+    }
+    onSearchInputChanged(value) {
+        this.searchInputChanged.emit(value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChat, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: NgChat, isStandalone: false, selector: "mnl-chat", inputs: { isDisabled: "isDisabled", adapter: "adapter", groupAdapter: "groupAdapter", userId: "userId", isCollapsed: "isCollapsed", maximizeWindowOnNewMessage: "maximizeWindowOnNewMessage", pollFriendsList: "pollFriendsList", pollingInterval: "pollingInterval", historyEnabled: "historyEnabled", emojisEnabled: "emojisEnabled", linkfyEnabled: "linkfyEnabled", audioEnabled: "audioEnabled", searchEnabled: "searchEnabled", audioSource: "audioSource", persistWindowsState: "persistWindowsState", title: "title", messagePlaceholder: "messagePlaceholder", searchPlaceholder: "searchPlaceholder", browserNotificationsEnabled: "browserNotificationsEnabled", browserNotificationIconSource: "browserNotificationIconSource", browserNotificationTitle: "browserNotificationTitle", historyPageSize: "historyPageSize", localization: "localization", hideFriendsList: "hideFriendsList", hideFriendsListOnUnsupportedViewport: "hideFriendsListOnUnsupportedViewport", fileUploadUrl: "fileUploadUrl", theme: "theme", customTheme: "customTheme", messageDatePipeFormat: "messageDatePipeFormat", showMessageDate: "showMessageDate", isViewportOnMobileEnabled: "isViewportOnMobileEnabled", fileUploadAdapter: "fileUploadAdapter" }, outputs: { onParticipantClicked: "onParticipantClicked", onParticipantChatOpened: "onParticipantChatOpened", onParticipantChatClosed: "onParticipantChatClosed", onMessagesSeen: "onMessagesSeen", onCloseWindowClicked: "onCloseWindowClicked", searchInputChanged: "searchInputChanged" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "chatWindows", predicate: ["chatWindow"], descendants: true }], ngImport: i0, template: "<link *ngIf=\"customTheme\" rel=\"stylesheet\" [href]='customTheme | sanitize'>\n\n<div id=\"ng-chat\" *ngIf=\"!isDisabled && isBootstrapped && !unsupportedViewport\" [ngClass]=\"theme\">\n    <ng-chat-friends-list\n        [localization]=\"localization\"\n        [shouldDisplay]=\"!hideFriendsList\"\n        [userId]=\"userId\"\n        [isCollapsed]=\"isCollapsed\"\n        [searchEnabled]=\"searchEnabled\"\n        [participants]=\"participants\"\n        [participantsResponse]=\"participantsResponse\"\n        [participantsInteractedWith]=\"participantsInteractedWith\"\n        [windows]=\"windows\"\n        [currentActiveOption]=\"currentActiveOption\"\n        (onParticipantClicked)=\"onParticipantClickedFromFriendsList($event)\"\n        (onOptionPromptCanceled)=\"onOptionPromptCanceled()\"\n        (onOptionPromptConfirmed)=\"onOptionPromptConfirmed($event)\"\n        (onCloseWindowClick)=\"onCloseWindowClick($event)\"\n        (searchInputChanged)=\"onSearchInputChanged($event)\"\n    >\n    </ng-chat-friends-list>\n\n    <div *ngFor=\"let window of windows; let i = index\" [ngClass]=\"{'ng-chat-window': true, 'primary-outline-color': true, 'ng-chat-window-collapsed': window.isCollapsed}\" [ngStyle]=\"{'right': (!hideFriendsList ? friendsListWidth : 0) + 20 + windowSizeFactor * i + 'px'}\">\n        <ng-chat-window\n            #chatWindow\n            [fileUploadAdapter]=\"fileUploadAdapter\"\n            [localization]=\"localization\"\n            [userId]=\"userId\"\n            [window]=\"window\"\n            [showOptions]=\"groupAdapter\"\n            [emojisEnabled]=\"emojisEnabled\"\n            [linkfyEnabled]=\"linkfyEnabled\"\n            [showMessageDate]=\"showMessageDate\"\n            [messageDatePipeFormat]=\"messageDatePipeFormat\"\n            [hasPagedHistory]=\"hasPagedHistory\"\n            (onMessagesSeen)=\"onWindowMessagesSeen($event)\"\n            (onMessageSent)=\"onWindowMessageSent($event)\"\n            (onTabTriggered)=\"onWindowTabTriggered($event)\"\n            (onChatWindowClosed)=\"onWindowChatClosed($event)\"\n            (onOptionTriggered)=\"onWindowOptionTriggered($event)\"\n            (onLoadHistoryTriggered)=\"fetchMessageHistory($event)\"\n        >\n        </ng-chat-window>\n    </div>\n</div>\n", styles: [".user-icon{box-sizing:border-box;background-color:#fff;border:2px solid;width:32px;height:20px;border-radius:64px 64px 0 0/64px;margin-top:14px;margin-left:-1px;display:inline-block;vertical-align:middle;position:relative;font-style:normal;color:#ddd;text-align:left;text-indent:-9999px}.user-icon:before{border:2px solid;background-color:#fff;width:12px;height:12px;top:-19px;border-radius:50%;position:absolute;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translate(-50%)}.user-icon:before,.user-icon:after{content:\"\";pointer-events:none}.upload-icon{position:absolute;margin-left:3px;margin-top:12px;width:13px;height:4px;border:solid 1px currentColor;border-top:none;border-radius:1px}.upload-icon:before{content:\"\";position:absolute;top:-8px;left:6px;width:1px;height:9px;background-color:currentColor}.upload-icon:after{content:\"\";position:absolute;top:-8px;left:4px;width:4px;height:4px;border-top:solid 1px currentColor;border-right:solid 1px currentColor;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.paperclip-icon{position:absolute;margin-left:9px;margin-top:2px;width:6px;height:12px;border-radius:4px 4px 0 0;border-left:solid 1px currentColor;border-right:solid 1px currentColor;border-top:solid 1px currentColor;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.paperclip-icon:before{content:\"\";position:absolute;top:11px;left:-1px;width:4px;height:6px;border-radius:0 0 3px 3px;border-left:solid 1px currentColor;border-right:solid 1px currentColor;border-bottom:solid 1px currentColor}.paperclip-icon:after{content:\"\";position:absolute;left:1px;top:1px;width:2px;height:10px;border-radius:4px 4px 0 0;border-left:solid 1px currentColor;border-right:solid 1px currentColor;border-top:solid 1px currentColor}.check-icon{color:#000;position:absolute;margin-left:3px;margin-top:4px;width:14px;height:8px;border-bottom:solid 1px currentColor;border-left:solid 1px currentColor;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.remove-icon{color:#000;position:absolute;margin-left:3px;margin-top:10px}.remove-icon:before{content:\"\";position:absolute;width:15px;height:1px;background-color:currentColor;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.remove-icon:after{content:\"\";position:absolute;width:15px;height:1px;background-color:currentColor;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}\n", ".loader,.loader:before,.loader:after{background:#e3e3e3;-webkit-animation:load1 1s infinite ease-in-out;animation:load1 1s infinite ease-in-out;width:1em;height:4em}.loader{color:#e3e3e3;text-indent:-9999em;margin:4px auto 0;position:relative;font-size:4px;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation-delay:-.16s;animation-delay:-.16s}.loader:before,.loader:after{position:absolute;top:0;content:\"\"}.loader:before{left:-1.5em;-webkit-animation-delay:-.32s;animation-delay:-.32s}.loader:after{left:1.5em}@-webkit-keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}@keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}\n", "#ng-chat{position:fixed;z-index:999;right:0;bottom:0;box-sizing:initial;font-size:11pt;text-align:left}#ng-chat input{outline:none}#ng-chat .shadowed{box-shadow:0 4px 8px #00000040}.ng-chat-loading-wrapper{height:30px;text-align:center;font-size:.9em}.ng-chat-close{text-decoration:none!important;color:red!important;float:right!important;font-weight:900!important;font-size:15px!important}.ng-chat-title,.ng-chat-title:hover{position:relative;z-index:2;height:30px;line-height:30px;font-size:.9em;padding:0 10px;display:block;text-decoration:none;color:#fff!important;font-weight:600!important;cursor:pointer;background-color:#1b1b70!important}.ng-chat-title .ng-chat-title-visibility-toggle-area{display:inline-block;width:85%}.ng-chat-title .ng-chat-title-visibility-toggle-area>strong{font-weight:600;display:block;overflow:hidden;height:30px;text-overflow:ellipsis;white-space:nowrap;max-width:85%;float:left}.ng-chat-title .ng-chat-title-visibility-toggle-area .ng-chat-participant-status{float:left;margin-left:5px}.ng-chat-participant-status{display:inline-block;border-radius:25px;width:8px;height:8px;margin-top:10px}.ng-chat-participant-status.online{background-color:#92a400}.ng-chat-participant-status.busy{background-color:#f91c1e}.ng-chat-participant-status.away{background-color:#f7d21b}.ng-chat-participant-status.offline{background-color:#bababa}.ng-chat-unread-messages-count{margin-left:5px;padding:0 5px;border-radius:25px;font-size:.9em;line-height:30px}.ng-chat-options-container{float:right;margin-right:5px}\n", "#ng-chat.light-theme .primary-text,#ng-chat.light-theme{color:#5c5c5c;font-family:Arial,Helvetica,sans-serif}#ng-chat.light-theme .primary-background{background-color:#fff}#ng-chat.light-theme .secondary-background{background-color:#fafafa}#ng-chat.light-theme .primary-outline-color{border-color:#a3a3a3}#ng-chat.light-theme .friends-search-bar{background-color:#fff}#ng-chat.light-theme .unread-messages-counter-container,#ng-chat.light-theme .ng-chat-people-action,#ng-chat.light-theme .ng-chat-people-action>i{color:#5c5c5c;background-color:#e3e3e3}#ng-chat.light-theme .load-history-action{background-color:#e3e3e3}#ng-chat.light-theme .chat-window-input{background-color:#fff}#ng-chat.light-theme .sent-chat-message-container,#ng-chat.light-theme .file-message-container{background-color:#e3e3e3;border-color:#e3e3e3}#ng-chat.light-theme .received-chat-message-container,#ng-chat.light-theme .file-message-container.received{background-color:#fff;border-color:#e3e3e3}body{font-family:Roboto,Helvetica Neue,sans-serif!important}*{box-shadow:none!important}\n", "#ng-chat.dark-theme .primary-text,#ng-chat.dark-theme{color:#fff;font-family:Arial,Helvetica,sans-serif}#ng-chat.dark-theme .primary-background{background-color:#565656}#ng-chat.dark-theme .secondary-background{background-color:#444}#ng-chat.dark-theme .primary-outline-color{border-color:#353535}#ng-chat.dark-theme .friends-search-bar{background-color:#444;border:1px solid #444;color:#fff}#ng-chat.dark-theme .unread-messages-counter-container,#ng-chat.dark-theme .ng-chat-people-action,#ng-chat.dark-theme .ng-chat-people-action>i{background-color:#fff;color:#444}#ng-chat.dark-theme .load-history-action{background-color:#444}#ng-chat.dark-theme .chat-window-input{background-color:#444;color:#fff}#ng-chat.dark-theme .sent-chat-message-container,#ng-chat.dark-theme .file-message-container{border-color:#444;background-color:#444}#ng-chat.dark-theme .received-chat-message-container,#ng-chat.dark-theme .file-message-container.received{background-color:#565656;border-color:#444}#ng-chat.dark-theme .ng-chat-footer{background-color:#444}#ng-chat.dark-theme .ng-chat-message a{color:#fff}body{font-family:Roboto,Helvetica Neue,sans-serif!important}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: NgChatFriendsListComponent, selector: "ng-chat-friends-list", inputs: ["participants", "participantsResponse", "participantsInteractedWith", "windows", "userId", "localization", "shouldDisplay", "isCollapsed", "searchEnabled", "currentActiveOption", "hideFriendsList"], outputs: ["onParticipantClicked", "onOptionPromptCanceled", "onOptionPromptConfirmed", "onCloseWindowClick", "searchInputChanged"] }, { kind: "component", type: NgChatWindowComponent, selector: "ng-chat-window", inputs: ["fileUploadAdapter", "window", "userId", "localization", "showOptions", "emojisEnabled", "linkfyEnabled", "showMessageDate", "messageDatePipeFormat", "hasPagedHistory"], outputs: ["onChatWindowClosed", "onMessagesSeen", "onMessageSent", "onTabTriggered", "onOptionTriggered", "onLoadHistoryTriggered"] }, { kind: "pipe", type: SanitizePipe, name: "sanitize" }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChat, decorators: [{
+            type: Component,
+            args: [{ selector: 'mnl-chat', encapsulation: ViewEncapsulation.None, standalone: false, template: "<link *ngIf=\"customTheme\" rel=\"stylesheet\" [href]='customTheme | sanitize'>\n\n<div id=\"ng-chat\" *ngIf=\"!isDisabled && isBootstrapped && !unsupportedViewport\" [ngClass]=\"theme\">\n    <ng-chat-friends-list\n        [localization]=\"localization\"\n        [shouldDisplay]=\"!hideFriendsList\"\n        [userId]=\"userId\"\n        [isCollapsed]=\"isCollapsed\"\n        [searchEnabled]=\"searchEnabled\"\n        [participants]=\"participants\"\n        [participantsResponse]=\"participantsResponse\"\n        [participantsInteractedWith]=\"participantsInteractedWith\"\n        [windows]=\"windows\"\n        [currentActiveOption]=\"currentActiveOption\"\n        (onParticipantClicked)=\"onParticipantClickedFromFriendsList($event)\"\n        (onOptionPromptCanceled)=\"onOptionPromptCanceled()\"\n        (onOptionPromptConfirmed)=\"onOptionPromptConfirmed($event)\"\n        (onCloseWindowClick)=\"onCloseWindowClick($event)\"\n        (searchInputChanged)=\"onSearchInputChanged($event)\"\n    >\n    </ng-chat-friends-list>\n\n    <div *ngFor=\"let window of windows; let i = index\" [ngClass]=\"{'ng-chat-window': true, 'primary-outline-color': true, 'ng-chat-window-collapsed': window.isCollapsed}\" [ngStyle]=\"{'right': (!hideFriendsList ? friendsListWidth : 0) + 20 + windowSizeFactor * i + 'px'}\">\n        <ng-chat-window\n            #chatWindow\n            [fileUploadAdapter]=\"fileUploadAdapter\"\n            [localization]=\"localization\"\n            [userId]=\"userId\"\n            [window]=\"window\"\n            [showOptions]=\"groupAdapter\"\n            [emojisEnabled]=\"emojisEnabled\"\n            [linkfyEnabled]=\"linkfyEnabled\"\n            [showMessageDate]=\"showMessageDate\"\n            [messageDatePipeFormat]=\"messageDatePipeFormat\"\n            [hasPagedHistory]=\"hasPagedHistory\"\n            (onMessagesSeen)=\"onWindowMessagesSeen($event)\"\n            (onMessageSent)=\"onWindowMessageSent($event)\"\n            (onTabTriggered)=\"onWindowTabTriggered($event)\"\n            (onChatWindowClosed)=\"onWindowChatClosed($event)\"\n            (onOptionTriggered)=\"onWindowOptionTriggered($event)\"\n            (onLoadHistoryTriggered)=\"fetchMessageHistory($event)\"\n        >\n        </ng-chat-window>\n    </div>\n</div>\n", styles: [".user-icon{box-sizing:border-box;background-color:#fff;border:2px solid;width:32px;height:20px;border-radius:64px 64px 0 0/64px;margin-top:14px;margin-left:-1px;display:inline-block;vertical-align:middle;position:relative;font-style:normal;color:#ddd;text-align:left;text-indent:-9999px}.user-icon:before{border:2px solid;background-color:#fff;width:12px;height:12px;top:-19px;border-radius:50%;position:absolute;left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translate(-50%)}.user-icon:before,.user-icon:after{content:\"\";pointer-events:none}.upload-icon{position:absolute;margin-left:3px;margin-top:12px;width:13px;height:4px;border:solid 1px currentColor;border-top:none;border-radius:1px}.upload-icon:before{content:\"\";position:absolute;top:-8px;left:6px;width:1px;height:9px;background-color:currentColor}.upload-icon:after{content:\"\";position:absolute;top:-8px;left:4px;width:4px;height:4px;border-top:solid 1px currentColor;border-right:solid 1px currentColor;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.paperclip-icon{position:absolute;margin-left:9px;margin-top:2px;width:6px;height:12px;border-radius:4px 4px 0 0;border-left:solid 1px currentColor;border-right:solid 1px currentColor;border-top:solid 1px currentColor;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.paperclip-icon:before{content:\"\";position:absolute;top:11px;left:-1px;width:4px;height:6px;border-radius:0 0 3px 3px;border-left:solid 1px currentColor;border-right:solid 1px currentColor;border-bottom:solid 1px currentColor}.paperclip-icon:after{content:\"\";position:absolute;left:1px;top:1px;width:2px;height:10px;border-radius:4px 4px 0 0;border-left:solid 1px currentColor;border-right:solid 1px currentColor;border-top:solid 1px currentColor}.check-icon{color:#000;position:absolute;margin-left:3px;margin-top:4px;width:14px;height:8px;border-bottom:solid 1px currentColor;border-left:solid 1px currentColor;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.remove-icon{color:#000;position:absolute;margin-left:3px;margin-top:10px}.remove-icon:before{content:\"\";position:absolute;width:15px;height:1px;background-color:currentColor;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.remove-icon:after{content:\"\";position:absolute;width:15px;height:1px;background-color:currentColor;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}\n", ".loader,.loader:before,.loader:after{background:#e3e3e3;-webkit-animation:load1 1s infinite ease-in-out;animation:load1 1s infinite ease-in-out;width:1em;height:4em}.loader{color:#e3e3e3;text-indent:-9999em;margin:4px auto 0;position:relative;font-size:4px;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation-delay:-.16s;animation-delay:-.16s}.loader:before,.loader:after{position:absolute;top:0;content:\"\"}.loader:before{left:-1.5em;-webkit-animation-delay:-.32s;animation-delay:-.32s}.loader:after{left:1.5em}@-webkit-keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}@keyframes load1{0%,80%,to{box-shadow:0 0;height:4em}40%{box-shadow:0 -2em;height:5em}}\n", "#ng-chat{position:fixed;z-index:999;right:0;bottom:0;box-sizing:initial;font-size:11pt;text-align:left}#ng-chat input{outline:none}#ng-chat .shadowed{box-shadow:0 4px 8px #00000040}.ng-chat-loading-wrapper{height:30px;text-align:center;font-size:.9em}.ng-chat-close{text-decoration:none!important;color:red!important;float:right!important;font-weight:900!important;font-size:15px!important}.ng-chat-title,.ng-chat-title:hover{position:relative;z-index:2;height:30px;line-height:30px;font-size:.9em;padding:0 10px;display:block;text-decoration:none;color:#fff!important;font-weight:600!important;cursor:pointer;background-color:#1b1b70!important}.ng-chat-title .ng-chat-title-visibility-toggle-area{display:inline-block;width:85%}.ng-chat-title .ng-chat-title-visibility-toggle-area>strong{font-weight:600;display:block;overflow:hidden;height:30px;text-overflow:ellipsis;white-space:nowrap;max-width:85%;float:left}.ng-chat-title .ng-chat-title-visibility-toggle-area .ng-chat-participant-status{float:left;margin-left:5px}.ng-chat-participant-status{display:inline-block;border-radius:25px;width:8px;height:8px;margin-top:10px}.ng-chat-participant-status.online{background-color:#92a400}.ng-chat-participant-status.busy{background-color:#f91c1e}.ng-chat-participant-status.away{background-color:#f7d21b}.ng-chat-participant-status.offline{background-color:#bababa}.ng-chat-unread-messages-count{margin-left:5px;padding:0 5px;border-radius:25px;font-size:.9em;line-height:30px}.ng-chat-options-container{float:right;margin-right:5px}\n", "#ng-chat.light-theme .primary-text,#ng-chat.light-theme{color:#5c5c5c;font-family:Arial,Helvetica,sans-serif}#ng-chat.light-theme .primary-background{background-color:#fff}#ng-chat.light-theme .secondary-background{background-color:#fafafa}#ng-chat.light-theme .primary-outline-color{border-color:#a3a3a3}#ng-chat.light-theme .friends-search-bar{background-color:#fff}#ng-chat.light-theme .unread-messages-counter-container,#ng-chat.light-theme .ng-chat-people-action,#ng-chat.light-theme .ng-chat-people-action>i{color:#5c5c5c;background-color:#e3e3e3}#ng-chat.light-theme .load-history-action{background-color:#e3e3e3}#ng-chat.light-theme .chat-window-input{background-color:#fff}#ng-chat.light-theme .sent-chat-message-container,#ng-chat.light-theme .file-message-container{background-color:#e3e3e3;border-color:#e3e3e3}#ng-chat.light-theme .received-chat-message-container,#ng-chat.light-theme .file-message-container.received{background-color:#fff;border-color:#e3e3e3}body{font-family:Roboto,Helvetica Neue,sans-serif!important}*{box-shadow:none!important}\n", "#ng-chat.dark-theme .primary-text,#ng-chat.dark-theme{color:#fff;font-family:Arial,Helvetica,sans-serif}#ng-chat.dark-theme .primary-background{background-color:#565656}#ng-chat.dark-theme .secondary-background{background-color:#444}#ng-chat.dark-theme .primary-outline-color{border-color:#353535}#ng-chat.dark-theme .friends-search-bar{background-color:#444;border:1px solid #444;color:#fff}#ng-chat.dark-theme .unread-messages-counter-container,#ng-chat.dark-theme .ng-chat-people-action,#ng-chat.dark-theme .ng-chat-people-action>i{background-color:#fff;color:#444}#ng-chat.dark-theme .load-history-action{background-color:#444}#ng-chat.dark-theme .chat-window-input{background-color:#444;color:#fff}#ng-chat.dark-theme .sent-chat-message-container,#ng-chat.dark-theme .file-message-container{border-color:#444;background-color:#444}#ng-chat.dark-theme .received-chat-message-container,#ng-chat.dark-theme .file-message-container.received{background-color:#565656;border-color:#444}#ng-chat.dark-theme .ng-chat-footer{background-color:#444}#ng-chat.dark-theme .ng-chat-message a{color:#fff}body{font-family:Roboto,Helvetica Neue,sans-serif!important}\n"] }]
+        }], ctorParameters: () => [{ type: i1$2.HttpClient }], propDecorators: { isDisabled: [{
+                type: Input
+            }], adapter: [{
+                type: Input
+            }], groupAdapter: [{
+                type: Input
+            }], userId: [{
+                type: Input
+            }], isCollapsed: [{
+                type: Input
+            }], maximizeWindowOnNewMessage: [{
+                type: Input
+            }], pollFriendsList: [{
+                type: Input
+            }], pollingInterval: [{
+                type: Input
+            }], historyEnabled: [{
+                type: Input
+            }], emojisEnabled: [{
+                type: Input
+            }], linkfyEnabled: [{
+                type: Input
+            }], audioEnabled: [{
+                type: Input
+            }], searchEnabled: [{
+                type: Input
+            }], audioSource: [{
+                type: Input
+            }], persistWindowsState: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], messagePlaceholder: [{
+                type: Input
+            }], searchPlaceholder: [{
+                type: Input
+            }], browserNotificationsEnabled: [{
+                type: Input
+            }], browserNotificationIconSource: [{
+                type: Input
+            }], browserNotificationTitle: [{
+                type: Input
+            }], historyPageSize: [{
+                type: Input
+            }], localization: [{
+                type: Input
+            }], hideFriendsList: [{
+                type: Input
+            }], hideFriendsListOnUnsupportedViewport: [{
+                type: Input
+            }], fileUploadUrl: [{
+                type: Input
+            }], theme: [{
+                type: Input
+            }], customTheme: [{
+                type: Input
+            }], messageDatePipeFormat: [{
+                type: Input
+            }], showMessageDate: [{
+                type: Input
+            }], isViewportOnMobileEnabled: [{
+                type: Input
+            }], fileUploadAdapter: [{
+                type: Input
+            }], onParticipantClicked: [{
+                type: Output
+            }], onParticipantChatOpened: [{
+                type: Output
+            }], onParticipantChatClosed: [{
+                type: Output
+            }], onMessagesSeen: [{
+                type: Output
+            }], onCloseWindowClicked: [{
+                type: Output
+            }], searchInputChanged: [{
+                type: Output
+            }], chatWindows: [{
+                type: ViewChildren,
+                args: ['chatWindow']
+            }], onResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
+            }] } });
+
+/* eslint-disable */
+class NgChatOptionsComponent {
+    constructor() {
+        this.activeOptionTrackerChange = new EventEmitter();
+    }
+    onOptionClicked(option) {
+        option.isActive = true;
+        if (option.action) {
+            option.action(option.chattingTo);
+        }
+        this.activeOptionTrackerChange.emit(option);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChatOptionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: NgChatOptionsComponent, isStandalone: false, selector: "ng-chat-options", inputs: { options: "options", activeOptionTracker: "activeOptionTracker" }, outputs: { activeOptionTrackerChange: "activeOptionTrackerChange" }, ngImport: i0, template: "<div *ngIf=\"options && options.length > 0\" class=\"ng-chat-options\">\n\t\t<button class=\"ng-chat-options-activator\">\n\t\t\t<span class=\"primary-text\">...</span>\n\t\t</button>\n\t<div class=\"ng-chat-options-content primary-background shadowed\">\n\t\t<a *ngFor=\"let option of options; let i = index\" [ngClass]=\"'primary-text'\" (click)=\"onOptionClicked(option)\">\n\t\t\t{{option.displayLabel}}\n\t\t</a>\n\t</div>      \n</div>\n", styles: [".ng-chat-options-activator{background-color:unset;color:#fff;line-height:28px;border:none;position:relative}.ng-chat-options-activator>span{position:relative;top:-5px;left:0}.ng-chat-options{position:relative;display:inline-block}.ng-chat-options:hover .ng-chat-options-content{display:block}.ng-chat-options:hover .ng-chat-options-activator{background-color:#ddd}.ng-chat-options-content{display:none;position:absolute;min-width:160px;z-index:1}.ng-chat-options-content a:hover{background-color:#ddd}.ng-chat-options-content a{padding:6px 16px;text-decoration:none;display:block}@media only screen and (max-width: 581px){.ng-chat-options-content{right:0}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: NgChatOptionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ng-chat-options', standalone: false, template: "<div *ngIf=\"options && options.length > 0\" class=\"ng-chat-options\">\n\t\t<button class=\"ng-chat-options-activator\">\n\t\t\t<span class=\"primary-text\">...</span>\n\t\t</button>\n\t<div class=\"ng-chat-options-content primary-background shadowed\">\n\t\t<a *ngFor=\"let option of options; let i = index\" [ngClass]=\"'primary-text'\" (click)=\"onOptionClicked(option)\">\n\t\t\t{{option.displayLabel}}\n\t\t</a>\n\t</div>      \n</div>\n", styles: [".ng-chat-options-activator{background-color:unset;color:#fff;line-height:28px;border:none;position:relative}.ng-chat-options-activator>span{position:relative;top:-5px;left:0}.ng-chat-options{position:relative;display:inline-block}.ng-chat-options:hover .ng-chat-options-content{display:block}.ng-chat-options:hover .ng-chat-options-activator{background-color:#ddd}.ng-chat-options-content{display:none;position:absolute;min-width:160px;z-index:1}.ng-chat-options-content a:hover{background-color:#ddd}.ng-chat-options-content a{padding:6px 16px;text-decoration:none;display:block}@media only screen and (max-width: 581px){.ng-chat-options-content{right:0}}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { options: [{
+                type: Input
+            }], activeOptionTracker: [{
+                type: Input
+            }], activeOptionTrackerChange: [{
+                type: Output
+            }] } });
+
+class ChatModule {
+    static forRoot() {
+        return {
+            ngModule: ChatModule,
+            providers: [
+                {
+                    provide: APP_INITIALIZER,
+                    useFactory: loadConfig,
+                    deps: [
+                        AppConfigService,
+                        ChatService
+                    ],
+                    multi: true,
+                },
+            ],
+        };
+    }
+    static forChild() {
+        return {
+            ngModule: ChatModule,
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: ChatModule, declarations: [NgChat,
+            EmojifyPipe,
+            LinkfyPipe,
+            SanitizePipe,
+            GroupMessageDisplayNamePipe,
+            NgChatOptionsComponent,
+            NgChatFriendsListComponent,
+            NgChatWindowComponent,
+            FirstLetterPipe], imports: [ChatMaterialModule,
+            CommonModule,
+            FormsModule,
+            HttpClientModule], exports: [NgChat] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatModule, imports: [ChatMaterialModule,
+            CommonModule,
+            FormsModule,
+            HttpClientModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ChatModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        NgChat,
+                        EmojifyPipe,
+                        LinkfyPipe,
+                        SanitizePipe,
+                        GroupMessageDisplayNamePipe,
+                        NgChatOptionsComponent,
+                        NgChatFriendsListComponent,
+                        NgChatWindowComponent,
+                        FirstLetterPipe
+                    ],
+                    imports: [
+                        ChatMaterialModule,
+                        CommonModule,
+                        FormsModule,
+                        HttpClientModule
+                    ],
+                    exports: [
+                        NgChat
+                    ],
+                }]
+        }] });
+function loadConfig(config) {
+    const conf = () => config.load();
+    return conf;
+}
+
+class User {
+    constructor() {
+        this.participantType = ChatParticipantType.User;
+    }
+}
+
+class ParticipantResponse {
+}
+
+class ParticipantMetadata {
+    constructor() {
+        this.totalUnreadMessages = 0;
+    }
+}
+
+/*
+ * Public API Surface of mnl-chat
+ */
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { ChatAdapter, ChatMaterialModule, ChatModule, ChatParticipantStatus, ChatParticipantType, ChatService, Group, Message, MessageType, NgChat, PagedHistoryChatAdapter, ParticipantMetadata, ParticipantResponse, Theme, User, Window, loadConfig, modules };
+//# sourceMappingURL=muraai-mnl-chat.mjs.map