function MainComponent() { const [page, setPage] = React.useState("practice"); const [answers, setAnswers] = React.useState({ answer1: "", answer2: "" }); const handleChange = (e)=>{ const { name, value } = e.target; setAnswers((prev)=>({ ...prev, [name]: value })); }; const handleSubmit = ()=>{ console.log(answers); setPage("results"); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f3f4f6] flex items-center justify-center flex-col", __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[500px] bg-white p-8 rounded-lg shadow-lg mb-8", __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "flex justify-around mb-4", __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `font-roboto ${page === "practice" ? "text-blue-500" : "text-gray-500"}`, onClick: ()=>setPage("practice"), __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, "Practice"), /*#__PURE__*/ React.createElement("button", { className: `font-roboto ${page === "registration" ? "text-blue-500" : "text-gray-500"}`, onClick: ()=>setPage("registration"), __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, "Registration"), /*#__PURE__*/ React.createElement("button", { className: `font-roboto ${page === "results" ? "text-blue-500" : "text-gray-500"}`, onClick: ()=>setPage("results"), __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, "Results")), page === "practice" && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 40, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto text-center mb-4", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this }, "Practices"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-center", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, "Content for the Practices page goes here.")), page === "registration" && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto text-center mb-4", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, "Questions and Answers"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, "Question 1"), /*#__PURE__*/ React.createElement("p", { className: "text-md font-roboto mb-2", __source: { fileName: "", lineNumber: 51, columnNumber: 15 }, __self: this }, "Please provide an answer to this question."), /*#__PURE__*/ React.createElement("textarea", { name: "answer1", className: "w-full p-2 border border-gray-300 rounded-md", rows: "4", placeholder: "Type your answer here...", value: answers.answer1, onChange: handleChange, __source: { fileName: "", lineNumber: 52, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 62, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }, "Question 2"), /*#__PURE__*/ React.createElement("p", { className: "text-md font-roboto mb-2", __source: { fileName: "", lineNumber: 64, columnNumber: 15 }, __self: this }, "Please provide an answer to this question."), /*#__PURE__*/ React.createElement("textarea", { name: "answer2", className: "w-full p-2 border border-gray-300 rounded-md", rows: "4", placeholder: "Type your answer here...", value: answers.answer2, onChange: handleChange, __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mt-6", __source: { fileName: "", lineNumber: 75, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 text-white px-6 py-2 rounded-md font-roboto", onClick: handleSubmit, __source: { fileName: "", lineNumber: 76, columnNumber: 15 }, __self: this }, "Submit"))), page === "results" && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 87, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto text-center mb-4", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, "Results"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-center", __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this }, "Content for the Results page goes here.")))); }