@burdenoff/microfe-mybodyshield 2026.525.1 → 2026.705.2

package/dist/mybodyshield/pages/DashboardPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DashboardPage.js","names":[],"sources":["../../../src/mybodyshield/pages/DashboardPage.tsx"],"sourcesContent":["/**\n * Dashboard — MyBodyShield health & fitness overview.\n * @module mybodyshield/pages\n *\n * KPIs are aggregated client-side from the real `myb*` list endpoints:\n * active programs, this-week's sessions, goal progress, today's macros vs\n * target, latest body weight and recovery readiness. No mock data.\n */\n\nimport { useMemo } from 'react';\nimport {\n  Dumbbell,\n  Flame,\n  Target,\n  Salad,\n  Moon,\n  ArrowRight,\n  CheckCircle2,\n  Weight,\n  CalendarCheck,\n} from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../components/PageLayout';\nimport { MetricsCard } from '../components/MetricsCard';\nimport { StatusBadge } from '../components/StatusBadge';\nimport { MiniBar } from '../components/MiniBar';\nimport { LoadingView, Section } from '../components/StateViews';\nimport { EmptyState } from '../components/EmptyState';\nimport {\n  Meter,\n  ProgressRing,\n  MacroBar,\n  MacroLegend,\n  IconChip,\n  GOAL_TYPE_META,\n  RECOVERY_META,\n  WORKOUT_TYPE_META,\n  computeGoalProgress,\n} from './_shared/visuals';\nimport { useMyBodyShield } from '../context';\nimport {\n  useMybPrograms,\n  useMybSessions,\n  useMybGoals,\n  useMybDailyMacros,\n  useMybBodyMetrics,\n  useMybRecoveryLogs,\n} from '../hooks';\nimport {\n  formatNumber,\n  formatRelativeTime,\n  formatKcal,\n  formatWeight,\n  formatPercent,\n  formatEnumLabel,\n} from '../utils/formatters';\n\nexport function DashboardPage() {\n  const { navigateTo, currentUser } = useMyBodyShield();\n\n  const programs = useMybPrograms({ status: 'ACTIVE', pagination: { limit: 50 } });\n  const sessions = useMybSessions({ pagination: { limit: 20 } });\n  const goals = useMybGoals({ status: 'ACTIVE', pagination: { limit: 50 } });\n  const macros = useMybDailyMacros();\n  const weightMetrics = useMybBodyMetrics({ type: 'WEIGHT', pagination: { limit: 30 } });\n  const readiness = useMybRecoveryLogs('READINESS');\n\n  const programRows = programs.data?.items ?? [];\n  const sessionRows = sessions.data?.items ?? [];\n  const goalRows = goals.data?.items ?? [];\n  const weightRows = weightMetrics.data?.items ?? [];\n  const readinessRows = readiness.data ?? [];\n\n  const now = new Date();\n  const weekAgo = now.getTime() - 7 * 24 * 60 * 60 * 1000;\n  const sessionsThisWeek = sessionRows.filter((s) => {\n    const ref = s.completedAt ?? s.startedAt ?? s.scheduledFor ?? s.createdAt;\n    return ref ? new Date(ref).getTime() >= weekAgo : false;\n  });\n  const completedThisWeek = sessionsThisWeek.filter((s) => s.status === 'COMPLETED').length;\n  const activeSession = sessionRows.find((s) => s.status === 'IN_PROGRESS');\n  const upcomingSession = sessionRows\n    .filter((s) => s.status === 'SCHEDULED' && s.scheduledFor)\n    .sort((a, b) => new Date(a.scheduledFor!).getTime() - new Date(b.scheduledFor!).getTime())[0];\n\n  const latestWeight = weightRows[0];\n  const priorWeight = weightRows[1];\n  const weightDelta =\n    latestWeight && priorWeight ? latestWeight.value - priorWeight.value : undefined;\n\n  const latestReadiness = readinessRows\n    .slice()\n    .sort((a, b) => new Date(b.loggedAt).getTime() - new Date(a.loggedAt).getTime())[0];\n\n  const goalProgressAvg = useMemo(() => {\n    if (goalRows.length === 0) return 0;\n    const sum = goalRows.reduce((acc, g) => acc + computeGoalProgress(g), 0);\n    return sum / goalRows.length;\n  }, [goalRows]);\n\n  const macroData = macros.data;\n  const caloriePct = macroData?.calorieTarget\n    ? (macroData.calories / macroData.calorieTarget) * 100\n    : 0;\n\n  const isInitialLoading =\n    programs.isLoading && sessions.isLoading && goals.isLoading && macros.isLoading;\n\n  if (isInitialLoading) {\n    return (\n      <PageLayout title=\"MyBodyShield\" titleGradient aurora>\n        <LoadingView label=\"Loading your fitness overview…\" />\n      </PageLayout>\n    );\n  }\n\n  const greetingName = currentUser?.firstName || currentUser?.name || 'there';\n\n  return (\n    <PageLayout\n      title=\"MyBodyShield\"\n      titleGradient\n      aurora\n      description={`Welcome back, ${greetingName} — your training, nutrition, progress & recovery control room.`}\n    >\n      {/* KPI grid */}\n      <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5\">\n        <MetricsCard\n          icon={<Dumbbell className=\"h-5 w-5\" />}\n          value={formatNumber(programRows.length)}\n          label=\"Active programs\"\n          footer={\n            <p className=\"text-xs text-text-tertiary\">\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('programs')}\n                className=\"font-medium text-accent hover:underline\"\n              >\n                Manage programs\n              </button>\n            </p>\n          }\n        />\n        <MetricsCard\n          icon={<Flame className=\"h-5 w-5\" />}\n          value={formatNumber(completedThisWeek)}\n          label=\"Sessions this week\"\n          accent={activeSession ? 'warning' : undefined}\n          footer={\n            activeSession ? (\n              <button\n                type=\"button\"\n                onClick={() => navigateTo(`train/${activeSession.id}`)}\n                className=\"text-xs font-medium text-status-warning-text hover:underline\"\n              >\n                Resume live session →\n              </button>\n            ) : (\n              <p className=\"text-xs text-text-tertiary\">\n                <span className=\"tabular-nums text-text-secondary\">{sessionsThisWeek.length}</span>{' '}\n                logged\n              </p>\n            )\n          }\n        />\n        <MetricsCard\n          icon={<Target className=\"h-5 w-5\" />}\n          value={formatNumber(goalRows.length)}\n          label=\"Active goals\"\n          footer={\n            <div className=\"space-y-2\">\n              <MiniBar value={goalProgressAvg} height={4} barClassName=\"bg-accent-teal\" />\n              <p className=\"text-xs text-text-tertiary\">\n                <span className=\"tabular-nums text-text-secondary\">\n                  {formatPercent(goalProgressAvg)}\n                </span>{' '}\n                avg progress\n              </p>\n            </div>\n          }\n        />\n        <MetricsCard\n          icon={<Weight className=\"h-5 w-5\" />}\n          value={latestWeight ? formatWeight(latestWeight.value) : '—'}\n          label=\"Latest weight\"\n          footer={\n            weightDelta != null ? (\n              <p className=\"text-xs text-text-tertiary\">\n                <span\n                  className={\n                    weightDelta <= 0\n                      ? 'font-medium text-status-success-text'\n                      : 'font-medium text-text-secondary'\n                  }\n                >\n                  {weightDelta > 0 ? '+' : ''}\n                  {weightDelta.toFixed(1)} kg\n                </span>{' '}\n                vs last\n              </p>\n            ) : (\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('progress')}\n                className=\"text-xs font-medium text-accent hover:underline\"\n              >\n                Log a measurement →\n              </button>\n            )\n          }\n        />\n        <MetricsCard\n          icon={<Moon className=\"h-5 w-5\" />}\n          value={latestReadiness ? `${latestReadiness.score}` : '—'}\n          label=\"Recovery readiness\"\n          accent={\n            latestReadiness\n              ? latestReadiness.score >= 70\n                ? 'success'\n                : latestReadiness.score >= 40\n                  ? 'warning'\n                  : 'error'\n              : undefined\n          }\n          footer={\n            latestReadiness ? (\n              <p className=\"text-xs text-text-tertiary\">\n                {formatRelativeTime(latestReadiness.loggedAt)}\n              </p>\n            ) : (\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('recovery')}\n                className=\"text-xs font-medium text-accent hover:underline\"\n              >\n                Log recovery →\n              </button>\n            )\n          }\n        />\n      </div>\n\n      <div className=\"mt-6 grid grid-cols-1 gap-6 lg:grid-cols-3\">\n        {/* Today's nutrition */}\n        <GlassCard treatment=\"glass\" className=\"p-6 lg:col-span-2\">\n          <div className=\"mb-4 flex flex-wrap items-start justify-between gap-3\">\n            <div>\n              <h2 className=\"text-base font-semibold text-text-primary\">Today&apos;s nutrition</h2>\n              <p className=\"mt-0.5 text-sm text-text-secondary\">\n                Calories & macros logged against your active plan.\n              </p>\n            </div>\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('nutrition')}\n              className=\"inline-flex items-center gap-1 text-sm font-medium text-accent hover:underline\"\n            >\n              Nutrition <ArrowRight className=\"h-4 w-4\" />\n            </button>\n          </div>\n          {!macroData || (macroData.calorieTarget === 0 && macroData.calories === 0) ? (\n            <EmptyState\n              illustration=\"empty-data\"\n              icon={<Salad className=\"h-10 w-10\" />}\n              title=\"No nutrition data yet\"\n              description=\"Activate a nutrition plan and log meals to track your daily macros here.\"\n            />\n          ) : (\n            <div className=\"flex flex-col gap-6 sm:flex-row sm:items-center\">\n              <ProgressRing value={caloriePct} size={128} stroke={12}>\n                <span className=\"text-xl font-bold tabular-nums text-text-primary\">\n                  {formatNumber(macroData.calories)}\n                </span>\n                <span className=\"text-xs text-text-tertiary\">\n                  / {formatNumber(macroData.calorieTarget)} kcal\n                </span>\n              </ProgressRing>\n              <div className=\"flex-1 space-y-4\">\n                <div className=\"space-y-2\">\n                  <MacroBar\n                    proteinG={macroData.proteinG}\n                    carbsG={macroData.carbsG}\n                    fatG={macroData.fatG}\n                    height={10}\n                  />\n                  <MacroLegend />\n                </div>\n                <div className=\"grid grid-cols-3 gap-3\">\n                  {(\n                    [\n                      ['Protein', macroData.proteinG, macroData.proteinTarget],\n                      ['Carbs', macroData.carbsG, macroData.carbsTarget],\n                      ['Fat', macroData.fatG, macroData.fatTarget],\n                    ] as const\n                  ).map(([label, val, target]) => (\n                    <div key={label} className=\"rounded-xl bg-bg-sunken/60 p-3\">\n                      <p className=\"text-xs text-text-tertiary\">{label}</p>\n                      <p className=\"mt-0.5 text-sm font-semibold tabular-nums text-text-primary\">\n                        {formatNumber(val)}\n                        <span className=\"text-xs font-normal text-text-tertiary\">\n                          {' '}\n                          / {formatNumber(target)} g\n                        </span>\n                      </p>\n                      <Meter\n                        value={target ? (val / target) * 100 : 0}\n                        height={4}\n                        className=\"mt-2\"\n                      />\n                    </div>\n                  ))}\n                </div>\n              </div>\n            </div>\n          )}\n        </GlassCard>\n\n        {/* Next up */}\n        <GlassCard treatment=\"glass\" className=\"p-6\">\n          <div className=\"mb-4 flex items-center justify-between gap-3\">\n            <h2 className=\"text-base font-semibold text-text-primary\">Next up</h2>\n            <button\n              type=\"button\"\n              onClick={() => navigateTo('train')}\n              className=\"inline-flex items-center gap-1 text-sm font-medium text-accent hover:underline\"\n            >\n              Train <ArrowRight className=\"h-4 w-4\" />\n            </button>\n          </div>\n          {activeSession ? (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo(`train/${activeSession.id}`)}\n              className=\"w-full rounded-xl border border-status-warning-text/40 bg-status-warning-bg-subtle p-4 text-left\"\n            >\n              <div className=\"flex items-center gap-2\">\n                <StatusBadge status={activeSession.status} />\n              </div>\n              <p className=\"mt-2 text-sm font-medium text-text-primary\">Live workout in progress</p>\n              <p className=\"mt-0.5 text-xs text-text-tertiary\">\n                Started {formatRelativeTime(activeSession.startedAt)}\n              </p>\n            </button>\n          ) : upcomingSession ? (\n            <button\n              type=\"button\"\n              onClick={() => navigateTo(`train/${upcomingSession.id}`)}\n              className=\"w-full rounded-xl bg-bg-sunken/60 p-4 text-left transition-shadow hover:shadow-float\"\n            >\n              <div className=\"flex items-center gap-2\">\n                <IconChip icon={<CalendarCheck className=\"h-4 w-4\" />} />\n                <div>\n                  <p className=\"text-sm font-medium text-text-primary\">Scheduled session</p>\n                  <p className=\"text-xs text-text-tertiary\">\n                    {formatRelativeTime(upcomingSession.scheduledFor)}\n                  </p>\n                </div>\n              </div>\n            </button>\n          ) : (\n            <div className=\"flex flex-col items-center justify-center rounded-xl border border-dashed border-border-seam py-8 text-center\">\n              <span className=\"flex size-11 items-center justify-center rounded-full bg-[var(--color-accent-soft)]\">\n                <Flame className=\"h-5 w-5 text-accent\" />\n              </span>\n              <p className=\"mt-3 text-sm font-medium text-text-primary\">No session scheduled</p>\n              <button\n                type=\"button\"\n                onClick={() => navigateTo('train')}\n                className=\"mt-1 text-xs font-medium text-accent hover:underline\"\n              >\n                Start a workout\n              </button>\n            </div>\n          )}\n        </GlassCard>\n      </div>\n\n      {/* Active goals */}\n      <Section\n        title=\"Active goals\"\n        description=\"Your current targets across training, nutrition and body composition.\"\n        action={\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('goals')}\n            className=\"inline-flex items-center gap-1 text-sm font-medium text-accent hover:underline\"\n          >\n            All goals <ArrowRight className=\"h-4 w-4\" />\n          </button>\n        }\n      >\n        {goalRows.length === 0 ? (\n          <EmptyState\n            illustration=\"empty-data\"\n            icon={<Target className=\"h-10 w-10\" />}\n            title=\"No active goals\"\n            description=\"Set a goal to give your training and nutrition a clear target to work toward.\"\n          />\n        ) : (\n          <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n            {goalRows.slice(0, 6).map((g) => {\n              const pct = computeGoalProgress(g);\n              const meta = GOAL_TYPE_META[g.type];\n              const Icon = meta.icon;\n              return (\n                <button\n                  key={g.id}\n                  type=\"button\"\n                  onClick={() => navigateTo('goals')}\n                  className=\"text-left\"\n                >\n                  <GlassCard\n                    treatment=\"plain\"\n                    className=\"h-full p-4 transition-shadow hover:shadow-float\"\n                  >\n                    <div className=\"flex items-start gap-3\">\n                      <IconChip icon={<Icon className=\"h-4 w-4\" />} tint={meta.tint} />\n                      <div className=\"min-w-0 flex-1\">\n                        <p className=\"truncate text-sm font-semibold text-text-primary\">\n                          {g.title}\n                        </p>\n                        <p className=\"text-xs text-text-tertiary\">{formatEnumLabel(g.type)}</p>\n                      </div>\n                    </div>\n                    <div className=\"mt-3 space-y-1.5\">\n                      <Meter value={pct} color={meta.tint} />\n                      <div className=\"flex items-center justify-between text-xs\">\n                        <span className=\"tabular-nums text-text-secondary\">\n                          {formatNumber(g.currentValue)}\n                          {g.unit ? ` ${g.unit}` : ''} / {formatNumber(g.targetValue)}\n                          {g.unit ? ` ${g.unit}` : ''}\n                        </span>\n                        <span className=\"tabular-nums text-text-tertiary\">\n                          {formatPercent(pct)}\n                        </span>\n                      </div>\n                    </div>\n                  </GlassCard>\n                </button>\n              );\n            })}\n          </div>\n        )}\n      </Section>\n\n      {/* Recent sessions */}\n      <Section\n        title=\"Recent sessions\"\n        description=\"Your latest logged and scheduled workouts.\"\n        action={\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('train')}\n            className=\"inline-flex items-center gap-1 text-sm font-medium text-accent hover:underline\"\n          >\n            All sessions <ArrowRight className=\"h-4 w-4\" />\n          </button>\n        }\n      >\n        {sessionRows.length === 0 ? (\n          <EmptyState\n            illustration=\"empty-data\"\n            icon={<Flame className=\"h-10 w-10\" />}\n            title=\"No sessions yet\"\n            description=\"Start a workout session to begin logging sets and tracking your training.\"\n          />\n        ) : (\n          <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n            {sessionRows.slice(0, 6).map((s) => {\n              const meta = WORKOUT_TYPE_META.STRENGTH;\n              const Icon = s.status === 'COMPLETED' ? CheckCircle2 : meta.icon;\n              return (\n                <button\n                  key={s.id}\n                  type=\"button\"\n                  onClick={() => navigateTo(`train/${s.id}`)}\n                  className=\"text-left\"\n                >\n                  <GlassCard treatment=\"plain\" className=\"p-4 transition-shadow hover:shadow-float\">\n                    <div className=\"flex items-center justify-between gap-2\">\n                      <IconChip icon={<Icon className=\"h-4 w-4\" />} tint={meta.tint} />\n                      <StatusBadge status={s.status} />\n                    </div>\n                    <p className=\"mt-3 text-sm font-medium text-text-primary\">\n                      {s.caloriesBurned > 0\n                        ? `${formatNumber(s.caloriesBurned)} kcal burned`\n                        : 'Workout session'}\n                    </p>\n                    <p className=\"mt-0.5 text-xs text-text-tertiary\">\n                      {formatRelativeTime(s.completedAt ?? s.startedAt ?? s.createdAt)}\n                    </p>\n                  </GlassCard>\n                </button>\n              );\n            })}\n          </div>\n        )}\n      </Section>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/mybodyshield/pages/_shared/visuals.js

@@ -0,0 +1,261 @@
+import { cn as e } from "../../utils/cn.js";
+import { Activity as t, BedDouble as n, Brain as r, Dumbbell as i, Flower2 as a, Gauge as o, Heart as s, HeartPulse as c, Moon as l, Percent as u, Ruler as d, Smile as f, Sparkles as p, StretchHorizontal as m, TrendingDown as h, TrendingUp as g, Waves as _, Weight as v, Zap as y } from "lucide-react";
+import { jsx as b, jsxs as x } from "react/jsx-runtime";
+//#region src/mybodyshield/pages/_shared/visuals.tsx
+var S = ({ value: t, color: n = "var(--color-accent-teal)", height: r = 8, className: i }) => {
+	let a = Math.max(0, Math.min(100, t));
+	return /* @__PURE__ */ b("div", {
+		className: e("w-full overflow-hidden rounded-full bg-bg-sunken", i),
+		style: { height: r },
+		role: "progressbar",
+		"aria-valuenow": Math.round(a),
+		"aria-valuemin": 0,
+		"aria-valuemax": 100,
+		children: /* @__PURE__ */ b("div", {
+			className: "h-full rounded-full transition-[width] duration-500 ease-out",
+			style: {
+				width: `${a}%`,
+				backgroundColor: n
+			}
+		})
+	});
+}, C = ({ value: t, size: n = 96, stroke: r = 9, color: i = "var(--color-accent-teal)", trackColor: a = "var(--color-bg-sunken)", children: o, className: s }) => {
+	let c = Math.max(0, Math.min(100, t)), l = (n - r) / 2, u = 2 * Math.PI * l, d = u - c / 100 * u;
+	return /* @__PURE__ */ x("div", {
+		className: e("relative inline-flex items-center justify-center", s),
+		style: {
+			width: n,
+			height: n
+		},
+		children: [/* @__PURE__ */ x("svg", {
+			width: n,
+			height: n,
+			className: "-rotate-90",
+			children: [/* @__PURE__ */ b("circle", {
+				cx: n / 2,
+				cy: n / 2,
+				r: l,
+				fill: "none",
+				stroke: a,
+				strokeWidth: r
+			}), /* @__PURE__ */ b("circle", {
+				cx: n / 2,
+				cy: n / 2,
+				r: l,
+				fill: "none",
+				stroke: i,
+				strokeWidth: r,
+				strokeLinecap: "round",
+				strokeDasharray: u,
+				strokeDashoffset: d,
+				className: "transition-[stroke-dashoffset] duration-700 ease-out"
+			})]
+		}), o != null && /* @__PURE__ */ b("div", {
+			className: "absolute inset-0 flex flex-col items-center justify-center",
+			children: o
+		})]
+	});
+}, w = {
+	protein: "var(--color-accent-teal)",
+	carbs: "var(--color-status-warning-text)",
+	fat: "var(--color-accent-primary)"
+}, T = ({ proteinG: t, carbsG: n, fatG: r, height: i = 8, className: a }) => {
+	let o = Math.max(1, t + n + r), s = (e) => `${e / o * 100}%`;
+	return /* @__PURE__ */ x("div", {
+		className: e("flex w-full overflow-hidden rounded-full bg-bg-sunken", a),
+		style: { height: i },
+		children: [
+			/* @__PURE__ */ b("div", { style: {
+				width: s(t),
+				backgroundColor: w.protein
+			} }),
+			/* @__PURE__ */ b("div", { style: {
+				width: s(n),
+				backgroundColor: w.carbs
+			} }),
+			/* @__PURE__ */ b("div", { style: {
+				width: s(r),
+				backgroundColor: w.fat
+			} })
+		]
+	});
+}, E = ({ className: t }) => /* @__PURE__ */ b("div", {
+	className: e("flex flex-wrap items-center gap-3 text-xs text-text-tertiary", t),
+	children: [
+		"protein",
+		"carbs",
+		"fat"
+	].map((e) => /* @__PURE__ */ x("span", {
+		className: "inline-flex items-center gap-1.5",
+		children: [/* @__PURE__ */ b("span", {
+			className: "size-2 rounded-full",
+			style: { backgroundColor: w[e] }
+		}), /* @__PURE__ */ b("span", {
+			className: "capitalize",
+			children: e
+		})]
+	}, e))
+});
+function D(e, t) {
+	return new Proxy(e, { get(e, n) {
+		return e[n] ?? e[t];
+	} });
+}
+var O = D({
+	STRENGTH: {
+		icon: i,
+		tint: "var(--color-accent-primary)"
+	},
+	CARDIO: {
+		icon: c,
+		tint: "var(--color-status-warning-text)"
+	},
+	HIIT: {
+		icon: y,
+		tint: "var(--color-status-error-text)"
+	},
+	MOBILITY: {
+		icon: m,
+		tint: "var(--color-accent-teal)"
+	},
+	YOGA: {
+		icon: a,
+		tint: "var(--color-accent-teal)"
+	},
+	RECOVERY: {
+		icon: l,
+		tint: "var(--color-status-success-text)"
+	}
+}, "STRENGTH"), k = D({
+	CHEST: { tint: "var(--color-accent-primary)" },
+	BACK: { tint: "var(--color-accent-teal)" },
+	LEGS: { tint: "var(--color-status-warning-text)" },
+	SHOULDERS: { tint: "var(--color-status-error-text)" },
+	ARMS: { tint: "var(--color-accent-primary)" },
+	CORE: { tint: "var(--color-status-success-text)" },
+	FULL_BODY: { tint: "var(--color-text-secondary)" }
+}, "FULL_BODY"), A = D({
+	WEIGHT_LOSS: {
+		icon: h,
+		tint: "var(--color-accent-teal)"
+	},
+	MUSCLE_GAIN: {
+		icon: i,
+		tint: "var(--color-accent-primary)"
+	},
+	STRENGTH: {
+		icon: v,
+		tint: "var(--color-status-error-text)"
+	},
+	ENDURANCE: {
+		icon: t,
+		tint: "var(--color-status-warning-text)"
+	},
+	MOBILITY: {
+		icon: m,
+		tint: "var(--color-accent-teal)"
+	},
+	GENERAL_FITNESS: {
+		icon: p,
+		tint: "var(--color-text-secondary)"
+	}
+}, "GENERAL_FITNESS"), j = D({
+	WEIGHT: {
+		icon: v,
+		tint: "var(--color-accent-primary)",
+		unit: "kg"
+	},
+	BODY_FAT: {
+		icon: u,
+		tint: "var(--color-status-warning-text)",
+		unit: "%"
+	},
+	RESTING_HEART_RATE: {
+		icon: s,
+		tint: "var(--color-status-error-text)",
+		unit: "bpm"
+	},
+	WAIST: {
+		icon: d,
+		tint: "var(--color-accent-teal)",
+		unit: "cm"
+	},
+	CHEST: {
+		icon: d,
+		tint: "var(--color-accent-teal)",
+		unit: "cm"
+	},
+	HIPS: {
+		icon: d,
+		tint: "var(--color-accent-teal)",
+		unit: "cm"
+	},
+	ARM: {
+		icon: d,
+		tint: "var(--color-accent-teal)",
+		unit: "cm"
+	},
+	THIGH: {
+		icon: d,
+		tint: "var(--color-accent-teal)",
+		unit: "cm"
+	}
+}, "WEIGHT"), M = D({
+	SLEEP: {
+		icon: n,
+		tint: "var(--color-accent-primary)",
+		label: "Sleep"
+	},
+	READINESS: {
+		icon: o,
+		tint: "var(--color-status-success-text)",
+		label: "Readiness"
+	},
+	SORENESS: {
+		icon: _,
+		tint: "var(--color-status-warning-text)",
+		label: "Soreness"
+	},
+	STRESS: {
+		icon: r,
+		tint: "var(--color-status-error-text)",
+		label: "Stress"
+	},
+	MOOD: {
+		icon: f,
+		tint: "var(--color-accent-teal)",
+		label: "Mood"
+	}
+}, "READINESS"), N = ({ icon: t, tint: n = "var(--color-accent-teal)", className: r }) => /* @__PURE__ */ b("span", {
+	className: e("flex size-9 shrink-0 items-center justify-center rounded-lg", r),
+	style: {
+		backgroundColor: `color-mix(in srgb, ${n} 16%, transparent)`,
+		color: n
+	},
+	children: t
+}), P = ({ delta: t, unit: n = "", goodDirection: r = "up" }) => {
+	if (!Number.isFinite(t) || t === 0) return /* @__PURE__ */ x("span", {
+		className: "text-xs text-text-tertiary",
+		children: ["±0", n]
+	});
+	let i = t > 0, a = r === "up" ? i : !i, o = i ? g : h;
+	return /* @__PURE__ */ x("span", {
+		className: e("inline-flex items-center gap-1 text-xs font-medium tabular-nums", a ? "text-status-success-text" : "text-status-error-text"),
+		children: [
+			/* @__PURE__ */ b(o, { className: "h-3.5 w-3.5" }),
+			i ? "+" : "",
+			t.toFixed(1),
+			n
+		]
+	});
+};
+function F(e) {
+	let t = e.targetValue - e.baselineValue;
+	if (t === 0) return e.currentValue >= e.targetValue ? 100 : 0;
+	let n = (e.currentValue - e.baselineValue) / t * 100;
+	return Math.max(0, Math.min(100, n));
+}
+//#endregion
+export { A as GOAL_TYPE_META, N as IconChip, j as METRIC_META, k as MUSCLE_META, T as MacroBar, E as MacroLegend, S as Meter, C as ProgressRing, M as RECOVERY_META, P as TrendPill, O as WORKOUT_TYPE_META, F as computeGoalProgress };
+
+//# sourceMappingURL=visuals.js.map

package/dist/mybodyshield/pages/_shared/visuals.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"visuals.js","names":[],"sources":["../../../../src/mybodyshield/pages/_shared/visuals.tsx"],"sourcesContent":["/**\n * Shared fitness-domain visual helpers.\n * @module mybodyshield/pages/_shared\n *\n * Token-driven (no raw colors) SVG/CSS visual primitives + domain icon/tint\n * maps reused across the MyBodyShield pages. Everything reads fe-libs semantic\n * tokens so light/dark themes and custom themes work automatically.\n */\n\nimport type { FC, ReactNode } from 'react';\nimport {\n  Dumbbell,\n  HeartPulse,\n  Timer,\n  Activity,\n  StretchHorizontal,\n  Flower2,\n  Moon,\n  Weight,\n  Ruler,\n  Percent,\n  Heart,\n  TrendingDown,\n  TrendingUp,\n  Zap,\n  Waves,\n  Target,\n  Sparkles,\n  Brain,\n  BedDouble,\n  Gauge,\n  Smile,\n} from 'lucide-react';\nimport { cn } from '../../utils/cn';\nimport type {\n  MybBodyMetricType,\n  MybGoalType,\n  MybMuscleGroup,\n  MybRecoveryMetric,\n  MybWorkoutType,\n} from '../../types';\n\n// ============================================================================\n// Meter — a horizontal progress bar with a token-driven fill\n// ============================================================================\n\nexport const Meter: FC<{\n  /** 0–100 percentage. */\n  value: number;\n  /** CSS color for the fill (default: accent-teal). */\n  color?: string;\n  height?: number;\n  className?: string;\n}> = ({ value, color = 'var(--color-accent-teal)', height = 8, className }) => {\n  const pct = Math.max(0, Math.min(100, value));\n  return (\n    <div\n      className={cn('w-full overflow-hidden rounded-full bg-bg-sunken', className)}\n      style={{ height }}\n      role=\"progressbar\"\n      aria-valuenow={Math.round(pct)}\n      aria-valuemin={0}\n      aria-valuemax={100}\n    >\n      <div\n        className=\"h-full rounded-full transition-[width] duration-500 ease-out\"\n        style={{ width: `${pct}%`, backgroundColor: color }}\n      />\n    </div>\n  );\n};\n\n// ============================================================================\n// ProgressRing — a circular progress indicator (goal progress, readiness)\n// ============================================================================\n\nexport const ProgressRing: FC<{\n  value: number;\n  size?: number;\n  stroke?: number;\n  color?: string;\n  trackColor?: string;\n  children?: ReactNode;\n  className?: string;\n}> = ({\n  value,\n  size = 96,\n  stroke = 9,\n  color = 'var(--color-accent-teal)',\n  trackColor = 'var(--color-bg-sunken)',\n  children,\n  className,\n}) => {\n  const pct = Math.max(0, Math.min(100, value));\n  const r = (size - stroke) / 2;\n  const c = 2 * Math.PI * r;\n  const offset = c - (pct / 100) * c;\n  return (\n    <div\n      className={cn('relative inline-flex items-center justify-center', className)}\n      style={{ width: size, height: size }}\n    >\n      <svg width={size} height={size} className=\"-rotate-90\">\n        <circle\n          cx={size / 2}\n          cy={size / 2}\n          r={r}\n          fill=\"none\"\n          stroke={trackColor}\n          strokeWidth={stroke}\n        />\n        <circle\n          cx={size / 2}\n          cy={size / 2}\n          r={r}\n          fill=\"none\"\n          stroke={color}\n          strokeWidth={stroke}\n          strokeLinecap=\"round\"\n          strokeDasharray={c}\n          strokeDashoffset={offset}\n          className=\"transition-[stroke-dashoffset] duration-700 ease-out\"\n        />\n      </svg>\n      {children != null && (\n        <div className=\"absolute inset-0 flex flex-col items-center justify-center\">{children}</div>\n      )}\n    </div>\n  );\n};\n\n// ============================================================================\n// MacroBar — a stacked protein/carbs/fat bar (grams → proportion)\n// ============================================================================\n\nexport const MACRO_HUE = {\n  protein: 'var(--color-accent-teal)',\n  carbs: 'var(--color-status-warning-text)',\n  fat: 'var(--color-accent-primary)',\n} as const;\n\nexport const MacroBar: FC<{\n  proteinG: number;\n  carbsG: number;\n  fatG: number;\n  height?: number;\n  className?: string;\n}> = ({ proteinG, carbsG, fatG, height = 8, className }) => {\n  const total = Math.max(1, proteinG + carbsG + fatG);\n  const seg = (g: number) => `${(g / total) * 100}%`;\n  return (\n    <div\n      className={cn('flex w-full overflow-hidden rounded-full bg-bg-sunken', className)}\n      style={{ height }}\n    >\n      <div style={{ width: seg(proteinG), backgroundColor: MACRO_HUE.protein }} />\n      <div style={{ width: seg(carbsG), backgroundColor: MACRO_HUE.carbs }} />\n      <div style={{ width: seg(fatG), backgroundColor: MACRO_HUE.fat }} />\n    </div>\n  );\n};\n\nexport const MacroLegend: FC<{ className?: string }> = ({ className }) => (\n  <div className={cn('flex flex-wrap items-center gap-3 text-xs text-text-tertiary', className)}>\n    {(['protein', 'carbs', 'fat'] as const).map((k) => (\n      <span key={k} className=\"inline-flex items-center gap-1.5\">\n        <span className=\"size-2 rounded-full\" style={{ backgroundColor: MACRO_HUE[k] }} />\n        <span className=\"capitalize\">{k}</span>\n      </span>\n    ))}\n  </div>\n);\n\n// ============================================================================\n// Domain icon + tint maps (semantic tokens only)\n// ============================================================================\n\n/**\n * Wrap an enum→meta map so an unknown server enum value (svc stores enums as\n * TEXT, so a value outside the client union is plausible) resolves to a safe\n * fallback entry instead of `undefined` — accessing `.icon`/`.tint`/`.label` on\n * `undefined` would otherwise crash the whole page.\n */\nfunction metaWithFallback<K extends string, V>(\n  source: Record<K, V>,\n  fallback: NoInfer<K>\n): Record<K, V> {\n  return new Proxy(source, {\n    get(target, prop: string) {\n      return (target as Record<string, V>)[prop] ?? target[fallback];\n    },\n  }) as Record<K, V>;\n}\n\nconst WORKOUT_TYPE_META_SOURCE: Record<MybWorkoutType, { icon: typeof Dumbbell; tint: string }> = {\n  STRENGTH: { icon: Dumbbell, tint: 'var(--color-accent-primary)' },\n  CARDIO: { icon: HeartPulse, tint: 'var(--color-status-warning-text)' },\n  HIIT: { icon: Zap, tint: 'var(--color-status-error-text)' },\n  MOBILITY: { icon: StretchHorizontal, tint: 'var(--color-accent-teal)' },\n  YOGA: { icon: Flower2, tint: 'var(--color-accent-teal)' },\n  RECOVERY: { icon: Moon, tint: 'var(--color-status-success-text)' },\n};\nexport const WORKOUT_TYPE_META = metaWithFallback(WORKOUT_TYPE_META_SOURCE, 'STRENGTH');\n\nconst MUSCLE_META_SOURCE: Record<MybMuscleGroup, { tint: string }> = {\n  CHEST: { tint: 'var(--color-accent-primary)' },\n  BACK: { tint: 'var(--color-accent-teal)' },\n  LEGS: { tint: 'var(--color-status-warning-text)' },\n  SHOULDERS: { tint: 'var(--color-status-error-text)' },\n  ARMS: { tint: 'var(--color-accent-primary)' },\n  CORE: { tint: 'var(--color-status-success-text)' },\n  FULL_BODY: { tint: 'var(--color-text-secondary)' },\n};\nexport const MUSCLE_META = metaWithFallback(MUSCLE_META_SOURCE, 'FULL_BODY');\n\nconst GOAL_TYPE_META_SOURCE: Record<MybGoalType, { icon: typeof Target; tint: string }> = {\n  WEIGHT_LOSS: { icon: TrendingDown, tint: 'var(--color-accent-teal)' },\n  MUSCLE_GAIN: { icon: Dumbbell, tint: 'var(--color-accent-primary)' },\n  STRENGTH: { icon: Weight, tint: 'var(--color-status-error-text)' },\n  ENDURANCE: { icon: Activity, tint: 'var(--color-status-warning-text)' },\n  MOBILITY: { icon: StretchHorizontal, tint: 'var(--color-accent-teal)' },\n  GENERAL_FITNESS: { icon: Sparkles, tint: 'var(--color-text-secondary)' },\n};\nexport const GOAL_TYPE_META = metaWithFallback(GOAL_TYPE_META_SOURCE, 'GENERAL_FITNESS');\n\nconst METRIC_META_SOURCE: Record<\n  MybBodyMetricType,\n  { icon: typeof Weight; tint: string; unit: string }\n> = {\n  WEIGHT: { icon: Weight, tint: 'var(--color-accent-primary)', unit: 'kg' },\n  BODY_FAT: { icon: Percent, tint: 'var(--color-status-warning-text)', unit: '%' },\n  RESTING_HEART_RATE: { icon: Heart, tint: 'var(--color-status-error-text)', unit: 'bpm' },\n  WAIST: { icon: Ruler, tint: 'var(--color-accent-teal)', unit: 'cm' },\n  CHEST: { icon: Ruler, tint: 'var(--color-accent-teal)', unit: 'cm' },\n  HIPS: { icon: Ruler, tint: 'var(--color-accent-teal)', unit: 'cm' },\n  ARM: { icon: Ruler, tint: 'var(--color-accent-teal)', unit: 'cm' },\n  THIGH: { icon: Ruler, tint: 'var(--color-accent-teal)', unit: 'cm' },\n};\nexport const METRIC_META = metaWithFallback(METRIC_META_SOURCE, 'WEIGHT');\n\nconst RECOVERY_META_SOURCE: Record<\n  MybRecoveryMetric,\n  { icon: typeof Gauge; tint: string; label: string }\n> = {\n  SLEEP: { icon: BedDouble, tint: 'var(--color-accent-primary)', label: 'Sleep' },\n  READINESS: { icon: Gauge, tint: 'var(--color-status-success-text)', label: 'Readiness' },\n  SORENESS: { icon: Waves, tint: 'var(--color-status-warning-text)', label: 'Soreness' },\n  STRESS: { icon: Brain, tint: 'var(--color-status-error-text)', label: 'Stress' },\n  MOOD: { icon: Smile, tint: 'var(--color-accent-teal)', label: 'Mood' },\n};\nexport const RECOVERY_META = metaWithFallback(RECOVERY_META_SOURCE, 'READINESS');\n\n// ============================================================================\n// Small helpers\n// ============================================================================\n\n/** Circular icon chip with a soft tinted background. */\nexport const IconChip: FC<{ icon: ReactNode; tint?: string; className?: string }> = ({\n  icon,\n  tint = 'var(--color-accent-teal)',\n  className,\n}) => (\n  <span\n    className={cn('flex size-9 shrink-0 items-center justify-center rounded-lg', className)}\n    style={{ backgroundColor: `color-mix(in srgb, ${tint} 16%, transparent)`, color: tint }}\n  >\n    {icon}\n  </span>\n);\n\n/** A small trend delta pill (up/down/flat) with semantic color. */\nexport const TrendPill: FC<{ delta: number; unit?: string; goodDirection?: 'up' | 'down' }> = ({\n  delta,\n  unit = '',\n  goodDirection = 'up',\n}) => {\n  if (!Number.isFinite(delta) || delta === 0) {\n    return <span className=\"text-xs text-text-tertiary\">±0{unit}</span>;\n  }\n  const up = delta > 0;\n  const good = goodDirection === 'up' ? up : !up;\n  const Icon = up ? TrendingUp : TrendingDown;\n  return (\n    <span\n      className={cn(\n        'inline-flex items-center gap-1 text-xs font-medium tabular-nums',\n        good ? 'text-status-success-text' : 'text-status-error-text'\n      )}\n    >\n      <Icon className=\"h-3.5 w-3.5\" />\n      {up ? '+' : ''}\n      {delta.toFixed(1)}\n      {unit}\n    </span>\n  );\n};\n\n/** Compute a goal's completion percentage from baseline → target → current. */\nexport function computeGoalProgress(goal: {\n  baselineValue: number;\n  targetValue: number;\n  currentValue: number;\n}): number {\n  const span = goal.targetValue - goal.baselineValue;\n  if (span === 0) return goal.currentValue >= goal.targetValue ? 100 : 0;\n  const done = ((goal.currentValue - goal.baselineValue) / span) * 100;\n  return Math.max(0, Math.min(100, done));\n}\n\nexport { Timer };\n"],"mappings":"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"}