@lssm/example.learning-journey-ui-onboarding 0.0.0-canary-20251217083314 → 1.41.0

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 (129) hide show
  1. package/.turbo/turbo-build.log +22 -24
  2. package/dist/JourneyMap-iX1Y4ZFM.mjs +2033 -0
  3. package/dist/components/index.d.mts +2 -0
  4. package/dist/components/index.mjs +4 -0
  5. package/dist/{components/CodeSnippet.js → components-OUN5S2z0.mjs} +3 -5
  6. package/dist/index-BNYp4weX.d.mts +33 -0
  7. package/dist/index-BsbXKz4M.d.mts +48 -0
  8. package/dist/{example.d.ts → index.d.mts} +18 -1
  9. package/dist/index.mjs +1698 -0
  10. package/dist/views/index.d.mts +2 -0
  11. package/dist/views/index.mjs +4 -0
  12. package/dist/views-CoPP-P4F.mjs +504 -0
  13. package/package.json +14 -28
  14. package/tsconfig.tsbuildinfo +1 -1
  15. package/tsdown.config.js +10 -14
  16. package/.turbo/turbo-build$colon$bundle.log +0 -405
  17. package/CHANGELOG.md +0 -20
  18. package/dist/OnboardingMiniApp.d.ts +0 -16
  19. package/dist/OnboardingMiniApp.js +0 -64
  20. package/dist/components/CodeSnippet.d.ts +0 -15
  21. package/dist/components/JourneyMap.d.ts +0 -16
  22. package/dist/components/JourneyMap.js +0 -48
  23. package/dist/components/StepChecklist.d.ts +0 -24
  24. package/dist/components/StepChecklist.js +0 -79
  25. package/dist/components/index.d.ts +0 -4
  26. package/dist/components/index.js +0 -5
  27. package/dist/docs/index.d.ts +0 -1
  28. package/dist/docs/index.js +0 -1
  29. package/dist/docs/learning-journey-ui-onboarding.docblock.d.ts +0 -1
  30. package/dist/docs/learning-journey-ui-onboarding.docblock.js +0 -20
  31. package/dist/example.js +0 -34
  32. package/dist/examples/learning-journey-ui-shared/dist/components/BadgeDisplay.js +0 -44
  33. package/dist/examples/learning-journey-ui-shared/dist/components/StreakCounter.js +0 -4
  34. package/dist/examples/learning-journey-ui-shared/dist/components/ViewTabs.js +0 -48
  35. package/dist/examples/learning-journey-ui-shared/dist/components/XpBar.js +0 -46
  36. package/dist/examples/learning-journey-ui-shared/dist/components/index.js +0 -4
  37. package/dist/examples/learning-journey-ui-shared/dist/docs/index.js +0 -1
  38. package/dist/examples/learning-journey-ui-shared/dist/docs/learning-journey-ui-shared.docblock.js +0 -20
  39. package/dist/examples/learning-journey-ui-shared/dist/hooks/index.js +0 -1
  40. package/dist/examples/learning-journey-ui-shared/dist/hooks/useLearningProgress.js +0 -73
  41. package/dist/examples/learning-journey-ui-shared/dist/index.js +0 -8
  42. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/PUBLISHING.docblock.js +0 -15
  43. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/accessibility_wcag_compliance_specs.docblock.js +0 -15
  44. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/index.js +0 -28
  45. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/presentations.js +0 -71
  46. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/registry.js +0 -44
  47. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/PHASE_1_QUICKSTART.docblock.js +0 -15
  48. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/PHASE_2_AI_NATIVE_OPERATIONS.docblock.js +0 -15
  49. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/PHASE_3_AUTO_EVOLUTION.docblock.js +0 -15
  50. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/PHASE_4_PERSONALIZATION_ENGINE.docblock.js +0 -15
  51. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/PHASE_5_ZERO_TOUCH_OPERATIONS.docblock.js +0 -15
  52. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/auth/better-auth-nextjs.docblock.js +0 -79
  53. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/contracts/openapi-export.docblock.js +0 -56
  54. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/lifecycle-stage-system.docblock.js +0 -15
  55. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/llm/llm-integration.docblock.js +0 -356
  56. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/mcp-endpoints.docblock.js +0 -36
  57. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/presentation-runtime.docblock.js +0 -15
  58. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/schema/README.docblock.js +0 -19
  59. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/learning-events.docblock.js +0 -47
  60. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/learning-journeys.docblock.js +0 -78
  61. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/platform-admin-panel.docblock.js +0 -83
  62. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/project-access-teams.docblock.js +0 -44
  63. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/project-routing.docblock.js +0 -66
  64. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/sandbox-unlogged.docblock.js +0 -39
  65. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/team-invitations.docblock.js +0 -68
  66. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/workspace-ops.docblock.js +0 -46
  67. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/studio/workspaces.docblock.js +0 -61
  68. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/telemetry-ingest.docblock.js +0 -154
  69. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/templates/runtime.docblock.js +0 -19
  70. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/vscode-extension.docblock.js +0 -100
  71. package/dist/examples/learning-journey-ui-shared/dist/libs/contracts/dist/docs/tech/workflows/overview.docblock.js +0 -19
  72. package/dist/examples/learning-journey-ui-shared/dist/libs/design-system/dist/_virtual/rolldown_runtime.js +0 -5
  73. package/dist/examples/learning-journey-ui-shared/dist/libs/design-system/dist/components/atoms/Button.js +0 -33
  74. package/dist/examples/learning-journey-ui-shared/dist/libs/design-system/dist/ui-kit-web/dist/ui/button.js +0 -55
  75. package/dist/examples/learning-journey-ui-shared/dist/libs/design-system/dist/ui-kit-web/dist/ui-kit-core/dist/utils.js +0 -13
  76. package/dist/examples/learning-journey-ui-shared/dist/libs/ui-kit-web/dist/ui/progress.js +0 -23
  77. package/dist/examples/learning-journey-ui-shared/dist/libs/ui-kit-web/dist/ui/utils.js +0 -10
  78. package/dist/examples/learning-journey-ui-shared/dist/libs/ui-kit-web/dist/ui-kit-core/dist/utils.js +0 -10
  79. package/dist/index.d.ts +0 -12
  80. package/dist/index.js +0 -14
  81. package/dist/libs/contracts/dist/docs/PUBLISHING.docblock.js +0 -16
  82. package/dist/libs/contracts/dist/docs/accessibility_wcag_compliance_specs.docblock.js +0 -16
  83. package/dist/libs/contracts/dist/docs/index.js +0 -29
  84. package/dist/libs/contracts/dist/docs/presentations.js +0 -71
  85. package/dist/libs/contracts/dist/docs/registry.js +0 -44
  86. package/dist/libs/contracts/dist/docs/tech/PHASE_1_QUICKSTART.docblock.js +0 -16
  87. package/dist/libs/contracts/dist/docs/tech/PHASE_2_AI_NATIVE_OPERATIONS.docblock.js +0 -16
  88. package/dist/libs/contracts/dist/docs/tech/PHASE_3_AUTO_EVOLUTION.docblock.js +0 -16
  89. package/dist/libs/contracts/dist/docs/tech/PHASE_4_PERSONALIZATION_ENGINE.docblock.js +0 -16
  90. package/dist/libs/contracts/dist/docs/tech/PHASE_5_ZERO_TOUCH_OPERATIONS.docblock.js +0 -16
  91. package/dist/libs/contracts/dist/docs/tech/auth/better-auth-nextjs.docblock.js +0 -80
  92. package/dist/libs/contracts/dist/docs/tech/contracts/openapi-export.docblock.js +0 -57
  93. package/dist/libs/contracts/dist/docs/tech/lifecycle-stage-system.docblock.js +0 -16
  94. package/dist/libs/contracts/dist/docs/tech/llm/llm-integration.docblock.js +0 -357
  95. package/dist/libs/contracts/dist/docs/tech/mcp-endpoints.docblock.js +0 -37
  96. package/dist/libs/contracts/dist/docs/tech/presentation-runtime.docblock.js +0 -16
  97. package/dist/libs/contracts/dist/docs/tech/schema/README.docblock.js +0 -20
  98. package/dist/libs/contracts/dist/docs/tech/studio/learning-events.docblock.js +0 -48
  99. package/dist/libs/contracts/dist/docs/tech/studio/learning-journeys.docblock.js +0 -79
  100. package/dist/libs/contracts/dist/docs/tech/studio/platform-admin-panel.docblock.js +0 -84
  101. package/dist/libs/contracts/dist/docs/tech/studio/project-access-teams.docblock.js +0 -45
  102. package/dist/libs/contracts/dist/docs/tech/studio/project-routing.docblock.js +0 -67
  103. package/dist/libs/contracts/dist/docs/tech/studio/sandbox-unlogged.docblock.js +0 -40
  104. package/dist/libs/contracts/dist/docs/tech/studio/team-invitations.docblock.js +0 -69
  105. package/dist/libs/contracts/dist/docs/tech/studio/workspace-ops.docblock.js +0 -47
  106. package/dist/libs/contracts/dist/docs/tech/studio/workspaces.docblock.js +0 -62
  107. package/dist/libs/contracts/dist/docs/tech/telemetry-ingest.docblock.js +0 -155
  108. package/dist/libs/contracts/dist/docs/tech/templates/runtime.docblock.js +0 -20
  109. package/dist/libs/contracts/dist/docs/tech/vscode-extension.docblock.js +0 -101
  110. package/dist/libs/contracts/dist/docs/tech/workflows/overview.docblock.js +0 -20
  111. package/dist/libs/design-system/dist/_virtual/rolldown_runtime.js +0 -5
  112. package/dist/libs/design-system/dist/components/atoms/Button.js +0 -33
  113. package/dist/libs/design-system/dist/ui-kit-web/dist/ui/button.js +0 -55
  114. package/dist/libs/design-system/dist/ui-kit-web/dist/ui-kit-core/dist/utils.js +0 -13
  115. package/dist/libs/ui-kit-core/dist/utils.js +0 -10
  116. package/dist/libs/ui-kit-web/dist/ui/card.js +0 -36
  117. package/dist/libs/ui-kit-web/dist/ui/progress.js +0 -23
  118. package/dist/libs/ui-kit-web/dist/ui/utils.js +0 -10
  119. package/dist/libs/ui-kit-web/dist/ui-kit-core/dist/utils.js +0 -10
  120. package/dist/views/Overview.d.ts +0 -14
  121. package/dist/views/Overview.js +0 -180
  122. package/dist/views/Progress.d.ts +0 -10
  123. package/dist/views/Progress.js +0 -162
  124. package/dist/views/Steps.d.ts +0 -11
  125. package/dist/views/Steps.js +0 -91
  126. package/dist/views/Timeline.d.ts +0 -10
  127. package/dist/views/Timeline.js +0 -97
  128. package/dist/views/index.d.ts +0 -5
  129. package/dist/views/index.js +0 -6
@@ -0,0 +1,2 @@
1
+ import { i as Overview, n as ProgressView, r as Steps, t as Timeline } from "../index-BNYp4weX.mjs";
2
+ export { Overview, ProgressView as Progress, Steps, Timeline };
@@ -0,0 +1,4 @@
1
+ import { i as Overview, n as ProgressView, r as Steps, t as Timeline } from "../views-CoPP-P4F.mjs";
2
+ import "../JourneyMap-iX1Y4ZFM.mjs";
3
+
4
+ export { Overview, ProgressView as Progress, Steps, Timeline };
@@ -0,0 +1,504 @@
1
+ import { n as StepChecklist, t as JourneyMap } from "./JourneyMap-iX1Y4ZFM.mjs";
2
+ import { useState } from "react";
3
+ import { Card, CardContent, CardHeader, CardTitle } from "@lssm/lib.ui-kit-web/ui/card";
4
+ import { BadgeDisplay, XpBar } from "@lssm/example.learning-journey-ui-shared";
5
+ import { Button } from "@lssm/lib.design-system";
6
+ import { Progress } from "@lssm/lib.ui-kit-web/ui/progress";
7
+ import { jsx, jsxs } from "react/jsx-runtime";
8
+
9
+ //#region src/views/Overview.tsx
10
+ function Overview({ track, progress, onStart }) {
11
+ const totalSteps = track.steps.length;
12
+ const completedSteps = progress.completedStepIds.length;
13
+ const percentComplete = totalSteps > 0 ? completedSteps / totalSteps * 100 : 0;
14
+ const isComplete = completedSteps === totalSteps;
15
+ const remainingSteps = totalSteps - completedSteps;
16
+ const estimatedMinutes = remainingSteps * 5;
17
+ const totalXp = track.totalXp ?? track.steps.reduce((sum, s) => sum + (s.xpReward ?? 0), 0) + (track.completionRewards?.xpBonus ?? 0);
18
+ return /* @__PURE__ */ jsxs("div", {
19
+ className: "space-y-6",
20
+ children: [
21
+ /* @__PURE__ */ jsx(Card, {
22
+ className: "overflow-hidden bg-gradient-to-r from-blue-500/10 via-violet-500/10 to-purple-500/10",
23
+ children: /* @__PURE__ */ jsx(CardContent, {
24
+ className: "p-8",
25
+ children: /* @__PURE__ */ jsxs("div", {
26
+ className: "flex flex-col items-center gap-6 text-center md:flex-row md:text-left",
27
+ children: [
28
+ /* @__PURE__ */ jsx("div", {
29
+ className: "flex h-20 w-20 items-center justify-center rounded-2xl bg-gradient-to-br from-blue-500 to-violet-600 text-4xl shadow-lg",
30
+ children: isComplete ? "🎉" : "🚀"
31
+ }),
32
+ /* @__PURE__ */ jsxs("div", {
33
+ className: "flex-1",
34
+ children: [
35
+ /* @__PURE__ */ jsx("h1", {
36
+ className: "text-2xl font-bold",
37
+ children: track.name
38
+ }),
39
+ /* @__PURE__ */ jsx("p", {
40
+ className: "text-muted-foreground mt-1 max-w-2xl",
41
+ children: track.description
42
+ }),
43
+ !isComplete && /* @__PURE__ */ jsxs("p", {
44
+ className: "text-muted-foreground mt-3 text-sm",
45
+ children: [
46
+ "⏱️ Estimated time:",
47
+ " ",
48
+ estimatedMinutes > 0 ? `~${estimatedMinutes} minutes` : "Less than a minute"
49
+ ]
50
+ })
51
+ ]
52
+ }),
53
+ !isComplete && /* @__PURE__ */ jsx(Button, {
54
+ size: "lg",
55
+ onClick: onStart,
56
+ children: completedSteps > 0 ? "Continue" : "Get Started"
57
+ })
58
+ ]
59
+ })
60
+ })
61
+ }),
62
+ /* @__PURE__ */ jsxs("div", {
63
+ className: "grid gap-4 md:grid-cols-3",
64
+ children: [
65
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
66
+ className: "pb-2",
67
+ children: /* @__PURE__ */ jsx(CardTitle, {
68
+ className: "text-muted-foreground text-sm font-medium",
69
+ children: "Progress"
70
+ })
71
+ }), /* @__PURE__ */ jsxs(CardContent, { children: [
72
+ /* @__PURE__ */ jsxs("div", {
73
+ className: "text-3xl font-bold",
74
+ children: [Math.round(percentComplete), "%"]
75
+ }),
76
+ /* @__PURE__ */ jsx(Progress, {
77
+ value: percentComplete,
78
+ className: "mt-2 h-2"
79
+ }),
80
+ /* @__PURE__ */ jsxs("p", {
81
+ className: "text-muted-foreground mt-2 text-sm",
82
+ children: [
83
+ completedSteps,
84
+ " of ",
85
+ totalSteps,
86
+ " steps completed"
87
+ ]
88
+ })
89
+ ] })] }),
90
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
91
+ className: "pb-2",
92
+ children: /* @__PURE__ */ jsx(CardTitle, {
93
+ className: "text-muted-foreground text-sm font-medium",
94
+ children: "XP Earned"
95
+ })
96
+ }), /* @__PURE__ */ jsxs(CardContent, { children: [/* @__PURE__ */ jsx("div", {
97
+ className: "text-3xl font-bold text-blue-500",
98
+ children: progress.xpEarned
99
+ }), /* @__PURE__ */ jsx(XpBar, {
100
+ current: progress.xpEarned,
101
+ max: totalXp,
102
+ showLabel: false,
103
+ size: "sm"
104
+ })] })] }),
105
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
106
+ className: "pb-2",
107
+ children: /* @__PURE__ */ jsx(CardTitle, {
108
+ className: "text-muted-foreground text-sm font-medium",
109
+ children: "Time Remaining"
110
+ })
111
+ }), /* @__PURE__ */ jsxs(CardContent, { children: [/* @__PURE__ */ jsx("div", {
112
+ className: "text-3xl font-bold",
113
+ children: isComplete ? "✓" : `~${estimatedMinutes}m`
114
+ }), /* @__PURE__ */ jsx("p", {
115
+ className: "text-muted-foreground mt-2 text-sm",
116
+ children: isComplete ? "All done!" : `${remainingSteps} steps to go`
117
+ })] })] })
118
+ ]
119
+ }),
120
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
121
+ className: "flex items-center gap-2",
122
+ children: [/* @__PURE__ */ jsx("span", { children: "📋" }), /* @__PURE__ */ jsx("span", { children: "Your Journey" })]
123
+ }) }), /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", {
124
+ className: "space-y-3",
125
+ children: track.steps.map((step, index) => {
126
+ const isStepCompleted = progress.completedStepIds.includes(step.id);
127
+ const isCurrent = !isStepCompleted && track.steps.slice(0, index).every((s) => progress.completedStepIds.includes(s.id));
128
+ return /* @__PURE__ */ jsxs("div", {
129
+ className: "flex items-center gap-4 rounded-lg border p-3",
130
+ children: [
131
+ /* @__PURE__ */ jsx("div", {
132
+ 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"}`,
133
+ children: isStepCompleted ? "✓" : index + 1
134
+ }),
135
+ /* @__PURE__ */ jsx("div", {
136
+ className: "min-w-0 flex-1",
137
+ children: /* @__PURE__ */ jsx("p", {
138
+ className: `font-medium ${isStepCompleted ? "text-green-500" : isCurrent ? "text-foreground" : "text-muted-foreground"}`,
139
+ children: step.title
140
+ })
141
+ }),
142
+ step.xpReward && /* @__PURE__ */ jsxs("span", {
143
+ className: "text-muted-foreground text-sm",
144
+ children: [
145
+ "+",
146
+ step.xpReward,
147
+ " XP"
148
+ ]
149
+ })
150
+ ]
151
+ }, step.id);
152
+ })
153
+ }) })] }),
154
+ isComplete && /* @__PURE__ */ jsx(Card, {
155
+ className: "border-green-500/50 bg-green-500/5",
156
+ children: /* @__PURE__ */ jsxs(CardContent, {
157
+ className: "flex items-center gap-4 p-6",
158
+ children: [/* @__PURE__ */ jsx("div", {
159
+ className: "text-4xl",
160
+ children: "🎉"
161
+ }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("h3", {
162
+ className: "text-lg font-semibold text-green-500",
163
+ children: "Onboarding Complete!"
164
+ }), /* @__PURE__ */ jsxs("p", {
165
+ className: "text-muted-foreground",
166
+ children: [
167
+ "You've completed all ",
168
+ totalSteps,
169
+ " steps. Welcome aboard!"
170
+ ]
171
+ })] })]
172
+ })
173
+ })
174
+ ]
175
+ });
176
+ }
177
+
178
+ //#endregion
179
+ //#region src/views/Steps.tsx
180
+ function Steps({ track, progress, onStepComplete }) {
181
+ const [expandedStepId, setExpandedStepId] = useState(() => {
182
+ return track.steps.find((s) => !progress.completedStepIds.includes(s.id))?.id ?? null;
183
+ });
184
+ const completedSteps = progress.completedStepIds.length;
185
+ const totalSteps = track.steps.length;
186
+ const percentComplete = totalSteps > 0 ? completedSteps / totalSteps * 100 : 0;
187
+ const currentStepIndex = track.steps.findIndex((s) => !progress.completedStepIds.includes(s.id));
188
+ return /* @__PURE__ */ jsxs("div", {
189
+ className: "space-y-6",
190
+ children: [
191
+ /* @__PURE__ */ jsxs("div", {
192
+ className: "space-y-2",
193
+ children: [/* @__PURE__ */ jsxs("div", {
194
+ className: "flex items-center justify-between",
195
+ children: [/* @__PURE__ */ jsx("h2", {
196
+ className: "text-xl font-bold",
197
+ children: "Complete Each Step"
198
+ }), /* @__PURE__ */ jsxs("span", {
199
+ className: "text-muted-foreground text-sm",
200
+ children: [
201
+ completedSteps,
202
+ " / ",
203
+ totalSteps,
204
+ " completed"
205
+ ]
206
+ })]
207
+ }), /* @__PURE__ */ jsx(Progress, {
208
+ value: percentComplete,
209
+ className: "h-2"
210
+ })]
211
+ }),
212
+ /* @__PURE__ */ jsx("div", {
213
+ className: "space-y-3",
214
+ children: track.steps.map((step, index) => {
215
+ const isCompleted = progress.completedStepIds.includes(step.id);
216
+ const isCurrent = index === currentStepIndex;
217
+ return /* @__PURE__ */ jsx(StepChecklist, {
218
+ step,
219
+ stepNumber: index + 1,
220
+ isCompleted,
221
+ isCurrent,
222
+ isExpanded: expandedStepId === step.id,
223
+ onToggle: () => setExpandedStepId(expandedStepId === step.id ? null : step.id),
224
+ onComplete: () => {
225
+ onStepComplete?.(step.id);
226
+ const nextStep = track.steps[index + 1];
227
+ if (nextStep && !progress.completedStepIds.includes(nextStep.id)) setExpandedStepId(nextStep.id);
228
+ }
229
+ }, step.id);
230
+ })
231
+ }),
232
+ track.completionRewards && percentComplete < 100 && /* @__PURE__ */ jsx("div", {
233
+ className: "rounded-lg border border-blue-500/30 bg-blue-500/5 p-4",
234
+ children: /* @__PURE__ */ jsxs("p", {
235
+ className: "text-sm",
236
+ children: [
237
+ "🎁 Complete all steps to unlock:",
238
+ track.completionRewards.xpBonus && /* @__PURE__ */ jsxs("span", {
239
+ className: "ml-2 font-semibold text-blue-500",
240
+ children: [
241
+ "+",
242
+ track.completionRewards.xpBonus,
243
+ " XP bonus"
244
+ ]
245
+ }),
246
+ track.completionRewards.badgeKey && /* @__PURE__ */ jsxs("span", {
247
+ className: "ml-2 font-semibold text-amber-500",
248
+ children: [
249
+ "+ \"",
250
+ track.completionRewards.badgeKey,
251
+ "\" badge"
252
+ ]
253
+ })
254
+ ]
255
+ })
256
+ })
257
+ ]
258
+ });
259
+ }
260
+
261
+ //#endregion
262
+ //#region src/views/Progress.tsx
263
+ function ProgressView({ track, progress }) {
264
+ const totalSteps = track.steps.length;
265
+ const completedSteps = progress.completedStepIds.length;
266
+ const percentComplete = totalSteps > 0 ? completedSteps / totalSteps * 100 : 0;
267
+ const totalXp = track.totalXp ?? track.steps.reduce((sum, s) => sum + (s.xpReward ?? 0), 0) + (track.completionRewards?.xpBonus ?? 0);
268
+ const remainingSteps = totalSteps - completedSteps;
269
+ const estimatedMinutes = remainingSteps * 5;
270
+ return /* @__PURE__ */ jsxs("div", {
271
+ className: "space-y-6",
272
+ children: [
273
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
274
+ className: "flex items-center gap-2",
275
+ children: [/* @__PURE__ */ jsx("span", { children: "📈" }), /* @__PURE__ */ jsx("span", { children: "Your Progress" })]
276
+ }) }), /* @__PURE__ */ jsxs(CardContent, {
277
+ className: "space-y-6",
278
+ children: [/* @__PURE__ */ jsx("div", {
279
+ className: "flex items-center justify-center",
280
+ children: /* @__PURE__ */ jsxs("div", {
281
+ className: "relative flex h-40 w-40 items-center justify-center",
282
+ children: [/* @__PURE__ */ jsxs("svg", {
283
+ className: "absolute h-full w-full -rotate-90",
284
+ viewBox: "0 0 100 100",
285
+ children: [/* @__PURE__ */ jsx("circle", {
286
+ cx: "50",
287
+ cy: "50",
288
+ r: "45",
289
+ fill: "none",
290
+ strokeWidth: "8",
291
+ className: "stroke-muted"
292
+ }), /* @__PURE__ */ jsx("circle", {
293
+ cx: "50",
294
+ cy: "50",
295
+ r: "45",
296
+ fill: "none",
297
+ strokeWidth: "8",
298
+ strokeLinecap: "round",
299
+ strokeDasharray: `${percentComplete * 2.83} 283`,
300
+ className: "stroke-blue-500 transition-all duration-500"
301
+ })]
302
+ }), /* @__PURE__ */ jsxs("div", {
303
+ className: "text-center",
304
+ children: [/* @__PURE__ */ jsxs("div", {
305
+ className: "text-3xl font-bold",
306
+ children: [Math.round(percentComplete), "%"]
307
+ }), /* @__PURE__ */ jsx("div", {
308
+ className: "text-muted-foreground text-sm",
309
+ children: "Complete"
310
+ })]
311
+ })]
312
+ })
313
+ }), /* @__PURE__ */ jsxs("div", {
314
+ className: "grid grid-cols-3 gap-4 text-center",
315
+ children: [
316
+ /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("div", {
317
+ className: "text-2xl font-bold text-green-500",
318
+ children: completedSteps
319
+ }), /* @__PURE__ */ jsx("div", {
320
+ className: "text-muted-foreground text-sm",
321
+ children: "Completed"
322
+ })] }),
323
+ /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("div", {
324
+ className: "text-2xl font-bold text-orange-500",
325
+ children: remainingSteps
326
+ }), /* @__PURE__ */ jsx("div", {
327
+ className: "text-muted-foreground text-sm",
328
+ children: "Remaining"
329
+ })] }),
330
+ /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
331
+ className: "text-2xl font-bold",
332
+ children: [estimatedMinutes, "m"]
333
+ }), /* @__PURE__ */ jsx("div", {
334
+ className: "text-muted-foreground text-sm",
335
+ children: "Est. Time"
336
+ })] })
337
+ ]
338
+ })]
339
+ })] }),
340
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
341
+ className: "flex items-center gap-2",
342
+ children: [/* @__PURE__ */ jsx("span", { children: "⚡" }), /* @__PURE__ */ jsx("span", { children: "Experience Points" })]
343
+ }) }), /* @__PURE__ */ jsxs(CardContent, {
344
+ className: "space-y-4",
345
+ children: [/* @__PURE__ */ jsxs("div", {
346
+ className: "flex items-baseline gap-2",
347
+ children: [/* @__PURE__ */ jsx("span", {
348
+ className: "text-3xl font-bold text-blue-500",
349
+ children: progress.xpEarned
350
+ }), /* @__PURE__ */ jsxs("span", {
351
+ className: "text-muted-foreground",
352
+ children: [
353
+ "/ ",
354
+ totalXp,
355
+ " XP"
356
+ ]
357
+ })]
358
+ }), /* @__PURE__ */ jsx(XpBar, {
359
+ current: progress.xpEarned,
360
+ max: totalXp,
361
+ showLabel: false,
362
+ size: "lg"
363
+ })]
364
+ })] }),
365
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
366
+ className: "flex items-center gap-2",
367
+ children: [/* @__PURE__ */ jsx("span", { children: "🏅" }), /* @__PURE__ */ jsx("span", { children: "Achievements" })]
368
+ }) }), /* @__PURE__ */ jsxs(CardContent, { children: [/* @__PURE__ */ jsx(BadgeDisplay, {
369
+ badges: progress.badges,
370
+ size: "lg"
371
+ }), progress.badges.length === 0 && track.completionRewards?.badgeKey && /* @__PURE__ */ jsxs("p", {
372
+ className: "text-muted-foreground text-sm",
373
+ children: [
374
+ "Complete all steps to earn the \"",
375
+ track.completionRewards.badgeKey,
376
+ "\" badge!"
377
+ ]
378
+ })] })] }),
379
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
380
+ className: "flex items-center gap-2",
381
+ children: [/* @__PURE__ */ jsx("span", { children: "📋" }), /* @__PURE__ */ jsx("span", { children: "Step Details" })]
382
+ }) }), /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", {
383
+ className: "space-y-3",
384
+ children: track.steps.map((step, index) => {
385
+ const isCompleted = progress.completedStepIds.includes(step.id);
386
+ const stepProgress = isCompleted ? 100 : 0;
387
+ return /* @__PURE__ */ jsxs("div", {
388
+ className: "space-y-1",
389
+ children: [/* @__PURE__ */ jsxs("div", {
390
+ className: "flex items-center justify-between text-sm",
391
+ children: [/* @__PURE__ */ jsxs("span", {
392
+ className: isCompleted ? "text-green-500" : "text-foreground",
393
+ children: [
394
+ index + 1,
395
+ ". ",
396
+ step.title
397
+ ]
398
+ }), /* @__PURE__ */ jsx("span", {
399
+ className: isCompleted ? "text-green-500" : "text-muted-foreground",
400
+ children: isCompleted ? "✓" : "Pending"
401
+ })]
402
+ }), /* @__PURE__ */ jsx(Progress, {
403
+ value: stepProgress,
404
+ className: "h-1"
405
+ })]
406
+ }, step.id);
407
+ })
408
+ }) })] })
409
+ ]
410
+ });
411
+ }
412
+
413
+ //#endregion
414
+ //#region src/views/Timeline.tsx
415
+ function Timeline({ track, progress }) {
416
+ const currentStepId = track.steps.find((s) => !progress.completedStepIds.includes(s.id))?.id ?? null;
417
+ return /* @__PURE__ */ jsxs("div", {
418
+ className: "space-y-6",
419
+ children: [
420
+ /* @__PURE__ */ jsxs("div", {
421
+ className: "text-center",
422
+ children: [/* @__PURE__ */ jsx("h2", {
423
+ className: "text-xl font-bold",
424
+ children: "Your Learning Journey"
425
+ }), /* @__PURE__ */ jsx("p", {
426
+ className: "text-muted-foreground",
427
+ children: "Follow the path through each surface and feature"
428
+ })]
429
+ }),
430
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
431
+ className: "flex items-center gap-2",
432
+ children: [/* @__PURE__ */ jsx("span", { children: "🗺️" }), /* @__PURE__ */ jsx("span", { children: "Journey Map" })]
433
+ }) }), /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(JourneyMap, {
434
+ steps: track.steps,
435
+ completedStepIds: progress.completedStepIds,
436
+ currentStepId
437
+ }) })] }),
438
+ /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsxs(CardTitle, {
439
+ className: "flex items-center gap-2",
440
+ children: [/* @__PURE__ */ jsx("span", { children: "📍" }), /* @__PURE__ */ jsx("span", { children: "Step by Step" })]
441
+ }) }), /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsxs("div", {
442
+ className: "relative",
443
+ children: [/* @__PURE__ */ jsx("div", { className: "bg-border absolute top-0 left-4 h-full w-0.5" }), /* @__PURE__ */ jsx("div", {
444
+ className: "space-y-6",
445
+ children: track.steps.map((step, index) => {
446
+ const isCompleted = progress.completedStepIds.includes(step.id);
447
+ const isCurrent = step.id === currentStepId;
448
+ const surface = step.metadata?.surface ?? "general";
449
+ return /* @__PURE__ */ jsxs("div", {
450
+ className: "relative flex gap-4 pl-2",
451
+ children: [/* @__PURE__ */ jsx("div", {
452
+ className: `relative z-10 flex h-8 w-8 shrink-0 items-center justify-center rounded-full border-2 transition-all ${isCompleted ? "border-green-500 bg-green-500 text-white" : isCurrent ? "border-blue-500 bg-blue-500 text-white ring-4 ring-blue-500/20" : "border-border bg-background text-muted-foreground"}`,
453
+ children: isCompleted ? "✓" : index + 1
454
+ }), /* @__PURE__ */ jsx("div", {
455
+ className: "flex-1 pb-2",
456
+ children: /* @__PURE__ */ jsxs("div", {
457
+ className: "rounded-lg border p-4",
458
+ children: [/* @__PURE__ */ jsxs("div", {
459
+ className: "flex items-start justify-between gap-2",
460
+ children: [/* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
461
+ className: "flex items-center gap-2",
462
+ children: [/* @__PURE__ */ jsx("h4", {
463
+ className: `font-semibold ${isCompleted ? "text-green-500" : isCurrent ? "text-blue-500" : "text-foreground"}`,
464
+ children: step.title
465
+ }), /* @__PURE__ */ jsx("span", {
466
+ className: "bg-muted text-muted-foreground rounded px-2 py-0.5 text-xs",
467
+ children: surface
468
+ })]
469
+ }), /* @__PURE__ */ jsx("p", {
470
+ className: "text-muted-foreground mt-1 text-sm",
471
+ children: step.description
472
+ })] }), step.xpReward && /* @__PURE__ */ jsxs("span", {
473
+ 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"}`,
474
+ children: [
475
+ "+",
476
+ step.xpReward,
477
+ " XP"
478
+ ]
479
+ })]
480
+ }), /* @__PURE__ */ jsx("div", {
481
+ className: "mt-3 text-xs",
482
+ children: isCompleted ? /* @__PURE__ */ jsx("span", {
483
+ className: "text-green-500",
484
+ children: "✓ Completed"
485
+ }) : isCurrent ? /* @__PURE__ */ jsx("span", {
486
+ className: "text-blue-500",
487
+ children: "→ In Progress"
488
+ }) : /* @__PURE__ */ jsx("span", {
489
+ className: "text-muted-foreground",
490
+ children: "○ Not Started"
491
+ })
492
+ })]
493
+ })
494
+ })]
495
+ }, step.id);
496
+ })
497
+ })]
498
+ }) })] })
499
+ ]
500
+ });
501
+ }
502
+
503
+ //#endregion
504
+ export { Overview as i, ProgressView as n, Steps as r, Timeline as t };
package/package.json CHANGED
@@ -1,30 +1,19 @@
1
1
  {
2
2
  "name": "@lssm/example.learning-journey-ui-onboarding",
3
- "version": "0.0.0-canary-20251217083314",
3
+ "version": "1.41.0",
4
4
  "description": "Developer onboarding UI with checklists and journey maps.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
7
7
  "types": "./dist/index.d.ts",
8
8
  "exports": {
9
- ".": "./dist/index.js",
10
- "./components": "./dist/components/index.js",
11
- "./components/CodeSnippet": "./dist/components/CodeSnippet.js",
12
- "./components/JourneyMap": "./dist/components/JourneyMap.js",
13
- "./components/StepChecklist": "./dist/components/StepChecklist.js",
14
- "./docs": "./dist/docs/index.js",
15
- "./docs/learning-journey-ui-onboarding.docblock": "./dist/docs/learning-journey-ui-onboarding.docblock.js",
16
- "./example": "./dist/example.js",
17
- "./OnboardingMiniApp": "./dist/OnboardingMiniApp.js",
18
- "./views": "./dist/views/index.js",
19
- "./views/Overview": "./dist/views/Overview.js",
20
- "./views/Progress": "./dist/views/Progress.js",
21
- "./views/Steps": "./dist/views/Steps.js",
22
- "./views/Timeline": "./dist/views/Timeline.js",
9
+ ".": "./src/index.ts",
10
+ "./example": "./src/example.ts",
11
+ "./docs": "./src/docs/index.ts",
12
+ "./views": "./src/views/index.ts",
13
+ "./components": "./src/components/index.ts",
23
14
  "./*": "./*"
24
15
  },
25
16
  "scripts": {
26
- "publish:pkg": "bun publish --tolerate-republish --ignore-scripts --verbose",
27
- "publish:pkg:canary": "bun publish:pkg --tag canary",
28
17
  "build": "bun build:bundle && bun build:types",
29
18
  "build:bundle": "tsdown",
30
19
  "build:types": "tsc --noEmit",
@@ -36,20 +25,17 @@
36
25
  "test": "bun test"
37
26
  },
38
27
  "dependencies": {
39
- "@lssm/lib.ui-kit-core": "0.0.0-canary-20251217083314",
40
- "@lssm/lib.schema": "0.0.0-canary-20251217083314",
41
- "@lssm/lib.contracts": "0.0.0-canary-20251217083314",
42
- "@lssm/example.learning-journey-ui-shared": "0.0.0-canary-20251217083314",
43
- "@lssm/example.learning-journey-studio-onboarding": "0.0.0-canary-20251217083314",
44
- "@lssm/example.learning-journey-platform-tour": "0.0.0-canary-20251217083314",
45
- "@lssm/module.learning-journey": "0.0.0-canary-20251217083314",
46
- "@lssm/lib.design-system": "0.0.0-canary-20251217083314",
47
- "@lssm/lib.ui-kit-web": "0.0.0-canary-20251217083314",
28
+ "@lssm/example.learning-journey-ui-shared": "workspace:*",
29
+ "@lssm/example.learning-journey-studio-onboarding": "workspace:*",
30
+ "@lssm/example.learning-journey-platform-tour": "workspace:*",
31
+ "@lssm/module.learning-journey": "workspace:*",
32
+ "@lssm/lib.design-system": "workspace:*",
33
+ "@lssm/lib.ui-kit-web": "workspace:*",
48
34
  "react": "^19.2.3"
49
35
  },
50
36
  "devDependencies": {
51
- "@lssm/tool.tsdown": "0.0.0-canary-20251217083314",
52
- "@lssm/tool.typescript": "0.0.0-canary-20251217083314",
37
+ "@lssm/tool.tsdown": "workspace:*",
38
+ "@lssm/tool.typescript": "workspace:*",
53
39
  "@types/react": "^19.1.6",
54
40
  "tsdown": "^0.17.4",
55
41
  "typescript": "^5.9.3"