@contractspec/example.learning-journey-ui-coaching 0.0.0-canary-20260113170453

package/dist/CoachingMiniApp.js

@@ -0,0 +1,63 @@
+'use client';
+
+import { Overview } from "./views/Overview.js";
+import { Steps } from "./views/Steps.js";
+import { Progress as ProgressView } from "./views/Progress.js";
+import { Timeline } from "./views/Timeline.js";
+import { useCallback, useState } from "react";
+import { Card, CardContent } from "@contractspec/lib.ui-kit-web/ui/card";
+import { ViewTabs, useLearningProgress } from "@contractspec/example.learning-journey-ui-shared";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/CoachingMiniApp.tsx
+function CoachingMiniApp({ track, progress: externalProgress, onStepComplete: externalOnStepComplete, onViewChange, initialView = "overview" }) {
+	const [currentView, setCurrentView] = useState(initialView);
+	const { progress: internalProgress, completeStep: internalCompleteStep } = useLearningProgress(track);
+	const progress = externalProgress ?? internalProgress;
+	const handleViewChange = useCallback((view) => {
+		setCurrentView(view);
+		onViewChange?.(view);
+	}, [onViewChange]);
+	const handleStepComplete = useCallback((stepId) => {
+		if (externalOnStepComplete) externalOnStepComplete(stepId);
+		else internalCompleteStep(stepId);
+	}, [externalOnStepComplete, internalCompleteStep]);
+	const handleStartFromOverview = useCallback(() => {
+		setCurrentView("steps");
+		onViewChange?.("steps");
+	}, [onViewChange]);
+	const renderView = () => {
+		const viewProps = {
+			track,
+			progress,
+			onStepComplete: handleStepComplete
+		};
+		switch (currentView) {
+			case "overview": return /* @__PURE__ */ jsx(Overview, {
+				...viewProps,
+				onStart: handleStartFromOverview
+			});
+			case "steps": return /* @__PURE__ */ jsx(Steps, { ...viewProps });
+			case "progress": return /* @__PURE__ */ jsx(ProgressView, { ...viewProps });
+			case "timeline": return /* @__PURE__ */ jsx(Timeline, { ...viewProps });
+			default: return /* @__PURE__ */ jsx(Overview, {
+				...viewProps,
+				onStart: handleStartFromOverview
+			});
+		}
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-6",
+		children: [/* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(CardContent, {
+			className: "p-4",
+			children: /* @__PURE__ */ jsx(ViewTabs, {
+				currentView,
+				onViewChange: handleViewChange
+			})
+		}) }), renderView()]
+	});
+}
+
+//#endregion
+export { CoachingMiniApp };
+//# sourceMappingURL=CoachingMiniApp.js.map

package/dist/CoachingMiniApp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CoachingMiniApp.js","names":["Progress"],"sources":["../src/CoachingMiniApp.tsx"],"sourcesContent":["'use client';\n\nimport { useState, useCallback } from 'react';\nimport { Card, CardContent } from '@contractspec/lib.ui-kit-web/ui/card';\nimport {\n  ViewTabs,\n  useLearningProgress,\n  type LearningView,\n  type LearningMiniAppProps,\n} from '@contractspec/example.learning-journey-ui-shared';\nimport { Overview } from './views/Overview';\nimport { Steps } from './views/Steps';\nimport { Progress } from './views/Progress';\nimport { Timeline } from './views/Timeline';\n\ntype CoachingMiniAppProps = Omit<LearningMiniAppProps, 'progress'> & {\n  progress?: LearningMiniAppProps['progress'];\n};\n\nexport function CoachingMiniApp({\n  track,\n  progress: externalProgress,\n  onStepComplete: externalOnStepComplete,\n  onViewChange,\n  initialView = 'overview',\n}: CoachingMiniAppProps) {\n  const [currentView, setCurrentView] = useState<LearningView>(initialView);\n\n  // Use internal progress if not provided externally\n  const { progress: internalProgress, completeStep: internalCompleteStep } =\n    useLearningProgress(track);\n\n  const progress = externalProgress ?? internalProgress;\n\n  const handleViewChange = useCallback(\n    (view: LearningView) => {\n      setCurrentView(view);\n      onViewChange?.(view);\n    },\n    [onViewChange]\n  );\n\n  const handleStepComplete = useCallback(\n    (stepId: string) => {\n      if (externalOnStepComplete) {\n        externalOnStepComplete(stepId);\n      } else {\n        internalCompleteStep(stepId);\n      }\n    },\n    [externalOnStepComplete, internalCompleteStep]\n  );\n\n  const handleStartFromOverview = useCallback(() => {\n    setCurrentView('steps');\n    onViewChange?.('steps');\n  }, [onViewChange]);\n\n  const renderView = () => {\n    const viewProps = {\n      track,\n      progress,\n      onStepComplete: handleStepComplete,\n    };\n\n    switch (currentView) {\n      case 'overview':\n        return <Overview {...viewProps} onStart={handleStartFromOverview} />;\n      case 'steps':\n        return <Steps {...viewProps} />;\n      case 'progress':\n        return <Progress {...viewProps} />;\n      case 'timeline':\n        return <Timeline {...viewProps} />;\n      default:\n        return <Overview {...viewProps} onStart={handleStartFromOverview} />;\n    }\n  };\n\n  return (\n    <div className=\"space-y-6\">\n      {/* Navigation */}\n      <Card>\n        <CardContent className=\"p-4\">\n          <ViewTabs currentView={currentView} onViewChange={handleViewChange} />\n        </CardContent>\n      </Card>\n\n      {/* Current View */}\n      {renderView()}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;AAmBA,SAAgB,gBAAgB,EAC9B,OACA,UAAU,kBACV,gBAAgB,wBAChB,cACA,cAAc,cACS;CACvB,MAAM,CAAC,aAAa,kBAAkB,SAAuB,YAAY;CAGzE,MAAM,EAAE,UAAU,kBAAkB,cAAc,yBAChD,oBAAoB,MAAM;CAE5B,MAAM,WAAW,oBAAoB;CAErC,MAAM,mBAAmB,aACtB,SAAuB;AACtB,iBAAe,KAAK;AACpB,iBAAe,KAAK;IAEtB,CAAC,aAAa,CACf;CAED,MAAM,qBAAqB,aACxB,WAAmB;AAClB,MAAI,uBACF,wBAAuB,OAAO;MAE9B,sBAAqB,OAAO;IAGhC,CAAC,wBAAwB,qBAAqB,CAC/C;CAED,MAAM,0BAA0B,kBAAkB;AAChD,iBAAe,QAAQ;AACvB,iBAAe,QAAQ;IACtB,CAAC,aAAa,CAAC;CAElB,MAAM,mBAAmB;EACvB,MAAM,YAAY;GAChB;GACA;GACA,gBAAgB;GACjB;AAED,UAAQ,aAAR;GACE,KAAK,WACH,QAAO,oBAAC;IAAS,GAAI;IAAW,SAAS;KAA2B;GACtE,KAAK,QACH,QAAO,oBAAC,SAAM,GAAI,YAAa;GACjC,KAAK,WACH,QAAO,oBAACA,gBAAS,GAAI,YAAa;GACpC,KAAK,WACH,QAAO,oBAAC,YAAS,GAAI,YAAa;GACpC,QACE,QAAO,oBAAC;IAAS,GAAI;IAAW,SAAS;KAA2B;;;AAI1E,QACE,qBAAC;EAAI,WAAU;aAEb,oBAAC,kBACC,oBAAC;GAAY,WAAU;aACrB,oBAAC;IAAsB;IAAa,cAAc;KAAoB;IAC1D,GACT,EAGN,YAAY;GACT"}

package/dist/components/EngagementMeter.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime5 from "react/jsx-runtime";
+
+//#region src/components/EngagementMeter.d.ts
+interface EngagementMeterProps {
+  acknowledged: number;
+  actioned: number;
+  pending: number;
+  streak?: number;
+}
+declare function EngagementMeter({
+  acknowledged,
+  actioned,
+  pending,
+  streak
+}: EngagementMeterProps): react_jsx_runtime5.JSX.Element;
+//#endregion
+export { EngagementMeter };
+//# sourceMappingURL=EngagementMeter.d.ts.map

package/dist/components/EngagementMeter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EngagementMeter.d.ts","names":[],"sources":["../../src/components/EngagementMeter.tsx"],"sourcesContent":[],"mappings":";;;UAEU,oBAAA;;;EAAA,OAAA,EAAA,MAAA;EAOM,MAAA,CAAA,EAAA,MAAA;;AAEd,iBAFc,eAAA,CAEd;EAAA,YAAA;EAAA,QAAA;EAAA,OAAA;EAAA;AAAA,CAAA,EAGC,oBAHD,CAAA,EAGqB,kBAAA,CAAA,GAAA,CAAA,OAHrB"}

package/dist/components/EngagementMeter.js

@@ -0,0 +1,108 @@
+'use client';
+
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/EngagementMeter.tsx
+function EngagementMeter({ acknowledged, actioned, pending, streak = 0 }) {
+	const total = acknowledged + actioned + pending;
+	const actionedPercent = total > 0 ? actioned / total * 100 : 0;
+	const acknowledgedPercent = total > 0 ? acknowledged / total * 100 : 0;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-4",
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "flex items-center justify-center",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "relative h-32 w-32",
+					children: [/* @__PURE__ */ jsxs("svg", {
+						className: "h-full w-full -rotate-90",
+						viewBox: "0 0 100 100",
+						children: [
+							/* @__PURE__ */ jsx("circle", {
+								cx: "50",
+								cy: "50",
+								r: "40",
+								fill: "none",
+								strokeWidth: "12",
+								className: "stroke-muted"
+							}),
+							/* @__PURE__ */ jsx("circle", {
+								cx: "50",
+								cy: "50",
+								r: "40",
+								fill: "none",
+								strokeWidth: "12",
+								strokeLinecap: "round",
+								strokeDasharray: `${actionedPercent * 2.51} 251`,
+								className: "stroke-green-500 transition-all duration-500"
+							}),
+							/* @__PURE__ */ jsx("circle", {
+								cx: "50",
+								cy: "50",
+								r: "40",
+								fill: "none",
+								strokeWidth: "12",
+								strokeLinecap: "round",
+								strokeDasharray: `${acknowledgedPercent * 2.51} 251`,
+								strokeDashoffset: `${-actionedPercent * 2.51}`,
+								className: "stroke-amber-500 transition-all duration-500"
+							})
+						]
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "absolute inset-0 flex flex-col items-center justify-center",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "text-2xl font-bold",
+							children: total
+						}), /* @__PURE__ */ jsx("span", {
+							className: "text-muted-foreground text-xs",
+							children: "tips"
+						})]
+					})]
+				})
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex justify-center gap-4 text-sm",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-1.5",
+						children: [/* @__PURE__ */ jsx("div", { className: "h-3 w-3 rounded-full bg-green-500" }), /* @__PURE__ */ jsxs("span", { children: [
+							"Actioned (",
+							actioned,
+							")"
+						] })]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-1.5",
+						children: [/* @__PURE__ */ jsx("div", { className: "h-3 w-3 rounded-full bg-amber-500" }), /* @__PURE__ */ jsxs("span", { children: [
+							"Acknowledged (",
+							acknowledged,
+							")"
+						] })]
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-1.5",
+						children: [/* @__PURE__ */ jsx("div", { className: "bg-muted h-3 w-3 rounded-full" }), /* @__PURE__ */ jsxs("span", { children: [
+							"Pending (",
+							pending,
+							")"
+						] })]
+					})
+				]
+			}),
+			streak > 0 && /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",
+				children: [/* @__PURE__ */ jsx("span", {
+					className: "text-xl",
+					children: "🔥"
+				}), /* @__PURE__ */ jsxs("span", {
+					className: "font-semibold text-orange-500",
+					children: [streak, " day engagement streak!"]
+				})]
+			})
+		]
+	});
+}
+
+//#endregion
+export { EngagementMeter };
+//# sourceMappingURL=EngagementMeter.js.map

package/dist/components/EngagementMeter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EngagementMeter.js","names":[],"sources":["../../src/components/EngagementMeter.tsx"],"sourcesContent":["'use client';\n\ninterface EngagementMeterProps {\n  acknowledged: number;\n  actioned: number;\n  pending: number;\n  streak?: number;\n}\n\nexport function EngagementMeter({\n  acknowledged,\n  actioned,\n  pending,\n  streak = 0,\n}: EngagementMeterProps) {\n  const total = acknowledged + actioned + pending;\n  const actionedPercent = total > 0 ? (actioned / total) * 100 : 0;\n  const acknowledgedPercent = total > 0 ? (acknowledged / total) * 100 : 0;\n\n  return (\n    <div className=\"space-y-4\">\n      {/* Donut chart */}\n      <div className=\"flex items-center justify-center\">\n        <div className=\"relative h-32 w-32\">\n          <svg className=\"h-full w-full -rotate-90\" viewBox=\"0 0 100 100\">\n            {/* Background */}\n            <circle\n              cx=\"50\"\n              cy=\"50\"\n              r=\"40\"\n              fill=\"none\"\n              strokeWidth=\"12\"\n              className=\"stroke-muted\"\n            />\n            {/* Actioned (green) */}\n            <circle\n              cx=\"50\"\n              cy=\"50\"\n              r=\"40\"\n              fill=\"none\"\n              strokeWidth=\"12\"\n              strokeLinecap=\"round\"\n              strokeDasharray={`${actionedPercent * 2.51} 251`}\n              className=\"stroke-green-500 transition-all duration-500\"\n            />\n            {/* Acknowledged (amber) - offset by actioned */}\n            <circle\n              cx=\"50\"\n              cy=\"50\"\n              r=\"40\"\n              fill=\"none\"\n              strokeWidth=\"12\"\n              strokeLinecap=\"round\"\n              strokeDasharray={`${acknowledgedPercent * 2.51} 251`}\n              strokeDashoffset={`${-actionedPercent * 2.51}`}\n              className=\"stroke-amber-500 transition-all duration-500\"\n            />\n          </svg>\n          <div className=\"absolute inset-0 flex flex-col items-center justify-center\">\n            <span className=\"text-2xl font-bold\">{total}</span>\n            <span className=\"text-muted-foreground text-xs\">tips</span>\n          </div>\n        </div>\n      </div>\n\n      {/* Legend */}\n      <div className=\"flex justify-center gap-4 text-sm\">\n        <div className=\"flex items-center gap-1.5\">\n          <div className=\"h-3 w-3 rounded-full bg-green-500\" />\n          <span>Actioned ({actioned})</span>\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <div className=\"h-3 w-3 rounded-full bg-amber-500\" />\n          <span>Acknowledged ({acknowledged})</span>\n        </div>\n        <div className=\"flex items-center gap-1.5\">\n          <div className=\"bg-muted h-3 w-3 rounded-full\" />\n          <span>Pending ({pending})</span>\n        </div>\n      </div>\n\n      {/* Streak */}\n      {streak > 0 && (\n        <div className=\"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2\">\n          <span className=\"text-xl\">🔥</span>\n          <span className=\"font-semibold text-orange-500\">\n            {streak} day engagement streak!\n          </span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;;;AASA,SAAgB,gBAAgB,EAC9B,cACA,UACA,SACA,SAAS,KACc;CACvB,MAAM,QAAQ,eAAe,WAAW;CACxC,MAAM,kBAAkB,QAAQ,IAAK,WAAW,QAAS,MAAM;CAC/D,MAAM,sBAAsB,QAAQ,IAAK,eAAe,QAAS,MAAM;AAEvE,QACE,qBAAC;EAAI,WAAU;;GAEb,oBAAC;IAAI,WAAU;cACb,qBAAC;KAAI,WAAU;gBACb,qBAAC;MAAI,WAAU;MAA2B,SAAQ;;OAEhD,oBAAC;QACC,IAAG;QACH,IAAG;QACH,GAAE;QACF,MAAK;QACL,aAAY;QACZ,WAAU;SACV;OAEF,oBAAC;QACC,IAAG;QACH,IAAG;QACH,GAAE;QACF,MAAK;QACL,aAAY;QACZ,eAAc;QACd,iBAAiB,GAAG,kBAAkB,KAAK;QAC3C,WAAU;SACV;OAEF,oBAAC;QACC,IAAG;QACH,IAAG;QACH,GAAE;QACF,MAAK;QACL,aAAY;QACZ,eAAc;QACd,iBAAiB,GAAG,sBAAsB,KAAK;QAC/C,kBAAkB,GAAG,CAAC,kBAAkB;QACxC,WAAU;SACV;;OACE,EACN,qBAAC;MAAI,WAAU;iBACb,oBAAC;OAAK,WAAU;iBAAsB;QAAa,EACnD,oBAAC;OAAK,WAAU;iBAAgC;QAAW;OACvD;MACF;KACF;GAGN,qBAAC;IAAI,WAAU;;KACb,qBAAC;MAAI,WAAU;iBACb,oBAAC,SAAI,WAAU,sCAAsC,EACrD,qBAAC;OAAK;OAAW;OAAS;UAAQ;OAC9B;KACN,qBAAC;MAAI,WAAU;iBACb,oBAAC,SAAI,WAAU,sCAAsC,EACrD,qBAAC;OAAK;OAAe;OAAa;UAAQ;OACtC;KACN,qBAAC;MAAI,WAAU;iBACb,oBAAC,SAAI,WAAU,kCAAkC,EACjD,qBAAC;OAAK;OAAU;OAAQ;UAAQ;OAC5B;;KACF;GAGL,SAAS,KACR,qBAAC;IAAI,WAAU;eACb,oBAAC;KAAK,WAAU;eAAU;MAAS,EACnC,qBAAC;KAAK,WAAU;gBACb,QAAO;MACH;KACH;;GAEJ"}

package/dist/components/TipCard.d.ts

@@ -0,0 +1,21 @@
+import * as react_jsx_runtime6 from "react/jsx-runtime";
+import { LearningJourneyStepSpec } from "@contractspec/module.learning-journey/track-spec";
+
+//#region src/components/TipCard.d.ts
+interface TipCardProps {
+  step: LearningJourneyStepSpec;
+  isCompleted: boolean;
+  isCurrent: boolean;
+  onComplete?: () => void;
+  onDismiss?: () => void;
+}
+declare function TipCard({
+  step,
+  isCompleted,
+  isCurrent,
+  onComplete,
+  onDismiss
+}: TipCardProps): react_jsx_runtime6.JSX.Element;
+//#endregion
+export { TipCard };
+//# sourceMappingURL=TipCard.d.ts.map

package/dist/components/TipCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TipCard.d.ts","names":[],"sources":["../../src/components/TipCard.tsx"],"sourcesContent":[],"mappings":";;;;UAOU,YAAA;QACF;;EADE,SAAA,EAAA,OAAY;EAkBN,UAAO,CAAA,EAAA,GAAA,GAAA,IAAA;EACrB,SAAA,CAAA,EAAA,GAAA,GAAA,IAAA;;AAEA,iBAHc,OAAA,CAGd;EAAA,IAAA;EAAA,WAAA;EAAA,SAAA;EAAA,UAAA;EAAA;AAAA,CAAA,EAGC,YAHD,CAAA,EAGa,kBAAA,CAAA,GAAA,CAAA,OAHb"}

package/dist/components/TipCard.js

@@ -0,0 +1,76 @@
+'use client';
+
+import { Card, CardContent } from "@contractspec/lib.ui-kit-web/ui/card";
+import { Button } from "@contractspec/lib.design-system";
+import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/TipCard.tsx
+const TIP_ICONS = {
+	cash_buffer_too_high: "💰",
+	no_savings_goal: "🎯",
+	irregular_savings: "📅",
+	noise_late_evening: "🔇",
+	guest_frequency_high: "👥",
+	shared_space_conflicts: "🏠",
+	default: "💡"
+};
+function TipCard({ step, isCompleted, isCurrent, onComplete, onDismiss }) {
+	const icon = TIP_ICONS[step.metadata?.tipId ?? "default"] ?? TIP_ICONS.default;
+	return /* @__PURE__ */ jsx(Card, {
+		className: cn("transition-all", isCompleted && "opacity-60", isCurrent && "ring-2 ring-amber-500"),
+		children: /* @__PURE__ */ jsx(CardContent, {
+			className: "p-4",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex gap-4",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: cn("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl", isCompleted ? "bg-green-500/10" : isCurrent ? "bg-amber-500/10" : "bg-muted"),
+					children: isCompleted ? "✓" : icon
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "min-w-0 flex-1",
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex items-start justify-between gap-2",
+							children: [/* @__PURE__ */ jsx("h4", {
+								className: "font-semibold",
+								children: step.title
+							}), step.xpReward && /* @__PURE__ */ jsxs("span", {
+								className: cn("shrink-0 rounded-full px-2 py-0.5 text-xs font-semibold", isCompleted ? "bg-green-500/10 text-green-500" : "bg-amber-500/10 text-amber-500"),
+								children: [
+									"+",
+									step.xpReward,
+									" XP"
+								]
+							})]
+						}),
+						/* @__PURE__ */ jsx("p", {
+							className: "text-muted-foreground mt-1 text-sm",
+							children: step.description
+						}),
+						!isCompleted && /* @__PURE__ */ jsxs("div", {
+							className: "mt-3 flex flex-wrap gap-2",
+							children: [/* @__PURE__ */ jsx(Button, {
+								size: "sm",
+								onClick: onComplete,
+								children: "Take Action"
+							}), /* @__PURE__ */ jsx(Button, {
+								variant: "outline",
+								size: "sm",
+								onClick: onDismiss,
+								children: "Dismiss"
+							})]
+						}),
+						isCompleted && /* @__PURE__ */ jsx("p", {
+							className: "mt-2 text-sm text-green-500",
+							children: "✓ Tip acknowledged"
+						})
+					]
+				})]
+			})
+		})
+	});
+}
+
+//#endregion
+export { TipCard };
+//# sourceMappingURL=TipCard.js.map

package/dist/components/TipCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TipCard.js","names":[],"sources":["../../src/components/TipCard.tsx"],"sourcesContent":["'use client';\n\nimport { Button } from '@contractspec/lib.design-system';\nimport { Card, CardContent } from '@contractspec/lib.ui-kit-web/ui/card';\nimport { cn } from '@contractspec/lib.ui-kit-web/ui/utils';\nimport type { LearningJourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';\n\ninterface TipCardProps {\n  step: LearningJourneyStepSpec;\n  isCompleted: boolean;\n  isCurrent: boolean;\n  onComplete?: () => void;\n  onDismiss?: () => void;\n}\n\nconst TIP_ICONS: Record<string, string> = {\n  cash_buffer_too_high: '💰',\n  no_savings_goal: '🎯',\n  irregular_savings: '📅',\n  noise_late_evening: '🔇',\n  guest_frequency_high: '👥',\n  shared_space_conflicts: '🏠',\n  default: '💡',\n};\n\nexport function TipCard({\n  step,\n  isCompleted,\n  isCurrent,\n  onComplete,\n  onDismiss,\n}: TipCardProps) {\n  const tipId = (step.metadata?.tipId as string) ?? 'default';\n  const icon = TIP_ICONS[tipId] ?? TIP_ICONS.default;\n\n  return (\n    <Card\n      className={cn(\n        'transition-all',\n        isCompleted && 'opacity-60',\n        isCurrent && 'ring-2 ring-amber-500'\n      )}\n    >\n      <CardContent className=\"p-4\">\n        <div className=\"flex gap-4\">\n          {/* Icon */}\n          <div\n            className={cn(\n              'flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl',\n              isCompleted\n                ? 'bg-green-500/10'\n                : isCurrent\n                  ? 'bg-amber-500/10'\n                  : 'bg-muted'\n            )}\n          >\n            {isCompleted ? '✓' : icon}\n          </div>\n\n          {/* Content */}\n          <div className=\"min-w-0 flex-1\">\n            <div className=\"flex items-start justify-between gap-2\">\n              <h4 className=\"font-semibold\">{step.title}</h4>\n              {step.xpReward && (\n                <span\n                  className={cn(\n                    'shrink-0 rounded-full px-2 py-0.5 text-xs font-semibold',\n                    isCompleted\n                      ? 'bg-green-500/10 text-green-500'\n                      : 'bg-amber-500/10 text-amber-500'\n                  )}\n                >\n                  +{step.xpReward} XP\n                </span>\n              )}\n            </div>\n            <p className=\"text-muted-foreground mt-1 text-sm\">\n              {step.description}\n            </p>\n\n            {/* Actions */}\n            {!isCompleted && (\n              <div className=\"mt-3 flex flex-wrap gap-2\">\n                <Button size=\"sm\" onClick={onComplete}>\n                  Take Action\n                </Button>\n                <Button variant=\"outline\" size=\"sm\" onClick={onDismiss}>\n                  Dismiss\n                </Button>\n              </div>\n            )}\n\n            {isCompleted && (\n              <p className=\"mt-2 text-sm text-green-500\">✓ Tip acknowledged</p>\n            )}\n          </div>\n        </div>\n      </CardContent>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;;;AAeA,MAAM,YAAoC;CACxC,sBAAsB;CACtB,iBAAiB;CACjB,mBAAmB;CACnB,oBAAoB;CACpB,sBAAsB;CACtB,wBAAwB;CACxB,SAAS;CACV;AAED,SAAgB,QAAQ,EACtB,MACA,aACA,WACA,YACA,aACe;CAEf,MAAM,OAAO,UADE,KAAK,UAAU,SAAoB,cACjB,UAAU;AAE3C,QACE,oBAAC;EACC,WAAW,GACT,kBACA,eAAe,cACf,aAAa,wBACd;YAED,oBAAC;GAAY,WAAU;aACrB,qBAAC;IAAI,WAAU;eAEb,oBAAC;KACC,WAAW,GACT,2EACA,cACI,oBACA,YACE,oBACA,WACP;eAEA,cAAc,MAAM;MACjB,EAGN,qBAAC;KAAI,WAAU;;MACb,qBAAC;OAAI,WAAU;kBACb,oBAAC;QAAG,WAAU;kBAAiB,KAAK;SAAW,EAC9C,KAAK,YACJ,qBAAC;QACC,WAAW,GACT,2DACA,cACI,mCACA,iCACL;;SACF;SACG,KAAK;SAAS;;SACX;QAEL;MACN,oBAAC;OAAE,WAAU;iBACV,KAAK;QACJ;MAGH,CAAC,eACA,qBAAC;OAAI,WAAU;kBACb,oBAAC;QAAO,MAAK;QAAK,SAAS;kBAAY;SAE9B,EACT,oBAAC;QAAO,SAAQ;QAAU,MAAK;QAAK,SAAS;kBAAW;SAE/C;QACL;MAGP,eACC,oBAAC;OAAE,WAAU;iBAA8B;QAAsB;;MAE/D;KACF;IACM;GACT"}

package/dist/components/TipFeed.d.ts

@@ -0,0 +1,18 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { LearningJourneyStepSpec } from "@contractspec/module.learning-journey/track-spec";
+
+//#region src/components/TipFeed.d.ts
+interface TipFeedItem {
+  step: LearningJourneyStepSpec;
+  isCompleted: boolean;
+  completedAt?: string;
+}
+interface TipFeedProps {
+  items: TipFeedItem[];
+}
+declare function TipFeed({
+  items
+}: TipFeedProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TipFeed };
+//# sourceMappingURL=TipFeed.d.ts.map

package/dist/components/TipFeed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TipFeed.d.ts","names":[],"sources":["../../src/components/TipFeed.tsx"],"sourcesContent":[],"mappings":";;;;UAKU,WAAA;QACF;;EADE,WAAA,CAAA,EAAW,MAAA;AACU;AAmB/B,UAdU,YAAA,CAca;EAAG,KAAA,EAbjB,WAaiB,EAAA;;AAAqB,iBAA/B,OAAA,CAA+B;EAAA;AAAA,CAAA,EAAZ,YAAY,CAAA,EAAA,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/TipFeed.js

@@ -0,0 +1,66 @@
+'use client';
+
+import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/TipFeed.tsx
+const TIP_ICONS = {
+	cash_buffer_too_high: "💰",
+	no_savings_goal: "🎯",
+	irregular_savings: "📅",
+	noise_late_evening: "🔇",
+	guest_frequency_high: "👥",
+	shared_space_conflicts: "🏠",
+	default: "💡"
+};
+function TipFeed({ items }) {
+	if (items.length === 0) return /* @__PURE__ */ jsx("div", {
+		className: "text-muted-foreground py-8 text-center",
+		children: "No tips yet. Start engaging with coaching tips!"
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "relative",
+		children: [/* @__PURE__ */ jsx("div", { className: "bg-border absolute top-0 left-4 h-full w-0.5" }), /* @__PURE__ */ jsx("div", {
+			className: "space-y-4",
+			children: items.map((item) => {
+				const icon = TIP_ICONS[item.step.metadata?.tipId ?? "default"] ?? TIP_ICONS.default;
+				return /* @__PURE__ */ jsxs("div", {
+					className: "relative flex gap-4 pl-2",
+					children: [/* @__PURE__ */ jsx("div", {
+						className: cn("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm", item.isCompleted ? "bg-green-500 text-white" : "bg-muted text-muted-foreground"),
+						children: item.isCompleted ? "✓" : icon
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "bg-card flex-1 rounded-lg border p-3",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "flex items-start justify-between gap-2",
+							children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
+								className: "font-medium",
+								children: item.step.title
+							}), /* @__PURE__ */ jsx("p", {
+								className: "text-muted-foreground mt-0.5 text-sm",
+								children: item.step.description
+							})] }), item.step.xpReward && /* @__PURE__ */ jsxs("span", {
+								className: cn("shrink-0 text-xs font-medium", item.isCompleted ? "text-green-500" : "text-muted-foreground"),
+								children: [
+									"+",
+									item.step.xpReward,
+									" XP"
+								]
+							})]
+						}), /* @__PURE__ */ jsx("div", {
+							className: "text-muted-foreground mt-2 flex items-center gap-2 text-xs",
+							children: item.isCompleted ? /* @__PURE__ */ jsxs("span", {
+								className: "text-green-500",
+								children: ["✓ Completed", item.completedAt && ` • ${item.completedAt}`]
+							}) : /* @__PURE__ */ jsx("span", { children: "Pending action" })
+						})]
+					})]
+				}, item.step.id);
+			})
+		})]
+	});
+}
+
+//#endregion
+export { TipFeed };
+//# sourceMappingURL=TipFeed.js.map

package/dist/components/TipFeed.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TipFeed.js","names":[],"sources":["../../src/components/TipFeed.tsx"],"sourcesContent":["'use client';\n\nimport { cn } from '@contractspec/lib.ui-kit-web/ui/utils';\nimport type { LearningJourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';\n\ninterface TipFeedItem {\n  step: LearningJourneyStepSpec;\n  isCompleted: boolean;\n  completedAt?: string;\n}\n\ninterface TipFeedProps {\n  items: TipFeedItem[];\n}\n\nconst TIP_ICONS: Record<string, string> = {\n  cash_buffer_too_high: '💰',\n  no_savings_goal: '🎯',\n  irregular_savings: '📅',\n  noise_late_evening: '🔇',\n  guest_frequency_high: '👥',\n  shared_space_conflicts: '🏠',\n  default: '💡',\n};\n\nexport function TipFeed({ items }: TipFeedProps) {\n  if (items.length === 0) {\n    return (\n      <div className=\"text-muted-foreground py-8 text-center\">\n        No tips yet. Start engaging with coaching tips!\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"relative\">\n      {/* Timeline line */}\n      <div className=\"bg-border absolute top-0 left-4 h-full w-0.5\" />\n\n      {/* Feed items */}\n      <div className=\"space-y-4\">\n        {items.map((item) => {\n          const tipId = (item.step.metadata?.tipId as string) ?? 'default';\n          const icon = TIP_ICONS[tipId] ?? TIP_ICONS.default;\n\n          return (\n            <div key={item.step.id} className=\"relative flex gap-4 pl-2\">\n              {/* Node */}\n              <div\n                className={cn(\n                  'relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm',\n                  item.isCompleted\n                    ? 'bg-green-500 text-white'\n                    : 'bg-muted text-muted-foreground'\n                )}\n              >\n                {item.isCompleted ? '✓' : icon}\n              </div>\n\n              {/* Content */}\n              <div className=\"bg-card flex-1 rounded-lg border p-3\">\n                <div className=\"flex items-start justify-between gap-2\">\n                  <div>\n                    <p className=\"font-medium\">{item.step.title}</p>\n                    <p className=\"text-muted-foreground mt-0.5 text-sm\">\n                      {item.step.description}\n                    </p>\n                  </div>\n                  {item.step.xpReward && (\n                    <span\n                      className={cn(\n                        'shrink-0 text-xs font-medium',\n                        item.isCompleted\n                          ? 'text-green-500'\n                          : 'text-muted-foreground'\n                      )}\n                    >\n                      +{item.step.xpReward} XP\n                    </span>\n                  )}\n                </div>\n\n                {/* Timestamp */}\n                <div className=\"text-muted-foreground mt-2 flex items-center gap-2 text-xs\">\n                  {item.isCompleted ? (\n                    <span className=\"text-green-500\">\n                      ✓ Completed\n                      {item.completedAt && ` • ${item.completedAt}`}\n                    </span>\n                  ) : (\n                    <span>Pending action</span>\n                  )}\n                </div>\n              </div>\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAeA,MAAM,YAAoC;CACxC,sBAAsB;CACtB,iBAAiB;CACjB,mBAAmB;CACnB,oBAAoB;CACpB,sBAAsB;CACtB,wBAAwB;CACxB,SAAS;CACV;AAED,SAAgB,QAAQ,EAAE,SAAuB;AAC/C,KAAI,MAAM,WAAW,EACnB,QACE,oBAAC;EAAI,WAAU;YAAyC;GAElD;AAIV,QACE,qBAAC;EAAI,WAAU;aAEb,oBAAC,SAAI,WAAU,iDAAiD,EAGhE,oBAAC;GAAI,WAAU;aACZ,MAAM,KAAK,SAAS;IAEnB,MAAM,OAAO,UADE,KAAK,KAAK,UAAU,SAAoB,cACtB,UAAU;AAE3C,WACE,qBAAC;KAAuB,WAAU;gBAEhC,oBAAC;MACC,WAAW,GACT,wFACA,KAAK,cACD,4BACA,iCACL;gBAEA,KAAK,cAAc,MAAM;OACtB,EAGN,qBAAC;MAAI,WAAU;iBACb,qBAAC;OAAI,WAAU;kBACb,qBAAC,oBACC,oBAAC;QAAE,WAAU;kBAAe,KAAK,KAAK;SAAU,EAChD,oBAAC;QAAE,WAAU;kBACV,KAAK,KAAK;SACT,IACA,EACL,KAAK,KAAK,YACT,qBAAC;QACC,WAAW,GACT,gCACA,KAAK,cACD,mBACA,wBACL;;SACF;SACG,KAAK,KAAK;SAAS;;SAChB;QAEL,EAGN,oBAAC;OAAI,WAAU;iBACZ,KAAK,cACJ,qBAAC;QAAK,WAAU;mBAAiB,eAE9B,KAAK,eAAe,MAAM,KAAK;SAC3B,GAEP,oBAAC,oBAAK,mBAAqB;QAEzB;OACF;OA/CE,KAAK,KAAK,GAgDd;KAER;IACE;GACF"}

package/dist/components/index.d.ts

@@ -0,0 +1,4 @@
+import { EngagementMeter } from "./EngagementMeter.js";
+import { TipCard } from "./TipCard.js";
+import { TipFeed } from "./TipFeed.js";
+export { EngagementMeter, TipCard, TipFeed };

package/dist/components/index.js

@@ -0,0 +1,5 @@
+import { TipCard } from "./TipCard.js";
+import { EngagementMeter } from "./EngagementMeter.js";
+import { TipFeed } from "./TipFeed.js";
+
+export { EngagementMeter, TipCard, TipFeed };

package/dist/docs/index.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/docs/index.js

@@ -0,0 +1 @@
+import "./learning-journey-ui-coaching.docblock.js";

package/dist/docs/learning-journey-ui-coaching.docblock.d.ts

@@ -0,0 +1 @@
+export { };

package/dist/docs/learning-journey-ui-coaching.docblock.js

@@ -0,0 +1,20 @@
+import { registerDocBlocks } from "@contractspec/lib.contracts/docs";
+
+//#region src/docs/learning-journey-ui-coaching.docblock.ts
+registerDocBlocks([{
+	id: "docs.examples.learning-journey-ui-coaching",
+	title: "Learning Journey UI — Coaching",
+	summary: "UI mini-app components for coaching: tips, engagement, progress.",
+	kind: "reference",
+	visibility: "public",
+	route: "/docs/examples/learning-journey-ui-coaching",
+	tags: [
+		"learning",
+		"ui",
+		"coaching"
+	],
+	body: `## Includes\n- Coaching mini-app shell\n- Views: overview, steps, progress, timeline\n- Components: tip card, engagement meter, tip feed\n\n## Notes\n- Compose using design system components.\n- Keep accessibility and mobile-friendly tap targets.`
+}]);
+
+//#endregion
+//# sourceMappingURL=learning-journey-ui-coaching.docblock.js.map

package/dist/docs/learning-journey-ui-coaching.docblock.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"learning-journey-ui-coaching.docblock.js","names":[],"sources":["../../src/docs/learning-journey-ui-coaching.docblock.ts"],"sourcesContent":["import type { DocBlock } from '@contractspec/lib.contracts/docs';\nimport { registerDocBlocks } from '@contractspec/lib.contracts/docs';\n\nconst blocks: DocBlock[] = [\n  {\n    id: 'docs.examples.learning-journey-ui-coaching',\n    title: 'Learning Journey UI — Coaching',\n    summary: 'UI mini-app components for coaching: tips, engagement, progress.',\n    kind: 'reference',\n    visibility: 'public',\n    route: '/docs/examples/learning-journey-ui-coaching',\n    tags: ['learning', 'ui', 'coaching'],\n    body: `## Includes\\n- Coaching mini-app shell\\n- Views: overview, steps, progress, timeline\\n- Components: tip card, engagement meter, tip feed\\n\\n## Notes\\n- Compose using design system components.\\n- Keep accessibility and mobile-friendly tap targets.`,\n  },\n];\n\nregisterDocBlocks(blocks);\n"],"mappings":";;;AAgBA,kBAb2B,CACzB;CACE,IAAI;CACJ,OAAO;CACP,SAAS;CACT,MAAM;CACN,YAAY;CACZ,OAAO;CACP,MAAM;EAAC;EAAY;EAAM;EAAW;CACpC,MAAM;CACP,CACF,CAEwB"}

package/dist/example.d.ts

@@ -0,0 +1,7 @@
+import * as _contractspec_lib_contracts0 from "@contractspec/lib.contracts";
+
+//#region src/example.d.ts
+declare const example: _contractspec_lib_contracts0.ExampleSpec;
+//#endregion
+export { example as default };
+//# sourceMappingURL=example.d.ts.map

package/dist/example.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"example.d.ts","names":[],"sources":["../src/example.ts"],"sourcesContent":[],"mappings":";;;cAEM,SA0BJ,4BAAA,CA1BW"}

package/dist/example.js

@@ -0,0 +1,42 @@
+import { defineExample } from "@contractspec/lib.contracts";
+
+//#region src/example.ts
+const example = defineExample({
+	meta: {
+		key: "learning-journey-ui-coaching",
+		version: "1.0.0",
+		title: "Learning Journey UI — Coaching",
+		description: "UI mini-app for coaching patterns: tips, engagement meter, progress.",
+		kind: "ui",
+		visibility: "public",
+		stability: "experimental",
+		owners: ["@platform.core"],
+		tags: [
+			"learning",
+			"ui",
+			"coaching"
+		]
+	},
+	docs: { rootDocId: "docs.examples.learning-journey-ui-coaching" },
+	entrypoints: {
+		packageName: "@contractspec/example.learning-journey-ui-coaching",
+		docs: "./docs"
+	},
+	surfaces: {
+		templates: true,
+		sandbox: {
+			enabled: true,
+			modes: ["playground", "markdown"]
+		},
+		studio: {
+			enabled: true,
+			installable: true
+		},
+		mcp: { enabled: true }
+	}
+});
+var example_default = example;
+
+//#endregion
+export { example_default as default };
+//# sourceMappingURL=example.js.map

package/dist/example.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"example.js","names":[],"sources":["../src/example.ts"],"sourcesContent":["import { defineExample } from '@contractspec/lib.contracts';\n\nconst example = defineExample({\n  meta: {\n    key: 'learning-journey-ui-coaching',\n    version: '1.0.0',\n    title: 'Learning Journey UI — Coaching',\n    description:\n      'UI mini-app for coaching patterns: tips, engagement meter, progress.',\n    kind: 'ui',\n    visibility: 'public',\n    stability: 'experimental',\n    owners: ['@platform.core'],\n    tags: ['learning', 'ui', 'coaching'],\n  },\n  docs: {\n    rootDocId: 'docs.examples.learning-journey-ui-coaching',\n  },\n  entrypoints: {\n    packageName: '@contractspec/example.learning-journey-ui-coaching',\n    docs: './docs',\n  },\n  surfaces: {\n    templates: true,\n    sandbox: { enabled: true, modes: ['playground', 'markdown'] },\n    studio: { enabled: true, installable: true },\n    mcp: { enabled: true },\n  },\n});\n\nexport default example;\n"],"mappings":";;;AAEA,MAAM,UAAU,cAAc;CAC5B,MAAM;EACJ,KAAK;EACL,SAAS;EACT,OAAO;EACP,aACE;EACF,MAAM;EACN,YAAY;EACZ,WAAW;EACX,QAAQ,CAAC,iBAAiB;EAC1B,MAAM;GAAC;GAAY;GAAM;GAAW;EACrC;CACD,MAAM,EACJ,WAAW,8CACZ;CACD,aAAa;EACX,aAAa;EACb,MAAM;EACP;CACD,UAAU;EACR,WAAW;EACX,SAAS;GAAE,SAAS;GAAM,OAAO,CAAC,cAAc,WAAW;GAAE;EAC7D,QAAQ;GAAE,SAAS;GAAM,aAAa;GAAM;EAC5C,KAAK,EAAE,SAAS,MAAM;EACvB;CACF,CAAC;AAEF,sBAAe"}

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+import { CoachingMiniApp } from "./CoachingMiniApp.js";
+import { EngagementMeter } from "./components/EngagementMeter.js";
+import { TipCard } from "./components/TipCard.js";
+import { TipFeed } from "./components/TipFeed.js";
+import "./components/index.js";
+import example from "./example.js";
+import { Overview } from "./views/Overview.js";
+import { Steps } from "./views/Steps.js";
+import { Progress as ProgressView } from "./views/Progress.js";
+import { Timeline } from "./views/Timeline.js";
+import "./views/index.js";
+export { CoachingMiniApp, EngagementMeter, Overview, ProgressView as Progress, Steps, Timeline, TipCard, TipFeed, example };

package/dist/index.js

@@ -0,0 +1,14 @@
+import { TipCard } from "./components/TipCard.js";
+import { Overview } from "./views/Overview.js";
+import { Steps } from "./views/Steps.js";
+import { EngagementMeter } from "./components/EngagementMeter.js";
+import { Progress as ProgressView } from "./views/Progress.js";
+import { TipFeed } from "./components/TipFeed.js";
+import { Timeline } from "./views/Timeline.js";
+import { CoachingMiniApp } from "./CoachingMiniApp.js";
+import example_default from "./example.js";
+import "./views/index.js";
+import "./components/index.js";
+import "./docs/index.js";
+
+export { CoachingMiniApp, EngagementMeter, Overview, ProgressView as Progress, Steps, Timeline, TipCard, TipFeed, example_default as example };

package/dist/views/Overview.d.ts

@@ -0,0 +1,16 @@
+import { LearningViewProps } from "@contractspec/example.learning-journey-ui-shared";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/views/Overview.d.ts
+interface CoachingOverviewProps extends LearningViewProps {
+  onStart?: () => void;
+}
+declare function Overview({
+  track,
+  progress,
+  onStepComplete,
+  onStart
+}: CoachingOverviewProps): react_jsx_runtime1.JSX.Element;
+//#endregion
+export { Overview };
+//# sourceMappingURL=Overview.d.ts.map

package/dist/views/Overview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Overview.d.ts","names":[],"sources":["../../src/views/Overview.tsx"],"sourcesContent":[],"mappings":";;;;UAgBU,qBAAA,SAA8B;;;AAA9B,iBAIM,QAAA,CAJgB;EAAA,KAAQ;EAAA,QAAA;EAAA,cAAiB;EAAA;AAAA,CAAA,EAStD,qBATsD,CAAA,EASjC,kBAAA,CAAA,GAAA,CAAA,OATiC"}