feat(Modal/Popover/Slideover): add close:prevent event (#3958)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>

src/runtime/components/Modal.vue

@@ -55,6 +55,7 @@ export interface ModalProps extends DialogRootProps {
 
 export interface ModalEmits extends DialogRootEmits {
   'after:leave': []
+  'close:prevent': []
 }
 
 export interface ModalSlots {
@@ -97,20 +98,23 @@ const rootProps = useForwardPropsEmits(reactivePick(props, 'open', 'defaultOpen'
 const portalProps = usePortal(toRef(() => props.portal))
 const contentProps = toRef(() => props.content)
 const contentEvents = computed(() => {
-  const events = {
+  const defaultEvents = {
     closeAutoFocus: (e: Event) => e.preventDefault()
   }
 
   if (!props.dismissible) {
-    return {
-      pointerDownOutside: (e: Event) => e.preventDefault(),
-      interactOutside: (e: Event) => e.preventDefault(),
-      escapeKeyDown: (e: Event) => e.preventDefault(),
-      ...events
-    }
+    const events = ['pointerDownOutside', 'interactOutside', 'escapeKeyDown', 'closeAutoFocus'] as const
+    type EventType = typeof events[number]
+    return events.reduce((acc, curr) => {
+      acc[curr] = (e: Event) => {
+        e.preventDefault()
+        emits('close:prevent')
+      }
+      return acc
+    }, {} as Record<EventType, (e: Event) => void>)
   }
 
-  return events
+  return defaultEvents
 })
 
 const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.modal || {}) })({