@contractspec/example.learning-journey-ui-coaching 3.7.6 → 3.7.10
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.
- package/.turbo/turbo-build.log +3 -3
- package/AGENTS.md +50 -25
- package/CHANGELOG.md +32 -0
- package/README.md +63 -20
- package/dist/CoachingMiniApp.js +178 -178
- package/dist/browser/CoachingMiniApp.js +178 -178
- package/dist/browser/components/EngagementMeter.js +2 -2
- package/dist/browser/components/TipCard.js +3 -3
- package/dist/browser/components/TipFeed.js +6 -6
- package/dist/browser/components/index.js +11 -11
- package/dist/browser/index.js +179 -178
- package/dist/browser/views/Overview.js +16 -16
- package/dist/browser/views/Progress.js +10 -10
- package/dist/browser/views/Steps.js +6 -6
- package/dist/browser/views/Timeline.js +9 -9
- package/dist/browser/views/index.js +174 -174
- package/dist/components/EngagementMeter.js +2 -2
- package/dist/components/TipCard.js +3 -3
- package/dist/components/TipFeed.js +6 -6
- package/dist/components/index.d.ts +1 -1
- package/dist/components/index.js +11 -11
- package/dist/index.d.ts +3 -3
- package/dist/index.js +179 -178
- package/dist/node/CoachingMiniApp.js +178 -178
- package/dist/node/components/EngagementMeter.js +2 -2
- package/dist/node/components/TipCard.js +3 -3
- package/dist/node/components/TipFeed.js +6 -6
- package/dist/node/components/index.js +11 -11
- package/dist/node/index.js +179 -178
- package/dist/node/views/Overview.js +16 -16
- package/dist/node/views/Progress.js +10 -10
- package/dist/node/views/Steps.js +6 -6
- package/dist/node/views/Timeline.js +9 -9
- package/dist/node/views/index.js +174 -174
- package/dist/views/Overview.js +16 -16
- package/dist/views/Progress.js +10 -10
- package/dist/views/Steps.js +6 -6
- package/dist/views/Timeline.js +9 -9
- package/dist/views/index.d.ts +1 -1
- package/dist/views/index.js +174 -174
- package/package.json +12 -12
- package/src/CoachingMiniApp.tsx +70 -70
- package/src/components/EngagementMeter.tsx +82 -82
- package/src/components/TipCard.tsx +81 -81
- package/src/components/TipFeed.tsx +80 -80
- package/src/components/index.ts +1 -1
- package/src/docs/learning-journey-ui-coaching.docblock.ts +10 -10
- package/src/example.ts +25 -25
- package/src/index.ts +4 -6
- package/src/learning-journey-ui-coaching.feature.ts +12 -12
- package/src/views/Overview.tsx +136 -136
- package/src/views/Progress.tsx +146 -146
- package/src/views/Steps.tsx +57 -57
- package/src/views/Timeline.tsx +101 -101
- package/src/views/index.ts +1 -1
- package/tsconfig.json +7 -8
- package/tsdown.config.js +7 -13
|
@@ -44,7 +44,7 @@ function TipCard({
|
|
|
44
44
|
children: step.title
|
|
45
45
|
}, undefined, false, undefined, this),
|
|
46
46
|
step.xpReward && /* @__PURE__ */ jsxDEV("span", {
|
|
47
|
-
className: cn("shrink-0 rounded-full px-2 py-0.5 text-xs
|
|
47
|
+
className: cn("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs", isCompleted ? "bg-green-500/10 text-green-500" : "bg-amber-500/10 text-amber-500"),
|
|
48
48
|
children: [
|
|
49
49
|
"+",
|
|
50
50
|
step.xpReward,
|
|
@@ -54,7 +54,7 @@ function TipCard({
|
|
|
54
54
|
]
|
|
55
55
|
}, undefined, true, undefined, this),
|
|
56
56
|
/* @__PURE__ */ jsxDEV("p", {
|
|
57
|
-
className: "text-muted-foreground
|
|
57
|
+
className: "mt-1 text-muted-foreground text-sm",
|
|
58
58
|
children: step.description
|
|
59
59
|
}, undefined, false, undefined, this),
|
|
60
60
|
!isCompleted && /* @__PURE__ */ jsxDEV("div", {
|
|
@@ -74,7 +74,7 @@ function TipCard({
|
|
|
74
74
|
]
|
|
75
75
|
}, undefined, true, undefined, this),
|
|
76
76
|
isCompleted && /* @__PURE__ */ jsxDEV("p", {
|
|
77
|
-
className: "mt-2 text-
|
|
77
|
+
className: "mt-2 text-green-500 text-sm",
|
|
78
78
|
children: "✓ Tip acknowledged"
|
|
79
79
|
}, undefined, false, undefined, this)
|
|
80
80
|
]
|
|
@@ -86,6 +86,10 @@ function TipCard({
|
|
|
86
86
|
}
|
|
87
87
|
|
|
88
88
|
// src/views/Overview.tsx
|
|
89
|
+
import {
|
|
90
|
+
StreakCounter,
|
|
91
|
+
XpBar
|
|
92
|
+
} from "@contractspec/example.learning-journey-ui-shared";
|
|
89
93
|
import { Button as Button2 } from "@contractspec/lib.design-system";
|
|
90
94
|
import {
|
|
91
95
|
Card as Card2,
|
|
@@ -93,10 +97,6 @@ import {
|
|
|
93
97
|
CardHeader,
|
|
94
98
|
CardTitle
|
|
95
99
|
} from "@contractspec/lib.ui-kit-web/ui/card";
|
|
96
|
-
import {
|
|
97
|
-
XpBar,
|
|
98
|
-
StreakCounter
|
|
99
|
-
} from "@contractspec/example.learning-journey-ui-shared";
|
|
100
100
|
import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
|
|
101
101
|
"use client";
|
|
102
102
|
function Overview({
|
|
@@ -128,11 +128,11 @@ function Overview({
|
|
|
128
128
|
className: "flex-1",
|
|
129
129
|
children: [
|
|
130
130
|
/* @__PURE__ */ jsxDEV2("h1", {
|
|
131
|
-
className: "text-2xl
|
|
131
|
+
className: "font-bold text-2xl",
|
|
132
132
|
children: track.name
|
|
133
133
|
}, undefined, false, undefined, this),
|
|
134
134
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
135
|
-
className: "text-muted-foreground
|
|
135
|
+
className: "mt-1 text-muted-foreground",
|
|
136
136
|
children: track.description
|
|
137
137
|
}, undefined, false, undefined, this)
|
|
138
138
|
]
|
|
@@ -156,14 +156,14 @@ function Overview({
|
|
|
156
156
|
/* @__PURE__ */ jsxDEV2(CardHeader, {
|
|
157
157
|
className: "pb-2",
|
|
158
158
|
children: /* @__PURE__ */ jsxDEV2(CardTitle, {
|
|
159
|
-
className: "text-muted-foreground text-sm
|
|
159
|
+
className: "font-medium text-muted-foreground text-sm",
|
|
160
160
|
children: "Active Tips"
|
|
161
161
|
}, undefined, false, undefined, this)
|
|
162
162
|
}, undefined, false, undefined, this),
|
|
163
163
|
/* @__PURE__ */ jsxDEV2(CardContent2, {
|
|
164
164
|
children: [
|
|
165
165
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
166
|
-
className: "
|
|
166
|
+
className: "font-bold text-3xl text-amber-500",
|
|
167
167
|
children: pendingSteps
|
|
168
168
|
}, undefined, false, undefined, this),
|
|
169
169
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
@@ -179,14 +179,14 @@ function Overview({
|
|
|
179
179
|
/* @__PURE__ */ jsxDEV2(CardHeader, {
|
|
180
180
|
className: "pb-2",
|
|
181
181
|
children: /* @__PURE__ */ jsxDEV2(CardTitle, {
|
|
182
|
-
className: "text-muted-foreground text-sm
|
|
182
|
+
className: "font-medium text-muted-foreground text-sm",
|
|
183
183
|
children: "Tips Actioned"
|
|
184
184
|
}, undefined, false, undefined, this)
|
|
185
185
|
}, undefined, false, undefined, this),
|
|
186
186
|
/* @__PURE__ */ jsxDEV2(CardContent2, {
|
|
187
187
|
children: [
|
|
188
188
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
189
|
-
className: "
|
|
189
|
+
className: "font-bold text-3xl text-green-500",
|
|
190
190
|
children: completedSteps
|
|
191
191
|
}, undefined, false, undefined, this),
|
|
192
192
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
@@ -206,14 +206,14 @@ function Overview({
|
|
|
206
206
|
/* @__PURE__ */ jsxDEV2(CardHeader, {
|
|
207
207
|
className: "pb-2",
|
|
208
208
|
children: /* @__PURE__ */ jsxDEV2(CardTitle, {
|
|
209
|
-
className: "text-muted-foreground text-sm
|
|
209
|
+
className: "font-medium text-muted-foreground text-sm",
|
|
210
210
|
children: "XP Earned"
|
|
211
211
|
}, undefined, false, undefined, this)
|
|
212
212
|
}, undefined, false, undefined, this),
|
|
213
213
|
/* @__PURE__ */ jsxDEV2(CardContent2, {
|
|
214
214
|
children: [
|
|
215
215
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
216
|
-
className: "
|
|
216
|
+
className: "font-bold text-3xl text-orange-500",
|
|
217
217
|
children: progress.xpEarned
|
|
218
218
|
}, undefined, false, undefined, this),
|
|
219
219
|
/* @__PURE__ */ jsxDEV2(XpBar, {
|
|
@@ -279,7 +279,7 @@ function Overview({
|
|
|
279
279
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
280
280
|
children: [
|
|
281
281
|
/* @__PURE__ */ jsxDEV2("h3", {
|
|
282
|
-
className: "
|
|
282
|
+
className: "font-semibold text-green-500 text-lg",
|
|
283
283
|
children: "All Tips Actioned!"
|
|
284
284
|
}, undefined, false, undefined, this),
|
|
285
285
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
@@ -57,7 +57,7 @@ function EngagementMeter({
|
|
|
57
57
|
className: "absolute inset-0 flex flex-col items-center justify-center",
|
|
58
58
|
children: [
|
|
59
59
|
/* @__PURE__ */ jsxDEV("span", {
|
|
60
|
-
className: "text-2xl
|
|
60
|
+
className: "font-bold text-2xl",
|
|
61
61
|
children: total
|
|
62
62
|
}, undefined, false, undefined, this),
|
|
63
63
|
/* @__PURE__ */ jsxDEV("span", {
|
|
@@ -106,7 +106,7 @@ function EngagementMeter({
|
|
|
106
106
|
className: "flex items-center gap-1.5",
|
|
107
107
|
children: [
|
|
108
108
|
/* @__PURE__ */ jsxDEV("div", {
|
|
109
|
-
className: "
|
|
109
|
+
className: "h-3 w-3 rounded-full bg-muted"
|
|
110
110
|
}, undefined, false, undefined, this),
|
|
111
111
|
/* @__PURE__ */ jsxDEV("span", {
|
|
112
112
|
children: [
|
|
@@ -140,17 +140,17 @@ function EngagementMeter({
|
|
|
140
140
|
}
|
|
141
141
|
|
|
142
142
|
// src/views/Progress.tsx
|
|
143
|
+
import {
|
|
144
|
+
BadgeDisplay,
|
|
145
|
+
StreakCounter,
|
|
146
|
+
XpBar
|
|
147
|
+
} from "@contractspec/example.learning-journey-ui-shared";
|
|
143
148
|
import {
|
|
144
149
|
Card,
|
|
145
150
|
CardContent,
|
|
146
151
|
CardHeader,
|
|
147
152
|
CardTitle
|
|
148
153
|
} from "@contractspec/lib.ui-kit-web/ui/card";
|
|
149
|
-
import {
|
|
150
|
-
XpBar,
|
|
151
|
-
BadgeDisplay,
|
|
152
|
-
StreakCounter
|
|
153
|
-
} from "@contractspec/example.learning-journey-ui-shared";
|
|
154
154
|
import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
|
|
155
155
|
"use client";
|
|
156
156
|
function ProgressView({ track, progress }) {
|
|
@@ -196,7 +196,7 @@ function ProgressView({ track, progress }) {
|
|
|
196
196
|
/* @__PURE__ */ jsxDEV2(CardHeader, {
|
|
197
197
|
className: "pb-2",
|
|
198
198
|
children: /* @__PURE__ */ jsxDEV2(CardTitle, {
|
|
199
|
-
className: "text-muted-foreground text-sm
|
|
199
|
+
className: "font-medium text-muted-foreground text-sm",
|
|
200
200
|
children: "XP Earned"
|
|
201
201
|
}, undefined, false, undefined, this)
|
|
202
202
|
}, undefined, false, undefined, this),
|
|
@@ -207,7 +207,7 @@ function ProgressView({ track, progress }) {
|
|
|
207
207
|
className: "flex items-baseline gap-2",
|
|
208
208
|
children: [
|
|
209
209
|
/* @__PURE__ */ jsxDEV2("span", {
|
|
210
|
-
className: "
|
|
210
|
+
className: "font-bold text-3xl text-orange-500",
|
|
211
211
|
children: progress.xpEarned
|
|
212
212
|
}, undefined, false, undefined, this),
|
|
213
213
|
/* @__PURE__ */ jsxDEV2("span", {
|
|
@@ -235,7 +235,7 @@ function ProgressView({ track, progress }) {
|
|
|
235
235
|
/* @__PURE__ */ jsxDEV2(CardHeader, {
|
|
236
236
|
className: "pb-2",
|
|
237
237
|
children: /* @__PURE__ */ jsxDEV2(CardTitle, {
|
|
238
|
-
className: "text-muted-foreground text-sm
|
|
238
|
+
className: "font-medium text-muted-foreground text-sm",
|
|
239
239
|
children: "Engagement Streak"
|
|
240
240
|
}, undefined, false, undefined, this)
|
|
241
241
|
}, undefined, false, undefined, this),
|
|
@@ -44,7 +44,7 @@ function TipCard({
|
|
|
44
44
|
children: step.title
|
|
45
45
|
}, undefined, false, undefined, this),
|
|
46
46
|
step.xpReward && /* @__PURE__ */ jsxDEV("span", {
|
|
47
|
-
className: cn("shrink-0 rounded-full px-2 py-0.5 text-xs
|
|
47
|
+
className: cn("shrink-0 rounded-full px-2 py-0.5 font-semibold text-xs", isCompleted ? "bg-green-500/10 text-green-500" : "bg-amber-500/10 text-amber-500"),
|
|
48
48
|
children: [
|
|
49
49
|
"+",
|
|
50
50
|
step.xpReward,
|
|
@@ -54,7 +54,7 @@ function TipCard({
|
|
|
54
54
|
]
|
|
55
55
|
}, undefined, true, undefined, this),
|
|
56
56
|
/* @__PURE__ */ jsxDEV("p", {
|
|
57
|
-
className: "text-muted-foreground
|
|
57
|
+
className: "mt-1 text-muted-foreground text-sm",
|
|
58
58
|
children: step.description
|
|
59
59
|
}, undefined, false, undefined, this),
|
|
60
60
|
!isCompleted && /* @__PURE__ */ jsxDEV("div", {
|
|
@@ -74,7 +74,7 @@ function TipCard({
|
|
|
74
74
|
]
|
|
75
75
|
}, undefined, true, undefined, this),
|
|
76
76
|
isCompleted && /* @__PURE__ */ jsxDEV("p", {
|
|
77
|
-
className: "mt-2 text-
|
|
77
|
+
className: "mt-2 text-green-500 text-sm",
|
|
78
78
|
children: "✓ Tip acknowledged"
|
|
79
79
|
}, undefined, false, undefined, this)
|
|
80
80
|
]
|
|
@@ -106,7 +106,7 @@ function Steps({ track, progress, onStepComplete }) {
|
|
|
106
106
|
className: "text-center",
|
|
107
107
|
children: [
|
|
108
108
|
/* @__PURE__ */ jsxDEV2("h2", {
|
|
109
|
-
className: "text-xl
|
|
109
|
+
className: "font-bold text-xl",
|
|
110
110
|
children: "Coaching Tips"
|
|
111
111
|
}, undefined, false, undefined, this),
|
|
112
112
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
@@ -114,7 +114,7 @@ function Steps({ track, progress, onStepComplete }) {
|
|
|
114
114
|
children: "Review and take action on personalized tips"
|
|
115
115
|
}, undefined, false, undefined, this),
|
|
116
116
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
117
|
-
className: "text-muted-foreground
|
|
117
|
+
className: "mt-2 text-muted-foreground text-sm",
|
|
118
118
|
children: [
|
|
119
119
|
completedSteps,
|
|
120
120
|
" of ",
|
|
@@ -139,7 +139,7 @@ function Steps({ track, progress, onStepComplete }) {
|
|
|
139
139
|
})
|
|
140
140
|
}, undefined, false, undefined, this),
|
|
141
141
|
completedSteps === totalSteps && /* @__PURE__ */ jsxDEV2("div", {
|
|
142
|
-
className: "text-muted-foreground
|
|
142
|
+
className: "text-center text-muted-foreground",
|
|
143
143
|
children: [
|
|
144
144
|
/* @__PURE__ */ jsxDEV2("span", {
|
|
145
145
|
className: "text-2xl",
|
|
@@ -14,7 +14,7 @@ var TIP_ICONS = {
|
|
|
14
14
|
function TipFeed({ items }) {
|
|
15
15
|
if (items.length === 0) {
|
|
16
16
|
return /* @__PURE__ */ jsxDEV("div", {
|
|
17
|
-
className: "
|
|
17
|
+
className: "py-8 text-center text-muted-foreground",
|
|
18
18
|
children: "No tips yet. Start engaging with coaching tips!"
|
|
19
19
|
}, undefined, false, undefined, this);
|
|
20
20
|
}
|
|
@@ -22,7 +22,7 @@ function TipFeed({ items }) {
|
|
|
22
22
|
className: "relative",
|
|
23
23
|
children: [
|
|
24
24
|
/* @__PURE__ */ jsxDEV("div", {
|
|
25
|
-
className: "
|
|
25
|
+
className: "absolute top-0 left-4 h-full w-0.5 bg-border"
|
|
26
26
|
}, undefined, false, undefined, this),
|
|
27
27
|
/* @__PURE__ */ jsxDEV("div", {
|
|
28
28
|
className: "space-y-4",
|
|
@@ -37,7 +37,7 @@ function TipFeed({ items }) {
|
|
|
37
37
|
children: item.isCompleted ? "✓" : icon
|
|
38
38
|
}, undefined, false, undefined, this),
|
|
39
39
|
/* @__PURE__ */ jsxDEV("div", {
|
|
40
|
-
className: "
|
|
40
|
+
className: "flex-1 rounded-lg border bg-card p-3",
|
|
41
41
|
children: [
|
|
42
42
|
/* @__PURE__ */ jsxDEV("div", {
|
|
43
43
|
className: "flex items-start justify-between gap-2",
|
|
@@ -49,13 +49,13 @@ function TipFeed({ items }) {
|
|
|
49
49
|
children: item.step.title
|
|
50
50
|
}, undefined, false, undefined, this),
|
|
51
51
|
/* @__PURE__ */ jsxDEV("p", {
|
|
52
|
-
className: "
|
|
52
|
+
className: "mt-0.5 text-muted-foreground text-sm",
|
|
53
53
|
children: item.step.description
|
|
54
54
|
}, undefined, false, undefined, this)
|
|
55
55
|
]
|
|
56
56
|
}, undefined, true, undefined, this),
|
|
57
57
|
item.step.xpReward && /* @__PURE__ */ jsxDEV("span", {
|
|
58
|
-
className: cn("shrink-0 text-xs
|
|
58
|
+
className: cn("shrink-0 font-medium text-xs", item.isCompleted ? "text-green-500" : "text-muted-foreground"),
|
|
59
59
|
children: [
|
|
60
60
|
"+",
|
|
61
61
|
item.step.xpReward,
|
|
@@ -65,7 +65,7 @@ function TipFeed({ items }) {
|
|
|
65
65
|
]
|
|
66
66
|
}, undefined, true, undefined, this),
|
|
67
67
|
/* @__PURE__ */ jsxDEV("div", {
|
|
68
|
-
className: "
|
|
68
|
+
className: "mt-2 flex items-center gap-2 text-muted-foreground text-xs",
|
|
69
69
|
children: item.isCompleted ? /* @__PURE__ */ jsxDEV("span", {
|
|
70
70
|
className: "text-green-500",
|
|
71
71
|
children: [
|
|
@@ -116,7 +116,7 @@ function Timeline({ track, progress }) {
|
|
|
116
116
|
className: "text-center",
|
|
117
117
|
children: [
|
|
118
118
|
/* @__PURE__ */ jsxDEV2("h2", {
|
|
119
|
-
className: "text-xl
|
|
119
|
+
className: "font-bold text-xl",
|
|
120
120
|
children: "Activity Timeline"
|
|
121
121
|
}, undefined, false, undefined, this),
|
|
122
122
|
/* @__PURE__ */ jsxDEV2("p", {
|
|
@@ -133,7 +133,7 @@ function Timeline({ track, progress }) {
|
|
|
133
133
|
className: "p-4 text-center",
|
|
134
134
|
children: [
|
|
135
135
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
136
|
-
className: "
|
|
136
|
+
className: "font-bold text-2xl text-green-500",
|
|
137
137
|
children: completedCount
|
|
138
138
|
}, undefined, false, undefined, this),
|
|
139
139
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
@@ -148,7 +148,7 @@ function Timeline({ track, progress }) {
|
|
|
148
148
|
className: "p-4 text-center",
|
|
149
149
|
children: [
|
|
150
150
|
/* @__PURE__ */ jsxDEV2("div", {
|
|
151
|
-
className: "
|
|
151
|
+
className: "font-bold text-2xl text-amber-500",
|
|
152
152
|
children: pendingCount
|
|
153
153
|
}, undefined, false, undefined, this),
|
|
154
154
|
/* @__PURE__ */ jsxDEV2("div", {
|