npm - @burdenoff/microfe-crewfoundry - Versions diffs - 2026.624.1 → 2026.625.2 - Mend

@burdenoff/microfe-crewfoundry 2026.624.1 → 2026.625.2

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 (131) hide show

package/dist/crewfoundry/pages/PaymentsEscrowPagePage.js CHANGED Viewed

@@ -2,11 +2,11 @@ import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { useMemo as t } from "react";
 import { DollarSign as n, Lock as r, ShieldCheck as i } from "lucide-react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Badge as s, Card as c, CardContent as l, CardHeader as u, CardTitle as d } from "@burdenoff/fe-libs/ui";
+import { Badge as s, Card as c, CardContent as l, CardHeader as u, CardTitle as d, GlassCard as f, GradientText as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/PaymentsEscrowPagePage.tsx
-function f() {
-	let { projects: f, invoices: p, payrollRecords: m } = e(), h = t(() => f.slice(0, 10).map((e, t) => {
-		let n = p[t % Math.max(p.length, 1)], r = m[t % Math.max(m.length, 1)], i = Math.max(e.budget || 0, n?.amount || 0, 1e3), a = Math.min(e.spent || 0, i), o = Math.max(0, Math.round(e.progress / 100 * 5)), s = Math.max(o + 1, 3), c = a >= i ? "completed" : a > 0 ? "active" : r?.status === "approved" ? "funded" : "active";
+function h() {
+	let { projects: h, invoices: g, payrollRecords: _ } = e(), v = t(() => h.slice(0, 10).map((e, t) => {
+		let n = g[t % Math.max(g.length, 1)], r = _[t % Math.max(_.length, 1)], i = Math.max(e.budget || 0, n?.amount || 0, 1e3), a = Math.min(e.spent || 0, i), o = Math.max(0, Math.round(e.progress / 100 * 5)), s = Math.max(o + 1, 3), c = a >= i ? "completed" : a > 0 ? "active" : r?.status === "approved" ? "funded" : "active";
 		return {
 			id: e.id,
 			project: e.name,
@@ -18,58 +18,78 @@ function f() {
 			completedMilestones: Math.min(o, s)
 		};
 	}), [
-		p,
-		m,
-		f
-	]), g = h.reduce((e, t) => e + t.amount, 0), _ = h.reduce((e, t) => e + t.released, 0);
+		g,
+		_,
+		h
+	]), y = v.reduce((e, t) => e + t.amount, 0), b = v.reduce((e, t) => e + t.released, 0);
 	return /* @__PURE__ */ o("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h1", {
-				className: "text-2xl font-semibold",
-				children: "Escrow"
-			}), /* @__PURE__ */ a("p", {
-				className: "text-sm text-text-secondary",
-				children: "Secure payment holding for service contracts"
-			})] }),
+			/* @__PURE__ */ o("div", { children: [
+				/* @__PURE__ */ a("h1", {
+					className: "text-2xl font-semibold",
+					children: /* @__PURE__ */ a(p, { children: "Escrow" })
+				}),
+				/* @__PURE__ */ a("p", {
+					className: "text-sm text-text-secondary",
+					children: "Secure payment holding for service contracts"
+				}),
+				/* @__PURE__ */ a(m, {
+					className: "mt-1",
+					children: "Hold and release project funds safely in escrow — use it to protect both sides until milestones are met and work is approved."
+				})
+			] }),
 			/* @__PURE__ */ o("div", {
 				className: "grid gap-4 md:grid-cols-3",
 				children: [
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Total in Escrow"
-						}), /* @__PURE__ */ a(r, { className: "h-4 w-4 text-text-secondary" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", g.toLocaleString()]
-					}) })] }),
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Released"
-						}), /* @__PURE__ */ a(n, { className: "h-4 w-4 text-green-500" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", _.toLocaleString()]
-					}) })] }),
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Held"
-						}), /* @__PURE__ */ a(i, { className: "h-4 w-4 text-blue-500" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", (g - _).toLocaleString()]
-					}) })] })
+					/* @__PURE__ */ o(f, {
+						treatment: "glass",
+						glow: !0,
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Total in Escrow"
+							}), /* @__PURE__ */ a(r, { className: "h-4 w-4 text-text-secondary" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", y.toLocaleString()]
+						}) })]
+					}),
+					/* @__PURE__ */ o(f, {
+						treatment: "metric",
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Released"
+							}), /* @__PURE__ */ a(n, { className: "h-4 w-4 text-status-success-text" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", b.toLocaleString()]
+						}) })]
+					}),
+					/* @__PURE__ */ o(f, {
+						treatment: "metric",
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Held"
+							}), /* @__PURE__ */ a(i, { className: "h-4 w-4 text-status-info-text" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", (y - b).toLocaleString()]
+						}) })]
+					})
 				]
 			}),
 			/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ a(u, { children: /* @__PURE__ */ a(d, { children: "Escrow Transactions" }) }), /* @__PURE__ */ a(l, {
 				className: "space-y-3",
-				children: h.map((e) => {
+				children: v.map((e) => {
 					let t = e.amount === 0 ? 0 : Math.round(e.released / e.amount * 100);
 					return /* @__PURE__ */ o("div", {
 						className: "rounded border p-4",
@@ -93,7 +113,7 @@ function f() {
 								children: [
 									/* @__PURE__ */ o("span", { children: ["Total: $", e.amount.toLocaleString()] }),
 									/* @__PURE__ */ o("span", {
-										className: "text-green-600",
+										className: "text-status-success-text",
 										children: ["Released: $", e.released.toLocaleString()]
 									}),
 									/* @__PURE__ */ o("span", {
@@ -115,7 +135,7 @@ function f() {
 								}), /* @__PURE__ */ a("div", {
 									className: "h-2 overflow-hidden rounded bg-bg-sunken",
 									children: /* @__PURE__ */ a("div", {
-										className: "h-2 rounded bg-green-500",
+										className: "h-2 rounded bg-status-success-text",
 										style: { width: `${t}%` }
 									})
 								})]
@@ -128,6 +148,6 @@ function f() {
 	});
 }
 //#endregion
-export { f as PaymentsEscrowPagePage };
+export { h as PaymentsEscrowPagePage };
 //# sourceMappingURL=PaymentsEscrowPagePage.js.map

package/dist/crewfoundry/pages/PaymentsEscrowPagePage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaymentsEscrowPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsEscrowPagePage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { Badge, Card, CardContent, CardHeader, CardTitle } from '@burdenoff/fe-libs/ui';\nimport { DollarSign, Lock, ShieldCheck } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype EscrowTransaction = {\n id: string;\n project: string;\n provider: string;\n amount: number;\n released: number;\n status: 'active' \| 'funded' \| 'completed';\n milestones: number;\n completedMilestones: number;\n};\n\nexport function PaymentsEscrowPagePage() {\n const { projects, invoices, payrollRecords } = useCrewFoundryStore();\n\n const escrowTransactions = useMemo<EscrowTransaction[]>(() => {\n return projects.slice(0, 10).map((project, index) => {\n const invoice = invoices[index % Math.max(invoices.length, 1)];\n const payroll = payrollRecords[index % Math.max(payrollRecords.length, 1)];\n const amount = Math.max(project.budget \|\| 0, invoice?.amount \|\| 0, 1000);\n const released = Math.min(project.spent \|\| 0, amount);\n const completedMilestones = Math.max(0, Math.round((project.progress / 100) * 5));\n const milestones = Math.max(completedMilestones + 1, 3);\n const status: EscrowTransaction['status'] =\n released >= amount\n ? 'completed'\n : released > 0\n ? 'active'\n : payroll?.status === 'approved'\n ? 'funded'\n : 'active';\n\n return {\n id: project.id,\n project: project.name,\n provider: payroll?.employeeName \|\| project.managerName,\n amount,\n released,\n status,\n milestones,\n completedMilestones: Math.min(completedMilestones, milestones),\n };\n });\n }, [invoices, payrollRecords, projects]);\n\n const totalEscrow = escrowTransactions.reduce((sum, transaction) => sum + transaction.amount, 0);\n const totalReleased = escrowTransactions.reduce(\n (sum, transaction) => sum + transaction.released,\n 0\n );\n\n return (\n <div className=\"space-y-6 p-6\">\n <div>\n <h1 className=\"text-2xl font-semibold\">Escrow</h1>\n <p className=\"text-sm text-text-secondary\"~~>\n~~ Secure payment holding for service contracts\n </p>\n </div>\n\n <div className=\"grid gap-4 md:grid-cols-3\">\n <~~Card~~>\n <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n <CardTitle className=\"text-sm font-medium\">Total in Escrow</CardTitle>\n <Lock className=\"h-4 w-4 text-text-secondary\" />\n </CardHeader>\n <CardContent>\n <div className=\"text-2xl font-bold\">${totalEscrow.toLocaleString()}</div>\n </CardContent>\n </~~Card~~>\n <~~Card~~>\n <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n <CardTitle className=\"text-sm font-medium\">Released</CardTitle>\n <DollarSign className=\"h-4 w-4 text-~~green~~-~~500~~\" />\n </CardHeader>\n <CardContent>\n <div className=\"text-2xl font-bold\">${totalReleased.toLocaleString()}</div>\n </CardContent>\n </~~Card~~>\n <~~Card~~>\n <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n <CardTitle className=\"text-sm font-medium\">Held</CardTitle>\n <ShieldCheck className=\"h-4 w-4 text-~~blue~~-~~500~~\" />\n </CardHeader>\n <CardContent>\n <div className=\"text-2xl font-bold\">\n ${(totalEscrow - totalReleased).toLocaleString()}\n </div>\n </CardContent>\n </~~Card~~>\n </div>\n\n <Card>\n <CardHeader>\n <CardTitle>Escrow Transactions</CardTitle>\n </CardHeader>\n <CardContent className=\"space-y-3\">\n {escrowTransactions.map((escrow) => {\n const progress =\n escrow.amount === 0 ? 0 : Math.round((escrow.released / escrow.amount) * 100);\n\n return (\n <div key={escrow.id} className=\"rounded border p-4\">\n <div className=\"mb-2 flex items-center justify-between\">\n <div>\n <p className=\"text-sm font-medium\">{escrow.project}</p>\n <p className=\"text-xs text-text-secondary\">{escrow.provider}</p>\n </div>\n <Badge\n variant={\n escrow.status === 'active'\n ? 'default'\n : escrow.status === 'completed'\n ? 'secondary'\n : 'outline'\n }\n className=\"text-[10px]\"\n >\n {escrow.status}\n </Badge>\n </div>\n\n <div className=\"flex items-center gap-4 text-sm\">\n <span>Total: ${escrow.amount.toLocaleString()}</span>\n <span className=\"text-~~green~~-~~600~~\">\n Released: ${escrow.released.toLocaleString()}\n </span>\n <span className=\"text-text-secondary\">\n Held: ${(escrow.amount - escrow.released).toLocaleString()}\n </span>\n </div>\n\n <div className=\"mt-2\">\n <div className=\"mb-1 flex justify-between text-xs\">\n <span>\n Milestones: {escrow.completedMilestones}/{escrow.milestones}\n </span>\n <span>{progress}%</span>\n </div>\n <div className=\"h-2 overflow-hidden rounded bg-bg-sunken\">\n <div className=\"h-2 rounded bg-~~green~~-~~500~~\" style={{ width: `${progress}%` }} />\n </div>\n </div>\n </div>\n );\n })}\n </CardContent>\n </Card>\n </div>\n );\n}\n"],"mappings":";;;;;;~~AAgBA~~,SAAgB,IAAyB;CACvC,IAAM,EAAE,aAAU,aAAU,sBAAmB,GAAqB,EAE9D,IAAqB,QAClB,EAAS,MAAM,GAAG,GAAG,CAAC,KAAK,GAAS,MAAU;EACnD,IAAM,IAAU,EAAS,IAAQ,KAAK,IAAI,EAAS,QAAQ,EAAE,GACvD,IAAU,EAAe,IAAQ,KAAK,IAAI,EAAe,QAAQ,EAAE,GACnE,IAAS,KAAK,IAAI,EAAQ,UAAU,GAAG,GAAS,UAAU,GAAG,IAAK,EAClE,IAAW,KAAK,IAAI,EAAQ,SAAS,GAAG,EAAO,EAC/C,IAAsB,KAAK,IAAI,GAAG,KAAK,MAAO,EAAQ,WAAW,MAAO,EAAE,CAAC,EAC3E,IAAa,KAAK,IAAI,IAAsB,GAAG,EAAE,EACjD,IACJ,KAAY,IACR,cACA,IAAW,IACT,WACA,GAAS,WAAW,aAClB,WACA;AAEV,SAAO;GACL,IAAI,EAAQ;GACZ,SAAS,EAAQ;GACjB,UAAU,GAAS,gBAAgB,EAAQ;GAC3C;GACA;GACA;GACA;GACA,qBAAqB,KAAK,IAAI,GAAqB,EAAW;GAC/D;GACD,EACD;EAAC;EAAU;EAAgB;EAAS,CAAC,EAElC,IAAc,EAAmB,QAAQ,GAAK,MAAgB,IAAM,EAAY,QAAQ,EAAE,EAC1F,IAAgB,EAAmB,QACtC,GAAK,MAAgB,IAAM,EAAY,UACxC,EACD;AAED,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,OAAD,EAAA,UAAA,~~CACE,~~kBAAC,MAAD;~~IAAI~~,WAAU;~~cAAyB~~;~~IAAW~~,CAAA,~~EAClD,~~kBAAC,KAAD;~~IAAG~~,WAAU;~~cAA8B~~;~~IAEvC~~,CAAA,~~CACA~~,EAAA,CAAA;GAEN,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,GAAD,~~EAAA~~,~~UAAA~~,CACE,kBAAC,GAAD;~~MAAY~~,WAAU;~~gBAAtB~~,CACE,kBAAC,GAAD;~~OAAW~~,WAAU;~~iBAAsB~~;~~OAA2B~~,CAAA,EACtE,kBAAC,GAAD,EAAM,WAAU,+BAAgC,CAAA,CACrC;~~SACb~~,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,~~CAAoC~~,KAAE,EAAY,gBAAgB,CAAO;~~SAC7D~~,CAAA,~~CACT~~,~~EAAA,CAAA;KACP,~~kBAAC,GAAD,~~EAAA~~,~~UAAA~~,CACE,kBAAC,GAAD;~~MAAY~~,WAAU;~~gBAAtB~~,CACE,kBAAC,GAAD;~~OAAW~~,WAAU;~~iBAAsB~~;~~OAAoB~~,CAAA,EAC/D,kBAAC,GAAD,EAAY,WAAU,~~0BAA2B~~,CAAA,~~CACtC~~;~~SACb~~,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,~~CAAoC~~,KAAE,EAAc,gBAAgB,CAAO;~~SAC/D~~,CAAA,~~CACT~~,~~EAAA,CAAA;KACP,~~kBAAC,GAAD,~~EAAA~~,~~UAAA~~,CACE,kBAAC,GAAD;~~MAAY~~,WAAU;~~gBAAtB~~,CACE,kBAAC,GAAD;~~OAAW~~,WAAU;~~iBAAsB~~;~~OAAgB~~,CAAA,EAC3D,kBAAC,GAAD,EAAa,WAAU,~~yBAA0B~~,CAAA,~~CACtC~~;~~SACb~~,kBAAC,GAAD,EAAA,UACE,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBAAf~~,~~CAAoC~~,~~MAC/B~~,IAAc,GAAe,gBAAgB,CAC5C;~~SACM~~,CAAA,~~CACT,EAAA,CAAA;KACH~~;;GAEN,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD,EAAA,UAAW,uBAA+B,CAAA,EAC/B,CAAA,EACb,kBAAC,GAAD;IAAa,WAAU;cACpB,EAAmB,KAAK,MAAW;KAClC,IAAM,IACJ,EAAO,WAAW,IAAI,IAAI,KAAK,MAAO,EAAO,WAAW,EAAO,SAAU,IAAI;AAE/E,YACE,kBAAC,OAAD;MAAqB,WAAU;gBAA/B;OACE,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,KAAD;SAAG,WAAU;mBAAuB,EAAO;SAAY,CAAA,EACvD,kBAAC,KAAD;SAAG,WAAU;mBAA+B,EAAO;SAAa,CAAA,CAC5D,EAAA,CAAA,EACN,kBAAC,GAAD;SACE,SACE,EAAO,WAAW,WACd,YACA,EAAO,WAAW,cAChB,cACA;SAER,WAAU;mBAET,EAAO;SACF,CAAA,CACJ;;OAEN,kBAAC,OAAD;QAAK,WAAU;kBAAf;SACE,kBAAC,QAAD,EAAA,UAAA,CAAM,YAAS,EAAO,OAAO,gBAAgB,CAAQ,EAAA,CAAA;SACrD,kBAAC,QAAD;UAAM,WAAU;oBAAhB,~~CAAiC~~,~~eACnB~~,EAAO,SAAS,gBAAgB,CACvC;;SACP,kBAAC,QAAD;UAAM,WAAU;oBAAhB,CAAsC,YAC3B,EAAO,SAAS,EAAO,UAAU,gBAAgB,CACrD;;SACH;;OAEN,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,QAAD,EAAA,UAAA;UAAM;UACS,EAAO;UAAoB;UAAE,EAAO;UAC5C,EAAA,CAAA,EACP,kBAAC,QAAD,EAAA,UAAA,CAAO,GAAS,IAAQ,EAAA,CAAA,CACpB;YACN,kBAAC,OAAD;SAAK,WAAU;mBACb,kBAAC,OAAD;~~UAAK~~,WAAU;~~UAA2B~~,OAAO,EAAE,OAAO,GAAG,EAAS,IAAI;~~UAAI~~,CAAA;~~SAC1E~~,CAAA,CACF;;OACF;~~QAzCI~~,EAAO,~~GAyCX~~;MAER;IACU,CAAA,CACT,EAAA,CAAA;GACH"}
1	+ {"version":3,"file":"PaymentsEscrowPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsEscrowPagePage.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n Badge,\n Card,\n CardContent,\n CardHeader,\n CardTitle,\n GlassCard,\n GradientText,\n PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { DollarSign, Lock, ShieldCheck } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\ntype EscrowTransaction = {\n id: string;\n project: string;\n provider: string;\n amount: number;\n released: number;\n status: 'active' \| 'funded' \| 'completed';\n milestones: number;\n completedMilestones: number;\n};\n\nexport function PaymentsEscrowPagePage() {\n const { projects, invoices, payrollRecords } = useCrewFoundryStore();\n\n const escrowTransactions = useMemo<EscrowTransaction[]>(() => {\n return projects.slice(0, 10).map((project, index) => {\n const invoice = invoices[index % Math.max(invoices.length, 1)];\n const payroll = payrollRecords[index % Math.max(payrollRecords.length, 1)];\n const amount = Math.max(project.budget \|\| 0, invoice?.amount \|\| 0, 1000);\n const released = Math.min(project.spent \|\| 0, amount);\n const completedMilestones = Math.max(0, Math.round((project.progress / 100) * 5));\n const milestones = Math.max(completedMilestones + 1, 3);\n const status: EscrowTransaction['status'] =\n released >= amount\n ? 'completed'\n : released > 0\n ? 'active'\n : payroll?.status === 'approved'\n ? 'funded'\n : 'active';\n\n return {\n id: project.id,\n project: project.name,\n provider: payroll?.employeeName \|\| project.managerName,\n amount,\n released,\n status,\n milestones,\n completedMilestones: Math.min(completedMilestones, milestones),\n };\n });\n }, [invoices, payrollRecords, projects]);\n\n const totalEscrow = escrowTransactions.reduce((sum, transaction) => sum + transaction.amount, 0);\n const totalReleased = escrowTransactions.reduce(\n (sum, transaction) => sum + transaction.released,\n 0\n );\n\n return (\n <div className=\"space-y-6 p-6\">\n <div>\n <h1 className=\"text-2xl font-semibold\">\n <GradientText>Escrow</GradientText>\n </h1>\n <p className=\"text-sm text-text-secondary\">Secure payment holding for service contracts</p>\n <PagePurpose className=\"mt-1\">Hold and release project funds safely in escrow — use it to protect both sides until milestones are met and work is approved.</PagePurpose>\n </div>\n\n <div className=\"grid gap-4 md:grid-cols-3\">\n <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n <CardTitle className=\"text-sm font-medium\">Total in Escrow</CardTitle>\n <Lock className=\"h-4 w-4 text-text-secondary\" />\n </CardHeader>\n <CardContent>\n <div className=\"text-2xl font-bold tabular-nums\">${totalEscrow.toLocaleString()}</div>\n </CardContent>\n </GlassCard>\n <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n <CardTitle className=\"text-sm font-medium\">Released</CardTitle>\n <DollarSign className=\"h-4 w-4 text-status-success-text\" />\n </CardHeader>\n <CardContent>\n <div className=\"text-2xl font-bold tabular-nums\">${totalReleased.toLocaleString()}</div>\n </CardContent>\n </GlassCard>\n <GlassCard treatment=\"metric\" className=\"border-border-seam\">\n <CardHeader className=\"flex flex-row items-center justify-between space-y-0 pb-2\">\n <CardTitle className=\"text-sm font-medium\">Held</CardTitle>\n <ShieldCheck className=\"h-4 w-4 text-status-info-text\" />\n </CardHeader>\n <CardContent>\n <div className=\"text-2xl font-bold tabular-nums\">\n ${(totalEscrow - totalReleased).toLocaleString()}\n </div>\n </CardContent>\n </GlassCard>\n </div>\n\n <Card>\n <CardHeader>\n <CardTitle>Escrow Transactions</CardTitle>\n </CardHeader>\n <CardContent className=\"space-y-3\">\n {escrowTransactions.map((escrow) => {\n const progress =\n escrow.amount === 0 ? 0 : Math.round((escrow.released / escrow.amount) * 100);\n\n return (\n <div key={escrow.id} className=\"rounded border p-4\">\n <div className=\"mb-2 flex items-center justify-between\">\n <div>\n <p className=\"text-sm font-medium\">{escrow.project}</p>\n <p className=\"text-xs text-text-secondary\">{escrow.provider}</p>\n </div>\n <Badge\n variant={\n escrow.status === 'active'\n ? 'default'\n : escrow.status === 'completed'\n ? 'secondary'\n : 'outline'\n }\n className=\"text-[10px]\"\n >\n {escrow.status}\n </Badge>\n </div>\n\n <div className=\"flex items-center gap-4 text-sm\">\n <span>Total: ${escrow.amount.toLocaleString()}</span>\n <span className=\"text-status-success-text\">\n Released: ${escrow.released.toLocaleString()}\n </span>\n <span className=\"text-text-secondary\">\n Held: ${(escrow.amount - escrow.released).toLocaleString()}\n </span>\n </div>\n\n <div className=\"mt-2\">\n <div className=\"mb-1 flex justify-between text-xs\">\n <span>\n Milestones: {escrow.completedMilestones}/{escrow.milestones}\n </span>\n <span>{progress}%</span>\n </div>\n <div className=\"h-2 overflow-hidden rounded bg-bg-sunken\">\n <div\n className=\"h-2 rounded bg-status-success-text\"\n style={{ width: `${progress}%` }}\n />\n </div>\n </div>\n </div>\n );\n })}\n </CardContent>\n </Card>\n </div>\n );\n}\n"],"mappings":"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"}

package/dist/crewfoundry/pages/PaymentsInvoicesPagePage.js CHANGED Viewed

@@ -1,79 +1,98 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { Plus as t } from "lucide-react";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { Badge as i, Button as a, Card as o, CardContent as s } from "@burdenoff/fe-libs/ui";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Badge as a, Button as o, CardContent as s, GlassCard as c, GradientText as l, IllustratedEmptyState as u, PagePurpose as d } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/PaymentsInvoicesPagePage.tsx
-function c() {
-	let { invoices: c } = e();
-	return /* @__PURE__ */ r("div", {
+function f() {
+	let { invoices: f } = e();
+	return /* @__PURE__ */ i("div", {
 		className: "space-y-6 p-6",
-		children: [/* @__PURE__ */ r("div", {
+		children: [/* @__PURE__ */ i("div", {
 			className: "flex items-center justify-between",
-			children: [/* @__PURE__ */ r("div", { children: [/* @__PURE__ */ n("h1", {
-				className: "text-2xl font-semibold",
-				children: "Invoices"
-			}), /* @__PURE__ */ r("p", {
-				className: "text-sm text-text-secondary",
-				children: [c.length, " invoices"]
-			})] }), /* @__PURE__ */ r(a, {
+			children: [/* @__PURE__ */ i("div", { children: [
+				/* @__PURE__ */ r("h1", {
+					className: "text-2xl font-semibold",
+					children: /* @__PURE__ */ r(l, { children: "Invoices" })
+				}),
+				/* @__PURE__ */ i("p", {
+					className: "text-sm text-text-secondary",
+					children: [f.length, " invoices"]
+				}),
+				/* @__PURE__ */ r(d, {
+					className: "mt-1",
+					children: "Create, send, and track invoices — see what's paid, pending, or overdue so you stay on top of getting paid."
+				})
+			] }), /* @__PURE__ */ i(o, {
 				size: "sm",
-				children: [/* @__PURE__ */ n(t, { className: "h-4 w-4 mr-1" }), "Create Invoice"]
+				children: [/* @__PURE__ */ r(t, { className: "h-4 w-4 mr-1" }), "Create Invoice"]
 			})]
-		}), /* @__PURE__ */ n(o, { children: /* @__PURE__ */ r(s, {
-			className: "p-0",
-			children: [/* @__PURE__ */ r("div", {
-				className: "grid grid-cols-6 gap-2 text-xs font-medium text-text-secondary p-4 border-b",
-				children: [
-					/* @__PURE__ */ n("span", { children: "Invoice #" }),
-					/* @__PURE__ */ n("span", { children: "Client" }),
-					/* @__PURE__ */ n("span", { children: "Items" }),
-					/* @__PURE__ */ n("span", {
-						className: "text-right",
-						children: "Amount"
-					}),
-					/* @__PURE__ */ n("span", { children: "Due Date" }),
-					/* @__PURE__ */ n("span", {
-						className: "text-center",
-						children: "Status"
+		}), /* @__PURE__ */ r(c, {
+			treatment: "glass",
+			glow: !0,
+			className: "border-border-seam",
+			children: /* @__PURE__ */ r(s, {
+				className: "p-0",
+				children: f.length === 0 ? /* @__PURE__ */ r("div", {
+					className: "p-6",
+					children: /* @__PURE__ */ r(u, {
+						illustration: "empty-data",
+						title: "No invoices yet",
+						description: "Create your first invoice to start getting paid."
 					})
-				]
-			}), c.map((e) => /* @__PURE__ */ r("div", {
-				className: "grid grid-cols-6 gap-2 py-3 px-4 border-b last:border-0 text-sm hover:bg-bg-sunken/50",
-				children: [
-					/* @__PURE__ */ n("span", {
-						className: "font-medium",
-						children: e.number
-					}),
-					/* @__PURE__ */ n("span", {
-						className: "text-text-secondary",
-						children: e.clientName
-					}),
-					/* @__PURE__ */ n("div", {
-						className: "text-xs text-text-secondary",
-						children: e.items.map((e) => e.description).join(", ")
-					}),
-					/* @__PURE__ */ r("span", {
-						className: "text-right font-medium",
-						children: ["$", e.amount.toLocaleString()]
-					}),
-					/* @__PURE__ */ n("span", {
-						className: "text-text-secondary",
-						children: e.dueDate
-					}),
-					/* @__PURE__ */ n("div", {
-						className: "text-center",
-						children: /* @__PURE__ */ n(i, {
-							variant: e.status === "paid" ? "default" : e.status === "overdue" ? "destructive" : e.status === "draft" ? "outline" : "secondary",
-							className: "text-[10px]",
-							children: e.status
+				}) : /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ i("div", {
+					className: "grid grid-cols-6 gap-2 text-xs font-medium text-text-secondary p-4 border-b",
+					children: [
+						/* @__PURE__ */ r("span", { children: "Invoice #" }),
+						/* @__PURE__ */ r("span", { children: "Client" }),
+						/* @__PURE__ */ r("span", { children: "Items" }),
+						/* @__PURE__ */ r("span", {
+							className: "text-right",
+							children: "Amount"
+						}),
+						/* @__PURE__ */ r("span", { children: "Due Date" }),
+						/* @__PURE__ */ r("span", {
+							className: "text-center",
+							children: "Status"
 						})
-					})
-				]
-			}, e.id))]
-		}) })]
+					]
+				}), f.map((e) => /* @__PURE__ */ i("div", {
+					className: "grid grid-cols-6 gap-2 py-3 px-4 border-b last:border-0 text-sm hover:bg-bg-sunken/50",
+					children: [
+						/* @__PURE__ */ r("span", {
+							className: "font-medium",
+							children: e.number
+						}),
+						/* @__PURE__ */ r("span", {
+							className: "text-text-secondary",
+							children: e.clientName
+						}),
+						/* @__PURE__ */ r("div", {
+							className: "text-xs text-text-secondary",
+							children: e.items.map((e) => e.description).join(", ")
+						}),
+						/* @__PURE__ */ i("span", {
+							className: "text-right font-medium",
+							children: ["$", e.amount.toLocaleString()]
+						}),
+						/* @__PURE__ */ r("span", {
+							className: "text-text-secondary",
+							children: e.dueDate
+						}),
+						/* @__PURE__ */ r("div", {
+							className: "text-center",
+							children: /* @__PURE__ */ r(a, {
+								variant: e.status === "paid" ? "default" : e.status === "overdue" ? "destructive" : e.status === "draft" ? "outline" : "secondary",
+								className: "text-[10px]",
+								children: e.status
+							})
+						})
+					]
+				}, e.id))] })
+			})
+		})]
 	});
 }
 //#endregion
-export { c as PaymentsInvoicesPagePage };
+export { f as PaymentsInvoicesPagePage };
 //# sourceMappingURL=PaymentsInvoicesPagePage.js.map

package/dist/crewfoundry/pages/PaymentsInvoicesPagePage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaymentsInvoicesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsInvoicesPagePage.tsx"],"sourcesContent":["import { Badge, Button~~, Card,~~ CardContent~~, CardHeader, CardTitle~~ } from '@burdenoff/fe-libs/ui';\nimport { FileText, Plus } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function PaymentsInvoicesPagePage() {\n const { invoices } = useCrewFoundryStore();\n\n return (\n <div className=\"space-y-6 p-6\">\n <div className=\"flex items-center justify-between\">\n <div>\n <h1 className=\"text-2xl font-semibold\">Invoices</h1>\n <p className=\"text-sm text-text-secondary\">{invoices.length} invoices</p>\n </div>\n <Button size=\"sm\">\n <Plus className=\"h-4 w-4 mr-1\" />\n Create Invoice\n </Button>\n </div>\n <~~Card~~>\n <CardContent className=\"p-0\">\n <div className=\"grid grid-cols-6 gap-2 text-xs font-medium text-text-secondary p-4 border-b\">\n <span>Invoice #</span>\n <span>Client</span>\n <span>Items</span>\n <span className=\"text-right\">Amount</span>\n <span>Due Date</span>\n <span className=\"text-center\">Status</span>\n </div>\n {invoices.map((inv) => (\n <div\n key={inv.id}\n className=\"grid grid-cols-6 gap-2 py-3 px-4 border-b last:border-0 text-sm hover:bg-bg-sunken/50\"\n >\n <span className=\"font-medium\">{inv.number}</span>\n <span className=\"text-text-secondary\">{inv.clientName}</span>\n <div className=\"text-xs text-text-secondary\">\n {inv.items.map((i) => i.description).join(', ')}\n </div>\n <span className=\"text-right font-medium\">${inv.amount.toLocaleString()}</span>\n <span className=\"text-text-secondary\">{inv.dueDate}</span>\n <div className=\"text-center\">\n <Badge\n variant={\n inv.status === 'paid'\n ? 'default'\n : inv.status === 'overdue'\n ? 'destructive'\n : inv.status === 'draft'\n ? 'outline'\n : 'secondary'\n }\n className=\"text-[10px]\"\n >\n {inv.status}\n </Badge>\n </div>\n </div>\n ))}\n </CardContent>\n </~~Card~~>\n </div>\n );\n}\n"],"mappings":";;;;;~~AAIA~~,SAAgB,IAA2B;CACzC,IAAM,EAAE,gBAAa,GAAqB;AAE1C,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD,EAAA,UAAA,~~CACE,~~kBAAC,MAAD;~~IAAI~~,WAAU;~~cAAyB~~;~~IAAa~~,CAAA,~~EACpD,~~kBAAC,KAAD;~~IAAG~~,WAAU;~~cAAb~~,CAA4C,EAAS,QAAO,YAAa;~~MACrE~~,EAAA,CAAA,EACN,kBAAC,GAAD;IAAQ,MAAK;cAAb,CACE,kBAAC,GAAD,EAAM,WAAU,gBAAiB,CAAA,EAAA,iBAE1B;MACL;MACN,kBAAC,GAAD,~~EAAA~~,~~UACE~~,kBAAC,GAAD;~~GAAa~~,WAAU;~~aAAvB~~,~~CACE~~,kBAAC,OAAD;~~IAAK~~,WAAU;~~cAAf~~;KACE,kBAAC,QAAD,EAAA,UAAM,aAAgB,CAAA;~~KACtB~~,kBAAC,QAAD,EAAA,UAAM,UAAa,CAAA;~~KACnB~~,kBAAC,QAAD,EAAA,UAAM,SAAY,CAAA;~~KAClB~~,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBAAa~~;~~MAAa~~,CAAA;~~KAC1C~~,kBAAC,QAAD,EAAA,UAAM,YAAe,CAAA;~~KACrB~~,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBAAc~~;~~MAAa~~,CAAA;~~KACvC~~;~~OACL~~,EAAS,KAAK,~~MACb~~,kBAAC,OAAD;~~IAEE~~,WAAU;~~cAFZ~~;~~KAIE~~,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBAAe~~,EAAI;~~MAAc~~,CAAA;~~KACjD~~,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBAAuB~~,EAAI;~~MAAkB~~,CAAA;~~KAC7D~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBACZ~~,EAAI,MAAM,KAAK,MAAM,EAAE,YAAY,CAAC,KAAK,KAAK;~~MAC3C~~,CAAA;~~KACN~~,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBAAhB~~,CAAyC,KAAE,EAAI,OAAO,gBAAgB,CAAQ;;~~KAC9E~~,kBAAC,QAAD;~~MAAM~~,WAAU;~~gBAAuB~~,EAAI;~~MAAe~~,CAAA;~~KAC1D~~,kBAAC,OAAD;~~MAAK~~,WAAU;~~gBACb~~,kBAAC,GAAD;~~OACE~~,SACE,EAAI,WAAW,SACX,YACA,EAAI,WAAW,YACb,gBACA,EAAI,WAAW,UACb,YACA;~~OAEV~~,WAAU;~~iBAET~~,EAAI;~~OACC~~,CAAA;~~MACJ~~,CAAA;~~KACF~~;~~MA1BC~~,EAAI,GA0BL,~~CACN~~,~~CACU~~;~~MACT~~,CAAA,~~CACH~~"}
1	+ {"version":3,"file":"PaymentsInvoicesPagePage.js","names":[],"sources":["../../../src/crewfoundry/pages/PaymentsInvoicesPagePage.tsx"],"sourcesContent":["import {\n Badge,\n Button,\n CardContent,\n GlassCard,\n GradientText,\n IllustratedEmptyState,\n PagePurpose,\n} from '@burdenoff/fe-libs/ui';\nimport { FileText, Plus } from 'lucide-react';\nimport { useCrewFoundryStore } from '../store/crewfoundryStore';\n\nexport function PaymentsInvoicesPagePage() {\n const { invoices } = useCrewFoundryStore();\n\n return (\n <div className=\"space-y-6 p-6\">\n <div className=\"flex items-center justify-between\">\n <div>\n <h1 className=\"text-2xl font-semibold\">\n <GradientText>Invoices</GradientText>\n </h1>\n <p className=\"text-sm text-text-secondary\">{invoices.length} invoices</p>\n <PagePurpose className=\"mt-1\">Create, send, and track invoices — see what's paid, pending, or overdue so you stay on top of getting paid.</PagePurpose>\n </div>\n <Button size=\"sm\">\n <Plus className=\"h-4 w-4 mr-1\" />\n Create Invoice\n </Button>\n </div>\n <GlassCard treatment=\"glass\" glow className=\"border-border-seam\">\n <CardContent className=\"p-0\">\n {invoices.length === 0 ? (\n <div className=\"p-6\">\n <IllustratedEmptyState\n illustration=\"empty-data\"\n title=\"No invoices yet\"\n description=\"Create your first invoice to start getting paid.\"\n />\n </div>\n ) : (\n <>\n <div className=\"grid grid-cols-6 gap-2 text-xs font-medium text-text-secondary p-4 border-b\">\n <span>Invoice #</span>\n <span>Client</span>\n <span>Items</span>\n <span className=\"text-right\">Amount</span>\n <span>Due Date</span>\n <span className=\"text-center\">Status</span>\n </div>\n {invoices.map((inv) => (\n <div\n key={inv.id}\n className=\"grid grid-cols-6 gap-2 py-3 px-4 border-b last:border-0 text-sm hover:bg-bg-sunken/50\"\n >\n <span className=\"font-medium\">{inv.number}</span>\n <span className=\"text-text-secondary\">{inv.clientName}</span>\n <div className=\"text-xs text-text-secondary\">\n {inv.items.map((i) => i.description).join(', ')}\n </div>\n <span className=\"text-right font-medium\">${inv.amount.toLocaleString()}</span>\n <span className=\"text-text-secondary\">{inv.dueDate}</span>\n <div className=\"text-center\">\n <Badge\n variant={\n inv.status === 'paid'\n ? 'default'\n : inv.status === 'overdue'\n ? 'destructive'\n : inv.status === 'draft'\n ? 'outline'\n : 'secondary'\n }\n className=\"text-[10px]\"\n >\n {inv.status}\n </Badge>\n </div>\n </div>\n ))}\n </>\n )}\n </CardContent>\n </GlassCard>\n </div>\n );\n}\n"],"mappings":";;;;;AAYA,SAAgB,IAA2B;CACzC,IAAM,EAAE,gBAAa,GAAqB;AAE1C,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf,CACE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,OAAD,EAAA,UAAA;IACE,kBAAC,MAAD;KAAI,WAAU;eACZ,kBAAC,GAAD,EAAA,UAAc,YAAuB,CAAA;KAClC,CAAA;IACL,kBAAC,KAAD;KAAG,WAAU;eAAb,CAA4C,EAAS,QAAO,YAAa;;IACzE,kBAAC,GAAD;KAAa,WAAU;eAAO;KAA8H,CAAA;IACxJ,EAAA,CAAA,EACN,kBAAC,GAAD;IAAQ,MAAK;cAAb,CACE,kBAAC,GAAD,EAAM,WAAU,gBAAiB,CAAA,EAAA,iBAE1B;MACL;MACN,kBAAC,GAAD;GAAW,WAAU;GAAQ,MAAA;GAAK,WAAU;aAC1C,kBAAC,GAAD;IAAa,WAAU;cACpB,EAAS,WAAW,IACnB,kBAAC,OAAD;KAAK,WAAU;eACb,kBAAC,GAAD;MACE,cAAa;MACb,OAAM;MACN,aAAY;MACZ,CAAA;KACE,CAAA,GAEN,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,OAAD;KAAK,WAAU;eAAf;MACE,kBAAC,QAAD,EAAA,UAAM,aAAgB,CAAA;MACtB,kBAAC,QAAD,EAAA,UAAM,UAAa,CAAA;MACnB,kBAAC,QAAD,EAAA,UAAM,SAAY,CAAA;MAClB,kBAAC,QAAD;OAAM,WAAU;iBAAa;OAAa,CAAA;MAC1C,kBAAC,QAAD,EAAA,UAAM,YAAe,CAAA;MACrB,kBAAC,QAAD;OAAM,WAAU;iBAAc;OAAa,CAAA;MACvC;QACL,EAAS,KAAK,MACjB,kBAAC,OAAD;KAEE,WAAU;eAFZ;MAIE,kBAAC,QAAD;OAAM,WAAU;iBAAe,EAAI;OAAc,CAAA;MACjD,kBAAC,QAAD;OAAM,WAAU;iBAAuB,EAAI;OAAkB,CAAA;MAC7D,kBAAC,OAAD;OAAK,WAAU;iBACZ,EAAI,MAAM,KAAK,MAAM,EAAE,YAAY,CAAC,KAAK,KAAK;OAC3C,CAAA;MACN,kBAAC,QAAD;OAAM,WAAU;iBAAhB,CAAyC,KAAE,EAAI,OAAO,gBAAgB,CAAQ;;MAC9E,kBAAC,QAAD;OAAM,WAAU;iBAAuB,EAAI;OAAe,CAAA;MAC1D,kBAAC,OAAD;OAAK,WAAU;iBACb,kBAAC,GAAD;QACE,SACE,EAAI,WAAW,SACX,YACA,EAAI,WAAW,YACb,gBACA,EAAI,WAAW,UACb,YACA;QAEV,WAAU;kBAET,EAAI;QACC,CAAA;OACJ,CAAA;MACF;OA1BC,EAAI,GA0BL,CACF,CACD,EAAA,CAAA;IAEO,CAAA;GACJ,CAAA,CACR"}

package/dist/crewfoundry/pages/PaymentsPaymentDashboardPagePage.js CHANGED Viewed

@@ -1,63 +1,87 @@
 import { useCrewFoundryStore as e } from "../store/crewfoundryStore.js";
 import { CreditCard as t, DollarSign as n, Receipt as r, TrendingUp as i } from "lucide-react";
 import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Badge as s, Card as c, CardContent as l, CardHeader as u, CardTitle as d } from "@burdenoff/fe-libs/ui";
+import { Badge as s, Card as c, CardContent as l, CardHeader as u, CardTitle as d, GlassCard as f, GradientText as p, PagePurpose as m } from "@burdenoff/fe-libs/ui";
 //#region src/crewfoundry/pages/PaymentsPaymentDashboardPagePage.tsx
-function f() {
-	let { invoices: f, payrollRecords: p } = e(), m = f.reduce((e, t) => e + t.amount, 0), h = f.filter((e) => e.status === "paid").reduce((e, t) => e + t.amount, 0), g = p.reduce((e, t) => e + t.grossPay, 0);
+function h() {
+	let { invoices: h, payrollRecords: g } = e(), _ = h.reduce((e, t) => e + t.amount, 0), v = h.filter((e) => e.status === "paid").reduce((e, t) => e + t.amount, 0), y = g.reduce((e, t) => e + t.grossPay, 0);
 	return /* @__PURE__ */ o("div", {
 		className: "space-y-6 p-6",
 		children: [
-			/* @__PURE__ */ o("div", { children: [/* @__PURE__ */ a("h1", {
-				className: "text-2xl font-semibold",
-				children: "Payment Dashboard"
-			}), /* @__PURE__ */ a("p", {
-				className: "text-sm text-text-secondary",
-				children: "Financial transactions and payment overview"
-			})] }),
+			/* @__PURE__ */ o("div", { children: [
+				/* @__PURE__ */ a("h1", {
+					className: "text-2xl font-semibold",
+					children: /* @__PURE__ */ a(p, { children: "Payment Dashboard" })
+				}),
+				/* @__PURE__ */ a("p", {
+					className: "text-sm text-text-secondary",
+					children: "Financial transactions and payment overview"
+				}),
+				/* @__PURE__ */ a(m, {
+					className: "mt-1",
+					children: "A snapshot of all money movement — incoming payments, payouts, and balances so you understand your financial position at a glance."
+				})
+			] }),
 			/* @__PURE__ */ o("div", {
 				className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4",
 				children: [
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Total Invoiced"
-						}), /* @__PURE__ */ a(r, { className: "h-4 w-4 text-text-secondary" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", m.toLocaleString()]
-					}) })] }),
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Collected"
-						}), /* @__PURE__ */ a(n, { className: "h-4 w-4 text-green-500" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", h.toLocaleString()]
-					}) })] }),
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Payroll Processed"
-						}), /* @__PURE__ */ a(t, { className: "h-4 w-4 text-text-secondary" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", g.toLocaleString()]
-					}) })] }),
-					/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ o(u, {
-						className: "flex flex-row items-center justify-between space-y-0 pb-2",
-						children: [/* @__PURE__ */ a(d, {
-							className: "text-sm font-medium",
-							children: "Outstanding"
-						}), /* @__PURE__ */ a(i, { className: "h-4 w-4 text-yellow-500" })]
-					}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
-						className: "text-2xl font-bold",
-						children: ["$", (m - h).toLocaleString()]
-					}) })] })
+					/* @__PURE__ */ o(f, {
+						treatment: "glass",
+						glow: !0,
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Total Invoiced"
+							}), /* @__PURE__ */ a(r, { className: "h-4 w-4 text-text-secondary" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", _.toLocaleString()]
+						}) })]
+					}),
+					/* @__PURE__ */ o(f, {
+						treatment: "metric",
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Collected"
+							}), /* @__PURE__ */ a(n, { className: "h-4 w-4 text-status-success-text" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", v.toLocaleString()]
+						}) })]
+					}),
+					/* @__PURE__ */ o(f, {
+						treatment: "metric",
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Payroll Processed"
+							}), /* @__PURE__ */ a(t, { className: "h-4 w-4 text-text-secondary" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", y.toLocaleString()]
+						}) })]
+					}),
+					/* @__PURE__ */ o(f, {
+						treatment: "metric",
+						className: "border-border-seam",
+						children: [/* @__PURE__ */ o(u, {
+							className: "flex flex-row items-center justify-between space-y-0 pb-2",
+							children: [/* @__PURE__ */ a(d, {
+								className: "text-sm font-medium",
+								children: "Outstanding"
+							}), /* @__PURE__ */ a(i, { className: "h-4 w-4 text-status-warning-text" })]
+						}), /* @__PURE__ */ a(l, { children: /* @__PURE__ */ o("div", {
+							className: "text-2xl font-bold tabular-nums",
+							children: ["$", (_ - v).toLocaleString()]
+						}) })]
+					})
 				]
 			}),
 			/* @__PURE__ */ o(c, { children: [/* @__PURE__ */ a(u, { children: /* @__PURE__ */ a(d, { children: "Recent Invoices" }) }), /* @__PURE__ */ o(l, { children: [/* @__PURE__ */ o("div", {
@@ -75,7 +99,7 @@ function f() {
 						children: "Status"
 					})
 				]
-			}), f.map((e) => /* @__PURE__ */ o("div", {
+			}), h.map((e) => /* @__PURE__ */ o("div", {
 				className: "grid grid-cols-5 gap-2 py-2 border-b last:border-0 text-sm",
 				children: [
 					/* @__PURE__ */ a("span", {
@@ -108,6 +132,6 @@ function f() {
 	});
 }
 //#endregion
-export { f as PaymentsPaymentDashboardPagePage };
+export { h as PaymentsPaymentDashboardPagePage };
 //# sourceMappingURL=PaymentsPaymentDashboardPagePage.js.map