function MainComponent() { const [menuName, setMenuName] = React.useState(''); const [menuDescription, setMenuDescription] = React.useState(''); const handleMenuNameChange = (e)=>setMenuName(e.target.value); const handleMenuDescriptionChange = (e)=>setMenuDescription(e.target.value); const handleSubmit = (e)=>{ e.preventDefault(); // Send menuName and menuDescription to API or handle them accordingly }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f7f7] p-4", __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold font-roboto my-6 text-[#212121]", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, "Register New Menu"), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-lg bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "menu-name", className: "block text-[#333] text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, "Menu Name"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight font-roboto focus:outline-none focus:shadow-outline text-xs sm:text-sm md:text-base lg:text-lg", id: "menu-name", type: "text", placeholder: "Enter menu name", name: "menuName", value: menuName, onChange: handleMenuNameChange, __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "menu-description", className: "block text-[#333] text-sm font-roboto mb-2", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "Description"), /*#__PURE__*/ React.createElement("textarea", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight font-roboto focus:outline-none focus:shadow-outline", id: "menu-description", placeholder: "Enter menu description", name: "menuDescription", rows: "3", value: menuDescription, onChange: handleMenuDescriptionChange, __source: { fileName: "", lineNumber: 40, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#4CAF50] hover:bg-[#45A049] text-white font-roboto py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, "Register"), /*#__PURE__*/ React.createElement("a", { className: "inline-block align-baseline font-roboto text-sm text-[#0044CC] hover:text-[#002288] cursor-pointer", href: "#", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, "View all menus")))); }