diff options
| author | Ollie H <renahlee@outlook.com> | 2023-05-01 18:38:47 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2023-05-01 20:38:47 -0500 |
| commit | 83959c595d52ceb7aa4e3f68441c5ac41c389ebc (patch) | |
| tree | 3385d9a16e90fc8d5290ebdef104f922c17642a9 /src/view/com/util/images/ImageHorzList.tsx | |
| parent | c75c888de2407d3314cad07989174201313facaa (diff) | |
| download | voidsky-83959c595d52ceb7aa4e3f68441c5ac41c389ebc.tar.zst | |
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>
Diffstat (limited to 'src/view/com/util/images/ImageHorzList.tsx')
| -rw-r--r-- | src/view/com/util/images/ImageHorzList.tsx | 22 |
1 files changed, 20 insertions, 2 deletions
diff --git a/src/view/com/util/images/ImageHorzList.tsx b/src/view/com/util/images/ImageHorzList.tsx index 5c232e0b4..88494bba3 100644 --- a/src/view/com/util/images/ImageHorzList.tsx +++ b/src/view/com/util/images/ImageHorzList.tsx @@ -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> ))} |