feat: add raw diff actions

app/components/Diff/ViewerPanel.vue

@@ -33,10 +33,17 @@ const isLargeFile = computed(() => {
   )
 })
 
-const apiUrl = computed(
-  () =>
-    `/api/registry/compare-file/${props.packageName}/v/${props.fromVersion}...${props.toVersion}/${props.file.path}`,
-)
+function encodePathSegments(value: string): string {
+  return value.split('/').map(encodeURIComponent).join('/')
+}
+
+const apiUrl = computed(() => {
+  const packagePath = encodePathSegments(props.packageName)
+  const versionRange = `${encodeURIComponent(props.fromVersion)}...${encodeURIComponent(props.toVersion)}`
+  const filePath = encodePathSegments(props.file.path)
+  return `/api/registry/compare-file/${packagePath}/v/${versionRange}/${filePath}`
+})
+const rawDiffUrl = computed(() => `${apiUrl.value}?format=diff`)
 
 const apiQuery = computed(() => {
   if (isLargeFile.value) return {}
@@ -94,6 +101,32 @@ function getCodeUrl(version: string): string {
 }
 
 const { announce } = useCommandPalette()
+const {
+  copy: copyRawDiffToClipboard,
+  copied: rawDiffCopied,
+  isSupported: rawDiffCopySupported,
+} = useClipboardItems({ copiedDuring: 2000 })
+const mounted = useMounted()
+const copyingRawDiff = ref(false)
+
+async function copyRawDiff() {
+  if (copyingRawDiff.value || !rawDiffCopySupported.value) return
+
+  copyingRawDiff.value = true
+  try {
+    // Hand the browser a pending blob before awaiting the network request.
+    // Safari requires clipboard.write() to begin during the click activation.
+    const rawDiff = $fetch<string>(rawDiffUrl.value, { responseType: 'text' }).then(
+      value => new Blob([value], { type: 'text/plain' }),
+    )
+    await copyRawDiffToClipboard([new ClipboardItem({ 'text/plain': rawDiff })])
+    announce($t('command_palette.announcements.copied_to_clipboard'))
+  } catch {
+    // useClipboardItems keeps the copied state false when the write fails.
+  } finally {
+    copyingRawDiff.value = false
+  }
+}
 
 useCommandPaletteContextCommands(
   computed((): CommandPaletteContextCommandInput[] => {
@@ -193,7 +226,30 @@ useCommandPaletteContextCommands(
         </span>
       </div>
 
-      <div class="flex items-center gap-2 shrink-0">
+      <div class="flex flex-wrap items-center justify-end gap-2">
+        <button
+          type="button"
+          class="px-2 py-1 text-xs text-fg-muted hover:text-fg bg-bg-muted border border-border rounded transition-colors flex items-center gap-1.5 disabled:opacity-50"
+          :disabled="copyingRawDiff || !mounted || !rawDiffCopySupported"
+          @click="copyRawDiff"
+        >
+          <span
+            :class="rawDiffCopied ? 'i-lucide:check' : 'i-lucide:copy'"
+            class="w-3.5 h-3.5"
+            aria-hidden="true"
+          />
+          {{ rawDiffCopied ? $t('common.copied') : $t('compare.copy_diff') }}
+        </button>
+
+        <a
+          :href="rawDiffUrl"
+          target="_blank"
+          rel="noopener"
+          class="px-2 py-1 text-xs text-fg-muted hover:text-fg bg-bg-muted border border-border rounded transition-colors"
+        >
+          {{ $t('compare.view_diff') }}
+        </a>
+
         <!-- Options dropdown -->
         <div ref="optionsDropdownRef" class="relative">
           <button
@@ -364,7 +420,7 @@ useCommandPaletteContextCommands(
           class="px-2 py-1 text-xs text-fg-muted hover:text-fg bg-bg-muted border border-border rounded transition-colors"
           target="_blank"
         >
-          {{ $t('compare.view_file') }}
+          {{ $t('compare.view_in_code_browser') }}
         </NuxtLink>
       </div>
     </div>

i18n/locales/ar-EG.json

@@ -327,7 +327,7 @@
     "merge_modified_lines": "دمج الأسطر المعدّلة",
     "no_content_changes": "لا توجد تغييرات في المحتوى",
     "options": "الخيارات",
-    "view_file": "عرض الملف",
+    "view_diff": "عرض الاختلافات",
     "view_in_code_browser": "عرض في متصفح الكود",
     "word_wrap": "التفاف الكلمات"
   },

i18n/locales/bn-IN.json

@@ -319,6 +319,7 @@
       "slate": "স্লেট",
       "black": "কালো"
     },
+    "foreground_themes": {},
     "keyboard_shortcuts_enabled": "কীবোর্ড শর্টকাট সক্রিয় করুন",
     "keyboard_shortcuts_enabled_description": "কীবোর্ড শর্টকাট নিষ্ক্রিয় করা যেতে পারে যদি তারা অন্যান্য ব্রাউজার বা সিস্টেম শর্টকাটের সঙ্গে দুইপাশের সমস্যা তৈরি করে",
     "enable_code_ligatures": "কোডে লিগচারস সক্রিয় করুন",
@@ -1588,7 +1589,6 @@
     "merge_modified_lines": "পরিবর্তিত লাইন একত্রিত করুন",
     "no_content_changes": "কোনো বিষয়বস্তুর পরিবর্তন পাওয়া যায়নি",
     "options": "বিকল্পসমূহ",
-    "view_file": "ফাইল দেখুন",
     "view_in_code_browser": "কোড ব্রাউজারে দেখুন",
     "word_wrap": "লাইন মোড়ানো"
   },

i18n/locales/cs-CZ.json

@@ -316,6 +316,7 @@
       "slate": "Břidlice",
       "black": "Černá"
     },
+    "foreground_themes": {},
     "keyboard_shortcuts_enabled": "Povolit klávesové zkratky",
     "keyboard_shortcuts_enabled_description": "Klávesové zkratky lze zakázat, pokud se střetávají s jinými zkratkami prohlížeče nebo systému",
     "enable_code_ligatures": "Zapnout ligatury v kódu",
@@ -1265,6 +1266,25 @@
       }
     }
   },
+  "sponsors_page": {
+    "what_we_do": {},
+    "what_support_means": {},
+    "what_this_means_for_you": {
+      "cards": {
+        "people": {},
+        "visitors": {},
+        "stars": {},
+        "community": {},
+        "adoption": {},
+        "default_source": {}
+      }
+    },
+    "tiers": {
+      "silver": {},
+      "gold": {},
+      "platinum": {}
+    }
+  },
   "account_menu": {
     "connect": "připojit",
     "account": "Účet",
@@ -1518,7 +1538,6 @@
     "merge_modified_lines": "Sloučit upravené řádky",
     "no_content_changes": "Nebyly zjištěny žádné změny obsahu",
     "options": "Možnosti",
-    "view_file": "Zobrazit soubor",
     "view_in_code_browser": "Zobrazit v prohlížeči kódu",
     "word_wrap": "Zalomení slov"
   },

i18n/locales/de.json

@@ -98,6 +98,7 @@
     "current": "aktuell",
     "here": "du bist hier",
     "connected": "verbunden",
+    "keyboard_shortcuts": {},
     "state": {
       "on": "an",
       "off": "aus"
@@ -229,6 +230,9 @@
       "more_replies": "noch {count} Antwort… | noch {count} Antworten…"
     }
   },
+  "noodles": {
+    "missing": {}
+  },
   "settings": {
     "title": "einstellungen",
     "tagline": "Passe npmx an deine Vorlieben an",
@@ -284,6 +288,7 @@
       "slate": "Schiefer",
       "black": "Schwarz"
     },
+    "foreground_themes": {},
     "keyboard_shortcuts_enabled": "Tastenkombinationen aktivieren",
     "keyboard_shortcuts_enabled_description": "Tastenkombinationen können deaktiviert werden, wenn sie mit anderen Browser- oder Systemkürzeln in Konflikt stehen",
     "enable_code_ligatures": "Ligaturen im Code aktivieren",
@@ -709,7 +714,8 @@
         "general_description": "Die Y-Achse stellt die Anzahl der Downloads dar. Die X-Achse stellt den Datumsbereich dar, von {start_date} bis {end_date}, mit einem {granularity}en Zeitraum.{estimation_notice} {packages_analysis}. {watermark}.",
         "facet_bar_general_description": "Horizontales Balkendiagramm für: {packages}, Vergleich von {facet} ({description}). {facet_analysis} {watermark}.",
         "facet_bar_analysis": "{package_name} hat einen Wert von {value}."
-      }
+      },
+      "embedding": {}
     },
     "downloads": {
       "title": "Wöchentliche Downloads",
@@ -1221,6 +1227,25 @@
       }
     }
   },
+  "sponsors_page": {
+    "what_we_do": {},
+    "what_support_means": {},
+    "what_this_means_for_you": {
+      "cards": {
+        "people": {},
+        "visitors": {},
+        "stars": {},
+        "community": {},
+        "adoption": {},
+        "default_source": {}
+      }
+    },
+    "tiers": {
+      "silver": {},
+      "gold": {},
+      "platinum": {}
+    }
+  },
   "account_menu": {
     "connect": "Verbinden",
     "account": "Konto",
@@ -1395,6 +1420,7 @@
           "label": "GitHub-Sterne",
           "description": "Anzahl der Sterne im GitHub-Repository"
         },
+        "githubForks": {},
         "githubIssues": {
           "label": "GitHub-Issues",
           "description": "Anzahl der Issues im GitHub-Repository"
@@ -1467,7 +1493,6 @@
     "merge_modified_lines": "Geänderte Zeilen zusammenführen",
     "no_content_changes": "Keine Inhaltsänderungen erkannt",
     "options": "Optionen",
-    "view_file": "Datei anzeigen",
     "view_in_code_browser": "Im Code-Browser anzeigen",
     "word_wrap": "Zeilenumbruch"
   },

i18n/locales/en.json

@@ -1553,6 +1553,7 @@
     "lines_hidden": "{count} line hidden | {count} lines hidden",
     "compare_versions": "diff",
     "compare_versions_title": "Compare with latest version",
+    "copy_diff": "Copy .diff",
     "comparing_versions_label": "Comparing versions...",
     "version_back_to_package": "Back to package",
     "version_error_message": "Failed to compare versions.",
@@ -1599,7 +1600,7 @@
     "merge_modified_lines": "Merge modified lines",
     "no_content_changes": "No content changes detected",
     "options": "Options",
-    "view_file": "View file",
+    "view_diff": "View .diff",
     "view_in_code_browser": "View in code browser",
     "word_wrap": "Word wrap"
   },

i18n/locales/es.json

@@ -319,6 +319,7 @@
       "slate": "Pizarra",
       "black": "Negro"
     },
+    "foreground_themes": {},
     "keyboard_shortcuts_enabled": "Activar atajos de teclado",
     "keyboard_shortcuts_enabled_description": "Los atajos de teclado pueden desactivarse si entran en conflicto con otros atajos del navegador o del sistema",
     "enable_code_ligatures": "Activar ligaduras en código",
@@ -1589,7 +1590,6 @@
     "merge_modified_lines": "Combinar líneas modificadas",
     "no_content_changes": "No se detectaron cambios en el contenido",
     "options": "Opciones",
-    "view_file": "Ver archivo",
     "view_in_code_browser": "Ver en el navegador de código",
     "word_wrap": "Ajuste de línea"
   },

i18n/locales/fr-FR.json

@@ -98,6 +98,7 @@
     "current": "actuel",
     "here": "vous êtes ici",
     "connected": "connecté",
+    "keyboard_shortcuts": {},
     "state": {
       "on": "activé",
       "off": "désactivé"
@@ -229,6 +230,9 @@
       "more_replies": "{count} réponse supplémentaire... | {count} réponses supplémentaires..."
     }
   },
+  "noodles": {
+    "missing": {}
+  },
   "settings": {
     "title": "paramètres",
     "tagline": "personnalisez votre expérience npmx",
@@ -284,6 +288,7 @@
       "slate": "Ardoise",
       "black": "Noir"
     },
+    "foreground_themes": {},
     "keyboard_shortcuts_enabled": "Activer les raccourcis clavier",
     "keyboard_shortcuts_enabled_description": "Les raccourcis clavier peuvent être désactivés s'ils entrent en conflit avec d'autres raccourcis du navigateur ou du système",
     "enable_code_ligatures": "Activer les ligatures de code",
@@ -1227,6 +1232,25 @@
       }
     }
   },
+  "sponsors_page": {
+    "what_we_do": {},
+    "what_support_means": {},
+    "what_this_means_for_you": {
+      "cards": {
+        "people": {},
+        "visitors": {},
+        "stars": {},
+        "community": {},
+        "adoption": {},
+        "default_source": {}
+      }
+    },
+    "tiers": {
+      "silver": {},
+      "gold": {},
+      "platinum": {}
+    }
+  },
   "account_menu": {
     "connect": "connexion",
     "account": "Compte",
@@ -1401,6 +1425,7 @@
           "label": "Étoiles GitHub",
           "description": "Nombre d’étoiles du dépôt GitHub"
         },
+        "githubForks": {},
         "githubIssues": {
           "label": "Issues GitHub",
           "description": "Nombre d’issues ouvertes sur GitHub"
@@ -1473,7 +1498,6 @@
     "merge_modified_lines": "Fusionner les lignes modifiées",
     "no_content_changes": "Aucun changement de contenu détecté",
     "options": "Options",
-    "view_file": "Voir le fichier",
     "view_in_code_browser": "Voir dans le navigateur de code",
     "word_wrap": "Retour à la ligne"
   },