@contractspec/example.learning-journey-ui-shared 1.57.0 → 1.58.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.
- package/.turbo/turbo-build.log +52 -53
- package/.turbo/turbo-prebuild.log +1 -0
- package/CHANGELOG.md +15 -0
- package/dist/browser/components/BadgeDisplay.js +54 -0
- package/dist/browser/components/StreakCounter.js +50 -0
- package/dist/browser/components/ViewTabs.js +46 -0
- package/dist/browser/components/XpBar.js +62 -0
- package/dist/browser/components/index.js +209 -0
- package/dist/browser/docs/index.js +21 -0
- package/dist/browser/docs/learning-journey-ui-shared.docblock.js +21 -0
- package/dist/browser/example.js +32 -0
- package/dist/browser/hooks/index.js +71 -0
- package/dist/browser/hooks/useLearningProgress.js +71 -0
- package/dist/browser/index.js +330 -0
- package/dist/browser/types.js +0 -0
- package/dist/components/BadgeDisplay.d.ts +2 -11
- package/dist/components/BadgeDisplay.d.ts.map +1 -1
- package/dist/components/BadgeDisplay.js +51 -41
- package/dist/components/StreakCounter.d.ts +2 -11
- package/dist/components/StreakCounter.d.ts.map +1 -1
- package/dist/components/StreakCounter.js +48 -43
- package/dist/components/ViewTabs.d.ts +2 -11
- package/dist/components/ViewTabs.d.ts.map +1 -1
- package/dist/components/ViewTabs.js +43 -45
- package/dist/components/XpBar.d.ts +2 -13
- package/dist/components/XpBar.d.ts.map +1 -1
- package/dist/components/XpBar.js +58 -42
- package/dist/components/index.d.ts +5 -5
- package/dist/components/index.d.ts.map +1 -0
- package/dist/components/index.js +209 -5
- package/dist/docs/index.d.ts +2 -1
- package/dist/docs/index.d.ts.map +1 -0
- package/dist/docs/index.js +22 -1
- package/dist/docs/learning-journey-ui-shared.docblock.d.ts +2 -1
- package/dist/docs/learning-journey-ui-shared.docblock.d.ts.map +1 -0
- package/dist/docs/learning-journey-ui-shared.docblock.js +20 -18
- package/dist/example.d.ts +2 -6
- package/dist/example.d.ts.map +1 -1
- package/dist/example.js +31 -39
- package/dist/hooks/index.d.ts +2 -2
- package/dist/hooks/index.d.ts.map +1 -0
- package/dist/hooks/index.js +72 -3
- package/dist/hooks/useLearningProgress.d.ts +15 -19
- package/dist/hooks/useLearningProgress.d.ts.map +1 -1
- package/dist/hooks/useLearningProgress.js +68 -70
- package/dist/index.d.ts +6 -9
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +331 -11
- package/dist/node/components/BadgeDisplay.js +54 -0
- package/dist/node/components/StreakCounter.js +50 -0
- package/dist/node/components/ViewTabs.js +46 -0
- package/dist/node/components/XpBar.js +62 -0
- package/dist/node/components/index.js +209 -0
- package/dist/node/docs/index.js +21 -0
- package/dist/node/docs/learning-journey-ui-shared.docblock.js +21 -0
- package/dist/node/example.js +32 -0
- package/dist/node/hooks/index.js +71 -0
- package/dist/node/hooks/useLearningProgress.js +71 -0
- package/dist/node/index.js +330 -0
- package/dist/node/types.js +0 -0
- package/dist/types.d.ts +38 -42
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js +1 -0
- package/package.json +135 -34
- package/tsdown.config.js +1 -2
- package/.turbo/turbo-build$colon$bundle.log +0 -53
- package/dist/components/BadgeDisplay.js.map +0 -1
- package/dist/components/StreakCounter.js.map +0 -1
- package/dist/components/ViewTabs.js.map +0 -1
- package/dist/components/XpBar.js.map +0 -1
- package/dist/docs/learning-journey-ui-shared.docblock.js.map +0 -1
- package/dist/example.js.map +0 -1
- package/dist/hooks/useLearningProgress.js.map +0 -1
- package/tsconfig.tsbuildinfo +0 -1
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,54 +1,53 @@
|
|
|
1
|
-
$ bun
|
|
2
|
-
$
|
|
3
|
-
$
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
[34mℹ[39m target: [34mesnext[39m
|
|
8
|
-
[34mℹ[39m tsconfig: [34mtsconfig.json[39m
|
|
9
|
-
[34mℹ[39m Build start
|
|
10
|
-
[34mℹ[39m [2mdist/[22m[1mhooks/useLearningProgress.js[22m [2m2.54 kB[22m [2m│ gzip: 0.90 kB[22m
|
|
11
|
-
[34mℹ[39m [2mdist/[22m[1mcomponents/BadgeDisplay.js[22m [2m1.51 kB[22m [2m│ gzip: 0.78 kB[22m
|
|
12
|
-
[34mℹ[39m [2mdist/[22m[1mcomponents/XpBar.js[22m [2m1.31 kB[22m [2m│ gzip: 0.63 kB[22m
|
|
13
|
-
[34mℹ[39m [2mdist/[22m[1mcomponents/StreakCounter.js[22m [2m1.11 kB[22m [2m│ gzip: 0.59 kB[22m
|
|
14
|
-
[34mℹ[39m [2mdist/[22m[1mcomponents/ViewTabs.js[22m [2m1.10 kB[22m [2m│ gzip: 0.59 kB[22m
|
|
15
|
-
[34mℹ[39m [2mdist/[22m[1mexample.js[22m [2m0.90 kB[22m [2m│ gzip: 0.50 kB[22m
|
|
16
|
-
[34mℹ[39m [2mdist/[22m[1mdocs/learning-journey-ui-shared.docblock.js[22m [2m0.77 kB[22m [2m│ gzip: 0.45 kB[22m
|
|
17
|
-
[34mℹ[39m [2mdist/[22m[1mindex.js[22m [2m0.50 kB[22m [2m│ gzip: 0.20 kB[22m
|
|
18
|
-
[34mℹ[39m [2mdist/[22m[1mcomponents/index.js[22m [2m0.24 kB[22m [2m│ gzip: 0.12 kB[22m
|
|
19
|
-
[34mℹ[39m [2mdist/[22m[1mhooks/index.js[22m [2m0.10 kB[22m [2m│ gzip: 0.07 kB[22m
|
|
20
|
-
[34mℹ[39m [2mdist/[22m[1mdocs/index.js[22m [2m0.05 kB[22m [2m│ gzip: 0.07 kB[22m
|
|
21
|
-
[34mℹ[39m [2mdist/[22m[1mtypes.js[22m [2m0.00 kB[22m [2m│ gzip: 0.02 kB[22m
|
|
22
|
-
[34mℹ[39m [2mdist/[22mhooks/useLearningProgress.js.map [2m4.65 kB[22m [2m│ gzip: 1.63 kB[22m
|
|
23
|
-
[34mℹ[39m [2mdist/[22mcomponents/BadgeDisplay.js.map [2m2.37 kB[22m [2m│ gzip: 1.14 kB[22m
|
|
24
|
-
[34mℹ[39m [2mdist/[22mcomponents/XpBar.js.map [2m1.92 kB[22m [2m│ gzip: 0.90 kB[22m
|
|
25
|
-
[34mℹ[39m [2mdist/[22mcomponents/ViewTabs.js.map [2m1.82 kB[22m [2m│ gzip: 0.87 kB[22m
|
|
26
|
-
[34mℹ[39m [2mdist/[22mcomponents/StreakCounter.js.map [2m1.64 kB[22m [2m│ gzip: 0.79 kB[22m
|
|
27
|
-
[34mℹ[39m [2mdist/[22mexample.js.map [2m1.36 kB[22m [2m│ gzip: 0.69 kB[22m
|
|
28
|
-
[34mℹ[39m [2mdist/[22mdocs/learning-journey-ui-shared.docblock.js.map [2m1.09 kB[22m [2m│ gzip: 0.60 kB[22m
|
|
29
|
-
[34mℹ[39m [2mdist/[22mtypes.d.ts.map [2m0.67 kB[22m [2m│ gzip: 0.28 kB[22m
|
|
30
|
-
[34mℹ[39m [2mdist/[22mcomponents/XpBar.d.ts.map [2m0.21 kB[22m [2m│ gzip: 0.17 kB[22m
|
|
31
|
-
[34mℹ[39m [2mdist/[22mcomponents/StreakCounter.d.ts.map [2m0.21 kB[22m [2m│ gzip: 0.16 kB[22m
|
|
32
|
-
[34mℹ[39m [2mdist/[22mcomponents/BadgeDisplay.d.ts.map [2m0.21 kB[22m [2m│ gzip: 0.17 kB[22m
|
|
33
|
-
[34mℹ[39m [2mdist/[22mcomponents/ViewTabs.d.ts.map [2m0.20 kB[22m [2m│ gzip: 0.16 kB[22m
|
|
34
|
-
[34mℹ[39m [2mdist/[22mhooks/useLearningProgress.d.ts.map [2m0.18 kB[22m [2m│ gzip: 0.15 kB[22m
|
|
35
|
-
[34mℹ[39m [2mdist/[22mexample.d.ts.map [2m0.13 kB[22m [2m│ gzip: 0.13 kB[22m
|
|
36
|
-
[34mℹ[39m [2mdist/[22m[32m[1mtypes.d.ts[22m[39m [2m1.70 kB[22m [2m│ gzip: 0.61 kB[22m
|
|
37
|
-
[34mℹ[39m [2mdist/[22m[32m[1mindex.d.ts[22m[39m [2m0.81 kB[22m [2m│ gzip: 0.25 kB[22m
|
|
38
|
-
[34mℹ[39m [2mdist/[22m[32m[1mhooks/useLearningProgress.d.ts[22m[39m [2m0.72 kB[22m [2m│ gzip: 0.35 kB[22m
|
|
39
|
-
[34mℹ[39m [2mdist/[22m[32m[1mcomponents/StreakCounter.d.ts[22m[39m [2m0.35 kB[22m [2m│ gzip: 0.23 kB[22m
|
|
40
|
-
[34mℹ[39m [2mdist/[22m[32m[1mcomponents/BadgeDisplay.d.ts[22m[39m [2m0.35 kB[22m [2m│ gzip: 0.23 kB[22m
|
|
41
|
-
[34mℹ[39m [2mdist/[22m[32m[1mcomponents/ViewTabs.d.ts[22m[39m [2m0.34 kB[22m [2m│ gzip: 0.23 kB[22m
|
|
42
|
-
[34mℹ[39m [2mdist/[22m[32m[1mcomponents/XpBar.d.ts[22m[39m [2m0.32 kB[22m [2m│ gzip: 0.23 kB[22m
|
|
43
|
-
[34mℹ[39m [2mdist/[22m[32m[1mexample.d.ts[22m[39m [2m0.25 kB[22m [2m│ gzip: 0.17 kB[22m
|
|
44
|
-
[34mℹ[39m [2mdist/[22m[32m[1mcomponents/index.d.ts[22m[39m [2m0.24 kB[22m [2m│ gzip: 0.12 kB[22m
|
|
45
|
-
[34mℹ[39m [2mdist/[22m[32m[1mhooks/index.d.ts[22m[39m [2m0.10 kB[22m [2m│ gzip: 0.07 kB[22m
|
|
46
|
-
[34mℹ[39m [2mdist/[22m[32m[1mdocs/index.d.ts[22m[39m [2m0.01 kB[22m [2m│ gzip: 0.03 kB[22m
|
|
47
|
-
[34mℹ[39m [2mdist/[22m[32m[1mdocs/learning-journey-ui-shared.docblock.d.ts[22m[39m [2m0.01 kB[22m [2m│ gzip: 0.03 kB[22m
|
|
48
|
-
[34mℹ[39m 38 files, total: 32.00 kB
|
|
49
|
-
[33m[PLUGIN_TIMINGS] Warning:[0m Your build spent significant time in plugins. Here is a breakdown:
|
|
50
|
-
- tsdown:external (78%)
|
|
51
|
-
- rolldown-plugin-dts:generate (20%)
|
|
52
|
-
See https://rolldown.rs/options/checks#plugintimings for more details.
|
|
1
|
+
$ contractspec-bun-build prebuild
|
|
2
|
+
$ bun run prebuild && bun run build:bundle && bun run build:types
|
|
3
|
+
$ contractspec-bun-build prebuild
|
|
4
|
+
$ contractspec-bun-build transpile
|
|
5
|
+
[contractspec-bun-build] transpile target=bun root=src entries=12
|
|
6
|
+
Bundled 12 modules in 15ms
|
|
53
7
|
|
|
54
|
-
|
|
8
|
+
components/BadgeDisplay.js 1.79 KB (entry point)
|
|
9
|
+
./index.js 10.32 KB (entry point)
|
|
10
|
+
hooks/index.js 2.49 KB (entry point)
|
|
11
|
+
hooks/useLearningProgress.js 2.49 KB (entry point)
|
|
12
|
+
./types.js 8 bytes (entry point)
|
|
13
|
+
components/index.js 6.24 KB (entry point)
|
|
14
|
+
components/StreakCounter.js 1.29 KB (entry point)
|
|
15
|
+
components/ViewTabs.js 1.36 KB (entry point)
|
|
16
|
+
components/XpBar.js 1.79 KB (entry point)
|
|
17
|
+
docs/index.js 0.73 KB (entry point)
|
|
18
|
+
docs/learning-journey-ui-shared.docblock.js 0.73 KB (entry point)
|
|
19
|
+
./example.js 0.91 KB (entry point)
|
|
20
|
+
|
|
21
|
+
[contractspec-bun-build] transpile target=node root=src entries=12
|
|
22
|
+
Bundled 12 modules in 8ms
|
|
23
|
+
|
|
24
|
+
components/BadgeDisplay.js 1.78 KB (entry point)
|
|
25
|
+
./index.js 10.30 KB (entry point)
|
|
26
|
+
hooks/index.js 2.48 KB (entry point)
|
|
27
|
+
hooks/useLearningProgress.js 2.48 KB (entry point)
|
|
28
|
+
./types.js 0 KB (entry point)
|
|
29
|
+
components/index.js 6.23 KB (entry point)
|
|
30
|
+
components/StreakCounter.js 1.28 KB (entry point)
|
|
31
|
+
components/ViewTabs.js 1.35 KB (entry point)
|
|
32
|
+
components/XpBar.js 1.78 KB (entry point)
|
|
33
|
+
docs/index.js 0.72 KB (entry point)
|
|
34
|
+
docs/learning-journey-ui-shared.docblock.js 0.72 KB (entry point)
|
|
35
|
+
./example.js 0.90 KB (entry point)
|
|
36
|
+
|
|
37
|
+
[contractspec-bun-build] transpile target=browser root=src entries=12
|
|
38
|
+
Bundled 12 modules in 13ms
|
|
39
|
+
|
|
40
|
+
components/BadgeDisplay.js 1.78 KB (entry point)
|
|
41
|
+
./index.js 10.30 KB (entry point)
|
|
42
|
+
hooks/index.js 2.48 KB (entry point)
|
|
43
|
+
hooks/useLearningProgress.js 2.48 KB (entry point)
|
|
44
|
+
./types.js 0 KB (entry point)
|
|
45
|
+
components/index.js 6.23 KB (entry point)
|
|
46
|
+
components/StreakCounter.js 1.28 KB (entry point)
|
|
47
|
+
components/ViewTabs.js 1.35 KB (entry point)
|
|
48
|
+
components/XpBar.js 1.78 KB (entry point)
|
|
49
|
+
docs/index.js 0.72 KB (entry point)
|
|
50
|
+
docs/learning-journey-ui-shared.docblock.js 0.72 KB (entry point)
|
|
51
|
+
./example.js 0.90 KB (entry point)
|
|
52
|
+
|
|
53
|
+
$ contractspec-bun-build types
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
$ contractspec-bun-build prebuild
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @contractspec/example.learning-journey-ui-shared
|
|
2
2
|
|
|
3
|
+
## 1.58.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- d1f0fd0: chore: Migrate non-app package builds from tsdown to shared Bun tooling, add `@contractspec/tool.bun`, and standardize `prebuild`/`build`/`typecheck` with platform-aware exports and `tsc` declaration emission into `dist`.
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [d1f0fd0]
|
|
12
|
+
- Updated dependencies [4355a9e]
|
|
13
|
+
- @contractspec/module.learning-journey@1.58.0
|
|
14
|
+
- @contractspec/lib.design-system@1.58.0
|
|
15
|
+
- @contractspec/lib.ui-kit-web@1.58.0
|
|
16
|
+
- @contractspec/lib.contracts@1.58.0
|
|
17
|
+
|
|
3
18
|
## 1.57.0
|
|
4
19
|
|
|
5
20
|
### Minor Changes
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
// src/components/BadgeDisplay.tsx
|
|
2
|
+
import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
|
|
3
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
4
|
+
"use client";
|
|
5
|
+
var BADGE_ICONS = {
|
|
6
|
+
studio_first_30m: "\uD83C\uDFAF",
|
|
7
|
+
platform_tour: "\uD83D\uDDFA️",
|
|
8
|
+
crm_first_win: "\uD83C\uDFC6",
|
|
9
|
+
drill_master: "\uD83E\uDDE0",
|
|
10
|
+
coach_listener: "\uD83D\uDC42",
|
|
11
|
+
quest_complete: "⭐",
|
|
12
|
+
streak_7: "\uD83D\uDD25",
|
|
13
|
+
streak_30: "\uD83D\uDC8E",
|
|
14
|
+
default: "\uD83C\uDFC5"
|
|
15
|
+
};
|
|
16
|
+
var sizeStyles = {
|
|
17
|
+
sm: "h-6 w-6 text-sm",
|
|
18
|
+
md: "h-8 w-8 text-base",
|
|
19
|
+
lg: "h-10 w-10 text-lg"
|
|
20
|
+
};
|
|
21
|
+
function BadgeDisplay({
|
|
22
|
+
badges,
|
|
23
|
+
maxVisible = 5,
|
|
24
|
+
size = "md"
|
|
25
|
+
}) {
|
|
26
|
+
const visibleBadges = badges.slice(0, maxVisible);
|
|
27
|
+
const hiddenCount = badges.length - maxVisible;
|
|
28
|
+
if (badges.length === 0) {
|
|
29
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
30
|
+
className: "text-muted-foreground text-sm",
|
|
31
|
+
children: "No badges earned yet"
|
|
32
|
+
}, undefined, false, undefined, this);
|
|
33
|
+
}
|
|
34
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
35
|
+
className: "flex items-center gap-1",
|
|
36
|
+
children: [
|
|
37
|
+
visibleBadges.map((badge) => /* @__PURE__ */ jsxDEV("div", {
|
|
38
|
+
className: cn("flex items-center justify-center rounded-full bg-gradient-to-br from-amber-400/20 to-amber-600/20", sizeStyles[size]),
|
|
39
|
+
title: badge.replace(/_/g, " "),
|
|
40
|
+
children: BADGE_ICONS[badge] ?? BADGE_ICONS.default
|
|
41
|
+
}, badge, false, undefined, this)),
|
|
42
|
+
hiddenCount > 0 && /* @__PURE__ */ jsxDEV("div", {
|
|
43
|
+
className: cn("text-muted-foreground bg-muted flex items-center justify-center rounded-full", sizeStyles[size], "text-xs font-medium"),
|
|
44
|
+
children: [
|
|
45
|
+
"+",
|
|
46
|
+
hiddenCount
|
|
47
|
+
]
|
|
48
|
+
}, undefined, true, undefined, this)
|
|
49
|
+
]
|
|
50
|
+
}, undefined, true, undefined, this);
|
|
51
|
+
}
|
|
52
|
+
export {
|
|
53
|
+
BadgeDisplay
|
|
54
|
+
};
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
// src/components/StreakCounter.tsx
|
|
2
|
+
import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
|
|
3
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
4
|
+
"use client";
|
|
5
|
+
var sizeStyles = {
|
|
6
|
+
sm: {
|
|
7
|
+
container: "gap-1 px-2 py-1",
|
|
8
|
+
icon: "text-base",
|
|
9
|
+
text: "text-xs"
|
|
10
|
+
},
|
|
11
|
+
md: {
|
|
12
|
+
container: "gap-1.5 px-3 py-1.5",
|
|
13
|
+
icon: "text-lg",
|
|
14
|
+
text: "text-sm"
|
|
15
|
+
},
|
|
16
|
+
lg: {
|
|
17
|
+
container: "gap-2 px-4 py-2",
|
|
18
|
+
icon: "text-xl",
|
|
19
|
+
text: "text-base"
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
function StreakCounter({
|
|
23
|
+
days,
|
|
24
|
+
isActive = true,
|
|
25
|
+
size = "md"
|
|
26
|
+
}) {
|
|
27
|
+
const styles = sizeStyles[size];
|
|
28
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
29
|
+
className: cn("inline-flex items-center rounded-full font-semibold", styles.container, isActive ? "bg-orange-500/10 text-orange-500" : "bg-muted text-muted-foreground"),
|
|
30
|
+
children: [
|
|
31
|
+
/* @__PURE__ */ jsxDEV("span", {
|
|
32
|
+
className: styles.icon,
|
|
33
|
+
role: "img",
|
|
34
|
+
"aria-label": "streak",
|
|
35
|
+
children: "\uD83D\uDD25"
|
|
36
|
+
}, undefined, false, undefined, this),
|
|
37
|
+
/* @__PURE__ */ jsxDEV("span", {
|
|
38
|
+
className: styles.text,
|
|
39
|
+
children: [
|
|
40
|
+
days,
|
|
41
|
+
" ",
|
|
42
|
+
days === 1 ? "day" : "days"
|
|
43
|
+
]
|
|
44
|
+
}, undefined, true, undefined, this)
|
|
45
|
+
]
|
|
46
|
+
}, undefined, true, undefined, this);
|
|
47
|
+
}
|
|
48
|
+
export {
|
|
49
|
+
StreakCounter
|
|
50
|
+
};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
// src/components/ViewTabs.tsx
|
|
2
|
+
import { Button } from "@contractspec/lib.design-system";
|
|
3
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
4
|
+
"use client";
|
|
5
|
+
var VIEW_LABELS = {
|
|
6
|
+
overview: { label: "Overview", icon: "\uD83D\uDCCA" },
|
|
7
|
+
steps: { label: "Steps", icon: "\uD83D\uDCDD" },
|
|
8
|
+
progress: { label: "Progress", icon: "\uD83D\uDCC8" },
|
|
9
|
+
timeline: { label: "Timeline", icon: "\uD83D\uDCC5" }
|
|
10
|
+
};
|
|
11
|
+
var DEFAULT_VIEWS = [
|
|
12
|
+
"overview",
|
|
13
|
+
"steps",
|
|
14
|
+
"progress",
|
|
15
|
+
"timeline"
|
|
16
|
+
];
|
|
17
|
+
function ViewTabs({
|
|
18
|
+
currentView,
|
|
19
|
+
onViewChange,
|
|
20
|
+
availableViews = DEFAULT_VIEWS
|
|
21
|
+
}) {
|
|
22
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
23
|
+
className: "flex flex-wrap gap-2",
|
|
24
|
+
children: availableViews.map((view) => {
|
|
25
|
+
const { label, icon } = VIEW_LABELS[view];
|
|
26
|
+
const isActive = currentView === view;
|
|
27
|
+
return /* @__PURE__ */ jsxDEV(Button, {
|
|
28
|
+
variant: isActive ? "default" : "outline",
|
|
29
|
+
size: "sm",
|
|
30
|
+
onClick: () => onViewChange(view),
|
|
31
|
+
className: "gap-1.5",
|
|
32
|
+
children: [
|
|
33
|
+
/* @__PURE__ */ jsxDEV("span", {
|
|
34
|
+
children: icon
|
|
35
|
+
}, undefined, false, undefined, this),
|
|
36
|
+
/* @__PURE__ */ jsxDEV("span", {
|
|
37
|
+
children: label
|
|
38
|
+
}, undefined, false, undefined, this)
|
|
39
|
+
]
|
|
40
|
+
}, view, true, undefined, this);
|
|
41
|
+
})
|
|
42
|
+
}, undefined, false, undefined, this);
|
|
43
|
+
}
|
|
44
|
+
export {
|
|
45
|
+
ViewTabs
|
|
46
|
+
};
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
// src/components/XpBar.tsx
|
|
2
|
+
import { Progress } from "@contractspec/lib.ui-kit-web/ui/progress";
|
|
3
|
+
import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
|
|
4
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
5
|
+
"use client";
|
|
6
|
+
var sizeStyles = {
|
|
7
|
+
sm: "h-2",
|
|
8
|
+
md: "h-3",
|
|
9
|
+
lg: "h-4"
|
|
10
|
+
};
|
|
11
|
+
var labelSizeStyles = {
|
|
12
|
+
sm: "text-xs",
|
|
13
|
+
md: "text-sm",
|
|
14
|
+
lg: "text-base"
|
|
15
|
+
};
|
|
16
|
+
function XpBar({
|
|
17
|
+
current,
|
|
18
|
+
max,
|
|
19
|
+
level,
|
|
20
|
+
showLabel = true,
|
|
21
|
+
size = "md"
|
|
22
|
+
}) {
|
|
23
|
+
const percentage = max > 0 ? Math.min(current / max * 100, 100) : 0;
|
|
24
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
25
|
+
className: "w-full space-y-1",
|
|
26
|
+
children: [
|
|
27
|
+
showLabel && /* @__PURE__ */ jsxDEV("div", {
|
|
28
|
+
className: cn("flex items-center justify-between", labelSizeStyles[size]),
|
|
29
|
+
children: [
|
|
30
|
+
/* @__PURE__ */ jsxDEV("span", {
|
|
31
|
+
className: "text-muted-foreground font-medium",
|
|
32
|
+
children: [
|
|
33
|
+
level !== undefined && /* @__PURE__ */ jsxDEV("span", {
|
|
34
|
+
className: "text-primary mr-1",
|
|
35
|
+
children: [
|
|
36
|
+
"Lvl ",
|
|
37
|
+
level
|
|
38
|
+
]
|
|
39
|
+
}, undefined, true, undefined, this),
|
|
40
|
+
"XP"
|
|
41
|
+
]
|
|
42
|
+
}, undefined, true, undefined, this),
|
|
43
|
+
/* @__PURE__ */ jsxDEV("span", {
|
|
44
|
+
className: "font-semibold",
|
|
45
|
+
children: [
|
|
46
|
+
current.toLocaleString(),
|
|
47
|
+
" / ",
|
|
48
|
+
max.toLocaleString()
|
|
49
|
+
]
|
|
50
|
+
}, undefined, true, undefined, this)
|
|
51
|
+
]
|
|
52
|
+
}, undefined, true, undefined, this),
|
|
53
|
+
/* @__PURE__ */ jsxDEV(Progress, {
|
|
54
|
+
value: percentage,
|
|
55
|
+
className: cn("bg-muted", sizeStyles[size])
|
|
56
|
+
}, undefined, false, undefined, this)
|
|
57
|
+
]
|
|
58
|
+
}, undefined, true, undefined, this);
|
|
59
|
+
}
|
|
60
|
+
export {
|
|
61
|
+
XpBar
|
|
62
|
+
};
|
|
@@ -0,0 +1,209 @@
|
|
|
1
|
+
// src/components/BadgeDisplay.tsx
|
|
2
|
+
import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
|
|
3
|
+
import { jsxDEV } from "react/jsx-dev-runtime";
|
|
4
|
+
"use client";
|
|
5
|
+
var BADGE_ICONS = {
|
|
6
|
+
studio_first_30m: "\uD83C\uDFAF",
|
|
7
|
+
platform_tour: "\uD83D\uDDFA️",
|
|
8
|
+
crm_first_win: "\uD83C\uDFC6",
|
|
9
|
+
drill_master: "\uD83E\uDDE0",
|
|
10
|
+
coach_listener: "\uD83D\uDC42",
|
|
11
|
+
quest_complete: "⭐",
|
|
12
|
+
streak_7: "\uD83D\uDD25",
|
|
13
|
+
streak_30: "\uD83D\uDC8E",
|
|
14
|
+
default: "\uD83C\uDFC5"
|
|
15
|
+
};
|
|
16
|
+
var sizeStyles = {
|
|
17
|
+
sm: "h-6 w-6 text-sm",
|
|
18
|
+
md: "h-8 w-8 text-base",
|
|
19
|
+
lg: "h-10 w-10 text-lg"
|
|
20
|
+
};
|
|
21
|
+
function BadgeDisplay({
|
|
22
|
+
badges,
|
|
23
|
+
maxVisible = 5,
|
|
24
|
+
size = "md"
|
|
25
|
+
}) {
|
|
26
|
+
const visibleBadges = badges.slice(0, maxVisible);
|
|
27
|
+
const hiddenCount = badges.length - maxVisible;
|
|
28
|
+
if (badges.length === 0) {
|
|
29
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
30
|
+
className: "text-muted-foreground text-sm",
|
|
31
|
+
children: "No badges earned yet"
|
|
32
|
+
}, undefined, false, undefined, this);
|
|
33
|
+
}
|
|
34
|
+
return /* @__PURE__ */ jsxDEV("div", {
|
|
35
|
+
className: "flex items-center gap-1",
|
|
36
|
+
children: [
|
|
37
|
+
visibleBadges.map((badge) => /* @__PURE__ */ jsxDEV("div", {
|
|
38
|
+
className: cn("flex items-center justify-center rounded-full bg-gradient-to-br from-amber-400/20 to-amber-600/20", sizeStyles[size]),
|
|
39
|
+
title: badge.replace(/_/g, " "),
|
|
40
|
+
children: BADGE_ICONS[badge] ?? BADGE_ICONS.default
|
|
41
|
+
}, badge, false, undefined, this)),
|
|
42
|
+
hiddenCount > 0 && /* @__PURE__ */ jsxDEV("div", {
|
|
43
|
+
className: cn("text-muted-foreground bg-muted flex items-center justify-center rounded-full", sizeStyles[size], "text-xs font-medium"),
|
|
44
|
+
children: [
|
|
45
|
+
"+",
|
|
46
|
+
hiddenCount
|
|
47
|
+
]
|
|
48
|
+
}, undefined, true, undefined, this)
|
|
49
|
+
]
|
|
50
|
+
}, undefined, true, undefined, this);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
// src/components/StreakCounter.tsx
|
|
54
|
+
import { cn as cn2 } from "@contractspec/lib.ui-kit-web/ui/utils";
|
|
55
|
+
import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
|
|
56
|
+
"use client";
|
|
57
|
+
var sizeStyles2 = {
|
|
58
|
+
sm: {
|
|
59
|
+
container: "gap-1 px-2 py-1",
|
|
60
|
+
icon: "text-base",
|
|
61
|
+
text: "text-xs"
|
|
62
|
+
},
|
|
63
|
+
md: {
|
|
64
|
+
container: "gap-1.5 px-3 py-1.5",
|
|
65
|
+
icon: "text-lg",
|
|
66
|
+
text: "text-sm"
|
|
67
|
+
},
|
|
68
|
+
lg: {
|
|
69
|
+
container: "gap-2 px-4 py-2",
|
|
70
|
+
icon: "text-xl",
|
|
71
|
+
text: "text-base"
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
function StreakCounter({
|
|
75
|
+
days,
|
|
76
|
+
isActive = true,
|
|
77
|
+
size = "md"
|
|
78
|
+
}) {
|
|
79
|
+
const styles = sizeStyles2[size];
|
|
80
|
+
return /* @__PURE__ */ jsxDEV2("div", {
|
|
81
|
+
className: cn2("inline-flex items-center rounded-full font-semibold", styles.container, isActive ? "bg-orange-500/10 text-orange-500" : "bg-muted text-muted-foreground"),
|
|
82
|
+
children: [
|
|
83
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
84
|
+
className: styles.icon,
|
|
85
|
+
role: "img",
|
|
86
|
+
"aria-label": "streak",
|
|
87
|
+
children: "\uD83D\uDD25"
|
|
88
|
+
}, undefined, false, undefined, this),
|
|
89
|
+
/* @__PURE__ */ jsxDEV2("span", {
|
|
90
|
+
className: styles.text,
|
|
91
|
+
children: [
|
|
92
|
+
days,
|
|
93
|
+
" ",
|
|
94
|
+
days === 1 ? "day" : "days"
|
|
95
|
+
]
|
|
96
|
+
}, undefined, true, undefined, this)
|
|
97
|
+
]
|
|
98
|
+
}, undefined, true, undefined, this);
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
// src/components/ViewTabs.tsx
|
|
102
|
+
import { Button } from "@contractspec/lib.design-system";
|
|
103
|
+
import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
|
|
104
|
+
"use client";
|
|
105
|
+
var VIEW_LABELS = {
|
|
106
|
+
overview: { label: "Overview", icon: "\uD83D\uDCCA" },
|
|
107
|
+
steps: { label: "Steps", icon: "\uD83D\uDCDD" },
|
|
108
|
+
progress: { label: "Progress", icon: "\uD83D\uDCC8" },
|
|
109
|
+
timeline: { label: "Timeline", icon: "\uD83D\uDCC5" }
|
|
110
|
+
};
|
|
111
|
+
var DEFAULT_VIEWS = [
|
|
112
|
+
"overview",
|
|
113
|
+
"steps",
|
|
114
|
+
"progress",
|
|
115
|
+
"timeline"
|
|
116
|
+
];
|
|
117
|
+
function ViewTabs({
|
|
118
|
+
currentView,
|
|
119
|
+
onViewChange,
|
|
120
|
+
availableViews = DEFAULT_VIEWS
|
|
121
|
+
}) {
|
|
122
|
+
return /* @__PURE__ */ jsxDEV3("div", {
|
|
123
|
+
className: "flex flex-wrap gap-2",
|
|
124
|
+
children: availableViews.map((view) => {
|
|
125
|
+
const { label, icon } = VIEW_LABELS[view];
|
|
126
|
+
const isActive = currentView === view;
|
|
127
|
+
return /* @__PURE__ */ jsxDEV3(Button, {
|
|
128
|
+
variant: isActive ? "default" : "outline",
|
|
129
|
+
size: "sm",
|
|
130
|
+
onClick: () => onViewChange(view),
|
|
131
|
+
className: "gap-1.5",
|
|
132
|
+
children: [
|
|
133
|
+
/* @__PURE__ */ jsxDEV3("span", {
|
|
134
|
+
children: icon
|
|
135
|
+
}, undefined, false, undefined, this),
|
|
136
|
+
/* @__PURE__ */ jsxDEV3("span", {
|
|
137
|
+
children: label
|
|
138
|
+
}, undefined, false, undefined, this)
|
|
139
|
+
]
|
|
140
|
+
}, view, true, undefined, this);
|
|
141
|
+
})
|
|
142
|
+
}, undefined, false, undefined, this);
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
// src/components/XpBar.tsx
|
|
146
|
+
import { Progress } from "@contractspec/lib.ui-kit-web/ui/progress";
|
|
147
|
+
import { cn as cn3 } from "@contractspec/lib.ui-kit-web/ui/utils";
|
|
148
|
+
import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
|
|
149
|
+
"use client";
|
|
150
|
+
var sizeStyles3 = {
|
|
151
|
+
sm: "h-2",
|
|
152
|
+
md: "h-3",
|
|
153
|
+
lg: "h-4"
|
|
154
|
+
};
|
|
155
|
+
var labelSizeStyles = {
|
|
156
|
+
sm: "text-xs",
|
|
157
|
+
md: "text-sm",
|
|
158
|
+
lg: "text-base"
|
|
159
|
+
};
|
|
160
|
+
function XpBar({
|
|
161
|
+
current,
|
|
162
|
+
max,
|
|
163
|
+
level,
|
|
164
|
+
showLabel = true,
|
|
165
|
+
size = "md"
|
|
166
|
+
}) {
|
|
167
|
+
const percentage = max > 0 ? Math.min(current / max * 100, 100) : 0;
|
|
168
|
+
return /* @__PURE__ */ jsxDEV4("div", {
|
|
169
|
+
className: "w-full space-y-1",
|
|
170
|
+
children: [
|
|
171
|
+
showLabel && /* @__PURE__ */ jsxDEV4("div", {
|
|
172
|
+
className: cn3("flex items-center justify-between", labelSizeStyles[size]),
|
|
173
|
+
children: [
|
|
174
|
+
/* @__PURE__ */ jsxDEV4("span", {
|
|
175
|
+
className: "text-muted-foreground font-medium",
|
|
176
|
+
children: [
|
|
177
|
+
level !== undefined && /* @__PURE__ */ jsxDEV4("span", {
|
|
178
|
+
className: "text-primary mr-1",
|
|
179
|
+
children: [
|
|
180
|
+
"Lvl ",
|
|
181
|
+
level
|
|
182
|
+
]
|
|
183
|
+
}, undefined, true, undefined, this),
|
|
184
|
+
"XP"
|
|
185
|
+
]
|
|
186
|
+
}, undefined, true, undefined, this),
|
|
187
|
+
/* @__PURE__ */ jsxDEV4("span", {
|
|
188
|
+
className: "font-semibold",
|
|
189
|
+
children: [
|
|
190
|
+
current.toLocaleString(),
|
|
191
|
+
" / ",
|
|
192
|
+
max.toLocaleString()
|
|
193
|
+
]
|
|
194
|
+
}, undefined, true, undefined, this)
|
|
195
|
+
]
|
|
196
|
+
}, undefined, true, undefined, this),
|
|
197
|
+
/* @__PURE__ */ jsxDEV4(Progress, {
|
|
198
|
+
value: percentage,
|
|
199
|
+
className: cn3("bg-muted", sizeStyles3[size])
|
|
200
|
+
}, undefined, false, undefined, this)
|
|
201
|
+
]
|
|
202
|
+
}, undefined, true, undefined, this);
|
|
203
|
+
}
|
|
204
|
+
export {
|
|
205
|
+
XpBar,
|
|
206
|
+
ViewTabs,
|
|
207
|
+
StreakCounter,
|
|
208
|
+
BadgeDisplay
|
|
209
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
// src/docs/learning-journey-ui-shared.docblock.ts
|
|
2
|
+
import { registerDocBlocks } from "@contractspec/lib.contracts/docs";
|
|
3
|
+
var blocks = [
|
|
4
|
+
{
|
|
5
|
+
id: "docs.examples.learning-journey-ui-shared",
|
|
6
|
+
title: "Learning Journey UI — Shared",
|
|
7
|
+
summary: "Shared UI components and hooks for learning journey mini-apps.",
|
|
8
|
+
kind: "reference",
|
|
9
|
+
visibility: "public",
|
|
10
|
+
route: "/docs/examples/learning-journey-ui-shared",
|
|
11
|
+
tags: ["learning", "ui", "shared"],
|
|
12
|
+
body: `## Includes
|
|
13
|
+
- Hooks: useLearningProgress
|
|
14
|
+
- Components: XpBar, StreakCounter, BadgeDisplay, ViewTabs
|
|
15
|
+
|
|
16
|
+
## Notes
|
|
17
|
+
- Keep components accessible (labels, focus, contrast).
|
|
18
|
+
- Prefer design-system tokens and components.`
|
|
19
|
+
}
|
|
20
|
+
];
|
|
21
|
+
registerDocBlocks(blocks);
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
// src/docs/learning-journey-ui-shared.docblock.ts
|
|
2
|
+
import { registerDocBlocks } from "@contractspec/lib.contracts/docs";
|
|
3
|
+
var blocks = [
|
|
4
|
+
{
|
|
5
|
+
id: "docs.examples.learning-journey-ui-shared",
|
|
6
|
+
title: "Learning Journey UI — Shared",
|
|
7
|
+
summary: "Shared UI components and hooks for learning journey mini-apps.",
|
|
8
|
+
kind: "reference",
|
|
9
|
+
visibility: "public",
|
|
10
|
+
route: "/docs/examples/learning-journey-ui-shared",
|
|
11
|
+
tags: ["learning", "ui", "shared"],
|
|
12
|
+
body: `## Includes
|
|
13
|
+
- Hooks: useLearningProgress
|
|
14
|
+
- Components: XpBar, StreakCounter, BadgeDisplay, ViewTabs
|
|
15
|
+
|
|
16
|
+
## Notes
|
|
17
|
+
- Keep components accessible (labels, focus, contrast).
|
|
18
|
+
- Prefer design-system tokens and components.`
|
|
19
|
+
}
|
|
20
|
+
];
|
|
21
|
+
registerDocBlocks(blocks);
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
// src/example.ts
|
|
2
|
+
import { defineExample } from "@contractspec/lib.contracts";
|
|
3
|
+
var example = defineExample({
|
|
4
|
+
meta: {
|
|
5
|
+
key: "learning-journey-ui-shared",
|
|
6
|
+
version: "1.0.0",
|
|
7
|
+
title: "Learning Journey UI — Shared",
|
|
8
|
+
description: "Shared UI components and hooks for learning journey mini-apps.",
|
|
9
|
+
kind: "ui",
|
|
10
|
+
visibility: "public",
|
|
11
|
+
stability: "experimental",
|
|
12
|
+
owners: ["@platform.core"],
|
|
13
|
+
tags: ["learning", "ui", "shared"]
|
|
14
|
+
},
|
|
15
|
+
docs: {
|
|
16
|
+
rootDocId: "docs.examples.learning-journey-ui-shared"
|
|
17
|
+
},
|
|
18
|
+
entrypoints: {
|
|
19
|
+
packageName: "@contractspec/example.learning-journey-ui-shared",
|
|
20
|
+
docs: "./docs"
|
|
21
|
+
},
|
|
22
|
+
surfaces: {
|
|
23
|
+
templates: true,
|
|
24
|
+
sandbox: { enabled: true, modes: ["playground", "markdown"] },
|
|
25
|
+
studio: { enabled: true, installable: true },
|
|
26
|
+
mcp: { enabled: true }
|
|
27
|
+
}
|
|
28
|
+
});
|
|
29
|
+
var example_default = example;
|
|
30
|
+
export {
|
|
31
|
+
example_default as default
|
|
32
|
+
};
|