@burdenoff/microfe-mybodyshield 2026.705.2 → 2026.706.2

package/dist/mybodyshield/pages/progress/ProgressPage.js

@@ -1,31 +1,34 @@
-import { PageLayout as e } from "../../components/PageLayout.js";
-import { MetricsCard as t } from "../../components/MetricsCard.js";
-import { formatDate as ee, formatDateTime as te, formatEnumLabel as n, formatNumber as r, formatRelativeTime as ne } from "../../utils/formatters.js";
-import { ErrorView as i, LoadingView as re, Section as ie } from "../../components/StateViews.js";
-import { EmptyState as a } from "../../components/EmptyState.js";
-import { IconChip as ae, METRIC_META as o, TrendPill as oe } from "../_shared/visuals.js";
-import { useMybBodyMetrics as s, useMybRecordBodyMetric as se } from "../../hooks/useMyBodyShieldApi.js";
-import { useOffsetPager as ce } from "../../hooks/usePager.js";
+import { motion as e } from "../../../node_modules/framer-motion/dist/es/render/components/motion/proxy.js";
+import { useReducedMotion as t } from "../../../node_modules/framer-motion/dist/es/utils/reduced-motion/use-reduced-motion.js";
+import { PageLayout as ee } from "../../components/PageLayout.js";
+import { MetricsCard as n } from "../../components/MetricsCard.js";
+import { formatDate as te, formatDateTime as r, formatEnumLabel as i, formatNumber as a, formatRelativeTime as ne } from "../../utils/formatters.js";
+import { ErrorView as o, LoadingView as re, Section as ie } from "../../components/StateViews.js";
+import { EmptyState as s } from "../../components/EmptyState.js";
+import { IconChip as c, METRIC_META as l, TrendPill as ae } from "../_shared/visuals.js";
+import { useMybBodyMetrics as u, useMybRecordBodyMetric as oe } from "../../hooks/useMyBodyShieldApi.js";
+import { useOffsetPager as se } from "../../hooks/usePager.js";
 import "../../hooks/index.js";
-import { DataTable as le } from "../../components/DataTable.js";
-import { FilterTabs as ue } from "../../components/FilterTabs.js";
-import { Pagination as de } from "../../components/Pagination.js";
-import { EvidenceUpload as fe } from "../../components/EvidenceUpload.js";
-import { FileLink as pe } from "../../components/FileLink.js";
+import { DataTable as ce } from "../../components/DataTable.js";
+import { FilterTabs as le } from "../../components/FilterTabs.js";
+import { Pagination as ue } from "../../components/Pagination.js";
+import { EvidenceUpload as de } from "../../components/EvidenceUpload.js";
+import { FileLink as fe } from "../../components/FileLink.js";
 import "../../components/index.js";
-import { Tooltip as c } from "../../../node_modules/recharts/es6/component/Tooltip.js";
+import { Tooltip as pe } from "../../../node_modules/recharts/es6/component/Tooltip.js";
 import { ResponsiveContainer as me } from "../../../node_modules/recharts/es6/component/ResponsiveContainer.js";
+import { ReferenceDot as d } from "../../../node_modules/recharts/es6/cartesian/ReferenceDot.js";
 import { CartesianGrid as he } from "../../../node_modules/recharts/es6/cartesian/CartesianGrid.js";
-import { Line as ge } from "../../../node_modules/recharts/es6/cartesian/Line.js";
+import { Area as ge } from "../../../node_modules/recharts/es6/cartesian/Area.js";
 import { XAxis as _e } from "../../../node_modules/recharts/es6/cartesian/XAxis.js";
 import { YAxis as ve } from "../../../node_modules/recharts/es6/cartesian/YAxis.js";
-import { LineChart as ye } from "../../../node_modules/recharts/es6/chart/LineChart.js";
-import { useEffect as be, useMemo as l, useState as u } from "react";
-import { Activity as xe, ArrowDownUp as Se, Plus as d, Sigma as Ce } from "lucide-react";
-import { Fragment as we, jsx as f, jsxs as p } from "react/jsx-runtime";
-import { Button as m, GlassCard as Te, Input as h, Label as g, ResponsiveDialog as Ee, ResponsiveDialogContent as _, ResponsiveDialogDescription as v, ResponsiveDialogFooter as y, ResponsiveDialogHeader as b, ResponsiveDialogTitle as x, Select as S, SelectContent as C, SelectItem as w, SelectTrigger as T, SelectValue as E, Textarea as D } from "@burdenoff/fe-libs/ui";
+import { AreaChart as ye } from "../../../node_modules/recharts/es6/chart/AreaChart.js";
+import { useEffect as be, useMemo as f, useState as p } from "react";
+import { Activity as xe, ArrowDownUp as Se, Plus as m, Sigma as Ce } from "lucide-react";
+import { Fragment as we, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { Button as _, GlassCard as Te, Input as v, Label as y, ResponsiveDialog as Ee, ResponsiveDialogContent as De, ResponsiveDialogDescription as Oe, ResponsiveDialogFooter as ke, ResponsiveDialogHeader as Ae, ResponsiveDialogTitle as je, Select as b, SelectContent as x, SelectItem as S, SelectTrigger as Me, SelectValue as Ne, Textarea as Pe } from "@burdenoff/fe-libs/ui";
 //#region src/mybodyshield/pages/progress/ProgressPage.tsx
-var O = [
+var C = [
 	"WEIGHT",
 	"BODY_FAT",
 	"RESTING_HEART_RATE",
@@ -34,7 +37,7 @@ var O = [
 	"HIPS",
 	"ARM",
 	"THIGH"
-], De = {
+], Fe = {
 	WEIGHT: "down",
 	BODY_FAT: "down",
 	RESTING_HEART_RATE: "down",
@@ -43,401 +46,509 @@ var O = [
 	CHEST: "up",
 	ARM: "up",
 	THIGH: "up"
-}, k = 100, A = 25, j = (e) => {
+}, w = 100, T = 25, E = "var(--color-action-primary-bg)", D = (e) => {
 	let t = (e) => String(e).padStart(2, "0");
 	return `${e.getFullYear()}-${t(e.getMonth() + 1)}-${t(e.getDate())}T${t(e.getHours())}:${t(e.getMinutes())}`;
-}, M = (e) => ({
+}, O = (e) => ({
 	type: e,
 	value: "",
-	unit: o[e].unit,
-	measuredAt: j(/* @__PURE__ */ new Date()),
+	unit: l[e].unit,
+	measuredAt: D(/* @__PURE__ */ new Date()),
 	notes: "",
 	photo: null
 });
-function N() {
-	let [j, N] = u("WEIGHT"), [Oe, P] = u(!1), [F, I] = u(() => M("WEIGHT")), [L, R] = u(null), z = ce(A), B = z.reset;
+function k() {
+	let [D, k] = p("WEIGHT"), [Ie, A] = p(!1), [j, M] = p(() => O("WEIGHT")), [N, P] = p(null), F = se(T), I = F.reset;
 	be(() => {
-		B();
-	}, [j, B]);
-	let V = s({
-		type: j,
-		pagination: { limit: k }
-	}), H = s({
-		type: j,
+		I();
+	}, [D, I]);
+	let L = u({
+		type: D,
+		pagination: { limit: w }
+	}), R = u({
+		type: D,
 		pagination: {
-			limit: A,
-			offset: z.offset
+			limit: T,
+			offset: F.offset
 		}
-	}), U = se(), W = o[j], G = W.icon, ke = De[j], K = l(() => V.data?.items ?? [], [V.data]), q = l(() => [...K].sort((e, t) => new Date(e.measuredAt).getTime() - new Date(t.measuredAt).getTime()), [K]), J = q[q.length - 1], Y = q[q.length - 2], X = J && Y ? J.value - Y.value : void 0, Ae = l(() => q.map((e) => ({
-		label: ee(e.measuredAt),
+	}), z = oe(), B = t(), V = (e, t = !0) => B ? { initial: !1 } : {
+		initial: {
+			opacity: 0,
+			y: 14
+		},
+		animate: {
+			opacity: 1,
+			y: 0
+		},
+		transition: {
+			duration: .45,
+			delay: e,
+			ease: "easeOut"
+		},
+		...t ? { whileHover: {
+			y: -3,
+			transition: {
+				type: "spring",
+				stiffness: 300,
+				damping: 22
+			}
+		} } : {}
+	}, H = l[D], U = H.icon, Le = Fe[D], W = f(() => L.data?.items ?? [], [L.data]), G = f(() => [...W].sort((e, t) => new Date(e.measuredAt).getTime() - new Date(t.measuredAt).getTime()), [W]), K = G[G.length - 1], q = G[G.length - 2], J = K && q ? K.value - q.value : void 0, Y = f(() => G.map((e) => ({
+		label: te(e.measuredAt),
 		value: e.value
-	})), [q]), Z = l(() => {
-		if (q.length === 0) return null;
-		let e = q.map((e) => e.value);
+	})), [G]), X = Y.length > 0 ? Y[Y.length - 1] : void 0, Z = f(() => {
+		if (G.length === 0) return null;
+		let e = G.map((e) => e.value);
 		return {
 			count: e.length,
 			min: Math.min(...e),
 			max: Math.max(...e),
 			avg: e.reduce((e, t) => e + t, 0) / e.length
 		};
-	}, [q]), je = O.map((e) => ({
+	}, [G]), Re = C.map((e) => ({
 		value: e,
-		label: n(e)
+		label: i(e)
 	})), Q = () => {
-		I(M(j)), R(null), P(!0);
-	}, Me = async () => {
-		let e = Number(F.value);
-		if (F.value.trim() === "" || !Number.isFinite(e)) {
-			R("Enter a valid measurement value.");
+		M(O(D)), P(null), A(!0);
+	}, ze = async () => {
+		let e = Number(j.value);
+		if (j.value.trim() === "" || !Number.isFinite(e)) {
+			P("Enter a valid measurement value.");
 			return;
 		}
-		R(null);
+		P(null);
 		let t = {
-			type: F.type,
+			type: j.type,
 			value: e,
-			unit: F.unit.trim() || o[F.type].unit,
-			measuredAt: F.measuredAt ? new Date(F.measuredAt).toISOString() : (/* @__PURE__ */ new Date()).toISOString(),
-			notes: F.notes.trim() ? F.notes.trim() : null,
-			photoFileId: F.photo?.fileId ?? null
+			unit: j.unit.trim() || l[j.type].unit,
+			measuredAt: j.measuredAt ? new Date(j.measuredAt).toISOString() : (/* @__PURE__ */ new Date()).toISOString(),
+			notes: j.notes.trim() ? j.notes.trim() : null,
+			photoFileId: j.photo?.fileId ?? null
 		};
 		try {
-			await U.mutateAsync(t), P(!1), N(F.type), z.reset();
+			await z.mutateAsync(t), A(!1), k(j.type), F.reset();
 		} catch (e) {
-			R(e instanceof Error ? e.message : "Failed to record measurement.");
+			P(e instanceof Error ? e.message : "Failed to record measurement.");
 		}
-	}, $ = H.data?.items ?? [];
-	return /* @__PURE__ */ p(e, {
+	}, $ = R.data?.items ?? [], Be = [
+		{
+			key: "value",
+			header: "Value",
+			align: "right",
+			sortValue: (e) => e.value,
+			render: (e) => /* @__PURE__ */ g("span", {
+				className: "font-medium tabular-nums text-text-primary",
+				children: [a(e.value), /* @__PURE__ */ h("span", {
+					className: "ml-1 text-xs font-normal text-text-tertiary",
+					children: e.unit
+				})]
+			})
+		},
+		{
+			key: "measuredAt",
+			header: "Measured",
+			sortValue: (e) => new Date(e.measuredAt).getTime(),
+			render: (e) => /* @__PURE__ */ h("span", {
+				className: "whitespace-nowrap text-text-secondary",
+				children: r(e.measuredAt)
+			})
+		},
+		{
+			key: "notes",
+			header: "Notes",
+			hideOnMobile: !0,
+			render: (e) => e.notes ? /* @__PURE__ */ h("span", {
+				className: "text-text-secondary",
+				children: e.notes
+			}) : /* @__PURE__ */ h("span", {
+				className: "text-text-tertiary",
+				children: "—"
+			})
+		},
+		{
+			key: "photo",
+			header: "Photo",
+			render: (e) => e.photo?.id ? /* @__PURE__ */ h(fe, { fileId: e.photo.id }) : /* @__PURE__ */ h("span", {
+				className: "text-text-tertiary",
+				children: "—"
+			})
+		}
+	];
+	return /* @__PURE__ */ g(ee, {
 		title: "Progress",
 		description: "Body metrics over time — weight, composition & measurements.",
-		actions: /* @__PURE__ */ p(m, {
+		actions: /* @__PURE__ */ g(_, {
 			onClick: Q,
-			children: [/* @__PURE__ */ f(d, { className: "mr-1.5 h-4 w-4" }), " Record measurement"]
+			children: [/* @__PURE__ */ h(m, { className: "mr-1.5 h-4 w-4" }), " Record measurement"]
 		}),
 		children: [
-			/* @__PURE__ */ f("div", {
+			/* @__PURE__ */ h("div", {
 				className: "mb-6 overflow-x-auto",
-				children: /* @__PURE__ */ f(ue, {
-					options: je,
-					value: j,
-					onChange: N
+				children: /* @__PURE__ */ h(le, {
+					options: Re,
+					value: D,
+					onChange: k
 				})
 			}),
-			V.isLoading && K.length === 0 ? /* @__PURE__ */ f(re, { label: `Loading ${n(j).toLowerCase()} history…` }) : V.isError ? /* @__PURE__ */ f(i, {
+			L.isLoading && W.length === 0 ? /* @__PURE__ */ h(re, { label: `Loading ${i(D).toLowerCase()} history…` }) : L.isError ? /* @__PURE__ */ h(o, {
 				message: "We couldn't load your body-metric history.",
-				onRetry: () => V.refetch()
-			}) : K.length === 0 ? /* @__PURE__ */ f(a, {
+				onRetry: () => L.refetch()
+			}) : W.length === 0 ? /* @__PURE__ */ h(s, {
 				illustration: "empty-data",
-				icon: /* @__PURE__ */ f(G, { className: "h-10 w-10" }),
-				title: `No ${n(j).toLowerCase()} readings yet`,
+				icon: /* @__PURE__ */ h(U, { className: "h-10 w-10" }),
+				title: `No ${i(D).toLowerCase()} readings yet`,
 				description: "Record a measurement to start tracking this metric over time.",
-				action: /* @__PURE__ */ p(m, {
+				action: /* @__PURE__ */ g(_, {
 					onClick: Q,
-					children: [/* @__PURE__ */ f(d, { className: "mr-1.5 h-4 w-4" }), " Record measurement"]
+					children: [/* @__PURE__ */ h(m, { className: "mr-1.5 h-4 w-4" }), " Record measurement"]
 				})
-			}) : /* @__PURE__ */ p("div", {
+			}) : /* @__PURE__ */ g("div", {
 				className: "space-y-6",
 				children: [
-					/* @__PURE__ */ p(Te, {
-						treatment: "glass",
-						className: "p-6",
-						children: [/* @__PURE__ */ p("div", {
-							className: "flex flex-wrap items-start justify-between gap-4",
-							children: [/* @__PURE__ */ p("div", {
-								className: "flex items-center gap-3",
-								children: [/* @__PURE__ */ f(ae, {
-									icon: /* @__PURE__ */ f(G, { className: "h-5 w-5" }),
-									tint: W.tint
-								}), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("h2", {
-									className: "text-base font-semibold text-text-primary",
-									children: n(j)
-								}), /* @__PURE__ */ f("p", {
-									className: "text-sm text-text-secondary",
-									children: J ? `Last measured ${ne(J.measuredAt)}` : "No measurements yet"
-								})] })]
-							}), /* @__PURE__ */ p("div", {
-								className: "text-right",
-								children: [/* @__PURE__ */ p("p", {
-									className: "text-2xl font-bold tabular-nums text-text-primary",
-									children: [J ? r(J.value) : "—", J && /* @__PURE__ */ f("span", {
-										className: "ml-1 text-base font-medium text-text-tertiary",
-										children: W.unit
+					/* @__PURE__ */ h(e.div, {
+						...V(0),
+						children: /* @__PURE__ */ g(Te, {
+							treatment: "glass",
+							className: "rounded-2xl p-6 transition-shadow duration-300 hover:shadow-2xl",
+							children: [/* @__PURE__ */ g("div", {
+								className: "flex flex-wrap items-start justify-between gap-4",
+								children: [/* @__PURE__ */ g("div", {
+									className: "flex items-center gap-3",
+									children: [/* @__PURE__ */ h(c, {
+										icon: /* @__PURE__ */ h(U, { className: "h-5 w-5" }),
+										tint: H.tint
+									}), /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("h2", {
+										className: "text-base font-semibold text-text-primary",
+										children: i(D)
+									}), /* @__PURE__ */ h("p", {
+										className: "text-sm text-text-secondary",
+										children: K ? `Last measured ${ne(K.measuredAt)}` : "No measurements yet"
+									})] })]
+								}), /* @__PURE__ */ g("div", {
+									className: "text-right",
+									children: [/* @__PURE__ */ g("p", {
+										className: "text-3xl font-bold leading-none tracking-tight tabular-nums text-text-primary sm:text-4xl",
+										children: [K ? a(K.value) : "—", K && /* @__PURE__ */ h("span", {
+											className: "ml-1 text-base font-medium text-text-tertiary",
+											children: H.unit
+										})]
+									}), J != null && /* @__PURE__ */ h("div", {
+										className: "mt-2 flex justify-end",
+										children: /* @__PURE__ */ h("span", {
+											className: "inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-1 ring-1 ring-border-seam",
+											children: /* @__PURE__ */ h(ae, {
+												delta: J,
+												unit: ` ${H.unit}`,
+												goodDirection: Le
+											})
+										})
 									})]
-								}), X != null && /* @__PURE__ */ f("div", {
-									className: "mt-1 flex justify-end",
-									children: /* @__PURE__ */ f(oe, {
-										delta: X,
-										unit: ` ${W.unit}`,
-										goodDirection: ke
-									})
 								})]
-							})]
-						}), /* @__PURE__ */ f("div", {
-							className: "mt-6 h-64 w-full",
-							children: /* @__PURE__ */ f(me, {
-								width: "100%",
-								height: "100%",
-								children: /* @__PURE__ */ p(ye, {
-									data: Ae,
-									margin: {
-										top: 8,
-										right: 12,
-										bottom: 4,
-										left: -8
-									},
-									children: [
-										/* @__PURE__ */ f(he, {
-											stroke: "var(--color-border-seam)",
-											strokeDasharray: "3 3",
-											vertical: !1
-										}),
-										/* @__PURE__ */ f(_e, {
-											dataKey: "label",
-											stroke: "var(--color-border-seam)",
-											tick: {
-												fill: "var(--color-text-tertiary)",
-												fontSize: 12
-											},
-											tickMargin: 8,
-											minTickGap: 24
-										}),
-										/* @__PURE__ */ f(ve, {
-											stroke: "var(--color-border-seam)",
-											tick: {
-												fill: "var(--color-text-tertiary)",
-												fontSize: 12
-											},
-											width: 44,
-											domain: ["auto", "auto"]
-										}),
-										/* @__PURE__ */ f(c, {
-											cursor: { stroke: "var(--color-border-seam)" },
-											contentStyle: {
-												background: "var(--color-bg-surface)",
-												border: "1px solid var(--color-border-seam)",
-												borderRadius: 12,
-												color: "var(--color-text-primary)"
-											},
-											labelStyle: { color: "var(--color-text-tertiary)" },
-											itemStyle: { color: "var(--color-text-primary)" },
-											formatter: (e) => [`${r(Number(e))} ${W.unit}`, n(j)]
-										}),
-										/* @__PURE__ */ f(ge, {
-											type: "monotone",
-											dataKey: "value",
-											name: n(j),
-											stroke: W.tint,
-											strokeWidth: 2,
-											dot: {
-												r: 3,
-												fill: W.tint,
-												strokeWidth: 0
-											},
-											activeDot: { r: 5 }
-										})
-									]
+							}), /* @__PURE__ */ h("div", {
+								className: "mt-6 h-64 w-full",
+								children: /* @__PURE__ */ h(me, {
+									width: "100%",
+									height: "100%",
+									children: /* @__PURE__ */ g(ye, {
+										data: Y,
+										margin: {
+											top: 8,
+											right: 14,
+											bottom: 4,
+											left: -8
+										},
+										children: [
+											/* @__PURE__ */ h("defs", { children: /* @__PURE__ */ g("linearGradient", {
+												id: "myb-progress-fill",
+												x1: "0",
+												y1: "0",
+												x2: "0",
+												y2: "1",
+												children: [
+													/* @__PURE__ */ h("stop", {
+														offset: "0%",
+														stopColor: E,
+														stopOpacity: .38
+													}),
+													/* @__PURE__ */ h("stop", {
+														offset: "55%",
+														stopColor: E,
+														stopOpacity: .12
+													}),
+													/* @__PURE__ */ h("stop", {
+														offset: "100%",
+														stopColor: E,
+														stopOpacity: 0
+													})
+												]
+											}) }),
+											/* @__PURE__ */ h(he, {
+												stroke: "var(--color-border-seam)",
+												strokeDasharray: "4 4",
+												vertical: !1
+											}),
+											/* @__PURE__ */ h(_e, {
+												dataKey: "label",
+												stroke: "var(--color-border-seam)",
+												tickLine: !1,
+												axisLine: !1,
+												tick: {
+													fill: "var(--color-text-tertiary)",
+													fontSize: 12
+												},
+												tickMargin: 8,
+												minTickGap: 24
+											}),
+											/* @__PURE__ */ h(ve, {
+												stroke: "var(--color-border-seam)",
+												tickLine: !1,
+												axisLine: !1,
+												tick: {
+													fill: "var(--color-text-tertiary)",
+													fontSize: 12
+												},
+												width: 44,
+												domain: ["auto", "auto"]
+											}),
+											/* @__PURE__ */ h(pe, {
+												cursor: {
+													stroke: "var(--color-border-seam)",
+													strokeDasharray: "4 4"
+												},
+												contentStyle: {
+													background: "var(--color-bg-surface)",
+													border: "1px solid var(--color-border-seam)",
+													borderRadius: 12,
+													color: "var(--color-text-primary)"
+												},
+												labelStyle: { color: "var(--color-text-tertiary)" },
+												itemStyle: { color: "var(--color-text-primary)" },
+												formatter: (e) => [`${a(Number(e))} ${H.unit}`, i(D)]
+											}),
+											/* @__PURE__ */ h(ge, {
+												type: "monotone",
+												dataKey: "value",
+												name: i(D),
+												stroke: E,
+												strokeWidth: 2.5,
+												fill: "url(#myb-progress-fill)",
+												fillOpacity: 1,
+												dot: !1,
+												activeDot: {
+													r: 5,
+													strokeWidth: 2,
+													stroke: "var(--color-bg-surface)",
+													fill: E
+												},
+												isAnimationActive: !B,
+												animationDuration: 900
+											}),
+											X && /* @__PURE__ */ h(d, {
+												x: X.label,
+												y: X.value,
+												r: 12,
+												isFront: !0,
+												ifOverflow: "visible",
+												fill: E,
+												fillOpacity: .16,
+												stroke: "none"
+											}),
+											X && /* @__PURE__ */ h(d, {
+												x: X.label,
+												y: X.value,
+												r: 5,
+												isFront: !0,
+												ifOverflow: "visible",
+												fill: E,
+												stroke: "var(--color-bg-surface)",
+												strokeWidth: 2
+											})
+										]
+									})
 								})
-							})
-						})]
+							})]
+						})
 					}),
-					Z && /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ p("div", {
+					Z && /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ g("div", {
 						className: "grid grid-cols-1 gap-4 sm:grid-cols-3",
 						children: [
-							/* @__PURE__ */ f(t, {
-								icon: /* @__PURE__ */ f(xe, { className: "h-5 w-5" }),
-								value: r(Z.count),
-								label: "Recent readings"
+							/* @__PURE__ */ h(e.div, {
+								...V(.08),
+								children: /* @__PURE__ */ h(n, {
+									className: "h-full rounded-2xl transition-shadow duration-300 hover:shadow-xl",
+									icon: /* @__PURE__ */ h(c, {
+										icon: /* @__PURE__ */ h(xe, { className: "h-5 w-5" }),
+										tint: E
+									}),
+									value: a(Z.count),
+									label: "Recent readings"
+								})
 							}),
-							/* @__PURE__ */ f(t, {
-								icon: /* @__PURE__ */ f(Ce, { className: "h-5 w-5" }),
-								value: `${r(Z.avg, { maximumFractionDigits: 1 })} ${W.unit}`,
-								label: `Window average ${n(j).toLowerCase()}`
+							/* @__PURE__ */ h(e.div, {
+								...V(.14),
+								children: /* @__PURE__ */ h(n, {
+									className: "h-full rounded-2xl transition-shadow duration-300 hover:shadow-xl",
+									icon: /* @__PURE__ */ h(c, {
+										icon: /* @__PURE__ */ h(Ce, { className: "h-5 w-5" }),
+										tint: E
+									}),
+									value: `${a(Z.avg, { maximumFractionDigits: 1 })} ${H.unit}`,
+									label: `Window average ${i(D).toLowerCase()}`
+								})
 							}),
-							/* @__PURE__ */ f(t, {
-								icon: /* @__PURE__ */ f(Se, { className: "h-5 w-5" }),
-								value: `${r(Z.min)}–${r(Z.max)}`,
-								label: `Window range (${W.unit})`
+							/* @__PURE__ */ h(e.div, {
+								...V(.2),
+								children: /* @__PURE__ */ h(n, {
+									className: "h-full rounded-2xl transition-shadow duration-300 hover:shadow-xl",
+									icon: /* @__PURE__ */ h(c, {
+										icon: /* @__PURE__ */ h(Se, { className: "h-5 w-5" }),
+										tint: E
+									}),
+									value: `${a(Z.min)}–${a(Z.max)}`,
+									label: `Window range (${H.unit})`
+								})
 							})
 						]
-					}), /* @__PURE__ */ p("p", {
+					}), /* @__PURE__ */ g("p", {
 						className: "mt-2 text-xs text-text-tertiary",
 						children: [
 							"Based on your most recent ",
-							r(Z.count),
+							a(Z.count),
 							" ",
-							n(j).toLowerCase(),
+							i(D).toLowerCase(),
 							" reading",
 							Z.count === 1 ? "" : "s",
 							" (up to ",
-							r(k),
+							a(w),
 							") — not a full-history total."
 						]
 					})] }),
-					/* @__PURE__ */ f(ie, {
-						title: "Measurement log",
-						description: "Every recorded reading for this metric.",
-						children: H.isError ? /* @__PURE__ */ f(i, {
-							message: "We couldn't load this page of measurements.",
-							onRetry: () => H.refetch()
-						}) : H.isLoading && $.length === 0 ? /* @__PURE__ */ f("div", {
-							className: "py-8 text-center text-sm text-text-secondary",
-							children: "Loading measurements…"
-						}) : $.length === 0 ? /* @__PURE__ */ f(a, {
-							illustration: "empty-data",
-							icon: /* @__PURE__ */ f(G, { className: "h-10 w-10" }),
-							title: "No measurements on this page",
-							description: "Go back a page or record a new measurement."
-						}) : /* @__PURE__ */ p(we, { children: [/* @__PURE__ */ f(le, {
-							columns: [
-								{
-									key: "value",
-									header: "Value",
-									align: "right",
-									sortValue: (e) => e.value,
-									render: (e) => /* @__PURE__ */ p("span", {
-										className: "font-medium tabular-nums text-text-primary",
-										children: [r(e.value), /* @__PURE__ */ f("span", {
-											className: "ml-1 text-xs font-normal text-text-tertiary",
-											children: e.unit
-										})]
-									})
-								},
-								{
+					/* @__PURE__ */ h(e.div, {
+						...V(.26, !1),
+						children: /* @__PURE__ */ h(ie, {
+							title: "Measurement log",
+							description: "Every recorded reading for this metric.",
+							children: R.isError ? /* @__PURE__ */ h(o, {
+								message: "We couldn't load this page of measurements.",
+								onRetry: () => R.refetch()
+							}) : R.isLoading && $.length === 0 ? /* @__PURE__ */ h("div", {
+								className: "py-8 text-center text-sm text-text-secondary",
+								children: "Loading measurements…"
+							}) : $.length === 0 ? /* @__PURE__ */ h(s, {
+								illustration: "empty-data",
+								icon: /* @__PURE__ */ h(U, { className: "h-10 w-10" }),
+								title: "No measurements on this page",
+								description: "Go back a page or record a new measurement."
+							}) : /* @__PURE__ */ g(we, { children: [/* @__PURE__ */ h(ce, {
+								columns: Be,
+								rows: $,
+								rowKey: (e) => e.id,
+								defaultSort: {
 									key: "measuredAt",
-									header: "Measured",
-									sortValue: (e) => new Date(e.measuredAt).getTime(),
-									render: (e) => /* @__PURE__ */ f("span", {
-										className: "whitespace-nowrap text-text-secondary",
-										children: te(e.measuredAt)
-									})
-								},
-								{
-									key: "notes",
-									header: "Notes",
-									hideOnMobile: !0,
-									render: (e) => e.notes ? /* @__PURE__ */ f("span", {
-										className: "text-text-secondary",
-										children: e.notes
-									}) : /* @__PURE__ */ f("span", {
-										className: "text-text-tertiary",
-										children: "—"
-									})
-								},
-								{
-									key: "photo",
-									header: "Photo",
-									render: (e) => e.photo?.id ? /* @__PURE__ */ f(pe, { fileId: e.photo.id }) : /* @__PURE__ */ f("span", {
-										className: "text-text-tertiary",
-										children: "—"
-									})
+									dir: "desc"
 								}
-							],
-							rows: $,
-							rowKey: (e) => e.id,
-							defaultSort: {
-								key: "measuredAt",
-								dir: "desc"
-							}
-						}), /* @__PURE__ */ f(de, {
-							page: z.page,
-							pageSize: A,
-							itemCount: $.length,
-							hasMore: H.data?.pageInfo?.hasMore ?? !1,
-							onPageChange: (e) => z.onPageChange(e)
-						})] })
+							}), /* @__PURE__ */ h(ue, {
+								page: F.page,
+								pageSize: T,
+								itemCount: $.length,
+								hasMore: R.data?.pageInfo?.hasMore ?? !1,
+								onPageChange: (e) => F.onPageChange(e)
+							})] })
+						})
 					})
 				]
 			}),
-			/* @__PURE__ */ f(Ee, {
-				open: Oe,
-				onOpenChange: P,
-				children: /* @__PURE__ */ p(_, { children: [
-					/* @__PURE__ */ p(b, { children: [/* @__PURE__ */ f(x, { children: "Record measurement" }), /* @__PURE__ */ f(v, { children: "Log a new body-metric reading to track your progress over time." })] }),
-					/* @__PURE__ */ p("div", {
+			/* @__PURE__ */ h(Ee, {
+				open: Ie,
+				onOpenChange: A,
+				children: /* @__PURE__ */ g(De, { children: [
+					/* @__PURE__ */ g(Ae, { children: [/* @__PURE__ */ h(je, { children: "Record measurement" }), /* @__PURE__ */ h(Oe, { children: "Log a new body-metric reading to track your progress over time." })] }),
+					/* @__PURE__ */ g("div", {
 						className: "space-y-4 py-2",
 						children: [
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ g("div", {
 								className: "space-y-1.5",
-								children: [/* @__PURE__ */ f(g, {
+								children: [/* @__PURE__ */ h(y, {
 									htmlFor: "myb-metric-type",
 									children: "Metric"
-								}), /* @__PURE__ */ p(S, {
-									value: F.type,
+								}), /* @__PURE__ */ g(b, {
+									value: j.type,
 									onValueChange: (e) => {
 										let t = e;
-										I((e) => ({
+										M((e) => ({
 											...e,
 											type: t,
-											unit: o[t].unit
+											unit: l[t].unit
 										}));
 									},
-									children: [/* @__PURE__ */ f(T, {
+									children: [/* @__PURE__ */ h(Me, {
 										id: "myb-metric-type",
-										children: /* @__PURE__ */ f(E, { placeholder: "Select a metric" })
-									}), /* @__PURE__ */ f(C, { children: O.map((e) => /* @__PURE__ */ f(w, {
+										children: /* @__PURE__ */ h(Ne, { placeholder: "Select a metric" })
+									}), /* @__PURE__ */ h(x, { children: C.map((e) => /* @__PURE__ */ h(S, {
 										value: e,
-										children: n(e)
+										children: i(e)
 									}, e)) })]
 								})]
 							}),
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ g("div", {
 								className: "grid grid-cols-2 gap-3",
-								children: [/* @__PURE__ */ p("div", {
+								children: [/* @__PURE__ */ g("div", {
 									className: "space-y-1.5",
-									children: [/* @__PURE__ */ f(g, {
+									children: [/* @__PURE__ */ h(y, {
 										htmlFor: "myb-metric-value",
 										children: "Value"
-									}), /* @__PURE__ */ f(h, {
+									}), /* @__PURE__ */ h(v, {
 										id: "myb-metric-value",
 										type: "number",
 										inputMode: "decimal",
 										step: "any",
-										value: F.value,
-										onChange: (e) => I((t) => ({
+										value: j.value,
+										onChange: (e) => M((t) => ({
 											...t,
 											value: e.target.value
 										})),
 										placeholder: "0"
 									})]
-								}), /* @__PURE__ */ p("div", {
+								}), /* @__PURE__ */ g("div", {
 									className: "space-y-1.5",
-									children: [/* @__PURE__ */ f(g, {
+									children: [/* @__PURE__ */ h(y, {
 										htmlFor: "myb-metric-unit",
 										children: "Unit"
-									}), /* @__PURE__ */ f(h, {
+									}), /* @__PURE__ */ h(v, {
 										id: "myb-metric-unit",
-										value: F.unit,
-										onChange: (e) => I((t) => ({
+										value: j.unit,
+										onChange: (e) => M((t) => ({
 											...t,
 											unit: e.target.value
 										})),
-										placeholder: o[F.type].unit
+										placeholder: l[j.type].unit
 									})]
 								})]
 							}),
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ g("div", {
 								className: "space-y-1.5",
-								children: [/* @__PURE__ */ f(g, {
+								children: [/* @__PURE__ */ h(y, {
 									htmlFor: "myb-metric-measured",
 									children: "Measured at"
-								}), /* @__PURE__ */ f(h, {
+								}), /* @__PURE__ */ h(v, {
 									id: "myb-metric-measured",
 									type: "datetime-local",
-									value: F.measuredAt,
-									onChange: (e) => I((t) => ({
+									value: j.measuredAt,
+									onChange: (e) => M((t) => ({
 										...t,
 										measuredAt: e.target.value
 									}))
 								})]
 							}),
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ g("div", {
 								className: "space-y-1.5",
-								children: [/* @__PURE__ */ f(g, {
+								children: [/* @__PURE__ */ h(y, {
 									htmlFor: "myb-metric-notes",
 									children: "Notes"
-								}), /* @__PURE__ */ f(D, {
+								}), /* @__PURE__ */ h(Pe, {
 									id: "myb-metric-notes",
-									value: F.notes,
-									onChange: (e) => I((t) => ({
+									value: j.notes,
+									onChange: (e) => M((t) => ({
 										...t,
 										notes: e.target.value
 									})),
@@ -445,33 +556,33 @@ function N() {
 									rows: 3
 								})]
 							}),
-							/* @__PURE__ */ f(fe, {
+							/* @__PURE__ */ h(de, {
 								id: "myb-metric-photo",
 								label: "Progress photo (optional)",
-								value: F.photo,
-								onChange: (e) => I((t) => ({
+								value: j.photo,
+								onChange: (e) => M((t) => ({
 									...t,
 									photo: e
 								})),
 								accept: "image/*",
-								disabled: U.isPending,
+								disabled: z.isPending,
 								hint: "Attach a progress photo for this reading."
 							}),
-							L && /* @__PURE__ */ f("p", {
+							N && /* @__PURE__ */ h("p", {
 								className: "text-sm text-status-error-text",
-								children: L
+								children: N
 							})
 						]
 					}),
-					/* @__PURE__ */ p(y, { children: [/* @__PURE__ */ f(m, {
+					/* @__PURE__ */ g(ke, { children: [/* @__PURE__ */ h(_, {
 						variant: "outline",
-						onClick: () => P(!1),
-						disabled: U.isPending,
+						onClick: () => A(!1),
+						disabled: z.isPending,
 						children: "Cancel"
-					}), /* @__PURE__ */ f(m, {
-						onClick: Me,
-						disabled: U.isPending,
-						children: U.isPending ? "Recording…" : "Record"
+					}), /* @__PURE__ */ h(_, {
+						onClick: ze,
+						disabled: z.isPending,
+						children: z.isPending ? "Recording…" : "Record"
 					})] })
 				] })
 			})
@@ -479,6 +590,6 @@ function N() {
 	});
 }
 //#endregion
-export { N as ProgressPage };
+export { k as ProgressPage };
 
 //# sourceMappingURL=ProgressPage.js.map