@botpress/webchat 0.5.1 → 1.0.1

package/dist/components/common/ToolTip/utils.js

@@ -1,78 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.checkYPosition = exports.checkXPosition = exports.tipPosition = exports.getPositions = void 0;
-const getPositions = (positionClasses, el, tooltip) => {
-    const { xClass, yClass } = positionClasses;
-    const elementRect = el.getBoundingClientRect();
-    const tooltipRect = tooltip === null || tooltip === void 0 ? void 0 : tooltip.getBoundingClientRect();
-    const elLeft = elementRect.left;
-    const elWidth = elementRect.width;
-    const elTop = elementRect.top;
-    const elHeight = elementRect.height;
-    const tooltipWidth = (tooltipRect === null || tooltipRect === void 0 ? void 0 : tooltipRect.width) || 0;
-    const tooltipHeight = (tooltipRect === null || tooltipRect === void 0 ? void 0 : tooltipRect.height) || 0;
-    let left = elLeft + elWidth / 2 - tooltipWidth / 2;
-    if (xClass === 'left') {
-        left = elLeft - tooltipWidth;
-        if (yClass === 'top' || yClass === 'bottom') {
-            left = left + elWidth;
-        }
-    }
-    else if (xClass === 'right') {
-        left = elLeft;
-        if (yClass !== 'top' && yClass !== 'bottom') {
-            left = elLeft + elWidth;
-        }
-    }
-    let top = elTop + elHeight / 2 - tooltipHeight / 2;
-    if (yClass === 'top') {
-        top = elTop - tooltipHeight;
-    }
-    else if (yClass === 'bottom') {
-        top = elTop + elHeight;
-    }
-    return { left, top };
-};
-exports.getPositions = getPositions;
-const tipPosition = (positionClasses, el) => {
-    const { xClass, yClass } = positionClasses;
-    const elementRect = el === null || el === void 0 ? void 0 : el.getBoundingClientRect();
-    const elWidth = (elementRect === null || elementRect === void 0 ? void 0 : elementRect.width) || 0;
-    let left = 'auto';
-    let right = 'auto';
-    if (xClass === 'left' && (yClass === 'top' || yClass === 'bottom')) {
-        right = `${elWidth / 2 - 5}px`;
-    }
-    else if (xClass === 'right' && (yClass === 'top' || yClass === 'bottom')) {
-        left = `${elWidth / 2 - 5}px`;
-    }
-    else if (!xClass) {
-        left = '50%';
-    }
-    return { left, right };
-};
-exports.tipPosition = tipPosition;
-const checkXPosition = (canBeXMiddle, canBeLeft) => {
-    if (!canBeXMiddle) {
-        if (canBeLeft) {
-            return 'left';
-        }
-        else {
-            return 'right';
-        }
-    }
-    return '';
-};
-exports.checkXPosition = checkXPosition;
-const checkYPosition = (canBeYMiddle, canBeAbove) => {
-    if (!canBeYMiddle) {
-        if (canBeAbove) {
-            return 'top';
-        }
-        else {
-            return 'bottom';
-        }
-    }
-    return '';
-};
-exports.checkYPosition = checkYPosition;

package/dist/components/common/variables.scss

@@ -1,38 +0,0 @@
-:root {
-  --main-bg-color: #ffffff;
-  --main-bg-color-hover: rgba(255, 255, 255, 0.9);
-  --main-fg-color: #000000;
-  --main-fg-color-hover: rgba(0, 0, 0, 0.07);
-
-  --white: #ffffff;
-  --bg: #f5f6f8;
-  --seashell: #e2e2e2;
-  --gray: #bec5c9;
-  --reef: #5c7080;
-  --shark: #1a1e22;
-  --overlay: rgba(26, 30, 34, 0.8);
-  --success: #019d90;
-  --say: #a4ded0;
-  --trigger: #ffe5b4;
-  --execute: #b0c4de;
-  --listen: #ffe699;
-  --prompt: #e2c7e0;
-  --standard: #000000;
-  --skill-call: #0000ff;
-  --if-else: #febbad;
-  --lighthouse: #f66f48;
-  --focus-lighthouse: #e06542;
-  --hover-lighthouse: #f39c82;
-  --hover-lighthouse-30: #f9ddd5;
-  --ocean: #3276ea;
-  --hover-ocean: #cad7f5;
-
-  --spacing-x-small: 2px;
-  --spacing-small: 4px;
-  --spacing-medium: 8px;
-  --spacing-large: 12px;
-  --spacing-x-large: 16px;
-  --spacing-xx-large: 20px;
-  --spacing-xxx-large: 24px;
-  --spacing-xxxx-large: 28px;
-}

package/dist/components/messages/InlineFeedback.d.ts

@@ -1,11 +0,0 @@
-import { FC } from 'react';
-import { IntlShape } from 'react-intl';
-import { EventFeedback as MessageFeedback } from '../../typings';
-interface Props {
-    onFeedback: (feedback: number, eventId: string) => void;
-    messageId: string;
-    messageFeedbacks: MessageFeedback[];
-    intl: IntlShape;
-}
-export declare const InlineFeedback: FC<Props>;
-export {};

package/dist/components/messages/InlineFeedback.js

@@ -1,56 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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 });
-exports.InlineFeedback = void 0;
-const react_1 = __importStar(require("react"));
-const ThumbsDown_1 = __importDefault(require("../../icons/ThumbsDown"));
-const ThumbsUp_1 = __importDefault(require("../../icons/ThumbsUp"));
-const InlineFeedback = ({ messageFeedbacks, messageId, onFeedback, intl }) => {
-    const [feedbackSent, setFeedbackSent] = (0, react_1.useState)(false);
-    (0, react_1.useEffect)(() => {
-        if (messageFeedbacks && messageFeedbacks.find((x) => x.messageId === messageId && x.feedback != null)) {
-            setFeedbackSent(true);
-        }
-    }, [messageFeedbacks]);
-    const handleSendFeedback = (feedback) => {
-        onFeedback(feedback, messageId);
-        setFeedbackSent(true);
-    };
-    if (feedbackSent) {
-        return null;
-    }
-    return (react_1.default.createElement("div", { className: "bpw-message-feedback" },
-        react_1.default.createElement("div", null,
-            react_1.default.createElement("button", { type: "button", "aria-label": intl.formatMessage({
-                    id: 'message.thumbsUp',
-                    defaultMessage: 'Thumbs Up'
-                }), onClick: () => handleSendFeedback(1) },
-                react_1.default.createElement(ThumbsUp_1.default, null)),
-            react_1.default.createElement("button", { type: "button", "aria-label": intl.formatMessage({
-                    id: 'message.thumbsDown',
-                    defaultMessage: 'Thumbs Down'
-                }), onClick: () => handleSendFeedback(-1) },
-                react_1.default.createElement(ThumbsDown_1.default, null)))));
-};
-exports.InlineFeedback = InlineFeedback;

package/dist/components/messages/Message.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import { WrappedComponentProps } from 'react-intl';
-import { StoreDef } from '../../store';
-import { Renderer } from '../../typings';
-declare const _default: React.ForwardRefExoticComponent<import("react-intl").Omit<MessageProps, "intl"> & {
-    forwardedRef?: React.Ref<any> | undefined;
-} & React.RefAttributes<any>> & {
-    WrappedComponent: React.ComponentType<MessageProps>;
-} & import("mobx-react").IWrappedComponent<unknown>;
-export default _default;
-declare type MessageProps = Renderer.Message & WrappedComponentProps & Pick<StoreDef, 'intl' | 'selectedMessageId' | 'config'>;

package/dist/components/messages/Message.js

@@ -1,106 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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 messaging_components_1 = __importDefault(require("@botpress/messaging-components"));
-const classnames_1 = __importDefault(require("classnames"));
-const mobx_react_1 = require("mobx-react");
-const react_1 = __importStar(require("react"));
-const react_intl_1 = require("react-intl");
-const webchatEvents_1 = require("../../utils/webchatEvents");
-class Message extends react_1.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            hasError: false,
-            showMore: false
-        };
-        this.onMessageClick = () => {
-            var _a, _b;
-            (_a = this.props.store) === null || _a === void 0 ? void 0 : _a.setSelectedMessage(this.props.messageId);
-            (0, webchatEvents_1.postMessageToParent)('MESSAGE.SELECTED', {
-                id: this.props.messageId,
-                conversationId: (_b = this.props.store) === null || _b === void 0 ? void 0 : _b.currentConversationId,
-                sentOn: this.props.sentOn,
-                payload: this.props.payload,
-                from: this.props.isBotMessage ? 'bot' : 'user'
-            }, this.props.config.chatId);
-        };
-    }
-    static getDerivedStateFromError(_error) {
-        return { hasError: true };
-    }
-    renderTimestamp() {
-        return (react_1.default.createElement("span", { className: "bpw-message-timestamp" }, this.props.store.intl.formatTime(new Date(this.props.sentOn), { hour: 'numeric', minute: 'numeric' })));
-    }
-    render() {
-        var _a, _b;
-        if (this.state.hasError) {
-            return '* Cannot display message *';
-        }
-        const type = this.props.type || (this.props.payload && this.props.payload.type);
-        const wrappedType = this.props.payload && this.props.payload.wrapped && this.props.payload.wrapped.type;
-        const wrappedClass = `bpw-bubble-${wrappedType}`;
-        const rendered = (react_1.default.createElement(messaging_components_1.default, { key: this.props.messageId, content: this.props.payload, config: {
-                messageId: this.props.messageId,
-                noMessageBubble: this.props.noBubble,
-                isLastOfGroup: this.props.isLastOfGroup,
-                isLastGroup: this.props.isLastGroup,
-                isBotMessage: this.props.isBotMessage,
-                sentOn: this.props.sentOn,
-                onSendData: this.props.onSendData,
-                onFileUpload: this.props.onFileUpload,
-                store: this.props.store,
-                onAudioEnded: this.props.onAudioEnded,
-                shouldPlay: this.props.shouldPlay,
-                intl: this.props.store.intl,
-                escapeHTML: true,
-                showTimestamp: this.props.store.config.showTimestamp,
-                googleMapsAPIKey: this.props.store.config.googleMapsAPIKey
-            } }));
-        if (rendered === null) {
-            return null;
-        }
-        const additionalStyle = (this.props.payload && this.props.payload['web-style']) || {};
-        const messageSelectedClass = {
-            'bpw-message-selected': this.props.selectedMessageId === this.props.messageId
-        };
-        if (this.props.noBubble || ((_b = (_a = this.props.payload) === null || _a === void 0 ? void 0 : _a.wrapped) === null || _b === void 0 ? void 0 : _b.noBubble)) {
-            return (react_1.default.createElement("div", { className: (0, classnames_1.default)(this.props.className, wrappedClass, messageSelectedClass), style: additionalStyle, onClick: this.onMessageClick }, rendered));
-        }
-        return (react_1.default.createElement("div", { className: (0, classnames_1.default)(this.props.className, wrappedClass, 'bpw-chat-bubble', `bpw-bubble-${type}`), "data-from": this.props.fromLabel, tabIndex: -1, style: additionalStyle },
-            react_1.default.createElement("div", { tabIndex: -1, className: (0, classnames_1.default)('bpw-chat-bubble-content', messageSelectedClass), onClick: this.onMessageClick },
-                react_1.default.createElement("span", { className: "sr-only" }, this.props.store.intl.formatMessage({
-                    id: this.props.isBotMessage ? 'message.botSaid' : 'message.iSaid',
-                    defaultMessage: this.props.isBotMessage ? 'Virtual assistant said : ' : 'I said : '
-                })),
-                rendered,
-                this.props.store.config.showTimestamp && this.renderTimestamp()),
-            this.props.inlineFeedback));
-    }
-}
-exports.default = (0, mobx_react_1.inject)(({ store }) => ({
-    intl: store.intl,
-    config: store.config,
-    selectedMessageId: store.selectedMessageId
-}))((0, react_intl_1.injectIntl)((0, mobx_react_1.observer)(Message)));

package/dist/components/messages/MessageGroup.d.ts

@@ -1,23 +0,0 @@
-import React from 'react';
-import { RootStore, StoreDef } from '../../store';
-import { Message as MessageDetails } from '../../typings';
-declare class MessageGroup extends React.Component<Props> {
-    state: {
-        hasError: boolean;
-        audioPlayingIndex: number;
-    };
-    static getDerivedStateFromError(_error: Error): {
-        hasError: boolean;
-    };
-    onAudioEnded: () => void;
-    render(): JSX.Element | "* Cannot display message *";
-}
-declare const _default: typeof MessageGroup & import("mobx-react").IWrappedComponent<unknown>;
-export default _default;
-declare type Props = {
-    isBot: boolean;
-    avatar: JSX.Element;
-    messages: MessageDetails[];
-    isLastGroup: boolean;
-    store?: RootStore;
-} & Pick<StoreDef, 'sendFeedback' | 'sendData' | 'selectedMessageId'>;

package/dist/components/messages/MessageGroup.js

@@ -1,63 +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 classnames_1 = __importDefault(require("classnames"));
-const sortBy_1 = __importDefault(require("lodash/sortBy"));
-const mobx_react_1 = require("mobx-react");
-const react_1 = __importDefault(require("react"));
-const InlineFeedback_1 = require("./InlineFeedback");
-const Message_1 = __importDefault(require("./Message"));
-class MessageGroup extends react_1.default.Component {
-    constructor() {
-        super(...arguments);
-        this.state = {
-            hasError: false,
-            audioPlayingIndex: 0
-        };
-        this.onAudioEnded = () => {
-            if (this.state.audioPlayingIndex >= this.props.messages.length - 1) {
-                this.state.audioPlayingIndex = -1;
-            }
-            else {
-                this.setState(Object.assign(Object.assign({}, this.state), { audioPlayingIndex: (this.state.audioPlayingIndex += 1) }));
-            }
-        };
-    }
-    static getDerivedStateFromError(_error) {
-        return { hasError: true };
-    }
-    render() {
-        const { messages, avatar, isBot } = this.props;
-        const fromLabel = this.props.store.intl.formatMessage({
-            id: this.props.isBot ? 'message.fromBotLabel' : 'message.fromMeLabel',
-            defaultMessage: 'Me'
-        });
-        if (this.state.hasError) {
-            return '* Cannot display message *';
-        }
-        return (react_1.default.createElement("div", { role: "main", className: (0, classnames_1.default)('bpw-message-big-container', {
-                'bpw-from-user': !isBot,
-                'bpw-from-bot': isBot
-            }) },
-            avatar,
-            react_1.default.createElement("div", { role: "region", className: 'bpw-message-container' },
-                react_1.default.createElement("div", { "aria-live": "assertive", role: "log", className: (0, classnames_1.default)('bpw-message-group', {
-                        'bpw-message-group-selected': !!this.props.messages.find((m) => m.id === this.props.selectedMessageId)
-                    }) },
-                    react_1.default.createElement("span", { "data-from": fromLabel, className: "from hidden", "aria-hidden": "true" }, fromLabel),
-                    (0, sortBy_1.default)(messages, ['sent_on', 'eventId']).map((message, i, messages) => {
-                        const isLastMsg = i === messages.length - 1;
-                        const payload = message.payload;
-                        const showInlineFeedback = isBot && isLastMsg && payload.collectFeedback;
-                        return (react_1.default.createElement(Message_1.default, { key: `${message.id}-${message.payload.type}`, inlineFeedback: showInlineFeedback && (react_1.default.createElement(InlineFeedback_1.InlineFeedback, { intl: this.props.store.intl, messageId: message.id, onFeedback: this.props.sendFeedback, messageFeedbacks: this.props.store.messageFeedbacks })), messageId: message.id, noBubble: !!payload.noBubble, fromLabel: fromLabel, isLastOfGroup: i >= this.props.messages.length - 1, isLastGroup: this.props.isLastGroup, isBotMessage: !message.authorId, payload: payload, sentOn: message.sentOn, onSendData: this.props.sendData, store: this.props.store, onAudioEnded: this.onAudioEnded, shouldPlay: this.state.audioPlayingIndex === i }));
-                    })))));
-    }
-}
-exports.default = (0, mobx_react_1.inject)(({ store }) => ({
-    store,
-    sendFeedback: store.sendFeedback,
-    sendData: store.sendData,
-    selectedMessageId: store.selectedMessageId
-}))(MessageGroup);

package/dist/components/messages/MessageList.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { WrappedComponentProps } from 'react-intl';
-import { StoreDef } from '../../store';
-declare const _default: React.ForwardRefExoticComponent<import("react-intl").Omit<MessageListProps, "intl"> & {
-    forwardedRef?: React.Ref<any> | undefined;
-} & React.RefAttributes<any>> & {
-    WrappedComponent: React.ComponentType<MessageListProps>;
-} & import("mobx-react").IWrappedComponent<unknown>;
-export default _default;
-declare type MessageListProps = WrappedComponentProps & Pick<StoreDef, 'intl' | 'isBotTyping' | 'focusedArea' | 'focusPrevious' | 'focusNext' | 'botAvatarUrl' | 'botName' | 'currentMessages' | 'preferredLanguage'>;

package/dist/components/messages/MessageList.js

@@ -1,148 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (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 difference_in_minutes_1 = __importDefault(require("date-fns/difference_in_minutes"));
-const last_1 = __importDefault(require("lodash/last"));
-const mobx_1 = require("mobx");
-const mobx_react_1 = require("mobx-react");
-const react_1 = __importStar(require("react"));
-const react_intl_1 = require("react-intl");
-const react_scroll_to_bottom_1 = __importStar(require("react-scroll-to-bottom"));
-const constants_1 = __importDefault(require("../../core/constants"));
-const Avatar_1 = __importDefault(require("../common/Avatar"));
-const MessageGroup_1 = __importDefault(require("./MessageGroup"));
-class MessageList extends react_1.default.Component {
-    componentDidMount() {
-        (0, mobx_1.observe)(this.props.focusedArea, (focus) => {
-            focus.newValue === 'convo' && this.messagesDiv.focus();
-        });
-    }
-    render() {
-        return (react_1.default.createElement(react_scroll_to_bottom_1.default, { mode: 'bottom', initialScrollBehavior: 'auto', tabIndex: 0, className: 'bpw-msg-list-scroll-container', scrollViewClassName: 'bpw-msg-list', ref: (m) => {
-                this.messagesDiv = m;
-            }, followButtonClassName: 'bpw-msg-list-follow' },
-            react_1.default.createElement(Content, Object.assign({}, this.props))));
-    }
-}
-const Content = (0, mobx_react_1.observer)((props) => {
-    var _a, _b;
-    const [state, setState] = (0, react_1.useState)({
-        showNewMessageIndicator: false,
-        messagesLength: undefined
-    });
-    const scrollToBottom = (0, react_scroll_to_bottom_1.useScrollToBottom)();
-    const [sticky] = (0, react_scroll_to_bottom_1.useSticky)();
-    (0, react_1.useEffect)(() => {
-        var _a, _b;
-        const stateUpdate = Object.assign(Object.assign({}, state), { messagesLength: (_a = props === null || props === void 0 ? void 0 : props.currentMessages) === null || _a === void 0 ? void 0 : _a.length });
-        if (!sticky && state.messagesLength !== ((_b = props === null || props === void 0 ? void 0 : props.currentMessages) === null || _b === void 0 ? void 0 : _b.length)) {
-            setState(Object.assign(Object.assign({}, stateUpdate), { showNewMessageIndicator: true }));
-        }
-        else {
-            setState(Object.assign(Object.assign({}, stateUpdate), { showNewMessageIndicator: false }));
-        }
-    }, [(_a = props === null || props === void 0 ? void 0 : props.currentMessages) === null || _a === void 0 ? void 0 : _a.length, sticky]);
-    const shouldDisplayMessage = (m) => {
-        return m.payload.type !== 'postback';
-    };
-    const renderDate = (date) => {
-        return (react_1.default.createElement("div", { className: 'bpw-date-container' },
-            new Intl.DateTimeFormat(props.intl.locale || 'en', {
-                month: 'short',
-                day: 'numeric',
-                hour: 'numeric',
-                minute: 'numeric'
-            }).format(new Date(date)),
-            react_1.default.createElement("div", { className: 'bpw-small-line' })));
-    };
-    const renderAvatar = (name, url) => {
-        const avatarSize = 40;
-        return react_1.default.createElement(Avatar_1.default, { name: name, avatarUrl: url, height: avatarSize, width: avatarSize });
-    };
-    const renderMessageGroups = () => {
-        var _a;
-        const messages = (props.currentMessages || []).filter((m) => shouldDisplayMessage(m));
-        const groups = [];
-        let lastSpeaker = undefined;
-        let lastDate = undefined;
-        let currentGroup = undefined;
-        messages.forEach((m) => {
-            const speaker = m.authorId;
-            const date = m.sentOn;
-            // Create a new group if messages are separated by more than X minutes or if different speaker
-            if (speaker !== lastSpeaker ||
-                !currentGroup ||
-                (0, difference_in_minutes_1.default)(new Date(date), new Date(lastDate)) >= constants_1.default.TIME_BETWEEN_DATES) {
-                currentGroup = [];
-                groups.push(currentGroup);
-            }
-            if (currentGroup.find((x) => x.id === m.id)) {
-                return;
-            }
-            currentGroup.push(m);
-            lastSpeaker = speaker;
-            lastDate = date;
-        });
-        if ((_a = props === null || props === void 0 ? void 0 : props.isBotTyping) === null || _a === void 0 ? void 0 : _a.get()) {
-            if (lastSpeaker !== 'bot') {
-                currentGroup = [];
-                groups.push(currentGroup);
-            }
-            currentGroup.push({
-                sentOn: new Date(),
-                payload: { type: 'typing' }
-            });
-        }
-        return (react_1.default.createElement("div", null, groups.map((group, i) => {
-            var _a;
-            const lastGroup = groups[i - 1];
-            const lastDate = (_a = lastGroup === null || lastGroup === void 0 ? void 0 : lastGroup[lastGroup.length - 1]) === null || _a === void 0 ? void 0 : _a.sentOn;
-            const groupDate = group === null || group === void 0 ? void 0 : group[0].sentOn;
-            const isDateNeeded = !groups[i - 1] ||
-                (0, difference_in_minutes_1.default)(new Date(groupDate), new Date(lastDate)) > constants_1.default.TIME_BETWEEN_DATES;
-            const { authorId } = (0, last_1.default)(group);
-            const avatar = !authorId && renderAvatar(props.botName, props.botAvatarUrl);
-            return (react_1.default.createElement("div", { key: i },
-                isDateNeeded && renderDate(group[0].sentOn),
-                react_1.default.createElement(MessageGroup_1.default, { isBot: !authorId, avatar: avatar, key: `msg-group-${i}`, isLastGroup: i >= groups.length - 1, messages: group })));
-        })));
-    };
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        state.showNewMessageIndicator && (react_1.default.createElement("div", { className: "bpw-new-messages-indicator", onClick: (e) => scrollToBottom() },
-            react_1.default.createElement("span", null, props.intl.formatMessage({
-                id: `messages.newMessage${((_b = props === null || props === void 0 ? void 0 : props.currentMessages) === null || _b === void 0 ? void 0 : _b.length) === 1 ? '' : 's'}`
-            })))),
-        renderMessageGroups()));
-});
-exports.default = (0, mobx_react_1.inject)(({ store }) => ({
-    intl: store.intl,
-    botName: store.botName,
-    isBotTyping: store.isBotTyping,
-    botAvatarUrl: store.botAvatarUrl,
-    currentMessages: store.currentMessages,
-    focusPrevious: store.view.focusPrevious,
-    focusNext: store.view.focusNext,
-    focusedArea: store.view.focusedArea,
-    preferredLanguage: store.preferredLanguage
-}))((0, react_intl_1.injectIntl)((0, mobx_react_1.observer)(MessageList)));

package/dist/core/api.d.ts

@@ -1,23 +0,0 @@
-/// <reference types="node" />
-import { Message } from '@botpress/messaging-socket';
-import { uuid, RecentConversation } from '../typings';
-import BpSocket from './socket';
-export default class WebchatApi {
-    private socket;
-    constructor(socket: BpSocket);
-    listCurrentConversationMessages(limit?: number): Promise<Message[] | undefined>;
-    fetchConversations(): Promise<RecentConversation[]>;
-    fetchConversation(conversationId: uuid): Promise<{
-        messages: Message[];
-        id?: string | undefined;
-        clientId?: string | undefined;
-        userId?: string | undefined;
-        createdOn?: Date | undefined;
-    } | undefined>;
-    createConversation(): Promise<uuid | undefined>;
-    startConversation(): Promise<void>;
-    sendMessage(payload: any, conversationId: uuid): Promise<Message | undefined>;
-    deleteConversation(conversationId: uuid): Promise<void>;
-    sendFeedback(feedback: number, messageId: uuid): Promise<void>;
-    sendVoiceMessage(voice: Buffer, ext: string, conversationId: uuid): Promise<void>;
-}