function MainComponent({ word, choices, correctAnswer }) { const [selectedChoice, setSelectedChoice] = React.useState(null); const [showCorrectAnswer, setShowCorrectAnswer] = React.useState(false); const handleChoiceClick = (choice)=>{ setSelectedChoice(choice); if (choice !== correctAnswer) { setShowCorrectAnswer(true); } }; return /*#__PURE__*/ React.createElement("div", { className: "p-4 max-w-md mx-auto", __source: { fileName: "", lineNumber: 13, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-xl font-semibold font-roboto mb-4", __source: { fileName: "", lineNumber: 14, columnNumber: 7 }, __self: this }, "英単語学習アプリ"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-lg font-roboto", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, word)), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, choices.map((choice, index)=>/*#__PURE__*/ React.createElement("button", { key: index, className: "w-full p-2 border rounded-md text-left bg-gray-200 hover:bg-gray-300 font-roboto", onClick: ()=>handleChoiceClick(choice), __source: { fileName: "", lineNumber: 20, columnNumber: 11 }, __self: this }, choice))), showCorrectAnswer && selectedChoice && selectedChoice !== correctAnswer && /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-red-500 font-roboto", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, "正解：", correctAnswer))); } function StoryComponent() { const sampleWord = "apple"; const sampleChoices = [ "りんご", "バナナ", "みかん" ]; const sampleCorrectAnswer = "りんご"; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 44, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { word: sampleWord, choices: sampleChoices, correctAnswer: sampleCorrectAnswer, __source: { fileName: "", lineNumber: 45, columnNumber: 7 }, __self: this })); }