function MainComponent() { const [generatedImage, setGeneratedImage] = React.useState('/path/to/generated-image.jpg'); const [gameOver, setGameOver] = React.useState(false); const generateImage = (e)=>{ e.preventDefault(); const prompt = e.target.prompt.value; if (!prompt) return; const newImage = `/path/to/${prompt}.jpg`; setGeneratedImage(newImage); }; const checkPrompt = (e)=>{ e.preventDefault(); const opponentPrompt = e.target['opponent-prompt'].value; if (!opponentPrompt) return; if (!opponentPrompt.endsWith('り')) { setGameOver(true); } }; if (gameOver) { return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f0f0] font-roboto", __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-8", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, "ゲームオーバー")); } return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f0f0] font-roboto", __source: { fileName: "", lineNumber: 33, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold mb-8", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, "対決型の絵しりとりサイト"), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-md bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4", onSubmit: generateImage, __source: { fileName: "", lineNumber: 35, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "prompt", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, "プロンプトを入力してください"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "prompt", name: "prompt", type: "text", placeholder: "例: りんご", __source: { fileName: "", lineNumber: 40, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "生成"))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4", __source: { fileName: "", lineNumber: 55, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, "生成された画像"), /*#__PURE__*/ React.createElement("img", { src: generatedImage, alt: "生成された絵しりとり画像", className: "w-full h-auto", __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-md bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4", onSubmit: checkPrompt, __source: { fileName: "", lineNumber: 59, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 60, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "opponent-prompt", __source: { fileName: "", lineNumber: 61, columnNumber: 11 }, __self: this }, "画像からプロンプトを入力してください"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "opponent-prompt", name: "opponent-prompt", type: "text", placeholder: "例: ゴリラ", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "送信")))); }