npm - @burdenoff/microfe-housingvista - Versions diffs - 2026.709.2 → 2026.709.3 - Mend

@burdenoff/microfe-housingvista 2026.709.2 → 2026.709.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (83) hide show

package/dist/housingvista/pages/finance/HomeLoanDetailPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HomeLoanDetailPage.js","names":[],"sources":["../../../../src/housingvista/pages/finance/HomeLoanDetailPage.tsx"],"sourcesContent":["/*\n HousingVista Home Loan Detail / Apply Page\n * Single loan offer backed by `housingvistaHomeLoanOffer(id)` — full terms plus\n * a live EMI summary for the offer's headline rate.\n \n \"Apply\" opens the real `ContactOwnerDialog` — a persisted conversation with\n * the bank. No fabricated approval; the EMI calculator stays for modelling.\n * @module housingvista\n /\n\nimport { useMemo, useState } from 'react';\nimport { useNavigate, useParams, useLocation } from 'react-router-dom';\nimport {\n ArrowLeft,\n Building2,\n Star,\n CheckCircle,\n Gift,\n Calculator,\n Percent,\n Wallet,\n CalendarClock,\n} from 'lucide-react';\nimport { Button, EmphasisPanel, GlassCard, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { Breadcrumbs, StatusBadge, EmptyState, LoadingSkeleton, ContactOwnerDialog } from '../../components';\nimport type { BreadcrumbItem } from '../../components';\nimport { useHomeLoanOffer } from '../../hooks';\nimport { cn, formatCurrency, formatINRCompact } from '../../utils/helpers';\n\n/* Branded emerald range slider (matches the mock's green sliders). /\nconst SLIDER_CLASS = 'w-full accent-[var(--color-action-primary-bg)]';\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 text-status-warning-text\">\n {Array.from({ length: 5 }).map((_, i) => (\n <Star\n key={i}\n className={cn('h-4 w-4', i < Math.floor(rating) ? 'fill-current' : 'fill-none text-text-secondary/30')}\n />\n ))}\n </div>\n );\n}\n\nexport function HomeLoanDetailPage() {\n const { id } = useParams<{ id: string }>();\n const navigate = useNavigate();\n const location = useLocation();\n const { data: loan, loading } = useHomeLoanOffer(id);\n\n // Model a representative loan against the offer's headline rate so the borrower\n // can see the real monthly cost before enquiring.\n const [amount, setAmount] = useState(500000);\n const [tenure, setTenure] = useState(20);\n const [contactOpen, setContactOpen] = useState(false);\n\n const rate = loan?.interestRate ?? 0;\n const emi = useMemo(() => calculateEMI(amount, rate, tenure), [amount, rate, tenure]);\n const totalPayment = emi * tenure * 12;\n const totalInterest = totalPayment - amount;\n\n if (loading) {\n return (\n <div className=\"p-6\">\n <LoadingSkeleton variant=\"detail\" />\n </div>\n );\n }\n\n if (!loan) {\n return (\n <div className=\"p-6\">\n <EmptyState\n illustration=\"empty-data\"\n icon={<Building2 className=\"h-12 w-12\" />}\n title=\"Loan Offer Not Found\"\n description=\"The loan offer you're looking for doesn't exist or is no longer available.\"\n action={\n <button\n onClick={() => navigate('../home-loans')}\n className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover\"\n >\n <ArrowLeft className=\"h-4 w-4\" />\n Back to Home Loans\n </button>\n }\n />\n </div>\n );\n }\n\n const features = loan.features ?? [];\n const breadcrumbs: BreadcrumbItem[] = [{ label: 'Home Loans', href: '../' }, { label: loan.bankName }];\n\n return (\n <div className=\"flex flex-col gap-6 p-6\">\n <Breadcrumbs items={breadcrumbs} />\n\n {/* Header /}\n <div className=\"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between\">\n <div className=\"flex items-start gap-4\">\n <div className=\"flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-bg-sunken text-text-secondary\">\n <Building2 className=\"h-6 w-6\" />\n </div>\n <div>\n <button\n onClick={() => navigate('../home-loans')}\n className=\"mb-2 inline-flex items-center gap-2 rounded-md px-2 py-1 text-sm text-text-secondary transition-colors hover:bg-bg-sunken hover:text-text-primary\"\n >\n <ArrowLeft className=\"h-4 w-4\" />\n Back to Home Loans\n </button>\n <h1 className=\"text-2xl font-semibold text-text-primary\">{loan.bankName}</h1>\n <div className=\"mt-2 flex flex-wrap items-center gap-2\">\n {loan.rating != null && (\n <span className=\"inline-flex items-center gap-1.5\">\n <RatingStars rating={loan.rating} />\n <span className=\"text-sm text-text-secondary\">{loan.rating}</span>\n </span>\n )}\n {loan.specialOffer && <StatusBadge label=\"Special Offer\" variant=\"warning\" />}\n </div>\n </div>\n </div>\n <Button type=\"button\" variant=\"default\" onClick={() => setContactOpen(true)}>\n Apply Now\n </Button>\n </div>\n\n <PagePurpose className=\"max-w-3xl\">\n The full terms of this offer with a live EMI estimate at the bank's headline rate. Model your loan amount and\n tenure to see the real monthly cost, then apply to connect with {loan.bankName} through Messages.\n </PagePurpose>\n\n {loan.specialOffer && (\n <div className=\"flex items-center gap-2 rounded-lg bg-status-warning-bg-subtle p-3 text-sm text-status-warning-text\">\n <Gift className=\"h-4 w-4 shrink-0\" />\n {loan.specialOffer}\n </div>\n )}\n\n {/ EMI summary — primary emphasis zone (one per page) /}\n <EmphasisPanel className=\"p-5\">\n <div className=\"mb-4 flex items-center gap-2\">\n <Calculator className=\"h-5 w-5 text-text-secondary\" />\n <h2 className=\"text-lg font-semibold text-text-primary\">EMI Estimate at {loan.interestRate}%</h2>\n </div>\n <div className=\"grid gap-6 md:grid-cols-2\">\n <div className=\"space-y-5\">\n <div>\n <div className=\"mb-2 flex items-center justify-between\">\n <label className=\"text-sm font-medium text-text-primary\">Loan Amount</label>\n <span className=\"text-sm font-semibold text-text-primary\">{formatCurrency(amount)}</span>\n </div>\n <input\n type=\"range\"\n min={50000}\n max={Math.max(loan.maxAmount, 100000)}\n step={10000}\n value={Math.min(amount, loan.maxAmount)}\n onChange={(e) => setAmount(Number(e.target.value))}\n aria-label=\"Loan amount\"\n className={SLIDER_CLASS}\n />\n <div className=\"mt-1 flex justify-between text-xs text-text-secondary\">\n <span>₹50K</span>\n <span>Max {formatINRCompact(loan.maxAmount)}</span>\n </div>\n </div>\n <div>\n <div className=\"mb-2 flex items-center justify-between\">\n <label className=\"text-sm font-medium text-text-primary\">Tenure (years)</label>\n <span className=\"text-sm font-semibold text-text-primary\">{tenure} years</span>\n </div>\n <input\n type=\"range\"\n min={1}\n max={loan.maxTenure}\n step={1}\n value={Math.min(tenure, loan.maxTenure)}\n onChange={(e) => setTenure(Number(e.target.value))}\n aria-label=\"Tenure in years\"\n className={SLIDER_CLASS}\n />\n <div className=\"mt-1 flex justify-between text-xs text-text-secondary\">\n <span>1 yr</span>\n <span>Max {loan.maxTenure} yrs</span>\n </div>\n </div>\n </div>\n <div className=\"flex flex-col items-center justify-center rounded-lg bg-bg-sunken/50 p-6\">\n <p className=\"text-sm text-text-secondary\">Monthly EMI</p>\n <p className=\"my-2 text-4xl font-bold text-text-primary\">{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-text-secondary\">Total Payment</p>\n <p className=\"text-sm font-semibold text-text-primary\">{formatCurrency(totalPayment)}</p>\n </div>\n <div className=\"text-center\">\n <p className=\"text-xs text-text-secondary\">Total Interest</p>\n <p className=\"text-sm font-semibold text-status-error-text\">{formatCurrency(totalInterest)}</p>\n </div>\n </div>\n </div>\n </div>\n </EmphasisPanel>\n\n <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n {/ Terms /}\n <div className=\"space-y-6 lg:col-span-2\">\n <GlassCard treatment=\"plain\" className=\"border-border-seam p-6\">\n <h2 className=\"mb-4 text-base font-semibold text-text-primary\">Loan Terms</h2>\n <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"flex items-center gap-1.5 text-xs text-text-secondary\">\n <Percent className=\"h-3.5 w-3.5\" />\n Interest Rate\n </div>\n <div className=\"mt-1 text-lg font-bold text-text-primary\">{loan.interestRate}%</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"flex items-center gap-1.5 text-xs text-text-secondary\">\n <Wallet className=\"h-3.5 w-3.5\" />\n EMI / Lakh\n </div>\n <div className=\"mt-1 text-lg font-bold text-text-primary\">\n {loan.emiPerLakh != null ? formatINRCompact(loan.emiPerLakh) : '—'}\n </div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"flex items-center gap-1.5 text-xs text-text-secondary\">\n <CalendarClock className=\"h-3.5 w-3.5\" />\n Max Tenure\n </div>\n <div className=\"mt-1 text-lg font-bold text-text-primary\">{loan.maxTenure} yrs</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"text-xs text-text-secondary\">Max Amount</div>\n <div className=\"mt-1 text-sm font-semibold text-text-primary\">{formatINRCompact(loan.maxAmount)}</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"text-xs text-text-secondary\">Processing Fee</div>\n <div className=\"mt-1 text-sm font-semibold text-text-primary\">{loan.processingFee ?? '—'}</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"text-xs text-text-secondary\">Prepayment</div>\n <div\n className={cn(\n 'mt-1 text-sm font-semibold',\n loan.prepaymentCharges === 'None' ? 'text-status-success-text' : 'text-text-primary'\n )}\n >\n {loan.prepaymentCharges ?? '—'}\n </div>\n </div>\n </div>\n </GlassCard>\n\n {features.length > 0 && (\n <GlassCard treatment=\"plain\" className=\"border-border-seam p-6\">\n <h2 className=\"mb-4 text-base font-semibold text-text-primary\">Features</h2>\n <ul className=\"grid grid-cols-1 gap-2 sm:grid-cols-2\">\n {features.map((feature, i) => (\n <li key={i} className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <CheckCircle className=\"h-4 w-4 shrink-0 text-status-success-text\" />\n {feature}\n </li>\n ))}\n </ul>\n </GlassCard>\n )}\n </div>\n\n {/ Apply card */}\n <div className=\"space-y-6\">\n <GlassCard treatment=\"plain\" className=\"border-border-seam p-5\">\n <h3 className=\"mb-2 text-base font-semibold text-text-primary\">Ready to apply?</h3>\n <p className=\"mb-4 text-sm text-text-secondary\">\n Applications are handled directly with {loan.bankName} through HousingVista Messages. Start an enquiry and\n the bank will guide you through eligibility and paperwork.\n </p>\n <Button\n type=\"button\"\n variant=\"default\"\n className=\"w-full justify-center\"\n onClick={() => setContactOpen(true)}\n >\n Apply Now\n </Button>\n </GlassCard>\n </div>\n </div>\n\n <ContactOwnerDialog\n open={contactOpen}\n onOpenChange={setContactOpen}\n entityId={loan.id}\n entityType=\"housingvista-home-loan\"\n title={loan.bankName}\n pagePath={location.pathname}\n heading={`Apply with ${loan.bankName}`}\n description={`Start your application with ${loan.bankName}. Messages are saved and delivered in your inbox.`}\n />\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"HomeLoanDetailPage.js","names":[],"sources":["../../../../src/housingvista/pages/finance/HomeLoanDetailPage.tsx"],"sourcesContent":["/*\n HousingVista Home Loan Detail / Apply Page\n * Single loan offer backed by `housingvistaHomeLoanOffer(id)` — full terms plus\n * a live EMI summary for the offer's headline rate.\n \n \"Apply\" opens the real `ContactOwnerDialog` — a persisted conversation with\n * the bank. No fabricated approval; the EMI calculator stays for modelling.\n * @module housingvista\n /\n\nimport { useMemo, useState } from 'react';\nimport { useNavigate, useParams, useLocation } from 'react-router-dom';\nimport {\n ArrowLeft,\n Building2,\n Star,\n CheckCircle,\n Gift,\n Calculator,\n Percent,\n Wallet,\n CalendarClock,\n} from 'lucide-react';\nimport { Button, EmphasisPanel, GlassCard, PagePurpose } from '@burdenoff/fe-libs/ui';\nimport { Breadcrumbs, StatusBadge, EmptyState, LoadingSkeleton, ContactOwnerDialog } from '../../components';\nimport type { BreadcrumbItem } from '../../components';\nimport { useHomeLoanOffer } from '../../hooks';\nimport { cn, formatCurrency, formatINRCompact } from '../../utils/helpers';\nimport { useTrackPageView } from '../../hooks/useHousingVistaAnalytics';\n\n/* Branded emerald range slider (matches the mock's green sliders). /\nconst SLIDER_CLASS = 'w-full accent-[var(--color-action-primary-bg)]';\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 text-status-warning-text\">\n {Array.from({ length: 5 }).map((_, i) => (\n <Star\n key={i}\n className={cn('h-4 w-4', i < Math.floor(rating) ? 'fill-current' : 'fill-none text-text-secondary/30')}\n />\n ))}\n </div>\n );\n}\n\nexport function HomeLoanDetailPage() {\n const { id } = useParams<{ id: string }>();\n\n useTrackPageView('housingvista.home_loan.viewed', id);\n const navigate = useNavigate();\n const location = useLocation();\n const { data: loan, loading } = useHomeLoanOffer(id);\n\n // Model a representative loan against the offer's headline rate so the borrower\n // can see the real monthly cost before enquiring.\n const [amount, setAmount] = useState(500000);\n const [tenure, setTenure] = useState(20);\n const [contactOpen, setContactOpen] = useState(false);\n\n const rate = loan?.interestRate ?? 0;\n const emi = useMemo(() => calculateEMI(amount, rate, tenure), [amount, rate, tenure]);\n const totalPayment = emi * tenure * 12;\n const totalInterest = totalPayment - amount;\n\n if (loading) {\n return (\n <div className=\"p-6\">\n <LoadingSkeleton variant=\"detail\" />\n </div>\n );\n }\n\n if (!loan) {\n return (\n <div className=\"p-6\">\n <EmptyState\n illustration=\"empty-data\"\n icon={<Building2 className=\"h-12 w-12\" />}\n title=\"Loan Offer Not Found\"\n description=\"The loan offer you're looking for doesn't exist or is no longer available.\"\n action={\n <button\n onClick={() => navigate('../home-loans')}\n className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover\"\n >\n <ArrowLeft className=\"h-4 w-4\" />\n Back to Home Loans\n </button>\n }\n />\n </div>\n );\n }\n\n const features = loan.features ?? [];\n const breadcrumbs: BreadcrumbItem[] = [{ label: 'Home Loans', href: '../' }, { label: loan.bankName }];\n\n return (\n <div className=\"flex flex-col gap-6 p-6\">\n <Breadcrumbs items={breadcrumbs} />\n\n {/* Header /}\n <div className=\"flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between\">\n <div className=\"flex items-start gap-4\">\n <div className=\"flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-bg-sunken text-text-secondary\">\n <Building2 className=\"h-6 w-6\" />\n </div>\n <div>\n <button\n onClick={() => navigate('../home-loans')}\n className=\"mb-2 inline-flex items-center gap-2 rounded-md px-2 py-1 text-sm text-text-secondary transition-colors hover:bg-bg-sunken hover:text-text-primary\"\n >\n <ArrowLeft className=\"h-4 w-4\" />\n Back to Home Loans\n </button>\n <h1 className=\"text-2xl font-semibold text-text-primary\">{loan.bankName}</h1>\n <div className=\"mt-2 flex flex-wrap items-center gap-2\">\n {loan.rating != null && (\n <span className=\"inline-flex items-center gap-1.5\">\n <RatingStars rating={loan.rating} />\n <span className=\"text-sm text-text-secondary\">{loan.rating}</span>\n </span>\n )}\n {loan.specialOffer && <StatusBadge label=\"Special Offer\" variant=\"warning\" />}\n </div>\n </div>\n </div>\n <Button type=\"button\" variant=\"default\" onClick={() => setContactOpen(true)}>\n Apply Now\n </Button>\n </div>\n\n <PagePurpose className=\"max-w-3xl\">\n The full terms of this offer with a live EMI estimate at the bank's headline rate. Model your loan amount and\n tenure to see the real monthly cost, then apply to connect with {loan.bankName} through Messages.\n </PagePurpose>\n\n {loan.specialOffer && (\n <div className=\"flex items-center gap-2 rounded-lg bg-status-warning-bg-subtle p-3 text-sm text-status-warning-text\">\n <Gift className=\"h-4 w-4 shrink-0\" />\n {loan.specialOffer}\n </div>\n )}\n\n {/ EMI summary — primary emphasis zone (one per page) /}\n <EmphasisPanel className=\"p-5\">\n <div className=\"mb-4 flex items-center gap-2\">\n <Calculator className=\"h-5 w-5 text-text-secondary\" />\n <h2 className=\"text-lg font-semibold text-text-primary\">EMI Estimate at {loan.interestRate}%</h2>\n </div>\n <div className=\"grid gap-6 md:grid-cols-2\">\n <div className=\"space-y-5\">\n <div>\n <div className=\"mb-2 flex items-center justify-between\">\n <label className=\"text-sm font-medium text-text-primary\">Loan Amount</label>\n <span className=\"text-sm font-semibold text-text-primary\">{formatCurrency(amount)}</span>\n </div>\n <input\n type=\"range\"\n min={50000}\n max={Math.max(loan.maxAmount, 100000)}\n step={10000}\n value={Math.min(amount, loan.maxAmount)}\n onChange={(e) => setAmount(Number(e.target.value))}\n aria-label=\"Loan amount\"\n className={SLIDER_CLASS}\n />\n <div className=\"mt-1 flex justify-between text-xs text-text-secondary\">\n <span>₹50K</span>\n <span>Max {formatINRCompact(loan.maxAmount)}</span>\n </div>\n </div>\n <div>\n <div className=\"mb-2 flex items-center justify-between\">\n <label className=\"text-sm font-medium text-text-primary\">Tenure (years)</label>\n <span className=\"text-sm font-semibold text-text-primary\">{tenure} years</span>\n </div>\n <input\n type=\"range\"\n min={1}\n max={loan.maxTenure}\n step={1}\n value={Math.min(tenure, loan.maxTenure)}\n onChange={(e) => setTenure(Number(e.target.value))}\n aria-label=\"Tenure in years\"\n className={SLIDER_CLASS}\n />\n <div className=\"mt-1 flex justify-between text-xs text-text-secondary\">\n <span>1 yr</span>\n <span>Max {loan.maxTenure} yrs</span>\n </div>\n </div>\n </div>\n <div className=\"flex flex-col items-center justify-center rounded-lg bg-bg-sunken/50 p-6\">\n <p className=\"text-sm text-text-secondary\">Monthly EMI</p>\n <p className=\"my-2 text-4xl font-bold text-text-primary\">{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-text-secondary\">Total Payment</p>\n <p className=\"text-sm font-semibold text-text-primary\">{formatCurrency(totalPayment)}</p>\n </div>\n <div className=\"text-center\">\n <p className=\"text-xs text-text-secondary\">Total Interest</p>\n <p className=\"text-sm font-semibold text-status-error-text\">{formatCurrency(totalInterest)}</p>\n </div>\n </div>\n </div>\n </div>\n </EmphasisPanel>\n\n <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-3\">\n {/ Terms /}\n <div className=\"space-y-6 lg:col-span-2\">\n <GlassCard treatment=\"plain\" className=\"border-border-seam p-6\">\n <h2 className=\"mb-4 text-base font-semibold text-text-primary\">Loan Terms</h2>\n <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3\">\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"flex items-center gap-1.5 text-xs text-text-secondary\">\n <Percent className=\"h-3.5 w-3.5\" />\n Interest Rate\n </div>\n <div className=\"mt-1 text-lg font-bold text-text-primary\">{loan.interestRate}%</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"flex items-center gap-1.5 text-xs text-text-secondary\">\n <Wallet className=\"h-3.5 w-3.5\" />\n EMI / Lakh\n </div>\n <div className=\"mt-1 text-lg font-bold text-text-primary\">\n {loan.emiPerLakh != null ? formatINRCompact(loan.emiPerLakh) : '—'}\n </div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"flex items-center gap-1.5 text-xs text-text-secondary\">\n <CalendarClock className=\"h-3.5 w-3.5\" />\n Max Tenure\n </div>\n <div className=\"mt-1 text-lg font-bold text-text-primary\">{loan.maxTenure} yrs</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"text-xs text-text-secondary\">Max Amount</div>\n <div className=\"mt-1 text-sm font-semibold text-text-primary\">{formatINRCompact(loan.maxAmount)}</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"text-xs text-text-secondary\">Processing Fee</div>\n <div className=\"mt-1 text-sm font-semibold text-text-primary\">{loan.processingFee ?? '—'}</div>\n </div>\n <div className=\"rounded-lg bg-bg-sunken/50 p-4\">\n <div className=\"text-xs text-text-secondary\">Prepayment</div>\n <div\n className={cn(\n 'mt-1 text-sm font-semibold',\n loan.prepaymentCharges === 'None' ? 'text-status-success-text' : 'text-text-primary'\n )}\n >\n {loan.prepaymentCharges ?? '—'}\n </div>\n </div>\n </div>\n </GlassCard>\n\n {features.length > 0 && (\n <GlassCard treatment=\"plain\" className=\"border-border-seam p-6\">\n <h2 className=\"mb-4 text-base font-semibold text-text-primary\">Features</h2>\n <ul className=\"grid grid-cols-1 gap-2 sm:grid-cols-2\">\n {features.map((feature, i) => (\n <li key={i} className=\"flex items-center gap-2 text-sm text-text-secondary\">\n <CheckCircle className=\"h-4 w-4 shrink-0 text-status-success-text\" />\n {feature}\n </li>\n ))}\n </ul>\n </GlassCard>\n )}\n </div>\n\n {/ Apply card */}\n <div className=\"space-y-6\">\n <GlassCard treatment=\"plain\" className=\"border-border-seam p-5\">\n <h3 className=\"mb-2 text-base font-semibold text-text-primary\">Ready to apply?</h3>\n <p className=\"mb-4 text-sm text-text-secondary\">\n Applications are handled directly with {loan.bankName} through HousingVista Messages. Start an enquiry and\n the bank will guide you through eligibility and paperwork.\n </p>\n <Button\n type=\"button\"\n variant=\"default\"\n className=\"w-full justify-center\"\n onClick={() => setContactOpen(true)}\n >\n Apply Now\n </Button>\n </GlassCard>\n </div>\n </div>\n\n <ContactOwnerDialog\n open={contactOpen}\n onOpenChange={setContactOpen}\n entityId={loan.id}\n entityType=\"housingvista-home-loan\"\n title={loan.bankName}\n pagePath={location.pathname}\n heading={`Apply with ${loan.bankName}`}\n description={`Start your application with ${loan.bankName}. Messages are saved and delivered in your inbox.`}\n />\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/housingvista/pages/finance/HomeLoansPage.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HomeLoansPage.d.ts","sourceRoot":"","sources":["../../../../src/housingvista/pages/finance/HomeLoansPage.tsx"],"names":[],"mappings":"~~AAmIA~~,wBAAgB,aAAa,~~gCA0N5B~~"}
1	+ {"version":3,"file":"HomeLoansPage.d.ts","sourceRoot":"","sources":["../../../../src/housingvista/pages/finance/HomeLoansPage.tsx"],"names":[],"mappings":"AAoIA,wBAAgB,aAAa,gCA2N5B"}

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

@@ -3,294 +3,296 @@ import { PageLayout as r } from "../../components/PageLayout.js";
 import { EmptyState as i } from "../../components/EmptyState.js";
 import { FilterBar as a } from "../../components/FilterBar.js";
 import { LoadingSkeleton as o } from "../../components/LoadingSkeleton.js";
-import { useHomeLoans as s } from "../../hooks/index.js";
+import { useTrackPageView as s } from "../../hooks/useHousingVistaAnalytics.js";
+import { useHomeLoans as c } from "../../hooks/index.js";
 import "../../components/index.js";
-import { useServerPagination as c } from "../../hooks/useServerPagination.js";
-import { useMemo as l, useState as u } from "react";
-import { ArrowRight as d, Building2 as f, Calculator as p, CheckCircle as m, Gift as h, Star as g } from "lucide-react";
-import { useNavigate as _ } from "react-router-dom";
-import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
-import { EmphasisPanel as x, NextSteps as S, Pagination as C } from "@burdenoff/fe-libs/ui";
+import { useServerPagination as l } from "../../hooks/useServerPagination.js";
+import { useMemo as u, useState as d } from "react";
+import { ArrowRight as f, Building2 as p, Calculator as m, CheckCircle as h, Gift as g, Star as _ } from "lucide-react";
+import { useNavigate as v } from "react-router-dom";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { EmphasisPanel as S, NextSteps as C, Pagination as w } from "@burdenoff/fe-libs/ui";
 //#region src/housingvista/pages/finance/HomeLoansPage.tsx
-var w = 9, T = "w-full accent-[var(--color-action-primary-bg)]";
-function E(e, t, n) {
+var T = 9, E = "w-full accent-[var(--color-action-primary-bg)]";
+function D(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 D({ rating: t }) {
-	return /* @__PURE__ */ y("div", {
+function O({ rating: t }) {
+	return /* @__PURE__ */ b("div", {
 		className: "flex items-center gap-0.5 text-status-warning-text",
-		children: Array.from({ length: 5 }).map((n, r) => /* @__PURE__ */ y(g, { className: e("h-3 w-3", r < Math.floor(t) ? "fill-current" : "fill-none text-text-secondary/30") }, r))
+		children: Array.from({ length: 5 }).map((n, r) => /* @__PURE__ */ b(_, { className: e("h-3 w-3", r < Math.floor(t) ? "fill-current" : "fill-none text-text-secondary/30") }, r))
 	});
 }
-function O({ loan: t }) {
-	let r = _();
-	return /* @__PURE__ */ b("div", {
+function k({ loan: t }) {
+	let r = v();
+	return /* @__PURE__ */ x("div", {
 		className: "flex flex-col rounded-card border border-border-seam bg-bg-surface p-5 shadow-elevation-1 transition-[box-shadow,border-color] hover:border-border-strong hover:shadow-elevation-2",
 		children: [
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "mb-4 flex items-start justify-between gap-3",
-				children: [/* @__PURE__ */ b("div", {
+				children: [/* @__PURE__ */ x("div", {
 					className: "flex items-center gap-3",
-					children: [/* @__PURE__ */ y("div", {
+					children: [/* @__PURE__ */ b("div", {
 						className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-accent-blue-subtle",
-						children: /* @__PURE__ */ y(f, { className: "h-6 w-6 text-accent-blue" })
-					}), /* @__PURE__ */ b("div", { children: [/* @__PURE__ */ y("h3", {
+						children: /* @__PURE__ */ b(p, { className: "h-6 w-6 text-accent-blue" })
+					}), /* @__PURE__ */ x("div", { children: [/* @__PURE__ */ b("h3", {
 						className: "text-sm font-semibold text-text-primary",
 						children: t.bankName
-					}), /* @__PURE__ */ b("div", {
+					}), /* @__PURE__ */ x("div", {
 						className: "flex items-center gap-1.5 mt-0.5",
-						children: [/* @__PURE__ */ y(D, { rating: t.rating }), /* @__PURE__ */ y("span", {
+						children: [/* @__PURE__ */ b(O, { rating: t.rating }), /* @__PURE__ */ b("span", {
 							className: "text-xs text-text-secondary",
 							children: t.rating
 						})]
 					})] })]
-				}), t.specialOffer && /* @__PURE__ */ b("span", {
+				}), t.specialOffer && /* @__PURE__ */ x("span", {
 					className: "inline-flex items-center gap-1 rounded-full bg-status-warning-bg-subtle px-2 py-0.5 text-xs font-medium text-status-warning-text",
-					children: [/* @__PURE__ */ y(h, { className: "h-3 w-3" }), "Offer"]
+					children: [/* @__PURE__ */ b(g, { className: "h-3 w-3" }), "Offer"]
 				})]
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "mb-4 grid grid-cols-2 gap-3",
 				children: [
-					/* @__PURE__ */ b("div", {
+					/* @__PURE__ */ x("div", {
 						className: "rounded-md bg-bg-sunken/50 p-2.5",
-						children: [/* @__PURE__ */ y("p", {
+						children: [/* @__PURE__ */ b("p", {
 							className: "text-xs text-text-secondary",
 							children: "Interest Rate"
-						}), /* @__PURE__ */ b("p", {
+						}), /* @__PURE__ */ x("p", {
 							className: "text-lg font-bold text-text-primary",
 							children: [t.interestRate, "%"]
 						})]
 					}),
-					/* @__PURE__ */ b("div", {
+					/* @__PURE__ */ x("div", {
 						className: "rounded-md bg-bg-sunken/50 p-2.5",
-						children: [/* @__PURE__ */ y("p", {
+						children: [/* @__PURE__ */ b("p", {
 							className: "text-xs text-text-secondary",
 							children: "EMI / Lakh"
-						}), /* @__PURE__ */ y("p", {
+						}), /* @__PURE__ */ b("p", {
 							className: "text-lg font-bold text-text-primary",
 							children: n(t.emiPerLakh)
 						})]
 					}),
-					/* @__PURE__ */ b("div", {
+					/* @__PURE__ */ x("div", {
 						className: "rounded-md bg-bg-sunken/50 p-2.5",
-						children: [/* @__PURE__ */ y("p", {
+						children: [/* @__PURE__ */ b("p", {
 							className: "text-xs text-text-secondary",
 							children: "Max Tenure"
-						}), /* @__PURE__ */ b("p", {
+						}), /* @__PURE__ */ x("p", {
 							className: "text-sm font-semibold text-text-primary",
 							children: [t.maxTenure, " years"]
 						})]
 					}),
-					/* @__PURE__ */ b("div", {
+					/* @__PURE__ */ x("div", {
 						className: "rounded-md bg-bg-sunken/50 p-2.5",
-						children: [/* @__PURE__ */ y("p", {
+						children: [/* @__PURE__ */ b("p", {
 							className: "text-xs text-text-secondary",
 							children: "Max Amount"
-						}), /* @__PURE__ */ y("p", {
+						}), /* @__PURE__ */ b("p", {
 							className: "text-sm font-semibold text-text-primary",
 							children: n(t.maxAmount)
 						})]
 					})
 				]
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "mb-3 flex items-center justify-between text-xs",
-				children: [/* @__PURE__ */ y("span", {
+				children: [/* @__PURE__ */ b("span", {
 					className: "text-text-secondary",
 					children: "Processing Fee"
-				}), /* @__PURE__ */ y("span", {
+				}), /* @__PURE__ */ b("span", {
 					className: "font-medium text-text-primary",
 					children: t.processingFee
 				})]
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "mb-3 flex items-center justify-between text-xs",
-				children: [/* @__PURE__ */ y("span", {
+				children: [/* @__PURE__ */ b("span", {
 					className: "text-text-secondary",
 					children: "Prepayment Charges"
-				}), /* @__PURE__ */ y("span", {
+				}), /* @__PURE__ */ b("span", {
 					className: e("font-medium", t.prepaymentCharges === "None" ? "text-status-success-text" : "text-text-primary"),
 					children: t.prepaymentCharges
 				})]
 			}),
-			t.specialOffer && /* @__PURE__ */ y("div", {
+			t.specialOffer && /* @__PURE__ */ b("div", {
 				className: "mb-3 rounded-md bg-status-warning-bg-subtle p-2.5 text-xs text-status-warning-text",
 				children: t.specialOffer
 			}),
-			/* @__PURE__ */ y("div", {
+			/* @__PURE__ */ b("div", {
 				className: "mb-4 space-y-1.5",
-				children: t.features.map((e, t) => /* @__PURE__ */ b("div", {
+				children: t.features.map((e, t) => /* @__PURE__ */ x("div", {
 					className: "flex items-center gap-1.5 text-xs text-text-secondary",
-					children: [/* @__PURE__ */ y(m, { className: "h-3 w-3 shrink-0 text-status-success-text" }), e]
+					children: [/* @__PURE__ */ b(h, { className: "h-3 w-3 shrink-0 text-status-success-text" }), e]
 				}, t))
 			}),
-			/* @__PURE__ */ b("button", {
+			/* @__PURE__ */ x("button", {
 				onClick: () => r(`../home-loans/${t.id}/apply`),
 				className: "mt-auto flex w-full items-center justify-center gap-1.5 rounded-md bg-action-primary-bg px-4 py-2.5 text-xs font-medium text-action-primary-text transition-colors hover:bg-action-primary-bg-hover",
-				children: ["Apply Now", /* @__PURE__ */ y(d, { className: "h-3.5 w-3.5" })]
+				children: ["Apply Now", /* @__PURE__ */ b(f, { className: "h-3.5 w-3.5" })]
 			})
 		]
 	});
 }
-function k() {
-	let e = _(), n = c(w), { data: d, loading: m } = s(n.pagination), [h, g] = u(""), D = l(() => {
-		let e = h.trim().toLowerCase();
-		return e ? d.filter((t) => t.bankName.toLowerCase().includes(e) || t.features.some((t) => t.toLowerCase().includes(e)) || (t.specialOffer ?? "").toLowerCase().includes(e)) : d;
-	}, [d, h]), k = d.length >= n.pageSize, [A, j] = u(5e6), [M, N] = u(20), [P, F] = u(6.75), I = l(() => E(A, P, M), [
-		A,
-		P,
-		M
-	]), L = I * M * 12, R = L - A;
-	return /* @__PURE__ */ b(r, {
+function A() {
+	s("housingvista.home_loan.viewed");
+	let e = v(), n = l(T), { data: f, loading: h } = c(n.pagination), [g, _] = d(""), O = u(() => {
+		let e = g.trim().toLowerCase();
+		return e ? f.filter((t) => t.bankName.toLowerCase().includes(e) || t.features.some((t) => t.toLowerCase().includes(e)) || (t.specialOffer ?? "").toLowerCase().includes(e)) : f;
+	}, [f, g]), A = f.length >= n.pageSize, [j, M] = d(5e6), [N, P] = d(20), [F, I] = d(6.75), L = u(() => D(j, F, N), [
+		j,
+		F,
+		N
+	]), R = L * N * 12, z = R - j;
+	return /* @__PURE__ */ x(r, {
 		title: "Home Loans",
 		description: "Compare rates, calculate EMI, and apply for home loans",
 		purpose: "Work out what a home loan will really cost before you commit. Use the EMI calculator to model your monthly payment and total interest, then compare offers from partner banks and apply to the one that fits.",
 		children: [
-			/* @__PURE__ */ b(x, {
+			/* @__PURE__ */ x(S, {
 				className: "p-5",
-				children: [/* @__PURE__ */ b("div", {
+				children: [/* @__PURE__ */ x("div", {
 					className: "mb-4 flex items-center gap-2",
-					children: [/* @__PURE__ */ y(p, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ y("h2", {
+					children: [/* @__PURE__ */ b(m, { className: "h-5 w-5 text-text-secondary" }), /* @__PURE__ */ b("h2", {
 						className: "text-lg font-semibold text-text-primary",
 						children: "EMI Calculator"
 					})]
-				}), /* @__PURE__ */ b("div", {
+				}), /* @__PURE__ */ x("div", {
 					className: "grid gap-6 md:grid-cols-2",
-					children: [/* @__PURE__ */ b("div", {
+					children: [/* @__PURE__ */ x("div", {
 						className: "space-y-5",
 						children: [
-							/* @__PURE__ */ b("div", { children: [
-								/* @__PURE__ */ b("div", {
+							/* @__PURE__ */ x("div", { children: [
+								/* @__PURE__ */ x("div", {
 									className: "flex items-center justify-between mb-2",
-									children: [/* @__PURE__ */ y("label", {
+									children: [/* @__PURE__ */ b("label", {
 										className: "text-sm font-medium text-text-primary",
 										children: "Loan Amount"
-									}), /* @__PURE__ */ y("span", {
+									}), /* @__PURE__ */ b("span", {
 										className: "text-sm font-semibold text-text-primary",
-										children: t(A)
+										children: t(j)
 									})]
 								}),
-								/* @__PURE__ */ y("input", {
+								/* @__PURE__ */ b("input", {
 									type: "range",
 									min: 1e5,
 									max: 5e7,
 									step: 1e5,
-									value: A,
-									onChange: (e) => j(Number(e.target.value)),
+									value: j,
+									onChange: (e) => M(Number(e.target.value)),
 									"aria-label": "Loan amount",
-									className: T
+									className: E
 								}),
-								/* @__PURE__ */ b("div", {
+								/* @__PURE__ */ x("div", {
 									className: "flex justify-between text-xs text-text-secondary mt-1",
-									children: [/* @__PURE__ */ y("span", { children: "₹1 L" }), /* @__PURE__ */ y("span", { children: "₹5 Cr" })]
+									children: [/* @__PURE__ */ b("span", { children: "₹1 L" }), /* @__PURE__ */ b("span", { children: "₹5 Cr" })]
 								})
 							] }),
-							/* @__PURE__ */ b("div", { children: [
-								/* @__PURE__ */ b("div", {
+							/* @__PURE__ */ x("div", { children: [
+								/* @__PURE__ */ x("div", {
 									className: "flex items-center justify-between mb-2",
-									children: [/* @__PURE__ */ y("label", {
+									children: [/* @__PURE__ */ b("label", {
 										className: "text-sm font-medium text-text-primary",
 										children: "Tenure (years)"
-									}), /* @__PURE__ */ b("span", {
+									}), /* @__PURE__ */ x("span", {
 										className: "text-sm font-semibold text-text-primary",
-										children: [M, " years"]
+										children: [N, " years"]
 									})]
 								}),
-								/* @__PURE__ */ y("input", {
+								/* @__PURE__ */ b("input", {
 									type: "range",
 									min: 1,
 									max: 30,
 									step: 1,
-									value: M,
-									onChange: (e) => N(Number(e.target.value)),
-									className: T
+									value: N,
+									onChange: (e) => P(Number(e.target.value)),
+									className: E
 								}),
-								/* @__PURE__ */ b("div", {
+								/* @__PURE__ */ x("div", {
 									className: "flex justify-between text-xs text-text-secondary mt-1",
-									children: [/* @__PURE__ */ y("span", { children: "1 yr" }), /* @__PURE__ */ y("span", { children: "30 yrs" })]
+									children: [/* @__PURE__ */ b("span", { children: "1 yr" }), /* @__PURE__ */ b("span", { children: "30 yrs" })]
 								})
 							] }),
-							/* @__PURE__ */ b("div", { children: [
-								/* @__PURE__ */ b("div", {
+							/* @__PURE__ */ x("div", { children: [
+								/* @__PURE__ */ x("div", {
 									className: "flex items-center justify-between mb-2",
-									children: [/* @__PURE__ */ y("label", {
+									children: [/* @__PURE__ */ b("label", {
 										className: "text-sm font-medium text-text-primary",
 										children: "Interest Rate (%)"
-									}), /* @__PURE__ */ b("span", {
+									}), /* @__PURE__ */ x("span", {
 										className: "text-sm font-semibold text-text-primary",
-										children: [P, "%"]
+										children: [F, "%"]
 									})]
 								}),
-								/* @__PURE__ */ y("input", {
+								/* @__PURE__ */ b("input", {
 									type: "range",
 									min: 3,
 									max: 15,
 									step: .05,
-									value: P,
-									onChange: (e) => F(Number(e.target.value)),
-									className: T
+									value: F,
+									onChange: (e) => I(Number(e.target.value)),
+									className: E
 								}),
-								/* @__PURE__ */ b("div", {
+								/* @__PURE__ */ x("div", {
 									className: "flex justify-between text-xs text-text-secondary mt-1",
-									children: [/* @__PURE__ */ y("span", { children: "3%" }), /* @__PURE__ */ y("span", { children: "15%" })]
+									children: [/* @__PURE__ */ b("span", { children: "3%" }), /* @__PURE__ */ b("span", { children: "15%" })]
 								})
 							] })
 						]
-					}), /* @__PURE__ */ b("div", {
+					}), /* @__PURE__ */ x("div", {
 						className: "flex flex-col items-center justify-center rounded-lg bg-bg-sunken/50 p-6",
 						children: [
-							/* @__PURE__ */ y("p", {
+							/* @__PURE__ */ b("p", {
 								className: "text-sm text-text-secondary",
 								children: "Monthly EMI"
 							}),
-							/* @__PURE__ */ y("p", {
+							/* @__PURE__ */ b("p", {
 								className: "my-2 text-4xl font-bold text-text-primary",
-								children: t(I)
+								children: t(L)
 							}),
-							/* @__PURE__ */ b("div", {
+							/* @__PURE__ */ x("div", {
 								className: "mt-4 grid w-full grid-cols-2 gap-4",
-								children: [/* @__PURE__ */ b("div", {
+								children: [/* @__PURE__ */ x("div", {
 									className: "text-center",
-									children: [/* @__PURE__ */ y("p", {
+									children: [/* @__PURE__ */ b("p", {
 										className: "text-xs text-text-secondary",
 										children: "Total Payment"
-									}), /* @__PURE__ */ y("p", {
+									}), /* @__PURE__ */ b("p", {
 										className: "text-sm font-semibold text-text-primary",
-										children: t(L)
+										children: t(R)
 									})]
-								}), /* @__PURE__ */ b("div", {
+								}), /* @__PURE__ */ x("div", {
 									className: "text-center",
-									children: [/* @__PURE__ */ y("p", {
+									children: [/* @__PURE__ */ b("p", {
 										className: "text-xs text-text-secondary",
 										children: "Total Interest"
-									}), /* @__PURE__ */ y("p", {
+									}), /* @__PURE__ */ b("p", {
 										className: "text-sm font-semibold text-status-error-text",
-										children: t(R)
+										children: t(z)
 									})]
 								})]
 							}),
-							/* @__PURE__ */ b("div", {
+							/* @__PURE__ */ x("div", {
 								className: "mt-4 w-full",
-								children: [/* @__PURE__ */ b("div", {
+								children: [/* @__PURE__ */ x("div", {
 									className: "flex h-3 w-full overflow-hidden rounded-full",
-									children: [/* @__PURE__ */ y("div", {
+									children: [/* @__PURE__ */ b("div", {
 										className: "bg-chart-1 transition-all",
-										style: { width: `${A / L * 100}%` }
-									}), /* @__PURE__ */ y("div", {
+										style: { width: `${j / R * 100}%` }
+									}), /* @__PURE__ */ b("div", {
 										className: "bg-chart-negative transition-all",
-										style: { width: `${R / L * 100}%` }
+										style: { width: `${z / R * 100}%` }
 									})]
-								}), /* @__PURE__ */ b("div", {
+								}), /* @__PURE__ */ x("div", {
 									className: "mt-1.5 flex justify-between text-xs text-text-secondary",
-									children: [/* @__PURE__ */ b("span", {
+									children: [/* @__PURE__ */ x("span", {
 										className: "flex items-center gap-1",
-										children: [/* @__PURE__ */ y("span", { className: "h-2 w-2 rounded-full bg-chart-1" }), " Principal"]
-									}), /* @__PURE__ */ b("span", {
+										children: [/* @__PURE__ */ b("span", { className: "h-2 w-2 rounded-full bg-chart-1" }), " Principal"]
+									}), /* @__PURE__ */ x("span", {
 										className: "flex items-center gap-1",
-										children: [/* @__PURE__ */ y("span", { className: "h-2 w-2 rounded-full bg-chart-negative" }), " Interest"]
+										children: [/* @__PURE__ */ b("span", { className: "h-2 w-2 rounded-full bg-chart-negative" }), " Interest"]
 									})]
 								})]
 							})
@@ -298,7 +300,7 @@ function k() {
 					})]
 				})]
 			}),
-			/* @__PURE__ */ y(S, {
+			/* @__PURE__ */ b(C, {
 				storageKey: "housingvista-home-loans",
 				steps: [
 					{
@@ -306,7 +308,7 @@ function k() {
 						label: "Apply to the best-rated offer",
 						description: "Start an application with a top partner bank.",
 						onClick: () => {
-							let t = [...d].sort((e, t) => t.rating - e.rating)[0];
+							let t = [...f].sort((e, t) => t.rating - e.rating)[0];
 							t && e(`../home-loans/${t.id}/apply`);
 						}
 					},
@@ -324,36 +326,36 @@ function k() {
 					}
 				]
 			}),
-			/* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("div", {
 				className: "space-y-4",
 				children: [
-					/* @__PURE__ */ y("h2", {
+					/* @__PURE__ */ b("h2", {
 						className: "text-lg font-semibold text-text-primary",
 						children: "Available Loan Offers"
 					}),
-					/* @__PURE__ */ y(a, {
-						searchValue: h,
-						onSearchChange: g,
+					/* @__PURE__ */ b(a, {
+						searchValue: g,
+						onSearchChange: _,
 						searchPlaceholder: "Search banks, features, offers on this page..."
 					}),
-					m ? /* @__PURE__ */ y(o, {
+					h ? /* @__PURE__ */ b(o, {
 						variant: "card",
 						count: 6
-					}) : D.length > 0 ? /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ y("div", {
+					}) : O.length > 0 ? /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b("div", {
 						className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-3",
-						children: D.map((e) => /* @__PURE__ */ y(O, { loan: e }, e.id))
-					}), /* @__PURE__ */ y(C, {
+						children: O.map((e) => /* @__PURE__ */ b(k, { loan: e }, e.id))
+					}), /* @__PURE__ */ b(w, {
 						page: n.page,
 						pageSize: n.pageSize,
-						hasNextPage: k,
+						hasNextPage: A,
 						hasPreviousPage: n.page > 1,
 						onPageChange: n.setPage,
 						onPageSizeChange: n.setPageSize
-					})] }) : /* @__PURE__ */ y(i, {
-						illustration: h ? "empty-search" : "empty-data",
-						icon: /* @__PURE__ */ y(f, { className: "h-12 w-12" }),
-						title: h ? "No matching loan offers" : "No loan offers available",
-						description: h ? "No offers on this page match your search. Clear the search or try another page." : "Check back later for new loan offers from our partner banks."
+					})] }) : /* @__PURE__ */ b(i, {
+						illustration: g ? "empty-search" : "empty-data",
+						icon: /* @__PURE__ */ b(p, { className: "h-12 w-12" }),
+						title: g ? "No matching loan offers" : "No loan offers available",
+						description: g ? "No offers on this page match your search. Clear the search or try another page." : "Check back later for new loan offers from our partner banks."
 					})
 				]
 			})
@@ -361,6 +363,6 @@ function k() {
 	});
 }
 //#endregion
-export { k as HomeLoansPage };
+export { A as HomeLoansPage };
 //# sourceMappingURL=HomeLoansPage.js.map