function MainComponent() { const [transferAmount, setTransferAmount] = React.useState(30000000); const [recipients, setRecipients] = React.useState([ { accountNumber: '', bankName: '' } ]); const handleAddRecipient = ()=>{ setRecipients([ ...recipients, { accountNumber: '', bankName: '' } ]); }; const handleRecipientChange = (index, field, value)=>{ const updatedRecipients = [ ...recipients ]; updatedRecipients[index][field] = value; setRecipients(updatedRecipients); }; const handleSubmit = (e)=>{ e.preventDefault(); // Handle transfer logic here }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-blue-900 to-indigo-900 text-white font-roboto p-8", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "mb-12", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-center", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "AI-Powered Financial Transfer System")), /*#__PURE__*/ React.createElement("main", { className: "max-w-4xl mx-auto bg-white/10 rounded-lg shadow-xl p-8", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-6", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, "Monthly Transfer: $", transferAmount.toLocaleString()), /*#__PURE__*/ React.createElement("form", { className: "space-y-6", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, recipients.map((recipient, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "space-y-4", __source: { fileName: "", lineNumber: 29, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 30, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: `recipient-${index}`, className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 31, columnNumber: 17 }, __self: this }, "Recipient Bank Account"), /*#__PURE__*/ React.createElement("input", { type: "text", id: `recipient-${index}`, name: `recipient-${index}`, className: "w-full px-4 py-2 rounded bg-white/20 focus:outline-none focus:ring-2 focus:ring-blue-400", placeholder: "Enter account number", value: recipient.accountNumber, onChange: (e)=>handleRecipientChange(index, 'accountNumber', e.target.value), __source: { fileName: "", lineNumber: 32, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 42, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: `bank-${index}`, className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 43, columnNumber: 17 }, __self: this }, "Bank Name"), /*#__PURE__*/ React.createElement("input", { type: "text", id: `bank-${index}`, name: `bank-${index}`, className: "w-full px-4 py-2 rounded bg-white/20 focus:outline-none focus:ring-2 focus:ring-blue-400", placeholder: "Enter bank name", value: recipient.bankName, onChange: (e)=>handleRecipientChange(index, 'bankName', e.target.value), __source: { fileName: "", lineNumber: 44, columnNumber: 17 }, __self: this })))), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: handleAddRecipient, className: "mt-4 bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition duration-300 ease-in-out", __source: { fileName: "", lineNumber: 56, columnNumber: 11 }, __self: this }, "Add Recipient"), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "date", className: "block text-sm font-medium mb-2", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "Transfer Date"), /*#__PURE__*/ React.createElement("input", { type: "date", id: "date", name: "date", className: "w-full px-4 py-2 rounded bg-white/20 focus:outline-none focus:ring-2 focus:ring-blue-400", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 67, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", id: "ai-optimize", name: "ai-optimize", className: "w-5 h-5 rounded bg-white/20", __source: { fileName: "", lineNumber: 68, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("label", { htmlFor: "ai-optimize", className: "text-sm", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "Use AI to optimize transfer timing")), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-green-600 hover:bg-green-700 text-white font-bold py-3 px-4 rounded transition duration-300 ease-in-out transform hover:scale-105", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, "Initiate Transfer")), /*#__PURE__*/ React.createElement("div", { className: "mt-12", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-4", __source: { fileName: "", lineNumber: 76, columnNumber: 11 }, __self: this }, "AI Insights"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("li", { className: "flex items-center", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-robot mr-2", __source: { fileName: "", lineNumber: 79, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }, "Optimal transfer window: 2nd week of the month")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center", __source: { fileName: "", lineNumber: 82, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chart-line mr-2", __source: { fileName: "", lineNumber: 83, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, "Market volatility: Low")), /*#__PURE__*/ React.createElement("li", { className: "flex items-center", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-shield-alt mr-2", __source: { fileName: "", lineNumber: 87, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 88, columnNumber: 15 }, __self: this }, "Security level: Enhanced"))))), /*#__PURE__*/ React.createElement("footer", { className: "mt-12 text-center text-sm opacity-70", __source: { fileName: "", lineNumber: 93, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, "Powered by Advanced AI Financial Technologies"))); }

Monthly Transfer: $30,000,000

AI Insights