function HealthCard({ title, content, icon, category }) { return /*#__PURE__*/ React.createElement("div", { className: "bg-white dark:bg-gray-800 rounded-xl shadow-lg p-6 max-w-sm transition-all duration-300 hover:shadow-xl", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center mb-4", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-10 h-10 flex items-center justify-center rounded-full bg-[#E3F2FD] dark:bg-[#1E3A5F]", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${icon} text-[#2196F3] dark:text-[#64B5F6] text-xl`, __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "ml-4", __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-inter text-lg font-semibold text-gray-800 dark:text-gray-100", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, title), /*#__PURE__*/ React.createElement("span", { className: "text-sm text-[#64B5F6] dark:text-[#90CAF9] font-inter", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, category))), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-gray-600 dark:text-gray-300 leading-relaxed", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, content)); } function HealthCardStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-8 grid grid-cols-1 md:grid-cols-2 gap-6 bg-gray-50 dark:bg-gray-900", __source: { fileName: "", lineNumber: 28, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(HealthCard, { icon: "fa-solid fa-heart-pulse", title: "Heart Rate", category: "Cardiovascular", content: "Your average heart rate this week is 72 BPM, which falls within the healthy range. Keep maintaining your regular exercise routine!", __source: { fileName: "", lineNumber: 29, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(HealthCard, { icon: "fa-solid fa-bed", title: "Sleep Quality", category: "Rest & Recovery", content: "You've maintained a consistent 7.5 hours of sleep per night. Your sleep efficiency has improved by 12% this month.", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(HealthCard, { icon: "fa-solid fa-person-walking", title: "Daily Steps", category: "Activity", content: "You've averaged 8,500 steps daily this week, meeting 85% of your daily goal. A great achievement!", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(HealthCard, { icon: "fa-solid fa-apple-whole", title: "Nutrition", category: "Diet & Wellness", content: "Your balanced diet includes all essential nutrients. Consider increasing your daily water intake by 2 glasses.", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this })); } function ChatMessage({ message, type = "user", timestamp = new Date().toISOString(), loading = false, animate = true }) { const [isVisible, setIsVisible] = useState(false); useEffect(()=>{ setIsVisible(true); }, []); const formatTimestamp = (isoString)=>{ const date = new Date(isoString); return date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }); }; const formatMessage = (text)=>{ return text.replace(/\*\*(.*?)\*\*/g, "$1").replace(/\*(.*?)\*/g, "$1").replace(/`(.*?)`/g, "$1").replace(/\n/g, "
"); }; const typeStyles = { user: "bg-[#F5F5F5] text-gray-900 dark:bg-gray-700 dark:text-white justify-end", ai: "bg-[#4A90E2] text-white dark:bg-[#2A5A8E] justify-start", system: "bg-[#FFB74D] text-gray-900 dark:bg-[#F57C00] justify-center" }; if (loading) { return /*#__PURE__*/ React.createElement("div", { className: "flex justify-start w-full transform transition-all duration-300 ease-out", __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 px-4 py-2 rounded-2xl bg-gray-100 dark:bg-gray-800", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-2 h-2 bg-[#4A90E2] rounded-full animate-bounce", style: { animationDelay: "0ms" }, __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-2 h-2 bg-[#4A90E2] rounded-full animate-bounce", style: { animationDelay: "300ms" }, __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-2 h-2 bg-[#4A90E2] rounded-full animate-bounce", style: { animationDelay: "600ms" }, __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }))); } return /*#__PURE__*/ React.createElement("div", { className: ` flex w-full ${typeStyles[type].split(" ").pop()} transform ${animate && isVisible ? "translate-y-0 opacity-100" : "translate-y-4 opacity-0"} transition-all duration-300 ease-out px-4 py-2 `, __source: { fileName: "", lineNumber: 55, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: ` relative max-w-[80%] md:max-w-[60%] px-6 py-3 rounded-2xl ${typeStyles[type]} font-inter text-sm md:text-base shadow-sm `, __source: { fileName: "", lineNumber: 67, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "prose prose-sm dark:prose-invert", dangerouslySetInnerHTML: { __html: formatMessage(message) }, __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-1 right-2 text-xs opacity-60 mt-1", __source: { fileName: "", lineNumber: 84, columnNumber: 9 }, __self: this }, formatTimestamp(timestamp)))); } function ChatMessageStory() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-6 p-6 bg-white dark:bg-gray-900 min-h-screen", __source: { fileName: "", lineNumber: 94, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ChatMessage, { type: "system", message: "Chat session started", timestamp: "2025-01-20T09:00:00Z", __source: { fileName: "", lineNumber: 95, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ChatMessage, { type: "ai", message: "Hello! How can I help you today? 👋", timestamp: "2025-01-20T09:00:05Z", __source: { fileName: "", lineNumber: 101, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ChatMessage, { type: "user", message: "I need help with my project 💻", timestamp: "2025-01-20T09:00:15Z", __source: { fileName: "", lineNumber: 107, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ChatMessage, { type: "ai", message: "I'd be happy to assist you with your project! Here are some key points to consider:\\n\\n* First, let's outline your goals\\n* Then, we can break it down into **manageable tasks**\\n* Finally, we'll create a `timeline`", timestamp: "2025-01-20T09:00:30Z", __source: { fileName: "", lineNumber: 113, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ChatMessage, { type: "user", message: "Thanks for the structured approach! 🙏", timestamp: "2025-01-20T09:00:45Z", __source: { fileName: "", lineNumber: 119, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(ChatMessage, { loading: true, __source: { fileName: "", lineNumber: 125, columnNumber: 7 }, __self: this })); } function ChatInput({ onSend, placeholder = "Type your message...", disabled = false, loading = false, maxLength = 1000 }) { const [message, setMessage] = useState(""); const [showEmoji, setShowEmoji] = useState(false); const textareaRef = useRef(null); const handleSend = useCallback(()=>{ if (message.trim() && onSend && !loading) { onSend(message); setMessage(""); setShowEmoji(false); if (textareaRef.current) { textareaRef.current.style.height = "auto"; } } }, [ message, onSend, loading ]); const handleKeyDown = useCallback((e)=>{ if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); handleSend(); } }, [ handleSend ]); const addEmoji = useCallback((emoji)=>{ if (message.length + emoji.length <= maxLength) { setMessage((prev)=>prev + emoji); textareaRef.current?.focus(); } }, [ message, maxLength ]); const handleTextareaChange = useCallback((e)=>{ const textarea = e.target; const newValue = textarea.value; if (newValue.length <= maxLength) { setMessage(newValue); textarea.style.height = "auto"; textarea.style.height = `${textarea.scrollHeight}px`; } }, [ maxLength ]); const emojis = [ "😊", "👋", "❤️", "👍", "🙏", "✨", "🎉", "🤔", "😄", "🌟" ]; return /*#__PURE__*/ React.createElement("div", { className: "w-full bg-white dark:bg-gray-800 rounded-xl shadow-lg p-4", __source: { fileName: "", lineNumber: 60, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 61, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 62, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-start gap-2", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowEmoji(!showEmoji), className: "mt-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200 transition-colors", type: "button", disabled: disabled || loading, __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-regular fa-face-smile text-xl", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-1 relative", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { ref: textareaRef, value: message, onChange: handleTextareaChange, onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled || loading, rows: 1, className: "w-full bg-gray-100 dark:bg-gray-700 rounded-lg px-4 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 dark:text-white font-inter transition-all resize-none min-h-[40px] max-h-[200px]", __source: { fileName: "", lineNumber: 73, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-2 right-2 text-xs text-gray-400", __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }, message.length, "/", maxLength)), /*#__PURE__*/ React.createElement("button", { onClick: handleSend, disabled: !message.trim() || disabled || loading, className: `mt-2 px-4 py-2 rounded-full transition-all ${message.trim() && !disabled && !loading ? "bg-blue-500 hover:bg-blue-600 text-white" : "bg-gray-200 dark:bg-gray-600 text-gray-400 cursor-not-allowed"}`, type: "button", __source: { fileName: "", lineNumber: 87, columnNumber: 13 }, __self: this }, loading ? /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-spinner fa-spin", __source: { fileName: "", lineNumber: 98, columnNumber: 17 }, __self: this }) : /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-paper-plane", __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this })))), showEmoji && /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-full mb-2 bg-white dark:bg-gray-800 p-2 rounded-xl shadow-lg border border-gray-200 dark:border-gray-700", __source: { fileName: "", lineNumber: 107, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-2", __source: { fileName: "", lineNumber: 108, columnNumber: 13 }, __self: this }, emojis.map((emoji)=>/*#__PURE__*/ React.createElement("button", { key: emoji, onClick: ()=>addEmoji(emoji), className: "text-xl hover:scale-125 transition-transform", type: "button", __source: { fileName: "", lineNumber: 110, columnNumber: 17 }, __self: this }, emoji)))))); } function ChatInputStory() { const [messages, setMessages] = useState([]); const [isLoading, setIsLoading] = useState(false); const handleSend = useCallback((message)=>{ setIsLoading(true); setMessages((prev)=>[ ...prev, message ]); setTimeout(()=>{ setIsLoading(false); }, 2000); }, []); return /*#__PURE__*/ React.createElement("div", { className: "p-4 space-y-4 max-w-2xl mx-auto", __source: { fileName: "", lineNumber: 141, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 142, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-inter font-semibold text-gray-700 dark:text-gray-300", __source: { fileName: "", lineNumber: 143, columnNumber: 9 }, __self: this }, "Default State"), /*#__PURE__*/ React.createElement(ChatInput, { onSend: handleSend, loading: isLoading, __source: { fileName: "", lineNumber: 146, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 149, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-inter font-semibold text-gray-700 dark:text-gray-300", __source: { fileName: "", lineNumber: 150, columnNumber: 9 }, __self: this }, "Disabled State"), /*#__PURE__*/ React.createElement(ChatInput, { onSend: handleSend, disabled: true, __source: { fileName: "", lineNumber: 153, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 156, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-inter font-semibold text-gray-700 dark:text-gray-300", __source: { fileName: "", lineNumber: 157, columnNumber: 9 }, __self: this }, "Loading State"), /*#__PURE__*/ React.createElement(ChatInput, { onSend: handleSend, loading: true, __source: { fileName: "", lineNumber: 160, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 163, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-inter font-semibold text-gray-700 dark:text-gray-300", __source: { fileName: "", lineNumber: 164, columnNumber: 9 }, __self: this }, "With Short Max Length"), /*#__PURE__*/ React.createElement(ChatInput, { onSend: handleSend, maxLength: 50, __source: { fileName: "", lineNumber: 167, columnNumber: 9 }, __self: this }))); } function MainComponent() { const [messages, setMessages] = useState([ { role: "assistant", content: "Hi! I'm your AI health assistant. I can help you with:\n- Personalized health advice based on your data\n- Answer questions about symptoms and wellness\n- Analyze health metrics and provide insights\n- Review images for basic symptom analysis\n\nHow can I help you today? 🌟", timestamp: new Date().toISOString() } ]); const [error, setError] = useState(null); const [upload, { loading: uploadLoading }] = useUpload(); const [streamingMessage, setStreamingMessage] = useState(""); const messagesEndRef = useRef(null); const scrollToBottom = useCallback(()=>{ messagesEndRef.current?.scrollIntoView({ behavior: "smooth" }); }, []); useEffect(()=>{ scrollToBottom(); }, [ messages, scrollToBottom ]); const handleFinish = useCallback((message)=>{ setMessages((prev)=>[ ...prev, { role: "assistant", content: message, timestamp: new Date().toISOString() } ]); setStreamingMessage(""); }, []); const handleStreamResponse = useHandleStreamResponse({ onChunk: setStreamingMessage, onFinish: handleFinish }); const handleSend = useCallback(async (message)=>{ try { setError(null); setMessages((prev)=>[ ...prev, { role: "user", content: message, timestamp: new Date().toISOString() } ]); const response = await fetch("/integrations/chat-gpt/conversationgpt4", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ messages: [ { role: "system", content: "You are a helpful health assistant. Use the user's health data to provide personalized advice." }, ...messages.map((m)=>({ role: m.role, content: m.content })), { role: "user", content: message } ], stream: true }) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } handleStreamResponse(response); } catch (err) { console.error(err); setError("Sorry, I'm having trouble responding right now. Please try again."); } }, [ messages, handleStreamResponse ]); const handleImageUpload = useCallback(async (file)=>{ try { const { url, error: uploadError } = await upload({ file }); if (uploadError) throw new Error(uploadError); handleSend(`I'm uploading an image for analysis: ${url}`); } catch (err) { console.error(err); setError("Sorry, I couldn't upload the image. Please try again."); } }, [ upload, handleSend ]); const quickQuestions = [ "How's my sleep quality?", "Check my activity level", "Nutrition advice", "Stress management tips" ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 dark:bg-gray-900", __source: { fileName: "", lineNumber: 112, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto px-4 py-6", __source: { fileName: "", lineNumber: 113, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "flex items-center gap-4 mb-6", __source: { fileName: "", lineNumber: 114, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 rounded-full bg-[#4A90E2] flex items-center justify-center", __source: { fileName: "", lineNumber: 115, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-robot text-white text-xl", __source: { fileName: "", lineNumber: 116, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 118, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-inter text-2xl font-bold text-gray-800 dark:text-white", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }, "HealthBot"), /*#__PURE__*/ React.createElement("p", { className: "font-inter text-[#4A90E2] dark:text-[#64B5F6]", __source: { fileName: "", lineNumber: 122, columnNumber: 13 }, __self: this }, "Your personal health companion"))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col lg:flex-row gap-6", __source: { fileName: "", lineNumber: 128, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 bg-white dark:bg-gray-800 rounded-xl shadow-lg h-[70vh] flex flex-col", __source: { fileName: "", lineNumber: 129, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto p-4 space-y-4", __source: { fileName: "", lineNumber: 130, columnNumber: 13 }, __self: this }, messages.map((msg, index)=>/*#__PURE__*/ React.createElement(ChatMessage, { key: index, type: msg.role === "user" ? "user" : "ai", message: msg.content, timestamp: msg.timestamp, __source: { fileName: "", lineNumber: 132, columnNumber: 17 }, __self: this })), streamingMessage && /*#__PURE__*/ React.createElement(ChatMessage, { type: "ai", message: streamingMessage, timestamp: new Date().toISOString(), __source: { fileName: "", lineNumber: 140, columnNumber: 17 }, __self: this }), error && /*#__PURE__*/ React.createElement(ChatMessage, { type: "system", message: error, timestamp: new Date().toISOString(), __source: { fileName: "", lineNumber: 147, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { ref: messagesEndRef, __source: { fileName: "", lineNumber: 153, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "p-4 border-t border-gray-200 dark:border-gray-700", __source: { fileName: "", lineNumber: 156, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-2 mb-4", __source: { fileName: "", lineNumber: 157, columnNumber: 15 }, __self: this }, quickQuestions.map((q, i)=>/*#__PURE__*/ React.createElement("button", { key: i, onClick: ()=>handleSend(q), className: "px-4 py-2 bg-[#E3F2FD] dark:bg-[#1E3A5F] text-[#4A90E2] dark:text-[#64B5F6] rounded-full text-sm font-inter hover:bg-[#BBDEFB] dark:hover:bg-[#2A5A8E] transition-colors", __source: { fileName: "", lineNumber: 159, columnNumber: 19 }, __self: this }, q))), /*#__PURE__*/ React.createElement(ChatInput, { onSend: handleSend, placeholder: "Ask me about your health...", loading: !!streamingMessage, disabled: !!streamingMessage, __source: { fileName: "", lineNumber: 168, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "lg:w-[400px] space-y-4", __source: { fileName: "", lineNumber: 177, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(HealthCard, { icon: "fa-solid fa-upload", title: "Image Analysis", category: "Symptom Check", content: /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 183, columnNumber: 17 } }, /*#__PURE__*/ React.createElement("input", { type: "file", accept: "image/*", onChange: (e)=>e.target.files?.[0] && handleImageUpload(e.target.files[0]), className: "w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-sm file:font-semibold file:bg-[#E3F2FD] file:text-[#4A90E2] hover:file:bg-[#BBDEFB]", __source: { fileName: "", lineNumber: 184, columnNumber: 19 } })), __source: { fileName: "", lineNumber: 178, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement(HealthCard, { icon: "fa-solid fa-notes-medical", title: "Health Tips", category: "Recommendations", content: "Upload images or ask questions about your symptoms for personalized health advice.", __source: { fileName: "", lineNumber: 196, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 pointer-events-none", __source: { fileName: "", lineNumber: 205, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 left-0 w-64 h-64 bg-[#4A90E2] opacity-5 rounded-full blur-3xl", __source: { fileName: "", lineNumber: 206, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "absolute bottom-0 right-0 w-64 h-64 bg-[#2ECC71] opacity-5 rounded-full blur-3xl", __source: { fileName: "", lineNumber: 207, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 211, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } } .chat-container { animation: fadeIn 0.5s ease-out; } `)); }