function MainComponent() { const [pdfData, setPdfData] = React.useState([]); const handleFileChange = async (event)=>{ const file = event.target.files[0]; if (file) { setPdfData([ { field: "Extracted Field 1", value: "Extracted Value 1" }, { field: "Extracted Field 2", value: "Extracted Value 2" }, { field: "Extracted Field 3", value: "Extracted Value 3" } ]); } }; const handleSubmit = (event)=>{ event.preventDefault(); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#f7f9fb]", __source: { fileName: "", lineNumber: 15, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-lg p-8 bg-white shadow-md rounded-lg", __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-6 text-2xl font-semibold font-roboto text-center text-[#333]", __source: { fileName: "", lineNumber: 17, columnNumber: 9 }, __self: this }, "Upload your PDF"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 18, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "pdfUpload", className: "mb-2 font-roboto text-lg text-[#333]", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, "Select PDF File:"), /*#__PURE__*/ React.createElement("input", { type: "file", name: "pdfFile", id: "pdfUpload", onChange: handleFileChange, accept: ".pdf", className: "file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-sm file:font-semibold file:bg-[#4F46E5] file:text-white hover:file:bg-[#3730a3]", __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full py-2 mt-4 font-semibold text-white bg-[#4F46E5] rounded hover:bg-[#3730a3] font-roboto", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, "Upload and Parse PDF"))), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-3xl p-8 mt-10 bg-white shadow-md rounded-lg", __source: { fileName: "", lineNumber: 27, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "mb-6 text-2xl font-semibold font-roboto text-center text-[#333]", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, "Generated Report"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 29, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "mb-4 font-roboto text-lg text-[#666]", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, "Your PDF data will be shown here once it is processed. Use the data to customize and create your report."), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between p-4 mb-2 border-b border-[#ddd]", __source: { fileName: "", lineNumber: 31, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-[#333]", __source: { fileName: "", lineNumber: 32, columnNumber: 13 }, __self: this }, "Data Field"), /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-[#333]", __source: { fileName: "", lineNumber: 33, columnNumber: 13 }, __self: this }, "Value")), pdfData.map((data, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "flex justify-between p-4", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-[#333]", __source: { fileName: "", lineNumber: 37, columnNumber: 15 }, __self: this }, data.field), /*#__PURE__*/ React.createElement("span", { className: "font-roboto text-[#333]", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, data.value)))))); }