React Native accessibility (#539)

* React Native accessibility

* First round of changes

* Latest update

* Checkpoint

* Wrap up

* Lint

* Remove unhelpful image hints

* Fix navigation

* Fix rebase and lint

* Mitigate an known issue with the password entry in login

* Fix composer dismiss

* Remove focus on input elements for web

* Remove i and npm

* pls work

* Remove stray declaration

* Regenerate yarn.lock

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>
This commit is contained in:
Ollie H
2023-05-01 18:38:47 -07:00
committed by GitHub
parent c75c888de2
commit 83959c595d
86 changed files with 2479 additions and 1827 deletions
+20 -2
View File
@@ -16,15 +16,33 @@ interface Props {
}
export function ImageHorzList({images, onPress, style}: Props) {
const numImages = images.length
return (
<View style={[styles.flexRow, style]}>
{images.map(({thumb, alt}, i) => (
<TouchableWithoutFeedback key={i} onPress={() => onPress?.(i)}>
<TouchableWithoutFeedback
key={i}
onPress={() => onPress?.(i)}
accessible={true}
accessibilityLabel={`Open image ${i} of ${numImages}`}
accessibilityHint="Opens image in viewer"
accessibilityActions={[{name: 'press', label: 'Press'}]}
onAccessibilityAction={action => {
switch (action.nativeEvent.actionName) {
case 'press':
onPress?.(0)
break
default:
break
}
}}>
<Image
source={{uri: thumb}}
style={styles.image}
accessible={true}
accessibilityLabel={alt}
accessibilityIgnoresInvertColors
accessibilityHint={alt}
accessibilityLabel=""
/>
</TouchableWithoutFeedback>
))}