@burdenoff/microfe-assethandler 2026.608.1 → 2026.625.1

package/dist/assethandler/pages/AnalyticsPage.js

@@ -1,174 +1,189 @@
 import { useAssetHandlerStore as e } from "../store/assethandlerStore.js";
 import { useState as t } from "react";
 import { Activity as n, ArrowUpRight as r, BarChart3 as i, Box as a, DollarSign as o, Download as s, PieChart as c, TrendingDown as l } from "lucide-react";
-import { Badge as u, Button as d, Card as f, CardContent as p, CardDescription as m, CardHeader as h, CardTitle as g, Separator as _, Tabs as v, TabsContent as y, TabsList as b, TabsTrigger as x } from "@burdenoff/fe-libs/ui";
-import { jsx as S, jsxs as C } from "react/jsx-runtime";
+import { Badge as u, CTAOverflowMenu as d, Card as f, CardContent as p, CardDescription as m, CardHeader as h, CardTitle as g, EmphasisPanel as _, GlassCard as v, GradientText as y, Separator as b, Tabs as x, TabsContent as S, TabsList as C, TabsTrigger as w } from "@burdenoff/fe-libs/ui";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
 //#region src/assethandler/pages/AnalyticsPage.tsx
-function w() {
-	let { assets: w, portfolio: T, transactions: E, incidents: D, maintenanceRecords: O, workflows: k } = e(), [A, j] = t("30d"), M = w.reduce((e, t) => e + t.currentValue, 0), N = w.reduce((e, t) => e + t.value, 0), P = N - M, F = N > 0 ? (P / N * 100).toFixed(1) : "0", I = w.length > 0 ? Math.round(M / w.length) : 0, L = w.reduce((e, t) => {
+function D() {
+	let { assets: D, portfolio: O, transactions: k, incidents: A, maintenanceRecords: j, workflows: M } = e(), [N, P] = t("30d"), F = D.reduce((e, t) => e + t.currentValue, 0), I = D.reduce((e, t) => e + t.value, 0), L = I - F, R = I > 0 ? (L / I * 100).toFixed(1) : "0", z = D.length > 0 ? Math.round(F / D.length) : 0, B = D.reduce((e, t) => {
 		let n = t.category.replace("_", " ");
 		return e[n] || (e[n] = {
 			count: 0,
 			value: 0
 		}), e[n].count++, e[n].value += t.currentValue, e;
-	}, {}), R = w.reduce((e, t) => (e[t.status] = (e[t.status] || 0) + 1, e), {}), z = w.reduce((e, t) => (e[t.department] || (e[t.department] = {
+	}, {}), V = D.reduce((e, t) => (e[t.status] = (e[t.status] || 0) + 1, e), {}), H = D.reduce((e, t) => (e[t.department] || (e[t.department] = {
 		count: 0,
 		value: 0
-	}), e[t.department].count++, e[t.department].value += t.currentValue, e), {}), B = D.filter((e) => e.status === "resolved" || e.status === "closed"), V = D.filter((e) => e.slaBreached), H = O.filter((e) => e.status === "completed"), U = O.reduce((e, t) => e + t.cost, 0);
-	return /* @__PURE__ */ C("div", {
+	}), e[t.department].count++, e[t.department].value += t.currentValue, e), {}), U = A.filter((e) => e.status === "resolved" || e.status === "closed"), W = A.filter((e) => e.slaBreached), G = j.filter((e) => e.status === "completed"), K = j.reduce((e, t) => e + t.cost, 0);
+	return /* @__PURE__ */ E("div", {
 		className: "space-y-6 p-6",
-		children: [/* @__PURE__ */ C("div", {
+		children: [/* @__PURE__ */ E("div", {
 			className: "flex items-center justify-between",
-			children: [/* @__PURE__ */ C("div", { children: [/* @__PURE__ */ S("h1", {
+			children: [/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h1", {
 				className: "text-3xl font-bold",
-				children: "Analytics & Business Intelligence"
-			}), /* @__PURE__ */ S("p", {
-				className: "text-sm text-muted-foreground mt-1",
+				children: /* @__PURE__ */ T(y, { children: "Analytics & Business Intelligence" })
+			}), /* @__PURE__ */ T("p", {
+				className: "text-sm text-text-secondary mt-1",
 				children: "Comprehensive asset management analytics and insights"
-			})] }), /* @__PURE__ */ C("div", {
+			})] }), /* @__PURE__ */ E("div", {
 				className: "flex gap-2",
-				children: [
-					/* @__PURE__ */ C("select", {
-						value: A,
-						onChange: (e) => j(e.target.value),
-						className: "rounded-md border border-input bg-background px-3 py-1.5 text-sm",
-						children: [
-							/* @__PURE__ */ S("option", {
-								value: "7d",
-								children: "Last 7 days"
-							}),
-							/* @__PURE__ */ S("option", {
-								value: "30d",
-								children: "Last 30 days"
-							}),
-							/* @__PURE__ */ S("option", {
-								value: "90d",
-								children: "Last 90 days"
-							}),
-							/* @__PURE__ */ S("option", {
-								value: "1y",
-								children: "Last year"
-							})
-						]
-					}),
-					/* @__PURE__ */ C(d, {
-						variant: "outline",
-						size: "sm",
-						children: [/* @__PURE__ */ S(s, { className: "mr-2 h-4 w-4" }), "Export"]
-					}),
-					/* @__PURE__ */ S(d, {
-						size: "sm",
-						children: "Generate Report"
-					})
-				]
+				children: [/* @__PURE__ */ E("select", {
+					value: N,
+					onChange: (e) => P(e.target.value),
+					className: "rounded-md border border-border-default bg-bg-surface px-3 py-1.5 text-sm",
+					children: [
+						/* @__PURE__ */ T("option", {
+							value: "7d",
+							children: "Last 7 days"
+						}),
+						/* @__PURE__ */ T("option", {
+							value: "30d",
+							children: "Last 30 days"
+						}),
+						/* @__PURE__ */ T("option", {
+							value: "90d",
+							children: "Last 90 days"
+						}),
+						/* @__PURE__ */ T("option", {
+							value: "1y",
+							children: "Last year"
+						})
+					]
+				}), /* @__PURE__ */ T(d, {
+					primary: {
+						label: "Generate Report",
+						onSelect: () => {}
+					},
+					actions: [{
+						label: "Export",
+						onSelect: () => {},
+						icon: /* @__PURE__ */ T(s, { className: "h-4 w-4" })
+					}]
+				})]
 			})]
-		}), /* @__PURE__ */ C(v, {
+		}), /* @__PURE__ */ E(x, {
 			defaultValue: "overview",
 			children: [
-				/* @__PURE__ */ C(b, { children: [
-					/* @__PURE__ */ S(x, {
+				/* @__PURE__ */ E(C, { children: [
+					/* @__PURE__ */ T(w, {
 						value: "overview",
 						children: "Overview"
 					}),
-					/* @__PURE__ */ S(x, {
+					/* @__PURE__ */ T(w, {
 						value: "financial",
 						children: "Financial"
 					}),
-					/* @__PURE__ */ S(x, {
+					/* @__PURE__ */ T(w, {
 						value: "operational",
 						children: "Operational"
 					}),
-					/* @__PURE__ */ S(x, {
+					/* @__PURE__ */ T(w, {
 						value: "insights",
 						children: "Insights"
 					})
 				] }),
-				/* @__PURE__ */ C(y, {
+				/* @__PURE__ */ E(S, {
 					value: "overview",
 					className: "space-y-6 mt-6",
 					children: [
-						/* @__PURE__ */ C("div", {
+						/* @__PURE__ */ E("div", {
 							className: "grid gap-4 md:grid-cols-2 lg:grid-cols-4",
 							children: [
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, {
-									className: "flex flex-row items-center justify-between space-y-0 pb-2",
-									children: [/* @__PURE__ */ S(g, {
-										className: "text-sm font-medium",
-										children: "Total Portfolio Value"
-									}), /* @__PURE__ */ S(o, { className: "h-4 w-4 text-muted-foreground" })]
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C("div", {
-									className: "text-2xl font-bold",
-									children: ["$", T.totalValue.toLocaleString()]
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground flex items-center mt-1",
-									children: [
-										/* @__PURE__ */ S(r, { className: "mr-1 h-3 w-3 text-green-600" }),
-										/* @__PURE__ */ S("span", {
-											className: "text-green-600",
-											children: "+5.6%"
-										}),
-										" from last quarter"
-									]
-								})] })] }),
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, {
-									className: "flex flex-row items-center justify-between space-y-0 pb-2",
-									children: [/* @__PURE__ */ S(g, {
-										className: "text-sm font-medium",
-										children: "Total Depreciation"
-									}), /* @__PURE__ */ S(l, { className: "h-4 w-4 text-muted-foreground" })]
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C("div", {
-									className: "text-2xl font-bold text-red-600",
-									children: ["-$", P.toLocaleString()]
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground",
-									children: [F, "% of original value"]
-								})] })] }),
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, {
-									className: "flex flex-row items-center justify-between space-y-0 pb-2",
-									children: [/* @__PURE__ */ S(g, {
-										className: "text-sm font-medium",
-										children: "Total Assets"
-									}), /* @__PURE__ */ S(a, { className: "h-4 w-4 text-muted-foreground" })]
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ S("div", {
-									className: "text-2xl font-bold",
-									children: T.totalAssets
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground",
-									children: [w.filter((e) => e.status === "active").length, " currently active"]
-								})] })] }),
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, {
-									className: "flex flex-row items-center justify-between space-y-0 pb-2",
-									children: [/* @__PURE__ */ S(g, {
-										className: "text-sm font-medium",
-										children: "Avg. Asset Value"
-									}), /* @__PURE__ */ S(i, { className: "h-4 w-4 text-muted-foreground" })]
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C("div", {
-									className: "text-2xl font-bold",
-									children: ["$", I.toLocaleString()]
-								}), /* @__PURE__ */ S("p", {
-									className: "text-xs text-muted-foreground",
-									children: "Across all categories"
-								})] })] })
+								/* @__PURE__ */ E(v, {
+									treatment: "metric",
+									className: "border-border-seam",
+									children: [/* @__PURE__ */ E(h, {
+										className: "flex flex-row items-center justify-between space-y-0 pb-2",
+										children: [/* @__PURE__ */ T(g, {
+											className: "text-sm font-medium",
+											children: "Total Portfolio Value"
+										}), /* @__PURE__ */ T(o, { className: "h-4 w-4 text-text-secondary" })]
+									}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ E("div", {
+										className: "text-2xl font-bold tabular-nums",
+										children: ["$", O.totalValue.toLocaleString()]
+									}), /* @__PURE__ */ E("p", {
+										className: "text-xs text-text-secondary flex items-center mt-1",
+										children: [
+											/* @__PURE__ */ T(r, { className: "mr-1 h-3 w-3 text-status-success-text" }),
+											/* @__PURE__ */ T("span", {
+												className: "text-status-success-text",
+												children: "+5.6%"
+											}),
+											" from last quarter"
+										]
+									})] })]
+								}),
+								/* @__PURE__ */ E(v, {
+									treatment: "metric",
+									className: "border-border-seam",
+									children: [/* @__PURE__ */ E(h, {
+										className: "flex flex-row items-center justify-between space-y-0 pb-2",
+										children: [/* @__PURE__ */ T(g, {
+											className: "text-sm font-medium",
+											children: "Total Depreciation"
+										}), /* @__PURE__ */ T(l, { className: "h-4 w-4 text-text-secondary" })]
+									}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ E("div", {
+										className: "text-2xl font-bold text-status-error-text",
+										children: ["-$", L.toLocaleString()]
+									}), /* @__PURE__ */ E("p", {
+										className: "text-xs text-text-secondary",
+										children: [R, "% of original value"]
+									})] })]
+								}),
+								/* @__PURE__ */ E(v, {
+									treatment: "metric",
+									className: "border-border-seam",
+									children: [/* @__PURE__ */ E(h, {
+										className: "flex flex-row items-center justify-between space-y-0 pb-2",
+										children: [/* @__PURE__ */ T(g, {
+											className: "text-sm font-medium",
+											children: "Total Assets"
+										}), /* @__PURE__ */ T(a, { className: "h-4 w-4 text-text-secondary" })]
+									}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ T("div", {
+										className: "text-2xl font-bold tabular-nums",
+										children: O.totalAssets
+									}), /* @__PURE__ */ E("p", {
+										className: "text-xs text-text-secondary",
+										children: [D.filter((e) => e.status === "active").length, " currently active"]
+									})] })]
+								}),
+								/* @__PURE__ */ E(v, {
+									treatment: "metric",
+									className: "border-border-seam",
+									children: [/* @__PURE__ */ E(h, {
+										className: "flex flex-row items-center justify-between space-y-0 pb-2",
+										children: [/* @__PURE__ */ T(g, {
+											className: "text-sm font-medium",
+											children: "Avg. Asset Value"
+										}), /* @__PURE__ */ T(i, { className: "h-4 w-4 text-text-secondary" })]
+									}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ E("div", {
+										className: "text-2xl font-bold tabular-nums",
+										children: ["$", z.toLocaleString()]
+									}), /* @__PURE__ */ T("p", {
+										className: "text-xs text-text-secondary",
+										children: "Across all categories"
+									})] })]
+								})
 							]
 						}),
-						/* @__PURE__ */ C("div", {
+						/* @__PURE__ */ E("div", {
 							className: "grid gap-6 lg:grid-cols-2",
-							children: [/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, { children: [/* @__PURE__ */ C(g, {
+							children: [/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ E(h, { children: [/* @__PURE__ */ E(g, {
 								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ S(c, { className: "h-4 w-4" }), "Category Distribution"]
-							}), /* @__PURE__ */ S(m, { children: "Assets by category with values" })] }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ S("div", {
+								children: [/* @__PURE__ */ T(c, { className: "h-4 w-4" }), "Category Distribution"]
+							}), /* @__PURE__ */ T(m, { children: "Assets by category with values" })] }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ T("div", {
 								className: "space-y-3",
-								children: Object.entries(L).sort((e, t) => t[1].value - e[1].value).map(([e, t]) => {
-									let n = Math.round(t.count / w.length * 100);
-									return /* @__PURE__ */ C("div", {
+								children: Object.entries(B).sort((e, t) => t[1].value - e[1].value).map(([e, t]) => {
+									let n = Math.round(t.count / D.length * 100);
+									return /* @__PURE__ */ E("div", {
 										className: "space-y-1",
-										children: [/* @__PURE__ */ C("div", {
+										children: [/* @__PURE__ */ E("div", {
 											className: "flex items-center justify-between text-sm",
-											children: [/* @__PURE__ */ S("span", {
+											children: [/* @__PURE__ */ T("span", {
 												className: "font-medium capitalize",
 												children: e
-											}), /* @__PURE__ */ C("span", {
-												className: "text-muted-foreground",
+											}), /* @__PURE__ */ E("span", {
+												className: "text-text-secondary",
 												children: [
 													t.count,
 													" · $",
@@ -176,40 +191,40 @@ function w() {
 													"K"
 												]
 											})]
-										}), /* @__PURE__ */ S("div", {
-											className: "h-2 rounded-full bg-muted overflow-hidden",
-											children: /* @__PURE__ */ S("div", {
-												className: "h-full rounded-full bg-primary",
+										}), /* @__PURE__ */ T("div", {
+											className: "h-2 rounded-full bg-bg-sunken overflow-hidden",
+											children: /* @__PURE__ */ T("div", {
+												className: "h-full rounded-full bg-action-primary-bg",
 												style: { width: `${n}%` }
 											})
 										})]
 									}, e);
 								})
-							}) })] }), /* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, { children: [/* @__PURE__ */ C(g, {
+							}) })] }), /* @__PURE__ */ E(f, { children: [/* @__PURE__ */ E(h, { children: [/* @__PURE__ */ E(g, {
 								className: "flex items-center gap-2",
-								children: [/* @__PURE__ */ S(n, { className: "h-4 w-4" }), "Status Breakdown"]
-							}), /* @__PURE__ */ S(m, { children: "Current asset status distribution" })] }), /* @__PURE__ */ C(p, { children: [
-								/* @__PURE__ */ S("div", {
+								children: [/* @__PURE__ */ T(n, { className: "h-4 w-4" }), "Status Breakdown"]
+							}), /* @__PURE__ */ T(m, { children: "Current asset status distribution" })] }), /* @__PURE__ */ E(p, { children: [
+								/* @__PURE__ */ T("div", {
 									className: "space-y-3",
-									children: Object.entries(R).map(([e, t]) => {
-										let n = Math.round(t / w.length * 100);
-										return /* @__PURE__ */ C("div", {
+									children: Object.entries(V).map(([e, t]) => {
+										let n = Math.round(t / D.length * 100);
+										return /* @__PURE__ */ E("div", {
 											className: "flex items-center justify-between",
-											children: [/* @__PURE__ */ S("div", {
+											children: [/* @__PURE__ */ T("div", {
 												className: "flex items-center gap-2",
-												children: /* @__PURE__ */ S(u, {
+												children: /* @__PURE__ */ T(u, {
 													variant: e === "active" ? "default" : e === "under_maintenance" ? "secondary" : "outline",
 													children: e.replace("_", " ")
 												})
-											}), /* @__PURE__ */ C("div", {
+											}), /* @__PURE__ */ E("div", {
 												className: "flex items-center gap-3",
-												children: [/* @__PURE__ */ S("div", {
-													className: "h-2 w-24 rounded-full bg-muted overflow-hidden",
-													children: /* @__PURE__ */ S("div", {
-														className: "h-full rounded-full bg-primary",
+												children: [/* @__PURE__ */ T("div", {
+													className: "h-2 w-24 rounded-full bg-bg-sunken overflow-hidden",
+													children: /* @__PURE__ */ T("div", {
+														className: "h-full rounded-full bg-action-primary-bg",
 														style: { width: `${n}%` }
 													})
-												}), /* @__PURE__ */ S("span", {
+												}), /* @__PURE__ */ T("span", {
 													className: "text-sm font-medium w-8 text-right",
 													children: t
 												})]
@@ -217,43 +232,43 @@ function w() {
 										}, e);
 									})
 								}),
-								/* @__PURE__ */ S(_, { className: "my-4" }),
-								/* @__PURE__ */ C("div", { children: [/* @__PURE__ */ S("h4", {
+								/* @__PURE__ */ T(b, { className: "my-4" }),
+								/* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h4", {
 									className: "text-sm font-medium mb-3",
 									children: "By Department"
-								}), /* @__PURE__ */ S("div", {
+								}), /* @__PURE__ */ T("div", {
 									className: "space-y-2",
-									children: Object.entries(z).sort((e, t) => t[1].count - e[1].count).slice(0, 5).map(([e, t]) => /* @__PURE__ */ C("div", {
+									children: Object.entries(H).sort((e, t) => t[1].count - e[1].count).slice(0, 5).map(([e, t]) => /* @__PURE__ */ E("div", {
 										className: "flex items-center justify-between text-sm",
-										children: [/* @__PURE__ */ S("span", { children: e }), /* @__PURE__ */ C("span", {
-											className: "text-muted-foreground",
+										children: [/* @__PURE__ */ T("span", { children: e }), /* @__PURE__ */ E("span", {
+											className: "text-text-secondary",
 											children: [t.count, " assets"]
 										})]
 									}, e))
 								})] })
 							] })] })]
 						}),
-						/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(g, { children: "Depreciation Trend" }), /* @__PURE__ */ S(m, { children: "Portfolio depreciation over the last 6 months" })] }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ S("div", {
+						/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ E(h, { children: [/* @__PURE__ */ T(g, { children: "Depreciation Trend" }), /* @__PURE__ */ T(m, { children: "Portfolio depreciation over the last 6 months" })] }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ T("div", {
 							className: "flex items-end gap-2 h-40",
-							children: T.depreciationTrend.map((e) => {
-								let t = Math.max(...T.depreciationTrend.map((e) => e.value)), n = t > 0 ? e.value / t * 100 : 0;
-								return /* @__PURE__ */ C("div", {
+							children: O.depreciationTrend.map((e) => {
+								let t = Math.max(...O.depreciationTrend.map((e) => e.value)), n = t > 0 ? e.value / t * 100 : 0;
+								return /* @__PURE__ */ E("div", {
 									className: "flex-1 flex flex-col items-center gap-1",
 									children: [
-										/* @__PURE__ */ C("span", {
-											className: "text-[10px] text-muted-foreground",
+										/* @__PURE__ */ E("span", {
+											className: "text-[10px] text-text-secondary",
 											children: [
 												"$",
 												(e.value / 1e6).toFixed(2),
 												"M"
 											]
 										}),
-										/* @__PURE__ */ S("div", {
-											className: "w-full bg-primary/80 rounded-t",
+										/* @__PURE__ */ T("div", {
+											className: "w-full bg-action-primary-bg/80 rounded-t",
 											style: { height: `${n}%` }
 										}),
-										/* @__PURE__ */ S("span", {
-											className: "text-[10px] text-muted-foreground",
+										/* @__PURE__ */ T("span", {
+											className: "text-[10px] text-text-secondary",
 											children: e.month.replace(" 20", "'")
 										})
 									]
@@ -262,135 +277,135 @@ function w() {
 						}) })] })
 					]
 				}),
-				/* @__PURE__ */ C(y, {
+				/* @__PURE__ */ E(S, {
 					value: "financial",
 					className: "space-y-6 mt-6",
 					children: [
-						/* @__PURE__ */ C("div", {
+						/* @__PURE__ */ E("div", {
 							className: "grid gap-4 md:grid-cols-3",
 							children: [
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+								/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 									className: "pb-2",
-									children: /* @__PURE__ */ S(g, {
+									children: /* @__PURE__ */ T(g, {
 										className: "text-sm font-medium",
 										children: "Total Transactions"
 									})
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ S("div", {
-									className: "text-2xl font-bold",
-									children: E.length
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground",
+								}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ T("div", {
+									className: "text-2xl font-bold tabular-nums",
+									children: k.length
+								}), /* @__PURE__ */ E("p", {
+									className: "text-xs text-text-secondary",
 									children: [
 										"$",
-										E.reduce((e, t) => e + Math.abs(t.amount), 0).toLocaleString(),
+										k.reduce((e, t) => e + Math.abs(t.amount), 0).toLocaleString(),
 										" total value"
 									]
 								})] })] }),
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+								/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 									className: "pb-2",
-									children: /* @__PURE__ */ S(g, {
+									children: /* @__PURE__ */ T(g, {
 										className: "text-sm font-medium",
 										children: "Maintenance Cost"
 									})
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C("div", {
-									className: "text-2xl font-bold",
-									children: ["$", U.toLocaleString()]
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground",
-									children: [O.length, " maintenance records"]
+								}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ E("div", {
+									className: "text-2xl font-bold tabular-nums",
+									children: ["$", K.toLocaleString()]
+								}), /* @__PURE__ */ E("p", {
+									className: "text-xs text-text-secondary",
+									children: [j.length, " maintenance records"]
 								})] })] }),
-								/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+								/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 									className: "pb-2",
-									children: /* @__PURE__ */ S(g, {
+									children: /* @__PURE__ */ T(g, {
 										className: "text-sm font-medium",
 										children: "Acquisitions (6mo)"
 									})
-								}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ S("div", {
-									className: "text-2xl font-bold",
-									children: T.acquisitionTrend.reduce((e, t) => e + t.count, 0)
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground",
+								}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ T("div", {
+									className: "text-2xl font-bold tabular-nums",
+									children: O.acquisitionTrend.reduce((e, t) => e + t.count, 0)
+								}), /* @__PURE__ */ E("p", {
+									className: "text-xs text-text-secondary",
 									children: [
 										"$",
-										(T.acquisitionTrend.reduce((e, t) => e + t.value, 0) / 1e3).toFixed(0),
+										(O.acquisitionTrend.reduce((e, t) => e + t.value, 0) / 1e3).toFixed(0),
 										"K total spend"
 									]
 								})] })] })
 							]
 						}),
-						/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(g, { children: "Acquisition Trend" }), /* @__PURE__ */ S(m, { children: "New assets acquired over the last 6 months" })] }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ S("div", {
+						/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ E(h, { children: [/* @__PURE__ */ T(g, { children: "Acquisition Trend" }), /* @__PURE__ */ T(m, { children: "New assets acquired over the last 6 months" })] }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ T("div", {
 							className: "flex items-end gap-2 h-40",
-							children: T.acquisitionTrend.map((e) => {
-								let t = Math.max(...T.acquisitionTrend.map((e) => e.count)), n = t > 0 ? e.count / t * 100 : 0;
-								return /* @__PURE__ */ C("div", {
+							children: O.acquisitionTrend.map((e) => {
+								let t = Math.max(...O.acquisitionTrend.map((e) => e.count)), n = t > 0 ? e.count / t * 100 : 0;
+								return /* @__PURE__ */ E("div", {
 									className: "flex-1 flex flex-col items-center gap-1",
 									children: [
-										/* @__PURE__ */ C("span", {
-											className: "text-[10px] text-muted-foreground",
+										/* @__PURE__ */ E("span", {
+											className: "text-[10px] text-text-secondary",
 											children: [e.count, " units"]
 										}),
-										/* @__PURE__ */ S("div", {
-											className: "w-full bg-green-500/80 rounded-t",
+										/* @__PURE__ */ T("div", {
+											className: "w-full bg-status-success-bg rounded-t",
 											style: { height: `${n}%` }
 										}),
-										/* @__PURE__ */ S("span", {
-											className: "text-[10px] text-muted-foreground",
+										/* @__PURE__ */ T("span", {
+											className: "text-[10px] text-text-secondary",
 											children: e.month.replace(" 20", "'")
 										})
 									]
 								}, e.month);
 							})
 						}) })] }),
-						/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, { children: /* @__PURE__ */ S(g, { children: "Recent Transactions" }) }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ S("div", {
+						/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, { children: /* @__PURE__ */ T(g, { children: "Recent Transactions" }) }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ T("div", {
 							className: "overflow-x-auto",
-							children: /* @__PURE__ */ C("table", {
+							children: /* @__PURE__ */ E("table", {
 								className: "w-full text-sm",
-								children: [/* @__PURE__ */ S("thead", { children: /* @__PURE__ */ C("tr", {
+								children: [/* @__PURE__ */ T("thead", { children: /* @__PURE__ */ E("tr", {
 									className: "border-b",
 									children: [
-										/* @__PURE__ */ S("th", {
+										/* @__PURE__ */ T("th", {
 											className: "text-left py-2 font-medium",
 											children: "ID"
 										}),
-										/* @__PURE__ */ S("th", {
+										/* @__PURE__ */ T("th", {
 											className: "text-left py-2 font-medium",
 											children: "Type"
 										}),
-										/* @__PURE__ */ S("th", {
+										/* @__PURE__ */ T("th", {
 											className: "text-left py-2 font-medium",
 											children: "Description"
 										}),
-										/* @__PURE__ */ S("th", {
+										/* @__PURE__ */ T("th", {
 											className: "text-right py-2 font-medium",
 											children: "Amount"
 										}),
-										/* @__PURE__ */ S("th", {
+										/* @__PURE__ */ T("th", {
 											className: "text-left py-2 font-medium",
 											children: "Status"
 										})
 									]
-								}) }), /* @__PURE__ */ S("tbody", { children: E.slice(0, 5).map((e) => /* @__PURE__ */ C("tr", {
-									className: "border-b hover:bg-muted/50",
+								}) }), /* @__PURE__ */ T("tbody", { children: k.slice(0, 5).map((e) => /* @__PURE__ */ E("tr", {
+									className: "border-b hover:bg-bg-sunken/50",
 									children: [
-										/* @__PURE__ */ S("td", {
+										/* @__PURE__ */ T("td", {
 											className: "py-2 font-mono text-xs",
 											children: e.id
 										}),
-										/* @__PURE__ */ S("td", {
+										/* @__PURE__ */ T("td", {
 											className: "py-2 capitalize",
 											children: e.type
 										}),
-										/* @__PURE__ */ S("td", {
+										/* @__PURE__ */ T("td", {
 											className: "py-2 truncate max-w-xs",
 											children: e.description
 										}),
-										/* @__PURE__ */ C("td", {
-											className: `py-2 text-right font-medium ${e.amount < 0 ? "text-red-600" : ""}`,
+										/* @__PURE__ */ E("td", {
+											className: `py-2 text-right font-medium ${e.amount < 0 ? "text-status-error-text" : ""}`,
 											children: ["$", Math.abs(e.amount).toLocaleString()]
 										}),
-										/* @__PURE__ */ S("td", {
+										/* @__PURE__ */ T("td", {
 											className: "py-2",
-											children: /* @__PURE__ */ S(u, {
+											children: /* @__PURE__ */ T(u, {
 												variant: "outline",
 												children: e.status
 											})
@@ -401,176 +416,182 @@ function w() {
 						}) })] })
 					]
 				}),
-				/* @__PURE__ */ S(y, {
+				/* @__PURE__ */ T(S, {
 					value: "operational",
 					className: "space-y-6 mt-6",
-					children: /* @__PURE__ */ C("div", {
+					children: /* @__PURE__ */ E("div", {
 						className: "grid gap-4 md:grid-cols-4",
 						children: [
-							/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+							/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 								className: "pb-2",
-								children: /* @__PURE__ */ S(g, {
+								children: /* @__PURE__ */ T(g, {
 									className: "text-sm font-medium",
 									children: "Incidents"
 								})
-							}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ S("div", {
-								className: "text-2xl font-bold",
-								children: D.length
-							}), /* @__PURE__ */ C("p", {
-								className: "text-xs text-muted-foreground",
-								children: [B.length, " resolved"]
+							}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ T("div", {
+								className: "text-2xl font-bold tabular-nums",
+								children: A.length
+							}), /* @__PURE__ */ E("p", {
+								className: "text-xs text-text-secondary",
+								children: [U.length, " resolved"]
 							})] })] }),
-							/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+							/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 								className: "pb-2",
-								children: /* @__PURE__ */ S(g, {
+								children: /* @__PURE__ */ T(g, {
 									className: "text-sm font-medium",
 									children: "SLA Breaches"
 								})
-							}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ S("div", {
-								className: "text-2xl font-bold text-red-600",
-								children: V.length
-							}), /* @__PURE__ */ C("p", {
-								className: "text-xs text-muted-foreground",
-								children: [((1 - V.length / Math.max(D.length, 1)) * 100).toFixed(1), "% compliance"]
+							}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ T("div", {
+								className: "text-2xl font-bold text-status-error-text",
+								children: W.length
+							}), /* @__PURE__ */ E("p", {
+								className: "text-xs text-text-secondary",
+								children: [((1 - W.length / Math.max(A.length, 1)) * 100).toFixed(1), "% compliance"]
 							})] })] }),
-							/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+							/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 								className: "pb-2",
-								children: /* @__PURE__ */ S(g, {
+								children: /* @__PURE__ */ T(g, {
 									className: "text-sm font-medium",
 									children: "Maintenance Done"
 								})
-							}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ S("div", {
-								className: "text-2xl font-bold",
-								children: H.length
-							}), /* @__PURE__ */ C("p", {
-								className: "text-xs text-muted-foreground",
+							}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ T("div", {
+								className: "text-2xl font-bold tabular-nums",
+								children: G.length
+							}), /* @__PURE__ */ E("p", {
+								className: "text-xs text-text-secondary",
 								children: [
 									"of ",
-									O.length,
+									j.length,
 									" total"
 								]
 							})] })] }),
-							/* @__PURE__ */ C(f, { children: [/* @__PURE__ */ S(h, {
+							/* @__PURE__ */ E(f, { children: [/* @__PURE__ */ T(h, {
 								className: "pb-2",
-								children: /* @__PURE__ */ S(g, {
+								children: /* @__PURE__ */ T(g, {
 									className: "text-sm font-medium",
 									children: "Workflow Success"
 								})
-							}), /* @__PURE__ */ C(p, { children: [/* @__PURE__ */ C("div", {
-								className: "text-2xl font-bold",
-								children: [(k.reduce((e, t) => e + t.successRate, 0) / Math.max(k.length, 1)).toFixed(1), "%"]
-							}), /* @__PURE__ */ C("p", {
-								className: "text-xs text-muted-foreground",
-								children: [k.length, " active workflows"]
+							}), /* @__PURE__ */ E(p, { children: [/* @__PURE__ */ E("div", {
+								className: "text-2xl font-bold tabular-nums",
+								children: [(M.reduce((e, t) => e + t.successRate, 0) / Math.max(M.length, 1)).toFixed(1), "%"]
+							}), /* @__PURE__ */ E("p", {
+								className: "text-xs text-text-secondary",
+								children: [M.length, " active workflows"]
 							})] })] })
 						]
 					})
 				}),
-				/* @__PURE__ */ C(y, {
+				/* @__PURE__ */ E(S, {
 					value: "insights",
 					className: "space-y-6 mt-6",
-					children: [/* @__PURE__ */ C("div", {
+					children: [/* @__PURE__ */ E("div", {
 						className: "grid gap-4 md:grid-cols-3",
 						children: [
-							/* @__PURE__ */ C(f, {
-								className: "border-blue-200 bg-blue-50/50",
-								children: [/* @__PURE__ */ S(h, { children: /* @__PURE__ */ S(g, {
-									className: "text-blue-900 text-base",
+							/* @__PURE__ */ E(f, {
+								className: "border-status-info-border bg-status-info-bg-subtle",
+								children: [/* @__PURE__ */ T(h, { children: /* @__PURE__ */ T(g, {
+									className: "text-status-info-text text-base",
 									children: "Diversification"
-								}) }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ C("p", {
-									className: "text-sm text-blue-800",
+								}) }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ E("p", {
+									className: "text-sm text-status-info-text",
 									children: [
 										"Your portfolio spans ",
-										Object.keys(L).length,
+										Object.keys(B).length,
 										" categories across",
 										" ",
-										Object.keys(z).length,
+										Object.keys(H).length,
 										" departments. IT Hardware represents the largest segment at ",
-										T.byCategory[0]?.count || 0,
+										O.byCategory[0]?.count || 0,
 										" assets."
 									]
 								}) })]
 							}),
-							/* @__PURE__ */ C(f, {
-								className: "border-green-200 bg-green-50/50",
-								children: [/* @__PURE__ */ S(h, { children: /* @__PURE__ */ S(g, {
-									className: "text-green-900 text-base",
+							/* @__PURE__ */ E(f, {
+								className: "border-status-success-border bg-status-success-bg-subtle",
+								children: [/* @__PURE__ */ T(h, { children: /* @__PURE__ */ T(g, {
+									className: "text-status-success-text text-base",
 									children: "Performance"
-								}) }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ C("p", {
-									className: "text-sm text-green-800",
+								}) }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ E("p", {
+									className: "text-sm text-status-success-text",
 									children: [
 										"Portfolio depreciated value stands at $",
-										(T.depreciatedValue / 1e6).toFixed(2),
+										(O.depreciatedValue / 1e6).toFixed(2),
 										"M. Depreciation rate is within expected range at ",
-										F,
+										R,
 										"% of original cost."
 									]
 								}) })]
 							}),
-							/* @__PURE__ */ C(f, {
-								className: "border-amber-200 bg-amber-50/50",
-								children: [/* @__PURE__ */ S(h, { children: /* @__PURE__ */ S(g, {
-									className: "text-amber-900 text-base",
+							/* @__PURE__ */ E(f, {
+								className: "border-status-warning-border bg-status-warning-bg-subtle",
+								children: [/* @__PURE__ */ T(h, { children: /* @__PURE__ */ T(g, {
+									className: "text-status-warning-text text-base",
 									children: "Maintenance"
-								}) }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ C("p", {
-									className: "text-sm text-amber-800",
+								}) }), /* @__PURE__ */ T(p, { children: /* @__PURE__ */ E("p", {
+									className: "text-sm text-status-warning-text",
 									children: [
-										O.filter((e) => e.status === "scheduled").length,
+										j.filter((e) => e.status === "scheduled").length,
 										" maintenance tasks are scheduled. Total maintenance spend is $",
-										U.toLocaleString(),
+										K.toLocaleString(),
 										". Stay on top of preventive maintenance."
 									]
 								}) })]
 							})
 						]
-					}), /* @__PURE__ */ C(f, { children: [/* @__PURE__ */ C(h, { children: [/* @__PURE__ */ S(g, { children: "Top Assets by Value" }), /* @__PURE__ */ S(m, { children: "Highest value assets in your portfolio" })] }), /* @__PURE__ */ S(p, { children: /* @__PURE__ */ S("div", {
-						className: "space-y-3",
-						children: [...w].sort((e, t) => t.currentValue - e.currentValue).slice(0, 5).map((e, t) => /* @__PURE__ */ C("div", {
-							className: "flex items-center justify-between p-3 rounded-lg border",
-							children: [/* @__PURE__ */ C("div", {
-								className: "flex items-center gap-3",
-								children: [/* @__PURE__ */ S("div", {
-									className: "w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-xs font-medium text-primary",
-									children: t + 1
-								}), /* @__PURE__ */ C("div", { children: [/* @__PURE__ */ S("p", {
-									className: "text-sm font-medium",
-									children: e.name
-								}), /* @__PURE__ */ C("p", {
-									className: "text-xs text-muted-foreground",
-									children: [
-										e.department,
-										" · ",
-										e.category.replace("_", " ")
-									]
-								})] })]
-							}), /* @__PURE__ */ C("div", {
-								className: "text-right",
-								children: [/* @__PURE__ */ C("p", {
-									className: "text-sm font-medium",
-									children: ["$", e.currentValue.toLocaleString()]
-								}), /* @__PURE__ */ S("p", {
-									className: "text-xs text-muted-foreground",
-									children: e.currentValue < e.value ? /* @__PURE__ */ C("span", {
-										className: "text-red-600",
+					}), /* @__PURE__ */ E(_, { children: [/* @__PURE__ */ E(h, {
+						className: "px-0 pt-0",
+						children: [/* @__PURE__ */ T(g, { children: "Top Assets by Value" }), /* @__PURE__ */ T(m, { children: "Highest value assets in your portfolio" })]
+					}), /* @__PURE__ */ T(p, {
+						className: "px-0 pb-0",
+						children: /* @__PURE__ */ T("div", {
+							className: "space-y-3",
+							children: [...D].sort((e, t) => t.currentValue - e.currentValue).slice(0, 5).map((e, t) => /* @__PURE__ */ E("div", {
+								className: "flex items-center justify-between p-3 rounded-lg border border-border-seam bg-gloss-card",
+								children: [/* @__PURE__ */ E("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ T("div", {
+										className: "w-8 h-8 rounded-full bg-action-primary-bg/10 flex items-center justify-center text-xs font-medium text-primary",
+										children: t + 1
+									}), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("p", {
+										className: "text-sm font-medium",
+										children: e.name
+									}), /* @__PURE__ */ E("p", {
+										className: "text-xs text-text-secondary",
 										children: [
-											"-",
-											((1 - e.currentValue / e.value) * 100).toFixed(1),
-											"%"
+											e.department,
+											" · ",
+											e.category.replace("_", " ")
 										]
-									}) : /* @__PURE__ */ S("span", {
-										className: "text-green-600",
-										children: "No depreciation"
-									})
+									})] })]
+								}), /* @__PURE__ */ E("div", {
+									className: "text-right",
+									children: [/* @__PURE__ */ E("p", {
+										className: "text-sm font-medium",
+										children: ["$", e.currentValue.toLocaleString()]
+									}), /* @__PURE__ */ T("p", {
+										className: "text-xs text-text-secondary",
+										children: e.currentValue < e.value ? /* @__PURE__ */ E("span", {
+											className: "text-status-error-text",
+											children: [
+												"-",
+												((1 - e.currentValue / e.value) * 100).toFixed(1),
+												"%"
+											]
+										}) : /* @__PURE__ */ T("span", {
+											className: "text-status-success-text",
+											children: "No depreciation"
+										})
+									})]
 								})]
-							})]
-						}, e.id))
-					}) })] })]
+							}, e.id))
+						})
+					})] })]
 				})
 			]
 		})]
 	});
 }
 //#endregion
-export { w as AnalyticsPage };
+export { D as AnalyticsPage };
 
 //# sourceMappingURL=AnalyticsPage.js.map