Skip to content

Commit 1cdd78a

Browse files
neutrino2211neutrino2211
authored
Merge branch 'danielroe:main' into main
2 parents 3ae2503 + f8bac98 commit 1cdd78a

31 files changed

Lines changed: 2508 additions & 951 deletions

‎.zed/settings.json‎

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
{
2+
"lsp": {
3+
"oxlint": {
4+
"initialization_options": {
5+
"settings": {
6+
"configPath": ".oxlintrc.json",
7+
"run": "onType"
8+
}
9+
}
10+
},
11+
"oxfmt": {
12+
"initialization_options": {
13+
"settings": {
14+
"run": "onSave",
15+
"configPath": ".oxfmtrc.json"
16+
}
17+
}
18+
}
19+
},
20+
"languages": {
21+
"TypeScript": {
22+
"format_on_save": "on",
23+
"prettier": {
24+
"allowed": false
25+
},
26+
"formatter": [
27+
{
28+
"language_server": {
29+
"name": "oxfmt"
30+
}
31+
}
32+
]
33+
},
34+
"Vue.js": {
35+
"format_on_save": "on",
36+
"prettier": {
37+
"allowed": false
38+
},
39+
"formatter": [
40+
{
41+
"language_server": {
42+
"name": "oxfmt"
43+
}
44+
}
45+
]
46+
},
47+
"JSON": {
48+
"format_on_save": "on",
49+
"prettier": {
50+
"allowed": false
51+
},
52+
"formatter": [
53+
{
54+
"language_server": {
55+
"name": "oxfmt"
56+
}
57+
}
58+
]
59+
},
60+
"JSONC": {
61+
"format_on_save": "on",
62+
"prettier": {
63+
"allowed": false
64+
},
65+
"formatter": [
66+
{
67+
"language_server": {
68+
"name": "oxfmt"
69+
}
70+
}
71+
]
72+
},
73+
"YAML": {
74+
"format_on_save": "on",
75+
"prettier": {
76+
"allowed": false
77+
},
78+
"formatter": [
79+
{
80+
"language_server": {
81+
"name": "oxfmt"
82+
}
83+
}
84+
]
85+
}
86+
}
87+
}

‎README.md‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -90,12 +90,8 @@ pnpm test:types
9090
The `cli/` workspace contains a local connector that enables authenticated npm operations from the web UI. It runs on your machine and uses your existing npm credentials.
9191

9292
```bash
93-
# run the connector in dev mode
94-
pnpm --filter @npmx/connector dev
95-
96-
# or build and run the production version
97-
pnpm --filter @npmx/connector build
98-
node cli/dist/cli.mjs
93+
# run the connector from the root of the repository
94+
pnpm npmx-connector
9995
```
10096

10197
The connector will check your npm authentication, generate a connection token, and listen for requests from npmx.dev.

‎app/app.vue‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -450,7 +450,13 @@ input[type='search']::-webkit-search-results-decoration {
450450
view-transition-name: site-logo;
451451
}
452452
453-
/* Customize the view transition animations */
453+
/* Disable the default fade transition on page navigation */
454+
::view-transition-old(root),
455+
::view-transition-new(root) {
456+
animation: none;
457+
}
458+
459+
/* Customize the view transition animations for specific elements */
454460
::view-transition-old(search-box),
455461
::view-transition-new(search-box),
456462
::view-transition-old(site-logo),

‎app/components/CodeViewer.vue‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -131,13 +131,17 @@ watch(
131131
.code-content :deep(.import-link) {
132132
color: inherit;
133133
text-decoration: underline;
134-
text-decoration-color: transparent;
134+
text-decoration-style: dotted;
135+
text-decoration-color: rgba(158, 203, 255, 0.5); /* syntax.str with transparency */
135136
text-underline-offset: 2px;
136-
transition: text-decoration-color 0.15s;
137+
transition:
138+
text-decoration-color 0.15s,
139+
text-decoration-style 0.15s;
137140
cursor: pointer;
138141
}
139142
140143
.code-content :deep(.import-link:hover) {
141-
text-decoration-color: currentColor;
144+
text-decoration-style: solid;
145+
text-decoration-color: #9ecbff; /* syntax.str - light blue */
142146
}
143147
</style>

‎app/components/JsrBadge.vue‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<script setup lang="ts">
2+
defineProps<{
3+
/** JSR package URL (e.g., "https://jsr.io/@std/fs") */
4+
url: string
5+
/** Whether to show as compact (icon only) or full (with text) */
6+
compact?: boolean
7+
}>()
8+
</script>
9+
10+
<template>
11+
<a
12+
:href="url"
13+
target="_blank"
14+
rel="noopener noreferrer"
15+
class="inline-flex items-center gap-1 text-xs font-mono text-fg-muted hover:text-fg transition-colors duration-200"
16+
title="also available on JSR"
17+
>
18+
<span
19+
class="i-simple-icons-jsr shrink-0"
20+
:class="compact ? 'w-3.5 h-3.5' : 'w-4 h-4'"
21+
aria-hidden="true"
22+
/>
23+
<span v-if="!compact" class="sr-only sm:not-sr-only">jsr</span>
24+
</a>
25+
</template>

‎app/components/PackageCard.vue‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,12 @@ function formatDate(dateStr: string): string {
3434
>
3535
{{ result.package.name }}
3636
</component>
37-
<div class="flex items-center gap-1.5 shrink-0">
38-
<span v-if="result.package.version" class="font-mono text-xs text-fg-subtle">
37+
<div class="flex items-center gap-1.5 shrink-0 max-w-32">
38+
<span
39+
v-if="result.package.version"
40+
class="font-mono text-xs text-fg-subtle truncate"
41+
:title="result.package.version"
42+
>
3943
v{{ result.package.version }}
4044
</span>
4145
<ProvenanceBadge

‎app/components/PackageDependencies.vue‎

Lines changed: 6 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -32,17 +32,6 @@ const sortedPeerDependencies = computed(() => {
3232
return a.name.localeCompare(b.name)
3333
})
3434
})
35-
36-
// Check if a version string is "long" (multiple alternatives)
37-
function isLongVersion(version: string): boolean {
38-
return version.length > 20 || version.includes('||')
39-
}
40-
41-
// Truncate long version strings for display
42-
function truncateVersion(version: string, maxLength = 20): string {
43-
if (version.length <= maxLength) return version
44-
return `${version.slice(0, maxLength)}…`
45-
}
4635
</script>
4736

4837
<template>
@@ -77,11 +66,10 @@ function truncateVersion(version: string, maxLength = 20): string {
7766
{{ dep }}
7867
</NuxtLink>
7968
<span
80-
class="font-mono text-xs text-fg-subtle max-w-[50%] text-right"
81-
:class="isLongVersion(version) ? 'truncate' : 'shrink-0'"
82-
:title="isLongVersion(version) ? version : undefined"
69+
class="font-mono text-xs text-fg-subtle max-w-[50%] text-right truncate"
70+
:title="version"
8371
>
84-
{{ isLongVersion(version) ? truncateVersion(version) : version }}
72+
{{ version }}
8573
</span>
8674
</li>
8775
</ul>
@@ -125,11 +113,10 @@ function truncateVersion(version: string, maxLength = 20): string {
125113
</span>
126114
</div>
127115
<span
128-
class="font-mono text-xs text-fg-subtle max-w-[40%] text-right"
129-
:class="isLongVersion(peer.version) ? 'truncate' : 'shrink-0'"
130-
:title="isLongVersion(peer.version) ? peer.version : undefined"
116+
class="font-mono text-xs text-fg-subtle max-w-[40%] text-right truncate"
117+
:title="peer.version"
131118
>
132-
{{ isLongVersion(peer.version) ? truncateVersion(peer.version) : peer.version }}
119+
{{ peer.version }}
133120
</span>
134121
</li>
135122
</ul>

‎app/components/PackageDownloadStats.vue‎

Lines changed: 42 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,17 @@ const config = computed(() => ({
4040
},
4141
line: {
4242
color: '#6A6A6A',
43+
pulse: {
44+
show: true,
45+
loop: true, // runs only once if false
46+
radius: 2,
47+
color: '#8A8A8A',
48+
easing: 'ease-in-out',
49+
trail: {
50+
show: true,
51+
length: 6,
52+
},
53+
},
4354
},
4455
plot: {
4556
radius: 6,
@@ -68,9 +79,34 @@ const config = computed(() => ({
6879
Weekly Downloads
6980
</h2>
7081
</div>
71-
<div class="w-full">
82+
<div class="w-full overflow-hidden">
7283
<ClientOnly>
73-
<VueUiSparkline :dataset :config />
84+
<VueUiSparkline class="max-w-full" :dataset :config />
85+
<template #fallback>
86+
<!-- Skeleton matching sparkline layout: title row + chart with data label -->
87+
<div class="min-h-[100px]">
88+
<!-- Title row: date range (24px height) -->
89+
<div class="h-6 flex items-center pl-3">
90+
<span class="skeleton h-3 w-36" />
91+
</div>
92+
<!-- Chart area: data label left, sparkline right -->
93+
<div class="aspect-[500/80] flex items-center">
94+
<!-- Data label (covers ~42% width) -->
95+
<div class="w-[42%] flex items-center pl-0.5">
96+
<span class="skeleton h-7 w-24" />
97+
</div>
98+
<!-- Sparkline area (~58% width) -->
99+
<div class="flex-1 flex items-end gap-0.5 h-4/5 pr-3">
100+
<span
101+
v-for="i in 16"
102+
:key="i"
103+
class="skeleton flex-1 rounded-sm"
104+
:style="{ height: `${25 + ((i * 7) % 50)}%` }"
105+
/>
106+
</div>
107+
</div>
108+
</div>
109+
</template>
74110
</ClientOnly>
75111
</div>
76112
</section>
@@ -88,4 +124,8 @@ const config = computed(() => ({
88124
Geist Mono,
89125
monospace !important;
90126
}
127+
.vue-ui-sparkline,
128+
.vue-ui-sparkline svg {
129+
max-width: 100% !important;
130+
}
91131
</style>

0 commit comments

Comments
 (0)