Fix space key opening lightbox on image reactions

Co-authored-by: Jamie Kyle <113370520+jamiebuilds-signal@users.noreply.github.com>

ts/components/fun/base/FunPopover.tsx

@@ -1,6 +1,6 @@
 // Copyright 2025 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
-import type { ReactNode } from 'react';
+import type { KeyboardEvent, ReactNode } from 'react';
 import React, { useCallback } from 'react';
 import type { Placement } from 'react-aria';
 import { Dialog, Popover } from 'react-aria-components';
@@ -33,19 +33,27 @@ export function FunPopover(props: FunPopoverProps): JSX.Element {
     []
   );
 
+  const handleKeyDown = useCallback((event: KeyboardEvent) => {
+    event.stopPropagation();
+  }, []);
+
   return (
     <Tooltip.Provider>
-      <Popover
+      {/* Prevents keyboard events from bubbling up outside of the popover */}
-        data-fun-overlay
+      {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}
-        className={classNames('FunPopover', {
+      <div onKeyDown={handleKeyDown}>
-          'light-theme': props.theme === ThemeType.light,
+        <Popover
-          'dark-theme': props.theme === ThemeType.dark,
+          data-fun-overlay
-        })}
+          className={classNames('FunPopover', {
-        placement={props.placement}
+            'light-theme': props.theme === ThemeType.light,
-        shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}
+            'dark-theme': props.theme === ThemeType.dark,
-      >
+          })}
-        <Dialog className="FunPopover__Dialog">{props.children}</Dialog>
+          placement={props.placement}
-      </Popover>
+          shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}
+        >
+          <Dialog className="FunPopover__Dialog">{props.children}</Dialog>
+        </Popover>
+      </div>
     </Tooltip.Provider>
   );
 }