function MainComponent() { const [bikes, setBikes] = React.useState([ { id: 1, name: 'Mountain Bike', price: '750', image: '/images/mountain-bike.jpg' }, { id: 2, name: 'Road Bike', price: '680', image: '/images/road-bike.jpg' }, { id: 3, name: 'BMX Bike', price: '430', image: '/images/bmx-bike.jpg' } ]); const bikeList = bikes.map((bike)=>/*#__PURE__*/ React.createElement("div", { key: bike.id, className: "max-w-sm rounded overflow-hidden shadow-lg m-4", __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("img", { className: "w-full h-[200px] object-cover", src: bike.image, alt: `Image of ${bike.name}`, __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "px-6 py-4", __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl mb-2", __source: { fileName: "", lineNumber: 11, columnNumber: 9 }, __self: this }, bike.name), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 text-base", __source: { fileName: "", lineNumber: 12, columnNumber: 9 }, __self: this }, "Price: ", /*#__PURE__*/ React.createElement("span", { className: "font-semibold", __source: { fileName: "", lineNumber: 13, columnNumber: 18 }, __self: this }, "$", bike.price))), /*#__PURE__*/ React.createElement("div", { className: "px-6 pt-4 pb-2", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", name: "buyButton", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, "Buy Now")))); return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 24, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-serif text-5xl text-center my-10 text-[#121212]", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, "Bike Shop"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center items-center", __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this }, bikeList)); }