@burdenoff/microfe-assethandler 2026.510.104

package/dist/assethandler/pages/EsgDashboardPage.js

@@ -0,0 +1,130 @@
+import { useState as e } from "react";
+import { Leaf as t } from "lucide-react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { gql as i } from "@apollo/client";
+import { useMutation as a, useQuery as o } from "@apollo/client/react";
+//#region src/assethandler/pages/EsgDashboardPage.tsx
+var s = i`
+  query AssetHandlerEsgMetrics {
+    esgMetrics {
+      id
+      metricKey
+      metricName
+      category
+      unit
+      value
+      target
+      trend
+      periodStart
+      periodEnd
+    }
+  }
+`, c = i`
+  mutation AssetHandlerUpsertEsgMetric($input: UpsertEsgMetricInput!) {
+    upsertEsgMetric(input: $input) {
+      id
+    }
+  }
+`;
+function l() {
+	let [i, l] = e("42.5"), { data: u, loading: d, refetch: f } = o(s, { fetchPolicy: "cache-and-network" }), [p, { loading: m }] = a(c, { onCompleted: () => {
+		f();
+	} }), h = u?.esgMetrics ?? [];
+	return /* @__PURE__ */ r("div", {
+		className: "space-y-4 p-4",
+		children: [
+			/* @__PURE__ */ r("h1", {
+				className: "flex items-center gap-2 text-2xl font-semibold",
+				children: [/* @__PURE__ */ n(t, { className: "h-6 w-6" }), " ESG Dashboard"]
+			}),
+			/* @__PURE__ */ n("p", {
+				className: "text-muted-foreground",
+				children: "Track sustainability and governance KPIs across the full asset portfolio."
+			}),
+			/* @__PURE__ */ r("form", {
+				className: "grid gap-3 rounded-lg border p-4 md:grid-cols-4",
+				onSubmit: (e) => {
+					e.preventDefault();
+					let t = new Date((/* @__PURE__ */ new Date()).getFullYear(), (/* @__PURE__ */ new Date()).getMonth(), 1).toISOString(), n = (/* @__PURE__ */ new Date()).toISOString();
+					p({ variables: { input: {
+						metricKey: "carbon-footprint-scope2",
+						metricName: "Scope 2 Carbon Emissions",
+						category: "environment",
+						unit: "tCO2e",
+						value: Number(i),
+						target: 40,
+						trend: "improving",
+						periodStart: t,
+						periodEnd: n
+					} } });
+				},
+				children: [
+					/* @__PURE__ */ n("input", {
+						className: "rounded-md border px-3 py-2",
+						value: i,
+						onChange: (e) => l(e.target.value)
+					}),
+					/* @__PURE__ */ n("div", {
+						className: "text-sm text-muted-foreground md:col-span-2",
+						children: "Metric: Scope 2 Carbon Emissions (monthly)"
+					}),
+					/* @__PURE__ */ n("button", {
+						className: "rounded-md bg-primary px-3 py-2 text-primary-foreground",
+						disabled: m,
+						type: "submit",
+						children: m ? "Saving..." : "Save Metric"
+					})
+				]
+			}),
+			/* @__PURE__ */ r("div", {
+				className: "grid gap-3 md:grid-cols-2",
+				children: [
+					d && h.length === 0 ? /* @__PURE__ */ n("p", {
+						className: "text-sm text-muted-foreground",
+						children: "Loading ESG metrics..."
+					}) : null,
+					!d && h.length === 0 ? /* @__PURE__ */ n("p", {
+						className: "text-sm text-muted-foreground",
+						children: "No ESG metrics recorded yet."
+					}) : null,
+					h.map((e) => /* @__PURE__ */ r("article", {
+						className: "rounded-lg border p-4",
+						children: [
+							/* @__PURE__ */ n("p", {
+								className: "text-xs uppercase tracking-wide text-muted-foreground",
+								children: e.category
+							}),
+							/* @__PURE__ */ n("h2", {
+								className: "mt-1 text-base font-semibold",
+								children: e.metricName
+							}),
+							/* @__PURE__ */ r("p", {
+								className: "mt-2 text-sm",
+								children: [
+									/* @__PURE__ */ n("span", {
+										className: "font-semibold",
+										children: e.value
+									}),
+									" ",
+									e.unit,
+									e.target === null ? null : /* @__PURE__ */ r("span", {
+										className: "text-muted-foreground",
+										children: [" / target ", e.target]
+									})
+								]
+							}),
+							/* @__PURE__ */ r("p", {
+								className: "mt-1 text-xs text-muted-foreground",
+								children: ["Trend: ", e.trend ?? "stable"]
+							})
+						]
+					}, e.id))
+				]
+			})
+		]
+	});
+}
+//#endregion
+export { l as EsgDashboardPage };
+
+//# sourceMappingURL=EsgDashboardPage.js.map

package/dist/assethandler/pages/EsgDashboardPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EsgDashboardPage.js","names":[],"sources":["../../../src/assethandler/pages/EsgDashboardPage.tsx"],"sourcesContent":["import { Leaf } from 'lucide-react';\nimport { useState } from 'react';\nimport { gql } from '@apollo/client';\nimport { useMutation, useQuery } from '@apollo/client/react';\n\nconst ESG_METRICS_QUERY = gql`\n  query AssetHandlerEsgMetrics {\n    esgMetrics {\n      id\n      metricKey\n      metricName\n      category\n      unit\n      value\n      target\n      trend\n      periodStart\n      periodEnd\n    }\n  }\n`;\n\nconst UPSERT_ESG_METRIC_MUTATION = gql`\n  mutation AssetHandlerUpsertEsgMetric($input: UpsertEsgMetricInput!) {\n    upsertEsgMetric(input: $input) {\n      id\n    }\n  }\n`;\n\nexport function EsgDashboardPage() {\n  const [value, setValue] = useState('42.5');\n\n  const { data, loading, refetch } = useQuery<{\n    esgMetrics: Array<{\n      id: string;\n      metricKey: string;\n      metricName: string;\n      category: string;\n      unit: string;\n      value: number;\n      target: number | null;\n      trend: string | null;\n      periodStart: string;\n      periodEnd: string;\n    }>;\n  }>(ESG_METRICS_QUERY, { fetchPolicy: 'cache-and-network' });\n\n  const [upsertEsgMetric, { loading: saving }] = useMutation(UPSERT_ESG_METRIC_MUTATION, {\n    onCompleted: () => {\n      void refetch();\n    },\n  });\n\n  const metrics = data?.esgMetrics ?? [];\n\n  return (\n    <div className=\"space-y-4 p-4\">\n      <h1 className=\"flex items-center gap-2 text-2xl font-semibold\">\n        <Leaf className=\"h-6 w-6\" /> ESG Dashboard\n      </h1>\n      <p className=\"text-muted-foreground\">\n        Track sustainability and governance KPIs across the full asset portfolio.\n      </p>\n      <form\n        className=\"grid gap-3 rounded-lg border p-4 md:grid-cols-4\"\n        onSubmit={(event) => {\n          event.preventDefault();\n          const periodStart = new Date(\n            new Date().getFullYear(),\n            new Date().getMonth(),\n            1\n          ).toISOString();\n          const periodEnd = new Date().toISOString();\n          void upsertEsgMetric({\n            variables: {\n              input: {\n                metricKey: 'carbon-footprint-scope2',\n                metricName: 'Scope 2 Carbon Emissions',\n                category: 'environment',\n                unit: 'tCO2e',\n                value: Number(value),\n                target: 40,\n                trend: 'improving',\n                periodStart,\n                periodEnd,\n              },\n            },\n          });\n        }}\n      >\n        <input\n          className=\"rounded-md border px-3 py-2\"\n          value={value}\n          onChange={(event) => setValue(event.target.value)}\n        />\n        <div className=\"text-sm text-muted-foreground md:col-span-2\">\n          Metric: Scope 2 Carbon Emissions (monthly)\n        </div>\n        <button\n          className=\"rounded-md bg-primary px-3 py-2 text-primary-foreground\"\n          disabled={saving}\n          type=\"submit\"\n        >\n          {saving ? 'Saving...' : 'Save Metric'}\n        </button>\n      </form>\n      <div className=\"grid gap-3 md:grid-cols-2\">\n        {loading && metrics.length === 0 ? (\n          <p className=\"text-sm text-muted-foreground\">Loading ESG metrics...</p>\n        ) : null}\n        {!loading && metrics.length === 0 ? (\n          <p className=\"text-sm text-muted-foreground\">No ESG metrics recorded yet.</p>\n        ) : null}\n        {metrics.map((metric) => (\n          <article key={metric.id} className=\"rounded-lg border p-4\">\n            <p className=\"text-xs uppercase tracking-wide text-muted-foreground\">\n              {metric.category}\n            </p>\n            <h2 className=\"mt-1 text-base font-semibold\">{metric.metricName}</h2>\n            <p className=\"mt-2 text-sm\">\n              <span className=\"font-semibold\">{metric.value}</span> {metric.unit}\n              {metric.target !== null ? (\n                <span className=\"text-muted-foreground\"> / target {metric.target}</span>\n              ) : null}\n            </p>\n            <p className=\"mt-1 text-xs text-muted-foreground\">Trend: {metric.trend ?? 'stable'}</p>\n          </article>\n        ))}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAKA,IAAM,IAAoB,CAAG;;;;;;;;;;;;;;;GAiBvB,IAA6B,CAAG;;;;;;;AAQtC,SAAgB,IAAmB;CACjC,IAAM,CAAC,GAAO,KAAY,EAAS,OAAO,EAEpC,EAAE,SAAM,YAAS,eAAY,EAahC,GAAmB,EAAE,aAAa,qBAAqB,CAAC,EAErD,CAAC,GAAiB,EAAE,SAAS,OAAY,EAAY,GAA4B,EACrF,mBAAmB;AACZ,KAAS;IAEjB,CAAC,EAEI,IAAU,GAAM,cAAc,EAAE;AAEtC,QACE,kBAAC,OAAD;EAAK,WAAU;YAAf;GACE,kBAAC,MAAD;IAAI,WAAU;cAAd,CACE,kBAAC,GAAD,EAAM,WAAU,WAAY,CAAA,EAAA,iBACzB;;GACL,kBAAC,KAAD;IAAG,WAAU;cAAwB;IAEjC,CAAA;GACJ,kBAAC,QAAD;IACE,WAAU;IACV,WAAW,MAAU;AACnB,OAAM,gBAAgB;KACtB,IAAM,IAAc,IAAI,sBACtB,IAAI,MAAM,EAAC,aAAa,mBACxB,IAAI,MAAM,EAAC,UAAU,EACrB,EACD,CAAC,aAAa,EACT,qBAAY,IAAI,MAAM,EAAC,aAAa;AACrC,OAAgB,EACnB,WAAW,EACT,OAAO;MACL,WAAW;MACX,YAAY;MACZ,UAAU;MACV,MAAM;MACN,OAAO,OAAO,EAAM;MACpB,QAAQ;MACR,OAAO;MACP;MACA;MACD,EACF,EACF,CAAC;;cAxBN;KA2BE,kBAAC,SAAD;MACE,WAAU;MACH;MACP,WAAW,MAAU,EAAS,EAAM,OAAO,MAAM;MACjD,CAAA;KACF,kBAAC,OAAD;MAAK,WAAU;gBAA8C;MAEvD,CAAA;KACN,kBAAC,UAAD;MACE,WAAU;MACV,UAAU;MACV,MAAK;gBAEJ,IAAS,cAAc;MACjB,CAAA;KACJ;;GACP,kBAAC,OAAD;IAAK,WAAU;cAAf;KACG,KAAW,EAAQ,WAAW,IAC7B,kBAAC,KAAD;MAAG,WAAU;gBAAgC;MAA0B,CAAA,GACrE;KACH,CAAC,KAAW,EAAQ,WAAW,IAC9B,kBAAC,KAAD;MAAG,WAAU;gBAAgC;MAAgC,CAAA,GAC3E;KACH,EAAQ,KAAK,MACZ,kBAAC,WAAD;MAAyB,WAAU;gBAAnC;OACE,kBAAC,KAAD;QAAG,WAAU;kBACV,EAAO;QACN,CAAA;OACJ,kBAAC,MAAD;QAAI,WAAU;kBAAgC,EAAO;QAAgB,CAAA;OACrE,kBAAC,KAAD;QAAG,WAAU;kBAAb;SACE,kBAAC,QAAD;UAAM,WAAU;oBAAiB,EAAO;UAAa,CAAA;;SAAE,EAAO;SAC7D,EAAO,WAAW,OAEf,OADF,kBAAC,QAAD;UAAM,WAAU;oBAAhB,CAAwC,cAAW,EAAO,OAAc;;SAExE;;OACJ,kBAAC,KAAD;QAAG,WAAU;kBAAb,CAAkD,WAAQ,EAAO,SAAS,SAAa;;OAC/E;QAZI,EAAO,GAYX,CACV;KACE;;GACF"}

package/dist/assethandler/pages/FinanceBudgetDetailPage.d.ts

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

package/dist/assethandler/pages/FinanceBudgetDetailPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FinanceBudgetDetailPage.d.ts","sourceRoot":"","sources":["../../../src/assethandler/pages/FinanceBudgetDetailPage.tsx"],"names":[],"mappings":"AAcA,wBAAgB,uBAAuB,4CAwItC"}

package/dist/assethandler/pages/FinanceBudgetDetailPage.js

@@ -0,0 +1,182 @@
+import { useAssetHandlerStore as e } from "../store/assethandlerStore.js";
+import { ArrowLeft as t, Edit as n } from "lucide-react";
+import { useParams as r } from "react-router-dom";
+import { Badge as i, Button as a, Card as o, CardContent as s, CardDescription as c, CardHeader as l, CardTitle as u } from "@burdenoff/fe-libs/ui";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+//#region src/assethandler/pages/FinanceBudgetDetailPage.tsx
+function p() {
+	let { budgetId: p } = r(), { budgets: m, transactions: h } = e(), g = m.find((e) => e.id === p) ?? m[0];
+	if (!g) return /* @__PURE__ */ d("div", {
+		className: "p-6",
+		children: /* @__PURE__ */ d("p", {
+			className: "text-muted-foreground",
+			children: "Budget not found."
+		})
+	});
+	let _ = h.filter((e) => e.category === g.category), v = Math.round(g.spent / g.allocated * 100);
+	return /* @__PURE__ */ f("div", {
+		className: "space-y-6 p-6",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ f("div", {
+					className: "flex items-center gap-4",
+					children: [/* @__PURE__ */ d(a, {
+						variant: "ghost",
+						size: "icon",
+						children: /* @__PURE__ */ d(t, { className: "h-4 w-4" })
+					}), /* @__PURE__ */ f("div", { children: [/* @__PURE__ */ f("div", {
+						className: "flex items-center gap-3",
+						children: [/* @__PURE__ */ d("h1", {
+							className: "text-2xl font-bold",
+							children: g.name
+						}), /* @__PURE__ */ d(i, {
+							variant: g.status === "over_budget" ? "destructive" : g.status === "under_budget" ? "secondary" : "default",
+							children: g.status.replace("_", " ")
+						})]
+					}), /* @__PURE__ */ f("p", {
+						className: "text-sm text-muted-foreground mt-1",
+						children: [
+							g.department,
+							" · ",
+							g.period
+						]
+					})] })]
+				}), /* @__PURE__ */ f(a, {
+					size: "sm",
+					children: [/* @__PURE__ */ d(n, { className: "mr-2 h-4 w-4" }), "Edit Budget"]
+				})]
+			}),
+			/* @__PURE__ */ f("div", {
+				className: "grid gap-4 md:grid-cols-3",
+				children: [
+					/* @__PURE__ */ d(o, { children: /* @__PURE__ */ f(s, {
+						className: "pt-4",
+						children: [/* @__PURE__ */ d("p", {
+							className: "text-sm text-muted-foreground",
+							children: "Allocated"
+						}), /* @__PURE__ */ f("p", {
+							className: "text-2xl font-bold",
+							children: ["$", g.allocated.toLocaleString()]
+						})]
+					}) }),
+					/* @__PURE__ */ d(o, { children: /* @__PURE__ */ f(s, {
+						className: "pt-4",
+						children: [
+							/* @__PURE__ */ d("p", {
+								className: "text-sm text-muted-foreground",
+								children: "Spent"
+							}),
+							/* @__PURE__ */ f("p", {
+								className: "text-2xl font-bold",
+								children: ["$", g.spent.toLocaleString()]
+							}),
+							/* @__PURE__ */ f("p", {
+								className: "text-xs text-muted-foreground",
+								children: [v, "% utilized"]
+							})
+						]
+					}) }),
+					/* @__PURE__ */ d(o, { children: /* @__PURE__ */ f(s, {
+						className: "pt-4",
+						children: [/* @__PURE__ */ d("p", {
+							className: "text-sm text-muted-foreground",
+							children: "Remaining"
+						}), /* @__PURE__ */ f("p", {
+							className: `text-2xl font-bold ${g.remaining < 0 ? "text-red-600" : "text-green-600"}`,
+							children: ["$", g.remaining.toLocaleString()]
+						})]
+					}) })
+				]
+			}),
+			/* @__PURE__ */ f(o, { children: [/* @__PURE__ */ d(l, { children: /* @__PURE__ */ d(u, { children: "Budget Utilization" }) }), /* @__PURE__ */ f(s, { children: [/* @__PURE__ */ d("div", {
+				className: "h-4 rounded-full bg-muted overflow-hidden",
+				children: /* @__PURE__ */ d("div", {
+					className: `h-full rounded-full transition-all ${g.status === "over_budget" ? "bg-red-500" : "bg-primary"}`,
+					style: { width: `${Math.min(v, 100)}%` }
+				})
+			}), /* @__PURE__ */ f("p", {
+				className: "text-sm text-muted-foreground mt-2",
+				children: [
+					v,
+					"% of $",
+					g.allocated.toLocaleString(),
+					" allocated budget consumed"
+				]
+			})] })] }),
+			/* @__PURE__ */ f(o, { children: [/* @__PURE__ */ f(l, { children: [/* @__PURE__ */ d(u, { children: "Related Transactions" }), /* @__PURE__ */ f(c, { children: [
+				"Transactions in ",
+				g.category,
+				" category"
+			] })] }), /* @__PURE__ */ d(s, {
+				className: "p-0",
+				children: /* @__PURE__ */ d("div", {
+					className: "overflow-x-auto",
+					children: /* @__PURE__ */ f("table", {
+						className: "w-full text-sm",
+						children: [/* @__PURE__ */ d("thead", { children: /* @__PURE__ */ f("tr", {
+							className: "border-b bg-muted/50",
+							children: [
+								/* @__PURE__ */ d("th", {
+									className: "text-left p-3 font-medium",
+									children: "ID"
+								}),
+								/* @__PURE__ */ d("th", {
+									className: "text-left p-3 font-medium",
+									children: "Description"
+								}),
+								/* @__PURE__ */ d("th", {
+									className: "text-right p-3 font-medium",
+									children: "Amount"
+								}),
+								/* @__PURE__ */ d("th", {
+									className: "text-left p-3 font-medium",
+									children: "Status"
+								}),
+								/* @__PURE__ */ d("th", {
+									className: "text-left p-3 font-medium",
+									children: "Date"
+								})
+							]
+						}) }), /* @__PURE__ */ f("tbody", { children: [_.map((e) => /* @__PURE__ */ f("tr", {
+							className: "border-b hover:bg-muted/50",
+							children: [
+								/* @__PURE__ */ d("td", {
+									className: "p-3 font-mono text-xs",
+									children: e.id
+								}),
+								/* @__PURE__ */ d("td", {
+									className: "p-3 truncate max-w-xs",
+									children: e.description
+								}),
+								/* @__PURE__ */ f("td", {
+									className: "p-3 text-right font-medium",
+									children: ["$", Math.abs(e.amount).toLocaleString()]
+								}),
+								/* @__PURE__ */ d("td", {
+									className: "p-3",
+									children: /* @__PURE__ */ d(i, {
+										variant: "outline",
+										children: e.status
+									})
+								}),
+								/* @__PURE__ */ d("td", {
+									className: "p-3 text-xs",
+									children: new Date(e.date).toLocaleDateString()
+								})
+							]
+						}, e.id)), _.length === 0 && /* @__PURE__ */ d("tr", { children: /* @__PURE__ */ d("td", {
+							colSpan: 5,
+							className: "text-center py-8 text-muted-foreground",
+							children: "No related transactions."
+						}) })] })]
+					})
+				})
+			})] })
+		]
+	});
+}
+//#endregion
+export { p as FinanceBudgetDetailPage };
+
+//# sourceMappingURL=FinanceBudgetDetailPage.js.map

package/dist/assethandler/pages/FinanceBudgetDetailPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FinanceBudgetDetailPage.js","names":[],"sources":["../../../src/assethandler/pages/FinanceBudgetDetailPage.tsx"],"sourcesContent":["import {\n  Badge,\n  Button,\n  Card,\n  CardContent,\n  CardDescription,\n  CardHeader,\n  CardTitle,\n  Separator,\n} from '@burdenoff/fe-libs/ui';\nimport { ArrowLeft, DollarSign, Edit } from 'lucide-react';\nimport { useParams } from 'react-router-dom';\nimport { useAssetHandlerStore } from '../store/assethandlerStore';\n\nexport function FinanceBudgetDetailPage() {\n  const { budgetId } = useParams<{ budgetId: string }>();\n  const { budgets, transactions } = useAssetHandlerStore();\n  const budget = budgets.find((item) => item.id === budgetId) ?? budgets[0];\n\n  if (!budget)\n    return (\n      <div className=\"p-6\">\n        <p className=\"text-muted-foreground\">Budget not found.</p>\n      </div>\n    );\n\n  const relatedTxns = transactions.filter((t) => t.category === budget.category);\n  const utilizationPct = Math.round((budget.spent / budget.allocated) * 100);\n\n  return (\n    <div className=\"space-y-6 p-6\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex items-center gap-4\">\n          <Button variant=\"ghost\" size=\"icon\">\n            <ArrowLeft className=\"h-4 w-4\" />\n          </Button>\n          <div>\n            <div className=\"flex items-center gap-3\">\n              <h1 className=\"text-2xl font-bold\">{budget.name}</h1>\n              <Badge\n                variant={\n                  budget.status === 'over_budget'\n                    ? 'destructive'\n                    : budget.status === 'under_budget'\n                      ? 'secondary'\n                      : 'default'\n                }\n              >\n                {budget.status.replace('_', ' ')}\n              </Badge>\n            </div>\n            <p className=\"text-sm text-muted-foreground mt-1\">\n              {budget.department} &middot; {budget.period}\n            </p>\n          </div>\n        </div>\n        <Button size=\"sm\">\n          <Edit className=\"mr-2 h-4 w-4\" />\n          Edit Budget\n        </Button>\n      </div>\n\n      <div className=\"grid gap-4 md:grid-cols-3\">\n        <Card>\n          <CardContent className=\"pt-4\">\n            <p className=\"text-sm text-muted-foreground\">Allocated</p>\n            <p className=\"text-2xl font-bold\">${budget.allocated.toLocaleString()}</p>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4\">\n            <p className=\"text-sm text-muted-foreground\">Spent</p>\n            <p className=\"text-2xl font-bold\">${budget.spent.toLocaleString()}</p>\n            <p className=\"text-xs text-muted-foreground\">{utilizationPct}% utilized</p>\n          </CardContent>\n        </Card>\n        <Card>\n          <CardContent className=\"pt-4\">\n            <p className=\"text-sm text-muted-foreground\">Remaining</p>\n            <p\n              className={`text-2xl font-bold ${budget.remaining < 0 ? 'text-red-600' : 'text-green-600'}`}\n            >\n              ${budget.remaining.toLocaleString()}\n            </p>\n          </CardContent>\n        </Card>\n      </div>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Budget Utilization</CardTitle>\n        </CardHeader>\n        <CardContent>\n          <div className=\"h-4 rounded-full bg-muted overflow-hidden\">\n            <div\n              className={`h-full rounded-full transition-all ${budget.status === 'over_budget' ? 'bg-red-500' : 'bg-primary'}`}\n              style={{ width: `${Math.min(utilizationPct, 100)}%` }}\n            />\n          </div>\n          <p className=\"text-sm text-muted-foreground mt-2\">\n            {utilizationPct}% of ${budget.allocated.toLocaleString()} allocated budget consumed\n          </p>\n        </CardContent>\n      </Card>\n\n      <Card>\n        <CardHeader>\n          <CardTitle>Related Transactions</CardTitle>\n          <CardDescription>Transactions in {budget.category} category</CardDescription>\n        </CardHeader>\n        <CardContent className=\"p-0\">\n          <div className=\"overflow-x-auto\">\n            <table className=\"w-full text-sm\">\n              <thead>\n                <tr className=\"border-b bg-muted/50\">\n                  <th className=\"text-left p-3 font-medium\">ID</th>\n                  <th className=\"text-left p-3 font-medium\">Description</th>\n                  <th className=\"text-right p-3 font-medium\">Amount</th>\n                  <th className=\"text-left p-3 font-medium\">Status</th>\n                  <th className=\"text-left p-3 font-medium\">Date</th>\n                </tr>\n              </thead>\n              <tbody>\n                {relatedTxns.map((txn) => (\n                  <tr key={txn.id} className=\"border-b hover:bg-muted/50\">\n                    <td className=\"p-3 font-mono text-xs\">{txn.id}</td>\n                    <td className=\"p-3 truncate max-w-xs\">{txn.description}</td>\n                    <td className=\"p-3 text-right font-medium\">\n                      ${Math.abs(txn.amount).toLocaleString()}\n                    </td>\n                    <td className=\"p-3\">\n                      <Badge variant=\"outline\">{txn.status}</Badge>\n                    </td>\n                    <td className=\"p-3 text-xs\">{new Date(txn.date).toLocaleDateString()}</td>\n                  </tr>\n                ))}\n                {relatedTxns.length === 0 && (\n                  <tr>\n                    <td colSpan={5} className=\"text-center py-8 text-muted-foreground\">\n                      No related transactions.\n                    </td>\n                  </tr>\n                )}\n              </tbody>\n            </table>\n          </div>\n        </CardContent>\n      </Card>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/assethandler/pages/FinanceFinanceHubPage.d.ts

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

package/dist/assethandler/pages/FinanceFinanceHubPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FinanceFinanceHubPage.d.ts","sourceRoot":"","sources":["../../../src/assethandler/pages/FinanceFinanceHubPage.tsx"],"names":[],"mappings":"AAyBA,wBAAgB,qBAAqB,4CA2NpC"}