[autofix.ci] apply automated fixes

autofix-ci[bot] · web-flow · commit d704602b9eac · 2026-03-22T17:27:46.000Z
diff --git a/app/components/AppFooter.vue b/app/components/AppFooter.vue
@@ -24,7 +24,9 @@ const closeModal = () => modalRef.value?.close?.()
         <div class="hidden sm:grid sm:grid-cols-2 lg:grid-cols-3 gap-x-10 gap-y-1 min-h-11 text-xs">
           <!-- Column 1: Product -->
           <div class="flex flex-col gap-1">
-            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{ $t('footer.product') }}</span>
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{
+              $t('footer.product')
+            }}</span>
             <LinkBase :to="{ name: 'about' }">{{ $t('footer.about') }}</LinkBase>
             <LinkBase :to="{ name: 'blog' }">{{ $t('footer.blog') }}</LinkBase>
             <LinkBase :to="NPMX_DOCS_SITE">{{ $t('footer.docs') }}</LinkBase>
@@ -119,15 +121,21 @@ const closeModal = () => modalRef.value?.close?.()
 
           <!-- Column 2: Legal & Info -->
           <div class="flex flex-col gap-1">
-            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{ $t('footer.legal') }}</span>
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{
+              $t('footer.legal')
+            }}</span>
             <LinkBase :to="{ name: 'privacy' }">{{ $t('privacy_policy.title') }}</LinkBase>
             <LinkBase :to="{ name: 'accessibility' }">{{ $t('a11y.footer_title') }}</LinkBase>
-            <LinkBase :to="{ name: 'translation-status' }">{{ $t('translation_status.title') }}</LinkBase>
+            <LinkBase :to="{ name: 'translation-status' }">{{
+              $t('translation_status.title')
+            }}</LinkBase>
           </div>
 
           <!-- Column 3: Community -->
           <div class="flex flex-col gap-1">
-            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{ $t('footer.community') }}</span>
+            <span class="text-fg-subtle uppercase tracking-wide text-2xs mb-1">{{
+              $t('footer.community')
+            }}</span>
             <LinkBase to="https://repo.npmx.dev">{{ $t('footer.source') }}</LinkBase>
             <LinkBase to="https://social.npmx.dev">{{ $t('footer.social') }}</LinkBase>
             <LinkBase :to="discord.url">{{ discord.label }}</LinkBase>
diff --git a/app/components/Code/Viewer.vue b/app/components/Code/Viewer.vue
@@ -114,9 +114,17 @@ watch(
     </div>
 
     <!-- Code content -->
-    <div class="code-content flex-1 min-w-0" :class="wordWrap ? 'overflow-x-hidden' : 'overflow-x-auto'">
+    <div
+      class="code-content flex-1 min-w-0"
+      :class="wordWrap ? 'overflow-x-hidden' : 'overflow-x-auto'"
+    >
       <!-- eslint-disable vue/no-v-html -- HTML is generated server-side by Shiki -->
-      <div ref="codeRef" class="code-lines min-w-full w-fit" :class="{ 'word-wrap': wordWrap }" v-html="html" />
+      <div
+        ref="codeRef"
+        class="code-lines min-w-full w-fit"
+        :class="{ 'word-wrap': wordWrap }"
+        v-html="html"
+      />
       <!-- eslint-enable vue/no-v-html -->
     </div>
   </div>
diff --git a/app/components/Compare/FacetBarChart.vue b/app/components/Compare/FacetBarChart.vue
@@ -332,12 +332,8 @@ const config = computed<VueUiHorizontalBarConfig>(() => {
           <SkeletonInline class="h-3 w-36 rounded" />
         </div>
         <div class="flex flex-col gap-2 px-2" aria-hidden="true">
-          <div
-            v-for="(pkg, i) in packages"
-            :key="pkg"
-            class="flex items-center gap-3"
-          >
-            <SkeletonInline class="h-3 shrink-0" :style="{ width: `${40 + (i * 17) % 40}%` }" />
+          <div v-for="(pkg, i) in packages" :key="pkg" class="flex items-center gap-3">
+            <SkeletonInline class="h-3 shrink-0" :style="{ width: `${40 + ((i * 17) % 40)}%` }" />
             <SkeletonInline class="h-7 flex-1 rounded" />
           </div>
         </div>
@@ -352,12 +348,8 @@ const config = computed<VueUiHorizontalBarConfig>(() => {
       </div>
       <!-- Bar skeletons with varying widths for visual realism -->
       <div class="flex flex-col gap-2 px-2" aria-hidden="true">
-        <div
-          v-for="(pkg, i) in packages"
-          :key="pkg"
-          class="flex items-center gap-3"
-        >
-          <SkeletonInline class="h-3 shrink-0" :style="{ width: `${40 + (i * 17) % 40}%` }" />
+        <div v-for="(pkg, i) in packages" :key="pkg" class="flex items-center gap-3">
+          <SkeletonInline class="h-3 shrink-0" :style="{ width: `${40 + ((i * 17) % 40)}%` }" />
           <SkeletonInline class="h-7 flex-1 rounded" />
         </div>
       </div>
diff --git a/app/components/Package/Dependencies.vue b/app/components/Package/Dependencies.vue
@@ -109,7 +109,11 @@ function parseNpmAlias(version: string): { name: string; range: string } | null
   <div class="space-y-8">
     <!-- Empty state when no dependencies at all -->
     <p
-      v-if="sortedDependencies.length === 0 && sortedPeerDependencies.length === 0 && sortedOptionalDependencies.length === 0"
+      v-if="
+        sortedDependencies.length === 0 &&
+        sortedPeerDependencies.length === 0 &&
+        sortedOptionalDependencies.length === 0
+      "
       class="text-sm text-fg-subtle"
     >
       {{ $t('package.dependencies.none') }}
@@ -135,7 +139,11 @@ function parseNpmAlias(version: string): { name: string; range: string } | null
           :key="dep"
           class="flex items-center justify-between py-1 text-sm gap-2"
         >
-          <LinkBase :to="packageRoute(parseNpmAlias(version)?.name ?? dep)" class="block truncate" dir="ltr">
+          <LinkBase
+            :to="packageRoute(parseNpmAlias(version)?.name ?? dep)"
+            class="block truncate"
+            dir="ltr"
+          >
             {{ dep }}
           </LinkBase>
           <span class="flex items-center gap-1 max-w-[40%]" dir="ltr">
@@ -190,7 +198,12 @@ function parseNpmAlias(version: string): { name: string; range: string } | null
               <span class="sr-only">{{ $t('package.deprecated.label') }}</span>
             </LinkBase>
             <LinkBase
-              :to="packageRoute(parseNpmAlias(version)?.name ?? dep, parseNpmAlias(version)?.range ?? version)"
+              :to="
+                packageRoute(
+                  parseNpmAlias(version)?.name ?? dep,
+                  parseNpmAlias(version)?.range ?? version,
+                )
+              "
               class="block truncate"
               :class="getDepVersionClass(dep)"
               :title="getDepVersionTooltip(dep, version)"
@@ -248,15 +261,24 @@ function parseNpmAlias(version: string): { name: string; range: string } | null
           class="flex items-center justify-between py-1 text-sm gap-1 min-w-0"
         >
           <div class="flex items-center gap-2 min-w-0 flex-1">
-            <LinkBase :to="packageRoute(parseNpmAlias(peer.version)?.name ?? peer.name)" class="block max-w-[70%] break-words" dir="ltr">
+            <LinkBase
+              :to="packageRoute(parseNpmAlias(peer.version)?.name ?? peer.name)"
+              class="block max-w-[70%] break-words"
+              dir="ltr"
+            >
               {{ peer.name }}
             </LinkBase>
             <TagStatic v-if="peer.optional" :title="$t('package.dependencies.optional')">
               {{ $t('package.dependencies.optional') }}
             </TagStatic>
           </div>
           <LinkBase
-            :to="packageRoute(parseNpmAlias(peer.version)?.name ?? peer.name, parseNpmAlias(peer.version)?.range ?? peer.version)"
+            :to="
+              packageRoute(
+                parseNpmAlias(peer.version)?.name ?? peer.name,
+                parseNpmAlias(peer.version)?.range ?? peer.version,
+              )
+            "
             class="block truncate max-w-[30%]"
             :title="peer.version"
             dir="ltr"
@@ -309,11 +331,20 @@ function parseNpmAlias(version: string): { name: string; range: string } | null
           :key="dep"
           class="flex items-baseline justify-between py-1 text-sm gap-2"
         >
-          <LinkBase :to="packageRoute(parseNpmAlias(version)?.name ?? dep)" class="block max-w-[80%] break-words" dir="ltr">
+          <LinkBase
+            :to="packageRoute(parseNpmAlias(version)?.name ?? dep)"
+            class="block max-w-[80%] break-words"
+            dir="ltr"
+          >
             {{ dep }}
           </LinkBase>
           <LinkBase
-            :to="packageRoute(parseNpmAlias(version)?.name ?? dep, parseNpmAlias(version)?.range ?? version)"
+            :to="
+              packageRoute(
+                parseNpmAlias(version)?.name ?? dep,
+                parseNpmAlias(version)?.range ?? version,
+              )
+            "
             class="block truncate"
             :title="version"
             dir="ltr"
diff --git a/app/pages/package-code/[[org]]/[packageName]/v/[version]/[...filePath].vue b/app/pages/package-code/[[org]]/[packageName]/v/[version]/[...filePath].vue
@@ -421,7 +421,11 @@ defineOgImageComponent('Default', {
             <button
               type="button"
               class="px-2 py-1 font-mono text-xs border rounded transition-colors inline-flex items-center gap-1"
-              :class="wordWrap ? 'bg-accent/10 text-accent border-accent/30' : 'text-fg-muted bg-bg-subtle border-border hover:text-fg hover:border-border-hover'"
+              :class="
+                wordWrap
+                  ? 'bg-accent/10 text-accent border-accent/30'
+                  : 'text-fg-muted bg-bg-subtle border-border hover:text-fg hover:border-border-hover'
+              "
               :aria-pressed="wordWrap"
               :title="$t('code.toggle_word_wrap')"
               @click="wordWrap = !wordWrap"
diff --git a/app/pages/package/[[org]]/[name].vue b/app/pages/package/[[org]]/[name].vue
@@ -328,7 +328,7 @@ const licenseChanged = computed(() => {
   const latestLicense = pkg.value?.license
   if (!currentLicense || !latestLicense) return false
   const normalize = (l: unknown): string =>
-    typeof l === 'string' ? l : (l as { type?: string })?.type ?? ''
+    typeof l === 'string' ? l : ((l as { type?: string })?.type ?? '')
   return normalize(currentLicense) !== normalize(latestLicense)
 })
 
@@ -598,14 +598,20 @@ const showSkeleton = shallowRef(false)
                 {{ $t('package.stats.license') }}
               </dt>
               <dd class="font-mono text-sm text-fg flex items-center gap-2 flex-wrap">
-                <LicenseDisplay v-if="displayVersion?.license ?? pkg.license" :license="(displayVersion?.license ?? pkg.license) as string" />
+                <LicenseDisplay
+                  v-if="displayVersion?.license ?? pkg.license"
+                  :license="(displayVersion?.license ?? pkg.license) as string"
+                />
                 <span v-else>{{ $t('package.license.none') }}</span>
                 <TooltipApp
                   v-if="licenseChanged"
                   :text="$t('package.license.changed', { latest: pkg.license })"
                   position="bottom"
                 >
-                  <span tabindex="0" class="inline-flex items-center gap-1 px-1.5 py-0.5 text-2xs font-sans rounded bg-amber-500/15 text-amber-700 dark:text-amber-400 border border-amber-500/30 cursor-help focus-visible:outline-2 focus-visible:outline-accent/70">
+                  <span
+                    tabindex="0"
+                    class="inline-flex items-center gap-1 px-1.5 py-0.5 text-2xs font-sans rounded bg-amber-500/15 text-amber-700 dark:text-amber-400 border border-amber-500/30 cursor-help focus-visible:outline-2 focus-visible:outline-accent/70"
+                  >
                     <span class="i-lucide:triangle-alert w-3 h-3" aria-hidden="true" />
                     {{ $t('package.license.changed_badge') }}
                   </span>
diff --git a/app/pages/package/[[org]]/[name]/dependents.vue b/app/pages/package/[[org]]/[name]/dependents.vue
@@ -171,14 +171,8 @@ useSeoMeta({
           >
             {{ $t('common.previous') }}
           </ButtonBase>
-          <span class="text-sm text-fg-muted font-mono">
-            {{ page + 1 }} / {{ totalPages }}
-          </span>
-          <ButtonBase
-            variant="secondary"
-            :disabled="page >= totalPages - 1"
-            @click="nextPage"
-          >
+          <span class="text-sm text-fg-muted font-mono"> {{ page + 1 }} / {{ totalPages }} </span>
+          <ButtonBase variant="secondary" :disabled="page >= totalPages - 1" @click="nextPage">
             {{ $t('common.next') }}
             <span class="i-lucide:chevron-right w-4 h-4" aria-hidden="true" />
           </ButtonBase>
diff --git a/server/utils/readme.ts b/server/utils/readme.ts
@@ -132,7 +132,8 @@ function matchPlaygroundProvider(url: string): PlaygroundProvider | null {
         if (
           (hostname === domain || hostname.endsWith(`.${domain}`)) &&
           (!provider.paths || provider.paths.some(path => parsed.pathname.startsWith(path))) &&
-          (!provider.pathContains || provider.pathContains.some(seg => parsed.pathname.includes(seg)))
+          (!provider.pathContains ||
+            provider.pathContains.some(seg => parsed.pathname.includes(seg)))
         ) {
           return provider
         }
