From af4880d68640506b551180af71da4e43b0ed7812 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?=
 <sxzz@sxzz.moe>
Date: Thu, 30 Mar 2023 15:49:53 +0800
Subject: [PATCH] feat: slot type for defineComponent

---
 .../__snapshots__/compileScript.spec.ts.snap  | 45 +++++++++++++++++++
 .../__tests__/compileScript.spec.ts           | 34 ++++++++++++++
 packages/compiler-sfc/src/compileScript.ts    |  2 +-
 packages/dts-test/defineComponent.test-d.tsx  | 32 ++++++++++++-
 packages/dts-test/setupHelpers.test-d.ts      | 17 ++++++-
 .../runtime-core/src/apiDefineComponent.ts    | 29 +++++++++---
 packages/runtime-core/src/apiSetupHelpers.ts  | 10 ++---
 packages/runtime-core/src/component.ts        | 24 +++++++---
 packages/runtime-core/src/componentOptions.ts | 31 +++++++++++--
 .../src/componentPublicInstance.ts            |  6 ++-
 packages/runtime-core/src/componentSlots.ts   | 18 +++++++-
 packages/runtime-core/src/index.ts            |  2 +-
 packages/runtime-dom/src/apiCustomElement.ts  |  9 +++-
 13 files changed, 229 insertions(+), 30 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index e78522ee3af..24b6b6b3f85 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -1769,6 +1769,51 @@ return { props, emit }
 })"
 `;
 
+exports[`SFC compile <script setup> > with TypeScript > defineSlots 1`] = `
+"import { useSlots as _useSlots, defineComponent as _defineComponent } from 'vue'
+
+export default /*#__PURE__*/_defineComponent({
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      const slots = _useSlots()
+      
+return { slots }
+}
+
+})"
+`;
+
+exports[`SFC compile <script setup> > with TypeScript > defineSlots w/o generic params 1`] = `
+"import { useSlots as _useSlots } from 'vue'
+
+export default {
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      const slots = _useSlots()
+      
+return { slots }
+}
+
+}"
+`;
+
+exports[`SFC compile <script setup> > with TypeScript > defineSlots w/o return value 1`] = `
+"import { defineComponent as _defineComponent } from 'vue'
+
+export default /*#__PURE__*/_defineComponent({
+  setup(__props, { expose: __expose }) {
+  __expose();
+
+      
+      
+return {  }
+}
+
+})"
+`;
+
 exports[`SFC compile <script setup> > with TypeScript > hoist type declarations 1`] = `
 "import { defineComponent as _defineComponent } from 'vue'
 export interface Foo {}
diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index 11d1bc02f9c..42c2a8b1030 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -1540,6 +1540,40 @@ const emit = defineEmits(['a', 'b'])
       expect(content).toMatch(`emits: ['foo']`)
     })
 
+    test('defineSlots', () => {
+      const { content } = compile(`
+      <script setup lang="ts">
+      const slots = defineSlots<{
+        default: [msg: string]
+      }>()
+      </script>
+      `)
+      assertCode(content)
+      expect(content).toMatch(`const slots = _useSlots()`)
+    })
+
+    test('defineSlots w/o return value', () => {
+      const { content } = compile(`
+      <script setup lang="ts">
+      defineSlots<{
+        default: [msg: string]
+      }>()
+      </script>
+      `)
+      assertCode(content)
+      expect(content).not.toMatch(`_useSlots`)
+    })
+
+    test('defineSlots w/o generic params', () => {
+      const { content } = compile(`
+      <script setup>
+      const slots = defineSlots()
+      </script>
+      `)
+      assertCode(content)
+      expect(content).toMatch(`const slots = _useSlots()`)
+    })
+
     test('runtime Enum', () => {
       const { content, bindings } = compile(
         `<script setup lang="ts">
diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index 121205306d2..ce0d2c84ea3 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -618,7 +618,7 @@ export function compileScript(
     }
     hasDefineSlotsCall = true
 
-    if (node.arguments) {
+    if (node.arguments.length > 0) {
       error(`${DEFINE_SLOTS}() cannot accept arguments`, node)
     }
 
diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index 3aec37e97b6..3f0928d708c 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -8,7 +8,10 @@ import {
   ComponentPublicInstance,
   ComponentOptions,
   SetupContext,
-  h
+  h,
+  SlotsType,
+  useSlots,
+  Slots
 } from 'vue'
 import { describe, expectType, IsUnion } from './utils'
 
@@ -1406,6 +1409,32 @@ export default {
   })
 }
 
+describe('slots', () => {
+  defineComponent({
+    slots: Object as SlotsType<{
+      default: [foo: string, bar: number]
+      item: [number]
+    }>,
+    setup(props, { slots }) {
+      expectType<(foo: string, bar: number) => any>(slots.default)
+      expectType<(scope: number) => any>(slots.item)
+    }
+  })
+
+  defineComponent({
+    // @ts-expect-error `default` should be an array
+    slots: Object as SlotsType<{ default: string }>
+  })
+
+  defineComponent({
+    setup(props, { slots }) {
+      // unknown slots
+      expectType<Slots>(slots)
+      expectType<((...args: any[]) => any) | undefined>(slots.default)
+    }
+  })
+})
+
 import {
   DefineComponent,
   ComponentOptionsMixin,
@@ -1428,6 +1457,7 @@ declare const MyButton: DefineComponent<
   ComponentOptionsMixin,
   EmitsOptions,
   string,
+  {},
   VNodeProps & AllowedComponentProps & ComponentCustomProps,
   Readonly<ExtractPropTypes<{}>>,
   {}
diff --git a/packages/dts-test/setupHelpers.test-d.ts b/packages/dts-test/setupHelpers.test-d.ts
index a3ab02cab97..0edd5017f01 100644
--- a/packages/dts-test/setupHelpers.test-d.ts
+++ b/packages/dts-test/setupHelpers.test-d.ts
@@ -4,7 +4,9 @@ import {
   useAttrs,
   useSlots,
   withDefaults,
-  Slots
+  Slots,
+  defineSlots,
+  VNode
 } from 'vue'
 import { describe, expectType } from './utils'
 
@@ -160,6 +162,19 @@ describe('defineEmits w/ runtime declaration', () => {
   emit2('baz')
 })
 
+describe('defineSlots', () => {
+  const slots = defineSlots<{
+    default: [foo: string, bar: number]
+  }>()
+  expectType<(foo: string, bar: number) => VNode[]>(slots.default)
+
+  const slotsUntype = defineSlots()
+  expectType<Slots>(slotsUntype)
+
+  // @ts-expect-error `default` should be an array
+  defineSlots<{ default: string }>()
+})
+
 describe('useAttrs', () => {
   const attrs = useAttrs()
   expectType<Record<string, unknown>>(attrs)
diff --git a/packages/runtime-core/src/apiDefineComponent.ts b/packages/runtime-core/src/apiDefineComponent.ts
index bf579e75573..0adc9d29387 100644
--- a/packages/runtime-core/src/apiDefineComponent.ts
+++ b/packages/runtime-core/src/apiDefineComponent.ts
@@ -28,6 +28,7 @@ import {
   CreateComponentPublicInstance,
   ComponentPublicInstanceConstructor
 } from './componentPublicInstance'
+import { SlotsType } from './componentSlots'
 
 export type PublicProps = VNodeProps &
   AllowedComponentProps &
@@ -43,6 +44,7 @@ export type DefineComponent<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = {},
   EE extends string = string,
+  S extends SlotsType = {},
   PP = PublicProps,
   Props = Readonly<
     PropsOrPropOptions extends ComponentPropsOptions
@@ -61,6 +63,7 @@ export type DefineComponent<
     Mixin,
     Extends,
     E,
+    S,
     PP & Props,
     Defaults,
     true
@@ -77,6 +80,7 @@ export type DefineComponent<
     Extends,
     E,
     EE,
+    S,
     Defaults
   > &
   PP
@@ -91,29 +95,33 @@ export type DefineComponent<
 export function defineComponent<
   Props extends Record<string, any>,
   E extends EmitsOptions = {},
-  EE extends string = string
+  EE extends string = string,
+  S extends SlotsType = {}
 >(
   setup: (
     props: Props,
-    ctx: SetupContext<E>
+    ctx: SetupContext<E, S>
   ) => RenderFunction | Promise<RenderFunction>,
   options?: Pick<ComponentOptions, 'name' | 'inheritAttrs'> & {
     props?: (keyof Props)[]
     emits?: E | EE[]
+    slots?: S
   }
 ): (props: Props & EmitsToProps<E>) => any
 export function defineComponent<
   Props extends Record<string, any>,
   E extends EmitsOptions = {},
-  EE extends string = string
+  EE extends string = string,
+  S extends SlotsType = {}
 >(
   setup: (
     props: Props,
-    ctx: SetupContext<E>
+    ctx: SetupContext<E, S>
   ) => RenderFunction | Promise<RenderFunction>,
   options?: Pick<ComponentOptions, 'name' | 'inheritAttrs'> & {
     props?: ComponentObjectPropsOptions<Props>
     emits?: E | EE[]
+    slots?: S
   }
 ): (props: Props & EmitsToProps<E>) => any
 
@@ -130,6 +138,7 @@ export function defineComponent<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = {},
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
 >(
@@ -143,10 +152,11 @@ export function defineComponent<
     Extends,
     E,
     EE,
+    S,
     I,
     II
   >
-): DefineComponent<Props, RawBindings, D, C, M, Mixin, Extends, E, EE>
+): DefineComponent<Props, RawBindings, D, C, M, Mixin, Extends, E, EE, S>
 
 // overload 3: object format with array props declaration
 // props inferred as { [key in PropNames]?: any }
@@ -161,6 +171,7 @@ export function defineComponent<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = {},
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
 >(
@@ -174,6 +185,7 @@ export function defineComponent<
     Extends,
     E,
     EE,
+    S,
     I,
     II
   >
@@ -186,7 +198,8 @@ export function defineComponent<
   Mixin,
   Extends,
   E,
-  EE
+  EE,
+  S
 >
 
 // overload 4: object format with object props declaration
@@ -203,6 +216,7 @@ export function defineComponent<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = {},
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
 >(
@@ -216,10 +230,11 @@ export function defineComponent<
     Extends,
     E,
     EE,
+    S,
     I,
     II
   >
-): DefineComponent<PropsOptions, RawBindings, D, C, M, Mixin, Extends, E, EE>
+): DefineComponent<PropsOptions, RawBindings, D, C, M, Mixin, Extends, E, EE, S>
 
 // implementation, close to no-op
 export function defineComponent(
diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index 98dc7e9a4cf..9fd562081a4 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -19,7 +19,7 @@ import {
   ExtractPropTypes
 } from './componentProps'
 import { warn } from './warning'
-import { VNode } from './vnode'
+import { Slot } from './componentSlots'
 
 // dev only
 const warnRuntimeUsage = (method: string) =>
@@ -178,11 +178,11 @@ export function defineOptions<
 }
 
 export function defineSlots<
-  T extends Record<string, any>
+  T extends Record<string, any[]> = Record<string, any[]>
 >(): // @ts-expect-error
-{
-  [K in keyof T]: (scope: T[K]) => VNode[] | undefined
-} {
+Readonly<{
+  [K in keyof T]: Slot<T[K]>
+}> {
   if (__DEV__) {
     warnRuntimeUsage(`defineSlots`)
   }
diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts
index 3e184d352cf..4febe8929b0 100644
--- a/packages/runtime-core/src/component.ts
+++ b/packages/runtime-core/src/component.ts
@@ -27,7 +27,13 @@ import {
   initProps,
   normalizePropsOptions
 } from './componentProps'
-import { Slots, initSlots, InternalSlots } from './componentSlots'
+import {
+  Slots,
+  initSlots,
+  InternalSlots,
+  SlotsType,
+  TypedSlots
+} from './componentSlots'
 import { warn } from './warning'
 import { ErrorCodes, callWithErrorHandling, handleError } from './errorHandling'
 import { AppContext, createAppContext, AppConfig } from './apiCreateApp'
@@ -117,10 +123,13 @@ export interface ComponentInternalOptions {
   __name?: string
 }
 
-export interface FunctionalComponent<P = {}, E extends EmitsOptions = {}>
-  extends ComponentInternalOptions {
+export interface FunctionalComponent<
+  P = {},
+  E extends EmitsOptions = {},
+  S extends SlotsType = {}
+> extends ComponentInternalOptions {
   // use of any here is intentional so it can be a valid JSX Element constructor
-  (props: P, ctx: Omit<SetupContext<E>, 'expose'>): any
+  (props: P, ctx: Omit<SetupContext<E, S>, 'expose'>): any
   props?: ComponentPropsOptions<P>
   emits?: E | (keyof E)[]
   inheritAttrs?: boolean
@@ -168,10 +177,13 @@ export type { ComponentOptions }
 type LifecycleHook<TFn = Function> = TFn[] | null
 
 // use `E extends any` to force evaluating type to fix #2362
-export type SetupContext<E = EmitsOptions> = E extends any
+export type SetupContext<
+  E = EmitsOptions,
+  S extends SlotsType = {}
+> = E extends any
   ? {
       attrs: Data
-      slots: Slots
+      slots: [keyof S] extends [never] ? Slots : TypedSlots<S>
       emit: EmitFn<E>
       expose: (exposed?: Record<string, any>) => void
     }
diff --git a/packages/runtime-core/src/componentOptions.ts b/packages/runtime-core/src/componentOptions.ts
index b5324c80dd0..04c3839dd1d 100644
--- a/packages/runtime-core/src/componentOptions.ts
+++ b/packages/runtime-core/src/componentOptions.ts
@@ -74,6 +74,7 @@ import {
 } from './compat/compatConfig'
 import { OptionMergeFunction } from './apiCreateApp'
 import { LifecycleHooks } from './enums'
+import { SlotsType } from './componentSlots'
 
 /**
  * Interface for declaring custom options.
@@ -105,6 +106,7 @@ export interface ComponentOptionsBase<
   Extends extends ComponentOptionsMixin,
   E extends EmitsOptions,
   EE extends string = string,
+  S extends SlotsType = {},
   Defaults = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
@@ -122,7 +124,7 @@ export interface ComponentOptionsBase<
           >
         >
     >,
-    ctx: SetupContext<E>
+    ctx: SetupContext<E, S>
   ) => Promise<RawBindings> | RawBindings | RenderFunction | void
   name?: string
   template?: string | object // can be a direct DOM node
@@ -136,6 +138,7 @@ export interface ComponentOptionsBase<
   directives?: Record<string, Directive>
   inheritAttrs?: boolean
   emits?: (E | EE[]) & ThisType<void>
+  slots?: S
   // TODO infer public instance type based on exposed keys
   expose?: string[]
   serverPrefetch?(): void | Promise<any>
@@ -216,6 +219,7 @@ export type ComponentOptionsWithoutProps<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = EmitsOptions,
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string,
   PE = Props & EmitsToProps<E>
@@ -229,6 +233,7 @@ export type ComponentOptionsWithoutProps<
   Extends,
   E,
   EE,
+  S,
   {},
   I,
   II
@@ -244,6 +249,7 @@ export type ComponentOptionsWithoutProps<
       Mixin,
       Extends,
       E,
+      S,
       PE,
       {},
       false,
@@ -261,6 +267,7 @@ export type ComponentOptionsWithArrayProps<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = EmitsOptions,
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string,
   Props = Prettify<Readonly<{ [key in PropNames]?: any } & EmitsToProps<E>>>
@@ -274,6 +281,7 @@ export type ComponentOptionsWithArrayProps<
   Extends,
   E,
   EE,
+  S,
   {},
   I,
   II
@@ -289,6 +297,7 @@ export type ComponentOptionsWithArrayProps<
       Mixin,
       Extends,
       E,
+      S,
       Props,
       {},
       false,
@@ -306,6 +315,7 @@ export type ComponentOptionsWithObjectProps<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = EmitsOptions,
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string,
   Props = Prettify<Readonly<ExtractPropTypes<PropsOptions> & EmitsToProps<E>>>,
@@ -320,6 +330,7 @@ export type ComponentOptionsWithObjectProps<
   Extends,
   E,
   EE,
+  S,
   Defaults,
   I,
   II
@@ -335,6 +346,7 @@ export type ComponentOptionsWithObjectProps<
       Mixin,
       Extends,
       E,
+      S,
       Props,
       Defaults,
       false,
@@ -350,8 +362,20 @@ export type ComponentOptions<
   M extends MethodOptions = any,
   Mixin extends ComponentOptionsMixin = any,
   Extends extends ComponentOptionsMixin = any,
-  E extends EmitsOptions = any
-> = ComponentOptionsBase<Props, RawBindings, D, C, M, Mixin, Extends, E> &
+  E extends EmitsOptions = any,
+  S extends SlotsType = any
+> = ComponentOptionsBase<
+  Props,
+  RawBindings,
+  D,
+  C,
+  M,
+  Mixin,
+  Extends,
+  E,
+  string,
+  S
+> &
   ThisType<
     CreateComponentPublicInstance<
       {},
@@ -376,6 +400,7 @@ export type ComponentOptionsMixin = ComponentOptionsBase<
   any,
   any,
   any,
+  any,
   any
 >
 
diff --git a/packages/runtime-core/src/componentPublicInstance.ts b/packages/runtime-core/src/componentPublicInstance.ts
index f083f062052..b376ef3e8ca 100644
--- a/packages/runtime-core/src/componentPublicInstance.ts
+++ b/packages/runtime-core/src/componentPublicInstance.ts
@@ -40,7 +40,7 @@ import {
   ComponentInjectOptions
 } from './componentOptions'
 import { EmitsOptions, EmitFn } from './componentEmits'
-import { Slots } from './componentSlots'
+import { Slots, SlotsType } from './componentSlots'
 import { markAttrsAccessed } from './componentRenderUtils'
 import { currentRenderingInstance } from './componentRenderContext'
 import { warn } from './warning'
@@ -89,6 +89,7 @@ type MixinToOptionTypes<T> = T extends ComponentOptionsBase<
   infer Extends,
   any,
   any,
+  any,
   infer Defaults
 >
   ? OptionTypesType<P & {}, B & {}, D & {}, C & {}, M & {}, Defaults & {}> &
@@ -141,6 +142,7 @@ export type CreateComponentPublicInstance<
   Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = {},
+  S extends SlotsType = {},
   PublicProps = P,
   Defaults = {},
   MakeDefaultsOptional extends boolean = false,
@@ -165,7 +167,7 @@ export type CreateComponentPublicInstance<
   PublicProps,
   PublicDefaults,
   MakeDefaultsOptional,
-  ComponentOptionsBase<P, B, D, C, M, Mixin, Extends, E, string, Defaults>,
+  ComponentOptionsBase<P, B, D, C, M, Mixin, Extends, E, string, S, Defaults>,
   I
 >
 
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index 682a107e676..7ba69d04c53 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -13,7 +13,8 @@ import {
   ShapeFlags,
   extend,
   def,
-  SlotFlags
+  SlotFlags,
+  Prettify
 } from '@vue/shared'
 import { warn } from './warning'
 import { isKeepAlive } from './components/KeepAlive'
@@ -22,7 +23,7 @@ import { isHmrUpdating } from './hmr'
 import { DeprecationTypes, isCompatEnabled } from './compat/compatConfig'
 import { toRaw } from '@vue/reactivity'
 
-export type Slot = (...args: any[]) => VNode[]
+export type Slot<T extends any[] = any[]> = (...args: T) => VNode[]
 
 export type InternalSlots = {
   [name: string]: Slot | undefined
@@ -30,6 +31,19 @@ export type InternalSlots = {
 
 export type Slots = Readonly<InternalSlots>
 
+declare const SlotSymbol: unique symbol
+export type SlotsType<T extends Record<string, any[]> = Record<string, any[]>> =
+  {
+    [SlotSymbol]?: T
+  }
+export type TypedSlots<S extends SlotsType> = Readonly<
+  Prettify<{
+    [K in keyof NonNullable<S[typeof SlotSymbol]>]: Slot<
+      NonNullable<S[typeof SlotSymbol]>[K]
+    >
+  }>
+>
+
 export type RawSlots = {
   [name: string]: unknown
   // manual render fn hint to skip forced children updates
diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index f388ba7b65d..dbcd7943e2a 100644
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -241,7 +241,7 @@ export type {
   RootRenderFunction
 } from './renderer'
 export type { RootHydrateFunction } from './hydration'
-export type { Slot, Slots } from './componentSlots'
+export type { Slot, Slots, SlotsType } from './componentSlots'
 export type {
   Prop,
   PropType,
diff --git a/packages/runtime-dom/src/apiCustomElement.ts b/packages/runtime-dom/src/apiCustomElement.ts
index b4bd143c135..58bc48f64d6 100644
--- a/packages/runtime-dom/src/apiCustomElement.ts
+++ b/packages/runtime-dom/src/apiCustomElement.ts
@@ -20,7 +20,8 @@ import {
   warn,
   ConcreteComponent,
   ComponentOptions,
-  ComponentInjectOptions
+  ComponentInjectOptions,
+  SlotsType
 } from '@vue/runtime-core'
 import { camelize, extend, hyphenate, isArray, toNumber } from '@vue/shared'
 import { hydrate, render } from '.'
@@ -51,6 +52,7 @@ export function defineCustomElement<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = EmitsOptions,
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
 >(
@@ -64,6 +66,7 @@ export function defineCustomElement<
     Extends,
     E,
     EE,
+    S,
     I,
     II
   > & { styles?: string[] }
@@ -80,6 +83,7 @@ export function defineCustomElement<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = Record<string, any>,
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
 >(
@@ -93,6 +97,7 @@ export function defineCustomElement<
     Extends,
     E,
     EE,
+    S,
     I,
     II
   > & { styles?: string[] }
@@ -109,6 +114,7 @@ export function defineCustomElement<
   Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
   E extends EmitsOptions = Record<string, any>,
   EE extends string = string,
+  S extends SlotsType = {},
   I extends ComponentInjectOptions = {},
   II extends string = string
 >(
@@ -122,6 +128,7 @@ export function defineCustomElement<
     Extends,
     E,
     EE,
+    S,
     I,
     II
   > & { styles?: string[] }