function MainComponent() { const [appState, setAppState] = React.useState("login"); // login, bookRide, trackDriver, reviewDriver return /*#__PURE__*/ React.createElement("div", { className: "w-full min-h-screen bg-[#FAF9F6] font-roboto flex justify-center items-center", __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg bg-white rounded-lg shadow-md p-8", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, appState === "login" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-[#333] mb-8", __source: { fileName: "", lineNumber: 9, columnNumber: 13 }, __self: this }, "Login to Your Account"), /*#__PURE__*/ React.createElement("form", { __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 11, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block text-[#666] mb-2", __source: { fileName: "", lineNumber: 12, columnNumber: 17 }, __self: this }, "Email Address"), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", id: "email", className: "w-full p-3 border rounded-md focus:outline-none focus:border-[#FFD700]", placeholder: "Enter your email", __source: { fileName: "", lineNumber: 13, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 15, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "password", className: "block text-[#666] mb-2", __source: { fileName: "", lineNumber: 16, columnNumber: 17 }, __self: this }, "Password"), /*#__PURE__*/ React.createElement("input", { type: "password", name: "password", id: "password", className: "w-full p-3 border rounded-md focus:outline-none focus:border-[#FFD700]", placeholder: "Enter your password", __source: { fileName: "", lineNumber: 17, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#FFD700] text-white p-3 rounded-md hover:bg-[#fcbf49]", __source: { fileName: "", lineNumber: 19, columnNumber: 15 }, __self: this }, "Login")), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-right", __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-[#666] hover:text-[#333]", onClick: ()=>setAppState("bookRide"), __source: { fileName: "", lineNumber: 22, columnNumber: 15 }, __self: this }, "Not your first ride? Book now!"))), appState === "bookRide" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-[#333] mb-8", __source: { fileName: "", lineNumber: 28, columnNumber: 13 }, __self: this }, "Book Your Ride"), /*#__PURE__*/ React.createElement("form", { __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 30, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "pickup", className: "block text-[#666] mb-2", __source: { fileName: "", lineNumber: 31, columnNumber: 17 }, __self: this }, "Pick-up Location"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "pickup", id: "pickup", className: "w-full p-3 border rounded-md focus:outline-none focus:border-[#FFD700]", placeholder: "Enter pick-up location", __source: { fileName: "", lineNumber: 32, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 34, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "destination", className: "block text-[#666] mb-2", __source: { fileName: "", lineNumber: 35, columnNumber: 17 }, __self: this }, "Destination"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "destination", id: "destination", className: "w-full p-3 border rounded-md focus:outline-none focus:border-[#FFD700]", placeholder: "Enter your destination", __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "button", className: "w-full bg-[#FFD700] text-white p-3 rounded-md hover:bg-[#fcbf49]", onClick: ()=>setAppState("trackDriver"), __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, "Book Ride")), /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-right", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "text-[#666] hover:text-[#333]", onClick: ()=>setAppState("login"), __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, "Back to Login"))), appState === "trackDriver" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-[#333] mb-8", __source: { fileName: "", lineNumber: 47, columnNumber: 13 }, __self: this }, "Track Your Driver"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-[#666] mb-4", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, "Your driver is on the way!"), /*#__PURE__*/ React.createElement("button", { className: "bg-[#FFD700] text-white p-3 rounded-md hover:bg-[#fcbf49] mb-4", onClick: ()=>setAppState("reviewDriver"), __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, "Arrived? Rate your Driver"))), appState === "reviewDriver" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold text-[#333] mb-8", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, "Review Your Driver"), /*#__PURE__*/ React.createElement("form", { __source: { fileName: "", lineNumber: 57, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 58, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "rating", className: "block text-[#666] mb-2", __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this }, "Rating"), /*#__PURE__*/ React.createElement("select", { name: "rating", id: "rating", className: "w-full p-3 border rounded-md focus:outline-none focus:border-[#FFD700]", __source: { fileName: "", lineNumber: 60, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "5", __source: { fileName: "", lineNumber: 61, columnNumber: 19 }, __self: this }, "Excellent"), /*#__PURE__*/ React.createElement("option", { value: "4", __source: { fileName: "", lineNumber: 62, columnNumber: 19 }, __self: this }, "Very Good"), /*#__PURE__*/ React.createElement("option", { value: "3", __source: { fileName: "", lineNumber: 63, columnNumber: 19 }, __self: this }, "Good"), /*#__PURE__*/ React.createElement("option", { value: "2", __source: { fileName: "", lineNumber: 64, columnNumber: 19 }, __self: this }, "Fair"), /*#__PURE__*/ React.createElement("option", { value: "1", __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }, "Poor"))), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "comments", className: "block text-[#666] mb-2", __source: { fileName: "", lineNumber: 69, columnNumber: 17 }, __self: this }, "Comments"), /*#__PURE__*/ React.createElement("textarea", { name: "comments", id: "comments", className: "w-full p-3 border rounded-md focus:outline-none focus:border-[#FFD700]", rows: "4", placeholder: "Leave a comment (optional)", __source: { fileName: "", lineNumber: 70, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "button", className: "w-full bg-[#FFD700] text-white p-3 rounded-md hover:bg-[#fcbf49]", onClick: ()=>setAppState("bookRide"), __source: { fileName: "", lineNumber: 72, columnNumber: 15 }, __self: this }, "Submit Review & Book Again"))))); }