vue-kaspa-cli 0.1.6 → 0.1.8
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/bin/index.mjs +32 -0
- package/package.json +1 -1
- package/templates/nuxt/_package.json +3 -6
- package/templates/nuxt/app/components/KaspaStatus.vue +62 -30
- package/templates/nuxt/nuxt.config.ts +0 -5
- package/templates/vue/_package.json +8 -8
- package/templates/vue/src/components/KaspaStatus.vue +105 -30
package/bin/index.mjs
CHANGED
|
@@ -25,6 +25,33 @@ function copyDir(src, dest) {
|
|
|
25
25
|
}
|
|
26
26
|
}
|
|
27
27
|
|
|
28
|
+
async function resolveVersion(pkg) {
|
|
29
|
+
try {
|
|
30
|
+
const res = await fetch(`https://registry.npmjs.org/${encodeURIComponent(pkg)}/latest`, {
|
|
31
|
+
headers: { Accept: 'application/vnd.npm.install-v1+json' },
|
|
32
|
+
})
|
|
33
|
+
if (!res.ok) return 'latest'
|
|
34
|
+
const data = await res.json()
|
|
35
|
+
return `^${data.version}`
|
|
36
|
+
} catch {
|
|
37
|
+
return 'latest'
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
async function resolvePackageVersions(pkg) {
|
|
42
|
+
const allNames = [
|
|
43
|
+
...Object.keys(pkg.dependencies ?? {}),
|
|
44
|
+
...Object.keys(pkg.devDependencies ?? {}),
|
|
45
|
+
]
|
|
46
|
+
const entries = await Promise.all(allNames.map(async name => [name, await resolveVersion(name)]))
|
|
47
|
+
const resolved = Object.fromEntries(entries)
|
|
48
|
+
for (const section of ['dependencies', 'devDependencies']) {
|
|
49
|
+
for (const name of Object.keys(pkg[section] ?? {})) {
|
|
50
|
+
pkg[section][name] = resolved[name]
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
28
55
|
const prompt = createPromptModule()
|
|
29
56
|
|
|
30
57
|
async function main() {
|
|
@@ -59,6 +86,11 @@ async function main() {
|
|
|
59
86
|
const pkgPath = join(targetDir, 'package.json')
|
|
60
87
|
const pkg = JSON.parse(readFileSync(pkgPath, 'utf8'))
|
|
61
88
|
pkg.name = name.toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '')
|
|
89
|
+
|
|
90
|
+
process.stdout.write(' Resolving latest package versions…')
|
|
91
|
+
await resolvePackageVersions(pkg)
|
|
92
|
+
process.stdout.write(' done\n')
|
|
93
|
+
|
|
62
94
|
writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + '\n')
|
|
63
95
|
|
|
64
96
|
const editHint = framework === 'Nuxt'
|
package/package.json
CHANGED
|
@@ -9,11 +9,8 @@
|
|
|
9
9
|
"generate": "nuxt generate"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
|
-
"@vue-kaspa/kaspa-wasm": "
|
|
13
|
-
"nuxt": "
|
|
14
|
-
"vue-kaspa": "
|
|
15
|
-
},
|
|
16
|
-
"devDependencies": {
|
|
17
|
-
"vite-plugin-wasm": "^3.6.0"
|
|
12
|
+
"@vue-kaspa/kaspa-wasm": "latest",
|
|
13
|
+
"nuxt": "latest",
|
|
14
|
+
"vue-kaspa": "latest"
|
|
18
15
|
}
|
|
19
16
|
}
|
|
@@ -28,43 +28,75 @@ const badgeColor = computed(() => {
|
|
|
28
28
|
const daaScore = computed(() =>
|
|
29
29
|
rpc.virtualDaaScore.value > 0n ? rpc.virtualDaaScore.value.toLocaleString() : '—'
|
|
30
30
|
)
|
|
31
|
+
|
|
32
|
+
const links = [
|
|
33
|
+
{ label: 'Faucet', title: 'Testnet 10', href: 'https://faucet-tn10.kaspanet.io/' },
|
|
34
|
+
{ label: 'Faucet', title: 'Testnet 12', href: 'https://faucet-tn12.kaspanet.io/' },
|
|
35
|
+
{ label: 'Docs', title: 'vue-kaspa', href: 'https://vue-kaspa.vercel.app/' },
|
|
36
|
+
{ label: 'Explorer', title: 'Testnet 10', href: 'https://tn10.kaspa.stream/' },
|
|
37
|
+
{ label: 'Explorer', title: 'Testnet 12', href: 'https://tn12.kaspa.stream/' },
|
|
38
|
+
{ label: 'Explorer', title: 'Mainnet', href: 'https://kaspa.stream/' },
|
|
39
|
+
]
|
|
31
40
|
</script>
|
|
32
41
|
|
|
33
42
|
<template>
|
|
34
|
-
<div style="width:100%;max-width:480px;
|
|
35
|
-
<header style="display:flex;align-items:center;gap:.75rem;">
|
|
36
|
-
<span style="font-size:1.75rem;color:#49c5a3;line-height:1;">⬡</span>
|
|
37
|
-
<h1 style="font-size:1.25rem;font-weight:600;color:#1a1a1a;flex:1;margin:0;">vue-kaspa</h1>
|
|
38
|
-
<span :style="`font-size:.75rem;font-weight:500;padding:.2em .65em;border-radius:999px;border:1px solid ${badgeColor};color:${badgeColor};white-space:nowrap;`">
|
|
39
|
-
{{ stateLabel }}
|
|
40
|
-
</span>
|
|
41
|
-
</header>
|
|
43
|
+
<div style="width:100%;max-width:480px;display:flex;flex-direction:column;gap:0.75rem;font-family:Inter,system-ui,sans-serif;">
|
|
42
44
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
<span style="font-size
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
<span style="font-size:.95rem;color:#1a1a1a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{ rpc.serverVersion.value ?? '—' }}</span>
|
|
51
|
-
</div>
|
|
52
|
-
<div style="display:flex;flex-direction:column;gap:.25rem;">
|
|
53
|
-
<span style="font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">DAA Score</span>
|
|
54
|
-
<span style="font-size:.95rem;color:#1a1a1a;font-family:monospace;">{{ daaScore }}</span>
|
|
55
|
-
</div>
|
|
56
|
-
<div style="display:flex;flex-direction:column;gap:.25rem;">
|
|
57
|
-
<span style="font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">Synced</span>
|
|
58
|
-
<span :style="`font-size:.95rem;color:${rpc.isConnected.value ? (rpc.isSynced.value ? '#4caf50' : '#1a1a1a') : '#9ca3af'};`">
|
|
59
|
-
{{ rpc.isConnected.value ? (rpc.isSynced.value ? 'Yes' : 'Syncing…') : '—' }}
|
|
45
|
+
<!-- Network status card (unchanged) -->
|
|
46
|
+
<div style="padding:2rem;border:1px solid #e2e8f0;border-radius:10px;background:#f9f9f9;display:flex;flex-direction:column;gap:1.5rem;">
|
|
47
|
+
<header style="display:flex;align-items:center;gap:.75rem;">
|
|
48
|
+
<span style="font-size:1.75rem;color:#49c5a3;line-height:1;">⬡</span>
|
|
49
|
+
<h1 style="font-size:1.25rem;font-weight:600;color:#1a1a1a;flex:1;margin:0;">vue-kaspa</h1>
|
|
50
|
+
<span :style="`font-size:.75rem;font-weight:500;padding:.2em .65em;border-radius:999px;border:1px solid ${badgeColor};color:${badgeColor};white-space:nowrap;`">
|
|
51
|
+
{{ stateLabel }}
|
|
60
52
|
</span>
|
|
53
|
+
</header>
|
|
54
|
+
|
|
55
|
+
<div style="display:grid;grid-template-columns:1fr 1fr;gap:1rem;">
|
|
56
|
+
<div style="display:flex;flex-direction:column;gap:.25rem;">
|
|
57
|
+
<span style="font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">Network</span>
|
|
58
|
+
<span style="font-size:.95rem;color:#1a1a1a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{ rpc.networkId.value ?? '—' }}</span>
|
|
59
|
+
</div>
|
|
60
|
+
<div style="display:flex;flex-direction:column;gap:.25rem;">
|
|
61
|
+
<span style="font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">Server version</span>
|
|
62
|
+
<span style="font-size:.95rem;color:#1a1a1a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{ rpc.serverVersion.value ?? '—' }}</span>
|
|
63
|
+
</div>
|
|
64
|
+
<div style="display:flex;flex-direction:column;gap:.25rem;">
|
|
65
|
+
<span style="font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">DAA Score</span>
|
|
66
|
+
<span style="font-size:.95rem;color:#1a1a1a;font-family:monospace;">{{ daaScore }}</span>
|
|
67
|
+
</div>
|
|
68
|
+
<div style="display:flex;flex-direction:column;gap:.25rem;">
|
|
69
|
+
<span style="font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">Synced</span>
|
|
70
|
+
<span :style="`font-size:.95rem;color:${rpc.isConnected.value ? (rpc.isSynced.value ? '#4caf50' : '#1a1a1a') : '#9ca3af'};`">
|
|
71
|
+
{{ rpc.isConnected.value ? (rpc.isSynced.value ? 'Yes' : 'Syncing…') : '—' }}
|
|
72
|
+
</span>
|
|
73
|
+
</div>
|
|
61
74
|
</div>
|
|
75
|
+
|
|
76
|
+
<footer style="display:flex;align-items:center;gap:.5rem;font-size:.85rem;border-top:1px solid #e2e8f0;padding-top:1rem;">
|
|
77
|
+
<a href="https://vue-kaspa.vercel.app" target="_blank" rel="noopener" style="color:#374151;text-decoration:none;">Docs</a>
|
|
78
|
+
<span>·</span>
|
|
79
|
+
<a href="https://github.com/furatamasensei/vue-kaspa" target="_blank" rel="noopener" style="color:#374151;text-decoration:none;">GitHub</a>
|
|
80
|
+
</footer>
|
|
81
|
+
</div>
|
|
82
|
+
|
|
83
|
+
<!-- Bento link cards -->
|
|
84
|
+
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:0.75rem;">
|
|
85
|
+
<a
|
|
86
|
+
v-for="link in links"
|
|
87
|
+
:key="link.href"
|
|
88
|
+
:href="link.href"
|
|
89
|
+
target="_blank"
|
|
90
|
+
rel="noopener"
|
|
91
|
+
style="display:flex;flex-direction:column;justify-content:space-between;gap:0.75rem;padding:1rem;border:1px solid #e2e8f0;border-radius:10px;background:#f9f9f9;text-decoration:none;cursor:pointer;"
|
|
92
|
+
>
|
|
93
|
+
<div style="display:flex;justify-content:space-between;align-items:center;">
|
|
94
|
+
<span style="font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;">{{ link.label }}</span>
|
|
95
|
+
<span style="font-size:.75rem;color:#9ca3af;">↗</span>
|
|
96
|
+
</div>
|
|
97
|
+
<span style="font-size:.85rem;font-weight:600;color:#1a1a1a;">{{ link.title }}</span>
|
|
98
|
+
</a>
|
|
62
99
|
</div>
|
|
63
100
|
|
|
64
|
-
<footer style="display:flex;align-items:center;gap:.5rem;font-size:.85rem;border-top:1px solid #e2e8f0;padding-top:1rem;">
|
|
65
|
-
<a href="https://vue-kaspa.vercel.app" target="_blank" rel="noopener" style="color:#374151;text-decoration:none;">Docs</a>
|
|
66
|
-
<span>·</span>
|
|
67
|
-
<a href="https://github.com/furatamasensei/vue-kaspa" target="_blank" rel="noopener" style="color:#374151;text-decoration:none;">GitHub</a>
|
|
68
|
-
</footer>
|
|
69
101
|
</div>
|
|
70
102
|
</template>
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import wasm from 'vite-plugin-wasm'
|
|
2
|
-
|
|
3
1
|
export default defineNuxtConfig({
|
|
4
2
|
compatibilityDate: '2024-11-01',
|
|
5
3
|
modules: ['vue-kaspa/nuxt'],
|
|
@@ -7,7 +5,4 @@ export default defineNuxtConfig({
|
|
|
7
5
|
network: 'mainnet',
|
|
8
6
|
autoConnect: true,
|
|
9
7
|
},
|
|
10
|
-
vite: {
|
|
11
|
-
plugins: [wasm()],
|
|
12
|
-
},
|
|
13
8
|
})
|
|
@@ -10,15 +10,15 @@
|
|
|
10
10
|
"typecheck": "vue-tsc --noEmit"
|
|
11
11
|
},
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@vue-kaspa/kaspa-wasm": "
|
|
14
|
-
"vue": "
|
|
15
|
-
"vue-kaspa": "
|
|
13
|
+
"@vue-kaspa/kaspa-wasm": "latest",
|
|
14
|
+
"vue": "latest",
|
|
15
|
+
"vue-kaspa": "latest"
|
|
16
16
|
},
|
|
17
17
|
"devDependencies": {
|
|
18
|
-
"@vitejs/plugin-vue": "
|
|
19
|
-
"typescript": "
|
|
20
|
-
"vite": "
|
|
21
|
-
"vite-plugin-wasm": "
|
|
22
|
-
"vue-tsc": "
|
|
18
|
+
"@vitejs/plugin-vue": "latest",
|
|
19
|
+
"typescript": "latest",
|
|
20
|
+
"vite": "latest",
|
|
21
|
+
"vite-plugin-wasm": "latest",
|
|
22
|
+
"vue-tsc": "latest"
|
|
23
23
|
}
|
|
24
24
|
}
|
|
@@ -27,49 +27,86 @@ const stateClass = computed(() => {
|
|
|
27
27
|
const daaScore = computed(() =>
|
|
28
28
|
rpc.virtualDaaScore.value > 0n ? rpc.virtualDaaScore.value.toLocaleString() : '—'
|
|
29
29
|
)
|
|
30
|
+
|
|
31
|
+
const links = [
|
|
32
|
+
{ label: 'Faucet', title: 'Testnet 10', href: 'https://faucet-tn10.kaspanet.io/' },
|
|
33
|
+
{ label: 'Faucet', title: 'Testnet 12', href: 'https://faucet-tn12.kaspanet.io/' },
|
|
34
|
+
{ label: 'Docs', title: 'vue-kaspa', href: 'https://vue-kaspa.vercel.app/' },
|
|
35
|
+
{ label: 'Explorer', title: 'Testnet 10', href: 'https://tn10.kaspa.stream/' },
|
|
36
|
+
{ label: 'Explorer', title: 'Testnet 12', href: 'https://tn12.kaspa.stream/' },
|
|
37
|
+
{ label: 'Explorer', title: 'Mainnet', href: 'https://kaspa.stream/' },
|
|
38
|
+
]
|
|
30
39
|
</script>
|
|
31
40
|
|
|
32
41
|
<template>
|
|
33
|
-
<div class="
|
|
34
|
-
<header class="card__header">
|
|
35
|
-
<span class="logo">⬡</span>
|
|
36
|
-
<h1 class="card__title">vue-kaspa</h1>
|
|
37
|
-
<span class="badge" :class="stateClass">{{ stateLabel }}</span>
|
|
38
|
-
</header>
|
|
42
|
+
<div class="bento">
|
|
39
43
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
<span class="
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
44
|
+
<!-- Network status card (unchanged) -->
|
|
45
|
+
<div class="card">
|
|
46
|
+
<header class="card__header">
|
|
47
|
+
<span class="logo">⬡</span>
|
|
48
|
+
<h1 class="card__title">vue-kaspa</h1>
|
|
49
|
+
<span class="badge" :class="stateClass">{{ stateLabel }}</span>
|
|
50
|
+
</header>
|
|
51
|
+
|
|
52
|
+
<div class="grid">
|
|
53
|
+
<div class="stat">
|
|
54
|
+
<span class="stat__label">Network</span>
|
|
55
|
+
<span class="stat__value">{{ rpc.networkId.value ?? '—' }}</span>
|
|
56
|
+
</div>
|
|
57
|
+
<div class="stat">
|
|
58
|
+
<span class="stat__label">Server version</span>
|
|
59
|
+
<span class="stat__value">{{ rpc.serverVersion.value ?? '—' }}</span>
|
|
60
|
+
</div>
|
|
61
|
+
<div class="stat">
|
|
62
|
+
<span class="stat__label">DAA Score</span>
|
|
63
|
+
<span class="stat__value mono">{{ daaScore }}</span>
|
|
64
|
+
</div>
|
|
65
|
+
<div class="stat">
|
|
66
|
+
<span class="stat__label">Synced</span>
|
|
67
|
+
<span class="stat__value" :class="{ ok: rpc.isSynced.value, muted: !rpc.isConnected.value }">
|
|
68
|
+
{{ rpc.isConnected.value ? (rpc.isSynced.value ? 'Yes' : 'Syncing…') : '—' }}
|
|
69
|
+
</span>
|
|
70
|
+
</div>
|
|
58
71
|
</div>
|
|
72
|
+
|
|
73
|
+
<footer class="card__footer">
|
|
74
|
+
<a href="https://vue-kaspa.vercel.app" target="_blank" rel="noopener">Docs</a>
|
|
75
|
+
<span>·</span>
|
|
76
|
+
<a href="https://github.com/furatamasensei/vue-kaspa" target="_blank" rel="noopener">GitHub</a>
|
|
77
|
+
</footer>
|
|
78
|
+
</div>
|
|
79
|
+
|
|
80
|
+
<!-- Bento link cards -->
|
|
81
|
+
<div class="link-grid">
|
|
82
|
+
<a
|
|
83
|
+
v-for="link in links"
|
|
84
|
+
:key="link.href"
|
|
85
|
+
:href="link.href"
|
|
86
|
+
target="_blank"
|
|
87
|
+
rel="noopener"
|
|
88
|
+
class="link-card"
|
|
89
|
+
>
|
|
90
|
+
<div class="link-card__top">
|
|
91
|
+
<span class="link-card__label">{{ link.label }}</span>
|
|
92
|
+
<span class="link-card__arrow">↗</span>
|
|
93
|
+
</div>
|
|
94
|
+
<span class="link-card__title">{{ link.title }}</span>
|
|
95
|
+
</a>
|
|
59
96
|
</div>
|
|
60
97
|
|
|
61
|
-
<footer class="card__footer">
|
|
62
|
-
<a href="https://vue-kaspa.vercel.app" target="_blank" rel="noopener">Docs</a>
|
|
63
|
-
<span>·</span>
|
|
64
|
-
<a href="https://github.com/furatamasensei/vue-kaspa" target="_blank" rel="noopener">GitHub</a>
|
|
65
|
-
</footer>
|
|
66
98
|
</div>
|
|
67
99
|
</template>
|
|
68
100
|
|
|
69
101
|
<style scoped>
|
|
70
|
-
.
|
|
102
|
+
.bento {
|
|
71
103
|
width: 100%;
|
|
72
104
|
max-width: 480px;
|
|
105
|
+
display: flex;
|
|
106
|
+
flex-direction: column;
|
|
107
|
+
gap: 0.75rem;
|
|
108
|
+
}
|
|
109
|
+
.card {
|
|
73
110
|
padding: 2rem;
|
|
74
111
|
border: 1px solid var(--color-border);
|
|
75
112
|
border-radius: 10px;
|
|
@@ -120,4 +157,42 @@ const daaScore = computed(() =>
|
|
|
120
157
|
}
|
|
121
158
|
.card__footer a { color: var(--color-text); text-decoration: none; }
|
|
122
159
|
.card__footer a:hover { color: var(--color-heading); }
|
|
160
|
+
|
|
161
|
+
/* Bento link grid */
|
|
162
|
+
.link-grid {
|
|
163
|
+
display: grid;
|
|
164
|
+
grid-template-columns: repeat(3, 1fr);
|
|
165
|
+
gap: 0.75rem;
|
|
166
|
+
}
|
|
167
|
+
.link-card {
|
|
168
|
+
display: flex;
|
|
169
|
+
flex-direction: column;
|
|
170
|
+
justify-content: space-between;
|
|
171
|
+
gap: 0.75rem;
|
|
172
|
+
padding: 1rem;
|
|
173
|
+
border: 1px solid var(--color-border);
|
|
174
|
+
border-radius: 10px;
|
|
175
|
+
background: var(--color-background-soft);
|
|
176
|
+
text-decoration: none;
|
|
177
|
+
cursor: pointer;
|
|
178
|
+
transition: border-color 0.15s;
|
|
179
|
+
}
|
|
180
|
+
.link-card:hover { border-color: #49c5a3; }
|
|
181
|
+
.link-card__top {
|
|
182
|
+
display: flex;
|
|
183
|
+
justify-content: space-between;
|
|
184
|
+
align-items: center;
|
|
185
|
+
}
|
|
186
|
+
.link-card__label {
|
|
187
|
+
font-size: .65rem;
|
|
188
|
+
text-transform: uppercase;
|
|
189
|
+
letter-spacing: .05em;
|
|
190
|
+
color: var(--color-muted, #888);
|
|
191
|
+
}
|
|
192
|
+
.link-card__arrow { font-size: .75rem; color: var(--color-muted, #888); }
|
|
193
|
+
.link-card__title {
|
|
194
|
+
font-size: .85rem;
|
|
195
|
+
font-weight: 600;
|
|
196
|
+
color: var(--color-heading);
|
|
197
|
+
}
|
|
123
198
|
</style>
|