types: improve app.directive type generics (#11926)

diff --git a/packages-private/dts-test/appDirective.test-d.ts b/packages-private/dts-test/appDirective.test-d.ts
index 1ac5f64d19a3796cd57e3e6517fc1dee04a323aa..fb655a039d58c7f3e7b59e15b60d295906fa4acc 100644 (file)
--- a/packages-private/dts-test/appDirective.test-d.ts
+++ b/packages-private/dts-test/appDirective.test-d.ts
@@ -3,12 +3,17 @@ import { expectType } from './utils'
 
 const app = createApp({})
 
-app.directive<HTMLElement, string>('custom', {
-  mounted(el, binding) {
-    expectType<HTMLElement>(el)
-    expectType<string>(binding.value)
+app.directive<HTMLElement, string, 'prevent' | 'stop', 'arg1' | 'arg2'>(
+  'custom',
+  {
+    mounted(el, binding) {
+      expectType<HTMLElement>(el)
+      expectType<string>(binding.value)
+      expectType<{ prevent: boolean; stop: boolean }>(binding.modifiers)
+      expectType<'arg1' | 'arg2'>(binding.arg!)
 
-    // @ts-expect-error not any
-    expectType<number>(binding.value)
+      // @ts-expect-error not any
+      expectType<number>(binding.value)
+    },
   },
-})
+)

diff --git a/packages/runtime-core/src/apiCreateApp.ts b/packages/runtime-core/src/apiCreateApp.ts
index 7c016e12fcfc29fdd692490bc6ba6a681e6ad435..3d53716de08660f135ddfb33355c6c61cefbb4b6 100644 (file)
--- a/packages/runtime-core/src/apiCreateApp.ts
+++ b/packages/runtime-core/src/apiCreateApp.ts
@@ -46,8 +46,23 @@ export interface App<HostElement = any> {
     name: string,
     component: T,
   ): this
-  directive<T = any, V = any>(name: string): Directive<T, V> | undefined
-  directive<T = any, V = any>(name: string, directive: Directive<T, V>): this
+  directive<
+    HostElement = any,
+    Value = any,
+    Modifiers extends string = string,
+    Arg extends string = string,
+  >(
+    name: string,
+  ): Directive<HostElement, Value, Modifiers, Arg> | undefined
+  directive<
+    HostElement = any,
+    Value = any,
+    Modifiers extends string = string,
+    Arg extends string = string,
+  >(
+    name: string,
+    directive: Directive<HostElement, Value, Modifiers, Arg>,
+  ): this
   mount(
     rootContainer: HostElement | string,
     /**