function MainComponent() { const [students, setStudents] = React.useState([]); const [selectedSubject, setSelectedSubject] = React.useState(''); const [examDate, setExamDate] = React.useState(''); const handleStudentInfoChange = (index, e)=>{ const updatedStudents = students.map((student, sIndex)=>{ if (index === sIndex) { return { ...student, [e.target.name]: e.target.value }; } return student; }); setStudents(updatedStudents); }; const addStudent = ()=>{ setStudents([ ...students, { firstName: '', lastName: '', indexNumber: '' } ]); }; const subjectOptions = [ 'Mathematics', 'Physics', 'Literature' ]; const studentElements = students.map((student, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex flex-col gap-2", __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "border px-2 py-1 font-roboto", type: "text", name: "firstName", placeholder: "First Name", value: student.firstName, onChange: (e)=>handleStudentInfoChange(index, e), __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("input", { className: "border px-2 py-1 font-roboto", type: "text", name: "lastName", placeholder: "Last Name", value: student.lastName, onChange: (e)=>handleStudentInfoChange(index, e), __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("input", { className: "border px-2 py-1 font-roboto", type: "text", name: "indexNumber", placeholder: "Index Number", value: student.indexNumber, onChange: (e)=>handleStudentInfoChange(index, e), __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }))); return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-5", __source: { fileName: "", lineNumber: 51, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-6", __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }, studentElements, /*#__PURE__*/ React.createElement("button", { className: "bg-[#007BFF] text-white py-2 px-4 rounded font-roboto", onClick: addStudent, __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, "Add Student"), /*#__PURE__*/ React.createElement("select", { className: "border px-3 py-2 font-roboto", name: "subject", value: selectedSubject, onChange: (e)=>setSelectedSubject(e.target.value), __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", disabled: true, __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, "Select Subject"), subjectOptions.map((option)=>/*#__PURE__*/ React.createElement("option", { key: option, value: option, __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, option))), /*#__PURE__*/ React.createElement("input", { className: "border px-2 py-1 font-roboto", type: "date", name: "examDate", value: examDate, onChange: (e)=>setExamDate(e.target.value), __source: { fileName: "", lineNumber: 77, columnNumber: 9 }, __self: this }))); }