function MainComponent() { const [events, setEvents] = React.useState([ { date: "June 12, 2023", event: "Team Meeting", location: "New York" }, { date: "June 15, 2023", event: "Project Deadline", location: "Remote" } ]); const shareLocation = ()=>{ navigator.geolocation.getCurrentPosition((position)=>{ const newEvent = { date: new Date().toLocaleDateString('en-US', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' }), event: "Sharing My Location", location: `Lat: ${position.coords.latitude}, Long: ${position.coords.longitude}` }; setEvents([ ...events, newEvent ]); }); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-[#f9f9f9] min-h-screen flex flex-col items-center py-8", __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-5 font-roboto", __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, "Calendar Share App"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl bg-white rounded-lg shadow-md overflow-hidden", __source: { fileName: "", lineNumber: 21, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center bg-[#0077B6] p-4 text-white font-roboto", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, "My Calendar"), /*#__PURE__*/ React.createElement("button", { onClick: shareLocation, className: "bg-[#023E8A] px-4 py-2 rounded hover:bg-[#03045E] transition-colors", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, "Share Location")), /*#__PURE__*/ React.createElement("table", { className: "w-full border-collapse", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("thead", { __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("tr", { className: "border-b", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("th", { className: "py-3 font-normal text-left px-4", __source: { fileName: "", lineNumber: 31, columnNumber: 15 }, __self: this }, "Date"), /*#__PURE__*/ React.createElement("th", { className: "py-3 font-normal text-left", __source: { fileName: "", lineNumber: 32, columnNumber: 15 }, __self: this }, "Event"), /*#__PURE__*/ React.createElement("th", { className: "py-3 font-normal text-left", __source: { fileName: "", lineNumber: 33, columnNumber: 15 }, __self: this }, "Location"))), /*#__PURE__*/ React.createElement("tbody", { __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, events.map((event, index)=>/*#__PURE__*/ React.createElement("tr", { key: index, className: index % 2 === 0 ? "" : "bg-gray-100", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("td", { className: "py-2 px-4", __source: { fileName: "", lineNumber: 39, columnNumber: 17 }, __self: this }, event.date), /*#__PURE__*/ React.createElement("td", { __source: { fileName: "", lineNumber: 40, columnNumber: 17 }, __self: this }, event.event), /*#__PURE__*/ React.createElement("td", { __source: { fileName: "", lineNumber: 41, columnNumber: 17 }, __self: this }, event.location))))))); }

Date	Event	Location
June 12, 2023	Team Meeting	New York
June 15, 2023	Project Deadline	Remote