feat(nuxt): add #fallback to server components types

packages/nuxt/src/components/templates.ts

@@ -102,14 +102,20 @@ export const componentsTypeTemplate = {
   filename: 'components.d.ts' as const,
   getContents: ({ app, nuxt }) => {
     const buildDir = nuxt.options.buildDir
-    const componentTypes = app.components.filter(c => !c.island).map(c => [
-      c.pascalName,
-      `typeof ${genDynamicImport(isAbsolute(c.filePath)
+    const componentTypes = app.components.filter(c => !c.island).map((c) => {
+      const type = `typeof ${genDynamicImport(isAbsolute(c.filePath)
         ? relative(buildDir, c.filePath).replace(/(?<=\w)\.(?!vue)\w+$/g, '')
-        : c.filePath.replace(/(?<=\w)\.(?!vue)\w+$/g, ''), { wrapper: false })}['${c.export}']`,
-    ])
-
+        : c.filePath.replace(/(?<=\w)\.(?!vue)\w+$/g, ''), { wrapper: false })}['${c.export}']`
+      return [
+        c.pascalName,
+        c.island || c.mode === 'server' ? `IslandComponent<${type}>` : type,
+      ]
+    })
+
+    const islandType = 'type IslandComponent<T extends DefineComponent> = T & DefineComponent<{}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, SlotsType<{ fallback: { error: unknown } }>>'
     return `
+import type { DefineComponent, SlotsType } from 'vue'
+${nuxt.options.experimental.componentIslands ? islandType : ''}
 interface _GlobalComponents {
   ${componentTypes.map(([pascalName, type]) => `    '${pascalName}': ${type}`).join('\n')}
   ${componentTypes.map(([pascalName, type]) => `    'Lazy${pascalName}': ${type}`).join('\n')}

test/fixtures/basic-types/components/ServerComponent.server.vue

@@ -0,0 +1,5 @@
+<template>
+  <div>
+    Hello from server component !
+  </div>
+</template>

test/fixtures/basic-types/types.ts

@@ -1,5 +1,5 @@
 import { describe, expectTypeOf, it } from 'vitest'
-import type { Ref } from 'vue'
+import type { Ref, SlotsType } from 'vue'
 import type { FetchError } from 'ofetch'
 import type { NavigationFailure, RouteLocationNormalized, RouteLocationRaw, Router, useRouter as vueUseRouter } from '#vue-router'
 
@@ -8,7 +8,7 @@ import { defineNuxtConfig } from 'nuxt/config'
 import { callWithNuxt, isVue3 } from '#app'
 import type { NuxtError } from '#app'
 import type { NavigateToOptions } from '#app/composables/router'
-import { NuxtLayout, NuxtLink, NuxtPage, WithTypes } from '#components'
+import { NuxtLayout, NuxtLink, NuxtPage, ServerComponent, WithTypes } from '#components'
 import { useRouter } from '#imports'
 
 interface TestResponse { message: string }
@@ -372,6 +372,9 @@ describe('components', () => {
 
     // TODO: assert typed slots, exposed, generics, etc.
   })
+  it('include fallback slot in server components', () => {
+    expectTypeOf(ServerComponent.slots).toEqualTypeOf<SlotsType<{ fallback: { error: unknown } }> | undefined>()
+  })
 })
 
 describe('composables', () => {