\n \n\n`;\n return new Response(html, { headers: { \"content-type\": \"text/html; charset=utf-8\" } });\n});\n\nexport default app.fetch;\n","children",[],[205],"08d3064e-5357-11f1-8afd-ee650bb23af1","utils.ts","08d3070c-5357-11f1-8afd-ee650bb23af1","94294912-1b8d-4f7a-9a1c-2009c240a3d7",2,["D",1779176870024],"// Amount to words converter - Lakhs/Crores aware (Indian numbering system)\n\nconst ones = [\n \"\", \"One\", \"Two\", \"Three\", \"Four\", \"Five\", \"Six\", \"Seven\", \"Eight\", \"Nine\",\n \"Ten\", \"Eleven\", \"Twelve\", \"Thirteen\", \"Fourteen\", \"Fifteen\", \"Sixteen\",\n \"Seventeen\", \"Eighteen\", \"Nineteen\"\n];\nconst tens = [\"\", \"\", \"Twenty\", \"Thirty\", \"Forty\", \"Fifty\", \"Sixty\", \"Seventy\", \"Eighty\", \"Ninety\"];\n\nfunction twoDigitWords(n: number): string {\n if (n < 20) return ones[n];\n return tens[Math.floor(n / 10)] + (n % 10 ? \" \" + ones[n % 10] : \"\");\n}\n\nfunction threeDigitWords(n: number): string {\n if (n >= 100) {\n return ones[Math.floor(n / 100)] + \" Hundred\" + (n % 100 ? \" and \" + twoDigitWords(n % 100) : \"\");\n }\n return twoDigitWords(n);\n}\n\nexport function amountToWords(amount: number): string {\n if (amount === 0) return \"Zero Rupees Only\";\n if (amount < 0) return \"Minus \" + amountToWords(-amount);\n\n const intPart = Math.floor(amount);\n const paisePart = Math.round((amount - intPart) * 100);\n\n let words = \"\";\n let remaining = intPart;\n\n // Crores (1,00,00,000)\n if (remaining >= 10000000) {\n const crores = Math.floor(remaining / 10000000);\n words += threeDigitWords(crores) + \" Crore \";\n remaining %= 10000000;\n }\n\n // Lakhs (1,00,000)\n if (remaining >= 100000) {\n const lakhs = Math.floor(remaining / 100000);\n words += twoDigitWords(lakhs) + \" Lakh \";\n remaining %= 100000;\n }\n\n // Thousands (1,000)\n if (remaining >= 1000) {\n const thousands = Math.floor(remaining / 1000);\n words += twoDigitWords(thousands) + \" Thousand \";\n remaining %= 1000;\n }\n\n // Hundreds and below\n if (remaining > 0) {\n words += threeDigitWords(remaining);\n }\n\n words = words.trim() + \" Rupees\";\n\n if (paisePart > 0) {\n words += \" and \" + twoDigitWords(paisePart) + \" Paise\";\n }\n\n return words + \" Only\";\n}\n\nexport function formatIndianCurrency(amount: number): string {\n const isNeg = amount < 0;\n const abs = Math.abs(amount);\n const [intPart, decPart] = abs.toFixed(2).split(\".\");\n\n let formatted = \"\";\n const digits = intPart.split(\"\").reverse();\n for (let i = 0; i < digits.length; i++) {\n if (i === 3 || (i > 3 && (i - 3) % 2 === 0)) formatted = \",\" + formatted;\n formatted = digits[i] + formatted;\n }\n\n return (isNeg ? \"-\" : \"\") + \"₹\" + formatted + \".\" + decPart;\n}\n\nexport function generateVoucherNumber(type: \"cash_in\" | \"cash_out\"): string {\n const prefix = type === \"cash_in\" ? \"CI\" : \"CO\";\n const date = new Date();\n const y = date.getFullYear().toString().slice(-2);\n const m = (date.getMonth() + 1).toString().padStart(2, \"0\");\n const d = date.getDate().toString().padStart(2, \"0\");\n const rand = Math.floor(Math.random() * 9000 + 1000);\n return `${prefix}-${y}${m}${d}-${rand}`;\n}\n\nexport function isOverdue(deadline: string): boolean {\n if (!deadline) return false;\n return new Date(deadline) < new Date();\n}\n\nexport function daysUntilDeadline(deadline: string): number {\n if (!deadline) return Infinity;\n const diff = new Date(deadline).getTime() - Date.now();\n return Math.ceil(diff / (1000 * 60 * 60 * 24));\n}\n",[],[221,213],"shared","ff8ba762-5356-11f1-8ab1-ee650bb23af1","types.ts","ff8ba866-5356-11f1-8ab1-ee650bb23af1",["D",1779176854472],"// Shared types for Cash Memo App\n\nexport type TransactionType = \"cash_in\" | \"cash_out\";\nexport type PaymentType = \"cash\" | \"upi\" | \"bank_transfer\" | \"cheque\";\nexport type EntryStatus = \"draft\" | \"active\" | \"settled\" | \"cancelled\";\n\nexport interface Person {\n id?: number;\n name: string;\n fatherOrCompany: string;\n mobile: string;\n altMobile: string;\n address: string;\n idProofType: string;\n idProofNumber: string;\n}\n\nexport interface Transaction {\n id?: number;\n voucherNumber: string;\n type: TransactionType;\n status: EntryStatus;\n date: string;\n time: string;\n personName: string;\n fatherOrCompany: string;\n mobile: string;\n altMobile: string;\n address: string;\n idProofType: string;\n idProofNumber: string;\n amount: number;\n amountInWords: string;\n paymentType: PaymentType;\n purpose: string;\n givenBy: string;\n receivedBy: string;\n notes: string;\n terms: string;\n settlementDeadline: string;\n customMessage: string;\n itemDescription: string;\n referenceNumber: string;\n approvalDetails: string;\n witnessName: string;\n witnessSignature: string;\n signature: string;\n category: string;\n createdAt: string;\n updatedAt: string;\n}\n\nexport interface DashboardStats {\n totalCashIn: number;\n totalCashOut: number;\n netBalance: number;\n pendingSettlements: number;\n todayIn: number;\n todayOut: number;\n monthIn: number;\n monthOut: number;\n overdueCount: number;\n}\n\nexport interface LedgerEntry {\n personName: string;\n totalIn: number;\n totalOut: number;\n balance: number;\n pendingCount: number;\n lastTransaction: string;\n}\n\nexport interface ExportData {\n version: string;\n exportDate: string;\n transactions: Transaction[];\n persons: Person[];\n}\n",[],[221,223],"ff8bc300-5356-11f1-8ab1-ee650bb23af1",["D",1779176854472],[201,202],[221],"dae327e0-5357-11f1-9152-ee650bb23af1","styles.css","dae3288a-5357-11f1-9152-ee650bb23af1","32c6f033-ea0c-4c2b-9c0e-bd2f9eab1262",13,["D",1779177222469],"/* CashMemo App Styles - Clean, Professional, Modern */\n:root {\n --bg: #f5f7fa;\n --bg-card: #ffffff;\n --bg-hover: #f0f2f5;\n --text: #1a1a2e;\n --text-muted: #6b7280;\n --border: #e2e8f0;\n --primary: #4f46e5;\n --primary-light: #eef2ff;\n --success: #10b981;\n --success-light: #d1fae5;\n --danger: #ef4444;\n --danger-light: #fee2e2;\n --warning: #f59e0b;\n --warning-light: #fef3c7;\n --blue: #3b82f6;\n --blue-light: #dbeafe;\n --shadow: 0 1px 3px rgba(0,0,0,0.08);\n --shadow-lg: 0 4px 12px rgba(0,0,0,0.1);\n --radius: 10px;\n}\n\n.dark {\n --bg: #0f172a;\n --bg-card: #1e293b;\n --bg-hover: #334155;\n --text: #f1f5f9;\n --text-muted: #94a3b8;\n --border: #334155;\n --primary-light: #312e81;\n --success-light: #064e3b;\n --danger-light: #7f1d1d;\n --warning-light: #78350f;\n --blue-light: #1e3a5f;\n --shadow: 0 1px 3px rgba(0,0,0,0.3);\n --shadow-lg: 0 4px 12px rgba(0,0,0,0.4);\n}\n\n* { margin: 0; padding: 0; box-sizing: border-box; }\nbody { font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--bg); color: var(--text); }\n\n.app { min-height: 100vh; display: flex; flex-direction: column; }\n\n/* Navbar */\n.navbar {\n background: var(--bg-card);\n border-bottom: 1px solid var(--border);\n padding: 0 24px;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n box-shadow: var(--shadow);\n position: sticky;\n top: 0;\n z-index: 100;\n}\n.nav-brand { display: flex; align-items: center; gap: 8px; cursor: pointer; }\n.nav-logo { font-size: 24px; }\n.nav-title { font-size: 20px; font-weight: 800; letter-spacing: -0.5px; color: var(--primary); }\n.nav-links { display: flex; align-items: center; gap: 4px; }\n.nav-link {\n background: none; border: none; cursor: pointer; padding: 8px 14px; border-radius: 8px;\n font-size: 13px; font-weight: 500; color: var(--text-muted); transition: all 0.2s;\n}\n.nav-link:hover { background: var(--bg-hover); color: var(--text); }\n.nav-link.active { background: var(--primary-light); color: var(--primary); font-weight: 600; }\n.nav-action-in { color: var(--success) !important; font-weight: 600 !important; }\n.nav-action-out { color: var(--danger) !important; font-weight: 600 !important; }\n.nav-divider { width: 1px; height: 24px; background: var(--border); margin: 0 8px; }\n.theme-toggle { font-size: 18px !important; }\n.menu-toggle { display: none; background: none; border: none; font-size: 24px; cursor: pointer; color: var(--text); }\n\n/* Main Content */\n.main-content { flex: 1; max-width: 1280px; width: 100%; margin: 0 auto; padding: 24px; }\n\n/* Page Header */\n.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; flex-wrap: wrap; gap: 12px; }\n.page-header h1 { font-size: 24px; font-weight: 700; }\n.header-actions { display: flex; gap: 8px; }\n\n/* Buttons */\n.btn {\n display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; border: none;\n border-radius: 8px; font-size: 14px; font-weight: 600; cursor: pointer; transition: all 0.2s;\n}\n.btn-sm { padding: 6px 14px; font-size: 13px; }\n.btn-primary { background: var(--primary); color: white; }\n.btn-primary:hover { background: #4338ca; }\n.btn-success { background: var(--success); color: white; }\n.btn-success:hover { background: #059669; }\n.btn-danger { background: var(--danger); color: white; }\n.btn-danger:hover { background: #dc2626; }\n.btn-warning { background: var(--warning); color: white; }\n.btn-warning:hover { background: #d97706; }\n.btn-outline { background: transparent; border: 1px solid var(--border); color: var(--text); }\n.btn-outline:hover { background: var(--bg-hover); }\n.btn:disabled { opacity: 0.5; cursor: not-allowed; }\n.btn-icon { background: none; border: none; cursor: pointer; font-size: 18px; padding: 4px; border-radius: 4px; }\n.btn-icon:hover { background: var(--bg-hover); }\n.btn-icon-danger:hover { background: var(--danger-light); }\n\n/* Stats Grid */\n.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 20px; }\n.stats-grid-small { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }\n.stat-card {\n background: var(--bg-card); border-radius: var(--radius); padding: 20px; box-shadow: var(--shadow);\n display: flex; align-items: center; gap: 16px; border-left: 4px solid transparent;\n}\n.stat-icon { font-size: 32px; }\n.stat-info { display: flex; flex-direction: column; }\n.stat-label { font-size: 12px; color: var(--text-muted); font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px; }\n.stat-value { font-size: 22px; font-weight: 800; }\n.stat-value-sm { font-size: 18px; font-weight: 700; }\n.stat-green { border-left-color: var(--success); }\n.stat-green .stat-value { color: var(--success); }\n.stat-red { border-left-color: var(--danger); }\n.stat-red .stat-value { color: var(--danger); }\n.stat-blue { border-left-color: var(--blue); }\n.stat-blue .stat-value { color: var(--blue); }\n.stat-orange { border-left-color: #f97316; }\n.stat-orange .stat-value { color: #f97316; }\n.stat-overdue { border-left-color: var(--danger); background: var(--danger-light); }\n.stat-overdue .stat-value { color: var(--danger); font-weight: 900; }\n.stat-gray { border-left-color: #9ca3af; }\n.stat-gray .stat-value { color: #9ca3af; }\n.stat-green-light { border-left-color: var(--success); background: var(--success-light); }\n.stat-green-light .stat-value-sm { color: var(--success); }\n.stat-red-light { border-left-color: var(--danger); background: var(--danger-light); }\n.stat-red-light .stat-value-sm { color: var(--danger); }\n.stat-yellow { border-left-color: var(--warning); background: var(--warning-light); }\n.stat-yellow .stat-value-sm { color: var(--warning); }\n\n/* Section */\n.section { margin-top: 24px; }\n.section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }\n.section-header h2 { font-size: 18px; font-weight: 600; }\n\n/* Table */\n.table-wrap { overflow-x: auto; background: var(--bg-card); border-radius: var(--radius); box-shadow: var(--shadow); }\n.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }\n.data-table thead { background: var(--bg-hover); }\n.data-table th { padding: 12px 16px; text-align: left; font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); white-space: nowrap; }\n.data-table td { padding: 12px 16px; border-top: 1px solid var(--border); vertical-align: top; }\n.data-table tr:hover { background: var(--bg-hover); }\n.row-overdue { background: var(--danger-light) !important; }\n.row-overdue:hover { background: #fecaca !important; }\n.dark .row-overdue { background: #450a0a !important; }\n.dark .row-overdue:hover { background: #5a1010 !important; }\n.row-draft { opacity: 0.75; border-left: 3px solid var(--warning); }\n.empty-row { text-align: center; color: var(--text-muted); padding: 40px !important; }\n.mono { font-family: 'JetBrains Mono', 'Fira Code', monospace; font-size: 12px; }\n.text-green { color: var(--success); font-weight: 600; }\n.text-red { color: var(--danger); font-weight: 600; }\n.text-muted { color: var(--text-muted); font-size: 11px; }\n.text-overdue { color: var(--danger) !important; font-weight: 700 !important; }\n.capitalize { text-transform: capitalize; }\n.amount-cell { white-space: nowrap; }\n.amount-words-mini { font-size: 10px; color: var(--text-muted); font-style: italic; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.actions-cell { white-space: nowrap; }\n\n/* Badges */\n.badge {\n display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 11px;\n font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px;\n}\n.badge-green { background: var(--success-light); color: #065f46; }\n.badge-red { background: var(--danger-light); color: #991b1b; }\n.badge-yellow { background: var(--warning-light); color: #92400e; }\n.badge-blue { background: var(--blue-light); color: #1e40af; }\n.badge-gray { background: #f3f4f6; color: #6b7280; }\n.overdue-badge {\n display: inline-block; background: var(--danger); color: white; padding: 1px 8px;\n border-radius: 4px; font-size: 10px; font-weight: 700; margin-left: 6px; animation: pulse 1.5s infinite;\n}\n@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }\n\n/* Status pills */\n.status-pills { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }\n.pill {\n padding: 6px 16px; border-radius: 20px; border: 1px solid var(--border); background: var(--bg-card);\n cursor: pointer; font-size: 13px; font-weight: 500; color: var(--text-muted); transition: all 0.2s;\n}\n.pill:hover { background: var(--bg-hover); }\n.pill.pill-active { background: var(--primary); color: white; border-color: var(--primary); }\n.pill-draft.pill-active { background: var(--warning); border-color: var(--warning); }\n.pill-active-status.pill-active { background: var(--success); border-color: var(--success); }\n.pill-settled.pill-active { background: var(--blue); border-color: var(--blue); }\n\n/* Filters */\n.filters-bar { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }\n.search-box { display: flex; gap: 8px; flex: 1; min-width: 200px; }\n.search-box .form-input { flex: 1; }\n.filter-select { max-width: 160px; }\n\n/* Forms */\n.form-card { background: var(--bg-card); border-radius: var(--radius); padding: 24px; box-shadow: var(--shadow); }\n.form-section { margin-bottom: 24px; }\n.form-section h3 { font-size: 16px; font-weight: 700; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }\n.collapsible { cursor: pointer; user-select: none; }\n.collapsible:hover { color: var(--primary); }\n.form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }\n.form-group { display: flex; flex-direction: column; gap: 4px; }\n.form-group-wide { grid-column: 1 / -1; }\n.form-label, .form-group label { font-size: 12px; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; }\n.form-input {\n padding: 10px 14px; border: 1px solid var(--border); border-radius: 8px; font-size: 14px;\n background: var(--bg); color: var(--text); transition: border-color 0.2s;\n}\n.form-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1); }\ntextarea.form-input { resize: vertical; }\n.amount-input { font-size: 20px; font-weight: 700; }\n.amount-words { background: var(--primary-light); padding: 10px 14px; border-radius: 8px; font-style: italic; font-size: 13px; color: var(--primary); min-height: 40px; }\n.form-actions { display: flex; gap: 12px; justify-content: flex-end; padding-top: 20px; border-top: 1px solid var(--border); flex-wrap: wrap; }\n\n/* Suggestions dropdown */\n.suggestions-dropdown {\n position: absolute; top: 100%; left: 0; right: 0; background: var(--bg-card);\n border: 1px solid var(--border); border-radius: 8px; box-shadow: var(--shadow-lg);\n max-height: 240px; overflow-y: auto; z-index: 50;\n}\n.suggestion-item { padding: 10px 14px; cursor: pointer; border-bottom: 1px solid var(--border); }\n.suggestion-item:hover { background: var(--primary-light); }\n.suggestion-item:last-child { border-bottom: none; }\n.suggestion-detail { display: block; font-size: 11px; color: var(--text-muted); margin-top: 2px; }\n\n/* Signatures grid */\n.signatures-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }\n.sig-pad { display: flex; flex-direction: column; gap: 6px; }\n\n/* Voucher preview */\n.voucher-card {\n background: var(--bg-card); border-radius: var(--radius); box-shadow: var(--shadow-lg);\n overflow: hidden; max-width: 800px;\n}\n.voucher-header {\n text-align: center; padding: 24px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n}\n.voucher-header h2 { font-size: 22px; margin-bottom: 4px; }\n.voucher-header p { font-size: 13px; opacity: 0.85; }\n.voucher-type-badge {\n display: inline-block; margin-top: 10px; padding: 6px 20px; border-radius: 20px;\n font-weight: 700; font-size: 13px;\n}\n.type-in { background: rgba(255,255,255,0.2); }\n.type-out { background: rgba(255,255,255,0.2); }\n.overdue-notice { background: var(--danger); color: white; padding: 10px 20px; text-align: center; font-weight: 600; font-size: 13px; }\n.voucher-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--border); padding: 1px; }\n.info-item { background: var(--bg-card); padding: 10px 16px; display: flex; flex-direction: column; }\n.info-item .info-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); font-weight: 600; }\n.info-item .info-value { font-size: 14px; font-weight: 500; margin-top: 2px; }\n.voucher-amount-box { text-align: center; padding: 24px; background: linear-gradient(135deg, #f0f4ff, #e8f5e9); }\n.dark .voucher-amount-box { background: linear-gradient(135deg, #1e293b, #1a2e1a); }\n.amount-big { font-size: 36px; font-weight: 900; color: var(--primary); }\n.amount-words-display { font-size: 14px; color: var(--text-muted); font-style: italic; margin-top: 4px; }\n.voucher-detail { padding: 12px 20px; border-top: 1px solid var(--border); font-size: 13px; }\n.voucher-signatures { display: flex; justify-content: space-between; padding: 24px; border-top: 1px solid var(--border); }\n.sig-box { text-align: center; width: 45%; }\n.sig-img { max-width: 200px; height: 60px; object-fit: contain; }\n.sig-label { border-top: 1px solid var(--text); padding-top: 8px; margin-top: 8px; font-size: 12px; color: var(--text-muted); }\n\n/* Data Manager */\n.data-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }\n.data-card { background: var(--bg-card); padding: 24px; border-radius: var(--radius); box-shadow: var(--shadow); }\n.data-card h3 { font-size: 16px; margin-bottom: 8px; }\n.data-card p { font-size: 13px; color: var(--text-muted); margin-bottom: 16px; }\n.status-message { margin-top: 20px; padding: 14px 20px; border-radius: var(--radius); font-size: 14px; font-weight: 500; }\n.status-success { background: var(--success-light); color: #065f46; }\n.status-error { background: var(--danger-light); color: #991b1b; }\n.status-info { background: var(--blue-light); color: #1e40af; }\n\n/* Loading */\n.loading { text-align: center; padding: 60px 20px; color: var(--text-muted); font-size: 16px; }\n\n/* Footer */\n.app-footer {\n text-align: center; padding: 16px 24px; border-top: 1px solid var(--border);\n font-size: 12px; color: var(--text-muted); display: flex; justify-content: center; gap: 20px;\n}\n.source-link { color: var(--primary); text-decoration: none; }\n.source-link:hover { text-decoration: underline; }\n\n/* Mobile */\n@media (max-width: 768px) {\n .menu-toggle { display: block; }\n .nav-links {\n display: none; position: absolute; top: 60px; left: 0; right: 0; background: var(--bg-card);\n flex-direction: column; padding: 12px; border-bottom: 1px solid var(--border); box-shadow: var(--shadow-lg);\n }\n .nav-links.nav-open { display: flex; }\n .nav-divider { display: none; }\n .nav-link { width: 100%; text-align: left; }\n .main-content { padding: 16px; }\n .stats-grid { grid-template-columns: 1fr 1fr; }\n .form-grid { grid-template-columns: 1fr; }\n .voucher-info-grid { grid-template-columns: 1fr; }\n .voucher-signatures { flex-direction: column; gap: 24px; }\n .sig-box { width: 100%; }\n .page-header { flex-direction: column; align-items: flex-start; }\n .filters-bar { flex-direction: column; }\n .filter-select { max-width: 100%; }\n}\n",[],[242,234],"frontend","b19f8518-5357-11f1-9152-ee650bb23af1","App.tsx","b19f85b8-5357-11f1-9152-ee650bb23af1",12,["D",1779177153240],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState } from \"https://esm.sh/react@18.2.0\";\nimport { Dashboard } from \"./components/Dashboard.tsx\";\nimport { TransactionForm } from \"./components/TransactionForm.tsx\";\nimport { TransactionList } from \"./components/TransactionList.tsx\";\nimport { VoucherPreview } from \"./components/VoucherPreview.tsx\";\nimport { Ledger } from \"./components/Ledger.tsx\";\nimport { DataManager } from \"./components/DataManager.tsx\";\n\ntype Page = \"dashboard\" | \"transactions\" | \"new-cash-in\" | \"new-cash-out\" | \"edit\" | \"view\" | \"ledger\" | \"data\";\n\nexport function App() {\n const [page, setPage] = useState(\"dashboard\");\n const [editId, setEditId] = useState(null);\n const [viewId, setViewId] = useState(null);\n const [darkMode, setDarkMode] = useState(false);\n const [menuOpen, setMenuOpen] = useState(false);\n\n const navigate = (p: string) => {\n setPage(p as Page);\n setMenuOpen(false);\n };\n\n const handleEdit = (id: number) => { setEditId(id); setPage(\"edit\"); setMenuOpen(false); };\n const handleView = (id: number) => { setViewId(id); setPage(\"view\"); setMenuOpen(false); };\n\n const renderPage = () => {\n switch (page) {\n case \"dashboard\":\n return ;\n case \"transactions\":\n return ;\n case \"new-cash-in\":\n return navigate(\"transactions\")} onCancel={() => navigate(\"transactions\")} />;\n case \"new-cash-out\":\n return navigate(\"transactions\")} onCancel={() => navigate(\"transactions\")} />;\n case \"edit\":\n return navigate(\"transactions\")} onCancel={() => navigate(\"transactions\")} />;\n case \"view\":\n return viewId ? navigate(\"transactions\")} onEdit={handleEdit} /> : null;\n case \"ledger\":\n return ;\n case \"data\":\n return ;\n default:\n return ;\n }\n };\n\n return (\n

navigate(\"dashboard\")}>\n 💰\n CashMemo\n

\n\n \n\n

\n \n \n \n \n

\n \n \n \n

\n\n

\n {renderPage()}\n

\n\n \n

\n );\n}\n",[],[242,244],"90e1a536-5357-11f1-acac-ee650bb23af1","VoucherPreview.tsx","90e1a5ea-5357-11f1-acac-ee650bb23af1","ae5e2bbb-2152-4f9a-9ece-9134140440b7",9,["D",1779177098305],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Transaction } from \"../../shared/types.ts\";\n\nfunction fmt(n: number) {\n const abs = Math.abs(n);\n const [i, d] = abs.toFixed(2).split(\".\");\n const digs = i.split(\"\").reverse();\n let f = \"\";\n for (let j = 0; j < digs.length; j++) {\n if (j === 3 || (j > 3 && (j - 3) % 2 === 0)) f = \",\" + f;\n f = digs[j] + f;\n }\n return \"₹\" + f + \".\" + d;\n}\n\ninterface Props {\n id: number;\n onBack: () => void;\n onEdit: (id: number) => void;\n}\n\nexport function VoucherPreview({ id, onBack, onEdit }: Props) {\n const [tx, setTx] = useState(null);\n const [loading, setLoading] = useState(true);\n\n useEffect(() => {\n fetch(`/api/transactions/${id}`).then(r => r.json()).then(d => { setTx(d); setLoading(false); });\n }, [id]);\n\n if (loading || !tx) return

Loading voucher...

;\n\n const isOverdue = tx.status === \"active\" && tx.settlementDeadline && new Date(tx.settlementDeadline) < new Date();\n\n const printVoucher = () => {\n const printWindow = window.open(\"\", \"_blank\");\n if (!printWindow) return;\n printWindow.document.write(`Voucher ${tx.voucherNumber}\n \n

\n \n ${isOverdue ? '

⚠️ OVERDUE - Past settlement deadline

' : \"\"}\n

Voucher No: ${tx.voucherNumber}

Date: ${tx.date} ${tx.time}

Person: ${tx.personName}

Father/Company: ${tx.fatherOrCompany || \"—\"}

Mobile: ${tx.mobile || \"—\"}

Address: ${tx.address || \"—\"}

ID Proof: ${tx.idProofType ? tx.idProofType + \" - \" + tx.idProofNumber : \"—\"}

Payment Mode: ${tx.paymentType?.replace(\"_\", \" \").toUpperCase()}

Purpose: ${tx.purpose || \"—\"}

Given By: ${tx.givenBy || \"—\"}

Received By: ${tx.receivedBy || \"—\"}

Status: ${tx.status.toUpperCase()}

\n ${tx.settlementDeadline ? `

Deadline: ${tx.settlementDeadline}

` : \"\"}\n ${tx.referenceNumber ? `

Ref No: ${tx.referenceNumber}

` : \"\"}\n

${fmt(tx.amount)}

${tx.amountInWords}

\n ${tx.itemDescription ? `

Items/Services: ${tx.itemDescription}

` : \"\"}\n ${tx.notes ? `

Notes: ${tx.notes}

` : \"\"}\n ${tx.terms ? `

Terms: ${tx.terms}

` : \"\"}\n ${tx.customMessage ? `

Message: ${tx.customMessage}

` : \"\"}\n ${tx.witnessName ? `

Witness: ${tx.witnessName}

` : \"\"}\n

\n ${tx.signature ? ` $\"Signature\"/$ ` : \"

\"}\n

${tx.type === \"cash_out\" ? \"Receiver\" : \"Giver\"}'s Signature

\n ${tx.witnessSignature ? ` $\"Witness\"/$ ` : \"

\"}\n

Authorized Signature

\n \n

\n \n `);\n printWindow.document.close();\n };\n\n return (\n

🧾 Voucher Preview

\n \n \n \n

\n\n

CASH MEMO / VOUCHER

Receipt & Acknowledgement

\n \n {tx.type === \"cash_in\" ? \"💰 CASH RECEIVED\" : \"💸 CASH PAID\"}\n \n \n {tx.status === \"draft\" ? \"📝 DRAFT\" : tx.status.toUpperCase()}\n \n

\n\n {isOverdue && (\n

⚠️ OVERDUE — This transaction is past its settlement deadline ({tx.settlementDeadline})

\n )}\n\n

Voucher No{tx.voucherNumber}

Date & Time{tx.date} {tx.time}

Person{tx.personName}

Father/Company{tx.fatherOrCompany || \"—\"}

Mobile{tx.mobile || \"—\"} {tx.altMobile ? `/ ${tx.altMobile}` : \"\"}

Address{tx.address || \"—\"}

ID Proof{tx.idProofType ? `${tx.idProofType}: ${tx.idProofNumber}` : \"—\"}

Payment Mode{tx.paymentType?.replace(\"_\", \" \")}

Purpose{tx.purpose || \"—\"}

Category{tx.category}

Given By{tx.givenBy || \"—\"}

Received By{tx.receivedBy || \"—\"}

\n {tx.settlementDeadline &&

Settlement Deadline{tx.settlementDeadline}

}\n {tx.referenceNumber &&

Reference No{tx.referenceNumber}

}\n {tx.approvalDetails &&

Approval{tx.approvalDetails}

}\n {tx.witnessName &&

Witness{tx.witnessName}

}\n

\n\n

{fmt(tx.amount)}

{tx.amountInWords}

\n\n {tx.itemDescription &&

Items/Services: {tx.itemDescription}

}\n {tx.notes &&

Notes: {tx.notes}

}\n {tx.terms &&

Terms & Conditions: {tx.terms}

}\n {tx.customMessage &&

Message: {tx.customMessage}

}\n\n

\n {tx.signature && $\"Signature\"$ }\n

{tx.type === \"cash_out\" ? \"Receiver\" : \"Giver\"}'s Signature

\n {tx.witnessSignature && $\"Witness\"$ }\n

Authorized Signature

\n );\n}\n",[],[242,260,252],"components","77f53e0c-5357-11f1-ba2a-ee650bb23af1","TransactionList.tsx","77f53ea2-5357-11f1-ba2a-ee650bb23af1",8,["D",1779177056494],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport type { Transaction } from \"../../shared/types.ts\";\n\nfunction fmt(n: number) {\n const abs = Math.abs(n);\n const [i, d] = abs.toFixed(2).split(\".\");\n const digs = i.split(\"\").reverse();\n let f = \"\";\n for (let j = 0; j < digs.length; j++) {\n if (j === 3 || (j > 3 && (j - 3) % 2 === 0)) f = \",\" + f;\n f = digs[j] + f;\n }\n return (n < 0 ? \"-\" : \"\") + \"₹\" + f + \".\" + d;\n}\n\ninterface Props {\n onEdit: (id: number) => void;\n onView: (id: number) => void;\n onNavigate: (page: string) => void;\n filterStatus?: string;\n}\n\nexport function TransactionList({ onEdit, onView, onNavigate, filterStatus }: Props) {\n const [items, setItems] = useState([]);\n const [search, setSearch] = useState(\"\");\n const [typeFilter, setTypeFilter] = useState(\"\");\n const [statusFilter, setStatusFilter] = useState(filterStatus || \"\");\n const [loading, setLoading] = useState(true);\n\n const load = () => {\n setLoading(true);\n const params = new URLSearchParams();\n if (search) params.set(\"search\", search);\n if (typeFilter) params.set(\"type\", typeFilter);\n if (statusFilter) params.set(\"status\", statusFilter);\n fetch(`/api/transactions?${params}`).then(r => r.json()).then(d => { setItems(d); setLoading(false); });\n };\n\n useEffect(() => { load(); }, [typeFilter, statusFilter]);\n\n const isOverdue = (t: any) =>\n t.status === \"active\" && t.settlementDeadline && new Date(t.settlementDeadline) < new Date();\n\n const handleDelete = async (id: number) => {\n if (!confirm(\"Are you sure you want to delete this transaction?\")) return;\n await fetch(`/api/transactions/${id}`, { method: \"DELETE\" });\n load();\n };\n\n const handleSettle = async (id: number) => {\n await fetch(`/api/transactions/${id}`, {\n method: \"PUT\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ status: \"settled\" })\n });\n load();\n };\n\n // Count by status\n const draftCount = items.filter(t => (t as any).status === \"draft\").length;\n const activeCount = items.filter(t => (t as any).status === \"active\").length;\n const settledCount = items.filter(t => (t as any).status === \"settled\").length;\n const overdueCount = items.filter(t => isOverdue(t)).length;\n\n return (\n

📋 Transactions

\n \n \n

\n\n {/* Status pills */}\n

\n \n \n \n \n

\n\n {/* Search/filters bar */}\n

\n setSearch(e.target.value)}\n onKeyDown={e => e.key === \"Enter\" && load()}\n className=\"form-input\"\n />\n \n

\n \n

\n\n {loading ?

: (\n

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {items.length === 0 && (\n \n )}\n {items.map((t: any) => (\n \n \n \n \n \n \n \n \n \n \n \n ))}\n \n

Voucher	Date	Person	Type	Amount	Payment	Status	Deadline	Actions
No transactions found
{t.voucherNumber}	{t.date}	\n {t.personName} \n {t.fatherOrCompany && {t.fatherOrCompany}}\n	\n \n {t.type === \"cash_in\" ? \"↓ In\" : \"↑ Out\"}\n \n	\n {fmt(t.amount)}\n {t.amountInWords} \n	{t.paymentType?.replace(\"_\", \" \")}	\n \n {t.status === \"draft\" ? \"📝 \" : \"\"}{t.status}\n \n	\n {t.settlementDeadline ? (\n \n {t.settlementDeadline}\n {isOverdue(t) && 🔴 OVERDUE }\n \n ) : \"—\"}\n	\n \n \n {t.status === \"active\" && (\n \n )}\n \n

\n )}\n

\n );\n}\n",[],[242,260,262],"6745ee30-5357-11f1-b178-ee650bb23af1","TransactionForm.tsx","6745eef8-5357-11f1-b178-ee650bb23af1",7,["D",1779177028500],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { SignaturePad } from \"./SignaturePad.tsx\";\nimport { amountToWords, generateVoucherNumber } from \"../../shared/utils.ts\";\nimport type { Transaction, Person } from \"../../shared/types.ts\";\n\ninterface Props {\n type: \"cash_in\" | \"cash_out\";\n editId?: number | null;\n onSave: () => void;\n onCancel: () => void;\n}\n\nconst defaultForm = (type: \"cash_in\" | \"cash_out\") => ({\n voucherNumber: generateVoucherNumber(type),\n type,\n status: \"active\" as const,\n date: new Date().toISOString().split(\"T\")[0],\n time: new Date().toTimeString().slice(0, 5),\n personName: \"\",\n fatherOrCompany: \"\",\n mobile: \"\",\n altMobile: \"\",\n address: \"\",\n idProofType: \"\",\n idProofNumber: \"\",\n amount: 0,\n amountInWords: \"\",\n paymentType: \"cash\" as const,\n purpose: \"\",\n givenBy: type === \"cash_out\" ? \"Myself\" : \"\",\n receivedBy: type === \"cash_in\" ? \"Myself\" : \"\",\n notes: \"\",\n terms: \"\",\n settlementDeadline: \"\",\n customMessage: \"\",\n itemDescription: \"\",\n referenceNumber: \"\",\n approvalDetails: \"\",\n witnessName: \"\",\n witnessSignature: \"\",\n signature: \"\",\n category: \"general\",\n});\n\nexport function TransactionForm({ type, editId, onSave, onCancel }: Props) {\n const [form, setForm] = useState(defaultForm(type));\n const [suggestions, setSuggestions] = useState([]);\n const [showSuggestions, setShowSuggestions] = useState(false);\n const [showAckDetails, setShowAckDetails] = useState(false);\n const [saving, setSaving] = useState(false);\n\n useEffect(() => {\n if (editId) {\n fetch(`/api/transactions/${editId}`).then(r => r.json()).then(data => {\n setForm(data);\n });\n }\n }, [editId]);\n\n const updateField = (field: string, value: any) => {\n setForm(prev => {\n const next = { ...prev, [field]: value };\n if (field === \"amount\") {\n next.amountInWords = value > 0 ? amountToWords(Number(value)) : \"\";\n }\n return next;\n });\n };\n\n // Person auto-fill - pulls ALL stored details\n const searchPersons = useCallback(async (q: string) => {\n if (q.length < 1) { setSuggestions([]); return; }\n const res = await fetch(`/api/persons?q=${encodeURIComponent(q)}`);\n const data = await res.json();\n setSuggestions(data);\n setShowSuggestions(data.length > 0);\n }, []);\n\n const selectPerson = (p: Person) => {\n setForm(prev => ({\n ...prev,\n personName: p.name,\n fatherOrCompany: p.fatherOrCompany || prev.fatherOrCompany,\n mobile: p.mobile || prev.mobile,\n altMobile: p.altMobile || prev.altMobile,\n address: p.address || prev.address,\n idProofType: p.idProofType || prev.idProofType,\n idProofNumber: p.idProofNumber || prev.idProofNumber,\n }));\n setShowSuggestions(false);\n };\n\n const handleSubmit = async (status: string) => {\n if (!form.personName || !form.amount) {\n alert(\"Person name and amount are required!\");\n return;\n }\n setSaving(true);\n const payload = { ...form, status };\n\n try {\n const url = editId ? `/api/transactions/${editId}` : \"/api/transactions\";\n const method = editId ? \"PUT\" : \"POST\";\n const res = await fetch(url, { method, headers: { \"Content-Type\": \"application/json\" }, body: JSON.stringify(payload) });\n if (res.ok) onSave();\n else alert(\"Error saving transaction\");\n } finally {\n setSaving(false);\n }\n };\n\n return (\n

{editId ? \"Edit\" : \"New\"} {type === \"cash_in\" ? \"💰 Cash In\" : \"💸 Cash Out\"}

\n \n

\n\n

\n {/* Basic Info */}\n

📋 Basic Information

\n Voucher Number\n updateField(\"voucherNumber\", e.target.value)} className=\"form-input mono\" />\n

\n Date\n updateField(\"date\", e.target.value)} className=\"form-input\" />\n

\n Time\n updateField(\"time\", e.target.value)} className=\"form-input\" />\n

\n Category\n \n

\n\n {/* Person Details */}\n

👤 Person Details

\n Person Name *\n { updateField(\"personName\", e.target.value); searchPersons(e.target.value); }}\n onFocus={() => form.personName && searchPersons(form.personName)}\n onBlur={() => setTimeout(() => setShowSuggestions(false), 200)}\n placeholder=\"Start typing to auto-fill...\"\n className=\"form-input\"\n />\n {showSuggestions && (\n

\n {suggestions.map((p, i) => (\n

selectPerson(p)}>\n {p.name}\n {p.fatherOrCompany} • {p.mobile} • {p.address}\n

\n ))}\n

\n )}\n

\n Father/Company Name\n updateField(\"fatherOrCompany\", e.target.value)} className=\"form-input\" />\n

\n Mobile\n updateField(\"mobile\", e.target.value)} className=\"form-input\" type=\"tel\" />\n

\n Alt. Mobile\n updateField(\"altMobile\", e.target.value)} className=\"form-input\" type=\"tel\" />\n

\n Address\n updateField(\"address\", e.target.value)} className=\"form-input\" />\n

\n ID Proof Type\n \n

\n ID Proof Number\n updateField(\"idProofNumber\", e.target.value)} className=\"form-input\" />\n

\n\n {/* Payment Details */}\n

💵 Payment Details

\n Amount (₹) *\n updateField(\"amount\", parseFloat(e.target.value) || 0)}\n className=\"form-input amount-input\"\n placeholder=\"0.00\"\n min=\"0\"\n step=\"0.01\"\n />\n

\n Amount in Words\n

{form.amountInWords || \"—\"}

\n Payment Type\n \n

\n Purpose / Reason\n updateField(\"purpose\", e.target.value)} className=\"form-input\" placeholder=\"What is this payment for?\" />\n

\n Given By\n updateField(\"givenBy\", e.target.value)} className=\"form-input\" />\n

\n Received By\n updateField(\"receivedBy\", e.target.value)} className=\"form-input\" />\n

\n Settlement Deadline\n updateField(\"settlementDeadline\", e.target.value)} className=\"form-input\" />\n

\n Notes / Remarks\n

updateField(\"notes\", e.target.value)} className=\"form-input\" rows={2} />\n            </div>\n          </div>\n        </div>\n\n        {/* Acknowledgement Details (collapsible) */}\n        <div className=\"form-section\">\n          <h3 className=\"collapsible\" onClick={() => setShowAckDetails(!showAckDetails)}>\n            📝 Acknowledgement Details {showAckDetails ? \"▼\" : \"▶\"}\n          </h3>\n          {showAckDetails && (\n            <div className=\"form-grid\">\n              <div className=\"form-group form-group-wide\">\n                <label>Terms & Conditions</label>\n                <textarea value={form.terms} onChange={e => updateField(\"terms\", e.target.value)} className=\"form-input\" rows={2} />\n              </div>\n              <div className=\"form-group form-group-wide\">\n                <label>Custom Message</label>\n                <textarea value={form.customMessage} onChange={e => updateField(\"customMessage\", e.target.value)} className=\"form-input\" rows={2} />\n              </div>\n              <div className=\"form-group form-group-wide\">\n                <label>Item/Service Description</label>\n                <textarea value={form.itemDescription} onChange={e => updateField(\"itemDescription\", e.target.value)} className=\"form-input\" rows={2} />\n              </div>\n              <div className=\"form-group\">\n                <label>Reference Number</label>\n                <input value={form.referenceNumber} onChange={e => updateField(\"referenceNumber\", e.target.value)} className=\"form-input\" />\n              </div>\n              <div className=\"form-group\">\n                <label>Approval Details</label>\n                <input value={form.approvalDetails} onChange={e => updateField(\"approvalDetails\", e.target.value)} className=\"form-input\" />\n              </div>\n              <div className=\"form-group\">\n                <label>Witness Name</label>\n                <input value={form.witnessName} onChange={e => updateField(\"witnessName\", e.target.value)} className=\"form-input\" />\n              </div>\n            </div>\n          )}\n        </div>\n\n        {/* Signatures */}\n        <div className=\"form-section\">\n          <h3>✍️ Signatures</h3>\n          <div className=\"signatures-grid\">\n            <SignaturePad\n              value={form.signature}\n              onChange={(v) => updateField(\"signature\", v)}\n              label={type === \"cash_out\" ? \"Receiver's Signature\" : \"Giver's Signature\"}\n            />\n            {showAckDetails && (\n              <SignaturePad\n                value={form.witnessSignature}\n                onChange={(v) => updateField(\"witnessSignature\", v)}\n                label=\"Witness Signature\"\n              />\n            )}\n          </div>\n        </div>\n\n        {/* Actions */}\n        <div className=\"form-actions\">\n          <button className=\"btn btn-outline\" onClick={onCancel} disabled={saving}>Cancel</button>\n          <button className=\"btn btn-warning\" onClick={() => handleSubmit(\"draft\")} disabled={saving}>\n            💾 Save as Draft\n          </button>\n          <button className=\"btn btn-primary\" onClick={() => handleSubmit(\"active\")} disabled={saving}>\n            {saving ? \"Saving...\" : \"✅ Save & Create\"}\n          </button>\n        </div>\n      </div>\n    </div>\n  );\n}\n",[],[242,260,270],"4071e048-5357-11f1-a1cf-ee650bb23af1","SignaturePad.tsx","4071e138-5357-11f1-a1cf-ee650bb23af1",5,["D",1779176963357],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useRef, useEffect, useState, useCallback } from \"https://esm.sh/react@18.2.0\";\n\ninterface Props {\n  value: string;\n  onChange: (dataUrl: string) => void;\n  label?: string;\n  width?: number;\n  height?: number;\n}\n\nexport function SignaturePad({ value, onChange, label = \"Signature\", width = 400, height = 150 }: Props) {\n  const canvasRef = useRef<HTMLCanvasElement>(null);\n  const [isDrawing, setIsDrawing] = useState(false);\n\n  useEffect(() => {\n    const canvas = canvasRef.current;\n    if (!canvas) return;\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) return;\n\n    if (value) {\n      const img = new Image();\n      img.onload = () => {\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\n        ctx.drawImage(img, 0, 0);\n      };\n      img.src = value;\n    } else {\n      ctx.clearRect(0, 0, canvas.width, canvas.height);\n    }\n  }, []);\n\n  const getPos = useCallback((e: React.TouchEvent | React.MouseEvent) => {\n    const canvas = canvasRef.current!;\n    const rect = canvas.getBoundingClientRect();\n    const scaleX = canvas.width / rect.width;\n    const scaleY = canvas.height / rect.height;\n    if (\"touches\" in e) {\n      return {\n        x: (e.touches[0].clientX - rect.left) * scaleX,\n        y: (e.touches[0].clientY - rect.top) * scaleY\n      };\n    }\n    return {\n      x: ((e as React.MouseEvent).clientX - rect.left) * scaleX,\n      y: ((e as React.MouseEvent).clientY - rect.top) * scaleY\n    };\n  }, []);\n\n  const startDraw = useCallback((e: any) => {\n    e.preventDefault();\n    const canvas = canvasRef.current;\n    if (!canvas) return;\n    const ctx = canvas.getContext(\"2d\")!;\n    const pos = getPos(e);\n    ctx.beginPath();\n    ctx.moveTo(pos.x, pos.y);\n    ctx.strokeStyle = \"#1a1a2e\";\n    ctx.lineWidth = 2;\n    ctx.lineCap = \"round\";\n    setIsDrawing(true);\n  }, [getPos]);\n\n  const draw = useCallback((e: any) => {\n    if (!isDrawing) return;\n    e.preventDefault();\n    const canvas = canvasRef.current;\n    if (!canvas) return;\n    const ctx = canvas.getContext(\"2d\")!;\n    const pos = getPos(e);\n    ctx.lineTo(pos.x, pos.y);\n    ctx.stroke();\n  }, [isDrawing, getPos]);\n\n  const endDraw = useCallback(() => {\n    setIsDrawing(false);\n    const canvas = canvasRef.current;\n    if (canvas) onChange(canvas.toDataURL());\n  }, [onChange]);\n\n  const clear = () => {\n    const canvas = canvasRef.current;\n    if (!canvas) return;\n    const ctx = canvas.getContext(\"2d\")!;\n    ctx.clearRect(0, 0, canvas.width, canvas.height);\n    onChange(\"\");\n  };\n\n  return (\n    <div className=\"sig-pad\">\n      <label className=\"form-label\">{label}</label>\n      <canvas\n        ref={canvasRef}\n        width={width}\n        height={height}\n        onMouseDown={startDraw}\n        onMouseMove={draw}\n        onMouseUp={endDraw}\n        onMouseLeave={endDraw}\n        onTouchStart={startDraw}\n        onTouchMove={draw}\n        onTouchEnd={endDraw}\n        style={{\n          border: \"2px dashed #cbd5e1\",\n          borderRadius: \"8px\",\n          width: \"100%\",\n          maxWidth: width,\n          height: \"auto\",\n          aspectRatio: `${width}/${height}`,\n          cursor: \"crosshair\",\n          touchAction: \"none\",\n          background: \"#fafbfc\"\n        }}\n      />\n      <button type=\"button\" onClick={clear} className=\"btn btn-sm btn-outline\" style={{ marginTop: 4 }}>\n        Clear {label}\n      </button>\n    </div>\n  );\n}\n",[],[242,260,278],"9c832838-5357-11f1-a3a3-ee650bb23af1","Ledger.tsx","9c832928-5357-11f1-a3a3-ee650bb23af1",10,["D",1779177117820],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport type { LedgerEntry, Transaction } from \"../../shared/types.ts\";\n\nfunction fmt(n: number) {\n  const abs = Math.abs(n);\n  const [i, d] = abs.toFixed(2).split(\".\");\n  const digs = i.split(\"\").reverse();\n  let f = \"\";\n  for (let j = 0; j < digs.length; j++) {\n    if (j === 3 || (j > 3 && (j - 3) % 2 === 0)) f = \",\" + f;\n    f = digs[j] + f;\n  }\n  return (n < 0 ? \"-\" : \"\") + \"₹\" + f + \".\" + d;\n}\n\ninterface Props {\n  onViewTransaction: (id: number) => void;\n}\n\nexport function Ledger({ onViewTransaction }: Props) {\n  const [ledger, setLedger] = useState<LedgerEntry[]>([]);\n  const [detail, setDetail] = useState<{ name: string; transactions: any[] } | null>(null);\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    fetch(\"/api/ledger\").then(r => r.json()).then(d => { setLedger(d); setLoading(false); });\n  }, []);\n\n  const viewPerson = async (name: string) => {\n    const res = await fetch(`/api/ledger/${encodeURIComponent(name)}`);\n    const txs = await res.json();\n    setDetail({ name, transactions: txs });\n  };\n\n  if (detail) {\n    const isOverdue = (t: any) =>\n      t.status === \"active\" && t.settlementDeadline && new Date(t.settlementDeadline) < new Date();\n\n    return (\n      <div className=\"ledger-page\">\n        <div className=\"page-header\">\n          <h1>📒 {detail.name}'s Ledger</h1>\n          <button className=\"btn btn-outline\" onClick={() => setDetail(null)}>← Back to Ledger</button>\n        </div>\n        <div className=\"table-wrap\">\n          <table className=\"data-table\">\n            <thead>\n              <tr>\n                <th>Voucher</th>\n                <th>Date</th>\n                <th>Type</th>\n                <th>Amount</th>\n                <th>Purpose</th>\n                <th>Status</th>\n                <th>Deadline</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              {detail.transactions.map((t: any) => (\n                <tr key={t.id} className={isOverdue(t) ? \"row-overdue\" : \"\"}>\n                  <td className=\"mono\">{t.voucherNumber}</td>\n                  <td>{t.date}</td>\n                  <td>\n                    <span className={`badge ${t.type === \"cash_in\" ? \"badge-green\" : \"badge-red\"}`}>\n                      {t.type === \"cash_in\" ? \"↓ In\" : \"↑ Out\"}\n                    </span>\n                  </td>\n                  <td className={t.type === \"cash_in\" ? \"text-green\" : \"text-red\"}>{fmt(t.amount)}</td>\n                  <td>{t.purpose}</td>\n                  <td>\n                    <span className={`badge badge-${t.status === \"draft\" ? \"yellow\" : t.status === \"settled\" ? \"blue\" : \"green\"}`}>\n                      {t.status === \"draft\" ? \"📝 \" : \"\"}{t.status}\n                    </span>\n                  </td>\n                  <td className={isOverdue(t) ? \"text-overdue\" : \"\"}>\n                    {t.settlementDeadline || \"—\"}\n                    {isOverdue(t) && <span className=\"overdue-badge\">OVERDUE</span>}\n                  </td>\n                  <td><button className=\"btn-icon\" onClick={() => onViewTransaction(t.id)}>👁️</button></td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"ledger-page\">\n      <div className=\"page-header\">\n        <h1>📒 Person Ledger</h1>\n      </div>\n\n      {loading ? <div className=\"loading\">Loading...</div> : (\n        <div className=\"table-wrap\">\n          <table className=\"data-table\">\n            <thead>\n              <tr>\n                <th>Person</th>\n                <th>Total In</th>\n                <th>Total Out</th>\n                <th>Balance</th>\n                <th>Pending</th>\n                <th>Last Txn</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              {ledger.map((l, i) => (\n                <tr key={i}>\n                  <td><strong>{l.personName}</strong></td>\n                  <td className=\"text-green\">{fmt(l.totalIn)}</td>\n                  <td className=\"text-red\">{fmt(l.totalOut)}</td>\n                  <td className={l.balance >= 0 ? \"text-green\" : \"text-red\"}>\n                    <strong>{fmt(l.balance)}</strong>\n                  </td>\n                  <td>\n                    {l.pendingCount > 0 ? (\n                      <span className=\"badge badge-yellow\">{l.pendingCount} pending</span>\n                    ) : (\n                      <span className=\"badge badge-gray\">None</span>\n                    )}\n                  </td>\n                  <td>{l.lastTransaction}</td>\n                  <td>\n                    <button className=\"btn btn-outline btn-sm\" onClick={() => viewPerson(l.personName)}>\n                      View Details →\n                    </button>\n                  </td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </div>\n      )}\n    </div>\n  );\n}\n",[],[242,260,286],"a87523d0-5357-11f1-aab8-ee650bb23af1","DataManager.tsx","a875247a-5357-11f1-aab8-ee650bb23af1",11,["D",1779177137862],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useState, useRef } from \"https://esm.sh/react@18.2.0\";\n\nexport function DataManager() {\n  const [status, setStatus] = useState(\"\");\n  const [loading, setLoading] = useState(false);\n  const fileRef = useRef<HTMLInputElement>(null);\n\n  const handleExport = async () => {\n    setLoading(true);\n    setStatus(\"Exporting...\");\n    try {\n      const res = await fetch(\"/api/export\");\n      const data = await res.json();\n      const blob = new Blob([JSON.stringify(data, null, 2)], { type: \"application/json\" });\n      const url = URL.createObjectURL(blob);\n      const a = document.createElement(\"a\");\n      a.href = url;\n      a.download = `cash-memo-backup-${new Date().toISOString().split(\"T\")[0]}.json`;\n      a.click();\n      URL.revokeObjectURL(url);\n      setStatus(`✅ Exported ${data.transactions.length} transactions and ${data.persons.length} persons`);\n    } catch (e) {\n      setStatus(\"❌ Export failed: \" + (e as Error).message);\n    }\n    setLoading(false);\n  };\n\n  const handleImport = async (e: React.ChangeEvent<HTMLInputElement>) => {\n    const file = e.target.files?.[0];\n    if (!file) return;\n\n    setLoading(true);\n    setStatus(\"Importing...\");\n    try {\n      const text = await file.text();\n      const data = JSON.parse(text);\n\n      if (!data.version || !data.transactions) {\n        setStatus(\"❌ Invalid backup file format\");\n        setLoading(false);\n        return;\n      }\n\n      if (!confirm(`This will replace ALL current data with ${data.transactions.length} transactions and ${(data.persons || []).length} persons from backup. Are you sure?`)) {\n        setStatus(\"Import cancelled\");\n        setLoading(false);\n        return;\n      }\n\n      const res = await fetch(\"/api/import\", {\n        method: \"POST\",\n        headers: { \"Content-Type\": \"application/json\" },\n        body: JSON.stringify(data)\n      });\n\n      const result = await res.json();\n      if (result.success) {\n        setStatus(`✅ Successfully imported ${result.imported} transactions. Refresh the page to see changes.`);\n      } else {\n        setStatus(\"❌ Import failed: \" + (result.error || \"Unknown error\"));\n      }\n    } catch (err) {\n      setStatus(\"❌ Import failed: \" + (err as Error).message);\n    }\n    setLoading(false);\n    if (fileRef.current) fileRef.current.value = \"\";\n  };\n\n  const handleExportCSV = async () => {\n    setLoading(true);\n    setStatus(\"Exporting CSV...\");\n    try {\n      const res = await fetch(\"/api/transactions\");\n      const txs = await res.json();\n\n      const headers = [\"Voucher\", \"Type\", \"Status\", \"Date\", \"Time\", \"Person\", \"Father/Company\", \"Mobile\", \"Amount\", \"Amount In Words\", \"Payment Type\", \"Purpose\", \"Given By\", \"Received By\", \"Notes\", \"Settlement Deadline\", \"Category\"];\n      const rows = txs.map((t: any) => [\n        t.voucherNumber, t.type, t.status, t.date, t.time, t.personName,\n        t.fatherOrCompany, t.mobile, t.amount, t.amountInWords,\n        t.paymentType, t.purpose, t.givenBy, t.receivedBy, t.notes,\n        t.settlementDeadline, t.category\n      ].map((v: any) => `\"${String(v || \"\").replace(/\"/g, '\"\"')}\"`).join(\",\"));\n\n      const csv = [headers.join(\",\"), ...rows].join(\"\\n\");\n      const blob = new Blob([csv], { type: \"text/csv\" });\n      const url = URL.createObjectURL(blob);\n      const a = document.createElement(\"a\");\n      a.href = url;\n      a.download = `cash-memo-export-${new Date().toISOString().split(\"T\")[0]}.csv`;\n      a.click();\n      URL.revokeObjectURL(url);\n      setStatus(`✅ Exported ${txs.length} transactions as CSV`);\n    } catch (e) {\n      setStatus(\"❌ CSV export failed\");\n    }\n    setLoading(false);\n  };\n\n  return (\n    <div className=\"data-manager-page\">\n      <div className=\"page-header\">\n        <h1>💾 Data Import / Export</h1>\n      </div>\n\n      <div className=\"data-cards\">\n        <div className=\"data-card\">\n          <h3>📤 Export Data</h3>\n          <p>Download a full backup of all your transactions and person records as JSON. This file can be re-imported later.</p>\n          <button className=\"btn btn-primary\" onClick={handleExport} disabled={loading}>\n            📥 Download JSON Backup\n          </button>\n        </div>\n\n        <div className=\"data-card\">\n          <h3>📊 Export CSV</h3>\n          <p>Download transactions as a CSV file that can be opened in Excel, Google Sheets, or any spreadsheet app.</p>\n          <button className=\"btn btn-success\" onClick={handleExportCSV} disabled={loading}>\n            📊 Download CSV\n          </button>\n        </div>\n\n        <div className=\"data-card\">\n          <h3>📥 Import Data</h3>\n          <p>Restore from a JSON backup file. <strong>Warning:</strong> This will replace all current data.</p>\n          <input\n            type=\"file\"\n            accept=\".json\"\n            onChange={handleImport}\n            ref={fileRef}\n            className=\"form-input\"\n            disabled={loading}\n          />\n        </div>\n      </div>\n\n      {status && (\n        <div className={`status-message ${status.startsWith(\"✅\") ? \"status-success\" : status.startsWith(\"❌\") ? \"status-error\" : \"status-info\"}`}>\n          {status}\n        </div>\n      )}\n    </div>\n  );\n}\n",[],[242,260,294],"4e03cf0a-5357-11f1-9605-ee650bb23af1","Dashboard.tsx","4e03cfd2-5357-11f1-9605-ee650bb23af1",6,["D",1779176986120],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport type { DashboardStats, Transaction } from \"../../shared/types.ts\";\n\nfunction formatCurrency(n: number) {\n  const abs = Math.abs(n);\n  const [intPart, dec] = abs.toFixed(2).split(\".\");\n  const digits = intPart.split(\"\").reverse();\n  let f = \"\";\n  for (let i = 0; i < digits.length; i++) {\n    if (i === 3 || (i > 3 && (i - 3) % 2 === 0)) f = \",\" + f;\n    f = digits[i] + f;\n  }\n  return (n < 0 ? \"-\" : \"\") + \"₹\" + f + \".\" + dec;\n}\n\ninterface Props {\n  onNavigate: (page: string) => void;\n}\n\nexport function Dashboard({ onNavigate }: Props) {\n  const [stats, setStats] = useState<DashboardStats | null>(null);\n  const [recent, setRecent] = useState<Transaction[]>([]);\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => {\n    Promise.all([\n      fetch(\"/api/stats\").then(r => r.json()),\n      fetch(\"/api/transactions\").then(r => r.json())\n    ]).then(([s, t]) => {\n      setStats(s);\n      setRecent(t.slice(0, 8));\n      setLoading(false);\n    });\n  }, []);\n\n  if (loading || !stats) return <div className=\"loading\">Loading dashboard...</div>;\n\n  const isOverdue = (t: Transaction) =>\n    t.status === \"active\" && t.settlementDeadline && new Date(t.settlementDeadline) < new Date();\n\n  return (\n    <div className=\"dashboard\">\n      <div className=\"page-header\">\n        <h1>📊 Dashboard</h1>\n        <div className=\"header-actions\">\n          <button className=\"btn btn-success\" onClick={() => onNavigate(\"new-cash-in\")}>+ Cash In</button>\n          <button className=\"btn btn-danger\" onClick={() => onNavigate(\"new-cash-out\")}>+ Cash Out</button>\n        </div>\n      </div>\n\n      <div className=\"stats-grid\">\n        <div className=\"stat-card stat-green\">\n          <div className=\"stat-icon\">💰</div>\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Total Cash In</span>\n            <span className=\"stat-value\">{formatCurrency(stats.totalCashIn)}</span>\n          </div>\n        </div>\n        <div className=\"stat-card stat-red\">\n          <div className=\"stat-icon\">💸</div>\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Total Cash Out</span>\n            <span className=\"stat-value\">{formatCurrency(stats.totalCashOut)}</span>\n          </div>\n        </div>\n        <div className={`stat-card ${stats.netBalance >= 0 ? \"stat-blue\" : \"stat-orange\"}`}>\n          <div className=\"stat-icon\">📈</div>\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Net Balance</span>\n            <span className=\"stat-value\">{formatCurrency(stats.netBalance)}</span>\n          </div>\n        </div>\n        <div className={`stat-card ${stats.overdueCount > 0 ? \"stat-overdue\" : \"stat-gray\"}`}>\n          <div className=\"stat-icon\">⚠️</div>\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Overdue</span>\n            <span className=\"stat-value\">{stats.overdueCount}</span>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"stats-grid stats-grid-small\">\n        <div className=\"stat-card stat-green-light\">\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Today In</span>\n            <span className=\"stat-value-sm\">{formatCurrency(stats.todayIn)}</span>\n          </div>\n        </div>\n        <div className=\"stat-card stat-red-light\">\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Today Out</span>\n            <span className=\"stat-value-sm\">{formatCurrency(stats.todayOut)}</span>\n          </div>\n        </div>\n        <div className=\"stat-card stat-green-light\">\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Month In</span>\n            <span className=\"stat-value-sm\">{formatCurrency(stats.monthIn)}</span>\n          </div>\n        </div>\n        <div className=\"stat-card stat-red-light\">\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Month Out</span>\n            <span className=\"stat-value-sm\">{formatCurrency(stats.monthOut)}</span>\n          </div>\n        </div>\n        <div className=\"stat-card stat-yellow\">\n          <div className=\"stat-info\">\n            <span className=\"stat-label\">Pending Settlements</span>\n            <span className=\"stat-value-sm\">{stats.pendingSettlements}</span>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"section\">\n        <div className=\"section-header\">\n          <h2>Recent Transactions</h2>\n          <button className=\"btn btn-outline btn-sm\" onClick={() => onNavigate(\"transactions\")}>View All →</button>\n        </div>\n        <div className=\"table-wrap\">\n          <table className=\"data-table\">\n            <thead>\n              <tr>\n                <th>Voucher</th>\n                <th>Date</th>\n                <th>Person</th>\n                <th>Type</th>\n                <th>Amount</th>\n                <th>Status</th>\n                <th>Deadline</th>\n              </tr>\n            </thead>\n            <tbody>\n              {recent.map((t: any) => (\n                <tr key={t.id} className={isOverdue(t) ? \"row-overdue\" : \"\"}>\n                  <td className=\"mono\">{t.voucherNumber}</td>\n                  <td>{t.date}</td>\n                  <td>{t.personName}</td>\n                  <td>\n                    <span className={`badge ${t.type === \"cash_in\" ? \"badge-green\" : \"badge-red\"}`}>\n                      {t.type === \"cash_in\" ? \"↓ In\" : \"↑ Out\"}\n                    </span>\n                  </td>\n                  <td className={t.type === \"cash_in\" ? \"text-green\" : \"text-red\"}>\n                    {formatCurrency(t.amount)}\n                  </td>\n                  <td>\n                    <span className={`badge badge-${t.status === \"draft\" ? \"yellow\" : t.status === \"settled\" ? \"blue\" : t.status === \"active\" ? \"green\" : \"gray\"}`}>\n                      {t.status}\n                    </span>\n                  </td>\n                  <td className={isOverdue(t) ? \"text-overdue\" : \"\"}>\n                    {t.settlementDeadline ? (\n                      <>\n                        {t.settlementDeadline}\n                        {isOverdue(t) && <span className=\"overdue-badge\">OVERDUE</span>}\n                      </>\n                    ) : \"—\"}\n                  </td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </div>\n      </div>\n    </div>\n  );\n}\n",[],[242,260,302],"40720708-5357-11f1-a1cf-ee650bb23af1",["D",1779176963357],[191,192,193,194,195,196,197],[242,260],"40720258-5357-11f1-a1cf-ee650bb23af1",["D",1779176963357],[190,198,199],[242],["D",1779176907293],[],[18,66],["D",1779176947540],[],[18,81],["D",1779176907293],[187,188],[18],["D",1779176842034],{"_11":12,"_133":72},{"_11":12,"_129":72,"_71":72,"_31":70,"_130":131,"_132":30},{"_40":120,"_13":16,"_34":37,"_121":85,"_122":-5,"_123":-5,"_124":-5,"_125":-5,"_126":-5,"_127":14,"_128":12},"ctx",{"_54":-5,"_152":363,"_364":365,"_366":367,"_368":30,"_369":30,"_370":30,"_371":24,"_372":-5,"_373":-7,"_374":-7,"_375":26,"_376":30,"_377":30,"_378":-5,"_379":30,"_380":30,"_381":30,"_382":-5},"ENV",{"_334":335,"_336":337,"_338":16,"_339":340,"_341":342,"_343":344,"_345":346,"_347":348,"_349":350,"_351":352,"_353":354,"_355":356,"_357":358,"_359":360,"_361":362},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]
</article></body></html>

History · backend