feat: Nest modal support (#14320)

* feat: nested modal support

* fix: revert portal change

* fix: revert modal background change and add escape

* fix: reorder props

* fix: add prevent default

* fix: remove nested modal story

* fix: revert additional changes to modal story code

* fix: stopPropagation not preventDefault

---------

Co-authored-by: Taylor Jones <tay1orjones@users.noreply.github.com>

packages/react/src/components/ComposedModal/ComposedModal.tsx

@@ -242,7 +242,7 @@ const ComposedModal = React.forwardRef<HTMLDivElement, ComposedModalProps>(
     const startSentinel = useRef<HTMLButtonElement>(null);
     const endSentinel = useRef<HTMLButtonElement>(null);
 
-    // Kepp track of modal open/close state
+    // Keep track of modal open/close state
     // and propagate it to the document.body
     useEffect(() => {
       if (open !== wasOpen) {
@@ -259,13 +259,15 @@ const ComposedModal = React.forwardRef<HTMLDivElement, ComposedModalProps>(
     }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
     function handleKeyDown(evt: KeyboardEvent) {
+      evt.stopPropagation();
       if (match(evt, keys.Escape)) {
         closeModal(evt);
       }
 
       onKeyDown?.(evt);
     }
     function handleMousedown(evt: MouseEvent) {
+      evt.stopPropagation();
       const isInside = innerModal.current?.contains(evt.target as Node);
       if (!isInside && !preventCloseOnClickOutside) {
         closeModal(evt);

packages/react/src/components/Modal/Modal.tsx

@@ -279,6 +279,7 @@ const Modal = React.forwardRef(function Modal(
   }
 
   function handleKeyDown(evt: React.KeyboardEvent<HTMLDivElement>) {
+    evt.stopPropagation();
     if (open) {
       if (match(evt, keys.Escape)) {
         onRequestClose(evt);
@@ -295,6 +296,7 @@ const Modal = React.forwardRef(function Modal(
 
   function handleMousedown(evt: React.MouseEvent<HTMLDivElement>) {
     const target = evt.target as Node;
+    evt.stopPropagation();
     if (
       innerModal.current &&
       !innerModal.current.contains(target) &&