function MainComponent() { const [submitted, setSubmitted] = React.useState(false); const [formValues, setFormValues] = React.useState({ Date: '', Type: '', Value: '', Tier1: '', Tier2: '', Tier3: '', Tier4: '', Tier5: '', Tier6: '', Tier7: '', Tier8: '', Tier9: '', Tier10: '', Attach: '', Comments: '', Vatable: false }); const handleChange = (e)=>{ const { name, type, value, checked, files } = e.target; setFormValues((prevState)=>({ ...prevState, [name]: type === 'file' ? files : type === "checkbox" ? checked : value })); }; const handleSubmit = (e)=>{ e.preventDefault(); setSubmitted(true); }; const dropdownOptions = [ "Dummy Value 1", "Dummy Value 2", "Dummy Value 3" ]; if (submitted) { return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-screen bg-[#e4e4e4]", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-center text-black font-roboto", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, "✅ Your form has been submitted!")); } return /*#__PURE__*/ React.createElement("div", { className: "flex justify-center items-center h-screen bg-[#e4e4e4]", __source: { fileName: "", lineNumber: 47, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[10000px] bg-white p-5 my-10 mx-10 shadow-md rounded", __source: { fileName: "", lineNumber: 48, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-center mb-5", __source: { fileName: "", lineNumber: 49, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "./images/logo.png", alt: "Large company logo centered on a white background", className: "h-40", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "mx-5", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-5 items-center", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-center text-gray-700 text-sm font-roboto mb-2 pt-5", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, "DATE", /*#__PURE__*/ React.createElement("input", { type: "date", name: "Date", value: formValues.Date, onChange: handleChange, className: "block w-full border rounded px-3 py-1.5", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this })), [ 'Type', 'Value', 'Tier1', 'Tier2', 'Tier3', 'Tier4', 'Tier5', 'Tier6', 'Tier7', 'Tier8', 'Tier9', 'Tier10' ].map((field)=>/*#__PURE__*/ React.createElement("label", { key: field, className: "text-center text-gray-700 text-sm font-roboto pt-5", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, field.toUpperCase(), /*#__PURE__*/ React.createElement("select", { name: field, value: formValues[field], onChange: handleChange, className: "block w-full border rounded px-3 py-1.5", __source: { fileName: "", lineNumber: 61, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 62, columnNumber: 19 }, __self: this }, "Select ", field), dropdownOptions.map((option, i)=>/*#__PURE__*/ React.createElement("option", { key: `${field}-${i}`, value: option, __source: { fileName: "", lineNumber: 64, columnNumber: 21 }, __self: this }, option))))), /*#__PURE__*/ React.createElement("label", { className: "text-center text-gray-700 text-sm font-roboto pt-5", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "ATTACH", /*#__PURE__*/ React.createElement("input", { type: "file", name: "Attach", onChange: handleChange, className: "block w-full border rounded px-3 py-1.5", multiple: true, __source: { fileName: "", lineNumber: 71, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full pt-5", __source: { fileName: "", lineNumber: 73, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-center text-gray-700 text-sm font-roboto", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "COMMENTS", /*#__PURE__*/ React.createElement("textarea", { name: "Comments", value: formValues.Comments, onChange: handleChange, className: "block w-full border rounded px-3 py-1.5", placeholder: "Comments", __source: { fileName: "", lineNumber: 76, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-center pt-5", __source: { fileName: "", lineNumber: 79, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", name: "Vatable", checked: formValues.Vatable, onChange: handleChange, className: "mr-2", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-gray-700 text-sm font-roboto", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }, "Vatable")), /*#__PURE__*/ React.createElement("div", { className: "w-full flex justify-center my-5", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, "Submit")))))); }