FunPicker: Keep emoji picker open on select for composition inputs

ts/components/fun/base/FunPopover.tsx

@@ -1,7 +1,7 @@
 // Copyright 2025 Signal Messenger, LLC
 // SPDX-License-Identifier: AGPL-3.0-only
 import type { ReactNode } from 'react';
-import React from 'react';
+import React, { useCallback } from 'react';
 import type { Placement } from 'react-aria';
 import { Dialog, Popover } from 'react-aria-components';
 import classNames from 'classnames';
@@ -14,6 +14,18 @@ export type FunPopoverProps = Readonly<{
 }>;
 
 export function FunPopover(props: FunPopoverProps): JSX.Element {
+  const shouldCloseOnInteractOutside = useCallback(
+    (element: Element): boolean => {
+      // Don't close when quill steals focus
+      const match = element.closest('.module-composition-input__input');
+      if (match != null) {
+        return false;
+      }
+      return true;
+    },
+    []
+  );
+
   return (
     <Popover
       data-fun-overlay
@@ -22,6 +34,7 @@ export function FunPopover(props: FunPopoverProps): JSX.Element {
         'dark-theme': props.theme === ThemeType.dark,
       })}
       placement={props.placement}
+      shouldCloseOnInteractOutside={shouldCloseOnInteractOutside}
     >
       <Dialog className="FunPopover__Dialog">{props.children}</Dialog>
     </Popover>