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:
parent
c75c888de2
commit
83959c595d
86 changed files with 2479 additions and 1827 deletions
|
@ -1,4 +1,4 @@
|
|||
import React from 'react'
|
||||
import React, {ComponentProps} from 'react'
|
||||
import {observer} from 'mobx-react-lite'
|
||||
import {
|
||||
Linking,
|
||||
|
@ -29,6 +29,16 @@ type Event =
|
|||
| React.MouseEvent<HTMLAnchorElement, MouseEvent>
|
||||
| GestureResponderEvent
|
||||
|
||||
interface Props extends ComponentProps<typeof TouchableOpacity> {
|
||||
testID?: string
|
||||
style?: StyleProp<ViewStyle>
|
||||
href?: string
|
||||
title?: string
|
||||
children?: React.ReactNode
|
||||
noFeedback?: boolean
|
||||
asAnchor?: boolean
|
||||
}
|
||||
|
||||
export const Link = observer(function Link({
|
||||
testID,
|
||||
style,
|
||||
|
@ -37,15 +47,9 @@ export const Link = observer(function Link({
|
|||
children,
|
||||
noFeedback,
|
||||
asAnchor,
|
||||
}: {
|
||||
testID?: string
|
||||
style?: StyleProp<ViewStyle>
|
||||
href?: string
|
||||
title?: string
|
||||
children?: React.ReactNode
|
||||
noFeedback?: boolean
|
||||
asAnchor?: boolean
|
||||
}) {
|
||||
accessible,
|
||||
...props
|
||||
}: Props) {
|
||||
const store = useStores()
|
||||
const navigation = useNavigation<NavigationProp>()
|
||||
|
||||
|
@ -64,7 +68,10 @@ export const Link = observer(function Link({
|
|||
testID={testID}
|
||||
onPress={onPress}
|
||||
// @ts-ignore web only -prf
|
||||
href={asAnchor ? sanitizeUrl(href) : undefined}>
|
||||
href={asAnchor ? sanitizeUrl(href) : undefined}
|
||||
accessible={accessible}
|
||||
accessibilityRole="link"
|
||||
{...props}>
|
||||
<View style={style}>
|
||||
{children ? children : <Text>{title || 'link'}</Text>}
|
||||
</View>
|
||||
|
@ -76,8 +83,11 @@ export const Link = observer(function Link({
|
|||
testID={testID}
|
||||
style={style}
|
||||
onPress={onPress}
|
||||
accessible={accessible}
|
||||
accessibilityRole="link"
|
||||
// @ts-ignore web only -prf
|
||||
href={asAnchor ? sanitizeUrl(href) : undefined}>
|
||||
href={asAnchor ? sanitizeUrl(href) : undefined}
|
||||
{...props}>
|
||||
{children ? children : <Text>{title || 'link'}</Text>}
|
||||
</TouchableOpacity>
|
||||
)
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue