feat: added feature to copy version number by hovering on the version

app/components/Package/Header.vue

@@ -61,6 +61,7 @@ const { y: scrollY } = useScroll(window)
 const showScrollToTop = computed(() => scrollY.value > SCROLL_TO_TOP_THRESHOLD)
 
 const packageName = computed(() => props.pkg?.name ?? '')
+const resolvedVersionDisplay = computed(() => props.resolvedVersion ?? '')
 const fundingUrl = computed(() => {
   let funding = props.displayVersion?.funding
   if (Array.isArray(funding)) funding = funding[0]
@@ -75,6 +76,11 @@ const { copied: copiedPkgName, copy: copyPkgName } = useClipboard({
   copiedDuring: 2000,
 })
 
+const { copied: copiedPkgVersion, copy: copyPkgVersion } = useClipboard({
+  source: resolvedVersionDisplay,
+  copiedDuring: 2000,
+})
+
 function hasProvenance(version: PackumentVersion | null): boolean {
   if (!version?.dist) return false
   return !!(version.dist as { attestations?: unknown }).attestations
@@ -86,8 +92,10 @@ useCommandPaletteContextCommands(
   computed((): CommandPaletteContextCommandInput[] => {
     if (!packageName.value) return []
 
-    const commands: CommandPaletteContextCommandInput[] = [
-      {
+    const commands: CommandPaletteContextCommandInput[] = []
+
+    if (packageName.value) {
+      commands.push({
         id: 'package-copy-name',
         group: 'package',
         label: $t('package.copy_name'),
@@ -97,8 +105,22 @@ useCommandPaletteContextCommands(
           copyPkgName()
           announce($t('command_palette.announcements.copied_to_clipboard'))
         },
-      },
-    ]
+      })
+    }
+
+    if (props.resolvedVersion) {
+      commands.push({
+        id: 'package-copy-version',
+        group: 'package',
+        label: $t('package.versions.copy_version'),
+        keywords: [props.resolvedVersion ?? ''],
+        iconClass: 'i-lucide:copy',
+        action: () => {
+          copyPkgVersion()
+          announce($t('command_palette.announcements.copied_to_clipboard'))
+        },
+      })
+    }
 
     if (fundingUrl.value) {
       commands.push({
@@ -287,16 +309,23 @@ useShortcuts({
               <span class="i-lucide:cable rtl-flip min-w-3 w-3 h-3 mx-1" aria-hidden="true" />
             </TooltipApp>
           </template>
-          <!-- Version selector -->
-          <VersionSelector
-            v-if="resolvedVersion && pkg?.versions && pkg?.['dist-tags']"
-            :package-name="packageName"
-            :current-version="resolvedVersion"
-            :versions="pkg.versions"
-            :dist-tags="pkg['dist-tags']"
-            :url-pattern="versionUrlPattern"
-            position-class="max-md:inset-is-0 md:inset-ie-0"
-          />
+          <CopyToClipboardButton
+            :copied="copiedPkgVersion"
+            :copy-text="$t('package.versions.copy_version')"
+            class="inline-flex items-center min-w-0"
+            @click="copyPkgVersion()"
+          >
+            <!-- Version selector -->
+            <VersionSelector
+              v-if="resolvedVersion && pkg?.versions && pkg?.['dist-tags']"
+              :package-name="packageName"
+              :current-version="resolvedVersion"
+              :versions="pkg.versions"
+              :dist-tags="pkg['dist-tags']"
+              :url-pattern="versionUrlPattern"
+              position-class="max-md:inset-is-0 md:inset-ie-0"
+            />
+          </CopyToClipboardButton>
         </div>
       </div>
       <!-- Docs + Code — inline on desktop, floating bottom bar on mobile -->

i18n/locales/en.json

@@ -570,7 +570,8 @@
       },
       "page_title": "Version History",
       "current_tags": "Current Tags",
-      "no_match_filter": "No versions match {filter}"
+      "no_match_filter": "No versions match {filter}",
+      "copy_version": "Copy version number"
     },
     "timeline": {
       "load_more": "Load more",

i18n/schema.json

@@ -1716,6 +1716,9 @@
             },
             "no_match_filter": {
               "type": "string"
+            },
+            "copy_version": {
+              "type": "string"
             }
           },
           "additionalProperties": false