Fix UIExplorer headings accessibility

This commit is contained in:
Nicolas Gallagher
2018-11-07 21:38:26 -08:00
parent 5db9a765b0
commit 220eb79357
3 changed files with 12 additions and 4 deletions

View File

@@ -14,12 +14,12 @@ class AppText extends React.PureComponent {
};
render() {
const { style, ...rest } = this.props;
const { accessibilityRole, style, ...rest } = this.props;
const isInAParentText = this.context;
return (
<Text
{...rest}
accessibilityRole={rest.href ? 'link' : undefined}
accessibilityRole={rest.href ? 'link' : accessibilityRole}
style={[!isInAParentText && styles.baseText, style, rest.href && styles.link]}
/>
);

View File

@@ -8,7 +8,11 @@ import AppText from './AppText';
import React from 'react';
import { StyleSheet, View } from 'react-native';
const SectionTitle = ({ children }) => <AppText style={styles.sectionTitle}>{children}</AppText>;
const SectionTitle = ({ children }) => (
<AppText accessibilityRole="heading" aria-level="2" style={styles.sectionTitle}>
{children}
</AppText>
);
const Section = ({ children, title }) => (
<View>

View File

@@ -10,7 +10,11 @@ import insertBetween from './insertBetween';
import React from 'react';
import { StyleSheet, View } from 'react-native';
const Title = ({ children }) => <AppText style={styles.title}>{children}</AppText>;
const Title = ({ children }) => (
<AppText accessibilityRole="heading" style={styles.title}>
{children}
</AppText>
);
export const Description = ({ children }) => (
<AppText style={styles.description}>