fix: event types

packages/runtime-core/src/h.ts

@@ -75,8 +75,14 @@ interface Constructor<P = any> {
   new (...args: any[]): { $props: P }
 }
 
+type CombineModifiers<T extends string, U extends string = T> = T extends any
+  ? T | `${T}${CombineModifiers<Exclude<U, T>>}`
+  : never
+
+type EventModifiers = CombineModifiers<'Capture' | 'Once' | 'Passive'> | ''
+
 type HTMLElementEventHandler = {
-  [K in keyof HTMLElementEventMap as `on${Capitalize<K>}`]?: (
+  [K in keyof HTMLElementEventMap as `on${Capitalize<K>}${EventModifiers}`]?: (
     ev: HTMLElementEventMap[K],
   ) => any
 }

packages/runtime-dom/src/jsx.ts

@@ -252,7 +252,7 @@ export type StyleValue =
   | CSSProperties
   | Array<StyleValue>
 
-export interface HTMLAttributes extends AriaAttributes, EventHandlers<Events> {
+export interface HTMLAttributes extends AriaAttributes, EventHandlers {
   innerHTML?: string
 
   class?: any
@@ -808,7 +808,7 @@ export interface WebViewHTMLAttributes extends HTMLAttributes {
   webpreferences?: string
 }
 
-export interface SVGAttributes extends AriaAttributes, EventHandlers<Events> {
+export interface SVGAttributes extends AriaAttributes, EventHandlers {
   innerHTML?: string
 
   /**
@@ -1384,10 +1384,14 @@ export interface Events {
   onTransitionstart: TransitionEvent
 }
 
-type EventHandlers<E> = {
+type CombineModifiers<T extends string, U extends string = T> = T extends any
-  [K in keyof E]?: E[K] extends (...args: any) => any
+  ? T | `${T}${CombineModifiers<Exclude<U, T>>}`
-    ? E[K]
+  : never
-    : (payload: E[K]) => void
+
+type EventModifiers = CombineModifiers<'Capture' | 'Once' | 'Passive'> | ''
+
+type EventHandlers = {
+  [K in keyof Events as `${K}${EventModifiers}`]?: (payload: Events[K]) => void
 }
 
 import type { VNodeRef } from '@vue/runtime-core'