@mindly/ui-components 5.98.18 → 5.98.20

package/dist/cjs/lib/Chat/ChatMessage/ChatMessage.js

@@ -1,236 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const ChatMessage_style_1 = require("./ChatMessage.style");
-const bubble_svg_1 = require("./bubble.svg");
-const react_2 = require("@ionic/react");
-const icons_1 = require("ionicons/icons");
-const luxon_1 = require("luxon");
-const html_react_parser_1 = __importDefault(require("html-react-parser"));
-const react_photo_view_1 = require("react-photo-view");
-const lib2_1 = require("../../../lib2");
-const utils_1 = require("../utils");
-function setHttp(link) {
-    //eslint-disable-next-line no-useless-escape
-    if (link.search(/^http[s]?\:\/\//) == -1) {
-        link = 'https://' + link;
-    }
-    return link;
-}
-const matchAndReplaceLinkToATag = (message, messageType) => {
-    const expression = 
-    // eslint-disable-next-line max-len
-    /(https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|www\.[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.[a-zA-Z0-9]+\.[^\s]{2,})/gi;
-    const regex = RegExp(expression);
-    return message.split(regex).map((textPart, index) => regex.test(textPart) ? ((0, jsx_runtime_1.jsx)("a", Object.assign({ className: "text-link", href: setHttp(textPart), target: "_blank", rel: "noreferrer" }, { children: textPart }), index)) : ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: messageType === 'system' || messageType === 'broadcast'
-            ? (0, html_react_parser_1.default)(textPart)
-            : textPart })));
-};
-const fileSizeNormalize = (bytes, si = false, dp = 1) => {
-    const thresh = si ? 1000 : 1024;
-    if (Math.abs(bytes) < thresh) {
-        return bytes + ' B';
-    }
-    const units = si
-        ? ['KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB']
-        : ['kB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-    let u = -1;
-    const r = Math.pow(10, dp);
-    do {
-        bytes /= thresh;
-        ++u;
-    } while (Math.round(Math.abs(bytes) * r) / r >= thresh &&
-        u < units.length - 1);
-    return bytes.toFixed(dp) + ' ' + units[u];
-};
-// eslint-disable-next-line react/display-name
-const MessageTime = react_1.default.memo(({ position, time, timeZone, status }) => {
-    const messageDate = luxon_1.DateTime.fromMillis(time)
-        .setLocale('uk')
-        .setZone(timeZone);
-    const isToday = messageDate.hasSame(luxon_1.DateTime.now().setZone(timeZone), 'day');
-    return ((0, jsx_runtime_1.jsxs)(ChatMessage_style_1.TimeStyled, Object.assign({ position: position }, { children: [(0, jsx_runtime_1.jsx)("span", Object.assign({ className: "time" }, { children: messageDate.toLocaleString(isToday ? luxon_1.DateTime.TIME_SIMPLE : luxon_1.DateTime.DATETIME_SHORT) })), position === 'right' &&
-                (status === 'loading' ? ((0, jsx_runtime_1.jsx)(react_2.IonSpinner, { name: "crescent" })) : ((0, jsx_runtime_1.jsx)(react_2.IonIcon, { icon: status === 'viewed' ? icons_1.checkmarkDoneOutline : icons_1.checkmarkOutline })))] })));
-});
-const ChatMessage = ({ message, position = 'right', time, timeZone = 'Europe/Kiev', status, messageType = 'text', onFileClick, fileInfo, locale = 'uk', fileUrl, buttons, }) => {
-    var _a;
-    const [currentMessage, setCurrentMessage] = (0, react_1.useState)(typeof message === 'string' ? message : '');
-    const [isVideoPlaying, setVideoPlaying] = (0, react_1.useState)(false);
-    const [videoTime, setVideoTime] = (0, react_1.useState)(null);
-    const [maxWidth, setMaxWidth] = (0, react_1.useState)(0);
-    const [maxHeight] = (0, react_1.useState)(350);
-    const [mediaContainerSize, setMediaContainerSize] = (0, react_1.useState)({
-        width: '100%',
-        height: '350px',
-    });
-    const videoRef = (0, react_1.useRef)(null);
-    const messageRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        if (message instanceof File) {
-            const fr = new FileReader();
-            fr.onload = () => {
-                setCurrentMessage(fr.result);
-            };
-            fr.readAsDataURL(message);
-        }
-        else {
-            setCurrentMessage(message);
-        }
-    }, [message]);
-    (0, react_1.useEffect)(() => {
-        var _a;
-        if (!messageRef.current)
-            return;
-        setMaxWidth(((_a = messageRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) ? messageRef.current.offsetWidth - 2 : 0);
-        window.addEventListener('resize', () => {
-            var _a;
-            return setMaxWidth(((_a = messageRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) ? messageRef.current.offsetWidth - 2 : 0);
-        });
-        return () => {
-            window.removeEventListener('resize', () => setMaxWidth(0));
-        };
-    }, []);
-    (0, react_1.useEffect)(() => {
-        if (!(messageRef === null || messageRef === void 0 ? void 0 : messageRef.current))
-            return;
-        if (messageType === 'image' ||
-            messageType === 'video' ||
-            (messageType === 'broadcast' && fileUrl)) {
-            if ((fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.width) && (fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.height)) {
-                let width = fileInfo.width;
-                let height = fileInfo.height;
-                let ratio = 0;
-                if (width > maxWidth) {
-                    ratio = maxWidth / width;
-                    height = height * ratio;
-                    width = width * ratio;
-                }
-                if (height > maxHeight) {
-                    ratio = maxHeight / height;
-                    width = width * ratio;
-                }
-                setMediaContainerSize({
-                    width: `${Math.round(width) + (messageType !== 'broadcast' ? 2 : 1)}px`,
-                    height: `${Math.round(height > 350 ? 350 : height) + 2}px`,
-                });
-            }
-        }
-    }, [
-        message,
-        maxWidth,
-        fileUrl,
-        messageType,
-        fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.width,
-        fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.height,
-        maxHeight,
-    ]);
-    (0, react_1.useEffect)(() => {
-        var _a, _b;
-        if (!videoRef.current)
-            return;
-        (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('play', handlePlayVideoState);
-        (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.addEventListener('pause', handlePlayVideoState);
-        return () => {
-            var _a, _b;
-            (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('play', handlePlayVideoState);
-            (_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.removeEventListener('pause', handlePlayVideoState);
-        };
-    }, [videoRef]);
-    (0, react_1.useEffect)(() => {
-        if (!videoRef.current)
-            return;
-        let countInterval = 0;
-        const i = setInterval(function () {
-            var _a, _b;
-            countInterval++;
-            if (((_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.readyState) && ((_b = videoRef.current) === null || _b === void 0 ? void 0 : _b.readyState) > 0) {
-                const minutes = Math.floor(videoRef.current.duration / 60);
-                const seconds = Math.floor(videoRef.current.duration % 60);
-                setVideoTime(`${minutes}:${seconds < 10 ? `0${seconds}` : seconds}`);
-                clearInterval(i);
-            }
-            else if (countInterval >= 20) {
-                clearInterval(i);
-            }
-        }, 200);
-    }, [videoRef, message]);
-    const handlePlayVideoState = (0, react_1.useCallback)(() => {
-        var _a;
-        if (!videoRef.current)
-            return;
-        if ((_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.paused) {
-            videoRef.current.removeAttribute('controls');
-            setVideoPlaying(false);
-        }
-        else {
-            videoRef.current.setAttribute('controls', '');
-            setVideoPlaying(true);
-        }
-    }, [videoRef]);
-    const handlePlayVideo = (0, react_1.useCallback)(() => {
-        if (!videoRef.current)
-            return;
-        const video = videoRef.current;
-        if ((video === null || video === void 0 ? void 0 : video.paused) || (video === null || video === void 0 ? void 0 : video.ended)) {
-            video.play();
-        }
-    }, [videoRef]);
-    let content;
-    switch (messageType) {
-        case 'text':
-            content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(ChatMessage_style_1.TextMessageWrapper, { children: [(0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageText, { children: matchAndReplaceLinkToATag(currentMessage.trim()) }), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageTimeWrapper, { children: (0, jsx_runtime_1.jsx)(MessageTime, { time: time, status: status, timeZone: timeZone, position: position }) })] }), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageBubble, Object.assign({ position: position }, { children: (0, jsx_runtime_1.jsx)(bubble_svg_1.ReactComponent, {}) }))] }));
-            break;
-        case 'system':
-            content = ((0, jsx_runtime_1.jsxs)(ChatMessage_style_1.TextMessageWrapper, { children: [(0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageText, { children: matchAndReplaceLinkToATag((0, utils_1.timeNormalize)(currentMessage.trim(), timeZone, locale), 'system') }), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageTimeWrapper, { children: (0, jsx_runtime_1.jsx)(MessageTime, { time: time, status: status, timeZone: timeZone, position: position }) })] }));
-            break;
-        case 'image':
-            content = ((0, jsx_runtime_1.jsx)(react_photo_view_1.PhotoProvider, { children: (0, jsx_runtime_1.jsx)(react_photo_view_1.PhotoView, Object.assign({ src: currentMessage }, { children: (0, jsx_runtime_1.jsxs)(ChatMessage_style_1.ImageMessageWrapper, Object.assign({ position: position, style: Object.assign({}, mediaContainerSize) }, { children: [(0, jsx_runtime_1.jsx)("img", { src: currentMessage }), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.ImageTimeWrapper, Object.assign({ position: position }, { children: (0, jsx_runtime_1.jsx)(MessageTime, { time: time, status: status, timeZone: timeZone, position: position }) }))] })) })) }));
-            break;
-        case 'file':
-            content = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(ChatMessage_style_1.FileMessageWrapper, Object.assign({ position: position, onClick: () => status !== 'loading'
-                            ? onFileClick === null || onFileClick === void 0 ? void 0 : onFileClick('file', currentMessage)
-                            : null }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "file-icon-wrapper" }, { children: (0, jsx_runtime_1.jsx)(react_2.IonIcon, { icon: icons_1.document }) })), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: "file-name" }, { children: fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.originalName })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "file-size" }, { children: fileSizeNormalize((_a = fileInfo === null || fileInfo === void 0 ? void 0 : fileInfo.size) !== null && _a !== void 0 ? _a : 0, false, 1) }))] }), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.FileTimeWrapper, { children: (0, jsx_runtime_1.jsx)(MessageTime, { time: time, status: status, timeZone: timeZone, position: position }) })] })), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageBubble, Object.assign({ position: position }, { children: (0, jsx_runtime_1.jsx)(bubble_svg_1.ReactComponent, {}) }))] }));
-            break;
-        case 'video':
-            content = ((0, jsx_runtime_1.jsxs)(ChatMessage_style_1.VideoMessageWrapper, Object.assign({ position: position, style: Object.assign({}, mediaContainerSize) }, { children: [(0, jsx_runtime_1.jsx)("video", { ref: videoRef, src: currentMessage, autoPlay: true, muted: true, playsInline: true }), !isVideoPlaying && ((0, jsx_runtime_1.jsx)("button", Object.assign({ className: "play-button", onClick: handlePlayVideo }, { children: (0, jsx_runtime_1.jsx)(react_2.IonIcon, { icon: icons_1.playOutline }) }))), !isVideoPlaying && videoTime && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "video-time" }, { children: videoTime }))), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: "video-send-time" }, { children: (0, jsx_runtime_1.jsx)(MessageTime, { time: time, status: status, timeZone: timeZone, position: position }) }))] })));
-            break;
-        case 'broadcast':
-            content = ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'flex flex-col' }, { children: [fileUrl && ((0, jsx_runtime_1.jsx)(react_photo_view_1.PhotoProvider, { children: (0, jsx_runtime_1.jsx)(react_photo_view_1.PhotoView, Object.assign({ src: fileUrl }, { children: (0, jsx_runtime_1.jsx)(ChatMessage_style_1.ImageMessageWrapper, Object.assign({ position: position, messageType: messageType, style: Object.assign({}, mediaContainerSize) }, { children: (0, jsx_runtime_1.jsx)("img", { src: fileUrl }) })) })) })), (0, jsx_runtime_1.jsxs)(ChatMessage_style_1.TextMessageWrapper, { children: [(0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageText, { children: matchAndReplaceLinkToATag((0, utils_1.timeNormalize)(currentMessage.trim(), timeZone, locale), 'broadcast') }), (buttons === null || buttons === void 0 ? void 0 : buttons.length) && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'flex flex-row gap-2 mt-3 mb-2' }, { children: buttons === null || buttons === void 0 ? void 0 : buttons.map((button, index) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'w-full' }, { children: (0, jsx_runtime_1.jsx)(lib2_1.Button_v2, Object.assign({ className: 'w-full', onClick: button.onClickHandler }, { children: button === null || button === void 0 ? void 0 : button.text })) }), `${button === null || button === void 0 ? void 0 : button.text}_${index}`))) }))), (0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageTimeWrapper, { children: (0, jsx_runtime_1.jsx)(MessageTime, { time: time, status: status, timeZone: timeZone, position: position }) })] })] })));
-            break;
-    }
-    return ((0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageContainer, { children: (0, jsx_runtime_1.jsx)(ChatMessage_style_1.MessageWrapper, Object.assign({ ref: messageRef, position: position, messageType: messageType, style: messageType === 'video' || messageType === 'image'
-                ? Object.assign({}, mediaContainerSize) : messageType === 'broadcast' && fileUrl
-                ? {
-                    minHeight: mediaContainerSize === null || mediaContainerSize === void 0 ? void 0 : mediaContainerSize.height,
-                    width: mediaContainerSize.width,
-                }
-                : {} }, { children: content })) }));
-};
-exports.default = react_1.default.memo(ChatMessage);

package/dist/cjs/lib/Chat/ChatMessage/ChatMessage.style.js

@@ -1,284 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.VideoMessageWrapper = exports.FileTimeWrapper = exports.FileMessageWrapper = exports.TimeStyled = exports.MessageContainer = exports.MessageTimeWrapper = exports.MessageText = exports.MessageBubble = exports.ImageTimeWrapper = exports.ImageMessageWrapper = exports.TextMessageWrapper = exports.MessageWrapper = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-exports.MessageWrapper = styled_components_1.default.div `
-  background: ${({ position, messageType }) => messageType === 'system' || messageType === 'broadcast'
-    ? '#D6F2F9'
-    : position === 'right'
-        ? '#e1fec6'
-        : '#ffffff'};
-  border-radius: ${({ messageType, position }) => messageType === 'system' || messageType === 'broadcast'
-    ? '18px 18px 18px 8px'
-    : messageType === 'image' || messageType === 'video'
-        ? position === 'left'
-            ? '18px 18px 18px 8px'
-            : '18px 18px 8px 18px'
-        : '18px'};
-  max-width: 95%;
-  width: ${({ messageType }) => messageType === 'video' || messageType === 'image' ? '100%' : 'auto'};
-  min-height: 100%;
-  align-self: ${({ position }) => position === 'right' ? 'flex-end' : 'flex-start'};
-  display: flex;
-  position: relative;
-  overflow: ${({ messageType }) => messageType === 'image' || messageType === 'video' ? 'hidden' : 'initial'};
-`;
-exports.TextMessageWrapper = styled_components_1.default.div `
-  padding: 9px 12px 3px 12px;
-  min-width: 100px;
-`;
-exports.ImageMessageWrapper = styled_components_1.default.div `
-  border-image-width: 0;
-  line-height: 0;
-  font-size: 0;
-  padding: 1px;
-  cursor: pointer;
-
-  & img {
-    max-width: 100%;
-    height: auto;
-    max-height: 350px;
-    object-fit: cover;
-    border-radius: ${({ position, messageType }) => {
-    if (messageType === 'broadcast') {
-        return '18px 18px 0 0';
-    }
-    return position === 'left' ? '18px 18px 18px 8px' : '18px 18px 8px 18px';
-}};
-  }
-`;
-exports.ImageTimeWrapper = styled_components_1.default.div `
-  position: absolute;
-  bottom: 6px;
-  right: 6px;
-  z-index: 10;
-  background: rgba(29, 32, 31, 0.7);
-  border-radius: 100px;
-  height: 18px;
-  padding-right: 4px;
-  padding-left: 4px;
-
-  & .time {
-    color: #ffffff;
-  }
-
-  & ion-icon {
-    font-size: 18px;
-    color: #ffffff;
-  }
-
-  & ion-spinner {
-    --color: #ffffff !important;
-  }
-`;
-exports.MessageBubble = styled_components_1.default.div `
-  position: absolute;
-  bottom: 0;
-  right: ${({ position }) => (position === 'right' ? '-9px' : 'initial')};
-  left: ${({ position }) => (position === 'left' ? '-9px' : 'initial')};
-  transform: ${({ position }) => position === 'left' ? 'rotateY(180deg)' : 'none'};
-  width: 24px;
-  height: 17px;
-  z-index: 0;
-  color: ${({ position }) => (position === 'right' ? '#e1fec6' : '#ffffff')};
-`;
-exports.MessageText = styled_components_1.default.div `
-  position: relative;
-  z-index: 10;
-  text-align: justify;
-  font-style: normal;
-  font-weight: 400;
-  font-size: 14px;
-  line-height: 16px;
-  color: #000000;
-  padding-bottom: 5px;
-  white-space: pre-wrap;
-  word-break: break-word;
-  width: 100%;
-
-  b {
-    font-style: normal;
-    font-weight: 600;
-    font-size: 14px;
-    line-height: 16px;
-    color: #1d201f;
-  }
-`;
-exports.MessageTimeWrapper = styled_components_1.default.span `
-  direction: ltr;
-  display: flex;
-  justify-content: flex-end;
-  font-size: 18px;
-  height: 18px;
-  flex: 1;
-  line-height: 1;
-  pointer-events: none;
-  user-select: none;
-  vertical-align: middle;
-  visibility: hidden;
-  z-index: 1;
-  margin-left: 4px;
-  padding-right: 0;
-`;
-exports.MessageContainer = styled_components_1.default.div `
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-`;
-exports.TimeStyled = styled_components_1.default.div `
-  align-items: center;
-  bottom: 0;
-  display: flex;
-  height: 18px;
-  line-height: 1;
-  padding: inherit;
-  pointer-events: all;
-  right: 0;
-  visibility: visible;
-  white-space: nowrap;
-  color: ${({ position }) => (position === 'right' ? '#2da430' : '#8E8E93')};
-  column-gap: 4px;
-
-  & .time {
-    font-size: 10px;
-    line-height: 14px;
-  }
-
-  & ion-icon {
-    --ionicon-stroke-width: 32px;
-  }
-
-  & ion-spinner {
-    width: 18px;
-    height: 18px;
-    --color: #2da430;
-  }
-`;
-exports.FileMessageWrapper = styled_components_1.default.div `
-  display: flex;
-  cursor: pointer;
-  align-items: center;
-  column-gap: 10px;
-  padding: 13px 20px 13px 10px;
-
-  & .file-icon-wrapper {
-    display: flex;
-    flex: 0 0 40px;
-    width: 40px;
-    height: 40px;
-    align-items: center;
-    justify-content: center;
-    background: #177590;
-    border-radius: 50%;
-    color: #ffffff;
-    font-size: 18px;
-  }
-
-  & .file-name {
-    font-style: normal;
-    font-weight: 400;
-    font-size: 14px;
-    line-height: 16px;
-    color: ${({ position }) => (position === 'right' ? '#3EAA3C' : '#177590')};
-    margin-bottom: 2px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    line-clamp: 2;
-    -webkit-box-orient: vertical;
-    word-break: break-word;
-  }
-
-  & .file-size {
-    font-style: normal;
-    font-weight: 400;
-    font-size: 12px;
-    line-height: 14px;
-    color: ${({ position }) => (position === 'right' ? '#3EAA3C' : '#8e8e93')};
-    text-transform: capitalize;
-  }
-`;
-exports.FileTimeWrapper = styled_components_1.default.div `
-  position: absolute;
-  bottom: 2px;
-  right: 6px;
-  z-index: 10;
-  height: 18px;
-  padding-right: 4px;
-  padding-left: 4px;
-`;
-exports.VideoMessageWrapper = styled_components_1.default.div `
-  position: relative;
-  border-image-width: 0;
-  line-height: 0;
-  font-size: 0;
-  padding: 1px;
-
-  & video {
-    max-width: 100%;
-    height: auto;
-    max-height: 350px;
-    object-fit: cover;
-    border-radius: ${({ position }) => position === 'left' ? '18px 18px 18px 8px' : '18px 18px 8px 18px'};
-  }
-
-  & .play-button {
-    position: absolute;
-    padding: 0 0 0 3px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    width: 40px;
-    height: 40px;
-    border-radius: 50%;
-    background: rgba(29, 32, 31, 0.7);
-    color: #ffffff;
-    font-size: 22px;
-  }
-
-  & .video-time {
-    position: absolute;
-    top: 7px;
-    left: ${({ position }) => (position === 'right' ? '7px' : 'inherit')};
-    right: ${({ position }) => (position === 'left' ? '7px' : 'inherit')};
-    background: rgba(29, 32, 31, 0.7);
-    padding: 2px 6px;
-    font-weight: 400;
-    font-size: 10px;
-    line-height: 14px;
-    color: #ffffff;
-    border-radius: 100px;
-  }
-
-  & .video-send-time {
-    position: absolute;
-    bottom: 6px;
-    right: 6px;
-    z-index: 10;
-    background: rgba(29, 32, 31, 0.7);
-    border-radius: 100px;
-    height: 18px;
-    padding-right: 4px;
-    padding-left: 4px;
-
-    & .time {
-      color: #ffffff;
-    }
-
-    & ion-icon {
-      font-size: 18px;
-      color: #ffffff;
-    }
-
-    & ion-spinner {
-      --color: #ffffff !important;
-    }
-  }
-`;

package/dist/cjs/lib/Chat/ChatMessage/index.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var ChatMessage_1 = require("./ChatMessage");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChatMessage_1).default; } });

package/dist/cjs/lib/Chat/ChatMessageSkeleton/ChatMessageSkeleton.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const ChatMessageSkeleton_style_1 = require("./ChatMessageSkeleton.style");
-const react_1 = require("@ionic/react");
-const MessageSkeleton = ({ isBigger, position }) => {
-    return ((0, jsx_runtime_1.jsx)(ChatMessageSkeleton_style_1.SkeletonMessageWrapper, Object.assign({ position: position, isBigger: isBigger }, { children: (0, jsx_runtime_1.jsx)(react_1.IonSkeletonText, { animated: true }) })));
-};
-const ChatMessageSkeleton = () => {
-    return ((0, jsx_runtime_1.jsxs)(ChatMessageSkeleton_style_1.SkeletonWrapper, { children: [(0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "left", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "right", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "left", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "right", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "left", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "right", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "left", isBigger: true }), (0, jsx_runtime_1.jsx)(MessageSkeleton, { position: "right", isBigger: true })] }));
-};
-exports.default = ChatMessageSkeleton;

package/dist/cjs/lib/Chat/ChatMessageSkeleton/ChatMessageSkeleton.style.js

@@ -1,55 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SkeletonMessageWrapper = exports.SkeletonWrapper = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-exports.SkeletonWrapper = styled_components_1.default.div `
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  height: 100%;
-  row-gap: 6px;
-
-  & > ion-skeleton-text {
-    background-image: linear-gradient(
-      to right,
-      rgba(238, 238, 238, 0.7) 8%,
-      rgba(238, 238, 238, 0.8) 18%,
-      rgba(238, 238, 238, 0.7) 33%
-    );
-    --background: #eeeeee;
-  }
-`;
-exports.SkeletonMessageWrapper = styled_components_1.default.div `
-  position: relative;
-  width: 90%;
-  align-self: ${({ position }) => position === 'right' ? 'flex-end' : 'flex-start'};
-
-  & > ion-skeleton-text {
-    width: 100%;
-    height: ${({ isBigger }) => (isBigger ? '110px' : '48px')};
-    border-radius: 18px;
-    margin: 0;
-    background-image: linear-gradient(
-      to right,
-      rgba(238, 238, 238, 0.7) 8%,
-      rgba(238, 238, 238, 0.8) 18%,
-      rgba(238, 238, 238, 0.7) 33%
-    );
-    --background: #eeeeee;
-  }
-
-  & > svg {
-    position: absolute;
-    bottom: 0;
-    right: ${({ position }) => (position === 'right' ? '-9px' : 'initial')};
-    left: ${({ position }) => (position === 'left' ? '-9px' : 'initial')};
-    transform: ${({ position }) => position === 'left' ? 'rotateY(180deg)' : 'none'};
-    width: 24px;
-    height: 17px;
-    z-index: 0;
-    color: #eeeeee;
-  }
-`;

package/dist/cjs/lib/Chat/ChatMessageSkeleton/index.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var ChatMessageSkeleton_1 = require("./ChatMessageSkeleton");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(ChatMessageSkeleton_1).default; } });

package/dist/cjs/lib/Chat/EmptyChatList/EmptyChatList.js

@@ -1,15 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importDefault(require("react"));
-const EmptyChatList_style_1 = require("./EmptyChatList.style");
-const react_2 = require("@ionic/react");
-const icons_1 = require("ionicons/icons");
-const CustomButton_1 = __importDefault(require("../../CustomButton"));
-const EmptyChatList = ({ title = 'У вас поки немає повідомлень', text, withButton = false, buttonTitle = '', onClick, }) => {
-    return ((0, jsx_runtime_1.jsxs)(EmptyChatList_style_1.EmptyWrapper, { children: [(0, jsx_runtime_1.jsx)(react_2.IonIcon, { icon: icons_1.chatbubblesOutline, className: 'empty-icon' }), (0, jsx_runtime_1.jsx)(EmptyChatList_style_1.Title, { children: title }), text && (0, jsx_runtime_1.jsx)(EmptyChatList_style_1.EmptyMessage, { children: text }), withButton && ((0, jsx_runtime_1.jsx)(CustomButton_1.default, Object.assign({ onClick: onClick, buttonType: "primary" }, { children: buttonTitle })))] }));
-};
-exports.default = react_1.default.memo(EmptyChatList);

package/dist/cjs/lib/Chat/EmptyChatList/EmptyChatList.style.js

@@ -1,31 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.EmptyMessage = exports.Title = exports.EmptyWrapper = void 0;
-const styled_components_1 = __importDefault(require("styled-components"));
-exports.EmptyWrapper = styled_components_1.default.div `
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  gap: 25px;
-
-  .empty-icon {
-    font-size: 60px;
-    color: #177590;
-  }
-`;
-exports.Title = styled_components_1.default.h3 `
-  font-weight: 600;
-  font-size: 20px;
-  line-height: 24px;
-  color: #1d201f;
-`;
-exports.EmptyMessage = styled_components_1.default.div `
-  font-weight: 400;
-  font-size: 18px;
-  line-height: 24px;
-  color: #1d201f;
-  margin-top: -15px;
-`;

package/dist/cjs/lib/Chat/EmptyChatList/index.js

@@ -1,8 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var EmptyChatList_1 = require("./EmptyChatList");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(EmptyChatList_1).default; } });