function MainComponent() { const ticketList = "View Tickets"; const commentPlaceholder = "Enter your comment here..."; const uploadButtonText = "Choose PDF file"; const submitButtonText = "Post Comment"; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center p-4", __source: { fileName: "", lineNumber: 7, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-xl text-[#121212] mb-4", __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, "PDF Helpdesk Support"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-4xl", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-6", __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-lg text-[#121212] mb-2", __source: { fileName: "", lineNumber: 11, columnNumber: 11 }, __self: this }, ticketList), /*#__PURE__*/ React.createElement("div", { className: "border border-[#d1d5db] rounded-lg overflow-hidden", __source: { fileName: "", lineNumber: 12, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("section", { className: "mb-6", __source: { fileName: "", lineNumber: 16, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "font-roboto text-lg text-[#121212] mb-2", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }, "Comment on Ticket"), /*#__PURE__*/ React.createElement("form", { className: "space-y-4", __source: { fileName: "", lineNumber: 18, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("textarea", { className: "w-full p-3 border border-[#d1d5db] rounded-lg font-roboto text-sm", placeholder: commentPlaceholder, rows: 5, name: "comment", __source: { fileName: "", lineNumber: 19, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col sm:flex-row justify-between items-center space-y-3 sm:space-y-0", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2 helpdesk-upload-btn", __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { className: "w-full cursor-pointer file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-roboto file:bg-violet-50 file:text-violet-700 hover:file:bg-violet-100", type: "file", accept: "application/pdf", name: "pdf-upload", __source: { fileName: "", lineNumber: 27, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-sm", __source: { fileName: "", lineNumber: 37, columnNumber: 17 }, __self: this }, uploadButtonText)), /*#__PURE__*/ React.createElement("button", { className: "w-full sm:w-auto text-white bg-[#28a745] hover:bg-[#218838] font-roboto rounded-lg text-sm px-5 py-2.5 text-center helpdesk-upload-btn", type: "submit", __source: { fileName: "", lineNumber: 39, columnNumber: 15 }, __self: this }, submitButtonText))))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, ` @keyframes slideIn { from { opacity: 0; transform: translateY(20%); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .helpdesk-entry { animation: fadeIn 1s ease-in-out; } .helpdesk-upload-btn { animation: slideIn 0.5s ease-out; } `)); }