fix(emcn): compose consumer dismiss handlers instead of replacing the guard

ModalContent's own onEscapeKeyDown/onInteractOutside sit before the `{...props}`
spread, so a consumer passing either replaced them — dropping both the
dismissDisabled interlock and the floating-layer guard that keeps a popper
dismissal from closing the modal and freezing the page. The TSDoc argued the
guard had to live here for exactly that reason, then left the same spread able
to defeat it.

Both handlers are now destructured out of props and invoked after the guard, so
the guard always runs and a consumer can still observe or extend the event. No
consumer passes either today, so this was latent rather than live.

Author: waleedlatif1

packages/emcn/src/components/chip-modal/chip-modal.test.tsx

@@ -4,6 +4,7 @@
 import { act, type ReactNode } from 'react'
 import { createRoot, type Root } from 'react-dom/client'
 import { afterEach, describe, expect, it, vi } from 'vitest'
+import { Modal, ModalContent, ModalHeader } from '../modal/modal'
 import { ChipConfirmModal, ChipModal, ChipModalFooter, ChipModalHeader } from './chip-modal'
 
 vi.mock('next/navigation', () => ({
@@ -147,6 +148,37 @@ describe('ChipModal dismissDisabled', () => {
   })
 })
 
+describe('ModalContent dismissDisabled', () => {
+  it('runs a consumer escape handler without letting it drop the guard', () => {
+    const onOpenChange = vi.fn()
+    const onEscapeKeyDown = vi.fn()
+    mount(
+      <Modal open onOpenChange={onOpenChange}>
+        <ModalContent srTitle='Guarded' dismissDisabled onEscapeKeyDown={onEscapeKeyDown}>
+          <input aria-label='Field' />
+        </ModalContent>
+      </Modal>
+    )
+
+    pressEscape()
+    expect(onEscapeKeyDown).toHaveBeenCalled()
+    expect(onOpenChange).not.toHaveBeenCalled()
+  })
+
+  it('disables the built-in ModalHeader close button', () => {
+    const onOpenChange = vi.fn()
+    mount(
+      <Modal open onOpenChange={onOpenChange}>
+        <ModalContent srTitle='Guarded' dismissDisabled>
+          <ModalHeader>Title</ModalHeader>
+        </ModalContent>
+      </Modal>
+    )
+
+    expect(closeButton().disabled).toBe(true)
+  })
+})
+
 describe('ChipConfirmModal pending', () => {
   it('holds every exit shut while the confirm runs', () => {
     const onOpenChange = vi.fn()

packages/emcn/src/components/modal/modal.tsx

@@ -469,10 +469,9 @@ export interface ModalContentProps
    * clicking outside, and `ModalHeader`'s close button. Descendants read it via
    * {@link useModalDismissDisabled}.
    *
-   * The Radix paths are handled here rather than through a consumer-passed
-   * `onEscapeKeyDown` / `onInteractOutside` because `{...props}` is spread after
-   * this component's own handlers, so a consumer overriding either would
-   * silently drop the floating-layer guard below.
+   * A consumer's own `onEscapeKeyDown` / `onInteractOutside` runs after this
+   * guard rather than replacing it, so neither the interlock nor the
+   * floating-layer guard can be dropped by passing a handler.
    * @default false
    */
   dismissDisabled?: boolean
@@ -497,6 +496,8 @@ const ModalContent = React.forwardRef<
       dismissDisabled = false,
       style,
       onOpenAutoFocus,
+      onEscapeKeyDown,
+      onInteractOutside,
       'aria-describedby': ariaDescribedBy,
       ...props
     },
@@ -601,6 +602,7 @@ const ModalContent = React.forwardRef<
               // Radix reads `defaultPrevented`; stopPropagation alone would not block it.
               if (dismissDisabled) e.preventDefault()
               e.stopPropagation()
+              onEscapeKeyDown?.(e)
             }}
             onPointerDown={(e) => {
               e.stopPropagation()
@@ -626,6 +628,7 @@ const ModalContent = React.forwardRef<
               if (dismissDisabled || hasOpenFloatingLayer()) {
                 e.preventDefault()
               }
+              onInteractOutside?.(e)
             }}
             onOpenAutoFocus={(event) => {
               // Radix fires this once when the (still invisible) Content