@burdenoff/microfe-housingvista 2026.510.105

package/dist/housingvista/pages/finance/HomeLoansPage.js

@@ -0,0 +1,306 @@
+import { cn as e, formatCurrency as t } from "../../utils/helpers.js";
+import { PageLayout as n } from "../../components/PageLayout.js";
+import { EmptyState as r } from "../../components/EmptyState.js";
+import "../../components/index.js";
+import { useHomeLoans as i } from "../../hooks/index.js";
+import { useMemo as a, useState as o } from "react";
+import { ArrowRight as s, Building2 as c, Calculator as l, CheckCircle as u, Gift as d, Star as f } from "lucide-react";
+import { useNavigate as p } from "react-router-dom";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+//#region src/housingvista/pages/finance/HomeLoansPage.tsx
+function g(e, t, n) {
+	if (e <= 0 || t <= 0 || n <= 0) return 0;
+	let r = t / 12 / 100, i = n * 12, a = e * r * (1 + r) ** +i / ((1 + r) ** +i - 1);
+	return Math.round(a);
+}
+function _({ rating: t }) {
+	return /* @__PURE__ */ m("div", {
+		className: "flex items-center gap-0.5",
+		children: Array.from({ length: 5 }).map((n, r) => /* @__PURE__ */ m(f, { className: e("h-3 w-3", r < Math.floor(t) ? "fill-amber-400 text-amber-400" : "text-muted-foreground/30") }, r))
+	});
+}
+function v({ loan: n }) {
+	let r = p();
+	return /* @__PURE__ */ h("div", {
+		className: "rounded-lg border border-border bg-card p-5 shadow-sm transition-shadow hover:shadow-md",
+		children: [
+			/* @__PURE__ */ h("div", {
+				className: "mb-4 flex items-start justify-between gap-3",
+				children: [/* @__PURE__ */ h("div", {
+					className: "flex items-center gap-3",
+					children: [/* @__PURE__ */ m("div", {
+						className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-muted",
+						children: /* @__PURE__ */ m(c, { className: "h-6 w-6 text-muted-foreground" })
+					}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h3", {
+						className: "text-sm font-semibold text-foreground",
+						children: n.bankName
+					}), /* @__PURE__ */ h("div", {
+						className: "flex items-center gap-1.5 mt-0.5",
+						children: [/* @__PURE__ */ m(_, { rating: n.rating }), /* @__PURE__ */ m("span", {
+							className: "text-xs text-muted-foreground",
+							children: n.rating
+						})]
+					})] })]
+				}), n.specialOffer && /* @__PURE__ */ h("span", {
+					className: "inline-flex items-center gap-1 rounded-full bg-amber-100 px-2 py-0.5 text-xs font-medium text-amber-700 dark:bg-amber-900/30 dark:text-amber-400",
+					children: [/* @__PURE__ */ m(d, { className: "h-3 w-3" }), "Offer"]
+				})]
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "mb-4 grid grid-cols-2 gap-3",
+				children: [
+					/* @__PURE__ */ h("div", {
+						className: "rounded-md bg-muted/50 p-2.5",
+						children: [/* @__PURE__ */ m("p", {
+							className: "text-xs text-muted-foreground",
+							children: "Interest Rate"
+						}), /* @__PURE__ */ h("p", {
+							className: "text-lg font-bold text-foreground",
+							children: [n.interestRate, "%"]
+						})]
+					}),
+					/* @__PURE__ */ h("div", {
+						className: "rounded-md bg-muted/50 p-2.5",
+						children: [/* @__PURE__ */ m("p", {
+							className: "text-xs text-muted-foreground",
+							children: "EMI / Lakh"
+						}), /* @__PURE__ */ h("p", {
+							className: "text-lg font-bold text-foreground",
+							children: ["$", n.emiPerLakh]
+						})]
+					}),
+					/* @__PURE__ */ h("div", {
+						className: "rounded-md bg-muted/50 p-2.5",
+						children: [/* @__PURE__ */ m("p", {
+							className: "text-xs text-muted-foreground",
+							children: "Max Tenure"
+						}), /* @__PURE__ */ h("p", {
+							className: "text-sm font-semibold text-foreground",
+							children: [n.maxTenure, " years"]
+						})]
+					}),
+					/* @__PURE__ */ h("div", {
+						className: "rounded-md bg-muted/50 p-2.5",
+						children: [/* @__PURE__ */ m("p", {
+							className: "text-xs text-muted-foreground",
+							children: "Max Amount"
+						}), /* @__PURE__ */ m("p", {
+							className: "text-sm font-semibold text-foreground",
+							children: t(n.maxAmount)
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "mb-3 flex items-center justify-between text-xs",
+				children: [/* @__PURE__ */ m("span", {
+					className: "text-muted-foreground",
+					children: "Processing Fee"
+				}), /* @__PURE__ */ m("span", {
+					className: "font-medium text-foreground",
+					children: n.processingFee
+				})]
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "mb-3 flex items-center justify-between text-xs",
+				children: [/* @__PURE__ */ m("span", {
+					className: "text-muted-foreground",
+					children: "Prepayment Charges"
+				}), /* @__PURE__ */ m("span", {
+					className: e("font-medium", n.prepaymentCharges === "None" ? "text-emerald-600 dark:text-emerald-400" : "text-foreground"),
+					children: n.prepaymentCharges
+				})]
+			}),
+			n.specialOffer && /* @__PURE__ */ m("div", {
+				className: "mb-3 rounded-md bg-amber-50 p-2.5 text-xs text-amber-800 dark:bg-amber-900/20 dark:text-amber-300",
+				children: n.specialOffer
+			}),
+			/* @__PURE__ */ m("div", {
+				className: "mb-4 space-y-1.5",
+				children: n.features.map((e, t) => /* @__PURE__ */ h("div", {
+					className: "flex items-center gap-1.5 text-xs text-muted-foreground",
+					children: [/* @__PURE__ */ m(u, { className: "h-3 w-3 shrink-0 text-emerald-500" }), e]
+				}, t))
+			}),
+			/* @__PURE__ */ h("button", {
+				onClick: () => r(`/home-loans/${n.id}/apply`),
+				className: "flex w-full items-center justify-center gap-1.5 rounded-md bg-foreground px-4 py-2.5 text-xs font-medium text-background transition-colors hover:bg-foreground/90",
+				children: ["Apply Now", /* @__PURE__ */ m(s, { className: "h-3.5 w-3.5" })]
+			})
+		]
+	});
+}
+function y() {
+	p();
+	let { data: e } = i(), [s, u] = o(5e5), [d, f] = o(20), [_, y] = o(6.75), b = a(() => g(s, _, d), [
+		s,
+		_,
+		d
+	]), x = b * d * 12, S = x - s;
+	return /* @__PURE__ */ h(n, {
+		title: "Home Loans",
+		description: "Compare rates, calculate EMI, and apply for home loans",
+		children: [/* @__PURE__ */ h("div", {
+			className: "rounded-lg border border-border bg-card p-5 shadow-sm",
+			children: [/* @__PURE__ */ h("div", {
+				className: "mb-4 flex items-center gap-2",
+				children: [/* @__PURE__ */ m(l, { className: "h-5 w-5 text-muted-foreground" }), /* @__PURE__ */ m("h2", {
+					className: "text-lg font-semibold text-foreground",
+					children: "EMI Calculator"
+				})]
+			}), /* @__PURE__ */ h("div", {
+				className: "grid gap-6 md:grid-cols-2",
+				children: [/* @__PURE__ */ h("div", {
+					className: "space-y-5",
+					children: [
+						/* @__PURE__ */ h("div", { children: [
+							/* @__PURE__ */ h("div", {
+								className: "flex items-center justify-between mb-2",
+								children: [/* @__PURE__ */ m("label", {
+									className: "text-sm font-medium text-foreground",
+									children: "Loan Amount"
+								}), /* @__PURE__ */ m("span", {
+									className: "text-sm font-semibold text-foreground",
+									children: t(s)
+								})]
+							}),
+							/* @__PURE__ */ m("input", {
+								type: "range",
+								min: 5e4,
+								max: 5e6,
+								step: 1e4,
+								value: s,
+								onChange: (e) => u(Number(e.target.value)),
+								className: "w-full accent-foreground"
+							}),
+							/* @__PURE__ */ h("div", {
+								className: "flex justify-between text-xs text-muted-foreground mt-1",
+								children: [/* @__PURE__ */ m("span", { children: "$50K" }), /* @__PURE__ */ m("span", { children: "$5M" })]
+							})
+						] }),
+						/* @__PURE__ */ h("div", { children: [
+							/* @__PURE__ */ h("div", {
+								className: "flex items-center justify-between mb-2",
+								children: [/* @__PURE__ */ m("label", {
+									className: "text-sm font-medium text-foreground",
+									children: "Tenure (years)"
+								}), /* @__PURE__ */ h("span", {
+									className: "text-sm font-semibold text-foreground",
+									children: [d, " years"]
+								})]
+							}),
+							/* @__PURE__ */ m("input", {
+								type: "range",
+								min: 1,
+								max: 30,
+								step: 1,
+								value: d,
+								onChange: (e) => f(Number(e.target.value)),
+								className: "w-full accent-foreground"
+							}),
+							/* @__PURE__ */ h("div", {
+								className: "flex justify-between text-xs text-muted-foreground mt-1",
+								children: [/* @__PURE__ */ m("span", { children: "1 yr" }), /* @__PURE__ */ m("span", { children: "30 yrs" })]
+							})
+						] }),
+						/* @__PURE__ */ h("div", { children: [
+							/* @__PURE__ */ h("div", {
+								className: "flex items-center justify-between mb-2",
+								children: [/* @__PURE__ */ m("label", {
+									className: "text-sm font-medium text-foreground",
+									children: "Interest Rate (%)"
+								}), /* @__PURE__ */ h("span", {
+									className: "text-sm font-semibold text-foreground",
+									children: [_, "%"]
+								})]
+							}),
+							/* @__PURE__ */ m("input", {
+								type: "range",
+								min: 3,
+								max: 15,
+								step: .05,
+								value: _,
+								onChange: (e) => y(Number(e.target.value)),
+								className: "w-full accent-foreground"
+							}),
+							/* @__PURE__ */ h("div", {
+								className: "flex justify-between text-xs text-muted-foreground mt-1",
+								children: [/* @__PURE__ */ m("span", { children: "3%" }), /* @__PURE__ */ m("span", { children: "15%" })]
+							})
+						] })
+					]
+				}), /* @__PURE__ */ h("div", {
+					className: "flex flex-col items-center justify-center rounded-lg bg-muted/50 p-6",
+					children: [
+						/* @__PURE__ */ m("p", {
+							className: "text-sm text-muted-foreground",
+							children: "Monthly EMI"
+						}),
+						/* @__PURE__ */ m("p", {
+							className: "my-2 text-4xl font-bold text-foreground",
+							children: t(b)
+						}),
+						/* @__PURE__ */ h("div", {
+							className: "mt-4 grid w-full grid-cols-2 gap-4",
+							children: [/* @__PURE__ */ h("div", {
+								className: "text-center",
+								children: [/* @__PURE__ */ m("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Total Payment"
+								}), /* @__PURE__ */ m("p", {
+									className: "text-sm font-semibold text-foreground",
+									children: t(x)
+								})]
+							}), /* @__PURE__ */ h("div", {
+								className: "text-center",
+								children: [/* @__PURE__ */ m("p", {
+									className: "text-xs text-muted-foreground",
+									children: "Total Interest"
+								}), /* @__PURE__ */ m("p", {
+									className: "text-sm font-semibold text-red-600 dark:text-red-400",
+									children: t(S)
+								})]
+							})]
+						}),
+						/* @__PURE__ */ h("div", {
+							className: "mt-4 w-full",
+							children: [/* @__PURE__ */ h("div", {
+								className: "flex h-3 w-full overflow-hidden rounded-full",
+								children: [/* @__PURE__ */ m("div", {
+									className: "bg-foreground transition-all",
+									style: { width: `${s / x * 100}%` }
+								}), /* @__PURE__ */ m("div", {
+									className: "bg-red-400 dark:bg-red-600 transition-all",
+									style: { width: `${S / x * 100}%` }
+								})]
+							}), /* @__PURE__ */ h("div", {
+								className: "mt-1.5 flex justify-between text-xs text-muted-foreground",
+								children: [/* @__PURE__ */ h("span", {
+									className: "flex items-center gap-1",
+									children: [/* @__PURE__ */ m("span", { className: "h-2 w-2 rounded-full bg-foreground" }), " Principal"]
+								}), /* @__PURE__ */ h("span", {
+									className: "flex items-center gap-1",
+									children: [/* @__PURE__ */ m("span", { className: "h-2 w-2 rounded-full bg-red-400 dark:bg-red-600" }), " Interest"]
+								})]
+							})]
+						})
+					]
+				})]
+			})]
+		}), /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m("h2", {
+			className: "mb-4 text-lg font-semibold text-foreground",
+			children: "Available Loan Offers"
+		}), e.length > 0 ? /* @__PURE__ */ m("div", {
+			className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3",
+			children: e.map((e) => /* @__PURE__ */ m(v, { loan: e }, e.id))
+		}) : /* @__PURE__ */ m(r, {
+			icon: /* @__PURE__ */ m(c, { className: "h-12 w-12" }),
+			title: "No loan offers available",
+			description: "Check back later for new loan offers from our partner banks."
+		})] })]
+	});
+}
+//#endregion
+export { y as HomeLoansPage };
+
+//# sourceMappingURL=HomeLoansPage.js.map

package/dist/housingvista/pages/finance/HomeLoansPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HomeLoansPage.js","names":[],"sources":["../../../../src/housingvista/pages/finance/HomeLoansPage.tsx"],"sourcesContent":["import { useState, useMemo } from 'react';\nimport { useNavigate } from 'react-router-dom';\nimport {\n  Building2,\n  Calculator,\n  Star,\n  CheckCircle,\n  TrendingDown,\n  Percent,\n  DollarSign,\n  Clock,\n  ArrowRight,\n  Gift,\n} from 'lucide-react';\nimport { PageLayout, EmptyState } from '../../components';\nimport { useHomeLoans } from '../../hooks';\nimport { cn, formatCurrency, formatNumber } from '../../utils/helpers';\nimport type { HomeLoan } from '../../types';\n\nfunction calculateEMI(principal: number, annualRate: number, tenureYears: number): number {\n  if (principal <= 0 || annualRate <= 0 || tenureYears <= 0) return 0;\n  const monthlyRate = annualRate / 12 / 100;\n  const months = tenureYears * 12;\n  const emi = (principal * monthlyRate * Math.pow(1 + monthlyRate, months)) / (Math.pow(1 + monthlyRate, months) - 1);\n  return Math.round(emi);\n}\n\nfunction RatingStars({ rating }: { rating: number }) {\n  return (\n    <div className=\"flex items-center gap-0.5\">\n      {Array.from({ length: 5 }).map((_, i) => (\n        <Star\n          key={i}\n          className={cn(\n            'h-3 w-3',\n            i < Math.floor(rating) ? 'fill-amber-400 text-amber-400' : 'text-muted-foreground/30'\n          )}\n        />\n      ))}\n    </div>\n  );\n}\n\nfunction LoanCard({ loan }: { loan: HomeLoan }) {\n  const navigate = useNavigate();\n\n  return (\n    <div className=\"rounded-lg border border-border bg-card p-5 shadow-sm transition-shadow hover:shadow-md\">\n      {/* Header */}\n      <div className=\"mb-4 flex items-start justify-between gap-3\">\n        <div className=\"flex items-center gap-3\">\n          <div className=\"flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-muted\">\n            <Building2 className=\"h-6 w-6 text-muted-foreground\" />\n          </div>\n          <div>\n            <h3 className=\"text-sm font-semibold text-foreground\">{loan.bankName}</h3>\n            <div className=\"flex items-center gap-1.5 mt-0.5\">\n              <RatingStars rating={loan.rating} />\n              <span className=\"text-xs text-muted-foreground\">{loan.rating}</span>\n            </div>\n          </div>\n        </div>\n        {loan.specialOffer && (\n          <span className=\"inline-flex items-center gap-1 rounded-full bg-amber-100 px-2 py-0.5 text-xs font-medium text-amber-700 dark:bg-amber-900/30 dark:text-amber-400\">\n            <Gift className=\"h-3 w-3\" />\n            Offer\n          </span>\n        )}\n      </div>\n\n      {/* Key Stats Grid */}\n      <div className=\"mb-4 grid grid-cols-2 gap-3\">\n        <div className=\"rounded-md bg-muted/50 p-2.5\">\n          <p className=\"text-xs text-muted-foreground\">Interest Rate</p>\n          <p className=\"text-lg font-bold text-foreground\">{loan.interestRate}%</p>\n        </div>\n        <div className=\"rounded-md bg-muted/50 p-2.5\">\n          <p className=\"text-xs text-muted-foreground\">EMI / Lakh</p>\n          <p className=\"text-lg font-bold text-foreground\">${loan.emiPerLakh}</p>\n        </div>\n        <div className=\"rounded-md bg-muted/50 p-2.5\">\n          <p className=\"text-xs text-muted-foreground\">Max Tenure</p>\n          <p className=\"text-sm font-semibold text-foreground\">{loan.maxTenure} years</p>\n        </div>\n        <div className=\"rounded-md bg-muted/50 p-2.5\">\n          <p className=\"text-xs text-muted-foreground\">Max Amount</p>\n          <p className=\"text-sm font-semibold text-foreground\">{formatCurrency(loan.maxAmount)}</p>\n        </div>\n      </div>\n\n      {/* Processing Fee */}\n      <div className=\"mb-3 flex items-center justify-between text-xs\">\n        <span className=\"text-muted-foreground\">Processing Fee</span>\n        <span className=\"font-medium text-foreground\">{loan.processingFee}</span>\n      </div>\n\n      {/* Prepayment Charges */}\n      <div className=\"mb-3 flex items-center justify-between text-xs\">\n        <span className=\"text-muted-foreground\">Prepayment Charges</span>\n        <span\n          className={cn(\n            'font-medium',\n            loan.prepaymentCharges === 'None' ? 'text-emerald-600 dark:text-emerald-400' : 'text-foreground'\n          )}\n        >\n          {loan.prepaymentCharges}\n        </span>\n      </div>\n\n      {/* Special Offer */}\n      {loan.specialOffer && (\n        <div className=\"mb-3 rounded-md bg-amber-50 p-2.5 text-xs text-amber-800 dark:bg-amber-900/20 dark:text-amber-300\">\n          {loan.specialOffer}\n        </div>\n      )}\n\n      {/* Features */}\n      <div className=\"mb-4 space-y-1.5\">\n        {loan.features.map((feature, i) => (\n          <div key={i} className=\"flex items-center gap-1.5 text-xs text-muted-foreground\">\n            <CheckCircle className=\"h-3 w-3 shrink-0 text-emerald-500\" />\n            {feature}\n          </div>\n        ))}\n      </div>\n\n      {/* Apply Button */}\n      <button\n        onClick={() => navigate(`/home-loans/${loan.id}/apply`)}\n        className=\"flex w-full items-center justify-center gap-1.5 rounded-md bg-foreground px-4 py-2.5 text-xs font-medium text-background transition-colors hover:bg-foreground/90\"\n      >\n        Apply Now\n        <ArrowRight className=\"h-3.5 w-3.5\" />\n      </button>\n    </div>\n  );\n}\n\nexport function HomeLoansPage() {\n  const navigate = useNavigate();\n  const { data: loans } = useHomeLoans();\n\n  // EMI Calculator state\n  const [loanAmount, setLoanAmount] = useState(500000);\n  const [tenure, setTenure] = useState(20);\n  const [interestRate, setInterestRate] = useState(6.75);\n\n  const emi = useMemo(() => calculateEMI(loanAmount, interestRate, tenure), [loanAmount, interestRate, tenure]);\n  const totalPayment = emi * tenure * 12;\n  const totalInterest = totalPayment - loanAmount;\n\n  return (\n    <PageLayout title=\"Home Loans\" description=\"Compare rates, calculate EMI, and apply for home loans\">\n      {/* EMI Calculator */}\n      <div className=\"rounded-lg border border-border bg-card p-5 shadow-sm\">\n        <div className=\"mb-4 flex items-center gap-2\">\n          <Calculator className=\"h-5 w-5 text-muted-foreground\" />\n          <h2 className=\"text-lg font-semibold text-foreground\">EMI Calculator</h2>\n        </div>\n\n        <div className=\"grid gap-6 md:grid-cols-2\">\n          {/* Inputs */}\n          <div className=\"space-y-5\">\n            {/* Loan Amount */}\n            <div>\n              <div className=\"flex items-center justify-between mb-2\">\n                <label className=\"text-sm font-medium text-foreground\">Loan Amount</label>\n                <span className=\"text-sm font-semibold text-foreground\">{formatCurrency(loanAmount)}</span>\n              </div>\n              <input\n                type=\"range\"\n                min={50000}\n                max={5000000}\n                step={10000}\n                value={loanAmount}\n                onChange={(e) => setLoanAmount(Number(e.target.value))}\n                className=\"w-full accent-foreground\"\n              />\n              <div className=\"flex justify-between text-xs text-muted-foreground mt-1\">\n                <span>$50K</span>\n                <span>$5M</span>\n              </div>\n            </div>\n\n            {/* Tenure */}\n            <div>\n              <div className=\"flex items-center justify-between mb-2\">\n                <label className=\"text-sm font-medium text-foreground\">Tenure (years)</label>\n                <span className=\"text-sm font-semibold text-foreground\">{tenure} years</span>\n              </div>\n              <input\n                type=\"range\"\n                min={1}\n                max={30}\n                step={1}\n                value={tenure}\n                onChange={(e) => setTenure(Number(e.target.value))}\n                className=\"w-full accent-foreground\"\n              />\n              <div className=\"flex justify-between text-xs text-muted-foreground mt-1\">\n                <span>1 yr</span>\n                <span>30 yrs</span>\n              </div>\n            </div>\n\n            {/* Interest Rate */}\n            <div>\n              <div className=\"flex items-center justify-between mb-2\">\n                <label className=\"text-sm font-medium text-foreground\">Interest Rate (%)</label>\n                <span className=\"text-sm font-semibold text-foreground\">{interestRate}%</span>\n              </div>\n              <input\n                type=\"range\"\n                min={3}\n                max={15}\n                step={0.05}\n                value={interestRate}\n                onChange={(e) => setInterestRate(Number(e.target.value))}\n                className=\"w-full accent-foreground\"\n              />\n              <div className=\"flex justify-between text-xs text-muted-foreground mt-1\">\n                <span>3%</span>\n                <span>15%</span>\n              </div>\n            </div>\n          </div>\n\n          {/* Results */}\n          <div className=\"flex flex-col items-center justify-center rounded-lg bg-muted/50 p-6\">\n            <p className=\"text-sm text-muted-foreground\">Monthly EMI</p>\n            <p className=\"my-2 text-4xl font-bold text-foreground\">{formatCurrency(emi)}</p>\n            <div className=\"mt-4 grid w-full grid-cols-2 gap-4\">\n              <div className=\"text-center\">\n                <p className=\"text-xs text-muted-foreground\">Total Payment</p>\n                <p className=\"text-sm font-semibold text-foreground\">{formatCurrency(totalPayment)}</p>\n              </div>\n              <div className=\"text-center\">\n                <p className=\"text-xs text-muted-foreground\">Total Interest</p>\n                <p className=\"text-sm font-semibold text-red-600 dark:text-red-400\">{formatCurrency(totalInterest)}</p>\n              </div>\n            </div>\n            {/* Visual breakdown bar */}\n            <div className=\"mt-4 w-full\">\n              <div className=\"flex h-3 w-full overflow-hidden rounded-full\">\n                <div\n                  className=\"bg-foreground transition-all\"\n                  style={{ width: `${(loanAmount / totalPayment) * 100}%` }}\n                />\n                <div\n                  className=\"bg-red-400 dark:bg-red-600 transition-all\"\n                  style={{ width: `${(totalInterest / totalPayment) * 100}%` }}\n                />\n              </div>\n              <div className=\"mt-1.5 flex justify-between text-xs text-muted-foreground\">\n                <span className=\"flex items-center gap-1\">\n                  <span className=\"h-2 w-2 rounded-full bg-foreground\" /> Principal\n                </span>\n                <span className=\"flex items-center gap-1\">\n                  <span className=\"h-2 w-2 rounded-full bg-red-400 dark:bg-red-600\" /> Interest\n                </span>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      {/* Loan Offers */}\n      <div>\n        <h2 className=\"mb-4 text-lg font-semibold text-foreground\">Available Loan Offers</h2>\n        {loans.length > 0 ? (\n          <div className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n            {loans.map((loan) => (\n              <LoanCard key={loan.id} loan={loan} />\n            ))}\n          </div>\n        ) : (\n          <EmptyState\n            icon={<Building2 className=\"h-12 w-12\" />}\n            title=\"No loan offers available\"\n            description=\"Check back later for new loan offers from our partner banks.\"\n          />\n        )}\n      </div>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/housingvista/pages/investments/InvestmentDetailPage.d.ts

@@ -0,0 +1,2 @@
+export declare function InvestmentDetailPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=InvestmentDetailPage.d.ts.map

package/dist/housingvista/pages/investments/InvestmentDetailPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InvestmentDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/housingvista/pages/investments/InvestmentDetailPage.tsx"],"names":[],"mappings":"AAmDA,wBAAgB,oBAAoB,4CA2VnC"}