@burdenoff/microfe-kadaikodi 2026.704.3 → 2026.704.5

package/dist/kadaikodi/pages/investor/InvestmentOpportunitiesPage.js

@@ -4,12 +4,14 @@ import { PageLayout as n } from "../../components/PageLayout.js";
 import { EmptyState as r } from "../../components/EmptyState.js";
 import { useInvest as i, useInvestmentOpportunities as a } from "../../hooks/useKadaikodiApi.js";
 import { formatCurrency as o } from "../../utils/formatters.js";
-import { useCallback as s, useMemo as c, useState as l } from "react";
-import { Briefcase as u, CheckCircle2 as d, Eye as f, FileText as p, IndianRupee as m, Search as h, X as g } from "lucide-react";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
-import { EmphasisPanel as y, PagePurpose as b } from "@burdenoff/fe-libs/ui";
+import { AllocationBar as s } from "../../components/viz/AllocationBar.js";
+import "../../components/viz/index.js";
+import { useCallback as c, useMemo as l, useState as u } from "react";
+import { Briefcase as d, CheckCircle2 as f, Eye as p, FileText as m, IndianRupee as h, Lock as g, Search as _, Target as v, TrendingUp as y, X as b } from "lucide-react";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+import { EmphasisPanel as C, GlassCard as w, PagePurpose as T } from "@burdenoff/fe-libs/ui";
 //#region src/kadaikodi/pages/investor/InvestmentOpportunitiesPage.tsx
-function x(e) {
+function E(e) {
 	let t = e.expiresAt ? Math.max(0, Math.ceil((new Date(e.expiresAt).getTime() - Date.now()) / 864e5)) : 0;
 	return {
 		id: e.id,
@@ -57,7 +59,7 @@ function x(e) {
 		status: e.status
 	};
 }
-function S(e) {
+function D(e) {
 	switch (e) {
 		case "low": return "bg-status-success-bg-subtle text-status-success-text";
 		case "medium": return "bg-status-warning-bg-subtle text-status-warning-text";
@@ -65,7 +67,7 @@ function S(e) {
 		default: return "bg-bg-sunken text-text-secondary";
 	}
 }
-function C(e) {
+function O(e) {
 	switch (e) {
 		case "low": return "Low Risk";
 		case "medium": return "Medium Risk";
@@ -73,40 +75,40 @@ function C(e) {
 		default: return e;
 	}
 }
-function w(e, t) {
+function k(e, t) {
 	return t > 0 ? Math.min(e / t * 100, 100) : 0;
 }
-function T() {
-	let { navigateTo: T, currentUser: E } = e(), { data: D = [], isLoading: O } = a(), k = i(), [A, j] = l(null), [M, N] = l(!1), [P, F] = l(""), [I, L] = l("idle"), [R, z] = l({
+function A() {
+	let { navigateTo: A, currentUser: j } = e(), { data: M = [], isLoading: N } = a(), P = i(), [F, I] = u(null), [L, R] = u(!1), [z, B] = u(""), [V, H] = u("idle"), [U, W] = u({
 		searchQuery: "",
 		category: "",
 		riskLevel: "",
 		minimumAmount: "",
 		sortBy: "featured"
-	}), B = c(() => D.map(x), [D]), V = c(() => {
-		let e = B.length;
+	}), G = l(() => M.map(E), [M]), K = l(() => {
+		let e = G.length;
 		return {
 			totalOpportunities: e,
-			averageReturns: e ? Number((B.reduce((e, t) => e + t.expectedReturns, 0) / e).toFixed(1)) : 0,
-			totalFunded: B.reduce((e, t) => e + t.raisedAmount, 0),
-			totalTarget: B.reduce((e, t) => e + t.targetAmount, 0)
+			averageReturns: e ? Number((G.reduce((e, t) => e + t.expectedReturns, 0) / e).toFixed(1)) : 0,
+			totalFunded: G.reduce((e, t) => e + t.raisedAmount, 0),
+			totalTarget: G.reduce((e, t) => e + t.targetAmount, 0)
 		};
-	}, [B]), H = s((e, t) => {
-		z((n) => ({
+	}, [G]), q = c((e, t) => {
+		W((n) => ({
 			...n,
 			[e]: t
 		}));
-	}, []), U = c(() => {
-		let e = [...B];
-		if (R.searchQuery.trim()) {
-			let t = R.searchQuery.toLowerCase();
+	}, []), J = l(() => {
+		let e = [...G];
+		if (U.searchQuery.trim()) {
+			let t = U.searchQuery.toLowerCase();
 			e = e.filter((e) => e.cartName.toLowerCase().includes(t) || e.description.toLowerCase().includes(t) || e.category.toLowerCase().includes(t));
 		}
-		if (R.category && (e = e.filter((e) => e.category === R.category)), R.riskLevel && (e = e.filter((e) => e.riskLevel === R.riskLevel)), R.minimumAmount) {
-			let t = parseInt(R.minimumAmount, 10);
+		if (U.category && (e = e.filter((e) => e.category === U.category)), U.riskLevel && (e = e.filter((e) => e.riskLevel === U.riskLevel)), U.minimumAmount) {
+			let t = parseInt(U.minimumAmount, 10);
 			e = e.filter((e) => e.minimumInvestment <= t);
 		}
-		switch (R.sortBy) {
+		switch (U.sortBy) {
 			case "returns":
 				e.sort((e, t) => t.expectedReturns - e.expectedReturns);
 				break;
@@ -122,112 +124,112 @@ function T() {
 			default: break;
 		}
 		return e;
-	}, [R, B]), W = s(() => {
-		if (!A || !P) return;
-		let e = parseInt(P, 10);
+	}, [U, G]), Y = c(() => {
+		if (!F || !z) return;
+		let e = parseInt(z, 10);
 		if (!isNaN(e)) {
-			if (e < A.minimumInvestment) {
-				L("error");
+			if (e < F.minimumInvestment) {
+				H("error");
 				return;
 			}
-			if (e > A.maximumInvestment) {
-				L("error");
+			if (e > F.maximumInvestment) {
+				H("error");
 				return;
 			}
-			k.mutate({
+			P.mutate({
 				amount: e,
-				investorId: E?.id ?? "",
-				opportunityId: A.id
+				investorId: j?.id ?? "",
+				opportunityId: F.id
 			}, {
 				onSuccess: () => {
-					L("success"), setTimeout(() => {
-						N(!1), F(""), L("idle"), T("/investor/portfolio");
+					H("success"), setTimeout(() => {
+						R(!1), B(""), H("idle"), A("/investor/portfolio");
 					}, 1500);
 				},
-				onError: () => L("error")
+				onError: () => H("error")
 			});
 		}
 	}, [
+		F,
+		z,
 		A,
 		P,
-		T,
-		k,
-		E?.id
-	]), G = s((e) => {
-		j(e), F(""), L("idle"), N(!0);
+		j?.id
+	]), X = c((e) => {
+		I(e), B(""), H("idle"), R(!0);
 	}, []);
-	return O ? /* @__PURE__ */ _(n, {
+	return N ? /* @__PURE__ */ x(n, {
 		title: "Investment Opportunities",
 		description: "Loading opportunities...",
-		children: /* @__PURE__ */ _("div", {
+		children: /* @__PURE__ */ x("div", {
 			className: "flex items-center justify-center py-20",
-			children: /* @__PURE__ */ v("div", {
+			children: /* @__PURE__ */ S("div", {
 				className: "text-center",
-				children: [/* @__PURE__ */ _("div", { className: "mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-primary" }), /* @__PURE__ */ _("p", {
+				children: [/* @__PURE__ */ x("div", { className: "mx-auto mb-4 h-12 w-12 animate-spin rounded-full border-b-2 border-primary" }), /* @__PURE__ */ x("p", {
 					className: "text-sm text-text-secondary",
 					children: "Loading opportunities..."
 				})]
 			})
 		})
-	}) : /* @__PURE__ */ v(n, {
+	}) : /* @__PURE__ */ S(n, {
 		title: "Investment Opportunities",
 		description: "Discover and invest in growing local businesses",
-		actions: /* @__PURE__ */ v("span", {
+		actions: /* @__PURE__ */ S("span", {
 			className: "text-sm text-text-secondary",
-			children: [U.length, " opportunities"]
+			children: [J.length, " opportunities"]
 		}),
 		children: [
-			/* @__PURE__ */ _(b, {
+			/* @__PURE__ */ x(T, {
 				className: "mb-6",
 				children: "The deal flow — local carts and businesses looking for funding right now. Use this page to discover opportunities that fit your strategy, compare projected returns and equity on offer, filter by category or funding stage, and back the ones you believe in. The stats up top show how the platform is performing so you can gauge typical returns and success rates before you commit."
 			}),
-			/* @__PURE__ */ v(y, { children: [/* @__PURE__ */ _("h2", {
+			/* @__PURE__ */ S(C, { children: [/* @__PURE__ */ x("h2", {
 				className: "mb-4 text-base font-semibold text-text-primary",
 				children: "Platform Performance"
-			}), /* @__PURE__ */ v("div", {
+			}), /* @__PURE__ */ S("div", {
 				className: "grid grid-cols-2 gap-3 sm:gap-4 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ v("div", {
+					/* @__PURE__ */ S("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3 sm:p-4",
-						children: [/* @__PURE__ */ _("p", {
+						children: [/* @__PURE__ */ x("p", {
 							className: "text-xs text-text-secondary",
 							children: "Active Opportunities"
-						}), /* @__PURE__ */ _("p", {
+						}), /* @__PURE__ */ x("p", {
 							className: "text-lg font-bold text-text-primary sm:text-2xl",
-							children: V.totalOpportunities
+							children: K.totalOpportunities
 						})]
 					}),
-					/* @__PURE__ */ v("div", {
+					/* @__PURE__ */ S("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3 sm:p-4",
-						children: [/* @__PURE__ */ _("p", {
+						children: [/* @__PURE__ */ x("p", {
 							className: "text-xs text-text-secondary",
 							children: "Average Returns"
-						}), /* @__PURE__ */ v("p", {
+						}), /* @__PURE__ */ S("p", {
 							className: "text-lg font-bold text-status-success-text sm:text-2xl",
-							children: [V.averageReturns, "%"]
+							children: [K.averageReturns, "%"]
 						})]
 					}),
-					/* @__PURE__ */ v("div", {
+					/* @__PURE__ */ S("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3 sm:p-4",
-						children: [/* @__PURE__ */ _("p", {
+						children: [/* @__PURE__ */ x("p", {
 							className: "text-xs text-text-secondary",
 							children: "Total Funded"
-						}), /* @__PURE__ */ _("p", {
+						}), /* @__PURE__ */ x("p", {
 							className: "text-lg font-bold text-text-primary sm:text-2xl",
-							children: o(V.totalFunded, {
+							children: o(K.totalFunded, {
 								minimumFractionDigits: 0,
 								notation: "compact"
 							})
 						})]
 					}),
-					/* @__PURE__ */ v("div", {
+					/* @__PURE__ */ S("div", {
 						className: "rounded-lg border border-border-subtle bg-bg-surface p-3 sm:p-4",
-						children: [/* @__PURE__ */ _("p", {
+						children: [/* @__PURE__ */ x("p", {
 							className: "text-xs text-text-secondary",
 							children: "Total Target"
-						}), /* @__PURE__ */ _("p", {
+						}), /* @__PURE__ */ x("p", {
 							className: "text-lg font-bold text-text-primary sm:text-2xl",
-							children: o(V.totalTarget, {
+							children: o(K.totalTarget, {
 								minimumFractionDigits: 0,
 								notation: "compact"
 							})
@@ -235,124 +237,124 @@ function T() {
 					})
 				]
 			})] }),
-			/* @__PURE__ */ _("div", {
+			/* @__PURE__ */ x("div", {
 				className: "mt-6 rounded-lg border border-border-subtle bg-bg-surface p-4 sm:p-6",
-				children: /* @__PURE__ */ v("div", {
+				children: /* @__PURE__ */ S("div", {
 					className: "grid grid-cols-1 gap-3 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5",
 					children: [
-						/* @__PURE__ */ v("div", {
+						/* @__PURE__ */ S("div", {
 							className: "relative sm:col-span-2 lg:col-span-1",
-							children: [/* @__PURE__ */ _(h, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ _("input", {
+							children: [/* @__PURE__ */ x(_, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ x("input", {
 								type: "text",
 								placeholder: "Search opportunities...",
-								value: R.searchQuery,
-								onChange: (e) => H("searchQuery", e.target.value),
+								value: U.searchQuery,
+								onChange: (e) => q("searchQuery", e.target.value),
 								className: "w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-10 pr-4 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 							})]
 						}),
-						/* @__PURE__ */ v("select", {
-							value: R.category,
-							onChange: (e) => H("category", e.target.value),
+						/* @__PURE__ */ S("select", {
+							value: U.category,
+							onChange: (e) => q("category", e.target.value),
 							className: "rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
 							children: [
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "",
 									children: "All Categories"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "Healthy Food",
 									children: "Healthy Food"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "Fast Food",
 									children: "Fast Food"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "Fusion Food",
 									children: "Fusion Food"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "Beverages",
 									children: "Beverages"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "Street Food",
 									children: "Street Food"
 								})
 							]
 						}),
-						/* @__PURE__ */ v("select", {
-							value: R.riskLevel,
-							onChange: (e) => H("riskLevel", e.target.value),
+						/* @__PURE__ */ S("select", {
+							value: U.riskLevel,
+							onChange: (e) => q("riskLevel", e.target.value),
 							className: "rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
 							children: [
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "",
 									children: "All Risk Levels"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "low",
 									children: "Low Risk"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "medium",
 									children: "Medium Risk"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "high",
 									children: "High Risk"
 								})
 							]
 						}),
-						/* @__PURE__ */ v("select", {
-							value: R.minimumAmount,
-							onChange: (e) => H("minimumAmount", e.target.value),
+						/* @__PURE__ */ S("select", {
+							value: U.minimumAmount,
+							onChange: (e) => q("minimumAmount", e.target.value),
 							className: "rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
 							children: [
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "",
 									children: "Any Amount"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "15000",
 									children: "Under ₹15,000"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "25000",
 									children: "Under ₹25,000"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "50000",
 									children: "Under ₹50,000"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "100000",
 									children: "Under ₹1,00,000"
 								})
 							]
 						}),
-						/* @__PURE__ */ v("select", {
-							value: R.sortBy,
-							onChange: (e) => H("sortBy", e.target.value),
+						/* @__PURE__ */ S("select", {
+							value: U.sortBy,
+							onChange: (e) => q("sortBy", e.target.value),
 							className: "rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
 							children: [
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "featured",
 									children: "Featured"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "returns",
 									children: "Highest Returns"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "funding",
 									children: "Most Funded"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "closing",
 									children: "Closing Soon"
 								}),
-								/* @__PURE__ */ _("option", {
+								/* @__PURE__ */ x("option", {
 									value: "minimum",
 									children: "Lowest Minimum"
 								})
@@ -361,15 +363,15 @@ function T() {
 					]
 				})
 			}),
-			U.length === 0 ? /* @__PURE__ */ _("div", {
+			J.length === 0 ? /* @__PURE__ */ x("div", {
 				className: "mt-6",
-				children: /* @__PURE__ */ _(r, {
-					icon: /* @__PURE__ */ _(h, { className: "h-10 w-10" }),
+				children: /* @__PURE__ */ x(r, {
+					icon: /* @__PURE__ */ x(_, { className: "h-10 w-10" }),
 					title: "No opportunities found",
 					description: "Try adjusting your filters to find more opportunities",
-					action: /* @__PURE__ */ _("button", {
+					action: /* @__PURE__ */ x("button", {
 						type: "button",
-						onClick: () => z({
+						onClick: () => W({
 							searchQuery: "",
 							category: "",
 							riskLevel: "",
@@ -380,291 +382,316 @@ function T() {
 						children: "Clear Filters"
 					})
 				})
-			}) : /* @__PURE__ */ _("div", {
-				className: "mt-6 grid grid-cols-1 gap-4 lg:grid-cols-2",
-				children: U.map((e) => {
-					let n = w(e.raisedAmount, e.targetAmount);
-					return /* @__PURE__ */ v("div", {
-						className: "rounded-lg border border-border-subtle bg-bg-surface shadow-sm hover:shadow-md transition-shadow",
-						children: [/* @__PURE__ */ v("div", {
-							className: "relative",
-							children: [
-								/* @__PURE__ */ _("div", {
-									className: "flex h-40 w-full items-center justify-center overflow-hidden rounded-t-lg bg-bg-sunken sm:h-48",
-									children: /* @__PURE__ */ _(u, { className: "h-10 w-10 text-text-secondary" })
-								}),
-								e.status === "funded" && /* @__PURE__ */ _("div", {
-									className: "absolute right-2 top-2 rounded-full bg-status-success-text px-2 py-1 text-xs font-medium text-white sm:right-4 sm:top-4 sm:px-3",
-									children: "Fully Funded"
-								}),
-								e.daysLeft > 0 && e.daysLeft <= 7 && /* @__PURE__ */ v("div", {
-									className: "absolute left-2 top-2 rounded-full bg-status-error-text px-2 py-1 text-xs font-medium text-white sm:left-4 sm:top-4 sm:px-3",
-									children: [e.daysLeft, " days left"]
-								})
-							]
-						}), /* @__PURE__ */ v("div", {
-							className: "p-4 sm:p-6",
-							children: [
-								/* @__PURE__ */ v("div", {
-									className: "mb-4 flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between",
-									children: [/* @__PURE__ */ v("div", {
-										className: "flex-1",
-										children: [
-											/* @__PURE__ */ _("h3", {
-												className: "text-base font-semibold text-text-primary sm:text-xl",
-												children: e.cartName
-											}),
-											/* @__PURE__ */ v("p", {
-												className: "text-xs text-text-secondary sm:text-sm",
-												children: ["by ", e.cartOwner]
-											}),
-											/* @__PURE__ */ v("div", {
-												className: "mt-2 flex flex-wrap items-center gap-2",
-												children: [/* @__PURE__ */ _("span", {
-													className: "text-xs text-text-secondary sm:text-sm",
-													children: e.category
-												}), /* @__PURE__ */ _("span", {
-													className: t("rounded-full px-2 py-0.5 text-xs font-medium", S(e.riskLevel)),
-													children: C(e.riskLevel)
-												})]
-											})
-										]
-									}), /* @__PURE__ */ v("div", {
-										className: "text-left sm:text-right",
-										children: [/* @__PURE__ */ v("p", {
-											className: "text-xl font-bold text-status-success-text sm:text-2xl",
-											children: [e.expectedReturns, "%"]
-										}), /* @__PURE__ */ _("p", {
-											className: "text-xs text-text-secondary",
-											children: "Expected Returns"
+			}) : /* @__PURE__ */ x("div", {
+				className: "mt-6 grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3",
+				children: J.map((e) => {
+					let n = k(e.raisedAmount, e.targetAmount), r = Math.max(0, e.targetAmount - e.raisedAmount), i = e.status === "funded";
+					return /* @__PURE__ */ S(w, {
+						treatment: "plain",
+						className: "flex flex-col p-5",
+						children: [
+							/* @__PURE__ */ S("div", {
+								className: "flex items-start gap-3",
+								children: [
+									/* @__PURE__ */ x("div", {
+										className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-[var(--color-accent-soft)]",
+										children: /* @__PURE__ */ x(d, { className: "h-5 w-5 text-text-primary" })
+									}),
+									/* @__PURE__ */ S("div", {
+										className: "min-w-0 flex-1",
+										children: [/* @__PURE__ */ x("p", {
+											className: "truncate text-xs text-text-secondary",
+											children: e.cartOwner || "Local business"
+										}), /* @__PURE__ */ x("h3", {
+											className: "truncate text-base font-semibold text-text-primary",
+											children: e.cartName
 										})]
-									})]
-								}),
-								/* @__PURE__ */ _("p", {
-									className: "mb-4 text-sm leading-relaxed text-text-secondary line-clamp-2",
-									children: e.description
-								}),
-								/* @__PURE__ */ v("div", {
-									className: "mb-4",
-									children: [
-										/* @__PURE__ */ v("div", {
-											className: "mb-1 flex justify-between text-xs sm:text-sm",
-											children: [/* @__PURE__ */ v("span", {
-												className: "font-medium text-text-primary",
-												children: [
-													o(e.raisedAmount, { minimumFractionDigits: 0 }),
-													" ",
-													"raised"
-												]
-											}), /* @__PURE__ */ v("span", {
-												className: "text-text-secondary",
-												children: ["of ", o(e.targetAmount, { minimumFractionDigits: 0 })]
-											})]
+									}),
+									/* @__PURE__ */ x("span", {
+										className: t("shrink-0 rounded-full px-2.5 py-1 text-xs font-semibold", D(e.riskLevel)),
+										children: O(e.riskLevel)
+									})
+								]
+							}),
+							e.description && /* @__PURE__ */ x("p", {
+								className: "mt-3 line-clamp-2 text-sm leading-relaxed text-text-secondary",
+								children: e.description
+							}),
+							/* @__PURE__ */ S("div", {
+								className: "mt-4 grid grid-cols-4 gap-2 rounded-lg border border-border-subtle bg-bg-sunken/40 p-3 text-center",
+								children: [
+									/* @__PURE__ */ S("div", { children: [
+										/* @__PURE__ */ x("div", {
+											className: "flex items-center justify-center gap-1 text-text-secondary",
+											children: /* @__PURE__ */ x(v, { className: "h-3.5 w-3.5" })
+										}),
+										/* @__PURE__ */ x("p", {
+											className: "mt-1 text-xs text-text-secondary",
+											children: "Target"
+										}),
+										/* @__PURE__ */ x("p", {
+											className: "text-sm font-bold text-text-primary",
+											children: o(e.targetAmount, {
+												minimumFractionDigits: 0,
+												notation: "compact"
+											})
+										})
+									] }),
+									/* @__PURE__ */ S("div", { children: [
+										/* @__PURE__ */ x("div", {
+											className: "flex items-center justify-center gap-1 text-text-secondary",
+											children: /* @__PURE__ */ x(h, { className: "h-3.5 w-3.5" })
+										}),
+										/* @__PURE__ */ x("p", {
+											className: "mt-1 text-xs text-text-secondary",
+											children: "Min"
 										}),
-										/* @__PURE__ */ _("div", {
-											className: "h-2 w-full overflow-hidden rounded-full bg-bg-sunken",
-											children: /* @__PURE__ */ _("div", {
-												className: "h-full rounded-full bg-action-primary-bg transition-all duration-300",
-												style: { width: `${n}%` }
+										/* @__PURE__ */ x("p", {
+											className: "text-sm font-bold text-text-primary",
+											children: o(e.minimumInvestment, {
+												minimumFractionDigits: 0,
+												notation: "compact"
 											})
+										})
+									] }),
+									/* @__PURE__ */ S("div", { children: [
+										/* @__PURE__ */ x("div", {
+											className: "flex items-center justify-center gap-1 text-text-secondary",
+											children: /* @__PURE__ */ x(y, { className: "h-3.5 w-3.5" })
+										}),
+										/* @__PURE__ */ x("p", {
+											className: "mt-1 text-xs text-text-secondary",
+											children: "Returns"
 										}),
-										/* @__PURE__ */ v("div", {
-											className: "mt-1 flex justify-between text-xs text-text-secondary",
-											children: [/* @__PURE__ */ v("span", { children: [e.investorCount, " investors"] }), /* @__PURE__ */ v("span", { children: [n.toFixed(0), "% funded"] })]
+										/* @__PURE__ */ S("p", {
+											className: "text-sm font-bold text-status-success-text",
+											children: [e.expectedReturns, "%"]
 										})
+									] }),
+									/* @__PURE__ */ S("div", { children: [
+										/* @__PURE__ */ x("div", {
+											className: "flex items-center justify-center gap-1 text-text-secondary",
+											children: /* @__PURE__ */ x(g, { className: "h-3.5 w-3.5" })
+										}),
+										/* @__PURE__ */ x("p", {
+											className: "mt-1 text-xs text-text-secondary",
+											children: "Lock-in"
+										}),
+										/* @__PURE__ */ S("p", {
+											className: "text-sm font-bold text-text-primary",
+											children: [e.paybackPeriod, "mo"]
+										})
+									] })
+								]
+							}),
+							/* @__PURE__ */ S("div", {
+								className: "mt-4",
+								children: [/* @__PURE__ */ x(s, {
+									height: 10,
+									showLegend: !1,
+									label: /* @__PURE__ */ S("span", {
+										className: "text-text-primary",
+										children: [
+											o(e.raisedAmount, { minimumFractionDigits: 0 }),
+											" ",
+											"raised"
+										]
+									}),
+									rightLabel: `${n.toFixed(0)}%`,
+									segments: [{
+										label: "Raised",
+										value: e.raisedAmount
+									}, {
+										label: "Remaining",
+										value: r,
+										color: "var(--color-bg-sunken)"
+									}]
+								}), /* @__PURE__ */ S("p", {
+									className: "mt-1.5 text-xs text-text-secondary",
+									children: [
+										e.investorCount,
+										" investors ·",
+										" ",
+										o(e.targetAmount, {
+											minimumFractionDigits: 0,
+											notation: "compact"
+										}),
+										" ",
+										"goal"
 									]
-								}),
-								/* @__PURE__ */ v("div", {
-									className: "mb-4 grid grid-cols-2 gap-2 text-center sm:gap-4",
-									children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
-										className: "text-sm font-bold text-text-primary sm:text-lg",
-										children: o(e.minimumInvestment, { minimumFractionDigits: 0 })
-									}), /* @__PURE__ */ _("p", {
-										className: "text-xs text-text-secondary",
-										children: "Min Investment"
-									})] }), /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("p", {
-										className: "text-sm font-bold text-text-primary sm:text-lg",
-										children: [e.paybackPeriod, " mo"]
-									}), /* @__PURE__ */ _("p", {
-										className: "text-xs text-text-secondary",
-										children: "Lock-in Period"
-									})] })]
-								}),
-								e.documents.length > 0 && /* @__PURE__ */ _("div", {
-									className: "mb-4 border-t border-border-subtle pt-3",
-									children: /* @__PURE__ */ v("div", {
-										className: "flex items-center gap-1.5 text-xs text-text-secondary",
-										children: [/* @__PURE__ */ _(p, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ v("span", { children: [e.documents.length, " documents available"] })]
-									})
-								}),
-								/* @__PURE__ */ v("div", {
-									className: "flex flex-col gap-2 sm:flex-row sm:gap-3",
-									children: [/* @__PURE__ */ _("button", {
-										type: "button",
-										onClick: () => G(e),
-										disabled: e.status === "funded",
-										className: t("flex-1 rounded-lg px-4 py-2.5 text-sm font-medium transition-colors", e.status === "funded" ? "cursor-not-allowed bg-bg-sunken text-text-secondary" : "bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90"),
-										children: e.status === "funded" ? "Fully Funded" : "Invest Now"
-									}), /* @__PURE__ */ v("button", {
-										type: "button",
-										onClick: () => T(`/investor/opportunity/${e.id}`),
-										className: "flex flex-1 items-center justify-center gap-2 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
-										children: [/* @__PURE__ */ _(f, { className: "h-4 w-4" }), "View Details"]
-									})]
-								})
-							]
-						})]
+								})]
+							}),
+							e.documents.length > 0 && /* @__PURE__ */ S("div", {
+								className: "mt-3 flex items-center gap-1.5 text-xs text-text-secondary",
+								children: [/* @__PURE__ */ x(m, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ S("span", { children: [e.documents.length, " documents available"] })]
+							}),
+							/* @__PURE__ */ S("div", {
+								className: "mt-auto flex flex-col gap-2 pt-4 sm:flex-row",
+								children: [/* @__PURE__ */ x("button", {
+									type: "button",
+									onClick: () => X(e),
+									disabled: i,
+									className: t("flex-1 rounded-lg px-4 py-2.5 text-sm font-semibold transition-colors", i ? "cursor-not-allowed bg-bg-sunken text-text-secondary" : "bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg-hover"),
+									children: i ? "Fully Funded" : "Invest"
+								}), /* @__PURE__ */ S("button", {
+									type: "button",
+									onClick: () => A(`/investor/opportunity/${e.id}`),
+									className: "flex flex-1 items-center justify-center gap-2 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
+									children: [/* @__PURE__ */ x(p, { className: "h-4 w-4" }), "Details"]
+								})]
+							})
+						]
 					}, e.id);
 				})
 			}),
-			M && A && /* @__PURE__ */ _("div", {
+			L && F && /* @__PURE__ */ x("div", {
 				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4",
-				children: /* @__PURE__ */ v("div", {
+				children: /* @__PURE__ */ S("div", {
 					className: "relative max-h-[90vh] w-full max-w-md overflow-y-auto rounded-lg border border-border-subtle bg-bg-surface p-4 sm:p-6",
 					children: [
-						/* @__PURE__ */ _("button", {
+						/* @__PURE__ */ x("button", {
 							type: "button",
 							onClick: () => {
-								N(!1), F(""), L("idle");
+								R(!1), B(""), H("idle");
 							},
 							className: "absolute right-3 top-3 rounded-lg p-1 text-text-secondary hover:bg-accent transition-colors",
-							children: /* @__PURE__ */ _(g, { className: "h-5 w-5" })
+							children: /* @__PURE__ */ x(b, { className: "h-5 w-5" })
 						}),
-						/* @__PURE__ */ v("h3", {
+						/* @__PURE__ */ S("h3", {
 							className: "mb-4 text-base font-semibold text-text-primary sm:text-lg",
-							children: ["Invest in ", A.cartName]
+							children: ["Invest in ", F.cartName]
 						}),
-						I === "success" ? /* @__PURE__ */ v("div", {
+						V === "success" ? /* @__PURE__ */ S("div", {
 							className: "py-8 text-center",
 							children: [
-								/* @__PURE__ */ _(d, { className: "mx-auto mb-3 h-12 w-12 text-status-success-text" }),
-								/* @__PURE__ */ _("p", {
+								/* @__PURE__ */ x(f, { className: "mx-auto mb-3 h-12 w-12 text-status-success-text" }),
+								/* @__PURE__ */ x("p", {
 									className: "text-sm font-medium text-text-primary",
 									children: "Investment successful!"
 								}),
-								/* @__PURE__ */ _("p", {
+								/* @__PURE__ */ x("p", {
 									className: "mt-1 text-xs text-text-secondary",
 									children: "Redirecting to your portfolio..."
 								})
 							]
-						}) : /* @__PURE__ */ v("div", {
+						}) : /* @__PURE__ */ S("div", {
 							className: "space-y-4",
 							children: [
-								/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("p", {
+								/* @__PURE__ */ S("div", { children: [/* @__PURE__ */ x("p", {
 									className: "mb-1 text-xs text-text-secondary sm:text-sm",
 									children: "Investment Range"
-								}), /* @__PURE__ */ v("p", {
+								}), /* @__PURE__ */ S("p", {
 									className: "text-sm font-medium text-text-primary sm:text-base",
 									children: [
-										o(A.minimumInvestment, { minimumFractionDigits: 0 }),
+										o(F.minimumInvestment, { minimumFractionDigits: 0 }),
 										" ",
 										"-",
 										" ",
-										o(A.maximumInvestment, { minimumFractionDigits: 0 })
+										o(F.maximumInvestment, { minimumFractionDigits: 0 })
 									]
 								})] }),
-								/* @__PURE__ */ v("div", { children: [
-									/* @__PURE__ */ _("label", {
+								/* @__PURE__ */ S("div", { children: [
+									/* @__PURE__ */ x("label", {
 										className: "mb-1 block text-xs font-medium text-text-primary sm:text-sm",
 										children: "Investment Amount"
 									}),
-									/* @__PURE__ */ v("div", {
+									/* @__PURE__ */ S("div", {
 										className: "relative",
-										children: [/* @__PURE__ */ _(m, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ _("input", {
+										children: [/* @__PURE__ */ x(h, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary" }), /* @__PURE__ */ x("input", {
 											type: "number",
-											value: P,
+											value: z,
 											onChange: (e) => {
-												F(e.target.value), L("idle");
+												B(e.target.value), H("idle");
 											},
 											placeholder: "Enter amount",
 											className: "w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-10 pr-4 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
 										})]
 									}),
-									I === "error" && /* @__PURE__ */ v("p", {
+									V === "error" && /* @__PURE__ */ S("p", {
 										className: "mt-1 text-xs text-status-error-text",
 										children: [
 											"Amount must be between",
 											" ",
-											o(A.minimumInvestment, { minimumFractionDigits: 0 }),
+											o(F.minimumInvestment, { minimumFractionDigits: 0 }),
 											" ",
 											"and",
 											" ",
-											o(A.maximumInvestment, { minimumFractionDigits: 0 })
+											o(F.maximumInvestment, { minimumFractionDigits: 0 })
 										]
 									})
 								] }),
-								P && !isNaN(parseInt(P, 10)) && parseInt(P, 10) > 0 && /* @__PURE__ */ v("div", {
+								z && !isNaN(parseInt(z, 10)) && parseInt(z, 10) > 0 && /* @__PURE__ */ S("div", {
 									className: "rounded-lg border border-border-subtle bg-bg-sunken/50 p-3 sm:p-4",
-									children: [/* @__PURE__ */ _("p", {
+									children: [/* @__PURE__ */ x("p", {
 										className: "mb-2 text-xs text-text-secondary sm:text-sm",
 										children: "Expected Returns"
-									}), /* @__PURE__ */ v("div", {
+									}), /* @__PURE__ */ S("div", {
 										className: "space-y-1.5",
 										children: [
-											/* @__PURE__ */ v("div", {
+											/* @__PURE__ */ S("div", {
 												className: "flex justify-between",
-												children: [/* @__PURE__ */ _("span", {
+												children: [/* @__PURE__ */ x("span", {
 													className: "text-xs text-text-primary sm:text-sm",
 													children: "Investment:"
-												}), /* @__PURE__ */ _("span", {
+												}), /* @__PURE__ */ x("span", {
 													className: "text-xs font-medium text-text-primary sm:text-sm",
-													children: o(parseInt(P, 10), { minimumFractionDigits: 0 })
+													children: o(parseInt(z, 10), { minimumFractionDigits: 0 })
 												})]
 											}),
-											/* @__PURE__ */ v("div", {
+											/* @__PURE__ */ S("div", {
 												className: "flex justify-between",
-												children: [/* @__PURE__ */ v("span", {
+												children: [/* @__PURE__ */ S("span", {
 													className: "text-xs text-text-primary sm:text-sm",
 													children: [
 														"Expected Return (",
-														A.expectedReturns,
+														F.expectedReturns,
 														"%):"
 													]
-												}), /* @__PURE__ */ v("span", {
+												}), /* @__PURE__ */ S("span", {
 													className: "text-xs font-medium text-status-success-text sm:text-sm",
-													children: ["+", o(parseInt(P, 10) * A.expectedReturns / 100, { minimumFractionDigits: 0 })]
+													children: ["+", o(parseInt(z, 10) * F.expectedReturns / 100, { minimumFractionDigits: 0 })]
 												})]
 											}),
-											/* @__PURE__ */ v("div", {
+											/* @__PURE__ */ S("div", {
 												className: "flex justify-between border-t border-border-subtle pt-2",
-												children: [/* @__PURE__ */ _("span", {
+												children: [/* @__PURE__ */ x("span", {
 													className: "text-xs font-medium text-text-primary sm:text-sm",
 													children: "Total Value:"
-												}), /* @__PURE__ */ _("span", {
+												}), /* @__PURE__ */ x("span", {
 													className: "text-xs font-bold text-text-primary sm:text-sm",
-													children: o(parseInt(P, 10) * (1 + A.expectedReturns / 100), { minimumFractionDigits: 0 })
+													children: o(parseInt(z, 10) * (1 + F.expectedReturns / 100), { minimumFractionDigits: 0 })
 												})]
 											})
 										]
 									})]
 								}),
-								/* @__PURE__ */ v("div", {
+								/* @__PURE__ */ S("div", {
 									className: "space-y-1 text-xs text-text-secondary sm:text-sm",
-									children: [/* @__PURE__ */ v("p", { children: [
+									children: [/* @__PURE__ */ S("p", { children: [
 										"• Minimum lock-in period:",
 										" ",
-										A.investmentTerms.lockInPeriod,
+										F.investmentTerms.lockInPeriod,
 										" months"
-									] }), /* @__PURE__ */ v("p", { children: [
+									] }), /* @__PURE__ */ S("p", { children: [
 										"• Expected returns: ",
-										A.expectedReturns,
+										F.expectedReturns,
 										"% over the lock-in period"
 									] })]
 								}),
-								/* @__PURE__ */ v("div", {
+								/* @__PURE__ */ S("div", {
 									className: "flex flex-col gap-2 pt-2 sm:flex-row sm:gap-3",
-									children: [/* @__PURE__ */ _("button", {
+									children: [/* @__PURE__ */ x("button", {
 										type: "button",
 										onClick: () => {
-											N(!1), F(""), L("idle");
+											R(!1), B(""), H("idle");
 										},
 										className: "flex-1 rounded-lg border border-border-subtle px-4 py-2.5 text-sm font-medium text-text-primary hover:bg-accent transition-colors",
 										children: "Cancel"
-									}), /* @__PURE__ */ _("button", {
+									}), /* @__PURE__ */ x("button", {
 										type: "button",
-										onClick: W,
-										disabled: !P || isNaN(parseInt(P, 10)) || parseInt(P, 10) < A.minimumInvestment,
-										className: t("flex-1 rounded-lg px-4 py-2.5 text-sm font-medium transition-colors", !P || isNaN(parseInt(P, 10)) || parseInt(P, 10) < A.minimumInvestment ? "cursor-not-allowed bg-bg-sunken text-text-secondary" : "bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90"),
+										onClick: Y,
+										disabled: !z || isNaN(parseInt(z, 10)) || parseInt(z, 10) < F.minimumInvestment,
+										className: t("flex-1 rounded-lg px-4 py-2.5 text-sm font-medium transition-colors", !z || isNaN(parseInt(z, 10)) || parseInt(z, 10) < F.minimumInvestment ? "cursor-not-allowed bg-bg-sunken text-text-secondary" : "bg-action-primary-bg text-action-primary-text hover:bg-action-primary-bg/90"),
 										children: "Confirm Investment"
 									})]
 								})
@@ -677,6 +704,6 @@ function T() {
 	});
 }
 //#endregion
-export { T as InvestmentOpportunitiesPage };
+export { A as InvestmentOpportunitiesPage };
 
 //# sourceMappingURL=InvestmentOpportunitiesPage.js.map