From a41409ed02a8c7220e637f56caf6813edeb077f8 Mon Sep 17 00:00:00 2001
From: Carles Mitjans <carles.mitjans.coma@gmail.com>
Date: Mon, 11 Dec 2023 15:07:24 +0100
Subject: [PATCH] feat(types): support passing generics when registering global
 directives (#9660)

---
 packages/dts-test/appDirective.test-d.ts   | 14 ++++++++++++++
 packages/runtime-core/src/apiCreateApp.ts  |  4 ++--
 packages/runtime-core/src/compat/global.ts |  7 +++++--
 3 files changed, 21 insertions(+), 4 deletions(-)
 create mode 100644 packages/dts-test/appDirective.test-d.ts

diff --git a/packages/dts-test/appDirective.test-d.ts b/packages/dts-test/appDirective.test-d.ts
new file mode 100644
index 0000000000..0d7707a7c1
--- /dev/null
+++ b/packages/dts-test/appDirective.test-d.ts
@@ -0,0 +1,14 @@
+import { createApp } from 'vue'
+import { expectType } from './utils'
+
+const app = createApp({})
+
+app.directive<HTMLElement, string>('custom', {
+  mounted(el, binding) {
+    expectType<HTMLElement>(el)
+    expectType<string>(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 8ba9429f44..0afae35f0d 100644
--- a/packages/runtime-core/src/apiCreateApp.ts
+++ b/packages/runtime-core/src/apiCreateApp.ts
@@ -42,8 +42,8 @@ export interface App<HostElement = any> {
   mixin(mixin: ComponentOptions): this
   component(name: string): Component | undefined
   component(name: string, component: Component | DefineComponent): this
-  directive(name: string): Directive | undefined
-  directive(name: string, directive: Directive): this
+  directive<T = any, V = any>(name: string): Directive<T, V> | undefined
+  directive<T = any, V = any>(name: string, directive: Directive<T, V>): this
   mount(
     rootContainer: HostElement | string,
     isHydrate?: boolean,
diff --git a/packages/runtime-core/src/compat/global.ts b/packages/runtime-core/src/compat/global.ts
index 0379bb67e8..1e4d206eae 100644
--- a/packages/runtime-core/src/compat/global.ts
+++ b/packages/runtime-core/src/compat/global.ts
@@ -82,8 +82,11 @@ export type CompatVue = Pick<App, 'version' | 'component' | 'directive'> & {
 
   component(name: string): Component | undefined
   component(name: string, component: Component): CompatVue
-  directive(name: string): Directive | undefined
-  directive(name: string, directive: Directive): CompatVue
+  directive<T = any, V = any>(name: string): Directive<T, V> | undefined
+  directive<T = any, V = any>(
+    name: string,
+    directive: Directive<T, V>
+  ): CompatVue
 
   compile(template: string): RenderFunction
 
-- 
2.47.3