function MainComponent() { const [amount, setAmount] = React.useState(''); const [balance, setBalance] = React.useState(0); const handleDeposit = ()=>{ setBalance(balance + parseFloat(amount) || 0); setAmount(''); }; const handleWithdraw = ()=>{ setBalance(balance - parseFloat(amount) || 0); setAmount(''); }; const canWithdraw = parseFloat(amount) <= balance && amount !== ''; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center justify-center min-h-screen bg-[#ffffff] text-[#333333]", __source: { fileName: "", lineNumber: 18, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-[#f8f8f8] shadow-md rounded-lg w-[90%] sm:w-[400px]", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4 font-roboto", __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, "Bank Transactions"), /*#__PURE__*/ React.createElement("input", { type: "number", id: "amount", name: "amount", min: "0", placeholder: "Enter Amount", className: "w-full px-3 py-2 border border-[#d1d5db] rounded-md text-sm mb-4", value: amount, onChange: (e)=>setAmount(e.target.value), __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleDeposit, disabled: !amount, className: "flex-1 px-3 py-2 bg-[#10b981] text-white rounded-md hover:bg-[#059669] focus:bg-[#047857] disabled:bg-[#86d4b8] transition-colors", __source: { fileName: "", lineNumber: 32, columnNumber: 11 }, __self: this }, "Deposit"), /*#__PURE__*/ React.createElement("button", { onClick: handleWithdraw, disabled: !canWithdraw, className: "flex-1 px-3 py-2 bg-[#ef4444] text-white rounded-md hover:bg-[#dc2626] focus:bg-[#b91c1c] disabled:bg-[#f4a3a3] transition-colors", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, "Withdraw")), /*#__PURE__*/ React.createElement("div", { className: "mt-6 pt-4 border-t border-[#d1d5db]", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-medium mb-2 font-roboto", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "Balance"), /*#__PURE__*/ React.createElement("div", { className: "text-lg text-[#111827]", __source: { fileName: "", lineNumber: 49, columnNumber: 11 }, __self: this }, "$ ", balance.toFixed(2))))); }