function MainComponent() { const [isCustomer, setIsCustomer] = React.useState(true); const [selectedDriver, setSelectedDriver] = React.useState(''); const [priceOffer, setPriceOffer] = React.useState(''); const drivers = [ 'Driver A', 'Driver B', 'Driver C' ]; return /*#__PURE__*/ React.createElement("div", { className: "w-full h-screen bg-gray-100 flex flex-col items-center p-4", __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "w-full p-4 bg-blue-500 text-white text-center font-serif text-xl", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, "Ehailing Bid App"), /*#__PURE__*/ React.createElement("div", { className: "my-4", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: `px-4 py-2 mx-2 ${isCustomer ? 'bg-blue-700' : 'bg-gray-300'} text-white rounded`, onClick: ()=>setIsCustomer(true), __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, "Customer"), /*#__PURE__*/ React.createElement("button", { className: `px-4 py-2 mx-2 ${!isCustomer ? 'bg-blue-700' : 'bg-gray-300'} text-white rounded`, onClick: ()=>setIsCustomer(false), __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "Driver")), isCustomer && /*#__PURE__*/ React.createElement("div", { className: "w-[300px] p-4 bg-white rounded shadow", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-lg mb-2", __source: { fileName: "", lineNumber: 28, columnNumber: 11 }, __self: this }, "Choose a Driver"), /*#__PURE__*/ React.createElement("select", { name: "driver", className: "w-full p-2 mb-4 border border-gray-300 rounded", value: selectedDriver, onChange: (e)=>setSelectedDriver(e.target.value), __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 35, columnNumber: 13 }, __self: this }, "Select a driver"), drivers.map((driver)=>/*#__PURE__*/ React.createElement("option", { key: driver, value: driver, __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this }, driver))), /*#__PURE__*/ React.createElement("input", { name: "price", className: "w-full p-2 mb-4 border border-gray-300 rounded", type: "number", placeholder: "Enter your price offer", value: priceOffer, onChange: (e)=>setPriceOffer(e.target.value), __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-green-500 text-white p-2 rounded", __source: { fileName: "", lineNumber: 50, columnNumber: 11 }, __self: this }, "Submit Offer")), !isCustomer && /*#__PURE__*/ React.createElement("div", { className: "w-[300px] p-4 bg-white rounded shadow", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 57, columnNumber: 11 }, __self: this }, "Driver Interface"))); }