refactor(types): use explicit modifiers type (#10856)

Author: btea

packages/dts-test/defineComponent.test-d.tsx

@@ -1501,7 +1501,7 @@ describe('should work when props type is incompatible with setup returned type '
 
 describe('withKeys and withModifiers as pro', () => {
   const onKeydown = withKeys(e => {}, [''])
-  const onClick = withModifiers(e => {}, [''])
+  const onClick = withModifiers(e => {}, [])
   ;<input onKeydown={onKeydown} onClick={onClick} />
 })
 

packages/runtime-dom/__tests__/directives/vOn.spec.ts

@@ -43,7 +43,7 @@ describe('runtime-dom: v-on directive', () => {
   })
 
   test('it should support key modifiers and system modifiers', () => {
-    const keyNames = ['ctrl', 'shift', 'meta', 'alt']
+    const keyNames = ['ctrl', 'shift', 'meta', 'alt'] as const
 
     keyNames.forEach(keyName => {
       const el = document.createElement('div')

packages/runtime-dom/src/directives/vOn.ts

@@ -10,9 +10,21 @@ import { hyphenate, isArray } from '@vue/shared'
 const systemModifiers = ['ctrl', 'shift', 'alt', 'meta']
 
 type KeyedEvent = KeyboardEvent | MouseEvent | TouchEvent
+type ModifierGuardsKeys =
+  | 'stop'
+  | 'prevent'
+  | 'self'
+  | 'ctrl'
+  | 'shift'
+  | 'alt'
+  | 'meta'
+  | 'left'
+  | 'middle'
+  | 'right'
+  | 'exact'
 
 const modifierGuards: Record<
-  string,
+  ModifierGuardsKeys,
   (e: Event, modifiers: string[]) => void | boolean
 > = {
   stop: e => e.stopPropagation(),
@@ -36,7 +48,7 @@ export const withModifiers = <
   T extends (event: Event, ...args: unknown[]) => any,
 >(
   fn: T & { _withMods?: { [key: string]: T } },
-  modifiers: string[],
+  modifiers: ModifierGuardsKeys[],
 ) => {
   const cache = fn._withMods || (fn._withMods = {})
   const cacheKey = modifiers.join('.')