function MainComponent() { const [messages, setMessages] = React.useState([ { id: 1, text: "オブジェクト指向は終わりました。", sender: "bot" } ]); const handleSubmit = (e)=>{ e.preventDefault(); const userInput = e.target.elements.userInput.value.trim(); if (userInput) { setMessages([ ...messages, { id: messages.length + 1, text: userInput, sender: "user" } ]); setTimeout(()=>{ setMessages((prev)=>[ ...prev, { id: prev.length + 1, text: "オブジェクト指向はまだ終わっていません！", sender: "bot" } ]); }, 1000); } e.target.elements.userInput.value = ''; }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#F0F2F5] flex items-center justify-center", __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white shadow-lg rounded-lg p-8 w-full max-w-[600px]", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-roboto text-xl text-[#121212] mb-4", __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "オブジェクト指向が終わったと絶対に言い続ける生成AI搭載のチャットシステム"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, messages.map((message)=>/*#__PURE__*/ React.createElement("div", { key: message.id, className: `flex items-center p-4 ${message.sender === 'bot' ? 'bg-[#EDEFF2]' : 'bg-[#DFF0D8]'} rounded`, __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, message.sender === 'bot' ? /*#__PURE__*/ React.createElement("i", { className: "fas fa-robot text-[#0077CC] text-2xl", __source: { fileName: "", lineNumber: 25, columnNumber: 43 }, __self: this }) : null, /*#__PURE__*/ React.createElement("span", { className: `ml-4 font-roboto text-md text-[#121212] ${message.sender === 'user' && 'self-end'}`, __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, message.text))), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "flex gap-2", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "userInput", className: "border p-2 rounded w-full", placeholder: "メッセージを入力してください", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#0077CC] text-white rounded p-2", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "送信"))))); }