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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,11 +2,11 @@ $ contractspec-bun-build prebuild
2
2
  $ bun run build:bundle && bun run build:types
3
3
  $ contractspec-bun-build transpile
4
4
  [contractspec-bun-build] transpile target=bun root=src entries=15 noBundle=false
5
- Bundled 15 modules in 22ms
5
+ Bundled 15 modules in 28ms
6
6
 
7
7
  ./CoachingMiniApp.js 15.65 KB (entry point)
8
- ./index.js 17.53 KB (entry point)
9
- ./learning-journey-ui-coaching.feature.js 481 bytes (entry point)
8
+ ./index.js 17.55 KB (entry point)
9
+ ./learning-journey-ui-coaching.feature.js 490 bytes (entry point)
10
10
  views/index.js 14.75 KB (entry point)
11
11
  views/Overview.js 4.78 KB (entry point)
12
12
  views/Progress.js 4.61 KB (entry point)
@@ -18,14 +18,14 @@ Bundled 15 modules in 22ms
18
18
  components/TipFeed.js 1.80 KB (entry point)
19
19
  docs/index.js 0.64 KB (entry point)
20
20
  docs/learning-journey-ui-coaching.docblock.js 0.64 KB (entry point)
21
- ./example.js 0.69 KB (entry point)
21
+ ./example.js 0.71 KB (entry point)
22
22
 
23
23
  [contractspec-bun-build] transpile target=node root=src entries=15 noBundle=false
24
- Bundled 15 modules in 19ms
24
+ Bundled 15 modules in 23ms
25
25
 
26
26
  ./CoachingMiniApp.js 15.62 KB (entry point)
27
- ./index.js 17.49 KB (entry point)
28
- ./learning-journey-ui-coaching.feature.js 473 bytes (entry point)
27
+ ./index.js 17.52 KB (entry point)
28
+ ./learning-journey-ui-coaching.feature.js 482 bytes (entry point)
29
29
  views/index.js 14.72 KB (entry point)
30
30
  views/Overview.js 4.76 KB (entry point)
31
31
  views/Progress.js 4.60 KB (entry point)
@@ -37,14 +37,14 @@ Bundled 15 modules in 19ms
37
37
  components/TipFeed.js 1.78 KB (entry point)
38
38
  docs/index.js 0.62 KB (entry point)
39
39
  docs/learning-journey-ui-coaching.docblock.js 0.62 KB (entry point)
40
- ./example.js 0.68 KB (entry point)
40
+ ./example.js 0.70 KB (entry point)
41
41
 
42
42
  [contractspec-bun-build] transpile target=browser root=src entries=15 noBundle=false
43
- Bundled 15 modules in 30ms
43
+ Bundled 15 modules in 19ms
44
44
 
45
45
  ./CoachingMiniApp.js 15.62 KB (entry point)
46
- ./index.js 17.49 KB (entry point)
47
- ./learning-journey-ui-coaching.feature.js 473 bytes (entry point)
46
+ ./index.js 17.52 KB (entry point)
47
+ ./learning-journey-ui-coaching.feature.js 482 bytes (entry point)
48
48
  views/index.js 14.72 KB (entry point)
49
49
  views/Overview.js 4.76 KB (entry point)
50
50
  views/Progress.js 4.60 KB (entry point)
@@ -56,6 +56,6 @@ Bundled 15 modules in 30ms
56
56
  components/TipFeed.js 1.78 KB (entry point)
57
57
  docs/index.js 0.62 KB (entry point)
58
58
  docs/learning-journey-ui-coaching.docblock.js 0.62 KB (entry point)
59
- ./example.js 0.68 KB (entry point)
59
+ ./example.js 0.70 KB (entry point)
60
60
 
61
61
  $ contractspec-bun-build types
package/CHANGELOG.md CHANGED
@@ -1,5 +1,60 @@
1
1
  # @contractspec/example.learning-journey-ui-coaching
2
2
 
3
+ ## 4.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - chore: auto-bump internal dependents
8
+ - Updated dependencies because of chore: auto-bump internal dependents
9
+ - 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.
10
+ - 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.
11
+ - Updated dependencies because of Add FormSpec layout hints, semantic field rendering, and portable text/textarea input-group addons.
12
+ - Updated dependencies because of Keep design-system FormRender mobile-safe by preserving shared renderer imports for Metro aliases and hardening generated package artifacts.
13
+ - 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.
14
+ - 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.
15
+ - @contractspec/example.learning-journey-ambient-coach@4.0.1
16
+ - @contractspec/example.learning-journey-crm-onboarding@4.0.2
17
+ - @contractspec/example.learning-journey-ui-shared@4.0.2
18
+ - @contractspec/module.learning-journey@4.0.1
19
+ - @contractspec/lib.design-system@3.11.0
20
+ - @contractspec/lib.contracts-spec@5.5.0
21
+ - @contractspec/lib.ui-kit-web@3.10.3
22
+
23
+ ## 4.0.1
24
+
25
+ ### Patch Changes
26
+
27
+ - chore: auto-bump internal dependents
28
+ - Updated dependencies because of chore: auto-bump internal dependents
29
+ - @contractspec/example.learning-journey-crm-onboarding@4.0.1
30
+ - @contractspec/example.learning-journey-ui-shared@4.0.1
31
+ - @contractspec/lib.design-system@3.10.1
32
+ - @contractspec/lib.ui-kit-web@3.10.2
33
+
34
+ ## 4.0.0
35
+
36
+ ### Major Changes
37
+
38
+ - Redesign the learning system around the adaptive journey runtime and repair shared learning sandbox presentation wiring.
39
+ - Packages: @contractspec/module.learning-journey (major), @contractspec/module.examples (patch), @contractspec/example.learning-journey-ambient-coach (major), @contractspec/example.learning-journey-crm-onboarding (major), @contractspec/example.learning-journey-duo-drills (major), @contractspec/example.learning-journey-platform-tour (major), @contractspec/example.learning-journey-quest-challenges (major), @contractspec/example.learning-journey-registry (major), @contractspec/example.learning-journey-studio-onboarding (major), @contractspec/example.learning-journey-ui-coaching (major), @contractspec/example.learning-journey-ui-gamified (major), @contractspec/example.learning-journey-ui-onboarding (major), @contractspec/example.learning-journey-ui-shared (major), @contractspec/example.learning-patterns (major)
40
+ - Migration: Replace the old onboarding-centric learning contracts and local example progress logic with the canonical adaptive `learning.journey.*` runtime.; Use the shared learning registry mapping/data helpers so supported learning sandbox templates resolve the shared presentation set consistently.
41
+
42
+ ### Patch Changes
43
+
44
+ - Updated dependencies because of Add a family-aware ContractSpec Adoption Engine, expand contract authoring targets across CLI and VS Code tooling, and refresh release-facing schema and policy artifacts for downstream workspaces.
45
+ - Updated dependencies because of Improve app-config, theme, and feature authoring with explicit validation APIs, first-class theme discovery and scaffolding, and key-based app-config generation across contracts, workspace tooling, and the CLI.
46
+ - Updated dependencies because of Harden the shared data-table stack and add a first-class composed toolbar for search, filter chips, selection summary, and hidden-column recovery.
47
+ - Updated dependencies because of Refresh root, package, website, and LLM-facing docs so Connect, Builder, release capsules, and the current contracts-spec export surface stay aligned.
48
+ - Updated dependencies because of Persist canonical knowledge payload text during indexing and align the retrieval/query docs with the corrected behavior.
49
+ - Updated dependencies because of Redesign the learning system around the adaptive journey runtime and repair shared learning sandbox presentation wiring.
50
+ - @contractspec/lib.contracts-spec@5.4.0
51
+ - @contractspec/lib.design-system@3.10.0
52
+ - @contractspec/lib.ui-kit-web@3.10.1
53
+ - @contractspec/module.learning-journey@4.0.0
54
+ - @contractspec/example.learning-journey-ambient-coach@4.0.0
55
+ - @contractspec/example.learning-journey-crm-onboarding@4.0.0
56
+ - @contractspec/example.learning-journey-ui-shared@4.0.0
57
+
3
58
  ## 3.7.19
4
59
 
5
60
  ### Patch Changes
@@ -1 +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};
1
+ 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};
@@ -1,8 +1,8 @@
1
- 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
1
+ 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
2
2
  - Coaching mini-app shell
3
3
  - Views: overview, steps, progress, timeline
4
4
  - Components: tip card, engagement meter, tip feed
5
5
 
6
6
  ## Notes
7
7
  - Compose using design system components.
8
- - 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};
8
+ - 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};
@@ -1 +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};
1
+ 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};
@@ -1,6 +1,6 @@
1
- import type { LearningJourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
1
+ import type { JourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
2
2
  interface TipCardProps {
3
- step: LearningJourneyStepSpec;
3
+ step: JourneyStepSpec;
4
4
  isCompleted: boolean;
5
5
  isCurrent: boolean;
6
6
  onComplete?: () => void;
@@ -1,6 +1,6 @@
1
- import type { LearningJourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
1
+ import type { JourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
2
2
  interface TipFeedItem {
3
- step: LearningJourneyStepSpec;
3
+ step: JourneyStepSpec;
4
4
  isCompleted: boolean;
5
5
  completedAt?: string;
6
6
  }
package/dist/example.d.ts CHANGED
@@ -1,2 +1,3 @@
1
- declare const example: import("@contractspec/lib.contracts-spec").ExampleSpec;
2
- export default example;
1
+ declare const ExamplesLearningJourneyUiCoachingExample: import("@contractspec/lib.contracts-spec").ExampleSpec;
2
+ export default ExamplesLearningJourneyUiCoachingExample;
3
+ export { ExamplesLearningJourneyUiCoachingExample };
package/dist/example.js CHANGED
@@ -1,2 +1,2 @@
1
1
  // @bun
2
- 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};
2
+ 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 CHANGED
@@ -4,3 +4,4 @@ export { default as example } from './example';
4
4
  export * from './learning-journey-ui-coaching.feature';
5
5
  export { Overview, Progress, Steps, Timeline } from './views';
6
6
  import './docs';
7
+ export * from './example';
package/dist/index.js CHANGED
@@ -1,9 +1,9 @@
1
1
  // @bun
2
- 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
2
+ 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
3
3
  - Coaching mini-app shell
4
4
  - Views: overview, steps, progress, timeline
5
5
  - Components: tip card, engagement meter, tip feed
6
6
 
7
7
  ## Notes
8
8
  - Compose using design system components.
9
- - 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};
9
+ - 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};
@@ -1,2 +1,2 @@
1
1
  // @bun
2
- 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};
2
+ 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};
@@ -1 +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};
1
+ 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};
@@ -1,8 +1,8 @@
1
- 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
1
+ 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
2
2
  - Coaching mini-app shell
3
3
  - Views: overview, steps, progress, timeline
4
4
  - Components: tip card, engagement meter, tip feed
5
5
 
6
6
  ## Notes
7
7
  - Compose using design system components.
8
- - 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};
8
+ - 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};
@@ -1 +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};
1
+ 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 CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@contractspec/example.learning-journey-ui-coaching",
3
- "version": "3.7.19",
3
+ "version": "4.0.2",
4
4
  "description": "Contextual coaching UI with tip cards and engagement tracking.",
5
5
  "type": "module",
6
6
  "types": "./dist/index.d.ts",
@@ -127,23 +127,23 @@
127
127
  "typecheck": "tsc --noEmit"
128
128
  },
129
129
  "dependencies": {
130
- "@contractspec/lib.contracts-spec": "5.3.0",
131
- "@contractspec/example.learning-journey-ui-shared": "3.7.19",
132
- "@contractspec/example.learning-journey-ambient-coach": "3.7.19",
133
- "@contractspec/example.learning-journey-crm-onboarding": "3.7.19",
134
- "@contractspec/module.learning-journey": "3.7.18",
135
- "@contractspec/lib.design-system": "3.9.0",
136
- "@contractspec/lib.ui-kit-web": "3.10.0",
130
+ "@contractspec/lib.contracts-spec": "5.5.0",
131
+ "@contractspec/example.learning-journey-ui-shared": "4.0.2",
132
+ "@contractspec/example.learning-journey-ambient-coach": "4.0.1",
133
+ "@contractspec/example.learning-journey-crm-onboarding": "4.0.2",
134
+ "@contractspec/module.learning-journey": "4.0.1",
135
+ "@contractspec/lib.design-system": "3.11.0",
136
+ "@contractspec/lib.ui-kit-web": "3.10.3",
137
137
  "react": "19.2.0"
138
138
  },
139
139
  "devDependencies": {
140
140
  "@contractspec/tool.typescript": "3.7.13",
141
141
  "@types/react": "^19.2.14",
142
142
  "typescript": "^5.9.3",
143
- "@contractspec/tool.bun": "3.7.14"
143
+ "@contractspec/tool.bun": "3.7.15"
144
144
  },
145
145
  "peerDependencies": {
146
- "react": "^19.2.4"
146
+ "react": "19.2.0"
147
147
  },
148
148
  "publishConfig": {
149
149
  "exports": {
@@ -3,10 +3,10 @@
3
3
  import { Button } from '@contractspec/lib.design-system';
4
4
  import { Card, CardContent } from '@contractspec/lib.ui-kit-web/ui/card';
5
5
  import { cn } from '@contractspec/lib.ui-kit-web/ui/utils';
6
- import type { LearningJourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
6
+ import type { JourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
7
7
 
8
8
  interface TipCardProps {
9
- step: LearningJourneyStepSpec;
9
+ step: JourneyStepSpec;
10
10
  isCompleted: boolean;
11
11
  isCurrent: boolean;
12
12
  onComplete?: () => void;
@@ -1,10 +1,10 @@
1
1
  'use client';
2
2
 
3
3
  import { cn } from '@contractspec/lib.ui-kit-web/ui/utils';
4
- import type { LearningJourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
4
+ import type { JourneyStepSpec } from '@contractspec/module.learning-journey/track-spec';
5
5
 
6
6
  interface TipFeedItem {
7
- step: LearningJourneyStepSpec;
7
+ step: JourneyStepSpec;
8
8
  isCompleted: boolean;
9
9
  completedAt?: string;
10
10
  }
package/src/example.ts CHANGED
@@ -1,31 +1,28 @@
1
- import { defineExample } from '@contractspec/lib.contracts-spec';
1
+ import { defineExample } from '@contractspec/lib.contracts-spec/examples';
2
2
 
3
- const example = defineExample({
3
+ const ExamplesLearningJourneyUiCoachingExample = defineExample({
4
4
  meta: {
5
- key: 'learning-journey-ui-coaching',
5
+ key: 'examples.learning-journey-ui-coaching',
6
6
  version: '1.0.0',
7
- title: 'Learning Journey UI Coaching',
7
+ title: 'Learning Journey Ui Coaching',
8
8
  description:
9
- 'UI mini-app for coaching patterns: tips, engagement meter, progress.',
10
- kind: 'ui',
11
- visibility: 'public',
9
+ 'Contextual coaching UI with tip cards and engagement tracking.',
10
+ kind: 'template',
11
+ visibility: 'experimental',
12
12
  stability: 'experimental',
13
- owners: ['@platform.core'],
14
- tags: ['learning', 'ui', 'coaching'],
13
+ owners: ['@contractspec-core'],
14
+ tags: ['package', 'examples', 'learning-journey-ui-coaching'],
15
15
  },
16
- docs: {
17
- rootDocId: 'docs.examples.learning-journey-ui-coaching',
16
+ surfaces: {
17
+ templates: true,
18
+ sandbox: { enabled: true, modes: ['playground', 'specs'] },
19
+ studio: { enabled: false, installable: false },
20
+ mcp: { enabled: false },
18
21
  },
19
22
  entrypoints: {
20
23
  packageName: '@contractspec/example.learning-journey-ui-coaching',
21
- docs: './docs',
22
- },
23
- surfaces: {
24
- templates: true,
25
- sandbox: { enabled: true, modes: ['playground', 'markdown'] },
26
- studio: { enabled: true, installable: true },
27
- mcp: { enabled: true },
28
24
  },
29
25
  });
30
26
 
31
- export default example;
27
+ export default ExamplesLearningJourneyUiCoachingExample;
28
+ export { ExamplesLearningJourneyUiCoachingExample };
package/src/index.ts CHANGED
@@ -7,3 +7,5 @@ export * from './learning-journey-ui-coaching.feature';
7
7
  // Views
8
8
  export { Overview, Progress, Steps, Timeline } from './views';
9
9
  import './docs';
10
+
11
+ export * from './example';
@@ -1,4 +1,4 @@
1
- import { defineFeature } from '@contractspec/lib.contracts-spec';
1
+ import { defineFeature } from '@contractspec/lib.contracts-spec/features';
2
2
 
3
3
  export const LearningJourneyUiCoachingFeature = defineFeature({
4
4
  meta: {