function MainComponent() { const [computerChoice, setComputerChoice] = React.useState("..."); const [gameResult, setGameResult] = React.useState("..."); const [endMessage, setEndMessage] = React.useState(""); const choices = [ "ぐー", "ちょき", "ぱー" ]; function getRandomChoice() { const randomIndex = Math.floor(Math.random() * choices.length); return choices[randomIndex]; } function determineWinner(userChoice, computerChoice) { if (userChoice === computerChoice) { return "引き分け"; } if (userChoice === "ぐー" && computerChoice === "ちょき" || userChoice === "ちょき" && computerChoice === "ぱー" || userChoice === "ぱー" && computerChoice === "ぐー") { return "あなたの勝ち"; } return "コンピュータの勝ち"; } function handleUserChoice(userChoice) { const computerChoice = getRandomChoice(); setComputerChoice(computerChoice); const result = determineWinner(userChoice, computerChoice); setGameResult(result); setEndMessage(""); } function handlePlayAgain() { setComputerChoice("..."); setGameResult("..."); setEndMessage(""); } function handleQuit() { setEndMessage("お疲れ様でした"); } return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-gray-100", __source: { fileName: "", lineNumber: 46, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold font-roboto mb-5", __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this }, "じゃんけんゲーム"), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-blue-500 text-white rounded-full", name: "rock", onClick: ()=>handleUserChoice("ぐー"), __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, "ぐー"), /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-red-500 text-white rounded-full", name: "scissors", onClick: ()=>handleUserChoice("ちょき"), __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, "ちょき"), /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-green-500 text-white rounded-full", name: "paper", onClick: ()=>handleUserChoice("ぱー"), __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, "ぱー")), /*#__PURE__*/ React.createElement("div", { className: "mt-5 text-2xl font-crimson-text", __source: { fileName: "", lineNumber: 71, columnNumber: 7 }, __self: this }, "コンピュータが選んだ内容: ", /*#__PURE__*/ React.createElement("span", { className: "text-indigo-500", __source: { fileName: "", lineNumber: 72, columnNumber: 23 }, __self: this }, computerChoice)), /*#__PURE__*/ React.createElement("div", { className: "mt-5 text-2xl font-crimson-text", __source: { fileName: "", lineNumber: 74, columnNumber: 7 }, __self: this }, "対戦結果: ", /*#__PURE__*/ React.createElement("span", { className: "text-indigo-500", __source: { fileName: "", lineNumber: 75, columnNumber: 15 }, __self: this }, gameResult)), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4 mt-5", __source: { fileName: "", lineNumber: 77, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-yellow-500 text-white rounded-full", name: "playAgain", onClick: handlePlayAgain, __source: { fileName: "", lineNumber: 78, columnNumber: 9 }, __self: this }, "もう一回対戦する"), /*#__PURE__*/ React.createElement("button", { className: "px-4 py-2 bg-gray-500 text-white rounded-full", name: "quit", onClick: handleQuit, __source: { fileName: "", lineNumber: 85, columnNumber: 9 }, __self: this }, "やめる")), /*#__PURE__*/ React.createElement("div", { className: "mt-5 text-2xl font-crimson-text", __source: { fileName: "", lineNumber: 93, columnNumber: 7 }, __self: this }, endMessage)); }