From 9fa6fc3bc1ba022c206763775dc9f35d09fce984 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: Wed, 29 Mar 2023 21:02:41 +0800
Subject: [PATCH 01/14] feat: add defineSlots macro

---
 packages/compiler-sfc/src/compileScript.ts    | 27 ++++++++++++++++++-
 packages/runtime-core/src/apiSetupHelpers.ts  | 12 +++++++++
 .../types/scriptSetupHelpers.d.ts             |  2 ++
 3 files changed, 40 insertions(+), 1 deletion(-)

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index de9e11d071f..cdb03757cbe 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -67,6 +67,7 @@ const DEFINE_EMITS = 'defineEmits'
 const DEFINE_EXPOSE = 'defineExpose'
 const WITH_DEFAULTS = 'withDefaults'
 const DEFINE_OPTIONS = 'defineOptions'
+const DEFINT_SLOTS = 'defineSlots'
 
 const isBuiltInDir = makeMap(
   `once,memo,if,for,else,else-if,slot,text,html,on,bind,model,show,cloak,is`
@@ -312,6 +313,7 @@ export function compileScript(
   let hasDefaultExportName = false
   let hasDefaultExportRender = false
   let hasDefineOptionsCall = false
+  let hasDefineSlotsCall = false
   let propsRuntimeDecl: Node | undefined
   let propsRuntimeDefaults: Node | undefined
   let propsDestructureDecl: Node | undefined
@@ -590,6 +592,26 @@ export function compileScript(
     return true
   }
 
+  function processDefineSlots(node: Node, declId?: LVal): boolean {
+    if (!isCallOf(node, DEFINT_SLOTS)) {
+      return false
+    }
+    if (hasDefineSlotsCall) {
+      error(`duplicate ${DEFINT_SLOTS}() call`, node)
+    }
+    hasDefineSlotsCall = true
+
+    if (declId) {
+      s.overwrite(
+        startOffset + node.start!,
+        startOffset + node.end!,
+        `${helper('useSlots')}()`
+      )
+    }
+
+    return true
+  }
+
   function getAstBody(): Statement[] {
     return scriptAst
       ? [...scriptSetupAst.body, ...scriptAst.body]
@@ -1286,7 +1308,8 @@ export function compileScript(
         processDefineProps(expr) ||
         processDefineEmits(expr) ||
         processDefineOptions(expr) ||
-        processWithDefaults(expr)
+        processWithDefaults(expr) ||
+        processDefineSlots(expr)
       ) {
         s.remove(node.start! + startOffset, node.end! + startOffset)
       } else if (processDefineExpose(expr)) {
@@ -1321,6 +1344,8 @@ export function compileScript(
             processDefineProps(init, decl.id) ||
             processWithDefaults(init, decl.id)
           const isDefineEmits = processDefineEmits(init, decl.id)
+          processDefineSlots(init, decl.id)
+
           if (isDefineProps || isDefineEmits) {
             if (left === 1) {
               s.remove(node.start! + startOffset, node.end! + startOffset)
diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index 31307aa7e75..c560f142a2f 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -25,6 +25,7 @@ import {
   ExtractPropTypes
 } from './componentProps'
 import { warn } from './warning'
+import { VNode } from './vnode'
 
 // dev only
 const warnRuntimeUsage = (method: string) =>
@@ -192,6 +193,17 @@ export function defineOptions<
   }
 }
 
+export function defineSlots<
+  T extends Record<string, any>
+>(): // @ts-expect-error
+{
+  [K in keyof T]: (scope: T[K]) => VNode[] | undefined
+} {
+  if (__DEV__) {
+    warnRuntimeUsage(`defineSlots`)
+  }
+}
+
 type NotUndefined<T> = T extends undefined ? never : T
 
 type InferDefaults<T> = {
diff --git a/packages/runtime-core/types/scriptSetupHelpers.d.ts b/packages/runtime-core/types/scriptSetupHelpers.d.ts
index ba4ca79fc59..4ffc2f725ae 100644
--- a/packages/runtime-core/types/scriptSetupHelpers.d.ts
+++ b/packages/runtime-core/types/scriptSetupHelpers.d.ts
@@ -4,6 +4,7 @@ type _defineProps = typeof defineProps
 type _defineEmits = typeof defineEmits
 type _defineExpose = typeof defineExpose
 type _defineOptions = typeof defineOptions
+type _defineSlots = typeof defineSlots
 type _withDefaults = typeof withDefaults
 
 declare global {
@@ -11,5 +12,6 @@ declare global {
   const defineEmits: _defineEmits
   const defineExpose: _defineExpose
   const defineOptions: _defineOptions
+  const defineSlots: _defineSlots
   const withDefaults: _withDefaults
 }

From 8310e5605933914666e5ab1180a162d2d50ec95b 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: Wed, 29 Mar 2023 21:17:28 +0800
Subject: [PATCH 02/14] fix: types

---
 packages/compiler-sfc/src/compileScript.ts | 6 +++---
 packages/runtime-core/src/index.ts         | 1 +
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index cdb03757cbe..c735525d084 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -67,7 +67,7 @@ const DEFINE_EMITS = 'defineEmits'
 const DEFINE_EXPOSE = 'defineExpose'
 const WITH_DEFAULTS = 'withDefaults'
 const DEFINE_OPTIONS = 'defineOptions'
-const DEFINT_SLOTS = 'defineSlots'
+const DEFINE_SLOTS = 'defineSlots'
 
 const isBuiltInDir = makeMap(
   `once,memo,if,for,else,else-if,slot,text,html,on,bind,model,show,cloak,is`
@@ -593,11 +593,11 @@ export function compileScript(
   }
 
   function processDefineSlots(node: Node, declId?: LVal): boolean {
-    if (!isCallOf(node, DEFINT_SLOTS)) {
+    if (!isCallOf(node, DEFINE_SLOTS)) {
       return false
     }
     if (hasDefineSlotsCall) {
-      error(`duplicate ${DEFINT_SLOTS}() call`, node)
+      error(`duplicate ${DEFINE_SLOTS}() call`, node)
     }
     hasDefineSlotsCall = true
 
diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index 06f9a2affd4..f388ba7b65d 100644
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -69,6 +69,7 @@ export {
   defineEmits,
   defineExpose,
   defineOptions,
+  defineSlots,
   withDefaults,
   // internal
   mergeDefaults,

From 477dd22af9c0de27fda8cf124d5cfcf0b3b02d1c 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 14:31:01 +0800
Subject: [PATCH 03/14] feat: disallow runtime

---
 packages/compiler-sfc/src/compileScript.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index c735525d084..7d1b96186a4 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -601,6 +601,10 @@ export function compileScript(
     }
     hasDefineSlotsCall = true
 
+    if (node.arguments) {
+      error(`${DEFINE_SLOTS}() cannot accept arguments`, node)
+    }
+
     if (declId) {
       s.overwrite(
         startOffset + node.start!,

From 05c4dca1447cd2d262138defff46333c11c7b114 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 04/14] 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 f59a7407c25..c4cec4779bd 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -1785,6 +1785,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 b3907fa7211..d7dfab72523 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -1585,6 +1585,40 @@ const emit = defineEmits(['a', 'b'])
       assertCode(content)
     })
 
+    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 7d1b96186a4..d1d832ec5cf 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -601,7 +601,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 d5d332daa1b..e83f6787aac 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'
 
@@ -179,6 +181,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 c560f142a2f..5252d2a7304 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -25,7 +25,7 @@ import {
   ExtractPropTypes
 } from './componentProps'
 import { warn } from './warning'
-import { VNode } from './vnode'
+import { Slot } from './componentSlots'
 
 // dev only
 const warnRuntimeUsage = (method: string) =>
@@ -194,11 +194,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[] }

From fe5bae9df1638eabedfca162961432cf4e2ee327 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 16:20:49 +0800
Subject: [PATCH 05/14] refactor: skip repeat checking

---
 packages/compiler-sfc/src/compileScript.ts   | 5 +++--
 packages/dts-test/defineComponent.test-d.tsx | 1 -
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index d1d832ec5cf..a65168e4f96 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -1347,8 +1347,9 @@ export function compileScript(
           const isDefineProps =
             processDefineProps(init, decl.id) ||
             processWithDefaults(init, decl.id)
-          const isDefineEmits = processDefineEmits(init, decl.id)
-          processDefineSlots(init, decl.id)
+          const isDefineEmits =
+            !isDefineProps && processDefineEmits(init, decl.id)
+          !isDefineEmits && processDefineSlots(init, decl.id)
 
           if (isDefineProps || isDefineEmits) {
             if (left === 1) {
diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index 3f0928d708c..963034d40cf 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -10,7 +10,6 @@ import {
   SetupContext,
   h,
   SlotsType,
-  useSlots,
   Slots
 } from 'vue'
 import { describe, expectType, IsUnion } from './utils'

From 370b835e08fd0370220f3cfeb0417ffa5918a63f 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 17:25:20 +0800
Subject: [PATCH 06/14] fix: functional component & public instance

---
 packages/compiler-sfc/src/compileScript.ts        |  8 ++++++++
 packages/dts-test/functionalComponent.test-d.tsx  | 11 ++++++++++-
 packages/runtime-core/src/apiSetupHelpers.ts      | 10 +++-------
 packages/runtime-core/src/component.ts            | 10 +++++-----
 .../runtime-core/src/componentPublicInstance.ts   |  6 ++++--
 packages/runtime-core/src/componentSlots.ts       | 15 +++++++++------
 packages/runtime-core/src/h.ts                    |  8 ++++++--
 7 files changed, 45 insertions(+), 23 deletions(-)

diff --git a/packages/compiler-sfc/src/compileScript.ts b/packages/compiler-sfc/src/compileScript.ts
index a65168e4f96..54a28fa1944 100644
--- a/packages/compiler-sfc/src/compileScript.ts
+++ b/packages/compiler-sfc/src/compileScript.ts
@@ -709,6 +709,7 @@ export function compileScript(
     let propsOption = undefined
     let emitsOption = undefined
     let exposeOption = undefined
+    let slotsOption = undefined
     if (optionsRuntimeDecl.type === 'ObjectExpression') {
       for (const prop of optionsRuntimeDecl.properties) {
         if (
@@ -718,6 +719,7 @@ export function compileScript(
           if (prop.key.name === 'props') propsOption = prop
           if (prop.key.name === 'emits') emitsOption = prop
           if (prop.key.name === 'expose') exposeOption = prop
+          if (prop.key.name === 'slots') slotsOption = prop
         }
       }
     }
@@ -740,6 +742,12 @@ export function compileScript(
         exposeOption
       )
     }
+    if (slotsOption) {
+      error(
+        `${DEFINE_OPTIONS}() cannot be used to declare slots. Use ${DEFINE_SLOTS}() instead.`,
+        slotsOption
+      )
+    }
 
     return true
   }
diff --git a/packages/dts-test/functionalComponent.test-d.tsx b/packages/dts-test/functionalComponent.test-d.tsx
index 383debcb7fe..9d4ad378794 100644
--- a/packages/dts-test/functionalComponent.test-d.tsx
+++ b/packages/dts-test/functionalComponent.test-d.tsx
@@ -1,4 +1,4 @@
-import { h, Text, FunctionalComponent, Component } from 'vue'
+import { h, Text, FunctionalComponent, Component, SlotsType, VNode } from 'vue'
 import { expectType } from './utils'
 
 // simple function signature
@@ -68,3 +68,12 @@ const Qux: FunctionalComponent<{}, ['foo', 'bar']> = (props, { emit }) => {
 }
 
 expectType<Component>(Qux)
+
+const Quux: FunctionalComponent<{}, {}, { default: [foo: number] }> = (
+  props,
+  { emit, slots }
+) => {
+  expectType<{ default: (foo: number) => VNode[] }>(slots)
+}
+expectType<Component>(Quux)
+;<Quux />
diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index 5252d2a7304..5e91125674f 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -172,9 +172,7 @@ export function defineOptions<
   C extends ComputedOptions = {},
   M extends MethodOptions = {},
   Mixin extends ComponentOptionsMixin = ComponentOptionsMixin,
-  Extends extends ComponentOptionsMixin = ComponentOptionsMixin,
-  E extends EmitsOptions = EmitsOptions,
-  EE extends string = string
+  Extends extends ComponentOptionsMixin = ComponentOptionsMixin
 >(
   options?: ComponentOptionsWithoutProps<
     {},
@@ -183,10 +181,8 @@ export function defineOptions<
     C,
     M,
     Mixin,
-    Extends,
-    E,
-    EE
-  > & { emits?: undefined; expose?: undefined }
+    Extends
+  > & { emits?: undefined; expose?: undefined; slots?: undefined }
 ): void {
   if (__DEV__) {
     warnRuntimeUsage(`defineOptions`)
diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts
index 4febe8929b0..f8562ff2d9c 100644
--- a/packages/runtime-core/src/component.ts
+++ b/packages/runtime-core/src/component.ts
@@ -28,7 +28,6 @@ import {
   normalizePropsOptions
 } from './componentProps'
 import {
-  Slots,
   initSlots,
   InternalSlots,
   SlotsType,
@@ -126,12 +125,13 @@ export interface ComponentInternalOptions {
 export interface FunctionalComponent<
   P = {},
   E extends EmitsOptions = {},
-  S extends SlotsType = {}
+  S extends Record<string, any[]> = {}
 > extends ComponentInternalOptions {
   // use of any here is intentional so it can be a valid JSX Element constructor
-  (props: P, ctx: Omit<SetupContext<E, S>, 'expose'>): any
+  (props: P, ctx: Omit<SetupContext<E, SlotsType<S>>, 'expose'>): any
   props?: ComponentPropsOptions<P>
   emits?: E | (keyof E)[]
+  slots?: SlotsType<S>
   inheritAttrs?: boolean
   displayName?: string
   compatConfig?: CompatConfig
@@ -156,7 +156,7 @@ export type ConcreteComponent<
   M extends MethodOptions = MethodOptions
 > =
   | ComponentOptions<Props, RawBindings, D, C, M>
-  | FunctionalComponent<Props, any>
+  | FunctionalComponent<Props, any, any>
 
 /**
  * A type used in public APIs where a component type is expected.
@@ -183,7 +183,7 @@ export type SetupContext<
 > = E extends any
   ? {
       attrs: Data
-      slots: [keyof S] extends [never] ? Slots : TypedSlots<S>
+      slots: TypedSlots<S>
       emit: EmitFn<E>
       expose: (exposed?: Record<string, any>) => void
     }
diff --git a/packages/runtime-core/src/componentPublicInstance.ts b/packages/runtime-core/src/componentPublicInstance.ts
index b376ef3e8ca..9997296b641 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, SlotsType } from './componentSlots'
+import { SlotsType, TypedSlots } from './componentSlots'
 import { markAttrsAccessed } from './componentRenderUtils'
 import { currentRenderingInstance } from './componentRenderContext'
 import { warn } from './warning'
@@ -164,6 +164,7 @@ export type CreateComponentPublicInstance<
   PublicC,
   PublicM,
   E,
+  S,
   PublicProps,
   PublicDefaults,
   MakeDefaultsOptional,
@@ -180,6 +181,7 @@ export type ComponentPublicInstance<
   C extends ComputedOptions = {},
   M extends MethodOptions = {},
   E extends EmitsOptions = {},
+  S extends SlotsType = {},
   PublicProps = P,
   Defaults = {},
   MakeDefaultsOptional extends boolean = false,
@@ -195,7 +197,7 @@ export type ComponentPublicInstance<
   >
   $attrs: Data
   $refs: Data
-  $slots: Slots
+  $slots: TypedSlots<S>
   $root: ComponentPublicInstance | null
   $parent: ComponentPublicInstance | null
   $emit: EmitFn<E>
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index 7ba69d04c53..e9619926434 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -36,13 +36,16 @@ 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 TypedSlots<S extends SlotsType> = [keyof S] extends [never]
+  ? Slots
+  : Readonly<
+      Prettify<{
+        [K in keyof NonNullable<S[typeof SlotSymbol]>]: Slot<
+          NonNullable<S[typeof SlotSymbol]>[K]
+        >
+      }>
     >
-  }>
->
 
 export type RawSlots = {
   [name: string]: unknown
diff --git a/packages/runtime-core/src/h.ts b/packages/runtime-core/src/h.ts
index 520f568e7a8..c3c65cdfdd5 100644
--- a/packages/runtime-core/src/h.ts
+++ b/packages/runtime-core/src/h.ts
@@ -120,8 +120,12 @@ export function h(
 ): VNode
 
 // functional component
-export function h<P, E extends EmitsOptions = {}>(
-  type: FunctionalComponent<P, E>,
+export function h<
+  P,
+  E extends EmitsOptions = {},
+  S extends Record<string, any[]> = {}
+>(
+  type: FunctionalComponent<P, E, S>,
   props?: (RawProps & P) | ({} extends P ? null : never),
   children?: RawChildren | RawSlots
 ): VNode

From 90814c8016c353b1b50a8a614e430c667043690d 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 17:34:13 +0800
Subject: [PATCH 07/14] fix: types

---
 packages/dts-test/defineComponent.test-d.tsx     | 4 ++--
 packages/dts-test/functionalComponent.test-d.tsx | 4 ++--
 packages/runtime-core/src/component.ts           | 2 +-
 packages/runtime-core/src/componentSlots.ts      | 6 +++---
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index 963034d40cf..bd6488b7f35 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -1415,8 +1415,8 @@ describe('slots', () => {
       item: [number]
     }>,
     setup(props, { slots }) {
-      expectType<(foo: string, bar: number) => any>(slots.default)
-      expectType<(scope: number) => any>(slots.item)
+      expectType<undefined | ((foo: string, bar: number) => any)>(slots.default)
+      expectType<undefined | ((scope: number) => any)>(slots.item)
     }
   })
 
diff --git a/packages/dts-test/functionalComponent.test-d.tsx b/packages/dts-test/functionalComponent.test-d.tsx
index 9d4ad378794..3087dcf43f6 100644
--- a/packages/dts-test/functionalComponent.test-d.tsx
+++ b/packages/dts-test/functionalComponent.test-d.tsx
@@ -1,4 +1,4 @@
-import { h, Text, FunctionalComponent, Component, SlotsType, VNode } from 'vue'
+import { h, Text, FunctionalComponent, Component, VNode } from 'vue'
 import { expectType } from './utils'
 
 // simple function signature
@@ -73,7 +73,7 @@ const Quux: FunctionalComponent<{}, {}, { default: [foo: number] }> = (
   props,
   { emit, slots }
 ) => {
-  expectType<{ default: (foo: number) => VNode[] }>(slots)
+  expectType<{ default: undefined | ((foo: number) => VNode[]) }>(slots)
 }
 expectType<Component>(Quux)
 ;<Quux />
diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts
index f8562ff2d9c..068ccc64c85 100644
--- a/packages/runtime-core/src/component.ts
+++ b/packages/runtime-core/src/component.ts
@@ -125,7 +125,7 @@ export interface ComponentInternalOptions {
 export interface FunctionalComponent<
   P = {},
   E extends EmitsOptions = {},
-  S extends Record<string, any[]> = {}
+  S extends Record<string, any[]> = Record<string, any[]>
 > extends ComponentInternalOptions {
   // use of any here is intentional so it can be a valid JSX Element constructor
   (props: P, ctx: Omit<SetupContext<E, SlotsType<S>>, 'expose'>): any
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index e9619926434..696b9558cca 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -41,9 +41,9 @@ export type TypedSlots<S extends SlotsType> = [keyof S] extends [never]
   ? Slots
   : Readonly<
       Prettify<{
-        [K in keyof NonNullable<S[typeof SlotSymbol]>]: Slot<
-          NonNullable<S[typeof SlotSymbol]>[K]
-        >
+        [K in keyof NonNullable<S[typeof SlotSymbol]>]:
+          | Slot<NonNullable<S[typeof SlotSymbol]>[K]>
+          | undefined
       }>
     >
 

From f908ae22838c8a284e99db3922d2f4d878926933 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 18:56:31 +0800
Subject: [PATCH 08/14] refactor: style

---
 packages/dts-test/defineComponent.test-d.tsx     | 15 ++++++---------
 packages/dts-test/functionalComponent.test-d.tsx |  6 ++++--
 packages/dts-test/setupHelpers.test-d.ts         |  7 ++-----
 packages/runtime-core/src/apiSetupHelpers.ts     |  4 ++--
 packages/runtime-core/src/component.ts           |  2 +-
 packages/runtime-core/src/componentSlots.ts      | 13 +++++++------
 packages/runtime-core/src/h.ts                   |  2 +-
 7 files changed, 23 insertions(+), 26 deletions(-)

diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index bd6488b7f35..b9470cddbfa 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -1411,20 +1411,17 @@ export default {
 describe('slots', () => {
   defineComponent({
     slots: Object as SlotsType<{
-      default: [foo: string, bar: number]
-      item: [number]
+      default: { foo: string; bar: number }
+      item: { data: number }
     }>,
     setup(props, { slots }) {
-      expectType<undefined | ((foo: string, bar: number) => any)>(slots.default)
-      expectType<undefined | ((scope: number) => any)>(slots.item)
+      expectType<undefined | ((scope: { foo: string; bar: number }) => any)>(
+        slots.default
+      )
+      expectType<undefined | ((scope: { data: 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
diff --git a/packages/dts-test/functionalComponent.test-d.tsx b/packages/dts-test/functionalComponent.test-d.tsx
index 3087dcf43f6..37e2c9c9f91 100644
--- a/packages/dts-test/functionalComponent.test-d.tsx
+++ b/packages/dts-test/functionalComponent.test-d.tsx
@@ -69,11 +69,13 @@ const Qux: FunctionalComponent<{}, ['foo', 'bar']> = (props, { emit }) => {
 
 expectType<Component>(Qux)
 
-const Quux: FunctionalComponent<{}, {}, { default: [foo: number] }> = (
+const Quux: FunctionalComponent<{}, {}, { default: { foo: number } }> = (
   props,
   { emit, slots }
 ) => {
-  expectType<{ default: undefined | ((foo: number) => VNode[]) }>(slots)
+  expectType<{ default: undefined | ((scope: { foo: number }) => VNode[]) }>(
+    slots
+  )
 }
 expectType<Component>(Quux)
 ;<Quux />
diff --git a/packages/dts-test/setupHelpers.test-d.ts b/packages/dts-test/setupHelpers.test-d.ts
index e83f6787aac..36f0350822b 100644
--- a/packages/dts-test/setupHelpers.test-d.ts
+++ b/packages/dts-test/setupHelpers.test-d.ts
@@ -183,15 +183,12 @@ describe('defineEmits w/ runtime declaration', () => {
 
 describe('defineSlots', () => {
   const slots = defineSlots<{
-    default: [foo: string, bar: number]
+    default: { foo: string; bar: number }
   }>()
-  expectType<(foo: string, bar: number) => VNode[]>(slots.default)
+  expectType<(scope: { 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', () => {
diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index 5e91125674f..e302a47f69d 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -190,10 +190,10 @@ export function defineOptions<
 }
 
 export function defineSlots<
-  T extends Record<string, any[]> = Record<string, any[]>
+  T extends Record<string, any> = Record<string, any>
 >(): // @ts-expect-error
 Readonly<{
-  [K in keyof T]: Slot<T[K]>
+  [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 068ccc64c85..1e5e973e81a 100644
--- a/packages/runtime-core/src/component.ts
+++ b/packages/runtime-core/src/component.ts
@@ -125,7 +125,7 @@ export interface ComponentInternalOptions {
 export interface FunctionalComponent<
   P = {},
   E extends EmitsOptions = {},
-  S extends Record<string, any[]> = Record<string, any[]>
+  S extends Record<string, any> = Record<string, any>
 > extends ComponentInternalOptions {
   // use of any here is intentional so it can be a valid JSX Element constructor
   (props: P, ctx: Omit<SetupContext<E, SlotsType<S>>, 'expose'>): any
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index 696b9558cca..aa0c8b21e3c 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -23,7 +23,9 @@ import { isHmrUpdating } from './hmr'
 import { DeprecationTypes, isCompatEnabled } from './compat/compatConfig'
 import { toRaw } from '@vue/reactivity'
 
-export type Slot<T extends any[] = any[]> = (...args: T) => VNode[]
+export type Slot<T extends any[] = any[]> = (
+  ...args: T extends [any] ? any[] : T
+) => VNode[]
 
 export type InternalSlots = {
   [name: string]: Slot | undefined
@@ -32,17 +34,16 @@ 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 SlotsType<T extends Record<string, any> = Record<string, any>> = {
+  [SlotSymbol]?: T
+}
 
 export type TypedSlots<S extends SlotsType> = [keyof S] extends [never]
   ? Slots
   : Readonly<
       Prettify<{
         [K in keyof NonNullable<S[typeof SlotSymbol]>]:
-          | Slot<NonNullable<S[typeof SlotSymbol]>[K]>
+          | Slot<[NonNullable<S[typeof SlotSymbol]>[K]]>
           | undefined
       }>
     >
diff --git a/packages/runtime-core/src/h.ts b/packages/runtime-core/src/h.ts
index c3c65cdfdd5..73b27107b8b 100644
--- a/packages/runtime-core/src/h.ts
+++ b/packages/runtime-core/src/h.ts
@@ -123,7 +123,7 @@ export function h(
 export function h<
   P,
   E extends EmitsOptions = {},
-  S extends Record<string, any[]> = {}
+  S extends Record<string, any> = {}
 >(
   type: FunctionalComponent<P, E, S>,
   props?: (RawProps & P) | ({} extends P ? null : never),

From 99d48bd9e5325e5a3ba2c74db64a2241c4e7fe19 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 19:12:43 +0800
Subject: [PATCH 09/14] fix: sfc test

---
 packages/compiler-sfc/__tests__/compileScript.spec.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index d7dfab72523..5fdccdc7963 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -1589,7 +1589,7 @@ const emit = defineEmits(['a', 'b'])
       const { content } = compile(`
       <script setup lang="ts">
       const slots = defineSlots<{
-        default: [msg: string]
+        default: { msg: string }
       }>()
       </script>
       `)
@@ -1601,7 +1601,7 @@ const emit = defineEmits(['a', 'b'])
       const { content } = compile(`
       <script setup lang="ts">
       defineSlots<{
-        default: [msg: string]
+        default: { msg: string }
       }>()
       </script>
       `)

From 8140bd648d3781bc1ae63e0a9d37956aa5301bcd 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: Fri, 31 Mar 2023 02:28:56 +0800
Subject: [PATCH 10/14] feat: optional slots

---
 packages/dts-test/defineComponent.test-d.tsx  | 26 ++++++++++++++-----
 packages/dts-test/setupHelpers.test-d.ts      |  2 ++
 packages/runtime-core/src/apiSetupHelpers.ts  |  8 +++---
 packages/runtime-core/src/component.ts        | 13 +++++++---
 .../runtime-core/src/componentRenderUtils.ts  |  2 +-
 packages/runtime-core/src/componentSlots.ts   | 13 +++++-----
 6 files changed, 41 insertions(+), 23 deletions(-)

diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index b9470cddbfa..add9c8a3fc0 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -10,7 +10,8 @@ import {
   SetupContext,
   h,
   SlotsType,
-  Slots
+  Slots,
+  VNode
 } from 'vue'
 import { describe, expectType, IsUnion } from './utils'
 
@@ -1409,26 +1410,37 @@ export default {
 }
 
 describe('slots', () => {
-  defineComponent({
+  const comp1 = defineComponent({
     slots: Object as SlotsType<{
       default: { foo: string; bar: number }
-      item: { data: number }
+      optional?: { data: string }
     }>,
     setup(props, { slots }) {
-      expectType<undefined | ((scope: { foo: string; bar: number }) => any)>(
+      expectType<(scope: { foo: string; bar: number }) => VNode[]>(
         slots.default
       )
-      expectType<undefined | ((scope: { data: number }) => any)>(slots.item)
+      expectType<((scope: { data: string }) => VNode[]) | undefined>(
+        slots.optional
+      )
+
+      slots.default({ foo: 'foo', bar: 1 })
+
+      // @ts-expect-error it's optional
+      slots.optional({ data: 'foo' })
+      slots.optional?.({ data: 'foo' })
+
+      expectType<typeof slots | undefined>(new comp1().$slots)
     }
   })
 
-  defineComponent({
+  const comp2 = defineComponent({
     setup(props, { slots }) {
       // unknown slots
       expectType<Slots>(slots)
-      expectType<((...args: any[]) => any) | undefined>(slots.default)
+      expectType<((...args: any[]) => VNode[]) | undefined>(slots.default)
     }
   })
+  expectType<Slots | undefined>(new comp2().$slots)
 })
 
 import {
diff --git a/packages/dts-test/setupHelpers.test-d.ts b/packages/dts-test/setupHelpers.test-d.ts
index 36f0350822b..ab7ab874f91 100644
--- a/packages/dts-test/setupHelpers.test-d.ts
+++ b/packages/dts-test/setupHelpers.test-d.ts
@@ -184,8 +184,10 @@ describe('defineEmits w/ runtime declaration', () => {
 describe('defineSlots', () => {
   const slots = defineSlots<{
     default: { foo: string; bar: number }
+    optional?: string
   }>()
   expectType<(scope: { foo: string; bar: number }) => VNode[]>(slots.default)
+  expectType<undefined | ((scope: string) => VNode[])>(slots.optional)
 
   const slotsUntype = defineSlots()
   expectType<Slots>(slotsUntype)
diff --git a/packages/runtime-core/src/apiSetupHelpers.ts b/packages/runtime-core/src/apiSetupHelpers.ts
index e302a47f69d..dab1b4b30e8 100644
--- a/packages/runtime-core/src/apiSetupHelpers.ts
+++ b/packages/runtime-core/src/apiSetupHelpers.ts
@@ -25,7 +25,7 @@ import {
   ExtractPropTypes
 } from './componentProps'
 import { warn } from './warning'
-import { Slot } from './componentSlots'
+import { SlotsType, TypedSlots } from './componentSlots'
 
 // dev only
 const warnRuntimeUsage = (method: string) =>
@@ -190,11 +190,9 @@ export function defineOptions<
 }
 
 export function defineSlots<
-  T extends Record<string, any> = Record<string, any>
+  S extends Record<string, any> = Record<string, any>
 >(): // @ts-expect-error
-Readonly<{
-  [K in keyof T]: Slot<[T[K]]>
-}> {
+TypedSlots<SlotsType<S>> {
   if (__DEV__) {
     warnRuntimeUsage(`defineSlots`)
   }
diff --git a/packages/runtime-core/src/component.ts b/packages/runtime-core/src/component.ts
index 1e5e973e81a..941231b393d 100644
--- a/packages/runtime-core/src/component.ts
+++ b/packages/runtime-core/src/component.ts
@@ -30,6 +30,7 @@ import {
 import {
   initSlots,
   InternalSlots,
+  Slots,
   SlotsType,
   TypedSlots
 } from './componentSlots'
@@ -62,7 +63,8 @@ import {
   isPromise,
   ShapeFlags,
   extend,
-  getGlobalThis
+  getGlobalThis,
+  IfAny
 } from '@vue/shared'
 import { SuspenseBoundary } from './components/Suspense'
 import { CompilerOptions } from '@vue/compiler-core'
@@ -125,13 +127,16 @@ export interface ComponentInternalOptions {
 export interface FunctionalComponent<
   P = {},
   E extends EmitsOptions = {},
-  S extends Record<string, any> = Record<string, any>
+  S extends Record<string, any> = any
 > extends ComponentInternalOptions {
   // use of any here is intentional so it can be a valid JSX Element constructor
-  (props: P, ctx: Omit<SetupContext<E, SlotsType<S>>, 'expose'>): any
+  (
+    props: P,
+    ctx: Omit<SetupContext<E, IfAny<S, {}, SlotsType<S>>>, 'expose'>
+  ): any
   props?: ComponentPropsOptions<P>
   emits?: E | (keyof E)[]
-  slots?: SlotsType<S>
+  slots?: IfAny<S, Slots, SlotsType<S>>
   inheritAttrs?: boolean
   displayName?: string
   compatConfig?: CompatConfig
diff --git a/packages/runtime-core/src/componentRenderUtils.ts b/packages/runtime-core/src/componentRenderUtils.ts
index d9de968a074..194ac30fa2a 100644
--- a/packages/runtime-core/src/componentRenderUtils.ts
+++ b/packages/runtime-core/src/componentRenderUtils.ts
@@ -102,7 +102,7 @@ export function renderComponentRoot(
                       markAttrsAccessed()
                       return attrs
                     },
-                    slots,
+                    slots: slots,
                     emit
                   }
                 : { attrs, slots, emit }
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index aa0c8b21e3c..1a0db39cadb 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -14,7 +14,8 @@ import {
   extend,
   def,
   SlotFlags,
-  Prettify
+  Prettify,
+  IfAny
 } from '@vue/shared'
 import { warn } from './warning'
 import { isKeepAlive } from './components/KeepAlive'
@@ -23,8 +24,8 @@ import { isHmrUpdating } from './hmr'
 import { DeprecationTypes, isCompatEnabled } from './compat/compatConfig'
 import { toRaw } from '@vue/reactivity'
 
-export type Slot<T extends any[] = any[]> = (
-  ...args: T extends [any] ? any[] : T
+export type Slot<T extends any = any> = (
+  ...args: IfAny<T, any[], [T]>
 ) => VNode[]
 
 export type InternalSlots = {
@@ -42,9 +43,9 @@ export type TypedSlots<S extends SlotsType> = [keyof S] extends [never]
   ? Slots
   : Readonly<
       Prettify<{
-        [K in keyof NonNullable<S[typeof SlotSymbol]>]:
-          | Slot<[NonNullable<S[typeof SlotSymbol]>[K]]>
-          | undefined
+        [K in keyof NonNullable<S[typeof SlotSymbol]>]: Slot<
+          NonNullable<NonNullable<S[typeof SlotSymbol]>[K]>
+        >
       }>
     >
 

From e8a821e1f72e14e7e8f8942d136fd06157ccbaab 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: Fri, 31 Mar 2023 02:45:03 +0800
Subject: [PATCH 11/14] feat: undefined slot scope

---
 packages/dts-test/defineComponent.test-d.tsx | 29 ++++++++++++++++++++
 packages/runtime-core/src/componentSlots.ts  |  4 +--
 2 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/packages/dts-test/defineComponent.test-d.tsx b/packages/dts-test/defineComponent.test-d.tsx
index add9c8a3fc0..32912dd9a2a 100644
--- a/packages/dts-test/defineComponent.test-d.tsx
+++ b/packages/dts-test/defineComponent.test-d.tsx
@@ -1414,6 +1414,8 @@ describe('slots', () => {
     slots: Object as SlotsType<{
       default: { foo: string; bar: number }
       optional?: { data: string }
+      undefinedScope: undefined | { data: string }
+      optionalUndefinedScope?: undefined | { data: string }
     }>,
     setup(props, { slots }) {
       expectType<(scope: { foo: string; bar: number }) => VNode[]>(
@@ -1429,6 +1431,33 @@ describe('slots', () => {
       slots.optional({ data: 'foo' })
       slots.optional?.({ data: 'foo' })
 
+      expectType<{
+        (): VNode[]
+        (scope: undefined | { data: string }): VNode[]
+      }>(slots.undefinedScope)
+
+      expectType<
+        | { (): VNode[]; (scope: undefined | { data: string }): VNode[] }
+        | undefined
+      >(slots.optionalUndefinedScope)
+
+      slots.default({ foo: 'foo', bar: 1 })
+      // @ts-expect-error it's optional
+      slots.optional({ data: 'foo' })
+      slots.optional?.({ data: 'foo' })
+      slots.undefinedScope()
+      slots.undefinedScope(undefined)
+      // @ts-expect-error
+      slots.undefinedScope('foo')
+
+      slots.optionalUndefinedScope?.()
+      slots.optionalUndefinedScope?.(undefined)
+      slots.optionalUndefinedScope?.({ data: 'foo' })
+      // @ts-expect-error
+      slots.optionalUndefinedScope()
+      // @ts-expect-error
+      slots.optionalUndefinedScope?.('foo')
+
       expectType<typeof slots | undefined>(new comp1().$slots)
     }
   })
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index 1a0db39cadb..e48fae98ee7 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -25,7 +25,7 @@ import { DeprecationTypes, isCompatEnabled } from './compat/compatConfig'
 import { toRaw } from '@vue/reactivity'
 
 export type Slot<T extends any = any> = (
-  ...args: IfAny<T, any[], [T]>
+  ...args: IfAny<T, any[], [T] | (T extends undefined ? [] : never)>
 ) => VNode[]
 
 export type InternalSlots = {
@@ -44,7 +44,7 @@ export type TypedSlots<S extends SlotsType> = [keyof S] extends [never]
   : Readonly<
       Prettify<{
         [K in keyof NonNullable<S[typeof SlotSymbol]>]: Slot<
-          NonNullable<NonNullable<S[typeof SlotSymbol]>[K]>
+          NonNullable<S[typeof SlotSymbol]>[K]
         >
       }>
     >

From e7742dac919b36f8e654f42bf97d444c25cb46a8 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: Fri, 31 Mar 2023 02:51:38 +0800
Subject: [PATCH 12/14] test: improve

---
 .../__snapshots__/compileScript.spec.ts.snap  | 18 ++---
 .../__tests__/compileScript.spec.ts           | 65 ++++++++++---------
 2 files changed, 44 insertions(+), 39 deletions(-)

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
index c4cec4779bd..ee00977c131 100644
--- a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
+++ b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -1785,45 +1785,45 @@ return { props, emit }
 })"
 `;
 
-exports[`SFC compile <script setup> > with TypeScript > defineSlots 1`] = `
+exports[`SFC compile <script setup> > with TypeScript > defineSlots() > basic usage 1`] = `
 "import { useSlots as _useSlots, defineComponent as _defineComponent } from 'vue'
 
 export default /*#__PURE__*/_defineComponent({
   setup(__props, { expose: __expose }) {
   __expose();
 
-      const slots = _useSlots()
-      
+          const slots = _useSlots()
+          
 return { slots }
 }
 
 })"
 `;
 
-exports[`SFC compile <script setup> > with TypeScript > defineSlots w/o generic params 1`] = `
+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()
-      
+          const slots = _useSlots()
+          
 return { slots }
 }
 
 }"
 `;
 
-exports[`SFC compile <script setup> > with TypeScript > defineSlots w/o return value 1`] = `
+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 {  }
 }
 
diff --git a/packages/compiler-sfc/__tests__/compileScript.spec.ts b/packages/compiler-sfc/__tests__/compileScript.spec.ts
index 5fdccdc7963..25bfce72bd2 100644
--- a/packages/compiler-sfc/__tests__/compileScript.spec.ts
+++ b/packages/compiler-sfc/__tests__/compileScript.spec.ts
@@ -1585,38 +1585,43 @@ const emit = defineEmits(['a', 'b'])
       assertCode(content)
     })
 
-    test('defineSlots', () => {
-      const { content } = compile(`
-      <script setup lang="ts">
-      const slots = defineSlots<{
-        default: { msg: string }
-      }>()
-      </script>
-      `)
-      assertCode(content)
-      expect(content).toMatch(`const slots = _useSlots()`)
-    })
+    describe('defineSlots()', () => {
+      test('basic usage', () => {
+        const { content } = compile(`
+          <script setup lang="ts">
+          const slots = defineSlots<{
+            default: { msg: string }
+          }>()
+          </script>
+        `)
+        assertCode(content)
+        expect(content).toMatch(`const slots = _useSlots()`)
+        expect(content).not.toMatch('defineSlots')
+      })
 
-    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('w/o return value', () => {
+        const { content } = compile(`
+          <script setup lang="ts">
+          defineSlots<{
+            default: { msg: string }
+          }>()
+          </script>
+        `)
+        assertCode(content)
+        expect(content).not.toMatch('defineSlots')
+        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('w/o generic params', () => {
+        const { content } = compile(`
+          <script setup>
+          const slots = defineSlots()
+          </script>
+        `)
+        assertCode(content)
+        expect(content).toMatch(`const slots = _useSlots()`)
+        expect(content).not.toMatch('defineSlots')
+      })
     })
 
     test('runtime Enum', () => {

From b6d421c7e8353f0621c2a35f06c83b3222b609db Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Mon, 3 Apr 2023 15:21:08 +0800
Subject: [PATCH 13/14] test: improve functional slots test case

---
 .../dts-test/functionalComponent.test-d.tsx   | 29 ++++++++++++++-----
 .../runtime-core/src/componentRenderUtils.ts  |  2 +-
 2 files changed, 23 insertions(+), 8 deletions(-)

diff --git a/packages/dts-test/functionalComponent.test-d.tsx b/packages/dts-test/functionalComponent.test-d.tsx
index 37e2c9c9f91..827e8d63fe7 100644
--- a/packages/dts-test/functionalComponent.test-d.tsx
+++ b/packages/dts-test/functionalComponent.test-d.tsx
@@ -69,13 +69,28 @@ const Qux: FunctionalComponent<{}, ['foo', 'bar']> = (props, { emit }) => {
 
 expectType<Component>(Qux)
 
-const Quux: FunctionalComponent<{}, {}, { default: { foo: number } }> = (
-  props,
-  { emit, slots }
-) => {
-  expectType<{ default: undefined | ((scope: { foo: number }) => VNode[]) }>(
-    slots
-  )
+const Quux: FunctionalComponent<
+  {},
+  {},
+  {
+    default: { foo: number }
+    optional?: { foo: number }
+  }
+> = (props, { emit, slots }) => {
+  expectType<{
+    default: (scope: { foo: number }) => VNode[]
+    optional?: (scope: { foo: number }) => VNode[]
+  }>(slots)
+
+  slots.default({ foo: 123 })
+  // @ts-expect-error
+  slots.default({ foo: 'fesf' })
+
+  slots.optional?.({ foo: 123 })
+  // @ts-expect-error
+  slots.optional?.({ foo: 'fesf' })
+  // @ts-expect-error
+  slots.optional({ foo: 123 })
 }
 expectType<Component>(Quux)
 ;<Quux />
diff --git a/packages/runtime-core/src/componentRenderUtils.ts b/packages/runtime-core/src/componentRenderUtils.ts
index 194ac30fa2a..d9de968a074 100644
--- a/packages/runtime-core/src/componentRenderUtils.ts
+++ b/packages/runtime-core/src/componentRenderUtils.ts
@@ -102,7 +102,7 @@ export function renderComponentRoot(
                       markAttrsAccessed()
                       return attrs
                     },
-                    slots: slots,
+                    slots,
                     emit
                   }
                 : { attrs, slots, emit }

From 31fa03668b9589141f5e4e1c995558bff121574d Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Mon, 3 Apr 2023 16:43:02 +0800
Subject: [PATCH 14/14] feat: support using full function types in defineSlots

---
 packages/dts-test/setupHelpers.test-d.ts    |  9 +++++++++
 packages/runtime-core/src/componentSlots.ts | 11 +++++++----
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/packages/dts-test/setupHelpers.test-d.ts b/packages/dts-test/setupHelpers.test-d.ts
index ab7ab874f91..13d80947c83 100644
--- a/packages/dts-test/setupHelpers.test-d.ts
+++ b/packages/dts-test/setupHelpers.test-d.ts
@@ -182,6 +182,7 @@ describe('defineEmits w/ runtime declaration', () => {
 })
 
 describe('defineSlots', () => {
+  // short syntax
   const slots = defineSlots<{
     default: { foo: string; bar: number }
     optional?: string
@@ -189,6 +190,14 @@ describe('defineSlots', () => {
   expectType<(scope: { foo: string; bar: number }) => VNode[]>(slots.default)
   expectType<undefined | ((scope: string) => VNode[])>(slots.optional)
 
+  // literal fn syntax (allow for specifying return type)
+  const fnSlots = defineSlots<{
+    default(props: { foo: string; bar: number }): any
+    optional?(props: string): any
+  }>()
+  expectType<(scope: { foo: string; bar: number }) => VNode[]>(fnSlots.default)
+  expectType<undefined | ((scope: string) => VNode[])>(fnSlots.optional)
+
   const slotsUntype = defineSlots()
   expectType<Slots>(slotsUntype)
 })
diff --git a/packages/runtime-core/src/componentSlots.ts b/packages/runtime-core/src/componentSlots.ts
index e48fae98ee7..81988599981 100644
--- a/packages/runtime-core/src/componentSlots.ts
+++ b/packages/runtime-core/src/componentSlots.ts
@@ -39,13 +39,16 @@ export type SlotsType<T extends Record<string, any> = Record<string, any>> = {
   [SlotSymbol]?: T
 }
 
-export type TypedSlots<S extends SlotsType> = [keyof S] extends [never]
+export type TypedSlots<
+  S extends SlotsType,
+  T = NonNullable<S[typeof SlotSymbol]>
+> = [keyof S] extends [never]
   ? Slots
   : Readonly<
       Prettify<{
-        [K in keyof NonNullable<S[typeof SlotSymbol]>]: Slot<
-          NonNullable<S[typeof SlotSymbol]>[K]
-        >
+        [K in keyof T]: NonNullable<T[K]> extends (...args: any[]) => any
+          ? T[K]
+          : Slot<T[K]>
       }>
     >