function MainComponent() { const [name, setName] = React.useState(""); const [email, setEmail] = React.useState(""); const [bio, setBio] = React.useState(""); const handleNameChange = (event)=>{ setName(event.target.value); }; const handleEmailChange = (event)=>{ setEmail(event.target.value); }; const handleBioChange = (event)=>{ setBio(event.target.value); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col justify-center items-center h-screen bg-[#f0f0f0] gap-4", __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, "Name:"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", value: name, onChange: handleNameChange, placeholder: "Enter your name", className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, "Email:"), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", value: email, onChange: handleEmailChange, placeholder: "Enter your email", className: "bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "bio", className: "mb-2 text-sm font-medium text-gray-900 dark:text-gray-400", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, "Bio:"), /*#__PURE__*/ React.createElement("textarea", { id: "bio", name: "bio", rows: "4", value: bio, onChange: handleBioChange, placeholder: "Enter your bio", className: "block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this })))); }