pager-widget 1.0.3 → 1.0.4

package/out/RecentMessageListHeader.js

@@ -0,0 +1,156 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = __importStar(require("react"));
+const BotMain_1 = require("./BotMain");
+const pikaicons_react_1 = require("./assets/icons/pikaicons-react");
+const widgetStore_1 = require("./widgetStore");
+const RecentMessageListHeader = ({ toggleWidget, isExpanded, }) => {
+    const expandRef = react_1.default.useRef(null);
+    const [expandPopupOpen, setExpandPopupOpen] = react_1.default.useState(false);
+    const [showExpandPopUp, setShowExpandPopUp] = react_1.default.useState(false);
+    const expandMenuItems = [
+        {
+            id: 1,
+            icon: ((0, jsx_runtime_1.jsx)(pikaicons_react_1.PiPhoneStroke, { className: "w-[16px] h-[16px] text-slate-600" })),
+            label: 'Default mode',
+            selected: isExpanded === widgetStore_1.WidgetExpandType.DEFAULT,
+            onClick: () => {
+                widgetStore_1.widgetStore.trigger.expandWidget({
+                    expanded_size: widgetStore_1.WidgetExpandType.DEFAULT,
+                });
+                setExpandPopupOpen(false);
+            },
+        },
+        {
+            id: 2,
+            icon: ((0, jsx_runtime_1.jsx)(pikaicons_react_1.PiTabletStroke, { className: "w-[16px] h-[16px] text-slate-600" })),
+            label: 'Expanded mode',
+            selected: isExpanded === widgetStore_1.WidgetExpandType.EXPANDED,
+            onClick: () => {
+                widgetStore_1.widgetStore.trigger.expandWidget({
+                    expanded_size: widgetStore_1.WidgetExpandType.EXPANDED,
+                });
+                setExpandPopupOpen(false);
+            },
+        },
+        {
+            id: 3,
+            icon: ((0, jsx_runtime_1.jsx)(pikaicons_react_1.PiSpatialCurvedScreenStroke, { className: "w-[16px] h-[16px] text-slate-600" })),
+            label: 'Full screen mode',
+            selected: isExpanded === widgetStore_1.WidgetExpandType.FULLSCREEN,
+            onClick: () => {
+                widgetStore_1.widgetStore.trigger.expandWidget({
+                    expanded_size: widgetStore_1.WidgetExpandType.FULLSCREEN,
+                });
+                setExpandPopupOpen(false);
+            },
+        },
+    ];
+    const selectedExpandItem = expandMenuItems.find((item) => {
+        return item.selected ? item.icon : null;
+    });
+    (0, react_1.useEffect)(() => {
+        function handleClick(event) {
+            if (expandRef.current &&
+                !expandRef.current.contains(event.target)) {
+                setExpandPopupOpen(false);
+            }
+        }
+        if (expandPopupOpen) {
+            document.addEventListener('mousedown', handleClick);
+        }
+        return () => {
+            document.removeEventListener('mousedown', handleClick);
+        };
+    }, [expandPopupOpen]);
+    react_1.default.useEffect(() => {
+        if (expandPopupOpen) {
+            setShowExpandPopUp(true);
+        }
+        else if (showExpandPopUp) {
+            const timeout = setTimeout(() => setShowExpandPopUp(false), 140);
+            return () => clearTimeout(timeout);
+        }
+    }, [expandPopupOpen, showExpandPopUp]);
+    const handleBackButtonClick = () => {
+        if (isExpanded !== widgetStore_1.WidgetExpandType.DEFAULT) {
+            widgetStore_1.widgetStore.trigger.expandWidget({
+                expanded_size: widgetStore_1.WidgetExpandType.DEFAULT,
+            });
+            setTimeout(() => {
+                widgetStore_1.widgetStore.trigger.selectTab({ tab: BotMain_1.TabType.HOME });
+            }, 300);
+        }
+        else {
+            widgetStore_1.widgetStore.trigger.selectTab({ tab: BotMain_1.TabType.HOME });
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("header", { className: "flex items-center px-0 py-[15px] border-b border-zinc-300 w-full justify-between h-[60px] bg-white rounded-t-[22px]", "data-model-id": "10445:55564", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 px-5 py-0 w-full", children: [(0, jsx_runtime_1.jsx)("button", { className: "inline-flex items-center justify-center gap-2.5 p-0 cursor-pointer hover:bg-slate-100 rounded-xl overflow-hidden", onClick: handleBackButtonClick, children: (0, jsx_runtime_1.jsx)(pikaicons_react_1.PiChevronLeftStroke, { className: "w-6 h-6 cursor-pointer" }) }), (0, jsx_runtime_1.jsx)("span", { className: "text-slate-950 text-base font-medium leading-6", children: "Recent chats" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 px-5 py-0 w-max justify-end", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative", ref: expandRef, children: [(0, jsx_runtime_1.jsx)("button", { className: "inline-flex items-center gap-2.5 p-1 cursor-pointer hover:bg-slate-100 rounded-lg overflow-hidden", onClick: () => setExpandPopupOpen(!expandPopupOpen), children: (0, jsx_runtime_1.jsx)("div", { className: "inline-flex items-center gap-2.5", children: selectedExpandItem
+                                        ? selectedExpandItem.icon
+                                        : null }) }), showExpandPopUp && ((0, jsx_runtime_1.jsxs)("nav", { className: `flex flex-col w-[148px] h-max absolute items-start gap-1 p-1 right-0 bg-white rounded-lg overflow-hidden border border-solid border-slate-200 z-50`, style: {
+                                    animation: expandPopupOpen
+                                        ? 'popin 0.18s cubic-bezier(0.4,0,0.2,1)'
+                                        : 'popout 0.14s cubic-bezier(0.4,0,0.2,1)',
+                                }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+                                    @keyframes popin {
+                                        0% {
+                                            opacity: 0;
+                                            transform: scale(0.95) translateY(-8px);
+                                        }
+                                        100% {
+                                            opacity: 1;
+                                            transform: scale(1) translateY(0);
+                                        }
+                                    }
+                                    @keyframes popout {
+                                        0% {
+                                            opacity: 1;
+                                            transform: scale(1) translateY(0);
+                                        }
+                                        100% {
+                                            opacity: 0;
+                                            transform: scale(0.95) translateY(-8px);
+                                        }
+                                    }
+                                ` }), expandMenuItems.map((item) => ((0, jsx_runtime_1.jsxs)("button", { className: `flex items-center gap-1.5 pl-2 pr-3 py-1.5 relative self-stretch w-full cursor-pointer 
+                                    hover:bg-slate-100 rounded-md overflow-hidden`, style: {
+                                            backgroundColor: item.selected
+                                                ? '#f0f0f0'
+                                                : '',
+                                        }, onClick: item.onClick, children: [(0, jsx_runtime_1.jsx)("div", { className: "inline-flex items-center gap-2.5 flex-[0_0_auto]", children: item.icon }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col items-start justify-center gap-2 flex-1 self-stretch grow", children: (0, jsx_runtime_1.jsx)("div", { className: "inline-flex flex-col items-start gap-1 flex-[0_0_auto]", children: (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1 flex-[0_0_auto]", children: (0, jsx_runtime_1.jsx)("div", { className: "w-fit whitespace-nowrap text-xs font-medium text-[#020618]", children: item.label }) }) }) })] }, item.id)))] }))] }), (0, jsx_runtime_1.jsx)("button", { className: "inline-flex items-center gap-2.5 p-1 cursor-pointer hover:bg-slate-50 rounded-lg overflow-hidden", onClick: toggleWidget, children: (0, jsx_runtime_1.jsx)("div", { className: "inline-flex items-center gap-2.5", children: (0, jsx_runtime_1.jsx)(pikaicons_react_1.PiMultipleCrossCancelDefaultStroke, { className: "w-[18px] h-[18px]" }) }) })] })] }));
+};
+exports.default = RecentMessageListHeader;

package/out/RecentMessagePage.js

@@ -0,0 +1,183 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.RecentMessagePage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+/* eslint-disable @typescript-eslint/no-explicit-any */
+const react_1 = __importStar(require("react"));
+const BotMain_1 = require("./BotMain");
+const pikaicons_react_1 = require("./assets/icons/pikaicons-react");
+const useChatHistoryExists_1 = require("./hooks/useChatHistoryExists");
+const widgetConfigStore2_1 = require("./widgetConfigStore2");
+const pager_md_1 = __importDefault(require("./markdown/pager_md"));
+const ReceivedMessage_1 = require("./ReceivedMessage");
+const widgetStore_1 = require("./widgetStore");
+const RecentMessagePage = ({ toggleWidget, isExpanded, }) => {
+    const widget = (0, widgetConfigStore2_1.useWidgetData)();
+    const { recentChat } = (0, useChatHistoryExists_1.useChatHistoryExists)();
+    const chatValues = recentChat ?? {};
+    const widgetId = widget?.data?.id;
+    const messageResponse = chatValues?.[widgetId] ?? [];
+    const expandRef = react_1.default.useRef(null);
+    const [expandPopupOpen, setExpandPopupOpen] = react_1.default.useState(false);
+    const [showExpandPopUp, setShowExpandPopUp] = react_1.default.useState(false);
+    const expandMenuItems = [
+        {
+            id: 1,
+            icon: ((0, jsx_runtime_1.jsx)(pikaicons_react_1.PiPhoneStroke, { className: "w-[16px] h-[16px] text-slate-600" })),
+            label: 'Default mode',
+            selected: isExpanded === widgetStore_1.WidgetExpandType.DEFAULT,
+            onClick: () => {
+                widgetStore_1.widgetStore.trigger.expandWidget({
+                    expanded_size: widgetStore_1.WidgetExpandType.DEFAULT,
+                });
+                setExpandPopupOpen(false);
+            },
+        },
+        {
+            id: 2,
+            icon: ((0, jsx_runtime_1.jsx)(pikaicons_react_1.PiTabletStroke, { className: "w-[16px] h-[16px] text-slate-600" })),
+            label: 'Expanded mode',
+            selected: isExpanded === widgetStore_1.WidgetExpandType.EXPANDED,
+            onClick: () => {
+                widgetStore_1.widgetStore.trigger.expandWidget({
+                    expanded_size: widgetStore_1.WidgetExpandType.EXPANDED,
+                });
+                setExpandPopupOpen(false);
+            },
+        },
+        {
+            id: 3,
+            icon: ((0, jsx_runtime_1.jsx)(pikaicons_react_1.PiSpatialCurvedScreenStroke, { className: "w-[16px] h-[16px] text-slate-600" })),
+            label: 'Full screen mode',
+            selected: isExpanded === widgetStore_1.WidgetExpandType.FULLSCREEN,
+            onClick: () => {
+                widgetStore_1.widgetStore.trigger.expandWidget({
+                    expanded_size: widgetStore_1.WidgetExpandType.FULLSCREEN,
+                });
+                setExpandPopupOpen(false);
+            },
+        },
+    ];
+    const selectedExpandItem = expandMenuItems.find((item) => {
+        return item.selected ? item.icon : null;
+    });
+    (0, react_1.useEffect)(() => {
+        function handleClick(event) {
+            if (expandRef.current &&
+                !expandRef.current.contains(event.target)) {
+                setExpandPopupOpen(false);
+            }
+        }
+        if (expandPopupOpen) {
+            document.addEventListener('mousedown', handleClick);
+        }
+        return () => {
+            document.removeEventListener('mousedown', handleClick);
+        };
+    }, [expandPopupOpen]);
+    react_1.default.useEffect(() => {
+        if (expandPopupOpen) {
+            setShowExpandPopUp(true);
+        }
+        else if (showExpandPopUp) {
+            const timeout = setTimeout(() => setShowExpandPopUp(false), 140);
+            return () => clearTimeout(timeout);
+        }
+    }, [expandPopupOpen, showExpandPopUp]);
+    if (!Array.isArray(messageResponse) || messageResponse.length === 0) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "p-4 text-center text-gray-500", children: "No recent messages found." }));
+    }
+    const handleBackButtonClick = () => {
+        if (isExpanded !== widgetStore_1.WidgetExpandType.DEFAULT) {
+            widgetStore_1.widgetStore.trigger.expandWidget({
+                expanded_size: widgetStore_1.WidgetExpandType.DEFAULT,
+            });
+            setTimeout(() => {
+                widgetStore_1.widgetStore.trigger.selectTab({ tab: BotMain_1.TabType.HOME });
+            }, 300);
+        }
+        else {
+            widgetStore_1.widgetStore.trigger.selectTab({ tab: BotMain_1.TabType.HOME });
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("header", { className: "flex items-center px-0 py-[15px] border-b border-zinc-300 w-full justify-between h-[60px] bg-white rounded-t-[22px] cursor-pointer", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 px-5 w-full", children: [(0, jsx_runtime_1.jsx)("button", { className: "inline-flex items-center justify-center gap-2.5 p-0 cursor-pointer hover:bg-slate-100 rounded-xl overflow-hidden", onClick: handleBackButtonClick, children: (0, jsx_runtime_1.jsx)(pikaicons_react_1.PiChevronLeftStroke, { className: "w-6 h-6" }) }), (0, jsx_runtime_1.jsx)("img", { className: "w-auto h-[30px]", src: widget?.data?.logo_url, alt: "Bot logo" }), (0, jsx_runtime_1.jsx)("span", { className: "flex flex-col items-start grow", children: (0, jsx_runtime_1.jsx)("span", { className: "flex flex-col items-start gap-[18px] flex-[0_0_auto]", children: (0, jsx_runtime_1.jsx)("h1", { className: "w-fit mt-[-1.00px] font-text-md-medium font-[number:var(--text-md-medium-font-weight)] text-[#020618] text-[length:var(--text-md-medium-font-size)] tracking-[var(--text-md-medium-letter-spacing)] leading-[var(--text-md-medium-line-height)] whitespace-nowrap [font-style:var(--text-md-medium-font-style)]", children: widget?.data?.name }) }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 px-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative", ref: expandRef, children: [(0, jsx_runtime_1.jsx)("button", { className: "inline-flex items-center gap-2.5 p-1 cursor-pointer hover:bg-slate-100 rounded-lg overflow-hidden", onClick: () => setExpandPopupOpen(!expandPopupOpen), children: (0, jsx_runtime_1.jsx)("div", { className: "inline-flex items-center gap-2.5", children: selectedExpandItem
+                                                ? selectedExpandItem.icon
+                                                : null }) }), showExpandPopUp && ((0, jsx_runtime_1.jsxs)("nav", { className: `flex flex-col w-[148px] h-max absolute items-start gap-1 p-1 right-0 bg-white rounded-lg overflow-hidden border border-solid border-slate-200 z-50`, style: {
+                                            animation: expandPopupOpen
+                                                ? 'popin 0.18s cubic-bezier(0.4,0,0.2,1)'
+                                                : 'popout 0.14s cubic-bezier(0.4,0,0.2,1)',
+                                        }, children: [(0, jsx_runtime_1.jsx)("style", { children: `
+                                    @keyframes popin {
+                                        0% {
+                                            opacity: 0;
+                                            transform: scale(0.95) translateY(-8px);
+                                        }
+                                        100% {
+                                            opacity: 1;
+                                            transform: scale(1) translateY(0);
+                                        }
+                                    }
+                                    @keyframes popout {
+                                        0% {
+                                            opacity: 1;
+                                            transform: scale(1) translateY(0);
+                                        }
+                                        100% {
+                                            opacity: 0;
+                                            transform: scale(0.95) translateY(-8px);
+                                        }
+                                    }
+                                ` }), expandMenuItems.map((item) => ((0, jsx_runtime_1.jsxs)("button", { className: `flex items-center gap-1.5 pl-2 pr-3 py-1.5 relative self-stretch w-full cursor-pointer 
+                                        hover:bg-slate-100 rounded-md overflow-hidden`, style: {
+                                                    backgroundColor: item.selected
+                                                        ? '#f0f0f0'
+                                                        : '',
+                                                }, onClick: item.onClick, children: [(0, jsx_runtime_1.jsx)("div", { className: "inline-flex items-center gap-2.5 flex-[0_0_auto]", children: item.icon }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col items-start justify-center gap-2 flex-1 self-stretch grow", children: (0, jsx_runtime_1.jsx)("div", { className: "inline-flex flex-col items-start gap-1 flex-[0_0_auto]", children: (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-1 flex-[0_0_auto]", children: (0, jsx_runtime_1.jsx)("div", { className: "w-fit whitespace-nowrap text-xs font-medium text-[#020618]", children: item.label }) }) }) })] }, item.id)))] }))] }), (0, jsx_runtime_1.jsx)("button", { className: "inline-flex items-center p-1 hover:bg-slate-50 rounded-lg cursor-pointer", onClick: toggleWidget, children: (0, jsx_runtime_1.jsx)(pikaicons_react_1.PiMultipleCrossCancelDefaultStroke, { className: "w-[18px] h-[18px]" }) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col h-[93%] pt-2 justify-between pb-2.5", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-4 h-full overflow-y-scroll w-full", children: (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-5 w-full pb-3", children: messageResponse.map((message, index) => ((0, jsx_runtime_1.jsx)("div", { children: message.type === 'received' ? ((0, jsx_runtime_1.jsx)(ReceivedMessage_1.ReceivedMessage, { message: message.message, time: message.time, sendFeedback: function () {
+                                        throw new Error('Function not implemented.');
+                                    }, sendMessage: function () {
+                                        throw new Error('Function not implemented.');
+                                    } })) : ((0, jsx_runtime_1.jsx)("div", { className: "flex flex-col items-end px-5 animate-slide-in-right", children: (0, jsx_runtime_1.jsx)("div", { className: "w-[300px] flex flex-col items-end gap-1", children: (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 text-sm px-3.5 py-2.5 rounded-lg", style: {
+                                                backgroundColor: widget?.data
+                                                    ?.secondary_color,
+                                                color: widget?.data
+                                                    ?.user_message_text_color,
+                                            }, children: (0, jsx_runtime_1.jsx)(pager_md_1.default, { mdText: message.message.input ??
+                                                    '' }) }) }) })) }, message.message?.event_id ?? index))) }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col items-start gap-2.5 bg-white", children: (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col items-center justify-center gap-8 w-full overflow-hidden border border-zinc-100", children: (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2.5 px-4 py-2 w-full bg-white", children: (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-center gap-1.5 flex-1", children: (0, jsx_runtime_1.jsx)("div", { className: "inline-flex flex-col items-start justify-center", children: (0, jsx_runtime_1.jsx)("div", { className: "flex items-center w-full gap-1.5", children: (0, jsx_runtime_1.jsx)("span", { className: "font-text-xs-regular text-[#1d293d] text-xs tracking-[0px] leading-[18px] whitespace-nowrap", children: "Your conversation has ended" }) }) }) }) }) }) })] })] }));
+};
+exports.RecentMessagePage = RecentMessagePage;

package/out/RecentMessageTab.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RecentMessageTab = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const BotMain_1 = require("./BotMain");
+const widgetStore_1 = require("./widgetStore");
+const widgetConfigStore2_1 = require("./widgetConfigStore2");
+const convertTime_1 = require("./utils/convertTime");
+const useCurrentConversationExists_1 = require("./hooks/useCurrentConversationExists");
+const PagerMarkdown_1 = __importDefault(require("./markdown/PagerMarkdown"));
+const RecentMessageTab = () => {
+    const widget = (0, widgetConfigStore2_1.useWidgetData)();
+    const { hasRecentConversation, recentConversation } = (0, useCurrentConversationExists_1.useCurrentConversationExist)(widget?.data?.id);
+    const [isHovered, setIsHovered] = (0, react_1.useState)(false);
+    const events = recentConversation?.events || [];
+    const lastEvent = events[events.length - 1];
+    const lastTime = lastEvent?.time;
+    const lastMessageText = lastEvent?.type === 'received'
+        ? lastEvent.message?.output?.[0]?.value?.value
+        : lastEvent?.message?.input?.value; // fallback for sent type
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: hasRecentConversation && ((0, jsx_runtime_1.jsxs)("div", { className: `w-full flex items-center gap-2.5 pl-5 pr-4 py-3 rounded-xl bg-white cursor-pointer max-h-[200px]`, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false), onClick: () => widgetStore_1.widgetStore.trigger.selectTab({
+                tab: BotMain_1.TabType.CHAT,
+            }), style: {
+                border: `1px solid ${isHovered ? widget?.data?.brand_color : '#e4e4e7'}`,
+            }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex-col items-start gap-1 flex-1 grow flex w-[91%]", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex-col items-start gap-1 self-stretch w-full flex", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex-col items-start gap-[18px] self-stretch w-full flex", children: (0, jsx_runtime_1.jsx)("h3", { className: "w-fit mt-[-1.00px] text-sm font-semibold text-[#020618]", children: "Recent messages" }) }), (0, jsx_runtime_1.jsx)("div", { title: "Hello! Thanks for contacting us! all of\n                             our team", className: "flex-col items-start gap-[18px] self-stretch w-full flex", children: (0, jsx_runtime_1.jsx)("p", { className: "self-stretch mt-[-1.00px] max-h-8 text-sm text-[#020618] leading-5 whitespace-nowrap overflow-hidden text-ellipsis w-full", children: (0, jsx_runtime_1.jsx)(PagerMarkdown_1.default, { message: lastMessageText }) }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "items-center gap-1.5 self-stretch w-full flex", children: (0, jsx_runtime_1.jsx)("span", { className: "text-xs text-[#62748e]", children: (0, convertTime_1.formatTimeAMPM)(lastTime) }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "inline-flex items-center", children: (0, jsx_runtime_1.jsx)("svg", { style: {
+                            color: isHovered
+                                ? widget?.data?.brand_color
+                                : '#b8b8b8',
+                        }, width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: (0, jsx_runtime_1.jsx)("path", { d: "M9 18l6-6-6-6" }) }) })] })) }));
+};
+exports.RecentMessageTab = RecentMessageTab;

package/out/WidgetMessage.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WidgetMessage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Message_1 = require("./Message");
+// TODO :: MEssageEntry Should have better Types
+const WidgetMessage = ({ messages, 
+// typing,
+sendFeedback, sendMessage, setMessages, }) => {
+    console.log('DEBUG :: updated messages', messages);
+    // const scrollRef = useChatScroll([messages, typing])
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: messages.map((message) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [console.log(message, 'messagein'), (0, jsx_runtime_1.jsx)(Message_1.Message, { messageResponse: message, sendFeedback: sendFeedback, sendMessage: sendMessage, setMessages: setMessages })] }))) }));
+};
+exports.WidgetMessage = WidgetMessage;

package/out/WidgetToggleButton.js

@@ -0,0 +1,191 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.WidgetToggleButton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const pikaicons_react_1 = require("./assets/icons/pikaicons-react");
+const react_1 = __importStar(require("react"));
+const widgetConfigStore2_1 = require("./widgetConfigStore2");
+const lucide_react_1 = require("lucide-react");
+const HomePageHeader_1 = require("./HomePageHeader");
+const widgetStore_1 = require("./widgetStore");
+const useChatHistoryListExist_1 = require("./hooks/useChatHistoryListExist");
+const pager_md_1 = __importDefault(require("./markdown/pager_md"));
+const WidgetToggleButton = ({ setUserInitialMessage, widgetToggleState, toggleWidget, }) => {
+    const widget = (0, widgetConfigStore2_1.useWidgetData)();
+    const { status } = widget;
+    const [btnHover, setBtnHover] = react_1.default.useState(false);
+    const [floatBtnHover, setFloatBtnHover] = react_1.default.useState(null);
+    const [toggleText, setToggleText] = react_1.default.useState(true);
+    const [isToggleOpen, setIsToggleOpen] = react_1.default.useState(widgetToggleState);
+    const { recentChatList } = (0, useChatHistoryListExist_1.useChatHistoryListExists)();
+    if (!(status !== 'NOT_STARTED' &&
+        status !== 'WIDGET_LOADING' &&
+        status !== 'INVALID_STATE')) {
+        return null;
+    }
+    function hexToRGB(hex) {
+        if (!hex || typeof hex !== 'string')
+            return 'rgba(0, 0, 0, 0.2)';
+        hex = hex.replace(/^#/, '');
+        if (hex.length === 3) {
+            hex = hex
+                .split('')
+                .map((c) => c + c)
+                .join('');
+        }
+        const bigint = parseInt(hex, 16);
+        const r = (bigint >> 16) & 255;
+        const g = (bigint >> 8) & 255;
+        const b = bigint & 255;
+        return `rgba(${r}, ${g}, ${b}, 0.8)`;
+    }
+    const size = (0, react_1.useMemo)(() => {
+        return widget?.data?.launcher_logo_size;
+    }, [widget?.data?.launcher_logo_size]);
+    console.log(size, 'size');
+    const sizeClass = (() => {
+        switch (size) {
+            case 'S':
+                return 'w-[60px] h-[60px]';
+            case 'M':
+                return 'w-[80px] h-[80px]';
+            case 'L':
+                return 'w-[100px] h-[100px]';
+            case 'XL':
+                return 'w-[120px] h-[120px]';
+            case 'XXL':
+                return 'w-[140px] h-[140px]';
+            case 'XXXL':
+                return 'w-[160px] h-[160px]';
+            default:
+                return 'w-[100px] h-[100px]';
+        }
+    })();
+    const shapeClass = widget?.data?.launcher_logo_shape === 'Square'
+        ? 'rounded-xl'
+        : 'rounded-full';
+    (0, react_1.useEffect)(() => {
+        if (widgetToggleState == 'CLOSE') {
+            setTimeout(() => {
+                setIsToggleOpen('CLOSE');
+            }, 0);
+        }
+        else if (widgetToggleState == 'OPEN') {
+            setTimeout(() => {
+                setIsToggleOpen('OPEN');
+            }, 200);
+        }
+    }, [widgetToggleState, toggleText]);
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-end gap-3", children: [toggleText &&
+                    widgetToggleState == 'CLOSE' &&
+                    !recentChatList &&
+                    widget.data.widget_starter_flow_enabled &&
+                    !localStorage.getItem('CURRENT_CONVERSATION') && ((0, jsx_runtime_1.jsxs)("span", { className: `relative group flex flex-col gap-3 mr-4 ${isToggleOpen === 'CLOSE' ? 'visible' : ''}`, children: [(0, jsx_runtime_1.jsx)("button", { onMouseOver: () => setFloatBtnHover(3), onMouseLeave: () => setFloatBtnHover(null), style: {
+                                backgroundColor: widget.data.use_brand_color
+                                    ? floatBtnHover === 3
+                                        ? hexToRGB(widget.data.brand_color)
+                                        : widget.data.brand_color
+                                    : floatBtnHover === 3
+                                        ? '#f0f0f0'
+                                        : 'white',
+                            }, className: "cursor-pointer floating-chip-hover relative flex items-center justify-start rounded-lg min-h-[36px] px-2.5 py-2.5 shadow-md transition-all duration-300 max-w-[280px]", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-1.5", children: [(0, jsx_runtime_1.jsx)("img", { src: widget?.data?.logo_url, alt: "", className: "w-[22px] h-[22px]" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-1.5 items-start", children: [(0, jsx_runtime_1.jsx)("span", { style: {
+                                                    color: widget.data
+                                                        .use_brand_color
+                                                        ? (0, HomePageHeader_1.isDarkColor)(widget.data
+                                                            .brand_color) == 'light'
+                                                            ? '#000000'
+                                                            : '#FFFFFF'
+                                                        : '#000000',
+                                                }, className: "text-xs font-semibold leading-[18px] text-start", children: widget?.data?.name }), (0, jsx_runtime_1.jsx)("div", { style: {
+                                                    color: widget.data
+                                                        .use_brand_color
+                                                        ? (0, HomePageHeader_1.isDarkColor)(widget.data
+                                                            .brand_color) == 'light'
+                                                            ? '#000000'
+                                                            : '#FFFFFF'
+                                                        : '#000000',
+                                                }, className: "text-sm whitespace-pre-wrap font-regular leading-5 text-start", children: (0, jsx_runtime_1.jsx)(pager_md_1.default, { mdText: widget?.data
+                                                        ?.widget_greeting }) })] })] }) }), (0, jsx_runtime_1.jsx)("span", { onClick: () => setToggleText(false), style: {
+                                background: '#FFFFFF',
+                                color: '#000000',
+                                border: '1px solid #000000',
+                            }, className: `absolute -top-3 -right-3 p-[3.5px] rounded-full shadow-md border hover:text-zinc-500 hover:border-zinc-500 transform transition-all duration-200 opacity-0 translate-y-1 group-hover:opacity-100 group-hover:translate-y-0 pointer-events-none group-hover:pointer-events-auto cursor-pointer hover:scale-105 active:scale-95`, children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "w-3 h-3 transition-transform" }) }), (0, jsx_runtime_1.jsx)("div", { className: "w-[280px] flex flex-wrap gap-3 justify-end", children: Array.isArray(widget.data.starter_buttons) &&
+                                widget.data.starter_buttons.map((buttonText, i) => ((0, jsx_runtime_1.jsx)("button", { onMouseOver: () => setFloatBtnHover(i), onMouseLeave: () => setFloatBtnHover(null), onClick: () => {
+                                        setUserInitialMessage(buttonText);
+                                        localStorage.setItem('Tab', 'Chat');
+                                        widgetStore_1.widgetStore.trigger.selectTab({
+                                            tab: widgetStore_1.TabType.CHAT,
+                                        });
+                                        toggleWidget();
+                                    }, style: {
+                                        backgroundColor: widget.data
+                                            .use_brand_color
+                                            ? floatBtnHover === i
+                                                ? hexToRGB(widget.data
+                                                    .brand_color)
+                                                : widget.data
+                                                    .brand_color
+                                            : floatBtnHover === i
+                                                ? '#f0f0f0'
+                                                : 'white',
+                                        color: widget.data
+                                            .use_brand_color
+                                            ? (0, HomePageHeader_1.isDarkColor)(widget.data
+                                                .brand_color) == 'light'
+                                                ? '#000000'
+                                                : '#FFFFFF'
+                                            : '#000000',
+                                    }, className: "cursor-pointer floating-chip-hover flex items-center text-sm font-regular leading-5 rounded-[10px] min-h-max px-2.5 py-1.5 shadow-md transition-all duration-300 max-w-max w-max", children: buttonText }, i))) })] })), (0, jsx_runtime_1.jsxs)("button", { onClick: toggleWidget, onMouseEnter: () => setBtnHover(true), onMouseLeave: () => setBtnHover(false), style: {
+                        borderColor: widget?.data?.brand_color,
+                    }, className: `relative overflow-hidden flex items-center justify-center cursor-pointer transition ${shapeClass} ${widgetToggleState === 'OPEN' ? 'h-[58px] w-[58px]' : sizeClass} mb-4 mr-4 active:scale-95 duration-200 transition-all`, children: [isToggleOpen === 'CLOSE' &&
+                            widget?.data?.launcher_logo && ((0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 bg-center bg-cover transition-all duration-200", style: {
+                                backgroundImage: `url(${widget.data.launcher_logo})`,
+                            } })), isToggleOpen === 'OPEN' && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: `absolute inset-0 transition-all duration-200`, style: {
+                                        backgroundColor: btnHover
+                                            ? hexToRGB(widget?.data?.brand_color)
+                                            : widget?.data?.brand_color,
+                                        opacity: widgetToggleState === 'OPEN' ? 1 : 0,
+                                    } }), (0, jsx_runtime_1.jsx)(pikaicons_react_1.PiMultipleCrossCancelDefaultStroke, { style: {
+                                        color: (0, HomePageHeader_1.isDarkColor)(widget.data.brand_color) ==
+                                            'light'
+                                            ? '#000000'
+                                            : '#FFFFFF',
+                                    }, className: "w-8 h-8 relative z-10 transition-all duration-300" })] }))] })] }) }));
+};
+exports.WidgetToggleButton = WidgetToggleButton;

package/out/WidgetType.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });