agenticaichat 1.0.1 → 1.0.4

package/dist/widget/ChatbotWidget.js

@@ -36,183 +36,464 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ChatbotWidget = void 0;
 const react_1 = __importStar(require("react"));
 const lucide_react_1 = require("lucide-react");
-const ChatbotWidget = ({ fullScreen = false }) => {
+const ChatbotWidget = ({ fullScreen = false, }) => {
     const [isOpen, setIsOpen] = (0, react_1.useState)(fullScreen);
+    const [isMaximized, setIsMaximized] = (0, react_1.useState)(fullScreen);
+    const [isHidden, setIsHidden] = (0, react_1.useState)(false);
+    const [position, setPosition] = (0, react_1.useState)("bottom-right");
+    const [showPositionMenu, setShowPositionMenu] = (0, react_1.useState)(false);
     const [messages, setMessages] = (0, react_1.useState)([
         {
             id: 1,
-            type: 'bot',
-            text: 'नमस्ते! 👋 मैं आपके बिजनेस के बारे में सवालों का जवाब दे सकता हूँ।'
-        }
+            type: "bot",
+            text: "Hello! 👋 Welcome to our support chat. How can I assist you today?",
+            timestamp: new Date(),
+        },
     ]);
-    const [input, setInput] = (0, react_1.useState)('');
+    const [input, setInput] = (0, react_1.useState)("");
     const [loading, setLoading] = (0, react_1.useState)(false);
     const messagesEndRef = (0, react_1.useRef)(null);
-    // Auto-scroll to bottom
+    const menuRef = (0, react_1.useRef)(null);
+    // Load position from localStorage on mount
+    (0, react_1.useEffect)(() => {
+        const savedPosition = localStorage.getItem("chatbot-position");
+        if (savedPosition) {
+            setPosition(savedPosition);
+        }
+    }, []);
+    // Close menu when clicking outside
     (0, react_1.useEffect)(() => {
-        messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+        const handleClickOutside = (event) => {
+            if (menuRef.current && !menuRef.current.contains(event.target)) {
+                setShowPositionMenu(false);
+            }
+        };
+        if (showPositionMenu) {
+            document.addEventListener("mousedown", handleClickOutside);
+        }
+        return () => {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [showPositionMenu]);
+    (0, react_1.useEffect)(() => {
+        messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
     }, [messages]);
     const handleSend = async () => {
         if (!input.trim() || loading)
             return;
-        // Add user message
         const userMessage = {
             id: messages.length + 1,
-            type: 'user',
-            text: input
+            type: "user",
+            text: input,
+            timestamp: new Date(),
         };
-        setMessages(prev => [...prev, userMessage]);
+        setMessages((prev) => [...prev, userMessage]);
         const currentInput = input;
-        setInput('');
+        setInput("");
         setLoading(true);
         try {
-            // Call backend API
-            const response = await fetch('/api/chatbot/query', {
-                method: 'POST',
+            const response = await fetch("/api/chatbot/query", {
+                method: "POST",
                 headers: {
-                    'Content-Type': 'application/json',
+                    "Content-Type": "application/json",
                 },
-                body: JSON.stringify({ query: currentInput })
+                body: JSON.stringify({ query: currentInput }),
             });
             if (!response.ok) {
-                throw new Error('API request failed');
+                throw new Error("API request failed");
             }
             const data = await response.json();
             const botMessage = {
                 id: messages.length + 2,
-                type: 'bot',
-                text: data.success ? data.answer : 'Sorry, I could not process your query.'
+                type: "bot",
+                text: data.success
+                    ? data.answer
+                    : "I apologize, but I could not process your request.",
+                timestamp: new Date(),
             };
-            setMessages(prev => [...prev, botMessage]);
+            setMessages((prev) => [...prev, botMessage]);
         }
         catch (error) {
-            console.error('Chatbot error:', error);
+            console.error("Chatbot error:", error);
             const errorMessage = {
                 id: messages.length + 2,
-                type: 'bot',
-                text: '❌ Sorry, कुछ गड़बड़ी हुई। Please try again.'
+                type: "bot",
+                text: "Sorry, something went wrong. Please try again.",
+                timestamp: new Date(),
             };
-            setMessages(prev => [...prev, errorMessage]);
+            setMessages((prev) => [...prev, errorMessage]);
         }
         finally {
             setLoading(false);
         }
     };
+    const formatTime = (date) => {
+        return date.toLocaleTimeString("en-US", {
+            hour: "2-digit",
+            minute: "2-digit",
+        });
+    };
+    const handlePositionChange = (newPosition) => {
+        setPosition(newPosition);
+        localStorage.setItem("chatbot-position", newPosition);
+        setShowPositionMenu(false);
+    };
+    const handleHide = () => {
+        setIsHidden(true);
+        setShowPositionMenu(false);
+    };
+    // Get position styles
+    const getButtonPosition = () => {
+        const base = { position: "fixed", zIndex: 9999 };
+        switch (position) {
+            case "top-left":
+                return { ...base, top: "24px", left: "24px" };
+            case "top-right":
+                return { ...base, top: "24px", right: "24px" };
+            case "bottom-left":
+                return { ...base, bottom: "24px", left: "24px" };
+            case "bottom-right":
+            default:
+                return { ...base, bottom: "24px", right: "24px" };
+        }
+    };
+    const getChatPosition = () => {
+        const base = { position: "fixed", zIndex: 9999 };
+        if (isMaximized) {
+            return { ...base, top: 0, left: 0, right: 0, bottom: 0 };
+        }
+        switch (position) {
+            case "top-left":
+                return { ...base, top: "24px", left: "24px" };
+            case "top-right":
+                return { ...base, top: "24px", right: "24px" };
+            case "bottom-left":
+                return { ...base, bottom: "24px", left: "24px" };
+            case "bottom-right":
+            default:
+                return { ...base, bottom: "24px", right: "24px" };
+        }
+    };
+    // Hidden state (reload to show again)
+    if (isHidden && !fullScreen) {
+        return null;
+    }
     // Floating button view
     if (!fullScreen && !isOpen) {
-        return (react_1.default.createElement("button", { onClick: () => setIsOpen(true), style: {
-                position: 'fixed',
-                bottom: '20px',
-                right: '20px',
-                width: '60px',
-                height: '60px',
-                borderRadius: '50%',
-                background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
-                border: 'none',
-                cursor: 'pointer',
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                color: 'white',
-                boxShadow: '0 4px 12px rgba(102, 126, 234, 0.4)',
-                zIndex: 9999,
-                transition: 'transform 0.2s'
-            }, onMouseOver: (e) => e.currentTarget.style.transform = 'scale(1.1)', onMouseOut: (e) => e.currentTarget.style.transform = 'scale(1)' },
-            react_1.default.createElement(lucide_react_1.MessageCircle, { size: 28 })));
+        return (react_1.default.createElement("div", { style: { ...getButtonPosition() } },
+            showPositionMenu && (react_1.default.createElement("div", { ref: menuRef, style: {
+                    position: "absolute",
+                    bottom: position.startsWith("bottom") ? "70px" : "auto",
+                    top: position.startsWith("top") ? "70px" : "auto",
+                    right: position.endsWith("right") ? "0" : "auto",
+                    left: position.endsWith("left") ? "0" : "auto",
+                    background: "#fff",
+                    borderRadius: "12px",
+                    boxShadow: "0 10px 40px rgba(0, 0, 0, 0.15)",
+                    padding: "8px",
+                    minWidth: "200px",
+                    border: "1px solid #e5e7eb",
+                    zIndex: 10000,
+                } },
+                [
+                    { label: "Top Left", value: "top-left" },
+                    { label: "Top Right", value: "top-right" },
+                    { label: "Bottom Left", value: "bottom-left" },
+                    { label: "Bottom Right", value: "bottom-right" },
+                ].map((pos) => (react_1.default.createElement("button", { key: pos.value, onClick: () => handlePositionChange(pos.value), style: {
+                        width: "100%",
+                        padding: "10px 12px",
+                        background: position === pos.value ? "#f3f4f6" : "transparent",
+                        border: "none",
+                        borderRadius: "8px",
+                        textAlign: "left",
+                        cursor: "pointer",
+                        fontSize: "14px",
+                        color: "#1f2937",
+                        transition: "background 0.2s",
+                        display: "flex",
+                        alignItems: "center",
+                        gap: "8px",
+                    }, onMouseOver: (e) => (e.currentTarget.style.background = "#f3f4f6"), onMouseOut: (e) => (e.currentTarget.style.background =
+                        position === pos.value ? "#f3f4f6" : "transparent") },
+                    position === pos.value && (react_1.default.createElement("span", { style: { color: "#4f46e5" } }, "\u2713")),
+                    pos.label))),
+                react_1.default.createElement("div", { style: { height: "1px", background: "#e5e7eb", margin: "8px 0" } }),
+                react_1.default.createElement("button", { onClick: handleHide, style: {
+                        width: "100%",
+                        padding: "10px 12px",
+                        background: "transparent",
+                        border: "none",
+                        borderRadius: "8px",
+                        textAlign: "left",
+                        cursor: "pointer",
+                        fontSize: "14px",
+                        color: "#dc2626",
+                        transition: "background 0.2s",
+                    }, onMouseOver: (e) => (e.currentTarget.style.background = "#fef2f2"), onMouseOut: (e) => (e.currentTarget.style.background = "transparent") }, "Hide Widget"))),
+            react_1.default.createElement("div", { style: { position: "relative" } },
+                react_1.default.createElement("button", { onClick: () => setIsOpen(true), style: {
+                        width: "56px",
+                        height: "56px",
+                        borderRadius: "50%",
+                        background: "#fff",
+                        border: "1px solid #e5e7eb",
+                        cursor: "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        color: "#4f46e5",
+                        boxShadow: "0 10px 25px rgba(0, 0, 0, 0.1)",
+                        transition: "all 0.3s ease",
+                    }, onMouseOver: (e) => {
+                        e.currentTarget.style.transform = "scale(1.05)";
+                        e.currentTarget.style.boxShadow =
+                            "0 15px 35px rgba(0, 0, 0, 0.15)";
+                    }, onMouseOut: (e) => {
+                        e.currentTarget.style.transform = "scale(1)";
+                        e.currentTarget.style.boxShadow =
+                            "0 10px 25px rgba(0, 0, 0, 0.1)";
+                    } },
+                    react_1.default.createElement(lucide_react_1.MessageCircle, { size: 24, strokeWidth: 2 })),
+                react_1.default.createElement("button", { onClick: (e) => {
+                        e.stopPropagation();
+                        setShowPositionMenu(!showPositionMenu);
+                    }, style: {
+                        position: "absolute",
+                        top: "-8px",
+                        right: "-8px",
+                        width: "24px",
+                        height: "24px",
+                        borderRadius: "50%",
+                        background: "#ffffffff",
+                        border: "none",
+                        cursor: "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        color: "#000000ff",
+                        boxShadow: "0 2px 8px rgba(79, 70, 229, 0.4)",
+                        transition: "all 0.2s",
+                    }, onMouseOver: (e) => {
+                        e.currentTarget.style.background = "#ffffffff";
+                        e.currentTarget.style.transform = "scale(1.1)";
+                    }, onMouseOut: (e) => {
+                        e.currentTarget.style.background = "#ffffffff";
+                        e.currentTarget.style.transform = "scale(1)";
+                    } },
+                    react_1.default.createElement(lucide_react_1.MoreHorizontal, { size: 14 })))));
     }
     // Chat box view
+    const chatWidth = isMaximized ? "100vw" : "420px";
+    const chatHeight = isMaximized ? "100vh" : "650px";
     return (react_1.default.createElement("div", { style: {
-            position: 'fixed',
-            bottom: fullScreen ? 0 : '20px',
-            right: fullScreen ? 0 : '20px',
-            width: fullScreen ? '100vw' : '400px',
-            height: fullScreen ? '100vh' : '600px',
-            background: 'white',
-            borderRadius: fullScreen ? 0 : '12px',
-            boxShadow: '0 5px 40px rgba(0, 0, 0, 0.16)',
-            display: 'flex',
-            flexDirection: 'column',
-            zIndex: 9999,
-            fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
+            ...getChatPosition(),
+            width: chatWidth,
+            height: chatHeight,
+            background: "#ffffff",
+            borderRadius: isMaximized ? 0 : "16px",
+            boxShadow: "0 20px 60px rgba(0, 0, 0, 0.15)",
+            display: "flex",
+            flexDirection: "column",
+            fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", sans-serif',
+            border: "1px solid #e5e7eb",
+            overflow: "hidden",
         } },
         react_1.default.createElement("div", { style: {
-                background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
-                color: 'white',
-                padding: '16px',
-                borderRadius: fullScreen ? 0 : '12px 12px 0 0',
-                display: 'flex',
-                justifyContent: 'space-between',
-                alignItems: 'center'
+                background: "#ffffff",
+                color: "#1f2937",
+                padding: "10px 24px",
+                borderBottom: "1px solid #e5e7eb",
+                display: "flex",
+                justifyContent: "space-between",
+                alignItems: "center",
             } },
-            react_1.default.createElement("h3", { style: { margin: 0, fontSize: '16px' } }, "\uD83E\uDD16 AI Assistant"),
-            !fullScreen && (react_1.default.createElement("button", { onClick: () => setIsOpen(false), style: {
-                    background: 'none',
-                    border: 'none',
-                    color: 'white',
-                    cursor: 'pointer',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    padding: '4px'
-                } },
-                react_1.default.createElement(lucide_react_1.X, { size: 20 })))),
+            react_1.default.createElement("div", { style: { display: "flex", alignItems: "center", gap: "12px" } },
+                react_1.default.createElement("div", { style: {
+                        width: "40px",
+                        height: "40px",
+                        borderRadius: "50%",
+                        background: "linear-gradient(135deg, #2563eb, #06b6d4)",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        boxShadow: "0 4px 10px rgba(37, 99, 235, 0.35)",
+                    } },
+                    react_1.default.createElement("span", { style: {
+                            color: "#fff",
+                            fontSize: "18px",
+                            fontWeight: "600",
+                            transform: "translateY(-1px)",
+                        } }, "\u27C1")),
+                react_1.default.createElement("div", null,
+                    react_1.default.createElement("h3", { style: {
+                            margin: 0,
+                            fontSize: "16px",
+                            fontWeight: "600",
+                            color: "#111827",
+                        } }, "AgenticAiChat"),
+                    react_1.default.createElement("p", { style: { margin: 0, fontSize: "12px", color: "#6b7280" } }, "Online \u2022 Ready to help"))),
+            react_1.default.createElement("div", { style: { display: "flex", gap: "8px" } },
+                !fullScreen && (react_1.default.createElement("button", { onClick: () => setIsMaximized(!isMaximized), style: {
+                        background: "none",
+                        border: "none",
+                        color: "#6b7280",
+                        cursor: "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        padding: "8px",
+                        borderRadius: "8px",
+                        transition: "all 0.2s",
+                    }, onMouseOver: (e) => {
+                        e.currentTarget.style.background = "#f3f4f6";
+                        e.currentTarget.style.color = "#111827";
+                    }, onMouseOut: (e) => {
+                        e.currentTarget.style.background = "none";
+                        e.currentTarget.style.color = "#6b7280";
+                    } }, isMaximized ? react_1.default.createElement(lucide_react_1.Minimize2, { size: 18 }) : react_1.default.createElement(lucide_react_1.Maximize2, { size: 18 }))),
+                !fullScreen && (react_1.default.createElement("button", { onClick: () => setIsOpen(false), style: {
+                        background: "none",
+                        border: "none",
+                        color: "#6b7280",
+                        cursor: "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        padding: "8px",
+                        borderRadius: "8px",
+                        transition: "all 0.2s",
+                    }, onMouseOver: (e) => {
+                        e.currentTarget.style.background = "#f3f4f6";
+                        e.currentTarget.style.color = "#111827";
+                    }, onMouseOut: (e) => {
+                        e.currentTarget.style.background = "none";
+                        e.currentTarget.style.color = "#6b7280";
+                    } },
+                    react_1.default.createElement(lucide_react_1.X, { size: 18 }))))),
         react_1.default.createElement("div", { style: {
                 flex: 1,
-                overflowY: 'auto',
-                padding: '16px',
-                display: 'flex',
-                flexDirection: 'column',
-                gap: '12px',
-                background: '#f9f9f9'
+                overflowY: "auto",
+                padding: "14px",
+                display: "flex",
+                flexDirection: "column",
+                gap: "2px",
+                background: "#fafafa",
             } },
-            messages.map(msg => (react_1.default.createElement("div", { key: msg.id, style: {
-                    maxWidth: '80%',
-                    padding: '10px 14px',
-                    borderRadius: '8px',
-                    alignSelf: msg.type === 'user' ? 'flex-end' : 'flex-start',
-                    background: msg.type === 'user' ? '#667eea' : 'white',
-                    color: msg.type === 'user' ? 'white' : '#333',
-                    boxShadow: '0 2px 4px rgba(0,0,0,0.1)',
-                    wordWrap: 'break-word',
-                    animation: 'fadeIn 0.3s ease'
-                } }, msg.text))),
+            messages.map((msg) => (react_1.default.createElement("div", { key: msg.id, style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: msg.type === "user" ? "flex-end" : "flex-start",
+                    animation: "fadeIn 0.3s ease",
+                } },
+                react_1.default.createElement("div", { style: {
+                        maxWidth: "75%",
+                        padding: "12px 16px",
+                        borderRadius: msg.type === "user"
+                            ? "16px 16px 4px 16px"
+                            : "16px 16px 16px 4px",
+                        background: msg.type === "user" ? "#ffffffff" : "#ffffff",
+                        color: msg.type === "user" ? "#1f2937" : "#1f2937",
+                        boxShadow: msg.type === "user"
+                            ? "0 2px 8px rgba(79, 70, 229, 0.2)"
+                            : "0 2px 8px rgba(0, 0, 0, 0.08)",
+                        wordWrap: "break-word",
+                        fontSize: "12px",
+                        lineHeight: "1.5",
+                        border: msg.type === "bot" ? "1px solid #e5e7eb" : "none",
+                    } }, msg.text),
+                react_1.default.createElement("span", { style: {
+                        fontSize: "10px",
+                        color: "#9ca3af",
+                        marginTop: "4px",
+                        padding: "0 4px",
+                    } }, formatTime(msg.timestamp))))),
             loading && (react_1.default.createElement("div", { style: {
-                    alignSelf: 'flex-start',
-                    fontStyle: 'italic',
-                    color: '#999',
-                    padding: '8px'
-                } }, "Typing...")),
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px",
+                    padding: "12px 16px",
+                    background: "#ffffff",
+                    borderRadius: "16px 16px 16px 4px",
+                    maxWidth: "75%",
+                    boxShadow: "0 2px 8px rgba(0, 0, 0, 0.08)",
+                    border: "1px solid #e5e7eb",
+                } },
+                react_1.default.createElement("div", { style: {
+                        display: "flex",
+                        gap: "4px",
+                    } }, [0, 1, 2].map((i) => (react_1.default.createElement("div", { key: i, style: {
+                        width: "8px",
+                        height: "8px",
+                        borderRadius: "50%",
+                        background: "#d1d5db",
+                        animation: `bounce 1.4s infinite ease-in-out ${i * 0.16}s`,
+                    } })))),
+                react_1.default.createElement("style", null, `
+              @keyframes bounce {
+                0%, 80%, 100% { transform: scale(0); }
+                40% { transform: scale(1); }
+              }
+              @keyframes fadeIn {
+                from { opacity: 0; transform: translateY(10px); }
+                to { opacity: 1; transform: translateY(0); }
+              }
+            `))),
             react_1.default.createElement("div", { ref: messagesEndRef })),
         react_1.default.createElement("div", { style: {
-                padding: '12px',
-                borderTop: '1px solid #eee',
-                display: 'flex',
-                gap: '8px',
-                background: 'white',
-                borderRadius: fullScreen ? 0 : '0 0 12px 12px'
+                padding: "16px 24px 20px",
+                borderTop: "1px solid #e5e7eb",
+                background: "#ffffff",
             } },
-            react_1.default.createElement("input", { type: "text", value: input, onChange: (e) => setInput(e.target.value), onKeyPress: (e) => e.key === 'Enter' && handleSend(), placeholder: "\u0905\u092A\u0928\u093E \u0938\u0935\u093E\u0932 \u092A\u0942\u091B\u094B...", disabled: loading, style: {
-                    flex: 1,
-                    padding: '10px 16px',
-                    border: '1px solid #ddd',
-                    borderRadius: '20px',
-                    outline: 'none',
-                    fontSize: '14px',
-                    transition: 'border-color 0.2s'
-                }, onFocus: (e) => e.currentTarget.style.borderColor = '#667eea', onBlur: (e) => e.currentTarget.style.borderColor = '#ddd' }),
-            react_1.default.createElement("button", { onClick: handleSend, disabled: loading || !input.trim(), style: {
-                    width: '40px',
-                    height: '40px',
-                    borderRadius: '50%',
-                    background: loading || !input.trim() ? '#ccc' : '#667eea',
-                    border: 'none',
-                    color: 'white',
-                    cursor: loading || !input.trim() ? 'not-allowed' : 'pointer',
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'center',
-                    transition: 'background 0.2s'
+            react_1.default.createElement("div", { style: {
+                    display: "flex",
+                    gap: "12px",
+                    alignItems: "center",
+                    background: "#f9fafb",
+                    borderRadius: "24px",
+                    padding: "4px 4px 4px 20px",
+                    border: "1px solid #e5e7eb",
+                    transition: "all 0.2s",
+                }, onFocus: (e) => {
+                    e.currentTarget.style.borderColor = "#4f46e5";
+                    e.currentTarget.style.background = "#ffffff";
+                }, onBlur: (e) => {
+                    e.currentTarget.style.borderColor = "#e5e7eb";
+                    e.currentTarget.style.background = "#f9fafb";
                 } },
-                react_1.default.createElement(lucide_react_1.Send, { size: 18 })))));
+                react_1.default.createElement("input", { type: "text", value: input, onChange: (e) => setInput(e.target.value), onKeyPress: (e) => e.key === "Enter" && handleSend(), placeholder: "Type your message...", disabled: loading, style: {
+                        flex: 1,
+                        padding: "10px 0",
+                        border: "none",
+                        background: "transparent",
+                        outline: "none",
+                        fontSize: "14px",
+                        color: "#1f2937",
+                    } }),
+                react_1.default.createElement("button", { onClick: handleSend, disabled: loading || !input.trim(), style: {
+                        width: "40px",
+                        height: "40px",
+                        borderRadius: "50%",
+                        background: loading || !input.trim() ? "#e5e7eb" : "#4f46e5",
+                        border: "none",
+                        color: "white",
+                        cursor: loading || !input.trim() ? "not-allowed" : "pointer",
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        transition: "all 0.2s",
+                        flexShrink: 0,
+                    }, onMouseOver: (e) => {
+                        if (!loading && input.trim()) {
+                            e.currentTarget.style.background = "#4338ca";
+                            e.currentTarget.style.transform = "scale(1.05)";
+                        }
+                    }, onMouseOut: (e) => {
+                        if (!loading && input.trim()) {
+                            e.currentTarget.style.background = "#4f46e5";
+                            e.currentTarget.style.transform = "scale(1)";
+                        }
+                    } },
+                    react_1.default.createElement(lucide_react_1.Send, { size: 18 }))))));
 };
 exports.ChatbotWidget = ChatbotWidget;