function MainComponent() { const [messages, setMessages] = React.useState([ { sender: 'Bot', text: 'How can I make your day better today? 😊' } ]); const [userMessage, setUserMessage] = React.useState(''); const handleMessageChange = (e)=>{ setUserMessage(e.target.value); }; const handleSendMessage = ()=>{ if (userMessage.trim() === '') return; const newMessages = [ ...messages, { sender: 'You', text: userMessage } ]; setMessages(newMessages); setUserMessage(''); const botResponse = 'I\'m here to chat with you! What would you like to talk about?'; setTimeout(()=>{ setMessages((prevMessages)=>[ ...prevMessages, { sender: 'Bot', text: botResponse } ]); }, 1000); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f0f0] font-sans", __source: { fileName: "", lineNumber: 25, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg p-6 bg-white rounded-lg shadow-lg", __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-serif text-center mb-4", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, "仮想恋愛チャットボット"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-left text-lg font-sans mb-2", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, "Casually ask me anything!"), /*#__PURE__*/ React.createElement("div", { className: "bg-[#e0e7ff] p-4 rounded-lg mb-4 max-h-[400px] overflow-y-auto", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, messages.map((message, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "font-sans mb-2", __source: { fileName: "", lineNumber: 32, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[#111827]", __source: { fileName: "", lineNumber: 33, columnNumber: 17 }, __self: this }, message.sender, ":"), " ", message.text))), /*#__PURE__*/ React.createElement("input", { type: "text", name: "userMessage", value: userMessage, onChange: handleMessageChange, className: "w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#6366f1]", placeholder: "Type your message...", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "w-full py-3 bg-[#6366f1] text-white rounded-lg font-sans hover:bg-[#4f46e5]", onClick: handleSendMessage, __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this }, "送信"))); }