function MainComponent() { const [items, setItems] = React.useState([ { id: 1, title: 'Elegant Chair', price: 30, image: 'path/to/image1.jpg', description: 'A comfortable and elegant chair' }, { id: 2, title: 'Kitchen Appliance', price: 50, image: 'path/to/image2.jpg', description: 'A new model kitchen appliance' }, { id: 3, title: 'Modern Lamp', price: 20, image: 'path/to/image3.jpg', description: 'A stylish and modern lamp' } ]); const handlePostItem = ()=>{ const newItem = { id: new Date().getTime(), title: 'New Item', price: 40, image: 'path/to/image4.jpg', description: 'A new item description' }; setItems([ ...items, newItem ]); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-4", __source: { fileName: "", lineNumber: 14, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-white shadow-md p-4 flex justify-between items-center", __source: { fileName: "", lineNumber: 15, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold font-roboto text-[#333]", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, "Declutter Sales"), /*#__PURE__*/ React.createElement("button", { onClick: handlePostItem, className: "bg-blue-500 text-white px-4 py-2 rounded font-roboto", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, "Post Item")), /*#__PURE__*/ React.createElement("main", { className: "mt-4", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-6", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto text-[#333] mb-2", __source: { fileName: "", lineNumber: 21, columnNumber: 11 }, __self: this }, "Featured Items"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, items.map((item)=>/*#__PURE__*/ React.createElement("div", { key: item.id, className: "bg-white p-4 rounded shadow-md", __source: { fileName: "", lineNumber: 24, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: item.image, alt: item.description, className: "w-full h-[200px] object-cover rounded-md", __source: { fileName: "", lineNumber: 25, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-bold font-roboto mt-2", __source: { fileName: "", lineNumber: 26, columnNumber: 17 }, __self: this }, item.title), /*#__PURE__*/ React.createElement("p", { className: "text-[#555] font-roboto", __source: { fileName: "", lineNumber: 27, columnNumber: 17 }, __self: this }, "$", item.price), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-green-500 text-white py-2 rounded mt-2 font-roboto", __source: { fileName: "", lineNumber: 28, columnNumber: 17 }, __self: this }, "Contact Seller"))))), /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 33, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold font-roboto text-[#333] mb-2", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "Browse Categories"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-6 gap-2", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 rounded shadow-md text-center", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-bed text-xl text-blue-500", "aria-hidden": "true", __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, "Furniture")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 rounded shadow-md text-center", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-laptop text-xl text-blue-500", "aria-hidden": "true", __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 42, columnNumber: 15 }, __self: this }, "Electronics")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 rounded shadow-md text-center", __source: { fileName: "", lineNumber: 44, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-tshirt text-xl text-blue-500", "aria-hidden": "true", __source: { fileName: "", lineNumber: 45, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 46, columnNumber: 15 }, __self: this }, "Clothing")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 rounded shadow-md text-center", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-book text-xl text-blue-500", "aria-hidden": "true", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, "Books")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 rounded shadow-md text-center", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-bicycle text-xl text-blue-500", "aria-hidden": "true", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, "Sports")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-2 rounded shadow-md text-center", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa fa-building text-xl text-blue-500", "aria-hidden": "true", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-roboto", __source: { fileName: "", lineNumber: 58, columnNumber: 15 }, __self: this }, "Home Decor")))))); }