Fix autofocusing Emoji reaction picker search

This commit is contained in:
Samuel Newman
2026-05-22 22:13:24 +03:00
parent 96ae32b78e
commit 1d6d46df9d
4 changed files with 20 additions and 1 deletions
+1
View File
@@ -98,6 +98,7 @@ export function Outer({
}: React.PropsWithChildren<{
showCancel?: boolean
style?: StyleProp<ViewStyle>
onCloseAutoFocus?: (event: Event) => void
}>) {
const context = useMenuContext()
const {_} = useLingui()
+5
View File
@@ -181,9 +181,13 @@ export function Trigger({
export function Outer({
children,
style,
onCloseAutoFocus,
}: React.PropsWithChildren<{
showCancel?: boolean
style?: StyleProp<ViewStyle>
onCloseAutoFocus?: React.ComponentProps<
typeof DropdownMenu.Content
>['onCloseAutoFocus']
}>) {
const t = useTheme()
const {reduceMotionEnabled} = useA11y()
@@ -195,6 +199,7 @@ export function Outer({
collisionPadding={{left: 5, right: 5, bottom: 5}}
loop
aria-label="Test"
onCloseAutoFocus={onCloseAutoFocus}
className="dropdown-menu-transform-origin dropdown-menu-constrain-size">
<View
style={[
+13 -1
View File
@@ -68,7 +68,19 @@ function MenuInner({
return expanded ? (
<EmojiPicker.Picker keepOpenWhenShiftHeld={false} />
) : (
<Menu.Outer style={[a.rounded_full]}>
<Menu.Outer
style={[a.rounded_full]}
onCloseAutoFocus={evt => {
// If something has already taken focus (e.g. emoji-mart's search
// input when swapping to the full picker), don't let Radix restore
// focus to the trigger and steal it back.
if (
document.activeElement &&
document.activeElement !== document.body
) {
evt.preventDefault()
}
}}>
<View style={[a.flex_row, a.gap_xs]}>
{['❤️', '👍', '😆', '👀', '😢'].map(emoji => {
const alreadyReacted = hasAlreadyReacted(
+1
View File
@@ -217,6 +217,7 @@ let MessageItem = ({
const avatar =
profile && moderationOpts ? (
<Link
style={[a.rounded_full]}
label={l`${createSanitizedDisplayName(profile)}s avatar`}
accessibilityHint={l`Opens this profile`}
to={makeProfileLink({