function MainComponent() { const [formData, setFormData] = React.useState({ name: '', email: '', equipment: '', requestType: 'rent', date: '' }); const handleChange = (e)=>{ const { name, value } = e.target; setFormData({ ...formData, [name]: value }); }; const handleSubmit = (e)=>{ e.preventDefault(); console.log('Form Submitted', formData); }; return /*#__PURE__*/ React.createElement("div", { className: "w-full min-h-screen flex items-center justify-center bg-gray-100", __source: { fileName: "", lineNumber: 24, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-[500px] bg-white shadow-lg rounded-lg p-8", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto mb-4", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, "Internal Office Equipment"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-roboto mb-2", htmlFor: "name", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "name", name: "name", type: "text", value: formData.name, onChange: handleChange, __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-roboto mb-2", htmlFor: "email", __source: { fileName: "", lineNumber: 43, columnNumber: 13 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "email", name: "email", type: "email", value: formData.email, onChange: handleChange, __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-roboto mb-2", htmlFor: "equipment", __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, "Equipment"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "equipment", name: "equipment", type: "text", value: formData.equipment, onChange: handleChange, __source: { fileName: "", lineNumber: 60, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 70, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-roboto mb-2", htmlFor: "date", __source: { fileName: "", lineNumber: 71, columnNumber: 13 }, __self: this }, "Date"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "date", name: "date", type: "date", value: formData.date, onChange: handleChange, __source: { fileName: "", lineNumber: 74, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, "Request Type"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "mr-2 leading-tight", type: "radio", name: "requestType", value: "rent", checked: formData.requestType === 'rent', onChange: handleChange, __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm font-roboto text-gray-700", __source: { fileName: "", lineNumber: 97, columnNumber: 15 }, __self: this }, "Rent")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center mt-2", __source: { fileName: "", lineNumber: 99, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "mr-2 leading-tight", type: "radio", name: "requestType", value: "request", checked: formData.requestType === 'request', onChange: handleChange, __source: { fileName: "", lineNumber: 100, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-sm font-roboto text-gray-700", __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, "Request"))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 112, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 113, columnNumber: 13 }, __self: this }, "Submit"))))); }