@contractspec/example.learning-journey-ui-onboarding 3.7.5 → 3.7.7

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.
Files changed (57) hide show
  1. package/.turbo/turbo-build.log +3 -3
  2. package/AGENTS.md +50 -24
  3. package/CHANGELOG.md +15 -0
  4. package/README.md +66 -26
  5. package/dist/OnboardingMiniApp.js +280 -280
  6. package/dist/browser/OnboardingMiniApp.js +280 -280
  7. package/dist/browser/components/CodeSnippet.js +4 -4
  8. package/dist/browser/components/JourneyMap.js +1 -1
  9. package/dist/browser/components/StepChecklist.js +6 -6
  10. package/dist/browser/components/index.js +11 -11
  11. package/dist/browser/index.js +285 -284
  12. package/dist/browser/views/Overview.js +14 -14
  13. package/dist/browser/views/Progress.js +9 -9
  14. package/dist/browser/views/Steps.js +8 -8
  15. package/dist/browser/views/Timeline.js +6 -6
  16. package/dist/browser/views/index.js +276 -276
  17. package/dist/components/CodeSnippet.js +4 -4
  18. package/dist/components/JourneyMap.js +1 -1
  19. package/dist/components/StepChecklist.js +6 -6
  20. package/dist/components/index.d.ts +1 -1
  21. package/dist/components/index.js +11 -11
  22. package/dist/index.d.ts +4 -4
  23. package/dist/index.js +285 -284
  24. package/dist/node/OnboardingMiniApp.js +280 -280
  25. package/dist/node/components/CodeSnippet.js +4 -4
  26. package/dist/node/components/JourneyMap.js +1 -1
  27. package/dist/node/components/StepChecklist.js +6 -6
  28. package/dist/node/components/index.js +11 -11
  29. package/dist/node/index.js +285 -284
  30. package/dist/node/views/Overview.js +14 -14
  31. package/dist/node/views/Progress.js +9 -9
  32. package/dist/node/views/Steps.js +8 -8
  33. package/dist/node/views/Timeline.js +6 -6
  34. package/dist/node/views/index.js +276 -276
  35. package/dist/views/Overview.js +14 -14
  36. package/dist/views/Progress.js +9 -9
  37. package/dist/views/Steps.js +8 -8
  38. package/dist/views/Timeline.js +6 -6
  39. package/dist/views/index.d.ts +1 -1
  40. package/dist/views/index.js +276 -276
  41. package/package.json +13 -13
  42. package/src/OnboardingMiniApp.tsx +70 -70
  43. package/src/components/CodeSnippet.tsx +43 -43
  44. package/src/components/JourneyMap.tsx +70 -70
  45. package/src/components/StepChecklist.tsx +118 -118
  46. package/src/components/index.ts +1 -1
  47. package/src/docs/learning-journey-ui-onboarding.docblock.ts +11 -11
  48. package/src/example.ts +25 -25
  49. package/src/index.ts +5 -6
  50. package/src/learning-journey-ui-onboarding.feature.ts +12 -12
  51. package/src/views/Overview.tsx +182 -182
  52. package/src/views/Progress.tsx +167 -167
  53. package/src/views/Steps.tsx +79 -79
  54. package/src/views/Timeline.tsx +126 -126
  55. package/src/views/index.ts +1 -1
  56. package/tsconfig.json +7 -8
  57. package/tsdown.config.js +7 -13
package/dist/views/Overview.js CHANGED
@@ -1,5 +1,6 @@
1
1
  // @bun
2
2
  // src/views/Overview.tsx
3
+ import { XpBar } from "@contractspec/example.learning-journey-ui-shared";
3
4
  import { Button } from "@contractspec/lib.design-system";
4
5
  import {
5
6
  Card,
@@ -8,7 +9,6 @@ import {
8
9
  CardTitle
9
10
  } from "@contractspec/lib.ui-kit-web/ui/card";
10
11
  import { Progress } from "@contractspec/lib.ui-kit-web/ui/progress";
11
- import { XpBar } from "@contractspec/example.learning-journey-ui-shared";
12
12
  import { jsxDEV } from "react/jsx-dev-runtime";
13
13
  "use client";
14
14
  function Overview({
@@ -41,15 +41,15 @@ function Overview({
41
41
  className: "flex-1",
42
42
  children: [
43
43
  /* @__PURE__ */ jsxDEV("h1", {
44
- className: "text-2xl font-bold",
44
+ className: "font-bold text-2xl",
45
45
  children: track.name
46
46
  }, undefined, false, undefined, this),
47
47
  /* @__PURE__ */ jsxDEV("p", {
48
- className: "text-muted-foreground mt-1 max-w-2xl",
48
+ className: "mt-1 max-w-2xl text-muted-foreground",
49
49
  children: track.description
50
50
  }, undefined, false, undefined, this),
51
51
  !isComplete && /* @__PURE__ */ jsxDEV("p", {
52
- className: "text-muted-foreground mt-3 text-sm",
52
+ className: "mt-3 text-muted-foreground text-sm",
53
53
  children: [
54
54
  "\u23F1\uFE0F Estimated time:",
55
55
  " ",
@@ -75,14 +75,14 @@ function Overview({
75
75
  /* @__PURE__ */ jsxDEV(CardHeader, {
76
76
  className: "pb-2",
77
77
  children: /* @__PURE__ */ jsxDEV(CardTitle, {
78
- className: "text-muted-foreground text-sm font-medium",
78
+ className: "font-medium text-muted-foreground text-sm",
79
79
  children: "Progress"
80
80
  }, undefined, false, undefined, this)
81
81
  }, undefined, false, undefined, this),
82
82
  /* @__PURE__ */ jsxDEV(CardContent, {
83
83
  children: [
84
84
  /* @__PURE__ */ jsxDEV("div", {
85
- className: "text-3xl font-bold",
85
+ className: "font-bold text-3xl",
86
86
  children: [
87
87
  Math.round(percentComplete),
88
88
  "%"
@@ -93,7 +93,7 @@ function Overview({
93
93
  className: "mt-2 h-2"
94
94
  }, undefined, false, undefined, this),
95
95
  /* @__PURE__ */ jsxDEV("p", {
96
- className: "text-muted-foreground mt-2 text-sm",
96
+ className: "mt-2 text-muted-foreground text-sm",
97
97
  children: [
98
98
  completedSteps,
99
99
  " of ",
@@ -110,14 +110,14 @@ function Overview({
110
110
  /* @__PURE__ */ jsxDEV(CardHeader, {
111
111
  className: "pb-2",
112
112
  children: /* @__PURE__ */ jsxDEV(CardTitle, {
113
- className: "text-muted-foreground text-sm font-medium",
113
+ className: "font-medium text-muted-foreground text-sm",
114
114
  children: "XP Earned"
115
115
  }, undefined, false, undefined, this)
116
116
  }, undefined, false, undefined, this),
117
117
  /* @__PURE__ */ jsxDEV(CardContent, {
118
118
  children: [
119
119
  /* @__PURE__ */ jsxDEV("div", {
120
- className: "text-3xl font-bold text-blue-500",
120
+ className: "font-bold text-3xl text-blue-500",
121
121
  children: progress.xpEarned
122
122
  }, undefined, false, undefined, this),
123
123
  /* @__PURE__ */ jsxDEV(XpBar, {
@@ -135,18 +135,18 @@ function Overview({
135
135
  /* @__PURE__ */ jsxDEV(CardHeader, {
136
136
  className: "pb-2",
137
137
  children: /* @__PURE__ */ jsxDEV(CardTitle, {
138
- className: "text-muted-foreground text-sm font-medium",
138
+ className: "font-medium text-muted-foreground text-sm",
139
139
  children: "Time Remaining"
140
140
  }, undefined, false, undefined, this)
141
141
  }, undefined, false, undefined, this),
142
142
  /* @__PURE__ */ jsxDEV(CardContent, {
143
143
  children: [
144
144
  /* @__PURE__ */ jsxDEV("div", {
145
- className: "text-3xl font-bold",
145
+ className: "font-bold text-3xl",
146
146
  children: isComplete ? "\u2713" : `~${estimatedMinutes}m`
147
147
  }, undefined, false, undefined, this),
148
148
  /* @__PURE__ */ jsxDEV("p", {
149
- className: "text-muted-foreground mt-2 text-sm",
149
+ className: "mt-2 text-muted-foreground text-sm",
150
150
  children: isComplete ? "All done!" : `${remainingSteps} steps to go`
151
151
  }, undefined, false, undefined, this)
152
152
  ]
@@ -180,7 +180,7 @@ function Overview({
180
180
  className: "flex items-center gap-4 rounded-lg border p-3",
181
181
  children: [
182
182
  /* @__PURE__ */ jsxDEV("div", {
183
- className: `flex h-8 w-8 shrink-0 items-center justify-center rounded-full text-sm font-semibold ${isStepCompleted ? "bg-green-500 text-white" : isCurrent ? "bg-blue-500 text-white" : "bg-muted text-muted-foreground"}`,
183
+ className: `flex h-8 w-8 shrink-0 items-center justify-center rounded-full font-semibold text-sm ${isStepCompleted ? "bg-green-500 text-white" : isCurrent ? "bg-blue-500 text-white" : "bg-muted text-muted-foreground"}`,
184
184
  children: isStepCompleted ? "\u2713" : index + 1
185
185
  }, undefined, false, undefined, this),
186
186
  /* @__PURE__ */ jsxDEV("div", {
@@ -217,7 +217,7 @@ function Overview({
217
217
  /* @__PURE__ */ jsxDEV("div", {
218
218
  children: [
219
219
  /* @__PURE__ */ jsxDEV("h3", {
220
- className: "text-lg font-semibold text-green-500",
220
+ className: "font-semibold text-green-500 text-lg",
221
221
  children: "Onboarding Complete!"
222
222
  }, undefined, false, undefined, this),
223
223
  /* @__PURE__ */ jsxDEV("p", {
package/dist/views/Progress.js CHANGED
@@ -1,5 +1,9 @@
1
1
  // @bun
2
2
  // src/views/Progress.tsx
3
+ import {
4
+ BadgeDisplay,
5
+ XpBar
6
+ } from "@contractspec/example.learning-journey-ui-shared";
3
7
  import {
4
8
  Card,
5
9
  CardContent,
@@ -7,10 +11,6 @@ import {
7
11
  CardTitle
8
12
  } from "@contractspec/lib.ui-kit-web/ui/card";
9
13
  import { Progress } from "@contractspec/lib.ui-kit-web/ui/progress";
10
- import {
11
- XpBar,
12
- BadgeDisplay
13
- } from "@contractspec/example.learning-journey-ui-shared";
14
14
  import { jsxDEV } from "react/jsx-dev-runtime";
15
15
  "use client";
16
16
  function ProgressView({ track, progress }) {
@@ -74,7 +74,7 @@ function ProgressView({ track, progress }) {
74
74
  className: "text-center",
75
75
  children: [
76
76
  /* @__PURE__ */ jsxDEV("div", {
77
- className: "text-3xl font-bold",
77
+ className: "font-bold text-3xl",
78
78
  children: [
79
79
  Math.round(percentComplete),
80
80
  "%"
@@ -95,7 +95,7 @@ function ProgressView({ track, progress }) {
95
95
  /* @__PURE__ */ jsxDEV("div", {
96
96
  children: [
97
97
  /* @__PURE__ */ jsxDEV("div", {
98
- className: "text-2xl font-bold text-green-500",
98
+ className: "font-bold text-2xl text-green-500",
99
99
  children: completedSteps
100
100
  }, undefined, false, undefined, this),
101
101
  /* @__PURE__ */ jsxDEV("div", {
@@ -107,7 +107,7 @@ function ProgressView({ track, progress }) {
107
107
  /* @__PURE__ */ jsxDEV("div", {
108
108
  children: [
109
109
  /* @__PURE__ */ jsxDEV("div", {
110
- className: "text-2xl font-bold text-orange-500",
110
+ className: "font-bold text-2xl text-orange-500",
111
111
  children: remainingSteps
112
112
  }, undefined, false, undefined, this),
113
113
  /* @__PURE__ */ jsxDEV("div", {
@@ -119,7 +119,7 @@ function ProgressView({ track, progress }) {
119
119
  /* @__PURE__ */ jsxDEV("div", {
120
120
  children: [
121
121
  /* @__PURE__ */ jsxDEV("div", {
122
- className: "text-2xl font-bold",
122
+ className: "font-bold text-2xl",
123
123
  children: [
124
124
  estimatedMinutes,
125
125
  "m"
@@ -159,7 +159,7 @@ function ProgressView({ track, progress }) {
159
159
  className: "flex items-baseline gap-2",
160
160
  children: [
161
161
  /* @__PURE__ */ jsxDEV("span", {
162
- className: "text-3xl font-bold text-blue-500",
162
+ className: "font-bold text-3xl text-blue-500",
163
163
  children: progress.xpEarned
164
164
  }, undefined, false, undefined, this),
165
165
  /* @__PURE__ */ jsxDEV("span", {
package/dist/views/Steps.js CHANGED
@@ -22,7 +22,7 @@ function StepChecklist({
22
22
  onClick: onToggle,
23
23
  children: [
24
24
  /* @__PURE__ */ jsxDEV("div", {
25
- className: cn("flex h-8 w-8 shrink-0 items-center justify-center rounded-full border-2 text-sm font-semibold transition-colors", isCompleted && "border-green-500 bg-green-500 text-white", isCurrent && !isCompleted && "border-violet-500 text-violet-500", !isCompleted && !isCurrent && "border-muted-foreground text-muted-foreground"),
25
+ className: cn("flex h-8 w-8 shrink-0 items-center justify-center rounded-full border-2 font-semibold text-sm transition-colors", isCompleted && "border-green-500 bg-green-500 text-white", isCurrent && !isCompleted && "border-violet-500 text-violet-500", !isCompleted && !isCurrent && "border-muted-foreground text-muted-foreground"),
26
26
  children: isCompleted ? "\u2713" : stepNumber
27
27
  }, undefined, false, undefined, this),
28
28
  /* @__PURE__ */ jsxDEV("div", {
@@ -33,13 +33,13 @@ function StepChecklist({
33
33
  children: step.title
34
34
  }, undefined, false, undefined, this),
35
35
  !isExpanded && step.description && /* @__PURE__ */ jsxDEV("p", {
36
- className: "text-muted-foreground truncate text-sm",
36
+ className: "truncate text-muted-foreground text-sm",
37
37
  children: step.description
38
38
  }, undefined, false, undefined, this)
39
39
  ]
40
40
  }, undefined, true, undefined, this),
41
41
  step.xpReward && /* @__PURE__ */ jsxDEV("span", {
42
- className: cn("shrink-0 rounded-full px-2 py-1 text-xs font-semibold", isCompleted ? "bg-green-500/10 text-green-500" : "bg-muted text-muted-foreground"),
42
+ className: cn("shrink-0 rounded-full px-2 py-1 font-semibold text-xs", isCompleted ? "bg-green-500/10 text-green-500" : "bg-muted text-muted-foreground"),
43
43
  children: [
44
44
  "+",
45
45
  step.xpReward,
@@ -56,14 +56,14 @@ function StepChecklist({
56
56
  className: "border-t px-4 py-4",
57
57
  children: [
58
58
  step.description && /* @__PURE__ */ jsxDEV("p", {
59
- className: "text-muted-foreground mb-4",
59
+ className: "mb-4 text-muted-foreground",
60
60
  children: step.description
61
61
  }, undefined, false, undefined, this),
62
62
  step.instructions && /* @__PURE__ */ jsxDEV("div", {
63
- className: "bg-muted mb-4 rounded-lg p-4",
63
+ className: "mb-4 rounded-lg bg-muted p-4",
64
64
  children: [
65
65
  /* @__PURE__ */ jsxDEV("p", {
66
- className: "mb-2 text-sm font-medium",
66
+ className: "mb-2 font-medium text-sm",
67
67
  children: "Instructions:"
68
68
  }, undefined, false, undefined, this),
69
69
  /* @__PURE__ */ jsxDEV("p", {
@@ -95,8 +95,8 @@ function StepChecklist({
95
95
  }
96
96
 
97
97
  // src/views/Steps.tsx
98
- import { useState } from "react";
99
98
  import { Progress } from "@contractspec/lib.ui-kit-web/ui/progress";
99
+ import { useState } from "react";
100
100
  import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
101
101
  "use client";
102
102
  function Steps({ track, progress, onStepComplete }) {
@@ -118,7 +118,7 @@ function Steps({ track, progress, onStepComplete }) {
118
118
  className: "flex items-center justify-between",
119
119
  children: [
120
120
  /* @__PURE__ */ jsxDEV2("h2", {
121
- className: "text-xl font-bold",
121
+ className: "font-bold text-xl",
122
122
  children: "Complete Each Step"
123
123
  }, undefined, false, undefined, this),
124
124
  /* @__PURE__ */ jsxDEV2("span", {
package/dist/views/Timeline.js CHANGED
@@ -40,7 +40,7 @@ function JourneyMap({
40
40
  /* @__PURE__ */ jsxDEV("div", {
41
41
  className: "text-center",
42
42
  children: /* @__PURE__ */ jsxDEV("p", {
43
- className: cn("max-w-[100px] truncate text-xs font-medium", isCompleted && "text-green-500", isCurrent && !isCompleted && "text-violet-500", !isCompleted && !isCurrent && "text-muted-foreground"),
43
+ className: cn("max-w-[100px] truncate font-medium text-xs", isCompleted && "text-green-500", isCurrent && !isCompleted && "text-violet-500", !isCompleted && !isCurrent && "text-muted-foreground"),
44
44
  children: step.title
45
45
  }, undefined, false, undefined, this)
46
46
  }, undefined, false, undefined, this)
@@ -74,7 +74,7 @@ function Timeline({ track, progress }) {
74
74
  className: "text-center",
75
75
  children: [
76
76
  /* @__PURE__ */ jsxDEV2("h2", {
77
- className: "text-xl font-bold",
77
+ className: "font-bold text-xl",
78
78
  children: "Your Learning Journey"
79
79
  }, undefined, false, undefined, this),
80
80
  /* @__PURE__ */ jsxDEV2("p", {
@@ -127,7 +127,7 @@ function Timeline({ track, progress }) {
127
127
  className: "relative",
128
128
  children: [
129
129
  /* @__PURE__ */ jsxDEV2("div", {
130
- className: "bg-border absolute top-0 left-4 h-full w-0.5"
130
+ className: "absolute top-0 left-4 h-full w-0.5 bg-border"
131
131
  }, undefined, false, undefined, this),
132
132
  /* @__PURE__ */ jsxDEV2("div", {
133
133
  className: "space-y-6",
@@ -160,19 +160,19 @@ function Timeline({ track, progress }) {
160
160
  children: step.title
161
161
  }, undefined, false, undefined, this),
162
162
  /* @__PURE__ */ jsxDEV2("span", {
163
- className: "bg-muted text-muted-foreground rounded px-2 py-0.5 text-xs",
163
+ className: "rounded bg-muted px-2 py-0.5 text-muted-foreground text-xs",
164
164
  children: surface
165
165
  }, undefined, false, undefined, this)
166
166
  ]
167
167
  }, undefined, true, undefined, this),
168
168
  /* @__PURE__ */ jsxDEV2("p", {
169
- className: "text-muted-foreground mt-1 text-sm",
169
+ className: "mt-1 text-muted-foreground text-sm",
170
170
  children: step.description
171
171
  }, undefined, false, undefined, this)
172
172
  ]
173
173
  }, undefined, true, undefined, this),
174
174
  step.xpReward && /* @__PURE__ */ jsxDEV2("span", {
175
- className: `shrink-0 rounded-full px-2 py-1 text-xs font-semibold ${isCompleted ? "bg-green-500/10 text-green-500" : "bg-muted text-muted-foreground"}`,
175
+ className: `shrink-0 rounded-full px-2 py-1 font-semibold text-xs ${isCompleted ? "bg-green-500/10 text-green-500" : "bg-muted text-muted-foreground"}`,
176
176
  children: [
177
177
  "+",
178
178
  step.xpReward,
package/dist/views/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  export { Overview } from './Overview';
2
- export { Steps } from './Steps';
3
2
  export { Progress } from './Progress';
3
+ export { Steps } from './Steps';
4
4
  export { Timeline } from './Timeline';