function MainComponent() { const [selectedPlatform, setSelectedPlatform] = React.useState(null); return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f0f2f5] p-4", __source: { fileName: "", lineNumber: 4, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-md bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-center text-[#121212] font-roboto mb-4", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "Book a Calendar Date"), /*#__PURE__*/ React.createElement("p", { className: "text-center text-md text-gray-600 font-roboto mb-6", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, "Choose a platform to schedule your event."), selectedPlatform ? /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 13, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center text-lg font-roboto text-[#121212] mb-2", __source: { fileName: "", lineNumber: 14, columnNumber: 13 }, __self: this }, "Schedule on ", selectedPlatform, " Calendar"), /*#__PURE__*/ React.createElement("input", { type: "date", name: "eventDate", className: "w-full px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm text-[#121212] font-roboto focus:ring-blue-500 focus:border-blue-500", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "time", name: "eventTime", className: "w-full px-4 py-2 border border-gray-300 rounded-md shadow-sm text-sm text-[#121212] font-roboto focus:ring-blue-500 focus:border-blue-500", __source: { fileName: "", lineNumber: 22, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { name: "confirmBooking", className: "w-full flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#34A853] hover:bg-[#2b8c46] focus:outline-none", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "Confirm Booking"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedPlatform(null), className: "w-full text-center text-sm text-gray-500 hover:text-gray-800 font-roboto", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, "Choose another platform")) : /*#__PURE__*/ React.createElement("div", { className: "flex flex-col space-y-4", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { name: "scheduleGoogle", onClick: ()=>setSelectedPlatform('Google'), className: "w-full flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#4285F4] hover:bg-[#357ae8] focus:outline-none", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-google mr-2", __source: { fileName: "", lineNumber: 47, columnNumber: 15 }, __self: this }), " Schedule with Google Calendar"), /*#__PURE__*/ React.createElement("button", { name: "scheduleOutlook", onClick: ()=>setSelectedPlatform('Outlook'), className: "w-full flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#0078D4] hover:bg-[#006cbe] focus:outline-none", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-windows mr-2", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }), " Schedule with Outlook"), /*#__PURE__*/ React.createElement("button", { name: "scheduleApple", onClick: ()=>setSelectedPlatform('Apple'), className: "w-full flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#A2AAAD] hover:bg-[#8d9498] focus:outline-none", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-apple mr-2", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }), " Schedule with Apple Calendar"), /*#__PURE__*/ React.createElement("button", { name: "scheduleZoom", onClick: ()=>setSelectedPlatform('Zoom'), className: "w-full flex items-center justify-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[#2D8CFF] hover:bg-[#257bde] focus:outline-none", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-zoom mr-2", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }), " Schedule with Zoom")))); }