function MainComponent() { const [activePage, setActivePage] = React.useState('landing'); const handlePageChange = (page)=>()=>{ setActivePage(page); }; let content; switch(activePage){ case 'buy': content = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "font-crimson-text text-3xl text-[#121212] mb-5", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }, "Buy a Home"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-base text-[#666] mb-5 text-center", __source: { fileName: "", lineNumber: 16, columnNumber: 11 }, __self: this }, "Explore a wide range of properties for purchase.")); break; case 'sell': content = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "font-crimson-text text-3xl text-[#121212] mb-5", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, "Sell Your Home"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-base text-[#666] mb-5 text-center", __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this }, "Get the best value for your home with our assistance.")); break; case 'rent': content = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "font-crimson-text text-3xl text-[#121212] mb-5", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, "Rent a House"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-base text-[#666] mb-5 text-center", __source: { fileName: "", lineNumber: 40, columnNumber: 11 }, __self: this }, "Find your next rental home with ease.")); break; default: content = /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "font-crimson-text text-3xl text-[#121212] mb-5", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "Find Your Dream Home"), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-base text-[#666] mb-5 text-center", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, "Your perfect property is just a few clicks away."), /*#__PURE__*/ React.createElement("form", { className: "w-full max-w-md", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-[#121212] leading-tight focus:outline-none focus:shadow-outline", type: "text", placeholder: "Enter a city, neighborhood, or ZIP code", name: "search", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#0055ff] hover:bg-[#003cbf] text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "Search")))); } return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f7f7]", __source: { fileName: "", lineNumber: 78, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full p-5 text-center bg-[#ffffff] shadow-md", __source: { fileName: "", lineNumber: 79, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-crimson-text text-5xl text-[#121212]", __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }, "Real Estate Properties"), /*#__PURE__*/ React.createElement("nav", { className: "flex justify-center space-x-4 mt-4", __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `font-roboto text-[#121212] px-3 py-2 rounded ${activePage === 'landing' ? 'bg-[#e0e0e0]' : 'hover:bg-[#ddd]'}`, onClick: handlePageChange('landing'), __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, "Landing Page"), /*#__PURE__*/ React.createElement("button", { className: `font-roboto text-[#121212] px-3 py-2 rounded ${activePage === 'buy' ? 'bg-[#e0e0e0]' : 'hover:bg-[#ddd]'}`, onClick: handlePageChange('buy'), __source: { fileName: "", lineNumber: 92, columnNumber: 11 }, __self: this }, "Buy Homes"), /*#__PURE__*/ React.createElement("button", { className: `font-roboto text-[#121212] px-3 py-2 rounded ${activePage === 'sell' ? 'bg-[#e0e0e0]' : 'hover:bg-[#ddd]'}`, onClick: handlePageChange('sell'), __source: { fileName: "", lineNumber: 100, columnNumber: 11 }, __self: this }, "Sell House"), /*#__PURE__*/ React.createElement("button", { className: `font-roboto text-[#121212] px-3 py-2 rounded ${activePage === 'rent' ? 'bg-[#e0e0e0]' : 'hover:bg-[#ddd]'}`, onClick: handlePageChange('rent'), __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this }, "Rent House"))), /*#__PURE__*/ React.createElement("main", { className: "flex flex-1 flex-col items-center justify-center p-10", __source: { fileName: "", lineNumber: 118, columnNumber: 7 }, __self: this }, content), /*#__PURE__*/ React.createElement("footer", { className: "w-full p-5 text-center bg-[#ffffff] shadow-inner", __source: { fileName: "", lineNumber: 121, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-[#888]", __source: { fileName: "", lineNumber: 122, columnNumber: 9 }, __self: this }, "© 2023 Real Estate Properties, Inc. All rights reserved."))); }