@muraai/mnl-chat 0.0.1

package/lib/core/chat-adapter.d.ts

@@ -0,0 +1,15 @@
+import { Observable } from 'rxjs';
+import { Message } from "./message";
+import { ParticipantResponse } from "./participant-response";
+import { IChatParticipant } from './chat-participant';
+export declare abstract class ChatAdapter {
+    abstract listFriends(): Observable<ParticipantResponse[]>;
+    abstract getMessageHistory(destinataryId: any): Observable<Message[]>;
+    abstract sendMessage(message: Message): void;
+    onFriendsListChanged(participantsResponse: ParticipantResponse[]): void;
+    onMessageReceived(participant: IChatParticipant, message: Message): void;
+    /** @internal */
+    friendsListChangedHandler: (participantsResponse: ParticipantResponse[]) => void;
+    /** @internal */
+    messageReceivedHandler: (participant: IChatParticipant, message: Message) => void;
+}

package/lib/core/chat-controller.d.ts

@@ -0,0 +1,6 @@
+import { User } from './user';
+export interface IChatController {
+    triggerOpenChatWindow(user: User): void;
+    triggerCloseChatWindow(userId: any): void;
+    triggerToggleChatWindowVisibility(userId: any): void;
+}

package/lib/core/chat-group-adapter.d.ts

@@ -0,0 +1,4 @@
+import { Group } from "./group";
+export interface IChatGroupAdapter {
+    groupCreated(group: Group): void;
+}

package/lib/core/chat-option.d.ts

@@ -0,0 +1,9 @@
+import { Window } from '../core/window';
+import { IChatParticipant } from '../core/chat-participant';
+export interface IChatOption {
+    isActive: boolean;
+    displayLabel: string;
+    chattingTo: Window;
+    action?: (chattingTo: Window) => void;
+    validateContext: (participant: IChatParticipant) => boolean;
+}

package/lib/core/chat-participant-status-descriptor.d.ts

@@ -0,0 +1,3 @@
+import { ChatParticipantStatus } from './chat-participant-status.enum';
+import { Localization } from './localization';
+export declare function chatParticipantStatusDescriptor(status: ChatParticipantStatus, localization: Localization): string;

package/lib/core/chat-participant-status.enum.d.ts

@@ -0,0 +1,6 @@
+export declare enum ChatParticipantStatus {
+    Online = 0,
+    Busy = 1,
+    Away = 2,
+    Offline = 3
+}

package/lib/core/chat-participant-type.enum.d.ts

@@ -0,0 +1,4 @@
+export declare enum ChatParticipantType {
+    User = 0,
+    Group = 1
+}

package/lib/core/chat-participant.d.ts

@@ -0,0 +1,9 @@
+import { ChatParticipantStatus } from "./chat-participant-status.enum";
+import { ChatParticipantType } from "./chat-participant-type.enum";
+export interface IChatParticipant {
+    readonly participantType: ChatParticipantType;
+    readonly id: any;
+    readonly status: ChatParticipantStatus;
+    readonly avatar: string | null;
+    readonly displayName: string;
+}

package/lib/core/default-file-upload-adapter.d.ts

@@ -0,0 +1,14 @@
+import { IFileUploadAdapter } from './file-upload-adapter';
+import { HttpClient } from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { Message } from './message';
+export declare class DefaultFileUploadAdapter implements IFileUploadAdapter {
+    private _serverEndpointUrl;
+    private _http;
+    /**
+     * @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: string, _http: HttpClient);
+    uploadFile(file: File, participantId: any): Observable<Message>;
+}

package/lib/core/file-upload-adapter.d.ts

@@ -0,0 +1,5 @@
+import { Observable } from 'rxjs';
+import { Message } from './message';
+export interface IFileUploadAdapter {
+    uploadFile(file: File, participantId: any): Observable<Message>;
+}

package/lib/core/group.d.ts

@@ -0,0 +1,13 @@
+import { User } from "./user";
+import { ChatParticipantStatus } from "./chat-participant-status.enum";
+import { IChatParticipant } from "./chat-participant";
+import { ChatParticipantType } from "./chat-participant-type.enum";
+export declare class Group implements IChatParticipant {
+    constructor(participants: User[]);
+    id: string;
+    chattingTo: User[];
+    readonly participantType: ChatParticipantType;
+    status: ChatParticipantStatus;
+    avatar: string | null;
+    displayName: string;
+}

package/lib/core/guid.d.ts

@@ -0,0 +1,3 @@
+export declare class Guid {
+    static newGuid(): string;
+}

package/lib/core/localization.d.ts

@@ -0,0 +1,15 @@
+export interface Localization {
+    title: string;
+    messagePlaceholder: string;
+    searchPlaceholder: string;
+    statusDescription: StatusDescription;
+    browserNotificationTitle: string;
+    loadMessageHistoryPlaceholder: string;
+}
+export interface StatusDescription {
+    online: string;
+    busy: string;
+    away: string;
+    offline: string;
+    [key: string]: string;
+}

package/lib/core/message-counter.d.ts

@@ -0,0 +1,10 @@
+import { Window } from './window';
+export declare class MessageCounter {
+    static formatUnreadMessagesTotal(totalUnreadMessages: number): string;
+    /**
+     * 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: Window, currentUserId: any): string;
+}

package/lib/core/message-type.enum.d.ts

@@ -0,0 +1,5 @@
+export declare enum MessageType {
+    Text = 1,
+    File = 2,
+    Image = 3
+}

package/lib/core/message.d.ts

@@ -0,0 +1,10 @@
+import { MessageType } from './message-type.enum';
+export declare class Message {
+    type?: MessageType;
+    fromId: any;
+    toId: any;
+    message: string;
+    dateSent?: Date;
+    dateSeen?: Date;
+    additionalParameter?: Object;
+}

package/lib/core/paged-history-chat-adapter.d.ts

@@ -0,0 +1,10 @@
+import { Observable } from 'rxjs';
+import { Message } from "./message";
+import { ChatAdapter } from "./chat-adapter";
+/**
+ * @description Chat Adapter decorator class that adds pagination to load the history of messagesr.
+ * You will need an existing @see ChatAdapter implementation
+ */
+export declare abstract class PagedHistoryChatAdapter extends ChatAdapter {
+    abstract getMessageHistoryByPage(destinataryId: any, size: number, page: number): Observable<Message[]>;
+}

package/lib/core/participant-metadata.d.ts

@@ -0,0 +1,3 @@
+export declare class ParticipantMetadata {
+    totalUnreadMessages: number;
+}

package/lib/core/participant-response.d.ts

@@ -0,0 +1,6 @@
+import { ParticipantMetadata } from "./participant-metadata";
+import { IChatParticipant } from "./chat-participant";
+export declare class ParticipantResponse {
+    participant: IChatParticipant;
+    metadata: ParticipantMetadata;
+}

package/lib/core/scroll-direction.enum.d.ts

@@ -0,0 +1,4 @@
+export declare enum ScrollDirection {
+    Top = 0,
+    Bottom = 1
+}

package/lib/core/theme.enum.d.ts

@@ -0,0 +1,5 @@
+export declare enum Theme {
+    Custom = "custom-theme",
+    Light = "light-theme",
+    Dark = "dark-theme"
+}

package/lib/core/user.d.ts

@@ -0,0 +1,10 @@
+import { ChatParticipantStatus } from "./chat-participant-status.enum";
+import { IChatParticipant } from "./chat-participant";
+import { ChatParticipantType } from "./chat-participant-type.enum";
+export declare class User implements IChatParticipant {
+    readonly participantType: ChatParticipantType;
+    id: any;
+    displayName: string;
+    status: ChatParticipantStatus;
+    avatar: string;
+}

package/lib/core/window.d.ts

@@ -0,0 +1,13 @@
+import { Message } from "./message";
+import { IChatParticipant } from "./chat-participant";
+export declare class Window {
+    constructor(participant: IChatParticipant, isLoadingHistory: boolean, isCollapsed: boolean);
+    participant: IChatParticipant;
+    messages: Message[];
+    newMessage?: string;
+    isCollapsed?: boolean;
+    isLoadingHistory: boolean;
+    hasFocus: boolean;
+    hasMoreMessages: boolean;
+    historyPage: number;
+}

package/lib/firstLetter.pipe.d.ts

@@ -0,0 +1,7 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class FirstLetterPipe implements PipeTransform {
+    transform(value: string): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FirstLetterPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<FirstLetterPipe, "firstLetterPipe", false>;
+}

package/lib/material.module.d.ts

@@ -0,0 +1,14 @@
+import { FormsModule } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/material/button";
+import * as i2 from "@angular/material/form-field";
+import * as i3 from "@angular/material/icon";
+import * as i4 from "@angular/material/input";
+import * as i5 from "@angular/forms";
+import * as i6 from "@angular/material/menu";
+export declare function modules(): (typeof FormsModule)[];
+export declare class ChatMaterialModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<ChatMaterialModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ChatMaterialModule, never, [typeof i1.MatButtonModule, typeof i2.MatFormFieldModule, typeof i3.MatIconModule, typeof i4.MatInputModule, typeof i5.FormsModule, typeof i5.ReactiveFormsModule, typeof i6.MatMenuModule], [typeof i1.MatButtonModule, typeof i2.MatFormFieldModule, typeof i3.MatIconModule, typeof i4.MatInputModule, typeof i5.FormsModule, typeof i5.ReactiveFormsModule, typeof i6.MatMenuModule]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<ChatMaterialModule>;
+}

package/lib/pipes/emojify.pipe.d.ts

@@ -0,0 +1,7 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class EmojifyPipe implements PipeTransform {
+    transform(message: string, pipeEnabled: boolean): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<EmojifyPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<EmojifyPipe, "emojify", false>;
+}

package/lib/pipes/group-message-display-name.pipe.d.ts

@@ -0,0 +1,9 @@
+import { PipeTransform } from '@angular/core';
+import { IChatParticipant } from "../core/chat-participant";
+import { Message } from "../core/message";
+import * as i0 from "@angular/core";
+export declare class GroupMessageDisplayNamePipe implements PipeTransform {
+    transform(participant: IChatParticipant, message: Message): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GroupMessageDisplayNamePipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<GroupMessageDisplayNamePipe, "groupMessageDisplayName", false>;
+}

package/lib/pipes/linkfy.pipe.d.ts

@@ -0,0 +1,7 @@
+import { PipeTransform } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class LinkfyPipe implements PipeTransform {
+    transform(message: string, pipeEnabled: boolean): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LinkfyPipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<LinkfyPipe, "linkfy", false>;
+}

package/lib/pipes/sanitize.pipe.d.ts

@@ -0,0 +1,10 @@
+import { PipeTransform } from '@angular/core';
+import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
+import * as i0 from "@angular/core";
+export declare class SanitizePipe implements PipeTransform {
+    protected sanitizer: DomSanitizer;
+    constructor(sanitizer: DomSanitizer);
+    transform(url: string): SafeResourceUrl;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SanitizePipe, never>;
+    static ɵpipe: i0.ɵɵPipeDeclaration<SanitizePipe, "sanitize", false>;
+}

package/lib/services/chat.service.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class ChatService {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<ChatService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<ChatService>;
+}

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@muraai/mnl-chat",
+  "version": "0.0.1",
+  "peerDependencies": {
+    "@angular/common": "^14.2.0",
+    "@angular/core": "^14.2.0"
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  },
+  "module": "fesm2015/muraai-mnl-chat.mjs",
+  "es2020": "fesm2020/muraai-mnl-chat.mjs",
+  "esm2020": "esm2020/muraai-mnl-chat.mjs",
+  "fesm2020": "fesm2020/muraai-mnl-chat.mjs",
+  "fesm2015": "fesm2015/muraai-mnl-chat.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2020": "./esm2020/muraai-mnl-chat.mjs",
+      "es2020": "./fesm2020/muraai-mnl-chat.mjs",
+      "es2015": "./fesm2015/muraai-mnl-chat.mjs",
+      "node": "./fesm2015/muraai-mnl-chat.mjs",
+      "default": "./fesm2020/muraai-mnl-chat.mjs"
+    }
+  },
+  "sideEffects": false
+}

package/public-api.d.ts

@@ -0,0 +1,21 @@
+export * from './lib/chat.module';
+export * from './lib/services/chat.service';
+export * from './lib/components/ng-chat/ng-chat.component';
+export * from './lib/core/chat-adapter';
+export * from './lib/core/message';
+export * from './lib/core/chat-participant-status.enum';
+export * from './lib/core/user';
+export * from './lib/core/participant-response';
+export * from './lib/core/participant-metadata';
+export * from './lib/core/window';
+export * from './lib/core/localization';
+export * from './lib/core/chat-controller';
+export * from './lib/core/paged-history-chat-adapter';
+export * from './lib/core/theme.enum';
+export * from './lib/core/chat-option';
+export * from './lib/core/group';
+export * from './lib/core/chat-participant';
+export * from './lib/core/chat-group-adapter';
+export * from './lib/core/chat-participant-type.enum';
+export * from './lib/core/message-type.enum';
+export * from './lib/core/file-upload-adapter';

package/src/assets/icons.css

@@ -0,0 +1,140 @@
+.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: translateX(-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);
+    }

package/src/assets/loading-spinner.css

@@ -0,0 +1,59 @@
+.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: -0.16s;
+  animation-delay: -0.16s;
+}
+.loader:before,
+.loader:after {
+  position: absolute;
+  top: 0;
+  content: '';
+}
+.loader:before {
+  left: -1.5em;
+  -webkit-animation-delay: -0.32s;
+  animation-delay: -0.32s;
+}
+.loader:after {
+  left: 1.5em;
+}
+@-webkit-keyframes load1 {
+  0%,
+  80%,
+  100% {
+    box-shadow: 0 0;
+    height: 4em;
+  }
+  40% {
+    box-shadow: 0 -2em;
+    height: 5em;
+  }
+}
+@keyframes load1 {
+  0%,
+  80%,
+  100% {
+    box-shadow: 0 0;
+    height: 4em;
+  }
+  40% {
+    box-shadow: 0 -2em;
+    height: 5em;
+  }
+}

package/src/assets/ng-chat.component.default.css

@@ -0,0 +1,106 @@
+#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 rgba(0,0,0,.25);
+    }
+.ng-chat-loading-wrapper
+{
+    height: 30px;
+    text-align: center;
+    font-size:0.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:0.9em;
+    padding: 0 10px;
+    display: block;
+    text-decoration: none;
+    color: white !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: 0.9em;
+    line-height: 30px;
+}
+
+.ng-chat-options-container
+{
+    float: right;
+    margin-right: 5px;
+}