@contractspec/example.learning-journey-ui-coaching 4.0.0 → 4.0.2

package/.turbo/turbo-build.log

@@ -2,11 +2,11 @@ $ contractspec-bun-build prebuild
 $ bun run build:bundle && bun run build:types
 $ contractspec-bun-build transpile
 [contractspec-bun-build] transpile target=bun root=src entries=15 noBundle=false
-Bundled 15 modules in 45ms
+Bundled 15 modules in 28ms
 
   ./CoachingMiniApp.js                            15.65 KB   (entry point)
-  ./index.js                                      17.53 KB   (entry point)
-  ./learning-journey-ui-coaching.feature.js       481 bytes  (entry point)
+  ./index.js                                      17.55 KB   (entry point)
+  ./learning-journey-ui-coaching.feature.js       490 bytes  (entry point)
   views/index.js                                  14.75 KB   (entry point)
   views/Overview.js                               4.78 KB    (entry point)
   views/Progress.js                               4.61 KB    (entry point)
@@ -18,14 +18,14 @@ Bundled 15 modules in 45ms
   components/TipFeed.js                           1.80 KB    (entry point)
   docs/index.js                                   0.64 KB    (entry point)
   docs/learning-journey-ui-coaching.docblock.js   0.64 KB    (entry point)
-  ./example.js                                    0.69 KB    (entry point)
+  ./example.js                                    0.71 KB    (entry point)
 
 [contractspec-bun-build] transpile target=node root=src entries=15 noBundle=false
-Bundled 15 modules in 27ms
+Bundled 15 modules in 23ms
 
   ./CoachingMiniApp.js                            15.62 KB   (entry point)
-  ./index.js                                      17.49 KB   (entry point)
-  ./learning-journey-ui-coaching.feature.js       473 bytes  (entry point)
+  ./index.js                                      17.52 KB   (entry point)
+  ./learning-journey-ui-coaching.feature.js       482 bytes  (entry point)
   views/index.js                                  14.72 KB   (entry point)
   views/Overview.js                               4.76 KB    (entry point)
   views/Progress.js                               4.60 KB    (entry point)
@@ -37,14 +37,14 @@ Bundled 15 modules in 27ms
   components/TipFeed.js                           1.78 KB    (entry point)
   docs/index.js                                   0.62 KB    (entry point)
   docs/learning-journey-ui-coaching.docblock.js   0.62 KB    (entry point)
-  ./example.js                                    0.68 KB    (entry point)
+  ./example.js                                    0.70 KB    (entry point)
 
 [contractspec-bun-build] transpile target=browser root=src entries=15 noBundle=false
-Bundled 15 modules in 24ms
+Bundled 15 modules in 19ms
 
   ./CoachingMiniApp.js                            15.62 KB   (entry point)
-  ./index.js                                      17.49 KB   (entry point)
-  ./learning-journey-ui-coaching.feature.js       473 bytes  (entry point)
+  ./index.js                                      17.52 KB   (entry point)
+  ./learning-journey-ui-coaching.feature.js       482 bytes  (entry point)
   views/index.js                                  14.72 KB   (entry point)
   views/Overview.js                               4.76 KB    (entry point)
   views/Progress.js                               4.60 KB    (entry point)
@@ -56,7 +56,6 @@ Bundled 15 modules in 24ms
   components/TipFeed.js                           1.78 KB    (entry point)
   docs/index.js                                   0.62 KB    (entry point)
   docs/learning-journey-ui-coaching.docblock.js   0.62 KB    (entry point)
-  ./example.js                                    0.68 KB    (entry point)
+  ./example.js                                    0.70 KB    (entry point)
 
 $ contractspec-bun-build types
-$ contractspec-bun-build types

package/CHANGELOG.md

@@ -1,5 +1,36 @@
 # @contractspec/example.learning-journey-ui-coaching
 
+## 4.0.2
+
+### Patch Changes
+
+- chore: auto-bump internal dependents
+- Updated dependencies because of chore: auto-bump internal dependents
+- Updated dependencies because of Add focused design-system subpaths and harden ThemeSpec runtime, Tailwind bridge, form-control helpers, and form renderer internals without changing root-import compatibility.
+- Updated dependencies because of Add a ThemeSpec-aware and TranslationSpec-aware design-system form/control layer with stack primitives, exported control wrappers, and FormSpec renderer alignment.
+- Updated dependencies because of Add FormSpec layout hints, semantic field rendering, and portable text/textarea input-group addons.
+- Updated dependencies because of Keep design-system FormRender mobile-safe by preserving shared renderer imports for Metro aliases and hardening generated package artifacts.
+- Updated dependencies because of Add ThemeSpec light/dark modes and a design-system Tailwind bridge for CSS variables, presets, CSS text, and OKLCH color pass-through.
+- Updated dependencies because of Add a canonical typed result system for ContractSpec success and failure propagation across operations, workflows, jobs, server adapters, MCP, GraphQL, and React clients.
+  - @contractspec/example.learning-journey-ambient-coach@4.0.1
+  - @contractspec/example.learning-journey-crm-onboarding@4.0.2
+  - @contractspec/example.learning-journey-ui-shared@4.0.2
+  - @contractspec/module.learning-journey@4.0.1
+  - @contractspec/lib.design-system@3.11.0
+  - @contractspec/lib.contracts-spec@5.5.0
+  - @contractspec/lib.ui-kit-web@3.10.3
+
+## 4.0.1
+
+### Patch Changes
+
+- chore: auto-bump internal dependents
+- Updated dependencies because of chore: auto-bump internal dependents
+  - @contractspec/example.learning-journey-crm-onboarding@4.0.1
+  - @contractspec/example.learning-journey-ui-shared@4.0.1
+  - @contractspec/lib.design-system@3.10.1
+  - @contractspec/lib.ui-kit-web@3.10.2
+
 ## 4.0.0
 
 ### Major Changes

package/dist/browser/example.js

@@ -1 +1 @@
-import{defineExample as g}from"@contractspec/lib.contracts-spec";var h=g({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:!0,sandbox:{enabled:!0,modes:["playground","markdown"]},studio:{enabled:!0,installable:!0},mcp:{enabled:!0}}}),q=h;export{q as default};
+import{defineExample as b}from"@contractspec/lib.contracts-spec/examples";var j=b({meta:{key:"examples.learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey Ui Coaching",description:"Contextual coaching UI with tip cards and engagement tracking.",kind:"template",visibility:"experimental",stability:"experimental",owners:["@contractspec-core"],tags:["package","examples","learning-journey-ui-coaching"]},surfaces:{templates:!0,sandbox:{enabled:!0,modes:["playground","specs"]},studio:{enabled:!1,installable:!1},mcp:{enabled:!1}},entrypoints:{packageName:"@contractspec/example.learning-journey-ui-coaching"}}),t=j;export{t as default,j as ExamplesLearningJourneyUiCoachingExample};

package/dist/browser/index.js

@@ -1,8 +1,8 @@
-import{Button as o}from"@contractspec/lib.design-system";import{Card as qq,CardContent as zq}from"@contractspec/lib.ui-kit-web/ui/card";import{cn as j}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as F,jsxs as I}from"react/jsx-runtime";var p={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function B({step:z,isCompleted:q,isCurrent:R,onComplete:Q,onDismiss:M}){let U=z.metadata?.tipId??"default",Z=p[U]??p.default;return F(qq,{className:j("transition-all",q&&"opacity-60",R&&"ring-2 ring-amber-500"),children:F(zq,{className:"p-4",children:I("div",{className:"flex gap-4",children:[F("div",{className:j("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl",q?"bg-green-500/10":R?"bg-amber-500/10":"bg-muted"),children:q?"✓":Z}),I("div",{className:"min-w-0 flex-1",children:[I("div",{className:"flex items-start justify-between gap-2",children:[F("h4",{className:"font-semibold",children:z.title}),z.xpReward&&I("span",{className:j("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs",q?"bg-green-500/10 text-green-500":"bg-amber-500/10 text-amber-500"),children:["+",z.xpReward," XP"]})]}),F("p",{className:"mt-1 text-muted-foreground text-sm",children:z.description}),!q&&I("div",{className:"mt-3 flex flex-wrap gap-2",children:[F(o,{size:"sm",onClick:Q,children:"Take Action"}),F(o,{variant:"outline",size:"sm",onClick:M,children:"Dismiss"})]}),q&&F("p",{className:"mt-2 text-green-500 text-sm",children:"✓ Tip acknowledged"})]})]})})})}import{StreakCounter as Gq,XpBar as Jq}from"@contractspec/example.learning-journey-ui-shared";import{Button as Kq}from"@contractspec/lib.design-system";import{Card as H,CardContent as O,CardHeader as w,CardTitle as u}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as J,jsxs as $}from"react/jsx-runtime";function P({track:z,progress:q,onStepComplete:R,onStart:Q}){let M=z.totalXp??z.steps.reduce((W,V)=>W+(V.xpReward??0),0),U=q.completedStepIds.length,Z=z.steps.length,Y=Z-U,A=z.steps.filter((W)=>!q.completedStepIds.includes(W.id)).slice(0,3);return $("div",{className:"space-y-6",children:[J(H,{className:"overflow-hidden bg-gradient-to-br from-amber-500/10 via-orange-500/10 to-red-500/10",children:J(O,{className:"p-6",children:$("div",{className:"flex flex-col items-center gap-4 text-center md:flex-row md:text-left",children:[J("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-amber-500 to-orange-600 text-3xl shadow-lg",children:"\uD83D\uDCA1"}),$("div",{className:"flex-1",children:[J("h1",{className:"font-bold text-2xl",children:z.name}),J("p",{className:"mt-1 text-muted-foreground",children:z.description})]}),J("div",{className:"flex items-center gap-4",children:J(Gq,{days:q.streakDays,size:"lg"})})]})})}),$("div",{className:"grid gap-4 md:grid-cols-3",children:[$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"Active Tips"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-amber-500",children:Y}),J("p",{className:"text-muted-foreground text-sm",children:"tips for you today"})]})]}),$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"Tips Actioned"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-green-500",children:U}),$("p",{className:"text-muted-foreground text-sm",children:["out of ",Z," total"]})]})]}),$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),J(Jq,{current:q.xpEarned,max:M,showLabel:!1,size:"sm"})]})]})]}),A.length>0&&$(H,{children:[$(w,{className:"flex flex-row items-center justify-between",children:[$(u,{className:"flex items-center gap-2",children:[J("span",{children:"\uD83D\uDCA1"}),J("span",{children:"Tips for You"})]}),A.length<Y&&$(Kq,{variant:"outline",size:"sm",onClick:Q,children:["View All (",Y,")"]})]}),J(O,{className:"space-y-3",children:A.map((W)=>J(B,{step:W,isCompleted:!1,isCurrent:W.id===A[0]?.id,onComplete:()=>R?.(W.id)},W.id))})]}),Y===0&&J(H,{className:"border-green-500/50 bg-green-500/5",children:$(O,{className:"flex items-center gap-4 p-6",children:[J("div",{className:"text-4xl",children:"\uD83C\uDF89"}),$("div",{children:[J("h3",{className:"font-semibold text-green-500 text-lg",children:"All Tips Actioned!"}),$("p",{className:"text-muted-foreground",children:["Great job! You've addressed all ",Z," coaching tips."]})]})]})})]})}import{jsx as D,jsxs as f}from"react/jsx-runtime";function k({acknowledged:z,actioned:q,pending:R,streak:Q=0}){let M=z+q+R,U=M>0?q/M*100:0,Z=M>0?z/M*100:0;return f("div",{className:"space-y-4",children:[D("div",{className:"flex items-center justify-center",children:f("div",{className:"relative h-32 w-32",children:[f("svg",{className:"h-full w-full -rotate-90",viewBox:"0 0 100 100",children:[D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",className:"stroke-muted"}),D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${U*2.51} 251`,className:"stroke-green-500 transition-all duration-500"}),D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${Z*2.51} 251`,strokeDashoffset:`${-U*2.51}`,className:"stroke-amber-500 transition-all duration-500"})]}),f("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:[D("span",{className:"font-bold text-2xl",children:M}),D("span",{className:"text-muted-foreground text-xs",children:"tips"})]})]})}),f("div",{className:"flex justify-center gap-4 text-sm",children:[f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-green-500"}),f("span",{children:["Actioned (",q,")"]})]}),f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-amber-500"}),f("span",{children:["Acknowledged (",z,")"]})]}),f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-muted"}),f("span",{children:["Pending (",R,")"]})]})]}),Q>0&&f("div",{className:"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",children:[D("span",{className:"text-xl",children:"\uD83D\uDD25"}),f("span",{className:"font-semibold text-orange-500",children:[Q," day engagement streak!"]})]})]})}import{BadgeDisplay as Qq,StreakCounter as Rq,XpBar as Uq}from"@contractspec/example.learning-journey-ui-shared";import{Card as v,CardContent as T,CardHeader as b,CardTitle as S}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as G,jsxs as E}from"react/jsx-runtime";function g({track:z,progress:q}){let R=z.totalXp??z.steps.reduce((A,W)=>A+(W.xpReward??0),0),Q=q.completedStepIds.length,U=z.steps.length-Q,Z=Math.floor(Q*0.7),Y=Q-Z;return E("div",{className:"space-y-6",children:[E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCCA"}),G("span",{children:"Engagement Overview"})]})}),G(T,{children:G(k,{actioned:Z,acknowledged:Y,pending:U,streak:q.streakDays})})]}),E("div",{className:"grid gap-4 md:grid-cols-2",children:[E(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),E(T,{className:"space-y-3",children:[E("div",{className:"flex items-baseline gap-2",children:[G("span",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),E("span",{className:"text-muted-foreground",children:["/ ",R," XP"]})]}),G(Uq,{current:q.xpEarned,max:R,showLabel:!1,size:"lg"})]})]}),E(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"Engagement Streak"})}),G(T,{children:E("div",{className:"flex items-center gap-4",children:[G(Rq,{days:q.streakDays,size:"lg"}),G("div",{className:"text-muted-foreground text-sm",children:q.streakDays>0?"Keep going!":"Start your streak today!"})]})})]})]}),E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83C\uDFC5"}),G("span",{children:"Achievements"})]})}),E(T,{children:[G(Qq,{badges:q.badges,size:"lg",maxVisible:10}),q.badges.length===0&&G("p",{className:"text-muted-foreground text-sm",children:"Action tips to unlock achievements!"})]})]}),E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCA1"}),G("span",{children:"Tip Status"})]})}),G(T,{children:G("div",{className:"space-y-3",children:z.steps.map((A)=>{let W=q.completedStepIds.includes(A.id);return E("div",{className:"flex items-center justify-between rounded-lg border p-3",children:[E("div",{className:"flex items-center gap-3",children:[G("span",{className:W?"text-green-500":"text-amber-500",children:W?"✓":"○"}),G("span",{className:W?"text-muted-foreground":"text-foreground",children:A.title})]}),G("span",{className:`text-sm ${W?"text-green-500":"text-muted-foreground"}`,children:W?"Actioned":"Pending"})]},A.id)})})})]})]})}import{jsx as h,jsxs as m}from"react/jsx-runtime";function l({track:z,progress:q,onStepComplete:R}){let Q=q.completedStepIds.length,M=z.steps.length,U=[...z.steps].sort((Y,A)=>{let W=q.completedStepIds.includes(Y.id),V=q.completedStepIds.includes(A.id);if(W===V)return 0;return W?1:-1}),Z=z.steps.find((Y)=>!q.completedStepIds.includes(Y.id))?.id;return m("div",{className:"space-y-6",children:[m("div",{className:"text-center",children:[h("h2",{className:"font-bold text-xl",children:"Coaching Tips"}),h("p",{className:"text-muted-foreground",children:"Review and take action on personalized tips"}),m("p",{className:"mt-2 text-muted-foreground text-sm",children:[Q," of ",M," tips actioned"]})]}),h("div",{className:"space-y-3",children:U.map((Y)=>{let A=q.completedStepIds.includes(Y.id),W=Y.id===Z;return h(B,{step:Y,isCompleted:A,isCurrent:W,onComplete:()=>R?.(Y.id),onDismiss:()=>R?.(Y.id)},Y.id)})}),Q===M&&m("div",{className:"text-center text-muted-foreground",children:[h("span",{className:"text-2xl",children:"✨"}),h("p",{className:"mt-2",children:"All tips have been addressed!"})]})]})}import{cn as a}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as N,jsxs as X}from"react/jsx-runtime";var r={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function C({items:z}){if(z.length===0)return N("div",{className:"py-8 text-center text-muted-foreground",children:"No tips yet. Start engaging with coaching tips!"});return X("div",{className:"relative",children:[N("div",{className:"absolute top-0 left-4 h-full w-0.5 bg-border"}),N("div",{className:"space-y-4",children:z.map((q)=>{let R=q.step.metadata?.tipId??"default",Q=r[R]??r.default;return X("div",{className:"relative flex gap-4 pl-2",children:[N("div",{className:a("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm",q.isCompleted?"bg-green-500 text-white":"bg-muted text-muted-foreground"),children:q.isCompleted?"✓":Q}),X("div",{className:"flex-1 rounded-lg border bg-card p-3",children:[X("div",{className:"flex items-start justify-between gap-2",children:[X("div",{children:[N("p",{className:"font-medium",children:q.step.title}),N("p",{className:"mt-0.5 text-muted-foreground text-sm",children:q.step.description})]}),q.step.xpReward&&X("span",{className:a("shrink-0 font-medium text-xs",q.isCompleted?"text-green-500":"text-muted-foreground"),children:["+",q.step.xpReward," XP"]})]}),N("div",{className:"mt-2 flex items-center gap-2 text-muted-foreground text-xs",children:q.isCompleted?X("span",{className:"text-green-500",children:["✓ Completed",q.completedAt&&` • ${q.completedAt}`]}):N("span",{children:"Pending action"})})]})]},q.step.id)})})]})}import{Card as c,CardContent as d,CardHeader as t,CardTitle as e}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as K,jsxs as L}from"react/jsx-runtime";function i({track:z,progress:q}){let R=z.steps.map((U)=>({step:U,isCompleted:q.completedStepIds.includes(U.id),completedAt:q.completedStepIds.includes(U.id)?"Recently":void 0})).sort((U,Z)=>{if(U.isCompleted&&!Z.isCompleted)return-1;if(!U.isCompleted&&Z.isCompleted)return 1;return 0}),Q=R.filter((U)=>U.isCompleted).length,M=R.length-Q;return L("div",{className:"space-y-6",children:[L("div",{className:"text-center",children:[K("h2",{className:"font-bold text-xl",children:"Activity Timeline"}),K("p",{className:"text-muted-foreground",children:"Your coaching journey and tip history"})]}),L("div",{className:"grid grid-cols-2 gap-4",children:[K(c,{children:L(d,{className:"p-4 text-center",children:[K("div",{className:"font-bold text-2xl text-green-500",children:Q}),K("div",{className:"text-muted-foreground text-sm",children:"Tips Actioned"})]})}),K(c,{children:L(d,{className:"p-4 text-center",children:[K("div",{className:"font-bold text-2xl text-amber-500",children:M}),K("div",{className:"text-muted-foreground text-sm",children:"Tips Pending"})]})})]}),L(c,{children:[K(t,{children:L(e,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCDD"}),K("span",{children:"Coaching Feed"})]})}),K(d,{children:K(C,{items:R})})]}),L(c,{children:[K(t,{children:L(e,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCC8"}),K("span",{children:"Journey Stats"})]})}),K(d,{children:L("div",{className:"space-y-4",children:[L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Total Tips"}),K("span",{className:"font-semibold",children:z.steps.length})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Completed"}),K("span",{className:"font-semibold text-green-500",children:Q})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"XP Earned"}),K("span",{className:"font-semibold text-orange-500",children:q.xpEarned})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Current Streak"}),K("span",{className:"font-semibold",children:q.streakDays>0?`\uD83D\uDD25 ${q.streakDays} days`:"Start today!"})]})]})})]})]})}import{useLearningProgress as Wq,ViewTabs as Yq}from"@contractspec/example.learning-journey-ui-shared";import{Card as Zq,CardContent as $q}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as n,useState as Mq}from"react";import{jsx as _,jsxs as Eq}from"react/jsx-runtime";function Aq({track:z,progress:q,onStepComplete:R,onViewChange:Q,initialView:M="overview"}){let[U,Z]=Mq(M),{progress:Y,completeStep:A}=Wq(z),W=q??Y,V=n((y)=>{Z(y),Q?.(y)},[Q]),s=n((y)=>{if(R)R(y);else A(y)},[R,A]),x=n(()=>{Z("steps"),Q?.("steps")},[Q]);return Eq("div",{className:"space-y-6",children:[_(Zq,{children:_($q,{className:"p-4",children:_(Yq,{currentView:U,onViewChange:V})})}),(()=>{let y={track:z,progress:W,onStepComplete:s};switch(U){case"overview":return _(P,{...y,onStart:x});case"steps":return _(l,{...y});case"progress":return _(g,{...y});case"timeline":return _(i,{...y});default:return _(P,{...y,onStart:x})}})()]})}import{registerDocBlocks as Lq}from"@contractspec/lib.contracts-spec/docs";var fq=[{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
+import{Button as o}from"@contractspec/lib.design-system";import{Card as qq,CardContent as zq}from"@contractspec/lib.ui-kit-web/ui/card";import{cn as j}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as f,jsxs as I}from"react/jsx-runtime";var p={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function B({step:z,isCompleted:q,isCurrent:W,onComplete:R,onDismiss:J}){let Y=z.metadata?.tipId??"default",M=p[Y]??p.default;return f(qq,{className:j("transition-all",q&&"opacity-60",W&&"ring-2 ring-amber-500"),children:f(zq,{className:"p-4",children:I("div",{className:"flex gap-4",children:[f("div",{className:j("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl",q?"bg-green-500/10":W?"bg-amber-500/10":"bg-muted"),children:q?"✓":M}),I("div",{className:"min-w-0 flex-1",children:[I("div",{className:"flex items-start justify-between gap-2",children:[f("h4",{className:"font-semibold",children:z.title}),z.xpReward&&I("span",{className:j("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs",q?"bg-green-500/10 text-green-500":"bg-amber-500/10 text-amber-500"),children:["+",z.xpReward," XP"]})]}),f("p",{className:"mt-1 text-muted-foreground text-sm",children:z.description}),!q&&I("div",{className:"mt-3 flex flex-wrap gap-2",children:[f(o,{size:"sm",onClick:R,children:"Take Action"}),f(o,{variant:"outline",size:"sm",onClick:J,children:"Dismiss"})]}),q&&f("p",{className:"mt-2 text-green-500 text-sm",children:"✓ Tip acknowledged"})]})]})})})}import{StreakCounter as Gq,XpBar as Kq}from"@contractspec/example.learning-journey-ui-shared";import{Button as Qq}from"@contractspec/lib.design-system";import{Card as H,CardContent as O,CardHeader as w,CardTitle as u}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as K,jsxs as A}from"react/jsx-runtime";function P({track:z,progress:q,onStepComplete:W,onStart:R}){let J=z.totalXp??z.steps.reduce((Z,h)=>Z+(h.xpReward??0),0),Y=q.completedStepIds.length,M=z.steps.length,$=M-Y,U=z.steps.filter((Z)=>!q.completedStepIds.includes(Z.id)).slice(0,3);return A("div",{className:"space-y-6",children:[K(H,{className:"overflow-hidden bg-gradient-to-br from-amber-500/10 via-orange-500/10 to-red-500/10",children:K(O,{className:"p-6",children:A("div",{className:"flex flex-col items-center gap-4 text-center md:flex-row md:text-left",children:[K("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-amber-500 to-orange-600 text-3xl shadow-lg",children:"\uD83D\uDCA1"}),A("div",{className:"flex-1",children:[K("h1",{className:"font-bold text-2xl",children:z.name}),K("p",{className:"mt-1 text-muted-foreground",children:z.description})]}),K("div",{className:"flex items-center gap-4",children:K(Gq,{days:q.streakDays,size:"lg"})})]})})}),A("div",{className:"grid gap-4 md:grid-cols-3",children:[A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"Active Tips"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-amber-500",children:$}),K("p",{className:"text-muted-foreground text-sm",children:"tips for you today"})]})]}),A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"Tips Actioned"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-green-500",children:Y}),A("p",{className:"text-muted-foreground text-sm",children:["out of ",M," total"]})]})]}),A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),K(Kq,{current:q.xpEarned,max:J,showLabel:!1,size:"sm"})]})]})]}),U.length>0&&A(H,{children:[A(w,{className:"flex flex-row items-center justify-between",children:[A(u,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCA1"}),K("span",{children:"Tips for You"})]}),U.length<$&&A(Qq,{variant:"outline",size:"sm",onClick:R,children:["View All (",$,")"]})]}),K(O,{className:"space-y-3",children:U.map((Z)=>K(B,{step:Z,isCompleted:!1,isCurrent:Z.id===U[0]?.id,onComplete:()=>W?.(Z.id)},Z.id))})]}),$===0&&K(H,{className:"border-green-500/50 bg-green-500/5",children:A(O,{className:"flex items-center gap-4 p-6",children:[K("div",{className:"text-4xl",children:"\uD83C\uDF89"}),A("div",{children:[K("h3",{className:"font-semibold text-green-500 text-lg",children:"All Tips Actioned!"}),A("p",{className:"text-muted-foreground",children:["Great job! You've addressed all ",M," coaching tips."]})]})]})})]})}import{jsx as _,jsxs as L}from"react/jsx-runtime";function k({acknowledged:z,actioned:q,pending:W,streak:R=0}){let J=z+q+W,Y=J>0?q/J*100:0,M=J>0?z/J*100:0;return L("div",{className:"space-y-4",children:[_("div",{className:"flex items-center justify-center",children:L("div",{className:"relative h-32 w-32",children:[L("svg",{className:"h-full w-full -rotate-90",viewBox:"0 0 100 100",children:[_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",className:"stroke-muted"}),_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${Y*2.51} 251`,className:"stroke-green-500 transition-all duration-500"}),_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${M*2.51} 251`,strokeDashoffset:`${-Y*2.51}`,className:"stroke-amber-500 transition-all duration-500"})]}),L("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:[_("span",{className:"font-bold text-2xl",children:J}),_("span",{className:"text-muted-foreground text-xs",children:"tips"})]})]})}),L("div",{className:"flex justify-center gap-4 text-sm",children:[L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-green-500"}),L("span",{children:["Actioned (",q,")"]})]}),L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-amber-500"}),L("span",{children:["Acknowledged (",z,")"]})]}),L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-muted"}),L("span",{children:["Pending (",W,")"]})]})]}),R>0&&L("div",{className:"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",children:[_("span",{className:"text-xl",children:"\uD83D\uDD25"}),L("span",{className:"font-semibold text-orange-500",children:[R," day engagement streak!"]})]})]})}import{BadgeDisplay as Rq,StreakCounter as Wq,XpBar as Yq}from"@contractspec/example.learning-journey-ui-shared";import{Card as v,CardContent as T,CardHeader as b,CardTitle as S}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as G,jsxs as D}from"react/jsx-runtime";function g({track:z,progress:q}){let W=z.totalXp??z.steps.reduce((U,Z)=>U+(Z.xpReward??0),0),R=q.completedStepIds.length,Y=z.steps.length-R,M=Math.floor(R*0.7),$=R-M;return D("div",{className:"space-y-6",children:[D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCCA"}),G("span",{children:"Engagement Overview"})]})}),G(T,{children:G(k,{actioned:M,acknowledged:$,pending:Y,streak:q.streakDays})})]}),D("div",{className:"grid gap-4 md:grid-cols-2",children:[D(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),D(T,{className:"space-y-3",children:[D("div",{className:"flex items-baseline gap-2",children:[G("span",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),D("span",{className:"text-muted-foreground",children:["/ ",W," XP"]})]}),G(Yq,{current:q.xpEarned,max:W,showLabel:!1,size:"lg"})]})]}),D(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"Engagement Streak"})}),G(T,{children:D("div",{className:"flex items-center gap-4",children:[G(Wq,{days:q.streakDays,size:"lg"}),G("div",{className:"text-muted-foreground text-sm",children:q.streakDays>0?"Keep going!":"Start your streak today!"})]})})]})]}),D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83C\uDFC5"}),G("span",{children:"Achievements"})]})}),D(T,{children:[G(Rq,{badges:q.badges,size:"lg",maxVisible:10}),q.badges.length===0&&G("p",{className:"text-muted-foreground text-sm",children:"Action tips to unlock achievements!"})]})]}),D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCA1"}),G("span",{children:"Tip Status"})]})}),G(T,{children:G("div",{className:"space-y-3",children:z.steps.map((U)=>{let Z=q.completedStepIds.includes(U.id);return D("div",{className:"flex items-center justify-between rounded-lg border p-3",children:[D("div",{className:"flex items-center gap-3",children:[G("span",{className:Z?"text-green-500":"text-amber-500",children:Z?"✓":"○"}),G("span",{className:Z?"text-muted-foreground":"text-foreground",children:U.title})]}),G("span",{className:`text-sm ${Z?"text-green-500":"text-muted-foreground"}`,children:Z?"Actioned":"Pending"})]},U.id)})})})]})]})}import{jsx as V,jsxs as m}from"react/jsx-runtime";function l({track:z,progress:q,onStepComplete:W}){let R=q.completedStepIds.length,J=z.steps.length,Y=[...z.steps].sort(($,U)=>{let Z=q.completedStepIds.includes($.id),h=q.completedStepIds.includes(U.id);if(Z===h)return 0;return Z?1:-1}),M=z.steps.find(($)=>!q.completedStepIds.includes($.id))?.id;return m("div",{className:"space-y-6",children:[m("div",{className:"text-center",children:[V("h2",{className:"font-bold text-xl",children:"Coaching Tips"}),V("p",{className:"text-muted-foreground",children:"Review and take action on personalized tips"}),m("p",{className:"mt-2 text-muted-foreground text-sm",children:[R," of ",J," tips actioned"]})]}),V("div",{className:"space-y-3",children:Y.map(($)=>{let U=q.completedStepIds.includes($.id),Z=$.id===M;return V(B,{step:$,isCompleted:U,isCurrent:Z,onComplete:()=>W?.($.id),onDismiss:()=>W?.($.id)},$.id)})}),R===J&&m("div",{className:"text-center text-muted-foreground",children:[V("span",{className:"text-2xl",children:"✨"}),V("p",{className:"mt-2",children:"All tips have been addressed!"})]})]})}import{cn as a}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as X,jsxs as E}from"react/jsx-runtime";var r={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function C({items:z}){if(z.length===0)return X("div",{className:"py-8 text-center text-muted-foreground",children:"No tips yet. Start engaging with coaching tips!"});return E("div",{className:"relative",children:[X("div",{className:"absolute top-0 left-4 h-full w-0.5 bg-border"}),X("div",{className:"space-y-4",children:z.map((q)=>{let W=q.step.metadata?.tipId??"default",R=r[W]??r.default;return E("div",{className:"relative flex gap-4 pl-2",children:[X("div",{className:a("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm",q.isCompleted?"bg-green-500 text-white":"bg-muted text-muted-foreground"),children:q.isCompleted?"✓":R}),E("div",{className:"flex-1 rounded-lg border bg-card p-3",children:[E("div",{className:"flex items-start justify-between gap-2",children:[E("div",{children:[X("p",{className:"font-medium",children:q.step.title}),X("p",{className:"mt-0.5 text-muted-foreground text-sm",children:q.step.description})]}),q.step.xpReward&&E("span",{className:a("shrink-0 font-medium text-xs",q.isCompleted?"text-green-500":"text-muted-foreground"),children:["+",q.step.xpReward," XP"]})]}),X("div",{className:"mt-2 flex items-center gap-2 text-muted-foreground text-xs",children:q.isCompleted?E("span",{className:"text-green-500",children:["✓ Completed",q.completedAt&&` • ${q.completedAt}`]}):X("span",{children:"Pending action"})})]})]},q.step.id)})})]})}import{Card as c,CardContent as d,CardHeader as t,CardTitle as e}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as Q,jsxs as F}from"react/jsx-runtime";function i({track:z,progress:q}){let W=z.steps.map((Y)=>({step:Y,isCompleted:q.completedStepIds.includes(Y.id),completedAt:q.completedStepIds.includes(Y.id)?"Recently":void 0})).sort((Y,M)=>{if(Y.isCompleted&&!M.isCompleted)return-1;if(!Y.isCompleted&&M.isCompleted)return 1;return 0}),R=W.filter((Y)=>Y.isCompleted).length,J=W.length-R;return F("div",{className:"space-y-6",children:[F("div",{className:"text-center",children:[Q("h2",{className:"font-bold text-xl",children:"Activity Timeline"}),Q("p",{className:"text-muted-foreground",children:"Your coaching journey and tip history"})]}),F("div",{className:"grid grid-cols-2 gap-4",children:[Q(c,{children:F(d,{className:"p-4 text-center",children:[Q("div",{className:"font-bold text-2xl text-green-500",children:R}),Q("div",{className:"text-muted-foreground text-sm",children:"Tips Actioned"})]})}),Q(c,{children:F(d,{className:"p-4 text-center",children:[Q("div",{className:"font-bold text-2xl text-amber-500",children:J}),Q("div",{className:"text-muted-foreground text-sm",children:"Tips Pending"})]})})]}),F(c,{children:[Q(t,{children:F(e,{className:"flex items-center gap-2",children:[Q("span",{children:"\uD83D\uDCDD"}),Q("span",{children:"Coaching Feed"})]})}),Q(d,{children:Q(C,{items:W})})]}),F(c,{children:[Q(t,{children:F(e,{className:"flex items-center gap-2",children:[Q("span",{children:"\uD83D\uDCC8"}),Q("span",{children:"Journey Stats"})]})}),Q(d,{children:F("div",{className:"space-y-4",children:[F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Total Tips"}),Q("span",{className:"font-semibold",children:z.steps.length})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Completed"}),Q("span",{className:"font-semibold text-green-500",children:R})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"XP Earned"}),Q("span",{className:"font-semibold text-orange-500",children:q.xpEarned})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Current Streak"}),Q("span",{className:"font-semibold",children:q.streakDays>0?`\uD83D\uDD25 ${q.streakDays} days`:"Start today!"})]})]})})]})]})}import{useLearningProgress as Zq,ViewTabs as $q}from"@contractspec/example.learning-journey-ui-shared";import{Card as Mq,CardContent as Aq}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as x,useState as Jq}from"react";import{jsx as y,jsxs as Dq}from"react/jsx-runtime";function Uq({track:z,progress:q,onStepComplete:W,onViewChange:R,initialView:J="overview"}){let[Y,M]=Jq(J),{progress:$,completeStep:U}=Zq(z),Z=q??$,h=x((N)=>{M(N),R?.(N)},[R]),s=x((N)=>{if(W)W(N);else U(N)},[W,U]),n=x(()=>{M("steps"),R?.("steps")},[R]);return Dq("div",{className:"space-y-6",children:[y(Mq,{children:y(Aq,{className:"p-4",children:y($q,{currentView:Y,onViewChange:h})})}),(()=>{let N={track:z,progress:Z,onStepComplete:s};switch(Y){case"overview":return y(P,{...N,onStart:n});case"steps":return y(l,{...N});case"progress":return y(g,{...N});case"timeline":return y(i,{...N});default:return y(P,{...N,onStart:n})}})()]})}import{registerDocBlocks as Fq}from"@contractspec/lib.contracts-spec/docs";var Lq=[{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
 - Coaching mini-app shell
 - Views: overview, steps, progress, timeline
 - Components: tip card, engagement meter, tip feed
 
 ## Notes
 - Compose using design system components.
-- Keep accessibility and mobile-friendly tap targets.`}];Lq(fq);import{defineExample as yq}from"@contractspec/lib.contracts-spec";var Dq=yq({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:!0,sandbox:{enabled:!0,modes:["playground","markdown"]},studio:{enabled:!0,installable:!0},mcp:{enabled:!0}}}),Fq=Dq;import{defineFeature as Nq}from"@contractspec/lib.contracts-spec";var Ez=Nq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{Fq as example,C as TipFeed,B as TipCard,i as Timeline,l as Steps,g as Progress,P as Overview,Ez as LearningJourneyUiCoachingFeature,k as EngagementMeter,Aq as CoachingMiniApp};
+- Keep accessibility and mobile-friendly tap targets.`}];Fq(Lq);import{defineExample as Nq}from"@contractspec/lib.contracts-spec/examples";var _q=Nq({meta:{key:"examples.learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey Ui Coaching",description:"Contextual coaching UI with tip cards and engagement tracking.",kind:"template",visibility:"experimental",stability:"experimental",owners:["@contractspec-core"],tags:["package","examples","learning-journey-ui-coaching"]},surfaces:{templates:!0,sandbox:{enabled:!0,modes:["playground","specs"]},studio:{enabled:!1,installable:!1},mcp:{enabled:!1}},entrypoints:{packageName:"@contractspec/example.learning-journey-ui-coaching"}}),fq=_q;import{defineFeature as Xq}from"@contractspec/lib.contracts-spec/features";var Dz=Xq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{fq as example,C as TipFeed,B as TipCard,i as Timeline,l as Steps,g as Progress,P as Overview,Dz as LearningJourneyUiCoachingFeature,_q as ExamplesLearningJourneyUiCoachingExample,k as EngagementMeter,Uq as CoachingMiniApp};

package/dist/browser/learning-journey-ui-coaching.feature.js

@@ -1 +1 @@
-import{defineFeature as g}from"@contractspec/lib.contracts-spec";var j=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{j as LearningJourneyUiCoachingFeature};
+import{defineFeature as g}from"@contractspec/lib.contracts-spec/features";var j=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{j as LearningJourneyUiCoachingFeature};

package/dist/example.d.ts

@@ -1,2 +1,3 @@
-declare const example: import("@contractspec/lib.contracts-spec").ExampleSpec;
-export default example;
+declare const ExamplesLearningJourneyUiCoachingExample: import("@contractspec/lib.contracts-spec").ExampleSpec;
+export default ExamplesLearningJourneyUiCoachingExample;
+export { ExamplesLearningJourneyUiCoachingExample };

package/dist/example.js

@@ -1,2 +1,2 @@
 // @bun
-import{defineExample as g}from"@contractspec/lib.contracts-spec";var h=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI \u2014 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:!0,sandbox:{enabled:!0,modes:["playground","markdown"]},studio:{enabled:!0,installable:!0},mcp:{enabled:!0}}}),q=h;export{q as default};
+import{defineExample as b}from"@contractspec/lib.contracts-spec/examples";var j=b({meta:{key:"examples.learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey Ui Coaching",description:"Contextual coaching UI with tip cards and engagement tracking.",kind:"template",visibility:"experimental",stability:"experimental",owners:["@contractspec-core"],tags:["package","examples","learning-journey-ui-coaching"]},surfaces:{templates:!0,sandbox:{enabled:!0,modes:["playground","specs"]},studio:{enabled:!1,installable:!1},mcp:{enabled:!1}},entrypoints:{packageName:"@contractspec/example.learning-journey-ui-coaching"}}),t=j;export{t as default,j as ExamplesLearningJourneyUiCoachingExample};

package/dist/index.d.ts

@@ -4,3 +4,4 @@ export { default as example } from './example';
 export * from './learning-journey-ui-coaching.feature';
 export { Overview, Progress, Steps, Timeline } from './views';
 import './docs';
+export * from './example';

package/dist/index.js

@@ -1,9 +1,9 @@
 // @bun
-import{Button as o}from"@contractspec/lib.design-system";import{Card as qq,CardContent as zq}from"@contractspec/lib.ui-kit-web/ui/card";import{cn as j}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as F,jsxs as I}from"react/jsx-runtime";var p={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function B({step:z,isCompleted:q,isCurrent:R,onComplete:Q,onDismiss:M}){let U=z.metadata?.tipId??"default",Z=p[U]??p.default;return F(qq,{className:j("transition-all",q&&"opacity-60",R&&"ring-2 ring-amber-500"),children:F(zq,{className:"p-4",children:I("div",{className:"flex gap-4",children:[F("div",{className:j("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl",q?"bg-green-500/10":R?"bg-amber-500/10":"bg-muted"),children:q?"\u2713":Z}),I("div",{className:"min-w-0 flex-1",children:[I("div",{className:"flex items-start justify-between gap-2",children:[F("h4",{className:"font-semibold",children:z.title}),z.xpReward&&I("span",{className:j("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs",q?"bg-green-500/10 text-green-500":"bg-amber-500/10 text-amber-500"),children:["+",z.xpReward," XP"]})]}),F("p",{className:"mt-1 text-muted-foreground text-sm",children:z.description}),!q&&I("div",{className:"mt-3 flex flex-wrap gap-2",children:[F(o,{size:"sm",onClick:Q,children:"Take Action"}),F(o,{variant:"outline",size:"sm",onClick:M,children:"Dismiss"})]}),q&&F("p",{className:"mt-2 text-green-500 text-sm",children:"\u2713 Tip acknowledged"})]})]})})})}import{StreakCounter as Gq,XpBar as Jq}from"@contractspec/example.learning-journey-ui-shared";import{Button as Kq}from"@contractspec/lib.design-system";import{Card as H,CardContent as O,CardHeader as w,CardTitle as u}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as J,jsxs as $}from"react/jsx-runtime";function P({track:z,progress:q,onStepComplete:R,onStart:Q}){let M=z.totalXp??z.steps.reduce((W,V)=>W+(V.xpReward??0),0),U=q.completedStepIds.length,Z=z.steps.length,Y=Z-U,A=z.steps.filter((W)=>!q.completedStepIds.includes(W.id)).slice(0,3);return $("div",{className:"space-y-6",children:[J(H,{className:"overflow-hidden bg-gradient-to-br from-amber-500/10 via-orange-500/10 to-red-500/10",children:J(O,{className:"p-6",children:$("div",{className:"flex flex-col items-center gap-4 text-center md:flex-row md:text-left",children:[J("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-amber-500 to-orange-600 text-3xl shadow-lg",children:"\uD83D\uDCA1"}),$("div",{className:"flex-1",children:[J("h1",{className:"font-bold text-2xl",children:z.name}),J("p",{className:"mt-1 text-muted-foreground",children:z.description})]}),J("div",{className:"flex items-center gap-4",children:J(Gq,{days:q.streakDays,size:"lg"})})]})})}),$("div",{className:"grid gap-4 md:grid-cols-3",children:[$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"Active Tips"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-amber-500",children:Y}),J("p",{className:"text-muted-foreground text-sm",children:"tips for you today"})]})]}),$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"Tips Actioned"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-green-500",children:U}),$("p",{className:"text-muted-foreground text-sm",children:["out of ",Z," total"]})]})]}),$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),J(Jq,{current:q.xpEarned,max:M,showLabel:!1,size:"sm"})]})]})]}),A.length>0&&$(H,{children:[$(w,{className:"flex flex-row items-center justify-between",children:[$(u,{className:"flex items-center gap-2",children:[J("span",{children:"\uD83D\uDCA1"}),J("span",{children:"Tips for You"})]}),A.length<Y&&$(Kq,{variant:"outline",size:"sm",onClick:Q,children:["View All (",Y,")"]})]}),J(O,{className:"space-y-3",children:A.map((W)=>J(B,{step:W,isCompleted:!1,isCurrent:W.id===A[0]?.id,onComplete:()=>R?.(W.id)},W.id))})]}),Y===0&&J(H,{className:"border-green-500/50 bg-green-500/5",children:$(O,{className:"flex items-center gap-4 p-6",children:[J("div",{className:"text-4xl",children:"\uD83C\uDF89"}),$("div",{children:[J("h3",{className:"font-semibold text-green-500 text-lg",children:"All Tips Actioned!"}),$("p",{className:"text-muted-foreground",children:["Great job! You've addressed all ",Z," coaching tips."]})]})]})})]})}import{jsx as D,jsxs as f}from"react/jsx-runtime";function k({acknowledged:z,actioned:q,pending:R,streak:Q=0}){let M=z+q+R,U=M>0?q/M*100:0,Z=M>0?z/M*100:0;return f("div",{className:"space-y-4",children:[D("div",{className:"flex items-center justify-center",children:f("div",{className:"relative h-32 w-32",children:[f("svg",{className:"h-full w-full -rotate-90",viewBox:"0 0 100 100",children:[D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",className:"stroke-muted"}),D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${U*2.51} 251`,className:"stroke-green-500 transition-all duration-500"}),D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${Z*2.51} 251`,strokeDashoffset:`${-U*2.51}`,className:"stroke-amber-500 transition-all duration-500"})]}),f("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:[D("span",{className:"font-bold text-2xl",children:M}),D("span",{className:"text-muted-foreground text-xs",children:"tips"})]})]})}),f("div",{className:"flex justify-center gap-4 text-sm",children:[f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-green-500"}),f("span",{children:["Actioned (",q,")"]})]}),f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-amber-500"}),f("span",{children:["Acknowledged (",z,")"]})]}),f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-muted"}),f("span",{children:["Pending (",R,")"]})]})]}),Q>0&&f("div",{className:"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",children:[D("span",{className:"text-xl",children:"\uD83D\uDD25"}),f("span",{className:"font-semibold text-orange-500",children:[Q," day engagement streak!"]})]})]})}import{BadgeDisplay as Qq,StreakCounter as Rq,XpBar as Uq}from"@contractspec/example.learning-journey-ui-shared";import{Card as v,CardContent as T,CardHeader as b,CardTitle as S}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as G,jsxs as E}from"react/jsx-runtime";function g({track:z,progress:q}){let R=z.totalXp??z.steps.reduce((A,W)=>A+(W.xpReward??0),0),Q=q.completedStepIds.length,U=z.steps.length-Q,Z=Math.floor(Q*0.7),Y=Q-Z;return E("div",{className:"space-y-6",children:[E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCCA"}),G("span",{children:"Engagement Overview"})]})}),G(T,{children:G(k,{actioned:Z,acknowledged:Y,pending:U,streak:q.streakDays})})]}),E("div",{className:"grid gap-4 md:grid-cols-2",children:[E(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),E(T,{className:"space-y-3",children:[E("div",{className:"flex items-baseline gap-2",children:[G("span",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),E("span",{className:"text-muted-foreground",children:["/ ",R," XP"]})]}),G(Uq,{current:q.xpEarned,max:R,showLabel:!1,size:"lg"})]})]}),E(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"Engagement Streak"})}),G(T,{children:E("div",{className:"flex items-center gap-4",children:[G(Rq,{days:q.streakDays,size:"lg"}),G("div",{className:"text-muted-foreground text-sm",children:q.streakDays>0?"Keep going!":"Start your streak today!"})]})})]})]}),E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83C\uDFC5"}),G("span",{children:"Achievements"})]})}),E(T,{children:[G(Qq,{badges:q.badges,size:"lg",maxVisible:10}),q.badges.length===0&&G("p",{className:"text-muted-foreground text-sm",children:"Action tips to unlock achievements!"})]})]}),E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCA1"}),G("span",{children:"Tip Status"})]})}),G(T,{children:G("div",{className:"space-y-3",children:z.steps.map((A)=>{let W=q.completedStepIds.includes(A.id);return E("div",{className:"flex items-center justify-between rounded-lg border p-3",children:[E("div",{className:"flex items-center gap-3",children:[G("span",{className:W?"text-green-500":"text-amber-500",children:W?"\u2713":"\u25CB"}),G("span",{className:W?"text-muted-foreground":"text-foreground",children:A.title})]}),G("span",{className:`text-sm ${W?"text-green-500":"text-muted-foreground"}`,children:W?"Actioned":"Pending"})]},A.id)})})})]})]})}import{jsx as h,jsxs as m}from"react/jsx-runtime";function l({track:z,progress:q,onStepComplete:R}){let Q=q.completedStepIds.length,M=z.steps.length,U=[...z.steps].sort((Y,A)=>{let W=q.completedStepIds.includes(Y.id),V=q.completedStepIds.includes(A.id);if(W===V)return 0;return W?1:-1}),Z=z.steps.find((Y)=>!q.completedStepIds.includes(Y.id))?.id;return m("div",{className:"space-y-6",children:[m("div",{className:"text-center",children:[h("h2",{className:"font-bold text-xl",children:"Coaching Tips"}),h("p",{className:"text-muted-foreground",children:"Review and take action on personalized tips"}),m("p",{className:"mt-2 text-muted-foreground text-sm",children:[Q," of ",M," tips actioned"]})]}),h("div",{className:"space-y-3",children:U.map((Y)=>{let A=q.completedStepIds.includes(Y.id),W=Y.id===Z;return h(B,{step:Y,isCompleted:A,isCurrent:W,onComplete:()=>R?.(Y.id),onDismiss:()=>R?.(Y.id)},Y.id)})}),Q===M&&m("div",{className:"text-center text-muted-foreground",children:[h("span",{className:"text-2xl",children:"\u2728"}),h("p",{className:"mt-2",children:"All tips have been addressed!"})]})]})}import{cn as a}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as N,jsxs as X}from"react/jsx-runtime";var r={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function C({items:z}){if(z.length===0)return N("div",{className:"py-8 text-center text-muted-foreground",children:"No tips yet. Start engaging with coaching tips!"});return X("div",{className:"relative",children:[N("div",{className:"absolute top-0 left-4 h-full w-0.5 bg-border"}),N("div",{className:"space-y-4",children:z.map((q)=>{let R=q.step.metadata?.tipId??"default",Q=r[R]??r.default;return X("div",{className:"relative flex gap-4 pl-2",children:[N("div",{className:a("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm",q.isCompleted?"bg-green-500 text-white":"bg-muted text-muted-foreground"),children:q.isCompleted?"\u2713":Q}),X("div",{className:"flex-1 rounded-lg border bg-card p-3",children:[X("div",{className:"flex items-start justify-between gap-2",children:[X("div",{children:[N("p",{className:"font-medium",children:q.step.title}),N("p",{className:"mt-0.5 text-muted-foreground text-sm",children:q.step.description})]}),q.step.xpReward&&X("span",{className:a("shrink-0 font-medium text-xs",q.isCompleted?"text-green-500":"text-muted-foreground"),children:["+",q.step.xpReward," XP"]})]}),N("div",{className:"mt-2 flex items-center gap-2 text-muted-foreground text-xs",children:q.isCompleted?X("span",{className:"text-green-500",children:["\u2713 Completed",q.completedAt&&` \u2022 ${q.completedAt}`]}):N("span",{children:"Pending action"})})]})]},q.step.id)})})]})}import{Card as c,CardContent as d,CardHeader as t,CardTitle as e}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as K,jsxs as L}from"react/jsx-runtime";function i({track:z,progress:q}){let R=z.steps.map((U)=>({step:U,isCompleted:q.completedStepIds.includes(U.id),completedAt:q.completedStepIds.includes(U.id)?"Recently":void 0})).sort((U,Z)=>{if(U.isCompleted&&!Z.isCompleted)return-1;if(!U.isCompleted&&Z.isCompleted)return 1;return 0}),Q=R.filter((U)=>U.isCompleted).length,M=R.length-Q;return L("div",{className:"space-y-6",children:[L("div",{className:"text-center",children:[K("h2",{className:"font-bold text-xl",children:"Activity Timeline"}),K("p",{className:"text-muted-foreground",children:"Your coaching journey and tip history"})]}),L("div",{className:"grid grid-cols-2 gap-4",children:[K(c,{children:L(d,{className:"p-4 text-center",children:[K("div",{className:"font-bold text-2xl text-green-500",children:Q}),K("div",{className:"text-muted-foreground text-sm",children:"Tips Actioned"})]})}),K(c,{children:L(d,{className:"p-4 text-center",children:[K("div",{className:"font-bold text-2xl text-amber-500",children:M}),K("div",{className:"text-muted-foreground text-sm",children:"Tips Pending"})]})})]}),L(c,{children:[K(t,{children:L(e,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCDD"}),K("span",{children:"Coaching Feed"})]})}),K(d,{children:K(C,{items:R})})]}),L(c,{children:[K(t,{children:L(e,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCC8"}),K("span",{children:"Journey Stats"})]})}),K(d,{children:L("div",{className:"space-y-4",children:[L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Total Tips"}),K("span",{className:"font-semibold",children:z.steps.length})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Completed"}),K("span",{className:"font-semibold text-green-500",children:Q})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"XP Earned"}),K("span",{className:"font-semibold text-orange-500",children:q.xpEarned})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Current Streak"}),K("span",{className:"font-semibold",children:q.streakDays>0?`\uD83D\uDD25 ${q.streakDays} days`:"Start today!"})]})]})})]})]})}import{useLearningProgress as Wq,ViewTabs as Yq}from"@contractspec/example.learning-journey-ui-shared";import{Card as Zq,CardContent as $q}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as n,useState as Mq}from"react";import{jsx as _,jsxs as Eq}from"react/jsx-runtime";function Aq({track:z,progress:q,onStepComplete:R,onViewChange:Q,initialView:M="overview"}){let[U,Z]=Mq(M),{progress:Y,completeStep:A}=Wq(z),W=q??Y,V=n((y)=>{Z(y),Q?.(y)},[Q]),s=n((y)=>{if(R)R(y);else A(y)},[R,A]),x=n(()=>{Z("steps"),Q?.("steps")},[Q]);return Eq("div",{className:"space-y-6",children:[_(Zq,{children:_($q,{className:"p-4",children:_(Yq,{currentView:U,onViewChange:V})})}),(()=>{let y={track:z,progress:W,onStepComplete:s};switch(U){case"overview":return _(P,{...y,onStart:x});case"steps":return _(l,{...y});case"progress":return _(g,{...y});case"timeline":return _(i,{...y});default:return _(P,{...y,onStart:x})}})()]})}import{registerDocBlocks as Lq}from"@contractspec/lib.contracts-spec/docs";var fq=[{id:"docs.examples.learning-journey-ui-coaching",title:"Learning Journey UI \u2014 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
+import{Button as o}from"@contractspec/lib.design-system";import{Card as qq,CardContent as zq}from"@contractspec/lib.ui-kit-web/ui/card";import{cn as j}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as f,jsxs as I}from"react/jsx-runtime";var p={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function B({step:z,isCompleted:q,isCurrent:W,onComplete:R,onDismiss:J}){let Y=z.metadata?.tipId??"default",M=p[Y]??p.default;return f(qq,{className:j("transition-all",q&&"opacity-60",W&&"ring-2 ring-amber-500"),children:f(zq,{className:"p-4",children:I("div",{className:"flex gap-4",children:[f("div",{className:j("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl",q?"bg-green-500/10":W?"bg-amber-500/10":"bg-muted"),children:q?"\u2713":M}),I("div",{className:"min-w-0 flex-1",children:[I("div",{className:"flex items-start justify-between gap-2",children:[f("h4",{className:"font-semibold",children:z.title}),z.xpReward&&I("span",{className:j("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs",q?"bg-green-500/10 text-green-500":"bg-amber-500/10 text-amber-500"),children:["+",z.xpReward," XP"]})]}),f("p",{className:"mt-1 text-muted-foreground text-sm",children:z.description}),!q&&I("div",{className:"mt-3 flex flex-wrap gap-2",children:[f(o,{size:"sm",onClick:R,children:"Take Action"}),f(o,{variant:"outline",size:"sm",onClick:J,children:"Dismiss"})]}),q&&f("p",{className:"mt-2 text-green-500 text-sm",children:"\u2713 Tip acknowledged"})]})]})})})}import{StreakCounter as Gq,XpBar as Kq}from"@contractspec/example.learning-journey-ui-shared";import{Button as Qq}from"@contractspec/lib.design-system";import{Card as H,CardContent as O,CardHeader as w,CardTitle as u}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as K,jsxs as A}from"react/jsx-runtime";function P({track:z,progress:q,onStepComplete:W,onStart:R}){let J=z.totalXp??z.steps.reduce((Z,h)=>Z+(h.xpReward??0),0),Y=q.completedStepIds.length,M=z.steps.length,$=M-Y,U=z.steps.filter((Z)=>!q.completedStepIds.includes(Z.id)).slice(0,3);return A("div",{className:"space-y-6",children:[K(H,{className:"overflow-hidden bg-gradient-to-br from-amber-500/10 via-orange-500/10 to-red-500/10",children:K(O,{className:"p-6",children:A("div",{className:"flex flex-col items-center gap-4 text-center md:flex-row md:text-left",children:[K("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-amber-500 to-orange-600 text-3xl shadow-lg",children:"\uD83D\uDCA1"}),A("div",{className:"flex-1",children:[K("h1",{className:"font-bold text-2xl",children:z.name}),K("p",{className:"mt-1 text-muted-foreground",children:z.description})]}),K("div",{className:"flex items-center gap-4",children:K(Gq,{days:q.streakDays,size:"lg"})})]})})}),A("div",{className:"grid gap-4 md:grid-cols-3",children:[A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"Active Tips"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-amber-500",children:$}),K("p",{className:"text-muted-foreground text-sm",children:"tips for you today"})]})]}),A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"Tips Actioned"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-green-500",children:Y}),A("p",{className:"text-muted-foreground text-sm",children:["out of ",M," total"]})]})]}),A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),K(Kq,{current:q.xpEarned,max:J,showLabel:!1,size:"sm"})]})]})]}),U.length>0&&A(H,{children:[A(w,{className:"flex flex-row items-center justify-between",children:[A(u,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCA1"}),K("span",{children:"Tips for You"})]}),U.length<$&&A(Qq,{variant:"outline",size:"sm",onClick:R,children:["View All (",$,")"]})]}),K(O,{className:"space-y-3",children:U.map((Z)=>K(B,{step:Z,isCompleted:!1,isCurrent:Z.id===U[0]?.id,onComplete:()=>W?.(Z.id)},Z.id))})]}),$===0&&K(H,{className:"border-green-500/50 bg-green-500/5",children:A(O,{className:"flex items-center gap-4 p-6",children:[K("div",{className:"text-4xl",children:"\uD83C\uDF89"}),A("div",{children:[K("h3",{className:"font-semibold text-green-500 text-lg",children:"All Tips Actioned!"}),A("p",{className:"text-muted-foreground",children:["Great job! You've addressed all ",M," coaching tips."]})]})]})})]})}import{jsx as _,jsxs as L}from"react/jsx-runtime";function k({acknowledged:z,actioned:q,pending:W,streak:R=0}){let J=z+q+W,Y=J>0?q/J*100:0,M=J>0?z/J*100:0;return L("div",{className:"space-y-4",children:[_("div",{className:"flex items-center justify-center",children:L("div",{className:"relative h-32 w-32",children:[L("svg",{className:"h-full w-full -rotate-90",viewBox:"0 0 100 100",children:[_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",className:"stroke-muted"}),_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${Y*2.51} 251`,className:"stroke-green-500 transition-all duration-500"}),_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${M*2.51} 251`,strokeDashoffset:`${-Y*2.51}`,className:"stroke-amber-500 transition-all duration-500"})]}),L("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:[_("span",{className:"font-bold text-2xl",children:J}),_("span",{className:"text-muted-foreground text-xs",children:"tips"})]})]})}),L("div",{className:"flex justify-center gap-4 text-sm",children:[L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-green-500"}),L("span",{children:["Actioned (",q,")"]})]}),L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-amber-500"}),L("span",{children:["Acknowledged (",z,")"]})]}),L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-muted"}),L("span",{children:["Pending (",W,")"]})]})]}),R>0&&L("div",{className:"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",children:[_("span",{className:"text-xl",children:"\uD83D\uDD25"}),L("span",{className:"font-semibold text-orange-500",children:[R," day engagement streak!"]})]})]})}import{BadgeDisplay as Rq,StreakCounter as Wq,XpBar as Yq}from"@contractspec/example.learning-journey-ui-shared";import{Card as v,CardContent as T,CardHeader as b,CardTitle as S}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as G,jsxs as D}from"react/jsx-runtime";function g({track:z,progress:q}){let W=z.totalXp??z.steps.reduce((U,Z)=>U+(Z.xpReward??0),0),R=q.completedStepIds.length,Y=z.steps.length-R,M=Math.floor(R*0.7),$=R-M;return D("div",{className:"space-y-6",children:[D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCCA"}),G("span",{children:"Engagement Overview"})]})}),G(T,{children:G(k,{actioned:M,acknowledged:$,pending:Y,streak:q.streakDays})})]}),D("div",{className:"grid gap-4 md:grid-cols-2",children:[D(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),D(T,{className:"space-y-3",children:[D("div",{className:"flex items-baseline gap-2",children:[G("span",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),D("span",{className:"text-muted-foreground",children:["/ ",W," XP"]})]}),G(Yq,{current:q.xpEarned,max:W,showLabel:!1,size:"lg"})]})]}),D(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"Engagement Streak"})}),G(T,{children:D("div",{className:"flex items-center gap-4",children:[G(Wq,{days:q.streakDays,size:"lg"}),G("div",{className:"text-muted-foreground text-sm",children:q.streakDays>0?"Keep going!":"Start your streak today!"})]})})]})]}),D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83C\uDFC5"}),G("span",{children:"Achievements"})]})}),D(T,{children:[G(Rq,{badges:q.badges,size:"lg",maxVisible:10}),q.badges.length===0&&G("p",{className:"text-muted-foreground text-sm",children:"Action tips to unlock achievements!"})]})]}),D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCA1"}),G("span",{children:"Tip Status"})]})}),G(T,{children:G("div",{className:"space-y-3",children:z.steps.map((U)=>{let Z=q.completedStepIds.includes(U.id);return D("div",{className:"flex items-center justify-between rounded-lg border p-3",children:[D("div",{className:"flex items-center gap-3",children:[G("span",{className:Z?"text-green-500":"text-amber-500",children:Z?"\u2713":"\u25CB"}),G("span",{className:Z?"text-muted-foreground":"text-foreground",children:U.title})]}),G("span",{className:`text-sm ${Z?"text-green-500":"text-muted-foreground"}`,children:Z?"Actioned":"Pending"})]},U.id)})})})]})]})}import{jsx as V,jsxs as m}from"react/jsx-runtime";function l({track:z,progress:q,onStepComplete:W}){let R=q.completedStepIds.length,J=z.steps.length,Y=[...z.steps].sort(($,U)=>{let Z=q.completedStepIds.includes($.id),h=q.completedStepIds.includes(U.id);if(Z===h)return 0;return Z?1:-1}),M=z.steps.find(($)=>!q.completedStepIds.includes($.id))?.id;return m("div",{className:"space-y-6",children:[m("div",{className:"text-center",children:[V("h2",{className:"font-bold text-xl",children:"Coaching Tips"}),V("p",{className:"text-muted-foreground",children:"Review and take action on personalized tips"}),m("p",{className:"mt-2 text-muted-foreground text-sm",children:[R," of ",J," tips actioned"]})]}),V("div",{className:"space-y-3",children:Y.map(($)=>{let U=q.completedStepIds.includes($.id),Z=$.id===M;return V(B,{step:$,isCompleted:U,isCurrent:Z,onComplete:()=>W?.($.id),onDismiss:()=>W?.($.id)},$.id)})}),R===J&&m("div",{className:"text-center text-muted-foreground",children:[V("span",{className:"text-2xl",children:"\u2728"}),V("p",{className:"mt-2",children:"All tips have been addressed!"})]})]})}import{cn as a}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as X,jsxs as E}from"react/jsx-runtime";var r={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function C({items:z}){if(z.length===0)return X("div",{className:"py-8 text-center text-muted-foreground",children:"No tips yet. Start engaging with coaching tips!"});return E("div",{className:"relative",children:[X("div",{className:"absolute top-0 left-4 h-full w-0.5 bg-border"}),X("div",{className:"space-y-4",children:z.map((q)=>{let W=q.step.metadata?.tipId??"default",R=r[W]??r.default;return E("div",{className:"relative flex gap-4 pl-2",children:[X("div",{className:a("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm",q.isCompleted?"bg-green-500 text-white":"bg-muted text-muted-foreground"),children:q.isCompleted?"\u2713":R}),E("div",{className:"flex-1 rounded-lg border bg-card p-3",children:[E("div",{className:"flex items-start justify-between gap-2",children:[E("div",{children:[X("p",{className:"font-medium",children:q.step.title}),X("p",{className:"mt-0.5 text-muted-foreground text-sm",children:q.step.description})]}),q.step.xpReward&&E("span",{className:a("shrink-0 font-medium text-xs",q.isCompleted?"text-green-500":"text-muted-foreground"),children:["+",q.step.xpReward," XP"]})]}),X("div",{className:"mt-2 flex items-center gap-2 text-muted-foreground text-xs",children:q.isCompleted?E("span",{className:"text-green-500",children:["\u2713 Completed",q.completedAt&&` \u2022 ${q.completedAt}`]}):X("span",{children:"Pending action"})})]})]},q.step.id)})})]})}import{Card as c,CardContent as d,CardHeader as t,CardTitle as e}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as Q,jsxs as F}from"react/jsx-runtime";function i({track:z,progress:q}){let W=z.steps.map((Y)=>({step:Y,isCompleted:q.completedStepIds.includes(Y.id),completedAt:q.completedStepIds.includes(Y.id)?"Recently":void 0})).sort((Y,M)=>{if(Y.isCompleted&&!M.isCompleted)return-1;if(!Y.isCompleted&&M.isCompleted)return 1;return 0}),R=W.filter((Y)=>Y.isCompleted).length,J=W.length-R;return F("div",{className:"space-y-6",children:[F("div",{className:"text-center",children:[Q("h2",{className:"font-bold text-xl",children:"Activity Timeline"}),Q("p",{className:"text-muted-foreground",children:"Your coaching journey and tip history"})]}),F("div",{className:"grid grid-cols-2 gap-4",children:[Q(c,{children:F(d,{className:"p-4 text-center",children:[Q("div",{className:"font-bold text-2xl text-green-500",children:R}),Q("div",{className:"text-muted-foreground text-sm",children:"Tips Actioned"})]})}),Q(c,{children:F(d,{className:"p-4 text-center",children:[Q("div",{className:"font-bold text-2xl text-amber-500",children:J}),Q("div",{className:"text-muted-foreground text-sm",children:"Tips Pending"})]})})]}),F(c,{children:[Q(t,{children:F(e,{className:"flex items-center gap-2",children:[Q("span",{children:"\uD83D\uDCDD"}),Q("span",{children:"Coaching Feed"})]})}),Q(d,{children:Q(C,{items:W})})]}),F(c,{children:[Q(t,{children:F(e,{className:"flex items-center gap-2",children:[Q("span",{children:"\uD83D\uDCC8"}),Q("span",{children:"Journey Stats"})]})}),Q(d,{children:F("div",{className:"space-y-4",children:[F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Total Tips"}),Q("span",{className:"font-semibold",children:z.steps.length})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Completed"}),Q("span",{className:"font-semibold text-green-500",children:R})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"XP Earned"}),Q("span",{className:"font-semibold text-orange-500",children:q.xpEarned})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Current Streak"}),Q("span",{className:"font-semibold",children:q.streakDays>0?`\uD83D\uDD25 ${q.streakDays} days`:"Start today!"})]})]})})]})]})}import{useLearningProgress as Zq,ViewTabs as $q}from"@contractspec/example.learning-journey-ui-shared";import{Card as Mq,CardContent as Aq}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as x,useState as Jq}from"react";import{jsx as y,jsxs as Dq}from"react/jsx-runtime";function Uq({track:z,progress:q,onStepComplete:W,onViewChange:R,initialView:J="overview"}){let[Y,M]=Jq(J),{progress:$,completeStep:U}=Zq(z),Z=q??$,h=x((N)=>{M(N),R?.(N)},[R]),s=x((N)=>{if(W)W(N);else U(N)},[W,U]),n=x(()=>{M("steps"),R?.("steps")},[R]);return Dq("div",{className:"space-y-6",children:[y(Mq,{children:y(Aq,{className:"p-4",children:y($q,{currentView:Y,onViewChange:h})})}),(()=>{let N={track:z,progress:Z,onStepComplete:s};switch(Y){case"overview":return y(P,{...N,onStart:n});case"steps":return y(l,{...N});case"progress":return y(g,{...N});case"timeline":return y(i,{...N});default:return y(P,{...N,onStart:n})}})()]})}import{registerDocBlocks as Fq}from"@contractspec/lib.contracts-spec/docs";var Lq=[{id:"docs.examples.learning-journey-ui-coaching",title:"Learning Journey UI \u2014 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
 - Coaching mini-app shell
 - Views: overview, steps, progress, timeline
 - Components: tip card, engagement meter, tip feed
 
 ## Notes
 - Compose using design system components.
-- Keep accessibility and mobile-friendly tap targets.`}];Lq(fq);import{defineExample as yq}from"@contractspec/lib.contracts-spec";var Dq=yq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI \u2014 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:!0,sandbox:{enabled:!0,modes:["playground","markdown"]},studio:{enabled:!0,installable:!0},mcp:{enabled:!0}}}),Fq=Dq;import{defineFeature as Nq}from"@contractspec/lib.contracts-spec";var Ez=Nq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{Fq as example,C as TipFeed,B as TipCard,i as Timeline,l as Steps,g as Progress,P as Overview,Ez as LearningJourneyUiCoachingFeature,k as EngagementMeter,Aq as CoachingMiniApp};
+- Keep accessibility and mobile-friendly tap targets.`}];Fq(Lq);import{defineExample as Nq}from"@contractspec/lib.contracts-spec/examples";var _q=Nq({meta:{key:"examples.learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey Ui Coaching",description:"Contextual coaching UI with tip cards and engagement tracking.",kind:"template",visibility:"experimental",stability:"experimental",owners:["@contractspec-core"],tags:["package","examples","learning-journey-ui-coaching"]},surfaces:{templates:!0,sandbox:{enabled:!0,modes:["playground","specs"]},studio:{enabled:!1,installable:!1},mcp:{enabled:!1}},entrypoints:{packageName:"@contractspec/example.learning-journey-ui-coaching"}}),fq=_q;import{defineFeature as Xq}from"@contractspec/lib.contracts-spec/features";var Dz=Xq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{fq as example,C as TipFeed,B as TipCard,i as Timeline,l as Steps,g as Progress,P as Overview,Dz as LearningJourneyUiCoachingFeature,_q as ExamplesLearningJourneyUiCoachingExample,k as EngagementMeter,Uq as CoachingMiniApp};

package/dist/learning-journey-ui-coaching.feature.js

@@ -1,2 +1,2 @@
 // @bun
-import{defineFeature as g}from"@contractspec/lib.contracts-spec";var j=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{j as LearningJourneyUiCoachingFeature};
+import{defineFeature as g}from"@contractspec/lib.contracts-spec/features";var j=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{j as LearningJourneyUiCoachingFeature};

package/dist/node/example.js

@@ -1 +1 @@
-import{defineExample as g}from"@contractspec/lib.contracts-spec";var h=g({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:!0,sandbox:{enabled:!0,modes:["playground","markdown"]},studio:{enabled:!0,installable:!0},mcp:{enabled:!0}}}),q=h;export{q as default};
+import{defineExample as b}from"@contractspec/lib.contracts-spec/examples";var j=b({meta:{key:"examples.learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey Ui Coaching",description:"Contextual coaching UI with tip cards and engagement tracking.",kind:"template",visibility:"experimental",stability:"experimental",owners:["@contractspec-core"],tags:["package","examples","learning-journey-ui-coaching"]},surfaces:{templates:!0,sandbox:{enabled:!0,modes:["playground","specs"]},studio:{enabled:!1,installable:!1},mcp:{enabled:!1}},entrypoints:{packageName:"@contractspec/example.learning-journey-ui-coaching"}}),t=j;export{t as default,j as ExamplesLearningJourneyUiCoachingExample};

package/dist/node/index.js

@@ -1,8 +1,8 @@
-import{Button as o}from"@contractspec/lib.design-system";import{Card as qq,CardContent as zq}from"@contractspec/lib.ui-kit-web/ui/card";import{cn as j}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as F,jsxs as I}from"react/jsx-runtime";var p={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function B({step:z,isCompleted:q,isCurrent:R,onComplete:Q,onDismiss:M}){let U=z.metadata?.tipId??"default",Z=p[U]??p.default;return F(qq,{className:j("transition-all",q&&"opacity-60",R&&"ring-2 ring-amber-500"),children:F(zq,{className:"p-4",children:I("div",{className:"flex gap-4",children:[F("div",{className:j("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl",q?"bg-green-500/10":R?"bg-amber-500/10":"bg-muted"),children:q?"✓":Z}),I("div",{className:"min-w-0 flex-1",children:[I("div",{className:"flex items-start justify-between gap-2",children:[F("h4",{className:"font-semibold",children:z.title}),z.xpReward&&I("span",{className:j("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs",q?"bg-green-500/10 text-green-500":"bg-amber-500/10 text-amber-500"),children:["+",z.xpReward," XP"]})]}),F("p",{className:"mt-1 text-muted-foreground text-sm",children:z.description}),!q&&I("div",{className:"mt-3 flex flex-wrap gap-2",children:[F(o,{size:"sm",onClick:Q,children:"Take Action"}),F(o,{variant:"outline",size:"sm",onClick:M,children:"Dismiss"})]}),q&&F("p",{className:"mt-2 text-green-500 text-sm",children:"✓ Tip acknowledged"})]})]})})})}import{StreakCounter as Gq,XpBar as Jq}from"@contractspec/example.learning-journey-ui-shared";import{Button as Kq}from"@contractspec/lib.design-system";import{Card as H,CardContent as O,CardHeader as w,CardTitle as u}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as J,jsxs as $}from"react/jsx-runtime";function P({track:z,progress:q,onStepComplete:R,onStart:Q}){let M=z.totalXp??z.steps.reduce((W,V)=>W+(V.xpReward??0),0),U=q.completedStepIds.length,Z=z.steps.length,Y=Z-U,A=z.steps.filter((W)=>!q.completedStepIds.includes(W.id)).slice(0,3);return $("div",{className:"space-y-6",children:[J(H,{className:"overflow-hidden bg-gradient-to-br from-amber-500/10 via-orange-500/10 to-red-500/10",children:J(O,{className:"p-6",children:$("div",{className:"flex flex-col items-center gap-4 text-center md:flex-row md:text-left",children:[J("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-amber-500 to-orange-600 text-3xl shadow-lg",children:"\uD83D\uDCA1"}),$("div",{className:"flex-1",children:[J("h1",{className:"font-bold text-2xl",children:z.name}),J("p",{className:"mt-1 text-muted-foreground",children:z.description})]}),J("div",{className:"flex items-center gap-4",children:J(Gq,{days:q.streakDays,size:"lg"})})]})})}),$("div",{className:"grid gap-4 md:grid-cols-3",children:[$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"Active Tips"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-amber-500",children:Y}),J("p",{className:"text-muted-foreground text-sm",children:"tips for you today"})]})]}),$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"Tips Actioned"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-green-500",children:U}),$("p",{className:"text-muted-foreground text-sm",children:["out of ",Z," total"]})]})]}),$(H,{children:[J(w,{className:"pb-2",children:J(u,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),$(O,{children:[J("div",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),J(Jq,{current:q.xpEarned,max:M,showLabel:!1,size:"sm"})]})]})]}),A.length>0&&$(H,{children:[$(w,{className:"flex flex-row items-center justify-between",children:[$(u,{className:"flex items-center gap-2",children:[J("span",{children:"\uD83D\uDCA1"}),J("span",{children:"Tips for You"})]}),A.length<Y&&$(Kq,{variant:"outline",size:"sm",onClick:Q,children:["View All (",Y,")"]})]}),J(O,{className:"space-y-3",children:A.map((W)=>J(B,{step:W,isCompleted:!1,isCurrent:W.id===A[0]?.id,onComplete:()=>R?.(W.id)},W.id))})]}),Y===0&&J(H,{className:"border-green-500/50 bg-green-500/5",children:$(O,{className:"flex items-center gap-4 p-6",children:[J("div",{className:"text-4xl",children:"\uD83C\uDF89"}),$("div",{children:[J("h3",{className:"font-semibold text-green-500 text-lg",children:"All Tips Actioned!"}),$("p",{className:"text-muted-foreground",children:["Great job! You've addressed all ",Z," coaching tips."]})]})]})})]})}import{jsx as D,jsxs as f}from"react/jsx-runtime";function k({acknowledged:z,actioned:q,pending:R,streak:Q=0}){let M=z+q+R,U=M>0?q/M*100:0,Z=M>0?z/M*100:0;return f("div",{className:"space-y-4",children:[D("div",{className:"flex items-center justify-center",children:f("div",{className:"relative h-32 w-32",children:[f("svg",{className:"h-full w-full -rotate-90",viewBox:"0 0 100 100",children:[D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",className:"stroke-muted"}),D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${U*2.51} 251`,className:"stroke-green-500 transition-all duration-500"}),D("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${Z*2.51} 251`,strokeDashoffset:`${-U*2.51}`,className:"stroke-amber-500 transition-all duration-500"})]}),f("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:[D("span",{className:"font-bold text-2xl",children:M}),D("span",{className:"text-muted-foreground text-xs",children:"tips"})]})]})}),f("div",{className:"flex justify-center gap-4 text-sm",children:[f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-green-500"}),f("span",{children:["Actioned (",q,")"]})]}),f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-amber-500"}),f("span",{children:["Acknowledged (",z,")"]})]}),f("div",{className:"flex items-center gap-1.5",children:[D("div",{className:"h-3 w-3 rounded-full bg-muted"}),f("span",{children:["Pending (",R,")"]})]})]}),Q>0&&f("div",{className:"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",children:[D("span",{className:"text-xl",children:"\uD83D\uDD25"}),f("span",{className:"font-semibold text-orange-500",children:[Q," day engagement streak!"]})]})]})}import{BadgeDisplay as Qq,StreakCounter as Rq,XpBar as Uq}from"@contractspec/example.learning-journey-ui-shared";import{Card as v,CardContent as T,CardHeader as b,CardTitle as S}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as G,jsxs as E}from"react/jsx-runtime";function g({track:z,progress:q}){let R=z.totalXp??z.steps.reduce((A,W)=>A+(W.xpReward??0),0),Q=q.completedStepIds.length,U=z.steps.length-Q,Z=Math.floor(Q*0.7),Y=Q-Z;return E("div",{className:"space-y-6",children:[E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCCA"}),G("span",{children:"Engagement Overview"})]})}),G(T,{children:G(k,{actioned:Z,acknowledged:Y,pending:U,streak:q.streakDays})})]}),E("div",{className:"grid gap-4 md:grid-cols-2",children:[E(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),E(T,{className:"space-y-3",children:[E("div",{className:"flex items-baseline gap-2",children:[G("span",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),E("span",{className:"text-muted-foreground",children:["/ ",R," XP"]})]}),G(Uq,{current:q.xpEarned,max:R,showLabel:!1,size:"lg"})]})]}),E(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"Engagement Streak"})}),G(T,{children:E("div",{className:"flex items-center gap-4",children:[G(Rq,{days:q.streakDays,size:"lg"}),G("div",{className:"text-muted-foreground text-sm",children:q.streakDays>0?"Keep going!":"Start your streak today!"})]})})]})]}),E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83C\uDFC5"}),G("span",{children:"Achievements"})]})}),E(T,{children:[G(Qq,{badges:q.badges,size:"lg",maxVisible:10}),q.badges.length===0&&G("p",{className:"text-muted-foreground text-sm",children:"Action tips to unlock achievements!"})]})]}),E(v,{children:[G(b,{children:E(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCA1"}),G("span",{children:"Tip Status"})]})}),G(T,{children:G("div",{className:"space-y-3",children:z.steps.map((A)=>{let W=q.completedStepIds.includes(A.id);return E("div",{className:"flex items-center justify-between rounded-lg border p-3",children:[E("div",{className:"flex items-center gap-3",children:[G("span",{className:W?"text-green-500":"text-amber-500",children:W?"✓":"○"}),G("span",{className:W?"text-muted-foreground":"text-foreground",children:A.title})]}),G("span",{className:`text-sm ${W?"text-green-500":"text-muted-foreground"}`,children:W?"Actioned":"Pending"})]},A.id)})})})]})]})}import{jsx as h,jsxs as m}from"react/jsx-runtime";function l({track:z,progress:q,onStepComplete:R}){let Q=q.completedStepIds.length,M=z.steps.length,U=[...z.steps].sort((Y,A)=>{let W=q.completedStepIds.includes(Y.id),V=q.completedStepIds.includes(A.id);if(W===V)return 0;return W?1:-1}),Z=z.steps.find((Y)=>!q.completedStepIds.includes(Y.id))?.id;return m("div",{className:"space-y-6",children:[m("div",{className:"text-center",children:[h("h2",{className:"font-bold text-xl",children:"Coaching Tips"}),h("p",{className:"text-muted-foreground",children:"Review and take action on personalized tips"}),m("p",{className:"mt-2 text-muted-foreground text-sm",children:[Q," of ",M," tips actioned"]})]}),h("div",{className:"space-y-3",children:U.map((Y)=>{let A=q.completedStepIds.includes(Y.id),W=Y.id===Z;return h(B,{step:Y,isCompleted:A,isCurrent:W,onComplete:()=>R?.(Y.id),onDismiss:()=>R?.(Y.id)},Y.id)})}),Q===M&&m("div",{className:"text-center text-muted-foreground",children:[h("span",{className:"text-2xl",children:"✨"}),h("p",{className:"mt-2",children:"All tips have been addressed!"})]})]})}import{cn as a}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as N,jsxs as X}from"react/jsx-runtime";var r={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function C({items:z}){if(z.length===0)return N("div",{className:"py-8 text-center text-muted-foreground",children:"No tips yet. Start engaging with coaching tips!"});return X("div",{className:"relative",children:[N("div",{className:"absolute top-0 left-4 h-full w-0.5 bg-border"}),N("div",{className:"space-y-4",children:z.map((q)=>{let R=q.step.metadata?.tipId??"default",Q=r[R]??r.default;return X("div",{className:"relative flex gap-4 pl-2",children:[N("div",{className:a("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm",q.isCompleted?"bg-green-500 text-white":"bg-muted text-muted-foreground"),children:q.isCompleted?"✓":Q}),X("div",{className:"flex-1 rounded-lg border bg-card p-3",children:[X("div",{className:"flex items-start justify-between gap-2",children:[X("div",{children:[N("p",{className:"font-medium",children:q.step.title}),N("p",{className:"mt-0.5 text-muted-foreground text-sm",children:q.step.description})]}),q.step.xpReward&&X("span",{className:a("shrink-0 font-medium text-xs",q.isCompleted?"text-green-500":"text-muted-foreground"),children:["+",q.step.xpReward," XP"]})]}),N("div",{className:"mt-2 flex items-center gap-2 text-muted-foreground text-xs",children:q.isCompleted?X("span",{className:"text-green-500",children:["✓ Completed",q.completedAt&&` • ${q.completedAt}`]}):N("span",{children:"Pending action"})})]})]},q.step.id)})})]})}import{Card as c,CardContent as d,CardHeader as t,CardTitle as e}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as K,jsxs as L}from"react/jsx-runtime";function i({track:z,progress:q}){let R=z.steps.map((U)=>({step:U,isCompleted:q.completedStepIds.includes(U.id),completedAt:q.completedStepIds.includes(U.id)?"Recently":void 0})).sort((U,Z)=>{if(U.isCompleted&&!Z.isCompleted)return-1;if(!U.isCompleted&&Z.isCompleted)return 1;return 0}),Q=R.filter((U)=>U.isCompleted).length,M=R.length-Q;return L("div",{className:"space-y-6",children:[L("div",{className:"text-center",children:[K("h2",{className:"font-bold text-xl",children:"Activity Timeline"}),K("p",{className:"text-muted-foreground",children:"Your coaching journey and tip history"})]}),L("div",{className:"grid grid-cols-2 gap-4",children:[K(c,{children:L(d,{className:"p-4 text-center",children:[K("div",{className:"font-bold text-2xl text-green-500",children:Q}),K("div",{className:"text-muted-foreground text-sm",children:"Tips Actioned"})]})}),K(c,{children:L(d,{className:"p-4 text-center",children:[K("div",{className:"font-bold text-2xl text-amber-500",children:M}),K("div",{className:"text-muted-foreground text-sm",children:"Tips Pending"})]})})]}),L(c,{children:[K(t,{children:L(e,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCDD"}),K("span",{children:"Coaching Feed"})]})}),K(d,{children:K(C,{items:R})})]}),L(c,{children:[K(t,{children:L(e,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCC8"}),K("span",{children:"Journey Stats"})]})}),K(d,{children:L("div",{className:"space-y-4",children:[L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Total Tips"}),K("span",{className:"font-semibold",children:z.steps.length})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Completed"}),K("span",{className:"font-semibold text-green-500",children:Q})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"XP Earned"}),K("span",{className:"font-semibold text-orange-500",children:q.xpEarned})]}),L("div",{className:"flex items-center justify-between",children:[K("span",{className:"text-muted-foreground",children:"Current Streak"}),K("span",{className:"font-semibold",children:q.streakDays>0?`\uD83D\uDD25 ${q.streakDays} days`:"Start today!"})]})]})})]})]})}import{useLearningProgress as Wq,ViewTabs as Yq}from"@contractspec/example.learning-journey-ui-shared";import{Card as Zq,CardContent as $q}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as n,useState as Mq}from"react";import{jsx as _,jsxs as Eq}from"react/jsx-runtime";function Aq({track:z,progress:q,onStepComplete:R,onViewChange:Q,initialView:M="overview"}){let[U,Z]=Mq(M),{progress:Y,completeStep:A}=Wq(z),W=q??Y,V=n((y)=>{Z(y),Q?.(y)},[Q]),s=n((y)=>{if(R)R(y);else A(y)},[R,A]),x=n(()=>{Z("steps"),Q?.("steps")},[Q]);return Eq("div",{className:"space-y-6",children:[_(Zq,{children:_($q,{className:"p-4",children:_(Yq,{currentView:U,onViewChange:V})})}),(()=>{let y={track:z,progress:W,onStepComplete:s};switch(U){case"overview":return _(P,{...y,onStart:x});case"steps":return _(l,{...y});case"progress":return _(g,{...y});case"timeline":return _(i,{...y});default:return _(P,{...y,onStart:x})}})()]})}import{registerDocBlocks as Lq}from"@contractspec/lib.contracts-spec/docs";var fq=[{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
+import{Button as o}from"@contractspec/lib.design-system";import{Card as qq,CardContent as zq}from"@contractspec/lib.ui-kit-web/ui/card";import{cn as j}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as f,jsxs as I}from"react/jsx-runtime";var p={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function B({step:z,isCompleted:q,isCurrent:W,onComplete:R,onDismiss:J}){let Y=z.metadata?.tipId??"default",M=p[Y]??p.default;return f(qq,{className:j("transition-all",q&&"opacity-60",W&&"ring-2 ring-amber-500"),children:f(zq,{className:"p-4",children:I("div",{className:"flex gap-4",children:[f("div",{className:j("flex h-12 w-12 shrink-0 items-center justify-center rounded-xl text-2xl",q?"bg-green-500/10":W?"bg-amber-500/10":"bg-muted"),children:q?"✓":M}),I("div",{className:"min-w-0 flex-1",children:[I("div",{className:"flex items-start justify-between gap-2",children:[f("h4",{className:"font-semibold",children:z.title}),z.xpReward&&I("span",{className:j("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs",q?"bg-green-500/10 text-green-500":"bg-amber-500/10 text-amber-500"),children:["+",z.xpReward," XP"]})]}),f("p",{className:"mt-1 text-muted-foreground text-sm",children:z.description}),!q&&I("div",{className:"mt-3 flex flex-wrap gap-2",children:[f(o,{size:"sm",onClick:R,children:"Take Action"}),f(o,{variant:"outline",size:"sm",onClick:J,children:"Dismiss"})]}),q&&f("p",{className:"mt-2 text-green-500 text-sm",children:"✓ Tip acknowledged"})]})]})})})}import{StreakCounter as Gq,XpBar as Kq}from"@contractspec/example.learning-journey-ui-shared";import{Button as Qq}from"@contractspec/lib.design-system";import{Card as H,CardContent as O,CardHeader as w,CardTitle as u}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as K,jsxs as A}from"react/jsx-runtime";function P({track:z,progress:q,onStepComplete:W,onStart:R}){let J=z.totalXp??z.steps.reduce((Z,h)=>Z+(h.xpReward??0),0),Y=q.completedStepIds.length,M=z.steps.length,$=M-Y,U=z.steps.filter((Z)=>!q.completedStepIds.includes(Z.id)).slice(0,3);return A("div",{className:"space-y-6",children:[K(H,{className:"overflow-hidden bg-gradient-to-br from-amber-500/10 via-orange-500/10 to-red-500/10",children:K(O,{className:"p-6",children:A("div",{className:"flex flex-col items-center gap-4 text-center md:flex-row md:text-left",children:[K("div",{className:"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-amber-500 to-orange-600 text-3xl shadow-lg",children:"\uD83D\uDCA1"}),A("div",{className:"flex-1",children:[K("h1",{className:"font-bold text-2xl",children:z.name}),K("p",{className:"mt-1 text-muted-foreground",children:z.description})]}),K("div",{className:"flex items-center gap-4",children:K(Gq,{days:q.streakDays,size:"lg"})})]})})}),A("div",{className:"grid gap-4 md:grid-cols-3",children:[A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"Active Tips"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-amber-500",children:$}),K("p",{className:"text-muted-foreground text-sm",children:"tips for you today"})]})]}),A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"Tips Actioned"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-green-500",children:Y}),A("p",{className:"text-muted-foreground text-sm",children:["out of ",M," total"]})]})]}),A(H,{children:[K(w,{className:"pb-2",children:K(u,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),A(O,{children:[K("div",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),K(Kq,{current:q.xpEarned,max:J,showLabel:!1,size:"sm"})]})]})]}),U.length>0&&A(H,{children:[A(w,{className:"flex flex-row items-center justify-between",children:[A(u,{className:"flex items-center gap-2",children:[K("span",{children:"\uD83D\uDCA1"}),K("span",{children:"Tips for You"})]}),U.length<$&&A(Qq,{variant:"outline",size:"sm",onClick:R,children:["View All (",$,")"]})]}),K(O,{className:"space-y-3",children:U.map((Z)=>K(B,{step:Z,isCompleted:!1,isCurrent:Z.id===U[0]?.id,onComplete:()=>W?.(Z.id)},Z.id))})]}),$===0&&K(H,{className:"border-green-500/50 bg-green-500/5",children:A(O,{className:"flex items-center gap-4 p-6",children:[K("div",{className:"text-4xl",children:"\uD83C\uDF89"}),A("div",{children:[K("h3",{className:"font-semibold text-green-500 text-lg",children:"All Tips Actioned!"}),A("p",{className:"text-muted-foreground",children:["Great job! You've addressed all ",M," coaching tips."]})]})]})})]})}import{jsx as _,jsxs as L}from"react/jsx-runtime";function k({acknowledged:z,actioned:q,pending:W,streak:R=0}){let J=z+q+W,Y=J>0?q/J*100:0,M=J>0?z/J*100:0;return L("div",{className:"space-y-4",children:[_("div",{className:"flex items-center justify-center",children:L("div",{className:"relative h-32 w-32",children:[L("svg",{className:"h-full w-full -rotate-90",viewBox:"0 0 100 100",children:[_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",className:"stroke-muted"}),_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${Y*2.51} 251`,className:"stroke-green-500 transition-all duration-500"}),_("circle",{cx:"50",cy:"50",r:"40",fill:"none",strokeWidth:"12",strokeLinecap:"round",strokeDasharray:`${M*2.51} 251`,strokeDashoffset:`${-Y*2.51}`,className:"stroke-amber-500 transition-all duration-500"})]}),L("div",{className:"absolute inset-0 flex flex-col items-center justify-center",children:[_("span",{className:"font-bold text-2xl",children:J}),_("span",{className:"text-muted-foreground text-xs",children:"tips"})]})]})}),L("div",{className:"flex justify-center gap-4 text-sm",children:[L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-green-500"}),L("span",{children:["Actioned (",q,")"]})]}),L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-amber-500"}),L("span",{children:["Acknowledged (",z,")"]})]}),L("div",{className:"flex items-center gap-1.5",children:[_("div",{className:"h-3 w-3 rounded-full bg-muted"}),L("span",{children:["Pending (",W,")"]})]})]}),R>0&&L("div",{className:"flex items-center justify-center gap-2 rounded-lg bg-orange-500/10 px-4 py-2",children:[_("span",{className:"text-xl",children:"\uD83D\uDD25"}),L("span",{className:"font-semibold text-orange-500",children:[R," day engagement streak!"]})]})]})}import{BadgeDisplay as Rq,StreakCounter as Wq,XpBar as Yq}from"@contractspec/example.learning-journey-ui-shared";import{Card as v,CardContent as T,CardHeader as b,CardTitle as S}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as G,jsxs as D}from"react/jsx-runtime";function g({track:z,progress:q}){let W=z.totalXp??z.steps.reduce((U,Z)=>U+(Z.xpReward??0),0),R=q.completedStepIds.length,Y=z.steps.length-R,M=Math.floor(R*0.7),$=R-M;return D("div",{className:"space-y-6",children:[D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCCA"}),G("span",{children:"Engagement Overview"})]})}),G(T,{children:G(k,{actioned:M,acknowledged:$,pending:Y,streak:q.streakDays})})]}),D("div",{className:"grid gap-4 md:grid-cols-2",children:[D(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"XP Earned"})}),D(T,{className:"space-y-3",children:[D("div",{className:"flex items-baseline gap-2",children:[G("span",{className:"font-bold text-3xl text-orange-500",children:q.xpEarned}),D("span",{className:"text-muted-foreground",children:["/ ",W," XP"]})]}),G(Yq,{current:q.xpEarned,max:W,showLabel:!1,size:"lg"})]})]}),D(v,{children:[G(b,{className:"pb-2",children:G(S,{className:"font-medium text-muted-foreground text-sm",children:"Engagement Streak"})}),G(T,{children:D("div",{className:"flex items-center gap-4",children:[G(Wq,{days:q.streakDays,size:"lg"}),G("div",{className:"text-muted-foreground text-sm",children:q.streakDays>0?"Keep going!":"Start your streak today!"})]})})]})]}),D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83C\uDFC5"}),G("span",{children:"Achievements"})]})}),D(T,{children:[G(Rq,{badges:q.badges,size:"lg",maxVisible:10}),q.badges.length===0&&G("p",{className:"text-muted-foreground text-sm",children:"Action tips to unlock achievements!"})]})]}),D(v,{children:[G(b,{children:D(S,{className:"flex items-center gap-2",children:[G("span",{children:"\uD83D\uDCA1"}),G("span",{children:"Tip Status"})]})}),G(T,{children:G("div",{className:"space-y-3",children:z.steps.map((U)=>{let Z=q.completedStepIds.includes(U.id);return D("div",{className:"flex items-center justify-between rounded-lg border p-3",children:[D("div",{className:"flex items-center gap-3",children:[G("span",{className:Z?"text-green-500":"text-amber-500",children:Z?"✓":"○"}),G("span",{className:Z?"text-muted-foreground":"text-foreground",children:U.title})]}),G("span",{className:`text-sm ${Z?"text-green-500":"text-muted-foreground"}`,children:Z?"Actioned":"Pending"})]},U.id)})})})]})]})}import{jsx as V,jsxs as m}from"react/jsx-runtime";function l({track:z,progress:q,onStepComplete:W}){let R=q.completedStepIds.length,J=z.steps.length,Y=[...z.steps].sort(($,U)=>{let Z=q.completedStepIds.includes($.id),h=q.completedStepIds.includes(U.id);if(Z===h)return 0;return Z?1:-1}),M=z.steps.find(($)=>!q.completedStepIds.includes($.id))?.id;return m("div",{className:"space-y-6",children:[m("div",{className:"text-center",children:[V("h2",{className:"font-bold text-xl",children:"Coaching Tips"}),V("p",{className:"text-muted-foreground",children:"Review and take action on personalized tips"}),m("p",{className:"mt-2 text-muted-foreground text-sm",children:[R," of ",J," tips actioned"]})]}),V("div",{className:"space-y-3",children:Y.map(($)=>{let U=q.completedStepIds.includes($.id),Z=$.id===M;return V(B,{step:$,isCompleted:U,isCurrent:Z,onComplete:()=>W?.($.id),onDismiss:()=>W?.($.id)},$.id)})}),R===J&&m("div",{className:"text-center text-muted-foreground",children:[V("span",{className:"text-2xl",children:"✨"}),V("p",{className:"mt-2",children:"All tips have been addressed!"})]})]})}import{cn as a}from"@contractspec/lib.ui-kit-web/ui/utils";import{jsx as X,jsxs as E}from"react/jsx-runtime";var r={cash_buffer_too_high:"\uD83D\uDCB0",no_savings_goal:"\uD83C\uDFAF",irregular_savings:"\uD83D\uDCC5",noise_late_evening:"\uD83D\uDD07",guest_frequency_high:"\uD83D\uDC65",shared_space_conflicts:"\uD83C\uDFE0",default:"\uD83D\uDCA1"};function C({items:z}){if(z.length===0)return X("div",{className:"py-8 text-center text-muted-foreground",children:"No tips yet. Start engaging with coaching tips!"});return E("div",{className:"relative",children:[X("div",{className:"absolute top-0 left-4 h-full w-0.5 bg-border"}),X("div",{className:"space-y-4",children:z.map((q)=>{let W=q.step.metadata?.tipId??"default",R=r[W]??r.default;return E("div",{className:"relative flex gap-4 pl-2",children:[X("div",{className:a("relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm",q.isCompleted?"bg-green-500 text-white":"bg-muted text-muted-foreground"),children:q.isCompleted?"✓":R}),E("div",{className:"flex-1 rounded-lg border bg-card p-3",children:[E("div",{className:"flex items-start justify-between gap-2",children:[E("div",{children:[X("p",{className:"font-medium",children:q.step.title}),X("p",{className:"mt-0.5 text-muted-foreground text-sm",children:q.step.description})]}),q.step.xpReward&&E("span",{className:a("shrink-0 font-medium text-xs",q.isCompleted?"text-green-500":"text-muted-foreground"),children:["+",q.step.xpReward," XP"]})]}),X("div",{className:"mt-2 flex items-center gap-2 text-muted-foreground text-xs",children:q.isCompleted?E("span",{className:"text-green-500",children:["✓ Completed",q.completedAt&&` • ${q.completedAt}`]}):X("span",{children:"Pending action"})})]})]},q.step.id)})})]})}import{Card as c,CardContent as d,CardHeader as t,CardTitle as e}from"@contractspec/lib.ui-kit-web/ui/card";import{jsx as Q,jsxs as F}from"react/jsx-runtime";function i({track:z,progress:q}){let W=z.steps.map((Y)=>({step:Y,isCompleted:q.completedStepIds.includes(Y.id),completedAt:q.completedStepIds.includes(Y.id)?"Recently":void 0})).sort((Y,M)=>{if(Y.isCompleted&&!M.isCompleted)return-1;if(!Y.isCompleted&&M.isCompleted)return 1;return 0}),R=W.filter((Y)=>Y.isCompleted).length,J=W.length-R;return F("div",{className:"space-y-6",children:[F("div",{className:"text-center",children:[Q("h2",{className:"font-bold text-xl",children:"Activity Timeline"}),Q("p",{className:"text-muted-foreground",children:"Your coaching journey and tip history"})]}),F("div",{className:"grid grid-cols-2 gap-4",children:[Q(c,{children:F(d,{className:"p-4 text-center",children:[Q("div",{className:"font-bold text-2xl text-green-500",children:R}),Q("div",{className:"text-muted-foreground text-sm",children:"Tips Actioned"})]})}),Q(c,{children:F(d,{className:"p-4 text-center",children:[Q("div",{className:"font-bold text-2xl text-amber-500",children:J}),Q("div",{className:"text-muted-foreground text-sm",children:"Tips Pending"})]})})]}),F(c,{children:[Q(t,{children:F(e,{className:"flex items-center gap-2",children:[Q("span",{children:"\uD83D\uDCDD"}),Q("span",{children:"Coaching Feed"})]})}),Q(d,{children:Q(C,{items:W})})]}),F(c,{children:[Q(t,{children:F(e,{className:"flex items-center gap-2",children:[Q("span",{children:"\uD83D\uDCC8"}),Q("span",{children:"Journey Stats"})]})}),Q(d,{children:F("div",{className:"space-y-4",children:[F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Total Tips"}),Q("span",{className:"font-semibold",children:z.steps.length})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Completed"}),Q("span",{className:"font-semibold text-green-500",children:R})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"XP Earned"}),Q("span",{className:"font-semibold text-orange-500",children:q.xpEarned})]}),F("div",{className:"flex items-center justify-between",children:[Q("span",{className:"text-muted-foreground",children:"Current Streak"}),Q("span",{className:"font-semibold",children:q.streakDays>0?`\uD83D\uDD25 ${q.streakDays} days`:"Start today!"})]})]})})]})]})}import{useLearningProgress as Zq,ViewTabs as $q}from"@contractspec/example.learning-journey-ui-shared";import{Card as Mq,CardContent as Aq}from"@contractspec/lib.ui-kit-web/ui/card";import{useCallback as x,useState as Jq}from"react";import{jsx as y,jsxs as Dq}from"react/jsx-runtime";function Uq({track:z,progress:q,onStepComplete:W,onViewChange:R,initialView:J="overview"}){let[Y,M]=Jq(J),{progress:$,completeStep:U}=Zq(z),Z=q??$,h=x((N)=>{M(N),R?.(N)},[R]),s=x((N)=>{if(W)W(N);else U(N)},[W,U]),n=x(()=>{M("steps"),R?.("steps")},[R]);return Dq("div",{className:"space-y-6",children:[y(Mq,{children:y(Aq,{className:"p-4",children:y($q,{currentView:Y,onViewChange:h})})}),(()=>{let N={track:z,progress:Z,onStepComplete:s};switch(Y){case"overview":return y(P,{...N,onStart:n});case"steps":return y(l,{...N});case"progress":return y(g,{...N});case"timeline":return y(i,{...N});default:return y(P,{...N,onStart:n})}})()]})}import{registerDocBlocks as Fq}from"@contractspec/lib.contracts-spec/docs";var Lq=[{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
 - Coaching mini-app shell
 - Views: overview, steps, progress, timeline
 - Components: tip card, engagement meter, tip feed
 
 ## Notes
 - Compose using design system components.
-- Keep accessibility and mobile-friendly tap targets.`}];Lq(fq);import{defineExample as yq}from"@contractspec/lib.contracts-spec";var Dq=yq({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:!0,sandbox:{enabled:!0,modes:["playground","markdown"]},studio:{enabled:!0,installable:!0},mcp:{enabled:!0}}}),Fq=Dq;import{defineFeature as Nq}from"@contractspec/lib.contracts-spec";var Ez=Nq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{Fq as example,C as TipFeed,B as TipCard,i as Timeline,l as Steps,g as Progress,P as Overview,Ez as LearningJourneyUiCoachingFeature,k as EngagementMeter,Aq as CoachingMiniApp};
+- Keep accessibility and mobile-friendly tap targets.`}];Fq(Lq);import{defineExample as Nq}from"@contractspec/lib.contracts-spec/examples";var _q=Nq({meta:{key:"examples.learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey Ui Coaching",description:"Contextual coaching UI with tip cards and engagement tracking.",kind:"template",visibility:"experimental",stability:"experimental",owners:["@contractspec-core"],tags:["package","examples","learning-journey-ui-coaching"]},surfaces:{templates:!0,sandbox:{enabled:!0,modes:["playground","specs"]},studio:{enabled:!1,installable:!1},mcp:{enabled:!1}},entrypoints:{packageName:"@contractspec/example.learning-journey-ui-coaching"}}),fq=_q;import{defineFeature as Xq}from"@contractspec/lib.contracts-spec/features";var Dz=Xq({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{fq as example,C as TipFeed,B as TipCard,i as Timeline,l as Steps,g as Progress,P as Overview,Dz as LearningJourneyUiCoachingFeature,_q as ExamplesLearningJourneyUiCoachingExample,k as EngagementMeter,Uq as CoachingMiniApp};

package/dist/node/learning-journey-ui-coaching.feature.js

@@ -1 +1 @@
-import{defineFeature as g}from"@contractspec/lib.contracts-spec";var j=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{j as LearningJourneyUiCoachingFeature};
+import{defineFeature as g}from"@contractspec/lib.contracts-spec/features";var j=g({meta:{key:"learning-journey-ui-coaching",version:"1.0.0",title:"Learning Journey UI: Coaching",description:"Coaching UI with tip cards, engagement tracking, and multi-view navigation",domain:"learning-journey",owners:["@examples"],tags:["learning","ui","coaching","tips"],stability:"experimental"},docs:["docs.examples.learning-journey-ui-coaching"]});export{j as LearningJourneyUiCoachingFeature};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@contractspec/example.learning-journey-ui-coaching",
-  "version": "4.0.0",
+  "version": "4.0.2",
   "description": "Contextual coaching UI with tip cards and engagement tracking.",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -127,23 +127,23 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@contractspec/lib.contracts-spec": "5.4.0",
-    "@contractspec/example.learning-journey-ui-shared": "4.0.0",
-    "@contractspec/example.learning-journey-ambient-coach": "4.0.0",
-    "@contractspec/example.learning-journey-crm-onboarding": "4.0.0",
-    "@contractspec/module.learning-journey": "4.0.0",
-    "@contractspec/lib.design-system": "3.10.0",
-    "@contractspec/lib.ui-kit-web": "3.10.1",
+    "@contractspec/lib.contracts-spec": "5.5.0",
+    "@contractspec/example.learning-journey-ui-shared": "4.0.2",
+    "@contractspec/example.learning-journey-ambient-coach": "4.0.1",
+    "@contractspec/example.learning-journey-crm-onboarding": "4.0.2",
+    "@contractspec/module.learning-journey": "4.0.1",
+    "@contractspec/lib.design-system": "3.11.0",
+    "@contractspec/lib.ui-kit-web": "3.10.3",
     "react": "19.2.0"
   },
   "devDependencies": {
     "@contractspec/tool.typescript": "3.7.13",
     "@types/react": "^19.2.14",
     "typescript": "^5.9.3",
-    "@contractspec/tool.bun": "3.7.14"
+    "@contractspec/tool.bun": "3.7.15"
   },
   "peerDependencies": {
-    "react": "^19.2.4"
+    "react": "19.2.0"
   },
   "publishConfig": {
     "exports": {

package/src/example.ts

@@ -1,31 +1,28 @@
-import { defineExample } from '@contractspec/lib.contracts-spec';
+import { defineExample } from '@contractspec/lib.contracts-spec/examples';
 
-const example = defineExample({
+const ExamplesLearningJourneyUiCoachingExample = defineExample({
 	meta: {
-		key: 'learning-journey-ui-coaching',
+		key: 'examples.learning-journey-ui-coaching',
 		version: '1.0.0',
-		title: 'Learning Journey UI — Coaching',
+		title: 'Learning Journey Ui Coaching',
 		description:
-			'UI mini-app for coaching patterns: tips, engagement meter, progress.',
-		kind: 'ui',
-		visibility: 'public',
+			'Contextual coaching UI with tip cards and engagement tracking.',
+		kind: 'template',
+		visibility: 'experimental',
 		stability: 'experimental',
-		owners: ['@platform.core'],
-		tags: ['learning', 'ui', 'coaching'],
+		owners: ['@contractspec-core'],
+		tags: ['package', 'examples', 'learning-journey-ui-coaching'],
 	},
-	docs: {
-		rootDocId: 'docs.examples.learning-journey-ui-coaching',
+	surfaces: {
+		templates: true,
+		sandbox: { enabled: true, modes: ['playground', 'specs'] },
+		studio: { enabled: false, installable: false },
+		mcp: { enabled: false },
 	},
 	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 },
 	},
 });
 
-export default example;
+export default ExamplesLearningJourneyUiCoachingExample;
+export { ExamplesLearningJourneyUiCoachingExample };

package/src/index.ts

@@ -7,3 +7,5 @@ export * from './learning-journey-ui-coaching.feature';
 // Views
 export { Overview, Progress, Steps, Timeline } from './views';
 import './docs';
+
+export * from './example';

package/src/learning-journey-ui-coaching.feature.ts

@@ -1,4 +1,4 @@
-import { defineFeature } from '@contractspec/lib.contracts-spec';
+import { defineFeature } from '@contractspec/lib.contracts-spec/features';
 
 export const LearningJourneyUiCoachingFeature = defineFeature({
 	meta: {