chore: release v0.24.0 (#3429)

Author: serhalp

app/assets/logos/sponsors/index.ts

@@ -1,3 +1,4 @@
+import type { FOOTER_SPONSOR_NAMES } from './names'
 import LogoVercel from './vercel.svg'
 import LogoVercelLight from './vercel-light.svg'
 import LogoVoidZero from './void-zero.svg'
@@ -99,4 +100,14 @@ export const SPONSORS = {
       url: 'https://badrap.io/',
     },
   ],
-}
+} as const
+
+type Names<T extends readonly { name: string }[]> = { [K in keyof T]: T[K]['name'] }
+type IsEqual<A, B> =
+  (<T>() => T extends A ? 1 : 2) extends <T>() => T extends B ? 1 : 2 ? true : false
+
+// Update FOOTER_SPONSOR_NAMES in ./names.ts when changing the sponsors above.
+true satisfies IsEqual<
+  readonly [...Names<typeof SPONSORS.gold>, ...Names<typeof SPONSORS.silver>],
+  typeof FOOTER_SPONSOR_NAMES
+>

app/assets/logos/sponsors/names.ts

@@ -0,0 +1,10 @@
+export const FOOTER_SPONSOR_NAMES = [
+  'Vercel',
+  'CodeRabbit',
+  'VoidZero',
+  'vlt',
+  'Netlify',
+  'Bluesky',
+  'Chromatic',
+  'Badrap',
+] as const

app/components/About/LogoList.vue

@@ -17,7 +17,7 @@ type GroupItem = {
 }
 
 const props = defineProps<{
-  list: (BaseItem | GroupItem)[]
+  list: readonly (BaseItem | GroupItem)[]
 }>()
 </script>
 

app/components/AppFooter.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { NPMX_DOCS_SITE } from '#shared/utils/constants'
-import { SPONSORS } from '~/assets/logos/sponsors'
+import { FOOTER_SPONSOR_NAMES } from '~/assets/logos/sponsors/names'
 
 const route = useRoute()
 const isHome = computed(() => route.name === 'index')
@@ -38,8 +38,9 @@ const socialLinks = computed(() => [
 ])
 
 const sponsorList = computed(() => {
-  const names = [...SPONSORS.gold, ...SPONSORS.silver].map(s => s.name)
-  return new Intl.ListFormat(locale.value, { style: 'long', type: 'conjunction' }).format(names)
+  return new Intl.ListFormat(locale.value, { style: 'long', type: 'conjunction' }).format(
+    FOOTER_SPONSOR_NAMES,
+  )
 })
 
 const footerSections = computed<Array<{ label: string; links: FooterLink[] }>>(() => [

app/components/Compare/FacetBarChart.vue

@@ -142,6 +142,7 @@ const config = computed<VueUiHorizontalBarConfig>(() => {
   return {
     theme: isDarkMode.value ? 'dark' : '',
     a11y: {
+      includeTable: true,
       translations: {
         keyboardNavigation: $t('package.trends.chart_assistive_text.keyboard_navigation_vertical'),
         tableAvailable: $t('package.trends.chart_assistive_text.table_available'),

app/components/Compare/FacetScatterChart.vue

@@ -136,6 +136,9 @@ function buildExportFilename(extension: string): string {
 
 const config = computed<VueUiScatterConfig>(() => {
   return {
+    a11y: {
+      includeTable: true,
+    },
     theme: isDarkMode.value ? 'dark' : '',
     userOptions: {
       buttons: {

app/components/DependencyPathPopup.vue

@@ -99,6 +99,7 @@ function parsePackageString(pkg: string): { name: string; version: string } {
                   parsePackageString(pathItem).version,
                 )
               "
+              prefetch-on="interaction"
               class="hover:underline"
               :class="idx === path.length - 1 ? 'text-fg font-medium' : 'text-fg-muted'"
               @click="closePopup"

app/components/DepsStats/DependencyStatsPanel.vue

@@ -84,6 +84,7 @@ function formatFacetValue(value: FacetValue): string {
       <h2 class="font-mono text-lg font-medium truncate">
         <NuxtLink
           :to="packageRoute(packageName, resolvedVersion)"
+          prefetch-on="interaction"
           class="text-fg hover:text-accent transition-colors"
         >
           {{ packageName }}

app/components/Diff/SidebarPanel.vue

@@ -153,6 +153,7 @@ function handleFileSelect(file: FileChange) {
 
               <NuxtLink
                 :to="packageRoute(dep.name)"
+                prefetch-on="interaction"
                 class="font-mono hover:text-fg transition-colors truncate min-w-0"
               >
                 {{ dep.name }}

app/components/Header/PackagesDropdown.vue

@@ -95,6 +95,7 @@ function handleKeydown(event: KeyboardEvent) {
             <li v-for="pkg in packages" :key="pkg">
               <NuxtLink
                 :to="packageRoute(pkg)"
+                prefetch-on="interaction"
                 class="block px-3 py-2 font-mono text-sm text-fg hover:bg-bg-subtle transition-colors truncate"
               >
                 {{ pkg }}