-
Notifications
You must be signed in to change notification settings - Fork 725
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
ExpandableOverlay - Focus accessibility after overlay close #3503
ExpandableOverlay - Focus accessibility after overlay close #3503
Conversation
|
||
export interface ExpandableOverlayMethods { | ||
openExpandable: () => void; | ||
closeExpandable: () => void; | ||
toggleExpandable: () => void; | ||
focusAccessibility: () => void; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't see a reason to expose focusAccessibility
, it is activated on close
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I thought I might need to use it in private but we don't and forgot to remove. Removed 👌
if (reactTag) { | ||
AccessibilityInfo.setAccessibilityFocus(reactTag); | ||
} | ||
}, [containerRef]); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
AFAIK you should not put a ref as a dependency, it won't trigger a change
}, [containerRef]); | |
}, []); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Mistake. Removed 👌
|
||
import TouchableOpacity, {TouchableOpacityProps} from '../../components/touchableOpacity'; | ||
import View from '../../components/view'; | ||
import Modal, {ModalProps, ModalTopBarProps} from '../../components/modal'; | ||
import DialogOld from '../../components/dialog'; | ||
import DialogNew, {DialogMigrationProps} from '../dialog'; | ||
import {Colors} from 'style'; | ||
import {AccessibilityInfo, findNodeHandle} from 'react-native'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We usually put more general imports higher up; for example I'd put react-native
below react
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Mistake 👌
Description
Focused accessibility after over closes. Passed a ref to the
TouchableOpacity
and set the accessibility focus on it manually when it closes.Changelog
ExpandableOverlay - Fix accessibility focus when overlay closes.
Additional info
MADS-4609