agx-chat-web 1.2.2 → 1.2.3

package/dist/esm/app/Messenger/components/InputFile/InputFile.js

@@ -0,0 +1,74 @@
+import TrashIcon from '../../icons/TrashIcon';
+import React, { useMemo } from 'react';
+import useTheme from '../../hooks/useThemes';
+import { useTranslation } from 'react-i18next';
+function InputFile(_a) {
+    var fileList = _a.fileList, onUpdateFile = _a.onUpdateFile, label = _a.label, onRemoveFile = _a.onRemoveFile, maxSize = _a.maxSize, loading = _a.loading;
+    var theme = useTheme().theme;
+    var t = useTranslation('newFormChat').t;
+    var validateFileType = useMemo(function () { return function (allowedTypes, file) {
+        var _a;
+        if (file === null || file === void 0 ? void 0 : file.type) {
+            return allowedTypes.includes(file.type);
+        }
+        var extension = (_a = file === null || file === void 0 ? void 0 : file.name.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+        return extension ? allowedTypes.includes(".".concat(extension)) : false;
+    }; }, []);
+    var onUpload = function () {
+        var input = document.querySelector('.file-input__input');
+        input === null || input === void 0 ? void 0 : input.click();
+    };
+    var onChange = function (e) {
+        var _a, _b;
+        var file = (_b = (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0];
+        var isAllowedType = validateFileType([
+            'image/png',
+            'image/jpeg',
+            'application/pdf',
+            'application/msword',
+            'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+            'text/csv',
+            'video/mp4',
+        ], file);
+        if (!isAllowedType) {
+            console.error(t('inputFile.documentSendError'));
+            return false;
+        }
+        if (file)
+            onUpdateFile(file);
+        return true;
+    };
+    var removeItem = function (file) {
+        if (fileList.some(function (item) { return item === file; })) {
+            onRemoveFile(file);
+        }
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: 'file-input' },
+            React.createElement("label", { style: { color: theme.newChatFormTexts }, htmlFor: '', className: 'file-input__label' }, label),
+            React.createElement("div", { className: 'file-input__container', style: {
+                    backgroundColor: theme.inputBg,
+                    color: theme.newChatFormTexts,
+                } },
+                React.createElement("input", { className: 'file-input__input', type: 'file', id: 'docpicker', hidden: true, accept: '.jpg, .jpeg, .png, .pdf, .doc, .docx, .csv, .mp4', onChange: function (event) { return onChange(event); } }),
+                React.createElement("h4", null, t('inputFile.chooseFile')),
+                React.createElement("button", { className: 'file-input__button', type: 'button', onClick: onUpload, style: {
+                        background: theme === null || theme === void 0 ? void 0 : theme.buttonPrimary,
+                        color: theme === null || theme === void 0 ? void 0 : theme.buttonPrimaryText,
+                    } }, t('inputFile.chooseFile')),
+                loading ? ('') : (React.createElement("p", null,
+                    t('inputFile.allowDocuments'),
+                    "(",
+                    t('inputFile.allowSizeDocument', { maxSize: maxSize }),
+                    ")")))),
+        React.createElement("div", null, fileList &&
+            fileList.map(function (item) { return (React.createElement("div", { className: 'file-input__list', key: item.name, style: {
+                    backgroundColor: theme.inputBg,
+                    color: theme.newChatFormTexts,
+                } },
+                React.createElement("span", { className: 'file-input__list--file-name' }, item.name),
+                React.createElement("button", { className: 'file-input__delete', onClick: function () { return removeItem(item); } },
+                    React.createElement(TrashIcon, { color: theme.newChatFormDeleteFileButton || 'red' })))); }))));
+}
+export default InputFile;
+//# sourceMappingURL=InputFile.js.map

package/dist/esm/app/Messenger/components/InputFile/InputFile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputFile.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/InputFile/InputFile.tsx"],"names":[],"mappings":"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"}

package/dist/esm/app/Messenger/components/MessageBallon/MessageBalloon.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { IMessages } from 'types';
+declare function MessageBalloon({ item, creatorId, formatDate, id, }: {
+    item: IMessages;
+    creatorId?: string;
+    formatDate: (date: string | Date) => string | undefined;
+    id: string;
+}): React.JSX.Element;
+export default MessageBalloon;

package/dist/esm/app/Messenger/components/MessageBallon/MessageBalloon.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import IncomingMessage from '../IncomingMessage/IncomingMessage';
+import SenderMessages from '../SenderMessages/SenderMessages';
+import SystemMessage from '../SystemMessage/SystemMessage';
+function MessageBalloon(_a) {
+    var _b;
+    var item = _a.item, creatorId = _a.creatorId, formatDate = _a.formatDate, id = _a.id;
+    if (item.isSystemMessage) {
+        return (React.createElement(SystemMessage, { formatDate: formatDate, date: item.createdAt, message: item.content, id: item.senderId, user: { name: 'System' } }));
+    }
+    if (item.sender.uniqueCode &&
+        !item.isSystemMessage &&
+        item.sender.uniqueCode === creatorId) {
+        return (React.createElement(React.Fragment, null,
+            React.createElement(SenderMessages, { id: id, formatDate: formatDate, message: item.content, date: item.createdAt, read: item.everybodyHasRead, hasFile: item.hasFile, file: item.file }),
+            item.images &&
+                item.images.map(function (image, index) { return (React.createElement(SenderMessages, { key: image.key, id: "".concat(id, "image-").concat(index), formatDate: formatDate, date: item.createdAt, file: image, message: '', hasFile: true, read: item.everybodyHasRead })); })));
+    }
+    return (React.createElement(React.Fragment, null,
+        React.createElement(IncomingMessage, { id: id, formatDate: formatDate, date: item.createdAt, message: item.content, hasFile: item.hasFile, isSystemMessage: item.isSystemMessage, file: item.file, user: {
+                avatar: (_b = item.sender) === null || _b === void 0 ? void 0 : _b.image,
+                name: item.sender.username,
+            } }),
+        item.images &&
+            item.images.map(function (image, index) {
+                var _a;
+                return (React.createElement(IncomingMessage, { key: image.key, id: "".concat(id, "image-").concat(index), formatDate: formatDate, date: item.createdAt, file: image, message: '', hasFile: true, user: {
+                        avatar: (_a = item.sender) === null || _a === void 0 ? void 0 : _a.image,
+                        name: item.sender.username,
+                    } }));
+            })));
+}
+export default MessageBalloon;
+//# sourceMappingURL=MessageBalloon.js.map

package/dist/esm/app/Messenger/components/MessageBallon/MessageBalloon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessageBalloon.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/MessageBallon/MessageBalloon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,eAAe,MAAM,oCAAoC,CAAA;AAChE,OAAO,cAAc,MAAM,kCAAkC,CAAA;AAC7D,OAAO,aAAa,MAAM,gCAAgC,CAAA;AAE1D,SAAS,cAAc,CAAE,EAUxB;;QATC,IAAI,UAAA,EACJ,SAAS,eAAA,EACT,UAAU,gBAAA,EACV,EAAE,QAAA;IAOF,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;QACzB,OAAO,CACL,oBAAC,aAAa,IACZ,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,EAAE,EAAE,IAAI,CAAC,QAAQ,EACjB,IAAI,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,GACxB,CACH,CAAA;IACH,CAAC;IAED,IACE,IAAI,CAAC,MAAM,CAAC,UAAU;QACtB,CAAC,IAAI,CAAC,eAAe;QACrB,IAAI,CAAC,MAAM,CAAC,UAAU,KAAK,SAAS,EACpC,CAAC;QACD,OAAO,CACL;YACE,oBAAC,cAAc,IACb,EAAE,EAAE,EAAE,EACN,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAC3B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,IAAI,GACf;YAED,IAAI,CAAC,MAAM;gBACV,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,UAAC,KAAc,EAAE,KAAa,IAAK,OAAA,CACjD,oBAAC,cAAc,IACb,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,EAAE,EAAE,UAAG,EAAE,mBAAS,KAAK,CAAE,EACzB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,IAAI,EAAE,KAAK,EACX,OAAO,EAAC,EAAE,EACV,OAAO,EAAE,IAAI,EACb,IAAI,EAAE,IAAI,CAAC,gBAAgB,GAC3B,CACH,EAXkD,CAWlD,CAAC,CACH,CACJ,CAAA;IACH,CAAC;IAED,OAAO,CACL;QACE,oBAAC,eAAe,IACd,EAAE,EAAE,EAAE,EACN,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,eAAe,EAAE,IAAI,CAAC,eAAe,EACrC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE;gBACJ,MAAM,EAAE,MAAA,IAAI,CAAC,MAAM,0CAAE,KAAK;gBAC1B,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;aAC3B,GACD;QAED,IAAI,CAAC,MAAM;YACV,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,UAAC,KAAc,EAAE,KAAa;;gBAAK,OAAA,CACjD,oBAAC,eAAe,IACd,GAAG,EAAE,KAAK,CAAC,GAAG,EACd,EAAE,EAAE,UAAG,EAAE,mBAAS,KAAK,CAAE,EACzB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,IAAI,EAAE,KAAK,EACX,OAAO,EAAC,EAAE,EACV,OAAO,EAAE,IAAI,EACb,IAAI,EAAE;wBACJ,MAAM,EAAE,MAAA,IAAI,CAAC,MAAM,0CAAE,KAAK;wBAC1B,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ;qBAC3B,GACD,CACH,CAAA;aAAA,CAAC,CACH,CACJ,CAAA;AACH,CAAC;AAED,eAAe,cAAc,CAAA"}

package/dist/esm/app/Messenger/components/MessengerAvatar/MessengerAvatar.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IMesssengerAvatar } from 'types';
+declare function MessengerAvatar({ image, children, className, }: IMesssengerAvatar): React.JSX.Element;
+export default MessengerAvatar;

package/dist/esm/app/Messenger/components/MessengerAvatar/MessengerAvatar.js

@@ -0,0 +1,13 @@
+import useTheme from '../../hooks/useThemes';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+function MessengerAvatar(_a) {
+    var image = _a.image, children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b;
+    var t = useTranslation('messengerList').t;
+    var theme = useTheme().theme;
+    return (React.createElement("figure", { className: "".concat(className, " messenger__aside-list-item--avatar"), style: {
+            background: theme.messengerIncomerColor,
+        } }, image ? (React.createElement("img", { loading: 'lazy', alt: t('messengerAvatar.alt'), src: image })) : (children)));
+}
+export default MessengerAvatar;
+//# sourceMappingURL=MessengerAvatar.js.map

package/dist/esm/app/Messenger/components/MessengerAvatar/MessengerAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessengerAvatar.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/MessengerAvatar/MessengerAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAG9C,SAAS,eAAe,CAAE,EAIN;QAHlB,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,iBAAc,EAAd,SAAS,mBAAG,EAAE,KAAA;IAEN,IAAA,CAAC,GAAK,cAAc,CAAC,eAAe,CAAC,EAApC,CAAoC;IACrC,IAAA,KAAK,GAAK,QAAQ,EAAE,MAAf,CAAe;IAC5B,OAAO,CACL,gCACE,SAAS,EAAE,UAAG,SAAS,wCAAqC,EAC5D,KAAK,EAAE;YACL,UAAU,EAAE,KAAK,CAAC,qBAAqB;SACxC,IAEA,KAAK,CAAC,CAAC,CAAC,CACP,6BAAK,OAAO,EAAC,MAAM,EAAC,GAAG,EAAE,CAAC,CAAC,qBAAqB,CAAC,EAAE,GAAG,EAAE,KAAK,GAAI,CAClE,CAAC,CAAC,CAAC,CACF,QAAQ,CACT,CACM,CACV,CAAA;AACH,CAAC;AAED,eAAe,eAAe,CAAA"}

package/dist/esm/app/Messenger/components/MessengerThemeWrapper/MessengerThemeWrapper.d.ts

@@ -0,0 +1,41 @@
+import React, { ReactNode } from 'react';
+declare const defaultThemeVariables: {
+    asideBg: string;
+    asideFontColor: string;
+    messengerMessagesBg: string;
+    headerAndSenderBg: string;
+    buttonPrimary: string;
+    buttonPrimaryText: string;
+    buttonsDisabled: string;
+    uploadFileIconColor: string;
+    messengerNotSelectedBg: string;
+    newChatFormBg: string;
+    newChatFormRadius: string;
+    newChatFormTexts: string;
+    newChatFormDeleteFileButton: string;
+    disclaimerPrimaryColor: string;
+    disclaimerSecondaryColor: string;
+    disclaimerTextColor: string;
+    messengerSenderColor: string;
+    messengerIncomerColor: string;
+    messengerSystemColor: string;
+    borderColor: string;
+    inputBg: string;
+    chatInputBorder: string;
+    listItemHover: string;
+    active: string;
+    activeTabBorter: string;
+    emptyMessagesFontColor: string;
+    documentMessagesTextColor: string;
+};
+type ThemeVariables = typeof defaultThemeVariables;
+type ThemeContextContent = {
+    theme: Partial<ThemeVariables>;
+};
+export declare const MessageThemeContext: React.Context<ThemeContextContent>;
+type Props = {
+    children: ReactNode;
+    theme?: Partial<ThemeVariables>;
+};
+declare const MessageThemeWrapper: ({ children, theme, }: Props) => React.JSX.Element;
+export default MessageThemeWrapper;

package/dist/esm/app/Messenger/components/MessengerThemeWrapper/MessengerThemeWrapper.js

@@ -0,0 +1,40 @@
+import React, { createContext } from 'react';
+var defaultThemeVariables = {
+    asideBg: '#eee',
+    asideFontColor: 'var(--secondary-color)',
+    messengerMessagesBg: '#eeeeee',
+    headerAndSenderBg: '#232831',
+    buttonPrimary: '#25D366',
+    buttonPrimaryText: '#707070',
+    buttonsDisabled: '#94989D',
+    uploadFileIconColor: '#8696a0',
+    messengerNotSelectedBg: '#DDDDDD',
+    newChatFormBg: '',
+    newChatFormRadius: '0  20px 20px 0',
+    newChatFormTexts: '#000',
+    newChatFormDeleteFileButton: '#DD4E4E',
+    disclaimerPrimaryColor: '#4791FF',
+    disclaimerSecondaryColor: '#4791FF',
+    disclaimerTextColor: '#000',
+    messengerSenderColor: '#00A73E',
+    messengerIncomerColor: '#707070',
+    messengerSystemColor: '#2A313A',
+    borderColor: '#AAAAAA',
+    inputBg: 'var(--secondary-color)',
+    chatInputBorder: '',
+    listItemHover: '',
+    active: '',
+    activeTabBorter: '#25D366',
+    emptyMessagesFontColor: '#000',
+    documentMessagesTextColor: '#fff',
+};
+export var MessageThemeContext = createContext({});
+var MessageThemeWrapper = function (_a) {
+    var children = _a.children, _b = _a.theme, theme = _b === void 0 ? defaultThemeVariables : _b;
+    var config = {
+        theme: theme,
+    };
+    return (React.createElement(MessageThemeContext.Provider, { value: config }, children));
+};
+export default MessageThemeWrapper;
+//# sourceMappingURL=MessengerThemeWrapper.js.map

package/dist/esm/app/Messenger/components/MessengerThemeWrapper/MessengerThemeWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MessengerThemeWrapper.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/MessengerThemeWrapper/MessengerThemeWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAa,MAAM,OAAO,CAAA;AAEvD,IAAM,qBAAqB,GAAG;IAC5B,OAAO,EAAE,MAAM;IACf,cAAc,EAAE,wBAAwB;IACxC,mBAAmB,EAAE,SAAS;IAC9B,iBAAiB,EAAE,SAAS;IAC5B,aAAa,EAAE,SAAS;IACxB,iBAAiB,EAAE,SAAS;IAC5B,eAAe,EAAE,SAAS;IAC1B,mBAAmB,EAAE,SAAS;IAC9B,sBAAsB,EAAE,SAAS;IACjC,aAAa,EAAE,EAAE;IACjB,iBAAiB,EAAE,gBAAgB;IACnC,gBAAgB,EAAE,MAAM;IACxB,2BAA2B,EAAE,SAAS;IACtC,sBAAsB,EAAE,SAAS;IACjC,wBAAwB,EAAE,SAAS;IACnC,mBAAmB,EAAE,MAAM;IAC3B,oBAAoB,EAAE,SAAS;IAC/B,qBAAqB,EAAE,SAAS;IAChC,oBAAoB,EAAE,SAAS;IAC/B,WAAW,EAAE,SAAS;IACtB,OAAO,EAAE,wBAAwB;IACjC,eAAe,EAAE,EAAE;IACnB,aAAa,EAAE,EAAE;IACjB,MAAM,EAAE,EAAE;IACV,eAAe,EAAE,SAAS;IAC1B,sBAAsB,EAAE,MAAM;IAC9B,yBAAyB,EAAE,MAAM;CAClC,CAAA;AAQD,MAAM,CAAC,IAAM,mBAAmB,GAAG,aAAa,CAC9C,EAAoC,CACrC,CAAA;AAMD,IAAM,mBAAmB,GAAG,UAAC,EAGrB;QAFN,QAAQ,cAAA,EACR,aAA6B,EAA7B,KAAK,mBAAG,qBAAqB,KAAA;IAE7B,IAAM,MAAM,GAAG;QACb,KAAK,OAAA;KACN,CAAA;IAED,OAAO,CACL,oBAAC,mBAAmB,CAAC,QAAQ,IAAC,KAAK,EAAE,MAAM,IACxC,QAAQ,CACoB,CAChC,CAAA;AACH,CAAC,CAAA;AAED,eAAe,mBAAmB,CAAA"}

package/dist/esm/app/Messenger/components/RenderFileIcon/RenderFileIcon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare const RenderFileIcon: ({ fileType, b64, }: {
+    fileType?: string;
+    b64?: string;
+}) => React.JSX.Element;
+export default RenderFileIcon;

package/dist/esm/app/Messenger/components/RenderFileIcon/RenderFileIcon.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import FileDoc from '../../icons/DOCFileIcon';
+import FilePdf from '../../icons/PDFFileIcon';
+import CSVFileIcon from '../../icons/CSVFileIcon';
+import MP4FileIcon from '../../icons/MP4FileIcon';
+import { useTranslation } from 'react-i18next';
+var RenderFileIcon = function (_a) {
+    var fileType = _a.fileType, b64 = _a.b64;
+    var t = useTranslation('messengerMessages').t;
+    if (fileType === 'application/pdf') {
+        return React.createElement(FilePdf, { width: '40', height: '40' });
+    }
+    else if (fileType === 'application/msword' ||
+        fileType ===
+            'application/vnd.openxmlformats-officedocument.wordprocessingml.document') {
+        return React.createElement(FileDoc, { width: '40', height: '40' });
+    }
+    else if (fileType === 'text/csv') {
+        return React.createElement(CSVFileIcon, { width: '40', height: '40' });
+    }
+    else if (fileType === 'video/mp4') {
+        return React.createElement(MP4FileIcon, { width: '40', height: '40' });
+    }
+    else {
+        return (React.createElement("img", { alt: t('renderFileIcon.altImage'), src: b64, className: 'images-container__image' }));
+    }
+};
+export default RenderFileIcon;
+//# sourceMappingURL=RenderFileIcon.js.map

package/dist/esm/app/Messenger/components/RenderFileIcon/RenderFileIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RenderFileIcon.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/RenderFileIcon/RenderFileIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,OAAO,MAAM,yBAAyB,CAAA;AAC7C,OAAO,OAAO,MAAM,yBAAyB,CAAA;AAC7C,OAAO,WAAW,MAAM,yBAAyB,CAAA;AACjD,OAAO,WAAW,MAAM,yBAAyB,CAAA;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAE9C,IAAM,cAAc,GAAG,UAAC,EAMvB;QALC,QAAQ,cAAA,EACR,GAAG,SAAA;IAKK,IAAA,CAAC,GAAK,cAAc,CAAC,mBAAmB,CAAC,EAAxC,CAAwC;IAEjD,IAAI,QAAQ,KAAK,iBAAiB,EAAE,CAAC;QACnC,OAAO,oBAAC,OAAO,IAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,CAAA;IAC3C,CAAC;SAAM,IACL,QAAQ,KAAK,oBAAoB;QACjC,QAAQ;YACN,yEAAyE,EAC3E,CAAC;QACD,OAAO,oBAAC,OAAO,IAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,CAAA;IAC3C,CAAC;SAAM,IAAI,QAAQ,KAAK,UAAU,EAAE,CAAC;QACnC,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,CAAA;IAC/C,CAAC;SAAM,IAAI,QAAQ,KAAK,WAAW,EAAE,CAAC;QACpC,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,GAAG,CAAA;IAC/C,CAAC;SAAM,CAAC;QACN,OAAO,CACL,6BACE,GAAG,EAAE,CAAC,CAAC,yBAAyB,CAAC,EACjC,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,yBAAyB,GACnC,CACH,CAAA;IACH,CAAC;AACH,CAAC,CAAA;AAED,eAAe,cAAc,CAAA"}

package/dist/esm/app/Messenger/components/SearchInput/SearchInput.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface IProps {
+    searchChat: (value: string, key: string) => void;
+    searchKeys: {
+        label: string;
+        value: string;
+    }[];
+    loadingSearch: boolean;
+}
+declare function SearchInput({ searchChat, searchKeys, loadingSearch }: IProps): React.JSX.Element;
+export default SearchInput;

package/dist/esm/app/Messenger/components/SearchInput/SearchInput.js

@@ -0,0 +1,33 @@
+import SearchIcon from '../../icons/SearchIcon';
+import React, { useState } from 'react';
+import useTheme from '../../hooks/useThemes';
+import { useTranslation } from 'react-i18next';
+function SearchInput(_a) {
+    var searchChat = _a.searchChat, searchKeys = _a.searchKeys, loadingSearch = _a.loadingSearch;
+    var t = useTranslation('messengerList').t;
+    var _b = useState(searchKeys[0].value), searchKey = _b[0], setSearchKey = _b[1];
+    var _c = useState(''), searchValue = _c[0], setSearchValue = _c[1];
+    var theme = useTheme().theme;
+    var onSearch = function (event) {
+        setSearchValue(event.target.value);
+    };
+    var handleKeyPress = function (event) {
+        if (event.key === 'Enter') {
+            searchChat(searchValue, searchKey);
+        }
+    };
+    return (React.createElement("div", { className: 'input-search' },
+        React.createElement("select", { className: 'input-search__select', onChange: function (e) { return setSearchKey(e.target.value); }, style: {
+                color: theme.asideFontColor,
+                border: "".concat(theme.asideFontColor, " 1px solid"),
+            } }, searchKeys.map(function (item, index) { return (React.createElement("option", { className: 'input-search__option', key: index, value: item.value }, item.label)); })),
+        React.createElement("input", { className: 'input-search__search', placeholder: t('searchInput.placeholder'), onChange: onSearch, onKeyDown: handleKeyPress, style: {
+                color: theme.asideFontColor,
+                border: "".concat(theme.asideFontColor, " 1px solid"),
+                borderLeft: 0,
+            } }),
+        React.createElement("button", { className: 'input-search__icon', onClick: function () { return searchChat(searchValue, searchKey); } }, loadingSearch ? (React.createElement("div", { className: 'messenger__messages-loading' },
+            React.createElement("div", { className: 'messenger__messages-loading--loader' }))) : (React.createElement(SearchIcon, null)))));
+}
+export default SearchInput;
+//# sourceMappingURL=SearchInput.js.map

package/dist/esm/app/Messenger/components/SearchInput/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,UAAU,MAAM,wBAAwB,CAAA;AAC/C,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAA;AAQ9C,SAAS,WAAW,CAAE,EAAiD;QAA/C,UAAU,gBAAA,EAAE,UAAU,gBAAA,EAAE,aAAa,mBAAA;IACnD,IAAA,CAAC,GAAK,cAAc,CAAC,eAAe,CAAC,EAApC,CAAoC;IACvC,IAAA,KAA4B,QAAQ,CAAS,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,EAAhE,SAAS,QAAA,EAAE,YAAY,QAAyC,CAAA;IACjE,IAAA,KAAgC,QAAQ,CAAS,EAAE,CAAC,EAAnD,WAAW,QAAA,EAAE,cAAc,QAAwB,CAAA;IAClD,IAAA,KAAK,GAAK,QAAQ,EAAE,MAAf,CAAe;IAE5B,IAAM,QAAQ,GAAG,UAAC,KAA0C;QAC1D,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IACpC,CAAC,CAAA;IAED,IAAM,cAAc,GAAG,UAAC,KAA4C;QAClE,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YAC1B,UAAU,CAAC,WAAW,EAAE,SAAS,CAAC,CAAA;QACpC,CAAC;IACH,CAAC,CAAA;IAED,OAAO,CACL,6BAAK,SAAS,EAAC,cAAc;QAC3B,gCACE,SAAS,EAAC,sBAAsB,EAChC,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAA5B,CAA4B,EAC7C,KAAK,EAAE;gBACL,KAAK,EAAE,KAAK,CAAC,cAAc;gBAC3B,MAAM,EAAE,UAAG,KAAK,CAAC,cAAc,eAAY;aAC5C,IAEA,UAAU,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,IAAK,OAAA,CAC/B,gCACE,SAAS,EAAC,sBAAsB,EAChC,GAAG,EAAE,KAAK,EACV,KAAK,EAAE,IAAI,CAAC,KAAK,IAEhB,IAAI,CAAC,KAAK,CACJ,CACV,EARgC,CAQhC,CAAC,CACK;QAET,+BACE,SAAS,EAAC,sBAAsB,EAChC,WAAW,EAAE,CAAC,CAAC,yBAAyB,CAAC,EACzC,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,cAAc,EACzB,KAAK,EAAE;gBACL,KAAK,EAAE,KAAK,CAAC,cAAc;gBAC3B,MAAM,EAAE,UAAG,KAAK,CAAC,cAAc,eAAY;gBAC3C,UAAU,EAAE,CAAC;aACd,GACD;QAEF,gCACE,SAAS,EAAC,oBAAoB,EAC9B,OAAO,EAAE,cAAM,OAAA,UAAU,CAAC,WAAW,EAAE,SAAS,CAAC,EAAlC,CAAkC,IAEhD,aAAa,CAAC,CAAC,CAAC,CACf,6BAAK,SAAS,EAAC,6BAA6B;YAC1C,6BAAK,SAAS,EAAC,qCAAqC,GAAG,CACnD,CACP,CAAC,CAAC,CAAC,CACF,oBAAC,UAAU,OAAG,CACf,CACM,CACL,CACP,CAAA;AACH,CAAC;AAED,eAAe,WAAW,CAAA"}

package/dist/esm/app/Messenger/components/Select/Select.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface IProps {
+    options: {
+        label: string;
+        value: string;
+    }[];
+    label: string;
+    onChange: (value: string) => void;
+    name: string;
+    placeholder: string;
+    value: string;
+}
+declare function SelectNew({ options, name, placeholder, label, onChange, value, }: IProps): React.JSX.Element;
+export default SelectNew;

package/dist/esm/app/Messenger/components/Select/Select.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import useTheme from '../../hooks/useThemes';
+function SelectNew(_a) {
+    var options = _a.options, name = _a.name, placeholder = _a.placeholder, label = _a.label, onChange = _a.onChange, value = _a.value;
+    var theme = useTheme().theme;
+    return (React.createElement("div", { className: 'form-select' },
+        React.createElement("label", { htmlFor: name, className: 'form-select__label', style: { color: theme.newChatFormTexts } }, label),
+        React.createElement("select", { name: name, className: 'form-select__input', onChange: function (e) { return onChange(e.target.value); }, value: value, style: {
+                backgroundColor: theme.inputBg,
+                color: theme.newChatFormTexts,
+            } },
+            React.createElement("option", { value: '', disabled: true, hidden: true }, placeholder),
+            options.map(function (motivo) { return (React.createElement("option", { key: motivo.value, value: motivo.value }, motivo.label)); }))));
+}
+export default SelectNew;
+//# sourceMappingURL=Select.js.map

package/dist/esm/app/Messenger/components/Select/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAa5C,SAAS,SAAS,CAAE,EAOX;QANP,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,QAAQ,cAAA,EACR,KAAK,WAAA;IAEG,IAAA,KAAK,GAAK,QAAQ,EAAE,MAAf,CAAe;IAC5B,OAAO,CACL,6BAAK,SAAS,EAAC,aAAa;QAC1B,+BACE,OAAO,EAAE,IAAI,EACb,SAAS,EAAC,oBAAoB,EAC9B,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,gBAAgB,EAAE,IAEvC,KAAK,CACA;QACR,gCACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAC,oBAAoB,EAC9B,QAAQ,EAAE,UAAC,CAAC,IAAK,OAAA,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EAAxB,CAAwB,EACzC,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE;gBACL,eAAe,EAAE,KAAK,CAAC,OAAO;gBAC9B,KAAK,EAAE,KAAK,CAAC,gBAAgB;aAC9B;YAED,gCAAQ,KAAK,EAAC,EAAE,EAAC,QAAQ,QAAC,MAAM,UAC7B,WAAW,CACL;YACR,OAAO,CAAC,GAAG,CAAC,UAAC,MAAM,IAAK,OAAA,CACvB,gCAAQ,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,IAC3C,MAAM,CAAC,KAAK,CACN,CACV,EAJwB,CAIxB,CAAC,CACK,CACL,CACP,CAAA;AACH,CAAC;AAED,eAAe,SAAS,CAAA"}

package/dist/esm/app/Messenger/components/SendMessageForm/SendMessageForm.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { IList } from 'types';
+interface IProps {
+    allowImages: boolean;
+    current?: IList;
+    onSubmit: (value: FormData, callback: () => void) => void;
+    file?: File | null;
+    updateFile: (file: File | null) => void;
+    isLoading?: boolean;
+    maxFileSize: string;
+}
+declare function SendMessageForm({ allowImages, current, onSubmit, file, updateFile, isLoading, maxFileSize, }: IProps): React.JSX.Element;
+export default SendMessageForm;

package/dist/esm/app/Messenger/components/SendMessageForm/SendMessageForm.js

@@ -0,0 +1,143 @@
+import useTheme from '../../hooks/useThemes';
+import React, { Fragment, useMemo, useRef, useState, } from 'react';
+import AttachFileIcon from '../../../Messenger/icons/AttachFileIcon';
+import rightArrow from '../../../../assets/right-arrow.svg';
+import { SpinLoading } from '../../views/MessengerMessages';
+import ToolTip from '../Tooltip/Tooltip';
+import { useTranslation } from 'react-i18next';
+function AllowDocuments(_a) {
+    var allowImages = _a.allowImages, attachFile = _a.attachFile, handleFile = _a.handleFile, closedChat = _a.closedChat, maxFileField = _a.maxFileField;
+    var t = useTranslation('messengerMessages').t;
+    if (allowImages) {
+        return (React.createElement(Fragment, null,
+            React.createElement("input", { type: 'file', size: 1, className: 'messenger__messages-send--file', ref: attachFile, onChange: handleFile, accept: '.jpg, .jpeg, .png, .pdf, .doc, .docx, .mp4, .csv' }),
+            React.createElement(ToolTip, { text: t('sendMessageForm.maxFileField', { maxFileField: maxFileField }) },
+                React.createElement(AttachFileIcon, { className: "messenger__messages-send__attach ".concat(closedChat ? 'messenger__messages-send__attach--disabled' : ''), onClick: function () { var _a; return (!closedChat ? (_a = attachFile.current) === null || _a === void 0 ? void 0 : _a.click() : null); } }))));
+    }
+    return React.createElement(React.Fragment, null);
+}
+function SendMessageForm(_a) {
+    var allowImages = _a.allowImages, current = _a.current, onSubmit = _a.onSubmit, file = _a.file, updateFile = _a.updateFile, isLoading = _a.isLoading, maxFileSize = _a.maxFileSize;
+    var t = useTranslation('messengerMessages').t;
+    var _b = useState(100), formHeight = _b[0], setFormHeight = _b[1];
+    var _c = useState(false), sending = _c[0], setSending = _c[1];
+    var inputRef = useRef(null);
+    var attachFile = useRef(null);
+    var closedChat = useMemo(function () { return (current === null || current === void 0 ? void 0 : current.status.current.state) === 'final'; }, [current]);
+    var theme = useTheme().theme;
+    function correctTextAreaHeight(styleConfig) {
+        var textarea = inputRef.current;
+        if (textarea) {
+            textarea.style.height = "".concat(styleConfig.height, "px");
+            textarea.style.overflowY = styleConfig.overflow;
+        }
+    }
+    function resetHeights() {
+        var inicialFormHeight = 100;
+        var inicialTextAreaHeight = 50;
+        setFormHeight(inicialFormHeight);
+        correctTextAreaHeight({ height: inicialTextAreaHeight, overflow: 'hidden' });
+    }
+    function adjustFormHeight(textareaRef) {
+        if (textareaRef) {
+            var initialHeight = 50;
+            var maxHeight = 80;
+            var newHeight = textareaRef.scrollHeight;
+            if (newHeight > maxHeight) {
+                correctTextAreaHeight({
+                    height: maxHeight,
+                    overflow: 'auto',
+                });
+                return maxHeight + initialHeight;
+            }
+            correctTextAreaHeight({
+                height: initialHeight,
+                overflow: 'auto',
+            });
+            return initialHeight * 2;
+        }
+        return formHeight;
+    }
+    function handleTextareaChange() {
+        var textarea = inputRef.current;
+        setFormHeight(adjustFormHeight(textarea));
+    }
+    function handleSubmit(e) {
+        var _a, _b;
+        e === null || e === void 0 ? void 0 : e.preventDefault();
+        if (sending)
+            return;
+        setSending(true);
+        var data = new FormData();
+        if (file)
+            data.append('file', file);
+        if ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.value)
+            data.append('message', (_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.value);
+        onSubmit(data, function () {
+            if (inputRef.current)
+                inputRef.current.value = '';
+            if (file)
+                updateFile(null);
+            setSending(false);
+            resetHeights();
+        });
+    }
+    function handleFile(e) {
+        var _a;
+        if (e.target.files) {
+            var file_1 = e.target.files[0];
+            var allowedTypes = [
+                'image/png',
+                'image/jpeg',
+                'application/pdf',
+                'application/msword',
+                'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+                'text/csv',
+                'video/mp4',
+            ];
+            var allowedExtensions = [
+                'png',
+                'jpeg',
+                'jpg',
+                'pdf',
+                'doc',
+                'docx',
+                'csv',
+                'mp4',
+            ];
+            var fileType = file_1 === null || file_1 === void 0 ? void 0 : file_1.type;
+            var fileExtension = (_a = file_1 === null || file_1 === void 0 ? void 0 : file_1.name.split('.').pop()) === null || _a === void 0 ? void 0 : _a.toLowerCase();
+            var isAllowed = fileType
+                ? allowedTypes.includes(fileType)
+                : fileExtension
+                    ? allowedExtensions.includes(fileExtension)
+                    : false;
+            if (isAllowed) {
+                updateFile(file_1);
+            }
+        }
+    }
+    return (React.createElement("form", { onSubmit: handleSubmit, className: 'messenger__messages-send--form', style: {
+            height: "".concat(formHeight, "px"),
+            maxHeight: '150px',
+        } },
+        React.createElement("div", { className: 'messenger__messages-send__input-container' },
+            React.createElement("textarea", { onChange: handleTextareaChange, placeholder: closedChat
+                    ? t('sendMessageForm.chatEnded')
+                    : t('sendMessageForm.typeMessage'), ref: inputRef, onKeyDown: function (e) {
+                    if (e.key === 'Enter' && !e.shiftKey) {
+                        e.preventDefault();
+                        handleSubmit();
+                    }
+                }, className: "messenger__messages-send__input ".concat(closedChat || sending ? 'messenger__messages-send__input--disabled' : '', " "), disabled: closedChat || sending, style: {
+                    backgroundColor: theme === null || theme === void 0 ? void 0 : theme.inputBg,
+                } }),
+            React.createElement(AllowDocuments, { allowImages: allowImages, handleFile: handleFile, attachFile: attachFile, closedChat: closedChat, maxFileField: maxFileSize })),
+        isLoading ? (React.createElement("div", { className: 'messenger__messages-sending' },
+            React.createElement(SpinLoading, null))) : (React.createElement("button", { type: 'submit', className: "messenger__messages-send__button ".concat(closedChat || sending ? 'messenger__messages-send__button--disabled' : ''), disabled: closedChat || sending, style: {
+                backgroundColor: theme === null || theme === void 0 ? void 0 : theme.buttonPrimary,
+            } },
+            React.createElement("img", { alt: t('sendMessageForm.rightIcon'), height: 25, width: 25, className: 'ml-1', src: rightArrow })))));
+}
+export default SendMessageForm;
+//# sourceMappingURL=SendMessageForm.js.map

package/dist/esm/app/Messenger/components/SendMessageForm/SendMessageForm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SendMessageForm.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/SendMessageForm/SendMessageForm.tsx"],"names":[],"mappings":"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"}

package/dist/esm/app/Messenger/components/SenderMessages/SenderMessages.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IMessagesBalloon } from 'types';
+declare function SenderMessages({ date, message, read, hasFile, file, formatDate, id, }: IMessagesBalloon): React.JSX.Element;
+export default SenderMessages;

package/dist/esm/app/Messenger/components/SenderMessages/SenderMessages.js

@@ -0,0 +1,43 @@
+import useTheme from '../../hooks/useThemes';
+import React, { useCallback, useState } from 'react';
+import ReadIcon from '../../icons/ReadIcon';
+import ReactSimpleImageViewer from 'react-simple-image-viewer';
+import { MessageImage } from '../IncomingMessage/IncomingMessage';
+import DocMessage from '../DocMessage/DocMessage';
+function SenderMessages(_a) {
+    var _b, _c;
+    var date = _a.date, message = _a.message, read = _a.read, hasFile = _a.hasFile, file = _a.file, formatDate = _a.formatDate, id = _a.id;
+    var _d = useState(0), currentImage = _d[0], setCurrentImage = _d[1];
+    var _e = useState(false), isViewerOpen = _e[0], setIsViewerOpen = _e[1];
+    var theme = useTheme().theme;
+    var openImageViewer = useCallback(function (index) {
+        setCurrentImage(index);
+        setIsViewerOpen(true);
+    }, []);
+    var closeImageViewer = function () {
+        setCurrentImage(0);
+        setIsViewerOpen(false);
+    };
+    var isDoc = [
+        'application/msword',
+        'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+        'application/pdf',
+        'text/csv',
+        'video/mp4',
+    ].includes((_b = file === null || file === void 0 ? void 0 : file.mimetype) !== null && _b !== void 0 ? _b : '');
+    return (React.createElement("div", { className: 'messenger__messages-row--sender' },
+        React.createElement("div", { className: 'messenger__messages-sender', id: id, style: {
+                background: theme === null || theme === void 0 ? void 0 : theme.messengerSenderColor,
+                color: theme === null || theme === void 0 ? void 0 : theme.documentMessagesTextColor,
+            } },
+            React.createElement("span", null,
+                hasFile &&
+                    (isDoc ? (React.createElement(DocMessage, { date: date, message: message, read: read, file: file, formatDate: formatDate, id: id })) : (React.createElement(MessageImage, { src: file === null || file === void 0 ? void 0 : file.location, onClick: function () { return openImageViewer(currentImage); } }))),
+                React.createElement("p", { className: 'messenger__message' }, message),
+                React.createElement("div", { className: 'messenger__message--bottom' },
+                    React.createElement("p", { className: 'messenger__message--date' }, (_c = formatDate(date)) !== null && _c !== void 0 ? _c : new Date(date).toString()),
+                    React.createElement(ReadIcon, { fill: read ? '#00efff' : 'white' })))),
+        file && !isDoc && isViewerOpen && (React.createElement(ReactSimpleImageViewer, { src: [file.location], currentIndex: 0, disableScroll: false, closeOnClickOutside: true, onClose: closeImageViewer }))));
+}
+export default SenderMessages;
+//# sourceMappingURL=SenderMessages.js.map

package/dist/esm/app/Messenger/components/SenderMessages/SenderMessages.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SenderMessages.js","sourceRoot":"","sources":["../../../../../../src/app/Messenger/components/SenderMessages/SenderMessages.tsx"],"names":[],"mappings":"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"}

package/dist/esm/app/Messenger/components/SystemMessage/SystemMessage.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IInconmingMessage } from 'types';
+declare function SystemMessage({ date, message, formatDate, id }: IInconmingMessage): React.JSX.Element;
+export default SystemMessage;